@taiga-ui/core 4.52.0-canary.aaf153c → 4.52.0-canary.ae38a1e

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 (318) hide show
  1. package/README.md +1 -1
  2. package/classes/accessors.d.ts +2 -2
  3. package/components/calendar/calendar-sheet.component.d.ts +1 -1
  4. package/components/calendar/calendar-sheet.options.d.ts +1 -3
  5. package/{pipes/calendar-sheet → components/calendar}/calendar-sheet.pipe.d.ts +2 -2
  6. package/components/calendar/calendar-spin.component.d.ts +1 -0
  7. package/components/calendar/calendar-year.component.d.ts +1 -1
  8. package/components/calendar/calendar.options.d.ts +9 -0
  9. package/components/calendar/index.d.ts +3 -0
  10. package/{pipes/order-week-days → components/calendar}/order-week-days.pipe.d.ts +1 -1
  11. package/components/data-list/data-list.component.d.ts +7 -11
  12. package/components/data-list/data-list.d.ts +3 -4
  13. package/components/data-list/data-list.tokens.d.ts +1 -23
  14. package/components/data-list/index.d.ts +3 -4
  15. package/components/data-list/opt-group.directive.d.ts +2 -2
  16. package/components/data-list/option-content.directive.d.ts +14 -0
  17. package/components/data-list/option-with-value.directive.d.ts +9 -0
  18. package/components/data-list/option.directive.d.ts +19 -0
  19. package/components/icon/icon.component.d.ts +2 -2
  20. package/components/index.d.ts +2 -4
  21. package/components/input/index.d.ts +2 -0
  22. package/components/input/input.d.ts +5 -0
  23. package/components/input/input.directive.d.ts +29 -0
  24. package/components/label/label.directive.d.ts +1 -1
  25. package/components/link/index.d.ts +0 -1
  26. package/components/link/link.directive.d.ts +8 -6
  27. package/components/loader/loader.options.d.ts +1 -3
  28. package/components/notification/index.d.ts +3 -0
  29. package/components/notification/notification.component.d.ts +14 -0
  30. package/components/notification/notification.d.ts +3 -0
  31. package/components/notification/notification.directive.d.ts +5 -6
  32. package/components/notification/notification.options.d.ts +10 -7
  33. package/components/notification/notification.service.d.ts +17 -0
  34. package/components/root/root.component.d.ts +1 -1
  35. package/components/scrollbar/scroll-into-view.directive.d.ts +3 -2
  36. package/components/scrollbar/scroll-ref.directive.d.ts +2 -0
  37. package/components/scrollbar/scrollbar.component.d.ts +1 -5
  38. package/components/scrollbar/scrollbar.directive.d.ts +2 -2
  39. package/components/spin-button/spin-button.component.d.ts +1 -1
  40. package/components/textfield/index.d.ts +0 -1
  41. package/components/textfield/textfield-multi/textfield-item.component.d.ts +3 -2
  42. package/components/textfield/textfield-multi/textfield-multi.component.d.ts +8 -13
  43. package/components/textfield/textfield.component.d.ts +20 -33
  44. package/components/textfield/textfield.d.ts +2 -3
  45. package/directives/appearance/appearance.directive.d.ts +1 -1
  46. package/directives/appearance/appearance.options.d.ts +1 -2
  47. package/directives/button-x/button-x.directive.d.ts +6 -0
  48. package/directives/button-x/index.d.ts +1 -0
  49. package/directives/date-format/date-format.directive.d.ts +3 -7
  50. package/directives/group/group.directive.d.ts +7 -7
  51. package/directives/group/group.options.d.ts +1 -3
  52. package/directives/index.d.ts +1 -5
  53. package/directives/items-handlers/items-handlers.directive.d.ts +5 -9
  54. package/directives/items-handlers/items-handlers.tokens.d.ts +4 -4
  55. package/directives/number-format/number-format.directive.d.ts +3 -7
  56. package/fesm2022/taiga-ui-core-classes.mjs +9 -11
  57. package/fesm2022/taiga-ui-core-classes.mjs.map +1 -1
  58. package/fesm2022/taiga-ui-core-components-button.mjs +7 -7
  59. package/fesm2022/taiga-ui-core-components-button.mjs.map +1 -1
  60. package/fesm2022/taiga-ui-core-components-calendar.mjs +138 -37
  61. package/fesm2022/taiga-ui-core-components-calendar.mjs.map +1 -1
  62. package/fesm2022/taiga-ui-core-components-cell.mjs +7 -7
  63. package/fesm2022/taiga-ui-core-components-cell.mjs.map +1 -1
  64. package/fesm2022/taiga-ui-core-components-data-list.mjs +110 -279
  65. package/fesm2022/taiga-ui-core-components-data-list.mjs.map +1 -1
  66. package/fesm2022/taiga-ui-core-components-error.mjs +12 -11
  67. package/fesm2022/taiga-ui-core-components-error.mjs.map +1 -1
  68. package/fesm2022/taiga-ui-core-components-expand.mjs +3 -3
  69. package/fesm2022/taiga-ui-core-components-icon.mjs +10 -11
  70. package/fesm2022/taiga-ui-core-components-icon.mjs.map +1 -1
  71. package/fesm2022/taiga-ui-core-components-input.mjs +103 -0
  72. package/fesm2022/taiga-ui-core-components-input.mjs.map +1 -0
  73. package/fesm2022/taiga-ui-core-components-label.mjs +11 -13
  74. package/fesm2022/taiga-ui-core-components-label.mjs.map +1 -1
  75. package/fesm2022/taiga-ui-core-components-link.mjs +13 -28
  76. package/fesm2022/taiga-ui-core-components-link.mjs.map +1 -1
  77. package/fesm2022/taiga-ui-core-components-loader.mjs +7 -12
  78. package/fesm2022/taiga-ui-core-components-loader.mjs.map +1 -1
  79. package/fesm2022/taiga-ui-core-components-notification.mjs +99 -29
  80. package/fesm2022/taiga-ui-core-components-notification.mjs.map +1 -1
  81. package/fesm2022/taiga-ui-core-components-root.mjs +9 -13
  82. package/fesm2022/taiga-ui-core-components-root.mjs.map +1 -1
  83. package/fesm2022/taiga-ui-core-components-scrollbar.mjs +69 -83
  84. package/fesm2022/taiga-ui-core-components-scrollbar.mjs.map +1 -1
  85. package/fesm2022/taiga-ui-core-components-spin-button.mjs +6 -6
  86. package/fesm2022/taiga-ui-core-components-spin-button.mjs.map +1 -1
  87. package/fesm2022/taiga-ui-core-components-textfield.mjs +104 -266
  88. package/fesm2022/taiga-ui-core-components-textfield.mjs.map +1 -1
  89. package/fesm2022/{taiga-ui-core-directives-title.mjs → taiga-ui-core-components-title.mjs} +8 -8
  90. package/fesm2022/{taiga-ui-core-directives-title.mjs.map → taiga-ui-core-components-title.mjs.map} +1 -1
  91. package/fesm2022/taiga-ui-core-components.mjs +2 -4
  92. package/fesm2022/taiga-ui-core-components.mjs.map +1 -1
  93. package/fesm2022/taiga-ui-core-directives-appearance.mjs +16 -16
  94. package/fesm2022/taiga-ui-core-directives-appearance.mjs.map +1 -1
  95. package/fesm2022/taiga-ui-core-directives-button-x.mjs +51 -0
  96. package/fesm2022/taiga-ui-core-directives-button-x.mjs.map +1 -0
  97. package/fesm2022/taiga-ui-core-directives-date-format.mjs +26 -20
  98. package/fesm2022/taiga-ui-core-directives-date-format.mjs.map +1 -1
  99. package/fesm2022/taiga-ui-core-directives-group.mjs +23 -35
  100. package/fesm2022/taiga-ui-core-directives-group.mjs.map +1 -1
  101. package/fesm2022/taiga-ui-core-directives-icons.mjs +12 -12
  102. package/fesm2022/taiga-ui-core-directives-icons.mjs.map +1 -1
  103. package/fesm2022/taiga-ui-core-directives-items-handlers.mjs +16 -40
  104. package/fesm2022/taiga-ui-core-directives-items-handlers.mjs.map +1 -1
  105. package/fesm2022/taiga-ui-core-directives-number-format.mjs +32 -20
  106. package/fesm2022/taiga-ui-core-directives-number-format.mjs.map +1 -1
  107. package/fesm2022/taiga-ui-core-directives.mjs +1 -5
  108. package/fesm2022/taiga-ui-core-directives.mjs.map +1 -1
  109. package/fesm2022/taiga-ui-core-pipes-format-number.mjs +21 -15
  110. package/fesm2022/taiga-ui-core-pipes-format-number.mjs.map +1 -1
  111. package/fesm2022/taiga-ui-core-pipes.mjs +0 -7
  112. package/fesm2022/taiga-ui-core-pipes.mjs.map +1 -1
  113. package/fesm2022/taiga-ui-core-portals-alert.mjs +73 -0
  114. package/fesm2022/taiga-ui-core-portals-alert.mjs.map +1 -0
  115. package/fesm2022/taiga-ui-core-portals-dialog.mjs +159 -0
  116. package/fesm2022/taiga-ui-core-portals-dialog.mjs.map +1 -0
  117. package/fesm2022/{taiga-ui-core-directives-dropdown.mjs → taiga-ui-core-portals-dropdown.mjs} +214 -348
  118. package/fesm2022/taiga-ui-core-portals-dropdown.mjs.map +1 -0
  119. package/fesm2022/{taiga-ui-core-directives-hint.mjs → taiga-ui-core-portals-hint.mjs} +73 -132
  120. package/fesm2022/taiga-ui-core-portals-hint.mjs.map +1 -0
  121. package/fesm2022/taiga-ui-core-portals-modal.mjs +89 -0
  122. package/fesm2022/taiga-ui-core-portals-modal.mjs.map +1 -0
  123. package/fesm2022/{taiga-ui-core-directives-popup.mjs → taiga-ui-core-portals-popup.mjs} +11 -11
  124. package/fesm2022/taiga-ui-core-portals-popup.mjs.map +1 -0
  125. package/fesm2022/taiga-ui-core-portals.mjs +11 -0
  126. package/fesm2022/taiga-ui-core-portals.mjs.map +1 -0
  127. package/fesm2022/taiga-ui-core-services.mjs +15 -79
  128. package/fesm2022/taiga-ui-core-services.mjs.map +1 -1
  129. package/fesm2022/taiga-ui-core-tokens.mjs +51 -60
  130. package/fesm2022/taiga-ui-core-tokens.mjs.map +1 -1
  131. package/fesm2022/taiga-ui-core-utils-format.mjs +1 -22
  132. package/fesm2022/taiga-ui-core-utils-format.mjs.map +1 -1
  133. package/fesm2022/taiga-ui-core-utils-miscellaneous.mjs +19 -19
  134. package/fesm2022/taiga-ui-core-utils-miscellaneous.mjs.map +1 -1
  135. package/fesm2022/taiga-ui-core.mjs +1 -1
  136. package/index.d.ts +1 -1
  137. package/package.json +72 -98
  138. package/pipes/format-number/format-number.pipe.d.ts +6 -4
  139. package/pipes/index.d.ts +0 -7
  140. package/{directives/notification/notification.directive.d.ts → portals/alert/alert.directive.d.ts} +3 -3
  141. package/{directives/notification/notification.service.d.ts → portals/alert/alert.service.d.ts} +3 -3
  142. package/portals/alert/index.d.ts +2 -0
  143. package/{components → portals}/dialog/dialog.component.d.ts +2 -3
  144. package/{components → portals}/dialog/dialog.options.d.ts +2 -3
  145. package/{components → portals}/dialog/dialog.providers.d.ts +1 -2
  146. package/{components → portals}/dialog/dialog.service.d.ts +1 -1
  147. package/{components → portals}/dialog/index.d.ts +0 -1
  148. package/portals/dropdown/dropdown-close.directive.d.ts +15 -0
  149. package/{directives → portals}/dropdown/dropdown-context.directive.d.ts +0 -1
  150. package/{directives → portals}/dropdown/dropdown-hover.directive.d.ts +5 -10
  151. package/{directives → portals}/dropdown/dropdown-hover.options.d.ts +1 -3
  152. package/{directives → portals}/dropdown/dropdown-manual.directive.d.ts +2 -2
  153. package/portals/dropdown/dropdown-open.directive.d.ts +29 -0
  154. package/{directives → portals}/dropdown/dropdown-options.directive.d.ts +0 -4
  155. package/{directives → portals}/dropdown/dropdown-position-sided.directive.d.ts +3 -3
  156. package/{directives → portals}/dropdown/dropdown-position.directive.d.ts +5 -5
  157. package/{directives → portals}/dropdown/dropdown-selection.directive.d.ts +4 -5
  158. package/{directives → portals}/dropdown/dropdown.bindings.d.ts +0 -1
  159. package/{directives → portals}/dropdown/dropdown.d.ts +1 -2
  160. package/{directives → portals}/dropdown/dropdown.directive.d.ts +5 -6
  161. package/{directives → portals}/dropdown/index.d.ts +1 -1
  162. package/portals/hint/hint-options.directive.d.ts +17 -0
  163. package/{directives → portals}/hint/hint-position.directive.d.ts +5 -5
  164. package/{directives → portals}/hint/hint.d.ts +1 -2
  165. package/{directives → portals}/hint/hint.directive.d.ts +2 -2
  166. package/portals/index.d.ts +6 -0
  167. package/{components → portals}/modal/modal.component.d.ts +3 -3
  168. package/{components → portals}/modal/modal.service.d.ts +3 -3
  169. package/services/index.d.ts +0 -3
  170. package/styles/components/appearance.less +5 -0
  171. package/styles/components/button.less +10 -20
  172. package/styles/components/icon.less +11 -0
  173. package/styles/components/icons.less +2 -1
  174. package/styles/components/label.less +3 -12
  175. package/styles/components/link.less +9 -24
  176. package/styles/components/notification.less +31 -65
  177. package/styles/components/textfield.less +129 -211
  178. package/styles/components/title.less +8 -8
  179. package/styles/mixins/appearance.less +10 -26
  180. package/styles/mixins/appearance.scss +8 -24
  181. package/styles/mixins/date-picker.less +1 -1
  182. package/styles/mixins/mixins.less +0 -5
  183. package/styles/mixins/mixins.scss +0 -5
  184. package/styles/mixins/picker.less +1 -1
  185. package/styles/mixins/picker.scss +1 -1
  186. package/styles/mixins/slider.less +4 -10
  187. package/styles/mixins/slider.scss +23 -22
  188. package/styles/taiga-ui-local.less +0 -1
  189. package/styles/taiga-ui-local.scss +0 -1
  190. package/styles/taiga-ui-theme.less +0 -1
  191. package/styles/theme/appearance/outline.less +9 -18
  192. package/styles/theme/appearance/primary.less +2 -4
  193. package/styles/theme/appearance/secondary.less +6 -14
  194. package/styles/theme/appearance/status.less +0 -4
  195. package/styles/theme/appearance/table.less +36 -35
  196. package/styles/theme/appearance/textfield.less +30 -27
  197. package/styles/theme/appearance.less +0 -1
  198. package/styles/theme/variables.less +16 -19
  199. package/styles/variables/media.less +13 -18
  200. package/styles/variables/media.scss +13 -13
  201. package/tokens/breakpoint.d.ts +4 -0
  202. package/tokens/common-icons.d.ts +3 -3
  203. package/tokens/date-format.d.ts +2 -3
  204. package/tokens/icons.d.ts +0 -4
  205. package/tokens/index.d.ts +1 -4
  206. package/tokens/number-format.d.ts +2 -3
  207. package/types/index.d.ts +0 -2
  208. package/types/point.d.ts +1 -1
  209. package/types/size.d.ts +0 -11
  210. package/utils/format/index.d.ts +0 -1
  211. package/utils/miscellaneous/font-scaling.d.ts +2 -1
  212. package/utils/miscellaneous/get-duration.d.ts +2 -0
  213. package/utils/miscellaneous/index.d.ts +1 -1
  214. package/animations/animations.d.ts +0 -109
  215. package/animations/index.d.ts +0 -1
  216. package/components/alert/alert.component.d.ts +0 -14
  217. package/components/alert/alert.directive.d.ts +0 -8
  218. package/components/alert/alert.interfaces.d.ts +0 -13
  219. package/components/alert/alert.service.d.ts +0 -11
  220. package/components/alert/alert.tokens.d.ts +0 -6
  221. package/components/alert/index.d.ts +0 -5
  222. package/components/data-list/data-list.directive.d.ts +0 -7
  223. package/components/data-list/option/option-content.d.ts +0 -16
  224. package/components/data-list/option/option-legacy.component.d.ts +0 -24
  225. package/components/data-list/option/option.directive.d.ts +0 -27
  226. package/components/dialog/active-zone-adapter.directive.d.ts +0 -11
  227. package/components/dialog/dialogs.component.d.ts +0 -8
  228. package/components/header/header.directive.d.ts +0 -17
  229. package/components/header/index.d.ts +0 -1
  230. package/components/link/link.options.d.ts +0 -12
  231. package/components/textfield/textfield.directive.d.ts +0 -35
  232. package/directives/dropdown/dropdown-open-legacy.directive.d.ts +0 -12
  233. package/directives/dropdown/dropdown-open.directive.d.ts +0 -33
  234. package/directives/hint/hint-options.directive.d.ts +0 -36
  235. package/directives/notification/index.d.ts +0 -2
  236. package/fesm2022/taiga-ui-core-animations.mjs +0 -370
  237. package/fesm2022/taiga-ui-core-animations.mjs.map +0 -1
  238. package/fesm2022/taiga-ui-core-components-alert.mjs +0 -110
  239. package/fesm2022/taiga-ui-core-components-alert.mjs.map +0 -1
  240. package/fesm2022/taiga-ui-core-components-dialog.mjs +0 -227
  241. package/fesm2022/taiga-ui-core-components-dialog.mjs.map +0 -1
  242. package/fesm2022/taiga-ui-core-components-header.mjs +0 -42
  243. package/fesm2022/taiga-ui-core-components-header.mjs.map +0 -1
  244. package/fesm2022/taiga-ui-core-components-modal.mjs +0 -89
  245. package/fesm2022/taiga-ui-core-components-modal.mjs.map +0 -1
  246. package/fesm2022/taiga-ui-core-directives-dropdown.mjs.map +0 -1
  247. package/fesm2022/taiga-ui-core-directives-hint.mjs.map +0 -1
  248. package/fesm2022/taiga-ui-core-directives-notification.mjs +0 -73
  249. package/fesm2022/taiga-ui-core-directives-notification.mjs.map +0 -1
  250. package/fesm2022/taiga-ui-core-directives-popup.mjs.map +0 -1
  251. package/fesm2022/taiga-ui-core-pipes-auto-color.mjs +0 -25
  252. package/fesm2022/taiga-ui-core-pipes-auto-color.mjs.map +0 -1
  253. package/fesm2022/taiga-ui-core-pipes-calendar-sheet.mjs +0 -94
  254. package/fesm2022/taiga-ui-core-pipes-calendar-sheet.mjs.map +0 -1
  255. package/fesm2022/taiga-ui-core-pipes-flag.mjs +0 -32
  256. package/fesm2022/taiga-ui-core-pipes-flag.mjs.map +0 -1
  257. package/fesm2022/taiga-ui-core-pipes-format-date.mjs +0 -28
  258. package/fesm2022/taiga-ui-core-pipes-format-date.mjs.map +0 -1
  259. package/fesm2022/taiga-ui-core-pipes-initials.mjs +0 -29
  260. package/fesm2022/taiga-ui-core-pipes-initials.mjs.map +0 -1
  261. package/fesm2022/taiga-ui-core-pipes-month.mjs +0 -30
  262. package/fesm2022/taiga-ui-core-pipes-month.mjs.map +0 -1
  263. package/fesm2022/taiga-ui-core-pipes-order-week-days.mjs +0 -36
  264. package/fesm2022/taiga-ui-core-pipes-order-week-days.mjs.map +0 -1
  265. package/pipes/auto-color/auto-color.pipe.d.ts +0 -7
  266. package/pipes/auto-color/index.d.ts +0 -1
  267. package/pipes/calendar-sheet/index.d.ts +0 -1
  268. package/pipes/calendar-sheet/utils.d.ts +0 -20
  269. package/pipes/flag/flag.pipe.d.ts +0 -14
  270. package/pipes/flag/index.d.ts +0 -1
  271. package/pipes/format-date/format-date.pipe.d.ts +0 -9
  272. package/pipes/format-date/index.d.ts +0 -1
  273. package/pipes/initials/index.d.ts +0 -1
  274. package/pipes/initials/initials.pipe.d.ts +0 -7
  275. package/pipes/month/index.d.ts +0 -1
  276. package/pipes/month/month.pipe.d.ts +0 -10
  277. package/pipes/order-week-days/index.d.ts +0 -1
  278. package/services/breakpoint.service.d.ts +0 -16
  279. package/services/dark-theme.service.d.ts +0 -10
  280. package/services/format-date.service.d.ts +0 -8
  281. package/styles/mixins/wrapper.less +0 -64
  282. package/styles/mixins/wrapper.scss +0 -61
  283. package/styles/theme/appearance/opposite.less +0 -17
  284. package/styles/theme/wrapper.less +0 -211
  285. package/tokens/day-type-handler.d.ts +0 -7
  286. package/tokens/first-day-of-week.d.ts +0 -5
  287. package/tokens/scroll-ref.d.ts +0 -2
  288. package/tokens/spin-icons.d.ts +0 -6
  289. package/types/range-state.d.ts +0 -4
  290. package/types/value-content-context.d.ts +0 -4
  291. package/utils/format/string-hash-to-hsl.d.ts +0 -6
  292. package/utils/miscellaneous/to-animation-options.d.ts +0 -4
  293. /package/{directives → components}/title/index.d.ts +0 -0
  294. /package/{directives → components}/title/title.directive.d.ts +0 -0
  295. /package/{components → portals}/dialog/dialog.directive.d.ts +0 -0
  296. /package/{components → portals}/dialog/dialog.factory.d.ts +0 -0
  297. /package/{directives → portals}/dropdown/dropdown-content.directive.d.ts +0 -0
  298. /package/{directives → portals}/dropdown/dropdown-limit-width.d.ts +0 -0
  299. /package/{directives → portals}/dropdown/dropdown.component.d.ts +0 -0
  300. /package/{directives → portals}/dropdown/dropdown.driver.d.ts +0 -0
  301. /package/{directives → portals}/dropdown/dropdown.providers.d.ts +0 -0
  302. /package/{directives → portals}/dropdown/with-dropdown-open.directive.d.ts +0 -0
  303. /package/{directives → portals}/hint/hint-describe.directive.d.ts +0 -0
  304. /package/{directives → portals}/hint/hint-driver.directive.d.ts +0 -0
  305. /package/{directives → portals}/hint/hint-host.directive.d.ts +0 -0
  306. /package/{directives → portals}/hint/hint-hover.directive.d.ts +0 -0
  307. /package/{directives → portals}/hint/hint-manual.directive.d.ts +0 -0
  308. /package/{directives → portals}/hint/hint-overflow.directive.d.ts +0 -0
  309. /package/{directives → portals}/hint/hint-pointer.directive.d.ts +0 -0
  310. /package/{directives → portals}/hint/hint-unstyled.component.d.ts +0 -0
  311. /package/{directives → portals}/hint/hint.component.d.ts +0 -0
  312. /package/{directives → portals}/hint/hint.providers.d.ts +0 -0
  313. /package/{directives → portals}/hint/index.d.ts +0 -0
  314. /package/{components → portals}/modal/index.d.ts +0 -0
  315. /package/{directives → portals}/popup/index.d.ts +0 -0
  316. /package/{directives → portals}/popup/popup.directive.d.ts +0 -0
  317. /package/{directives → portals}/popup/popup.service.d.ts +0 -0
  318. /package/{directives → portals}/popup/popups.component.d.ts +0 -0
