@vkontakte/vkui 4.26.0 → 4.27.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (299) hide show
  1. package/.cache/.eslintcache +1 -1
  2. package/.cache/.stylelintcache +1 -1
  3. package/.cache/.tsbuildinfo +210 -85
  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/Card/Card.d.ts +1 -2
  8. package/.cache/ts/src/components/CardScroll/CardScroll.d.ts +4 -7
  9. package/.cache/ts/src/components/Chip/Chip.d.ts +2 -2
  10. package/.cache/ts/src/components/ConfigProvider/ConfigProvider.d.ts +1 -1
  11. package/.cache/ts/src/components/ConfigProvider/ConfigProviderContext.d.ts +5 -5
  12. package/.cache/ts/src/components/Gradient/Gradient.d.ts +1 -2
  13. package/.cache/ts/src/components/SegmentedControl/SegmentedControl.d.ts +17 -0
  14. package/.cache/ts/src/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.d.ts +4 -0
  15. package/.cache/ts/src/components/SliderSwitch/SliderSwitch.d.ts +6 -2
  16. package/.cache/ts/src/components/SliderSwitch/SliderSwitchButton.d.ts +4 -2
  17. package/.cache/ts/src/components/Switch/Switch.d.ts +3 -2
  18. package/.cache/ts/src/components/Typography/Title/Title.d.ts +4 -1
  19. package/.cache/ts/src/components/VisuallyHiddenInput/VisuallyHiddenInput.d.ts +12 -0
  20. package/.cache/ts/src/hooks/usePlatform.d.ts +1 -1
  21. package/.cache/ts/src/index.d.ts +7 -5
  22. package/.cache/ts/src/lib/utils.d.ts +1 -0
  23. package/.cache/ts/src/tokenized/index.d.ts +6 -0
  24. package/VKUI_TOKENS_MIGRATION_GUIDE.md +2 -1
  25. package/dist/cjs/components/ActionSheetItem/ActionSheetItem.d.ts +1 -2
  26. package/dist/cjs/components/ActionSheetItem/ActionSheetItem.js +16 -10
  27. package/dist/cjs/components/ActionSheetItem/ActionSheetItem.js.map +1 -1
  28. package/dist/cjs/components/Alert/Alert.d.ts +1 -2
  29. package/dist/cjs/components/Alert/Alert.js +12 -12
  30. package/dist/cjs/components/Alert/Alert.js.map +1 -1
  31. package/dist/cjs/components/AppearanceProvider/AppearanceProvider.d.ts +1 -0
  32. package/dist/cjs/components/AppearanceProvider/AppearanceProvider.js +29 -2
  33. package/dist/cjs/components/AppearanceProvider/AppearanceProvider.js.map +1 -1
  34. package/dist/cjs/components/Banner/Banner.js +1 -1
  35. package/dist/cjs/components/Banner/Banner.js.map +1 -1
  36. package/dist/cjs/components/Button/Button.js +9 -1
  37. package/dist/cjs/components/Button/Button.js.map +1 -1
  38. package/dist/cjs/components/Card/Card.d.ts +1 -2
  39. package/dist/cjs/components/Card/Card.js +4 -8
  40. package/dist/cjs/components/Card/Card.js.map +1 -1
  41. package/dist/cjs/components/CardScroll/CardScroll.d.ts +4 -7
  42. package/dist/cjs/components/CardScroll/CardScroll.js +11 -15
  43. package/dist/cjs/components/CardScroll/CardScroll.js.map +1 -1
  44. package/dist/cjs/components/Chip/Chip.d.ts +2 -2
  45. package/dist/cjs/components/Chip/Chip.js +3 -5
  46. package/dist/cjs/components/Chip/Chip.js.map +1 -1
  47. package/dist/cjs/components/ChipsInput/ChipsInput.js +2 -2
  48. package/dist/cjs/components/ChipsInput/ChipsInput.js.map +1 -1
  49. package/dist/cjs/components/ConfigProvider/ConfigProvider.d.ts +1 -1
  50. package/dist/cjs/components/ConfigProvider/ConfigProvider.js +1 -26
  51. package/dist/cjs/components/ConfigProvider/ConfigProvider.js.map +1 -1
  52. package/dist/cjs/components/ConfigProvider/ConfigProviderContext.d.ts +5 -5
  53. package/dist/cjs/components/ConfigProvider/ConfigProviderContext.js.map +1 -1
  54. package/dist/cjs/components/ContentCard/ContentCard.js +4 -4
  55. package/dist/cjs/components/ContentCard/ContentCard.js.map +1 -1
  56. package/dist/cjs/components/Gradient/Gradient.d.ts +1 -2
  57. package/dist/cjs/components/Gradient/Gradient.js +6 -10
  58. package/dist/cjs/components/Gradient/Gradient.js.map +1 -1
  59. package/dist/cjs/components/Header/Header.js +1 -1
  60. package/dist/cjs/components/Header/Header.js.map +1 -1
  61. package/dist/cjs/components/ModalCardBase/ModalCardBase.js +1 -1
  62. package/dist/cjs/components/ModalCardBase/ModalCardBase.js.map +1 -1
  63. package/dist/cjs/components/PanelHeaderButton/PanelHeaderButton.js +1 -1
  64. package/dist/cjs/components/PanelHeaderButton/PanelHeaderButton.js.map +1 -1
  65. package/dist/cjs/components/Placeholder/Placeholder.js +1 -1
  66. package/dist/cjs/components/Placeholder/Placeholder.js.map +1 -1
  67. package/dist/cjs/components/Search/Search.js +47 -23
  68. package/dist/cjs/components/Search/Search.js.map +1 -1
  69. package/dist/cjs/components/SegmentedControl/SegmentedControl.d.ts +17 -0
  70. package/dist/cjs/components/SegmentedControl/SegmentedControl.js +116 -0
  71. package/dist/cjs/components/SegmentedControl/SegmentedControl.js.map +1 -0
  72. package/dist/cjs/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.d.ts +4 -0
  73. package/dist/cjs/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.js +61 -0
  74. package/dist/cjs/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.js.map +1 -0
  75. package/dist/cjs/components/SimpleCell/SimpleCell.js +21 -8
  76. package/dist/cjs/components/SimpleCell/SimpleCell.js.map +1 -1
  77. package/dist/cjs/components/SliderSwitch/SliderSwitch.d.ts +6 -2
  78. package/dist/cjs/components/SliderSwitch/SliderSwitch.js +18 -6
  79. package/dist/cjs/components/SliderSwitch/SliderSwitch.js.map +1 -1
  80. package/dist/cjs/components/SliderSwitch/SliderSwitchButton.d.ts +4 -2
  81. package/dist/cjs/components/SliderSwitch/SliderSwitchButton.js +6 -5
  82. package/dist/cjs/components/SliderSwitch/SliderSwitchButton.js.map +1 -1
  83. package/dist/cjs/components/Switch/Switch.d.ts +3 -2
  84. package/dist/cjs/components/Switch/Switch.js +3 -6
  85. package/dist/cjs/components/Switch/Switch.js.map +1 -1
  86. package/dist/cjs/components/Typography/Title/Title.d.ts +4 -1
  87. package/dist/cjs/components/Typography/Title/Title.js +9 -19
  88. package/dist/cjs/components/Typography/Title/Title.js.map +1 -1
  89. package/dist/cjs/components/VisuallyHiddenInput/VisuallyHiddenInput.d.ts +12 -0
  90. package/dist/cjs/components/VisuallyHiddenInput/VisuallyHiddenInput.js +37 -0
  91. package/dist/cjs/components/VisuallyHiddenInput/VisuallyHiddenInput.js.map +1 -0
  92. package/dist/cjs/hooks/usePlatform.d.ts +1 -1
  93. package/dist/cjs/hooks/usePlatform.js.map +1 -1
  94. package/dist/cjs/index.d.ts +7 -5
  95. package/dist/cjs/index.js +18 -10
  96. package/dist/cjs/index.js.map +1 -1
  97. package/dist/cjs/lib/utils.d.ts +1 -0
  98. package/dist/cjs/lib/utils.js +7 -0
  99. package/dist/cjs/lib/utils.js.map +1 -1
  100. package/dist/cjs/tokenized/index.d.ts +6 -0
  101. package/dist/cjs/tokenized/index.js +24 -0
  102. package/dist/cjs/tokenized/index.js.map +1 -1
  103. package/dist/components/ActionSheetItem/ActionSheetItem.d.ts +1 -2
  104. package/dist/components/ActionSheetItem/ActionSheetItem.js +14 -10
  105. package/dist/components/ActionSheetItem/ActionSheetItem.js.map +1 -1
  106. package/dist/components/Alert/Alert.d.ts +1 -2
  107. package/dist/components/Alert/Alert.js +11 -12
  108. package/dist/components/Alert/Alert.js.map +1 -1
  109. package/dist/components/AppearanceProvider/AppearanceProvider.d.ts +1 -0
  110. package/dist/components/AppearanceProvider/AppearanceProvider.js +24 -1
  111. package/dist/components/AppearanceProvider/AppearanceProvider.js.map +1 -1
  112. package/dist/components/Banner/Banner.js +1 -1
  113. package/dist/components/Banner/Banner.js.map +1 -1
  114. package/dist/components/Button/Button.js +9 -2
  115. package/dist/components/Button/Button.js.map +1 -1
  116. package/dist/components/Card/Card.d.ts +1 -2
  117. package/dist/components/Card/Card.js +3 -9
  118. package/dist/components/Card/Card.js.map +1 -1
  119. package/dist/components/CardScroll/CardScroll.d.ts +4 -7
  120. package/dist/components/CardScroll/CardScroll.js +9 -14
  121. package/dist/components/CardScroll/CardScroll.js.map +1 -1
  122. package/dist/components/Chip/Chip.d.ts +2 -2
  123. package/dist/components/Chip/Chip.js +2 -6
  124. package/dist/components/Chip/Chip.js.map +1 -1
  125. package/dist/components/ChipsInput/ChipsInput.js +1 -1
  126. package/dist/components/ChipsInput/ChipsInput.js.map +1 -1
  127. package/dist/components/ConfigProvider/ConfigProvider.d.ts +1 -1
  128. package/dist/components/ConfigProvider/ConfigProvider.js +1 -25
  129. package/dist/components/ConfigProvider/ConfigProvider.js.map +1 -1
  130. package/dist/components/ConfigProvider/ConfigProviderContext.d.ts +5 -5
  131. package/dist/components/ConfigProvider/ConfigProviderContext.js.map +1 -1
  132. package/dist/components/ContentCard/ContentCard.js +3 -3
  133. package/dist/components/ContentCard/ContentCard.js.map +1 -1
  134. package/dist/components/Gradient/Gradient.d.ts +1 -2
  135. package/dist/components/Gradient/Gradient.js +5 -11
  136. package/dist/components/Gradient/Gradient.js.map +1 -1
  137. package/dist/components/Header/Header.js +1 -1
  138. package/dist/components/Header/Header.js.map +1 -1
  139. package/dist/components/ModalCardBase/ModalCardBase.js +2 -2
  140. package/dist/components/ModalCardBase/ModalCardBase.js.map +1 -1
  141. package/dist/components/PanelHeaderButton/PanelHeaderButton.js +1 -1
  142. package/dist/components/PanelHeaderButton/PanelHeaderButton.js.map +1 -1
  143. package/dist/components/Placeholder/Placeholder.js +1 -1
  144. package/dist/components/Placeholder/Placeholder.js.map +1 -1
  145. package/dist/components/Search/Search.js +45 -22
  146. package/dist/components/Search/Search.js.map +1 -1
  147. package/dist/components/SegmentedControl/SegmentedControl.d.ts +17 -0
  148. package/dist/components/SegmentedControl/SegmentedControl.js +94 -0
  149. package/dist/components/SegmentedControl/SegmentedControl.js.map +1 -0
  150. package/dist/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.d.ts +4 -0
  151. package/dist/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.js +40 -0
  152. package/dist/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.js.map +1 -0
  153. package/dist/components/SimpleCell/SimpleCell.js +21 -9
  154. package/dist/components/SimpleCell/SimpleCell.js.map +1 -1
  155. package/dist/components/SliderSwitch/SliderSwitch.d.ts +6 -2
  156. package/dist/components/SliderSwitch/SliderSwitch.js +14 -3
  157. package/dist/components/SliderSwitch/SliderSwitch.js.map +1 -1
  158. package/dist/components/SliderSwitch/SliderSwitchButton.d.ts +4 -2
  159. package/dist/components/SliderSwitch/SliderSwitchButton.js +5 -5
  160. package/dist/components/SliderSwitch/SliderSwitchButton.js.map +1 -1
  161. package/dist/components/Switch/Switch.d.ts +3 -2
  162. package/dist/components/Switch/Switch.js +3 -6
  163. package/dist/components/Switch/Switch.js.map +1 -1
  164. package/dist/components/Typography/Title/Title.d.ts +4 -1
  165. package/dist/components/Typography/Title/Title.js +7 -16
  166. package/dist/components/Typography/Title/Title.js.map +1 -1
  167. package/dist/components/VisuallyHiddenInput/VisuallyHiddenInput.d.ts +12 -0
  168. package/dist/components/VisuallyHiddenInput/VisuallyHiddenInput.js +23 -0
  169. package/dist/components/VisuallyHiddenInput/VisuallyHiddenInput.js.map +1 -0
  170. package/dist/components.css +5 -5
  171. package/dist/components.css.map +1 -1
  172. package/dist/cssm/components/ActionSheetItem/ActionSheetItem.js +14 -10
  173. package/dist/cssm/components/ActionSheetItem/ActionSheetItem.js.map +1 -1
  174. package/dist/cssm/components/Alert/Alert.js +11 -12
  175. package/dist/cssm/components/Alert/Alert.js.map +1 -1
  176. package/dist/cssm/components/AppearanceProvider/AppearanceProvider.js +24 -1
  177. package/dist/cssm/components/AppearanceProvider/AppearanceProvider.js.map +1 -1
  178. package/dist/cssm/components/Banner/Banner.js +1 -1
  179. package/dist/cssm/components/Banner/Banner.js.map +1 -1
  180. package/dist/cssm/components/Button/Button.js +9 -2
  181. package/dist/cssm/components/Button/Button.js.map +1 -1
  182. package/dist/cssm/components/Card/Card.css +2 -2
  183. package/dist/cssm/components/Card/Card.js +3 -9
  184. package/dist/cssm/components/Card/Card.js.map +1 -1
  185. package/dist/cssm/components/CardScroll/CardScroll.css +1 -1
  186. package/dist/cssm/components/CardScroll/CardScroll.js +9 -14
  187. package/dist/cssm/components/CardScroll/CardScroll.js.map +1 -1
  188. package/dist/cssm/components/Chip/Chip.js +2 -6
  189. package/dist/cssm/components/Chip/Chip.js.map +1 -1
  190. package/dist/cssm/components/ChipsInput/ChipsInput.js +1 -1
  191. package/dist/cssm/components/ChipsInput/ChipsInput.js.map +1 -1
  192. package/dist/cssm/components/ConfigProvider/ConfigProvider.js +1 -25
  193. package/dist/cssm/components/ConfigProvider/ConfigProvider.js.map +1 -1
  194. package/dist/cssm/components/ConfigProvider/ConfigProviderContext.js.map +1 -1
  195. package/dist/cssm/components/ContentCard/ContentCard.js +3 -3
  196. package/dist/cssm/components/ContentCard/ContentCard.js.map +1 -1
  197. package/dist/cssm/components/FocusVisible/FocusVisible.css +1 -1
  198. package/dist/cssm/components/Gradient/Gradient.js +5 -11
  199. package/dist/cssm/components/Gradient/Gradient.js.map +1 -1
  200. package/dist/cssm/components/Header/Header.js +1 -1
  201. package/dist/cssm/components/Header/Header.js.map +1 -1
  202. package/dist/cssm/components/ModalCardBase/ModalCardBase.js +2 -2
  203. package/dist/cssm/components/ModalCardBase/ModalCardBase.js.map +1 -1
  204. package/dist/cssm/components/PanelHeaderButton/PanelHeaderButton.js +1 -1
  205. package/dist/cssm/components/PanelHeaderButton/PanelHeaderButton.js.map +1 -1
  206. package/dist/cssm/components/Placeholder/Placeholder.js +1 -1
  207. package/dist/cssm/components/Placeholder/Placeholder.js.map +1 -1
  208. package/dist/cssm/components/Search/Search.js +45 -22
  209. package/dist/cssm/components/Search/Search.js.map +1 -1
  210. package/dist/cssm/components/SegmentedControl/SegmentedControl.css +1 -0
  211. package/dist/cssm/components/SegmentedControl/SegmentedControl.js +95 -0
  212. package/dist/cssm/components/SegmentedControl/SegmentedControl.js.map +1 -0
  213. package/dist/cssm/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.css +1 -0
  214. package/dist/cssm/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.js +41 -0
  215. package/dist/cssm/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.js.map +1 -0
  216. package/dist/cssm/components/SimpleCell/SimpleCell.js +21 -9
  217. package/dist/cssm/components/SimpleCell/SimpleCell.js.map +1 -1
  218. package/dist/cssm/components/SliderSwitch/SliderSwitch.js +14 -3
  219. package/dist/cssm/components/SliderSwitch/SliderSwitch.js.map +1 -1
  220. package/dist/cssm/components/SliderSwitch/SliderSwitchButton.js +5 -5
  221. package/dist/cssm/components/SliderSwitch/SliderSwitchButton.js.map +1 -1
  222. package/dist/cssm/components/Switch/Switch.css +1 -1
  223. package/dist/cssm/components/Switch/Switch.js +3 -6
  224. package/dist/cssm/components/Switch/Switch.js.map +1 -1
  225. package/dist/cssm/components/Typography/Title/Title.css +1 -1
  226. package/dist/cssm/components/Typography/Title/Title.js +7 -16
  227. package/dist/cssm/components/Typography/Title/Title.js.map +1 -1
  228. package/dist/cssm/components/VisuallyHiddenInput/VisuallyHiddenInput.css +1 -0
  229. package/dist/cssm/components/VisuallyHiddenInput/VisuallyHiddenInput.js +24 -0
  230. package/dist/cssm/components/VisuallyHiddenInput/VisuallyHiddenInput.js.map +1 -0
  231. package/dist/cssm/hooks/usePlatform.js.map +1 -1
  232. package/dist/cssm/index.js +6 -5
  233. package/dist/cssm/index.js.map +1 -1
  234. package/dist/cssm/lib/utils.js +3 -0
  235. package/dist/cssm/lib/utils.js.map +1 -1
  236. package/dist/cssm/styles/components.css +5 -5
  237. package/dist/cssm/styles/themes.css +1 -1
  238. package/dist/cssm/tokenized/index.js +3 -0
  239. package/dist/cssm/tokenized/index.js.map +1 -1
  240. package/dist/hooks/usePlatform.d.ts +1 -1
  241. package/dist/hooks/usePlatform.js.map +1 -1
  242. package/dist/index.d.ts +7 -5
  243. package/dist/index.js +6 -5
  244. package/dist/index.js.map +1 -1
  245. package/dist/lib/utils.d.ts +1 -0
  246. package/dist/lib/utils.js +3 -0
  247. package/dist/lib/utils.js.map +1 -1
  248. package/dist/tokenized/index.d.ts +6 -0
  249. package/dist/tokenized/index.js +3 -0
  250. package/dist/tokenized/index.js.map +1 -1
  251. package/dist/vkui.css +6 -6
  252. package/dist/vkui.css.map +1 -1
  253. package/package.json +2 -2
  254. package/src/components/ActionSheetItem/ActionSheetItem.tsx +26 -24
  255. package/src/components/Alert/Alert.tsx +5 -7
  256. package/src/components/AppearanceProvider/AppearanceProvider.tsx +25 -1
  257. package/src/components/Banner/Banner.tsx +1 -1
  258. package/src/components/Button/Button.tsx +6 -3
  259. package/src/components/Card/Card.css +41 -0
  260. package/src/components/Card/Card.tsx +2 -9
  261. package/src/components/CardScroll/CardScroll.css +2 -39
  262. package/src/components/CardScroll/CardScroll.tsx +7 -17
  263. package/src/components/CardScroll/Readme.md +3 -2
  264. package/src/components/Chip/Chip.tsx +1 -4
  265. package/src/components/ChipsInput/ChipsInput.tsx +1 -1
  266. package/src/components/ConfigProvider/ConfigProvider.tsx +6 -25
  267. package/src/components/ConfigProvider/ConfigProviderContext.tsx +5 -5
  268. package/src/components/ContentCard/ContentCard.tsx +2 -2
  269. package/src/components/FocusVisible/FocusVisible.css +4 -8
  270. package/src/components/FormItem/Readme.md +14 -2
  271. package/src/components/Gradient/Gradient.tsx +4 -12
  272. package/src/components/Gradient/Readme.md +1 -1
  273. package/src/components/Header/Header.tsx +1 -1
  274. package/src/components/ModalCardBase/ModalCardBase.tsx +2 -2
  275. package/src/components/ModalRoot/Readme.md +1 -1
  276. package/src/components/PanelHeaderButton/PanelHeaderButton.tsx +1 -5
  277. package/src/components/Placeholder/Placeholder.tsx +1 -1
  278. package/src/components/Search/Search.tsx +38 -14
  279. package/src/components/SegmentedControl/Readme.md +94 -0
  280. package/src/components/SegmentedControl/SegmentedControl.css +42 -0
  281. package/src/components/SegmentedControl/SegmentedControl.tsx +105 -0
  282. package/src/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.css +30 -0
  283. package/src/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.tsx +42 -0
  284. package/src/components/SimpleCell/SimpleCell.tsx +10 -6
  285. package/src/components/SliderSwitch/Readme.md +4 -0
  286. package/src/components/SliderSwitch/SliderSwitch.tsx +17 -3
  287. package/src/components/SliderSwitch/SliderSwitchButton.tsx +4 -4
  288. package/src/components/Switch/Switch.css +0 -12
  289. package/src/components/Switch/Switch.tsx +8 -10
  290. package/src/components/Typography/Title/Readme.md +28 -41
  291. package/src/components/Typography/Title/Title.css +22 -13
  292. package/src/components/Typography/Title/Title.tsx +27 -22
  293. package/src/components/VisuallyHiddenInput/VisuallyHiddenInput.css +9 -0
  294. package/src/components/VisuallyHiddenInput/VisuallyHiddenInput.tsx +25 -0
  295. package/src/hooks/usePlatform.ts +1 -1
  296. package/src/index.ts +11 -5
  297. package/src/lib/utils.ts +6 -0
  298. package/src/styles/components.css +3 -0
  299. package/src/tokenized/index.ts +13 -0
