@taiga-ui/core 4.52.0-canary.d626d20 → 4.52.0-canary.e07790b

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 (637) hide show
  1. package/README.md +1 -1
  2. package/classes/accessors.d.ts +2 -2
  3. package/classes/driver.d.ts +1 -1
  4. package/components/button/button.directive.d.ts +2 -3
  5. package/components/button/button.options.d.ts +1 -1
  6. package/components/calendar/calendar-sheet.component.d.ts +2 -7
  7. package/components/calendar/calendar-sheet.options.d.ts +1 -3
  8. package/{pipes/calendar-sheet → components/calendar}/calendar-sheet.pipe.d.ts +2 -2
  9. package/components/calendar/calendar-spin.component.d.ts +1 -0
  10. package/components/calendar/calendar-year.component.d.ts +1 -1
  11. package/components/calendar/calendar.options.d.ts +9 -0
  12. package/components/calendar/index.d.ts +3 -0
  13. package/{pipes/order-week-days → components/calendar}/order-week-days.pipe.d.ts +1 -1
  14. package/components/cell/cell.directive.d.ts +9 -0
  15. package/components/cell/cell.options.d.ts +6 -0
  16. package/components/cell/index.d.ts +2 -0
  17. package/components/data-list/data-list.component.d.ts +8 -12
  18. package/components/data-list/data-list.d.ts +3 -4
  19. package/components/data-list/data-list.tokens.d.ts +1 -23
  20. package/components/data-list/index.d.ts +3 -4
  21. package/components/data-list/opt-group.directive.d.ts +2 -2
  22. package/components/data-list/option-content.directive.d.ts +14 -0
  23. package/components/data-list/option-with-value.directive.d.ts +9 -0
  24. package/components/data-list/option.directive.d.ts +19 -0
  25. package/components/error/error.component.d.ts +6 -8
  26. package/components/error/error.d.ts +4 -0
  27. package/components/error/error.directive.d.ts +19 -0
  28. package/components/error/error.pipe.d.ts +10 -0
  29. package/components/error/index.d.ts +3 -0
  30. package/components/expand/expand.component.d.ts +9 -28
  31. package/components/expand/index.d.ts +0 -2
  32. package/components/icon/icon.component.d.ts +6 -11
  33. package/components/index.d.ts +3 -3
  34. package/components/input/index.d.ts +2 -0
  35. package/components/input/input.d.ts +5 -0
  36. package/components/input/input.directive.d.ts +30 -0
  37. package/components/label/label.directive.d.ts +1 -1
  38. package/components/link/index.d.ts +0 -1
  39. package/components/link/link.directive.d.ts +8 -6
  40. package/components/loader/loader.component.d.ts +7 -7
  41. package/components/loader/loader.options.d.ts +1 -3
  42. package/components/notification/index.d.ts +3 -0
  43. package/components/notification/notification.component.d.ts +14 -0
  44. package/components/notification/notification.d.ts +3 -0
  45. package/components/notification/notification.directive.d.ts +7 -12
  46. package/components/notification/notification.options.d.ts +10 -7
  47. package/components/notification/notification.service.d.ts +17 -0
  48. package/components/root/root.component.d.ts +4 -6
  49. package/components/scrollbar/scroll-into-view.directive.d.ts +3 -2
  50. package/components/scrollbar/scroll-ref.directive.d.ts +2 -0
  51. package/components/scrollbar/scrollbar.component.d.ts +1 -5
  52. package/components/scrollbar/scrollbar.directive.d.ts +2 -2
  53. package/components/scrollbar/scrollbar.options.d.ts +1 -1
  54. package/components/spin-button/spin-button.component.d.ts +9 -10
  55. package/components/textfield/index.d.ts +1 -4
  56. package/components/textfield/textfield-content.directive.d.ts +3 -2
  57. package/components/textfield/textfield-icon.d.ts +3 -3
  58. package/components/textfield/textfield-multi/textfield-item.component.d.ts +3 -2
  59. package/components/textfield/textfield-multi/textfield-multi.component.d.ts +10 -15
  60. package/components/textfield/textfield.component.d.ts +20 -33
  61. package/components/textfield/textfield.d.ts +2 -4
  62. package/components/textfield/textfield.options.d.ts +8 -11
  63. package/{directives → components}/title/title.directive.d.ts +2 -3
  64. package/directives/appearance/appearance.directive.d.ts +5 -13
  65. package/directives/appearance/appearance.options.d.ts +1 -1
  66. package/directives/date-format/date-format.directive.d.ts +3 -7
  67. package/directives/group/group.directive.d.ts +7 -7
  68. package/directives/group/group.options.d.ts +1 -3
  69. package/directives/icons/icons.bindings.d.ts +5 -0
  70. package/directives/icons/icons.directive.d.ts +8 -16
  71. package/directives/icons/index.d.ts +1 -0
  72. package/directives/index.d.ts +0 -5
  73. package/directives/items-handlers/items-handlers.directive.d.ts +5 -9
  74. package/directives/items-handlers/items-handlers.tokens.d.ts +4 -4
  75. package/directives/number-format/number-format.directive.d.ts +3 -7
  76. package/fesm2022/taiga-ui-core-classes.mjs +9 -11
  77. package/fesm2022/taiga-ui-core-classes.mjs.map +1 -1
  78. package/fesm2022/taiga-ui-core-components-button.mjs +13 -21
  79. package/fesm2022/taiga-ui-core-components-button.mjs.map +1 -1
  80. package/fesm2022/taiga-ui-core-components-calendar.mjs +143 -42
  81. package/fesm2022/taiga-ui-core-components-calendar.mjs.map +1 -1
  82. package/fesm2022/taiga-ui-core-components-cell.mjs +45 -0
  83. package/fesm2022/taiga-ui-core-components-cell.mjs.map +1 -0
  84. package/fesm2022/taiga-ui-core-components-data-list.mjs +112 -283
  85. package/fesm2022/taiga-ui-core-components-data-list.mjs.map +1 -1
  86. package/fesm2022/taiga-ui-core-components-error.mjs +110 -26
  87. package/fesm2022/taiga-ui-core-components-error.mjs.map +1 -1
  88. package/fesm2022/taiga-ui-core-components-expand.mjs +34 -132
  89. package/fesm2022/taiga-ui-core-components-expand.mjs.map +1 -1
  90. package/fesm2022/taiga-ui-core-components-icon.mjs +22 -40
  91. package/fesm2022/taiga-ui-core-components-icon.mjs.map +1 -1
  92. package/fesm2022/taiga-ui-core-components-input.mjs +104 -0
  93. package/fesm2022/taiga-ui-core-components-input.mjs.map +1 -0
  94. package/fesm2022/taiga-ui-core-components-label.mjs +13 -18
  95. package/fesm2022/taiga-ui-core-components-label.mjs.map +1 -1
  96. package/fesm2022/taiga-ui-core-components-link.mjs +16 -36
  97. package/fesm2022/taiga-ui-core-components-link.mjs.map +1 -1
  98. package/fesm2022/taiga-ui-core-components-loader.mjs +17 -36
  99. package/fesm2022/taiga-ui-core-components-loader.mjs.map +1 -1
  100. package/fesm2022/taiga-ui-core-components-notification.mjs +107 -66
  101. package/fesm2022/taiga-ui-core-components-notification.mjs.map +1 -1
  102. package/fesm2022/taiga-ui-core-components-root.mjs +22 -55
  103. package/fesm2022/taiga-ui-core-components-root.mjs.map +1 -1
  104. package/fesm2022/taiga-ui-core-components-scrollbar.mjs +71 -85
  105. package/fesm2022/taiga-ui-core-components-scrollbar.mjs.map +1 -1
  106. package/fesm2022/taiga-ui-core-components-spin-button.mjs +18 -31
  107. package/fesm2022/taiga-ui-core-components-spin-button.mjs.map +1 -1
  108. package/fesm2022/taiga-ui-core-components-textfield.mjs +136 -430
  109. package/fesm2022/taiga-ui-core-components-textfield.mjs.map +1 -1
  110. package/fesm2022/taiga-ui-core-components-title.mjs +37 -0
  111. package/fesm2022/taiga-ui-core-components-title.mjs.map +1 -0
  112. package/fesm2022/taiga-ui-core-components.mjs +3 -3
  113. package/fesm2022/taiga-ui-core-directives-appearance.mjs +32 -69
  114. package/fesm2022/taiga-ui-core-directives-appearance.mjs.map +1 -1
  115. package/fesm2022/taiga-ui-core-directives-date-format.mjs +26 -20
  116. package/fesm2022/taiga-ui-core-directives-date-format.mjs.map +1 -1
  117. package/fesm2022/taiga-ui-core-directives-group.mjs +25 -40
  118. package/fesm2022/taiga-ui-core-directives-group.mjs.map +1 -1
  119. package/fesm2022/taiga-ui-core-directives-icons.mjs +35 -45
  120. package/fesm2022/taiga-ui-core-directives-icons.mjs.map +1 -1
  121. package/fesm2022/taiga-ui-core-directives-items-handlers.mjs +18 -42
  122. package/fesm2022/taiga-ui-core-directives-items-handlers.mjs.map +1 -1
  123. package/fesm2022/taiga-ui-core-directives-number-format.mjs +32 -20
  124. package/fesm2022/taiga-ui-core-directives-number-format.mjs.map +1 -1
  125. package/fesm2022/taiga-ui-core-directives.mjs +0 -5
  126. package/fesm2022/taiga-ui-core-directives.mjs.map +1 -1
  127. package/fesm2022/taiga-ui-core-pipes-format-number.mjs +21 -15
  128. package/fesm2022/taiga-ui-core-pipes-format-number.mjs.map +1 -1
  129. package/fesm2022/taiga-ui-core-pipes.mjs +0 -8
  130. package/fesm2022/taiga-ui-core-pipes.mjs.map +1 -1
  131. package/fesm2022/taiga-ui-core-portals-alert.mjs +73 -0
  132. package/fesm2022/taiga-ui-core-portals-alert.mjs.map +1 -0
  133. package/fesm2022/taiga-ui-core-portals-dialog.mjs +158 -0
  134. package/fesm2022/taiga-ui-core-portals-dialog.mjs.map +1 -0
  135. package/fesm2022/{taiga-ui-core-directives-dropdown.mjs → taiga-ui-core-portals-dropdown.mjs} +184 -336
  136. package/fesm2022/taiga-ui-core-portals-dropdown.mjs.map +1 -0
  137. package/fesm2022/taiga-ui-core-portals-hint.mjs +609 -0
  138. package/fesm2022/taiga-ui-core-portals-hint.mjs.map +1 -0
  139. package/fesm2022/taiga-ui-core-portals-modal.mjs +89 -0
  140. package/fesm2022/taiga-ui-core-portals-modal.mjs.map +1 -0
  141. package/fesm2022/taiga-ui-core-portals-popup.mjs +56 -0
  142. package/fesm2022/taiga-ui-core-portals-popup.mjs.map +1 -0
  143. package/fesm2022/taiga-ui-core-portals.mjs +11 -0
  144. package/fesm2022/taiga-ui-core-portals.mjs.map +1 -0
  145. package/fesm2022/taiga-ui-core-services.mjs +18 -57
  146. package/fesm2022/taiga-ui-core-services.mjs.map +1 -1
  147. package/fesm2022/taiga-ui-core-tokens.mjs +45 -76
  148. package/fesm2022/taiga-ui-core-tokens.mjs.map +1 -1
  149. package/fesm2022/taiga-ui-core-utils-dom.mjs.map +1 -1
  150. package/fesm2022/taiga-ui-core-utils-format.mjs +1 -22
  151. package/fesm2022/taiga-ui-core-utils-format.mjs.map +1 -1
  152. package/fesm2022/taiga-ui-core-utils-miscellaneous.mjs +65 -19
  153. package/fesm2022/taiga-ui-core-utils-miscellaneous.mjs.map +1 -1
  154. package/fesm2022/taiga-ui-core.mjs +1 -1
  155. package/index.d.ts +1 -1
  156. package/package.json +82 -208
  157. package/pipes/format-number/format-number.pipe.d.ts +6 -4
  158. package/pipes/index.d.ts +0 -8
  159. package/portals/alert/alert.directive.d.ts +11 -0
  160. package/portals/alert/alert.service.d.ts +12 -0
  161. package/portals/alert/index.d.ts +2 -0
  162. package/portals/dialog/dialog.component.d.ts +14 -0
  163. package/portals/dialog/dialog.directive.d.ts +8 -0
  164. package/{components → portals}/dialog/dialog.factory.d.ts +1 -1
  165. package/portals/dialog/dialog.options.d.ts +25 -0
  166. package/{components/dialog/dialog-close.service.d.ts → portals/dialog/dialog.providers.d.ts} +2 -0
  167. package/portals/dialog/dialog.service.d.ts +10 -0
  168. package/portals/dialog/index.d.ts +6 -0
  169. package/portals/dropdown/dropdown-content.directive.d.ts +9 -0
  170. package/{directives → portals}/dropdown/dropdown-hover.directive.d.ts +5 -10
  171. package/{directives → portals}/dropdown/dropdown-hover.options.d.ts +1 -3
  172. package/{directives → portals}/dropdown/dropdown-manual.directive.d.ts +2 -2
  173. package/portals/dropdown/dropdown-open.directive.d.ts +30 -0
  174. package/{directives → portals}/dropdown/dropdown-position-sided.directive.d.ts +3 -3
  175. package/{directives → portals}/dropdown/dropdown-position.directive.d.ts +5 -5
  176. package/{directives → portals}/dropdown/dropdown-selection.directive.d.ts +4 -5
  177. package/{directives → portals}/dropdown/dropdown.bindings.d.ts +0 -1
  178. package/{directives → portals}/dropdown/dropdown.d.ts +2 -3
  179. package/{directives → portals}/dropdown/dropdown.directive.d.ts +6 -8
  180. package/{directives → portals}/dropdown/index.d.ts +1 -4
  181. package/{directives → portals}/hint/hint-describe.directive.d.ts +4 -6
  182. package/{directives → portals}/hint/hint-host.directive.d.ts +2 -2
  183. package/{directives → portals}/hint/hint-hover.directive.d.ts +3 -4
  184. package/{directives → portals}/hint/hint-manual.directive.d.ts +2 -2
  185. package/{directives → portals}/hint/hint-options.directive.d.ts +3 -3
  186. package/{directives → portals}/hint/hint-overflow.directive.d.ts +2 -2
  187. package/{directives → portals}/hint/hint-position.directive.d.ts +6 -7
  188. package/{directives → portals}/hint/hint-unstyled.component.d.ts +2 -7
  189. package/portals/hint/hint.component.d.ts +29 -0
  190. package/portals/hint/hint.directive.d.ts +24 -0
  191. package/{directives → portals}/hint/index.d.ts +0 -2
  192. package/portals/index.d.ts +6 -0
  193. package/portals/modal/index.d.ts +2 -0
  194. package/portals/modal/modal.component.d.ts +17 -0
  195. package/portals/modal/modal.service.d.ts +13 -0
  196. package/portals/popup/popup.directive.d.ts +12 -0
  197. package/{directives → portals}/popup/popup.service.d.ts +1 -1
  198. package/{directives → portals}/popup/popups.component.d.ts +2 -2
  199. package/services/index.d.ts +0 -2
  200. package/styles/components/appearance.less +11 -0
  201. package/styles/components/button.less +1 -3
  202. package/styles/components/icon.less +32 -22
  203. package/styles/components/icons.less +16 -12
  204. package/styles/components/link.less +10 -26
  205. package/styles/components/notification.less +4 -4
  206. package/styles/components/textfield.less +32 -65
  207. package/styles/mixins/appearance.less +10 -26
  208. package/styles/mixins/appearance.scss +8 -24
  209. package/styles/mixins/mixins.less +1 -7
  210. package/styles/mixins/mixins.scss +1 -7
  211. package/styles/mixins/slider.less +21 -16
  212. package/styles/mixins/slider.scss +1 -2
  213. package/styles/taiga-ui-local.less +0 -1
  214. package/styles/taiga-ui-local.scss +0 -1
  215. package/styles/taiga-ui-theme.less +0 -1
  216. package/styles/theme/appearance/outline.less +10 -20
  217. package/styles/theme/appearance/primary.less +2 -4
  218. package/styles/theme/appearance/secondary.less +6 -14
  219. package/styles/theme/appearance/status.less +0 -4
  220. package/styles/theme/appearance/table.less +38 -31
  221. package/styles/theme/appearance/textfield.less +1 -2
  222. package/styles/theme/appearance.less +0 -1
  223. package/styles/theme/variables.less +2 -4
  224. package/tokens/common-icons.d.ts +3 -3
  225. package/tokens/date-format.d.ts +2 -3
  226. package/tokens/i18n.d.ts +7 -7
  227. package/tokens/icon-resolver.d.ts +1 -5
  228. package/tokens/icons.d.ts +0 -4
  229. package/tokens/index.d.ts +1 -4
  230. package/tokens/number-format.d.ts +2 -3
  231. package/tokens/validation-errors.d.ts +4 -0
  232. package/types/index.d.ts +0 -3
  233. package/types/point.d.ts +1 -1
  234. package/types/size.d.ts +0 -11
  235. package/utils/format/index.d.ts +0 -1
  236. package/utils/miscellaneous/font-scaling.d.ts +2 -1
  237. package/utils/miscellaneous/get-duration.d.ts +2 -0
  238. package/utils/miscellaneous/index.d.ts +2 -1
  239. package/utils/miscellaneous/provide-taiga.d.ts +13 -0
  240. package/animations/animations.d.ts +0 -109
  241. package/animations/index.d.ts +0 -1
  242. package/components/alert/alert.component.d.ts +0 -15
  243. package/components/alert/alert.directive.d.ts +0 -7
  244. package/components/alert/alert.interfaces.d.ts +0 -12
  245. package/components/alert/alert.service.d.ts +0 -7
  246. package/components/alert/alert.tokens.d.ts +0 -12
  247. package/components/alert/alerts.component.d.ts +0 -12
  248. package/components/alert/index.d.ts +0 -6
  249. package/components/data-list/data-list.directive.d.ts +0 -7
  250. package/components/data-list/option/option-content.d.ts +0 -16
  251. package/components/data-list/option/option-legacy.component.d.ts +0 -24
  252. package/components/data-list/option/option.directive.d.ts +0 -27
  253. package/components/dialog/dialog.component.d.ts +0 -20
  254. package/components/dialog/dialog.directive.d.ts +0 -7
  255. package/components/dialog/dialog.interfaces.d.ts +0 -34
  256. package/components/dialog/dialog.service.d.ts +0 -7
  257. package/components/dialog/dialog.tokens.d.ts +0 -15
  258. package/components/dialog/dialogs.component.d.ts +0 -8
  259. package/components/dialog/index.d.ts +0 -8
  260. package/components/expand/expand-content.directive.d.ts +0 -8
  261. package/components/expand/expand.d.ts +0 -6
  262. package/components/fullscreen/fullscreen.component.d.ts +0 -14
  263. package/components/fullscreen/index.d.ts +0 -1
  264. package/components/link/link.options.d.ts +0 -12
  265. package/components/textfield/select.directive.d.ts +0 -19
  266. package/components/textfield/textfield-dropdown.directive.d.ts +0 -16
  267. package/components/textfield/textfield.directive.d.ts +0 -38
  268. package/directives/dropdown/dropdown-open-legacy.directive.d.ts +0 -12
  269. package/directives/dropdown/dropdown-open.directive.d.ts +0 -33
  270. package/directives/dropdown/dropdown-portal.directive.d.ts +0 -14
  271. package/directives/dropdown/dropdown.service.d.ts +0 -6
  272. package/directives/dropdown/dropdowns.component.d.ts +0 -9
  273. package/directives/hint/hint.component.d.ts +0 -30
  274. package/directives/hint/hint.directive.d.ts +0 -26
  275. package/directives/hint/hint.service.d.ts +0 -13
  276. package/directives/hint/hints.component.d.ts +0 -12
  277. package/directives/popup/popup.directive.d.ts +0 -11
  278. package/directives/surface/index.d.ts +0 -1
  279. package/directives/surface/surface.directive.d.ts +0 -8
  280. package/esm2022/animations/animations.mjs +0 -363
  281. package/esm2022/animations/index.mjs +0 -2
  282. package/esm2022/animations/taiga-ui-core-animations.mjs +0 -5
  283. package/esm2022/classes/accessors.mjs +0 -31
  284. package/esm2022/classes/driver.mjs +0 -36
  285. package/esm2022/classes/index.mjs +0 -4
  286. package/esm2022/classes/taiga-ui-core-classes.mjs +0 -5
  287. package/esm2022/classes/vehicle.mjs +0 -7
  288. package/esm2022/components/alert/alert.component.mjs +0 -43
  289. package/esm2022/components/alert/alert.directive.mjs +0 -21
  290. package/esm2022/components/alert/alert.interfaces.mjs +0 -2
  291. package/esm2022/components/alert/alert.service.mjs +0 -18
  292. package/esm2022/components/alert/alert.tokens.mjs +0 -51
  293. package/esm2022/components/alert/alerts.component.mjs +0 -33
  294. package/esm2022/components/alert/index.mjs +0 -6
  295. package/esm2022/components/alert/taiga-ui-core-components-alert.mjs +0 -5
  296. package/esm2022/components/button/button.directive.mjs +0 -43
  297. package/esm2022/components/button/button.options.mjs +0 -7
  298. package/esm2022/components/button/index.mjs +0 -3
  299. package/esm2022/components/button/taiga-ui-core-components-button.mjs +0 -5
  300. package/esm2022/components/calendar/calendar-sheet.component.mjs +0 -168
  301. package/esm2022/components/calendar/calendar-sheet.options.mjs +0 -12
  302. package/esm2022/components/calendar/calendar-spin.component.mjs +0 -53
  303. package/esm2022/components/calendar/calendar-year.component.mjs +0 -128
  304. package/esm2022/components/calendar/calendar.component.mjs +0 -147
  305. package/esm2022/components/calendar/index.mjs +0 -6
  306. package/esm2022/components/calendar/taiga-ui-core-components-calendar.mjs +0 -5
  307. package/esm2022/components/data-list/data-list.component.mjs +0 -139
  308. package/esm2022/components/data-list/data-list.directive.mjs +0 -19
  309. package/esm2022/components/data-list/data-list.mjs +0 -14
  310. package/esm2022/components/data-list/data-list.tokens.mjs +0 -18
  311. package/esm2022/components/data-list/index.mjs +0 -9
  312. package/esm2022/components/data-list/opt-group.directive.mjs +0 -21
  313. package/esm2022/components/data-list/option/option-content.mjs +0 -36
  314. package/esm2022/components/data-list/option/option-legacy.component.mjs +0 -90
  315. package/esm2022/components/data-list/option/option.directive.mjs +0 -109
  316. package/esm2022/components/data-list/taiga-ui-core-components-data-list.mjs +0 -5
  317. package/esm2022/components/dialog/dialog-close.service.mjs +0 -41
  318. package/esm2022/components/dialog/dialog.component.mjs +0 -63
  319. package/esm2022/components/dialog/dialog.directive.mjs +0 -21
  320. package/esm2022/components/dialog/dialog.factory.mjs +0 -15
  321. package/esm2022/components/dialog/dialog.interfaces.mjs +0 -2
  322. package/esm2022/components/dialog/dialog.service.mjs +0 -18
  323. package/esm2022/components/dialog/dialog.tokens.mjs +0 -33
  324. package/esm2022/components/dialog/dialogs.component.mjs +0 -29
  325. package/esm2022/components/dialog/index.mjs +0 -8
  326. package/esm2022/components/dialog/taiga-ui-core-components-dialog.mjs +0 -5
  327. package/esm2022/components/error/error.component.mjs +0 -34
  328. package/esm2022/components/error/index.mjs +0 -2
  329. package/esm2022/components/error/taiga-ui-core-components-error.mjs +0 -5
  330. package/esm2022/components/expand/expand-content.directive.mjs +0 -18
  331. package/esm2022/components/expand/expand.component.mjs +0 -124
  332. package/esm2022/components/expand/expand.mjs +0 -7
  333. package/esm2022/components/expand/index.mjs +0 -4
  334. package/esm2022/components/expand/taiga-ui-core-components-expand.mjs +0 -5
  335. package/esm2022/components/fullscreen/fullscreen.component.mjs +0 -67
  336. package/esm2022/components/fullscreen/index.mjs +0 -2
  337. package/esm2022/components/fullscreen/taiga-ui-core-components-fullscreen.mjs +0 -5
  338. package/esm2022/components/icon/icon.component.mjs +0 -44
  339. package/esm2022/components/icon/icon.pipe.mjs +0 -19
  340. package/esm2022/components/icon/index.mjs +0 -3
  341. package/esm2022/components/icon/taiga-ui-core-components-icon.mjs +0 -5
  342. package/esm2022/components/index.mjs +0 -18
  343. package/esm2022/components/label/index.mjs +0 -2
  344. package/esm2022/components/label/label.directive.mjs +0 -41
  345. package/esm2022/components/label/taiga-ui-core-components-label.mjs +0 -5
  346. package/esm2022/components/link/index.mjs +0 -3
  347. package/esm2022/components/link/link.directive.mjs +0 -47
  348. package/esm2022/components/link/link.options.mjs +0 -13
  349. package/esm2022/components/link/taiga-ui-core-components-link.mjs +0 -5
  350. package/esm2022/components/loader/index.mjs +0 -3
  351. package/esm2022/components/loader/loader.component.mjs +0 -46
  352. package/esm2022/components/loader/loader.options.mjs +0 -18
  353. package/esm2022/components/loader/taiga-ui-core-components-loader.mjs +0 -5
  354. package/esm2022/components/notification/index.mjs +0 -3
  355. package/esm2022/components/notification/notification.directive.mjs +0 -81
  356. package/esm2022/components/notification/notification.options.mjs +0 -23
  357. package/esm2022/components/notification/taiga-ui-core-components-notification.mjs +0 -5
  358. package/esm2022/components/root/index.mjs +0 -2
  359. package/esm2022/components/root/root.component.mjs +0 -85
  360. package/esm2022/components/root/taiga-ui-core-components-root.mjs +0 -5
  361. package/esm2022/components/scrollbar/index.mjs +0 -9
  362. package/esm2022/components/scrollbar/scroll-controls.component.mjs +0 -32
  363. package/esm2022/components/scrollbar/scroll-into-view.directive.mjs +0 -43
  364. package/esm2022/components/scrollbar/scroll-ref.directive.mjs +0 -19
  365. package/esm2022/components/scrollbar/scrollable.directive.mjs +0 -26
  366. package/esm2022/components/scrollbar/scrollbar.component.mjs +0 -72
  367. package/esm2022/components/scrollbar/scrollbar.directive.mjs +0 -93
  368. package/esm2022/components/scrollbar/scrollbar.options.mjs +0 -6
  369. package/esm2022/components/scrollbar/scrollbar.service.mjs +0 -46
  370. package/esm2022/components/scrollbar/taiga-ui-core-components-scrollbar.mjs +0 -5
  371. package/esm2022/components/spin-button/index.mjs +0 -2
  372. package/esm2022/components/spin-button/spin-button.component.mjs +0 -51
  373. package/esm2022/components/spin-button/taiga-ui-core-components-spin-button.mjs +0 -5
  374. package/esm2022/components/taiga-ui-core-components.mjs +0 -5
  375. package/esm2022/components/textfield/index.mjs +0 -16
  376. package/esm2022/components/textfield/select-like.directive.mjs +0 -42
  377. package/esm2022/components/textfield/select.directive.mjs +0 -64
  378. package/esm2022/components/textfield/taiga-ui-core-components-textfield.mjs +0 -5
  379. package/esm2022/components/textfield/textfield-accessor.mjs +0 -7
  380. package/esm2022/components/textfield/textfield-auxiliary.mjs +0 -7
  381. package/esm2022/components/textfield/textfield-content.directive.mjs +0 -22
  382. package/esm2022/components/textfield/textfield-dropdown.directive.mjs +0 -43
  383. package/esm2022/components/textfield/textfield-icon.mjs +0 -10
  384. package/esm2022/components/textfield/textfield-multi/textfield-item.component.mjs +0 -34
  385. package/esm2022/components/textfield/textfield-multi/textfield-multi.component.mjs +0 -137
  386. package/esm2022/components/textfield/textfield.component.mjs +0 -180
  387. package/esm2022/components/textfield/textfield.directive.mjs +0 -134
  388. package/esm2022/components/textfield/textfield.mjs +0 -19
  389. package/esm2022/components/textfield/textfield.options.mjs +0 -63
  390. package/esm2022/components/textfield/with-native-picker.directive.mjs +0 -24
  391. package/esm2022/directives/appearance/appearance.bindings.mjs +0 -15
  392. package/esm2022/directives/appearance/appearance.directive.mjs +0 -79
  393. package/esm2022/directives/appearance/appearance.options.mjs +0 -12
  394. package/esm2022/directives/appearance/index.mjs +0 -5
  395. package/esm2022/directives/appearance/taiga-ui-core-directives-appearance.mjs +0 -5
  396. package/esm2022/directives/appearance/with-appearance.mjs +0 -27
  397. package/esm2022/directives/date-format/date-format.directive.mjs +0 -31
  398. package/esm2022/directives/date-format/index.mjs +0 -2
  399. package/esm2022/directives/date-format/taiga-ui-core-directives-date-format.mjs +0 -5
  400. package/esm2022/directives/dropdown/dropdown-context.directive.mjs +0 -76
  401. package/esm2022/directives/dropdown/dropdown-hover.directive.mjs +0 -70
  402. package/esm2022/directives/dropdown/dropdown-hover.options.mjs +0 -17
  403. package/esm2022/directives/dropdown/dropdown-limit-width.mjs +0 -37
  404. package/esm2022/directives/dropdown/dropdown-manual.directive.mjs +0 -27
  405. package/esm2022/directives/dropdown/dropdown-open-legacy.directive.mjs +0 -33
  406. package/esm2022/directives/dropdown/dropdown-open.directive.mjs +0 -169
  407. package/esm2022/directives/dropdown/dropdown-options.directive.mjs +0 -73
  408. package/esm2022/directives/dropdown/dropdown-portal.directive.mjs +0 -34
  409. package/esm2022/directives/dropdown/dropdown-position-sided.directive.mjs +0 -69
  410. package/esm2022/directives/dropdown/dropdown-position.directive.mjs +0 -88
  411. package/esm2022/directives/dropdown/dropdown-selection.directive.mjs +0 -159
  412. package/esm2022/directives/dropdown/dropdown.bindings.mjs +0 -19
  413. package/esm2022/directives/dropdown/dropdown.component.mjs +0 -92
  414. package/esm2022/directives/dropdown/dropdown.directive.mjs +0 -110
  415. package/esm2022/directives/dropdown/dropdown.driver.mjs +0 -32
  416. package/esm2022/directives/dropdown/dropdown.mjs +0 -29
  417. package/esm2022/directives/dropdown/dropdown.providers.mjs +0 -10
  418. package/esm2022/directives/dropdown/dropdown.service.mjs +0 -15
  419. package/esm2022/directives/dropdown/dropdowns.component.mjs +0 -24
  420. package/esm2022/directives/dropdown/index.mjs +0 -22
  421. package/esm2022/directives/dropdown/taiga-ui-core-directives-dropdown.mjs +0 -5
  422. package/esm2022/directives/dropdown/with-dropdown-open.directive.mjs +0 -23
  423. package/esm2022/directives/group/group.directive.mjs +0 -53
  424. package/esm2022/directives/group/group.options.mjs +0 -15
  425. package/esm2022/directives/group/index.mjs +0 -3
  426. package/esm2022/directives/group/taiga-ui-core-directives-group.mjs +0 -5
  427. package/esm2022/directives/hint/hint-describe.directive.mjs +0 -50
  428. package/esm2022/directives/hint/hint-driver.directive.mjs +0 -19
  429. package/esm2022/directives/hint/hint-host.directive.mjs +0 -27
  430. package/esm2022/directives/hint/hint-hover.directive.mjs +0 -59
  431. package/esm2022/directives/hint/hint-manual.directive.mjs +0 -33
  432. package/esm2022/directives/hint/hint-options.directive.mjs +0 -86
  433. package/esm2022/directives/hint/hint-overflow.directive.mjs +0 -38
  434. package/esm2022/directives/hint/hint-pointer.directive.mjs +0 -33
  435. package/esm2022/directives/hint/hint-position.directive.mjs +0 -112
  436. package/esm2022/directives/hint/hint-unstyled.component.mjs +0 -39
  437. package/esm2022/directives/hint/hint.component.mjs +0 -127
  438. package/esm2022/directives/hint/hint.directive.mjs +0 -99
  439. package/esm2022/directives/hint/hint.mjs +0 -27
  440. package/esm2022/directives/hint/hint.providers.mjs +0 -9
  441. package/esm2022/directives/hint/hint.service.mjs +0 -29
  442. package/esm2022/directives/hint/hints.component.mjs +0 -34
  443. package/esm2022/directives/hint/index.mjs +0 -17
  444. package/esm2022/directives/hint/taiga-ui-core-directives-hint.mjs +0 -5
  445. package/esm2022/directives/icons/icons.directive.mjs +0 -66
  446. package/esm2022/directives/icons/index.mjs +0 -3
  447. package/esm2022/directives/icons/taiga-ui-core-directives-icons.mjs +0 -5
  448. package/esm2022/directives/icons/with-icons.mjs +0 -22
  449. package/esm2022/directives/index.mjs +0 -12
  450. package/esm2022/directives/items-handlers/index.mjs +0 -4
  451. package/esm2022/directives/items-handlers/items-handlers.directive.mjs +0 -63
  452. package/esm2022/directives/items-handlers/items-handlers.tokens.mjs +0 -27
  453. package/esm2022/directives/items-handlers/items-handlers.validator.mjs +0 -32
  454. package/esm2022/directives/items-handlers/taiga-ui-core-directives-items-handlers.mjs +0 -5
  455. package/esm2022/directives/number-format/index.mjs +0 -2
  456. package/esm2022/directives/number-format/number-format.directive.mjs +0 -31
  457. package/esm2022/directives/number-format/taiga-ui-core-directives-number-format.mjs +0 -5
  458. package/esm2022/directives/popup/index.mjs +0 -4
  459. package/esm2022/directives/popup/popup.directive.mjs +0 -31
  460. package/esm2022/directives/popup/popup.service.mjs +0 -15
  461. package/esm2022/directives/popup/popups.component.mjs +0 -20
  462. package/esm2022/directives/popup/taiga-ui-core-directives-popup.mjs +0 -5
  463. package/esm2022/directives/surface/index.mjs +0 -2
  464. package/esm2022/directives/surface/surface.directive.mjs +0 -44
  465. package/esm2022/directives/surface/taiga-ui-core-directives-surface.mjs +0 -5
  466. package/esm2022/directives/taiga-ui-core-directives.mjs +0 -5
  467. package/esm2022/directives/title/index.mjs +0 -2
  468. package/esm2022/directives/title/taiga-ui-core-directives-title.mjs +0 -5
  469. package/esm2022/directives/title/title.directive.mjs +0 -37
  470. package/esm2022/index.mjs +0 -9
  471. package/esm2022/pipes/auto-color/auto-color.pipe.mjs +0 -19
  472. package/esm2022/pipes/auto-color/index.mjs +0 -2
  473. package/esm2022/pipes/auto-color/taiga-ui-core-pipes-auto-color.mjs +0 -5
  474. package/esm2022/pipes/calendar-sheet/calendar-sheet.pipe.mjs +0 -54
  475. package/esm2022/pipes/calendar-sheet/index.mjs +0 -2
  476. package/esm2022/pipes/calendar-sheet/taiga-ui-core-pipes-calendar-sheet.mjs +0 -5
  477. package/esm2022/pipes/calendar-sheet/utils.mjs +0 -36
  478. package/esm2022/pipes/fallback-src/fallback-src.pipe.mjs +0 -23
  479. package/esm2022/pipes/fallback-src/index.mjs +0 -2
  480. package/esm2022/pipes/fallback-src/taiga-ui-core-pipes-fallback-src.mjs +0 -5
  481. package/esm2022/pipes/flag/flag.pipe.mjs +0 -26
  482. package/esm2022/pipes/flag/index.mjs +0 -2
  483. package/esm2022/pipes/flag/taiga-ui-core-pipes-flag.mjs +0 -5
  484. package/esm2022/pipes/format-date/format-date.pipe.mjs +0 -22
  485. package/esm2022/pipes/format-date/index.mjs +0 -2
  486. package/esm2022/pipes/format-date/taiga-ui-core-pipes-format-date.mjs +0 -5
  487. package/esm2022/pipes/format-number/format-number.pipe.mjs +0 -36
  488. package/esm2022/pipes/format-number/index.mjs +0 -2
  489. package/esm2022/pipes/format-number/taiga-ui-core-pipes-format-number.mjs +0 -5
  490. package/esm2022/pipes/index.mjs +0 -10
  491. package/esm2022/pipes/initials/index.mjs +0 -2
  492. package/esm2022/pipes/initials/initials.pipe.mjs +0 -23
  493. package/esm2022/pipes/initials/taiga-ui-core-pipes-initials.mjs +0 -5
  494. package/esm2022/pipes/month/index.mjs +0 -2
  495. package/esm2022/pipes/month/month.pipe.mjs +0 -23
  496. package/esm2022/pipes/month/taiga-ui-core-pipes-month.mjs +0 -5
  497. package/esm2022/pipes/order-week-days/index.mjs +0 -2
  498. package/esm2022/pipes/order-week-days/order-week-days.pipe.mjs +0 -30
  499. package/esm2022/pipes/order-week-days/taiga-ui-core-pipes-order-week-days.mjs +0 -5
  500. package/esm2022/pipes/taiga-ui-core-pipes.mjs +0 -5
  501. package/esm2022/services/breakpoint.service.mjs +0 -31
  502. package/esm2022/services/dark-theme.service.mjs +0 -24
  503. package/esm2022/services/format-date.service.mjs +0 -24
  504. package/esm2022/services/index.mjs +0 -6
  505. package/esm2022/services/position.service.mjs +0 -26
  506. package/esm2022/services/taiga-ui-core-services.mjs +0 -5
  507. package/esm2022/services/visual-viewport.service.mjs +0 -29
  508. package/esm2022/taiga-ui-core.mjs +0 -5
  509. package/esm2022/tokens/animations-speed.mjs +0 -9
  510. package/esm2022/tokens/assets-path.mjs +0 -11
  511. package/esm2022/tokens/auxiliary.mjs +0 -9
  512. package/esm2022/tokens/common-icons.mjs +0 -18
  513. package/esm2022/tokens/dark-mode.mjs +0 -41
  514. package/esm2022/tokens/date-format.mjs +0 -20
  515. package/esm2022/tokens/day-type-handler.mjs +0 -8
  516. package/esm2022/tokens/first-day-of-week.mjs +0 -9
  517. package/esm2022/tokens/i18n.mjs +0 -45
  518. package/esm2022/tokens/icon-resolver.mjs +0 -44
  519. package/esm2022/tokens/icon.mjs +0 -8
  520. package/esm2022/tokens/icons.mjs +0 -21
  521. package/esm2022/tokens/index.mjs +0 -21
  522. package/esm2022/tokens/media.mjs +0 -12
  523. package/esm2022/tokens/number-format.mjs +0 -24
  524. package/esm2022/tokens/reduced-motion.mjs +0 -7
  525. package/esm2022/tokens/scroll-ref.mjs +0 -6
  526. package/esm2022/tokens/selection-stream.mjs +0 -14
  527. package/esm2022/tokens/spin-icons.mjs +0 -8
  528. package/esm2022/tokens/taiga-ui-core-tokens.mjs +0 -5
  529. package/esm2022/tokens/theme.mjs +0 -5
  530. package/esm2022/tokens/viewport.mjs +0 -35
  531. package/esm2022/types/direction.mjs +0 -2
  532. package/esm2022/types/index.mjs +0 -2
  533. package/esm2022/types/interactive-state.mjs +0 -2
  534. package/esm2022/types/orientation.mjs +0 -2
  535. package/esm2022/types/point.mjs +0 -2
  536. package/esm2022/types/portal-item.mjs +0 -2
  537. package/esm2022/types/range-state.mjs +0 -2
  538. package/esm2022/types/size.mjs +0 -13
  539. package/esm2022/types/taiga-ui-core-types.mjs +0 -5
  540. package/esm2022/types/value-content-context.mjs +0 -2
  541. package/esm2022/utils/dom/check-fixed-position.mjs +0 -9
  542. package/esm2022/utils/dom/get-viewport.mjs +0 -24
  543. package/esm2022/utils/dom/get-word-range.mjs +0 -51
  544. package/esm2022/utils/dom/index.mjs +0 -4
  545. package/esm2022/utils/dom/taiga-ui-core-utils-dom.mjs +0 -5
  546. package/esm2022/utils/format/format-number.mjs +0 -47
  547. package/esm2022/utils/format/get-fractional-part-padded.mjs +0 -16
  548. package/esm2022/utils/format/index.mjs +0 -5
  549. package/esm2022/utils/format/number-to-string-without-exp.mjs +0 -18
  550. package/esm2022/utils/format/string-hash-to-hsl.mjs +0 -21
  551. package/esm2022/utils/format/taiga-ui-core-utils-format.mjs +0 -5
  552. package/esm2022/utils/index.mjs +0 -4
  553. package/esm2022/utils/miscellaneous/font-scaling.mjs +0 -11
  554. package/esm2022/utils/miscellaneous/index.mjs +0 -7
  555. package/esm2022/utils/miscellaneous/is-editing-key.mjs +0 -18
  556. package/esm2022/utils/miscellaneous/is-obscured.mjs +0 -8
  557. package/esm2022/utils/miscellaneous/override-options.mjs +0 -11
  558. package/esm2022/utils/miscellaneous/size-bigger.mjs +0 -19
  559. package/esm2022/utils/miscellaneous/taiga-ui-core-utils-miscellaneous.mjs +0 -5
  560. package/esm2022/utils/miscellaneous/to-animation-options.mjs +0 -16
  561. package/esm2022/utils/taiga-ui-core-utils.mjs +0 -5
  562. package/fesm2022/taiga-ui-core-animations.mjs +0 -370
  563. package/fesm2022/taiga-ui-core-animations.mjs.map +0 -1
  564. package/fesm2022/taiga-ui-core-components-alert.mjs +0 -149
  565. package/fesm2022/taiga-ui-core-components-alert.mjs.map +0 -1
  566. package/fesm2022/taiga-ui-core-components-dialog.mjs +0 -196
  567. package/fesm2022/taiga-ui-core-components-dialog.mjs.map +0 -1
  568. package/fesm2022/taiga-ui-core-components-fullscreen.mjs +0 -73
  569. package/fesm2022/taiga-ui-core-components-fullscreen.mjs.map +0 -1
  570. package/fesm2022/taiga-ui-core-directives-dropdown.mjs.map +0 -1
  571. package/fesm2022/taiga-ui-core-directives-hint.mjs +0 -710
  572. package/fesm2022/taiga-ui-core-directives-hint.mjs.map +0 -1
  573. package/fesm2022/taiga-ui-core-directives-popup.mjs +0 -63
  574. package/fesm2022/taiga-ui-core-directives-popup.mjs.map +0 -1
  575. package/fesm2022/taiga-ui-core-directives-surface.mjs +0 -50
  576. package/fesm2022/taiga-ui-core-directives-surface.mjs.map +0 -1
  577. package/fesm2022/taiga-ui-core-directives-title.mjs +0 -43
  578. package/fesm2022/taiga-ui-core-directives-title.mjs.map +0 -1
  579. package/fesm2022/taiga-ui-core-pipes-auto-color.mjs +0 -25
  580. package/fesm2022/taiga-ui-core-pipes-auto-color.mjs.map +0 -1
  581. package/fesm2022/taiga-ui-core-pipes-calendar-sheet.mjs +0 -94
  582. package/fesm2022/taiga-ui-core-pipes-calendar-sheet.mjs.map +0 -1
  583. package/fesm2022/taiga-ui-core-pipes-fallback-src.mjs +0 -29
  584. package/fesm2022/taiga-ui-core-pipes-fallback-src.mjs.map +0 -1
  585. package/fesm2022/taiga-ui-core-pipes-flag.mjs +0 -32
  586. package/fesm2022/taiga-ui-core-pipes-flag.mjs.map +0 -1
  587. package/fesm2022/taiga-ui-core-pipes-format-date.mjs +0 -28
  588. package/fesm2022/taiga-ui-core-pipes-format-date.mjs.map +0 -1
  589. package/fesm2022/taiga-ui-core-pipes-initials.mjs +0 -29
  590. package/fesm2022/taiga-ui-core-pipes-initials.mjs.map +0 -1
  591. package/fesm2022/taiga-ui-core-pipes-month.mjs +0 -29
  592. package/fesm2022/taiga-ui-core-pipes-month.mjs.map +0 -1
  593. package/fesm2022/taiga-ui-core-pipes-order-week-days.mjs +0 -36
  594. package/fesm2022/taiga-ui-core-pipes-order-week-days.mjs.map +0 -1
  595. package/pipes/auto-color/auto-color.pipe.d.ts +0 -7
  596. package/pipes/auto-color/index.d.ts +0 -1
  597. package/pipes/calendar-sheet/index.d.ts +0 -1
  598. package/pipes/calendar-sheet/utils.d.ts +0 -20
  599. package/pipes/fallback-src/fallback-src.pipe.d.ts +0 -9
  600. package/pipes/fallback-src/index.d.ts +0 -1
  601. package/pipes/flag/flag.pipe.d.ts +0 -14
  602. package/pipes/flag/index.d.ts +0 -1
  603. package/pipes/format-date/format-date.pipe.d.ts +0 -9
  604. package/pipes/format-date/index.d.ts +0 -1
  605. package/pipes/initials/index.d.ts +0 -1
  606. package/pipes/initials/initials.pipe.d.ts +0 -7
  607. package/pipes/month/index.d.ts +0 -1
  608. package/pipes/month/month.pipe.d.ts +0 -10
  609. package/pipes/order-week-days/index.d.ts +0 -1
  610. package/services/dark-theme.service.d.ts +0 -10
  611. package/services/format-date.service.d.ts +0 -8
  612. package/styles/mixins/wrapper.less +0 -64
  613. package/styles/mixins/wrapper.scss +0 -61
  614. package/styles/theme/appearance/opposite.less +0 -17
  615. package/styles/theme/wrapper.less +0 -211
  616. package/tokens/day-type-handler.d.ts +0 -7
  617. package/tokens/first-day-of-week.d.ts +0 -5
  618. package/tokens/scroll-ref.d.ts +0 -2
  619. package/tokens/spin-icons.d.ts +0 -6
  620. package/types/portal-item.d.ts +0 -9
  621. package/types/range-state.d.ts +0 -4
  622. package/types/value-content-context.d.ts +0 -4
  623. package/utils/format/string-hash-to-hsl.d.ts +0 -6
  624. package/utils/miscellaneous/to-animation-options.d.ts +0 -4
  625. /package/{directives → components}/title/index.d.ts +0 -0
  626. /package/{directives → portals}/dropdown/dropdown-context.directive.d.ts +0 -0
  627. /package/{directives → portals}/dropdown/dropdown-limit-width.d.ts +0 -0
  628. /package/{directives → portals}/dropdown/dropdown-options.directive.d.ts +0 -0
  629. /package/{directives → portals}/dropdown/dropdown.component.d.ts +0 -0
  630. /package/{directives → portals}/dropdown/dropdown.driver.d.ts +0 -0
  631. /package/{directives → portals}/dropdown/dropdown.providers.d.ts +0 -0
  632. /package/{directives → portals}/dropdown/with-dropdown-open.directive.d.ts +0 -0
  633. /package/{directives → portals}/hint/hint-driver.directive.d.ts +0 -0
  634. /package/{directives → portals}/hint/hint-pointer.directive.d.ts +0 -0
  635. /package/{directives → portals}/hint/hint.d.ts +0 -0
  636. /package/{directives → portals}/hint/hint.providers.d.ts +0 -0
  637. /package/{directives → portals}/popup/index.d.ts +0 -0
