@vkontakte/vkui 4.34.1 → 4.35.1

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 (565) hide show
  1. package/.browserslistrc +5 -0
  2. package/.cache/.eslintcache +1 -1
  3. package/.cache/.stylelintcache +1 -1
  4. package/.cache/.tsbuildinfo +256 -229
  5. package/.cache/ts/src/components/ConfigProvider/ConfigProviderContext.d.ts +1 -0
  6. package/.cache/ts/src/components/CustomSelect/CustomSelect.d.ts +1 -1
  7. package/.cache/ts/src/components/Dropdown/Dropdown.d.ts +46 -5
  8. package/.cache/ts/src/components/FocusTrap/FocusTrap.d.ts +1 -1
  9. package/.cache/ts/src/components/ModalRoot/ModalRoot.d.ts +1 -1
  10. package/.cache/ts/src/components/ModalRoot/ModalRootDesktop.d.ts +1 -1
  11. package/.cache/ts/src/components/Popper/Popper.d.ts +18 -1
  12. package/.cache/ts/src/components/PopperArrow/PopperArrow.d.ts +8 -0
  13. package/.cache/ts/src/components/RichTooltip/RichTooltip.d.ts +7 -2
  14. package/.cache/ts/src/components/Snackbar/Snackbar.d.ts +5 -1
  15. package/.cache/ts/src/components/SplitCol/SplitCol.d.ts +1 -0
  16. package/.cache/ts/src/components/Tabbar/Tabbar.d.ts +8 -1
  17. package/.cache/ts/src/components/Tabs/Tabs.d.ts +13 -2
  18. package/.cache/ts/src/components/TabsItem/TabsItem.d.ts +22 -1
  19. package/.cache/ts/src/components/TextTooltip/TextTooltip.d.ts +5 -1
  20. package/.cache/ts/src/components/Textarea/Textarea.d.ts +3 -0
  21. package/.cache/ts/src/components/Tooltip/Tooltip.d.ts +18 -1
  22. package/.cache/ts/src/components/Typography/Headline/Headline.d.ts +3 -3
  23. package/.cache/ts/src/components/View/View.d.ts +2 -18
  24. package/.cache/ts/src/components/View/ViewInfinite.d.ts +1 -1
  25. package/.cache/ts/src/components/WriteBar/WriteBar.d.ts +5 -1
  26. package/.cache/ts/src/tokenized/index.d.ts +26 -0
  27. package/.eslintrc.json +14 -4
  28. package/dist/cjs/components/AppRoot/AppRoot.js +1 -0
  29. package/dist/cjs/components/AppRoot/AppRoot.js.map +1 -1
  30. package/dist/cjs/components/Button/Button.js +6 -4
  31. package/dist/cjs/components/Button/Button.js.map +1 -1
  32. package/dist/cjs/components/CardScroll/CardScroll.js +3 -1
  33. package/dist/cjs/components/CardScroll/CardScroll.js.map +1 -1
  34. package/dist/cjs/components/ChipsSelect/ChipsSelect.js +1 -0
  35. package/dist/cjs/components/ChipsSelect/ChipsSelect.js.map +1 -1
  36. package/dist/cjs/components/ConfigProvider/ConfigProviderContext.js +7 -1
  37. package/dist/cjs/components/ConfigProvider/ConfigProviderContext.js.map +1 -1
  38. package/dist/cjs/components/CustomSelect/CustomSelect.js +477 -554
  39. package/dist/cjs/components/CustomSelect/CustomSelect.js.map +1 -1
  40. package/dist/cjs/components/Dropdown/Dropdown.js +147 -26
  41. package/dist/cjs/components/Dropdown/Dropdown.js.map +1 -1
  42. package/dist/cjs/components/Epic/Epic.js +1 -6
  43. package/dist/cjs/components/Epic/Epic.js.map +1 -1
  44. package/dist/cjs/components/FocusTrap/FocusTrap.js +9 -10
  45. package/dist/cjs/components/FocusTrap/FocusTrap.js.map +1 -1
  46. package/dist/cjs/components/HorizontalCell/HorizontalCell.js +4 -7
  47. package/dist/cjs/components/HorizontalCell/HorizontalCell.js.map +1 -1
  48. package/dist/cjs/components/HorizontalScroll/HorizontalScroll.js +1 -0
  49. package/dist/cjs/components/HorizontalScroll/HorizontalScroll.js.map +1 -1
  50. package/dist/cjs/components/HorizontalScroll/HorizontalScrollArrow.js +1 -1
  51. package/dist/cjs/components/HorizontalScroll/HorizontalScrollArrow.js.map +1 -1
  52. package/dist/cjs/components/Input/Input.js +1 -0
  53. package/dist/cjs/components/Input/Input.js.map +1 -1
  54. package/dist/cjs/components/MiniInfoCell/MiniInfoCell.js +2 -2
  55. package/dist/cjs/components/MiniInfoCell/MiniInfoCell.js.map +1 -1
  56. package/dist/cjs/components/ModalCardBase/ModalCardBase.js +1 -0
  57. package/dist/cjs/components/ModalCardBase/ModalCardBase.js.map +1 -1
  58. package/dist/cjs/components/NativeSelect/NativeSelect.js +1 -0
  59. package/dist/cjs/components/NativeSelect/NativeSelect.js.map +1 -1
  60. package/dist/cjs/components/Panel/Panel.js +1 -0
  61. package/dist/cjs/components/Panel/Panel.js.map +1 -1
  62. package/dist/cjs/components/PanelHeader/PanelHeader.js +1 -0
  63. package/dist/cjs/components/PanelHeader/PanelHeader.js.map +1 -1
  64. package/dist/cjs/components/Popper/Popper.js +16 -22
  65. package/dist/cjs/components/Popper/Popper.js.map +1 -1
  66. package/dist/cjs/components/PopperArrow/PopperArrow.js +40 -0
  67. package/dist/cjs/components/PopperArrow/PopperArrow.js.map +1 -0
  68. package/dist/cjs/components/Radio/Radio.js +1 -0
  69. package/dist/cjs/components/Radio/Radio.js.map +1 -1
  70. package/dist/cjs/components/RangeSlider/UniversalSlider.js +1 -0
  71. package/dist/cjs/components/RangeSlider/UniversalSlider.js.map +1 -1
  72. package/dist/cjs/components/RichTooltip/RichTooltip.js +6 -15
  73. package/dist/cjs/components/RichTooltip/RichTooltip.js.map +1 -1
  74. package/dist/cjs/components/Select/Select.js +1 -0
  75. package/dist/cjs/components/Select/Select.js.map +1 -1
  76. package/dist/cjs/components/SelectMimicry/SelectMimicry.js +1 -0
  77. package/dist/cjs/components/SelectMimicry/SelectMimicry.js.map +1 -1
  78. package/dist/cjs/components/SimpleCell/SimpleCell.js +21 -31
  79. package/dist/cjs/components/SimpleCell/SimpleCell.js.map +1 -1
  80. package/dist/cjs/components/Snackbar/Snackbar.js +7 -11
  81. package/dist/cjs/components/Snackbar/Snackbar.js.map +1 -1
  82. package/dist/cjs/components/SplitCol/SplitCol.js +7 -1
  83. package/dist/cjs/components/SplitCol/SplitCol.js.map +1 -1
  84. package/dist/cjs/components/SplitLayout/SplitLayout.js +5 -8
  85. package/dist/cjs/components/SplitLayout/SplitLayout.js.map +1 -1
  86. package/dist/cjs/components/Tabbar/Tabbar.js +15 -14
  87. package/dist/cjs/components/Tabbar/Tabbar.js.map +1 -1
  88. package/dist/cjs/components/TabbarItem/TabbarItem.js +8 -10
  89. package/dist/cjs/components/TabbarItem/TabbarItem.js.map +1 -1
  90. package/dist/cjs/components/Tabs/Tabs.js +23 -5
  91. package/dist/cjs/components/Tabs/Tabs.js.map +1 -1
  92. package/dist/cjs/components/TabsItem/TabsItem.js +39 -22
  93. package/dist/cjs/components/TabsItem/TabsItem.js.map +1 -1
  94. package/dist/cjs/components/TextTooltip/TextTooltip.js +6 -9
  95. package/dist/cjs/components/TextTooltip/TextTooltip.js.map +1 -1
  96. package/dist/cjs/components/Textarea/Textarea.js +5 -4
  97. package/dist/cjs/components/Textarea/Textarea.js.map +1 -1
  98. package/dist/cjs/components/Tooltip/Tooltip.js +94 -71
  99. package/dist/cjs/components/Tooltip/Tooltip.js.map +1 -1
  100. package/dist/cjs/components/Typography/Headline/Headline.js +11 -2
  101. package/dist/cjs/components/Typography/Headline/Headline.js.map +1 -1
  102. package/dist/cjs/components/View/View.js +388 -453
  103. package/dist/cjs/components/View/View.js.map +1 -1
  104. package/dist/cjs/components/WriteBar/WriteBar.js +12 -5
  105. package/dist/cjs/components/WriteBar/WriteBar.js.map +1 -1
  106. package/dist/cjs/components/WriteBarIcon/WriteBarIcon.js +3 -8
  107. package/dist/cjs/components/WriteBarIcon/WriteBarIcon.js.map +1 -1
  108. package/dist/cjs/hooks/useOrientationChange.js +2 -1
  109. package/dist/cjs/hooks/useOrientationChange.js.map +1 -1
  110. package/dist/cjs/tokenized/index.js +104 -0
  111. package/dist/cjs/tokenized/index.js.map +1 -1
  112. package/dist/components/AppRoot/AppRoot.js +1 -0
  113. package/dist/components/AppRoot/AppRoot.js.map +1 -1
  114. package/dist/components/Button/Button.js +6 -4
  115. package/dist/components/Button/Button.js.map +1 -1
  116. package/dist/components/CardScroll/CardScroll.js +3 -1
  117. package/dist/components/CardScroll/CardScroll.js.map +1 -1
  118. package/dist/components/ChipsSelect/ChipsSelect.js +1 -0
  119. package/dist/components/ChipsSelect/ChipsSelect.js.map +1 -1
  120. package/dist/components/ConfigProvider/ConfigProviderContext.d.ts +1 -0
  121. package/dist/components/ConfigProvider/ConfigProviderContext.js +3 -0
  122. package/dist/components/ConfigProvider/ConfigProviderContext.js.map +1 -1
  123. package/dist/components/CustomSelect/CustomSelect.d.ts +1 -1
  124. package/dist/components/CustomSelect/CustomSelect.js +473 -580
  125. package/dist/components/CustomSelect/CustomSelect.js.map +1 -1
  126. package/dist/components/Dropdown/Dropdown.d.ts +46 -5
  127. package/dist/components/Dropdown/Dropdown.js +137 -27
  128. package/dist/components/Dropdown/Dropdown.js.map +1 -1
  129. package/dist/components/Epic/Epic.js +1 -4
  130. package/dist/components/Epic/Epic.js.map +1 -1
  131. package/dist/components/FocusTrap/FocusTrap.d.ts +1 -1
  132. package/dist/components/FocusTrap/FocusTrap.js +9 -9
  133. package/dist/components/FocusTrap/FocusTrap.js.map +1 -1
  134. package/dist/components/HorizontalCell/HorizontalCell.js +3 -5
  135. package/dist/components/HorizontalCell/HorizontalCell.js.map +1 -1
  136. package/dist/components/HorizontalScroll/HorizontalScroll.js +1 -0
  137. package/dist/components/HorizontalScroll/HorizontalScroll.js.map +1 -1
  138. package/dist/components/HorizontalScroll/HorizontalScrollArrow.js +2 -2
  139. package/dist/components/HorizontalScroll/HorizontalScrollArrow.js.map +1 -1
  140. package/dist/components/Input/Input.js +1 -0
  141. package/dist/components/Input/Input.js.map +1 -1
  142. package/dist/components/MiniInfoCell/MiniInfoCell.js +2 -2
  143. package/dist/components/MiniInfoCell/MiniInfoCell.js.map +1 -1
  144. package/dist/components/ModalCardBase/ModalCardBase.js +1 -0
  145. package/dist/components/ModalCardBase/ModalCardBase.js.map +1 -1
  146. package/dist/components/ModalRoot/ModalRoot.d.ts +1 -1
  147. package/dist/components/ModalRoot/ModalRootDesktop.d.ts +1 -1
  148. package/dist/components/NativeSelect/NativeSelect.js +1 -0
  149. package/dist/components/NativeSelect/NativeSelect.js.map +1 -1
  150. package/dist/components/Panel/Panel.js +1 -0
  151. package/dist/components/Panel/Panel.js.map +1 -1
  152. package/dist/components/PanelHeader/PanelHeader.js +1 -0
  153. package/dist/components/PanelHeader/PanelHeader.js.map +1 -1
  154. package/dist/components/Popper/Popper.d.ts +18 -1
  155. package/dist/components/Popper/Popper.js +15 -22
  156. package/dist/components/Popper/Popper.js.map +1 -1
  157. package/dist/components/PopperArrow/PopperArrow.d.ts +8 -0
  158. package/dist/components/PopperArrow/PopperArrow.js +27 -0
  159. package/dist/components/PopperArrow/PopperArrow.js.map +1 -0
  160. package/dist/components/Radio/Radio.js +1 -0
  161. package/dist/components/Radio/Radio.js.map +1 -1
  162. package/dist/components/RangeSlider/UniversalSlider.js +1 -0
  163. package/dist/components/RangeSlider/UniversalSlider.js.map +1 -1
  164. package/dist/components/RichTooltip/RichTooltip.d.ts +7 -2
  165. package/dist/components/RichTooltip/RichTooltip.js +5 -10
  166. package/dist/components/RichTooltip/RichTooltip.js.map +1 -1
  167. package/dist/components/Select/Select.js +1 -0
  168. package/dist/components/Select/Select.js.map +1 -1
  169. package/dist/components/SelectMimicry/SelectMimicry.js +1 -0
  170. package/dist/components/SelectMimicry/SelectMimicry.js.map +1 -1
  171. package/dist/components/SimpleCell/SimpleCell.js +19 -28
  172. package/dist/components/SimpleCell/SimpleCell.js.map +1 -1
  173. package/dist/components/Snackbar/Snackbar.d.ts +5 -1
  174. package/dist/components/Snackbar/Snackbar.js +8 -11
  175. package/dist/components/Snackbar/Snackbar.js.map +1 -1
  176. package/dist/components/SplitCol/SplitCol.d.ts +1 -0
  177. package/dist/components/SplitCol/SplitCol.js +3 -0
  178. package/dist/components/SplitCol/SplitCol.js.map +1 -1
  179. package/dist/components/SplitLayout/SplitLayout.js +4 -7
  180. package/dist/components/SplitLayout/SplitLayout.js.map +1 -1
  181. package/dist/components/Tabbar/Tabbar.d.ts +8 -1
  182. package/dist/components/Tabbar/Tabbar.js +15 -14
  183. package/dist/components/Tabbar/Tabbar.js.map +1 -1
  184. package/dist/components/TabbarItem/TabbarItem.js +7 -9
  185. package/dist/components/TabbarItem/TabbarItem.js.map +1 -1
  186. package/dist/components/Tabs/Tabs.d.ts +13 -2
  187. package/dist/components/Tabs/Tabs.js +23 -5
  188. package/dist/components/Tabs/Tabs.js.map +1 -1
  189. package/dist/components/TabsItem/TabsItem.d.ts +22 -1
  190. package/dist/components/TabsItem/TabsItem.js +40 -21
  191. package/dist/components/TabsItem/TabsItem.js.map +1 -1
  192. package/dist/components/TextTooltip/TextTooltip.d.ts +5 -1
  193. package/dist/components/TextTooltip/TextTooltip.js +5 -7
  194. package/dist/components/TextTooltip/TextTooltip.js.map +1 -1
  195. package/dist/components/Textarea/Textarea.d.ts +3 -0
  196. package/dist/components/Textarea/Textarea.js +5 -4
  197. package/dist/components/Textarea/Textarea.js.map +1 -1
  198. package/dist/components/Tooltip/Tooltip.d.ts +18 -1
  199. package/dist/components/Tooltip/Tooltip.js +89 -68
  200. package/dist/components/Tooltip/Tooltip.js.map +1 -1
  201. package/dist/components/Typography/Headline/Headline.d.ts +3 -3
  202. package/dist/components/Typography/Headline/Headline.js +10 -2
  203. package/dist/components/Typography/Headline/Headline.js.map +1 -1
  204. package/dist/components/View/View.d.ts +2 -18
  205. package/dist/components/View/View.js +384 -462
  206. package/dist/components/View/View.js.map +1 -1
  207. package/dist/components/View/ViewInfinite.d.ts +1 -1
  208. package/dist/components/WriteBar/WriteBar.d.ts +5 -1
  209. package/dist/components/WriteBar/WriteBar.js +10 -5
  210. package/dist/components/WriteBar/WriteBar.js.map +1 -1
  211. package/dist/components/WriteBarIcon/WriteBarIcon.js +3 -6
  212. package/dist/components/WriteBarIcon/WriteBarIcon.js.map +1 -1
  213. package/dist/components.css +143 -127
  214. package/dist/components.css.map +1 -1
  215. package/dist/cssm/components/ActionSheet/ActionSheet.css +1 -1
  216. package/dist/cssm/components/ActionSheetItem/ActionSheetItem.css +1 -1
  217. package/dist/cssm/components/Alert/Alert.css +1 -1
  218. package/dist/cssm/components/AppRoot/AppRoot.css +1 -1
  219. package/dist/cssm/components/AppRoot/AppRoot.js +1 -0
  220. package/dist/cssm/components/AppRoot/AppRoot.js.map +1 -1
  221. package/dist/cssm/components/Avatar/Avatar.css +3 -5
  222. package/dist/cssm/components/Badge/Badge.css +3 -3
  223. package/dist/cssm/components/Banner/Banner.css +5 -5
  224. package/dist/cssm/components/BaseGallery/BaseGallery.css +1 -1
  225. package/dist/cssm/components/Button/Button.css +53 -35
  226. package/dist/cssm/components/Button/Button.js +6 -4
  227. package/dist/cssm/components/Button/Button.js.map +1 -1
  228. package/dist/cssm/components/Calendar/Calendar.css +1 -1
  229. package/dist/cssm/components/CalendarDay/CalendarDay.css +1 -1
  230. package/dist/cssm/components/CalendarDays/CalendarDays.css +1 -1
  231. package/dist/cssm/components/CalendarHeader/CalendarHeader.css +1 -1
  232. package/dist/cssm/components/CalendarRange/CalendarRange.css +1 -1
  233. package/dist/cssm/components/CalendarTime/CalendarTime.css +1 -1
  234. package/dist/cssm/components/Card/Card.css +5 -6
  235. package/dist/cssm/components/CardGrid/CardGrid.css +1 -1
  236. package/dist/cssm/components/CardScroll/CardScroll.css +1 -1
  237. package/dist/cssm/components/CardScroll/CardScroll.js +3 -1
  238. package/dist/cssm/components/CardScroll/CardScroll.js.map +1 -1
  239. package/dist/cssm/components/Cell/Cell.css +3 -3
  240. package/dist/cssm/components/Cell/CellCheckbox/CellCheckbox.css +1 -1
  241. package/dist/cssm/components/Cell/CellDragger/CellDragger.css +1 -1
  242. package/dist/cssm/components/CellButton/CellButton.css +1 -1
  243. package/dist/cssm/components/Checkbox/Checkbox.css +1 -1
  244. package/dist/cssm/components/Chip/Chip.css +1 -1
  245. package/dist/cssm/components/ChipsInput/ChipsInput.css +1 -1
  246. package/dist/cssm/components/ChipsSelect/ChipsSelect.css +1 -1
  247. package/dist/cssm/components/ChipsSelect/ChipsSelect.js +1 -0
  248. package/dist/cssm/components/ChipsSelect/ChipsSelect.js.map +1 -1
  249. package/dist/cssm/components/ConfigProvider/ConfigProviderContext.d.ts +1 -0
  250. package/dist/cssm/components/ConfigProvider/ConfigProviderContext.js +3 -0
  251. package/dist/cssm/components/ConfigProvider/ConfigProviderContext.js.map +1 -1
  252. package/dist/cssm/components/ContentCard/ContentCard.css +1 -1
  253. package/dist/cssm/components/Counter/Counter.css +31 -31
  254. package/dist/cssm/components/CustomScrollView/CustomScrollView.css +1 -1
  255. package/dist/cssm/components/CustomSelect/CustomSelect.css +1 -1
  256. package/dist/cssm/components/CustomSelect/CustomSelect.d.ts +1 -1
  257. package/dist/cssm/components/CustomSelect/CustomSelect.js +473 -580
  258. package/dist/cssm/components/CustomSelect/CustomSelect.js.map +1 -1
  259. package/dist/cssm/components/CustomSelectDropdown/CustomSelectDropdown.css +3 -3
  260. package/dist/cssm/components/CustomSelectOption/CustomSelectOption.css +3 -3
  261. package/dist/cssm/components/DateInput/DateInput.css +1 -1
  262. package/dist/cssm/components/DatePicker/DatePicker.css +1 -1
  263. package/dist/cssm/components/DateRangeInput/DateRangeInput.css +1 -1
  264. package/dist/cssm/components/Dropdown/Dropdown.css +1 -1
  265. package/dist/cssm/components/Dropdown/Dropdown.d.ts +46 -5
  266. package/dist/cssm/components/Dropdown/Dropdown.js +137 -27
  267. package/dist/cssm/components/Dropdown/Dropdown.js.map +1 -1
  268. package/dist/cssm/components/Epic/Epic.css +1 -1
  269. package/dist/cssm/components/Epic/Epic.js +1 -4
  270. package/dist/cssm/components/Epic/Epic.js.map +1 -1
  271. package/dist/cssm/components/FixedLayout/FixedLayout.css +1 -1
  272. package/dist/cssm/components/FocusTrap/FocusTrap.d.ts +1 -1
  273. package/dist/cssm/components/FocusTrap/FocusTrap.js +9 -9
  274. package/dist/cssm/components/FocusTrap/FocusTrap.js.map +1 -1
  275. package/dist/cssm/components/FocusVisible/FocusVisible.css +1 -1
  276. package/dist/cssm/components/Footer/Footer.css +1 -1
  277. package/dist/cssm/components/FormField/FormField.css +9 -9
  278. package/dist/cssm/components/FormItem/FormItem.css +1 -1
  279. package/dist/cssm/components/FormLayout/FormLayout.css +1 -1
  280. package/dist/cssm/components/FormLayoutGroup/FormLayoutGroup.css +1 -1
  281. package/dist/cssm/components/FormStatus/FormStatus.css +1 -1
  282. package/dist/cssm/components/Gradient/Gradient.css +1 -1
  283. package/dist/cssm/components/GridAvatar/GridAvatar.css +1 -1
  284. package/dist/cssm/components/Group/Group.css +1 -1
  285. package/dist/cssm/components/Header/Header.css +1 -1
  286. package/dist/cssm/components/HorizontalCell/HorizontalCell.css +1 -1
  287. package/dist/cssm/components/HorizontalCell/HorizontalCell.js +3 -5
  288. package/dist/cssm/components/HorizontalCell/HorizontalCell.js.map +1 -1
  289. package/dist/cssm/components/HorizontalScroll/HorizontalScroll.css +1 -1
  290. package/dist/cssm/components/HorizontalScroll/HorizontalScroll.js +1 -0
  291. package/dist/cssm/components/HorizontalScroll/HorizontalScroll.js.map +1 -1
  292. package/dist/cssm/components/HorizontalScroll/HorizontalScrollArrow.css +3 -3
  293. package/dist/cssm/components/HorizontalScroll/HorizontalScrollArrow.js +2 -2
  294. package/dist/cssm/components/HorizontalScroll/HorizontalScrollArrow.js.map +1 -1
  295. package/dist/cssm/components/IconButton/IconButton.css +1 -1
  296. package/dist/cssm/components/InfoRow/InfoRow.css +1 -1
  297. package/dist/cssm/components/InitialsAvatar/InitialsAvatar.css +1 -1
  298. package/dist/cssm/components/Input/Input.css +1 -1
  299. package/dist/cssm/components/Input/Input.js +1 -0
  300. package/dist/cssm/components/Input/Input.js.map +1 -1
  301. package/dist/cssm/components/InputLike/InputLike.css +1 -1
  302. package/dist/cssm/components/InputLike/InputLikeDivider.css +1 -1
  303. package/dist/cssm/components/Link/Link.css +1 -1
  304. package/dist/cssm/components/MiniInfoCell/MiniInfoCell.css +1 -1
  305. package/dist/cssm/components/MiniInfoCell/MiniInfoCell.js +2 -2
  306. package/dist/cssm/components/MiniInfoCell/MiniInfoCell.js.map +1 -1
  307. package/dist/cssm/components/ModalCard/ModalCard.css +1 -1
  308. package/dist/cssm/components/ModalCardBase/ModalCardBase.css +3 -3
  309. package/dist/cssm/components/ModalCardBase/ModalCardBase.js +1 -0
  310. package/dist/cssm/components/ModalCardBase/ModalCardBase.js.map +1 -1
  311. package/dist/cssm/components/ModalDismissButton/ModalDismissButton.css +1 -1
  312. package/dist/cssm/components/ModalPage/ModalPage.css +1 -1
  313. package/dist/cssm/components/ModalPageHeader/ModalPageHeader.css +1 -1
  314. package/dist/cssm/components/ModalRoot/ModalRoot.css +1 -1
  315. package/dist/cssm/components/ModalRoot/ModalRoot.d.ts +1 -1
  316. package/dist/cssm/components/ModalRoot/ModalRootDesktop.d.ts +1 -1
  317. package/dist/cssm/components/NativeSelect/NativeSelect.js +1 -0
  318. package/dist/cssm/components/NativeSelect/NativeSelect.js.map +1 -1
  319. package/dist/cssm/components/Pagination/Pagination.css +1 -1
  320. package/dist/cssm/components/Panel/Panel.css +1 -1
  321. package/dist/cssm/components/Panel/Panel.js +1 -0
  322. package/dist/cssm/components/Panel/Panel.js.map +1 -1
  323. package/dist/cssm/components/PanelHeader/PanelHeader.css +1 -1
  324. package/dist/cssm/components/PanelHeader/PanelHeader.js +1 -0
  325. package/dist/cssm/components/PanelHeader/PanelHeader.js.map +1 -1
  326. package/dist/cssm/components/PanelHeaderButton/PanelHeaderButton.css +1 -1
  327. package/dist/cssm/components/PanelHeaderContent/PanelHeaderContent.css +1 -1
  328. package/dist/cssm/components/PanelHeaderContext/PanelHeaderContext.css +1 -1
  329. package/dist/cssm/components/Placeholder/Placeholder.css +3 -3
  330. package/dist/cssm/components/PopoutRoot/PopoutRoot.css +1 -1
  331. package/dist/cssm/components/PopoutWrapper/PopoutWrapper.css +1 -1
  332. package/dist/cssm/components/Popper/Popper.css +1 -1
  333. package/dist/cssm/components/Popper/Popper.d.ts +18 -1
  334. package/dist/cssm/components/Popper/Popper.js +15 -22
  335. package/dist/cssm/components/Popper/Popper.js.map +1 -1
  336. package/dist/cssm/components/PopperArrow/PopperArrow.css +1 -0
  337. package/dist/cssm/components/PopperArrow/PopperArrow.d.ts +8 -0
  338. package/dist/cssm/components/PopperArrow/PopperArrow.js +28 -0
  339. package/dist/cssm/components/PopperArrow/PopperArrow.js.map +1 -0
  340. package/dist/cssm/components/Progress/Progress.css +1 -1
  341. package/dist/cssm/components/PromoBanner/PromoBanner.css +1 -1
  342. package/dist/cssm/components/PullToRefresh/PullToRefresh.css +3 -3
  343. package/dist/cssm/components/Radio/Radio.css +1 -1
  344. package/dist/cssm/components/Radio/Radio.js +1 -0
  345. package/dist/cssm/components/Radio/Radio.js.map +1 -1
  346. package/dist/cssm/components/RadioGroup/RadioGroup.css +1 -1
  347. package/dist/cssm/components/RangeSlider/UniversalSlider.js +1 -0
  348. package/dist/cssm/components/RangeSlider/UniversalSlider.js.map +1 -1
  349. package/dist/cssm/components/Removable/Removable.css +1 -1
  350. package/dist/cssm/components/RichCell/RichCell.css +3 -3
  351. package/dist/cssm/components/RichTooltip/RichTooltip.css +3 -1
  352. package/dist/cssm/components/RichTooltip/RichTooltip.d.ts +7 -2
  353. package/dist/cssm/components/RichTooltip/RichTooltip.js +5 -10
  354. package/dist/cssm/components/RichTooltip/RichTooltip.js.map +1 -1
  355. package/dist/cssm/components/Root/Root.css +1 -1
  356. package/dist/cssm/components/ScreenSpinner/ScreenSpinner.css +1 -1
  357. package/dist/cssm/components/Search/Search.css +1 -1
  358. package/dist/cssm/components/SegmentedControl/SegmentedControl.css +1 -1
  359. package/dist/cssm/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.css +1 -1
  360. package/dist/cssm/components/Select/Select.css +1 -1
  361. package/dist/cssm/components/Select/Select.js +1 -0
  362. package/dist/cssm/components/Select/Select.js.map +1 -1
  363. package/dist/cssm/components/SelectMimicry/SelectMimicry.js +1 -0
  364. package/dist/cssm/components/SelectMimicry/SelectMimicry.js.map +1 -1
  365. package/dist/cssm/components/Separator/Separator.css +1 -1
  366. package/dist/cssm/components/SimpleCell/SimpleCell.css +1 -1
  367. package/dist/cssm/components/SimpleCell/SimpleCell.js +19 -28
  368. package/dist/cssm/components/SimpleCell/SimpleCell.js.map +1 -1
  369. package/dist/cssm/components/SimpleCheckbox/SimpleCheckbox.css +1 -1
  370. package/dist/cssm/components/Slider/Slider.css +3 -3
  371. package/dist/cssm/components/SliderSwitch/SliderSwitch.css +1 -1
  372. package/dist/cssm/components/Snackbar/Snackbar.css +1 -1
  373. package/dist/cssm/components/Snackbar/Snackbar.d.ts +5 -1
  374. package/dist/cssm/components/Snackbar/Snackbar.js +8 -11
  375. package/dist/cssm/components/Snackbar/Snackbar.js.map +1 -1
  376. package/dist/cssm/components/Spacing/Spacing.css +1 -1
  377. package/dist/cssm/components/Spinner/Spinner.css +1 -1
  378. package/dist/cssm/components/SplitCol/SplitCol.css +1 -1
  379. package/dist/cssm/components/SplitCol/SplitCol.d.ts +1 -0
  380. package/dist/cssm/components/SplitCol/SplitCol.js +3 -0
  381. package/dist/cssm/components/SplitCol/SplitCol.js.map +1 -1
  382. package/dist/cssm/components/SplitLayout/SplitLayout.css +1 -1
  383. package/dist/cssm/components/SplitLayout/SplitLayout.js +4 -7
  384. package/dist/cssm/components/SplitLayout/SplitLayout.js.map +1 -1
  385. package/dist/cssm/components/SubnavigationBar/SubnavigationBar.css +1 -1
  386. package/dist/cssm/components/SubnavigationButton/SubnavigationButton.css +1 -1
  387. package/dist/cssm/components/Switch/Switch.css +3 -3
  388. package/dist/cssm/components/Tabbar/Tabbar.css +5 -3
  389. package/dist/cssm/components/Tabbar/Tabbar.d.ts +8 -1
  390. package/dist/cssm/components/Tabbar/Tabbar.js +15 -14
  391. package/dist/cssm/components/Tabbar/Tabbar.js.map +1 -1
  392. package/dist/cssm/components/TabbarItem/TabbarItem.css +1 -1
  393. package/dist/cssm/components/TabbarItem/TabbarItem.js +7 -9
  394. package/dist/cssm/components/TabbarItem/TabbarItem.js.map +1 -1
  395. package/dist/cssm/components/Tabs/Tabs.css +1 -1
  396. package/dist/cssm/components/Tabs/Tabs.d.ts +13 -2
  397. package/dist/cssm/components/Tabs/Tabs.js +23 -5
  398. package/dist/cssm/components/Tabs/Tabs.js.map +1 -1
  399. package/dist/cssm/components/TabsItem/TabsItem.css +5 -1
  400. package/dist/cssm/components/TabsItem/TabsItem.d.ts +22 -1
  401. package/dist/cssm/components/TabsItem/TabsItem.js +40 -21
  402. package/dist/cssm/components/TabsItem/TabsItem.js.map +1 -1
  403. package/dist/cssm/components/Tappable/Tappable.css +5 -5
  404. package/dist/cssm/components/TextTooltip/TextTooltip.css +1 -1
  405. package/dist/cssm/components/TextTooltip/TextTooltip.d.ts +5 -1
  406. package/dist/cssm/components/TextTooltip/TextTooltip.js +5 -7
  407. package/dist/cssm/components/TextTooltip/TextTooltip.js.map +1 -1
  408. package/dist/cssm/components/Textarea/Textarea.css +1 -1
  409. package/dist/cssm/components/Textarea/Textarea.d.ts +3 -0
  410. package/dist/cssm/components/Textarea/Textarea.js +5 -4
  411. package/dist/cssm/components/Textarea/Textarea.js.map +1 -1
  412. package/dist/cssm/components/Tooltip/Tooltip.css +1 -1
  413. package/dist/cssm/components/Tooltip/Tooltip.d.ts +18 -1
  414. package/dist/cssm/components/Tooltip/Tooltip.js +89 -68
  415. package/dist/cssm/components/Tooltip/Tooltip.js.map +1 -1
  416. package/dist/cssm/components/Typography/Caption/Caption.css +1 -1
  417. package/dist/cssm/components/Typography/Footnote/Footnote.css +1 -1
  418. package/dist/cssm/components/Typography/Headline/Headline.css +1 -1
  419. package/dist/cssm/components/Typography/Headline/Headline.d.ts +3 -3
  420. package/dist/cssm/components/Typography/Headline/Headline.js +10 -2
  421. package/dist/cssm/components/Typography/Headline/Headline.js.map +1 -1
  422. package/dist/cssm/components/Typography/Paragraph/Paragraph.css +1 -1
  423. package/dist/cssm/components/Typography/Subhead/Subhead.css +1 -1
  424. package/dist/cssm/components/Typography/Text/Text.css +1 -1
  425. package/dist/cssm/components/Typography/Title/Title.css +1 -1
  426. package/dist/cssm/components/UsersStack/UsersStack.css +5 -5
  427. package/dist/cssm/components/View/View.css +1 -1
  428. package/dist/cssm/components/View/View.d.ts +2 -18
  429. package/dist/cssm/components/View/View.js +384 -462
  430. package/dist/cssm/components/View/View.js.map +1 -1
  431. package/dist/cssm/components/View/ViewIOS.css +1 -1
  432. package/dist/cssm/components/View/ViewInfinite.d.ts +1 -1
  433. package/dist/cssm/components/VisuallyHiddenInput/VisuallyHiddenInput.css +1 -1
  434. package/dist/cssm/components/WriteBar/WriteBar.css +3 -1
  435. package/dist/cssm/components/WriteBar/WriteBar.d.ts +5 -1
  436. package/dist/cssm/components/WriteBar/WriteBar.js +10 -5
  437. package/dist/cssm/components/WriteBar/WriteBar.js.map +1 -1
  438. package/dist/cssm/components/WriteBarIcon/WriteBarIcon.css +1 -1
  439. package/dist/cssm/components/WriteBarIcon/WriteBarIcon.js +3 -6
  440. package/dist/cssm/components/WriteBarIcon/WriteBarIcon.js.map +1 -1
  441. package/dist/cssm/fonts/fonts.css +1 -1
  442. package/dist/cssm/hooks/useOrientationChange.js +2 -1
  443. package/dist/cssm/hooks/useOrientationChange.js.map +1 -1
  444. package/dist/cssm/lib/calendar.d.ts +2 -2
  445. package/dist/cssm/styles/animations.css +1 -1
  446. package/dist/cssm/styles/bright_light.css +1 -1
  447. package/dist/cssm/styles/common.css +1 -1
  448. package/dist/cssm/styles/components.css +143 -127
  449. package/dist/cssm/styles/constants.css +3 -10
  450. package/dist/cssm/styles/space_gray.css +1 -1
  451. package/dist/cssm/styles/themes.css +1 -16
  452. package/dist/cssm/styles/unstable.css +3 -1
  453. package/dist/cssm/styles/vkcom_dark.css +1 -6
  454. package/dist/cssm/styles/vkcom_light.css +1 -11
  455. package/dist/cssm/tokenized/index.d.ts +26 -0
  456. package/dist/cssm/tokenized/index.js +13 -0
  457. package/dist/cssm/tokenized/index.js.map +1 -1
  458. package/dist/default_scheme.css +1 -1
  459. package/dist/default_scheme.css.map +1 -1
  460. package/dist/fonts.css +1 -1
  461. package/dist/fonts.css.map +1 -1
  462. package/dist/hooks/useOrientationChange.js +2 -1
  463. package/dist/hooks/useOrientationChange.js.map +1 -1
  464. package/dist/lib/calendar.d.ts +2 -2
  465. package/dist/tokenized/index.d.ts +26 -0
  466. package/dist/tokenized/index.js +13 -0
  467. package/dist/tokenized/index.js.map +1 -1
  468. package/dist/unstable.css +3 -1
  469. package/dist/unstable.css.map +1 -1
  470. package/dist/vkui.css +144 -143
  471. package/dist/vkui.css.map +1 -1
  472. package/package.json +6 -5
  473. package/src/components/AppRoot/AppRoot.tsx +2 -0
  474. package/src/components/Badge/Badge.css +0 -5
  475. package/src/components/Button/Button.css +0 -4
  476. package/src/components/Button/Button.tsx +4 -2
  477. package/src/components/Button/Readme.md +30 -59
  478. package/src/components/CardScroll/CardScroll.tsx +1 -1
  479. package/src/components/Cell/Cell.css +3 -2
  480. package/src/components/ChipsInput/ChipsInput.css +2 -0
  481. package/src/components/ChipsSelect/ChipsSelect.tsx +2 -0
  482. package/src/components/ConfigProvider/ConfigProviderContext.tsx +2 -0
  483. package/src/components/Counter/Counter.css +30 -0
  484. package/src/components/CustomScrollView/CustomScrollView.css +10 -5
  485. package/src/components/CustomSelect/CustomSelect.tsx +543 -574
  486. package/src/components/Dropdown/Dropdown.css +12 -0
  487. package/src/components/Dropdown/Dropdown.tsx +174 -20
  488. package/src/components/Dropdown/Readme.md +1 -0
  489. package/src/components/Epic/Epic.tsx +1 -4
  490. package/src/components/FixedLayout/Readme.md +103 -109
  491. package/src/components/FocusTrap/FocusTrap.tsx +10 -10
  492. package/src/components/Group/Group.css +1 -1
  493. package/src/components/Group/Readme.md +1 -1
  494. package/src/components/HorizontalCell/HorizontalCell.css +25 -43
  495. package/src/components/HorizontalCell/HorizontalCell.tsx +3 -9
  496. package/src/components/HorizontalScroll/HorizontalScroll.css +23 -0
  497. package/src/components/HorizontalScroll/HorizontalScroll.tsx +2 -0
  498. package/src/components/HorizontalScroll/HorizontalScrollArrow.tsx +2 -2
  499. package/src/components/Input/Input.css +2 -0
  500. package/src/components/Input/Input.tsx +2 -0
  501. package/src/components/MiniInfoCell/MiniInfoCell.css +13 -3
  502. package/src/components/MiniInfoCell/MiniInfoCell.tsx +3 -3
  503. package/src/components/ModalCardBase/ModalCardBase.tsx +2 -0
  504. package/src/components/NativeSelect/NativeSelect.tsx +2 -0
  505. package/src/components/Panel/Panel.tsx +2 -0
  506. package/src/components/PanelHeader/PanelHeader.tsx +2 -0
  507. package/src/components/Popper/Popper.css +0 -35
  508. package/src/components/Popper/Popper.tsx +33 -25
  509. package/src/components/PopperArrow/PopperArrow.css +34 -0
  510. package/src/components/PopperArrow/PopperArrow.tsx +40 -0
  511. package/src/components/Radio/Radio.tsx +2 -0
  512. package/src/components/RangeSlider/UniversalSlider.tsx +2 -0
  513. package/src/components/RichTooltip/RichTooltip.css +44 -4
  514. package/src/components/RichTooltip/RichTooltip.tsx +9 -11
  515. package/src/components/Select/Select.tsx +2 -0
  516. package/src/components/SelectMimicry/SelectMimicry.tsx +2 -0
  517. package/src/components/SimpleCell/Readme.md +115 -129
  518. package/src/components/SimpleCell/SimpleCell.css +30 -68
  519. package/src/components/SimpleCell/SimpleCell.tsx +23 -25
  520. package/src/components/Snackbar/Readme.md +95 -123
  521. package/src/components/Snackbar/Snackbar.css +18 -27
  522. package/src/components/Snackbar/Snackbar.tsx +17 -11
  523. package/src/components/SplitCol/SplitCol.tsx +2 -0
  524. package/src/components/SplitLayout/SplitLayout.css +3 -7
  525. package/src/components/SplitLayout/SplitLayout.tsx +9 -6
  526. package/src/components/Switch/Switch.css +6 -2
  527. package/src/components/Tabbar/Tabbar.css +4 -1
  528. package/src/components/Tabbar/Tabbar.tsx +23 -12
  529. package/src/components/TabbarItem/TabbarItem.css +7 -5
  530. package/src/components/TabbarItem/TabbarItem.tsx +13 -7
  531. package/src/components/Tabs/Readme.md +191 -251
  532. package/src/components/Tabs/Tabs.css +27 -80
  533. package/src/components/Tabs/Tabs.tsx +45 -7
  534. package/src/components/TabsItem/Readme.md +1 -0
  535. package/src/components/TabsItem/TabsItem.css +191 -106
  536. package/src/components/TabsItem/TabsItem.tsx +72 -20
  537. package/src/components/TextTooltip/TextTooltip.css +41 -11
  538. package/src/components/TextTooltip/TextTooltip.tsx +9 -13
  539. package/src/components/Textarea/Textarea.css +2 -0
  540. package/src/components/Textarea/Textarea.tsx +5 -4
  541. package/src/components/Tooltip/Readme.md +128 -101
  542. package/src/components/Tooltip/Tooltip.css +29 -40
  543. package/src/components/Tooltip/Tooltip.tsx +98 -66
  544. package/src/components/Typography/Headline/Headline.tsx +15 -1
  545. package/src/components/View/Readme.md +2 -0
  546. package/src/components/View/View.tsx +451 -514
  547. package/src/components/WriteBar/WriteBar.css +27 -33
  548. package/src/components/WriteBar/WriteBar.tsx +16 -5
  549. package/src/components/WriteBarIcon/WriteBarIcon.css +6 -19
  550. package/src/components/WriteBarIcon/WriteBarIcon.tsx +6 -6
  551. package/src/hooks/useOrientationChange.ts +1 -0
  552. package/src/styles/components.css +1 -0
  553. package/src/styles/constants.css +8 -0
  554. package/src/tokenized/index.ts +39 -0
  555. package/tsconfig.json +1 -1
  556. package/.cache/ts/src/components/ClickPopper/ClickPopper.d.ts +0 -21
  557. package/dist/cjs/components/ClickPopper/ClickPopper.js +0 -96
  558. package/dist/cjs/components/ClickPopper/ClickPopper.js.map +0 -1
  559. package/dist/components/ClickPopper/ClickPopper.d.ts +0 -21
  560. package/dist/components/ClickPopper/ClickPopper.js +0 -71
  561. package/dist/components/ClickPopper/ClickPopper.js.map +0 -1
  562. package/dist/cssm/components/ClickPopper/ClickPopper.d.ts +0 -21
  563. package/dist/cssm/components/ClickPopper/ClickPopper.js +0 -71
  564. package/dist/cssm/components/ClickPopper/ClickPopper.js.map +0 -1
  565. package/src/components/ClickPopper/ClickPopper.tsx +0 -86