@@ -4,6 +4,29 @@ import { AppearanceProviderContext } from "./AppearanceProviderContext";
4
4
  import { getScheme } from "../../helpers/getScheme";
5
5
  import { classNamesString } from "../../lib/classNames";
6
6
  import { usePlatform } from "../../hooks/usePlatform";
7
+ import { Platform } from "../../lib/platform";
8
+ export var generateVKUITokensClassName = function generateVKUITokensClassName(platform, appearance) {
9
+ var tokensPlatform;
10
+
11
+ switch (platform) {
12
+ case Platform.ANDROID:
13
+ tokensPlatform = "vkBase";
14
+ break;
15
+
16
+ case Platform.IOS:
17
+ tokensPlatform = "vkIOS";
18
+ break;
19
+
20
+ case Platform.VKCOM:
21
+ tokensPlatform = "vkCom";
22
+ break;
23
+
24
+ default:
25
+ tokensPlatform = platform;
26
+ }
27
+
28
+ return "vkui--".concat(tokensPlatform, "--").concat(appearance);
29
+ };
7
30
  export var AppearanceProvider = function AppearanceProvider(_ref) {
8
31
  var children = _ref.children,
9
32
  _ref$appearance = _ref.appearance,
@@ -23,7 +46,7 @@ export var AppearanceProvider = function AppearanceProvider(_ref) {
23
46
  }, React.Children.map(children, function (child) {
24
47
  if ( /*#__PURE__*/React.isValidElement(child)) {
25
48
  return /*#__PURE__*/React.cloneElement(child, {
26
- className: classNamesString(child.props.className, "vkui".concat(appearanceContext.scheme))
49
+ className: classNamesString(child.props.className, "vkui".concat(appearanceContext.scheme), generateVKUITokensClassName(platform, appearance))
27
50
  });
28
51
  }
29
52
 
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/AppearanceProvider/AppearanceProvider.tsx"],"names":["React","AppearanceProviderContext","getScheme","classNamesString","usePlatform","AppearanceProvider","children","appearance","platform","appearanceContext","useMemo","scheme","Children","map","child","isValidElement","cloneElement","className","props"],"mappings":";AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA,SAASC,yBAAT;AACA,SAASC,SAAT;AACA,SAASC,gBAAT;AACA,SAASC,WAAT;AAMA,OAAO,IAAMC,kBAAqD,GAAG,SAAxDA,kBAAwD,OAG/D;AAAA,MAFJC,QAEI,QAFJA,QAEI;AAAA,6BADJC,UACI;AAAA,MADJA,UACI,gCADS,OACT;AACJ,MAAMC,QAAQ,GAAGJ,WAAW,EAA5B;AAEA,MAAMK,iBAAiB,GAAGT,KAAK,CAACU,OAAN,CACxB;AAAA,WAAO;AACLC,MAAAA,MAAM,EAAET,SAAS,CAAC;AAChBM,QAAAA,QAAQ,EAARA,QADgB;AAEhBD,QAAAA,UAAU,EAAVA;AAFgB,OAAD,CADZ;AAKLA,MAAAA,UAAU,EAAVA;AALK,KAAP;AAAA,GADwB,EAQxB,CAACA,UAAD,EAAaC,QAAb,CARwB,CAA1B;AAWA,SACE,oBAAC,yBAAD,CAA2B,QAA3B;AAAoC,IAAA,KAAK,EAAEC;AAA3C,KACGT,KAAK,CAACY,QAAN,CAAeC,GAAf,CAAmBP,QAAnB,EAA6B,UAACQ,KAAD,EAAW;AACvC,sBAAId,KAAK,CAACe,cAAN,CAAqBD,KAArB,CAAJ,EAAiC;AAC/B,0BAAOd,KAAK,CAACgB,YAAN,CAAmBF,KAAnB,EAA0B;AAC/BG,QAAAA,SAAS,EAAEd,gBAAgB,CACzBW,KAAK,CAACI,KAAN,CAAYD,SADa,gBAElBR,iBAAiB,CAACE,MAFA;AADI,OAA1B,CAAP;AAMD;;AACD,WAAOG,KAAP;AACD,GAVA,CADH,CADF;AAeD,CAhCM","sourcesContent":["import * as React from \"react\";\nimport { AppearanceType } from \"@vkontakte/vk-bridge\";\nimport { AppearanceProviderContext } from \"./AppearanceProviderContext\";\nimport { getScheme } from \"../../helpers/getScheme\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\n\nexport interface AppearanceProviderProps {\n appearance?: AppearanceType;\n}\n\nexport const AppearanceProvider: React.FC<AppearanceProviderProps> = ({\n children,\n appearance = \"light\",\n}) => {\n const platform = usePlatform();\n\n const appearanceContext = React.useMemo(\n () => ({\n scheme: getScheme({\n platform,\n appearance,\n }),\n appearance,\n }),\n [appearance, platform]\n );\n\n return (\n <AppearanceProviderContext.Provider value={appearanceContext}>\n {React.Children.map(children, (child) => {\n if (React.isValidElement(child)) {\n return React.cloneElement(child, {\n className: classNamesString(\n child.props.className,\n `vkui${appearanceContext.scheme}`\n ),\n });\n }\n return child;\n })}\n </AppearanceProviderContext.Provider>\n );\n};\n"],"file":"AppearanceProvider.js"}
1
+ {"version":3,"sources":["../../../src/components/AppearanceProvider/AppearanceProvider.tsx"],"names":["React","AppearanceProviderContext","getScheme","classNamesString","usePlatform","Platform","generateVKUITokensClassName","platform","appearance","tokensPlatform","ANDROID","IOS","VKCOM","AppearanceProvider","children","appearanceContext","useMemo","scheme","Children","map","child","isValidElement","cloneElement","className","props"],"mappings":";AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA,SAASC,yBAAT;AACA,SAASC,SAAT;AACA,SAASC,gBAAT;AACA,SAASC,WAAT;AACA,SAASC,QAAT;AAMA,OAAO,IAAMC,2BAA2B,GAAG,SAA9BA,2BAA8B,CACzCC,QADyC,EAEzCC,UAFyC,EAG9B;AACX,MAAIC,cAAJ;;AACA,UAAQF,QAAR;AACE,SAAKF,QAAQ,CAACK,OAAd;AACED,MAAAA,cAAc,GAAG,QAAjB;AACA;;AACF,SAAKJ,QAAQ,CAACM,GAAd;AACEF,MAAAA,cAAc,GAAG,OAAjB;AACA;;AACF,SAAKJ,QAAQ,CAACO,KAAd;AACEH,MAAAA,cAAc,GAAG,OAAjB;AACA;;AACF;AACEA,MAAAA,cAAc,GAAGF,QAAjB;AAXJ;;AAcA,yBAAgBE,cAAhB,eAAmCD,UAAnC;AACD,CApBM;AAsBP,OAAO,IAAMK,kBAAqD,GAAG,SAAxDA,kBAAwD,OAG/D;AAAA,MAFJC,QAEI,QAFJA,QAEI;AAAA,6BADJN,UACI;AAAA,MADJA,UACI,gCADS,OACT;AACJ,MAAMD,QAAQ,GAAGH,WAAW,EAA5B;AAEA,MAAMW,iBAAiB,GAAGf,KAAK,CAACgB,OAAN,CACxB;AAAA,WAAO;AACLC,MAAAA,MAAM,EAAEf,SAAS,CAAC;AAChBK,QAAAA,QAAQ,EAARA,QADgB;AAEhBC,QAAAA,UAAU,EAAVA;AAFgB,OAAD,CADZ;AAKLA,MAAAA,UAAU,EAAVA;AALK,KAAP;AAAA,GADwB,EAQxB,CAACA,UAAD,EAAaD,QAAb,CARwB,CAA1B;AAWA,SACE,oBAAC,yBAAD,CAA2B,QAA3B;AAAoC,IAAA,KAAK,EAAEQ;AAA3C,KACGf,KAAK,CAACkB,QAAN,CAAeC,GAAf,CAAmBL,QAAnB,EAA6B,UAACM,KAAD,EAAW;AACvC,sBAAIpB,KAAK,CAACqB,cAAN,CAAqBD,KAArB,CAAJ,EAAiC;AAC/B,0BAAOpB,KAAK,CAACsB,YAAN,CAAmBF,KAAnB,EAA0B;AAC/BG,QAAAA,SAAS,EAAEpB,gBAAgB,CACzBiB,KAAK,CAACI,KAAN,CAAYD,SADa,gBAElBR,iBAAiB,CAACE,MAFA,GAGzBX,2BAA2B,CAACC,QAAD,EAAWC,UAAX,CAHF;AADI,OAA1B,CAAP;AAOD;;AACD,WAAOY,KAAP;AACD,GAXA,CADH,CADF;AAgBD,CAjCM","sourcesContent":["import * as React from \"react\";\nimport { AppearanceType } from \"@vkontakte/vk-bridge\";\nimport { AppearanceProviderContext } from \"./AppearanceProviderContext\";\nimport { getScheme } from \"../../helpers/getScheme\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { Platform } from \"../../lib/platform\";\n\nexport interface AppearanceProviderProps {\n appearance?: AppearanceType;\n}\n\nexport const generateVKUITokensClassName = (\n platform: string,\n appearance: string\n): string => {\n let tokensPlatform;\n switch (platform) {\n case Platform.ANDROID:\n tokensPlatform = \"vkBase\";\n break;\n case Platform.IOS:\n tokensPlatform = \"vkIOS\";\n break;\n case Platform.VKCOM:\n tokensPlatform = \"vkCom\";\n break;\n default:\n tokensPlatform = platform;\n }\n\n return `vkui--${tokensPlatform}--${appearance}`;\n};\n\nexport const AppearanceProvider: React.FC<AppearanceProviderProps> = ({\n children,\n appearance = \"light\",\n}) => {\n const platform = usePlatform();\n\n const appearanceContext = React.useMemo(\n () => ({\n scheme: getScheme({\n platform,\n appearance,\n }),\n appearance,\n }),\n [appearance, platform]\n );\n\n return (\n <AppearanceProviderContext.Provider value={appearanceContext}>\n {React.Children.map(children, (child) => {\n if (React.isValidElement(child)) {\n return React.cloneElement(child, {\n className: classNamesString(\n child.props.className,\n `vkui${appearanceContext.scheme}`,\n generateVKUITokensClassName(platform, appearance)\n ),\n });\n }\n return child;\n })}\n </AppearanceProviderContext.Provider>\n );\n};\n"],"file":"AppearanceProvider.js"}
@@ -24,7 +24,7 @@ var BannerHeader = function BannerHeader(_ref) {
24
24
 
25
25
  return size === "m" ? createScopedElement(Title, _extends({
26
26
  level: "2",
27
- weight: "medium"
27
+ weight: "2"
28
28
  }, restProps)) : createScopedElement(Headline, _extends({
29
29
  weight: "medium"
30
30
  }, restProps));
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Banner/Banner.tsx"],"names":["React","getClassName","classNames","usePlatform","ANDROID","IOS","VKCOM","hasReactNode","Icon24Chevron","Icon24DismissSubstract","Icon24DismissDark","Icon24Cancel","Tappable","IconButton","Headline","Subhead","Text","Title","BannerHeader","size","restProps","BannerSubheader","Banner","props","platform","mode","imageTheme","before","asideMode","header","subheader","text","children","background","actions","onDismiss","dismissLabel","undefined","Children","count","defaultProps"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { HasComponent } from \"../../types\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { ANDROID, IOS, VKCOM } from \"../../lib/platform\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport {\n Icon24Chevron,\n Icon24DismissSubstract,\n Icon24DismissDark,\n Icon24Cancel,\n} from \"@vkontakte/icons\";\nimport Tappable from \"../Tappable/Tappable\";\nimport IconButton from \"../IconButton/IconButton\";\nimport Headline from \"../Typography/Headline/Headline\";\nimport Subhead from \"../Typography/Subhead/Subhead\";\nimport Text from \"../Typography/Text/Text\";\nimport Title from \"../Typography/Title/Title\";\nimport \"./Banner.css\";\n\nexport interface BannerProps extends React.HTMLAttributes<HTMLDivElement> {\n /**\n * Тип баннера.\n */\n mode?: \"tint\" | \"image\";\n size?: \"s\" | \"m\";\n /**\n * Тип действия в правой части баннера.\n *\n * - `dismiss` – отображается иконка крестика, при клике на неё сработает свойство `onDismiss`.\n * - `expand` – отображается иконка шеврона, которая подразумевает, что при клике на баннер можно куда-то перейти.\n */\n asideMode?: \"dismiss\" | \"expand\";\n /**\n * Срабатывает при клике на иконку крестика при `asideMode=\"dismiss\"`.\n */\n onDismiss?: React.MouseEventHandler<HTMLButtonElement>;\n /**\n * `aria-label` для кнопки при `asideMode=\"dismiss\". Необходим, чтобы кнопка была доступной.\n */\n dismissLabel?: string;\n /**\n * Содержимое, отображаемое в левой части баннера.\n */\n before?: React.ReactNode;\n /**\n * Заголовок. <br />\n * При использовании этого свойства рекомендуется не указывать `text`.\n */\n header?: React.ReactNode;\n /**\n * Подзаголовок. <br />\n * При использовании этого свойства рекомендуется не указывать `text`.\n */\n subheader?: React.ReactNode;\n /**\n * Текст баннера. <br />\n * Это свойство следует использовать без указания `header` и `subheader`.\n */\n text?: React.ReactNode;\n /**\n * При использовании `mode=\"image\"`.\n *\n * - `light` – в качестве фона используется светлое изображение, цвет текста в баннере будет тёмным.\n * - `dark` – в качестве фона используется тёмное изображение, цвет текста будет светлым.\n */\n imageTheme?: \"light\" | \"dark\";\n /**\n * При использовании `mode=\"image\"`.\n *\n * Элемент, который нужно стилизовать цветом и/или фоном. Этот элемент будет растянут на 100% ширины и высоты баннера.\n */\n background?: React.ReactNode;\n /**\n * Кнопки, отображаемые в баннере.\n *\n * - В режиме `tint` или в `image` со светлым фоном рекомендуется использовать только `<Button mode=\"primary\" />` или `<Button mode=\"tertiary\" hasHover={false} />`.\n * - В режиме `image` с тёмным фоном – `<Button mode=\"overlay_primary\" />`.\n */\n actions?: React.ReactNode;\n}\n\ntype BannerTypographyProps = Pick<BannerProps, \"size\"> & HasComponent;\n\nconst BannerHeader: React.FC<BannerTypographyProps> = ({\n size,\n ...restProps\n}) => {\n return size === \"m\" ? (\n <Title level=\"2\" weight=\"medium\" {...restProps} />\n ) : (\n <Headline weight=\"medium\" {...restProps} />\n );\n};\n\nconst BannerSubheader: React.FC<BannerTypographyProps> = ({\n size,\n ...restProps\n}) => {\n return size === \"m\" ? (\n <Text weight=\"regular\" {...restProps} />\n ) : (\n <Subhead weight=\"regular\" {...restProps} />\n );\n};\n\nconst Banner: React.FC<BannerProps> = (props: BannerProps) => {\n const platform = usePlatform();\n const {\n mode,\n imageTheme,\n size,\n before,\n asideMode,\n header,\n subheader,\n text,\n children,\n background,\n actions,\n onDismiss,\n dismissLabel,\n ...restProps\n } = props;\n\n return (\n <section\n {...restProps}\n vkuiClass={classNames(\n getClassName(\"Banner\", platform),\n `Banner--md-${mode}`,\n `Banner--sz-${size}`,\n {\n \"Banner--inverted\": mode === \"image\" && imageTheme === \"dark\",\n }\n )}\n >\n <Tappable\n vkuiClass=\"Banner__in\"\n activeMode={platform === IOS ? \"opacity\" : \"background\"}\n disabled={asideMode !== \"expand\"}\n role={asideMode === \"expand\" ? \"button\" : undefined}\n >\n {mode === \"image\" && background && (\n <div aria-hidden=\"true\" vkuiClass=\"Banner__bg\">\n {background}\n </div>\n )}\n\n {before && <div vkuiClass=\"Banner__before\">{before}</div>}\n\n <div vkuiClass=\"Banner__content\">\n {hasReactNode(header) && (\n <BannerHeader\n size={size}\n Component=\"span\"\n vkuiClass=\"Banner__header\"\n >\n {header}\n </BannerHeader>\n )}\n {hasReactNode(subheader) && (\n <BannerSubheader\n Component=\"span\"\n size={size}\n vkuiClass=\"Banner__subheader\"\n >\n {subheader}\n </BannerSubheader>\n )}\n {hasReactNode(text) && (\n <Text weight=\"regular\" vkuiClass=\"Banner__text\">\n {text}\n </Text>\n )}\n {hasReactNode(actions) && React.Children.count(actions) > 0 && (\n <div vkuiClass=\"Banner__actions\">{actions}</div>\n )}\n </div>\n\n {!!asideMode && (\n <div vkuiClass=\"Banner__aside\">\n {asideMode === \"expand\" && <Icon24Chevron />}\n\n {asideMode === \"dismiss\" && (\n <IconButton\n aria-label={dismissLabel}\n vkuiClass=\"Banner__dismiss\"\n onClick={onDismiss}\n hoverMode=\"opacity\"\n hasActive={false}\n >\n {(platform === ANDROID || platform === VKCOM) && (\n <Icon24Cancel />\n )}\n {platform === IOS &&\n (mode === \"image\" ? (\n <Icon24DismissDark />\n ) : (\n <Icon24DismissSubstract />\n ))}\n </IconButton>\n )}\n </div>\n )}\n </Tappable>\n </section>\n );\n};\n\nBanner.defaultProps = {\n dismissLabel: \"Скрыть\",\n mode: \"tint\",\n size: \"s\",\n imageTheme: \"dark\",\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default Banner;\n"],"file":"Banner.js"}
1
+ {"version":3,"sources":["../../../src/components/Banner/Banner.tsx"],"names":["React","getClassName","classNames","usePlatform","ANDROID","IOS","VKCOM","hasReactNode","Icon24Chevron","Icon24DismissSubstract","Icon24DismissDark","Icon24Cancel","Tappable","IconButton","Headline","Subhead","Text","Title","BannerHeader","size","restProps","BannerSubheader","Banner","props","platform","mode","imageTheme","before","asideMode","header","subheader","text","children","background","actions","onDismiss","dismissLabel","undefined","Children","count","defaultProps"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { HasComponent } from \"../../types\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { ANDROID, IOS, VKCOM } from \"../../lib/platform\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport {\n Icon24Chevron,\n Icon24DismissSubstract,\n Icon24DismissDark,\n Icon24Cancel,\n} from \"@vkontakte/icons\";\nimport Tappable from \"../Tappable/Tappable\";\nimport IconButton from \"../IconButton/IconButton\";\nimport Headline from \"../Typography/Headline/Headline\";\nimport Subhead from \"../Typography/Subhead/Subhead\";\nimport Text from \"../Typography/Text/Text\";\nimport Title from \"../Typography/Title/Title\";\nimport \"./Banner.css\";\n\nexport interface BannerProps extends React.HTMLAttributes<HTMLDivElement> {\n /**\n * Тип баннера.\n */\n mode?: \"tint\" | \"image\";\n size?: \"s\" | \"m\";\n /**\n * Тип действия в правой части баннера.\n *\n * - `dismiss` – отображается иконка крестика, при клике на неё сработает свойство `onDismiss`.\n * - `expand` – отображается иконка шеврона, которая подразумевает, что при клике на баннер можно куда-то перейти.\n */\n asideMode?: \"dismiss\" | \"expand\";\n /**\n * Срабатывает при клике на иконку крестика при `asideMode=\"dismiss\"`.\n */\n onDismiss?: React.MouseEventHandler<HTMLButtonElement>;\n /**\n * `aria-label` для кнопки при `asideMode=\"dismiss\". Необходим, чтобы кнопка была доступной.\n */\n dismissLabel?: string;\n /**\n * Содержимое, отображаемое в левой части баннера.\n */\n before?: React.ReactNode;\n /**\n * Заголовок. <br />\n * При использовании этого свойства рекомендуется не указывать `text`.\n */\n header?: React.ReactNode;\n /**\n * Подзаголовок. <br />\n * При использовании этого свойства рекомендуется не указывать `text`.\n */\n subheader?: React.ReactNode;\n /**\n * Текст баннера. <br />\n * Это свойство следует использовать без указания `header` и `subheader`.\n */\n text?: React.ReactNode;\n /**\n * При использовании `mode=\"image\"`.\n *\n * - `light` – в качестве фона используется светлое изображение, цвет текста в баннере будет тёмным.\n * - `dark` – в качестве фона используется тёмное изображение, цвет текста будет светлым.\n */\n imageTheme?: \"light\" | \"dark\";\n /**\n * При использовании `mode=\"image\"`.\n *\n * Элемент, который нужно стилизовать цветом и/или фоном. Этот элемент будет растянут на 100% ширины и высоты баннера.\n */\n background?: React.ReactNode;\n /**\n * Кнопки, отображаемые в баннере.\n *\n * - В режиме `tint` или в `image` со светлым фоном рекомендуется использовать только `<Button mode=\"primary\" />` или `<Button mode=\"tertiary\" hasHover={false} />`.\n * - В режиме `image` с тёмным фоном – `<Button mode=\"overlay_primary\" />`.\n */\n actions?: React.ReactNode;\n}\n\ntype BannerTypographyProps = Pick<BannerProps, \"size\"> & HasComponent;\n\nconst BannerHeader: React.FC<BannerTypographyProps> = ({\n size,\n ...restProps\n}) => {\n return size === \"m\" ? (\n <Title level=\"2\" weight=\"2\" {...restProps} />\n ) : (\n <Headline weight=\"medium\" {...restProps} />\n );\n};\n\nconst BannerSubheader: React.FC<BannerTypographyProps> = ({\n size,\n ...restProps\n}) => {\n return size === \"m\" ? (\n <Text weight=\"regular\" {...restProps} />\n ) : (\n <Subhead weight=\"regular\" {...restProps} />\n );\n};\n\nconst Banner: React.FC<BannerProps> = (props: BannerProps) => {\n const platform = usePlatform();\n const {\n mode,\n imageTheme,\n size,\n before,\n asideMode,\n header,\n subheader,\n text,\n children,\n background,\n actions,\n onDismiss,\n dismissLabel,\n ...restProps\n } = props;\n\n return (\n <section\n {...restProps}\n vkuiClass={classNames(\n getClassName(\"Banner\", platform),\n `Banner--md-${mode}`,\n `Banner--sz-${size}`,\n {\n \"Banner--inverted\": mode === \"image\" && imageTheme === \"dark\",\n }\n )}\n >\n <Tappable\n vkuiClass=\"Banner__in\"\n activeMode={platform === IOS ? \"opacity\" : \"background\"}\n disabled={asideMode !== \"expand\"}\n role={asideMode === \"expand\" ? \"button\" : undefined}\n >\n {mode === \"image\" && background && (\n <div aria-hidden=\"true\" vkuiClass=\"Banner__bg\">\n {background}\n </div>\n )}\n\n {before && <div vkuiClass=\"Banner__before\">{before}</div>}\n\n <div vkuiClass=\"Banner__content\">\n {hasReactNode(header) && (\n <BannerHeader\n size={size}\n Component=\"span\"\n vkuiClass=\"Banner__header\"\n >\n {header}\n </BannerHeader>\n )}\n {hasReactNode(subheader) && (\n <BannerSubheader\n Component=\"span\"\n size={size}\n vkuiClass=\"Banner__subheader\"\n >\n {subheader}\n </BannerSubheader>\n )}\n {hasReactNode(text) && (\n <Text weight=\"regular\" vkuiClass=\"Banner__text\">\n {text}\n </Text>\n )}\n {hasReactNode(actions) && React.Children.count(actions) > 0 && (\n <div vkuiClass=\"Banner__actions\">{actions}</div>\n )}\n </div>\n\n {!!asideMode && (\n <div vkuiClass=\"Banner__aside\">\n {asideMode === \"expand\" && <Icon24Chevron />}\n\n {asideMode === \"dismiss\" && (\n <IconButton\n aria-label={dismissLabel}\n vkuiClass=\"Banner__dismiss\"\n onClick={onDismiss}\n hoverMode=\"opacity\"\n hasActive={false}\n >\n {(platform === ANDROID || platform === VKCOM) && (\n <Icon24Cancel />\n )}\n {platform === IOS &&\n (mode === \"image\" ? (\n <Icon24DismissDark />\n ) : (\n <Icon24DismissSubstract />\n ))}\n </IconButton>\n )}\n </div>\n )}\n </Tappable>\n </section>\n );\n};\n\nBanner.defaultProps = {\n dismissLabel: \"Скрыть\",\n mode: \"tint\",\n size: \"s\",\n imageTheme: \"dark\",\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default Banner;\n"],"file":"Banner.js"}
@@ -14,8 +14,9 @@ import Subhead from "../Typography/Subhead/Subhead";
14
14
  import Caption from "../Typography/Caption/Caption";