@@ -1,39 +1,33 @@
1
1
  import * as i0 from '@angular/core';
2
- import { inject, Directive, InjectionToken, signal, Optional, SkipSelf, Input, TemplateRef, PLATFORM_ID, computed, ElementRef, ViewContainerRef, ViewChild, ContentChild, forwardRef, ContentChildren, Component, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core';
2
+ import { inject, Directive, InjectionToken, signal, Optional, SkipSelf, input, viewChild, contentChild, forwardRef, ElementRef, computed, ViewContainerRef, contentChildren, afterNextRender, ChangeDetectionStrategy, ViewEncapsulation, Component, TemplateRef } from '@angular/core';
3
3
  import { TUI_IS_ANDROID } from '@taiga-ui/cdk/tokens';
4
4
  import { tuiInjectElement, tuiValue, tuiIsElement } from '@taiga-ui/cdk/utils/dom';
5
5
  import { TuiItem } from '@taiga-ui/cdk/directives/item';
6
6
  import { TuiLabel } from '@taiga-ui/core/components/label';
7
- import { isPlatformBrowser, AsyncPipe, NgIf, DOCUMENT, NgFor, NgForOf } from '@angular/common';
8
- import { WA_NAVIGATOR } from '@ng-web-apis/common';
9
- import * as i1$1 from '@taiga-ui/cdk/directives/native-validator';
10
- import { TuiNativeValidator } from '@taiga-ui/cdk/directives/native-validator';
11
- import * as i2$1 from '@taiga-ui/core/directives/appearance';
12
- import { tuiAppearance, tuiAppearanceState, tuiAppearanceMode, tuiAppearanceFocus, TuiAppearance } from '@taiga-ui/core/directives/appearance';
7
+ import * as i1 from '@taiga-ui/core/portals/dropdown';
8
+ import { TuiDropdownDirective, TuiDropdownOpen, TuiDropdownFixed, TuiWithDropdownOpen, TuiDropdownContent } from '@taiga-ui/core/portals/dropdown';
9
+ import { AsyncPipe } from '@angular/common';
13
10
  import { NgControl } from '@angular/forms';
14
- import { tuiProvide, tuiPx, tuiArrayToggle, tuiDirectiveBinding } from '@taiga-ui/cdk/utils/miscellaneous';
15
- import * as i3 from '@taiga-ui/core/directives/items-handlers';
16
- import { TuiWithItemsHandlers, TUI_ITEMS_HANDLERS } from '@taiga-ui/core/directives/items-handlers';
17
- import { toSignal, takeUntilDestroyed } from '@angular/core/rxjs-interop';
18
11
  import { WaResizeObserver } from '@ng-web-apis/resize-observer';
19
- import { TuiControl } from '@taiga-ui/cdk/classes';
20
- import { EMPTY_QUERY } from '@taiga-ui/cdk/constants';
21
- import { tuiQueryListChanges, tuiZonefree } from '@taiga-ui/cdk/observables';
22
- import { tuiInjectId } from '@taiga-ui/cdk/services';
23
12
  import { tuiFocusedIn } from '@taiga-ui/cdk/utils/focus';
24
- import { tuiButtonOptionsProvider, TuiButton } from '@taiga-ui/core/components/button';
13
+ import { tuiGenerateId, tuiPx, tuiArrayToggle } from '@taiga-ui/cdk/utils/miscellaneous';
14
+ import { TuiButton, tuiButtonOptionsProvider } from '@taiga-ui/core/components/button';
25
15
  import * as i4 from '@taiga-ui/core/components/data-list';
26
16
  import { tuiAsDataListHost, TuiWithOptionContent } from '@taiga-ui/core/components/data-list';
27
- import * as i1 from '@taiga-ui/core/directives/dropdown';
28
- import { TuiDropdownDirective, tuiDropdownOpen, TuiDropdownOpen, TuiDropdownFixed, TuiWithDropdownOpen } from '@taiga-ui/core/directives/dropdown';
29
17
  import * as i2 from '@taiga-ui/core/directives/icons';
30
- import { TuiWithIcons, TuiIcons } from '@taiga-ui/core/directives/icons';
31
- import { TUI_COMMON_ICONS, TUI_CLEAR_WORD, TUI_AUXILIARY, TUI_SCROLL_REF } from '@taiga-ui/core/tokens';
18
+ import { TuiWithIcons, tuiIconEnd } from '@taiga-ui/core/directives/icons';
19
+ import * as i3 from '@taiga-ui/core/directives/items-handlers';
20
+ import { TuiWithItemsHandlers, TUI_ITEMS_HANDLERS } from '@taiga-ui/core/directives/items-handlers';
21
+ import { TUI_COMMON_ICONS, TUI_CLEAR_WORD, TUI_AUXILIARY } from '@taiga-ui/core/tokens';
32
22
  import { PolymorpheusOutlet, injectContext, PolymorpheusComponent } from '@taiga-ui/polymorpheus';
33
- import { ReplaySubject, take, switchMap, startWith, fromEvent, filter } from 'rxjs';
34
- import { TuiScrollControls } from '@taiga-ui/core/components/scrollbar';
35
- import * as i4$1 from '@taiga-ui/core/directives';
36
- import { TUI_ITEMS_HANDLERS as TUI_ITEMS_HANDLERS$1, TuiWithItemsHandlers as TuiWithItemsHandlers$1, TuiWithAppearance } from '@taiga-ui/core/directives';
23
+ import { tuiProvide } from '@taiga-ui/cdk/utils/di';
24
+ import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
25
+ import { TuiControl } from '@taiga-ui/cdk/classes';
26
+ import { tuiZonefree } from '@taiga-ui/cdk/observables';
27
+ import { TuiScrollControls, TUI_SCROLL_REF } from '@taiga-ui/core/components/scrollbar';
28
+ import * as i1$1 from '@taiga-ui/core/directives/appearance';
29
+ import { TuiWithAppearance } from '@taiga-ui/core/directives/appearance';
30
+ import { fromEvent, filter } from 'rxjs';
37
31
 
38
32
  class TuiSelectLike {
39
33
  constructor() {
@@ -50,13 +44,12 @@ class TuiSelectLike {
50
44
  event.preventDefault();
51
45
  this.el.focus();
52
46
  }
53
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiSelectLike, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
54
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TuiSelectLike, isStandalone: true, selector: "[tuiSelectLike]", host: { attributes: { "tuiSelectLike": "", "inputmode": "none", "spellcheck": "false", "autocomplete": "off" }, listeners: { "beforeinput": "$event.inputType.includes(\"delete\") || $event.preventDefault()", "input.capture": "$event.inputType?.includes(\"delete\") && clear()", "mousedown": "prevent($event)" } }, ngImport: i0 }); }
47
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiSelectLike, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
48
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.17", type: TuiSelectLike, isStandalone: true, selector: "[tuiSelectLike]", host: { attributes: { "tuiSelectLike": "", "inputmode": "none", "spellcheck": "false", "autocomplete": "off" }, listeners: { "beforeinput": "$event.inputType.includes(\"delete\") || $event.preventDefault()", "input.capture": "$event.inputType?.includes(\"delete\") && clear()", "mousedown": "prevent($event)" } }, ngImport: i0 }); }
55
49
  }
56
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiSelectLike, decorators: [{
50
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiSelectLike, decorators: [{
57
51
  type: Directive,
58
52
  args: [{
59
- standalone: true,
60
53
  selector: '[tuiSelectLike]',
61
54
  host: {
62
55
  tuiSelectLike: '',
@@ -72,11 +65,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
72
65
  }]
73
66
  }] });
74
67
 
75
- const DEFAULT = {
76
- appearance: 'textfield',
77
- size: 'l',
78
- cleaner: true,
79
- };
68
+ const DEFAULT = { appearance: 'textfield', size: 'l', cleaner: true };
80
69
  const TUI_TEXTFIELD_OPTIONS = new InjectionToken(ngDevMode ? 'TUI_TEXTFIELD_OPTIONS' : '', {
81
70
  factory: () => ({
82
71
  appearance: signal(DEFAULT.appearance),
@@ -99,205 +88,112 @@ function tuiTextfieldOptionsProvider(options) {
99
88
  class TuiTextfieldOptionsDirective {
100
89
  constructor() {
101
90
  this.options = inject(TUI_TEXTFIELD_OPTIONS, { skipSelf: true });
102
- // TODO: refactor to signal inputs after Angular update
103
- this.appearance = signal(this.options.appearance());
104
- this.size = signal(this.options.size());
105
- this.cleaner = signal(this.options.cleaner());
106
- }
107
- set tuiTextfieldAppearance(appearance) {
108
- this.appearance.set(appearance);
109
- }
110
- set tuiTextfieldSize(size) {
111
- this.size.set(size);
112
- }
113
- set tuiTextfieldCleaner(enabled) {
114
- this.cleaner.set(enabled);
91
+ this.appearance = input(this.options.appearance(), {
92
+ alias: 'tuiTextfieldAppearance',
93
+ });
94
+ this.size = input(this.options.size(), {
95
+ alias: 'tuiTextfieldSize',
96
+ transform: (size) => size || DEFAULT.size,
97
+ });
98
+ this.cleaner = input(this.options.cleaner(), {
99
+ alias: 'tuiTextfieldCleaner',
100
+ });
115
101
  }
116
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTextfieldOptionsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
117
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TuiTextfieldOptionsDirective, isStandalone: true, selector: "[tuiTextfieldAppearance],[tuiTextfieldSize],[tuiTextfieldCleaner]", inputs: { tuiTextfieldAppearance: "tuiTextfieldAppearance", tuiTextfieldSize: "tuiTextfieldSize", tuiTextfieldCleaner: "tuiTextfieldCleaner" }, providers: [tuiProvide(TUI_TEXTFIELD_OPTIONS, TuiTextfieldOptionsDirective)], ngImport: i0 }); }
102
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiTextfieldOptionsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
103
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.17", type: TuiTextfieldOptionsDirective, isStandalone: true, selector: "[tuiTextfieldAppearance],[tuiTextfieldSize],[tuiTextfieldCleaner]", inputs: { appearance: { classPropertyName: "appearance", publicName: "tuiTextfieldAppearance", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "tuiTextfieldSize", isSignal: true, isRequired: false, transformFunction: null }, cleaner: { classPropertyName: "cleaner", publicName: "tuiTextfieldCleaner", isSignal: true, isRequired: false, transformFunction: null } }, providers: [tuiProvide(TUI_TEXTFIELD_OPTIONS, TuiTextfieldOptionsDirective)], ngImport: i0 }); }
118
104
  }
119
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTextfieldOptionsDirective, decorators: [{
105
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiTextfieldOptionsDirective, decorators: [{
120
106
  type: Directive,
121
107
  args: [{
122
- standalone: true,
123
108
  selector: '[tuiTextfieldAppearance],[tuiTextfieldSize],[tuiTextfieldCleaner]',
124
109
  providers: [tuiProvide(TUI_TEXTFIELD_OPTIONS, TuiTextfieldOptionsDirective)],
125
110
  }]
126
- }], propDecorators: { tuiTextfieldAppearance: [{
127
- type: Input
128
- }], tuiTextfieldSize: [{
129
- type: Input
130
- }], tuiTextfieldCleaner: [{
131
- type: Input
132
- }] } });
111
+ }] });
133
112
 
134
113
  const TUI_TEXTFIELD_ACCESSOR = new InjectionToken(ngDevMode ? 'TUI_TEXTFIELD_ACCESSOR' : '');
135
114
  function tuiAsTextfieldAccessor(accessor) {
136
115
  return tuiProvide(TUI_TEXTFIELD_ACCESSOR, accessor);
137
116
  }
138
117
 
