@cuby-ui/core 0.0.150 → 0.0.151

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 (282) 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 +15 -15
  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 +30 -30
  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 +10 -10
  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 -25
  58. package/components/input-number/index.d.ts +2 -2
  59. package/components/input-number/input-number.component.d.ts +55 -55
  60. package/components/input-number/input-number.module.d.ts +11 -11
  61. package/components/input-number/input-number.options.d.ts +9 -9
  62. package/components/input-password/index.d.ts +2 -2
  63. package/components/input-password/input-password.component.d.ts +31 -31
  64. package/components/input-password/input-password.module.d.ts +11 -11
  65. package/components/input-text/index.d.ts +2 -2
  66. package/components/input-text/input-text.component.d.ts +31 -31
  67. package/components/input-text/input-text.module.d.ts +11 -11
  68. package/components/input-time/index.d.ts +3 -0
  69. package/components/input-time/input-time.component.d.ts +33 -0
  70. package/components/input-time/input-time.module.d.ts +11 -0
  71. package/components/input-time/input-time.options.d.ts +7 -0
  72. package/components/label/index.d.ts +2 -2
  73. package/components/label/label.component.d.ts +6 -6
  74. package/components/label/label.module.d.ts +8 -8
  75. package/components/notification/index.d.ts +3 -3
  76. package/components/notification/notification.component.d.ts +13 -13
  77. package/components/notification/notification.module.d.ts +10 -10
  78. package/components/notification/notification.options.d.ts +13 -13
  79. package/components/radio/index.d.ts +2 -2
  80. package/components/radio/radio.component.d.ts +5 -5
  81. package/components/radio/radio.module.d.ts +7 -7
  82. package/components/root/index.d.ts +3 -3
  83. package/components/root/root.component.d.ts +11 -11
  84. package/components/root/root.module.d.ts +10 -10
  85. package/components/root/root.options.d.ts +1 -1
  86. package/components/select/index.d.ts +2 -2
  87. package/components/select/select.component.d.ts +52 -52
  88. package/components/select/select.module.d.ts +10 -10
  89. package/components/svg/index.d.ts +2 -2
  90. package/components/svg/svg.component.d.ts +16 -16
  91. package/components/svg/svg.module.d.ts +8 -8
  92. package/components/tabs/index.d.ts +3 -3
  93. package/components/tabs/tab/index.d.ts +1 -1
  94. package/components/tabs/tab/tab.component.d.ts +8 -8
  95. package/components/tabs/tabs.component.d.ts +16 -16
  96. package/components/tabs/tabs.module.d.ts +8 -8
  97. package/components/textarea/index.d.ts +2 -2
  98. package/components/textarea/textarea.component.d.ts +10 -10
  99. package/components/textarea/textarea.module.d.ts +7 -7
  100. package/components/toggle/index.d.ts +2 -2
  101. package/components/toggle/toggle.component.d.ts +5 -5
  102. package/components/toggle/toggle.module.d.ts +7 -7
  103. package/directives/index.d.ts +1 -1
  104. package/directives/text-field-controller/index.d.ts +8 -8
  105. package/directives/text-field-controller/text-field-controller.module.d.ts +11 -11
  106. package/directives/text-field-controller/text-field-controller.provider.d.ts +4 -4
  107. package/directives/text-field-controller/text-field-icon-left.directive.d.ts +9 -9
  108. package/directives/text-field-controller/text-field-id.directive.d.ts +8 -8
  109. package/directives/text-field-controller/text-field-is-error.directive.d.ts +8 -8
  110. package/directives/text-field-controller/text-field-placeholder.directive.d.ts +8 -8
  111. package/directives/text-field-controller/text-field-size.directive.d.ts +9 -9
  112. package/directives/text-field-controller/text-field.controller.d.ts +20 -20
  113. package/esm2020/components/accordion/accordion-item/accordion-item.component.mjs +28 -28
  114. package/esm2020/components/accordion/accordion.component.mjs +11 -11
  115. package/esm2020/components/accordion/accordion.module.mjs +37 -37
  116. package/esm2020/components/accordion/index.mjs +4 -4
  117. package/esm2020/components/alert/alert.component.mjs +36 -36
  118. package/esm2020/components/alert/alert.interfaces.mjs +2 -2
  119. package/esm2020/components/alert/alert.module.mjs +40 -40
  120. package/esm2020/components/alert/alert.service.mjs +17 -17
  121. package/esm2020/components/alert/alert.tokens.mjs +19 -19
  122. package/esm2020/components/alert/alert.types.mjs +2 -2
  123. package/esm2020/components/alert/alerts.component.mjs +36 -36
  124. package/esm2020/components/alert/index.mjs +9 -9
  125. package/esm2020/components/badge/badge.component.mjs +31 -31
  126. package/esm2020/components/badge/badge.module.mjs +18 -18
  127. package/esm2020/components/badge/badge.options.mjs +8 -8
  128. package/esm2020/components/badge/index.mjs +3 -3
  129. package/esm2020/components/banner/banner.component.mjs +68 -68
  130. package/esm2020/components/banner/banner.module.mjs +31 -31
  131. package/esm2020/components/banner/banner.options.mjs +6 -6
  132. package/esm2020/components/banner/index.mjs +4 -4
  133. package/esm2020/components/breadcrumbs/breadcrumb/breadcrumb.component.mjs +16 -16
  134. package/esm2020/components/breadcrumbs/breadcrumbs.component.mjs +17 -17
  135. package/esm2020/components/breadcrumbs/breadcrumbs.module.mjs +33 -33
  136. package/esm2020/components/breadcrumbs/index.mjs +4 -4
  137. package/esm2020/components/button/button.component.mjs +104 -104
  138. package/esm2020/components/button/button.module.mjs +24 -24
  139. package/esm2020/components/button/button.options.mjs +10 -10
  140. package/esm2020/components/button/index.mjs +4 -4
  141. package/esm2020/components/button-group/button-group.component.mjs +11 -11
  142. package/esm2020/components/button-group/button-group.module.mjs +16 -16
  143. package/esm2020/components/button-group/index.mjs +3 -3
  144. package/esm2020/components/checkbox/checkbox.component.mjs +11 -11
  145. package/esm2020/components/checkbox/checkbox.module.mjs +16 -16
  146. package/esm2020/components/checkbox/index.mjs +3 -3
  147. package/esm2020/components/context-menu/context-menu.component.mjs +146 -146
  148. package/esm2020/components/context-menu/context-menu.module.mjs +24 -24
  149. package/esm2020/components/context-menu/index.mjs +3 -3
  150. package/esm2020/components/dialog/dialog-actions/dialog-actions.component.mjs +11 -11
  151. package/esm2020/components/dialog/dialog-header/dialog-header.component.mjs +28 -28
  152. package/esm2020/components/dialog/dialog.component.mjs +64 -64
  153. package/esm2020/components/dialog/dialog.interfaces.mjs +2 -2
  154. package/esm2020/components/dialog/dialog.module.mjs +50 -50
  155. package/esm2020/components/dialog/dialog.service.mjs +17 -17
  156. package/esm2020/components/dialog/dialog.tokens.mjs +11 -11
  157. package/esm2020/components/dialog/dialogs.component.mjs +51 -51
  158. package/esm2020/components/dialog/index.mjs +9 -9
  159. package/esm2020/components/form-field/form-field.component.mjs +11 -11
  160. package/esm2020/components/form-field/form-field.module.mjs +16 -16
  161. package/esm2020/components/form-field/index.mjs +3 -3
  162. package/esm2020/components/hint/hint.component.mjs +19 -19
  163. package/esm2020/components/hint/hint.module.mjs +16 -16
  164. package/esm2020/components/hint/index.mjs +3 -3
  165. package/esm2020/components/icon-button/icon-button.component.mjs +32 -32
  166. package/esm2020/components/icon-button/icon-button.module.mjs +24 -24
  167. package/esm2020/components/icon-button/index.mjs +3 -3
  168. package/esm2020/components/index.mjs +27 -26
  169. package/esm2020/components/input-number/index.mjs +3 -3
  170. package/esm2020/components/input-number/input-number.component.mjs +204 -204
  171. package/esm2020/components/input-number/input-number.module.mjs +33 -33
  172. package/esm2020/components/input-number/input-number.options.mjs +11 -11
  173. package/esm2020/components/input-password/index.mjs +3 -3
  174. package/esm2020/components/input-password/input-password.component.mjs +89 -89
  175. package/esm2020/components/input-password/input-password.module.mjs +33 -33
  176. package/esm2020/components/input-text/index.mjs +3 -3
  177. package/esm2020/components/input-text/input-text.component.mjs +87 -87
  178. package/esm2020/components/input-text/input-text.module.mjs +33 -33
  179. package/esm2020/components/input-time/index.mjs +4 -0
  180. package/esm2020/components/input-time/input-time.component.mjs +89 -0
  181. package/esm2020/components/input-time/input-time.module.mjs +35 -0
  182. package/esm2020/components/input-time/input-time.options.mjs +8 -0
  183. package/esm2020/components/label/index.mjs +3 -3
  184. package/esm2020/components/label/label.component.mjs +17 -17
  185. package/esm2020/components/label/label.module.mjs +18 -18
  186. package/esm2020/components/notification/index.mjs +4 -4
  187. package/esm2020/components/notification/notification.component.mjs +51 -51
  188. package/esm2020/components/notification/notification.module.mjs +27 -27
  189. package/esm2020/components/notification/notification.options.mjs +6 -6
  190. package/esm2020/components/radio/index.mjs +3 -3
  191. package/esm2020/components/radio/radio.component.mjs +11 -11
  192. package/esm2020/components/radio/radio.module.mjs +16 -16
  193. package/esm2020/components/root/index.mjs +4 -4
  194. package/esm2020/components/root/root.component.mjs +31 -31
  195. package/esm2020/components/root/root.module.mjs +28 -28
  196. package/esm2020/components/root/root.options.mjs +1 -1
  197. package/esm2020/components/select/index.mjs +3 -3
  198. package/esm2020/components/select/select.component.mjs +167 -167
  199. package/esm2020/components/select/select.module.mjs +29 -29
  200. package/esm2020/components/svg/index.mjs +3 -3
  201. package/esm2020/components/svg/svg.component.mjs +50 -50
  202. package/esm2020/components/svg/svg.module.mjs +18 -18
  203. package/esm2020/components/tabs/index.mjs +4 -4
  204. package/esm2020/components/tabs/tab/index.mjs +1 -1
  205. package/esm2020/components/tabs/tab/tab.component.mjs +21 -21
  206. package/esm2020/components/tabs/tabs.component.mjs +49 -49
  207. package/esm2020/components/tabs/tabs.module.mjs +18 -18
  208. package/esm2020/components/textarea/index.mjs +3 -3
  209. package/esm2020/components/textarea/textarea.component.mjs +35 -35
  210. package/esm2020/components/textarea/textarea.module.mjs +16 -16
  211. package/esm2020/components/toggle/index.mjs +3 -3
  212. package/esm2020/components/toggle/toggle.component.mjs +11 -11
  213. package/esm2020/components/toggle/toggle.module.mjs +16 -16
  214. package/esm2020/cuby-ui-core.mjs +4 -4
  215. package/esm2020/directives/index.mjs +2 -2
  216. package/esm2020/directives/text-field-controller/index.mjs +9 -9
  217. package/esm2020/directives/text-field-controller/text-field-controller.module.mjs +40 -40
  218. package/esm2020/directives/text-field-controller/text-field-controller.provider.mjs +24 -24
  219. package/esm2020/directives/text-field-controller/text-field-icon-left.directive.mjs +21 -21
  220. package/esm2020/directives/text-field-controller/text-field-id.directive.mjs +21 -21
  221. package/esm2020/directives/text-field-controller/text-field-is-error.directive.mjs +24 -24
  222. package/esm2020/directives/text-field-controller/text-field-placeholder.directive.mjs +21 -21
  223. package/esm2020/directives/text-field-controller/text-field-size.directive.mjs +24 -24
  224. package/esm2020/directives/text-field-controller/text-field.controller.mjs +25 -25
  225. package/esm2020/index.mjs +7 -7
  226. package/esm2020/interfaces/context-menu-item.mjs +2 -2
  227. package/esm2020/interfaces/index.mjs +3 -3
  228. package/esm2020/interfaces/option.mjs +2 -2
  229. package/esm2020/services/index.mjs +3 -3
  230. package/esm2020/services/theme.options.mjs +6 -6
  231. package/esm2020/services/theme.service.mjs +30 -30
  232. package/esm2020/types/appearance.mjs +2 -2
  233. package/esm2020/types/hint-type.mjs +2 -2
  234. package/esm2020/types/index.mjs +8 -8
  235. package/esm2020/types/position.mjs +2 -2
  236. package/esm2020/types/resizing.mjs +2 -2
  237. package/esm2020/types/shape.mjs +2 -2
  238. package/esm2020/types/size.mjs +2 -2
  239. package/esm2020/types/status.mjs +2 -2
  240. package/esm2020/utils/format/index.mjs +3 -3
  241. package/esm2020/utils/format/remove-spaces.mjs +4 -4
  242. package/esm2020/utils/format/replace.mjs +5 -5
  243. package/esm2020/utils/index.mjs +2 -2
  244. package/fesm2015/cuby-ui-core.mjs +2162 -2044
  245. package/fesm2015/cuby-ui-core.mjs.map +1 -1
  246. package/fesm2020/cuby-ui-core.mjs +2160 -2043
  247. package/fesm2020/cuby-ui-core.mjs.map +1 -1
  248. package/fonts/Inter-Bold.svg +25443 -25443
  249. package/fonts/Inter-Medium.svg +25400 -25400
  250. package/fonts/Inter-Regular.svg +24341 -24341
  251. package/fonts/Inter-SemiBold.svg +25459 -25459
  252. package/index.d.ts +6 -6
  253. package/interfaces/context-menu-item.d.ts +7 -7
  254. package/interfaces/index.d.ts +2 -2
  255. package/interfaces/option.d.ts +5 -5
  256. package/package.json +6 -3
  257. package/services/index.d.ts +2 -2
  258. package/services/theme.options.d.ts +5 -5
  259. package/services/theme.service.d.ts +12 -12
  260. package/styles/fonts.scss +51 -51
  261. package/styles/global.scss +9 -9
  262. package/styles/mixins/buttons.scss +13 -13
  263. package/styles/mixins/headings.scss +115 -115
  264. package/styles/mixins/inputs.scss +91 -91
  265. package/styles/mixins/lists.scss +5 -5
  266. package/styles/mixins/paddings.scss +35 -35
  267. package/styles/mixins/shadows.scss +38 -38
  268. package/styles/mixins/texts.scss +225 -225
  269. package/styles/theme.scss +373 -373
  270. package/styles/variables/colors.scss +247 -247
  271. package/types/appearance.d.ts +8 -8
  272. package/types/hint-type.d.ts +1 -1
  273. package/types/index.d.ts +7 -7
  274. package/types/position.d.ts +2 -2
  275. package/types/resizing.d.ts +2 -2
  276. package/types/shape.d.ts +1 -1
  277. package/types/size.d.ts +4 -4
  278. package/types/status.d.ts +1 -1
  279. package/utils/format/index.d.ts +2 -2
  280. package/utils/format/remove-spaces.d.ts +1 -1
  281. package/utils/format/replace.d.ts +1 -1
  282. package/utils/index.d.ts +1 -1
@@ -11,2202 +11,2319 @@ import * as i2$1 from '@tinkoff/ng-polymorpheus';
11
11
  import { PolymorpheusModule } from '@tinkoff/ng-polymorpheus';
12
12
  import * as i2$2 from '@angular/forms';
13
13
  import { NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
14
+ import { maskitoTimeOptionsGenerator } from '@maskito/kit';
15
+ import * as i3 from '@maskito/angular';
16
+ import { MaskitoDirective } from '@maskito/angular';
14
17
 
15
- class CuiAccordionComponent {
16
- }
17
- CuiAccordionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
18
- 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 });
19
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionComponent, decorators: [{
20
- type: Component,
21
- 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"] }]
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"] }]
22
25
  }] });
23
26
 
24
- const CUI_BUTTON_DEFAULT_OPTIONS = {
25
- appearance: 'action',
26
- shape: null,
27
- size: 'sm'
28
- };
29
- const CUI_BUTTON_OPTIONS = new InjectionToken('', {
30
- 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
31
34
  });
32
35
 
33
- class CuiSvgComponent {
34
- constructor() {
35
- this.domSanitizer = inject(DomSanitizer);
36
- }
37
- set icon(icon) {
38
- // TODO: В данном случае подключаются все иконки (вероятно, можно как-то оптимизировано их подключать)
39
- this.safeSvgContent = this.domSanitizer.bypassSecurityTrustHtml(cuiIsIcon(icon)
40
- ? CUI_ICONS[icon]
41
- : icon);
42
- }
43
- get isWithStrokeWidth() {
44
- return !!this.strokeWidth;
45
- }
46
- get isWithColor() {
47
- return !!this.color;
48
- }
49
- }
50
- CuiSvgComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSvgComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
51
- 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 });
52
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSvgComponent, decorators: [{
53
- type: Component,
54
- 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"] }]
55
- }], propDecorators: { width: [{
56
- type: Input
57
- }], height: [{
58
- type: Input
59
- }], strokeWidth: [{
60
- type: Input
61
- }, {
62
- type: HostBinding,
63
- args: ['style.--stroke-width']
64
- }], color: [{
65
- type: Input
66
- }, {
67
- type: HostBinding,
68
- args: ['style.--color']
69
- }], icon: [{
70
- type: Input
71
- }], isWithStrokeWidth: [{
72
- type: HostBinding,
73
- args: ['class._with-stroke-width']
74
- }], isWithColor: [{
75
- type: HostBinding,
76
- 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\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']
77
80
  }] } });
78
81
 
79
- class CuiButtonComponent {
80
- constructor() {
81
- this.cuiButtonOptions = inject(CUI_BUTTON_OPTIONS);
82
- this.COLOR_BASE_500 = 'var(--cui-base-500)';
83
- this.BUTTON_ICONS_COLOR_BASE_500 = [
84
- 'secondary',
85
- 'outlined',
86
- 'outlined-gray',
87
- 'ghost'
88
- ];
89
- this._appearance = this.cuiButtonOptions.appearance;
90
- this.iconColor = 'currentColor';
91
- this._size = this.cuiButtonOptions.size;
92
- this.iconDimensions = {
93
- width: 20,
94
- height: 20
95
- };
96
- this.shape = this.cuiButtonOptions.shape;
97
- this.disabled = false;
98
- this.isLoaderShown = false;
99
- this.containsOnlyIcon = false;
100
- }
101
- get appearance() {
102
- return this._appearance;
103
- }
104
- set appearance(appearance) {
105
- this._appearance = appearance;
106
- if (this.BUTTON_ICONS_COLOR_BASE_500.includes(appearance)) {
107
- this.iconColor = this.COLOR_BASE_500;
108
- return;
109
- }
110
- this.iconColor = 'currentColor';
111
- }
112
- get size() {
113
- return this._size;
114
- }
115
- set size(size) {
116
- this._size = size;
117
- if (size === 'xxs') {
118
- this.iconDimensions = {
119
- width: 16,
120
- height: 16
121
- };
122
- return;
123
- }
124
- this.iconDimensions = {
125
- width: 20,
126
- height: 20
127
- };
128
- }
129
- get isDisabled() {
130
- return this.disabled || this.isLoaderShown;
131
- }
132
- }
133
- CuiButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
134
- 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(--cui-base-900)}@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 });
135
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonComponent, decorators: [{
136
- type: Component,
137
- 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(--cui-base-900)}@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"] }]
138
- }], propDecorators: { shape: [{
139
- type: Input
140
- }, {
141
- type: HostBinding,
142
- args: ['attr.data-shape']
143
- }], disabled: [{
144
- type: Input
145
- }, {
146
- type: HostBinding,
147
- args: ['class._disabled']
148
- }], isLoaderShown: [{
149
- type: Input
150
- }, {
151
- type: HostBinding,
152
- args: ['class._loading']
153
- }], icon: [{
154
- type: Input
155
- }], iconRight: [{
156
- type: Input
157
- }], appearance: [{
158
- type: Input
159
- }, {
160
- type: HostBinding,
161
- args: ['attr.data-appearance']
162
- }], size: [{
163
- type: Input
164
- }, {
165
- type: HostBinding,
166
- args: ['attr.data-size']
167
- }], containsOnlyIcon: [{
168
- type: HostBinding,
169
- args: ['class._only-icon']
170
- }], isDisabled: [{
171
- type: HostBinding,
172
- args: ['disabled']
173
- }], content: [{
174
- type: ViewChild,
175
- args: ['content']
82
+ class CuiButtonComponent {
83
+ constructor() {
84
+ this.cuiButtonOptions = inject(CUI_BUTTON_OPTIONS);
85
+ this.COLOR_BASE_500 = 'var(--cui-base-500)';
86
+ this.BUTTON_ICONS_COLOR_BASE_500 = [
87
+ 'secondary',
88
+ 'outlined',
89
+ 'outlined-gray',
90
+ 'ghost'
91
+ ];
92
+ this._appearance = this.cuiButtonOptions.appearance;
93
+ this.iconColor = 'currentColor';
94
+ this._size = this.cuiButtonOptions.size;
95
+ this.iconDimensions = {
96
+ width: 20,
97
+ height: 20
98
+ };
99
+ this.shape = this.cuiButtonOptions.shape;
100
+ this.disabled = false;
101
+ this.isLoaderShown = false;
102
+ this.containsOnlyIcon = false;
103
+ }
104
+ get appearance() {
105
+ return this._appearance;
106
+ }
107
+ set appearance(appearance) {
108
+ this._appearance = appearance;
109
+ if (this.BUTTON_ICONS_COLOR_BASE_500.includes(appearance)) {
110
+ this.iconColor = this.COLOR_BASE_500;
111
+ return;
112
+ }
113
+ this.iconColor = 'currentColor';
114
+ }
115
+ get size() {
116
+ return this._size;
117
+ }
118
+ set size(size) {
119
+ this._size = size;
120
+ if (size === 'xxs') {
121
+ this.iconDimensions = {
122
+ width: 16,
123
+ height: 16
124
+ };
125
+ return;
126
+ }
127
+ this.iconDimensions = {
128
+ width: 20,
129
+ height: 20
130
+ };
131
+ }
132
+ get isDisabled() {
133
+ return this.disabled || this.isLoaderShown;
134
+ }
135
+ }
136
+ CuiButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
137
+ 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(--cui-base-900)}@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 });
138
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonComponent, decorators: [{
139
+ type: Component,
140
+ 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(--cui-base-900)}@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"] }]
141
+ }], propDecorators: { shape: [{
142
+ type: Input
143
+ }, {
144
+ type: HostBinding,
145
+ args: ['attr.data-shape']
146
+ }], disabled: [{
147
+ type: Input
148
+ }, {
149
+ type: HostBinding,
150
+ args: ['class._disabled']
151
+ }], isLoaderShown: [{
152
+ type: Input
153
+ }, {
154
+ type: HostBinding,
155
+ args: ['class._loading']
156
+ }], icon: [{
157
+ type: Input
158
+ }], iconRight: [{
159
+ type: Input
160
+ }], appearance: [{
161
+ type: Input
162
+ }, {
163
+ type: HostBinding,
164
+ args: ['attr.data-appearance']
165
+ }], size: [{
166
+ type: Input
167
+ }, {
168
+ type: HostBinding,
169
+ args: ['attr.data-size']
170
+ }], containsOnlyIcon: [{
171
+ type: HostBinding,
172
+ args: ['class._only-icon']
173
+ }], isDisabled: [{
174
+ type: HostBinding,
175
+ args: ['disabled']
176
+ }], content: [{
177
+ type: ViewChild,
178
+ args: ['content']
176
179
  }] } });