@@ -1,42 +1,41 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Injectable, Directive, InjectionToken, Optional, Self, SkipSelf, inject, Input, EventEmitter, Output, ChangeDetectorRef, INJECTOR, signal, TemplateRef, computed, ChangeDetectionStrategy, Component, PLATFORM_ID, ElementRef, ContentChild, ViewContainerRef } from '@angular/core';
3
- import { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop';
2
+ import { Injectable, Directive, InjectionToken, Optional, Self, SkipSelf, inject, ChangeDetectorRef, effect, signal, INJECTOR, input, computed, TemplateRef, forwardRef, ChangeDetectionStrategy, Component, PLATFORM_ID, contentChild, ElementRef, model, ViewContainerRef } from '@angular/core';
3
+ import { outputFromObservable, takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop';
4
4
  import { EMPTY_CLIENT_RECT, TUI_TRUE_HANDLER, CHAR_ZERO_WIDTH_SPACE, CHAR_NO_BREAK_SPACE } from '@taiga-ui/cdk/constants';
5
5
  import * as i1 from '@taiga-ui/cdk/directives/active-zone';
6
6
  import { TuiActiveZone } from '@taiga-ui/cdk/directives/active-zone';
7
7
  import * as i2 from '@taiga-ui/cdk/directives/animated';
8
8
  import { TuiAnimated } from '@taiga-ui/cdk/directives/animated';
9
- import { tuiInjectElement, tuiGetActualTarget, tuiPointToClientRect, tuiIsElement, tuiIsHTMLElement, tuiIsElementEditable, tuiIsTextNode, tuiIsTextfield } from '@taiga-ui/cdk/utils/dom';
9
+ import { tuiInjectElement, tuiGetActualTarget, tuiPointToClientRect, tuiIsElement, tuiIsElementEditable, tuiIsHTMLElement, tuiIsTextNode, tuiIsTextfield } from '@taiga-ui/cdk/utils/dom';
10
10
  import { tuiClamp } from '@taiga-ui/cdk/utils/math';
11
- import { tuiProvide, tuiPure, tuiPx, tuiProvideOptions, tuiIsString, tuiDirectiveBinding } from '@taiga-ui/cdk/utils/miscellaneous';
12
- import { TuiDriverDirective, TuiPositionAccessor, tuiFallbackAccessor, TuiRectAccessor, tuiAsRectAccessor, tuiAsVehicle, tuiPositionAccessorFor, tuiRectAccessorFor, tuiAsDriver, TuiDriver, tuiAsPositionAccessor } from '@taiga-ui/core/classes';
11
+ import { tuiPx, tuiSetSignal, tuiIsString } from '@taiga-ui/cdk/utils/miscellaneous';
12
+ import { TuiDriverDirective, TuiPositionAccessor, tuiFallbackAccessor, TuiRectAccessor, tuiAsVehicle, tuiPositionAccessorFor, tuiRectAccessorFor, tuiAsDriver, tuiAsRectAccessor, TuiDriver, tuiAsPositionAccessor } from '@taiga-ui/core/classes';
13
13
  import { TuiScrollbar } from '@taiga-ui/core/components/scrollbar';
14
14
  import { TuiVisualViewportService, TuiPositionService } from '@taiga-ui/core/services';
15
15
  import { TUI_VIEWPORT, TUI_DARK_MODE, TUI_SELECTION_STREAM } from '@taiga-ui/core/tokens';
16
16
  import { PolymorpheusComponent, PolymorpheusTemplate, PolymorpheusOutlet } from '@taiga-ui/polymorpheus';
17
- import { BehaviorSubject, Subject, throttleTime, takeWhile, map, merge, filter, fromEvent, switchMap, delay, startWith, takeUntil, distinctUntilChanged, of, tap, share, combineLatest } from 'rxjs';
17
+ import { BehaviorSubject, Subject, distinctUntilChanged, throttleTime, takeWhile, map, merge, filter, EMPTY, switchMap, delay, startWith, takeUntil, fromEvent, of, tap, share, combineLatest } from 'rxjs';
18
18
  import { coerceArray } from '@angular/cdk/coercion';
19
- import { tuiZonefreeScheduler, tuiTypedFromEvent, tuiZonefree, tuiIfMap, tuiCloseWatcher, tuiZonefull, tuiWatch, tuiZoneOptimized } from '@taiga-ui/cdk/observables';
20
- import { TuiPopupService } from '@taiga-ui/core/directives/popup';
21
- import { tuiOverrideOptions, tuiCheckFixedPosition, tuiGetWordRange } from '@taiga-ui/core/utils';
22
- import { __decorate } from 'tslib';
19
+ import { tuiZonefreeScheduler, tuiTypedFromEvent, tuiZoneOptimized, tuiIfMap, tuiCloseWatcher, tuiStopPropagation } from '@taiga-ui/cdk/observables';
20
+ import { TuiPopupService } from '@taiga-ui/core/portals/popup';
21
+ import { tuiCheckFixedPosition, tuiGetWordRange } from '@taiga-ui/core/utils/dom';
22
+ import { tuiProvide, tuiCreateOptions, tuiDirectiveBinding } from '@taiga-ui/cdk/utils/di';
23
+ import { tuiOverrideOptions, tuiIsEditingKey } from '@taiga-ui/core/utils/miscellaneous';
23
24
  import { isPlatformBrowser, DOCUMENT } from '@angular/common';
24
- import { TUI_IS_TOUCH, TUI_RANGE } from '@taiga-ui/cdk/tokens';
25
- import { shouldCall } from '@taiga-ui/event-plugins';
25
+ import { TUI_IS_TOUCH } from '@taiga-ui/cdk/tokens';
26
26
  import * as i1$1 from '@taiga-ui/cdk/directives/obscured';
27
27
  import { TuiObscured } from '@taiga-ui/cdk/directives/obscured';
28
- import { tuiIsKeyboardFocusable, tuiGetClosestFocusable, tuiIsFocusedIn, tuiGetFocused } from '@taiga-ui/cdk/utils/focus';
29
- import { tuiIsEditingKey, tuiOverrideOptions as tuiOverrideOptions$1 } from '@taiga-ui/core/utils/miscellaneous';
28
+ import { tuiIsFocusable, tuiGetClosestFocusable, tuiIsFocusedIn, tuiGetFocused } from '@taiga-ui/cdk/utils/focus';
30
29
 
31
30
  class TuiDropdownDriver extends BehaviorSubject {
32
31
  constructor() {
33
32
  super(false);
34
33
  this.type = 'dropdown';
35
34
  }
36
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownDriver, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
37
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownDriver }); }
35
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownDriver, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
36
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownDriver }); }
38
37
  }
