@vkontakte/vkui 7.0.0-dev-d4929f.0 → 7.0.0-dev-efd91c.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 (522) hide show
  1. package/dist/components/Accordion/AccordionContent.js +8 -8
  2. package/dist/components/Accordion/AccordionContent.js.map +1 -1
  3. package/dist/components/Accordion/AccordionSummary.js +1 -1
  4. package/dist/components/ActionSheet/ActionSheet.js +5 -5
  5. package/dist/components/ActionSheet/ActionSheetDropdownMenu.js +1 -1
  6. package/dist/components/ActionSheet/ActionSheetDropdownMenu.js.map +1 -1
  7. package/dist/components/ActionSheet/ActionSheetDropdownSheet.js +1 -1
  8. package/dist/components/ActionSheet/ActionSheetDropdownSheet.js.map +1 -1
  9. package/dist/components/ActionSheetItem/ActionSheetItem.js +10 -10
  10. package/dist/components/ActionSheetItem/ActionSheetItem.js.map +1 -1
  11. package/dist/components/ActionSheetItem/subcomponents/Radio/Radio.js +1 -1
  12. package/dist/components/Alert/Alert.js +3 -3
  13. package/dist/components/Alert/Alert.js.map +1 -1
  14. package/dist/components/Alert/AlertAction.js +2 -2
  15. package/dist/components/Alert/AlertAction.js.map +1 -1
  16. package/dist/components/Alert/AlertActions.js +6 -6
  17. package/dist/components/Alert/AlertActions.js.map +1 -1
  18. package/dist/components/Alert/AlertTypography.js +5 -5
  19. package/dist/components/AppRoot/AppRoot.js +1 -1
  20. package/dist/components/AppRoot/AppRoot.js.map +1 -1
  21. package/dist/components/AppRoot/helpers.js +4 -4
  22. package/dist/components/AppRoot/helpers.js.map +1 -1
  23. package/dist/components/AspectRatio/AspectRatio.js +1 -1
  24. package/dist/components/AspectRatio/AspectRatio.js.map +1 -1
  25. package/dist/components/Avatar/Avatar.js +9 -9
  26. package/dist/components/Avatar/Avatar.js.map +1 -1
  27. package/dist/components/Avatar/AvatarBadge/AvatarBadge.js +1 -1
  28. package/dist/components/Avatar/AvatarBadge/AvatarBadge.js.map +1 -1
  29. package/dist/components/Avatar/AvatarBadge/AvatarBadgeWithPreset.js +2 -2
  30. package/dist/components/Avatar/AvatarBadge/AvatarBadgeWithPreset.js.map +1 -1
  31. package/dist/components/Avatar/helpers.d.ts +2 -1
  32. package/dist/components/Avatar/helpers.d.ts.map +1 -1
  33. package/dist/components/Avatar/helpers.js +2 -2
  34. package/dist/components/Avatar/helpers.js.map +1 -1
  35. package/dist/components/Badge/Badge.js +3 -3
  36. package/dist/components/Badge/Badge.js.map +1 -1
  37. package/dist/components/Banner/Banner.js +10 -10
  38. package/dist/components/Banner/Banner.js.map +1 -1
  39. package/dist/components/BaseGallery/BaseGallery.js +10 -10
  40. package/dist/components/BaseGallery/BaseGallery.js.map +1 -1
  41. package/dist/components/BaseGallery/CarouselBase/CarouselBase.js +10 -10
  42. package/dist/components/BaseGallery/CarouselBase/CarouselBase.js.map +1 -1
  43. package/dist/components/Button/Button.js +26 -26
  44. package/dist/components/Button/Button.js.map +1 -1
  45. package/dist/components/ButtonGroup/ButtonGroup.js +9 -9
  46. package/dist/components/ButtonGroup/ButtonGroup.js.map +1 -1
  47. package/dist/components/Calendar/Calendar.d.ts +7 -7
  48. package/dist/components/Calendar/Calendar.d.ts.map +1 -1
  49. package/dist/components/Calendar/Calendar.js +30 -10
  50. package/dist/components/Calendar/Calendar.js.map +1 -1
  51. package/dist/components/CalendarDay/CalendarDay.d.ts +4 -1
  52. package/dist/components/CalendarDay/CalendarDay.d.ts.map +1 -1
  53. package/dist/components/CalendarDay/CalendarDay.js +13 -11
  54. package/dist/components/CalendarDay/CalendarDay.js.map +1 -1
  55. package/dist/components/CalendarDays/CalendarDays.d.ts +6 -3
  56. package/dist/components/CalendarDays/CalendarDays.d.ts.map +1 -1
  57. package/dist/components/CalendarDays/CalendarDays.js +10 -8
  58. package/dist/components/CalendarDays/CalendarDays.js.map +1 -1
  59. package/dist/components/CalendarHeader/CalendarHeader.d.ts +8 -2
  60. package/dist/components/CalendarHeader/CalendarHeader.d.ts.map +1 -1
  61. package/dist/components/CalendarHeader/CalendarHeader.js +25 -17
  62. package/dist/components/CalendarHeader/CalendarHeader.js.map +1 -1
  63. package/dist/components/CalendarRange/CalendarRange.d.ts +8 -4
  64. package/dist/components/CalendarRange/CalendarRange.d.ts.map +1 -1
  65. package/dist/components/CalendarRange/CalendarRange.js +18 -13
  66. package/dist/components/CalendarRange/CalendarRange.js.map +1 -1
  67. package/dist/components/CalendarTime/CalendarTime.d.ts +10 -3
  68. package/dist/components/CalendarTime/CalendarTime.d.ts.map +1 -1
  69. package/dist/components/CalendarTime/CalendarTime.js +15 -10
  70. package/dist/components/CalendarTime/CalendarTime.js.map +1 -1
  71. package/dist/components/Card/Card.d.ts +1 -1
  72. package/dist/components/Card/Card.d.ts.map +1 -1
  73. package/dist/components/Card/Card.js +1 -1
  74. package/dist/components/Card/Card.js.map +1 -1
  75. package/dist/components/CardGrid/CardGrid.js +3 -3
  76. package/dist/components/CardGrid/CardGrid.js.map +1 -1
  77. package/dist/components/CardScroll/CardScroll.js +4 -4
  78. package/dist/components/CardScroll/CardScroll.js.map +1 -1
  79. package/dist/components/Cell/Cell.js +4 -4
  80. package/dist/components/Cell/Cell.js.map +1 -1
  81. package/dist/components/Cell/CellCheckbox/CellCheckbox.js +4 -4
  82. package/dist/components/Cell/CellCheckbox/CellCheckbox.js.map +1 -1
  83. package/dist/components/Cell/CellDragger/CellDragger.js +2 -2
  84. package/dist/components/Cell/CellDragger/CellDragger.js.map +1 -1
  85. package/dist/components/CellButton/CellButton.js +4 -4
  86. package/dist/components/CellButton/CellButton.js.map +1 -1
  87. package/dist/components/Checkbox/CheckboxInput/CheckboxInput.js +11 -11
  88. package/dist/components/Checkbox/CheckboxInput/CheckboxInput.js.map +1 -1
  89. package/dist/components/Checkbox/CheckboxSimple/CheckboxSimple.js +3 -3
  90. package/dist/components/Checkbox/CheckboxSimple/CheckboxSimple.js.map +1 -1
  91. package/dist/components/ChipsInputBase/Chip/Chip.js +9 -9
  92. package/dist/components/ChipsInputBase/Chip/Chip.js.map +1 -1
  93. package/dist/components/ChipsInputBase/ChipsInputBase.js +5 -5
  94. package/dist/components/ChipsInputBase/ChipsInputBase.js.map +1 -1
  95. package/dist/components/ChipsSelect/ChipsSelect.js +4 -4
  96. package/dist/components/ChipsSelect/ChipsSelect.js.map +1 -1
  97. package/dist/components/Clickable/Clickable.d.ts.map +1 -1
  98. package/dist/components/Clickable/Clickable.js +2 -11
  99. package/dist/components/Clickable/Clickable.js.map +1 -1
  100. package/dist/components/Clickable/useState.d.ts +1 -1
  101. package/dist/components/Clickable/useState.d.ts.map +1 -1
  102. package/dist/components/Clickable/useState.js +12 -19
  103. package/dist/components/Clickable/useState.js.map +1 -1
  104. package/dist/components/ContentBadge/ContentBadge.js +19 -19
  105. package/dist/components/ContentBadge/ContentBadge.js.map +1 -1
  106. package/dist/components/ContentBadge/ContentBadgeSlotIcon.js +3 -3
  107. package/dist/components/ContentCard/ContentCard.js +8 -8
  108. package/dist/components/ContentCard/ContentCard.js.map +1 -1
  109. package/dist/components/Counter/Counter.js +8 -8
  110. package/dist/components/Counter/Counter.js.map +1 -1
  111. package/dist/components/CustomScrollView/CustomScrollView.js +3 -3
  112. package/dist/components/CustomScrollView/CustomScrollView.js.map +1 -1
  113. package/dist/components/CustomSelect/CustomSelect.js +8 -8
  114. package/dist/components/CustomSelect/CustomSelect.js.map +1 -1
  115. package/dist/components/CustomSelect/CustomSelectInput/CustomSelectInput.js +7 -7
  116. package/dist/components/CustomSelect/CustomSelectInput/CustomSelectInput.js.map +1 -1
  117. package/dist/components/CustomSelectDropdown/CustomSelectDropdown.js +3 -3
  118. package/dist/components/CustomSelectDropdown/CustomSelectDropdown.js.map +1 -1
  119. package/dist/components/CustomSelectOption/CustomSelectOption.js +9 -9
  120. package/dist/components/CustomSelectOption/CustomSelectOption.js.map +1 -1
  121. package/dist/components/DateInput/DateInput.d.ts +12 -3
  122. package/dist/components/DateInput/DateInput.d.ts.map +1 -1
  123. package/dist/components/DateInput/DateInput.js +31 -16
  124. package/dist/components/DateInput/DateInput.js.map +1 -1
  125. package/dist/components/DateRangeInput/DateRangeInput.d.ts +15 -3
  126. package/dist/components/DateRangeInput/DateRangeInput.d.ts.map +1 -1
  127. package/dist/components/DateRangeInput/DateRangeInput.js +25 -14
  128. package/dist/components/DateRangeInput/DateRangeInput.js.map +1 -1
  129. package/dist/components/Div/Div.js +1 -1
  130. package/dist/components/DropZone/DropZone.js +1 -1
  131. package/dist/components/DropZone/DropZone.js.map +1 -1
  132. package/dist/components/DropZone/components/DropZoneGrid.js +3 -3
  133. package/dist/components/DropZone/components/DropZoneGrid.js.map +1 -1
  134. package/dist/components/Epic/Epic.js +1 -1
  135. package/dist/components/Epic/Epic.js.map +1 -1
  136. package/dist/components/FixedLayout/FixedLayout.js +3 -3
  137. package/dist/components/FixedLayout/FixedLayout.js.map +1 -1
  138. package/dist/components/Flex/Flex.js +12 -12
  139. package/dist/components/Flex/Flex.js.map +1 -1
  140. package/dist/components/Flex/FlexItem/FlexItem.js +9 -9
  141. package/dist/components/FloatingArrow/FloatingArrow.js +5 -5
  142. package/dist/components/FloatingArrow/FloatingArrow.js.map +1 -1
  143. package/dist/components/FocusTrap/FocusTrap.d.ts +2 -10
  144. package/dist/components/FocusTrap/FocusTrap.d.ts.map +1 -1
  145. package/dist/components/FocusTrap/FocusTrap.js +6 -168
  146. package/dist/components/FocusTrap/FocusTrap.js.map +1 -1
  147. package/dist/components/Footer/Footer.js +1 -1
  148. package/dist/components/Footer/Footer.js.map +1 -1
  149. package/dist/components/FormField/FormField.js +14 -14
  150. package/dist/components/FormField/FormField.js.map +1 -1
  151. package/dist/components/FormItem/FormItem.js +7 -7
  152. package/dist/components/FormItem/FormItem.js.map +1 -1
  153. package/dist/components/FormItem/FormItemTop/FormItemTop.js +1 -1
  154. package/dist/components/FormItem/FormItemTop/FormItemTopAside.js +1 -1
  155. package/dist/components/FormItem/FormItemTop/FormItemTopLabel.js +2 -2
  156. package/dist/components/FormItem/FormItemTop/FormItemTopLabel.js.map +1 -1
  157. package/dist/components/FormLayoutGroup/FormLayoutGroup.js +5 -5
  158. package/dist/components/FormLayoutGroup/FormLayoutGroup.js.map +1 -1
  159. package/dist/components/FormStatus/FormStatus.js +1 -1
  160. package/dist/components/FormStatus/FormStatus.js.map +1 -1
  161. package/dist/components/Gallery/Gallery.d.ts +1 -1
  162. package/dist/components/Gallery/Gallery.d.ts.map +1 -1
  163. package/dist/components/Gallery/Gallery.js +12 -3
  164. package/dist/components/Gallery/Gallery.js.map +1 -1
  165. package/dist/components/Gallery/hooks.d.ts +9 -1
  166. package/dist/components/Gallery/hooks.d.ts.map +1 -1
  167. package/dist/components/Gallery/hooks.js +43 -25
  168. package/dist/components/Gallery/hooks.js.map +1 -1
  169. package/dist/components/Gradient/Gradient.js +3 -3
  170. package/dist/components/Gradient/Gradient.js.map +1 -1
  171. package/dist/components/GridAvatar/GridAvatar.js +3 -3
  172. package/dist/components/GridAvatar/GridAvatar.js.map +1 -1
  173. package/dist/components/GridAvatar/GridAvatarBadge/GridAvatarBadge.js +1 -1
  174. package/dist/components/GridAvatar/GridAvatarBadge/GridAvatarBadge.js.map +1 -1
  175. package/dist/components/Group/GroupContainer.js +11 -11
  176. package/dist/components/Group/GroupContainer.js.map +1 -1
  177. package/dist/components/Group/GroupDescription.js +1 -1
  178. package/dist/components/Group/GroupExpandedContent.js +3 -3
  179. package/dist/components/Group/GroupExpandedContent.js.map +1 -1
  180. package/dist/components/Group/GroupHeader.js +1 -1
  181. package/dist/components/Header/Header.js +17 -17
  182. package/dist/components/Header/Header.js.map +1 -1
  183. package/dist/components/HorizontalCell/HorizontalCell.js +11 -11
  184. package/dist/components/HorizontalCell/HorizontalCell.js.map +1 -1
  185. package/dist/components/HorizontalScroll/HorizontalCellShowMore/HorizontalCellShowMore.js +6 -6
  186. package/dist/components/HorizontalScroll/HorizontalCellShowMore/HorizontalCellShowMore.js.map +1 -1
  187. package/dist/components/HorizontalScroll/HorizontalScroll.d.ts.map +1 -1
  188. package/dist/components/HorizontalScroll/HorizontalScroll.js +25 -32
  189. package/dist/components/HorizontalScroll/HorizontalScroll.js.map +1 -1
  190. package/dist/components/IconButton/IconButton.js +3 -3
  191. package/dist/components/IconButton/IconButton.js.map +1 -1
  192. package/dist/components/Image/Image.js +1 -1
  193. package/dist/components/Image/Image.js.map +1 -1
  194. package/dist/components/Image/ImageBadge/ImageBadge.js +1 -1
  195. package/dist/components/Image/ImageBadge/ImageBadge.js.map +1 -1
  196. package/dist/components/ImageBase/ImageBase.js +9 -9
  197. package/dist/components/ImageBase/ImageBase.js.map +1 -1
  198. package/dist/components/ImageBase/ImageBaseBadge/ImageBaseBadge.js +3 -3
  199. package/dist/components/ImageBase/ImageBaseBadge/ImageBaseBadge.js.map +1 -1
  200. package/dist/components/ImageBase/ImageBaseOverlay/ImageBaseOverlay.js +3 -3
  201. package/dist/components/ImageBase/ImageBaseOverlay/ImageBaseOverlay.js.map +1 -1
  202. package/dist/components/InfoRow/InfoRow.js +2 -2
  203. package/dist/components/InfoRow/InfoRow.js.map +1 -1
  204. package/dist/components/Input/Input.js +4 -4
  205. package/dist/components/Input/Input.js.map +1 -1
  206. package/dist/components/InputLike/InputLike.js +3 -3
  207. package/dist/components/InputLike/InputLike.js.map +1 -1
  208. package/dist/components/InputLike/InputLikeDivider.js +1 -1
  209. package/dist/components/InputLike/InputLikeDivider.js.map +1 -1
  210. package/dist/components/Link/Link.js +1 -1
  211. package/dist/components/Link/Link.js.map +1 -1
  212. package/dist/components/List/List.js +2 -2
  213. package/dist/components/List/List.js.map +1 -1
  214. package/dist/components/Mark/Mark.js +1 -1
  215. package/dist/components/MiniInfoCell/MiniInfoCell.js +11 -11
  216. package/dist/components/MiniInfoCell/MiniInfoCell.js.map +1 -1
  217. package/dist/components/ModalCard/ModalCard.js +5 -5
  218. package/dist/components/ModalCard/ModalCard.js.map +1 -1
  219. package/dist/components/ModalCardBase/ModalCardBase.js +6 -6
  220. package/dist/components/ModalCardBase/ModalCardBase.js.map +1 -1
  221. package/dist/components/ModalCardBase/ModalCardBaseCloseButton.js +1 -1
  222. package/dist/components/ModalDismissButton/ModalDismissButton.js +3 -3
  223. package/dist/components/ModalDismissButton/ModalDismissButton.js.map +1 -1
  224. package/dist/components/ModalPage/ModalPage.js +11 -11
  225. package/dist/components/ModalPage/ModalPage.js.map +1 -1
  226. package/dist/components/ModalPageHeader/ModalPageHeader.js +1 -1
  227. package/dist/components/ModalPageHeader/ModalPageHeader.js.map +1 -1
  228. package/dist/components/ModalRoot/ModalRoot.js +4 -4
  229. package/dist/components/ModalRoot/ModalRoot.js.map +1 -1
  230. package/dist/components/ModalRoot/ModalRootDesktop.js +4 -4
  231. package/dist/components/ModalRoot/ModalRootDesktop.js.map +1 -1
  232. package/dist/components/NativeSelect/NativeSelect.js +6 -6
  233. package/dist/components/NativeSelect/NativeSelect.js.map +1 -1
  234. package/dist/components/OnboardingTooltip/OnboardingTooltip.js +1 -1
  235. package/dist/components/Pagination/Pagination.js +3 -3
  236. package/dist/components/Pagination/PaginationPage/PaginationPageButton.js +2 -2
  237. package/dist/components/Pagination/PaginationPage/PaginationPageEllipsis.js +1 -1
  238. package/dist/components/Pagination/PaginationPage/PaginationPageEllipsis.js.map +1 -1
  239. package/dist/components/Pagination/PaginationPage/usePaginationPageClasses.js +1 -1
  240. package/dist/components/Pagination/PaginationPage/usePaginationPageClasses.js.map +1 -1
  241. package/dist/components/Panel/Panel.js +11 -11
  242. package/dist/components/Panel/Panel.js.map +1 -1
  243. package/dist/components/PanelHeader/PanelHeader.js +15 -15
  244. package/dist/components/PanelHeader/PanelHeader.js.map +1 -1
  245. package/dist/components/PanelHeaderBack/PanelHeaderBack.js +3 -3
  246. package/dist/components/PanelHeaderBack/PanelHeaderBack.js.map +1 -1
  247. package/dist/components/PanelHeaderButton/PanelHeaderButton.js +7 -7
  248. package/dist/components/PanelHeaderButton/PanelHeaderButton.js.map +1 -1
  249. package/dist/components/PanelHeaderContent/PanelHeaderContent.js +14 -14
  250. package/dist/components/PanelHeaderContent/PanelHeaderContent.js.map +1 -1
  251. package/dist/components/PanelHeaderContext/PanelHeaderContext.js +7 -7
  252. package/dist/components/PanelHeaderContext/PanelHeaderContext.js.map +1 -1
  253. package/dist/components/Placeholder/Placeholder.js +5 -5
  254. package/dist/components/Placeholder/Placeholder.js.map +1 -1
  255. package/dist/components/PopoutRoot/PopoutRoot.js +3 -3
  256. package/dist/components/PopoutRoot/PopoutRoot.js.map +1 -1
  257. package/dist/components/PopoutWrapper/PopoutWrapper.js +10 -10
  258. package/dist/components/PopoutWrapper/PopoutWrapper.js.map +1 -1
  259. package/dist/components/Popover/Popover.js +4 -4
  260. package/dist/components/Popover/Popover.js.map +1 -1
  261. package/dist/components/Popper/Popper.js +1 -1
  262. package/dist/components/Progress/Progress.js +5 -5
  263. package/dist/components/Progress/Progress.js.map +1 -1
  264. package/dist/components/PullToRefresh/PullToRefresh.js +3 -3
  265. package/dist/components/PullToRefresh/PullToRefresh.js.map +1 -1
  266. package/dist/components/PullToRefresh/PullToRefreshSpinner.js +3 -3
  267. package/dist/components/PullToRefresh/PullToRefreshSpinner.js.map +1 -1
  268. package/dist/components/Radio/Radio.js +1 -1
  269. package/dist/components/Radio/Radio.js.map +1 -1
  270. package/dist/components/Radio/RadioInput/RadioInput.js +4 -4
  271. package/dist/components/RadioGroup/RadioGroup.js +1 -1
  272. package/dist/components/RadioGroup/RadioGroup.js.map +1 -1
  273. package/dist/components/Removable/Removable.js +10 -10
  274. package/dist/components/Removable/Removable.js.map +1 -1
  275. package/dist/components/RichCell/RichCell.js +20 -20
  276. package/dist/components/RichCell/RichCell.js.map +1 -1
  277. package/dist/components/RichCell/RichCellIcon/RichCellIcon.js +1 -1
  278. package/dist/components/Root/Root.js +3 -3
  279. package/dist/components/Root/Root.js.map +1 -1
  280. package/dist/components/RootComponent/RootComponent.js +1 -1
  281. package/dist/components/RootComponent/RootComponent.js.map +1 -1
  282. package/dist/components/ScreenSpinner/ScreenSpinnerContainer.js +9 -9
  283. package/dist/components/ScreenSpinner/ScreenSpinnerContainer.js.map +1 -1
  284. package/dist/components/ScreenSpinner/ScreenSpinnerLoader.js +1 -1
  285. package/dist/components/ScreenSpinner/ScreenSpinnerLoader.js.map +1 -1
  286. package/dist/components/ScreenSpinner/ScreenSpinnerSwapIcon.js +2 -2
  287. package/dist/components/ScrollArrow/ScrollArrow.js +9 -9
  288. package/dist/components/ScrollArrow/ScrollArrow.js.map +1 -1
  289. package/dist/components/Search/Search.js +11 -11
  290. package/dist/components/Search/Search.js.map +1 -1
  291. package/dist/components/SegmentedControl/SegmentedControl.js +5 -5
  292. package/dist/components/SegmentedControl/SegmentedControl.js.map +1 -1
  293. package/dist/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.js +4 -4
  294. package/dist/components/SelectMimicry/SelectMimicry.js +5 -5
  295. package/dist/components/SelectMimicry/SelectMimicry.js.map +1 -1
  296. package/dist/components/SelectionControl/SelectionControl.js +3 -3
  297. package/dist/components/SelectionControl/SelectionControl.js.map +1 -1
  298. package/dist/components/SelectionControl/SelectionControlLabel/SelectionControlLabel.js +7 -7
  299. package/dist/components/SelectionControl/SelectionControlLabel/SelectionControlLabel.js.map +1 -1
  300. package/dist/components/Separator/Separator.js +9 -9
  301. package/dist/components/Separator/Separator.js.map +1 -1
  302. package/dist/components/SimpleCell/SimpleCell.js +18 -18
  303. package/dist/components/SimpleCell/SimpleCell.js.map +1 -1
  304. package/dist/components/SimpleGrid/SimpleGrid.js +9 -9
  305. package/dist/components/SimpleGrid/SimpleGrid.js.map +1 -1
  306. package/dist/components/Skeleton/Skeleton.js +1 -1
  307. package/dist/components/Skeleton/Skeleton.js.map +1 -1
  308. package/dist/components/Slider/Slider.js +11 -11
  309. package/dist/components/Slider/Slider.js.map +1 -1
  310. package/dist/components/Slider/SliderThumb/SliderThumb.js +3 -3
  311. package/dist/components/Slider/SliderThumb/SliderThumb.js.map +1 -1
  312. package/dist/components/Snackbar/Snackbar.js +13 -13
  313. package/dist/components/Snackbar/Snackbar.js.map +1 -1
  314. package/dist/components/Snackbar/subcomponents/Basic/Basic.js +12 -12
  315. package/dist/components/Snackbar/subcomponents/Basic/Basic.js.map +1 -1
  316. package/dist/components/Spacing/Spacing.js +1 -1
  317. package/dist/components/Spacing/Spacing.js.map +1 -1
  318. package/dist/components/Spinner/Spinner.js +1 -1
  319. package/dist/components/Spinner/Spinner.js.map +1 -1
  320. package/dist/components/SplitCol/SplitCol.js +5 -5
  321. package/dist/components/SplitCol/SplitCol.js.map +1 -1
  322. package/dist/components/SplitLayout/SplitLayout.js +2 -2
  323. package/dist/components/SplitLayout/SplitLayout.js.map +1 -1
  324. package/dist/components/SubnavigationBar/SubnavigationBar.js +4 -4
  325. package/dist/components/SubnavigationButton/SubnavigationButton.js +16 -16
  326. package/dist/components/SubnavigationButton/SubnavigationButton.js.map +1 -1
  327. package/dist/components/Switch/Switch.js +7 -7
  328. package/dist/components/Switch/Switch.js.map +1 -1
  329. package/dist/components/Tabbar/Tabbar.js +1 -1
  330. package/dist/components/Tabbar/Tabbar.js.map +1 -1
  331. package/dist/components/TabbarItem/TabbarItem.js +6 -6
  332. package/dist/components/TabbarItem/TabbarItem.js.map +1 -1
  333. package/dist/components/Tabs/Tabs.js +2 -2
  334. package/dist/components/Tabs/Tabs.js.map +1 -1
  335. package/dist/components/TabsItem/TabsItem.js +15 -15
  336. package/dist/components/TabsItem/TabsItem.js.map +1 -1
  337. package/dist/components/Tappable/Ripple.js +2 -2
  338. package/dist/components/Tappable/Ripple.js.map +1 -1
  339. package/dist/components/Tappable/Tappable.js +5 -5
  340. package/dist/components/Tappable/Tappable.js.map +1 -1
  341. package/dist/components/Tappable/state.js +4 -4
  342. package/dist/components/Textarea/Textarea.js +4 -4
  343. package/dist/components/Textarea/Textarea.js.map +1 -1
  344. package/dist/components/ToolButton/ToolButton.js +16 -16
  345. package/dist/components/ToolButton/ToolButton.js.map +1 -1
  346. package/dist/components/TooltipBase/TooltipBase.js +8 -8
  347. package/dist/components/TooltipBase/TooltipBase.js.map +1 -1
  348. package/dist/components/Typography/Caption/Caption.js +6 -6
  349. package/dist/components/Typography/Caption/Caption.js.map +1 -1
  350. package/dist/components/Typography/DisplayTitle/DisplayTitle.js +6 -6
  351. package/dist/components/Typography/EllipsisText/EllipsisText.d.ts +3 -3
  352. package/dist/components/Typography/EllipsisText/EllipsisText.d.ts.map +1 -1
  353. package/dist/components/Typography/EllipsisText/EllipsisText.js +8 -7
  354. package/dist/components/Typography/EllipsisText/EllipsisText.js.map +1 -1
  355. package/dist/components/Typography/Footnote/Footnote.js +3 -3
  356. package/dist/components/Typography/Footnote/Footnote.js.map +1 -1
  357. package/dist/components/Typography/Headline/Headline.js +4 -4
  358. package/dist/components/Typography/Paragraph/Paragraph.js +3 -3
  359. package/dist/components/Typography/Paragraph/Paragraph.js.map +1 -1
  360. package/dist/components/Typography/Subhead/Subhead.js +3 -3
  361. package/dist/components/Typography/Subhead/Subhead.js.map +1 -1
  362. package/dist/components/Typography/Text/Text.js +3 -3
  363. package/dist/components/Typography/Text/Text.js.map +1 -1
  364. package/dist/components/Typography/Title/Title.js +5 -5
  365. package/dist/components/Typography/Typography.js +4 -4
  366. package/dist/components/Typography/Typography.js.map +1 -1
  367. package/dist/components/UnstyledTextField/UnstyledTextField.js +1 -1
  368. package/dist/components/UnstyledTextField/UnstyledTextField.js.map +1 -1
  369. package/dist/components/UsersStack/UsersStack.js +14 -14
  370. package/dist/components/UsersStack/UsersStack.js.map +1 -1
  371. package/dist/components/View/View.js +5 -5
  372. package/dist/components/View/View.js.map +1 -1
  373. package/dist/components/View/ViewInfinite.js +4 -4
  374. package/dist/components/View/ViewInfinite.js.map +1 -1
  375. package/dist/components/VisuallyHidden/VisuallyHidden.js +1 -1
  376. package/dist/components/VisuallyHidden/VisuallyHidden.js.map +1 -1
  377. package/dist/components/WriteBar/WriteBar.js +7 -7
  378. package/dist/components/WriteBar/WriteBar.js.map +1 -1
  379. package/dist/components/WriteBarIcon/WriteBarIcon.js +4 -4
  380. package/dist/components/WriteBarIcon/WriteBarIcon.js.map +1 -1
  381. package/dist/components.css +1 -1
  382. package/dist/components.css.map +1 -1
  383. package/dist/cssm/components/Avatar/helpers.js +2 -2
  384. package/dist/cssm/components/Avatar/helpers.js.map +1 -1
  385. package/dist/cssm/components/Calendar/Calendar.js +15 -5
  386. package/dist/cssm/components/Calendar/Calendar.js.map +1 -1
  387. package/dist/cssm/components/CalendarDay/CalendarDay.js +2 -1
  388. package/dist/cssm/components/CalendarDay/CalendarDay.js.map +1 -1
  389. package/dist/cssm/components/CalendarDays/CalendarDays.js +2 -1
  390. package/dist/cssm/components/CalendarDays/CalendarDays.js.map +1 -1
  391. package/dist/cssm/components/CalendarHeader/CalendarHeader.js +7 -3
  392. package/dist/cssm/components/CalendarHeader/CalendarHeader.js.map +1 -1
  393. package/dist/cssm/components/CalendarRange/CalendarRange.js +9 -5
  394. package/dist/cssm/components/CalendarRange/CalendarRange.js.map +1 -1
  395. package/dist/cssm/components/CalendarTime/CalendarTime.js +11 -6
  396. package/dist/cssm/components/CalendarTime/CalendarTime.js.map +1 -1
  397. package/dist/cssm/components/CalendarTime/CalendarTime.module.css +4 -0
  398. package/dist/cssm/components/Card/Card.js +1 -1
  399. package/dist/cssm/components/Card/Card.js.map +1 -1
  400. package/dist/cssm/components/Card/Card.module.css +3 -2
  401. package/dist/cssm/components/Clickable/Clickable.js +1 -10
  402. package/dist/cssm/components/Clickable/Clickable.js.map +1 -1
  403. package/dist/cssm/components/Clickable/Clickable.module.css +7 -4
  404. package/dist/cssm/components/Clickable/useState.js +10 -11
  405. package/dist/cssm/components/Clickable/useState.js.map +1 -1
  406. package/dist/cssm/components/DateInput/DateInput.js +19 -10
  407. package/dist/cssm/components/DateInput/DateInput.js.map +1 -1
  408. package/dist/cssm/components/DateRangeInput/DateRangeInput.js +17 -9
  409. package/dist/cssm/components/DateRangeInput/DateRangeInput.js.map +1 -1
  410. package/dist/cssm/components/FocusTrap/FocusTrap.js +6 -167
  411. package/dist/cssm/components/FocusTrap/FocusTrap.js.map +1 -1
  412. package/dist/cssm/components/Gallery/Gallery.js +9 -2
  413. package/dist/cssm/components/Gallery/Gallery.js.map +1 -1
  414. package/dist/cssm/components/Gallery/hooks.js +43 -25
  415. package/dist/cssm/components/Gallery/hooks.js.map +1 -1
  416. package/dist/cssm/components/Group/Group.module.css +2 -0
  417. package/dist/cssm/components/HorizontalCell/HorizontalCell.module.css +5 -0
  418. package/dist/cssm/components/HorizontalScroll/HorizontalScroll.js +20 -27
  419. package/dist/cssm/components/HorizontalScroll/HorizontalScroll.js.map +1 -1
  420. package/dist/cssm/components/Popover/Popover.js +1 -1
  421. package/dist/cssm/components/Popover/Popover.js.map +1 -1
  422. package/dist/cssm/components/Typography/EllipsisText/EllipsisText.js +5 -4
  423. package/dist/cssm/components/Typography/EllipsisText/EllipsisText.js.map +1 -1
  424. package/dist/cssm/hooks/useDateInput.js +30 -9
  425. package/dist/cssm/hooks/useDateInput.js.map +1 -1
  426. package/dist/cssm/hooks/useFocusTrap.js +185 -0
  427. package/dist/cssm/hooks/useFocusTrap.js.map +1 -0
  428. package/dist/cssm/index.js +1 -0
  429. package/dist/cssm/index.js.map +1 -1
  430. package/dist/cssm/lib/animation/index.js +1 -0
  431. package/dist/cssm/lib/animation/index.js.map +1 -1
  432. package/dist/cssm/lib/animation/useCSSTransition.js +134 -0
  433. package/dist/cssm/lib/animation/useCSSTransition.js.map +1 -0
  434. package/dist/cssm/lib/animation/useCSSTransition.stories.module.css +59 -0
  435. package/dist/cssm/lib/floating/customResizeObserver.js +0 -1
  436. package/dist/cssm/lib/floating/customResizeObserver.js.map +1 -1
  437. package/dist/cssm/lib/floating/types/component.js.map +1 -1
  438. package/dist/cssm/lib/floating/useFloatingWithInteractions/index.js.map +1 -1
  439. package/dist/cssm/lib/floating/useFloatingWithInteractions/types.js.map +1 -1
  440. package/dist/cssm/lib/floating/useFloatingWithInteractions/useFloatingWithInteractions.js +14 -1
  441. package/dist/cssm/lib/floating/useFloatingWithInteractions/useFloatingWithInteractions.js.map +1 -1
  442. package/dist/hooks/useAdaptivityConditionalRender/constants.js +8 -8
  443. package/dist/hooks/useDateInput.d.ts +2 -1
  444. package/dist/hooks/useDateInput.d.ts.map +1 -1
  445. package/dist/hooks/useDateInput.js +30 -9
  446. package/dist/hooks/useDateInput.js.map +1 -1
  447. package/dist/hooks/useFocusTrap.d.ts +34 -0
  448. package/dist/hooks/useFocusTrap.d.ts.map +1 -0
  449. package/dist/hooks/useFocusTrap.js +186 -0
  450. package/dist/hooks/useFocusTrap.js.map +1 -0
  451. package/dist/hooks/useFocusVisibleClassName.js +3 -3
  452. package/dist/hooks/useFocusVisibleClassName.js.map +1 -1
  453. package/dist/index.d.ts +2 -0
  454. package/dist/index.d.ts.map +1 -1
  455. package/dist/index.js +1 -0
  456. package/dist/index.js.map +1 -1
  457. package/dist/lib/animation/fades.js +2 -2
  458. package/dist/lib/animation/index.d.ts +1 -0
  459. package/dist/lib/animation/index.d.ts.map +1 -1
  460. package/dist/lib/animation/index.js +1 -0
  461. package/dist/lib/animation/index.js.map +1 -1
  462. package/dist/lib/animation/transformOrigin.js +12 -12
  463. package/dist/lib/animation/useCSSTransition.d.ts +29 -0
  464. package/dist/lib/animation/useCSSTransition.d.ts.map +1 -0
  465. package/dist/lib/animation/useCSSTransition.js +134 -0
  466. package/dist/lib/animation/useCSSTransition.js.map +1 -0
  467. package/dist/lib/floating/customResizeObserver.d.ts.map +1 -1
  468. package/dist/lib/floating/customResizeObserver.js +0 -1
  469. package/dist/lib/floating/customResizeObserver.js.map +1 -1
  470. package/dist/lib/floating/types/component.d.ts +2 -2
  471. package/dist/lib/floating/types/component.d.ts.map +1 -1
  472. package/dist/lib/floating/types/component.js.map +1 -1
  473. package/dist/lib/floating/useFloatingWithInteractions/index.d.ts +1 -0
  474. package/dist/lib/floating/useFloatingWithInteractions/index.d.ts.map +1 -1
  475. package/dist/lib/floating/useFloatingWithInteractions/index.js.map +1 -1
  476. package/dist/lib/floating/useFloatingWithInteractions/types.d.ts +2 -1
  477. package/dist/lib/floating/useFloatingWithInteractions/types.d.ts.map +1 -1
  478. package/dist/lib/floating/useFloatingWithInteractions/types.js.map +1 -1
  479. package/dist/lib/floating/useFloatingWithInteractions/useFloatingWithInteractions.d.ts.map +1 -1
  480. package/dist/lib/floating/useFloatingWithInteractions/useFloatingWithInteractions.js +14 -1
  481. package/dist/lib/floating/useFloatingWithInteractions/useFloatingWithInteractions.js.map +1 -1
  482. package/dist/lib/layouts/gaps.js +18 -18
  483. package/dist/lib/spacings/sizes.js +9 -9
  484. package/dist/lib/tokens/TokensClassProvider.js +1 -1
  485. package/dist/lib/tokens/TokensClassProvider.js.map +1 -1
  486. package/dist/vkui.css +1 -1
  487. package/dist/vkui.css.map +1 -1
  488. package/package.json +5 -5
  489. package/src/components/Avatar/helpers.ts +4 -2
  490. package/src/components/Calendar/Calendar.tsx +52 -9
  491. package/src/components/CalendarDay/CalendarDay.tsx +7 -1
  492. package/src/components/CalendarDays/CalendarDays.tsx +9 -1
  493. package/src/components/CalendarHeader/CalendarHeader.tsx +21 -1
  494. package/src/components/CalendarRange/CalendarRange.tsx +24 -3
  495. package/src/components/CalendarTime/CalendarTime.module.css +4 -0
  496. package/src/components/CalendarTime/CalendarTime.tsx +36 -12
  497. package/src/components/Card/Card.module.css +3 -2
  498. package/src/components/Card/Card.tsx +2 -1
  499. package/src/components/Clickable/Clickable.module.css +5 -4
  500. package/src/components/Clickable/Clickable.tsx +1 -15
  501. package/src/components/Clickable/useState.tsx +30 -27
  502. package/src/components/DateInput/DateInput.tsx +33 -4
  503. package/src/components/DateRangeInput/DateRangeInput.tsx +28 -1
  504. package/src/components/FocusTrap/FocusTrap.tsx +13 -209
  505. package/src/components/Gallery/Gallery.tsx +10 -1
  506. package/src/components/Gallery/hooks.ts +49 -33
  507. package/src/components/Group/Group.module.css +1 -0
  508. package/src/components/HorizontalCell/HorizontalCell.module.css +5 -0
  509. package/src/components/HorizontalScroll/HorizontalScroll.tsx +23 -28
  510. package/src/components/Popover/Popover.tsx +1 -1
  511. package/src/components/Typography/EllipsisText/EllipsisText.tsx +6 -6
  512. package/src/hooks/useDateInput.ts +23 -6
  513. package/src/hooks/useFocusTrap.ts +276 -0
  514. package/src/index.ts +2 -0
  515. package/src/lib/animation/index.ts +6 -0
  516. package/src/lib/animation/useCSSTransition.stories.module.css +59 -0
  517. package/src/lib/animation/useCSSTransition.ts +207 -0
  518. package/src/lib/floating/customResizeObserver.ts +0 -1
  519. package/src/lib/floating/types/component.ts +2 -1
  520. package/src/lib/floating/useFloatingWithInteractions/index.ts +2 -0
  521. package/src/lib/floating/useFloatingWithInteractions/types.ts +3 -1
  522. package/src/lib/floating/useFloatingWithInteractions/useFloatingWithInteractions.ts +15 -3