177
180
 
178
- class CuiAccordionItemComponent {
179
- constructor() {
180
- this.isOpen = true;
181
- this.isOpenChange = new EventEmitter();
182
- }
183
- get buttonIcon() {
184
- return this.isOpen ? 'cuiIconChevronDown' : 'cuiIconChevronRight';
185
- }
186
- onRowToggle() {
187
- this.isOpen = !this.isOpen;
188
- this.isOpenChange.emit(this.isOpen);
189
- }
190
- }
191
- CuiAccordionItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
192
- 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 });
193
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionItemComponent, decorators: [{
194
- type: Component,
195
- 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"] }]
196
- }], propDecorators: { isOpen: [{
197
- type: Input
198
- }], isOpenChange: [{
199
- type: Output
181
+ class CuiAccordionItemComponent {
182
+ constructor() {
183
+ this.isOpen = true;
184
+ this.isOpenChange = new EventEmitter();
185
+ }
186
+ get buttonIcon() {
187
+ return this.isOpen ? 'cuiIconChevronDown' : 'cuiIconChevronRight';
188
+ }
189
+ onRowToggle() {
190
+ this.isOpen = !this.isOpen;
191
+ this.isOpenChange.emit(this.isOpen);
192
+ }
193
+ }
194
+ CuiAccordionItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
195
+ 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 });
196
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionItemComponent, decorators: [{
197
+ type: Component,
198
+ 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"] }]
199
+ }], propDecorators: { isOpen: [{
200
+ type: Input
201
+ }], isOpenChange: [{
202
+ type: Output
200
203
  }] } });
201
204
 
202
- class CuiSvgModule {
203
- }
204
- CuiSvgModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSvgModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
205
- CuiSvgModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiSvgModule, declarations: [CuiSvgComponent], imports: [CommonModule], exports: [CuiSvgComponent] });
206
- CuiSvgModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSvgModule, imports: [CommonModule] });
207
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSvgModule, decorators: [{
208
- type: NgModule,
209
- args: [{
210
- imports: [CommonModule],
211
- declarations: [CuiSvgComponent],
212
- exports: [CuiSvgComponent]
213
- }]
205
+ class CuiSvgModule {
206
+ }
207
+ CuiSvgModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSvgModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
208
+ CuiSvgModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiSvgModule, declarations: [CuiSvgComponent], imports: [CommonModule], exports: [CuiSvgComponent] });
209
+ CuiSvgModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSvgModule, imports: [CommonModule] });
210
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSvgModule, decorators: [{
211
+ type: NgModule,
212
+ args: [{
213
+ imports: [CommonModule],
214
+ declarations: [CuiSvgComponent],
215
+ exports: [CuiSvgComponent]
216
+ }]
214
217
  }] });
215
218
 
216
- class CuiButtonModule {
217
- }
218
- CuiButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
219
- CuiButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonModule, declarations: [CuiButtonComponent], imports: [CommonModule,
220
- CuiSvgModule], exports: [CuiButtonComponent] });
221
- CuiButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonModule, imports: [CommonModule,
222
- CuiSvgModule] });
223
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonModule, decorators: [{
224
- type: NgModule,
225
- args: [{
226
- imports: [
227
- CommonModule,
228
- CuiSvgModule
229
- ],
230
- declarations: [CuiButtonComponent],
231
- exports: [CuiButtonComponent]
232
- }]
219
+ class CuiButtonModule {
220
+ }
221
+ CuiButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
222
+ CuiButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonModule, declarations: [CuiButtonComponent], imports: [CommonModule,
223
+ CuiSvgModule], exports: [CuiButtonComponent] });
224
+ CuiButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonModule, imports: [CommonModule,
225
+ CuiSvgModule] });
226
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonModule, decorators: [{
227
+ type: NgModule,
228
+ args: [{
229
+ imports: [
230
+ CommonModule,
231
+ CuiSvgModule
232
+ ],
233
+ declarations: [CuiButtonComponent],
234
+ exports: [CuiButtonComponent]
235
+ }]
233
236
  }] });
234
237
 
235
- class CuiAccordionModule {
236
- }
237
- CuiAccordionModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
238
- CuiAccordionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionModule, declarations: [CuiAccordionComponent,
239
- CuiAccordionItemComponent], imports: [CommonModule,
240
- CuiSvgModule,
241
- CuiButtonModule], exports: [CuiAccordionComponent,
242
- CuiAccordionItemComponent] });
243
- CuiAccordionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionModule, imports: [CommonModule,
244
- CuiSvgModule,
245
- CuiButtonModule] });
246
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionModule, decorators: [{
247
- type: NgModule,
248
- args: [{
249
- imports: [
250
- CommonModule,
251
- CuiSvgModule,
252
- CuiButtonModule,
253
- ],
254
- declarations: [
255
- CuiAccordionComponent,
256
- CuiAccordionItemComponent
257
- ],
258
- exports: [
259
- CuiAccordionComponent,
260
- CuiAccordionItemComponent
261
- ]
262
- }]
238
+ class CuiAccordionModule {
239
+ }
240
+ CuiAccordionModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
241
+ CuiAccordionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionModule, declarations: [CuiAccordionComponent,
242
+ CuiAccordionItemComponent], imports: [CommonModule,
243
+ CuiSvgModule,
244
+ CuiButtonModule], exports: [CuiAccordionComponent,
245
+ CuiAccordionItemComponent] });
246
+ CuiAccordionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionModule, imports: [CommonModule,
247
+ CuiSvgModule,
248
+ CuiButtonModule] });
249
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAccordionModule, decorators: [{
250
+ type: NgModule,
251
+ args: [{
252
+ imports: [
253
+ CommonModule,
254
+ CuiSvgModule,
255
+ CuiButtonModule,
256
+ ],
257
+ declarations: [
258
+ CuiAccordionComponent,
259
+ CuiAccordionItemComponent
260
+ ],
261
+ exports: [
262
+ CuiAccordionComponent,
263
+ CuiAccordionItemComponent
264
+ ]
265
+ }]
263
266
  }] });
264
267
 
265
- const CUI_NOTIFICATION_DEFAULT_OPTIONS = {
266
- status: 'info'
267
- };
268
+ const CUI_NOTIFICATION_DEFAULT_OPTIONS = {
269
+ status: 'info'
270
+ };
268
271
  const CUI_NOTIFICATION_OPTIONS = cuiCreateToken(CUI_NOTIFICATION_DEFAULT_OPTIONS);
269
272
 
270
- const CUI_ALERTS = cuiCreateToken(new BehaviorSubject([]));
271
- const CUI_ALERT_DEFAULT_OPTIONS = {
272
- label: '',
273
- needAutoClose: true,
274
- isCloseable: true,
275
- position: 'right',
276
- resizing: 'fixed'
277
- };
278
- const CUI_ALERT_OPTIONS = cuiCreateTokenFromFactory(() => ({
279
- ...CUI_ALERT_DEFAULT_OPTIONS,
280
- ...inject(CUI_NOTIFICATION_OPTIONS)
281
- }));
273
+ const CUI_ALERTS = cuiCreateToken(new BehaviorSubject([]));
274
+ const CUI_ALERT_DEFAULT_OPTIONS = {
275
+ label: '',
276
+ needAutoClose: true,
277
+ isCloseable: true,
278
+ position: 'right',
279
+ resizing: 'fixed'
280
+ };
281
+ const CUI_ALERT_OPTIONS = cuiCreateTokenFromFactory(() => ({
282
+ ...CUI_ALERT_DEFAULT_OPTIONS,
283
+ ...inject(CUI_NOTIFICATION_OPTIONS)
284
+ }));
282
285
  const CUI_ALERT_CONTEXT = new InjectionToken('');
283
286
 
284
- class CuiNotificationComponent {
285
- constructor() {
286
- this.cuiNotificationOptions = inject(CUI_NOTIFICATION_OPTIONS);
287
- this.ICON_OPTIONS = {
288
- info: {
289
- icon: 'cuiIconInfo',
290
- color: 'var(--c-info-icon-color)'
291
- },
292
- success: {
293
- icon: 'cuiIconCheckCircle',
294
- color: 'var(--cui-green-500)'
295
- },
296
- alert: {
297
- icon: 'cuiIconAlertTriangle',
298
- color: 'var(--cui-yellow-400)'
299
- },
300
- error: {
301
- icon: 'cuiIconXCircle',
302
- color: 'var(--cui-danger)'
303
- },
304
- };
305
- this.status = this.cuiNotificationOptions.status;
306
- this.isCloseable = false;
307
- this.closed = new EventEmitter();
308
- }
309
- onClose() {
310
- this.closed.next();
311
- }
312
- }
313
- CuiNotificationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiNotificationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
314
- CuiNotificationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiNotificationComponent, selector: "cui-notification", inputs: { status: "status", isCloseable: "isCloseable" }, outputs: { closed: "closed" }, host: { properties: { "attr.data-status": "this.status" } }, ngImport: i0, template: "\r\n<cui-svg\r\n class=\"c-icon\"\r\n *cuiLet=\"ICON_OPTIONS[status] as iconOption\"\r\n [icon]=\"iconOption.icon\"\r\n [color]=\"iconOption.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-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: "directive", type: i2.CuiLetDirective, selector: "[cuiLet]", inputs: ["cuiLet"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
315
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiNotificationComponent, decorators: [{
316
- type: Component,
317
- args: [{ selector: 'cui-notification', changeDetection: ChangeDetectionStrategy.OnPush, template: "\r\n<cui-svg\r\n class=\"c-icon\"\r\n *cuiLet=\"ICON_OPTIONS[status] as iconOption\"\r\n [icon]=\"iconOption.icon\"\r\n [color]=\"iconOption.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-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"] }]
318
- }], propDecorators: { status: [{
319
- type: Input
320
- }, {
321
- type: HostBinding,
322
- args: ['attr.data-status']
323
- }], isCloseable: [{
324
- type: Input
325
- }], closed: [{
326
- type: Output
287
+ class CuiNotificationComponent {
288
+ constructor() {
289
+ this.cuiNotificationOptions = inject(CUI_NOTIFICATION_OPTIONS);
290
+ this.ICON_OPTIONS = {
291
+ info: {
292
+ icon: 'cuiIconInfo',
293
+ color: 'var(--c-info-icon-color)'
294
+ },
295
+ success: {
296
+ icon: 'cuiIconCheckCircle',
297
+ color: 'var(--cui-green-500)'
298
+ },
299
+ alert: {
300
+ icon: 'cuiIconAlertTriangle',
301
+ color: 'var(--cui-yellow-400)'
302
+ },
303
+ error: {
304
+ icon: 'cuiIconXCircle',
305
+ color: 'var(--cui-danger)'
306
+ },
307
+ };
308
+ this.status = this.cuiNotificationOptions.status;
309
+ this.isCloseable = false;
310
+ this.closed = new EventEmitter();
311
+ }
312
+ onClose() {
313
+ this.closed.next();
314
+ }
315
+ }
316
+ CuiNotificationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiNotificationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
317
+ CuiNotificationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiNotificationComponent, selector: "cui-notification", inputs: { status: "status", isCloseable: "isCloseable" }, outputs: { closed: "closed" }, host: { properties: { "attr.data-status": "this.status" } }, ngImport: i0, template: "\n<cui-svg\n class=\"c-icon\"\n *cuiLet=\"ICON_OPTIONS[status] as iconOption\"\n [icon]=\"iconOption.icon\"\n [color]=\"iconOption.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-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: "directive", type: i2.CuiLetDirective, selector: "[cuiLet]", inputs: ["cuiLet"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
318
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiNotificationComponent, decorators: [{
319
+ type: Component,
320
+ args: [{ selector: 'cui-notification', changeDetection: ChangeDetectionStrategy.OnPush, template: "\n<cui-svg\n class=\"c-icon\"\n *cuiLet=\"ICON_OPTIONS[status] as iconOption\"\n [icon]=\"iconOption.icon\"\n [color]=\"iconOption.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-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"] }]
321
+ }], propDecorators: { status: [{
322
+ type: Input
323
+ }, {
324
+ type: HostBinding,
325
+ args: ['attr.data-status']
326
+ }], isCloseable: [{
327
+ type: Input
328
+ }], closed: [{
329
+ type: Output
327
330
  }] } });
328
331
 
329
- class CuiAlertComponent {
330
- constructor() {
331
- this.context = inject(CUI_ALERT_CONTEXT);
332
- this.AUTO_CLOSE_DURATION_IN_MILLISECONDS = 3000;
333
- }
334
- get resizing() {
335
- return this.context.resizing;
336
- }
337
- ngOnInit() {
338
- this.initAutoClose();
339
- }
340
- onClosed() {
341
- this.context.$implicit.complete();
342
- }
343
- initAutoClose() {
344
- if (!this.context.needAutoClose) {
345
- return;
346
- }
347
- setTimeout(this.onClosed.bind(this), this.AUTO_CLOSE_DURATION_IN_MILLISECONDS);
348
- }
349
- }
350
- CuiAlertComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
351
- 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 [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", "isCloseable"], outputs: ["closed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
352
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertComponent, decorators: [{
353
- type: Component,
354
- args: [{ selector: 'cui-alert', changeDetection: ChangeDetectionStrategy.OnPush, template: "<cui-notification\r\n [status]=\"context.status\"\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"] }]
355
- }], propDecorators: { resizing: [{
356
- type: HostBinding,
357
- args: ['attr.data-resizing']
332
+ class CuiAlertComponent {
333
+ constructor() {
334
+ this.context = inject(CUI_ALERT_CONTEXT);
335
+ this.AUTO_CLOSE_DURATION_IN_MILLISECONDS = 3000;
336
+ }
337
+ get resizing() {
338
+ return this.context.resizing;
339
+ }
340
+ ngOnInit() {
341
+ this.initAutoClose();
342
+ }
343
+ onClosed() {
344
+ this.context.$implicit.complete();
345
+ }
346
+ initAutoClose() {
347
+ if (!this.context.needAutoClose) {
348
+ return;
349
+ }
350
+ setTimeout(this.onClosed.bind(this), this.AUTO_CLOSE_DURATION_IN_MILLISECONDS);
351
+ }
352
+ }
353
+ CuiAlertComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
354
+ 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 [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", "isCloseable"], outputs: ["closed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
355
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertComponent, decorators: [{
356
+ type: Component,
357
+ args: [{ selector: 'cui-alert', changeDetection: ChangeDetectionStrategy.OnPush, template: "<cui-notification\n [status]=\"context.status\"\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"] }]
358
+ }], propDecorators: { resizing: [{
359
+ type: HostBinding,
360
+ args: ['attr.data-resizing']
358
361
  }] } });
359
362
 
360
- class CuiAlertsComponent {
361
- constructor() {
362
- this.destroy$ = inject(CuiDestroyService, { self: true });
363
- this.alerts$ = inject(CUI_ALERTS);
364
- }
365
- ngOnInit() {
366
- this.initAlertInjectorsSubscription();
367
- }
368
- trackByFn(_, alert) {
369
- return alert.id;
370
- }
371
- alertsMatcher(alert, position) {
372
- return alert.position === position;
373
- }
374
- initAlertInjectorsSubscription() {
375
- this.alerts$
376
- .pipe(takeUntil(this.destroy$))
377
- .subscribe(dialogs => this.alertInjectors = dialogs.map(useValue => Injector.create({
378
- providers: [{ provide: CUI_ALERT_CONTEXT, useValue }]
379
- })));
380
- }
381
- }
382
- CuiAlertsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
383
- 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: i2.CuiLetDirective, selector: "[cuiLet]", inputs: ["cuiLet"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.CuiFilterPipe, name: "cuiFilter" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
384
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertsComponent, decorators: [{
385
- type: Component,
386
- 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"] }]
363
+ class CuiAlertsComponent {
364
+ constructor() {
365
+ this.destroy$ = inject(CuiDestroyService, { self: true });
366
+ this.alerts$ = inject(CUI_ALERTS);
367
+ }
368
+ ngOnInit() {
369
+ this.initAlertInjectorsSubscription();
370
+ }
371
+ trackByFn(_, alert) {
372
+ return alert.id;
373
+ }
374
+ alertsMatcher(alert, position) {
375
+ return alert.position === position;
376
+ }
377
+ initAlertInjectorsSubscription() {
378
+ this.alerts$
379
+ .pipe(takeUntil(this.destroy$))
380
+ .subscribe(dialogs => this.alertInjectors = dialogs.map(useValue => Injector.create({
381
+ providers: [{ provide: CUI_ALERT_CONTEXT, useValue }]
382
+ })));
383
+ }
384
+ }
385
+ CuiAlertsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
386
+ 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: i2.CuiLetDirective, selector: "[cuiLet]", inputs: ["cuiLet"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.CuiFilterPipe, name: "cuiFilter" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
387
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertsComponent, decorators: [{
388
+ type: Component,
389
+ 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"] }]
387
390
  }] });
388
391
 
389
- class CuiNotificationModule {
390
- }
391
- CuiNotificationModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiNotificationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
392
- CuiNotificationModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiNotificationModule, declarations: [CuiNotificationComponent], imports: [CommonModule,
393
- CuiLetDirective,
394
- CuiSvgModule], exports: [CuiNotificationComponent] });
395
- CuiNotificationModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiNotificationModule, imports: [CommonModule,
396
- CuiSvgModule] });
397
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiNotificationModule, decorators: [{
398
- type: NgModule,
399
- args: [{
400
- imports: [
401
- CommonModule,
402
- CuiLetDirective,
403
- CuiSvgModule
404
- ],
405
- declarations: [CuiNotificationComponent],
406
- exports: [CuiNotificationComponent]
407
- }]
392
+ class CuiNotificationModule {
393
+ }
394
+ CuiNotificationModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiNotificationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
395
+ CuiNotificationModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiNotificationModule, declarations: [CuiNotificationComponent], imports: [CommonModule,
396
+ CuiLetDirective,
397
+ CuiSvgModule], exports: [CuiNotificationComponent] });
398
+ CuiNotificationModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiNotificationModule, imports: [CommonModule,
399
+ CuiSvgModule] });
400
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiNotificationModule, decorators: [{
401
+ type: NgModule,
402
+ args: [{
403
+ imports: [
404
+ CommonModule,
405
+ CuiLetDirective,
406
+ CuiSvgModule
407
+ ],
408
+ declarations: [CuiNotificationComponent],
409
+ exports: [CuiNotificationComponent]
410
+ }]
408
411
  }] });
409
412
 
410
- class CuiAlertModule {
411
- }
412
- CuiAlertModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
413
- CuiAlertModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertModule, declarations: [CuiAlertComponent,
414
- CuiAlertsComponent], imports: [CommonModule,
415
- CuiFilterPipe,
416
- CuiNotificationModule,
417
- CuiLetDirective], exports: [CuiAlertComponent,
418
- CuiAlertComponent,
419
- CuiAlertsComponent] });
420
- CuiAlertModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertModule, imports: [CommonModule,
421
- CuiNotificationModule] });
422
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertModule, decorators: [{
423
- type: NgModule,
424
- args: [{
425
- imports: [
426
- CommonModule,
427
- CuiFilterPipe,
428
- CuiNotificationModule,
429
- CuiLetDirective
430
- ],
431
- declarations: [
432
- CuiAlertComponent,
433
- CuiAlertsComponent
434
- ],
435
- exports: [
436
- CuiAlertComponent,
437
- CuiAlertComponent,
438
- CuiAlertsComponent
439
- ]
440
- }]
413
+ class CuiAlertModule {
414
+ }
415
+ CuiAlertModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
416
+ CuiAlertModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertModule, declarations: [CuiAlertComponent,
417
+ CuiAlertsComponent], imports: [CommonModule,
418
+ CuiFilterPipe,
419
+ CuiNotificationModule,
420
+ CuiLetDirective], exports: [CuiAlertComponent,
421
+ CuiAlertComponent,
422
+ CuiAlertsComponent] });
423
+ CuiAlertModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertModule, imports: [CommonModule,
424
+ CuiNotificationModule] });
425
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertModule, decorators: [{
426
+ type: NgModule,
427
+ args: [{
428
+ imports: [
429
+ CommonModule,
430
+ CuiFilterPipe,
431
+ CuiNotificationModule,
432
+ CuiLetDirective
433
+ ],
434
+ declarations: [
435
+ CuiAlertComponent,
436
+ CuiAlertsComponent
437
+ ],
438
+ exports: [
439
+ CuiAlertComponent,
440
+ CuiAlertComponent,
441
+ CuiAlertsComponent
442
+ ]
443
+ }]
441
444
  }] });
442
445
 
443
- class CuiAlertService extends CuiPopoverService {
444
- }
445
- CuiAlertService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
446
- 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)) });
447
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertService, decorators: [{
448
- type: Injectable,
449
- args: [{
450
- providedIn: 'root',
451
- useFactory: () => new CuiAlertService(CUI_ALERTS, CuiAlertComponent, inject(CUI_ALERT_OPTIONS))
452
- }]
446
+ class CuiAlertService extends CuiPopoverService {
447
+ }
448
+ CuiAlertService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
449
+ 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)) });
450
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiAlertService, decorators: [{
451
+ type: Injectable,
452
+ args: [{
453
+ providedIn: 'root',
454
+ useFactory: () => new CuiAlertService(CUI_ALERTS, CuiAlertComponent, inject(CUI_ALERT_OPTIONS))
455
+ }]
453
456
  }] });
454
457
 
455
- const CUI_BADGE_DEFAULT_OPTIONS = {
456
- color: 'light-blue',
457
- size: 'sm',
458
- isWithDot: false
459
- };
458
+ const CUI_BADGE_DEFAULT_OPTIONS = {
459
+ color: 'light-blue',
460
+ size: 'sm',
461
+ isWithDot: false
462
+ };
460
463
  const CUI_BADGE_OPTIONS = cuiCreateToken(CUI_BADGE_DEFAULT_OPTIONS);
461
464
 