15
15
  import { usePlatform } from "../../hooks/usePlatform";
16
16
  import { SizeType, withAdaptivity } from "../../hoc/withAdaptivity";
17
- import { IOS, VKCOM } from "../../lib/platform";
17
+ import { IOS, VKCOM, ANDROID } from "../../lib/platform";
18
18
  import Spinner from "../Spinner/Spinner";
19
+ import Headline from "../Typography/Headline/Headline";
19
20
 
20
21
  var ButtonTypography = function ButtonTypography(props) {
21
22
  var size = props.size,
@@ -33,9 +34,15 @@ var ButtonTypography = function ButtonTypography(props) {
33
34
  }, restProps));
34
35
  }
35
36
 
37
+ if (platform === ANDROID) {
38
+ return createScopedElement(Headline, _extends({
39
+ weight: "medium"
40
+ }, restProps));
41
+ }
42
+
36
43
  return createScopedElement(Title, _extends({
37
44
  level: "3",
38
- weight: "medium"
45
+ weight: "2"
39
46
  }, restProps));
40
47
 
41
48
  case "m":
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Button/Button.tsx"],"names":["React","classNames","ConfigProviderContext","Tappable","Title","Text","Subhead","Caption","usePlatform","SizeType","withAdaptivity","IOS","VKCOM","Spinner","ButtonTypography","props","size","sizeY","platform","restProps","isCompact","COMPACT","resolveButtonAppearance","appearance","mode","resolvedAppearance","resolvedMode","undefined","Button","stretched","align","children","before","after","getRootRef","Component","loading","onClick","hasIcons","Boolean","hasNewTokens","useContext","href","defaultProps","stopPropagation"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { ConfigProviderContext } from \"../ConfigProvider/ConfigProviderContext\";\nimport Tappable, { TappableProps } from \"../Tappable/Tappable\";\nimport Title from \"../Typography/Title/Title\";\nimport Text from \"../Typography/Text/Text\";\nimport Subhead from \"../Typography/Subhead/Subhead\";\nimport Caption from \"../Typography/Caption/Caption\";\nimport { HasAlign, HasComponent } from \"../../types\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport {\n AdaptivityProps,\n SizeType,\n withAdaptivity,\n} from \"../../hoc/withAdaptivity\";\nimport { IOS, VKCOM, PlatformType } from \"../../lib/platform\";\nimport Spinner from \"../Spinner/Spinner\";\nimport \"./Button.css\";\n\nexport interface VKUIButtonProps extends HasAlign {\n /**\n Значения `commerce`, `destructive`, `overlay_...` будут упразднены в 5.0.0\n */\n mode?:\n | \"primary\"\n | \"secondary\"\n | \"tertiary\"\n | \"outline\"\n | \"commerce\"\n | \"destructive\"\n | \"overlay_primary\"\n | \"overlay_secondary\"\n | \"overlay_outline\";\n appearance?: \"accent\" | \"positive\" | \"negative\" | \"neutral\" | \"overlay\";\n size?: \"s\" | \"m\" | \"l\";\n stretched?: boolean;\n before?: React.ReactNode;\n after?: React.ReactNode;\n loading?: boolean;\n}\n\nexport interface ButtonProps\n extends Omit<TappableProps, \"size\">,\n VKUIButtonProps {}\n\ninterface ButtonTypographyProps extends HasComponent {\n size: ButtonProps[\"size\"];\n platform: PlatformType | undefined;\n sizeY: AdaptivityProps[\"sizeY\"];\n children?: ButtonProps[\"children\"];\n}\n\nconst ButtonTypography: React.FC<ButtonTypographyProps> = (\n props: ButtonTypographyProps\n) => {\n const { size, sizeY, platform, ...restProps } = props;\n const isCompact = sizeY === SizeType.COMPACT;\n\n switch (size) {\n case \"l\":\n if (isCompact) {\n return <Text weight=\"medium\" {...restProps} />;\n }\n\n return <Title level=\"3\" weight=\"medium\" {...restProps} />;\n case \"m\":\n if (isCompact) {\n return (\n <Subhead\n weight={platform === VKCOM ? \"regular\" : \"medium\"}\n {...restProps}\n />\n );\n }\n\n return <Text weight=\"medium\" {...restProps} />;\n case \"s\":\n default:\n if (platform === IOS) {\n return <Subhead weight=\"medium\" {...restProps} />;\n }\n\n if (platform === VKCOM) {\n return <Caption level=\"1\" weight=\"regular\" {...restProps} />;\n }\n\n if (isCompact) {\n return <Caption level=\"1\" weight=\"medium\" {...restProps} />;\n }\n\n return <Subhead weight=\"medium\" {...restProps} />;\n }\n};\n\ninterface ResolvedButtonAppearance {\n resolvedAppearance: ButtonProps[\"appearance\"];\n resolvedMode: ButtonProps[\"mode\"];\n}\n\nfunction resolveButtonAppearance(\n appearance: ButtonProps[\"appearance\"],\n mode: ButtonProps[\"mode\"]\n): ResolvedButtonAppearance {\n let resolvedAppearance: ButtonProps[\"appearance\"] = appearance;\n let resolvedMode: ButtonProps[\"mode\"] = mode;\n\n if (appearance === undefined) {\n switch (mode) {\n case \"tertiary\":\n case \"secondary\":\n case \"primary\":\n case \"outline\":\n resolvedAppearance = \"accent\";\n break;\n case \"commerce\":\n resolvedMode = \"primary\";\n resolvedAppearance = \"positive\";\n break;\n case \"destructive\":\n resolvedMode = \"primary\";\n resolvedAppearance = \"negative\";\n break;\n case \"overlay_primary\":\n resolvedMode = \"primary\";\n resolvedAppearance = \"overlay\";\n break;\n case \"overlay_secondary\":\n resolvedMode = \"secondary\";\n resolvedAppearance = \"overlay\";\n break;\n case \"overlay_outline\":\n resolvedMode = \"outline\";\n resolvedAppearance = \"overlay\";\n break;\n }\n }\n\n return {\n resolvedAppearance,\n resolvedMode,\n };\n}\n\nconst Button: React.FC<ButtonProps> = (props: ButtonProps) => {\n const platform = usePlatform();\n const {\n size,\n mode,\n appearance,\n stretched,\n align,\n children,\n before,\n after,\n getRootRef,\n sizeY,\n Component = \"button\",\n loading,\n onClick,\n ...restProps\n } = props;\n const hasIcons = Boolean(before || after);\n const { resolvedMode, resolvedAppearance } = resolveButtonAppearance(\n appearance,\n mode\n );\n const hasNewTokens = React.useContext(ConfigProviderContext).hasNewTokens;\n\n return (\n <Tappable\n {...restProps}\n Component={restProps.href ? \"a\" : Component}\n onClick={loading ? undefined : onClick}\n focusVisibleMode=\"outside\"\n vkuiClass={classNames(\n \"Button\",\n `Button--sz-${size}`,\n `Button--lvl-${resolvedMode}`,\n `Button--clr-${resolvedAppearance}`,\n `Button--aln-${align}`,\n `Button--sizeY-${sizeY}`,\n {\n [\"Button--stretched\"]: stretched,\n [\"Button--with-icon\"]: hasIcons,\n [\"Button--singleIcon\"]: Boolean(\n (!children && !after && before) || (!children && after && !before)\n ),\n }\n )}\n getRootRef={getRootRef}\n hoverMode={hasNewTokens ? \"Button--hover\" : \"background\"}\n activeMode={hasNewTokens ? \"Button--active\" : \"opacity\"}\n >\n {loading && <Spinner size=\"small\" vkuiClass=\"Button__spinner\" />}\n <span vkuiClass=\"Button__in\">\n {before && <span vkuiClass=\"Button__before\">{before}</span>}\n {children && (\n <ButtonTypography\n size={size}\n sizeY={sizeY}\n platform={platform}\n vkuiClass=\"Button__content\"\n Component=\"span\"\n >\n {children}\n </ButtonTypography>\n )}\n {after && <span vkuiClass=\"Button__after\">{after}</span>}\n </span>\n </Tappable>\n );\n};\n\nButton.defaultProps = {\n mode: \"primary\",\n align: \"center\",\n size: \"s\",\n stretched: false,\n stopPropagation: true,\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default withAdaptivity(Button, {\n sizeY: true,\n});\n"],"file":"Button.js"}
1
+ {"version":3,"sources":["../../../src/components/Button/Button.tsx"],"names":["React","classNames","ConfigProviderContext","Tappable","Title","Text","Subhead","Caption","usePlatform","SizeType","withAdaptivity","IOS","VKCOM","ANDROID","Spinner","Headline","ButtonTypography","props","size","sizeY","platform","restProps","isCompact","COMPACT","resolveButtonAppearance","appearance","mode","resolvedAppearance","resolvedMode","undefined","Button","stretched","align","children","before","after","getRootRef","Component","loading","onClick","hasIcons","Boolean","hasNewTokens","useContext","href","defaultProps","stopPropagation"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { ConfigProviderContext } from \"../ConfigProvider/ConfigProviderContext\";\nimport Tappable, { TappableProps } from \"../Tappable/Tappable\";\nimport Title from \"../Typography/Title/Title\";\nimport Text from \"../Typography/Text/Text\";\nimport Subhead from \"../Typography/Subhead/Subhead\";\nimport Caption from \"../Typography/Caption/Caption\";\nimport { HasAlign, HasComponent } from \"../../types\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport {\n AdaptivityProps,\n SizeType,\n withAdaptivity,\n} from \"../../hoc/withAdaptivity\";\nimport { PlatformType, IOS, VKCOM, ANDROID } from \"../../lib/platform\";\nimport Spinner from \"../Spinner/Spinner\";\nimport Headline from \"../Typography/Headline/Headline\";\nimport \"./Button.css\";\n\nexport interface VKUIButtonProps extends HasAlign {\n /**\n Значения `commerce`, `destructive`, `overlay_...` будут упразднены в 5.0.0\n */\n mode?:\n | \"primary\"\n | \"secondary\"\n | \"tertiary\"\n | \"outline\"\n | \"commerce\"\n | \"destructive\"\n | \"overlay_primary\"\n | \"overlay_secondary\"\n | \"overlay_outline\";\n appearance?: \"accent\" | \"positive\" | \"negative\" | \"neutral\" | \"overlay\";\n size?: \"s\" | \"m\" | \"l\";\n stretched?: boolean;\n before?: React.ReactNode;\n after?: React.ReactNode;\n loading?: boolean;\n}\n\nexport interface ButtonProps\n extends Omit<TappableProps, \"size\">,\n VKUIButtonProps {}\n\ninterface ButtonTypographyProps extends HasComponent {\n size: ButtonProps[\"size\"];\n platform: PlatformType | undefined;\n sizeY: AdaptivityProps[\"sizeY\"];\n children?: ButtonProps[\"children\"];\n}\n\nconst ButtonTypography: React.FC<ButtonTypographyProps> = (\n props: ButtonTypographyProps\n) => {\n const { size, sizeY, platform, ...restProps } = props;\n const isCompact = sizeY === SizeType.COMPACT;\n\n switch (size) {\n case \"l\":\n if (isCompact) {\n return <Text weight=\"medium\" {...restProps} />;\n }\n if (platform === ANDROID) {\n return <Headline weight=\"medium\" {...restProps} />;\n }\n return <Title level=\"3\" weight=\"2\" {...restProps} />;\n case \"m\":\n if (isCompact) {\n return (\n <Subhead\n weight={platform === VKCOM ? \"regular\" : \"medium\"}\n {...restProps}\n />\n );\n }\n\n return <Text weight=\"medium\" {...restProps} />;\n case \"s\":\n default:\n if (platform === IOS) {\n return <Subhead weight=\"medium\" {...restProps} />;\n }\n\n if (platform === VKCOM) {\n return <Caption level=\"1\" weight=\"regular\" {...restProps} />;\n }\n\n if (isCompact) {\n return <Caption level=\"1\" weight=\"medium\" {...restProps} />;\n }\n\n return <Subhead weight=\"medium\" {...restProps} />;\n }\n};\n\ninterface ResolvedButtonAppearance {\n resolvedAppearance: ButtonProps[\"appearance\"];\n resolvedMode: ButtonProps[\"mode\"];\n}\n\nfunction resolveButtonAppearance(\n appearance: ButtonProps[\"appearance\"],\n mode: ButtonProps[\"mode\"]\n): ResolvedButtonAppearance {\n let resolvedAppearance: ButtonProps[\"appearance\"] = appearance;\n let resolvedMode: ButtonProps[\"mode\"] = mode;\n\n if (appearance === undefined) {\n switch (mode) {\n case \"tertiary\":\n case \"secondary\":\n case \"primary\":\n case \"outline\":\n resolvedAppearance = \"accent\";\n break;\n case \"commerce\":\n resolvedMode = \"primary\";\n resolvedAppearance = \"positive\";\n break;\n case \"destructive\":\n resolvedMode = \"primary\";\n resolvedAppearance = \"negative\";\n break;\n case \"overlay_primary\":\n resolvedMode = \"primary\";\n resolvedAppearance = \"overlay\";\n break;\n case \"overlay_secondary\":\n resolvedMode = \"secondary\";\n resolvedAppearance = \"overlay\";\n break;\n case \"overlay_outline\":\n resolvedMode = \"outline\";\n resolvedAppearance = \"overlay\";\n break;\n }\n }\n\n return {\n resolvedAppearance,\n resolvedMode,\n };\n}\n\nconst Button: React.FC<ButtonProps> = (props: ButtonProps) => {\n const platform = usePlatform();\n const {\n size,\n mode,\n appearance,\n stretched,\n align,\n children,\n before,\n after,\n getRootRef,\n sizeY,\n Component = \"button\",\n loading,\n onClick,\n ...restProps\n } = props;\n const hasIcons = Boolean(before || after);\n const { resolvedMode, resolvedAppearance } = resolveButtonAppearance(\n appearance,\n mode\n );\n const hasNewTokens = React.useContext(ConfigProviderContext).hasNewTokens;\n\n return (\n <Tappable\n {...restProps}\n Component={restProps.href ? \"a\" : Component}\n onClick={loading ? undefined : onClick}\n focusVisibleMode=\"outside\"\n vkuiClass={classNames(\n \"Button\",\n `Button--sz-${size}`,\n `Button--lvl-${resolvedMode}`,\n `Button--clr-${resolvedAppearance}`,\n `Button--aln-${align}`,\n `Button--sizeY-${sizeY}`,\n {\n [\"Button--stretched\"]: stretched,\n [\"Button--with-icon\"]: hasIcons,\n [\"Button--singleIcon\"]: Boolean(\n (!children && !after && before) || (!children && after && !before)\n ),\n }\n )}\n getRootRef={getRootRef}\n hoverMode={hasNewTokens ? \"Button--hover\" : \"background\"}\n activeMode={hasNewTokens ? \"Button--active\" : \"opacity\"}\n >\n {loading && <Spinner size=\"small\" vkuiClass=\"Button__spinner\" />}\n <span vkuiClass=\"Button__in\">\n {before && <span vkuiClass=\"Button__before\">{before}</span>}\n {children && (\n <ButtonTypography\n size={size}\n sizeY={sizeY}\n platform={platform}\n vkuiClass=\"Button__content\"\n Component=\"span\"\n >\n {children}\n </ButtonTypography>\n )}\n {after && <span vkuiClass=\"Button__after\">{after}</span>}\n </span>\n </Tappable>\n );\n};\n\nButton.defaultProps = {\n mode: \"primary\",\n align: \"center\",\n size: \"s\",\n stretched: false,\n stopPropagation: true,\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default withAdaptivity(Button, {\n sizeY: true,\n});\n"],"file":"Button.js"}
@@ -4,5 +4,4 @@ import "./Card.css";
4
4
  export interface CardProps extends React.HTMLAttributes<HTMLDivElement>, HasRootRef<HTMLDivElement> {
5
5
  mode?: "tint" | "shadow" | "outline";
6
6
  }