39
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownDriver, decorators: [{
38
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownDriver, decorators: [{
40
39
  type: Injectable
41
40
  }], ctorParameters: () => [] });
42
41
  class TuiDropdownDriverDirective extends TuiDriverDirective {
@@ -44,14 +43,11 @@ class TuiDropdownDriverDirective extends TuiDriverDirective {
44
43
  super(...arguments);
45
44
  this.type = 'dropdown';
46
45
  }
47
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownDriverDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
48
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.15", type: TuiDropdownDriverDirective, isStandalone: true, usesInheritance: true, ngImport: i0 }); }
46
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownDriverDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
47
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.17", type: TuiDropdownDriverDirective, isStandalone: true, usesInheritance: true, ngImport: i0 }); }
49
48
  }
50
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownDriverDirective, decorators: [{
51
- type: Directive,
52
- args: [{
53
- standalone: true,
54
- }]
49
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownDriverDirective, decorators: [{
50
+ type: Directive
55
51
  }] });
56
52
 
57
53
  /**
@@ -62,7 +58,6 @@ const TUI_DROPDOWN_COMPONENT = new InjectionToken(ngDevMode ? 'TUI_DROPDOWN_COMP
62
58
  });
63
59
  const TUI_DROPDOWN_CONTEXT = new InjectionToken(ngDevMode ? 'TUI_DROPDOWN_CONTEXT' : '');
64
60
 
65
- /** Default values for dropdown options */
66
61
  const TUI_DROPDOWN_DEFAULT_OPTIONS = {
67
62
  align: 'left',
68
63
  direction: null,
@@ -72,9 +67,6 @@ const TUI_DROPDOWN_DEFAULT_OPTIONS = {
72
67
  offset: 4,
73
68
  appearance: '',
74
69
  };
75
- /**
76
- * Default parameters for dropdown directive
77
- */
78
70
  const TUI_DROPDOWN_OPTIONS = new InjectionToken(ngDevMode ? 'TUI_DROPDOWN_OPTIONS' : '', {
79
71
  factory: () => TUI_DROPDOWN_DEFAULT_OPTIONS,
80
72
  });
@@ -97,38 +89,25 @@ class TuiDropdownOptionsDirective {
97
89
  this.maxHeight = this.options.maxHeight;
98
90
  this.offset = this.options.offset;
99
91
  }
100
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownOptionsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
101
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.15", type: TuiDropdownOptionsDirective, isStandalone: true, selector: "[tuiDropdownAlign], [tuiDropdownAppearance], [tuiDropdownDirection], [tuiDropdownLimitWidth], [tuiDropdownMinHeight], [tuiDropdownMaxHeight], [tuiDropdownOffset]", inputs: { align: ["tuiDropdownAlign", "align"], appearance: ["tuiDropdownAppearance", "appearance"], direction: ["tuiDropdownDirection", "direction"], limitWidth: ["tuiDropdownLimitWidth", "limitWidth"], minHeight: ["tuiDropdownMinHeight", "minHeight"], maxHeight: ["tuiDropdownMaxHeight", "maxHeight"], offset: ["tuiDropdownOffset", "offset"] }, providers: [tuiProvide(TUI_DROPDOWN_OPTIONS, TuiDropdownOptionsDirective)], ngImport: i0 }); }
92
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownOptionsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
93
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.17", type: TuiDropdownOptionsDirective, isStandalone: true, selector: "[tuiDropdownAlign], [tuiDropdownAppearance], [tuiDropdownDirection], [tuiDropdownLimitWidth], [tuiDropdownMinHeight], [tuiDropdownMaxHeight], [tuiDropdownOffset]", inputs: { align: ["tuiDropdownAlign", "align"], appearance: ["tuiDropdownAppearance", "appearance"], direction: ["tuiDropdownDirection", "direction"], limitWidth: ["tuiDropdownLimitWidth", "limitWidth"], minHeight: ["tuiDropdownMinHeight", "minHeight"], maxHeight: ["tuiDropdownMaxHeight", "maxHeight"], offset: ["tuiDropdownOffset", "offset"] }, providers: [tuiProvide(TUI_DROPDOWN_OPTIONS, TuiDropdownOptionsDirective)], ngImport: i0 }); }
102
94
  }
