@vkontakte/vkui 4.35.2 → 4.36.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (651) hide show
  1. package/.cache/.eslintcache +1 -1
  2. package/.cache/.stylelintcache +1 -1
  3. package/.cache/.tsbuildinfo +21609 -18312
  4. package/.cache/ts/src/components/ActionSheet/ActionSheetDefaultIosCloseItem.d.ts +3 -0
  5. package/.cache/ts/src/components/ActionSheetItem/ActionSheetItem.d.ts +5 -1
  6. package/.cache/ts/src/components/AdaptivityProvider/AdaptivityProvider.d.ts +4 -4
  7. package/.cache/ts/src/components/ButtonGroup/ButtonGroup.d.ts +6 -2
  8. package/.cache/ts/src/components/Chip/Chip.d.ts +12 -5
  9. package/.cache/ts/src/components/ChipsInput/ChipsInput.d.ts +5 -26
  10. package/.cache/ts/src/components/ChipsInputBase/ChipsInputBase.d.ts +17 -0
  11. package/.cache/ts/src/components/ChipsSelect/ChipsSelect.d.ts +4 -4
  12. package/.cache/ts/src/components/CustomSelect/CustomSelect.d.ts +1 -1
  13. package/.cache/ts/src/components/DateInput/DateInput.d.ts +4 -2
  14. package/.cache/ts/src/components/DateRangeInput/DateRangeInput.d.ts +4 -2
  15. package/.cache/ts/src/components/DropdownIcon/DropdownIcon.d.ts +4 -2
  16. package/.cache/ts/src/components/FormField/FormField.d.ts +2 -1
  17. package/.cache/ts/src/components/FormLayoutGroup/FormLayoutGroup.d.ts +5 -1
  18. package/.cache/ts/src/components/FormStatus/FormStatus.d.ts +1 -0
  19. package/.cache/ts/src/components/Input/Input.d.ts +1 -1
  20. package/.cache/ts/src/components/List/List.d.ts +2 -1
  21. package/.cache/ts/src/components/ModalPage/ModalPage.d.ts +13 -1
  22. package/.cache/ts/src/components/NativeSelect/NativeSelect.d.ts +3 -2
  23. package/.cache/ts/src/components/Select/Select.d.ts +1 -1
  24. package/.cache/ts/src/components/SelectMimicry/SelectMimicry.d.ts +2 -2
  25. package/.cache/ts/src/components/Textarea/Textarea.d.ts +3 -2
  26. package/.cache/ts/src/{components/ChipsInput → hooks}/useChipsInput.d.ts +4 -3
  27. package/{dist/cssm/components/ChipsSelect → .cache/ts/src/hooks}/useChipsSelect.d.ts +4 -4
  28. package/.cache/ts/src/index.d.ts +3 -0
  29. package/.cache/ts/src/tokenized/index.d.ts +56 -0
  30. package/README.md +3 -2
  31. package/dist/cjs/components/ActionSheet/ActionSheet.js +4 -4
  32. package/dist/cjs/components/ActionSheet/ActionSheet.js.map +1 -1
  33. package/dist/cjs/components/ActionSheet/ActionSheetDefaultIosCloseItem.js +24 -0
  34. package/dist/cjs/components/ActionSheet/ActionSheetDefaultIosCloseItem.js.map +1 -0
  35. package/dist/cjs/components/ActionSheet/ActionSheetDropdown.js +10 -8
  36. package/dist/cjs/components/ActionSheet/ActionSheetDropdown.js.map +1 -1
  37. package/dist/cjs/components/ActionSheet/ActionSheetDropdownDesktop.js +4 -5
  38. package/dist/cjs/components/ActionSheet/ActionSheetDropdownDesktop.js.map +1 -1
  39. package/dist/cjs/components/ActionSheetItem/ActionSheetItem.js +15 -39
  40. package/dist/cjs/components/ActionSheetItem/ActionSheetItem.js.map +1 -1
  41. package/dist/cjs/components/AdaptivityProvider/AdaptivityProvider.js +2 -3
  42. package/dist/cjs/components/AdaptivityProvider/AdaptivityProvider.js.map +1 -1
  43. package/dist/cjs/components/Alert/Alert.js +11 -12
  44. package/dist/cjs/components/Alert/Alert.js.map +1 -1
  45. package/dist/cjs/components/AppRoot/AppRoot.js +2 -5
  46. package/dist/cjs/components/AppRoot/AppRoot.js.map +1 -1
  47. package/dist/cjs/components/Avatar/Avatar.js +4 -17
  48. package/dist/cjs/components/Avatar/Avatar.js.map +1 -1
  49. package/dist/cjs/components/Banner/Banner.js +41 -47
  50. package/dist/cjs/components/Banner/Banner.js.map +1 -1
  51. package/dist/cjs/components/ButtonGroup/ButtonGroup.js.map +1 -1
  52. package/dist/cjs/components/CalendarDay/CalendarDay.js +4 -21
  53. package/dist/cjs/components/CalendarDay/CalendarDay.js.map +1 -1
  54. package/dist/cjs/components/CardScroll/CardScroll.js +2 -5
  55. package/dist/cjs/components/CardScroll/CardScroll.js.map +1 -1
  56. package/dist/cjs/components/Chip/Chip.js.map +1 -1
  57. package/dist/cjs/components/ChipsInput/ChipsInput.js +15 -198
  58. package/dist/cjs/components/ChipsInput/ChipsInput.js.map +1 -1
  59. package/dist/cjs/components/ChipsInputBase/ChipsInputBase.js +215 -0
  60. package/dist/cjs/components/ChipsInputBase/ChipsInputBase.js.map +1 -0
  61. package/dist/cjs/components/ChipsSelect/ChipsSelect.js +44 -27
  62. package/dist/cjs/components/ChipsSelect/ChipsSelect.js.map +1 -1
  63. package/dist/cjs/components/CustomSelect/CustomSelect.js +32 -31
  64. package/dist/cjs/components/CustomSelect/CustomSelect.js.map +1 -1
  65. package/dist/cjs/components/DateInput/DateInput.js +4 -2
  66. package/dist/cjs/components/DateInput/DateInput.js.map +1 -1
  67. package/dist/cjs/components/DateRangeInput/DateRangeInput.js +4 -2
  68. package/dist/cjs/components/DateRangeInput/DateRangeInput.js.map +1 -1
  69. package/dist/cjs/components/DropdownIcon/DropdownIcon.js +16 -7
  70. package/dist/cjs/components/DropdownIcon/DropdownIcon.js.map +1 -1
  71. package/dist/cjs/components/FormField/FormField.js +4 -2
  72. package/dist/cjs/components/FormField/FormField.js.map +1 -1
  73. package/dist/cjs/components/FormLayoutGroup/FormLayoutGroup.js +12 -3
  74. package/dist/cjs/components/FormLayoutGroup/FormLayoutGroup.js.map +1 -1
  75. package/dist/cjs/components/FormStatus/FormStatus.js +4 -6
  76. package/dist/cjs/components/FormStatus/FormStatus.js.map +1 -1
  77. package/dist/cjs/components/Header/Header.js +3 -11
  78. package/dist/cjs/components/Header/Header.js.map +1 -1
  79. package/dist/cjs/components/IconButton/IconButton.js +4 -3
  80. package/dist/cjs/components/IconButton/IconButton.js.map +1 -1
  81. package/dist/cjs/components/Input/Input.js +4 -2
  82. package/dist/cjs/components/Input/Input.js.map +1 -1
  83. package/dist/cjs/components/List/List.js.map +1 -1
  84. package/dist/cjs/components/ModalDismissButton/ModalDismissButton.js +1 -6
  85. package/dist/cjs/components/ModalDismissButton/ModalDismissButton.js.map +1 -1
  86. package/dist/cjs/components/ModalPage/ModalPage.js +11 -10
  87. package/dist/cjs/components/ModalPage/ModalPage.js.map +1 -1
  88. package/dist/cjs/components/ModalPageHeader/ModalPageHeader.js +3 -4
  89. package/dist/cjs/components/ModalPageHeader/ModalPageHeader.js.map +1 -1
  90. package/dist/cjs/components/ModalRoot/ModalRoot.js +4 -18
  91. package/dist/cjs/components/ModalRoot/ModalRoot.js.map +1 -1
  92. package/dist/cjs/components/ModalRoot/ModalRootDesktop.js +3 -11
  93. package/dist/cjs/components/ModalRoot/ModalRootDesktop.js.map +1 -1
  94. package/dist/cjs/components/NativeSelect/NativeSelect.js +4 -2
  95. package/dist/cjs/components/NativeSelect/NativeSelect.js.map +1 -1
  96. package/dist/cjs/components/Panel/Panel.js +4 -10
  97. package/dist/cjs/components/Panel/Panel.js.map +1 -1
  98. package/dist/cjs/components/PanelHeader/PanelHeader.js +2 -11
  99. package/dist/cjs/components/PanelHeader/PanelHeader.js.map +1 -1
  100. package/dist/cjs/components/PanelHeaderBack/PanelHeaderBack.js +2 -7
  101. package/dist/cjs/components/PanelHeaderBack/PanelHeaderBack.js.map +1 -1
  102. package/dist/cjs/components/PanelHeaderButton/PanelHeaderButton.js +2 -7
  103. package/dist/cjs/components/PanelHeaderButton/PanelHeaderButton.js.map +1 -1
  104. package/dist/cjs/components/PanelHeaderClose/PanelHeaderClose.js +1 -1
  105. package/dist/cjs/components/PanelHeaderClose/PanelHeaderClose.js.map +1 -1
  106. package/dist/cjs/components/PanelHeaderContent/PanelHeaderContent.js +5 -4
  107. package/dist/cjs/components/PanelHeaderContent/PanelHeaderContent.js.map +1 -1
  108. package/dist/cjs/components/PanelHeaderContext/PanelHeaderContext.js +4 -8
  109. package/dist/cjs/components/PanelHeaderContext/PanelHeaderContext.js.map +1 -1
  110. package/dist/cjs/components/PanelHeaderEdit/PanelHeaderEdit.js +1 -1
  111. package/dist/cjs/components/PanelHeaderEdit/PanelHeaderEdit.js.map +1 -1
  112. package/dist/cjs/components/PanelHeaderSubmit/PanelHeaderSubmit.js +1 -1
  113. package/dist/cjs/components/PanelHeaderSubmit/PanelHeaderSubmit.js.map +1 -1
  114. package/dist/cjs/components/PromoBanner/PromoBanner.js +1 -6
  115. package/dist/cjs/components/PromoBanner/PromoBanner.js.map +1 -1
  116. package/dist/cjs/components/Search/Search.js +7 -9
  117. package/dist/cjs/components/Search/Search.js.map +1 -1
  118. package/dist/cjs/components/SelectMimicry/SelectMimicry.js +4 -2
  119. package/dist/cjs/components/SelectMimicry/SelectMimicry.js.map +1 -1
  120. package/dist/cjs/components/SliderSwitch/SliderSwitch.js +2 -5
  121. package/dist/cjs/components/SliderSwitch/SliderSwitch.js.map +1 -1
  122. package/dist/cjs/components/SliderSwitch/SliderSwitchButton.js +2 -7
  123. package/dist/cjs/components/SliderSwitch/SliderSwitchButton.js.map +1 -1
  124. package/dist/cjs/components/SubnavigationBar/SubnavigationBar.js +1 -6
  125. package/dist/cjs/components/SubnavigationBar/SubnavigationBar.js.map +1 -1
  126. package/dist/cjs/components/SubnavigationButton/SubnavigationButton.js +2 -5
  127. package/dist/cjs/components/SubnavigationButton/SubnavigationButton.js.map +1 -1
  128. package/dist/cjs/components/Tappable/Tappable.js +8 -16
  129. package/dist/cjs/components/Tappable/Tappable.js.map +1 -1
  130. package/dist/cjs/components/Textarea/Textarea.js +4 -2
  131. package/dist/cjs/components/Textarea/Textarea.js.map +1 -1
  132. package/dist/cjs/components/UsersStack/UsersStack.js +71 -34
  133. package/dist/cjs/components/UsersStack/UsersStack.js.map +1 -1
  134. package/dist/cjs/components/View/View.js +2 -7
  135. package/dist/cjs/components/View/View.js.map +1 -1
  136. package/dist/cjs/components/View/ViewInfinite.js +1 -10
  137. package/dist/cjs/components/View/ViewInfinite.js.map +1 -1
  138. package/dist/cjs/{components/ChipsInput → hooks}/useChipsInput.js +0 -0
  139. package/dist/cjs/hooks/useChipsInput.js.map +1 -0
  140. package/dist/cjs/{components/ChipsSelect → hooks}/useChipsSelect.js +1 -1
  141. package/dist/cjs/hooks/useChipsSelect.js.map +1 -0
  142. package/dist/cjs/index.js +8 -0
  143. package/dist/cjs/index.js.map +1 -1
  144. package/dist/cjs/lib/animate.js +2 -2
  145. package/dist/cjs/lib/animate.js.map +1 -1
  146. package/dist/cjs/lib/platform.js +9 -4
  147. package/dist/cjs/lib/platform.js.map +1 -1
  148. package/dist/cjs/lib/testing.js +2 -2
  149. package/dist/cjs/lib/testing.js.map +1 -1
  150. package/dist/cjs/lib/touch.js +2 -2
  151. package/dist/cjs/lib/touch.js.map +1 -1
  152. package/dist/cjs/tokenized/index.js +232 -0
  153. package/dist/cjs/tokenized/index.js.map +1 -1
  154. package/dist/components/ActionSheet/ActionSheet.js +4 -4
  155. package/dist/components/ActionSheet/ActionSheet.js.map +1 -1
  156. package/dist/components/ActionSheet/ActionSheetDefaultIosCloseItem.d.ts +3 -0
  157. package/dist/components/ActionSheet/ActionSheetDefaultIosCloseItem.js +10 -0
  158. package/dist/components/ActionSheet/ActionSheetDefaultIosCloseItem.js.map +1 -0
  159. package/dist/components/ActionSheet/ActionSheetDropdown.js +7 -7
  160. package/dist/components/ActionSheet/ActionSheetDropdown.js.map +1 -1
  161. package/dist/components/ActionSheet/ActionSheetDropdownDesktop.js +3 -4
  162. package/dist/components/ActionSheet/ActionSheetDropdownDesktop.js.map +1 -1
  163. package/dist/components/ActionSheetItem/ActionSheetItem.d.ts +5 -1
  164. package/dist/components/ActionSheetItem/ActionSheetItem.js +16 -36
  165. package/dist/components/ActionSheetItem/ActionSheetItem.js.map +1 -1
  166. package/dist/components/AdaptivityProvider/AdaptivityProvider.d.ts +4 -4
  167. package/dist/components/AdaptivityProvider/AdaptivityProvider.js +2 -4
  168. package/dist/components/AdaptivityProvider/AdaptivityProvider.js.map +1 -1
  169. package/dist/components/Alert/Alert.js +12 -12
  170. package/dist/components/Alert/Alert.js.map +1 -1
  171. package/dist/components/AppRoot/AppRoot.js +2 -5
  172. package/dist/components/AppRoot/AppRoot.js.map +1 -1
  173. package/dist/components/Avatar/Avatar.js +4 -17
  174. package/dist/components/Avatar/Avatar.js.map +1 -1
  175. package/dist/components/Banner/Banner.js +41 -48
  176. package/dist/components/Banner/Banner.js.map +1 -1
  177. package/dist/components/ButtonGroup/ButtonGroup.d.ts +6 -2
  178. package/dist/components/ButtonGroup/ButtonGroup.js.map +1 -1
  179. package/dist/components/CalendarDay/CalendarDay.js +4 -21
  180. package/dist/components/CalendarDay/CalendarDay.js.map +1 -1
  181. package/dist/components/CardScroll/CardScroll.js +1 -3
  182. package/dist/components/CardScroll/CardScroll.js.map +1 -1
  183. package/dist/components/Chip/Chip.d.ts +12 -5
  184. package/dist/components/Chip/Chip.js.map +1 -1
  185. package/dist/components/ChipsInput/ChipsInput.d.ts +5 -26
  186. package/dist/components/ChipsInput/ChipsInput.js +14 -183
  187. package/dist/components/ChipsInput/ChipsInput.js.map +1 -1
  188. package/dist/components/ChipsInputBase/ChipsInputBase.d.ts +17 -0
  189. package/dist/components/ChipsInputBase/ChipsInputBase.js +188 -0
  190. package/dist/components/ChipsInputBase/ChipsInputBase.js.map +1 -0
  191. package/dist/components/ChipsSelect/ChipsSelect.d.ts +4 -4
  192. package/dist/components/ChipsSelect/ChipsSelect.js +42 -26
  193. package/dist/components/ChipsSelect/ChipsSelect.js.map +1 -1
  194. package/dist/components/CustomSelect/CustomSelect.d.ts +1 -1
  195. package/dist/components/CustomSelect/CustomSelect.js +32 -31
  196. package/dist/components/CustomSelect/CustomSelect.js.map +1 -1
  197. package/dist/components/DateInput/DateInput.d.ts +4 -2
  198. package/dist/components/DateInput/DateInput.js +4 -2
  199. package/dist/components/DateInput/DateInput.js.map +1 -1
  200. package/dist/components/DateRangeInput/DateRangeInput.d.ts +4 -2
  201. package/dist/components/DateRangeInput/DateRangeInput.js +4 -2
  202. package/dist/components/DateRangeInput/DateRangeInput.js.map +1 -1
  203. package/dist/components/DropdownIcon/DropdownIcon.d.ts +4 -2
  204. package/dist/components/DropdownIcon/DropdownIcon.js +15 -7
  205. package/dist/components/DropdownIcon/DropdownIcon.js.map +1 -1
  206. package/dist/components/FormField/FormField.d.ts +2 -1
  207. package/dist/components/FormField/FormField.js +4 -2
  208. package/dist/components/FormField/FormField.js.map +1 -1
  209. package/dist/components/FormLayoutGroup/FormLayoutGroup.d.ts +5 -1
  210. package/dist/components/FormLayoutGroup/FormLayoutGroup.js +9 -3
  211. package/dist/components/FormLayoutGroup/FormLayoutGroup.js.map +1 -1
  212. package/dist/components/FormStatus/FormStatus.d.ts +1 -0
  213. package/dist/components/FormStatus/FormStatus.js +4 -4
  214. package/dist/components/FormStatus/FormStatus.js.map +1 -1
  215. package/dist/components/Header/Header.js +3 -10
  216. package/dist/components/Header/Header.js.map +1 -1
  217. package/dist/components/IconButton/IconButton.js +4 -3
  218. package/dist/components/IconButton/IconButton.js.map +1 -1
  219. package/dist/components/Input/Input.d.ts +1 -1
  220. package/dist/components/Input/Input.js +4 -2
  221. package/dist/components/Input/Input.js.map +1 -1
  222. package/dist/components/List/List.d.ts +2 -1
  223. package/dist/components/List/List.js.map +1 -1
  224. package/dist/components/ModalDismissButton/ModalDismissButton.js +1 -4
  225. package/dist/components/ModalDismissButton/ModalDismissButton.js.map +1 -1
  226. package/dist/components/ModalPage/ModalPage.d.ts +13 -1
  227. package/dist/components/ModalPage/ModalPage.js +12 -10
  228. package/dist/components/ModalPage/ModalPage.js.map +1 -1
  229. package/dist/components/ModalPageHeader/ModalPageHeader.js +3 -3
  230. package/dist/components/ModalPageHeader/ModalPageHeader.js.map +1 -1
  231. package/dist/components/ModalRoot/ModalRoot.js +4 -18
  232. package/dist/components/ModalRoot/ModalRoot.js.map +1 -1
  233. package/dist/components/ModalRoot/ModalRootDesktop.js +3 -11
  234. package/dist/components/ModalRoot/ModalRootDesktop.js.map +1 -1
  235. package/dist/components/NativeSelect/NativeSelect.d.ts +3 -2
  236. package/dist/components/NativeSelect/NativeSelect.js +4 -2
  237. package/dist/components/NativeSelect/NativeSelect.js.map +1 -1
  238. package/dist/components/Panel/Panel.js +4 -8
  239. package/dist/components/Panel/Panel.js.map +1 -1
  240. package/dist/components/PanelHeader/PanelHeader.js +2 -11
  241. package/dist/components/PanelHeader/PanelHeader.js.map +1 -1
  242. package/dist/components/PanelHeaderBack/PanelHeaderBack.js +2 -6
  243. package/dist/components/PanelHeaderBack/PanelHeaderBack.js.map +1 -1
  244. package/dist/components/PanelHeaderButton/PanelHeaderButton.js +2 -7
  245. package/dist/components/PanelHeaderButton/PanelHeaderButton.js.map +1 -1
  246. package/dist/components/PanelHeaderClose/PanelHeaderClose.js +2 -2
  247. package/dist/components/PanelHeaderClose/PanelHeaderClose.js.map +1 -1
  248. package/dist/components/PanelHeaderContent/PanelHeaderContent.js +5 -5
  249. package/dist/components/PanelHeaderContent/PanelHeaderContent.js.map +1 -1
  250. package/dist/components/PanelHeaderContext/PanelHeaderContext.js +3 -7
  251. package/dist/components/PanelHeaderContext/PanelHeaderContext.js.map +1 -1
  252. package/dist/components/PanelHeaderEdit/PanelHeaderEdit.js +2 -2
  253. package/dist/components/PanelHeaderEdit/PanelHeaderEdit.js.map +1 -1
  254. package/dist/components/PanelHeaderSubmit/PanelHeaderSubmit.js +2 -2
  255. package/dist/components/PanelHeaderSubmit/PanelHeaderSubmit.js.map +1 -1
  256. package/dist/components/PromoBanner/PromoBanner.js +1 -4
  257. package/dist/components/PromoBanner/PromoBanner.js.map +1 -1
  258. package/dist/components/Search/Search.js +6 -8
  259. package/dist/components/Search/Search.js.map +1 -1
  260. package/dist/components/Select/Select.d.ts +1 -1
  261. package/dist/components/SelectMimicry/SelectMimicry.d.ts +2 -2
  262. package/dist/components/SelectMimicry/SelectMimicry.js +4 -2
  263. package/dist/components/SelectMimicry/SelectMimicry.js.map +1 -1
  264. package/dist/components/SimpleCell/SimpleCell.d.ts +1 -1
  265. package/dist/components/SliderSwitch/SliderSwitch.js +1 -4
  266. package/dist/components/SliderSwitch/SliderSwitch.js.map +1 -1
  267. package/dist/components/SliderSwitch/SliderSwitchButton.js +1 -5
  268. package/dist/components/SliderSwitch/SliderSwitchButton.js.map +1 -1
  269. package/dist/components/SubnavigationBar/SubnavigationBar.js +1 -4
  270. package/dist/components/SubnavigationBar/SubnavigationBar.js.map +1 -1
  271. package/dist/components/SubnavigationButton/SubnavigationButton.js +2 -5
  272. package/dist/components/SubnavigationButton/SubnavigationButton.js.map +1 -1
  273. package/dist/components/Tappable/Tappable.js +3 -10
  274. package/dist/components/Tappable/Tappable.js.map +1 -1
  275. package/dist/components/Textarea/Textarea.d.ts +3 -2
  276. package/dist/components/Textarea/Textarea.js +4 -2
  277. package/dist/components/Textarea/Textarea.js.map +1 -1
  278. package/dist/components/UsersStack/UsersStack.js +69 -28
  279. package/dist/components/UsersStack/UsersStack.js.map +1 -1
  280. package/dist/components/View/View.js +2 -7
  281. package/dist/components/View/View.js.map +1 -1
  282. package/dist/components/View/ViewInfinite.js +1 -10
  283. package/dist/components/View/ViewInfinite.js.map +1 -1
  284. package/dist/components.css +93 -15
  285. package/dist/components.css.map +1 -1
  286. package/dist/cssm/components/ActionSheet/ActionSheet.css +3 -1
  287. package/dist/cssm/components/ActionSheet/ActionSheet.js +4 -4
  288. package/dist/cssm/components/ActionSheet/ActionSheet.js.map +1 -1
  289. package/dist/cssm/components/ActionSheet/ActionSheetDefaultIosCloseItem.d.ts +3 -0
  290. package/dist/cssm/components/ActionSheet/ActionSheetDefaultIosCloseItem.js +10 -0
  291. package/dist/cssm/components/ActionSheet/ActionSheetDefaultIosCloseItem.js.map +1 -0
  292. package/dist/cssm/components/ActionSheet/ActionSheetDropdown.js +7 -7
  293. package/dist/cssm/components/ActionSheet/ActionSheetDropdown.js.map +1 -1
  294. package/dist/cssm/components/ActionSheet/ActionSheetDropdownDesktop.js +3 -4
  295. package/dist/cssm/components/ActionSheet/ActionSheetDropdownDesktop.js.map +1 -1
  296. package/dist/cssm/components/ActionSheetItem/ActionSheetItem.css +7 -1
  297. package/dist/cssm/components/ActionSheetItem/ActionSheetItem.d.ts +5 -1
  298. package/dist/cssm/components/ActionSheetItem/ActionSheetItem.js +16 -36
  299. package/dist/cssm/components/ActionSheetItem/ActionSheetItem.js.map +1 -1
  300. package/dist/cssm/components/AdaptivityProvider/AdaptivityProvider.d.ts +4 -4
  301. package/dist/cssm/components/AdaptivityProvider/AdaptivityProvider.js +2 -4
  302. package/dist/cssm/components/AdaptivityProvider/AdaptivityProvider.js.map +1 -1
  303. package/dist/cssm/components/Alert/Alert.css +7 -1
  304. package/dist/cssm/components/Alert/Alert.js +12 -12
  305. package/dist/cssm/components/Alert/Alert.js.map +1 -1
  306. package/dist/cssm/components/AppRoot/AppRoot.css +1 -1
  307. package/dist/cssm/components/AppRoot/AppRoot.js +2 -5
  308. package/dist/cssm/components/AppRoot/AppRoot.js.map +1 -1
  309. package/dist/cssm/components/Avatar/Avatar.js +4 -17
  310. package/dist/cssm/components/Avatar/Avatar.js.map +1 -1
  311. package/dist/cssm/components/Banner/Banner.js +41 -48
  312. package/dist/cssm/components/Banner/Banner.js.map +1 -1
  313. package/dist/cssm/components/ButtonGroup/ButtonGroup.d.ts +6 -2
  314. package/dist/cssm/components/ButtonGroup/ButtonGroup.js.map +1 -1
  315. package/dist/cssm/components/CalendarDay/CalendarDay.js +4 -21
  316. package/dist/cssm/components/CalendarDay/CalendarDay.js.map +1 -1
  317. package/dist/cssm/components/CardScroll/CardScroll.js +1 -3
  318. package/dist/cssm/components/CardScroll/CardScroll.js.map +1 -1
  319. package/dist/cssm/components/Cell/CellCheckbox/CellCheckbox.css +1 -1
  320. package/dist/cssm/components/Cell/CellDragger/CellDragger.css +1 -1
  321. package/dist/cssm/components/Chip/Chip.css +1 -1
  322. package/dist/cssm/components/Chip/Chip.d.ts +12 -5
  323. package/dist/cssm/components/Chip/Chip.js.map +1 -1
  324. package/dist/cssm/components/ChipsInput/ChipsInput.css +1 -1
  325. package/dist/cssm/components/ChipsInput/ChipsInput.d.ts +5 -26
  326. package/dist/cssm/components/ChipsInput/ChipsInput.js +14 -183
  327. package/dist/cssm/components/ChipsInput/ChipsInput.js.map +1 -1
  328. package/dist/cssm/components/ChipsInputBase/ChipsInputBase.css +1 -0
  329. package/dist/cssm/components/ChipsInputBase/ChipsInputBase.d.ts +17 -0
  330. package/dist/cssm/components/ChipsInputBase/ChipsInputBase.js +189 -0
  331. package/dist/cssm/components/ChipsInputBase/ChipsInputBase.js.map +1 -0
  332. package/dist/cssm/components/ChipsSelect/ChipsSelect.css +1 -1
  333. package/dist/cssm/components/ChipsSelect/ChipsSelect.d.ts +4 -4
  334. package/dist/cssm/components/ChipsSelect/ChipsSelect.js +42 -26
  335. package/dist/cssm/components/ChipsSelect/ChipsSelect.js.map +1 -1
  336. package/dist/cssm/components/CustomSelect/CustomSelect.css +1 -1
  337. package/dist/cssm/components/CustomSelect/CustomSelect.d.ts +1 -1
  338. package/dist/cssm/components/CustomSelect/CustomSelect.js +32 -31
  339. package/dist/cssm/components/CustomSelect/CustomSelect.js.map +1 -1
  340. package/dist/cssm/components/DateInput/DateInput.css +1 -1
  341. package/dist/cssm/components/DateInput/DateInput.d.ts +4 -2
  342. package/dist/cssm/components/DateInput/DateInput.js +4 -2
  343. package/dist/cssm/components/DateInput/DateInput.js.map +1 -1
  344. package/dist/cssm/components/DateRangeInput/DateRangeInput.css +1 -1
  345. package/dist/cssm/components/DateRangeInput/DateRangeInput.d.ts +4 -2
  346. package/dist/cssm/components/DateRangeInput/DateRangeInput.js +4 -2
  347. package/dist/cssm/components/DateRangeInput/DateRangeInput.js.map +1 -1
  348. package/dist/cssm/components/DropdownIcon/DropdownIcon.d.ts +4 -2
  349. package/dist/cssm/components/DropdownIcon/DropdownIcon.js +15 -8
  350. package/dist/cssm/components/DropdownIcon/DropdownIcon.js.map +1 -1
  351. package/dist/cssm/components/FormField/FormField.css +4 -4
  352. package/dist/cssm/components/FormField/FormField.d.ts +2 -1
  353. package/dist/cssm/components/FormField/FormField.js +4 -2
  354. package/dist/cssm/components/FormField/FormField.js.map +1 -1
  355. package/dist/cssm/components/FormItem/FormItem.css +1 -1
  356. package/dist/cssm/components/FormLayoutGroup/FormLayoutGroup.css +1 -1
  357. package/dist/cssm/components/FormLayoutGroup/FormLayoutGroup.d.ts +5 -1
  358. package/dist/cssm/components/FormLayoutGroup/FormLayoutGroup.js +9 -3
  359. package/dist/cssm/components/FormLayoutGroup/FormLayoutGroup.js.map +1 -1
  360. package/dist/cssm/components/FormStatus/FormStatus.css +3 -1
  361. package/dist/cssm/components/FormStatus/FormStatus.d.ts +1 -0
  362. package/dist/cssm/components/FormStatus/FormStatus.js +4 -4
  363. package/dist/cssm/components/FormStatus/FormStatus.js.map +1 -1
  364. package/dist/cssm/components/Header/Header.css +1 -1
  365. package/dist/cssm/components/Header/Header.js +3 -10
  366. package/dist/cssm/components/Header/Header.js.map +1 -1
  367. package/dist/cssm/components/IconButton/IconButton.js +4 -3
  368. package/dist/cssm/components/IconButton/IconButton.js.map +1 -1
  369. package/dist/cssm/components/Input/Input.css +1 -1
  370. package/dist/cssm/components/Input/Input.d.ts +1 -1
  371. package/dist/cssm/components/Input/Input.js +4 -2
  372. package/dist/cssm/components/Input/Input.js.map +1 -1
  373. package/dist/cssm/components/Link/Link.css +1 -1
  374. package/dist/cssm/components/List/List.d.ts +2 -1
  375. package/dist/cssm/components/List/List.js +1 -1
  376. package/dist/cssm/components/List/List.js.map +1 -1
  377. package/dist/cssm/components/ModalDismissButton/ModalDismissButton.css +1 -1
  378. package/dist/cssm/components/ModalDismissButton/ModalDismissButton.js +1 -4
  379. package/dist/cssm/components/ModalDismissButton/ModalDismissButton.js.map +1 -1
  380. package/dist/cssm/components/ModalPage/ModalPage.css +5 -1
  381. package/dist/cssm/components/ModalPage/ModalPage.d.ts +13 -1
  382. package/dist/cssm/components/ModalPage/ModalPage.js +12 -10
  383. package/dist/cssm/components/ModalPage/ModalPage.js.map +1 -1
  384. package/dist/cssm/components/ModalPageHeader/ModalPageHeader.css +1 -1
  385. package/dist/cssm/components/ModalPageHeader/ModalPageHeader.js +3 -3
  386. package/dist/cssm/components/ModalPageHeader/ModalPageHeader.js.map +1 -1
  387. package/dist/cssm/components/ModalRoot/ModalRoot.js +4 -18
  388. package/dist/cssm/components/ModalRoot/ModalRoot.js.map +1 -1
  389. package/dist/cssm/components/ModalRoot/ModalRootDesktop.js +3 -11
  390. package/dist/cssm/components/ModalRoot/ModalRootDesktop.js.map +1 -1
  391. package/dist/cssm/components/NativeSelect/NativeSelect.d.ts +3 -2
  392. package/dist/cssm/components/NativeSelect/NativeSelect.js +4 -2
  393. package/dist/cssm/components/NativeSelect/NativeSelect.js.map +1 -1
  394. package/dist/cssm/components/Panel/Panel.css +19 -1
  395. package/dist/cssm/components/Panel/Panel.js +4 -8
  396. package/dist/cssm/components/Panel/Panel.js.map +1 -1
  397. package/dist/cssm/components/PanelHeader/PanelHeader.css +9 -1
  398. package/dist/cssm/components/PanelHeader/PanelHeader.js +2 -11
  399. package/dist/cssm/components/PanelHeader/PanelHeader.js.map +1 -1
  400. package/dist/cssm/components/PanelHeaderBack/PanelHeaderBack.js +2 -6
  401. package/dist/cssm/components/PanelHeaderBack/PanelHeaderBack.js.map +1 -1
  402. package/dist/cssm/components/PanelHeaderButton/PanelHeaderButton.css +1 -1
  403. package/dist/cssm/components/PanelHeaderButton/PanelHeaderButton.js +2 -7
  404. package/dist/cssm/components/PanelHeaderButton/PanelHeaderButton.js.map +1 -1
  405. package/dist/cssm/components/PanelHeaderClose/PanelHeaderClose.js +2 -2
  406. package/dist/cssm/components/PanelHeaderClose/PanelHeaderClose.js.map +1 -1
  407. package/dist/cssm/components/PanelHeaderContent/PanelHeaderContent.css +5 -1
  408. package/dist/cssm/components/PanelHeaderContent/PanelHeaderContent.js +5 -5
  409. package/dist/cssm/components/PanelHeaderContent/PanelHeaderContent.js.map +1 -1
  410. package/dist/cssm/components/PanelHeaderContext/PanelHeaderContext.css +1 -1
  411. package/dist/cssm/components/PanelHeaderContext/PanelHeaderContext.js +3 -7
  412. package/dist/cssm/components/PanelHeaderContext/PanelHeaderContext.js.map +1 -1
  413. package/dist/cssm/components/PanelHeaderEdit/PanelHeaderEdit.js +2 -2
  414. package/dist/cssm/components/PanelHeaderEdit/PanelHeaderEdit.js.map +1 -1
  415. package/dist/cssm/components/PanelHeaderSubmit/PanelHeaderSubmit.js +2 -2
  416. package/dist/cssm/components/PanelHeaderSubmit/PanelHeaderSubmit.js.map +1 -1
  417. package/dist/cssm/components/PromoBanner/PromoBanner.css +3 -1
  418. package/dist/cssm/components/PromoBanner/PromoBanner.js +1 -4
  419. package/dist/cssm/components/PromoBanner/PromoBanner.js.map +1 -1
  420. package/dist/cssm/components/Search/Search.css +27 -1
  421. package/dist/cssm/components/Search/Search.js +6 -8
  422. package/dist/cssm/components/Search/Search.js.map +1 -1
  423. package/dist/cssm/components/Select/Select.css +1 -1
  424. package/dist/cssm/components/Select/Select.d.ts +1 -1
  425. package/dist/cssm/components/SelectMimicry/SelectMimicry.d.ts +2 -2
  426. package/dist/cssm/components/SelectMimicry/SelectMimicry.js +4 -2
  427. package/dist/cssm/components/SelectMimicry/SelectMimicry.js.map +1 -1
  428. package/dist/cssm/components/SimpleCell/SimpleCell.d.ts +1 -1
  429. package/dist/cssm/components/SliderSwitch/SliderSwitch.js +1 -4
  430. package/dist/cssm/components/SliderSwitch/SliderSwitch.js.map +1 -1
  431. package/dist/cssm/components/SliderSwitch/SliderSwitchButton.js +1 -5
  432. package/dist/cssm/components/SliderSwitch/SliderSwitchButton.js.map +1 -1
  433. package/dist/cssm/components/Spacing/Spacing.css +1 -1
  434. package/dist/cssm/components/SubnavigationBar/SubnavigationBar.css +1 -1
  435. package/dist/cssm/components/SubnavigationBar/SubnavigationBar.js +1 -4
  436. package/dist/cssm/components/SubnavigationBar/SubnavigationBar.js.map +1 -1
  437. package/dist/cssm/components/SubnavigationButton/SubnavigationButton.css +1 -1
  438. package/dist/cssm/components/SubnavigationButton/SubnavigationButton.js +2 -5
  439. package/dist/cssm/components/SubnavigationButton/SubnavigationButton.js.map +1 -1
  440. package/dist/cssm/components/TabsItem/TabsItem.css +1 -1
  441. package/dist/cssm/components/Tappable/Tappable.js +3 -10
  442. package/dist/cssm/components/Tappable/Tappable.js.map +1 -1
  443. package/dist/cssm/components/Textarea/Textarea.css +1 -1
  444. package/dist/cssm/components/Textarea/Textarea.d.ts +3 -2
  445. package/dist/cssm/components/Textarea/Textarea.js +4 -2
  446. package/dist/cssm/components/Textarea/Textarea.js.map +1 -1
  447. package/dist/cssm/components/Typography/Headline/Headline.css +1 -1
  448. package/dist/cssm/components/Typography/Text/Text.css +1 -1
  449. package/dist/cssm/components/UsersStack/UsersStack.css +1 -1
  450. package/dist/cssm/components/UsersStack/UsersStack.js +69 -28
  451. package/dist/cssm/components/UsersStack/UsersStack.js.map +1 -1
  452. package/dist/cssm/components/View/View.js +2 -7
  453. package/dist/cssm/components/View/View.js.map +1 -1
  454. package/dist/cssm/components/View/ViewInfinite.js +1 -10
  455. package/dist/cssm/components/View/ViewInfinite.js.map +1 -1
  456. package/dist/cssm/{components/ChipsInput → hooks}/useChipsInput.d.ts +4 -3
  457. package/dist/{components/ChipsInput → cssm/hooks}/useChipsInput.js +0 -0
  458. package/dist/cssm/hooks/useChipsInput.js.map +1 -0
  459. package/{.cache/ts/src/components/ChipsSelect → dist/cssm/hooks}/useChipsSelect.d.ts +4 -4
  460. package/dist/{components/ChipsSelect → cssm/hooks}/useChipsSelect.js +1 -1
  461. package/dist/cssm/hooks/useChipsSelect.js.map +1 -0
  462. package/dist/cssm/index.d.ts +3 -0
  463. package/dist/cssm/index.js +1 -0
  464. package/dist/cssm/index.js.map +1 -1
  465. package/dist/cssm/lib/animate.js +1 -1
  466. package/dist/cssm/lib/animate.js.map +1 -1
  467. package/dist/cssm/lib/platform.js +8 -3
  468. package/dist/cssm/lib/platform.js.map +1 -1
  469. package/dist/cssm/lib/testing.js +1 -1
  470. package/dist/cssm/lib/testing.js.map +1 -1
  471. package/dist/cssm/lib/touch.js +1 -1
  472. package/dist/cssm/lib/touch.js.map +1 -1
  473. package/dist/cssm/styles/components.css +93 -15
  474. package/dist/cssm/styles/themes.css +1 -1
  475. package/dist/cssm/styles/unstable.css +1 -1
  476. package/dist/cssm/tokenized/index.d.ts +56 -0
  477. package/dist/cssm/tokenized/index.js +29 -0
  478. package/dist/cssm/tokenized/index.js.map +1 -1
  479. package/dist/{components/ChipsInput → hooks}/useChipsInput.d.ts +4 -3
  480. package/dist/{cssm/components/ChipsInput → hooks}/useChipsInput.js +0 -0
  481. package/dist/hooks/useChipsInput.js.map +1 -0
  482. package/dist/{components/ChipsSelect → hooks}/useChipsSelect.d.ts +4 -4
  483. package/dist/{cssm/components/ChipsSelect → hooks}/useChipsSelect.js +1 -1
  484. package/dist/hooks/useChipsSelect.js.map +1 -0
  485. package/dist/index.d.ts +3 -0
  486. package/dist/index.js +1 -0
  487. package/dist/index.js.map +1 -1
  488. package/dist/lib/animate.js +1 -1
  489. package/dist/lib/animate.js.map +1 -1
  490. package/dist/lib/platform.js +8 -3
  491. package/dist/lib/platform.js.map +1 -1
  492. package/dist/lib/testing.js +1 -1
  493. package/dist/lib/testing.js.map +1 -1
  494. package/dist/lib/touch.js +1 -1
  495. package/dist/lib/touch.js.map +1 -1
  496. package/dist/tokenized/index.d.ts +56 -0
  497. package/dist/tokenized/index.js +29 -0
  498. package/dist/tokenized/index.js.map +1 -1
  499. package/dist/unstable.css +1 -1
  500. package/dist/unstable.css.map +1 -1
  501. package/dist/vkui.css +94 -16
  502. package/dist/vkui.css.map +1 -1
  503. package/package.json +9 -9
  504. package/src/components/ActionSheet/ActionSheet.css +31 -59
  505. package/src/components/ActionSheet/ActionSheet.tsx +4 -7
  506. package/src/components/ActionSheet/ActionSheetDefaultIosCloseItem.tsx +12 -0
  507. package/src/components/ActionSheet/ActionSheetDropdown.tsx +9 -6
  508. package/src/components/ActionSheet/ActionSheetDropdownDesktop.tsx +4 -4
  509. package/src/components/ActionSheet/Readme.md +6 -30
  510. package/src/components/ActionSheetItem/ActionSheetItem.css +67 -120
  511. package/src/components/ActionSheetItem/ActionSheetItem.tsx +42 -71
  512. package/src/components/AdaptivityProvider/AdaptivityProvider.tsx +5 -5
  513. package/src/components/Alert/Alert.css +79 -79
  514. package/src/components/Alert/Alert.tsx +14 -14
  515. package/src/components/Alert/Readme.md +83 -104
  516. package/src/components/AppRoot/AppRoot.css +2 -1
  517. package/src/components/AppRoot/AppRoot.tsx +1 -4
  518. package/src/components/Avatar/Avatar.tsx +15 -17
  519. package/src/components/Avatar/Readme.md +3 -3
  520. package/src/components/Banner/Banner.tsx +58 -63
  521. package/src/components/ButtonGroup/ButtonGroup.tsx +6 -3
  522. package/src/components/ButtonGroup/Readme.md +13 -11
  523. package/src/components/Calendar/Readme.md +3 -0
  524. package/src/components/CalendarDay/CalendarDay.tsx +21 -20
  525. package/src/components/CalendarRange/Readme.md +3 -0
  526. package/src/components/CardScroll/CardScroll.tsx +1 -2
  527. package/src/components/Cell/CellCheckbox/CellCheckbox.css +2 -2
  528. package/src/components/Cell/CellDragger/CellDragger.css +1 -1
  529. package/src/components/Chip/Chip.css +1 -0
  530. package/src/components/Chip/Chip.tsx +14 -2
  531. package/src/components/ChipsInput/ChipsInput.css +0 -71
  532. package/src/components/ChipsInput/ChipsInput.tsx +20 -220
  533. package/src/components/ChipsInputBase/ChipsInputBase.css +73 -0
  534. package/src/components/ChipsInputBase/ChipsInputBase.tsx +206 -0
  535. package/src/components/ChipsSelect/ChipsSelect.css +8 -0
  536. package/src/components/ChipsSelect/ChipsSelect.tsx +47 -39
  537. package/src/components/CustomSelect/CustomSelect.css +1 -0
  538. package/src/components/CustomSelect/CustomSelect.tsx +2 -3
  539. package/src/components/CustomSelect/Readme.md +8 -2
  540. package/src/components/DateInput/DateInput.css +1 -1
  541. package/src/components/DateInput/DateInput.tsx +6 -3
  542. package/src/components/DateInput/Readme.md +13 -0
  543. package/src/components/DateRangeInput/DateRangeInput.css +1 -1
  544. package/src/components/DateRangeInput/DateRangeInput.tsx +6 -3
  545. package/src/components/DateRangeInput/Readme.md +13 -0
  546. package/src/components/DropdownIcon/DropdownIcon.tsx +22 -8
  547. package/src/components/Epic/Readme.md +10 -5
  548. package/src/components/FormField/FormField.css +58 -6
  549. package/src/components/FormField/FormField.tsx +3 -0
  550. package/src/components/FormItem/FormItem.css +5 -3
  551. package/src/components/FormLayoutGroup/FormLayoutGroup.css +35 -0
  552. package/src/components/FormLayoutGroup/FormLayoutGroup.tsx +13 -2
  553. package/src/components/FormLayoutGroup/Readme.md +58 -48
  554. package/src/components/FormStatus/FormStatus.css +8 -5
  555. package/src/components/FormStatus/FormStatus.tsx +4 -8
  556. package/src/components/FormStatus/Readme.md +4 -0
  557. package/src/components/Gallery/Readme.md +64 -18
  558. package/src/components/Header/Header.css +8 -12
  559. package/src/components/Header/Header.tsx +9 -8
  560. package/src/components/HorizontalCell/Readme.md +1 -1
  561. package/src/components/IconButton/IconButton.tsx +2 -2
  562. package/src/components/Input/Input.css +1 -1
  563. package/src/components/Input/Input.tsx +2 -0
  564. package/src/components/Link/Link.css +2 -1
  565. package/src/components/List/List.tsx +3 -4
  566. package/src/components/ModalDismissButton/ModalDismissButton.css +6 -6
  567. package/src/components/ModalDismissButton/ModalDismissButton.tsx +1 -5
  568. package/src/components/ModalDismissButton/Readme.md +1 -1
  569. package/src/components/ModalPage/ModalPage.css +69 -63
  570. package/src/components/ModalPage/ModalPage.tsx +24 -11
  571. package/src/components/ModalPageHeader/ModalPageHeader.css +9 -12
  572. package/src/components/ModalPageHeader/ModalPageHeader.tsx +3 -2
  573. package/src/components/ModalRoot/ModalRoot.tsx +24 -24
  574. package/src/components/ModalRoot/ModalRootDesktop.tsx +12 -14
  575. package/src/components/ModalRoot/Readme.md +8 -3
  576. package/src/components/NativeSelect/NativeSelect.tsx +5 -2
  577. package/src/components/Panel/Panel.css +52 -24
  578. package/src/components/Panel/Panel.tsx +7 -9
  579. package/src/components/PanelHeader/PanelHeader.css +28 -21
  580. package/src/components/PanelHeader/PanelHeader.tsx +11 -12
  581. package/src/components/PanelHeaderBack/PanelHeaderBack.tsx +6 -5
  582. package/src/components/PanelHeaderButton/PanelHeaderButton.css +8 -15
  583. package/src/components/PanelHeaderButton/PanelHeaderButton.tsx +6 -6
  584. package/src/components/PanelHeaderClose/PanelHeaderClose.tsx +2 -6
  585. package/src/components/PanelHeaderContent/PanelHeaderContent.css +17 -23
  586. package/src/components/PanelHeaderContent/PanelHeaderContent.tsx +11 -5
  587. package/src/components/PanelHeaderContext/PanelHeaderContext.css +9 -25
  588. package/src/components/PanelHeaderContext/PanelHeaderContext.tsx +11 -7
  589. package/src/components/PanelHeaderContext/Readme.md +85 -101
  590. package/src/components/PanelHeaderEdit/PanelHeaderEdit.tsx +2 -2
  591. package/src/components/PanelHeaderSubmit/PanelHeaderSubmit.tsx +2 -6
  592. package/src/components/PromoBanner/PromoBanner.css +10 -22
  593. package/src/components/PromoBanner/PromoBanner.tsx +1 -5
  594. package/src/components/RichTooltip/Readme.md +2 -2
  595. package/src/components/Search/Search.css +134 -48
  596. package/src/components/Search/Search.tsx +13 -8
  597. package/src/components/Select/Select.css +2 -2
  598. package/src/components/SelectMimicry/Readme.md +3 -3
  599. package/src/components/SelectMimicry/SelectMimicry.tsx +3 -1
  600. package/src/components/SliderSwitch/SliderSwitch.tsx +5 -5
  601. package/src/components/SliderSwitch/SliderSwitchButton.tsx +7 -7
  602. package/src/components/Snackbar/Readme.md +12 -3
  603. package/src/components/Spacing/Readme.md +20 -20
  604. package/src/components/Spacing/Spacing.css +5 -1
  605. package/src/components/SplitLayout/Readme.md +1 -1
  606. package/src/components/SubnavigationBar/SubnavigationBar.css +7 -19
  607. package/src/components/SubnavigationBar/SubnavigationBar.tsx +1 -8
  608. package/src/components/SubnavigationButton/SubnavigationButton.css +13 -0
  609. package/src/components/SubnavigationButton/SubnavigationButton.tsx +1 -4
  610. package/src/components/TabbarItem/Readme.md +6 -1
  611. package/src/components/Tabs/Readme.md +10 -2
  612. package/src/components/TabsItem/TabsItem.css +1 -1
  613. package/src/components/Tappable/Tappable.tsx +9 -11
  614. package/src/components/Textarea/Textarea.css +1 -1
  615. package/src/components/Textarea/Textarea.tsx +5 -2
  616. package/src/components/Tooltip/Readme.md +2 -2
  617. package/src/components/Touch/Readme.md +4 -4
  618. package/src/components/Typography/Headline/Headline.css +10 -0
  619. package/src/components/Typography/Text/Text.css +10 -0
  620. package/src/components/UsersStack/UsersStack.css +42 -0
  621. package/src/components/UsersStack/UsersStack.tsx +71 -15
  622. package/src/components/View/Readme.md +5 -5
  623. package/src/components/View/View.tsx +2 -9
  624. package/src/components/View/ViewInfinite.tsx +14 -14
  625. package/src/{components/ChipsInput → hooks}/useChipsInput.ts +5 -8
  626. package/src/{components/ChipsSelect → hooks}/useChipsSelect.ts +4 -4
  627. package/src/index.ts +3 -0
  628. package/src/lib/animate.ts +1 -1
  629. package/src/lib/platform.ts +12 -6
  630. package/src/lib/testing.ts +1 -1
  631. package/src/lib/touch.ts +1 -1
  632. package/src/styles/components.css +1 -0
  633. package/src/tokenized/index.ts +85 -0
  634. package/.cache/ts/src/components/UsersStack/masks.d.ts +0 -1
  635. package/dist/cjs/components/ChipsInput/useChipsInput.js.map +0 -1
  636. package/dist/cjs/components/ChipsSelect/useChipsSelect.js.map +0 -1
  637. package/dist/cjs/components/UsersStack/masks.js +0 -29
  638. package/dist/cjs/components/UsersStack/masks.js.map +0 -1
  639. package/dist/components/ChipsInput/useChipsInput.js.map +0 -1
  640. package/dist/components/ChipsSelect/useChipsSelect.js.map +0 -1
  641. package/dist/components/UsersStack/masks.d.ts +0 -1
  642. package/dist/components/UsersStack/masks.js +0 -20
  643. package/dist/components/UsersStack/masks.js.map +0 -1
  644. package/dist/cssm/components/ChipsInput/useChipsInput.js.map +0 -1
  645. package/dist/cssm/components/ChipsSelect/useChipsSelect.js.map +0 -1
  646. package/dist/cssm/components/DropdownIcon/DropdownIcon.css +0 -1
  647. package/dist/cssm/components/UsersStack/masks.d.ts +0 -1
  648. package/dist/cssm/components/UsersStack/masks.js +0 -20
  649. package/dist/cssm/components/UsersStack/masks.js.map +0 -1
  650. package/src/components/DropdownIcon/DropdownIcon.css +0 -3
  651. package/src/components/UsersStack/masks.tsx +0 -69