7
- declare const Card: React.FunctionComponent<CardProps>;
8
- export default Card;
7
+ export declare const Card: React.FC<CardProps>;
@@ -5,9 +5,9 @@ import { createScopedElement } from "../../lib/jsxRuntime";
5
5
  import { classNames } from "../../lib/classNames";
6
6
  import { getClassName } from "../../helpers/getClassName";
7
7
  import { usePlatform } from "../../hooks/usePlatform";
8
-
9
- var Card = function Card(_ref) {
10
- var mode = _ref.mode,
8
+ export var Card = function Card(_ref) {
9
+ var _ref$mode = _ref.mode,
10
+ mode = _ref$mode === void 0 ? "tint" : _ref$mode,
11
11
  children = _ref.children,
12
12
  getRootRef = _ref.getRootRef,
13
13
  restProps = _objectWithoutProperties(_ref, _excluded);
@@ -20,10 +20,4 @@ var Card = function Card(_ref) {
20
20
  vkuiClass: "Card__in"
21
21
  }, children));
22
22
  };
23
-
24
- Card.defaultProps = {
25
- mode: "tint"
26
- }; // eslint-disable-next-line import/no-default-export
27
-
28
- export default Card;
29
23
  //# sourceMappingURL=Card.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Card/Card.tsx"],"names":["classNames","getClassName","usePlatform","Card","mode","children","getRootRef","restProps","platform","defaultProps"],"mappings":";;;;AACA,SAASA,UAAT;AACA,SAASC,YAAT;AACA,SAASC,WAAT;;AAUA,IAAMC,IAAwC,GAAG,SAA3CA,IAA2C,OAKhC;AAAA,MAJfC,IAIe,QAJfA,IAIe;AAAA,MAHfC,QAGe,QAHfA,QAGe;AAAA,MAFfC,UAEe,QAFfA,UAEe;AAAA,MADZC,SACY;;AACf,MAAMC,QAAQ,GAAGN,WAAW,EAA5B;AAEA,SACE,wCACMK,SADN;AAEE,IAAA,GAAG,EAAED,UAFP;AAGE,IAAA,SAAS,EAAEN,UAAU,CAACC,YAAY,CAAC,MAAD,EAASO,QAAT,CAAb,qBAA6CJ,IAA7C;AAHvB,MAKE;AAAK,IAAA,SAAS,EAAC;AAAf,KAA2BC,QAA3B,CALF,CADF;AASD,CAjBD;;AAmBAF,IAAI,CAACM,YAAL,GAAoB;AAClBL,EAAAA,IAAI,EAAE;AADY,CAApB,C,CAIA;;AACA,eAAeD,IAAf","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { HasRootRef } from \"../../types\";\nimport \"./Card.css\";\n\nexport interface CardProps\n extends React.HTMLAttributes<HTMLDivElement>,\n HasRootRef<HTMLDivElement> {\n mode?: \"tint\" | \"shadow\" | \"outline\";\n}\n\nconst Card: React.FunctionComponent<CardProps> = ({\n mode,\n children,\n getRootRef,\n ...restProps\n}: CardProps) => {\n const platform = usePlatform();\n\n return (\n <div\n {...restProps}\n ref={getRootRef}\n vkuiClass={classNames(getClassName(\"Card\", platform), `Card--md-${mode}`)}\n >\n <div vkuiClass=\"Card__in\">{children}</div>\n </div>\n );\n};\n\nCard.defaultProps = {\n mode: \"tint\",\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default Card;\n"],"file":"Card.js"}
