@taiga-ui/kit 4.52.0-canary.bf9131e → 4.52.0-canary.c91900a

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (243) hide show
  1. package/README.md +1 -1
  2. package/components/badge/badge.options.d.ts +1 -3
  3. package/components/badge-notification/badge-notification.options.d.ts +1 -3
  4. package/components/block/block.options.d.ts +1 -3
  5. package/components/breadcrumbs/breadcrumbs.options.d.ts +1 -3
  6. package/components/chip/chip.options.d.ts +1 -3
  7. package/components/confirm/confirm.component.d.ts +3 -2
  8. package/components/copy/copy.component.d.ts +1 -1
  9. package/components/copy/copy.directive.d.ts +1 -2
  10. package/components/data-list-wrapper/data-list-group-wrapper.component.d.ts +2 -2
  11. package/components/data-list-wrapper/data-list-wrapper.component.d.ts +14 -22
  12. package/components/data-list-wrapper/{data-list-wrapper.module.d.ts → data-list-wrapper.d.ts} +1 -2
  13. package/components/data-list-wrapper/index.d.ts +1 -1
  14. package/components/files/file/file.options.d.ts +1 -1
  15. package/components/files/input-files/input-files.options.d.ts +1 -3
  16. package/components/input-chip/input-chip.component.d.ts +8 -7
  17. package/components/input-chip/input-chip.directive.d.ts +7 -12
  18. package/components/input-date/input-date.directive.d.ts +4 -6
  19. package/components/input-date-multi/input-date-multi.directive.d.ts +9 -13
  20. package/components/input-number/input-number.directive.d.ts +5 -9
  21. package/components/input-phone-international/input-phone-international.component.d.ts +4 -4
  22. package/components/input-phone-international/input-phone-international.options.d.ts +1 -3
  23. package/components/input-range/input-range.component.d.ts +1 -1
  24. package/components/input-slider/input-slider.directive.d.ts +1 -1
  25. package/components/input-time/input-time.directive.d.ts +1 -1
  26. package/components/input-year/input-year.directive.d.ts +1 -1
  27. package/components/line-clamp/line-clamp.options.d.ts +1 -3
  28. package/components/multi-select/multi-select-group/multi-select-group.component.d.ts +4 -6
  29. package/components/notification-middle/notification-middle.component.d.ts +2 -2
  30. package/components/notification-middle/notification-middle.directive.d.ts +4 -3
  31. package/components/notification-middle/notification-middle.service.d.ts +7 -3
  32. package/components/pagination/index.d.ts +1 -0
  33. package/components/pagination/pagination.component.d.ts +2 -1
  34. package/components/pagination/pagination.options.d.ts +10 -0
  35. package/components/preview/dialog/preview-dialog.component.d.ts +2 -2
  36. package/components/preview/dialog/preview-dialog.directive.d.ts +3 -3
  37. package/components/preview/dialog/preview-dialog.service.d.ts +5 -2
  38. package/components/preview/preview.d.ts +2 -1
  39. package/components/progress/progress-bar/progress-color-segments.directive.d.ts +4 -4
  40. package/components/progress/progress.options.d.ts +1 -3
  41. package/components/push/push-alert.component.d.ts +2 -2
  42. package/components/push/push.options.d.ts +4 -3
  43. package/components/push/push.service.d.ts +2 -2
  44. package/components/radio-list/radio-list.component.d.ts +5 -3
  45. package/components/rating/rating.component.d.ts +1 -1
  46. package/components/rating/rating.options.d.ts +1 -3
  47. package/components/segmented/segmented.component.d.ts +4 -6
  48. package/components/segmented/segmented.directive.d.ts +6 -7
  49. package/components/select/native-select/native-select.component.d.ts +4 -5
  50. package/components/slider/slider.options.d.ts +1 -6
  51. package/components/stepper/step.component.d.ts +6 -8
  52. package/components/stepper/stepper.component.d.ts +6 -11
  53. package/components/tabs/tabs.options.d.ts +1 -6
  54. package/components/toast/toast.component.d.ts +4 -4
  55. package/components/toast/toast.options.d.ts +4 -3
  56. package/components/toast/toast.service.d.ts +2 -2
  57. package/components/tree/components/tree-item-content/tree-item-content.component.d.ts +7 -0
  58. package/components/tree/misc/tree.constants.d.ts +0 -3
  59. package/components/tree/misc/tree.tokens.d.ts +1 -6
  60. package/directives/button-close/button-close.directive.d.ts +2 -1
  61. package/directives/button-select/button-select.directive.d.ts +2 -1
  62. package/directives/data-list-dropdown-manager/data-list-dropdown-manager.directive.d.ts +5 -5
  63. package/directives/fade/fade.directive.d.ts +1 -2
  64. package/directives/fluid-typography/fluid-typography.directive.d.ts +3 -6
  65. package/directives/fluid-typography/fluid-typography.options.d.ts +1 -3
  66. package/fesm2022/taiga-ui-kit-components-accordion.mjs +1 -2
  67. package/fesm2022/taiga-ui-kit-components-accordion.mjs.map +1 -1
  68. package/fesm2022/taiga-ui-kit-components-avatar.mjs +3 -3
  69. package/fesm2022/taiga-ui-kit-components-avatar.mjs.map +1 -1
  70. package/fesm2022/taiga-ui-kit-components-badge-notification.mjs +4 -9
  71. package/fesm2022/taiga-ui-kit-components-badge-notification.mjs.map +1 -1
  72. package/fesm2022/taiga-ui-kit-components-badge.mjs +4 -8
  73. package/fesm2022/taiga-ui-kit-components-badge.mjs.map +1 -1
  74. package/fesm2022/taiga-ui-kit-components-badged-content.mjs +0 -1
  75. package/fesm2022/taiga-ui-kit-components-badged-content.mjs.map +1 -1
  76. package/fesm2022/taiga-ui-kit-components-block.mjs +4 -8
  77. package/fesm2022/taiga-ui-kit-components-block.mjs.map +1 -1
  78. package/fesm2022/taiga-ui-kit-components-breadcrumbs.mjs +5 -10
  79. package/fesm2022/taiga-ui-kit-components-breadcrumbs.mjs.map +1 -1
  80. package/fesm2022/taiga-ui-kit-components-calendar-month.mjs +3 -13
  81. package/fesm2022/taiga-ui-kit-components-calendar-month.mjs.map +1 -1
  82. package/fesm2022/taiga-ui-kit-components-calendar-range.mjs +2 -2
  83. package/fesm2022/taiga-ui-kit-components-calendar-range.mjs.map +1 -1
  84. package/fesm2022/taiga-ui-kit-components-carousel.mjs +1 -7
  85. package/fesm2022/taiga-ui-kit-components-carousel.mjs.map +1 -1
  86. package/fesm2022/taiga-ui-kit-components-checkbox.mjs +2 -3
  87. package/fesm2022/taiga-ui-kit-components-checkbox.mjs.map +1 -1
  88. package/fesm2022/taiga-ui-kit-components-chip.mjs +6 -10
  89. package/fesm2022/taiga-ui-kit-components-chip.mjs.map +1 -1
  90. package/fesm2022/taiga-ui-kit-components-combo-box.mjs +3 -4
  91. package/fesm2022/taiga-ui-kit-components-combo-box.mjs.map +1 -1
  92. package/fesm2022/taiga-ui-kit-components-compass.mjs +3 -3
  93. package/fesm2022/taiga-ui-kit-components-compass.mjs.map +1 -1
  94. package/fesm2022/taiga-ui-kit-components-confirm.mjs +4 -6
  95. package/fesm2022/taiga-ui-kit-components-confirm.mjs.map +1 -1
  96. package/fesm2022/taiga-ui-kit-components-copy.mjs +6 -10
  97. package/fesm2022/taiga-ui-kit-components-copy.mjs.map +1 -1
  98. package/fesm2022/taiga-ui-kit-components-data-list-wrapper.mjs +17 -80
  99. package/fesm2022/taiga-ui-kit-components-data-list-wrapper.mjs.map +1 -1
  100. package/fesm2022/taiga-ui-kit-components-elastic-container.mjs +0 -1
  101. package/fesm2022/taiga-ui-kit-components-elastic-container.mjs.map +1 -1
  102. package/fesm2022/taiga-ui-kit-components-files.mjs +9 -17
  103. package/fesm2022/taiga-ui-kit-components-files.mjs.map +1 -1
  104. package/fesm2022/taiga-ui-kit-components-floating-container.mjs +2 -2
  105. package/fesm2022/taiga-ui-kit-components-floating-container.mjs.map +1 -1
  106. package/fesm2022/taiga-ui-kit-components-input-chip.mjs +49 -67
  107. package/fesm2022/taiga-ui-kit-components-input-chip.mjs.map +1 -1
  108. package/fesm2022/taiga-ui-kit-components-input-date-multi.mjs +26 -44
  109. package/fesm2022/taiga-ui-kit-components-input-date-multi.mjs.map +1 -1
  110. package/fesm2022/taiga-ui-kit-components-input-date-range.mjs +3 -4
  111. package/fesm2022/taiga-ui-kit-components-input-date-range.mjs.map +1 -1
  112. package/fesm2022/taiga-ui-kit-components-input-date-time.mjs +5 -6
  113. package/fesm2022/taiga-ui-kit-components-input-date-time.mjs.map +1 -1
  114. package/fesm2022/taiga-ui-kit-components-input-date.mjs +15 -25
  115. package/fesm2022/taiga-ui-kit-components-input-date.mjs.map +1 -1
  116. package/fesm2022/taiga-ui-kit-components-input-inline.mjs +2 -3
  117. package/fesm2022/taiga-ui-kit-components-input-inline.mjs.map +1 -1
  118. package/fesm2022/taiga-ui-kit-components-input-month-range.mjs +3 -4
  119. package/fesm2022/taiga-ui-kit-components-input-month-range.mjs.map +1 -1
  120. package/fesm2022/taiga-ui-kit-components-input-month.mjs +3 -4
  121. package/fesm2022/taiga-ui-kit-components-input-month.mjs.map +1 -1
  122. package/fesm2022/taiga-ui-kit-components-input-number.mjs +20 -45
  123. package/fesm2022/taiga-ui-kit-components-input-number.mjs.map +1 -1
  124. package/fesm2022/taiga-ui-kit-components-input-phone-international.mjs +13 -20
  125. package/fesm2022/taiga-ui-kit-components-input-phone-international.mjs.map +1 -1
  126. package/fesm2022/taiga-ui-kit-components-input-phone.mjs +1 -2
  127. package/fesm2022/taiga-ui-kit-components-input-phone.mjs.map +1 -1
  128. package/fesm2022/taiga-ui-kit-components-input-pin.mjs +3 -4
  129. package/fesm2022/taiga-ui-kit-components-input-pin.mjs.map +1 -1
  130. package/fesm2022/taiga-ui-kit-components-input-range.mjs +2 -2
  131. package/fesm2022/taiga-ui-kit-components-input-range.mjs.map +1 -1
  132. package/fesm2022/taiga-ui-kit-components-input-slider.mjs +3 -4
  133. package/fesm2022/taiga-ui-kit-components-input-slider.mjs.map +1 -1
  134. package/fesm2022/taiga-ui-kit-components-input-time.mjs +6 -8
  135. package/fesm2022/taiga-ui-kit-components-input-time.mjs.map +1 -1
  136. package/fesm2022/taiga-ui-kit-components-input-year.mjs +5 -6
  137. package/fesm2022/taiga-ui-kit-components-input-year.mjs.map +1 -1
  138. package/fesm2022/taiga-ui-kit-components-items-with-more.mjs +0 -2
  139. package/fesm2022/taiga-ui-kit-components-items-with-more.mjs.map +1 -1
  140. package/fesm2022/taiga-ui-kit-components-like.mjs +1 -1
  141. package/fesm2022/taiga-ui-kit-components-like.mjs.map +1 -1
  142. package/fesm2022/taiga-ui-kit-components-line-clamp.mjs +6 -11
  143. package/fesm2022/taiga-ui-kit-components-line-clamp.mjs.map +1 -1
  144. package/fesm2022/taiga-ui-kit-components-message.mjs +0 -1
  145. package/fesm2022/taiga-ui-kit-components-message.mjs.map +1 -1
  146. package/fesm2022/taiga-ui-kit-components-multi-select.mjs +20 -30
  147. package/fesm2022/taiga-ui-kit-components-multi-select.mjs.map +1 -1
  148. package/fesm2022/taiga-ui-kit-components-notification-middle.mjs +30 -19
  149. package/fesm2022/taiga-ui-kit-components-notification-middle.mjs.map +1 -1
  150. package/fesm2022/taiga-ui-kit-components-pager.mjs +4 -6
  151. package/fesm2022/taiga-ui-kit-components-pager.mjs.map +1 -1
  152. package/fesm2022/taiga-ui-kit-components-pagination.mjs +19 -9
  153. package/fesm2022/taiga-ui-kit-components-pagination.mjs.map +1 -1
  154. package/fesm2022/taiga-ui-kit-components-pin.mjs +2 -2
  155. package/fesm2022/taiga-ui-kit-components-pin.mjs.map +1 -1
  156. package/fesm2022/taiga-ui-kit-components-preview.mjs +27 -19
  157. package/fesm2022/taiga-ui-kit-components-preview.mjs.map +1 -1
  158. package/fesm2022/taiga-ui-kit-components-progress.mjs +41 -33
  159. package/fesm2022/taiga-ui-kit-components-progress.mjs.map +1 -1
  160. package/fesm2022/taiga-ui-kit-components-pulse.mjs +1 -1
  161. package/fesm2022/taiga-ui-kit-components-pulse.mjs.map +1 -1
  162. package/fesm2022/taiga-ui-kit-components-push.mjs +8 -8
  163. package/fesm2022/taiga-ui-kit-components-push.mjs.map +1 -1
  164. package/fesm2022/taiga-ui-kit-components-radio-list.mjs +4 -4
  165. package/fesm2022/taiga-ui-kit-components-radio-list.mjs.map +1 -1
  166. package/fesm2022/taiga-ui-kit-components-radio.mjs +3 -4
  167. package/fesm2022/taiga-ui-kit-components-radio.mjs.map +1 -1
  168. package/fesm2022/taiga-ui-kit-components-range.mjs +3 -6
  169. package/fesm2022/taiga-ui-kit-components-range.mjs.map +1 -1
  170. package/fesm2022/taiga-ui-kit-components-rating.mjs +4 -9
  171. package/fesm2022/taiga-ui-kit-components-rating.mjs.map +1 -1
  172. package/fesm2022/taiga-ui-kit-components-routable-dialog.mjs +7 -3
  173. package/fesm2022/taiga-ui-kit-components-routable-dialog.mjs.map +1 -1
  174. package/fesm2022/taiga-ui-kit-components-segmented.mjs +28 -55
  175. package/fesm2022/taiga-ui-kit-components-segmented.mjs.map +1 -1
  176. package/fesm2022/taiga-ui-kit-components-select.mjs +14 -25
  177. package/fesm2022/taiga-ui-kit-components-select.mjs.map +1 -1
  178. package/fesm2022/taiga-ui-kit-components-slider.mjs +7 -17
  179. package/fesm2022/taiga-ui-kit-components-slider.mjs.map +1 -1
  180. package/fesm2022/taiga-ui-kit-components-stepper.mjs +41 -75
  181. package/fesm2022/taiga-ui-kit-components-stepper.mjs.map +1 -1
  182. package/fesm2022/taiga-ui-kit-components-switch.mjs +2 -3
  183. package/fesm2022/taiga-ui-kit-components-switch.mjs.map +1 -1
  184. package/fesm2022/taiga-ui-kit-components-tabs.mjs +7 -15
  185. package/fesm2022/taiga-ui-kit-components-tabs.mjs.map +1 -1
  186. package/fesm2022/taiga-ui-kit-components-textarea.mjs +4 -7
  187. package/fesm2022/taiga-ui-kit-components-textarea.mjs.map +1 -1
  188. package/fesm2022/taiga-ui-kit-components-tiles.mjs +2 -3
  189. package/fesm2022/taiga-ui-kit-components-tiles.mjs.map +1 -1
  190. package/fesm2022/taiga-ui-kit-components-toast.mjs +15 -15
  191. package/fesm2022/taiga-ui-kit-components-toast.mjs.map +1 -1
  192. package/fesm2022/taiga-ui-kit-components-tree.mjs +36 -40
  193. package/fesm2022/taiga-ui-kit-components-tree.mjs.map +1 -1
  194. package/fesm2022/taiga-ui-kit-directives-button-close.mjs +13 -5
  195. package/fesm2022/taiga-ui-kit-directives-button-close.mjs.map +1 -1
  196. package/fesm2022/taiga-ui-kit-directives-button-select.mjs +14 -6
  197. package/fesm2022/taiga-ui-kit-directives-button-select.mjs.map +1 -1
  198. package/fesm2022/taiga-ui-kit-directives-chevron.mjs +2 -1
  199. package/fesm2022/taiga-ui-kit-directives-chevron.mjs.map +1 -1
  200. package/fesm2022/taiga-ui-kit-directives-connected.mjs +0 -1
  201. package/fesm2022/taiga-ui-kit-directives-connected.mjs.map +1 -1
  202. package/fesm2022/taiga-ui-kit-directives-data-list-dropdown-manager.mjs +22 -50
  203. package/fesm2022/taiga-ui-kit-directives-data-list-dropdown-manager.mjs.map +1 -1
  204. package/fesm2022/taiga-ui-kit-directives-fade.mjs +7 -6
  205. package/fesm2022/taiga-ui-kit-directives-fade.mjs.map +1 -1
  206. package/fesm2022/taiga-ui-kit-directives-fluid-typography.mjs +12 -25
  207. package/fesm2022/taiga-ui-kit-directives-fluid-typography.mjs.map +1 -1
  208. package/fesm2022/taiga-ui-kit-directives-highlight.mjs +0 -1
  209. package/fesm2022/taiga-ui-kit-directives-highlight.mjs.map +1 -1
  210. package/fesm2022/taiga-ui-kit-directives-lazy-loading.mjs +0 -1
  211. package/fesm2022/taiga-ui-kit-directives-lazy-loading.mjs.map +1 -1
  212. package/fesm2022/taiga-ui-kit-directives-password.mjs +5 -4
  213. package/fesm2022/taiga-ui-kit-directives-password.mjs.map +1 -1
  214. package/fesm2022/taiga-ui-kit-directives-present.mjs +0 -1
  215. package/fesm2022/taiga-ui-kit-directives-present.mjs.map +1 -1
  216. package/fesm2022/taiga-ui-kit-directives-tooltip.mjs +2 -2
  217. package/fesm2022/taiga-ui-kit-directives-tooltip.mjs.map +1 -1
  218. package/fesm2022/taiga-ui-kit-directives-unfinished-validator.mjs +1 -2
  219. package/fesm2022/taiga-ui-kit-directives-unfinished-validator.mjs.map +1 -1
  220. package/fesm2022/taiga-ui-kit-directives-unmask-handler.mjs +1 -2
  221. package/fesm2022/taiga-ui-kit-directives-unmask-handler.mjs.map +1 -1
  222. package/fesm2022/taiga-ui-kit-pipes-emails.mjs +0 -1
  223. package/fesm2022/taiga-ui-kit-pipes-emails.mjs.map +1 -1
  224. package/fesm2022/taiga-ui-kit-pipes-filter-by-input.mjs +0 -1
  225. package/fesm2022/taiga-ui-kit-pipes-filter-by-input.mjs.map +1 -1
  226. package/fesm2022/taiga-ui-kit-pipes-hide-selected.mjs +1 -2
  227. package/fesm2022/taiga-ui-kit-pipes-hide-selected.mjs.map +1 -1
  228. package/fesm2022/taiga-ui-kit-pipes-sort-countries.mjs +0 -1
  229. package/fesm2022/taiga-ui-kit-pipes-sort-countries.mjs.map +1 -1
  230. package/fesm2022/taiga-ui-kit-pipes-stringify-content.mjs +0 -1
  231. package/fesm2022/taiga-ui-kit-pipes-stringify-content.mjs.map +1 -1
  232. package/fesm2022/taiga-ui-kit-pipes-stringify.mjs +0 -1
  233. package/fesm2022/taiga-ui-kit-pipes-stringify.mjs.map +1 -1
  234. package/fesm2022/taiga-ui-kit-tokens.mjs +2 -17
  235. package/fesm2022/taiga-ui-kit-tokens.mjs.map +1 -1
  236. package/fesm2022/taiga-ui-kit-utils.mjs +1 -1
  237. package/fesm2022/taiga-ui-kit-utils.mjs.map +1 -1
  238. package/package.json +22 -23
  239. package/pipes/stringify-content/stringify-content.pipe.d.ts +2 -3
  240. package/tokens/items-handlers.d.ts +1 -7
  241. package/tokens/preview-icons.d.ts +1 -3
  242. package/fesm2022/taiga-ui-kit-components-preview-dialog.mjs +0 -64
  243. package/fesm2022/taiga-ui-kit-components-preview-dialog.mjs.map +0 -1
