@vkontakte/vkui 4.34.0 → 4.35.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (690) hide show
  1. package/.browserslistrc +5 -0
  2. package/.cache/.eslintcache +1 -1
  3. package/.cache/.stylelintcache +1 -1
  4. package/.cache/.tsbuildinfo +291 -268
  5. package/.cache/ts/src/components/ActionSheetItem/ActionSheetItem.d.ts +1 -1
  6. package/.cache/ts/src/components/AppRoot/AppRoot.d.ts +1 -1
  7. package/.cache/ts/src/components/Button/Button.d.ts +1 -1
  8. package/.cache/ts/src/components/CardGrid/CardGrid.d.ts +1 -1
  9. package/.cache/ts/src/components/Checkbox/Checkbox.d.ts +1 -1
  10. package/.cache/ts/src/components/ChipsSelect/ChipsSelect.d.ts +1 -1
  11. package/.cache/ts/src/components/ConfigProvider/ConfigProviderContext.d.ts +1 -0
  12. package/.cache/ts/src/components/CustomSelect/CustomSelect.d.ts +1 -1
  13. package/.cache/ts/src/components/CustomSelectDropdown/CustomSelectDropdown.d.ts +2 -1
  14. package/.cache/ts/src/components/DatePicker/DatePicker.d.ts +1 -1
  15. package/.cache/ts/src/components/Dropdown/Dropdown.d.ts +46 -5
  16. package/.cache/ts/src/components/Epic/Epic.d.ts +1 -1
  17. package/.cache/ts/src/components/FocusTrap/FocusTrap.d.ts +1 -1
  18. package/.cache/ts/src/components/Group/Group.d.ts +1 -1
  19. package/.cache/ts/src/components/HorizontalScroll/HorizontalScroll.d.ts +1 -1
  20. package/.cache/ts/src/components/IconButton/IconButton.d.ts +1 -1
  21. package/.cache/ts/src/components/Input/Input.d.ts +1 -1
  22. package/.cache/ts/src/components/ModalCard/ModalCard.d.ts +1 -1
  23. package/.cache/ts/src/components/ModalCardBase/ModalCardBase.d.ts +1 -1
  24. package/.cache/ts/src/components/ModalPage/ModalPage.d.ts +1 -1
  25. package/.cache/ts/src/components/ModalRoot/ModalRoot.d.ts +1 -1
  26. package/.cache/ts/src/components/ModalRoot/ModalRootAdaptive.d.ts +1 -1
  27. package/.cache/ts/src/components/ModalRoot/ModalRootDesktop.d.ts +1 -1
  28. package/.cache/ts/src/components/NativeSelect/NativeSelect.d.ts +1 -1
  29. package/.cache/ts/src/components/Panel/Panel.d.ts +1 -1
  30. package/.cache/ts/src/components/PanelHeader/PanelHeader.d.ts +1 -1
  31. package/.cache/ts/src/components/PanelHeaderBack/PanelHeaderBack.d.ts +1 -1
  32. package/.cache/ts/src/components/PopoutRoot/PopoutRoot.d.ts +1 -1
  33. package/.cache/ts/src/components/Popper/Popper.d.ts +18 -1
  34. package/.cache/ts/src/components/PopperArrow/PopperArrow.d.ts +8 -0
  35. package/.cache/ts/src/components/Radio/Radio.d.ts +1 -1
  36. package/.cache/ts/src/components/RangeSlider/UniversalSlider.d.ts +1 -1
  37. package/.cache/ts/src/components/RichCell/RichCell.d.ts +1 -1
  38. package/.cache/ts/src/components/RichTooltip/RichTooltip.d.ts +7 -2
  39. package/.cache/ts/src/components/Search/Search.d.ts +1 -1
  40. package/.cache/ts/src/components/Select/Select.d.ts +1 -1
  41. package/.cache/ts/src/components/SelectMimicry/SelectMimicry.d.ts +1 -1
  42. package/.cache/ts/src/components/SimpleCell/SimpleCell.d.ts +1 -1
  43. package/.cache/ts/src/components/Snackbar/Snackbar.d.ts +5 -1
  44. package/.cache/ts/src/components/SplitCol/SplitCol.d.ts +1 -0
  45. package/.cache/ts/src/components/Tabbar/Tabbar.d.ts +8 -1
  46. package/.cache/ts/src/components/Tabs/Tabs.d.ts +14 -3
  47. package/.cache/ts/src/components/TabsItem/TabsItem.d.ts +22 -1
  48. package/.cache/ts/src/components/Tappable/Tappable.d.ts +1 -1
  49. package/.cache/ts/src/components/TextTooltip/TextTooltip.d.ts +5 -1
  50. package/.cache/ts/src/components/Textarea/Textarea.d.ts +4 -1
  51. package/.cache/ts/src/components/Tooltip/Tooltip.d.ts +18 -1
  52. package/.cache/ts/src/components/Typography/Headline/Headline.d.ts +3 -3
  53. package/.cache/ts/src/components/View/View.d.ts +2 -18
  54. package/.cache/ts/src/components/View/ViewInfinite.d.ts +1 -1
  55. package/.cache/ts/src/components/WriteBar/WriteBar.d.ts +5 -1
  56. package/.cache/ts/src/hoc/withAdaptivity.d.ts +1 -1
  57. package/.cache/ts/src/hoc/withContext.d.ts +1 -1
  58. package/.cache/ts/src/hoc/withPlatform.d.ts +1 -1
  59. package/.cache/ts/src/tokenized/index.d.ts +26 -0
  60. package/.eslintrc.json +14 -4
  61. package/dist/cjs/components/AppRoot/AppRoot.js +13 -15
  62. package/dist/cjs/components/AppRoot/AppRoot.js.map +1 -1
  63. package/dist/cjs/components/Button/Button.js +6 -4
  64. package/dist/cjs/components/Button/Button.js.map +1 -1
  65. package/dist/cjs/components/CardScroll/CardScroll.js +3 -1
  66. package/dist/cjs/components/CardScroll/CardScroll.js.map +1 -1
  67. package/dist/cjs/components/ChipsSelect/ChipsSelect.js +5 -0
  68. package/dist/cjs/components/ChipsSelect/ChipsSelect.js.map +1 -1
  69. package/dist/cjs/components/ConfigProvider/ConfigProviderContext.js +7 -1
  70. package/dist/cjs/components/ConfigProvider/ConfigProviderContext.js.map +1 -1
  71. package/dist/cjs/components/CustomSelect/CustomSelect.js +477 -553
  72. package/dist/cjs/components/CustomSelect/CustomSelect.js.map +1 -1
  73. package/dist/cjs/components/CustomSelectDropdown/CustomSelectDropdown.js +73 -35
  74. package/dist/cjs/components/CustomSelectDropdown/CustomSelectDropdown.js.map +1 -1
  75. package/dist/cjs/components/Dropdown/Dropdown.js +147 -26
  76. package/dist/cjs/components/Dropdown/Dropdown.js.map +1 -1
  77. package/dist/cjs/components/Epic/Epic.js +1 -6
  78. package/dist/cjs/components/Epic/Epic.js.map +1 -1
  79. package/dist/cjs/components/FocusTrap/FocusTrap.js +9 -10
  80. package/dist/cjs/components/FocusTrap/FocusTrap.js.map +1 -1
  81. package/dist/cjs/components/FormField/FormField.js +4 -10
  82. package/dist/cjs/components/FormField/FormField.js.map +1 -1
  83. package/dist/cjs/components/HorizontalCell/HorizontalCell.js +4 -7
  84. package/dist/cjs/components/HorizontalCell/HorizontalCell.js.map +1 -1
  85. package/dist/cjs/components/HorizontalScroll/HorizontalScroll.js +1 -0
  86. package/dist/cjs/components/HorizontalScroll/HorizontalScroll.js.map +1 -1
  87. package/dist/cjs/components/Input/Input.js +3 -6
  88. package/dist/cjs/components/Input/Input.js.map +1 -1
  89. package/dist/cjs/components/MiniInfoCell/MiniInfoCell.js +2 -2
  90. package/dist/cjs/components/MiniInfoCell/MiniInfoCell.js.map +1 -1
  91. package/dist/cjs/components/ModalCardBase/ModalCardBase.js +1 -0
  92. package/dist/cjs/components/ModalCardBase/ModalCardBase.js.map +1 -1
  93. package/dist/cjs/components/NativeSelect/NativeSelect.js +1 -0
  94. package/dist/cjs/components/NativeSelect/NativeSelect.js.map +1 -1
  95. package/dist/cjs/components/Panel/Panel.js +1 -0
  96. package/dist/cjs/components/Panel/Panel.js.map +1 -1
  97. package/dist/cjs/components/PanelHeader/PanelHeader.js +1 -0
  98. package/dist/cjs/components/PanelHeader/PanelHeader.js.map +1 -1
  99. package/dist/cjs/components/Popper/Popper.js +16 -22
  100. package/dist/cjs/components/Popper/Popper.js.map +1 -1
  101. package/dist/cjs/components/PopperArrow/PopperArrow.js +40 -0
  102. package/dist/cjs/components/PopperArrow/PopperArrow.js.map +1 -0
  103. package/dist/cjs/components/Radio/Radio.js +1 -0
  104. package/dist/cjs/components/Radio/Radio.js.map +1 -1
  105. package/dist/cjs/components/RangeSlider/UniversalSlider.js +1 -0
  106. package/dist/cjs/components/RangeSlider/UniversalSlider.js.map +1 -1
  107. package/dist/cjs/components/RichTooltip/RichTooltip.js +6 -15
  108. package/dist/cjs/components/RichTooltip/RichTooltip.js.map +1 -1
  109. package/dist/cjs/components/Select/Select.js +1 -0
  110. package/dist/cjs/components/Select/Select.js.map +1 -1
  111. package/dist/cjs/components/SelectMimicry/SelectMimicry.js +4 -1
  112. package/dist/cjs/components/SelectMimicry/SelectMimicry.js.map +1 -1
  113. package/dist/cjs/components/SimpleCell/SimpleCell.js +21 -31
  114. package/dist/cjs/components/SimpleCell/SimpleCell.js.map +1 -1
  115. package/dist/cjs/components/Snackbar/Snackbar.js +7 -11
  116. package/dist/cjs/components/Snackbar/Snackbar.js.map +1 -1
  117. package/dist/cjs/components/SplitCol/SplitCol.js +7 -1
  118. package/dist/cjs/components/SplitCol/SplitCol.js.map +1 -1
  119. package/dist/cjs/components/SplitLayout/SplitLayout.js +5 -8
  120. package/dist/cjs/components/SplitLayout/SplitLayout.js.map +1 -1
  121. package/dist/cjs/components/Tabbar/Tabbar.js +15 -14
  122. package/dist/cjs/components/Tabbar/Tabbar.js.map +1 -1
  123. package/dist/cjs/components/TabbarItem/TabbarItem.js +8 -10
  124. package/dist/cjs/components/TabbarItem/TabbarItem.js.map +1 -1
  125. package/dist/cjs/components/Tabs/Tabs.js +23 -5
  126. package/dist/cjs/components/Tabs/Tabs.js.map +1 -1
  127. package/dist/cjs/components/TabsItem/TabsItem.js +39 -22
  128. package/dist/cjs/components/TabsItem/TabsItem.js.map +1 -1
  129. package/dist/cjs/components/TextTooltip/TextTooltip.js +6 -9
  130. package/dist/cjs/components/TextTooltip/TextTooltip.js.map +1 -1
  131. package/dist/cjs/components/Textarea/Textarea.js +5 -4
  132. package/dist/cjs/components/Textarea/Textarea.js.map +1 -1
  133. package/dist/cjs/components/Tooltip/Tooltip.js +94 -71
  134. package/dist/cjs/components/Tooltip/Tooltip.js.map +1 -1
  135. package/dist/cjs/components/Typography/Headline/Headline.js +11 -2
  136. package/dist/cjs/components/Typography/Headline/Headline.js.map +1 -1
  137. package/dist/cjs/components/View/View.js +388 -453
  138. package/dist/cjs/components/View/View.js.map +1 -1
  139. package/dist/cjs/components/WriteBar/WriteBar.js +12 -5
  140. package/dist/cjs/components/WriteBar/WriteBar.js.map +1 -1
  141. package/dist/cjs/components/WriteBarIcon/WriteBarIcon.js +3 -8
  142. package/dist/cjs/components/WriteBarIcon/WriteBarIcon.js.map +1 -1
  143. package/dist/cjs/hoc/withAdaptivity.js.map +1 -1
  144. package/dist/cjs/hoc/withContext.js.map +1 -1
  145. package/dist/cjs/hoc/withPlatform.js.map +1 -1
  146. package/dist/cjs/hooks/useOrientationChange.js +2 -1
  147. package/dist/cjs/hooks/useOrientationChange.js.map +1 -1
  148. package/dist/cjs/tokenized/index.js +104 -0
  149. package/dist/cjs/tokenized/index.js.map +1 -1
  150. package/dist/components/ActionSheetItem/ActionSheetItem.d.ts +1 -1
  151. package/dist/components/AppRoot/AppRoot.d.ts +1 -1
  152. package/dist/components/AppRoot/AppRoot.js +13 -15
  153. package/dist/components/AppRoot/AppRoot.js.map +1 -1
  154. package/dist/components/Button/Button.d.ts +1 -1
  155. package/dist/components/Button/Button.js +6 -4
  156. package/dist/components/Button/Button.js.map +1 -1
  157. package/dist/components/CardGrid/CardGrid.d.ts +1 -1
  158. package/dist/components/CardScroll/CardScroll.js +3 -1
  159. package/dist/components/CardScroll/CardScroll.js.map +1 -1
  160. package/dist/components/Checkbox/Checkbox.d.ts +1 -1
  161. package/dist/components/ChipsSelect/ChipsSelect.d.ts +1 -1
  162. package/dist/components/ChipsSelect/ChipsSelect.js +5 -0
  163. package/dist/components/ChipsSelect/ChipsSelect.js.map +1 -1
  164. package/dist/components/ConfigProvider/ConfigProviderContext.d.ts +1 -0
  165. package/dist/components/ConfigProvider/ConfigProviderContext.js +3 -0
  166. package/dist/components/ConfigProvider/ConfigProviderContext.js.map +1 -1
  167. package/dist/components/CustomSelect/CustomSelect.d.ts +1 -1
  168. package/dist/components/CustomSelect/CustomSelect.js +473 -579
  169. package/dist/components/CustomSelect/CustomSelect.js.map +1 -1
  170. package/dist/components/CustomSelectDropdown/CustomSelectDropdown.d.ts +2 -1
  171. package/dist/components/CustomSelectDropdown/CustomSelectDropdown.js +71 -35
  172. package/dist/components/CustomSelectDropdown/CustomSelectDropdown.js.map +1 -1
  173. package/dist/components/DatePicker/DatePicker.d.ts +1 -1
  174. package/dist/components/Dropdown/Dropdown.d.ts +46 -5
  175. package/dist/components/Dropdown/Dropdown.js +137 -27
  176. package/dist/components/Dropdown/Dropdown.js.map +1 -1
  177. package/dist/components/Epic/Epic.d.ts +1 -1
  178. package/dist/components/Epic/Epic.js +1 -4
  179. package/dist/components/Epic/Epic.js.map +1 -1
  180. package/dist/components/FocusTrap/FocusTrap.d.ts +1 -1
  181. package/dist/components/FocusTrap/FocusTrap.js +9 -9
  182. package/dist/components/FocusTrap/FocusTrap.js.map +1 -1
  183. package/dist/components/FormField/FormField.js +4 -8
  184. package/dist/components/FormField/FormField.js.map +1 -1
  185. package/dist/components/Group/Group.d.ts +1 -1
  186. package/dist/components/HorizontalCell/HorizontalCell.js +3 -5
  187. package/dist/components/HorizontalCell/HorizontalCell.js.map +1 -1
  188. package/dist/components/HorizontalScroll/HorizontalScroll.d.ts +1 -1
  189. package/dist/components/HorizontalScroll/HorizontalScroll.js +1 -0
  190. package/dist/components/HorizontalScroll/HorizontalScroll.js.map +1 -1
  191. package/dist/components/IconButton/IconButton.d.ts +1 -1
  192. package/dist/components/Input/Input.d.ts +1 -1
  193. package/dist/components/Input/Input.js +3 -4
  194. package/dist/components/Input/Input.js.map +1 -1
  195. package/dist/components/MiniInfoCell/MiniInfoCell.js +2 -2
  196. package/dist/components/MiniInfoCell/MiniInfoCell.js.map +1 -1
  197. package/dist/components/ModalCard/ModalCard.d.ts +1 -1
  198. package/dist/components/ModalCardBase/ModalCardBase.d.ts +1 -1
  199. package/dist/components/ModalCardBase/ModalCardBase.js +1 -0
  200. package/dist/components/ModalCardBase/ModalCardBase.js.map +1 -1
  201. package/dist/components/ModalPage/ModalPage.d.ts +1 -1
  202. package/dist/components/ModalRoot/ModalRoot.d.ts +1 -1
  203. package/dist/components/ModalRoot/ModalRootAdaptive.d.ts +1 -1
  204. package/dist/components/ModalRoot/ModalRootDesktop.d.ts +1 -1
  205. package/dist/components/NativeSelect/NativeSelect.d.ts +1 -1
  206. package/dist/components/NativeSelect/NativeSelect.js +1 -0
  207. package/dist/components/NativeSelect/NativeSelect.js.map +1 -1
  208. package/dist/components/Panel/Panel.d.ts +1 -1
  209. package/dist/components/Panel/Panel.js +1 -0
  210. package/dist/components/Panel/Panel.js.map +1 -1
  211. package/dist/components/PanelHeader/PanelHeader.d.ts +1 -1
  212. package/dist/components/PanelHeader/PanelHeader.js +1 -0
  213. package/dist/components/PanelHeader/PanelHeader.js.map +1 -1
  214. package/dist/components/PanelHeaderBack/PanelHeaderBack.d.ts +1 -1
  215. package/dist/components/PopoutRoot/PopoutRoot.d.ts +1 -1
  216. package/dist/components/Popper/Popper.d.ts +18 -1
  217. package/dist/components/Popper/Popper.js +15 -22
  218. package/dist/components/Popper/Popper.js.map +1 -1
  219. package/dist/components/PopperArrow/PopperArrow.d.ts +8 -0
  220. package/dist/components/PopperArrow/PopperArrow.js +27 -0
  221. package/dist/components/PopperArrow/PopperArrow.js.map +1 -0
  222. package/dist/components/Radio/Radio.d.ts +1 -1
  223. package/dist/components/Radio/Radio.js +1 -0
  224. package/dist/components/Radio/Radio.js.map +1 -1
  225. package/dist/components/RangeSlider/UniversalSlider.d.ts +1 -1
  226. package/dist/components/RangeSlider/UniversalSlider.js +1 -0
  227. package/dist/components/RangeSlider/UniversalSlider.js.map +1 -1
  228. package/dist/components/RichCell/RichCell.d.ts +1 -1
  229. package/dist/components/RichTooltip/RichTooltip.d.ts +7 -2
  230. package/dist/components/RichTooltip/RichTooltip.js +5 -10
  231. package/dist/components/RichTooltip/RichTooltip.js.map +1 -1
  232. package/dist/components/Search/Search.d.ts +1 -1
  233. package/dist/components/Select/Select.d.ts +1 -1
  234. package/dist/components/Select/Select.js +1 -0
  235. package/dist/components/Select/Select.js.map +1 -1
  236. package/dist/components/SelectMimicry/SelectMimicry.d.ts +1 -1
  237. package/dist/components/SelectMimicry/SelectMimicry.js +4 -1
  238. package/dist/components/SelectMimicry/SelectMimicry.js.map +1 -1
  239. package/dist/components/SimpleCell/SimpleCell.d.ts +1 -1
  240. package/dist/components/SimpleCell/SimpleCell.js +19 -28
  241. package/dist/components/SimpleCell/SimpleCell.js.map +1 -1
  242. package/dist/components/Snackbar/Snackbar.d.ts +5 -1
  243. package/dist/components/Snackbar/Snackbar.js +8 -11
  244. package/dist/components/Snackbar/Snackbar.js.map +1 -1
  245. package/dist/components/SplitCol/SplitCol.d.ts +1 -0
  246. package/dist/components/SplitCol/SplitCol.js +3 -0
  247. package/dist/components/SplitCol/SplitCol.js.map +1 -1
  248. package/dist/components/SplitLayout/SplitLayout.js +4 -7
  249. package/dist/components/SplitLayout/SplitLayout.js.map +1 -1
  250. package/dist/components/Tabbar/Tabbar.d.ts +8 -1
  251. package/dist/components/Tabbar/Tabbar.js +15 -14
  252. package/dist/components/Tabbar/Tabbar.js.map +1 -1
  253. package/dist/components/TabbarItem/TabbarItem.js +7 -9
  254. package/dist/components/TabbarItem/TabbarItem.js.map +1 -1
  255. package/dist/components/Tabs/Tabs.d.ts +14 -3
  256. package/dist/components/Tabs/Tabs.js +23 -5
  257. package/dist/components/Tabs/Tabs.js.map +1 -1
  258. package/dist/components/TabsItem/TabsItem.d.ts +22 -1
  259. package/dist/components/TabsItem/TabsItem.js +40 -21
  260. package/dist/components/TabsItem/TabsItem.js.map +1 -1
  261. package/dist/components/Tappable/Tappable.d.ts +1 -1
  262. package/dist/components/TextTooltip/TextTooltip.d.ts +5 -1
  263. package/dist/components/TextTooltip/TextTooltip.js +5 -7
  264. package/dist/components/TextTooltip/TextTooltip.js.map +1 -1
  265. package/dist/components/Textarea/Textarea.d.ts +4 -1
  266. package/dist/components/Textarea/Textarea.js +5 -4
  267. package/dist/components/Textarea/Textarea.js.map +1 -1
  268. package/dist/components/Tooltip/Tooltip.d.ts +18 -1
  269. package/dist/components/Tooltip/Tooltip.js +89 -68
  270. package/dist/components/Tooltip/Tooltip.js.map +1 -1
  271. package/dist/components/Typography/Headline/Headline.d.ts +3 -3
  272. package/dist/components/Typography/Headline/Headline.js +10 -2
  273. package/dist/components/Typography/Headline/Headline.js.map +1 -1
  274. package/dist/components/View/View.d.ts +2 -18
  275. package/dist/components/View/View.js +384 -462
  276. package/dist/components/View/View.js.map +1 -1
  277. package/dist/components/View/ViewInfinite.d.ts +1 -1
  278. package/dist/components/WriteBar/WriteBar.d.ts +5 -1
  279. package/dist/components/WriteBar/WriteBar.js +10 -5
  280. package/dist/components/WriteBar/WriteBar.js.map +1 -1
  281. package/dist/components/WriteBarIcon/WriteBarIcon.js +3 -6
  282. package/dist/components/WriteBarIcon/WriteBarIcon.js.map +1 -1
  283. package/dist/components.css +143 -127
  284. package/dist/components.css.map +1 -1
  285. package/dist/cssm/components/ActionSheet/ActionSheet.css +1 -1
  286. package/dist/cssm/components/ActionSheetItem/ActionSheetItem.css +1 -1
  287. package/dist/cssm/components/ActionSheetItem/ActionSheetItem.d.ts +1 -1
  288. package/dist/cssm/components/Alert/Alert.css +1 -1
  289. package/dist/cssm/components/AppRoot/AppRoot.css +1 -1
  290. package/dist/cssm/components/AppRoot/AppRoot.d.ts +1 -1
  291. package/dist/cssm/components/AppRoot/AppRoot.js +13 -15
  292. package/dist/cssm/components/AppRoot/AppRoot.js.map +1 -1
  293. package/dist/cssm/components/Avatar/Avatar.css +3 -5
  294. package/dist/cssm/components/Badge/Badge.css +3 -3
  295. package/dist/cssm/components/Banner/Banner.css +5 -5
  296. package/dist/cssm/components/BaseGallery/BaseGallery.css +1 -1
  297. package/dist/cssm/components/Button/Button.css +53 -35
  298. package/dist/cssm/components/Button/Button.d.ts +1 -1
  299. package/dist/cssm/components/Button/Button.js +6 -4
  300. package/dist/cssm/components/Button/Button.js.map +1 -1
  301. package/dist/cssm/components/Calendar/Calendar.css +1 -1
  302. package/dist/cssm/components/CalendarDay/CalendarDay.css +1 -1
  303. package/dist/cssm/components/CalendarDays/CalendarDays.css +1 -1
  304. package/dist/cssm/components/CalendarHeader/CalendarHeader.css +1 -1
  305. package/dist/cssm/components/CalendarRange/CalendarRange.css +1 -1
  306. package/dist/cssm/components/CalendarTime/CalendarTime.css +1 -1
  307. package/dist/cssm/components/Card/Card.css +5 -6
  308. package/dist/cssm/components/CardGrid/CardGrid.css +1 -1
  309. package/dist/cssm/components/CardGrid/CardGrid.d.ts +1 -1
  310. package/dist/cssm/components/CardScroll/CardScroll.css +1 -1
  311. package/dist/cssm/components/CardScroll/CardScroll.js +3 -1
  312. package/dist/cssm/components/CardScroll/CardScroll.js.map +1 -1
  313. package/dist/cssm/components/Cell/Cell.css +3 -3
  314. package/dist/cssm/components/Cell/CellCheckbox/CellCheckbox.css +1 -1
  315. package/dist/cssm/components/Cell/CellDragger/CellDragger.css +1 -1
  316. package/dist/cssm/components/CellButton/CellButton.css +1 -1
  317. package/dist/cssm/components/Checkbox/Checkbox.css +1 -1
  318. package/dist/cssm/components/Checkbox/Checkbox.d.ts +1 -1
  319. package/dist/cssm/components/Chip/Chip.css +1 -1
  320. package/dist/cssm/components/ChipsInput/ChipsInput.css +1 -1
  321. package/dist/cssm/components/ChipsSelect/ChipsSelect.css +1 -1
  322. package/dist/cssm/components/ChipsSelect/ChipsSelect.d.ts +1 -1
  323. package/dist/cssm/components/ChipsSelect/ChipsSelect.js +5 -0
  324. package/dist/cssm/components/ChipsSelect/ChipsSelect.js.map +1 -1
  325. package/dist/cssm/components/ConfigProvider/ConfigProviderContext.d.ts +1 -0
  326. package/dist/cssm/components/ConfigProvider/ConfigProviderContext.js +3 -0
  327. package/dist/cssm/components/ConfigProvider/ConfigProviderContext.js.map +1 -1
  328. package/dist/cssm/components/ContentCard/ContentCard.css +1 -1
  329. package/dist/cssm/components/Counter/Counter.css +31 -31
  330. package/dist/cssm/components/CustomScrollView/CustomScrollView.css +1 -1
  331. package/dist/cssm/components/CustomSelect/CustomSelect.css +1 -1
  332. package/dist/cssm/components/CustomSelect/CustomSelect.d.ts +1 -1
  333. package/dist/cssm/components/CustomSelect/CustomSelect.js +473 -579
  334. package/dist/cssm/components/CustomSelect/CustomSelect.js.map +1 -1
  335. package/dist/cssm/components/CustomSelectDropdown/CustomSelectDropdown.css +3 -3
  336. package/dist/cssm/components/CustomSelectDropdown/CustomSelectDropdown.d.ts +2 -1
  337. package/dist/cssm/components/CustomSelectDropdown/CustomSelectDropdown.js +71 -35
  338. package/dist/cssm/components/CustomSelectDropdown/CustomSelectDropdown.js.map +1 -1
  339. package/dist/cssm/components/CustomSelectOption/CustomSelectOption.css +3 -3
  340. package/dist/cssm/components/DateInput/DateInput.css +1 -1
  341. package/dist/cssm/components/DatePicker/DatePicker.css +1 -1
  342. package/dist/cssm/components/DatePicker/DatePicker.d.ts +1 -1
  343. package/dist/cssm/components/DateRangeInput/DateRangeInput.css +1 -1
  344. package/dist/cssm/components/Dropdown/Dropdown.css +1 -1
  345. package/dist/cssm/components/Dropdown/Dropdown.d.ts +46 -5
  346. package/dist/cssm/components/Dropdown/Dropdown.js +137 -27
  347. package/dist/cssm/components/Dropdown/Dropdown.js.map +1 -1
  348. package/dist/cssm/components/Epic/Epic.css +1 -1
  349. package/dist/cssm/components/Epic/Epic.d.ts +1 -1
  350. package/dist/cssm/components/Epic/Epic.js +1 -4
  351. package/dist/cssm/components/Epic/Epic.js.map +1 -1
  352. package/dist/cssm/components/FixedLayout/FixedLayout.css +1 -1
  353. package/dist/cssm/components/FocusTrap/FocusTrap.d.ts +1 -1
  354. package/dist/cssm/components/FocusTrap/FocusTrap.js +9 -9
  355. package/dist/cssm/components/FocusTrap/FocusTrap.js.map +1 -1
  356. package/dist/cssm/components/FocusVisible/FocusVisible.css +1 -1
  357. package/dist/cssm/components/Footer/Footer.css +1 -1
  358. package/dist/cssm/components/FormField/FormField.css +9 -9
  359. package/dist/cssm/components/FormField/FormField.js +4 -8
  360. package/dist/cssm/components/FormField/FormField.js.map +1 -1
  361. package/dist/cssm/components/FormItem/FormItem.css +1 -1
  362. package/dist/cssm/components/FormLayout/FormLayout.css +1 -1
  363. package/dist/cssm/components/FormLayoutGroup/FormLayoutGroup.css +1 -1
  364. package/dist/cssm/components/FormStatus/FormStatus.css +1 -1
  365. package/dist/cssm/components/Gradient/Gradient.css +1 -1
  366. package/dist/cssm/components/GridAvatar/GridAvatar.css +1 -1
  367. package/dist/cssm/components/Group/Group.css +1 -1
  368. package/dist/cssm/components/Group/Group.d.ts +1 -1
  369. package/dist/cssm/components/Header/Header.css +1 -1
  370. package/dist/cssm/components/HorizontalCell/HorizontalCell.css +1 -1
  371. package/dist/cssm/components/HorizontalCell/HorizontalCell.js +3 -5
  372. package/dist/cssm/components/HorizontalCell/HorizontalCell.js.map +1 -1
  373. package/dist/cssm/components/HorizontalScroll/HorizontalScroll.css +1 -1
  374. package/dist/cssm/components/HorizontalScroll/HorizontalScroll.d.ts +1 -1
  375. package/dist/cssm/components/HorizontalScroll/HorizontalScroll.js +1 -0
  376. package/dist/cssm/components/HorizontalScroll/HorizontalScroll.js.map +1 -1
  377. package/dist/cssm/components/HorizontalScroll/HorizontalScrollArrow.css +3 -3
  378. package/dist/cssm/components/IconButton/IconButton.css +1 -1
  379. package/dist/cssm/components/IconButton/IconButton.d.ts +1 -1
  380. package/dist/cssm/components/InfoRow/InfoRow.css +1 -1
  381. package/dist/cssm/components/InitialsAvatar/InitialsAvatar.css +1 -1
  382. package/dist/cssm/components/Input/Input.css +1 -1
  383. package/dist/cssm/components/Input/Input.d.ts +1 -1
  384. package/dist/cssm/components/Input/Input.js +3 -4
  385. package/dist/cssm/components/Input/Input.js.map +1 -1
  386. package/dist/cssm/components/InputLike/InputLike.css +1 -1
  387. package/dist/cssm/components/InputLike/InputLikeDivider.css +1 -1
  388. package/dist/cssm/components/Link/Link.css +1 -1
  389. package/dist/cssm/components/MiniInfoCell/MiniInfoCell.css +1 -1
  390. package/dist/cssm/components/MiniInfoCell/MiniInfoCell.js +2 -2
  391. package/dist/cssm/components/MiniInfoCell/MiniInfoCell.js.map +1 -1
  392. package/dist/cssm/components/ModalCard/ModalCard.css +1 -1
  393. package/dist/cssm/components/ModalCard/ModalCard.d.ts +1 -1
  394. package/dist/cssm/components/ModalCardBase/ModalCardBase.css +3 -3
  395. package/dist/cssm/components/ModalCardBase/ModalCardBase.d.ts +1 -1
  396. package/dist/cssm/components/ModalCardBase/ModalCardBase.js +1 -0
  397. package/dist/cssm/components/ModalCardBase/ModalCardBase.js.map +1 -1
  398. package/dist/cssm/components/ModalDismissButton/ModalDismissButton.css +1 -1
  399. package/dist/cssm/components/ModalPage/ModalPage.css +1 -1
  400. package/dist/cssm/components/ModalPage/ModalPage.d.ts +1 -1
  401. package/dist/cssm/components/ModalPageHeader/ModalPageHeader.css +1 -1
  402. package/dist/cssm/components/ModalRoot/ModalRoot.css +1 -1
  403. package/dist/cssm/components/ModalRoot/ModalRoot.d.ts +1 -1
  404. package/dist/cssm/components/ModalRoot/ModalRootAdaptive.d.ts +1 -1
  405. package/dist/cssm/components/ModalRoot/ModalRootDesktop.d.ts +1 -1
  406. package/dist/cssm/components/NativeSelect/NativeSelect.d.ts +1 -1
  407. package/dist/cssm/components/NativeSelect/NativeSelect.js +1 -0
  408. package/dist/cssm/components/NativeSelect/NativeSelect.js.map +1 -1
  409. package/dist/cssm/components/Pagination/Pagination.css +1 -1
  410. package/dist/cssm/components/Panel/Panel.css +1 -1
  411. package/dist/cssm/components/Panel/Panel.d.ts +1 -1
  412. package/dist/cssm/components/Panel/Panel.js +1 -0
  413. package/dist/cssm/components/Panel/Panel.js.map +1 -1
  414. package/dist/cssm/components/PanelHeader/PanelHeader.css +1 -1
  415. package/dist/cssm/components/PanelHeader/PanelHeader.d.ts +1 -1
  416. package/dist/cssm/components/PanelHeader/PanelHeader.js +1 -0
  417. package/dist/cssm/components/PanelHeader/PanelHeader.js.map +1 -1
  418. package/dist/cssm/components/PanelHeaderBack/PanelHeaderBack.d.ts +1 -1
  419. package/dist/cssm/components/PanelHeaderButton/PanelHeaderButton.css +1 -1
  420. package/dist/cssm/components/PanelHeaderContent/PanelHeaderContent.css +1 -1
  421. package/dist/cssm/components/PanelHeaderContext/PanelHeaderContext.css +1 -1
  422. package/dist/cssm/components/Placeholder/Placeholder.css +3 -3
  423. package/dist/cssm/components/PopoutRoot/PopoutRoot.css +1 -1
  424. package/dist/cssm/components/PopoutRoot/PopoutRoot.d.ts +1 -1
  425. package/dist/cssm/components/PopoutWrapper/PopoutWrapper.css +1 -1
  426. package/dist/cssm/components/Popper/Popper.css +1 -1
  427. package/dist/cssm/components/Popper/Popper.d.ts +18 -1
  428. package/dist/cssm/components/Popper/Popper.js +15 -22
  429. package/dist/cssm/components/Popper/Popper.js.map +1 -1
  430. package/dist/cssm/components/PopperArrow/PopperArrow.css +1 -0
  431. package/dist/cssm/components/PopperArrow/PopperArrow.d.ts +8 -0
  432. package/dist/cssm/components/PopperArrow/PopperArrow.js +28 -0
  433. package/dist/cssm/components/PopperArrow/PopperArrow.js.map +1 -0
  434. package/dist/cssm/components/Progress/Progress.css +1 -1
  435. package/dist/cssm/components/PromoBanner/PromoBanner.css +1 -1
  436. package/dist/cssm/components/PullToRefresh/PullToRefresh.css +3 -3
  437. package/dist/cssm/components/Radio/Radio.css +1 -1
  438. package/dist/cssm/components/Radio/Radio.d.ts +1 -1
  439. package/dist/cssm/components/Radio/Radio.js +1 -0
  440. package/dist/cssm/components/Radio/Radio.js.map +1 -1
  441. package/dist/cssm/components/RadioGroup/RadioGroup.css +1 -1
  442. package/dist/cssm/components/RangeSlider/UniversalSlider.d.ts +1 -1
  443. package/dist/cssm/components/RangeSlider/UniversalSlider.js +1 -0
  444. package/dist/cssm/components/RangeSlider/UniversalSlider.js.map +1 -1
  445. package/dist/cssm/components/Removable/Removable.css +1 -1
  446. package/dist/cssm/components/RichCell/RichCell.css +3 -3
  447. package/dist/cssm/components/RichCell/RichCell.d.ts +1 -1
  448. package/dist/cssm/components/RichTooltip/RichTooltip.css +3 -1
  449. package/dist/cssm/components/RichTooltip/RichTooltip.d.ts +7 -2
  450. package/dist/cssm/components/RichTooltip/RichTooltip.js +5 -10
  451. package/dist/cssm/components/RichTooltip/RichTooltip.js.map +1 -1
  452. package/dist/cssm/components/Root/Root.css +1 -1
  453. package/dist/cssm/components/ScreenSpinner/ScreenSpinner.css +1 -1
  454. package/dist/cssm/components/Search/Search.css +1 -1
  455. package/dist/cssm/components/Search/Search.d.ts +1 -1
  456. package/dist/cssm/components/SegmentedControl/SegmentedControl.css +1 -1
  457. package/dist/cssm/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.css +1 -1
  458. package/dist/cssm/components/Select/Select.css +1 -1
  459. package/dist/cssm/components/Select/Select.d.ts +1 -1
  460. package/dist/cssm/components/Select/Select.js +1 -0
  461. package/dist/cssm/components/Select/Select.js.map +1 -1
  462. package/dist/cssm/components/SelectMimicry/SelectMimicry.d.ts +1 -1
  463. package/dist/cssm/components/SelectMimicry/SelectMimicry.js +4 -1
  464. package/dist/cssm/components/SelectMimicry/SelectMimicry.js.map +1 -1
  465. package/dist/cssm/components/Separator/Separator.css +1 -1
  466. package/dist/cssm/components/SimpleCell/SimpleCell.css +1 -1
  467. package/dist/cssm/components/SimpleCell/SimpleCell.d.ts +1 -1
  468. package/dist/cssm/components/SimpleCell/SimpleCell.js +19 -28
  469. package/dist/cssm/components/SimpleCell/SimpleCell.js.map +1 -1
  470. package/dist/cssm/components/SimpleCheckbox/SimpleCheckbox.css +1 -1
  471. package/dist/cssm/components/Slider/Slider.css +3 -3
  472. package/dist/cssm/components/SliderSwitch/SliderSwitch.css +1 -1
  473. package/dist/cssm/components/Snackbar/Snackbar.css +1 -1
  474. package/dist/cssm/components/Snackbar/Snackbar.d.ts +5 -1
  475. package/dist/cssm/components/Snackbar/Snackbar.js +8 -11
  476. package/dist/cssm/components/Snackbar/Snackbar.js.map +1 -1
  477. package/dist/cssm/components/Spacing/Spacing.css +1 -1
  478. package/dist/cssm/components/Spinner/Spinner.css +1 -1
  479. package/dist/cssm/components/SplitCol/SplitCol.css +1 -1
  480. package/dist/cssm/components/SplitCol/SplitCol.d.ts +1 -0
  481. package/dist/cssm/components/SplitCol/SplitCol.js +3 -0
  482. package/dist/cssm/components/SplitCol/SplitCol.js.map +1 -1
  483. package/dist/cssm/components/SplitLayout/SplitLayout.css +1 -1
  484. package/dist/cssm/components/SplitLayout/SplitLayout.js +4 -7
  485. package/dist/cssm/components/SplitLayout/SplitLayout.js.map +1 -1
  486. package/dist/cssm/components/SubnavigationBar/SubnavigationBar.css +1 -1
  487. package/dist/cssm/components/SubnavigationButton/SubnavigationButton.css +1 -1
  488. package/dist/cssm/components/Switch/Switch.css +3 -3
  489. package/dist/cssm/components/Tabbar/Tabbar.css +5 -3
  490. package/dist/cssm/components/Tabbar/Tabbar.d.ts +8 -1
  491. package/dist/cssm/components/Tabbar/Tabbar.js +15 -14
  492. package/dist/cssm/components/Tabbar/Tabbar.js.map +1 -1
  493. package/dist/cssm/components/TabbarItem/TabbarItem.css +1 -1
  494. package/dist/cssm/components/TabbarItem/TabbarItem.js +7 -9
  495. package/dist/cssm/components/TabbarItem/TabbarItem.js.map +1 -1
  496. package/dist/cssm/components/Tabs/Tabs.css +1 -1
  497. package/dist/cssm/components/Tabs/Tabs.d.ts +14 -3
  498. package/dist/cssm/components/Tabs/Tabs.js +23 -5
  499. package/dist/cssm/components/Tabs/Tabs.js.map +1 -1
  500. package/dist/cssm/components/TabsItem/TabsItem.css +5 -1
  501. package/dist/cssm/components/TabsItem/TabsItem.d.ts +22 -1
  502. package/dist/cssm/components/TabsItem/TabsItem.js +40 -21
  503. package/dist/cssm/components/TabsItem/TabsItem.js.map +1 -1
  504. package/dist/cssm/components/Tappable/Tappable.css +5 -5
  505. package/dist/cssm/components/Tappable/Tappable.d.ts +1 -1
  506. package/dist/cssm/components/TextTooltip/TextTooltip.css +1 -1
  507. package/dist/cssm/components/TextTooltip/TextTooltip.d.ts +5 -1
  508. package/dist/cssm/components/TextTooltip/TextTooltip.js +5 -7
  509. package/dist/cssm/components/TextTooltip/TextTooltip.js.map +1 -1
  510. package/dist/cssm/components/Textarea/Textarea.css +1 -1
  511. package/dist/cssm/components/Textarea/Textarea.d.ts +4 -1
  512. package/dist/cssm/components/Textarea/Textarea.js +5 -4
  513. package/dist/cssm/components/Textarea/Textarea.js.map +1 -1
  514. package/dist/cssm/components/Tooltip/Tooltip.css +1 -1
  515. package/dist/cssm/components/Tooltip/Tooltip.d.ts +18 -1
  516. package/dist/cssm/components/Tooltip/Tooltip.js +89 -68
  517. package/dist/cssm/components/Tooltip/Tooltip.js.map +1 -1
  518. package/dist/cssm/components/Typography/Caption/Caption.css +1 -1
  519. package/dist/cssm/components/Typography/Footnote/Footnote.css +1 -1
  520. package/dist/cssm/components/Typography/Headline/Headline.css +1 -1
  521. package/dist/cssm/components/Typography/Headline/Headline.d.ts +3 -3
  522. package/dist/cssm/components/Typography/Headline/Headline.js +10 -2
  523. package/dist/cssm/components/Typography/Headline/Headline.js.map +1 -1
  524. package/dist/cssm/components/Typography/Paragraph/Paragraph.css +1 -1
  525. package/dist/cssm/components/Typography/Subhead/Subhead.css +1 -1
  526. package/dist/cssm/components/Typography/Text/Text.css +1 -1
  527. package/dist/cssm/components/Typography/Title/Title.css +1 -1
  528. package/dist/cssm/components/UsersStack/UsersStack.css +5 -5
  529. package/dist/cssm/components/View/View.css +1 -1
  530. package/dist/cssm/components/View/View.d.ts +2 -18
  531. package/dist/cssm/components/View/View.js +384 -462
  532. package/dist/cssm/components/View/View.js.map +1 -1
  533. package/dist/cssm/components/View/ViewIOS.css +1 -1
  534. package/dist/cssm/components/View/ViewInfinite.d.ts +1 -1
  535. package/dist/cssm/components/VisuallyHiddenInput/VisuallyHiddenInput.css +1 -1
  536. package/dist/cssm/components/WriteBar/WriteBar.css +3 -1
  537. package/dist/cssm/components/WriteBar/WriteBar.d.ts +5 -1
  538. package/dist/cssm/components/WriteBar/WriteBar.js +10 -5
  539. package/dist/cssm/components/WriteBar/WriteBar.js.map +1 -1
  540. package/dist/cssm/components/WriteBarIcon/WriteBarIcon.css +1 -1
  541. package/dist/cssm/components/WriteBarIcon/WriteBarIcon.js +3 -6
  542. package/dist/cssm/components/WriteBarIcon/WriteBarIcon.js.map +1 -1
  543. package/dist/cssm/fonts/fonts.css +1 -1
  544. package/dist/cssm/hoc/withAdaptivity.d.ts +1 -1
  545. package/dist/cssm/hoc/withAdaptivity.js.map +1 -1
  546. package/dist/cssm/hoc/withContext.d.ts +1 -1
  547. package/dist/cssm/hoc/withContext.js.map +1 -1
  548. package/dist/cssm/hoc/withPlatform.d.ts +1 -1
  549. package/dist/cssm/hoc/withPlatform.js.map +1 -1
  550. package/dist/cssm/hooks/useOrientationChange.js +2 -1
  551. package/dist/cssm/hooks/useOrientationChange.js.map +1 -1
  552. package/dist/cssm/lib/calendar.d.ts +2 -2
  553. package/dist/cssm/styles/animations.css +1 -1
  554. package/dist/cssm/styles/bright_light.css +1 -1
  555. package/dist/cssm/styles/common.css +1 -1
  556. package/dist/cssm/styles/components.css +143 -127
  557. package/dist/cssm/styles/constants.css +3 -10
  558. package/dist/cssm/styles/space_gray.css +1 -1
  559. package/dist/cssm/styles/themes.css +1 -16
  560. package/dist/cssm/styles/unstable.css +3 -1
  561. package/dist/cssm/styles/vkcom_dark.css +1 -6
  562. package/dist/cssm/styles/vkcom_light.css +1 -11
  563. package/dist/cssm/tokenized/index.d.ts +26 -0
  564. package/dist/cssm/tokenized/index.js +13 -0
  565. package/dist/cssm/tokenized/index.js.map +1 -1
  566. package/dist/default_scheme.css +1 -1
  567. package/dist/default_scheme.css.map +1 -1
  568. package/dist/fonts.css +1 -1
  569. package/dist/fonts.css.map +1 -1
  570. package/dist/hoc/withAdaptivity.d.ts +1 -1
  571. package/dist/hoc/withAdaptivity.js.map +1 -1
  572. package/dist/hoc/withContext.d.ts +1 -1
  573. package/dist/hoc/withContext.js.map +1 -1
  574. package/dist/hoc/withPlatform.d.ts +1 -1
  575. package/dist/hoc/withPlatform.js.map +1 -1
  576. package/dist/hooks/useOrientationChange.js +2 -1
  577. package/dist/hooks/useOrientationChange.js.map +1 -1
  578. package/dist/lib/calendar.d.ts +2 -2
  579. package/dist/tokenized/index.d.ts +26 -0
  580. package/dist/tokenized/index.js +13 -0
  581. package/dist/tokenized/index.js.map +1 -1
  582. package/dist/unstable.css +3 -1
  583. package/dist/unstable.css.map +1 -1
  584. package/dist/vkui.css +144 -143
  585. package/dist/vkui.css.map +1 -1
  586. package/package.json +6 -5
  587. package/src/components/AppRoot/AppRoot.tsx +15 -11
  588. package/src/components/Badge/Badge.css +0 -5
  589. package/src/components/Button/Button.css +0 -4
  590. package/src/components/Button/Button.tsx +4 -2
  591. package/src/components/Button/Readme.md +30 -59
  592. package/src/components/CardScroll/CardScroll.tsx +1 -1
  593. package/src/components/Cell/Cell.css +3 -2
  594. package/src/components/ChipsInput/ChipsInput.css +2 -0
  595. package/src/components/ChipsSelect/ChipsSelect.tsx +8 -0
  596. package/src/components/ConfigProvider/ConfigProviderContext.tsx +2 -0
  597. package/src/components/Counter/Counter.css +30 -0
  598. package/src/components/CustomScrollView/CustomScrollView.css +10 -5
  599. package/src/components/CustomSelect/CustomSelect.tsx +543 -573
  600. package/src/components/CustomSelectDropdown/CustomSelectDropdown.tsx +45 -22
  601. package/src/components/Dropdown/Dropdown.css +12 -0
  602. package/src/components/Dropdown/Dropdown.tsx +174 -20
  603. package/src/components/Dropdown/Readme.md +1 -0
  604. package/src/components/Epic/Epic.tsx +1 -4
  605. package/src/components/FixedLayout/Readme.md +103 -109
  606. package/src/components/FocusTrap/FocusTrap.tsx +10 -10
  607. package/src/components/FormField/FormField.css +31 -22
  608. package/src/components/FormField/FormField.tsx +4 -8
  609. package/src/components/FormField/Readme.md +9 -82
  610. package/src/components/Group/Group.css +1 -1
  611. package/src/components/Group/Readme.md +1 -1
  612. package/src/components/HorizontalCell/HorizontalCell.css +25 -43
  613. package/src/components/HorizontalCell/HorizontalCell.tsx +3 -9
  614. package/src/components/HorizontalScroll/HorizontalScroll.css +23 -0
  615. package/src/components/HorizontalScroll/HorizontalScroll.tsx +2 -0
  616. package/src/components/IconButton/IconButton.css +46 -25
  617. package/src/components/Input/Input.css +20 -9
  618. package/src/components/Input/Input.tsx +6 -5
  619. package/src/components/Input/Readme.md +128 -24
  620. package/src/components/MiniInfoCell/MiniInfoCell.css +13 -3
  621. package/src/components/MiniInfoCell/MiniInfoCell.tsx +3 -3
  622. package/src/components/ModalCardBase/ModalCardBase.tsx +2 -0
  623. package/src/components/NativeSelect/NativeSelect.tsx +2 -0
  624. package/src/components/Panel/Panel.tsx +2 -0
  625. package/src/components/PanelHeader/PanelHeader.tsx +2 -0
  626. package/src/components/Popper/Popper.css +0 -35
  627. package/src/components/Popper/Popper.tsx +33 -25
  628. package/src/components/PopperArrow/PopperArrow.css +34 -0
  629. package/src/components/PopperArrow/PopperArrow.tsx +40 -0
  630. package/src/components/Radio/Radio.tsx +2 -0
  631. package/src/components/RangeSlider/UniversalSlider.tsx +2 -0
  632. package/src/components/RichTooltip/RichTooltip.css +44 -4
  633. package/src/components/RichTooltip/RichTooltip.tsx +9 -11
  634. package/src/components/ScreenSpinner/ScreenSpinner.css +1 -1
  635. package/src/components/Select/Select.css +23 -9
  636. package/src/components/Select/Select.tsx +2 -0
  637. package/src/components/SelectMimicry/SelectMimicry.tsx +6 -2
  638. package/src/components/SimpleCell/Readme.md +115 -129
  639. package/src/components/SimpleCell/SimpleCell.css +30 -68
  640. package/src/components/SimpleCell/SimpleCell.tsx +23 -25
  641. package/src/components/Snackbar/Readme.md +95 -123
  642. package/src/components/Snackbar/Snackbar.css +18 -27
  643. package/src/components/Snackbar/Snackbar.tsx +17 -11
  644. package/src/components/SplitCol/SplitCol.css +1 -1
  645. package/src/components/SplitCol/SplitCol.tsx +2 -0
  646. package/src/components/SplitLayout/SplitLayout.css +3 -7
  647. package/src/components/SplitLayout/SplitLayout.tsx +9 -6
  648. package/src/components/Switch/Switch.css +6 -2
  649. package/src/components/Tabbar/Tabbar.css +4 -1
  650. package/src/components/Tabbar/Tabbar.tsx +23 -12
  651. package/src/components/TabbarItem/TabbarItem.css +7 -5
  652. package/src/components/TabbarItem/TabbarItem.tsx +13 -7
  653. package/src/components/Tabs/Readme.md +191 -251
  654. package/src/components/Tabs/Tabs.css +27 -80
  655. package/src/components/Tabs/Tabs.tsx +45 -7
  656. package/src/components/TabsItem/Readme.md +1 -0
  657. package/src/components/TabsItem/TabsItem.css +191 -106
  658. package/src/components/TabsItem/TabsItem.tsx +72 -20
  659. package/src/components/TextTooltip/TextTooltip.css +41 -11
  660. package/src/components/TextTooltip/TextTooltip.tsx +9 -13
  661. package/src/components/Textarea/Textarea.css +7 -3
  662. package/src/components/Textarea/Textarea.tsx +5 -4
  663. package/src/components/Tooltip/Readme.md +128 -101
  664. package/src/components/Tooltip/Tooltip.css +29 -40
  665. package/src/components/Tooltip/Tooltip.tsx +98 -66
  666. package/src/components/Typography/Headline/Headline.tsx +15 -1
  667. package/src/components/View/Readme.md +2 -0
  668. package/src/components/View/View.tsx +451 -514
  669. package/src/components/WriteBar/WriteBar.css +27 -33
  670. package/src/components/WriteBar/WriteBar.tsx +16 -5
  671. package/src/components/WriteBarIcon/WriteBarIcon.css +6 -19
  672. package/src/components/WriteBarIcon/WriteBarIcon.tsx +6 -6
  673. package/src/hoc/withAdaptivity.tsx +4 -4
  674. package/src/hoc/withContext.tsx +1 -1
  675. package/src/hoc/withPlatform.tsx +1 -1
  676. package/src/hooks/useOrientationChange.ts +1 -0
  677. package/src/styles/components.css +1 -0
  678. package/src/styles/constants.css +8 -0
  679. package/src/tokenized/index.ts +39 -0
  680. package/tsconfig.json +1 -1
  681. package/.cache/ts/src/components/ClickPopper/ClickPopper.d.ts +0 -21
  682. package/dist/cjs/components/ClickPopper/ClickPopper.js +0 -96
  683. package/dist/cjs/components/ClickPopper/ClickPopper.js.map +0 -1
  684. package/dist/components/ClickPopper/ClickPopper.d.ts +0 -21
  685. package/dist/components/ClickPopper/ClickPopper.js +0 -71
  686. package/dist/components/ClickPopper/ClickPopper.js.map +0 -1
  687. package/dist/cssm/components/ClickPopper/ClickPopper.d.ts +0 -21
  688. package/dist/cssm/components/ClickPopper/ClickPopper.js +0 -71
  689. package/dist/cssm/components/ClickPopper/ClickPopper.js.map +0 -1
  690. package/src/components/ClickPopper/ClickPopper.tsx +0 -86
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/PanelHeader/PanelHeader.tsx"],"names":["React","usePlatform","getClassName","classNames","warnOnce","FixedLayout","Separator","Platform","VKCOM","ConfigProviderContext","WebviewType","SizeType","withAdaptivity","Text","TooltipContainer","ModalRootContext","Spacing","PanelHeaderIn","before","after","separator","children","useContext","webviewType","isInsideModal","platform","INTERNAL","warn","PanelHeaderComponent","propsBefore","left","propsAfter","right","visor","transparent","shadow","getRef","getRootRef","sizeX","sizeY","fixed","restProps","needShadow","REGULAR","isFixed","undefined","process","env","NODE_ENV","innerProps","VKAPPS","PanelHeader"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,SAASC,UAAT;AACA,SAASC,QAAT;AACA,SAASC,WAAT;AACA,SAASC,SAAT;AACA,SAASC,QAAT,EAAmBC,KAAnB;AAEA,SACEC,qBADF,EAEEC,WAFF;AAIA,SAEEC,QAFF,EAGEC,cAHF;AAKA,SAASC,IAAT;AACA,SAASC,gBAAT;AACA,SAASC,gBAAT;AACA,SAASC,OAAT;AACA;;AA8BA,IAAMC,aAAa,GAAG,SAAhBA,aAAgB,OAKE;AAAA,MAJtBC,MAIsB,QAJtBA,MAIsB;AAAA,MAHtBC,KAGsB,QAHtBA,KAGsB;AAAA,MAFtBC,SAEsB,QAFtBA,SAEsB;AAAA,MADtBC,QACsB,QADtBA,QACsB;;AACtB,0BAAwBrB,KAAK,CAACsB,UAAN,CAAiBb,qBAAjB,CAAxB;AAAA,MAAQc,WAAR,qBAAQA,WAAR;;AACA,2BAA0BvB,KAAK,CAACsB,UAAN,CAAiBP,gBAAjB,CAA1B;AAAA,MAAQS,aAAR,sBAAQA,aAAR;;AACA,MAAMC,QAAQ,GAAGxB,WAAW,EAA5B;AAEA,SACE,oBAAC,KAAD,CAAO,QAAP,QACE,oBAAC,gBAAD;AAAkB,IAAA,KAAK,MAAvB;AAAwB,IAAA,SAAS,EAAC;AAAlC,KACE;AAAK,IAAA,SAAS,EAAC;AAAf,KAAsCiB,MAAtC,CADF,EAEE;AAAK,IAAA,SAAS,EAAC;AAAf,KACGO,QAAQ,KAAKjB,KAAb,GACC,oBAAC,IAAD;AAAM,IAAA,MAAM,EAAC;AAAb,KAAkBa,QAAlB,CADD,GAGC;AAAM,IAAA,SAAS,EAAC;AAAhB,KAA2CA,QAA3C,CAJJ,CAFF,EASE;AAAK,IAAA,SAAS,EAAC;AAAf,KACG,CAACE,WAAW,KAAKb,WAAW,CAACgB,QAA5B,IAAwCF,aAAzC,KAA2DL,KAD9D,CATF,CADF,EAcGC,SAAS,IAAIK,QAAQ,KAAKjB,KAA1B,IAAmC,oBAAC,SAAD;AAAW,IAAA,IAAI;AAAf,IAdtC,CADF;AAkBD,CA5BD;;AA8BA,IAAMmB,IAAI,GAAGvB,QAAQ,CAAC,aAAD,CAArB;;AACA,IAAMwB,oBAAoB,GAAG,SAAvBA,oBAAuB,QAkBL;AAAA,MAhBdC,WAgBc,SAhBtBX,MAgBsB;AAAA,MAftBY,IAesB,SAftBA,IAesB;AAAA,MAdfC,UAce,SAdtBZ,KAcsB;AAAA,MAbtBa,KAasB,SAbtBA,KAasB;AAAA,MAXtBX,QAWsB,SAXtBA,QAWsB;AAAA,8BAVtBD,SAUsB;AAAA,MAVtBA,SAUsB,gCAVV,IAUU;AAAA,0BATtBa,KASsB;AAAA,MATtBA,KASsB,4BATd,IASc;AAAA,gCARtBC,WAQsB;AAAA,MARtBA,WAQsB,kCARR,KAQQ;AAAA,MAPtBC,MAOsB,SAPtBA,MAOsB;AAAA,MANtBC,MAMsB,SANtBA,MAMsB;AAAA,MALtBC,UAKsB,SALtBA,UAKsB;AAAA,MAJtBC,KAIsB,SAJtBA,KAIsB;AAAA,MAHtBC,KAGsB,SAHtBA,KAGsB;AAAA,MAFtBC,KAEsB,SAFtBA,KAEsB;AAAA,MADnBC,SACmB;;AACtB,MAAMhB,QAAQ,GAAGxB,WAAW,EAA5B;;AACA,2BAAwBD,KAAK,CAACsB,UAAN,CAAiBb,qBAAjB,CAAxB;AAAA,MAAQc,WAAR,sBAAQA,WAAR;;AACA,2BAA0BvB,KAAK,CAACsB,UAAN,CAAiBP,gBAAjB,CAA1B;AAAA,MAAQS,aAAR,sBAAQA,aAAR;;AACA,MAAMkB,UAAU,GAAGP,MAAM,IAAIG,KAAK,KAAK3B,QAAQ,CAACgC,OAAhD;AACA,MAAIC,OAAO,GAAGJ,KAAK,KAAKK,SAAV,GAAsBL,KAAtB,GAA8Bf,QAAQ,KAAKlB,QAAQ,CAACC,KAAlE,CALsB,CAOtB;;AACA,MAAMU,MAAM,GAAGW,WAAH,aAAGA,WAAH,cAAGA,WAAH,GAAkBC,IAA9B;AACA,MAAMX,KAAK,GAAGY,UAAH,aAAGA,UAAH,cAAGA,UAAH,GAAiBC,KAA5B;;AAEA,MAAIc,OAAO,CAACC,GAAR,CAAYC,QAAZ,KAAyB,aAA7B,EAA4C;AAC1ChB,IAAAA,KAAK,IACHL,IAAI,CACF,qEADE,CADN;AAIAG,IAAAA,IAAI,IACFH,IAAI,CACF,qEADE,CADN;AAID,GApBqB,CAqBtB;;;AAEA,MAAMsB,UAAU,GAAG;AAAE/B,IAAAA,MAAM,EAANA,MAAF;AAAUC,IAAAA,KAAK,EAALA,KAAV;AAAiBC,IAAAA,SAAS,EAATA,SAAjB;AAA4BC,IAAAA,QAAQ,EAARA;AAA5B,GAAnB;AAEA,SACE,wCACMoB,SADN;AAEE;AACA,IAAA,SAAS,EAAEtC,UAAU,CACnBD,YAAY,CAAC,aAAD,EAAgBuB,QAAhB,CADO,EAEnB;AACE,4BAAsBS,WADxB;AAEE,6BAAuBQ,UAFzB;AAGE,0BAAoBT,KAHtB;AAIE,0BAAoBb,SAAS,IAAIa,KAJnC;AAKE,6BACEV,WAAW,KAAKb,WAAW,CAACwC,MAA5B,IAAsC,CAAC1B,aAN3C;AAOE,gCAA0B,CAACN,MAP7B;AAQE,+BAAyB,CAACC,KAR5B;AASE,4BAAsByB;AATxB,KAFmB,+BAaGN,KAbH,EAHvB;AAkBE,IAAA,GAAG,EAAEM,OAAO,GAAGP,UAAH,GAAgBD;AAlB9B,MAoBGQ,OAAO,GACN,oBAAC,WAAD;AACE,IAAA,SAAS,EAAC,oBADZ;AAEE,IAAA,QAAQ,EAAC,KAFX;AAGE,IAAA,UAAU,EAAER;AAHd,KAKE,oBAAC,aAAD,EAAmBa,UAAnB,CALF,CADM,GASN,oBAAC,aAAD,EAAmBA,UAAnB,CA7BJ,EA+BG7B,SAAS,IACRa,KADD,IAECR,QAAQ,KAAKjB,KAFd,KAGE8B,KAAK,KAAK3B,QAAQ,CAACgC,OAAnB,GAA6B,oBAAC,OAAD;AAAS,IAAA,IAAI,EAAE;AAAf,IAA7B,GAAqD,oBAAC,SAAD,OAHvD,CA/BH,CADF;AAsCD,CAjFD;AAmFA;AACA;AACA;;;AACA,OAAO,IAAMQ,WAAW,GAAGvC,cAAc,CAACgB,oBAAD,EAAuB;AAC9DU,EAAAA,KAAK,EAAE,IADuD;AAE9DC,EAAAA,KAAK,EAAE;AAFuD,CAAvB,CAAlC","sourcesContent":["import * as React from \"react\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { FixedLayout } from \"../FixedLayout/FixedLayout\";\nimport { Separator } from \"../Separator/Separator\";\nimport { Platform, VKCOM } from \"../../lib/platform\";\nimport { HasRef, HasRootRef } from \"../../types\";\nimport {\n ConfigProviderContext,\n WebviewType,\n} from \"../ConfigProvider/ConfigProviderContext\";\nimport {\n AdaptivityProps,\n SizeType,\n withAdaptivity,\n} from \"../../hoc/withAdaptivity\";\nimport { Text } from \"../Typography/Text/Text\";\nimport { TooltipContainer } from \"../Tooltip/TooltipContainer\";\nimport { ModalRootContext } from \"../ModalRoot/ModalRootContext\";\nimport { Spacing } from \"../Spacing/Spacing\";\nimport \"./PanelHeader.css\";\n\nexport interface PanelHeaderProps\n extends React.HTMLAttributes<HTMLDivElement>,\n HasRef<HTMLDivElement>,\n HasRootRef<HTMLDivElement>,\n AdaptivityProps {\n before?: React.ReactNode;\n /**\n * @deprecated Будет удалено в 5.0.0. Используйте `before`\n */\n left?: React.ReactNode;\n after?: React.ReactNode;\n /**\n * @deprecated Будет удалено в 5.0.0. Используйте `after`\n */\n right?: React.ReactNode;\n separator?: boolean;\n transparent?: boolean;\n shadow?: boolean;\n /**\n * Если `false`, то шапка будет нулевой высоты и контент панели \"залезет\" под неё\n */\n visor?: boolean;\n /**\n * Если `false`, то шапка будет в потоке. По умолчанию `true`, но если платформа vkcom, то по умолчанию `false`.\n */\n fixed?: boolean;\n}\n\nconst PanelHeaderIn = ({\n before,\n after,\n separator,\n children,\n}: PanelHeaderProps) => {\n const { webviewType } = React.useContext(ConfigProviderContext);\n const { isInsideModal } = React.useContext(ModalRootContext);\n const platform = usePlatform();\n\n return (\n <React.Fragment>\n <TooltipContainer fixed vkuiClass=\"PanelHeader__in\">\n <div vkuiClass=\"PanelHeader__before\">{before}</div>\n <div vkuiClass=\"PanelHeader__content\">\n {platform === VKCOM ? (\n <Text weight=\"2\">{children}</Text>\n ) : (\n <span vkuiClass=\"PanelHeader__content-in\">{children}</span>\n )}\n </div>\n <div vkuiClass=\"PanelHeader__after\">\n {(webviewType === WebviewType.INTERNAL || isInsideModal) && after}\n </div>\n </TooltipContainer>\n {separator && platform === VKCOM && <Separator wide />}\n </React.Fragment>\n );\n};\n\nconst warn = warnOnce(\"PanelHeader\");\nconst PanelHeaderComponent = ({\n // TODO: поправить перед 5.0.0\n before: propsBefore,\n left,\n after: propsAfter,\n right,\n // /end TODO\n children,\n separator = true,\n visor = true,\n transparent = false,\n shadow,\n getRef,\n getRootRef,\n sizeX,\n sizeY,\n fixed,\n ...restProps\n}: PanelHeaderProps) => {\n const platform = usePlatform();\n const { webviewType } = React.useContext(ConfigProviderContext);\n const { isInsideModal } = React.useContext(ModalRootContext);\n const needShadow = shadow && sizeX === SizeType.REGULAR;\n let isFixed = fixed !== undefined ? fixed : platform !== Platform.VKCOM;\n\n // TODO: удалить перед 5.0.0\n const before = propsBefore ?? left;\n const after = propsAfter ?? right;\n\n if (process.env.NODE_ENV === \"development\") {\n right &&\n warn(\n \"Свойство right устарелo и будет удалено в 5.0.0. Используйте after.\"\n );\n left &&\n warn(\n \"Свойство left устарелo и будет удалено в 5.0.0. Используйте before.\"\n );\n }\n // /end TODO\n\n const innerProps = { before, after, separator, children };\n\n return (\n <div\n {...restProps}\n // eslint-disable-next-line vkui/no-object-expression-in-arguments\n vkuiClass={classNames(\n getClassName(\"PanelHeader\", platform),\n {\n \"PanelHeader--trnsp\": transparent,\n \"PanelHeader--shadow\": needShadow,\n \"PanelHeader--vis\": visor,\n \"PanelHeader--sep\": separator && visor,\n \"PanelHeader--vkapps\":\n webviewType === WebviewType.VKAPPS && !isInsideModal,\n \"PanelHeader--no-before\": !before,\n \"PanelHeader--no-after\": !after,\n \"PanelHeader--fixed\": isFixed,\n },\n `PanelHeader--sizeX-${sizeX}`\n )}\n ref={isFixed ? getRootRef : getRef}\n >\n {isFixed ? (\n <FixedLayout\n vkuiClass=\"PanelHeader__fixed\"\n vertical=\"top\"\n getRootRef={getRef}\n >\n <PanelHeaderIn {...innerProps} />\n </FixedLayout>\n ) : (\n <PanelHeaderIn {...innerProps} />\n )}\n {separator &&\n visor &&\n platform !== VKCOM &&\n (sizeX === SizeType.REGULAR ? <Spacing size={16} /> : <Separator />)}\n </div>\n );\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeader\n */\nexport const PanelHeader = withAdaptivity(PanelHeaderComponent, {\n sizeX: true,\n sizeY: true,\n});\n"],"file":"PanelHeader.js"}
1
+ {"version":3,"sources":["../../../../src/components/PanelHeader/PanelHeader.tsx"],"names":["React","usePlatform","getClassName","classNames","warnOnce","FixedLayout","Separator","Platform","VKCOM","ConfigProviderContext","WebviewType","SizeType","withAdaptivity","Text","TooltipContainer","ModalRootContext","Spacing","PanelHeaderIn","before","after","separator","children","useContext","webviewType","isInsideModal","platform","INTERNAL","warn","PanelHeaderComponent","propsBefore","left","propsAfter","right","visor","transparent","shadow","getRef","getRootRef","sizeX","sizeY","fixed","restProps","needShadow","REGULAR","isFixed","undefined","process","env","NODE_ENV","innerProps","VKAPPS","PanelHeader","displayName"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { FixedLayout } from \"../FixedLayout/FixedLayout\";\nimport { Separator } from \"../Separator/Separator\";\nimport { Platform, VKCOM } from \"../../lib/platform\";\nimport { HasRef, HasRootRef } from \"../../types\";\nimport {\n ConfigProviderContext,\n WebviewType,\n} from \"../ConfigProvider/ConfigProviderContext\";\nimport {\n AdaptivityProps,\n SizeType,\n withAdaptivity,\n} from \"../../hoc/withAdaptivity\";\nimport { Text } from \"../Typography/Text/Text\";\nimport { TooltipContainer } from \"../Tooltip/TooltipContainer\";\nimport { ModalRootContext } from \"../ModalRoot/ModalRootContext\";\nimport { Spacing } from \"../Spacing/Spacing\";\nimport \"./PanelHeader.css\";\n\nexport interface PanelHeaderProps\n extends React.HTMLAttributes<HTMLDivElement>,\n HasRef<HTMLDivElement>,\n HasRootRef<HTMLDivElement>,\n AdaptivityProps {\n before?: React.ReactNode;\n /**\n * @deprecated Будет удалено в 5.0.0. Используйте `before`\n */\n left?: React.ReactNode;\n after?: React.ReactNode;\n /**\n * @deprecated Будет удалено в 5.0.0. Используйте `after`\n */\n right?: React.ReactNode;\n separator?: boolean;\n transparent?: boolean;\n shadow?: boolean;\n /**\n * Если `false`, то шапка будет нулевой высоты и контент панели \"залезет\" под неё\n */\n visor?: boolean;\n /**\n * Если `false`, то шапка будет в потоке. По умолчанию `true`, но если платформа vkcom, то по умолчанию `false`.\n */\n fixed?: boolean;\n}\n\nconst PanelHeaderIn = ({\n before,\n after,\n separator,\n children,\n}: PanelHeaderProps) => {\n const { webviewType } = React.useContext(ConfigProviderContext);\n const { isInsideModal } = React.useContext(ModalRootContext);\n const platform = usePlatform();\n\n return (\n <React.Fragment>\n <TooltipContainer fixed vkuiClass=\"PanelHeader__in\">\n <div vkuiClass=\"PanelHeader__before\">{before}</div>\n <div vkuiClass=\"PanelHeader__content\">\n {platform === VKCOM ? (\n <Text weight=\"2\">{children}</Text>\n ) : (\n <span vkuiClass=\"PanelHeader__content-in\">{children}</span>\n )}\n </div>\n <div vkuiClass=\"PanelHeader__after\">\n {(webviewType === WebviewType.INTERNAL || isInsideModal) && after}\n </div>\n </TooltipContainer>\n {separator && platform === VKCOM && <Separator wide />}\n </React.Fragment>\n );\n};\n\nconst warn = warnOnce(\"PanelHeader\");\nconst PanelHeaderComponent = ({\n // TODO: поправить перед 5.0.0\n before: propsBefore,\n left,\n after: propsAfter,\n right,\n // /end TODO\n children,\n separator = true,\n visor = true,\n transparent = false,\n shadow,\n getRef,\n getRootRef,\n sizeX,\n sizeY,\n fixed,\n ...restProps\n}: PanelHeaderProps) => {\n const platform = usePlatform();\n const { webviewType } = React.useContext(ConfigProviderContext);\n const { isInsideModal } = React.useContext(ModalRootContext);\n const needShadow = shadow && sizeX === SizeType.REGULAR;\n let isFixed = fixed !== undefined ? fixed : platform !== Platform.VKCOM;\n\n // TODO: удалить перед 5.0.0\n const before = propsBefore ?? left;\n const after = propsAfter ?? right;\n\n if (process.env.NODE_ENV === \"development\") {\n right &&\n warn(\n \"Свойство right устарелo и будет удалено в 5.0.0. Используйте after.\"\n );\n left &&\n warn(\n \"Свойство left устарелo и будет удалено в 5.0.0. Используйте before.\"\n );\n }\n // /end TODO\n\n const innerProps = { before, after, separator, children };\n\n return (\n <div\n {...restProps}\n // eslint-disable-next-line vkui/no-object-expression-in-arguments\n vkuiClass={classNames(\n getClassName(\"PanelHeader\", platform),\n {\n \"PanelHeader--trnsp\": transparent,\n \"PanelHeader--shadow\": needShadow,\n \"PanelHeader--vis\": visor,\n \"PanelHeader--sep\": separator && visor,\n \"PanelHeader--vkapps\":\n webviewType === WebviewType.VKAPPS && !isInsideModal,\n \"PanelHeader--no-before\": !before,\n \"PanelHeader--no-after\": !after,\n \"PanelHeader--fixed\": isFixed,\n },\n `PanelHeader--sizeX-${sizeX}`\n )}\n ref={isFixed ? getRootRef : getRef}\n >\n {isFixed ? (\n <FixedLayout\n vkuiClass=\"PanelHeader__fixed\"\n vertical=\"top\"\n getRootRef={getRef}\n >\n <PanelHeaderIn {...innerProps} />\n </FixedLayout>\n ) : (\n <PanelHeaderIn {...innerProps} />\n )}\n {separator &&\n visor &&\n platform !== VKCOM &&\n (sizeX === SizeType.REGULAR ? <Spacing size={16} /> : <Separator />)}\n </div>\n );\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeader\n */\nexport const PanelHeader = withAdaptivity(PanelHeaderComponent, {\n sizeX: true,\n sizeY: true,\n});\n\nPanelHeader.displayName = \"PanelHeader\";\n"],"file":"PanelHeader.js"}
@@ -9,4 +9,4 @@ export declare type PanelHeaderBackProps = PanelHeaderButtonProps & AdaptivityPr
9
9
  * @see https://vkcom.github.io/VKUI/#/PanelHeaderBack