1
+ {"version":3,"sources":["../../../src/components/Card/Card.tsx"],"names":["classNames","getClassName","usePlatform","Card","mode","children","getRootRef","restProps","platform"],"mappings":";;;;AACA,SAASA,UAAT;AACA,SAASC,YAAT;AACA,SAASC,WAAT;AAUA,OAAO,IAAMC,IAAyB,GAAG,SAA5BA,IAA4B,OAKxB;AAAA,uBAJfC,IAIe;AAAA,MAJfA,IAIe,0BAJR,MAIQ;AAAA,MAHfC,QAGe,QAHfA,QAGe;AAAA,MAFfC,UAEe,QAFfA,UAEe;AAAA,MADZC,SACY;;AACf,MAAMC,QAAQ,GAAGN,WAAW,EAA5B;AAEA,SACE,wCACMK,SADN;AAEE,IAAA,GAAG,EAAED,UAFP;AAGE,IAAA,SAAS,EAAEN,UAAU,CAACC,YAAY,CAAC,MAAD,EAASO,QAAT,CAAb,qBAA6CJ,IAA7C;AAHvB,MAKE;AAAK,IAAA,SAAS,EAAC;AAAf,KAA2BC,QAA3B,CALF,CADF;AASD,CAjBM","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { HasRootRef } from \"../../types\";\nimport \"./Card.css\";\n\nexport interface CardProps\n extends React.HTMLAttributes<HTMLDivElement>,\n HasRootRef<HTMLDivElement> {\n mode?: \"tint\" | \"shadow\" | \"outline\";\n}\n\nexport const Card: React.FC<CardProps> = ({\n mode = \"tint\",\n children,\n getRootRef,\n ...restProps\n}: CardProps) => {\n const platform = usePlatform();\n\n return (\n <div\n {...restProps}\n ref={getRootRef}\n vkuiClass={classNames(getClassName(\"Card\", platform), `Card--md-${mode}`)}\n >\n <div vkuiClass=\"Card__in\">{children}</div>\n </div>\n );\n};\n"],"file":"Card.js"}
@@ -1,15 +1,12 @@
1
1
  import * as React from "react";
2
2
  import { HorizontalScrollProps } from "../HorizontalScroll/HorizontalScroll";
3
- import { AdaptivityProps } from "../../hoc/withAdaptivity";
4
3
  import "./CardScroll.css";