103
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownOptionsDirective, decorators: [{
95
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownOptionsDirective, decorators: [{
104
96
  type: Directive,
105
97
  args: [{
106
- standalone: true,
107
98
  selector: '[tuiDropdownAlign], [tuiDropdownAppearance], [tuiDropdownDirection], [tuiDropdownLimitWidth], [tuiDropdownMinHeight], [tuiDropdownMaxHeight], [tuiDropdownOffset]',
99
+ inputs: [
100
+ 'align: tuiDropdownAlign',
101
+ 'appearance: tuiDropdownAppearance',
102
+ 'direction: tuiDropdownDirection',
103
+ 'limitWidth: tuiDropdownLimitWidth',
104
+ 'minHeight: tuiDropdownMinHeight',
105
+ 'maxHeight: tuiDropdownMaxHeight',
106
+ 'offset: tuiDropdownOffset',
107
+ ],
108
108
  providers: [tuiProvide(TUI_DROPDOWN_OPTIONS, TuiDropdownOptionsDirective)],
109
109
  }]
110
- }], propDecorators: { align: [{
111
- type: Input,
112
- args: ['tuiDropdownAlign']
113
- }], appearance: [{
114
- type: Input,
115
- args: ['tuiDropdownAppearance']
116
- }], direction: [{
117
- type: Input,
118
- args: ['tuiDropdownDirection']
119
- }], limitWidth: [{
120
- type: Input,
121
- args: ['tuiDropdownLimitWidth']
122
- }], minHeight: [{
123
- type: Input,
124
- args: ['tuiDropdownMinHeight']
125
- }], maxHeight: [{
126
- type: Input,
127
- args: ['tuiDropdownMaxHeight']
128
- }], offset: [{
129
- type: Input,
130
- args: ['tuiDropdownOffset']
131
- }] } });
110
+ }] });
132
111
 
133
112
  class TuiDropdownPosition extends TuiPositionAccessor {
134
113
  constructor() {
@@ -136,18 +115,16 @@ class TuiDropdownPosition extends TuiPositionAccessor {
136
115
  this.el = tuiInjectElement();
137
116
  this.options = inject(TUI_DROPDOWN_OPTIONS);
138
117
  this.viewport = inject(TUI_VIEWPORT);
139
- this.directionChange = new EventEmitter();
118
+ this.direction = new Subject();
140
119
  this.type = 'dropdown';
141
- this.accessor = tuiFallbackAccessor('dropdown')(inject(TuiRectAccessor), inject(TuiDropdownDirective, { optional: true }));
142
- }
143
- emitDirection(direction) {
144
- this.directionChange.emit(direction);
120
+ this.accessor = tuiFallbackAccessor('dropdown')(inject(TuiRectAccessor, { optional: true }), { getClientRect: () => this.el.getBoundingClientRect() });
121
+ this.tuiDropdownDirectionChange = outputFromObservable(this.direction.pipe(distinctUntilChanged()));
145
122
  }
146
123
  getPosition({ width, height }) {
147
124
  if (!width && !height) {
148
125
  this.previous = undefined;
149
126
  }
150
- const hostRect = this.accessor?.getClientRect() ?? EMPTY_CLIENT_RECT;
127
+ const hostRect = this.accessor.getClientRect();
151
128
  const viewportRect = this.viewport.getClientRect();
152
129
  const { minHeight, direction, offset, limitWidth } = this.options;
153
130
  const align = this.getAlign(this.options.align);
@@ -177,12 +154,12 @@ class TuiDropdownPosition extends TuiPositionAccessor {
177
154
  const better = available.top > available.bottom ? 'top' : 'bottom';
178
155
  if ((available[previous] > minHeight && direction) ||
179
156
  available[previous] > height) {
180
- this.emitDirection(previous);
181
- return [position[previous], position[align]];
157
+ this.direction.next(previous);
158
+ return [position[align], position[previous]];
182
159
  }
183
160
  this.previous = better;
184
- this.emitDirection(better);
185
- return [position[better], position[align]];
161
+ this.direction.next(better);
162
+ return [position[align], position[better]];
186
163
  }
187
164
  getAlign(align) {
188
165
  const rtl = this.el.matches('[dir="rtl"] :scope');
@@ -191,28 +168,18 @@ class TuiDropdownPosition extends TuiPositionAccessor {
191
168
  }
192
169
  return rtl && align === 'right' ? 'left' : align;
193
170
  }
194
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownPosition, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
195
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.15", type: TuiDropdownPosition, isStandalone: true, outputs: { directionChange: "tuiDropdownDirectionChange" }, usesInheritance: true, ngImport: i0 }); }
171
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownPosition, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
172
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.17", type: TuiDropdownPosition, isStandalone: true, outputs: { tuiDropdownDirectionChange: "tuiDropdownDirectionChange" }, usesInheritance: true, ngImport: i0 }); }
196
173
  }
197
- __decorate([
198
- tuiPure
199
- ], TuiDropdownPosition.prototype, "emitDirection", null);
200
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownPosition, decorators: [{
201
- type: Directive,
202
- args: [{
203
- standalone: true,
204
- }]
205
- }], propDecorators: { directionChange: [{
206
- type: Output,
207
- args: ['tuiDropdownDirectionChange']
208
- }], emitDirection: [] } });
174
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownPosition, decorators: [{
175
+ type: Directive
176
+ }] });
209
177
 
210
178
  class TuiDropdownDirective {
211
179
  constructor() {
212
180
  this.refresh$ = new Subject();
213
181
  this.service = inject(TuiPopupService);
214
182
  this.cdr = inject(ChangeDetectorRef);
215
- // TODO: think of a better solution later
216
183
  this.drivers = coerceArray(inject(TuiDropdownDriver, { self: true, optional: true }));
217
184
  this.sub = this.refresh$
218
185
  .pipe(throttleTime(0, tuiZonefreeScheduler()), takeUntilDestroyed())
@@ -220,33 +187,25 @@ class TuiDropdownDirective {
220
187
  this.ref()?.changeDetectorRef.detectChanges();
221
188
  this.ref()?.changeDetectorRef.markForCheck();
222
189
  });
190
+ this.autoClose = effect(() => {
191
+ if (!this.content()) {
192
+ this.toggle(false);
193
+ }
194
+ });
195
+ this.ref = signal(null);
223
196
  this.el = tuiInjectElement();
224
197
  this.type = 'dropdown';
225
198
  this.component = new PolymorpheusComponent(inject(TUI_DROPDOWN_COMPONENT), inject(INJECTOR));
226
- this.ref = signal(null);
227
- // TODO(v5): rename to `content`
228
- // eslint-disable-next-line @typescript-eslint/naming-convention
229
- this._content = signal(null);
230
- }
231
- set tuiDropdown(content) {
232
- this._content.set(content instanceof TemplateRef
233
- ? new PolymorpheusTemplate(content, this.cdr)
234
- : content);
235
- if (!this._content()) {
236
- this.toggle(false);
237
- }
199
+ this.tuiDropdown = input();
200
+ this.content = computed((content = this.tuiDropdown()) => {
201
+ return content instanceof TemplateRef
202
+ ? new PolymorpheusTemplate(content, this.cdr)
203
+ : content;
204
+ });
238
205
  }
239
206
  get position() {
240
207
  return tuiCheckFixedPosition(this.el) ? 'fixed' : 'absolute';
241
208
  }
242
- // TODO(v5): delete
243
- get content() {
244
- return this._content();
245
- }
246
- // TODO(v5): delete
247
- set content(x) {
248
- this._content.set(x);
249
- }
250
209
  ngAfterViewChecked() {
251
210
  this.refresh$.next();
252
211
  }
@@ -258,32 +217,25 @@ class TuiDropdownDirective {
258
217
  }
259
218
  toggle(show) {
260
219
  const ref = this.ref();
261
- if (show && this._content() && !ref) {
220
+ if (show && this.content() && !ref) {
262
221
  this.ref.set(this.service.add(this.component));
263
222
  }
264
223
  else if (!show && ref) {
265
224
  this.ref.set(null);
266
225
  ref.destroy();
267
226
  }
268
- this.drivers.forEach((driver) => driver?.next(show));
269
227
  // TODO: Remove in v5, only needed in Angular 16
270
228
  this.cdr.markForCheck();
229
+ this.drivers.forEach((driver) => driver?.next(show));
271
230
  }
272
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
273
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.15", type: TuiDropdownDirective, isStandalone: true, selector: "[tuiDropdown]:not(ng-container):not(ng-template)", inputs: { tuiDropdown: "tuiDropdown" }, host: { properties: { "class.tui-dropdown-open": "ref()" } }, providers: [
274
- tuiAsRectAccessor(TuiDropdownDirective),
275
- tuiAsVehicle(TuiDropdownDirective),
276
- ], exportAs: ["tuiDropdown"], hostDirectives: [{ directive: TuiDropdownDriverDirective }, { directive: TuiDropdownPosition, outputs: ["tuiDropdownDirectionChange", "tuiDropdownDirectionChange"] }], ngImport: i0 }); }
231
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
232
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.17", type: TuiDropdownDirective, isStandalone: true, selector: "[tuiDropdown]:not(ng-container):not(ng-template)", inputs: { tuiDropdown: { classPropertyName: "tuiDropdown", publicName: "tuiDropdown", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tui-dropdown-open": "ref()" } }, providers: [tuiAsVehicle(TuiDropdownDirective)], exportAs: ["tuiDropdown"], hostDirectives: [{ directive: TuiDropdownDriverDirective }, { directive: TuiDropdownPosition, outputs: ["tuiDropdownDirectionChange", "tuiDropdownDirectionChange"] }], ngImport: i0 }); }
277
233
  }
278
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownDirective, decorators: [{
234
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownDirective, decorators: [{
279
235
  type: Directive,
280
236
  args: [{
281
- standalone: true,
282
237
  selector: '[tuiDropdown]:not(ng-container):not(ng-template)',
283
- providers: [
284
- tuiAsRectAccessor(TuiDropdownDirective),
285
- tuiAsVehicle(TuiDropdownDirective),
286
- ],
238
+ providers: [tuiAsVehicle(TuiDropdownDirective)],
287
239
  exportAs: 'tuiDropdown',
288
240
  hostDirectives: [
289
241
  TuiDropdownDriverDirective,
@@ -296,9 +248,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
296
248
  '[class.tui-dropdown-open]': 'ref()',
297
249
  },
298
250
  }]
299
- }], propDecorators: { tuiDropdown: [{
300
- type: Input
301
- }] } });
251
+ }] });
302
252
 