@@ -1,71 +1,55 @@
1
1
  import * as i0 from '@angular/core';
2
- import { inject, ElementRef, ContentChildren, Directive, EventEmitter, Output, Input, ChangeDetectionStrategy, ViewEncapsulation, Component } from '@angular/core';
3
- import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
2
+ import { inject, contentChildren, ElementRef, Directive, input, model, ChangeDetectionStrategy, ViewEncapsulation, Component } from '@angular/core';
3
+ import { toObservable, takeUntilDestroyed } from '@angular/core/rxjs-interop';
4
4
  import { ResizeObserverService } from '@ng-web-apis/resize-observer';
5
- import { tuiQueryListChanges, tuiControlValue, tuiZonefree } from '@taiga-ui/cdk/observables';
5
+ import { tuiControlValue, tuiZonefree } from '@taiga-ui/cdk/observables';
6
6
  import { tuiCreateOptions } from '@taiga-ui/cdk/utils/di';
7
7
  import { tuiInjectElement, tuiIsHTMLElement } from '@taiga-ui/cdk/utils/dom';
8
8
  import { tuiPx } from '@taiga-ui/cdk/utils/miscellaneous';
9
9
  import { tuiBadgeNotificationOptionsProvider } from '@taiga-ui/kit/components/badge-notification';
10
10
  import { NgControl, RadioControlValueAccessor } from '@angular/forms';
11
11
  import { RouterLinkActive } from '@angular/router';
12
- import { EMPTY_QUERY } from '@taiga-ui/cdk/constants';
13
12
  import { switchMap, map } from 'rxjs';
14
13
 
15
14
  class TuiSegmentedDirective {
16
15
  constructor() {
17
- this.controls = EMPTY_QUERY;
18
- this.radios = EMPTY_QUERY;
19
- this.links = EMPTY_QUERY;
20
- this.elements = EMPTY_QUERY;
21
16
  this.component = inject(TuiSegmented);
22
17
  this.el = tuiInjectElement();
18
+ this.links = contentChildren(RouterLinkActive);
19
+ this.elements = contentChildren(RouterLinkActive, { read: ElementRef });
20
+ this.controls = contentChildren(NgControl, { descendants: true });
21
+ this.controls$ = toObservable(this.controls);
22
+ this.radios = contentChildren(RadioControlValueAccessor, {
23
+ descendants: true,
24
+ });
23
25
  }
24
26
  ngAfterContentInit() {
25
- tuiQueryListChanges(this.controls)
26
- .pipe(switchMap(() => tuiControlValue(this.controls.first)), map((value) => this.radios.toArray().findIndex((c) => c.value === value)))
27
+ this.controls$
28
+ .pipe(switchMap(([control]) => tuiControlValue(control)), map((value) => this.radios().findIndex((c) => c.value === value)))
27
29
  .subscribe((index) => {
28
30
  this.component.update(index);
29
31
  });
30
32
  }
31
33
  ngAfterContentChecked() {
32
- if (this.links.length) {
33
- this.update(this.elements.get(this.linkIndex)?.nativeElement || null);
34
+ const index = this.links().findIndex(({ isActive }) => isActive);
35
+ if (index !== -1) {
36
+ this.update(this.elements()[index]?.nativeElement || null);
34
37
  }
35
38
  }
36
39
  update(target) {
37
- this.component.update(this.getIndex(target));
38
- }
39
- get linkIndex() {
40
- return this.links.toArray().findIndex((link) => link.isActive);
41
- }
42
- getIndex(element) {
43
- return Array.from(this.el.children).findIndex((tab) => tab.contains(element));
40
+ this.component.update(Array.from(this.el.children).findIndex((tab) => tab.contains(target)));
44
41
  }
45
42
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiSegmentedDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
46
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.15", type: TuiSegmentedDirective, isStandalone: true, host: { listeners: { "click": "update($event.target)" } }, queries: [{ propertyName: "controls", predicate: NgControl, descendants: true }, { propertyName: "radios", predicate: RadioControlValueAccessor, descendants: true }, { propertyName: "links", predicate: RouterLinkActive }, { propertyName: "elements", predicate: RouterLinkActive, read: ElementRef }], ngImport: i0 }); }
43
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "19.2.15", type: TuiSegmentedDirective, isStandalone: true, host: { listeners: { "click": "update($event.target)" } }, queries: [{ propertyName: "links", predicate: RouterLinkActive, isSignal: true }, { propertyName: "elements", predicate: RouterLinkActive, read: ElementRef, isSignal: true }, { propertyName: "controls", predicate: NgControl, descendants: true, isSignal: true }, { propertyName: "radios", predicate: RadioControlValueAccessor, descendants: true, isSignal: true }], ngImport: i0 }); }
47
44
  }
48
45
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiSegmentedDirective, decorators: [{
49
46
  type: Directive,
50
47
  args: [{
51
- standalone: true,
52
48
  host: {
53
49
  '(click)': 'update($event.target)',
54
50
  },
55
51
  }]
56
- }], propDecorators: { controls: [{
57
- type: ContentChildren,
58
- args: [NgControl, { descendants: true }]
59
- }], radios: [{
60
- type: ContentChildren,
61
- args: [RadioControlValueAccessor, { descendants: true }]
62
- }], links: [{
63
- type: ContentChildren,
64
- args: [RouterLinkActive]
65
- }], elements: [{
66
- type: ContentChildren,
67
- args: [RouterLinkActive, { read: ElementRef }]
68
- }] } });
52
+ }] });
69
53
 