5
- export interface CardScrollProps extends React.HTMLAttributes<HTMLDivElement>, AdaptivityProps {
4
+ export interface CardScrollProps extends React.HTMLAttributes<HTMLDivElement> {
6
5
  /**
7
- * При size = "s", "m", "l" у Card будет явно задана ширина в %
8
- * При size = false ширина Card будет регулироваться контентом внутри
6
+ * При `size=false` ширина `Card` будет регулироваться контентом внутри. В остальных случаях — будет явно задана в процентах.
9
7
  */
10
8
  size?: "s" | "m" | "l" | false;
11
9
  showArrows?: HorizontalScrollProps["showArrows"];
12
- withSpaces: boolean;
10
+ withSpaces?: boolean;
13
11
  }
14
- declare const _default: React.FC<Pick<CardScrollProps, "hidden" | "dir" | "slot" | "style" | "title" | "color" | "size" | "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" | "showArrows" | "withSpaces"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;
15
- export default _default;
12
+ export declare const CardScroll: React.FC<CardScrollProps>;
@@ -1,27 +1,30 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
3
3
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
4
- var _excluded = ["children", "size", "showArrows", "sizeX", "withSpaces"];
4
+ var _excluded = ["children", "size", "showArrows", "withSpaces"];
5
5
  import { createScopedElement } from "../../lib/jsxRuntime";
6
6
  import * as React from "react";
7
7
  import { classNames } from "../../lib/classNames";
8
8
  import { getClassName } from "../../helpers/getClassName";
9
+ import { useAdaptivity } from "../../hooks/useAdaptivity";
9
10
  import { usePlatform } from "../../hooks/usePlatform";
10
11
  import HorizontalScroll from "../HorizontalScroll/HorizontalScroll";
11
- import { withAdaptivity } from "../../hoc/withAdaptivity";
12
12
  import { useDOM } from "../../lib/dom";
13
-
14
- var CardScroll = function CardScroll(_ref) {
13
+ export var CardScroll = function CardScroll(_ref) {
15
14
  var children = _ref.children,
16
- size = _ref.size,
15
+ _ref$size = _ref.size,
16
+ size = _ref$size === void 0 ? "s" : _ref$size,
17
17
  _ref$showArrows = _ref.showArrows,
18
18
  showArrows = _ref$showArrows === void 0 ? true : _ref$showArrows,
19
- sizeX = _ref.sizeX,
20
19
  _ref$withSpaces = _ref.withSpaces,
21
20
  withSpaces = _ref$withSpaces === void 0 ? true : _ref$withSpaces,
22
21
  restProps = _objectWithoutProperties(_ref, _excluded);
23
22
 
24
23
  var platform = usePlatform();
24
+
25
+ var _useAdaptivity = useAdaptivity(),
26
+ sizeX = _useAdaptivity.sizeX;
27
+
25
28
  var refContainer = React.useRef(null);
26
29
  var gapRef = React.useRef(null);
27
30
 
@@ -89,12 +92,4 @@ var CardScroll = function CardScroll(_ref) {
89
92
  vkuiClass: "CardScroll__gap"
90
93
  }))));
91
94
  };
92
-
93
- CardScroll.defaultProps = {
94
- size: "s"
95
- }; // eslint-disable-next-line import/no-default-export
96
-
97
- export default withAdaptivity(CardScroll, {
98
- sizeX: true
99
- });
100
95
  //# sourceMappingURL=CardScroll.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/CardScroll/CardScroll.tsx"],"names":["React","classNames","getClassName","usePlatform","HorizontalScroll","withAdaptivity","useDOM","CardScroll","children","size","showArrows","sizeX","withSpaces","restProps","platform","refContainer","useRef","gapRef","window","getScrollToLeft","offset","current","containerWidth","offsetWidth","slideIndex","Array","from","findIndex","el","offsetLeft","parseInt","getComputedStyle","marginRight","slide","scrollTo","getScrollToRight","prototype","find","call","defaultProps"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport HorizontalScroll, {\n HorizontalScrollProps,\n} from \"../HorizontalScroll/HorizontalScroll\";\nimport { withAdaptivity, AdaptivityProps } from \"../../hoc/withAdaptivity\";\nimport { useDOM } from \"../../lib/dom\";\nimport \"./CardScroll.css\";\n\nexport interface CardScrollProps\n extends React.HTMLAttributes<HTMLDivElement>,\n AdaptivityProps {\n /**\n * При size = \"s\", \"m\", \"l\" у Card будет явно задана ширина в %\n * При size = false ширина Card будет регулироваться контентом внутри\n */\n size?: \"s\" | \"m\" | \"l\" | false;\n showArrows?: HorizontalScrollProps[\"showArrows\"];\n withSpaces: boolean;\n}\n\nconst CardScroll: React.FC<CardScrollProps> = ({\n children,\n size,\n showArrows = true,\n sizeX,\n withSpaces = true,\n ...restProps\n}: CardScrollProps) => {\n const platform = usePlatform();\n\n const refContainer = React.useRef<HTMLDivElement>(null);\n const gapRef = React.useRef<HTMLDivElement>(null);\n\n const { window } = useDOM();\n\n function getScrollToLeft(offset: number): number {\n if (!refContainer.current || !gapRef.current) {\n return offset;\n }\n const containerWidth = refContainer.current.offsetWidth;\n const slideIndex = (\n Array.from(refContainer.current.children) as HTMLElement[]\n ).findIndex(\n (el: HTMLElement) =>\n el.offsetLeft +\n el.offsetWidth +\n parseInt(window!.getComputedStyle(el).marginRight) -\n offset >=\n 0\n );\n\n if (slideIndex === -1) {\n return offset;\n }\n\n if (slideIndex === 0) {\n return 0;\n }\n\n const slide = refContainer.current.children[slideIndex] as HTMLElement;\n\n const scrollTo =\n slide.offsetLeft -\n (containerWidth - slide.offsetWidth) +\n gapRef.current.offsetWidth;\n\n if (scrollTo <= 2 * gapRef.current.offsetWidth) {\n return 0;\n }\n\n return scrollTo;\n }\n\n function getScrollToRight(offset: number): number {\n if (!refContainer.current || !gapRef.current) {\n return offset;\n }\n\n const containerWidth = refContainer.current.offsetWidth;\n const slide = Array.prototype.find.call(\n refContainer.current.children,\n (el: HTMLElement) =>\n el.offsetLeft + el.offsetWidth - offset > containerWidth\n ) as HTMLElement;\n\n if (!slide) {\n return offset;\n }\n\n return slide.offsetLeft - gapRef.current.offsetWidth;\n }\n\n return (\n <div\n {...restProps}\n vkuiClass={classNames(\n getClassName(\"CardScroll\", platform),\n `CardScroll--sizeX-${sizeX}`,\n `CardScroll--${size}`,\n { [\"CardScroll--withSpaces\"]: withSpaces }\n )}\n >\n <HorizontalScroll\n getScrollToLeft={getScrollToLeft}\n getScrollToRight={getScrollToRight}\n showArrows={showArrows}\n >\n <div vkuiClass=\"CardScroll__in\" ref={refContainer}>\n <span vkuiClass=\"CardScroll__gap\" ref={gapRef} />\n {children}\n <span vkuiClass=\"CardScroll__gap\" />\n </div>\n </HorizontalScroll>\n </div>\n );\n};\n\nCardScroll.defaultProps = {\n size: \"s\",\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default withAdaptivity(CardScroll, { sizeX: true });\n"],"file":"CardScroll.js"}
1
+ {"version":3,"sources":["../../../src/components/CardScroll/CardScroll.tsx"],"names":["React","classNames","getClassName","useAdaptivity","usePlatform","HorizontalScroll","useDOM","CardScroll","children","size","showArrows","withSpaces","restProps","platform","sizeX","refContainer","useRef","gapRef","window","getScrollToLeft","offset","current","containerWidth","offsetWidth","slideIndex","Array","from","findIndex","el","offsetLeft","parseInt","getComputedStyle","marginRight","slide","scrollTo","getScrollToRight","prototype","find","call"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport HorizontalScroll, {\n HorizontalScrollProps,\n} from \"../HorizontalScroll/HorizontalScroll\";\nimport { useDOM } from \"../../lib/dom\";\nimport \"./CardScroll.css\";\n\nexport interface CardScrollProps extends React.HTMLAttributes<HTMLDivElement> {\n /**\n * При `size=false` ширина `Card` будет регулироваться контентом внутри. В остальных случаях будет явно задана в процентах.\n */\n size?: \"s\" | \"m\" | \"l\" | false;\n showArrows?: HorizontalScrollProps[\"showArrows\"];\n withSpaces?: boolean;\n}\n\nexport const CardScroll: React.FC<CardScrollProps> = ({\n children,\n size = \"s\",\n showArrows = true,\n withSpaces = true,\n ...restProps\n}: CardScrollProps) => {\n const platform = usePlatform();\n const { sizeX } = useAdaptivity();\n\n const refContainer = React.useRef<HTMLDivElement>(null);\n const gapRef = React.useRef<HTMLDivElement>(null);\n\n const { window } = useDOM();\n\n function getScrollToLeft(offset: number): number {\n if (!refContainer.current || !gapRef.current) {\n return offset;\n }\n const containerWidth = refContainer.current.offsetWidth;\n const slideIndex = (\n Array.from(refContainer.current.children) as HTMLElement[]\n ).findIndex(\n (el: HTMLElement) =>\n el.offsetLeft +\n el.offsetWidth +\n parseInt(window!.getComputedStyle(el).marginRight) -\n offset >=\n 0\n );\n\n if (slideIndex === -1) {\n return offset;\n }\n\n if (slideIndex === 0) {\n return 0;\n }\n\n const slide = refContainer.current.children[slideIndex] as HTMLElement;\n\n const scrollTo =\n slide.offsetLeft -\n (containerWidth - slide.offsetWidth) +\n gapRef.current.offsetWidth;\n\n if (scrollTo <= 2 * gapRef.current.offsetWidth) {\n return 0;\n }\n\n return scrollTo;\n }\n\n function getScrollToRight(offset: number): number {\n if (!refContainer.current || !gapRef.current) {\n return offset;\n }\n\n const containerWidth = refContainer.current.offsetWidth;\n const slide = Array.prototype.find.call(\n refContainer.current.children,\n (el: HTMLElement) =>\n el.offsetLeft + el.offsetWidth - offset > containerWidth\n ) as HTMLElement;\n\n if (!slide) {\n return offset;\n }\n\n return slide.offsetLeft - gapRef.current.offsetWidth;\n }\n\n return (\n <div\n {...restProps}\n vkuiClass={classNames(\n getClassName(\"CardScroll\", platform),\n `CardScroll--sizeX-${sizeX}`,\n `CardScroll--${size}`,\n { [\"CardScroll--withSpaces\"]: withSpaces }\n )}\n >\n <HorizontalScroll\n getScrollToLeft={getScrollToLeft}\n getScrollToRight={getScrollToRight}\n showArrows={showArrows}\n >\n <div vkuiClass=\"CardScroll__in\" ref={refContainer}>\n <span vkuiClass=\"CardScroll__gap\" ref={gapRef} />\n {children}\n <span vkuiClass=\"CardScroll__gap\" />\n </div>\n </HorizontalScroll>\n </div>\n );\n};\n"],"file":"CardScroll.js"}
@@ -12,5 +12,5 @@ export interface ChipProps extends React.HTMLAttributes<HTMLDivElement> {
12
12
  before?: React.ReactNode;
13
13
  after?: React.ReactNode;
14
14
  }
15
- declare const Chip: React.FC<ChipProps>;
16
- export default Chip;
15
+ export declare const Chip: React.FC<ChipProps>;
16
+ export {};
@@ -8,8 +8,7 @@ import { getTitleFromChildren, hasReactNode, noop } from "../../lib/utils";
8
8
  import { classNames } from "../../lib/classNames";
9
9
  import Caption from "../Typography/Caption/Caption";
10
10
  import Tappable from "../Tappable/Tappable";
11
-
12
- var Chip = function Chip(_ref) {
11
+ export var Chip = function Chip(_ref) {
13
12
  var _ref$value = _ref.value,
14
13
  value = _ref$value === void 0 ? "" : _ref$value,
15
14
  option = _ref.option,
@@ -58,8 +57,5 @@ var Chip = function Chip(_ref) {
58
57
  }, createScopedElement(Icon16Cancel, {
59
58
  "aria-hidden": true
60
59
  }))));
