@vkontakte/vkui 8.1.2 → 8.2.0

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 (653) hide show
  1. package/dist/components/ActionSheet/ActionSheet.d.ts +5 -4
  2. package/dist/components/ActionSheet/ActionSheet.d.ts.map +1 -1
  3. package/dist/components/ActionSheet/ActionSheet.js +2 -1
  4. package/dist/components/ActionSheet/ActionSheet.js.map +1 -1
  5. package/dist/components/AdaptivityProvider/AdaptivityContext.d.ts +3 -3
  6. package/dist/components/AdaptivityProvider/AdaptivityContext.js.map +1 -1
  7. package/dist/components/AdaptivityProvider/AdaptivityProvider.js +2 -2
  8. package/dist/components/AdaptivityProvider/AdaptivityProvider.js.map +1 -1
  9. package/dist/components/AppRoot/AppRoot.d.ts.map +1 -1
  10. package/dist/components/AppRoot/AppRoot.js +0 -6
  11. package/dist/components/AppRoot/AppRoot.js.map +1 -1
  12. package/dist/components/AppRoot/AppRootContext.d.ts +0 -1
  13. package/dist/components/AppRoot/AppRootContext.d.ts.map +1 -1
  14. package/dist/components/AppRoot/AppRootContext.js +0 -1
  15. package/dist/components/AppRoot/AppRootContext.js.map +1 -1
  16. package/dist/components/Calendar/Calendar.d.ts +1 -1
  17. package/dist/components/Calendar/Calendar.js +2 -1
  18. package/dist/components/Calendar/Calendar.js.map +1 -1
  19. package/dist/components/CalendarDay/CalendarDay.d.ts.map +1 -1
  20. package/dist/components/CalendarDay/CalendarDay.js +4 -2
  21. package/dist/components/CalendarDay/CalendarDay.js.map +1 -1
  22. package/dist/components/CalendarDays/CalendarDays.d.ts.map +1 -1
  23. package/dist/components/CalendarDays/CalendarDays.js +2 -2
  24. package/dist/components/CalendarDays/CalendarDays.js.map +1 -1
  25. package/dist/components/CalendarHeader/CalendarHeader.d.ts.map +1 -1
  26. package/dist/components/CalendarHeader/CalendarHeader.js +4 -2
  27. package/dist/components/CalendarHeader/CalendarHeader.js.map +1 -1
  28. package/dist/components/CalendarRange/CalendarRange.d.ts +2 -2
  29. package/dist/components/CalendarRange/CalendarRange.js.map +1 -1
  30. package/dist/components/CalendarTime/CalendarTime.d.ts +1 -1
  31. package/dist/components/CalendarTime/CalendarTime.d.ts.map +1 -1
  32. package/dist/components/CalendarTime/CalendarTime.js +61 -50
  33. package/dist/components/CalendarTime/CalendarTime.js.map +1 -1
  34. package/dist/components/CalendarTime/CalendarTimePicker.d.ts +11 -7
  35. package/dist/components/CalendarTime/CalendarTimePicker.d.ts.map +1 -1
  36. package/dist/components/CalendarTime/CalendarTimePicker.js +108 -48
  37. package/dist/components/CalendarTime/CalendarTimePicker.js.map +1 -1
  38. package/dist/components/CalendarTime/ComboBox.d.ts +25 -0
  39. package/dist/components/CalendarTime/ComboBox.d.ts.map +1 -0
  40. package/dist/components/CalendarTime/ComboBox.js +112 -0
  41. package/dist/components/CalendarTime/ComboBox.js.map +1 -0
  42. package/dist/components/CardScroll/CardScroll.d.ts.map +1 -1
  43. package/dist/components/CardScroll/CardScroll.js +2 -2
  44. package/dist/components/CardScroll/CardScroll.js.map +1 -1
  45. package/dist/components/CarouselBase/CarouselBase.d.ts.map +1 -1
  46. package/dist/components/CarouselBase/CarouselBase.js +3 -1
  47. package/dist/components/CarouselBase/CarouselBase.js.map +1 -1
  48. package/dist/components/ChipsSelect/useChipsSelect.d.ts.map +1 -1
  49. package/dist/components/ChipsSelect/useChipsSelect.js +2 -1
  50. package/dist/components/ChipsSelect/useChipsSelect.js.map +1 -1
  51. package/dist/components/ConfigProvider/ConfigProvider.d.ts.map +1 -1
  52. package/dist/components/ConfigProvider/ConfigProvider.js +8 -4
  53. package/dist/components/ConfigProvider/ConfigProvider.js.map +1 -1
  54. package/dist/components/ConfigProvider/ConfigProviderOverride.d.ts.map +1 -1
  55. package/dist/components/ConfigProvider/ConfigProviderOverride.js +5 -1
  56. package/dist/components/ConfigProvider/ConfigProviderOverride.js.map +1 -1
  57. package/dist/components/ConfigProvider/ConfigProviderSubContexts.d.ts +15 -0
  58. package/dist/components/ConfigProvider/ConfigProviderSubContexts.d.ts.map +1 -0
  59. package/dist/components/ConfigProvider/ConfigProviderSubContexts.js +25 -0
  60. package/dist/components/ConfigProvider/ConfigProviderSubContexts.js.map +1 -0
  61. package/dist/components/ContentBadge/ContentBadge.d.ts +14 -1
  62. package/dist/components/ContentBadge/ContentBadge.d.ts.map +1 -1
  63. package/dist/components/ContentBadge/ContentBadge.js +39 -1
  64. package/dist/components/ContentBadge/ContentBadge.js.map +1 -1
  65. package/dist/components/CustomSelect/CustomSelect.d.ts.map +1 -1
  66. package/dist/components/CustomSelect/CustomSelect.js +16 -10
  67. package/dist/components/CustomSelect/CustomSelect.js.map +1 -1
  68. package/dist/components/DateInput/DateInput.d.ts.map +1 -1
  69. package/dist/components/DateInput/DateInput.js +4 -3
  70. package/dist/components/DateInput/DateInput.js.map +1 -1
  71. package/dist/components/DateRangeInput/DateRangeInput.d.ts.map +1 -1
  72. package/dist/components/DateRangeInput/DateRangeInput.js +2 -2
  73. package/dist/components/DateRangeInput/DateRangeInput.js.map +1 -1
  74. package/dist/components/Epic/ScrollSaver.d.ts.map +1 -1
  75. package/dist/components/Epic/ScrollSaver.js +1 -0
  76. package/dist/components/Epic/ScrollSaver.js.map +1 -1
  77. package/dist/components/FixedLayout/ParentWidthWrapper.d.ts +6 -0
  78. package/dist/components/FixedLayout/ParentWidthWrapper.d.ts.map +1 -0
  79. package/dist/components/FixedLayout/ParentWidthWrapper.js +43 -0
  80. package/dist/components/FixedLayout/ParentWidthWrapper.js.map +1 -0
  81. package/dist/components/Flex/Flex.d.ts +7 -4
  82. package/dist/components/Flex/Flex.d.ts.map +1 -1
  83. package/dist/components/Flex/Flex.js +5 -2
  84. package/dist/components/Flex/Flex.js.map +1 -1
  85. package/dist/components/ImageBase/ImageBaseFloatElement/ImageBaseFloatElement.js +3 -1
  86. package/dist/components/ImageBase/ImageBaseFloatElement/ImageBaseFloatElement.js.map +1 -1
  87. package/dist/components/NativeSelect/NativeSelect.d.ts.map +1 -1
  88. package/dist/components/NativeSelect/NativeSelect.js +6 -2
  89. package/dist/components/NativeSelect/NativeSelect.js.map +1 -1
  90. package/dist/components/NavTransitionContext/NavTransitionContext.d.ts +2 -1
  91. package/dist/components/NavTransitionContext/NavTransitionContext.d.ts.map +1 -1
  92. package/dist/components/NavTransitionContext/NavTransitionContext.js +8 -4
  93. package/dist/components/NavTransitionContext/NavTransitionContext.js.map +1 -1
  94. package/dist/components/OnboardingTooltip/OnboardingTooltip.d.ts.map +1 -1
  95. package/dist/components/OnboardingTooltip/OnboardingTooltip.js +4 -5
  96. package/dist/components/OnboardingTooltip/OnboardingTooltip.js.map +1 -1
  97. package/dist/components/PanelHeader/PanelHeader.d.ts +1 -1
  98. package/dist/components/PanelHeader/PanelHeader.js.map +1 -1
  99. package/dist/components/Popper/Popper.d.ts.map +1 -1
  100. package/dist/components/Popper/Popper.js +7 -4
  101. package/dist/components/Popper/Popper.js.map +1 -1
  102. package/dist/components/PullToRefresh/PullToRefresh.d.ts.map +1 -1
  103. package/dist/components/PullToRefresh/PullToRefresh.js +8 -4
  104. package/dist/components/PullToRefresh/PullToRefresh.js.map +1 -1
  105. package/dist/components/Root/Root.d.ts +1 -1
  106. package/dist/components/Root/Root.d.ts.map +1 -1
  107. package/dist/components/Root/Root.js +43 -37
  108. package/dist/components/Root/Root.js.map +1 -1
  109. package/dist/components/SimpleGrid/SimpleGrid.d.ts +9 -8
  110. package/dist/components/SimpleGrid/SimpleGrid.d.ts.map +1 -1
  111. package/dist/components/SimpleGrid/SimpleGrid.js +9 -2
  112. package/dist/components/SimpleGrid/SimpleGrid.js.map +1 -1
  113. package/dist/components/Skeleton/Skeleton.d.ts.map +1 -1
  114. package/dist/components/Skeleton/Skeleton.js +3 -4
  115. package/dist/components/Skeleton/Skeleton.js.map +1 -1
  116. package/dist/components/Snackbar/Snackbar.d.ts.map +1 -1
  117. package/dist/components/Snackbar/Snackbar.js +6 -3
  118. package/dist/components/Snackbar/Snackbar.js.map +1 -1
  119. package/dist/components/Spacing/Spacing.d.ts +1 -1
  120. package/dist/components/Spacing/Spacing.js.map +1 -1
  121. package/dist/components/Spinner/ExpressiveSpinner/ExpressiveSpinner.d.ts +10 -0
  122. package/dist/components/Spinner/ExpressiveSpinner/ExpressiveSpinner.d.ts.map +1 -0
  123. package/dist/components/Spinner/ExpressiveSpinner/ExpressiveSpinner.js +54 -0
  124. package/dist/components/Spinner/ExpressiveSpinner/ExpressiveSpinner.js.map +1 -0
  125. package/dist/components/Spinner/ExpressiveSpinner/icons.d.ts +18 -0
  126. package/dist/components/Spinner/ExpressiveSpinner/icons.d.ts.map +1 -0
  127. package/dist/components/Spinner/ExpressiveSpinner/icons.js +79 -0
  128. package/dist/components/Spinner/ExpressiveSpinner/icons.js.map +1 -0
  129. package/dist/components/Spinner/SvgIcon.d.ts +14 -0
  130. package/dist/components/Spinner/SvgIcon.d.ts.map +1 -0
  131. package/dist/components/Spinner/SvgIcon.js +20 -0
  132. package/dist/components/Spinner/SvgIcon.js.map +1 -0
  133. package/dist/components/Spinner/icons.d.ts +1 -1
  134. package/dist/components/Spinner/icons.d.ts.map +1 -1
  135. package/dist/components/Spinner/icons.js +10 -23
  136. package/dist/components/Spinner/icons.js.map +1 -1
  137. package/dist/components/SplitLayout/SplitLayout.d.ts +3 -3
  138. package/dist/components/SplitLayout/SplitLayout.js.map +1 -1
  139. package/dist/components/TabsItem/TabsItem.d.ts.map +1 -1
  140. package/dist/components/TabsItem/TabsItem.js +2 -5
  141. package/dist/components/TabsItem/TabsItem.js.map +1 -1
  142. package/dist/components/Tappable/Tappable.d.ts +2 -2
  143. package/dist/components/Tappable/Tappable.js.map +1 -1
  144. package/dist/components/View/View.d.ts.map +1 -1
  145. package/dist/components/View/View.js +50 -53
  146. package/dist/components/View/View.js.map +1 -1
  147. package/dist/components/View/ViewInfinite.d.ts.map +1 -1
  148. package/dist/components/View/ViewInfinite.js +34 -37
  149. package/dist/components/View/ViewInfinite.js.map +1 -1
  150. package/dist/components/WriteBar/WriteBar.d.ts +15 -1
  151. package/dist/components/WriteBar/WriteBar.d.ts.map +1 -1
  152. package/dist/components/WriteBar/WriteBar.js +35 -63
  153. package/dist/components/WriteBar/WriteBar.js.map +1 -1
  154. package/dist/components/WriteBar/WriteBarBeforeOrAfter/WriteBarBeforeOrAfter.d.ts +5 -0
  155. package/dist/components/WriteBar/WriteBarBeforeOrAfter/WriteBarBeforeOrAfter.d.ts.map +1 -0
  156. package/dist/components/WriteBar/WriteBarBeforeOrAfter/WriteBarBeforeOrAfter.js +15 -0
  157. package/dist/components/WriteBar/WriteBarBeforeOrAfter/WriteBarBeforeOrAfter.js.map +1 -0
  158. package/dist/components/WriteBar/WriteBarFormField/WriteBarFormField.d.ts +8 -0
  159. package/dist/components/WriteBar/WriteBarFormField/WriteBarFormField.d.ts.map +1 -0
  160. package/dist/components/WriteBar/WriteBarFormField/WriteBarFormField.js +16 -0
  161. package/dist/components/WriteBar/WriteBarFormField/WriteBarFormField.js.map +1 -0
  162. package/dist/components/WriteBar/WriteBarFormField/WriteBarFormFieldInlineAfter/WriteBarFormFieldInlineAfter.d.ts +5 -0
  163. package/dist/components/WriteBar/WriteBarFormField/WriteBarFormFieldInlineAfter/WriteBarFormFieldInlineAfter.d.ts.map +1 -0
  164. package/dist/components/WriteBar/WriteBarFormField/WriteBarFormFieldInlineAfter/WriteBarFormFieldInlineAfter.js +15 -0
  165. package/dist/components/WriteBar/WriteBarFormField/WriteBarFormFieldInlineAfter/WriteBarFormFieldInlineAfter.js.map +1 -0
  166. package/dist/components/WriteBar/WriteBarRoot/WriteBarRoot.d.ts +10 -0
  167. package/dist/components/WriteBar/WriteBarRoot/WriteBarRoot.d.ts.map +1 -0
  168. package/dist/components/WriteBar/WriteBarRoot/WriteBarRoot.js +16 -0
  169. package/dist/components/WriteBar/WriteBarRoot/WriteBarRoot.js.map +1 -0
  170. package/dist/components/WriteBar/WriteBarTextarea/WriteBarTextarea.d.ts +10 -0
  171. package/dist/components/WriteBar/WriteBarTextarea/WriteBarTextarea.d.ts.map +1 -0
  172. package/dist/components/WriteBar/WriteBarTextarea/WriteBarTextarea.js +39 -0
  173. package/dist/components/WriteBar/WriteBarTextarea/WriteBarTextarea.js.map +1 -0
  174. package/dist/components.css +1 -1
  175. package/dist/components.css.map +1 -1
  176. package/dist/cssm/components/ActionSheet/ActionSheet.js +2 -1
  177. package/dist/cssm/components/ActionSheet/ActionSheet.js.map +1 -1
  178. package/dist/cssm/components/AdaptivityProvider/AdaptivityContext.js.map +1 -1
  179. package/dist/cssm/components/AdaptivityProvider/AdaptivityProvider.js +2 -2
  180. package/dist/cssm/components/AdaptivityProvider/AdaptivityProvider.js.map +1 -1
  181. package/dist/cssm/components/AppRoot/AppRoot.js +0 -6
  182. package/dist/cssm/components/AppRoot/AppRoot.js.map +1 -1
  183. package/dist/cssm/components/AppRoot/AppRootContext.js +0 -1
  184. package/dist/cssm/components/AppRoot/AppRootContext.js.map +1 -1
  185. package/dist/cssm/components/Calendar/Calendar.js +2 -1
  186. package/dist/cssm/components/Calendar/Calendar.js.map +1 -1
  187. package/dist/cssm/components/CalendarDay/CalendarDay.js +4 -2
  188. package/dist/cssm/components/CalendarDay/CalendarDay.js.map +1 -1
  189. package/dist/cssm/components/CalendarDays/CalendarDays.js +2 -2
  190. package/dist/cssm/components/CalendarDays/CalendarDays.js.map +1 -1
  191. package/dist/cssm/components/CalendarHeader/CalendarHeader.js +4 -2
  192. package/dist/cssm/components/CalendarHeader/CalendarHeader.js.map +1 -1
  193. package/dist/cssm/components/CalendarRange/CalendarRange.js.map +1 -1
  194. package/dist/cssm/components/CalendarTime/CalendarTime.js +61 -50
  195. package/dist/cssm/components/CalendarTime/CalendarTime.js.map +1 -1
  196. package/dist/cssm/components/CalendarTime/CalendarTime.module.css +38 -0
  197. package/dist/cssm/components/CalendarTime/CalendarTimePicker.js +108 -48
  198. package/dist/cssm/components/CalendarTime/CalendarTimePicker.js.map +1 -1
  199. package/dist/cssm/components/CalendarTime/ComboBox.js +113 -0
  200. package/dist/cssm/components/CalendarTime/ComboBox.js.map +1 -0
  201. package/dist/cssm/components/CardScroll/CardScroll.js +2 -2
  202. package/dist/cssm/components/CardScroll/CardScroll.js.map +1 -1
  203. package/dist/cssm/components/CarouselBase/CarouselBase.js +3 -1
  204. package/dist/cssm/components/CarouselBase/CarouselBase.js.map +1 -1
  205. package/dist/cssm/components/ChipsSelect/useChipsSelect.js +2 -1
  206. package/dist/cssm/components/ChipsSelect/useChipsSelect.js.map +1 -1
  207. package/dist/cssm/components/ConfigProvider/ConfigProvider.js +8 -4
  208. package/dist/cssm/components/ConfigProvider/ConfigProvider.js.map +1 -1
  209. package/dist/cssm/components/ConfigProvider/ConfigProviderOverride.js +5 -1
  210. package/dist/cssm/components/ConfigProvider/ConfigProviderOverride.js.map +1 -1
  211. package/dist/cssm/components/ConfigProvider/ConfigProviderSubContexts.js +25 -0
  212. package/dist/cssm/components/ConfigProvider/ConfigProviderSubContexts.js.map +1 -0
  213. package/dist/cssm/components/ContentBadge/ContentBadge.js +39 -1
  214. package/dist/cssm/components/ContentBadge/ContentBadge.js.map +1 -1
  215. package/dist/cssm/components/ContentBadge/ContentBadge.module.css +88 -90
  216. package/dist/cssm/components/CustomSelect/CustomSelect.js +16 -10
  217. package/dist/cssm/components/CustomSelect/CustomSelect.js.map +1 -1
  218. package/dist/cssm/components/DateInput/DateInput.js +4 -3
  219. package/dist/cssm/components/DateInput/DateInput.js.map +1 -1
  220. package/dist/cssm/components/DateRangeInput/DateRangeInput.js +2 -2
  221. package/dist/cssm/components/DateRangeInput/DateRangeInput.js.map +1 -1
  222. package/dist/cssm/components/Epic/ScrollSaver.js +1 -0
  223. package/dist/cssm/components/Epic/ScrollSaver.js.map +1 -1
  224. package/dist/cssm/components/FixedLayout/ParentWidthWrapper.js +43 -0
  225. package/dist/cssm/components/FixedLayout/ParentWidthWrapper.js.map +1 -0
  226. package/dist/cssm/components/Flex/Flex.js +5 -2
  227. package/dist/cssm/components/Flex/Flex.js.map +1 -1
  228. package/dist/cssm/components/GridAvatar/GridAvatar.module.css +1 -1
  229. package/dist/cssm/components/ImageBase/ImageBaseFloatElement/ImageBaseFloatElement.js +3 -1
  230. package/dist/cssm/components/ImageBase/ImageBaseFloatElement/ImageBaseFloatElement.js.map +1 -1
  231. package/dist/cssm/components/NativeSelect/NativeSelect.js +6 -2
  232. package/dist/cssm/components/NativeSelect/NativeSelect.js.map +1 -1
  233. package/dist/cssm/components/NavTransitionContext/NavTransitionContext.js +8 -4
  234. package/dist/cssm/components/NavTransitionContext/NavTransitionContext.js.map +1 -1
  235. package/dist/cssm/components/OnboardingTooltip/OnboardingTooltip.js +4 -5
  236. package/dist/cssm/components/OnboardingTooltip/OnboardingTooltip.js.map +1 -1
  237. package/dist/cssm/components/PanelHeader/PanelHeader.js.map +1 -1
  238. package/dist/cssm/components/Popper/Popper.js +7 -4
  239. package/dist/cssm/components/Popper/Popper.js.map +1 -1
  240. package/dist/cssm/components/PullToRefresh/PullToRefresh.js +8 -4
  241. package/dist/cssm/components/PullToRefresh/PullToRefresh.js.map +1 -1
  242. package/dist/cssm/components/PullToRefresh/PullToRefresh.module.css +1 -1
  243. package/dist/cssm/components/Root/Root.js +43 -37
  244. package/dist/cssm/components/Root/Root.js.map +1 -1
  245. package/dist/cssm/components/SimpleGrid/SimpleGrid.js +9 -2
  246. package/dist/cssm/components/SimpleGrid/SimpleGrid.js.map +1 -1
  247. package/dist/cssm/components/Skeleton/Skeleton.js +3 -4
  248. package/dist/cssm/components/Skeleton/Skeleton.js.map +1 -1
  249. package/dist/cssm/components/Snackbar/Snackbar.js +6 -3
  250. package/dist/cssm/components/Snackbar/Snackbar.js.map +1 -1
  251. package/dist/cssm/components/Spacing/Spacing.js.map +1 -1
  252. package/dist/cssm/components/Spinner/ExpressiveSpinner/ExpressiveSpinner.js +56 -0
  253. package/dist/cssm/components/Spinner/ExpressiveSpinner/ExpressiveSpinner.js.map +1 -0
  254. package/dist/cssm/components/Spinner/ExpressiveSpinner/ExpressiveSpinner.module.css +13 -0
  255. package/dist/cssm/components/Spinner/ExpressiveSpinner/icons.js +79 -0
  256. package/dist/cssm/components/Spinner/ExpressiveSpinner/icons.js.map +1 -0
  257. package/dist/cssm/components/Spinner/SvgIcon.js +20 -0
  258. package/dist/cssm/components/Spinner/SvgIcon.js.map +1 -0
  259. package/dist/cssm/components/Spinner/icons.js +10 -23
  260. package/dist/cssm/components/Spinner/icons.js.map +1 -1
  261. package/dist/cssm/components/SplitLayout/SplitLayout.js.map +1 -1
  262. package/dist/cssm/components/TabsItem/TabsItem.js +2 -5
  263. package/dist/cssm/components/TabsItem/TabsItem.js.map +1 -1
  264. package/dist/cssm/components/Tappable/Tappable.js.map +1 -1
  265. package/dist/cssm/components/View/View.js +50 -53
  266. package/dist/cssm/components/View/View.js.map +1 -1
  267. package/dist/cssm/components/View/ViewInfinite.js +34 -37
  268. package/dist/cssm/components/View/ViewInfinite.js.map +1 -1
  269. package/dist/cssm/components/WriteBar/WriteBar.js +35 -64
  270. package/dist/cssm/components/WriteBar/WriteBar.js.map +1 -1
  271. package/dist/cssm/components/WriteBar/WriteBarBeforeOrAfter/WriteBarBeforeOrAfter.js +16 -0
  272. package/dist/cssm/components/WriteBar/WriteBarBeforeOrAfter/WriteBarBeforeOrAfter.js.map +1 -0
  273. package/dist/cssm/components/WriteBar/WriteBarBeforeOrAfter/WriteBarBeforeOrAfter.module.css +12 -0
  274. package/dist/cssm/components/WriteBar/WriteBarFormField/WriteBarFormField.js +17 -0
  275. package/dist/cssm/components/WriteBar/WriteBarFormField/WriteBarFormField.js.map +1 -0
  276. package/dist/cssm/components/WriteBar/WriteBarFormField/WriteBarFormField.module.css +18 -0
  277. package/dist/cssm/components/WriteBar/WriteBarFormField/WriteBarFormFieldInlineAfter/WriteBarFormFieldInlineAfter.js +16 -0
  278. package/dist/cssm/components/WriteBar/WriteBarFormField/WriteBarFormFieldInlineAfter/WriteBarFormFieldInlineAfter.js.map +1 -0
  279. package/dist/cssm/components/WriteBar/WriteBarFormField/WriteBarFormFieldInlineAfter/WriteBarFormFieldInlineAfter.module.css +3 -0
  280. package/dist/cssm/components/WriteBar/WriteBarRoot/WriteBarRoot.js +17 -0
  281. package/dist/cssm/components/WriteBar/WriteBarRoot/WriteBarRoot.js.map +1 -0
  282. package/dist/cssm/components/WriteBar/WriteBarRoot/WriteBarRoot.module.css +15 -0
  283. package/dist/cssm/components/WriteBar/WriteBarTextarea/WriteBarTextarea.js +40 -0
  284. package/dist/cssm/components/WriteBar/WriteBarTextarea/WriteBarTextarea.js.map +1 -0
  285. package/dist/cssm/components/WriteBar/WriteBarTextarea/WriteBarTextarea.module.css +43 -0
  286. package/dist/cssm/helpers/math.js +6 -0
  287. package/dist/cssm/helpers/math.js.map +1 -1
  288. package/dist/cssm/hoc/withPlatform.js +3 -2
  289. package/dist/cssm/hoc/withPlatform.js.map +1 -1
  290. package/dist/cssm/hooks/useAdaptivityConditionalRender/types.js.map +1 -1
  291. package/dist/cssm/hooks/useAnimationFrame.js +40 -0
  292. package/dist/cssm/hooks/useAnimationFrame.js.map +1 -0
  293. package/dist/cssm/hooks/useAutoFocus.js +4 -1
  294. package/dist/cssm/hooks/useAutoFocus.js.map +1 -1
  295. package/dist/cssm/hooks/useColorScheme.js +3 -3
  296. package/dist/cssm/hooks/useColorScheme.js.map +1 -1
  297. package/dist/cssm/hooks/useConfigDirection.js +3 -3
  298. package/dist/cssm/hooks/useConfigDirection.js.map +1 -1
  299. package/dist/cssm/hooks/useDateInput.js +1 -2
  300. package/dist/cssm/hooks/useDateInput.js.map +1 -1
  301. package/dist/cssm/hooks/useFocusTrap/useAutoFocus.js +1 -0
  302. package/dist/cssm/hooks/useFocusTrap/useAutoFocus.js.map +1 -1
  303. package/dist/cssm/hooks/useFocusTrap/useFocusTrap.js +2 -0
  304. package/dist/cssm/hooks/useFocusTrap/useFocusTrap.js.map +1 -1
  305. package/dist/cssm/hooks/useFocusVisible.js +8 -13
  306. package/dist/cssm/hooks/useFocusVisible.js.map +1 -1
  307. package/dist/cssm/hooks/useFocusWithin.js +5 -4
  308. package/dist/cssm/hooks/useFocusWithin.js.map +1 -1
  309. package/dist/cssm/hooks/useGlobalEscKeyDown.js +17 -15
  310. package/dist/cssm/hooks/useGlobalEscKeyDown.js.map +1 -1
  311. package/dist/cssm/hooks/useGlobalOnClickOutside.js +6 -2
  312. package/dist/cssm/hooks/useGlobalOnClickOutside.js.map +1 -1
  313. package/dist/cssm/hooks/useKeyboardInputTracker.js +48 -41
  314. package/dist/cssm/hooks/useKeyboardInputTracker.js.map +1 -1
  315. package/dist/cssm/hooks/useLatestRef.js +13 -0
  316. package/dist/cssm/hooks/useLatestRef.js.map +1 -0
  317. package/dist/cssm/hooks/useLocale.js +3 -3
  318. package/dist/cssm/hooks/useLocale.js.map +1 -1
  319. package/dist/cssm/hooks/useMediaQueryMatch.js +1 -0
  320. package/dist/cssm/hooks/useMediaQueryMatch.js.map +1 -1
  321. package/dist/cssm/hooks/useMutationObserver.js +3 -3
  322. package/dist/cssm/hooks/useMutationObserver.js.map +1 -1
  323. package/dist/cssm/hooks/usePlatform.js +3 -3
  324. package/dist/cssm/hooks/usePlatform.js.map +1 -1
  325. package/dist/cssm/hooks/useResizeObserver.js +4 -6
  326. package/dist/cssm/hooks/useResizeObserver.js.map +1 -1
  327. package/dist/cssm/hooks/useSyncHTMLWithBaseVKUIClasses.js +2 -1
  328. package/dist/cssm/hooks/useSyncHTMLWithBaseVKUIClasses.js.map +1 -1
  329. package/dist/cssm/hooks/useSyncHTMLWithTokens.js +3 -1
  330. package/dist/cssm/hooks/useSyncHTMLWithTokens.js.map +1 -1
  331. package/dist/cssm/hooks/useWaitTransitionFinish.js +13 -15
  332. package/dist/cssm/hooks/useWaitTransitionFinish.js.map +1 -1
  333. package/dist/cssm/index.js +1 -0
  334. package/dist/cssm/index.js.map +1 -1
  335. package/dist/cssm/lib/array.js +18 -0
  336. package/dist/cssm/lib/array.js.map +1 -0
  337. package/dist/cssm/lib/curve.js +21 -0
  338. package/dist/cssm/lib/curve.js.map +1 -0
  339. package/dist/cssm/lib/dom.js +5 -2
  340. package/dist/cssm/lib/dom.js.map +1 -1
  341. package/dist/cssm/lib/floating/useFloatingWithInteractions/useFloatingWithInteractions.js +4 -4
  342. package/dist/cssm/lib/floating/useFloatingWithInteractions/useFloatingWithInteractions.js.map +1 -1
  343. package/dist/cssm/lib/fx.js +4 -55
  344. package/dist/cssm/lib/fx.js.map +1 -1
  345. package/dist/cssm/lib/layouts/index.js.map +1 -1
  346. package/dist/cssm/lib/layouts/layoutProps.js +11 -0
  347. package/dist/cssm/lib/layouts/layoutProps.js.map +1 -1
  348. package/dist/cssm/lib/layouts/resolveLayoutProps.js +13 -11
  349. package/dist/cssm/lib/layouts/resolveLayoutProps.js.map +1 -1
  350. package/dist/cssm/lib/layouts/types.js.map +1 -1
  351. package/dist/cssm/lib/material/shapes/Shape.js +18 -0
  352. package/dist/cssm/lib/material/shapes/Shape.js.map +1 -0
  353. package/dist/cssm/lib/material/shapes/shapes.js +2250 -0
  354. package/dist/cssm/lib/material/shapes/shapes.js.map +1 -0
  355. package/dist/cssm/lib/math.js +31 -0
  356. package/dist/cssm/lib/math.js.map +1 -0
  357. package/dist/cssm/lib/svg/path/approximate.js +57 -0
  358. package/dist/cssm/lib/svg/path/approximate.js.map +1 -0
  359. package/dist/cssm/lib/svg/path/interpolate.js +121 -0
  360. package/dist/cssm/lib/svg/path/interpolate.js.map +1 -0
  361. package/dist/cssm/lib/svg/path/path.js +50 -0
  362. package/dist/cssm/lib/svg/path/path.js.map +1 -0
  363. package/dist/cssm/lib/svg/path/point.js +3 -0
  364. package/dist/cssm/lib/svg/path/point.js.map +1 -0
  365. package/dist/cssm/lib/svg/path/transform.js +110 -0
  366. package/dist/cssm/lib/svg/path/transform.js.map +1 -0
  367. package/dist/cssm/lib/tokens/useTokenClassName.js +4 -1
  368. package/dist/cssm/lib/tokens/useTokenClassName.js.map +1 -1
  369. package/dist/cssm/lib/touch/UIPanGestureRecognizer.js +2 -2
  370. package/dist/cssm/lib/touch/UIPanGestureRecognizer.js.map +1 -1
  371. package/dist/cssm/styles/layout.css +273 -0
  372. package/dist/cssm/types.js +1 -4
  373. package/dist/cssm/types.js.map +1 -1
  374. package/dist/helpers/math.d.ts +4 -0
  375. package/dist/helpers/math.d.ts.map +1 -1
  376. package/dist/helpers/math.js +6 -0
  377. package/dist/helpers/math.js.map +1 -1
  378. package/dist/hoc/withPlatform.d.ts +1 -1
  379. package/dist/hoc/withPlatform.d.ts.map +1 -1
  380. package/dist/hoc/withPlatform.js +3 -2
  381. package/dist/hoc/withPlatform.js.map +1 -1
  382. package/dist/hooks/useAdaptivityConditionalRender/types.d.ts +2 -2
  383. package/dist/hooks/useAdaptivityConditionalRender/types.js.map +1 -1
  384. package/dist/hooks/useAnimationFrame.d.ts +16 -0
  385. package/dist/hooks/useAnimationFrame.d.ts.map +1 -0
  386. package/dist/hooks/useAnimationFrame.js +40 -0
  387. package/dist/hooks/useAnimationFrame.js.map +1 -0
  388. package/dist/hooks/useAutoFocus.js +4 -1
  389. package/dist/hooks/useAutoFocus.js.map +1 -1
  390. package/dist/hooks/useColorScheme.d.ts.map +1 -1
  391. package/dist/hooks/useColorScheme.js +3 -3
  392. package/dist/hooks/useColorScheme.js.map +1 -1
  393. package/dist/hooks/useConfigDirection.d.ts.map +1 -1
  394. package/dist/hooks/useConfigDirection.js +3 -3
  395. package/dist/hooks/useConfigDirection.js.map +1 -1
  396. package/dist/hooks/useDateInput.d.ts.map +1 -1
  397. package/dist/hooks/useDateInput.js +1 -2
  398. package/dist/hooks/useDateInput.js.map +1 -1
  399. package/dist/hooks/useFocusTrap/useAutoFocus.js +1 -0
  400. package/dist/hooks/useFocusTrap/useAutoFocus.js.map +1 -1
  401. package/dist/hooks/useFocusTrap/useFocusTrap.d.ts.map +1 -1
  402. package/dist/hooks/useFocusTrap/useFocusTrap.js +2 -0
  403. package/dist/hooks/useFocusTrap/useFocusTrap.js.map +1 -1
  404. package/dist/hooks/useFocusVisible.d.ts.map +1 -1
  405. package/dist/hooks/useFocusVisible.js +8 -13
  406. package/dist/hooks/useFocusVisible.js.map +1 -1
  407. package/dist/hooks/useFocusWithin.d.ts.map +1 -1
  408. package/dist/hooks/useFocusWithin.js +5 -4
  409. package/dist/hooks/useFocusWithin.js.map +1 -1
  410. package/dist/hooks/useGlobalEscKeyDown.d.ts.map +1 -1
  411. package/dist/hooks/useGlobalEscKeyDown.js +17 -15
  412. package/dist/hooks/useGlobalEscKeyDown.js.map +1 -1
  413. package/dist/hooks/useGlobalOnClickOutside.d.ts.map +1 -1
  414. package/dist/hooks/useGlobalOnClickOutside.js +6 -2
  415. package/dist/hooks/useGlobalOnClickOutside.js.map +1 -1
  416. package/dist/hooks/useKeyboardInputTracker.d.ts +1 -19
  417. package/dist/hooks/useKeyboardInputTracker.d.ts.map +1 -1
  418. package/dist/hooks/useKeyboardInputTracker.js +48 -41
  419. package/dist/hooks/useKeyboardInputTracker.js.map +1 -1
  420. package/dist/hooks/useLatestRef.d.ts +3 -0
  421. package/dist/hooks/useLatestRef.d.ts.map +1 -0
  422. package/dist/hooks/useLatestRef.js +13 -0
  423. package/dist/hooks/useLatestRef.js.map +1 -0
  424. package/dist/hooks/useLocale.d.ts.map +1 -1
  425. package/dist/hooks/useLocale.js +3 -3
  426. package/dist/hooks/useLocale.js.map +1 -1
  427. package/dist/hooks/useMediaQueryMatch.js +1 -0
  428. package/dist/hooks/useMediaQueryMatch.js.map +1 -1
  429. package/dist/hooks/useMutationObserver.d.ts +1 -2
  430. package/dist/hooks/useMutationObserver.d.ts.map +1 -1
  431. package/dist/hooks/useMutationObserver.js +3 -3
  432. package/dist/hooks/useMutationObserver.js.map +1 -1
  433. package/dist/hooks/usePlatform.d.ts.map +1 -1
  434. package/dist/hooks/usePlatform.js +3 -3
  435. package/dist/hooks/usePlatform.js.map +1 -1
  436. package/dist/hooks/useResizeObserver.d.ts.map +1 -1
  437. package/dist/hooks/useResizeObserver.js +4 -6
  438. package/dist/hooks/useResizeObserver.js.map +1 -1
  439. package/dist/hooks/useSyncHTMLWithBaseVKUIClasses.js +2 -1
  440. package/dist/hooks/useSyncHTMLWithBaseVKUIClasses.js.map +1 -1
  441. package/dist/hooks/useSyncHTMLWithTokens.js +3 -1
  442. package/dist/hooks/useSyncHTMLWithTokens.js.map +1 -1
  443. package/dist/hooks/useWaitTransitionFinish.d.ts.map +1 -1
  444. package/dist/hooks/useWaitTransitionFinish.js +13 -15
  445. package/dist/hooks/useWaitTransitionFinish.js.map +1 -1
  446. package/dist/index.d.ts +1 -0
  447. package/dist/index.d.ts.map +1 -1
  448. package/dist/index.js +1 -0
  449. package/dist/index.js.map +1 -1
  450. package/dist/lib/array.d.ts +17 -0
  451. package/dist/lib/array.d.ts.map +1 -0
  452. package/dist/lib/array.js +18 -0
  453. package/dist/lib/array.js.map +1 -0
  454. package/dist/lib/curve.d.ts +9 -0
  455. package/dist/lib/curve.d.ts.map +1 -0
  456. package/dist/lib/curve.js +21 -0
  457. package/dist/lib/curve.js.map +1 -0
  458. package/dist/lib/dom.d.ts +2 -1
  459. package/dist/lib/dom.d.ts.map +1 -1
  460. package/dist/lib/dom.js +5 -2
  461. package/dist/lib/dom.js.map +1 -1
  462. package/dist/lib/floating/useFloatingWithInteractions/useFloatingWithInteractions.d.ts.map +1 -1
  463. package/dist/lib/floating/useFloatingWithInteractions/useFloatingWithInteractions.js +4 -4
  464. package/dist/lib/floating/useFloatingWithInteractions/useFloatingWithInteractions.js.map +1 -1
  465. package/dist/lib/fx.d.ts +1 -8
  466. package/dist/lib/fx.d.ts.map +1 -1
  467. package/dist/lib/fx.js +4 -55
  468. package/dist/lib/fx.js.map +1 -1
  469. package/dist/lib/layouts/index.d.ts +1 -1
  470. package/dist/lib/layouts/index.d.ts.map +1 -1
  471. package/dist/lib/layouts/index.js.map +1 -1
  472. package/dist/lib/layouts/layoutProps.d.ts +7 -0
  473. package/dist/lib/layouts/layoutProps.d.ts.map +1 -1
  474. package/dist/lib/layouts/layoutProps.js +11 -0
  475. package/dist/lib/layouts/layoutProps.js.map +1 -1
  476. package/dist/lib/layouts/resolveLayoutProps.d.ts.map +1 -1
  477. package/dist/lib/layouts/resolveLayoutProps.js +13 -11
  478. package/dist/lib/layouts/resolveLayoutProps.js.map +1 -1
  479. package/dist/lib/layouts/types.d.ts +29 -0
  480. package/dist/lib/layouts/types.d.ts.map +1 -1
  481. package/dist/lib/layouts/types.js.map +1 -1
  482. package/dist/lib/material/shapes/Shape.d.ts +8 -0
  483. package/dist/lib/material/shapes/Shape.d.ts.map +1 -0
  484. package/dist/lib/material/shapes/Shape.js +18 -0
  485. package/dist/lib/material/shapes/Shape.js.map +1 -0
  486. package/dist/lib/material/shapes/shapes.d.ts +43 -0
  487. package/dist/lib/material/shapes/shapes.d.ts.map +1 -0
  488. package/dist/lib/material/shapes/shapes.js +2250 -0
  489. package/dist/lib/material/shapes/shapes.js.map +1 -0
  490. package/dist/lib/math.d.ts +23 -0
  491. package/dist/lib/math.d.ts.map +1 -0
  492. package/dist/lib/math.js +31 -0
  493. package/dist/lib/math.js.map +1 -0
  494. package/dist/lib/svg/path/approximate.d.ts +21 -0
  495. package/dist/lib/svg/path/approximate.d.ts.map +1 -0
  496. package/dist/lib/svg/path/approximate.js +57 -0
  497. package/dist/lib/svg/path/approximate.js.map +1 -0
  498. package/dist/lib/svg/path/interpolate.d.ts +5 -0
  499. package/dist/lib/svg/path/interpolate.d.ts.map +1 -0
  500. package/dist/lib/svg/path/interpolate.js +121 -0
  501. package/dist/lib/svg/path/interpolate.js.map +1 -0
  502. package/dist/lib/svg/path/path.d.ts +48 -0
  503. package/dist/lib/svg/path/path.d.ts.map +1 -0
  504. package/dist/lib/svg/path/path.js +50 -0
  505. package/dist/lib/svg/path/path.js.map +1 -0
  506. package/dist/lib/svg/path/point.d.ts +3 -0
  507. package/dist/lib/svg/path/point.d.ts.map +1 -0
  508. package/dist/lib/svg/path/point.js +3 -0
  509. package/dist/lib/svg/path/point.js.map +1 -0
  510. package/dist/lib/svg/path/transform.d.ts +64 -0
  511. package/dist/lib/svg/path/transform.d.ts.map +1 -0
  512. package/dist/lib/svg/path/transform.js +110 -0
  513. package/dist/lib/svg/path/transform.js.map +1 -0
  514. package/dist/lib/tokens/useTokenClassName.d.ts.map +1 -1
  515. package/dist/lib/tokens/useTokenClassName.js +4 -1
  516. package/dist/lib/tokens/useTokenClassName.js.map +1 -1
  517. package/dist/lib/touch/UIPanGestureRecognizer.d.ts.map +1 -1
  518. package/dist/lib/touch/UIPanGestureRecognizer.js +2 -2
  519. package/dist/lib/touch/UIPanGestureRecognizer.js.map +1 -1
  520. package/dist/types.d.ts +9 -0
  521. package/dist/types.d.ts.map +1 -1
  522. package/dist/types.js +1 -4
  523. package/dist/types.js.map +1 -1
  524. package/dist/vkui.css +1 -1
  525. package/dist/vkui.css.map +1 -1
  526. package/package.json +7 -6
  527. package/src/components/ActionSheet/ActionSheet.tsx +6 -3
  528. package/src/components/AdaptivityProvider/AdaptivityContext.tsx +3 -3
  529. package/src/components/AdaptivityProvider/AdaptivityProvider.tsx +2 -2
  530. package/src/components/AppRoot/AppRoot.tsx +1 -14
  531. package/src/components/AppRoot/AppRootContext.ts +0 -2
  532. package/src/components/Calendar/Calendar.tsx +2 -2
  533. package/src/components/CalendarDay/CalendarDay.tsx +4 -2
  534. package/src/components/CalendarDays/CalendarDays.tsx +2 -2
  535. package/src/components/CalendarHeader/CalendarHeader.tsx +4 -2
  536. package/src/components/CalendarRange/CalendarRange.tsx +2 -2
  537. package/src/components/CalendarTime/CalendarTime.module.css +38 -0
  538. package/src/components/CalendarTime/CalendarTime.module.css.d.ts.map +1 -1
  539. package/src/components/CalendarTime/CalendarTime.tsx +68 -55
  540. package/src/components/CalendarTime/CalendarTimePicker.tsx +148 -62
  541. package/src/components/CalendarTime/ComboBox.tsx +189 -0
  542. package/src/components/CardScroll/CardScroll.tsx +6 -5
  543. package/src/components/CarouselBase/CarouselBase.tsx +2 -1
  544. package/src/components/ChipsSelect/useChipsSelect.ts +1 -0
  545. package/src/components/ConfigProvider/ConfigProvider.tsx +6 -3
  546. package/src/components/ConfigProvider/ConfigProviderOverride.tsx +2 -1
  547. package/src/components/ConfigProvider/ConfigProviderSubContexts.tsx +43 -0
  548. package/src/components/ContentBadge/ContentBadge.module.css +84 -91
  549. package/src/components/ContentBadge/ContentBadge.module.css.d.ts.map +1 -1
  550. package/src/components/ContentBadge/ContentBadge.tsx +73 -5
  551. package/src/components/CustomSelect/CustomSelect.tsx +19 -10
  552. package/src/components/DateInput/DateInput.tsx +3 -3
  553. package/src/components/DateRangeInput/DateRangeInput.tsx +2 -2
  554. package/src/components/Epic/ScrollSaver.tsx +1 -0
  555. package/src/components/FixedLayout/ParentWidthWrapper.tsx +48 -0
  556. package/src/components/Flex/Flex.tsx +11 -6
  557. package/src/components/GridAvatar/GridAvatar.module.css +1 -1
  558. package/src/components/GridAvatar/GridAvatar.module.css.d.ts.map +1 -1
  559. package/src/components/ImageBase/ImageBaseFloatElement/ImageBaseFloatElement.tsx +1 -1
  560. package/src/components/NativeSelect/NativeSelect.tsx +4 -2
  561. package/src/components/NavTransitionContext/NavTransitionContext.tsx +5 -1
  562. package/src/components/OnboardingTooltip/OnboardingTooltip.tsx +3 -6
  563. package/src/components/PanelHeader/PanelHeader.tsx +1 -1
  564. package/src/components/Popper/Popper.tsx +8 -5
  565. package/src/components/PullToRefresh/PullToRefresh.module.css +1 -1
  566. package/src/components/PullToRefresh/PullToRefresh.tsx +10 -3
  567. package/src/components/Root/Root.tsx +60 -59
  568. package/src/components/SimpleGrid/SimpleGrid.tsx +25 -11
  569. package/src/components/Skeleton/Skeleton.tsx +6 -4
  570. package/src/components/Snackbar/Snackbar.tsx +6 -3
  571. package/src/components/Spacing/Spacing.tsx +1 -1
  572. package/src/components/Spinner/ExpressiveSpinner/ExpressiveSpinner.module.css +13 -0
  573. package/src/components/Spinner/ExpressiveSpinner/ExpressiveSpinner.module.css.d.ts.map +1 -0
  574. package/src/components/Spinner/ExpressiveSpinner/ExpressiveSpinner.tsx +73 -0
  575. package/src/components/Spinner/ExpressiveSpinner/icons.tsx +104 -0
  576. package/src/components/Spinner/SvgIcon.tsx +31 -0
  577. package/src/components/Spinner/icons.tsx +10 -13
  578. package/src/components/SplitLayout/SplitLayout.tsx +3 -3
  579. package/src/components/TabsItem/TabsItem.tsx +4 -5
  580. package/src/components/Tappable/Tappable.tsx +2 -2
  581. package/src/components/View/View.tsx +83 -89
  582. package/src/components/View/ViewInfinite.tsx +65 -69
  583. package/src/components/WriteBar/WriteBar.tsx +25 -59
  584. package/src/components/WriteBar/WriteBarBeforeOrAfter/WriteBarBeforeOrAfter.module.css +12 -0
  585. package/src/components/WriteBar/WriteBarBeforeOrAfter/WriteBarBeforeOrAfter.module.css.d.ts.map +1 -0
  586. package/src/components/WriteBar/WriteBarBeforeOrAfter/WriteBarBeforeOrAfter.tsx +20 -0
  587. package/src/components/WriteBar/WriteBarFormField/WriteBarFormField.module.css +18 -0
  588. package/src/components/WriteBar/WriteBarFormField/WriteBarFormField.module.css.d.ts.map +1 -0
  589. package/src/components/WriteBar/WriteBarFormField/WriteBarFormField.tsx +22 -0
  590. package/src/components/WriteBar/WriteBarFormField/WriteBarFormFieldInlineAfter/WriteBarFormFieldInlineAfter.module.css +3 -0
  591. package/src/components/WriteBar/WriteBarFormField/WriteBarFormFieldInlineAfter/WriteBarFormFieldInlineAfter.module.css.d.ts.map +1 -0
  592. package/src/components/WriteBar/WriteBarFormField/WriteBarFormFieldInlineAfter/WriteBarFormFieldInlineAfter.tsx +23 -0
  593. package/src/components/WriteBar/WriteBarRoot/WriteBarRoot.module.css +14 -0
  594. package/src/components/WriteBar/WriteBarRoot/WriteBarRoot.module.css.d.ts.map +1 -0
  595. package/src/components/WriteBar/WriteBarRoot/WriteBarRoot.tsx +31 -0
  596. package/src/components/WriteBar/WriteBarTextarea/WriteBarTextarea.module.css +42 -0
  597. package/src/components/WriteBar/WriteBarTextarea/WriteBarTextarea.module.css.d.ts.map +1 -0
  598. package/src/components/WriteBar/WriteBarTextarea/WriteBarTextarea.tsx +48 -0
  599. package/src/helpers/math.ts +8 -0
  600. package/src/hoc/withPlatform.tsx +3 -3
  601. package/src/hooks/useAdaptivityConditionalRender/types.ts +2 -2
  602. package/src/hooks/useAnimationFrame.tsx +42 -0
  603. package/src/hooks/useAutoFocus.ts +1 -1
  604. package/src/hooks/useColorScheme.ts +3 -4
  605. package/src/hooks/useConfigDirection.ts +3 -4
  606. package/src/hooks/useDateInput.ts +1 -2
  607. package/src/hooks/useFocusTrap/useAutoFocus.ts +1 -1
  608. package/src/hooks/useFocusTrap/useFocusTrap.tsx +2 -0
  609. package/src/hooks/useFocusVisible.ts +10 -18
  610. package/src/hooks/useFocusWithin.ts +26 -23
  611. package/src/hooks/useGlobalEscKeyDown.ts +12 -15
  612. package/src/hooks/useGlobalOnClickOutside.ts +5 -2
  613. package/src/hooks/useKeyboardInputTracker.ts +68 -55
  614. package/src/hooks/useLatestRef.ts +12 -0
  615. package/src/hooks/useLocale.ts +3 -4
  616. package/src/hooks/useMediaQueryMatch.ts +1 -1
  617. package/src/hooks/useMutationObserver.ts +2 -3
  618. package/src/hooks/usePlatform.ts +3 -4
  619. package/src/hooks/useResizeObserver.ts +4 -5
  620. package/src/hooks/useSyncHTMLWithBaseVKUIClasses.ts +1 -1
  621. package/src/hooks/useSyncHTMLWithTokens.ts +1 -1
  622. package/src/hooks/useWaitTransitionFinish.ts +15 -15
  623. package/src/index.ts +1 -0
  624. package/src/lib/array.ts +19 -0
  625. package/src/lib/curve.ts +36 -0
  626. package/src/lib/dom.tsx +10 -4
  627. package/src/lib/floating/useFloatingWithInteractions/useFloatingWithInteractions.ts +4 -5
  628. package/src/lib/fx.ts +5 -63
  629. package/src/lib/layouts/index.ts +1 -0
  630. package/src/lib/layouts/layoutProps.ts +8 -0
  631. package/src/lib/layouts/resolveLayoutProps.ts +19 -17
  632. package/src/lib/layouts/types.ts +29 -0
  633. package/src/lib/material/shapes/Shape.tsx +17 -0
  634. package/src/lib/material/shapes/shapes.ts +329 -0
  635. package/src/lib/math.ts +37 -0
  636. package/src/lib/svg/path/approximate.ts +81 -0
  637. package/src/lib/svg/path/interpolate.ts +151 -0
  638. package/src/lib/svg/path/path.ts +102 -0
  639. package/src/lib/svg/path/point.ts +2 -0
  640. package/src/lib/svg/path/transform.ts +147 -0
  641. package/src/lib/tokens/useTokenClassName.ts +7 -5
  642. package/src/lib/touch/UIPanGestureRecognizer.ts +2 -2
  643. package/src/types.ts +16 -0
  644. package/dist/cssm/components/WriteBar/WriteBar.module.css +0 -118
  645. package/dist/cssm/lib/floating/LockFloatingPosition/LockFloatingPosition.js +0 -6
  646. package/dist/cssm/lib/floating/LockFloatingPosition/LockFloatingPosition.js.map +0 -1
  647. package/dist/lib/floating/LockFloatingPosition/LockFloatingPosition.d.ts +0 -6
  648. package/dist/lib/floating/LockFloatingPosition/LockFloatingPosition.d.ts.map +0 -1
  649. package/dist/lib/floating/LockFloatingPosition/LockFloatingPosition.js +0 -6
  650. package/dist/lib/floating/LockFloatingPosition/LockFloatingPosition.js.map +0 -1
  651. package/src/components/WriteBar/WriteBar.module.css +0 -116
  652. package/src/components/WriteBar/WriteBar.module.css.d.ts.map +0 -1
  653. package/src/lib/floating/LockFloatingPosition/LockFloatingPosition.tsx +0 -6
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/hooks/useDateInput.ts"],"sourcesContent":["import { useCallback } from 'react';\nimport * as React from 'react';\nimport { useDOM } from '../lib/dom';\nimport { useBooleanState } from './useBooleanState';\n\nexport interface UseDateInputDependencies<T, D> {\n maxElement: number;\n refs: Array<React.RefObject<T | null>>;\n autoFocus?: boolean | undefined;\n disabled?: boolean | undefined;\n value?: D | null | undefined;\n elementsConfig: (index: number) => {\n length: number;\n min: number;\n max: number;\n };\n onInternalValueChange: (value: string[]) => void;\n getInternalValue: (value?: D | null | undefined) => string[];\n onClear: () => void;\n onCalendarOpenChanged?: ((opened: boolean) => void) | undefined;\n accessible?: boolean | undefined;\n}\n\nexport function useDateInput<T extends HTMLElement, D>({\n maxElement,\n refs,\n autoFocus,\n disabled,\n elementsConfig,\n onClear,\n onInternalValueChange,\n getInternalValue,\n value,\n onCalendarOpenChanged,\n accessible,\n}: UseDateInputDependencies<T, D>): {\n rootRef: React.RefObject<HTMLDivElement | null>;\n calendarRef: React.RefObject<HTMLDivElement | null>;\n open: boolean;\n openCalendar: () => void;\n closeCalendar: () => void;\n toggleCalendar: () => void;\n internalValue: string[];\n focusedElement: number | null;\n setFocusedElement: React.Dispatch<React.SetStateAction<number | null>>;\n handleKeyDown: (e: React.KeyboardEvent<HTMLSpanElement>) => void;\n clear: () => void;\n handleFieldEnter: () => void;\n removeFocusFromField: () => void;\n handleRestoreFocus: () => boolean;\n} {\n const { document } = useDOM();\n const [open, openCalendar, closeCalendar] = useBooleanState(false);\n const rootRef = React.useRef<HTMLDivElement | null>(null);\n const calendarRef = React.useRef<HTMLDivElement | null>(null);\n const [internalValue, setInternalValue] = React.useState<string[]>([]);\n const [focusedElement, setFocusedElement] = React.useState<number | null>(null);\n const isClickedOutsideRef = React.useRef(false);\n const { window } = useDOM();\n\n const handleRestoreFocus = React.useCallback(() => {\n // если календарь был закрыт кликом вне календаря\n // то FocusTrap возвращать фокус не должен\n return !isClickedOutsideRef.current;\n }, []);\n\n const _onCalendarClose = useCallback(() => {\n if (open) {\n closeCalendar();\n onCalendarOpenChanged?.(false);\n }\n }, [closeCalendar, onCalendarOpenChanged, open]);\n\n const _onCalendarOpen = useCallback(() => {\n if (!open) {\n openCalendar();\n onCalendarOpenChanged?.(true);\n if (accessible) {\n setFocusedElement(null);\n }\n isClickedOutsideRef.current = false;\n }\n }, [onCalendarOpenChanged, open, openCalendar, accessible]);\n\n const resetFocusedElement = React.useCallback(() => {\n if (focusedElement !== null) {\n setFocusedElement(null);\n window!.getSelection()?.removeAllRanges();\n setInternalValue(getInternalValue(value));\n }\n }, [focusedElement, getInternalValue, value, window]);\n\n const removeFocusFromField = React.useCallback(() => {\n resetFocusedElement();\n _onCalendarClose();\n }, [resetFocusedElement, _onCalendarClose]);\n\n const toggleCalendar = useCallback(() => {\n resetFocusedElement();\n if (open) {\n _onCalendarClose();\n } else {\n _onCalendarOpen();\n }\n }, [resetFocusedElement, open, _onCalendarClose, _onCalendarOpen]);\n\n const handleClickOutside = React.useCallback(\n (e: MouseEvent) => {\n if (\n !rootRef.current?.contains(e.target as Node | null) &&\n !calendarRef.current?.contains(e.target as Node | null)\n ) {\n isClickedOutsideRef.current = true;\n removeFocusFromField();\n }\n },\n [removeFocusFromField],\n );\n\n const selectFirst = React.useCallback(() => {\n if (focusedElement !== null) {\n return;\n }\n\n setFocusedElement(0);\n }, [focusedElement]);\n\n React.useEffect(() => {\n document!.addEventListener('click', handleClickOutside, {\n capture: true,\n });\n\n return () =>\n document!.removeEventListener('click', handleClickOutside, {\n capture: true,\n });\n }, [document, handleClickOutside]);\n\n React.useEffect(() => {\n setInternalValue(getInternalValue(value));\n }, [getInternalValue, value]);\n\n React.useEffect(() => {\n if (autoFocus) {\n selectFirst();\n }\n }, [autoFocus, selectFirst]);\n\n React.useEffect(() => {\n if (disabled || focusedElement === null) {\n return;\n }\n\n const range = window!.document.createRange();\n\n let element = refs[focusedElement].current;\n\n let timerId: ReturnType<typeof setTimeout>;\n if (element) {\n element.focus();\n if (!accessible) {\n _onCalendarOpen();\n }\n range.selectNodeContents(element as Node);\n\n // Fix для Firefox: setTimeout нужен чтобы отложить range selection на\n // какое-то время, иначе, при фокусе на InputLike\n // извне, контент визуально не будет выбран\n timerId = setTimeout(() => {\n const selection = window!.getSelection();\n selection?.removeAllRanges();\n selection?.addRange(range);\n }, 0);\n }\n\n return () => {\n clearTimeout(timerId);\n };\n }, [disabled, focusedElement, refs, window, _onCalendarOpen, accessible]);\n\n const clear = React.useCallback(() => {\n onClear?.();\n selectFirst();\n }, [onClear, selectFirst]);\n\n const handleFieldEnter = React.useCallback(() => {\n selectFirst();\n }, [selectFirst]);\n\n const handleKeyDown = React.useCallback(\n (e: React.KeyboardEvent<HTMLSpanElement>) => {\n if (focusedElement === null) {\n return;\n }\n\n const _value = [...internalValue];\n const config = elementsConfig(focusedElement);\n\n if (/^\\d+$/.test(e.key)) {\n if (_value[focusedElement].length >= config.length) {\n _value[focusedElement] = e.key;\n } else {\n _value[focusedElement] += e.key;\n if (_value[focusedElement].length >= config.length && focusedElement < maxElement) {\n setFocusedElement(focusedElement + 1);\n }\n }\n } else if (e.key === 'Backspace') {\n if (!_value[focusedElement]) {\n setFocusedElement(focusedElement <= 0 ? maxElement : focusedElement - 1);\n } else {\n _value[focusedElement] = _value[focusedElement].slice(0, -1);\n }\n } else if (e.key === 'ArrowDown' || e.key === 'Down') {\n let currentValue = Number(_value[focusedElement]);\n _value[focusedElement] = String(\n currentValue <= config.min ? config.max : currentValue - 1,\n ).padStart(config.length, '0');\n } else if (e.key === 'ArrowUp' || e.key === 'Up') {\n let currentValue = Number(_value[focusedElement]);\n _value[focusedElement] = String(\n currentValue >= config.max ? config.min : currentValue + 1,\n ).padStart(config.length, '0');\n } else if (e.key === 'ArrowLeft' || e.key === 'Left' || (e.key === 'Tab' && e.shiftKey)) {\n if (focusedElement <= 0) {\n if (e.key === 'Tab') {\n removeFocusFromField();\n }\n return;\n }\n setFocusedElement(focusedElement - 1);\n } else if (e.key === 'ArrowRight' || e.key === 'Right' || e.key === 'Tab') {\n if (focusedElement >= maxElement) {\n if (e.key === 'Tab') {\n removeFocusFromField();\n }\n return;\n }\n\n setFocusedElement(focusedElement + 1);\n } else if (e.key === 'Delete' || e.key === 'Del') {\n _value[focusedElement] = '';\n } else if (e.key === ' ') {\n e.preventDefault();\n _onCalendarOpen();\n return;\n } else {\n return;\n }\n\n e.preventDefault();\n setInternalValue(_value);\n onInternalValueChange(_value);\n },\n [\n _onCalendarOpen,\n removeFocusFromField,\n elementsConfig,\n focusedElement,\n internalValue,\n maxElement,\n onInternalValueChange,\n ],\n );\n\n return {\n rootRef,\n calendarRef,\n open,\n openCalendar: _onCalendarOpen,\n closeCalendar: _onCalendarClose,\n toggleCalendar,\n internalValue,\n focusedElement,\n setFocusedElement,\n handleKeyDown,\n clear,\n handleFieldEnter,\n removeFocusFromField,\n handleRestoreFocus,\n };\n}\n"],"names":["useCallback","React","useDOM","useBooleanState","useDateInput","maxElement","refs","autoFocus","disabled","elementsConfig","onClear","onInternalValueChange","getInternalValue","value","onCalendarOpenChanged","accessible","document","open","openCalendar","closeCalendar","rootRef","useRef","calendarRef","internalValue","setInternalValue","useState","focusedElement","setFocusedElement","isClickedOutsideRef","window","handleRestoreFocus","current","_onCalendarClose","_onCalendarOpen","resetFocusedElement","getSelection","removeAllRanges","removeFocusFromField","toggleCalendar","handleClickOutside","e","contains","target","selectFirst","useEffect","addEventListener","capture","removeEventListener","range","createRange","element","timerId","focus","selectNodeContents","setTimeout","selection","addRange","clearTimeout","clear","handleFieldEnter","handleKeyDown","_value","config","test","key","length","slice","currentValue","Number","String","min","max","padStart","shiftKey","preventDefault"],"mappings":"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"}
1
+ {"version":3,"sources":["../../src/hooks/useDateInput.ts"],"sourcesContent":["import { useCallback } from 'react';\nimport * as React from 'react';\nimport { useDOM } from '../lib/dom';\nimport { useBooleanState } from './useBooleanState';\n\nexport interface UseDateInputDependencies<T, D> {\n maxElement: number;\n refs: Array<React.RefObject<T | null>>;\n autoFocus?: boolean | undefined;\n disabled?: boolean | undefined;\n value?: D | null | undefined;\n elementsConfig: (index: number) => {\n length: number;\n min: number;\n max: number;\n };\n onInternalValueChange: (value: string[]) => void;\n getInternalValue: (value?: D | null | undefined) => string[];\n onClear: () => void;\n onCalendarOpenChanged?: ((opened: boolean) => void) | undefined;\n accessible?: boolean | undefined;\n}\n\nexport function useDateInput<T extends HTMLElement, D>({\n maxElement,\n refs,\n autoFocus,\n disabled,\n elementsConfig,\n onClear,\n onInternalValueChange,\n getInternalValue,\n value,\n onCalendarOpenChanged,\n accessible,\n}: UseDateInputDependencies<T, D>): {\n rootRef: React.RefObject<HTMLDivElement | null>;\n calendarRef: React.RefObject<HTMLDivElement | null>;\n open: boolean;\n openCalendar: () => void;\n closeCalendar: () => void;\n toggleCalendar: () => void;\n internalValue: string[];\n focusedElement: number | null;\n setFocusedElement: React.Dispatch<React.SetStateAction<number | null>>;\n handleKeyDown: (e: React.KeyboardEvent<HTMLSpanElement>) => void;\n clear: () => void;\n handleFieldEnter: () => void;\n removeFocusFromField: () => void;\n handleRestoreFocus: () => boolean;\n} {\n const { document, window } = useDOM();\n const [open, openCalendar, closeCalendar] = useBooleanState(false);\n const rootRef = React.useRef<HTMLDivElement | null>(null);\n const calendarRef = React.useRef<HTMLDivElement | null>(null);\n const [internalValue, setInternalValue] = React.useState<string[]>([]);\n const [focusedElement, setFocusedElement] = React.useState<number | null>(null);\n const isClickedOutsideRef = React.useRef(false);\n\n const handleRestoreFocus = React.useCallback(() => {\n // если календарь был закрыт кликом вне календаря\n // то FocusTrap возвращать фокус не должен\n return !isClickedOutsideRef.current;\n }, []);\n\n const _onCalendarClose = useCallback(() => {\n if (open) {\n closeCalendar();\n onCalendarOpenChanged?.(false);\n }\n }, [closeCalendar, onCalendarOpenChanged, open]);\n\n const _onCalendarOpen = useCallback(() => {\n if (!open) {\n openCalendar();\n onCalendarOpenChanged?.(true);\n if (accessible) {\n setFocusedElement(null);\n }\n isClickedOutsideRef.current = false;\n }\n }, [onCalendarOpenChanged, open, openCalendar, accessible]);\n\n const resetFocusedElement = React.useCallback(() => {\n if (focusedElement !== null) {\n setFocusedElement(null);\n window!.getSelection()?.removeAllRanges();\n setInternalValue(getInternalValue(value));\n }\n }, [focusedElement, getInternalValue, value, window]);\n\n const removeFocusFromField = React.useCallback(() => {\n resetFocusedElement();\n _onCalendarClose();\n }, [resetFocusedElement, _onCalendarClose]);\n\n const toggleCalendar = useCallback(() => {\n resetFocusedElement();\n if (open) {\n _onCalendarClose();\n } else {\n _onCalendarOpen();\n }\n }, [resetFocusedElement, open, _onCalendarClose, _onCalendarOpen]);\n\n const handleClickOutside = React.useCallback(\n (e: MouseEvent) => {\n if (\n !rootRef.current?.contains(e.target as Node | null) &&\n !calendarRef.current?.contains(e.target as Node | null)\n ) {\n isClickedOutsideRef.current = true;\n removeFocusFromField();\n }\n },\n [removeFocusFromField],\n );\n\n const selectFirst = React.useCallback(() => {\n if (focusedElement !== null) {\n return;\n }\n\n setFocusedElement(0);\n }, [focusedElement]);\n\n React.useEffect(() => {\n document!.addEventListener('click', handleClickOutside, {\n capture: true,\n });\n\n return () =>\n document!.removeEventListener('click', handleClickOutside, {\n capture: true,\n });\n }, [document, handleClickOutside]);\n\n React.useEffect(() => {\n setInternalValue(getInternalValue(value));\n }, [getInternalValue, value]);\n\n React.useEffect(() => {\n if (autoFocus) {\n selectFirst();\n }\n }, [autoFocus, selectFirst]);\n\n React.useEffect(() => {\n if (disabled || focusedElement === null) {\n return;\n }\n\n const range = window!.document.createRange();\n\n let element = refs[focusedElement].current;\n\n let timerId: ReturnType<typeof setTimeout>;\n if (element) {\n element.focus();\n if (!accessible) {\n _onCalendarOpen();\n }\n range.selectNodeContents(element as Node);\n\n // Fix для Firefox: setTimeout нужен чтобы отложить range selection на\n // какое-то время, иначе, при фокусе на InputLike\n // извне, контент визуально не будет выбран\n timerId = setTimeout(() => {\n const selection = window!.getSelection();\n selection?.removeAllRanges();\n selection?.addRange(range);\n }, 0);\n }\n\n return () => {\n clearTimeout(timerId);\n };\n }, [disabled, focusedElement, refs, window, _onCalendarOpen, accessible]);\n\n const clear = React.useCallback(() => {\n onClear?.();\n selectFirst();\n }, [onClear, selectFirst]);\n\n const handleFieldEnter = React.useCallback(() => {\n selectFirst();\n }, [selectFirst]);\n\n const handleKeyDown = React.useCallback(\n (e: React.KeyboardEvent<HTMLSpanElement>) => {\n if (focusedElement === null) {\n return;\n }\n\n const _value = [...internalValue];\n const config = elementsConfig(focusedElement);\n\n if (/^\\d+$/.test(e.key)) {\n if (_value[focusedElement].length >= config.length) {\n _value[focusedElement] = e.key;\n } else {\n _value[focusedElement] += e.key;\n if (_value[focusedElement].length >= config.length && focusedElement < maxElement) {\n setFocusedElement(focusedElement + 1);\n }\n }\n } else if (e.key === 'Backspace') {\n if (!_value[focusedElement]) {\n setFocusedElement(focusedElement <= 0 ? maxElement : focusedElement - 1);\n } else {\n _value[focusedElement] = _value[focusedElement].slice(0, -1);\n }\n } else if (e.key === 'ArrowDown' || e.key === 'Down') {\n let currentValue = Number(_value[focusedElement]);\n _value[focusedElement] = String(\n currentValue <= config.min ? config.max : currentValue - 1,\n ).padStart(config.length, '0');\n } else if (e.key === 'ArrowUp' || e.key === 'Up') {\n let currentValue = Number(_value[focusedElement]);\n _value[focusedElement] = String(\n currentValue >= config.max ? config.min : currentValue + 1,\n ).padStart(config.length, '0');\n } else if (e.key === 'ArrowLeft' || e.key === 'Left' || (e.key === 'Tab' && e.shiftKey)) {\n if (focusedElement <= 0) {\n if (e.key === 'Tab') {\n removeFocusFromField();\n }\n return;\n }\n setFocusedElement(focusedElement - 1);\n } else if (e.key === 'ArrowRight' || e.key === 'Right' || e.key === 'Tab') {\n if (focusedElement >= maxElement) {\n if (e.key === 'Tab') {\n removeFocusFromField();\n }\n return;\n }\n\n setFocusedElement(focusedElement + 1);\n } else if (e.key === 'Delete' || e.key === 'Del') {\n _value[focusedElement] = '';\n } else if (e.key === ' ') {\n e.preventDefault();\n _onCalendarOpen();\n return;\n } else {\n return;\n }\n\n e.preventDefault();\n setInternalValue(_value);\n onInternalValueChange(_value);\n },\n [\n _onCalendarOpen,\n removeFocusFromField,\n elementsConfig,\n focusedElement,\n internalValue,\n maxElement,\n onInternalValueChange,\n ],\n );\n\n return {\n rootRef,\n calendarRef,\n open,\n openCalendar: _onCalendarOpen,\n closeCalendar: _onCalendarClose,\n toggleCalendar,\n internalValue,\n focusedElement,\n setFocusedElement,\n handleKeyDown,\n clear,\n handleFieldEnter,\n removeFocusFromField,\n handleRestoreFocus,\n };\n}\n"],"names":["useCallback","React","useDOM","useBooleanState","useDateInput","maxElement","refs","autoFocus","disabled","elementsConfig","onClear","onInternalValueChange","getInternalValue","value","onCalendarOpenChanged","accessible","document","window","open","openCalendar","closeCalendar","rootRef","useRef","calendarRef","internalValue","setInternalValue","useState","focusedElement","setFocusedElement","isClickedOutsideRef","handleRestoreFocus","current","_onCalendarClose","_onCalendarOpen","resetFocusedElement","getSelection","removeAllRanges","removeFocusFromField","toggleCalendar","handleClickOutside","e","contains","target","selectFirst","useEffect","addEventListener","capture","removeEventListener","range","createRange","element","timerId","focus","selectNodeContents","setTimeout","selection","addRange","clearTimeout","clear","handleFieldEnter","handleKeyDown","_value","config","test","key","length","slice","currentValue","Number","String","min","max","padStart","shiftKey","preventDefault"],"mappings":"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"}
@@ -20,6 +20,7 @@ export const useAutoFocus = (ref, { autoFocus, disabled, mount, autoFocusDelay,
20
20
  }, autoFocusDelay);
21
21
  return ()=>clearTimeout(timeoutId);
22
22
  }, [
23
+ ref,
23
24
  autoFocus,
24
25
  autoFocusDelay,
25
26
  disabled,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/hooks/useFocusTrap/useAutoFocus.ts"],"sourcesContent":["import type { RefObject } from 'react';\nimport { contains, getActiveElementByAnotherElement } from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport type { RequiredFields } from '../../types';\nimport type { UseFocusTrapProps } from './useFocusTrap.tsx';\n\nexport const useAutoFocus = (\n ref: RefObject<HTMLElement | null>,\n {\n autoFocus,\n disabled,\n mount,\n autoFocusDelay,\n focusFirst,\n }: RequiredFields<UseFocusTrapProps, 'autoFocus' | 'disabled' | 'mount' | 'autoFocusDelay'> & {\n focusFirst: () => void;\n },\n) => {\n useIsomorphicLayoutEffect(\n function handleAutoFocus() {\n if (!ref.current || !autoFocus || disabled || !mount) {\n return;\n }\n\n const timeoutId = setTimeout(() => {\n if (!ref.current) {\n return;\n }\n\n const activeElement = getActiveElementByAnotherElement(ref.current);\n if (!contains(ref.current, activeElement)) {\n if (autoFocus === 'root') {\n ref.current.focus();\n } else {\n focusFirst();\n }\n }\n }, autoFocusDelay);\n\n return () => clearTimeout(timeoutId);\n },\n [autoFocus, autoFocusDelay, disabled, mount, focusFirst],\n );\n};\n"],"names":["contains","getActiveElementByAnotherElement","useIsomorphicLayoutEffect","useAutoFocus","ref","autoFocus","disabled","mount","autoFocusDelay","focusFirst","handleAutoFocus","current","timeoutId","setTimeout","activeElement","focus","clearTimeout"],"mappings":"AACA,SAASA,QAAQ,EAAEC,gCAAgC,QAAQ,mBAAgB;AAC3E,SAASC,yBAAyB,QAAQ,yCAAsC;AAIhF,OAAO,MAAMC,eAAe,CAC1BC,KACA,EACEC,SAAS,EACTC,QAAQ,EACRC,KAAK,EACLC,cAAc,EACdC,UAAU,EAGX;IAEDP,0BACE,SAASQ;QACP,IAAI,CAACN,IAAIO,OAAO,IAAI,CAACN,aAAaC,YAAY,CAACC,OAAO;YACpD;QACF;QAEA,MAAMK,YAAYC,WAAW;YAC3B,IAAI,CAACT,IAAIO,OAAO,EAAE;gBAChB;YACF;YAEA,MAAMG,gBAAgBb,iCAAiCG,IAAIO,OAAO;YAClE,IAAI,CAACX,SAASI,IAAIO,OAAO,EAAEG,gBAAgB;gBACzC,IAAIT,cAAc,QAAQ;oBACxBD,IAAIO,OAAO,CAACI,KAAK;gBACnB,OAAO;oBACLN;gBACF;YACF;QACF,GAAGD;QAEH,OAAO,IAAMQ,aAAaJ;IAC5B,GACA;QAACP;QAAWG;QAAgBF;QAAUC;QAAOE;KAAW;AAE5D,EAAE"}
1
+ {"version":3,"sources":["../../../src/hooks/useFocusTrap/useAutoFocus.ts"],"sourcesContent":["import type { RefObject } from 'react';\nimport { contains, getActiveElementByAnotherElement } from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport type { RequiredFields } from '../../types';\nimport type { UseFocusTrapProps } from './useFocusTrap.tsx';\n\nexport const useAutoFocus = (\n ref: RefObject<HTMLElement | null>,\n {\n autoFocus,\n disabled,\n mount,\n autoFocusDelay,\n focusFirst,\n }: RequiredFields<UseFocusTrapProps, 'autoFocus' | 'disabled' | 'mount' | 'autoFocusDelay'> & {\n focusFirst: () => void;\n },\n) => {\n useIsomorphicLayoutEffect(\n function handleAutoFocus() {\n if (!ref.current || !autoFocus || disabled || !mount) {\n return;\n }\n\n const timeoutId = setTimeout(() => {\n if (!ref.current) {\n return;\n }\n\n const activeElement = getActiveElementByAnotherElement(ref.current);\n if (!contains(ref.current, activeElement)) {\n if (autoFocus === 'root') {\n ref.current.focus();\n } else {\n focusFirst();\n }\n }\n }, autoFocusDelay);\n\n return () => clearTimeout(timeoutId);\n },\n [ref, autoFocus, autoFocusDelay, disabled, mount, focusFirst],\n );\n};\n"],"names":["contains","getActiveElementByAnotherElement","useIsomorphicLayoutEffect","useAutoFocus","ref","autoFocus","disabled","mount","autoFocusDelay","focusFirst","handleAutoFocus","current","timeoutId","setTimeout","activeElement","focus","clearTimeout"],"mappings":"AACA,SAASA,QAAQ,EAAEC,gCAAgC,QAAQ,mBAAgB;AAC3E,SAASC,yBAAyB,QAAQ,yCAAsC;AAIhF,OAAO,MAAMC,eAAe,CAC1BC,KACA,EACEC,SAAS,EACTC,QAAQ,EACRC,KAAK,EACLC,cAAc,EACdC,UAAU,EAGX;IAEDP,0BACE,SAASQ;QACP,IAAI,CAACN,IAAIO,OAAO,IAAI,CAACN,aAAaC,YAAY,CAACC,OAAO;YACpD;QACF;QAEA,MAAMK,YAAYC,WAAW;YAC3B,IAAI,CAACT,IAAIO,OAAO,EAAE;gBAChB;YACF;YAEA,MAAMG,gBAAgBb,iCAAiCG,IAAIO,OAAO;YAClE,IAAI,CAACX,SAASI,IAAIO,OAAO,EAAEG,gBAAgB;gBACzC,IAAIT,cAAc,QAAQ;oBACxBD,IAAIO,OAAO,CAACI,KAAK;gBACnB,OAAO;oBACLN;gBACF;YACF;QACF,GAAGD;QAEH,OAAO,IAAMQ,aAAaJ;IAC5B,GACA;QAACR;QAAKC;QAAWG;QAAgBF;QAAUC;QAAOE;KAAW;AAEjE,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"file":"useFocusTrap.d.ts","sourceRoot":"","sources":["../../../src/hooks/useFocusTrap/useFocusTrap.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAuDpC,MAAM,MAAM,iBAAiB,GAAG;IAC9B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,SAAS,CAAC;IACzC;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,GAAG,CAAC,MAAM,OAAO,GAAG,WAAW,CAAC,GAAG,SAAS,CAAC;IACnE;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACpC;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;CAC7B,CAAC;AAEF,eAAO,MAAM,YAAY,GACvB,KAAK,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,EACxC,+DAMG,iBAAiB;;;CAmGrB,CAAC"}
1
+ {"version":3,"file":"useFocusTrap.d.ts","sourceRoot":"","sources":["../../../src/hooks/useFocusTrap/useFocusTrap.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAuDpC,MAAM,MAAM,iBAAiB,GAAG;IAC9B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,SAAS,CAAC;IACzC;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,GAAG,CAAC,MAAM,OAAO,GAAG,WAAW,CAAC,GAAG,SAAS,CAAC;IACnE;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACpC;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;CAC7B,CAAC;AAEF,eAAO,MAAM,YAAY,GACvB,KAAK,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,EACxC,+DAMG,iBAAiB;;;CAqGrB,CAAC"}
@@ -46,6 +46,7 @@ export const useFocusTrap = (ref, { mount = true, disabled = false, autoFocus =
46
46
  const prevFocusableRef = useRef([]);
47
47
  const createFocusFn = (getFocusElement)=>{
48
48
  return ()=>{
49
+ // eslint-disable-next-line react-hooks/refs
49
50
  const node = getFocusElement(ref.current);
50
51
  if (node) {
51
52
  node.focus({
@@ -100,6 +101,7 @@ export const useFocusTrap = (ref, { mount = true, disabled = false, autoFocus =
100
101
  useMutationObserver(ref, ()=>ref.current && onMutateParentHandler(ref.current));
101
102
  const createGuardFocusHandler = (focusFn, focusFromOutside)=>{
102
103
  return (event)=>{
104
+ // eslint-disable-next-line react-hooks/refs
103
105
  if (!mount || disabled || !ref.current) {
104
106
  return;
105
107
  }
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/hooks/useFocusTrap/useFocusTrap.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { useRef } from 'react';\nimport { arraysEquals } from '../../helpers/array';\nimport { FOCUSABLE_ELEMENTS_LIST } from '../../lib/accessibility';\nimport { getWindow } from '../../lib/dom';\nimport { useMutationObserver } from '../useMutationObserver';\nimport { useStableCallback } from '../useStableCallback';\nimport { FocusGuard } from './FocusGuard';\nimport { useAutoFocus } from './useAutoFocus';\nimport { useRestoreFocus } from './useRestoreFocus';\n\nconst FOCUSABLE_ELEMENTS = FOCUSABLE_ELEMENTS_LIST.join();\n\nconst collectFocusable = (root: HTMLElement): HTMLElement[] => {\n const newFocusableElements =\n // eslint-disable-next-line no-restricted-properties\n root.querySelectorAll<HTMLElement>(FOCUSABLE_ELEMENTS);\n const nodes = Array.from(newFocusableElements).filter((node) => {\n // Исключаем гарды из списка фокусируемых элементов\n if (node.hasAttribute('data-focus-guard')) {\n return false;\n }\n\n const { display, visibility } = getComputedStyle(node);\n const isHidden = display === 'none' || visibility === 'hidden';\n const isDisabled = (node as HTMLButtonElement).disabled ?? false;\n\n return !isHidden && !isDisabled;\n });\n\n if (nodes.length === 0) {\n nodes.push(root);\n }\n\n return nodes;\n};\n\nconst getFirstFocusable = (root: HTMLElement | null): HTMLElement | null => {\n if (!root) {\n return null;\n }\n\n const nodes = collectFocusable(root);\n return nodes[0] || null;\n};\n\nconst getLastFocusable = (root: HTMLElement | null): HTMLElement | null => {\n if (!root) {\n return null;\n }\n\n const nodes = collectFocusable(root);\n return nodes[nodes.length - 1] || null;\n};\n\nexport type UseFocusTrapProps = {\n /**\n * Форсированное отключение захвата фокуса\n *\n * @default false\n */\n disabled?: boolean | undefined;\n /**\n * Управление поведением автофокуса при появлении всплывающего окна.\n * При прокидывании `true` фокус будет установлен на первый элемент.\n * При прокидывании `root` фокус будет установлен в корень.\n * @default true\n */\n autoFocus?: boolean | 'root' | undefined;\n /**\n * Управление поведением возврата фокуса при закрытии всплывающего окна.\n * @default true\n */\n restoreFocus?: boolean | (() => boolean | HTMLElement) | undefined;\n /**\n * Время в миллисекундах после которого срабатывает автофокус при появлении всплывающего окна.\n * @default 0\n */\n autoFocusDelay?: number | undefined;\n /**\n * @default true\n */\n mount?: boolean | undefined;\n};\n\nexport const useFocusTrap = (\n ref: React.RefObject<HTMLElement | null>,\n {\n mount = true,\n disabled = false,\n autoFocus = true,\n restoreFocus = true,\n autoFocusDelay = 0,\n }: UseFocusTrapProps,\n) => {\n const prevFocusableRef = useRef<HTMLElement[]>([]);\n\n const createFocusFn = (getFocusElement: (root: HTMLElement | null) => HTMLElement | null) => {\n return () => {\n const node = getFocusElement(ref.current);\n if (node) {\n node.focus({ preventScroll: true });\n } else if (ref.current) {\n ref.current.focus();\n }\n };\n };\n\n const focusFirst = useStableCallback(createFocusFn(getFirstFocusable));\n\n const focusLast = useStableCallback(createFocusFn(getLastFocusable));\n\n useRestoreFocus({\n restoreFocus,\n autoFocusDelay,\n mount,\n ref,\n });\n\n useAutoFocus(ref, {\n autoFocus,\n disabled,\n mount,\n autoFocusDelay,\n focusFirst,\n });\n\n const onMutateParentHandler = useStableCallback((parentNode: HTMLElement) => {\n if (disabled || !autoFocus || !mount) {\n return;\n }\n\n const doc = getWindow(parentNode)?.document;\n if (!doc) {\n return;\n }\n\n const activeElement = doc.activeElement as HTMLElement;\n const focusableNodes = collectFocusable(parentNode);\n\n if (arraysEquals(focusableNodes, prevFocusableRef.current)) {\n return;\n }\n\n if (focusableNodes.length === 0) {\n prevFocusableRef.current = [];\n return;\n }\n\n const currentElementIndex = Math.max(\n activeElement ? focusableNodes.indexOf(activeElement) : -1,\n 0,\n );\n\n const nodeToFocus = focusableNodes[currentElementIndex];\n if (nodeToFocus) {\n nodeToFocus.focus({ preventScroll: true });\n }\n\n prevFocusableRef.current = focusableNodes;\n });\n\n useMutationObserver(ref, () => ref.current && onMutateParentHandler(ref.current));\n\n const createGuardFocusHandler = (focusFn: () => void, focusFromOutside: () => void) => {\n return (event: React.FocusEvent<HTMLSpanElement>) => {\n if (!mount || disabled || !ref.current) {\n return;\n }\n\n // Проверяем, был ли предыдущий активный элемент внутри root\n // Если нет, значит фокус пришёл извне, и нужно использовать focusFromOutside\n const relatedTarget = event.relatedTarget as HTMLElement | null;\n\n if (relatedTarget === null || (relatedTarget && !ref.current.contains(relatedTarget))) {\n focusFromOutside();\n return;\n }\n\n focusFn();\n };\n };\n\n const onBeforeGuardFocus = useStableCallback(createGuardFocusHandler(focusLast, focusFirst));\n const onAfterGuardFocus = useStableCallback(createGuardFocusHandler(focusFirst, focusLast));\n\n const shouldRenderGuards = mount && !disabled;\n\n return {\n beforeGuard: shouldRenderGuards && <FocusGuard onFocus={onBeforeGuardFocus} />,\n afterGuard: shouldRenderGuards && <FocusGuard onFocus={onAfterGuardFocus} />,\n };\n};\n"],"names":["useRef","arraysEquals","FOCUSABLE_ELEMENTS_LIST","getWindow","useMutationObserver","useStableCallback","FocusGuard","useAutoFocus","useRestoreFocus","FOCUSABLE_ELEMENTS","join","collectFocusable","root","newFocusableElements","querySelectorAll","nodes","Array","from","filter","node","hasAttribute","display","visibility","getComputedStyle","isHidden","isDisabled","disabled","length","push","getFirstFocusable","getLastFocusable","useFocusTrap","ref","mount","autoFocus","restoreFocus","autoFocusDelay","prevFocusableRef","createFocusFn","getFocusElement","current","focus","preventScroll","focusFirst","focusLast","onMutateParentHandler","parentNode","doc","document","activeElement","focusableNodes","currentElementIndex","Math","max","indexOf","nodeToFocus","createGuardFocusHandler","focusFn","focusFromOutside","event","relatedTarget","contains","onBeforeGuardFocus","onAfterGuardFocus","shouldRenderGuards","beforeGuard","onFocus","afterGuard"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../src/hooks/useFocusTrap/useFocusTrap.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { useRef } from 'react';\nimport { arraysEquals } from '../../helpers/array';\nimport { FOCUSABLE_ELEMENTS_LIST } from '../../lib/accessibility';\nimport { getWindow } from '../../lib/dom';\nimport { useMutationObserver } from '../useMutationObserver';\nimport { useStableCallback } from '../useStableCallback';\nimport { FocusGuard } from './FocusGuard';\nimport { useAutoFocus } from './useAutoFocus';\nimport { useRestoreFocus } from './useRestoreFocus';\n\nconst FOCUSABLE_ELEMENTS = FOCUSABLE_ELEMENTS_LIST.join();\n\nconst collectFocusable = (root: HTMLElement): HTMLElement[] => {\n const newFocusableElements =\n // eslint-disable-next-line no-restricted-properties\n root.querySelectorAll<HTMLElement>(FOCUSABLE_ELEMENTS);\n const nodes = Array.from(newFocusableElements).filter((node) => {\n // Исключаем гарды из списка фокусируемых элементов\n if (node.hasAttribute('data-focus-guard')) {\n return false;\n }\n\n const { display, visibility } = getComputedStyle(node);\n const isHidden = display === 'none' || visibility === 'hidden';\n const isDisabled = (node as HTMLButtonElement).disabled ?? false;\n\n return !isHidden && !isDisabled;\n });\n\n if (nodes.length === 0) {\n nodes.push(root);\n }\n\n return nodes;\n};\n\nconst getFirstFocusable = (root: HTMLElement | null): HTMLElement | null => {\n if (!root) {\n return null;\n }\n\n const nodes = collectFocusable(root);\n return nodes[0] || null;\n};\n\nconst getLastFocusable = (root: HTMLElement | null): HTMLElement | null => {\n if (!root) {\n return null;\n }\n\n const nodes = collectFocusable(root);\n return nodes[nodes.length - 1] || null;\n};\n\nexport type UseFocusTrapProps = {\n /**\n * Форсированное отключение захвата фокуса\n *\n * @default false\n */\n disabled?: boolean | undefined;\n /**\n * Управление поведением автофокуса при появлении всплывающего окна.\n * При прокидывании `true` фокус будет установлен на первый элемент.\n * При прокидывании `root` фокус будет установлен в корень.\n * @default true\n */\n autoFocus?: boolean | 'root' | undefined;\n /**\n * Управление поведением возврата фокуса при закрытии всплывающего окна.\n * @default true\n */\n restoreFocus?: boolean | (() => boolean | HTMLElement) | undefined;\n /**\n * Время в миллисекундах после которого срабатывает автофокус при появлении всплывающего окна.\n * @default 0\n */\n autoFocusDelay?: number | undefined;\n /**\n * @default true\n */\n mount?: boolean | undefined;\n};\n\nexport const useFocusTrap = (\n ref: React.RefObject<HTMLElement | null>,\n {\n mount = true,\n disabled = false,\n autoFocus = true,\n restoreFocus = true,\n autoFocusDelay = 0,\n }: UseFocusTrapProps,\n) => {\n const prevFocusableRef = useRef<HTMLElement[]>([]);\n\n const createFocusFn = (getFocusElement: (root: HTMLElement | null) => HTMLElement | null) => {\n return () => {\n // eslint-disable-next-line react-hooks/refs\n const node = getFocusElement(ref.current);\n if (node) {\n node.focus({ preventScroll: true });\n } else if (ref.current) {\n ref.current.focus();\n }\n };\n };\n\n const focusFirst = useStableCallback(createFocusFn(getFirstFocusable));\n\n const focusLast = useStableCallback(createFocusFn(getLastFocusable));\n\n useRestoreFocus({\n restoreFocus,\n autoFocusDelay,\n mount,\n ref,\n });\n\n useAutoFocus(ref, {\n autoFocus,\n disabled,\n mount,\n autoFocusDelay,\n focusFirst,\n });\n\n const onMutateParentHandler = useStableCallback((parentNode: HTMLElement) => {\n if (disabled || !autoFocus || !mount) {\n return;\n }\n\n const doc = getWindow(parentNode)?.document;\n if (!doc) {\n return;\n }\n\n const activeElement = doc.activeElement as HTMLElement;\n const focusableNodes = collectFocusable(parentNode);\n\n if (arraysEquals(focusableNodes, prevFocusableRef.current)) {\n return;\n }\n\n if (focusableNodes.length === 0) {\n prevFocusableRef.current = [];\n return;\n }\n\n const currentElementIndex = Math.max(\n activeElement ? focusableNodes.indexOf(activeElement) : -1,\n 0,\n );\n\n const nodeToFocus = focusableNodes[currentElementIndex];\n if (nodeToFocus) {\n nodeToFocus.focus({ preventScroll: true });\n }\n\n prevFocusableRef.current = focusableNodes;\n });\n\n useMutationObserver(ref, () => ref.current && onMutateParentHandler(ref.current));\n\n const createGuardFocusHandler = (focusFn: () => void, focusFromOutside: () => void) => {\n return (event: React.FocusEvent<HTMLSpanElement>) => {\n // eslint-disable-next-line react-hooks/refs\n if (!mount || disabled || !ref.current) {\n return;\n }\n\n // Проверяем, был ли предыдущий активный элемент внутри root\n // Если нет, значит фокус пришёл извне, и нужно использовать focusFromOutside\n const relatedTarget = event.relatedTarget as HTMLElement | null;\n\n if (relatedTarget === null || (relatedTarget && !ref.current.contains(relatedTarget))) {\n focusFromOutside();\n return;\n }\n\n focusFn();\n };\n };\n\n const onBeforeGuardFocus = useStableCallback(createGuardFocusHandler(focusLast, focusFirst));\n const onAfterGuardFocus = useStableCallback(createGuardFocusHandler(focusFirst, focusLast));\n\n const shouldRenderGuards = mount && !disabled;\n\n return {\n beforeGuard: shouldRenderGuards && <FocusGuard onFocus={onBeforeGuardFocus} />,\n afterGuard: shouldRenderGuards && <FocusGuard onFocus={onAfterGuardFocus} />,\n };\n};\n"],"names":["useRef","arraysEquals","FOCUSABLE_ELEMENTS_LIST","getWindow","useMutationObserver","useStableCallback","FocusGuard","useAutoFocus","useRestoreFocus","FOCUSABLE_ELEMENTS","join","collectFocusable","root","newFocusableElements","querySelectorAll","nodes","Array","from","filter","node","hasAttribute","display","visibility","getComputedStyle","isHidden","isDisabled","disabled","length","push","getFirstFocusable","getLastFocusable","useFocusTrap","ref","mount","autoFocus","restoreFocus","autoFocusDelay","prevFocusableRef","createFocusFn","getFocusElement","current","focus","preventScroll","focusFirst","focusLast","onMutateParentHandler","parentNode","doc","document","activeElement","focusableNodes","currentElementIndex","Math","max","indexOf","nodeToFocus","createGuardFocusHandler","focusFn","focusFromOutside","event","relatedTarget","contains","onBeforeGuardFocus","onAfterGuardFocus","shouldRenderGuards","beforeGuard","onFocus","afterGuard"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"useFocusVisible.d.ts","sourceRoot":"","sources":["../../src/hooks/useFocusVisible.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,UAAU,EAAqC,MAAM,OAAO,CAAC;AAG3E;;;;;;;GAOG;AACH,wBAAgB,eAAe,IAAI;IACjC,YAAY,EAAE,OAAO,CAAC;IACtB,OAAO,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAClD,MAAM,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;CAClD,CA8BA"}
1
+ {"version":3,"file":"useFocusVisible.d.ts","sourceRoot":"","sources":["../../src/hooks/useFocusVisible.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,UAAU,EAAyB,MAAM,OAAO,CAAC;AAG/D;;;;;;;GAOG;AACH,wBAAgB,eAAe,IAAI;IACjC,YAAY,EAAE,OAAO,CAAC;IACtB,OAAO,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAClD,MAAM,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;CAClD,CAsBA"}
@@ -1,5 +1,5 @@
1
- import { useCallback, useContext, useState } from "react";
2
- import { AppRootContext } from "../components/AppRoot/AppRootContext.js";
1
+ import { useCallback, useState } from "react";
2
+ import { useKeyboardInputTracker } from "./useKeyboardInputTracker.js";
3
3
  /**
4
4
  * Определяет фокус элемента, когда его наличие необходимо обозначить визуально.
5
5
  *
@@ -8,23 +8,18 @@ import { AppRootContext } from "../components/AppRoot/AppRootContext.js";
8
8
  *
9
9
  * @since 7.2.0
10
10
  */ export function useFocusVisible() {
11
- const [isFocused, setIsFocused] = useState(false);
12
- // FIXME: Избавиться от чека контекста, так как без AppRoot не работает фокус
13
- const withKeyboardInputCheck = true;
14
- const { keyboardInput } = useContext(AppRootContext);
11
+ const [focusVisible, setFocusVisible] = useState(false);
12
+ const keyboardInputRef = useKeyboardInputTracker();
15
13
  const onFocus = useCallback((event)=>{
16
14
  event.stopPropagation();
17
- setIsFocused(true);
15
+ setFocusVisible(Boolean(keyboardInputRef.current));
18
16
  }, [
19
- setIsFocused
17
+ keyboardInputRef
20
18
  ]);
21
19
  const onBlur = useCallback((event)=>{
22
20
  event.stopPropagation();
23
- setIsFocused(false);
24
- }, [
25
- setIsFocused
26
- ]);
27
- const focusVisible = withKeyboardInputCheck ? keyboardInput && isFocused : isFocused;
21
+ setFocusVisible(false);
22
+ }, []);
28
23
  return {
29
24
  focusVisible,
30
25
  onFocus,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/hooks/useFocusVisible.ts"],"sourcesContent":["import { type FocusEvent, useCallback, useContext, useState } from 'react';\nimport { AppRootContext } from '../components/AppRoot/AppRootContext';\n\n/**\n * Определяет фокус элемента, когда его наличие необходимо обозначить визуально.\n *\n * Этот хук полезен для обозначения фокуса, когда для навигации используется\n * клавиатура\n *\n * @since 7.2.0\n */\nexport function useFocusVisible(): {\n focusVisible: boolean;\n onFocus: (event: FocusEvent<HTMLElement>) => void;\n onBlur: (event: FocusEvent<HTMLElement>) => void;\n} {\n const [isFocused, setIsFocused] = useState(false);\n\n // FIXME: Избавиться от чека контекста, так как без AppRoot не работает фокус\n const withKeyboardInputCheck = true;\n const { keyboardInput } = useContext(AppRootContext);\n\n const onFocus = useCallback(\n (event: FocusEvent<HTMLElement>) => {\n event.stopPropagation();\n setIsFocused(true);\n },\n [setIsFocused],\n );\n\n const onBlur = useCallback(\n (event: FocusEvent<HTMLElement>) => {\n event.stopPropagation();\n setIsFocused(false);\n },\n [setIsFocused],\n );\n\n const focusVisible = withKeyboardInputCheck ? keyboardInput && isFocused : isFocused;\n\n return {\n focusVisible,\n onFocus,\n onBlur,\n };\n}\n"],"names":["useCallback","useContext","useState","AppRootContext","useFocusVisible","isFocused","setIsFocused","withKeyboardInputCheck","keyboardInput","onFocus","event","stopPropagation","onBlur","focusVisible"],"mappings":"AAAA,SAA0BA,WAAW,EAAEC,UAAU,EAAEC,QAAQ,QAAQ,QAAQ;AAC3E,SAASC,cAAc,QAAQ,0CAAuC;AAEtE;;;;;;;CAOC,GACD,OAAO,SAASC;IAKd,MAAM,CAACC,WAAWC,aAAa,GAAGJ,SAAS;IAE3C,6EAA6E;IAC7E,MAAMK,yBAAyB;IAC/B,MAAM,EAAEC,aAAa,EAAE,GAAGP,WAAWE;IAErC,MAAMM,UAAUT,YACd,CAACU;QACCA,MAAMC,eAAe;QACrBL,aAAa;IACf,GACA;QAACA;KAAa;IAGhB,MAAMM,SAASZ,YACb,CAACU;QACCA,MAAMC,eAAe;QACrBL,aAAa;IACf,GACA;QAACA;KAAa;IAGhB,MAAMO,eAAeN,yBAAyBC,iBAAiBH,YAAYA;IAE3E,OAAO;QACLQ;QACAJ;QACAG;IACF;AACF"}
1
+ {"version":3,"sources":["../../src/hooks/useFocusVisible.ts"],"sourcesContent":["import { type FocusEvent, useCallback, useState } from 'react';\nimport { useKeyboardInputTracker } from './useKeyboardInputTracker';\n\n/**\n * Определяет фокус элемента, когда его наличие необходимо обозначить визуально.\n *\n * Этот хук полезен для обозначения фокуса, когда для навигации используется\n * клавиатура\n *\n * @since 7.2.0\n */\nexport function useFocusVisible(): {\n focusVisible: boolean;\n onFocus: (event: FocusEvent<HTMLElement>) => void;\n onBlur: (event: FocusEvent<HTMLElement>) => void;\n} {\n const [focusVisible, setFocusVisible] = useState(false);\n const keyboardInputRef = useKeyboardInputTracker();\n\n const onFocus = useCallback(\n (event: FocusEvent<HTMLElement>) => {\n event.stopPropagation();\n setFocusVisible(Boolean(keyboardInputRef.current));\n },\n [keyboardInputRef],\n );\n\n const onBlur = useCallback((event: FocusEvent<HTMLElement>) => {\n event.stopPropagation();\n setFocusVisible(false);\n }, []);\n\n return {\n focusVisible,\n onFocus,\n onBlur,\n };\n}\n"],"names":["useCallback","useState","useKeyboardInputTracker","useFocusVisible","focusVisible","setFocusVisible","keyboardInputRef","onFocus","event","stopPropagation","Boolean","current","onBlur"],"mappings":"AAAA,SAA0BA,WAAW,EAAEC,QAAQ,QAAQ,QAAQ;AAC/D,SAASC,uBAAuB,QAAQ,+BAA4B;AAEpE;;;;;;;CAOC,GACD,OAAO,SAASC;IAKd,MAAM,CAACC,cAAcC,gBAAgB,GAAGJ,SAAS;IACjD,MAAMK,mBAAmBJ;IAEzB,MAAMK,UAAUP,YACd,CAACQ;QACCA,MAAMC,eAAe;QACrBJ,gBAAgBK,QAAQJ,iBAAiBK,OAAO;IAClD,GACA;QAACL;KAAiB;IAGpB,MAAMM,SAASZ,YAAY,CAACQ;QAC1BA,MAAMC,eAAe;QACrBJ,gBAAgB;IAClB,GAAG,EAAE;IAEL,OAAO;QACLD;QACAG;QACAK;IACF;AACF"}
@@ -1 +1 @@
1
- {"version":3,"file":"useFocusWithin.d.ts","sourceRoot":"","sources":["../../src/hooks/useFocusWithin.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,wBAAgB,cAAc,CAAC,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,GAAG,OAAO,CA4BhF"}
1
+ {"version":3,"file":"useFocusWithin.d.ts","sourceRoot":"","sources":["../../src/hooks/useFocusWithin.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,wBAAgB,cAAc,CAAC,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,GAAG,OAAO,CAgChF"}
@@ -1,14 +1,13 @@
1
1
  import * as React from "react";
2
- import { useDOM } from "../lib/dom.js";
3
2
  import { useIsomorphicLayoutEffect } from "../lib/useIsomorphicLayoutEffect.js";
4
3
  const isFocusWithin = (ref, document)=>ref.contains(document.activeElement);
5
4
  export function useFocusWithin(ref) {
6
- const { document } = useDOM();
7
5
  const [focusWithin, setFocusWithin] = React.useState(false);
8
6
  useIsomorphicLayoutEffect(function handleAutoFocus() {
9
- /* istanbul ignore if: невозможный кейс, т.к. в SSR эффекты не вызываются. Проверка на будущее, если вдруг эффект будет вызываться. */ if (!document) {
7
+ /* istanbul ignore if: невозможный кейс, т.к. в SSR эффекты не вызываются. Проверка на будущее, если вдруг эффект будет вызываться. */ if (!ref.current) {
10
8
  return;
11
9
  }
10
+ const document = ref.current.ownerDocument;
12
11
  const handleFocusOrBlurEvents = ()=>{
13
12
  if (ref.current) {
14
13
  setFocusWithin(isFocusWithin(ref.current, document));
@@ -30,7 +29,9 @@ export function useFocusWithin(ref) {
30
29
  capture: true
31
30
  });
32
31
  };
33
- }, []);
32
+ }, [
33
+ ref
34
+ ]);
34
35
  return focusWithin;
35
36
  }
36
37
 
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/hooks/useFocusWithin.ts"],"sourcesContent":["import * as React from 'react';\nimport { useDOM } from '../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../lib/useIsomorphicLayoutEffect';\n\nconst isFocusWithin = <T extends Element>(ref: T, document: Document) =>\n ref.contains(document.activeElement);\n\nexport function useFocusWithin(ref: React.RefObject<HTMLElement | null>): boolean {\n const { document } = useDOM();\n const [focusWithin, setFocusWithin] = React.useState<boolean>(false);\n\n useIsomorphicLayoutEffect(function handleAutoFocus() {\n /* istanbul ignore if: невозможный кейс, т.к. в SSR эффекты не вызываются. Проверка на будущее, если вдруг эффект будет вызываться. */\n if (!document) {\n return;\n }\n\n const handleFocusOrBlurEvents = () => {\n if (ref.current) {\n setFocusWithin(isFocusWithin(ref.current, document));\n }\n };\n\n // Вызываем в начале, чтобы проверить autoFocus\n void handleFocusOrBlurEvents();\n\n document.addEventListener('focus', handleFocusOrBlurEvents, { capture: true });\n document.addEventListener('blur', handleFocusOrBlurEvents, { capture: true });\n return () => {\n document.removeEventListener('focus', handleFocusOrBlurEvents, { capture: true });\n document.removeEventListener('blur', handleFocusOrBlurEvents, { capture: true });\n };\n }, []);\n\n return focusWithin;\n}\n"],"names":["React","useDOM","useIsomorphicLayoutEffect","isFocusWithin","ref","document","contains","activeElement","useFocusWithin","focusWithin","setFocusWithin","useState","handleAutoFocus","handleFocusOrBlurEvents","current","addEventListener","capture","removeEventListener"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,MAAM,QAAQ,gBAAa;AACpC,SAASC,yBAAyB,QAAQ,sCAAmC;AAE7E,MAAMC,gBAAgB,CAAoBC,KAAQC,WAChDD,IAAIE,QAAQ,CAACD,SAASE,aAAa;AAErC,OAAO,SAASC,eAAeJ,GAAwC;IACrE,MAAM,EAAEC,QAAQ,EAAE,GAAGJ;IACrB,MAAM,CAACQ,aAAaC,eAAe,GAAGV,MAAMW,QAAQ,CAAU;IAE9DT,0BAA0B,SAASU;QACjC,oIAAoI,GACpI,IAAI,CAACP,UAAU;YACb;QACF;QAEA,MAAMQ,0BAA0B;YAC9B,IAAIT,IAAIU,OAAO,EAAE;gBACfJ,eAAeP,cAAcC,IAAIU,OAAO,EAAET;YAC5C;QACF;QAEA,+CAA+C;QAC/C,KAAKQ;QAELR,SAASU,gBAAgB,CAAC,SAASF,yBAAyB;YAAEG,SAAS;QAAK;QAC5EX,SAASU,gBAAgB,CAAC,QAAQF,yBAAyB;YAAEG,SAAS;QAAK;QAC3E,OAAO;YACLX,SAASY,mBAAmB,CAAC,SAASJ,yBAAyB;gBAAEG,SAAS;YAAK;YAC/EX,SAASY,mBAAmB,CAAC,QAAQJ,yBAAyB;gBAAEG,SAAS;YAAK;QAChF;IACF,GAAG,EAAE;IAEL,OAAOP;AACT"}
1
+ {"version":3,"sources":["../../src/hooks/useFocusWithin.ts"],"sourcesContent":["import * as React from 'react';\nimport { useIsomorphicLayoutEffect } from '../lib/useIsomorphicLayoutEffect';\n\nconst isFocusWithin = <T extends Element>(ref: T, document: Document) =>\n ref.contains(document.activeElement);\n\nexport function useFocusWithin(ref: React.RefObject<HTMLElement | null>): boolean {\n const [focusWithin, setFocusWithin] = React.useState<boolean>(false);\n\n useIsomorphicLayoutEffect(\n function handleAutoFocus() {\n /* istanbul ignore if: невозможный кейс, т.к. в SSR эффекты не вызываются. Проверка на будущее, если вдруг эффект будет вызываться. */\n if (!ref.current) {\n return;\n }\n\n const document = ref.current.ownerDocument;\n\n const handleFocusOrBlurEvents = () => {\n if (ref.current) {\n setFocusWithin(isFocusWithin(ref.current, document));\n }\n };\n\n // Вызываем в начале, чтобы проверить autoFocus\n void handleFocusOrBlurEvents();\n\n document.addEventListener('focus', handleFocusOrBlurEvents, { capture: true });\n document.addEventListener('blur', handleFocusOrBlurEvents, { capture: true });\n return () => {\n document.removeEventListener('focus', handleFocusOrBlurEvents, { capture: true });\n document.removeEventListener('blur', handleFocusOrBlurEvents, { capture: true });\n };\n },\n [ref],\n );\n\n return focusWithin;\n}\n"],"names":["React","useIsomorphicLayoutEffect","isFocusWithin","ref","document","contains","activeElement","useFocusWithin","focusWithin","setFocusWithin","useState","handleAutoFocus","current","ownerDocument","handleFocusOrBlurEvents","addEventListener","capture","removeEventListener"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,yBAAyB,QAAQ,sCAAmC;AAE7E,MAAMC,gBAAgB,CAAoBC,KAAQC,WAChDD,IAAIE,QAAQ,CAACD,SAASE,aAAa;AAErC,OAAO,SAASC,eAAeJ,GAAwC;IACrE,MAAM,CAACK,aAAaC,eAAe,GAAGT,MAAMU,QAAQ,CAAU;IAE9DT,0BACE,SAASU;QACP,oIAAoI,GACpI,IAAI,CAACR,IAAIS,OAAO,EAAE;YAChB;QACF;QAEA,MAAMR,WAAWD,IAAIS,OAAO,CAACC,aAAa;QAE1C,MAAMC,0BAA0B;YAC9B,IAAIX,IAAIS,OAAO,EAAE;gBACfH,eAAeP,cAAcC,IAAIS,OAAO,EAAER;YAC5C;QACF;QAEA,+CAA+C;QAC/C,KAAKU;QAELV,SAASW,gBAAgB,CAAC,SAASD,yBAAyB;YAAEE,SAAS;QAAK;QAC5EZ,SAASW,gBAAgB,CAAC,QAAQD,yBAAyB;YAAEE,SAAS;QAAK;QAC3E,OAAO;YACLZ,SAASa,mBAAmB,CAAC,SAASH,yBAAyB;gBAAEE,SAAS;YAAK;YAC/EZ,SAASa,mBAAmB,CAAC,QAAQH,yBAAyB;gBAAEE,SAAS;YAAK;QAChF;IACF,GACA;QAACb;KAAI;IAGP,OAAOK;AACT"}
@@ -1 +1 @@
1
- {"version":3,"file":"useGlobalEscKeyDown.d.ts","sourceRoot":"","sources":["../../src/hooks/useGlobalEscKeyDown.ts"],"names":[],"mappings":"AAUA;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,GAC9B,MAAM,OAAO,EACb,WAAW,CAAC,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC,GAAG,SAAS,EACvD,cAAc,uBAAuB,GAAG,SAAS,KAChD,IAuBF,CAAC"}
1
+ {"version":3,"file":"useGlobalEscKeyDown.d.ts","sourceRoot":"","sources":["../../src/hooks/useGlobalEscKeyDown.ts"],"names":[],"mappings":"AAIA;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,GAC9B,MAAM,OAAO,EACb,WAAW,CAAC,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC,GAAG,SAAS,EACvD,cAAa,uBAAuB,GAAG,SAAc,KACpD,IA0BF,CAAC"}
@@ -1,23 +1,13 @@
1
- import { useRef } from "react";
2
1
  import { Keys, pressedKey } from "../lib/accessibility.js";
3
2
  import { useDOM } from "../lib/dom.js";
4
3
  import { useIsomorphicLayoutEffect } from "../lib/useIsomorphicLayoutEffect.js";
5
- const EVENT_OPTIONS = {
6
- passive: true,
7
- capture: true
8
- };
9
4
  /**
10
5
  * Завязывается на document.
11
6
  *
12
7
  * @private
13
- */ export const useGlobalEscKeyDown = (init, callback, optionsProp)=>{
8
+ */ export const useGlobalEscKeyDown = (init, callback, optionsProp = {})=>{
14
9
  const { document } = useDOM();
15
- const options = useRef(optionsProp || EVENT_OPTIONS);
16
- useIsomorphicLayoutEffect(()=>{
17
- options.current = optionsProp || EVENT_OPTIONS;
18
- }, [
19
- options
20
- ]);
10
+ const { capture = true, passive = true, once = false, signal } = optionsProp;
21
11
  useIsomorphicLayoutEffect(()=>{
22
12
  if (!document || !init || !callback) {
23
13
  return;
@@ -27,14 +17,26 @@ const EVENT_OPTIONS = {
27
17
  callback(event);
28
18
  }
29
19
  };
30
- document.addEventListener('keydown', handleKeyDown, options.current);
20
+ const options = {
21
+ capture,
22
+ passive,
23
+ once,
24
+ ...signal !== undefined ? {
25
+ signal
26
+ } : {}
27
+ };
28
+ document.addEventListener('keydown', handleKeyDown, options);
31
29
  return ()=>{
32
- document.removeEventListener('keydown', handleKeyDown, options.current);
30
+ document.removeEventListener('keydown', handleKeyDown, options);
33
31
  };
34
32
  }, [
35
33
  init,
36
34
  document,
37
- callback
35
+ callback,
36
+ capture,
37
+ passive,
38
+ once,
39
+ signal
38
40
  ]);
39
41
  };
40
42
 
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/hooks/useGlobalEscKeyDown.ts"],"sourcesContent":["import { useRef } from 'react';\nimport { Keys, pressedKey } from '../lib/accessibility';\nimport { useDOM } from '../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../lib/useIsomorphicLayoutEffect';\n\nconst EVENT_OPTIONS = {\n passive: true,\n capture: true,\n};\n\n/**\n * Завязывается на document.\n *\n * @private\n */\nexport const useGlobalEscKeyDown = (\n init: boolean,\n callback?: ((event: KeyboardEvent) => void) | undefined,\n optionsProp?: AddEventListenerOptions | undefined,\n): void => {\n const { document } = useDOM();\n\n const options = useRef<AddEventListenerOptions>(optionsProp || EVENT_OPTIONS);\n\n useIsomorphicLayoutEffect(() => {\n options.current = optionsProp || EVENT_OPTIONS;\n }, [options]);\n\n useIsomorphicLayoutEffect(() => {\n if (!document || !init || !callback) {\n return;\n }\n const handleKeyDown = (event: KeyboardEvent) => {\n if (pressedKey(event) === Keys.ESCAPE) {\n callback(event);\n }\n };\n document.addEventListener('keydown', handleKeyDown, options.current);\n return () => {\n document.removeEventListener('keydown', handleKeyDown, options.current);\n };\n }, [init, document, callback]);\n};\n"],"names":["useRef","Keys","pressedKey","useDOM","useIsomorphicLayoutEffect","EVENT_OPTIONS","passive","capture","useGlobalEscKeyDown","init","callback","optionsProp","document","options","current","handleKeyDown","event","ESCAPE","addEventListener","removeEventListener"],"mappings":"AAAA,SAASA,MAAM,QAAQ,QAAQ;AAC/B,SAASC,IAAI,EAAEC,UAAU,QAAQ,0BAAuB;AACxD,SAASC,MAAM,QAAQ,gBAAa;AACpC,SAASC,yBAAyB,QAAQ,sCAAmC;AAE7E,MAAMC,gBAAgB;IACpBC,SAAS;IACTC,SAAS;AACX;AAEA;;;;CAIC,GACD,OAAO,MAAMC,sBAAsB,CACjCC,MACAC,UACAC;IAEA,MAAM,EAAEC,QAAQ,EAAE,GAAGT;IAErB,MAAMU,UAAUb,OAAgCW,eAAeN;IAE/DD,0BAA0B;QACxBS,QAAQC,OAAO,GAAGH,eAAeN;IACnC,GAAG;QAACQ;KAAQ;IAEZT,0BAA0B;QACxB,IAAI,CAACQ,YAAY,CAACH,QAAQ,CAACC,UAAU;YACnC;QACF;QACA,MAAMK,gBAAgB,CAACC;YACrB,IAAId,WAAWc,WAAWf,KAAKgB,MAAM,EAAE;gBACrCP,SAASM;YACX;QACF;QACAJ,SAASM,gBAAgB,CAAC,WAAWH,eAAeF,QAAQC,OAAO;QACnE,OAAO;YACLF,SAASO,mBAAmB,CAAC,WAAWJ,eAAeF,QAAQC,OAAO;QACxE;IACF,GAAG;QAACL;QAAMG;QAAUF;KAAS;AAC/B,EAAE"}
1
+ {"version":3,"sources":["../../src/hooks/useGlobalEscKeyDown.ts"],"sourcesContent":["import { Keys, pressedKey } from '../lib/accessibility';\nimport { useDOM } from '../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../lib/useIsomorphicLayoutEffect';\n\n/**\n * Завязывается на document.\n *\n * @private\n */\nexport const useGlobalEscKeyDown = (\n init: boolean,\n callback?: ((event: KeyboardEvent) => void) | undefined,\n optionsProp: AddEventListenerOptions | undefined = {},\n): void => {\n const { document } = useDOM();\n\n const { capture = true, passive = true, once = false, signal } = optionsProp;\n\n useIsomorphicLayoutEffect(() => {\n if (!document || !init || !callback) {\n return;\n }\n const handleKeyDown = (event: KeyboardEvent) => {\n if (pressedKey(event) === Keys.ESCAPE) {\n callback(event);\n }\n };\n const options: AddEventListenerOptions = {\n capture,\n passive,\n once,\n ...(signal !== undefined ? { signal } : {}),\n };\n\n document.addEventListener('keydown', handleKeyDown, options);\n return () => {\n document.removeEventListener('keydown', handleKeyDown, options);\n };\n }, [init, document, callback, capture, passive, once, signal]);\n};\n"],"names":["Keys","pressedKey","useDOM","useIsomorphicLayoutEffect","useGlobalEscKeyDown","init","callback","optionsProp","document","capture","passive","once","signal","handleKeyDown","event","ESCAPE","options","undefined","addEventListener","removeEventListener"],"mappings":"AAAA,SAASA,IAAI,EAAEC,UAAU,QAAQ,0BAAuB;AACxD,SAASC,MAAM,QAAQ,gBAAa;AACpC,SAASC,yBAAyB,QAAQ,sCAAmC;AAE7E;;;;CAIC,GACD,OAAO,MAAMC,sBAAsB,CACjCC,MACAC,UACAC,cAAmD,CAAC,CAAC;IAErD,MAAM,EAAEC,QAAQ,EAAE,GAAGN;IAErB,MAAM,EAAEO,UAAU,IAAI,EAAEC,UAAU,IAAI,EAAEC,OAAO,KAAK,EAAEC,MAAM,EAAE,GAAGL;IAEjEJ,0BAA0B;QACxB,IAAI,CAACK,YAAY,CAACH,QAAQ,CAACC,UAAU;YACnC;QACF;QACA,MAAMO,gBAAgB,CAACC;YACrB,IAAIb,WAAWa,WAAWd,KAAKe,MAAM,EAAE;gBACrCT,SAASQ;YACX;QACF;QACA,MAAME,UAAmC;YACvCP;YACAC;YACAC;YACA,GAAIC,WAAWK,YAAY;gBAAEL;YAAO,IAAI,CAAC,CAAC;QAC5C;QAEAJ,SAASU,gBAAgB,CAAC,WAAWL,eAAeG;QACpD,OAAO;YACLR,SAASW,mBAAmB,CAAC,WAAWN,eAAeG;QACzD;IACF,GAAG;QAACX;QAAMG;QAAUF;QAAUG;QAASC;QAASC;QAAMC;KAAO;AAC/D,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"file":"useGlobalOnClickOutside.d.ts","sourceRoot":"","sources":["../../src/hooks/useGlobalOnClickOutside.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAIpC,eAAO,MAAM,uBAAuB,GAClC,CAAC,SAAS,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,GAAG,SAAS,GAAG,IAAI,EAChE,WAAW,SAAS,OAAO,GAAG,OAAO,EAErC,OAAO,OAAO,CAAC,MAAM,gBAAgB,EAAE,OAAO,GAAG,WAAW,CAAC,EAC7D,UAAU,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,EACrC,GAAG,MAAM,CAAC,EAAE,KACX,IAwBF,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,uBAAuB,GAClC,CAAC,SAAS,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,GAAG,SAAS,GAAG,IAAI,EAChE,WAAW,SAAS,OAAO,GAAG,OAAO,EAErC,UAAU,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,EACrC,GAAG,MAAM,CAAC,EAAE,KACX,IAEF,CAAC"}
1
+ {"version":3,"file":"useGlobalOnClickOutside.d.ts","sourceRoot":"","sources":["../../src/hooks/useGlobalOnClickOutside.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAKpC,eAAO,MAAM,uBAAuB,GAClC,CAAC,SAAS,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,GAAG,SAAS,GAAG,IAAI,EAChE,WAAW,SAAS,OAAO,GAAG,OAAO,EAErC,OAAO,OAAO,CAAC,MAAM,gBAAgB,EAAE,OAAO,GAAG,WAAW,CAAC,EAC7D,UAAU,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,EACrC,GAAG,MAAM,CAAC,EAAE,KACX,IA0BF,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,uBAAuB,GAClC,CAAC,SAAS,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,GAAG,SAAS,GAAG,IAAI,EAChE,WAAW,SAAS,OAAO,GAAG,OAAO,EAErC,UAAU,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,EACrC,GAAG,MAAM,CAAC,EAAE,KACX,IAEF,CAAC"}
@@ -1,7 +1,9 @@
1
1
  import { isElement, useDOM } from "../lib/dom.js";
2
2
  import { useIsomorphicLayoutEffect } from "../lib/useIsomorphicLayoutEffect.js";
3
+ import { useStableCallback } from "./useStableCallback.js";
3
4
  export const useGlobalOnEventOutside = (event, callback, ...refs)=>{
4
5
  const { document } = useDOM();
6
+ const stableCallback = useStableCallback(callback);
5
7
  useIsomorphicLayoutEffect(()=>{
6
8
  const someRefNotNull = refs.some((ref)=>ref && ref.current !== null);
7
9
  if (!document || !someRefNotNull) {
@@ -11,7 +13,7 @@ export const useGlobalOnEventOutside = (event, callback, ...refs)=>{
11
13
  const targetEl = event.target;
12
14
  const someRefHasTargetEl = isElement(targetEl) && refs.some((ref)=>ref && ref.current && ref.current.contains(targetEl));
13
15
  if (!someRefHasTargetEl) {
14
- callback(event);
16
+ stableCallback(event);
15
17
  }
16
18
  };
17
19
  document.addEventListener(event, handleClick, {
@@ -21,9 +23,11 @@ export const useGlobalOnEventOutside = (event, callback, ...refs)=>{
21
23
  return ()=>{
22
24
  document.removeEventListener(event, handleClick, true);
23
25
  };
26
+ // eslint-disable-next-line react-hooks/exhaustive-deps
24
27
  }, [
25
28
  document,
26
- callback,
29
+ stableCallback,
30
+ event,
27
31
  ...refs
28
32
  ]);
29
33
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/hooks/useGlobalOnClickOutside.ts"],"sourcesContent":["import type * as React from 'react';\nimport { isElement, useDOM } from '../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../lib/useIsomorphicLayoutEffect';\n\nexport const useGlobalOnEventOutside = <\n T extends React.RefObject<ElementType | null> | undefined | null,\n ElementType extends Element = Element,\n>(\n event: Extract<keyof DocumentEventMap, 'click' | 'mousedown'>,\n callback: (event: MouseEvent) => void,\n ...refs: T[]\n): void => {\n const { document } = useDOM();\n useIsomorphicLayoutEffect(() => {\n const someRefNotNull = refs.some((ref) => ref && ref.current !== null);\n if (!document || !someRefNotNull) {\n return;\n }\n const handleClick = (event: MouseEvent) => {\n const targetEl = event.target;\n const someRefHasTargetEl =\n isElement(targetEl) &&\n refs.some((ref) => ref && ref.current && ref.current.contains(targetEl));\n if (!someRefHasTargetEl) {\n callback(event);\n }\n };\n document.addEventListener(event, handleClick, {\n passive: true,\n capture: true,\n });\n return () => {\n document.removeEventListener(event, handleClick, true);\n };\n }, [document, callback, ...refs]);\n};\n\n/**\n * Завязывается на document.\n *\n * @private\n */\nexport const useGlobalOnClickOutside = <\n T extends React.RefObject<ElementType | null> | undefined | null,\n ElementType extends Element = Element,\n>(\n callback: (event: MouseEvent) => void,\n ...refs: T[]\n): void => {\n useGlobalOnEventOutside('click', callback, ...refs);\n};\n"],"names":["isElement","useDOM","useIsomorphicLayoutEffect","useGlobalOnEventOutside","event","callback","refs","document","someRefNotNull","some","ref","current","handleClick","targetEl","target","someRefHasTargetEl","contains","addEventListener","passive","capture","removeEventListener","useGlobalOnClickOutside"],"mappings":"AACA,SAASA,SAAS,EAAEC,MAAM,QAAQ,gBAAa;AAC/C,SAASC,yBAAyB,QAAQ,sCAAmC;AAE7E,OAAO,MAAMC,0BAA0B,CAIrCC,OACAC,UACA,GAAGC;IAEH,MAAM,EAAEC,QAAQ,EAAE,GAAGN;IACrBC,0BAA0B;QACxB,MAAMM,iBAAiBF,KAAKG,IAAI,CAAC,CAACC,MAAQA,OAAOA,IAAIC,OAAO,KAAK;QACjE,IAAI,CAACJ,YAAY,CAACC,gBAAgB;YAChC;QACF;QACA,MAAMI,cAAc,CAACR;YACnB,MAAMS,WAAWT,MAAMU,MAAM;YAC7B,MAAMC,qBACJf,UAAUa,aACVP,KAAKG,IAAI,CAAC,CAACC,MAAQA,OAAOA,IAAIC,OAAO,IAAID,IAAIC,OAAO,CAACK,QAAQ,CAACH;YAChE,IAAI,CAACE,oBAAoB;gBACvBV,SAASD;YACX;QACF;QACAG,SAASU,gBAAgB,CAACb,OAAOQ,aAAa;YAC5CM,SAAS;YACTC,SAAS;QACX;QACA,OAAO;YACLZ,SAASa,mBAAmB,CAAChB,OAAOQ,aAAa;QACnD;IACF,GAAG;QAACL;QAAUF;WAAaC;KAAK;AAClC,EAAE;AAEF;;;;CAIC,GACD,OAAO,MAAMe,0BAA0B,CAIrChB,UACA,GAAGC;IAEHH,wBAAwB,SAASE,aAAaC;AAChD,EAAE"}
1
+ {"version":3,"sources":["../../src/hooks/useGlobalOnClickOutside.ts"],"sourcesContent":["import type * as React from 'react';\nimport { isElement, useDOM } from '../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../lib/useIsomorphicLayoutEffect';\nimport { useStableCallback } from './useStableCallback';\n\nexport const useGlobalOnEventOutside = <\n T extends React.RefObject<ElementType | null> | undefined | null,\n ElementType extends Element = Element,\n>(\n event: Extract<keyof DocumentEventMap, 'click' | 'mousedown'>,\n callback: (event: MouseEvent) => void,\n ...refs: T[]\n): void => {\n const { document } = useDOM();\n const stableCallback = useStableCallback(callback);\n useIsomorphicLayoutEffect(() => {\n const someRefNotNull = refs.some((ref) => ref && ref.current !== null);\n if (!document || !someRefNotNull) {\n return;\n }\n const handleClick = (event: MouseEvent) => {\n const targetEl = event.target;\n const someRefHasTargetEl =\n isElement(targetEl) &&\n refs.some((ref) => ref && ref.current && ref.current.contains(targetEl));\n if (!someRefHasTargetEl) {\n stableCallback(event);\n }\n };\n document.addEventListener(event, handleClick, {\n passive: true,\n capture: true,\n });\n return () => {\n document.removeEventListener(event, handleClick, true);\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [document, stableCallback, event, ...refs]);\n};\n\n/**\n * Завязывается на document.\n *\n * @private\n */\nexport const useGlobalOnClickOutside = <\n T extends React.RefObject<ElementType | null> | undefined | null,\n ElementType extends Element = Element,\n>(\n callback: (event: MouseEvent) => void,\n ...refs: T[]\n): void => {\n useGlobalOnEventOutside('click', callback, ...refs);\n};\n"],"names":["isElement","useDOM","useIsomorphicLayoutEffect","useStableCallback","useGlobalOnEventOutside","event","callback","refs","document","stableCallback","someRefNotNull","some","ref","current","handleClick","targetEl","target","someRefHasTargetEl","contains","addEventListener","passive","capture","removeEventListener","useGlobalOnClickOutside"],"mappings":"AACA,SAASA,SAAS,EAAEC,MAAM,QAAQ,gBAAa;AAC/C,SAASC,yBAAyB,QAAQ,sCAAmC;AAC7E,SAASC,iBAAiB,QAAQ,yBAAsB;AAExD,OAAO,MAAMC,0BAA0B,CAIrCC,OACAC,UACA,GAAGC;IAEH,MAAM,EAAEC,QAAQ,EAAE,GAAGP;IACrB,MAAMQ,iBAAiBN,kBAAkBG;IACzCJ,0BAA0B;QACxB,MAAMQ,iBAAiBH,KAAKI,IAAI,CAAC,CAACC,MAAQA,OAAOA,IAAIC,OAAO,KAAK;QACjE,IAAI,CAACL,YAAY,CAACE,gBAAgB;YAChC;QACF;QACA,MAAMI,cAAc,CAACT;YACnB,MAAMU,WAAWV,MAAMW,MAAM;YAC7B,MAAMC,qBACJjB,UAAUe,aACVR,KAAKI,IAAI,CAAC,CAACC,MAAQA,OAAOA,IAAIC,OAAO,IAAID,IAAIC,OAAO,CAACK,QAAQ,CAACH;YAChE,IAAI,CAACE,oBAAoB;gBACvBR,eAAeJ;YACjB;QACF;QACAG,SAASW,gBAAgB,CAACd,OAAOS,aAAa;YAC5CM,SAAS;YACTC,SAAS;QACX;QACA,OAAO;YACLb,SAASc,mBAAmB,CAACjB,OAAOS,aAAa;QACnD;IACA,uDAAuD;IACzD,GAAG;QAACN;QAAUC;QAAgBJ;WAAUE;KAAK;AAC/C,EAAE;AAEF;;;;CAIC,GACD,OAAO,MAAMgB,0BAA0B,CAIrCjB,UACA,GAAGC;IAEHH,wBAAwB,SAASE,aAAaC;AAChD,EAAE"}
@@ -1,23 +1,5 @@
1
- import * as React from 'react';
1
+ import type * as React from 'react';
2
2
  export declare const ENABLE_KEYBOARD_INPUT_EVENT_NAME = "enableKeyboardInput";
3
3
  export declare const DISABLE_KEYBOARD_INPUT_EVENT_NAME = "disableKeyboardInput";
4
- /**
5
- * Чтобы оптимизировать рендер, сохраняем в ref.
6
- *
7
- * В контекст можно передать через getter, подробнее в примере ниже.
8
- *
9
- * ```tsx
10
- * const keyboardInputTrackerRef = useKeyboardInputTracker();
11
- * <SomeContext.Provider value={{
12
- * get keyboardInput() {
13
- * return keyboardInputTrackerRef.current;
14
- * }
15
- * }}>
16
- * {children}
17
- * </SomeContext.Provider>
18
- * ```
19
- *
20
- * @private
21
- */
22
4
  export declare function useKeyboardInputTracker(): React.RefObject<boolean>;
23
5
  //# sourceMappingURL=useKeyboardInputTracker.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"useKeyboardInputTracker.d.ts","sourceRoot":"","sources":["../../src/hooks/useKeyboardInputTracker.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,eAAO,MAAM,gCAAgC,wBAAwB,CAAC;AACtE,eAAO,MAAM,iCAAiC,yBAAyB,CAAC;AAOxE;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,uBAAuB,IAAI,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,CAwDlE"}
1
+ {"version":3,"file":"useKeyboardInputTracker.d.ts","sourceRoot":"","sources":["../../src/hooks/useKeyboardInputTracker.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAKpC,eAAO,MAAM,gCAAgC,wBAAwB,CAAC;AACtE,eAAO,MAAM,iCAAiC,yBAAyB,CAAC;AAqExE,wBAAgB,uBAAuB,IAAI,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,CAyBlE"}
@@ -1,4 +1,3 @@
1
- import * as React from "react";
2
1
  import { isKeyboardFocusingStarted } from "../lib/accessibility.js";
3
2
  import { useDOM } from "../lib/dom.js";
4
3
  import { useIsomorphicLayoutEffect } from "../lib/useIsomorphicLayoutEffect.js";
@@ -8,52 +7,60 @@ const EVENT_OPTIONS = {
8
7
  passive: true,
9
8
  capture: true
10
9
  };
11
- /**
12
- * Чтобы оптимизировать рендер, сохраняем в ref.
13
- *
14
- * В контекст можно передать через getter, подробнее в примере ниже.
15
- *
16
- * ```tsx
17
- * const keyboardInputTrackerRef = useKeyboardInputTracker();
18
- * <SomeContext.Provider value={{
19
- * get keyboardInput() {
20
- * return keyboardInputTrackerRef.current;
21
- * }
22
- * }}>
23
- * {children}
24
- * </SomeContext.Provider>
25
- * ```
26
- *
27
- * @private
28
- */ export function useKeyboardInputTracker() {
10
+ let keyboardInputState = false;
11
+ let mountedTrackers = 0;
12
+ let detachListeners = null;
13
+ const keyboardFocusingStartedRef = {
14
+ get current () {
15
+ return keyboardInputState;
16
+ }
17
+ };
18
+ const setKeyboardInputState = (nextValue)=>{
19
+ if (keyboardInputState !== nextValue) {
20
+ keyboardInputState = nextValue;
21
+ }
22
+ };
23
+ const attachKeyboardInputListeners = (document)=>{
24
+ const handleKeydown = (event)=>{
25
+ if (isKeyboardFocusingStarted(event)) {
26
+ setKeyboardInputState(true);
27
+ }
28
+ };
29
+ const handleCustomEnableKeyboardEvent = ()=>{
30
+ setKeyboardInputState(true);
31
+ };
32
+ const handleCustomDisableKeyboardEvent = ()=>{
33
+ setKeyboardInputState(false);
34
+ };
35
+ document.addEventListener('keydown', handleKeydown, EVENT_OPTIONS);
36
+ document.addEventListener(ENABLE_KEYBOARD_INPUT_EVENT_NAME, handleCustomEnableKeyboardEvent, EVENT_OPTIONS);
37
+ document.addEventListener(DISABLE_KEYBOARD_INPUT_EVENT_NAME, handleCustomDisableKeyboardEvent, EVENT_OPTIONS);
38
+ document.addEventListener('mousedown', handleCustomDisableKeyboardEvent, EVENT_OPTIONS);
39
+ document.addEventListener('touchstart', handleCustomDisableKeyboardEvent, EVENT_OPTIONS);
40
+ return ()=>{
41
+ document.removeEventListener('keydown', handleKeydown, EVENT_OPTIONS);
42
+ document.removeEventListener(ENABLE_KEYBOARD_INPUT_EVENT_NAME, handleCustomEnableKeyboardEvent, EVENT_OPTIONS);
43
+ document.removeEventListener(DISABLE_KEYBOARD_INPUT_EVENT_NAME, handleCustomDisableKeyboardEvent, EVENT_OPTIONS);
44
+ document.removeEventListener('mousedown', handleCustomDisableKeyboardEvent, EVENT_OPTIONS);
45
+ document.removeEventListener('touchstart', handleCustomDisableKeyboardEvent, EVENT_OPTIONS);
46
+ };
47
+ };
48
+ export function useKeyboardInputTracker() {
29
49
  const { document } = useDOM();
30
- const keyboardFocusingStartedRef = React.useRef(false);
31
50
  useIsomorphicLayoutEffect(()=>{
32
51
  /* istanbul ignore if: невозможный кейс, т.к. в SSR эффекты не вызываются. Проверка на будущее, если вдруг эффект будет вызываться. */ if (!document) {
33
52
  return;
34
53
  }
35
- const handleKeydown = (event)=>{
36
- if (isKeyboardFocusingStarted(event)) {
37
- keyboardFocusingStartedRef.current = true;
38
- }
39
- };
40
- const handleCustomEnableKeyboardEvent = ()=>{
41
- keyboardFocusingStartedRef.current = true;
42
- };
43
- const handleCustomDisableKeyboardEvent = ()=>{
44
- keyboardFocusingStartedRef.current = false;
45
- };
46
- document.addEventListener('keydown', handleKeydown, EVENT_OPTIONS);
47
- document.addEventListener(ENABLE_KEYBOARD_INPUT_EVENT_NAME, handleCustomEnableKeyboardEvent, EVENT_OPTIONS);
48
- document.addEventListener(DISABLE_KEYBOARD_INPUT_EVENT_NAME, handleCustomDisableKeyboardEvent, EVENT_OPTIONS);
49
- document.addEventListener('mousedown', handleCustomDisableKeyboardEvent, EVENT_OPTIONS);
50
- document.addEventListener('touchstart', handleCustomDisableKeyboardEvent, EVENT_OPTIONS);
54
+ mountedTrackers += 1;
55
+ if (!detachListeners) {
56
+ detachListeners = attachKeyboardInputListeners(document);
57
+ }
51
58
  return ()=>{
52
- document.removeEventListener('keydown', handleKeydown, EVENT_OPTIONS);
53
- document.removeEventListener(ENABLE_KEYBOARD_INPUT_EVENT_NAME, handleCustomEnableKeyboardEvent, EVENT_OPTIONS);
54
- document.removeEventListener(DISABLE_KEYBOARD_INPUT_EVENT_NAME, handleCustomDisableKeyboardEvent, EVENT_OPTIONS);
55
- document.removeEventListener('mousedown', handleCustomDisableKeyboardEvent, EVENT_OPTIONS);
56
- document.removeEventListener('touchstart', handleCustomDisableKeyboardEvent, EVENT_OPTIONS);
59
+ mountedTrackers -= 1;
60
+ if (mountedTrackers === 0 && detachListeners) {
61
+ detachListeners();
62
+ detachListeners = null;
63
+ }
57
64
  };
58
65
  }, [
59
66
  document
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/hooks/useKeyboardInputTracker.ts"],"sourcesContent":["import * as React from 'react';\nimport { isKeyboardFocusingStarted } from '../lib/accessibility';\nimport { useDOM } from '../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../lib/useIsomorphicLayoutEffect';\n\nexport const ENABLE_KEYBOARD_INPUT_EVENT_NAME = 'enableKeyboardInput';\nexport const DISABLE_KEYBOARD_INPUT_EVENT_NAME = 'disableKeyboardInput';\n\nconst EVENT_OPTIONS = {\n passive: true,\n capture: true,\n};\n\n/**\n * Чтобы оптимизировать рендер, сохраняем в ref.\n *\n * В контекст можно передать через getter, подробнее в примере ниже.\n *\n * ```tsx\n * const keyboardInputTrackerRef = useKeyboardInputTracker();\n * <SomeContext.Provider value={{\n * get keyboardInput() {\n * return keyboardInputTrackerRef.current;\n * }\n * }}>\n * {children}\n * </SomeContext.Provider>\n * ```\n *\n * @private\n */\nexport function useKeyboardInputTracker(): React.RefObject<boolean> {\n const { document } = useDOM();\n const keyboardFocusingStartedRef = React.useRef(false);\n\n useIsomorphicLayoutEffect(() => {\n /* istanbul ignore if: невозможный кейс, т.к. в SSR эффекты не вызываются. Проверка на будущее, если вдруг эффект будет вызываться. */\n if (!document) {\n return;\n }\n\n const handleKeydown = (event: KeyboardEvent) => {\n if (isKeyboardFocusingStarted(event)) {\n keyboardFocusingStartedRef.current = true;\n }\n };\n\n const handleCustomEnableKeyboardEvent = () => {\n keyboardFocusingStartedRef.current = true;\n };\n\n const handleCustomDisableKeyboardEvent = () => {\n keyboardFocusingStartedRef.current = false;\n };\n\n document.addEventListener('keydown', handleKeydown, EVENT_OPTIONS);\n document.addEventListener(\n ENABLE_KEYBOARD_INPUT_EVENT_NAME,\n handleCustomEnableKeyboardEvent,\n EVENT_OPTIONS,\n );\n document.addEventListener(\n DISABLE_KEYBOARD_INPUT_EVENT_NAME,\n handleCustomDisableKeyboardEvent,\n EVENT_OPTIONS,\n );\n document.addEventListener('mousedown', handleCustomDisableKeyboardEvent, EVENT_OPTIONS);\n document.addEventListener('touchstart', handleCustomDisableKeyboardEvent, EVENT_OPTIONS);\n\n return () => {\n document.removeEventListener('keydown', handleKeydown, EVENT_OPTIONS);\n document.removeEventListener(\n ENABLE_KEYBOARD_INPUT_EVENT_NAME,\n handleCustomEnableKeyboardEvent,\n EVENT_OPTIONS,\n );\n document.removeEventListener(\n DISABLE_KEYBOARD_INPUT_EVENT_NAME,\n handleCustomDisableKeyboardEvent,\n EVENT_OPTIONS,\n );\n document.removeEventListener('mousedown', handleCustomDisableKeyboardEvent, EVENT_OPTIONS);\n document.removeEventListener('touchstart', handleCustomDisableKeyboardEvent, EVENT_OPTIONS);\n };\n }, [document]);\n\n return keyboardFocusingStartedRef;\n}\n"],"names":["React","isKeyboardFocusingStarted","useDOM","useIsomorphicLayoutEffect","ENABLE_KEYBOARD_INPUT_EVENT_NAME","DISABLE_KEYBOARD_INPUT_EVENT_NAME","EVENT_OPTIONS","passive","capture","useKeyboardInputTracker","document","keyboardFocusingStartedRef","useRef","handleKeydown","event","current","handleCustomEnableKeyboardEvent","handleCustomDisableKeyboardEvent","addEventListener","removeEventListener"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,yBAAyB,QAAQ,0BAAuB;AACjE,SAASC,MAAM,QAAQ,gBAAa;AACpC,SAASC,yBAAyB,QAAQ,sCAAmC;AAE7E,OAAO,MAAMC,mCAAmC,sBAAsB;AACtE,OAAO,MAAMC,oCAAoC,uBAAuB;AAExE,MAAMC,gBAAgB;IACpBC,SAAS;IACTC,SAAS;AACX;AAEA;;;;;;;;;;;;;;;;;CAiBC,GACD,OAAO,SAASC;IACd,MAAM,EAAEC,QAAQ,EAAE,GAAGR;IACrB,MAAMS,6BAA6BX,MAAMY,MAAM,CAAC;IAEhDT,0BAA0B;QACxB,oIAAoI,GACpI,IAAI,CAACO,UAAU;YACb;QACF;QAEA,MAAMG,gBAAgB,CAACC;YACrB,IAAIb,0BAA0Ba,QAAQ;gBACpCH,2BAA2BI,OAAO,GAAG;YACvC;QACF;QAEA,MAAMC,kCAAkC;YACtCL,2BAA2BI,OAAO,GAAG;QACvC;QAEA,MAAME,mCAAmC;YACvCN,2BAA2BI,OAAO,GAAG;QACvC;QAEAL,SAASQ,gBAAgB,CAAC,WAAWL,eAAeP;QACpDI,SAASQ,gBAAgB,CACvBd,kCACAY,iCACAV;QAEFI,SAASQ,gBAAgB,CACvBb,mCACAY,kCACAX;QAEFI,SAASQ,gBAAgB,CAAC,aAAaD,kCAAkCX;QACzEI,SAASQ,gBAAgB,CAAC,cAAcD,kCAAkCX;QAE1E,OAAO;YACLI,SAASS,mBAAmB,CAAC,WAAWN,eAAeP;YACvDI,SAASS,mBAAmB,CAC1Bf,kCACAY,iCACAV;YAEFI,SAASS,mBAAmB,CAC1Bd,mCACAY,kCACAX;YAEFI,SAASS,mBAAmB,CAAC,aAAaF,kCAAkCX;YAC5EI,SAASS,mBAAmB,CAAC,cAAcF,kCAAkCX;QAC/E;IACF,GAAG;QAACI;KAAS;IAEb,OAAOC;AACT"}
1
+ {"version":3,"sources":["../../src/hooks/useKeyboardInputTracker.ts"],"sourcesContent":["import type * as React from 'react';\nimport { isKeyboardFocusingStarted } from '../lib/accessibility';\nimport { useDOM } from '../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../lib/useIsomorphicLayoutEffect';\n\nexport const ENABLE_KEYBOARD_INPUT_EVENT_NAME = 'enableKeyboardInput';\nexport const DISABLE_KEYBOARD_INPUT_EVENT_NAME = 'disableKeyboardInput';\n\nconst EVENT_OPTIONS = {\n passive: true,\n capture: true,\n};\n\nlet keyboardInputState = false;\nlet mountedTrackers = 0;\nlet detachListeners: null | (() => void) = null;\n\nconst keyboardFocusingStartedRef: React.RefObject<boolean> = {\n get current() {\n return keyboardInputState;\n },\n};\n\nconst setKeyboardInputState = (nextValue: boolean) => {\n if (keyboardInputState !== nextValue) {\n keyboardInputState = nextValue;\n }\n};\n\nconst attachKeyboardInputListeners = (document: Document) => {\n const handleKeydown = (event: KeyboardEvent) => {\n if (isKeyboardFocusingStarted(event)) {\n setKeyboardInputState(true);\n }\n };\n\n const handleCustomEnableKeyboardEvent = () => {\n setKeyboardInputState(true);\n };\n\n const handleCustomDisableKeyboardEvent = () => {\n setKeyboardInputState(false);\n };\n\n document.addEventListener('keydown', handleKeydown, EVENT_OPTIONS);\n document.addEventListener(\n ENABLE_KEYBOARD_INPUT_EVENT_NAME,\n handleCustomEnableKeyboardEvent,\n EVENT_OPTIONS,\n );\n document.addEventListener(\n DISABLE_KEYBOARD_INPUT_EVENT_NAME,\n handleCustomDisableKeyboardEvent,\n EVENT_OPTIONS,\n );\n document.addEventListener('mousedown', handleCustomDisableKeyboardEvent, EVENT_OPTIONS);\n document.addEventListener('touchstart', handleCustomDisableKeyboardEvent, EVENT_OPTIONS);\n\n return () => {\n document.removeEventListener('keydown', handleKeydown, EVENT_OPTIONS);\n document.removeEventListener(\n ENABLE_KEYBOARD_INPUT_EVENT_NAME,\n handleCustomEnableKeyboardEvent,\n EVENT_OPTIONS,\n );\n document.removeEventListener(\n DISABLE_KEYBOARD_INPUT_EVENT_NAME,\n handleCustomDisableKeyboardEvent,\n EVENT_OPTIONS,\n );\n document.removeEventListener('mousedown', handleCustomDisableKeyboardEvent, EVENT_OPTIONS);\n document.removeEventListener('touchstart', handleCustomDisableKeyboardEvent, EVENT_OPTIONS);\n };\n};\n\nexport function useKeyboardInputTracker(): React.RefObject<boolean> {\n const { document } = useDOM();\n\n useIsomorphicLayoutEffect(() => {\n /* istanbul ignore if: невозможный кейс, т.к. в SSR эффекты не вызываются. Проверка на будущее, если вдруг эффект будет вызываться. */\n if (!document) {\n return;\n }\n\n mountedTrackers += 1;\n\n if (!detachListeners) {\n detachListeners = attachKeyboardInputListeners(document);\n }\n\n return () => {\n mountedTrackers -= 1;\n if (mountedTrackers === 0 && detachListeners) {\n detachListeners();\n detachListeners = null;\n }\n };\n }, [document]);\n\n return keyboardFocusingStartedRef;\n}\n"],"names":["isKeyboardFocusingStarted","useDOM","useIsomorphicLayoutEffect","ENABLE_KEYBOARD_INPUT_EVENT_NAME","DISABLE_KEYBOARD_INPUT_EVENT_NAME","EVENT_OPTIONS","passive","capture","keyboardInputState","mountedTrackers","detachListeners","keyboardFocusingStartedRef","current","setKeyboardInputState","nextValue","attachKeyboardInputListeners","document","handleKeydown","event","handleCustomEnableKeyboardEvent","handleCustomDisableKeyboardEvent","addEventListener","removeEventListener","useKeyboardInputTracker"],"mappings":"AACA,SAASA,yBAAyB,QAAQ,0BAAuB;AACjE,SAASC,MAAM,QAAQ,gBAAa;AACpC,SAASC,yBAAyB,QAAQ,sCAAmC;AAE7E,OAAO,MAAMC,mCAAmC,sBAAsB;AACtE,OAAO,MAAMC,oCAAoC,uBAAuB;AAExE,MAAMC,gBAAgB;IACpBC,SAAS;IACTC,SAAS;AACX;AAEA,IAAIC,qBAAqB;AACzB,IAAIC,kBAAkB;AACtB,IAAIC,kBAAuC;AAE3C,MAAMC,6BAAuD;IAC3D,IAAIC,WAAU;QACZ,OAAOJ;IACT;AACF;AAEA,MAAMK,wBAAwB,CAACC;IAC7B,IAAIN,uBAAuBM,WAAW;QACpCN,qBAAqBM;IACvB;AACF;AAEA,MAAMC,+BAA+B,CAACC;IACpC,MAAMC,gBAAgB,CAACC;QACrB,IAAIlB,0BAA0BkB,QAAQ;YACpCL,sBAAsB;QACxB;IACF;IAEA,MAAMM,kCAAkC;QACtCN,sBAAsB;IACxB;IAEA,MAAMO,mCAAmC;QACvCP,sBAAsB;IACxB;IAEAG,SAASK,gBAAgB,CAAC,WAAWJ,eAAeZ;IACpDW,SAASK,gBAAgB,CACvBlB,kCACAgB,iCACAd;IAEFW,SAASK,gBAAgB,CACvBjB,mCACAgB,kCACAf;IAEFW,SAASK,gBAAgB,CAAC,aAAaD,kCAAkCf;IACzEW,SAASK,gBAAgB,CAAC,cAAcD,kCAAkCf;IAE1E,OAAO;QACLW,SAASM,mBAAmB,CAAC,WAAWL,eAAeZ;QACvDW,SAASM,mBAAmB,CAC1BnB,kCACAgB,iCACAd;QAEFW,SAASM,mBAAmB,CAC1BlB,mCACAgB,kCACAf;QAEFW,SAASM,mBAAmB,CAAC,aAAaF,kCAAkCf;QAC5EW,SAASM,mBAAmB,CAAC,cAAcF,kCAAkCf;IAC/E;AACF;AAEA,OAAO,SAASkB;IACd,MAAM,EAAEP,QAAQ,EAAE,GAAGf;IAErBC,0BAA0B;QACxB,oIAAoI,GACpI,IAAI,CAACc,UAAU;YACb;QACF;QAEAP,mBAAmB;QAEnB,IAAI,CAACC,iBAAiB;YACpBA,kBAAkBK,6BAA6BC;QACjD;QAEA,OAAO;YACLP,mBAAmB;YACnB,IAAIA,oBAAoB,KAAKC,iBAAiB;gBAC5CA;gBACAA,kBAAkB;YACpB;QACF;IACF,GAAG;QAACM;KAAS;IAEb,OAAOL;AACT"}
@@ -0,0 +1,3 @@
1
+ import * as React from 'react';
2
+ export declare function useLatestRef<T>(value: T): React.RefObject<T>;
3
+ //# sourceMappingURL=useLatestRef.d.ts.map