@vkontakte/vkui 4.26.0 → 4.27.2

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 (657) hide show
  1. package/.cache/.eslintcache +1 -1
  2. package/.cache/.stylelintcache +1 -1
  3. package/.cache/.tsbuildinfo +389 -243
  4. package/.cache/ts/src/components/ActionSheetItem/ActionSheetItem.d.ts +1 -2
  5. package/.cache/ts/src/components/Alert/Alert.d.ts +1 -2
  6. package/.cache/ts/src/components/AppearanceProvider/AppearanceProvider.d.ts +1 -0
  7. package/.cache/ts/src/components/AppearanceProvider/AppearanceProviderContext.d.ts +1 -6
  8. package/.cache/ts/src/components/Card/Card.d.ts +1 -2
  9. package/.cache/ts/src/components/CardScroll/CardScroll.d.ts +4 -7
  10. package/.cache/ts/src/components/Chip/Chip.d.ts +2 -2
  11. package/.cache/ts/src/components/ConfigProvider/ConfigProvider.d.ts +1 -1
  12. package/.cache/ts/src/components/ConfigProvider/ConfigProviderContext.d.ts +5 -12
  13. package/.cache/ts/src/components/Gradient/Gradient.d.ts +1 -2
  14. package/.cache/ts/src/components/SegmentedControl/SegmentedControl.d.ts +17 -0
  15. package/.cache/ts/src/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.d.ts +4 -0
  16. package/.cache/ts/src/components/SliderSwitch/SliderSwitch.d.ts +6 -2
  17. package/.cache/ts/src/components/SliderSwitch/SliderSwitchButton.d.ts +4 -2
  18. package/.cache/ts/src/components/Switch/Switch.d.ts +3 -2
  19. package/.cache/ts/src/components/Typography/Subhead/Subhead.d.ts +4 -1
  20. package/.cache/ts/src/components/Typography/Title/Title.d.ts +4 -1
  21. package/.cache/ts/src/components/VisuallyHiddenInput/VisuallyHiddenInput.d.ts +12 -0
  22. package/.cache/ts/src/hooks/useAppearance.d.ts +1 -1
  23. package/.cache/ts/src/hooks/usePlatform.d.ts +1 -1
  24. package/.cache/ts/src/index.d.ts +7 -5
  25. package/.cache/ts/src/lib/utils.d.ts +1 -0
  26. package/.cache/ts/src/tokenized/index.d.ts +12 -0
  27. package/CSS_GUIDE.md +145 -0
  28. package/VKUI_TOKENS_MIGRATION_GUIDE.md +2 -1
  29. package/dist/cjs/components/ActionSheet/ActionSheetDropdownDesktop.js +5 -1
  30. package/dist/cjs/components/ActionSheet/ActionSheetDropdownDesktop.js.map +1 -1
  31. package/dist/cjs/components/ActionSheetItem/ActionSheetItem.d.ts +1 -2
  32. package/dist/cjs/components/ActionSheetItem/ActionSheetItem.js +16 -11
  33. package/dist/cjs/components/ActionSheetItem/ActionSheetItem.js.map +1 -1
  34. package/dist/cjs/components/Alert/Alert.d.ts +1 -2
  35. package/dist/cjs/components/Alert/Alert.js +12 -12
  36. package/dist/cjs/components/Alert/Alert.js.map +1 -1
  37. package/dist/cjs/components/AppRoot/AppRoot.js +0 -8
  38. package/dist/cjs/components/AppRoot/AppRoot.js.map +1 -1
  39. package/dist/cjs/components/AppRoot/AppRootPortal.js +9 -2
  40. package/dist/cjs/components/AppRoot/AppRootPortal.js.map +1 -1
  41. package/dist/cjs/components/AppearanceProvider/AppearanceProvider.d.ts +1 -0
  42. package/dist/cjs/components/AppearanceProvider/AppearanceProvider.js +34 -12
  43. package/dist/cjs/components/AppearanceProvider/AppearanceProvider.js.map +1 -1
  44. package/dist/cjs/components/AppearanceProvider/AppearanceProviderContext.d.ts +1 -6
  45. package/dist/cjs/components/AppearanceProvider/AppearanceProviderContext.js +3 -1
  46. package/dist/cjs/components/AppearanceProvider/AppearanceProviderContext.js.map +1 -1
  47. package/dist/cjs/components/Banner/Banner.js +2 -4
  48. package/dist/cjs/components/Banner/Banner.js.map +1 -1
  49. package/dist/cjs/components/Button/Button.js +12 -4
  50. package/dist/cjs/components/Button/Button.js.map +1 -1
  51. package/dist/cjs/components/Card/Card.d.ts +1 -2
  52. package/dist/cjs/components/Card/Card.js +4 -8
  53. package/dist/cjs/components/Card/Card.js.map +1 -1
  54. package/dist/cjs/components/CardScroll/CardScroll.d.ts +4 -7
  55. package/dist/cjs/components/CardScroll/CardScroll.js +11 -15
  56. package/dist/cjs/components/CardScroll/CardScroll.js.map +1 -1
  57. package/dist/cjs/components/Chip/Chip.d.ts +2 -2
  58. package/dist/cjs/components/Chip/Chip.js +3 -5
  59. package/dist/cjs/components/Chip/Chip.js.map +1 -1
  60. package/dist/cjs/components/ChipsInput/ChipsInput.js +2 -2
  61. package/dist/cjs/components/ChipsInput/ChipsInput.js.map +1 -1
  62. package/dist/cjs/components/ConfigProvider/ConfigProvider.d.ts +1 -1
  63. package/dist/cjs/components/ConfigProvider/ConfigProvider.js +32 -44
  64. package/dist/cjs/components/ConfigProvider/ConfigProvider.js.map +1 -1
  65. package/dist/cjs/components/ConfigProvider/ConfigProviderContext.d.ts +5 -12
  66. package/dist/cjs/components/ConfigProvider/ConfigProviderContext.js +3 -5
  67. package/dist/cjs/components/ConfigProvider/ConfigProviderContext.js.map +1 -1
  68. package/dist/cjs/components/ContentCard/ContentCard.js +4 -4
  69. package/dist/cjs/components/ContentCard/ContentCard.js.map +1 -1
  70. package/dist/cjs/components/FormItem/FormItem.js +0 -1
  71. package/dist/cjs/components/FormItem/FormItem.js.map +1 -1
  72. package/dist/cjs/components/Gradient/Gradient.d.ts +1 -2
  73. package/dist/cjs/components/Gradient/Gradient.js +6 -10
  74. package/dist/cjs/components/Gradient/Gradient.js.map +1 -1
  75. package/dist/cjs/components/Header/Header.js +3 -7
  76. package/dist/cjs/components/Header/Header.js.map +1 -1
  77. package/dist/cjs/components/HorizontalCell/HorizontalCell.js +1 -3
  78. package/dist/cjs/components/HorizontalCell/HorizontalCell.js.map +1 -1
  79. package/dist/cjs/components/HorizontalScroll/HorizontalScroll.js +1 -6
  80. package/dist/cjs/components/HorizontalScroll/HorizontalScroll.js.map +1 -1
  81. package/dist/cjs/components/HorizontalScroll/HorizontalScrollArrow.js +1 -6
  82. package/dist/cjs/components/HorizontalScroll/HorizontalScrollArrow.js.map +1 -1
  83. package/dist/cjs/components/InfoRow/InfoRow.js +1 -2
  84. package/dist/cjs/components/InfoRow/InfoRow.js.map +1 -1
  85. package/dist/cjs/components/ModalCardBase/ModalCardBase.js +1 -1
  86. package/dist/cjs/components/ModalCardBase/ModalCardBase.js.map +1 -1
  87. package/dist/cjs/components/PanelHeaderButton/PanelHeaderButton.js +1 -1
  88. package/dist/cjs/components/PanelHeaderButton/PanelHeaderButton.js.map +1 -1
  89. package/dist/cjs/components/Placeholder/Placeholder.js +1 -1
  90. package/dist/cjs/components/Placeholder/Placeholder.js.map +1 -1
  91. package/dist/cjs/components/Removable/Removable.js +8 -4
  92. package/dist/cjs/components/Removable/Removable.js.map +1 -1
  93. package/dist/cjs/components/RichCell/RichCell.js +0 -1
  94. package/dist/cjs/components/RichCell/RichCell.js.map +1 -1
  95. package/dist/cjs/components/Search/Search.js +47 -23
  96. package/dist/cjs/components/Search/Search.js.map +1 -1
  97. package/dist/cjs/components/SegmentedControl/SegmentedControl.d.ts +17 -0
  98. package/dist/cjs/components/SegmentedControl/SegmentedControl.js +116 -0
  99. package/dist/cjs/components/SegmentedControl/SegmentedControl.js.map +1 -0
  100. package/dist/cjs/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.d.ts +4 -0
  101. package/dist/cjs/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.js +61 -0
  102. package/dist/cjs/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.js.map +1 -0
  103. package/dist/cjs/components/SimpleCell/SimpleCell.js +21 -9
  104. package/dist/cjs/components/SimpleCell/SimpleCell.js.map +1 -1
  105. package/dist/cjs/components/SliderSwitch/SliderSwitch.d.ts +6 -2
  106. package/dist/cjs/components/SliderSwitch/SliderSwitch.js +18 -6
  107. package/dist/cjs/components/SliderSwitch/SliderSwitch.js.map +1 -1
  108. package/dist/cjs/components/SliderSwitch/SliderSwitchButton.d.ts +4 -2
  109. package/dist/cjs/components/SliderSwitch/SliderSwitchButton.js +6 -5
  110. package/dist/cjs/components/SliderSwitch/SliderSwitchButton.js.map +1 -1
  111. package/dist/cjs/components/SubnavigationButton/SubnavigationButton.js +1 -3
  112. package/dist/cjs/components/SubnavigationButton/SubnavigationButton.js.map +1 -1
  113. package/dist/cjs/components/Switch/Switch.d.ts +3 -2
  114. package/dist/cjs/components/Switch/Switch.js +3 -6
  115. package/dist/cjs/components/Switch/Switch.js.map +1 -1
  116. package/dist/cjs/components/TextTooltip/TextTooltip.js +1 -2
  117. package/dist/cjs/components/TextTooltip/TextTooltip.js.map +1 -1
  118. package/dist/cjs/components/Tooltip/Tooltip.js +1 -2
  119. package/dist/cjs/components/Tooltip/Tooltip.js.map +1 -1
  120. package/dist/cjs/components/Typography/Subhead/Subhead.d.ts +4 -1
  121. package/dist/cjs/components/Typography/Subhead/Subhead.js +15 -8
  122. package/dist/cjs/components/Typography/Subhead/Subhead.js.map +1 -1
  123. package/dist/cjs/components/Typography/Title/Title.d.ts +4 -1
  124. package/dist/cjs/components/Typography/Title/Title.js +9 -19
  125. package/dist/cjs/components/Typography/Title/Title.js.map +1 -1
  126. package/dist/cjs/components/UsersStack/UsersStack.js +0 -1
  127. package/dist/cjs/components/UsersStack/UsersStack.js.map +1 -1
  128. package/dist/cjs/components/VisuallyHiddenInput/VisuallyHiddenInput.d.ts +12 -0
  129. package/dist/cjs/components/VisuallyHiddenInput/VisuallyHiddenInput.js +37 -0
  130. package/dist/cjs/components/VisuallyHiddenInput/VisuallyHiddenInput.js.map +1 -0
  131. package/dist/cjs/hooks/useAppearance.d.ts +1 -1
  132. package/dist/cjs/hooks/useAppearance.js +2 -2
  133. package/dist/cjs/hooks/useAppearance.js.map +1 -1
  134. package/dist/cjs/hooks/usePlatform.d.ts +1 -1
  135. package/dist/cjs/hooks/usePlatform.js.map +1 -1
  136. package/dist/cjs/index.d.ts +7 -5
  137. package/dist/cjs/index.js +18 -10
  138. package/dist/cjs/index.js.map +1 -1
  139. package/dist/cjs/lib/utils.d.ts +1 -0
  140. package/dist/cjs/lib/utils.js +7 -0
  141. package/dist/cjs/lib/utils.js.map +1 -1
  142. package/dist/cjs/tokenized/index.d.ts +12 -0
  143. package/dist/cjs/tokenized/index.js +48 -0
  144. package/dist/cjs/tokenized/index.js.map +1 -1
  145. package/dist/components/ActionSheet/ActionSheetDropdownDesktop.js +5 -1
  146. package/dist/components/ActionSheet/ActionSheetDropdownDesktop.js.map +1 -1
  147. package/dist/components/ActionSheetItem/ActionSheetItem.d.ts +1 -2
  148. package/dist/components/ActionSheetItem/ActionSheetItem.js +14 -11
  149. package/dist/components/ActionSheetItem/ActionSheetItem.js.map +1 -1
  150. package/dist/components/Alert/Alert.d.ts +1 -2
  151. package/dist/components/Alert/Alert.js +11 -12
  152. package/dist/components/Alert/Alert.js.map +1 -1
  153. package/dist/components/AppRoot/AppRoot.js +0 -7
  154. package/dist/components/AppRoot/AppRoot.js.map +1 -1
  155. package/dist/components/AppRoot/AppRootPortal.js +7 -2
  156. package/dist/components/AppRoot/AppRootPortal.js.map +1 -1
  157. package/dist/components/AppearanceProvider/AppearanceProvider.d.ts +1 -0
  158. package/dist/components/AppearanceProvider/AppearanceProvider.js +29 -11
  159. package/dist/components/AppearanceProvider/AppearanceProvider.js.map +1 -1
  160. package/dist/components/AppearanceProvider/AppearanceProviderContext.d.ts +1 -6
  161. package/dist/components/AppearanceProvider/AppearanceProviderContext.js +2 -1
  162. package/dist/components/AppearanceProvider/AppearanceProviderContext.js.map +1 -1
  163. package/dist/components/Banner/Banner.js +2 -4
  164. package/dist/components/Banner/Banner.js.map +1 -1
  165. package/dist/components/Button/Button.js +12 -5
  166. package/dist/components/Button/Button.js.map +1 -1
  167. package/dist/components/Card/Card.d.ts +1 -2
  168. package/dist/components/Card/Card.js +3 -9
  169. package/dist/components/Card/Card.js.map +1 -1
  170. package/dist/components/CardScroll/CardScroll.d.ts +4 -7
  171. package/dist/components/CardScroll/CardScroll.js +9 -14
  172. package/dist/components/CardScroll/CardScroll.js.map +1 -1
  173. package/dist/components/Chip/Chip.d.ts +2 -2
  174. package/dist/components/Chip/Chip.js +2 -6
  175. package/dist/components/Chip/Chip.js.map +1 -1
  176. package/dist/components/ChipsInput/ChipsInput.js +1 -1
  177. package/dist/components/ChipsInput/ChipsInput.js.map +1 -1
  178. package/dist/components/ConfigProvider/ConfigProvider.d.ts +1 -1
  179. package/dist/components/ConfigProvider/ConfigProvider.js +31 -44
  180. package/dist/components/ConfigProvider/ConfigProvider.js.map +1 -1
  181. package/dist/components/ConfigProvider/ConfigProviderContext.d.ts +5 -12
  182. package/dist/components/ConfigProvider/ConfigProviderContext.js +2 -3
  183. package/dist/components/ConfigProvider/ConfigProviderContext.js.map +1 -1
  184. package/dist/components/ContentCard/ContentCard.js +3 -3
  185. package/dist/components/ContentCard/ContentCard.js.map +1 -1
  186. package/dist/components/FormItem/FormItem.js +0 -1
  187. package/dist/components/FormItem/FormItem.js.map +1 -1
  188. package/dist/components/Gradient/Gradient.d.ts +1 -2
  189. package/dist/components/Gradient/Gradient.js +5 -11
  190. package/dist/components/Gradient/Gradient.js.map +1 -1
  191. package/dist/components/Header/Header.js +3 -7
  192. package/dist/components/Header/Header.js.map +1 -1
  193. package/dist/components/HorizontalCell/HorizontalCell.js +1 -3
  194. package/dist/components/HorizontalCell/HorizontalCell.js.map +1 -1
  195. package/dist/components/HorizontalScroll/HorizontalScroll.js +1 -4
  196. package/dist/components/HorizontalScroll/HorizontalScroll.js.map +1 -1
  197. package/dist/components/HorizontalScroll/HorizontalScrollArrow.js +1 -4
  198. package/dist/components/HorizontalScroll/HorizontalScrollArrow.js.map +1 -1
  199. package/dist/components/InfoRow/InfoRow.js +1 -2
  200. package/dist/components/InfoRow/InfoRow.js.map +1 -1
  201. package/dist/components/ModalCardBase/ModalCardBase.js +2 -2
  202. package/dist/components/ModalCardBase/ModalCardBase.js.map +1 -1
  203. package/dist/components/PanelHeaderButton/PanelHeaderButton.js +1 -1
  204. package/dist/components/PanelHeaderButton/PanelHeaderButton.js.map +1 -1
  205. package/dist/components/Placeholder/Placeholder.js +1 -1
  206. package/dist/components/Placeholder/Placeholder.js.map +1 -1
  207. package/dist/components/Removable/Removable.js +8 -4
  208. package/dist/components/Removable/Removable.js.map +1 -1
  209. package/dist/components/RichCell/RichCell.js +0 -1
  210. package/dist/components/RichCell/RichCell.js.map +1 -1
  211. package/dist/components/Search/Search.js +45 -22
  212. package/dist/components/Search/Search.js.map +1 -1
  213. package/dist/components/SegmentedControl/SegmentedControl.d.ts +17 -0
  214. package/dist/components/SegmentedControl/SegmentedControl.js +94 -0
  215. package/dist/components/SegmentedControl/SegmentedControl.js.map +1 -0
  216. package/dist/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.d.ts +4 -0
  217. package/dist/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.js +40 -0
  218. package/dist/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.js.map +1 -0
  219. package/dist/components/SimpleCell/SimpleCell.js +21 -10
  220. package/dist/components/SimpleCell/SimpleCell.js.map +1 -1
  221. package/dist/components/SliderSwitch/SliderSwitch.d.ts +6 -2
  222. package/dist/components/SliderSwitch/SliderSwitch.js +14 -3
  223. package/dist/components/SliderSwitch/SliderSwitch.js.map +1 -1
  224. package/dist/components/SliderSwitch/SliderSwitchButton.d.ts +4 -2
  225. package/dist/components/SliderSwitch/SliderSwitchButton.js +5 -5
  226. package/dist/components/SliderSwitch/SliderSwitchButton.js.map +1 -1
  227. package/dist/components/SubnavigationButton/SubnavigationButton.js +1 -3
  228. package/dist/components/SubnavigationButton/SubnavigationButton.js.map +1 -1
  229. package/dist/components/Switch/Switch.d.ts +3 -2
  230. package/dist/components/Switch/Switch.js +3 -6
  231. package/dist/components/Switch/Switch.js.map +1 -1
  232. package/dist/components/TextTooltip/TextTooltip.js +1 -2
  233. package/dist/components/TextTooltip/TextTooltip.js.map +1 -1
  234. package/dist/components/Tooltip/Tooltip.js +1 -2
  235. package/dist/components/Tooltip/Tooltip.js.map +1 -1
  236. package/dist/components/Typography/Subhead/Subhead.d.ts +4 -1
  237. package/dist/components/Typography/Subhead/Subhead.js +13 -7
  238. package/dist/components/Typography/Subhead/Subhead.js.map +1 -1
  239. package/dist/components/Typography/Title/Title.d.ts +4 -1
  240. package/dist/components/Typography/Title/Title.js +7 -16
  241. package/dist/components/Typography/Title/Title.js.map +1 -1
  242. package/dist/components/UsersStack/UsersStack.js +0 -1
  243. package/dist/components/UsersStack/UsersStack.js.map +1 -1
  244. package/dist/components/VisuallyHiddenInput/VisuallyHiddenInput.d.ts +12 -0
  245. package/dist/components/VisuallyHiddenInput/VisuallyHiddenInput.js +23 -0
  246. package/dist/components/VisuallyHiddenInput/VisuallyHiddenInput.js.map +1 -0
  247. package/dist/components.css +10 -5
  248. package/dist/components.css.map +1 -1
  249. package/dist/cssm/appearance/constants.d.ts +1 -0
  250. package/dist/cssm/components/ActionSheet/ActionSheet.d.ts +26 -0
  251. package/dist/cssm/components/ActionSheet/ActionSheetContext.d.ts +8 -0
  252. package/dist/cssm/components/ActionSheet/ActionSheetDropdown.d.ts +4 -0
  253. package/dist/cssm/components/ActionSheet/ActionSheetDropdownDesktop.d.ts +4 -0
  254. package/dist/cssm/components/ActionSheet/ActionSheetDropdownDesktop.js +5 -1
  255. package/dist/cssm/components/ActionSheet/ActionSheetDropdownDesktop.js.map +1 -1
  256. package/dist/cssm/components/ActionSheet/types.d.ts +9 -0
  257. package/dist/cssm/components/ActionSheetItem/ActionSheetItem.d.ts +20 -0
  258. package/dist/cssm/components/ActionSheetItem/ActionSheetItem.js +14 -11
  259. package/dist/cssm/components/ActionSheetItem/ActionSheetItem.js.map +1 -1
  260. package/dist/cssm/components/AdaptivityProvider/AdaptivityContext.d.ts +46 -0
  261. package/dist/cssm/components/AdaptivityProvider/AdaptivityProvider.d.ts +10 -0
  262. package/dist/cssm/components/Alert/Alert.d.ts +24 -0
  263. package/dist/cssm/components/Alert/Alert.js +11 -12
  264. package/dist/cssm/components/Alert/Alert.js.map +1 -1
  265. package/dist/cssm/components/AppRoot/AppRoot.d.ts +14 -0
  266. package/dist/cssm/components/AppRoot/AppRoot.js +0 -7
  267. package/dist/cssm/components/AppRoot/AppRoot.js.map +1 -1
  268. package/dist/cssm/components/AppRoot/AppRootContext.d.ts +9 -0
  269. package/dist/cssm/components/AppRoot/AppRootPortal.d.ts +5 -0
  270. package/dist/cssm/components/AppRoot/AppRootPortal.js +7 -2
  271. package/dist/cssm/components/AppRoot/AppRootPortal.js.map +1 -1
  272. package/dist/cssm/components/AppRoot/ScrollContext.d.ts +23 -0
  273. package/dist/cssm/components/AppearanceProvider/AppearanceProvider.d.ts +7 -0
  274. package/dist/cssm/components/AppearanceProvider/AppearanceProvider.js +29 -11
  275. package/dist/cssm/components/AppearanceProvider/AppearanceProvider.js.map +1 -1
  276. package/dist/cssm/components/AppearanceProvider/AppearanceProviderContext.d.ts +3 -0
  277. package/dist/cssm/components/AppearanceProvider/AppearanceProviderContext.js +2 -1
  278. package/dist/cssm/components/AppearanceProvider/AppearanceProviderContext.js.map +1 -1
  279. package/dist/cssm/components/Avatar/Avatar.d.ts +22 -0
  280. package/dist/cssm/components/Badge/Badge.d.ts +6 -0
  281. package/dist/cssm/components/Banner/Banner.d.ts +65 -0
  282. package/dist/cssm/components/Banner/Banner.js +2 -4
  283. package/dist/cssm/components/Banner/Banner.js.map +1 -1
  284. package/dist/cssm/components/Button/Button.d.ts +20 -0
  285. package/dist/cssm/components/Button/Button.js +12 -5
  286. package/dist/cssm/components/Button/Button.js.map +1 -1
  287. package/dist/cssm/components/Card/Card.css +2 -2
  288. package/dist/cssm/components/Card/Card.d.ts +7 -0
  289. package/dist/cssm/components/Card/Card.js +3 -9
  290. package/dist/cssm/components/Card/Card.js.map +1 -1
  291. package/dist/cssm/components/CardGrid/CardGrid.d.ts +8 -0
  292. package/dist/cssm/components/CardScroll/CardScroll.css +1 -1
  293. package/dist/cssm/components/CardScroll/CardScroll.d.ts +12 -0
  294. package/dist/cssm/components/CardScroll/CardScroll.js +9 -14
  295. package/dist/cssm/components/CardScroll/CardScroll.js.map +1 -1
  296. package/dist/cssm/components/Cell/Cell.d.ts +47 -0
  297. package/dist/cssm/components/Cell/CellCheckbox/CellCheckbox.d.ts +5 -0
  298. package/dist/cssm/components/Cell/CellDragger/CellDragger.d.ts +6 -0
  299. package/dist/cssm/components/Cell/useDraggable.d.ts +13 -0
  300. package/dist/cssm/components/CellButton/CellButton.d.ts +9 -0
  301. package/dist/cssm/components/Checkbox/Checkbox.d.ts +10 -0
  302. package/dist/cssm/components/Chip/Chip.d.ts +16 -0
  303. package/dist/cssm/components/Chip/Chip.js +2 -6
  304. package/dist/cssm/components/Chip/Chip.js.map +1 -1
  305. package/dist/cssm/components/ChipsInput/ChipsInput.d.ts +30 -0
  306. package/dist/cssm/components/ChipsInput/ChipsInput.js +1 -1
  307. package/dist/cssm/components/ChipsInput/ChipsInput.js.map +1 -1
  308. package/dist/cssm/components/ChipsInput/useChipsInput.d.ts +14 -0
  309. package/dist/cssm/components/ChipsSelect/ChipsSelect.d.ts +41 -0
  310. package/dist/cssm/components/ChipsSelect/useChipsSelect.d.ts +22 -0
  311. package/dist/cssm/components/ClickPopper/ClickPopper.d.ts +21 -0
  312. package/dist/cssm/components/ConfigProvider/ConfigProvider.d.ts +12 -0
  313. package/dist/cssm/components/ConfigProvider/ConfigProvider.js +31 -44
  314. package/dist/cssm/components/ConfigProvider/ConfigProvider.js.map +1 -1
  315. package/dist/cssm/components/ConfigProvider/ConfigProviderContext.d.ts +36 -0
  316. package/dist/cssm/components/ConfigProvider/ConfigProviderContext.js +2 -3
  317. package/dist/cssm/components/ConfigProvider/ConfigProviderContext.js.map +1 -1
  318. package/dist/cssm/components/ContentCard/ContentCard.d.ts +34 -0
  319. package/dist/cssm/components/ContentCard/ContentCard.js +3 -3
  320. package/dist/cssm/components/ContentCard/ContentCard.js.map +1 -1
  321. package/dist/cssm/components/Counter/Counter.d.ts +11 -0
  322. package/dist/cssm/components/CustomScrollView/CustomScrollView.d.ts +10 -0
  323. package/dist/cssm/components/CustomSelect/CustomSelect.d.ts +56 -0
  324. package/dist/cssm/components/CustomSelectDropdown/CustomSelectDropdown.d.ts +12 -0
  325. package/dist/cssm/components/CustomSelectOption/CustomSelectOption.css +1 -1
  326. package/dist/cssm/components/CustomSelectOption/CustomSelectOption.d.ts +15 -0
  327. package/dist/cssm/components/DatePicker/DatePicker.d.ts +24 -0
  328. package/dist/cssm/components/Div/Div.d.ts +7 -0
  329. package/dist/cssm/components/Dropdown/Dropdown.d.ts +8 -0
  330. package/dist/cssm/components/DropdownIcon/DropdownIcon.d.ts +3 -0
  331. package/dist/cssm/components/Epic/Epic.d.ts +10 -0
  332. package/dist/cssm/components/Epic/ScrollSaver.d.ts +6 -0
  333. package/dist/cssm/components/File/File.d.ts +9 -0
  334. package/dist/cssm/components/FixedLayout/FixedLayout.d.ts +19 -0
  335. package/dist/cssm/components/FocusTrap/FocusTrap.d.ts +8 -0
  336. package/dist/cssm/components/FocusVisible/FocusVisible.css +1 -1
  337. package/dist/cssm/components/FocusVisible/FocusVisible.d.ts +8 -0
  338. package/dist/cssm/components/Footer/Footer.d.ts +5 -0
  339. package/dist/cssm/components/FormField/FormField.d.ts +14 -0
  340. package/dist/cssm/components/FormItem/FormItem.d.ts +14 -0
  341. package/dist/cssm/components/FormItem/FormItem.js +0 -1
  342. package/dist/cssm/components/FormItem/FormItem.js.map +1 -1
  343. package/dist/cssm/components/FormLayout/FormLayout.d.ts +6 -0
  344. package/dist/cssm/components/FormLayoutGroup/FormLayoutGroup.d.ts +13 -0
  345. package/dist/cssm/components/FormStatus/FormStatus.d.ts +7 -0
  346. package/dist/cssm/components/Gallery/Gallery.d.ts +39 -0
  347. package/dist/cssm/components/Gradient/Gradient.d.ts +7 -0
  348. package/dist/cssm/components/Gradient/Gradient.js +5 -11
  349. package/dist/cssm/components/Gradient/Gradient.js.map +1 -1
  350. package/dist/cssm/components/GridAvatar/GridAvatar.d.ts +8 -0
  351. package/dist/cssm/components/Group/Group.d.ts +23 -0
  352. package/dist/cssm/components/Header/Header.d.ts +18 -0
  353. package/dist/cssm/components/Header/Header.js +3 -7
  354. package/dist/cssm/components/Header/Header.js.map +1 -1
  355. package/dist/cssm/components/HorizontalCell/HorizontalCell.d.ts +10 -0
  356. package/dist/cssm/components/HorizontalCell/HorizontalCell.js +1 -3
  357. package/dist/cssm/components/HorizontalCell/HorizontalCell.js.map +1 -1
  358. package/dist/cssm/components/HorizontalScroll/HorizontalScroll.d.ts +19 -0
  359. package/dist/cssm/components/HorizontalScroll/HorizontalScroll.js +1 -4
  360. package/dist/cssm/components/HorizontalScroll/HorizontalScroll.js.map +1 -1
  361. package/dist/cssm/components/HorizontalScroll/HorizontalScrollArrow.css +6 -1
  362. package/dist/cssm/components/HorizontalScroll/HorizontalScrollArrow.d.ts +8 -0
  363. package/dist/cssm/components/HorizontalScroll/HorizontalScrollArrow.js +1 -4
  364. package/dist/cssm/components/HorizontalScroll/HorizontalScrollArrow.js.map +1 -1
  365. package/dist/cssm/components/HoverPopper/HoverPopper.d.ts +29 -0
  366. package/dist/cssm/components/IconButton/IconButton.d.ts +11 -0
  367. package/dist/cssm/components/InfoRow/InfoRow.d.ts +7 -0
  368. package/dist/cssm/components/InfoRow/InfoRow.js +1 -2
  369. package/dist/cssm/components/InfoRow/InfoRow.js.map +1 -1
  370. package/dist/cssm/components/InitialsAvatar/InitialsAvatar.d.ts +32 -0
  371. package/dist/cssm/components/Input/Input.d.ts +9 -0
  372. package/dist/cssm/components/Link/Link.d.ts +6 -0
  373. package/dist/cssm/components/List/List.d.ts +4 -0
  374. package/dist/cssm/components/List/ListContext.d.ts +4 -0
  375. package/dist/cssm/components/MiniInfoCell/MiniInfoCell.d.ts +39 -0
  376. package/dist/cssm/components/ModalCard/ModalCard.d.ts +10 -0
  377. package/dist/cssm/components/ModalCardBase/ModalCardBase.d.ts +32 -0
  378. package/dist/cssm/components/ModalCardBase/ModalCardBase.js +2 -2
  379. package/dist/cssm/components/ModalCardBase/ModalCardBase.js.map +1 -1
  380. package/dist/cssm/components/ModalDismissButton/ModalDismissButton.d.ts +5 -0
  381. package/dist/cssm/components/ModalPage/ModalPage.d.ts +22 -0
  382. package/dist/cssm/components/ModalPageHeader/ModalPageHeader.d.ts +8 -0
  383. package/dist/cssm/components/ModalRoot/ModalRoot.d.ts +16 -0
  384. package/dist/cssm/components/ModalRoot/ModalRootAdaptive.d.ts +10 -0
  385. package/dist/cssm/components/ModalRoot/ModalRootContext.d.ts +20 -0
  386. package/dist/cssm/components/ModalRoot/ModalRootDesktop.d.ts +16 -0
  387. package/dist/cssm/components/ModalRoot/constants.d.ts +3 -0
  388. package/dist/cssm/components/ModalRoot/types.d.ts +45 -0
  389. package/dist/cssm/components/ModalRoot/useModalManager.d.ts +37 -0
  390. package/dist/cssm/components/ModalRoot/withModalRootContext.d.ts +5 -0
  391. package/dist/cssm/components/NativeSelect/NativeSelect.d.ts +15 -0
  392. package/dist/cssm/components/NavTransitionContext/NavTransitionContext.d.ts +7 -0
  393. package/dist/cssm/components/Panel/Panel.d.ts +9 -0
  394. package/dist/cssm/components/PanelHeader/PanelHeader.d.ts +21 -0
  395. package/dist/cssm/components/PanelHeaderBack/PanelHeaderBack.d.ts +9 -0
  396. package/dist/cssm/components/PanelHeaderButton/PanelHeaderButton.d.ts +8 -0
  397. package/dist/cssm/components/PanelHeaderButton/PanelHeaderButton.js +1 -1
  398. package/dist/cssm/components/PanelHeaderButton/PanelHeaderButton.js.map +1 -1
  399. package/dist/cssm/components/PanelHeaderClose/PanelHeaderClose.d.ts +4 -0
  400. package/dist/cssm/components/PanelHeaderContent/PanelHeaderContent.d.ts +9 -0
  401. package/dist/cssm/components/PanelHeaderContext/PanelHeaderContext.d.ts +7 -0
  402. package/dist/cssm/components/PanelHeaderEdit/PanelHeaderEdit.d.ts +18 -0
  403. package/dist/cssm/components/PanelHeaderSubmit/PanelHeaderSubmit.d.ts +4 -0
  404. package/dist/cssm/components/PanelSpinner/PanelSpinner.d.ts +7 -0
  405. package/dist/cssm/components/Placeholder/Placeholder.d.ts +23 -0
  406. package/dist/cssm/components/Placeholder/Placeholder.js +1 -1
  407. package/dist/cssm/components/Placeholder/Placeholder.js.map +1 -1
  408. package/dist/cssm/components/PopoutRoot/PopoutRoot.d.ts +10 -0
  409. package/dist/cssm/components/PopoutWrapper/PopoutWrapper.d.ts +10 -0
  410. package/dist/cssm/components/Popper/Popper.d.ts +32 -0
  411. package/dist/cssm/components/Progress/Progress.d.ts +8 -0
  412. package/dist/cssm/components/PromoBanner/PromoBanner.d.ts +40 -0
  413. package/dist/cssm/components/PullToRefresh/PullToRefresh.d.ts +37 -0
  414. package/dist/cssm/components/PullToRefresh/PullToRefreshSpinner.d.ts +11 -0
  415. package/dist/cssm/components/Radio/Radio.d.ts +9 -0
  416. package/dist/cssm/components/RadioGroup/RadioGroup.d.ts +6 -0
  417. package/dist/cssm/components/RangeSlider/RangeSlider.d.ts +6 -0
  418. package/dist/cssm/components/RangeSlider/UniversalSlider.d.ts +16 -0
  419. package/dist/cssm/components/Removable/Removable.d.ts +21 -0
  420. package/dist/cssm/components/Removable/Removable.js +8 -4
  421. package/dist/cssm/components/Removable/Removable.js.map +1 -1
  422. package/dist/cssm/components/RichCell/RichCell.d.ts +36 -0
  423. package/dist/cssm/components/RichCell/RichCell.js +0 -1
  424. package/dist/cssm/components/RichCell/RichCell.js.map +1 -1
  425. package/dist/cssm/components/RichTooltip/RichTooltip.d.ts +5 -0
  426. package/dist/cssm/components/Root/Root.d.ts +31 -0
  427. package/dist/cssm/components/ScreenSpinner/ScreenSpinner.d.ts +6 -0
  428. package/dist/cssm/components/Search/Search.d.ts +17 -0
  429. package/dist/cssm/components/Search/Search.js +45 -22
  430. package/dist/cssm/components/Search/Search.js.map +1 -1
  431. package/dist/cssm/components/SegmentedControl/SegmentedControl.css +1 -0
  432. package/dist/cssm/components/SegmentedControl/SegmentedControl.d.ts +17 -0
  433. package/dist/cssm/components/SegmentedControl/SegmentedControl.js +95 -0
  434. package/dist/cssm/components/SegmentedControl/SegmentedControl.js.map +1 -0
  435. package/dist/cssm/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.css +1 -0
  436. package/dist/cssm/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.d.ts +4 -0
  437. package/dist/cssm/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.js +41 -0
  438. package/dist/cssm/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.js.map +1 -0
  439. package/dist/cssm/components/Select/Select.d.ts +7 -0
  440. package/dist/cssm/components/SelectMimicry/SelectMimicry.d.ts +10 -0
  441. package/dist/cssm/components/Separator/Separator.d.ts +11 -0
  442. package/dist/cssm/components/SimpleCell/SimpleCell.d.ts +39 -0
  443. package/dist/cssm/components/SimpleCell/SimpleCell.js +21 -10
  444. package/dist/cssm/components/SimpleCell/SimpleCell.js.map +1 -1
  445. package/dist/cssm/components/SimpleCheckbox/SimpleCheckbox.d.ts +9 -0
  446. package/dist/cssm/components/Slider/Slider.d.ts +5 -0
  447. package/dist/cssm/components/SliderSwitch/SliderSwitch.d.ts +47 -0
  448. package/dist/cssm/components/SliderSwitch/SliderSwitch.js +14 -3
  449. package/dist/cssm/components/SliderSwitch/SliderSwitch.js.map +1 -1
  450. package/dist/cssm/components/SliderSwitch/SliderSwitchButton.d.ts +11 -0
  451. package/dist/cssm/components/SliderSwitch/SliderSwitchButton.js +5 -5
  452. package/dist/cssm/components/SliderSwitch/SliderSwitchButton.js.map +1 -1
  453. package/dist/cssm/components/Snackbar/Snackbar.d.ts +35 -0
  454. package/dist/cssm/components/Spacing/Spacing.d.ts +18 -0
  455. package/dist/cssm/components/Spinner/Spinner.d.ts +7 -0
  456. package/dist/cssm/components/SplitCol/SplitCol.d.ts +22 -0
  457. package/dist/cssm/components/SplitLayout/SplitLayout.d.ts +15 -0
  458. package/dist/cssm/components/SubnavigationBar/SubnavigationBar.d.ts +7 -0
  459. package/dist/cssm/components/SubnavigationButton/SubnavigationButton.d.ts +21 -0
  460. package/dist/cssm/components/SubnavigationButton/SubnavigationButton.js +1 -3
  461. package/dist/cssm/components/SubnavigationButton/SubnavigationButton.js.map +1 -1
  462. package/dist/cssm/components/Switch/Switch.css +1 -1
  463. package/dist/cssm/components/Switch/Switch.d.ts +7 -0
  464. package/dist/cssm/components/Switch/Switch.js +3 -6
  465. package/dist/cssm/components/Switch/Switch.js.map +1 -1
  466. package/dist/cssm/components/Tabbar/Tabbar.d.ts +11 -0
  467. package/dist/cssm/components/TabbarItem/TabbarItem.d.ts +21 -0
  468. package/dist/cssm/components/Tabs/Tabs.d.ts +10 -0
  469. package/dist/cssm/components/TabsItem/TabsItem.d.ts +8 -0
  470. package/dist/cssm/components/Tappable/Tappable.d.ts +40 -0
  471. package/dist/cssm/components/TextTooltip/TextTooltip.d.ts +14 -0
  472. package/dist/cssm/components/TextTooltip/TextTooltip.js +1 -2
  473. package/dist/cssm/components/TextTooltip/TextTooltip.js.map +1 -1
  474. package/dist/cssm/components/Textarea/Textarea.d.ts +11 -0
  475. package/dist/cssm/components/Tooltip/Tooltip.d.ts +55 -0
  476. package/dist/cssm/components/Tooltip/Tooltip.js +1 -2
  477. package/dist/cssm/components/Tooltip/Tooltip.js.map +1 -1
  478. package/dist/cssm/components/Tooltip/TooltipContainer.d.ts +5 -0
  479. package/dist/cssm/components/Touch/Touch.d.ts +49 -0
  480. package/dist/cssm/components/Touch/TouchContext.d.ts +7 -0
  481. package/dist/cssm/components/Typography/Caption/Caption.d.ts +10 -0
  482. package/dist/cssm/components/Typography/Headline/Headline.d.ts +8 -0
  483. package/dist/cssm/components/Typography/Subhead/Subhead.css +1 -1
  484. package/dist/cssm/components/Typography/Subhead/Subhead.d.ts +11 -0
  485. package/dist/cssm/components/Typography/Subhead/Subhead.js +13 -7
  486. package/dist/cssm/components/Typography/Subhead/Subhead.js.map +1 -1
  487. package/dist/cssm/components/Typography/Text/Text.d.ts +8 -0
  488. package/dist/cssm/components/Typography/Title/Title.css +1 -1
  489. package/dist/cssm/components/Typography/Title/Title.d.ts +12 -0
  490. package/dist/cssm/components/Typography/Title/Title.js +7 -16
  491. package/dist/cssm/components/Typography/Title/Title.js.map +1 -1
  492. package/dist/cssm/components/UsersStack/UsersStack.d.ts +23 -0
  493. package/dist/cssm/components/UsersStack/UsersStack.js +0 -1
  494. package/dist/cssm/components/UsersStack/UsersStack.js.map +1 -1
  495. package/dist/cssm/components/UsersStack/masks.d.ts +1 -0
  496. package/dist/cssm/components/View/View.d.ts +80 -0
  497. package/dist/cssm/components/View/ViewInfinite.d.ts +66 -0
  498. package/dist/cssm/components/View/utils.d.ts +2 -0
  499. package/dist/cssm/components/VisuallyHiddenInput/VisuallyHiddenInput.css +1 -0
  500. package/dist/cssm/components/VisuallyHiddenInput/VisuallyHiddenInput.d.ts +12 -0
  501. package/dist/cssm/components/VisuallyHiddenInput/VisuallyHiddenInput.js +24 -0
  502. package/dist/cssm/components/VisuallyHiddenInput/VisuallyHiddenInput.js.map +1 -0
  503. package/dist/cssm/components/WriteBar/WriteBar.d.ts +23 -0
  504. package/dist/cssm/components/WriteBarIcon/WriteBarIcon.d.ts +18 -0
  505. package/dist/cssm/helpers/avatar.d.ts +5 -0
  506. package/dist/cssm/helpers/getClassName.d.ts +2 -0
  507. package/dist/cssm/helpers/getScheme.d.ts +8 -0
  508. package/dist/cssm/helpers/math.d.ts +5 -0
  509. package/dist/cssm/helpers/scheme.d.ts +34 -0
  510. package/dist/cssm/hoc/withAdaptivity.d.ts +13 -0
  511. package/dist/cssm/hoc/withContext.d.ts +2 -0
  512. package/dist/cssm/hoc/withInsets.d.ts +3 -0
  513. package/dist/cssm/hoc/withPlatform.d.ts +3 -0
  514. package/dist/cssm/hooks/useAdaptivity.d.ts +3 -0
  515. package/dist/cssm/hooks/useAppearance.d.ts +1 -0
  516. package/dist/cssm/hooks/useAppearance.js +2 -2
  517. package/dist/cssm/hooks/useAppearance.js.map +1 -1
  518. package/dist/cssm/hooks/useBrowserInfo.d.ts +2 -0
  519. package/dist/cssm/hooks/useEffectDev.d.ts +2 -0
  520. package/dist/cssm/hooks/useEnsuredControl.d.ts +6 -0
  521. package/dist/cssm/hooks/useEventListener.d.ts +7 -0
  522. package/dist/cssm/hooks/useExternRef.d.ts +2 -0
  523. package/dist/cssm/hooks/useFocusVisible.d.ts +6 -0
  524. package/dist/cssm/hooks/useGlobalEventListener.d.ts +2 -0
  525. package/dist/cssm/hooks/useInsets.d.ts +8 -0
  526. package/dist/cssm/hooks/useKeyboard.d.ts +11 -0
  527. package/dist/cssm/hooks/useKeyboardInputTracker.d.ts +1 -0
  528. package/dist/cssm/hooks/useObjectMemo.d.ts +2 -0
  529. package/dist/cssm/hooks/usePatchChildrenRef.d.ts +6 -0
  530. package/dist/cssm/hooks/usePlatform.d.ts +2 -0
  531. package/dist/cssm/hooks/usePlatform.js.map +1 -1
  532. package/dist/cssm/hooks/useTimeout.d.ts +4 -0
  533. package/dist/cssm/hooks/useWaitTransitionFinish.d.ts +3 -0
  534. package/dist/cssm/index.d.ts +279 -0
  535. package/dist/cssm/index.js +6 -5
  536. package/dist/cssm/index.js.map +1 -1
  537. package/dist/cssm/lib/SSR.d.ts +14 -0
  538. package/dist/cssm/lib/accessibility.d.ts +10 -0
  539. package/dist/cssm/lib/animate.d.ts +15 -0
  540. package/dist/cssm/lib/browser.d.ts +11 -0
  541. package/dist/cssm/lib/callMultiple.d.ts +1 -0
  542. package/dist/cssm/lib/classNames.d.ts +6 -0
  543. package/dist/cssm/lib/classScopingMode.d.ts +8 -0
  544. package/dist/cssm/lib/dom.d.ts +21 -0
  545. package/dist/cssm/lib/fx.d.ts +5 -0
  546. package/dist/cssm/lib/getNavId.d.ts +6 -0
  547. package/dist/cssm/lib/is.d.ts +1 -0
  548. package/dist/cssm/lib/isRefObject.d.ts +2 -0
  549. package/dist/cssm/lib/jsxRuntime.d.ts +8 -0
  550. package/dist/cssm/lib/offset.d.ts +7 -0
  551. package/dist/cssm/lib/platform.d.ts +19 -0
  552. package/dist/cssm/lib/polyfills.d.ts +6 -0
  553. package/dist/cssm/lib/prefixClass.d.ts +1 -0
  554. package/dist/cssm/lib/removeObjectKeys.d.ts +1 -0
  555. package/dist/cssm/lib/select.d.ts +7 -0
  556. package/dist/cssm/lib/styles.d.ts +1 -0
  557. package/dist/cssm/lib/supportEvents.d.ts +9 -0
  558. package/dist/cssm/lib/taptic.d.ts +2 -0
  559. package/dist/cssm/lib/testing.d.ts +1 -0
  560. package/dist/cssm/lib/touch.d.ts +9 -0
  561. package/dist/cssm/lib/useIsomorphicLayoutEffect.d.ts +2 -0
  562. package/dist/cssm/lib/utils.d.ts +15 -0
  563. package/dist/cssm/lib/utils.js +3 -0
  564. package/dist/cssm/lib/utils.js.map +1 -1
  565. package/dist/cssm/lib/warnOnce.d.ts +1 -0
  566. package/dist/cssm/styles/components.css +10 -5
  567. package/dist/cssm/styles/themes.css +1 -1
  568. package/dist/cssm/tokenized/index.d.ts +14 -0
  569. package/dist/cssm/tokenized/index.js +6 -0
  570. package/dist/cssm/tokenized/index.js.map +1 -1
  571. package/dist/cssm/types.d.ts +34 -0
  572. package/dist/cssm/unstable/index.d.ts +17 -0
  573. package/dist/hooks/useAppearance.d.ts +1 -1
  574. package/dist/hooks/useAppearance.js +2 -2
  575. package/dist/hooks/useAppearance.js.map +1 -1
  576. package/dist/hooks/usePlatform.d.ts +1 -1
  577. package/dist/hooks/usePlatform.js.map +1 -1
  578. package/dist/index.d.ts +7 -5
  579. package/dist/index.js +6 -5
  580. package/dist/index.js.map +1 -1
  581. package/dist/lib/utils.d.ts +1 -0
  582. package/dist/lib/utils.js +3 -0
  583. package/dist/lib/utils.js.map +1 -1
  584. package/dist/tokenized/index.d.ts +12 -0
  585. package/dist/tokenized/index.js +6 -0
  586. package/dist/tokenized/index.js.map +1 -1
  587. package/dist/vkui.css +11 -6
  588. package/dist/vkui.css.map +1 -1
  589. package/package.json +4 -3
  590. package/src/components/ActionSheet/ActionSheetDropdownDesktop.tsx +4 -0
  591. package/src/components/ActionSheetItem/ActionSheetItem.tsx +27 -27
  592. package/src/components/Alert/Alert.tsx +5 -7
  593. package/src/components/AppRoot/AppRoot.tsx +0 -6
  594. package/src/components/AppRoot/AppRootPortal.tsx +9 -1
  595. package/src/components/AppearanceProvider/AppearanceProvider.tsx +30 -13
  596. package/src/components/AppearanceProvider/AppearanceProviderContext.tsx +4 -9
  597. package/src/components/Banner/Banner.tsx +2 -2
  598. package/src/components/Button/Button.tsx +9 -9
  599. package/src/components/Card/Card.css +41 -0
  600. package/src/components/Card/Card.tsx +2 -9
  601. package/src/components/CardScroll/CardScroll.css +2 -39
  602. package/src/components/CardScroll/CardScroll.tsx +7 -17
  603. package/src/components/CardScroll/Readme.md +3 -2
  604. package/src/components/Chip/Chip.tsx +1 -4
  605. package/src/components/ChipsInput/ChipsInput.tsx +1 -1
  606. package/src/components/ConfigProvider/ConfigProvider.tsx +31 -40
  607. package/src/components/ConfigProvider/ConfigProviderContext.tsx +14 -18
  608. package/src/components/ContentCard/ContentCard.tsx +2 -2
  609. package/src/components/CustomSelectOption/CustomSelectOption.css +1 -0
  610. package/src/components/FocusVisible/FocusVisible.css +4 -8
  611. package/src/components/FormItem/FormItem.tsx +1 -5
  612. package/src/components/FormItem/Readme.md +14 -2
  613. package/src/components/Gradient/Gradient.tsx +4 -12
  614. package/src/components/Gradient/Readme.md +1 -1
  615. package/src/components/Header/Header.tsx +3 -3
  616. package/src/components/HorizontalCell/HorizontalCell.tsx +1 -3
  617. package/src/components/HorizontalScroll/HorizontalScroll.tsx +1 -5
  618. package/src/components/HorizontalScroll/HorizontalScrollArrow.css +12 -5
  619. package/src/components/HorizontalScroll/HorizontalScrollArrow.tsx +1 -5
  620. package/src/components/InfoRow/InfoRow.tsx +1 -1
  621. package/src/components/ModalCardBase/ModalCardBase.tsx +2 -2
  622. package/src/components/ModalRoot/Readme.md +1 -1
  623. package/src/components/PanelHeaderButton/PanelHeaderButton.tsx +1 -5
  624. package/src/components/Placeholder/Placeholder.tsx +1 -1
  625. package/src/components/Removable/Removable.tsx +9 -7
  626. package/src/components/RichCell/RichCell.tsx +1 -5
  627. package/src/components/Search/Search.tsx +38 -14
  628. package/src/components/SegmentedControl/Readme.md +94 -0
  629. package/src/components/SegmentedControl/SegmentedControl.css +42 -0
  630. package/src/components/SegmentedControl/SegmentedControl.tsx +105 -0
  631. package/src/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.css +30 -0
  632. package/src/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.tsx +42 -0
  633. package/src/components/SimpleCell/SimpleCell.tsx +11 -11
  634. package/src/components/SliderSwitch/Readme.md +4 -0
  635. package/src/components/SliderSwitch/SliderSwitch.tsx +17 -3
  636. package/src/components/SliderSwitch/SliderSwitchButton.tsx +4 -4
  637. package/src/components/SubnavigationButton/SubnavigationButton.tsx +1 -1
  638. package/src/components/Switch/Switch.css +0 -12
  639. package/src/components/Switch/Switch.tsx +8 -10
  640. package/src/components/TextTooltip/TextTooltip.tsx +2 -6
  641. package/src/components/Tooltip/Tooltip.tsx +2 -6
  642. package/src/components/Typography/Subhead/Readme.md +18 -24
  643. package/src/components/Typography/Subhead/Subhead.css +22 -7
  644. package/src/components/Typography/Subhead/Subhead.tsx +23 -7
  645. package/src/components/Typography/Title/Readme.md +28 -41
  646. package/src/components/Typography/Title/Title.css +22 -13
  647. package/src/components/Typography/Title/Title.tsx +27 -22
  648. package/src/components/UsersStack/Readme.md +1 -1
  649. package/src/components/UsersStack/UsersStack.tsx +1 -1
  650. package/src/components/VisuallyHiddenInput/VisuallyHiddenInput.css +9 -0
  651. package/src/components/VisuallyHiddenInput/VisuallyHiddenInput.tsx +25 -0
  652. package/src/hooks/useAppearance.ts +2 -3
  653. package/src/hooks/usePlatform.ts +1 -1
  654. package/src/index.ts +11 -5
  655. package/src/lib/utils.ts +6 -0
  656. package/src/styles/components.css +3 -0
  657. package/src/tokenized/index.ts +22 -0