@@ -1,14 +1,13 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
- var _excluded = ["children", "text", "header"];
3
+ var _excluded = ["children", "text", "header", "appearance"];
4
4
  import { createScopedElement } from "../../lib/jsxRuntime";
5
5
  import * as React from "react";
6
6
  import { HoverPopper } from "../HoverPopper/HoverPopper";
7
- import { getClassName } from "../../helpers/getClassName";
8
- import { usePlatform } from "../../hooks/usePlatform";
9
7
  import { hasReactNode } from "../../lib/utils";
10
8
  import { Subhead } from "../Typography/Subhead/Subhead";
11
9
  import { prefixClass } from "../../lib/prefixClass";
10
+ import { classNames } from "../../lib/classNames";
12
11
  import "./TextTooltip.css";
13
12
 
14
13
  /**
@@ -18,19 +17,18 @@ export var TextTooltip = function TextTooltip(_ref) {
18
17
  var children = _ref.children,
19
18
  text = _ref.text,
20
19
  header = _ref.header,
20
+ _ref$appearance = _ref.appearance,
21
+ appearance = _ref$appearance === void 0 ? "black" : _ref$appearance,
21
22
  popperProps = _objectWithoutProperties(_ref, _excluded);
22
23
 
23
- var platform = usePlatform();
24
24
  return createScopedElement(HoverPopper, _extends({
25
- vkuiClass: getClassName("TextTooltip", platform),
25
+ vkuiClass: classNames("TextTooltip", "TextTooltip--".concat(appearance)),
26
26
  arrow: true,
27
27
  arrowClassName: prefixClass("TextTooltip__arrow"),
28
28
  content: createScopedElement(React.Fragment, null, hasReactNode(header) && createScopedElement(Subhead, {
29
- Component: "span",
30
29
  weight: "2",
31
30
  vkuiClass: "TextTooltip__header"
32
31
  }, header), hasReactNode(text) && createScopedElement(Subhead, {
33
- Component: "span",
34
32
  vkuiClass: "TextTooltip__text"
35
33
  }, text))
36
34
  }, popperProps), children);
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/TextTooltip/TextTooltip.tsx"],"names":["React","HoverPopper","getClassName","usePlatform","hasReactNode","Subhead","prefixClass","TextTooltip","children","text","header","popperProps","platform"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,SAASC,OAAT;AACA,SAASC,WAAT;AACA;;AAcA;AACA;AACA;AACA,OAAO,IAAMC,WAAW,GAAG,SAAdA,WAAc,OAKH;AAAA,MAJtBC,QAIsB,QAJtBA,QAIsB;AAAA,MAHtBC,IAGsB,QAHtBA,IAGsB;AAAA,MAFtBC,MAEsB,QAFtBA,MAEsB;AAAA,MADnBC,WACmB;;AACtB,MAAMC,QAAQ,GAAGT,WAAW,EAA5B;AAEA,SACE,oBAAC,WAAD;AACE,IAAA,SAAS,EAAED,YAAY,CAAC,aAAD,EAAgBU,QAAhB,CADzB;AAEE,IAAA,KAAK,MAFP;AAGE,IAAA,cAAc,EAAEN,WAAW,CAAC,oBAAD,CAH7B;AAIE,IAAA,OAAO,EACL,oBAAC,KAAD,CAAO,QAAP,QACGF,YAAY,CAACM,MAAD,CAAZ,IACC,oBAAC,OAAD;AACE,MAAA,SAAS,EAAC,MADZ;AAEE,MAAA,MAAM,EAAC,GAFT;AAGE,MAAA,SAAS,EAAC;AAHZ,OAKGA,MALH,CAFJ,EAUGN,YAAY,CAACK,IAAD,CAAZ,IACC,oBAAC,OAAD;AAAS,MAAA,SAAS,EAAC,MAAnB;AAA0B,MAAA,SAAS,EAAC;AAApC,OACGA,IADH,CAXJ;AALJ,KAsBME,WAtBN,GAwBGH,QAxBH,CADF;AA4BD,CApCM","sourcesContent":["import * as React from \"react\";\nimport { HoverPopper, HoverPopperProps } from \"../HoverPopper/HoverPopper\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport { Subhead } from \"../Typography/Subhead/Subhead\";\nimport { prefixClass } from \"../../lib/prefixClass\";\nimport \"./TextTooltip.css\";\n\nexport interface TextTooltipProps\n extends Omit<HoverPopperProps, \"arrow\" | \"arrowClassName\" | \"content\"> {\n /**\n * Текст тултипа\n */\n text?: React.ReactNode;\n /**\n * Заголовок тултипа\n */\n header?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/TextTooltip\n */\nexport const TextTooltip = ({\n children,\n text,\n header,\n ...popperProps\n}: TextTooltipProps) => {\n const platform = usePlatform();\n\n return (\n <HoverPopper\n vkuiClass={getClassName(\"TextTooltip\", platform)}\n arrow\n arrowClassName={prefixClass(\"TextTooltip__arrow\")}\n content={\n <React.Fragment>\n {hasReactNode(header) && (\n <Subhead\n Component=\"span\"\n weight=\"2\"\n vkuiClass=\"TextTooltip__header\"\n >\n {header}\n </Subhead>\n )}\n {hasReactNode(text) && (\n <Subhead Component=\"span\" vkuiClass=\"TextTooltip__text\">\n {text}\n </Subhead>\n )}\n </React.Fragment>\n }\n {...popperProps}\n >\n {children}\n </HoverPopper>\n );\n};\n"],"file":"TextTooltip.js"}
1
+ {"version":3,"sources":["../../../../src/components/TextTooltip/TextTooltip.tsx"],"names":["React","HoverPopper","hasReactNode","Subhead","prefixClass","classNames","TextTooltip","children","text","header","appearance","popperProps"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,SAASC,OAAT;AACA,SAASC,WAAT;AACA,SAASC,UAAT;AACA;;AAkBA;AACA;AACA;AACA,OAAO,IAAMC,WAAW,GAAG,SAAdA,WAAc,OAMH;AAAA,MALtBC,QAKsB,QALtBA,QAKsB;AAAA,MAJtBC,IAIsB,QAJtBA,IAIsB;AAAA,MAHtBC,MAGsB,QAHtBA,MAGsB;AAAA,6BAFtBC,UAEsB;AAAA,MAFtBA,UAEsB,gCAFT,OAES;AAAA,MADnBC,WACmB;;AACtB,SACE,oBAAC,WAAD;AACE,IAAA,SAAS,EAAEN,UAAU,CAAC,aAAD,yBAAgCK,UAAhC,EADvB;AAEE,IAAA,KAAK,MAFP;AAGE,IAAA,cAAc,EAAEN,WAAW,CAAC,oBAAD,CAH7B;AAIE,IAAA,OAAO,EACL,oBAAC,KAAD,CAAO,QAAP,QACGF,YAAY,CAACO,MAAD,CAAZ,IACC,oBAAC,OAAD;AAAS,MAAA,MAAM,EAAC,GAAhB;AAAoB,MAAA,SAAS,EAAC;AAA9B,OACGA,MADH,CAFJ,EAMGP,YAAY,CAACM,IAAD,CAAZ,IACC,oBAAC,OAAD;AAAS,MAAA,SAAS,EAAC;AAAnB,OAAwCA,IAAxC,CAPJ;AALJ,KAgBMG,WAhBN,GAkBGJ,QAlBH,CADF;AAsBD,CA7BM","sourcesContent":["import * as React from \"react\";\nimport { HoverPopper, HoverPopperProps } from \"../HoverPopper/HoverPopper\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport { Subhead } from \"../Typography/Subhead/Subhead\";\nimport { prefixClass } from \"../../lib/prefixClass\";\nimport { classNames } from \"../../lib/classNames\";\nimport \"./TextTooltip.css\";\n\nexport interface TextTooltipProps\n extends Omit<HoverPopperProps, \"arrow\" | \"arrowClassName\" | \"content\"> {\n /**\n * Текст тултипа\n */\n text?: React.ReactNode;\n /**\n * Заголовок тултипа\n */\n header?: React.ReactNode;\n /**\n * Стиль отображения подсказки\n */\n appearance?: \"accent\" | \"neutral\" | \"white\" | \"black\" | \"inversion\";\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/TextTooltip\n */\nexport const TextTooltip = ({\n children,\n text,\n header,\n appearance = \"black\", // TODO v5 сменить по умолчанию на \"neutral\"\n ...popperProps\n}: TextTooltipProps) => {\n return (\n <HoverPopper\n vkuiClass={classNames(\"TextTooltip\", `TextTooltip--${appearance}`)}\n arrow\n arrowClassName={prefixClass(\"TextTooltip__arrow\")}\n content={\n <React.Fragment>\n {hasReactNode(header) && (\n <Subhead weight=\"2\" vkuiClass=\"TextTooltip__header\">\n {header}\n </Subhead>\n )}\n {hasReactNode(text) && (\n <Subhead vkuiClass=\"TextTooltip__text\">{text}</Subhead>\n )}\n </React.Fragment>\n }\n {...popperProps}\n >\n {children}\n </HoverPopper>\n );\n};\n"],"file":"TextTooltip.js"}
@@ -1 +1 @@
1
- .vkuiTextarea{position:relative}.vkuiTextarea__el{margin:0;width:100%;display:block;box-sizing:border-box;resize:none;-webkit-appearance:none;appearance:none;font-weight:400;font-weight:var(--vkui--font_text--font_weight--regular,400);font-size:16px;font-size:var(--vkui--font_text--font_size--regular,16px);line-height:20px;line-height:var(--vkui--font_text--line_height--regular,20px);color:#000;color:var(--text_primary, var(--vkui--color_text_primary));padding:12px;max-height:204px;border:0;z-index:2;position:relative;background:0 0}.vkuiTextarea__el[cols]{width:initial}.vkuiTextarea--sizeY-compact .vkuiTextarea__el{font-size:15px;font-size:var(--vkui--font_text--font_size--compact,15px);line-height:20px;line-height:var(--vkui--font_text--line_height--compact,20px);max-height:196px}.vkuiTextarea__el::-webkit-input-placeholder{color:#818c99;color:var(--field_text_placeholder, var(--vkui--color_text_secondary))}.vkuiTextarea__el::placeholder{color:#818c99;color:var(--field_text_placeholder, var(--vkui--color_text_secondary))}.vkuiTextarea__el:disabled{opacity:.64;opacity:var(--vkui--opacity_disable_accessibility,0.64)}.vkuiTextarea__el:disabled::-webkit-input-placeholder{color:#818c99;color:var(--text_secondary, var(--vkui--color_text_secondary))}.vkuiTextarea__el:disabled::placeholder{color:#818c99;color:var(--text_secondary, var(--vkui--color_text_secondary))}
1
+ .vkuiTextarea{position:relative}.vkuiTextarea__el{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:none;box-sizing:border-box;color:#000;color:var(--text_primary,var(--vkui--color_text_primary));display:block;font-size:16px;font-size:var(--vkui--font_text--font_size--regular,16px);font-weight:400;font-weight:var(--vkui--font_text--font_weight--regular,400);line-height:20px;line-height:var(--vkui--font_text--line_height--regular,20px);margin:0;max-height:204px;padding:12px;position:relative;resize:none;width:100%;z-index:2}.vkuiTextarea__el[cols]{width:auto}.vkuiTextarea--sizeY-compact .vkuiTextarea__el{font-size:15px;font-size:var(--vkui--font_text--font_size--compact,15px);line-height:20px;line-height:var(--vkui--font_text--line_height--compact,20px);max-height:196px}.vkuiTextarea__el::-webkit-input-placeholder{color:#818c99;color:var(--field_text_placeholder,var(--vkui--color_text_secondary));opacity:1}.vkuiTextarea__el::-moz-placeholder{color:#818c99;color:var(--field_text_placeholder,var(--vkui--color_text_secondary));opacity:1}.vkuiTextarea__el::-ms-input-placeholder{color:#818c99;color:var(--field_text_placeholder,var(--vkui--color_text_secondary));opacity:1}.vkuiTextarea__el::placeholder{color:#818c99;color:var(--field_text_placeholder,var(--vkui--color_text_secondary));opacity:1}.vkuiTextarea__el:disabled{opacity:.64;opacity:var(--vkui--opacity_disable_accessibility,.64)}.vkuiTextarea__el:disabled::-webkit-input-placeholder{color:#818c99;color:var(--text_secondary,var(--vkui--color_text_secondary))}.vkuiTextarea__el:disabled::-moz-placeholder{color:#818c99;color:var(--text_secondary,var(--vkui--color_text_secondary))}.vkuiTextarea__el:disabled::-ms-input-placeholder{color:#818c99;color:var(--text_secondary,var(--vkui--color_text_secondary))}.vkuiTextarea__el:disabled::placeholder{color:#818c99;color:var(--text_secondary,var(--vkui--color_text_secondary))}
@@ -7,4 +7,7 @@ export interface TextareaProps extends React.TextareaHTMLAttributes<HTMLTextArea
7
7
  onResize?(el: HTMLTextAreaElement): void;
8
8
  defaultValue?: string;
9
9
  }
10
+ /**
11
+ * @see https://vkcom.github.io/VKUI/#/Textarea
12
+ */
10
13
  export declare const Textarea: React.FC<Pick<TextareaProps, "required" | "disabled" | "hidden" | "dir" | "form" | "slot" | "style" | "title" | "color" | "wrap" | "maxHeight" | "translate" | "prefix" | "children" | "className" | "id" | "lang" | "name" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "value" | "autoFocus" | "autoComplete" | "maxLength" | "minLength" | "readOnly" | "cols" | "dirName" | "rows" | "getRootRef" | "getRef" | "grow" | "onResize"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;
@@ -11,9 +11,6 @@ import { useEnsuredControl } from "../../hooks/useEnsuredControl";
11
11
  import { useExternRef } from "../../hooks/useExternRef";
12
12
  import "./Textarea.css";
13
13
 
14
- /**
15
- * @see https://vkcom.github.io/VKUI/#/Textarea
16
- */
17
14
  var TextareaComponent = function TextareaComponent(_ref) {
18
15
  var _ref$defaultValue = _ref.defaultValue,
19
16
  defaultValue = _ref$defaultValue === void 0 ? "" : _ref$defaultValue,
@@ -70,10 +67,14 @@ var TextareaComponent = function TextareaComponent(_ref) {
70
67
  onChange: onChange,
71
68
  ref: elementRef
72
69
  })));
73
- }; // eslint-disable-next-line import/no-default-export
70
+ };
71
+ /**
72
+ * @see https://vkcom.github.io/VKUI/#/Textarea
73
+ */
74
74
 