303
253
  /**
304
254
  * @description:
@@ -312,7 +262,7 @@ class TuiDropdownComponent {
312
262
  this.viewport = inject(TUI_VIEWPORT);
313
263
  this.vvs = inject(TuiVisualViewportService);
314
264
  this.styles$ = inject(TuiPositionService).pipe(takeWhile(() => this.directive.el.isConnected &&
315
- !!this.directive.el.getBoundingClientRect().height), map((v) => (this.position === 'fixed' ? this.vvs.correct(v) : v)), map(([top, left]) => this.getStyles(left, top)), takeUntilDestroyed());
265
+ !!this.directive.el.getBoundingClientRect().height), map((v) => (this.position === 'fixed' ? this.vvs.correct(v) : v)), map((point) => this.getStyles(...point)), takeUntilDestroyed());
316
266
  this.options = inject(TUI_DROPDOWN_OPTIONS);
317
267
  this.directive = inject(TuiDropdownDirective);
318
268
  this.context = inject(TUI_DROPDOWN_CONTEXT, { optional: true });
@@ -351,52 +301,47 @@ class TuiDropdownComponent {
351
301
  maxWidth: tuiPx(Math.round(viewport.width) - 16), // 8px min gap from each side
352
302
  };
353
303
  }
354
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
355
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: TuiDropdownComponent, isStandalone: true, selector: "tui-dropdown", host: { properties: { "attr.data-appearance": "options.appearance", "attr.tuiTheme": "theme()" } }, providers: [
304
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
305
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: TuiDropdownComponent, isStandalone: true, selector: "tui-dropdown", host: { properties: { "attr.data-appearance": "options.appearance", "attr.tuiTheme": "theme()" } }, providers: [
356
306
  TuiPositionService,
357
307
  tuiPositionAccessorFor('dropdown', TuiDropdownPosition),
358
- tuiRectAccessorFor('dropdown', TuiDropdownDirective),
359
- ], hostDirectives: [{ directive: i1.TuiActiveZone }, { directive: i2.TuiAnimated }], ngImport: i0, template: "<tui-scrollbar class=\"t-scroll\">\n <div\n *polymorpheusOutlet=\"directive._content() as text; context: {$implicit: close}\"\n class=\"t-primitive\"\n >\n {{ text }}\n </div>\n</tui-scrollbar>\n", styles: [":host{position:absolute;display:flex;box-shadow:var(--tui-shadow-medium);color:var(--tui-text-primary);background:var(--tui-background-elevation-3);border-radius:var(--tui-radius-m);overflow:hidden;border:1px solid var(--tui-border-normal);box-sizing:border-box;isolation:isolate;pointer-events:auto;--tui-from: translateY(-1rem)}:host.tui-enter,:host.tui-leave{animation-name:tuiFade,tuiSlide}:host:not([style*=top]){visibility:hidden}.t-scroll{flex-grow:1;max-inline-size:100%;inline-size:max-content;overscroll-behavior:none}.t-primitive{padding:1rem}\n"], dependencies: [{ kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "component", type: TuiScrollbar, selector: "tui-scrollbar", inputs: ["hidden"] }], changeDetection: i0.ChangeDetectionStrategy.Default }); }
308
+ tuiRectAccessorFor('dropdown', forwardRef(() => TuiDropdownDirective)),
309
+ ], hostDirectives: [{ directive: i1.TuiActiveZone }, { directive: i2.TuiAnimated }], ngImport: i0, template: "<tui-scrollbar class=\"t-scroll\">\n <div\n *polymorpheusOutlet=\"directive.content() as text; context: {$implicit: close}\"\n class=\"t-primitive\"\n >\n {{ text }}\n </div>\n</tui-scrollbar>\n", styles: [":host{position:absolute;display:flex;box-shadow:var(--tui-shadow-medium);color:var(--tui-text-primary);background:var(--tui-background-elevation-3);border-radius:var(--tui-radius-m);overflow:hidden;border:1px solid var(--tui-border-normal);box-sizing:border-box;isolation:isolate;pointer-events:auto;--tui-from: translateY(-1rem)}:host.tui-enter,:host.tui-leave{animation-name:tuiFade,tuiSlide}:host:not([style*=top]){visibility:hidden}.t-scroll{flex-grow:1;max-inline-size:100%;inline-size:max-content;overscroll-behavior:none}.t-primitive{padding:1rem}\n"], dependencies: [{ kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "component", type: TuiScrollbar, selector: "tui-scrollbar" }], changeDetection: i0.ChangeDetectionStrategy.Default }); }
360
310
  }
361
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownComponent, decorators: [{
311
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownComponent, decorators: [{
362
312
  type: Component,
363
313
  args: [{ selector: 'tui-dropdown', imports: [PolymorpheusOutlet, TuiScrollbar], changeDetection: ChangeDetectionStrategy.Default, providers: [
364
314
  TuiPositionService,
365
315
  tuiPositionAccessorFor('dropdown', TuiDropdownPosition),
366
- tuiRectAccessorFor('dropdown', TuiDropdownDirective),
316
+ tuiRectAccessorFor('dropdown', forwardRef(() => TuiDropdownDirective)),
367
317
  ], hostDirectives: [TuiActiveZone, TuiAnimated], host: {
368
318
  '[attr.data-appearance]': 'options.appearance',
369
319
  '[attr.tuiTheme]': 'theme()',
370
- }, template: "<tui-scrollbar class=\"t-scroll\">\n <div\n *polymorpheusOutlet=\"directive._content() as text; context: {$implicit: close}\"\n class=\"t-primitive\"\n >\n {{ text }}\n </div>\n</tui-scrollbar>\n", styles: [":host{position:absolute;display:flex;box-shadow:var(--tui-shadow-medium);color:var(--tui-text-primary);background:var(--tui-background-elevation-3);border-radius:var(--tui-radius-m);overflow:hidden;border:1px solid var(--tui-border-normal);box-sizing:border-box;isolation:isolate;pointer-events:auto;--tui-from: translateY(-1rem)}:host.tui-enter,:host.tui-leave{animation-name:tuiFade,tuiSlide}:host:not([style*=top]){visibility:hidden}.t-scroll{flex-grow:1;max-inline-size:100%;inline-size:max-content;overscroll-behavior:none}.t-primitive{padding:1rem}\n"] }]
320
+ }, template: "<tui-scrollbar class=\"t-scroll\">\n <div\n *polymorpheusOutlet=\"directive.content() as text; context: {$implicit: close}\"\n class=\"t-primitive\"\n >\n {{ text }}\n </div>\n</tui-scrollbar>\n", styles: [":host{position:absolute;display:flex;box-shadow:var(--tui-shadow-medium);color:var(--tui-text-primary);background:var(--tui-background-elevation-3);border-radius:var(--tui-radius-m);overflow:hidden;border:1px solid var(--tui-border-normal);box-sizing:border-box;isolation:isolate;pointer-events:auto;--tui-from: translateY(-1rem)}:host.tui-enter,:host.tui-leave{animation-name:tuiFade,tuiSlide}:host:not([style*=top]){visibility:hidden}.t-scroll{flex-grow:1;max-inline-size:100%;inline-size:max-content;overscroll-behavior:none}.t-primitive{padding:1rem}\n"] }]
371
321
  }] });
372
322
 
373
323
  class TuiDropdownContent {
374
324
  constructor() {
375
325
  this.directive = inject(TuiDropdownDirective);
376
- this.directive.tuiDropdown = inject(TemplateRef);
326
+ tuiSetSignal(this.directive.tuiDropdown, inject(TemplateRef));
377
327
  if (isPlatformBrowser(inject(PLATFORM_ID)) &&
378
328
  this.directive.el.matches(':focus-within')) {
379
329
  this.directive.toggle(true);
380
330
  }
381
331
  }
382
332
  ngOnDestroy() {
383
- this.directive.tuiDropdown = null;
333
+ tuiSetSignal(this.directive.tuiDropdown, null);
384
334
  }
385
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownContent, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
386
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.15", type: TuiDropdownContent, isStandalone: true, selector: "ng-template[tuiDropdown]", ngImport: i0 }); }
335
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownContent, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
336
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.17", type: TuiDropdownContent, isStandalone: true, selector: "ng-template[tuiDropdown]", ngImport: i0 }); }
387
337
  }
388
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownContent, decorators: [{
338
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownContent, decorators: [{
389
339
  type: Directive,
390
340
  args: [{
391
- standalone: true,
392
341
  selector: 'ng-template[tuiDropdown]',
393
342
  }]
394
343
  }], ctorParameters: () => [] });
395
344
 
396
- function activeZoneFilter(event) {
397
- return (!event ||
398
- (this.driver.value && !this.activeZone.contains(tuiGetActualTarget(event))));
399
- }
400
345
  class TuiDropdownContext extends TuiRectAccessor {
401
346
  constructor() {
402
347
  super(...arguments);
@@ -406,37 +351,33 @@ class TuiDropdownContext extends TuiRectAccessor {
406
351
  this.activeZone = inject(TuiActiveZone);
407
352
  this.driver = inject(TuiDropdownDriver);
408
353
  this.doc = inject(DOCUMENT);
409
- this.sub = merge(tuiTypedFromEvent(this.doc, 'pointerdown'), tuiTypedFromEvent(this.doc, 'contextmenu', { capture: true }))
410
- .pipe(tuiZonefree(), takeUntilDestroyed())
411
- .subscribe((event) => this.closeDropdown(event));
354
+ this.sub = merge(tuiTypedFromEvent(this.doc, 'pointerdown'), tuiTypedFromEvent(this.doc, 'keydown').pipe(filter(({ key }) => key === 'Escape')), tuiTypedFromEvent(this.doc, 'contextmenu', { capture: true }))
355
+ .pipe(filter((event) => this.driver.value &&
356
+ !this.activeZone.contains(tuiGetActualTarget(event))), tuiZoneOptimized(), takeUntilDestroyed())
357
+ .subscribe(() => {
358
+ this.driver.next(false);
359
+ this.currentRect = EMPTY_CLIENT_RECT;
360
+ });
412
361
  this.type = 'dropdown';
413
362
  }
414
363
  getClientRect() {
415
364
  return this.currentRect;
416
365
  }
417
- closeDropdown(_event) {
418
- this.driver.next(false);
419
- this.currentRect = EMPTY_CLIENT_RECT;
420
- }
421
366
  onContextMenu(x, y) {
422
367
  this.currentRect = tuiPointToClientRect(x, y);
423
368
  this.driver.next(true);
424
369
  }
425
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownContext, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
426
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.15", type: TuiDropdownContext, isStandalone: true, selector: "[tuiDropdownContext]", host: { listeners: { "document:keydown.esc": "closeDropdown()", "longtap": "onContextMenu($event.detail.clientX, $event.detail.clientY)" }, properties: { "style.user-select": "userSelect()", "style.-webkit-user-select": "userSelect()", "style.-webkit-touch-callout": "userSelect()" } }, providers: [
370
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownContext, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
371
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.17", type: TuiDropdownContext, isStandalone: true, selector: "[tuiDropdownContext]", host: { listeners: { "longtap": "onContextMenu($event.detail.clientX, $event.detail.clientY)" }, properties: { "style.user-select": "userSelect()", "style.-webkit-user-select": "userSelect()", "style.-webkit-touch-callout": "userSelect()" } }, providers: [
427
372
  TuiActiveZone,
428
373
  TuiDropdownDriver,
429
374
  tuiAsDriver(TuiDropdownDriver),
430
375
  tuiAsRectAccessor(TuiDropdownContext),
431
376
  ], usesInheritance: true, ngImport: i0 }); }
432
377
  }
433
- __decorate([
434
- shouldCall(activeZoneFilter)
435
- ], TuiDropdownContext.prototype, "closeDropdown", null);
436
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownContext, decorators: [{
378
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownContext, decorators: [{
437
379
  type: Directive,
438
380
  args: [{
439
- standalone: true,
440
381
  selector: '[tuiDropdownContext]',
441
382
  providers: [
442
383
  TuiActiveZone,
@@ -448,11 +389,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
448
389
  '[style.user-select]': 'userSelect()',
449
390
  '[style.-webkit-user-select]': 'userSelect()',
450
391
  '[style.-webkit-touch-callout]': 'userSelect()',
451
- '(document:keydown.esc)': 'closeDropdown()',
452
392
  '(longtap)': 'onContextMenu($event.detail.clientX, $event.detail.clientY)',
453
393
  },
454
394
  }]
455
- }], propDecorators: { closeDropdown: [] } });
395
+ }] });
456
396
 
457
397
  /** Default values for hint options */