462
- class CuiBadgeComponent {
463
- constructor() {
464
- this.options = inject(CUI_BADGE_OPTIONS);
465
- this.color = this.options.color;
466
- this.size = this.options.size;
467
- this.isWithDot = this.options.isWithDot;
468
- }
469
- }
470
- CuiBadgeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
471
- 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 });
472
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBadgeComponent, decorators: [{
473
- type: Component,
474
- 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"] }]
475
- }], propDecorators: { color: [{
476
- type: Input
477
- }, {
478
- type: HostBinding,
479
- args: ['attr.data-color']
480
- }], size: [{
481
- type: Input
482
- }, {
483
- type: HostBinding,
484
- args: ['attr.data-size']
485
- }], isWithDot: [{
486
- type: Input
465
+ class CuiBadgeComponent {
466
+ constructor() {
467
+ this.options = inject(CUI_BADGE_OPTIONS);
468
+ this.color = this.options.color;
469
+ this.size = this.options.size;
470
+ this.isWithDot = this.options.isWithDot;
471
+ }
472
+ }
473
+ CuiBadgeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
474
+ 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 });
475
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBadgeComponent, decorators: [{
476
+ type: Component,
477
+ 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"] }]
478
+ }], propDecorators: { color: [{
479
+ type: Input
480
+ }, {
481
+ type: HostBinding,
482
+ args: ['attr.data-color']
483
+ }], size: [{
484
+ type: Input
485
+ }, {
486
+ type: HostBinding,
487
+ args: ['attr.data-size']
488
+ }], isWithDot: [{
489
+ type: Input
487
490
  }] } });
488
491
 
489
- class CuiBadgeModule {
490
- }
491
- CuiBadgeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
492
- CuiBadgeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiBadgeModule, declarations: [CuiBadgeComponent], imports: [CommonModule], exports: [CuiBadgeComponent] });
493
- CuiBadgeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBadgeModule, imports: [CommonModule] });
494
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBadgeModule, decorators: [{
495
- type: NgModule,
496
- args: [{
497
- imports: [CommonModule],
498
- declarations: [CuiBadgeComponent],
499
- exports: [CuiBadgeComponent]
500
- }]
492
+ class CuiBadgeModule {
493
+ }
494
+ CuiBadgeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
495
+ CuiBadgeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiBadgeModule, declarations: [CuiBadgeComponent], imports: [CommonModule], exports: [CuiBadgeComponent] });
496
+ CuiBadgeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBadgeModule, imports: [CommonModule] });
497
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBadgeModule, decorators: [{
498
+ type: NgModule,
499
+ args: [{
500
+ imports: [CommonModule],
501
+ declarations: [CuiBadgeComponent],
502
+ exports: [CuiBadgeComponent]
503
+ }]
501
504
  }] });
502
505
 
503
- const CUI_BANNER_DEFAULT_OPTIONS = {
504
- status: 'info'
505
- };
506
+ const CUI_BANNER_DEFAULT_OPTIONS = {
507
+ status: 'info'
508
+ };
506
509
  const CUI_BANNER_OPTIONS = cuiCreateToken(CUI_BANNER_DEFAULT_OPTIONS);
507
510
 
508
- const CUI_THEME_STORAGE_DEFAULT_KEY = 'cuiTheme';
509
- const CUI_DEFAULT_THEME = 'light';
510
- const CUI_THEME_STORAGE_KEY = cuiCreateToken(CUI_THEME_STORAGE_DEFAULT_KEY);
511
+ const CUI_THEME_STORAGE_DEFAULT_KEY = 'cuiTheme';
512
+ const CUI_DEFAULT_THEME = 'light';
513
+ const CUI_THEME_STORAGE_KEY = cuiCreateToken(CUI_THEME_STORAGE_DEFAULT_KEY);
511
514
  const CUI_THEME = cuiCreateToken(CUI_DEFAULT_THEME);
512
515
 
513
- class CuiThemeService extends BehaviorSubject {
514
- constructor() {
515
- super(inject(CUI_LOCAL_STORAGE).getItem(inject(CUI_THEME_STORAGE_KEY))
516
- ?? inject(CUI_THEME));
517
- this.localStorage = inject(CUI_LOCAL_STORAGE);
518
- this.key = inject(CUI_THEME_STORAGE_KEY);
519
- }
520
- next(theme) {
521
- this.localStorage.setItem(this.key, theme);
522
- super.next(theme);
523
- }
524
- // При работе только двух тем
525
- switch() {
526
- this.next(this.value === 'light' ? 'dark' : 'light');
527
- }
528
- }
529
- CuiThemeService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiThemeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
530
- CuiThemeService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiThemeService, providedIn: 'root' });
531
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiThemeService, decorators: [{
532
- type: Injectable,
533
- args: [{
534
- providedIn: 'root'
535
- }]
516
+ class CuiThemeService extends BehaviorSubject {
517
+ constructor() {
518
+ super(inject(CUI_LOCAL_STORAGE).getItem(inject(CUI_THEME_STORAGE_KEY))
519
+ ?? inject(CUI_THEME));
520
+ this.localStorage = inject(CUI_LOCAL_STORAGE);
521
+ this.key = inject(CUI_THEME_STORAGE_KEY);
522
+ }
523
+ next(theme) {
524
+ this.localStorage.setItem(this.key, theme);
525
+ super.next(theme);
526
+ }
527
+ // При работе только двух тем
528
+ switch() {
529
+ this.next(this.value === 'light' ? 'dark' : 'light');
530
+ }
531
+ }
532
+ CuiThemeService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiThemeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
533
+ CuiThemeService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiThemeService, providedIn: 'root' });
534
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiThemeService, decorators: [{
535
+ type: Injectable,
536
+ args: [{
537
+ providedIn: 'root'
538
+ }]
536
539
  }], ctorParameters: function () { return []; } });
537
540
 
538
- class CuiBannerComponent {
539
- constructor() {
540
- this.options = inject(CUI_BANNER_OPTIONS);
541
- this.theme$ = inject(CuiThemeService);
542
- this.ICON_OPTIONS = {
543
- info: {
544
- icon: 'cuiIconInfo',
545
- color: 'var(--c-info-icon-color)'
546
- },
547
- success: {
548
- icon: 'cuiIconCheckCircle',
549
- color: 'var(--cui-success)'
550
- },
551
- alert: {
552
- icon: 'cuiIconAlertTriangle',
553
- color: 'var(--c-alert-icon-color)'
554
- },
555
- error: {
556
- icon: 'cuiIconXCircle',
557
- color: 'var(--cui-danger)'
558
- },
559
- };
560
- this.THEME_CLOSE_BUTTON_ICON_COLORS = {
561
- light: 'var(--cui-gray-500)',
562
- dark: 'var(--cui-gray-0)'
563
- };
564
- this.status = this.options.status;
565
- this.isCloseable = true;
566
- this.actionButtonClicked = new EventEmitter();
567
- this.closed = new EventEmitter();
568
- }
569
- onAction() {
570
- this.actionButtonClicked.emit();
571
- }
572
- onClose() {
573
- this.closed.emit();
574
- }
575
- }
576
- CuiBannerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBannerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
577
- 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: i2.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 });
578
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBannerComponent, decorators: [{
579
- type: Component,
580
- 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"] }]
581
- }], propDecorators: { status: [{
582
- type: Input
583
- }, {
584
- type: HostBinding,
585
- args: ['attr.data-status']
586
- }], isCloseable: [{
587
- type: Input
588
- }], label: [{
589
- type: Input
590
- }], actionButtonText: [{
591
- type: Input
592
- }], actionButtonClicked: [{
593
- type: Output
594
- }], closed: [{
595
- type: Output
541
+ class CuiBannerComponent {
542
+ constructor() {
543
+ this.options = inject(CUI_BANNER_OPTIONS);
544
+ this.theme$ = inject(CuiThemeService);
545
+ this.ICON_OPTIONS = {
546
+ info: {
547
+ icon: 'cuiIconInfo',
548
+ color: 'var(--c-info-icon-color)'
549
+ },
550
+ success: {
551
+ icon: 'cuiIconCheckCircle',
552
+ color: 'var(--cui-success)'
553
+ },
554
+ alert: {
555
+ icon: 'cuiIconAlertTriangle',
556
+ color: 'var(--c-alert-icon-color)'
557
+ },
558
+ error: {
559
+ icon: 'cuiIconXCircle',
560
+ color: 'var(--cui-danger)'
561
+ },
562
+ };
563
+ this.THEME_CLOSE_BUTTON_ICON_COLORS = {
564
+ light: 'var(--cui-gray-500)',
565
+ dark: 'var(--cui-gray-0)'
566
+ };
567
+ this.status = this.options.status;
568
+ this.isCloseable = true;
569
+ this.actionButtonClicked = new EventEmitter();
570
+ this.closed = new EventEmitter();
571
+ }
572
+ onAction() {
573
+ this.actionButtonClicked.emit();
574
+ }
575
+ onClose() {
576
+ this.closed.emit();
577
+ }
578
+ }
579
+ CuiBannerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBannerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
580
+ 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: i2.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 });
581
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBannerComponent, decorators: [{
582
+ type: Component,
583
+ 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"] }]
584
+ }], propDecorators: { status: [{
585
+ type: Input
586
+ }, {
587
+ type: HostBinding,
588
+ args: ['attr.data-status']
589
+ }], isCloseable: [{
590
+ type: Input
591
+ }], label: [{
592
+ type: Input
593
+ }], actionButtonText: [{
594
+ type: Input
595
+ }], actionButtonClicked: [{
596
+ type: Output
597
+ }], closed: [{
598
+ type: Output
596
599
  }] } });
597
600
 
598
- class CuiBannerModule {
599
- }
600
- CuiBannerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBannerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
601
- CuiBannerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiBannerModule, declarations: [CuiBannerComponent], imports: [CommonModule,
602
- CuiLetDirective,
603
- CuiSvgModule,
604
- CuiButtonModule], exports: [CuiBannerComponent] });
605
- CuiBannerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBannerModule, imports: [CommonModule,
606
- CuiSvgModule,
607
- CuiButtonModule] });
608
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBannerModule, decorators: [{
609
- type: NgModule,
610
- args: [{
611
- imports: [
612
- CommonModule,
613
- CuiLetDirective,
614
- CuiSvgModule,
615
- CuiButtonModule
616
- ],
617
- declarations: [CuiBannerComponent],
618
- exports: [CuiBannerComponent]
619
- }]
601
+ class CuiBannerModule {
602
+ }
603
+ CuiBannerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBannerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
604
+ CuiBannerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiBannerModule, declarations: [CuiBannerComponent], imports: [CommonModule,
605
+ CuiLetDirective,
606
+ CuiSvgModule,
607
+ CuiButtonModule], exports: [CuiBannerComponent] });
608
+ CuiBannerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBannerModule, imports: [CommonModule,
609
+ CuiSvgModule,
610
+ CuiButtonModule] });
611
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBannerModule, decorators: [{
612
+ type: NgModule,
613
+ args: [{
614
+ imports: [
615
+ CommonModule,
616
+ CuiLetDirective,
617
+ CuiSvgModule,
618
+ CuiButtonModule
619
+ ],
620
+ declarations: [CuiBannerComponent],
621
+ exports: [CuiBannerComponent]
622
+ }]
620
623
  }] });
621
624
 
622
- class CuiBreadcrumbsComponent {
623
- }
624
- CuiBreadcrumbsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
625
- 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;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 });
626
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbsComponent, decorators: [{
627
- type: Component,
628
- 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;flex-wrap:wrap;gap:2px}\n"] }]
629
- }], propDecorators: { breadcrumbs: [{
630
- type: ContentChildren,
631
- args: [CuiItemDirective, { read: TemplateRef }]
625
+ class CuiBreadcrumbsComponent {
626
+ }
627
+ CuiBreadcrumbsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
628
+ 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;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 });
629
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbsComponent, decorators: [{
630
+ type: Component,
631
+ 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;flex-wrap:wrap;gap:2px}\n"] }]
632
+ }], propDecorators: { breadcrumbs: [{
633
+ type: ContentChildren,
634
+ args: [CuiItemDirective, { read: TemplateRef }]
632
635
  }] } });
633
636
 
634
- class CuiBreadcrumbComponent {
635
- constructor() {
636
- this.isLast = false;
637
- }
638
- }
639
- CuiBreadcrumbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
640
- 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 });
641
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbComponent, decorators: [{
642
- type: Component,
643
- 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"] }]
644
- }], propDecorators: { isLast: [{
645
- type: Input
637
+ class CuiBreadcrumbComponent {
638
+ constructor() {
639
+ this.isLast = false;
640
+ }
641
+ }
642
+ CuiBreadcrumbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
643
+ 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 });
644
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbComponent, decorators: [{
645
+ type: Component,
646
+ 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"] }]
647
+ }], propDecorators: { isLast: [{
648
+ type: Input
646
649
  }] } });
647
650
 
648
- class CuiBreadcrumbsModule {
649
- }
650
- CuiBreadcrumbsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
651
- CuiBreadcrumbsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbsModule, declarations: [CuiBreadcrumbsComponent,
652
- CuiBreadcrumbComponent], imports: [CommonModule,
653
- CuiSvgModule], exports: [CuiBreadcrumbsComponent,
654
- CuiBreadcrumbComponent] });
655
- CuiBreadcrumbsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbsModule, imports: [CommonModule,
656
- CuiSvgModule] });
657
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbsModule, decorators: [{
658
- type: NgModule,
659
- args: [{
660
- imports: [
661
- CommonModule,
662
- CuiSvgModule
663
- ],
664
- declarations: [
665
- CuiBreadcrumbsComponent,
666
- CuiBreadcrumbComponent
667
- ],
668
- exports: [
669
- CuiBreadcrumbsComponent,
670
- CuiBreadcrumbComponent
671
- ]
672
- }]
651
+ class CuiBreadcrumbsModule {
652
+ }
653
+ CuiBreadcrumbsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
654
+ CuiBreadcrumbsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbsModule, declarations: [CuiBreadcrumbsComponent,
655
+ CuiBreadcrumbComponent], imports: [CommonModule,
656
+ CuiSvgModule], exports: [CuiBreadcrumbsComponent,
657
+ CuiBreadcrumbComponent] });
658
+ CuiBreadcrumbsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbsModule, imports: [CommonModule,
659
+ CuiSvgModule] });
660
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiBreadcrumbsModule, decorators: [{
661
+ type: NgModule,
662
+ args: [{
663
+ imports: [
664
+ CommonModule,
665
+ CuiSvgModule
666
+ ],
667
+ declarations: [
668
+ CuiBreadcrumbsComponent,
669
+ CuiBreadcrumbComponent
670
+ ],
671
+ exports: [
672
+ CuiBreadcrumbsComponent,
673
+ CuiBreadcrumbComponent
674
+ ]
675
+ }]
673
676
  }] });
674
677
 
675
- class CuiButtonGroupComponent {
676
- }
677
- CuiButtonGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
678
- 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 });
679
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonGroupComponent, decorators: [{
680
- type: Component,
681
- 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"] }]
678
+ class CuiButtonGroupComponent {
679
+ }
680
+ CuiButtonGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
681
+ 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 });
682
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonGroupComponent, decorators: [{
683
+ type: Component,
684
+ 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"] }]
682
685
  }] });
683
686
 
684
- class CuiButtonGroupModule {
685
- }
686
- CuiButtonGroupModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonGroupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
687
- CuiButtonGroupModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonGroupModule, declarations: [CuiButtonGroupComponent], exports: [CuiButtonGroupComponent] });
688
- CuiButtonGroupModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonGroupModule });
689
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonGroupModule, decorators: [{
690
- type: NgModule,
691
- args: [{
692
- declarations: [CuiButtonGroupComponent],
693
- exports: [CuiButtonGroupComponent]
694
- }]
687
+ class CuiButtonGroupModule {
688
+ }
689
+ CuiButtonGroupModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonGroupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
690
+ CuiButtonGroupModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonGroupModule, declarations: [CuiButtonGroupComponent], exports: [CuiButtonGroupComponent] });
691
+ CuiButtonGroupModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonGroupModule });
692
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiButtonGroupModule, decorators: [{
693
+ type: NgModule,
694
+ args: [{
695
+ declarations: [CuiButtonGroupComponent],
696
+ exports: [CuiButtonGroupComponent]
697
+ }]
695
698
  }] });
696
699
 
697
- class CuiCheckboxComponent {
698
- }
699
- CuiCheckboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
700
- 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:var(--cui-base-0)}: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{background:var(--cui-gray-500)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
701
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiCheckboxComponent, decorators: [{
702
- type: Component,
703
- 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:var(--cui-base-0)}: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{background:var(--cui-gray-500)}\n"] }]
700
+ class CuiCheckboxComponent {
701
+ }
702
+ CuiCheckboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
703
+ 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:var(--cui-base-0)}: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{background:var(--cui-gray-500)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
704
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiCheckboxComponent, decorators: [{
705
+ type: Component,
706
+ 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:var(--cui-base-0)}: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{background:var(--cui-gray-500)}\n"] }]
704
707
  }] });
705
708
 
706
- class CuiCheckboxModule {
707
- }
708
- CuiCheckboxModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiCheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
709
- CuiCheckboxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiCheckboxModule, declarations: [CuiCheckboxComponent], exports: [CuiCheckboxComponent] });
710
- CuiCheckboxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiCheckboxModule });
711
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiCheckboxModule, decorators: [{
712
- type: NgModule,
713
- args: [{
714
- declarations: [CuiCheckboxComponent],
715
- exports: [CuiCheckboxComponent]
716
- }]
709
+ class CuiCheckboxModule {
710
+ }
711
+ CuiCheckboxModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiCheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
712
+ CuiCheckboxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiCheckboxModule, declarations: [CuiCheckboxComponent], exports: [CuiCheckboxComponent] });
713
+ CuiCheckboxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiCheckboxModule });
714
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiCheckboxModule, decorators: [{
715
+ type: NgModule,
716
+ args: [{
717
+ declarations: [CuiCheckboxComponent],
718
+ exports: [CuiCheckboxComponent]
719
+ }]
717
720
  }] });
718
721
 
719
722
  const CUI_ROOT_SELECTOR = 'cui-root';
720
723
 
721
- const CUI_DIALOGS = cuiCreateToken(new BehaviorSubject([]));
722
- const CUI_DIALOG_DEFAULT_OPTIONS = {
723
- size: 'auto',
724
- data: undefined
725
- };
726
- const CUI_DIALOG_OPTIONS = cuiCreateToken(CUI_DIALOG_DEFAULT_OPTIONS);
724
+ const CUI_DIALOGS = cuiCreateToken(new BehaviorSubject([]));
725
+ const CUI_DIALOG_DEFAULT_OPTIONS = {
726
+ size: 'auto',
727
+ data: undefined
728
+ };
729
+ const CUI_DIALOG_OPTIONS = cuiCreateToken(CUI_DIALOG_DEFAULT_OPTIONS);
727
730
  const CUI_DIALOG_CONTEXT = new InjectionToken('');
728
731
 
729
- class CuiDialogsComponent {
730
- constructor() {
731
- this.document = inject(DOCUMENT);
732
- this.destroy$ = inject(CuiDestroyService, { self: true });
733
- this.dialogs$ = inject(CUI_DIALOGS);
734
- this.dialogInjectorCache = new Map();
735
- }
736
- ngOnInit() {
737
- this.initDialogsSubscription();
738
- }
739
- trackByFn(_, dialog) {
740
- return dialog.id;
741
- }
742
- initDialogsSubscription() {
743
- this.dialogs$
744
- .pipe(takeUntil(this.destroy$))
745
- .subscribe(dialogs => {
746
- this.document.body.style.overflow = dialogs.length ? 'hidden' : '';
747
- this.dialogInjectors = dialogs.map(dialog => {
748
- if (!this.dialogInjectorCache.has(dialog.id)) {
749
- this.dialogInjectorCache.set(dialog.id, Injector.create({
750
- providers: [{ provide: CUI_DIALOG_CONTEXT, useValue: dialog }],
751
- parent: dialog.injector
752
- }));
753
- }
754
- return this.dialogInjectorCache.get(dialog.id);
755
- });
756
- this.dialogInjectorCache.forEach((_, dialogId) => {
757
- if (dialogs.find(dialog => dialog.id === dialogId)) {
758
- return;
759
- }
760
- this.dialogInjectorCache.delete(dialogId);
761
- });
762
- });
763
- }
764
- }
765
- CuiDialogsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
766
- 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: i2.CuiLetDirective, selector: "[cuiLet]", inputs: ["cuiLet"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
767
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogsComponent, decorators: [{
768
- type: Component,
769
- 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"] }]
732
+ class CuiDialogsComponent {
733
+ constructor() {
734
+ this.document = inject(DOCUMENT);
735
+ this.destroy$ = inject(CuiDestroyService, { self: true });
736
+ this.dialogs$ = inject(CUI_DIALOGS);
737
+ this.dialogInjectorCache = new Map();
738
+ }
739
+ ngOnInit() {
740
+ this.initDialogsSubscription();
741
+ }
742
+ trackByFn(_, dialog) {
743
+ return dialog.id;
744
+ }
745
+ initDialogsSubscription() {
746
+ this.dialogs$
747
+ .pipe(takeUntil(this.destroy$))
748
+ .subscribe(dialogs => {
749
+ this.document.body.style.overflow = dialogs.length ? 'hidden' : '';
750
+ this.dialogInjectors = dialogs.map(dialog => {
751
+ if (!this.dialogInjectorCache.has(dialog.id)) {
752
+ this.dialogInjectorCache.set(dialog.id, Injector.create({
753
+ providers: [{ provide: CUI_DIALOG_CONTEXT, useValue: dialog }],
754
+ parent: dialog.injector
755
+ }));
756
+ }
757
+ return this.dialogInjectorCache.get(dialog.id);
758
+ });
759
+ this.dialogInjectorCache.forEach((_, dialogId) => {
760
+ if (dialogs.find(dialog => dialog.id === dialogId)) {
761
+ return;
762
+ }
763
+ this.dialogInjectorCache.delete(dialogId);
764
+ });
765
+ });
766
+ }
767
+ }
768
+ CuiDialogsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
769
+ 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: i2.CuiLetDirective, selector: "[cuiLet]", inputs: ["cuiLet"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
770
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogsComponent, decorators: [{
771
+ type: Component,
772
+ 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"] }]
770
773
  }] });
771
774
 
772
- class CuiRootComponent {
773
- constructor() {
774
- this.document = inject(DOCUMENT);
775
- this.theme$ = inject(CuiThemeService);
776
- this.destroy$ = inject(CuiDestroyService);
777
- }
778
- ngOnInit() {
779
- this.initThemeSubscription();
780
- }
781
- initThemeSubscription() {
782
- this.theme$
783
- .pipe(takeUntil(this.destroy$))
784
- .subscribe(theme => this.document.documentElement.setAttribute('cuiTheme', theme));
785
- }
786
- }
787
- CuiRootComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRootComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
788
- 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{isolation:isolate}\n"], dependencies: [{ kind: "component", type: CuiDialogsComponent, selector: "cui-dialogs" }, { kind: "component", type: CuiAlertsComponent, selector: "cui-alerts" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
789
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRootComponent, decorators: [{
790
- type: Component,
791
- 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{isolation:isolate}\n"] }]
775
+ class CuiRootComponent {
776
+ constructor() {
777
+ this.document = inject(DOCUMENT);
778
+ this.theme$ = inject(CuiThemeService);
779
+ this.destroy$ = inject(CuiDestroyService);
780
+ }
781
+ ngOnInit() {
782
+ this.initThemeSubscription();
783
+ }
784
+ initThemeSubscription() {
785
+ this.theme$
786
+ .pipe(takeUntil(this.destroy$))
787
+ .subscribe(theme => this.document.documentElement.setAttribute('cuiTheme', theme));
788
+ }
789
+ }
790
+ CuiRootComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRootComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
791
+ 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{isolation:isolate}\n"], dependencies: [{ kind: "component", type: CuiDialogsComponent, selector: "cui-dialogs" }, { kind: "component", type: CuiAlertsComponent, selector: "cui-alerts" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
792
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRootComponent, decorators: [{
793
+ type: Component,
794
+ 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{isolation:isolate}\n"] }]
792
795
  }] });
793
796
 
794
- // TODO: сделать структурную директиву
795
- const ContentType = {
796
- String: 'string',
797
- Template: 'template',
798
- Component: 'component'
799
- };
800
- class CuiDialogComponent {
801
- constructor() {
802
- this.element = inject(ElementRef).nativeElement;
803
- this.context = inject(CUI_DIALOG_CONTEXT);
804
- this.LAST_OF_TYPE_SELECTOR = ':last-of-type';
805
- this.ContentType = ContentType;
806
- this.contentType = ContentType.Component;
807
- }
808
- get size() {
809
- return this.context.size;
810
- }
811
- ngOnInit() {
812
- this.initContentType();
813
- }
814
- get contentTemplateRef() {
815
- return this.context.content;
816
- }
817
- get componentType() {
818
- return this.context.content;
819
- }
820
- onEscape() {
821
- if (!this.element.matches(this.LAST_OF_TYPE_SELECTOR)) {
822
- return;
823
- }
824
- this.context.completeWith();
825
- }
826
- initContentType() {
827
- const content = this.context.content;
828
- switch (true) {
829
- case (typeof content === 'string'):
830
- this.contentType = ContentType.String;
831
- return;
832
- case (content instanceof TemplateRef):
833
- this.contentType = ContentType.Template;
834
- return;
835
- }
836
- }
837
- }
838
- CuiDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
839
- 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: i2.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)}: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 });
840
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogComponent, decorators: [{
841
- type: Component,
842
- 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)}: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"] }]
843
- }], propDecorators: { size: [{
844
- type: HostBinding,
845
- args: ['attr.data-size']
846
- }], onEscape: [{
847
- type: HostListener,
848
- args: ['document:keydown.escape', ['$event']]
797
+ // TODO: сделать структурную директиву
798
+ const ContentType = {
799
+ String: 'string',
800
+ Template: 'template',
801
+ Component: 'component'
802
+ };
803
+ class CuiDialogComponent {
804
+ constructor() {
805
+ this.element = inject(ElementRef).nativeElement;
806
+ this.context = inject(CUI_DIALOG_CONTEXT);
807
+ this.LAST_OF_TYPE_SELECTOR = ':last-of-type';
808
+ this.ContentType = ContentType;
809
+ this.contentType = ContentType.Component;
810
+ }
811
+ get size() {
812
+ return this.context.size;
813
+ }
814
+ ngOnInit() {
815
+ this.initContentType();
816
+ }
817
+ get contentTemplateRef() {
818
+ return this.context.content;
819
+ }
820
+ get componentType() {
821
+ return this.context.content;
822
+ }
823
+ onEscape() {
824
+ if (!this.element.matches(this.LAST_OF_TYPE_SELECTOR)) {
825
+ return;
826
+ }
827
+ this.context.completeWith();
828
+ }
829
+ initContentType() {
830
+ const content = this.context.content;
831
+ switch (true) {
832
+ case (typeof content === 'string'):
833
+ this.contentType = ContentType.String;
834
+ return;
835
+ case (content instanceof TemplateRef):
836
+ this.contentType = ContentType.Template;
837
+ return;
838
+ }
839
+ }
840
+ }
841
+ CuiDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
842
+ 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: i2.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)}: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 });
843
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogComponent, decorators: [{
844
+ type: Component,
845
+ 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)}: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"] }]
846
+ }], propDecorators: { size: [{
847
+ type: HostBinding,
848
+ args: ['attr.data-size']
849
+ }], onEscape: [{
850
+ type: HostListener,
851
+ args: ['document:keydown.escape', ['$event']]
849
852
  }] } });