@@ -11,12 +11,12 @@ import { useIsomorphicLayoutEffect } from "../../lib/useIsomorphicLayoutEffect.j
11
11
  import { AccordionContext } from "./AccordionContext.js";
12
12
  const CUSTOM_PROPERTY_ACCORDION_CONTENT_HEIGHT = '--vkui_internal--AccordionContent_height';
13
13
  const stateClassNames = {
14
- enter: "Accordion__inEnter--Fb36O",
15
- entering: "Accordion__inEnter--Fb36O",
16
- entered: "Accordion__inEntered--Hf0hg",
17
- exit: "Accordion__inExit--odUUE",
18
- exiting: "Accordion__inExit--odUUE",
19
- exited: "Accordion__inExited--cixfO"
14
+ enter: "vkuiAccordion__inEnter",
15
+ entering: "vkuiAccordion__inEnter",
16
+ entered: "vkuiAccordion__inEntered",
17
+ exit: "vkuiAccordion__inExit",
18
+ exiting: "vkuiAccordion__inExit",
19
+ exited: "vkuiAccordion__inExited"
20
20
  };
21
21
  export const AccordionContent = (_param)=>{
22
22
  var { getRootRef, getRef, className, children } = _param, restProps = _object_without_properties(_param, [
@@ -53,11 +53,11 @@ export const AccordionContent = (_param)=>{
53
53
  role: "region",
54
54
  "aria-labelledby": labelId,
55
55
  "aria-hidden": !expanded,
56
- className: classNames("Accordion__host--NI8kN", className)
56
+ className: classNames("vkuiAccordion__host", className)
57
57
  }, restProps), {
58
58
  children: /*#__PURE__*/ _jsx("div", _object_spread_props(_object_spread({
59
59
  ref: inRef,
60
- className: classNames("Accordion__in--37Irk", stateClassNames[animationState])
60
+ className: classNames("vkuiAccordion__in", stateClassNames[animationState])
61
61
  }, animationHandlers), {
62
62
  children: children
63
63
  }))
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Accordion/AccordionContent.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useCSSKeyframesAnimationController } from '../../lib/animation';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport type { HasRef, HasRootRef } from '../../types';\nimport { AccordionContext } from './AccordionContext';\nimport styles from './Accordion.module.css';\n\nconst CUSTOM_PROPERTY_ACCORDION_CONTENT_HEIGHT = '--vkui_internal--AccordionContent_height';\n\nconst stateClassNames = {\n enter: styles.inEnter,\n entering: styles.inEnter,\n entered: styles.inEntered,\n exit: styles.inExit,\n exiting: styles.inExit,\n exited: styles.inExited,\n};\n\nexport interface AccordionContentProps\n extends HasRootRef<HTMLDivElement>,\n HasRef<HTMLDivElement>,\n React.HTMLAttributes<HTMLDivElement> {}\n\nexport const AccordionContent: React.FC<AccordionContentProps> = ({\n getRootRef,\n getRef,\n className,\n children,\n ...restProps\n}) => {\n const { expanded, labelId, contentId } = React.useContext(AccordionContext);\n\n const inRef = useExternRef(getRef);\n const [animationState, animationHandlers] = useCSSKeyframesAnimationController(\n expanded ? 'enter' : 'exit',\n undefined,\n true,\n );\n\n useIsomorphicLayoutEffect(() => {\n const inEl = inRef.current;\n\n /* istanbul ignore if: невозможный кейс (в SSR вызова этой функции не будет) */\n if (!inEl) {\n return;\n }\n\n switch (animationState) {\n case 'enter':\n case 'exit':\n inEl.style.setProperty(CUSTOM_PROPERTY_ACCORDION_CONTENT_HEIGHT, `${inEl.scrollHeight}px`);\n break;\n case 'entered':\n case 'exited':\n inEl.style.removeProperty(CUSTOM_PROPERTY_ACCORDION_CONTENT_HEIGHT);\n break;\n }\n }, [animationState, inRef]);\n\n return (\n <div\n ref={getRootRef}\n id={contentId}\n role=\"region\"\n aria-labelledby={labelId}\n aria-hidden={!expanded}\n className={classNames(styles.host, className)}\n {...restProps}\n >\n <div\n ref={inRef}\n className={classNames(styles.in, stateClassNames[animationState])}\n {...animationHandlers}\n >\n {children}\n </div>\n </div>\n );\n};\n\nAccordionContent.displayName = 'AccordionContent';\n"],"names":["React","classNames","useExternRef","useCSSKeyframesAnimationController","useIsomorphicLayoutEffect","AccordionContext","CUSTOM_PROPERTY_ACCORDION_CONTENT_HEIGHT","stateClassNames","enter","entering","entered","exit","exiting","exited","AccordionContent","getRootRef","getRef","className","children","restProps","expanded","labelId","contentId","useContext","inRef","animationState","animationHandlers","undefined","inEl","current","style","setProperty","scrollHeight","removeProperty","div","ref","id","role","aria-labelledby","aria-hidden","displayName"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,kCAAkC,QAAQ,+BAAsB;AACzE,SAASC,yBAAyB,QAAQ,yCAAsC;AAEhF,SAASC,gBAAgB,QAAQ,wBAAqB;AAGtD,MAAMC,2CAA2C;AAEjD,MAAMC,kBAAkB;IACtBC,KAAK;IACLC,QAAQ;IACRC,OAAO;IACPC,IAAI;IACJC,OAAO;IACPC,MAAM;AACR;AAOA,OAAO,MAAMC,mBAAoD;QAAC,EAChEC,UAAU,EACVC,MAAM,EACNC,SAAS,EACTC,QAAQ,EAET,WADIC;QAJHJ;QACAC;QACAC;QACAC;;IAGA,MAAM,EAAEE,QAAQ,EAAEC,OAAO,EAAEC,SAAS,EAAE,GAAGtB,MAAMuB,UAAU,CAAClB;IAE1D,MAAMmB,QAAQtB,aAAac;IAC3B,MAAM,CAACS,gBAAgBC,kBAAkB,GAAGvB,mCAC1CiB,WAAW,UAAU,QACrBO,WACA;IAGFvB,0BAA0B;QACxB,MAAMwB,OAAOJ,MAAMK,OAAO;QAE1B,6EAA6E,GAC7E,IAAI,CAACD,MAAM;YACT;QACF;QAEA,OAAQH;YACN,KAAK;YACL,KAAK;gBACHG,KAAKE,KAAK,CAACC,WAAW,CAACzB,0CAA0C,GAAGsB,KAAKI,YAAY,CAAC,EAAE,CAAC;gBACzF;YACF,KAAK;YACL,KAAK;gBACHJ,KAAKE,KAAK,CAACG,cAAc,CAAC3B;gBAC1B;QACJ;IACF,GAAG;QAACmB;QAAgBD;KAAM;IAE1B,qBACE,KAACU;QACCC,KAAKpB;QACLqB,IAAId;QACJe,MAAK;QACLC,mBAAiBjB;QACjBkB,eAAa,CAACnB;QACdH,WAAWhB,qCAAwBgB;OAC/BE;kBAEJ,cAAA,KAACe;YACCC,KAAKX;YACLP,WAAWhB,mCAAsBM,eAAe,CAACkB,eAAe;WAC5DC;sBAEHR;;;AAIT,EAAE;AAEFJ,iBAAiB0B,WAAW,GAAG"}
1
+ {"version":3,"sources":["../../../src/components/Accordion/AccordionContent.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useCSSKeyframesAnimationController } from '../../lib/animation';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport type { HasRef, HasRootRef } from '../../types';\nimport { AccordionContext } from './AccordionContext';\nimport styles from './Accordion.module.css';\n\nconst CUSTOM_PROPERTY_ACCORDION_CONTENT_HEIGHT = '--vkui_internal--AccordionContent_height';\n\nconst stateClassNames = {\n enter: styles.inEnter,\n entering: styles.inEnter,\n entered: styles.inEntered,\n exit: styles.inExit,\n exiting: styles.inExit,\n exited: styles.inExited,\n};\n\nexport interface AccordionContentProps\n extends HasRootRef<HTMLDivElement>,\n HasRef<HTMLDivElement>,\n React.HTMLAttributes<HTMLDivElement> {}\n\nexport const AccordionContent: React.FC<AccordionContentProps> = ({\n getRootRef,\n getRef,\n className,\n children,\n ...restProps\n}) => {\n const { expanded, labelId, contentId } = React.useContext(AccordionContext);\n\n const inRef = useExternRef(getRef);\n const [animationState, animationHandlers] = useCSSKeyframesAnimationController(\n expanded ? 'enter' : 'exit',\n undefined,\n true,\n );\n\n useIsomorphicLayoutEffect(() => {\n const inEl = inRef.current;\n\n /* istanbul ignore if: невозможный кейс (в SSR вызова этой функции не будет) */\n if (!inEl) {\n return;\n }\n\n switch (animationState) {\n case 'enter':\n case 'exit':\n inEl.style.setProperty(CUSTOM_PROPERTY_ACCORDION_CONTENT_HEIGHT, `${inEl.scrollHeight}px`);\n break;\n case 'entered':\n case 'exited':\n inEl.style.removeProperty(CUSTOM_PROPERTY_ACCORDION_CONTENT_HEIGHT);\n break;\n }\n }, [animationState, inRef]);\n\n return (\n <div\n ref={getRootRef}\n id={contentId}\n role=\"region\"\n aria-labelledby={labelId}\n aria-hidden={!expanded}\n className={classNames(styles.host, className)}\n {...restProps}\n >\n <div\n ref={inRef}\n className={classNames(styles.in, stateClassNames[animationState])}\n {...animationHandlers}\n >\n {children}\n </div>\n </div>\n );\n};\n\nAccordionContent.displayName = 'AccordionContent';\n"],"names":["React","classNames","useExternRef","useCSSKeyframesAnimationController","useIsomorphicLayoutEffect","AccordionContext","CUSTOM_PROPERTY_ACCORDION_CONTENT_HEIGHT","stateClassNames","enter","entering","entered","exit","exiting","exited","AccordionContent","getRootRef","getRef","className","children","restProps","expanded","labelId","contentId","useContext","inRef","animationState","animationHandlers","undefined","inEl","current","style","setProperty","scrollHeight","removeProperty","div","ref","id","role","aria-labelledby","aria-hidden","displayName"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,kCAAkC,QAAQ,+BAAsB;AACzE,SAASC,yBAAyB,QAAQ,yCAAsC;AAEhF,SAASC,gBAAgB,QAAQ,wBAAqB;AAGtD,MAAMC,2CAA2C;AAEjD,MAAMC,kBAAkB;IACtBC,KAAK;IACLC,QAAQ;IACRC,OAAO;IACPC,IAAI;IACJC,OAAO;IACPC,MAAM;AACR;AAOA,OAAO,MAAMC,mBAAoD;QAAC,EAChEC,UAAU,EACVC,MAAM,EACNC,SAAS,EACTC,QAAQ,EAET,WADIC;QAJHJ;QACAC;QACAC;QACAC;;IAGA,MAAM,EAAEE,QAAQ,EAAEC,OAAO,EAAEC,SAAS,EAAE,GAAGtB,MAAMuB,UAAU,CAAClB;IAE1D,MAAMmB,QAAQtB,aAAac;IAC3B,MAAM,CAACS,gBAAgBC,kBAAkB,GAAGvB,mCAC1CiB,WAAW,UAAU,QACrBO,WACA;IAGFvB,0BAA0B;QACxB,MAAMwB,OAAOJ,MAAMK,OAAO;QAE1B,6EAA6E,GAC7E,IAAI,CAACD,MAAM;YACT;QACF;QAEA,OAAQH;YACN,KAAK;YACL,KAAK;gBACHG,KAAKE,KAAK,CAACC,WAAW,CAACzB,0CAA0C,GAAGsB,KAAKI,YAAY,CAAC,EAAE,CAAC;gBACzF;YACF,KAAK;YACL,KAAK;gBACHJ,KAAKE,KAAK,CAACG,cAAc,CAAC3B;gBAC1B;QACJ;IACF,GAAG;QAACmB;QAAgBD;KAAM;IAE1B,qBACE,KAACU;QACCC,KAAKpB;QACLqB,IAAId;QACJe,MAAK;QACLC,mBAAiBjB;QACjBkB,eAAa,CAACnB;QACdH,WAAWhB,kCAAwBgB;OAC/BE;kBAEJ,cAAA,KAACe;YACCC,KAAKX;YACLP,WAAWhB,gCAAsBM,eAAe,CAACkB,eAAe;WAC5DC;sBAEHR;;;AAIT,EAAE;AAEFJ,iBAAiB0B,WAAW,GAAG"}
@@ -24,7 +24,7 @@ export const AccordionSummary = (_param)=>{
24
24
  /*#__PURE__*/ _jsx("span", {
25
25
  className: "vkuiIcon",
26
26
  children: /*#__PURE__*/ _jsx(Icon, {
27
- className: "Accordion__icon--xfHxX"
27
+ className: "vkuiAccordion__icon"
28
28
  })
29
29
  });
30
30
  const toggle = ()=>onChange(!expanded);
@@ -82,18 +82,18 @@ import { ActionSheetDropdownSheet } from "./ActionSheetDropdownSheet.js";
82
82
  style: mode === 'menu' ? style : undefined,
83
83
  children: [
84
84
  /*#__PURE__*/ _jsxs("div", {
85
- className: "ActionSheet__contentWrapper--ze5ZS",
85
+ className: "vkuiActionSheet__contentWrapper",
86
86
  children: [
87
87
  (title || description) && /*#__PURE__*/ _jsxs("div", {
88
- className: "ActionSheet__header--ukU-u",
88
+ className: "vkuiActionSheet__header",
89
89
  children: [
90
90
  title && /*#__PURE__*/ _jsx(Footnote, {
91
91
  weight: "2",
92
- className: "ActionSheet__title--FhH5P",
92
+ className: "vkuiActionSheet__title",
93
93
  children: title
94
94
  }),
95
95
  description && /*#__PURE__*/ _jsx(Footnote, {
96
- className: "ActionSheet__description--jQrA5",
96
+ className: "vkuiActionSheet__description",
97
97
  children: description
98
98
  })
99
99
  ]
@@ -102,7 +102,7 @@ import { ActionSheetDropdownSheet } from "./ActionSheetDropdownSheet.js";
102
102
  ]
103
103
  }),
104
104
  platform === 'ios' && mode === 'sheet' && /*#__PURE__*/ _jsx("div", {
105
- className: "ActionSheet__closeItemWrapperIos--4kLz3",
105
+ className: "vkuiActionSheet__closeItemWrapperIos",
106
106
  children: iosCloseItem !== null && iosCloseItem !== void 0 ? iosCloseItem : /*#__PURE__*/ _jsx(ActionSheetDefaultIosCloseItem, {})
107
107
  })
108
108
  ]
@@ -72,7 +72,7 @@ export const ActionSheetDropdownMenu = (_param)=>{
72
72
  targetRef: targetRef,
73
73
  offsetByMainAxis: popupOffsetDistance,
74
74
  placement: placement,
75
- className: classNames("ActionSheet__host--Y8OfV", platform === 'ios' && "ActionSheet__ios--xRs2z", "ActionSheet__menu--dEf1u", closing ? "ActionSheet__closing--7Eh-f" : "ActionSheet__opening--50qf0", sizeY === 'compact' && "ActionSheet__sizeYCompact--ye1jl", className),
75
+ className: classNames("vkuiActionSheet__host", platform === 'ios' && "vkuiActionSheet__ios", "vkuiActionSheet__menu", closing ? "vkuiActionSheet__closing" : "vkuiActionSheet__opening", sizeY === 'compact' && "vkuiActionSheet__sizeYCompact", className),
76
76
  style: style,
77
77
  getRootRef: elementRef,
78
78
  usePortal: false,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/ActionSheet/ActionSheetDropdownMenu.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useEffectDev } from '../../hooks/useEffectDev';\nimport { useEventListener } from '../../hooks/useEventListener';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useDOM } from '../../lib/dom';\nimport { isRefObject } from '../../lib/isRefObject';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { Popper } from '../Popper/Popper';\nimport type { SharedDropdownProps } from './types';\nimport styles from './ActionSheet.module.css';\n\nconst warn = warnOnce('ActionSheet');\nfunction getEl(ref: SharedDropdownProps['toggleRef']): Element | null | undefined {\n return ref && 'current' in ref ? ref.current : ref;\n}\n\nexport const ActionSheetDropdownMenu = ({\n children,\n toggleRef,\n closing,\n onClose,\n className,\n style,\n popupOffsetDistance = 0,\n placement,\n onAnimationStart,\n onAnimationEnd,\n ...restProps\n}: SharedDropdownProps): React.ReactNode => {\n const { document } = useDOM();\n const platform = usePlatform();\n const { sizeY } = useAdaptivityWithJSMediaQueries();\n const elementRef = React.useRef<HTMLDivElement | null>(null);\n\n useEffectDev(() => {\n const toggleEl = getEl(toggleRef);\n if (!toggleEl) {\n warn(`Свойство \"toggleRef\" не передано`, 'error');\n }\n }, [toggleRef]);\n\n const bodyClickListener = useEventListener('click', (e: MouseEvent) => {\n const dropdownElement = elementRef?.current;\n if (dropdownElement && !dropdownElement.contains(e.target as Node)) {\n onClose?.();\n }\n });\n\n React.useEffect(() => {\n setTimeout(() => {\n bodyClickListener.add(document!.body);\n });\n }, [bodyClickListener, document]);\n\n const onClick = React.useCallback((e: React.MouseEvent<HTMLElement>) => e.stopPropagation(), []);\n\n const targetRef = React.useMemo(() => {\n if (isRefObject<SharedDropdownProps['toggleRef'], HTMLElement>(toggleRef)) {\n return toggleRef;\n }\n\n return { current: toggleRef as HTMLElement };\n }, [toggleRef]);\n\n return (\n <Popper\n targetRef={targetRef}\n offsetByMainAxis={popupOffsetDistance}\n placement={placement}\n className={classNames(\n styles.host,\n platform === 'ios' && styles.ios,\n styles.menu,\n closing ? styles.closing : styles.opening,\n sizeY === 'compact' && styles.sizeYCompact,\n className,\n )}\n style={style}\n getRootRef={elementRef}\n usePortal={false}\n onAnimationStart={onAnimationStart}\n onAnimationEnd={onAnimationEnd}\n >\n <FocusTrap onClose={onClose} {...restProps} onClick={onClick}>\n {children}\n </FocusTrap>\n </Popper>\n );\n};\n"],"names":["React","classNames","useAdaptivityWithJSMediaQueries","useEffectDev","useEventListener","usePlatform","useDOM","isRefObject","warnOnce","FocusTrap","Popper","warn","getEl","ref","current","ActionSheetDropdownMenu","children","toggleRef","closing","onClose","className","style","popupOffsetDistance","placement","onAnimationStart","onAnimationEnd","restProps","document","platform","sizeY","elementRef","useRef","toggleEl","bodyClickListener","e","dropdownElement","contains","target","useEffect","setTimeout","add","body","onClick","useCallback","stopPropagation","targetRef","useMemo","offsetByMainAxis","getRootRef","usePortal"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,+BAA+B,QAAQ,iDAA8C;AAC9F,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,gBAAgB,QAAQ,kCAA+B;AAChE,SAASC,WAAW,QAAQ,6BAA0B;AACtD,SAASC,MAAM,QAAQ,mBAAgB;AACvC,SAASC,WAAW,QAAQ,2BAAwB;AACpD,SAASC,QAAQ,QAAQ,wBAAqB;AAC9C,SAASC,SAAS,QAAQ,4BAAyB;AACnD,SAASC,MAAM,QAAQ,sBAAmB;AAI1C,MAAMC,OAAOH,SAAS;AACtB,SAASI,MAAMC,GAAqC;IAClD,OAAOA,OAAO,aAAaA,MAAMA,IAAIC,OAAO,GAAGD;AACjD;AAEA,OAAO,MAAME,0BAA0B;QAAC,EACtCC,QAAQ,EACRC,SAAS,EACTC,OAAO,EACPC,OAAO,EACPC,SAAS,EACTC,KAAK,EACLC,sBAAsB,CAAC,EACvBC,SAAS,EACTC,gBAAgB,EAChBC,cAAc,EAEM,WADjBC;QAVHV;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAM,EAAEE,QAAQ,EAAE,GAAGrB;IACrB,MAAMsB,WAAWvB;IACjB,MAAM,EAAEwB,KAAK,EAAE,GAAG3B;IAClB,MAAM4B,aAAa9B,MAAM+B,MAAM,CAAwB;IAEvD5B,aAAa;QACX,MAAM6B,WAAWpB,MAAMK;QACvB,IAAI,CAACe,UAAU;YACbrB,KAAK,CAAC,gCAAgC,CAAC,EAAE;QAC3C;IACF,GAAG;QAACM;KAAU;IAEd,MAAMgB,oBAAoB7B,iBAAiB,SAAS,CAAC8B;QACnD,MAAMC,kBAAkBL,uBAAAA,iCAAAA,WAAYhB,OAAO;QAC3C,IAAIqB,mBAAmB,CAACA,gBAAgBC,QAAQ,CAACF,EAAEG,MAAM,GAAW;YAClElB,oBAAAA,8BAAAA;QACF;IACF;IAEAnB,MAAMsC,SAAS,CAAC;QACdC,WAAW;YACTN,kBAAkBO,GAAG,CAACb,SAAUc,IAAI;QACtC;IACF,GAAG;QAACR;QAAmBN;KAAS;IAEhC,MAAMe,UAAU1C,MAAM2C,WAAW,CAAC,CAACT,IAAqCA,EAAEU,eAAe,IAAI,EAAE;IAE/F,MAAMC,YAAY7C,MAAM8C,OAAO,CAAC;QAC9B,IAAIvC,YAA2DU,YAAY;YACzE,OAAOA;QACT;QAEA,OAAO;YAAEH,SAASG;QAAyB;IAC7C,GAAG;QAACA;KAAU;IAEd,qBACE,KAACP;QACCmC,WAAWA;QACXE,kBAAkBzB;QAClBC,WAAWA;QACXH,WAAWnB,uCAET2B,aAAa,gEAEbV,yEACAW,UAAU,iDACVT;QAEFC,OAAOA;QACP2B,YAAYlB;QACZmB,WAAW;QACXzB,kBAAkBA;QAClBC,gBAAgBA;kBAEhB,cAAA,KAAChB;YAAUU,SAASA;WAAaO;YAAWgB,SAASA;sBAClD1B;;;AAIT,EAAE"}
1
+ {"version":3,"sources":["../../../src/components/ActionSheet/ActionSheetDropdownMenu.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useEffectDev } from '../../hooks/useEffectDev';\nimport { useEventListener } from '../../hooks/useEventListener';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useDOM } from '../../lib/dom';\nimport { isRefObject } from '../../lib/isRefObject';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { Popper } from '../Popper/Popper';\nimport type { SharedDropdownProps } from './types';\nimport styles from './ActionSheet.module.css';\n\nconst warn = warnOnce('ActionSheet');\nfunction getEl(ref: SharedDropdownProps['toggleRef']): Element | null | undefined {\n return ref && 'current' in ref ? ref.current : ref;\n}\n\nexport const ActionSheetDropdownMenu = ({\n children,\n toggleRef,\n closing,\n onClose,\n className,\n style,\n popupOffsetDistance = 0,\n placement,\n onAnimationStart,\n onAnimationEnd,\n ...restProps\n}: SharedDropdownProps): React.ReactNode => {\n const { document } = useDOM();\n const platform = usePlatform();\n const { sizeY } = useAdaptivityWithJSMediaQueries();\n const elementRef = React.useRef<HTMLDivElement | null>(null);\n\n useEffectDev(() => {\n const toggleEl = getEl(toggleRef);\n if (!toggleEl) {\n warn(`Свойство \"toggleRef\" не передано`, 'error');\n }\n }, [toggleRef]);\n\n const bodyClickListener = useEventListener('click', (e: MouseEvent) => {\n const dropdownElement = elementRef?.current;\n if (dropdownElement && !dropdownElement.contains(e.target as Node)) {\n onClose?.();\n }\n });\n\n React.useEffect(() => {\n setTimeout(() => {\n bodyClickListener.add(document!.body);\n });\n }, [bodyClickListener, document]);\n\n const onClick = React.useCallback((e: React.MouseEvent<HTMLElement>) => e.stopPropagation(), []);\n\n const targetRef = React.useMemo(() => {\n if (isRefObject<SharedDropdownProps['toggleRef'], HTMLElement>(toggleRef)) {\n return toggleRef;\n }\n\n return { current: toggleRef as HTMLElement };\n }, [toggleRef]);\n\n return (\n <Popper\n targetRef={targetRef}\n offsetByMainAxis={popupOffsetDistance}\n placement={placement}\n className={classNames(\n styles.host,\n platform === 'ios' && styles.ios,\n styles.menu,\n closing ? styles.closing : styles.opening,\n sizeY === 'compact' && styles.sizeYCompact,\n className,\n )}\n style={style}\n getRootRef={elementRef}\n usePortal={false}\n onAnimationStart={onAnimationStart}\n onAnimationEnd={onAnimationEnd}\n >\n <FocusTrap onClose={onClose} {...restProps} onClick={onClick}>\n {children}\n </FocusTrap>\n </Popper>\n );\n};\n"],"names":["React","classNames","useAdaptivityWithJSMediaQueries","useEffectDev","useEventListener","usePlatform","useDOM","isRefObject","warnOnce","FocusTrap","Popper","warn","getEl","ref","current","ActionSheetDropdownMenu","children","toggleRef","closing","onClose","className","style","popupOffsetDistance","placement","onAnimationStart","onAnimationEnd","restProps","document","platform","sizeY","elementRef","useRef","toggleEl","bodyClickListener","e","dropdownElement","contains","target","useEffect","setTimeout","add","body","onClick","useCallback","stopPropagation","targetRef","useMemo","offsetByMainAxis","getRootRef","usePortal"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,+BAA+B,QAAQ,iDAA8C;AAC9F,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,gBAAgB,QAAQ,kCAA+B;AAChE,SAASC,WAAW,QAAQ,6BAA0B;AACtD,SAASC,MAAM,QAAQ,mBAAgB;AACvC,SAASC,WAAW,QAAQ,2BAAwB;AACpD,SAASC,QAAQ,QAAQ,wBAAqB;AAC9C,SAASC,SAAS,QAAQ,4BAAyB;AACnD,SAASC,MAAM,QAAQ,sBAAmB;AAI1C,MAAMC,OAAOH,SAAS;AACtB,SAASI,MAAMC,GAAqC;IAClD,OAAOA,OAAO,aAAaA,MAAMA,IAAIC,OAAO,GAAGD;AACjD;AAEA,OAAO,MAAME,0BAA0B;QAAC,EACtCC,QAAQ,EACRC,SAAS,EACTC,OAAO,EACPC,OAAO,EACPC,SAAS,EACTC,KAAK,EACLC,sBAAsB,CAAC,EACvBC,SAAS,EACTC,gBAAgB,EAChBC,cAAc,EAEM,WADjBC;QAVHV;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAM,EAAEE,QAAQ,EAAE,GAAGrB;IACrB,MAAMsB,WAAWvB;IACjB,MAAM,EAAEwB,KAAK,EAAE,GAAG3B;IAClB,MAAM4B,aAAa9B,MAAM+B,MAAM,CAAwB;IAEvD5B,aAAa;QACX,MAAM6B,WAAWpB,MAAMK;QACvB,IAAI,CAACe,UAAU;YACbrB,KAAK,CAAC,gCAAgC,CAAC,EAAE;QAC3C;IACF,GAAG;QAACM;KAAU;IAEd,MAAMgB,oBAAoB7B,iBAAiB,SAAS,CAAC8B;QACnD,MAAMC,kBAAkBL,uBAAAA,iCAAAA,WAAYhB,OAAO;QAC3C,IAAIqB,mBAAmB,CAACA,gBAAgBC,QAAQ,CAACF,EAAEG,MAAM,GAAW;YAClElB,oBAAAA,8BAAAA;QACF;IACF;IAEAnB,MAAMsC,SAAS,CAAC;QACdC,WAAW;YACTN,kBAAkBO,GAAG,CAACb,SAAUc,IAAI;QACtC;IACF,GAAG;QAACR;QAAmBN;KAAS;IAEhC,MAAMe,UAAU1C,MAAM2C,WAAW,CAAC,CAACT,IAAqCA,EAAEU,eAAe,IAAI,EAAE;IAE/F,MAAMC,YAAY7C,MAAM8C,OAAO,CAAC;QAC9B,IAAIvC,YAA2DU,YAAY;YACzE,OAAOA;QACT;QAEA,OAAO;YAAEH,SAASG;QAAyB;IAC7C,GAAG;QAACA;KAAU;IAEd,qBACE,KAACP;QACCmC,WAAWA;QACXE,kBAAkBzB;QAClBC,WAAWA;QACXH,WAAWnB,oCAET2B,aAAa,0DAEbV,mEACAW,UAAU,8CACVT;QAEFC,OAAOA;QACP2B,YAAYlB;QACZmB,WAAW;QACXzB,kBAAkBA;QAClBC,gBAAgBA;kBAEhB,cAAA,KAAChB;YAAUU,SAASA;WAAaO;YAAWgB,SAASA;sBAClD1B;;;AAIT,EAAE"}
@@ -21,7 +21,7 @@ export const ActionSheetDropdownSheet = (_param)=>{
21
21
  const platform = usePlatform();
22
22
  return /*#__PURE__*/ _jsx(FocusTrap, _object_spread_props(_object_spread({}, restProps), {
23
23
  onClick: stopPropagation,
24
- className: classNames("ActionSheet__host--Y8OfV", platform === 'ios' && "ActionSheet__ios--xRs2z", closing ? "ActionSheet__closing--7Eh-f" : "ActionSheet__opening--50qf0", sizeY === 'compact' && "ActionSheet__sizeYCompact--ye1jl", className),
24
+ className: classNames("vkuiActionSheet__host", platform === 'ios' && "vkuiActionSheet__ios", closing ? "vkuiActionSheet__closing" : "vkuiActionSheet__opening", sizeY === 'compact' && "vkuiActionSheet__sizeYCompact", className),
25
25
  children: children
26
26
  }));
27
27
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/ActionSheet/ActionSheetDropdownSheet.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport type { SharedDropdownProps } from './types';\nimport styles from './ActionSheet.module.css';\n\nconst stopPropagation: React.MouseEventHandler = (e) => e.stopPropagation();\n\nexport type ActionSheetDropdownProps = Omit<\n SharedDropdownProps,\n 'popupDirection' | 'popupOffsetDistance' | 'placement'\n>;\n\nexport const ActionSheetDropdownSheet = ({\n children,\n closing,\n // these 2 props are only omitted - ActionSheetDesktop compat\n toggleRef,\n className,\n ...restProps\n}: SharedDropdownProps): React.ReactNode => {\n const { sizeY } = useAdaptivityWithJSMediaQueries();\n const platform = usePlatform();\n\n return (\n <FocusTrap\n {...restProps}\n onClick={stopPropagation}\n className={classNames(\n styles.host,\n platform === 'ios' && styles.ios,\n closing ? styles.closing : styles.opening,\n sizeY === 'compact' && styles.sizeYCompact,\n className,\n )}\n >\n {children}\n </FocusTrap>\n );\n};\n"],"names":["React","classNames","useAdaptivityWithJSMediaQueries","usePlatform","FocusTrap","stopPropagation","e","ActionSheetDropdownSheet","children","closing","toggleRef","className","restProps","sizeY","platform","onClick"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,+BAA+B,QAAQ,iDAA8C;AAC9F,SAASC,WAAW,QAAQ,6BAA0B;AACtD,SAASC,SAAS,QAAQ,4BAAyB;AAInD,MAAMC,kBAA2C,CAACC,IAAMA,EAAED,eAAe;AAOzE,OAAO,MAAME,2BAA2B;QAAC,EACvCC,QAAQ,EACRC,OAAO,EACP,6DAA6D;IAC7DC,SAAS,EACTC,SAAS,EAEW,WADjBC;QALHJ;QACAC;QAEAC;QACAC;;IAGA,MAAM,EAAEE,KAAK,EAAE,GAAGX;IAClB,MAAMY,WAAWX;IAEjB,qBACE,KAACC,mDACKQ;QACJG,SAASV;QACTM,WAAWV,uCAETa,aAAa,oCACbL,yEACAI,UAAU,iDACVF;kBAGDH;;AAGP,EAAE"}
1
+ {"version":3,"sources":["../../../src/components/ActionSheet/ActionSheetDropdownSheet.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport type { SharedDropdownProps } from './types';\nimport styles from './ActionSheet.module.css';\n\nconst stopPropagation: React.MouseEventHandler = (e) => e.stopPropagation();\n\nexport type ActionSheetDropdownProps = Omit<\n SharedDropdownProps,\n 'popupDirection' | 'popupOffsetDistance' | 'placement'\n>;\n\nexport const ActionSheetDropdownSheet = ({\n children,\n closing,\n // these 2 props are only omitted - ActionSheetDesktop compat\n toggleRef,\n className,\n ...restProps\n}: SharedDropdownProps): React.ReactNode => {\n const { sizeY } = useAdaptivityWithJSMediaQueries();\n const platform = usePlatform();\n\n return (\n <FocusTrap\n {...restProps}\n onClick={stopPropagation}\n className={classNames(\n styles.host,\n platform === 'ios' && styles.ios,\n closing ? styles.closing : styles.opening,\n sizeY === 'compact' && styles.sizeYCompact,\n className,\n )}\n >\n {children}\n </FocusTrap>\n );\n};\n"],"names":["React","classNames","useAdaptivityWithJSMediaQueries","usePlatform","FocusTrap","stopPropagation","e","ActionSheetDropdownSheet","children","closing","toggleRef","className","restProps","sizeY","platform","onClick"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,+BAA+B,QAAQ,iDAA8C;AAC9F,SAASC,WAAW,QAAQ,6BAA0B;AACtD,SAASC,SAAS,QAAQ,4BAAyB;AAInD,MAAMC,kBAA2C,CAACC,IAAMA,EAAED,eAAe;AAOzE,OAAO,MAAME,2BAA2B;QAAC,EACvCC,QAAQ,EACRC,OAAO,EACP,6DAA6D;IAC7DC,SAAS,EACTC,SAAS,EAEW,WADjBC;QALHJ;QACAC;QAEAC;QACAC;;IAGA,MAAM,EAAEE,KAAK,EAAE,GAAGX;IAClB,MAAMY,WAAWX;IAEjB,qBACE,KAACC,mDACKQ;QACJG,SAASV;QACTM,WAAWV,oCAETa,aAAa,iCACbL,mEACAI,UAAU,8CACVF;kBAGDH;;AAGP,EAAE"}
@@ -83,43 +83,43 @@ import { Radio } from "./subcomponents/Radio/Radio.js";
83
83
  Component
84
84
  }, restProps), {
85
85
  onClick: onItemClickImpl,
86
- activeMode: platform === 'ios' ? "ActionSheetItem__active--7kUJI" : undefined,
87
- className: classNames("ActionSheetItem__host--Qz7Os", platform === 'ios' && "ActionSheetItem__ios--OnK7W", mode === 'cancel' && "ActionSheetItem__modeCancel--Nn1U-", mode === 'destructive' && "ActionSheetItem__modeDestructive--MK97f", sizeY === 'compact' && "ActionSheetItem__sizeYCompact--yOGEw", isRich && "ActionSheetItem__rich--ByAtH", actionSheetMode === 'menu' && "ActionSheetItem__menu--vyHSv", className),
86
+ activeMode: platform === 'ios' ? "vkuiActionSheetItem__active" : undefined,
87
+ className: classNames("vkuiActionSheetItem__host", platform === 'ios' && "vkuiActionSheetItem__ios", mode === 'cancel' && "vkuiActionSheetItem__modeCancel", mode === 'destructive' && "vkuiActionSheetItem__modeDestructive", sizeY === 'compact' && "vkuiActionSheetItem__sizeYCompact", isRich && "vkuiActionSheetItem__rich", actionSheetMode === 'menu' && "vkuiActionSheetItem__menu", className),
88
88
  onKeyDown: onKeyDown,
89
89
  children: [
90
90
  before && /*#__PURE__*/ _jsx("div", {
91
- className: "ActionSheetItem__before--YslHq",
91
+ className: "vkuiActionSheetItem__before",
92
92
  children: before
93
93
  }),
94
94
  /*#__PURE__*/ _jsxs("div", {
95
- className: classNames("ActionSheetItem__container--jIPor", !multiline && "ActionSheetItem__ellipsis--o3oUG"),
95
+ className: classNames("vkuiActionSheetItem__container", !multiline && "vkuiActionSheetItem__ellipsis"),
96
96
  children: [
97
97
  /*#__PURE__*/ _jsxs("div", {
98
- className: classNames("ActionSheetItem__content--3aum8", isCentered && "ActionSheetItem__centered--8-PW6"),
98
+ className: classNames("vkuiActionSheetItem__content", isCentered && "vkuiActionSheetItem__centered"),
99
99
  children: [
100
100
  platform === 'ios' ? /*#__PURE__*/ _jsx(Title, {
101
- className: "ActionSheetItem__children--4JlYe",
101
+ className: "vkuiActionSheetItem__children",
102
102
  weight: mode === 'cancel' ? '2' : '3',
103
103
  level: isCentered ? '2' : '3',
104
104
  children: children
105
105
  }) : /*#__PURE__*/ _jsx(Text, {
106
- className: "ActionSheetItem__children--4JlYe",
106
+ className: "vkuiActionSheetItem__children",
107
107
  children: children
108
108
  }),
109
109
  meta && /*#__PURE__*/ _jsx(Text, {
110
- className: "ActionSheetItem__meta--i428h",
110
+ className: "vkuiActionSheetItem__meta",
111
111
  children: meta
112
112
  })
113
113
  ]
114
114
  }),
115
115
  subtitle && /*#__PURE__*/ _jsx(Subhead, {
116
- className: "ActionSheetItem__subtitle--P1A6x",
116
+ className: "vkuiActionSheetItem__subtitle",
117
117
  children: subtitle
118
118
  })
119
119
  ]
120
120
  }),
121
121
  (selectable || after) && /*#__PURE__*/ _jsxs("div", {
122
- className: "ActionSheetItem__after--qcnQk",
122
+ className: "vkuiActionSheetItem__after",
123
123
  children: [
124
124
  after,
125
125
  selectable && /*#__PURE__*/ _jsx(Radio, {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/ActionSheetItem/ActionSheetItem.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Keys, pressedKey } from '../../lib/accessibility';\nimport { ActionSheetContext, type ActionSheetContextType } from '../ActionSheet/ActionSheetContext';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Text } from '../Typography/Text/Text';\nimport { Title } from '../Typography/Title/Title';\nimport { isRealClickEvent } from './helpers';\nimport { Radio } from './subcomponents/Radio/Radio';\nimport styles from './ActionSheetItem.module.css';\n\nexport interface ActionSheetItemProps\n extends React.HTMLAttributes<HTMLElement>,\n React.AnchorHTMLAttributes<HTMLElement>,\n Pick<React.InputHTMLAttributes<HTMLInputElement>, 'name' | 'checked' | 'value'> {\n mode?: 'default' | 'destructive' | 'cancel';\n before?: React.ReactNode;\n after?: React.ReactNode;\n meta?: React.ReactNode;\n subtitle?: React.ReactNode;\n /**\n * По умолчанию клик на опцию вызывает переданную в `ActionSheet` функцию `onClose`, данное свойство\n * позволяет отключить такое поведение\n */\n autoCloseDisabled?: boolean;\n selectable?: boolean;\n disabled?: boolean;\n /**\n * Все текстовые элементы при необходимости занимают несколько строк\n */\n multiline?: boolean;\n /**\n * По умолчанию onClick будет вызван после завершения анимации скрытия и после вызова onClose.\n * Из этого следует, что в объекте события значения полей типа `currentTarget` будут не определены.\n * Если вам нужен объект события именно на момент клика, используйте `onImmediateClick`.\n */\n onClick?: React.MouseEventHandler<HTMLElement>;\n onImmediateClick?: React.MouseEventHandler<HTMLElement>;\n /**\n * Иконка для `checked` режима.\n */\n iconChecked?: React.ReactNode;\n /**\n * Позволяет отделить ActionItem от CancelItem для определении того,\n * кто вызвал закрытие ActionSheet. Используется в ActionSheet.onClose()\n */\n isCancelItem?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ActionSheetItem\n */\nexport const ActionSheetItem = ({\n children,\n autoCloseDisabled = false,\n mode = 'default',\n meta,\n subtitle,\n before,\n after,\n selectable,\n value,\n name,\n checked,\n defaultChecked,\n onChange,\n onClick,\n onImmediateClick,\n multiline = false,\n iconChecked,\n className,\n isCancelItem,\n ...restProps\n}: ActionSheetItemProps): React.ReactNode => {\n const platform = usePlatform();\n const {\n onItemClick = () => noop,\n mode: actionSheetMode,\n onClose: onActionSheetClose,\n } = React.useContext<ActionSheetContextType<HTMLElement>>(ActionSheetContext);\n const { sizeY } = useAdaptivityWithJSMediaQueries();\n\n const Component: React.ElementType | undefined = selectable ? 'label' : undefined;\n\n const isRich = subtitle || meta || selectable;\n const isCentered = !isRich && !before && platform === 'ios';\n\n const onItemClickHandler = React.useCallback(\n (e: React.MouseEvent) => {\n onItemClick({\n action: onClick,\n immediateAction: onImmediateClick,\n autoClose: !autoCloseDisabled,\n isCancelItem: Boolean(isCancelItem),\n })?.(e);\n },\n [autoCloseDisabled, isCancelItem, onClick, onImmediateClick, onItemClick],\n );\n\n const onKeyDown: React.KeyboardEventHandler<HTMLElement> = React.useCallback(\n (event) => {\n if (pressedKey(event) === Keys.ENTER) {\n onActionSheetClose?.();\n }\n },\n [onActionSheetClose],\n );\n\n const onItemClickImpl: React.MouseEventHandler<HTMLElement> = React.useCallback(\n (event) => {\n if (selectable) {\n if (isRealClickEvent(event)) {\n onItemClickHandler(event);\n }\n } else {\n onItemClickHandler(event);\n }\n },\n [onItemClickHandler, selectable],\n );\n\n return (\n <Tappable\n {...(Component && { Component })}\n {...restProps}\n onClick={onItemClickImpl}\n activeMode={platform === 'ios' ? styles.active : undefined}\n className={classNames(\n styles.host,\n platform === 'ios' && styles.ios,\n mode === 'cancel' && styles.modeCancel,\n mode === 'destructive' && styles.modeDestructive,\n sizeY === 'compact' && styles.sizeYCompact,\n isRich && styles.rich,\n actionSheetMode === 'menu' && styles.menu,\n className,\n )}\n onKeyDown={onKeyDown}\n >\n {before && <div className={styles.before}>{before}</div>}\n <div className={classNames(styles.container, !multiline && styles.ellipsis)}>\n <div className={classNames(styles.content, isCentered && styles.centered)}>\n {platform === 'ios' ? (\n <Title\n className={styles.children}\n weight={mode === 'cancel' ? '2' : '3'}\n level={isCentered ? '2' : '3'}\n >\n {children}\n </Title>\n ) : (\n <Text className={styles.children}>{children}</Text>\n )}\n {meta && <Text className={styles.meta}>{meta}</Text>}\n </div>\n {subtitle && <Subhead className={styles.subtitle}>{subtitle}</Subhead>}\n </div>\n {(selectable || after) && (\n <div className={styles.after}>\n {after}\n {selectable && (\n <Radio\n name={name}\n value={value}\n onChange={onChange}\n defaultChecked={defaultChecked}\n checked={checked}\n disabled={restProps.disabled}\n >\n {iconChecked}\n </Radio>\n )}\n </div>\n )}\n </Tappable>\n );\n};\n"],"names":["React","classNames","noop","useAdaptivityWithJSMediaQueries","usePlatform","Keys","pressedKey","ActionSheetContext","Tappable","Subhead","Text","Title","isRealClickEvent","Radio","ActionSheetItem","children","autoCloseDisabled","mode","meta","subtitle","before","after","selectable","value","name","checked","defaultChecked","onChange","onClick","onImmediateClick","multiline","iconChecked","className","isCancelItem","restProps","platform","onItemClick","actionSheetMode","onClose","onActionSheetClose","useContext","sizeY","Component","undefined","isRich","isCentered","onItemClickHandler","useCallback","e","action","immediateAction","autoClose","Boolean","onKeyDown","event","ENTER","onItemClickImpl","activeMode","div","weight","level","disabled"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../src/components/ActionSheetItem/ActionSheetItem.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Keys, pressedKey } from '../../lib/accessibility';\nimport { ActionSheetContext, type ActionSheetContextType } from '../ActionSheet/ActionSheetContext';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Text } from '../Typography/Text/Text';\nimport { Title } from '../Typography/Title/Title';\nimport { isRealClickEvent } from './helpers';\nimport { Radio } from './subcomponents/Radio/Radio';\nimport styles from './ActionSheetItem.module.css';\n\nexport interface ActionSheetItemProps\n extends React.HTMLAttributes<HTMLElement>,\n React.AnchorHTMLAttributes<HTMLElement>,\n Pick<React.InputHTMLAttributes<HTMLInputElement>, 'name' | 'checked' | 'value'> {\n mode?: 'default' | 'destructive' | 'cancel';\n before?: React.ReactNode;\n after?: React.ReactNode;\n meta?: React.ReactNode;\n subtitle?: React.ReactNode;\n /**\n * По умолчанию клик на опцию вызывает переданную в `ActionSheet` функцию `onClose`, данное свойство\n * позволяет отключить такое поведение\n */\n autoCloseDisabled?: boolean;\n selectable?: boolean;\n disabled?: boolean;\n /**\n * Все текстовые элементы при необходимости занимают несколько строк\n */\n multiline?: boolean;\n /**\n * По умолчанию onClick будет вызван после завершения анимации скрытия и после вызова onClose.\n * Из этого следует, что в объекте события значения полей типа `currentTarget` будут не определены.\n * Если вам нужен объект события именно на момент клика, используйте `onImmediateClick`.\n */\n onClick?: React.MouseEventHandler<HTMLElement>;\n onImmediateClick?: React.MouseEventHandler<HTMLElement>;\n /**\n * Иконка для `checked` режима.\n */\n iconChecked?: React.ReactNode;\n /**\n * Позволяет отделить ActionItem от CancelItem для определении того,\n * кто вызвал закрытие ActionSheet. Используется в ActionSheet.onClose()\n */\n isCancelItem?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ActionSheetItem\n */\nexport const ActionSheetItem = ({\n children,\n autoCloseDisabled = false,\n mode = 'default',\n meta,\n subtitle,\n before,\n after,\n selectable,\n value,\n name,\n checked,\n defaultChecked,\n onChange,\n onClick,\n onImmediateClick,\n multiline = false,\n iconChecked,\n className,\n isCancelItem,\n ...restProps\n}: ActionSheetItemProps): React.ReactNode => {\n const platform = usePlatform();\n const {\n onItemClick = () => noop,\n mode: actionSheetMode,\n onClose: onActionSheetClose,\n } = React.useContext<ActionSheetContextType<HTMLElement>>(ActionSheetContext);\n const { sizeY } = useAdaptivityWithJSMediaQueries();\n\n const Component: React.ElementType | undefined = selectable ? 'label' : undefined;\n\n const isRich = subtitle || meta || selectable;\n const isCentered = !isRich && !before && platform === 'ios';\n\n const onItemClickHandler = React.useCallback(\n (e: React.MouseEvent) => {\n onItemClick({\n action: onClick,\n immediateAction: onImmediateClick,\n autoClose: !autoCloseDisabled,\n isCancelItem: Boolean(isCancelItem),\n })?.(e);\n },\n [autoCloseDisabled, isCancelItem, onClick, onImmediateClick, onItemClick],\n );\n\n const onKeyDown: React.KeyboardEventHandler<HTMLElement> = React.useCallback(\n (event) => {\n if (pressedKey(event) === Keys.ENTER) {\n onActionSheetClose?.();\n }\n },\n [onActionSheetClose],\n );\n\n const onItemClickImpl: React.MouseEventHandler<HTMLElement> = React.useCallback(\n (event) => {\n if (selectable) {\n if (isRealClickEvent(event)) {\n onItemClickHandler(event);\n }\n } else {\n onItemClickHandler(event);\n }\n },\n [onItemClickHandler, selectable],\n );\n\n return (\n <Tappable\n {...(Component && { Component })}\n {...restProps}\n onClick={onItemClickImpl}\n activeMode={platform === 'ios' ? styles.active : undefined}\n className={classNames(\n styles.host,\n platform === 'ios' && styles.ios,\n mode === 'cancel' && styles.modeCancel,\n mode === 'destructive' && styles.modeDestructive,\n sizeY === 'compact' && styles.sizeYCompact,\n isRich && styles.rich,\n actionSheetMode === 'menu' && styles.menu,\n className,\n )}\n onKeyDown={onKeyDown}\n >\n {before && <div className={styles.before}>{before}</div>}\n <div className={classNames(styles.container, !multiline && styles.ellipsis)}>\n <div className={classNames(styles.content, isCentered && styles.centered)}>\n {platform === 'ios' ? (\n <Title\n className={styles.children}\n weight={mode === 'cancel' ? '2' : '3'}\n level={isCentered ? '2' : '3'}\n >\n {children}\n </Title>\n ) : (\n <Text className={styles.children}>{children}</Text>\n )}\n {meta && <Text className={styles.meta}>{meta}</Text>}\n </div>\n {subtitle && <Subhead className={styles.subtitle}>{subtitle}</Subhead>}\n </div>\n {(selectable || after) && (\n <div className={styles.after}>\n {after}\n {selectable && (\n <Radio\n name={name}\n value={value}\n onChange={onChange}\n defaultChecked={defaultChecked}\n checked={checked}\n disabled={restProps.disabled}\n >\n {iconChecked}\n </Radio>\n )}\n </div>\n )}\n </Tappable>\n );\n};\n"],"names":["React","classNames","noop","useAdaptivityWithJSMediaQueries","usePlatform","Keys","pressedKey","ActionSheetContext","Tappable","Subhead","Text","Title","isRealClickEvent","Radio","ActionSheetItem","children","autoCloseDisabled","mode","meta","subtitle","before","after","selectable","value","name","checked","defaultChecked","onChange","onClick","onImmediateClick","multiline","iconChecked","className","isCancelItem","restProps","platform","onItemClick","actionSheetMode","onClose","onActionSheetClose","useContext","sizeY","Component","undefined","isRich","isCentered","onItemClickHandler","useCallback","e","action","immediateAction","autoClose","Boolean","onKeyDown","event","ENTER","onItemClickImpl","activeMode","div","weight","level","disabled"],"mappings":"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"}
@@ -27,7 +27,7 @@ export const Radio = (_param)=>{
27
27
  Component: "input",
28
28
  getRootRef: getRef,
29
29
  type: "radio",
30
- className: "Radio__input--sc8AO"
30
+ className: "vkuiRadio__input"
31
31
  }, restProps)),
32
32
  children
33
33
  ]
@@ -82,14 +82,14 @@ import { AlertDescription, AlertTitle } from "./AlertTypography.js";
82
82
  onClick: stopPropagation,
83
83
  onClose: close,
84
84
  autoFocus: animationState === 'entered',
85
- className: classNames("Alert__host--dSWeI", platform === 'ios' && "Alert__ios--EidAR", platform === 'vkcom' && "Alert__vkcom---FbfG", closing ? "Alert__closing--JGye3" : "Alert__opening--5PGQp", isDesktop && "Alert__desktop--C8oFu"),
85
+ className: classNames("vkuiAlert__host", platform === 'ios' && "vkuiAlert__ios", platform === 'vkcom' && "vkuiAlert__vkcom", closing ? "vkuiAlert__closing" : "vkuiAlert__opening", isDesktop && "vkuiAlert__desktop"),
86
86
  role: "alertdialog",
87
87
  "aria-modal": true,
88
88
  "aria-labelledby": titleId,
89
89
  "aria-describedby": descriptionId,
90
90
  children: [
91
91
  /*#__PURE__*/ _jsxs("div", {
92
- className: classNames("Alert__content--UXnmZ", dismissButtonMode === 'inside' && "Alert__contentWithButton--GS8hF"),
92
+ className: classNames("vkuiAlert__content", dismissButtonMode === 'inside' && "vkuiAlert__contentWithButton"),
93
93
  children: [
94
94
  hasReactNode(title) && /*#__PURE__*/ _jsx(AlertTitle, {
95
95
  id: titleId,
@@ -102,7 +102,7 @@ import { AlertDescription, AlertTitle } from "./AlertTypography.js";
102
102
  children,
103
103
  isDismissButtonVisible && dismissButtonMode === 'inside' && /*#__PURE__*/ _jsx(IconButton, {
104
104
  label: dismissLabel,
105
- className: classNames("Alert__dismiss--dQPPE", 'vkuiInternalAlert__dismiss'),
105
+ className: classNames("vkuiAlert__dismiss", 'vkuiInternalAlert__dismiss'),
106
106
  onClick: close,
107
107
  hoverMode: "opacity",
108
108
  activeMode: "opacity",
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Alert/Alert.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Icon20Cancel } from '@vkontakte/icons';\nimport { classNames, hasReactNode, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useCSSKeyframesAnimationController } from '../../lib/animation';\nimport { stopPropagation } from '../../lib/utils';\nimport type {\n AlignType,\n AnchorHTMLAttributesOnly,\n HasDataAttribute,\n HasRootRef,\n} from '../../types';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport type { ButtonProps } from '../Button/Button';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { IconButton } from '../IconButton/IconButton';\nimport { ModalDismissButton } from '../ModalDismissButton/ModalDismissButton';\nimport { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';\nimport type { AlertActionProps } from './AlertAction';\nimport { AlertActions } from './AlertActions';\nimport { AlertDescription, AlertTitle } from './AlertTypography';\nimport styles from './Alert.module.css';\n\ntype AlertActionMode = 'cancel' | 'destructive' | 'default';\n\nexport interface AlertActionInterface\n extends Pick<ButtonProps, 'Component'>,\n AnchorHTMLAttributesOnly,\n HasDataAttribute {\n title: string;\n /**\n * Обработчик клика на опцию. Если свойство `autoCloseDisabled` включено,\n * то в аргументы `action` передаётся объект с функцией close,\n * вызвав которую можно закрыть `action` вручную.\n */\n action?: (args?: { close?: VoidFunction }) => void;\n /**\n * По умолчанию клик на опцию вызывает переданную в `Alert` функцию `onClose`, данное свойство\n * позволяет отключить такое поведение\n */\n autoCloseDisabled?: boolean;\n mode: AlertActionMode;\n}\n\nexport interface AlertProps\n extends Omit<React.HTMLAttributes<HTMLElement>, 'title'>,\n HasRootRef<HTMLDivElement> {\n actionsLayout?: 'vertical' | 'horizontal';\n actionsAlign?: AlignType;\n actions?: AlertActionInterface[];\n renderAction?: (props: AlertActionProps) => React.ReactNode;\n title?: React.ReactNode;\n description?: React.ReactNode;\n onClose: VoidFunction;\n /**\n * Текст кнопки закрытия. Делает ее доступной для ассистивных технологий\n */\n dismissLabel?: string;\n /**\n * Расположение кнопки закрытия (внутри и вне `popout'a`)\n * Доступно только в `compact`-режиме, не отображается на `iOS`\n */\n dismissButtonMode?: 'inside' | 'outside';\n /**\n * `data-testid` для кнопки закрытия\n */\n dismissButtonTestId?: string;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Alert\n */\nexport const Alert = ({\n actions,\n actionsLayout = 'horizontal',\n children,\n className,\n style,\n title,\n description,\n onClose,\n dismissLabel = 'Закрыть предупреждение',\n renderAction,\n actionsAlign,\n dismissButtonMode = 'outside',\n dismissButtonTestId,\n getRootRef,\n ...restProps\n}: AlertProps): React.ReactNode => {\n const generatedId = React.useId();\n\n const titleId = `vkui-alert-${generatedId}-title`;\n const descriptionId = `vkui-alert-${generatedId}-description`;\n\n const platform = usePlatform();\n const { isDesktop } = useAdaptivityWithJSMediaQueries();\n\n const [closing, setClosing] = React.useState(false);\n const itemActionCallbackRef = React.useRef(noop);\n const [animationState, animationHandlers] = useCSSKeyframesAnimationController(\n closing ? 'exit' : 'enter',\n {\n onExited() {\n itemActionCallbackRef.current();\n itemActionCallbackRef.current = noop;\n onClose();\n },\n },\n );\n const isDismissButtonVisible = isDesktop && platform !== 'ios';\n const elementRef = React.useRef<HTMLDivElement>(null);\n\n const close = React.useCallback(() => {\n setClosing(true);\n }, []);\n\n const onItemClick = React.useCallback(\n (item: AlertActionInterface) => {\n const { action: itemAction, autoCloseDisabled = false } = item;\n\n if (autoCloseDisabled) {\n itemAction && itemAction({ close });\n } else {\n if (itemAction) {\n itemActionCallbackRef.current = itemAction;\n }\n setClosing(true);\n }\n },\n [close],\n );\n\n useScrollLock();\n\n return (\n <PopoutWrapper\n className={className}\n closing={closing}\n style={style}\n onClick={close}\n getRootRef={getRootRef}\n >\n <FocusTrap\n {...restProps}\n {...animationHandlers}\n getRootRef={elementRef}\n onClick={stopPropagation}\n onClose={close}\n autoFocus={animationState === 'entered'}\n className={classNames(\n styles.host,\n platform === 'ios' && styles.ios,\n platform === 'vkcom' && styles.vkcom,\n closing ? styles.closing : styles.opening,\n isDesktop && styles.desktop,\n )}\n role=\"alertdialog\"\n aria-modal\n aria-labelledby={titleId}\n aria-describedby={descriptionId}\n >\n <div\n className={classNames(\n styles.content,\n dismissButtonMode === 'inside' && styles.contentWithButton,\n )}\n >\n {hasReactNode(title) && <AlertTitle id={titleId}>{title}</AlertTitle>}\n {hasReactNode(description) && (\n <AlertDescription id={descriptionId}>{description}</AlertDescription>\n )}\n {children}\n {isDismissButtonVisible && dismissButtonMode === 'inside' && (\n <IconButton\n label={dismissLabel}\n className={classNames(styles.dismiss, 'vkuiInternalAlert__dismiss')}\n onClick={close}\n hoverMode=\"opacity\"\n activeMode=\"opacity\"\n data-testid={dismissButtonTestId}\n >\n <Icon20Cancel />\n </IconButton>\n )}\n </div>\n <AlertActions\n actions={actions}\n actionsAlign={actionsAlign}\n actionsLayout={actionsLayout}\n renderAction={renderAction}\n onItemClick={onItemClick}\n />\n {isDismissButtonVisible && dismissButtonMode === 'outside' && (\n <ModalDismissButton onClick={close} data-testid={dismissButtonTestId}>\n {dismissLabel}\n </ModalDismissButton>\n )}\n </FocusTrap>\n </PopoutWrapper>\n );\n};\n"],"names":["React","Icon20Cancel","classNames","hasReactNode","noop","useAdaptivityWithJSMediaQueries","usePlatform","useCSSKeyframesAnimationController","stopPropagation","useScrollLock","FocusTrap","IconButton","ModalDismissButton","PopoutWrapper","AlertActions","AlertDescription","AlertTitle","Alert","actions","actionsLayout","children","className","style","title","description","onClose","dismissLabel","renderAction","actionsAlign","dismissButtonMode","dismissButtonTestId","getRootRef","restProps","generatedId","useId","titleId","descriptionId","platform","isDesktop","closing","setClosing","useState","itemActionCallbackRef","useRef","animationState","animationHandlers","onExited","current","isDismissButtonVisible","elementRef","close","useCallback","onItemClick","item","action","itemAction","autoCloseDisabled","onClick","autoFocus","role","aria-modal","aria-labelledby","aria-describedby","div","id","label","hoverMode","activeMode","data-testid"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../src/components/Alert/Alert.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Icon20Cancel } from '@vkontakte/icons';\nimport { classNames, hasReactNode, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useCSSKeyframesAnimationController } from '../../lib/animation';\nimport { stopPropagation } from '../../lib/utils';\nimport type {\n AlignType,\n AnchorHTMLAttributesOnly,\n HasDataAttribute,\n HasRootRef,\n} from '../../types';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport type { ButtonProps } from '../Button/Button';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { IconButton } from '../IconButton/IconButton';\nimport { ModalDismissButton } from '../ModalDismissButton/ModalDismissButton';\nimport { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';\nimport type { AlertActionProps } from './AlertAction';\nimport { AlertActions } from './AlertActions';\nimport { AlertDescription, AlertTitle } from './AlertTypography';\nimport styles from './Alert.module.css';\n\ntype AlertActionMode = 'cancel' | 'destructive' | 'default';\n\nexport interface AlertActionInterface\n extends Pick<ButtonProps, 'Component'>,\n AnchorHTMLAttributesOnly,\n HasDataAttribute {\n title: string;\n /**\n * Обработчик клика на опцию. Если свойство `autoCloseDisabled` включено,\n * то в аргументы `action` передаётся объект с функцией close,\n * вызвав которую можно закрыть `action` вручную.\n */\n action?: (args?: { close?: VoidFunction }) => void;\n /**\n * По умолчанию клик на опцию вызывает переданную в `Alert` функцию `onClose`, данное свойство\n * позволяет отключить такое поведение\n */\n autoCloseDisabled?: boolean;\n mode: AlertActionMode;\n}\n\nexport interface AlertProps\n extends Omit<React.HTMLAttributes<HTMLElement>, 'title'>,\n HasRootRef<HTMLDivElement> {\n actionsLayout?: 'vertical' | 'horizontal';\n actionsAlign?: AlignType;\n actions?: AlertActionInterface[];\n renderAction?: (props: AlertActionProps) => React.ReactNode;\n title?: React.ReactNode;\n description?: React.ReactNode;\n onClose: VoidFunction;\n /**\n * Текст кнопки закрытия. Делает ее доступной для ассистивных технологий\n */\n dismissLabel?: string;\n /**\n * Расположение кнопки закрытия (внутри и вне `popout'a`)\n * Доступно только в `compact`-режиме, не отображается на `iOS`\n */\n dismissButtonMode?: 'inside' | 'outside';\n /**\n * `data-testid` для кнопки закрытия\n */\n dismissButtonTestId?: string;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Alert\n */\nexport const Alert = ({\n actions,\n actionsLayout = 'horizontal',\n children,\n className,\n style,\n title,\n description,\n onClose,\n dismissLabel = 'Закрыть предупреждение',\n renderAction,\n actionsAlign,\n dismissButtonMode = 'outside',\n dismissButtonTestId,\n getRootRef,\n ...restProps\n}: AlertProps): React.ReactNode => {\n const generatedId = React.useId();\n\n const titleId = `vkui-alert-${generatedId}-title`;\n const descriptionId = `vkui-alert-${generatedId}-description`;\n\n const platform = usePlatform();\n const { isDesktop } = useAdaptivityWithJSMediaQueries();\n\n const [closing, setClosing] = React.useState(false);\n const itemActionCallbackRef = React.useRef(noop);\n const [animationState, animationHandlers] = useCSSKeyframesAnimationController(\n closing ? 'exit' : 'enter',\n {\n onExited() {\n itemActionCallbackRef.current();\n itemActionCallbackRef.current = noop;\n onClose();\n },\n },\n );\n const isDismissButtonVisible = isDesktop && platform !== 'ios';\n const elementRef = React.useRef<HTMLDivElement>(null);\n\n const close = React.useCallback(() => {\n setClosing(true);\n }, []);\n\n const onItemClick = React.useCallback(\n (item: AlertActionInterface) => {\n const { action: itemAction, autoCloseDisabled = false } = item;\n\n if (autoCloseDisabled) {\n itemAction && itemAction({ close });\n } else {\n if (itemAction) {\n itemActionCallbackRef.current = itemAction;\n }\n setClosing(true);\n }\n },\n [close],\n );\n\n useScrollLock();\n\n return (\n <PopoutWrapper\n className={className}\n closing={closing}\n style={style}\n onClick={close}\n getRootRef={getRootRef}\n >\n <FocusTrap\n {...restProps}\n {...animationHandlers}\n getRootRef={elementRef}\n onClick={stopPropagation}\n onClose={close}\n autoFocus={animationState === 'entered'}\n className={classNames(\n styles.host,\n platform === 'ios' && styles.ios,\n platform === 'vkcom' && styles.vkcom,\n closing ? styles.closing : styles.opening,\n isDesktop && styles.desktop,\n )}\n role=\"alertdialog\"\n aria-modal\n aria-labelledby={titleId}\n aria-describedby={descriptionId}\n >\n <div\n className={classNames(\n styles.content,\n dismissButtonMode === 'inside' && styles.contentWithButton,\n )}\n >\n {hasReactNode(title) && <AlertTitle id={titleId}>{title}</AlertTitle>}\n {hasReactNode(description) && (\n <AlertDescription id={descriptionId}>{description}</AlertDescription>\n )}\n {children}\n {isDismissButtonVisible && dismissButtonMode === 'inside' && (\n <IconButton\n label={dismissLabel}\n className={classNames(styles.dismiss, 'vkuiInternalAlert__dismiss')}\n onClick={close}\n hoverMode=\"opacity\"\n activeMode=\"opacity\"\n data-testid={dismissButtonTestId}\n >\n <Icon20Cancel />\n </IconButton>\n )}\n </div>\n <AlertActions\n actions={actions}\n actionsAlign={actionsAlign}\n actionsLayout={actionsLayout}\n renderAction={renderAction}\n onItemClick={onItemClick}\n />\n {isDismissButtonVisible && dismissButtonMode === 'outside' && (\n <ModalDismissButton onClick={close} data-testid={dismissButtonTestId}>\n {dismissLabel}\n </ModalDismissButton>\n )}\n </FocusTrap>\n </PopoutWrapper>\n );\n};\n"],"names":["React","Icon20Cancel","classNames","hasReactNode","noop","useAdaptivityWithJSMediaQueries","usePlatform","useCSSKeyframesAnimationController","stopPropagation","useScrollLock","FocusTrap","IconButton","ModalDismissButton","PopoutWrapper","AlertActions","AlertDescription","AlertTitle","Alert","actions","actionsLayout","children","className","style","title","description","onClose","dismissLabel","renderAction","actionsAlign","dismissButtonMode","dismissButtonTestId","getRootRef","restProps","generatedId","useId","titleId","descriptionId","platform","isDesktop","closing","setClosing","useState","itemActionCallbackRef","useRef","animationState","animationHandlers","onExited","current","isDismissButtonVisible","elementRef","close","useCallback","onItemClick","item","action","itemAction","autoCloseDisabled","onClick","autoFocus","role","aria-modal","aria-labelledby","aria-describedby","div","id","label","hoverMode","activeMode","data-testid"],"mappings":"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"}
@@ -13,7 +13,7 @@ const AlertActionIos = (_param)=>{
13
13
  ]);
14
14
  return /*#__PURE__*/ _jsx(Tappable, _object_spread({
15
15
  Component: restProps.href ? 'a' : 'button',
16
- className: classNames("Alert__action--WeFR6", mode === 'destructive' && "Alert__actionModeDestructive--tmfw-", mode === 'cancel' && "Alert__actionModeCancel--LETUE")
16
+ className: classNames("vkuiAlert__action", mode === 'destructive' && "vkuiAlert__actionModeDestructive", mode === 'cancel' && "vkuiAlert__actionModeCancel")
17
17
  }, restProps));
18
18
  };
19
19
  const AlertActionBase = (_param)=>{
@@ -26,7 +26,7 @@ const AlertActionBase = (_param)=>{
26
26
  buttonMode = mode === 'cancel' ? 'secondary' : 'primary';
27
27
  }
28
28
  return /*#__PURE__*/ _jsx(Button, _object_spread({
29
- className: classNames("Alert__button--HAJkm", mode === 'cancel' && "Alert__buttonModeCancel--BB3aG"),
29
+ className: classNames("vkuiAlert__button", mode === 'cancel' && "vkuiAlert__buttonModeCancel"),
30
30
  mode: buttonMode,
31
31
  size: "m"
32
32
  }, restProps));
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Alert/AlertAction.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport type { AnchorHTMLAttributesOnly } from '../../types';\nimport { Button, type ButtonProps } from '../Button/Button';\nimport { Tappable } from '../Tappable/Tappable';\nimport type { AlertActionInterface } from './Alert';\nimport styles from './Alert.module.css';\n\nexport interface AlertActionProps\n extends Pick<AlertActionInterface, 'Component' | 'mode'>,\n AnchorHTMLAttributesOnly {\n children: string;\n onClick: React.MouseEventHandler<HTMLElement>;\n}\n\nconst AlertActionIos = ({ mode, ...restProps }: AlertActionProps) => {\n return (\n <Tappable\n Component={restProps.href ? 'a' : 'button'}\n className={classNames(\n styles.action,\n mode === 'destructive' && styles.actionModeDestructive,\n mode === 'cancel' && styles.actionModeCancel,\n )}\n {...restProps}\n />\n );\n};\n\nconst AlertActionBase = ({ mode, ...restProps }: AlertActionProps) => {\n const platform = usePlatform();\n\n let buttonMode: ButtonProps['mode'] = 'tertiary';\n\n if (platform === 'vkcom') {\n buttonMode = mode === 'cancel' ? 'secondary' : 'primary';\n }\n\n return (\n <Button\n className={classNames(styles.button, mode === 'cancel' && styles.buttonModeCancel)}\n mode={buttonMode}\n size=\"m\"\n {...restProps}\n />\n );\n};\n\nexport const AlertAction = (props: AlertActionProps): React.ReactNode => {\n const platform = usePlatform();\n\n if (platform === 'ios') {\n return <AlertActionIos {...props} />;\n }\n\n return <AlertActionBase {...props} />;\n};\n"],"names":["React","classNames","usePlatform","Button","Tappable","AlertActionIos","mode","restProps","Component","href","className","AlertActionBase","platform","buttonMode","size","AlertAction","props"],"mappings":"AAAA;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,6BAA0B;AAEtD,SAASC,MAAM,QAA0B,sBAAmB;AAC5D,SAASC,QAAQ,QAAQ,0BAAuB;AAWhD,MAAMC,iBAAiB;QAAC,EAAEC,IAAI,EAAkC,WAA7BC;QAATD;;IACxB,qBACE,KAACF;QACCI,WAAWD,UAAUE,IAAI,GAAG,MAAM;QAClCC,WAAWT,mCAETK,SAAS,wDACTA,SAAS;OAEPC;AAGV;AAEA,MAAMI,kBAAkB;QAAC,EAAEL,IAAI,EAAkC,WAA7BC;QAATD;;IACzB,MAAMM,WAAWV;IAEjB,IAAIW,aAAkC;IAEtC,IAAID,aAAa,SAAS;QACxBC,aAAaP,SAAS,WAAW,cAAc;IACjD;IAEA,qBACE,KAACH;QACCO,WAAWT,mCAA0BK,SAAS;QAC9CA,MAAMO;QACNC,MAAK;OACDP;AAGV;AAEA,OAAO,MAAMQ,cAAc,CAACC;IAC1B,MAAMJ,WAAWV;IAEjB,IAAIU,aAAa,OAAO;QACtB,qBAAO,KAACP,mCAAmBW;IAC7B;IAEA,qBAAO,KAACL,oCAAoBK;AAC9B,EAAE"}
1
+ {"version":3,"sources":["../../../src/components/Alert/AlertAction.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport type { AnchorHTMLAttributesOnly } from '../../types';\nimport { Button, type ButtonProps } from '../Button/Button';\nimport { Tappable } from '../Tappable/Tappable';\nimport type { AlertActionInterface } from './Alert';\nimport styles from './Alert.module.css';\n\nexport interface AlertActionProps\n extends Pick<AlertActionInterface, 'Component' | 'mode'>,\n AnchorHTMLAttributesOnly {\n children: string;\n onClick: React.MouseEventHandler<HTMLElement>;\n}\n\nconst AlertActionIos = ({ mode, ...restProps }: AlertActionProps) => {\n return (\n <Tappable\n Component={restProps.href ? 'a' : 'button'}\n className={classNames(\n styles.action,\n mode === 'destructive' && styles.actionModeDestructive,\n mode === 'cancel' && styles.actionModeCancel,\n )}\n {...restProps}\n />\n );\n};\n\nconst AlertActionBase = ({ mode, ...restProps }: AlertActionProps) => {\n const platform = usePlatform();\n\n let buttonMode: ButtonProps['mode'] = 'tertiary';\n\n if (platform === 'vkcom') {\n buttonMode = mode === 'cancel' ? 'secondary' : 'primary';\n }\n\n return (\n <Button\n className={classNames(styles.button, mode === 'cancel' && styles.buttonModeCancel)}\n mode={buttonMode}\n size=\"m\"\n {...restProps}\n />\n );\n};\n\nexport const AlertAction = (props: AlertActionProps): React.ReactNode => {\n const platform = usePlatform();\n\n if (platform === 'ios') {\n return <AlertActionIos {...props} />;\n }\n\n return <AlertActionBase {...props} />;\n};\n"],"names":["React","classNames","usePlatform","Button","Tappable","AlertActionIos","mode","restProps","Component","href","className","AlertActionBase","platform","buttonMode","size","AlertAction","props"],"mappings":"AAAA;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,6BAA0B;AAEtD,SAASC,MAAM,QAA0B,sBAAmB;AAC5D,SAASC,QAAQ,QAAQ,0BAAuB;AAWhD,MAAMC,iBAAiB;QAAC,EAAEC,IAAI,EAAkC,WAA7BC;QAATD;;IACxB,qBACE,KAACF;QACCI,WAAWD,UAAUE,IAAI,GAAG,MAAM;QAClCC,WAAWT,gCAETK,SAAS,qDACTA,SAAS;OAEPC;AAGV;AAEA,MAAMI,kBAAkB;QAAC,EAAEL,IAAI,EAAkC,WAA7BC;QAATD;;IACzB,MAAMM,WAAWV;IAEjB,IAAIW,aAAkC;IAEtC,IAAID,aAAa,SAAS;QACxBC,aAAaP,SAAS,WAAW,cAAc;IACjD;IAEA,qBACE,KAACH;QACCO,WAAWT,gCAA0BK,SAAS;QAC9CA,MAAMO;QACNC,MAAK;OACDP;AAGV;AAEA,OAAO,MAAMQ,cAAc,CAACC;IAC1B,MAAMJ,WAAWV;IAEjB,IAAIU,aAAa,OAAO;QACtB,qBAAO,KAACP,mCAAmBW;IAC7B;IAEA,qBAAO,KAACL,oCAAoBK;AAC9B,EAAE"}
@@ -7,19 +7,19 @@ import { classNames } from "@vkontakte/vkjs";
7
7
  import { usePlatform } from "../../hooks/usePlatform.js";
8
8
  import { AlertAction } from "./AlertAction.js";
9
9
  const alignStyles = {
10
- left: "Alert__actionsAlignLeft--wPpf3",
11
- center: "Alert__actionsAlignCenter--Q53fE",
12
- right: "Alert__actionsAlignRight--ZEV6i"
10
+ left: "vkuiAlert__actionsAlignLeft",
11
+ center: "vkuiAlert__actionsAlignCenter",
12
+ right: "vkuiAlert__actionsAlignRight"
13
13
  };
14
14
  const directionStyles = {
15
- vertical: "Alert__actionsDirectionVertical--Ksj-A",
16
- horizontal: "Alert__actionsDirectionHorizontal--tBjp8"
15
+ vertical: "vkuiAlert__actionsDirectionVertical",
16
+ horizontal: "vkuiAlert__actionsDirectionHorizontal"
17
17
  };
18
18
  export const AlertActions = ({ actions = [], renderAction = (props)=>/*#__PURE__*/ _jsx(AlertAction, _object_spread({}, props)), onItemClick, actionsAlign, actionsLayout })=>{
19
19
  const platform = usePlatform();
20
20
  const direction = platform === 'vkcom' ? 'horizontal' : actionsLayout;
21
21
  return /*#__PURE__*/ _jsx("div", {
22
- className: classNames("Alert__actions--RW9lv", actionsAlign && alignStyles[actionsAlign], direction && directionStyles[direction]),
22
+ className: classNames("vkuiAlert__actions", actionsAlign && alignStyles[actionsAlign], direction && directionStyles[direction]),
23
23
  children: actions.map((action, i)=>{
24
24
  // Убираем
25
25
  const { title: children, action: _, autoCloseDisabled } = action, restProps = _object_without_properties(action, [
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Alert/AlertActions.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport type { AlertActionInterface, AlertProps } from './Alert';\nimport { AlertAction } from './AlertAction';\nimport styles from './Alert.module.css';\n\nconst alignStyles = {\n left: styles.actionsAlignLeft,\n center: styles.actionsAlignCenter,\n right: styles.actionsAlignRight,\n};\n\nconst directionStyles = {\n vertical: styles.actionsDirectionVertical,\n horizontal: styles.actionsDirectionHorizontal,\n};\n\ntype ItemClickHandler = (item: AlertActionInterface) => void;\ninterface AlertActionsProps\n extends Pick<AlertProps, 'actions' | 'actionsAlign' | 'renderAction' | 'actionsLayout'> {\n onItemClick: ItemClickHandler;\n}\nexport const AlertActions = ({\n actions = [],\n renderAction = (props) => <AlertAction {...props} />,\n onItemClick,\n actionsAlign,\n actionsLayout,\n}: AlertActionsProps): React.ReactNode => {\n const platform = usePlatform();\n\n const direction: AlertProps['actionsLayout'] =\n platform === 'vkcom' ? 'horizontal' : actionsLayout;\n\n return (\n <div\n className={classNames(\n styles.actions,\n actionsAlign && alignStyles[actionsAlign],\n direction && directionStyles[direction],\n )}\n >\n {actions.map((action, i) => {\n // Убираем\n const { title: children, action: _, autoCloseDisabled, ...restProps } = action;\n\n return (\n <React.Fragment key={i}>\n {renderAction({\n children,\n onClick: () => onItemClick(action),\n ...restProps,\n })}\n </React.Fragment>\n );\n })}\n </div>\n );\n};\n"],"names":["React","classNames","usePlatform","AlertAction","alignStyles","left","center","right","directionStyles","vertical","horizontal","AlertActions","actions","renderAction","props","onItemClick","actionsAlign","actionsLayout","platform","direction","div","className","map","action","i","title","children","_","autoCloseDisabled","restProps","Fragment","onClick"],"mappings":"AAAA;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,6BAA0B;AAEtD,SAASC,WAAW,QAAQ,mBAAgB;AAG5C,MAAMC,cAAc;IAClBC,IAAI;IACJC,MAAM;IACNC,KAAK;AACP;AAEA,MAAMC,kBAAkB;IACtBC,QAAQ;IACRC,UAAU;AACZ;AAOA,OAAO,MAAMC,eAAe,CAAC,EAC3BC,UAAU,EAAE,EACZC,eAAe,CAACC,sBAAU,KAACX,gCAAgBW,OAAS,EACpDC,WAAW,EACXC,YAAY,EACZC,aAAa,EACK;IAClB,MAAMC,WAAWhB;IAEjB,MAAMiB,YACJD,aAAa,UAAU,eAAeD;IAExC,qBACE,KAACG;QACCC,WAAWpB,oCAETe,gBAAgBZ,WAAW,CAACY,aAAa,EACzCG,aAAaX,eAAe,CAACW,UAAU;kBAGxCP,QAAQU,GAAG,CAAC,CAACC,QAAQC;YACpB,UAAU;YACV,MAAM,EAAEC,OAAOC,QAAQ,EAAEH,QAAQI,CAAC,EAAEC,iBAAiB,EAAgB,GAAGL,QAAdM,uCAAcN;gBAAhEE;gBAAiBF;gBAAWK;;YAEpC,qBACE,KAAC5B,MAAM8B,QAAQ;0BACZjB,aAAa;oBACZa;oBACAK,SAAS,IAAMhB,YAAYQ;mBACxBM;eAJcL;QAQzB;;AAGN,EAAE"}
1
+ {"version":3,"sources":["../../../src/components/Alert/AlertActions.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport type { AlertActionInterface, AlertProps } from './Alert';\nimport { AlertAction } from './AlertAction';\nimport styles from './Alert.module.css';\n\nconst alignStyles = {\n left: styles.actionsAlignLeft,\n center: styles.actionsAlignCenter,\n right: styles.actionsAlignRight,\n};\n\nconst directionStyles = {\n vertical: styles.actionsDirectionVertical,\n horizontal: styles.actionsDirectionHorizontal,\n};\n\ntype ItemClickHandler = (item: AlertActionInterface) => void;\ninterface AlertActionsProps\n extends Pick<AlertProps, 'actions' | 'actionsAlign' | 'renderAction' | 'actionsLayout'> {\n onItemClick: ItemClickHandler;\n}\nexport const AlertActions = ({\n actions = [],\n renderAction = (props) => <AlertAction {...props} />,\n onItemClick,\n actionsAlign,\n actionsLayout,\n}: AlertActionsProps): React.ReactNode => {\n const platform = usePlatform();\n\n const direction: AlertProps['actionsLayout'] =\n platform === 'vkcom' ? 'horizontal' : actionsLayout;\n\n return (\n <div\n className={classNames(\n styles.actions,\n actionsAlign && alignStyles[actionsAlign],\n direction && directionStyles[direction],\n )}\n >\n {actions.map((action, i) => {\n // Убираем\n const { title: children, action: _, autoCloseDisabled, ...restProps } = action;\n\n return (\n <React.Fragment key={i}>\n {renderAction({\n children,\n onClick: () => onItemClick(action),\n ...restProps,\n })}\n </React.Fragment>\n );\n })}\n </div>\n );\n};\n"],"names":["React","classNames","usePlatform","AlertAction","alignStyles","left","center","right","directionStyles","vertical","horizontal","AlertActions","actions","renderAction","props","onItemClick","actionsAlign","actionsLayout","platform","direction","div","className","map","action","i","title","children","_","autoCloseDisabled","restProps","Fragment","onClick"],"mappings":"AAAA;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,6BAA0B;AAEtD,SAASC,WAAW,QAAQ,mBAAgB;AAG5C,MAAMC,cAAc;IAClBC,IAAI;IACJC,MAAM;IACNC,KAAK;AACP;AAEA,MAAMC,kBAAkB;IACtBC,QAAQ;IACRC,UAAU;AACZ;AAOA,OAAO,MAAMC,eAAe,CAAC,EAC3BC,UAAU,EAAE,EACZC,eAAe,CAACC,sBAAU,KAACX,gCAAgBW,OAAS,EACpDC,WAAW,EACXC,YAAY,EACZC,aAAa,EACK;IAClB,MAAMC,WAAWhB;IAEjB,MAAMiB,YACJD,aAAa,UAAU,eAAeD;IAExC,qBACE,KAACG;QACCC,WAAWpB,iCAETe,gBAAgBZ,WAAW,CAACY,aAAa,EACzCG,aAAaX,eAAe,CAACW,UAAU;kBAGxCP,QAAQU,GAAG,CAAC,CAACC,QAAQC;YACpB,UAAU;YACV,MAAM,EAAEC,OAAOC,QAAQ,EAAEH,QAAQI,CAAC,EAAEC,iBAAiB,EAAgB,GAAGL,QAAdM,uCAAcN;gBAAhEE;gBAAiBF;gBAAWK;;YAEpC,qBACE,KAAC5B,MAAM8B,QAAQ;0BACZjB,aAAa;oBACZa;oBACAK,SAAS,IAAMhB,YAAYQ;mBACxBM;eAJcL;QAQzB;;AAGN,EAAE"}
@@ -12,13 +12,13 @@ export const AlertTitle = (props)=>{
12
12
  switch(platform){
13
13
  case 'ios':
14
14
  return /*#__PURE__*/ _jsx(Title, _object_spread({
15
- className: "Alert__title--abGgF",
15
+ className: "vkuiAlert__title",
16
16
  weight: "1",
17
17
  level: "3"
18
18
  }, props));
19
19
  default:
20
20
  return /*#__PURE__*/ _jsx(Title, _object_spread({
21
- className: "Alert__title--abGgF",
21
+ className: "vkuiAlert__title",
22
22
  weight: "2",
23
23
  level: "2"
24
24
  }, props));
@@ -29,16 +29,16 @@ export const AlertDescription = (props)=>{
29
29
  switch(platform){
30
30
  case 'vkcom':
31
31
  return /*#__PURE__*/ _jsx(Footnote, _object_spread({
32
- className: "Alert__description--pXPvw"
32
+ className: "vkuiAlert__description"
33
33
  }, props));
34
34
  case 'ios':
35
35
  return /*#__PURE__*/ _jsx(Caption, _object_spread({
36
- className: "Alert__description--pXPvw"
36
+ className: "vkuiAlert__description"
37
37
  }, props));
38
38
  default:
39
39
  return /*#__PURE__*/ _jsx(Text, _object_spread({
40
40
  Component: "span",
41
- className: "Alert__description--pXPvw",
41
+ className: "vkuiAlert__description",
42
42
  weight: "3"
43
43
  }, props));
44
44
  }
@@ -151,7 +151,7 @@ import { extractPortalRootByProp, getClassNamesByMode, getParentElement, getUser
151
151
  });
152
152
  return mode === 'partial' ? content : /*#__PURE__*/ _jsx("div", _object_spread_props(_object_spread({
153
153
  ref: appRootRef,
154
- className: classNames("AppRoot__host--Zv--8", userSelectModeClassName, className)
154
+ className: classNames("vkuiAppRoot__host", userSelectModeClassName, className)
155
155
  }, props), {
156
156
  children: content
157
157
  }));
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/AppRoot/AppRoot.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useKeyboardInputTracker } from '../../hooks/useKeyboardInputTracker';\nimport { useObjectMemo } from '../../hooks/useObjectMemo';\nimport { getDocumentBody } from '../../lib/dom';\nimport { useTokensClassName } from '../../lib/tokens';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { AppRootContext } from './AppRootContext';\nimport { ElementScrollController, GlobalScrollController } from './ScrollContext';\nimport {\n extractPortalRootByProp,\n getClassNamesByMode,\n getParentElement,\n getUserSelectModeClassName,\n setSafeAreaInsets,\n} from './helpers';\nimport type {\n AppRootLayout,\n AppRootMode,\n AppRootScroll,\n AppRootUserSelectMode,\n SafeAreaInsets,\n} from './types';\nimport styles from './AppRoot.module.css';\n\nexport interface AppRootProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Режим встраивания */\n mode?: AppRootMode;\n /**\n * - `global` (по умолчанию) — VKUI-приложение скроллится вместе со страницей.\n * - `contain` — VKUI-приложение живет в отдельной зоне и скроллится независимо внутри `AppRoot` (например, в модалке).\n *\n * Полезно при использовании `mode=\"embedded\"`.\n */\n scroll?: AppRootScroll;\n /**\n * см. документацию [mdn web docs | env#values](https://developer.mozilla.org/en-US/docs/Web/CSS/env#values).\n */\n safeAreaInsets?: SafeAreaInsets;\n /**\n * Кастомный root-элемент портала\n */\n portalRoot?: HTMLElement | React.RefObject<HTMLElement> | null;\n /**\n * Отключает рендер всплывающих компонентов в отдельном контейнере\n */\n disablePortal?: boolean;\n /**\n * По умолчанию, mode=\"embedded\" переносит систему координат элементов с `position: fixed` на\n * свой контейнер через `transform: translate3d(0, 0, 0)`.\n *\n * Это поведение можно отключить с помощью этого параметра.\n */\n disableParentTransformForPositionFixedElements?: boolean;\n /**\n * Глобально задаёт тип оформления макета для компонентов\n * [Panel](https://vkcom.github.io/VKUI/#/Panel) и [Group](https://vkcom.github.io/VKUI/#/Group).\n */\n layout?: AppRootLayout;\n /**\n * Задаёт режим выбора текста (выделения текста) для всего приложения.\n * По умолчанию, если режим не задан, запрещает выбор текста в приложениях,\n * запущенных в webview (по значению свойства `isWebView` из [ConfigProvider](https://vkcom.github.io/VKUI/#/ConfigProvider)).\n *\n * - `enabled-with-pointer` – разрешает выбор текста, если устройство ввода типа `pointer` (например, `мышь`), в остальных случаях запрещает;\n * - `disabled` – запрещает выбор текста;\n * - `enabled` – разрешает выбор текста.\n *\n * @since 6.2.0\n */\n userSelectMode?: AppRootUserSelectMode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/AppRoot\n */\nexport const AppRoot = ({\n children,\n mode = 'full',\n scroll = 'global',\n portalRoot: portalRootProp = null,\n disablePortal = false,\n disableParentTransformForPositionFixedElements,\n className,\n safeAreaInsets: safeAreaInsetsProp,\n layout,\n userSelectMode,\n ...props\n}: AppRootProps): React.ReactNode => {\n const { hasPointer, sizeX = 'none', sizeY = 'none' } = useAdaptivity();\n const tokensClassName = useTokensClassName();\n\n const safeAreaInsets = useObjectMemo(safeAreaInsetsProp);\n const isKeyboardInputActiveRef = useKeyboardInputTracker();\n const appRootRef = React.useRef<HTMLDivElement | null>(null);\n const portalRootRef = React.useRef<HTMLElement | null>(null);\n\n useIsomorphicLayoutEffect(\n function setupPortalRoot() {\n const portalByProp = portalRootProp ? extractPortalRootByProp(portalRootProp) : null;\n\n if (portalByProp) {\n portalRootRef.current = portalByProp;\n return function cleanup() {\n portalRootRef.current = null;\n };\n }\n\n const documentBody = getDocumentBody(appRootRef.current);\n const portal = documentBody.ownerDocument.createElement('div');\n documentBody.appendChild(portal);\n portalRootRef.current = portal;\n return function cleanup() {\n documentBody.removeChild(portal);\n portalRootRef.current = null;\n };\n },\n [portalRootProp],\n );\n\n useIsomorphicLayoutEffect(\n function setupContainers() {\n if (!appRootRef.current || !portalRootRef.current) {\n return;\n }\n\n const parentElement = getParentElement(appRootRef.current);\n const documentBody = getDocumentBody(appRootRef.current);\n const documentElement = documentBody.ownerDocument.documentElement;\n\n const [baseClassNames, stylesClassNames] = getClassNamesByMode({\n mode,\n layout,\n tokensClassName,\n sizeX,\n sizeY,\n });\n\n /* eslint-disable no-restricted-properties */\n switch (mode) {\n case 'full': {\n if (parentElement) {\n parentElement.classList.add(...baseClassNames);\n }\n\n documentElement.classList.add(...stylesClassNames, 'vkui');\n const unsetSafeAreaInsets = setSafeAreaInsets(safeAreaInsets, documentElement);\n\n return function cleanup() {\n if (parentElement) {\n parentElement.classList.remove(...baseClassNames);\n }\n\n documentElement.classList.remove(...stylesClassNames, 'vkui');\n unsetSafeAreaInsets();\n };\n }\n case 'embedded': {\n if (parentElement) {\n parentElement.classList.add(...baseClassNames, ...stylesClassNames);\n if (!disableParentTransformForPositionFixedElements) {\n parentElement.style.setProperty('transform', 'translate3d(0, 0, 0)');\n }\n const unsetSafeAreaInsets = setSafeAreaInsets(safeAreaInsets, parentElement, portalRootRef.current); // prettier-ignore\n return function cleanup() {\n parentElement.classList.remove(...baseClassNames, ...stylesClassNames);\n if (!disableParentTransformForPositionFixedElements) {\n parentElement.style.removeProperty('transform');\n }\n unsetSafeAreaInsets();\n };\n }\n /* istanbul ignore next: node.parentElement может быть null, но такой кейс в теории невозможен */\n return;\n }\n /* istanbul ignore next: не покрывается за счёт теста на <AppRoot mode=\"partial\" /> */\n case 'partial': {\n return;\n }\n }\n /* eslint-enable no-restricted-properties */\n },\n [\n mode,\n layout,\n disableParentTransformForPositionFixedElements,\n tokensClassName,\n sizeX,\n sizeY,\n safeAreaInsets,\n ],\n );\n\n const ScrollController = React.useMemo(\n () => (scroll === 'contain' ? ElementScrollController : GlobalScrollController),\n [scroll],\n );\n\n const contextValue = React.useMemo(\n () => ({\n appRoot: appRootRef,\n portalRoot: portalRootRef,\n embedded: mode === 'embedded',\n mode,\n disablePortal,\n layout,\n get keyboardInput() {\n return isKeyboardInputActiveRef.current;\n },\n }),\n [disablePortal, isKeyboardInputActiveRef, layout, mode],\n );\n\n const content = (\n <AppRootContext.Provider value={contextValue}>\n <ScrollController elRef={appRootRef}>{children}</ScrollController>\n </AppRootContext.Provider>\n );\n\n const { isWebView } = useConfigProvider();\n const userSelectModeClassName = getUserSelectModeClassName({\n userSelectMode,\n isWebView,\n hasPointer,\n });\n\n return mode === 'partial' ? (\n content\n ) : (\n <div\n ref={appRootRef}\n className={classNames(styles.host, userSelectModeClassName, className)}\n {...props}\n >\n {content}\n </div>\n );\n};\n"],"names":["React","classNames","useAdaptivity","useKeyboardInputTracker","useObjectMemo","getDocumentBody","useTokensClassName","useIsomorphicLayoutEffect","useConfigProvider","AppRootContext","ElementScrollController","GlobalScrollController","extractPortalRootByProp","getClassNamesByMode","getParentElement","getUserSelectModeClassName","setSafeAreaInsets","AppRoot","children","mode","scroll","portalRoot","portalRootProp","disablePortal","disableParentTransformForPositionFixedElements","className","safeAreaInsets","safeAreaInsetsProp","layout","userSelectMode","props","hasPointer","sizeX","sizeY","tokensClassName","isKeyboardInputActiveRef","appRootRef","useRef","portalRootRef","setupPortalRoot","portalByProp","current","cleanup","documentBody","portal","ownerDocument","createElement","appendChild","removeChild","setupContainers","parentElement","documentElement","baseClassNames","stylesClassNames","classList","add","unsetSafeAreaInsets","remove","style","setProperty","removeProperty","ScrollController","useMemo","contextValue","appRoot","embedded","keyboardInput","content","Provider","value","elRef","isWebView","userSelectModeClassName","div","ref"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../src/components/AppRoot/AppRoot.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useKeyboardInputTracker } from '../../hooks/useKeyboardInputTracker';\nimport { useObjectMemo } from '../../hooks/useObjectMemo';\nimport { getDocumentBody } from '../../lib/dom';\nimport { useTokensClassName } from '../../lib/tokens';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { AppRootContext } from './AppRootContext';\nimport { ElementScrollController, GlobalScrollController } from './ScrollContext';\nimport {\n extractPortalRootByProp,\n getClassNamesByMode,\n getParentElement,\n getUserSelectModeClassName,\n setSafeAreaInsets,\n} from './helpers';\nimport type {\n AppRootLayout,\n AppRootMode,\n AppRootScroll,\n AppRootUserSelectMode,\n SafeAreaInsets,\n} from './types';\nimport styles from './AppRoot.module.css';\n\nexport interface AppRootProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Режим встраивания */\n mode?: AppRootMode;\n /**\n * - `global` (по умолчанию) — VKUI-приложение скроллится вместе со страницей.\n * - `contain` — VKUI-приложение живет в отдельной зоне и скроллится независимо внутри `AppRoot` (например, в модалке).\n *\n * Полезно при использовании `mode=\"embedded\"`.\n */\n scroll?: AppRootScroll;\n /**\n * см. документацию [mdn web docs | env#values](https://developer.mozilla.org/en-US/docs/Web/CSS/env#values).\n */\n safeAreaInsets?: SafeAreaInsets;\n /**\n * Кастомный root-элемент портала\n */\n portalRoot?: HTMLElement | React.RefObject<HTMLElement> | null;\n /**\n * Отключает рендер всплывающих компонентов в отдельном контейнере\n */\n disablePortal?: boolean;\n /**\n * По умолчанию, mode=\"embedded\" переносит систему координат элементов с `position: fixed` на\n * свой контейнер через `transform: translate3d(0, 0, 0)`.\n *\n * Это поведение можно отключить с помощью этого параметра.\n */\n disableParentTransformForPositionFixedElements?: boolean;\n /**\n * Глобально задаёт тип оформления макета для компонентов\n * [Panel](https://vkcom.github.io/VKUI/#/Panel) и [Group](https://vkcom.github.io/VKUI/#/Group).\n */\n layout?: AppRootLayout;\n /**\n * Задаёт режим выбора текста (выделения текста) для всего приложения.\n * По умолчанию, если режим не задан, запрещает выбор текста в приложениях,\n * запущенных в webview (по значению свойства `isWebView` из [ConfigProvider](https://vkcom.github.io/VKUI/#/ConfigProvider)).\n *\n * - `enabled-with-pointer` – разрешает выбор текста, если устройство ввода типа `pointer` (например, `мышь`), в остальных случаях запрещает;\n * - `disabled` – запрещает выбор текста;\n * - `enabled` – разрешает выбор текста.\n *\n * @since 6.2.0\n */\n userSelectMode?: AppRootUserSelectMode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/AppRoot\n */\nexport const AppRoot = ({\n children,\n mode = 'full',\n scroll = 'global',\n portalRoot: portalRootProp = null,\n disablePortal = false,\n disableParentTransformForPositionFixedElements,\n className,\n safeAreaInsets: safeAreaInsetsProp,\n layout,\n userSelectMode,\n ...props\n}: AppRootProps): React.ReactNode => {\n const { hasPointer, sizeX = 'none', sizeY = 'none' } = useAdaptivity();\n const tokensClassName = useTokensClassName();\n\n const safeAreaInsets = useObjectMemo(safeAreaInsetsProp);\n const isKeyboardInputActiveRef = useKeyboardInputTracker();\n const appRootRef = React.useRef<HTMLDivElement | null>(null);\n const portalRootRef = React.useRef<HTMLElement | null>(null);\n\n useIsomorphicLayoutEffect(\n function setupPortalRoot() {\n const portalByProp = portalRootProp ? extractPortalRootByProp(portalRootProp) : null;\n\n if (portalByProp) {\n portalRootRef.current = portalByProp;\n return function cleanup() {\n portalRootRef.current = null;\n };\n }\n\n const documentBody = getDocumentBody(appRootRef.current);\n const portal = documentBody.ownerDocument.createElement('div');\n documentBody.appendChild(portal);\n portalRootRef.current = portal;\n return function cleanup() {\n documentBody.removeChild(portal);\n portalRootRef.current = null;\n };\n },\n [portalRootProp],\n );\n\n useIsomorphicLayoutEffect(\n function setupContainers() {\n if (!appRootRef.current || !portalRootRef.current) {\n return;\n }\n\n const parentElement = getParentElement(appRootRef.current);\n const documentBody = getDocumentBody(appRootRef.current);\n const documentElement = documentBody.ownerDocument.documentElement;\n\n const [baseClassNames, stylesClassNames] = getClassNamesByMode({\n mode,\n layout,\n tokensClassName,\n sizeX,\n sizeY,\n });\n\n /* eslint-disable no-restricted-properties */\n switch (mode) {\n case 'full': {\n if (parentElement) {\n parentElement.classList.add(...baseClassNames);\n }\n\n documentElement.classList.add(...stylesClassNames, 'vkui');\n const unsetSafeAreaInsets = setSafeAreaInsets(safeAreaInsets, documentElement);\n\n return function cleanup() {\n if (parentElement) {\n parentElement.classList.remove(...baseClassNames);\n }\n\n documentElement.classList.remove(...stylesClassNames, 'vkui');\n unsetSafeAreaInsets();\n };\n }\n case 'embedded': {\n if (parentElement) {\n parentElement.classList.add(...baseClassNames, ...stylesClassNames);\n if (!disableParentTransformForPositionFixedElements) {\n parentElement.style.setProperty('transform', 'translate3d(0, 0, 0)');\n }\n const unsetSafeAreaInsets = setSafeAreaInsets(safeAreaInsets, parentElement, portalRootRef.current); // prettier-ignore\n return function cleanup() {\n parentElement.classList.remove(...baseClassNames, ...stylesClassNames);\n if (!disableParentTransformForPositionFixedElements) {\n parentElement.style.removeProperty('transform');\n }\n unsetSafeAreaInsets();\n };\n }\n /* istanbul ignore next: node.parentElement может быть null, но такой кейс в теории невозможен */\n return;\n }\n /* istanbul ignore next: не покрывается за счёт теста на <AppRoot mode=\"partial\" /> */\n case 'partial': {\n return;\n }\n }\n /* eslint-enable no-restricted-properties */\n },\n [\n mode,\n layout,\n disableParentTransformForPositionFixedElements,\n tokensClassName,\n sizeX,\n sizeY,\n safeAreaInsets,\n ],\n );\n\n const ScrollController = React.useMemo(\n () => (scroll === 'contain' ? ElementScrollController : GlobalScrollController),\n [scroll],\n );\n\n const contextValue = React.useMemo(\n () => ({\n appRoot: appRootRef,\n portalRoot: portalRootRef,\n embedded: mode === 'embedded',\n mode,\n disablePortal,\n layout,\n get keyboardInput() {\n return isKeyboardInputActiveRef.current;\n },\n }),\n [disablePortal, isKeyboardInputActiveRef, layout, mode],\n );\n\n const content = (\n <AppRootContext.Provider value={contextValue}>\n <ScrollController elRef={appRootRef}>{children}</ScrollController>\n </AppRootContext.Provider>\n );\n\n const { isWebView } = useConfigProvider();\n const userSelectModeClassName = getUserSelectModeClassName({\n userSelectMode,\n isWebView,\n hasPointer,\n });\n\n return mode === 'partial' ? (\n content\n ) : (\n <div\n ref={appRootRef}\n className={classNames(styles.host, userSelectModeClassName, className)}\n {...props}\n >\n {content}\n </div>\n );\n};\n"],"names":["React","classNames","useAdaptivity","useKeyboardInputTracker","useObjectMemo","getDocumentBody","useTokensClassName","useIsomorphicLayoutEffect","useConfigProvider","AppRootContext","ElementScrollController","GlobalScrollController","extractPortalRootByProp","getClassNamesByMode","getParentElement","getUserSelectModeClassName","setSafeAreaInsets","AppRoot","children","mode","scroll","portalRoot","portalRootProp","disablePortal","disableParentTransformForPositionFixedElements","className","safeAreaInsets","safeAreaInsetsProp","layout","userSelectMode","props","hasPointer","sizeX","sizeY","tokensClassName","isKeyboardInputActiveRef","appRootRef","useRef","portalRootRef","setupPortalRoot","portalByProp","current","cleanup","documentBody","portal","ownerDocument","createElement","appendChild","removeChild","setupContainers","parentElement","documentElement","baseClassNames","stylesClassNames","classList","add","unsetSafeAreaInsets","remove","style","setProperty","removeProperty","ScrollController","useMemo","contextValue","appRoot","embedded","keyboardInput","content","Provider","value","elRef","isWebView","userSelectModeClassName","div","ref"],"mappings":"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"}