458
398
  const TUI_DROPDOWN_HOVER_DEFAULT_OPTIONS = {
@@ -462,48 +402,58 @@ const TUI_DROPDOWN_HOVER_DEFAULT_OPTIONS = {
462
402
  /**
463
403
  * Default parameters for dropdown hover directive
464
404
  */
465
- const TUI_DROPDOWN_HOVER_OPTIONS = new InjectionToken(ngDevMode ? 'TUI_DROPDOWN_HOVER_OPTIONS' : '', {
466
- factory: () => TUI_DROPDOWN_HOVER_DEFAULT_OPTIONS,
467
- });
468
- function tuiDropdownHoverOptionsProvider(options) {
469
- return tuiProvideOptions(TUI_DROPDOWN_HOVER_OPTIONS, options, TUI_DROPDOWN_HOVER_DEFAULT_OPTIONS);
470
- }
405
+ const [TUI_DROPDOWN_HOVER_OPTIONS, tuiDropdownHoverOptionsProvider] = tuiCreateOptions(TUI_DROPDOWN_HOVER_DEFAULT_OPTIONS);
471
406
 
472
- function shouldClose(event) {
473
- return (
474
- // @ts-ignore
475
- typeof CloseWatcher === 'undefined' &&
476
- // ?. for auto fill events
477
- event.key?.toLowerCase() === 'escape' &&
478
- this.tuiDropdownEnabled &&
479
- !!this.tuiDropdownOpen &&
480
- !this['dropdown']()?.nextElementSibling);
407
+ class TuiDropdownClose {
408
+ constructor() {
409
+ this.el = tuiInjectElement();
410
+ this.ref = inject(TuiDropdownDirective).ref;
411
+ this.open = inject(TuiDropdownOpen);
412
+ this.obscured = inject(TuiObscured);
413
+ this.activeZone = inject(TuiActiveZone);
414
+ this.tuiDropdownClose = outputFromObservable(merge(inject(TuiDropdownDriver).pipe(tuiIfMap(() => merge(tuiCloseWatcher(), this.obscured.tuiObscured$.pipe(filter(Boolean)), this.activeZone.tuiActiveZoneChange.pipe(filter((a) => !a)), tuiTypedFromEvent(this.el, 'focusin').pipe(filter((event) => !this.open.host.contains(tuiGetActualTarget(event)) ||
415
+ !this.ref()))))),
416
+ // @ts-ignore
417
+ typeof CloseWatcher === 'undefined'
418
+ ? tuiTypedFromEvent(inject(DOCUMENT), 'keydown', { capture: true }).pipe(filter(({ key }) => key === 'Escape' &&
419
+ this.open.open() &&
420
+ !this.ref()?.location.nativeElement?.nextElementSibling), tuiStopPropagation())
421
+ : EMPTY));
422
+ }
423
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownClose, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
424
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.17", type: TuiDropdownClose, isStandalone: true, outputs: { tuiDropdownClose: "tuiDropdownClose" }, ngImport: i0 }); }
481
425
  }
426
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownClose, decorators: [{
427
+ type: Directive
428
+ }] });
429
+
482
430
  class TuiDropdownOpen {
483
431
  constructor() {
432
+ this.dropdownHost = contentChild('tuiDropdownHost', {
433
+ descendants: true,
434
+ read: ElementRef,
435
+ });
484
436
  this.directive = inject(TuiDropdownDirective);
485
437
  this.el = tuiInjectElement();
486
438
  this.obscured = inject(TuiObscured);
487
- this.activeZone = inject(TuiActiveZone);
488
- this.dropdown = computed(() => this.directive.ref()?.location.nativeElement);
489
- this.tuiDropdownEnabled = true;
490
- this.tuiDropdownOpen = false;
491
- this.tuiDropdownOpenChange = new EventEmitter();
492
- // TODO: make it private when all legacy controls will be deleted from @taiga-ui/legacy (5.0)
493
439
  this.driver = inject(TuiDropdownDriver);
494
- this.sub = this.driver
495
- .pipe(tuiIfMap(() => merge(tuiCloseWatcher(), this.obscured.tuiObscured.pipe(filter(Boolean)), this.activeZone.tuiActiveZoneChange.pipe(filter((a) => !a)), fromEvent(this.el, 'focusin').pipe(filter((event) => !this.host.contains(tuiGetActualTarget(event)) ||
496
- !this.directive.ref())))), tuiZonefull(), tuiWatch(), takeUntilDestroyed())
497
- .subscribe(() => this.toggle(false));
498
- this.sync = this.driver.pipe(takeUntilDestroyed()).subscribe((open) => {
499
- if (open !== this.tuiDropdownOpen) {
500
- this.update(open);
501
- }
502
- });
440
+ this.dropdown = computed(() => this.directive.ref()?.location.nativeElement);
441
+ this.enabled = input(true, { alias: 'tuiDropdownEnabled' });
442
+ this.open = model(false, { alias: 'tuiDropdownOpen' });
443
+ this.driveEffect = effect(() => this.drive(this.open()));
444
+ this.syncSub = this.driver
445
+ .pipe(filter((open) => open !== this.open()), takeUntilDestroyed())
446
+ .subscribe((open) => this.update(open));
447
+ this.keydownSub = tuiTypedFromEvent(inject(DOCUMENT), 'keydown')
448
+ .pipe(takeUntilDestroyed())
449
+ .subscribe((event) => this.onKeydown(event));
503
450
  }
504
- ngOnChanges() {
505
- this.drive(!!this.tuiDropdownOpen);
506
- this.tuiDropdownOpenChange.emit(!!this.tuiDropdownOpen);
451
+ get host() {
452
+ const initial = this.dropdownHost()?.nativeElement || this.el;
453
+ const focusable = tuiIsFocusable(initial)
454
+ ? initial
455
+ : tuiGetClosestFocusable({ initial, root: this.el });
456
+ return this.dropdownHost()?.nativeElement || focusable || this.el;
507
457
  }
508
458
  toggle(open) {
509
459
  if (this.focused && !open) {
@@ -511,25 +461,27 @@ class TuiDropdownOpen {
511
461
  }
512
462
  this.update(open);
513
463
  }
514
- onEsc(event) {
515
- event.preventDefault();
516
- this.toggle(false);
517
- }
518
464
  onClick(target) {
519
465
  if (!this.editable && this.host.contains(target)) {
520
- this.update(!this.tuiDropdownOpen);
466
+ this.update(!this.open());
521
467
  }
522
468
  }
523
469
  onArrow(event, up) {
524
470
  if (!tuiIsElement(event.target) ||
525
471
  !this.host.contains(event.target) ||
526
- !this.tuiDropdownEnabled ||
527
- !this.directive._content()) {
472
+ !this.enabled() ||
473
+ !this.directive.content()) {
528
474
  return;
529
475
  }
530
476
  event.preventDefault();
531
477
  this.focusDropdown(up);
532
478
  }
479
+ get editable() {
480
+ return tuiIsElementEditable(this.host);
481
+ }
482
+ get focused() {
483
+ return tuiIsFocusedIn(this.host) || tuiIsFocusedIn(this.dropdown());
484
+ }
533
485
  onKeydown(event) {
534
486
  const target = tuiGetActualTarget(event);
535
487
  if (!event.defaultPrevented &&
@@ -541,29 +493,15 @@ class TuiDropdownOpen {
541
493
  this.host.focus({ preventScroll: true });
542
494
  }
543
495
  }
544
- get host() {
545
- const initial = this.dropdownHost?.nativeElement || this.el;
546
- const focusable = tuiIsKeyboardFocusable(initial)
547
- ? initial
548
- : tuiGetClosestFocusable({ initial, root: this.el });
549
- return this.dropdownHost?.nativeElement || focusable || this.el;
550
- }
551
- get editable() {
552
- return tuiIsElementEditable(this.host);
553
- }
554
- get focused() {
555
- return tuiIsFocusedIn(this.host) || tuiIsFocusedIn(this.dropdown());
556
- }
557
496
  update(open) {
558
- if (open && !this.tuiDropdownEnabled) {
497
+ if (open && !this.enabled()) {
559
498
  return this.drive();
560
499
  }
561
- this.tuiDropdownOpen = open;
562
- this.tuiDropdownOpenChange.emit(open);
500
+ this.open.set(open);
563
501
  this.drive();
564
502
  }
565
- drive(open = !!this.tuiDropdownOpen && this.tuiDropdownEnabled) {
566
- this.obscured.tuiObscuredEnabled = open;
503
+ drive(open = this.open() && this.enabled()) {
504
+ tuiSetSignal(this.obscured.tuiObscuredEnabled, open);
567
505
  this.driver.next(open);
568
506
  }
569
507
  focusDropdown(previous) {
@@ -579,20 +517,20 @@ class TuiDropdownOpen {
579
517
  child.remove();
580
518
  focusable?.focus();
581
519
  }
582
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownOpen, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
583
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.15", type: TuiDropdownOpen, isStandalone: true, selector: "[tuiDropdown][tuiDropdownOpen],[tuiDropdown][tuiDropdownOpenChange]", inputs: { tuiDropdownEnabled: "tuiDropdownEnabled", tuiDropdownOpen: "tuiDropdownOpen" }, outputs: { tuiDropdownOpenChange: "tuiDropdownOpenChange" }, host: { listeners: { "click": "onClick($event.target)", "keydown.arrowDown": "onArrow($event, false)", "keydown.arrowUp": "onArrow($event, true)", "document:keydown.zoneless.capture": "onEsc($event)", "document:keydown.zoneless": "onKeydown($event)", "tuiActiveZoneChange": "0" } }, providers: [TuiDropdownDriver, tuiAsDriver(TuiDropdownDriver)], queries: [{ propertyName: "dropdownHost", first: true, predicate: ["tuiDropdownHost"], descendants: true, read: ElementRef }], usesOnChanges: true, hostDirectives: [{ directive: i1$1.TuiObscured }, { directive: i1.TuiActiveZone, inputs: ["tuiActiveZoneParent", "tuiActiveZoneParent"], outputs: ["tuiActiveZoneChange", "tuiActiveZoneChange"] }], ngImport: i0 }); }
520
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownOpen, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
521
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "19.2.17", type: TuiDropdownOpen, isStandalone: true, selector: "[tuiDropdown][tuiDropdownAuto],[tuiDropdown][tuiDropdownOpen],[tuiDropdown][tuiDropdownOpenChange]", inputs: { enabled: { classPropertyName: "enabled", publicName: "tuiDropdownEnabled", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "tuiDropdownOpen", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "tuiDropdownOpenChange" }, host: { listeners: { "click": "onClick($event.target)", "keydown.arrowDown": "onArrow($event, false)", "keydown.arrowUp": "onArrow($event, true)", "tuiActiveZoneChange": "0", "tuiDropdownClose": "toggle(false)" } }, providers: [TuiDropdownDriver, tuiAsDriver(TuiDropdownDriver)], queries: [{ propertyName: "dropdownHost", first: true, predicate: ["tuiDropdownHost"], descendants: true, read: ElementRef, isSignal: true }], hostDirectives: [{ directive: i1$1.TuiObscured }, { directive: TuiDropdownClose, outputs: ["tuiDropdownClose", "tuiDropdownClose"] }, { directive: i1.TuiActiveZone, inputs: ["tuiActiveZoneParent", "tuiActiveZoneParent"], outputs: ["tuiActiveZoneChange", "tuiActiveZoneChange"] }], ngImport: i0 }); }
584
522
  }
585
- __decorate([
586
- shouldCall(shouldClose)
587
- ], TuiDropdownOpen.prototype, "onEsc", null);
588
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownOpen, decorators: [{
523
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownOpen, decorators: [{
589
524
  type: Directive,
590
525
  args: [{
591
- standalone: true,
592
- selector: '[tuiDropdown][tuiDropdownOpen],[tuiDropdown][tuiDropdownOpenChange]',
526
+ selector: '[tuiDropdown][tuiDropdownAuto],[tuiDropdown][tuiDropdownOpen],[tuiDropdown][tuiDropdownOpenChange]',
593
527
  providers: [TuiDropdownDriver, tuiAsDriver(TuiDropdownDriver)],
594
528
  hostDirectives: [
595
529
  TuiObscured,
530
+ {
531
+ directive: TuiDropdownClose,
532
+ outputs: ['tuiDropdownClose'],
533
+ },
596
534
  {
597
535
  directive: TuiActiveZone,
598
536
  inputs: ['tuiActiveZoneParent'],
@@ -603,43 +541,37 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
603
541
  '(click)': 'onClick($event.target)',
604
542
  '(keydown.arrowDown)': 'onArrow($event, false)',
605
543
  '(keydown.arrowUp)': 'onArrow($event, true)',
606
- '(document:keydown.zoneless.capture)': 'onEsc($event)',
607
- '(document:keydown.zoneless)': 'onKeydown($event)',
608
544
  // TODO: Necessary because startWith(false) + distinctUntilChanged() in TuiActiveZone, think of better solution
609
545
  '(tuiActiveZoneChange)': '0',
546
+ '(tuiDropdownClose)': 'toggle(false)',
610
547
  },
611
548
  }]
612
- }], propDecorators: { dropdownHost: [{
613
- type: ContentChild,
614
- args: ['tuiDropdownHost', { descendants: true, read: ElementRef }]
615
- }], tuiDropdownEnabled: [{
616
- type: Input
617
- }], tuiDropdownOpen: [{
618
- type: Input
619
- }], tuiDropdownOpenChange: [{
620
- type: Output
621
- }], onEsc: [] } });
549
+ }] });
622
550
 
623
551
  class TuiDropdownHover extends TuiDriver {
624
552
  constructor() {
625
553
  super((subscriber) => this.stream$.subscribe(subscriber));
554
+ this.dropdownHost = contentChild('tuiDropdownHost', {
555
+ descendants: true,
556
+ read: ElementRef,
557
+ });
558
+ this.hovered = false;
626
559
  this.el = tuiInjectElement();
627
560
  this.doc = inject(DOCUMENT);
628
561
  this.options = inject(TUI_DROPDOWN_HOVER_OPTIONS);
629
562
  this.activeZone = inject(TuiActiveZone);
630
563
  this.open = inject(TuiDropdownOpen, { optional: true });
564
+ this.stream$ = merge(
631
565
  /**
632
566
  * Dropdown can be removed not only via click/touch –
633
567
  * swipe on mobile devices removes dropdown sheet without triggering new mouseover / mouseout events.
634
568
  */
635
- this.dropdownExternalRemoval$ = toObservable(inject(TuiDropdownDirective).ref).pipe(filter((x) => !x && this.hovered));
636
- this.stream$ = merge(this.dropdownExternalRemoval$.pipe(switchMap(() => tuiTypedFromEvent(this.doc, 'pointerdown').pipe(map(tuiGetActualTarget), delay(this.hideDelay), startWith(null), takeUntil(fromEvent(this.doc, 'mouseover'))))), tuiTypedFromEvent(this.doc, 'mouseover').pipe(map(tuiGetActualTarget)), tuiTypedFromEvent(this.doc, 'mouseout').pipe(map((e) => e.relatedTarget))).pipe(map((element) => tuiIsElement(element) && this.isHovered(element)), distinctUntilChanged(), switchMap((v) => of(v).pipe(delay(v ? this.showDelay : this.hideDelay))), tuiZoneOptimized(), tap((hovered) => {
569
+ toObservable(inject(TuiDropdownDirective).ref).pipe(filter((x) => !x && this.hovered), switchMap(() => tuiTypedFromEvent(this.doc, 'pointerdown').pipe(map(tuiGetActualTarget), delay(this.tuiDropdownHideDelay()), startWith(null), takeUntil(fromEvent(this.doc, 'mouseover'))))), tuiTypedFromEvent(this.doc, 'mouseover').pipe(map(tuiGetActualTarget)), tuiTypedFromEvent(this.doc, 'mouseout').pipe(map((e) => e.relatedTarget))).pipe(map((element) => tuiIsElement(element) && this.isHovered(element)), distinctUntilChanged(), switchMap((v) => of(v).pipe(delay(v ? this.tuiDropdownShowDelay() : this.tuiDropdownHideDelay()))), tuiZoneOptimized(), tap((hovered) => {
637
570
  this.hovered = hovered;
638
571
  this.open?.toggle(hovered);
639
572
  }), share());
640
- this.showDelay = this.options.showDelay;
641
- this.hideDelay = this.options.hideDelay;
642
- this.hovered = false;
573
+ this.tuiDropdownShowDelay = input(this.options.showDelay);
574
+ this.tuiDropdownHideDelay = input(this.options.hideDelay);
643
575
  this.type = 'dropdown';
644
576
  }
645
577
  onClick(event) {
@@ -648,85 +580,43 @@ class TuiDropdownHover extends TuiDriver {
648
580
  }
649
581
  }
650
582
  isHovered(element) {
651
- const host = this.dropdownHost?.nativeElement || this.el;
583
+ const host = this.dropdownHost()?.nativeElement || this.el;
652
584
  const hovered = host.contains(element);
653
585
  const child = !this.el.contains(element) && this.activeZone.contains(element);
654
586
  return hovered || child;
655
587
  }
656
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownHover, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
657
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.15", type: TuiDropdownHover, isStandalone: true, selector: "[tuiDropdownHover]", inputs: { showDelay: ["tuiDropdownShowDelay", "showDelay"], hideDelay: ["tuiDropdownHideDelay", "hideDelay"] }, host: { listeners: { "click.capture": "onClick($event)" } }, providers: [TuiActiveZone, tuiAsDriver(TuiDropdownHover)], queries: [{ propertyName: "dropdownHost", first: true, predicate: ["tuiDropdownHost"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0 }); }
588
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownHover, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
589
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "19.2.17", type: TuiDropdownHover, isStandalone: true, selector: "[tuiDropdownHover]", inputs: { tuiDropdownShowDelay: { classPropertyName: "tuiDropdownShowDelay", publicName: "tuiDropdownShowDelay", isSignal: true, isRequired: false, transformFunction: null }, tuiDropdownHideDelay: { classPropertyName: "tuiDropdownHideDelay", publicName: "tuiDropdownHideDelay", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click.capture": "onClick($event)" } }, providers: [TuiActiveZone, tuiAsDriver(TuiDropdownHover)], queries: [{ propertyName: "dropdownHost", first: true, predicate: ["tuiDropdownHost"], descendants: true, read: ElementRef, isSignal: true }], usesInheritance: true, ngImport: i0 }); }
658
590
  }
659
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownHover, decorators: [{
591
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownHover, decorators: [{
660
592
  type: Directive,
661
593
  args: [{
662
- standalone: true,
663
594
  selector: '[tuiDropdownHover]',
664
595
  providers: [TuiActiveZone, tuiAsDriver(TuiDropdownHover)],
665
596
  host: {
666
597
  '(click.capture)': 'onClick($event)',
667
598
  },
668
599
  }]
669
- }], ctorParameters: () => [], propDecorators: { dropdownHost: [{
670
- type: ContentChild,
671
- args: ['tuiDropdownHost', { descendants: true, read: ElementRef }]
672
- }], showDelay: [{
673
- type: Input,
674
- args: ['tuiDropdownShowDelay']
675
- }], hideDelay: [{
676
- type: Input,
677
- args: ['tuiDropdownHideDelay']
678
- }] } });
600
+ }], ctorParameters: () => [] });
679
601
 
680
602
  class TuiDropdownManual {
681
603
  constructor() {
682
604
  this.driver = inject(TuiDropdownDriver);
683
- this.tuiDropdownManual = false;
605
+ this.tuiDropdownManual = input(false);
684
606
  }
685
607
  ngOnChanges() {
686
- this.driver.next(!!this.tuiDropdownManual);
608
+ this.driver.next(!!this.tuiDropdownManual());
687
609
  }
688
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownManual, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
689
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.15", type: TuiDropdownManual, isStandalone: true, selector: "[tuiDropdownManual]", inputs: { tuiDropdownManual: "tuiDropdownManual" }, providers: [TuiDropdownDriver, tuiAsDriver(TuiDropdownDriver)], usesOnChanges: true, ngImport: i0 }); }
610
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownManual, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
611
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.17", type: TuiDropdownManual, isStandalone: true, selector: "[tuiDropdownManual]", inputs: { tuiDropdownManual: { classPropertyName: "tuiDropdownManual", publicName: "tuiDropdownManual", isSignal: true, isRequired: false, transformFunction: null } }, providers: [TuiDropdownDriver, tuiAsDriver(TuiDropdownDriver)], usesOnChanges: true, ngImport: i0 }); }
690
612
  }
691
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownManual, decorators: [{
613
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownManual, decorators: [{
692
614
  type: Directive,
693
615
  args: [{
694
- standalone: true,
695
616
  selector: '[tuiDropdownManual]',
696
617
  providers: [TuiDropdownDriver, tuiAsDriver(TuiDropdownDriver)],
697
618
  }]
698
- }], propDecorators: { tuiDropdownManual: [{
699
- type: Input
700
- }] } });
701
-
702
- /**
703
- * @deprecated TODO: remove in v.5 when legacy controls are dropped
704
- */
705
- class TuiDropdownOpenLegacy {
706
- constructor() {
707
- this.openStateSub = new Subject();
708
- this.tuiDropdownOpenChange = this.openStateSub.pipe(distinctUntilChanged());
709
- }
710
- set tuiDropdownOpen(open) {
711
- this.emitOpenChange(open);
712
- }
713
- emitOpenChange(open) {
714
- this.openStateSub.next(open);
715
- }
716
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownOpenLegacy, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
717
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.15", type: TuiDropdownOpenLegacy, isStandalone: true, selector: "[tuiDropdownOpen]:not([tuiDropdown]),[tuiDropdownOpenChange]:not([tuiDropdown])", inputs: { tuiDropdownOpen: "tuiDropdownOpen" }, outputs: { tuiDropdownOpenChange: "tuiDropdownOpenChange" }, ngImport: i0 }); }
718
- }
719
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownOpenLegacy, decorators: [{
720
- type: Directive,
721
- args: [{
722
- standalone: true,
723
- selector: '[tuiDropdownOpen]:not([tuiDropdown]),[tuiDropdownOpenChange]:not([tuiDropdown])',
724
- }]
725
- }], propDecorators: { tuiDropdownOpenChange: [{
726
- type: Output
727
- }], tuiDropdownOpen: [{
728
- type: Input
729
- }] } });
619
+ }] });
730
620
 