850
853
 
851
- class CuiDialogActionsComponent {
852
- }
853
- CuiDialogActionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
854
- 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 });
855
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogActionsComponent, decorators: [{
856
- type: Component,
857
- 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"] }]
854
+ class CuiDialogActionsComponent {
855
+ }
856
+ CuiDialogActionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
857
+ 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 });
858
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogActionsComponent, decorators: [{
859
+ type: Component,
860
+ 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"] }]
858
861
  }] });
859
862
 
860
- class CuiDialogHeaderComponent {
861
- constructor() {
862
- this.closed = new EventEmitter();
863
- }
864
- onClose(event) {
865
- this.closed.emit(event);
866
- }
867
- }
868
- CuiDialogHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
869
- 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$1.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 });
870
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogHeaderComponent, decorators: [{
871
- type: Component,
872
- 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"] }]
873
- }], propDecorators: { heading: [{
874
- type: Input
875
- }], headingContext: [{
876
- type: Input
877
- }], subheading: [{
878
- type: Input
879
- }], closed: [{
880
- type: Output
863
+ class CuiDialogHeaderComponent {
864
+ constructor() {
865
+ this.closed = new EventEmitter();
866
+ }
867
+ onClose(event) {
868
+ this.closed.emit(event);
869
+ }
870
+ }
871
+ CuiDialogHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
872
+ 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$1.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 });
873
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogHeaderComponent, decorators: [{
874
+ type: Component,
875
+ 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"] }]
876
+ }], propDecorators: { heading: [{
877
+ type: Input
878
+ }], headingContext: [{
879
+ type: Input
880
+ }], subheading: [{
881
+ type: Input
882
+ }], closed: [{
883
+ type: Output
881
884
  }] } });
882
885
 
883
- class CuiDialogModule {
884
- }
885
- CuiDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
886
- CuiDialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogModule, declarations: [CuiDialogComponent,
887
- CuiDialogsComponent,
888
- CuiDialogActionsComponent,
889
- CuiDialogHeaderComponent], imports: [CommonModule,
890
- PolymorpheusModule,
891
- CuiLetDirective,
892
- CuiButtonModule], exports: [CuiDialogComponent,
893
- CuiDialogsComponent,
894
- CuiDialogActionsComponent,
895
- CuiDialogHeaderComponent] });
896
- CuiDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogModule, imports: [CommonModule,
897
- PolymorpheusModule,
898
- CuiButtonModule] });
899
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogModule, decorators: [{
900
- type: NgModule,
901
- args: [{
902
- imports: [
903
- CommonModule,
904
- PolymorpheusModule,
905
- CuiLetDirective,
906
- CuiButtonModule
907
- ],
908
- declarations: [
909
- CuiDialogComponent,
910
- CuiDialogsComponent,
911
- CuiDialogActionsComponent,
912
- CuiDialogHeaderComponent
913
- ],
914
- exports: [
915
- CuiDialogComponent,
916
- CuiDialogsComponent,
917
- CuiDialogActionsComponent,
918
- CuiDialogHeaderComponent
919
- ]
920
- }]
886
+ class CuiDialogModule {
887
+ }
888
+ CuiDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
889
+ CuiDialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogModule, declarations: [CuiDialogComponent,
890
+ CuiDialogsComponent,
891
+ CuiDialogActionsComponent,
892
+ CuiDialogHeaderComponent], imports: [CommonModule,
893
+ PolymorpheusModule,
894
+ CuiLetDirective,
895
+ CuiButtonModule], exports: [CuiDialogComponent,
896
+ CuiDialogsComponent,
897
+ CuiDialogActionsComponent,
898
+ CuiDialogHeaderComponent] });
899
+ CuiDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogModule, imports: [CommonModule,
900
+ PolymorpheusModule,
901
+ CuiButtonModule] });
902
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogModule, decorators: [{
903
+ type: NgModule,
904
+ args: [{
905
+ imports: [
906
+ CommonModule,
907
+ PolymorpheusModule,
908
+ CuiLetDirective,
909
+ CuiButtonModule
910
+ ],
911
+ declarations: [
912
+ CuiDialogComponent,
913
+ CuiDialogsComponent,
914
+ CuiDialogActionsComponent,
915
+ CuiDialogHeaderComponent
916
+ ],
917
+ exports: [
918
+ CuiDialogComponent,
919
+ CuiDialogsComponent,
920
+ CuiDialogActionsComponent,
921
+ CuiDialogHeaderComponent
922
+ ]
923
+ }]
921
924
  }] });
922
925
 
923
- class CuiDialogService extends CuiPopoverService {
924
- }
925
- CuiDialogService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
926
- 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)) });
927
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogService, decorators: [{
928
- type: Injectable,
929
- args: [{
930
- providedIn: 'root',
931
- useFactory: () => new CuiDialogService(CUI_DIALOGS, CuiDialogComponent, inject(CUI_DIALOG_OPTIONS))
932
- }]
926
+ class CuiDialogService extends CuiPopoverService {
927
+ }
928
+ CuiDialogService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
929
+ 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)) });
930
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiDialogService, decorators: [{
931
+ type: Injectable,
932
+ args: [{
933
+ providedIn: 'root',
934
+ useFactory: () => new CuiDialogService(CUI_DIALOGS, CuiDialogComponent, inject(CUI_DIALOG_OPTIONS))
935
+ }]
933
936
  }] });
934
937
 
935
- class CuiRootModule {
936
- }
937
- CuiRootModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRootModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
938
- CuiRootModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiRootModule, declarations: [CuiRootComponent], imports: [CommonModule,
939
- CuiDialogModule,
940
- CuiAlertModule], exports: [CuiRootComponent] });
941
- CuiRootModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRootModule, imports: [CommonModule,
942
- CuiDialogModule,
943
- CuiAlertModule] });
944
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRootModule, decorators: [{
945
- type: NgModule,
946
- args: [{
947
- imports: [
948
- CommonModule,
949
- CuiDialogModule,
950
- CuiAlertModule
951
- ],
952
- declarations: [CuiRootComponent],
953
- exports: [CuiRootComponent]
954
- }]
938
+ class CuiRootModule {
939
+ }
940
+ CuiRootModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRootModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
941
+ CuiRootModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiRootModule, declarations: [CuiRootComponent], imports: [CommonModule,
942
+ CuiDialogModule,
943
+ CuiAlertModule], exports: [CuiRootComponent] });
944
+ CuiRootModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRootModule, imports: [CommonModule,
945
+ CuiDialogModule,
946
+ CuiAlertModule] });
947
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRootModule, decorators: [{
948
+ type: NgModule,
949
+ args: [{
950
+ imports: [
951
+ CommonModule,
952
+ CuiDialogModule,
953
+ CuiAlertModule
954
+ ],
955
+ declarations: [CuiRootComponent],
956
+ exports: [CuiRootComponent]
957
+ }]
955
958
  }] });
956
959
 
957
- class CuiContextMenuComponent {
958
- constructor() {
959
- this.changeDetectorRef = inject(ChangeDetectorRef);
960
- this.viewContainerRef = inject(ViewContainerRef);
961
- this.document = inject(DOCUMENT);
962
- this.documentElement = this.document.documentElement;
963
- this.window = inject(CUI_WINDOW);
964
- this.destroy$ = inject(CuiDestroyService, { self: true });
965
- this.cuiClickOutsideDirective = inject(CuiClickOutsideDirective, { self: true });
966
- this.cuiTargetDirective = inject(CuiTargetDirective, { self: true });
967
- this.EXTRA_OFFSET_LEFT = 0;
968
- this.EXTRA_OFFSET_TOP = 0;
969
- this.isVisible = false;
970
- }
971
- ngOnInit() {
972
- this.initClickOutsideSubscription();
973
- }
974
- ngOnDestroy() {
975
- this.clearViewContainerRef();
976
- }
977
- ngAfterViewInit() {
978
- this.initTargetElementListener();
979
- }
980
- onSelect(item) {
981
- this.close();
982
- item.command?.();
983
- }
984
- onClose() {
985
- this.close();
986
- }
987
- onStopClickPropagation(event) {
988
- event.stopPropagation();
989
- }
990
- trackByFn(_, item) {
991
- return item.label;
992
- }
993
- initClickOutsideSubscription() {
994
- this.cuiClickOutsideDirective.cuiClickOutside
995
- .pipe(takeUntil(this.destroy$))
996
- .subscribe((target) => {
997
- if (this.target.contains(target)) {
998
- return;
999
- }
1000
- this.close();
1001
- });
1002
- }
1003
- initTargetElementListener() {
1004
- this.targetEventListener = (event) => {
1005
- event.stopPropagation();
1006
- this.document.body.click();
1007
- this.isVisible = !this.isVisible;
1008
- this.clearViewContainerRef();
1009
- if (this.isVisible) {
1010
- this.renderList();
1011
- this.changePosition(event.clientX, event.clientY);
1012
- this.initHidingSubscription();
1013
- }
1014
- this.changeDetectorRef.markForCheck();
1015
- };
1016
- this.cuiTargetDirective.clicked
1017
- .pipe(takeUntil(this.destroy$))
1018
- .subscribe(this.targetEventListener);
1019
- }
1020
- initHidingSubscription() {
1021
- this.initHidingFromWindowEvent('scroll');
1022
- this.initHidingFromWindowEvent('resize');
1023
- }
1024
- initHidingFromWindowEvent(eventName) {
1025
- fromEvent(this.window, eventName)
1026
- .pipe(take(1))
1027
- .subscribe(() => {
1028
- this.close();
1029
- this.changeDetectorRef.markForCheck();
1030
- });
1031
- }
1032
- close() {
1033
- this.isVisible = false;
1034
- this.clearViewContainerRef();
1035
- }
1036
- renderList() {
1037
- const embeddedViewRef = this.viewContainerRef.createEmbeddedView(this.list);
1038
- this.node = embeddedViewRef.rootNodes[0];
1039
- embeddedViewRef.detectChanges();
1040
- this.document.querySelector(CUI_ROOT_SELECTOR).appendChild(this.node);
1041
- }
1042
- changePosition(x, y) {
1043
- this.node.style.visibility = 'hidden';
1044
- setTimeout(() => {
1045
- const { clientWidth, clientHeight } = this.documentElement;
1046
- const width = this.node.offsetWidth;
1047
- const height = this.node.offsetHeight;
1048
- let left = x;
1049
- let top = y;
1050
- if (left + width > clientWidth) {
1051
- left -= width;
1052
- }
1053
- if (top + height > clientHeight) {
1054
- top -= height;
1055
- }
1056
- left = Math.max(left, this.EXTRA_OFFSET_LEFT);
1057
- top = Math.max(top, this.EXTRA_OFFSET_TOP);
1058
- this.node.style.left = left + 'px';
1059
- this.node.style.top = top + 'px';
1060
- this.node.style.visibility = '';
1061
- this.changeDetectorRef.markForCheck();
1062
- });
1063
- }
1064
- clearViewContainerRef() {
1065
- this.viewContainerRef.clear();
1066
- }
1067
- }
1068
- CuiContextMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiContextMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1069
- 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: i2.CuiClickOutsideDirective }, { directive: i2.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 });
1070
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiContextMenuComponent, decorators: [{
1071
- type: Component,
1072
- args: [{ selector: 'cui-context-menu[items][target]', changeDetection: ChangeDetectionStrategy.OnPush, providers: [CuiDestroyService], hostDirectives: [
1073
- CuiClickOutsideDirective,
1074
- {
1075
- directive: CuiTargetDirective,
1076
- inputs: ['ccTarget: target']
1077
- }
1078
- ], 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"] }]
1079
- }], propDecorators: { items: [{
1080
- type: Input
1081
- }], target: [{
1082
- type: Input
1083
- }], list: [{
1084
- type: ViewChild,
1085
- args: ['list']
1086
- }], onClose: [{
1087
- type: HostListener,
1088
- args: ['window:resize']
1089
- }], onStopClickPropagation: [{
1090
- type: HostListener,
1091
- args: ['click', ['$event']]
960
+ class CuiContextMenuComponent {
961
+ constructor() {
962
+ this.changeDetectorRef = inject(ChangeDetectorRef);
963
+ this.viewContainerRef = inject(ViewContainerRef);
964
+ this.document = inject(DOCUMENT);
965
+ this.documentElement = this.document.documentElement;
966
+ this.window = inject(CUI_WINDOW);
967
+ this.destroy$ = inject(CuiDestroyService, { self: true });
968
+ this.cuiClickOutsideDirective = inject(CuiClickOutsideDirective, { self: true });
969
+ this.cuiTargetDirective = inject(CuiTargetDirective, { self: true });
970
+ this.EXTRA_OFFSET_LEFT = 0;
971
+ this.EXTRA_OFFSET_TOP = 0;
972
+ this.isVisible = false;
973
+ }
974
+ ngOnInit() {
975
+ this.initClickOutsideSubscription();
976
+ }
977
+ ngOnDestroy() {
978
+ this.clearViewContainerRef();
979
+ }
980
+ ngAfterViewInit() {
981
+ this.initTargetElementListener();
982
+ }
983
+ onSelect(item) {
984
+ this.close();
985
+ item.command?.();
986
+ }
987
+ onClose() {
988
+ this.close();
989
+ }
990
+ onStopClickPropagation(event) {
991
+ event.stopPropagation();
992
+ }
993
+ trackByFn(_, item) {
994
+ return item.label;
995
+ }
996
+ initClickOutsideSubscription() {
997
+ this.cuiClickOutsideDirective.cuiClickOutside
998
+ .pipe(takeUntil(this.destroy$))
999
+ .subscribe((target) => {
1000
+ if (this.target.contains(target)) {
1001
+ return;
1002
+ }
1003
+ this.close();
1004
+ });
1005
+ }
1006
+ initTargetElementListener() {
1007
+ this.targetEventListener = (event) => {
1008
+ event.stopPropagation();
1009
+ this.document.body.click();
1010
+ this.isVisible = !this.isVisible;
1011
+ this.clearViewContainerRef();
1012
+ if (this.isVisible) {
1013
+ this.renderList();
1014
+ this.changePosition(event.clientX, event.clientY);
1015
+ this.initHidingSubscription();
1016
+ }
1017
+ this.changeDetectorRef.markForCheck();
1018
+ };
1019
+ this.cuiTargetDirective.clicked
1020
+ .pipe(takeUntil(this.destroy$))
1021
+ .subscribe(this.targetEventListener);
1022
+ }
1023
+ initHidingSubscription() {
1024
+ this.initHidingFromWindowEvent('scroll');
1025
+ this.initHidingFromWindowEvent('resize');
1026
+ }
1027
+ initHidingFromWindowEvent(eventName) {
1028
+ fromEvent(this.window, eventName)
1029
+ .pipe(take(1))
1030
+ .subscribe(() => {
1031
+ this.close();
1032
+ this.changeDetectorRef.markForCheck();
1033
+ });
1034
+ }
1035
+ close() {
1036
+ this.isVisible = false;
1037
+ this.clearViewContainerRef();
1038
+ }
1039
+ renderList() {
1040
+ const embeddedViewRef = this.viewContainerRef.createEmbeddedView(this.list);
1041
+ this.node = embeddedViewRef.rootNodes[0];
1042
+ embeddedViewRef.detectChanges();
1043
+ this.document.querySelector(CUI_ROOT_SELECTOR).appendChild(this.node);
1044
+ }
1045
+ changePosition(x, y) {
1046
+ this.node.style.visibility = 'hidden';
1047
+ setTimeout(() => {
1048
+ const { clientWidth, clientHeight } = this.documentElement;
1049
+ const width = this.node.offsetWidth;
1050
+ const height = this.node.offsetHeight;
1051
+ let left = x;
1052
+ let top = y;
1053
+ if (left + width > clientWidth) {
1054
+ left -= width;
1055
+ }
1056
+ if (top + height > clientHeight) {
1057
+ top -= height;
1058
+ }
1059
+ left = Math.max(left, this.EXTRA_OFFSET_LEFT);
1060
+ top = Math.max(top, this.EXTRA_OFFSET_TOP);
1061
+ this.node.style.left = left + 'px';
1062
+ this.node.style.top = top + 'px';
1063
+ this.node.style.visibility = '';
1064
+ this.changeDetectorRef.markForCheck();
1065
+ });
1066
+ }
1067
+ clearViewContainerRef() {
1068
+ this.viewContainerRef.clear();
1069
+ }
1070
+ }
1071
+ CuiContextMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiContextMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1072
+ 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: i2.CuiClickOutsideDirective }, { directive: i2.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 });
1073
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiContextMenuComponent, decorators: [{
1074
+ type: Component,
1075
+ args: [{ selector: 'cui-context-menu[items][target]', changeDetection: ChangeDetectionStrategy.OnPush, providers: [CuiDestroyService], hostDirectives: [
1076
+ CuiClickOutsideDirective,
1077
+ {
1078
+ directive: CuiTargetDirective,
1079
+ inputs: ['ccTarget: target']
1080
+ }
1081
+ ], 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"] }]
1082
+ }], propDecorators: { items: [{
1083
+ type: Input
1084
+ }], target: [{
1085
+ type: Input
1086
+ }], list: [{
1087
+ type: ViewChild,
1088
+ args: ['list']
1089
+ }], onClose: [{
1090
+ type: HostListener,
1091
+ args: ['window:resize']
1092
+ }], onStopClickPropagation: [{
1093
+ type: HostListener,
1094
+ args: ['click', ['$event']]
1092
1095
  }] } });
1093
1096
 
1094
- class CuiContextMenuModule {
1095
- }
1096
- CuiContextMenuModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiContextMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1097
- CuiContextMenuModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiContextMenuModule, declarations: [CuiContextMenuComponent], imports: [CommonModule,
1098
- CuiSvgModule], exports: [CuiContextMenuComponent] });
1099
- CuiContextMenuModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiContextMenuModule, imports: [CommonModule,
1100
- CuiSvgModule] });
1101
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiContextMenuModule, decorators: [{
1102
- type: NgModule,
1103
- args: [{
1104
- imports: [
1105
- CommonModule,
1106
- CuiSvgModule
1107
- ],
1108
- declarations: [CuiContextMenuComponent],
1109
- exports: [CuiContextMenuComponent]
1110
- }]
1097
+ class CuiContextMenuModule {
1098
+ }
1099
+ CuiContextMenuModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiContextMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1100
+ CuiContextMenuModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiContextMenuModule, declarations: [CuiContextMenuComponent], imports: [CommonModule,
1101
+ CuiSvgModule], exports: [CuiContextMenuComponent] });
1102
+ CuiContextMenuModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiContextMenuModule, imports: [CommonModule,
1103
+ CuiSvgModule] });
1104
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiContextMenuModule, decorators: [{
1105
+ type: NgModule,
1106
+ args: [{
1107
+ imports: [
1108
+ CommonModule,
1109
+ CuiSvgModule
1110
+ ],
1111
+ declarations: [CuiContextMenuComponent],
1112
+ exports: [CuiContextMenuComponent]
1113
+ }]
1111
1114
  }] });
1112
1115
 
1113
- class CuiFormFieldComponent {
1114
- }
1115
- CuiFormFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiFormFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1116
- 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 });
1117
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiFormFieldComponent, decorators: [{
1118
- type: Component,
1119
- 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"] }]
1116
+ class CuiFormFieldComponent {
1117
+ }
1118
+ CuiFormFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiFormFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1119
+ 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 });
1120
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiFormFieldComponent, decorators: [{
1121
+ type: Component,
1122
+ 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"] }]
1120
1123
  }] });