70
54
  const [TUI_SEGMENTED_OPTIONS, tuiSegmentedOptionsProvider] = tuiCreateOptions({
71
55
  size: 's',
@@ -76,26 +60,21 @@ class TuiSegmented {
76
60
  this.sub = inject(ResizeObserverService, { self: true })
77
61
  .pipe(tuiZonefree(), takeUntilDestroyed())
78
62
  .subscribe(() => this.refresh());
79
- this.size = inject(TUI_SEGMENTED_OPTIONS).size;
80
- this.activeItemIndex = 0;
81
- this.activeItemIndexChange = new EventEmitter();
63
+ this.size = input(inject(TUI_SEGMENTED_OPTIONS).size);
64
+ this.activeItemIndex = model(0);
82
65
  }
83
66
  ngOnChanges() {
84
67
  this.refresh();
85
68
  }
86
69
  update(activeItemIndex) {
87
- if (activeItemIndex === this.activeItemIndex || activeItemIndex < 0) {
70
+ if (activeItemIndex === this.activeItemIndex() || activeItemIndex < 0) {
88
71
  return;
89
72
  }
90
- this.activeItemIndex = activeItemIndex;
91
- this.activeItemIndexChange.emit(activeItemIndex);
73
+ this.activeItemIndex.set(activeItemIndex);
92
74
  this.refresh();
93
75
  }
94
- get activeElement() {
95
- return this.el.children.item(this.activeItemIndex);
96
- }
97
76
  refresh() {
98
- const el = this.activeElement;
77
+ const el = this.el.children.item(this.activeItemIndex());
99
78
  if (!tuiIsHTMLElement(el)) {
100
79
  return;
101
80
  }
@@ -107,20 +86,14 @@ class TuiSegmented {
107
86
  this.el.style.setProperty('--t-width', tuiPx(offsetWidth));
108
87
  }
109
88
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiSegmented, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
110
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: TuiSegmented, isStandalone: true, selector: "tui-segmented", inputs: { size: "size", activeItemIndex: "activeItemIndex" }, outputs: { activeItemIndexChange: "activeItemIndexChange" }, host: { properties: { "attr.data-size": "size" } }, providers: [ResizeObserverService, tuiBadgeNotificationOptionsProvider({ size: 's' })], usesOnChanges: true, hostDirectives: [{ directive: TuiSegmentedDirective }], ngImport: i0, template: '<ng-content />', isInline: true, styles: ["tui-segmented{position:relative;display:flex;color:var(--tui-background-base);background:var(--tui-background-neutral-1);overflow:hidden;-webkit-mask-image:linear-gradient(#000,#000);mask-image:linear-gradient(#000,#000)}tui-segmented[data-size=s]{--t-padding: .5rem;--t-gap: .5rem;--t-margin: -.125rem;--t-height: var(--tui-height-s);font:var(--tui-font-text-s);border-radius:var(--tui-radius-m)}tui-segmented[data-size=s] tui-icon{font-size:1rem}tui-segmented[data-size=m]{--t-padding: .875rem;--t-gap: 1rem;--t-margin: -.375rem;--t-height: var(--tui-height-m);font:var(--tui-font-text-m);border-radius:var(--tui-radius-m)}tui-segmented[data-size=l]{--t-padding: 1.25rem;--t-gap: 1rem;--t-margin: -.375rem;--t-height: var(--tui-height-l);font:var(--tui-font-text-l);border-radius:var(--tui-radius-l)}tui-segmented[data-size=l]>*:before{block-size:1.25rem}tui-segmented>a,tui-segmented>button,tui-segmented>label,tui-segmented>label>input:not([tuiRadio]){transition-property:color,background,opacity,border-image;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;-webkit-appearance:none;appearance:none;padding:0;border:0;background:none;line-height:inherit;text-decoration:none;position:relative;display:flex;align-items:center;justify-content:center;block-size:var(--t-height);white-space:nowrap;gap:var(--t-gap);margin:0;padding:0 var(--t-padding);color:var(--tui-text-primary);overflow:hidden;cursor:pointer;font:inherit;border-radius:inherit;border:.125rem solid transparent;background-clip:padding-box;box-sizing:border-box;border-image:linear-gradient(var(--tui-border-normal),transparent) 1 / 0 0 25% .5 / 0 0 100 .5;clip-path:polygon(-1rem calc(50% - .5rem),1px calc(50% - .5rem),1px 0,100% 0,100% 100%,1px 100%,1px calc(50% + .5rem),-1rem calc(50% + .5rem))}tui-segmented>a>*,tui-segmented>button>*,tui-segmented>label>*,tui-segmented>label>input:not([tuiRadio])>*{margin:0 var(--t-margin)}tui-segmented>a:focus-visible,tui-segmented>button:focus-visible,tui-segmented>label:focus-visible,tui-segmented>label>input:not([tuiRadio]):focus-visible{outline:.125rem solid var(--tui-border-focus);outline-offset:-.25rem}@media (hover: hover) and (pointer: fine){tui-segmented>a:not(.tui-segmented_active):not(:active):hover,tui-segmented>button:not(.tui-segmented_active):not(:active):hover,tui-segmented>label:not(.tui-segmented_active):not(:active):hover,tui-segmented>label>input:not([tuiRadio]):not(.tui-segmented_active):not(:active):hover{background-color:var(--tui-background-neutral-1-hover)}tui-segmented>a:not(.tui-segmented_active):not(:active):hover,tui-segmented>button:not(.tui-segmented_active):not(:active):hover,tui-segmented>label:not(.tui-segmented_active):not(:active):hover,tui-segmented>label>input:not([tuiRadio]):not(.tui-segmented_active):not(:active):hover,tui-segmented>a:not(.tui-segmented_active):not(:active):hover+*,tui-segmented>button:not(.tui-segmented_active):not(:active):hover+*,tui-segmented>label:not(.tui-segmented_active):not(:active):hover+*,tui-segmented>label>input:not([tuiRadio]):not(.tui-segmented_active):not(:active):hover+*{border-image:linear-gradient(var(--tui-border-normal),transparent) 1 / 0 0 25% .5 / 100 0 0 .5}}tui-segmented>a:active,tui-segmented>button:active,tui-segmented>label:active,tui-segmented>label>input:not([tuiRadio]):active,tui-segmented>a:active+*,tui-segmented>button:active+*,tui-segmented>label:active+*,tui-segmented>label>input:not([tuiRadio]):active+*,tui-segmented>a.tui-segmented_active,tui-segmented>button.tui-segmented_active,tui-segmented>label.tui-segmented_active,tui-segmented>label>input:not([tuiRadio]).tui-segmented_active,tui-segmented>a.tui-segmented_active+*,tui-segmented>button.tui-segmented_active+*,tui-segmented>label.tui-segmented_active+*,tui-segmented>label>input:not([tuiRadio]).tui-segmented_active+*{border-image:linear-gradient(var(--tui-border-normal),transparent) 1 / 0 0 25% .5 / 100 0 0 .5}tui-segmented>label>input:not([tuiRadio]){position:absolute;top:-.125rem;left:-.125rem;right:-.125rem;bottom:-.125rem;background:transparent!important}tui-segmented:before{transition-property:top,left,width;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;content:\"\";position:absolute;left:var(--t-left);top:var(--t-top);block-size:var(--t-height);inline-size:var(--t-width);border-radius:inherit;background:currentColor;background-clip:padding-box;border:.125rem solid transparent;box-sizing:border-box;filter:drop-shadow(0 .25rem 1.25rem rgba(0,0,0,.1))}[tuiTheme=dark] tui-segmented,tui-segmented[tuiTheme=dark]{--tui-background-base: var(--tui-background-neutral-1-hover)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
89
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.15", type: TuiSegmented, isStandalone: true, selector: "tui-segmented", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, activeItemIndex: { classPropertyName: "activeItemIndex", publicName: "activeItemIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activeItemIndex: "activeItemIndexChange" }, host: { properties: { "attr.data-size": "size()" } }, providers: [ResizeObserverService, tuiBadgeNotificationOptionsProvider({ size: 's' })], usesOnChanges: true, hostDirectives: [{ directive: TuiSegmentedDirective }], ngImport: i0, template: '<ng-content />', isInline: true, styles: ["tui-segmented{position:relative;display:flex;color:var(--tui-background-base);background:var(--tui-background-neutral-1);overflow:hidden;-webkit-mask-image:linear-gradient(#000,#000);mask-image:linear-gradient(#000,#000)}tui-segmented[data-size=s]{--t-padding: .5rem;--t-gap: .5rem;--t-margin: -.125rem;--t-height: var(--tui-height-s);font:var(--tui-font-text-s);border-radius:var(--tui-radius-m)}tui-segmented[data-size=s] tui-icon{font-size:1rem}tui-segmented[data-size=m]{--t-padding: .875rem;--t-gap: 1rem;--t-margin: -.375rem;--t-height: var(--tui-height-m);font:var(--tui-font-text-m);border-radius:var(--tui-radius-m)}tui-segmented[data-size=l]{--t-padding: 1.25rem;--t-gap: 1rem;--t-margin: -.375rem;--t-height: var(--tui-height-l);font:var(--tui-font-text-l);border-radius:var(--tui-radius-l)}tui-segmented[data-size=l]>*:before{block-size:1.25rem}tui-segmented>a,tui-segmented>button,tui-segmented>label,tui-segmented>label>input:not([tuiRadio]){transition-property:color,background,opacity,border-image;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;-webkit-appearance:none;appearance:none;padding:0;border:0;background:none;line-height:inherit;text-decoration:none;position:relative;display:flex;align-items:center;justify-content:center;block-size:var(--t-height);white-space:nowrap;gap:var(--t-gap);margin:0;padding:0 var(--t-padding);color:var(--tui-text-primary);overflow:hidden;cursor:pointer;font:inherit;border-radius:inherit;border:.125rem solid transparent;background-clip:padding-box;box-sizing:border-box;border-image:linear-gradient(var(--tui-border-normal),transparent) 1 / 0 0 25% .5 / 0 0 100 .5;clip-path:polygon(-1rem calc(50% - .5rem),1px calc(50% - .5rem),1px 0,100% 0,100% 100%,1px 100%,1px calc(50% + .5rem),-1rem calc(50% + .5rem))}tui-segmented>a>*,tui-segmented>button>*,tui-segmented>label>*,tui-segmented>label>input:not([tuiRadio])>*{margin:0 var(--t-margin)}tui-segmented>a:focus-visible,tui-segmented>button:focus-visible,tui-segmented>label:focus-visible,tui-segmented>label>input:not([tuiRadio]):focus-visible{outline:.125rem solid var(--tui-border-focus);outline-offset:-.25rem}@media (hover: hover) and (pointer: fine){tui-segmented>a:not(.tui-segmented_active):not(:active):hover,tui-segmented>button:not(.tui-segmented_active):not(:active):hover,tui-segmented>label:not(.tui-segmented_active):not(:active):hover,tui-segmented>label>input:not([tuiRadio]):not(.tui-segmented_active):not(:active):hover{background-color:var(--tui-background-neutral-1-hover)}tui-segmented>a:not(.tui-segmented_active):not(:active):hover,tui-segmented>button:not(.tui-segmented_active):not(:active):hover,tui-segmented>label:not(.tui-segmented_active):not(:active):hover,tui-segmented>label>input:not([tuiRadio]):not(.tui-segmented_active):not(:active):hover,tui-segmented>a:not(.tui-segmented_active):not(:active):hover+*,tui-segmented>button:not(.tui-segmented_active):not(:active):hover+*,tui-segmented>label:not(.tui-segmented_active):not(:active):hover+*,tui-segmented>label>input:not([tuiRadio]):not(.tui-segmented_active):not(:active):hover+*{border-image:linear-gradient(var(--tui-border-normal),transparent) 1 / 0 0 25% .5 / 100 0 0 .5}}tui-segmented>a:active,tui-segmented>button:active,tui-segmented>label:active,tui-segmented>label>input:not([tuiRadio]):active,tui-segmented>a:active+*,tui-segmented>button:active+*,tui-segmented>label:active+*,tui-segmented>label>input:not([tuiRadio]):active+*,tui-segmented>a.tui-segmented_active,tui-segmented>button.tui-segmented_active,tui-segmented>label.tui-segmented_active,tui-segmented>label>input:not([tuiRadio]).tui-segmented_active,tui-segmented>a.tui-segmented_active+*,tui-segmented>button.tui-segmented_active+*,tui-segmented>label.tui-segmented_active+*,tui-segmented>label>input:not([tuiRadio]).tui-segmented_active+*{border-image:linear-gradient(var(--tui-border-normal),transparent) 1 / 0 0 25% .5 / 100 0 0 .5}tui-segmented>label>input:not([tuiRadio]){position:absolute;inset:-.125rem;background:transparent!important}tui-segmented:before{transition-property:top,left,width;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;content:\"\";position:absolute;left:var(--t-left);top:var(--t-top);block-size:var(--t-height);inline-size:var(--t-width);border-radius:inherit;background:currentColor;background-clip:padding-box;border:.125rem solid transparent;box-sizing:border-box;filter:drop-shadow(0 .25rem 1.25rem rgba(0,0,0,.1))}[tuiTheme=dark] tui-segmented,tui-segmented[tuiTheme=dark]{--tui-background-base: var(--tui-background-neutral-1-hover)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
111
90
  }
112
91
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiSegmented, decorators: [{
113
92
  type: Component,
114
- args: [{ standalone: true, selector: 'tui-segmented', template: '<ng-content />', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [ResizeObserverService, tuiBadgeNotificationOptionsProvider({ size: 's' })], hostDirectives: [TuiSegmentedDirective], host: {
115
- '[attr.data-size]': 'size',
116
- }, styles: ["tui-segmented{position:relative;display:flex;color:var(--tui-background-base);background:var(--tui-background-neutral-1);overflow:hidden;-webkit-mask-image:linear-gradient(#000,#000);mask-image:linear-gradient(#000,#000)}tui-segmented[data-size=s]{--t-padding: .5rem;--t-gap: .5rem;--t-margin: -.125rem;--t-height: var(--tui-height-s);font:var(--tui-font-text-s);border-radius:var(--tui-radius-m)}tui-segmented[data-size=s] tui-icon{font-size:1rem}tui-segmented[data-size=m]{--t-padding: .875rem;--t-gap: 1rem;--t-margin: -.375rem;--t-height: var(--tui-height-m);font:var(--tui-font-text-m);border-radius:var(--tui-radius-m)}tui-segmented[data-size=l]{--t-padding: 1.25rem;--t-gap: 1rem;--t-margin: -.375rem;--t-height: var(--tui-height-l);font:var(--tui-font-text-l);border-radius:var(--tui-radius-l)}tui-segmented[data-size=l]>*:before{block-size:1.25rem}tui-segmented>a,tui-segmented>button,tui-segmented>label,tui-segmented>label>input:not([tuiRadio]){transition-property:color,background,opacity,border-image;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;-webkit-appearance:none;appearance:none;padding:0;border:0;background:none;line-height:inherit;text-decoration:none;position:relative;display:flex;align-items:center;justify-content:center;block-size:var(--t-height);white-space:nowrap;gap:var(--t-gap);margin:0;padding:0 var(--t-padding);color:var(--tui-text-primary);overflow:hidden;cursor:pointer;font:inherit;border-radius:inherit;border:.125rem solid transparent;background-clip:padding-box;box-sizing:border-box;border-image:linear-gradient(var(--tui-border-normal),transparent) 1 / 0 0 25% .5 / 0 0 100 .5;clip-path:polygon(-1rem calc(50% - .5rem),1px calc(50% - .5rem),1px 0,100% 0,100% 100%,1px 100%,1px calc(50% + .5rem),-1rem calc(50% + .5rem))}tui-segmented>a>*,tui-segmented>button>*,tui-segmented>label>*,tui-segmented>label>input:not([tuiRadio])>*{margin:0 var(--t-margin)}tui-segmented>a:focus-visible,tui-segmented>button:focus-visible,tui-segmented>label:focus-visible,tui-segmented>label>input:not([tuiRadio]):focus-visible{outline:.125rem solid var(--tui-border-focus);outline-offset:-.25rem}@media (hover: hover) and (pointer: fine){tui-segmented>a:not(.tui-segmented_active):not(:active):hover,tui-segmented>button:not(.tui-segmented_active):not(:active):hover,tui-segmented>label:not(.tui-segmented_active):not(:active):hover,tui-segmented>label>input:not([tuiRadio]):not(.tui-segmented_active):not(:active):hover{background-color:var(--tui-background-neutral-1-hover)}tui-segmented>a:not(.tui-segmented_active):not(:active):hover,tui-segmented>button:not(.tui-segmented_active):not(:active):hover,tui-segmented>label:not(.tui-segmented_active):not(:active):hover,tui-segmented>label>input:not([tuiRadio]):not(.tui-segmented_active):not(:active):hover,tui-segmented>a:not(.tui-segmented_active):not(:active):hover+*,tui-segmented>button:not(.tui-segmented_active):not(:active):hover+*,tui-segmented>label:not(.tui-segmented_active):not(:active):hover+*,tui-segmented>label>input:not([tuiRadio]):not(.tui-segmented_active):not(:active):hover+*{border-image:linear-gradient(var(--tui-border-normal),transparent) 1 / 0 0 25% .5 / 100 0 0 .5}}tui-segmented>a:active,tui-segmented>button:active,tui-segmented>label:active,tui-segmented>label>input:not([tuiRadio]):active,tui-segmented>a:active+*,tui-segmented>button:active+*,tui-segmented>label:active+*,tui-segmented>label>input:not([tuiRadio]):active+*,tui-segmented>a.tui-segmented_active,tui-segmented>button.tui-segmented_active,tui-segmented>label.tui-segmented_active,tui-segmented>label>input:not([tuiRadio]).tui-segmented_active,tui-segmented>a.tui-segmented_active+*,tui-segmented>button.tui-segmented_active+*,tui-segmented>label.tui-segmented_active+*,tui-segmented>label>input:not([tuiRadio]).tui-segmented_active+*{border-image:linear-gradient(var(--tui-border-normal),transparent) 1 / 0 0 25% .5 / 100 0 0 .5}tui-segmented>label>input:not([tuiRadio]){position:absolute;top:-.125rem;left:-.125rem;right:-.125rem;bottom:-.125rem;background:transparent!important}tui-segmented:before{transition-property:top,left,width;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;content:\"\";position:absolute;left:var(--t-left);top:var(--t-top);block-size:var(--t-height);inline-size:var(--t-width);border-radius:inherit;background:currentColor;background-clip:padding-box;border:.125rem solid transparent;box-sizing:border-box;filter:drop-shadow(0 .25rem 1.25rem rgba(0,0,0,.1))}[tuiTheme=dark] tui-segmented,tui-segmented[tuiTheme=dark]{--tui-background-base: var(--tui-background-neutral-1-hover)}\n"] }]
117
- }], propDecorators: { size: [{
118
- type: Input
119
- }], activeItemIndex: [{
120
- type: Input
121
- }], activeItemIndexChange: [{
122
- type: Output
123
- }] } });
93
+ args: [{ selector: 'tui-segmented', template: '<ng-content />', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [ResizeObserverService, tuiBadgeNotificationOptionsProvider({ size: 's' })], hostDirectives: [TuiSegmentedDirective], host: {
94
+ '[attr.data-size]': 'size()',
95
+ }, styles: ["tui-segmented{position:relative;display:flex;color:var(--tui-background-base);background:var(--tui-background-neutral-1);overflow:hidden;-webkit-mask-image:linear-gradient(#000,#000);mask-image:linear-gradient(#000,#000)}tui-segmented[data-size=s]{--t-padding: .5rem;--t-gap: .5rem;--t-margin: -.125rem;--t-height: var(--tui-height-s);font:var(--tui-font-text-s);border-radius:var(--tui-radius-m)}tui-segmented[data-size=s] tui-icon{font-size:1rem}tui-segmented[data-size=m]{--t-padding: .875rem;--t-gap: 1rem;--t-margin: -.375rem;--t-height: var(--tui-height-m);font:var(--tui-font-text-m);border-radius:var(--tui-radius-m)}tui-segmented[data-size=l]{--t-padding: 1.25rem;--t-gap: 1rem;--t-margin: -.375rem;--t-height: var(--tui-height-l);font:var(--tui-font-text-l);border-radius:var(--tui-radius-l)}tui-segmented[data-size=l]>*:before{block-size:1.25rem}tui-segmented>a,tui-segmented>button,tui-segmented>label,tui-segmented>label>input:not([tuiRadio]){transition-property:color,background,opacity,border-image;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;-webkit-appearance:none;appearance:none;padding:0;border:0;background:none;line-height:inherit;text-decoration:none;position:relative;display:flex;align-items:center;justify-content:center;block-size:var(--t-height);white-space:nowrap;gap:var(--t-gap);margin:0;padding:0 var(--t-padding);color:var(--tui-text-primary);overflow:hidden;cursor:pointer;font:inherit;border-radius:inherit;border:.125rem solid transparent;background-clip:padding-box;box-sizing:border-box;border-image:linear-gradient(var(--tui-border-normal),transparent) 1 / 0 0 25% .5 / 0 0 100 .5;clip-path:polygon(-1rem calc(50% - .5rem),1px calc(50% - .5rem),1px 0,100% 0,100% 100%,1px 100%,1px calc(50% + .5rem),-1rem calc(50% + .5rem))}tui-segmented>a>*,tui-segmented>button>*,tui-segmented>label>*,tui-segmented>label>input:not([tuiRadio])>*{margin:0 var(--t-margin)}tui-segmented>a:focus-visible,tui-segmented>button:focus-visible,tui-segmented>label:focus-visible,tui-segmented>label>input:not([tuiRadio]):focus-visible{outline:.125rem solid var(--tui-border-focus);outline-offset:-.25rem}@media (hover: hover) and (pointer: fine){tui-segmented>a:not(.tui-segmented_active):not(:active):hover,tui-segmented>button:not(.tui-segmented_active):not(:active):hover,tui-segmented>label:not(.tui-segmented_active):not(:active):hover,tui-segmented>label>input:not([tuiRadio]):not(.tui-segmented_active):not(:active):hover{background-color:var(--tui-background-neutral-1-hover)}tui-segmented>a:not(.tui-segmented_active):not(:active):hover,tui-segmented>button:not(.tui-segmented_active):not(:active):hover,tui-segmented>label:not(.tui-segmented_active):not(:active):hover,tui-segmented>label>input:not([tuiRadio]):not(.tui-segmented_active):not(:active):hover,tui-segmented>a:not(.tui-segmented_active):not(:active):hover+*,tui-segmented>button:not(.tui-segmented_active):not(:active):hover+*,tui-segmented>label:not(.tui-segmented_active):not(:active):hover+*,tui-segmented>label>input:not([tuiRadio]):not(.tui-segmented_active):not(:active):hover+*{border-image:linear-gradient(var(--tui-border-normal),transparent) 1 / 0 0 25% .5 / 100 0 0 .5}}tui-segmented>a:active,tui-segmented>button:active,tui-segmented>label:active,tui-segmented>label>input:not([tuiRadio]):active,tui-segmented>a:active+*,tui-segmented>button:active+*,tui-segmented>label:active+*,tui-segmented>label>input:not([tuiRadio]):active+*,tui-segmented>a.tui-segmented_active,tui-segmented>button.tui-segmented_active,tui-segmented>label.tui-segmented_active,tui-segmented>label>input:not([tuiRadio]).tui-segmented_active,tui-segmented>a.tui-segmented_active+*,tui-segmented>button.tui-segmented_active+*,tui-segmented>label.tui-segmented_active+*,tui-segmented>label>input:not([tuiRadio]).tui-segmented_active+*{border-image:linear-gradient(var(--tui-border-normal),transparent) 1 / 0 0 25% .5 / 100 0 0 .5}tui-segmented>label>input:not([tuiRadio]){position:absolute;inset:-.125rem;background:transparent!important}tui-segmented:before{transition-property:top,left,width;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;content:\"\";position:absolute;left:var(--t-left);top:var(--t-top);block-size:var(--t-height);inline-size:var(--t-width);border-radius:inherit;background:currentColor;background-clip:padding-box;border:.125rem solid transparent;box-sizing:border-box;filter:drop-shadow(0 .25rem 1.25rem rgba(0,0,0,.1))}[tuiTheme=dark] tui-segmented,tui-segmented[tuiTheme=dark]{--tui-background-base: var(--tui-background-neutral-1-hover)}\n"] }]
96
+ }] });
124
97
 