@@ -0,0 +1,8 @@
1
+ import * as React from "react";
2
+ import "./HorizontalScrollArrow.css";
3
+ export interface HorizontalScrollArrowProps {
4
+ onClick: () => void;
5
+ direction: "left" | "right";
6
+ }
7
+ declare const HorizontalScrollArrow: React.FC<HorizontalScrollArrowProps>;
8
+ export default HorizontalScrollArrow;
@@ -1,7 +1,5 @@
1
1
  import { createScopedElement } from "../../lib/jsxRuntime";
2
2
  import { Icon24Chevron } from "@vkontakte/icons";
3
- import { usePlatform } from "../../hooks/usePlatform";
4
- import { getClassName } from "../../helpers/getClassName";
5
3
  import { classNames } from "../../lib/classNames";
6
4
  import Tappable from "../Tappable/Tappable";
7
5
  import "./HorizontalScrollArrow.css";
@@ -9,12 +7,11 @@ import "./HorizontalScrollArrow.css";
9
7
  var HorizontalScrollArrow = function HorizontalScrollArrow(_ref) {
10
8
  var onClick = _ref.onClick,
11
9
  direction = _ref.direction;
12
- var platform = usePlatform();
13
10
  return createScopedElement(Tappable, {
14
11
  Component: "button",
15
12
  hasHover: false,
16
13
  hasActive: false,
17
- vkuiClass: classNames(getClassName("HorizontalScrollArrow", platform), "HorizontalScrollArrow--".concat(direction)),
14
+ vkuiClass: classNames("HorizontalScrollArrow", "HorizontalScrollArrow--".concat(direction)),
18
15
  onClick: onClick
19
16
  }, createScopedElement("span", {
20
17
  vkuiClass: "HorizontalScrollArrow__icon"
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/HorizontalScroll/HorizontalScrollArrow.tsx"],"names":["Icon24Chevron","usePlatform","getClassName","classNames","Tappable","HorizontalScrollArrow","onClick","direction","platform"],"mappings":";AACA,SAASA,aAAT,QAA8B,kBAA9B;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,SAASC,UAAT;AACA,OAAOC,QAAP;AACA;;AAOA,IAAMC,qBAA2D,GAAG,SAA9DA,qBAA8D,OAGlC;AAAA,MAFhCC,OAEgC,QAFhCA,OAEgC;AAAA,MADhCC,SACgC,QADhCA,SACgC;AAChC,MAAMC,QAAQ,GAAGP,WAAW,EAA5B;AAEA,SACE,oBAAC,QAAD;AACE,IAAA,SAAS,EAAC,QADZ;AAEE,IAAA,QAAQ,EAAE,KAFZ;AAGE,IAAA,SAAS,EAAE,KAHb;AAIE,IAAA,SAAS,EAAEE,UAAU,CACnBD,YAAY,CAAC,uBAAD,EAA0BM,QAA1B,CADO,mCAEOD,SAFP,EAJvB;AAQE,IAAA,OAAO,EAAED;AARX,KAUE;AAAM,IAAA,SAAS,EAAC;AAAhB,KACE,oBAAC,aAAD,OADF,CAVF,CADF;AAgBD,CAtBD,C,CAwBA;;;AACA,eAAeD,qBAAf","sourcesContent":["import * as React from \"react\";\nimport { Icon24Chevron } from \"@vkontakte/icons\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport Tappable from \"../Tappable/Tappable\";\nimport \"./HorizontalScrollArrow.css\";\n\nexport interface HorizontalScrollArrowProps {\n onClick: () => void;\n direction: \"left\" | \"right\";\n}\n\nconst HorizontalScrollArrow: React.FC<HorizontalScrollArrowProps> = ({\n onClick,\n direction,\n}: HorizontalScrollArrowProps) => {\n const platform = usePlatform();\n\n return (\n <Tappable\n Component=\"button\"\n hasHover={false}\n hasActive={false}\n vkuiClass={classNames(\n getClassName(\"HorizontalScrollArrow\", platform),\n `HorizontalScrollArrow--${direction}`\n )}\n onClick={onClick}\n >\n <span vkuiClass=\"HorizontalScrollArrow__icon\">\n <Icon24Chevron />\n </span>\n </Tappable>\n );\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default HorizontalScrollArrow;\n"],"file":"HorizontalScrollArrow.js"}
1
+ {"version":3,"sources":["../../../../src/components/HorizontalScroll/HorizontalScrollArrow.tsx"],"names":["Icon24Chevron","classNames","Tappable","HorizontalScrollArrow","onClick","direction"],"mappings":";AACA,SAASA,aAAT,QAA8B,kBAA9B;AACA,SAASC,UAAT;AACA,OAAOC,QAAP;AACA;;AAOA,IAAMC,qBAA2D,GAAG,SAA9DA,qBAA8D,OAGlC;AAAA,MAFhCC,OAEgC,QAFhCA,OAEgC;AAAA,MADhCC,SACgC,QADhCA,SACgC;AAChC,SACE,oBAAC,QAAD;AACE,IAAA,SAAS,EAAC,QADZ;AAEE,IAAA,QAAQ,EAAE,KAFZ;AAGE,IAAA,SAAS,EAAE,KAHb;AAIE,IAAA,SAAS,EAAEJ,UAAU,CACnB,uBADmB,mCAEOI,SAFP,EAJvB;AAQE,IAAA,OAAO,EAAED;AARX,KAUE;AAAM,IAAA,SAAS,EAAC;AAAhB,KACE,oBAAC,aAAD,OADF,CAVF,CADF;AAgBD,CApBD,C,CAsBA;;;AACA,eAAeD,qBAAf","sourcesContent":["import * as React from \"react\";\nimport { Icon24Chevron } from \"@vkontakte/icons\";\nimport { classNames } from \"../../lib/classNames\";\nimport Tappable from \"../Tappable/Tappable\";\nimport \"./HorizontalScrollArrow.css\";\n\nexport interface HorizontalScrollArrowProps {\n onClick: () => void;\n direction: \"left\" | \"right\";\n}\n\nconst HorizontalScrollArrow: React.FC<HorizontalScrollArrowProps> = ({\n onClick,\n direction,\n}: HorizontalScrollArrowProps) => {\n return (\n <Tappable\n Component=\"button\"\n hasHover={false}\n hasActive={false}\n vkuiClass={classNames(\n \"HorizontalScrollArrow\",\n `HorizontalScrollArrow--${direction}`\n )}\n onClick={onClick}\n >\n <span vkuiClass=\"HorizontalScrollArrow__icon\">\n <Icon24Chevron />\n </span>\n </Tappable>\n );\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default HorizontalScrollArrow;\n"],"file":"HorizontalScrollArrow.js"}
@@ -0,0 +1,29 @@
1
+ import * as React from "react";
2
+ import { PopperCommonProps } from "../Popper/Popper";
3
+ export interface HoverPopperProps extends PopperCommonProps {
4
+ /**
5
+ * Содержимое тултипа
6
+ */
7
+ content?: React.ReactNode;
8
+ /**
9
+ * Если передан, то тултип будет показан/скрыт в зависимости от значения свойства
10
+ */
11
+ shown?: boolean;
12
+ /**
13
+ * Вызывается при каждом изменении видимости тултипа
14
+ */
15
+ onShownChange?: (shown: boolean) => void;
16
+ /**
17
+ * Количество миллисекунд, после которых произойдет показ дропдауна
18
+ */
19
+ showDelay?: number;
20
+ /**
21
+ * Количество миллисекунд, после которых произойдет скрытие дропдауна
22
+ */
23
+ hideDelay?: number;
24
+ /**
25
+ * Либо jsx-элемент (div, button, etc.), либо компонент со свойством `getRootRef`, которое применяется к корневому элементу компонента
26
+ */
27
+ children?: React.ReactElement;
28
+ }
29
+ export declare const HoverPopper: React.FC<HoverPopperProps>;
@@ -0,0 +1,11 @@
1
+ import * as React from "react";
2
+ import { TappableProps } from "../Tappable/Tappable";
3
+ import "./IconButton.css";
4
+ export interface IconButtonProps extends TappableProps {
5
+ /**
6
+ * @deprecated будет удалено в 5.0.0. Используйте `children`
7
+ */
8
+ icon?: React.ReactNode;
9
+ }
10
+ declare const _default: React.FC<Pick<IconButtonProps, "max" | "required" | "high" | "low" | "disabled" | "default" | "start" | "open" | "media" | "hidden" | "cite" | "data" | "dir" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "async" | "defer" | "manifest" | "color" | "content" | "size" | "wrap" | "icon" | "multiple" | "height" | "translate" | "width" | "prefix" | "src" | "children" | "className" | "id" | "lang" | "method" | "min" | "name" | "target" | "type" | "role" | "tabIndex" | "crossOrigin" | "href" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDownCapture" | "onMouseEnter" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancelCapture" | "onTouchEndCapture" | "onTouchMoveCapture" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "list" | "classID" | "useMap" | "wmode" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "as" | "hrefLang" | "integrity" | "rel" | "sizes" | "charSet" | "kind" | "srcLang" | "value" | "download" | "alt" | "coords" | "shape" | "autoPlay" | "controls" | "loop" | "mediaGroup" | "muted" | "playsInline" | "preload" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "dateTime" | "acceptCharset" | "action" | "autoComplete" | "encType" | "noValidate" | "allowFullScreen" | "allowTransparency" | "frameBorder" | "marginHeight" | "marginWidth" | "sandbox" | "scrolling" | "seamless" | "srcDoc" | "srcSet" | "accept" | "capture" | "checked" | "maxLength" | "minLength" | "readOnly" | "step" | "htmlFor" | "httpEquiv" | "optimum" | "reversed" | "selected" | "nonce" | "scoped" | "cellPadding" | "cellSpacing" | "colSpan" | "headers" | "rowSpan" | "scope" | "cols" | "rows" | "poster" | "challenge" | "keyType" | "keyParams" | "onStart" | "onMove" | "onEnd" | "Component" | "getRootRef" | "stopPropagation" | "activeEffectDelay" | "hasHover" | "hoverMode" | "hasActive" | "activeMode" | "focusVisibleMode"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;
11
+ export default _default;
@@ -0,0 +1,7 @@
1
+ import * as React from "react";
2
+ import "./InfoRow.css";
3
+ export interface InfoRowProps extends React.HTMLAttributes<HTMLDivElement> {
4
+ header: React.ReactNode;
5
+ }
6
+ declare const InfoRow: React.FunctionComponent<InfoRowProps>;
7
+ export default InfoRow;
@@ -20,8 +20,7 @@ var InfoRow = function InfoRow(_ref) {
20
20
  weight: "regular"
21
21
  }), hasReactNode(header) && createScopedElement(Subhead, {
22
22
  Component: "span",
23
- vkuiClass: "InfoRow__header",
24
- weight: "regular"
23
+ vkuiClass: "InfoRow__header"
25
24
  }, header), children);