139
- // TODO: Change selector to tuiDropdown in v5 and move to TuiDropdown
140
- class TuiTextfieldDropdownDirective {
141
- constructor() {
142
- this.directive = inject(TuiDropdownDirective);
143
- this.directive.tuiDropdown = inject(TemplateRef);
144
- if (isPlatformBrowser(inject(PLATFORM_ID)) &&
145
- this.directive.el.matches(':focus-within')) {
146
- this.directive.toggle(true);
147
- }
148
- }
149
- ngOnDestroy() {
150
- this.directive.tuiDropdown = null;
151
- }
152
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTextfieldDropdownDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
153
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TuiTextfieldDropdownDirective, isStandalone: true, selector: "ng-template[tuiTextfieldDropdown]", ngImport: i0 }); }
154
- }
155
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTextfieldDropdownDirective, decorators: [{
156
- type: Directive,
157
- args: [{
158
- standalone: true,
159
- selector: 'ng-template[tuiTextfieldDropdown]',
160
- }]
161
- }], ctorParameters: function () { return []; } });
162
- /**
163
- * @deprecated remove in v5
164
- */
165
- class TuiWithTextfieldDropdown {
166
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiWithTextfieldDropdown, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
167
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TuiWithTextfieldDropdown, isStandalone: true, ngImport: i0 }); }
168
- }
169
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiWithTextfieldDropdown, decorators: [{
170
- type: Directive,
171
- args: [{
172
- standalone: true,
173
- }]
174
- }] });
175
-
176
- // TODO: Remove base class in v5
177
- class TuiTextfieldBaseComponent {
118
+ class TuiTextfieldComponent {
178
119
  constructor() {
179
- // TODO: refactor to signal inputs after Angular update
180
- this.filler = signal('');
181
- this.autoId = tuiInjectId();
120
+ this.autoId = tuiGenerateId();
182
121
  this.focusedIn = tuiFocusedIn(tuiInjectElement());
183
- this.contentReady$ = new ReplaySubject(1);
184
- this.inputQuery = signal(undefined);
185
- this.auxiliaryQuery = EMPTY_QUERY;
186
- this.open = tuiDropdownOpen();
122
+ this.ghost = viewChild('ghost');
187
123
  this.dropdown = inject(TuiDropdownDirective);
188
- this.dropdownOpen = inject(TuiDropdownOpen);
124
+ this.open = inject(TuiDropdownOpen);
189
125
  this.icons = inject(TUI_COMMON_ICONS);
190
- this.clear = toSignal(inject(TUI_CLEAR_WORD));
126
+ this.clear = inject(TUI_CLEAR_WORD);
127
+ this.label = contentChild(forwardRef(() => TuiLabel), { read: ElementRef });
191
128
  this.computedFiller = computed((value = this.value()) => {
192
129
  const filler = value + this.filler().slice(value.length);
193
130
  return filler.length > value.length ? filler : '';
194
131
  });
195
132
  this.showFiller = computed(() => this.focused() &&
196
133
  !!this.computedFiller() &&
197
- (!!this.value() || !this.input?.nativeElement.placeholder));
198
- this.focused = computed(() => this.open() || this.focusedIn());
134
+ (!!this.value() || !this.input()?.nativeElement.placeholder));
135
+ this.accessor = contentChild(TUI_TEXTFIELD_ACCESSOR, { descendants: true });
136
+ this.vcr = viewChild('vcr', { read: ViewContainerRef });
137
+ this.control = contentChild(NgControl);
138
+ this.auxiliaries = contentChildren(TUI_AUXILIARY, { descendants: true });
139
+ this.focused = computed(() => this.open.open() || this.focusedIn());
199
140
  this.options = inject(TUI_TEXTFIELD_OPTIONS);
200
141
  this.el = tuiInjectElement();
201
- this.value = tuiValue(this.inputQuery);
202
- // TODO: Refactor to signal queries when Angular is updated
203
- this.auxiliaries = toSignal(this.contentReady$.pipe(take(1), switchMap(() => tuiQueryListChanges(this.auxiliaryQuery)), startWith([])), { requireSync: true });
204
- }
205
- set fillerSetter(filler) {
206
- this.filler.set(filler);
142
+ this.input = contentChild(TUI_TEXTFIELD_ACCESSOR, { read: ElementRef });
143
+ this.content = input();
144
+ this.filler = input('');
145
+ this.value = tuiValue(this.input);
146
+ // TODO: Replace with TuiTransitioned when fixed:
147
+ // https://github.com/angular/angular/issues/57846
148
+ afterNextRender(() => this.el.style.setProperty('transition', ''));
207
149
  }
208
150
  get id() {
209
- return this.input?.nativeElement.id || this.autoId;
151
+ return this.input()?.nativeElement.id || this.autoId;
210
152
  }
211
153
  get size() {
212
154
  return this.options.size();
213
155
  }
214
- ngAfterContentChecked() {
215
- this.contentReady$.next(true);
216
- this.inputQuery.set(this._input);
217
- }
218
156
  handleOption(option) {
219
- this.accessor?.setValue(option);
220
- this.open.set(false);
157
+ this.accessor()?.setValue(option);
158
+ this.open.open.set(false);
221
159
  }
222
160
  get hasLabel() {
223
- return Boolean(this.label?.nativeElement?.childNodes.length);
161
+ return Boolean(this.label()?.nativeElement?.childNodes.length);
224
162
  }
225
163
  onResize({ contentRect }) {
226
164
  this.el.style.setProperty('--t-side', tuiPx(contentRect.width));
227
165
  }
228
166
  // Click on ::before,::after pseudo-elements ([iconStart] / [iconEnd])
229
167
  onIconClick() {
230
- this.input?.nativeElement.focus();
231
- if (!this.dropdownOpen.tuiDropdownEnabled ||
232
- this.input?.nativeElement.matches('input:read-only,textarea:read-only')) {
168
+ this.input()?.nativeElement.focus();
169
+ if (!this.open.enabled() ||
170
+ this.input()?.nativeElement.matches('input:read-only,textarea:read-only')) {
233
171
  return;
234
172
  }
235
- this.open.update((open) => !open);
173
+ this.open.open.update((open) => !open);
236
174
  try {
237
- this.input?.nativeElement.showPicker?.();
175
+ this.input()?.nativeElement.showPicker?.();
238
176
  }
239
177
  catch {
240
178
  // Empty catch block - silently ignore showPicker errors
241
179
  }
242
180
  }
243
181
  onScroll(element) {
244
- if (this.input?.nativeElement === element) {
245
- this.ghost?.nativeElement.scrollTo({
246
- left: this.input.nativeElement.scrollLeft,
182
+ if (this.input()?.nativeElement === element) {
183
+ this.ghost()?.nativeElement.scrollTo({
184
+ left: this.input()?.nativeElement.scrollLeft,
247
185
  });
248
186
  }
249
187
  }
250
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTextfieldBaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
251
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TuiTextfieldBaseComponent, inputs: { content: "content", fillerSetter: ["filler", "fillerSetter"] }, queries: [{ propertyName: "label", first: true, predicate: i0.forwardRef(function () { return TuiLabel; }), descendants: true, read: ElementRef }, { propertyName: "_input", first: true, predicate: i0.forwardRef(function () { return TuiTextfieldBase; }), descendants: true, read: ElementRef }, { propertyName: "accessor", first: true, predicate: TUI_TEXTFIELD_ACCESSOR, descendants: true }, { propertyName: "control", first: true, predicate: NgControl, descendants: true }, { propertyName: "cva", first: true, predicate: TuiControl, descendants: true }, { propertyName: "input", first: true, predicate: i0.forwardRef(function () { return TuiTextfieldBase; }), descendants: true, read: ElementRef, static: true }, { propertyName: "auxiliaryQuery", predicate: TUI_AUXILIARY, descendants: true }], viewQueries: [{ propertyName: "ghost", first: true, predicate: ["ghost"], descendants: true }, { propertyName: "vcr", first: true, predicate: ["vcr"], descendants: true, read: ViewContainerRef, static: true }], ngImport: i0 }); }
252
- }
253
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTextfieldBaseComponent, decorators: [{
254
- type: Directive
255
- }], propDecorators: { ghost: [{
256
- type: ViewChild,
257
- args: ['ghost']
258
- }], label: [{
259
- type: ContentChild,
260
- args: [forwardRef(() => TuiLabel), { read: ElementRef }]
261
- }], auxiliaryQuery: [{
262
- type: ContentChildren,
263
- args: [TUI_AUXILIARY, { descendants: true }]
264
- }], _input: [{
265
- type: ContentChild,
266
- args: [forwardRef(() => TuiTextfieldBase), { read: ElementRef }]
267
- }], vcr: [{
268
- type: ViewChild,
269
- args: ['vcr', { read: ViewContainerRef, static: true }]
270
- }], accessor: [{
271
- type: ContentChild,
272
- args: [TUI_TEXTFIELD_ACCESSOR, { descendants: true }]
273
- }], control: [{
274
- type: ContentChild,
275
- args: [NgControl]
276
- }], cva: [{
277
- type: ContentChild,
278
- args: [TuiControl]
279
- }], input: [{
280
- type: ContentChild,
281
- args: [forwardRef(() => TuiTextfieldBase), {
282
- read: ElementRef,
283
- static: true,
284
- }]
285
- }], content: [{
286
- type: Input
287
- }], fillerSetter: [{
288
- type: Input,
289
- args: ['filler']
290
- }] } });
291
- class TuiTextfieldComponent extends TuiTextfieldBaseComponent {
292
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTextfieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
293
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiTextfieldComponent, isStandalone: true, selector: "tui-textfield:not([multi])", host: { listeners: { "click.self.prevent": "0", "pointerdown.self.prevent": "onIconClick()", "scroll.capture.zoneless": "onScroll($event.target)", "tuiActiveZoneChange": "!$event && cva?.onTouched()" }, properties: { "attr.data-size": "options.size()", "class._with-label": "hasLabel", "class._with-template": "content && control?.value != null", "class._disabled": "input?.nativeElement?.disabled" } }, providers: [
188
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiTextfieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
189
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: TuiTextfieldComponent, isStandalone: true, selector: "tui-textfield:not([multi])", inputs: { content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, filler: { classPropertyName: "filler", publicName: "filler", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "animationstart": "0", "animationcancel": "0", "click.self.prevent": "0", "pointerdown.self.prevent": "onIconClick()", "scroll.capture.zoneless": "onScroll($event.target)", "tuiActiveZoneChange": "!$event && control()?.valueAccessor?.onTouched?.()" }, properties: { "attr.data-size": "options.size()", "class._with-label": "hasLabel", "class._with-template": "content() && control()?.value != null", "class._disabled": "input()?.nativeElement?.disabled", "style.transition": "\"none\"" }, classAttribute: "tui-interactive" }, providers: [
294
190
  tuiButtonOptionsProvider({ size: 'xs', appearance: 'icon' }),
295
191
  tuiAsDataListHost(TuiTextfieldComponent),
296
- ], usesInheritance: true, hostDirectives: [{ directive: i1.TuiDropdownDirective }, { directive: i1.TuiDropdownFixed }, { directive: i1.TuiWithDropdownOpen }, { directive: i2.TuiWithIcons }, { directive: i3.TuiWithItemsHandlers }, { directive: i4.TuiWithOptionContent }, { directive: TuiWithTextfieldDropdown }], ngImport: i0, template: "<ng-container *ngIf=\"control?.control?.valueChanges | async\" />\n<ng-content select=\"input\" />\n<ng-content select=\"select\" />\n<ng-content select=\"textarea\" />\n<ng-content select=\"label\" />\n<span\n class=\"t-content\"\n (pointerdown.prevent)=\"input?.nativeElement?.focus()\"\n (waResizeObserver)=\"$event[0] && onResize($event[0])\"\n>\n <ng-content />\n <button\n *ngIf=\"options.cleaner()\"\n appearance=\"icon\"\n size=\"xs\"\n tabindex=\"-1\"\n tuiIconButton\n type=\"button\"\n class=\"t-clear\"\n [iconStart]=\"icons.close\"\n (click)=\"accessor?.setValue(null)\"\n (pointerdown.zoneless.prevent)=\"input?.nativeElement?.focus()\"\n >\n {{ clear() }}\n </button>\n <ng-container #vcr />\n <ng-content select=\"tui-icon\" />\n</span>\n<span\n *ngIf=\"control?.value != null\"\n class=\"t-template\"\n>\n <ng-container *polymorpheusOutlet=\"content as text; context: {$implicit: control?.value}\">\n {{ text }}\n </ng-container>\n</span>\n<input\n *ngIf=\"showFiller()\"\n #ghost\n aria-hidden=\"true\"\n disabled\n class=\"t-filler\"\n [value]=\"computedFiller()\"\n/>\n", styles: ["tui-textfield{scrollbar-width:none;-ms-overflow-style:none;transition-property:color;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;--t-height: var(--tui-height-l);--t-padding: var(--tui-padding-l);--t-label: -.7em;--t-label-size: .83em;--t-end: 0rem;--t-start: 0rem;position:relative;display:flex;flex-wrap:wrap;align-items:center;cursor:pointer;min-block-size:var(--t-height);padding:0 var(--t-padding);border-radius:var(--tui-radius-l);font:var(--tui-font-text-ui-m);line-height:1.25rem;box-sizing:border-box;gap:0 .25rem;isolation:isolate}tui-textfield::-webkit-scrollbar,tui-textfield::-webkit-scrollbar-thumb{display:none}tui-textfield[tuiIcons]:read-only{color:var(--tui-text-tertiary)}tui-textfield[style*=\"--t-icon-start:\"]{--t-start: 2.25rem}tui-textfield[style*=\"--t-icon-end:\"]{--t-end: 2.25rem}tui-textfield[tuiIcons]:after{position:relative;block-size:auto;align-self:stretch;border-inline-start:var(--t-padding) solid transparent;border-inline-end:var(--t-padding) solid transparent;margin:0 calc(-1 * var(--t-padding))}tui-textfield::-webkit-resizer{border:.25rem solid transparent;inline-size:.5rem;block-size:.5rem;box-sizing:content-box;color:var(--tui-text-tertiary);background:linear-gradient(-45deg,transparent,transparent .125rem,currentColor .125rem,currentColor .1875rem,transparent .1875rem,transparent .25rem,currentColor .25rem,currentColor .3125rem,transparent .35rem);background-clip:content-box}tui-textfield label,tui-textfield>.t-content,tui-textfield>.t-template{pointer-events:none}tui-textfield input,tui-textfield select,tui-textfield textarea{font:inherit;resize:none;outline:none;padding-block-start:1.125rem;padding-block-end:1.125rem;color:var(--tui-text-primary)}tui-textfield input[inputmode=none],tui-textfield select[inputmode=none],tui-textfield textarea[inputmode=none]{caret-color:transparent}tui-textfield[data-size=s]{--t-height: var(--tui-height-s);--t-padding: var(--tui-padding-s);border-radius:var(--tui-radius-m);gap:0;font:var(--tui-font-text-ui-s);line-height:1rem}tui-textfield[data-size=s][style*=\"--t-icon-start:\"]{--t-start: 1.25rem}tui-textfield[data-size=s][style*=\"--t-icon-end:\"]{--t-end: 1.25rem}tui-textfield[data-size=s]:before{margin-inline-end:.5rem;margin-inline-start:-.125rem;font-size:1rem}tui-textfield[data-size=s]:after{margin-inline-end:calc(-.125rem - var(--t-padding));margin-inline-start:calc(.625rem - var(--t-padding));font-size:1rem}tui-textfield[data-size=s] input,tui-textfield[data-size=s] select,tui-textfield[data-size=s] textarea{padding-block-start:.5rem;padding-block-end:.5rem}tui-textfield[data-size=s]>.t-content{margin-inline-end:-.375rem}tui-textfield[data-size=m]{--t-height: var(--tui-height-m);--t-padding: var(--tui-padding-m);border-radius:var(--tui-radius-m);font:var(--tui-font-text-ui-s);line-height:1rem}tui-textfield[data-size=m][style*=\"--t-icon-start:\"]{--t-start: 1.75rem}tui-textfield[data-size=m][style*=\"--t-icon-end:\"]{--t-end: 1.75rem}tui-textfield[data-size=m]:before{margin-inline-start:-.125rem;margin-inline-end:.125rem}tui-textfield[data-size=m]:after{margin-inline-start:calc(.25rem - var(--t-padding));margin-inline-end:calc(-.125rem - var(--t-padding))}tui-textfield[data-size=m] input,tui-textfield[data-size=m] select,tui-textfield[data-size=m] textarea{padding-block-start:.875rem;padding-block-end:.875rem}tui-textfield[data-size=m]>.t-content{margin-inline-end:-.125rem}tui-textfield[data-size=l]{--t-label: -.7rem}tui-textfield[tuiIcons]:hover{color:var(--tui-text-secondary)}tui-textfield[tuiIcons]:hover:has(input:read-only):not([multi]),tui-textfield[tuiIcons]:hover:has(textarea:read-only),tui-textfield[tuiIcons]:hover:has(select[data-mode~=readonly]){color:var(--tui-text-tertiary)}tui-textfield:before{z-index:1;margin-inline-end:.5rem;pointer-events:none}tui-textfield:has(:disabled:not(.t-filler,button,option,[tuiChip])):before,tui-textfield:has(:disabled:not(.t-filler,button,option,[tuiChip])):after,tui-textfield:has(:disabled:not(.t-filler,button,option,[tuiChip]))>.t-template{opacity:var(--tui-disabled-opacity)}tui-textfield._disabled:before,tui-textfield._disabled:after,tui-textfield._disabled>.t-template{opacity:var(--tui-disabled-opacity)}tui-textfield:has(label:not(:empty))>.t-template,tui-textfield:has(label:not(:empty)) input:not([type=range]),tui-textfield:has(label:not(:empty)) select:defined,tui-textfield:has(label:not(:empty)) textarea:defined{padding-block-start:calc(var(--t-height) / 3);padding-block-end:0}tui-textfield:not([data-focus=true]):has(label:not(:empty))>.t-template::placeholder,tui-textfield:not([data-focus=true]):has(label:not(:empty)) input:not([type=range])::placeholder,tui-textfield:not([data-focus=true]):has(label:not(:empty)) select:defined::placeholder,tui-textfield:not([data-focus=true]):has(label:not(:empty)) textarea:defined::placeholder,tui-textfield:not([data-focus=true]):has(label:not(:empty))>.t-template._empty,tui-textfield:not([data-focus=true]):has(label:not(:empty)) input:not([type=range])._empty,tui-textfield:not([data-focus=true]):has(label:not(:empty)) select:defined._empty,tui-textfield:not([data-focus=true]):has(label:not(:empty)) textarea:defined._empty{color:transparent}tui-textfield._with-label>.t-template,tui-textfield._with-label input:not([type=range]),tui-textfield._with-label select:defined,tui-textfield._with-label textarea:defined{padding-block-start:calc(var(--t-height) / 3);padding-block-end:0}tui-textfield:not([data-focus=true])._with-label>.t-template::placeholder,tui-textfield:not([data-focus=true])._with-label input:not([type=range])::placeholder,tui-textfield:not([data-focus=true])._with-label select:defined::placeholder,tui-textfield:not([data-focus=true])._with-label textarea:defined::placeholder,tui-textfield:not([data-focus=true])._with-label>.t-template._empty,tui-textfield:not([data-focus=true])._with-label input:not([type=range])._empty,tui-textfield:not([data-focus=true])._with-label select:defined._empty,tui-textfield:not([data-focus=true])._with-label textarea:defined._empty{color:transparent}tui-textfield>.t-template,tui-textfield input:defined,tui-textfield select:defined,tui-textfield textarea:defined{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;-webkit-appearance:none;appearance:none;box-sizing:border-box;border-radius:inherit;border-width:0;overscroll-behavior:none;padding-inline-start:calc(var(--t-start, 0rem) + var(--t-padding));padding-inline-end:calc(var(--t-end, 0rem) + var(--t-side) + var(--t-padding))}tui-textfield>.t-template{display:flex;align-items:center;color:var(--tui-text-primary)}tui-textfield._with-template input:first-of-type,tui-textfield._with-template select,tui-textfield._with-template textarea{color:transparent!important}tui-textfield input:not([type=range]),tui-textfield select:defined,tui-textfield textarea:defined{pointer-events:auto;background:none}tui-textfield input:not([type=range]):not(select):read-only~.t-filler,tui-textfield select:defined:not(select):read-only~.t-filler,tui-textfield textarea:defined:not(select):read-only~.t-filler{display:none}tui-textfield input:not([type=range]):disabled~label,tui-textfield select:defined:disabled~label,tui-textfield textarea:defined:disabled~label,tui-textfield input:not([type=range]):disabled~.t-content,tui-textfield select:defined:disabled~.t-content,tui-textfield textarea:defined:disabled~.t-content{opacity:var(--tui-disabled-opacity)}tui-textfield input:not([type=range]):disabled~label>tui-icon,tui-textfield select:defined:disabled~label>tui-icon,tui-textfield textarea:defined:disabled~label>tui-icon,tui-textfield input:not([type=range]):disabled~.t-content>tui-icon,tui-textfield select:defined:disabled~.t-content>tui-icon,tui-textfield textarea:defined:disabled~.t-content>tui-icon{display:none}tui-textfield input:not([type=range]):-webkit-autofill~label,tui-textfield select:defined:-webkit-autofill~label,tui-textfield textarea:defined:-webkit-autofill~label,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown)~label,tui-textfield select:defined:not(._empty):not(:placeholder-shown)~label,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown)~label{font-size:var(--t-label-size);transform:translateY(var(--t-label))}tui-textfield input:not([type=range]):-webkit-autofill:not(:disabled)[data-mode~=invalid]~label,tui-textfield select:defined:-webkit-autofill:not(:disabled)[data-mode~=invalid]~label,tui-textfield textarea:defined:-webkit-autofill:not(:disabled)[data-mode~=invalid]~label,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown):not(:disabled)[data-mode~=invalid]~label,tui-textfield select:defined:not(._empty):not(:placeholder-shown):not(:disabled)[data-mode~=invalid]~label,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown):not(:disabled)[data-mode~=invalid]~label,tui-textfield input:not([type=range]):-webkit-autofill:invalid:not(:disabled):not([data-mode])~label,tui-textfield select:defined:-webkit-autofill:invalid:not(:disabled):not([data-mode])~label,tui-textfield textarea:defined:-webkit-autofill:invalid:not(:disabled):not([data-mode])~label,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown):invalid:not(:disabled):not([data-mode])~label,tui-textfield select:defined:not(._empty):not(:placeholder-shown):invalid:not(:disabled):not([data-mode])~label,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown):invalid:not(:disabled):not([data-mode])~label{color:var(--tui-text-negative)}tui-textfield input:not([type=range]):-webkit-autofill:not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield select:defined:-webkit-autofill:not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield textarea:defined:-webkit-autofill:not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown):not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield select:defined:not(._empty):not(:placeholder-shown):not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown):not(:disabled):not([data-mode~=readonly])~.t-content .t-clear{display:flex}tui-textfield input:not([type=range]):not([data-mode~=readonly]):focus-visible:not([data-focus=false])::placeholder,tui-textfield select:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])::placeholder,tui-textfield textarea:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])::placeholder,tui-textfield input:not([type=range]):not([data-mode~=readonly]):focus-visible:not([data-focus=false])._empty,tui-textfield select:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])._empty,tui-textfield textarea:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])._empty{color:var(--tui-text-tertiary)}tui-textfield input:not([type=range]):not([data-mode~=readonly]):focus-visible:not([data-focus=false])~label,tui-textfield select:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])~label,tui-textfield textarea:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])~label{color:var(--tui-text-primary)!important;font-size:var(--t-label-size);transform:translateY(var(--t-label))}tui-textfield input:not([type=range]):not([data-mode~=readonly])[data-focus=true]::placeholder,tui-textfield select:defined:not([data-mode~=readonly])[data-focus=true]::placeholder,tui-textfield textarea:defined:not([data-mode~=readonly])[data-focus=true]::placeholder,tui-textfield input:not([type=range]):not([data-mode~=readonly])[data-focus=true]._empty,tui-textfield select:defined:not([data-mode~=readonly])[data-focus=true]._empty,tui-textfield textarea:defined:not([data-mode~=readonly])[data-focus=true]._empty{color:var(--tui-text-tertiary)}tui-textfield input:not([type=range]):not([data-mode~=readonly])[data-focus=true]~label,tui-textfield select:defined:not([data-mode~=readonly])[data-focus=true]~label,tui-textfield textarea:defined:not([data-mode~=readonly])[data-focus=true]~label{color:var(--tui-text-primary)!important;font-size:var(--t-label-size);transform:translateY(var(--t-label))}tui-textfield input:not([type=range]):not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)::placeholder,tui-textfield select:defined:not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)::placeholder,tui-textfield textarea:defined:not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)::placeholder,tui-textfield input:not([type=range]):not([data-mode~=readonly])[tuiWrapper]._focused::placeholder,tui-textfield select:defined:not([data-mode~=readonly])[tuiWrapper]._focused::placeholder,tui-textfield textarea:defined:not([data-mode~=readonly])[tuiWrapper]._focused::placeholder,tui-textfield input:not([type=range]):not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)._empty,tui-textfield select:defined:not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)._empty,tui-textfield textarea:defined:not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)._empty,tui-textfield input:not([type=range]):not([data-mode~=readonly])[tuiWrapper]._focused._empty,tui-textfield select:defined:not([data-mode~=readonly])[tuiWrapper]._focused._empty,tui-textfield textarea:defined:not([data-mode~=readonly])[tuiWrapper]._focused._empty{color:var(--tui-text-tertiary)}tui-textfield input:not([type=range]):not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)~label,tui-textfield select:defined:not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)~label,tui-textfield textarea:defined:not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)~label,tui-textfield input:not([type=range]):not([data-mode~=readonly])[tuiWrapper]._focused~label,tui-textfield select:defined:not([data-mode~=readonly])[tuiWrapper]._focused~label,tui-textfield textarea:defined:not([data-mode~=readonly])[tuiWrapper]._focused~label{color:var(--tui-text-primary)!important;font-size:var(--t-label-size);transform:translateY(var(--t-label))}@supports (-webkit-touch-callout: none){tui-textfield input:not([type=range])._ios-fix,tui-textfield select:defined._ios-fix,tui-textfield textarea:defined._ios-fix{position:fixed;left:1000rem}}tui-textfield [tuiLabel][tuiLabel][tuiLabel]{transition-property:all;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative;display:block;flex:1;align-self:flex-start;font-size:inherit;line-height:var(--t-height);transition-duration:inherit}tui-textfield label:defined,tui-textfield input:defined::placeholder,tui-textfield textarea:defined::placeholder,tui-textfield select:defined._empty{color:var(--tui-text-secondary)}tui-textfield select:not([data-mode~=readonly]){cursor:pointer}tui-textfield select option[value=\"\"]:disabled{color:transparent}tui-textfield select optgroup,tui-textfield select option{background-color:var(--tui-background-elevation-3)}tui-textfield select optgroup,tui-textfield select option:not(:disabled){color:var(--tui-text-primary)}tui-textfield button,tui-textfield a{pointer-events:auto}tui-textfield>.t-content{z-index:1;display:flex;block-size:var(--t-height);align-items:center;gap:inherit;margin-inline-start:auto;isolation:isolate;border-radius:inherit}tui-textfield>.t-content>tui-icon{pointer-events:auto}tui-textfield textarea~.t-content{min-inline-size:.5rem}tui-textfield .t-clear{z-index:1;display:none;pointer-events:auto}tui-textfield>.t-filler:defined{pointer-events:none;color:var(--tui-text-tertiary);opacity:1}tui-textfield [tuiFluidTypography]{font-weight:700}tui-textfield [tuiSelectLike]:not(:read-only){cursor:pointer}tui-textfield:has(input[type=tel]){direction:ltr}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "directive", type: WaResizeObserver, selector: "[waResizeObserver]", inputs: ["box"], outputs: ["waResizeObserver"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
192
+ ], queries: [{ propertyName: "label", first: true, predicate: i0.forwardRef(() => TuiLabel), descendants: true, read: ElementRef, isSignal: true }, { propertyName: "accessor", first: true, predicate: TUI_TEXTFIELD_ACCESSOR, descendants: true, isSignal: true }, { propertyName: "control", first: true, predicate: NgControl, descendants: true, isSignal: true }, { propertyName: "auxiliaries", predicate: TUI_AUXILIARY, descendants: true, isSignal: true }, { propertyName: "input", first: true, predicate: TUI_TEXTFIELD_ACCESSOR, descendants: true, read: ElementRef, isSignal: true }], viewQueries: [{ propertyName: "ghost", first: true, predicate: ["ghost"], descendants: true, isSignal: true }, { propertyName: "vcr", first: true, predicate: ["vcr"], descendants: true, read: ViewContainerRef, isSignal: true }], hostDirectives: [{ directive: i1.TuiDropdownDirective }, { directive: i1.TuiDropdownFixed }, { directive: i1.TuiWithDropdownOpen }, { directive: i2.TuiWithIcons }, { directive: i3.TuiWithItemsHandlers }, { directive: i4.TuiWithOptionContent }], ngImport: i0, template: "@if (control()?.control?.valueChanges | async) {}\n<ng-content select=\"input\" />\n<ng-content select=\"select\" />\n<ng-content select=\"textarea\" />\n<ng-content select=\"label\" />\n<span\n class=\"t-content\"\n (pointerdown)=\"input()?.nativeElement?.focus()\"\n (waResizeObserver)=\"$event[0] && onResize($event[0])\"\n>\n <ng-content />\n <ng-container #vcr />\n @if (options.cleaner()) {\n <button\n appearance=\"icon\"\n size=\"xs\"\n tabindex=\"-1\"\n tuiIconButton\n type=\"button\"\n class=\"t-clear\"\n [iconStart]=\"icons.close\"\n (click)=\"accessor()?.setValue(null)\"\n (pointerdown.zoneless.prevent)=\"input()?.nativeElement?.focus()\"\n >\n {{ clear() }}\n </button>\n }\n <ng-content select=\"tui-icon\" />\n</span>\n@if (control()?.value != null) {\n <span class=\"t-template\">\n <ng-container *polymorpheusOutlet=\"content() as text; context: {$implicit: control()?.value}\">\n {{ text }}\n </ng-container>\n </span>\n}\n@if (showFiller()) {\n <input\n #ghost\n aria-hidden=\"true\"\n disabled\n class=\"t-filler\"\n [value]=\"computedFiller()\"\n />\n}\n", styles: ["tui-textfield{scrollbar-width:none;-ms-overflow-style:none;transition-property:color;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;--t-height: var(--tui-height-l);--t-padding: var(--tui-padding-l);--t-label-y: -.75rem;--t-label-font: var(--tui-font-text-s);--t-end: 0rem;--t-start: 0rem;position:relative;display:flex;flex-wrap:wrap;align-items:center;cursor:pointer;min-block-size:var(--t-height);padding:0 var(--t-padding);border-radius:var(--tui-radius-l);font:var(--tui-font-text-ui-m);line-height:1.25rem;box-sizing:border-box;gap:0 .25rem;isolation:isolate}tui-textfield::-webkit-scrollbar,tui-textfield::-webkit-scrollbar-thumb{display:none}tui-textfield[tuiIcons]:read-only{color:var(--tui-text-tertiary)}tui-textfield[data-icon-start]{--t-start: 2.25rem}tui-textfield[data-icon-end]{--t-end: 2.25rem}tui-textfield[tuiIcons]:after{position:relative;block-size:auto;align-self:stretch;border-inline:var(--t-padding) solid transparent;margin:0 calc(-1 * var(--t-padding))}tui-textfield::-webkit-resizer{border:.25rem solid transparent;inline-size:.5rem;block-size:.5rem;box-sizing:content-box;color:var(--tui-text-tertiary);background:linear-gradient(-45deg,transparent,transparent .125rem,currentColor .125rem,currentColor .1875rem,transparent .1875rem,transparent .25rem,currentColor .25rem,currentColor .3125rem,transparent .35rem);background-clip:content-box}tui-textfield label,tui-textfield>.t-content,tui-textfield>.t-template{pointer-events:none}tui-textfield input,tui-textfield select,tui-textfield textarea{font:inherit;resize:none;outline:none;padding-block:1.125rem;color:var(--tui-text-primary)}tui-textfield input[inputmode=none],tui-textfield select[inputmode=none],tui-textfield textarea[inputmode=none]{caret-color:transparent}tui-textfield[data-size=s]{--t-height: var(--tui-height-s);--t-padding: var(--tui-padding-s);border-radius:var(--tui-radius-m);gap:0;font:var(--tui-font-text-ui-s);line-height:1rem}tui-textfield[data-size=s][data-icon-start]{--t-start: 1.25rem}tui-textfield[data-size=s][data-icon-end]{--t-end: 1.25rem}tui-textfield[data-size=s]:before{margin-inline:-.125rem .5rem;font-size:1rem}tui-textfield[data-size=s]:after{margin-inline:calc(.625rem - var(--t-padding)) calc(-.125rem - var(--t-padding));font-size:1rem}tui-textfield[data-size=s] input,tui-textfield[data-size=s] select,tui-textfield[data-size=s] textarea{padding-block:.5rem}tui-textfield[data-size=s]>.t-content{margin-inline-end:-.375rem}tui-textfield[data-size=m]{--t-height: var(--tui-height-m);--t-padding: var(--tui-padding-m);--t-label-font: var(--tui-font-text-xs);--t-label-y: -.5625rem;border-radius:var(--tui-radius-m);font:var(--tui-font-text-ui-s);line-height:1rem}tui-textfield[data-size=m][data-icon-start]{--t-start: 1.75rem}tui-textfield[data-size=m][data-icon-end]{--t-end: 1.75rem}tui-textfield[data-size=m]:before{margin-inline:-.125rem .125rem}tui-textfield[data-size=m]:after{margin-inline:calc(.25rem - var(--t-padding)) calc(-.125rem - var(--t-padding))}tui-textfield[data-size=m] input,tui-textfield[data-size=m] select,tui-textfield[data-size=m] textarea{padding-block:.875rem}tui-textfield[data-size=m]>.t-content{margin-inline-end:-.125rem}tui-textfield[data-size=l]{--t-label: -.7rem}tui-textfield[tuiIcons]:hover{color:var(--tui-text-secondary)}tui-textfield[tuiIcons]:hover:has(input:read-only):not([multi]),tui-textfield[tuiIcons]:hover:has(textarea:read-only),tui-textfield[tuiIcons]:hover:has(select[data-mode~=readonly]){color:var(--tui-text-tertiary)}tui-textfield:before{z-index:1;margin-inline-end:.5rem;pointer-events:none}tui-textfield:has(:disabled:not(.t-filler,button,option,[tuiChip])):before,tui-textfield:has(:disabled:not(.t-filler,button,option,[tuiChip])):after,tui-textfield:has(:disabled:not(.t-filler,button,option,[tuiChip]))>.t-template{opacity:var(--tui-disabled-opacity)}tui-textfield._disabled:before,tui-textfield._disabled:after,tui-textfield._disabled>.t-template{opacity:var(--tui-disabled-opacity)}tui-textfield._with-label>.t-template,tui-textfield._with-label input:not([type=range]),tui-textfield._with-label select:defined,tui-textfield._with-label textarea:defined{padding-block:calc(var(--t-height) / 3) 0}tui-textfield:not([data-focus=true])._with-label>.t-template::placeholder,tui-textfield:not([data-focus=true])._with-label input:not([type=range])::placeholder,tui-textfield:not([data-focus=true])._with-label select:defined::placeholder,tui-textfield:not([data-focus=true])._with-label textarea:defined::placeholder,tui-textfield:not([data-focus=true])._with-label>.t-template._empty,tui-textfield:not([data-focus=true])._with-label input:not([type=range])._empty,tui-textfield:not([data-focus=true])._with-label select:defined._empty,tui-textfield:not([data-focus=true])._with-label textarea:defined._empty{color:transparent}tui-textfield>.t-template,tui-textfield input:defined,tui-textfield select:defined,tui-textfield textarea:defined{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;-webkit-appearance:none;appearance:none;box-sizing:border-box;border-radius:inherit;border-width:0;overscroll-behavior:none;padding-inline:calc(var(--t-start, 0rem) + var(--t-padding)) calc(var(--t-end, 0rem) + var(--t-side) + var(--t-padding))}tui-textfield>.t-template:disabled,tui-textfield input:defined:disabled,tui-textfield select:defined:disabled,tui-textfield textarea:defined:disabled{animation:tuiPresent 1s infinite}tui-textfield>.t-template{display:flex;align-items:center;color:var(--tui-text-primary)}tui-textfield._with-template input:first-of-type,tui-textfield._with-template select,tui-textfield._with-template textarea{color:transparent!important}tui-textfield input:not([type=range]),tui-textfield select:defined,tui-textfield textarea:defined{pointer-events:auto;background:none}tui-textfield input:not([type=range]):not(select):read-only~.t-filler,tui-textfield select:defined:not(select):read-only~.t-filler,tui-textfield textarea:defined:not(select):read-only~.t-filler{display:none}tui-textfield input:not([type=range]):disabled~label,tui-textfield select:defined:disabled~label,tui-textfield textarea:defined:disabled~label,tui-textfield input:not([type=range]):disabled~.t-content,tui-textfield select:defined:disabled~.t-content,tui-textfield textarea:defined:disabled~.t-content{opacity:var(--tui-disabled-opacity)}tui-textfield input:not([type=range]):disabled~label>tui-icon,tui-textfield select:defined:disabled~label>tui-icon,tui-textfield textarea:defined:disabled~label>tui-icon,tui-textfield input:not([type=range]):disabled~.t-content>tui-icon,tui-textfield select:defined:disabled~.t-content>tui-icon,tui-textfield textarea:defined:disabled~.t-content>tui-icon{display:none}tui-textfield input:not([type=range]):-webkit-autofill~label,tui-textfield select:defined:-webkit-autofill~label,tui-textfield textarea:defined:-webkit-autofill~label,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown)~label,tui-textfield select:defined:not(._empty):not(:placeholder-shown)~label,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown)~label{font:var(--t-label-font);line-height:var(--t-height);transform:translateY(var(--t-label-y))}tui-textfield input:not([type=range]):-webkit-autofill:not(:disabled)[data-mode~=invalid]~label,tui-textfield select:defined:-webkit-autofill:not(:disabled)[data-mode~=invalid]~label,tui-textfield textarea:defined:-webkit-autofill:not(:disabled)[data-mode~=invalid]~label,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown):not(:disabled)[data-mode~=invalid]~label,tui-textfield select:defined:not(._empty):not(:placeholder-shown):not(:disabled)[data-mode~=invalid]~label,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown):not(:disabled)[data-mode~=invalid]~label,tui-textfield input:not([type=range]):-webkit-autofill:invalid:not(:disabled):not([data-mode])~label,tui-textfield select:defined:-webkit-autofill:invalid:not(:disabled):not([data-mode])~label,tui-textfield textarea:defined:-webkit-autofill:invalid:not(:disabled):not([data-mode])~label,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown):invalid:not(:disabled):not([data-mode])~label,tui-textfield select:defined:not(._empty):not(:placeholder-shown):invalid:not(:disabled):not([data-mode])~label,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown):invalid:not(:disabled):not([data-mode])~label{color:var(--tui-text-negative)}tui-textfield input:not([type=range]):-webkit-autofill:not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield select:defined:-webkit-autofill:not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield textarea:defined:-webkit-autofill:not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown):not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield select:defined:not(._empty):not(:placeholder-shown):not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown):not(:disabled):not([data-mode~=readonly])~.t-content .t-clear{display:flex}tui-textfield input:not([type=range]):not([data-mode~=readonly]):focus-visible:not([data-focus=false])::placeholder,tui-textfield select:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])::placeholder,tui-textfield textarea:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])::placeholder,tui-textfield input:not([type=range]):not([data-mode~=readonly]):focus-visible:not([data-focus=false])._empty,tui-textfield select:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])._empty,tui-textfield textarea:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])._empty{color:var(--tui-text-tertiary)}tui-textfield input:not([type=range]):not([data-mode~=readonly]):focus-visible:not([data-focus=false])~label,tui-textfield select:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])~label,tui-textfield textarea:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])~label{color:var(--tui-text-primary)!important;font:var(--t-label-font);line-height:var(--t-height);transform:translateY(var(--t-label-y))}tui-textfield input:not([type=range]):not([data-mode~=readonly])[data-focus=true]::placeholder,tui-textfield select:defined:not([data-mode~=readonly])[data-focus=true]::placeholder,tui-textfield textarea:defined:not([data-mode~=readonly])[data-focus=true]::placeholder,tui-textfield input:not([type=range]):not([data-mode~=readonly])[data-focus=true]._empty,tui-textfield select:defined:not([data-mode~=readonly])[data-focus=true]._empty,tui-textfield textarea:defined:not([data-mode~=readonly])[data-focus=true]._empty{color:var(--tui-text-tertiary)}tui-textfield input:not([type=range]):not([data-mode~=readonly])[data-focus=true]~label,tui-textfield select:defined:not([data-mode~=readonly])[data-focus=true]~label,tui-textfield textarea:defined:not([data-mode~=readonly])[data-focus=true]~label{color:var(--tui-text-primary)!important;font:var(--t-label-font);line-height:var(--t-height);transform:translateY(var(--t-label-y))}tui-textfield [tuiLabel][tuiLabel][tuiLabel]{transition-property:all;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative;display:block;flex:1;align-self:flex-start;font-size:inherit;line-height:var(--t-height);transition-duration:inherit}tui-textfield label:defined,tui-textfield input:defined::placeholder,tui-textfield textarea:defined::placeholder,tui-textfield select:defined._empty{color:var(--tui-text-secondary)}tui-textfield select:not([data-mode~=readonly]){cursor:pointer}tui-textfield select option[value=\"\"]:disabled{color:transparent}tui-textfield select optgroup,tui-textfield select option{background-color:var(--tui-background-elevation-3)}tui-textfield select optgroup,tui-textfield select option:not(:disabled){color:var(--tui-text-primary)}tui-textfield button,tui-textfield a{pointer-events:auto}tui-textfield>.t-content{z-index:1;display:flex;block-size:var(--t-height);align-items:center;gap:inherit;margin-inline-start:auto;isolation:isolate;border-radius:inherit}tui-textfield>.t-content>tui-icon{pointer-events:auto}tui-textfield textarea~.t-content{min-inline-size:.5rem}tui-textfield .t-clear{z-index:1;display:none;pointer-events:auto}tui-textfield>.t-filler:defined{pointer-events:none!important;color:var(--tui-text-tertiary);opacity:1}tui-textfield [tuiFluidTypography]{font-weight:700}tui-textfield [tuiSelectLike]:not(:read-only){cursor:pointer}tui-textfield:has(input[type=tel]){direction:ltr}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "directive", type: WaResizeObserver, selector: "[waResizeObserver]", inputs: ["box"], outputs: ["waResizeObserver"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
297
193
  }
298
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTextfieldComponent, decorators: [{
194
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiTextfieldComponent, decorators: [{
299
195
  type: Component,
300
- args: [{ standalone: true, selector: 'tui-textfield:not([multi])', imports: [AsyncPipe, NgIf, PolymorpheusOutlet, TuiButton, WaResizeObserver], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
196
+ args: [{ selector: 'tui-textfield:not([multi])', imports: [AsyncPipe, PolymorpheusOutlet, TuiButton, WaResizeObserver], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
301
197
  tuiButtonOptionsProvider({ size: 'xs', appearance: 'icon' }),
302
198
  tuiAsDataListHost(TuiTextfieldComponent),
303
199
  ], hostDirectives: [
@@ -307,189 +203,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
307
203
  TuiWithIcons,
308
204
  TuiWithItemsHandlers,
309
205
  TuiWithOptionContent,
310
- TuiWithTextfieldDropdown,
311
206
  ], host: {
207
+ class: 'tui-interactive',
312
208
  '[attr.data-size]': 'options.size()',
313
- '[class._with-label]': 'hasLabel',
314
- '[class._with-template]': 'content && control?.value != null',
315
- '[class._disabled]': 'input?.nativeElement?.disabled',
209
+ '[class._with-label]': 'hasLabel', // TODO :has([tuiLabel]
210
+ '[class._with-template]': 'content() && control()?.value != null',
211
+ '[class._disabled]': 'input()?.nativeElement?.disabled', // TODO :has([tuiInput]:disabled)
212
+ '[style.transition]': '"none"',
213
+ '(animationstart)': '0', // TODO :has([tuiInput]:disabled)
214
+ '(animationcancel)': '0', // TODO :has([tuiInput]:disabled)
316
215
  '(click.self.prevent)': '0',
317
216
  '(pointerdown.self.prevent)': 'onIconClick()',
318
217
  '(scroll.capture.zoneless)': 'onScroll($event.target)',
319
- '(tuiActiveZoneChange)': '!$event && cva?.onTouched()',
320
- }, template: "<ng-container *ngIf=\"control?.control?.valueChanges | async\" />\n<ng-content select=\"input\" />\n<ng-content select=\"select\" />\n<ng-content select=\"textarea\" />\n<ng-content select=\"label\" />\n<span\n class=\"t-content\"\n (pointerdown.prevent)=\"input?.nativeElement?.focus()\"\n (waResizeObserver)=\"$event[0] && onResize($event[0])\"\n>\n <ng-content />\n <button\n *ngIf=\"options.cleaner()\"\n appearance=\"icon\"\n size=\"xs\"\n tabindex=\"-1\"\n tuiIconButton\n type=\"button\"\n class=\"t-clear\"\n [iconStart]=\"icons.close\"\n (click)=\"accessor?.setValue(null)\"\n (pointerdown.zoneless.prevent)=\"input?.nativeElement?.focus()\"\n >\n {{ clear() }}\n </button>\n <ng-container #vcr />\n <ng-content select=\"tui-icon\" />\n</span>\n<span\n *ngIf=\"control?.value != null\"\n class=\"t-template\"\n>\n <ng-container *polymorpheusOutlet=\"content as text; context: {$implicit: control?.value}\">\n {{ text }}\n </ng-container>\n</span>\n<input\n *ngIf=\"showFiller()\"\n #ghost\n aria-hidden=\"true\"\n disabled\n class=\"t-filler\"\n [value]=\"computedFiller()\"\n/>\n", styles: ["tui-textfield{scrollbar-width:none;-ms-overflow-style:none;transition-property:color;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;--t-height: var(--tui-height-l);--t-padding: var(--tui-padding-l);--t-label: -.7em;--t-label-size: .83em;--t-end: 0rem;--t-start: 0rem;position:relative;display:flex;flex-wrap:wrap;align-items:center;cursor:pointer;min-block-size:var(--t-height);padding:0 var(--t-padding);border-radius:var(--tui-radius-l);font:var(--tui-font-text-ui-m);line-height:1.25rem;box-sizing:border-box;gap:0 .25rem;isolation:isolate}tui-textfield::-webkit-scrollbar,tui-textfield::-webkit-scrollbar-thumb{display:none}tui-textfield[tuiIcons]:read-only{color:var(--tui-text-tertiary)}tui-textfield[style*=\"--t-icon-start:\"]{--t-start: 2.25rem}tui-textfield[style*=\"--t-icon-end:\"]{--t-end: 2.25rem}tui-textfield[tuiIcons]:after{position:relative;block-size:auto;align-self:stretch;border-inline-start:var(--t-padding) solid transparent;border-inline-end:var(--t-padding) solid transparent;margin:0 calc(-1 * var(--t-padding))}tui-textfield::-webkit-resizer{border:.25rem solid transparent;inline-size:.5rem;block-size:.5rem;box-sizing:content-box;color:var(--tui-text-tertiary);background:linear-gradient(-45deg,transparent,transparent .125rem,currentColor .125rem,currentColor .1875rem,transparent .1875rem,transparent .25rem,currentColor .25rem,currentColor .3125rem,transparent .35rem);background-clip:content-box}tui-textfield label,tui-textfield>.t-content,tui-textfield>.t-template{pointer-events:none}tui-textfield input,tui-textfield select,tui-textfield textarea{font:inherit;resize:none;outline:none;padding-block-start:1.125rem;padding-block-end:1.125rem;color:var(--tui-text-primary)}tui-textfield input[inputmode=none],tui-textfield select[inputmode=none],tui-textfield textarea[inputmode=none]{caret-color:transparent}tui-textfield[data-size=s]{--t-height: var(--tui-height-s);--t-padding: var(--tui-padding-s);border-radius:var(--tui-radius-m);gap:0;font:var(--tui-font-text-ui-s);line-height:1rem}tui-textfield[data-size=s][style*=\"--t-icon-start:\"]{--t-start: 1.25rem}tui-textfield[data-size=s][style*=\"--t-icon-end:\"]{--t-end: 1.25rem}tui-textfield[data-size=s]:before{margin-inline-end:.5rem;margin-inline-start:-.125rem;font-size:1rem}tui-textfield[data-size=s]:after{margin-inline-end:calc(-.125rem - var(--t-padding));margin-inline-start:calc(.625rem - var(--t-padding));font-size:1rem}tui-textfield[data-size=s] input,tui-textfield[data-size=s] select,tui-textfield[data-size=s] textarea{padding-block-start:.5rem;padding-block-end:.5rem}tui-textfield[data-size=s]>.t-content{margin-inline-end:-.375rem}tui-textfield[data-size=m]{--t-height: var(--tui-height-m);--t-padding: var(--tui-padding-m);border-radius:var(--tui-radius-m);font:var(--tui-font-text-ui-s);line-height:1rem}tui-textfield[data-size=m][style*=\"--t-icon-start:\"]{--t-start: 1.75rem}tui-textfield[data-size=m][style*=\"--t-icon-end:\"]{--t-end: 1.75rem}tui-textfield[data-size=m]:before{margin-inline-start:-.125rem;margin-inline-end:.125rem}tui-textfield[data-size=m]:after{margin-inline-start:calc(.25rem - var(--t-padding));margin-inline-end:calc(-.125rem - var(--t-padding))}tui-textfield[data-size=m] input,tui-textfield[data-size=m] select,tui-textfield[data-size=m] textarea{padding-block-start:.875rem;padding-block-end:.875rem}tui-textfield[data-size=m]>.t-content{margin-inline-end:-.125rem}tui-textfield[data-size=l]{--t-label: -.7rem}tui-textfield[tuiIcons]:hover{color:var(--tui-text-secondary)}tui-textfield[tuiIcons]:hover:has(input:read-only):not([multi]),tui-textfield[tuiIcons]:hover:has(textarea:read-only),tui-textfield[tuiIcons]:hover:has(select[data-mode~=readonly]){color:var(--tui-text-tertiary)}tui-textfield:before{z-index:1;margin-inline-end:.5rem;pointer-events:none}tui-textfield:has(:disabled:not(.t-filler,button,option,[tuiChip])):before,tui-textfield:has(:disabled:not(.t-filler,button,option,[tuiChip])):after,tui-textfield:has(:disabled:not(.t-filler,button,option,[tuiChip]))>.t-template{opacity:var(--tui-disabled-opacity)}tui-textfield._disabled:before,tui-textfield._disabled:after,tui-textfield._disabled>.t-template{opacity:var(--tui-disabled-opacity)}tui-textfield:has(label:not(:empty))>.t-template,tui-textfield:has(label:not(:empty)) input:not([type=range]),tui-textfield:has(label:not(:empty)) select:defined,tui-textfield:has(label:not(:empty)) textarea:defined{padding-block-start:calc(var(--t-height) / 3);padding-block-end:0}tui-textfield:not([data-focus=true]):has(label:not(:empty))>.t-template::placeholder,tui-textfield:not([data-focus=true]):has(label:not(:empty)) input:not([type=range])::placeholder,tui-textfield:not([data-focus=true]):has(label:not(:empty)) select:defined::placeholder,tui-textfield:not([data-focus=true]):has(label:not(:empty)) textarea:defined::placeholder,tui-textfield:not([data-focus=true]):has(label:not(:empty))>.t-template._empty,tui-textfield:not([data-focus=true]):has(label:not(:empty)) input:not([type=range])._empty,tui-textfield:not([data-focus=true]):has(label:not(:empty)) select:defined._empty,tui-textfield:not([data-focus=true]):has(label:not(:empty)) textarea:defined._empty{color:transparent}tui-textfield._with-label>.t-template,tui-textfield._with-label input:not([type=range]),tui-textfield._with-label select:defined,tui-textfield._with-label textarea:defined{padding-block-start:calc(var(--t-height) / 3);padding-block-end:0}tui-textfield:not([data-focus=true])._with-label>.t-template::placeholder,tui-textfield:not([data-focus=true])._with-label input:not([type=range])::placeholder,tui-textfield:not([data-focus=true])._with-label select:defined::placeholder,tui-textfield:not([data-focus=true])._with-label textarea:defined::placeholder,tui-textfield:not([data-focus=true])._with-label>.t-template._empty,tui-textfield:not([data-focus=true])._with-label input:not([type=range])._empty,tui-textfield:not([data-focus=true])._with-label select:defined._empty,tui-textfield:not([data-focus=true])._with-label textarea:defined._empty{color:transparent}tui-textfield>.t-template,tui-textfield input:defined,tui-textfield select:defined,tui-textfield textarea:defined{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;-webkit-appearance:none;appearance:none;box-sizing:border-box;border-radius:inherit;border-width:0;overscroll-behavior:none;padding-inline-start:calc(var(--t-start, 0rem) + var(--t-padding));padding-inline-end:calc(var(--t-end, 0rem) + var(--t-side) + var(--t-padding))}tui-textfield>.t-template{display:flex;align-items:center;color:var(--tui-text-primary)}tui-textfield._with-template input:first-of-type,tui-textfield._with-template select,tui-textfield._with-template textarea{color:transparent!important}tui-textfield input:not([type=range]),tui-textfield select:defined,tui-textfield textarea:defined{pointer-events:auto;background:none}tui-textfield input:not([type=range]):not(select):read-only~.t-filler,tui-textfield select:defined:not(select):read-only~.t-filler,tui-textfield textarea:defined:not(select):read-only~.t-filler{display:none}tui-textfield input:not([type=range]):disabled~label,tui-textfield select:defined:disabled~label,tui-textfield textarea:defined:disabled~label,tui-textfield input:not([type=range]):disabled~.t-content,tui-textfield select:defined:disabled~.t-content,tui-textfield textarea:defined:disabled~.t-content{opacity:var(--tui-disabled-opacity)}tui-textfield input:not([type=range]):disabled~label>tui-icon,tui-textfield select:defined:disabled~label>tui-icon,tui-textfield textarea:defined:disabled~label>tui-icon,tui-textfield input:not([type=range]):disabled~.t-content>tui-icon,tui-textfield select:defined:disabled~.t-content>tui-icon,tui-textfield textarea:defined:disabled~.t-content>tui-icon{display:none}tui-textfield input:not([type=range]):-webkit-autofill~label,tui-textfield select:defined:-webkit-autofill~label,tui-textfield textarea:defined:-webkit-autofill~label,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown)~label,tui-textfield select:defined:not(._empty):not(:placeholder-shown)~label,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown)~label{font-size:var(--t-label-size);transform:translateY(var(--t-label))}tui-textfield input:not([type=range]):-webkit-autofill:not(:disabled)[data-mode~=invalid]~label,tui-textfield select:defined:-webkit-autofill:not(:disabled)[data-mode~=invalid]~label,tui-textfield textarea:defined:-webkit-autofill:not(:disabled)[data-mode~=invalid]~label,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown):not(:disabled)[data-mode~=invalid]~label,tui-textfield select:defined:not(._empty):not(:placeholder-shown):not(:disabled)[data-mode~=invalid]~label,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown):not(:disabled)[data-mode~=invalid]~label,tui-textfield input:not([type=range]):-webkit-autofill:invalid:not(:disabled):not([data-mode])~label,tui-textfield select:defined:-webkit-autofill:invalid:not(:disabled):not([data-mode])~label,tui-textfield textarea:defined:-webkit-autofill:invalid:not(:disabled):not([data-mode])~label,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown):invalid:not(:disabled):not([data-mode])~label,tui-textfield select:defined:not(._empty):not(:placeholder-shown):invalid:not(:disabled):not([data-mode])~label,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown):invalid:not(:disabled):not([data-mode])~label{color:var(--tui-text-negative)}tui-textfield input:not([type=range]):-webkit-autofill:not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield select:defined:-webkit-autofill:not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield textarea:defined:-webkit-autofill:not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown):not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield select:defined:not(._empty):not(:placeholder-shown):not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown):not(:disabled):not([data-mode~=readonly])~.t-content .t-clear{display:flex}tui-textfield input:not([type=range]):not([data-mode~=readonly]):focus-visible:not([data-focus=false])::placeholder,tui-textfield select:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])::placeholder,tui-textfield textarea:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])::placeholder,tui-textfield input:not([type=range]):not([data-mode~=readonly]):focus-visible:not([data-focus=false])._empty,tui-textfield select:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])._empty,tui-textfield textarea:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])._empty{color:var(--tui-text-tertiary)}tui-textfield input:not([type=range]):not([data-mode~=readonly]):focus-visible:not([data-focus=false])~label,tui-textfield select:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])~label,tui-textfield textarea:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])~label{color:var(--tui-text-primary)!important;font-size:var(--t-label-size);transform:translateY(var(--t-label))}tui-textfield input:not([type=range]):not([data-mode~=readonly])[data-focus=true]::placeholder,tui-textfield select:defined:not([data-mode~=readonly])[data-focus=true]::placeholder,tui-textfield textarea:defined:not([data-mode~=readonly])[data-focus=true]::placeholder,tui-textfield input:not([type=range]):not([data-mode~=readonly])[data-focus=true]._empty,tui-textfield select:defined:not([data-mode~=readonly])[data-focus=true]._empty,tui-textfield textarea:defined:not([data-mode~=readonly])[data-focus=true]._empty{color:var(--tui-text-tertiary)}tui-textfield input:not([type=range]):not([data-mode~=readonly])[data-focus=true]~label,tui-textfield select:defined:not([data-mode~=readonly])[data-focus=true]~label,tui-textfield textarea:defined:not([data-mode~=readonly])[data-focus=true]~label{color:var(--tui-text-primary)!important;font-size:var(--t-label-size);transform:translateY(var(--t-label))}tui-textfield input:not([type=range]):not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)::placeholder,tui-textfield select:defined:not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)::placeholder,tui-textfield textarea:defined:not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)::placeholder,tui-textfield input:not([type=range]):not([data-mode~=readonly])[tuiWrapper]._focused::placeholder,tui-textfield select:defined:not([data-mode~=readonly])[tuiWrapper]._focused::placeholder,tui-textfield textarea:defined:not([data-mode~=readonly])[tuiWrapper]._focused::placeholder,tui-textfield input:not([type=range]):not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)._empty,tui-textfield select:defined:not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)._empty,tui-textfield textarea:defined:not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)._empty,tui-textfield input:not([type=range]):not([data-mode~=readonly])[tuiWrapper]._focused._empty,tui-textfield select:defined:not([data-mode~=readonly])[tuiWrapper]._focused._empty,tui-textfield textarea:defined:not([data-mode~=readonly])[tuiWrapper]._focused._empty{color:var(--tui-text-tertiary)}tui-textfield input:not([type=range]):not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)~label,tui-textfield select:defined:not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)~label,tui-textfield textarea:defined:not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)~label,tui-textfield input:not([type=range]):not([data-mode~=readonly])[tuiWrapper]._focused~label,tui-textfield select:defined:not([data-mode~=readonly])[tuiWrapper]._focused~label,tui-textfield textarea:defined:not([data-mode~=readonly])[tuiWrapper]._focused~label{color:var(--tui-text-primary)!important;font-size:var(--t-label-size);transform:translateY(var(--t-label))}@supports (-webkit-touch-callout: none){tui-textfield input:not([type=range])._ios-fix,tui-textfield select:defined._ios-fix,tui-textfield textarea:defined._ios-fix{position:fixed;left:1000rem}}tui-textfield [tuiLabel][tuiLabel][tuiLabel]{transition-property:all;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative;display:block;flex:1;align-self:flex-start;font-size:inherit;line-height:var(--t-height);transition-duration:inherit}tui-textfield label:defined,tui-textfield input:defined::placeholder,tui-textfield textarea:defined::placeholder,tui-textfield select:defined._empty{color:var(--tui-text-secondary)}tui-textfield select:not([data-mode~=readonly]){cursor:pointer}tui-textfield select option[value=\"\"]:disabled{color:transparent}tui-textfield select optgroup,tui-textfield select option{background-color:var(--tui-background-elevation-3)}tui-textfield select optgroup,tui-textfield select option:not(:disabled){color:var(--tui-text-primary)}tui-textfield button,tui-textfield a{pointer-events:auto}tui-textfield>.t-content{z-index:1;display:flex;block-size:var(--t-height);align-items:center;gap:inherit;margin-inline-start:auto;isolation:isolate;border-radius:inherit}tui-textfield>.t-content>tui-icon{pointer-events:auto}tui-textfield textarea~.t-content{min-inline-size:.5rem}tui-textfield .t-clear{z-index:1;display:none;pointer-events:auto}tui-textfield>.t-filler:defined{pointer-events:none;color:var(--tui-text-tertiary);opacity:1}tui-textfield [tuiFluidTypography]{font-weight:700}tui-textfield [tuiSelectLike]:not(:read-only){cursor:pointer}tui-textfield:has(input[type=tel]){direction:ltr}\n"] }]
321
- }] });
322
-
323
- // TODO: Drop in v5 after updated Angular and hostDirectives inherit
324
- class TuiTextfieldBase {
325
- constructor() {
326
- // TODO: refactor to signal inputs after Angular update
327
- this.focused = signal(null);
328
- this.control = inject(NgControl, { optional: true });
329
- this.a = tuiAppearance(inject(TUI_TEXTFIELD_OPTIONS).appearance, {});
330
- this.s = tuiAppearanceState(null, {});
331
- this.m = tuiAppearanceMode(this.mode, {});
332
- this.f = tuiAppearanceFocus(computed(() => this.focused() ?? this.textfield.focused()), {});
333
- this.el = tuiInjectElement();
334
- this.handlers = inject(TUI_ITEMS_HANDLERS);
335
- this.textfield = inject(TuiTextfieldComponent);
336
- this.readOnly = false;
337
- this.invalid = null;
338
- this.value = tuiValue(this.el);
339
- }
340
- set focusedSetter(focused) {
341
- this.focused.set(focused);
342
- }
343
- set stateSetter(state) {
344
- this.s.set(state);
345
- }
346
- get mode() {
347
- if (this.readOnly) {
348
- return 'readonly';
349
- }
350
- if (this.invalid === false) {
351
- return 'valid';
352
- }
353
- if (this.invalid) {
354
- return 'invalid';
355
- }
356
- return null;
357
- }
358
- // TODO: refactor to signal inputs after Angular update
359
- ngOnChanges() {
360
- this.m.set(this.mode);
361
- }
362
- setValue(value) {
363
- this.el.focus();
364
- this.el.select();
365
- if (value == null) {
366
- this.el.ownerDocument.execCommand('delete');
367
- // see https://github.com/taiga-family/taiga-ui/issues/11634
368
- // ensure non-erasable affixes actually deleted
369
- this.el.value = '';
370
- }
371
- else {
372
- this.el.ownerDocument.execCommand('insertText', false, this.handlers.stringify()(value));
373
- }
374
- }
375
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTextfieldBase, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
376
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TuiTextfieldBase, isStandalone: true, inputs: { readOnly: "readOnly", invalid: "invalid", focusedSetter: ["focused", "focusedSetter"], stateSetter: ["state", "stateSetter"] }, host: { attributes: { "tuiTextfield": "" }, listeners: { "input": "0", "focusin": "0", "focusout": "0" }, properties: { "id": "textfield.id", "readOnly": "readOnly", "class._empty": "value() === \"\"" } }, providers: [tuiAsTextfieldAccessor(TuiTextfieldBase)], usesOnChanges: true, ngImport: i0 }); }
377
- }
378
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTextfieldBase, decorators: [{
379
- type: Directive,
380
- args: [{
381
- standalone: true,
382
- providers: [tuiAsTextfieldAccessor(TuiTextfieldBase)],
383
- host: {
384
- tuiTextfield: '',
385
- '[id]': 'textfield.id',
386
- '[readOnly]': 'readOnly',
387
- '[class._empty]': 'value() === ""',
388
- '(input)': '0',
389
- '(focusin)': '0',
390
- '(focusout)': '0',
391
- },
392
- }]
393
- }], propDecorators: { readOnly: [{
394
- type: Input
395
- }], invalid: [{
396
- type: Input
397
- }], focusedSetter: [{
398
- type: Input,
399
- args: ['focused']
400
- }], stateSetter: [{
401
- type: Input,
402
- args: ['state']
403
- }] } });
404
- class TuiTextfieldDirective extends TuiTextfieldBase {
405
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTextfieldDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
406
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TuiTextfieldDirective, isStandalone: true, selector: "input[tuiTextfield]:not([tuiInputCard]):not([tuiInputExpire]):not([tuiInputCVC])", providers: [
407
- tuiAsTextfieldAccessor(TuiTextfieldDirective),
408
- tuiProvide(TuiTextfieldBase, TuiTextfieldDirective),
409
- ], usesInheritance: true, hostDirectives: [{ directive: i1$1.TuiNativeValidator }, { directive: i2$1.TuiAppearance }], ngImport: i0 }); }
410
- }
411
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTextfieldDirective, decorators: [{
412
- type: Directive,
413
- args: [{
414
- standalone: true,
415
- // TODO: Remove :not in v.5
416
- selector: 'input[tuiTextfield]:not([tuiInputCard]):not([tuiInputExpire]):not([tuiInputCVC])',
417
- providers: [
418
- tuiAsTextfieldAccessor(TuiTextfieldDirective),
419
- tuiProvide(TuiTextfieldBase, TuiTextfieldDirective),
420
- ],
421
- hostDirectives: [TuiNativeValidator, TuiAppearance],
422
- }]
423
- }] });
424
- class TuiWithTextfield {
425
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiWithTextfield, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
426
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TuiWithTextfield, isStandalone: true, hostDirectives: [{ directive: TuiTextfieldDirective, inputs: ["invalid", "invalid", "focused", "focused", "readOnly", "readOnly", "state", "state"] }], ngImport: i0 }); }
427
- }
428
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiWithTextfield, decorators: [{
429
- type: Directive,
430
- args: [{
431
- standalone: true,
432
- hostDirectives: [
433
- {
434
- directive: TuiTextfieldDirective,
435
- inputs: ['invalid', 'focused', 'readOnly', 'state'],
436
- },
437
- ],
438
- }]
439
- }] });
440
-
441
- /**
442
- * @deprecated use {@link TuiSelect} from @taiga-ui/kit instead, drop in v5
443
- */
444
- class TuiSelect extends TuiTextfieldBase {
445
- constructor() {
446
- super(...arguments);
447
- this.nav = inject(WA_NAVIGATOR);
448
- this.doc = inject(DOCUMENT);
449
- this.placeholder = '';
450
- }
451
- setValue(value) {
452
- this.control?.control?.setValue(value);
453
- this.el.dispatchEvent(new Event('input', { bubbles: true }));
454
- }
455
- focus() {
456
- this.el.classList.add('_ios-fix');
457
- this.el.focus();
458
- this.el.classList.remove('_ios-fix');
459
- }
460
- get ariaLabel() {
461
- return this.doc.querySelector(`label[for="${this.el.id}"]`)
462
- ? null
463
- : this.el.getAttribute('aria-label') || this.placeholder;
464
- }
465
- get stringified() {
466
- return this.handlers.stringify()(this.control?.value ?? '');
467
- }
468
- async onCopy() {
469
- await this.nav.clipboard.writeText(this.stringified);
470
- }
471
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiSelect, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
472
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiSelect, isStandalone: true, selector: "select[tuiTextfield]", inputs: { placeholder: "placeholder" }, host: { listeners: { "input": "0", "focusin": "0", "focusout": "0", "keydown.space.prevent": "0", "keydown.enter.prevent": "0", "keydown.backspace": "setValue(\"\")", "mousedown.prevent": "focus()", "keydown.control.c": "onCopy()", "keydown.meta.c": "onCopy()" }, properties: { "id": "textfield.id", "class._empty": "stringified === \"\"", "attr.aria-label": "ariaLabel" } }, providers: [tuiAsTextfieldAccessor(TuiSelect)], usesInheritance: true, hostDirectives: [{ directive: i1$1.TuiNativeValidator }, { directive: i2$1.TuiAppearance }], ngImport: i0, template: "<option\n *ngIf=\"placeholder && !stringified; else selected\"\n disabled\n selected\n value=\"\"\n>\n {{ placeholder }}\n</option>\n<ng-template #selected>\n <option\n *ngFor=\"let item of [stringified]\"\n selected\n [value]=\"item\"\n >\n {{ item }}\n </option>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.Default }); }
473
- }
474
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiSelect, decorators: [{
475
- type: Component,
476
- args: [{ standalone: true, selector: 'select[tuiTextfield]', imports: [NgFor, NgIf], changeDetection: ChangeDetectionStrategy.Default, providers: [tuiAsTextfieldAccessor(TuiSelect)], hostDirectives: [TuiNativeValidator, TuiAppearance], host: {
477
- '[id]': 'textfield.id',
478
- '[class._empty]': 'stringified === ""',
479
- '[attr.aria-label]': 'ariaLabel',
480
- '(input)': '0',
481
- '(focusin)': '0',
482
- '(focusout)': '0',
483
- '(keydown.space.prevent)': '0',
484
- '(keydown.enter.prevent)': '0',
485
- '(keydown.backspace)': 'setValue("")',
486
- '(mousedown.prevent)': 'focus()',
487
- '(keydown.control.c)': 'onCopy()',
488
- '(keydown.meta.c)': 'onCopy()',
489
- }, template: "<option\n *ngIf=\"placeholder && !stringified; else selected\"\n disabled\n selected\n value=\"\"\n>\n {{ placeholder }}\n</option>\n<ng-template #selected>\n <option\n *ngFor=\"let item of [stringified]\"\n selected\n [value]=\"item\"\n >\n {{ item }}\n </option>\n</ng-template>\n" }]
490
- }], propDecorators: { placeholder: [{
491
- type: Input
492
- }] } });
218
+ '(tuiActiveZoneChange)': '!$event && control()?.valueAccessor?.onTouched?.()',
219
+ }, template: "@if (control()?.control?.valueChanges | async) {}\n<ng-content select=\"input\" />\n<ng-content select=\"select\" />\n<ng-content select=\"textarea\" />\n<ng-content select=\"label\" />\n<span\n class=\"t-content\"\n (pointerdown)=\"input()?.nativeElement?.focus()\"\n (waResizeObserver)=\"$event[0] && onResize($event[0])\"\n>\n <ng-content />\n <ng-container #vcr />\n @if (options.cleaner()) {\n <button\n appearance=\"icon\"\n size=\"xs\"\n tabindex=\"-1\"\n tuiIconButton\n type=\"button\"\n class=\"t-clear\"\n [iconStart]=\"icons.close\"\n (click)=\"accessor()?.setValue(null)\"\n (pointerdown.zoneless.prevent)=\"input()?.nativeElement?.focus()\"\n >\n {{ clear() }}\n </button>\n }\n <ng-content select=\"tui-icon\" />\n</span>\n@if (control()?.value != null) {\n <span class=\"t-template\">\n <ng-container *polymorpheusOutlet=\"content() as text; context: {$implicit: control()?.value}\">\n {{ text }}\n </ng-container>\n </span>\n}\n@if (showFiller()) {\n <input\n #ghost\n aria-hidden=\"true\"\n disabled\n class=\"t-filler\"\n [value]=\"computedFiller()\"\n />\n}\n", styles: ["tui-textfield{scrollbar-width:none;-ms-overflow-style:none;transition-property:color;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;--t-height: var(--tui-height-l);--t-padding: var(--tui-padding-l);--t-label-y: -.75rem;--t-label-font: var(--tui-font-text-s);--t-end: 0rem;--t-start: 0rem;position:relative;display:flex;flex-wrap:wrap;align-items:center;cursor:pointer;min-block-size:var(--t-height);padding:0 var(--t-padding);border-radius:var(--tui-radius-l);font:var(--tui-font-text-ui-m);line-height:1.25rem;box-sizing:border-box;gap:0 .25rem;isolation:isolate}tui-textfield::-webkit-scrollbar,tui-textfield::-webkit-scrollbar-thumb{display:none}tui-textfield[tuiIcons]:read-only{color:var(--tui-text-tertiary)}tui-textfield[data-icon-start]{--t-start: 2.25rem}tui-textfield[data-icon-end]{--t-end: 2.25rem}tui-textfield[tuiIcons]:after{position:relative;block-size:auto;align-self:stretch;border-inline:var(--t-padding) solid transparent;margin:0 calc(-1 * var(--t-padding))}tui-textfield::-webkit-resizer{border:.25rem solid transparent;inline-size:.5rem;block-size:.5rem;box-sizing:content-box;color:var(--tui-text-tertiary);background:linear-gradient(-45deg,transparent,transparent .125rem,currentColor .125rem,currentColor .1875rem,transparent .1875rem,transparent .25rem,currentColor .25rem,currentColor .3125rem,transparent .35rem);background-clip:content-box}tui-textfield label,tui-textfield>.t-content,tui-textfield>.t-template{pointer-events:none}tui-textfield input,tui-textfield select,tui-textfield textarea{font:inherit;resize:none;outline:none;padding-block:1.125rem;color:var(--tui-text-primary)}tui-textfield input[inputmode=none],tui-textfield select[inputmode=none],tui-textfield textarea[inputmode=none]{caret-color:transparent}tui-textfield[data-size=s]{--t-height: var(--tui-height-s);--t-padding: var(--tui-padding-s);border-radius:var(--tui-radius-m);gap:0;font:var(--tui-font-text-ui-s);line-height:1rem}tui-textfield[data-size=s][data-icon-start]{--t-start: 1.25rem}tui-textfield[data-size=s][data-icon-end]{--t-end: 1.25rem}tui-textfield[data-size=s]:before{margin-inline:-.125rem .5rem;font-size:1rem}tui-textfield[data-size=s]:after{margin-inline:calc(.625rem - var(--t-padding)) calc(-.125rem - var(--t-padding));font-size:1rem}tui-textfield[data-size=s] input,tui-textfield[data-size=s] select,tui-textfield[data-size=s] textarea{padding-block:.5rem}tui-textfield[data-size=s]>.t-content{margin-inline-end:-.375rem}tui-textfield[data-size=m]{--t-height: var(--tui-height-m);--t-padding: var(--tui-padding-m);--t-label-font: var(--tui-font-text-xs);--t-label-y: -.5625rem;border-radius:var(--tui-radius-m);font:var(--tui-font-text-ui-s);line-height:1rem}tui-textfield[data-size=m][data-icon-start]{--t-start: 1.75rem}tui-textfield[data-size=m][data-icon-end]{--t-end: 1.75rem}tui-textfield[data-size=m]:before{margin-inline:-.125rem .125rem}tui-textfield[data-size=m]:after{margin-inline:calc(.25rem - var(--t-padding)) calc(-.125rem - var(--t-padding))}tui-textfield[data-size=m] input,tui-textfield[data-size=m] select,tui-textfield[data-size=m] textarea{padding-block:.875rem}tui-textfield[data-size=m]>.t-content{margin-inline-end:-.125rem}tui-textfield[data-size=l]{--t-label: -.7rem}tui-textfield[tuiIcons]:hover{color:var(--tui-text-secondary)}tui-textfield[tuiIcons]:hover:has(input:read-only):not([multi]),tui-textfield[tuiIcons]:hover:has(textarea:read-only),tui-textfield[tuiIcons]:hover:has(select[data-mode~=readonly]){color:var(--tui-text-tertiary)}tui-textfield:before{z-index:1;margin-inline-end:.5rem;pointer-events:none}tui-textfield:has(:disabled:not(.t-filler,button,option,[tuiChip])):before,tui-textfield:has(:disabled:not(.t-filler,button,option,[tuiChip])):after,tui-textfield:has(:disabled:not(.t-filler,button,option,[tuiChip]))>.t-template{opacity:var(--tui-disabled-opacity)}tui-textfield._disabled:before,tui-textfield._disabled:after,tui-textfield._disabled>.t-template{opacity:var(--tui-disabled-opacity)}tui-textfield._with-label>.t-template,tui-textfield._with-label input:not([type=range]),tui-textfield._with-label select:defined,tui-textfield._with-label textarea:defined{padding-block:calc(var(--t-height) / 3) 0}tui-textfield:not([data-focus=true])._with-label>.t-template::placeholder,tui-textfield:not([data-focus=true])._with-label input:not([type=range])::placeholder,tui-textfield:not([data-focus=true])._with-label select:defined::placeholder,tui-textfield:not([data-focus=true])._with-label textarea:defined::placeholder,tui-textfield:not([data-focus=true])._with-label>.t-template._empty,tui-textfield:not([data-focus=true])._with-label input:not([type=range])._empty,tui-textfield:not([data-focus=true])._with-label select:defined._empty,tui-textfield:not([data-focus=true])._with-label textarea:defined._empty{color:transparent}tui-textfield>.t-template,tui-textfield input:defined,tui-textfield select:defined,tui-textfield textarea:defined{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;-webkit-appearance:none;appearance:none;box-sizing:border-box;border-radius:inherit;border-width:0;overscroll-behavior:none;padding-inline:calc(var(--t-start, 0rem) + var(--t-padding)) calc(var(--t-end, 0rem) + var(--t-side) + var(--t-padding))}tui-textfield>.t-template:disabled,tui-textfield input:defined:disabled,tui-textfield select:defined:disabled,tui-textfield textarea:defined:disabled{animation:tuiPresent 1s infinite}tui-textfield>.t-template{display:flex;align-items:center;color:var(--tui-text-primary)}tui-textfield._with-template input:first-of-type,tui-textfield._with-template select,tui-textfield._with-template textarea{color:transparent!important}tui-textfield input:not([type=range]),tui-textfield select:defined,tui-textfield textarea:defined{pointer-events:auto;background:none}tui-textfield input:not([type=range]):not(select):read-only~.t-filler,tui-textfield select:defined:not(select):read-only~.t-filler,tui-textfield textarea:defined:not(select):read-only~.t-filler{display:none}tui-textfield input:not([type=range]):disabled~label,tui-textfield select:defined:disabled~label,tui-textfield textarea:defined:disabled~label,tui-textfield input:not([type=range]):disabled~.t-content,tui-textfield select:defined:disabled~.t-content,tui-textfield textarea:defined:disabled~.t-content{opacity:var(--tui-disabled-opacity)}tui-textfield input:not([type=range]):disabled~label>tui-icon,tui-textfield select:defined:disabled~label>tui-icon,tui-textfield textarea:defined:disabled~label>tui-icon,tui-textfield input:not([type=range]):disabled~.t-content>tui-icon,tui-textfield select:defined:disabled~.t-content>tui-icon,tui-textfield textarea:defined:disabled~.t-content>tui-icon{display:none}tui-textfield input:not([type=range]):-webkit-autofill~label,tui-textfield select:defined:-webkit-autofill~label,tui-textfield textarea:defined:-webkit-autofill~label,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown)~label,tui-textfield select:defined:not(._empty):not(:placeholder-shown)~label,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown)~label{font:var(--t-label-font);line-height:var(--t-height);transform:translateY(var(--t-label-y))}tui-textfield input:not([type=range]):-webkit-autofill:not(:disabled)[data-mode~=invalid]~label,tui-textfield select:defined:-webkit-autofill:not(:disabled)[data-mode~=invalid]~label,tui-textfield textarea:defined:-webkit-autofill:not(:disabled)[data-mode~=invalid]~label,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown):not(:disabled)[data-mode~=invalid]~label,tui-textfield select:defined:not(._empty):not(:placeholder-shown):not(:disabled)[data-mode~=invalid]~label,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown):not(:disabled)[data-mode~=invalid]~label,tui-textfield input:not([type=range]):-webkit-autofill:invalid:not(:disabled):not([data-mode])~label,tui-textfield select:defined:-webkit-autofill:invalid:not(:disabled):not([data-mode])~label,tui-textfield textarea:defined:-webkit-autofill:invalid:not(:disabled):not([data-mode])~label,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown):invalid:not(:disabled):not([data-mode])~label,tui-textfield select:defined:not(._empty):not(:placeholder-shown):invalid:not(:disabled):not([data-mode])~label,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown):invalid:not(:disabled):not([data-mode])~label{color:var(--tui-text-negative)}tui-textfield input:not([type=range]):-webkit-autofill:not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield select:defined:-webkit-autofill:not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield textarea:defined:-webkit-autofill:not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown):not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield select:defined:not(._empty):not(:placeholder-shown):not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown):not(:disabled):not([data-mode~=readonly])~.t-content .t-clear{display:flex}tui-textfield input:not([type=range]):not([data-mode~=readonly]):focus-visible:not([data-focus=false])::placeholder,tui-textfield select:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])::placeholder,tui-textfield textarea:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])::placeholder,tui-textfield input:not([type=range]):not([data-mode~=readonly]):focus-visible:not([data-focus=false])._empty,tui-textfield select:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])._empty,tui-textfield textarea:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])._empty{color:var(--tui-text-tertiary)}tui-textfield input:not([type=range]):not([data-mode~=readonly]):focus-visible:not([data-focus=false])~label,tui-textfield select:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])~label,tui-textfield textarea:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])~label{color:var(--tui-text-primary)!important;font:var(--t-label-font);line-height:var(--t-height);transform:translateY(var(--t-label-y))}tui-textfield input:not([type=range]):not([data-mode~=readonly])[data-focus=true]::placeholder,tui-textfield select:defined:not([data-mode~=readonly])[data-focus=true]::placeholder,tui-textfield textarea:defined:not([data-mode~=readonly])[data-focus=true]::placeholder,tui-textfield input:not([type=range]):not([data-mode~=readonly])[data-focus=true]._empty,tui-textfield select:defined:not([data-mode~=readonly])[data-focus=true]._empty,tui-textfield textarea:defined:not([data-mode~=readonly])[data-focus=true]._empty{color:var(--tui-text-tertiary)}tui-textfield input:not([type=range]):not([data-mode~=readonly])[data-focus=true]~label,tui-textfield select:defined:not([data-mode~=readonly])[data-focus=true]~label,tui-textfield textarea:defined:not([data-mode~=readonly])[data-focus=true]~label{color:var(--tui-text-primary)!important;font:var(--t-label-font);line-height:var(--t-height);transform:translateY(var(--t-label-y))}tui-textfield [tuiLabel][tuiLabel][tuiLabel]{transition-property:all;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative;display:block;flex:1;align-self:flex-start;font-size:inherit;line-height:var(--t-height);transition-duration:inherit}tui-textfield label:defined,tui-textfield input:defined::placeholder,tui-textfield textarea:defined::placeholder,tui-textfield select:defined._empty{color:var(--tui-text-secondary)}tui-textfield select:not([data-mode~=readonly]){cursor:pointer}tui-textfield select option[value=\"\"]:disabled{color:transparent}tui-textfield select optgroup,tui-textfield select option{background-color:var(--tui-background-elevation-3)}tui-textfield select optgroup,tui-textfield select option:not(:disabled){color:var(--tui-text-primary)}tui-textfield button,tui-textfield a{pointer-events:auto}tui-textfield>.t-content{z-index:1;display:flex;block-size:var(--t-height);align-items:center;gap:inherit;margin-inline-start:auto;isolation:isolate;border-radius:inherit}tui-textfield>.t-content>tui-icon{pointer-events:auto}tui-textfield textarea~.t-content{min-inline-size:.5rem}tui-textfield .t-clear{z-index:1;display:none;pointer-events:auto}tui-textfield>.t-filler:defined{pointer-events:none!important;color:var(--tui-text-tertiary);opacity:1}tui-textfield [tuiFluidTypography]{font-weight:700}tui-textfield [tuiSelectLike]:not(:read-only){cursor:pointer}tui-textfield:has(input[type=tel]){direction:ltr}\n"] }]
220
+ }], ctorParameters: () => [] });
493
221
 