731
621
  class TuiDropdownPositionSided extends TuiPositionAccessor {
732
622
  constructor() {
@@ -735,12 +625,12 @@ class TuiDropdownPositionSided extends TuiPositionAccessor {
735
625
  this.viewport = inject(TUI_VIEWPORT);
736
626
  this.vertical = inject(TuiDropdownPosition);
737
627
  this.previous = this.options.direction || 'bottom';
738
- this.tuiDropdownSided = '';
739
- this.tuiDropdownSidedOffset = 4;
628
+ this.tuiDropdownSided = input('');
629
+ this.tuiDropdownSidedOffset = input(4);
740
630
  this.type = 'dropdown';
741
631
  }
742
632
  getPosition(rect) {
743
- if (this.tuiDropdownSided === false) {
633
+ if (this.tuiDropdownSided() === false) {
744
634
  return this.vertical.getPosition(rect);
745
635
  }
746
636
  const { height, width } = rect;
@@ -756,38 +646,33 @@ class TuiDropdownPositionSided extends TuiPositionAccessor {
756
646
  bottom: viewport.bottom - hostRect.top,
757
647
  };
758
648
  const position = {
759
- top: hostRect.bottom - height + this.tuiDropdownSidedOffset + 1, // 1 for border
649
+ top: hostRect.bottom - height + this.tuiDropdownSidedOffset() + 1, // 1 for border
760
650
  left: hostRect.left - width - offset,
761
651
  right: hostRect.right + offset,
762
- bottom: hostRect.top - this.tuiDropdownSidedOffset - 1, // 1 for border
652
+ bottom: hostRect.top - this.tuiDropdownSidedOffset() - 1, // 1 for border
763
653
  };
764
654
  const better = available.top > available.bottom ? 'top' : 'bottom';
765
655
  const maxLeft = available.left > available.right ? position.left : position.right;
766
656
  const left = available[align] > width ? position[align] : maxLeft;
767
657
  if ((available[this.previous] > height && direction) ||
768
658
  this.previous === better) {
769
- this.vertical.emitDirection(this.previous);
770
- return [position[this.previous], left];
659
+ this.vertical.direction.next(this.previous);
660
+ return [left, position[this.previous]];
771
661
  }
772
662
  this.previous = better;
773
- this.vertical.emitDirection(better);
774
- return [position[better], left];
663
+ this.vertical.direction.next(better);
664
+ return [left, position[better]];
775
665
  }
776
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownPositionSided, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
777
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.15", type: TuiDropdownPositionSided, isStandalone: true, selector: "[tuiDropdownSided]", inputs: { tuiDropdownSided: "tuiDropdownSided", tuiDropdownSidedOffset: "tuiDropdownSidedOffset" }, providers: [TuiDropdownPosition, tuiAsPositionAccessor(TuiDropdownPositionSided)], usesInheritance: true, ngImport: i0 }); }
666
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownPositionSided, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
667
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.17", type: TuiDropdownPositionSided, isStandalone: true, selector: "[tuiDropdownSided]", inputs: { tuiDropdownSided: { classPropertyName: "tuiDropdownSided", publicName: "tuiDropdownSided", isSignal: true, isRequired: false, transformFunction: null }, tuiDropdownSidedOffset: { classPropertyName: "tuiDropdownSidedOffset", publicName: "tuiDropdownSidedOffset", isSignal: true, isRequired: false, transformFunction: null } }, providers: [TuiDropdownPosition, tuiAsPositionAccessor(TuiDropdownPositionSided)], usesInheritance: true, ngImport: i0 }); }
778
668
  }
779
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownPositionSided, decorators: [{
669
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownPositionSided, decorators: [{
780
670
  type: Directive,
781
671
  args: [{
782
- standalone: true,
783
672
  selector: '[tuiDropdownSided]',
784
673
  providers: [TuiDropdownPosition, tuiAsPositionAccessor(TuiDropdownPositionSided)],
785
674
  }]
786
- }], propDecorators: { tuiDropdownSided: [{
787
- type: Input
788
- }], tuiDropdownSidedOffset: [{
789
- type: Input
790
- }] } });
675
+ }] });
791
676
 