1121
1124
 
1122
- class CuiFormFieldModule {
1123
- }
1124
- CuiFormFieldModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiFormFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1125
- CuiFormFieldModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiFormFieldModule, declarations: [CuiFormFieldComponent], exports: [CuiFormFieldComponent] });
1126
- CuiFormFieldModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiFormFieldModule });
1127
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiFormFieldModule, decorators: [{
1128
- type: NgModule,
1129
- args: [{
1130
- declarations: [CuiFormFieldComponent],
1131
- exports: [CuiFormFieldComponent]
1132
- }]
1125
+ class CuiFormFieldModule {
1126
+ }
1127
+ CuiFormFieldModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiFormFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1128
+ CuiFormFieldModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiFormFieldModule, declarations: [CuiFormFieldComponent], exports: [CuiFormFieldComponent] });
1129
+ CuiFormFieldModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiFormFieldModule });
1130
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiFormFieldModule, decorators: [{
1131
+ type: NgModule,
1132
+ args: [{
1133
+ declarations: [CuiFormFieldComponent],
1134
+ exports: [CuiFormFieldComponent]
1135
+ }]
1133
1136
  }] });
1134
1137
 
1135
- class CuiHintComponent {
1136
- constructor() {
1137
- this.hintType = 'info';
1138
- }
1139
- }
1140
- CuiHintComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiHintComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1141
- 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 });
1142
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiHintComponent, decorators: [{
1143
- type: Component,
1144
- 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"] }]
1145
- }], propDecorators: { hintType: [{
1146
- type: Input
1147
- }, {
1148
- type: HostBinding,
1149
- args: ['attr.data-hint-type']
1138
+ class CuiHintComponent {
1139
+ constructor() {
1140
+ this.hintType = 'info';
1141
+ }
1142
+ }
1143
+ CuiHintComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiHintComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1144
+ 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 });
1145
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiHintComponent, decorators: [{
1146
+ type: Component,
1147
+ 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"] }]
1148
+ }], propDecorators: { hintType: [{
1149
+ type: Input
1150
+ }, {
1151
+ type: HostBinding,
1152
+ args: ['attr.data-hint-type']
1150
1153
  }] } });
1151
1154
 
1152
- class CuiHintModule {
1153
- }
1154
- CuiHintModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiHintModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1155
- CuiHintModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiHintModule, declarations: [CuiHintComponent], exports: [CuiHintComponent] });
1156
- CuiHintModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiHintModule });
1157
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiHintModule, decorators: [{
1158
- type: NgModule,
1159
- args: [{
1160
- declarations: [CuiHintComponent],
1161
- exports: [CuiHintComponent]
1162
- }]
1155
+ class CuiHintModule {
1156
+ }
1157
+ CuiHintModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiHintModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1158
+ CuiHintModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiHintModule, declarations: [CuiHintComponent], exports: [CuiHintComponent] });
1159
+ CuiHintModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiHintModule });
1160
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiHintModule, decorators: [{
1161
+ type: NgModule,
1162
+ args: [{
1163
+ declarations: [CuiHintComponent],
1164
+ exports: [CuiHintComponent]
1165
+ }]
1163
1166
  }] });
1164
1167
 
1165
- class CuiIconButtonComponent {
1166
- constructor() {
1167
- this.ICON_WIDTH = 16;
1168
- this.ICON_HEIGHT = 16;
1169
- this.ICON_STROKE_WIDTH = 1.5;
1170
- }
1171
- get isWithHoverColor() {
1172
- return !!this.hoverColor;
1173
- }
1174
- }
1175
- CuiIconButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiIconButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1176
- 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 });
1177
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiIconButtonComponent, decorators: [{
1178
- type: Component,
1179
- 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"] }]
1180
- }], propDecorators: { icon: [{
1181
- type: Input
1182
- }], color: [{
1183
- type: Input
1184
- }], hoverColor: [{
1185
- type: Input
1186
- }, {
1187
- type: HostBinding,
1188
- args: ['style.--icon-hover-color']
1189
- }], isWithHoverColor: [{
1190
- type: HostBinding,
1191
- args: ['class._with-hover-color']
1168
+ class CuiIconButtonComponent {
1169
+ constructor() {
1170
+ this.ICON_WIDTH = 16;
1171
+ this.ICON_HEIGHT = 16;
1172
+ this.ICON_STROKE_WIDTH = 1.5;
1173
+ }
1174
+ get isWithHoverColor() {
1175
+ return !!this.hoverColor;
1176
+ }
1177
+ }
1178
+ CuiIconButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiIconButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1179
+ 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 });
1180
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiIconButtonComponent, decorators: [{
1181
+ type: Component,
1182
+ 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"] }]
1183
+ }], propDecorators: { icon: [{
1184
+ type: Input
1185
+ }], color: [{
1186
+ type: Input
1187
+ }], hoverColor: [{
1188
+ type: Input
1189
+ }, {
1190
+ type: HostBinding,
1191
+ args: ['style.--icon-hover-color']
1192
+ }], isWithHoverColor: [{
1193
+ type: HostBinding,
1194
+ args: ['class._with-hover-color']
1192
1195
  }] } });
1193
1196
 
1194
- class CuiIconButtonModule {
1195
- }
1196
- CuiIconButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiIconButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1197
- CuiIconButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiIconButtonModule, declarations: [CuiIconButtonComponent], imports: [CommonModule,
1198
- CuiSvgModule], exports: [CuiIconButtonComponent] });
1199
- CuiIconButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiIconButtonModule, imports: [CommonModule,
1200
- CuiSvgModule] });
1201
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiIconButtonModule, decorators: [{
1202
- type: NgModule,
1203
- args: [{
1204
- imports: [
1205
- CommonModule,
1206
- CuiSvgModule
1207
- ],
1208
- declarations: [CuiIconButtonComponent],
1209
- exports: [CuiIconButtonComponent]
1210
- }]
1197
+ class CuiIconButtonModule {
1198
+ }
1199
+ CuiIconButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiIconButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1200
+ CuiIconButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiIconButtonModule, declarations: [CuiIconButtonComponent], imports: [CommonModule,
1201
+ CuiSvgModule], exports: [CuiIconButtonComponent] });
1202
+ CuiIconButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiIconButtonModule, imports: [CommonModule,
1203
+ CuiSvgModule] });
1204
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiIconButtonModule, decorators: [{
1205
+ type: NgModule,
1206
+ args: [{
1207
+ imports: [
1208
+ CommonModule,
1209
+ CuiSvgModule
1210
+ ],
1211
+ declarations: [CuiIconButtonComponent],
1212
+ exports: [CuiIconButtonComponent]
1213
+ }]
1211
1214
  }] });
1212
1215
 
1213
- const CUI_INPUT_NUMBER_DEFAULT_OPTIONS = {
1214
- min: -Infinity,
1215
- max: Infinity,
1216
- step: 1,
1217
- precision: 3
1218
- };
1219
- const CUI_INPUT_NUMBER_OPTIONS = new InjectionToken('', {
1220
- factory: () => CUI_INPUT_NUMBER_DEFAULT_OPTIONS
1216
+ const CUI_INPUT_NUMBER_DEFAULT_OPTIONS = {
1217
+ min: -Infinity,
1218
+ max: Infinity,
1219
+ step: 1,
1220
+ precision: 3
1221
+ };
1222
+ const CUI_INPUT_NUMBER_OPTIONS = new InjectionToken('', {
1223
+ factory: () => CUI_INPUT_NUMBER_DEFAULT_OPTIONS
1221
1224
  });
1222
1225
 
1223
- function cuiRemoveSpaces(value) {
1224
- return value.replace(/\s+/g, '');
1225
- }
1226
-
1227
- function cuiReplace(value, search, replace) {
1228
- const regex = new RegExp(search.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'), 'g');
1229
- return value.replace(regex, replace);
1230
- }
1231
-
1232
- class CuiTextFieldController {
1233
- constructor(iconLeftDirective, idDirective, isErrorDirective, placeholderDirective, sizeDirective) {
1234
- this.iconLeftDirective = iconLeftDirective;
1235
- this.idDirective = idDirective;
1236
- this.isErrorDirective = isErrorDirective;
1237
- this.placeholderDirective = placeholderDirective;
1238
- this.sizeDirective = sizeDirective;
1239
- }
1240
- get iconLeft() {
1241
- return this.iconLeftDirective.iconLeft;
1242
- }
1243
- get id() {
1244
- return this.idDirective.id;
1245
- }
1246
- get isError() {
1247
- return this.isErrorDirective.isError;
1248
- }
1249
- get placeholder() {
1250
- return this.placeholderDirective.placeholder;
1251
- }
1252
- get size() {
1253
- return this.sizeDirective.size;
1254
- }
1255
- }
1256
-
1257
- const CUI_TEXT_FIELD_ICON_LEFT = new InjectionToken('', {
1258
- factory: () => new CuiTextFieldIconLeftDirective()
1259
- });
1260
- class CuiTextFieldIconLeftDirective {
1261
- }
1262
- CuiTextFieldIconLeftDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldIconLeftDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1263
- 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 });
1264
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldIconLeftDirective, decorators: [{
1265
- type: Directive,
1266
- args: [{
1267
- selector: '[cuiTextFieldIconLeft]',
1268
- providers: [cuiProvide(CUI_TEXT_FIELD_ICON_LEFT, CuiTextFieldIconLeftDirective)]
1269
- }]
1270
- }], propDecorators: { iconLeft: [{
1271
- type: Input,
1272
- args: ['cuiTextFieldIconLeft']
1226
+ function cuiRemoveSpaces(value) {
1227
+ return value.replace(/\s+/g, '');
1228
+ }
1229
+
1230
+ function cuiReplace(value, search, replace) {
1231
+ const regex = new RegExp(search.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'), 'g');
1232
+ return value.replace(regex, replace);
1233
+ }
1234
+
1235
+ class CuiTextFieldController {
1236
+ constructor(iconLeftDirective, idDirective, isErrorDirective, placeholderDirective, sizeDirective) {
1237
+ this.iconLeftDirective = iconLeftDirective;
1238
+ this.idDirective = idDirective;
1239
+ this.isErrorDirective = isErrorDirective;
1240
+ this.placeholderDirective = placeholderDirective;
1241
+ this.sizeDirective = sizeDirective;
1242
+ }
1243
+ get iconLeft() {
1244
+ return this.iconLeftDirective.iconLeft;
1245
+ }
1246
+ get id() {
1247
+ return this.idDirective.id;
1248
+ }
1249
+ get isError() {
1250
+ return this.isErrorDirective.isError;
1251
+ }
1252
+ get placeholder() {
1253
+ return this.placeholderDirective.placeholder;
1254
+ }
1255
+ get size() {
1256
+ return this.sizeDirective.size;
1257
+ }
1258
+ }
1259
+
1260
+ const CUI_TEXT_FIELD_ICON_LEFT = new InjectionToken('', {
1261
+ factory: () => new CuiTextFieldIconLeftDirective()
1262
+ });
1263
+ class CuiTextFieldIconLeftDirective {
1264
+ }
1265
+ CuiTextFieldIconLeftDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldIconLeftDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1266
+ 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 });
1267
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldIconLeftDirective, decorators: [{
1268
+ type: Directive,
1269
+ args: [{
1270
+ selector: '[cuiTextFieldIconLeft]',
1271
+ providers: [cuiProvide(CUI_TEXT_FIELD_ICON_LEFT, CuiTextFieldIconLeftDirective)]
1272
+ }]
1273
+ }], propDecorators: { iconLeft: [{
1274
+ type: Input,
1275
+ args: ['cuiTextFieldIconLeft']
1273
1276
  }] } });
1274
1277
 
1275
- const CUI_TEXT_FIELD_ID = new InjectionToken('', {
1276
- factory: () => new CuiTextFieldIdDirective()
1277
- });
1278
- class CuiTextFieldIdDirective {
1279
- }
1280
- CuiTextFieldIdDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldIdDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1281
- 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 });
1282
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldIdDirective, decorators: [{
1283
- type: Directive,
1284
- args: [{
1285
- selector: '[cuiTextFieldId]',
1286
- providers: [cuiProvide(CUI_TEXT_FIELD_ID, CuiTextFieldIdDirective)]
1287
- }]
1288
- }], propDecorators: { id: [{
1289
- type: Input,
1290
- args: ['cuiTextFieldId']
1278
+ const CUI_TEXT_FIELD_ID = new InjectionToken('', {
1279
+ factory: () => new CuiTextFieldIdDirective()
1280
+ });
1281
+ class CuiTextFieldIdDirective {
1282
+ }
1283
+ CuiTextFieldIdDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldIdDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1284
+ 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 });
1285
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldIdDirective, decorators: [{
1286
+ type: Directive,
1287
+ args: [{
1288
+ selector: '[cuiTextFieldId]',
1289
+ providers: [cuiProvide(CUI_TEXT_FIELD_ID, CuiTextFieldIdDirective)]
1290
+ }]
1291
+ }], propDecorators: { id: [{
1292
+ type: Input,
1293
+ args: ['cuiTextFieldId']
1291
1294
  }] } });
1292
1295
 
1293
- const CUI_TEXT_FIELD_IS_ERROR = new InjectionToken('', {
1294
- factory: () => new CuiTextFieldIsErrorDirective()
1295
- });
1296
- class CuiTextFieldIsErrorDirective {
1297
- constructor() {
1298
- this.isError = false;
1299
- }
1300
- }
1301
- CuiTextFieldIsErrorDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldIsErrorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1302
- 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 });
1303
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldIsErrorDirective, decorators: [{
1304
- type: Directive,
1305
- args: [{
1306
- selector: '[cuiTextFieldIsError]',
1307
- providers: [cuiProvide(CUI_TEXT_FIELD_IS_ERROR, CuiTextFieldIsErrorDirective)]
1308
- }]
1309
- }], propDecorators: { isError: [{
1310
- type: Input,
1311
- args: ['cuiTextFieldIsError']
1296
+ const CUI_TEXT_FIELD_IS_ERROR = new InjectionToken('', {
1297
+ factory: () => new CuiTextFieldIsErrorDirective()
1298
+ });
1299
+ class CuiTextFieldIsErrorDirective {
1300
+ constructor() {
1301
+ this.isError = false;
1302
+ }
1303
+ }
1304
+ CuiTextFieldIsErrorDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldIsErrorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1305
+ 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 });
1306
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldIsErrorDirective, decorators: [{
1307
+ type: Directive,
1308
+ args: [{
1309
+ selector: '[cuiTextFieldIsError]',
1310
+ providers: [cuiProvide(CUI_TEXT_FIELD_IS_ERROR, CuiTextFieldIsErrorDirective)]
1311
+ }]
1312
+ }], propDecorators: { isError: [{
1313
+ type: Input,
1314
+ args: ['cuiTextFieldIsError']
1312
1315
  }] } });
1313
1316
 
1314
- const CUI_TEXT_FIELD_PLACEHOLDER = new InjectionToken('', {
1315
- factory: () => new CuiTextFieldPlaceholderDirective()
1316
- });
1317
- class CuiTextFieldPlaceholderDirective {
1318
- }
1319
- CuiTextFieldPlaceholderDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldPlaceholderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1320
- 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 });
1321
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldPlaceholderDirective, decorators: [{
1322
- type: Directive,
1323
- args: [{
1324
- selector: '[cuiTextFieldPlaceholder]',
1325
- providers: [cuiProvide(CUI_TEXT_FIELD_PLACEHOLDER, CuiTextFieldPlaceholderDirective)]
1326
- }]
1327
- }], propDecorators: { placeholder: [{
1328
- type: Input,
1329
- args: ['cuiTextFieldPlaceholder']
1317
+ const CUI_TEXT_FIELD_PLACEHOLDER = new InjectionToken('', {
1318
+ factory: () => new CuiTextFieldPlaceholderDirective()
1319
+ });
1320
+ class CuiTextFieldPlaceholderDirective {
1321
+ }
1322
+ CuiTextFieldPlaceholderDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldPlaceholderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1323
+ 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 });
1324
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldPlaceholderDirective, decorators: [{
1325
+ type: Directive,
1326
+ args: [{
1327
+ selector: '[cuiTextFieldPlaceholder]',
1328
+ providers: [cuiProvide(CUI_TEXT_FIELD_PLACEHOLDER, CuiTextFieldPlaceholderDirective)]
1329
+ }]
1330
+ }], propDecorators: { placeholder: [{
1331
+ type: Input,
1332
+ args: ['cuiTextFieldPlaceholder']
1330
1333
  }] } });
1331
1334
 
1332
- const CUI_TEXT_FIELD_SIZE = new InjectionToken('', {
1333
- factory: () => new CuiTextFieldSizeDirective()
1334
- });
1335
- class CuiTextFieldSizeDirective {
1336
- constructor() {
1337
- this.size = 'sm';
1338
- }
1339
- }
1340
- CuiTextFieldSizeDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldSizeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1341
- 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 });
1342
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldSizeDirective, decorators: [{
1343
- type: Directive,
1344
- args: [{
1345
- selector: '[cuiTextFieldSize]',
1346
- providers: [cuiProvide(CUI_TEXT_FIELD_SIZE, CuiTextFieldSizeDirective)]
1347
- }]
1348
- }], propDecorators: { size: [{
1349
- type: Input,
1350
- args: ['cuiTextFieldSize']
1335
+ const CUI_TEXT_FIELD_SIZE = new InjectionToken('', {
1336
+ factory: () => new CuiTextFieldSizeDirective()
1337
+ });
1338
+ class CuiTextFieldSizeDirective {
1339
+ constructor() {
1340
+ this.size = 'sm';
1341
+ }
1342
+ }
1343
+ CuiTextFieldSizeDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldSizeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1344
+ 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 });
1345
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldSizeDirective, decorators: [{
1346
+ type: Directive,
1347
+ args: [{
1348
+ selector: '[cuiTextFieldSize]',
1349
+ providers: [cuiProvide(CUI_TEXT_FIELD_SIZE, CuiTextFieldSizeDirective)]
1350
+ }]
1351
+ }], propDecorators: { size: [{
1352
+ type: Input,
1353
+ args: ['cuiTextFieldSize']
1351
1354
  }] } });
1352
1355
 
1353
- class CuiTextFieldControllerModule {
1354
- }
1355
- CuiTextFieldControllerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldControllerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1356
- CuiTextFieldControllerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldControllerModule, declarations: [CuiTextFieldIconLeftDirective,
1357
- CuiTextFieldIdDirective,
1358
- CuiTextFieldPlaceholderDirective,
1359
- CuiTextFieldIsErrorDirective,
1360
- CuiTextFieldSizeDirective], exports: [CuiTextFieldIconLeftDirective,
1361
- CuiTextFieldIdDirective,
1362
- CuiTextFieldPlaceholderDirective,
1363
- CuiTextFieldIsErrorDirective,
1364
- CuiTextFieldSizeDirective] });
1365
- CuiTextFieldControllerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldControllerModule });
1366
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldControllerModule, decorators: [{
1367
- type: NgModule,
1368
- args: [{
1369
- declarations: [
1370
- CuiTextFieldIconLeftDirective,
1371
- CuiTextFieldIdDirective,
1372
- CuiTextFieldPlaceholderDirective,
1373
- CuiTextFieldIsErrorDirective,
1374
- CuiTextFieldSizeDirective
1375
- ],
1376
- exports: [
1377
- CuiTextFieldIconLeftDirective,
1378
- CuiTextFieldIdDirective,
1379
- CuiTextFieldPlaceholderDirective,
1380
- CuiTextFieldIsErrorDirective,
1381
- CuiTextFieldSizeDirective
1382
- ]
1383
- }]
1356
+ class CuiTextFieldControllerModule {
1357
+ }
1358
+ CuiTextFieldControllerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldControllerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1359
+ CuiTextFieldControllerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldControllerModule, declarations: [CuiTextFieldIconLeftDirective,
1360
+ CuiTextFieldIdDirective,
1361
+ CuiTextFieldPlaceholderDirective,
1362
+ CuiTextFieldIsErrorDirective,
1363
+ CuiTextFieldSizeDirective], exports: [CuiTextFieldIconLeftDirective,
1364
+ CuiTextFieldIdDirective,
1365
+ CuiTextFieldPlaceholderDirective,
1366
+ CuiTextFieldIsErrorDirective,
1367
+ CuiTextFieldSizeDirective] });
1368
+ CuiTextFieldControllerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldControllerModule });
1369
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextFieldControllerModule, decorators: [{
1370
+ type: NgModule,
1371
+ args: [{
1372
+ declarations: [
1373
+ CuiTextFieldIconLeftDirective,
1374
+ CuiTextFieldIdDirective,
1375
+ CuiTextFieldPlaceholderDirective,
1376
+ CuiTextFieldIsErrorDirective,
1377
+ CuiTextFieldSizeDirective
1378
+ ],
1379
+ exports: [
1380
+ CuiTextFieldIconLeftDirective,
1381
+ CuiTextFieldIdDirective,
1382
+ CuiTextFieldPlaceholderDirective,
1383
+ CuiTextFieldIsErrorDirective,
1384
+ CuiTextFieldSizeDirective
1385
+ ]
1386
+ }]
1384
1387
  }] });
1385
1388
 