494
222
  /*
495
223
  * Internal wrapper for polymorpheus-context
@@ -500,50 +228,51 @@ class TuiTextfieldItemComponent {
500
228
  this.handlers = inject(TUI_ITEMS_HANDLERS);
501
229
  this.context = injectContext();
502
230
  this.textfield = inject(TuiTextfieldMultiComponent);
231
+ this.content = computed(() => this.textfield.item() ??
232
+ this.handlers.stringify()(this.context.$implicit.item));
503
233
  }
504
- get content() {
505
- return (this.textfield.item ?? this.handlers.stringify()(this.context.$implicit.item));
506
- }
507
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTextfieldItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
508
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiTextfieldItemComponent, isStandalone: true, selector: "tui-textfield-item", host: { listeners: { "pointerdown.self.prevent": "0", "keydown.arrowLeft.prevent": "el.previousElementSibling?.firstChild?.focus()", "keydown.arrowRight.prevent": "el.nextElementSibling?.firstChild?.focus()" }, properties: { "class._string": "!textfield.item", "class._disabled": "handlers.disabledItemHandler()(context.$implicit.item)" } }, ngImport: i0, template: '<ng-container *polymorpheusOutlet="content as text; context: context">{{ text }}</ng-container>', isInline: true, styles: [":host{max-inline-size:100%;flex-shrink:0;white-space:nowrap;text-overflow:ellipsis;color:var(--tui-text-primary)}:host._string{overflow:hidden}:host._string._disabled{opacity:var(--tui-disabled-opacity)}:host._string:after{content:\",\\a0\"}:host:last-of-type{max-inline-size:80%}:host-context(tui-textfield:not([data-focus=\"true\"])):last-of-type:after{display:none}:host-context(tui-textfield:has([tuiSelectLike])):last-of-type:after,:host-context(tui-textfield[data-mode~=\"readonly\"]):last-of-type:after{content:\"\\a0\"}\n"], dependencies: [{ kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }], changeDetection: i0.ChangeDetectionStrategy.Default }); }
234
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiTextfieldItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
235
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: TuiTextfieldItemComponent, isStandalone: true, selector: "tui-textfield-item", host: { listeners: { "pointerdown.self.prevent": "0", "keydown.arrowLeft.prevent": "el.previousElementSibling?.firstChild?.focus()", "keydown.arrowRight.prevent": "el.nextElementSibling?.firstChild?.focus()" }, properties: { "class._string": "!textfield.item()", "class._disabled": "handlers.disabledItemHandler()(context.$implicit.item)" } }, ngImport: i0, template: '<ng-container *polymorpheusOutlet="content() as text; context: context">{{ text }}</ng-container>', isInline: true, styles: [":host{max-inline-size:100%;flex-shrink:0;white-space:nowrap;text-overflow:ellipsis;color:var(--tui-text-primary)}:host._string{overflow:hidden}:host._string._disabled{opacity:var(--tui-disabled-opacity)}:host._string:after{content:\",\\a0\"}:host:last-of-type{max-inline-size:80%}:host-context(tui-textfield:not([data-focus=\"true\"])):last-of-type:after{display:none}:host-context(tui-textfield:has([tuiSelectLike])):last-of-type:after,:host-context(tui-textfield[data-mode~=\"readonly\"]):last-of-type:after{content:\"\\a0\"}\n"], dependencies: [{ kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }], changeDetection: i0.ChangeDetectionStrategy.Default }); }
509
236
  }
510
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTextfieldItemComponent, decorators: [{
237
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiTextfieldItemComponent, decorators: [{
511
238
  type: Component,
512
- args: [{ standalone: true, selector: 'tui-textfield-item', imports: [PolymorpheusOutlet], template: '<ng-container *polymorpheusOutlet="content as text; context: context">{{ text }}</ng-container>', changeDetection: ChangeDetectionStrategy.Default, host: {
513
- '[class._string]': '!textfield.item',
239
+ args: [{ selector: 'tui-textfield-item', imports: [PolymorpheusOutlet], template: '<ng-container *polymorpheusOutlet="content() as text; context: context">{{ text }}</ng-container>', changeDetection: ChangeDetectionStrategy.Default, host: {
240
+ '[class._string]': '!textfield.item()',
514
241
  '[class._disabled]': 'handlers.disabledItemHandler()(context.$implicit.item)',
515
242
  '(pointerdown.self.prevent)': '0',
516
243
  '(keydown.arrowLeft.prevent)': 'el.previousElementSibling?.firstChild?.focus()',
517
244
  '(keydown.arrowRight.prevent)': 'el.nextElementSibling?.firstChild?.focus()',
518
245
  }, styles: [":host{max-inline-size:100%;flex-shrink:0;white-space:nowrap;text-overflow:ellipsis;color:var(--tui-text-primary)}:host._string{overflow:hidden}:host._string._disabled{opacity:var(--tui-disabled-opacity)}:host._string:after{content:\",\\a0\"}:host:last-of-type{max-inline-size:80%}:host-context(tui-textfield:not([data-focus=\"true\"])):last-of-type:after{display:none}:host-context(tui-textfield:has([tuiSelectLike])):last-of-type:after,:host-context(tui-textfield[data-mode~=\"readonly\"]):last-of-type:after{content:\"\\a0\"}\n"] }]
519
246
  }] });
247
+ const TUI_TEXTFIELD_ITEM = new PolymorpheusComponent(TuiTextfieldItemComponent);
520
248
 
521
- class TuiTextfieldMultiComponent extends TuiTextfieldBaseComponent {
249
+ class TuiTextfieldMultiComponent extends TuiTextfieldComponent {
522
250
  constructor() {
523
251
  super(...arguments);
524
252
  this.height = signal(null);
525
- this.handlers = inject(TUI_ITEMS_HANDLERS$1);
526
- this.component = new PolymorpheusComponent(TuiTextfieldItemComponent);
253
+ this.handlers = inject(TUI_ITEMS_HANDLERS);
254
+ this.component = TUI_TEXTFIELD_ITEM;
527
255
  this.sub = fromEvent(this.el, 'scroll')
528
- .pipe(filter(() => this.rows === 1), tuiZonefree(), takeUntilDestroyed())
256
+ .pipe(filter(() => this.rows() === 1), tuiZonefree(), takeUntilDestroyed())
529
257
  .subscribe(() => {
530
258
  this.el.style.setProperty('--t-scroll', tuiPx(-1 * this.el.scrollLeft));
531
259
  });
532
- this.rows = 100;
260
+ this.cva = contentChild(TuiControl);
261
+ this.item = contentChild(TuiItem, { read: TemplateRef, descendants: true });
262
+ this.rows = input(100);
533
263
  }
534
264
  handleOption(option) {
535
- this.accessor?.setValue(tuiArrayToggle(this.control?.value ?? [], option, this.handlers.identityMatcher()));
265
+ this.accessor()?.setValue(tuiArrayToggle(this.control()?.value ?? [], option, this.handlers.identityMatcher()));
536
266
  }
537
267
  get placeholder() {
538
- const placeholder = this.input?.nativeElement.matches('input')
539
- ? this.input.nativeElement.placeholder
540
- : this.computedFiller();
268
+ const el = this.input()?.nativeElement;
269
+ const placeholder = el?.matches('input') ? el.placeholder : this.computedFiller();
541
270
  const value = this.computedFiller() || this.value();
542
271
  const longer = value.length > placeholder.length ? value : placeholder;
543
272
  return this.focused() ? longer : '';
544
273
  }
545
274
  onItems({ target }) {
546
- const height = this.rows > 1 && this.control?.value?.length
275
+ const height = this.rows() > 1 && this.control()?.value?.length
547
276
  ? (target.querySelector('tui-textfield-item')?.clientHeight ?? 0)
548
277
  : null;
549
278
  if (height !== 0) {
@@ -559,34 +288,32 @@ class TuiTextfieldMultiComponent extends TuiTextfieldBaseComponent {
559
288
  }
560
289
  onClick(target) {
561
290
  if (target === this.el ||
562
- !this.cva?.interactive() ||
291
+ !this.cva()?.interactive() ||
563
292
  (!this.el.matches('[tuiChevron]') &&
564
293
  !this.el.querySelector('select, [tuiInputDateMulti]')) ||
565
294
  target.matches('input:read-only,input[inputmode="none"]')) {
566
295
  return;
567
296
  }
568
- this.open.update((open) => !open);
297
+ this.open.open.update((open) => !open);
569
298
  try {
570
- this.input?.nativeElement.showPicker?.();
299
+ this.input()?.nativeElement.showPicker?.();
571
300
  }
572
301
  catch {
573
302
  // Empty catch block - silently ignore showPicker errors
574
303
  }
575
304
  }
576
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTextfieldMultiComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
577
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiTextfieldMultiComponent, isStandalone: true, selector: "tui-textfield[multi]", inputs: { rows: "rows" }, host: { listeners: { "click.prevent": "onClick($event.target)", "tuiActiveZoneChange": "!$event && (el.scrollTo({left: 0}) || cva?.onTouched())", "pointerdown.self.prevent": "onIconClick()", "scroll.capture.zoneless": "onScroll($event.target)" }, properties: { "attr.data-state": "control?.disabled ? \"disabled\" : null", "class._empty": "!control?.value?.length", "style.--t-item-height.px": "height()", "style.--t-rows": "rows", "attr.data-size": "options.size()", "class._with-label": "hasLabel", "class._with-template": "content && control?.value != null", "class._disabled": "input?.nativeElement?.disabled" }, classAttribute: "tui-interactive" }, providers: [
305
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiTextfieldMultiComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
306
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: TuiTextfieldMultiComponent, isStandalone: true, selector: "tui-textfield[multi]", inputs: { rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click.prevent": "onClick($event.target)", "tuiActiveZoneChange": "!$event && el.scrollTo({left: 0})" }, properties: { "attr.data-state": "control()?.disabled ? \"disabled\" : null", "class._empty": "!control()?.value?.length", "style.--t-item-height.px": "height()", "style.--t-rows": "rows()" } }, providers: [
578
307
  tuiButtonOptionsProvider({ size: 'xs', appearance: 'icon' }),
579
308
  tuiAsDataListHost(TuiTextfieldMultiComponent),
580
309
  tuiProvide(TuiTextfieldComponent, TuiTextfieldMultiComponent),
581
310
  tuiProvide(TUI_SCROLL_REF, ElementRef),
582
- ], queries: [{ propertyName: "item", first: true, predicate: TuiItem, descendants: true, read: TemplateRef }], usesInheritance: true, hostDirectives: [{ directive: i1.TuiDropdownFixed }, { directive: i1.TuiDropdownDirective }, { directive: i1.TuiWithDropdownOpen }, { directive: TuiWithTextfieldDropdown }, { directive: i2.TuiWithIcons }, { directive: i4$1.TuiWithItemsHandlers }, { directive: i4.TuiWithOptionContent }, { directive: i4$1.TuiWithAppearance }], ngImport: i0, template: "<ng-container *ngIf=\"control?.control?.valueChanges | async\" />\n<tui-scroll-controls\n *ngIf=\"rows > 1\"\n class=\"t-scrollbar\"\n/>\n\n<div\n class=\"t-items\"\n [class.t-items_horizontal]=\"rows === 1\"\n (click)=\"input?.nativeElement?.focus()\"\n (pointerdown.self.zoneless.prevent)=\"(0)\"\n (waResizeObserver)=\"$event[0] && onItems($event[0])\"\n>\n <ng-content select=\"label\" />\n <ng-template\n *ngFor=\"let item of control?.value; let index = index\"\n [polymorpheusOutlet]=\"component\"\n [polymorpheusOutletContext]=\"{$implicit: {item, index}}\"\n />\n <span\n class=\"t-input\"\n (keydown.arrowLeft)=\"onLeft($event)\"\n >\n <ng-content select=\"input\" />\n <ng-content select=\"select\" />\n <span class=\"t-ghost\">{{ placeholder }}</span>\n <input\n aria-hidden=\"true\"\n disabled\n class=\"t-filler\"\n [class.t-filler_hidden]=\"!showFiller()\"\n [value]=\"computedFiller()\"\n />\n </span>\n</div>\n\n<span\n class=\"t-content\"\n (click.stop)=\"input?.nativeElement?.focus()\"\n (pointerdown.zoneless.prevent)=\"(0)\"\n (waResizeObserver)=\"$event[0] && onResize($event[0])\"\n>\n <ng-content />\n <button\n *ngIf=\"options.cleaner()\"\n appearance=\"icon\"\n size=\"xs\"\n tabindex=\"-1\"\n tuiIconButton\n type=\"button\"\n class=\"t-clear\"\n [iconStart]=\"icons.close\"\n (click)=\"accessor?.setValue([])\"\n >\n {{ clear() }}\n </button>\n <ng-container #vcr />\n <ng-content select=\"tui-icon\" />\n</span>\n\n<span\n *ngIf=\"control?.value != null\"\n class=\"t-template\"\n>\n <ng-container *polymorpheusOutlet=\"content as text; context: {$implicit: control?.value}\">\n {{ text }}\n </ng-container>\n</span>\n", styles: ["tui-textfield{scrollbar-width:none;-ms-overflow-style:none;transition-property:color;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;--t-height: var(--tui-height-l);--t-padding: var(--tui-padding-l);--t-label: -.7em;--t-label-size: .83em;--t-end: 0rem;--t-start: 0rem;position:relative;display:flex;flex-wrap:wrap;align-items:center;cursor:pointer;min-block-size:var(--t-height);padding:0 var(--t-padding);border-radius:var(--tui-radius-l);font:var(--tui-font-text-ui-m);line-height:1.25rem;box-sizing:border-box;gap:0 .25rem;isolation:isolate}tui-textfield::-webkit-scrollbar,tui-textfield::-webkit-scrollbar-thumb{display:none}tui-textfield[tuiIcons]:read-only{color:var(--tui-text-tertiary)}tui-textfield[style*=\"--t-icon-start:\"]{--t-start: 2.25rem}tui-textfield[style*=\"--t-icon-end:\"]{--t-end: 2.25rem}tui-textfield[tuiIcons]:after{position:relative;block-size:auto;align-self:stretch;border-inline-start:var(--t-padding) solid transparent;border-inline-end:var(--t-padding) solid transparent;margin:0 calc(-1 * var(--t-padding))}tui-textfield::-webkit-resizer{border:.25rem solid transparent;inline-size:.5rem;block-size:.5rem;box-sizing:content-box;color:var(--tui-text-tertiary);background:linear-gradient(-45deg,transparent,transparent .125rem,currentColor .125rem,currentColor .1875rem,transparent .1875rem,transparent .25rem,currentColor .25rem,currentColor .3125rem,transparent .35rem);background-clip:content-box}tui-textfield label,tui-textfield>.t-content,tui-textfield>.t-template{pointer-events:none}tui-textfield input,tui-textfield select,tui-textfield textarea{font:inherit;resize:none;outline:none;padding-block-start:1.125rem;padding-block-end:1.125rem;color:var(--tui-text-primary)}tui-textfield input[inputmode=none],tui-textfield select[inputmode=none],tui-textfield textarea[inputmode=none]{caret-color:transparent}tui-textfield[data-size=s]{--t-height: var(--tui-height-s);--t-padding: var(--tui-padding-s);border-radius:var(--tui-radius-m);gap:0;font:var(--tui-font-text-ui-s);line-height:1rem}tui-textfield[data-size=s][style*=\"--t-icon-start:\"]{--t-start: 1.25rem}tui-textfield[data-size=s][style*=\"--t-icon-end:\"]{--t-end: 1.25rem}tui-textfield[data-size=s]:before{margin-inline-end:.5rem;margin-inline-start:-.125rem;font-size:1rem}tui-textfield[data-size=s]:after{margin-inline-end:calc(-.125rem - var(--t-padding));margin-inline-start:calc(.625rem - var(--t-padding));font-size:1rem}tui-textfield[data-size=s] input,tui-textfield[data-size=s] select,tui-textfield[data-size=s] textarea{padding-block-start:.5rem;padding-block-end:.5rem}tui-textfield[data-size=s]>.t-content{margin-inline-end:-.375rem}tui-textfield[data-size=m]{--t-height: var(--tui-height-m);--t-padding: var(--tui-padding-m);border-radius:var(--tui-radius-m);font:var(--tui-font-text-ui-s);line-height:1rem}tui-textfield[data-size=m][style*=\"--t-icon-start:\"]{--t-start: 1.75rem}tui-textfield[data-size=m][style*=\"--t-icon-end:\"]{--t-end: 1.75rem}tui-textfield[data-size=m]:before{margin-inline-start:-.125rem;margin-inline-end:.125rem}tui-textfield[data-size=m]:after{margin-inline-start:calc(.25rem - var(--t-padding));margin-inline-end:calc(-.125rem - var(--t-padding))}tui-textfield[data-size=m] input,tui-textfield[data-size=m] select,tui-textfield[data-size=m] textarea{padding-block-start:.875rem;padding-block-end:.875rem}tui-textfield[data-size=m]>.t-content{margin-inline-end:-.125rem}tui-textfield[data-size=l]{--t-label: -.7rem}tui-textfield[tuiIcons]:hover{color:var(--tui-text-secondary)}tui-textfield[tuiIcons]:hover:has(input:read-only):not([multi]),tui-textfield[tuiIcons]:hover:has(textarea:read-only),tui-textfield[tuiIcons]:hover:has(select[data-mode~=readonly]){color:var(--tui-text-tertiary)}tui-textfield:before{z-index:1;margin-inline-end:.5rem;pointer-events:none}tui-textfield:has(:disabled:not(.t-filler,button,option,[tuiChip])):before,tui-textfield:has(:disabled:not(.t-filler,button,option,[tuiChip])):after,tui-textfield:has(:disabled:not(.t-filler,button,option,[tuiChip]))>.t-template{opacity:var(--tui-disabled-opacity)}tui-textfield._disabled:before,tui-textfield._disabled:after,tui-textfield._disabled>.t-template{opacity:var(--tui-disabled-opacity)}tui-textfield:has(label:not(:empty))>.t-template,tui-textfield:has(label:not(:empty)) input:not([type=range]),tui-textfield:has(label:not(:empty)) select:defined,tui-textfield:has(label:not(:empty)) textarea:defined{padding-block-start:calc(var(--t-height) / 3);padding-block-end:0}tui-textfield:not([data-focus=true]):has(label:not(:empty))>.t-template::placeholder,tui-textfield:not([data-focus=true]):has(label:not(:empty)) input:not([type=range])::placeholder,tui-textfield:not([data-focus=true]):has(label:not(:empty)) select:defined::placeholder,tui-textfield:not([data-focus=true]):has(label:not(:empty)) textarea:defined::placeholder,tui-textfield:not([data-focus=true]):has(label:not(:empty))>.t-template._empty,tui-textfield:not([data-focus=true]):has(label:not(:empty)) input:not([type=range])._empty,tui-textfield:not([data-focus=true]):has(label:not(:empty)) select:defined._empty,tui-textfield:not([data-focus=true]):has(label:not(:empty)) textarea:defined._empty{color:transparent}tui-textfield._with-label>.t-template,tui-textfield._with-label input:not([type=range]),tui-textfield._with-label select:defined,tui-textfield._with-label textarea:defined{padding-block-start:calc(var(--t-height) / 3);padding-block-end:0}tui-textfield:not([data-focus=true])._with-label>.t-template::placeholder,tui-textfield:not([data-focus=true])._with-label input:not([type=range])::placeholder,tui-textfield:not([data-focus=true])._with-label select:defined::placeholder,tui-textfield:not([data-focus=true])._with-label textarea:defined::placeholder,tui-textfield:not([data-focus=true])._with-label>.t-template._empty,tui-textfield:not([data-focus=true])._with-label input:not([type=range])._empty,tui-textfield:not([data-focus=true])._with-label select:defined._empty,tui-textfield:not([data-focus=true])._with-label textarea:defined._empty{color:transparent}tui-textfield>.t-template,tui-textfield input:defined,tui-textfield select:defined,tui-textfield textarea:defined{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;-webkit-appearance:none;appearance:none;box-sizing:border-box;border-radius:inherit;border-width:0;overscroll-behavior:none;padding-inline-start:calc(var(--t-start, 0rem) + var(--t-padding));padding-inline-end:calc(var(--t-end, 0rem) + var(--t-side) + var(--t-padding))}tui-textfield>.t-template{display:flex;align-items:center;color:var(--tui-text-primary)}tui-textfield._with-template input:first-of-type,tui-textfield._with-template select,tui-textfield._with-template textarea{color:transparent!important}tui-textfield input:not([type=range]),tui-textfield select:defined,tui-textfield textarea:defined{pointer-events:auto;background:none}tui-textfield input:not([type=range]):not(select):read-only~.t-filler,tui-textfield select:defined:not(select):read-only~.t-filler,tui-textfield textarea:defined:not(select):read-only~.t-filler{display:none}tui-textfield input:not([type=range]):disabled~label,tui-textfield select:defined:disabled~label,tui-textfield textarea:defined:disabled~label,tui-textfield input:not([type=range]):disabled~.t-content,tui-textfield select:defined:disabled~.t-content,tui-textfield textarea:defined:disabled~.t-content{opacity:var(--tui-disabled-opacity)}tui-textfield input:not([type=range]):disabled~label>tui-icon,tui-textfield select:defined:disabled~label>tui-icon,tui-textfield textarea:defined:disabled~label>tui-icon,tui-textfield input:not([type=range]):disabled~.t-content>tui-icon,tui-textfield select:defined:disabled~.t-content>tui-icon,tui-textfield textarea:defined:disabled~.t-content>tui-icon{display:none}tui-textfield input:not([type=range]):-webkit-autofill~label,tui-textfield select:defined:-webkit-autofill~label,tui-textfield textarea:defined:-webkit-autofill~label,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown)~label,tui-textfield select:defined:not(._empty):not(:placeholder-shown)~label,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown)~label{font-size:var(--t-label-size);transform:translateY(var(--t-label))}tui-textfield input:not([type=range]):-webkit-autofill:not(:disabled)[data-mode~=invalid]~label,tui-textfield select:defined:-webkit-autofill:not(:disabled)[data-mode~=invalid]~label,tui-textfield textarea:defined:-webkit-autofill:not(:disabled)[data-mode~=invalid]~label,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown):not(:disabled)[data-mode~=invalid]~label,tui-textfield select:defined:not(._empty):not(:placeholder-shown):not(:disabled)[data-mode~=invalid]~label,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown):not(:disabled)[data-mode~=invalid]~label,tui-textfield input:not([type=range]):-webkit-autofill:invalid:not(:disabled):not([data-mode])~label,tui-textfield select:defined:-webkit-autofill:invalid:not(:disabled):not([data-mode])~label,tui-textfield textarea:defined:-webkit-autofill:invalid:not(:disabled):not([data-mode])~label,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown):invalid:not(:disabled):not([data-mode])~label,tui-textfield select:defined:not(._empty):not(:placeholder-shown):invalid:not(:disabled):not([data-mode])~label,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown):invalid:not(:disabled):not([data-mode])~label{color:var(--tui-text-negative)}tui-textfield input:not([type=range]):-webkit-autofill:not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield select:defined:-webkit-autofill:not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield textarea:defined:-webkit-autofill:not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown):not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield select:defined:not(._empty):not(:placeholder-shown):not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown):not(:disabled):not([data-mode~=readonly])~.t-content .t-clear{display:flex}tui-textfield input:not([type=range]):not([data-mode~=readonly]):focus-visible:not([data-focus=false])::placeholder,tui-textfield select:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])::placeholder,tui-textfield textarea:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])::placeholder,tui-textfield input:not([type=range]):not([data-mode~=readonly]):focus-visible:not([data-focus=false])._empty,tui-textfield select:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])._empty,tui-textfield textarea:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])._empty{color:var(--tui-text-tertiary)}tui-textfield input:not([type=range]):not([data-mode~=readonly]):focus-visible:not([data-focus=false])~label,tui-textfield select:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])~label,tui-textfield textarea:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])~label{color:var(--tui-text-primary)!important;font-size:var(--t-label-size);transform:translateY(var(--t-label))}tui-textfield input:not([type=range]):not([data-mode~=readonly])[data-focus=true]::placeholder,tui-textfield select:defined:not([data-mode~=readonly])[data-focus=true]::placeholder,tui-textfield textarea:defined:not([data-mode~=readonly])[data-focus=true]::placeholder,tui-textfield input:not([type=range]):not([data-mode~=readonly])[data-focus=true]._empty,tui-textfield select:defined:not([data-mode~=readonly])[data-focus=true]._empty,tui-textfield textarea:defined:not([data-mode~=readonly])[data-focus=true]._empty{color:var(--tui-text-tertiary)}tui-textfield input:not([type=range]):not([data-mode~=readonly])[data-focus=true]~label,tui-textfield select:defined:not([data-mode~=readonly])[data-focus=true]~label,tui-textfield textarea:defined:not([data-mode~=readonly])[data-focus=true]~label{color:var(--tui-text-primary)!important;font-size:var(--t-label-size);transform:translateY(var(--t-label))}tui-textfield input:not([type=range]):not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)::placeholder,tui-textfield select:defined:not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)::placeholder,tui-textfield textarea:defined:not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)::placeholder,tui-textfield input:not([type=range]):not([data-mode~=readonly])[tuiWrapper]._focused::placeholder,tui-textfield select:defined:not([data-mode~=readonly])[tuiWrapper]._focused::placeholder,tui-textfield textarea:defined:not([data-mode~=readonly])[tuiWrapper]._focused::placeholder,tui-textfield input:not([type=range]):not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)._empty,tui-textfield select:defined:not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)._empty,tui-textfield textarea:defined:not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)._empty,tui-textfield input:not([type=range]):not([data-mode~=readonly])[tuiWrapper]._focused._empty,tui-textfield select:defined:not([data-mode~=readonly])[tuiWrapper]._focused._empty,tui-textfield textarea:defined:not([data-mode~=readonly])[tuiWrapper]._focused._empty{color:var(--tui-text-tertiary)}tui-textfield input:not([type=range]):not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)~label,tui-textfield select:defined:not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)~label,tui-textfield textarea:defined:not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)~label,tui-textfield input:not([type=range]):not([data-mode~=readonly])[tuiWrapper]._focused~label,tui-textfield select:defined:not([data-mode~=readonly])[tuiWrapper]._focused~label,tui-textfield textarea:defined:not([data-mode~=readonly])[tuiWrapper]._focused~label{color:var(--tui-text-primary)!important;font-size:var(--t-label-size);transform:translateY(var(--t-label))}@supports (-webkit-touch-callout: none){tui-textfield input:not([type=range])._ios-fix,tui-textfield select:defined._ios-fix,tui-textfield textarea:defined._ios-fix{position:fixed;left:1000rem}}tui-textfield [tuiLabel][tuiLabel][tuiLabel]{transition-property:all;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative;display:block;flex:1;align-self:flex-start;font-size:inherit;line-height:var(--t-height);transition-duration:inherit}tui-textfield label:defined,tui-textfield input:defined::placeholder,tui-textfield textarea:defined::placeholder,tui-textfield select:defined._empty{color:var(--tui-text-secondary)}tui-textfield select:not([data-mode~=readonly]){cursor:pointer}tui-textfield select option[value=\"\"]:disabled{color:transparent}tui-textfield select optgroup,tui-textfield select option{background-color:var(--tui-background-elevation-3)}tui-textfield select optgroup,tui-textfield select option:not(:disabled){color:var(--tui-text-primary)}tui-textfield button,tui-textfield a{pointer-events:auto}tui-textfield>.t-content{z-index:1;display:flex;block-size:var(--t-height);align-items:center;gap:inherit;margin-inline-start:auto;isolation:isolate;border-radius:inherit}tui-textfield>.t-content>tui-icon{pointer-events:auto}tui-textfield textarea~.t-content{min-inline-size:.5rem}tui-textfield .t-clear{z-index:1;display:none;pointer-events:auto}tui-textfield>.t-filler:defined{pointer-events:none;color:var(--tui-text-tertiary);opacity:1}tui-textfield [tuiFluidTypography]{font-weight:700}tui-textfield [tuiSelectLike]:not(:read-only){cursor:pointer}tui-textfield:has(input[type=tel]){direction:ltr}tui-textfield[multi][multi]{flex-wrap:nowrap;overflow:scroll;align-items:stretch;cursor:text;gap:0;max-block-size:calc(var(--t-vertical) * 2 + var(--t-item-height) * var(--t-rows));overscroll-behavior:none;scroll-behavior:var(--tui-scroll-behavior)}tui-textfield[multi][multi]:before,tui-textfield[multi][multi]:after{position:sticky;top:0;left:0;inset-inline-start:0;block-size:var(--t-height)}tui-textfield[multi][multi][tuiChevron]:after{top:.375rem;block-size:calc(var(--t-height) - .75rem)}tui-textfield[multi][multi]>.t-scrollbar{transform:translate(calc(var(--t-padding) * var(--tui-inline)));margin-inline-start:calc(-1 * var(--t-start));margin-inline-end:calc(1px - 100% + var(--t-start))}tui-textfield[multi][multi]>.t-scrollbar .t-bar_horizontal{display:none}tui-textfield[multi][multi]>.t-items{position:sticky;left:var(--t-start);display:flex;inset-inline-start:var(--t-start);min-inline-size:0;min-block-size:-webkit-fit-content;min-block-size:-moz-fit-content;min-block-size:fit-content;flex:1;align-items:center;flex-wrap:wrap;padding:var(--t-vertical) 0;transition-duration:inherit}tui-textfield[multi][multi]>.t-items:after{content:\"\";min-inline-size:1px;min-block-size:1px}tui-textfield[multi][multi]>.t-items_horizontal{clip-path:inset(0 0 0 calc(var(--t-start) / 2 - var(--t-padding) - .25rem));flex-wrap:nowrap}[dir=rtl] tui-textfield[multi][multi]>.t-items_horizontal{clip-path:inset(0 calc(var(--t-start) / 2 - var(--t-padding) - .25rem) 0 0)}tui-textfield[multi][multi]>.t-items_horizontal>.t-input{padding-inline-end:calc(var(--t-side) + var(--t-end) + var(--t-padding))}tui-textfield[multi][multi]>.t-items:not(tui-textfield[multi][multi]>.t-items_horizontal){--t-scroll: 0}tui-textfield[multi][multi]>.t-items>label[tuiLabel]{position:absolute;top:0;inline-size:100%}tui-textfield[multi][multi]>.t-items>.t-input{position:relative;display:flex;align-items:center;flex:1;block-size:1.25em;max-block-size:1.25rem;max-inline-size:100%;pointer-events:none;transform:translate(var(--t-scroll))}tui-textfield[multi][multi]>.t-items>.t-input input{position:absolute;left:0;inset-inline-start:0;inline-size:100%;padding:0}tui-textfield[multi][multi]>.t-items>.t-input .t-ghost{visibility:hidden;white-space:pre;text-overflow:clip;padding-inline-end:.125rem;min-block-size:var(--t-item-height, 1em)}tui-textfield[multi][multi]>.t-items>.t-input .t-filler{position:absolute;left:0;inset-inline-start:0;color:var(--tui-text-tertiary);pointer-events:none}tui-textfield[multi][multi]>.t-items>.t-input .t-filler_hidden{display:none}tui-textfield[multi][multi]>.t-content{position:sticky;top:0;left:calc(100% - var(--t-side) - var(--t-end) + var(--t-padding) - var(--t-offset));inset-inline-start:calc(100% - var(--t-side) - var(--t-end) + var(--t-padding) - var(--t-offset));margin:0;gap:.25rem}tui-textfield[multi][multi]>.t-content .t-clear{display:flex}tui-textfield[multi][multi][data-mode~=invalid]:not([data-mode~=readonly])>.t-items>[tuiLabel]{color:var(--tui-text-negative)}tui-textfield[multi][multi][data-focus=true]:not([data-mode~=readonly])>.t-items>[tuiLabel]{color:var(--tui-text-primary)!important}tui-textfield[multi][multi][data-mode~=readonly]>.t-content .t-clear,tui-textfield[multi][multi]._disabled>.t-content .t-clear,tui-textfield[multi][multi]._empty>.t-content .t-clear{display:none}tui-textfield[multi][multi]>.t-items input:not(:focus)::placeholder,tui-textfield[multi][multi][data-mode~=readonly]>.t-items input::placeholder,tui-textfield[multi][multi][data-mode~=readonly]>.t-items label~.t-input input::placeholder{opacity:0}tui-textfield[multi][multi]._empty>.t-items input::placeholder,tui-textfield[multi][multi][data-focus=true]:not([data-mode~=readonly]):not(:focus-within)>.t-items input::placeholder{opacity:1}tui-textfield[multi][multi]:not(._empty)>.t-items [tuiLabel],tui-textfield[multi][multi][data-focus=true]:not([data-mode~=readonly])>.t-items [tuiLabel]{font-size:var(--t-label-size);transform:translateY(var(--t-label))}tui-textfield[multi][multi][data-state=disabled],tui-textfield[multi][multi][data-mode~=readonly]{pointer-events:none}tui-textfield[multi][multi][data-state=disabled] select,tui-textfield[multi][multi][data-mode~=readonly] select{display:none}tui-textfield[multi][multi][data-size=l]{--t-vertical: .625rem;--t-offset: calc(1rem - var(--t-end) / 4.5)}tui-textfield[multi][multi][data-size=l]:before{margin-inline-end:.75rem}tui-textfield[multi][multi][data-size=l]:after{left:calc(100% - var(--t-end) - .375rem + .25 * (1em - 1rem));inset-inline-start:calc(100% - var(--t-end) - .375rem + .25 * (1em - 1rem));margin-inline-end:calc(.5 * (1.5rem - 1em) - var(--t-padding));margin-inline-start:-.75rem}tui-textfield[multi][multi][data-size=l]._with-label{--t-vertical: 1.125rem}tui-textfield[multi][multi][data-size=l]._with-label>.t-items{padding:1.75rem 0 .5rem}tui-textfield[multi][multi][data-size=m]{--t-vertical: .5rem;--t-offset: calc(.75rem + var(--t-end) / 14)}tui-textfield[multi][multi][data-size=m]:before{left:-.125rem;inset-inline-start:-.125rem;margin-inline-end:.375rem}tui-textfield[multi][multi][data-size=m]:after{left:calc(100% - var(--t-end) - .25rem);inset-inline-start:calc(100% - var(--t-end) - .25rem);margin-inline-start:-.125rem;border-width:.625rem;margin-inline-end:calc(.5 * (1.5rem - 1em) - var(--t-padding))}tui-textfield[multi][multi][data-size=m]._with-label{--t-vertical: .875rem}tui-textfield[multi][multi][data-size=m]._with-label>.t-items{padding:1.375rem 0 .375rem}tui-textfield[multi][multi][data-size=m]>.t-content{transform:translate(.125rem)}tui-textfield[multi][multi][data-size=s]{--t-vertical: .125rem;--t-offset: calc(.625rem + var(--t-end) / 10)}tui-textfield[multi][multi][data-size=s]:before{left:-.125rem;inset-inline-start:-.125rem;margin-inline-end:.375rem}tui-textfield[multi][multi][data-size=s]:after{left:calc(100% - var(--t-end) - .125rem);inset-inline-start:calc(100% - var(--t-end) - .125rem);border-width:.5rem;margin-inline-end:calc(-1 * var(--t-padding))}tui-textfield[multi][multi][data-size=s]>.t-content{gap:0;transform:translate(calc(.375rem - var(--t-end) / 10))}tui-textfield[multi][multi]:focus-visible:not([data-focus=false]) input::placeholder,tui-textfield[multi][multi]:focus-visible:not([data-focus=false]) input._empty{color:var(--tui-text-tertiary)}tui-textfield[multi][multi][data-focus=true] input::placeholder,tui-textfield[multi][multi][data-focus=true] input._empty{color:var(--tui-text-tertiary)}tui-textfield[multi][multi][tuiWrapper]:not(._focused):has(:focus-visible) input::placeholder,tui-textfield[multi][multi][tuiWrapper]._focused input::placeholder,tui-textfield[multi][multi][tuiWrapper]:not(._focused):has(:focus-visible) input._empty,tui-textfield[multi][multi][tuiWrapper]._focused input._empty{color:var(--tui-text-tertiary)}tui-textfield[multi][multi] tui-textfield-item{transform:translate(var(--t-scroll))}tui-textfield[multi][multi] input::placeholder{transition-property:color;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out}tui-textfield[multi][multi] select{opacity:0;padding:0;pointer-events:none}tui-textfield[multi][multi]._empty>.t-items select~.t-filler{display:block}tui-textfield[multi][multi]._empty:not([data-focus=true])>.t-items select~.t-filler{color:var(--tui-text-secondary)}tui-textfield[multi][multi]:has([tuiSelectLike]){cursor:pointer}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: TuiScrollControls, selector: "tui-scroll-controls" }, { kind: "directive", type: WaResizeObserver, selector: "[waResizeObserver]", inputs: ["box"], outputs: ["waResizeObserver"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
311
+ ], queries: [{ propertyName: "cva", first: true, predicate: TuiControl, descendants: true, isSignal: true }, { propertyName: "item", first: true, predicate: TuiItem, descendants: true, read: TemplateRef, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: i1$1.TuiWithAppearance }], ngImport: i0, template: "@if (control()?.control?.valueChanges | async) {}\n@if (rows() > 1) {\n <tui-scroll-controls class=\"t-scrollbar\" />\n}\n\n<div\n class=\"t-items\"\n [class.t-items_horizontal]=\"rows() === 1\"\n (click)=\"input()?.nativeElement?.focus()\"\n (pointerdown.self.zoneless.prevent)=\"(0)\"\n (waResizeObserver)=\"$event[0] && onItems($event[0])\"\n>\n <ng-content select=\"label\" />\n @for (item of control()?.value; track item) {\n <ng-template\n [polymorpheusOutlet]=\"component\"\n [polymorpheusOutletContext]=\"{$implicit: {item, index: $index}}\"\n />\n }\n <span\n class=\"t-input\"\n (keydown.arrowLeft)=\"onLeft($event)\"\n >\n <ng-content select=\"input\" />\n <ng-content select=\"select\" />\n <span class=\"t-ghost\">{{ placeholder }}</span>\n <input\n aria-hidden=\"true\"\n disabled\n class=\"t-filler\"\n [class.t-filler_hidden]=\"!showFiller()\"\n [value]=\"computedFiller()\"\n />\n </span>\n</div>\n\n<span\n class=\"t-content\"\n (click.stop)=\"input()?.nativeElement?.focus()\"\n (pointerdown.zoneless.prevent)=\"(0)\"\n (waResizeObserver)=\"$event[0] && onResize($event[0])\"\n>\n <ng-content />\n @if (options.cleaner()) {\n <button\n appearance=\"icon\"\n size=\"xs\"\n tabindex=\"-1\"\n tuiIconButton\n type=\"button\"\n class=\"t-clear\"\n [iconStart]=\"icons.close\"\n (click)=\"accessor()?.setValue([])\"\n >\n {{ clear() }}\n </button>\n }\n <ng-container #vcr />\n <ng-content select=\"tui-icon\" />\n</span>\n\n@if (control()?.value != null) {\n <span class=\"t-template\">\n <ng-container *polymorpheusOutlet=\"content() as text; context: {$implicit: control()?.value}\">\n {{ text }}\n </ng-container>\n </span>\n}\n", styles: ["tui-textfield{scrollbar-width:none;-ms-overflow-style:none;transition-property:color;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;--t-height: var(--tui-height-l);--t-padding: var(--tui-padding-l);--t-label-y: -.75rem;--t-label-font: var(--tui-font-text-s);--t-end: 0rem;--t-start: 0rem;position:relative;display:flex;flex-wrap:wrap;align-items:center;cursor:pointer;min-block-size:var(--t-height);padding:0 var(--t-padding);border-radius:var(--tui-radius-l);font:var(--tui-font-text-ui-m);line-height:1.25rem;box-sizing:border-box;gap:0 .25rem;isolation:isolate}tui-textfield::-webkit-scrollbar,tui-textfield::-webkit-scrollbar-thumb{display:none}tui-textfield[tuiIcons]:read-only{color:var(--tui-text-tertiary)}tui-textfield[data-icon-start]{--t-start: 2.25rem}tui-textfield[data-icon-end]{--t-end: 2.25rem}tui-textfield[tuiIcons]:after{position:relative;block-size:auto;align-self:stretch;border-inline:var(--t-padding) solid transparent;margin:0 calc(-1 * var(--t-padding))}tui-textfield::-webkit-resizer{border:.25rem solid transparent;inline-size:.5rem;block-size:.5rem;box-sizing:content-box;color:var(--tui-text-tertiary);background:linear-gradient(-45deg,transparent,transparent .125rem,currentColor .125rem,currentColor .1875rem,transparent .1875rem,transparent .25rem,currentColor .25rem,currentColor .3125rem,transparent .35rem);background-clip:content-box}tui-textfield label,tui-textfield>.t-content,tui-textfield>.t-template{pointer-events:none}tui-textfield input,tui-textfield select,tui-textfield textarea{font:inherit;resize:none;outline:none;padding-block:1.125rem;color:var(--tui-text-primary)}tui-textfield input[inputmode=none],tui-textfield select[inputmode=none],tui-textfield textarea[inputmode=none]{caret-color:transparent}tui-textfield[data-size=s]{--t-height: var(--tui-height-s);--t-padding: var(--tui-padding-s);border-radius:var(--tui-radius-m);gap:0;font:var(--tui-font-text-ui-s);line-height:1rem}tui-textfield[data-size=s][data-icon-start]{--t-start: 1.25rem}tui-textfield[data-size=s][data-icon-end]{--t-end: 1.25rem}tui-textfield[data-size=s]:before{margin-inline:-.125rem .5rem;font-size:1rem}tui-textfield[data-size=s]:after{margin-inline:calc(.625rem - var(--t-padding)) calc(-.125rem - var(--t-padding));font-size:1rem}tui-textfield[data-size=s] input,tui-textfield[data-size=s] select,tui-textfield[data-size=s] textarea{padding-block:.5rem}tui-textfield[data-size=s]>.t-content{margin-inline-end:-.375rem}tui-textfield[data-size=m]{--t-height: var(--tui-height-m);--t-padding: var(--tui-padding-m);--t-label-font: var(--tui-font-text-xs);--t-label-y: -.5625rem;border-radius:var(--tui-radius-m);font:var(--tui-font-text-ui-s);line-height:1rem}tui-textfield[data-size=m][data-icon-start]{--t-start: 1.75rem}tui-textfield[data-size=m][data-icon-end]{--t-end: 1.75rem}tui-textfield[data-size=m]:before{margin-inline:-.125rem .125rem}tui-textfield[data-size=m]:after{margin-inline:calc(.25rem - var(--t-padding)) calc(-.125rem - var(--t-padding))}tui-textfield[data-size=m] input,tui-textfield[data-size=m] select,tui-textfield[data-size=m] textarea{padding-block:.875rem}tui-textfield[data-size=m]>.t-content{margin-inline-end:-.125rem}tui-textfield[data-size=l]{--t-label: -.7rem}tui-textfield[tuiIcons]:hover{color:var(--tui-text-secondary)}tui-textfield[tuiIcons]:hover:has(input:read-only):not([multi]),tui-textfield[tuiIcons]:hover:has(textarea:read-only),tui-textfield[tuiIcons]:hover:has(select[data-mode~=readonly]){color:var(--tui-text-tertiary)}tui-textfield:before{z-index:1;margin-inline-end:.5rem;pointer-events:none}tui-textfield:has(:disabled:not(.t-filler,button,option,[tuiChip])):before,tui-textfield:has(:disabled:not(.t-filler,button,option,[tuiChip])):after,tui-textfield:has(:disabled:not(.t-filler,button,option,[tuiChip]))>.t-template{opacity:var(--tui-disabled-opacity)}tui-textfield._disabled:before,tui-textfield._disabled:after,tui-textfield._disabled>.t-template{opacity:var(--tui-disabled-opacity)}tui-textfield._with-label>.t-template,tui-textfield._with-label input:not([type=range]),tui-textfield._with-label select:defined,tui-textfield._with-label textarea:defined{padding-block:calc(var(--t-height) / 3) 0}tui-textfield:not([data-focus=true])._with-label>.t-template::placeholder,tui-textfield:not([data-focus=true])._with-label input:not([type=range])::placeholder,tui-textfield:not([data-focus=true])._with-label select:defined::placeholder,tui-textfield:not([data-focus=true])._with-label textarea:defined::placeholder,tui-textfield:not([data-focus=true])._with-label>.t-template._empty,tui-textfield:not([data-focus=true])._with-label input:not([type=range])._empty,tui-textfield:not([data-focus=true])._with-label select:defined._empty,tui-textfield:not([data-focus=true])._with-label textarea:defined._empty{color:transparent}tui-textfield>.t-template,tui-textfield input:defined,tui-textfield select:defined,tui-textfield textarea:defined{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;-webkit-appearance:none;appearance:none;box-sizing:border-box;border-radius:inherit;border-width:0;overscroll-behavior:none;padding-inline:calc(var(--t-start, 0rem) + var(--t-padding)) calc(var(--t-end, 0rem) + var(--t-side) + var(--t-padding))}tui-textfield>.t-template:disabled,tui-textfield input:defined:disabled,tui-textfield select:defined:disabled,tui-textfield textarea:defined:disabled{animation:tuiPresent 1s infinite}tui-textfield>.t-template{display:flex;align-items:center;color:var(--tui-text-primary)}tui-textfield._with-template input:first-of-type,tui-textfield._with-template select,tui-textfield._with-template textarea{color:transparent!important}tui-textfield input:not([type=range]),tui-textfield select:defined,tui-textfield textarea:defined{pointer-events:auto;background:none}tui-textfield input:not([type=range]):not(select):read-only~.t-filler,tui-textfield select:defined:not(select):read-only~.t-filler,tui-textfield textarea:defined:not(select):read-only~.t-filler{display:none}tui-textfield input:not([type=range]):disabled~label,tui-textfield select:defined:disabled~label,tui-textfield textarea:defined:disabled~label,tui-textfield input:not([type=range]):disabled~.t-content,tui-textfield select:defined:disabled~.t-content,tui-textfield textarea:defined:disabled~.t-content{opacity:var(--tui-disabled-opacity)}tui-textfield input:not([type=range]):disabled~label>tui-icon,tui-textfield select:defined:disabled~label>tui-icon,tui-textfield textarea:defined:disabled~label>tui-icon,tui-textfield input:not([type=range]):disabled~.t-content>tui-icon,tui-textfield select:defined:disabled~.t-content>tui-icon,tui-textfield textarea:defined:disabled~.t-content>tui-icon{display:none}tui-textfield input:not([type=range]):-webkit-autofill~label,tui-textfield select:defined:-webkit-autofill~label,tui-textfield textarea:defined:-webkit-autofill~label,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown)~label,tui-textfield select:defined:not(._empty):not(:placeholder-shown)~label,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown)~label{font:var(--t-label-font);line-height:var(--t-height);transform:translateY(var(--t-label-y))}tui-textfield input:not([type=range]):-webkit-autofill:not(:disabled)[data-mode~=invalid]~label,tui-textfield select:defined:-webkit-autofill:not(:disabled)[data-mode~=invalid]~label,tui-textfield textarea:defined:-webkit-autofill:not(:disabled)[data-mode~=invalid]~label,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown):not(:disabled)[data-mode~=invalid]~label,tui-textfield select:defined:not(._empty):not(:placeholder-shown):not(:disabled)[data-mode~=invalid]~label,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown):not(:disabled)[data-mode~=invalid]~label,tui-textfield input:not([type=range]):-webkit-autofill:invalid:not(:disabled):not([data-mode])~label,tui-textfield select:defined:-webkit-autofill:invalid:not(:disabled):not([data-mode])~label,tui-textfield textarea:defined:-webkit-autofill:invalid:not(:disabled):not([data-mode])~label,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown):invalid:not(:disabled):not([data-mode])~label,tui-textfield select:defined:not(._empty):not(:placeholder-shown):invalid:not(:disabled):not([data-mode])~label,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown):invalid:not(:disabled):not([data-mode])~label{color:var(--tui-text-negative)}tui-textfield input:not([type=range]):-webkit-autofill:not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield select:defined:-webkit-autofill:not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield textarea:defined:-webkit-autofill:not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown):not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield select:defined:not(._empty):not(:placeholder-shown):not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown):not(:disabled):not([data-mode~=readonly])~.t-content .t-clear{display:flex}tui-textfield input:not([type=range]):not([data-mode~=readonly]):focus-visible:not([data-focus=false])::placeholder,tui-textfield select:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])::placeholder,tui-textfield textarea:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])::placeholder,tui-textfield input:not([type=range]):not([data-mode~=readonly]):focus-visible:not([data-focus=false])._empty,tui-textfield select:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])._empty,tui-textfield textarea:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])._empty{color:var(--tui-text-tertiary)}tui-textfield input:not([type=range]):not([data-mode~=readonly]):focus-visible:not([data-focus=false])~label,tui-textfield select:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])~label,tui-textfield textarea:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])~label{color:var(--tui-text-primary)!important;font:var(--t-label-font);line-height:var(--t-height);transform:translateY(var(--t-label-y))}tui-textfield input:not([type=range]):not([data-mode~=readonly])[data-focus=true]::placeholder,tui-textfield select:defined:not([data-mode~=readonly])[data-focus=true]::placeholder,tui-textfield textarea:defined:not([data-mode~=readonly])[data-focus=true]::placeholder,tui-textfield input:not([type=range]):not([data-mode~=readonly])[data-focus=true]._empty,tui-textfield select:defined:not([data-mode~=readonly])[data-focus=true]._empty,tui-textfield textarea:defined:not([data-mode~=readonly])[data-focus=true]._empty{color:var(--tui-text-tertiary)}tui-textfield input:not([type=range]):not([data-mode~=readonly])[data-focus=true]~label,tui-textfield select:defined:not([data-mode~=readonly])[data-focus=true]~label,tui-textfield textarea:defined:not([data-mode~=readonly])[data-focus=true]~label{color:var(--tui-text-primary)!important;font:var(--t-label-font);line-height:var(--t-height);transform:translateY(var(--t-label-y))}tui-textfield [tuiLabel][tuiLabel][tuiLabel]{transition-property:all;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative;display:block;flex:1;align-self:flex-start;font-size:inherit;line-height:var(--t-height);transition-duration:inherit}tui-textfield label:defined,tui-textfield input:defined::placeholder,tui-textfield textarea:defined::placeholder,tui-textfield select:defined._empty{color:var(--tui-text-secondary)}tui-textfield select:not([data-mode~=readonly]){cursor:pointer}tui-textfield select option[value=\"\"]:disabled{color:transparent}tui-textfield select optgroup,tui-textfield select option{background-color:var(--tui-background-elevation-3)}tui-textfield select optgroup,tui-textfield select option:not(:disabled){color:var(--tui-text-primary)}tui-textfield button,tui-textfield a{pointer-events:auto}tui-textfield>.t-content{z-index:1;display:flex;block-size:var(--t-height);align-items:center;gap:inherit;margin-inline-start:auto;isolation:isolate;border-radius:inherit}tui-textfield>.t-content>tui-icon{pointer-events:auto}tui-textfield textarea~.t-content{min-inline-size:.5rem}tui-textfield .t-clear{z-index:1;display:none;pointer-events:auto}tui-textfield>.t-filler:defined{pointer-events:none!important;color:var(--tui-text-tertiary);opacity:1}tui-textfield [tuiFluidTypography]{font-weight:700}tui-textfield [tuiSelectLike]:not(:read-only){cursor:pointer}tui-textfield:has(input[type=tel]){direction:ltr}tui-textfield[multi][multi]{flex-wrap:nowrap;overflow:scroll;align-items:stretch;cursor:text;gap:0;max-block-size:calc(var(--t-vertical) * 2 + var(--t-item-height) * var(--t-rows));overscroll-behavior:none;scroll-behavior:var(--tui-scroll-behavior)}tui-textfield[multi][multi]:before,tui-textfield[multi][multi]:after{position:sticky;inset-block-start:0;inset-inline-start:0;block-size:var(--t-height)}tui-textfield[multi][multi][tuiChevron]:after{inset-block-start:.375rem;block-size:calc(var(--t-height) - .75rem)}tui-textfield[multi][multi]>.t-scrollbar{transform:translate(calc(var(--t-padding) * var(--tui-inline)));margin-inline:calc(-1 * var(--t-start)) calc(1px - 100% + var(--t-start))}tui-textfield[multi][multi]>.t-scrollbar .t-bar_horizontal{display:none}tui-textfield[multi][multi]>.t-items{position:sticky;display:flex;inset-inline-start:var(--t-start);min-inline-size:0;max-block-size:var(--t-height);min-block-size:fit-content;flex:1;align-items:center;flex-wrap:wrap;padding:var(--t-vertical) 0;transition-duration:inherit;box-sizing:border-box}tui-textfield[multi][multi]>.t-items:after{content:\"\";min-inline-size:1px;min-block-size:1px}tui-textfield[multi][multi]>.t-items_horizontal{clip-path:inset(0 0 0 calc(var(--t-start) / 2 - var(--t-padding) - .25rem));flex-wrap:nowrap}[dir=rtl] tui-textfield[multi][multi]>.t-items_horizontal{clip-path:inset(0 calc(var(--t-start) / 2 - var(--t-padding) - .25rem) 0 0)}tui-textfield[multi][multi]>.t-items_horizontal>.t-input{padding-inline-end:calc(var(--t-side) + var(--t-end) + var(--t-padding))}tui-textfield[multi][multi]>.t-items:not(tui-textfield[multi][multi]>.t-items_horizontal){--t-scroll: 0}tui-textfield[multi][multi]>.t-items>label[tuiLabel]{position:absolute;inset-block-start:0;inline-size:100%}tui-textfield[multi][multi]>.t-items>.t-input{position:relative;display:flex;align-items:center;flex:1;block-size:1.25em;max-block-size:1.25rem;max-inline-size:100%;pointer-events:none;transform:translate(var(--t-scroll))}tui-textfield[multi][multi]>.t-items>.t-input input{position:absolute;inset-inline-start:0;inline-size:100%;padding:0;pointer-events:auto}tui-textfield[multi][multi]>.t-items>.t-input .t-ghost{visibility:hidden;white-space:pre;text-overflow:clip;padding-inline-end:.125rem;min-block-size:var(--t-item-height, 1em)}tui-textfield[multi][multi]>.t-items>.t-input .t-filler{position:absolute;left:0;inset-inline-start:0;color:var(--tui-text-tertiary);pointer-events:none}tui-textfield[multi][multi]>.t-items>.t-input .t-filler_hidden{display:none}tui-textfield[multi][multi]>.t-content{position:sticky;inset-block-start:0;inset-inline-start:calc(100% - var(--t-side) - var(--t-end) + var(--t-padding) - var(--t-offset));margin:0;gap:.25rem}tui-textfield[multi][multi]>.t-content .t-clear{display:flex}tui-textfield[multi][multi][data-mode~=invalid]:not([data-mode~=readonly])>.t-items>[tuiLabel]{color:var(--tui-text-negative)}tui-textfield[multi][multi][data-focus=true]:not([data-mode~=readonly])>.t-items>[tuiLabel]{color:var(--tui-text-primary)!important}tui-textfield[multi][multi][data-mode~=readonly]>.t-content .t-clear,tui-textfield[multi][multi]._disabled>.t-content .t-clear,tui-textfield[multi][multi]._empty>.t-content .t-clear{display:none}tui-textfield[multi][multi]>.t-items input:not(:focus)::placeholder,tui-textfield[multi][multi][data-mode~=readonly]>.t-items input::placeholder,tui-textfield[multi][multi][data-mode~=readonly]>.t-items label~.t-input input::placeholder{opacity:0}tui-textfield[multi][multi]._empty>.t-items input::placeholder,tui-textfield[multi][multi][data-focus=true]:not([data-mode~=readonly]):not(:focus-within)>.t-items input::placeholder{opacity:1}tui-textfield[multi][multi]:not(._empty)>.t-items [tuiLabel],tui-textfield[multi][multi][data-focus=true]:not([data-mode~=readonly])>.t-items [tuiLabel]{font:var(--t-label-font);line-height:var(--t-height);transform:translateY(var(--t-label-y))}tui-textfield[multi][multi][data-state=disabled],tui-textfield[multi][multi][data-mode~=readonly]{pointer-events:none}tui-textfield[multi][multi][data-state=disabled] select,tui-textfield[multi][multi][data-mode~=readonly] select{display:none}tui-textfield[multi][multi][data-size=l]{--t-vertical: .625rem;--t-offset: calc(1rem - var(--t-end) / 4.5)}tui-textfield[multi][multi][data-size=l]:before{margin-inline-end:.75rem}tui-textfield[multi][multi][data-size=l]:after{inset-inline-start:calc(100% - var(--t-end) - .375rem + .25 * (1em - 1rem));margin-inline:-.75rem calc(.5 * (1.5rem - 1em) - var(--t-padding))}tui-textfield[multi][multi][data-size=l]._with-label{--t-vertical: 1.125rem}tui-textfield[multi][multi][data-size=l]._with-label>.t-items{padding:1.75rem 0 .5rem}tui-textfield[multi][multi][data-size=m]{--t-vertical: .5rem;--t-offset: calc(.75rem + var(--t-end) / 14)}tui-textfield[multi][multi][data-size=m]:before{inset-inline-start:-.125rem;margin-inline-end:.375rem}tui-textfield[multi][multi][data-size=m]:after{inset-inline-start:calc(100% - var(--t-end) - .25rem);border-width:.625rem;margin-inline:-.125rem calc(.5 * (1.5rem - 1em) - var(--t-padding))}tui-textfield[multi][multi][data-size=m]._with-label{--t-vertical: .875rem}tui-textfield[multi][multi][data-size=m]._with-label>.t-items{padding:1.375rem 0 .375rem}tui-textfield[multi][multi][data-size=m]>.t-content{transform:translate(.125rem)}tui-textfield[multi][multi][data-size=s]{--t-vertical: .125rem;--t-offset: calc(.625rem + var(--t-end) / 10)}tui-textfield[multi][multi][data-size=s]:before{inset-inline-start:-.125rem;margin-inline-end:.375rem}tui-textfield[multi][multi][data-size=s]:after{inset-inline-start:calc(100% - var(--t-end) - .125rem);border-width:.5rem;margin-inline-end:calc(-1 * var(--t-padding))}tui-textfield[multi][multi][data-size=s]>.t-content{gap:0;transform:translate(calc(.375rem - var(--t-end) / 10))}tui-textfield[multi][multi]:focus-visible:not([data-focus=false]) input::placeholder,tui-textfield[multi][multi]:focus-visible:not([data-focus=false]) input._empty{color:var(--tui-text-tertiary)}tui-textfield[multi][multi][data-focus=true] input::placeholder,tui-textfield[multi][multi][data-focus=true] input._empty{color:var(--tui-text-tertiary)}tui-textfield[multi][multi] tui-textfield-item{transform:translate(var(--t-scroll))}tui-textfield[multi][multi] input::placeholder{transition-property:color;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out}tui-textfield[multi][multi] select{opacity:0;padding:0;pointer-events:none}tui-textfield[multi][multi]._empty>.t-items select~.t-filler{display:block}tui-textfield[multi][multi]._empty:not([data-focus=true])>.t-items select~.t-filler{color:var(--tui-text-secondary)}tui-textfield[multi][multi]:has([tuiSelectLike]){cursor:pointer}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: TuiScrollControls, selector: "tui-scroll-controls" }, { kind: "directive", type: WaResizeObserver, selector: "[waResizeObserver]", inputs: ["box"], outputs: ["waResizeObserver"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
583
312
  }
584
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTextfieldMultiComponent, decorators: [{
313
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiTextfieldMultiComponent, decorators: [{
585
314
  type: Component,
586
- args: [{ standalone: true, selector: 'tui-textfield[multi]', imports: [
315
+ args: [{ selector: 'tui-textfield[multi]', imports: [
587
316
  AsyncPipe,
588
- NgForOf,
589
- NgIf,
590
317
  PolymorpheusOutlet,
591
318
  TuiButton,
592
319
  TuiScrollControls,
@@ -596,47 +323,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
596
323
  tuiAsDataListHost(TuiTextfieldMultiComponent),
597
324
  tuiProvide(TuiTextfieldComponent, TuiTextfieldMultiComponent),
598
325
  tuiProvide(TUI_SCROLL_REF, ElementRef),
599
- ], hostDirectives: [
600
- TuiDropdownFixed,
601
- TuiDropdownDirective,
602
- TuiWithDropdownOpen,
603
- TuiWithTextfieldDropdown,
604
- TuiWithIcons,
605
- TuiWithItemsHandlers$1,
606
- TuiWithOptionContent,
607
- TuiWithAppearance,
608
- ], host: {
609
- class: 'tui-interactive',
610
- '[attr.data-state]': 'control?.disabled ? "disabled" : null',
611
- '[class._empty]': '!control?.value?.length',
326
+ ], hostDirectives: [TuiWithAppearance], host: {
327
+ '[attr.data-state]': 'control()?.disabled ? "disabled" : null',
328
+ '[class._empty]': '!control()?.value?.length',
612
329
  '[style.--t-item-height.px]': 'height()',
613
- '[style.--t-rows]': 'rows',
330
+ '[style.--t-rows]': 'rows()',
614
331
  '(click.prevent)': 'onClick($event.target)',
615
- '(tuiActiveZoneChange)': '!$event && (el.scrollTo({left: 0}) || cva?.onTouched())',
616
- // TODO: Remove in v5
617
- '[attr.data-size]': 'options.size()',
618
- '[class._with-label]': 'hasLabel',
619
- '[class._with-template]': 'content && control?.value != null',
620
- '[class._disabled]': 'input?.nativeElement?.disabled',
621
- '(pointerdown.self.prevent)': 'onIconClick()',
622
- '(scroll.capture.zoneless)': 'onScroll($event.target)',
623
- }, template: "<ng-container *ngIf=\"control?.control?.valueChanges | async\" />\n<tui-scroll-controls\n *ngIf=\"rows > 1\"\n class=\"t-scrollbar\"\n/>\n\n<div\n class=\"t-items\"\n [class.t-items_horizontal]=\"rows === 1\"\n (click)=\"input?.nativeElement?.focus()\"\n (pointerdown.self.zoneless.prevent)=\"(0)\"\n (waResizeObserver)=\"$event[0] && onItems($event[0])\"\n>\n <ng-content select=\"label\" />\n <ng-template\n *ngFor=\"let item of control?.value; let index = index\"\n [polymorpheusOutlet]=\"component\"\n [polymorpheusOutletContext]=\"{$implicit: {item, index}}\"\n />\n <span\n class=\"t-input\"\n (keydown.arrowLeft)=\"onLeft($event)\"\n >\n <ng-content select=\"input\" />\n <ng-content select=\"select\" />\n <span class=\"t-ghost\">{{ placeholder }}</span>\n <input\n aria-hidden=\"true\"\n disabled\n class=\"t-filler\"\n [class.t-filler_hidden]=\"!showFiller()\"\n [value]=\"computedFiller()\"\n />\n </span>\n</div>\n\n<span\n class=\"t-content\"\n (click.stop)=\"input?.nativeElement?.focus()\"\n (pointerdown.zoneless.prevent)=\"(0)\"\n (waResizeObserver)=\"$event[0] && onResize($event[0])\"\n>\n <ng-content />\n <button\n *ngIf=\"options.cleaner()\"\n appearance=\"icon\"\n size=\"xs\"\n tabindex=\"-1\"\n tuiIconButton\n type=\"button\"\n class=\"t-clear\"\n [iconStart]=\"icons.close\"\n (click)=\"accessor?.setValue([])\"\n >\n {{ clear() }}\n </button>\n <ng-container #vcr />\n <ng-content select=\"tui-icon\" />\n</span>\n\n<span\n *ngIf=\"control?.value != null\"\n class=\"t-template\"\n>\n <ng-container *polymorpheusOutlet=\"content as text; context: {$implicit: control?.value}\">\n {{ text }}\n </ng-container>\n</span>\n", styles: ["tui-textfield{scrollbar-width:none;-ms-overflow-style:none;transition-property:color;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;--t-height: var(--tui-height-l);--t-padding: var(--tui-padding-l);--t-label: -.7em;--t-label-size: .83em;--t-end: 0rem;--t-start: 0rem;position:relative;display:flex;flex-wrap:wrap;align-items:center;cursor:pointer;min-block-size:var(--t-height);padding:0 var(--t-padding);border-radius:var(--tui-radius-l);font:var(--tui-font-text-ui-m);line-height:1.25rem;box-sizing:border-box;gap:0 .25rem;isolation:isolate}tui-textfield::-webkit-scrollbar,tui-textfield::-webkit-scrollbar-thumb{display:none}tui-textfield[tuiIcons]:read-only{color:var(--tui-text-tertiary)}tui-textfield[style*=\"--t-icon-start:\"]{--t-start: 2.25rem}tui-textfield[style*=\"--t-icon-end:\"]{--t-end: 2.25rem}tui-textfield[tuiIcons]:after{position:relative;block-size:auto;align-self:stretch;border-inline-start:var(--t-padding) solid transparent;border-inline-end:var(--t-padding) solid transparent;margin:0 calc(-1 * var(--t-padding))}tui-textfield::-webkit-resizer{border:.25rem solid transparent;inline-size:.5rem;block-size:.5rem;box-sizing:content-box;color:var(--tui-text-tertiary);background:linear-gradient(-45deg,transparent,transparent .125rem,currentColor .125rem,currentColor .1875rem,transparent .1875rem,transparent .25rem,currentColor .25rem,currentColor .3125rem,transparent .35rem);background-clip:content-box}tui-textfield label,tui-textfield>.t-content,tui-textfield>.t-template{pointer-events:none}tui-textfield input,tui-textfield select,tui-textfield textarea{font:inherit;resize:none;outline:none;padding-block-start:1.125rem;padding-block-end:1.125rem;color:var(--tui-text-primary)}tui-textfield input[inputmode=none],tui-textfield select[inputmode=none],tui-textfield textarea[inputmode=none]{caret-color:transparent}tui-textfield[data-size=s]{--t-height: var(--tui-height-s);--t-padding: var(--tui-padding-s);border-radius:var(--tui-radius-m);gap:0;font:var(--tui-font-text-ui-s);line-height:1rem}tui-textfield[data-size=s][style*=\"--t-icon-start:\"]{--t-start: 1.25rem}tui-textfield[data-size=s][style*=\"--t-icon-end:\"]{--t-end: 1.25rem}tui-textfield[data-size=s]:before{margin-inline-end:.5rem;margin-inline-start:-.125rem;font-size:1rem}tui-textfield[data-size=s]:after{margin-inline-end:calc(-.125rem - var(--t-padding));margin-inline-start:calc(.625rem - var(--t-padding));font-size:1rem}tui-textfield[data-size=s] input,tui-textfield[data-size=s] select,tui-textfield[data-size=s] textarea{padding-block-start:.5rem;padding-block-end:.5rem}tui-textfield[data-size=s]>.t-content{margin-inline-end:-.375rem}tui-textfield[data-size=m]{--t-height: var(--tui-height-m);--t-padding: var(--tui-padding-m);border-radius:var(--tui-radius-m);font:var(--tui-font-text-ui-s);line-height:1rem}tui-textfield[data-size=m][style*=\"--t-icon-start:\"]{--t-start: 1.75rem}tui-textfield[data-size=m][style*=\"--t-icon-end:\"]{--t-end: 1.75rem}tui-textfield[data-size=m]:before{margin-inline-start:-.125rem;margin-inline-end:.125rem}tui-textfield[data-size=m]:after{margin-inline-start:calc(.25rem - var(--t-padding));margin-inline-end:calc(-.125rem - var(--t-padding))}tui-textfield[data-size=m] input,tui-textfield[data-size=m] select,tui-textfield[data-size=m] textarea{padding-block-start:.875rem;padding-block-end:.875rem}tui-textfield[data-size=m]>.t-content{margin-inline-end:-.125rem}tui-textfield[data-size=l]{--t-label: -.7rem}tui-textfield[tuiIcons]:hover{color:var(--tui-text-secondary)}tui-textfield[tuiIcons]:hover:has(input:read-only):not([multi]),tui-textfield[tuiIcons]:hover:has(textarea:read-only),tui-textfield[tuiIcons]:hover:has(select[data-mode~=readonly]){color:var(--tui-text-tertiary)}tui-textfield:before{z-index:1;margin-inline-end:.5rem;pointer-events:none}tui-textfield:has(:disabled:not(.t-filler,button,option,[tuiChip])):before,tui-textfield:has(:disabled:not(.t-filler,button,option,[tuiChip])):after,tui-textfield:has(:disabled:not(.t-filler,button,option,[tuiChip]))>.t-template{opacity:var(--tui-disabled-opacity)}tui-textfield._disabled:before,tui-textfield._disabled:after,tui-textfield._disabled>.t-template{opacity:var(--tui-disabled-opacity)}tui-textfield:has(label:not(:empty))>.t-template,tui-textfield:has(label:not(:empty)) input:not([type=range]),tui-textfield:has(label:not(:empty)) select:defined,tui-textfield:has(label:not(:empty)) textarea:defined{padding-block-start:calc(var(--t-height) / 3);padding-block-end:0}tui-textfield:not([data-focus=true]):has(label:not(:empty))>.t-template::placeholder,tui-textfield:not([data-focus=true]):has(label:not(:empty)) input:not([type=range])::placeholder,tui-textfield:not([data-focus=true]):has(label:not(:empty)) select:defined::placeholder,tui-textfield:not([data-focus=true]):has(label:not(:empty)) textarea:defined::placeholder,tui-textfield:not([data-focus=true]):has(label:not(:empty))>.t-template._empty,tui-textfield:not([data-focus=true]):has(label:not(:empty)) input:not([type=range])._empty,tui-textfield:not([data-focus=true]):has(label:not(:empty)) select:defined._empty,tui-textfield:not([data-focus=true]):has(label:not(:empty)) textarea:defined._empty{color:transparent}tui-textfield._with-label>.t-template,tui-textfield._with-label input:not([type=range]),tui-textfield._with-label select:defined,tui-textfield._with-label textarea:defined{padding-block-start:calc(var(--t-height) / 3);padding-block-end:0}tui-textfield:not([data-focus=true])._with-label>.t-template::placeholder,tui-textfield:not([data-focus=true])._with-label input:not([type=range])::placeholder,tui-textfield:not([data-focus=true])._with-label select:defined::placeholder,tui-textfield:not([data-focus=true])._with-label textarea:defined::placeholder,tui-textfield:not([data-focus=true])._with-label>.t-template._empty,tui-textfield:not([data-focus=true])._with-label input:not([type=range])._empty,tui-textfield:not([data-focus=true])._with-label select:defined._empty,tui-textfield:not([data-focus=true])._with-label textarea:defined._empty{color:transparent}tui-textfield>.t-template,tui-textfield input:defined,tui-textfield select:defined,tui-textfield textarea:defined{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;-webkit-appearance:none;appearance:none;box-sizing:border-box;border-radius:inherit;border-width:0;overscroll-behavior:none;padding-inline-start:calc(var(--t-start, 0rem) + var(--t-padding));padding-inline-end:calc(var(--t-end, 0rem) + var(--t-side) + var(--t-padding))}tui-textfield>.t-template{display:flex;align-items:center;color:var(--tui-text-primary)}tui-textfield._with-template input:first-of-type,tui-textfield._with-template select,tui-textfield._with-template textarea{color:transparent!important}tui-textfield input:not([type=range]),tui-textfield select:defined,tui-textfield textarea:defined{pointer-events:auto;background:none}tui-textfield input:not([type=range]):not(select):read-only~.t-filler,tui-textfield select:defined:not(select):read-only~.t-filler,tui-textfield textarea:defined:not(select):read-only~.t-filler{display:none}tui-textfield input:not([type=range]):disabled~label,tui-textfield select:defined:disabled~label,tui-textfield textarea:defined:disabled~label,tui-textfield input:not([type=range]):disabled~.t-content,tui-textfield select:defined:disabled~.t-content,tui-textfield textarea:defined:disabled~.t-content{opacity:var(--tui-disabled-opacity)}tui-textfield input:not([type=range]):disabled~label>tui-icon,tui-textfield select:defined:disabled~label>tui-icon,tui-textfield textarea:defined:disabled~label>tui-icon,tui-textfield input:not([type=range]):disabled~.t-content>tui-icon,tui-textfield select:defined:disabled~.t-content>tui-icon,tui-textfield textarea:defined:disabled~.t-content>tui-icon{display:none}tui-textfield input:not([type=range]):-webkit-autofill~label,tui-textfield select:defined:-webkit-autofill~label,tui-textfield textarea:defined:-webkit-autofill~label,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown)~label,tui-textfield select:defined:not(._empty):not(:placeholder-shown)~label,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown)~label{font-size:var(--t-label-size);transform:translateY(var(--t-label))}tui-textfield input:not([type=range]):-webkit-autofill:not(:disabled)[data-mode~=invalid]~label,tui-textfield select:defined:-webkit-autofill:not(:disabled)[data-mode~=invalid]~label,tui-textfield textarea:defined:-webkit-autofill:not(:disabled)[data-mode~=invalid]~label,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown):not(:disabled)[data-mode~=invalid]~label,tui-textfield select:defined:not(._empty):not(:placeholder-shown):not(:disabled)[data-mode~=invalid]~label,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown):not(:disabled)[data-mode~=invalid]~label,tui-textfield input:not([type=range]):-webkit-autofill:invalid:not(:disabled):not([data-mode])~label,tui-textfield select:defined:-webkit-autofill:invalid:not(:disabled):not([data-mode])~label,tui-textfield textarea:defined:-webkit-autofill:invalid:not(:disabled):not([data-mode])~label,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown):invalid:not(:disabled):not([data-mode])~label,tui-textfield select:defined:not(._empty):not(:placeholder-shown):invalid:not(:disabled):not([data-mode])~label,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown):invalid:not(:disabled):not([data-mode])~label{color:var(--tui-text-negative)}tui-textfield input:not([type=range]):-webkit-autofill:not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield select:defined:-webkit-autofill:not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield textarea:defined:-webkit-autofill:not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown):not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield select:defined:not(._empty):not(:placeholder-shown):not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown):not(:disabled):not([data-mode~=readonly])~.t-content .t-clear{display:flex}tui-textfield input:not([type=range]):not([data-mode~=readonly]):focus-visible:not([data-focus=false])::placeholder,tui-textfield select:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])::placeholder,tui-textfield textarea:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])::placeholder,tui-textfield input:not([type=range]):not([data-mode~=readonly]):focus-visible:not([data-focus=false])._empty,tui-textfield select:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])._empty,tui-textfield textarea:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])._empty{color:var(--tui-text-tertiary)}tui-textfield input:not([type=range]):not([data-mode~=readonly]):focus-visible:not([data-focus=false])~label,tui-textfield select:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])~label,tui-textfield textarea:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])~label{color:var(--tui-text-primary)!important;font-size:var(--t-label-size);transform:translateY(var(--t-label))}tui-textfield input:not([type=range]):not([data-mode~=readonly])[data-focus=true]::placeholder,tui-textfield select:defined:not([data-mode~=readonly])[data-focus=true]::placeholder,tui-textfield textarea:defined:not([data-mode~=readonly])[data-focus=true]::placeholder,tui-textfield input:not([type=range]):not([data-mode~=readonly])[data-focus=true]._empty,tui-textfield select:defined:not([data-mode~=readonly])[data-focus=true]._empty,tui-textfield textarea:defined:not([data-mode~=readonly])[data-focus=true]._empty{color:var(--tui-text-tertiary)}tui-textfield input:not([type=range]):not([data-mode~=readonly])[data-focus=true]~label,tui-textfield select:defined:not([data-mode~=readonly])[data-focus=true]~label,tui-textfield textarea:defined:not([data-mode~=readonly])[data-focus=true]~label{color:var(--tui-text-primary)!important;font-size:var(--t-label-size);transform:translateY(var(--t-label))}tui-textfield input:not([type=range]):not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)::placeholder,tui-textfield select:defined:not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)::placeholder,tui-textfield textarea:defined:not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)::placeholder,tui-textfield input:not([type=range]):not([data-mode~=readonly])[tuiWrapper]._focused::placeholder,tui-textfield select:defined:not([data-mode~=readonly])[tuiWrapper]._focused::placeholder,tui-textfield textarea:defined:not([data-mode~=readonly])[tuiWrapper]._focused::placeholder,tui-textfield input:not([type=range]):not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)._empty,tui-textfield select:defined:not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)._empty,tui-textfield textarea:defined:not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)._empty,tui-textfield input:not([type=range]):not([data-mode~=readonly])[tuiWrapper]._focused._empty,tui-textfield select:defined:not([data-mode~=readonly])[tuiWrapper]._focused._empty,tui-textfield textarea:defined:not([data-mode~=readonly])[tuiWrapper]._focused._empty{color:var(--tui-text-tertiary)}tui-textfield input:not([type=range]):not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)~label,tui-textfield select:defined:not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)~label,tui-textfield textarea:defined:not([data-mode~=readonly])[tuiWrapper]:not(._focused):has(:focus-visible)~label,tui-textfield input:not([type=range]):not([data-mode~=readonly])[tuiWrapper]._focused~label,tui-textfield select:defined:not([data-mode~=readonly])[tuiWrapper]._focused~label,tui-textfield textarea:defined:not([data-mode~=readonly])[tuiWrapper]._focused~label{color:var(--tui-text-primary)!important;font-size:var(--t-label-size);transform:translateY(var(--t-label))}@supports (-webkit-touch-callout: none){tui-textfield input:not([type=range])._ios-fix,tui-textfield select:defined._ios-fix,tui-textfield textarea:defined._ios-fix{position:fixed;left:1000rem}}tui-textfield [tuiLabel][tuiLabel][tuiLabel]{transition-property:all;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative;display:block;flex:1;align-self:flex-start;font-size:inherit;line-height:var(--t-height);transition-duration:inherit}tui-textfield label:defined,tui-textfield input:defined::placeholder,tui-textfield textarea:defined::placeholder,tui-textfield select:defined._empty{color:var(--tui-text-secondary)}tui-textfield select:not([data-mode~=readonly]){cursor:pointer}tui-textfield select option[value=\"\"]:disabled{color:transparent}tui-textfield select optgroup,tui-textfield select option{background-color:var(--tui-background-elevation-3)}tui-textfield select optgroup,tui-textfield select option:not(:disabled){color:var(--tui-text-primary)}tui-textfield button,tui-textfield a{pointer-events:auto}tui-textfield>.t-content{z-index:1;display:flex;block-size:var(--t-height);align-items:center;gap:inherit;margin-inline-start:auto;isolation:isolate;border-radius:inherit}tui-textfield>.t-content>tui-icon{pointer-events:auto}tui-textfield textarea~.t-content{min-inline-size:.5rem}tui-textfield .t-clear{z-index:1;display:none;pointer-events:auto}tui-textfield>.t-filler:defined{pointer-events:none;color:var(--tui-text-tertiary);opacity:1}tui-textfield [tuiFluidTypography]{font-weight:700}tui-textfield [tuiSelectLike]:not(:read-only){cursor:pointer}tui-textfield:has(input[type=tel]){direction:ltr}tui-textfield[multi][multi]{flex-wrap:nowrap;overflow:scroll;align-items:stretch;cursor:text;gap:0;max-block-size:calc(var(--t-vertical) * 2 + var(--t-item-height) * var(--t-rows));overscroll-behavior:none;scroll-behavior:var(--tui-scroll-behavior)}tui-textfield[multi][multi]:before,tui-textfield[multi][multi]:after{position:sticky;top:0;left:0;inset-inline-start:0;block-size:var(--t-height)}tui-textfield[multi][multi][tuiChevron]:after{top:.375rem;block-size:calc(var(--t-height) - .75rem)}tui-textfield[multi][multi]>.t-scrollbar{transform:translate(calc(var(--t-padding) * var(--tui-inline)));margin-inline-start:calc(-1 * var(--t-start));margin-inline-end:calc(1px - 100% + var(--t-start))}tui-textfield[multi][multi]>.t-scrollbar .t-bar_horizontal{display:none}tui-textfield[multi][multi]>.t-items{position:sticky;left:var(--t-start);display:flex;inset-inline-start:var(--t-start);min-inline-size:0;min-block-size:-webkit-fit-content;min-block-size:-moz-fit-content;min-block-size:fit-content;flex:1;align-items:center;flex-wrap:wrap;padding:var(--t-vertical) 0;transition-duration:inherit}tui-textfield[multi][multi]>.t-items:after{content:\"\";min-inline-size:1px;min-block-size:1px}tui-textfield[multi][multi]>.t-items_horizontal{clip-path:inset(0 0 0 calc(var(--t-start) / 2 - var(--t-padding) - .25rem));flex-wrap:nowrap}[dir=rtl] tui-textfield[multi][multi]>.t-items_horizontal{clip-path:inset(0 calc(var(--t-start) / 2 - var(--t-padding) - .25rem) 0 0)}tui-textfield[multi][multi]>.t-items_horizontal>.t-input{padding-inline-end:calc(var(--t-side) + var(--t-end) + var(--t-padding))}tui-textfield[multi][multi]>.t-items:not(tui-textfield[multi][multi]>.t-items_horizontal){--t-scroll: 0}tui-textfield[multi][multi]>.t-items>label[tuiLabel]{position:absolute;top:0;inline-size:100%}tui-textfield[multi][multi]>.t-items>.t-input{position:relative;display:flex;align-items:center;flex:1;block-size:1.25em;max-block-size:1.25rem;max-inline-size:100%;pointer-events:none;transform:translate(var(--t-scroll))}tui-textfield[multi][multi]>.t-items>.t-input input{position:absolute;left:0;inset-inline-start:0;inline-size:100%;padding:0}tui-textfield[multi][multi]>.t-items>.t-input .t-ghost{visibility:hidden;white-space:pre;text-overflow:clip;padding-inline-end:.125rem;min-block-size:var(--t-item-height, 1em)}tui-textfield[multi][multi]>.t-items>.t-input .t-filler{position:absolute;left:0;inset-inline-start:0;color:var(--tui-text-tertiary);pointer-events:none}tui-textfield[multi][multi]>.t-items>.t-input .t-filler_hidden{display:none}tui-textfield[multi][multi]>.t-content{position:sticky;top:0;left:calc(100% - var(--t-side) - var(--t-end) + var(--t-padding) - var(--t-offset));inset-inline-start:calc(100% - var(--t-side) - var(--t-end) + var(--t-padding) - var(--t-offset));margin:0;gap:.25rem}tui-textfield[multi][multi]>.t-content .t-clear{display:flex}tui-textfield[multi][multi][data-mode~=invalid]:not([data-mode~=readonly])>.t-items>[tuiLabel]{color:var(--tui-text-negative)}tui-textfield[multi][multi][data-focus=true]:not([data-mode~=readonly])>.t-items>[tuiLabel]{color:var(--tui-text-primary)!important}tui-textfield[multi][multi][data-mode~=readonly]>.t-content .t-clear,tui-textfield[multi][multi]._disabled>.t-content .t-clear,tui-textfield[multi][multi]._empty>.t-content .t-clear{display:none}tui-textfield[multi][multi]>.t-items input:not(:focus)::placeholder,tui-textfield[multi][multi][data-mode~=readonly]>.t-items input::placeholder,tui-textfield[multi][multi][data-mode~=readonly]>.t-items label~.t-input input::placeholder{opacity:0}tui-textfield[multi][multi]._empty>.t-items input::placeholder,tui-textfield[multi][multi][data-focus=true]:not([data-mode~=readonly]):not(:focus-within)>.t-items input::placeholder{opacity:1}tui-textfield[multi][multi]:not(._empty)>.t-items [tuiLabel],tui-textfield[multi][multi][data-focus=true]:not([data-mode~=readonly])>.t-items [tuiLabel]{font-size:var(--t-label-size);transform:translateY(var(--t-label))}tui-textfield[multi][multi][data-state=disabled],tui-textfield[multi][multi][data-mode~=readonly]{pointer-events:none}tui-textfield[multi][multi][data-state=disabled] select,tui-textfield[multi][multi][data-mode~=readonly] select{display:none}tui-textfield[multi][multi][data-size=l]{--t-vertical: .625rem;--t-offset: calc(1rem - var(--t-end) / 4.5)}tui-textfield[multi][multi][data-size=l]:before{margin-inline-end:.75rem}tui-textfield[multi][multi][data-size=l]:after{left:calc(100% - var(--t-end) - .375rem + .25 * (1em - 1rem));inset-inline-start:calc(100% - var(--t-end) - .375rem + .25 * (1em - 1rem));margin-inline-end:calc(.5 * (1.5rem - 1em) - var(--t-padding));margin-inline-start:-.75rem}tui-textfield[multi][multi][data-size=l]._with-label{--t-vertical: 1.125rem}tui-textfield[multi][multi][data-size=l]._with-label>.t-items{padding:1.75rem 0 .5rem}tui-textfield[multi][multi][data-size=m]{--t-vertical: .5rem;--t-offset: calc(.75rem + var(--t-end) / 14)}tui-textfield[multi][multi][data-size=m]:before{left:-.125rem;inset-inline-start:-.125rem;margin-inline-end:.375rem}tui-textfield[multi][multi][data-size=m]:after{left:calc(100% - var(--t-end) - .25rem);inset-inline-start:calc(100% - var(--t-end) - .25rem);margin-inline-start:-.125rem;border-width:.625rem;margin-inline-end:calc(.5 * (1.5rem - 1em) - var(--t-padding))}tui-textfield[multi][multi][data-size=m]._with-label{--t-vertical: .875rem}tui-textfield[multi][multi][data-size=m]._with-label>.t-items{padding:1.375rem 0 .375rem}tui-textfield[multi][multi][data-size=m]>.t-content{transform:translate(.125rem)}tui-textfield[multi][multi][data-size=s]{--t-vertical: .125rem;--t-offset: calc(.625rem + var(--t-end) / 10)}tui-textfield[multi][multi][data-size=s]:before{left:-.125rem;inset-inline-start:-.125rem;margin-inline-end:.375rem}tui-textfield[multi][multi][data-size=s]:after{left:calc(100% - var(--t-end) - .125rem);inset-inline-start:calc(100% - var(--t-end) - .125rem);border-width:.5rem;margin-inline-end:calc(-1 * var(--t-padding))}tui-textfield[multi][multi][data-size=s]>.t-content{gap:0;transform:translate(calc(.375rem - var(--t-end) / 10))}tui-textfield[multi][multi]:focus-visible:not([data-focus=false]) input::placeholder,tui-textfield[multi][multi]:focus-visible:not([data-focus=false]) input._empty{color:var(--tui-text-tertiary)}tui-textfield[multi][multi][data-focus=true] input::placeholder,tui-textfield[multi][multi][data-focus=true] input._empty{color:var(--tui-text-tertiary)}tui-textfield[multi][multi][tuiWrapper]:not(._focused):has(:focus-visible) input::placeholder,tui-textfield[multi][multi][tuiWrapper]._focused input::placeholder,tui-textfield[multi][multi][tuiWrapper]:not(._focused):has(:focus-visible) input._empty,tui-textfield[multi][multi][tuiWrapper]._focused input._empty{color:var(--tui-text-tertiary)}tui-textfield[multi][multi] tui-textfield-item{transform:translate(var(--t-scroll))}tui-textfield[multi][multi] input::placeholder{transition-property:color;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out}tui-textfield[multi][multi] select{opacity:0;padding:0;pointer-events:none}tui-textfield[multi][multi]._empty>.t-items select~.t-filler{display:block}tui-textfield[multi][multi]._empty:not([data-focus=true])>.t-items select~.t-filler{color:var(--tui-text-secondary)}tui-textfield[multi][multi]:has([tuiSelectLike]){cursor:pointer}\n"] }]
624
- }], propDecorators: { item: [{
625
- type: ContentChild,
626
- args: [TuiItem, { read: TemplateRef, descendants: true }]
627
- }], rows: [{
628
- type: Input
629
- }] } });
332
+ '(tuiActiveZoneChange)': '!$event && el.scrollTo({left: 0})',
333
+ }, template: "@if (control()?.control?.valueChanges | async) {}\n@if (rows() > 1) {\n <tui-scroll-controls class=\"t-scrollbar\" />\n}\n\n<div\n class=\"t-items\"\n [class.t-items_horizontal]=\"rows() === 1\"\n (click)=\"input()?.nativeElement?.focus()\"\n (pointerdown.self.zoneless.prevent)=\"(0)\"\n (waResizeObserver)=\"$event[0] && onItems($event[0])\"\n>\n <ng-content select=\"label\" />\n @for (item of control()?.value; track item) {\n <ng-template\n [polymorpheusOutlet]=\"component\"\n [polymorpheusOutletContext]=\"{$implicit: {item, index: $index}}\"\n />\n }\n <span\n class=\"t-input\"\n (keydown.arrowLeft)=\"onLeft($event)\"\n >\n <ng-content select=\"input\" />\n <ng-content select=\"select\" />\n <span class=\"t-ghost\">{{ placeholder }}</span>\n <input\n aria-hidden=\"true\"\n disabled\n class=\"t-filler\"\n [class.t-filler_hidden]=\"!showFiller()\"\n [value]=\"computedFiller()\"\n />\n </span>\n</div>\n\n<span\n class=\"t-content\"\n (click.stop)=\"input()?.nativeElement?.focus()\"\n (pointerdown.zoneless.prevent)=\"(0)\"\n (waResizeObserver)=\"$event[0] && onResize($event[0])\"\n>\n <ng-content />\n @if (options.cleaner()) {\n <button\n appearance=\"icon\"\n size=\"xs\"\n tabindex=\"-1\"\n tuiIconButton\n type=\"button\"\n class=\"t-clear\"\n [iconStart]=\"icons.close\"\n (click)=\"accessor()?.setValue([])\"\n >\n {{ clear() }}\n </button>\n }\n <ng-container #vcr />\n <ng-content select=\"tui-icon\" />\n</span>\n\n@if (control()?.value != null) {\n <span class=\"t-template\">\n <ng-container *polymorpheusOutlet=\"content() as text; context: {$implicit: control()?.value}\">\n {{ text }}\n </ng-container>\n </span>\n}\n", styles: ["tui-textfield{scrollbar-width:none;-ms-overflow-style:none;transition-property:color;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;--t-height: var(--tui-height-l);--t-padding: var(--tui-padding-l);--t-label-y: -.75rem;--t-label-font: var(--tui-font-text-s);--t-end: 0rem;--t-start: 0rem;position:relative;display:flex;flex-wrap:wrap;align-items:center;cursor:pointer;min-block-size:var(--t-height);padding:0 var(--t-padding);border-radius:var(--tui-radius-l);font:var(--tui-font-text-ui-m);line-height:1.25rem;box-sizing:border-box;gap:0 .25rem;isolation:isolate}tui-textfield::-webkit-scrollbar,tui-textfield::-webkit-scrollbar-thumb{display:none}tui-textfield[tuiIcons]:read-only{color:var(--tui-text-tertiary)}tui-textfield[data-icon-start]{--t-start: 2.25rem}tui-textfield[data-icon-end]{--t-end: 2.25rem}tui-textfield[tuiIcons]:after{position:relative;block-size:auto;align-self:stretch;border-inline:var(--t-padding) solid transparent;margin:0 calc(-1 * var(--t-padding))}tui-textfield::-webkit-resizer{border:.25rem solid transparent;inline-size:.5rem;block-size:.5rem;box-sizing:content-box;color:var(--tui-text-tertiary);background:linear-gradient(-45deg,transparent,transparent .125rem,currentColor .125rem,currentColor .1875rem,transparent .1875rem,transparent .25rem,currentColor .25rem,currentColor .3125rem,transparent .35rem);background-clip:content-box}tui-textfield label,tui-textfield>.t-content,tui-textfield>.t-template{pointer-events:none}tui-textfield input,tui-textfield select,tui-textfield textarea{font:inherit;resize:none;outline:none;padding-block:1.125rem;color:var(--tui-text-primary)}tui-textfield input[inputmode=none],tui-textfield select[inputmode=none],tui-textfield textarea[inputmode=none]{caret-color:transparent}tui-textfield[data-size=s]{--t-height: var(--tui-height-s);--t-padding: var(--tui-padding-s);border-radius:var(--tui-radius-m);gap:0;font:var(--tui-font-text-ui-s);line-height:1rem}tui-textfield[data-size=s][data-icon-start]{--t-start: 1.25rem}tui-textfield[data-size=s][data-icon-end]{--t-end: 1.25rem}tui-textfield[data-size=s]:before{margin-inline:-.125rem .5rem;font-size:1rem}tui-textfield[data-size=s]:after{margin-inline:calc(.625rem - var(--t-padding)) calc(-.125rem - var(--t-padding));font-size:1rem}tui-textfield[data-size=s] input,tui-textfield[data-size=s] select,tui-textfield[data-size=s] textarea{padding-block:.5rem}tui-textfield[data-size=s]>.t-content{margin-inline-end:-.375rem}tui-textfield[data-size=m]{--t-height: var(--tui-height-m);--t-padding: var(--tui-padding-m);--t-label-font: var(--tui-font-text-xs);--t-label-y: -.5625rem;border-radius:var(--tui-radius-m);font:var(--tui-font-text-ui-s);line-height:1rem}tui-textfield[data-size=m][data-icon-start]{--t-start: 1.75rem}tui-textfield[data-size=m][data-icon-end]{--t-end: 1.75rem}tui-textfield[data-size=m]:before{margin-inline:-.125rem .125rem}tui-textfield[data-size=m]:after{margin-inline:calc(.25rem - var(--t-padding)) calc(-.125rem - var(--t-padding))}tui-textfield[data-size=m] input,tui-textfield[data-size=m] select,tui-textfield[data-size=m] textarea{padding-block:.875rem}tui-textfield[data-size=m]>.t-content{margin-inline-end:-.125rem}tui-textfield[data-size=l]{--t-label: -.7rem}tui-textfield[tuiIcons]:hover{color:var(--tui-text-secondary)}tui-textfield[tuiIcons]:hover:has(input:read-only):not([multi]),tui-textfield[tuiIcons]:hover:has(textarea:read-only),tui-textfield[tuiIcons]:hover:has(select[data-mode~=readonly]){color:var(--tui-text-tertiary)}tui-textfield:before{z-index:1;margin-inline-end:.5rem;pointer-events:none}tui-textfield:has(:disabled:not(.t-filler,button,option,[tuiChip])):before,tui-textfield:has(:disabled:not(.t-filler,button,option,[tuiChip])):after,tui-textfield:has(:disabled:not(.t-filler,button,option,[tuiChip]))>.t-template{opacity:var(--tui-disabled-opacity)}tui-textfield._disabled:before,tui-textfield._disabled:after,tui-textfield._disabled>.t-template{opacity:var(--tui-disabled-opacity)}tui-textfield._with-label>.t-template,tui-textfield._with-label input:not([type=range]),tui-textfield._with-label select:defined,tui-textfield._with-label textarea:defined{padding-block:calc(var(--t-height) / 3) 0}tui-textfield:not([data-focus=true])._with-label>.t-template::placeholder,tui-textfield:not([data-focus=true])._with-label input:not([type=range])::placeholder,tui-textfield:not([data-focus=true])._with-label select:defined::placeholder,tui-textfield:not([data-focus=true])._with-label textarea:defined::placeholder,tui-textfield:not([data-focus=true])._with-label>.t-template._empty,tui-textfield:not([data-focus=true])._with-label input:not([type=range])._empty,tui-textfield:not([data-focus=true])._with-label select:defined._empty,tui-textfield:not([data-focus=true])._with-label textarea:defined._empty{color:transparent}tui-textfield>.t-template,tui-textfield input:defined,tui-textfield select:defined,tui-textfield textarea:defined{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;-webkit-appearance:none;appearance:none;box-sizing:border-box;border-radius:inherit;border-width:0;overscroll-behavior:none;padding-inline:calc(var(--t-start, 0rem) + var(--t-padding)) calc(var(--t-end, 0rem) + var(--t-side) + var(--t-padding))}tui-textfield>.t-template:disabled,tui-textfield input:defined:disabled,tui-textfield select:defined:disabled,tui-textfield textarea:defined:disabled{animation:tuiPresent 1s infinite}tui-textfield>.t-template{display:flex;align-items:center;color:var(--tui-text-primary)}tui-textfield._with-template input:first-of-type,tui-textfield._with-template select,tui-textfield._with-template textarea{color:transparent!important}tui-textfield input:not([type=range]),tui-textfield select:defined,tui-textfield textarea:defined{pointer-events:auto;background:none}tui-textfield input:not([type=range]):not(select):read-only~.t-filler,tui-textfield select:defined:not(select):read-only~.t-filler,tui-textfield textarea:defined:not(select):read-only~.t-filler{display:none}tui-textfield input:not([type=range]):disabled~label,tui-textfield select:defined:disabled~label,tui-textfield textarea:defined:disabled~label,tui-textfield input:not([type=range]):disabled~.t-content,tui-textfield select:defined:disabled~.t-content,tui-textfield textarea:defined:disabled~.t-content{opacity:var(--tui-disabled-opacity)}tui-textfield input:not([type=range]):disabled~label>tui-icon,tui-textfield select:defined:disabled~label>tui-icon,tui-textfield textarea:defined:disabled~label>tui-icon,tui-textfield input:not([type=range]):disabled~.t-content>tui-icon,tui-textfield select:defined:disabled~.t-content>tui-icon,tui-textfield textarea:defined:disabled~.t-content>tui-icon{display:none}tui-textfield input:not([type=range]):-webkit-autofill~label,tui-textfield select:defined:-webkit-autofill~label,tui-textfield textarea:defined:-webkit-autofill~label,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown)~label,tui-textfield select:defined:not(._empty):not(:placeholder-shown)~label,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown)~label{font:var(--t-label-font);line-height:var(--t-height);transform:translateY(var(--t-label-y))}tui-textfield input:not([type=range]):-webkit-autofill:not(:disabled)[data-mode~=invalid]~label,tui-textfield select:defined:-webkit-autofill:not(:disabled)[data-mode~=invalid]~label,tui-textfield textarea:defined:-webkit-autofill:not(:disabled)[data-mode~=invalid]~label,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown):not(:disabled)[data-mode~=invalid]~label,tui-textfield select:defined:not(._empty):not(:placeholder-shown):not(:disabled)[data-mode~=invalid]~label,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown):not(:disabled)[data-mode~=invalid]~label,tui-textfield input:not([type=range]):-webkit-autofill:invalid:not(:disabled):not([data-mode])~label,tui-textfield select:defined:-webkit-autofill:invalid:not(:disabled):not([data-mode])~label,tui-textfield textarea:defined:-webkit-autofill:invalid:not(:disabled):not([data-mode])~label,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown):invalid:not(:disabled):not([data-mode])~label,tui-textfield select:defined:not(._empty):not(:placeholder-shown):invalid:not(:disabled):not([data-mode])~label,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown):invalid:not(:disabled):not([data-mode])~label{color:var(--tui-text-negative)}tui-textfield input:not([type=range]):-webkit-autofill:not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield select:defined:-webkit-autofill:not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield textarea:defined:-webkit-autofill:not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield input:not([type=range]):not(._empty):not(:placeholder-shown):not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield select:defined:not(._empty):not(:placeholder-shown):not(:disabled):not([data-mode~=readonly])~.t-content .t-clear,tui-textfield textarea:defined:not(._empty):not(:placeholder-shown):not(:disabled):not([data-mode~=readonly])~.t-content .t-clear{display:flex}tui-textfield input:not([type=range]):not([data-mode~=readonly]):focus-visible:not([data-focus=false])::placeholder,tui-textfield select:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])::placeholder,tui-textfield textarea:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])::placeholder,tui-textfield input:not([type=range]):not([data-mode~=readonly]):focus-visible:not([data-focus=false])._empty,tui-textfield select:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])._empty,tui-textfield textarea:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])._empty{color:var(--tui-text-tertiary)}tui-textfield input:not([type=range]):not([data-mode~=readonly]):focus-visible:not([data-focus=false])~label,tui-textfield select:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])~label,tui-textfield textarea:defined:not([data-mode~=readonly]):focus-visible:not([data-focus=false])~label{color:var(--tui-text-primary)!important;font:var(--t-label-font);line-height:var(--t-height);transform:translateY(var(--t-label-y))}tui-textfield input:not([type=range]):not([data-mode~=readonly])[data-focus=true]::placeholder,tui-textfield select:defined:not([data-mode~=readonly])[data-focus=true]::placeholder,tui-textfield textarea:defined:not([data-mode~=readonly])[data-focus=true]::placeholder,tui-textfield input:not([type=range]):not([data-mode~=readonly])[data-focus=true]._empty,tui-textfield select:defined:not([data-mode~=readonly])[data-focus=true]._empty,tui-textfield textarea:defined:not([data-mode~=readonly])[data-focus=true]._empty{color:var(--tui-text-tertiary)}tui-textfield input:not([type=range]):not([data-mode~=readonly])[data-focus=true]~label,tui-textfield select:defined:not([data-mode~=readonly])[data-focus=true]~label,tui-textfield textarea:defined:not([data-mode~=readonly])[data-focus=true]~label{color:var(--tui-text-primary)!important;font:var(--t-label-font);line-height:var(--t-height);transform:translateY(var(--t-label-y))}tui-textfield [tuiLabel][tuiLabel][tuiLabel]{transition-property:all;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative;display:block;flex:1;align-self:flex-start;font-size:inherit;line-height:var(--t-height);transition-duration:inherit}tui-textfield label:defined,tui-textfield input:defined::placeholder,tui-textfield textarea:defined::placeholder,tui-textfield select:defined._empty{color:var(--tui-text-secondary)}tui-textfield select:not([data-mode~=readonly]){cursor:pointer}tui-textfield select option[value=\"\"]:disabled{color:transparent}tui-textfield select optgroup,tui-textfield select option{background-color:var(--tui-background-elevation-3)}tui-textfield select optgroup,tui-textfield select option:not(:disabled){color:var(--tui-text-primary)}tui-textfield button,tui-textfield a{pointer-events:auto}tui-textfield>.t-content{z-index:1;display:flex;block-size:var(--t-height);align-items:center;gap:inherit;margin-inline-start:auto;isolation:isolate;border-radius:inherit}tui-textfield>.t-content>tui-icon{pointer-events:auto}tui-textfield textarea~.t-content{min-inline-size:.5rem}tui-textfield .t-clear{z-index:1;display:none;pointer-events:auto}tui-textfield>.t-filler:defined{pointer-events:none!important;color:var(--tui-text-tertiary);opacity:1}tui-textfield [tuiFluidTypography]{font-weight:700}tui-textfield [tuiSelectLike]:not(:read-only){cursor:pointer}tui-textfield:has(input[type=tel]){direction:ltr}tui-textfield[multi][multi]{flex-wrap:nowrap;overflow:scroll;align-items:stretch;cursor:text;gap:0;max-block-size:calc(var(--t-vertical) * 2 + var(--t-item-height) * var(--t-rows));overscroll-behavior:none;scroll-behavior:var(--tui-scroll-behavior)}tui-textfield[multi][multi]:before,tui-textfield[multi][multi]:after{position:sticky;inset-block-start:0;inset-inline-start:0;block-size:var(--t-height)}tui-textfield[multi][multi][tuiChevron]:after{inset-block-start:.375rem;block-size:calc(var(--t-height) - .75rem)}tui-textfield[multi][multi]>.t-scrollbar{transform:translate(calc(var(--t-padding) * var(--tui-inline)));margin-inline:calc(-1 * var(--t-start)) calc(1px - 100% + var(--t-start))}tui-textfield[multi][multi]>.t-scrollbar .t-bar_horizontal{display:none}tui-textfield[multi][multi]>.t-items{position:sticky;display:flex;inset-inline-start:var(--t-start);min-inline-size:0;max-block-size:var(--t-height);min-block-size:fit-content;flex:1;align-items:center;flex-wrap:wrap;padding:var(--t-vertical) 0;transition-duration:inherit;box-sizing:border-box}tui-textfield[multi][multi]>.t-items:after{content:\"\";min-inline-size:1px;min-block-size:1px}tui-textfield[multi][multi]>.t-items_horizontal{clip-path:inset(0 0 0 calc(var(--t-start) / 2 - var(--t-padding) - .25rem));flex-wrap:nowrap}[dir=rtl] tui-textfield[multi][multi]>.t-items_horizontal{clip-path:inset(0 calc(var(--t-start) / 2 - var(--t-padding) - .25rem) 0 0)}tui-textfield[multi][multi]>.t-items_horizontal>.t-input{padding-inline-end:calc(var(--t-side) + var(--t-end) + var(--t-padding))}tui-textfield[multi][multi]>.t-items:not(tui-textfield[multi][multi]>.t-items_horizontal){--t-scroll: 0}tui-textfield[multi][multi]>.t-items>label[tuiLabel]{position:absolute;inset-block-start:0;inline-size:100%}tui-textfield[multi][multi]>.t-items>.t-input{position:relative;display:flex;align-items:center;flex:1;block-size:1.25em;max-block-size:1.25rem;max-inline-size:100%;pointer-events:none;transform:translate(var(--t-scroll))}tui-textfield[multi][multi]>.t-items>.t-input input{position:absolute;inset-inline-start:0;inline-size:100%;padding:0;pointer-events:auto}tui-textfield[multi][multi]>.t-items>.t-input .t-ghost{visibility:hidden;white-space:pre;text-overflow:clip;padding-inline-end:.125rem;min-block-size:var(--t-item-height, 1em)}tui-textfield[multi][multi]>.t-items>.t-input .t-filler{position:absolute;left:0;inset-inline-start:0;color:var(--tui-text-tertiary);pointer-events:none}tui-textfield[multi][multi]>.t-items>.t-input .t-filler_hidden{display:none}tui-textfield[multi][multi]>.t-content{position:sticky;inset-block-start:0;inset-inline-start:calc(100% - var(--t-side) - var(--t-end) + var(--t-padding) - var(--t-offset));margin:0;gap:.25rem}tui-textfield[multi][multi]>.t-content .t-clear{display:flex}tui-textfield[multi][multi][data-mode~=invalid]:not([data-mode~=readonly])>.t-items>[tuiLabel]{color:var(--tui-text-negative)}tui-textfield[multi][multi][data-focus=true]:not([data-mode~=readonly])>.t-items>[tuiLabel]{color:var(--tui-text-primary)!important}tui-textfield[multi][multi][data-mode~=readonly]>.t-content .t-clear,tui-textfield[multi][multi]._disabled>.t-content .t-clear,tui-textfield[multi][multi]._empty>.t-content .t-clear{display:none}tui-textfield[multi][multi]>.t-items input:not(:focus)::placeholder,tui-textfield[multi][multi][data-mode~=readonly]>.t-items input::placeholder,tui-textfield[multi][multi][data-mode~=readonly]>.t-items label~.t-input input::placeholder{opacity:0}tui-textfield[multi][multi]._empty>.t-items input::placeholder,tui-textfield[multi][multi][data-focus=true]:not([data-mode~=readonly]):not(:focus-within)>.t-items input::placeholder{opacity:1}tui-textfield[multi][multi]:not(._empty)>.t-items [tuiLabel],tui-textfield[multi][multi][data-focus=true]:not([data-mode~=readonly])>.t-items [tuiLabel]{font:var(--t-label-font);line-height:var(--t-height);transform:translateY(var(--t-label-y))}tui-textfield[multi][multi][data-state=disabled],tui-textfield[multi][multi][data-mode~=readonly]{pointer-events:none}tui-textfield[multi][multi][data-state=disabled] select,tui-textfield[multi][multi][data-mode~=readonly] select{display:none}tui-textfield[multi][multi][data-size=l]{--t-vertical: .625rem;--t-offset: calc(1rem - var(--t-end) / 4.5)}tui-textfield[multi][multi][data-size=l]:before{margin-inline-end:.75rem}tui-textfield[multi][multi][data-size=l]:after{inset-inline-start:calc(100% - var(--t-end) - .375rem + .25 * (1em - 1rem));margin-inline:-.75rem calc(.5 * (1.5rem - 1em) - var(--t-padding))}tui-textfield[multi][multi][data-size=l]._with-label{--t-vertical: 1.125rem}tui-textfield[multi][multi][data-size=l]._with-label>.t-items{padding:1.75rem 0 .5rem}tui-textfield[multi][multi][data-size=m]{--t-vertical: .5rem;--t-offset: calc(.75rem + var(--t-end) / 14)}tui-textfield[multi][multi][data-size=m]:before{inset-inline-start:-.125rem;margin-inline-end:.375rem}tui-textfield[multi][multi][data-size=m]:after{inset-inline-start:calc(100% - var(--t-end) - .25rem);border-width:.625rem;margin-inline:-.125rem calc(.5 * (1.5rem - 1em) - var(--t-padding))}tui-textfield[multi][multi][data-size=m]._with-label{--t-vertical: .875rem}tui-textfield[multi][multi][data-size=m]._with-label>.t-items{padding:1.375rem 0 .375rem}tui-textfield[multi][multi][data-size=m]>.t-content{transform:translate(.125rem)}tui-textfield[multi][multi][data-size=s]{--t-vertical: .125rem;--t-offset: calc(.625rem + var(--t-end) / 10)}tui-textfield[multi][multi][data-size=s]:before{inset-inline-start:-.125rem;margin-inline-end:.375rem}tui-textfield[multi][multi][data-size=s]:after{inset-inline-start:calc(100% - var(--t-end) - .125rem);border-width:.5rem;margin-inline-end:calc(-1 * var(--t-padding))}tui-textfield[multi][multi][data-size=s]>.t-content{gap:0;transform:translate(calc(.375rem - var(--t-end) / 10))}tui-textfield[multi][multi]:focus-visible:not([data-focus=false]) input::placeholder,tui-textfield[multi][multi]:focus-visible:not([data-focus=false]) input._empty{color:var(--tui-text-tertiary)}tui-textfield[multi][multi][data-focus=true] input::placeholder,tui-textfield[multi][multi][data-focus=true] input._empty{color:var(--tui-text-tertiary)}tui-textfield[multi][multi] tui-textfield-item{transform:translate(var(--t-scroll))}tui-textfield[multi][multi] input::placeholder{transition-property:color;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out}tui-textfield[multi][multi] select{opacity:0;padding:0;pointer-events:none}tui-textfield[multi][multi]._empty>.t-items select~.t-filler{display:block}tui-textfield[multi][multi]._empty:not([data-focus=true])>.t-items select~.t-filler{color:var(--tui-text-secondary)}tui-textfield[multi][multi]:has([tuiSelectLike]){cursor:pointer}\n"] }]
334
+ }] });
630
335
 
631
336
  const TuiTextfield = [
632
337
  TuiItem,
633
338
  TuiLabel,
634
- TuiSelect,
635
339
  TuiTextfieldComponent,
636
- TuiTextfieldDirective,
637
340
  TuiTextfieldOptionsDirective,
638
- TuiTextfieldDropdownDirective,
639
341
  TuiTextfieldMultiComponent,
342
+ TuiDropdownContent,
640
343
  ];
641
344
 
642
345
  function tuiInjectAuxiliary(predicate) {
@@ -646,26 +349,30 @@ function tuiInjectAuxiliary(predicate) {
646
349
 
647
350
  class TuiTextfieldContent {
648
351
  constructor() {
649
- this.ref = inject(TuiTextfieldComponent).vcr?.createEmbeddedView(inject(TemplateRef));
352
+ this.ref = inject(TuiTextfieldComponent)
353
+ .vcr()
354
+ ?.createEmbeddedView(inject(TemplateRef));
650
355
  }
651
356
  ngDoCheck() {
652
357
  this.ref?.detectChanges();
653
358
  }
654
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTextfieldContent, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
655
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TuiTextfieldContent, isStandalone: true, selector: "ng-template[tuiTextfieldContent]", ngImport: i0 }); }
359
+ ngOnDestroy() {
360
+ this.ref?.destroy();
361
+ }
362
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiTextfieldContent, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
363
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.17", type: TuiTextfieldContent, isStandalone: true, selector: "ng-template[tuiTextfieldContent]", ngImport: i0 }); }
656
364
  }
657
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTextfieldContent, decorators: [{
365
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiTextfieldContent, decorators: [{
658
366
  type: Directive,
659
367
  args: [{
660
- standalone: true,
661
368
  selector: 'ng-template[tuiTextfieldContent]',
662
369
  }]
663
370
  }] });
664
371
 
665
- function tuiTextfieldIconBinding(token) {
666
- const textfield = inject(TUI_TEXTFIELD_OPTIONS);
667
- const options = inject(token);
668
- return tuiDirectiveBinding(TuiIcons, 'iconEnd', computed(() => options.icon(textfield.size())), {});
372
+ function tuiTextfieldIcon(token) {
373
+ const { size } = inject(TUI_TEXTFIELD_OPTIONS);
374
+ const { icon } = inject(token);
375
+ return tuiIconEnd(computed(() => icon(size())), {});
669
376
  }
670
377
 
671
378
  /**
@@ -680,17 +387,16 @@ class TuiWithNativePicker {
680
387
  constructor() {
681
388
  tuiInjectElement().type = 'text';
682
389
  }
683
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiWithNativePicker, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
684
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TuiWithNativePicker, isStandalone: true, ngImport: i0 }); }
390
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiWithNativePicker, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
391
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.17", type: TuiWithNativePicker, isStandalone: true, ngImport: i0 }); }
685
392
  }
686
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiWithNativePicker, decorators: [{
687
- type: Directive,
688
- args: [{ standalone: true }]
689
- }], ctorParameters: function () { return []; } });
393
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiWithNativePicker, decorators: [{
394
+ type: Directive
395
+ }], ctorParameters: () => [] });
690
396
 
691
397
  /**
692
398
  * Generated bundle index. Do not edit.
693
399
  */