75
75
 
76
76
  export var Textarea = withAdaptivity(TextareaComponent, {
77
77
  sizeY: true
78
78
  });
79
+ Textarea.displayName = "Textarea";
79
80
  //# sourceMappingURL=Textarea.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/Textarea/Textarea.tsx"],"names":["React","classNames","FormField","withAdaptivity","useEnsuredControl","useExternRef","TextareaComponent","defaultValue","grow","style","onResize","className","getRootRef","getRef","sizeY","rows","maxHeight","restProps","value","onChange","currentScrollHeight","useRef","elementRef","useEffect","el","current","offsetParent","height","scrollHeight","disabled","Textarea"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,UAAT;AACA,SAASC,SAAT;AAEA,SAASC,cAAT;AACA,SAASC,iBAAT;AACA,SAASC,YAAT;AACA;;AAaA;AACA;AACA;AACA,IAAMC,iBAAiB,GAAG,SAApBA,iBAAoB,OAYL;AAAA,+BAXnBC,YAWmB;AAAA,MAXnBA,YAWmB,kCAXJ,EAWI;AAAA,uBAVnBC,IAUmB;AAAA,MAVnBA,IAUmB,0BAVZ,IAUY;AAAA,MATnBC,KASmB,QATnBA,KASmB;AAAA,MARnBC,QAQmB,QARnBA,QAQmB;AAAA,MAPnBC,SAOmB,QAPnBA,SAOmB;AAAA,MANnBC,UAMmB,QANnBA,UAMmB;AAAA,MALnBC,MAKmB,QALnBA,MAKmB;AAAA,MAJnBC,KAImB,QAJnBA,KAImB;AAAA,uBAHnBC,IAGmB;AAAA,MAHnBA,IAGmB,0BAHZ,CAGY;AAAA,MAFnBC,SAEmB,QAFnBA,SAEmB;AAAA,MADhBC,SACgB;;AACnB,2BAA0Bb,iBAAiB,CAACa,SAAD,EAAY;AAAEV,IAAAA,YAAY,EAAZA;AAAF,GAAZ,CAA3C;AAAA;AAAA,MAAOW,KAAP;AAAA,MAAcC,QAAd;;AACA,MAAMC,mBAAmB,GAAGpB,KAAK,CAACqB,MAAN,EAA5B;AACA,MAAMC,UAAU,GAAGjB,YAAY,CAACQ,MAAD,CAA/B,CAHmB,CAKnB;;AACAb,EAAAA,KAAK,CAACuB,SAAN,CAAgB,YAAM;AACpB,QAAMC,EAAE,GAAGF,UAAU,CAACG,OAAtB;;AAEA,QAAIjB,IAAI,IAAIgB,EAAJ,aAAIA,EAAJ,eAAIA,EAAE,CAAEE,YAAhB,EAA8B;AAC5BF,MAAAA,EAAE,CAACf,KAAH,CAASkB,MAAT,GAAkB,EAAlB;AACAH,MAAAA,EAAE,CAACf,KAAH,CAASkB,MAAT,aAAqBH,EAAE,CAACI,YAAxB;;AAEA,UAAIJ,EAAE,CAACI,YAAH,KAAoBR,mBAAmB,CAACK,OAAxC,IAAmDf,QAAvD,EAAiE;AAC/DA,QAAAA,QAAQ,CAACc,EAAD,CAAR;AACAJ,QAAAA,mBAAmB,CAACK,OAApB,GAA8BD,EAAE,CAACI,YAAjC;AACD;AACF;AACF,GAZD,EAYG,CAACpB,IAAD,EAAOU,KAAP,EAAcJ,KAAd,EAAqBQ,UAArB,EAAiCZ,QAAjC,CAZH;AAcA,SACE,oBAAC,SAAD;AACE,IAAA,SAAS,EAAET,UAAU,CACnB,UADmB,EAEnB;AAFmB,8BAGAa,KAHA,EADvB;AAME,IAAA,SAAS,EAAEH,SANb;AAOE,IAAA,KAAK,EAAEF,KAPT;AAQE,IAAA,UAAU,EAAEG,UARd;AASE,IAAA,QAAQ,EAAEK,SAAS,CAACY;AATtB,KAWE,6CACMZ,SADN;AAEE,IAAA,KAAK,EAAE;AAAED,MAAAA,SAAS,EAATA;AAAF,KAFT;AAGE,IAAA,IAAI,EAAED,IAHR;AAIE,IAAA,SAAS,EAAC,cAJZ;AAKE,IAAA,KAAK,EAAEG,KALT;AAME,IAAA,QAAQ,EAAEC,QANZ;AAOE,IAAA,GAAG,EAAEG;AAPP,KAXF,CADF;AAuBD,CAvDD,C,CAyDA;;;AACA,OAAO,IAAMQ,QAAQ,GAAG3B,cAAc,CAACG,iBAAD,EAAoB;AAAEQ,EAAAA,KAAK,EAAE;AAAT,CAApB,CAA/B","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { FormField } from \"../FormField/FormField\";\nimport { HasRef, HasRootRef } from \"../../types\";\nimport { withAdaptivity, AdaptivityProps } from \"../../hoc/withAdaptivity\";\nimport { useEnsuredControl } from \"../../hooks/useEnsuredControl\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport \"./Textarea.css\";\n\nexport interface TextareaProps\n extends React.TextareaHTMLAttributes<HTMLTextAreaElement>,\n HasRef<HTMLTextAreaElement>,\n HasRootRef<HTMLElement>,\n AdaptivityProps,\n Pick<React.CSSProperties, \"maxHeight\"> {\n grow?: boolean;\n onResize?(el: HTMLTextAreaElement): void;\n defaultValue?: string;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Textarea\n */\nconst TextareaComponent = ({\n defaultValue = \"\",\n grow = true,\n style,\n onResize,\n className,\n getRootRef,\n getRef,\n sizeY,\n rows = 2,\n maxHeight,\n ...restProps\n}: TextareaProps) => {\n const [value, onChange] = useEnsuredControl(restProps, { defaultValue });\n const currentScrollHeight = React.useRef<number>();\n const elementRef = useExternRef(getRef);\n\n // autosize input\n React.useEffect(() => {\n const el = elementRef.current;\n\n if (grow && el?.offsetParent) {\n el.style.height = \"\";\n el.style.height = `${el.scrollHeight}px`;\n\n if (el.scrollHeight !== currentScrollHeight.current && onResize) {\n onResize(el);\n currentScrollHeight.current = el.scrollHeight;\n }\n }\n }, [grow, value, sizeY, elementRef, onResize]);\n\n return (\n <FormField\n vkuiClass={classNames(\n \"Textarea\",\n // TODO. v5.0.0 Новая адаптивность\n `Textarea--sizeY-${sizeY}`\n )}\n className={className}\n style={style}\n getRootRef={getRootRef}\n disabled={restProps.disabled}\n >\n <textarea\n {...restProps}\n style={{ maxHeight }}\n rows={rows}\n vkuiClass=\"Textarea__el\"\n value={value}\n onChange={onChange}\n ref={elementRef}\n />\n </FormField>\n );\n};\n\n// eslint-disable-next-line import/no-default-export\nexport const Textarea = withAdaptivity(TextareaComponent, { sizeY: true });\n"],"file":"Textarea.js"}