1386
- const CUI_TEXT_FIELD_CONTROLLER = new InjectionToken('');
1387
- const CUI_TEXT_FILED_CONTROLLER_PROVIDER = [
1388
- {
1389
- provide: CUI_TEXT_FIELD_CONTROLLER,
1390
- useFactory: (...controllers) => {
1391
- return new CuiTextFieldController(...controllers);
1392
- },
1393
- deps: [
1394
- CUI_TEXT_FIELD_ICON_LEFT,
1395
- CUI_TEXT_FIELD_ID,
1396
- CUI_TEXT_FIELD_IS_ERROR,
1397
- CUI_TEXT_FIELD_PLACEHOLDER,
1398
- CUI_TEXT_FIELD_SIZE
1399
- ]
1400
- }
1389
+ const CUI_TEXT_FIELD_CONTROLLER = new InjectionToken('');
1390
+ const CUI_TEXT_FILED_CONTROLLER_PROVIDER = [
1391
+ {
1392
+ provide: CUI_TEXT_FIELD_CONTROLLER,
1393
+ useFactory: (...controllers) => {
1394
+ return new CuiTextFieldController(...controllers);
1395
+ },
1396
+ deps: [
1397
+ CUI_TEXT_FIELD_ICON_LEFT,
1398
+ CUI_TEXT_FIELD_ID,
1399
+ CUI_TEXT_FIELD_IS_ERROR,
1400
+ CUI_TEXT_FIELD_PLACEHOLDER,
1401
+ CUI_TEXT_FIELD_SIZE
1402
+ ]
1403
+ }
1401
1404
  ];
1402
1405
 
1403
- class CuiInputNumberComponent {
1404
- constructor() {
1405
- this.changeDetectorRef = inject(ChangeDetectorRef);
1406
- this.cuiTextFieldController = inject(CUI_TEXT_FIELD_CONTROLLER);
1407
- this.cuiInputNumberOptions = inject(CUI_INPUT_NUMBER_OPTIONS);
1408
- this.MIN_JS_NUMBER = -(2 ** 53);
1409
- this.MAX_JS_NUMBER = 2 ** 53;
1410
- this.INPUT_VALUE_REGEX = /^-?[\d\s]*(,\d*)?$/;
1411
- this.INTERVAL_BETWEEN_SPACES = 3;
1412
- this.formattedValue = '';
1413
- this._min = this.calculateValidMinValue(this.cuiInputNumberOptions.min);
1414
- this._max = this.calculateValidMaxValue(this.cuiInputNumberOptions.max);
1415
- this.step = this.cuiInputNumberOptions.step;
1416
- this.precision = this.cuiInputNumberOptions.precision;
1417
- }
1418
- set min(min) {
1419
- this._min = this.calculateValidMinValue(min);
1420
- }
1421
- set max(max) {
1422
- this._max = this.calculateValidMaxValue(max);
1423
- }
1424
- get id() {
1425
- return this.cuiTextFieldController.id;
1426
- }
1427
- get placeholder() {
1428
- return this.cuiTextFieldController.placeholder;
1429
- }
1430
- get iconLeft() {
1431
- return this.cuiTextFieldController.iconLeft;
1432
- }
1433
- get size() {
1434
- return this.cuiTextFieldController.size;
1435
- }
1436
- get isError() {
1437
- return this.cuiTextFieldController.isError;
1438
- }
1439
- writeValue(value) {
1440
- this.value = value?.toString() ?? null;
1441
- this.formattedValue = this.formatValue(this.value);
1442
- this.changeDetectorRef.markForCheck();
1443
- }
1444
- registerOnChange(fn) {
1445
- this.onChange = fn;
1446
- }
1447
- registerOnTouched(fn) {
1448
- this.onTouched = fn;
1449
- }
1450
- setDisabledState(isDisabled) {
1451
- this.isDisabled = isDisabled;
1452
- this.changeDetectorRef.markForCheck();
1453
- }
1454
- onInput(event) {
1455
- const eventTarget = event.target;
1456
- const targetValue = eventTarget.value;
1457
- const selectionStart = this.input.nativeElement.selectionStart ?? 0;
1458
- const previousFormattedValue = this.formattedValue;
1459
- if (this.isInputValueCorrect(targetValue)) {
1460
- const parsedValue = this.parseValue(targetValue);
1461
- this.changeModel(parsedValue);
1462
- }
1463
- this.formattedValue = this.formatValue(this.value);
1464
- eventTarget.value = this.formattedValue;
1465
- const currentCaretPosition = selectionStart
1466
- + (this.formattedValue.length - previousFormattedValue.length === 2 ? 1 : 0);
1467
- this.input.nativeElement.setSelectionRange(currentCaretPosition, currentCaretPosition);
1468
- }
1469
- onArrowUp() {
1470
- this.increaseByStep();
1471
- }
1472
- onArrowDown() {
1473
- this.decreaseByStep();
1474
- }
1475
- onFocus() {
1476
- this.input.nativeElement.focus();
1477
- }
1478
- isInputValueCorrect(inputValue) {
1479
- return this.INPUT_VALUE_REGEX.test(inputValue) && this.isInputValueValid(inputValue);
1480
- }
1481
- isInputValueValid(inputValue) {
1482
- const [, fractionPart = ''] = inputValue.split(',');
1483
- return this.isNumberValid(inputValue) && this.isPrecisionCountCorrect(fractionPart);
1484
- }
1485
- isNumberValid(inputValue) {
1486
- if (inputValue === '-' && this._min > 0) {
1487
- return false;
1488
- }
1489
- if (inputValue === ',' || inputValue === '-' || inputValue === '-,' || inputValue === '') {
1490
- return true;
1491
- }
1492
- const convertedValue = +cuiReplace(cuiRemoveSpaces(inputValue), ',', '.');
1493
- return convertedValue <= this._max && convertedValue >= this._min;
1494
- }
1495
- isPrecisionCountCorrect(fractionPart = '') {
1496
- return fractionPart.length <= this.precision;
1497
- }
1498
- parseValue(inputValue) {
1499
- const valueWithoutSpaces = cuiRemoveSpaces(inputValue);
1500
- switch (valueWithoutSpaces) {
1501
- case ',':
1502
- return '0.';
1503
- case '-,':
1504
- return '-0.';
1505
- default:
1506
- return cuiReplace(valueWithoutSpaces, ',', '.');
1507
- }
1508
- }
1509
- formatValue(value) {
1510
- if (!value) {
1511
- return '';
1512
- }
1513
- const [integerPart, fractionPart] = value.split('.');
1514
- let formattedInteger = this.insertSpacesWithInterval(integerPart) || '0';
1515
- if (fractionPart !== undefined && integerPart.startsWith('-') && !formattedInteger.slice(1)) {
1516
- formattedInteger = '-0';
1517
- }
1518
- return fractionPart !== undefined ? `${formattedInteger},${fractionPart}` : formattedInteger;
1519
- }
1520
- insertSpacesWithInterval(value) {
1521
- const regex = new RegExp(`\\B(?=(\\d{${this.INTERVAL_BETWEEN_SPACES}})+(?!\\d))`, 'g');
1522
- return value.replace(regex, ' ');
1523
- }
1524
- changeModel(value) {
1525
- this.value = value;
1526
- this.onChange(value === '-' ? 0 : +value);
1527
- }
1528
- increaseByStep() {
1529
- const value = this.value === '-'
1530
- ? this.step
1531
- : (+(Number(this.value) + this.step).toFixed(this.precision));
1532
- if (value > this._max) {
1533
- return;
1534
- }
1535
- const convertedValue = value.toString();
1536
- this.formattedValue = this.formatValue(convertedValue);
1537
- this.changeModel(convertedValue);
1538
- }
1539
- decreaseByStep() {
1540
- const value = this.value === '-'
1541
- ? -this.step
1542
- : (+(Number(this.value) - this.step).toFixed(this.precision));
1543
- if (value < this._min) {
1544
- return;
1545
- }
1546
- const convertedValue = value.toString();
1547
- this.formattedValue = this.formatValue(convertedValue);
1548
- this.changeModel(convertedValue);
1549
- }
1550
- calculateValidMinValue(initialValue) {
1551
- return initialValue >= this.MIN_JS_NUMBER
1552
- ? initialValue
1553
- : this.MIN_JS_NUMBER;
1554
- }
1555
- calculateValidMaxValue(initialValue) {
1556
- return initialValue <= this.MAX_JS_NUMBER
1557
- ? initialValue
1558
- : this.MAX_JS_NUMBER;
1559
- }
1560
- }
1561
- CuiInputNumberComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1562
- CuiInputNumberComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiInputNumberComponent, selector: "cui-input-number", inputs: { step: "step", 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: [
1563
- CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1564
- cuiProvide(NG_VALUE_ACCESSOR, CuiInputNumberComponent, true),
1565
- ], 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]=\"formattedValue\"\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 (keydown.arrowUp)=\"onArrowUp()\"\r\n (keydown.arrowDown)=\"onArrowDown()\"\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$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.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 });
1566
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberComponent, decorators: [{
1567
- type: Component,
1568
- args: [{ selector: 'cui-input-number', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
1569
- CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1570
- cuiProvide(NG_VALUE_ACCESSOR, CuiInputNumberComponent, true),
1571
- ], 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]=\"formattedValue\"\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 (keydown.arrowUp)=\"onArrowUp()\"\r\n (keydown.arrowDown)=\"onArrowDown()\"\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"] }]
1572
- }], propDecorators: { step: [{
1573
- type: Input
1574
- }], precision: [{
1575
- type: Input
1576
- }], min: [{
1577
- type: Input
1578
- }], max: [{
1579
- type: Input
1580
- }], isDisabled: [{
1581
- type: HostBinding,
1582
- args: ['class._disabled']
1583
- }], input: [{
1584
- type: ViewChild,
1585
- args: ['input']
1586
- }], size: [{
1587
- type: HostBinding,
1588
- args: ['attr.data-size']
1589
- }], isError: [{
1590
- type: HostBinding,
1591
- args: ['class._with-error']
1592
- }], onFocus: [{
1593
- type: HostListener,
1594
- args: ['click']
1406
+ class CuiInputNumberComponent {
1407
+ constructor() {
1408
+ this.changeDetectorRef = inject(ChangeDetectorRef);
1409
+ this.cuiTextFieldController = inject(CUI_TEXT_FIELD_CONTROLLER);
1410
+ this.cuiInputNumberOptions = inject(CUI_INPUT_NUMBER_OPTIONS);
1411
+ this.MIN_JS_NUMBER = -(2 ** 53);
1412
+ this.MAX_JS_NUMBER = 2 ** 53;
1413
+ this.INPUT_VALUE_REGEX = /^-?[\d\s]*(,\d*)?$/;
1414
+ this.INTERVAL_BETWEEN_SPACES = 3;
1415
+ this.formattedValue = '';
1416
+ this._min = this.calculateValidMinValue(this.cuiInputNumberOptions.min);
1417
+ this._max = this.calculateValidMaxValue(this.cuiInputNumberOptions.max);
1418
+ this.step = this.cuiInputNumberOptions.step;
1419
+ this.precision = this.cuiInputNumberOptions.precision;
1420
+ }
1421
+ set min(min) {
1422
+ this._min = this.calculateValidMinValue(min);
1423
+ }
1424
+ set max(max) {
1425
+ this._max = this.calculateValidMaxValue(max);
1426
+ }
1427
+ get id() {
1428
+ return this.cuiTextFieldController.id;
1429
+ }
1430
+ get placeholder() {
1431
+ return this.cuiTextFieldController.placeholder;
1432
+ }
1433
+ get iconLeft() {
1434
+ return this.cuiTextFieldController.iconLeft;
1435
+ }
1436
+ get size() {
1437
+ return this.cuiTextFieldController.size;
1438
+ }
1439
+ get isError() {
1440
+ return this.cuiTextFieldController.isError;
1441
+ }
1442
+ writeValue(value) {
1443
+ this.value = value?.toString() ?? null;
1444
+ this.formattedValue = this.formatValue(this.value);
1445
+ this.changeDetectorRef.markForCheck();
1446
+ }
1447
+ registerOnChange(fn) {
1448
+ this.onChange = fn;
1449
+ }
1450
+ registerOnTouched(fn) {
1451
+ this.onTouched = fn;
1452
+ }
1453
+ setDisabledState(isDisabled) {
1454
+ this.isDisabled = isDisabled;
1455
+ this.changeDetectorRef.markForCheck();
1456
+ }
1457
+ onInput(event) {
1458
+ const eventTarget = event.target;
1459
+ const targetValue = eventTarget.value;
1460
+ const selectionStart = this.input.nativeElement.selectionStart ?? 0;
1461
+ const previousFormattedValue = this.formattedValue;
1462
+ if (this.isInputValueCorrect(targetValue)) {
1463
+ const parsedValue = this.parseValue(targetValue);
1464
+ this.changeModel(parsedValue);
1465
+ }
1466
+ this.formattedValue = this.formatValue(this.value);
1467
+ eventTarget.value = this.formattedValue;
1468
+ const currentCaretPosition = selectionStart
1469
+ + (this.formattedValue.length - previousFormattedValue.length === 2 ? 1 : 0);
1470
+ this.input.nativeElement.setSelectionRange(currentCaretPosition, currentCaretPosition);
1471
+ }
1472
+ onArrowUp() {
1473
+ this.increaseByStep();
1474
+ }
1475
+ onArrowDown() {
1476
+ this.decreaseByStep();
1477
+ }
1478
+ onFocus() {
1479
+ this.input.nativeElement.focus();
1480
+ }
1481
+ isInputValueCorrect(inputValue) {
1482
+ return this.INPUT_VALUE_REGEX.test(inputValue) && this.isInputValueValid(inputValue);
1483
+ }
1484
+ isInputValueValid(inputValue) {
1485
+ const [, fractionPart = ''] = inputValue.split(',');
1486
+ return this.isNumberValid(inputValue) && this.isPrecisionCountCorrect(fractionPart);
1487
+ }
1488
+ isNumberValid(inputValue) {
1489
+ if (inputValue === '-' && this._min > 0) {
1490
+ return false;
1491
+ }
1492
+ if (inputValue === ',' || inputValue === '-' || inputValue === '-,' || inputValue === '') {
1493
+ return true;
1494
+ }
1495
+ const convertedValue = +cuiReplace(cuiRemoveSpaces(inputValue), ',', '.');
1496
+ return convertedValue <= this._max && convertedValue >= this._min;
1497
+ }
1498
+ isPrecisionCountCorrect(fractionPart = '') {
1499
+ return fractionPart.length <= this.precision;
1500
+ }
1501
+ parseValue(inputValue) {
1502
+ const valueWithoutSpaces = cuiRemoveSpaces(inputValue);
1503
+ switch (valueWithoutSpaces) {
1504
+ case ',':
1505
+ return '0.';
1506
+ case '-,':
1507
+ return '-0.';
1508
+ default:
1509
+ return cuiReplace(valueWithoutSpaces, ',', '.');
1510
+ }
1511
+ }
1512
+ formatValue(value) {
1513
+ if (!value) {
1514
+ return '';
1515
+ }
1516
+ const [integerPart, fractionPart] = value.split('.');
1517
+ let formattedInteger = this.insertSpacesWithInterval(integerPart) || '0';
1518
+ if (fractionPart !== undefined && integerPart.startsWith('-') && !formattedInteger.slice(1)) {
1519
+ formattedInteger = '-0';
1520
+ }
1521
+ return fractionPart !== undefined ? `${formattedInteger},${fractionPart}` : formattedInteger;
1522
+ }
1523
+ insertSpacesWithInterval(value) {
1524
+ const regex = new RegExp(`\\B(?=(\\d{${this.INTERVAL_BETWEEN_SPACES}})+(?!\\d))`, 'g');
1525
+ return value.replace(regex, ' ');
1526
+ }
1527
+ changeModel(value) {
1528
+ this.value = value;
1529
+ this.onChange(value === '-' ? 0 : +value);
1530
+ }
1531
+ increaseByStep() {
1532
+ const value = this.value === '-'
1533
+ ? this.step
1534
+ : (+(Number(this.value) + this.step).toFixed(this.precision));
1535
+ if (value > this._max) {
1536
+ return;
1537
+ }
1538
+ const convertedValue = value.toString();
1539
+ this.formattedValue = this.formatValue(convertedValue);
1540
+ this.changeModel(convertedValue);
1541
+ }
1542
+ decreaseByStep() {
1543
+ const value = this.value === '-'
1544
+ ? -this.step
1545
+ : (+(Number(this.value) - this.step).toFixed(this.precision));
1546
+ if (value < this._min) {
1547
+ return;
1548
+ }
1549
+ const convertedValue = value.toString();
1550
+ this.formattedValue = this.formatValue(convertedValue);
1551
+ this.changeModel(convertedValue);
1552
+ }
1553
+ calculateValidMinValue(initialValue) {
1554
+ return initialValue >= this.MIN_JS_NUMBER
1555
+ ? initialValue
1556
+ : this.MIN_JS_NUMBER;
1557
+ }
1558
+ calculateValidMaxValue(initialValue) {
1559
+ return initialValue <= this.MAX_JS_NUMBER
1560
+ ? initialValue
1561
+ : this.MAX_JS_NUMBER;
1562
+ }
1563
+ }
1564
+ CuiInputNumberComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1565
+ CuiInputNumberComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiInputNumberComponent, selector: "cui-input-number", inputs: { step: "step", 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: [
1566
+ CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1567
+ cuiProvide(NG_VALUE_ACCESSOR, CuiInputNumberComponent, true),
1568
+ ], 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]=\"formattedValue\"\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 (keydown.arrowUp)=\"onArrowUp()\"\n (keydown.arrowDown)=\"onArrowDown()\"\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$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.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 });
1569
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberComponent, decorators: [{
1570
+ type: Component,
1571
+ args: [{ selector: 'cui-input-number', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
1572
+ CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1573
+ cuiProvide(NG_VALUE_ACCESSOR, CuiInputNumberComponent, true),
1574
+ ], template: "<cui-svg\n *ngIf=\"iconLeft\"\n [icon]=\"iconLeft\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n #input\n [ngModel]=\"formattedValue\"\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 (keydown.arrowUp)=\"onArrowUp()\"\n (keydown.arrowDown)=\"onArrowDown()\"\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"] }]
1575
+ }], propDecorators: { step: [{
1576
+ type: Input
1577
+ }], precision: [{
1578
+ type: Input
1579
+ }], min: [{
1580
+ type: Input
1581
+ }], max: [{
1582
+ type: Input
1583
+ }], isDisabled: [{
1584
+ type: HostBinding,
1585
+ args: ['class._disabled']
1586
+ }], input: [{
1587
+ type: ViewChild,
1588
+ args: ['input']
1589
+ }], size: [{
1590
+ type: HostBinding,
1591
+ args: ['attr.data-size']
1592
+ }], isError: [{
1593
+ type: HostBinding,
1594
+ args: ['class._with-error']
1595
+ }], onFocus: [{
1596
+ type: HostListener,
1597
+ args: ['click']
1598
+ }] } });
1599
+
1600
+ class CuiInputNumberModule {
1601
+ }
1602
+ CuiInputNumberModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1603
+ CuiInputNumberModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberModule, declarations: [CuiInputNumberComponent], imports: [CommonModule,
1604
+ FormsModule,
1605
+ CuiSvgModule], exports: [CuiInputNumberComponent,
1606
+ CuiTextFieldControllerModule] });
1607
+ CuiInputNumberModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberModule, imports: [CommonModule,
1608
+ FormsModule,
1609
+ CuiSvgModule, CuiTextFieldControllerModule] });
1610
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberModule, decorators: [{
1611
+ type: NgModule,
1612
+ args: [{
1613
+ imports: [
1614
+ CommonModule,
1615
+ FormsModule,
1616
+ CuiSvgModule
1617
+ ],
1618
+ declarations: [CuiInputNumberComponent],
1619
+ exports: [
1620
+ CuiInputNumberComponent,
1621
+ CuiTextFieldControllerModule
1622
+ ]
1623
+ }]
1624
+ }] });
1625
+
1626
+ class CuiInputPasswordComponent {
1627
+ constructor() {
1628
+ this.changeDetectorRef = inject(ChangeDetectorRef);
1629
+ this.cuiTextFieldController = inject(CUI_TEXT_FIELD_CONTROLLER);
1630
+ this.isPasswordHidden = true;
1631
+ }
1632
+ get id() {
1633
+ return this.cuiTextFieldController.id;
1634
+ }
1635
+ get placeholder() {
1636
+ return this.cuiTextFieldController.placeholder;
1637
+ }
1638
+ get iconLeft() {
1639
+ return this.cuiTextFieldController.iconLeft;
1640
+ }
1641
+ get isToggleButtonShown() {
1642
+ return !this.isDisabled;
1643
+ }
1644
+ get icon() {
1645
+ return this.isPasswordHidden ? 'cuiIconEye' : 'cuiIconEyeOff';
1646
+ }
1647
+ get type() {
1648
+ return this.isPasswordHidden ? 'password' : 'text';
1649
+ }
1650
+ get buttonTitle() {
1651
+ return this.isPasswordHidden ? 'Reveal password' : 'Hide password';
1652
+ }
1653
+ get size() {
1654
+ return this.cuiTextFieldController.size;
1655
+ }
1656
+ get isError() {
1657
+ return this.cuiTextFieldController.isError;
1658
+ }
1659
+ writeValue(value) {
1660
+ this.value = value;
1661
+ this.changeDetectorRef.markForCheck();
1662
+ }
1663
+ registerOnChange(fn) {
1664
+ this.onChange = fn;
1665
+ }
1666
+ registerOnTouched(fn) {
1667
+ this.onTouched = fn;
1668
+ }
1669
+ setDisabledState(isDisabled) {
1670
+ this.isDisabled = isDisabled;
1671
+ if (this.isDisabled) {
1672
+ this.isPasswordHidden = true;
1673
+ }
1674
+ this.changeDetectorRef.markForCheck();
1675
+ }
1676
+ onInput({ target }) {
1677
+ const value = target.value;
1678
+ this.value = value;
1679
+ this.onChange(value);
1680
+ }
1681
+ onTogglePasswordVisibility() {
1682
+ this.isPasswordHidden = !this.isPasswordHidden;
1683
+ }
1684
+ }
1685
+ CuiInputPasswordComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputPasswordComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1686
+ 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: [
1687
+ CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1688
+ cuiProvide(NG_VALUE_ACCESSOR, CuiInputPasswordComponent, true)
1689
+ ], 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$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.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 });
1690
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputPasswordComponent, decorators: [{
1691
+ type: Component,
1692
+ args: [{ selector: 'cui-input-password', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
1693
+ CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1694
+ cuiProvide(NG_VALUE_ACCESSOR, CuiInputPasswordComponent, true)
1695
+ ], 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"] }]
1696
+ }], propDecorators: { isDisabled: [{
1697
+ type: HostBinding,
1698
+ args: ['class._disabled']
1699
+ }], size: [{
1700
+ type: HostBinding,
1701
+ args: ['attr.data-size']
1702
+ }], isError: [{
1703
+ type: HostBinding,
1704
+ args: ['class._with-error']
1595
1705
  }] } });
1596
1706
 
1597
- class CuiInputNumberModule {
1598
- }
1599
- CuiInputNumberModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1600
- CuiInputNumberModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberModule, declarations: [CuiInputNumberComponent], imports: [CommonModule,
1601
- FormsModule,
1602
- CuiSvgModule], exports: [CuiInputNumberComponent,
1603
- CuiTextFieldControllerModule] });
1604
- CuiInputNumberModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberModule, imports: [CommonModule,
1605
- FormsModule,
1606
- CuiSvgModule, CuiTextFieldControllerModule] });
1607
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberModule, decorators: [{
1608
- type: NgModule,
1609
- args: [{
1610
- imports: [
1611
- CommonModule,
1612
- FormsModule,
1613
- CuiSvgModule
1614
- ],
1615
- declarations: [CuiInputNumberComponent],
1616
- exports: [
1617
- CuiInputNumberComponent,
1618
- CuiTextFieldControllerModule
1619
- ]
1620
- }]
1707
+ class CuiInputPasswordModule {
1708
+ }
1709
+ CuiInputPasswordModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputPasswordModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1710
+ CuiInputPasswordModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiInputPasswordModule, declarations: [CuiInputPasswordComponent], imports: [CommonModule,
1711
+ FormsModule,
1712
+ CuiSvgModule], exports: [CuiInputPasswordComponent,
1713
+ CuiTextFieldControllerModule] });
1714
+ CuiInputPasswordModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputPasswordModule, imports: [CommonModule,
1715
+ FormsModule,
1716
+ CuiSvgModule, CuiTextFieldControllerModule] });
1717
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputPasswordModule, decorators: [{
1718
+ type: NgModule,
1719
+ args: [{
1720
+ imports: [
1721
+ CommonModule,
1722
+ FormsModule,
1723
+ CuiSvgModule
1724
+ ],
1725
+ declarations: [CuiInputPasswordComponent],
1726
+ exports: [
1727
+ CuiInputPasswordComponent,
1728
+ CuiTextFieldControllerModule
1729
+ ]
1730
+ }]
1621
1731
  }] });