@@ -1 +1,9 @@
1
- .vkuiPanelHeader{position:relative}.vkuiPanelHeader--vis.vkuiPanelHeader--fixed:before{content:"";display:block}.vkuiPanelHeader:not(.vkuiPanelHeader--vis):not(.vkuiPanelHeader--fixed){height:0}.vkuiPanelHeader__fixed{z-index:10}.vkuiPanelHeader__in{align-items:center;background:#fff;background:var(--header_background);display:flex;justify-content:space-between;position:relative;white-space:nowrap}.vkuiPanelHeader--trnsp .vkuiPanelHeader__in{background:transparent}.vkuiPanelHeader--shadow .vkuiPanelHeader__in{box-shadow:0 0 4px rgba(0,0,0,.08)}.vkuiPanelHeader__before{box-sizing:border-box;color:#2688eb;color:var(--header_tint);display:flex;flex-shrink:0}.vkuiPanelHeader__content{overflow:hidden}.vkuiPanelHeader__content>*{display:block;overflow:hidden;text-overflow:ellipsis}.vkuiPanelHeader__content-in{color:#000;color:var(--header_text);font-family:VK Sans Display,-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--font-display);font-weight:500}.vkuiPanelHeader:before,.vkuiPanelHeader__in{height:56px;height:var(--panelheader_height);padding-top:0;padding-top:var(--safe-area-inset-top)}.vkuiPanelHeader__after{box-sizing:border-box;color:#2688eb;color:var(--header_tint);display:flex;justify-content:flex-end}.vkuiPanelHeader--vkapps .vkuiPanelHeader__after{min-width:90px}.vkuiPanelHeader--ios{--panelheader_height:var(--panelheader_height_ios)}.vkuiPanelHeader--ios .vkuiPanelHeader__before{flex-basis:0;flex-grow:1;flex-shrink:0;opacity:1;padding:4px 0 4px 4px;transition:opacity .3s cubic-bezier(.36,.66,.04,1);transition:opacity .3s var(--ios-easing)}.vkuiPanelHeader--ios .vkuiPanelHeader__before .vkuiPanelHeaderButton+.vkuiPanelHeaderButton--primitive{margin-left:-6px;padding-left:0}.vkuiPanelHeader--ios .vkuiPanelHeader__content{opacity:1;text-align:center;transition:opacity .3s cubic-bezier(.36,.66,.04,1);transition:opacity .3s var(--ios-easing)}.vkuiPanelHeader--ios .vkuiPanelHeader__content-in{font-size:21px}.vkuiPanelHeader--ios .vkuiPanelHeader__content>*{padding:0 4px}.vkuiPanelHeader--ios.vkuiPanelHeader--no-before .vkuiPanelHeader__content>*{padding-left:0}.vkuiPanelHeader--ios.vkuiPanelHeader--no-before .vkuiPanelHeader__content{padding-left:8px}.vkuiPanelHeader--ios.vkuiPanelHeader--no-after .vkuiPanelHeader__content>*{padding-right:0}.vkuiPanelHeader--ios.vkuiPanelHeader--no-after .vkuiPanelHeader__content{padding-right:8px}.vkuiPanelHeader--ios .vkuiPanelHeader__after{flex-basis:0;flex-grow:1;flex-shrink:0;opacity:1;padding:4px 4px 4px 0;transition:opacity .3s cubic-bezier(.36,.66,.04,1);transition:opacity .3s var(--ios-easing)}.vkuiView--ios .vkuiView__panel--prev .vkuiPanelHeader__after,.vkuiView--ios .vkuiView__panel--prev .vkuiPanelHeader__before,.vkuiView--ios .vkuiView__panel--prev .vkuiPanelHeader__content{opacity:0}.vkuiPanelHeader--android .vkuiPanelHeader__before:not(:empty){padding:4px 0 4px 4px}.vkuiPanelHeader--android .vkuiPanelHeader__content{align-items:center;flex-grow:1;max-width:100%}.vkuiPanelHeader--android .vkuiPanelHeader__content-in{font-size:23px}.vkuiPanelHeader--android .vkuiPanelHeader__content>*{padding:0 12px}.vkuiPanelHeader--android .vkuiSearch,.vkuiPanelHeader--vkcom .vkuiSearch{padding:0 4px}.vkuiPanelHeader--android.vkuiPanelHeader--no-before .vkuiPanelHeader__content>*,.vkuiPanelHeader--vkcom.vkuiPanelHeader--no-before .vkuiPanelHeader__content>*{padding-left:0}.vkuiPanelHeader--android.vkuiPanelHeader--no-before .vkuiPanelHeader__content{padding-left:16px}.vkuiSplitCol--spaced .vkuiPanelHeader--android.vkuiPanelHeader--no-before:not(.vkuiModalPageHeader__in) .vkuiPanelHeader__content{padding-left:0}.vkuiPanelHeader--android.vkuiPanelHeader--no-after .vkuiPanelHeader__content>*,.vkuiPanelHeader--vkcom.vkuiPanelHeader--no-after .vkuiPanelHeader__content>*{padding-right:0}.vkuiPanelHeader--android.vkuiPanelHeader--no-after .vkuiPanelHeader__content{padding-right:16px}.vkuiSplitCol--spaced .vkuiPanelHeader--android.vkuiPanelHeader--no-after:not(.vkuiModalPageHeader__in) .vkuiPanelHeader__content{padding-right:0}.vkuiPanelHeader--android .vkuiPanelHeader__after:not(:empty),.vkuiPanelHeader--vkcom .vkuiPanelHeader__after:not(:empty){padding:4px 4px 4px 0}.vkuiPanelHeader--vkcom{--panelheader_height:var(--panelheader_height_vkcom);position:relative;z-index:10}.vkuiPanelHeader--vkcom.vkuiPanelHeader--sizeX-regular:not(.vkuiModalPageHeader__in):after{background-color:#fff;background-color:var(--header_background);bottom:0;content:"";height:1px;height:var(--thin-border);left:1px;left:var(--thin-border);position:absolute;right:1px;right:var(--thin-border)}.vkuiPanelHeader--vkcom.vkuiPanelHeader--sizeX-regular:not(.vkuiModalPageHeader__in) .vkuiPanelHeader__in{border-bottom:none;border-top-left-radius:8px;border-top-right-radius:8px;box-shadow:inset 0 0 0 1px #e1e3e6;box-shadow:0 0 0 var(--thin-border) var(--input_border) inset}.vkuiPanelHeader--vkcom .vkuiPanelHeader__content{text-align:center}.vkuiPanelHeader--vkcom .vkuiPanelHeader__before:not(:empty){padding:0 0 0 4px}.vkuiPanelHeader--vkcom .vkuiPanelHeader__after,.vkuiPanelHeader--vkcom .vkuiPanelHeader__before{flex-basis:0;flex-grow:1;flex-shrink:0}
1
+ .vkuiPanelHeader{position:relative}.vkuiPanelHeader--vis.vkuiPanelHeader--fixed:before{content:"";display:block}.vkuiPanelHeader:not(.vkuiPanelHeader--vis):not(.vkuiPanelHeader--fixed){height:0}.vkuiPanelHeader__fixed{z-index:10}.vkuiPanelHeader__in{align-items:center;background:#fff;background:var(--header_background,var(--vkui--color_background_content));display:flex;justify-content:space-between;position:relative;white-space:nowrap}.vkuiPanelHeader--trnsp .vkuiPanelHeader__in{background:transparent}.vkuiPanelHeader--shadow .vkuiPanelHeader__in{box-shadow:0 0 4px rgba(0,0,0,.08)}.vkuiPanelHeader__before{box-sizing:border-box;color:#2688eb;color:var(--header_tint,var(--vkui--color_icon_accent_themed));display:flex;flex-shrink:0}.vkuiPanelHeader__content{overflow:hidden}.vkuiPanelHeader__content>*{display:block;overflow:hidden;text-overflow:ellipsis}.vkuiPanelHeader__content-in{color:#000;color:var(--header_text,var(--vkui--color_text_primary));font-family:VK Sans Display,-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--font-display);font-weight:500}.vkuiPanelHeader:before,.vkuiPanelHeader__in{height:56px;height:var(
2
+ --panelheader_height,var(--vkui--size_panel_header_height--regular)
3
+ );padding-top:0;padding-top:var(--safe-area-inset-top)}.vkuiPanelHeader__after{box-sizing:border-box;color:#2688eb;color:var(--header_tint,var(--vkui--color_icon_accent_themed));display:flex;justify-content:flex-end}.vkuiPanelHeader--vkapps .vkuiPanelHeader__after{min-width:90px}.vkuiPanelHeader--ios{--panelheader_height:var(
4
+ --panelheader_height_ios,var(--vkui--size_panel_header_height--regular)
5
+ )}.vkuiPanelHeader--ios .vkuiPanelHeader__before{flex-basis:0;flex-grow:1;flex-shrink:0;opacity:1;padding:4px 0 4px 4px;transition:opacity .3s cubic-bezier(.36,.66,.04,1);transition:opacity .3s var(--ios-easing)}.vkuiPanelHeader--ios .vkuiPanelHeader__before .vkuiPanelHeaderButton+.vkuiPanelHeaderButton--primitive{margin-left:-6px;padding-left:0}.vkuiPanelHeader--ios .vkuiPanelHeader__content{opacity:1;text-align:center;transition:opacity .3s cubic-bezier(.36,.66,.04,1);transition:opacity .3s var(--ios-easing)}.vkuiPanelHeader--ios .vkuiPanelHeader__content-in{font-size:21px}.vkuiPanelHeader--ios .vkuiPanelHeader__content>*{padding:0 4px}.vkuiPanelHeader--ios.vkuiPanelHeader--no-before .vkuiPanelHeader__content{padding-left:8px}.vkuiPanelHeader--ios.vkuiPanelHeader--no-after .vkuiPanelHeader__content>*{padding-right:0}.vkuiPanelHeader--ios.vkuiPanelHeader--no-after .vkuiPanelHeader__content{padding-right:8px}.vkuiPanelHeader--ios .vkuiPanelHeader__after{flex-basis:0;flex-grow:1;flex-shrink:0;opacity:1;padding:4px 4px 4px 0;transition:opacity .3s cubic-bezier(.36,.66,.04,1);transition:opacity .3s var(--ios-easing)}.vkuiView--ios .vkuiView__panel--prev .vkuiPanelHeader__after,.vkuiView--ios .vkuiView__panel--prev .vkuiPanelHeader__before,.vkuiView--ios .vkuiView__panel--prev .vkuiPanelHeader__content{opacity:0}.vkuiPanelHeader--android .vkuiPanelHeader__before:not(:empty){padding:4px 0 4px 4px}.vkuiPanelHeader--android .vkuiPanelHeader__content{align-items:center;flex-grow:1;max-width:100%}.vkuiPanelHeader--android .vkuiPanelHeader__content-in{font-size:23px}.vkuiPanelHeader--android .vkuiPanelHeader__content>*{padding:0 12px}.vkuiPanelHeader--android .vkuiSearch,.vkuiPanelHeader--vkcom .vkuiSearch{padding:0 4px}.vkuiSplitCol--spaced .vkuiPanelHeader--android.vkuiPanelHeader--no-before:not(.vkuiModalPageHeader__in) .vkuiPanelHeader__content{padding-left:0}.vkuiPanelHeader--android.vkuiPanelHeader--no-after .vkuiPanelHeader__content>*,.vkuiPanelHeader--vkcom.vkuiPanelHeader--no-after .vkuiPanelHeader__content>*{padding-right:0}.vkuiPanelHeader--android.vkuiPanelHeader--no-after .vkuiPanelHeader__content{padding-right:16px}.vkuiPanelHeader--android.vkuiPanelHeader--no-before .vkuiPanelHeader__content{padding-left:16px}.vkuiSplitCol--spaced .vkuiPanelHeader--android.vkuiPanelHeader--no-after:not(.vkuiModalPageHeader__in) .vkuiPanelHeader__content{padding-right:0}.vkuiPanelHeader--android .vkuiPanelHeader__after:not(:empty),.vkuiPanelHeader--vkcom .vkuiPanelHeader__after:not(:empty){padding:4px 4px 4px 0}.vkuiPanelHeader--vkcom{--panelheader_height:var(
6
+ --panelheader_height_vkcom,var(--vkui--size_panel_header_height--regular)
7
+ );position:relative;z-index:10}.vkuiPanelHeader--vkcom.vkuiPanelHeader--sizeX-regular:not(.vkuiModalPageHeader__in):after{background-color:#fff;background-color:var(
8
+ --header_background,var(--vkui--color_background_content)
9
+ );bottom:0;content:"";height:1px;height:var(--thin-border);left:1px;left:var(--thin-border);position:absolute;right:1px;right:var(--thin-border)}.vkuiPanelHeader--vkcom.vkuiPanelHeader--sizeX-regular:not(.vkuiModalPageHeader__in) .vkuiPanelHeader__in{border-bottom:none;border-top-left-radius:8px;border-top-right-radius:8px;box-shadow:inset 0 0 0 1px #e1e3e6;box-shadow:0 0 0 var(--thin-border) var(--input_border) inset}.vkuiPanelHeader--vkcom .vkuiPanelHeader__content{text-align:center}.vkuiPanelHeader--vkcom .vkuiPanelHeader__before:not(:empty){padding:0 0 0 4px}.vkuiPanelHeader--vkcom .vkuiPanelHeader__after,.vkuiPanelHeader--vkcom .vkuiPanelHeader__before{flex-basis:0;flex-grow:1;flex-shrink:0}.vkuiPanelHeader--no-before .vkuiPanelHeader__content>*{padding-left:0}
@@ -98,17 +98,8 @@ var PanelHeaderComponent = function PanelHeaderComponent(_ref2) {
98
98
  children: children
99
99
  };
100
100
  return createScopedElement("div", _extends({}, restProps, {
101
- // eslint-disable-next-line vkui/no-object-expression-in-arguments
102
- vkuiClass: classNames(getClassName("PanelHeader", platform), {
103
- "PanelHeader--trnsp": transparent,
104
- "PanelHeader--shadow": needShadow,
105
- "PanelHeader--vis": visor,
106
- "PanelHeader--sep": separator && visor,
107
- "PanelHeader--vkapps": webviewType === WebviewType.VKAPPS && !isInsideModal,
108
- "PanelHeader--no-before": !before,
109
- "PanelHeader--no-after": !after,
110
- "PanelHeader--fixed": isFixed
111
- }, "PanelHeader--sizeX-".concat(sizeX)),
101
+ vkuiClass: classNames(getClassName("PanelHeader", platform), transparent && "PanelHeader--trnsp", needShadow && "PanelHeader--shadow", visor && "PanelHeader--vis", separator && visor && "PanelHeader--sep", webviewType === WebviewType.VKAPPS && !isInsideModal && "PanelHeader--vkapps", !before && "PanelHeader--no-before", !after && "PanelHeader--no-after", isFixed && "PanelHeader--fixed", // TODO v5.0.0 поправить под новую адаптивность
102
+ "PanelHeader--sizeX-".concat(sizeX)),
112
103
  ref: isFixed ? getRootRef : getRef
113
104
  }), isFixed ? createScopedElement(FixedLayout, {
114
105
  vkuiClass: "PanelHeader__fixed",
@@ -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","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"}
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 vkuiClass={classNames(\n getClassName(\"PanelHeader\", platform),\n transparent && \"PanelHeader--trnsp\",\n needShadow && \"PanelHeader--shadow\",\n visor && \"PanelHeader--vis\",\n separator && visor && \"PanelHeader--sep\",\n webviewType === WebviewType.VKAPPS &&\n !isInsideModal &&\n \"PanelHeader--vkapps\",\n !before && \"PanelHeader--no-before\",\n !after && \"PanelHeader--no-after\",\n isFixed && \"PanelHeader--fixed\",\n // TODO v5.0.0 поправить под новую адаптивность\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"}
@@ -8,7 +8,6 @@ import { PanelHeaderButton } from "../PanelHeaderButton/PanelHeaderButton";
8
8
  import { ANDROID, VKCOM, IOS } from "../../lib/platform";
9
9
  import { usePlatform } from "../../hooks/usePlatform";
10
10
  import { withAdaptivity, SizeType } from "../../hoc/withAdaptivity";
11
- import { getClassName } from "../../helpers/getClassName";
12
11
  import { classNames } from "../../lib/classNames";
13
12
  import "./PanelHeaderBack.css";
14
13
 
@@ -25,11 +24,8 @@ export var PanelHeaderBackComponent = function PanelHeaderBackComponent(_ref) {
25
24
  var platform = usePlatform();
26
25
  var showLabel = platform === VKCOM || platform === IOS && sizeX === SizeType.REGULAR;
27
26
  return createScopedElement(PanelHeaderButton, _extends({}, restProps, {
28
- "aria-label": ariaLabel // eslint-disable-next-line vkui/no-object-expression-in-arguments
29
- ,
30
- vkuiClass: classNames(getClassName("PanelHeaderBack", platform), {
31
- "PanelHeaderBack--has-label": showLabel && !!label
32
- }),
27
+ "aria-label": ariaLabel,
28
+ vkuiClass: classNames("PanelHeaderBack", platform === IOS && "PanelHeaderBack--ios", platform === VKCOM && "PanelHeaderBack--vkcom", showLabel && !!label && "PanelHeaderBack--has-label"),
33
29
  label: showLabel && label
34
30
  }), platform === ANDROID && createScopedElement(Icon28ArrowLeftOutline, null), platform === VKCOM && createScopedElement(Icon28ChevronLeftOutline, null), platform === IOS && createScopedElement(Icon28ChevronBack, null));
35
31
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/PanelHeaderBack/PanelHeaderBack.tsx"],"names":["React","Icon28ChevronBack","Icon28ChevronLeftOutline","Icon28ArrowLeftOutline","PanelHeaderButton","ANDROID","VKCOM","IOS","usePlatform","withAdaptivity","SizeType","getClassName","classNames","PanelHeaderBackComponent","label","sizeX","ariaLabel","restProps","platform","showLabel","REGULAR","PanelHeaderBack","memo","displayName"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SACEC,iBADF,EAEEC,wBAFF,EAGEC,sBAHF,QAIO,kBAJP;AAKA,SACEC,iBADF;AAIA,SAASC,OAAT,EAAkBC,KAAlB,EAAyBC,GAAzB;AACA,SAASC,WAAT;AACA,SACEC,cADF,EAEEC,QAFF;AAKA,SAASC,YAAT;AACA,SAASC,UAAT;AACA;;AAOA;AACA;AACA;AACA,OAAO,IAAMC,wBAAwB,GAAG,SAA3BA,wBAA2B,OAKQ;AAAA,MAJ9CC,KAI8C,QAJ9CA,KAI8C;AAAA,MAH9CC,KAG8C,QAH9CA,KAG8C;AAAA,4BAF9C,YAE8C;AAAA,MAFhCC,SAEgC,+BAFpB,OAEoB;AAAA,MAD3CC,SAC2C;;AAC9C,MAAMC,QAAQ,GAAGV,WAAW,EAA5B;AACA,MAAMW,SAAS,GACbD,QAAQ,KAAKZ,KAAb,IAAuBY,QAAQ,KAAKX,GAAb,IAAoBQ,KAAK,KAAKL,QAAQ,CAACU,OADhE;AAGA,SACE,oBAAC,iBAAD,eACMH,SADN;AAEE,kBAAYD,SAFd,CAGE;AAHF;AAIE,IAAA,SAAS,EAAEJ,UAAU,CAACD,YAAY,CAAC,iBAAD,EAAoBO,QAApB,CAAb,EAA4C;AAC/D,oCAA8BC,SAAS,IAAI,CAAC,CAACL;AADkB,KAA5C,CAJvB;AAOE,IAAA,KAAK,EAAEK,SAAS,IAAIL;AAPtB,MASGI,QAAQ,KAAKb,OAAb,IAAwB,oBAAC,sBAAD,OAT3B,EAUGa,QAAQ,KAAKZ,KAAb,IAAsB,oBAAC,wBAAD,OAVzB,EAWGY,QAAQ,KAAKX,GAAb,IAAoB,oBAAC,iBAAD,OAXvB,CADF;AAeD,CAzBM;AA2BP,OAAO,IAAMc,eAAe,gBAAGrB,KAAK,CAACsB,IAAN,CAC7Bb,cAAc,CAACI,wBAAD,EAA2B;AACvCE,EAAAA,KAAK,EAAE;AADgC,CAA3B,CADe,CAAxB;AAMPM,eAAe,CAACE,WAAhB,GAA8B,iBAA9B","sourcesContent":["import * as React from \"react\";\nimport {\n Icon28ChevronBack,\n Icon28ChevronLeftOutline,\n Icon28ArrowLeftOutline,\n} from \"@vkontakte/icons\";\nimport {\n PanelHeaderButton,\n PanelHeaderButtonProps,\n} from \"../PanelHeaderButton/PanelHeaderButton\";\nimport { ANDROID, VKCOM, IOS } from \"../../lib/platform\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport {\n withAdaptivity,\n SizeType,\n AdaptivityProps,\n} from \"../../hoc/withAdaptivity\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport \"./PanelHeaderBack.css\";\n\nexport type PanelHeaderBackProps = PanelHeaderButtonProps &\n AdaptivityProps & {\n \"aria-label\"?: string;\n };\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderBack\n */\nexport const PanelHeaderBackComponent = ({\n label,\n sizeX,\n \"aria-label\": ariaLabel = \"Назад\",\n ...restProps\n}: PanelHeaderButtonProps & AdaptivityProps) => {\n const platform = usePlatform();\n const showLabel =\n platform === VKCOM || (platform === IOS && sizeX === SizeType.REGULAR);\n\n return (\n <PanelHeaderButton\n {...restProps}\n aria-label={ariaLabel}\n // eslint-disable-next-line vkui/no-object-expression-in-arguments\n vkuiClass={classNames(getClassName(\"PanelHeaderBack\", platform), {\n \"PanelHeaderBack--has-label\": showLabel && !!label,\n })}\n label={showLabel && label}\n >\n {platform === ANDROID && <Icon28ArrowLeftOutline />}\n {platform === VKCOM && <Icon28ChevronLeftOutline />}\n {platform === IOS && <Icon28ChevronBack />}\n </PanelHeaderButton>\n );\n};\n\nexport const PanelHeaderBack = React.memo(\n withAdaptivity(PanelHeaderBackComponent, {\n sizeX: true,\n })\n);\n\nPanelHeaderBack.displayName = \"PanelHeaderBack\";\n"],"file":"PanelHeaderBack.js"}
1
+ {"version":3,"sources":["../../../../src/components/PanelHeaderBack/PanelHeaderBack.tsx"],"names":["React","Icon28ChevronBack","Icon28ChevronLeftOutline","Icon28ArrowLeftOutline","PanelHeaderButton","ANDROID","VKCOM","IOS","usePlatform","withAdaptivity","SizeType","classNames","PanelHeaderBackComponent","label","sizeX","ariaLabel","restProps","platform","showLabel","REGULAR","PanelHeaderBack","memo","displayName"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SACEC,iBADF,EAEEC,wBAFF,EAGEC,sBAHF,QAIO,kBAJP;AAKA,SACEC,iBADF;AAIA,SAASC,OAAT,EAAkBC,KAAlB,EAAyBC,GAAzB;AACA,SAASC,WAAT;AACA,SACEC,cADF,EAEEC,QAFF;AAKA,SAASC,UAAT;AACA;;AAOA;AACA;AACA;AACA,OAAO,IAAMC,wBAAwB,GAAG,SAA3BA,wBAA2B,OAKQ;AAAA,MAJ9CC,KAI8C,QAJ9CA,KAI8C;AAAA,MAH9CC,KAG8C,QAH9CA,KAG8C;AAAA,4BAF9C,YAE8C;AAAA,MAFhCC,SAEgC,+BAFpB,OAEoB;AAAA,MAD3CC,SAC2C;;AAC9C,MAAMC,QAAQ,GAAGT,WAAW,EAA5B;AACA,MAAMU,SAAS,GACbD,QAAQ,KAAKX,KAAb,IAAuBW,QAAQ,KAAKV,GAAb,IAAoBO,KAAK,KAAKJ,QAAQ,CAACS,OADhE;AAGA,SACE,oBAAC,iBAAD,eACMH,SADN;AAEE,kBAAYD,SAFd;AAGE,IAAA,SAAS,EAAEJ,UAAU,CACnB,iBADmB,EAEnBM,QAAQ,KAAKV,GAAb,IAAoB,sBAFD,EAGnBU,QAAQ,KAAKX,KAAb,IAAsB,wBAHH,EAInBY,SAAS,IAAI,CAAC,CAACL,KAAf,IAAwB,4BAJL,CAHvB;AASE,IAAA,KAAK,EAAEK,SAAS,IAAIL;AATtB,MAWGI,QAAQ,KAAKZ,OAAb,IAAwB,oBAAC,sBAAD,OAX3B,EAYGY,QAAQ,KAAKX,KAAb,IAAsB,oBAAC,wBAAD,OAZzB,EAaGW,QAAQ,KAAKV,GAAb,IAAoB,oBAAC,iBAAD,OAbvB,CADF;AAiBD,CA3BM;AA6BP,OAAO,IAAMa,eAAe,gBAAGpB,KAAK,CAACqB,IAAN,CAC7BZ,cAAc,CAACG,wBAAD,EAA2B;AACvCE,EAAAA,KAAK,EAAE;AADgC,CAA3B,CADe,CAAxB;AAMPM,eAAe,CAACE,WAAhB,GAA8B,iBAA9B","sourcesContent":["import * as React from \"react\";\nimport {\n Icon28ChevronBack,\n Icon28ChevronLeftOutline,\n Icon28ArrowLeftOutline,\n} from \"@vkontakte/icons\";\nimport {\n PanelHeaderButton,\n PanelHeaderButtonProps,\n} from \"../PanelHeaderButton/PanelHeaderButton\";\nimport { ANDROID, VKCOM, IOS } from \"../../lib/platform\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport {\n withAdaptivity,\n SizeType,\n AdaptivityProps,\n} from \"../../hoc/withAdaptivity\";\nimport { classNames } from \"../../lib/classNames\";\nimport \"./PanelHeaderBack.css\";\n\nexport type PanelHeaderBackProps = PanelHeaderButtonProps &\n AdaptivityProps & {\n \"aria-label\"?: string;\n };\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderBack\n */\nexport const PanelHeaderBackComponent = ({\n label,\n sizeX,\n \"aria-label\": ariaLabel = \"Назад\",\n ...restProps\n}: PanelHeaderButtonProps & AdaptivityProps) => {\n const platform = usePlatform();\n const showLabel =\n platform === VKCOM || (platform === IOS && sizeX === SizeType.REGULAR);\n\n return (\n <PanelHeaderButton\n {...restProps}\n aria-label={ariaLabel}\n vkuiClass={classNames(\n \"PanelHeaderBack\",\n platform === IOS && \"PanelHeaderBack--ios\",\n platform === VKCOM && \"PanelHeaderBack--vkcom\",\n showLabel && !!label && \"PanelHeaderBack--has-label\"\n )}\n label={showLabel && label}\n >\n {platform === ANDROID && <Icon28ArrowLeftOutline />}\n {platform === VKCOM && <Icon28ChevronLeftOutline />}\n {platform === IOS && <Icon28ChevronBack />}\n </PanelHeaderButton>\n );\n};\n\nexport const PanelHeaderBack = React.memo(\n withAdaptivity(PanelHeaderBackComponent, {\n sizeX: true,\n })\n);\n\nPanelHeaderBack.displayName = \"PanelHeaderBack\";\n"],"file":"PanelHeaderBack.js"}
@@ -1 +1 @@
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
+ .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--primitive{height:48px;line-height:48px;padding:0 12px}.vkuiPanelHeaderButton--ios{align-items:center;display:flex;font-size:17px;position:relative}.vkuiPanelHeaderButton--ios.vkuiPanelHeaderButton--primitive{height:44px;line-height:44px}.vkuiPanelHeaderButton--ios .vkuiIcon--24{padding:10px}.vkuiPanelHeaderButton--ios .vkuiIcon--28{padding:8px}.vkuiPanelHeaderButton--android.vkuiPanelHeaderButton--notPrimitive{border-radius:50%}.vkuiPanelHeaderButton--android .vkuiIcon--24{padding:12px}.vkuiPanelHeaderButton--android .vkuiIcon--28{padding:10px}.vkuiPanelHeaderButton--vkcom{color:#818c99;color:var(--header_text_secondary,var(--vkui--color_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--notPrimitive{border-radius:50%}
@@ -77,13 +77,8 @@ export var PanelHeaderButton = function PanelHeaderButton(_ref2) {
77
77
  hoverMode: hoverMode,
78
78
  Component: restProps.href ? "a" : "button",
79
79
  activeEffectDelay: 200,
80
- activeMode: activeMode // eslint-disable-next-line vkui/no-object-expression-in-arguments
81
- ,
82
- vkuiClass: classNames(getClassName("PanelHeaderButton", platform), {
83
- "PanelHeaderButton--primary": primary,
84
- "PanelHeaderButton--primitive": isPrimitive,
85
- "PanelHeaderButton--notPrimitive": !isPrimitive && !isPrimitiveLabel
86
- })
80
+ activeMode: activeMode,
81
+ vkuiClass: classNames(getClassName("PanelHeaderButton", platform), primary && "PanelHeaderButton--primary", isPrimitive && "PanelHeaderButton--primitive", !isPrimitive && !isPrimitiveLabel && "PanelHeaderButton--notPrimitive")
87
82
  }), isPrimitive ? createScopedElement(ButtonTypography, {
88
83
  primary: primary
89
84
  }, children) : children, isPrimitiveLabel ? createScopedElement(ButtonTypography, {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/PanelHeaderButton/PanelHeaderButton.tsx"],"names":["Tappable","getClassName","classNames","warnOnce","usePlatform","getTitleFromChildren","isPrimitiveReactNode","IOS","VKCOM","ANDROID","Text","Title","ButtonTypography","primary","children","platform","undefined","warn","PanelHeaderButton","label","restProps","isPrimitive","isPrimitiveLabel","hoverMode","activeMode","process","env","NODE_ENV","hasAccessibleName","Boolean","href"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { TappableProps, Tappable } from \"../Tappable/Tappable\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getTitleFromChildren, isPrimitiveReactNode } from \"../../lib/utils\";\nimport { IOS, VKCOM, ANDROID } from \"../../lib/platform\";\nimport { Text } from \"../Typography/Text/Text\";\nimport { Title } from \"../Typography/Title/Title\";\nimport \"./PanelHeaderButton.css\";\n\nexport interface PanelHeaderButtonProps extends Omit<TappableProps, \"label\"> {\n primary?: boolean;\n label?: React.ReactNode;\n}\n\ninterface ButtonTypographyProps extends React.AllHTMLAttributes<HTMLElement> {\n primary?: PanelHeaderButtonProps[\"primary\"];\n}\n\nconst ButtonTypography = ({ primary, children }: ButtonTypographyProps) => {\n const platform = usePlatform();\n\n if (platform === IOS) {\n return (\n <Title Component=\"span\" level=\"3\" weight={primary ? \"1\" : \"3\"}>\n {children}\n </Title>\n );\n }\n\n return <Text weight={platform === VKCOM ? undefined : \"2\"}>{children}</Text>;\n};\n\nconst warn = warnOnce(\"PanelHeaderButton\");\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderButton\n */\nexport const PanelHeaderButton = ({\n children,\n primary = false,\n label,\n ...restProps\n}: PanelHeaderButtonProps) => {\n const isPrimitive = isPrimitiveReactNode(children);\n const isPrimitiveLabel = isPrimitiveReactNode(label);\n const platform = usePlatform();\n\n let hoverMode;\n let activeMode;\n\n switch (platform) {\n case ANDROID:\n hoverMode = \"background\";\n activeMode = \"background\";\n break;\n case IOS:\n hoverMode = \"background\";\n activeMode = \"opacity\";\n break;\n case VKCOM:\n hoverMode = \"PanelHeaderButton--hover\";\n activeMode = \"PanelHeaderButton--active\";\n }\n\n if (process.env.NODE_ENV === \"development\") {\n const hasAccessibleName = Boolean(\n getTitleFromChildren(children) ||\n getTitleFromChildren(label) ||\n restProps[\"aria-label\"] ||\n restProps[\"aria-labelledby\"]\n );\n\n if (!hasAccessibleName) {\n warn(\n \"a11y: У кнопки нет названия, которое может прочитать скринридер, и она недоступна для части пользователей. Замените содержимое на текст или добавьте описание действия с помощью пропа aria-label.\",\n \"error\"\n );\n }\n }\n\n return (\n <Tappable\n {...restProps}\n hoverMode={hoverMode}\n Component={restProps.href ? \"a\" : \"button\"}\n activeEffectDelay={200}\n activeMode={activeMode}\n // eslint-disable-next-line vkui/no-object-expression-in-arguments\n vkuiClass={classNames(getClassName(\"PanelHeaderButton\", platform), {\n \"PanelHeaderButton--primary\": primary,\n \"PanelHeaderButton--primitive\": isPrimitive,\n \"PanelHeaderButton--notPrimitive\": !isPrimitive && !isPrimitiveLabel,\n })}\n >\n {isPrimitive ? (\n <ButtonTypography primary={primary}>{children}</ButtonTypography>\n ) : (\n children\n )}\n {isPrimitiveLabel ? (\n <ButtonTypography primary={primary}>{label}</ButtonTypography>\n ) : (\n label\n )}\n </Tappable>\n );\n};\n"],"file":"PanelHeaderButton.js"}
1
+ {"version":3,"sources":["../../../../src/components/PanelHeaderButton/PanelHeaderButton.tsx"],"names":["Tappable","getClassName","classNames","warnOnce","usePlatform","getTitleFromChildren","isPrimitiveReactNode","IOS","VKCOM","ANDROID","Text","Title","ButtonTypography","primary","children","platform","undefined","warn","PanelHeaderButton","label","restProps","isPrimitive","isPrimitiveLabel","hoverMode","activeMode","process","env","NODE_ENV","hasAccessibleName","Boolean","href"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { TappableProps, Tappable } from \"../Tappable/Tappable\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getTitleFromChildren, isPrimitiveReactNode } from \"../../lib/utils\";\nimport { IOS, VKCOM, ANDROID } from \"../../lib/platform\";\nimport { Text } from \"../Typography/Text/Text\";\nimport { Title } from \"../Typography/Title/Title\";\nimport \"./PanelHeaderButton.css\";\n\nexport interface PanelHeaderButtonProps extends Omit<TappableProps, \"label\"> {\n primary?: boolean;\n label?: React.ReactNode;\n}\n\ninterface ButtonTypographyProps extends React.AllHTMLAttributes<HTMLElement> {\n primary?: PanelHeaderButtonProps[\"primary\"];\n}\n\nconst ButtonTypography = ({ primary, children }: ButtonTypographyProps) => {\n const platform = usePlatform();\n\n if (platform === IOS) {\n return (\n <Title Component=\"span\" level=\"3\" weight={primary ? \"1\" : \"3\"}>\n {children}\n </Title>\n );\n }\n\n return <Text weight={platform === VKCOM ? undefined : \"2\"}>{children}</Text>;\n};\n\nconst warn = warnOnce(\"PanelHeaderButton\");\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderButton\n */\nexport const PanelHeaderButton = ({\n children,\n primary = false,\n label,\n ...restProps\n}: PanelHeaderButtonProps) => {\n const isPrimitive = isPrimitiveReactNode(children);\n const isPrimitiveLabel = isPrimitiveReactNode(label);\n const platform = usePlatform();\n\n let hoverMode;\n let activeMode;\n\n switch (platform) {\n case ANDROID:\n hoverMode = \"background\";\n activeMode = \"background\";\n break;\n case IOS:\n hoverMode = \"background\";\n activeMode = \"opacity\";\n break;\n case VKCOM:\n hoverMode = \"PanelHeaderButton--hover\";\n activeMode = \"PanelHeaderButton--active\";\n }\n\n if (process.env.NODE_ENV === \"development\") {\n const hasAccessibleName = Boolean(\n getTitleFromChildren(children) ||\n getTitleFromChildren(label) ||\n restProps[\"aria-label\"] ||\n restProps[\"aria-labelledby\"]\n );\n\n if (!hasAccessibleName) {\n warn(\n \"a11y: У кнопки нет названия, которое может прочитать скринридер, и она недоступна для части пользователей. Замените содержимое на текст или добавьте описание действия с помощью пропа aria-label.\",\n \"error\"\n );\n }\n }\n\n return (\n <Tappable\n {...restProps}\n hoverMode={hoverMode}\n Component={restProps.href ? \"a\" : \"button\"}\n activeEffectDelay={200}\n activeMode={activeMode}\n vkuiClass={classNames(\n getClassName(\"PanelHeaderButton\", platform),\n primary && \"PanelHeaderButton--primary\",\n isPrimitive && \"PanelHeaderButton--primitive\",\n !isPrimitive && !isPrimitiveLabel && \"PanelHeaderButton--notPrimitive\"\n )}\n >\n {isPrimitive ? (\n <ButtonTypography primary={primary}>{children}</ButtonTypography>\n ) : (\n children\n )}\n {isPrimitiveLabel ? (\n <ButtonTypography primary={primary}>{label}</ButtonTypography>\n ) : (\n label\n )}\n </Tappable>\n );\n};\n"],"file":"PanelHeaderButton.js"}
@@ -4,7 +4,7 @@ var _excluded = ["children"];
4
4
  import { createScopedElement } from "../../lib/jsxRuntime";
5
5
  import { Icon28CancelOutline } from "@vkontakte/icons";
6
6
  import { PanelHeaderButton } from "../PanelHeaderButton/PanelHeaderButton";
7
- import { ANDROID, VKCOM } from "../../lib/platform";
7
+ import { IOS } from "../../lib/platform";
8
8
  import { getTitleFromChildren } from "../../lib/utils";
9
9
  import { usePlatform } from "../../hooks/usePlatform";
10
10
  /**
@@ -19,6 +19,6 @@ export var PanelHeaderClose = function PanelHeaderClose(_ref) {
19
19
  var platform = usePlatform();
20
20
  return createScopedElement(PanelHeaderButton, _extends({
21
21
  "aria-label": getTitleFromChildren(children)
22
- }, restProps), platform === ANDROID || platform === VKCOM ? createScopedElement(Icon28CancelOutline, null) : children);
22
+ }, restProps), platform === IOS ? children : createScopedElement(Icon28CancelOutline, null));
23
23
  };
24
24
  //# sourceMappingURL=PanelHeaderClose.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/PanelHeaderClose/PanelHeaderClose.tsx"],"names":["Icon28CancelOutline","PanelHeaderButton","ANDROID","VKCOM","getTitleFromChildren","usePlatform","PanelHeaderClose","children","restProps","platform"],"mappings":";;;;AAAA,SAASA,mBAAT,QAAoC,kBAApC;AACA,SACEC,iBADF;AAIA,SAASC,OAAT,EAAkBC,KAAlB;AACA,SAASC,oBAAT;AACA,SAASC,WAAT;AAEA;AACA;AACA;;AACA,OAAO,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB,OAGF;AAAA,2BAF5BC,QAE4B;AAAA,MAF5BA,QAE4B,8BAFjB,QAEiB;AAAA,MADzBC,SACyB;;AAC5B,MAAMC,QAAQ,GAAGJ,WAAW,EAA5B;AACA,SACE,oBAAC,iBAAD;AACE,kBAAYD,oBAAoB,CAACG,QAAD;AADlC,KAEMC,SAFN,GAIGC,QAAQ,KAAKP,OAAb,IAAwBO,QAAQ,KAAKN,KAArC,GACC,oBAAC,mBAAD,OADD,GAGCI,QAPJ,CADF;AAYD,CAjBM","sourcesContent":["import { Icon28CancelOutline } from \"@vkontakte/icons\";\nimport {\n PanelHeaderButton,\n PanelHeaderButtonProps,\n} from \"../PanelHeaderButton/PanelHeaderButton\";\nimport { ANDROID, VKCOM } from \"../../lib/platform\";\nimport { getTitleFromChildren } from \"../../lib/utils\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderClose\n */\nexport const PanelHeaderClose = ({\n children = \"Отмена\",\n ...restProps\n}: PanelHeaderButtonProps) => {\n const platform = usePlatform();\n return (\n <PanelHeaderButton\n aria-label={getTitleFromChildren(children)}\n {...restProps}\n >\n {platform === ANDROID || platform === VKCOM ? (\n <Icon28CancelOutline />\n ) : (\n children\n )}\n </PanelHeaderButton>\n );\n};\n"],"file":"PanelHeaderClose.js"}
1
+ {"version":3,"sources":["../../../../src/components/PanelHeaderClose/PanelHeaderClose.tsx"],"names":["Icon28CancelOutline","PanelHeaderButton","IOS","getTitleFromChildren","usePlatform","PanelHeaderClose","children","restProps","platform"],"mappings":";;;;AAAA,SAASA,mBAAT,QAAoC,kBAApC;AACA,SACEC,iBADF;AAIA,SAASC,GAAT;AACA,SAASC,oBAAT;AACA,SAASC,WAAT;AAEA;AACA;AACA;;AACA,OAAO,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB,OAGF;AAAA,2BAF5BC,QAE4B;AAAA,MAF5BA,QAE4B,8BAFjB,QAEiB;AAAA,MADzBC,SACyB;;AAC5B,MAAMC,QAAQ,GAAGJ,WAAW,EAA5B;AACA,SACE,oBAAC,iBAAD;AACE,kBAAYD,oBAAoB,CAACG,QAAD;AADlC,KAEMC,SAFN,GAIGC,QAAQ,KAAKN,GAAb,GAAmBI,QAAnB,GAA8B,oBAAC,mBAAD,OAJjC,CADF;AAQD,CAbM","sourcesContent":["import { Icon28CancelOutline } from \"@vkontakte/icons\";\nimport {\n PanelHeaderButton,\n PanelHeaderButtonProps,\n} from \"../PanelHeaderButton/PanelHeaderButton\";\nimport { IOS } from \"../../lib/platform\";\nimport { getTitleFromChildren } from \"../../lib/utils\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderClose\n */\nexport const PanelHeaderClose = ({\n children = \"Отмена\",\n ...restProps\n}: PanelHeaderButtonProps) => {\n const platform = usePlatform();\n return (\n <PanelHeaderButton\n aria-label={getTitleFromChildren(children)}\n {...restProps}\n >\n {platform === IOS ? children : <Icon28CancelOutline />}\n </PanelHeaderButton>\n );\n};\n"],"file":"PanelHeaderClose.js"}
@@ -1 +1,5 @@
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
+ .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-in,.vkuiPanelHeaderContent__status{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vkuiPanelHeaderContent__status{color:#818c99;color:var(--header_text_secondary,var(--vkui--color_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,var(--vkui--color_icon_accent));display:flex;justify-content:flex-start;margin-left:2px}.vkuiPanelHeaderContent__width{width:1000px}.vkuiPanelHeaderContent__in--centered{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(
2
+ --panelheader_height_ios,var(--vkui--size_panel_header_height--regular)
3
+ )}.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(
4
+ --panelheader_height,var(--vkui--size_panel_header_height--regular)
5
+ )}.vkuiPanelHeader--no-before .vkuiPanelHeaderContent--vkcom{padding-left:16px}
@@ -3,13 +3,14 @@ import _objectSpread from "@babel/runtime/helpers/objectSpread2";
3
3
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
4
4
  var _excluded = ["className", "style", "aside", "status", "before", "children", "onClick"];
5
5
  import { createScopedElement } from "../../lib/jsxRuntime";
6
- import { getClassName } from "../../helpers/getClassName";
6
+ import { classNames } from "../../lib/classNames";
7
7
  import { Tappable } from "../Tappable/Tappable";
8
8
  import { usePlatform } from "../../hooks/usePlatform";
9
9
  import { hasReactNode } from "../../lib/utils";
10
+ import { getClassName } from "../../helpers/getClassName";
10
11
  import { Caption } from "../Typography/Caption/Caption";
11
12
  import { Headline } from "../Typography/Headline/Headline";
12
- import { IOS, Platform } from "../../lib/platform";
13
+ import { IOS, ANDROID, Platform } from "../../lib/platform";
13
14
  import { Text } from "../Typography/Text/Text";
14
15
  import "./PanelHeaderContent.css";
15
16
 
@@ -57,15 +58,14 @@ export var PanelHeaderContent = function PanelHeaderContent(_ref2) {
57
58
  hasActive: platform === IOS,
58
59
  activeMode: "opacity"
59
60
  }) : {};
60
- var baseClassNames = getClassName("PanelHeaderContent", platform);
61
61
  return createScopedElement("div", _extends({}, rootProps, {
62
- vkuiClass: baseClassNames,
62
+ vkuiClass: getClassName("PanelHeaderContent", platform),
63
63
  style: style,
64
64
  className: className
65
65
  }), hasReactNode(before) && createScopedElement("div", {
66
66
  vkuiClass: "PanelHeaderContent__before"
67
67
  }, before), createScopedElement(InComponent, _extends({}, inProps, {
68
- vkuiClass: "PanelHeaderContent__in"
68
+ vkuiClass: classNames("PanelHeaderContent__in", !before && platform !== ANDROID && "PanelHeaderContent__in--centered")
69
69
  }), hasReactNode(status) && createScopedElement(Caption, {
70
70
  vkuiClass: "PanelHeaderContent__status"
71
71
  }, status), createScopedElement("div", {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/PanelHeaderContent/PanelHeaderContent.tsx"],"names":["getClassName","Tappable","usePlatform","hasReactNode","Caption","Headline","IOS","Platform","Text","PanelHeaderChildren","platform","hasStatus","hasBefore","children","VKCOM","PanelHeaderContent","className","style","aside","status","before","onClick","restProps","InComponent","rootProps","inProps","activeEffectDelay","hasActive","activeMode","baseClassNames"],"mappings":";;;;;AACA,SAASA,YAAT;AACA,SAASC,QAAT;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,SAASC,OAAT;AACA,SAASC,QAAT;AACA,SAASC,GAAT,EAAcC,QAAd;AACA,SAASC,IAAT;AAEA;;AAeA,IAAMC,mBAAmB,GAAG,SAAtBA,mBAAsB,OAKI;AAAA,MAJ9BC,QAI8B,QAJ9BA,QAI8B;AAAA,MAH9BC,SAG8B,QAH9BA,SAG8B;AAAA,MAF9BC,SAE8B,QAF9BA,SAE8B;AAAA,MAD9BC,QAC8B,QAD9BA,QAC8B;;AAC9B,MAAIH,QAAQ,KAAKH,QAAQ,CAACO,KAA1B,EAAiC;AAC/B,WACE,oBAAC,IAAD;AAAM,MAAA,SAAS,EAAC,KAAhB;AAAsB,MAAA,MAAM,EAAC;AAA7B,OACGD,QADH,CADF;AAKD;;AAED,SAAOF,SAAS,IAAIC,SAAb,GACL,oBAAC,QAAD;AAAU,IAAA,SAAS,EAAC,KAApB;AAA0B,IAAA,MAAM,EAAC;AAAjC,KACGC,QADH,CADK,GAKL;AAAK,IAAA,SAAS,EAAC;AAAf,KAAkDA,QAAlD,CALF;AAOD,CArBD;AAuBA;AACA;AACA;;;AACA,OAAO,IAAME,kBAAkB,GAAG,SAArBA,kBAAqB,QASH;AAAA,MAR7BC,SAQ6B,SAR7BA,SAQ6B;AAAA,MAP7BC,KAO6B,SAP7BA,KAO6B;AAAA,MAN7BC,KAM6B,SAN7BA,KAM6B;AAAA,MAL7BC,MAK6B,SAL7BA,MAK6B;AAAA,MAJ7BC,MAI6B,SAJ7BA,MAI6B;AAAA,MAH7BP,QAG6B,SAH7BA,QAG6B;AAAA,MAF7BQ,OAE6B,SAF7BA,OAE6B;AAAA,MAD1BC,SAC0B;;AAC7B,MAAMC,WAAW,GAAGF,OAAO,GAAGpB,QAAH,GAAc,KAAzC;AACA,MAAMuB,SAAS,GAAGH,OAAO,GAAG,EAAH,GAAQC,SAAjC;AACA,MAAMZ,QAAQ,GAAGR,WAAW,EAA5B;AACA,MAAMuB,OAAO,GAAGJ,OAAO,mCAEdC,SAFc;AAGjBD,IAAAA,OAAO,EAAPA,OAHiB;AAIjBK,IAAAA,iBAAiB,EAAE,GAJF;AAKjBC,IAAAA,SAAS,EAAEjB,QAAQ,KAAKJ,GALP;AAMjBsB,IAAAA,UAAU,EAAE;AANK,OAQnB,EARJ;AASA,MAAMC,cAAc,GAAG7B,YAAY,CAAC,oBAAD,EAAuBU,QAAvB,CAAnC;AAEA,SACE,wCACMc,SADN;AAEE,IAAA,SAAS,EAAEK,cAFb;AAGE,IAAA,KAAK,EAAEZ,KAHT;AAIE,IAAA,SAAS,EAAED;AAJb,MAMGb,YAAY,CAACiB,MAAD,CAAZ,IACC;AAAK,IAAA,SAAS,EAAC;AAAf,KAA6CA,MAA7C,CAPJ,EASE,oBAAC,WAAD,eAAiBK,OAAjB;AAA0B,IAAA,SAAS,EAAC;AAApC,MACGtB,YAAY,CAACgB,MAAD,CAAZ,IACC,oBAAC,OAAD;AAAS,IAAA,SAAS,EAAC;AAAnB,KAAiDA,MAAjD,CAFJ,EAIE;AAAK,IAAA,SAAS,EAAC;AAAf,KACE,oBAAC,mBAAD;AACE,IAAA,QAAQ,EAAET,QADZ;AAEE,IAAA,SAAS,EAAEP,YAAY,CAACgB,MAAD,CAFzB;AAGE,IAAA,SAAS,EAAEhB,YAAY,CAACiB,MAAD;AAHzB,KAKGP,QALH,CADF,EAQGV,YAAY,CAACe,KAAD,CAAZ,IACC;AAAK,IAAA,SAAS,EAAC;AAAf,KAA4CA,KAA5C,CATJ,CAJF,EAgBGf,YAAY,CAACiB,MAAD,CAAZ,IAAwB;AAAK,IAAA,SAAS,EAAC;AAAf,IAhB3B,CATF,CADF;AA8BD,CAtDM","sourcesContent":["import * as React from \"react\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { Tappable } from \"../Tappable/Tappable\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport { Caption } from \"../Typography/Caption/Caption\";\nimport { Headline } from \"../Typography/Headline/Headline\";\nimport { IOS, Platform } from \"../../lib/platform\";\nimport { Text } from \"../Typography/Text/Text\";\nimport { HasPlatform } from \"../../types\";\nimport \"./PanelHeaderContent.css\";\n\nexport interface PanelHeaderContentProps\n extends React.HTMLAttributes<HTMLDivElement> {\n aside?: React.ReactNode;\n before?: React.ReactNode;\n status?: React.ReactNode;\n}\n\ninterface PanelHeaderChildrenProps extends HasPlatform {\n hasStatus: boolean;\n hasBefore: boolean;\n children?: React.ReactNode;\n}\n\nconst PanelHeaderChildren = ({\n platform,\n hasStatus,\n hasBefore,\n children,\n}: PanelHeaderChildrenProps) => {\n if (platform === Platform.VKCOM) {\n return (\n <Text Component=\"div\" weight=\"2\">\n {children}\n </Text>\n );\n }\n\n return hasStatus || hasBefore ? (\n <Headline Component=\"div\" weight=\"2\">\n {children}\n </Headline>\n ) : (\n <div vkuiClass=\"PanelHeaderContent__children-in\">{children}</div>\n );\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderContent\n */\nexport const PanelHeaderContent = ({\n className,\n style,\n aside,\n status,\n before,\n children,\n onClick,\n ...restProps\n}: PanelHeaderContentProps) => {\n const InComponent = onClick ? Tappable : \"div\";\n const rootProps = onClick ? {} : restProps;\n const platform = usePlatform();\n const inProps = onClick\n ? {\n ...restProps,\n onClick,\n activeEffectDelay: 200,\n hasActive: platform === IOS,\n activeMode: \"opacity\",\n }\n : {};\n const baseClassNames = getClassName(\"PanelHeaderContent\", platform);\n\n return (\n <div\n {...rootProps}\n vkuiClass={baseClassNames}\n style={style}\n className={className}\n >\n {hasReactNode(before) && (\n <div vkuiClass=\"PanelHeaderContent__before\">{before}</div>\n )}\n <InComponent {...inProps} vkuiClass=\"PanelHeaderContent__in\">\n {hasReactNode(status) && (\n <Caption vkuiClass=\"PanelHeaderContent__status\">{status}</Caption>\n )}\n <div vkuiClass=\"PanelHeaderContent__children\">\n <PanelHeaderChildren\n platform={platform}\n hasStatus={hasReactNode(status)}\n hasBefore={hasReactNode(before)}\n >\n {children}\n </PanelHeaderChildren>\n {hasReactNode(aside) && (\n <div vkuiClass=\"PanelHeaderContent__aside\">{aside}</div>\n )}\n </div>\n {hasReactNode(before) && <div vkuiClass=\"PanelHeaderContent__width\" />}\n </InComponent>\n </div>\n );\n};\n"],"file":"PanelHeaderContent.js"}
1
+ {"version":3,"sources":["../../../../src/components/PanelHeaderContent/PanelHeaderContent.tsx"],"names":["classNames","Tappable","usePlatform","hasReactNode","getClassName","Caption","Headline","IOS","ANDROID","Platform","Text","PanelHeaderChildren","platform","hasStatus","hasBefore","children","VKCOM","PanelHeaderContent","className","style","aside","status","before","onClick","restProps","InComponent","rootProps","inProps","activeEffectDelay","hasActive","activeMode"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { Tappable } from \"../Tappable/Tappable\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { Caption } from \"../Typography/Caption/Caption\";\nimport { Headline } from \"../Typography/Headline/Headline\";\nimport { IOS, ANDROID, Platform } from \"../../lib/platform\";\nimport { Text } from \"../Typography/Text/Text\";\nimport { HasPlatform } from \"../../types\";\nimport \"./PanelHeaderContent.css\";\n\nexport interface PanelHeaderContentProps\n extends React.HTMLAttributes<HTMLDivElement> {\n aside?: React.ReactNode;\n before?: React.ReactNode;\n status?: React.ReactNode;\n}\n\ninterface PanelHeaderChildrenProps extends HasPlatform {\n hasStatus: boolean;\n hasBefore: boolean;\n children?: React.ReactNode;\n}\n\nconst PanelHeaderChildren = ({\n platform,\n hasStatus,\n hasBefore,\n children,\n}: PanelHeaderChildrenProps) => {\n if (platform === Platform.VKCOM) {\n return (\n <Text Component=\"div\" weight=\"2\">\n {children}\n </Text>\n );\n }\n\n return hasStatus || hasBefore ? (\n <Headline Component=\"div\" weight=\"2\">\n {children}\n </Headline>\n ) : (\n <div vkuiClass=\"PanelHeaderContent__children-in\">{children}</div>\n );\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderContent\n */\nexport const PanelHeaderContent = ({\n className,\n style,\n aside,\n status,\n before,\n children,\n onClick,\n ...restProps\n}: PanelHeaderContentProps) => {\n const InComponent = onClick ? Tappable : \"div\";\n const rootProps = onClick ? {} : restProps;\n const platform = usePlatform();\n const inProps = onClick\n ? {\n ...restProps,\n onClick,\n activeEffectDelay: 200,\n hasActive: platform === IOS,\n activeMode: \"opacity\",\n }\n : {};\n\n return (\n <div\n {...rootProps}\n vkuiClass={getClassName(\"PanelHeaderContent\", platform)}\n style={style}\n className={className}\n >\n {hasReactNode(before) && (\n <div vkuiClass=\"PanelHeaderContent__before\">{before}</div>\n )}\n <InComponent\n {...inProps}\n vkuiClass={classNames(\n \"PanelHeaderContent__in\",\n !before && platform !== ANDROID && \"PanelHeaderContent__in--centered\"\n )}\n >\n {hasReactNode(status) && (\n <Caption vkuiClass=\"PanelHeaderContent__status\">{status}</Caption>\n )}\n <div vkuiClass=\"PanelHeaderContent__children\">\n <PanelHeaderChildren\n platform={platform}\n hasStatus={hasReactNode(status)}\n hasBefore={hasReactNode(before)}\n >\n {children}\n </PanelHeaderChildren>\n {hasReactNode(aside) && (\n <div vkuiClass=\"PanelHeaderContent__aside\">{aside}</div>\n )}\n </div>\n {hasReactNode(before) && <div vkuiClass=\"PanelHeaderContent__width\" />}\n </InComponent>\n </div>\n );\n};\n"],"file":"PanelHeaderContent.js"}
@@ -1 +1 @@
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
+ .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--opened .vkuiPanelHeaderContext__in{-webkit-animation:vkui-animation-panelheadercontext-translate-in .2s ease;animation:vkui-animation-panelheadercontext-translate-in .2s ease}.vkuiPanelHeaderContext--closing .vkuiPanelHeaderContext__in{-webkit-animation:vkui-animation-panelheadercontext-translate-out .2s ease;animation:vkui-animation-panelheadercontext-translate-out .2s ease}.vkuiPanelHeaderContext .vkuiList{background:#fff;background:var(--header_background,var(--vkui--color_background_content))}.vkuiPanelHeaderContext__in{box-sizing:border-box;padding:8px}.vkuiPanelHeaderContext--ios .vkuiPanelHeaderContext__in{padding:0}.vkuiPanelHeaderContext--rounded .vkuiList{border-radius:12px;overflow:hidden;padding:8px 0}.vkuiPanelHeaderContext--desktop .vkuiPanelHeaderContext__in{padding:12px 8px}.vkuiPanelHeaderContext--desktop .vkuiPanelHeaderContext__content{background:#fff;background:var(--header_background,var(--vkui--color_background_content));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}}
@@ -6,10 +6,10 @@ import { createScopedElement } from "../../lib/jsxRuntime";
6
6
  import * as React from "react";
7
7
  import { FixedLayout } from "../FixedLayout/FixedLayout";
8
8
  import { classNames } from "../../lib/classNames";
9
- import { getClassName } from "../../helpers/getClassName";
10
9
  import { ViewWidth } from "../AdaptivityProvider/AdaptivityContext";
11
10
  import { useAdaptivity } from "../../hooks/useAdaptivity";
12
11
  import { useDOM } from "../../lib/dom";
12
+ import { IOS } from "../../lib/platform";
13
13
  import { useIsomorphicLayoutEffect } from "../../lib/useIsomorphicLayoutEffect";
14
14
  import { useGlobalEventListener } from "../../hooks/useGlobalEventListener";
15
15
  import { useTimeout } from "../../hooks/useTimeout";
@@ -64,12 +64,8 @@ export var PanelHeaderContext = function PanelHeaderContext(_ref) {
64
64
  return closing ? animationFallback.set() : animationFallback.clear();
65
65
  }, [animationFallback, closing]);
66
66
  return createScopedElement(FixedLayout, _extends({}, restProps, {
67
- // eslint-disable-next-line vkui/no-object-expression-in-arguments
68
- vkuiClass: classNames(getClassName("PanelHeaderContext", platform), {
69
- "PanelHeaderContext--opened": opened,
70
- "PanelHeaderContext--closing": closing,
71
- "PanelHeaderContext--desktop": isDesktop
72
- }),
67
+ vkuiClass: classNames("PanelHeaderContext", platform === IOS && "PanelHeaderContext--ios", opened && "PanelHeaderContext--opened", closing && "PanelHeaderContext--closing", isDesktop && "PanelHeaderContext--desktop", // TODO v5.0.0 поправить под новую адаптивность
68
+ (platform !== IOS || platform === IOS && isDesktop) && "PanelHeaderContext--rounded"),
73
69
  vertical: "top"
74
70
  }), createScopedElement("div", {
75
71
  vkuiClass: "PanelHeaderContext__in",
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/PanelHeaderContext/PanelHeaderContext.tsx"],"names":["React","FixedLayout","classNames","getClassName","ViewWidth","useAdaptivity","useDOM","useIsomorphicLayoutEffect","useGlobalEventListener","useTimeout","usePlatform","useScrollLock","PanelHeaderContext","children","onClose","opened","restProps","document","platform","useState","visible","setVisible","closing","viewWidth","isDesktop","SMALL_TABLET","elementRef","useRef","event","current","contains","target","onAnimationEnd","animationFallback","useEffect","set","clear","undefined"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { FixedLayout } from \"../FixedLayout/FixedLayout\";\nimport { classNames } from \"../../lib/classNames\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { ViewWidth } from \"../AdaptivityProvider/AdaptivityContext\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { useDOM } from \"../../lib/dom\";\nimport { useIsomorphicLayoutEffect } from \"../../lib/useIsomorphicLayoutEffect\";\nimport { useGlobalEventListener } from \"../../hooks/useGlobalEventListener\";\nimport { useTimeout } from \"../../hooks/useTimeout\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { useScrollLock } from \"../AppRoot/ScrollContext\";\nimport \"./PanelHeaderContext.css\";\n\nexport interface PanelHeaderContextProps\n extends React.HTMLAttributes<HTMLDivElement> {\n opened: boolean;\n onClose: VoidFunction;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderContext\n */\nexport const PanelHeaderContext = ({\n children,\n onClose,\n opened = false,\n ...restProps\n}: PanelHeaderContextProps) => {\n const { document } = useDOM();\n const platform = usePlatform();\n const [visible, setVisible] = React.useState(opened);\n const closing = visible && !opened;\n const { viewWidth } = useAdaptivity();\n const isDesktop = viewWidth >= ViewWidth.SMALL_TABLET;\n const elementRef = React.useRef<HTMLDivElement>(null);\n\n useIsomorphicLayoutEffect(() => {\n opened && setVisible(true);\n }, [opened]);\n\n useScrollLock(!isDesktop && opened);\n\n // start closing on outer click\n useGlobalEventListener(\n document,\n \"click\",\n isDesktop &&\n opened &&\n !closing &&\n ((event) => {\n if (\n elementRef.current &&\n !elementRef.current.contains(event.target as Node)\n ) {\n onClose();\n }\n })\n );\n\n // fallback onAnimationEnd when animationend not supported\n const onAnimationEnd = () => setVisible(false);\n const animationFallback = useTimeout(onAnimationEnd, 200);\n React.useEffect(\n () => (closing ? animationFallback.set() : animationFallback.clear()),\n [animationFallback, closing]\n );\n\n return (\n <FixedLayout\n {...restProps}\n // eslint-disable-next-line vkui/no-object-expression-in-arguments\n vkuiClass={classNames(getClassName(\"PanelHeaderContext\", platform), {\n \"PanelHeaderContext--opened\": opened,\n \"PanelHeaderContext--closing\": closing,\n \"PanelHeaderContext--desktop\": isDesktop,\n })}\n vertical=\"top\"\n >\n <div\n vkuiClass=\"PanelHeaderContext__in\"\n ref={elementRef}\n onAnimationEnd={closing ? onAnimationEnd : undefined}\n >\n <div vkuiClass=\"PanelHeaderContext__content\">{visible && children}</div>\n </div>\n {!isDesktop && visible && (\n <div onClick={onClose} vkuiClass=\"PanelHeaderContext__fade\" />\n )}\n </FixedLayout>\n );\n};\n"],"file":"PanelHeaderContext.js"}
1
+ {"version":3,"sources":["../../../../src/components/PanelHeaderContext/PanelHeaderContext.tsx"],"names":["React","FixedLayout","classNames","ViewWidth","useAdaptivity","useDOM","IOS","useIsomorphicLayoutEffect","useGlobalEventListener","useTimeout","usePlatform","useScrollLock","PanelHeaderContext","children","onClose","opened","restProps","document","platform","useState","visible","setVisible","closing","viewWidth","isDesktop","SMALL_TABLET","elementRef","useRef","event","current","contains","target","onAnimationEnd","animationFallback","useEffect","set","clear","undefined"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { FixedLayout } from \"../FixedLayout/FixedLayout\";\nimport { classNames } from \"../../lib/classNames\";\nimport { ViewWidth } from \"../AdaptivityProvider/AdaptivityContext\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { useDOM } from \"../../lib/dom\";\nimport { IOS } from \"../../lib/platform\";\nimport { useIsomorphicLayoutEffect } from \"../../lib/useIsomorphicLayoutEffect\";\nimport { useGlobalEventListener } from \"../../hooks/useGlobalEventListener\";\nimport { useTimeout } from \"../../hooks/useTimeout\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { useScrollLock } from \"../AppRoot/ScrollContext\";\nimport \"./PanelHeaderContext.css\";\n\nexport interface PanelHeaderContextProps\n extends React.HTMLAttributes<HTMLDivElement> {\n opened: boolean;\n onClose: VoidFunction;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderContext\n */\nexport const PanelHeaderContext = ({\n children,\n onClose,\n opened = false,\n ...restProps\n}: PanelHeaderContextProps) => {\n const { document } = useDOM();\n const platform = usePlatform();\n const [visible, setVisible] = React.useState(opened);\n const closing = visible && !opened;\n const { viewWidth } = useAdaptivity();\n const isDesktop = viewWidth >= ViewWidth.SMALL_TABLET;\n const elementRef = React.useRef<HTMLDivElement>(null);\n\n useIsomorphicLayoutEffect(() => {\n opened && setVisible(true);\n }, [opened]);\n\n useScrollLock(!isDesktop && opened);\n\n // start closing on outer click\n useGlobalEventListener(\n document,\n \"click\",\n isDesktop &&\n opened &&\n !closing &&\n ((event) => {\n if (\n elementRef.current &&\n !elementRef.current.contains(event.target as Node)\n ) {\n onClose();\n }\n })\n );\n\n // fallback onAnimationEnd when animationend not supported\n const onAnimationEnd = () => setVisible(false);\n const animationFallback = useTimeout(onAnimationEnd, 200);\n React.useEffect(\n () => (closing ? animationFallback.set() : animationFallback.clear()),\n [animationFallback, closing]\n );\n\n return (\n <FixedLayout\n {...restProps}\n vkuiClass={classNames(\n \"PanelHeaderContext\",\n platform === IOS && \"PanelHeaderContext--ios\",\n opened && \"PanelHeaderContext--opened\",\n closing && \"PanelHeaderContext--closing\",\n isDesktop && \"PanelHeaderContext--desktop\",\n // TODO v5.0.0 поправить под новую адаптивность\n (platform !== IOS || (platform === IOS && isDesktop)) &&\n \"PanelHeaderContext--rounded\"\n )}\n vertical=\"top\"\n >\n <div\n vkuiClass=\"PanelHeaderContext__in\"\n ref={elementRef}\n onAnimationEnd={closing ? onAnimationEnd : undefined}\n >\n <div vkuiClass=\"PanelHeaderContext__content\">{visible && children}</div>\n </div>\n {!isDesktop && visible && (\n <div onClick={onClose} vkuiClass=\"PanelHeaderContext__fade\" />\n )}\n </FixedLayout>\n );\n};\n"],"file":"PanelHeaderContext.js"}
@@ -3,7 +3,7 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
3
3
  var _excluded = ["isActive", "editLabel", "doneLabel"];
4
4
  import { createScopedElement } from "../../lib/jsxRuntime";
5
5
  import { PanelHeaderButton } from "../PanelHeaderButton/PanelHeaderButton";
6
- import { ANDROID, VKCOM } from "../../lib/platform";
6
+ import { IOS } from "../../lib/platform";
7
7
  import { Icon28EditOutline, Icon28DoneOutline } from "@vkontakte/icons";
8
8
  import { usePlatform } from "../../hooks/usePlatform";
9
9
 
@@ -24,6 +24,6 @@ export var PanelHeaderEdit = function PanelHeaderEdit(_ref) {
24
24
  var platform = usePlatform();
25
25
  return createScopedElement(PanelHeaderButton, _extends({
26
26
  "aria-label": iOSText
27
- }, restProps), platform === ANDROID || platform === VKCOM ? createScopedElement(AndroidIcon, null) : iOSText);
27
+ }, restProps), platform === IOS ? iOSText : createScopedElement(AndroidIcon, null));
28
28
  };
29
29
  //# sourceMappingURL=PanelHeaderEdit.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/PanelHeaderEdit/PanelHeaderEdit.tsx"],"names":["PanelHeaderButton","ANDROID","VKCOM","Icon28EditOutline","Icon28DoneOutline","usePlatform","PanelHeaderEdit","isActive","editLabel","doneLabel","restProps","iOSText","AndroidIcon","platform"],"mappings":";;;;AAAA,SACEA,iBADF;AAIA,SAASC,OAAT,EAAkBC,KAAlB;AACA,SAASC,iBAAT,EAA4BC,iBAA5B,QAAqD,kBAArD;AACA,SAASC,WAAT;;AAiBA;AACA;AACA;AACA,OAAO,IAAMC,eAAe,GAAG,SAAlBA,eAAkB,OAKH;AAAA,2BAJ1BC,QAI0B;AAAA,MAJ1BA,QAI0B,8BAJf,KAIe;AAAA,4BAH1BC,SAG0B;AAAA,MAH1BA,SAG0B,+BAHd,eAGc;AAAA,4BAF1BC,SAE0B;AAAA,MAF1BA,SAE0B,+BAFd,QAEc;AAAA,MADvBC,SACuB;;AAC1B,MAAMC,OAAO,GAAGJ,QAAQ,GAAGE,SAAH,GAAeD,SAAvC;AACA,MAAMI,WAAW,GAAGL,QAAQ,GAAGH,iBAAH,GAAuBD,iBAAnD;AACA,MAAMU,QAAQ,GAAGR,WAAW,EAA5B;AAEA,SACE,oBAAC,iBAAD;AAAmB,kBAAYM;AAA/B,KAA4CD,SAA5C,GACGG,QAAQ,KAAKZ,OAAb,IAAwBY,QAAQ,KAAKX,KAArC,GAA6C,oBAAC,WAAD,OAA7C,GAA+DS,OADlE,CADF;AAKD,CAfM","sourcesContent":["import {\n PanelHeaderButton,\n PanelHeaderButtonProps,\n} from \"../PanelHeaderButton/PanelHeaderButton\";\nimport { ANDROID, VKCOM } from \"../../lib/platform\";\nimport { Icon28EditOutline, Icon28DoneOutline } from \"@vkontakte/icons\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\n\nexport interface PanelHeaderEditProps extends PanelHeaderButtonProps {\n /**\n * Включен ли режим редактирования\n */\n isActive?: boolean;\n /**\n * iOS only. Текст кнопки, когда режим редактирования не активен\n */\n editLabel?: string;\n /**\n * iOS only. Текст кнопки при активном режиме редактирования для выхода из него\n */\n doneLabel?: string;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderEdit\n */\nexport const PanelHeaderEdit = ({\n isActive = false,\n editLabel = \"Редактировать\",\n doneLabel = \"Готово\",\n ...restProps\n}: PanelHeaderEditProps) => {\n const iOSText = isActive ? doneLabel : editLabel;\n const AndroidIcon = isActive ? Icon28DoneOutline : Icon28EditOutline;\n const platform = usePlatform();\n\n return (\n <PanelHeaderButton aria-label={iOSText} {...restProps}>\n {platform === ANDROID || platform === VKCOM ? <AndroidIcon /> : iOSText}\n </PanelHeaderButton>\n );\n};\n"],"file":"PanelHeaderEdit.js"}
1
+ {"version":3,"sources":["../../../../src/components/PanelHeaderEdit/PanelHeaderEdit.tsx"],"names":["PanelHeaderButton","IOS","Icon28EditOutline","Icon28DoneOutline","usePlatform","PanelHeaderEdit","isActive","editLabel","doneLabel","restProps","iOSText","AndroidIcon","platform"],"mappings":";;;;AAAA,SACEA,iBADF;AAIA,SAASC,GAAT;AACA,SAASC,iBAAT,EAA4BC,iBAA5B,QAAqD,kBAArD;AACA,SAASC,WAAT;;AAiBA;AACA;AACA;AACA,OAAO,IAAMC,eAAe,GAAG,SAAlBA,eAAkB,OAKH;AAAA,2BAJ1BC,QAI0B;AAAA,MAJ1BA,QAI0B,8BAJf,KAIe;AAAA,4BAH1BC,SAG0B;AAAA,MAH1BA,SAG0B,+BAHd,eAGc;AAAA,4BAF1BC,SAE0B;AAAA,MAF1BA,SAE0B,+BAFd,QAEc;AAAA,MADvBC,SACuB;;AAC1B,MAAMC,OAAO,GAAGJ,QAAQ,GAAGE,SAAH,GAAeD,SAAvC;AACA,MAAMI,WAAW,GAAGL,QAAQ,GAAGH,iBAAH,GAAuBD,iBAAnD;AACA,MAAMU,QAAQ,GAAGR,WAAW,EAA5B;AAEA,SACE,oBAAC,iBAAD;AAAmB,kBAAYM;AAA/B,KAA4CD,SAA5C,GACGG,QAAQ,KAAKX,GAAb,GAAmBS,OAAnB,GAA6B,oBAAC,WAAD,OADhC,CADF;AAKD,CAfM","sourcesContent":["import {\n PanelHeaderButton,\n PanelHeaderButtonProps,\n} from \"../PanelHeaderButton/PanelHeaderButton\";\nimport { IOS } from \"../../lib/platform\";\nimport { Icon28EditOutline, Icon28DoneOutline } from \"@vkontakte/icons\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\n\nexport interface PanelHeaderEditProps extends PanelHeaderButtonProps {\n /**\n * Включен ли режим редактирования\n */\n isActive?: boolean;\n /**\n * iOS only. Текст кнопки, когда режим редактирования не активен\n */\n editLabel?: string;\n /**\n * iOS only. Текст кнопки при активном режиме редактирования для выхода из него\n */\n doneLabel?: string;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderEdit\n */\nexport const PanelHeaderEdit = ({\n isActive = false,\n editLabel = \"Редактировать\",\n doneLabel = \"Готово\",\n ...restProps\n}: PanelHeaderEditProps) => {\n const iOSText = isActive ? doneLabel : editLabel;\n const AndroidIcon = isActive ? Icon28DoneOutline : Icon28EditOutline;\n const platform = usePlatform();\n\n return (\n <PanelHeaderButton aria-label={iOSText} {...restProps}>\n {platform === IOS ? iOSText : <AndroidIcon />}\n </PanelHeaderButton>\n );\n};\n"],"file":"PanelHeaderEdit.js"}
@@ -4,7 +4,7 @@ var _excluded = ["children"];
4
4
  import { createScopedElement } from "../../lib/jsxRuntime";
5
5
  import { PanelHeaderButton } from "../PanelHeaderButton/PanelHeaderButton";
6
6
  import { Icon28DoneOutline } from "@vkontakte/icons";
7
- import { ANDROID, VKCOM } from "../../lib/platform";
7
+ import { IOS } from "../../lib/platform";
8
8
  import { usePlatform } from "../../hooks/usePlatform";
9
9
  import { getTitleFromChildren } from "../../lib/utils";
10
10
  /**
@@ -20,6 +20,6 @@ export var PanelHeaderSubmit = function PanelHeaderSubmit(_ref) {
20
20
  return createScopedElement(PanelHeaderButton, _extends({
21
21
  "aria-label": getTitleFromChildren(children),
22
22
  primary: true
23
- }, restProps), platform === ANDROID || platform === VKCOM ? createScopedElement(Icon28DoneOutline, null) : children);
23
+ }, restProps), platform === IOS ? children : createScopedElement(Icon28DoneOutline, null));
24
24
  };
25
25
  //# sourceMappingURL=PanelHeaderSubmit.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/PanelHeaderSubmit/PanelHeaderSubmit.tsx"],"names":["PanelHeaderButton","Icon28DoneOutline","ANDROID","VKCOM","usePlatform","getTitleFromChildren","PanelHeaderSubmit","children","restProps","platform"],"mappings":";;;;AAAA,SACEA,iBADF;AAIA,SAASC,iBAAT,QAAkC,kBAAlC;AACA,SAASC,OAAT,EAAkBC,KAAlB;AACA,SAASC,WAAT;AACA,SAASC,oBAAT;AAEA;AACA;AACA;;AACA,OAAO,IAAMC,iBAAiB,GAAG,SAApBA,iBAAoB,OAGH;AAAA,2BAF5BC,QAE4B;AAAA,MAF5BA,QAE4B,8BAFjB,QAEiB;AAAA,MADzBC,SACyB;;AAC5B,MAAMC,QAAQ,GAAGL,WAAW,EAA5B;AAEA,SACE,oBAAC,iBAAD;AACE,kBAAYC,oBAAoB,CAACE,QAAD,CADlC;AAEE,IAAA,OAAO;AAFT,KAGMC,SAHN,GAKGC,QAAQ,KAAKP,OAAb,IAAwBO,QAAQ,KAAKN,KAArC,GACC,oBAAC,iBAAD,OADD,GAGCI,QARJ,CADF;AAaD,CAnBM","sourcesContent":["import {\n PanelHeaderButton,\n PanelHeaderButtonProps,\n} from \"../PanelHeaderButton/PanelHeaderButton\";\nimport { Icon28DoneOutline } from \"@vkontakte/icons\";\nimport { ANDROID, VKCOM } from \"../../lib/platform\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getTitleFromChildren } from \"../../lib/utils\";\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderSubmit\n */\nexport const PanelHeaderSubmit = ({\n children = \"Готово\",\n ...restProps\n}: PanelHeaderButtonProps) => {\n const platform = usePlatform();\n\n return (\n <PanelHeaderButton\n aria-label={getTitleFromChildren(children)}\n primary\n {...restProps}\n >\n {platform === ANDROID || platform === VKCOM ? (\n <Icon28DoneOutline />\n ) : (\n children\n )}\n </PanelHeaderButton>\n );\n};\n"],"file":"PanelHeaderSubmit.js"}
1
+ {"version":3,"sources":["../../../../src/components/PanelHeaderSubmit/PanelHeaderSubmit.tsx"],"names":["PanelHeaderButton","Icon28DoneOutline","IOS","usePlatform","getTitleFromChildren","PanelHeaderSubmit","children","restProps","platform"],"mappings":";;;;AAAA,SACEA,iBADF;AAIA,SAASC,iBAAT,QAAkC,kBAAlC;AACA,SAASC,GAAT;AACA,SAASC,WAAT;AACA,SAASC,oBAAT;AAEA;AACA;AACA;;AACA,OAAO,IAAMC,iBAAiB,GAAG,SAApBA,iBAAoB,OAGH;AAAA,2BAF5BC,QAE4B;AAAA,MAF5BA,QAE4B,8BAFjB,QAEiB;AAAA,MADzBC,SACyB;;AAC5B,MAAMC,QAAQ,GAAGL,WAAW,EAA5B;AAEA,SACE,oBAAC,iBAAD;AACE,kBAAYC,oBAAoB,CAACE,QAAD,CADlC;AAEE,IAAA,OAAO;AAFT,KAGMC,SAHN,GAKGC,QAAQ,KAAKN,GAAb,GAAmBI,QAAnB,GAA8B,oBAAC,iBAAD,OALjC,CADF;AASD,CAfM","sourcesContent":["import {\n PanelHeaderButton,\n PanelHeaderButtonProps,\n} from \"../PanelHeaderButton/PanelHeaderButton\";\nimport { Icon28DoneOutline } from \"@vkontakte/icons\";\nimport { IOS } from \"../../lib/platform\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getTitleFromChildren } from \"../../lib/utils\";\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PanelHeaderSubmit\n */\nexport const PanelHeaderSubmit = ({\n children = \"Готово\",\n ...restProps\n}: PanelHeaderButtonProps) => {\n const platform = usePlatform();\n\n return (\n <PanelHeaderButton\n aria-label={getTitleFromChildren(children)}\n primary\n {...restProps}\n >\n {platform === IOS ? children : <Icon28DoneOutline />}\n </PanelHeaderButton>\n );\n};\n"],"file":"PanelHeaderSubmit.js"}
@@ -1 +1,3 @@
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
+ .vkuiPromoBanner{background:#fff;background:var(--background_content,var(--vkui--color_background_content));box-sizing:border-box;color:#000;color:var(--text_primary,var(--vkui--color_text_primary));outline:1px solid rgba(0,0,0,.12);outline:var(--thin-border) solid var(--separator_alpha,var(--vkui--color_separator_primary_alpha));padding-bottom:10px;position:relative;width:100%}.vkuiPromoBanner__head{color:#818c99;color:var(--text_secondary,var(--vkui--color_text_secondary));display:flex;padding:14px 16px 10px;padding:14px var(--vkui--size_base_padding_horizontal--regular,16px) 10px}.vkuiPromoBanner__age{margin-left:6px}.vkuiPromoBanner__close{align-items:center;color:#99a2ad;color:var(
2
+ --placeholder_icon_foreground_primary,var(--vkui--color_icon_secondary)
3
+ );display:flex;height:48px;justify-content:center;position:absolute;right:0;top:0;width:48px}.vkuiPromoBanner__close:active{opacity:.7}.vkuiPromoBanner__pixels{display:none}
@@ -11,8 +11,6 @@ import { Button } from "../Button/Button";
11
11
  import { SimpleCell } from "../SimpleCell/SimpleCell";
12
12
  import { Avatar } from "../Avatar/Avatar";
13
13
  import { Caption } from "../Typography/Caption/Caption";
14
- import { usePlatform } from "../../hooks/usePlatform";
15
- import { getClassName } from "../../helpers/getClassName";
16
14
  import { warnOnce } from "../../lib/warnOnce";
17
15
  import "./PromoBanner.css";
18
16
  var warn = warnOnce("PromoBanner");
@@ -27,7 +25,6 @@ export var PromoBanner = function PromoBanner(_ref) {
27
25
  isCloseButtonHidden = _ref.isCloseButtonHidden,
28
26
  restProps = _objectWithoutProperties(_ref, _excluded);
29
27
 
30
- var platform = usePlatform();
31
28
  var ageRestrictions = bannerData.ageRestrictions != null ? parseInt(bannerData.ageRestrictions) : bannerData.ageRestriction;
32
29
 
33
30
  if (bannerData.ageRestriction && process.env.NODE_ENV === "development") {
@@ -53,7 +50,7 @@ export var PromoBanner = function PromoBanner(_ref) {
53
50
  }
54
51
  }, [statsPixels.playbackStarted]);
55
52
  return createScopedElement("div", _extends({
56
- vkuiClass: getClassName("PromoBanner", platform)
53
+ vkuiClass: "PromoBanner"
57
54
  }, restProps), createScopedElement("div", {
58
55
  vkuiClass: "PromoBanner__head"
59
56
  }, createScopedElement(Caption, {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/PromoBanner/PromoBanner.tsx"],"names":["React","Icon24Dismiss","Button","SimpleCell","Avatar","Caption","usePlatform","getClassName","warnOnce","warn","PromoBanner","bannerData","onClose","isCloseButtonHidden","restProps","platform","ageRestrictions","parseInt","ageRestriction","process","env","NODE_ENV","useState","currentPixel","setCurrentPixel","statsPixels","useMemo","statistics","reduce","acc","item","type","url","onClick","useCallback","click","useEffect","playbackStarted","advertisingLabel","trackingLink","iconLink","title","ctaText","domain","length"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { Icon24Dismiss } from \"@vkontakte/icons\";\nimport { Button } from \"../Button/Button\";\nimport { SimpleCell } from \"../SimpleCell/SimpleCell\";\nimport { Avatar } from \"../Avatar/Avatar\";\nimport { Caption } from \"../Typography/Caption/Caption\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport \"./PromoBanner.css\";\n\ntype StatsType =\n | \"playbackStarted\" // Начало показа\n | \"click\"; // Клик по баннеру\n\ntype BannerData = {\n title?: string;\n url_types?: string; // eslint-disable-line camelcase\n bannerID?: string;\n imageWidth?: number;\n imageHeight?: number;\n imageLink?: string;\n trackingLink?: string;\n type?: string;\n iconWidth?: number;\n domain?: string;\n ctaText?: string;\n advertisingLabel?: string;\n iconLink?: string;\n statistics?: Array<{ type: StatsType; url: string }>;\n openInBrowser?: boolean;\n iconHeight?: number;\n directLink?: boolean;\n navigationType?: string;\n description?: string;\n ageRestrictions?: string;\n /** @deprecated */\n ageRestriction?: number;\n};\n\nexport interface PromoBannerProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Данные рекламного баннера, полученные из VKWebAppGetAds */\n bannerData: BannerData;\n /** Флаг скрытия кнопки закрытия рекламы */\n isCloseButtonHidden?: boolean;\n /** Хандлер закрытия рекламы */\n onClose: () => void;\n}\n\nconst warn = warnOnce(\"PromoBanner\");\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PromoBanner\n */\nexport const PromoBanner = ({\n bannerData = {},\n onClose,\n isCloseButtonHidden,\n ...restProps\n}: PromoBannerProps) => {\n const platform = usePlatform();\n\n const ageRestrictions =\n bannerData.ageRestrictions != null\n ? parseInt(bannerData.ageRestrictions)\n : bannerData.ageRestriction;\n\n if (bannerData.ageRestriction && process.env.NODE_ENV === \"development\") {\n warn(\n \"Свойство bannerData.ageRestriction устарело и будет удалено в 5.0.0. Используйте bannerData.ageRestrictions\"\n );\n }\n\n const [currentPixel, setCurrentPixel] = React.useState(\"\");\n\n const statsPixels = React.useMemo(\n () =>\n (bannerData.statistics\n ? bannerData.statistics.reduce(\n (acc, item) => ({ ...acc, [item.type]: item.url }),\n {}\n )\n : {}) as Record<StatsType, string | void>,\n [bannerData.statistics]\n );\n\n const onClick = React.useCallback(\n () => setCurrentPixel(statsPixels.click || \"\"),\n [statsPixels.click]\n );\n\n React.useEffect(() => {\n if (statsPixels.playbackStarted) {\n setCurrentPixel(statsPixels.playbackStarted);\n }\n }, [statsPixels.playbackStarted]);\n\n return (\n <div vkuiClass={getClassName(\"PromoBanner\", platform)} {...restProps}>\n <div vkuiClass=\"PromoBanner__head\">\n <Caption vkuiClass=\"PromoBanner__label\">\n {bannerData.advertisingLabel || \"Advertisement\"}\n </Caption>\n {ageRestrictions != null && (\n <Caption vkuiClass=\"PromoBanner__age\">{ageRestrictions}+</Caption>\n )}\n\n {!isCloseButtonHidden && (\n <div vkuiClass=\"PromoBanner__close\" onClick={onClose}>\n <Icon24Dismiss />\n </div>\n )}\n </div>\n <SimpleCell\n href={bannerData.trackingLink}\n onClick={onClick}\n rel=\"nofollow noopener noreferrer\"\n target=\"_blank\"\n before={\n <Avatar\n mode=\"image\"\n size={48}\n src={bannerData.iconLink}\n alt={bannerData.title}\n />\n }\n after={<Button mode=\"outline\">{bannerData.ctaText}</Button>}\n description={bannerData.domain}\n >\n {bannerData.title}\n </SimpleCell>\n\n {currentPixel.length > 0 && (\n <div vkuiClass=\"PromoBanner__pixels\">\n <img src={currentPixel} alt=\"\" />\n </div>\n )}\n </div>\n );\n};\n"],"file":"PromoBanner.js"}
1
+ {"version":3,"sources":["../../../../src/components/PromoBanner/PromoBanner.tsx"],"names":["React","Icon24Dismiss","Button","SimpleCell","Avatar","Caption","warnOnce","warn","PromoBanner","bannerData","onClose","isCloseButtonHidden","restProps","ageRestrictions","parseInt","ageRestriction","process","env","NODE_ENV","useState","currentPixel","setCurrentPixel","statsPixels","useMemo","statistics","reduce","acc","item","type","url","onClick","useCallback","click","useEffect","playbackStarted","advertisingLabel","trackingLink","iconLink","title","ctaText","domain","length"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { Icon24Dismiss } from \"@vkontakte/icons\";\nimport { Button } from \"../Button/Button\";\nimport { SimpleCell } from \"../SimpleCell/SimpleCell\";\nimport { Avatar } from \"../Avatar/Avatar\";\nimport { Caption } from \"../Typography/Caption/Caption\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport \"./PromoBanner.css\";\n\ntype StatsType =\n | \"playbackStarted\" // Начало показа\n | \"click\"; // Клик по баннеру\n\ntype BannerData = {\n title?: string;\n url_types?: string; // eslint-disable-line camelcase\n bannerID?: string;\n imageWidth?: number;\n imageHeight?: number;\n imageLink?: string;\n trackingLink?: string;\n type?: string;\n iconWidth?: number;\n domain?: string;\n ctaText?: string;\n advertisingLabel?: string;\n iconLink?: string;\n statistics?: Array<{ type: StatsType; url: string }>;\n openInBrowser?: boolean;\n iconHeight?: number;\n directLink?: boolean;\n navigationType?: string;\n description?: string;\n ageRestrictions?: string;\n /** @deprecated */\n ageRestriction?: number;\n};\n\nexport interface PromoBannerProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Данные рекламного баннера, полученные из VKWebAppGetAds */\n bannerData: BannerData;\n /** Флаг скрытия кнопки закрытия рекламы */\n isCloseButtonHidden?: boolean;\n /** Хандлер закрытия рекламы */\n onClose: () => void;\n}\n\nconst warn = warnOnce(\"PromoBanner\");\n\n/**\n * @see https://vkcom.github.io/VKUI/#/PromoBanner\n */\nexport const PromoBanner = ({\n bannerData = {},\n onClose,\n isCloseButtonHidden,\n ...restProps\n}: PromoBannerProps) => {\n const ageRestrictions =\n bannerData.ageRestrictions != null\n ? parseInt(bannerData.ageRestrictions)\n : bannerData.ageRestriction;\n\n if (bannerData.ageRestriction && process.env.NODE_ENV === \"development\") {\n warn(\n \"Свойство bannerData.ageRestriction устарело и будет удалено в 5.0.0. Используйте bannerData.ageRestrictions\"\n );\n }\n\n const [currentPixel, setCurrentPixel] = React.useState(\"\");\n\n const statsPixels = React.useMemo(\n () =>\n (bannerData.statistics\n ? bannerData.statistics.reduce(\n (acc, item) => ({ ...acc, [item.type]: item.url }),\n {}\n )\n : {}) as Record<StatsType, string | void>,\n [bannerData.statistics]\n );\n\n const onClick = React.useCallback(\n () => setCurrentPixel(statsPixels.click || \"\"),\n [statsPixels.click]\n );\n\n React.useEffect(() => {\n if (statsPixels.playbackStarted) {\n setCurrentPixel(statsPixels.playbackStarted);\n }\n }, [statsPixels.playbackStarted]);\n\n return (\n <div vkuiClass=\"PromoBanner\" {...restProps}>\n <div vkuiClass=\"PromoBanner__head\">\n <Caption vkuiClass=\"PromoBanner__label\">\n {bannerData.advertisingLabel || \"Advertisement\"}\n </Caption>\n {ageRestrictions != null && (\n <Caption vkuiClass=\"PromoBanner__age\">{ageRestrictions}+</Caption>\n )}\n\n {!isCloseButtonHidden && (\n <div vkuiClass=\"PromoBanner__close\" onClick={onClose}>\n <Icon24Dismiss />\n </div>\n )}\n </div>\n <SimpleCell\n href={bannerData.trackingLink}\n onClick={onClick}\n rel=\"nofollow noopener noreferrer\"\n target=\"_blank\"\n before={\n <Avatar\n mode=\"image\"\n size={48}\n src={bannerData.iconLink}\n alt={bannerData.title}\n />\n }\n after={<Button mode=\"outline\">{bannerData.ctaText}</Button>}\n description={bannerData.domain}\n >\n {bannerData.title}\n </SimpleCell>\n\n {currentPixel.length > 0 && (\n <div vkuiClass=\"PromoBanner__pixels\">\n <img src={currentPixel} alt=\"\" />\n </div>\n )}\n </div>\n );\n};\n"],"file":"PromoBanner.js"}