1
+ {"version":3,"sources":["../../../../src/components/Textarea/Textarea.tsx"],"names":["React","classNames","FormField","withAdaptivity","useEnsuredControl","useExternRef","TextareaComponent","defaultValue","grow","style","onResize","className","getRootRef","getRef","sizeY","rows","maxHeight","restProps","value","onChange","currentScrollHeight","useRef","elementRef","useEffect","el","current","offsetParent","height","scrollHeight","disabled","Textarea","displayName"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,UAAT;AACA,SAASC,SAAT;AAEA,SAASC,cAAT;AACA,SAASC,iBAAT;AACA,SAASC,YAAT;AACA;;AAaA,IAAMC,iBAAiB,GAAG,SAApBA,iBAAoB,OAYL;AAAA,+BAXnBC,YAWmB;AAAA,MAXnBA,YAWmB,kCAXJ,EAWI;AAAA,uBAVnBC,IAUmB;AAAA,MAVnBA,IAUmB,0BAVZ,IAUY;AAAA,MATnBC,KASmB,QATnBA,KASmB;AAAA,MARnBC,QAQmB,QARnBA,QAQmB;AAAA,MAPnBC,SAOmB,QAPnBA,SAOmB;AAAA,MANnBC,UAMmB,QANnBA,UAMmB;AAAA,MALnBC,MAKmB,QALnBA,MAKmB;AAAA,MAJnBC,KAImB,QAJnBA,KAImB;AAAA,uBAHnBC,IAGmB;AAAA,MAHnBA,IAGmB,0BAHZ,CAGY;AAAA,MAFnBC,SAEmB,QAFnBA,SAEmB;AAAA,MADhBC,SACgB;;AACnB,2BAA0Bb,iBAAiB,CAACa,SAAD,EAAY;AAAEV,IAAAA,YAAY,EAAZA;AAAF,GAAZ,CAA3C;AAAA;AAAA,MAAOW,KAAP;AAAA,MAAcC,QAAd;;AACA,MAAMC,mBAAmB,GAAGpB,KAAK,CAACqB,MAAN,EAA5B;AACA,MAAMC,UAAU,GAAGjB,YAAY,CAACQ,MAAD,CAA/B,CAHmB,CAKnB;;AACAb,EAAAA,KAAK,CAACuB,SAAN,CAAgB,YAAM;AACpB,QAAMC,EAAE,GAAGF,UAAU,CAACG,OAAtB;;AAEA,QAAIjB,IAAI,IAAIgB,EAAJ,aAAIA,EAAJ,eAAIA,EAAE,CAAEE,YAAhB,EAA8B;AAC5BF,MAAAA,EAAE,CAACf,KAAH,CAASkB,MAAT,GAAkB,EAAlB;AACAH,MAAAA,EAAE,CAACf,KAAH,CAASkB,MAAT,aAAqBH,EAAE,CAACI,YAAxB;;AAEA,UAAIJ,EAAE,CAACI,YAAH,KAAoBR,mBAAmB,CAACK,OAAxC,IAAmDf,QAAvD,EAAiE;AAC/DA,QAAAA,QAAQ,CAACc,EAAD,CAAR;AACAJ,QAAAA,mBAAmB,CAACK,OAApB,GAA8BD,EAAE,CAACI,YAAjC;AACD;AACF;AACF,GAZD,EAYG,CAACpB,IAAD,EAAOU,KAAP,EAAcJ,KAAd,EAAqBQ,UAArB,EAAiCZ,QAAjC,CAZH;AAcA,SACE,oBAAC,SAAD;AACE,IAAA,SAAS,EAAET,UAAU,CACnB,UADmB,EAEnB;AAFmB,8BAGAa,KAHA,EADvB;AAME,IAAA,SAAS,EAAEH,SANb;AAOE,IAAA,KAAK,EAAEF,KAPT;AAQE,IAAA,UAAU,EAAEG,UARd;AASE,IAAA,QAAQ,EAAEK,SAAS,CAACY;AATtB,KAWE,6CACMZ,SADN;AAEE,IAAA,KAAK,EAAE;AAAED,MAAAA,SAAS,EAATA;AAAF,KAFT;AAGE,IAAA,IAAI,EAAED,IAHR;AAIE,IAAA,SAAS,EAAC,cAJZ;AAKE,IAAA,KAAK,EAAEG,KALT;AAME,IAAA,QAAQ,EAAEC,QANZ;AAOE,IAAA,GAAG,EAAEG;AAPP,KAXF,CADF;AAuBD,CAvDD;AAyDA;AACA;AACA;;;AACA,OAAO,IAAMQ,QAAQ,GAAG3B,cAAc,CAACG,iBAAD,EAAoB;AAAEQ,EAAAA,KAAK,EAAE;AAAT,CAApB,CAA/B;AAEPgB,QAAQ,CAACC,WAAT,GAAuB,UAAvB","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { FormField } from \"../FormField/FormField\";\nimport { HasRef, HasRootRef } from \"../../types\";\nimport { withAdaptivity, AdaptivityProps } from \"../../hoc/withAdaptivity\";\nimport { useEnsuredControl } from \"../../hooks/useEnsuredControl\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport \"./Textarea.css\";\n\nexport interface TextareaProps\n extends React.TextareaHTMLAttributes<HTMLTextAreaElement>,\n HasRef<HTMLTextAreaElement>,\n HasRootRef<HTMLElement>,\n AdaptivityProps,\n Pick<React.CSSProperties, \"maxHeight\"> {\n grow?: boolean;\n onResize?(el: HTMLTextAreaElement): void;\n defaultValue?: string;\n}\n\nconst TextareaComponent = ({\n defaultValue = \"\",\n grow = true,\n style,\n onResize,\n className,\n getRootRef,\n getRef,\n sizeY,\n rows = 2,\n maxHeight,\n ...restProps\n}: TextareaProps) => {\n const [value, onChange] = useEnsuredControl(restProps, { defaultValue });\n const currentScrollHeight = React.useRef<number>();\n const elementRef = useExternRef(getRef);\n\n // autosize input\n React.useEffect(() => {\n const el = elementRef.current;\n\n if (grow && el?.offsetParent) {\n el.style.height = \"\";\n el.style.height = `${el.scrollHeight}px`;\n\n if (el.scrollHeight !== currentScrollHeight.current && onResize) {\n onResize(el);\n currentScrollHeight.current = el.scrollHeight;\n }\n }\n }, [grow, value, sizeY, elementRef, onResize]);\n\n return (\n <FormField\n vkuiClass={classNames(\n \"Textarea\",\n // TODO. v5.0.0 Новая адаптивность\n `Textarea--sizeY-${sizeY}`\n )}\n className={className}\n style={style}\n getRootRef={getRootRef}\n disabled={restProps.disabled}\n >\n <textarea\n {...restProps}\n style={{ maxHeight }}\n rows={rows}\n vkuiClass=\"Textarea__el\"\n value={value}\n onChange={onChange}\n ref={elementRef}\n />\n </FormField>\n );\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Textarea\n */\nexport const Textarea = withAdaptivity(TextareaComponent, { sizeY: true });\n\nTextarea.displayName = \"Textarea\";\n"],"file":"Textarea.js"}
@@ -1 +1 @@
1
- .vkuiTooltip{position:absolute;left:0;top:0;height:100%;width:100%;z-index:2;white-space:normal}.vkuiTooltip__container{position:absolute}.vkuiTooltip__container[data-popper-placement^=bottom] .vkuiTooltip__corner{top:-8px}.vkuiTooltip__container[data-popper-placement^=top] .vkuiTooltip__corner{bottom:-8px}.vkuiTooltip__container[data-popper-placement^=top] .vkuiTooltip__corner::before{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.vkuiTooltip__container[data-popper-placement^=left] .vkuiTooltip__corner{right:-14px}.vkuiTooltip__container[data-popper-placement^=left] .vkuiTooltip__corner::before{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.vkuiTooltip__container[data-popper-placement^=right] .vkuiTooltip__corner{left:-14px}.vkuiTooltip__container[data-popper-placement^=right] .vkuiTooltip__corner::before{-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}.vkuiTooltip__corner{width:20px;height:8px;position:absolute}.vkuiTooltip__corner::before{content:"";display:block;background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHdpZHRoPSIyMHB4IiBoZWlnaHQ9IjhweCIgdmlld0JveD0iMCAwIDIwIDgiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+ICAgICAgICA8dGl0bGU+dG9vbHRpcF90aXA8L3RpdGxlPiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4gICAgPGRlZnM+PC9kZWZzPiAgICA8ZyBpZD0iTWFzdGVyLUtpdCIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+ICAgICAgICA8cGF0aCBkPSJNMTAsMCBDMTMuNSwwIDE1LjUsOCAyMCw4IEwwLDggQzQuNSw4IDYuNSwwIDEwLDAgWiIgaWQ9InRvb2x0aXBfdGlwIiBmaWxsPSIjNDdhM2ZmIiBmaWxsLXJ1bGU9Im5vbnplcm8iPjwvcGF0aD4gICAgPC9nPjwvc3ZnPg==);width:20px;height:8px}.vkuiTooltip--light .vkuiTooltip__corner::before{background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHdpZHRoPSIyMHB4IiBoZWlnaHQ9IjhweCIgdmlld0JveD0iMCAwIDIwIDgiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+ICAgICAgICA8dGl0bGU+dG9vbHRpcF90aXA8L3RpdGxlPiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4gICAgPGRlZnM+PC9kZWZzPiAgICA8ZyBpZD0iTWFzdGVyLUtpdCIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+ICAgICAgICA8cGF0aCBkPSJNMTAsMCBDMTMuNSwwIDE1LjUsOCAyMCw4IEwwLDggQzQuNSw4IDYuNSwwIDEwLDAgWiIgaWQ9InRvb2x0aXBfdGlwIiBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9Im5vbnplcm8iPjwvcGF0aD4gICAgPC9nPjwvc3ZnPg==)}.vkuiTooltip__content{background-color:#47a3ff;box-shadow:0 4px 32px 0 rgba(0,0,0,.16),0 0 4px 0 rgba(0,0,0,.04);padding:8px 12px 10px;border-radius:10px;color:#fff;max-width:220px}.vkuiTooltip--light .vkuiTooltip__content{background:#fff;color:#2c2d2e}
1
+ .vkuiTooltip{height:100%;left:0;top:0;white-space:normal;width:100%;z-index:2}.vkuiTooltip,.vkuiTooltip__container{position:absolute}.vkuiTooltip__content{background-color:#fff;background-color:var(--vkui--color_background_modal,#fff);border-radius:8px;border-radius:var(--vkui--size_border_radius--regular,8px);box-shadow:0 0 2px rgba(0,0,0,.08),0 4px 16px rgba(0,0,0,.08);box-shadow:var(--vkui--elevation3,0 0 2px rgba(0,0,0,.08),0 4px 16px rgba(0,0,0,.08));color:#000;color:var(--vkui--color_text_primary,#000);max-width:220px;padding:9px 12px 10px}.vkuiTooltip__arrow{color:#fff;color:var(--vkui--color_background_modal,#fff)}.vkuiTooltip--accent .vkuiTooltip__content{background-color:#5a9eff;background-color:var(--vkui--color_background_accent_tint,#5a9eff);color:#fff;color:var(--vkui--color_text_contrast,#fff)}.vkuiTooltip--accent .vkuiTooltip__arrow{color:#5a9eff;color:var(--vkui--color_background_accent_tint,#5a9eff)}.vkuiTooltip--white .vkuiTooltip__content{background-color:#fff;background-color:var(--vkui--color_background_contrast,#fff);color:#000;color:var(--vkui--color_text_primary_invariably,#000)}.vkuiTooltip--white .vkuiTooltip__arrow{color:#fff;color:var(--vkui--color_background_contrast,#fff)}.vkuiTooltip--black .vkuiTooltip__content{background-color:#2d2d2e;background-color:var(--vkui--color_background_contrast_inverse,#2d2d2e);color:#fff;color:var(--vkui--color_text_contrast,#fff)}.vkuiTooltip--black .vkuiTooltip__arrow{color:#2d2d2e;color:var(--vkui--color_background_contrast_inverse,#2d2d2e)}.vkuiTooltip--inversion .vkuiTooltip__content{background-color:#2d2d2e;background-color:var(--vkui--color_background_modal_inverse,#2d2d2e);color:#fff;color:var(--vkui--color_text_contrast_themed,#fff)}.vkuiTooltip--inversion .vkuiTooltip__arrow{color:#2d2d2e;color:var(--vkui--color_background_modal_inverse,#2d2d2e)}
@@ -1,4 +1,5 @@
1
1
  import * as React from "react";
2
+ import { Placement } from "@popperjs/core";
2
3
  import { HasRootRef } from "../../types";
3
4
  import "./Tooltip.css";
4
5
  export interface TooltipProps {
@@ -8,7 +9,15 @@ export interface TooltipProps {
8
9
  * иначе тултип показан не будет. Если передан React-element, то такой проблемы нет.
9
10
  */
10
11
  children: React.ReactElement<HasRootRef<any>> | React.ReactElement<React.PropsWithRef<any>>;
12
+ /**
13
+ * @deprecated будет удалено в 5.0.0, устанавливать стиль следует через appearance
14
+ * Стиль отображения подсказки
15
+ */
11
16
  mode?: "accent" | "light";
17
+ /**
18
+ * Стиль отображения подсказки
19
+ */
20
+ appearance?: "accent" | "neutral" | "white" | "black" | "inversion";
12
21
  /**
13
22
  * Если передан `false`, то рисуется просто `children`.
14
23
  */
@@ -39,6 +48,10 @@ export interface TooltipProps {
39
48
  * Сдвиг по вертикали (относительно портала, в котором рисуется тултип).
40
49
  */
41
50
  offsetY?: number;
51
+ /**
52
+ * Отображать ли стрелку, указывающую на якорный элемент
53
+ */
54
+ arrow?: boolean;
42
55
  /**
43
56
  * Сдвиг стрелочки относительно центра дочернего элемента.
44
57
  */
@@ -51,8 +64,12 @@ export interface TooltipProps {
51
64
  * Callback, который вызывается при клике по любому месту в пределах экрана.
52
65
  */
53
66
  onClose?: () => void;
67
+ /**
68
+ * По умолчанию компонент выберет наилучшее расположение сам. Но его можно задать извне с помощью этого свойства
69
+ */
70
+ placement?: Placement;
54
71
  }
55
72
  /**
56
73
  * @see https://vkcom.github.io/VKUI/#/Tooltip
57
74
  */
58
- export declare const Tooltip: ({ children, isShown: _isShown, offsetX, offsetY, alignX, alignY, onClose, cornerOffset, cornerAbsoluteOffset, mode, ...restProps }: TooltipProps) => JSX.Element;
75
+ export declare const Tooltip: ({ children, isShown: _isShown, offsetX, offsetY, alignX, alignY, onClose, cornerOffset, cornerAbsoluteOffset, mode, appearance, arrow, placement, ...restProps }: TooltipProps) => JSX.Element;
@@ -3,7 +3,7 @@ import _typeof from "@babel/runtime/helpers/typeof";
3
3
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
4
4
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
5
5
  import _extends from "@babel/runtime/helpers/extends";
6
- var _excluded = ["children", "isShown", "offsetX", "offsetY", "alignX", "alignY", "onClose", "cornerOffset", "cornerAbsoluteOffset", "mode"];
6
+ var _excluded = ["children", "isShown", "offsetX", "offsetY", "alignX", "alignY", "onClose", "cornerOffset", "cornerAbsoluteOffset", "mode", "appearance", "arrow", "placement"];
7
7
  import { createScopedElement } from "../../lib/jsxRuntime";
8
8
  import * as React from "react";
9
9
  import ReactDOM from "react-dom";
@@ -11,12 +11,14 @@ import { classNames } from "../../lib/classNames";
11
11
  import { getClassName } from "../../helpers/getClassName";
12
12
  import { Subhead } from "../Typography/Subhead/Subhead";
13
13
  import { useNavTransition } from "../NavTransitionContext/NavTransitionContext";
14
+ import { PopperArrow } from "../PopperArrow/PopperArrow";
14
15
  import { usePopper } from "react-popper";
15
16
  import { tooltipContainerAttr } from "./TooltipContainer";
16
17
  import { useExternRef } from "../../hooks/useExternRef";
17
18
  import { useDOM } from "../../lib/dom";
18
19
  import { warnOnce } from "../../lib/warnOnce";
19
20
  import { hasReactNode } from "../../lib/utils";
21
+ import { prefixClass } from "../../lib/prefixClass";
20
22
  import { useGlobalEventListener } from "../../hooks/useGlobalEventListener";
21
23
  import "./Tooltip.css";
22
24
 
@@ -28,29 +30,28 @@ var baseClassName = getClassName("Tooltip");
28
30
  var warn = warnOnce("Tooltip");
29
31
  var IS_DEV = process.env.NODE_ENV === "development";
30
32
  var SimpleTooltip = /*#__PURE__*/React.forwardRef(function SimpleTooltip(_ref, ref) {
31
- var _ref$mode = _ref.mode,
32
- mode = _ref$mode === void 0 ? "accent" : _ref$mode,
33
+ var _ref$appearance = _ref.appearance,
34
+ appearance = _ref$appearance === void 0 ? "accent" : _ref$appearance,
33
35
  header = _ref.header,
34
36
  text = _ref.text,
35
- arrowRef = _ref.arrowRef,
37
+ arrow = _ref.arrow,
36
38
  _ref$style = _ref.style,
37
39
  style = _ref$style === void 0 ? {} : _ref$style,
38
40
  attributes = _ref.attributes;
39
41
  return createScopedElement("div", {
40
- vkuiClass: classNames(baseClassName, "Tooltip--".concat(mode))
42
+ vkuiClass: classNames(baseClassName, "Tooltip--".concat(appearance))
41
43
  }, createScopedElement("div", _extends({
42
44
  vkuiClass: "Tooltip__container",
43
45
  ref: ref,
44
46
  style: style.container
45
- }, attributes === null || attributes === void 0 ? void 0 : attributes.container), createScopedElement("div", _extends({
46
- vkuiClass: "Tooltip__corner",
47
- style: style.arrow
48
- }, attributes === null || attributes === void 0 ? void 0 : attributes.arrow, {
49
- ref: arrowRef
50
- })), createScopedElement("div", {
47
+ }, attributes === null || attributes === void 0 ? void 0 : attributes.container), arrow && createScopedElement(PopperArrow, {
48
+ style: style.arrow,
49
+ attributes: attributes === null || attributes === void 0 ? void 0 : attributes.arrow,
50
+ arrowClassName: prefixClass("Tooltip__arrow")
51
+ }), createScopedElement("div", {
51
52
  vkuiClass: "Tooltip__content"
52
53
  }, header && createScopedElement(Subhead, {
53
- weight: "1",
54
+ weight: "2",
54
55
  vkuiClass: "Tooltip__title"
55
56
  }, header), text && createScopedElement(Subhead, {
56
57
  vkuiClass: "Tooltip__text"
@@ -79,6 +80,19 @@ function getPlacement(alignX, alignY) {
79
80
  function isVerticalPlacement(placement) {
80
81
  return placement.startsWith("top") || placement.startsWith("bottom");
81
82
  }
83
+ /**
84
+ * Вычисляем стиль подсказки: параметр appearance имеет приоритет, иначе мапим mode на подходящее значение из appearance
85
+ * TODO: v5 избавиться от пропа mode и этого метода, для appearance по умолчанию сделать "accent"
86
+ */
87
+
88
+
89
+ function calculateAppearance(mode, appearance) {
90
+ if (appearance) {
91
+ return appearance;
92
+ }
93
+
94
+ return mode === "light" ? "white" : "accent";
95
+ }
82
96
  /**
83
97
  * @see https://vkcom.github.io/VKUI/#/Tooltip
84
98
  */
@@ -102,6 +116,10 @@ export var Tooltip = function Tooltip(_ref2) {
102
116
  cornerAbsoluteOffset = _ref2.cornerAbsoluteOffset,
103
117
  _ref2$mode = _ref2.mode,
104
118
  mode = _ref2$mode === void 0 ? "accent" : _ref2$mode,
119
+ appearance = _ref2.appearance,
120
+ _ref2$arrow = _ref2.arrow,
121
+ arrow = _ref2$arrow === void 0 ? true : _ref2$arrow,
122
+ placement = _ref2.placement,
105
123
  restProps = _objectWithoutProperties(_ref2, _excluded);
106
124
 
107
125
  var _useNavTransition = useNavTransition(),
@@ -114,15 +132,10 @@ export var Tooltip = function Tooltip(_ref2) {
114
132
  tooltipRef = _React$useState2[0],
115
133
  setTooltipRef = _React$useState2[1];
116
134
 
117
- var _React$useState3 = React.useState(null),
135
+ var _React$useState3 = React.useState(),
118
136
  _React$useState4 = _slicedToArray(_React$useState3, 2),
119
- tooltipArrowRef = _React$useState4[0],
120
- setTooltipArrowRef = _React$useState4[1];
121
-
122
- var _React$useState5 = React.useState(),
123
- _React$useState6 = _slicedToArray(_React$useState5, 2),
124
- target = _React$useState6[0],
125
- setTarget = _React$useState6[1];
137
+ target = _React$useState4[0],
138
+ setTarget = _React$useState4[1];
126
139
 
127
140
  if (IS_DEV) {
128
141
  var multiChildren = React.Children.count(children) > 1; // Empty children is a noop
@@ -149,63 +162,70 @@ export var Tooltip = function Tooltip(_ref2) {
149
162
  throw new Error("Use TooltipContainer for Tooltip outside Panel (see docs)");
150
163
  }
151
164
 
152
- var arrowOffsetModifier = React.useMemo(function () {
153
- return {
154
- name: "arrowOffset",
155
- enabled: true,
156
- phase: "main",
157
- fn: function fn(_ref3) {
158
- var state = _ref3.state;
165
+ var modifiers = React.useMemo(function () {
166
+ var modifiers = [{
167
+ name: "offset",
168
+ options: {
169
+ offset: [offsetX, offsetY]
170
+ }
171
+ }, {
172
+ name: "preventOverflow"
173
+ }, {
174
+ name: "flip"
175
+ }];
159
176
 
160
- if (!state.modifiersData.arrow) {
161
- return;
177
+ if (arrow) {
178
+ modifiers.push({
179
+ name: "arrow",
180
+ options: {
181
+ padding: 14
162
182
  }
183
+ });
184
+ modifiers.push({
185
+ name: "arrowOffset",
186
+ enabled: true,
187
+ phase: "main",
188
+ fn: function fn(_ref3) {
189
+ var state = _ref3.state;
163
190
 
164
- if (isVerticalPlacement(state.placement)) {
165
- if (cornerAbsoluteOffset !== undefined) {
166
- state.modifiersData.arrow.x = cornerAbsoluteOffset;
167
- } else {
168
- var _state$modifiersData$;
191
+ if (!state.modifiersData.arrow) {
192
+ return;
193
+ }
194
+
195
+ if (isVerticalPlacement(state.placement)) {
196
+ if (cornerAbsoluteOffset !== undefined) {
197
+ state.modifiersData.arrow.x = cornerAbsoluteOffset;
198
+ } else {
199
+ var _state$modifiersData$;
169
200
 
170
- if (((_state$modifiersData$ = state.modifiersData.arrow) === null || _state$modifiersData$ === void 0 ? void 0 : _state$modifiersData$.x) !== undefined) {
171
- state.modifiersData.arrow.x += cornerOffset;
201
+ if (((_state$modifiersData$ = state.modifiersData.arrow) === null || _state$modifiersData$ === void 0 ? void 0 : _state$modifiersData$.x) !== undefined) {
202
+ state.modifiersData.arrow.x += cornerOffset;
203
+ }
172
204
  }
173
- }
174
- } else {
175
- if (cornerAbsoluteOffset !== undefined) {
176
- state.modifiersData.arrow.y = cornerAbsoluteOffset;
177
205
  } else {
178
- var _state$modifiersData$2;
206
+ if (cornerAbsoluteOffset !== undefined) {
207
+ state.modifiersData.arrow.y = cornerAbsoluteOffset;
208
+ } else {
209
+ var _state$modifiersData$2;
179
210
 
180
- if (((_state$modifiersData$2 = state.modifiersData.arrow) === null || _state$modifiersData$2 === void 0 ? void 0 : _state$modifiersData$2.y) !== undefined) {
181
- state.modifiersData.arrow.y += cornerOffset;
211
+ if (((_state$modifiersData$2 = state.modifiersData.arrow) === null || _state$modifiersData$2 === void 0 ? void 0 : _state$modifiersData$2.y) !== undefined) {
212
+ state.modifiersData.arrow.y += cornerOffset;
213
+ }
182
214
  }
183
215
  }
184
216
  }
185
- }
186
- };
187
- }, [cornerOffset, cornerAbsoluteOffset]);
188
- var placement = getPlacement(alignX, alignY);
217
+ });
218
+ }
219
+
220
+ return modifiers;
221
+ }, [arrow, cornerAbsoluteOffset, cornerOffset, offsetX, offsetY]);
222
+
223
+ var _placement = placement !== null && placement !== void 0 ? placement : getPlacement(alignX, alignY);
189
224
 
190
225
  var _usePopper = usePopper(target, tooltipRef, {
191
226
  strategy: strategy,
192
- placement: placement,
193
- modifiers: [{
194
- name: "offset",
195
- options: {
196
- offset: [offsetX, offsetY]
197
- }
198
- }, {
199
- name: "arrow",
200
- options: {
201
- element: tooltipArrowRef,
202
- padding: 14
203
- }
204
- }, {
205
- name: "preventOverflow"
206
- }, {
207
- name: "flip"
208
- }, arrowOffsetModifier]
227
+ placement: _placement,
228
+ modifiers: modifiers
209
229
  }),
210
230
  styles = _usePopper.styles,
211
231
  attributes = _usePopper.attributes;
@@ -220,14 +240,15 @@ export var Tooltip = function Tooltip(_ref2) {
220
240
  var childRef = /*#__PURE__*/React.isValidElement(children) && (isDOMTypeElement(children) ? children.ref : children.props.getRootRef);
221
241
  var patchedRef = useExternRef(setTarget, childRef);
222
242
  var child = /*#__PURE__*/React.isValidElement(children) ? /*#__PURE__*/React.cloneElement(children, _defineProperty({}, isDOMTypeElement(children) ? "ref" : "getRootRef", patchedRef)) : children;
243
+
244
+ var _appearance = calculateAppearance(mode, appearance);
245
+
223
246
  return createScopedElement(React.Fragment, null, child, isShown && target != null && /*#__PURE__*/ReactDOM.createPortal(createScopedElement(SimpleTooltip, _extends({}, restProps, {
224
- mode: mode,
247
+ appearance: _appearance,
248
+ arrow: arrow,
225
249
  ref: function ref(el) {
226
250
  return setTooltipRef(el);
227
251
  },
228
- arrowRef: function arrowRef(el) {
229
- return setTooltipArrowRef(el);
230
- },
231
252
  style: {
232
253
  arrow: styles.arrow,
233
254
  container: styles.popper
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/Tooltip/Tooltip.tsx"],"names":["React","ReactDOM","classNames","getClassName","Subhead","useNavTransition","usePopper","tooltipContainerAttr","useExternRef","useDOM","warnOnce","hasReactNode","useGlobalEventListener","isDOMTypeElement","element","isValidElement","type","baseClassName","warn","IS_DEV","process","env","NODE_ENV","SimpleTooltip","forwardRef","ref","mode","header","text","arrowRef","style","attributes","container","arrow","mapAlignX","x","getPlacement","alignX","alignY","filter","p","join","isVerticalPlacement","placement","startsWith","Tooltip","children","isShown","_isShown","offsetX","offsetY","onClose","cornerOffset","cornerAbsoluteOffset","restProps","entering","useState","tooltipRef","setTooltipRef","tooltipArrowRef","setTooltipArrowRef","target","setTarget","multiChildren","Children","count","primitiveChild","JSON","stringify","Boolean","tooltipContainer","useMemo","closest","strategy","position","Error","arrowOffsetModifier","name","enabled","phase","fn","state","modifiersData","undefined","y","modifiers","options","offset","padding","styles","document","passive","childRef","props","getRootRef","patchedRef","child","cloneElement","createPortal","el","popper"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport ReactDOM from \"react-dom\";\nimport { classNames } from \"../../lib/classNames\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { Subhead } from \"../Typography/Subhead/Subhead\";\nimport { useNavTransition } from \"../NavTransitionContext/NavTransitionContext\";\nimport { Modifier, usePopper } from \"react-popper\";\nimport { Placement } from \"@popperjs/core\";\nimport { tooltipContainerAttr } from \"./TooltipContainer\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { useDOM } from \"../../lib/dom\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport { useGlobalEventListener } from \"../../hooks/useGlobalEventListener\";\nimport { HasRootRef } from \"../../types\";\nimport \"./Tooltip.css\";\n\ninterface SimpleTooltipProps extends Partial<TooltipProps> {\n target?: HTMLDivElement;\n arrowRef?: React.Ref<HTMLDivElement>;\n style?: {\n arrow: React.CSSProperties;\n container: React.CSSProperties;\n };\n attributes?: {\n arrow: React.HTMLAttributes<HTMLDivElement> | null;\n container: React.HTMLAttributes<HTMLDivElement> | null;\n };\n}\n\nconst isDOMTypeElement = (\n element: React.ReactElement\n): element is React.DOMElement<any, any> => {\n return React.isValidElement(element) && typeof element.type === \"string\";\n};\n\nconst baseClassName = getClassName(\"Tooltip\");\nconst warn = warnOnce(\"Tooltip\");\nconst IS_DEV = process.env.NODE_ENV === \"development\";\n\nconst SimpleTooltip = React.forwardRef<HTMLDivElement, SimpleTooltipProps>(\n function SimpleTooltip(\n { mode = \"accent\", header, text, arrowRef, style = {}, attributes },\n ref\n ) {\n return (\n <div vkuiClass={classNames(baseClassName, `Tooltip--${mode}`)}>\n <div\n vkuiClass=\"Tooltip__container\"\n ref={ref}\n style={style.container}\n {...attributes?.container}\n >\n <div\n vkuiClass=\"Tooltip__corner\"\n style={style.arrow}\n {...attributes?.arrow}\n ref={arrowRef}\n />\n <div vkuiClass=\"Tooltip__content\">\n {header && (\n <Subhead weight=\"1\" vkuiClass=\"Tooltip__title\">\n {header}\n </Subhead>\n )}\n {text && <Subhead vkuiClass=\"Tooltip__text\">{text}</Subhead>}\n </div>\n </div>\n </div>\n );\n }\n);\n\nexport interface TooltipProps {\n /**\n * **Важно**: если в `children` передан React-компонент, то необходимо убедиться в том, что он поддерживает\n * свойство `getRootRef`, которое должно возвращаться ссылку на корневой DOM-элемент компонента,\n * иначе тултип показан не будет. Если передан React-element, то такой проблемы нет.\n */\n children:\n | React.ReactElement<HasRootRef<any>>\n | React.ReactElement<React.PropsWithRef<any>>;\n mode?: \"accent\" | \"light\";\n /**\n * Если передан `false`, то рисуется просто `children`.\n */\n isShown?: boolean;\n /**\n * Текст тултипа.\n */\n text?: React.ReactNode;\n /**\n * Заголовок тултипа.\n */\n header?: React.ReactNode;\n /**\n * Положение по горизонтали (прижатие к левому или правому краю `children`).\n * Если не задано, позиция по горизонтали определятся автоматически\n */\n alignX?: \"center\" | \"left\" | \"right\";\n /**\n * Положение по вертикали (расположение над или под `children`).\n * Если не задано, позиция по вертикали определятся автоматически\n */\n alignY?: \"top\" | \"bottom\";\n /**\n * Сдвиг по горизонтали (относительно портала, в котором рисуется тултип).\n */\n offsetX?: number;\n /**\n * Сдвиг по вертикали (относительно портала, в котором рисуется тултип).\n */\n offsetY?: number;\n /**\n * Сдвиг стрелочки относительно центра дочернего элемента.\n */\n cornerOffset?: number;\n /**\n * Сдвиг стрелочки относительно ширины тултипа\n */\n cornerAbsoluteOffset?: number;\n /**\n * Callback, который вызывается при клике по любому месту в пределах экрана.\n */\n onClose?: () => void;\n}\n\ndeclare type ArrowOffsetModifierOptions = {\n offset: number;\n};\ndeclare type ArrowOffsetModifier = Modifier<\n \"arrowOffset\",\n ArrowOffsetModifierOptions\n>;\n\nfunction mapAlignX(x: TooltipProps[\"alignX\"]) {\n switch (x) {\n case \"left\":\n return \"start\";\n case \"right\":\n return \"end\";\n default:\n return \"\";\n }\n}\nfunction getPlacement(\n alignX: TooltipProps[\"alignX\"],\n alignY: TooltipProps[\"alignY\"]\n): Placement {\n return [alignY || \"bottom\", mapAlignX(alignX || \"left\")]\n .filter((p) => !!p)\n .join(\"-\") as Placement;\n}\nfunction isVerticalPlacement(placement: Placement) {\n return placement.startsWith(\"top\") || placement.startsWith(\"bottom\");\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Tooltip\n */\nexport const Tooltip = ({\n children,\n isShown: _isShown = true,\n offsetX = 0,\n offsetY = 15,\n alignX,\n alignY,\n onClose,\n cornerOffset = 0,\n cornerAbsoluteOffset,\n mode = \"accent\",\n ...restProps\n}: TooltipProps) => {\n const { entering } = useNavTransition();\n const isShown = _isShown && !entering;\n const [tooltipRef, setTooltipRef] = React.useState<HTMLElement | null>(null);\n const [tooltipArrowRef, setTooltipArrowRef] =\n React.useState<HTMLElement | null>(null);\n const [target, setTarget] = React.useState<HTMLElement>();\n\n if (IS_DEV) {\n const multiChildren = React.Children.count(children) > 1;\n // Empty children is a noop\n const primitiveChild =\n hasReactNode(children) && typeof children !== \"object\";\n (multiChildren || primitiveChild) &&\n warn(\n [\n \"children должен быть одним React элементом, получено\",\n multiChildren && \"несколько\",\n primitiveChild && JSON.stringify(children),\n ]\n .filter(Boolean)\n .join(\" \"),\n \"error\"\n );\n }\n\n /* eslint-disable no-restricted-properties */\n /* eslint-disable @typescript-eslint/no-unnecessary-type-assertion*/\n const tooltipContainer = React.useMemo(\n () => target?.closest(`[${tooltipContainerAttr}]`) as HTMLDivElement,\n [target]\n );\n const strategy = React.useMemo(\n () => (target?.style.position === \"fixed\" ? \"fixed\" : \"absolute\"),\n [target]\n );\n /* eslint-enable @typescript-eslint/no-unnecessary-type-assertion*/\n /* eslint-enable no-restricted-properties */\n\n if (IS_DEV && target && !tooltipContainer) {\n throw new Error(\n \"Use TooltipContainer for Tooltip outside Panel (see docs)\"\n );\n }\n\n const arrowOffsetModifier = React.useMemo<ArrowOffsetModifier>(() => {\n return {\n name: \"arrowOffset\",\n enabled: true,\n phase: \"main\",\n fn({ state }) {\n if (!state.modifiersData.arrow) {\n return;\n }\n if (isVerticalPlacement(state.placement)) {\n if (cornerAbsoluteOffset !== undefined) {\n state.modifiersData.arrow.x = cornerAbsoluteOffset;\n } else {\n if (state.modifiersData.arrow?.x !== undefined) {\n state.modifiersData.arrow.x += cornerOffset;\n }\n }\n } else {\n if (cornerAbsoluteOffset !== undefined) {\n state.modifiersData.arrow.y = cornerAbsoluteOffset;\n } else {\n if (state.modifiersData.arrow?.y !== undefined) {\n state.modifiersData.arrow.y += cornerOffset;\n }\n }\n }\n },\n };\n }, [cornerOffset, cornerAbsoluteOffset]);\n\n const placement = getPlacement(alignX, alignY);\n const { styles, attributes } = usePopper(target, tooltipRef, {\n strategy,\n placement,\n modifiers: [\n {\n name: \"offset\",\n options: {\n offset: [offsetX, offsetY],\n },\n },\n {\n name: \"arrow\",\n options: {\n element: tooltipArrowRef,\n padding: 14,\n },\n },\n {\n name: \"preventOverflow\",\n },\n {\n name: \"flip\",\n },\n arrowOffsetModifier,\n ],\n });\n\n const { document } = useDOM();\n useGlobalEventListener(document, \"click\", isShown && onClose, {\n passive: true,\n });\n // NOTE: setting isShown to true used to trigger usePopper().forceUpdate()\n\n const childRef =\n React.isValidElement(children) &&\n (isDOMTypeElement(children) ? children.ref : children.props.getRootRef);\n const patchedRef = useExternRef(setTarget, childRef);\n const child = React.isValidElement(children)\n ? React.cloneElement(children, {\n [isDOMTypeElement(children) ? \"ref\" : \"getRootRef\"]: patchedRef,\n })\n : children;\n\n return (\n <React.Fragment>\n {child}\n {isShown &&\n target != null &&\n ReactDOM.createPortal(\n <SimpleTooltip\n {...restProps}\n mode={mode}\n ref={(el) => setTooltipRef(el)}\n arrowRef={(el) => setTooltipArrowRef(el)}\n style={{ arrow: styles.arrow, container: styles.popper }}\n attributes={{\n arrow: attributes.arrow ?? null,\n container: attributes.popper ?? null,\n }}\n />,\n tooltipContainer\n )}\n </React.Fragment>\n );\n};\n"],"file":"Tooltip.js"}
1
+ {"version":3,"sources":["../../../../src/components/Tooltip/Tooltip.tsx"],"names":["React","ReactDOM","classNames","getClassName","Subhead","useNavTransition","PopperArrow","usePopper","tooltipContainerAttr","useExternRef","useDOM","warnOnce","hasReactNode","prefixClass","useGlobalEventListener","isDOMTypeElement","element","isValidElement","type","baseClassName","warn","IS_DEV","process","env","NODE_ENV","SimpleTooltip","forwardRef","ref","appearance","header","text","arrow","style","attributes","container","mapAlignX","x","getPlacement","alignX","alignY","filter","p","join","isVerticalPlacement","placement","startsWith","calculateAppearance","mode","Tooltip","children","isShown","_isShown","offsetX","offsetY","onClose","cornerOffset","cornerAbsoluteOffset","restProps","entering","useState","tooltipRef","setTooltipRef","target","setTarget","multiChildren","Children","count","primitiveChild","JSON","stringify","Boolean","tooltipContainer","useMemo","closest","strategy","position","Error","modifiers","name","options","offset","push","padding","enabled","phase","fn","state","modifiersData","undefined","y","_placement","styles","document","passive","childRef","props","getRootRef","patchedRef","child","cloneElement","_appearance","createPortal","el","popper"],"mappings":";;;;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,QAAP,MAAqB,WAArB;AACA,SAASC,UAAT;AACA,SAASC,YAAT;AACA,SAASC,OAAT;AACA,SAASC,gBAAT;AACA,SAASC,WAAT;AACA,SAAmBC,SAAnB,QAAoC,cAApC;AAEA,SAASC,oBAAT;AACA,SAASC,YAAT;AACA,SAASC,MAAT;AACA,SAASC,QAAT;AACA,SAASC,YAAT;AACA,SAASC,WAAT;AACA,SAASC,sBAAT;AAEA;;AAcA,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB,CACvBC,OADuB,EAEmB;AAC1C,SAAO,aAAAhB,KAAK,CAACiB,cAAN,CAAqBD,OAArB,KAAiC,OAAOA,OAAO,CAACE,IAAf,KAAwB,QAAhE;AACD,CAJD;;AAMA,IAAMC,aAAa,GAAGhB,YAAY,CAAC,SAAD,CAAlC;AACA,IAAMiB,IAAI,GAAGT,QAAQ,CAAC,SAAD,CAArB;AACA,IAAMU,MAAM,GAAGC,OAAO,CAACC,GAAR,CAAYC,QAAZ,KAAyB,aAAxC;AAEA,IAAMC,aAAa,gBAAGzB,KAAK,CAAC0B,UAAN,CACpB,SAASD,aAAT,OAEEE,GAFF,EAGE;AAAA,6BAFEC,UAEF;AAAA,MAFEA,UAEF,gCAFe,QAEf;AAAA,MAFyBC,MAEzB,QAFyBA,MAEzB;AAAA,MAFiCC,IAEjC,QAFiCA,IAEjC;AAAA,MAFuCC,KAEvC,QAFuCA,KAEvC;AAAA,wBAF8CC,KAE9C;AAAA,MAF8CA,KAE9C,2BAFsD,EAEtD;AAAA,MAF0DC,UAE1D,QAF0DA,UAE1D;AACA,SACE;AAAK,IAAA,SAAS,EAAE/B,UAAU,CAACiB,aAAD,qBAA4BS,UAA5B;AAA1B,KACE;AACE,IAAA,SAAS,EAAC,oBADZ;AAEE,IAAA,GAAG,EAAED,GAFP;AAGE,IAAA,KAAK,EAAEK,KAAK,CAACE;AAHf,KAIMD,UAJN,aAIMA,UAJN,uBAIMA,UAAU,CAAEC,SAJlB,GAMGH,KAAK,IACJ,oBAAC,WAAD;AACE,IAAA,KAAK,EAAEC,KAAK,CAACD,KADf;AAEE,IAAA,UAAU,EAAEE,UAAF,aAAEA,UAAF,uBAAEA,UAAU,CAAEF,KAF1B;AAGE,IAAA,cAAc,EAAElB,WAAW,CAAC,gBAAD;AAH7B,IAPJ,EAaE;AAAK,IAAA,SAAS,EAAC;AAAf,KACGgB,MAAM,IACL,oBAAC,OAAD;AAAS,IAAA,MAAM,EAAC,GAAhB;AAAoB,IAAA,SAAS,EAAC;AAA9B,KACGA,MADH,CAFJ,EAMGC,IAAI,IAAI,oBAAC,OAAD;AAAS,IAAA,SAAS,EAAC;AAAnB,KAAoCA,IAApC,CANX,CAbF,CADF,CADF;AA0BD,CA/BmB,CAAtB;;AAwGA,SAASK,SAAT,CAAmBC,CAAnB,EAA8C;AAC5C,UAAQA,CAAR;AACE,SAAK,MAAL;AACE,aAAO,OAAP;;AACF,SAAK,OAAL;AACE,aAAO,KAAP;;AACF;AACE,aAAO,EAAP;AANJ;AAQD;;AACD,SAASC,YAAT,CACEC,MADF,EAEEC,MAFF,EAGa;AACX,SAAO,CAACA,MAAM,IAAI,QAAX,EAAqBJ,SAAS,CAACG,MAAM,IAAI,MAAX,CAA9B,EACJE,MADI,CACG,UAACC,CAAD;AAAA,WAAO,CAAC,CAACA,CAAT;AAAA,GADH,EAEJC,IAFI,CAEC,GAFD,CAAP;AAGD;;AACD,SAASC,mBAAT,CAA6BC,SAA7B,EAAmD;AACjD,SAAOA,SAAS,CAACC,UAAV,CAAqB,KAArB,KAA+BD,SAAS,CAACC,UAAV,CAAqB,QAArB,CAAtC;AACD;AAED;AACA;AACA;AACA;;;AACA,SAASC,mBAAT,CACEC,IADF,EAEEnB,UAFF,EAG8B;AAC5B,MAAIA,UAAJ,EAAgB;AACd,WAAOA,UAAP;AACD;;AAED,SAAOmB,IAAI,KAAK,OAAT,GAAmB,OAAnB,GAA6B,QAApC;AACD;AAED;AACA;AACA;;;AACA,OAAO,IAAMC,OAAO,GAAG,SAAVA,OAAU,QAeH;AAAA;;AAAA,MAdlBC,QAckB,SAdlBA,QAckB;AAAA,4BAblBC,OAakB;AAAA,MAbTC,QAaS,8BAbE,IAaF;AAAA,4BAZlBC,OAYkB;AAAA,MAZlBA,OAYkB,8BAZR,CAYQ;AAAA,4BAXlBC,OAWkB;AAAA,MAXlBA,OAWkB,8BAXR,EAWQ;AAAA,MAVlBf,MAUkB,SAVlBA,MAUkB;AAAA,MATlBC,MASkB,SATlBA,MASkB;AAAA,MARlBe,OAQkB,SARlBA,OAQkB;AAAA,iCAPlBC,YAOkB;AAAA,MAPlBA,YAOkB,mCAPH,CAOG;AAAA,MANlBC,oBAMkB,SANlBA,oBAMkB;AAAA,yBALlBT,IAKkB;AAAA,MALlBA,IAKkB,2BALX,QAKW;AAAA,MAJlBnB,UAIkB,SAJlBA,UAIkB;AAAA,0BAHlBG,KAGkB;AAAA,MAHlBA,KAGkB,4BAHV,IAGU;AAAA,MAFlBa,SAEkB,SAFlBA,SAEkB;AAAA,MADfa,SACe;;AAClB,0BAAqBpD,gBAAgB,EAArC;AAAA,MAAQqD,QAAR,qBAAQA,QAAR;;AACA,MAAMR,OAAO,GAAGC,QAAQ,IAAI,CAACO,QAA7B;;AACA,wBAAoC1D,KAAK,CAAC2D,QAAN,CAAmC,IAAnC,CAApC;AAAA;AAAA,MAAOC,UAAP;AAAA,MAAmBC,aAAnB;;AACA,yBAA4B7D,KAAK,CAAC2D,QAAN,EAA5B;AAAA;AAAA,MAAOG,MAAP;AAAA,MAAeC,SAAf;;AAEA,MAAI1C,MAAJ,EAAY;AACV,QAAM2C,aAAa,GAAGhE,KAAK,CAACiE,QAAN,CAAeC,KAAf,CAAqBjB,QAArB,IAAiC,CAAvD,CADU,CAEV;;AACA,QAAMkB,cAAc,GAClBvD,YAAY,CAACqC,QAAD,CAAZ,IAA0B,QAAOA,QAAP,MAAoB,QADhD;AAEA,KAACe,aAAa,IAAIG,cAAlB,KACE/C,IAAI,CACF,CACE,sDADF,EAEE4C,aAAa,IAAI,WAFnB,EAGEG,cAAc,IAAIC,IAAI,CAACC,SAAL,CAAepB,QAAf,CAHpB,EAKGT,MALH,CAKU8B,OALV,EAMG5B,IANH,CAMQ,GANR,CADE,EAQF,OARE,CADN;AAWD;AAED;;AACA;;;AACA,MAAM6B,gBAAgB,GAAGvE,KAAK,CAACwE,OAAN,CACvB;AAAA,WAAMV,MAAN,aAAMA,MAAN,uBAAMA,MAAM,CAAEW,OAAR,YAAoBjE,oBAApB,OAAN;AAAA,GADuB,EAEvB,CAACsD,MAAD,CAFuB,CAAzB;AAIA,MAAMY,QAAQ,GAAG1E,KAAK,CAACwE,OAAN,CACf;AAAA,WAAO,CAAAV,MAAM,SAAN,IAAAA,MAAM,WAAN,YAAAA,MAAM,CAAE9B,KAAR,CAAc2C,QAAd,MAA2B,OAA3B,GAAqC,OAArC,GAA+C,UAAtD;AAAA,GADe,EAEf,CAACb,MAAD,CAFe,CAAjB;AAIA;;AACA;;AAEA,MAAIzC,MAAM,IAAIyC,MAAV,IAAoB,CAACS,gBAAzB,EAA2C;AACzC,UAAM,IAAIK,KAAJ,CACJ,2DADI,CAAN;AAGD;;AAED,MAAMC,SAAS,GAAG7E,KAAK,CAACwE,OAAN,CAAc,YAAM;AACpC,QAAMK,SAAkC,GAAG,CACzC;AACEC,MAAAA,IAAI,EAAE,QADR;AAEEC,MAAAA,OAAO,EAAE;AACPC,QAAAA,MAAM,EAAE,CAAC5B,OAAD,EAAUC,OAAV;AADD;AAFX,KADyC,EAOzC;AACEyB,MAAAA,IAAI,EAAE;AADR,KAPyC,EAUzC;AACEA,MAAAA,IAAI,EAAE;AADR,KAVyC,CAA3C;;AAeA,QAAI/C,KAAJ,EAAW;AACT8C,MAAAA,SAAS,CAACI,IAAV,CAAe;AACbH,QAAAA,IAAI,EAAE,OADO;AAEbC,QAAAA,OAAO,EAAE;AACPG,UAAAA,OAAO,EAAE;AADF;AAFI,OAAf;AAMAL,MAAAA,SAAS,CAACI,IAAV,CAAe;AACbH,QAAAA,IAAI,EAAE,aADO;AAEbK,QAAAA,OAAO,EAAE,IAFI;AAGbC,QAAAA,KAAK,EAAE,MAHM;AAIbC,QAAAA,EAJa,qBAIC;AAAA,cAATC,KAAS,SAATA,KAAS;;AACZ,cAAI,CAACA,KAAK,CAACC,aAAN,CAAoBxD,KAAzB,EAAgC;AAC9B;AACD;;AACD,cAAIY,mBAAmB,CAAC2C,KAAK,CAAC1C,SAAP,CAAvB,EAA0C;AACxC,gBAAIY,oBAAoB,KAAKgC,SAA7B,EAAwC;AACtCF,cAAAA,KAAK,CAACC,aAAN,CAAoBxD,KAApB,CAA0BK,CAA1B,GAA8BoB,oBAA9B;AACD,aAFD,MAEO;AAAA;;AACL,kBAAI,0BAAA8B,KAAK,CAACC,aAAN,CAAoBxD,KAApB,gFAA2BK,CAA3B,MAAiCoD,SAArC,EAAgD;AAC9CF,gBAAAA,KAAK,CAACC,aAAN,CAAoBxD,KAApB,CAA0BK,CAA1B,IAA+BmB,YAA/B;AACD;AACF;AACF,WARD,MAQO;AACL,gBAAIC,oBAAoB,KAAKgC,SAA7B,EAAwC;AACtCF,cAAAA,KAAK,CAACC,aAAN,CAAoBxD,KAApB,CAA0B0D,CAA1B,GAA8BjC,oBAA9B;AACD,aAFD,MAEO;AAAA;;AACL,kBAAI,2BAAA8B,KAAK,CAACC,aAAN,CAAoBxD,KAApB,kFAA2B0D,CAA3B,MAAiCD,SAArC,EAAgD;AAC9CF,gBAAAA,KAAK,CAACC,aAAN,CAAoBxD,KAApB,CAA0B0D,CAA1B,IAA+BlC,YAA/B;AACD;AACF;AACF;AACF;AAzBY,OAAf;AA2BD;;AAED,WAAOsB,SAAP;AACD,GArDiB,EAqDf,CAAC9C,KAAD,EAAQyB,oBAAR,EAA8BD,YAA9B,EAA4CH,OAA5C,EAAqDC,OAArD,CArDe,CAAlB;;AAuDA,MAAMqC,UAAU,GAAG9C,SAAH,aAAGA,SAAH,cAAGA,SAAH,GAAgBP,YAAY,CAACC,MAAD,EAASC,MAAT,CAA5C;;AACA,mBAA+BhC,SAAS,CAACuD,MAAD,EAASF,UAAT,EAAqB;AAC3Dc,IAAAA,QAAQ,EAARA,QAD2D;AAE3D9B,IAAAA,SAAS,EAAE8C,UAFgD;AAG3Db,IAAAA,SAAS,EAATA;AAH2D,GAArB,CAAxC;AAAA,MAAQc,MAAR,cAAQA,MAAR;AAAA,MAAgB1D,UAAhB,cAAgBA,UAAhB;;AAMA,gBAAqBvB,MAAM,EAA3B;AAAA,MAAQkF,QAAR,WAAQA,QAAR;;AACA9E,EAAAA,sBAAsB,CAAC8E,QAAD,EAAW,OAAX,EAAoB1C,OAAO,IAAII,OAA/B,EAAwC;AAC5DuC,IAAAA,OAAO,EAAE;AADmD,GAAxC,CAAtB,CA1GkB,CA6GlB;;AAEA,MAAMC,QAAQ,GACZ,aAAA9F,KAAK,CAACiB,cAAN,CAAqBgC,QAArB,MACClC,gBAAgB,CAACkC,QAAD,CAAhB,GAA6BA,QAAQ,CAACtB,GAAtC,GAA4CsB,QAAQ,CAAC8C,KAAT,CAAeC,UAD5D,CADF;AAGA,MAAMC,UAAU,GAAGxF,YAAY,CAACsD,SAAD,EAAY+B,QAAZ,CAA/B;AACA,MAAMI,KAAK,GAAG,aAAAlG,KAAK,CAACiB,cAAN,CAAqBgC,QAArB,iBACVjD,KAAK,CAACmG,YAAN,CAAmBlD,QAAnB,sBACGlC,gBAAgB,CAACkC,QAAD,CAAhB,GAA6B,KAA7B,GAAqC,YADxC,EACuDgD,UADvD,EADU,GAIVhD,QAJJ;;AAMA,MAAMmD,WAAW,GAAGtD,mBAAmB,CAACC,IAAD,EAAOnB,UAAP,CAAvC;;AAEA,SACE,oBAAC,KAAD,CAAO,QAAP,QACGsE,KADH,EAEGhD,OAAO,IACNY,MAAM,IAAI,IADX,iBAEC7D,QAAQ,CAACoG,YAAT,CACE,oBAAC,aAAD,eACM5C,SADN;AAEE,IAAA,UAAU,EAAE2C,WAFd;AAGE,IAAA,KAAK,EAAErE,KAHT;AAIE,IAAA,GAAG,EAAE,aAACuE,EAAD;AAAA,aAAQzC,aAAa,CAACyC,EAAD,CAArB;AAAA,KAJP;AAKE,IAAA,KAAK,EAAE;AAAEvE,MAAAA,KAAK,EAAE4D,MAAM,CAAC5D,KAAhB;AAAuBG,MAAAA,SAAS,EAAEyD,MAAM,CAACY;AAAzC,KALT;AAME,IAAA,UAAU,EAAE;AACVxE,MAAAA,KAAK,uBAAEE,UAAU,CAACF,KAAb,iEAAsB,IADjB;AAEVG,MAAAA,SAAS,wBAAED,UAAU,CAACsE,MAAb,mEAAuB;AAFtB;AANd,KADF,EAYEhC,gBAZF,CAJJ,CADF;AAqBD,CA/JM","sourcesContent":["import * as React from \"react\";\nimport ReactDOM from \"react-dom\";\nimport { classNames } from \"../../lib/classNames\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { Subhead } from \"../Typography/Subhead/Subhead\";\nimport { useNavTransition } from \"../NavTransitionContext/NavTransitionContext\";\nimport { PopperArrow } from \"../PopperArrow/PopperArrow\";\nimport { Modifier, usePopper } from \"react-popper\";\nimport { Placement } from \"@popperjs/core\";\nimport { tooltipContainerAttr } from \"./TooltipContainer\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { useDOM } from \"../../lib/dom\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport { prefixClass } from \"../../lib/prefixClass\";\nimport { useGlobalEventListener } from \"../../hooks/useGlobalEventListener\";\nimport { HasRootRef } from \"../../types\";\nimport \"./Tooltip.css\";\n\ninterface SimpleTooltipProps extends Partial<TooltipProps> {\n target?: HTMLDivElement;\n style?: {\n arrow: React.CSSProperties;\n container: React.CSSProperties;\n };\n attributes?: {\n arrow: React.HTMLAttributes<HTMLDivElement> | null;\n container: React.HTMLAttributes<HTMLDivElement> | null;\n };\n}\n\nconst isDOMTypeElement = (\n element: React.ReactElement\n): element is React.DOMElement<any, any> => {\n return React.isValidElement(element) && typeof element.type === \"string\";\n};\n\nconst baseClassName = getClassName(\"Tooltip\");\nconst warn = warnOnce(\"Tooltip\");\nconst IS_DEV = process.env.NODE_ENV === \"development\";\n\nconst SimpleTooltip = React.forwardRef<HTMLDivElement, SimpleTooltipProps>(\n function SimpleTooltip(\n { appearance = \"accent\", header, text, arrow, style = {}, attributes },\n ref\n ) {\n return (\n <div vkuiClass={classNames(baseClassName, `Tooltip--${appearance}`)}>\n <div\n vkuiClass=\"Tooltip__container\"\n ref={ref}\n style={style.container}\n {...attributes?.container}\n >\n {arrow && (\n <PopperArrow\n style={style.arrow}\n attributes={attributes?.arrow}\n arrowClassName={prefixClass(\"Tooltip__arrow\")}\n />\n )}\n <div vkuiClass=\"Tooltip__content\">\n {header && (\n <Subhead weight=\"2\" vkuiClass=\"Tooltip__title\">\n {header}\n </Subhead>\n )}\n {text && <Subhead vkuiClass=\"Tooltip__text\">{text}</Subhead>}\n </div>\n </div>\n </div>\n );\n }\n);\n\nexport interface TooltipProps {\n /**\n * **Важно**: если в `children` передан React-компонент, то необходимо убедиться в том, что он поддерживает\n * свойство `getRootRef`, которое должно возвращаться ссылку на корневой DOM-элемент компонента,\n * иначе тултип показан не будет. Если передан React-element, то такой проблемы нет.\n */\n children:\n | React.ReactElement<HasRootRef<any>>\n | React.ReactElement<React.PropsWithRef<any>>;\n /**\n * @deprecated будет удалено в 5.0.0, устанавливать стиль следует через appearance\n * Стиль отображения подсказки\n */\n mode?: \"accent\" | \"light\";\n /**\n * Стиль отображения подсказки\n */\n appearance?: \"accent\" | \"neutral\" | \"white\" | \"black\" | \"inversion\";\n /**\n * Если передан `false`, то рисуется просто `children`.\n */\n isShown?: boolean;\n /**\n * Текст тултипа.\n */\n text?: React.ReactNode;\n /**\n * Заголовок тултипа.\n */\n header?: React.ReactNode;\n /**\n * Положение по горизонтали (прижатие к левому или правому краю `children`).\n * Если не задано, позиция по горизонтали определятся автоматически\n */\n alignX?: \"center\" | \"left\" | \"right\";\n /**\n * Положение по вертикали (расположение над или под `children`).\n * Если не задано, позиция по вертикали определятся автоматически\n */\n alignY?: \"top\" | \"bottom\";\n /**\n * Сдвиг по горизонтали (относительно портала, в котором рисуется тултип).\n */\n offsetX?: number;\n /**\n * Сдвиг по вертикали (относительно портала, в котором рисуется тултип).\n */\n offsetY?: number;\n /**\n * Отображать ли стрелку, указывающую на якорный элемент\n */\n arrow?: boolean;\n /**\n * Сдвиг стрелочки относительно центра дочернего элемента.\n */\n cornerOffset?: number;\n /**\n * Сдвиг стрелочки относительно ширины тултипа\n */\n cornerAbsoluteOffset?: number;\n /**\n * Callback, который вызывается при клике по любому месту в пределах экрана.\n */\n onClose?: () => void;\n /**\n * По умолчанию компонент выберет наилучшее расположение сам. Но его можно задать извне с помощью этого свойства\n */\n placement?: Placement;\n}\n\nfunction mapAlignX(x: TooltipProps[\"alignX\"]) {\n switch (x) {\n case \"left\":\n return \"start\";\n case \"right\":\n return \"end\";\n default:\n return \"\";\n }\n}\nfunction getPlacement(\n alignX: TooltipProps[\"alignX\"],\n alignY: TooltipProps[\"alignY\"]\n): Placement {\n return [alignY || \"bottom\", mapAlignX(alignX || \"left\")]\n .filter((p) => !!p)\n .join(\"-\") as Placement;\n}\nfunction isVerticalPlacement(placement: Placement) {\n return placement.startsWith(\"top\") || placement.startsWith(\"bottom\");\n}\n\n/**\n * Вычисляем стиль подсказки: параметр appearance имеет приоритет, иначе мапим mode на подходящее значение из appearance\n * TODO: v5 избавиться от пропа mode и этого метода, для appearance по умолчанию сделать \"accent\"\n */\nfunction calculateAppearance(\n mode: TooltipProps[\"mode\"],\n appearance: TooltipProps[\"appearance\"]\n): TooltipProps[\"appearance\"] {\n if (appearance) {\n return appearance;\n }\n\n return mode === \"light\" ? \"white\" : \"accent\";\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Tooltip\n */\nexport const Tooltip = ({\n children,\n isShown: _isShown = true,\n offsetX = 0,\n offsetY = 15,\n alignX,\n alignY,\n onClose,\n cornerOffset = 0,\n cornerAbsoluteOffset,\n mode = \"accent\",\n appearance,\n arrow = true,\n placement,\n ...restProps\n}: TooltipProps) => {\n const { entering } = useNavTransition();\n const isShown = _isShown && !entering;\n const [tooltipRef, setTooltipRef] = React.useState<HTMLElement | null>(null);\n const [target, setTarget] = React.useState<HTMLElement>();\n\n if (IS_DEV) {\n const multiChildren = React.Children.count(children) > 1;\n // Empty children is a noop\n const primitiveChild =\n hasReactNode(children) && typeof children !== \"object\";\n (multiChildren || primitiveChild) &&\n warn(\n [\n \"children должен быть одним React элементом, получено\",\n multiChildren && \"несколько\",\n primitiveChild && JSON.stringify(children),\n ]\n .filter(Boolean)\n .join(\" \"),\n \"error\"\n );\n }\n\n /* eslint-disable no-restricted-properties */\n /* eslint-disable @typescript-eslint/no-unnecessary-type-assertion*/\n const tooltipContainer = React.useMemo(\n () => target?.closest(`[${tooltipContainerAttr}]`) as HTMLDivElement,\n [target]\n );\n const strategy = React.useMemo(\n () => (target?.style.position === \"fixed\" ? \"fixed\" : \"absolute\"),\n [target]\n );\n /* eslint-enable @typescript-eslint/no-unnecessary-type-assertion*/\n /* eslint-enable no-restricted-properties */\n\n if (IS_DEV && target && !tooltipContainer) {\n throw new Error(\n \"Use TooltipContainer for Tooltip outside Panel (see docs)\"\n );\n }\n\n const modifiers = React.useMemo(() => {\n const modifiers: Array<Modifier<string>> = [\n {\n name: \"offset\",\n options: {\n offset: [offsetX, offsetY],\n },\n },\n {\n name: \"preventOverflow\",\n },\n {\n name: \"flip\",\n },\n ];\n\n if (arrow) {\n modifiers.push({\n name: \"arrow\",\n options: {\n padding: 14,\n },\n });\n modifiers.push({\n name: \"arrowOffset\",\n enabled: true,\n phase: \"main\",\n fn({ state }) {\n if (!state.modifiersData.arrow) {\n return;\n }\n if (isVerticalPlacement(state.placement)) {\n if (cornerAbsoluteOffset !== undefined) {\n state.modifiersData.arrow.x = cornerAbsoluteOffset;\n } else {\n if (state.modifiersData.arrow?.x !== undefined) {\n state.modifiersData.arrow.x += cornerOffset;\n }\n }\n } else {\n if (cornerAbsoluteOffset !== undefined) {\n state.modifiersData.arrow.y = cornerAbsoluteOffset;\n } else {\n if (state.modifiersData.arrow?.y !== undefined) {\n state.modifiersData.arrow.y += cornerOffset;\n }\n }\n }\n },\n });\n }\n\n return modifiers;\n }, [arrow, cornerAbsoluteOffset, cornerOffset, offsetX, offsetY]);\n\n const _placement = placement ?? getPlacement(alignX, alignY);\n const { styles, attributes } = usePopper(target, tooltipRef, {\n strategy,\n placement: _placement,\n modifiers,\n });\n\n const { document } = useDOM();\n useGlobalEventListener(document, \"click\", isShown && onClose, {\n passive: true,\n });\n // NOTE: setting isShown to true used to trigger usePopper().forceUpdate()\n\n const childRef =\n React.isValidElement(children) &&\n (isDOMTypeElement(children) ? children.ref : children.props.getRootRef);\n const patchedRef = useExternRef(setTarget, childRef);\n const child = React.isValidElement(children)\n ? React.cloneElement(children, {\n [isDOMTypeElement(children) ? \"ref\" : \"getRootRef\"]: patchedRef,\n })\n : children;\n\n const _appearance = calculateAppearance(mode, appearance);\n\n return (\n <React.Fragment>\n {child}\n {isShown &&\n target != null &&\n ReactDOM.createPortal(\n <SimpleTooltip\n {...restProps}\n appearance={_appearance}\n arrow={arrow}\n ref={(el) => setTooltipRef(el)}\n style={{ arrow: styles.arrow, container: styles.popper }}\n attributes={{\n arrow: attributes.arrow ?? null,\n container: attributes.popper ?? null,\n }}\n />,\n tooltipContainer\n )}\n </React.Fragment>\n );\n};\n"],"file":"Tooltip.js"}
@@ -1 +1 @@
1
- .vkuiCaption{display:block;margin:0}.vkuiCaption--caps{text-transform:uppercase}.vkuiCaption--l-1{font-size:13px;font-size:var(--vkui--font_footnote--font_size--regular,13px);line-height:16px;line-height:var(--vkui--font_footnote--line_height--regular,16px);font-weight:400;font-weight:var(--vkui--font_footnote--font_weight--regular,400)}.vkuiCaption--l-1.vkuiCaption--caps{font-size:13px;font-size:var(--vkui--font_footnote_caps--font_size--regular,13px);line-height:16px;line-height:var(--vkui--font_footnote_caps--line_height--regular,16px);font-weight:400;font-weight:var(--vkui--font_footnote_caps--font_weight--regular,400)}.vkuiCaption--l-2{font-size:12px;font-size:var(--vkui--font_caption1--font_size--regular,12px);line-height:14px;line-height:var(--vkui--font_caption1--line_height--regular,14px);font-weight:400;font-weight:var(--vkui--font_caption1--font_weight--regular,400)}.vkuiCaption--l-2.vkuiCaption--caps{font-size:12px;font-size:var(--vkui--font_caption1_caps--font_size--regular,12px);line-height:14px;line-height:var(--vkui--font_caption1_caps--line_height--regular,14px);font-weight:600;font-weight:var(--vkui--font_caption1_caps--font_weight--regular,600)}.vkuiCaption--l-3{font-size:11px;font-size:var(--vkui--font_caption2--font_size--regular,11px);line-height:14px;line-height:var(--vkui--font_caption2--line_height--regular,14px);font-weight:400;font-weight:var(--vkui--font_caption2--font_weight--regular,400)}.vkuiCaption--l-3.vkuiCaption--caps{font-size:11px;font-size:var(--vkui--font_caption2_caps--font_size--regular,11px);line-height:14px;line-height:var(--vkui--font_caption2_caps--line_height--regular,14px);font-weight:600;font-weight:var(--vkui--font_caption2_caps--font_weight--regular,600)}.vkuiCaption--l-4{font-size:9px;font-size:var(--vkui--font_caption3--font_size--regular,9px);line-height:12px;line-height:var(--vkui--font_caption3--line_height--regular,12px);font-weight:400;font-weight:var(--vkui--font_caption3--font_weight--regular,400)}.vkuiCaption--l-4.vkuiCaption--caps{font-size:9px;font-size:var(--vkui--font_caption3_caps--font_size--regular,9px);line-height:12px;line-height:var(--vkui--font_caption3_caps--line_height--regular,12px);font-weight:600;font-weight:var(--vkui--font_caption3_caps--font_weight--regular,600)}.vkuiCaption.vkuiCaption--w-1{font-weight:600;font-weight:var(--vkui--font_weight_accent1,600)}.vkuiCaption.vkuiCaption--w-2{font-weight:500;font-weight:var(--vkui--font_weight_accent2,500)}.vkuiCaption.vkuiCaption--w-3{font-weight:400;font-weight:var(--vkui--font_weight_accent3,400)}.vkuiCaption--w-regular{font-weight:400}.vkuiCaption--w-medium{font-weight:500}.vkuiCaption--w-semibold{font-weight:600}.vkuiCaption--w-bold{font-weight:700}
1
+ .vkuiCaption{display:block;margin:0}.vkuiCaption--caps{text-transform:uppercase}.vkuiCaption--l-1{font-size:13px;font-size:var(--vkui--font_footnote--font_size--regular,13px);font-weight:400;font-weight:var(--vkui--font_footnote--font_weight--regular,400);line-height:16px;line-height:var(--vkui--font_footnote--line_height--regular,16px)}.vkuiCaption--l-1.vkuiCaption--caps{font-size:13px;font-size:var(--vkui--font_footnote_caps--font_size--regular,13px);font-weight:400;font-weight:var(--vkui--font_footnote_caps--font_weight--regular,400);line-height:16px;line-height:var(--vkui--font_footnote_caps--line_height--regular,16px)}.vkuiCaption--l-2{font-size:12px;font-size:var(--vkui--font_caption1--font_size--regular,12px);font-weight:400;font-weight:var(--vkui--font_caption1--font_weight--regular,400);line-height:14px;line-height:var(--vkui--font_caption1--line_height--regular,14px)}.vkuiCaption--l-2.vkuiCaption--caps{font-size:12px;font-size:var(--vkui--font_caption1_caps--font_size--regular,12px);font-weight:600;font-weight:var(--vkui--font_caption1_caps--font_weight--regular,600);line-height:14px;line-height:var(--vkui--font_caption1_caps--line_height--regular,14px)}.vkuiCaption--l-3{font-size:11px;font-size:var(--vkui--font_caption2--font_size--regular,11px);font-weight:400;font-weight:var(--vkui--font_caption2--font_weight--regular,400);line-height:14px;line-height:var(--vkui--font_caption2--line_height--regular,14px)}.vkuiCaption--l-3.vkuiCaption--caps{font-size:11px;font-size:var(--vkui--font_caption2_caps--font_size--regular,11px);font-weight:600;font-weight:var(--vkui--font_caption2_caps--font_weight--regular,600);line-height:14px;line-height:var(--vkui--font_caption2_caps--line_height--regular,14px)}.vkuiCaption--l-4{font-size:9px;font-size:var(--vkui--font_caption3--font_size--regular,9px);font-weight:400;font-weight:var(--vkui--font_caption3--font_weight--regular,400);line-height:12px;line-height:var(--vkui--font_caption3--line_height--regular,12px)}.vkuiCaption--l-4.vkuiCaption--caps{font-size:9px;font-size:var(--vkui--font_caption3_caps--font_size--regular,9px);font-weight:600;font-weight:var(--vkui--font_caption3_caps--font_weight--regular,600);line-height:12px;line-height:var(--vkui--font_caption3_caps--line_height--regular,12px)}.vkuiCaption.vkuiCaption--w-1{font-weight:600;font-weight:var(--vkui--font_weight_accent1,600)}.vkuiCaption.vkuiCaption--w-2{font-weight:500;font-weight:var(--vkui--font_weight_accent2,500)}.vkuiCaption.vkuiCaption--w-3{font-weight:400;font-weight:var(--vkui--font_weight_accent3,400)}.vkuiCaption--w-regular{font-weight:400}.vkuiCaption--w-medium{font-weight:500}.vkuiCaption--w-semibold{font-weight:600}.vkuiCaption--w-bold{font-weight:700}
@@ -1 +1 @@
1
- .vkuiFootnote{display:block;margin:0;font-size:13px;font-size:var(--vkui--font_footnote--font_size--regular,13px);line-height:16px;line-height:var(--vkui--font_footnote--line_height--regular,16px);font-weight:400;font-weight:var(--vkui--font_footnote--font_weight--regular,400)}.vkuiFootnote--caps{font-size:13px;font-size:var(--vkui--font_footnote_caps--font_size--regular,13px);line-height:16px;line-height:var(--vkui--font_footnote_caps--line_height--regular,16px);font-weight:400;font-weight:var(--vkui--font_footnote_caps--font_weight--regular,400);text-transform:uppercase}.vkuiFootnote--w-1{font-weight:600;font-weight:var(--vkui--font_weight_accent1,600)}.vkuiFootnote--w-2{font-weight:500;font-weight:var(--vkui--font_weight_accent2,500)}.vkuiFootnote--w-3{font-weight:400;font-weight:var(--vkui--font_weight_accent3,400)}
1
+ .vkuiFootnote{display:block;font-size:13px;font-size:var(--vkui--font_footnote--font_size--regular,13px);font-weight:400;font-weight:var(--vkui--font_footnote--font_weight--regular,400);line-height:16px;line-height:var(--vkui--font_footnote--line_height--regular,16px);margin:0}.vkuiFootnote--caps{font-size:13px;font-size:var(--vkui--font_footnote_caps--font_size--regular,13px);font-weight:400;font-weight:var(--vkui--font_footnote_caps--font_weight--regular,400);line-height:16px;line-height:var(--vkui--font_footnote_caps--line_height--regular,16px);text-transform:uppercase}.vkuiFootnote--w-1{font-weight:600;font-weight:var(--vkui--font_weight_accent1,600)}.vkuiFootnote--w-2{font-weight:500;font-weight:var(--vkui--font_weight_accent2,500)}.vkuiFootnote--w-3{font-weight:400;font-weight:var(--vkui--font_weight_accent3,400)}
@@ -1 +1 @@
1
- .vkuiHeadline{display:block;margin:0}.vkuiHeadline--l-1{font-size:16px;font-size:var(--vkui--font_headline1--font_size--regular,16px);line-height:20px;line-height:var(--vkui--font_headline1--line_height--regular,20px);font-weight:500;font-weight:var(--vkui--font_headline1--font_weight--regular,500)}.vkuiHeadline--l-2{font-size:15px;font-size:var(--vkui--font_headline2--font_size--regular,15px);line-height:20px;line-height:var(--vkui--font_headline2--line_height--regular,20px);font-weight:500;font-weight:var(--vkui--font_headline2--font_weight--regular,500)}.vkuiHeadline--sizeY-compact.vkuiHeadline--l-1{font-size:15px;font-size:var(--vkui--font_headline1--font_size--compact,15px);line-height:20px;line-height:var(--vkui--font_headline1--line_height--compact,20px)}.vkuiHeadline--sizeY-compact.vkuiHeadline--l-2{font-size:14px;font-size:var(--vkui--font_headline2--font_size--compact,14px);line-height:20px;line-height:var(--vkui--font_headline2--line_height--compact,20px)}.vkuiHeadline--w-regular{font-weight:400}.vkuiHeadline--w-medium{font-weight:500}.vkuiHeadline--w-semibold{font-weight:600}.vkuiHeadline--android.vkuiHeadline--w-semibold{font-weight:500}.vkuiHeadline--w-1{font-weight:600;font-weight:var(--vkui--font_weight_accent1,600)}.vkuiHeadline--w-2{font-weight:500;font-weight:var(--vkui--font_weight_accent2,500)}.vkuiHeadline--w-3{font-weight:400;font-weight:var(--vkui--font_weight_accent3,400)}
1
+ .vkuiHeadline{display:block;margin:0}.vkuiHeadline--l-1{font-size:16px;font-size:var(--vkui--font_headline1--font_size--regular,16px);font-weight:500;font-weight:var(--vkui--font_headline1--font_weight--regular,500);line-height:20px;line-height:var(--vkui--font_headline1--line_height--regular,20px)}.vkuiHeadline--l-2{font-size:15px;font-size:var(--vkui--font_headline2--font_size--regular,15px);font-weight:500;font-weight:var(--vkui--font_headline2--font_weight--regular,500);line-height:20px;line-height:var(--vkui--font_headline2--line_height--regular,20px)}.vkuiHeadline--sizeY-compact.vkuiHeadline--l-1{font-size:15px;font-size:var(--vkui--font_headline1--font_size--compact,15px);line-height:20px;line-height:var(--vkui--font_headline1--line_height--compact,20px)}.vkuiHeadline--sizeY-compact.vkuiHeadline--l-2{font-size:14px;font-size:var(--vkui--font_headline2--font_size--compact,14px);line-height:20px;line-height:var(--vkui--font_headline2--line_height--compact,20px)}.vkuiHeadline--w-regular{font-weight:400}.vkuiHeadline--w-medium{font-weight:500}.vkuiHeadline--w-semibold{font-weight:600}.vkuiHeadline--android.vkuiHeadline--w-semibold{font-weight:500}.vkuiHeadline--w-1{font-weight:600;font-weight:var(--vkui--font_weight_accent1,600)}.vkuiHeadline--w-2{font-weight:500;font-weight:var(--vkui--font_weight_accent2,500)}.vkuiHeadline--w-3{font-weight:400;font-weight:var(--vkui--font_weight_accent3,400)}
@@ -1,7 +1,7 @@
1
1
  import * as React from "react";
2
- import { HasComponent } from "../../../types";
2
+ import { HasComponent, HasRootRef } from "../../../types";
3
3
  import "./Headline.css";
4
- export interface HeadlineProps extends React.AllHTMLAttributes<HTMLElement>, HasComponent {
4
+ export interface HeadlineProps extends React.AllHTMLAttributes<HTMLElement>, HasRootRef<HTMLElement>, HasComponent {
5
5
  /**
6
6
  * Задаёт начертание шрифта отличное от стандартного.
7
7
  *
@@ -13,4 +13,4 @@ export interface HeadlineProps extends React.AllHTMLAttributes<HTMLElement>, Has
13
13
  /**
14
14
  * @see https://vkcom.github.io/VKUI/#/Headline
15
15
  */
16
- export declare const Headline: ({ children, weight, level, Component, ...restProps }: HeadlineProps) => JSX.Element;
16
+ export declare const Headline: ({ children, weight, level, Component, getRootRef, ...restProps }: HeadlineProps) => JSX.Element;