10
10
  */
11
11
  export declare const PanelHeaderBackComponent: ({ label, sizeX, "aria-label": ariaLabel, ...restProps }: PanelHeaderButtonProps & AdaptivityProps) => JSX.Element;
12
- export declare const PanelHeaderBack: React.MemoExoticComponent<React.ComponentType<Pick<PanelHeaderButtonProps & AdaptivityProps, "max" | "required" | "high" | "low" | "disabled" | "default" | "start" | "open" | "media" | "hidden" | "cite" | "data" | "dir" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "async" | "defer" | "manifest" | "color" | "content" | "size" | "wrap" | "multiple" | "height" | "translate" | "width" | "prefix" | "src" | "children" | "className" | "id" | "lang" | "method" | "min" | "name" | "target" | "type" | "role" | "tabIndex" | "crossOrigin" | "href" | "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" | "onMouseDownCapture" | "onMouseEnter" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancelCapture" | "onTouchEndCapture" | "onTouchMoveCapture" | "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" | "list" | "classID" | "useMap" | "wmode" | "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" | "as" | "hrefLang" | "integrity" | "rel" | "sizes" | "charSet" | "kind" | "srcLang" | "value" | "download" | "alt" | "coords" | "shape" | "autoPlay" | "controls" | "loop" | "mediaGroup" | "muted" | "playsInline" | "preload" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "dateTime" | "acceptCharset" | "action" | "autoComplete" | "encType" | "noValidate" | "allowFullScreen" | "allowTransparency" | "frameBorder" | "marginHeight" | "marginWidth" | "sandbox" | "scrolling" | "seamless" | "srcDoc" | "srcSet" | "accept" | "capture" | "checked" | "maxLength" | "minLength" | "readOnly" | "step" | "htmlFor" | "httpEquiv" | "optimum" | "reversed" | "selected" | "nonce" | "scoped" | "cellPadding" | "cellSpacing" | "colSpan" | "headers" | "rowSpan" | "scope" | "cols" | "rows" | "poster" | "challenge" | "keyType" | "keyParams" | "onStart" | "onMove" | "onLeave" | "onEnter" | "onEnd" | "Component" | "getRootRef" | "stopPropagation" | "activeEffectDelay" | "hasHover" | "hoverMode" | "hasActive" | "activeMode" | "focusVisibleMode" | "primary"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>>;
12
+ export declare const PanelHeaderBack: React.NamedExoticComponent<Pick<PanelHeaderButtonProps & AdaptivityProps, "max" | "required" | "high" | "low" | "disabled" | "default" | "start" | "open" | "media" | "hidden" | "cite" | "data" | "dir" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "async" | "defer" | "manifest" | "color" | "content" | "size" | "wrap" | "multiple" | "height" | "translate" | "width" | "prefix" | "src" | "children" | "className" | "id" | "lang" | "method" | "min" | "name" | "target" | "type" | "role" | "tabIndex" | "crossOrigin" | "href" | "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" | "onMouseDownCapture" | "onMouseEnter" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancelCapture" | "onTouchEndCapture" | "onTouchMoveCapture" | "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" | "list" | "classID" | "useMap" | "wmode" | "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" | "as" | "hrefLang" | "integrity" | "rel" | "sizes" | "charSet" | "kind" | "srcLang" | "value" | "download" | "alt" | "coords" | "shape" | "autoPlay" | "controls" | "loop" | "mediaGroup" | "muted" | "playsInline" | "preload" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "dateTime" | "acceptCharset" | "action" | "autoComplete" | "encType" | "noValidate" | "allowFullScreen" | "allowTransparency" | "frameBorder" | "marginHeight" | "marginWidth" | "sandbox" | "scrolling" | "seamless" | "srcDoc" | "srcSet" | "accept" | "capture" | "checked" | "maxLength" | "minLength" | "readOnly" | "step" | "htmlFor" | "httpEquiv" | "optimum" | "reversed" | "selected" | "nonce" | "scoped" | "cellPadding" | "cellSpacing" | "colSpan" | "headers" | "rowSpan" | "scope" | "cols" | "rows" | "poster" | "challenge" | "keyType" | "keyParams" | "onStart" | "onMove" | "onLeave" | "onEnter" | "onEnd" | "Component" | "getRootRef" | "stopPropagation" | "activeEffectDelay" | "hasHover" | "hoverMode" | "hasActive" | "activeMode" | "focusVisibleMode" | "primary"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;
@@ -1 +1 @@
1
- .vkuiPanelHeaderButton{-webkit-appearance:none;appearance:none;background:0 0;border:0;box-shadow:none;display:block;color:currentColor;padding:0;margin:0;position:relative}.vkuiPanelHeaderButton[disabled]{opacity:.6}.vkuiPanelHeaderButton .vkuiCounter{position:absolute;padding:0;top:8px;right:2px}.vkuiPanelHeaderButton--ios{position:relative;display:flex;align-items:center;font-size:17px}.vkuiPanelHeaderButton--ios.vkuiPanelHeaderButton--primitive{height:44px;line-height:44px;padding:0 12px}.vkuiPanelHeaderButton--ios .vkuiIcon--24{padding:10px}.vkuiPanelHeaderButton--ios .vkuiIcon--28{padding:8px}.vkuiPanelHeaderButton--android{border-radius:50%}.vkuiPanelHeaderButton--android.vkuiPanelHeaderButton--primitive{height:48px;line-height:48px;padding:0 12px}.vkuiPanelHeaderButton--android .vkuiIcon--24{padding:12px}.vkuiPanelHeaderButton--android .vkuiIcon--28{padding:10px}.vkuiPanelHeaderButton--vkcom{color:#818c99;color:var(--header_text_secondary)}.vkuiPanelHeaderButton--vkcom>:not(.vkuiCounter){transition:opacity .3s;opacity:.7}.vkuiPanelHeaderButton--vkcom.vkuiPanelHeaderButton--hover>:not(.vkuiCounter),.vkuiPanelHeaderButton--vkcom.vkuiPanelHeaderButton--active>:not(.vkuiCounter){opacity:1}.vkuiPanelHeaderButton--vkcom{display:flex;align-items:center;padding:10px}.vkuiPanelHeaderButton--vkcom.vkuiPanelHeaderButton--primitive{height:48px;line-height:48px;padding:0 10px}.vkuiPanelHeaderButton--vkcom.vkuiPanelHeaderButton--notPrimitive{border-radius:50%}
1
+ .vkuiPanelHeaderButton{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;box-shadow:none;color:currentColor;display:block;margin:0;padding:0;position:relative}.vkuiPanelHeaderButton[disabled]{opacity:.6}.vkuiPanelHeaderButton .vkuiCounter{padding:0;position:absolute;right:2px;top:8px}.vkuiPanelHeaderButton--ios{align-items:center;display:flex;font-size:17px;position:relative}.vkuiPanelHeaderButton--ios.vkuiPanelHeaderButton--primitive{height:44px;line-height:44px;padding:0 12px}.vkuiPanelHeaderButton--ios .vkuiIcon--24{padding:10px}.vkuiPanelHeaderButton--ios .vkuiIcon--28{padding:8px}.vkuiPanelHeaderButton--android{border-radius:50%}.vkuiPanelHeaderButton--android.vkuiPanelHeaderButton--primitive{height:48px;line-height:48px;padding:0 12px}.vkuiPanelHeaderButton--android .vkuiIcon--24{padding:12px}.vkuiPanelHeaderButton--android .vkuiIcon--28{padding:10px}.vkuiPanelHeaderButton--vkcom{color:#818c99;color:var(--header_text_secondary)}.vkuiPanelHeaderButton--vkcom>:not(.vkuiCounter){opacity:.7;transition:opacity .3s}.vkuiPanelHeaderButton--vkcom.vkuiPanelHeaderButton--active>:not(.vkuiCounter),.vkuiPanelHeaderButton--vkcom.vkuiPanelHeaderButton--hover>:not(.vkuiCounter){opacity:1}.vkuiPanelHeaderButton--vkcom{align-items:center;display:flex;padding:10px}.vkuiPanelHeaderButton--vkcom.vkuiPanelHeaderButton--primitive{height:48px;line-height:48px;padding:0 10px}.vkuiPanelHeaderButton--vkcom.vkuiPanelHeaderButton--notPrimitive{border-radius:50%}
@@ -1 +1 @@
1
- .vkuiPanelHeaderContent{line-height:initial;height:100%;max-width:100%;box-sizing:border-box;display:flex;align-items:center;justify-content:flex-start;font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--font-common)}.vkuiPanelHeaderContent__before{flex-shrink:0;margin-right:12px}.vkuiPanelHeaderContent__in{flex-grow:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;height:100%}.vkuiPanelHeaderContent__status,.vkuiPanelHeaderContent__children-in,.vkuiPanelHeaderContent__children .vkuiHeadline{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.vkuiPanelHeaderContent__status{order:1;margin-top:1px;max-width:100%;color:#818c99;color:var(--header_text_secondary)}.vkuiPanelHeaderContent__children{max-width:100%;display:flex;align-items:center}.vkuiPanelHeaderContent__children-in{flex-grow:0;min-width:0}.vkuiPanelHeaderContent__aside{display:flex;align-items:center;justify-content:flex-start;margin-left:2px;color:#2688eb;color:var(--header_tint)}.vkuiPanelHeaderContent__width{width:1000px}.vkuiPanelHeaderContent--ios .vkuiPanelHeaderContent__before~.vkuiPanelHeaderContent__in{align-items:flex-start}.vkuiPanelHeaderContent--ios .vkuiPanelHeaderContent__in{align-items:center}.vkuiPanelHeaderContent--ios .vkuiPanelHeaderContent__children-in{font-size:21px;font-family:"VK Sans Display",-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--font-display);font-weight:500;line-height:52px;line-height:var(--panelheader_height_ios)}.vkuiPanelHeaderContent--android .vkuiPanelHeaderContent__children-in{font-size:23px;font-family:"VK Sans Display",-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--font-display);font-weight:500;line-height:56px;line-height:var(--panelheader_height)}.vkuiPanelHeaderContent--vkcom .vkuiPanelHeaderContent__before~.vkuiPanelHeaderContent__in{align-items:flex-start}.vkuiPanelHeaderContent--vkcom .vkuiPanelHeaderContent__in{align-items:center}
1
+ .vkuiPanelHeaderContent{align-items:center;box-sizing:border-box;display:flex;font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--font-common);height:100%;justify-content:flex-start;line-height:normal;max-width:100%}.vkuiPanelHeaderContent__before{flex-shrink:0;margin-right:12px}.vkuiPanelHeaderContent__in{align-items:flex-start;display:flex;flex-direction:column;flex-grow:1;height:100%;justify-content:center;min-width:0}.vkuiPanelHeaderContent__children .vkuiHeadline,.vkuiPanelHeaderContent__children-in,.vkuiPanelHeaderContent__status{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vkuiPanelHeaderContent__status{color:#818c99;color:var(--header_text_secondary);margin-top:1px;max-width:100%;order:1}.vkuiPanelHeaderContent__children{align-items:center;display:flex;max-width:100%}.vkuiPanelHeaderContent__children-in{flex-grow:0;min-width:0}.vkuiPanelHeaderContent__aside{align-items:center;color:#2688eb;color:var(--header_tint);display:flex;justify-content:flex-start;margin-left:2px}.vkuiPanelHeaderContent__width{width:1000px}.vkuiPanelHeaderContent--ios .vkuiPanelHeaderContent__before~.vkuiPanelHeaderContent__in{align-items:flex-start}.vkuiPanelHeaderContent--ios .vkuiPanelHeaderContent__in{align-items:center}.vkuiPanelHeaderContent--ios .vkuiPanelHeaderContent__children-in{font-family:VK Sans Display,-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--font-display);font-size:21px;font-weight:500;line-height:52px;line-height:var(--panelheader_height_ios)}.vkuiPanelHeaderContent--android .vkuiPanelHeaderContent__children-in{font-family:VK Sans Display,-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--font-display);font-size:23px;font-weight:500;line-height:56px;line-height:var(--panelheader_height)}.vkuiPanelHeaderContent--vkcom .vkuiPanelHeaderContent__before~.vkuiPanelHeaderContent__in{align-items:flex-start}.vkuiPanelHeaderContent--vkcom .vkuiPanelHeaderContent__in{align-items:center}
@@ -1 +1 @@
1
- .vkuiPanelHeaderContext--opened,.vkuiPanelHeaderContext--closing{width:100%;height:100%}.vkuiPanelHeaderContext--desktop.vkuiPanelHeaderContext--opened,.vkuiPanelHeaderContext--desktop.vkuiPanelHeaderContext--closing{height:auto}.vkuiPanelHeaderContext__in{position:absolute;left:0;width:100%;z-index:2}.vkuiPanelHeaderContext__fade{position:absolute;width:100%;height:100%;left:0;top:0;z-index:1;background:rgba(0,0,0,.4)}.vkuiPanelHeaderContext--opened .vkuiPanelHeaderContext__fade{-webkit-animation:vkui-animation-panelheadercontext-fade-in .2s ease;animation:vkui-animation-panelheadercontext-fade-in .2s ease}.vkuiPanelHeaderContext--closing .vkuiPanelHeaderContext__fade{-webkit-animation:vkui-animation-panelheadercontext-fade-out .2s ease;animation:vkui-animation-panelheadercontext-fade-out .2s ease}.vkuiPanelHeaderContext--ios.vkuiPanelHeaderContext--opened .vkuiPanelHeaderContext__in{-webkit-animation:vkui-animation-panelheadercontext-translate-in .2s ease;animation:vkui-animation-panelheadercontext-translate-in .2s ease}.vkuiPanelHeaderContext--ios.vkuiPanelHeaderContext--closing .vkuiPanelHeaderContext__in{-webkit-animation:vkui-animation-panelheadercontext-translate-out .2s ease;animation:vkui-animation-panelheadercontext-translate-out .2s ease}.vkuiPanelHeaderContext--ios .vkuiList{background:#fff;background:var(--header_background)}.vkuiPanelHeaderContext--android .vkuiPanelHeaderContext__in,.vkuiPanelHeaderContext--vkcom .vkuiPanelHeaderContext__in{padding:8px;box-sizing:border-box}.vkuiPanelHeaderContext--android.vkuiPanelHeaderContext--opened .vkuiPanelHeaderContext__in,.vkuiPanelHeaderContext--vkcom.vkuiPanelHeaderContext--opened .vkuiPanelHeaderContext__in{-webkit-animation:vkui-animation-panelheadercontext-translate-in .2s ease;animation:vkui-animation-panelheadercontext-translate-in .2s ease}.vkuiPanelHeaderContext--android.vkuiPanelHeaderContext--closing .vkuiPanelHeaderContext__in,.vkuiPanelHeaderContext--vkcom.vkuiPanelHeaderContext--closing .vkuiPanelHeaderContext__in{-webkit-animation:vkui-animation-panelheadercontext-translate-out .2s ease;animation:vkui-animation-panelheadercontext-translate-out .2s ease}.vkuiPanelHeaderContext--android .vkuiList,.vkuiPanelHeaderContext--vkcom .vkuiList,.vkuiPanelHeaderContext--desktop.vkuiPanelHeaderContext--ios .vkuiList{overflow:hidden;border-radius:12px;padding:8px 0;background:#fff;background:var(--header_background)}.vkuiPanelHeaderContext--desktop .vkuiPanelHeaderContext__in{padding:12px 8px;box-sizing:border-box}.vkuiPanelHeaderContext--desktop .vkuiPanelHeaderContext__content{border-radius:12px;overflow:hidden;background:#fff;background:var(--header_background)}.vkuiPanelHeaderContext--desktop .vkuiPanelHeaderContext__content{box-shadow:0 0 4px rgba(0,0,0,.08),0 8px 8px rgba(0,0,0,.16)}@-webkit-keyframes vkui-animation-panelheadercontext-translate-in{0%{-webkit-transform:translateY(-100%);transform:translateY(-100%)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes vkui-animation-panelheadercontext-translate-in{0%{-webkit-transform:translateY(-100%);transform:translateY(-100%)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes vkui-animation-panelheadercontext-translate-out{0%{-webkit-transform:translateY(0);transform:translateY(0)}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}@keyframes vkui-animation-panelheadercontext-translate-out{0%{-webkit-transform:translateY(0);transform:translateY(0)}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}@-webkit-keyframes vkui-animation-panelheadercontext-fade-in{0%{opacity:0}to{opacity:1}}@keyframes vkui-animation-panelheadercontext-fade-in{0%{opacity:0}to{opacity:1}}@-webkit-keyframes vkui-animation-panelheadercontext-fade-out{0%{opacity:1}to{opacity:0}}@keyframes vkui-animation-panelheadercontext-fade-out{0%{opacity:1}to{opacity:0}}
1
+ .vkuiPanelHeaderContext--closing,.vkuiPanelHeaderContext--opened{height:100%;width:100%}.vkuiPanelHeaderContext--desktop.vkuiPanelHeaderContext--closing,.vkuiPanelHeaderContext--desktop.vkuiPanelHeaderContext--opened{height:auto}.vkuiPanelHeaderContext__in{left:0;position:absolute;width:100%;z-index:2}.vkuiPanelHeaderContext__fade{background:rgba(0,0,0,.4);height:100%;left:0;position:absolute;top:0;width:100%;z-index:1}.vkuiPanelHeaderContext--opened .vkuiPanelHeaderContext__fade{-webkit-animation:vkui-animation-panelheadercontext-fade-in .2s ease;animation:vkui-animation-panelheadercontext-fade-in .2s ease}.vkuiPanelHeaderContext--closing .vkuiPanelHeaderContext__fade{-webkit-animation:vkui-animation-panelheadercontext-fade-out .2s ease;animation:vkui-animation-panelheadercontext-fade-out .2s ease}.vkuiPanelHeaderContext--ios.vkuiPanelHeaderContext--opened .vkuiPanelHeaderContext__in{-webkit-animation:vkui-animation-panelheadercontext-translate-in .2s ease;animation:vkui-animation-panelheadercontext-translate-in .2s ease}.vkuiPanelHeaderContext--ios.vkuiPanelHeaderContext--closing .vkuiPanelHeaderContext__in{-webkit-animation:vkui-animation-panelheadercontext-translate-out .2s ease;animation:vkui-animation-panelheadercontext-translate-out .2s ease}.vkuiPanelHeaderContext--ios .vkuiList{background:#fff;background:var(--header_background)}.vkuiPanelHeaderContext--android .vkuiPanelHeaderContext__in,.vkuiPanelHeaderContext--vkcom .vkuiPanelHeaderContext__in{box-sizing:border-box;padding:8px}.vkuiPanelHeaderContext--android.vkuiPanelHeaderContext--opened .vkuiPanelHeaderContext__in,.vkuiPanelHeaderContext--vkcom.vkuiPanelHeaderContext--opened .vkuiPanelHeaderContext__in{-webkit-animation:vkui-animation-panelheadercontext-translate-in .2s ease;animation:vkui-animation-panelheadercontext-translate-in .2s ease}.vkuiPanelHeaderContext--android.vkuiPanelHeaderContext--closing .vkuiPanelHeaderContext__in,.vkuiPanelHeaderContext--vkcom.vkuiPanelHeaderContext--closing .vkuiPanelHeaderContext__in{-webkit-animation:vkui-animation-panelheadercontext-translate-out .2s ease;animation:vkui-animation-panelheadercontext-translate-out .2s ease}.vkuiPanelHeaderContext--android .vkuiList,.vkuiPanelHeaderContext--desktop.vkuiPanelHeaderContext--ios .vkuiList,.vkuiPanelHeaderContext--vkcom .vkuiList{background:#fff;background:var(--header_background);border-radius:12px;overflow:hidden;padding:8px 0}.vkuiPanelHeaderContext--desktop .vkuiPanelHeaderContext__in{box-sizing:border-box;padding:12px 8px}.vkuiPanelHeaderContext--desktop .vkuiPanelHeaderContext__content{background:#fff;background:var(--header_background);border-radius:12px;box-shadow:0 0 4px rgba(0,0,0,.08),0 8px 8px rgba(0,0,0,.16);overflow:hidden}@-webkit-keyframes vkui-animation-panelheadercontext-translate-in{0%{-webkit-transform:translateY(-100%);transform:translateY(-100%)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes vkui-animation-panelheadercontext-translate-in{0%{-webkit-transform:translateY(-100%);transform:translateY(-100%)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes vkui-animation-panelheadercontext-translate-out{0%{-webkit-transform:translateY(0);transform:translateY(0)}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}@keyframes vkui-animation-panelheadercontext-translate-out{0%{-webkit-transform:translateY(0);transform:translateY(0)}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}@-webkit-keyframes vkui-animation-panelheadercontext-fade-in{0%{opacity:0}to{opacity:1}}@keyframes vkui-animation-panelheadercontext-fade-in{0%{opacity:0}to{opacity:1}}@-webkit-keyframes vkui-animation-panelheadercontext-fade-out{0%{opacity:1}to{opacity:0}}@keyframes vkui-animation-panelheadercontext-fade-out{0%{opacity:1}to{opacity:0}}
@@ -1,3 +1,3 @@
1
- .vkuiPlaceholder{display:flex;align-items:center;justify-content:center}.vkuiPlaceholder--stretched{position:absolute;top:0;left:0;right:0;bottom:0;z-index:1;padding-top:inherit;padding-bottom:inherit}.vkuiPlaceholder__in{max-width:100%;text-align:center;box-sizing:border-box;padding:48px 32px}.vkuiPlaceholder__icon{margin-bottom:12px;display:inline-block;vertical-align:top;color:#aeb7c2;color:var(--placeholder_icon_foreground_secondary,
2
- var(--vkui--color_icon_secondary)
3
- )}.vkuiPlaceholder__header{color:#000;color:var(--text_primary, var(--vkui--color_text_primary))}.vkuiPlaceholder__text{color:#818c99;color:var(--text_placeholder, var(--vkui--color_text_secondary))}.vkuiPlaceholder__header+.vkuiPlaceholder__text{margin-top:8px}.vkuiPlaceholder__action:not(:first-child){margin-top:16px}
1
+ .vkuiPlaceholder{align-items:center;display:flex;justify-content:center}.vkuiPlaceholder--stretched{bottom:0;left:0;padding-bottom:inherit;padding-top:inherit;position:absolute;right:0;top:0;z-index:1}.vkuiPlaceholder__in{box-sizing:border-box;max-width:100%;padding:48px 32px;text-align:center}.vkuiPlaceholder__icon{color:#aeb7c2;color:var(
2
+ --placeholder_icon_foreground_secondary,var(--vkui--color_icon_secondary)
3
+ );display:inline-block;margin-bottom:12px;vertical-align:top}.vkuiPlaceholder__header{color:#000;color:var(--text_primary,var(--vkui--color_text_primary))}.vkuiPlaceholder__text{color:#818c99;color:var(--text_placeholder,var(--vkui--color_text_secondary))}.vkuiPlaceholder__header+.vkuiPlaceholder__text{margin-top:8px}.vkuiPlaceholder__action:not(:first-child){margin-top:16px}
@@ -1 +1 @@
1
- .vkuiPopoutRoot{width:100%;height:100%;position:relative}.vkuiPopoutRoot__popout{position:fixed;left:0;top:0;z-index:100;width:100%;height:100%}.vkuiPopoutRoot--absolute{position:absolute;left:0;top:0;z-index:100;width:100%;height:100%}.vkuiPopoutRoot__modal{position:fixed;left:0;top:0;z-index:99;width:100%;height:100%}.vkuiPopoutRoot__modal:empty{display:none}
1
+ .vkuiPopoutRoot{height:100%;position:relative;width:100%}.vkuiPopoutRoot__popout{height:100%;left:0;position:fixed;top:0;width:100%;z-index:100}.vkuiPopoutRoot--absolute{height:100%;left:0;position:absolute;top:0;width:100%;z-index:100}.vkuiPopoutRoot__modal{height:100%;left:0;position:fixed;top:0;width:100%;z-index:99}.vkuiPopoutRoot__modal:empty{display:none}
@@ -10,4 +10,4 @@ export declare const PopoutRootComponent: {
10
10
  ({ popout, modal, viewWidth, viewHeight, hasMouse, children, getRootRef, ...restProps }: PopoutRootProps & AdaptivityContextInterface): JSX.Element;
11
11
  displayName: string;
12
12
  };
13
- export declare const PopoutRoot: React.ComponentType<Pick<PopoutRootProps & AdaptivityContextInterface, "hidden" | "dir" | "slot" | "style" | "title" | "color" | "translate" | "prefix" | "children" | "className" | "id" | "lang" | "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" | "popout" | "modal" | "getRootRef"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;
13
+ export declare const PopoutRoot: React.FC<Pick<PopoutRootProps & AdaptivityContextInterface, "hidden" | "dir" | "slot" | "style" | "title" | "color" | "translate" | "prefix" | "children" | "className" | "id" | "lang" | "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" | "popout" | "modal" | "getRootRef"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;
@@ -1 +1 @@
1
- .vkuiPopoutWrapper{width:100%;height:100%;box-sizing:border-box;left:0;top:0;pointer-events:none}.vkuiPopoutWrapper--opened{pointer-events:initial}.vkuiPopoutWrapper--closing{pointer-events:none}.vkuiPopoutWrapper--fixed{position:fixed}.vkuiPopoutWrapper__overlay{position:fixed;left:0;top:0;width:100%;height:100%;opacity:1;-webkit-animation:vkui-animation-full-fade-in .2s ease;animation:vkui-animation-full-fade-in .2s ease;-webkit-animation:vkui-animation-full-fade-in var(--vkui--animation_duration_m,0.2s) ease;animation:vkui-animation-full-fade-in var(--vkui--animation_duration_m,0.2s) ease}.vkuiPopoutWrapper--closing .vkuiPopoutWrapper__overlay{opacity:0;transition:opacity .2s cubic-bezier(.3,.3,.5,1);transition:opacity var(--vkui--animation_duration_m,0.2s) var(--vkui--animation_easing_default,cubic-bezier(0.3, 0.3, 0.5, 1))}.vkuiPopoutWrapper--masked .vkuiPopoutWrapper__overlay{background:rgba(0,0,0,.4);background:var(--vkui--color_overlay_primary,rgba(0, 0, 0, 0.4))}.vkuiPopoutWrapper--fixed .vkuiPopoutWrapper__overlay{position:absolute}.vkuiPopoutWrapper__container{width:100%;height:100%;position:relative;display:flex;box-sizing:border-box}.vkuiPopoutWrapper__content{display:flex;justify-content:center;width:100%;z-index:2;pointer-events:none}.vkuiPopoutWrapper__content>*{pointer-events:auto}.vkuiPopoutWrapper--v-center .vkuiPopoutWrapper__container{align-items:center}.vkuiPopoutWrapper--v-bottom .vkuiPopoutWrapper__container{align-items:flex-end}.vkuiPopoutWrapper--v-top .vkuiPopoutWrapper__container{align-items:flex-start}.vkuiPopoutWrapper--h-center .vkuiPopoutWrapper__container{justify-content:center}.vkuiPopoutWrapper--h-left .vkuiPopoutWrapper__container{justify-content:flex-start}.vkuiPopoutWrapper--h-right .vkuiPopoutWrapper__container{justify-content:flex-end}@-webkit-keyframes vkui-animation-full-fade-in{0%{opacity:0}to{opacity:1}}@keyframes vkui-animation-full-fade-in{0%{opacity:0}to{opacity:1}}
1
+ .vkuiPopoutWrapper{box-sizing:border-box;height:100%;left:0;pointer-events:none;top:0;width:100%}.vkuiPopoutWrapper--opened{pointer-events:auto}.vkuiPopoutWrapper--closing{pointer-events:none}.vkuiPopoutWrapper--fixed{position:fixed}.vkuiPopoutWrapper__overlay{-webkit-animation:vkui-animation-full-fade-in .2s ease;animation:vkui-animation-full-fade-in .2s ease;-webkit-animation:vkui-animation-full-fade-in var(--vkui--animation_duration_m,.2s) ease;animation:vkui-animation-full-fade-in var(--vkui--animation_duration_m,.2s) ease;height:100%;left:0;opacity:1;position:fixed;top:0;width:100%}.vkuiPopoutWrapper--closing .vkuiPopoutWrapper__overlay{opacity:0;transition:opacity .2s cubic-bezier(.3,.3,.5,1);transition:opacity var(--vkui--animation_duration_m,.2s) var(--vkui--animation_easing_default,cubic-bezier(.3,.3,.5,1))}.vkuiPopoutWrapper--masked .vkuiPopoutWrapper__overlay{background:rgba(0,0,0,.4);background:var(--vkui--color_overlay_primary,rgba(0,0,0,.4))}.vkuiPopoutWrapper--fixed .vkuiPopoutWrapper__overlay{position:absolute}.vkuiPopoutWrapper__container{box-sizing:border-box;display:flex;height:100%;position:relative;width:100%}.vkuiPopoutWrapper__content{display:flex;justify-content:center;pointer-events:none;width:100%;z-index:2}.vkuiPopoutWrapper__content>*{pointer-events:auto}.vkuiPopoutWrapper--v-center .vkuiPopoutWrapper__container{align-items:center}.vkuiPopoutWrapper--v-bottom .vkuiPopoutWrapper__container{align-items:flex-end}.vkuiPopoutWrapper--v-top .vkuiPopoutWrapper__container{align-items:flex-start}.vkuiPopoutWrapper--h-center .vkuiPopoutWrapper__container{justify-content:center}.vkuiPopoutWrapper--h-left .vkuiPopoutWrapper__container{justify-content:flex-start}.vkuiPopoutWrapper--h-right .vkuiPopoutWrapper__container{justify-content:flex-end}@-webkit-keyframes vkui-animation-full-fade-in{0%{opacity:0}to{opacity:1}}@keyframes vkui-animation-full-fade-in{0%{opacity:0}to{opacity:1}}
@@ -1 +1 @@
1
- .vkuiPopper{z-index:100}.vkuiPopper__arrow-in{content:"";display:block;width:20px;height:8px}[data-popper-placement^=bottom] .vkuiPopper__arrow{bottom:100%}[data-popper-placement^=top] .vkuiPopper__arrow{top:100%}[data-popper-placement^=top] .vkuiPopper__arrow-in{-webkit-transform:rotate(180deg);transform:rotate(180deg)}[data-popper-placement^=left] .vkuiPopper__arrow{left:calc(100% - 6px)}[data-popper-placement^=left] .vkuiPopper__arrow-in{-webkit-transform:rotate(90deg);transform:rotate(90deg)}[data-popper-placement^=right] .vkuiPopper__arrow{right:calc(100% - 6px)}[data-popper-placement^=right] .vkuiPopper__arrow-in{-webkit-transform:rotate(270deg);transform:rotate(270deg)}
1
+ .vkuiPopper{z-index:100}
@@ -3,6 +3,9 @@ import { Modifier } from "react-popper";
3
3
  import { HasRef } from "../../types";
4
4
  import "./Popper.css";
5
5
  export declare type Placement = "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end" | "top" | "bottom" | "left" | "right";
6
+ export interface PopperRenderContentProps {
7
+ className: string;
8
+ }
6
9
  export interface PopperCommonProps extends React.HTMLAttributes<HTMLDivElement>, HasRef<HTMLDivElement> {
7
10
  /**
8
11
  * По умолчанию компонент выберет наилучшее расположение сам. Но его можно задать извне с помощью этого свойства
@@ -16,7 +19,13 @@ export interface PopperCommonProps extends React.HTMLAttributes<HTMLDivElement>,
16
19
  * Отступ по главной оси
17
20
  */
18
21
  offsetDistance?: number;
22
+ /**
23
+ * Отображать ли стрелку, указывающую на якорный элемент
24
+ */
19
25
  arrow?: boolean;
26
+ /**
27
+ * Стиль стрелки
28
+ */
20
29
  arrowClassName?: string;
21
30
  /**
22
31
  * Выставлять ширину равной target элементу
@@ -30,6 +39,14 @@ export interface PopperCommonProps extends React.HTMLAttributes<HTMLDivElement>,
30
39
  * Массив кастомных модификаторов для Popper (необходимо мемоизировать)
31
40
  */
32
41
  customModifiers?: Array<Modifier<string>>;
42
+ /**
43
+ * При передаче содержимого в `children`, он будет обёрнут во внутренний контейнер.
44
+ *
45
+ * Если хочется управлять этим контейнером, то используйте данную функцию.
46
+ *
47
+ * > ⚠️ Параметр `children` будет проигнорирован.
48
+ */
49
+ renderContent?(props: PopperRenderContentProps): React.ReactNode;
33
50
  }
34
51
  export interface PopperProps extends PopperCommonProps {
35
52
  targetRef: React.RefObject<HTMLElement>;
@@ -37,4 +54,4 @@ export interface PopperProps extends PopperCommonProps {
37
54
  /**
38
55
  * @see https://vkcom.github.io/VKUI/#/Popper
39
56
  */
40
- export declare const Popper: ({ targetRef, children, getRef, placement, onPlacementChange, arrow, arrowClassName, sameWidth, offsetDistance, offsetSkidding, forcePortal, style: compStyles, customModifiers, ...restProps }: PopperProps) => JSX.Element;
57
+ export declare const Popper: ({ targetRef, children, getRef, placement, onPlacementChange, arrow, arrowClassName, sameWidth, offsetDistance, offsetSkidding, forcePortal, style: compStyles, customModifiers, renderContent, ...restProps }: PopperProps) => JSX.Element;
@@ -3,11 +3,12 @@ import _objectSpread from "@babel/runtime/helpers/objectSpread2";
3
3
  import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
4
4
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
5
5
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
6
- var _excluded = ["targetRef", "children", "getRef", "placement", "onPlacementChange", "arrow", "arrowClassName", "sameWidth", "offsetDistance", "offsetSkidding", "forcePortal", "style", "customModifiers"];
6
+ var _excluded = ["targetRef", "children", "getRef", "placement", "onPlacementChange", "arrow", "arrowClassName", "sameWidth", "offsetDistance", "offsetSkidding", "forcePortal", "style", "customModifiers", "renderContent"];
7
7
  import { createScopedElement } from "../../lib/jsxRuntime";
8
8
  import * as React from "react";
9
9
  import { usePopper } from "react-popper";
10
10
  import { AppRootPortal } from "../AppRoot/AppRootPortal";
11
+ import { PopperArrow } from "../PopperArrow/PopperArrow";
11
12
  import { usePlatform } from "../../hooks/usePlatform";
12
13
  import { getClassName } from "../../helpers/getClassName";
13
14
  import { useExternRef } from "../../hooks/useExternRef";
@@ -39,8 +40,8 @@ export var Popper = function Popper(_ref) {
39
40
  _ref$forcePortal = _ref.forcePortal,
40
41
  forcePortal = _ref$forcePortal === void 0 ? true : _ref$forcePortal,
41
42
  compStyles = _ref.style,
42
- _ref$customModifiers = _ref.customModifiers,
43
- customModifiers = _ref$customModifiers === void 0 ? [] : _ref$customModifiers,
43
+ customModifiers = _ref.customModifiers,
44
+ renderContent = _ref.renderContent,
44
45
  restProps = _objectWithoutProperties(_ref, _excluded);
45
46
 
46
47
  var _React$useState = React.useState(null),
@@ -97,7 +98,10 @@ export var Popper = function Popper(_ref) {
97
98
  modifiers.push(_sameWidth);
98
99
  }
99
100
 
100
- modifiers.push.apply(modifiers, _toConsumableArray(customModifiers));
101
+ if (customModifiers) {
102
+ modifiers.push.apply(modifiers, _toConsumableArray(customModifiers));
103
+ }
104
+
101
105
  return modifiers;
102
106
  }, [arrow, sameWidth, smallTargetOffsetSkidding, offsetSkidding, offsetDistance, customModifiers]);
103
107
 
@@ -142,24 +146,13 @@ export var Popper = function Popper(_ref) {
142
146
  style: _objectSpread(_objectSpread(_objectSpread({}, compStyles), styles.popper), {}, {
143
147
  minWidth: sameWidth ? (_targetRef$current3 = targetRef.current) === null || _targetRef$current3 === void 0 ? void 0 : _targetRef$current3.scrollWidth : undefined
144
148
  })
145
- }), arrow && createScopedElement("div", _extends({}, attributes.arrow, {
146
- vkuiClass: "Popper__arrow",
147
- "data-popper-arrow": true,
148
- style: styles.arrow
149
- }), createScopedElement("svg", {
150
- vkuiClass: "Popper__arrow-in",
151
- className: arrowClassName,
152
- width: "20",
153
- height: "8",
154
- viewBox: "0 0 20 8",
155
- fill: "none",
156
- xmlns: "http://www.w3.org/2000/svg"
157
- }, createScopedElement("path", {
158
- fillRule: "evenodd",
159
- clipRule: "evenodd",
160
- d: "M10 0C13 0 15.9999 8 20 8H0C3.9749 8 7 0 10 0Z",
161
- fill: "currentColor"
162
- }))), createScopedElement("div", {
149
+ }), arrow && createScopedElement(PopperArrow, {
150
+ attributes: attributes.arrow,
151
+ style: styles.arrow,
152
+ arrowClassName: arrowClassName
153
+ }), renderContent ? renderContent({
154
+ className: "Popper__content"
155
+ }) : createScopedElement("div", {
163
156
  vkuiClass: "Popper__content"
164
157
  }, children));
165
158
  return createScopedElement(AppRootPortal, {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/Popper/Popper.tsx"],"names":["React","usePopper","AppRootPortal","usePlatform","getClassName","useExternRef","useIsomorphicLayoutEffect","ARROW_PADDING","ARROW_WIDTH","ARROW_HEIGHT","Popper","targetRef","children","getRef","placement","onPlacementChange","arrow","arrowClassName","sameWidth","offsetDistance","offsetSkidding","forcePortal","compStyles","style","customModifiers","restProps","useState","popperNode","setPopperNode","smallTargetOffsetSkidding","setSmallTargetOffsetSkidding","platform","setExternalRef","modifiers","useMemo","name","options","mainAxis","offset","push","padding","enabled","phase","requires","fn","state","styles","popper","width","rects","reference","effect","elements","offsetWidth","current","attributes","resolvedPlacement","isEdgePlacement","includes","placementDirection","startsWith","arrowSize","targetSize","offsetHeight","useEffect","dropdown","minWidth","scrollWidth","undefined"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { usePopper, Modifier } from \"react-popper\";\nimport { AppRootPortal } from \"../AppRoot/AppRootPortal\";\nimport { HasRef } from \"../../types\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { useIsomorphicLayoutEffect } from \"../../lib/useIsomorphicLayoutEffect\";\nimport \"./Popper.css\";\n\nexport type Placement =\n | \"auto\"\n | \"auto-start\"\n | \"auto-end\"\n | \"top-start\"\n | \"top-end\"\n | \"bottom-start\"\n | \"bottom-end\"\n | \"right-start\"\n | \"right-end\"\n | \"left-start\"\n | \"left-end\"\n | \"top\"\n | \"bottom\"\n | \"left\"\n | \"right\";\n\nexport interface PopperCommonProps\n extends React.HTMLAttributes<HTMLDivElement>,\n HasRef<HTMLDivElement> {\n /**\n * По умолчанию компонент выберет наилучшее расположение сам. Но его можно задать извне с помощью этого свойства\n */\n placement?: Placement;\n /**\n * Отступ по вспомогательной оси\n */\n offsetSkidding?: number;\n /**\n * Отступ по главной оси\n */\n offsetDistance?: number;\n arrow?: boolean;\n arrowClassName?: string;\n /**\n * Выставлять ширину равной target элементу\n */\n sameWidth?: boolean;\n forcePortal?: boolean;\n onPlacementChange?: (data: { placement?: Placement }) => void;\n /**\n * Массив кастомных модификаторов для Popper (необходимо мемоизировать)\n */\n customModifiers?: Array<Modifier<string>>;\n}\n\nexport interface PopperProps extends PopperCommonProps {\n targetRef: React.RefObject<HTMLElement>;\n}\n\nconst ARROW_PADDING = 8;\nconst ARROW_WIDTH = 20;\nconst ARROW_HEIGHT = 8;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Popper\n */\nexport const Popper = ({\n targetRef,\n children,\n getRef,\n placement = \"bottom-start\",\n onPlacementChange,\n arrow,\n arrowClassName,\n sameWidth,\n offsetDistance = 8,\n offsetSkidding = 0,\n forcePortal = true,\n style: compStyles,\n customModifiers = [],\n ...restProps\n}: PopperProps) => {\n const [popperNode, setPopperNode] = React.useState<HTMLDivElement | null>(\n null\n );\n const [smallTargetOffsetSkidding, setSmallTargetOffsetSkidding] =\n React.useState(0);\n const platform = usePlatform();\n\n const setExternalRef = useExternRef<HTMLDivElement>(getRef, setPopperNode);\n\n const modifiers = React.useMemo(() => {\n const modifiers: Array<Modifier<string>> = [\n {\n name: \"preventOverflow\",\n options: {\n mainAxis: false,\n },\n },\n {\n name: \"offset\",\n options: {\n offset: [\n arrow ? offsetSkidding - smallTargetOffsetSkidding : offsetSkidding,\n arrow ? offsetDistance + ARROW_HEIGHT : offsetDistance,\n ],\n },\n },\n {\n name: \"flip\",\n },\n ];\n\n if (arrow) {\n modifiers.push({\n name: \"arrow\",\n options: {\n padding: ARROW_PADDING,\n },\n });\n }\n\n if (sameWidth) {\n const sameWidth: Modifier<string> = {\n name: \"sameWidth\",\n enabled: true,\n phase: \"beforeWrite\",\n requires: [\"computeStyles\"],\n fn: ({ state }) => {\n state.styles.popper.width = `${state.rects.reference.width}px`;\n },\n effect: ({ state }) => {\n state.elements.popper.style.width = `${\n (state.elements.reference as HTMLElement).offsetWidth\n }px`;\n },\n };\n\n modifiers.push(sameWidth);\n }\n\n modifiers.push(...customModifiers);\n return modifiers;\n }, [\n arrow,\n sameWidth,\n smallTargetOffsetSkidding,\n offsetSkidding,\n offsetDistance,\n customModifiers,\n ]);\n\n const { styles, state, attributes } = usePopper(\n targetRef.current,\n popperNode,\n {\n placement,\n modifiers,\n }\n );\n\n const resolvedPlacement = state?.placement;\n const isEdgePlacement =\n !!resolvedPlacement && resolvedPlacement.includes(\"-\"); // true, если поппер отрисован с краю\n\n // Если поппер рисуется с краю, то нужно опционально сместить его в тех случаях, когда стрелка не дотягивается до\n // таргета из-за маленьких размеров последнего\n useIsomorphicLayoutEffect(() => {\n if (arrow && isEdgePlacement) {\n const placementDirection =\n resolvedPlacement?.startsWith(\"bottom\") ||\n resolvedPlacement?.startsWith(\"top\")\n ? \"vertical\"\n : \"horizontal\";\n\n const arrowSize =\n placementDirection === \"vertical\" ? ARROW_WIDTH : ARROW_HEIGHT;\n const targetSize =\n (placementDirection === \"vertical\"\n ? targetRef.current?.offsetWidth\n : targetRef.current?.offsetHeight) ?? 0;\n\n if (targetSize < arrowSize + 2 * ARROW_PADDING) {\n setSmallTargetOffsetSkidding(ARROW_PADDING + arrowSize / 2);\n }\n } else {\n setSmallTargetOffsetSkidding(0);\n }\n }, [arrow, isEdgePlacement]);\n\n React.useEffect(() => {\n if (resolvedPlacement) {\n onPlacementChange && onPlacementChange({ placement: resolvedPlacement });\n }\n }, [onPlacementChange, resolvedPlacement]);\n\n const dropdown = (\n <div\n {...restProps}\n {...attributes.popper}\n vkuiClass={getClassName(\"Popper\", platform)}\n ref={setExternalRef}\n style={{\n ...compStyles,\n ...styles.popper,\n minWidth: sameWidth ? targetRef.current?.scrollWidth : undefined,\n }}\n >\n {arrow && (\n <div\n {...attributes.arrow}\n vkuiClass=\"Popper__arrow\"\n data-popper-arrow={true}\n style={styles.arrow}\n >\n <svg\n vkuiClass=\"Popper__arrow-in\"\n className={arrowClassName}\n width=\"20\"\n height=\"8\"\n viewBox=\"0 0 20 8\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M10 0C13 0 15.9999 8 20 8H0C3.9749 8 7 0 10 0Z\"\n fill=\"currentColor\"\n />\n </svg>\n </div>\n )}\n <div vkuiClass=\"Popper__content\">{children}</div>\n </div>\n );\n\n return (\n <AppRootPortal forcePortal={forcePortal} vkuiClass=\"PopperPortal\">\n {dropdown}\n </AppRootPortal>\n );\n};\n"],"file":"Popper.js"}
1
+ {"version":3,"sources":["../../../../src/components/Popper/Popper.tsx"],"names":["React","usePopper","AppRootPortal","PopperArrow","usePlatform","getClassName","useExternRef","useIsomorphicLayoutEffect","ARROW_PADDING","ARROW_WIDTH","ARROW_HEIGHT","Popper","targetRef","children","getRef","placement","onPlacementChange","arrow","arrowClassName","sameWidth","offsetDistance","offsetSkidding","forcePortal","compStyles","style","customModifiers","renderContent","restProps","useState","popperNode","setPopperNode","smallTargetOffsetSkidding","setSmallTargetOffsetSkidding","platform","setExternalRef","modifiers","useMemo","name","options","mainAxis","offset","push","padding","enabled","phase","requires","fn","state","styles","popper","width","rects","reference","effect","elements","offsetWidth","current","attributes","resolvedPlacement","isEdgePlacement","includes","placementDirection","startsWith","arrowSize","targetSize","offsetHeight","useEffect","dropdown","minWidth","scrollWidth","undefined","className"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { usePopper, Modifier } from \"react-popper\";\nimport { AppRootPortal } from \"../AppRoot/AppRootPortal\";\nimport { PopperArrow } from \"../PopperArrow/PopperArrow\";\nimport { HasRef } from \"../../types\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { useIsomorphicLayoutEffect } from \"../../lib/useIsomorphicLayoutEffect\";\nimport \"./Popper.css\";\n\nexport type Placement =\n | \"auto\"\n | \"auto-start\"\n | \"auto-end\"\n | \"top-start\"\n | \"top-end\"\n | \"bottom-start\"\n | \"bottom-end\"\n | \"right-start\"\n | \"right-end\"\n | \"left-start\"\n | \"left-end\"\n | \"top\"\n | \"bottom\"\n | \"left\"\n | \"right\";\n\nexport interface PopperRenderContentProps {\n className: string;\n}\n\nexport interface PopperCommonProps\n extends React.HTMLAttributes<HTMLDivElement>,\n HasRef<HTMLDivElement> {\n /**\n * По умолчанию компонент выберет наилучшее расположение сам. Но его можно задать извне с помощью этого свойства\n */\n placement?: Placement;\n /**\n * Отступ по вспомогательной оси\n */\n offsetSkidding?: number;\n /**\n * Отступ по главной оси\n */\n offsetDistance?: number;\n /**\n * Отображать ли стрелку, указывающую на якорный элемент\n */\n arrow?: boolean;\n /**\n * Стиль стрелки\n */\n arrowClassName?: string;\n /**\n * Выставлять ширину равной target элементу\n */\n sameWidth?: boolean;\n forcePortal?: boolean;\n onPlacementChange?: (data: { placement?: Placement }) => void;\n /**\n * Массив кастомных модификаторов для Popper (необходимо мемоизировать)\n */\n customModifiers?: Array<Modifier<string>>;\n /**\n * При передаче содержимого в `children`, он будет обёрнут во внутренний контейнер.\n *\n * Если хочется управлять этим контейнером, то используйте данную функцию.\n *\n * > ⚠️ Параметр `children` будет проигнорирован.\n */\n renderContent?(props: PopperRenderContentProps): React.ReactNode;\n}\n\nexport interface PopperProps extends PopperCommonProps {\n targetRef: React.RefObject<HTMLElement>;\n}\n\nconst ARROW_PADDING = 8;\nconst ARROW_WIDTH = 20;\nconst ARROW_HEIGHT = 8;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Popper\n */\nexport const Popper = ({\n targetRef,\n children,\n getRef,\n placement = \"bottom-start\",\n onPlacementChange,\n arrow,\n arrowClassName,\n sameWidth,\n offsetDistance = 8,\n offsetSkidding = 0,\n forcePortal = true,\n style: compStyles,\n customModifiers,\n renderContent,\n ...restProps\n}: PopperProps) => {\n const [popperNode, setPopperNode] = React.useState<HTMLDivElement | null>(\n null\n );\n const [smallTargetOffsetSkidding, setSmallTargetOffsetSkidding] =\n React.useState(0);\n const platform = usePlatform();\n\n const setExternalRef = useExternRef<HTMLDivElement>(getRef, setPopperNode);\n\n const modifiers = React.useMemo(() => {\n const modifiers: Array<Modifier<string>> = [\n {\n name: \"preventOverflow\",\n options: {\n mainAxis: false,\n },\n },\n {\n name: \"offset\",\n options: {\n offset: [\n arrow ? offsetSkidding - smallTargetOffsetSkidding : offsetSkidding,\n arrow ? offsetDistance + ARROW_HEIGHT : offsetDistance,\n ],\n },\n },\n {\n name: \"flip\",\n },\n ];\n\n if (arrow) {\n modifiers.push({\n name: \"arrow\",\n options: {\n padding: ARROW_PADDING,\n },\n });\n }\n\n if (sameWidth) {\n const sameWidth: Modifier<string> = {\n name: \"sameWidth\",\n enabled: true,\n phase: \"beforeWrite\",\n requires: [\"computeStyles\"],\n fn: ({ state }) => {\n state.styles.popper.width = `${state.rects.reference.width}px`;\n },\n effect: ({ state }) => {\n state.elements.popper.style.width = `${\n (state.elements.reference as HTMLElement).offsetWidth\n }px`;\n },\n };\n\n modifiers.push(sameWidth);\n }\n\n if (customModifiers) {\n modifiers.push(...customModifiers);\n }\n return modifiers;\n }, [\n arrow,\n sameWidth,\n smallTargetOffsetSkidding,\n offsetSkidding,\n offsetDistance,\n customModifiers,\n ]);\n\n const { styles, state, attributes } = usePopper(\n targetRef.current,\n popperNode,\n {\n placement,\n modifiers,\n }\n );\n\n const resolvedPlacement = state?.placement;\n const isEdgePlacement =\n !!resolvedPlacement && resolvedPlacement.includes(\"-\"); // true, если поппер отрисован с краю\n\n // Если поппер рисуется с краю, то нужно опционально сместить его в тех случаях, когда стрелка не дотягивается до\n // таргета из-за маленьких размеров последнего\n useIsomorphicLayoutEffect(() => {\n if (arrow && isEdgePlacement) {\n const placementDirection =\n resolvedPlacement?.startsWith(\"bottom\") ||\n resolvedPlacement?.startsWith(\"top\")\n ? \"vertical\"\n : \"horizontal\";\n\n const arrowSize =\n placementDirection === \"vertical\" ? ARROW_WIDTH : ARROW_HEIGHT;\n const targetSize =\n (placementDirection === \"vertical\"\n ? targetRef.current?.offsetWidth\n : targetRef.current?.offsetHeight) ?? 0;\n\n if (targetSize < arrowSize + 2 * ARROW_PADDING) {\n setSmallTargetOffsetSkidding(ARROW_PADDING + arrowSize / 2);\n }\n } else {\n setSmallTargetOffsetSkidding(0);\n }\n }, [arrow, isEdgePlacement]);\n\n React.useEffect(() => {\n if (resolvedPlacement) {\n onPlacementChange && onPlacementChange({ placement: resolvedPlacement });\n }\n }, [onPlacementChange, resolvedPlacement]);\n\n const dropdown = (\n <div\n {...restProps}\n {...attributes.popper}\n vkuiClass={getClassName(\"Popper\", platform)}\n ref={setExternalRef}\n style={{\n ...compStyles,\n ...styles.popper,\n minWidth: sameWidth ? targetRef.current?.scrollWidth : undefined,\n }}\n >\n {arrow && (\n <PopperArrow\n attributes={attributes.arrow}\n style={styles.arrow}\n arrowClassName={arrowClassName}\n />\n )}\n {renderContent ? (\n renderContent({ className: \"Popper__content\" })\n ) : (\n <div vkuiClass=\"Popper__content\">{children}</div>\n )}\n </div>\n );\n\n return (\n <AppRootPortal forcePortal={forcePortal} vkuiClass=\"PopperPortal\">\n {dropdown}\n </AppRootPortal>\n );\n};\n"],"file":"Popper.js"}
@@ -0,0 +1 @@
1
+ .vkuiPopperArrow__in{content:"";display:block;height:8px;width:20px}[data-popper-placement^=bottom] .vkuiPopperArrow{bottom:100%}[data-popper-placement^=top] .vkuiPopperArrow{top:100%}[data-popper-placement^=top] .vkuiPopperArrow__in{-webkit-transform:rotate(180deg);transform:rotate(180deg)}[data-popper-placement^=left] .vkuiPopperArrow{left:calc(100% - 6px)}[data-popper-placement^=left] .vkuiPopperArrow__in{-webkit-transform:rotate(90deg);transform:rotate(90deg)}[data-popper-placement^=right] .vkuiPopperArrow{right:calc(100% - 6px)}[data-popper-placement^=right] .vkuiPopperArrow__in{-webkit-transform:rotate(270deg);transform:rotate(270deg)}
@@ -0,0 +1,8 @@
1
+ import * as React from "react";
2
+ import "./PopperArrow.css";
3
+ export interface PopperArrowProps {
4
+ style?: React.CSSProperties;
5
+ attributes?: React.HTMLAttributes<HTMLDivElement> | null;
6
+ arrowClassName?: string;
7
+ }
8
+ export declare const PopperArrow: ({ style, attributes, arrowClassName, }: PopperArrowProps) => JSX.Element;
@@ -0,0 +1,28 @@
1
+ import _extends from "@babel/runtime/helpers/extends";
2
+ import { createScopedElement } from "../../lib/jsxRuntime";
3
+ import "./PopperArrow.css";
4
+ export var PopperArrow = function PopperArrow(_ref) {
5
+ var style = _ref.style,
6
+ attributes = _ref.attributes,
7
+ arrowClassName = _ref.arrowClassName;
8
+ return createScopedElement("div", _extends({
9
+ style: style
10
+ }, attributes, {
11
+ vkuiClass: "PopperArrow",
12
+ "data-popper-arrow": true
13
+ }), createScopedElement("svg", {
14
+ vkuiClass: "PopperArrow__in",
15
+ className: arrowClassName,
16
+ width: "20",
17
+ height: "8",
18
+ viewBox: "0 0 20 8",
19
+ fill: "none",
20
+ xmlns: "http://www.w3.org/2000/svg"
21
+ }, createScopedElement("path", {
22
+ fillRule: "evenodd",
23
+ clipRule: "evenodd",
24
+ d: "M10 0C13 0 15.9999 8 20 8H0C3.9749 8 7 0 10 0Z",
25
+ fill: "currentColor"
26
+ })));
27
+ };
28
+ //# sourceMappingURL=PopperArrow.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../../src/components/PopperArrow/PopperArrow.tsx"],"names":["PopperArrow","style","attributes","arrowClassName"],"mappings":";;AACA;AAQA,OAAO,IAAMA,WAAW,GAAG,SAAdA,WAAc,OAIH;AAAA,MAHtBC,KAGsB,QAHtBA,KAGsB;AAAA,MAFtBC,UAEsB,QAFtBA,UAEsB;AAAA,MADtBC,cACsB,QADtBA,cACsB;AACtB,SACE;AACE,IAAA,KAAK,EAAEF;AADT,KAEMC,UAFN;AAGE,IAAA,SAAS,EAAC,aAHZ;AAIE,yBAAmB;AAJrB,MAME;AACE,IAAA,SAAS,EAAC,iBADZ;AAEE,IAAA,SAAS,EAAEC,cAFb;AAGE,IAAA,KAAK,EAAC,IAHR;AAIE,IAAA,MAAM,EAAC,GAJT;AAKE,IAAA,OAAO,EAAC,UALV;AAME,IAAA,IAAI,EAAC,MANP;AAOE,IAAA,KAAK,EAAC;AAPR,KASE;AACE,IAAA,QAAQ,EAAC,SADX;AAEE,IAAA,QAAQ,EAAC,SAFX;AAGE,IAAA,CAAC,EAAC,gDAHJ;AAIE,IAAA,IAAI,EAAC;AAJP,IATF,CANF,CADF;AAyBD,CA9BM","sourcesContent":["import * as React from \"react\";\nimport \"./PopperArrow.css\";\n\nexport interface PopperArrowProps {\n style?: React.CSSProperties;\n attributes?: React.HTMLAttributes<HTMLDivElement> | null;\n arrowClassName?: string;\n}\n\nexport const PopperArrow = ({\n style,\n attributes,\n arrowClassName,\n}: PopperArrowProps) => {\n return (\n <div\n style={style}\n {...attributes}\n vkuiClass=\"PopperArrow\"\n data-popper-arrow={true}\n >\n <svg\n vkuiClass=\"PopperArrow__in\"\n className={arrowClassName}\n width=\"20\"\n height=\"8\"\n viewBox=\"0 0 20 8\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M10 0C13 0 15.9999 8 20 8H0C3.9749 8 7 0 10 0Z\"\n fill=\"currentColor\"\n />\n </svg>\n </div>\n );\n};\n"],"file":"PopperArrow.js"}
@@ -1 +1 @@
1
- .vkuiProgress{border-radius:1px;background:#e1e3e6;background:var(--loader_track_fill, var(--vkui--color_track_background));height:2px}.vkuiProgress__in{height:100%;border-radius:inherit;transition:width .2s ease;background:#2688eb;background:var(--accent, var(--vkui--color_stroke_accent))}
1
+ .vkuiProgress{background:#e1e3e6;background:var(--loader_track_fill,var(--vkui--color_track_background));border-radius:1px;height:2px}.vkuiProgress__in{background:#2688eb;background:var(--accent,var(--vkui--color_stroke_accent));border-radius:inherit;height:100%;transition:width .2s ease}
@@ -1 +1 @@
1
- .vkuiPromoBanner{width:100%;box-sizing:border-box;outline:1px solid rgba(0,0,0,.12);outline:1px solid var(--separator_alpha);color:#000;color:var(--text_primary);background:#fff;background:var(--background_content);padding-bottom:10px;position:relative}.vkuiPromoBanner__head{display:flex;padding-top:14px;padding-bottom:10px;color:#818c99;color:var(--text_secondary)}.vkuiPromoBanner__age{margin-left:6px}.vkuiPromoBanner__close{position:absolute;top:0;right:0;width:48px;height:48px;color:#99a2ad;color:var(--placeholder_icon_foreground_primary);display:flex;justify-content:center;align-items:center}.vkuiPromoBanner__close:active{opacity:.7}.vkuiPromoBanner__pixels{display:none}.vkuiPromoBanner--ios .vkuiPromoBanner__head{padding-left:12px;padding-right:12px}.vkuiPromoBanner--android .vkuiPromoBanner__head,.vkuiPromoBanner--vkcom .vkuiPromoBanner__head{padding-left:16px;padding-right:16px}
1
+ .vkuiPromoBanner{background:#fff;background:var(--background_content);box-sizing:border-box;color:#000;color:var(--text_primary);outline:1px solid rgba(0,0,0,.12);outline:1px solid var(--separator_alpha);padding-bottom:10px;position:relative;width:100%}.vkuiPromoBanner__head{color:#818c99;color:var(--text_secondary);display:flex;padding-bottom:10px;padding-top:14px}.vkuiPromoBanner__age{margin-left:6px}.vkuiPromoBanner__close{align-items:center;color:#99a2ad;color:var(--placeholder_icon_foreground_primary);display:flex;height:48px;justify-content:center;position:absolute;right:0;top:0;width:48px}.vkuiPromoBanner__close:active{opacity:.7}.vkuiPromoBanner__pixels{display:none}.vkuiPromoBanner--ios .vkuiPromoBanner__head{padding-left:12px;padding-right:12px}.vkuiPromoBanner--android .vkuiPromoBanner__head,.vkuiPromoBanner--vkcom .vkuiPromoBanner__head{padding-left:16px;padding-right:16px}
@@ -1,3 +1,3 @@
1
- .vkuiPullToRefresh{flex-grow:1}.vkuiPullToRefresh--refreshing{touch-action:none;pointer-events:none}.vkuiPullToRefresh__controls{width:100%;pointer-events:none;z-index:9}.vkuiPullToRefresh--ios .vkuiPullToRefresh__controls{z-index:0}.vkuiPullToRefresh__spinner{display:flex;margin:auto;width:40px;height:40px;align-items:center;justify-content:center;box-sizing:border-box;transition:opacity 220ms ease-out,-webkit-transform 300ms cubic-bezier(.1,0,.25,1);transition:transform 300ms cubic-bezier(.1,0,.25,1),opacity 220ms ease-out;transition:transform 300ms cubic-bezier(.1,0,.25,1),opacity 220ms ease-out,-webkit-transform 300ms cubic-bezier(.1,0,.25,1);opacity:0;background:#fff;background:var(--background_suggestions,
2
- var(--vkui--color_background_modal)
3
- );border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.2);color:#2688eb;color:var(--accent, var(--vkui--color_icon_accent))}.vkuiPullToRefresh--ios .vkuiPullToRefresh__spinner{border-radius:0;box-shadow:none;background:0 0;color:#99a2ad;color:var(--icon_outline_secondary, var(--vkui--color_icon_medium))}.vkuiPullToRefresh--watching .vkuiPullToRefresh__spinner{transition:opacity 220ms ease-out}.vkuiPullToRefresh__spinner-self{stroke:currentColor}.vkuiPullToRefresh--ios.vkuiPullToRefresh--refreshing .vkuiPullToRefresh__spinner-self{-webkit-animation:vkui-PullToRefreshToRefreshing 380ms ease-out;animation:vkui-PullToRefreshToRefreshing 380ms ease-out}.vkuiPullToRefresh__spinner-path{-webkit-transform:rotate(-90deg);transform:rotate(-90deg);-webkit-transform-origin:center center;transform-origin:center center;transition:stroke-dashoffset 167ms ease-out}.vkuiPullToRefresh--watching .vkuiPullToRefresh__spinner-path,.vkuiPullToRefresh--refreshing .vkuiPullToRefresh__spinner-path{transition:none}.vkuiPullToRefresh__spinner--on .vkuiPullToRefresh__spinner-path{-webkit-animation:vkui-rotator .7s linear infinite;animation:vkui-rotator .7s linear infinite;-webkit-animation:vkui-rotator var(--duration) linear infinite;animation:vkui-rotator var(--duration) linear infinite}.vkuiPullToRefresh__content{overflow:hidden;transition:-webkit-transform 400ms cubic-bezier(.36,.66,.04,1);transition:transform 400ms cubic-bezier(.36,.66,.04,1);transition:transform 400ms cubic-bezier(.36,.66,.04,1),-webkit-transform 400ms cubic-bezier(.36,.66,.04,1);transition:-webkit-transform 400ms var(--ios-easing);transition:transform 400ms var(--ios-easing);transition:transform 400ms var(--ios-easing),-webkit-transform 400ms var(--ios-easing)}.vkuiPullToRefresh--watching .vkuiPullToRefresh__content{transition:none}@-webkit-keyframes vkui-PullToRefreshToRefreshing{0%{-webkit-transform:scale(1);transform:scale(1)}30%{-webkit-transform:scale(.6);transform:scale(.6)}90%{-webkit-transform:scale(1.1);transform:scale(1.1)}to{-webkit-transform:scale(1);transform:scale(1)}}@keyframes vkui-PullToRefreshToRefreshing{0%{-webkit-transform:scale(1);transform:scale(1)}30%{-webkit-transform:scale(.6);transform:scale(.6)}90%{-webkit-transform:scale(1.1);transform:scale(1.1)}to{-webkit-transform:scale(1);transform:scale(1)}}
1
+ .vkuiPullToRefresh{flex-grow:1}.vkuiPullToRefresh--refreshing{pointer-events:none;touch-action:none}.vkuiPullToRefresh__controls{pointer-events:none;width:100%;z-index:9}.vkuiPullToRefresh--ios .vkuiPullToRefresh__controls{z-index:0}.vkuiPullToRefresh__spinner{align-items:center;background:#fff;background:var(
2
+ --background_suggestions,var(--vkui--color_background_modal)
3
+ );border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.2);box-sizing:border-box;color:#2688eb;color:var(--accent,var(--vkui--color_icon_accent));display:flex;height:40px;justify-content:center;margin:auto;opacity:0;transition:opacity .22s ease-out,-webkit-transform .3s cubic-bezier(.1,0,.25,1);transition:transform .3s cubic-bezier(.1,0,.25,1),opacity .22s ease-out;transition:transform .3s cubic-bezier(.1,0,.25,1),opacity .22s ease-out,-webkit-transform .3s cubic-bezier(.1,0,.25,1);width:40px}.vkuiPullToRefresh--ios .vkuiPullToRefresh__spinner{background:none;border-radius:0;box-shadow:none;color:#99a2ad;color:var(--icon_outline_secondary,var(--vkui--color_icon_medium))}.vkuiPullToRefresh--watching .vkuiPullToRefresh__spinner{transition:opacity .22s ease-out}.vkuiPullToRefresh__spinner-self{stroke:currentColor}.vkuiPullToRefresh--ios.vkuiPullToRefresh--refreshing .vkuiPullToRefresh__spinner-self{-webkit-animation:vkui-PullToRefreshToRefreshing .38s ease-out;animation:vkui-PullToRefreshToRefreshing .38s ease-out}.vkuiPullToRefresh__spinner-path{-webkit-transform:rotate(-90deg);transform:rotate(-90deg);-webkit-transform-origin:center center;transform-origin:center center;transition:stroke-dashoffset 167ms ease-out}.vkuiPullToRefresh--refreshing .vkuiPullToRefresh__spinner-path,.vkuiPullToRefresh--watching .vkuiPullToRefresh__spinner-path{transition:none}.vkuiPullToRefresh__spinner--on .vkuiPullToRefresh__spinner-path{-webkit-animation:vkui-rotator .7s linear infinite;animation:vkui-rotator .7s linear infinite;-webkit-animation:vkui-rotator var(--duration) linear infinite;animation:vkui-rotator var(--duration) linear infinite}.vkuiPullToRefresh__content{overflow:hidden;transition:-webkit-transform .4s cubic-bezier(.36,.66,.04,1);transition:transform .4s cubic-bezier(.36,.66,.04,1);transition:transform .4s cubic-bezier(.36,.66,.04,1),-webkit-transform .4s cubic-bezier(.36,.66,.04,1);transition:-webkit-transform .4s var(--ios-easing);transition:transform .4s var(--ios-easing);transition:transform .4s var(--ios-easing),-webkit-transform .4s var(--ios-easing)}.vkuiPullToRefresh--watching .vkuiPullToRefresh__content{transition:none}@-webkit-keyframes vkui-PullToRefreshToRefreshing{0%{-webkit-transform:scale(1);transform:scale(1)}30%{-webkit-transform:scale(.6);transform:scale(.6)}90%{-webkit-transform:scale(1.1);transform:scale(1.1)}to{-webkit-transform:scale(1);transform:scale(1)}}@keyframes vkui-PullToRefreshToRefreshing{0%{-webkit-transform:scale(1);transform:scale(1)}30%{-webkit-transform:scale(.6);transform:scale(.6)}90%{-webkit-transform:scale(1.1);transform:scale(1.1)}to{-webkit-transform:scale(1);transform:scale(1)}}
@@ -1 +1 @@
1
- .vkuiRadio{display:block;padding:0 16px;padding:0 var(--vkui--size_base_padding_horizontal--regular,16px)}.vkuiFormItem .vkuiRadio{width:100%;box-sizing:content-box;margin:0 calc(-1*16px);margin:0 calc(-1*var(--vkui--size_base_padding_horizontal--regular,16px))}.vkuiRadio__container{display:flex;align-items:center;justify-content:flex-start}.vkuiRadio__input:disabled~.vkuiRadio__container{opacity:.64;opacity:var(--vkui--opacity_disable_accessibility,0.64)}.vkuiRadio__icon{flex-shrink:0;width:22px;height:22px;margin-right:14px;color:#b8c1cc;color:var(--icon_tertiary, var(--vkui--color_icon_tertiary));transition:color .15s cubic-bezier(.36,.66,.04,1);transition:color .15s var(--ios-easing)}.vkuiRadio__input:checked~.vkuiRadio__container .vkuiRadio__icon{color:#2688eb;color:var(--accent, var(--vkui--color_icon_accent))}.vkuiRadio__icon .vkuiRadio__pin{-webkit-transform-origin:12px 12px;transform-origin:12px 12px;-webkit-transform:scale(0);transform:scale(0);transition:-webkit-transform .15s cubic-bezier(.36,.66,.04,1);transition:transform .15s cubic-bezier(.36,.66,.04,1);transition:transform .15s cubic-bezier(.36,.66,.04,1),-webkit-transform .15s cubic-bezier(.36,.66,.04,1);transition:-webkit-transform .15s var(--ios-easing);transition:transform .15s var(--ios-easing);transition:transform .15s var(--ios-easing),-webkit-transform .15s var(--ios-easing)}.vkuiRadio__input:checked~.vkuiRadio__container .vkuiRadio__icon .vkuiRadio__pin{-webkit-transform:none;transform:none}.vkuiRadio__content{display:block;flex-grow:1;max-width:100%;color:#000;color:var(--text_primary, var(--vkui--color_text_primary))}.vkuiRadio__description{display:block;color:#818c99;color:var(--text_secondary, var(--vkui--color_text_secondary));margin-bottom:12px;margin-top:2px}.vkuiRadio__children{margin-top:12px}.vkuiRadio__children:last-child{margin-bottom:12px}.vkuiRadio--sizeY-compact .vkuiRadio__children{margin-top:8px}.vkuiRadio--sizeY-compact .vkuiRadio__children:last-child{margin-bottom:8px}.vkuiRadio--sizeY-compact .vkuiRadio__description{margin-bottom:7px}.vkuiRadio--sizeY-compact .vkuiRadio__icon{width:18px;height:18px}.vkuiRadio--sizeY-compact .vkuiRadio__icon::after{width:12px;height:12px}.vkuiRadioGroup .vkuiRadio{flex:1;margin:0;box-sizing:border-box}
1
+ .vkuiRadio{display:block;padding:0 16px;padding:0 var(--vkui--size_base_padding_horizontal--regular,16px)}.vkuiFormItem .vkuiRadio{box-sizing:initial;margin:0 -16px;margin:0 calc(var(--vkui--size_base_padding_horizontal--regular,16px)*-1);width:100%}.vkuiRadio__container{align-items:center;display:flex;justify-content:flex-start}.vkuiRadio__input:disabled~.vkuiRadio__container{opacity:.64;opacity:var(--vkui--opacity_disable_accessibility,.64)}.vkuiRadio__icon{color:#b8c1cc;color:var(--icon_tertiary,var(--vkui--color_icon_tertiary));flex-shrink:0;height:22px;margin-right:14px;transition:color .15s cubic-bezier(.36,.66,.04,1);transition:color .15s var(--ios-easing);width:22px}.vkuiRadio__input:checked~.vkuiRadio__container .vkuiRadio__icon{color:#2688eb;color:var(--accent,var(--vkui--color_icon_accent))}.vkuiRadio__icon .vkuiRadio__pin{-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:12px 12px;transform-origin:12px 12px;transition:-webkit-transform .15s cubic-bezier(.36,.66,.04,1);transition:transform .15s cubic-bezier(.36,.66,.04,1);transition:transform .15s cubic-bezier(.36,.66,.04,1),-webkit-transform .15s cubic-bezier(.36,.66,.04,1);transition:-webkit-transform .15s var(--ios-easing);transition:transform .15s var(--ios-easing);transition:transform .15s var(--ios-easing),-webkit-transform .15s var(--ios-easing)}.vkuiRadio__input:checked~.vkuiRadio__container .vkuiRadio__icon .vkuiRadio__pin{-webkit-transform:none;transform:none}.vkuiRadio__content{color:#000;color:var(--text_primary,var(--vkui--color_text_primary));display:block;flex-grow:1;max-width:100%}.vkuiRadio__description{color:#818c99;color:var(--text_secondary,var(--vkui--color_text_secondary));display:block;margin-bottom:12px;margin-top:2px}.vkuiRadio__children{margin-top:12px}.vkuiRadio__children:last-child{margin-bottom:12px}.vkuiRadio--sizeY-compact .vkuiRadio__children{margin-top:8px}.vkuiRadio--sizeY-compact .vkuiRadio__children:last-child{margin-bottom:8px}.vkuiRadio--sizeY-compact .vkuiRadio__description{margin-bottom:7px}.vkuiRadio--sizeY-compact .vkuiRadio__icon{height:18px;width:18px}.vkuiRadio--sizeY-compact .vkuiRadio__icon:after{height:12px;width:12px}.vkuiRadioGroup .vkuiRadio{box-sizing:border-box;flex:1;margin:0}
@@ -8,4 +8,4 @@ export interface RadioProps extends React.InputHTMLAttributes<HTMLInputElement>,
8
8
  /**
9
9
  * @see https://vkcom.github.io/VKUI/#/Radio
10
10
  */
11
- export declare const Radio: React.ComponentType<Pick<RadioProps, "max" | "required" | "disabled" | "hidden" | "dir" | "form" | "slot" | "style" | "title" | "pattern" | "color" | "size" | "multiple" | "height" | "translate" | "width" | "prefix" | "src" | "children" | "className" | "id" | "lang" | "min" | "name" | "type" | "role" | "tabIndex" | "crossOrigin" | "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" | "list" | "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" | "alt" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "autoComplete" | "accept" | "capture" | "checked" | "maxLength" | "minLength" | "readOnly" | "step" | "getRootRef" | "getRef" | "description"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;
11
+ export declare const Radio: React.FC<Pick<RadioProps, "max" | "required" | "disabled" | "hidden" | "dir" | "form" | "slot" | "style" | "title" | "pattern" | "color" | "size" | "multiple" | "height" | "translate" | "width" | "prefix" | "src" | "children" | "className" | "id" | "lang" | "min" | "name" | "type" | "role" | "tabIndex" | "crossOrigin" | "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" | "list" | "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" | "alt" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "autoComplete" | "accept" | "capture" | "checked" | "maxLength" | "minLength" | "readOnly" | "step" | "getRootRef" | "getRef" | "description"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;
@@ -78,4 +78,5 @@ var RadioComponent = function RadioComponent(_ref) {
78
78
  export var Radio = withAdaptivity(RadioComponent, {
79
79
  sizeY: true
80
80
  });
81
+ Radio.displayName = "Radio";
81
82
  //# sourceMappingURL=Radio.js.map