125
98
  /**
126
99
  * Generated bundle index. Do not edit.
@@ -1 +1 @@
1
- {"version":3,"file":"taiga-ui-kit-components-segmented.mjs","sources":["../../../projects/kit/components/segmented/segmented.directive.ts","../../../projects/kit/components/segmented/segmented.component.ts","../../../projects/kit/components/segmented/taiga-ui-kit-components-segmented.ts"],"sourcesContent":["import {\n type AfterContentChecked,\n type AfterContentInit,\n ContentChildren,\n Directive,\n ElementRef,\n inject,\n type QueryList,\n} from '@angular/core';\nimport {NgControl, RadioControlValueAccessor} from '@angular/forms';\nimport {RouterLinkActive} from '@angular/router';\nimport {EMPTY_QUERY} from '@taiga-ui/cdk/constants';\nimport {tuiControlValue, tuiQueryListChanges} from '@taiga-ui/cdk/observables';\nimport {tuiInjectElement} from '@taiga-ui/cdk/utils/dom';\nimport {map, switchMap} from 'rxjs';\n\nimport {TuiSegmented} from './segmented.component';\n\n@Directive({\n standalone: true,\n host: {\n '(click)': 'update($event.target)',\n },\n})\nexport class TuiSegmentedDirective implements AfterContentChecked, AfterContentInit {\n @ContentChildren(NgControl, {descendants: true})\n private readonly controls: QueryList<NgControl> = EMPTY_QUERY;\n\n @ContentChildren(RadioControlValueAccessor, {descendants: true})\n private readonly radios: QueryList<RadioControlValueAccessor> = EMPTY_QUERY;\n\n @ContentChildren(RouterLinkActive)\n private readonly links: QueryList<RouterLinkActive> = EMPTY_QUERY;\n\n @ContentChildren(RouterLinkActive, {read: ElementRef})\n private readonly elements: QueryList<ElementRef<HTMLElement>> = EMPTY_QUERY;\n\n private readonly component = inject(TuiSegmented);\n private readonly el = tuiInjectElement();\n\n public ngAfterContentInit(): void {\n tuiQueryListChanges(this.controls)\n .pipe(\n switchMap(() => tuiControlValue(this.controls.first)),\n map((value) => this.radios.toArray().findIndex((c) => c.value === value)),\n )\n .subscribe((index) => {\n this.component.update(index);\n });\n }\n\n public ngAfterContentChecked(): void {\n if (this.links.length) {\n this.update(this.elements.get(this.linkIndex)?.nativeElement || null);\n }\n }\n\n protected update(target: Element | null): void {\n this.component.update(this.getIndex(target));\n }\n\n private get linkIndex(): number {\n return this.links.toArray().findIndex((link) => link.isActive);\n }\n\n private getIndex(element: Element | null): number {\n return Array.from(this.el.children).findIndex((tab) => tab.contains(element));\n }\n}\n","import {\n ChangeDetectionStrategy,\n Component,\n EventEmitter,\n inject,\n Input,\n type OnChanges,\n Output,\n ViewEncapsulation,\n} from '@angular/core';\nimport {takeUntilDestroyed} from '@angular/core/rxjs-interop';\nimport {ResizeObserverService} from '@ng-web-apis/resize-observer';\nimport {tuiZonefree} from '@taiga-ui/cdk/observables';\nimport {tuiCreateOptions} from '@taiga-ui/cdk/utils/di';\nimport {tuiInjectElement, tuiIsHTMLElement} from '@taiga-ui/cdk/utils/dom';\nimport {tuiPx} from '@taiga-ui/cdk/utils/miscellaneous';\nimport {type TuiSizeL, type TuiSizeS} from '@taiga-ui/core/types';\nimport {tuiBadgeNotificationOptionsProvider} from '@taiga-ui/kit/components/badge-notification';\n\nimport {TuiSegmentedDirective} from './segmented.directive';\n\nexport const [TUI_SEGMENTED_OPTIONS, tuiSegmentedOptionsProvider] = tuiCreateOptions({\n size: 's' as TuiSizeL | TuiSizeS,\n});\n\n@Component({\n standalone: true,\n selector: 'tui-segmented',\n template: '<ng-content />',\n styleUrl: './segmented.style.less',\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n providers: [ResizeObserverService, tuiBadgeNotificationOptionsProvider({size: 's'})],\n hostDirectives: [TuiSegmentedDirective],\n host: {\n '[attr.data-size]': 'size',\n },\n})\nexport class TuiSegmented implements OnChanges {\n private readonly el = tuiInjectElement();\n\n protected readonly sub = inject(ResizeObserverService, {self: true})\n .pipe(tuiZonefree(), takeUntilDestroyed())\n .subscribe(() => this.refresh());\n\n @Input()\n public size: TuiSizeL | TuiSizeS = inject(TUI_SEGMENTED_OPTIONS).size;\n\n @Input()\n public activeItemIndex = 0;\n\n @Output()\n public readonly activeItemIndexChange = new EventEmitter<number>();\n\n public ngOnChanges(): void {\n this.refresh();\n }\n\n public update(activeItemIndex: number): void {\n if (activeItemIndex === this.activeItemIndex || activeItemIndex < 0) {\n return;\n }\n\n this.activeItemIndex = activeItemIndex;\n this.activeItemIndexChange.emit(activeItemIndex);\n this.refresh();\n }\n\n private get activeElement(): Element | null {\n return this.el.children.item(this.activeItemIndex);\n }\n\n private refresh(): void {\n const el = this.activeElement;\n\n if (!tuiIsHTMLElement(el)) {\n return;\n }\n\n Array.from(this.el.children).forEach((e) =>\n e.classList.remove('tui-segmented_active'),\n );\n\n el.classList.add('tui-segmented_active');\n\n const {offsetWidth = 0, offsetLeft = 0, offsetTop = 0} = el;\n\n this.el.style.setProperty('--t-top', tuiPx(offsetTop));\n this.el.style.setProperty('--t-left', tuiPx(offsetLeft));\n this.el.style.setProperty('--t-width', tuiPx(offsetWidth));\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"taiga-ui-kit-components-segmented.mjs","sources":["../../../projects/kit/components/segmented/segmented.directive.ts","../../../projects/kit/components/segmented/segmented.component.ts","../../../projects/kit/components/segmented/taiga-ui-kit-components-segmented.ts"],"sourcesContent":["import {\n type AfterContentChecked,\n type AfterContentInit,\n contentChildren,\n Directive,\n ElementRef,\n inject,\n} from '@angular/core';\nimport {toObservable} from '@angular/core/rxjs-interop';\nimport {NgControl, RadioControlValueAccessor} from '@angular/forms';\nimport {RouterLinkActive} from '@angular/router';\nimport {tuiControlValue} from '@taiga-ui/cdk/observables';\nimport {tuiInjectElement} from '@taiga-ui/cdk/utils/dom';\nimport {map, switchMap} from 'rxjs';\n\nimport {TuiSegmented} from './segmented.component';\n\n@Directive({\n host: {\n '(click)': 'update($event.target)',\n },\n})\nexport class TuiSegmentedDirective implements AfterContentChecked, AfterContentInit {\n private readonly component = inject(TuiSegmented);\n private readonly el = tuiInjectElement();\n private readonly links = contentChildren(RouterLinkActive);\n private readonly elements = contentChildren(RouterLinkActive, {read: ElementRef});\n private readonly controls = contentChildren(NgControl, {descendants: true});\n private readonly controls$ = toObservable(this.controls);\n private readonly radios = contentChildren(RadioControlValueAccessor, {\n descendants: true,\n });\n\n public ngAfterContentInit(): void {\n this.controls$\n .pipe(\n switchMap(([control]) => tuiControlValue(control)),\n map((value) => this.radios().findIndex((c) => c.value === value)),\n )\n .subscribe((index) => {\n this.component.update(index);\n });\n }\n\n public ngAfterContentChecked(): void {\n const index = this.links().findIndex(({isActive}) => isActive);\n\n if (index !== -1) {\n this.update(this.elements()[index]?.nativeElement || null);\n }\n }\n\n protected update(target: Element | null): void {\n this.component.update(\n Array.from(this.el.children).findIndex((tab) => tab.contains(target)),\n );\n }\n}\n","import {\n ChangeDetectionStrategy,\n Component,\n inject,\n input,\n model,\n type OnChanges,\n ViewEncapsulation,\n} from '@angular/core';\nimport {takeUntilDestroyed} from '@angular/core/rxjs-interop';\nimport {ResizeObserverService} from '@ng-web-apis/resize-observer';\nimport {tuiZonefree} from '@taiga-ui/cdk/observables';\nimport {tuiCreateOptions} from '@taiga-ui/cdk/utils/di';\nimport {tuiInjectElement, tuiIsHTMLElement} from '@taiga-ui/cdk/utils/dom';\nimport {tuiPx} from '@taiga-ui/cdk/utils/miscellaneous';\nimport {type TuiSizeL, type TuiSizeS} from '@taiga-ui/core/types';\nimport {tuiBadgeNotificationOptionsProvider} from '@taiga-ui/kit/components/badge-notification';\n\nimport {TuiSegmentedDirective} from './segmented.directive';\n\nexport const [TUI_SEGMENTED_OPTIONS, tuiSegmentedOptionsProvider] = tuiCreateOptions({\n size: 's' as TuiSizeL | TuiSizeS,\n});\n\n@Component({\n selector: 'tui-segmented',\n template: '<ng-content />',\n styleUrl: './segmented.style.less',\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n providers: [ResizeObserverService, tuiBadgeNotificationOptionsProvider({size: 's'})],\n hostDirectives: [TuiSegmentedDirective],\n host: {\n '[attr.data-size]': 'size()',\n },\n})\nexport class TuiSegmented implements OnChanges {\n private readonly el = tuiInjectElement();\n\n protected readonly sub = inject(ResizeObserverService, {self: true})\n .pipe(tuiZonefree(), takeUntilDestroyed())\n .subscribe(() => this.refresh());\n\n public readonly size = input(inject(TUI_SEGMENTED_OPTIONS).size);\n public readonly activeItemIndex = model(0);\n\n public ngOnChanges(): void {\n this.refresh();\n }\n\n public update(activeItemIndex: number): void {\n if (activeItemIndex === this.activeItemIndex() || activeItemIndex < 0) {\n return;\n }\n\n this.activeItemIndex.set(activeItemIndex);\n this.refresh();\n }\n\n private refresh(): void {\n const el = this.el.children.item(this.activeItemIndex());\n\n if (!tuiIsHTMLElement(el)) {\n return;\n }\n\n Array.from(this.el.children).forEach((e) =>\n e.classList.remove('tui-segmented_active'),\n );\n\n el.classList.add('tui-segmented_active');\n\n const {offsetWidth = 0, offsetLeft = 0, offsetTop = 0} = el;\n\n this.el.style.setProperty('--t-top', tuiPx(offsetTop));\n this.el.style.setProperty('--t-left', tuiPx(offsetLeft));\n this.el.style.setProperty('--t-width', tuiPx(offsetWidth));\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
@@ -1,14 +1,15 @@
1
1
  import { NgTemplateOutlet } from '@angular/common';
2
2
  import * as i0 from '@angular/core';
3
- import { inject, signal, computed, effect, Input, ChangeDetectionStrategy, Component, Directive } from '@angular/core';
3
+ import { inject, computed, effect, input, ChangeDetectionStrategy, Component, Directive } from '@angular/core';
4
4
  import { TuiControl, tuiAsControl } from '@taiga-ui/cdk/classes';
5
- import { tuiIsPresent, tuiDirectiveBinding } from '@taiga-ui/cdk/utils/miscellaneous';
5
+ import { tuiIsPresent } from '@taiga-ui/cdk/utils/miscellaneous';
6
6
  import * as i1 from '@taiga-ui/core/components/textfield';
7
7
  import { TuiTextfieldDirective, tuiAsTextfieldAccessor, TuiWithTextfield, TuiSelectLike } from '@taiga-ui/core/components/textfield';
8
8
  import { TUI_ITEMS_HANDLERS } from '@taiga-ui/core/directives/items-handlers';
9
9
  import { tuiIsFlat, tuiInjectValue } from '@taiga-ui/kit/utils';
10
10
  import { TuiDataListComponent, TuiOptionWithValue, tuiAsOptionContent } from '@taiga-ui/core/components/data-list';
11
- import { tuiDropdownOpen, tuiDropdownEnabled } from '@taiga-ui/core/directives/dropdown';
11
+ import { TuiDropdownOpen, tuiDropdownEnabled } from '@taiga-ui/core/directives/dropdown';
12
+ import { tuiDirectiveBinding } from '@taiga-ui/cdk/utils/di';
12
13
  import * as i1$1 from '@taiga-ui/core/components/scrollbar';
13
14
  import { TuiScrollIntoView } from '@taiga-ui/core/components/scrollbar';
14
15
  import { TuiCheckbox, tuiCheckboxOptionsProvider } from '@taiga-ui/kit/components/checkbox';
@@ -18,7 +19,6 @@ class TuiNativeSelect extends TuiControl {
18
19
  super(...arguments);
19
20
  this.textfield = inject(TuiTextfieldDirective);
20
21
  this.isFlat = tuiIsFlat;
21
- this.placeholder = signal('');
22
22
  this.itemsHandlers = inject(TUI_ITEMS_HANDLERS);
23
23
  this.stringified = computed((value = this.value()) => tuiIsPresent(value) ? this.itemsHandlers.stringify()(value) : '');
24
24
  this.showPlaceholder = computed(() => this.placeholder() && !this.stringified());
@@ -26,22 +26,19 @@ class TuiNativeSelect extends TuiControl {
26
26
  this.valueEffect = effect(() => {
27
27
  this.textfield.value.set(this.stringified());
28
28
  });
29
- this.items = [];
30
- this.labels = [];
31
- }
32
- // TODO(v5): use signal inputs
33
- set placeholderSetter(x) {
34
- this.placeholder.set(x);
29
+ this.items = input([]);
30
+ this.labels = input([]);
31
+ this.placeholder = input('');
35
32
  }
36
33
  setValue(value) {
37
34
  this.onChange(value);
38
35
  }
39
36
  selectOption(index) {
40
- const items = (this.items?.flat() ?? []);
37
+ const items = (this.items()?.flat() ?? []);
41
38
  this.onChange(items[index - (this.showPlaceholder() ? 1 : 0)] ?? null);
42
39
  }
43
40
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiNativeSelect, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
44
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: TuiNativeSelect, isStandalone: true, selector: "select[tuiSelect]", inputs: { items: "items", labels: "labels", placeholderSetter: ["placeholder", "placeholderSetter"] }, host: { listeners: { "change": "selectOption($event.target.options.selectedIndex)" }, properties: { "attr.aria-invalid": "invalid()", "disabled": "!interactive()" } }, providers: [tuiAsTextfieldAccessor(TuiNativeSelect), tuiAsControl(TuiNativeSelect)], usesInheritance: true, hostDirectives: [{ directive: i1.TuiWithTextfield }], ngImport: i0, template: "@if (showPlaceholder()) {\n <option\n disabled\n selected\n value=\"\"\n >\n {{ placeholder() }}\n </option>\n}\n\n@if (items && !isFlat(items)) {\n @for (group of labels; track group) {\n <optgroup [label]=\"labels[$index]\">\n <ng-container *ngTemplateOutlet=\"options; context: {$implicit: items[$index]}\" />\n </optgroup>\n }\n} @else {\n <ng-container *ngTemplateOutlet=\"options; context: {$implicit: items}\" />\n}\n\n<ng-template\n #options\n let-items\n>\n @for (option of items; track option) {\n <option\n [disabled]=\"itemsHandlers.disabledItemHandler()(option)\"\n [selected]=\"isSelected()(option)\"\n [value]=\"itemsHandlers.stringify()(option)\"\n >\n {{ itemsHandlers.stringify()(option) }}\n </option>\n }\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
41
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: TuiNativeSelect, isStandalone: true, selector: "select[tuiSelect]", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, labels: { classPropertyName: "labels", publicName: "labels", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "change": "selectOption($event.target.options.selectedIndex)" }, properties: { "attr.aria-invalid": "invalid()", "disabled": "!interactive()" } }, providers: [tuiAsTextfieldAccessor(TuiNativeSelect), tuiAsControl(TuiNativeSelect)], usesInheritance: true, hostDirectives: [{ directive: i1.TuiWithTextfield }], ngImport: i0, template: "@if (showPlaceholder()) {\n <option\n disabled\n selected\n value=\"\"\n >\n {{ placeholder() }}\n </option>\n}\n@let elements = items();\n\n@if (elements && !isFlat(elements)) {\n @for (group of labels(); track group) {\n <optgroup [label]=\"labels()[$index]\">\n <ng-container *ngTemplateOutlet=\"options; context: {$implicit: elements[$index]}\" />\n </optgroup>\n }\n} @else {\n <ng-container *ngTemplateOutlet=\"options; context: {$implicit: elements}\" />\n}\n\n<ng-template\n #options\n let-items\n>\n @for (option of items; track option) {\n <option\n [disabled]=\"itemsHandlers.disabledItemHandler()(option)\"\n [selected]=\"isSelected()(option)\"\n [value]=\"itemsHandlers.stringify()(option)\"\n >\n {{ itemsHandlers.stringify()(option) }}\n </option>\n }\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
45
42
  }
46
43
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiNativeSelect, decorators: [{
47
44
  type: Component,
@@ -49,15 +46,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
49
46
  '[attr.aria-invalid]': 'invalid()',
50
47
  '[disabled]': '!interactive()',
51
48
  '(change)': 'selectOption($event.target.options.selectedIndex)',
52
- }, template: "@if (showPlaceholder()) {\n <option\n disabled\n selected\n value=\"\"\n >\n {{ placeholder() }}\n </option>\n}\n\n@if (items && !isFlat(items)) {\n @for (group of labels; track group) {\n <optgroup [label]=\"labels[$index]\">\n <ng-container *ngTemplateOutlet=\"options; context: {$implicit: items[$index]}\" />\n </optgroup>\n }\n} @else {\n <ng-container *ngTemplateOutlet=\"options; context: {$implicit: items}\" />\n}\n\n<ng-template\n #options\n let-items\n>\n @for (option of items; track option) {\n <option\n [disabled]=\"itemsHandlers.disabledItemHandler()(option)\"\n [selected]=\"isSelected()(option)\"\n [value]=\"itemsHandlers.stringify()(option)\"\n >\n {{ itemsHandlers.stringify()(option) }}\n </option>\n }\n</ng-template>\n" }]
53
- }], propDecorators: { items: [{
54
- type: Input
55
- }], labels: [{
56
- type: Input
57
- }], placeholderSetter: [{
58
- type: Input,
59
- args: ['placeholder']
60
- }] } });
49
+ }, template: "@if (showPlaceholder()) {\n <option\n disabled\n selected\n value=\"\"\n >\n {{ placeholder() }}\n </option>\n}\n@let elements = items();\n\n@if (elements && !isFlat(elements)) {\n @for (group of labels(); track group) {\n <optgroup [label]=\"labels()[$index]\">\n <ng-container *ngTemplateOutlet=\"options; context: {$implicit: elements[$index]}\" />\n </optgroup>\n }\n} @else {\n <ng-container *ngTemplateOutlet=\"options; context: {$implicit: elements}\" />\n}\n\n<ng-template\n #options\n let-items\n>\n @for (option of items; track option) {\n <option\n [disabled]=\"itemsHandlers.disabledItemHandler()(option)\"\n [selected]=\"isSelected()(option)\"\n [value]=\"itemsHandlers.stringify()(option)\"\n >\n {{ itemsHandlers.stringify()(option) }}\n </option>\n }\n</ng-template>\n" }]
50
+ }] });
61
51
 
62
52
  class TuiSelectOption {
63
53
  constructor() {
@@ -80,7 +70,7 @@ class TuiSelectOption {
80
70
  type="checkbox"
81
71
  class="t-check"
82
72
  [checked]="selected()"
83
- [size]="datalist.size === 'l' ? 'm' : 's'"
73
+ [size]="datalist.size() === 'l' ? 'm' : 's'"
84
74
  />
85
75
  } @else {
86
76
  <span class="t-dummy"></span>
@@ -96,7 +86,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
96
86
  type="checkbox"
97
87
  class="t-check"
98
88
  [checked]="selected()"
99
- [size]="datalist.size === 'l' ? 'm' : 's'"
89
+ [size]="datalist.size() === 'l' ? 'm' : 's'"
100
90
  />
101
91
  } @else {
102
92
  <span class="t-dummy"></span>
@@ -112,7 +102,7 @@ class TuiSelectDirective extends TuiControl {
112
102
  constructor() {
113
103
  super(...arguments);
114
104
  this.textfield = inject(TuiTextfieldDirective);
115
- this.open = tuiDropdownOpen();
105
+ this.open = inject(TuiDropdownOpen).open;
116
106
  this.itemsHandlers = inject(TUI_ITEMS_HANDLERS);
117
107
  this.dropdownEnabled = tuiDropdownEnabled(this.interactive);
118
108
  this.valueEffect = effect(() => {
@@ -137,7 +127,6 @@ class TuiSelectDirective extends TuiControl {
137
127
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiSelectDirective, decorators: [{
138
128
  type: Directive,
139
129
  args: [{
140
- standalone: true,
141
130
  selector: 'input[tuiSelect]',
142
131
  providers: [
143
132
  tuiAsOptionContent(TuiSelectOption),
@@ -1 +1 @@
1
- {"version":3,"file":"taiga-ui-kit-components-select.mjs","sources":["../../../projects/kit/components/select/native-select/native-select.component.ts","../../../projects/kit/components/select/native-select/native-select.template.html","../../../projects/kit/components/select/select-option/select-option.component.ts","../../../projects/kit/components/select/select.directive.ts","../../../projects/kit/components/select/select.ts","../../../projects/kit/components/select/taiga-ui-kit-components-select.ts"],"sourcesContent":["import {NgTemplateOutlet} from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n computed,\n effect,\n inject,\n Input,\n signal,\n} from '@angular/core';\nimport {tuiAsControl, TuiControl} from '@taiga-ui/cdk/classes';\nimport {tuiIsPresent} from '@taiga-ui/cdk/utils/miscellaneous';\nimport {\n tuiAsTextfieldAccessor,\n type TuiTextfieldAccessor,\n TuiTextfieldDirective,\n TuiWithTextfield,\n} from '@taiga-ui/core/components/textfield';\nimport {\n TUI_ITEMS_HANDLERS,\n type TuiItemsHandlers,\n} from '@taiga-ui/core/directives/items-handlers';\nimport {tuiIsFlat} from '@taiga-ui/kit/utils';\n\n@Component({\n selector: 'select[tuiSelect]',\n imports: [NgTemplateOutlet],\n templateUrl: './native-select.template.html',\n changeDetection: ChangeDetectionStrategy.OnPush,\n providers: [tuiAsTextfieldAccessor(TuiNativeSelect), tuiAsControl(TuiNativeSelect)],\n hostDirectives: [TuiWithTextfield],\n host: {\n '[attr.aria-invalid]': 'invalid()',\n '[disabled]': '!interactive()',\n '(change)': 'selectOption($event.target.options.selectedIndex)',\n },\n})\nexport class TuiNativeSelect<T>\n extends TuiControl<T | null>\n implements TuiTextfieldAccessor<T>\n{\n private readonly textfield = inject(TuiTextfieldDirective);\n\n protected readonly isFlat = tuiIsFlat;\n protected readonly placeholder = signal('');\n protected readonly itemsHandlers: TuiItemsHandlers<T> = inject(TUI_ITEMS_HANDLERS);\n\n protected readonly stringified = computed((value = this.value()) =>\n tuiIsPresent(value) ? this.itemsHandlers.stringify()(value) : '',\n );\n\n protected readonly showPlaceholder = computed(\n () => this.placeholder() && !this.stringified(),\n );\n\n protected readonly isSelected = computed(\n (value = this.value()) =>\n (x: T) =>\n tuiIsPresent(value) && this.itemsHandlers.identityMatcher()(x, value),\n );\n\n protected readonly valueEffect = effect(() => {\n this.textfield.value.set(this.stringified());\n });\n\n @Input()\n public items: ReadonlyArray<readonly T[]> | readonly T[] | null = [];\n\n @Input()\n public labels: readonly string[] = [];\n\n // TODO(v5): use signal inputs\n @Input('placeholder')\n public set placeholderSetter(x: string) {\n this.placeholder.set(x);\n }\n\n public setValue(value: T | null): void {\n this.onChange(value);\n }\n\n protected selectOption(index: number): void {\n const items = (this.items?.flat() ?? []) as T[];\n\n this.onChange(items[index - (this.showPlaceholder() ? 1 : 0)] ?? null);\n }\n}\n","@if (showPlaceholder()) {\n <option\n disabled\n selected\n value=\"\"\n >\n {{ placeholder() }}\n </option>\n}\n\n@if (items && !isFlat(items)) {\n @for (group of labels; track group) {\n <optgroup [label]=\"labels[$index]\">\n <ng-container *ngTemplateOutlet=\"options; context: {$implicit: items[$index]}\" />\n </optgroup>\n }\n} @else {\n <ng-container *ngTemplateOutlet=\"options; context: {$implicit: items}\" />\n}\n\n<ng-template\n #options\n let-items\n>\n @for (option of items; track option) {\n <option\n [disabled]=\"itemsHandlers.disabledItemHandler()(option)\"\n [selected]=\"isSelected()(option)\"\n [value]=\"itemsHandlers.stringify()(option)\"\n >\n {{ itemsHandlers.stringify()(option) }}\n </option>\n }\n</ng-template>\n","import {ChangeDetectionStrategy, Component, computed, inject} from '@angular/core';\nimport {tuiDirectiveBinding, tuiIsPresent} from '@taiga-ui/cdk/utils/miscellaneous';\nimport {\n TuiDataListComponent,\n TuiOptionWithValue,\n} from '@taiga-ui/core/components/data-list';\nimport {TuiScrollIntoView} from '@taiga-ui/core/components/scrollbar';\nimport {\n TUI_ITEMS_HANDLERS,\n type TuiItemsHandlers,\n} from '@taiga-ui/core/directives/items-handlers';\nimport {TuiCheckbox, tuiCheckboxOptionsProvider} from '@taiga-ui/kit/components/checkbox';\nimport {tuiInjectValue} from '@taiga-ui/kit/utils';\n\n@Component({\n imports: [TuiCheckbox],\n template: `\n @if (selected()) {\n <input\n tuiCheckbox\n type=\"checkbox\"\n class=\"t-check\"\n [checked]=\"selected()\"\n [size]=\"datalist.size === 'l' ? 'm' : 's'\"\n />\n } @else {\n <span class=\"t-dummy\"></span>\n }\n `,\n styleUrl: './select-option.style.less',\n changeDetection: ChangeDetectionStrategy.OnPush,\n providers: [tuiCheckboxOptionsProvider({appearance: () => 'action'})],\n hostDirectives: [TuiScrollIntoView],\n host: {\n tuiSelectOption: '',\n '[class._value]': 'option',\n '[class._selected]': 'selected()',\n },\n})\nexport class TuiSelectOption<T> {\n private readonly handlers: TuiItemsHandlers<T> = inject(TUI_ITEMS_HANDLERS);\n private readonly value = tuiInjectValue<T>();\n\n protected readonly datalist = inject(TuiDataListComponent);\n protected readonly option = inject<TuiOptionWithValue<T>>(TuiOptionWithValue, {\n optional: true,\n });\n\n protected readonly selected = computed(\n (controlValue = this.value(), optionValue = this.option?.value()) =>\n tuiIsPresent(optionValue) &&\n tuiIsPresent(controlValue) &&\n this.handlers.identityMatcher()(controlValue, optionValue),\n );\n\n protected readonly scrolled = tuiDirectiveBinding(\n TuiScrollIntoView,\n 'tuiScrollIntoView',\n this.selected,\n );\n}\n","import {Directive, effect, inject} from '@angular/core';\nimport {tuiAsControl, TuiControl} from '@taiga-ui/cdk/classes';\nimport {tuiIsPresent} from '@taiga-ui/cdk/utils/miscellaneous';\nimport {tuiAsOptionContent} from '@taiga-ui/core/components/data-list';\nimport {\n tuiAsTextfieldAccessor,\n TuiSelectLike,\n type TuiTextfieldAccessor,\n TuiTextfieldDirective,\n TuiWithTextfield,\n} from '@taiga-ui/core/components/textfield';\nimport {tuiDropdownEnabled, tuiDropdownOpen} from '@taiga-ui/core/directives/dropdown';\nimport {\n TUI_ITEMS_HANDLERS,\n type TuiItemsHandlers,\n} from '@taiga-ui/core/directives/items-handlers';\n\nimport {TuiSelectOption} from './select-option/select-option.component';\n\n@Directive({\n standalone: true,\n selector: 'input[tuiSelect]',\n providers: [\n tuiAsOptionContent(TuiSelectOption),\n tuiAsTextfieldAccessor(TuiSelectDirective),\n tuiAsControl(TuiSelectDirective),\n ],\n hostDirectives: [TuiWithTextfield, TuiSelectLike],\n host: {\n '[disabled]': 'disabled()',\n '(input)': '$event.inputType?.includes(\"delete\") && setValue(null)',\n },\n})\nexport class TuiSelectDirective<T>\n extends TuiControl<T | null>\n implements TuiTextfieldAccessor<T>\n{\n private readonly textfield = inject(TuiTextfieldDirective);\n private readonly open = tuiDropdownOpen();\n private readonly itemsHandlers: TuiItemsHandlers<T> = inject(TUI_ITEMS_HANDLERS);\n\n protected readonly dropdownEnabled = tuiDropdownEnabled(this.interactive);\n protected readonly valueEffect = effect(() => {\n const value = this.value();\n const string = tuiIsPresent(value) ? this.itemsHandlers.stringify()(value) : '';\n\n this.textfield.value.set(string);\n });\n\n public setValue(value: T | null): void {\n this.onChange(value);\n\n if (!value) {\n this.open.set(true);\n }\n }\n}\n","import {TuiNativeSelect} from './native-select/native-select.component';\nimport {TuiSelectDirective} from './select.directive';\n\nexport const TuiSelect = [TuiSelectDirective, TuiNativeSelect] as const;\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i1"],"mappings":"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"}
1
+ {"version":3,"file":"taiga-ui-kit-components-select.mjs","sources":["../../../projects/kit/components/select/native-select/native-select.component.ts","../../../projects/kit/components/select/native-select/native-select.template.html","../../../projects/kit/components/select/select-option/select-option.component.ts","../../../projects/kit/components/select/select.directive.ts","../../../projects/kit/components/select/select.ts","../../../projects/kit/components/select/taiga-ui-kit-components-select.ts"],"sourcesContent":["import {NgTemplateOutlet} from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n computed,\n effect,\n inject,\n input,\n} from '@angular/core';\nimport {tuiAsControl, TuiControl} from '@taiga-ui/cdk/classes';\nimport {tuiIsPresent} from '@taiga-ui/cdk/utils/miscellaneous';\nimport {\n tuiAsTextfieldAccessor,\n type TuiTextfieldAccessor,\n TuiTextfieldDirective,\n TuiWithTextfield,\n} from '@taiga-ui/core/components/textfield';\nimport {\n TUI_ITEMS_HANDLERS,\n type TuiItemsHandlers,\n} from '@taiga-ui/core/directives/items-handlers';\nimport {tuiIsFlat} from '@taiga-ui/kit/utils';\n\n@Component({\n selector: 'select[tuiSelect]',\n imports: [NgTemplateOutlet],\n templateUrl: './native-select.template.html',\n changeDetection: ChangeDetectionStrategy.OnPush,\n providers: [tuiAsTextfieldAccessor(TuiNativeSelect), tuiAsControl(TuiNativeSelect)],\n hostDirectives: [TuiWithTextfield],\n host: {\n '[attr.aria-invalid]': 'invalid()',\n '[disabled]': '!interactive()',\n '(change)': 'selectOption($event.target.options.selectedIndex)',\n },\n})\nexport class TuiNativeSelect<T>\n extends TuiControl<T | null>\n implements TuiTextfieldAccessor<T>\n{\n private readonly textfield = inject(TuiTextfieldDirective);\n\n protected readonly isFlat = tuiIsFlat;\n protected readonly itemsHandlers: TuiItemsHandlers<T> = inject(TUI_ITEMS_HANDLERS);\n\n protected readonly stringified = computed((value = this.value()) =>\n tuiIsPresent(value) ? this.itemsHandlers.stringify()(value) : '',\n );\n\n protected readonly showPlaceholder = computed(\n () => this.placeholder() && !this.stringified(),\n );\n\n protected readonly isSelected = computed(\n (value = this.value()) =>\n (x: T) =>\n tuiIsPresent(value) && this.itemsHandlers.identityMatcher()(x, value),\n );\n\n protected readonly valueEffect = effect(() => {\n this.textfield.value.set(this.stringified());\n });\n\n public readonly items = input<ReadonlyArray<readonly T[]> | readonly T[] | null>([]);\n\n public readonly labels = input<readonly string[]>([]);\n\n public readonly placeholder = input('');\n\n public setValue(value: T | null): void {\n this.onChange(value);\n }\n\n protected selectOption(index: number): void {\n const items = (this.items()?.flat() ?? []) as T[];\n\n this.onChange(items[index - (this.showPlaceholder() ? 1 : 0)] ?? null);\n }\n}\n","@if (showPlaceholder()) {\n <option\n disabled\n selected\n value=\"\"\n >\n {{ placeholder() }}\n </option>\n}\n@let elements = items();\n\n@if (elements && !isFlat(elements)) {\n @for (group of labels(); track group) {\n <optgroup [label]=\"labels()[$index]\">\n <ng-container *ngTemplateOutlet=\"options; context: {$implicit: elements[$index]}\" />\n </optgroup>\n }\n} @else {\n <ng-container *ngTemplateOutlet=\"options; context: {$implicit: elements}\" />\n}\n\n<ng-template\n #options\n let-items\n>\n @for (option of items; track option) {\n <option\n [disabled]=\"itemsHandlers.disabledItemHandler()(option)\"\n [selected]=\"isSelected()(option)\"\n [value]=\"itemsHandlers.stringify()(option)\"\n >\n {{ itemsHandlers.stringify()(option) }}\n </option>\n }\n</ng-template>\n","import {ChangeDetectionStrategy, Component, computed, inject} from '@angular/core';\nimport {tuiDirectiveBinding} from '@taiga-ui/cdk/utils/di';\nimport {tuiIsPresent} from '@taiga-ui/cdk/utils/miscellaneous';\nimport {\n TuiDataListComponent,\n TuiOptionWithValue,\n} from '@taiga-ui/core/components/data-list';\nimport {TuiScrollIntoView} from '@taiga-ui/core/components/scrollbar';\nimport {\n TUI_ITEMS_HANDLERS,\n type TuiItemsHandlers,\n} from '@taiga-ui/core/directives/items-handlers';\nimport {TuiCheckbox, tuiCheckboxOptionsProvider} from '@taiga-ui/kit/components/checkbox';\nimport {tuiInjectValue} from '@taiga-ui/kit/utils';\n\n@Component({\n imports: [TuiCheckbox],\n template: `\n @if (selected()) {\n <input\n tuiCheckbox\n type=\"checkbox\"\n class=\"t-check\"\n [checked]=\"selected()\"\n [size]=\"datalist.size() === 'l' ? 'm' : 's'\"\n />\n } @else {\n <span class=\"t-dummy\"></span>\n }\n `,\n styleUrl: './select-option.style.less',\n changeDetection: ChangeDetectionStrategy.OnPush,\n providers: [tuiCheckboxOptionsProvider({appearance: () => 'action'})],\n hostDirectives: [TuiScrollIntoView],\n host: {\n tuiSelectOption: '',\n '[class._value]': 'option',\n '[class._selected]': 'selected()',\n },\n})\nexport class TuiSelectOption<T> {\n private readonly handlers: TuiItemsHandlers<T> = inject(TUI_ITEMS_HANDLERS);\n private readonly value = tuiInjectValue<T>();\n\n protected readonly datalist = inject(TuiDataListComponent);\n protected readonly option = inject<TuiOptionWithValue<T>>(TuiOptionWithValue, {\n optional: true,\n });\n\n protected readonly selected = computed(\n (controlValue = this.value(), optionValue = this.option?.value()) =>\n tuiIsPresent(optionValue) &&\n tuiIsPresent(controlValue) &&\n this.handlers.identityMatcher()(controlValue, optionValue),\n );\n\n protected readonly scrolled = tuiDirectiveBinding(\n TuiScrollIntoView,\n 'tuiScrollIntoView',\n this.selected,\n );\n}\n","import {Directive, effect, inject} from '@angular/core';\nimport {tuiAsControl, TuiControl} from '@taiga-ui/cdk/classes';\nimport {tuiIsPresent} from '@taiga-ui/cdk/utils/miscellaneous';\nimport {tuiAsOptionContent} from '@taiga-ui/core/components/data-list';\nimport {\n tuiAsTextfieldAccessor,\n TuiSelectLike,\n type TuiTextfieldAccessor,\n TuiTextfieldDirective,\n TuiWithTextfield,\n} from '@taiga-ui/core/components/textfield';\nimport {tuiDropdownEnabled, TuiDropdownOpen} from '@taiga-ui/core/directives/dropdown';\nimport {\n TUI_ITEMS_HANDLERS,\n type TuiItemsHandlers,\n} from '@taiga-ui/core/directives/items-handlers';\n\nimport {TuiSelectOption} from './select-option/select-option.component';\n\n@Directive({\n selector: 'input[tuiSelect]',\n providers: [\n tuiAsOptionContent(TuiSelectOption),\n tuiAsTextfieldAccessor(TuiSelectDirective),\n tuiAsControl(TuiSelectDirective),\n ],\n hostDirectives: [TuiWithTextfield, TuiSelectLike],\n host: {\n '[disabled]': 'disabled()',\n '(input)': '$event.inputType?.includes(\"delete\") && setValue(null)',\n },\n})\nexport class TuiSelectDirective<T>\n extends TuiControl<T | null>\n implements TuiTextfieldAccessor<T>\n{\n private readonly textfield = inject(TuiTextfieldDirective);\n private readonly open = inject(TuiDropdownOpen).open;\n private readonly itemsHandlers: TuiItemsHandlers<T> = inject(TUI_ITEMS_HANDLERS);\n\n protected readonly dropdownEnabled = tuiDropdownEnabled(this.interactive);\n protected readonly valueEffect = effect(() => {\n const value = this.value();\n const string = tuiIsPresent(value) ? this.itemsHandlers.stringify()(value) : '';\n\n this.textfield.value.set(string);\n });\n\n public setValue(value: T | null): void {\n this.onChange(value);\n\n if (!value) {\n this.open.set(true);\n }\n }\n}\n","import {TuiNativeSelect} from './native-select/native-select.component';\nimport {TuiSelectDirective} from './select.directive';\n\nexport const TuiSelect = [TuiSelectDirective, TuiNativeSelect] as const;\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i1"],"mappings":"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"}
@@ -1,16 +1,17 @@
1
1
  import { tuiRound } from '@taiga-ui/cdk/utils/math';
2
2
  import { __decorate } from 'tslib';
3
3
  import * as i0 from '@angular/core';
4
- import { InjectionToken, inject, signal, computed, Input, ChangeDetectionStrategy, Component, INJECTOR, input, Directive, ContentChild } from '@angular/core';
4
+ import { inject, signal, computed, Input, ChangeDetectionStrategy, Component, INJECTOR, input, Directive, ContentChild } from '@angular/core';
5
5
  import { toSignal, takeUntilDestroyed } from '@angular/core/rxjs-interop';
6
6
  import { NgControl, NgModel } from '@angular/forms';
7
7
  import { TuiControl, TUI_IDENTITY_VALUE_TRANSFORMER } from '@taiga-ui/cdk/classes';
8
8
  import { tuiWatch, tuiControlValue, tuiTypedFromEvent } from '@taiga-ui/cdk/observables';
9
9
  import { tuiFallbackValueProvider } from '@taiga-ui/cdk/tokens';
10
- import { tuiProvideOptions, tuiPure } from '@taiga-ui/cdk/utils/miscellaneous';
10
+ import { tuiPure } from '@taiga-ui/cdk/utils/miscellaneous';
11
11
  import { take, timer, switchMap, merge, tap, map, combineLatest, filter } from 'rxjs';
12
12
  import { tuiInjectElement } from '@taiga-ui/cdk/utils/dom';
13
13
  import { tuiAsAuxiliary } from '@taiga-ui/core/tokens';
14
+ import { tuiCreateOptions } from '@taiga-ui/cdk/utils/di';
14
15
  import { coerceBooleanProperty } from '@angular/cdk/coercion';
15
16
  import { DOCUMENT, AsyncPipe } from '@angular/common';
16
17
  import { TUI_TRUE_HANDLER, TUI_FALSE_HANDLER } from '@taiga-ui/cdk/constants';
@@ -53,15 +54,7 @@ const TUI_SLIDER_DEFAULT_OPTIONS = {
53
54
  size: 'm',
54
55
  trackColor: 'var(--tui-background-neutral-2)',
55
56
  };
56
- /**
57
- * Default parameters for Slider component
58
- */
59
- const TUI_SLIDER_OPTIONS = new InjectionToken(ngDevMode ? 'TUI_SLIDER_OPTIONS' : '', {
60
- factory: () => TUI_SLIDER_DEFAULT_OPTIONS,
61
- });
62
- function tuiSliderOptionsProvider(options) {
63
- return tuiProvideOptions(TUI_SLIDER_OPTIONS, options, TUI_SLIDER_DEFAULT_OPTIONS);
64
- }
57
+ const [TUI_SLIDER_OPTIONS, tuiSliderOptionsProvider] = tuiCreateOptions(TUI_SLIDER_DEFAULT_OPTIONS);
65
58
 