61
- }; // eslint-disable-next-line import/no-default-export
62
-
63
-
64
- export default Chip;
60
+ };
65
61
  //# sourceMappingURL=Chip.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Chip/Chip.tsx"],"names":["React","Icon16Cancel","getTitleFromChildren","hasReactNode","noop","classNames","Caption","Tappable","Chip","value","option","removable","onRemove","removeAriaLabel","before","after","children","restProps","onRemoveWrapper","useCallback","event","title"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,YAAT,QAA6B,kBAA7B;AACA,SAASC,oBAAT,EAA+BC,YAA/B,EAA6CC,IAA7C;AACA,SAASC,UAAT;AACA,OAAOC,OAAP;AACA,OAAOC,QAAP;;AAeA,IAAMC,IAAyB,GAAG,SAA5BA,IAA4B,OAUjB;AAAA,wBATfC,KASe;AAAA,MATfA,KASe,2BATP,EASO;AAAA,MARfC,MAQe,QARfA,MAQe;AAAA,4BAPfC,SAOe;AAAA,MAPfA,SAOe,+BAPH,IAOG;AAAA,2BANfC,QAMe;AAAA,MANfA,QAMe,8BANJR,IAMI;AAAA,kCALfS,eAKe;AAAA,MALfA,eAKe,qCALG,SAKH;AAAA,yBAJfC,MAIe;AAAA,MAJfA,MAIe,4BAJN,IAIM;AAAA,MAHfC,KAGe,QAHfA,KAGe;AAAA,MAFfC,QAEe,QAFfA,QAEe;AAAA,MADZC,SACY;;AACf,MAAMC,eAAe,GAAGlB,KAAK,CAACmB,WAAN,CACtB,UAACC,KAAD,EAA6B;AAC3BR,IAAAA,QAAQ,CAACQ,KAAD,EAAQX,KAAR,CAAR;AACD,GAHqB,EAItB,CAACG,QAAD,EAAWH,KAAX,CAJsB,CAAxB;AAMA,MAAMY,KAAK,GAAGnB,oBAAoB,CAACc,QAAD,CAAlC;AAEA,SACE;AACE,IAAA,SAAS,EAAEX,UAAU,CAAC,MAAD,EAAS;AAAE,yBAAmBM;AAArB,KAAT,CADvB;AAEE,IAAA,IAAI,EAAC,QAFP;AAGE,kBAAYU;AAHd,KAIMJ,SAJN,GAME;AAAK,IAAA,SAAS,EAAC,UAAf;AAA0B,IAAA,IAAI,EAAC;AAA/B,KACGd,YAAY,CAACW,MAAD,CAAZ,IAAwB;AAAK,IAAA,SAAS,EAAC;AAAf,KAA+BA,MAA/B,CAD3B,EAEE,oBAAC,OAAD;AACE,IAAA,KAAK,EAAC,GADR;AAEE,IAAA,MAAM,EAAC,SAFT;AAGE,IAAA,SAAS,EAAC,eAHZ;AAIE,IAAA,KAAK,EAAEO,KAJT;AAKE,mBAAY;AALd,KAOGL,QAPH,CAFF,EAWGb,YAAY,CAACY,KAAD,CAAZ,IAAuB;AAAK,IAAA,SAAS,EAAC;AAAf,KAA8BA,KAA9B,CAX1B,EAaGJ,SAAS,IACR,oBAAC,QAAD;AACE,IAAA,SAAS,EAAC,QADZ;AAEE,IAAA,SAAS,EAAC,cAFZ;AAGE,IAAA,OAAO,EAAEO,eAHX;AAIE,IAAA,QAAQ,EAAE,KAJZ;AAKE,IAAA,SAAS,EAAE,KALb;AAME,4BAAeL,eAAf,cAAkCQ,KAAlC;AANF,KAQE,oBAAC,YAAD;AAAc,mBAAa;AAA3B,IARF,CAdJ,CANF,CADF;AAmCD,CAtDD,C,CAwDA;;;AACA,eAAeb,IAAf","sourcesContent":["import * as React from \"react\";\nimport { Icon16Cancel } from \"@vkontakte/icons\";\nimport { getTitleFromChildren, hasReactNode, noop } from \"../../lib/utils\";\nimport { classNames } from \"../../lib/classNames\";\nimport Caption from \"../Typography/Caption/Caption\";\nimport Tappable from \"../Tappable/Tappable\";\nimport \"./Chip.css\";\n\ntype ChipValue = string | number;\n\nexport interface ChipProps extends React.HTMLAttributes<HTMLDivElement> {\n value: ChipValue;\n option?: { value?: ChipValue };\n onRemove?: (event?: React.MouseEvent, value?: ChipValue) => void;\n removable?: boolean;\n removeAriaLabel?: string;\n before?: React.ReactNode;\n after?: React.ReactNode;\n}\n\nconst Chip: React.FC<ChipProps> = ({\n value = \"\",\n option,\n removable = true,\n onRemove = noop,\n removeAriaLabel = \"Удалить\",\n before = null,\n after,\n children,\n ...restProps\n}: ChipProps) => {\n const onRemoveWrapper = React.useCallback(\n (event: React.MouseEvent) => {\n onRemove(event, value);\n },\n [onRemove, value]\n );\n const title = getTitleFromChildren(children);\n\n return (\n <div\n vkuiClass={classNames(\"Chip\", { \"Chip--removable\": removable })}\n role=\"option\"\n aria-label={title}\n {...restProps}\n >\n <div vkuiClass=\"Chip__in\" role=\"presentation\">\n {hasReactNode(before) && <div vkuiClass=\"Chip__before\">{before}</div>}\n <Caption\n level=\"1\"\n weight=\"regular\"\n vkuiClass=\"Chip__content\"\n title={title}\n aria-hidden=\"true\"\n >\n {children}\n </Caption>\n {hasReactNode(after) && <div vkuiClass=\"Chip__after\">{after}</div>}\n\n {removable && (\n <Tappable\n Component=\"button\"\n vkuiClass=\"Chip__remove\"\n onClick={onRemoveWrapper}\n hasHover={false}\n hasActive={false}\n aria-label={`${removeAriaLabel} ${title}`}\n >\n <Icon16Cancel aria-hidden={true} />\n </Tappable>\n )}\n </div>\n </div>\n );\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default Chip;\n"],"file":"Chip.js"}
1
+ {"version":3,"sources":["../../../src/components/Chip/Chip.tsx"],"names":["React","Icon16Cancel","getTitleFromChildren","hasReactNode","noop","classNames","Caption","Tappable","Chip","value","option","removable","onRemove","removeAriaLabel","before","after","children","restProps","onRemoveWrapper","useCallback","event","title"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,YAAT,QAA6B,kBAA7B;AACA,SAASC,oBAAT,EAA+BC,YAA/B,EAA6CC,IAA7C;AACA,SAASC,UAAT;AACA,OAAOC,OAAP;AACA,OAAOC,QAAP;AAeA,OAAO,IAAMC,IAAyB,GAAG,SAA5BA,IAA4B,OAUxB;AAAA,wBATfC,KASe;AAAA,MATfA,KASe,2BATP,EASO;AAAA,MARfC,MAQe,QARfA,MAQe;AAAA,4BAPfC,SAOe;AAAA,MAPfA,SAOe,+BAPH,IAOG;AAAA,2BANfC,QAMe;AAAA,MANfA,QAMe,8BANJR,IAMI;AAAA,kCALfS,eAKe;AAAA,MALfA,eAKe,qCALG,SAKH;AAAA,yBAJfC,MAIe;AAAA,MAJfA,MAIe,4BAJN,IAIM;AAAA,MAHfC,KAGe,QAHfA,KAGe;AAAA,MAFfC,QAEe,QAFfA,QAEe;AAAA,MADZC,SACY;;AACf,MAAMC,eAAe,GAAGlB,KAAK,CAACmB,WAAN,CACtB,UAACC,KAAD,EAA6B;AAC3BR,IAAAA,QAAQ,CAACQ,KAAD,EAAQX,KAAR,CAAR;AACD,GAHqB,EAItB,CAACG,QAAD,EAAWH,KAAX,CAJsB,CAAxB;AAMA,MAAMY,KAAK,GAAGnB,oBAAoB,CAACc,QAAD,CAAlC;AAEA,SACE;AACE,IAAA,SAAS,EAAEX,UAAU,CAAC,MAAD,EAAS;AAAE,yBAAmBM;AAArB,KAAT,CADvB;AAEE,IAAA,IAAI,EAAC,QAFP;AAGE,kBAAYU;AAHd,KAIMJ,SAJN,GAME;AAAK,IAAA,SAAS,EAAC,UAAf;AAA0B,IAAA,IAAI,EAAC;AAA/B,KACGd,YAAY,CAACW,MAAD,CAAZ,IAAwB;AAAK,IAAA,SAAS,EAAC;AAAf,KAA+BA,MAA/B,CAD3B,EAEE,oBAAC,OAAD;AACE,IAAA,KAAK,EAAC,GADR;AAEE,IAAA,MAAM,EAAC,SAFT;AAGE,IAAA,SAAS,EAAC,eAHZ;AAIE,IAAA,KAAK,EAAEO,KAJT;AAKE,mBAAY;AALd,KAOGL,QAPH,CAFF,EAWGb,YAAY,CAACY,KAAD,CAAZ,IAAuB;AAAK,IAAA,SAAS,EAAC;AAAf,KAA8BA,KAA9B,CAX1B,EAaGJ,SAAS,IACR,oBAAC,QAAD;AACE,IAAA,SAAS,EAAC,QADZ;AAEE,IAAA,SAAS,EAAC,cAFZ;AAGE,IAAA,OAAO,EAAEO,eAHX;AAIE,IAAA,QAAQ,EAAE,KAJZ;AAKE,IAAA,SAAS,EAAE,KALb;AAME,4BAAeL,eAAf,cAAkCQ,KAAlC;AANF,KAQE,oBAAC,YAAD;AAAc,mBAAa;AAA3B,IARF,CAdJ,CANF,CADF;AAmCD,CAtDM","sourcesContent":["import * as React from \"react\";\nimport { Icon16Cancel } from \"@vkontakte/icons\";\nimport { getTitleFromChildren, hasReactNode, noop } from \"../../lib/utils\";\nimport { classNames } from \"../../lib/classNames\";\nimport Caption from \"../Typography/Caption/Caption\";\nimport Tappable from \"../Tappable/Tappable\";\nimport \"./Chip.css\";\n\ntype ChipValue = string | number;\n\nexport interface ChipProps extends React.HTMLAttributes<HTMLDivElement> {\n value: ChipValue;\n option?: { value?: ChipValue };\n onRemove?: (event?: React.MouseEvent, value?: ChipValue) => void;\n removable?: boolean;\n removeAriaLabel?: string;\n before?: React.ReactNode;\n after?: React.ReactNode;\n}\n\nexport const Chip: React.FC<ChipProps> = ({\n value = \"\",\n option,\n removable = true,\n onRemove = noop,\n removeAriaLabel = \"Удалить\",\n before = null,\n after,\n children,\n ...restProps\n}: ChipProps) => {\n const onRemoveWrapper = React.useCallback(\n (event: React.MouseEvent) => {\n onRemove(event, value);\n },\n [onRemove, value]\n );\n const title = getTitleFromChildren(children);\n\n return (\n <div\n vkuiClass={classNames(\"Chip\", { \"Chip--removable\": removable })}\n role=\"option\"\n aria-label={title}\n {...restProps}\n >\n <div vkuiClass=\"Chip__in\" role=\"presentation\">\n {hasReactNode(before) && <div vkuiClass=\"Chip__before\">{before}</div>}\n <Caption\n level=\"1\"\n weight=\"regular\"\n vkuiClass=\"Chip__content\"\n title={title}\n aria-hidden=\"true\"\n >\n {children}\n </Caption>\n {hasReactNode(after) && <div vkuiClass=\"Chip__after\">{after}</div>}\n\n {removable && (\n <Tappable\n Component=\"button\"\n vkuiClass=\"Chip__remove\"\n onClick={onRemoveWrapper}\n hasHover={false}\n hasActive={false}\n aria-label={`${removeAriaLabel} ${title}`}\n >\n <Icon16Cancel aria-hidden={true} />\n </Tappable>\n )}\n </div>\n </div>\n );\n};\n"],"file":"Chip.js"}
@@ -9,7 +9,7 @@ import { createScopedElement } from "../../lib/jsxRuntime";
9
9
  import * as React from "react";
10
10
  import { FormField } from "../FormField/FormField";
11
11
  import { classNames } from "../../lib/classNames";
12
- import Chip from "../Chip/Chip";
12
+ import { Chip } from "../Chip/Chip";
13
13
  import { noop } from "../../lib/utils";
14
14
  import { useChipsInput } from "./useChipsInput";