792
677
  class TuiDropdownSelection extends TuiDriver {
793
678
  constructor() {
@@ -796,9 +681,9 @@ class TuiDropdownSelection extends TuiDriver {
796
681
  this.vcr = inject(ViewContainerRef);
797
682
  this.dropdown = inject(TuiDropdownDirective);
798
683
  this.el = tuiInjectElement();
799
- this.handler$ = new BehaviorSubject(TUI_TRUE_HANDLER);
684
+ this.handler = computed((visible = this.tuiDropdownSelection()) => tuiIsString(visible) ? TUI_TRUE_HANDLER : visible);
800
685
  this.stream$ = combineLatest([
801
- this.handler$,
686
+ toObservable(this.handler),
802
687
  inject(TUI_SELECTION_STREAM).pipe(map(() => this.getRange()), filter((range) => this.isValid(range)), distinctUntilChanged((x, y) => x.startOffset === y.startOffset &&
803
688
  x.endOffset === y.endOffset &&
804
689
  x.commonAncestorContainer === y.commonAncestorContainer)),
@@ -810,17 +695,15 @@ class TuiDropdownSelection extends TuiDriver {
810
695
  : this.range;
811
696
  return (contained && handler(this.range)) || this.inDropdown(range);
812
697
  }));
813
- this.range = inject(TUI_RANGE);
814
- this.position = 'selection';
698
+ this.range = isPlatformBrowser(inject(PLATFORM_ID))
699
+ ? new Range()
700
+ : {};
815
701
  this.type = 'dropdown';
816
- }
817
- set tuiDropdownSelection(visible) {
818
- if (!tuiIsString(visible)) {
819
- this.handler$.next(visible);
820
- }
702
+ this.tuiDropdownSelection = input('');
703
+ this.tuiDropdownSelectionPosition = input('selection');
821
704
  }
822
705
  getClientRect() {
823
- switch (this.position) {
706
+ switch (this.tuiDropdownSelectionPosition()) {
824
707
  case 'tag': {
825
708
  const { commonAncestorContainer } = this.range;
826
709
  const element = tuiIsElement(commonAncestorContainer)
@@ -911,28 +794,22 @@ class TuiDropdownSelection extends TuiDriver {
911
794
  this.ghost = ghost;
912
795
  return ghost;
913
796
  }
914
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownSelection, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
915
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.15", type: TuiDropdownSelection, isStandalone: true, selector: "[tuiDropdownSelection]", inputs: { position: ["tuiDropdownSelectionPosition", "position"], tuiDropdownSelection: "tuiDropdownSelection" }, providers: [
797
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownSelection, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
798
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.17", type: TuiDropdownSelection, isStandalone: true, selector: "[tuiDropdownSelection]", inputs: { tuiDropdownSelection: { classPropertyName: "tuiDropdownSelection", publicName: "tuiDropdownSelection", isSignal: true, isRequired: false, transformFunction: null }, tuiDropdownSelectionPosition: { classPropertyName: "tuiDropdownSelectionPosition", publicName: "tuiDropdownSelectionPosition", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
916
799
  tuiAsDriver(TuiDropdownSelection),
917
800
  tuiAsRectAccessor(TuiDropdownSelection),
918
801
  ], usesInheritance: true, ngImport: i0 }); }
919
802
  }
920
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownSelection, decorators: [{
803
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownSelection, decorators: [{
921
804
  type: Directive,
922
805
  args: [{
923
- standalone: true,
924
806
  selector: '[tuiDropdownSelection]',
925
807
  providers: [
926
808
  tuiAsDriver(TuiDropdownSelection),
927
809
  tuiAsRectAccessor(TuiDropdownSelection),
928
810
  ],
929
811
  }]
930
- }], ctorParameters: () => [], propDecorators: { position: [{
931
- type: Input,
932
- args: ['tuiDropdownSelectionPosition']
933
- }], tuiDropdownSelection: [{
934
- type: Input
935
- }] } });
812
+ }], ctorParameters: () => [] });
936
813
 
937
814
  const TuiDropdown = [
938
815
  TuiDropdownOptionsDirective,
@@ -940,7 +817,6 @@ const TuiDropdown = [
940
817
  TuiDropdownDirective,
941
818
  TuiDropdownComponent,
942
819
  TuiDropdownOpen,
943
- TuiDropdownOpenLegacy,
944
820
  TuiDropdownManual,
945
821
  TuiDropdownHover,
946
822
  TuiDropdownContent,
@@ -954,28 +830,20 @@ function tuiDropdown(value) {
954
830
  return tuiDirectiveBinding(TuiDropdownDirective, 'tuiDropdown', value, {});
955
831
  }
956
832
  function tuiDropdownEnabled(value) {
957
- return tuiDirectiveBinding(TuiDropdownOpen, 'tuiDropdownEnabled', value, {});
958
- }
959
- function tuiDropdownOpen() {
960
- const open = tuiDirectiveBinding(TuiDropdownOpen, 'tuiDropdownOpen', false, {});
961
- inject(TuiDropdownOpen)
962
- .tuiDropdownOpenChange.pipe(takeUntilDestroyed())
963
- .subscribe((value) => open.set(value));
964
- return open;
833
+ return tuiDirectiveBinding(TuiDropdownOpen, 'enabled', value, {});
965
834
  }
966
835
 
967
836
  class TuiDropdownFixed {
968
837
  constructor() {
969
- const override = tuiOverrideOptions$1({ limitWidth: 'fixed' }, TUI_DROPDOWN_DEFAULT_OPTIONS);
838
+ const override = tuiOverrideOptions({ limitWidth: 'fixed' }, TUI_DROPDOWN_DEFAULT_OPTIONS);
970
839
  override(inject(TUI_DROPDOWN_OPTIONS, { self: true, optional: true }), null);
971
840
  }
972
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownFixed, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
973
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.15", type: TuiDropdownFixed, isStandalone: true, providers: [tuiDropdownOptionsProvider({})], ngImport: i0 }); }
841
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownFixed, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
842
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.17", type: TuiDropdownFixed, isStandalone: true, providers: [tuiDropdownOptionsProvider({})], ngImport: i0 }); }
974
843
  }
975
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownFixed, decorators: [{
844
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownFixed, decorators: [{
976
845
  type: Directive,
977
846
  args: [{
978
- standalone: true,
979
847
  providers: [tuiDropdownOptionsProvider({})],
980
848
  }]
981
849
  }], ctorParameters: () => [] });
@@ -987,22 +855,20 @@ class TuiDropdownAuto {
987
855
  */
988
856
  inject(TUI_DROPDOWN_OPTIONS).limitWidth = 'auto';
989
857
  }
990
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownAuto, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
991
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.15", type: TuiDropdownAuto, isStandalone: true, ngImport: i0 }); }
858
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownAuto, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
859
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.17", type: TuiDropdownAuto, isStandalone: true, ngImport: i0 }); }
992
860
  }
993
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownAuto, decorators: [{
994
- type: Directive,
995
- args: [{ standalone: true }]
861
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownAuto, decorators: [{
862
+ type: Directive
996
863
  }], ctorParameters: () => [] });
997
864
 
998
865
  class TuiWithDropdownOpen {
999
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiWithDropdownOpen, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
1000
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.15", type: TuiWithDropdownOpen, isStandalone: true, hostDirectives: [{ directive: TuiDropdownOpen, inputs: ["tuiDropdownOpen", "open", "tuiDropdownEnabled", "tuiDropdownEnabled"], outputs: ["tuiDropdownOpenChange", "openChange"] }], ngImport: i0 }); }
866
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiWithDropdownOpen, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
867
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.17", type: TuiWithDropdownOpen, isStandalone: true, hostDirectives: [{ directive: TuiDropdownOpen, inputs: ["tuiDropdownOpen", "open", "tuiDropdownEnabled", "tuiDropdownEnabled"], outputs: ["tuiDropdownOpenChange", "openChange"] }], ngImport: i0 }); }
1001
868
  }
1002
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiWithDropdownOpen, decorators: [{
869
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiWithDropdownOpen, decorators: [{
1003
870
  type: Directive,
1004
871
  args: [{
1005
- standalone: true,
1006
872
  hostDirectives: [
1007
873
  {
1008
874
  directive: TuiDropdownOpen,
@@ -1017,5 +883,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
1017
883
  * Generated bundle index. Do not edit.
1018
884
  */
1019
885
 
1020
- export { TUI_DROPDOWN_COMPONENT, TUI_DROPDOWN_CONTEXT, TUI_DROPDOWN_DEFAULT_OPTIONS, TUI_DROPDOWN_HOVER_DEFAULT_OPTIONS, TUI_DROPDOWN_HOVER_OPTIONS, TUI_DROPDOWN_OPTIONS, TuiDropdown, TuiDropdownAuto, TuiDropdownComponent, TuiDropdownContent, TuiDropdownContext, TuiDropdownDirective, TuiDropdownDriver, TuiDropdownDriverDirective, TuiDropdownFixed, TuiDropdownHover, TuiDropdownManual, TuiDropdownOpen, TuiDropdownOpenLegacy, TuiDropdownOptionsDirective, TuiDropdownPosition, TuiDropdownPositionSided, TuiDropdownSelection, TuiWithDropdownOpen, tuiDropdown, tuiDropdownEnabled, tuiDropdownHoverOptionsProvider, tuiDropdownOpen, tuiDropdownOptionsProvider };
1021
- //# sourceMappingURL=taiga-ui-core-directives-dropdown.mjs.map
886
+ export { TUI_DROPDOWN_COMPONENT, TUI_DROPDOWN_CONTEXT, TUI_DROPDOWN_DEFAULT_OPTIONS, TUI_DROPDOWN_HOVER_DEFAULT_OPTIONS, TUI_DROPDOWN_HOVER_OPTIONS, TUI_DROPDOWN_OPTIONS, TuiDropdown, TuiDropdownAuto, TuiDropdownClose, TuiDropdownComponent, TuiDropdownContent, TuiDropdownContext, TuiDropdownDirective, TuiDropdownDriver, TuiDropdownDriverDirective, TuiDropdownFixed, TuiDropdownHover, TuiDropdownManual, TuiDropdownOpen, TuiDropdownOptionsDirective, TuiDropdownPosition, TuiDropdownPositionSided, TuiDropdownSelection, TuiWithDropdownOpen, tuiDropdown, tuiDropdownEnabled, tuiDropdownHoverOptionsProvider, tuiDropdownOptionsProvider };
887
+ //# sourceMappingURL=taiga-ui-core-portals-dropdown.mjs.map