26
25
  }; // eslint-disable-next-line import/no-default-export
27
26
 
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/InfoRow/InfoRow.tsx"],"names":["Subhead","getClassName","usePlatform","Headline","hasReactNode","InfoRow","header","children","restProps","platform"],"mappings":";;;;AACA,OAAOA,OAAP;AACA,SAASC,YAAT;AACA,SAASC,WAAT;AACA,OAAOC,QAAP;AACA,SAASC,YAAT;AACA;;AAMA,IAAMC,OAA8C,GAAG,SAAjDA,OAAiD,OAInC;AAAA,MAHlBC,MAGkB,QAHlBA,MAGkB;AAAA,MAFlBC,QAEkB,QAFlBA,QAEkB;AAAA,MADfC,SACe;;AAClB,MAAMC,QAAQ,GAAGP,WAAW,EAA5B;AAEA,SACE,oBAAC,QAAD,eACMM,SADN;AAEE,IAAA,SAAS,EAAEP,YAAY,CAAC,SAAD,EAAYQ,QAAZ,CAFzB;AAGE,IAAA,MAAM,EAAC;AAHT,MAKGL,YAAY,CAACE,MAAD,CAAZ,IACC,oBAAC,OAAD;AAAS,IAAA,SAAS,EAAC,MAAnB;AAA0B,IAAA,SAAS,EAAC,iBAApC;AAAsD,IAAA,MAAM,EAAC;AAA7D,KACGA,MADH,CANJ,EAUGC,QAVH,CADF;AAcD,CArBD,C,CAuBA;;;AACA,eAAeF,OAAf","sourcesContent":["import * as React from \"react\";\nimport Subhead from \"../Typography/Subhead/Subhead\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport Headline from \"../Typography/Headline/Headline\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport \"./InfoRow.css\";\n\nexport interface InfoRowProps extends React.HTMLAttributes<HTMLDivElement> {\n header: React.ReactNode;\n}\n\nconst InfoRow: React.FunctionComponent<InfoRowProps> = ({\n header,\n children,\n ...restProps\n}: InfoRowProps) => {\n const platform = usePlatform();\n\n return (\n <Headline\n {...restProps}\n vkuiClass={getClassName(\"InfoRow\", platform)}\n weight=\"regular\"\n >\n {hasReactNode(header) && (\n <Subhead Component=\"span\" vkuiClass=\"InfoRow__header\" weight=\"regular\">\n {header}\n </Subhead>\n )}\n {children}\n </Headline>\n );\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default InfoRow;\n"],"file":"InfoRow.js"}
1
+ {"version":3,"sources":["../../../../src/components/InfoRow/InfoRow.tsx"],"names":["Subhead","getClassName","usePlatform","Headline","hasReactNode","InfoRow","header","children","restProps","platform"],"mappings":";;;;AACA,OAAOA,OAAP;AACA,SAASC,YAAT;AACA,SAASC,WAAT;AACA,OAAOC,QAAP;AACA,SAASC,YAAT;AACA;;AAMA,IAAMC,OAA8C,GAAG,SAAjDA,OAAiD,OAInC;AAAA,MAHlBC,MAGkB,QAHlBA,MAGkB;AAAA,MAFlBC,QAEkB,QAFlBA,QAEkB;AAAA,MADfC,SACe;;AAClB,MAAMC,QAAQ,GAAGP,WAAW,EAA5B;AAEA,SACE,oBAAC,QAAD,eACMM,SADN;AAEE,IAAA,SAAS,EAAEP,YAAY,CAAC,SAAD,EAAYQ,QAAZ,CAFzB;AAGE,IAAA,MAAM,EAAC;AAHT,MAKGL,YAAY,CAACE,MAAD,CAAZ,IACC,oBAAC,OAAD;AAAS,IAAA,SAAS,EAAC,MAAnB;AAA0B,IAAA,SAAS,EAAC;AAApC,KACGA,MADH,CANJ,EAUGC,QAVH,CADF;AAcD,CArBD,C,CAuBA;;;AACA,eAAeF,OAAf","sourcesContent":["import * as React from \"react\";\nimport Subhead from \"../Typography/Subhead/Subhead\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport Headline from \"../Typography/Headline/Headline\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport \"./InfoRow.css\";\n\nexport interface InfoRowProps extends React.HTMLAttributes<HTMLDivElement> {\n header: React.ReactNode;\n}\n\nconst InfoRow: React.FunctionComponent<InfoRowProps> = ({\n header,\n children,\n ...restProps\n}: InfoRowProps) => {\n const platform = usePlatform();\n\n return (\n <Headline\n {...restProps}\n vkuiClass={getClassName(\"InfoRow\", platform)}\n weight=\"regular\"\n >\n {hasReactNode(header) && (\n <Subhead Component=\"span\" vkuiClass=\"InfoRow__header\">\n {header}\n </Subhead>\n )}\n {children}\n </Headline>\n );\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default InfoRow;\n"],"file":"InfoRow.js"}
@@ -0,0 +1,32 @@
1
+ import * as React from "react";
2
+ import { HasRootRef } from "../../types";
3
+ import { AvatarProps } from "../Avatar/Avatar";
4
+ import "./InitialsAvatar.css";
5
+ /**
6
+ * Градиенты, которые можно использовать в алгоритме поиска градиентов по числовому идентификатору пользователя.
7
+ * @example user.id % 6 + 1
8
+ */
9
+ export declare type InitialsAvatarNumberGradients = 1 | 2 | 3 | 4 | 5 | 6;
10
+ export declare type InitialsAvatarTextGradients = "red" | "pink" | "orange" | "yellow" | "green" | "l-blue" | "blue" | "violet";
11
+ export interface InitialsAvatarProps extends React.HTMLAttributes<HTMLDivElement>, HasRootRef<HTMLDivElement>, Pick<AvatarProps, "size" | "shadow" | "badge"> {
12
+ children?: React.ReactNode;
13
+ /**
14
+ * `'red' | 'pink' | 'orange' | 'yellow' | 'green' | 'l-blue' | 'blue' | 'violet'`
15
+ *
16
+ * Если передано число, то оно будет сконвертировано в строчное представление цвета по следующей схеме:
17
+ *
18
+ * 1: 'red'
19
+ *
20
+ * 2: 'orange'
21
+ *
22
+ * 3: 'yellow'
23
+ *
24
+ * 4: 'green'
25
+ *
26
+ * 5: 'l-blue'
27
+ *
28
+ * 6: 'violet'
29
+ */
30
+ gradientColor?: InitialsAvatarNumberGradients | InitialsAvatarTextGradients;
31
+ }
32
+ export declare const InitialsAvatar: React.FC<InitialsAvatarProps>;
@@ -0,0 +1,9 @@
1
+ import * as React from "react";
2
+ import { FormFieldProps } from "../FormField/FormField";
3
+ import { HasAlign, HasRef, HasRootRef } from "../../types";
4
+ import { AdaptivityProps } from "../../hoc/withAdaptivity";
5
+ import "./Input.css";
6
+ export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement>, HasRef<HTMLInputElement>, HasRootRef<HTMLDivElement>, HasAlign, AdaptivityProps, FormFieldProps {
7
+ }
8
+ declare const _default: React.FC<Pick<InputProps, "max" | "required" | "disabled" | "hidden" | "dir" | "form" | "slot" | "style" | "title" | "pattern" | "color" | "size" | "after" | "multiple" | "height" | "translate" | "width" | "prefix" | "src" | "children" | "className" | "id" | "lang" | "min" | "name" | "type" | "role" | "tabIndex" | "crossOrigin" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "list" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "value" | "alt" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "autoComplete" | "accept" | "capture" | "checked" | "maxLength" | "minLength" | "readOnly" | "step" | "align" | "getRootRef" | "getRef"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;
9
+ export default _default;
@@ -0,0 +1,6 @@
1
+ import * as React from "react";
2
+ import { TappableProps } from "../Tappable/Tappable";
3
+ import "./Link.css";
4
+ export declare type LinkProps = TappableProps;
5
+ declare const Link: React.FC<LinkProps>;
6
+ export default Link;
@@ -0,0 +1,4 @@
1
+ import * as React from "react";
2
+ import "./List.css";
3
+ declare const List: React.FunctionComponent<React.HTMLAttributes<HTMLDivElement>>;
4
+ export default List;
@@ -0,0 +1,4 @@
1
+ import * as React from "react";
2
+ export declare const ListContext: React.Context<{
3
+ toggleDrag: (value: boolean) => void;
4
+ }>;
@@ -0,0 +1,39 @@
1
+ import * as React from "react";
2
+ import "./MiniInfoCell.css";
3
+ export interface MiniInfoCellProps extends React.HTMLAttributes<HTMLDivElement> {
4
+ /**
5
+ * Иконка слева.<br />
6
+ * Рекомендуется использовать иконки размера 20.
7
+ */
8
+ before: React.ReactNode;
9
+ /**
10
+ * Содержимое справа.<br />
11
+ * `<UsersStack size="s" />` или `<Avatar size={24} />`
12
+ */
13
+ after?: React.ReactNode;
14
+ /**
15
+ * Тип ячейки:
16
+ *
17
+ * - `base` – базовая ячейка с серой иконкой и серым текстом.<br />
18
+ * В компонент можно передать `Link`, чтобы визуально сделать часть текста ссылкой.
19
+ * - `add` – тип ячейки, который показывает, что взаимодействие с ней должно вызывать действие добавления чего-то.
20
+ * - `more` – взаимодействие с такой ячейкой должно открывать какую-то подробную информацию.
21
+ */
22
+ mode?: "base" | "add" | "more";
23
+ /**
24
+ * Тип отображения текста:
25
+ *
26
+ * - `nowrap` – в одну строку, текст не переносится и обрезается.
27
+ * - `short` – максимально отображается 3 строки, остальное обрезается.
28
+ * - `full` – текст отображается полностью.
29
+ */
30
+ textWrap?: "nowrap" | "short" | "full";
31
+ /**
32
+ * Стиль текста:
33
+ *
34
+ * - `primary` – используйте этот стиль, если хотите выделить информацию в общем списке.<br />Пример использования: подробная информация на странице сообщества
35
+ * - `secondary` – стиль по-умолчанию.
36
+ */
37
+ textLevel?: "primary" | "secondary";
38
+ }
39
+ export declare const MiniInfoCell: React.FC<MiniInfoCellProps>;
@@ -0,0 +1,10 @@
1
+ import * as React from "react";
2
+ import { HasPlatform } from "../../types";
3
+ import { NavIdProps } from "../../lib/getNavId";
4
+ import { ModalCardBaseProps } from "../ModalCardBase/ModalCardBase";
5
+ import { AdaptivityContextInterface, AdaptivityProps } from "../AdaptivityProvider/AdaptivityContext";
6
+ import "./ModalCard.css";
7
+ export interface ModalCardProps extends HasPlatform, AdaptivityProps, NavIdProps, ModalCardBaseProps {
8
+ }
9
+ declare const _default: React.FC<Pick<Pick<ModalCardProps & AdaptivityContextInterface, "hidden" | "dir" | "header" | "nav" | "slot" | "style" | "title" | "color" | "icon" | "translate" | "prefix" | "children" | "className" | "id" | "lang" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "getRootRef" | "viewWidth" | "viewHeight" | "hasMouse" | "deviceHasHover" | "sizeX" | "sizeY" | "onClose" | "actionsLayout" | "actions" | "subheader">, "hidden" | "dir" | "header" | "nav" | "slot" | "style" | "title" | "color" | "icon" | "translate" | "prefix" | "children" | "className" | "id" | "lang" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "getRootRef" | "onClose" | "actionsLayout" | "actions" | "subheader"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;
10
+ export default _default;
@@ -0,0 +1,32 @@
1
+ import * as React from "react";
2
+ import { HasRootRef } from "../../types";
3
+ import { AdaptivityContextInterface } from "../AdaptivityProvider/AdaptivityContext";
4
+ import "./ModalCardBase.css";
5
+ export interface ModalCardBaseProps extends React.HTMLAttributes<HTMLDivElement>, HasRootRef<HTMLDivElement> {
6
+ /**
7
+ * Иконка.
8
+ *
9
+ * Может быть компонентом иконки, например, `<Icon56MoneyTransferOutline />`, или `<Avatar size={72} src="" />`
10
+ */
11
+ icon?: React.ReactNode;
12
+ /**
13
+ * Заголовок карточки
14
+ */
15
+ header?: React.ReactNode;
16
+ /**
17
+ * Подзаголовок
18
+ */
19
+ subheader?: React.ReactNode;
20
+ /**
21
+ * Кнопки-действия.
22
+ *
23
+ * Рекомендуется использовать `<Button size="l" mode="primary" />` или `<Button size="l" mode="secondary" />`
24
+ */
25
+ actions?: React.ReactNode;
26
+ /**
27
+ * Тип отображения кнопок: вертикальный или горизонтальный
28
+ */
29
+ actionsLayout?: "vertical" | "horizontal";
30
+ onClose?: VoidFunction;
31
+ }
32
+ export declare const ModalCardBase: React.FC<Pick<ModalCardBaseProps & AdaptivityContextInterface, "hidden" | "dir" | "header" | "slot" | "style" | "title" | "color" | "icon" | "translate" | "prefix" | "children" | "className" | "id" | "lang" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "getRootRef" | "onClose" | "actionsLayout" | "actions" | "subheader"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;
@@ -10,7 +10,7 @@ import { getClassName } from "../../helpers/getClassName";
10
10
  import { usePlatform } from "../../hooks/usePlatform";