15
15
  import { useAdaptivity } from "../../hooks/useAdaptivity";
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/ChipsInput/ChipsInput.tsx"],"names":["React","FormField","classNames","Chip","noop","useChipsInput","useAdaptivity","prefixClass","useExternRef","chipsInputDefaultProps","type","onChange","onInputChange","onKeyDown","onBlur","onFocus","value","inputValue","inputAriaLabel","getOptionValue","option","getOptionLabel","label","getNewOptionData","_","renderChip","props","disabled","rest","ChipsInput","propsWithDefault","style","children","className","getRef","getRootRef","placeholder","after","restProps","sizeY","useState","focused","setFocused","fieldValue","addOptionFromInput","removeOption","selectedOptions","handleInputChange","inputRef","isDisabled","readOnly","handleKeyDown","e","preventDefault","key","defaultPrevented","length","handleBlur","handleFocus","handleChipRemove","undefined","handleClick","current","focus","map","onRemove","Boolean"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { HasAlign, HasRef, HasRootRef } from \"../../types\";\nimport { FormField, FormFieldProps } from \"../FormField/FormField\";\nimport { classNames } from \"../../lib/classNames\";\nimport Chip, { ChipProps } from \"../Chip/Chip\";\nimport { noop } from \"../../lib/utils\";\nimport { useChipsInput } from \"./useChipsInput\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { prefixClass } from \"../../lib/prefixClass\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport \"./ChipsInput.css\";\n\nexport type ChipsInputValue = string | number;\n\nexport interface ChipsInputOption {\n value?: ChipsInputValue;\n label?: string;\n [otherProp: string]: any;\n}\n\nexport interface RenderChip<Option extends ChipsInputOption> extends ChipProps {\n label: string;\n option: Option;\n disabled: boolean;\n}\n\nexport interface ChipsInputProps<Option extends ChipsInputOption>\n extends Omit<\n React.InputHTMLAttributes<HTMLInputElement>,\n \"value\" | \"onChange\"\n >,\n HasRef<HTMLInputElement>,\n HasRootRef<HTMLDivElement>,\n HasAlign,\n FormFieldProps {\n value: Option[];\n inputValue?: string;\n onChange?: (o: Option[]) => void;\n onInputChange?: (e?: React.ChangeEvent<HTMLInputElement>) => void;\n getOptionValue?: (o?: Option) => ChipsInputValue;\n getOptionLabel?: (o?: Option) => string;\n getNewOptionData?: (v?: ChipsInputValue, l?: string) => Option;\n renderChip?: (props?: RenderChip<Option>) => React.ReactNode;\n inputAriaLabel?: string;\n}\n\nexport const chipsInputDefaultProps: ChipsInputProps<any> = {\n type: \"text\",\n onChange: noop,\n onInputChange: noop,\n onKeyDown: noop,\n onBlur: noop,\n onFocus: noop,\n value: [],\n inputValue: \"\",\n inputAriaLabel: \"Введите ваше значение...\",\n getOptionValue: (option) => option.value,\n getOptionLabel: (option) => option.label,\n getNewOptionData: (_, label) => ({\n value: label,\n label,\n }),\n renderChip(props) {\n if (!props) {\n return null;\n }\n\n const { disabled, value, label, ...rest } = props;\n return (\n <Chip value={value} removable={!disabled} {...rest}>\n {label}\n </Chip>\n );\n },\n};\n\nconst ChipsInput = <Option extends ChipsInputOption>(\n props: ChipsInputProps<Option>\n) => {\n const propsWithDefault = { ...chipsInputDefaultProps, ...props };\n const {\n style,\n value,\n onChange,\n onInputChange,\n onKeyDown,\n onBlur,\n onFocus,\n children,\n className,\n inputValue,\n getRef,\n getRootRef,\n placeholder,\n getOptionValue,\n getOptionLabel,\n getNewOptionData,\n renderChip,\n after,\n inputAriaLabel,\n ...restProps\n } = propsWithDefault;\n const { sizeY } = useAdaptivity();\n\n const [focused, setFocused] = React.useState(false);\n const {\n fieldValue,\n addOptionFromInput,\n removeOption,\n selectedOptions,\n handleInputChange,\n } = useChipsInput(propsWithDefault);\n const inputRef = useExternRef(getRef);\n\n const isDisabled = restProps.disabled || restProps.readOnly;\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (isDisabled) {\n e.preventDefault();\n return;\n }\n\n onKeyDown!(e);\n\n if (\n e.key === \"Backspace\" &&\n !e.defaultPrevented &&\n !fieldValue &&\n selectedOptions.length\n ) {\n removeOption(\n getOptionValue!(selectedOptions[selectedOptions.length - 1])\n );\n e.preventDefault();\n }\n\n if (e.key === \"Enter\" && !e.defaultPrevented && fieldValue) {\n addOptionFromInput();\n e.preventDefault();\n }\n };\n\n const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n if (focused) {\n setFocused(false);\n }\n onBlur!(e);\n };\n\n const handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n if (!focused) {\n setFocused(true);\n }\n onFocus!(e);\n };\n\n const handleChipRemove = (\n _: React.MouseEvent | undefined,\n value: ChipsInputValue | undefined\n ) => {\n if (value !== undefined) {\n removeOption(value);\n }\n };\n\n const handleClick = (e: React.MouseEvent<HTMLDivElement>) => {\n if (isDisabled) {\n e.preventDefault();\n return;\n }\n\n if (inputRef?.current !== null && !focused) {\n inputRef.current.focus();\n }\n };\n\n return (\n <FormField\n getRootRef={getRootRef}\n vkuiClass={classNames(\"ChipsInput\", `ChipsInput--sizeY-${sizeY}`, {\n \"ChipsInput--focused\": focused,\n \"ChipsInput--withChips\": !!selectedOptions.length,\n })}\n className={className}\n style={style}\n disabled={restProps.disabled}\n after={after}\n onClick={handleClick}\n role=\"application\"\n aria-disabled={restProps.disabled}\n aria-readonly={restProps.readOnly}\n >\n <div vkuiClass=\"ChipsInput__container\" role=\"presentation\">\n {selectedOptions.map((option: Option) => {\n const value = getOptionValue!(option);\n const label = getOptionLabel!(option);\n\n return (\n <React.Fragment key={`${typeof value}-${value}`}>\n {renderChip!({\n option,\n value,\n label,\n onRemove: handleChipRemove,\n disabled: Boolean(restProps.disabled),\n className: prefixClass(\"ChipsInput__chip\"),\n })}\n </React.Fragment>\n );\n })}\n <label\n vkuiClass=\"ChipsInput__input-container\"\n aria-label={inputAriaLabel}\n >\n <input\n ref={inputRef}\n value={fieldValue}\n autoCapitalize=\"none\"\n autoComplete=\"off\"\n autoCorrect=\"off\"\n spellCheck={false}\n aria-autocomplete=\"list\"\n vkuiClass=\"ChipsInput__el\"\n onChange={handleInputChange}\n onKeyDown={handleKeyDown}\n onFocus={handleFocus}\n onBlur={handleBlur}\n placeholder={selectedOptions.length ? undefined : placeholder}\n {...restProps}\n />\n </label>\n </div>\n </FormField>\n );\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default ChipsInput;\n"],"file":"ChipsInput.js"}
1
+ {"version":3,"sources":["../../../src/components/ChipsInput/ChipsInput.tsx"],"names":["React","FormField","classNames","Chip","noop","useChipsInput","useAdaptivity","prefixClass","useExternRef","chipsInputDefaultProps","type","onChange","onInputChange","onKeyDown","onBlur","onFocus","value","inputValue","inputAriaLabel","getOptionValue","option","getOptionLabel","label","getNewOptionData","_","renderChip","props","disabled","rest","ChipsInput","propsWithDefault","style","children","className","getRef","getRootRef","placeholder","after","restProps","sizeY","useState","focused","setFocused","fieldValue","addOptionFromInput","removeOption","selectedOptions","handleInputChange","inputRef","isDisabled","readOnly","handleKeyDown","e","preventDefault","key","defaultPrevented","length","handleBlur","handleFocus","handleChipRemove","undefined","handleClick","current","focus","map","onRemove","Boolean"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { HasAlign, HasRef, HasRootRef } from \"../../types\";\nimport { FormField, FormFieldProps } from \"../FormField/FormField\";\nimport { classNames } from \"../../lib/classNames\";\nimport { Chip, ChipProps } from \"../Chip/Chip\";\nimport { noop } from \"../../lib/utils\";\nimport { useChipsInput } from \"./useChipsInput\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { prefixClass } from \"../../lib/prefixClass\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport \"./ChipsInput.css\";\n\nexport type ChipsInputValue = string | number;\n\nexport interface ChipsInputOption {\n value?: ChipsInputValue;\n label?: string;\n [otherProp: string]: any;\n}\n\nexport interface RenderChip<Option extends ChipsInputOption> extends ChipProps {\n label: string;\n option: Option;\n disabled: boolean;\n}\n\nexport interface ChipsInputProps<Option extends ChipsInputOption>\n extends Omit<\n React.InputHTMLAttributes<HTMLInputElement>,\n \"value\" | \"onChange\"\n >,\n HasRef<HTMLInputElement>,\n HasRootRef<HTMLDivElement>,\n HasAlign,\n FormFieldProps {\n value: Option[];\n inputValue?: string;\n onChange?: (o: Option[]) => void;\n onInputChange?: (e?: React.ChangeEvent<HTMLInputElement>) => void;\n getOptionValue?: (o?: Option) => ChipsInputValue;\n getOptionLabel?: (o?: Option) => string;\n getNewOptionData?: (v?: ChipsInputValue, l?: string) => Option;\n renderChip?: (props?: RenderChip<Option>) => React.ReactNode;\n inputAriaLabel?: string;\n}\n\nexport const chipsInputDefaultProps: ChipsInputProps<any> = {\n type: \"text\",\n onChange: noop,\n onInputChange: noop,\n onKeyDown: noop,\n onBlur: noop,\n onFocus: noop,\n value: [],\n inputValue: \"\",\n inputAriaLabel: \"Введите ваше значение...\",\n getOptionValue: (option) => option.value,\n getOptionLabel: (option) => option.label,\n getNewOptionData: (_, label) => ({\n value: label,\n label,\n }),\n renderChip(props) {\n if (!props) {\n return null;\n }\n\n const { disabled, value, label, ...rest } = props;\n return (\n <Chip value={value} removable={!disabled} {...rest}>\n {label}\n </Chip>\n );\n },\n};\n\nconst ChipsInput = <Option extends ChipsInputOption>(\n props: ChipsInputProps<Option>\n) => {\n const propsWithDefault = { ...chipsInputDefaultProps, ...props };\n const {\n style,\n value,\n onChange,\n onInputChange,\n onKeyDown,\n onBlur,\n onFocus,\n children,\n className,\n inputValue,\n getRef,\n getRootRef,\n placeholder,\n getOptionValue,\n getOptionLabel,\n getNewOptionData,\n renderChip,\n after,\n inputAriaLabel,\n ...restProps\n } = propsWithDefault;\n const { sizeY } = useAdaptivity();\n\n const [focused, setFocused] = React.useState(false);\n const {\n fieldValue,\n addOptionFromInput,\n removeOption,\n selectedOptions,\n handleInputChange,\n } = useChipsInput(propsWithDefault);\n const inputRef = useExternRef(getRef);\n\n const isDisabled = restProps.disabled || restProps.readOnly;\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (isDisabled) {\n e.preventDefault();\n return;\n }\n\n onKeyDown!(e);\n\n if (\n e.key === \"Backspace\" &&\n !e.defaultPrevented &&\n !fieldValue &&\n selectedOptions.length\n ) {\n removeOption(\n getOptionValue!(selectedOptions[selectedOptions.length - 1])\n );\n e.preventDefault();\n }\n\n if (e.key === \"Enter\" && !e.defaultPrevented && fieldValue) {\n addOptionFromInput();\n e.preventDefault();\n }\n };\n\n const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n if (focused) {\n setFocused(false);\n }\n onBlur!(e);\n };\n\n const handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n if (!focused) {\n setFocused(true);\n }\n onFocus!(e);\n };\n\n const handleChipRemove = (\n _: React.MouseEvent | undefined,\n value: ChipsInputValue | undefined\n ) => {\n if (value !== undefined) {\n removeOption(value);\n }\n };\n\n const handleClick = (e: React.MouseEvent<HTMLDivElement>) => {\n if (isDisabled) {\n e.preventDefault();\n return;\n }\n\n if (inputRef?.current !== null && !focused) {\n inputRef.current.focus();\n }\n };\n\n return (\n <FormField\n getRootRef={getRootRef}\n vkuiClass={classNames(\"ChipsInput\", `ChipsInput--sizeY-${sizeY}`, {\n \"ChipsInput--focused\": focused,\n \"ChipsInput--withChips\": !!selectedOptions.length,\n })}\n className={className}\n style={style}\n disabled={restProps.disabled}\n after={after}\n onClick={handleClick}\n role=\"application\"\n aria-disabled={restProps.disabled}\n aria-readonly={restProps.readOnly}\n >\n <div vkuiClass=\"ChipsInput__container\" role=\"presentation\">\n {selectedOptions.map((option: Option) => {\n const value = getOptionValue!(option);\n const label = getOptionLabel!(option);\n\n return (\n <React.Fragment key={`${typeof value}-${value}`}>\n {renderChip!({\n option,\n value,\n label,\n onRemove: handleChipRemove,\n disabled: Boolean(restProps.disabled),\n className: prefixClass(\"ChipsInput__chip\"),\n })}\n </React.Fragment>\n );\n })}\n <label\n vkuiClass=\"ChipsInput__input-container\"\n aria-label={inputAriaLabel}\n >\n <input\n ref={inputRef}\n value={fieldValue}\n autoCapitalize=\"none\"\n autoComplete=\"off\"\n autoCorrect=\"off\"\n spellCheck={false}\n aria-autocomplete=\"list\"\n vkuiClass=\"ChipsInput__el\"\n onChange={handleInputChange}\n onKeyDown={handleKeyDown}\n onFocus={handleFocus}\n onBlur={handleBlur}\n placeholder={selectedOptions.length ? undefined : placeholder}\n {...restProps}\n />\n </label>\n </div>\n </FormField>\n );\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default ChipsInput;\n"],"file":"ChipsInput.js"}
@@ -1,7 +1,7 @@
1
1
  import * as React from "react";
2
2
  import { ConfigProviderContextInterface } from "./ConfigProviderContext";
3
3
  import { AppearanceScheme } from "../../helpers/scheme";
4
- export interface ConfigProviderProps extends ConfigProviderContextInterface {
4
+ export interface ConfigProviderProps extends Partial<ConfigProviderContextInterface> {
5
5
  /**
6
6
  * @deprecated будет удалено в 5.0.0, устанавливать тему следует через appearance
7
7
  * Цветовая схема приложения
@@ -11,8 +11,7 @@ import { useObjectMemo } from "../../hooks/useObjectMemo";
11
11
  import { noop } from "../../lib/utils";
12
12
  import { warnOnce } from "../../lib/warnOnce";
13
13
  import { normalizeScheme, Scheme } from "../../helpers/scheme";
14
- import { AppearanceProvider } from "../AppearanceProvider/AppearanceProvider";
15
- import { Platform } from "../../lib/platform";
14
+ import { AppearanceProvider, generateVKUITokensClassName } from "../AppearanceProvider/AppearanceProvider";
16
15
  var warn = warnOnce("ConfigProvider");
17
16
 
18
17
  function useSchemeDetector(node, _scheme) {
@@ -54,29 +53,6 @@ var deriveAppearance = function deriveAppearance(scheme) {
54
53
  return scheme === Scheme.SPACE_GRAY || scheme === Scheme.VKCOM_DARK ? "dark" : "light";
55
54
  };
56
55
 
57
- var generateVKUITokensClassName = function generateVKUITokensClassName(platform, appearance) {
58
- var tokensPlatform;
59
-
60
- switch (platform) {
61
- case Platform.ANDROID:
62
- tokensPlatform = "vkBase";
63
- break;
64
-
65
- case Platform.IOS:
66
- tokensPlatform = "vkIOS";
67
- break;
68
-
69
- case Platform.VKCOM:
70
- tokensPlatform = "vkCom";
71
- break;
72
-
73
- default:
74
- tokensPlatform = platform;
75
- }
76
-
77
- return "vkui--".concat(tokensPlatform, "--").concat(appearance);
78
- };
79
-
80
56
  var ConfigProvider = function ConfigProvider(_ref) {
81
57
  var children = _ref.children,
82
58
  props = _objectWithoutProperties(_ref, _excluded);