1622
1732
 
1623
- class CuiInputPasswordComponent {
1624
- constructor() {
1625
- this.changeDetectorRef = inject(ChangeDetectorRef);
1626
- this.cuiTextFieldController = inject(CUI_TEXT_FIELD_CONTROLLER);
1627
- this.isPasswordHidden = true;
1628
- }
1629
- get id() {
1630
- return this.cuiTextFieldController.id;
1631
- }
1632
- get placeholder() {
1633
- return this.cuiTextFieldController.placeholder;
1634
- }
1635
- get iconLeft() {
1636
- return this.cuiTextFieldController.iconLeft;
1637
- }
1638
- get isToggleButtonShown() {
1639
- return !this.isDisabled;
1640
- }
1641
- get icon() {
1642
- return this.isPasswordHidden ? 'cuiIconEye' : 'cuiIconEyeOff';
1643
- }
1644
- get type() {
1645
- return this.isPasswordHidden ? 'password' : 'text';
1646
- }
1647
- get buttonTitle() {
1648
- return this.isPasswordHidden ? 'Reveal password' : 'Hide password';
1649
- }
1650
- get size() {
1651
- return this.cuiTextFieldController.size;
1652
- }
1653
- get isError() {
1654
- return this.cuiTextFieldController.isError;
1655
- }
1656
- writeValue(value) {
1657
- this.value = value;
1658
- this.changeDetectorRef.markForCheck();
1659
- }
1660
- registerOnChange(fn) {
1661
- this.onChange = fn;
1662
- }
1663
- registerOnTouched(fn) {
1664
- this.onTouched = fn;
1665
- }
1666
- setDisabledState(isDisabled) {
1667
- this.isDisabled = isDisabled;
1668
- if (this.isDisabled) {
1669
- this.isPasswordHidden = true;
1670
- }
1671
- this.changeDetectorRef.markForCheck();
1672
- }
1673
- onInput({ target }) {
1674
- const value = target.value;
1675
- this.value = value;
1676
- this.onChange(value);
1677
- }
1678
- onTogglePasswordVisibility() {
1679
- this.isPasswordHidden = !this.isPasswordHidden;
1680
- }
1681
- }
1682
- CuiInputPasswordComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputPasswordComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1683
- 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: [
1684
- CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1685
- cuiProvide(NG_VALUE_ACCESSOR, CuiInputPasswordComponent, true)
1686
- ], 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$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.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 });
1687
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputPasswordComponent, decorators: [{
1688
- type: Component,
1689
- args: [{ selector: 'cui-input-password', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
1690
- CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1691
- cuiProvide(NG_VALUE_ACCESSOR, CuiInputPasswordComponent, true)
1692
- ], 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"] }]
1693
- }], propDecorators: { isDisabled: [{
1694
- type: HostBinding,
1695
- args: ['class._disabled']
1696
- }], size: [{
1697
- type: HostBinding,
1698
- args: ['attr.data-size']
1699
- }], isError: [{
1700
- type: HostBinding,
1701
- args: ['class._with-error']
1733
+ class CuiInputTextComponent {
1734
+ constructor() {
1735
+ this.changeDetectorRef = inject(ChangeDetectorRef);
1736
+ this.cuiTextFieldController = inject(CUI_TEXT_FIELD_CONTROLLER);
1737
+ }
1738
+ get id() {
1739
+ return this.cuiTextFieldController.id;
1740
+ }
1741
+ get placeholder() {
1742
+ return this.cuiTextFieldController.placeholder;
1743
+ }
1744
+ get iconLeft() {
1745
+ return this.cuiTextFieldController.iconLeft;
1746
+ }
1747
+ get isClearButtonHidden() {
1748
+ return !(this.value && !this.isDisabled);
1749
+ }
1750
+ get size() {
1751
+ return this.cuiTextFieldController.size;
1752
+ }
1753
+ get isError() {
1754
+ return this.cuiTextFieldController.isError;
1755
+ }
1756
+ writeValue(value) {
1757
+ this.value = value;
1758
+ this.changeDetectorRef.markForCheck();
1759
+ }
1760
+ registerOnChange(fn) {
1761
+ this.onChange = fn;
1762
+ }
1763
+ registerOnTouched(fn) {
1764
+ this.onTouched = fn;
1765
+ }
1766
+ setDisabledState(isDisabled) {
1767
+ this.isDisabled = isDisabled;
1768
+ this.changeDetectorRef.markForCheck();
1769
+ }
1770
+ onInput({ target }) {
1771
+ this.changeModel(target.value);
1772
+ }
1773
+ onClear() {
1774
+ this.changeModel('');
1775
+ }
1776
+ onFocus() {
1777
+ this.input.nativeElement.focus();
1778
+ }
1779
+ changeModel(value) {
1780
+ this.value = value;
1781
+ this.onChange(value);
1782
+ }
1783
+ }
1784
+ CuiInputTextComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1785
+ 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: [
1786
+ CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1787
+ cuiProvide(NG_VALUE_ACCESSOR, CuiInputTextComponent, true)
1788
+ ], 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$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.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 });
1789
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputTextComponent, decorators: [{
1790
+ type: Component,
1791
+ args: [{ selector: 'cui-input-text', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
1792
+ CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1793
+ cuiProvide(NG_VALUE_ACCESSOR, CuiInputTextComponent, true)
1794
+ ], 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"] }]
1795
+ }], propDecorators: { isDisabled: [{
1796
+ type: HostBinding,
1797
+ args: ['class._disabled']
1798
+ }], input: [{
1799
+ type: ViewChild,
1800
+ args: ['input']
1801
+ }], size: [{
1802
+ type: HostBinding,
1803
+ args: ['attr.data-size']
1804
+ }], isError: [{
1805
+ type: HostBinding,
1806
+ args: ['class._with-error']
1807
+ }], onFocus: [{
1808
+ type: HostListener,
1809
+ args: ['click']
1702
1810
  }] } });
1703
1811
 
1704
- class CuiInputPasswordModule {
1705
- }
1706
- CuiInputPasswordModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputPasswordModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1707
- CuiInputPasswordModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiInputPasswordModule, declarations: [CuiInputPasswordComponent], imports: [CommonModule,
1708
- FormsModule,
1709
- CuiSvgModule], exports: [CuiInputPasswordComponent,
1710
- CuiTextFieldControllerModule] });
1711
- CuiInputPasswordModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputPasswordModule, imports: [CommonModule,
1712
- FormsModule,
1713
- CuiSvgModule, CuiTextFieldControllerModule] });
1714
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputPasswordModule, decorators: [{
1715
- type: NgModule,
1716
- args: [{
1717
- imports: [
1718
- CommonModule,
1719
- FormsModule,
1720
- CuiSvgModule
1721
- ],
1722
- declarations: [CuiInputPasswordComponent],
1723
- exports: [
1724
- CuiInputPasswordComponent,
1725
- CuiTextFieldControllerModule
1726
- ]
1727
- }]
1812
+ class CuiInputModule {
1813
+ }
1814
+ CuiInputModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1815
+ CuiInputModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiInputModule, declarations: [CuiInputTextComponent], imports: [CommonModule,
1816
+ FormsModule,
1817
+ CuiSvgModule], exports: [CuiInputTextComponent,
1818
+ CuiTextFieldControllerModule] });
1819
+ CuiInputModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputModule, imports: [CommonModule,
1820
+ FormsModule,
1821
+ CuiSvgModule, CuiTextFieldControllerModule] });
1822
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputModule, decorators: [{
1823
+ type: NgModule,
1824
+ args: [{
1825
+ imports: [
1826
+ CommonModule,
1827
+ FormsModule,
1828
+ CuiSvgModule
1829
+ ],
1830
+ declarations: [CuiInputTextComponent],
1831
+ exports: [
1832
+ CuiInputTextComponent,
1833
+ CuiTextFieldControllerModule
1834
+ ]
1835
+ }]
1728
1836
  }] });
1729
1837
 
1730
- class CuiInputTextComponent {
1731
- constructor() {
1732
- this.changeDetectorRef = inject(ChangeDetectorRef);
1733
- this.cuiTextFieldController = inject(CUI_TEXT_FIELD_CONTROLLER);
1734
- }
1735
- get id() {
1736
- return this.cuiTextFieldController.id;
1737
- }
1738
- get placeholder() {
1739
- return this.cuiTextFieldController.placeholder;
1740
- }
1741
- get iconLeft() {
1742
- return this.cuiTextFieldController.iconLeft;
1743
- }
1744
- get isClearButtonHidden() {
1745
- return !(this.value && !this.isDisabled);
1746
- }
1747
- get size() {
1748
- return this.cuiTextFieldController.size;
1749
- }
1750
- get isError() {
1751
- return this.cuiTextFieldController.isError;
1752
- }
1753
- writeValue(value) {
1754
- this.value = value;
1755
- this.changeDetectorRef.markForCheck();
1756
- }
1757
- registerOnChange(fn) {
1758
- this.onChange = fn;
1759
- }
1760
- registerOnTouched(fn) {
1761
- this.onTouched = fn;
1762
- }
1763
- setDisabledState(isDisabled) {
1764
- this.isDisabled = isDisabled;
1765
- this.changeDetectorRef.markForCheck();
1766
- }
1767
- onInput({ target }) {
1768
- this.changeModel(target.value);
1769
- }
1770
- onClear() {
1771
- this.changeModel('');
1772
- }
1773
- onFocus() {
1774
- this.input.nativeElement.focus();
1775
- }
1776
- changeModel(value) {
1777
- this.value = value;
1778
- this.onChange(value);
1779
- }
1780
- }
1781
- CuiInputTextComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1782
- 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: [
1783
- CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1784
- cuiProvide(NG_VALUE_ACCESSOR, CuiInputTextComponent, true)
1785
- ], 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$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.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 });
1786
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputTextComponent, decorators: [{
1787
- type: Component,
1788
- args: [{ selector: 'cui-input-text', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
1789
- CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1790
- cuiProvide(NG_VALUE_ACCESSOR, CuiInputTextComponent, true)
1791
- ], 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"] }]
1792
- }], propDecorators: { isDisabled: [{
1793
- type: HostBinding,
1794
- args: ['class._disabled']
1795
- }], input: [{
1796
- type: ViewChild,
1797
- args: ['input']
1798
- }], size: [{
1799
- type: HostBinding,
1800
- args: ['attr.data-size']
1801
- }], isError: [{
1802
- type: HostBinding,
1803
- args: ['class._with-error']
1804
- }], onFocus: [{
1805
- type: HostListener,
1806
- args: ['click']
1838
+ const CUI_INPUT_TIME_DEFAULT_OPTIONS = {
1839
+ mode: 'HH:MM'
1840
+ };
1841
+ const CUI_INPUT_TIME_OPTIONS = new InjectionToken('', {
1842
+ factory: () => CUI_INPUT_TIME_DEFAULT_OPTIONS
1843
+ });
1844
+
1845
+ class CuiInputTimeComponent {
1846
+ constructor() {
1847
+ this.changeDetectorRef = inject(ChangeDetectorRef);
1848
+ this.cuiTextFieldController = inject(CUI_TEXT_FIELD_CONTROLLER);
1849
+ this.options = inject(CUI_INPUT_TIME_OPTIONS);
1850
+ this.maskOptions = this.generateMask(this.options.mode);
1851
+ this.defaultPlaceholder = this.options.mode.toLowerCase();
1852
+ }
1853
+ set mode(value) {
1854
+ this.maskOptions = this.generateMask(this.options.mode);
1855
+ this.defaultPlaceholder = value.toLowerCase();
1856
+ }
1857
+ get id() {
1858
+ return this.cuiTextFieldController.id;
1859
+ }
1860
+ get placeholder() {
1861
+ return this.cuiTextFieldController.placeholder ?? this.defaultPlaceholder;
1862
+ }
1863
+ get size() {
1864
+ return this.cuiTextFieldController.size;
1865
+ }
1866
+ get isError() {
1867
+ return this.cuiTextFieldController.isError;
1868
+ }
1869
+ writeValue(value) {
1870
+ this.value = value;
1871
+ this.changeDetectorRef.markForCheck();
1872
+ }
1873
+ registerOnChange(fn) {
1874
+ this.onChange = fn;
1875
+ }
1876
+ registerOnTouched(fn) {
1877
+ this.onTouched = fn;
1878
+ }
1879
+ setDisabledState(isDisabled) {
1880
+ this.isDisabled = isDisabled;
1881
+ this.changeDetectorRef.markForCheck();
1882
+ }
1883
+ onInput(event) {
1884
+ this.value = event.target.value;
1885
+ this.onChange(this.value);
1886
+ }
1887
+ onFocus() {
1888
+ this.input.nativeElement.focus();
1889
+ }
1890
+ generateMask(mode) {
1891
+ return maskitoTimeOptionsGenerator({ mode });
1892
+ }
1893
+ }
1894
+ CuiInputTimeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputTimeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1895
+ 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: [
1896
+ CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1897
+ cuiProvide(NG_VALUE_ACCESSOR, CuiInputTimeComponent, true)
1898
+ ], 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]=\"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>", 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$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.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"] }, { kind: "directive", type: i3.MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1899
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputTimeComponent, decorators: [{
1900
+ type: Component,
1901
+ args: [{ selector: 'cui-input-time', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
1902
+ CUI_TEXT_FILED_CONTROLLER_PROVIDER,
1903
+ cuiProvide(NG_VALUE_ACCESSOR, CuiInputTimeComponent, true)
1904
+ ], template: "<cui-svg\n icon=\"cuiIconClock\"\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>", 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"] }]
1905
+ }], propDecorators: { mode: [{
1906
+ type: Input
1907
+ }], isDisabled: [{
1908
+ type: HostBinding,
1909
+ args: ['class._disabled']
1910
+ }], input: [{
1911
+ type: ViewChild,
1912
+ args: ['input']
1913
+ }], size: [{
1914
+ type: HostBinding,
1915
+ args: ['attr.data-size']
1916
+ }], isError: [{
1917
+ type: HostBinding,
1918
+ args: ['class._with-error']
1919
+ }], onFocus: [{
1920
+ type: HostListener,
1921
+ args: ['click']
1807
1922
  }] } });
1808
1923
 
1809
- class CuiInputModule {
1810
- }
1811
- CuiInputModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1812
- CuiInputModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiInputModule, declarations: [CuiInputTextComponent], imports: [CommonModule,
1813
- FormsModule,
1814
- CuiSvgModule], exports: [CuiInputTextComponent,
1815
- CuiTextFieldControllerModule] });
1816
- CuiInputModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputModule, imports: [CommonModule,
1817
- FormsModule,
1818
- CuiSvgModule, CuiTextFieldControllerModule] });
1819
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputModule, decorators: [{
1820
- type: NgModule,
1821
- args: [{
1822
- imports: [
1823
- CommonModule,
1824
- FormsModule,
1825
- CuiSvgModule
1826
- ],
1827
- declarations: [CuiInputTextComponent],
1828
- exports: [
1829
- CuiInputTextComponent,
1830
- CuiTextFieldControllerModule
1831
- ]
1832
- }]
1924
+ class InputTimeModule {
1925
+ }
1926
+ InputTimeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: InputTimeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1927
+ InputTimeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: InputTimeModule, declarations: [CuiInputTimeComponent], imports: [CommonModule,
1928
+ FormsModule,
1929
+ CuiSvgModule,
1930
+ MaskitoDirective], exports: [CuiInputTimeComponent] });
1931
+ InputTimeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: InputTimeModule, imports: [CommonModule,
1932
+ FormsModule,
1933
+ CuiSvgModule] });
1934
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: InputTimeModule, decorators: [{
1935
+ type: NgModule,
1936
+ args: [{
1937
+ imports: [
1938
+ CommonModule,
1939
+ FormsModule,
1940
+ CuiSvgModule,
1941
+ MaskitoDirective
1942
+ ],
1943
+ declarations: [
1944
+ CuiInputTimeComponent
1945
+ ],
1946
+ exports: [
1947
+ CuiInputTimeComponent
1948
+ ]
1949
+ }]
1833
1950
  }] });
1834
1951
 
1835
- class CuiLabelComponent {
1836
- constructor() {
1837
- this.isRequired = false;
1838
- }
1839
- }
1840
- CuiLabelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1841
- 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;cursor:pointer;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 });
1842
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiLabelComponent, decorators: [{
1843
- type: Component,
1844
- 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;cursor:pointer;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"] }]
1845
- }], propDecorators: { isRequired: [{
1846
- type: Input
1952
+ class CuiLabelComponent {
1953
+ constructor() {
1954
+ this.isRequired = false;
1955
+ }
1956
+ }
1957
+ CuiLabelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1958
+ 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;cursor:pointer;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 });
1959
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiLabelComponent, decorators: [{
1960
+ type: Component,
1961
+ 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;cursor:pointer;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"] }]
1962
+ }], propDecorators: { isRequired: [{
1963
+ type: Input
1847
1964
  }] } });
1848
1965
 
1849
- class CuiLabelModule {
1850
- }
1851
- CuiLabelModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiLabelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1852
- CuiLabelModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiLabelModule, declarations: [CuiLabelComponent], imports: [CommonModule], exports: [CuiLabelComponent] });
1853
- CuiLabelModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiLabelModule, imports: [CommonModule] });
1854
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiLabelModule, decorators: [{
1855
- type: NgModule,
1856
- args: [{
1857
- imports: [CommonModule],
1858
- declarations: [CuiLabelComponent],
1859
- exports: [CuiLabelComponent]
1860
- }]
1966
+ class CuiLabelModule {
1967
+ }
1968
+ CuiLabelModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiLabelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1969
+ CuiLabelModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiLabelModule, declarations: [CuiLabelComponent], imports: [CommonModule], exports: [CuiLabelComponent] });
1970
+ CuiLabelModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiLabelModule, imports: [CommonModule] });
1971
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiLabelModule, decorators: [{
1972
+ type: NgModule,
1973
+ args: [{
1974
+ imports: [CommonModule],
1975
+ declarations: [CuiLabelComponent],
1976
+ exports: [CuiLabelComponent]
1977
+ }]
1861
1978
  }] });
1862
1979
 
1863
- class CuiRadioComponent {
1864
- }
1865
- CuiRadioComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRadioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1866
- 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 });
1867
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRadioComponent, decorators: [{
1868
- type: Component,
1869
- 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"] }]
1980
+ class CuiRadioComponent {
1981
+ }
1982
+ CuiRadioComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRadioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1983
+ 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 });
1984
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRadioComponent, decorators: [{
1985
+ type: Component,
1986
+ 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"] }]
1870
1987
  }] });
1871
1988
 
1872
- class CuiRadioModule {
1873
- }
1874
- CuiRadioModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRadioModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1875
- CuiRadioModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiRadioModule, declarations: [CuiRadioComponent], exports: [CuiRadioComponent] });
1876
- CuiRadioModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRadioModule });
1877
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRadioModule, decorators: [{
1878
- type: NgModule,
1879
- args: [{
1880
- declarations: [CuiRadioComponent],
1881
- exports: [CuiRadioComponent]
1882
- }]
1989
+ class CuiRadioModule {
1990
+ }
1991
+ CuiRadioModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRadioModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1992
+ CuiRadioModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiRadioModule, declarations: [CuiRadioComponent], exports: [CuiRadioComponent] });
1993
+ CuiRadioModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRadioModule });
1994
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiRadioModule, decorators: [{
1995
+ type: NgModule,
1996
+ args: [{
1997
+ declarations: [CuiRadioComponent],
1998
+ exports: [CuiRadioComponent]
1999
+ }]
1883
2000
  }] });
1884
2001
 