694
400
 
695
- export { TUI_TEXTFIELD_ACCESSOR, TUI_TEXTFIELD_OPTIONS, TuiSelect, TuiSelectLike, TuiTextfield, TuiTextfieldBase, TuiTextfieldBaseComponent, TuiTextfieldComponent, TuiTextfieldContent, TuiTextfieldDirective, TuiTextfieldDropdownDirective, TuiTextfieldItemComponent, TuiTextfieldMultiComponent, TuiTextfieldOptionsDirective, TuiWithNativePicker, TuiWithTextfield, TuiWithTextfieldDropdown, tuiAsTextfieldAccessor, tuiInjectAuxiliary, tuiTextfieldIconBinding, tuiTextfieldOptionsProvider };
401
+ export { TUI_TEXTFIELD_ACCESSOR, TUI_TEXTFIELD_ITEM, TUI_TEXTFIELD_OPTIONS, TuiSelectLike, TuiTextfield, TuiTextfieldComponent, TuiTextfieldContent, TuiTextfieldItemComponent, TuiTextfieldMultiComponent, TuiTextfieldOptionsDirective, TuiWithNativePicker, tuiAsTextfieldAccessor, tuiInjectAuxiliary, tuiTextfieldIcon, tuiTextfieldOptionsProvider };
696
402
  //# sourceMappingURL=taiga-ui-core-components-textfield.mjs.map