11
11
  import { ViewHeight, ViewWidth, withAdaptivity } from "../../hoc/withAdaptivity";
12
12
  import { PanelHeaderButton } from "../PanelHeaderButton/PanelHeaderButton";
13
- import { IOS } from "../../lib/platform";
13
+ import { ANDROID, IOS } from "../../lib/platform";
14
14
  import ModalDismissButton from "../ModalDismissButton/ModalDismissButton";
15
15
  import { Icon24Dismiss } from "@vkontakte/icons";
16
16
  import { useKeyboard } from "../../hooks/useKeyboard";
@@ -47,7 +47,7 @@ export var ModalCardBase = withAdaptivity(function (_ref) {
47
47
  vkuiClass: "ModalCardBase__icon"
48
48
  }, icon), hasReactNode(header) && createScopedElement(Title, {
49
49
  level: "2",
50
- weight: "semibold",
50
+ weight: platform === ANDROID ? "2" : "1",
51
51
  vkuiClass: "ModalCardBase__header"
52
52
  }, header), hasReactNode(subheader) && createScopedElement(Headline, {
53
53
  weight: "regular",
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/ModalCardBase/ModalCardBase.tsx"],"names":["hasReactNode","Title","Headline","classNames","getClassName","usePlatform","ViewHeight","ViewWidth","withAdaptivity","PanelHeaderButton","IOS","ModalDismissButton","Icon24Dismiss","useKeyboard","ModalCardBase","getRootRef","icon","header","subheader","children","actions","actionsLayout","viewWidth","hasMouse","viewHeight","onClose","restProps","platform","isDesktop","SMALL_TABLET","MEDIUM","isSoftwareKeyboardOpened","isOpened","canShowCloseBtn","canShowCloseBtnIos"],"mappings":";;;;AACA,SAASA,YAAT;AACA,OAAOC,KAAP;AACA,OAAOC,QAAP;AACA,SAASC,UAAT;AACA,SAASC,YAAT;AACA,SAASC,WAAT;AACA,SACEC,UADF,EAEEC,SAFF,EAGEC,cAHF;AAMA,SAASC,iBAAT;AACA,SAASC,GAAT;AACA,OAAOC,kBAAP;AACA,SAASC,aAAT,QAA8B,kBAA9B;AACA,SAASC,WAAT;AAEA;AAoCA,OAAO,IAAMC,aAAa,GAAGN,cAAc,CAGzC,gBAaM;AAAA,MAZJO,UAYI,QAZJA,UAYI;AAAA,MAXJC,IAWI,QAXJA,IAWI;AAAA,MAVJC,MAUI,QAVJA,MAUI;AAAA,MATJC,SASI,QATJA,SASI;AAAA,MARJC,QAQI,QARJA,QAQI;AAAA,MAPJC,OAOI,QAPJA,OAOI;AAAA,MANJC,aAMI,QANJA,aAMI;AAAA,MALJC,SAKI,QALJA,SAKI;AAAA,MAJJC,QAII,QAJJA,QAII;AAAA,MAHJC,UAGI,QAHJA,UAGI;AAAA,MAFJC,OAEI,QAFJA,OAEI;AAAA,MADDC,SACC;;AACJ,MAAMC,QAAQ,GAAGtB,WAAW,EAA5B;AACA,MAAMuB,SAAS,GACbN,SAAS,IAAIf,SAAS,CAACsB,YAAvB,KACCN,QAAQ,IAAIC,UAAU,IAAIlB,UAAU,CAACwB,MADtC,CADF;AAGA,MAAMC,wBAAwB,GAAGlB,WAAW,GAAGmB,QAA/C;AAEA,MAAMC,eAAe,GAAGX,SAAS,IAAIf,SAAS,CAACsB,YAA/C;AACA,MAAMK,kBAAkB,GAAGP,QAAQ,KAAKjB,GAAb,IAAoB,CAACuB,eAAhD;AAEA,SACE,wCACMP,SADN;AAEE,IAAA,SAAS,EAAEvB,UAAU,CAACC,YAAY,CAAC,eAAD,EAAkBuB,QAAlB,CAAb,EAA0C;AAC7D,gCAA0BC;AADmC,KAA1C,CAFvB;AAKE,IAAA,GAAG,EAAEb;AALP,MAOE;AACE,IAAA,SAAS,EAAEZ,UAAU,CAAC,0BAAD,EAA6B;AAChD,0DACE4B;AAF8C,KAA7B;AADvB,KAMG/B,YAAY,CAACgB,IAAD,CAAZ,IACC;AAAK,IAAA,SAAS,EAAC;AAAf,KAAsCA,IAAtC,CAPJ,EASGhB,YAAY,CAACiB,MAAD,CAAZ,IACC,oBAAC,KAAD;AACE,IAAA,KAAK,EAAC,GADR;AAEE,IAAA,MAAM,EAAC,UAFT;AAGE,IAAA,SAAS,EAAC;AAHZ,KAKGA,MALH,CAVJ,EAkBGjB,YAAY,CAACkB,SAAD,CAAZ,IACC,oBAAC,QAAD;AAAU,IAAA,MAAM,EAAC,SAAjB;AAA2B,IAAA,SAAS,EAAC;AAArC,KACGA,SADH,CAnBJ,EAwBGC,QAxBH,EA0BGnB,YAAY,CAACoB,OAAD,CAAZ,IACC;AACE,IAAA,SAAS,EAAEjB,UAAU,CAAC,wBAAD,EAA2B;AAC9C,mCAA6BkB,aAAa,KAAK;AADD,KAA3B;AADvB,KAKGD,OALH,CA3BJ,EAoCGa,eAAe,IAAI,oBAAC,kBAAD;AAAoB,IAAA,OAAO,EAAER;AAA7B,IApCtB,EAqCGS,kBAAkB,IACjB,oBAAC,iBAAD;AAAmB,IAAA,SAAS,EAAC,oBAA7B;AAAkD,IAAA,OAAO,EAAET;AAA3D,KACE,oBAAC,aAAD,OADF,CAtCJ,CAPF,CADF;AAqDD,CA/EwC,EAgFzC;AACEH,EAAAA,SAAS,EAAE,IADb;AAEEE,EAAAA,UAAU,EAAE,IAFd;AAGED,EAAAA,QAAQ,EAAE;AAHZ,CAhFyC,CAApC","sourcesContent":["import * as React from \"react\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport Title from \"../Typography/Title/Title\";\nimport Headline from \"../Typography/Headline/Headline\";\nimport { classNames } from \"../../lib/classNames\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport {\n ViewHeight,\n ViewWidth,\n withAdaptivity,\n} from \"../../hoc/withAdaptivity\";\nimport { HasRootRef } from \"../../types\";\nimport { PanelHeaderButton } from \"../PanelHeaderButton/PanelHeaderButton\";\nimport { IOS } from \"../../lib/platform\";\nimport ModalDismissButton from \"../ModalDismissButton/ModalDismissButton\";\nimport { Icon24Dismiss } from \"@vkontakte/icons\";\nimport { useKeyboard } from \"../../hooks/useKeyboard\";\nimport { AdaptivityContextInterface } from \"../AdaptivityProvider/AdaptivityContext\";\nimport \"./ModalCardBase.css\";\n\nexport interface ModalCardBaseProps\n extends React.HTMLAttributes<HTMLDivElement>,\n HasRootRef<HTMLDivElement> {\n /**\n * Иконка.\n *\n * Может быть компонентом иконки, например, `<Icon56MoneyTransferOutline />`, или `<Avatar size={72} src=\"\" />`\n */\n icon?: React.ReactNode;\n\n /**\n * Заголовок карточки\n */\n header?: React.ReactNode;\n\n /**\n * Подзаголовок\n */\n subheader?: React.ReactNode;\n\n /**\n * Кнопки-действия.\n *\n * Рекомендуется использовать `<Button size=\"l\" mode=\"primary\" />` или `<Button size=\"l\" mode=\"secondary\" />`\n */\n actions?: React.ReactNode;\n\n /**\n * Тип отображения кнопок: вертикальный или горизонтальный\n */\n actionsLayout?: \"vertical\" | \"horizontal\";\n onClose?: VoidFunction;\n}\n\nexport const ModalCardBase = withAdaptivity<\n ModalCardBaseProps & AdaptivityContextInterface\n>(\n ({\n getRootRef,\n icon,\n header,\n subheader,\n children,\n actions,\n actionsLayout,\n viewWidth,\n hasMouse,\n viewHeight,\n onClose,\n ...restProps\n }) => {\n const platform = usePlatform();\n const isDesktop =\n viewWidth >= ViewWidth.SMALL_TABLET &&\n (hasMouse || viewHeight >= ViewHeight.MEDIUM);\n const isSoftwareKeyboardOpened = useKeyboard().isOpened;\n\n const canShowCloseBtn = viewWidth >= ViewWidth.SMALL_TABLET;\n const canShowCloseBtnIos = platform === IOS && !canShowCloseBtn;\n\n return (\n <div\n {...restProps}\n vkuiClass={classNames(getClassName(\"ModalCardBase\", platform), {\n \"ModalCardBase--desktop\": isDesktop,\n })}\n ref={getRootRef}\n >\n <div\n vkuiClass={classNames(\"ModalCardBase__container\", {\n \"ModalCardBase__container--softwareKeyboardOpened\":\n isSoftwareKeyboardOpened,\n })}\n >\n {hasReactNode(icon) && (\n <div vkuiClass=\"ModalCardBase__icon\">{icon}</div>\n )}\n {hasReactNode(header) && (\n <Title\n level=\"2\"\n weight=\"semibold\"\n vkuiClass=\"ModalCardBase__header\"\n >\n {header}\n </Title>\n )}\n {hasReactNode(subheader) && (\n <Headline weight=\"regular\" vkuiClass=\"ModalCardBase__subheader\">\n {subheader}\n </Headline>\n )}\n\n {children}\n\n {hasReactNode(actions) && (\n <div\n vkuiClass={classNames(\"ModalCardBase__actions\", {\n \"ModalCardBase__actions--v\": actionsLayout === \"vertical\",\n })}\n >\n {actions}\n </div>\n )}\n\n {canShowCloseBtn && <ModalDismissButton onClick={onClose} />}\n {canShowCloseBtnIos && (\n <PanelHeaderButton vkuiClass=\"ModalCard__dismiss\" onClick={onClose}>\n <Icon24Dismiss />\n </PanelHeaderButton>\n )}\n </div>\n </div>\n );\n },\n {\n viewWidth: true,\n viewHeight: true,\n hasMouse: true,\n }\n);\n"],"file":"ModalCardBase.js"}
1
+ {"version":3,"sources":["../../../../src/components/ModalCardBase/ModalCardBase.tsx"],"names":["hasReactNode","Title","Headline","classNames","getClassName","usePlatform","ViewHeight","ViewWidth","withAdaptivity","PanelHeaderButton","ANDROID","IOS","ModalDismissButton","Icon24Dismiss","useKeyboard","ModalCardBase","getRootRef","icon","header","subheader","children","actions","actionsLayout","viewWidth","hasMouse","viewHeight","onClose","restProps","platform","isDesktop","SMALL_TABLET","MEDIUM","isSoftwareKeyboardOpened","isOpened","canShowCloseBtn","canShowCloseBtnIos"],"mappings":";;;;AACA,SAASA,YAAT;AACA,OAAOC,KAAP;AACA,OAAOC,QAAP;AACA,SAASC,UAAT;AACA,SAASC,YAAT;AACA,SAASC,WAAT;AACA,SACEC,UADF,EAEEC,SAFF,EAGEC,cAHF;AAMA,SAASC,iBAAT;AACA,SAASC,OAAT,EAAkBC,GAAlB;AACA,OAAOC,kBAAP;AACA,SAASC,aAAT,QAA8B,kBAA9B;AACA,SAASC,WAAT;AAEA;AAoCA,OAAO,IAAMC,aAAa,GAAGP,cAAc,CAGzC,gBAaM;AAAA,MAZJQ,UAYI,QAZJA,UAYI;AAAA,MAXJC,IAWI,QAXJA,IAWI;AAAA,MAVJC,MAUI,QAVJA,MAUI;AAAA,MATJC,SASI,QATJA,SASI;AAAA,MARJC,QAQI,QARJA,QAQI;AAAA,MAPJC,OAOI,QAPJA,OAOI;AAAA,MANJC,aAMI,QANJA,aAMI;AAAA,MALJC,SAKI,QALJA,SAKI;AAAA,MAJJC,QAII,QAJJA,QAII;AAAA,MAHJC,UAGI,QAHJA,UAGI;AAAA,MAFJC,OAEI,QAFJA,OAEI;AAAA,MADDC,SACC;;AACJ,MAAMC,QAAQ,GAAGvB,WAAW,EAA5B;AACA,MAAMwB,SAAS,GACbN,SAAS,IAAIhB,SAAS,CAACuB,YAAvB,KACCN,QAAQ,IAAIC,UAAU,IAAInB,UAAU,CAACyB,MADtC,CADF;AAGA,MAAMC,wBAAwB,GAAGlB,WAAW,GAAGmB,QAA/C;AAEA,MAAMC,eAAe,GAAGX,SAAS,IAAIhB,SAAS,CAACuB,YAA/C;AACA,MAAMK,kBAAkB,GAAGP,QAAQ,KAAKjB,GAAb,IAAoB,CAACuB,eAAhD;AAEA,SACE,wCACMP,SADN;AAEE,IAAA,SAAS,EAAExB,UAAU,CAACC,YAAY,CAAC,eAAD,EAAkBwB,QAAlB,CAAb,EAA0C;AAC7D,gCAA0BC;AADmC,KAA1C,CAFvB;AAKE,IAAA,GAAG,EAAEb;AALP,MAOE;AACE,IAAA,SAAS,EAAEb,UAAU,CAAC,0BAAD,EAA6B;AAChD,0DACE6B;AAF8C,KAA7B;AADvB,KAMGhC,YAAY,CAACiB,IAAD,CAAZ,IACC;AAAK,IAAA,SAAS,EAAC;AAAf,KAAsCA,IAAtC,CAPJ,EASGjB,YAAY,CAACkB,MAAD,CAAZ,IACC,oBAAC,KAAD;AACE,IAAA,KAAK,EAAC,GADR;AAEE,IAAA,MAAM,EAAEU,QAAQ,KAAKlB,OAAb,GAAuB,GAAvB,GAA6B,GAFvC;AAGE,IAAA,SAAS,EAAC;AAHZ,KAKGQ,MALH,CAVJ,EAkBGlB,YAAY,CAACmB,SAAD,CAAZ,IACC,oBAAC,QAAD;AAAU,IAAA,MAAM,EAAC,SAAjB;AAA2B,IAAA,SAAS,EAAC;AAArC,KACGA,SADH,CAnBJ,EAwBGC,QAxBH,EA0BGpB,YAAY,CAACqB,OAAD,CAAZ,IACC;AACE,IAAA,SAAS,EAAElB,UAAU,CAAC,wBAAD,EAA2B;AAC9C,mCAA6BmB,aAAa,KAAK;AADD,KAA3B;AADvB,KAKGD,OALH,CA3BJ,EAoCGa,eAAe,IAAI,oBAAC,kBAAD;AAAoB,IAAA,OAAO,EAAER;AAA7B,IApCtB,EAqCGS,kBAAkB,IACjB,oBAAC,iBAAD;AAAmB,IAAA,SAAS,EAAC,oBAA7B;AAAkD,IAAA,OAAO,EAAET;AAA3D,KACE,oBAAC,aAAD,OADF,CAtCJ,CAPF,CADF;AAqDD,CA/EwC,EAgFzC;AACEH,EAAAA,SAAS,EAAE,IADb;AAEEE,EAAAA,UAAU,EAAE,IAFd;AAGED,EAAAA,QAAQ,EAAE;AAHZ,CAhFyC,CAApC","sourcesContent":["import * as React from \"react\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport Title from \"../Typography/Title/Title\";\nimport Headline from \"../Typography/Headline/Headline\";\nimport { classNames } from \"../../lib/classNames\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport {\n ViewHeight,\n ViewWidth,\n withAdaptivity,\n} from \"../../hoc/withAdaptivity\";\nimport { HasRootRef } from \"../../types\";\nimport { PanelHeaderButton } from \"../PanelHeaderButton/PanelHeaderButton\";\nimport { ANDROID, IOS } from \"../../lib/platform\";\nimport ModalDismissButton from \"../ModalDismissButton/ModalDismissButton\";\nimport { Icon24Dismiss } from \"@vkontakte/icons\";\nimport { useKeyboard } from \"../../hooks/useKeyboard\";\nimport { AdaptivityContextInterface } from \"../AdaptivityProvider/AdaptivityContext\";\nimport \"./ModalCardBase.css\";\n\nexport interface ModalCardBaseProps\n extends React.HTMLAttributes<HTMLDivElement>,\n HasRootRef<HTMLDivElement> {\n /**\n * Иконка.\n *\n * Может быть компонентом иконки, например, `<Icon56MoneyTransferOutline />`, или `<Avatar size={72} src=\"\" />`\n */\n icon?: React.ReactNode;\n\n /**\n * Заголовок карточки\n */\n header?: React.ReactNode;\n\n /**\n * Подзаголовок\n */\n subheader?: React.ReactNode;\n\n /**\n * Кнопки-действия.\n *\n * Рекомендуется использовать `<Button size=\"l\" mode=\"primary\" />` или `<Button size=\"l\" mode=\"secondary\" />`\n */\n actions?: React.ReactNode;\n\n /**\n * Тип отображения кнопок: вертикальный или горизонтальный\n */\n actionsLayout?: \"vertical\" | \"horizontal\";\n onClose?: VoidFunction;\n}\n\nexport const ModalCardBase = withAdaptivity<\n ModalCardBaseProps & AdaptivityContextInterface\n>(\n ({\n getRootRef,\n icon,\n header,\n subheader,\n children,\n actions,\n actionsLayout,\n viewWidth,\n hasMouse,\n viewHeight,\n onClose,\n ...restProps\n }) => {\n const platform = usePlatform();\n const isDesktop =\n viewWidth >= ViewWidth.SMALL_TABLET &&\n (hasMouse || viewHeight >= ViewHeight.MEDIUM);\n const isSoftwareKeyboardOpened = useKeyboard().isOpened;\n\n const canShowCloseBtn = viewWidth >= ViewWidth.SMALL_TABLET;\n const canShowCloseBtnIos = platform === IOS && !canShowCloseBtn;\n\n return (\n <div\n {...restProps}\n vkuiClass={classNames(getClassName(\"ModalCardBase\", platform), {\n \"ModalCardBase--desktop\": isDesktop,\n })}\n ref={getRootRef}\n >\n <div\n vkuiClass={classNames(\"ModalCardBase__container\", {\n \"ModalCardBase__container--softwareKeyboardOpened\":\n isSoftwareKeyboardOpened,\n })}\n >\n {hasReactNode(icon) && (\n <div vkuiClass=\"ModalCardBase__icon\">{icon}</div>\n )}\n {hasReactNode(header) && (\n <Title\n level=\"2\"\n weight={platform === ANDROID ? \"2\" : \"1\"}\n vkuiClass=\"ModalCardBase__header\"\n >\n {header}\n </Title>\n )}\n {hasReactNode(subheader) && (\n <Headline weight=\"regular\" vkuiClass=\"ModalCardBase__subheader\">\n {subheader}\n </Headline>\n )}\n\n {children}\n\n {hasReactNode(actions) && (\n <div\n vkuiClass={classNames(\"ModalCardBase__actions\", {\n \"ModalCardBase__actions--v\": actionsLayout === \"vertical\",\n })}\n >\n {actions}\n </div>\n )}\n\n {canShowCloseBtn && <ModalDismissButton onClick={onClose} />}\n {canShowCloseBtnIos && (\n <PanelHeaderButton vkuiClass=\"ModalCard__dismiss\" onClick={onClose}>\n <Icon24Dismiss />\n </PanelHeaderButton>\n )}\n </div>\n </div>\n );\n },\n {\n viewWidth: true,\n viewHeight: true,\n hasMouse: true,\n }\n);\n"],"file":"ModalCardBase.js"}
@@ -0,0 +1,5 @@
1
+ import * as React from "react";
2
+ import "./ModalDismissButton.css";
3
+ export declare type ModalDismissButtonProps = React.HTMLAttributes<HTMLButtonElement>;
4
+ declare const ModalDismissButton: React.FC<ModalDismissButtonProps>;
5
+ export default ModalDismissButton;
@@ -0,0 +1,22 @@
1
+ import * as React from "react";
2
+ import { AdaptivityContextInterface, AdaptivityProps } from "../AdaptivityProvider/AdaptivityContext";
3
+ import { NavIdProps } from "../../lib/getNavId";
4
+ import "./ModalPage.css";
5
+ export interface ModalPageProps extends React.HTMLAttributes<HTMLDivElement>, AdaptivityProps, NavIdProps {
6
+ /**
7
+ * Шапка модальной страницы, `<ModalPageHeader />`
8
+ */
9
+ header?: React.ReactNode;
10
+ onClose?: VoidFunction;
11
+ /**
12
+ * Процент, на который изначально будет открыта модальная страница. При `settlingHeight={100}` модальная страница раскрывается на всю высоту.
13
+ */
14
+ settlingHeight?: number;
15
+ /**
16
+ * Если высота контента в модальной странице может поменяться, нужно установить это свойство
17
+ */
18
+ dynamicContentHeight?: boolean;
19
+ getModalContentRef?: React.Ref<HTMLDivElement>;
20
+ }
21
+ declare const _default: React.FC<Pick<ModalPageProps & AdaptivityContextInterface, "hidden" | "dir" | "header" | "nav" | "slot" | "style" | "title" | "color" | "translate" | "prefix" | "children" | "className" | "id" | "lang" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "onClose" | "settlingHeight" | "dynamicContentHeight" | "getModalContentRef"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;
22
+ export default _default;
@@ -0,0 +1,8 @@
1
+ import * as React from "react";
2
+ import { HasRef } from "../../types";
3
+ import { PanelHeaderProps } from "../PanelHeader/PanelHeader";
4
+ import "./ModalPageHeader.css";
5
+ export interface ModalPageHeaderProps extends React.HTMLAttributes<HTMLDivElement>, Omit<PanelHeaderProps, "fixed" | "shadow">, HasRef<HTMLDivElement> {
6
+ }
7
+ declare const ModalPageHeader: React.FunctionComponent<ModalPageHeaderProps>;
8
+ export default ModalPageHeader;
@@ -0,0 +1,16 @@
1
+ import * as React from "react";
2
+ import { HasPlatform } from "../../types";
3
+ import { ConfigProviderContextInterface } from "../ConfigProvider/ConfigProviderContext";
4
+ import "./ModalRoot.css";
5
+ export interface ModalRootProps extends HasPlatform {
6
+ activeModal?: string | null;
7
+ /**
8
+ * Будет вызвано при закрытии активной модалки с её id
9
+ */
10
+ onClose?(modalId: string): void;
11
+ /**
12
+ * @ignore
13
+ */
14
+ configProvider?: ConfigProviderContextInterface;
15
+ }
16
+ export declare const ModalRootTouch: React.FC<Pick<ModalRootProps, "configProvider" | "onClose" | "activeModal">>;
@@ -0,0 +1,10 @@
1
+ import * as React from "react";
2
+ import { AdaptivityContextInterface, AdaptivityProps } from "../AdaptivityProvider/AdaptivityContext";
3
+ export interface ModalRootProps extends AdaptivityProps {
4
+ activeModal?: string | null;
5
+ /**
6
+ * Будет вызвано при закрытии активной модалки с её id
7
+ */
8
+ onClose?: (modalId: string) => void;
9
+ }
10
+ export declare const ModalRoot: React.FC<Pick<ModalRootProps & AdaptivityContextInterface, "onClose" | "activeModal"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;
@@ -0,0 +1,20 @@
1
+ import * as React from "react";
2
+ import { ModalElements, ModalsStateEntry, ModalType } from "./types";
3
+ export declare type ModalRegistryEntry = ModalElements & Required<Pick<ModalsStateEntry, "type" | "id">>;
4
+ declare type ModalRefs = {
5
+ [k in keyof ModalElements]: (e: ModalElements[k]) => void;
6
+ };
7
+ export interface ModalRootContextInterface {
8
+ updateModalHeight: VoidFunction;
9
+ registerModal(data: ModalRegistryEntry): void;
10
+ onClose?: VoidFunction;
11
+ isInsideModal: boolean;
12
+ }
13
+ export declare const ModalRootContext: React.Context<ModalRootContextInterface>;
14
+ /**
15
+ * All referenced elements must be static
16
+ */
17
+ export declare function useModalRegistry(id: string | undefined, type: ModalType): {
18
+ refs: Required<ModalRefs>;
19
+ };
20
+ export default ModalRootContext;
@@ -0,0 +1,16 @@
1
+ import * as React from "react";
2
+ import { HasPlatform } from "../../types";
3
+ import { ConfigProviderContextInterface } from "../ConfigProvider/ConfigProviderContext";
4
+ import "./ModalRoot.css";
5
+ export interface ModalRootProps extends HasPlatform {
6
+ activeModal?: string | null;
7
+ /**
8
+ * @ignore
9
+ */
10
+ configProvider?: ConfigProviderContextInterface;
11
+ /**
12
+ * Будет вызвано при закрытии активной модалки с её id
13
+ */
14
+ onClose?(modalId: string): void;
15
+ }
16
+ export declare const ModalRootDesktop: React.FC<Pick<ModalRootProps, "configProvider" | "onClose" | "activeModal">>;
@@ -0,0 +1,3 @@
1
+ export declare const MODAL_PAGE_DEFAULT_PERCENT_HEIGHT = 75;
2
+ export declare const PERCENT_OPENED = 0;
3
+ export declare const PERCENT_CLOSED = 100;
@@ -0,0 +1,45 @@
1
+ export declare enum ModalType {
2
+ PAGE = "page",
3
+ CARD = "card"
4
+ }
5
+ export declare type TranslateRange = [number, number];
6
+ export declare type ModalsState = {
7
+ [index: string]: ModalsStateEntry;
8
+ };
9
+ export interface ModalElements {
10
+ modalElement?: HTMLElement | null;
11
+ innerElement?: HTMLElement | null;
12
+ headerElement?: HTMLElement | null;
13
+ contentElement?: HTMLElement | null;
14
+ }
15
+ export interface ModalsStateEntry extends ModalElements {
16
+ id: string | null;
17
+ onClose?: () => any;
18
+ type?: ModalType;
19
+ settlingHeight?: number;
20
+ dynamicContentHeight?: boolean;
21
+ expandable?: boolean;
22
+ /**
23
+ * Процент текущего сдвига модалки
24
+ */
25
+ translateY?: number;
26
+ /**
27
+ * Процент сдвига модалки в изначальном состоянии
28
+ */
29
+ translateYFrom?: number;
30
+ /**
31
+ * Процент сдвига модалки во время взаимодействия с ней (потянуть, чтобы открыть или закрыть)
32
+ */
33
+ translateYCurrent?: number;
34
+ touchStartContentScrollTop?: number;
35
+ touchMovePositive?: boolean | null;
36
+ touchShiftYPercent?: number;
37
+ expanded?: boolean;
38
+ collapsed?: boolean;
39
+ hidden?: boolean;
40
+ contentScrolled?: boolean;
41
+ contentScrollStopTimeout?: ReturnType<typeof setTimeout>;
42
+ expandedRange?: TranslateRange;
43
+ collapsedRange?: TranslateRange;
44
+ hiddenRange?: TranslateRange;
45
+ }