66
59
  class TuiSliderComponent {
67
60
  constructor() {
@@ -148,11 +141,11 @@ class TuiSliderComponent {
148
141
  `, `linear-gradient(to right, transparent 0 ${percentages[0]}%,`);
149
142
  }
150
143
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiSliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
151
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.2.15", type: TuiSliderComponent, isStandalone: true, selector: "input[type=range][tuiSlider]", inputs: { size: "size", segmentsSetter: ["segments", "segmentsSetter", (x) => Array.isArray(x) ? x : new Array(x).fill(null).map((_, i) => i / x)] }, host: { listeners: { "input": "0" }, properties: { "style.--tui-slider-track-color": "options.trackColor", "style.--tui-ticks-gradient": "ticksGradient()", "style.--tui-slider-fill-ratio": "valueRatio", "attr.data-size": "size" } }, providers: [tuiAsAuxiliary(TuiSliderComponent)], ngImport: i0, template: '', isInline: true, styles: [":host{--t-tick-thickness: .25rem;position:relative;display:block;inline-size:100%;color:var(--tui-background-accent-1);cursor:pointer;-webkit-appearance:none;appearance:none;block-size:1rem;background-color:transparent;background-clip:content-box;outline:none;border-radius:var(--tui-radius-m);--tui-thickness: .125rem}:host:active{cursor:ew-resize}:host:disabled{opacity:var(--tui-disabled-opacity);cursor:auto}:host[data-size=s]:not(:disabled):before{transition-property:transform,opacity;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:absolute;top:.25rem;left:var(--t-left);inset-inline-start:var(--t-left);inline-size:.5rem;block-size:.5rem;border-radius:50%;transform:var(--tui-slider-thumb-transform, scale(1));--t-left: calc(var(--tui-slider-fill-ratio) * 100% - var(--tui-slider-fill-ratio) * .5rem);content:\"\";cursor:ew-resize;background:currentColor;opacity:0}:host[data-size=s]:active:before{opacity:.2;transform:var(--tui-slider-thumb-transform, scale(1)) scale(2.33)}:host[data-size=m]:not(:disabled):before{transition-property:transform,opacity;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:absolute;top:.125rem;left:var(--t-left);inset-inline-start:var(--t-left);inline-size:.75rem;block-size:.75rem;border-radius:50%;transform:var(--tui-slider-thumb-transform, scale(1));--t-left: calc(var(--tui-slider-fill-ratio) * 100% - var(--tui-slider-fill-ratio) * .75rem);content:\"\";cursor:ew-resize;background:currentColor;opacity:0}:host[data-size=m]:active:before{opacity:.2;transform:var(--tui-slider-thumb-transform, scale(1)) scale(2.33)}:host::-webkit-slider-container{border-radius:inherit}:host[data-size=m]::-webkit-slider-runnable-track{block-size:var(--tui-thickness);border-radius:inherit;background-repeat:no-repeat;background-color:var(--tui-slider-track-color);background-image:var(--tui-ticks-gradient),linear-gradient(to var(--tui-inline-end),currentColor calc(100% * var(--tui-slider-fill-ratio)),transparent calc(100% * var(--tui-slider-fill-ratio)));background-position-x:calc((.75rem - var(--t-tick-thickness)) / 2),0;background-size:calc(100% - .75rem),auto}:host[data-size=s]::-webkit-slider-runnable-track{block-size:var(--tui-thickness);border-radius:inherit;background-repeat:no-repeat;background-color:var(--tui-slider-track-color);background-image:var(--tui-ticks-gradient),linear-gradient(to var(--tui-inline-end),currentColor calc(100% * var(--tui-slider-fill-ratio)),transparent calc(100% * var(--tui-slider-fill-ratio)));background-position-x:calc((.5rem - var(--t-tick-thickness)) / 2),0;background-size:calc(100% - .5rem),auto}:host[data-size=m]::-moz-range-track{block-size:var(--tui-thickness);border-radius:inherit;background-repeat:no-repeat;background-color:var(--tui-slider-track-color);background-image:var(--tui-ticks-gradient);background-position-x:calc((.75rem - var(--t-tick-thickness)) / 2);background-size:calc(100% - .75rem)}:host[data-size=s]::-moz-range-track{block-size:var(--tui-thickness);border-radius:inherit;background-repeat:no-repeat;background-color:var(--tui-slider-track-color);background-image:var(--tui-ticks-gradient);background-position-x:calc((.5rem - var(--t-tick-thickness)) / 2);background-size:calc(100% - .5rem)}:host[data-size=m]::-webkit-slider-thumb{transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;isolation:isolate;-webkit-appearance:none;appearance:none;background-color:currentColor;box-shadow:none;border-radius:50%;block-size:.75rem;inline-size:.75rem;box-sizing:content-box;background-clip:content-box;border:.125rem solid transparent;border-inline-start:0;border-inline-end:0;transform:var(--tui-slider-thumb-transform, scale(1));margin-block-start:calc(var(--tui-thickness) / 2 - (1rem / 2))}:not(:disabled):host[data-size=m]::-webkit-slider-thumb{cursor:ew-resize}:not(:disabled):host[data-size=m]::-webkit-slider-thumb:hover,:active:not(:disabled):host[data-size=m]::-webkit-slider-thumb{transform:var(--tui-slider-thumb-transform, scale(1)) scale(1.333)}:focus-visible:host[data-size=m]::-webkit-slider-thumb{box-shadow:0 0 0 2px inset var(--tui-border-focus)}:host[data-size=s]::-webkit-slider-thumb{transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;isolation:isolate;-webkit-appearance:none;appearance:none;background-color:currentColor;box-shadow:none;border-radius:50%;block-size:.5rem;inline-size:.5rem;box-sizing:content-box;background-clip:content-box;border:.25rem solid transparent;border-inline-start:0;border-inline-end:0;transform:var(--tui-slider-thumb-transform, scale(1));margin-block-start:calc(var(--tui-thickness) / 2 - (1rem / 2))}:not(:disabled):host[data-size=s]::-webkit-slider-thumb{cursor:ew-resize}:not(:disabled):host[data-size=s]::-webkit-slider-thumb:hover,:active:not(:disabled):host[data-size=s]::-webkit-slider-thumb{transform:var(--tui-slider-thumb-transform, scale(1)) scale(1.5)}:focus-visible:host[data-size=s]::-webkit-slider-thumb{box-shadow:0 0 0 2px inset var(--tui-border-focus)}:host[data-size=m]::-moz-range-thumb{transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;isolation:isolate;-webkit-appearance:none;appearance:none;background-color:currentColor;box-shadow:none;border-radius:50%;block-size:.75rem;inline-size:.75rem;box-sizing:content-box;background-clip:content-box;border:.125rem solid transparent;border-inline-start:0;border-inline-end:0;transform:var(--tui-slider-thumb-transform, scale(1))}:not(:disabled):host[data-size=m]::-moz-range-thumb{cursor:ew-resize}:not(:disabled):host[data-size=m]::-moz-range-thumb:hover,:active:not(:disabled):host[data-size=m]::-moz-range-thumb{transform:var(--tui-slider-thumb-transform, scale(1)) scale(1.333)}:focus-visible:host[data-size=m]::-moz-range-thumb{box-shadow:0 0 0 2px inset var(--tui-border-focus)}:host[data-size=s]::-moz-range-thumb{transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;isolation:isolate;-webkit-appearance:none;appearance:none;background-color:currentColor;box-shadow:none;border-radius:50%;block-size:.5rem;inline-size:.5rem;box-sizing:content-box;background-clip:content-box;border:.25rem solid transparent;border-inline-start:0;border-inline-end:0;transform:var(--tui-slider-thumb-transform, scale(1))}:not(:disabled):host[data-size=s]::-moz-range-thumb{cursor:ew-resize}:not(:disabled):host[data-size=s]::-moz-range-thumb:hover,:active:not(:disabled):host[data-size=s]::-moz-range-thumb{transform:var(--tui-slider-thumb-transform, scale(1)) scale(1.5)}:focus-visible:host[data-size=s]::-moz-range-thumb{box-shadow:0 0 0 2px inset var(--tui-border-focus)}:host::-moz-range-progress{border-radius:inherit}:host::-moz-range-progress{block-size:var(--tui-thickness);background:currentColor;border-top-right-radius:0;border-bottom-right-radius:0}:host-context(tui-textfield) :host([type=\"range\"]){top:100%;left:var(--t-padding);right:var(--t-padding);inline-size:calc(100% - var(--t-padding) * 2);block-size:1rem;margin:calc(-.5rem - var(--tui-thickness) / 2) 0 0;padding:0;pointer-events:auto}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
144
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.2.15", type: TuiSliderComponent, isStandalone: true, selector: "input[type=range][tuiSlider]", inputs: { size: "size", segmentsSetter: ["segments", "segmentsSetter", (x) => Array.isArray(x) ? x : Array.from({ length: x }, (_, i) => i / x)] }, host: { listeners: { "input": "0" }, properties: { "style.--tui-slider-track-color": "options.trackColor", "style.--tui-ticks-gradient": "ticksGradient()", "style.--tui-slider-fill-ratio": "valueRatio", "attr.data-size": "size" } }, providers: [tuiAsAuxiliary(TuiSliderComponent)], ngImport: i0, template: '', isInline: true, styles: [":host{--t-tick-thickness: .25rem;position:relative;display:block;inline-size:100%;color:var(--tui-background-accent-1);cursor:pointer;-webkit-appearance:none;appearance:none;block-size:1rem;background-color:transparent;background-clip:content-box;outline:none;border-radius:var(--tui-radius-m);--tui-thickness: .125rem}:host:active{cursor:ew-resize}:host:disabled{opacity:var(--tui-disabled-opacity);cursor:auto}:host[data-size=s]:not(:disabled):before{transition-property:transform,opacity;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:absolute;top:.25rem;left:var(--t-left);inset-inline-start:var(--t-left);inline-size:.5rem;block-size:.5rem;border-radius:50%;transform:var(--tui-slider-thumb-transform, scale(1));--t-left: calc(var(--tui-slider-fill-ratio) * 100% - var(--tui-slider-fill-ratio) * .5rem);content:\"\";cursor:ew-resize;background:currentColor;opacity:0}:host[data-size=s]:active:before{opacity:.2;transform:var(--tui-slider-thumb-transform, scale(1)) scale(2.33)}:host[data-size=m]:not(:disabled):before{transition-property:transform,opacity;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:absolute;top:.125rem;left:var(--t-left);inset-inline-start:var(--t-left);inline-size:.75rem;block-size:.75rem;border-radius:50%;transform:var(--tui-slider-thumb-transform, scale(1));--t-left: calc(var(--tui-slider-fill-ratio) * 100% - var(--tui-slider-fill-ratio) * .75rem);content:\"\";cursor:ew-resize;background:currentColor;opacity:0}:host[data-size=m]:active:before{opacity:.2;transform:var(--tui-slider-thumb-transform, scale(1)) scale(2.33)}:host::-webkit-slider-container{border-radius:inherit}:host[data-size=m]::-webkit-slider-runnable-track{block-size:var(--tui-thickness);border-radius:inherit;background-repeat:no-repeat;background-color:var(--tui-slider-track-color);background-image:var(--tui-ticks-gradient),linear-gradient(to var(--tui-inline-end),currentColor calc(100% * var(--tui-slider-fill-ratio)),transparent calc(100% * var(--tui-slider-fill-ratio)));background-position-x:calc((.75rem - var(--t-tick-thickness)) / 2),0;background-size:calc(100% - .75rem),auto}:host[data-size=s]::-webkit-slider-runnable-track{block-size:var(--tui-thickness);border-radius:inherit;background-repeat:no-repeat;background-color:var(--tui-slider-track-color);background-image:var(--tui-ticks-gradient),linear-gradient(to var(--tui-inline-end),currentColor calc(100% * var(--tui-slider-fill-ratio)),transparent calc(100% * var(--tui-slider-fill-ratio)));background-position-x:calc((.5rem - var(--t-tick-thickness)) / 2),0;background-size:calc(100% - .5rem),auto}:host[data-size=m]::-moz-range-track{block-size:var(--tui-thickness);border-radius:inherit;background-repeat:no-repeat;background-color:var(--tui-slider-track-color);background-image:var(--tui-ticks-gradient);background-position-x:calc((.75rem - var(--t-tick-thickness)) / 2);background-size:calc(100% - .75rem)}:host[data-size=s]::-moz-range-track{block-size:var(--tui-thickness);border-radius:inherit;background-repeat:no-repeat;background-color:var(--tui-slider-track-color);background-image:var(--tui-ticks-gradient);background-position-x:calc((.5rem - var(--t-tick-thickness)) / 2);background-size:calc(100% - .5rem)}:host[data-size=m]::-webkit-slider-thumb{transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;isolation:isolate;-webkit-appearance:none;appearance:none;background-color:currentColor;box-shadow:none;border-radius:50%;block-size:.75rem;inline-size:.75rem;box-sizing:content-box;background-clip:content-box;border:.125rem solid transparent;border-inline-start:0;border-inline-end:0;transform:var(--tui-slider-thumb-transform, scale(1));margin-block-start:calc(var(--tui-thickness) / 2 - (1rem / 2))}:not(:disabled):host[data-size=m]::-webkit-slider-thumb{cursor:ew-resize}:not(:disabled):host[data-size=m]::-webkit-slider-thumb:hover,:active:not(:disabled):host[data-size=m]::-webkit-slider-thumb{transform:var(--tui-slider-thumb-transform, scale(1)) scale(1.333)}:focus-visible:host[data-size=m]::-webkit-slider-thumb{box-shadow:0 0 0 2px inset var(--tui-border-focus)}:host[data-size=s]::-webkit-slider-thumb{transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;isolation:isolate;-webkit-appearance:none;appearance:none;background-color:currentColor;box-shadow:none;border-radius:50%;block-size:.5rem;inline-size:.5rem;box-sizing:content-box;background-clip:content-box;border:.25rem solid transparent;border-inline-start:0;border-inline-end:0;transform:var(--tui-slider-thumb-transform, scale(1));margin-block-start:calc(var(--tui-thickness) / 2 - (1rem / 2))}:not(:disabled):host[data-size=s]::-webkit-slider-thumb{cursor:ew-resize}:not(:disabled):host[data-size=s]::-webkit-slider-thumb:hover,:active:not(:disabled):host[data-size=s]::-webkit-slider-thumb{transform:var(--tui-slider-thumb-transform, scale(1)) scale(1.5)}:focus-visible:host[data-size=s]::-webkit-slider-thumb{box-shadow:0 0 0 2px inset var(--tui-border-focus)}:host[data-size=m]::-moz-range-thumb{transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;isolation:isolate;-webkit-appearance:none;appearance:none;background-color:currentColor;box-shadow:none;border-radius:50%;block-size:.75rem;inline-size:.75rem;box-sizing:content-box;background-clip:content-box;border:.125rem solid transparent;border-inline-start:0;border-inline-end:0;transform:var(--tui-slider-thumb-transform, scale(1))}:not(:disabled):host[data-size=m]::-moz-range-thumb{cursor:ew-resize}:not(:disabled):host[data-size=m]::-moz-range-thumb:hover,:active:not(:disabled):host[data-size=m]::-moz-range-thumb{transform:var(--tui-slider-thumb-transform, scale(1)) scale(1.333)}:focus-visible:host[data-size=m]::-moz-range-thumb{box-shadow:0 0 0 2px inset var(--tui-border-focus)}:host[data-size=s]::-moz-range-thumb{transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;isolation:isolate;-webkit-appearance:none;appearance:none;background-color:currentColor;box-shadow:none;border-radius:50%;block-size:.5rem;inline-size:.5rem;box-sizing:content-box;background-clip:content-box;border:.25rem solid transparent;border-inline-start:0;border-inline-end:0;transform:var(--tui-slider-thumb-transform, scale(1))}:not(:disabled):host[data-size=s]::-moz-range-thumb{cursor:ew-resize}:not(:disabled):host[data-size=s]::-moz-range-thumb:hover,:active:not(:disabled):host[data-size=s]::-moz-range-thumb{transform:var(--tui-slider-thumb-transform, scale(1)) scale(1.5)}:focus-visible:host[data-size=s]::-moz-range-thumb{box-shadow:0 0 0 2px inset var(--tui-border-focus)}:host::-moz-range-progress{border-radius:inherit}:host::-moz-range-progress{block-size:var(--tui-thickness);background:currentColor;border-top-right-radius:0;border-bottom-right-radius:0}:host-context(tui-textfield) :host([type=\"range\"]){top:100%;left:var(--t-padding);right:var(--t-padding);inline-size:calc(100% - var(--t-padding) * 2);block-size:1rem;margin:calc(-.5rem - var(--tui-thickness) / 2) 0 0;padding:0;pointer-events:auto}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
152
145
  }
153
146
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiSliderComponent, decorators: [{
154
147
  type: Component,
155
- args: [{ standalone: true, selector: 'input[type=range][tuiSlider]', template: '', changeDetection: ChangeDetectionStrategy.OnPush, providers: [tuiAsAuxiliary(TuiSliderComponent)], host: {
148
+ args: [{ selector: 'input[type=range][tuiSlider]', template: '', changeDetection: ChangeDetectionStrategy.OnPush, providers: [tuiAsAuxiliary(TuiSliderComponent)], host: {
156
149
  /**
157
150
  * For change detection.
158
151
  * Webkit does not have built-in method for customization of filling progress (as Firefox).
@@ -171,7 +164,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
171
164
  type: Input,
172
165
  args: [{
173
166
  alias: 'segments',
174
- transform: (x) => Array.isArray(x) ? x : new Array(x).fill(null).map((_, i) => i / x),
167
+ transform: (x) => Array.isArray(x) ? x : Array.from({ length: x }, (_, i) => i / x),
175
168
  }]
176
169
  }] } });
177
170
 
@@ -227,7 +220,6 @@ __decorate([
227
220
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiSliderKeyStepsBase, decorators: [{
228
221
  type: Directive,
229
222
  args: [{
230
- standalone: true,
231
223
  selector: 'input[tuiSlider][keySteps]',
232
224
  host: {
233
225
  '[attr.min]': 'transformer() ? 0 : slider.min',
@@ -260,7 +252,6 @@ class TuiSliderKeySteps extends TuiControl {
260
252
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiSliderKeySteps, decorators: [{
261
253
  type: Directive,
262
254
  args: [{
263
- standalone: true,
264
255
  selector: 'input[tuiSlider][keySteps][ngModel],input[tuiSlider][keySteps][formControl],input[tuiSlider][keySteps][formControlName]',
265
256
  providers: [tuiFallbackValueProvider(0)],
266
257
  host: {
@@ -328,7 +319,6 @@ class TuiSliderReadonly {
328
319
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiSliderReadonly, decorators: [{
329
320
  type: Directive,
330
321
  args: [{
331
- standalone: true,
332
322
  selector: 'input[tuiSlider][readonly]',
333
323
  host: {
334
324
  '(keydown)': 'preventKeyboardInteraction($event)',