@cuby-ui/core 0.0.180 → 0.0.181

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 (280) hide show
  1. package/README.md +24 -24
  2. package/components/accordion/accordion-item/accordion-item.component.d.ts +11 -11
  3. package/components/accordion/accordion.component.d.ts +5 -5
  4. package/components/accordion/accordion.module.d.ts +11 -11
  5. package/components/accordion/index.d.ts +3 -3
  6. package/components/alert/alert.component.d.ts +13 -13
  7. package/components/alert/alert.interfaces.d.ts +9 -9
  8. package/components/alert/alert.module.d.ts +11 -11
  9. package/components/alert/alert.service.d.ts +7 -7
  10. package/components/alert/alert.tokens.d.ts +16 -16
  11. package/components/alert/alert.types.d.ts +3 -3
  12. package/components/alert/alerts.component.d.ts +17 -17
  13. package/components/alert/index.d.ts +8 -8
  14. package/components/badge/badge.component.d.ts +10 -10
  15. package/components/badge/badge.module.d.ts +8 -8
  16. package/components/badge/badge.options.d.ts +8 -8
  17. package/components/badge/index.d.ts +2 -2
  18. package/components/banner/banner.component.d.ts +21 -21
  19. package/components/banner/banner.module.d.ts +11 -11
  20. package/components/banner/banner.options.d.ts +13 -13
  21. package/components/banner/index.d.ts +3 -3
  22. package/components/breadcrumbs/breadcrumb/breadcrumb.component.d.ts +6 -6
  23. package/components/breadcrumbs/breadcrumbs.component.d.ts +7 -7
  24. package/components/breadcrumbs/breadcrumbs.module.d.ts +10 -10
  25. package/components/breadcrumbs/index.d.ts +3 -3
  26. package/components/button/button.component.d.ts +38 -38
  27. package/components/button/button.module.d.ts +9 -9
  28. package/components/button/button.options.d.ts +9 -9
  29. package/components/button/index.d.ts +3 -3
  30. package/components/button-group/button-group.component.d.ts +5 -5
  31. package/components/button-group/button-group.module.d.ts +7 -7
  32. package/components/button-group/index.d.ts +2 -2
  33. package/components/checkbox/checkbox.component.d.ts +5 -5
  34. package/components/checkbox/checkbox.module.d.ts +7 -7
  35. package/components/checkbox/index.d.ts +2 -2
  36. package/components/context-menu/context-menu.component.d.ts +39 -39
  37. package/components/context-menu/context-menu.module.d.ts +9 -9
  38. package/components/context-menu/index.d.ts +2 -2
  39. package/components/dialog/dialog-actions/dialog-actions.component.d.ts +5 -5
  40. package/components/dialog/dialog-header/dialog-header.component.d.ts +13 -13
  41. package/components/dialog/dialog.component.d.ts +33 -33
  42. package/components/dialog/dialog.interfaces.d.ts +11 -11
  43. package/components/dialog/dialog.module.d.ts +14 -14
  44. package/components/dialog/dialog.service.d.ts +7 -7
  45. package/components/dialog/dialog.tokens.d.ts +8 -8
  46. package/components/dialog/dialogs.component.d.ts +18 -18
  47. package/components/dialog/index.d.ts +8 -8
  48. package/components/form-field/form-field.component.d.ts +5 -5
  49. package/components/form-field/form-field.module.d.ts +7 -7
  50. package/components/form-field/index.d.ts +2 -2
  51. package/components/hint/hint.component.d.ts +7 -7
  52. package/components/hint/hint.module.d.ts +7 -7
  53. package/components/hint/index.d.ts +2 -2
  54. package/components/icon-button/icon-button.component.d.ts +13 -13
  55. package/components/icon-button/icon-button.module.d.ts +9 -9
  56. package/components/icon-button/index.d.ts +2 -2
  57. package/components/index.d.ts +26 -26
  58. package/components/input-number/index.d.ts +2 -2
  59. package/components/input-number/input-number.component.d.ts +38 -38
  60. package/components/input-number/input-number.module.d.ts +12 -12
  61. package/components/input-password/index.d.ts +2 -2
  62. package/components/input-password/input-password.component.d.ts +31 -31
  63. package/components/input-password/input-password.module.d.ts +11 -11
  64. package/components/input-text/index.d.ts +2 -2
  65. package/components/input-text/input-text.component.d.ts +31 -31
  66. package/components/input-text/input-text.module.d.ts +11 -11
  67. package/components/input-time/index.d.ts +3 -3
  68. package/components/input-time/input-time.component.d.ts +36 -36
  69. package/components/input-time/input-time.module.d.ts +12 -12
  70. package/components/input-time/input-time.options.d.ts +7 -7
  71. package/components/label/index.d.ts +2 -2
  72. package/components/label/label.component.d.ts +6 -6
  73. package/components/label/label.module.d.ts +8 -8
  74. package/components/notification/index.d.ts +3 -3
  75. package/components/notification/notification.component.d.ts +18 -18
  76. package/components/notification/notification.module.d.ts +9 -9
  77. package/components/notification/notification.options.d.ts +17 -17
  78. package/components/radio/index.d.ts +2 -2
  79. package/components/radio/radio.component.d.ts +5 -5
  80. package/components/radio/radio.module.d.ts +7 -7
  81. package/components/root/index.d.ts +3 -3
  82. package/components/root/root.component.d.ts +11 -11
  83. package/components/root/root.module.d.ts +10 -10
  84. package/components/root/root.options.d.ts +1 -1
  85. package/components/select/index.d.ts +2 -2
  86. package/components/select/select.component.d.ts +53 -53
  87. package/components/select/select.module.d.ts +11 -11
  88. package/components/svg/index.d.ts +2 -2
  89. package/components/svg/svg.component.d.ts +16 -16
  90. package/components/svg/svg.module.d.ts +8 -8
  91. package/components/tabs/index.d.ts +3 -3
  92. package/components/tabs/tab/index.d.ts +1 -1
  93. package/components/tabs/tab/tab.component.d.ts +8 -8
  94. package/components/tabs/tabs.component.d.ts +16 -16
  95. package/components/tabs/tabs.module.d.ts +8 -8
  96. package/components/textarea/index.d.ts +2 -2
  97. package/components/textarea/textarea.component.d.ts +10 -10
  98. package/components/textarea/textarea.module.d.ts +7 -7
  99. package/components/toggle/index.d.ts +2 -2
  100. package/components/toggle/toggle.component.d.ts +5 -5
  101. package/components/toggle/toggle.module.d.ts +7 -7
  102. package/directives/index.d.ts +1 -1
  103. package/directives/text-field-controller/index.d.ts +8 -8
  104. package/directives/text-field-controller/text-field-controller.module.d.ts +11 -11
  105. package/directives/text-field-controller/text-field-controller.provider.d.ts +4 -4
  106. package/directives/text-field-controller/text-field-icon-left.directive.d.ts +9 -9
  107. package/directives/text-field-controller/text-field-id.directive.d.ts +8 -8
  108. package/directives/text-field-controller/text-field-is-error.directive.d.ts +8 -8
  109. package/directives/text-field-controller/text-field-placeholder.directive.d.ts +8 -8
  110. package/directives/text-field-controller/text-field-size.directive.d.ts +9 -9
  111. package/directives/text-field-controller/text-field.controller.d.ts +20 -20
  112. package/esm2020/components/accordion/accordion-item/accordion-item.component.mjs +28 -28
  113. package/esm2020/components/accordion/accordion.component.mjs +11 -11
  114. package/esm2020/components/accordion/accordion.module.mjs +37 -37
  115. package/esm2020/components/accordion/index.mjs +4 -4
  116. package/esm2020/components/alert/alert.component.mjs +36 -36
  117. package/esm2020/components/alert/alert.interfaces.mjs +2 -2
  118. package/esm2020/components/alert/alert.module.mjs +40 -40
  119. package/esm2020/components/alert/alert.service.mjs +17 -17
  120. package/esm2020/components/alert/alert.tokens.mjs +20 -20
  121. package/esm2020/components/alert/alert.types.mjs +2 -2
  122. package/esm2020/components/alert/alerts.component.mjs +36 -36
  123. package/esm2020/components/alert/index.mjs +9 -9
  124. package/esm2020/components/badge/badge.component.mjs +31 -31
  125. package/esm2020/components/badge/badge.module.mjs +18 -18
  126. package/esm2020/components/badge/badge.options.mjs +8 -8
  127. package/esm2020/components/badge/index.mjs +3 -3
  128. package/esm2020/components/banner/banner.component.mjs +68 -68
  129. package/esm2020/components/banner/banner.module.mjs +31 -31
  130. package/esm2020/components/banner/banner.options.mjs +6 -6
  131. package/esm2020/components/banner/index.mjs +4 -4
  132. package/esm2020/components/breadcrumbs/breadcrumb/breadcrumb.component.mjs +16 -16
  133. package/esm2020/components/breadcrumbs/breadcrumbs.component.mjs +17 -17
  134. package/esm2020/components/breadcrumbs/breadcrumbs.module.mjs +33 -33
  135. package/esm2020/components/breadcrumbs/index.mjs +4 -4
  136. package/esm2020/components/button/button.component.mjs +138 -138
  137. package/esm2020/components/button/button.module.mjs +24 -24
  138. package/esm2020/components/button/button.options.mjs +10 -10
  139. package/esm2020/components/button/index.mjs +4 -4
  140. package/esm2020/components/button-group/button-group.component.mjs +11 -11
  141. package/esm2020/components/button-group/button-group.module.mjs +16 -16
  142. package/esm2020/components/button-group/index.mjs +3 -3
  143. package/esm2020/components/checkbox/checkbox.component.mjs +11 -11
  144. package/esm2020/components/checkbox/checkbox.module.mjs +16 -16
  145. package/esm2020/components/checkbox/index.mjs +3 -3
  146. package/esm2020/components/context-menu/context-menu.component.mjs +146 -146
  147. package/esm2020/components/context-menu/context-menu.module.mjs +24 -24
  148. package/esm2020/components/context-menu/index.mjs +3 -3
  149. package/esm2020/components/dialog/dialog-actions/dialog-actions.component.mjs +11 -11
  150. package/esm2020/components/dialog/dialog-header/dialog-header.component.mjs +28 -28
  151. package/esm2020/components/dialog/dialog.component.mjs +67 -67
  152. package/esm2020/components/dialog/dialog.interfaces.mjs +2 -2
  153. package/esm2020/components/dialog/dialog.module.mjs +50 -50
  154. package/esm2020/components/dialog/dialog.service.mjs +17 -17
  155. package/esm2020/components/dialog/dialog.tokens.mjs +12 -12
  156. package/esm2020/components/dialog/dialogs.component.mjs +51 -51
  157. package/esm2020/components/dialog/index.mjs +9 -9
  158. package/esm2020/components/form-field/form-field.component.mjs +11 -11
  159. package/esm2020/components/form-field/form-field.module.mjs +16 -16
  160. package/esm2020/components/form-field/index.mjs +3 -3
  161. package/esm2020/components/hint/hint.component.mjs +19 -19
  162. package/esm2020/components/hint/hint.module.mjs +16 -16
  163. package/esm2020/components/hint/index.mjs +3 -3
  164. package/esm2020/components/icon-button/icon-button.component.mjs +32 -32
  165. package/esm2020/components/icon-button/icon-button.module.mjs +24 -24
  166. package/esm2020/components/icon-button/index.mjs +3 -3
  167. package/esm2020/components/index.mjs +27 -27
  168. package/esm2020/components/input-number/index.mjs +3 -3
  169. package/esm2020/components/input-number/input-number.component.mjs +113 -113
  170. package/esm2020/components/input-number/input-number.module.mjs +36 -36
  171. package/esm2020/components/input-password/index.mjs +3 -3
  172. package/esm2020/components/input-password/input-password.component.mjs +89 -89
  173. package/esm2020/components/input-password/input-password.module.mjs +33 -33
  174. package/esm2020/components/input-text/index.mjs +3 -3
  175. package/esm2020/components/input-text/input-text.component.mjs +87 -87
  176. package/esm2020/components/input-text/input-text.module.mjs +33 -33
  177. package/esm2020/components/input-time/index.mjs +4 -4
  178. package/esm2020/components/input-time/input-time.component.mjs +99 -99
  179. package/esm2020/components/input-time/input-time.module.mjs +36 -36
  180. package/esm2020/components/input-time/input-time.options.mjs +8 -8
  181. package/esm2020/components/label/index.mjs +3 -3
  182. package/esm2020/components/label/label.component.mjs +17 -17
  183. package/esm2020/components/label/label.module.mjs +18 -18
  184. package/esm2020/components/notification/index.mjs +4 -4
  185. package/esm2020/components/notification/notification.component.mjs +47 -47
  186. package/esm2020/components/notification/notification.module.mjs +24 -24
  187. package/esm2020/components/notification/notification.options.mjs +53 -53
  188. package/esm2020/components/radio/index.mjs +3 -3
  189. package/esm2020/components/radio/radio.component.mjs +11 -11
  190. package/esm2020/components/radio/radio.module.mjs +16 -16
  191. package/esm2020/components/root/index.mjs +4 -4
  192. package/esm2020/components/root/root.component.mjs +31 -31
  193. package/esm2020/components/root/root.module.mjs +28 -28
  194. package/esm2020/components/root/root.options.mjs +1 -1
  195. package/esm2020/components/select/index.mjs +3 -3
  196. package/esm2020/components/select/select.component.mjs +172 -172
  197. package/esm2020/components/select/select.module.mjs +32 -32
  198. package/esm2020/components/svg/index.mjs +3 -3
  199. package/esm2020/components/svg/svg.component.mjs +50 -50
  200. package/esm2020/components/svg/svg.module.mjs +18 -18
  201. package/esm2020/components/tabs/index.mjs +4 -4
  202. package/esm2020/components/tabs/tab/index.mjs +1 -1
  203. package/esm2020/components/tabs/tab/tab.component.mjs +21 -21
  204. package/esm2020/components/tabs/tabs.component.mjs +49 -49
  205. package/esm2020/components/tabs/tabs.module.mjs +18 -18
  206. package/esm2020/components/textarea/index.mjs +3 -3
  207. package/esm2020/components/textarea/textarea.component.mjs +35 -35
  208. package/esm2020/components/textarea/textarea.module.mjs +16 -16
  209. package/esm2020/components/toggle/index.mjs +3 -3
  210. package/esm2020/components/toggle/toggle.component.mjs +11 -11
  211. package/esm2020/components/toggle/toggle.module.mjs +16 -16
  212. package/esm2020/cuby-ui-core.mjs +4 -4
  213. package/esm2020/directives/index.mjs +2 -2
  214. package/esm2020/directives/text-field-controller/index.mjs +9 -9
  215. package/esm2020/directives/text-field-controller/text-field-controller.module.mjs +40 -40
  216. package/esm2020/directives/text-field-controller/text-field-controller.provider.mjs +24 -24
  217. package/esm2020/directives/text-field-controller/text-field-icon-left.directive.mjs +21 -21
  218. package/esm2020/directives/text-field-controller/text-field-id.directive.mjs +21 -21
  219. package/esm2020/directives/text-field-controller/text-field-is-error.directive.mjs +24 -24
  220. package/esm2020/directives/text-field-controller/text-field-placeholder.directive.mjs +21 -21
  221. package/esm2020/directives/text-field-controller/text-field-size.directive.mjs +24 -24
  222. package/esm2020/directives/text-field-controller/text-field.controller.mjs +25 -25
  223. package/esm2020/index.mjs +7 -7
  224. package/esm2020/interfaces/context-menu-item.mjs +2 -2
  225. package/esm2020/interfaces/index.mjs +3 -3
  226. package/esm2020/interfaces/option.mjs +2 -2
  227. package/esm2020/services/index.mjs +3 -3
  228. package/esm2020/services/theme.options.mjs +6 -6
  229. package/esm2020/services/theme.service.mjs +30 -30
  230. package/esm2020/types/appearance.mjs +2 -2
  231. package/esm2020/types/hint-type.mjs +2 -2
  232. package/esm2020/types/index.mjs +8 -8
  233. package/esm2020/types/position.mjs +2 -2
  234. package/esm2020/types/resizing.mjs +2 -2
  235. package/esm2020/types/shape.mjs +2 -2
  236. package/esm2020/types/size.mjs +2 -2
  237. package/esm2020/types/status.mjs +2 -2
  238. package/esm2020/utils/format/index.mjs +3 -3
  239. package/esm2020/utils/format/remove-spaces.mjs +4 -4
  240. package/esm2020/utils/format/replace.mjs +5 -5
  241. package/esm2020/utils/index.mjs +2 -2
  242. package/fesm2015/cuby-ui-core.mjs +2145 -2145
  243. package/fesm2015/cuby-ui-core.mjs.map +1 -1
  244. package/fesm2020/cuby-ui-core.mjs +2145 -2145
  245. package/fesm2020/cuby-ui-core.mjs.map +1 -1
  246. package/fonts/Inter-Bold.svg +25443 -25443
  247. package/fonts/Inter-Medium.svg +25400 -25400
  248. package/fonts/Inter-Regular.svg +24341 -24341
  249. package/fonts/Inter-SemiBold.svg +25459 -25459
  250. package/index.d.ts +6 -6
  251. package/interfaces/context-menu-item.d.ts +7 -7
  252. package/interfaces/index.d.ts +2 -2
  253. package/interfaces/option.d.ts +5 -5
  254. package/package.json +3 -3
  255. package/services/index.d.ts +2 -2
  256. package/services/theme.options.d.ts +5 -5
  257. package/services/theme.service.d.ts +12 -12
  258. package/styles/fonts.scss +51 -51
  259. package/styles/global.scss +9 -9
  260. package/styles/mixins/buttons.scss +13 -13
  261. package/styles/mixins/headings.scss +115 -115
  262. package/styles/mixins/inputs.scss +91 -91
  263. package/styles/mixins/lists.scss +5 -5
  264. package/styles/mixins/paddings.scss +35 -35
  265. package/styles/mixins/shadows.scss +38 -38
  266. package/styles/mixins/texts.scss +225 -225
  267. package/styles/theme.scss +385 -385
  268. package/styles/variables/colors.scss +253 -253
  269. package/types/appearance.d.ts +8 -8
  270. package/types/hint-type.d.ts +1 -1
  271. package/types/index.d.ts +7 -7
  272. package/types/position.d.ts +2 -2
  273. package/types/resizing.d.ts +2 -2
  274. package/types/shape.d.ts +1 -1
  275. package/types/size.d.ts +4 -4
  276. package/types/status.d.ts +1 -1
  277. package/utils/format/index.d.ts +2 -2
  278. package/utils/format/remove-spaces.d.ts +1 -1
  279. package/utils/format/replace.d.ts +1 -1
  280. package/utils/index.d.ts +1 -1
@@ -15,2311 +15,2311 @@ import { maskitoParseNumber, maskitoNumberOptionsGenerator, maskitoTimeOptionsGe
15
15
  import * as i3 from '@maskito/angular';
16
16
  import { MaskitoDirective } from '@maskito/angular';
17
17
 
18
- class CuiAccordionComponent {
19
- }
20
- CuiAccordionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
21
- CuiAccordionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiAccordionComponent, selector: "cui-accordion", ngImport: i0, template: "<ng-content select=\"cui-accordion-item\"></ng-content>\n", styles: [":host{display:flex;flex-direction:column;gap:16px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
22
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionComponent, decorators: [{
23
- type: Component,
24
- args: [{ selector: 'cui-accordion', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content select=\"cui-accordion-item\"></ng-content>\n", styles: [":host{display:flex;flex-direction:column;gap:16px}\n"] }]
18
+ class CuiAccordionComponent {
19
+ }
20
+ CuiAccordionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
21
+ CuiAccordionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiAccordionComponent, selector: "cui-accordion", ngImport: i0, template: "<ng-content select=\"cui-accordion-item\"></ng-content>\r\n", styles: [":host{display:flex;flex-direction:column;gap:16px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
22
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionComponent, decorators: [{
23
+ type: Component,
24
+ args: [{ selector: 'cui-accordion', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content select=\"cui-accordion-item\"></ng-content>\r\n", styles: [":host{display:flex;flex-direction:column;gap:16px}\n"] }]
25
25
  }] });
26
26
 
27
- const CUI_BUTTON_DEFAULT_OPTIONS = {
28
- appearance: 'action',
29
- shape: null,
30
- size: 'sm'
31
- };
32
- const CUI_BUTTON_OPTIONS = new InjectionToken('', {
33
- factory: () => CUI_BUTTON_DEFAULT_OPTIONS
27
+ const CUI_BUTTON_DEFAULT_OPTIONS = {
28
+ appearance: 'action',
29
+ shape: null,
30
+ size: 'sm'
31
+ };
32
+ const CUI_BUTTON_OPTIONS = new InjectionToken('', {
33
+ factory: () => CUI_BUTTON_DEFAULT_OPTIONS
34
34
  });
35
35
 
36
- class CuiSvgComponent {
37
- constructor() {
38
- this.domSanitizer = inject(DomSanitizer);
39
- }
40
- set icon(icon) {
41
- // TODO: В данном случае подключаются все иконки (вероятно, можно как-то оптимизировано их подключать)
42
- this.safeSvgContent = this.domSanitizer.bypassSecurityTrustHtml(cuiIsIcon(icon)
43
- ? CUI_ICONS[icon]
44
- : icon);
45
- }
46
- get isWithStrokeWidth() {
47
- return !!this.strokeWidth;
48
- }
49
- get isWithColor() {
50
- return !!this.color;
51
- }
52
- }
53
- CuiSvgComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSvgComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
54
- CuiSvgComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: { width: "width", height: "height", strokeWidth: "strokeWidth", color: "color", icon: "icon" }, host: { properties: { "style.--stroke-width": "this.strokeWidth", "style.--color": "this.color", "class._with-stroke-width": "this.isWithStrokeWidth", "class._with-color": "this.isWithColor" } }, ngImport: i0, template: "<span\n [innerHTML]=\"safeSvgContent\"\n [style.width.px]=\"width\"\n [style.height.px]=\"height\"\n></span>", styles: [":host{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;vertical-align:middle;line-height:0}:host ::ng-deep svg{width:100%;height:100%}:host._with-stroke-width ::ng-deep [stroke-width]{stroke-width:var(--stroke-width)}:host._with-color ::ng-deep [stroke]{stroke:var(--color)}:host._with-color ::ng-deep [fill]:not([fill=none]){fill:var(--color)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
55
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSvgComponent, decorators: [{
56
- type: Component,
57
- args: [{ selector: 'cui-svg[icon]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<span\n [innerHTML]=\"safeSvgContent\"\n [style.width.px]=\"width\"\n [style.height.px]=\"height\"\n></span>", styles: [":host{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;vertical-align:middle;line-height:0}:host ::ng-deep svg{width:100%;height:100%}:host._with-stroke-width ::ng-deep [stroke-width]{stroke-width:var(--stroke-width)}:host._with-color ::ng-deep [stroke]{stroke:var(--color)}:host._with-color ::ng-deep [fill]:not([fill=none]){fill:var(--color)}\n"] }]
58
- }], propDecorators: { width: [{
59
- type: Input
60
- }], height: [{
61
- type: Input
62
- }], strokeWidth: [{
63
- type: Input
64
- }, {
65
- type: HostBinding,
66
- args: ['style.--stroke-width']
67
- }], color: [{
68
- type: Input
69
- }, {
70
- type: HostBinding,
71
- args: ['style.--color']
72
- }], icon: [{
73
- type: Input
74
- }], isWithStrokeWidth: [{
75
- type: HostBinding,
76
- args: ['class._with-stroke-width']
77
- }], isWithColor: [{
78
- type: HostBinding,
79
- args: ['class._with-color']
36
+ class CuiSvgComponent {
37
+ constructor() {
38
+ this.domSanitizer = inject(DomSanitizer);
39
+ }
40
+ set icon(icon) {
41
+ // TODO: В данном случае подключаются все иконки (вероятно, можно как-то оптимизировано их подключать)
42
+ this.safeSvgContent = this.domSanitizer.bypassSecurityTrustHtml(cuiIsIcon(icon)
43
+ ? CUI_ICONS[icon]
44
+ : icon);
45
+ }
46
+ get isWithStrokeWidth() {
47
+ return !!this.strokeWidth;
48
+ }
49
+ get isWithColor() {
50
+ return !!this.color;
51
+ }
52
+ }
53
+ CuiSvgComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSvgComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
54
+ CuiSvgComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: { width: "width", height: "height", strokeWidth: "strokeWidth", color: "color", icon: "icon" }, host: { properties: { "style.--stroke-width": "this.strokeWidth", "style.--color": "this.color", "class._with-stroke-width": "this.isWithStrokeWidth", "class._with-color": "this.isWithColor" } }, ngImport: i0, template: "<span\r\n [innerHTML]=\"safeSvgContent\"\r\n [style.width.px]=\"width\"\r\n [style.height.px]=\"height\"\r\n></span>", styles: [":host{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;vertical-align:middle;line-height:0}:host ::ng-deep svg{width:100%;height:100%}:host._with-stroke-width ::ng-deep [stroke-width]{stroke-width:var(--stroke-width)}:host._with-color ::ng-deep [stroke]{stroke:var(--color)}:host._with-color ::ng-deep [fill]:not([fill=none]){fill:var(--color)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
55
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSvgComponent, decorators: [{
56
+ type: Component,
57
+ args: [{ selector: 'cui-svg[icon]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<span\r\n [innerHTML]=\"safeSvgContent\"\r\n [style.width.px]=\"width\"\r\n [style.height.px]=\"height\"\r\n></span>", styles: [":host{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;vertical-align:middle;line-height:0}:host ::ng-deep svg{width:100%;height:100%}:host._with-stroke-width ::ng-deep [stroke-width]{stroke-width:var(--stroke-width)}:host._with-color ::ng-deep [stroke]{stroke:var(--color)}:host._with-color ::ng-deep [fill]:not([fill=none]){fill:var(--color)}\n"] }]
58
+ }], propDecorators: { width: [{
59
+ type: Input
60
+ }], height: [{
61
+ type: Input
62
+ }], strokeWidth: [{
63
+ type: Input
64
+ }, {
65
+ type: HostBinding,
66
+ args: ['style.--stroke-width']
67
+ }], color: [{
68
+ type: Input
69
+ }, {
70
+ type: HostBinding,
71
+ args: ['style.--color']
72
+ }], icon: [{
73
+ type: Input
74
+ }], isWithStrokeWidth: [{
75
+ type: HostBinding,
76
+ args: ['class._with-stroke-width']
77
+ }], isWithColor: [{
78
+ type: HostBinding,
79
+ args: ['class._with-color']
80
80
  }] } });
81
81
 
82
- class CuiButtonComponent {
83
- constructor() {
84
- this.changeDetectorRef = inject(ChangeDetectorRef);
85
- this.element = inject(ElementRef).nativeElement;
86
- this.window = inject(CUI_WINDOW);
87
- this.cuiButtonOptions = inject(CUI_BUTTON_OPTIONS);
88
- this.AppearanceIconColors = {
89
- action: '--c-action-icon-color',
90
- secondary: '--c-secondary-icon-color',
91
- outlined: '--c-outlined-icon-color',
92
- 'outlined-gray': '--c-outlined-gray-icon-color',
93
- ghost: '--c-ghost-icon-color',
94
- flat: '--c-flat-icon-color',
95
- destructive: '--c-destructive-icon-color',
96
- link: '--c-link-icon-color'
97
- };
98
- this.COLOR_BASE_500 = 'var(--cui-base-500)';
99
- this.BUTTON_ICONS_COLOR_BASE_500 = [
100
- 'secondary',
101
- 'outlined',
102
- 'outlined-gray',
103
- 'ghost'
104
- ];
105
- this._appearance = this.cuiButtonOptions.appearance;
106
- this.iconColor = this.getIconColor(this._appearance);
107
- this._size = this.cuiButtonOptions.size;
108
- this.iconDimensions = {
109
- width: 20,
110
- height: 20
111
- };
112
- this.shape = this.cuiButtonOptions.shape;
113
- this.disabled = false;
114
- this.isLoaderShown = false;
115
- this.containsOnlyIcon = false;
116
- }
117
- get appearance() {
118
- return this._appearance;
119
- }
120
- set appearance(appearance) {
121
- this._appearance = appearance;
122
- this.changeIconColor();
123
- }
124
- get size() {
125
- return this._size;
126
- }
127
- set size(size) {
128
- this._size = size;
129
- if (size === 'xxs') {
130
- this.iconDimensions = {
131
- width: 16,
132
- height: 16
133
- };
134
- return;
135
- }
136
- this.iconDimensions = {
137
- width: 20,
138
- height: 20
139
- };
140
- }
141
- get isDisabled() {
142
- return this.disabled || this.isLoaderShown;
143
- }
144
- ngOnInit() {
145
- this.initIconColor();
146
- }
147
- initIconColor() {
148
- this.changeIconColor();
149
- }
150
- changeIconColor() {
151
- Promise.resolve().then(() => {
152
- this.iconColor = this.getIconColor(this._appearance);
153
- this.changeDetectorRef.markForCheck();
154
- });
155
- }
156
- getIconColor(appearance) {
157
- const customIconColor = this.window
158
- .getComputedStyle(this.element)
159
- .getPropertyValue(this.AppearanceIconColors[appearance]);
160
- if (customIconColor) {
161
- return customIconColor;
162
- }
163
- if (this.BUTTON_ICONS_COLOR_BASE_500.includes(appearance)) {
164
- return this.COLOR_BASE_500;
165
- }
166
- return 'currentColor';
167
- }
168
- }
169
- CuiButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
170
- CuiButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: { shape: "shape", disabled: "disabled", isLoaderShown: "isLoaderShown", icon: "icon", iconRight: "iconRight", appearance: "appearance", size: "size" }, host: { properties: { "attr.data-shape": "this.shape", "class._disabled": "this.disabled", "class._loading": "this.isLoaderShown", "attr.data-appearance": "this.appearance", "attr.data-size": "this.size", "class._only-icon": "this.containsOnlyIcon", "disabled": "this.isDisabled" } }, viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true }], ngImport: i0, template: "<span\n class=\"c-wrapper\"\n [class.c-wrapper_invisible]=\"isLoaderShown\"\n>\n <cui-svg\n *ngIf=\"icon\"\n [icon]=\"icon\"\n [width]=\"iconDimensions.width\"\n [height]=\"iconDimensions.height\"\n [color]=\"iconColor\"\n ></cui-svg>\n <span\n #content\n class=\"c-content\"\n ><ng-content></ng-content></span>\n <cui-svg\n *ngIf=\"iconRight\"\n [icon]=\"iconRight\"\n [width]=\"iconDimensions.width\"\n [height]=\"iconDimensions.height\"\n [color]=\"iconColor\"\n ></cui-svg>\n</span>\n<cui-svg\n *ngIf=\"isLoaderShown\"\n icon=\"cuiIconLoading\"\n class=\"c-loader\"\n></cui-svg>\n", styles: [":host{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;font-weight:500;font-size:14px;line-height:20px;display:inline-block;position:relative;box-sizing:border-box;border-radius:8px;font-family:var(--cui-main-font)}:host:disabled{cursor:not-allowed}:host[data-shape=rounded]{border-radius:20px}:host[data-appearance=action]{background:var(--c-action-background);color:var(--cui-gray-0);border:1px solid var(--c-action-border-color)}@media (hover: hover){:host[data-appearance=action]:hover{background:var(--c-action-background-hover);border-color:var(--c-action-background-hover)}}:host[data-appearance=action]:active{background:var(--c-action-background-hover);border-color:var(--c-action-background-hover)}:host[data-appearance=action]:disabled{background:var(--c-action-background);border-color:var(--c-action-border-color)}:host[data-appearance=secondary]{background:var(--cui-base-100);color:var(--cui-base-900)}@media (hover: hover){:host[data-appearance=secondary]:hover{background:var(--cui-base-200)}}:host[data-appearance=secondary]:active{background:var(--cui-base-200)}:host[data-appearance=secondary]:disabled{background:var(--cui-base-100)}:host[data-appearance=outlined]{border:1px solid var(--cui-base-200);background:var(--cui-base-0);color:var(--cui-base-900)}@media (hover: hover){:host[data-appearance=outlined]:hover{background:var(--cui-base-50)}}:host[data-appearance=outlined]:active{background:var(--cui-base-50)}:host[data-appearance=outlined]:disabled{background:var(--cui-base-0)}:host[data-appearance=outlined-gray]{border:1px solid var(--cui-base-200);background:var(--cui-base-10);color:var(--c-outlined-gray-color)}@media (hover: hover){:host[data-appearance=outlined-gray]:hover{background:var(--cui-base-50)}}:host[data-appearance=outlined-gray]:active{background:var(--cui-base-50)}:host[data-appearance=outlined-gray]:disabled{background:var(--cui-base-10)}:host[data-appearance=ghost]{color:var(--cui-base-900)}@media (hover: hover){:host[data-appearance=ghost]:hover{background:var(--cui-base-50)}}:host[data-appearance=ghost]:active{background:var(--cui-base-50)}:host[data-appearance=ghost]:disabled{background:inherit}:host[data-appearance=flat]{color:var(--cui-light-blue-600)}@media (hover: hover){:host[data-appearance=flat]:hover{background:var(--cui-base-50)}}:host[data-appearance=flat]:active{background:var(--cui-base-50)}:host[data-appearance=flat]:disabled{background:inherit}:host[data-appearance=destructive]{background:var(--cui-danger);color:var(--cui-gray-0)}@media (hover: hover){:host[data-appearance=destructive]:hover{background:var(--cui-red-600)}}:host[data-appearance=destructive]:active{background:var(--cui-red-600)}:host[data-appearance=destructive]:disabled{background:var(--cui-danger)}:host[data-appearance=link]{height:24px!important;padding:0 4px!important;color:var(--cui-info)}@media (hover: hover){:host[data-appearance=link]:hover{color:var(--cui-blue-800)}}:host[data-appearance=link]:active{color:var(--cui-blue-800)}:host[data-appearance=link]:disabled{color:var(--cui-info)}:host[data-size=xxs]{font-size:12px;line-height:14px;height:28px;padding:0 12px}:host[data-size=xxs][data-appearance=action],:host[data-size=xxs][data-appearance=outlined],:host[data-size=xxs][data-appearance=outlined-gray]{padding:0 11px}:host[data-size=xxs]:has(.c-content:empty){width:28px}:host[data-size=xxs] .c-wrapper{gap:6px}:host[data-size=xs]{font-size:13px;line-height:16px;height:32px;padding:0 12px}:host[data-size=xs][data-appearance=action],:host[data-size=xs][data-appearance=outlined],:host[data-size=xs][data-appearance=outlined-gray]{padding:0 11px}:host[data-size=xs]:has(.c-content:empty){width:32px}:host[data-size=sm]{height:36px;padding:0 14px}:host[data-size=sm][data-appearance=action],:host[data-size=sm][data-appearance=outlined],:host[data-size=sm][data-appearance=outlined-gray]{padding:0 13px}:host[data-size=sm]:has(.c-content:empty){width:36px}:host[data-size=md]{height:40px;padding:0 16px}:host[data-size=md][data-appearance=action],:host[data-size=md][data-appearance=outlined],:host[data-size=md][data-appearance=outlined-gray]{padding:0 15px}:host[data-size=md]:has(.c-content:empty){width:40px}:host._disabled{opacity:.5}@media (hover: hover){:host-context([cuiTheme=dark])[data-appearance=destructive]:hover{background:var(--cui-red-300)}}:host-context([cuiTheme=dark])[data-appearance=destructive]:active{background:var(--cui-red-300)}:host-context([cuiTheme=dark])[data-appearance=destructive]:disabled{background:var(--cui-danger)}.c-content:empty{display:contents}.c-wrapper{display:flex;justify-content:center;align-items:center;gap:8px;height:100%}.c-wrapper_invisible{opacity:0}.c-loader{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
171
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonComponent, decorators: [{
172
- type: Component,
173
- args: [{ selector: 'button[cuiButton], a[cuiButton]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<span\n class=\"c-wrapper\"\n [class.c-wrapper_invisible]=\"isLoaderShown\"\n>\n <cui-svg\n *ngIf=\"icon\"\n [icon]=\"icon\"\n [width]=\"iconDimensions.width\"\n [height]=\"iconDimensions.height\"\n [color]=\"iconColor\"\n ></cui-svg>\n <span\n #content\n class=\"c-content\"\n ><ng-content></ng-content></span>\n <cui-svg\n *ngIf=\"iconRight\"\n [icon]=\"iconRight\"\n [width]=\"iconDimensions.width\"\n [height]=\"iconDimensions.height\"\n [color]=\"iconColor\"\n ></cui-svg>\n</span>\n<cui-svg\n *ngIf=\"isLoaderShown\"\n icon=\"cuiIconLoading\"\n class=\"c-loader\"\n></cui-svg>\n", styles: [":host{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;font-weight:500;font-size:14px;line-height:20px;display:inline-block;position:relative;box-sizing:border-box;border-radius:8px;font-family:var(--cui-main-font)}:host:disabled{cursor:not-allowed}:host[data-shape=rounded]{border-radius:20px}:host[data-appearance=action]{background:var(--c-action-background);color:var(--cui-gray-0);border:1px solid var(--c-action-border-color)}@media (hover: hover){:host[data-appearance=action]:hover{background:var(--c-action-background-hover);border-color:var(--c-action-background-hover)}}:host[data-appearance=action]:active{background:var(--c-action-background-hover);border-color:var(--c-action-background-hover)}:host[data-appearance=action]:disabled{background:var(--c-action-background);border-color:var(--c-action-border-color)}:host[data-appearance=secondary]{background:var(--cui-base-100);color:var(--cui-base-900)}@media (hover: hover){:host[data-appearance=secondary]:hover{background:var(--cui-base-200)}}:host[data-appearance=secondary]:active{background:var(--cui-base-200)}:host[data-appearance=secondary]:disabled{background:var(--cui-base-100)}:host[data-appearance=outlined]{border:1px solid var(--cui-base-200);background:var(--cui-base-0);color:var(--cui-base-900)}@media (hover: hover){:host[data-appearance=outlined]:hover{background:var(--cui-base-50)}}:host[data-appearance=outlined]:active{background:var(--cui-base-50)}:host[data-appearance=outlined]:disabled{background:var(--cui-base-0)}:host[data-appearance=outlined-gray]{border:1px solid var(--cui-base-200);background:var(--cui-base-10);color:var(--c-outlined-gray-color)}@media (hover: hover){:host[data-appearance=outlined-gray]:hover{background:var(--cui-base-50)}}:host[data-appearance=outlined-gray]:active{background:var(--cui-base-50)}:host[data-appearance=outlined-gray]:disabled{background:var(--cui-base-10)}:host[data-appearance=ghost]{color:var(--cui-base-900)}@media (hover: hover){:host[data-appearance=ghost]:hover{background:var(--cui-base-50)}}:host[data-appearance=ghost]:active{background:var(--cui-base-50)}:host[data-appearance=ghost]:disabled{background:inherit}:host[data-appearance=flat]{color:var(--cui-light-blue-600)}@media (hover: hover){:host[data-appearance=flat]:hover{background:var(--cui-base-50)}}:host[data-appearance=flat]:active{background:var(--cui-base-50)}:host[data-appearance=flat]:disabled{background:inherit}:host[data-appearance=destructive]{background:var(--cui-danger);color:var(--cui-gray-0)}@media (hover: hover){:host[data-appearance=destructive]:hover{background:var(--cui-red-600)}}:host[data-appearance=destructive]:active{background:var(--cui-red-600)}:host[data-appearance=destructive]:disabled{background:var(--cui-danger)}:host[data-appearance=link]{height:24px!important;padding:0 4px!important;color:var(--cui-info)}@media (hover: hover){:host[data-appearance=link]:hover{color:var(--cui-blue-800)}}:host[data-appearance=link]:active{color:var(--cui-blue-800)}:host[data-appearance=link]:disabled{color:var(--cui-info)}:host[data-size=xxs]{font-size:12px;line-height:14px;height:28px;padding:0 12px}:host[data-size=xxs][data-appearance=action],:host[data-size=xxs][data-appearance=outlined],:host[data-size=xxs][data-appearance=outlined-gray]{padding:0 11px}:host[data-size=xxs]:has(.c-content:empty){width:28px}:host[data-size=xxs] .c-wrapper{gap:6px}:host[data-size=xs]{font-size:13px;line-height:16px;height:32px;padding:0 12px}:host[data-size=xs][data-appearance=action],:host[data-size=xs][data-appearance=outlined],:host[data-size=xs][data-appearance=outlined-gray]{padding:0 11px}:host[data-size=xs]:has(.c-content:empty){width:32px}:host[data-size=sm]{height:36px;padding:0 14px}:host[data-size=sm][data-appearance=action],:host[data-size=sm][data-appearance=outlined],:host[data-size=sm][data-appearance=outlined-gray]{padding:0 13px}:host[data-size=sm]:has(.c-content:empty){width:36px}:host[data-size=md]{height:40px;padding:0 16px}:host[data-size=md][data-appearance=action],:host[data-size=md][data-appearance=outlined],:host[data-size=md][data-appearance=outlined-gray]{padding:0 15px}:host[data-size=md]:has(.c-content:empty){width:40px}:host._disabled{opacity:.5}@media (hover: hover){:host-context([cuiTheme=dark])[data-appearance=destructive]:hover{background:var(--cui-red-300)}}:host-context([cuiTheme=dark])[data-appearance=destructive]:active{background:var(--cui-red-300)}:host-context([cuiTheme=dark])[data-appearance=destructive]:disabled{background:var(--cui-danger)}.c-content:empty{display:contents}.c-wrapper{display:flex;justify-content:center;align-items:center;gap:8px;height:100%}.c-wrapper_invisible{opacity:0}.c-loader{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}\n"] }]
174
- }], propDecorators: { shape: [{
175
- type: Input
176
- }, {
177
- type: HostBinding,
178
- args: ['attr.data-shape']
179
- }], disabled: [{
180
- type: Input
181
- }, {
182
- type: HostBinding,
183
- args: ['class._disabled']
184
- }], isLoaderShown: [{
185
- type: Input
186
- }, {
187
- type: HostBinding,
188
- args: ['class._loading']
189
- }], icon: [{
190
- type: Input
191
- }], iconRight: [{
192
- type: Input
193
- }], appearance: [{
194
- type: Input
195
- }, {
196
- type: HostBinding,
197
- args: ['attr.data-appearance']
198
- }], size: [{
199
- type: Input
200
- }, {
201
- type: HostBinding,
202
- args: ['attr.data-size']
203
- }], containsOnlyIcon: [{
204
- type: HostBinding,
205
- args: ['class._only-icon']
206
- }], isDisabled: [{
207
- type: HostBinding,
208
- args: ['disabled']
209
- }], content: [{
210
- type: ViewChild,
211
- args: ['content']
82
+ class CuiButtonComponent {
83
+ constructor() {
84
+ this.changeDetectorRef = inject(ChangeDetectorRef);
85
+ this.element = inject(ElementRef).nativeElement;
86
+ this.window = inject(CUI_WINDOW);
87
+ this.cuiButtonOptions = inject(CUI_BUTTON_OPTIONS);
88
+ this.AppearanceIconColors = {
89
+ action: '--c-action-icon-color',
90
+ secondary: '--c-secondary-icon-color',
91
+ outlined: '--c-outlined-icon-color',
92
+ 'outlined-gray': '--c-outlined-gray-icon-color',
93
+ ghost: '--c-ghost-icon-color',
94
+ flat: '--c-flat-icon-color',
95
+ destructive: '--c-destructive-icon-color',
96
+ link: '--c-link-icon-color'
97
+ };
98
+ this.COLOR_BASE_500 = 'var(--cui-base-500)';
99
+ this.BUTTON_ICONS_COLOR_BASE_500 = [
100
+ 'secondary',
101
+ 'outlined',
102
+ 'outlined-gray',
103
+ 'ghost'
104
+ ];
105
+ this._appearance = this.cuiButtonOptions.appearance;
106
+ this.iconColor = this.getIconColor(this._appearance);
107
+ this._size = this.cuiButtonOptions.size;
108
+ this.iconDimensions = {
109
+ width: 20,
110
+ height: 20
111
+ };
112
+ this.shape = this.cuiButtonOptions.shape;
113
+ this.disabled = false;
114
+ this.isLoaderShown = false;
115
+ this.containsOnlyIcon = false;
116
+ }
117
+ get appearance() {
118
+ return this._appearance;
119
+ }
120
+ set appearance(appearance) {
121
+ this._appearance = appearance;
122
+ this.changeIconColor();
123
+ }
124
+ get size() {
125
+ return this._size;
126
+ }
127
+ set size(size) {
128
+ this._size = size;
129
+ if (size === 'xxs') {
130
+ this.iconDimensions = {
131
+ width: 16,
132
+ height: 16
133
+ };
134
+ return;
135
+ }
136
+ this.iconDimensions = {
137
+ width: 20,
138
+ height: 20
139
+ };
140
+ }
141
+ get isDisabled() {
142
+ return this.disabled || this.isLoaderShown;
143
+ }
144
+ ngOnInit() {
145
+ this.initIconColor();
146
+ }
147
+ initIconColor() {
148
+ this.changeIconColor();
149
+ }
150
+ changeIconColor() {
151
+ Promise.resolve().then(() => {
152
+ this.iconColor = this.getIconColor(this._appearance);
153
+ this.changeDetectorRef.markForCheck();
154
+ });
155
+ }
156
+ getIconColor(appearance) {
157
+ const customIconColor = this.window
158
+ .getComputedStyle(this.element)
159
+ .getPropertyValue(this.AppearanceIconColors[appearance]);
160
+ if (customIconColor) {
161
+ return customIconColor;
162
+ }
163
+ if (this.BUTTON_ICONS_COLOR_BASE_500.includes(appearance)) {
164
+ return this.COLOR_BASE_500;
165
+ }
166
+ return 'currentColor';
167
+ }
168
+ }
169
+ CuiButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
170
+ CuiButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: { shape: "shape", disabled: "disabled", isLoaderShown: "isLoaderShown", icon: "icon", iconRight: "iconRight", appearance: "appearance", size: "size" }, host: { properties: { "attr.data-shape": "this.shape", "class._disabled": "this.disabled", "class._loading": "this.isLoaderShown", "attr.data-appearance": "this.appearance", "attr.data-size": "this.size", "class._only-icon": "this.containsOnlyIcon", "disabled": "this.isDisabled" } }, viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true }], ngImport: i0, template: "<span\r\n class=\"c-wrapper\"\r\n [class.c-wrapper_invisible]=\"isLoaderShown\"\r\n>\r\n <cui-svg\r\n *ngIf=\"icon\"\r\n [icon]=\"icon\"\r\n [width]=\"iconDimensions.width\"\r\n [height]=\"iconDimensions.height\"\r\n [color]=\"iconColor\"\r\n ></cui-svg>\r\n <span\r\n #content\r\n class=\"c-content\"\r\n ><ng-content></ng-content></span>\r\n <cui-svg\r\n *ngIf=\"iconRight\"\r\n [icon]=\"iconRight\"\r\n [width]=\"iconDimensions.width\"\r\n [height]=\"iconDimensions.height\"\r\n [color]=\"iconColor\"\r\n ></cui-svg>\r\n</span>\r\n<cui-svg\r\n *ngIf=\"isLoaderShown\"\r\n icon=\"cuiIconLoading\"\r\n class=\"c-loader\"\r\n></cui-svg>\r\n", styles: [":host{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;font-weight:500;font-size:14px;line-height:20px;display:inline-block;position:relative;box-sizing:border-box;border-radius:8px;font-family:var(--cui-main-font)}:host:disabled{cursor:not-allowed}:host[data-shape=rounded]{border-radius:20px}:host[data-appearance=action]{background:var(--c-action-background);color:var(--cui-gray-0);border:1px solid var(--c-action-border-color)}@media (hover: hover){:host[data-appearance=action]:hover{background:var(--c-action-background-hover);border-color:var(--c-action-background-hover)}}:host[data-appearance=action]:active{background:var(--c-action-background-hover);border-color:var(--c-action-background-hover)}:host[data-appearance=action]:disabled{background:var(--c-action-background);border-color:var(--c-action-border-color)}:host[data-appearance=secondary]{background:var(--cui-base-100);color:var(--cui-base-900)}@media (hover: hover){:host[data-appearance=secondary]:hover{background:var(--cui-base-200)}}:host[data-appearance=secondary]:active{background:var(--cui-base-200)}:host[data-appearance=secondary]:disabled{background:var(--cui-base-100)}:host[data-appearance=outlined]{border:1px solid var(--cui-base-200);background:var(--cui-base-0);color:var(--cui-base-900)}@media (hover: hover){:host[data-appearance=outlined]:hover{background:var(--cui-base-50)}}:host[data-appearance=outlined]:active{background:var(--cui-base-50)}:host[data-appearance=outlined]:disabled{background:var(--cui-base-0)}:host[data-appearance=outlined-gray]{border:1px solid var(--cui-base-200);background:var(--cui-base-10);color:var(--c-outlined-gray-color)}@media (hover: hover){:host[data-appearance=outlined-gray]:hover{background:var(--cui-base-50)}}:host[data-appearance=outlined-gray]:active{background:var(--cui-base-50)}:host[data-appearance=outlined-gray]:disabled{background:var(--cui-base-10)}:host[data-appearance=ghost]{color:var(--cui-base-900)}@media (hover: hover){:host[data-appearance=ghost]:hover{background:var(--cui-base-50)}}:host[data-appearance=ghost]:active{background:var(--cui-base-50)}:host[data-appearance=ghost]:disabled{background:inherit}:host[data-appearance=flat]{color:var(--cui-light-blue-600)}@media (hover: hover){:host[data-appearance=flat]:hover{background:var(--cui-base-50)}}:host[data-appearance=flat]:active{background:var(--cui-base-50)}:host[data-appearance=flat]:disabled{background:inherit}:host[data-appearance=destructive]{background:var(--cui-danger);color:var(--cui-gray-0)}@media (hover: hover){:host[data-appearance=destructive]:hover{background:var(--cui-red-600)}}:host[data-appearance=destructive]:active{background:var(--cui-red-600)}:host[data-appearance=destructive]:disabled{background:var(--cui-danger)}:host[data-appearance=link]{height:24px!important;padding:0 4px!important;color:var(--cui-info)}@media (hover: hover){:host[data-appearance=link]:hover{color:var(--cui-blue-800)}}:host[data-appearance=link]:active{color:var(--cui-blue-800)}:host[data-appearance=link]:disabled{color:var(--cui-info)}:host[data-size=xxs]{font-size:12px;line-height:14px;height:28px;padding:0 12px}:host[data-size=xxs][data-appearance=action],:host[data-size=xxs][data-appearance=outlined],:host[data-size=xxs][data-appearance=outlined-gray]{padding:0 11px}:host[data-size=xxs]:has(.c-content:empty){width:28px}:host[data-size=xxs] .c-wrapper{gap:6px}:host[data-size=xs]{font-size:13px;line-height:16px;height:32px;padding:0 12px}:host[data-size=xs][data-appearance=action],:host[data-size=xs][data-appearance=outlined],:host[data-size=xs][data-appearance=outlined-gray]{padding:0 11px}:host[data-size=xs]:has(.c-content:empty){width:32px}:host[data-size=sm]{height:36px;padding:0 14px}:host[data-size=sm][data-appearance=action],:host[data-size=sm][data-appearance=outlined],:host[data-size=sm][data-appearance=outlined-gray]{padding:0 13px}:host[data-size=sm]:has(.c-content:empty){width:36px}:host[data-size=md]{height:40px;padding:0 16px}:host[data-size=md][data-appearance=action],:host[data-size=md][data-appearance=outlined],:host[data-size=md][data-appearance=outlined-gray]{padding:0 15px}:host[data-size=md]:has(.c-content:empty){width:40px}:host._disabled{opacity:.5}@media (hover: hover){:host-context([cuiTheme=dark])[data-appearance=destructive]:hover{background:var(--cui-red-300)}}:host-context([cuiTheme=dark])[data-appearance=destructive]:active{background:var(--cui-red-300)}:host-context([cuiTheme=dark])[data-appearance=destructive]:disabled{background:var(--cui-danger)}.c-content:empty{display:contents}.c-wrapper{display:flex;justify-content:center;align-items:center;gap:8px;height:100%}.c-wrapper_invisible{opacity:0}.c-loader{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
171
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonComponent, decorators: [{
172
+ type: Component,
173
+ args: [{ selector: 'button[cuiButton], a[cuiButton]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<span\r\n class=\"c-wrapper\"\r\n [class.c-wrapper_invisible]=\"isLoaderShown\"\r\n>\r\n <cui-svg\r\n *ngIf=\"icon\"\r\n [icon]=\"icon\"\r\n [width]=\"iconDimensions.width\"\r\n [height]=\"iconDimensions.height\"\r\n [color]=\"iconColor\"\r\n ></cui-svg>\r\n <span\r\n #content\r\n class=\"c-content\"\r\n ><ng-content></ng-content></span>\r\n <cui-svg\r\n *ngIf=\"iconRight\"\r\n [icon]=\"iconRight\"\r\n [width]=\"iconDimensions.width\"\r\n [height]=\"iconDimensions.height\"\r\n [color]=\"iconColor\"\r\n ></cui-svg>\r\n</span>\r\n<cui-svg\r\n *ngIf=\"isLoaderShown\"\r\n icon=\"cuiIconLoading\"\r\n class=\"c-loader\"\r\n></cui-svg>\r\n", styles: [":host{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;font-weight:500;font-size:14px;line-height:20px;display:inline-block;position:relative;box-sizing:border-box;border-radius:8px;font-family:var(--cui-main-font)}:host:disabled{cursor:not-allowed}:host[data-shape=rounded]{border-radius:20px}:host[data-appearance=action]{background:var(--c-action-background);color:var(--cui-gray-0);border:1px solid var(--c-action-border-color)}@media (hover: hover){:host[data-appearance=action]:hover{background:var(--c-action-background-hover);border-color:var(--c-action-background-hover)}}:host[data-appearance=action]:active{background:var(--c-action-background-hover);border-color:var(--c-action-background-hover)}:host[data-appearance=action]:disabled{background:var(--c-action-background);border-color:var(--c-action-border-color)}:host[data-appearance=secondary]{background:var(--cui-base-100);color:var(--cui-base-900)}@media (hover: hover){:host[data-appearance=secondary]:hover{background:var(--cui-base-200)}}:host[data-appearance=secondary]:active{background:var(--cui-base-200)}:host[data-appearance=secondary]:disabled{background:var(--cui-base-100)}:host[data-appearance=outlined]{border:1px solid var(--cui-base-200);background:var(--cui-base-0);color:var(--cui-base-900)}@media (hover: hover){:host[data-appearance=outlined]:hover{background:var(--cui-base-50)}}:host[data-appearance=outlined]:active{background:var(--cui-base-50)}:host[data-appearance=outlined]:disabled{background:var(--cui-base-0)}:host[data-appearance=outlined-gray]{border:1px solid var(--cui-base-200);background:var(--cui-base-10);color:var(--c-outlined-gray-color)}@media (hover: hover){:host[data-appearance=outlined-gray]:hover{background:var(--cui-base-50)}}:host[data-appearance=outlined-gray]:active{background:var(--cui-base-50)}:host[data-appearance=outlined-gray]:disabled{background:var(--cui-base-10)}:host[data-appearance=ghost]{color:var(--cui-base-900)}@media (hover: hover){:host[data-appearance=ghost]:hover{background:var(--cui-base-50)}}:host[data-appearance=ghost]:active{background:var(--cui-base-50)}:host[data-appearance=ghost]:disabled{background:inherit}:host[data-appearance=flat]{color:var(--cui-light-blue-600)}@media (hover: hover){:host[data-appearance=flat]:hover{background:var(--cui-base-50)}}:host[data-appearance=flat]:active{background:var(--cui-base-50)}:host[data-appearance=flat]:disabled{background:inherit}:host[data-appearance=destructive]{background:var(--cui-danger);color:var(--cui-gray-0)}@media (hover: hover){:host[data-appearance=destructive]:hover{background:var(--cui-red-600)}}:host[data-appearance=destructive]:active{background:var(--cui-red-600)}:host[data-appearance=destructive]:disabled{background:var(--cui-danger)}:host[data-appearance=link]{height:24px!important;padding:0 4px!important;color:var(--cui-info)}@media (hover: hover){:host[data-appearance=link]:hover{color:var(--cui-blue-800)}}:host[data-appearance=link]:active{color:var(--cui-blue-800)}:host[data-appearance=link]:disabled{color:var(--cui-info)}:host[data-size=xxs]{font-size:12px;line-height:14px;height:28px;padding:0 12px}:host[data-size=xxs][data-appearance=action],:host[data-size=xxs][data-appearance=outlined],:host[data-size=xxs][data-appearance=outlined-gray]{padding:0 11px}:host[data-size=xxs]:has(.c-content:empty){width:28px}:host[data-size=xxs] .c-wrapper{gap:6px}:host[data-size=xs]{font-size:13px;line-height:16px;height:32px;padding:0 12px}:host[data-size=xs][data-appearance=action],:host[data-size=xs][data-appearance=outlined],:host[data-size=xs][data-appearance=outlined-gray]{padding:0 11px}:host[data-size=xs]:has(.c-content:empty){width:32px}:host[data-size=sm]{height:36px;padding:0 14px}:host[data-size=sm][data-appearance=action],:host[data-size=sm][data-appearance=outlined],:host[data-size=sm][data-appearance=outlined-gray]{padding:0 13px}:host[data-size=sm]:has(.c-content:empty){width:36px}:host[data-size=md]{height:40px;padding:0 16px}:host[data-size=md][data-appearance=action],:host[data-size=md][data-appearance=outlined],:host[data-size=md][data-appearance=outlined-gray]{padding:0 15px}:host[data-size=md]:has(.c-content:empty){width:40px}:host._disabled{opacity:.5}@media (hover: hover){:host-context([cuiTheme=dark])[data-appearance=destructive]:hover{background:var(--cui-red-300)}}:host-context([cuiTheme=dark])[data-appearance=destructive]:active{background:var(--cui-red-300)}:host-context([cuiTheme=dark])[data-appearance=destructive]:disabled{background:var(--cui-danger)}.c-content:empty{display:contents}.c-wrapper{display:flex;justify-content:center;align-items:center;gap:8px;height:100%}.c-wrapper_invisible{opacity:0}.c-loader{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}\n"] }]
174
+ }], propDecorators: { shape: [{
175
+ type: Input
176
+ }, {
177
+ type: HostBinding,
178
+ args: ['attr.data-shape']
179
+ }], disabled: [{
180
+ type: Input
181
+ }, {
182
+ type: HostBinding,
183
+ args: ['class._disabled']
184
+ }], isLoaderShown: [{
185
+ type: Input
186
+ }, {
187
+ type: HostBinding,
188
+ args: ['class._loading']
189
+ }], icon: [{
190
+ type: Input
191
+ }], iconRight: [{
192
+ type: Input
193
+ }], appearance: [{
194
+ type: Input
195
+ }, {
196
+ type: HostBinding,
197
+ args: ['attr.data-appearance']
198
+ }], size: [{
199
+ type: Input
200
+ }, {
201
+ type: HostBinding,
202
+ args: ['attr.data-size']
203
+ }], containsOnlyIcon: [{
204
+ type: HostBinding,
205
+ args: ['class._only-icon']
206
+ }], isDisabled: [{
207
+ type: HostBinding,
208
+ args: ['disabled']
209
+ }], content: [{
210
+ type: ViewChild,
211
+ args: ['content']
212
212
  }] } });
213
213
 
214
- class CuiAccordionItemComponent {
215
- constructor() {
216
- this.isOpen = true;
217
- this.isOpenChange = new EventEmitter();
218
- }
219
- get buttonIcon() {
220
- return this.isOpen ? 'cuiIconChevronDown' : 'cuiIconChevronRight';
221
- }
222
- onRowToggle() {
223
- this.isOpen = !this.isOpen;
224
- this.isOpenChange.emit(this.isOpen);
225
- }
226
- }
227
- CuiAccordionItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
228
- CuiAccordionItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiAccordionItemComponent, selector: "cui-accordion-item", inputs: { isOpen: "isOpen" }, outputs: { isOpenChange: "isOpenChange" }, ngImport: i0, template: "<header class=\"c-header\">\n <button\n cuiButton\n appearance=\"ghost\"\n size=\"xxs\"\n [icon]=\"buttonIcon\"\n (click)=\"onRowToggle()\"\n ></button>\n <div class=\"c-header__wrapper\">\n <ng-content></ng-content>\n </div>\n</header>\n<div *ngIf=\"isOpen\">\n <ng-content select=\"[cuiAccordionItemContent]\"></ng-content>\n</div>\n", styles: [":host{padding:16px;display:flex;flex-direction:column;gap:8px;background:var(--cui-base-10);border-radius:8px}.c-header{font-weight:400;font-size:12px;line-height:14px;display:flex;align-items:center;gap:8px;color:var(--cui-base-900);font-family:var(--cui-main-font);text-transform:uppercase}.c-header__wrapper{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
229
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionItemComponent, decorators: [{
230
- type: Component,
231
- args: [{ selector: 'cui-accordion-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<header class=\"c-header\">\n <button\n cuiButton\n appearance=\"ghost\"\n size=\"xxs\"\n [icon]=\"buttonIcon\"\n (click)=\"onRowToggle()\"\n ></button>\n <div class=\"c-header__wrapper\">\n <ng-content></ng-content>\n </div>\n</header>\n<div *ngIf=\"isOpen\">\n <ng-content select=\"[cuiAccordionItemContent]\"></ng-content>\n</div>\n", styles: [":host{padding:16px;display:flex;flex-direction:column;gap:8px;background:var(--cui-base-10);border-radius:8px}.c-header{font-weight:400;font-size:12px;line-height:14px;display:flex;align-items:center;gap:8px;color:var(--cui-base-900);font-family:var(--cui-main-font);text-transform:uppercase}.c-header__wrapper{width:100%}\n"] }]
232
- }], propDecorators: { isOpen: [{
233
- type: Input
234
- }], isOpenChange: [{
235
- type: Output
214
+ class CuiAccordionItemComponent {
215
+ constructor() {
216
+ this.isOpen = true;
217
+ this.isOpenChange = new EventEmitter();
218
+ }
219
+ get buttonIcon() {
220
+ return this.isOpen ? 'cuiIconChevronDown' : 'cuiIconChevronRight';
221
+ }
222
+ onRowToggle() {
223
+ this.isOpen = !this.isOpen;
224
+ this.isOpenChange.emit(this.isOpen);
225
+ }
226
+ }
227
+ CuiAccordionItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
228
+ CuiAccordionItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiAccordionItemComponent, selector: "cui-accordion-item", inputs: { isOpen: "isOpen" }, outputs: { isOpenChange: "isOpenChange" }, ngImport: i0, template: "<header class=\"c-header\">\r\n <button\r\n cuiButton\r\n appearance=\"ghost\"\r\n size=\"xxs\"\r\n [icon]=\"buttonIcon\"\r\n (click)=\"onRowToggle()\"\r\n ></button>\r\n <div class=\"c-header__wrapper\">\r\n <ng-content></ng-content>\r\n </div>\r\n</header>\r\n<div *ngIf=\"isOpen\">\r\n <ng-content select=\"[cuiAccordionItemContent]\"></ng-content>\r\n</div>\r\n", styles: [":host{padding:16px;display:flex;flex-direction:column;gap:8px;background:var(--cui-base-10);border-radius:8px}.c-header{font-weight:400;font-size:12px;line-height:14px;display:flex;align-items:center;gap:8px;color:var(--cui-base-900);font-family:var(--cui-main-font);text-transform:uppercase}.c-header__wrapper{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
229
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionItemComponent, decorators: [{
230
+ type: Component,
231
+ args: [{ selector: 'cui-accordion-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<header class=\"c-header\">\r\n <button\r\n cuiButton\r\n appearance=\"ghost\"\r\n size=\"xxs\"\r\n [icon]=\"buttonIcon\"\r\n (click)=\"onRowToggle()\"\r\n ></button>\r\n <div class=\"c-header__wrapper\">\r\n <ng-content></ng-content>\r\n </div>\r\n</header>\r\n<div *ngIf=\"isOpen\">\r\n <ng-content select=\"[cuiAccordionItemContent]\"></ng-content>\r\n</div>\r\n", styles: [":host{padding:16px;display:flex;flex-direction:column;gap:8px;background:var(--cui-base-10);border-radius:8px}.c-header{font-weight:400;font-size:12px;line-height:14px;display:flex;align-items:center;gap:8px;color:var(--cui-base-900);font-family:var(--cui-main-font);text-transform:uppercase}.c-header__wrapper{width:100%}\n"] }]
232
+ }], propDecorators: { isOpen: [{
233
+ type: Input
234
+ }], isOpenChange: [{
235
+ type: Output
236
236
  }] } });
237
237
 
238
- class CuiSvgModule {
239
- }
240
- CuiSvgModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSvgModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
241
- CuiSvgModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiSvgModule, declarations: [CuiSvgComponent], imports: [CommonModule], exports: [CuiSvgComponent] });
242
- CuiSvgModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSvgModule, imports: [CommonModule] });
243
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSvgModule, decorators: [{
244
- type: NgModule,
245
- args: [{
246
- imports: [CommonModule],
247
- declarations: [CuiSvgComponent],
248
- exports: [CuiSvgComponent]
249
- }]
238
+ class CuiSvgModule {
239
+ }
240
+ CuiSvgModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSvgModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
241
+ CuiSvgModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiSvgModule, declarations: [CuiSvgComponent], imports: [CommonModule], exports: [CuiSvgComponent] });
242
+ CuiSvgModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSvgModule, imports: [CommonModule] });
243
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSvgModule, decorators: [{
244
+ type: NgModule,
245
+ args: [{
246
+ imports: [CommonModule],
247
+ declarations: [CuiSvgComponent],
248
+ exports: [CuiSvgComponent]
249
+ }]
250
250
  }] });
251
251
 
252
- class CuiButtonModule {
253
- }
254
- CuiButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
255
- CuiButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonModule, declarations: [CuiButtonComponent], imports: [CommonModule,
256
- CuiSvgModule], exports: [CuiButtonComponent] });
257
- CuiButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonModule, imports: [CommonModule,
258
- CuiSvgModule] });
259
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonModule, decorators: [{
260
- type: NgModule,
261
- args: [{
262
- imports: [
263
- CommonModule,
264
- CuiSvgModule
265
- ],
266
- declarations: [CuiButtonComponent],
267
- exports: [CuiButtonComponent]
268
- }]
252
+ class CuiButtonModule {
253
+ }
254
+ CuiButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
255
+ CuiButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonModule, declarations: [CuiButtonComponent], imports: [CommonModule,
256
+ CuiSvgModule], exports: [CuiButtonComponent] });
257
+ CuiButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonModule, imports: [CommonModule,
258
+ CuiSvgModule] });
259
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonModule, decorators: [{
260
+ type: NgModule,
261
+ args: [{
262
+ imports: [
263
+ CommonModule,
264
+ CuiSvgModule
265
+ ],
266
+ declarations: [CuiButtonComponent],
267
+ exports: [CuiButtonComponent]
268
+ }]
269
269
  }] });
270
270
 
271
- class CuiAccordionModule {
272
- }
273
- CuiAccordionModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
274
- CuiAccordionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionModule, declarations: [CuiAccordionComponent,
275
- CuiAccordionItemComponent], imports: [CommonModule,
276
- CuiSvgModule,
277
- CuiButtonModule], exports: [CuiAccordionComponent,
278
- CuiAccordionItemComponent] });
279
- CuiAccordionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionModule, imports: [CommonModule,
280
- CuiSvgModule,
281
- CuiButtonModule] });
282
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionModule, decorators: [{
283
- type: NgModule,
284
- args: [{
285
- imports: [
286
- CommonModule,
287
- CuiSvgModule,
288
- CuiButtonModule,
289
- ],
290
- declarations: [
291
- CuiAccordionComponent,
292
- CuiAccordionItemComponent
293
- ],
294
- exports: [
295
- CuiAccordionComponent,
296
- CuiAccordionItemComponent
297
- ]
298
- }]
271
+ class CuiAccordionModule {
272
+ }
273
+ CuiAccordionModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
274
+ CuiAccordionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionModule, declarations: [CuiAccordionComponent,
275
+ CuiAccordionItemComponent], imports: [CommonModule,
276
+ CuiSvgModule,
277
+ CuiButtonModule], exports: [CuiAccordionComponent,
278
+ CuiAccordionItemComponent] });
279
+ CuiAccordionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionModule, imports: [CommonModule,
280
+ CuiSvgModule,
281
+ CuiButtonModule] });
282
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionModule, decorators: [{
283
+ type: NgModule,
284
+ args: [{
285
+ imports: [
286
+ CommonModule,
287
+ CuiSvgModule,
288
+ CuiButtonModule,
289
+ ],
290
+ declarations: [
291
+ CuiAccordionComponent,
292
+ CuiAccordionItemComponent
293
+ ],
294
+ exports: [
295
+ CuiAccordionComponent,
296
+ CuiAccordionItemComponent
297
+ ]
298
+ }]
299
299
  }] });
300
300
 
301
- const CUI_NOTIFICATION_DEFAULT_OPTIONS = {
302
- status: 'info',
303
- mode: 'default'
304
- };
305
- const CUI_NOTIFICATION_OPTIONS = cuiCreateToken(CUI_NOTIFICATION_DEFAULT_OPTIONS);
306
- const CUI_NOTIFICATION_ICONS = {
307
- info: {
308
- icon: 'cuiIconInfo'
309
- },
310
- success: {
311
- icon: 'cuiIconCheckCircle'
312
- },
313
- alert: {
314
- icon: 'cuiIconAlertTriangle'
315
- },
316
- error: {
317
- icon: 'cuiIconXCircle'
318
- },
319
- };
320
- const CUI_NOTIFICATION_ICON_OPTIONS_DEFAULT_MODE = {
321
- info: {
322
- color: 'var(--c-info-icon-color)'
323
- },
324
- success: {
325
- color: 'var(--cui-green-500)'
326
- },
327
- alert: {
328
- color: 'var(--cui-yellow-400)'
329
- },
330
- error: {
331
- color: 'var(--cui-danger)'
332
- },
333
- };
334
- const CUI_NOTIFICATION_ICON_OPTIONS_LIGHT_MODE = {
335
- info: {
336
- color: 'var(--cui-info)'
337
- },
338
- success: {
339
- color: 'var(--cui-green-700)'
340
- },
341
- alert: {
342
- color: 'var(--cui-yellow-400)'
343
- },
344
- error: {
345
- color: 'var(--cui-danger)'
346
- },
347
- };
348
- const CUI_NOTIFICATION_ICON_OPTIONS = {
349
- default: CUI_NOTIFICATION_ICON_OPTIONS_DEFAULT_MODE,
350
- light: CUI_NOTIFICATION_ICON_OPTIONS_LIGHT_MODE
301
+ const CUI_NOTIFICATION_DEFAULT_OPTIONS = {
302
+ status: 'info',
303
+ mode: 'default'
304
+ };
305
+ const CUI_NOTIFICATION_OPTIONS = cuiCreateToken(CUI_NOTIFICATION_DEFAULT_OPTIONS);
306
+ const CUI_NOTIFICATION_ICONS = {
307
+ info: {
308
+ icon: 'cuiIconInfo'
309
+ },
310
+ success: {
311
+ icon: 'cuiIconCheckCircle'
312
+ },
313
+ alert: {
314
+ icon: 'cuiIconAlertTriangle'
315
+ },
316
+ error: {
317
+ icon: 'cuiIconXCircle'
318
+ },
319
+ };
320
+ const CUI_NOTIFICATION_ICON_OPTIONS_DEFAULT_MODE = {
321
+ info: {
322
+ color: 'var(--c-info-icon-color)'
323
+ },
324
+ success: {
325
+ color: 'var(--cui-green-500)'
326
+ },
327
+ alert: {
328
+ color: 'var(--cui-yellow-400)'
329
+ },
330
+ error: {
331
+ color: 'var(--cui-danger)'
332
+ },
333
+ };
334
+ const CUI_NOTIFICATION_ICON_OPTIONS_LIGHT_MODE = {
335
+ info: {
336
+ color: 'var(--cui-info)'
337
+ },
338
+ success: {
339
+ color: 'var(--cui-green-700)'
340
+ },
341
+ alert: {
342
+ color: 'var(--cui-yellow-400)'
343
+ },
344
+ error: {
345
+ color: 'var(--cui-danger)'
346
+ },
347
+ };
348
+ const CUI_NOTIFICATION_ICON_OPTIONS = {
349
+ default: CUI_NOTIFICATION_ICON_OPTIONS_DEFAULT_MODE,
350
+ light: CUI_NOTIFICATION_ICON_OPTIONS_LIGHT_MODE
351
351
  };
352
352
 
353
- class CuiNotificationComponent {
354
- constructor() {
355
- this.cuiNotificationOptions = inject(CUI_NOTIFICATION_OPTIONS);
356
- this.ICONS = CUI_NOTIFICATION_ICONS;
357
- this.ICON_OPTIONS = CUI_NOTIFICATION_ICON_OPTIONS;
358
- this.status = this.cuiNotificationOptions.status;
359
- this.mode = this.cuiNotificationOptions.mode;
360
- this.isCloseable = false;
361
- this.closed = new EventEmitter();
362
- }
363
- ngOnInit() {
364
- this.initIconOptions();
365
- }
366
- onClose() {
367
- this.closed.next();
368
- }
369
- initIconOptions() {
370
- this.iconOptions = this.ICON_OPTIONS[this.mode];
371
- }
372
- }
373
- CuiNotificationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiNotificationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
374
- CuiNotificationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiNotificationComponent, selector: "cui-notification", inputs: { status: "status", mode: "mode", isCloseable: "isCloseable" }, outputs: { closed: "closed" }, host: { properties: { "attr.data-status": "this.status", "attr.data-mode": "this.mode" } }, ngImport: i0, template: "<cui-svg\n class=\"c-icon\"\n [icon]=\"ICONS[status].icon\"\n [color]=\"iconOptions[status].color\"\n></cui-svg>\n<div class=\"c-content\">\n <ng-content></ng-content>\n</div>\n<button\n *ngIf=\"isCloseable\"\n class=\"c-button\"\n (click)=\"onClose()\"\n>\n <cui-svg\n icon=\"cuiIconX\"\n color=\"var(--cui-gray-0)\"\n />\n</button>\n", styles: [":host{--c-info-icon-color: var(--cui-blue-600);padding:16px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:flex-start;border-radius:12px;background:var(--cui-gray-800);color:var(--cui-gray-0);font-family:var(--cui-main-font)}:host[data-mode=light]{padding:15px;border:1px solid;color:var(--cui-base-900)}:host[data-mode=light][data-status=info]{border-color:var(--cui-info);background:var(--cui-badge-info-bg)}:host[data-mode=light][data-status=success]{border-color:var(--cui-green-700);background:var(--cui-badge-success-bg)}:host[data-mode=light][data-status=alert]{border-color:var(--cui-yellow-400);background:var(--cui-badge-warning-bg)}:host[data-mode=light][data-status=error]{border-color:var(--cui-danger);background:var(--cui-badge-danger-bg)}:host-context([cuiTheme=dark]){--c-info-icon-color: var(--cui-light-blue-400)}:host-context([cuiTheme=dark])[data-status=info]{background:var(--cui-blue-900)}:host-context([cuiTheme=dark])[data-status=success]{background:var(--cui-green-900)}:host-context([cuiTheme=dark])[data-status=alert]{background:var(--cui-yellow-900)}:host-context([cuiTheme=dark])[data-status=error]{background:var(--cui-red-900)}.c-content{flex:1;margin-left:12px;margin-right:16px;margin-top:5px;overflow-wrap:anywhere}.c-icon{margin-top:6px}.c-button{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:8px;padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}.c-button:hover{background:rgba(255,255,255,.2)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
375
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiNotificationComponent, decorators: [{
376
- type: Component,
377
- args: [{ selector: 'cui-notification', changeDetection: ChangeDetectionStrategy.OnPush, template: "<cui-svg\n class=\"c-icon\"\n [icon]=\"ICONS[status].icon\"\n [color]=\"iconOptions[status].color\"\n></cui-svg>\n<div class=\"c-content\">\n <ng-content></ng-content>\n</div>\n<button\n *ngIf=\"isCloseable\"\n class=\"c-button\"\n (click)=\"onClose()\"\n>\n <cui-svg\n icon=\"cuiIconX\"\n color=\"var(--cui-gray-0)\"\n />\n</button>\n", styles: [":host{--c-info-icon-color: var(--cui-blue-600);padding:16px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:flex-start;border-radius:12px;background:var(--cui-gray-800);color:var(--cui-gray-0);font-family:var(--cui-main-font)}:host[data-mode=light]{padding:15px;border:1px solid;color:var(--cui-base-900)}:host[data-mode=light][data-status=info]{border-color:var(--cui-info);background:var(--cui-badge-info-bg)}:host[data-mode=light][data-status=success]{border-color:var(--cui-green-700);background:var(--cui-badge-success-bg)}:host[data-mode=light][data-status=alert]{border-color:var(--cui-yellow-400);background:var(--cui-badge-warning-bg)}:host[data-mode=light][data-status=error]{border-color:var(--cui-danger);background:var(--cui-badge-danger-bg)}:host-context([cuiTheme=dark]){--c-info-icon-color: var(--cui-light-blue-400)}:host-context([cuiTheme=dark])[data-status=info]{background:var(--cui-blue-900)}:host-context([cuiTheme=dark])[data-status=success]{background:var(--cui-green-900)}:host-context([cuiTheme=dark])[data-status=alert]{background:var(--cui-yellow-900)}:host-context([cuiTheme=dark])[data-status=error]{background:var(--cui-red-900)}.c-content{flex:1;margin-left:12px;margin-right:16px;margin-top:5px;overflow-wrap:anywhere}.c-icon{margin-top:6px}.c-button{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:8px;padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}.c-button:hover{background:rgba(255,255,255,.2)}\n"] }]
378
- }], propDecorators: { status: [{
379
- type: Input
380
- }, {
381
- type: HostBinding,
382
- args: ['attr.data-status']
383
- }], mode: [{
384
- type: Input
385
- }, {
386
- type: HostBinding,
387
- args: ['attr.data-mode']
388
- }], isCloseable: [{
389
- type: Input
390
- }], closed: [{
391
- type: Output
353
+ class CuiNotificationComponent {
354
+ constructor() {
355
+ this.cuiNotificationOptions = inject(CUI_NOTIFICATION_OPTIONS);
356
+ this.ICONS = CUI_NOTIFICATION_ICONS;
357
+ this.ICON_OPTIONS = CUI_NOTIFICATION_ICON_OPTIONS;
358
+ this.status = this.cuiNotificationOptions.status;
359
+ this.mode = this.cuiNotificationOptions.mode;
360
+ this.isCloseable = false;
361
+ this.closed = new EventEmitter();
362
+ }
363
+ ngOnInit() {
364
+ this.initIconOptions();
365
+ }
366
+ onClose() {
367
+ this.closed.next();
368
+ }
369
+ initIconOptions() {
370
+ this.iconOptions = this.ICON_OPTIONS[this.mode];
371
+ }
372
+ }
373
+ CuiNotificationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiNotificationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
374
+ CuiNotificationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiNotificationComponent, selector: "cui-notification", inputs: { status: "status", mode: "mode", isCloseable: "isCloseable" }, outputs: { closed: "closed" }, host: { properties: { "attr.data-status": "this.status", "attr.data-mode": "this.mode" } }, ngImport: i0, template: "<cui-svg\r\n class=\"c-icon\"\r\n [icon]=\"ICONS[status].icon\"\r\n [color]=\"iconOptions[status].color\"\r\n></cui-svg>\r\n<div class=\"c-content\">\r\n <ng-content></ng-content>\r\n</div>\r\n<button\r\n *ngIf=\"isCloseable\"\r\n class=\"c-button\"\r\n (click)=\"onClose()\"\r\n>\r\n <cui-svg\r\n icon=\"cuiIconX\"\r\n color=\"var(--cui-gray-0)\"\r\n />\r\n</button>\r\n", styles: [":host{--c-info-icon-color: var(--cui-blue-600);padding:16px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:flex-start;border-radius:12px;background:var(--cui-gray-800);color:var(--cui-gray-0);font-family:var(--cui-main-font)}:host[data-mode=light]{padding:15px;border:1px solid;color:var(--cui-base-900)}:host[data-mode=light][data-status=info]{border-color:var(--cui-info);background:var(--cui-badge-info-bg)}:host[data-mode=light][data-status=success]{border-color:var(--cui-green-700);background:var(--cui-badge-success-bg)}:host[data-mode=light][data-status=alert]{border-color:var(--cui-yellow-400);background:var(--cui-badge-warning-bg)}:host[data-mode=light][data-status=error]{border-color:var(--cui-danger);background:var(--cui-badge-danger-bg)}:host-context([cuiTheme=dark]){--c-info-icon-color: var(--cui-light-blue-400)}:host-context([cuiTheme=dark])[data-status=info]{background:var(--cui-blue-900)}:host-context([cuiTheme=dark])[data-status=success]{background:var(--cui-green-900)}:host-context([cuiTheme=dark])[data-status=alert]{background:var(--cui-yellow-900)}:host-context([cuiTheme=dark])[data-status=error]{background:var(--cui-red-900)}.c-content{flex:1;margin-left:12px;margin-right:16px;margin-top:5px;overflow-wrap:anywhere}.c-icon{margin-top:6px}.c-button{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:8px;padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}.c-button:hover{background:rgba(255,255,255,.2)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
375
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiNotificationComponent, decorators: [{
376
+ type: Component,
377
+ args: [{ selector: 'cui-notification', changeDetection: ChangeDetectionStrategy.OnPush, template: "<cui-svg\r\n class=\"c-icon\"\r\n [icon]=\"ICONS[status].icon\"\r\n [color]=\"iconOptions[status].color\"\r\n></cui-svg>\r\n<div class=\"c-content\">\r\n <ng-content></ng-content>\r\n</div>\r\n<button\r\n *ngIf=\"isCloseable\"\r\n class=\"c-button\"\r\n (click)=\"onClose()\"\r\n>\r\n <cui-svg\r\n icon=\"cuiIconX\"\r\n color=\"var(--cui-gray-0)\"\r\n />\r\n</button>\r\n", styles: [":host{--c-info-icon-color: var(--cui-blue-600);padding:16px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:flex-start;border-radius:12px;background:var(--cui-gray-800);color:var(--cui-gray-0);font-family:var(--cui-main-font)}:host[data-mode=light]{padding:15px;border:1px solid;color:var(--cui-base-900)}:host[data-mode=light][data-status=info]{border-color:var(--cui-info);background:var(--cui-badge-info-bg)}:host[data-mode=light][data-status=success]{border-color:var(--cui-green-700);background:var(--cui-badge-success-bg)}:host[data-mode=light][data-status=alert]{border-color:var(--cui-yellow-400);background:var(--cui-badge-warning-bg)}:host[data-mode=light][data-status=error]{border-color:var(--cui-danger);background:var(--cui-badge-danger-bg)}:host-context([cuiTheme=dark]){--c-info-icon-color: var(--cui-light-blue-400)}:host-context([cuiTheme=dark])[data-status=info]{background:var(--cui-blue-900)}:host-context([cuiTheme=dark])[data-status=success]{background:var(--cui-green-900)}:host-context([cuiTheme=dark])[data-status=alert]{background:var(--cui-yellow-900)}:host-context([cuiTheme=dark])[data-status=error]{background:var(--cui-red-900)}.c-content{flex:1;margin-left:12px;margin-right:16px;margin-top:5px;overflow-wrap:anywhere}.c-icon{margin-top:6px}.c-button{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:8px;padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}.c-button:hover{background:rgba(255,255,255,.2)}\n"] }]
378
+ }], propDecorators: { status: [{
379
+ type: Input
380
+ }, {
381
+ type: HostBinding,
382
+ args: ['attr.data-status']
383
+ }], mode: [{
384
+ type: Input
385
+ }, {
386
+ type: HostBinding,
387
+ args: ['attr.data-mode']
388
+ }], isCloseable: [{
389
+ type: Input
390
+ }], closed: [{
391
+ type: Output
392
392
  }] } });
393
393
 
394
- class CuiNotificationModule {
395
- }
396
- CuiNotificationModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiNotificationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
397
- CuiNotificationModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiNotificationModule, declarations: [CuiNotificationComponent], imports: [CommonModule,
398
- CuiSvgModule], exports: [CuiNotificationComponent] });
399
- CuiNotificationModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiNotificationModule, imports: [CommonModule,
400
- CuiSvgModule] });
401
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiNotificationModule, decorators: [{
402
- type: NgModule,
403
- args: [{
404
- imports: [
405
- CommonModule,
406
- CuiSvgModule
407
- ],
408
- declarations: [CuiNotificationComponent],
409
- exports: [CuiNotificationComponent]
410
- }]
394
+ class CuiNotificationModule {
395
+ }
396
+ CuiNotificationModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiNotificationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
397
+ CuiNotificationModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiNotificationModule, declarations: [CuiNotificationComponent], imports: [CommonModule,
398
+ CuiSvgModule], exports: [CuiNotificationComponent] });
399
+ CuiNotificationModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiNotificationModule, imports: [CommonModule,
400
+ CuiSvgModule] });
401
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiNotificationModule, decorators: [{
402
+ type: NgModule,
403
+ args: [{
404
+ imports: [
405
+ CommonModule,
406
+ CuiSvgModule
407
+ ],
408
+ declarations: [CuiNotificationComponent],
409
+ exports: [CuiNotificationComponent]
410
+ }]
411
411
  }] });
412
412
 
413
- const CUI_ALERTS = cuiCreateToken(new BehaviorSubject([]));
414
- const CUI_ALERT_DEFAULT_OPTIONS = {
415
- label: '',
416
- needAutoClose: true,
417
- isCloseable: true,
418
- mode: 'default',
419
- position: 'right',
420
- resizing: 'fixed'
421
- };
422
- const CUI_ALERT_OPTIONS = cuiCreateTokenFromFactory(() => ({
423
- ...CUI_ALERT_DEFAULT_OPTIONS,
424
- ...inject(CUI_NOTIFICATION_OPTIONS)
425
- }));
413
+ const CUI_ALERTS = cuiCreateToken(new BehaviorSubject([]));
414
+ const CUI_ALERT_DEFAULT_OPTIONS = {
415
+ label: '',
416
+ needAutoClose: true,
417
+ isCloseable: true,
418
+ mode: 'default',
419
+ position: 'right',
420
+ resizing: 'fixed'
421
+ };
422
+ const CUI_ALERT_OPTIONS = cuiCreateTokenFromFactory(() => ({
423
+ ...CUI_ALERT_DEFAULT_OPTIONS,
424
+ ...inject(CUI_NOTIFICATION_OPTIONS)
425
+ }));
426
426
  const CUI_ALERT_CONTEXT = new InjectionToken('');
427
427
 
428
- class CuiAlertComponent {
429
- constructor() {
430
- this.context = inject(CUI_ALERT_CONTEXT);
431
- this.AUTO_CLOSE_DURATION_IN_MILLISECONDS = 3000;
432
- }
433
- get resizing() {
434
- return this.context.resizing;
435
- }
436
- ngOnInit() {
437
- this.initAutoClose();
438
- }
439
- onClosed() {
440
- this.context.$implicit.complete();
441
- }
442
- initAutoClose() {
443
- if (!this.context.needAutoClose) {
444
- return;
445
- }
446
- setTimeout(this.onClosed.bind(this), this.AUTO_CLOSE_DURATION_IN_MILLISECONDS);
447
- }
448
- }
449
- CuiAlertComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
450
- CuiAlertComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiAlertComponent, selector: "cui-alert", host: { properties: { "attr.data-resizing": "this.resizing" } }, ngImport: i0, template: "<cui-notification\n [status]=\"context.status\"\n [mode]=\"context.mode\"\n [isCloseable]=\"context.isCloseable\"\n (closed)=\"onClosed()\"\n>\n <h2\n *ngIf=\"context.label\"\n class=\"c-heading\"\n >\n {{ context.label }}\n </h2>\n {{ context.content }}\n</cui-notification>\n", styles: [":host{font-weight:400;font-size:14px;line-height:20px;max-width:470px}:host[data-resizing=hug]{width:-moz-fit-content;width:fit-content}:host[data-resizing=fixed]{width:470px}.c-heading{font-weight:500;font-size:14px;line-height:20px;margin:0 0 8px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CuiNotificationComponent, selector: "cui-notification", inputs: ["status", "mode", "isCloseable"], outputs: ["closed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
451
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertComponent, decorators: [{
452
- type: Component,
453
- args: [{ selector: 'cui-alert', changeDetection: ChangeDetectionStrategy.OnPush, template: "<cui-notification\n [status]=\"context.status\"\n [mode]=\"context.mode\"\n [isCloseable]=\"context.isCloseable\"\n (closed)=\"onClosed()\"\n>\n <h2\n *ngIf=\"context.label\"\n class=\"c-heading\"\n >\n {{ context.label }}\n </h2>\n {{ context.content }}\n</cui-notification>\n", styles: [":host{font-weight:400;font-size:14px;line-height:20px;max-width:470px}:host[data-resizing=hug]{width:-moz-fit-content;width:fit-content}:host[data-resizing=fixed]{width:470px}.c-heading{font-weight:500;font-size:14px;line-height:20px;margin:0 0 8px}\n"] }]
454
- }], propDecorators: { resizing: [{
455
- type: HostBinding,
456
- args: ['attr.data-resizing']
428
+ class CuiAlertComponent {
429
+ constructor() {
430
+ this.context = inject(CUI_ALERT_CONTEXT);
431
+ this.AUTO_CLOSE_DURATION_IN_MILLISECONDS = 3000;
432
+ }
433
+ get resizing() {
434
+ return this.context.resizing;
435
+ }
436
+ ngOnInit() {
437
+ this.initAutoClose();
438
+ }
439
+ onClosed() {
440
+ this.context.$implicit.complete();
441
+ }
442
+ initAutoClose() {
443
+ if (!this.context.needAutoClose) {
444
+ return;
445
+ }
446
+ setTimeout(this.onClosed.bind(this), this.AUTO_CLOSE_DURATION_IN_MILLISECONDS);
447
+ }
448
+ }
449
+ CuiAlertComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
450
+ CuiAlertComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiAlertComponent, selector: "cui-alert", host: { properties: { "attr.data-resizing": "this.resizing" } }, ngImport: i0, template: "<cui-notification\r\n [status]=\"context.status\"\r\n [mode]=\"context.mode\"\r\n [isCloseable]=\"context.isCloseable\"\r\n (closed)=\"onClosed()\"\r\n>\r\n <h2\r\n *ngIf=\"context.label\"\r\n class=\"c-heading\"\r\n >\r\n {{ context.label }}\r\n </h2>\r\n {{ context.content }}\r\n</cui-notification>\r\n", styles: [":host{font-weight:400;font-size:14px;line-height:20px;max-width:470px}:host[data-resizing=hug]{width:-moz-fit-content;width:fit-content}:host[data-resizing=fixed]{width:470px}.c-heading{font-weight:500;font-size:14px;line-height:20px;margin:0 0 8px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CuiNotificationComponent, selector: "cui-notification", inputs: ["status", "mode", "isCloseable"], outputs: ["closed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
451
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertComponent, decorators: [{
452
+ type: Component,
453
+ args: [{ selector: 'cui-alert', changeDetection: ChangeDetectionStrategy.OnPush, template: "<cui-notification\r\n [status]=\"context.status\"\r\n [mode]=\"context.mode\"\r\n [isCloseable]=\"context.isCloseable\"\r\n (closed)=\"onClosed()\"\r\n>\r\n <h2\r\n *ngIf=\"context.label\"\r\n class=\"c-heading\"\r\n >\r\n {{ context.label }}\r\n </h2>\r\n {{ context.content }}\r\n</cui-notification>\r\n", styles: [":host{font-weight:400;font-size:14px;line-height:20px;max-width:470px}:host[data-resizing=hug]{width:-moz-fit-content;width:fit-content}:host[data-resizing=fixed]{width:470px}.c-heading{font-weight:500;font-size:14px;line-height:20px;margin:0 0 8px}\n"] }]
454
+ }], propDecorators: { resizing: [{
455
+ type: HostBinding,
456
+ args: ['attr.data-resizing']
457
457
  }] } });
458
458
 
459
- class CuiAlertsComponent {
460
- constructor() {
461
- this.destroy$ = inject(CuiDestroyService, { self: true });
462
- this.alerts$ = inject(CUI_ALERTS);
463
- }
464
- ngOnInit() {
465
- this.initAlertInjectorsSubscription();
466
- }
467
- trackByFn(_, alert) {
468
- return alert.id;
469
- }
470
- alertsMatcher(alert, position) {
471
- return alert.position === position;
472
- }
473
- initAlertInjectorsSubscription() {
474
- this.alerts$
475
- .pipe(takeUntil(this.destroy$))
476
- .subscribe(dialogs => this.alertInjectors = dialogs.map(useValue => Injector.create({
477
- providers: [{ provide: CUI_ALERT_CONTEXT, useValue }]
478
- })));
479
- }
480
- }
481
- CuiAlertsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
482
- CuiAlertsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiAlertsComponent, selector: "cui-alerts", providers: [CuiDestroyService], ngImport: i0, template: "<ng-container *cuiLet=\"alerts$ | async as alerts\">\n <div class=\"c-wrapper c-wrapper_position_center\">\n <ng-container *ngFor=\"let alert of alerts! | cuiFilter: alertsMatcher: 'center'; let i = index; trackBy: trackByFn\">\n <ng-container *ngComponentOutlet=\"alert.component; injector: alertInjectors[i]\" />\n </ng-container>\n </div>\n <div class=\"c-wrapper c-wrapper_position_right\">\n <ng-container *ngFor=\"let alert of alerts! | cuiFilter: alertsMatcher: 'right'; let i = index; trackBy: trackByFn\">\n <ng-container *ngComponentOutlet=\"alert.component; injector: alertInjectors[i]\" />\n </ng-container>\n </div>\n</ng-container>\n", styles: [":host{display:flex;flex-direction:column;position:fixed;right:20px;bottom:20px}.c-wrapper{position:fixed;bottom:20px;display:flex;flex-direction:column;gap:16px;pointer-events:none}.c-wrapper_position_center{align-items:center;left:50%;transform:translate(-50%)}.c-wrapper_position_right{align-items:flex-end;right:20px}.c-wrapper ::ng-deep>*{pointer-events:auto}\n"], dependencies: [{ kind: "directive", type: i1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.CuiLetDirective, selector: "[cuiLet]", inputs: ["cuiLet"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.CuiFilterPipe, name: "cuiFilter" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
483
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertsComponent, decorators: [{
484
- type: Component,
485
- args: [{ selector: 'cui-alerts', changeDetection: ChangeDetectionStrategy.OnPush, providers: [CuiDestroyService], template: "<ng-container *cuiLet=\"alerts$ | async as alerts\">\n <div class=\"c-wrapper c-wrapper_position_center\">\n <ng-container *ngFor=\"let alert of alerts! | cuiFilter: alertsMatcher: 'center'; let i = index; trackBy: trackByFn\">\n <ng-container *ngComponentOutlet=\"alert.component; injector: alertInjectors[i]\" />\n </ng-container>\n </div>\n <div class=\"c-wrapper c-wrapper_position_right\">\n <ng-container *ngFor=\"let alert of alerts! | cuiFilter: alertsMatcher: 'right'; let i = index; trackBy: trackByFn\">\n <ng-container *ngComponentOutlet=\"alert.component; injector: alertInjectors[i]\" />\n </ng-container>\n </div>\n</ng-container>\n", styles: [":host{display:flex;flex-direction:column;position:fixed;right:20px;bottom:20px}.c-wrapper{position:fixed;bottom:20px;display:flex;flex-direction:column;gap:16px;pointer-events:none}.c-wrapper_position_center{align-items:center;left:50%;transform:translate(-50%)}.c-wrapper_position_right{align-items:flex-end;right:20px}.c-wrapper ::ng-deep>*{pointer-events:auto}\n"] }]
459
+ class CuiAlertsComponent {
460
+ constructor() {
461
+ this.destroy$ = inject(CuiDestroyService, { self: true });
462
+ this.alerts$ = inject(CUI_ALERTS);
463
+ }
464
+ ngOnInit() {
465
+ this.initAlertInjectorsSubscription();
466
+ }
467
+ trackByFn(_, alert) {
468
+ return alert.id;
469
+ }
470
+ alertsMatcher(alert, position) {
471
+ return alert.position === position;
472
+ }
473
+ initAlertInjectorsSubscription() {
474
+ this.alerts$
475
+ .pipe(takeUntil(this.destroy$))
476
+ .subscribe(dialogs => this.alertInjectors = dialogs.map(useValue => Injector.create({
477
+ providers: [{ provide: CUI_ALERT_CONTEXT, useValue }]
478
+ })));
479
+ }
480
+ }
481
+ CuiAlertsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
482
+ CuiAlertsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiAlertsComponent, selector: "cui-alerts", providers: [CuiDestroyService], ngImport: i0, template: "<ng-container *cuiLet=\"alerts$ | async as alerts\">\r\n <div class=\"c-wrapper c-wrapper_position_center\">\r\n <ng-container *ngFor=\"let alert of alerts! | cuiFilter: alertsMatcher: 'center'; let i = index; trackBy: trackByFn\">\r\n <ng-container *ngComponentOutlet=\"alert.component; injector: alertInjectors[i]\" />\r\n </ng-container>\r\n </div>\r\n <div class=\"c-wrapper c-wrapper_position_right\">\r\n <ng-container *ngFor=\"let alert of alerts! | cuiFilter: alertsMatcher: 'right'; let i = index; trackBy: trackByFn\">\r\n <ng-container *ngComponentOutlet=\"alert.component; injector: alertInjectors[i]\" />\r\n </ng-container>\r\n </div>\r\n</ng-container>\r\n", styles: [":host{display:flex;flex-direction:column;position:fixed;right:20px;bottom:20px}.c-wrapper{position:fixed;bottom:20px;display:flex;flex-direction:column;gap:16px;pointer-events:none}.c-wrapper_position_center{align-items:center;left:50%;transform:translate(-50%)}.c-wrapper_position_right{align-items:flex-end;right:20px}.c-wrapper ::ng-deep>*{pointer-events:auto}\n"], dependencies: [{ kind: "directive", type: i1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.CuiLetDirective, selector: "[cuiLet]", inputs: ["cuiLet"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.CuiFilterPipe, name: "cuiFilter" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
483
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertsComponent, decorators: [{
484
+ type: Component,
485
+ args: [{ selector: 'cui-alerts', changeDetection: ChangeDetectionStrategy.OnPush, providers: [CuiDestroyService], template: "<ng-container *cuiLet=\"alerts$ | async as alerts\">\r\n <div class=\"c-wrapper c-wrapper_position_center\">\r\n <ng-container *ngFor=\"let alert of alerts! | cuiFilter: alertsMatcher: 'center'; let i = index; trackBy: trackByFn\">\r\n <ng-container *ngComponentOutlet=\"alert.component; injector: alertInjectors[i]\" />\r\n </ng-container>\r\n </div>\r\n <div class=\"c-wrapper c-wrapper_position_right\">\r\n <ng-container *ngFor=\"let alert of alerts! | cuiFilter: alertsMatcher: 'right'; let i = index; trackBy: trackByFn\">\r\n <ng-container *ngComponentOutlet=\"alert.component; injector: alertInjectors[i]\" />\r\n </ng-container>\r\n </div>\r\n</ng-container>\r\n", styles: [":host{display:flex;flex-direction:column;position:fixed;right:20px;bottom:20px}.c-wrapper{position:fixed;bottom:20px;display:flex;flex-direction:column;gap:16px;pointer-events:none}.c-wrapper_position_center{align-items:center;left:50%;transform:translate(-50%)}.c-wrapper_position_right{align-items:flex-end;right:20px}.c-wrapper ::ng-deep>*{pointer-events:auto}\n"] }]
486
486
  }] });
487
487
 
488
- class CuiAlertModule {
489
- }
490
- CuiAlertModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
491
- CuiAlertModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertModule, declarations: [CuiAlertComponent,
492
- CuiAlertsComponent], imports: [CommonModule,
493
- CuiFilterPipe,
494
- CuiNotificationModule,
495
- CuiLetDirective], exports: [CuiAlertComponent,
496
- CuiAlertComponent,
497
- CuiAlertsComponent] });
498
- CuiAlertModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertModule, imports: [CommonModule,
499
- CuiNotificationModule] });
500
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertModule, decorators: [{
501
- type: NgModule,
502
- args: [{
503
- imports: [
504
- CommonModule,
505
- CuiFilterPipe,
506
- CuiNotificationModule,
507
- CuiLetDirective
508
- ],
509
- declarations: [
510
- CuiAlertComponent,
511
- CuiAlertsComponent
512
- ],
513
- exports: [
514
- CuiAlertComponent,
515
- CuiAlertComponent,
516
- CuiAlertsComponent
517
- ]
518
- }]
488
+ class CuiAlertModule {
489
+ }
490
+ CuiAlertModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
491
+ CuiAlertModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertModule, declarations: [CuiAlertComponent,
492
+ CuiAlertsComponent], imports: [CommonModule,
493
+ CuiFilterPipe,
494
+ CuiNotificationModule,
495
+ CuiLetDirective], exports: [CuiAlertComponent,
496
+ CuiAlertComponent,
497
+ CuiAlertsComponent] });
498
+ CuiAlertModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertModule, imports: [CommonModule,
499
+ CuiNotificationModule] });
500
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertModule, decorators: [{
501
+ type: NgModule,
502
+ args: [{
503
+ imports: [
504
+ CommonModule,
505
+ CuiFilterPipe,
506
+ CuiNotificationModule,
507
+ CuiLetDirective
508
+ ],
509
+ declarations: [
510
+ CuiAlertComponent,
511
+ CuiAlertsComponent
512
+ ],
513
+ exports: [
514
+ CuiAlertComponent,
515
+ CuiAlertComponent,
516
+ CuiAlertsComponent
517
+ ]
518
+ }]
519
519
  }] });
520
520
 
521
- class CuiAlertService extends CuiPopoverService {
522
- }
523
- CuiAlertService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
524
- CuiAlertService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertService, providedIn: 'root', useFactory: () => new CuiAlertService(CUI_ALERTS, CuiAlertComponent, inject(CUI_ALERT_OPTIONS)) });
525
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertService, decorators: [{
526
- type: Injectable,
527
- args: [{
528
- providedIn: 'root',
529
- useFactory: () => new CuiAlertService(CUI_ALERTS, CuiAlertComponent, inject(CUI_ALERT_OPTIONS))
530
- }]
521
+ class CuiAlertService extends CuiPopoverService {
522
+ }
523
+ CuiAlertService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
524
+ CuiAlertService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertService, providedIn: 'root', useFactory: () => new CuiAlertService(CUI_ALERTS, CuiAlertComponent, inject(CUI_ALERT_OPTIONS)) });
525
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertService, decorators: [{
526
+ type: Injectable,
527
+ args: [{
528
+ providedIn: 'root',
529
+ useFactory: () => new CuiAlertService(CUI_ALERTS, CuiAlertComponent, inject(CUI_ALERT_OPTIONS))
530
+ }]
531
531
  }] });
532
532
 
533
- const CUI_BADGE_DEFAULT_OPTIONS = {
534
- color: 'light-blue',
535
- size: 'sm',
536
- isWithDot: false
537
- };
533
+ const CUI_BADGE_DEFAULT_OPTIONS = {
534
+ color: 'light-blue',
535
+ size: 'sm',
536
+ isWithDot: false
537
+ };
538
538
  const CUI_BADGE_OPTIONS = cuiCreateToken(CUI_BADGE_DEFAULT_OPTIONS);
539
539
 
540
- class CuiBadgeComponent {
541
- constructor() {
542
- this.options = inject(CUI_BADGE_OPTIONS);
543
- this.color = this.options.color;
544
- this.size = this.options.size;
545
- this.isWithDot = this.options.isWithDot;
546
- }
547
- }
548
- CuiBadgeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
549
- CuiBadgeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiBadgeComponent, selector: "cui-badge", inputs: { color: "color", size: "size", isWithDot: "isWithDot" }, host: { properties: { "attr.data-color": "this.color", "attr.data-size": "this.size" } }, ngImport: i0, template: "<span\n *ngIf=\"isWithDot\"\n class=\"c-dots\"\n></span>\n<ng-content />", styles: [":host{padding-top:2px;padding-bottom:2px;display:inline-flex;align-items:center;gap:4px;flex-shrink:0;border-radius:25px;color:var(--cui-gray-900);font-family:var(--cui-main-font)}:host[data-color=light-blue]{color:var(--cui-badge-info-label);background:var(--cui-badge-info-bg)}:host[data-color=light-blue] .c-dots{background:var(--cui-info)}:host[data-color=yellow]{color:var(--cui-badge-warning-label);background:var(--cui-badge-warning-bg)}:host[data-color=yellow] .c-dots{background:var(--cui-warning)}:host[data-color=green]{color:var(--cui-badge-success-label);background:var(--cui-badge-success-bg)}:host[data-color=green] .c-dots{background:var(--cui-success)}:host[data-color=gray]{color:var(--cui-badge-gray-label);background:var(--cui-badge-gray-bg)}:host[data-color=gray] .c-dots{background:var(--cui-base-500)}:host[data-color=dark-gray]{color:var(--cui-base-900);background:var(--cui-base-200)}:host[data-color=dark-gray] .c-dots{background:var(--cui-base-500)}:host[data-color=red]{color:var(--cui-badge-danger-label);background:var(--cui-badge-danger-bg)}:host[data-color=red] .c-dots{background:var(--cui-danger)}:host[data-color=violet]{color:var(--cui-badge-violet-label);background:var(--cui-badge-violet-bg);outline:1px solid var(--cui-violet-400);outline-offset:-1px}:host[data-color=violet] .c-dots{background:var(--cui-violet-400)}:host[data-size=sm]{font-size:12px;line-height:14px;padding-right:6px;padding-left:6px}:host[data-size=md]{font-size:14px;line-height:20px;padding-right:8px;padding-left:8px}.c-dots{width:6px;height:6px;border-radius:50%}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
550
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBadgeComponent, decorators: [{
551
- type: Component,
552
- args: [{ selector: 'cui-badge', changeDetection: ChangeDetectionStrategy.OnPush, template: "<span\n *ngIf=\"isWithDot\"\n class=\"c-dots\"\n></span>\n<ng-content />", styles: [":host{padding-top:2px;padding-bottom:2px;display:inline-flex;align-items:center;gap:4px;flex-shrink:0;border-radius:25px;color:var(--cui-gray-900);font-family:var(--cui-main-font)}:host[data-color=light-blue]{color:var(--cui-badge-info-label);background:var(--cui-badge-info-bg)}:host[data-color=light-blue] .c-dots{background:var(--cui-info)}:host[data-color=yellow]{color:var(--cui-badge-warning-label);background:var(--cui-badge-warning-bg)}:host[data-color=yellow] .c-dots{background:var(--cui-warning)}:host[data-color=green]{color:var(--cui-badge-success-label);background:var(--cui-badge-success-bg)}:host[data-color=green] .c-dots{background:var(--cui-success)}:host[data-color=gray]{color:var(--cui-badge-gray-label);background:var(--cui-badge-gray-bg)}:host[data-color=gray] .c-dots{background:var(--cui-base-500)}:host[data-color=dark-gray]{color:var(--cui-base-900);background:var(--cui-base-200)}:host[data-color=dark-gray] .c-dots{background:var(--cui-base-500)}:host[data-color=red]{color:var(--cui-badge-danger-label);background:var(--cui-badge-danger-bg)}:host[data-color=red] .c-dots{background:var(--cui-danger)}:host[data-color=violet]{color:var(--cui-badge-violet-label);background:var(--cui-badge-violet-bg);outline:1px solid var(--cui-violet-400);outline-offset:-1px}:host[data-color=violet] .c-dots{background:var(--cui-violet-400)}:host[data-size=sm]{font-size:12px;line-height:14px;padding-right:6px;padding-left:6px}:host[data-size=md]{font-size:14px;line-height:20px;padding-right:8px;padding-left:8px}.c-dots{width:6px;height:6px;border-radius:50%}\n"] }]
553
- }], propDecorators: { color: [{
554
- type: Input
555
- }, {
556
- type: HostBinding,
557
- args: ['attr.data-color']
558
- }], size: [{
559
- type: Input
560
- }, {
561
- type: HostBinding,
562
- args: ['attr.data-size']
563
- }], isWithDot: [{
564
- type: Input
540
+ class CuiBadgeComponent {
541
+ constructor() {
542
+ this.options = inject(CUI_BADGE_OPTIONS);
543
+ this.color = this.options.color;
544
+ this.size = this.options.size;
545
+ this.isWithDot = this.options.isWithDot;
546
+ }
547
+ }
548
+ CuiBadgeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
549
+ CuiBadgeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiBadgeComponent, selector: "cui-badge", inputs: { color: "color", size: "size", isWithDot: "isWithDot" }, host: { properties: { "attr.data-color": "this.color", "attr.data-size": "this.size" } }, ngImport: i0, template: "<span\r\n *ngIf=\"isWithDot\"\r\n class=\"c-dots\"\r\n></span>\r\n<ng-content />", styles: [":host{padding-top:2px;padding-bottom:2px;display:inline-flex;align-items:center;gap:4px;flex-shrink:0;border-radius:25px;color:var(--cui-gray-900);font-family:var(--cui-main-font)}:host[data-color=light-blue]{color:var(--cui-badge-info-label);background:var(--cui-badge-info-bg)}:host[data-color=light-blue] .c-dots{background:var(--cui-info)}:host[data-color=yellow]{color:var(--cui-badge-warning-label);background:var(--cui-badge-warning-bg)}:host[data-color=yellow] .c-dots{background:var(--cui-warning)}:host[data-color=green]{color:var(--cui-badge-success-label);background:var(--cui-badge-success-bg)}:host[data-color=green] .c-dots{background:var(--cui-success)}:host[data-color=gray]{color:var(--cui-badge-gray-label);background:var(--cui-badge-gray-bg)}:host[data-color=gray] .c-dots{background:var(--cui-base-500)}:host[data-color=dark-gray]{color:var(--cui-base-900);background:var(--cui-base-200)}:host[data-color=dark-gray] .c-dots{background:var(--cui-base-500)}:host[data-color=red]{color:var(--cui-badge-danger-label);background:var(--cui-badge-danger-bg)}:host[data-color=red] .c-dots{background:var(--cui-danger)}:host[data-color=violet]{color:var(--cui-badge-violet-label);background:var(--cui-badge-violet-bg);outline:1px solid var(--cui-violet-400);outline-offset:-1px}:host[data-color=violet] .c-dots{background:var(--cui-violet-400)}:host[data-size=sm]{font-size:12px;line-height:14px;padding-right:6px;padding-left:6px}:host[data-size=md]{font-size:14px;line-height:20px;padding-right:8px;padding-left:8px}.c-dots{width:6px;height:6px;border-radius:50%}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
550
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBadgeComponent, decorators: [{
551
+ type: Component,
552
+ args: [{ selector: 'cui-badge', changeDetection: ChangeDetectionStrategy.OnPush, template: "<span\r\n *ngIf=\"isWithDot\"\r\n class=\"c-dots\"\r\n></span>\r\n<ng-content />", styles: [":host{padding-top:2px;padding-bottom:2px;display:inline-flex;align-items:center;gap:4px;flex-shrink:0;border-radius:25px;color:var(--cui-gray-900);font-family:var(--cui-main-font)}:host[data-color=light-blue]{color:var(--cui-badge-info-label);background:var(--cui-badge-info-bg)}:host[data-color=light-blue] .c-dots{background:var(--cui-info)}:host[data-color=yellow]{color:var(--cui-badge-warning-label);background:var(--cui-badge-warning-bg)}:host[data-color=yellow] .c-dots{background:var(--cui-warning)}:host[data-color=green]{color:var(--cui-badge-success-label);background:var(--cui-badge-success-bg)}:host[data-color=green] .c-dots{background:var(--cui-success)}:host[data-color=gray]{color:var(--cui-badge-gray-label);background:var(--cui-badge-gray-bg)}:host[data-color=gray] .c-dots{background:var(--cui-base-500)}:host[data-color=dark-gray]{color:var(--cui-base-900);background:var(--cui-base-200)}:host[data-color=dark-gray] .c-dots{background:var(--cui-base-500)}:host[data-color=red]{color:var(--cui-badge-danger-label);background:var(--cui-badge-danger-bg)}:host[data-color=red] .c-dots{background:var(--cui-danger)}:host[data-color=violet]{color:var(--cui-badge-violet-label);background:var(--cui-badge-violet-bg);outline:1px solid var(--cui-violet-400);outline-offset:-1px}:host[data-color=violet] .c-dots{background:var(--cui-violet-400)}:host[data-size=sm]{font-size:12px;line-height:14px;padding-right:6px;padding-left:6px}:host[data-size=md]{font-size:14px;line-height:20px;padding-right:8px;padding-left:8px}.c-dots{width:6px;height:6px;border-radius:50%}\n"] }]
553
+ }], propDecorators: { color: [{
554
+ type: Input
555
+ }, {
556
+ type: HostBinding,
557
+ args: ['attr.data-color']
558
+ }], size: [{
559
+ type: Input
560
+ }, {
561
+ type: HostBinding,
562
+ args: ['attr.data-size']
563
+ }], isWithDot: [{
564
+ type: Input
565
565
  }] } });
566
566
 
567
- class CuiBadgeModule {
568
- }
569
- CuiBadgeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
570
- CuiBadgeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiBadgeModule, declarations: [CuiBadgeComponent], imports: [CommonModule], exports: [CuiBadgeComponent] });
571
- CuiBadgeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBadgeModule, imports: [CommonModule] });
572
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBadgeModule, decorators: [{
573
- type: NgModule,
574
- args: [{
575
- imports: [CommonModule],
576
- declarations: [CuiBadgeComponent],
577
- exports: [CuiBadgeComponent]
578
- }]
567
+ class CuiBadgeModule {
568
+ }
569
+ CuiBadgeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
570
+ CuiBadgeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiBadgeModule, declarations: [CuiBadgeComponent], imports: [CommonModule], exports: [CuiBadgeComponent] });
571
+ CuiBadgeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBadgeModule, imports: [CommonModule] });
572
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBadgeModule, decorators: [{
573
+ type: NgModule,
574
+ args: [{
575
+ imports: [CommonModule],
576
+ declarations: [CuiBadgeComponent],
577
+ exports: [CuiBadgeComponent]
578
+ }]
579
579
  }] });
580
580
 
581
- const CUI_BANNER_DEFAULT_OPTIONS = {
582
- status: 'info'
583
- };
581
+ const CUI_BANNER_DEFAULT_OPTIONS = {
582
+ status: 'info'
583
+ };
584
584
  const CUI_BANNER_OPTIONS = cuiCreateToken(CUI_BANNER_DEFAULT_OPTIONS);
585
585
 
586
- const CUI_THEME_STORAGE_DEFAULT_KEY = 'cuiTheme';
587
- const CUI_DEFAULT_THEME = 'light';
588
- const CUI_THEME_STORAGE_KEY = cuiCreateToken(CUI_THEME_STORAGE_DEFAULT_KEY);
586
+ const CUI_THEME_STORAGE_DEFAULT_KEY = 'cuiTheme';
587
+ const CUI_DEFAULT_THEME = 'light';
588
+ const CUI_THEME_STORAGE_KEY = cuiCreateToken(CUI_THEME_STORAGE_DEFAULT_KEY);
589
589
  const CUI_THEME = cuiCreateToken(CUI_DEFAULT_THEME);
590
590
 
591
- class CuiThemeService extends BehaviorSubject {
592
- constructor() {
593
- super(inject(CUI_LOCAL_STORAGE).getItem(inject(CUI_THEME_STORAGE_KEY))
594
- ?? inject(CUI_THEME));
595
- this.localStorage = inject(CUI_LOCAL_STORAGE);
596
- this.key = inject(CUI_THEME_STORAGE_KEY);
597
- }
598
- next(theme) {
599
- this.localStorage.setItem(this.key, theme);
600
- super.next(theme);
601
- }
602
- // При работе только двух тем
603
- switch() {
604
- this.next(this.value === 'light' ? 'dark' : 'light');
605
- }
606
- }
607
- CuiThemeService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiThemeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
608
- CuiThemeService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiThemeService, providedIn: 'root' });
609
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiThemeService, decorators: [{
610
- type: Injectable,
611
- args: [{
612
- providedIn: 'root'
613
- }]
591
+ class CuiThemeService extends BehaviorSubject {
592
+ constructor() {
593
+ super(inject(CUI_LOCAL_STORAGE).getItem(inject(CUI_THEME_STORAGE_KEY))
594
+ ?? inject(CUI_THEME));
595
+ this.localStorage = inject(CUI_LOCAL_STORAGE);
596
+ this.key = inject(CUI_THEME_STORAGE_KEY);
597
+ }
598
+ next(theme) {
599
+ this.localStorage.setItem(this.key, theme);
600
+ super.next(theme);
601
+ }
602
+ // При работе только двух тем
603
+ switch() {
604
+ this.next(this.value === 'light' ? 'dark' : 'light');
605
+ }
606
+ }
607
+ CuiThemeService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiThemeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
608
+ CuiThemeService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiThemeService, providedIn: 'root' });
609
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiThemeService, decorators: [{
610
+ type: Injectable,
611
+ args: [{
612
+ providedIn: 'root'
613
+ }]
614
614
  }], ctorParameters: function () { return []; } });
615
615
 
616
- class CuiBannerComponent {
617
- constructor() {
618
- this.options = inject(CUI_BANNER_OPTIONS);
619
- this.theme$ = inject(CuiThemeService);
620
- this.ICON_OPTIONS = {
621
- info: {
622
- icon: 'cuiIconInfo',
623
- color: 'var(--c-info-icon-color)'
624
- },
625
- success: {
626
- icon: 'cuiIconCheckCircle',
627
- color: 'var(--cui-success)'
628
- },
629
- alert: {
630
- icon: 'cuiIconAlertTriangle',
631
- color: 'var(--c-alert-icon-color)'
632
- },
633
- error: {
634
- icon: 'cuiIconAlertCircle',
635
- color: 'var(--cui-danger)'
636
- },
637
- };
638
- this.THEME_CLOSE_BUTTON_ICON_COLORS = {
639
- light: 'var(--cui-gray-500)',
640
- dark: 'var(--cui-gray-0)'
641
- };
642
- this.status = this.options.status;
643
- this.isCloseable = true;
644
- this.actionButtonClicked = new EventEmitter();
645
- this.closed = new EventEmitter();
646
- }
647
- onAction() {
648
- this.actionButtonClicked.emit();
649
- }
650
- onClose() {
651
- this.closed.emit();
652
- }
653
- }
654
- CuiBannerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBannerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
655
- CuiBannerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiBannerComponent, selector: "cui-banner", inputs: { status: "status", isCloseable: "isCloseable", label: "label", actionButtonText: "actionButtonText" }, outputs: { actionButtonClicked: "actionButtonClicked", closed: "closed" }, host: { properties: { "attr.data-status": "this.status" } }, ngImport: i0, template: "<cui-svg\n *cuiLet=\"ICON_OPTIONS[status] as iconOption\"\n [icon]=\"iconOption.icon\"\n [color]=\"iconOption.color\"\n class=\"c-icon\"\n></cui-svg>\n<div class=\"c-wrapper\">\n <h2\n *ngIf=\"label\"\n class=\"c-heading\"\n >\n {{ label }}\n </h2>\n <ng-content></ng-content>\n <button\n cuiButton\n *ngIf=\"actionButtonText\"\n appearance=\"link\"\n class=\"c-action\"\n (click)=\"onAction()\"\n >\n {{ actionButtonText }}\n </button>\n</div>\n<button\n *ngIf=\"isCloseable\"\n class=\"c-button\"\n (click)=\"onClose()\"\n>\n <cui-svg\n *cuiLet=\"theme$ | async as theme\"\n icon=\"cuiIconX\"\n [color]=\"THEME_CLOSE_BUTTON_ICON_COLORS[theme!]\"\n />\n</button>\n", styles: [":host{--c-info-icon-color: var(--cui-light-blue-800);--c-alert-icon-color: var(--cui-orange-800);padding:8px 16px;font-weight:400;font-size:14px;line-height:20px;display:flex;gap:16px;align-items:center;color:var(--cui-base-900);font-family:var(--cui-main-font)}:host[data-status=info]{color:var(--cui-light-blue-800);background:var(--cui-blue-50)}:host[data-status=success]{background:var(--cui-green-50)}:host[data-status=alert]{color:var(--cui-orange-800);background:var(--cui-yellow-100)}:host[data-status=error]{background:var(--cui-red-50)}:host-context([cuiTheme=dark]){--c-info-icon-color: var(--cui-light-blue-400);--c-alert-icon-color: var(--cui-yellow-300);color:var(--cui-gray-0)}:host-context([cuiTheme=dark])[data-status=info]{color:var(--cui-light-blue-400);background:var(--cui-blue-900)}:host-context([cuiTheme=dark])[data-status=info] .c-action:hover{color:var(--cui-blue-500)}:host-context([cuiTheme=dark])[data-status=success]{background:var(--cui-green-900)}:host-context([cuiTheme=dark])[data-status=success] .c-action{color:var(--cui-green-500)}:host-context([cuiTheme=dark])[data-status=alert]{background:var(--cui-yellow-900)}:host-context([cuiTheme=dark])[data-status=alert] .c-action{color:var(--cui-yellow-300)}:host-context([cuiTheme=dark])[data-status=error]{background:var(--cui-red-900)}:host-context([cuiTheme=dark])[data-status=error] .c-action{color:var(--cui-red-400)}.c-icon{height:28px}.c-wrapper{flex:1;display:flex;align-items:center;gap:16px;overflow-wrap:anywhere}.c-heading{font-weight:500;font-size:14px;line-height:20px;margin:0}.c-button{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:8px;padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}.c-button:hover{background:rgba(255,255,255,.2)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.CuiLetDirective, selector: "[cuiLet]", inputs: ["cuiLet"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "size"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
656
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBannerComponent, decorators: [{
657
- type: Component,
658
- args: [{ selector: 'cui-banner', changeDetection: ChangeDetectionStrategy.OnPush, template: "<cui-svg\n *cuiLet=\"ICON_OPTIONS[status] as iconOption\"\n [icon]=\"iconOption.icon\"\n [color]=\"iconOption.color\"\n class=\"c-icon\"\n></cui-svg>\n<div class=\"c-wrapper\">\n <h2\n *ngIf=\"label\"\n class=\"c-heading\"\n >\n {{ label }}\n </h2>\n <ng-content></ng-content>\n <button\n cuiButton\n *ngIf=\"actionButtonText\"\n appearance=\"link\"\n class=\"c-action\"\n (click)=\"onAction()\"\n >\n {{ actionButtonText }}\n </button>\n</div>\n<button\n *ngIf=\"isCloseable\"\n class=\"c-button\"\n (click)=\"onClose()\"\n>\n <cui-svg\n *cuiLet=\"theme$ | async as theme\"\n icon=\"cuiIconX\"\n [color]=\"THEME_CLOSE_BUTTON_ICON_COLORS[theme!]\"\n />\n</button>\n", styles: [":host{--c-info-icon-color: var(--cui-light-blue-800);--c-alert-icon-color: var(--cui-orange-800);padding:8px 16px;font-weight:400;font-size:14px;line-height:20px;display:flex;gap:16px;align-items:center;color:var(--cui-base-900);font-family:var(--cui-main-font)}:host[data-status=info]{color:var(--cui-light-blue-800);background:var(--cui-blue-50)}:host[data-status=success]{background:var(--cui-green-50)}:host[data-status=alert]{color:var(--cui-orange-800);background:var(--cui-yellow-100)}:host[data-status=error]{background:var(--cui-red-50)}:host-context([cuiTheme=dark]){--c-info-icon-color: var(--cui-light-blue-400);--c-alert-icon-color: var(--cui-yellow-300);color:var(--cui-gray-0)}:host-context([cuiTheme=dark])[data-status=info]{color:var(--cui-light-blue-400);background:var(--cui-blue-900)}:host-context([cuiTheme=dark])[data-status=info] .c-action:hover{color:var(--cui-blue-500)}:host-context([cuiTheme=dark])[data-status=success]{background:var(--cui-green-900)}:host-context([cuiTheme=dark])[data-status=success] .c-action{color:var(--cui-green-500)}:host-context([cuiTheme=dark])[data-status=alert]{background:var(--cui-yellow-900)}:host-context([cuiTheme=dark])[data-status=alert] .c-action{color:var(--cui-yellow-300)}:host-context([cuiTheme=dark])[data-status=error]{background:var(--cui-red-900)}:host-context([cuiTheme=dark])[data-status=error] .c-action{color:var(--cui-red-400)}.c-icon{height:28px}.c-wrapper{flex:1;display:flex;align-items:center;gap:16px;overflow-wrap:anywhere}.c-heading{font-weight:500;font-size:14px;line-height:20px;margin:0}.c-button{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:8px;padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}.c-button:hover{background:rgba(255,255,255,.2)}\n"] }]
659
- }], propDecorators: { status: [{
660
- type: Input
661
- }, {
662
- type: HostBinding,
663
- args: ['attr.data-status']
664
- }], isCloseable: [{
665
- type: Input
666
- }], label: [{
667
- type: Input
668
- }], actionButtonText: [{
669
- type: Input
670
- }], actionButtonClicked: [{
671
- type: Output
672
- }], closed: [{
673
- type: Output
616
+ class CuiBannerComponent {
617
+ constructor() {
618
+ this.options = inject(CUI_BANNER_OPTIONS);
619
+ this.theme$ = inject(CuiThemeService);
620
+ this.ICON_OPTIONS = {
621
+ info: {
622
+ icon: 'cuiIconInfo',
623
+ color: 'var(--c-info-icon-color)'
624
+ },
625
+ success: {
626
+ icon: 'cuiIconCheckCircle',
627
+ color: 'var(--cui-success)'
628
+ },
629
+ alert: {
630
+ icon: 'cuiIconAlertTriangle',
631
+ color: 'var(--c-alert-icon-color)'
632
+ },
633
+ error: {
634
+ icon: 'cuiIconAlertCircle',
635
+ color: 'var(--cui-danger)'
636
+ },
637
+ };
638
+ this.THEME_CLOSE_BUTTON_ICON_COLORS = {
639
+ light: 'var(--cui-gray-500)',
640
+ dark: 'var(--cui-gray-0)'
641
+ };
642
+ this.status = this.options.status;
643
+ this.isCloseable = true;
644
+ this.actionButtonClicked = new EventEmitter();
645
+ this.closed = new EventEmitter();
646
+ }
647
+ onAction() {
648
+ this.actionButtonClicked.emit();
649
+ }
650
+ onClose() {
651
+ this.closed.emit();
652
+ }
653
+ }
654
+ CuiBannerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBannerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
655
+ CuiBannerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiBannerComponent, selector: "cui-banner", inputs: { status: "status", isCloseable: "isCloseable", label: "label", actionButtonText: "actionButtonText" }, outputs: { actionButtonClicked: "actionButtonClicked", closed: "closed" }, host: { properties: { "attr.data-status": "this.status" } }, ngImport: i0, template: "<cui-svg\r\n *cuiLet=\"ICON_OPTIONS[status] as iconOption\"\r\n [icon]=\"iconOption.icon\"\r\n [color]=\"iconOption.color\"\r\n class=\"c-icon\"\r\n></cui-svg>\r\n<div class=\"c-wrapper\">\r\n <h2\r\n *ngIf=\"label\"\r\n class=\"c-heading\"\r\n >\r\n {{ label }}\r\n </h2>\r\n <ng-content></ng-content>\r\n <button\r\n cuiButton\r\n *ngIf=\"actionButtonText\"\r\n appearance=\"link\"\r\n class=\"c-action\"\r\n (click)=\"onAction()\"\r\n >\r\n {{ actionButtonText }}\r\n </button>\r\n</div>\r\n<button\r\n *ngIf=\"isCloseable\"\r\n class=\"c-button\"\r\n (click)=\"onClose()\"\r\n>\r\n <cui-svg\r\n *cuiLet=\"theme$ | async as theme\"\r\n icon=\"cuiIconX\"\r\n [color]=\"THEME_CLOSE_BUTTON_ICON_COLORS[theme!]\"\r\n />\r\n</button>\r\n", styles: [":host{--c-info-icon-color: var(--cui-light-blue-800);--c-alert-icon-color: var(--cui-orange-800);padding:8px 16px;font-weight:400;font-size:14px;line-height:20px;display:flex;gap:16px;align-items:center;color:var(--cui-base-900);font-family:var(--cui-main-font)}:host[data-status=info]{color:var(--cui-light-blue-800);background:var(--cui-blue-50)}:host[data-status=success]{background:var(--cui-green-50)}:host[data-status=alert]{color:var(--cui-orange-800);background:var(--cui-yellow-100)}:host[data-status=error]{background:var(--cui-red-50)}:host-context([cuiTheme=dark]){--c-info-icon-color: var(--cui-light-blue-400);--c-alert-icon-color: var(--cui-yellow-300);color:var(--cui-gray-0)}:host-context([cuiTheme=dark])[data-status=info]{color:var(--cui-light-blue-400);background:var(--cui-blue-900)}:host-context([cuiTheme=dark])[data-status=info] .c-action:hover{color:var(--cui-blue-500)}:host-context([cuiTheme=dark])[data-status=success]{background:var(--cui-green-900)}:host-context([cuiTheme=dark])[data-status=success] .c-action{color:var(--cui-green-500)}:host-context([cuiTheme=dark])[data-status=alert]{background:var(--cui-yellow-900)}:host-context([cuiTheme=dark])[data-status=alert] .c-action{color:var(--cui-yellow-300)}:host-context([cuiTheme=dark])[data-status=error]{background:var(--cui-red-900)}:host-context([cuiTheme=dark])[data-status=error] .c-action{color:var(--cui-red-400)}.c-icon{height:28px}.c-wrapper{flex:1;display:flex;align-items:center;gap:16px;overflow-wrap:anywhere}.c-heading{font-weight:500;font-size:14px;line-height:20px;margin:0}.c-button{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:8px;padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}.c-button:hover{background:rgba(255,255,255,.2)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.CuiLetDirective, selector: "[cuiLet]", inputs: ["cuiLet"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "size"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
656
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBannerComponent, decorators: [{
657
+ type: Component,
658
+ args: [{ selector: 'cui-banner', changeDetection: ChangeDetectionStrategy.OnPush, template: "<cui-svg\r\n *cuiLet=\"ICON_OPTIONS[status] as iconOption\"\r\n [icon]=\"iconOption.icon\"\r\n [color]=\"iconOption.color\"\r\n class=\"c-icon\"\r\n></cui-svg>\r\n<div class=\"c-wrapper\">\r\n <h2\r\n *ngIf=\"label\"\r\n class=\"c-heading\"\r\n >\r\n {{ label }}\r\n </h2>\r\n <ng-content></ng-content>\r\n <button\r\n cuiButton\r\n *ngIf=\"actionButtonText\"\r\n appearance=\"link\"\r\n class=\"c-action\"\r\n (click)=\"onAction()\"\r\n >\r\n {{ actionButtonText }}\r\n </button>\r\n</div>\r\n<button\r\n *ngIf=\"isCloseable\"\r\n class=\"c-button\"\r\n (click)=\"onClose()\"\r\n>\r\n <cui-svg\r\n *cuiLet=\"theme$ | async as theme\"\r\n icon=\"cuiIconX\"\r\n [color]=\"THEME_CLOSE_BUTTON_ICON_COLORS[theme!]\"\r\n />\r\n</button>\r\n", styles: [":host{--c-info-icon-color: var(--cui-light-blue-800);--c-alert-icon-color: var(--cui-orange-800);padding:8px 16px;font-weight:400;font-size:14px;line-height:20px;display:flex;gap:16px;align-items:center;color:var(--cui-base-900);font-family:var(--cui-main-font)}:host[data-status=info]{color:var(--cui-light-blue-800);background:var(--cui-blue-50)}:host[data-status=success]{background:var(--cui-green-50)}:host[data-status=alert]{color:var(--cui-orange-800);background:var(--cui-yellow-100)}:host[data-status=error]{background:var(--cui-red-50)}:host-context([cuiTheme=dark]){--c-info-icon-color: var(--cui-light-blue-400);--c-alert-icon-color: var(--cui-yellow-300);color:var(--cui-gray-0)}:host-context([cuiTheme=dark])[data-status=info]{color:var(--cui-light-blue-400);background:var(--cui-blue-900)}:host-context([cuiTheme=dark])[data-status=info] .c-action:hover{color:var(--cui-blue-500)}:host-context([cuiTheme=dark])[data-status=success]{background:var(--cui-green-900)}:host-context([cuiTheme=dark])[data-status=success] .c-action{color:var(--cui-green-500)}:host-context([cuiTheme=dark])[data-status=alert]{background:var(--cui-yellow-900)}:host-context([cuiTheme=dark])[data-status=alert] .c-action{color:var(--cui-yellow-300)}:host-context([cuiTheme=dark])[data-status=error]{background:var(--cui-red-900)}:host-context([cuiTheme=dark])[data-status=error] .c-action{color:var(--cui-red-400)}.c-icon{height:28px}.c-wrapper{flex:1;display:flex;align-items:center;gap:16px;overflow-wrap:anywhere}.c-heading{font-weight:500;font-size:14px;line-height:20px;margin:0}.c-button{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:8px;padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}.c-button:hover{background:rgba(255,255,255,.2)}\n"] }]
659
+ }], propDecorators: { status: [{
660
+ type: Input
661
+ }, {
662
+ type: HostBinding,
663
+ args: ['attr.data-status']
664
+ }], isCloseable: [{
665
+ type: Input
666
+ }], label: [{
667
+ type: Input
668
+ }], actionButtonText: [{
669
+ type: Input
670
+ }], actionButtonClicked: [{
671
+ type: Output
672
+ }], closed: [{
673
+ type: Output
674
674
  }] } });
675
675
 
676
- class CuiBannerModule {
677
- }
678
- CuiBannerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBannerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
679
- CuiBannerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiBannerModule, declarations: [CuiBannerComponent], imports: [CommonModule,
680
- CuiLetDirective,
681
- CuiSvgModule,
682
- CuiButtonModule], exports: [CuiBannerComponent] });
683
- CuiBannerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBannerModule, imports: [CommonModule,
684
- CuiSvgModule,
685
- CuiButtonModule] });
686
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBannerModule, decorators: [{
687
- type: NgModule,
688
- args: [{
689
- imports: [
690
- CommonModule,
691
- CuiLetDirective,
692
- CuiSvgModule,
693
- CuiButtonModule
694
- ],
695
- declarations: [CuiBannerComponent],
696
- exports: [CuiBannerComponent]
697
- }]
676
+ class CuiBannerModule {
677
+ }
678
+ CuiBannerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBannerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
679
+ CuiBannerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiBannerModule, declarations: [CuiBannerComponent], imports: [CommonModule,
680
+ CuiLetDirective,
681
+ CuiSvgModule,
682
+ CuiButtonModule], exports: [CuiBannerComponent] });
683
+ CuiBannerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBannerModule, imports: [CommonModule,
684
+ CuiSvgModule,
685
+ CuiButtonModule] });
686
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBannerModule, decorators: [{
687
+ type: NgModule,
688
+ args: [{
689
+ imports: [
690
+ CommonModule,
691
+ CuiLetDirective,
692
+ CuiSvgModule,
693
+ CuiButtonModule
694
+ ],
695
+ declarations: [CuiBannerComponent],
696
+ exports: [CuiBannerComponent]
697
+ }]
698
698
  }] });
699
699
 
700
- class CuiBreadcrumbsComponent {
701
- }
702
- CuiBreadcrumbsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
703
- CuiBreadcrumbsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiBreadcrumbsComponent, selector: "cui-breadcrumbs", queries: [{ propertyName: "breadcrumbs", predicate: CuiItemDirective, read: TemplateRef }], ngImport: i0, template: "<ng-container *ngIf=\"breadcrumbs.changes | async\"/>\n<ng-container *ngFor=\"let breadcrumb of breadcrumbs; let isLast = last\">\n <ng-container *ngTemplateOutlet=\"breadcrumb\" />\n <cui-svg\n *ngIf=\"!isLast\"\n icon=\"cuiIconSlashDivider\"\n color=\"var(--cui-base-500)\"\n />\n</ng-container>\n", styles: [":host{display:flex;align-items:center;flex-wrap:wrap;gap:2px}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
704
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbsComponent, decorators: [{
705
- type: Component,
706
- args: [{ selector: 'cui-breadcrumbs', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"breadcrumbs.changes | async\"/>\n<ng-container *ngFor=\"let breadcrumb of breadcrumbs; let isLast = last\">\n <ng-container *ngTemplateOutlet=\"breadcrumb\" />\n <cui-svg\n *ngIf=\"!isLast\"\n icon=\"cuiIconSlashDivider\"\n color=\"var(--cui-base-500)\"\n />\n</ng-container>\n", styles: [":host{display:flex;align-items:center;flex-wrap:wrap;gap:2px}\n"] }]
707
- }], propDecorators: { breadcrumbs: [{
708
- type: ContentChildren,
709
- args: [CuiItemDirective, { read: TemplateRef }]
700
+ class CuiBreadcrumbsComponent {
701
+ }
702
+ CuiBreadcrumbsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
703
+ CuiBreadcrumbsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiBreadcrumbsComponent, selector: "cui-breadcrumbs", queries: [{ propertyName: "breadcrumbs", predicate: CuiItemDirective, read: TemplateRef }], ngImport: i0, template: "<ng-container *ngIf=\"breadcrumbs.changes | async\"/>\r\n<ng-container *ngFor=\"let breadcrumb of breadcrumbs; let isLast = last\">\r\n <ng-container *ngTemplateOutlet=\"breadcrumb\" />\r\n <cui-svg\r\n *ngIf=\"!isLast\"\r\n icon=\"cuiIconSlashDivider\"\r\n color=\"var(--cui-base-500)\"\r\n />\r\n</ng-container>\r\n", styles: [":host{display:flex;align-items:center;flex-wrap:wrap;gap:2px}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
704
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbsComponent, decorators: [{
705
+ type: Component,
706
+ args: [{ selector: 'cui-breadcrumbs', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"breadcrumbs.changes | async\"/>\r\n<ng-container *ngFor=\"let breadcrumb of breadcrumbs; let isLast = last\">\r\n <ng-container *ngTemplateOutlet=\"breadcrumb\" />\r\n <cui-svg\r\n *ngIf=\"!isLast\"\r\n icon=\"cuiIconSlashDivider\"\r\n color=\"var(--cui-base-500)\"\r\n />\r\n</ng-container>\r\n", styles: [":host{display:flex;align-items:center;flex-wrap:wrap;gap:2px}\n"] }]
707
+ }], propDecorators: { breadcrumbs: [{
708
+ type: ContentChildren,
709
+ args: [CuiItemDirective, { read: TemplateRef }]
710
710
  }] } });
711
711
 
712
- class CuiBreadcrumbComponent {
713
- constructor() {
714
- this.isLast = false;
715
- }
716
- }
717
- CuiBreadcrumbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
718
- CuiBreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiBreadcrumbComponent, selector: "[cuiBreadcrumb]", inputs: { isLast: "isLast" }, ngImport: i0, template: "<ng-content />\n", styles: [":host{font-weight:400;font-size:12px;line-height:14px;cursor:pointer;color:var(--cui-base-500);font-family:var(--cui-main-font)}:host:hover{color:var(--cui-base-900);text-decoration:underline}:host:last-of-type{cursor:default;color:var(--cui-base-900);text-decoration:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
719
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbComponent, decorators: [{
720
- type: Component,
721
- args: [{ selector: '[cuiBreadcrumb]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content />\n", styles: [":host{font-weight:400;font-size:12px;line-height:14px;cursor:pointer;color:var(--cui-base-500);font-family:var(--cui-main-font)}:host:hover{color:var(--cui-base-900);text-decoration:underline}:host:last-of-type{cursor:default;color:var(--cui-base-900);text-decoration:none}\n"] }]
722
- }], propDecorators: { isLast: [{
723
- type: Input
712
+ class CuiBreadcrumbComponent {
713
+ constructor() {
714
+ this.isLast = false;
715
+ }
716
+ }
717
+ CuiBreadcrumbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
718
+ CuiBreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiBreadcrumbComponent, selector: "[cuiBreadcrumb]", inputs: { isLast: "isLast" }, ngImport: i0, template: "<ng-content />\r\n", styles: [":host{font-weight:400;font-size:12px;line-height:14px;cursor:pointer;color:var(--cui-base-500);font-family:var(--cui-main-font)}:host:hover{color:var(--cui-base-900);text-decoration:underline}:host:last-of-type{cursor:default;color:var(--cui-base-900);text-decoration:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
719
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbComponent, decorators: [{
720
+ type: Component,
721
+ args: [{ selector: '[cuiBreadcrumb]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content />\r\n", styles: [":host{font-weight:400;font-size:12px;line-height:14px;cursor:pointer;color:var(--cui-base-500);font-family:var(--cui-main-font)}:host:hover{color:var(--cui-base-900);text-decoration:underline}:host:last-of-type{cursor:default;color:var(--cui-base-900);text-decoration:none}\n"] }]
722
+ }], propDecorators: { isLast: [{
723
+ type: Input
724
724
  }] } });
725
725
 
726
- class CuiBreadcrumbsModule {
727
- }
728
- CuiBreadcrumbsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
729
- CuiBreadcrumbsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbsModule, declarations: [CuiBreadcrumbsComponent,
730
- CuiBreadcrumbComponent], imports: [CommonModule,
731
- CuiSvgModule], exports: [CuiBreadcrumbsComponent,
732
- CuiBreadcrumbComponent] });
733
- CuiBreadcrumbsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbsModule, imports: [CommonModule,
734
- CuiSvgModule] });
735
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbsModule, decorators: [{
736
- type: NgModule,
737
- args: [{
738
- imports: [
739
- CommonModule,
740
- CuiSvgModule
741
- ],
742
- declarations: [
743
- CuiBreadcrumbsComponent,
744
- CuiBreadcrumbComponent
745
- ],
746
- exports: [
747
- CuiBreadcrumbsComponent,
748
- CuiBreadcrumbComponent
749
- ]
750
- }]
726
+ class CuiBreadcrumbsModule {
727
+ }
728
+ CuiBreadcrumbsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
729
+ CuiBreadcrumbsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbsModule, declarations: [CuiBreadcrumbsComponent,
730
+ CuiBreadcrumbComponent], imports: [CommonModule,
731
+ CuiSvgModule], exports: [CuiBreadcrumbsComponent,
732
+ CuiBreadcrumbComponent] });
733
+ CuiBreadcrumbsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbsModule, imports: [CommonModule,
734
+ CuiSvgModule] });
735
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbsModule, decorators: [{
736
+ type: NgModule,
737
+ args: [{
738
+ imports: [
739
+ CommonModule,
740
+ CuiSvgModule
741
+ ],
742
+ declarations: [
743
+ CuiBreadcrumbsComponent,
744
+ CuiBreadcrumbComponent
745
+ ],
746
+ exports: [
747
+ CuiBreadcrumbsComponent,
748
+ CuiBreadcrumbComponent
749
+ ]
750
+ }]
751
751
  }] });
752
752
 
753
- class CuiButtonGroupComponent {
754
- }
755
- CuiButtonGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
756
- CuiButtonGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiButtonGroupComponent, selector: "cui-button-group", ngImport: i0, template: "<ng-content select=\"button[cuiButton], a[cuiButton]\"></ng-content>\n", styles: [":host{display:inline-flex}:host ::ng-deep [cuiButton]:after{z-index:1;content:\"\";position:absolute;top:50%;right:-.5px;height:80%;width:1px;border-radius:.5px;transform:translateY(-50%);background:currentColor;opacity:.5}:host ::ng-deep [cuiButton]:first-child{border-right:none;border-top-right-radius:0;border-bottom-right-radius:0}:host ::ng-deep [cuiButton]:last-child{border-left:none;border-top-left-radius:0;border-bottom-left-radius:0}:host ::ng-deep [cuiButton]:last-child:after{content:none}:host ::ng-deep [cuiButton]:not(:first-child):not(:last-child){border-left:none;border-right:none;border-radius:0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
757
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonGroupComponent, decorators: [{
758
- type: Component,
759
- args: [{ selector: 'cui-button-group', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content select=\"button[cuiButton], a[cuiButton]\"></ng-content>\n", styles: [":host{display:inline-flex}:host ::ng-deep [cuiButton]:after{z-index:1;content:\"\";position:absolute;top:50%;right:-.5px;height:80%;width:1px;border-radius:.5px;transform:translateY(-50%);background:currentColor;opacity:.5}:host ::ng-deep [cuiButton]:first-child{border-right:none;border-top-right-radius:0;border-bottom-right-radius:0}:host ::ng-deep [cuiButton]:last-child{border-left:none;border-top-left-radius:0;border-bottom-left-radius:0}:host ::ng-deep [cuiButton]:last-child:after{content:none}:host ::ng-deep [cuiButton]:not(:first-child):not(:last-child){border-left:none;border-right:none;border-radius:0}\n"] }]
753
+ class CuiButtonGroupComponent {
754
+ }
755
+ CuiButtonGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
756
+ CuiButtonGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiButtonGroupComponent, selector: "cui-button-group", ngImport: i0, template: "<ng-content select=\"button[cuiButton], a[cuiButton]\"></ng-content>\r\n", styles: [":host{display:inline-flex}:host ::ng-deep [cuiButton]:after{z-index:1;content:\"\";position:absolute;top:50%;right:-.5px;height:80%;width:1px;border-radius:.5px;transform:translateY(-50%);background:currentColor;opacity:.5}:host ::ng-deep [cuiButton]:first-child{border-right:none;border-top-right-radius:0;border-bottom-right-radius:0}:host ::ng-deep [cuiButton]:last-child{border-left:none;border-top-left-radius:0;border-bottom-left-radius:0}:host ::ng-deep [cuiButton]:last-child:after{content:none}:host ::ng-deep [cuiButton]:not(:first-child):not(:last-child){border-left:none;border-right:none;border-radius:0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
757
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonGroupComponent, decorators: [{
758
+ type: Component,
759
+ args: [{ selector: 'cui-button-group', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content select=\"button[cuiButton], a[cuiButton]\"></ng-content>\r\n", styles: [":host{display:inline-flex}:host ::ng-deep [cuiButton]:after{z-index:1;content:\"\";position:absolute;top:50%;right:-.5px;height:80%;width:1px;border-radius:.5px;transform:translateY(-50%);background:currentColor;opacity:.5}:host ::ng-deep [cuiButton]:first-child{border-right:none;border-top-right-radius:0;border-bottom-right-radius:0}:host ::ng-deep [cuiButton]:last-child{border-left:none;border-top-left-radius:0;border-bottom-left-radius:0}:host ::ng-deep [cuiButton]:last-child:after{content:none}:host ::ng-deep [cuiButton]:not(:first-child):not(:last-child){border-left:none;border-right:none;border-radius:0}\n"] }]
760
760
  }] });
761
761
 
762
- class CuiButtonGroupModule {
763
- }
764
- CuiButtonGroupModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonGroupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
765
- CuiButtonGroupModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonGroupModule, declarations: [CuiButtonGroupComponent], exports: [CuiButtonGroupComponent] });
766
- CuiButtonGroupModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonGroupModule });
767
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonGroupModule, decorators: [{
768
- type: NgModule,
769
- args: [{
770
- declarations: [CuiButtonGroupComponent],
771
- exports: [CuiButtonGroupComponent]
772
- }]
762
+ class CuiButtonGroupModule {
763
+ }
764
+ CuiButtonGroupModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonGroupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
765
+ CuiButtonGroupModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonGroupModule, declarations: [CuiButtonGroupComponent], exports: [CuiButtonGroupComponent] });
766
+ CuiButtonGroupModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonGroupModule });
767
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonGroupModule, decorators: [{
768
+ type: NgModule,
769
+ args: [{
770
+ declarations: [CuiButtonGroupComponent],
771
+ exports: [CuiButtonGroupComponent]
772
+ }]
773
773
  }] });
774
774
 
775
- class CuiCheckboxComponent {
776
- }
777
- CuiCheckboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
778
- CuiCheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiCheckboxComponent, selector: "input[type=\"checkbox\"][cuiCheckbox]", ngImport: i0, template: '', isInline: true, styles: [":host{position:relative;width:16px;height:16px;border:1px solid var(--cui-base-200);border-radius:4px;outline:none;margin:0;appearance:none;cursor:pointer;background:var(--cui-base-0)}:host:before{content:\"\";position:absolute;transform:translate(-50%,-50%);top:50%;left:50%;width:12px;height:12px;mask-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M10 3L4.5 8.5L2 6\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>')}:host:checked{border:none;background:var(--cui-info)}:host:checked:before{background:#fff}:host:focus{box-shadow:0 0 0 2px var(--cui-focus)}@media (hover: hover){:host:hover{border-color:var(--cui-base-400)}}:host:active{border-color:var(--cui-base-400);box-shadow:none}:host:disabled{cursor:not-allowed;border:1px solid var(--cui-base-200);background:var(--cui-base-100)}:host:disabled:checked:before{border:1px solid var(--cui-info);background:var(--cui-gray-500)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
779
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiCheckboxComponent, decorators: [{
780
- type: Component,
781
- args: [{ selector: 'input[type="checkbox"][cuiCheckbox]', template: '', changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{position:relative;width:16px;height:16px;border:1px solid var(--cui-base-200);border-radius:4px;outline:none;margin:0;appearance:none;cursor:pointer;background:var(--cui-base-0)}:host:before{content:\"\";position:absolute;transform:translate(-50%,-50%);top:50%;left:50%;width:12px;height:12px;mask-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M10 3L4.5 8.5L2 6\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>')}:host:checked{border:none;background:var(--cui-info)}:host:checked:before{background:#fff}:host:focus{box-shadow:0 0 0 2px var(--cui-focus)}@media (hover: hover){:host:hover{border-color:var(--cui-base-400)}}:host:active{border-color:var(--cui-base-400);box-shadow:none}:host:disabled{cursor:not-allowed;border:1px solid var(--cui-base-200);background:var(--cui-base-100)}:host:disabled:checked:before{border:1px solid var(--cui-info);background:var(--cui-gray-500)}\n"] }]
775
+ class CuiCheckboxComponent {
776
+ }
777
+ CuiCheckboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
778
+ CuiCheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiCheckboxComponent, selector: "input[type=\"checkbox\"][cuiCheckbox]", ngImport: i0, template: '', isInline: true, styles: [":host{position:relative;width:16px;height:16px;border:1px solid var(--cui-base-200);border-radius:4px;outline:none;margin:0;appearance:none;cursor:pointer;background:var(--cui-base-0)}:host:before{content:\"\";position:absolute;transform:translate(-50%,-50%);top:50%;left:50%;width:12px;height:12px;mask-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M10 3L4.5 8.5L2 6\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>')}:host:checked{border:none;background:var(--cui-info)}:host:checked:before{background:#fff}:host:focus{box-shadow:0 0 0 2px var(--cui-focus)}@media (hover: hover){:host:hover{border-color:var(--cui-base-400)}}:host:active{border-color:var(--cui-base-400);box-shadow:none}:host:disabled{cursor:not-allowed;border:1px solid var(--cui-base-200);background:var(--cui-base-100)}:host:disabled:checked:before{border:1px solid var(--cui-info);background:var(--cui-gray-500)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
779
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiCheckboxComponent, decorators: [{
780
+ type: Component,
781
+ args: [{ selector: 'input[type="checkbox"][cuiCheckbox]', template: '', changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{position:relative;width:16px;height:16px;border:1px solid var(--cui-base-200);border-radius:4px;outline:none;margin:0;appearance:none;cursor:pointer;background:var(--cui-base-0)}:host:before{content:\"\";position:absolute;transform:translate(-50%,-50%);top:50%;left:50%;width:12px;height:12px;mask-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M10 3L4.5 8.5L2 6\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>')}:host:checked{border:none;background:var(--cui-info)}:host:checked:before{background:#fff}:host:focus{box-shadow:0 0 0 2px var(--cui-focus)}@media (hover: hover){:host:hover{border-color:var(--cui-base-400)}}:host:active{border-color:var(--cui-base-400);box-shadow:none}:host:disabled{cursor:not-allowed;border:1px solid var(--cui-base-200);background:var(--cui-base-100)}:host:disabled:checked:before{border:1px solid var(--cui-info);background:var(--cui-gray-500)}\n"] }]
782
782
  }] });
783
783
 
784
- class CuiCheckboxModule {
785
- }
786
- CuiCheckboxModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiCheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
787
- CuiCheckboxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiCheckboxModule, declarations: [CuiCheckboxComponent], exports: [CuiCheckboxComponent] });
788
- CuiCheckboxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiCheckboxModule });
789
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiCheckboxModule, decorators: [{
790
- type: NgModule,
791
- args: [{
792
- declarations: [CuiCheckboxComponent],
793
- exports: [CuiCheckboxComponent]
794
- }]
784
+ class CuiCheckboxModule {
785
+ }
786
+ CuiCheckboxModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiCheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
787
+ CuiCheckboxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiCheckboxModule, declarations: [CuiCheckboxComponent], exports: [CuiCheckboxComponent] });
788
+ CuiCheckboxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiCheckboxModule });
789
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiCheckboxModule, decorators: [{
790
+ type: NgModule,
791
+ args: [{
792
+ declarations: [CuiCheckboxComponent],
793
+ exports: [CuiCheckboxComponent]
794
+ }]
795
795
  }] });
796
796
 
797
797
  const CUI_ROOT_SELECTOR = 'cui-root';
798
798
 
799
- const CUI_DIALOGS = cuiCreateToken(new BehaviorSubject([]));
800
- const CUI_DIALOG_DEFAULT_OPTIONS = {
801
- size: 'auto',
802
- data: undefined,
803
- dismissible: true
804
- };
805
- const CUI_DIALOG_OPTIONS = cuiCreateToken(CUI_DIALOG_DEFAULT_OPTIONS);
799
+ const CUI_DIALOGS = cuiCreateToken(new BehaviorSubject([]));
800
+ const CUI_DIALOG_DEFAULT_OPTIONS = {
801
+ size: 'auto',
802
+ data: undefined,
803
+ dismissible: true
804
+ };
805
+ const CUI_DIALOG_OPTIONS = cuiCreateToken(CUI_DIALOG_DEFAULT_OPTIONS);
806
806
  const CUI_DIALOG_CONTEXT = new InjectionToken('');
807
807
 
808
- class CuiDialogsComponent {
809
- constructor() {
810
- this.document = inject(DOCUMENT);
811
- this.destroy$ = inject(CuiDestroyService, { self: true });
812
- this.dialogs$ = inject(CUI_DIALOGS);
813
- this.dialogInjectorCache = new Map();
814
- }
815
- ngOnInit() {
816
- this.initDialogsSubscription();
817
- }
818
- trackByFn(_, dialog) {
819
- return dialog.id;
820
- }
821
- initDialogsSubscription() {
822
- this.dialogs$
823
- .pipe(takeUntil(this.destroy$))
824
- .subscribe(dialogs => {
825
- this.document.body.style.overflow = dialogs.length ? 'hidden' : '';
826
- this.dialogInjectors = dialogs.map(dialog => {
827
- if (!this.dialogInjectorCache.has(dialog.id)) {
828
- this.dialogInjectorCache.set(dialog.id, Injector.create({
829
- providers: [{ provide: CUI_DIALOG_CONTEXT, useValue: dialog }],
830
- parent: dialog.injector
831
- }));
832
- }
833
- return this.dialogInjectorCache.get(dialog.id);
834
- });
835
- this.dialogInjectorCache.forEach((_, dialogId) => {
836
- if (dialogs.find(dialog => dialog.id === dialogId)) {
837
- return;
838
- }
839
- this.dialogInjectorCache.delete(dialogId);
840
- });
841
- });
842
- }
843
- }
844
- CuiDialogsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
845
- CuiDialogsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiDialogsComponent, selector: "cui-dialogs", providers: [CuiDestroyService], ngImport: i0, template: "<ng-container *cuiLet=\"dialogs$ | async as dialogs\">\n <ng-container *ngFor=\"let dialog of dialogs; let i = index; trackBy: trackByFn\">\n <ng-container *ngComponentOutlet=\"dialog.component; injector: dialogInjectors[i]\"></ng-container>\n </ng-container>\n <div\n *ngIf=\"dialogs!.length\"\n class=\"c-overlay\"\n ></div>\n</ng-container>\n", styles: [":host{isolation:isolate}.c-overlay{position:fixed;inset:0;background:var(--cui-base);opacity:.3}\n"], dependencies: [{ kind: "directive", type: i1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.CuiLetDirective, selector: "[cuiLet]", inputs: ["cuiLet"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
846
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogsComponent, decorators: [{
847
- type: Component,
848
- args: [{ selector: 'cui-dialogs', changeDetection: ChangeDetectionStrategy.OnPush, providers: [CuiDestroyService], template: "<ng-container *cuiLet=\"dialogs$ | async as dialogs\">\n <ng-container *ngFor=\"let dialog of dialogs; let i = index; trackBy: trackByFn\">\n <ng-container *ngComponentOutlet=\"dialog.component; injector: dialogInjectors[i]\"></ng-container>\n </ng-container>\n <div\n *ngIf=\"dialogs!.length\"\n class=\"c-overlay\"\n ></div>\n</ng-container>\n", styles: [":host{isolation:isolate}.c-overlay{position:fixed;inset:0;background:var(--cui-base);opacity:.3}\n"] }]
808
+ class CuiDialogsComponent {
809
+ constructor() {
810
+ this.document = inject(DOCUMENT);
811
+ this.destroy$ = inject(CuiDestroyService, { self: true });
812
+ this.dialogs$ = inject(CUI_DIALOGS);
813
+ this.dialogInjectorCache = new Map();
814
+ }
815
+ ngOnInit() {
816
+ this.initDialogsSubscription();
817
+ }
818
+ trackByFn(_, dialog) {
819
+ return dialog.id;
820
+ }
821
+ initDialogsSubscription() {
822
+ this.dialogs$
823
+ .pipe(takeUntil(this.destroy$))
824
+ .subscribe(dialogs => {
825
+ this.document.body.style.overflow = dialogs.length ? 'hidden' : '';
826
+ this.dialogInjectors = dialogs.map(dialog => {
827
+ if (!this.dialogInjectorCache.has(dialog.id)) {
828
+ this.dialogInjectorCache.set(dialog.id, Injector.create({
829
+ providers: [{ provide: CUI_DIALOG_CONTEXT, useValue: dialog }],
830
+ parent: dialog.injector
831
+ }));
832
+ }
833
+ return this.dialogInjectorCache.get(dialog.id);
834
+ });
835
+ this.dialogInjectorCache.forEach((_, dialogId) => {
836
+ if (dialogs.find(dialog => dialog.id === dialogId)) {
837
+ return;
838
+ }
839
+ this.dialogInjectorCache.delete(dialogId);
840
+ });
841
+ });
842
+ }
843
+ }
844
+ CuiDialogsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
845
+ CuiDialogsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiDialogsComponent, selector: "cui-dialogs", providers: [CuiDestroyService], ngImport: i0, template: "<ng-container *cuiLet=\"dialogs$ | async as dialogs\">\r\n <ng-container *ngFor=\"let dialog of dialogs; let i = index; trackBy: trackByFn\">\r\n <ng-container *ngComponentOutlet=\"dialog.component; injector: dialogInjectors[i]\"></ng-container>\r\n </ng-container>\r\n <div\r\n *ngIf=\"dialogs!.length\"\r\n class=\"c-overlay\"\r\n ></div>\r\n</ng-container>\r\n", styles: [":host{isolation:isolate}.c-overlay{position:fixed;inset:0;background:var(--cui-base);opacity:.3}\n"], dependencies: [{ kind: "directive", type: i1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.CuiLetDirective, selector: "[cuiLet]", inputs: ["cuiLet"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
846
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogsComponent, decorators: [{
847
+ type: Component,
848
+ args: [{ selector: 'cui-dialogs', changeDetection: ChangeDetectionStrategy.OnPush, providers: [CuiDestroyService], template: "<ng-container *cuiLet=\"dialogs$ | async as dialogs\">\r\n <ng-container *ngFor=\"let dialog of dialogs; let i = index; trackBy: trackByFn\">\r\n <ng-container *ngComponentOutlet=\"dialog.component; injector: dialogInjectors[i]\"></ng-container>\r\n </ng-container>\r\n <div\r\n *ngIf=\"dialogs!.length\"\r\n class=\"c-overlay\"\r\n ></div>\r\n</ng-container>\r\n", styles: [":host{isolation:isolate}.c-overlay{position:fixed;inset:0;background:var(--cui-base);opacity:.3}\n"] }]
849
849
  }] });
850
850
 
851
- class CuiRootComponent {
852
- constructor() {
853
- this.document = inject(DOCUMENT);
854
- this.theme$ = inject(CuiThemeService);
855
- this.destroy$ = inject(CuiDestroyService);
856
- }
857
- ngOnInit() {
858
- this.initThemeSubscription();
859
- }
860
- initThemeSubscription() {
861
- this.theme$
862
- .pipe(takeUntil(this.destroy$))
863
- .subscribe(theme => this.document.documentElement.setAttribute('cuiTheme', theme));
864
- }
865
- }
866
- CuiRootComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRootComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
867
- CuiRootComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiRootComponent, selector: "cui-root", providers: [CuiDestroyService], ngImport: i0, template: "<div class=\"c-content\">\n <ng-content />\n</div>\n<cui-dialogs />\n<cui-alerts />\n", styles: [".c-content{overflow:auto;min-height:100vh;isolation:isolate}\n"], dependencies: [{ kind: "component", type: CuiDialogsComponent, selector: "cui-dialogs" }, { kind: "component", type: CuiAlertsComponent, selector: "cui-alerts" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
868
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRootComponent, decorators: [{
869
- type: Component,
870
- args: [{ selector: CUI_ROOT_SELECTOR, changeDetection: ChangeDetectionStrategy.OnPush, providers: [CuiDestroyService], template: "<div class=\"c-content\">\n <ng-content />\n</div>\n<cui-dialogs />\n<cui-alerts />\n", styles: [".c-content{overflow:auto;min-height:100vh;isolation:isolate}\n"] }]
851
+ class CuiRootComponent {
852
+ constructor() {
853
+ this.document = inject(DOCUMENT);
854
+ this.theme$ = inject(CuiThemeService);
855
+ this.destroy$ = inject(CuiDestroyService);
856
+ }
857
+ ngOnInit() {
858
+ this.initThemeSubscription();
859
+ }
860
+ initThemeSubscription() {
861
+ this.theme$
862
+ .pipe(takeUntil(this.destroy$))
863
+ .subscribe(theme => this.document.documentElement.setAttribute('cuiTheme', theme));
864
+ }
865
+ }
866
+ CuiRootComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRootComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
867
+ CuiRootComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiRootComponent, selector: "cui-root", providers: [CuiDestroyService], ngImport: i0, template: "<div class=\"c-content\">\r\n <ng-content />\r\n</div>\r\n<cui-dialogs />\r\n<cui-alerts />\r\n", styles: [".c-content{overflow:auto;min-height:100vh;isolation:isolate}\n"], dependencies: [{ kind: "component", type: CuiDialogsComponent, selector: "cui-dialogs" }, { kind: "component", type: CuiAlertsComponent, selector: "cui-alerts" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
868
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRootComponent, decorators: [{
869
+ type: Component,
870
+ args: [{ selector: CUI_ROOT_SELECTOR, changeDetection: ChangeDetectionStrategy.OnPush, providers: [CuiDestroyService], template: "<div class=\"c-content\">\r\n <ng-content />\r\n</div>\r\n<cui-dialogs />\r\n<cui-alerts />\r\n", styles: [".c-content{overflow:auto;min-height:100vh;isolation:isolate}\n"] }]
871
871
  }] });
872
872
 
873
- // TODO: сделать структурную директиву
874
- const ContentType = {
875
- String: 'string',
876
- Template: 'template',
877
- Component: 'component'
878
- };
879
- class CuiDialogComponent {
880
- constructor() {
881
- this.element = inject(ElementRef).nativeElement;
882
- this.context = inject(CUI_DIALOG_CONTEXT);
883
- this.LAST_OF_TYPE_SELECTOR = ':last-of-type';
884
- this.ContentType = ContentType;
885
- this.contentType = ContentType.Component;
886
- }
887
- get size() {
888
- return this.context.size;
889
- }
890
- ngOnInit() {
891
- this.initContentType();
892
- }
893
- get contentTemplateRef() {
894
- return this.context.content;
895
- }
896
- get componentType() {
897
- return this.context.content;
898
- }
899
- onEscape() {
900
- if (!this.context.dismissible) {
901
- return;
902
- }
903
- if (!this.element.matches(this.LAST_OF_TYPE_SELECTOR)) {
904
- return;
905
- }
906
- this.context.completeWith();
907
- }
908
- initContentType() {
909
- const content = this.context.content;
910
- switch (true) {
911
- case (typeof content === 'string'):
912
- this.contentType = ContentType.String;
913
- return;
914
- case (content instanceof TemplateRef):
915
- this.contentType = ContentType.Template;
916
- return;
917
- }
918
- }
919
- }
920
- CuiDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
921
- CuiDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiDialogComponent, selector: "cui-dialog", host: { listeners: { "document:keydown.escape": "onEscape($event)" }, properties: { "attr.data-size": "this.size" } }, hostDirectives: [{ directive: i1$1.CuiFocusTrapDirective }], ngImport: i0, template: "<ng-container [ngSwitch]=\"contentType\">\n <ng-container *ngSwitchCase=\"ContentType.String\">\n {{ context.content }}\n </ng-container>\n <ng-container *ngSwitchCase=\"ContentType.Template\">\n <ng-container *ngTemplateOutlet=\"contentTemplateRef; context: context\"></ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"ContentType.Component\">\n <div class=\"c-component-container\">\n <ng-container *ngComponentOutlet=\"componentType\"></ng-container>\n </div>\n </ng-container>\n</ng-container>\n", styles: [":host{box-shadow:0 2px 4px -1px #0000000f,0 4px 6px -1px #0000001a;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;box-sizing:border-box;max-height:calc(100vh - 40px);width:100%;border-radius:12px;outline:none;background:var(--cui-base-0);font-family:var(--cui-main-font);border:1px solid var(--cui-base-200)}:host:last-of-type{z-index:1}:host[data-size=auto]{width:auto}:host[data-size=xl]{max-width:1080px}.c-component-container{display:contents}.c-component-container ::ng-deep>*{display:contents}\n"], dependencies: [{ kind: "directive", type: i1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
922
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogComponent, decorators: [{
923
- type: Component,
924
- args: [{ selector: 'cui-dialog', changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [CuiFocusTrapDirective], template: "<ng-container [ngSwitch]=\"contentType\">\n <ng-container *ngSwitchCase=\"ContentType.String\">\n {{ context.content }}\n </ng-container>\n <ng-container *ngSwitchCase=\"ContentType.Template\">\n <ng-container *ngTemplateOutlet=\"contentTemplateRef; context: context\"></ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"ContentType.Component\">\n <div class=\"c-component-container\">\n <ng-container *ngComponentOutlet=\"componentType\"></ng-container>\n </div>\n </ng-container>\n</ng-container>\n", styles: [":host{box-shadow:0 2px 4px -1px #0000000f,0 4px 6px -1px #0000001a;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;box-sizing:border-box;max-height:calc(100vh - 40px);width:100%;border-radius:12px;outline:none;background:var(--cui-base-0);font-family:var(--cui-main-font);border:1px solid var(--cui-base-200)}:host:last-of-type{z-index:1}:host[data-size=auto]{width:auto}:host[data-size=xl]{max-width:1080px}.c-component-container{display:contents}.c-component-container ::ng-deep>*{display:contents}\n"] }]
925
- }], propDecorators: { size: [{
926
- type: HostBinding,
927
- args: ['attr.data-size']
928
- }], onEscape: [{
929
- type: HostListener,
930
- args: ['document:keydown.escape', ['$event']]
873
+ // TODO: сделать структурную директиву
874
+ const ContentType = {
875
+ String: 'string',
876
+ Template: 'template',
877
+ Component: 'component'
878
+ };
879
+ class CuiDialogComponent {
880
+ constructor() {
881
+ this.element = inject(ElementRef).nativeElement;
882
+ this.context = inject(CUI_DIALOG_CONTEXT);
883
+ this.LAST_OF_TYPE_SELECTOR = ':last-of-type';
884
+ this.ContentType = ContentType;
885
+ this.contentType = ContentType.Component;
886
+ }
887
+ get size() {
888
+ return this.context.size;
889
+ }
890
+ ngOnInit() {
891
+ this.initContentType();
892
+ }
893
+ get contentTemplateRef() {
894
+ return this.context.content;
895
+ }
896
+ get componentType() {
897
+ return this.context.content;
898
+ }
899
+ onEscape() {
900
+ if (!this.context.dismissible) {
901
+ return;
902
+ }
903
+ if (!this.element.matches(this.LAST_OF_TYPE_SELECTOR)) {
904
+ return;
905
+ }
906
+ this.context.completeWith();
907
+ }
908
+ initContentType() {
909
+ const content = this.context.content;
910
+ switch (true) {
911
+ case (typeof content === 'string'):
912
+ this.contentType = ContentType.String;
913
+ return;
914
+ case (content instanceof TemplateRef):
915
+ this.contentType = ContentType.Template;
916
+ return;
917
+ }
918
+ }
919
+ }
920
+ CuiDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
921
+ CuiDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiDialogComponent, selector: "cui-dialog", host: { listeners: { "document:keydown.escape": "onEscape($event)" }, properties: { "attr.data-size": "this.size" } }, hostDirectives: [{ directive: i1$1.CuiFocusTrapDirective }], ngImport: i0, template: "<ng-container [ngSwitch]=\"contentType\">\r\n <ng-container *ngSwitchCase=\"ContentType.String\">\r\n {{ context.content }}\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"ContentType.Template\">\r\n <ng-container *ngTemplateOutlet=\"contentTemplateRef; context: context\"></ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"ContentType.Component\">\r\n <div class=\"c-component-container\">\r\n <ng-container *ngComponentOutlet=\"componentType\"></ng-container>\r\n </div>\r\n </ng-container>\r\n</ng-container>\r\n", styles: [":host{box-shadow:0 2px 4px -1px #0000000f,0 4px 6px -1px #0000001a;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;box-sizing:border-box;max-height:calc(100vh - 40px);width:100%;border-radius:12px;outline:none;background:var(--cui-base-0);font-family:var(--cui-main-font);border:1px solid var(--cui-base-200)}:host:last-of-type{z-index:1}:host[data-size=auto]{width:auto}:host[data-size=sm]{max-width:620px}:host[data-size=xl]{max-width:1080px}.c-component-container{display:contents}.c-component-container ::ng-deep>*{display:contents}\n"], dependencies: [{ kind: "directive", type: i1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
922
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogComponent, decorators: [{
923
+ type: Component,
924
+ args: [{ selector: 'cui-dialog', changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [CuiFocusTrapDirective], template: "<ng-container [ngSwitch]=\"contentType\">\r\n <ng-container *ngSwitchCase=\"ContentType.String\">\r\n {{ context.content }}\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"ContentType.Template\">\r\n <ng-container *ngTemplateOutlet=\"contentTemplateRef; context: context\"></ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"ContentType.Component\">\r\n <div class=\"c-component-container\">\r\n <ng-container *ngComponentOutlet=\"componentType\"></ng-container>\r\n </div>\r\n </ng-container>\r\n</ng-container>\r\n", styles: [":host{box-shadow:0 2px 4px -1px #0000000f,0 4px 6px -1px #0000001a;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;box-sizing:border-box;max-height:calc(100vh - 40px);width:100%;border-radius:12px;outline:none;background:var(--cui-base-0);font-family:var(--cui-main-font);border:1px solid var(--cui-base-200)}:host:last-of-type{z-index:1}:host[data-size=auto]{width:auto}:host[data-size=sm]{max-width:620px}:host[data-size=xl]{max-width:1080px}.c-component-container{display:contents}.c-component-container ::ng-deep>*{display:contents}\n"] }]
925
+ }], propDecorators: { size: [{
926
+ type: HostBinding,
927
+ args: ['attr.data-size']
928
+ }], onEscape: [{
929
+ type: HostListener,
930
+ args: ['document:keydown.escape', ['$event']]
931
931
  }] } });
932
932
 
933
- class CuiDialogActionsComponent {
934
- }
935
- CuiDialogActionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
936
- CuiDialogActionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiDialogActionsComponent, selector: "cui-dialog-actions", ngImport: i0, template: "<div class=\"c-divider\"></div>\n<div class=\"c-content\">\n <ng-content />\n</div>\n", styles: [":host{padding-right:24px;padding-left:24px;padding-bottom:16px;display:block}.c-divider{position:relative;left:-24px;width:calc(100% + 48px);height:1px;margin-bottom:15px;background:var(--cui-base-200)}.c-content{display:flex;align-items:center;justify-content:flex-end;gap:12px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
937
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogActionsComponent, decorators: [{
938
- type: Component,
939
- args: [{ selector: 'cui-dialog-actions', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"c-divider\"></div>\n<div class=\"c-content\">\n <ng-content />\n</div>\n", styles: [":host{padding-right:24px;padding-left:24px;padding-bottom:16px;display:block}.c-divider{position:relative;left:-24px;width:calc(100% + 48px);height:1px;margin-bottom:15px;background:var(--cui-base-200)}.c-content{display:flex;align-items:center;justify-content:flex-end;gap:12px}\n"] }]
933
+ class CuiDialogActionsComponent {
934
+ }
935
+ CuiDialogActionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
936
+ CuiDialogActionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiDialogActionsComponent, selector: "cui-dialog-actions", ngImport: i0, template: "<div class=\"c-divider\"></div>\r\n<div class=\"c-content\">\r\n <ng-content />\r\n</div>\r\n", styles: [":host{padding-right:24px;padding-left:24px;padding-bottom:16px;display:block}.c-divider{position:relative;left:-24px;width:calc(100% + 48px);height:1px;margin-bottom:15px;background:var(--cui-base-200)}.c-content{display:flex;align-items:center;justify-content:flex-end;gap:12px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
937
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogActionsComponent, decorators: [{
938
+ type: Component,
939
+ args: [{ selector: 'cui-dialog-actions', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"c-divider\"></div>\r\n<div class=\"c-content\">\r\n <ng-content />\r\n</div>\r\n", styles: [":host{padding-right:24px;padding-left:24px;padding-bottom:16px;display:block}.c-divider{position:relative;left:-24px;width:calc(100% + 48px);height:1px;margin-bottom:15px;background:var(--cui-base-200)}.c-content{display:flex;align-items:center;justify-content:flex-end;gap:12px}\n"] }]
940
940
  }] });
941
941
 
942
- class CuiDialogHeaderComponent {
943
- constructor() {
944
- this.closed = new EventEmitter();
945
- }
946
- onClose(event) {
947
- this.closed.emit(event);
948
- }
949
- }
950
- CuiDialogHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
951
- CuiDialogHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiDialogHeaderComponent, selector: "header[cuiDialogHeader][heading]", inputs: { heading: "heading", headingContext: "headingContext", subheading: "subheading" }, outputs: { closed: "closed" }, ngImport: i0, template: "<div class=\"c-heading\">\n <ng-container *polymorpheusOutlet=\"heading as heading; context: headingContext\">{{ heading }}</ng-container>\n</div>\n<button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n icon=\"cuiIconClearSm\"\n class=\"c-button\"\n (click)=\"onClose($event)\"\n></button>\n<span *ngIf=\"subheading\">{{ subheading }}</span>\n<ng-content />\n", styles: [":host{padding:16px 24px;position:relative;display:flex;flex-direction:column;gap:4px;font-family:var(--cui-main-font);color:var(--cui-base-500)}.c-heading{font-weight:500;font-size:16px;line-height:24px;width:calc(100% - 36px);color:var(--cui-base-900)}.c-button{position:absolute;top:12px;right:12px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.PolymorpheusOutletDirective, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
952
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogHeaderComponent, decorators: [{
953
- type: Component,
954
- args: [{ selector: 'header[cuiDialogHeader][heading]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"c-heading\">\n <ng-container *polymorpheusOutlet=\"heading as heading; context: headingContext\">{{ heading }}</ng-container>\n</div>\n<button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n icon=\"cuiIconClearSm\"\n class=\"c-button\"\n (click)=\"onClose($event)\"\n></button>\n<span *ngIf=\"subheading\">{{ subheading }}</span>\n<ng-content />\n", styles: [":host{padding:16px 24px;position:relative;display:flex;flex-direction:column;gap:4px;font-family:var(--cui-main-font);color:var(--cui-base-500)}.c-heading{font-weight:500;font-size:16px;line-height:24px;width:calc(100% - 36px);color:var(--cui-base-900)}.c-button{position:absolute;top:12px;right:12px}\n"] }]
955
- }], propDecorators: { heading: [{
956
- type: Input
957
- }], headingContext: [{
958
- type: Input
959
- }], subheading: [{
960
- type: Input
961
- }], closed: [{
962
- type: Output
942
+ class CuiDialogHeaderComponent {
943
+ constructor() {
944
+ this.closed = new EventEmitter();
945
+ }
946
+ onClose(event) {
947
+ this.closed.emit(event);
948
+ }
949
+ }
950
+ CuiDialogHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
951
+ CuiDialogHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiDialogHeaderComponent, selector: "header[cuiDialogHeader][heading]", inputs: { heading: "heading", headingContext: "headingContext", subheading: "subheading" }, outputs: { closed: "closed" }, ngImport: i0, template: "<div class=\"c-heading\">\r\n <ng-container *polymorpheusOutlet=\"heading as heading; context: headingContext\">{{ heading }}</ng-container>\r\n</div>\r\n<button\r\n cuiButton\r\n type=\"button\"\r\n appearance=\"ghost\"\r\n icon=\"cuiIconClearSm\"\r\n class=\"c-button\"\r\n (click)=\"onClose($event)\"\r\n></button>\r\n<span *ngIf=\"subheading\">{{ subheading }}</span>\r\n<ng-content />\r\n", styles: [":host{padding:16px 24px;position:relative;display:flex;flex-direction:column;gap:4px;font-family:var(--cui-main-font);color:var(--cui-base-500)}.c-heading{font-weight:500;font-size:16px;line-height:24px;width:calc(100% - 36px);color:var(--cui-base-900)}.c-button{position:absolute;top:12px;right:12px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.PolymorpheusOutletDirective, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
952
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogHeaderComponent, decorators: [{
953
+ type: Component,
954
+ args: [{ selector: 'header[cuiDialogHeader][heading]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"c-heading\">\r\n <ng-container *polymorpheusOutlet=\"heading as heading; context: headingContext\">{{ heading }}</ng-container>\r\n</div>\r\n<button\r\n cuiButton\r\n type=\"button\"\r\n appearance=\"ghost\"\r\n icon=\"cuiIconClearSm\"\r\n class=\"c-button\"\r\n (click)=\"onClose($event)\"\r\n></button>\r\n<span *ngIf=\"subheading\">{{ subheading }}</span>\r\n<ng-content />\r\n", styles: [":host{padding:16px 24px;position:relative;display:flex;flex-direction:column;gap:4px;font-family:var(--cui-main-font);color:var(--cui-base-500)}.c-heading{font-weight:500;font-size:16px;line-height:24px;width:calc(100% - 36px);color:var(--cui-base-900)}.c-button{position:absolute;top:12px;right:12px}\n"] }]
955
+ }], propDecorators: { heading: [{
956
+ type: Input
957
+ }], headingContext: [{
958
+ type: Input
959
+ }], subheading: [{
960
+ type: Input
961
+ }], closed: [{
962
+ type: Output
963
963
  }] } });
964
964
 
965
- class CuiDialogModule {
966
- }
967
- CuiDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
968
- CuiDialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogModule, declarations: [CuiDialogComponent,
969
- CuiDialogsComponent,
970
- CuiDialogActionsComponent,
971
- CuiDialogHeaderComponent], imports: [CommonModule,
972
- PolymorpheusModule,
973
- CuiLetDirective,
974
- CuiButtonModule], exports: [CuiDialogComponent,
975
- CuiDialogsComponent,
976
- CuiDialogActionsComponent,
977
- CuiDialogHeaderComponent] });
978
- CuiDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogModule, imports: [CommonModule,
979
- PolymorpheusModule,
980
- CuiButtonModule] });
981
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogModule, decorators: [{
982
- type: NgModule,
983
- args: [{
984
- imports: [
985
- CommonModule,
986
- PolymorpheusModule,
987
- CuiLetDirective,
988
- CuiButtonModule
989
- ],
990
- declarations: [
991
- CuiDialogComponent,
992
- CuiDialogsComponent,
993
- CuiDialogActionsComponent,
994
- CuiDialogHeaderComponent
995
- ],
996
- exports: [
997
- CuiDialogComponent,
998
- CuiDialogsComponent,
999
- CuiDialogActionsComponent,
1000
- CuiDialogHeaderComponent
1001
- ]
1002
- }]
965
+ class CuiDialogModule {
966
+ }
967
+ CuiDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
968
+ CuiDialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogModule, declarations: [CuiDialogComponent,
969
+ CuiDialogsComponent,
970
+ CuiDialogActionsComponent,
971
+ CuiDialogHeaderComponent], imports: [CommonModule,
972
+ PolymorpheusModule,
973
+ CuiLetDirective,
974
+ CuiButtonModule], exports: [CuiDialogComponent,
975
+ CuiDialogsComponent,
976
+ CuiDialogActionsComponent,
977
+ CuiDialogHeaderComponent] });
978
+ CuiDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogModule, imports: [CommonModule,
979
+ PolymorpheusModule,
980
+ CuiButtonModule] });
981
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogModule, decorators: [{
982
+ type: NgModule,
983
+ args: [{
984
+ imports: [
985
+ CommonModule,
986
+ PolymorpheusModule,
987
+ CuiLetDirective,
988
+ CuiButtonModule
989
+ ],
990
+ declarations: [
991
+ CuiDialogComponent,
992
+ CuiDialogsComponent,
993
+ CuiDialogActionsComponent,
994
+ CuiDialogHeaderComponent
995
+ ],
996
+ exports: [
997
+ CuiDialogComponent,
998
+ CuiDialogsComponent,
999
+ CuiDialogActionsComponent,
1000
+ CuiDialogHeaderComponent
1001
+ ]
1002
+ }]
1003
1003
  }] });
1004
1004
 
1005
- class CuiDialogService extends CuiPopoverService {
1006
- }
1007
- CuiDialogService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
1008
- CuiDialogService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogService, providedIn: 'root', useFactory: () => new CuiDialogService(CUI_DIALOGS, CuiDialogComponent, inject(CUI_DIALOG_OPTIONS)) });
1009
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogService, decorators: [{
1010
- type: Injectable,
1011
- args: [{
1012
- providedIn: 'root',
1013
- useFactory: () => new CuiDialogService(CUI_DIALOGS, CuiDialogComponent, inject(CUI_DIALOG_OPTIONS))
1014
- }]
1005
+ class CuiDialogService extends CuiPopoverService {
1006
+ }
1007
+ CuiDialogService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
1008
+ CuiDialogService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogService, providedIn: 'root', useFactory: () => new CuiDialogService(CUI_DIALOGS, CuiDialogComponent, inject(CUI_DIALOG_OPTIONS)) });
1009
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogService, decorators: [{
1010
+ type: Injectable,
1011
+ args: [{
1012
+ providedIn: 'root',
1013
+ useFactory: () => new CuiDialogService(CUI_DIALOGS, CuiDialogComponent, inject(CUI_DIALOG_OPTIONS))
1014
+ }]
1015
1015
  }] });
1016
1016
 
1017
- class CuiRootModule {
1018
- }
1019
- CuiRootModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRootModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1020
- CuiRootModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiRootModule, declarations: [CuiRootComponent], imports: [CommonModule,
1021
- CuiDialogModule,
1022
- CuiAlertModule], exports: [CuiRootComponent] });
1023
- CuiRootModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRootModule, imports: [CommonModule,
1024
- CuiDialogModule,
1025
- CuiAlertModule] });
1026
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRootModule, decorators: [{
1027
- type: NgModule,
1028
- args: [{
1029
- imports: [
1030
- CommonModule,
1031
- CuiDialogModule,
1032
- CuiAlertModule
1033
- ],
1034
- declarations: [CuiRootComponent],
1035
- exports: [CuiRootComponent]
1036
- }]
1017
+ class CuiRootModule {
1018
+ }
1019
+ CuiRootModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRootModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1020
+ CuiRootModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiRootModule, declarations: [CuiRootComponent], imports: [CommonModule,
1021
+ CuiDialogModule,
1022
+ CuiAlertModule], exports: [CuiRootComponent] });
1023
+ CuiRootModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRootModule, imports: [CommonModule,
1024
+ CuiDialogModule,
1025
+ CuiAlertModule] });
1026
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRootModule, decorators: [{
1027
+ type: NgModule,
1028
+ args: [{
1029
+ imports: [
1030
+ CommonModule,
1031
+ CuiDialogModule,
1032
+ CuiAlertModule
1033
+ ],
1034
+ declarations: [CuiRootComponent],
1035
+ exports: [CuiRootComponent]
1036
+ }]
1037
1037
  }] });
1038
1038
 
1039
- class CuiContextMenuComponent {
1040
- constructor() {
1041
- this.changeDetectorRef = inject(ChangeDetectorRef);
1042
- this.viewContainerRef = inject(ViewContainerRef);
1043
- this.document = inject(DOCUMENT);
1044
- this.documentElement = this.document.documentElement;
1045
- this.window = inject(CUI_WINDOW);
1046
- this.destroy$ = inject(CuiDestroyService, { self: true });
1047
- this.cuiClickOutsideDirective = inject(CuiClickOutsideDirective, { self: true });
1048
- this.cuiTargetDirective = inject(CuiTargetDirective, { self: true });
1049
- this.EXTRA_OFFSET_LEFT = 0;
1050
- this.EXTRA_OFFSET_TOP = 0;
1051
- this.isVisible = false;
1052
- }
1053
- ngOnInit() {
1054
- this.initClickOutsideSubscription();
1055
- }
1056
- ngOnDestroy() {
1057
- this.clearViewContainerRef();
1058
- }
1059
- ngAfterViewInit() {
1060
- this.initTargetElementListener();
1061
- }
1062
- onSelect(item) {
1063
- this.close();
1064
- item.command?.();
1065
- }
1066
- onClose() {
1067
- this.close();
1068
- }
1069
- onStopClickPropagation(event) {
1070
- event.stopPropagation();
1071
- }
1072
- trackByFn(_, item) {
1073
- return item.label;
1074
- }
1075
- initClickOutsideSubscription() {
1076
- this.cuiClickOutsideDirective.cuiClickOutside
1077
- .pipe(takeUntil(this.destroy$))
1078
- .subscribe((target) => {
1079
- if (this.target.contains(target)) {
1080
- return;
1081
- }
1082
- this.close();
1083
- });
1084
- }
1085
- initTargetElementListener() {
1086
- this.targetEventListener = (event) => {
1087
- event.stopPropagation();
1088
- this.document.body.click();
1089
- this.isVisible = !this.isVisible;
1090
- this.clearViewContainerRef();
1091
- if (this.isVisible) {
1092
- this.renderList();
1093
- this.changePosition(event.clientX, event.clientY);
1094
- this.initHidingSubscription();
1095
- }
1096
- this.changeDetectorRef.markForCheck();
1097
- };
1098
- this.cuiTargetDirective.clicked
1099
- .pipe(takeUntil(this.destroy$))
1100
- .subscribe(this.targetEventListener);
1101
- }
1102
- initHidingSubscription() {
1103
- this.initHidingFromWindowEvent('scroll');
1104
- this.initHidingFromWindowEvent('resize');
1105
- }
1106
- initHidingFromWindowEvent(eventName) {
1107
- fromEvent(this.window, eventName)
1108
- .pipe(take(1))
1109
- .subscribe(() => {
1110
- this.close();
1111
- this.changeDetectorRef.markForCheck();
1112
- });
1113
- }
1114
- close() {
1115
- this.isVisible = false;
1116
- this.clearViewContainerRef();
1117
- }
1118
- renderList() {
1119
- const embeddedViewRef = this.viewContainerRef.createEmbeddedView(this.list);
1120
- this.node = embeddedViewRef.rootNodes[0];
1121
- embeddedViewRef.detectChanges();
1122
- this.document.querySelector(CUI_ROOT_SELECTOR).appendChild(this.node);
1123
- }
1124
- changePosition(x, y) {
1125
- this.node.style.visibility = 'hidden';
1126
- setTimeout(() => {
1127
- const { clientWidth, clientHeight } = this.documentElement;
1128
- const width = this.node.offsetWidth;
1129
- const height = this.node.offsetHeight;
1130
- let left = x;
1131
- let top = y;
1132
- if (left + width > clientWidth) {
1133
- left -= width;
1134
- }
1135
- if (top + height > clientHeight) {
1136
- top -= height;
1137
- }
1138
- left = Math.max(left, this.EXTRA_OFFSET_LEFT);
1139
- top = Math.max(top, this.EXTRA_OFFSET_TOP);
1140
- this.node.style.left = left + 'px';
1141
- this.node.style.top = top + 'px';
1142
- this.node.style.visibility = '';
1143
- this.changeDetectorRef.markForCheck();
1144
- });
1145
- }
1146
- clearViewContainerRef() {
1147
- this.viewContainerRef.clear();
1148
- }
1149
- }
1150
- CuiContextMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiContextMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1151
- CuiContextMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiContextMenuComponent, selector: "cui-context-menu[items][target]", inputs: { items: "items", target: "target" }, host: { listeners: { "window:resize": "onClose()", "click": "onStopClickPropagation($event)" } }, providers: [CuiDestroyService], viewQueries: [{ propertyName: "list", first: true, predicate: ["list"], descendants: true }], hostDirectives: [{ directive: i1$1.CuiClickOutsideDirective }, { directive: i1$1.CuiTargetDirective, inputs: ["ccTarget", "target"] }], ngImport: i0, template: "<ng-template #list>\n <div class=\"c-container\">\n <ul\n *ngIf=\"isVisible\"\n class=\"c-ul\"\n >\n <li\n *ngFor=\"let item of items; trackBy: trackByFn\"\n [style.color]=\"item.color\"\n >\n <button\n type=\"button\"\n class=\"c-button\"\n (click)=\"onSelect(item)\"\n >\n <cui-svg\n *ngIf=\"item.icon\"\n [icon]=\"item.icon\"\n [color]=\"item.color\"\n ></cui-svg>\n <span>{{ item.label }}</span>\n </button>\n </li>\n </ul>\n </div>\n</ng-template>\n", styles: [":host{display:none}.c-container{position:fixed;width:268px;border-radius:8px;z-index:1}.c-ul{padding:7px 0;margin:0;list-style:none;font-weight:400;font-size:14px;line-height:20px;box-shadow:0 1px 4px #0000000a,0 1px 4px #0000000a;border:1px solid var(--cui-base-200);border-radius:inherit;background:var(--cui-base-0);color:var(--cui-base-900);font-family:var(--cui-main-font)}.c-button{padding:8px 11px 8px 0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;padding:8px 11px;width:100%;display:flex;align-items:center;gap:12px}.c-button:active{background:var(--cui-base-50)}@media (hover: hover){.c-button:hover{background:var(--cui-base-50)}}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1152
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiContextMenuComponent, decorators: [{
1153
- type: Component,
1154
- args: [{ selector: 'cui-context-menu[items][target]', changeDetection: ChangeDetectionStrategy.OnPush, providers: [CuiDestroyService], hostDirectives: [
1155
- CuiClickOutsideDirective,
1156
- {
1157
- directive: CuiTargetDirective,
1158
- inputs: ['ccTarget: target']
1159
- }
1160
- ], template: "<ng-template #list>\n <div class=\"c-container\">\n <ul\n *ngIf=\"isVisible\"\n class=\"c-ul\"\n >\n <li\n *ngFor=\"let item of items; trackBy: trackByFn\"\n [style.color]=\"item.color\"\n >\n <button\n type=\"button\"\n class=\"c-button\"\n (click)=\"onSelect(item)\"\n >\n <cui-svg\n *ngIf=\"item.icon\"\n [icon]=\"item.icon\"\n [color]=\"item.color\"\n ></cui-svg>\n <span>{{ item.label }}</span>\n </button>\n </li>\n </ul>\n </div>\n</ng-template>\n", styles: [":host{display:none}.c-container{position:fixed;width:268px;border-radius:8px;z-index:1}.c-ul{padding:7px 0;margin:0;list-style:none;font-weight:400;font-size:14px;line-height:20px;box-shadow:0 1px 4px #0000000a,0 1px 4px #0000000a;border:1px solid var(--cui-base-200);border-radius:inherit;background:var(--cui-base-0);color:var(--cui-base-900);font-family:var(--cui-main-font)}.c-button{padding:8px 11px 8px 0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;padding:8px 11px;width:100%;display:flex;align-items:center;gap:12px}.c-button:active{background:var(--cui-base-50)}@media (hover: hover){.c-button:hover{background:var(--cui-base-50)}}\n"] }]
1161
- }], propDecorators: { items: [{
1162
- type: Input
1163
- }], target: [{
1164
- type: Input
1165
- }], list: [{
1166
- type: ViewChild,
1167
- args: ['list']
1168
- }], onClose: [{
1169
- type: HostListener,
1170
- args: ['window:resize']
1171
- }], onStopClickPropagation: [{
1172
- type: HostListener,
1173
- args: ['click', ['$event']]
1039
+ class CuiContextMenuComponent {
1040
+ constructor() {
1041
+ this.changeDetectorRef = inject(ChangeDetectorRef);
1042
+ this.viewContainerRef = inject(ViewContainerRef);
1043
+ this.document = inject(DOCUMENT);
1044
+ this.documentElement = this.document.documentElement;
1045
+ this.window = inject(CUI_WINDOW);
1046
+ this.destroy$ = inject(CuiDestroyService, { self: true });
1047
+ this.cuiClickOutsideDirective = inject(CuiClickOutsideDirective, { self: true });
1048
+ this.cuiTargetDirective = inject(CuiTargetDirective, { self: true });
1049
+ this.EXTRA_OFFSET_LEFT = 0;
1050
+ this.EXTRA_OFFSET_TOP = 0;
1051
+ this.isVisible = false;
1052
+ }
1053
+ ngOnInit() {
1054
+ this.initClickOutsideSubscription();
1055
+ }
1056
+ ngOnDestroy() {
1057
+ this.clearViewContainerRef();
1058
+ }
1059
+ ngAfterViewInit() {
1060
+ this.initTargetElementListener();
1061
+ }
1062
+ onSelect(item) {
1063
+ this.close();
1064
+ item.command?.();
1065
+ }
1066
+ onClose() {
1067
+ this.close();
1068
+ }
1069
+ onStopClickPropagation(event) {
1070
+ event.stopPropagation();
1071
+ }
1072
+ trackByFn(_, item) {
1073
+ return item.label;
1074
+ }
1075
+ initClickOutsideSubscription() {
1076
+ this.cuiClickOutsideDirective.cuiClickOutside
1077
+ .pipe(takeUntil(this.destroy$))
1078
+ .subscribe((target) => {
1079
+ if (this.target.contains(target)) {
1080
+ return;
1081
+ }
1082
+ this.close();
1083
+ });
1084
+ }
1085
+ initTargetElementListener() {
1086
+ this.targetEventListener = (event) => {
1087
+ event.stopPropagation();
1088
+ this.document.body.click();
1089
+ this.isVisible = !this.isVisible;
1090
+ this.clearViewContainerRef();
1091
+ if (this.isVisible) {
1092
+ this.renderList();
1093
+ this.changePosition(event.clientX, event.clientY);
1094
+ this.initHidingSubscription();
1095
+ }
1096
+ this.changeDetectorRef.markForCheck();
1097
+ };
1098
+ this.cuiTargetDirective.clicked
1099
+ .pipe(takeUntil(this.destroy$))
1100
+ .subscribe(this.targetEventListener);
1101
+ }
1102
+ initHidingSubscription() {
1103
+ this.initHidingFromWindowEvent('scroll');
1104
+ this.initHidingFromWindowEvent('resize');
1105
+ }
1106
+ initHidingFromWindowEvent(eventName) {
1107
+ fromEvent(this.window, eventName)
1108
+ .pipe(take(1))
1109
+ .subscribe(() => {
1110
+ this.close();
1111
+ this.changeDetectorRef.markForCheck();
1112
+ });
1113
+ }
1114
+ close() {
1115
+ this.isVisible = false;
1116
+ this.clearViewContainerRef();
1117
+ }
1118
+ renderList() {
1119
+ const embeddedViewRef = this.viewContainerRef.createEmbeddedView(this.list);
1120
+ this.node = embeddedViewRef.rootNodes[0];
1121
+ embeddedViewRef.detectChanges();
1122
+ this.document.querySelector(CUI_ROOT_SELECTOR).appendChild(this.node);
1123
+ }
1124
+ changePosition(x, y) {
1125
+ this.node.style.visibility = 'hidden';
1126
+ setTimeout(() => {
1127
+ const { clientWidth, clientHeight } = this.documentElement;
1128
+ const width = this.node.offsetWidth;
1129
+ const height = this.node.offsetHeight;
1130
+ let left = x;
1131
+ let top = y;
1132
+ if (left + width > clientWidth) {
1133
+ left -= width;
1134
+ }
1135
+ if (top + height > clientHeight) {
1136
+ top -= height;
1137
+ }
1138
+ left = Math.max(left, this.EXTRA_OFFSET_LEFT);
1139
+ top = Math.max(top, this.EXTRA_OFFSET_TOP);
1140
+ this.node.style.left = left + 'px';
1141
+ this.node.style.top = top + 'px';
1142
+ this.node.style.visibility = '';
1143
+ this.changeDetectorRef.markForCheck();
1144
+ });
1145
+ }
1146
+ clearViewContainerRef() {
1147
+ this.viewContainerRef.clear();
1148
+ }
1149
+ }
1150
+ CuiContextMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiContextMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1151
+ CuiContextMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiContextMenuComponent, selector: "cui-context-menu[items][target]", inputs: { items: "items", target: "target" }, host: { listeners: { "window:resize": "onClose()", "click": "onStopClickPropagation($event)" } }, providers: [CuiDestroyService], viewQueries: [{ propertyName: "list", first: true, predicate: ["list"], descendants: true }], hostDirectives: [{ directive: i1$1.CuiClickOutsideDirective }, { directive: i1$1.CuiTargetDirective, inputs: ["ccTarget", "target"] }], ngImport: i0, template: "<ng-template #list>\r\n <div class=\"c-container\">\r\n <ul\r\n *ngIf=\"isVisible\"\r\n class=\"c-ul\"\r\n >\r\n <li\r\n *ngFor=\"let item of items; trackBy: trackByFn\"\r\n [style.color]=\"item.color\"\r\n >\r\n <button\r\n type=\"button\"\r\n class=\"c-button\"\r\n (click)=\"onSelect(item)\"\r\n >\r\n <cui-svg\r\n *ngIf=\"item.icon\"\r\n [icon]=\"item.icon\"\r\n [color]=\"item.color\"\r\n ></cui-svg>\r\n <span>{{ item.label }}</span>\r\n </button>\r\n </li>\r\n </ul>\r\n </div>\r\n</ng-template>\r\n", styles: [":host{display:none}.c-container{position:fixed;width:268px;border-radius:8px;z-index:1}.c-ul{padding:7px 0;margin:0;list-style:none;font-weight:400;font-size:14px;line-height:20px;box-shadow:0 1px 4px #0000000a,0 1px 4px #0000000a;border:1px solid var(--cui-base-200);border-radius:inherit;background:var(--cui-base-0);color:var(--cui-base-900);font-family:var(--cui-main-font)}.c-button{padding:8px 11px 8px 0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;padding:8px 11px;width:100%;display:flex;align-items:center;gap:12px}.c-button:active{background:var(--cui-base-50)}@media (hover: hover){.c-button:hover{background:var(--cui-base-50)}}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1152
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiContextMenuComponent, decorators: [{
1153
+ type: Component,
1154
+ args: [{ selector: 'cui-context-menu[items][target]', changeDetection: ChangeDetectionStrategy.OnPush, providers: [CuiDestroyService], hostDirectives: [
1155
+ CuiClickOutsideDirective,
1156
+ {
1157
+ directive: CuiTargetDirective,
1158
+ inputs: ['ccTarget: target']
1159
+ }
1160
+ ], template: "<ng-template #list>\r\n <div class=\"c-container\">\r\n <ul\r\n *ngIf=\"isVisible\"\r\n class=\"c-ul\"\r\n >\r\n <li\r\n *ngFor=\"let item of items; trackBy: trackByFn\"\r\n [style.color]=\"item.color\"\r\n >\r\n <button\r\n type=\"button\"\r\n class=\"c-button\"\r\n (click)=\"onSelect(item)\"\r\n >\r\n <cui-svg\r\n *ngIf=\"item.icon\"\r\n [icon]=\"item.icon\"\r\n [color]=\"item.color\"\r\n ></cui-svg>\r\n <span>{{ item.label }}</span>\r\n </button>\r\n </li>\r\n </ul>\r\n </div>\r\n</ng-template>\r\n", styles: [":host{display:none}.c-container{position:fixed;width:268px;border-radius:8px;z-index:1}.c-ul{padding:7px 0;margin:0;list-style:none;font-weight:400;font-size:14px;line-height:20px;box-shadow:0 1px 4px #0000000a,0 1px 4px #0000000a;border:1px solid var(--cui-base-200);border-radius:inherit;background:var(--cui-base-0);color:var(--cui-base-900);font-family:var(--cui-main-font)}.c-button{padding:8px 11px 8px 0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;padding:8px 11px;width:100%;display:flex;align-items:center;gap:12px}.c-button:active{background:var(--cui-base-50)}@media (hover: hover){.c-button:hover{background:var(--cui-base-50)}}\n"] }]
1161
+ }], propDecorators: { items: [{
1162
+ type: Input
1163
+ }], target: [{
1164
+ type: Input
1165
+ }], list: [{
1166
+ type: ViewChild,
1167
+ args: ['list']
1168
+ }], onClose: [{
1169
+ type: HostListener,
1170
+ args: ['window:resize']
1171
+ }], onStopClickPropagation: [{
1172
+ type: HostListener,
1173
+ args: ['click', ['$event']]
1174
1174
  }] } });
1175
1175
 
1176
- class CuiContextMenuModule {
1177
- }
1178
- CuiContextMenuModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiContextMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1179
- CuiContextMenuModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiContextMenuModule, declarations: [CuiContextMenuComponent], imports: [CommonModule,
1180
- CuiSvgModule], exports: [CuiContextMenuComponent] });
1181
- CuiContextMenuModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiContextMenuModule, imports: [CommonModule,
1182
- CuiSvgModule] });
1183
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiContextMenuModule, decorators: [{
1184
- type: NgModule,
1185
- args: [{
1186
- imports: [
1187
- CommonModule,
1188
- CuiSvgModule
1189
- ],
1190
- declarations: [CuiContextMenuComponent],
1191
- exports: [CuiContextMenuComponent]
1192
- }]
1176
+ class CuiContextMenuModule {
1177
+ }
1178
+ CuiContextMenuModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiContextMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1179
+ CuiContextMenuModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiContextMenuModule, declarations: [CuiContextMenuComponent], imports: [CommonModule,
1180
+ CuiSvgModule], exports: [CuiContextMenuComponent] });
1181
+ CuiContextMenuModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiContextMenuModule, imports: [CommonModule,
1182
+ CuiSvgModule] });
1183
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiContextMenuModule, decorators: [{
1184
+ type: NgModule,
1185
+ args: [{
1186
+ imports: [
1187
+ CommonModule,
1188
+ CuiSvgModule
1189
+ ],
1190
+ declarations: [CuiContextMenuComponent],
1191
+ exports: [CuiContextMenuComponent]
1192
+ }]
1193
1193
  }] });
1194
1194
 
1195
- class CuiFormFieldComponent {
1196
- }
1197
- CuiFormFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiFormFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1198
- CuiFormFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiFormFieldComponent, selector: "cui-form-field", ngImport: i0, template: "<ng-content select=\"label[cuiLabel]\" />\n<ng-content />\n<div class=\"c-hint-container\">\n <ng-content select=\"cui-hint\" />\n</div>\n", styles: [":host{display:flex;flex-direction:column;gap:4px}.c-hint-container{margin-top:2px}.c-hint-container:empty{display:contents}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1199
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiFormFieldComponent, decorators: [{
1200
- type: Component,
1201
- args: [{ selector: 'cui-form-field', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content select=\"label[cuiLabel]\" />\n<ng-content />\n<div class=\"c-hint-container\">\n <ng-content select=\"cui-hint\" />\n</div>\n", styles: [":host{display:flex;flex-direction:column;gap:4px}.c-hint-container{margin-top:2px}.c-hint-container:empty{display:contents}\n"] }]
1195
+ class CuiFormFieldComponent {
1196
+ }
1197
+ CuiFormFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiFormFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1198
+ CuiFormFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiFormFieldComponent, selector: "cui-form-field", ngImport: i0, template: "<ng-content select=\"label[cuiLabel]\" />\r\n<ng-content />\r\n<div class=\"c-hint-container\">\r\n <ng-content select=\"cui-hint\" />\r\n</div>\r\n", styles: [":host{display:flex;flex-direction:column;gap:4px}.c-hint-container{margin-top:2px}.c-hint-container:empty{display:contents}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1199
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiFormFieldComponent, decorators: [{
1200
+ type: Component,
1201
+ args: [{ selector: 'cui-form-field', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content select=\"label[cuiLabel]\" />\r\n<ng-content />\r\n<div class=\"c-hint-container\">\r\n <ng-content select=\"cui-hint\" />\r\n</div>\r\n", styles: [":host{display:flex;flex-direction:column;gap:4px}.c-hint-container{margin-top:2px}.c-hint-container:empty{display:contents}\n"] }]
1202
1202
  }] });
1203
1203
 
1204
- class CuiFormFieldModule {
1205
- }
1206
- CuiFormFieldModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiFormFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1207
- CuiFormFieldModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiFormFieldModule, declarations: [CuiFormFieldComponent], exports: [CuiFormFieldComponent] });
1208
- CuiFormFieldModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiFormFieldModule });
1209
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiFormFieldModule, decorators: [{
1210
- type: NgModule,
1211
- args: [{
1212
- declarations: [CuiFormFieldComponent],
1213
- exports: [CuiFormFieldComponent]
1214
- }]
1204
+ class CuiFormFieldModule {
1205
+ }
1206
+ CuiFormFieldModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiFormFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1207
+ CuiFormFieldModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiFormFieldModule, declarations: [CuiFormFieldComponent], exports: [CuiFormFieldComponent] });
1208
+ CuiFormFieldModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiFormFieldModule });
1209
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiFormFieldModule, decorators: [{
1210
+ type: NgModule,
1211
+ args: [{
1212
+ declarations: [CuiFormFieldComponent],
1213
+ exports: [CuiFormFieldComponent]
1214
+ }]
1215
1215
  }] });
1216
1216
 
1217
- class CuiHintComponent {
1218
- constructor() {
1219
- this.hintType = 'info';
1220
- }
1221
- }
1222
- CuiHintComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiHintComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1223
- CuiHintComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiHintComponent, selector: "cui-hint", inputs: { hintType: "hintType" }, host: { properties: { "attr.data-hint-type": "this.hintType" } }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [":host{font-weight:400;font-size:14px;line-height:20px;display:inline-block;font-family:var(--cui-main-font)}:host[data-hint-type=info]{color:var(--cui-base-500)}:host[data-hint-type=error]{color:var(--cui-danger)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1224
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiHintComponent, decorators: [{
1225
- type: Component,
1226
- args: [{ selector: 'cui-hint', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>\n", styles: [":host{font-weight:400;font-size:14px;line-height:20px;display:inline-block;font-family:var(--cui-main-font)}:host[data-hint-type=info]{color:var(--cui-base-500)}:host[data-hint-type=error]{color:var(--cui-danger)}\n"] }]
1227
- }], propDecorators: { hintType: [{
1228
- type: Input
1229
- }, {
1230
- type: HostBinding,
1231
- args: ['attr.data-hint-type']
1217
+ class CuiHintComponent {
1218
+ constructor() {
1219
+ this.hintType = 'info';
1220
+ }
1221
+ }
1222
+ CuiHintComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiHintComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1223
+ CuiHintComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiHintComponent, selector: "cui-hint", inputs: { hintType: "hintType" }, host: { properties: { "attr.data-hint-type": "this.hintType" } }, ngImport: i0, template: "<ng-content></ng-content>\r\n", styles: [":host{font-weight:400;font-size:14px;line-height:20px;display:inline-block;font-family:var(--cui-main-font)}:host[data-hint-type=info]{color:var(--cui-base-500)}:host[data-hint-type=error]{color:var(--cui-danger)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1224
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiHintComponent, decorators: [{
1225
+ type: Component,
1226
+ args: [{ selector: 'cui-hint', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>\r\n", styles: [":host{font-weight:400;font-size:14px;line-height:20px;display:inline-block;font-family:var(--cui-main-font)}:host[data-hint-type=info]{color:var(--cui-base-500)}:host[data-hint-type=error]{color:var(--cui-danger)}\n"] }]
1227
+ }], propDecorators: { hintType: [{
1228
+ type: Input
1229
+ }, {
1230
+ type: HostBinding,
1231
+ args: ['attr.data-hint-type']
1232
1232
  }] } });
1233
1233
 
1234
- class CuiHintModule {
1235
- }
1236
- CuiHintModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiHintModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1237
- CuiHintModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiHintModule, declarations: [CuiHintComponent], exports: [CuiHintComponent] });
1238
- CuiHintModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiHintModule });
1239
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiHintModule, decorators: [{
1240
- type: NgModule,
1241
- args: [{
1242
- declarations: [CuiHintComponent],
1243
- exports: [CuiHintComponent]
1244
- }]
1234
+ class CuiHintModule {
1235
+ }
1236
+ CuiHintModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiHintModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1237
+ CuiHintModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiHintModule, declarations: [CuiHintComponent], exports: [CuiHintComponent] });
1238
+ CuiHintModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiHintModule });
1239
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiHintModule, decorators: [{
1240
+ type: NgModule,
1241
+ args: [{
1242
+ declarations: [CuiHintComponent],
1243
+ exports: [CuiHintComponent]
1244
+ }]
1245
1245
  }] });
1246
1246
 
1247
- class CuiIconButtonComponent {
1248
- constructor() {
1249
- this.ICON_WIDTH = 16;
1250
- this.ICON_HEIGHT = 16;
1251
- this.ICON_STROKE_WIDTH = 1.5;
1252
- }
1253
- get isWithHoverColor() {
1254
- return !!this.hoverColor;
1255
- }
1256
- }
1257
- CuiIconButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiIconButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1258
- CuiIconButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiIconButtonComponent, selector: "button[cuiIconButton][icon], a[cuiIconButton][icon]", inputs: { icon: "icon", color: "color", hoverColor: "hoverColor" }, host: { properties: { "style.--icon-hover-color": "this.hoverColor", "class._with-hover-color": "this.isWithHoverColor" } }, ngImport: i0, template: "<cui-svg\n [icon]=\"icon\"\n [width]=\"ICON_WIDTH\"\n [height]=\"ICON_HEIGHT\"\n [color]=\"color\"\n [strokeWidth]=\"ICON_STROKE_WIDTH\"\n class=\"c-icon\"\n></cui-svg>\n", styles: [":host{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex;justify-content:center;align-items:center;width:24px;height:24px}:host._with-hover-color:active .c-icon ::ng-deep [stroke]{stroke:var(--icon-hover-color)}:host._with-hover-color:active .c-icon ::ng-deep [fill]:not([fill=none]){fill:var(--icon-hover-color)}@media (hover: hover){:host._with-hover-color:hover .c-icon ::ng-deep [stroke]{stroke:var(--icon-hover-color)}:host._with-hover-color:hover .c-icon ::ng-deep [fill]:not([fill=none]){fill:var(--icon-hover-color)}}\n"], dependencies: [{ kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1259
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiIconButtonComponent, decorators: [{
1260
- type: Component,
1261
- args: [{ selector: 'button[cuiIconButton][icon], a[cuiIconButton][icon]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<cui-svg\n [icon]=\"icon\"\n [width]=\"ICON_WIDTH\"\n [height]=\"ICON_HEIGHT\"\n [color]=\"color\"\n [strokeWidth]=\"ICON_STROKE_WIDTH\"\n class=\"c-icon\"\n></cui-svg>\n", styles: [":host{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex;justify-content:center;align-items:center;width:24px;height:24px}:host._with-hover-color:active .c-icon ::ng-deep [stroke]{stroke:var(--icon-hover-color)}:host._with-hover-color:active .c-icon ::ng-deep [fill]:not([fill=none]){fill:var(--icon-hover-color)}@media (hover: hover){:host._with-hover-color:hover .c-icon ::ng-deep [stroke]{stroke:var(--icon-hover-color)}:host._with-hover-color:hover .c-icon ::ng-deep [fill]:not([fill=none]){fill:var(--icon-hover-color)}}\n"] }]
1262
- }], propDecorators: { icon: [{
1263
- type: Input
1264
- }], color: [{
1265
- type: Input
1266
- }], hoverColor: [{
1267
- type: Input
1268
- }, {
1269
- type: HostBinding,
1270
- args: ['style.--icon-hover-color']
1271
- }], isWithHoverColor: [{
1272
- type: HostBinding,
1273
- args: ['class._with-hover-color']
1247
+ class CuiIconButtonComponent {
1248
+ constructor() {
1249
+ this.ICON_WIDTH = 16;
1250
+ this.ICON_HEIGHT = 16;
1251
+ this.ICON_STROKE_WIDTH = 1.5;
1252
+ }
1253
+ get isWithHoverColor() {
1254
+ return !!this.hoverColor;
1255
+ }
1256
+ }
1257
+ CuiIconButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiIconButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1258
+ CuiIconButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiIconButtonComponent, selector: "button[cuiIconButton][icon], a[cuiIconButton][icon]", inputs: { icon: "icon", color: "color", hoverColor: "hoverColor" }, host: { properties: { "style.--icon-hover-color": "this.hoverColor", "class._with-hover-color": "this.isWithHoverColor" } }, ngImport: i0, template: "<cui-svg\r\n [icon]=\"icon\"\r\n [width]=\"ICON_WIDTH\"\r\n [height]=\"ICON_HEIGHT\"\r\n [color]=\"color\"\r\n [strokeWidth]=\"ICON_STROKE_WIDTH\"\r\n class=\"c-icon\"\r\n></cui-svg>\r\n", styles: [":host{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex;justify-content:center;align-items:center;width:24px;height:24px}:host._with-hover-color:active .c-icon ::ng-deep [stroke]{stroke:var(--icon-hover-color)}:host._with-hover-color:active .c-icon ::ng-deep [fill]:not([fill=none]){fill:var(--icon-hover-color)}@media (hover: hover){:host._with-hover-color:hover .c-icon ::ng-deep [stroke]{stroke:var(--icon-hover-color)}:host._with-hover-color:hover .c-icon ::ng-deep [fill]:not([fill=none]){fill:var(--icon-hover-color)}}\n"], dependencies: [{ kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1259
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiIconButtonComponent, decorators: [{
1260
+ type: Component,
1261
+ args: [{ selector: 'button[cuiIconButton][icon], a[cuiIconButton][icon]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<cui-svg\r\n [icon]=\"icon\"\r\n [width]=\"ICON_WIDTH\"\r\n [height]=\"ICON_HEIGHT\"\r\n [color]=\"color\"\r\n [strokeWidth]=\"ICON_STROKE_WIDTH\"\r\n class=\"c-icon\"\r\n></cui-svg>\r\n", styles: [":host{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex;justify-content:center;align-items:center;width:24px;height:24px}:host._with-hover-color:active .c-icon ::ng-deep [stroke]{stroke:var(--icon-hover-color)}:host._with-hover-color:active .c-icon ::ng-deep [fill]:not([fill=none]){fill:var(--icon-hover-color)}@media (hover: hover){:host._with-hover-color:hover .c-icon ::ng-deep [stroke]{stroke:var(--icon-hover-color)}:host._with-hover-color:hover .c-icon ::ng-deep [fill]:not([fill=none]){fill:var(--icon-hover-color)}}\n"] }]
1262
+ }], propDecorators: { icon: [{
1263
+ type: Input
1264
+ }], color: [{
1265
+ type: Input
1266
+ }], hoverColor: [{
1267
+ type: Input
1268
+ }, {
1269
+ type: HostBinding,
1270
+ args: ['style.--icon-hover-color']
1271
+ }], isWithHoverColor: [{
1272
+ type: HostBinding,
1273
+ args: ['class._with-hover-color']
1274
1274
  }] } });
1275
1275
 
1276
- class CuiIconButtonModule {
1277
- }
1278
- CuiIconButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiIconButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1279
- CuiIconButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiIconButtonModule, declarations: [CuiIconButtonComponent], imports: [CommonModule,
1280
- CuiSvgModule], exports: [CuiIconButtonComponent] });
1281
- CuiIconButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiIconButtonModule, imports: [CommonModule,
1282
- CuiSvgModule] });
1283
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiIconButtonModule, decorators: [{
1284
- type: NgModule,
1285
- args: [{
1286
- imports: [
1287
- CommonModule,
1288
- CuiSvgModule
1289
- ],
1290
- declarations: [CuiIconButtonComponent],
1291
- exports: [CuiIconButtonComponent]
1292
- }]
1276
+ class CuiIconButtonModule {
1277
+ }
1278
+ CuiIconButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiIconButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1279
+ CuiIconButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiIconButtonModule, declarations: [CuiIconButtonComponent], imports: [CommonModule,
1280
+ CuiSvgModule], exports: [CuiIconButtonComponent] });
1281
+ CuiIconButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiIconButtonModule, imports: [CommonModule,
1282
+ CuiSvgModule] });
1283
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiIconButtonModule, decorators: [{
1284
+ type: NgModule,
1285
+ args: [{
1286
+ imports: [
1287
+ CommonModule,
1288
+ CuiSvgModule
1289
+ ],
1290
+ declarations: [CuiIconButtonComponent],
1291
+ exports: [CuiIconButtonComponent]
1292
+ }]
1293
1293
  }] });
1294
1294
 
1295
- class CuiTextFieldController {
1296
- constructor(iconLeftDirective, idDirective, isErrorDirective, placeholderDirective, sizeDirective) {
1297
- this.iconLeftDirective = iconLeftDirective;
1298
- this.idDirective = idDirective;
1299
- this.isErrorDirective = isErrorDirective;
1300
- this.placeholderDirective = placeholderDirective;
1301
- this.sizeDirective = sizeDirective;
1302
- }
1303
- get iconLeft() {
1304
- return this.iconLeftDirective.iconLeft;
1305
- }
1306
- get id() {
1307
- return this.idDirective.id;
1308
- }
1309
- get isError() {
1310
- return this.isErrorDirective.isError;
1311
- }
1312
- get placeholder() {
1313
- return this.placeholderDirective.placeholder;
1314
- }
1315
- get size() {
1316
- return this.sizeDirective.size;
1317
- }
1318
- }
1319
-
1320
- const CUI_TEXT_FIELD_ICON_LEFT = new InjectionToken('', {
1321
- factory: () => new CuiTextFieldIconLeftDirective()
1322
- });
1323
- class CuiTextFieldIconLeftDirective {
1324
- }
1325
- CuiTextFieldIconLeftDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldIconLeftDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1326
- CuiTextFieldIconLeftDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: CuiTextFieldIconLeftDirective, selector: "[cuiTextFieldIconLeft]", inputs: { iconLeft: ["cuiTextFieldIconLeft", "iconLeft"] }, providers: [cuiProvide(CUI_TEXT_FIELD_ICON_LEFT, CuiTextFieldIconLeftDirective)], ngImport: i0 });
1327
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldIconLeftDirective, decorators: [{
1328
- type: Directive,
1329
- args: [{
1330
- selector: '[cuiTextFieldIconLeft]',
1331
- providers: [cuiProvide(CUI_TEXT_FIELD_ICON_LEFT, CuiTextFieldIconLeftDirective)]
1332
- }]
1333
- }], propDecorators: { iconLeft: [{
1334
- type: Input,
1335
- args: ['cuiTextFieldIconLeft']
1295
+ class CuiTextFieldController {
1296
+ constructor(iconLeftDirective, idDirective, isErrorDirective, placeholderDirective, sizeDirective) {
1297
+ this.iconLeftDirective = iconLeftDirective;
1298
+ this.idDirective = idDirective;
1299
+ this.isErrorDirective = isErrorDirective;
1300
+ this.placeholderDirective = placeholderDirective;
1301
+ this.sizeDirective = sizeDirective;
1302
+ }
1303
+ get iconLeft() {
1304
+ return this.iconLeftDirective.iconLeft;
1305
+ }
1306
+ get id() {
1307
+ return this.idDirective.id;
1308
+ }
1309
+ get isError() {
1310
+ return this.isErrorDirective.isError;
1311
+ }
1312
+ get placeholder() {
1313
+ return this.placeholderDirective.placeholder;
1314
+ }
1315
+ get size() {
1316
+ return this.sizeDirective.size;
1317
+ }
1318
+ }
1319
+
1320
+ const CUI_TEXT_FIELD_ICON_LEFT = new InjectionToken('', {
1321
+ factory: () => new CuiTextFieldIconLeftDirective()
1322
+ });
1323
+ class CuiTextFieldIconLeftDirective {
1324
+ }
1325
+ CuiTextFieldIconLeftDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldIconLeftDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1326
+ CuiTextFieldIconLeftDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: CuiTextFieldIconLeftDirective, selector: "[cuiTextFieldIconLeft]", inputs: { iconLeft: ["cuiTextFieldIconLeft", "iconLeft"] }, providers: [cuiProvide(CUI_TEXT_FIELD_ICON_LEFT, CuiTextFieldIconLeftDirective)], ngImport: i0 });
1327
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldIconLeftDirective, decorators: [{
1328
+ type: Directive,
1329
+ args: [{
1330
+ selector: '[cuiTextFieldIconLeft]',
1331
+ providers: [cuiProvide(CUI_TEXT_FIELD_ICON_LEFT, CuiTextFieldIconLeftDirective)]
1332
+ }]
1333
+ }], propDecorators: { iconLeft: [{
1334
+ type: Input,
1335
+ args: ['cuiTextFieldIconLeft']
1336
1336
  }] } });
1337
1337
 
1338
- const CUI_TEXT_FIELD_ID = new InjectionToken('', {
1339
- factory: () => new CuiTextFieldIdDirective()
1340
- });
1341
- class CuiTextFieldIdDirective {
1342
- }
1343
- CuiTextFieldIdDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldIdDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1344
- CuiTextFieldIdDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: CuiTextFieldIdDirective, selector: "[cuiTextFieldId]", inputs: { id: ["cuiTextFieldId", "id"] }, providers: [cuiProvide(CUI_TEXT_FIELD_ID, CuiTextFieldIdDirective)], ngImport: i0 });
1345
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldIdDirective, decorators: [{
1346
- type: Directive,
1347
- args: [{
1348
- selector: '[cuiTextFieldId]',
1349
- providers: [cuiProvide(CUI_TEXT_FIELD_ID, CuiTextFieldIdDirective)]
1350
- }]
1351
- }], propDecorators: { id: [{
1352
- type: Input,
1353
- args: ['cuiTextFieldId']
1338
+ const CUI_TEXT_FIELD_ID = new InjectionToken('', {
1339
+ factory: () => new CuiTextFieldIdDirective()
1340
+ });
1341
+ class CuiTextFieldIdDirective {
1342
+ }
1343
+ CuiTextFieldIdDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldIdDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1344
+ CuiTextFieldIdDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: CuiTextFieldIdDirective, selector: "[cuiTextFieldId]", inputs: { id: ["cuiTextFieldId", "id"] }, providers: [cuiProvide(CUI_TEXT_FIELD_ID, CuiTextFieldIdDirective)], ngImport: i0 });
1345
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldIdDirective, decorators: [{
1346
+ type: Directive,
1347
+ args: [{
1348
+ selector: '[cuiTextFieldId]',
1349
+ providers: [cuiProvide(CUI_TEXT_FIELD_ID, CuiTextFieldIdDirective)]
1350
+ }]
1351
+ }], propDecorators: { id: [{
1352
+ type: Input,
1353
+ args: ['cuiTextFieldId']
1354
1354
  }] } });
1355
1355
 
1356
- const CUI_TEXT_FIELD_IS_ERROR = new InjectionToken('', {
1357
- factory: () => new CuiTextFieldIsErrorDirective()
1358
- });
1359
- class CuiTextFieldIsErrorDirective {
1360
- constructor() {
1361
- this.isError = false;
1362
- }
1363
- }
1364
- CuiTextFieldIsErrorDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldIsErrorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1365
- CuiTextFieldIsErrorDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: CuiTextFieldIsErrorDirective, selector: "[cuiTextFieldIsError]", inputs: { isError: ["cuiTextFieldIsError", "isError"] }, providers: [cuiProvide(CUI_TEXT_FIELD_IS_ERROR, CuiTextFieldIsErrorDirective)], ngImport: i0 });
1366
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldIsErrorDirective, decorators: [{
1367
- type: Directive,
1368
- args: [{
1369
- selector: '[cuiTextFieldIsError]',
1370
- providers: [cuiProvide(CUI_TEXT_FIELD_IS_ERROR, CuiTextFieldIsErrorDirective)]
1371
- }]
1372
- }], propDecorators: { isError: [{
1373
- type: Input,
1374
- args: ['cuiTextFieldIsError']
1356
+ const CUI_TEXT_FIELD_IS_ERROR = new InjectionToken('', {
1357
+ factory: () => new CuiTextFieldIsErrorDirective()
1358
+ });
1359
+ class CuiTextFieldIsErrorDirective {
1360
+ constructor() {
1361
+ this.isError = false;
1362
+ }
1363
+ }
1364
+ CuiTextFieldIsErrorDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldIsErrorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1365
+ CuiTextFieldIsErrorDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: CuiTextFieldIsErrorDirective, selector: "[cuiTextFieldIsError]", inputs: { isError: ["cuiTextFieldIsError", "isError"] }, providers: [cuiProvide(CUI_TEXT_FIELD_IS_ERROR, CuiTextFieldIsErrorDirective)], ngImport: i0 });
1366
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldIsErrorDirective, decorators: [{
1367
+ type: Directive,
1368
+ args: [{
1369
+ selector: '[cuiTextFieldIsError]',
1370
+ providers: [cuiProvide(CUI_TEXT_FIELD_IS_ERROR, CuiTextFieldIsErrorDirective)]
1371
+ }]
1372
+ }], propDecorators: { isError: [{
1373
+ type: Input,
1374
+ args: ['cuiTextFieldIsError']
1375
1375
  }] } });
1376
1376
 
1377
- const CUI_TEXT_FIELD_PLACEHOLDER = new InjectionToken('', {
1378
- factory: () => new CuiTextFieldPlaceholderDirective()
1379
- });
1380
- class CuiTextFieldPlaceholderDirective {
1381
- }
1382
- CuiTextFieldPlaceholderDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldPlaceholderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1383
- CuiTextFieldPlaceholderDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: CuiTextFieldPlaceholderDirective, selector: "[cuiTextFieldPlaceholder]", inputs: { placeholder: ["cuiTextFieldPlaceholder", "placeholder"] }, providers: [cuiProvide(CUI_TEXT_FIELD_PLACEHOLDER, CuiTextFieldPlaceholderDirective)], ngImport: i0 });
1384
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldPlaceholderDirective, decorators: [{
1385
- type: Directive,
1386
- args: [{
1387
- selector: '[cuiTextFieldPlaceholder]',
1388
- providers: [cuiProvide(CUI_TEXT_FIELD_PLACEHOLDER, CuiTextFieldPlaceholderDirective)]
1389
- }]
1390
- }], propDecorators: { placeholder: [{
1391
- type: Input,
1392
- args: ['cuiTextFieldPlaceholder']
1377
+ const CUI_TEXT_FIELD_PLACEHOLDER = new InjectionToken('', {
1378
+ factory: () => new CuiTextFieldPlaceholderDirective()
1379
+ });
1380
+ class CuiTextFieldPlaceholderDirective {
1381
+ }
1382
+ CuiTextFieldPlaceholderDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldPlaceholderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1383
+ CuiTextFieldPlaceholderDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: CuiTextFieldPlaceholderDirective, selector: "[cuiTextFieldPlaceholder]", inputs: { placeholder: ["cuiTextFieldPlaceholder", "placeholder"] }, providers: [cuiProvide(CUI_TEXT_FIELD_PLACEHOLDER, CuiTextFieldPlaceholderDirective)], ngImport: i0 });
1384
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldPlaceholderDirective, decorators: [{
1385
+ type: Directive,
1386
+ args: [{
1387
+ selector: '[cuiTextFieldPlaceholder]',
1388
+ providers: [cuiProvide(CUI_TEXT_FIELD_PLACEHOLDER, CuiTextFieldPlaceholderDirective)]
1389
+ }]
1390
+ }], propDecorators: { placeholder: [{
1391
+ type: Input,
1392
+ args: ['cuiTextFieldPlaceholder']
1393
1393
  }] } });
1394
1394
 
1395
- const CUI_TEXT_FIELD_SIZE = new InjectionToken('', {
1396
- factory: () => new CuiTextFieldSizeDirective()
1397
- });
1398
- class CuiTextFieldSizeDirective {
1399
- constructor() {
1400
- this.size = 'sm';
1401
- }
1402
- }
1403
- CuiTextFieldSizeDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldSizeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1404
- CuiTextFieldSizeDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: CuiTextFieldSizeDirective, selector: "[cuiTextFieldSize]", inputs: { size: ["cuiTextFieldSize", "size"] }, providers: [cuiProvide(CUI_TEXT_FIELD_SIZE, CuiTextFieldSizeDirective)], ngImport: i0 });
1405
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldSizeDirective, decorators: [{
1406
- type: Directive,
1407
- args: [{
1408
- selector: '[cuiTextFieldSize]',
1409
- providers: [cuiProvide(CUI_TEXT_FIELD_SIZE, CuiTextFieldSizeDirective)]
1410
- }]
1411
- }], propDecorators: { size: [{
1412
- type: Input,
1413
- args: ['cuiTextFieldSize']
1395
+ const CUI_TEXT_FIELD_SIZE = new InjectionToken('', {
1396
+ factory: () => new CuiTextFieldSizeDirective()
1397
+ });
1398
+ class CuiTextFieldSizeDirective {
1399
+ constructor() {
1400
+ this.size = 'sm';
1401
+ }
1402
+ }
1403
+ CuiTextFieldSizeDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldSizeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1404
+ CuiTextFieldSizeDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: CuiTextFieldSizeDirective, selector: "[cuiTextFieldSize]", inputs: { size: ["cuiTextFieldSize", "size"] }, providers: [cuiProvide(CUI_TEXT_FIELD_SIZE, CuiTextFieldSizeDirective)], ngImport: i0 });
1405
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldSizeDirective, decorators: [{
1406
+ type: Directive,
1407
+ args: [{
1408
+ selector: '[cuiTextFieldSize]',
1409
+ providers: [cuiProvide(CUI_TEXT_FIELD_SIZE, CuiTextFieldSizeDirective)]
1410
+ }]
1411
+ }], propDecorators: { size: [{
1412
+ type: Input,
1413
+ args: ['cuiTextFieldSize']
1414
1414
  }] } });
1415
1415
 
1416
- class CuiTextFieldControllerModule {
1417
- }
1418
- CuiTextFieldControllerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldControllerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1419
- CuiTextFieldControllerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldControllerModule, declarations: [CuiTextFieldIconLeftDirective,
1420
- CuiTextFieldIdDirective,
1421
- CuiTextFieldPlaceholderDirective,
1422
- CuiTextFieldIsErrorDirective,
1423
- CuiTextFieldSizeDirective], exports: [CuiTextFieldIconLeftDirective,
1424
- CuiTextFieldIdDirective,
1425
- CuiTextFieldPlaceholderDirective,
1426
- CuiTextFieldIsErrorDirective,
1427
- CuiTextFieldSizeDirective] });
1428
- CuiTextFieldControllerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldControllerModule });
1429
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldControllerModule, decorators: [{
1430
- type: NgModule,
1431
- args: [{
1432
- declarations: [
1433
- CuiTextFieldIconLeftDirective,
1434
- CuiTextFieldIdDirective,
1435
- CuiTextFieldPlaceholderDirective,
1436
- CuiTextFieldIsErrorDirective,
1437
- CuiTextFieldSizeDirective
1438
- ],
1439
- exports: [
1440
- CuiTextFieldIconLeftDirective,
1441
- CuiTextFieldIdDirective,
1442
- CuiTextFieldPlaceholderDirective,
1443
- CuiTextFieldIsErrorDirective,
1444
- CuiTextFieldSizeDirective
1445
- ]
1446
- }]
1416
+ class CuiTextFieldControllerModule {
1417
+ }
1418
+ CuiTextFieldControllerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldControllerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1419
+ CuiTextFieldControllerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldControllerModule, declarations: [CuiTextFieldIconLeftDirective,
1420
+ CuiTextFieldIdDirective,
1421
+ CuiTextFieldPlaceholderDirective,
1422
+ CuiTextFieldIsErrorDirective,
1423
+ CuiTextFieldSizeDirective], exports: [CuiTextFieldIconLeftDirective,
1424
+ CuiTextFieldIdDirective,
1425
+ CuiTextFieldPlaceholderDirective,
1426
+ CuiTextFieldIsErrorDirective,
1427
+ CuiTextFieldSizeDirective] });
1428
+ CuiTextFieldControllerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldControllerModule });
1429
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldControllerModule, decorators: [{
1430
+ type: NgModule,
1431
+ args: [{
1432
+ declarations: [
1433
+ CuiTextFieldIconLeftDirective,
1434
+ CuiTextFieldIdDirective,
1435
+ CuiTextFieldPlaceholderDirective,
1436
+ CuiTextFieldIsErrorDirective,
1437
+ CuiTextFieldSizeDirective
1438
+ ],
1439
+ exports: [
1440
+ CuiTextFieldIconLeftDirective,
1441
+ CuiTextFieldIdDirective,
1442
+ CuiTextFieldPlaceholderDirective,
1443
+ CuiTextFieldIsErrorDirective,
1444
+ CuiTextFieldSizeDirective
1445
+ ]
1446
+ }]
1447
1447
  }] });
1448
1448
 
1449
- const CUI_TEXT_FIELD_CONTROLLER = new InjectionToken('');
1450
- const CUI_TEXT_FILED_CONTROLLER_PROVIDER = [
1451
- {
1452
- provide: CUI_TEXT_FIELD_CONTROLLER,
1453
- useFactory: (...controllers) => {
1454
- return new CuiTextFieldController(...controllers);
1455
- },
1456
- deps: [
1457
- CUI_TEXT_FIELD_ICON_LEFT,
1458
- CUI_TEXT_FIELD_ID,
1459
- CUI_TEXT_FIELD_IS_ERROR,
1460
- CUI_TEXT_FIELD_PLACEHOLDER,
1461
- CUI_TEXT_FIELD_SIZE
1462
- ]
1463
- }
1449
+ const CUI_TEXT_FIELD_CONTROLLER = new InjectionToken('');
1450
+ const CUI_TEXT_FILED_CONTROLLER_PROVIDER = [
1451
+ {
1452
+ provide: CUI_TEXT_FIELD_CONTROLLER,
1453
+ useFactory: (...controllers) => {
1454
+ return new CuiTextFieldController(...controllers);
1455
+ },
1456
+ deps: [
1457
+ CUI_TEXT_FIELD_ICON_LEFT,
1458
+ CUI_TEXT_FIELD_ID,
1459
+ CUI_TEXT_FIELD_IS_ERROR,
1460
+ CUI_TEXT_FIELD_PLACEHOLDER,
1461
+ CUI_TEXT_FIELD_SIZE
1462
+ ]
1463
+ }
1464
1464
  ];
1465
1465
 
1466
- class CuiInputNumberComponent {
1467
- constructor() {
1468
- this.changeDetectorRef = inject(ChangeDetectorRef);
1469
- this.cuiTextFieldController = inject(CUI_TEXT_FIELD_CONTROLLER);
1470
- this.maskOptions = this.generateMask();
1471
- this._precision = 0;
1472
- this._min = Number.MIN_SAFE_INTEGER;
1473
- this._max = Number.MAX_SAFE_INTEGER;
1474
- }
1475
- set precision(value) {
1476
- this._precision = value;
1477
- this.maskOptions = this.generateMask();
1478
- }
1479
- set min(value) {
1480
- this._min = value;
1481
- this.maskOptions = this.generateMask();
1482
- }
1483
- set max(value) {
1484
- this._max = value;
1485
- this.maskOptions = this.generateMask();
1486
- }
1487
- get id() {
1488
- return this.cuiTextFieldController.id;
1489
- }
1490
- get placeholder() {
1491
- return this.cuiTextFieldController.placeholder;
1492
- }
1493
- get iconLeft() {
1494
- return this.cuiTextFieldController.iconLeft;
1495
- }
1496
- get size() {
1497
- return this.cuiTextFieldController.size;
1498
- }
1499
- get isError() {
1500
- return this.cuiTextFieldController.isError;
1501
- }
1502
- writeValue(value) {
1503
- this.value = value?.toString();
1504
- this.changeDetectorRef.markForCheck();
1505
- }
1506
- registerOnChange(fn) {
1507
- this.onChange = fn;
1508
- }
1509
- registerOnTouched(fn) {
1510
- this.onTouched = fn;
1511
- }
1512
- setDisabledState(isDisabled) {
1513
- this.isDisabled = isDisabled;
1514
- this.changeDetectorRef.markForCheck();
1515
- }
1516
- onInput({ target }) {
1517
- this.changeModel(target.value);
1518
- }
1519
- onFocus() {
1520
- this.input.nativeElement.focus();
1521
- }
1522
- changeModel(value) {
1523
- const parsedValue = maskitoParseNumber(value);
1524
- this.value = value;
1525
- this.onChange(Number.isNaN(parsedValue) ? null : parsedValue);
1526
- }
1527
- generateMask() {
1528
- return maskitoNumberOptionsGenerator({
1529
- precision: this._precision,
1530
- min: this._min,
1531
- max: this._max
1532
- });
1533
- }
1534
- }
1535
- CuiInputNumberComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1536
- CuiInputNumberComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiInputNumberComponent, selector: "cui-input-number", inputs: { precision: "precision", min: "min", max: "max" }, host: { listeners: { "click": "onFocus()" }, properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [
1537
- CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1538
- cuiProvide(NG_VALUE_ACCESSOR, CuiInputNumberComponent, true)
1539
- ], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<cui-svg\n *ngIf=\"iconLeft\"\n [icon]=\"iconLeft\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n #input\n [ngModel]=\"value\"\n [attr.id]=\"id\"\n [attr.placeholder]=\"placeholder\"\n type=\"text\"\n [maskito]=\"maskOptions\"\n [disabled]=\"isDisabled\"\n class=\"c-input\"\n (input)=\"onInput($event)\"\n (focus)=\"onTouched()\"\n>\n\n", styles: [":host{padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1540
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberComponent, decorators: [{
1541
- type: Component,
1542
- args: [{ selector: 'cui-input-number', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
1543
- CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1544
- cuiProvide(NG_VALUE_ACCESSOR, CuiInputNumberComponent, true)
1545
- ], template: "<cui-svg\n *ngIf=\"iconLeft\"\n [icon]=\"iconLeft\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n #input\n [ngModel]=\"value\"\n [attr.id]=\"id\"\n [attr.placeholder]=\"placeholder\"\n type=\"text\"\n [maskito]=\"maskOptions\"\n [disabled]=\"isDisabled\"\n class=\"c-input\"\n (input)=\"onInput($event)\"\n (focus)=\"onTouched()\"\n>\n\n", styles: [":host{padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}\n"] }]
1546
- }], propDecorators: { precision: [{
1547
- type: Input
1548
- }], min: [{
1549
- type: Input
1550
- }], max: [{
1551
- type: Input
1552
- }], isDisabled: [{
1553
- type: HostBinding,
1554
- args: ['class._disabled']
1555
- }], input: [{
1556
- type: ViewChild,
1557
- args: ['input']
1558
- }], size: [{
1559
- type: HostBinding,
1560
- args: ['attr.data-size']
1561
- }], isError: [{
1562
- type: HostBinding,
1563
- args: ['class._with-error']
1564
- }], onFocus: [{
1565
- type: HostListener,
1566
- args: ['click']
1466
+ class CuiInputNumberComponent {
1467
+ constructor() {
1468
+ this.changeDetectorRef = inject(ChangeDetectorRef);
1469
+ this.cuiTextFieldController = inject(CUI_TEXT_FIELD_CONTROLLER);
1470
+ this.maskOptions = this.generateMask();
1471
+ this._precision = 0;
1472
+ this._min = Number.MIN_SAFE_INTEGER;
1473
+ this._max = Number.MAX_SAFE_INTEGER;
1474
+ }
1475
+ set precision(value) {
1476
+ this._precision = value;
1477
+ this.maskOptions = this.generateMask();
1478
+ }
1479
+ set min(value) {
1480
+ this._min = value;
1481
+ this.maskOptions = this.generateMask();
1482
+ }
1483
+ set max(value) {
1484
+ this._max = value;
1485
+ this.maskOptions = this.generateMask();
1486
+ }
1487
+ get id() {
1488
+ return this.cuiTextFieldController.id;
1489
+ }
1490
+ get placeholder() {
1491
+ return this.cuiTextFieldController.placeholder;
1492
+ }
1493
+ get iconLeft() {
1494
+ return this.cuiTextFieldController.iconLeft;
1495
+ }
1496
+ get size() {
1497
+ return this.cuiTextFieldController.size;
1498
+ }
1499
+ get isError() {
1500
+ return this.cuiTextFieldController.isError;
1501
+ }
1502
+ writeValue(value) {
1503
+ this.value = value?.toString();
1504
+ this.changeDetectorRef.markForCheck();
1505
+ }
1506
+ registerOnChange(fn) {
1507
+ this.onChange = fn;
1508
+ }
1509
+ registerOnTouched(fn) {
1510
+ this.onTouched = fn;
1511
+ }
1512
+ setDisabledState(isDisabled) {
1513
+ this.isDisabled = isDisabled;
1514
+ this.changeDetectorRef.markForCheck();
1515
+ }
1516
+ onInput({ target }) {
1517
+ this.changeModel(target.value);
1518
+ }
1519
+ onFocus() {
1520
+ this.input.nativeElement.focus();
1521
+ }
1522
+ changeModel(value) {
1523
+ const parsedValue = maskitoParseNumber(value);
1524
+ this.value = value;
1525
+ this.onChange(Number.isNaN(parsedValue) ? null : parsedValue);
1526
+ }
1527
+ generateMask() {
1528
+ return maskitoNumberOptionsGenerator({
1529
+ precision: this._precision,
1530
+ min: this._min,
1531
+ max: this._max
1532
+ });
1533
+ }
1534
+ }
1535
+ CuiInputNumberComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1536
+ CuiInputNumberComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiInputNumberComponent, selector: "cui-input-number", inputs: { precision: "precision", min: "min", max: "max" }, host: { listeners: { "click": "onFocus()" }, properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [
1537
+ CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1538
+ cuiProvide(NG_VALUE_ACCESSOR, CuiInputNumberComponent, true)
1539
+ ], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<cui-svg\r\n *ngIf=\"iconLeft\"\r\n [icon]=\"iconLeft\"\r\n color=\"var(--cui-base-500)\"\r\n></cui-svg>\r\n<input\r\n #input\r\n [ngModel]=\"value\"\r\n [attr.id]=\"id\"\r\n [attr.placeholder]=\"placeholder\"\r\n type=\"text\"\r\n [maskito]=\"maskOptions\"\r\n [disabled]=\"isDisabled\"\r\n class=\"c-input\"\r\n (input)=\"onInput($event)\"\r\n (focus)=\"onTouched()\"\r\n>\r\n\r\n", styles: [":host{padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1540
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberComponent, decorators: [{
1541
+ type: Component,
1542
+ args: [{ selector: 'cui-input-number', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
1543
+ CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1544
+ cuiProvide(NG_VALUE_ACCESSOR, CuiInputNumberComponent, true)
1545
+ ], template: "<cui-svg\r\n *ngIf=\"iconLeft\"\r\n [icon]=\"iconLeft\"\r\n color=\"var(--cui-base-500)\"\r\n></cui-svg>\r\n<input\r\n #input\r\n [ngModel]=\"value\"\r\n [attr.id]=\"id\"\r\n [attr.placeholder]=\"placeholder\"\r\n type=\"text\"\r\n [maskito]=\"maskOptions\"\r\n [disabled]=\"isDisabled\"\r\n class=\"c-input\"\r\n (input)=\"onInput($event)\"\r\n (focus)=\"onTouched()\"\r\n>\r\n\r\n", styles: [":host{padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}\n"] }]
1546
+ }], propDecorators: { precision: [{
1547
+ type: Input
1548
+ }], min: [{
1549
+ type: Input
1550
+ }], max: [{
1551
+ type: Input
1552
+ }], isDisabled: [{
1553
+ type: HostBinding,
1554
+ args: ['class._disabled']
1555
+ }], input: [{
1556
+ type: ViewChild,
1557
+ args: ['input']
1558
+ }], size: [{
1559
+ type: HostBinding,
1560
+ args: ['attr.data-size']
1561
+ }], isError: [{
1562
+ type: HostBinding,
1563
+ args: ['class._with-error']
1564
+ }], onFocus: [{
1565
+ type: HostListener,
1566
+ args: ['click']
1567
1567
  }] } });
1568
1568
 
1569
- class CuiInputNumberModule {
1570
- }
1571
- CuiInputNumberModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1572
- CuiInputNumberModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberModule, declarations: [CuiInputNumberComponent], imports: [CommonModule,
1573
- FormsModule,
1574
- MaskitoDirective,
1575
- CuiSvgModule], exports: [CuiInputNumberComponent,
1576
- CuiTextFieldControllerModule] });
1577
- CuiInputNumberModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberModule, imports: [CommonModule,
1578
- FormsModule,
1579
- CuiSvgModule, CuiTextFieldControllerModule] });
1580
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberModule, decorators: [{
1581
- type: NgModule,
1582
- args: [{
1583
- imports: [
1584
- CommonModule,
1585
- FormsModule,
1586
- MaskitoDirective,
1587
- CuiSvgModule,
1588
- ],
1589
- declarations: [CuiInputNumberComponent],
1590
- exports: [
1591
- CuiInputNumberComponent,
1592
- CuiTextFieldControllerModule
1593
- ]
1594
- }]
1569
+ class CuiInputNumberModule {
1570
+ }
1571
+ CuiInputNumberModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1572
+ CuiInputNumberModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberModule, declarations: [CuiInputNumberComponent], imports: [CommonModule,
1573
+ FormsModule,
1574
+ MaskitoDirective,
1575
+ CuiSvgModule], exports: [CuiInputNumberComponent,
1576
+ CuiTextFieldControllerModule] });
1577
+ CuiInputNumberModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberModule, imports: [CommonModule,
1578
+ FormsModule,
1579
+ CuiSvgModule, CuiTextFieldControllerModule] });
1580
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberModule, decorators: [{
1581
+ type: NgModule,
1582
+ args: [{
1583
+ imports: [
1584
+ CommonModule,
1585
+ FormsModule,
1586
+ MaskitoDirective,
1587
+ CuiSvgModule,
1588
+ ],
1589
+ declarations: [CuiInputNumberComponent],
1590
+ exports: [
1591
+ CuiInputNumberComponent,
1592
+ CuiTextFieldControllerModule
1593
+ ]
1594
+ }]
1595
1595
  }] });
1596
1596
 
1597
- class CuiInputPasswordComponent {
1598
- constructor() {
1599
- this.changeDetectorRef = inject(ChangeDetectorRef);
1600
- this.cuiTextFieldController = inject(CUI_TEXT_FIELD_CONTROLLER);
1601
- this.isPasswordHidden = true;
1602
- }
1603
- get id() {
1604
- return this.cuiTextFieldController.id;
1605
- }
1606
- get placeholder() {
1607
- return this.cuiTextFieldController.placeholder;
1608
- }
1609
- get iconLeft() {
1610
- return this.cuiTextFieldController.iconLeft;
1611
- }
1612
- get isToggleButtonShown() {
1613
- return !this.isDisabled;
1614
- }
1615
- get icon() {
1616
- return this.isPasswordHidden ? 'cuiIconEye' : 'cuiIconEyeOff';
1617
- }
1618
- get type() {
1619
- return this.isPasswordHidden ? 'password' : 'text';
1620
- }
1621
- get buttonTitle() {
1622
- return this.isPasswordHidden ? 'Reveal password' : 'Hide password';
1623
- }
1624
- get size() {
1625
- return this.cuiTextFieldController.size;
1626
- }
1627
- get isError() {
1628
- return this.cuiTextFieldController.isError;
1629
- }
1630
- writeValue(value) {
1631
- this.value = value;
1632
- this.changeDetectorRef.markForCheck();
1633
- }
1634
- registerOnChange(fn) {
1635
- this.onChange = fn;
1636
- }
1637
- registerOnTouched(fn) {
1638
- this.onTouched = fn;
1639
- }
1640
- setDisabledState(isDisabled) {
1641
- this.isDisabled = isDisabled;
1642
- if (this.isDisabled) {
1643
- this.isPasswordHidden = true;
1644
- }
1645
- this.changeDetectorRef.markForCheck();
1646
- }
1647
- onInput({ target }) {
1648
- const value = target.value;
1649
- this.value = value;
1650
- this.onChange(value);
1651
- }
1652
- onTogglePasswordVisibility() {
1653
- this.isPasswordHidden = !this.isPasswordHidden;
1654
- }
1655
- }
1656
- CuiInputPasswordComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputPasswordComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1657
- CuiInputPasswordComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiInputPasswordComponent, selector: "cui-input-password", host: { properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [
1658
- CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1659
- cuiProvide(NG_VALUE_ACCESSOR, CuiInputPasswordComponent, true)
1660
- ], ngImport: i0, template: "<cui-svg\n *ngIf=\"iconLeft\"\n [icon]=\"iconLeft\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n [ngModel]=\"value\"\n [attr.id]=\"id\"\n [attr.placeholder]=\"placeholder\"\n [type]=\"type\"\n [disabled]=\"isDisabled\"\n class=\"c-input\"\n (input)=\"onInput($event)\"\n (focus)=\"onTouched()\"\n>\n<button\n *ngIf=\"isToggleButtonShown\"\n [title]=\"buttonTitle\"\n class=\"c-button\"\n (click)=\"onTogglePasswordVisibility()\"\n>\n <cui-svg\n [icon]=\"icon\"\n [width]=\"16\"\n [height]=\"16\"\n color=\"var(--cui-base-500)\"\n ></cui-svg>\n</button>\n", styles: [":host{padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}.c-input::-ms-reveal{display:none}.c-input[type=password]{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1661
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputPasswordComponent, decorators: [{
1662
- type: Component,
1663
- args: [{ selector: 'cui-input-password', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
1664
- CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1665
- cuiProvide(NG_VALUE_ACCESSOR, CuiInputPasswordComponent, true)
1666
- ], template: "<cui-svg\n *ngIf=\"iconLeft\"\n [icon]=\"iconLeft\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n [ngModel]=\"value\"\n [attr.id]=\"id\"\n [attr.placeholder]=\"placeholder\"\n [type]=\"type\"\n [disabled]=\"isDisabled\"\n class=\"c-input\"\n (input)=\"onInput($event)\"\n (focus)=\"onTouched()\"\n>\n<button\n *ngIf=\"isToggleButtonShown\"\n [title]=\"buttonTitle\"\n class=\"c-button\"\n (click)=\"onTogglePasswordVisibility()\"\n>\n <cui-svg\n [icon]=\"icon\"\n [width]=\"16\"\n [height]=\"16\"\n color=\"var(--cui-base-500)\"\n ></cui-svg>\n</button>\n", styles: [":host{padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}.c-input::-ms-reveal{display:none}.c-input[type=password]{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}\n"] }]
1667
- }], propDecorators: { isDisabled: [{
1668
- type: HostBinding,
1669
- args: ['class._disabled']
1670
- }], size: [{
1671
- type: HostBinding,
1672
- args: ['attr.data-size']
1673
- }], isError: [{
1674
- type: HostBinding,
1675
- args: ['class._with-error']
1597
+ class CuiInputPasswordComponent {
1598
+ constructor() {
1599
+ this.changeDetectorRef = inject(ChangeDetectorRef);
1600
+ this.cuiTextFieldController = inject(CUI_TEXT_FIELD_CONTROLLER);
1601
+ this.isPasswordHidden = true;
1602
+ }
1603
+ get id() {
1604
+ return this.cuiTextFieldController.id;
1605
+ }
1606
+ get placeholder() {
1607
+ return this.cuiTextFieldController.placeholder;
1608
+ }
1609
+ get iconLeft() {
1610
+ return this.cuiTextFieldController.iconLeft;
1611
+ }
1612
+ get isToggleButtonShown() {
1613
+ return !this.isDisabled;
1614
+ }
1615
+ get icon() {
1616
+ return this.isPasswordHidden ? 'cuiIconEye' : 'cuiIconEyeOff';
1617
+ }
1618
+ get type() {
1619
+ return this.isPasswordHidden ? 'password' : 'text';
1620
+ }
1621
+ get buttonTitle() {
1622
+ return this.isPasswordHidden ? 'Reveal password' : 'Hide password';
1623
+ }
1624
+ get size() {
1625
+ return this.cuiTextFieldController.size;
1626
+ }
1627
+ get isError() {
1628
+ return this.cuiTextFieldController.isError;
1629
+ }
1630
+ writeValue(value) {
1631
+ this.value = value;
1632
+ this.changeDetectorRef.markForCheck();
1633
+ }
1634
+ registerOnChange(fn) {
1635
+ this.onChange = fn;
1636
+ }
1637
+ registerOnTouched(fn) {
1638
+ this.onTouched = fn;
1639
+ }
1640
+ setDisabledState(isDisabled) {
1641
+ this.isDisabled = isDisabled;
1642
+ if (this.isDisabled) {
1643
+ this.isPasswordHidden = true;
1644
+ }
1645
+ this.changeDetectorRef.markForCheck();
1646
+ }
1647
+ onInput({ target }) {
1648
+ const value = target.value;
1649
+ this.value = value;
1650
+ this.onChange(value);
1651
+ }
1652
+ onTogglePasswordVisibility() {
1653
+ this.isPasswordHidden = !this.isPasswordHidden;
1654
+ }
1655
+ }
1656
+ CuiInputPasswordComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputPasswordComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1657
+ CuiInputPasswordComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiInputPasswordComponent, selector: "cui-input-password", host: { properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [
1658
+ CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1659
+ cuiProvide(NG_VALUE_ACCESSOR, CuiInputPasswordComponent, true)
1660
+ ], ngImport: i0, template: "<cui-svg\r\n *ngIf=\"iconLeft\"\r\n [icon]=\"iconLeft\"\r\n color=\"var(--cui-base-500)\"\r\n></cui-svg>\r\n<input\r\n [ngModel]=\"value\"\r\n [attr.id]=\"id\"\r\n [attr.placeholder]=\"placeholder\"\r\n [type]=\"type\"\r\n [disabled]=\"isDisabled\"\r\n class=\"c-input\"\r\n (input)=\"onInput($event)\"\r\n (focus)=\"onTouched()\"\r\n>\r\n<button\r\n *ngIf=\"isToggleButtonShown\"\r\n [title]=\"buttonTitle\"\r\n class=\"c-button\"\r\n (click)=\"onTogglePasswordVisibility()\"\r\n>\r\n <cui-svg\r\n [icon]=\"icon\"\r\n [width]=\"16\"\r\n [height]=\"16\"\r\n color=\"var(--cui-base-500)\"\r\n ></cui-svg>\r\n</button>\r\n", styles: [":host{padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}.c-input::-ms-reveal{display:none}.c-input[type=password]{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1661
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputPasswordComponent, decorators: [{
1662
+ type: Component,
1663
+ args: [{ selector: 'cui-input-password', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
1664
+ CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1665
+ cuiProvide(NG_VALUE_ACCESSOR, CuiInputPasswordComponent, true)
1666
+ ], template: "<cui-svg\r\n *ngIf=\"iconLeft\"\r\n [icon]=\"iconLeft\"\r\n color=\"var(--cui-base-500)\"\r\n></cui-svg>\r\n<input\r\n [ngModel]=\"value\"\r\n [attr.id]=\"id\"\r\n [attr.placeholder]=\"placeholder\"\r\n [type]=\"type\"\r\n [disabled]=\"isDisabled\"\r\n class=\"c-input\"\r\n (input)=\"onInput($event)\"\r\n (focus)=\"onTouched()\"\r\n>\r\n<button\r\n *ngIf=\"isToggleButtonShown\"\r\n [title]=\"buttonTitle\"\r\n class=\"c-button\"\r\n (click)=\"onTogglePasswordVisibility()\"\r\n>\r\n <cui-svg\r\n [icon]=\"icon\"\r\n [width]=\"16\"\r\n [height]=\"16\"\r\n color=\"var(--cui-base-500)\"\r\n ></cui-svg>\r\n</button>\r\n", styles: [":host{padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}.c-input::-ms-reveal{display:none}.c-input[type=password]{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}\n"] }]
1667
+ }], propDecorators: { isDisabled: [{
1668
+ type: HostBinding,
1669
+ args: ['class._disabled']
1670
+ }], size: [{
1671
+ type: HostBinding,
1672
+ args: ['attr.data-size']
1673
+ }], isError: [{
1674
+ type: HostBinding,
1675
+ args: ['class._with-error']
1676
1676
  }] } });
1677
1677
 
1678
- class CuiInputPasswordModule {
1679
- }
1680
- CuiInputPasswordModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputPasswordModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1681
- CuiInputPasswordModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiInputPasswordModule, declarations: [CuiInputPasswordComponent], imports: [CommonModule,
1682
- FormsModule,
1683
- CuiSvgModule], exports: [CuiInputPasswordComponent,
1684
- CuiTextFieldControllerModule] });
1685
- CuiInputPasswordModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputPasswordModule, imports: [CommonModule,
1686
- FormsModule,
1687
- CuiSvgModule, CuiTextFieldControllerModule] });
1688
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputPasswordModule, decorators: [{
1689
- type: NgModule,
1690
- args: [{
1691
- imports: [
1692
- CommonModule,
1693
- FormsModule,
1694
- CuiSvgModule
1695
- ],
1696
- declarations: [CuiInputPasswordComponent],
1697
- exports: [
1698
- CuiInputPasswordComponent,
1699
- CuiTextFieldControllerModule
1700
- ]
1701
- }]
1678
+ class CuiInputPasswordModule {
1679
+ }
1680
+ CuiInputPasswordModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputPasswordModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1681
+ CuiInputPasswordModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiInputPasswordModule, declarations: [CuiInputPasswordComponent], imports: [CommonModule,
1682
+ FormsModule,
1683
+ CuiSvgModule], exports: [CuiInputPasswordComponent,
1684
+ CuiTextFieldControllerModule] });
1685
+ CuiInputPasswordModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputPasswordModule, imports: [CommonModule,
1686
+ FormsModule,
1687
+ CuiSvgModule, CuiTextFieldControllerModule] });
1688
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputPasswordModule, decorators: [{
1689
+ type: NgModule,
1690
+ args: [{
1691
+ imports: [
1692
+ CommonModule,
1693
+ FormsModule,
1694
+ CuiSvgModule
1695
+ ],
1696
+ declarations: [CuiInputPasswordComponent],
1697
+ exports: [
1698
+ CuiInputPasswordComponent,
1699
+ CuiTextFieldControllerModule
1700
+ ]
1701
+ }]
1702
1702
  }] });
1703
1703
 
1704
- class CuiInputTextComponent {
1705
- constructor() {
1706
- this.changeDetectorRef = inject(ChangeDetectorRef);
1707
- this.cuiTextFieldController = inject(CUI_TEXT_FIELD_CONTROLLER);
1708
- }
1709
- get id() {
1710
- return this.cuiTextFieldController.id;
1711
- }
1712
- get placeholder() {
1713
- return this.cuiTextFieldController.placeholder;
1714
- }
1715
- get iconLeft() {
1716
- return this.cuiTextFieldController.iconLeft;
1717
- }
1718
- get isClearButtonHidden() {
1719
- return !(this.value && !this.isDisabled);
1720
- }
1721
- get size() {
1722
- return this.cuiTextFieldController.size;
1723
- }
1724
- get isError() {
1725
- return this.cuiTextFieldController.isError;
1726
- }
1727
- writeValue(value) {
1728
- this.value = value;
1729
- this.changeDetectorRef.markForCheck();
1730
- }
1731
- registerOnChange(fn) {
1732
- this.onChange = fn;
1733
- }
1734
- registerOnTouched(fn) {
1735
- this.onTouched = fn;
1736
- }
1737
- setDisabledState(isDisabled) {
1738
- this.isDisabled = isDisabled;
1739
- this.changeDetectorRef.markForCheck();
1740
- }
1741
- onInput({ target }) {
1742
- this.changeModel(target.value);
1743
- }
1744
- onClear() {
1745
- this.changeModel('');
1746
- }
1747
- onFocus() {
1748
- this.input.nativeElement.focus();
1749
- }
1750
- changeModel(value) {
1751
- this.value = value;
1752
- this.onChange(value);
1753
- }
1754
- }
1755
- CuiInputTextComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1756
- CuiInputTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiInputTextComponent, selector: "cui-input-text", host: { listeners: { "click": "onFocus()" }, properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [
1757
- CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1758
- cuiProvide(NG_VALUE_ACCESSOR, CuiInputTextComponent, true)
1759
- ], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<cui-svg\n *ngIf=\"iconLeft\"\n [icon]=\"iconLeft\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n #input\n [ngModel]=\"value\"\n [attr.id]=\"id\"\n [attr.placeholder]=\"placeholder\"\n type=\"text\"\n [disabled]=\"isDisabled\"\n class=\"c-input\"\n (input)=\"onInput($event)\"\n (focus)=\"onTouched()\"\n>\n<button\n type=\"button\"\n class=\"c-button\"\n [class.c-button_hidden]=\"isClearButtonHidden\"\n (click)=\"onClear()\"\n>\n <cui-svg\n icon=\"cuiIconClear\"\n color=\"var(--cui-base-300)\"\n class=\"c-close-icon\"\n />\n</button>\n", styles: [":host{padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}.c-close-icon ::ng-deep path{stroke:var(--cui-base-0)!important}.c-button_hidden{visibility:hidden}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1760
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputTextComponent, decorators: [{
1761
- type: Component,
1762
- args: [{ selector: 'cui-input-text', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
1763
- CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1764
- cuiProvide(NG_VALUE_ACCESSOR, CuiInputTextComponent, true)
1765
- ], template: "<cui-svg\n *ngIf=\"iconLeft\"\n [icon]=\"iconLeft\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n #input\n [ngModel]=\"value\"\n [attr.id]=\"id\"\n [attr.placeholder]=\"placeholder\"\n type=\"text\"\n [disabled]=\"isDisabled\"\n class=\"c-input\"\n (input)=\"onInput($event)\"\n (focus)=\"onTouched()\"\n>\n<button\n type=\"button\"\n class=\"c-button\"\n [class.c-button_hidden]=\"isClearButtonHidden\"\n (click)=\"onClear()\"\n>\n <cui-svg\n icon=\"cuiIconClear\"\n color=\"var(--cui-base-300)\"\n class=\"c-close-icon\"\n />\n</button>\n", styles: [":host{padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}.c-close-icon ::ng-deep path{stroke:var(--cui-base-0)!important}.c-button_hidden{visibility:hidden}\n"] }]
1766
- }], propDecorators: { isDisabled: [{
1767
- type: HostBinding,
1768
- args: ['class._disabled']
1769
- }], input: [{
1770
- type: ViewChild,
1771
- args: ['input']
1772
- }], size: [{
1773
- type: HostBinding,
1774
- args: ['attr.data-size']
1775
- }], isError: [{
1776
- type: HostBinding,
1777
- args: ['class._with-error']
1778
- }], onFocus: [{
1779
- type: HostListener,
1780
- args: ['click']
1704
+ class CuiInputTextComponent {
1705
+ constructor() {
1706
+ this.changeDetectorRef = inject(ChangeDetectorRef);
1707
+ this.cuiTextFieldController = inject(CUI_TEXT_FIELD_CONTROLLER);
1708
+ }
1709
+ get id() {
1710
+ return this.cuiTextFieldController.id;
1711
+ }
1712
+ get placeholder() {
1713
+ return this.cuiTextFieldController.placeholder;
1714
+ }
1715
+ get iconLeft() {
1716
+ return this.cuiTextFieldController.iconLeft;
1717
+ }
1718
+ get isClearButtonHidden() {
1719
+ return !(this.value && !this.isDisabled);
1720
+ }
1721
+ get size() {
1722
+ return this.cuiTextFieldController.size;
1723
+ }
1724
+ get isError() {
1725
+ return this.cuiTextFieldController.isError;
1726
+ }
1727
+ writeValue(value) {
1728
+ this.value = value;
1729
+ this.changeDetectorRef.markForCheck();
1730
+ }
1731
+ registerOnChange(fn) {
1732
+ this.onChange = fn;
1733
+ }
1734
+ registerOnTouched(fn) {
1735
+ this.onTouched = fn;
1736
+ }
1737
+ setDisabledState(isDisabled) {
1738
+ this.isDisabled = isDisabled;
1739
+ this.changeDetectorRef.markForCheck();
1740
+ }
1741
+ onInput({ target }) {
1742
+ this.changeModel(target.value);
1743
+ }
1744
+ onClear() {
1745
+ this.changeModel('');
1746
+ }
1747
+ onFocus() {
1748
+ this.input.nativeElement.focus();
1749
+ }
1750
+ changeModel(value) {
1751
+ this.value = value;
1752
+ this.onChange(value);
1753
+ }
1754
+ }
1755
+ CuiInputTextComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1756
+ CuiInputTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiInputTextComponent, selector: "cui-input-text", host: { listeners: { "click": "onFocus()" }, properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [
1757
+ CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1758
+ cuiProvide(NG_VALUE_ACCESSOR, CuiInputTextComponent, true)
1759
+ ], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<cui-svg\r\n *ngIf=\"iconLeft\"\r\n [icon]=\"iconLeft\"\r\n color=\"var(--cui-base-500)\"\r\n></cui-svg>\r\n<input\r\n #input\r\n [ngModel]=\"value\"\r\n [attr.id]=\"id\"\r\n [attr.placeholder]=\"placeholder\"\r\n type=\"text\"\r\n [disabled]=\"isDisabled\"\r\n class=\"c-input\"\r\n (input)=\"onInput($event)\"\r\n (focus)=\"onTouched()\"\r\n>\r\n<button\r\n type=\"button\"\r\n class=\"c-button\"\r\n [class.c-button_hidden]=\"isClearButtonHidden\"\r\n (click)=\"onClear()\"\r\n>\r\n <cui-svg\r\n icon=\"cuiIconClear\"\r\n color=\"var(--cui-base-300)\"\r\n class=\"c-close-icon\"\r\n />\r\n</button>\r\n", styles: [":host{padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}.c-close-icon ::ng-deep path{stroke:var(--cui-base-0)!important}.c-button_hidden{visibility:hidden}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1760
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputTextComponent, decorators: [{
1761
+ type: Component,
1762
+ args: [{ selector: 'cui-input-text', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
1763
+ CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1764
+ cuiProvide(NG_VALUE_ACCESSOR, CuiInputTextComponent, true)
1765
+ ], template: "<cui-svg\r\n *ngIf=\"iconLeft\"\r\n [icon]=\"iconLeft\"\r\n color=\"var(--cui-base-500)\"\r\n></cui-svg>\r\n<input\r\n #input\r\n [ngModel]=\"value\"\r\n [attr.id]=\"id\"\r\n [attr.placeholder]=\"placeholder\"\r\n type=\"text\"\r\n [disabled]=\"isDisabled\"\r\n class=\"c-input\"\r\n (input)=\"onInput($event)\"\r\n (focus)=\"onTouched()\"\r\n>\r\n<button\r\n type=\"button\"\r\n class=\"c-button\"\r\n [class.c-button_hidden]=\"isClearButtonHidden\"\r\n (click)=\"onClear()\"\r\n>\r\n <cui-svg\r\n icon=\"cuiIconClear\"\r\n color=\"var(--cui-base-300)\"\r\n class=\"c-close-icon\"\r\n />\r\n</button>\r\n", styles: [":host{padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}.c-close-icon ::ng-deep path{stroke:var(--cui-base-0)!important}.c-button_hidden{visibility:hidden}\n"] }]
1766
+ }], propDecorators: { isDisabled: [{
1767
+ type: HostBinding,
1768
+ args: ['class._disabled']
1769
+ }], input: [{
1770
+ type: ViewChild,
1771
+ args: ['input']
1772
+ }], size: [{
1773
+ type: HostBinding,
1774
+ args: ['attr.data-size']
1775
+ }], isError: [{
1776
+ type: HostBinding,
1777
+ args: ['class._with-error']
1778
+ }], onFocus: [{
1779
+ type: HostListener,
1780
+ args: ['click']
1781
1781
  }] } });
1782
1782
 
1783
- class CuiInputModule {
1784
- }
1785
- CuiInputModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1786
- CuiInputModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiInputModule, declarations: [CuiInputTextComponent], imports: [CommonModule,
1787
- FormsModule,
1788
- CuiSvgModule], exports: [CuiInputTextComponent,
1789
- CuiTextFieldControllerModule] });
1790
- CuiInputModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputModule, imports: [CommonModule,
1791
- FormsModule,
1792
- CuiSvgModule, CuiTextFieldControllerModule] });
1793
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputModule, decorators: [{
1794
- type: NgModule,
1795
- args: [{
1796
- imports: [
1797
- CommonModule,
1798
- FormsModule,
1799
- CuiSvgModule
1800
- ],
1801
- declarations: [CuiInputTextComponent],
1802
- exports: [
1803
- CuiInputTextComponent,
1804
- CuiTextFieldControllerModule
1805
- ]
1806
- }]
1783
+ class CuiInputModule {
1784
+ }
1785
+ CuiInputModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1786
+ CuiInputModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiInputModule, declarations: [CuiInputTextComponent], imports: [CommonModule,
1787
+ FormsModule,
1788
+ CuiSvgModule], exports: [CuiInputTextComponent,
1789
+ CuiTextFieldControllerModule] });
1790
+ CuiInputModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputModule, imports: [CommonModule,
1791
+ FormsModule,
1792
+ CuiSvgModule, CuiTextFieldControllerModule] });
1793
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputModule, decorators: [{
1794
+ type: NgModule,
1795
+ args: [{
1796
+ imports: [
1797
+ CommonModule,
1798
+ FormsModule,
1799
+ CuiSvgModule
1800
+ ],
1801
+ declarations: [CuiInputTextComponent],
1802
+ exports: [
1803
+ CuiInputTextComponent,
1804
+ CuiTextFieldControllerModule
1805
+ ]
1806
+ }]
1807
1807
  }] });
1808
1808
 
1809
- const CUI_INPUT_TIME_DEFAULT_OPTIONS = {
1810
- mode: 'HH:MM'
1811
- };
1812
- const CUI_INPUT_TIME_OPTIONS = new InjectionToken('', {
1813
- factory: () => CUI_INPUT_TIME_DEFAULT_OPTIONS
1809
+ const CUI_INPUT_TIME_DEFAULT_OPTIONS = {
1810
+ mode: 'HH:MM'
1811
+ };
1812
+ const CUI_INPUT_TIME_OPTIONS = new InjectionToken('', {
1813
+ factory: () => CUI_INPUT_TIME_DEFAULT_OPTIONS
1814
1814
  });
1815
1815
 
1816
- class CuiInputTimeComponent {
1817
- constructor() {
1818
- this.changeDetectorRef = inject(ChangeDetectorRef);
1819
- this.cuiTextFieldController = inject(CUI_TEXT_FIELD_CONTROLLER);
1820
- this.options = inject(CUI_INPUT_TIME_OPTIONS);
1821
- this._mode = this.options.mode;
1822
- this.maskOptions = this.generateMask(this._mode);
1823
- this.defaultPlaceholder = this._mode.toLowerCase();
1824
- }
1825
- set mode(value) {
1826
- this._mode = value;
1827
- this.maskOptions = this.generateMask(value);
1828
- this.defaultPlaceholder = value.toLowerCase();
1829
- }
1830
- get id() {
1831
- return this.cuiTextFieldController.id;
1832
- }
1833
- get placeholder() {
1834
- return this.cuiTextFieldController.placeholder ?? this.defaultPlaceholder;
1835
- }
1836
- get computedValue() {
1837
- return this.value ? this.value.toString(this._mode) : '';
1838
- }
1839
- get size() {
1840
- return this.cuiTextFieldController.size;
1841
- }
1842
- get isError() {
1843
- return this.cuiTextFieldController.isError;
1844
- }
1845
- writeValue(value) {
1846
- this.value = value;
1847
- this.changeDetectorRef.markForCheck();
1848
- }
1849
- registerOnChange(fn) {
1850
- this.onChange = fn;
1851
- }
1852
- registerOnTouched(fn) {
1853
- this.onTouched = fn;
1854
- }
1855
- setDisabledState(isDisabled) {
1856
- this.isDisabled = isDisabled;
1857
- this.changeDetectorRef.markForCheck();
1858
- }
1859
- onInput(event) {
1860
- const value = event.target.value;
1861
- if (value.length !== this._mode.length) {
1862
- this.onChange(null);
1863
- return;
1864
- }
1865
- const time = CuiTime.fromString(value);
1866
- this.onChange(time);
1867
- }
1868
- onFocus() {
1869
- this.input.nativeElement.focus();
1870
- }
1871
- generateMask(mode) {
1872
- return maskitoTimeOptionsGenerator({ mode });
1873
- }
1874
- }
1875
- CuiInputTimeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputTimeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1876
- CuiInputTimeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiInputTimeComponent, selector: "cui-input-time", inputs: { mode: "mode" }, host: { listeners: { "click": "onFocus()" }, properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [
1877
- CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1878
- cuiProvide(NG_VALUE_ACCESSOR, CuiInputTimeComponent, true)
1879
- ], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<cui-svg\n icon=\"cuiIconClock\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n #input\n [ngModel]=\"computedValue\"\n [attr.id]=\"id\"\n [attr.placeholder]=\"placeholder\"\n type=\"text\"\n [maskito]=\"maskOptions\"\n [disabled]=\"isDisabled\"\n class=\"c-input\"\n (input)=\"onInput($event)\"\n (focus)=\"onTouched()\"\n>", styles: [":host{padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}\n"], dependencies: [{ kind: "directive", type: i2$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1880
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputTimeComponent, decorators: [{
1881
- type: Component,
1882
- args: [{ selector: 'cui-input-time', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
1883
- CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1884
- cuiProvide(NG_VALUE_ACCESSOR, CuiInputTimeComponent, true)
1885
- ], template: "<cui-svg\n icon=\"cuiIconClock\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n #input\n [ngModel]=\"computedValue\"\n [attr.id]=\"id\"\n [attr.placeholder]=\"placeholder\"\n type=\"text\"\n [maskito]=\"maskOptions\"\n [disabled]=\"isDisabled\"\n class=\"c-input\"\n (input)=\"onInput($event)\"\n (focus)=\"onTouched()\"\n>", styles: [":host{padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}\n"] }]
1886
- }], propDecorators: { mode: [{
1887
- type: Input
1888
- }], isDisabled: [{
1889
- type: HostBinding,
1890
- args: ['class._disabled']
1891
- }], input: [{
1892
- type: ViewChild,
1893
- args: ['input']
1894
- }], size: [{
1895
- type: HostBinding,
1896
- args: ['attr.data-size']
1897
- }], isError: [{
1898
- type: HostBinding,
1899
- args: ['class._with-error']
1900
- }], onFocus: [{
1901
- type: HostListener,
1902
- args: ['click']
1816
+ class CuiInputTimeComponent {
1817
+ constructor() {
1818
+ this.changeDetectorRef = inject(ChangeDetectorRef);
1819
+ this.cuiTextFieldController = inject(CUI_TEXT_FIELD_CONTROLLER);
1820
+ this.options = inject(CUI_INPUT_TIME_OPTIONS);
1821
+ this._mode = this.options.mode;
1822
+ this.maskOptions = this.generateMask(this._mode);
1823
+ this.defaultPlaceholder = this._mode.toLowerCase();
1824
+ }
1825
+ set mode(value) {
1826
+ this._mode = value;
1827
+ this.maskOptions = this.generateMask(value);
1828
+ this.defaultPlaceholder = value.toLowerCase();
1829
+ }
1830
+ get id() {
1831
+ return this.cuiTextFieldController.id;
1832
+ }
1833
+ get placeholder() {
1834
+ return this.cuiTextFieldController.placeholder ?? this.defaultPlaceholder;
1835
+ }
1836
+ get computedValue() {
1837
+ return this.value ? this.value.toString(this._mode) : '';
1838
+ }
1839
+ get size() {
1840
+ return this.cuiTextFieldController.size;
1841
+ }
1842
+ get isError() {
1843
+ return this.cuiTextFieldController.isError;
1844
+ }
1845
+ writeValue(value) {
1846
+ this.value = value;
1847
+ this.changeDetectorRef.markForCheck();
1848
+ }
1849
+ registerOnChange(fn) {
1850
+ this.onChange = fn;
1851
+ }
1852
+ registerOnTouched(fn) {
1853
+ this.onTouched = fn;
1854
+ }
1855
+ setDisabledState(isDisabled) {
1856
+ this.isDisabled = isDisabled;
1857
+ this.changeDetectorRef.markForCheck();
1858
+ }
1859
+ onInput(event) {
1860
+ const value = event.target.value;
1861
+ if (value.length !== this._mode.length) {
1862
+ this.onChange(null);
1863
+ return;
1864
+ }
1865
+ const time = CuiTime.fromString(value);
1866
+ this.onChange(time);
1867
+ }
1868
+ onFocus() {
1869
+ this.input.nativeElement.focus();
1870
+ }
1871
+ generateMask(mode) {
1872
+ return maskitoTimeOptionsGenerator({ mode });
1873
+ }
1874
+ }
1875
+ CuiInputTimeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputTimeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1876
+ CuiInputTimeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiInputTimeComponent, selector: "cui-input-time", inputs: { mode: "mode" }, host: { listeners: { "click": "onFocus()" }, properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [
1877
+ CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1878
+ cuiProvide(NG_VALUE_ACCESSOR, CuiInputTimeComponent, true)
1879
+ ], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<cui-svg\r\n icon=\"cuiIconClock\"\r\n color=\"var(--cui-base-500)\"\r\n></cui-svg>\r\n<input\r\n #input\r\n [ngModel]=\"computedValue\"\r\n [attr.id]=\"id\"\r\n [attr.placeholder]=\"placeholder\"\r\n type=\"text\"\r\n [maskito]=\"maskOptions\"\r\n [disabled]=\"isDisabled\"\r\n class=\"c-input\"\r\n (input)=\"onInput($event)\"\r\n (focus)=\"onTouched()\"\r\n>", styles: [":host{padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}\n"], dependencies: [{ kind: "directive", type: i2$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1880
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputTimeComponent, decorators: [{
1881
+ type: Component,
1882
+ args: [{ selector: 'cui-input-time', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
1883
+ CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1884
+ cuiProvide(NG_VALUE_ACCESSOR, CuiInputTimeComponent, true)
1885
+ ], template: "<cui-svg\r\n icon=\"cuiIconClock\"\r\n color=\"var(--cui-base-500)\"\r\n></cui-svg>\r\n<input\r\n #input\r\n [ngModel]=\"computedValue\"\r\n [attr.id]=\"id\"\r\n [attr.placeholder]=\"placeholder\"\r\n type=\"text\"\r\n [maskito]=\"maskOptions\"\r\n [disabled]=\"isDisabled\"\r\n class=\"c-input\"\r\n (input)=\"onInput($event)\"\r\n (focus)=\"onTouched()\"\r\n>", styles: [":host{padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}\n"] }]
1886
+ }], propDecorators: { mode: [{
1887
+ type: Input
1888
+ }], isDisabled: [{
1889
+ type: HostBinding,
1890
+ args: ['class._disabled']
1891
+ }], input: [{
1892
+ type: ViewChild,
1893
+ args: ['input']
1894
+ }], size: [{
1895
+ type: HostBinding,
1896
+ args: ['attr.data-size']
1897
+ }], isError: [{
1898
+ type: HostBinding,
1899
+ args: ['class._with-error']
1900
+ }], onFocus: [{
1901
+ type: HostListener,
1902
+ args: ['click']
1903
1903
  }] } });
1904
1904
 
1905
- class CuiInputTimeModule {
1906
- }
1907
- CuiInputTimeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputTimeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1908
- CuiInputTimeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiInputTimeModule, declarations: [CuiInputTimeComponent], imports: [CommonModule,
1909
- FormsModule,
1910
- MaskitoDirective,
1911
- CuiSvgModule], exports: [CuiInputTimeComponent,
1912
- CuiTextFieldControllerModule] });
1913
- CuiInputTimeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputTimeModule, imports: [CommonModule,
1914
- FormsModule,
1915
- CuiSvgModule, CuiTextFieldControllerModule] });
1916
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputTimeModule, decorators: [{
1917
- type: NgModule,
1918
- args: [{
1919
- imports: [
1920
- CommonModule,
1921
- FormsModule,
1922
- MaskitoDirective,
1923
- CuiSvgModule
1924
- ],
1925
- declarations: [CuiInputTimeComponent],
1926
- exports: [
1927
- CuiInputTimeComponent,
1928
- CuiTextFieldControllerModule
1929
- ]
1930
- }]
1905
+ class CuiInputTimeModule {
1906
+ }
1907
+ CuiInputTimeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputTimeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1908
+ CuiInputTimeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiInputTimeModule, declarations: [CuiInputTimeComponent], imports: [CommonModule,
1909
+ FormsModule,
1910
+ MaskitoDirective,
1911
+ CuiSvgModule], exports: [CuiInputTimeComponent,
1912
+ CuiTextFieldControllerModule] });
1913
+ CuiInputTimeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputTimeModule, imports: [CommonModule,
1914
+ FormsModule,
1915
+ CuiSvgModule, CuiTextFieldControllerModule] });
1916
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputTimeModule, decorators: [{
1917
+ type: NgModule,
1918
+ args: [{
1919
+ imports: [
1920
+ CommonModule,
1921
+ FormsModule,
1922
+ MaskitoDirective,
1923
+ CuiSvgModule
1924
+ ],
1925
+ declarations: [CuiInputTimeComponent],
1926
+ exports: [
1927
+ CuiInputTimeComponent,
1928
+ CuiTextFieldControllerModule
1929
+ ]
1930
+ }]
1931
1931
  }] });
1932
1932
 
1933
- class CuiLabelComponent {
1934
- constructor() {
1935
- this.isRequired = false;
1936
- }
1937
- }
1938
- CuiLabelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1939
- CuiLabelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiLabelComponent, selector: "label[cuiLabel]", inputs: { isRequired: "isRequired" }, ngImport: i0, template: "<span class=\"c-wrapper\">\n <ng-content></ng-content>\n</span>\n<span\n *ngIf=\"isRequired\"\n class=\"c-star\"\n>\n *\n</span>\n", styles: [":host{font-weight:500;font-size:14px;line-height:20px;display:inline-flex;gap:2px;width:-moz-fit-content;width:fit-content;color:var(--cui-base-900);font-family:var(--cui-main-font)}.c-wrapper{display:inline-flex;align-items:center;gap:8px}.c-star{color:var(--cui-danger)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1940
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiLabelComponent, decorators: [{
1941
- type: Component,
1942
- args: [{ selector: 'label[cuiLabel]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<span class=\"c-wrapper\">\n <ng-content></ng-content>\n</span>\n<span\n *ngIf=\"isRequired\"\n class=\"c-star\"\n>\n *\n</span>\n", styles: [":host{font-weight:500;font-size:14px;line-height:20px;display:inline-flex;gap:2px;width:-moz-fit-content;width:fit-content;color:var(--cui-base-900);font-family:var(--cui-main-font)}.c-wrapper{display:inline-flex;align-items:center;gap:8px}.c-star{color:var(--cui-danger)}\n"] }]
1943
- }], propDecorators: { isRequired: [{
1944
- type: Input
1933
+ class CuiLabelComponent {
1934
+ constructor() {
1935
+ this.isRequired = false;
1936
+ }
1937
+ }
1938
+ CuiLabelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1939
+ CuiLabelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiLabelComponent, selector: "label[cuiLabel]", inputs: { isRequired: "isRequired" }, ngImport: i0, template: "<span class=\"c-wrapper\">\r\n <ng-content></ng-content>\r\n</span>\r\n<span\r\n *ngIf=\"isRequired\"\r\n class=\"c-star\"\r\n>\r\n *\r\n</span>\r\n", styles: [":host{font-weight:500;font-size:14px;line-height:20px;display:inline-flex;gap:2px;width:-moz-fit-content;width:fit-content;color:var(--cui-base-900);font-family:var(--cui-main-font)}.c-wrapper{display:inline-flex;align-items:center;gap:8px}.c-star{color:var(--cui-danger)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1940
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiLabelComponent, decorators: [{
1941
+ type: Component,
1942
+ args: [{ selector: 'label[cuiLabel]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<span class=\"c-wrapper\">\r\n <ng-content></ng-content>\r\n</span>\r\n<span\r\n *ngIf=\"isRequired\"\r\n class=\"c-star\"\r\n>\r\n *\r\n</span>\r\n", styles: [":host{font-weight:500;font-size:14px;line-height:20px;display:inline-flex;gap:2px;width:-moz-fit-content;width:fit-content;color:var(--cui-base-900);font-family:var(--cui-main-font)}.c-wrapper{display:inline-flex;align-items:center;gap:8px}.c-star{color:var(--cui-danger)}\n"] }]
1943
+ }], propDecorators: { isRequired: [{
1944
+ type: Input
1945
1945
  }] } });
1946
1946
 
1947
- class CuiLabelModule {
1948
- }
1949
- CuiLabelModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiLabelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1950
- CuiLabelModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiLabelModule, declarations: [CuiLabelComponent], imports: [CommonModule], exports: [CuiLabelComponent] });
1951
- CuiLabelModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiLabelModule, imports: [CommonModule] });
1952
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiLabelModule, decorators: [{
1953
- type: NgModule,
1954
- args: [{
1955
- imports: [CommonModule],
1956
- declarations: [CuiLabelComponent],
1957
- exports: [CuiLabelComponent]
1958
- }]
1947
+ class CuiLabelModule {
1948
+ }
1949
+ CuiLabelModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiLabelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1950
+ CuiLabelModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiLabelModule, declarations: [CuiLabelComponent], imports: [CommonModule], exports: [CuiLabelComponent] });
1951
+ CuiLabelModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiLabelModule, imports: [CommonModule] });
1952
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiLabelModule, decorators: [{
1953
+ type: NgModule,
1954
+ args: [{
1955
+ imports: [CommonModule],
1956
+ declarations: [CuiLabelComponent],
1957
+ exports: [CuiLabelComponent]
1958
+ }]
1959
1959
  }] });
1960
1960
 
1961
- class CuiRadioComponent {
1962
- }
1963
- CuiRadioComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRadioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1964
- CuiRadioComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiRadioComponent, selector: "input[type=\"radio\"][cuiRadio]", ngImport: i0, template: '', isInline: true, styles: [":host{position:relative;width:16px;height:16px;border:1px solid var(--cui-base-200);border-radius:50%;outline:none;margin:0;appearance:none;cursor:pointer;background:var(--cui-base-0)}:host:before{content:\"\";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:10px;height:10px;border-radius:50%}:host:focus{box-shadow:0 0 0 2px var(--cui-focus)}@media (hover: hover){:host:hover{border-color:var(--cui-base-400)}}:host:active{border-color:var(--cui-base-400);box-shadow:none}:host:checked{border:2px solid var(--cui-info)}:host:checked:before{background:var(--cui-info)}:host:disabled{cursor:not-allowed;border:1px solid var(--cui-base-200);background:var(--cui-base-100)}:host:disabled:checked{border-width:2px}:host:disabled:checked:before{background:var(--cui-base-200)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1965
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRadioComponent, decorators: [{
1966
- type: Component,
1967
- args: [{ selector: 'input[type="radio"][cuiRadio]', template: '', changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{position:relative;width:16px;height:16px;border:1px solid var(--cui-base-200);border-radius:50%;outline:none;margin:0;appearance:none;cursor:pointer;background:var(--cui-base-0)}:host:before{content:\"\";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:10px;height:10px;border-radius:50%}:host:focus{box-shadow:0 0 0 2px var(--cui-focus)}@media (hover: hover){:host:hover{border-color:var(--cui-base-400)}}:host:active{border-color:var(--cui-base-400);box-shadow:none}:host:checked{border:2px solid var(--cui-info)}:host:checked:before{background:var(--cui-info)}:host:disabled{cursor:not-allowed;border:1px solid var(--cui-base-200);background:var(--cui-base-100)}:host:disabled:checked{border-width:2px}:host:disabled:checked:before{background:var(--cui-base-200)}\n"] }]
1961
+ class CuiRadioComponent {
1962
+ }
1963
+ CuiRadioComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRadioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1964
+ CuiRadioComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiRadioComponent, selector: "input[type=\"radio\"][cuiRadio]", ngImport: i0, template: '', isInline: true, styles: [":host{position:relative;width:16px;height:16px;border:1px solid var(--cui-base-200);border-radius:50%;outline:none;margin:0;appearance:none;cursor:pointer;background:var(--cui-base-0)}:host:before{content:\"\";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:10px;height:10px;border-radius:50%}:host:focus{box-shadow:0 0 0 2px var(--cui-focus)}@media (hover: hover){:host:hover{border-color:var(--cui-base-400)}}:host:active{border-color:var(--cui-base-400);box-shadow:none}:host:checked{border:2px solid var(--cui-info)}:host:checked:before{background:var(--cui-info)}:host:disabled{cursor:not-allowed;border:1px solid var(--cui-base-200);background:var(--cui-base-100)}:host:disabled:checked{border-width:2px}:host:disabled:checked:before{background:var(--cui-base-200)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1965
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRadioComponent, decorators: [{
1966
+ type: Component,
1967
+ args: [{ selector: 'input[type="radio"][cuiRadio]', template: '', changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{position:relative;width:16px;height:16px;border:1px solid var(--cui-base-200);border-radius:50%;outline:none;margin:0;appearance:none;cursor:pointer;background:var(--cui-base-0)}:host:before{content:\"\";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:10px;height:10px;border-radius:50%}:host:focus{box-shadow:0 0 0 2px var(--cui-focus)}@media (hover: hover){:host:hover{border-color:var(--cui-base-400)}}:host:active{border-color:var(--cui-base-400);box-shadow:none}:host:checked{border:2px solid var(--cui-info)}:host:checked:before{background:var(--cui-info)}:host:disabled{cursor:not-allowed;border:1px solid var(--cui-base-200);background:var(--cui-base-100)}:host:disabled:checked{border-width:2px}:host:disabled:checked:before{background:var(--cui-base-200)}\n"] }]
1968
1968
  }] });
1969
1969
 
1970
- class CuiRadioModule {
1971
- }
1972
- CuiRadioModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRadioModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1973
- CuiRadioModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiRadioModule, declarations: [CuiRadioComponent], exports: [CuiRadioComponent] });
1974
- CuiRadioModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRadioModule });
1975
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRadioModule, decorators: [{
1976
- type: NgModule,
1977
- args: [{
1978
- declarations: [CuiRadioComponent],
1979
- exports: [CuiRadioComponent]
1980
- }]
1970
+ class CuiRadioModule {
1971
+ }
1972
+ CuiRadioModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRadioModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1973
+ CuiRadioModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiRadioModule, declarations: [CuiRadioComponent], exports: [CuiRadioComponent] });
1974
+ CuiRadioModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRadioModule });
1975
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRadioModule, decorators: [{
1976
+ type: NgModule,
1977
+ args: [{
1978
+ declarations: [CuiRadioComponent],
1979
+ exports: [CuiRadioComponent]
1980
+ }]
1981
1981
  }] });
1982
1982
 
1983
- class CuiSelectComponent {
1984
- constructor() {
1985
- this.element = inject(ElementRef).nativeElement;
1986
- this.document = inject(DOCUMENT);
1987
- this.changeDetectorRef = inject(ChangeDetectorRef);
1988
- this.viewContainerRef = inject(ViewContainerRef);
1989
- this.destroy$ = inject(CuiDestroyService, { self: true });
1990
- this.cuiTextFieldController = inject(CUI_TEXT_FIELD_CONTROLLER);
1991
- this.cuiClickOutsideDirective = inject(CuiClickOutsideDirective, { self: true });
1992
- this.SPACE_BETWEEN_BUTTON_AND_OPTIONS = 3;
1993
- this.isOpened = false;
1994
- this.isOptionsListAbove = false;
1995
- this.gap = `${this.SPACE_BETWEEN_BUTTON_AND_OPTIONS}px`;
1996
- }
1997
- get id() {
1998
- return this.cuiTextFieldController.id;
1999
- }
2000
- get size() {
2001
- return this.cuiTextFieldController.size;
2002
- }
2003
- get placeholder() {
2004
- return this.cuiTextFieldController.placeholder;
2005
- }
2006
- get isError() {
2007
- return this.cuiTextFieldController.isError;
2008
- }
2009
- trackByFn(_, item) {
2010
- return item.label;
2011
- }
2012
- writeValue(value) {
2013
- this.value = value;
2014
- // TODO: Непонятно, зачем нужно в construction вторая часть выражения
2015
- this.selectedOption = this.options.find(option => option.value === value) ?? value;
2016
- this.changeDetectorRef.markForCheck();
2017
- }
2018
- registerOnChange(fn) {
2019
- this.onChange = fn;
2020
- }
2021
- registerOnTouched(fn) {
2022
- this.onTouched = fn;
2023
- }
2024
- ngOnInit() {
2025
- this.initClickOutsideSubscription();
2026
- }
2027
- ngOnDestroy() {
2028
- this.clearViewContainerRef();
2029
- }
2030
- setDisabledState(isDisabled) {
2031
- this.isDisabled = isDisabled;
2032
- this.changeDetectorRef.markForCheck();
2033
- }
2034
- onSelect(event, option) {
2035
- event.stopPropagation();
2036
- if (option.isDisabled) {
2037
- return;
2038
- }
2039
- this.value = option.value;
2040
- this.selectedOption = option;
2041
- this.onChange(this.value);
2042
- this.onSwitch();
2043
- this.onTouched();
2044
- this.changeDetectorRef.markForCheck();
2045
- }
2046
- onSwitch() {
2047
- if (!this.options.length && !this.defaultOptionText) {
2048
- return;
2049
- }
2050
- if (!this.isOpened) {
2051
- this.open();
2052
- return;
2053
- }
2054
- this.close();
2055
- }
2056
- onClose() {
2057
- this.close();
2058
- }
2059
- onWindowResize() {
2060
- this.button.nativeElement.blur();
2061
- this.close();
2062
- }
2063
- initClickOutsideSubscription() {
2064
- this.cuiClickOutsideDirective.cuiClickOutside
2065
- .pipe(takeUntil(this.destroy$))
2066
- .subscribe(() => {
2067
- if (this.isOpened) {
2068
- this.onTouched();
2069
- }
2070
- this.close();
2071
- });
2072
- }
2073
- open() {
2074
- this.isOpened = true;
2075
- const rootElement = this.document.querySelector(CUI_ROOT_SELECTOR);
2076
- const { top: elementRectTop, left: elementRectLeft, bottom: elementRectBottom } = this.element.getBoundingClientRect();
2077
- const distanceToBottom = this.document.documentElement.clientHeight
2078
- - (elementRectBottom + this.SPACE_BETWEEN_BUTTON_AND_OPTIONS);
2079
- const embeddedViewRef = this.viewContainerRef.createEmbeddedView(this.optionsWrapper);
2080
- const node = embeddedViewRef.rootNodes[0];
2081
- const nodeStyles = node.style;
2082
- this.isOptionsListAbove = distanceToBottom < this.getOptionsListHeightContainer.nativeElement.offsetHeight;
2083
- embeddedViewRef.detectChanges();
2084
- nodeStyles.width = this.element.offsetWidth + 'px';
2085
- nodeStyles.left = window.scrollX + elementRectLeft + 'px';
2086
- if (this.isOptionsListAbove) {
2087
- nodeStyles.top = window.scrollY + elementRectTop
2088
- - this.getOptionsListHeightContainer.nativeElement.offsetHeight
2089
- - this.SPACE_BETWEEN_BUTTON_AND_OPTIONS
2090
- + 'px';
2091
- }
2092
- else {
2093
- nodeStyles.top = window.scrollY + elementRectBottom + this.SPACE_BETWEEN_BUTTON_AND_OPTIONS + 'px';
2094
- }
2095
- rootElement.appendChild(this.viewContainerRef.createEmbeddedView(this.backdrop).rootNodes[0]);
2096
- rootElement.appendChild(embeddedViewRef.rootNodes[0]);
2097
- }
2098
- close() {
2099
- this.isOpened = false;
2100
- this.clearViewContainerRef();
2101
- }
2102
- clearViewContainerRef() {
2103
- this.viewContainerRef.clear();
2104
- }
2105
- }
2106
- CuiSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2107
- CuiSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiSelectComponent, selector: "cui-select[options]", inputs: { options: "options", defaultOptionText: "defaultOptionText" }, host: { listeners: { "window:resize": "onWindowResize()" }, properties: { "style.--c-gap": "this.gap" } }, providers: [
2108
- CUI_TEXT_FILED_CONTROLLER_PROVIDER,
2109
- cuiProvide(NG_VALUE_ACCESSOR, CuiSelectComponent, true),
2110
- CuiDestroyService
2111
- ], viewQueries: [{ propertyName: "button", first: true, predicate: ["button"], descendants: true }, { propertyName: "getOptionsListHeightContainer", first: true, predicate: ["getOptionsListHeightContainer"], descendants: true }, { propertyName: "backdrop", first: true, predicate: ["backdrop"], descendants: true }, { propertyName: "optionsWrapper", first: true, predicate: ["optionsWrapper"], descendants: true }], hostDirectives: [{ directive: i1$1.CuiClickOutsideDirective }], ngImport: i0, template: "<button\n #button\n type=\"button\"\n [attr.id]=\"id\"\n [attr.data-size]=\"size\"\n [disabled]=\"isDisabled\"\n class=\"c-button\"\n [class.c-button_active]=\"isOpened\"\n [class.c-button_with-error]=\"isError\"\n (click)=\"onSwitch()\"\n>\n <ng-container *ngIf=\"selectedOption; else placeholderTemplate\">\n {{ selectedOption.label }}\n </ng-container>\n <ng-template #placeholderTemplate>\n <span class=\"c-placeholder\">{{ placeholder }}</span>\n </ng-template>\n <cui-svg\n icon=\"cuiIconChevronDown\"\n color=\"var(--cui-base-500)\"\n />\n</button>\n<ng-template #backdrop>\n <div class=\"c-backdrop\"></div>\n</ng-template>\n<ng-template #optionsWrapper>\n <div\n cuiFocusTrap\n class=\"c-options__wrapper\"\n [class.c-options__wrapper_top]=\"isOptionsListAbove\"\n >\n <ng-container *ngTemplateOutlet=\"optionsList\"/>\n </div>\n</ng-template>\n<div\n #getOptionsListHeightContainer\n class=\"c-get-options-list-height-container\"\n>\n <ng-container *ngTemplateOutlet=\"optionsList\"/>\n</div>\n<ng-template #optionsList>\n <ul\n class=\"c-options\"\n [class.c-options_top]=\"isOptionsListAbove\"\n >\n <ng-container *ngIf=\"options.length; else empty\">\n <li *ngFor=\"let option of options; trackBy: trackByFn\">\n <button\n type=\"button\"\n class=\"c-option-button\"\n [class.c-option-button_selected]=\"selectedOption === option\"\n [disabled]=\"option.isDisabled\"\n (click)=\"onSelect($event, option)\"\n >\n <span>{{ option.label }}</span>\n <cui-svg\n *ngIf=\"selectedOption === option\"\n icon=\"cuiIconCheckSm\"\n color=\"var(--cui-info)\"\n class=\"c-option-button__icon\"\n />\n </button>\n </li>\n </ng-container>\n <ng-template #empty>\n <li *ngIf=\"defaultOptionText\">\n <button\n type=\"button\"\n class=\"c-option-button\"\n (click)=\"onClose()\"\n >\n {{ defaultOptionText }}\n </button>\n </li>\n </ng-template>\n </ul>\n</ng-template>\n", styles: [":host{display:block;font-family:var(--cui-main-font);position:relative}.c-button{border:0;flex-shrink:0;outline:none;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;padding:0 13px;font-weight:400;font-size:14px;line-height:20px;display:flex;justify-content:space-between;align-items:center;gap:8px;width:100%;border:1px solid var(--cui-base-200);border-radius:8px;cursor:pointer;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font);text-align:start}.c-button:hover{border-color:var(--cui-base-300)}.c-button_active.c-button_active,.c-button:focus{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}.c-button:disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}.c-button[data-size=sm]{padding-top:7px;padding-bottom:7px}.c-button[data-size=md]{padding-top:8px;padding-bottom:8px}.c-button_with-error{border-color:var(--cui-danger)}.c-button_with-error:focus{box-shadow:0 0 0 2px #d92d2040;border-color:var(--cui-danger)}.c-placeholder{color:var(--cui-base-400)}.c-backdrop{position:fixed;inset:0}.c-options__wrapper{position:absolute;font-family:var(--cui-main-font);z-index:1}.c-get-options-list-height-container{position:fixed;visibility:hidden}.c-options{padding:7px 0;margin:0;list-style:none;font-weight:400;font-size:14px;line-height:20px;box-shadow:0 1px 4px #0000000a,0 1px 4px #0000000a;overflow:auto;max-height:180px;border:1px solid var(--cui-base-200);border-radius:8px;background:var(--cui-base-0);color:var(--cui-base-900)}.c-option-button{padding:8px 11px 8px 0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;padding:8px 11px;width:100%;display:flex;align-items:center;gap:12px;text-align:start}.c-option-button:active{background:var(--cui-base-50)}@media (hover: hover){.c-option-button:hover{background:var(--cui-base-50)}}.c-option-button_selected{background:var(--cui-base-50)}.c-option-button:disabled{background:unset;opacity:50%}.c-option-button__icon{margin-left:auto}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }, { kind: "directive", type: i1$1.CuiFocusTrapDirective, selector: "[cuiFocusTrap]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2112
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSelectComponent, decorators: [{
2113
- type: Component,
2114
- args: [{ selector: 'cui-select[options]', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
2115
- CUI_TEXT_FILED_CONTROLLER_PROVIDER,
2116
- cuiProvide(NG_VALUE_ACCESSOR, CuiSelectComponent, true),
2117
- CuiDestroyService
2118
- ], hostDirectives: [CuiClickOutsideDirective], template: "<button\n #button\n type=\"button\"\n [attr.id]=\"id\"\n [attr.data-size]=\"size\"\n [disabled]=\"isDisabled\"\n class=\"c-button\"\n [class.c-button_active]=\"isOpened\"\n [class.c-button_with-error]=\"isError\"\n (click)=\"onSwitch()\"\n>\n <ng-container *ngIf=\"selectedOption; else placeholderTemplate\">\n {{ selectedOption.label }}\n </ng-container>\n <ng-template #placeholderTemplate>\n <span class=\"c-placeholder\">{{ placeholder }}</span>\n </ng-template>\n <cui-svg\n icon=\"cuiIconChevronDown\"\n color=\"var(--cui-base-500)\"\n />\n</button>\n<ng-template #backdrop>\n <div class=\"c-backdrop\"></div>\n</ng-template>\n<ng-template #optionsWrapper>\n <div\n cuiFocusTrap\n class=\"c-options__wrapper\"\n [class.c-options__wrapper_top]=\"isOptionsListAbove\"\n >\n <ng-container *ngTemplateOutlet=\"optionsList\"/>\n </div>\n</ng-template>\n<div\n #getOptionsListHeightContainer\n class=\"c-get-options-list-height-container\"\n>\n <ng-container *ngTemplateOutlet=\"optionsList\"/>\n</div>\n<ng-template #optionsList>\n <ul\n class=\"c-options\"\n [class.c-options_top]=\"isOptionsListAbove\"\n >\n <ng-container *ngIf=\"options.length; else empty\">\n <li *ngFor=\"let option of options; trackBy: trackByFn\">\n <button\n type=\"button\"\n class=\"c-option-button\"\n [class.c-option-button_selected]=\"selectedOption === option\"\n [disabled]=\"option.isDisabled\"\n (click)=\"onSelect($event, option)\"\n >\n <span>{{ option.label }}</span>\n <cui-svg\n *ngIf=\"selectedOption === option\"\n icon=\"cuiIconCheckSm\"\n color=\"var(--cui-info)\"\n class=\"c-option-button__icon\"\n />\n </button>\n </li>\n </ng-container>\n <ng-template #empty>\n <li *ngIf=\"defaultOptionText\">\n <button\n type=\"button\"\n class=\"c-option-button\"\n (click)=\"onClose()\"\n >\n {{ defaultOptionText }}\n </button>\n </li>\n </ng-template>\n </ul>\n</ng-template>\n", styles: [":host{display:block;font-family:var(--cui-main-font);position:relative}.c-button{border:0;flex-shrink:0;outline:none;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;padding:0 13px;font-weight:400;font-size:14px;line-height:20px;display:flex;justify-content:space-between;align-items:center;gap:8px;width:100%;border:1px solid var(--cui-base-200);border-radius:8px;cursor:pointer;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font);text-align:start}.c-button:hover{border-color:var(--cui-base-300)}.c-button_active.c-button_active,.c-button:focus{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}.c-button:disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}.c-button[data-size=sm]{padding-top:7px;padding-bottom:7px}.c-button[data-size=md]{padding-top:8px;padding-bottom:8px}.c-button_with-error{border-color:var(--cui-danger)}.c-button_with-error:focus{box-shadow:0 0 0 2px #d92d2040;border-color:var(--cui-danger)}.c-placeholder{color:var(--cui-base-400)}.c-backdrop{position:fixed;inset:0}.c-options__wrapper{position:absolute;font-family:var(--cui-main-font);z-index:1}.c-get-options-list-height-container{position:fixed;visibility:hidden}.c-options{padding:7px 0;margin:0;list-style:none;font-weight:400;font-size:14px;line-height:20px;box-shadow:0 1px 4px #0000000a,0 1px 4px #0000000a;overflow:auto;max-height:180px;border:1px solid var(--cui-base-200);border-radius:8px;background:var(--cui-base-0);color:var(--cui-base-900)}.c-option-button{padding:8px 11px 8px 0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;padding:8px 11px;width:100%;display:flex;align-items:center;gap:12px;text-align:start}.c-option-button:active{background:var(--cui-base-50)}@media (hover: hover){.c-option-button:hover{background:var(--cui-base-50)}}.c-option-button_selected{background:var(--cui-base-50)}.c-option-button:disabled{background:unset;opacity:50%}.c-option-button__icon{margin-left:auto}\n"] }]
2119
- }], propDecorators: { options: [{
2120
- type: Input
2121
- }], defaultOptionText: [{
2122
- type: Input
2123
- }], button: [{
2124
- type: ViewChild,
2125
- args: ['button']
2126
- }], getOptionsListHeightContainer: [{
2127
- type: ViewChild,
2128
- args: ['getOptionsListHeightContainer']
2129
- }], backdrop: [{
2130
- type: ViewChild,
2131
- args: ['backdrop']
2132
- }], optionsWrapper: [{
2133
- type: ViewChild,
2134
- args: ['optionsWrapper']
2135
- }], gap: [{
2136
- type: HostBinding,
2137
- args: ['style.--c-gap']
2138
- }], onWindowResize: [{
2139
- type: HostListener,
2140
- args: ['window:resize']
1983
+ class CuiSelectComponent {
1984
+ constructor() {
1985
+ this.element = inject(ElementRef).nativeElement;
1986
+ this.document = inject(DOCUMENT);
1987
+ this.changeDetectorRef = inject(ChangeDetectorRef);
1988
+ this.viewContainerRef = inject(ViewContainerRef);
1989
+ this.destroy$ = inject(CuiDestroyService, { self: true });
1990
+ this.cuiTextFieldController = inject(CUI_TEXT_FIELD_CONTROLLER);
1991
+ this.cuiClickOutsideDirective = inject(CuiClickOutsideDirective, { self: true });
1992
+ this.SPACE_BETWEEN_BUTTON_AND_OPTIONS = 3;
1993
+ this.isOpened = false;
1994
+ this.isOptionsListAbove = false;
1995
+ this.gap = `${this.SPACE_BETWEEN_BUTTON_AND_OPTIONS}px`;
1996
+ }
1997
+ get id() {
1998
+ return this.cuiTextFieldController.id;
1999
+ }
2000
+ get size() {
2001
+ return this.cuiTextFieldController.size;
2002
+ }
2003
+ get placeholder() {
2004
+ return this.cuiTextFieldController.placeholder;
2005
+ }
2006
+ get isError() {
2007
+ return this.cuiTextFieldController.isError;
2008
+ }
2009
+ trackByFn(_, item) {
2010
+ return item.label;
2011
+ }
2012
+ writeValue(value) {
2013
+ this.value = value;
2014
+ // TODO: Непонятно, зачем нужно в construction вторая часть выражения
2015
+ this.selectedOption = this.options.find(option => option.value === value) ?? value;
2016
+ this.changeDetectorRef.markForCheck();
2017
+ }
2018
+ registerOnChange(fn) {
2019
+ this.onChange = fn;
2020
+ }
2021
+ registerOnTouched(fn) {
2022
+ this.onTouched = fn;
2023
+ }
2024
+ ngOnInit() {
2025
+ this.initClickOutsideSubscription();
2026
+ }
2027
+ ngOnDestroy() {
2028
+ this.clearViewContainerRef();
2029
+ }
2030
+ setDisabledState(isDisabled) {
2031
+ this.isDisabled = isDisabled;
2032
+ this.changeDetectorRef.markForCheck();
2033
+ }
2034
+ onSelect(event, option) {
2035
+ event.stopPropagation();
2036
+ if (option.isDisabled) {
2037
+ return;
2038
+ }
2039
+ this.value = option.value;
2040
+ this.selectedOption = option;
2041
+ this.onChange(this.value);
2042
+ this.onSwitch();
2043
+ this.onTouched();
2044
+ this.changeDetectorRef.markForCheck();
2045
+ }
2046
+ onSwitch() {
2047
+ if (!this.options.length && !this.defaultOptionText) {
2048
+ return;
2049
+ }
2050
+ if (!this.isOpened) {
2051
+ this.open();
2052
+ return;
2053
+ }
2054
+ this.close();
2055
+ }
2056
+ onClose() {
2057
+ this.close();
2058
+ }
2059
+ onWindowResize() {
2060
+ this.button.nativeElement.blur();
2061
+ this.close();
2062
+ }
2063
+ initClickOutsideSubscription() {
2064
+ this.cuiClickOutsideDirective.cuiClickOutside
2065
+ .pipe(takeUntil(this.destroy$))
2066
+ .subscribe(() => {
2067
+ if (this.isOpened) {
2068
+ this.onTouched();
2069
+ }
2070
+ this.close();
2071
+ });
2072
+ }
2073
+ open() {
2074
+ this.isOpened = true;
2075
+ const rootElement = this.document.querySelector(CUI_ROOT_SELECTOR);
2076
+ const { top: elementRectTop, left: elementRectLeft, bottom: elementRectBottom } = this.element.getBoundingClientRect();
2077
+ const distanceToBottom = this.document.documentElement.clientHeight
2078
+ - (elementRectBottom + this.SPACE_BETWEEN_BUTTON_AND_OPTIONS);
2079
+ const embeddedViewRef = this.viewContainerRef.createEmbeddedView(this.optionsWrapper);
2080
+ const node = embeddedViewRef.rootNodes[0];
2081
+ const nodeStyles = node.style;
2082
+ this.isOptionsListAbove = distanceToBottom < this.getOptionsListHeightContainer.nativeElement.offsetHeight;
2083
+ embeddedViewRef.detectChanges();
2084
+ nodeStyles.width = this.element.offsetWidth + 'px';
2085
+ nodeStyles.left = window.scrollX + elementRectLeft + 'px';
2086
+ if (this.isOptionsListAbove) {
2087
+ nodeStyles.top = window.scrollY + elementRectTop
2088
+ - this.getOptionsListHeightContainer.nativeElement.offsetHeight
2089
+ - this.SPACE_BETWEEN_BUTTON_AND_OPTIONS
2090
+ + 'px';
2091
+ }
2092
+ else {
2093
+ nodeStyles.top = window.scrollY + elementRectBottom + this.SPACE_BETWEEN_BUTTON_AND_OPTIONS + 'px';
2094
+ }
2095
+ rootElement.appendChild(this.viewContainerRef.createEmbeddedView(this.backdrop).rootNodes[0]);
2096
+ rootElement.appendChild(embeddedViewRef.rootNodes[0]);
2097
+ }
2098
+ close() {
2099
+ this.isOpened = false;
2100
+ this.clearViewContainerRef();
2101
+ }
2102
+ clearViewContainerRef() {
2103
+ this.viewContainerRef.clear();
2104
+ }
2105
+ }
2106
+ CuiSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2107
+ CuiSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiSelectComponent, selector: "cui-select[options]", inputs: { options: "options", defaultOptionText: "defaultOptionText" }, host: { listeners: { "window:resize": "onWindowResize()" }, properties: { "style.--c-gap": "this.gap" } }, providers: [
2108
+ CUI_TEXT_FILED_CONTROLLER_PROVIDER,
2109
+ cuiProvide(NG_VALUE_ACCESSOR, CuiSelectComponent, true),
2110
+ CuiDestroyService
2111
+ ], viewQueries: [{ propertyName: "button", first: true, predicate: ["button"], descendants: true }, { propertyName: "getOptionsListHeightContainer", first: true, predicate: ["getOptionsListHeightContainer"], descendants: true }, { propertyName: "backdrop", first: true, predicate: ["backdrop"], descendants: true }, { propertyName: "optionsWrapper", first: true, predicate: ["optionsWrapper"], descendants: true }], hostDirectives: [{ directive: i1$1.CuiClickOutsideDirective }], ngImport: i0, template: "<button\r\n #button\r\n type=\"button\"\r\n [attr.id]=\"id\"\r\n [attr.data-size]=\"size\"\r\n [disabled]=\"isDisabled\"\r\n class=\"c-button\"\r\n [class.c-button_active]=\"isOpened\"\r\n [class.c-button_with-error]=\"isError\"\r\n (click)=\"onSwitch()\"\r\n>\r\n <ng-container *ngIf=\"selectedOption; else placeholderTemplate\">\r\n {{ selectedOption.label }}\r\n </ng-container>\r\n <ng-template #placeholderTemplate>\r\n <span class=\"c-placeholder\">{{ placeholder }}</span>\r\n </ng-template>\r\n <cui-svg\r\n icon=\"cuiIconChevronDown\"\r\n color=\"var(--cui-base-500)\"\r\n />\r\n</button>\r\n<ng-template #backdrop>\r\n <div class=\"c-backdrop\"></div>\r\n</ng-template>\r\n<ng-template #optionsWrapper>\r\n <div\r\n cuiFocusTrap\r\n class=\"c-options__wrapper\"\r\n [class.c-options__wrapper_top]=\"isOptionsListAbove\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"optionsList\"/>\r\n </div>\r\n</ng-template>\r\n<div\r\n #getOptionsListHeightContainer\r\n class=\"c-get-options-list-height-container\"\r\n>\r\n <ng-container *ngTemplateOutlet=\"optionsList\"/>\r\n</div>\r\n<ng-template #optionsList>\r\n <ul\r\n class=\"c-options\"\r\n [class.c-options_top]=\"isOptionsListAbove\"\r\n >\r\n <ng-container *ngIf=\"options.length; else empty\">\r\n <li *ngFor=\"let option of options; trackBy: trackByFn\">\r\n <button\r\n type=\"button\"\r\n class=\"c-option-button\"\r\n [class.c-option-button_selected]=\"selectedOption === option\"\r\n [disabled]=\"option.isDisabled\"\r\n (click)=\"onSelect($event, option)\"\r\n >\r\n <span>{{ option.label }}</span>\r\n <cui-svg\r\n *ngIf=\"selectedOption === option\"\r\n icon=\"cuiIconCheckSm\"\r\n color=\"var(--cui-info)\"\r\n class=\"c-option-button__icon\"\r\n />\r\n </button>\r\n </li>\r\n </ng-container>\r\n <ng-template #empty>\r\n <li *ngIf=\"defaultOptionText\">\r\n <button\r\n type=\"button\"\r\n class=\"c-option-button\"\r\n (click)=\"onClose()\"\r\n >\r\n {{ defaultOptionText }}\r\n </button>\r\n </li>\r\n </ng-template>\r\n </ul>\r\n</ng-template>\r\n", styles: [":host{display:block;font-family:var(--cui-main-font);position:relative}.c-button{border:0;flex-shrink:0;outline:none;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;padding:0 13px;font-weight:400;font-size:14px;line-height:20px;display:flex;justify-content:space-between;align-items:center;gap:8px;width:100%;border:1px solid var(--cui-base-200);border-radius:8px;cursor:pointer;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font);text-align:start}.c-button:hover{border-color:var(--cui-base-300)}.c-button_active.c-button_active,.c-button:focus{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}.c-button:disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}.c-button[data-size=sm]{padding-top:7px;padding-bottom:7px}.c-button[data-size=md]{padding-top:8px;padding-bottom:8px}.c-button_with-error{border-color:var(--cui-danger)}.c-button_with-error:focus{box-shadow:0 0 0 2px #d92d2040;border-color:var(--cui-danger)}.c-placeholder{color:var(--cui-base-400)}.c-backdrop{position:fixed;inset:0}.c-options__wrapper{position:absolute;font-family:var(--cui-main-font);z-index:1}.c-get-options-list-height-container{position:fixed;visibility:hidden}.c-options{padding:7px 0;margin:0;list-style:none;font-weight:400;font-size:14px;line-height:20px;box-shadow:0 1px 4px #0000000a,0 1px 4px #0000000a;overflow:auto;max-height:180px;border:1px solid var(--cui-base-200);border-radius:8px;background:var(--cui-base-0);color:var(--cui-base-900)}.c-option-button{padding:8px 11px 8px 0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;padding:8px 11px;width:100%;display:flex;align-items:center;gap:12px;text-align:start}.c-option-button:active{background:var(--cui-base-50)}@media (hover: hover){.c-option-button:hover{background:var(--cui-base-50)}}.c-option-button_selected{background:var(--cui-base-50)}.c-option-button:disabled{background:unset;opacity:50%}.c-option-button__icon{margin-left:auto}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }, { kind: "directive", type: i1$1.CuiFocusTrapDirective, selector: "[cuiFocusTrap]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2112
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSelectComponent, decorators: [{
2113
+ type: Component,
2114
+ args: [{ selector: 'cui-select[options]', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
2115
+ CUI_TEXT_FILED_CONTROLLER_PROVIDER,
2116
+ cuiProvide(NG_VALUE_ACCESSOR, CuiSelectComponent, true),
2117
+ CuiDestroyService
2118
+ ], hostDirectives: [CuiClickOutsideDirective], template: "<button\r\n #button\r\n type=\"button\"\r\n [attr.id]=\"id\"\r\n [attr.data-size]=\"size\"\r\n [disabled]=\"isDisabled\"\r\n class=\"c-button\"\r\n [class.c-button_active]=\"isOpened\"\r\n [class.c-button_with-error]=\"isError\"\r\n (click)=\"onSwitch()\"\r\n>\r\n <ng-container *ngIf=\"selectedOption; else placeholderTemplate\">\r\n {{ selectedOption.label }}\r\n </ng-container>\r\n <ng-template #placeholderTemplate>\r\n <span class=\"c-placeholder\">{{ placeholder }}</span>\r\n </ng-template>\r\n <cui-svg\r\n icon=\"cuiIconChevronDown\"\r\n color=\"var(--cui-base-500)\"\r\n />\r\n</button>\r\n<ng-template #backdrop>\r\n <div class=\"c-backdrop\"></div>\r\n</ng-template>\r\n<ng-template #optionsWrapper>\r\n <div\r\n cuiFocusTrap\r\n class=\"c-options__wrapper\"\r\n [class.c-options__wrapper_top]=\"isOptionsListAbove\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"optionsList\"/>\r\n </div>\r\n</ng-template>\r\n<div\r\n #getOptionsListHeightContainer\r\n class=\"c-get-options-list-height-container\"\r\n>\r\n <ng-container *ngTemplateOutlet=\"optionsList\"/>\r\n</div>\r\n<ng-template #optionsList>\r\n <ul\r\n class=\"c-options\"\r\n [class.c-options_top]=\"isOptionsListAbove\"\r\n >\r\n <ng-container *ngIf=\"options.length; else empty\">\r\n <li *ngFor=\"let option of options; trackBy: trackByFn\">\r\n <button\r\n type=\"button\"\r\n class=\"c-option-button\"\r\n [class.c-option-button_selected]=\"selectedOption === option\"\r\n [disabled]=\"option.isDisabled\"\r\n (click)=\"onSelect($event, option)\"\r\n >\r\n <span>{{ option.label }}</span>\r\n <cui-svg\r\n *ngIf=\"selectedOption === option\"\r\n icon=\"cuiIconCheckSm\"\r\n color=\"var(--cui-info)\"\r\n class=\"c-option-button__icon\"\r\n />\r\n </button>\r\n </li>\r\n </ng-container>\r\n <ng-template #empty>\r\n <li *ngIf=\"defaultOptionText\">\r\n <button\r\n type=\"button\"\r\n class=\"c-option-button\"\r\n (click)=\"onClose()\"\r\n >\r\n {{ defaultOptionText }}\r\n </button>\r\n </li>\r\n </ng-template>\r\n </ul>\r\n</ng-template>\r\n", styles: [":host{display:block;font-family:var(--cui-main-font);position:relative}.c-button{border:0;flex-shrink:0;outline:none;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;padding:0 13px;font-weight:400;font-size:14px;line-height:20px;display:flex;justify-content:space-between;align-items:center;gap:8px;width:100%;border:1px solid var(--cui-base-200);border-radius:8px;cursor:pointer;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font);text-align:start}.c-button:hover{border-color:var(--cui-base-300)}.c-button_active.c-button_active,.c-button:focus{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}.c-button:disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}.c-button[data-size=sm]{padding-top:7px;padding-bottom:7px}.c-button[data-size=md]{padding-top:8px;padding-bottom:8px}.c-button_with-error{border-color:var(--cui-danger)}.c-button_with-error:focus{box-shadow:0 0 0 2px #d92d2040;border-color:var(--cui-danger)}.c-placeholder{color:var(--cui-base-400)}.c-backdrop{position:fixed;inset:0}.c-options__wrapper{position:absolute;font-family:var(--cui-main-font);z-index:1}.c-get-options-list-height-container{position:fixed;visibility:hidden}.c-options{padding:7px 0;margin:0;list-style:none;font-weight:400;font-size:14px;line-height:20px;box-shadow:0 1px 4px #0000000a,0 1px 4px #0000000a;overflow:auto;max-height:180px;border:1px solid var(--cui-base-200);border-radius:8px;background:var(--cui-base-0);color:var(--cui-base-900)}.c-option-button{padding:8px 11px 8px 0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;padding:8px 11px;width:100%;display:flex;align-items:center;gap:12px;text-align:start}.c-option-button:active{background:var(--cui-base-50)}@media (hover: hover){.c-option-button:hover{background:var(--cui-base-50)}}.c-option-button_selected{background:var(--cui-base-50)}.c-option-button:disabled{background:unset;opacity:50%}.c-option-button__icon{margin-left:auto}\n"] }]
2119
+ }], propDecorators: { options: [{
2120
+ type: Input
2121
+ }], defaultOptionText: [{
2122
+ type: Input
2123
+ }], button: [{
2124
+ type: ViewChild,
2125
+ args: ['button']
2126
+ }], getOptionsListHeightContainer: [{
2127
+ type: ViewChild,
2128
+ args: ['getOptionsListHeightContainer']
2129
+ }], backdrop: [{
2130
+ type: ViewChild,
2131
+ args: ['backdrop']
2132
+ }], optionsWrapper: [{
2133
+ type: ViewChild,
2134
+ args: ['optionsWrapper']
2135
+ }], gap: [{
2136
+ type: HostBinding,
2137
+ args: ['style.--c-gap']
2138
+ }], onWindowResize: [{
2139
+ type: HostListener,
2140
+ args: ['window:resize']
2141
2141
  }] } });
2142
2142
 
2143
- class CuiSelectModule {
2144
- }
2145
- CuiSelectModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2146
- CuiSelectModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiSelectModule, declarations: [CuiSelectComponent], imports: [CommonModule,
2147
- CuiSvgModule,
2148
- CuiFocusTrapDirective], exports: [CuiSelectComponent,
2149
- CuiTextFieldControllerModule] });
2150
- CuiSelectModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSelectModule, imports: [CommonModule,
2151
- CuiSvgModule, CuiTextFieldControllerModule] });
2152
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSelectModule, decorators: [{
2153
- type: NgModule,
2154
- args: [{
2155
- imports: [
2156
- CommonModule,
2157
- CuiSvgModule,
2158
- CuiFocusTrapDirective
2159
- ],
2160
- declarations: [CuiSelectComponent],
2161
- exports: [
2162
- CuiSelectComponent,
2163
- CuiTextFieldControllerModule
2164
- ]
2165
- }]
2143
+ class CuiSelectModule {
2144
+ }
2145
+ CuiSelectModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2146
+ CuiSelectModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiSelectModule, declarations: [CuiSelectComponent], imports: [CommonModule,
2147
+ CuiSvgModule,
2148
+ CuiFocusTrapDirective], exports: [CuiSelectComponent,
2149
+ CuiTextFieldControllerModule] });
2150
+ CuiSelectModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSelectModule, imports: [CommonModule,
2151
+ CuiSvgModule, CuiTextFieldControllerModule] });
2152
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSelectModule, decorators: [{
2153
+ type: NgModule,
2154
+ args: [{
2155
+ imports: [
2156
+ CommonModule,
2157
+ CuiSvgModule,
2158
+ CuiFocusTrapDirective
2159
+ ],
2160
+ declarations: [CuiSelectComponent],
2161
+ exports: [
2162
+ CuiSelectComponent,
2163
+ CuiTextFieldControllerModule
2164
+ ]
2165
+ }]
2166
2166
  }] });
2167
2167
 
2168
- const CUI_TAB_ACTIVATE = 'cui-tab-activate';
2169
- class CuiTabComponent {
2170
- constructor() {
2171
- this.element = inject(ElementRef).nativeElement;
2172
- }
2173
- onClick() {
2174
- this.element.dispatchEvent(new CustomEvent(CUI_TAB_ACTIVATE, { bubbles: true }));
2175
- }
2176
- }
2177
- CuiTabComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2178
- CuiTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiTabComponent, selector: "button[cuiTab]", host: { listeners: { "click": "onClick()" } }, ngImport: i0, template: "<ng-content />\n", styles: [":host{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;font-family:var(--cui-main-font)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2179
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabComponent, decorators: [{
2180
- type: Component,
2181
- args: [{ selector: 'button[cuiTab]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content />\n", styles: [":host{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;font-family:var(--cui-main-font)}\n"] }]
2182
- }], propDecorators: { onClick: [{
2183
- type: HostListener,
2184
- args: ['click']
2168
+ const CUI_TAB_ACTIVATE = 'cui-tab-activate';
2169
+ class CuiTabComponent {
2170
+ constructor() {
2171
+ this.element = inject(ElementRef).nativeElement;
2172
+ }
2173
+ onClick() {
2174
+ this.element.dispatchEvent(new CustomEvent(CUI_TAB_ACTIVATE, { bubbles: true }));
2175
+ }
2176
+ }
2177
+ CuiTabComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2178
+ CuiTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiTabComponent, selector: "button[cuiTab]", host: { listeners: { "click": "onClick()" } }, ngImport: i0, template: "<ng-content />\r\n", styles: [":host{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;font-family:var(--cui-main-font)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2179
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabComponent, decorators: [{
2180
+ type: Component,
2181
+ args: [{ selector: 'button[cuiTab]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content />\r\n", styles: [":host{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;font-family:var(--cui-main-font)}\n"] }]
2182
+ }], propDecorators: { onClick: [{
2183
+ type: HostListener,
2184
+ args: ['click']
2185
2185
  }] } });
2186
2186
 
2187
- class CuiTabsComponent {
2188
- constructor() {
2189
- this.element = inject(ElementRef).nativeElement;
2190
- this.activeElementClass = '_active';
2191
- this.activeItemIndex = 0;
2192
- this.activeItemIndexChange = new EventEmitter();
2193
- }
2194
- get tabs() {
2195
- return Array.from(this.element.querySelectorAll('[cuiTab]'));
2196
- }
2197
- get activeElement() {
2198
- return this.tabs[this.activeItemIndex] || null;
2199
- }
2200
- ngAfterViewChecked() {
2201
- this.changeActiveItem();
2202
- }
2203
- onActivate(event) {
2204
- event.stopPropagation();
2205
- const index = this.tabs.findIndex((tab) => tab === event.target);
2206
- if (index === this.activeItemIndex) {
2207
- return;
2208
- }
2209
- this.activeItemIndexChange.emit(index);
2210
- this.activeItemIndex = index;
2211
- }
2212
- changeActiveItem() {
2213
- this.tabs.forEach(nativeElement => {
2214
- const active = nativeElement === this.activeElement;
2215
- nativeElement.classList.toggle(this.activeElementClass, active);
2216
- });
2217
- }
2218
- }
2219
- CuiTabsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2220
- CuiTabsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiTabsComponent, selector: "cui-tabs", inputs: { activeItemIndex: "activeItemIndex" }, outputs: { activeItemIndexChange: "activeItemIndexChange" }, host: { listeners: { "cui-tab-activate": "onActivate($event)" } }, ngImport: i0, template: "<ng-content select=\"[cuiTab]\" />\n", styles: [":host{display:flex;border-radius:8px;gap:32px}:host ::ng-deep>[cuiTab]{padding:8px 12px;font-weight:500;font-size:14px;line-height:20px;color:var(--cui-base-500);border-radius:6px}@media (hover: hover){:host ::ng-deep>[cuiTab]:hover{color:var(--cui-base-900);background:var(--cui-base-50)}}:host ::ng-deep>[cuiTab]:active{color:var(--cui-base-900);background:var(--cui-base-50)}:host ::ng-deep>[cuiTab]._active{color:var(--cui-light-blue-600);background:var(--cui-base-50)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2221
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabsComponent, decorators: [{
2222
- type: Component,
2223
- args: [{ selector: 'cui-tabs', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content select=\"[cuiTab]\" />\n", styles: [":host{display:flex;border-radius:8px;gap:32px}:host ::ng-deep>[cuiTab]{padding:8px 12px;font-weight:500;font-size:14px;line-height:20px;color:var(--cui-base-500);border-radius:6px}@media (hover: hover){:host ::ng-deep>[cuiTab]:hover{color:var(--cui-base-900);background:var(--cui-base-50)}}:host ::ng-deep>[cuiTab]:active{color:var(--cui-base-900);background:var(--cui-base-50)}:host ::ng-deep>[cuiTab]._active{color:var(--cui-light-blue-600);background:var(--cui-base-50)}\n"] }]
2224
- }], propDecorators: { activeItemIndex: [{
2225
- type: Input
2226
- }], activeItemIndexChange: [{
2227
- type: Output
2228
- }], onActivate: [{
2229
- type: HostListener,
2230
- args: [CUI_TAB_ACTIVATE, ['$event']]
2187
+ class CuiTabsComponent {
2188
+ constructor() {
2189
+ this.element = inject(ElementRef).nativeElement;
2190
+ this.activeElementClass = '_active';
2191
+ this.activeItemIndex = 0;
2192
+ this.activeItemIndexChange = new EventEmitter();
2193
+ }
2194
+ get tabs() {
2195
+ return Array.from(this.element.querySelectorAll('[cuiTab]'));
2196
+ }
2197
+ get activeElement() {
2198
+ return this.tabs[this.activeItemIndex] || null;
2199
+ }
2200
+ ngAfterViewChecked() {
2201
+ this.changeActiveItem();
2202
+ }
2203
+ onActivate(event) {
2204
+ event.stopPropagation();
2205
+ const index = this.tabs.findIndex((tab) => tab === event.target);
2206
+ if (index === this.activeItemIndex) {
2207
+ return;
2208
+ }
2209
+ this.activeItemIndexChange.emit(index);
2210
+ this.activeItemIndex = index;
2211
+ }
2212
+ changeActiveItem() {
2213
+ this.tabs.forEach(nativeElement => {
2214
+ const active = nativeElement === this.activeElement;
2215
+ nativeElement.classList.toggle(this.activeElementClass, active);
2216
+ });
2217
+ }
2218
+ }
2219
+ CuiTabsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2220
+ CuiTabsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiTabsComponent, selector: "cui-tabs", inputs: { activeItemIndex: "activeItemIndex" }, outputs: { activeItemIndexChange: "activeItemIndexChange" }, host: { listeners: { "cui-tab-activate": "onActivate($event)" } }, ngImport: i0, template: "<ng-content select=\"[cuiTab]\" />\r\n", styles: [":host{display:flex;border-radius:8px;gap:32px}:host ::ng-deep>[cuiTab]{padding:8px 12px;font-weight:500;font-size:14px;line-height:20px;color:var(--cui-base-500);border-radius:6px}@media (hover: hover){:host ::ng-deep>[cuiTab]:hover{color:var(--cui-base-900);background:var(--cui-base-50)}}:host ::ng-deep>[cuiTab]:active{color:var(--cui-base-900);background:var(--cui-base-50)}:host ::ng-deep>[cuiTab]._active{color:var(--cui-light-blue-600);background:var(--cui-base-50)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2221
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabsComponent, decorators: [{
2222
+ type: Component,
2223
+ args: [{ selector: 'cui-tabs', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content select=\"[cuiTab]\" />\r\n", styles: [":host{display:flex;border-radius:8px;gap:32px}:host ::ng-deep>[cuiTab]{padding:8px 12px;font-weight:500;font-size:14px;line-height:20px;color:var(--cui-base-500);border-radius:6px}@media (hover: hover){:host ::ng-deep>[cuiTab]:hover{color:var(--cui-base-900);background:var(--cui-base-50)}}:host ::ng-deep>[cuiTab]:active{color:var(--cui-base-900);background:var(--cui-base-50)}:host ::ng-deep>[cuiTab]._active{color:var(--cui-light-blue-600);background:var(--cui-base-50)}\n"] }]
2224
+ }], propDecorators: { activeItemIndex: [{
2225
+ type: Input
2226
+ }], activeItemIndexChange: [{
2227
+ type: Output
2228
+ }], onActivate: [{
2229
+ type: HostListener,
2230
+ args: [CUI_TAB_ACTIVATE, ['$event']]
2231
2231
  }] } });
2232
2232
 
2233
- class CuiTabsModule {
2234
- }
2235
- CuiTabsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2236
- CuiTabsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiTabsModule, declarations: [CuiTabsComponent, CuiTabComponent], exports: [CuiTabsComponent, CuiTabComponent] });
2237
- CuiTabsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabsModule });
2238
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabsModule, decorators: [{
2239
- type: NgModule,
2240
- args: [{
2241
- imports: [],
2242
- declarations: [CuiTabsComponent, CuiTabComponent],
2243
- exports: [CuiTabsComponent, CuiTabComponent]
2244
- }]
2233
+ class CuiTabsModule {
2234
+ }
2235
+ CuiTabsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2236
+ CuiTabsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiTabsModule, declarations: [CuiTabsComponent, CuiTabComponent], exports: [CuiTabsComponent, CuiTabComponent] });
2237
+ CuiTabsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabsModule });
2238
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabsModule, decorators: [{
2239
+ type: NgModule,
2240
+ args: [{
2241
+ imports: [],
2242
+ declarations: [CuiTabsComponent, CuiTabComponent],
2243
+ exports: [CuiTabsComponent, CuiTabComponent]
2244
+ }]
2245
2245
  }] });
2246
2246
 
2247
- class CuiTextareaComponent {
2248
- constructor() {
2249
- this.cuiTextFieldController = inject(CUI_TEXT_FIELD_CONTROLLER);
2250
- this.rows = 4;
2251
- this.noBordersAndPaddings = false;
2252
- }
2253
- get isError() {
2254
- return this.cuiTextFieldController.isError;
2255
- }
2256
- }
2257
- CuiTextareaComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2258
- CuiTextareaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiTextareaComponent, selector: "textarea[cuiTextarea]", inputs: { rows: "rows", noBordersAndPaddings: "noBordersAndPaddings" }, host: { properties: { "rows": "this.rows", "class._no-borders-and-paddings": "this.noBordersAndPaddings", "class._with-error": "this.isError" } }, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER], hostDirectives: [{ directive: i1$1.CuiAutoResizingDirective }], ngImport: i0, template: '', isInline: true, styles: [":host{padding:11px 13px 11px 0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;color:inherit;font:inherit;line-height:inherit;padding:11px 13px;font-weight:400;font-size:14px;line-height:20px;box-sizing:border-box;max-height:320px;width:100%;border:1px solid var(--cui-base-200);border-radius:8px;resize:none;background:none;color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus,:host:focus-visible{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host:disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host::placeholder{color:var(--cui-base-400)}:host._no-borders-and-paddings{border:none;border-radius:0;padding:0;box-shadow:none}:host._no-borders-and-paddings:disabled{background:none}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus{box-shadow:0 0 0 2px #d92d2040}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2259
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextareaComponent, decorators: [{
2260
- type: Component,
2261
- args: [{ selector: 'textarea[cuiTextarea]', template: '', changeDetection: ChangeDetectionStrategy.OnPush, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER], hostDirectives: [CuiAutoResizingDirective], styles: [":host{padding:11px 13px 11px 0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;color:inherit;font:inherit;line-height:inherit;padding:11px 13px;font-weight:400;font-size:14px;line-height:20px;box-sizing:border-box;max-height:320px;width:100%;border:1px solid var(--cui-base-200);border-radius:8px;resize:none;background:none;color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus,:host:focus-visible{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host:disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host::placeholder{color:var(--cui-base-400)}:host._no-borders-and-paddings{border:none;border-radius:0;padding:0;box-shadow:none}:host._no-borders-and-paddings:disabled{background:none}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus{box-shadow:0 0 0 2px #d92d2040}\n"] }]
2262
- }], propDecorators: { rows: [{
2263
- type: Input
2264
- }, {
2265
- type: HostBinding,
2266
- args: ['rows']
2267
- }], noBordersAndPaddings: [{
2268
- type: Input
2269
- }, {
2270
- type: HostBinding,
2271
- args: ['class._no-borders-and-paddings']
2272
- }], isError: [{
2273
- type: HostBinding,
2274
- args: ['class._with-error']
2247
+ class CuiTextareaComponent {
2248
+ constructor() {
2249
+ this.cuiTextFieldController = inject(CUI_TEXT_FIELD_CONTROLLER);
2250
+ this.rows = 4;
2251
+ this.noBordersAndPaddings = false;
2252
+ }
2253
+ get isError() {
2254
+ return this.cuiTextFieldController.isError;
2255
+ }
2256
+ }
2257
+ CuiTextareaComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2258
+ CuiTextareaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiTextareaComponent, selector: "textarea[cuiTextarea]", inputs: { rows: "rows", noBordersAndPaddings: "noBordersAndPaddings" }, host: { properties: { "rows": "this.rows", "class._no-borders-and-paddings": "this.noBordersAndPaddings", "class._with-error": "this.isError" } }, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER], hostDirectives: [{ directive: i1$1.CuiAutoResizingDirective }], ngImport: i0, template: '', isInline: true, styles: [":host{padding:11px 13px 11px 0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;color:inherit;font:inherit;line-height:inherit;padding:11px 13px;font-weight:400;font-size:14px;line-height:20px;box-sizing:border-box;max-height:320px;width:100%;border:1px solid var(--cui-base-200);border-radius:8px;resize:none;background:none;color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus,:host:focus-visible{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host:disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host::placeholder{color:var(--cui-base-400)}:host._no-borders-and-paddings{border:none;border-radius:0;padding:0;box-shadow:none}:host._no-borders-and-paddings:disabled{background:none}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus{box-shadow:0 0 0 2px #d92d2040}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2259
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextareaComponent, decorators: [{
2260
+ type: Component,
2261
+ args: [{ selector: 'textarea[cuiTextarea]', template: '', changeDetection: ChangeDetectionStrategy.OnPush, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER], hostDirectives: [CuiAutoResizingDirective], styles: [":host{padding:11px 13px 11px 0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;color:inherit;font:inherit;line-height:inherit;padding:11px 13px;font-weight:400;font-size:14px;line-height:20px;box-sizing:border-box;max-height:320px;width:100%;border:1px solid var(--cui-base-200);border-radius:8px;resize:none;background:none;color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus,:host:focus-visible{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host:disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host::placeholder{color:var(--cui-base-400)}:host._no-borders-and-paddings{border:none;border-radius:0;padding:0;box-shadow:none}:host._no-borders-and-paddings:disabled{background:none}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus{box-shadow:0 0 0 2px #d92d2040}\n"] }]
2262
+ }], propDecorators: { rows: [{
2263
+ type: Input
2264
+ }, {
2265
+ type: HostBinding,
2266
+ args: ['rows']
2267
+ }], noBordersAndPaddings: [{
2268
+ type: Input
2269
+ }, {
2270
+ type: HostBinding,
2271
+ args: ['class._no-borders-and-paddings']
2272
+ }], isError: [{
2273
+ type: HostBinding,
2274
+ args: ['class._with-error']
2275
2275
  }] } });
2276
2276
 
2277
- class CuiTextareaModule {
2278
- }
2279
- CuiTextareaModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextareaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2280
- CuiTextareaModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiTextareaModule, declarations: [CuiTextareaComponent], exports: [CuiTextareaComponent] });
2281
- CuiTextareaModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextareaModule });
2282
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextareaModule, decorators: [{
2283
- type: NgModule,
2284
- args: [{
2285
- declarations: [CuiTextareaComponent],
2286
- exports: [CuiTextareaComponent]
2287
- }]
2277
+ class CuiTextareaModule {
2278
+ }
2279
+ CuiTextareaModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextareaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2280
+ CuiTextareaModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiTextareaModule, declarations: [CuiTextareaComponent], exports: [CuiTextareaComponent] });
2281
+ CuiTextareaModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextareaModule });
2282
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextareaModule, decorators: [{
2283
+ type: NgModule,
2284
+ args: [{
2285
+ declarations: [CuiTextareaComponent],
2286
+ exports: [CuiTextareaComponent]
2287
+ }]
2288
2288
  }] });
2289
2289
 
2290
- class CuiToggleComponent {
2291
- }
2292
- CuiToggleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2293
- CuiToggleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiToggleComponent, selector: "input[type=\"checkbox\"][cuiToggle]", ngImport: i0, template: '', isInline: true, styles: [":host{position:relative;width:30px;height:18px;border-radius:9px;margin:0;appearance:none;cursor:pointer;background:var(--cui-base-300);transition:background .5s ease}:host:before{content:\"\";position:absolute;top:50%;left:2px;transform:translateY(-50%);width:14px;height:14px;border-radius:50%;background:var(--cui-gray-0);transition:left .5s ease}:host:checked{background:var(--cui-info);transition:background .5s ease}:host:checked:before{left:14px;transition:left .5s ease}:host:disabled{cursor:not-allowed;background:var(--cui-base-300)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2294
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiToggleComponent, decorators: [{
2295
- type: Component,
2296
- args: [{ selector: 'input[type="checkbox"][cuiToggle]', template: '', changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{position:relative;width:30px;height:18px;border-radius:9px;margin:0;appearance:none;cursor:pointer;background:var(--cui-base-300);transition:background .5s ease}:host:before{content:\"\";position:absolute;top:50%;left:2px;transform:translateY(-50%);width:14px;height:14px;border-radius:50%;background:var(--cui-gray-0);transition:left .5s ease}:host:checked{background:var(--cui-info);transition:background .5s ease}:host:checked:before{left:14px;transition:left .5s ease}:host:disabled{cursor:not-allowed;background:var(--cui-base-300)}\n"] }]
2290
+ class CuiToggleComponent {
2291
+ }
2292
+ CuiToggleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2293
+ CuiToggleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiToggleComponent, selector: "input[type=\"checkbox\"][cuiToggle]", ngImport: i0, template: '', isInline: true, styles: [":host{position:relative;width:30px;height:18px;border-radius:9px;margin:0;appearance:none;cursor:pointer;background:var(--cui-base-300);transition:background .5s ease}:host:before{content:\"\";position:absolute;top:50%;left:2px;transform:translateY(-50%);width:14px;height:14px;border-radius:50%;background:var(--cui-gray-0);transition:left .5s ease}:host:checked{background:var(--cui-info);transition:background .5s ease}:host:checked:before{left:14px;transition:left .5s ease}:host:disabled{cursor:not-allowed;background:var(--cui-base-300)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2294
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiToggleComponent, decorators: [{
2295
+ type: Component,
2296
+ args: [{ selector: 'input[type="checkbox"][cuiToggle]', template: '', changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{position:relative;width:30px;height:18px;border-radius:9px;margin:0;appearance:none;cursor:pointer;background:var(--cui-base-300);transition:background .5s ease}:host:before{content:\"\";position:absolute;top:50%;left:2px;transform:translateY(-50%);width:14px;height:14px;border-radius:50%;background:var(--cui-gray-0);transition:left .5s ease}:host:checked{background:var(--cui-info);transition:background .5s ease}:host:checked:before{left:14px;transition:left .5s ease}:host:disabled{cursor:not-allowed;background:var(--cui-base-300)}\n"] }]
2297
2297
  }] });
2298
2298
 
2299
- class CuiToggleModule {
2300
- }
2301
- CuiToggleModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiToggleModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2302
- CuiToggleModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiToggleModule, declarations: [CuiToggleComponent], exports: [CuiToggleComponent] });
2303
- CuiToggleModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiToggleModule });
2304
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiToggleModule, decorators: [{
2305
- type: NgModule,
2306
- args: [{
2307
- declarations: [CuiToggleComponent],
2308
- exports: [CuiToggleComponent]
2309
- }]
2299
+ class CuiToggleModule {
2300
+ }
2301
+ CuiToggleModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiToggleModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2302
+ CuiToggleModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiToggleModule, declarations: [CuiToggleComponent], exports: [CuiToggleComponent] });
2303
+ CuiToggleModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiToggleModule });
2304
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiToggleModule, decorators: [{
2305
+ type: NgModule,
2306
+ args: [{
2307
+ declarations: [CuiToggleComponent],
2308
+ exports: [CuiToggleComponent]
2309
+ }]
2310
2310
  }] });
2311
2311
 
2312
- function cuiRemoveSpaces(value) {
2313
- return value.replace(/\s+/g, '');
2312
+ function cuiRemoveSpaces(value) {
2313
+ return value.replace(/\s+/g, '');
2314
2314
  }
2315
2315
 
2316
- function cuiReplace(value, search, replace) {
2317
- const regex = new RegExp(search.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'), 'g');
2318
- return value.replace(regex, replace);
2316
+ function cuiReplace(value, search, replace) {
2317
+ const regex = new RegExp(search.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'), 'g');
2318
+ return value.replace(regex, replace);
2319
2319
  }
2320
2320
 
2321
- /**
2322
- * Generated bundle index. Do not edit.
2321
+ /**
2322
+ * Generated bundle index. Do not edit.
2323
2323
  */
2324
2324
 
2325
2325
  export { CUI_ALERTS, CUI_ALERT_CONTEXT, CUI_ALERT_DEFAULT_OPTIONS, CUI_ALERT_OPTIONS, CUI_BANNER_DEFAULT_OPTIONS, CUI_BANNER_OPTIONS, CUI_BUTTON_DEFAULT_OPTIONS, CUI_BUTTON_OPTIONS, CUI_DEFAULT_THEME, CUI_DIALOGS, CUI_DIALOG_CONTEXT, CUI_DIALOG_DEFAULT_OPTIONS, CUI_DIALOG_OPTIONS, CUI_INPUT_TIME_DEFAULT_OPTIONS, CUI_INPUT_TIME_OPTIONS, CUI_NOTIFICATION_DEFAULT_OPTIONS, CUI_NOTIFICATION_ICONS, CUI_NOTIFICATION_ICON_OPTIONS, CUI_NOTIFICATION_ICON_OPTIONS_DEFAULT_MODE, CUI_NOTIFICATION_ICON_OPTIONS_LIGHT_MODE, CUI_NOTIFICATION_OPTIONS, CUI_ROOT_SELECTOR, CUI_TAB_ACTIVATE, CUI_TEXT_FIELD_CONTROLLER, CUI_TEXT_FIELD_ICON_LEFT, CUI_TEXT_FIELD_ID, CUI_TEXT_FIELD_IS_ERROR, CUI_TEXT_FIELD_PLACEHOLDER, CUI_TEXT_FIELD_SIZE, CUI_TEXT_FILED_CONTROLLER_PROVIDER, CUI_THEME, CUI_THEME_STORAGE_DEFAULT_KEY, CUI_THEME_STORAGE_KEY, CuiAccordionComponent, CuiAccordionItemComponent, CuiAccordionModule, CuiAlertComponent, CuiAlertModule, CuiAlertService, CuiAlertsComponent, CuiBadgeComponent, CuiBadgeModule, CuiBannerComponent, CuiBannerModule, CuiBreadcrumbComponent, CuiBreadcrumbsComponent, CuiBreadcrumbsModule, CuiButtonComponent, CuiButtonGroupComponent, CuiButtonGroupModule, CuiButtonModule, CuiCheckboxComponent, CuiCheckboxModule, CuiContextMenuComponent, CuiContextMenuModule, CuiDialogActionsComponent, CuiDialogComponent, CuiDialogHeaderComponent, CuiDialogModule, CuiDialogService, CuiDialogsComponent, CuiFormFieldComponent, CuiFormFieldModule, CuiHintComponent, CuiHintModule, CuiIconButtonComponent, CuiIconButtonModule, CuiInputModule, CuiInputNumberComponent, CuiInputNumberModule, CuiInputPasswordComponent, CuiInputPasswordModule, CuiInputTextComponent, CuiInputTimeComponent, CuiInputTimeModule, CuiLabelComponent, CuiLabelModule, CuiNotificationComponent, CuiNotificationModule, CuiRadioComponent, CuiRadioModule, CuiRootComponent, CuiRootModule, CuiSelectComponent, CuiSelectModule, CuiSvgComponent, CuiSvgModule, CuiTabComponent, CuiTabsComponent, CuiTabsModule, CuiTextFieldController, CuiTextFieldControllerModule, CuiTextFieldIconLeftDirective, CuiTextFieldIdDirective, CuiTextFieldIsErrorDirective, CuiTextFieldPlaceholderDirective, CuiTextFieldSizeDirective, CuiTextareaComponent, CuiTextareaModule, CuiThemeService, CuiToggleComponent, CuiToggleModule, cuiRemoveSpaces, cuiReplace };