1885
- class CuiSelectComponent {
1886
- constructor() {
1887
- this.element = inject(ElementRef).nativeElement;
1888
- this.document = inject(DOCUMENT);
1889
- this.changeDetectorRef = inject(ChangeDetectorRef);
1890
- this.viewContainerRef = inject(ViewContainerRef);
1891
- this.destroy$ = inject(CuiDestroyService, { self: true });
1892
- this.cuiTextFieldController = inject(CUI_TEXT_FIELD_CONTROLLER);
1893
- this.cuiClickOutsideDirective = inject(CuiClickOutsideDirective, { self: true });
1894
- this.SPACE_BETWEEN_BUTTON_AND_OPTIONS = 3;
1895
- this.isOpened = false;
1896
- this.isOptionsListAbove = false;
1897
- this.gap = `${this.SPACE_BETWEEN_BUTTON_AND_OPTIONS}px`;
1898
- }
1899
- get id() {
1900
- return this.cuiTextFieldController.id;
1901
- }
1902
- get size() {
1903
- return this.cuiTextFieldController.size;
1904
- }
1905
- get placeholder() {
1906
- return this.cuiTextFieldController.placeholder;
1907
- }
1908
- get isError() {
1909
- return this.cuiTextFieldController.isError;
1910
- }
1911
- trackByFn(_, item) {
1912
- return item.label;
1913
- }
1914
- writeValue(value) {
1915
- this.value = value;
1916
- // TODO: Непонятно, зачем нужно в construction вторая часть выражения
1917
- this.selectedOption = this.options.find(option => option.value === value) ?? value;
1918
- this.changeDetectorRef.markForCheck();
1919
- }
1920
- registerOnChange(fn) {
1921
- this.onChange = fn;
1922
- }
1923
- registerOnTouched(fn) {
1924
- this.onTouched = fn;
1925
- }
1926
- ngOnInit() {
1927
- this.initClickOutsideSubscription();
1928
- }
1929
- ngOnDestroy() {
1930
- this.clearViewContainerRef();
1931
- }
1932
- setDisabledState(isDisabled) {
1933
- this.isDisabled = isDisabled;
1934
- this.changeDetectorRef.markForCheck();
1935
- }
1936
- onSelect(event, option) {
1937
- event.stopPropagation();
1938
- if (option.isDisabled) {
1939
- return;
1940
- }
1941
- this.value = option.value;
1942
- this.selectedOption = option;
1943
- this.onChange(this.value);
1944
- this.onSwitch();
1945
- this.onTouched();
1946
- this.changeDetectorRef.markForCheck();
1947
- }
1948
- onSwitch() {
1949
- if (!this.options.length && !this.defaultOptionText) {
1950
- return;
1951
- }
1952
- if (!this.isOpened) {
1953
- this.open();
1954
- return;
1955
- }
1956
- this.close();
1957
- }
1958
- onClose() {
1959
- this.close();
1960
- }
1961
- onWindowResize() {
1962
- this.button.nativeElement.blur();
1963
- this.close();
1964
- }
1965
- initClickOutsideSubscription() {
1966
- this.cuiClickOutsideDirective.cuiClickOutside
1967
- .pipe(takeUntil(this.destroy$))
1968
- .subscribe(() => {
1969
- if (this.isOpened) {
1970
- this.onTouched();
1971
- }
1972
- this.close();
1973
- });
1974
- }
1975
- open() {
1976
- this.isOpened = true;
1977
- const { top: elementRectTop, left: elementRectLeft, bottom: elementRectBottom } = this.element.getBoundingClientRect();
1978
- const distanceToBottom = this.document.documentElement.clientHeight
1979
- - (elementRectBottom + this.SPACE_BETWEEN_BUTTON_AND_OPTIONS);
1980
- const embeddedViewRef = this.viewContainerRef.createEmbeddedView(this.optionsWrapper);
1981
- const node = embeddedViewRef.rootNodes[0];
1982
- const nodeStyles = node.style;
1983
- this.isOptionsListAbove = distanceToBottom < this.getOptionsListHeightContainer.nativeElement.offsetHeight;
1984
- embeddedViewRef.detectChanges();
1985
- nodeStyles.width = this.element.offsetWidth + 'px';
1986
- nodeStyles.left = window.scrollX + elementRectLeft + 'px';
1987
- if (this.isOptionsListAbove) {
1988
- nodeStyles.top = window.scrollY + elementRectTop
1989
- - this.getOptionsListHeightContainer.nativeElement.offsetHeight
1990
- - this.SPACE_BETWEEN_BUTTON_AND_OPTIONS
1991
- + 'px';
1992
- }
1993
- else {
1994
- nodeStyles.top = window.scrollY + elementRectBottom + this.SPACE_BETWEEN_BUTTON_AND_OPTIONS + 'px';
1995
- }
1996
- this.document.querySelector(CUI_ROOT_SELECTOR).appendChild(embeddedViewRef.rootNodes[0]);
1997
- }
1998
- close() {
1999
- this.isOpened = false;
2000
- this.clearViewContainerRef();
2001
- }
2002
- clearViewContainerRef() {
2003
- this.viewContainerRef.clear();
2004
- }
2005
- }
2006
- CuiSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2007
- 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: [
2008
- CUI_TEXT_FILED_CONTROLLER_PROVIDER,
2009
- cuiProvide(NG_VALUE_ACCESSOR, CuiSelectComponent, true),
2010
- CuiDestroyService
2011
- ], viewQueries: [{ propertyName: "button", first: true, predicate: ["button"], descendants: true }, { propertyName: "getOptionsListHeightContainer", first: true, predicate: ["getOptionsListHeightContainer"], descendants: true }, { propertyName: "optionsWrapper", first: true, predicate: ["optionsWrapper"], descendants: true }], hostDirectives: [{ directive: i2.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 #optionsWrapper>\r\n <div\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)}.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-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}.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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2012
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSelectComponent, decorators: [{
2013
- type: Component,
2014
- args: [{ selector: 'cui-select[options]', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
2015
- CUI_TEXT_FILED_CONTROLLER_PROVIDER,
2016
- cuiProvide(NG_VALUE_ACCESSOR, CuiSelectComponent, true),
2017
- CuiDestroyService
2018
- ], 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 #optionsWrapper>\r\n <div\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)}.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-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}.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"] }]
2019
- }], propDecorators: { options: [{
2020
- type: Input
2021
- }], defaultOptionText: [{
2022
- type: Input
2023
- }], button: [{
2024
- type: ViewChild,
2025
- args: ['button']
2026
- }], getOptionsListHeightContainer: [{
2027
- type: ViewChild,
2028
- args: ['getOptionsListHeightContainer']
2029
- }], optionsWrapper: [{
2030
- type: ViewChild,
2031
- args: ['optionsWrapper']
2032
- }], gap: [{
2033
- type: HostBinding,
2034
- args: ['style.--c-gap']
2035
- }], onWindowResize: [{
2036
- type: HostListener,
2037
- args: ['window:resize']
2002
+ class CuiSelectComponent {
2003
+ constructor() {
2004
+ this.element = inject(ElementRef).nativeElement;
2005
+ this.document = inject(DOCUMENT);
2006
+ this.changeDetectorRef = inject(ChangeDetectorRef);
2007
+ this.viewContainerRef = inject(ViewContainerRef);
2008
+ this.destroy$ = inject(CuiDestroyService, { self: true });
2009
+ this.cuiTextFieldController = inject(CUI_TEXT_FIELD_CONTROLLER);
2010
+ this.cuiClickOutsideDirective = inject(CuiClickOutsideDirective, { self: true });
2011
+ this.SPACE_BETWEEN_BUTTON_AND_OPTIONS = 3;
2012
+ this.isOpened = false;
2013
+ this.isOptionsListAbove = false;
2014
+ this.gap = `${this.SPACE_BETWEEN_BUTTON_AND_OPTIONS}px`;
2015
+ }
2016
+ get id() {
2017
+ return this.cuiTextFieldController.id;
2018
+ }
2019
+ get size() {
2020
+ return this.cuiTextFieldController.size;
2021
+ }
2022
+ get placeholder() {
2023
+ return this.cuiTextFieldController.placeholder;
2024
+ }
2025
+ get isError() {
2026
+ return this.cuiTextFieldController.isError;
2027
+ }
2028
+ trackByFn(_, item) {
2029
+ return item.label;
2030
+ }
2031
+ writeValue(value) {
2032
+ this.value = value;
2033
+ // TODO: Непонятно, зачем нужно в construction вторая часть выражения
2034
+ this.selectedOption = this.options.find(option => option.value === value) ?? value;
2035
+ this.changeDetectorRef.markForCheck();
2036
+ }
2037
+ registerOnChange(fn) {
2038
+ this.onChange = fn;
2039
+ }
2040
+ registerOnTouched(fn) {
2041
+ this.onTouched = fn;
2042
+ }
2043
+ ngOnInit() {
2044
+ this.initClickOutsideSubscription();
2045
+ }
2046
+ ngOnDestroy() {
2047
+ this.clearViewContainerRef();
2048
+ }
2049
+ setDisabledState(isDisabled) {
2050
+ this.isDisabled = isDisabled;
2051
+ this.changeDetectorRef.markForCheck();
2052
+ }
2053
+ onSelect(event, option) {
2054
+ event.stopPropagation();
2055
+ if (option.isDisabled) {
2056
+ return;
2057
+ }
2058
+ this.value = option.value;
2059
+ this.selectedOption = option;
2060
+ this.onChange(this.value);
2061
+ this.onSwitch();
2062
+ this.onTouched();
2063
+ this.changeDetectorRef.markForCheck();
2064
+ }
2065
+ onSwitch() {
2066
+ if (!this.options.length && !this.defaultOptionText) {
2067
+ return;
2068
+ }
2069
+ if (!this.isOpened) {
2070
+ this.open();
2071
+ return;
2072
+ }
2073
+ this.close();
2074
+ }
2075
+ onClose() {
2076
+ this.close();
2077
+ }
2078
+ onWindowResize() {
2079
+ this.button.nativeElement.blur();
2080
+ this.close();
2081
+ }
2082
+ initClickOutsideSubscription() {
2083
+ this.cuiClickOutsideDirective.cuiClickOutside
2084
+ .pipe(takeUntil(this.destroy$))
2085
+ .subscribe(() => {
2086
+ if (this.isOpened) {
2087
+ this.onTouched();
2088
+ }
2089
+ this.close();
2090
+ });
2091
+ }
2092
+ open() {
2093
+ this.isOpened = true;
2094
+ const { top: elementRectTop, left: elementRectLeft, bottom: elementRectBottom } = this.element.getBoundingClientRect();
2095
+ const distanceToBottom = this.document.documentElement.clientHeight
2096
+ - (elementRectBottom + this.SPACE_BETWEEN_BUTTON_AND_OPTIONS);
2097
+ const embeddedViewRef = this.viewContainerRef.createEmbeddedView(this.optionsWrapper);
2098
+ const node = embeddedViewRef.rootNodes[0];
2099
+ const nodeStyles = node.style;
2100
+ this.isOptionsListAbove = distanceToBottom < this.getOptionsListHeightContainer.nativeElement.offsetHeight;
2101
+ embeddedViewRef.detectChanges();
2102
+ nodeStyles.width = this.element.offsetWidth + 'px';
2103
+ nodeStyles.left = window.scrollX + elementRectLeft + 'px';
2104
+ if (this.isOptionsListAbove) {
2105
+ nodeStyles.top = window.scrollY + elementRectTop
2106
+ - this.getOptionsListHeightContainer.nativeElement.offsetHeight
2107
+ - this.SPACE_BETWEEN_BUTTON_AND_OPTIONS
2108
+ + 'px';
2109
+ }
2110
+ else {
2111
+ nodeStyles.top = window.scrollY + elementRectBottom + this.SPACE_BETWEEN_BUTTON_AND_OPTIONS + 'px';
2112
+ }
2113
+ this.document.querySelector(CUI_ROOT_SELECTOR).appendChild(embeddedViewRef.rootNodes[0]);
2114
+ }
2115
+ close() {
2116
+ this.isOpened = false;
2117
+ this.clearViewContainerRef();
2118
+ }
2119
+ clearViewContainerRef() {
2120
+ this.viewContainerRef.clear();
2121
+ }
2122
+ }
2123
+ CuiSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2124
+ 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: [
2125
+ CUI_TEXT_FILED_CONTROLLER_PROVIDER,
2126
+ cuiProvide(NG_VALUE_ACCESSOR, CuiSelectComponent, true),
2127
+ CuiDestroyService
2128
+ ], viewQueries: [{ propertyName: "button", first: true, predicate: ["button"], descendants: true }, { propertyName: "getOptionsListHeightContainer", first: true, predicate: ["getOptionsListHeightContainer"], descendants: true }, { propertyName: "optionsWrapper", first: true, predicate: ["optionsWrapper"], descendants: true }], hostDirectives: [{ directive: i2.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 #optionsWrapper>\n <div\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)}.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-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}.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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2129
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSelectComponent, decorators: [{
2130
+ type: Component,
2131
+ args: [{ selector: 'cui-select[options]', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
2132
+ CUI_TEXT_FILED_CONTROLLER_PROVIDER,
2133
+ cuiProvide(NG_VALUE_ACCESSOR, CuiSelectComponent, true),
2134
+ CuiDestroyService
2135
+ ], 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 #optionsWrapper>\n <div\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)}.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-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}.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"] }]
2136
+ }], propDecorators: { options: [{
2137
+ type: Input
2138
+ }], defaultOptionText: [{
2139
+ type: Input
2140
+ }], button: [{
2141
+ type: ViewChild,
2142
+ args: ['button']
2143
+ }], getOptionsListHeightContainer: [{
2144
+ type: ViewChild,
2145
+ args: ['getOptionsListHeightContainer']
2146
+ }], optionsWrapper: [{
2147
+ type: ViewChild,
2148
+ args: ['optionsWrapper']
2149
+ }], gap: [{
2150
+ type: HostBinding,
2151
+ args: ['style.--c-gap']
2152
+ }], onWindowResize: [{
2153
+ type: HostListener,
2154
+ args: ['window:resize']
2038
2155
  }] } });
2039
2156
 
2040
- class CuiSelectModule {
2041
- }
2042
- CuiSelectModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2043
- CuiSelectModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiSelectModule, declarations: [CuiSelectComponent], imports: [CommonModule,
2044
- CuiSvgModule], exports: [CuiSelectComponent,
2045
- CuiTextFieldControllerModule] });
2046
- CuiSelectModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSelectModule, imports: [CommonModule,
2047
- CuiSvgModule, CuiTextFieldControllerModule] });
2048
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSelectModule, decorators: [{
2049
- type: NgModule,
2050
- args: [{
2051
- imports: [
2052
- CommonModule,
2053
- CuiSvgModule
2054
- ],
2055
- declarations: [CuiSelectComponent],
2056
- exports: [
2057
- CuiSelectComponent,
2058
- CuiTextFieldControllerModule
2059
- ]
2060
- }]
2157
+ class CuiSelectModule {
2158
+ }
2159
+ CuiSelectModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2160
+ CuiSelectModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiSelectModule, declarations: [CuiSelectComponent], imports: [CommonModule,
2161
+ CuiSvgModule], exports: [CuiSelectComponent,
2162
+ CuiTextFieldControllerModule] });
2163
+ CuiSelectModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSelectModule, imports: [CommonModule,
2164
+ CuiSvgModule, CuiTextFieldControllerModule] });
2165
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiSelectModule, decorators: [{
2166
+ type: NgModule,
2167
+ args: [{
2168
+ imports: [
2169
+ CommonModule,
2170
+ CuiSvgModule
2171
+ ],
2172
+ declarations: [CuiSelectComponent],
2173
+ exports: [
2174
+ CuiSelectComponent,
2175
+ CuiTextFieldControllerModule
2176
+ ]
2177
+ }]
2061
2178
  }] });
2062
2179
 
2063
- const CUI_TAB_ACTIVATE = 'cui-tab-activate';
2064
- class CuiTabComponent {
2065
- constructor() {
2066
- this.element = inject(ElementRef).nativeElement;
2067
- }
2068
- onClick() {
2069
- this.element.dispatchEvent(new CustomEvent(CUI_TAB_ACTIVATE, { bubbles: true }));
2070
- }
2071
- }
2072
- CuiTabComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2073
- 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 });
2074
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabComponent, decorators: [{
2075
- type: Component,
2076
- 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"] }]
2077
- }], propDecorators: { onClick: [{
2078
- type: HostListener,
2079
- args: ['click']
2180
+ const CUI_TAB_ACTIVATE = 'cui-tab-activate';
2181
+ class CuiTabComponent {
2182
+ constructor() {
2183
+ this.element = inject(ElementRef).nativeElement;
2184
+ }
2185
+ onClick() {
2186
+ this.element.dispatchEvent(new CustomEvent(CUI_TAB_ACTIVATE, { bubbles: true }));
2187
+ }
2188
+ }
2189
+ CuiTabComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2190
+ 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 });
2191
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabComponent, decorators: [{
2192
+ type: Component,
2193
+ 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"] }]
2194
+ }], propDecorators: { onClick: [{
2195
+ type: HostListener,
2196
+ args: ['click']
2080
2197
  }] } });
2081
2198
 
2082
- class CuiTabsComponent {
2083
- constructor() {
2084
- this.element = inject(ElementRef).nativeElement;
2085
- this.activeElementClass = '_active';
2086
- this.activeItemIndex = 0;
2087
- this.activeItemIndexChange = new EventEmitter();
2088
- }
2089
- get tabs() {
2090
- return Array.from(this.element.querySelectorAll('[cuiTab]'));
2091
- }
2092
- get activeElement() {
2093
- return this.tabs[this.activeItemIndex] || null;
2094
- }
2095
- ngAfterViewChecked() {
2096
- this.changeActiveItem();
2097
- }
2098
- onActivate(event) {
2099
- event.stopPropagation();
2100
- const index = this.tabs.findIndex((tab) => tab === event.target);
2101
- if (index === this.activeItemIndex) {
2102
- return;
2103
- }
2104
- this.activeItemIndexChange.emit(index);
2105
- this.activeItemIndex = index;
2106
- }
2107
- changeActiveItem() {
2108
- this.tabs.forEach(nativeElement => {
2109
- const active = nativeElement === this.activeElement;
2110
- nativeElement.classList.toggle(this.activeElementClass, active);
2111
- });
2112
- }
2113
- }
2114
- CuiTabsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2115
- 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 });
2116
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabsComponent, decorators: [{
2117
- type: Component,
2118
- 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"] }]
2119
- }], propDecorators: { activeItemIndex: [{
2120
- type: Input
2121
- }], activeItemIndexChange: [{
2122
- type: Output
2123
- }], onActivate: [{
2124
- type: HostListener,
2125
- args: [CUI_TAB_ACTIVATE, ['$event']]
2199
+ class CuiTabsComponent {
2200
+ constructor() {
2201
+ this.element = inject(ElementRef).nativeElement;
2202
+ this.activeElementClass = '_active';
2203
+ this.activeItemIndex = 0;
2204
+ this.activeItemIndexChange = new EventEmitter();
2205
+ }
2206
+ get tabs() {
2207
+ return Array.from(this.element.querySelectorAll('[cuiTab]'));
2208
+ }
2209
+ get activeElement() {
2210
+ return this.tabs[this.activeItemIndex] || null;
2211
+ }
2212
+ ngAfterViewChecked() {
2213
+ this.changeActiveItem();
2214
+ }
2215
+ onActivate(event) {
2216
+ event.stopPropagation();
2217
+ const index = this.tabs.findIndex((tab) => tab === event.target);
2218
+ if (index === this.activeItemIndex) {
2219
+ return;
2220
+ }
2221
+ this.activeItemIndexChange.emit(index);
2222
+ this.activeItemIndex = index;
2223
+ }
2224
+ changeActiveItem() {
2225
+ this.tabs.forEach(nativeElement => {
2226
+ const active = nativeElement === this.activeElement;
2227
+ nativeElement.classList.toggle(this.activeElementClass, active);
2228
+ });
2229
+ }
2230
+ }
2231
+ CuiTabsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2232
+ 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 });
2233
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabsComponent, decorators: [{
2234
+ type: Component,
2235
+ 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"] }]
2236
+ }], propDecorators: { activeItemIndex: [{
2237
+ type: Input
2238
+ }], activeItemIndexChange: [{
2239
+ type: Output
2240
+ }], onActivate: [{
2241
+ type: HostListener,
2242
+ args: [CUI_TAB_ACTIVATE, ['$event']]
2126
2243
  }] } });
2127
2244
 
2128
- class CuiTabsModule {
2129
- }
2130
- CuiTabsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2131
- CuiTabsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiTabsModule, declarations: [CuiTabsComponent, CuiTabComponent], exports: [CuiTabsComponent, CuiTabComponent] });
2132
- CuiTabsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabsModule });
2133
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabsModule, decorators: [{
2134
- type: NgModule,
2135
- args: [{
2136
- imports: [],
2137
- declarations: [CuiTabsComponent, CuiTabComponent],
2138
- exports: [CuiTabsComponent, CuiTabComponent]
2139
- }]
2245
+ class CuiTabsModule {
2246
+ }
2247
+ CuiTabsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2248
+ CuiTabsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiTabsModule, declarations: [CuiTabsComponent, CuiTabComponent], exports: [CuiTabsComponent, CuiTabComponent] });
2249
+ CuiTabsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabsModule });
2250
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTabsModule, decorators: [{
2251
+ type: NgModule,
2252
+ args: [{
2253
+ imports: [],
2254
+ declarations: [CuiTabsComponent, CuiTabComponent],
2255
+ exports: [CuiTabsComponent, CuiTabComponent]
2256
+ }]
2140
2257
  }] });
2141
2258
 
2142
- class CuiTextareaComponent {
2143
- constructor() {
2144
- this.cuiTextFieldController = inject(CUI_TEXT_FIELD_CONTROLLER);
2145
- this.rows = 4;
2146
- this.noBordersAndPaddings = false;
2147
- }
2148
- get isError() {
2149
- return this.cuiTextFieldController.isError;
2150
- }
2151
- }
2152
- CuiTextareaComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2153
- 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: i2.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 });
2154
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextareaComponent, decorators: [{
2155
- type: Component,
2156
- 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"] }]
2157
- }], propDecorators: { rows: [{
2158
- type: Input
2159
- }, {
2160
- type: HostBinding,
2161
- args: ['rows']
2162
- }], noBordersAndPaddings: [{
2163
- type: Input
2164
- }, {
2165
- type: HostBinding,
2166
- args: ['class._no-borders-and-paddings']
2167
- }], isError: [{
2168
- type: HostBinding,
2169
- args: ['class._with-error']
2259
+ class CuiTextareaComponent {
2260
+ constructor() {
2261
+ this.cuiTextFieldController = inject(CUI_TEXT_FIELD_CONTROLLER);
2262
+ this.rows = 4;
2263
+ this.noBordersAndPaddings = false;
2264
+ }
2265
+ get isError() {
2266
+ return this.cuiTextFieldController.isError;
2267
+ }
2268
+ }
2269
+ CuiTextareaComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2270
+ 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: i2.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 });
2271
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextareaComponent, decorators: [{
2272
+ type: Component,
2273
+ 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"] }]
2274
+ }], propDecorators: { rows: [{
2275
+ type: Input
2276
+ }, {
2277
+ type: HostBinding,
2278
+ args: ['rows']
2279
+ }], noBordersAndPaddings: [{
2280
+ type: Input
2281
+ }, {
2282
+ type: HostBinding,
2283
+ args: ['class._no-borders-and-paddings']
2284
+ }], isError: [{
2285
+ type: HostBinding,
2286
+ args: ['class._with-error']
2170
2287
  }] } });
2171
2288
 
2172
- class CuiTextareaModule {
2173
- }
2174
- CuiTextareaModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextareaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2175
- CuiTextareaModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiTextareaModule, declarations: [CuiTextareaComponent], exports: [CuiTextareaComponent] });
2176
- CuiTextareaModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextareaModule });
2177
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextareaModule, decorators: [{
2178
- type: NgModule,
2179
- args: [{
2180
- declarations: [CuiTextareaComponent],
2181
- exports: [CuiTextareaComponent]
2182
- }]
2289
+ class CuiTextareaModule {
2290
+ }
2291
+ CuiTextareaModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextareaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2292
+ CuiTextareaModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiTextareaModule, declarations: [CuiTextareaComponent], exports: [CuiTextareaComponent] });
2293
+ CuiTextareaModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextareaModule });
2294
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiTextareaModule, decorators: [{
2295
+ type: NgModule,
2296
+ args: [{
2297
+ declarations: [CuiTextareaComponent],
2298
+ exports: [CuiTextareaComponent]
2299
+ }]
2183
2300
  }] });
2184
2301
 
2185
- class CuiToggleComponent {
2186
- }
2187
- CuiToggleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2188
- 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 });
2189
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiToggleComponent, decorators: [{
2190
- type: Component,
2191
- 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"] }]
2302
+ class CuiToggleComponent {
2303
+ }
2304
+ CuiToggleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2305
+ 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 });
2306
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiToggleComponent, decorators: [{
2307
+ type: Component,
2308
+ 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"] }]
2192
2309
  }] });
2193
2310
 
2194
- class CuiToggleModule {
2195
- }
2196
- CuiToggleModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiToggleModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2197
- CuiToggleModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiToggleModule, declarations: [CuiToggleComponent], exports: [CuiToggleComponent] });
2198
- CuiToggleModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiToggleModule });
2199
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiToggleModule, decorators: [{
2200
- type: NgModule,
2201
- args: [{
2202
- declarations: [CuiToggleComponent],
2203
- exports: [CuiToggleComponent]
2204
- }]
2311
+ class CuiToggleModule {
2312
+ }
2313
+ CuiToggleModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiToggleModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2314
+ CuiToggleModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiToggleModule, declarations: [CuiToggleComponent], exports: [CuiToggleComponent] });
2315
+ CuiToggleModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiToggleModule });
2316
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiToggleModule, decorators: [{
2317
+ type: NgModule,
2318
+ args: [{
2319
+ declarations: [CuiToggleComponent],
2320
+ exports: [CuiToggleComponent]
2321
+ }]
2205
2322
  }] });
2206
2323
 
2207
- /**
2208
- * Generated bundle index. Do not edit.
2324
+ /**
2325
+ * Generated bundle index. Do not edit.
2209
2326
  */
2210
2327
 
2211
- 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_NOTIFICATION_DEFAULT_OPTIONS, 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, 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 };
2328
+ 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_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, 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, InputTimeModule, cuiRemoveSpaces, cuiReplace };
2212
2329
  //# sourceMappingURL=cuby-ui-core.mjs.map