@salutejs/plasma-new-hope 0.84.0-canary.1213.9187563305.0 → 0.84.0-dev.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (440) hide show
  1. package/cjs/components/Button/Button.css +6 -9
  2. package/cjs/components/Button/Button.js +2 -16
  3. package/cjs/components/Button/Button.js.map +1 -1
  4. package/cjs/components/Button/Button.styles.js +10 -31
  5. package/cjs/components/Button/Button.styles.js.map +1 -1
  6. package/cjs/components/Button/Button.styles_uqvh6u.css +5 -0
  7. package/cjs/components/Button/Button.tokens.js +0 -5
  8. package/cjs/components/Button/Button.tokens.js.map +1 -1
  9. package/cjs/components/Button/variations/_stretching/base.js +1 -1
  10. package/cjs/components/Button/variations/_stretching/base.js.map +1 -1
  11. package/{es/components/Button/variations/_stretching/base_hy8dc.css → cjs/components/Button/variations/_stretching/base_1lx0ute.css} +1 -1
  12. package/cjs/components/ButtonGroup/ButtonGroup.css +2 -2
  13. package/cjs/components/ButtonGroup/ButtonGroup.tokens.js +0 -1
  14. package/cjs/components/ButtonGroup/ButtonGroup.tokens.js.map +1 -1
  15. package/cjs/components/ButtonGroup/variations/_orientation/base.js +1 -1
  16. package/cjs/components/ButtonGroup/variations/_orientation/base.js.map +1 -1
  17. package/{es/components/ButtonGroup/variations/_orientation/base_y7z7cs.css → cjs/components/ButtonGroup/variations/_orientation/base_p85v51.css} +1 -1
  18. package/cjs/components/ButtonGroup/variations/_view/base.js +1 -1
  19. package/cjs/components/ButtonGroup/variations/_view/base.js.map +1 -1
  20. package/cjs/components/ButtonGroup/variations/_view/base_6k3uip.css +1 -0
  21. package/cjs/components/Combobox/hooks/useFocusController.js +1 -0
  22. package/cjs/components/Combobox/hooks/useFocusController.js.map +1 -1
  23. package/cjs/components/Drawer/Drawer.css +6 -9
  24. package/cjs/components/Drawer/ui/DrawerContent/DrawerContent.css +6 -9
  25. package/cjs/components/Header/ui/HeaderArrow/HeaderArrow.css +6 -9
  26. package/cjs/components/Header/ui/HeaderArrow/HeaderArrow.js +2 -4
  27. package/cjs/components/Header/ui/HeaderArrow/HeaderArrow.js.map +1 -1
  28. package/cjs/components/IconButton/IconButton.css +7 -10
  29. package/cjs/components/IconButton/IconButton.styles.js +1 -1
  30. package/cjs/components/IconButton/{IconButton.styles_7v8g0e.css → IconButton.styles_1hknr37.css} +1 -1
  31. package/cjs/components/Notification/Notification.css +6 -9
  32. package/cjs/components/Notification/NotificationsProvider.css +6 -9
  33. package/cjs/components/Pagination/Pagination.css +8 -11
  34. package/cjs/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.css +6 -9
  35. package/cjs/components/Panel/ui/PanelHeader/PanelHeader.css +6 -9
  36. package/cjs/components/Select/Select.css +6 -9
  37. package/cjs/components/Select/ui/SelectTarget/SelectTarget.css +6 -9
  38. package/cjs/components/Slider/Slider.css +69 -0
  39. package/cjs/components/Slider/Slider.js +48 -0
  40. package/cjs/components/Slider/Slider.js.map +1 -0
  41. package/cjs/components/Slider/Slider.tokens.js +79 -0
  42. package/cjs/components/Slider/Slider.tokens.js.map +1 -0
  43. package/cjs/components/Slider/components/Double/Double.css +62 -0
  44. package/cjs/components/Slider/components/Double/Double.js +306 -0
  45. package/cjs/components/Slider/components/Double/Double.js.map +1 -0
  46. package/cjs/components/Slider/components/Double/Double.styles.js +61 -0
  47. package/cjs/components/Slider/components/Double/Double.styles.js.map +1 -0
  48. package/cjs/components/Slider/components/Double/Double.styles_1jhda4u.css +7 -0
  49. package/cjs/components/Slider/components/Single/Single.css +16 -0
  50. package/cjs/components/Slider/components/Single/Single.js +164 -0
  51. package/cjs/components/Slider/components/Single/Single.js.map +1 -0
  52. package/cjs/components/Slider/components/Single/Single.styles.js +45 -0
  53. package/cjs/components/Slider/components/Single/Single.styles.js.map +1 -0
  54. package/cjs/components/Slider/components/Single/Single.styles_1r9f1e0.css +6 -0
  55. package/cjs/components/Slider/components/SliderBase/SliderBase.css +4 -0
  56. package/cjs/components/Slider/components/SliderBase/SliderBase.js +82 -0
  57. package/cjs/components/Slider/components/SliderBase/SliderBase.js.map +1 -0
  58. package/cjs/components/Slider/components/SliderBase/SliderBase.styles.js +33 -0
  59. package/cjs/components/Slider/components/SliderBase/SliderBase.styles.js.map +1 -0
  60. package/cjs/components/Slider/components/SliderBase/SliderBase.styles_7is2ll.css +4 -0
  61. package/cjs/components/Slider/ui/Handler/Handler.css +4 -0
  62. package/cjs/components/Slider/ui/Handler/Handler.js +168 -0
  63. package/cjs/components/Slider/ui/Handler/Handler.js.map +1 -0
  64. package/cjs/components/Slider/ui/Handler/Handler.styles.js +21 -0
  65. package/cjs/components/Slider/ui/Handler/Handler.styles.js.map +1 -0
  66. package/cjs/components/Slider/ui/Handler/Handler.styles_8crx5z.css +2 -0
  67. package/cjs/components/Slider/ui/Thumb/Thumb.css +1 -0
  68. package/cjs/components/Slider/ui/Thumb/Thumb.js +31 -0
  69. package/cjs/components/Slider/ui/Thumb/Thumb.js.map +1 -0
  70. package/cjs/components/Slider/ui/Thumb/Thumb.styles.js +15 -0
  71. package/cjs/components/Slider/ui/Thumb/Thumb.styles.js.map +1 -0
  72. package/cjs/components/Slider/ui/Thumb/Thumb.styles_4w4gzn.css +1 -0
  73. package/cjs/components/Slider/utils/index.js +56 -0
  74. package/cjs/components/Slider/utils/index.js.map +1 -0
  75. package/cjs/components/Slider/variations/_disabled/base.js +9 -0
  76. package/cjs/components/Slider/variations/_disabled/base.js.map +1 -0
  77. package/cjs/components/Slider/variations/_disabled/base_x642ct.css +1 -0
  78. package/cjs/components/Slider/variations/_size/base.js +9 -0
  79. package/cjs/components/Slider/variations/_size/base.js.map +1 -0
  80. package/cjs/components/Slider/variations/_size/base_x642ct.css +1 -0
  81. package/cjs/components/Slider/variations/_view/base.js +9 -0
  82. package/cjs/components/Slider/variations/_view/base.js.map +1 -0
  83. package/cjs/components/Slider/variations/_view/base_x642ct.css +1 -0
  84. package/cjs/components/TextField/TextField.js +12 -3
  85. package/cjs/components/TextField/TextField.js.map +1 -1
  86. package/cjs/components/Toast/Toast.css +6 -9
  87. package/cjs/components/Toast/ToastController.css +6 -9
  88. package/cjs/engines/common.js +4 -0
  89. package/cjs/engines/common.js.map +1 -1
  90. package/cjs/engines/index.js.map +1 -1
  91. package/cjs/hooks/useIsomorphicLayoutEffect.js +15 -0
  92. package/cjs/hooks/useIsomorphicLayoutEffect.js.map +1 -0
  93. package/cjs/index.css +34 -12
  94. package/cjs/index.js +14 -0
  95. package/cjs/index.js.map +1 -1
  96. package/cjs/utils/canUseDOM.js +12 -0
  97. package/cjs/utils/canUseDOM.js.map +1 -0
  98. package/cjs/utils/index.js.map +1 -1
  99. package/es/components/Button/Button.css +6 -9
  100. package/es/components/Button/Button.js +3 -17
  101. package/es/components/Button/Button.js.map +1 -1
  102. package/es/components/Button/Button.styles.js +11 -29
  103. package/es/components/Button/Button.styles.js.map +1 -1
  104. package/es/components/Button/Button.styles_uqvh6u.css +5 -0
  105. package/es/components/Button/Button.tokens.js +0 -5
  106. package/es/components/Button/Button.tokens.js.map +1 -1
  107. package/es/components/Button/variations/_stretching/base.js +1 -1
  108. package/es/components/Button/variations/_stretching/base.js.map +1 -1
  109. package/{cjs/components/Button/variations/_stretching/base_hy8dc.css → es/components/Button/variations/_stretching/base_1lx0ute.css} +1 -1
  110. package/es/components/ButtonGroup/ButtonGroup.css +2 -2
  111. package/es/components/ButtonGroup/ButtonGroup.tokens.js +0 -1
  112. package/es/components/ButtonGroup/ButtonGroup.tokens.js.map +1 -1
  113. package/es/components/ButtonGroup/variations/_orientation/base.js +1 -1
  114. package/es/components/ButtonGroup/variations/_orientation/base.js.map +1 -1
  115. package/{cjs/components/ButtonGroup/variations/_orientation/base_y7z7cs.css → es/components/ButtonGroup/variations/_orientation/base_p85v51.css} +1 -1
  116. package/es/components/ButtonGroup/variations/_view/base.js +1 -1
  117. package/es/components/ButtonGroup/variations/_view/base.js.map +1 -1
  118. package/es/components/ButtonGroup/variations/_view/base_6k3uip.css +1 -0
  119. package/es/components/Combobox/hooks/useFocusController.js +1 -0
  120. package/es/components/Combobox/hooks/useFocusController.js.map +1 -1
  121. package/es/components/Drawer/Drawer.css +6 -9
  122. package/es/components/Drawer/ui/DrawerContent/DrawerContent.css +6 -9
  123. package/es/components/Header/ui/HeaderArrow/HeaderArrow.css +6 -9
  124. package/es/components/Header/ui/HeaderArrow/HeaderArrow.js +2 -4
  125. package/es/components/Header/ui/HeaderArrow/HeaderArrow.js.map +1 -1
  126. package/es/components/IconButton/IconButton.css +7 -10
  127. package/es/components/IconButton/IconButton.styles.js +1 -1
  128. package/es/components/IconButton/{IconButton.styles_7v8g0e.css → IconButton.styles_1hknr37.css} +1 -1
  129. package/es/components/Notification/Notification.css +6 -9
  130. package/es/components/Notification/NotificationsProvider.css +6 -9
  131. package/es/components/Pagination/Pagination.css +8 -11
  132. package/es/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.css +6 -9
  133. package/es/components/Panel/ui/PanelHeader/PanelHeader.css +6 -9
  134. package/es/components/Select/Select.css +6 -9
  135. package/es/components/Select/ui/SelectTarget/SelectTarget.css +6 -9
  136. package/es/components/Slider/Slider.css +69 -0
  137. package/es/components/Slider/Slider.js +43 -0
  138. package/es/components/Slider/Slider.js.map +1 -0
  139. package/es/components/Slider/Slider.tokens.js +74 -0
  140. package/es/components/Slider/Slider.tokens.js.map +1 -0
  141. package/es/components/Slider/components/Double/Double.css +62 -0
  142. package/es/components/Slider/components/Double/Double.js +302 -0
  143. package/es/components/Slider/components/Double/Double.js.map +1 -0
  144. package/es/components/Slider/components/Double/Double.styles.js +51 -0
  145. package/es/components/Slider/components/Double/Double.styles.js.map +1 -0
  146. package/es/components/Slider/components/Double/Double.styles_1jhda4u.css +7 -0
  147. package/es/components/Slider/components/Single/Single.css +16 -0
  148. package/es/components/Slider/components/Single/Single.js +160 -0
  149. package/es/components/Slider/components/Single/Single.js.map +1 -0
  150. package/es/components/Slider/components/Single/Single.styles.js +36 -0
  151. package/es/components/Slider/components/Single/Single.styles.js.map +1 -0
  152. package/es/components/Slider/components/Single/Single.styles_1r9f1e0.css +6 -0
  153. package/es/components/Slider/components/SliderBase/SliderBase.css +4 -0
  154. package/es/components/Slider/components/SliderBase/SliderBase.js +78 -0
  155. package/es/components/Slider/components/SliderBase/SliderBase.js.map +1 -0
  156. package/es/components/Slider/components/SliderBase/SliderBase.styles.js +26 -0
  157. package/es/components/Slider/components/SliderBase/SliderBase.styles.js.map +1 -0
  158. package/es/components/Slider/components/SliderBase/SliderBase.styles_7is2ll.css +4 -0
  159. package/es/components/Slider/ui/Handler/Handler.css +4 -0
  160. package/es/components/Slider/ui/Handler/Handler.js +164 -0
  161. package/es/components/Slider/ui/Handler/Handler.js.map +1 -0
  162. package/es/components/Slider/ui/Handler/Handler.styles.js +16 -0
  163. package/es/components/Slider/ui/Handler/Handler.styles.js.map +1 -0
  164. package/es/components/Slider/ui/Handler/Handler.styles_8crx5z.css +2 -0
  165. package/es/components/Slider/ui/Thumb/Thumb.css +1 -0
  166. package/es/components/Slider/ui/Thumb/Thumb.js +27 -0
  167. package/es/components/Slider/ui/Thumb/Thumb.js.map +1 -0
  168. package/es/components/Slider/ui/Thumb/Thumb.styles.js +11 -0
  169. package/es/components/Slider/ui/Thumb/Thumb.styles.js.map +1 -0
  170. package/es/components/Slider/ui/Thumb/Thumb.styles_4w4gzn.css +1 -0
  171. package/es/components/Slider/utils/index.js +50 -0
  172. package/es/components/Slider/utils/index.js.map +1 -0
  173. package/es/components/Slider/variations/_disabled/base.js +5 -0
  174. package/es/components/Slider/variations/_disabled/base.js.map +1 -0
  175. package/es/components/Slider/variations/_disabled/base_x642ct.css +1 -0
  176. package/es/components/Slider/variations/_size/base.js +5 -0
  177. package/es/components/Slider/variations/_size/base.js.map +1 -0
  178. package/es/components/Slider/variations/_size/base_x642ct.css +1 -0
  179. package/es/components/Slider/variations/_view/base.js +5 -0
  180. package/es/components/Slider/variations/_view/base.js.map +1 -0
  181. package/es/components/Slider/variations/_view/base_x642ct.css +1 -0
  182. package/es/components/TextField/TextField.js +12 -3
  183. package/es/components/TextField/TextField.js.map +1 -1
  184. package/es/components/Toast/Toast.css +6 -9
  185. package/es/components/Toast/ToastController.css +6 -9
  186. package/es/engines/common.js +4 -0
  187. package/es/engines/common.js.map +1 -1
  188. package/es/engines/index.js.map +1 -1
  189. package/es/hooks/useIsomorphicLayoutEffect.js +11 -0
  190. package/es/hooks/useIsomorphicLayoutEffect.js.map +1 -0
  191. package/es/index.css +34 -12
  192. package/es/index.js +8 -0
  193. package/es/index.js.map +1 -1
  194. package/es/utils/canUseDOM.js +8 -0
  195. package/es/utils/canUseDOM.js.map +1 -0
  196. package/es/utils/index.js.map +1 -1
  197. package/package.json +3 -2
  198. package/styled-components/cjs/components/Button/Button.js +2 -16
  199. package/styled-components/cjs/components/Button/Button.styles.js +12 -20
  200. package/styled-components/cjs/components/Button/Button.template-doc.mdx +0 -42
  201. package/styled-components/cjs/components/Button/Button.tokens.js +0 -5
  202. package/styled-components/cjs/components/Button/variations/_stretching/base.js +1 -1
  203. package/styled-components/cjs/components/ButtonGroup/ButtonGroup.tokens.js +0 -1
  204. package/styled-components/cjs/components/ButtonGroup/variations/_orientation/base.js +1 -2
  205. package/styled-components/cjs/components/ButtonGroup/variations/_view/base.js +1 -1
  206. package/styled-components/cjs/components/Header/ui/HeaderArrow/HeaderArrow.js +2 -4
  207. package/styled-components/cjs/components/Slider/Slider.js +47 -0
  208. package/styled-components/cjs/components/Slider/Slider.tokens.js +77 -0
  209. package/styled-components/cjs/components/Slider/Slider.types.js +5 -0
  210. package/styled-components/cjs/components/Slider/components/Double/Double.js +318 -0
  211. package/styled-components/cjs/components/Slider/components/Double/Double.styles.js +36 -0
  212. package/styled-components/cjs/components/Slider/components/Double/Double.types.js +5 -0
  213. package/styled-components/cjs/components/Slider/components/Single/Single.js +176 -0
  214. package/styled-components/cjs/components/Slider/components/Single/Single.styles.js +27 -0
  215. package/styled-components/cjs/components/Slider/components/Single/Single.types.js +5 -0
  216. package/styled-components/cjs/components/Slider/components/SliderBase/SliderBase.js +83 -0
  217. package/styled-components/cjs/components/Slider/components/SliderBase/SliderBase.styles.js +21 -0
  218. package/styled-components/cjs/components/Slider/components/SliderBase/SliderBase.types.js +5 -0
  219. package/styled-components/cjs/components/Slider/components/index.js +27 -0
  220. package/styled-components/cjs/components/Slider/index.js +32 -0
  221. package/styled-components/cjs/components/Slider/ui/Handler/Handler.js +177 -0
  222. package/styled-components/cjs/components/Slider/ui/Handler/Handler.styles.js +15 -0
  223. package/styled-components/cjs/components/Slider/ui/Handler/Handler.types.js +5 -0
  224. package/styled-components/cjs/components/Slider/ui/Thumb/Thumb.js +32 -0
  225. package/styled-components/cjs/components/Slider/ui/Thumb/Thumb.styles.js +18 -0
  226. package/styled-components/cjs/components/Slider/ui/Thumb/Thumb.types.js +5 -0
  227. package/styled-components/cjs/components/Slider/ui/index.js +63 -0
  228. package/styled-components/cjs/components/Slider/utils/index.js +55 -0
  229. package/styled-components/cjs/components/Slider/variations/_disabled/base.js +8 -0
  230. package/styled-components/cjs/components/Slider/variations/_disabled/tokens.json +4 -0
  231. package/styled-components/cjs/components/Slider/variations/_size/base.js +8 -0
  232. package/styled-components/cjs/components/Slider/variations/_size/tokens.json +0 -0
  233. package/styled-components/cjs/components/Slider/variations/_view/base.js +8 -0
  234. package/styled-components/cjs/components/Slider/variations/_view/tokens.json +0 -0
  235. package/styled-components/cjs/components/TextField/TextField.js +12 -3
  236. package/styled-components/cjs/engines/common.js +4 -0
  237. package/styled-components/cjs/examples/plasma_b2c/components/Button/Button.config.js +19 -19
  238. package/styled-components/cjs/examples/plasma_b2c/components/Button/Button.stories.tsx +21 -67
  239. package/styled-components/cjs/examples/plasma_b2c/components/ButtonGroup/ButtonGroup.config.js +10 -10
  240. package/styled-components/cjs/examples/plasma_b2c/components/ButtonGroup/ButtonGroup.stories.tsx +1 -1
  241. package/styled-components/cjs/examples/plasma_b2c/components/Slider/Slider.config.js +29 -0
  242. package/styled-components/cjs/examples/plasma_b2c/components/Slider/Slider.js +16 -0
  243. package/styled-components/cjs/examples/plasma_b2c/components/Slider/Slider.stories.tsx +169 -0
  244. package/styled-components/cjs/examples/plasma_web/components/Button/Button.config.js +19 -19
  245. package/styled-components/cjs/examples/plasma_web/components/Button/Button.stories.tsx +28 -90
  246. package/styled-components/cjs/examples/plasma_web/components/ButtonGroup/ButtonGroup.config.js +10 -10
  247. package/styled-components/cjs/examples/plasma_web/components/ButtonGroup/ButtonGroup.stories.tsx +1 -1
  248. package/styled-components/cjs/examples/plasma_web/components/Slider/Slider.config.js +29 -0
  249. package/styled-components/cjs/examples/plasma_web/components/Slider/Slider.js +16 -0
  250. package/styled-components/cjs/examples/plasma_web/components/Slider/Slider.stories.tsx +168 -0
  251. package/styled-components/cjs/examples/sds_engineer/components/Button/Button.config.js +19 -19
  252. package/styled-components/cjs/examples/sds_engineer/components/Button/Button.stories.tsx +28 -90
  253. package/styled-components/cjs/examples/sds_engineer/components/ButtonGroup/ButtonGroup.config.js +10 -10
  254. package/styled-components/cjs/examples/sds_engineer/components/ButtonGroup/ButtonGroup.stories.tsx +1 -1
  255. package/styled-components/cjs/hooks/index.js +8 -1
  256. package/styled-components/cjs/hooks/useIsomorphicLayoutEffect.js +12 -0
  257. package/styled-components/cjs/index.js +11 -0
  258. package/styled-components/cjs/utils/canUseDOM.js +11 -0
  259. package/styled-components/cjs/utils/index.js +7 -0
  260. package/styled-components/es/components/Button/Button.js +3 -17
  261. package/styled-components/es/components/Button/Button.styles.js +11 -19
  262. package/styled-components/es/components/Button/Button.template-doc.mdx +0 -42
  263. package/styled-components/es/components/Button/Button.tokens.js +0 -5
  264. package/styled-components/es/components/Button/variations/_stretching/base.js +1 -1
  265. package/styled-components/es/components/ButtonGroup/ButtonGroup.tokens.js +0 -1
  266. package/styled-components/es/components/ButtonGroup/variations/_orientation/base.js +2 -3
  267. package/styled-components/es/components/ButtonGroup/variations/_view/base.js +1 -1
  268. package/styled-components/es/components/Header/ui/HeaderArrow/HeaderArrow.js +2 -4
  269. package/styled-components/es/components/Slider/Slider.js +38 -0
  270. package/styled-components/es/components/Slider/Slider.tokens.js +71 -0
  271. package/styled-components/es/components/Slider/Slider.types.js +1 -0
  272. package/styled-components/es/components/Slider/components/Double/Double.js +310 -0
  273. package/styled-components/es/components/Slider/components/Double/Double.styles.js +29 -0
  274. package/styled-components/es/components/Slider/components/Double/Double.types.js +1 -0
  275. package/styled-components/es/components/Slider/components/Single/Single.js +168 -0
  276. package/styled-components/es/components/Slider/components/Single/Single.styles.js +20 -0
  277. package/styled-components/es/components/Slider/components/Single/Single.types.js +1 -0
  278. package/styled-components/es/components/Slider/components/SliderBase/SliderBase.js +74 -0
  279. package/styled-components/es/components/Slider/components/SliderBase/SliderBase.styles.js +14 -0
  280. package/styled-components/es/components/Slider/components/SliderBase/SliderBase.types.js +1 -0
  281. package/styled-components/es/components/Slider/components/index.js +3 -0
  282. package/styled-components/es/components/Slider/index.js +3 -0
  283. package/styled-components/es/components/Slider/ui/Handler/Handler.js +168 -0
  284. package/styled-components/es/components/Slider/ui/Handler/Handler.styles.js +8 -0
  285. package/styled-components/es/components/Slider/ui/Handler/Handler.types.js +1 -0
  286. package/styled-components/es/components/Slider/ui/Thumb/Thumb.js +25 -0
  287. package/styled-components/es/components/Slider/ui/Thumb/Thumb.styles.js +11 -0
  288. package/styled-components/es/components/Slider/ui/Thumb/Thumb.types.js +1 -0
  289. package/styled-components/es/components/Slider/ui/index.js +5 -0
  290. package/styled-components/es/components/Slider/utils/index.js +47 -0
  291. package/styled-components/es/components/Slider/variations/_disabled/base.js +2 -0
  292. package/styled-components/es/components/Slider/variations/_disabled/tokens.json +4 -0
  293. package/styled-components/es/components/Slider/variations/_size/base.js +2 -0
  294. package/styled-components/es/components/Slider/variations/_size/tokens.json +0 -0
  295. package/styled-components/es/components/Slider/variations/_view/base.js +2 -0
  296. package/styled-components/es/components/Slider/variations/_view/tokens.json +0 -0
  297. package/styled-components/es/components/TextField/TextField.js +12 -3
  298. package/styled-components/es/engines/common.js +4 -0
  299. package/styled-components/es/examples/plasma_b2c/components/Button/Button.config.js +19 -19
  300. package/styled-components/es/examples/plasma_b2c/components/Button/Button.stories.tsx +21 -67
  301. package/styled-components/es/examples/plasma_b2c/components/ButtonGroup/ButtonGroup.config.js +10 -10
  302. package/styled-components/es/examples/plasma_b2c/components/ButtonGroup/ButtonGroup.stories.tsx +1 -1
  303. package/styled-components/es/examples/plasma_b2c/components/Slider/Slider.config.js +23 -0
  304. package/styled-components/es/examples/plasma_b2c/components/Slider/Slider.js +10 -0
  305. package/styled-components/es/examples/plasma_b2c/components/Slider/Slider.stories.tsx +169 -0
  306. package/styled-components/es/examples/plasma_web/components/Button/Button.config.js +19 -19
  307. package/styled-components/es/examples/plasma_web/components/Button/Button.stories.tsx +28 -90
  308. package/styled-components/es/examples/plasma_web/components/ButtonGroup/ButtonGroup.config.js +10 -10
  309. package/styled-components/es/examples/plasma_web/components/ButtonGroup/ButtonGroup.stories.tsx +1 -1
  310. package/styled-components/es/examples/plasma_web/components/Slider/Slider.config.js +23 -0
  311. package/styled-components/es/examples/plasma_web/components/Slider/Slider.js +10 -0
  312. package/styled-components/es/examples/plasma_web/components/Slider/Slider.stories.tsx +168 -0
  313. package/styled-components/es/examples/sds_engineer/components/Button/Button.config.js +19 -19
  314. package/styled-components/es/examples/sds_engineer/components/Button/Button.stories.tsx +28 -90
  315. package/styled-components/es/examples/sds_engineer/components/ButtonGroup/ButtonGroup.config.js +10 -10
  316. package/styled-components/es/examples/sds_engineer/components/ButtonGroup/ButtonGroup.stories.tsx +1 -1
  317. package/styled-components/es/hooks/index.js +2 -1
  318. package/styled-components/es/hooks/useIsomorphicLayoutEffect.js +7 -0
  319. package/styled-components/es/index.js +2 -1
  320. package/styled-components/es/utils/canUseDOM.js +5 -0
  321. package/styled-components/es/utils/index.js +1 -0
  322. package/types/components/Button/Button.d.ts.map +1 -1
  323. package/types/components/Button/Button.styles.d.ts +1 -5
  324. package/types/components/Button/Button.styles.d.ts.map +1 -1
  325. package/types/components/Button/Button.tokens.d.ts +0 -5
  326. package/types/components/Button/Button.tokens.d.ts.map +1 -1
  327. package/types/components/Button/Button.types.d.ts +4 -16
  328. package/types/components/Button/Button.types.d.ts.map +1 -1
  329. package/types/components/ButtonGroup/ButtonGroup.tokens.d.ts +0 -1
  330. package/types/components/ButtonGroup/ButtonGroup.tokens.d.ts.map +1 -1
  331. package/types/components/ButtonGroup/variations/_orientation/base.d.ts.map +1 -1
  332. package/types/components/ButtonGroup/variations/_view/base.d.ts.map +1 -1
  333. package/types/components/Header/ui/HeaderArrow/HeaderArrow.d.ts.map +1 -1
  334. package/types/components/Notification/Notification.styles.d.ts +1 -43
  335. package/types/components/Notification/Notification.styles.d.ts.map +1 -1
  336. package/types/components/Pagination/Pagination.styles.d.ts +2 -86
  337. package/types/components/Pagination/Pagination.styles.d.ts.map +1 -1
  338. package/types/components/Panel/ui/PanelHeader/PanelHeader.styles.d.ts +1 -43
  339. package/types/components/Panel/ui/PanelHeader/PanelHeader.styles.d.ts.map +1 -1
  340. package/types/components/Select/ui/SelectTarget/SelectTarget.styles.d.ts +1 -43
  341. package/types/components/Select/ui/SelectTarget/SelectTarget.styles.d.ts.map +1 -1
  342. package/types/components/Slider/Slider.d.ts +27 -0
  343. package/types/components/Slider/Slider.d.ts.map +1 -0
  344. package/types/components/Slider/Slider.tokens.d.ts +72 -0
  345. package/types/components/Slider/Slider.tokens.d.ts.map +1 -0
  346. package/types/components/Slider/Slider.types.d.ts +3 -0
  347. package/types/components/Slider/Slider.types.d.ts.map +1 -0
  348. package/types/components/Slider/components/Double/Double.d.ts +4 -0
  349. package/types/components/Slider/components/Double/Double.d.ts.map +1 -0
  350. package/types/components/Slider/components/Double/Double.styles.d.ts +43 -0
  351. package/types/components/Slider/components/Double/Double.styles.d.ts.map +1 -0
  352. package/types/components/Slider/components/Double/Double.types.d.ts +65 -0
  353. package/types/components/Slider/components/Double/Double.types.d.ts.map +1 -0
  354. package/types/components/Slider/components/Single/Single.d.ts +4 -0
  355. package/types/components/Slider/components/Single/Single.d.ts.map +1 -0
  356. package/types/components/Slider/components/Single/Single.styles.d.ts +8 -0
  357. package/types/components/Slider/components/Single/Single.styles.d.ts.map +1 -0
  358. package/types/components/Slider/components/Single/Single.types.d.ts +55 -0
  359. package/types/components/Slider/components/Single/Single.types.d.ts.map +1 -0
  360. package/types/components/Slider/components/SliderBase/SliderBase.d.ts +4 -0
  361. package/types/components/Slider/components/SliderBase/SliderBase.d.ts.map +1 -0
  362. package/types/components/Slider/components/SliderBase/SliderBase.styles.d.ts +6 -0
  363. package/types/components/Slider/components/SliderBase/SliderBase.styles.d.ts.map +1 -0
  364. package/types/components/Slider/components/SliderBase/SliderBase.types.d.ts +45 -0
  365. package/types/components/Slider/components/SliderBase/SliderBase.types.d.ts.map +1 -0
  366. package/types/components/Slider/components/index.d.ts +6 -0
  367. package/types/components/Slider/components/index.d.ts.map +1 -0
  368. package/types/components/Slider/index.d.ts +6 -0
  369. package/types/components/Slider/index.d.ts.map +1 -0
  370. package/types/components/Slider/ui/Handler/Handler.d.ts +9 -0
  371. package/types/components/Slider/ui/Handler/Handler.d.ts.map +1 -0
  372. package/types/components/Slider/ui/Handler/Handler.styles.d.ts +4 -0
  373. package/types/components/Slider/ui/Handler/Handler.styles.d.ts.map +1 -0
  374. package/types/components/Slider/ui/Handler/Handler.types.d.ts +24 -0
  375. package/types/components/Slider/ui/Handler/Handler.types.d.ts.map +1 -0
  376. package/types/components/Slider/ui/Thumb/Thumb.d.ts +4 -0
  377. package/types/components/Slider/ui/Thumb/Thumb.d.ts.map +1 -0
  378. package/types/components/Slider/ui/Thumb/Thumb.styles.d.ts +5 -0
  379. package/types/components/Slider/ui/Thumb/Thumb.styles.d.ts.map +1 -0
  380. package/types/components/Slider/ui/Thumb/Thumb.types.d.ts +12 -0
  381. package/types/components/Slider/ui/Thumb/Thumb.types.d.ts.map +1 -0
  382. package/types/components/Slider/ui/index.d.ts +6 -0
  383. package/types/components/Slider/ui/index.d.ts.map +1 -0
  384. package/types/components/Slider/utils/index.d.ts +33 -0
  385. package/types/components/Slider/utils/index.d.ts.map +1 -0
  386. package/types/components/Slider/variations/_disabled/base.d.ts +2 -0
  387. package/types/components/Slider/variations/_disabled/base.d.ts.map +1 -0
  388. package/types/components/Slider/variations/_size/base.d.ts +2 -0
  389. package/types/components/Slider/variations/_size/base.d.ts.map +1 -0
  390. package/types/components/Slider/variations/_view/base.d.ts +2 -0
  391. package/types/components/Slider/variations/_view/base.d.ts.map +1 -0
  392. package/types/components/TextField/TextField.d.ts.map +1 -1
  393. package/types/components/Toast/Toast.styles.d.ts +1 -43
  394. package/types/components/Toast/Toast.styles.d.ts.map +1 -1
  395. package/types/components/Toast/utils.d.ts +1 -43
  396. package/types/components/Toast/utils.d.ts.map +1 -1
  397. package/types/engines/common.d.ts +3 -3
  398. package/types/engines/common.d.ts.map +1 -1
  399. package/types/engines/index.d.ts +1 -1
  400. package/types/engines/index.d.ts.map +1 -1
  401. package/types/engines/types.d.ts +4 -0
  402. package/types/engines/types.d.ts.map +1 -1
  403. package/types/examples/plasma_b2c/components/Button/Button.config.d.ts.map +1 -1
  404. package/types/examples/plasma_b2c/components/Button/Button.d.ts +1 -43
  405. package/types/examples/plasma_b2c/components/Button/Button.d.ts.map +1 -1
  406. package/types/examples/plasma_b2c/components/ButtonGroup/ButtonGroup.config.d.ts.map +1 -1
  407. package/types/examples/plasma_b2c/components/IconButton/IconButton.d.ts +1 -43
  408. package/types/examples/plasma_b2c/components/IconButton/IconButton.d.ts.map +1 -1
  409. package/types/examples/plasma_b2c/components/Slider/Slider.config.d.ts +22 -0
  410. package/types/examples/plasma_b2c/components/Slider/Slider.config.d.ts.map +1 -0
  411. package/types/examples/plasma_b2c/components/Slider/Slider.d.ts +21 -0
  412. package/types/examples/plasma_b2c/components/Slider/Slider.d.ts.map +1 -0
  413. package/types/examples/plasma_web/components/Button/Button.config.d.ts.map +1 -1
  414. package/types/examples/plasma_web/components/Button/Button.d.ts +1 -43
  415. package/types/examples/plasma_web/components/Button/Button.d.ts.map +1 -1
  416. package/types/examples/plasma_web/components/ButtonGroup/ButtonGroup.config.d.ts.map +1 -1
  417. package/types/examples/plasma_web/components/IconButton/IconButton.d.ts +1 -43
  418. package/types/examples/plasma_web/components/IconButton/IconButton.d.ts.map +1 -1
  419. package/types/examples/plasma_web/components/Slider/Slider.config.d.ts +22 -0
  420. package/types/examples/plasma_web/components/Slider/Slider.config.d.ts.map +1 -0
  421. package/types/examples/plasma_web/components/Slider/Slider.d.ts +21 -0
  422. package/types/examples/plasma_web/components/Slider/Slider.d.ts.map +1 -0
  423. package/types/examples/sds_engineer/components/Button/Button.config.d.ts.map +1 -1
  424. package/types/examples/sds_engineer/components/Button/Button.d.ts +1 -43
  425. package/types/examples/sds_engineer/components/Button/Button.d.ts.map +1 -1
  426. package/types/examples/sds_engineer/components/ButtonGroup/ButtonGroup.config.d.ts.map +1 -1
  427. package/types/hooks/index.d.ts +1 -0
  428. package/types/hooks/index.d.ts.map +1 -1
  429. package/types/hooks/useIsomorphicLayoutEffect.d.ts +6 -0
  430. package/types/hooks/useIsomorphicLayoutEffect.d.ts.map +1 -0
  431. package/types/index.d.ts +1 -0
  432. package/types/index.d.ts.map +1 -1
  433. package/types/utils/canUseDOM.d.ts +6 -0
  434. package/types/utils/canUseDOM.d.ts.map +1 -0
  435. package/types/utils/index.d.ts +1 -0
  436. package/types/utils/index.d.ts.map +1 -1
  437. package/cjs/components/Button/Button.styles_1oz1dew.css +0 -8
  438. package/cjs/components/ButtonGroup/variations/_view/base_1n9gznw.css +0 -1
  439. package/es/components/Button/Button.styles_1oz1dew.css +0 -8
  440. package/es/components/ButtonGroup/variations/_view/base_1n9gznw.css +0 -1
@@ -17,7 +17,7 @@ var _base6 = /*#__PURE__*/require("./variations/_blurred/base");
17
17
  var _Button = /*#__PURE__*/require("./Button.styles");
18
18
  var _Button2 = /*#__PURE__*/require("./Button.tokens");
19
19
  var _StyledSpinner;
20
- var _excluded = ["children", "view", "size", "text", "value", "contentLeft", "contentRight", "contentPlacing", "isLoading", "loader", "stretch", "square", "pin", "disabled", "focused", "outlined", "className", "blur", "style", "stretching"];
20
+ var _excluded = ["children", "view", "size", "text", "contentLeft", "contentRight", "isLoading", "loader", "stretch", "square", "pin", "disabled", "focused", "outlined", "className", "blur", "style", "stretching"];
21
21
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
22
22
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
23
23
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -34,11 +34,8 @@ var buttonRoot = exports.buttonRoot = function buttonRoot(Root) {
34
34
  view = props.view,
35
35
  size = props.size,
36
36
  text = props.text,
37
- value = props.value,
38
37
  contentLeft = props.contentLeft,
39
38
  contentRight = props.contentRight,
40
- _props$contentPlacing = props.contentPlacing,
41
- contentPlacing = _props$contentPlacing === void 0 ? 'default' : _props$contentPlacing,
42
39
  isLoading = props.isLoading,
43
40
  loader = props.loader,
44
41
  stretch = props.stretch,
@@ -55,34 +52,23 @@ var buttonRoot = exports.buttonRoot = function buttonRoot(Root) {
55
52
  rest = _objectWithoutProperties(props, _excluded);
56
53
  var txt = typeof children === 'string' ? children : text;
57
54
  var stretchingClass = stretch ? _Button2.classes.filledStretching : _Button2.classes["".concat(stretching, "Stretching")];
58
- var contentRelaxedClass = contentPlacing === 'relaxed' ? _Button2.classes.contentRelaxed : undefined;
59
55
  var squareClass = square ? _Button2.classes.buttonSquare : undefined;
60
56
  var buttonBorderRadius = pin ? (0, _roundness.convertRoundnessMatrix)(pin, "var(".concat(_Button2.tokens.buttonRadius, ")"), "var(".concat(_Button2.tokens.buttonHeight, ")")) : "var(".concat(_Button2.tokens.buttonRadius, ", calc(var(").concat(_Button2.tokens.buttonHeight, ") / 4))");
61
- var contentPlacingMapper = {
62
- "default": 'center',
63
- relaxed: 'space-between'
64
- };
65
- var contentPlacementValue = contentPlacing ? contentPlacingMapper[contentPlacing] : 'center';
66
57
  return /*#__PURE__*/_react["default"].createElement(Root, _extends({
67
58
  type: "button",
68
59
  ref: ref,
69
60
  view: view,
70
61
  size: size,
71
- value: value,
72
62
  disabled: disabled,
73
63
  focused: focused || outlined,
74
- contentPlacing: contentPlacing,
75
64
  className: (0, _utils.cx)(squareClass, stretchingClass, _Button2.classes.buttonItem, className),
76
65
  style: _objectSpread(_objectSpread({}, style), {}, {
77
66
  '--plasma_computed-btn-br': buttonBorderRadius,
78
67
  '--plasma_private-blur': blur
79
68
  })
80
69
  }, rest), /*#__PURE__*/_react["default"].createElement(_Button.LoadWrap, {
81
- contentPlacing: contentPlacementValue,
82
70
  isLoading: isLoading
83
- }, contentLeft && /*#__PURE__*/_react["default"].createElement(_Button.StyledContentLeft, null, contentLeft), txt ? /*#__PURE__*/_react["default"].createElement(_Button.ButtonText, {
84
- className: contentRelaxedClass
85
- }, txt) : children, value && /*#__PURE__*/_react["default"].createElement(_Button.ButtonValue, null, value), contentRight && /*#__PURE__*/_react["default"].createElement(_Button.StyledContentRight, null, contentRight)), isLoading && /*#__PURE__*/_react["default"].createElement(_Button.Loader, null, loader || _StyledSpinner || (_StyledSpinner = /*#__PURE__*/_react["default"].createElement(_Button.StyledSpinner, null))));
71
+ }, contentLeft, txt ? /*#__PURE__*/_react["default"].createElement(_Button.ButtonText, null, txt) : children, contentRight), isLoading && /*#__PURE__*/_react["default"].createElement(_Button.Loader, null, loader || _StyledSpinner || (_StyledSpinner = /*#__PURE__*/_react["default"].createElement(_Button.StyledSpinner, null))));
86
72
  });
87
73
  };
88
74
  var buttonConfig = exports.buttonConfig = {
@@ -4,7 +4,7 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
4
4
  Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
- exports.baseContent = exports.base = exports.StyledSpinner = exports.StyledContentRight = exports.StyledContentLeft = exports.Loader = exports.LoadWrap = exports.ButtonValue = exports.ButtonText = void 0;
7
+ exports.baseContent = exports.base = exports.StyledSpinner = exports.Loader = exports.LoadWrap = exports.ButtonText = void 0;
8
8
  var _styledComponents = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("styled-components"));
9
9
  var _mixins = /*#__PURE__*/require("../../mixins");
10
10
  var _engines = /*#__PURE__*/require("../../engines");
@@ -17,36 +17,28 @@ function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(
17
17
  // issue #823
18
18
  var mergedConfig = /*#__PURE__*/(0, _engines.mergeConfig)(_Spinner.spinnerConfig);
19
19
  var Spinner = /*#__PURE__*/(0, _engines.component)(mergedConfig);
20
+ var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n position: relative;\n display: inline-flex;\n align-items: center;\n box-sizing: border-box;\n justify-content: center;\n\n appearance: none;\n border: none;\n cursor: pointer;\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n\n a& {\n text-decoration: none;\n }\n\n /* NOTE: \n --plasma_computed-btn-br-radius is defined in Button.tsx\n */\n --plasma_private-btn-br: var(--plasma_computed-btn-br);\n border-radius: var(--plasma_private-btn-br);\n\n &&.", " {\n width: var(", ");\n padding: 0;\n }\n"])), /*#__PURE__*/String(_Button.classes.buttonSquare), _Button.tokens.buttonHeight);
21
+
22
+ // TODO: PLASMA-2164
23
+ // WHY do we need applyEllipsis ??
24
+ // Если внутри кнопки тескт и на нее решили повесить square пропс
20
25
  var ButtonText = exports.ButtonText = /*#__PURE__*/_styledComponents["default"].span.withConfig({
21
26
  componentId: "plasma-new-hope__sc-9d9bqj-0"
22
- })(["min-width:4ch;flex-shrink:2;", " &.", "{text-align:start;flex-grow:2;}"], /*#__PURE__*/(0, _mixins.applyEllipsis)(), /*#__PURE__*/String(_Button.classes.contentRelaxed));
23
- var ButtonValue = exports.ButtonValue = /*#__PURE__*/_styledComponents["default"].span.withConfig({
24
- componentId: "plasma-new-hope__sc-9d9bqj-1"
25
- })(["color:var(", ");margin:var(", ");min-width:4ch;", ""], _Button.tokens.buttonValueColor, _Button.tokens.buttonValueMargin, /*#__PURE__*/(0, _mixins.applyEllipsis)());
27
+ })([":not(:last-child){margin-right:0.375rem;}:not(:first-child){margin-left:0.375rem;}", ""], /*#__PURE__*/(0, _mixins.applyEllipsis)());
26
28
 
27
29
  // TODO: #720
28
30
  var LoadWrap = exports.LoadWrap = /*#__PURE__*/_styledComponents["default"].div.withConfig({
29
- componentId: "plasma-new-hope__sc-9d9bqj-2"
30
- })(["opacity:", ";display:flex;align-items:inherit;justify-content:", ";height:100%;width:100%;"], function (_ref) {
31
+ componentId: "plasma-new-hope__sc-9d9bqj-1"
32
+ })(["opacity:", ";display:flex;width:100%;align-items:inherit;justify-content:inherit;height:100%;"], function (_ref) {
31
33
  var isLoading = _ref.isLoading;
32
34
  return isLoading ? '0' : '1';
33
- }, function (_ref2) {
34
- var contentPlacing = _ref2.contentPlacing;
35
- return contentPlacing;
36
35
  });
37
36
  var Loader = exports.Loader = /*#__PURE__*/_styledComponents["default"].div.withConfig({
38
- componentId: "plasma-new-hope__sc-9d9bqj-3"
37
+ componentId: "plasma-new-hope__sc-9d9bqj-2"
39
38
  })(["position:absolute;"]);
40
39
  var StyledSpinner = exports.StyledSpinner = /*#__PURE__*/(0, _styledComponents["default"])(Spinner).withConfig({
41
- componentId: "plasma-new-hope__sc-9d9bqj-4"
40
+ componentId: "plasma-new-hope__sc-9d9bqj-3"
42
41
  })(["", ":var(", ");", ":var(", ");"], _Spinner.spinnerTokens.size, _Button.tokens.buttonSpinnerSize, _Spinner.spinnerTokens.color, _Button.tokens.buttonSpinnerColor);
43
- var StyledContentLeft = exports.StyledContentLeft = /*#__PURE__*/_styledComponents["default"].div.withConfig({
44
- componentId: "plasma-new-hope__sc-9d9bqj-5"
45
- })(["display:flex;margin:var(", ");"], _Button.tokens.buttonLeftContentMargin);
46
- var StyledContentRight = exports.StyledContentRight = /*#__PURE__*/_styledComponents["default"].div.withConfig({
47
- componentId: "plasma-new-hope__sc-9d9bqj-6"
48
- })(["display:flex;margin:var(", ");"], _Button.tokens.buttonRightContentMargin);
49
- var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n position: relative;\n display: inline-flex;\n align-items: center;\n box-sizing: border-box;\n justify-content: center;\n\n appearance: none;\n border: none;\n cursor: pointer;\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n\n a& {\n text-decoration: none;\n }\n\n /* NOTE: \n --plasma_computed-btn-br-radius is defined in Button.tsx\n */\n --plasma_private-btn-br: var(--plasma_computed-btn-br);\n border-radius: var(--plasma_private-btn-br);\n\n &&.", " {\n width: var(", ");\n padding: 0;\n }\n"])), /*#__PURE__*/String(_Button.classes.buttonSquare), _Button.tokens.buttonHeight);
50
42
 
51
43
  // INFO: Для возможности переиспользования стилей в других компонентах
52
44
  var baseContent = exports.baseContent = /*#__PURE__*/"\n position: relative;\n display: inline-flex;\n align-items: center;\n box-sizing: border-box;\n justify-content: center;\n\n appearance: none;\n border: none;\n cursor: pointer;\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n\n a& {\n text-decoration: none;\n }\n\n /* NOTE: \n --plasma_computed-btn-br-radius is defined in Button.tsx\n */\n --plasma_private-btn-br: var(--plasma_computed-btn-br);\n border-radius: var(--plasma_private-btn-br);\n\n &&.".concat(String(_Button.classes.buttonSquare), " {\n width: var(").concat(_Button.tokens.buttonHeight, ");\n padding: 0;\n }\n\n color: var(").concat(_Button.tokens.buttonColor, ");\n background-color: var(").concat(_Button.tokens.buttonBackgroundColor, ");\n\n :hover {\n color: var(").concat(_Button.tokens.buttonColorHover, ", var(").concat(_Button.tokens.buttonColor, "));\n background-color: var(").concat(_Button.tokens.buttonBackgroundColorHover, ", var(").concat(_Button.tokens.buttonBackgroundColor, "));\n\n scale: var(").concat(_Button.tokens.buttonScaleHover, ");\n }\n\n :active {\n color: var(").concat(_Button.tokens.buttonColorActive, ", var(").concat(_Button.tokens.buttonColor, "));\n background-color: var(").concat(_Button.tokens.buttonBackgroundColorActive, ", var(").concat(_Button.tokens.buttonBackgroundColor, "));\n\n scale: var(").concat(_Button.tokens.buttonScaleActive, ");\n }\n\n height: var(").concat(_Button.tokens.buttonHeight, ");\n width: var(").concat(_Button.tokens.buttonWidth, ");\n\n /* TODO: #714 move these calc's to plasma-mapping | ds-generator and add Math.round() */\n padding: 0 var(").concat(_Button.tokens.buttonPadding, ", calc(var(").concat(_Button.tokens.buttonHeight, ") * 1.618 / 4));\n\n font-family: var(").concat(_Button.tokens.buttonFontFamily, ");\n font-size: var(").concat(_Button.tokens.buttonFontSize, ");\n font-style: var(").concat(_Button.tokens.buttonFontStyle, ");\n font-weight: var(").concat(_Button.tokens.buttonFontWeight, ");\n letter-spacing: var(").concat(_Button.tokens.buttonLetterSpacing, ");\n line-height: var(").concat(_Button.tokens.buttonLineHeight, ");\n\n /* TODO: #710 make it token API ? */\n --plasma_private-btn-outline-size: var(--plasma-button-outline-size, 0.0625rem);\n\n :focus {\n outline: none;\n }\n\n ").concat((0, _mixins.addFocus)({
@@ -54,4 +46,4 @@ var baseContent = exports.baseContent = /*#__PURE__*/"\n position: relative;\
54
46
  outlineSize: 'var(--plasma_private-btn-outline-size)',
55
47
  outlineRadius: 'calc(0.125rem + var(--plasma_private-btn-br))',
56
48
  outlineColor: "var(".concat(_Button.tokens.buttonFocusColor, ")")
57
- }), "\n\n &[disabled] {\n opacity: var(").concat(_Button.tokens.buttonDisabledOpacity, ");\n cursor: not-allowed;\n\n :hover,\n :active {\n scale: none;\n\n color: var(").concat(_Button.tokens.buttonColor, ");\n background-color: var(").concat(_Button.tokens.buttonBackgroundColor, ");\n }\n }\n\n &.").concat(_Button.classes.fixedStretching, " {\n width: var(").concat(_Button.tokens.buttonWidth, ");\n }\n &.").concat(_Button.classes.filledStretching, " {\n width: 100%;\n }\n &.").concat(_Button.classes.autoStretching, " {\n width: fit-content;\n }\n");
49
+ }), "\n\n &[disabled] {\n opacity: var(").concat(_Button.tokens.buttonDisabledOpacity, ");\n cursor: not-allowed;\n\n :hover,\n :active {\n scale: none;\n\n color: var(").concat(_Button.tokens.buttonColor, ");\n background-color: var(").concat(_Button.tokens.buttonBackgroundColor, ");\n }\n }\n\n &.").concat(_Button.classes.fixedStretching, " {\n width: var(").concat(_Button.tokens.buttonWidth, ");\n }\n &.").concat(_Button.classes.filledStretching, " {\n width: 100%;\n }\n &.").concat(_Button.classes.autoStretching, " {\n width: auto;\n }\n");
@@ -68,48 +68,6 @@ export function App() {
68
68
  }
69
69
  ```
70
70
 
71
- ### Ширина кнопки
72
- Ширина кнопки регулируется с помощью свойства `stretching`.
73
- Возможные значения свойства `contentPlacing`:
74
- + `auto` – ширина подстраивается под контент;
75
- + `filled` – кнопка растягивается на всю доступную ширину;
76
- + `fixed` – кнопка фиксированной ширины.
77
-
78
- ```tsx live
79
- import React from 'react';
80
- import { Button } from '@salutejs/{{package}}';
81
-
82
- export function App() {
83
- return (
84
- <div style={{ display: "flex", flexDirection: "column", gap: "1rem" }}>
85
- <Button text="Button" stretching="fixed" />
86
- <Button text="Button" stretching="auto" />
87
- <Button text="Button" stretching="filled" />
88
- </div>
89
- );
90
- }
91
- ```
92
-
93
- ### Позиционирование контента внутри
94
- Позиционирование контента внутри кнопки регулируется с помощью свойства `contentPlacing`.
95
- Возможные значения свойства `contentPlacing`:
96
- + `default` – контент центрируется;
97
- + `relaxed` – контент распологается по краям.
98
-
99
- ```tsx live
100
- import React from 'react';
101
- import { Button } from '@salutejs/{{package}}';
102
-
103
- export function App() {
104
- return (
105
- <div style={{ display: "flex", flexDirection: "column", gap: "1rem" }}>
106
- <Button text="Hello" value="Plasma" stretching="filled" contentPlacing="default" />
107
- <Button text="Hello" value="Plasma" stretching="filled" contentPlacing="relaxed" />
108
- </div>
109
- );
110
- }
111
- ```
112
-
113
71
  ### Вид кнопки
114
72
  Вид кнопки задается с помощью свойства `view`. Возможные значения свойства `view`:
115
73
  + `"primary"` – основная;
@@ -9,13 +9,11 @@ var classes = exports.classes = {
9
9
  autoStretching: 'button-stretching-auto',
10
10
  filledStretching: 'button-stretching-filled',
11
11
  fixedStretching: 'button-stretching-fixed',
12
- contentRelaxed: 'button-content-relaxed',
13
12
  buttonSquare: 'button-square',
14
13
  buttonItem: 'button-item'
15
14
  };
16
15
  var tokens = exports.tokens = {
17
16
  buttonColor: '--plasma-button-color',
18
- buttonValueColor: '--plasma-button-value-color',
19
17
  buttonBackgroundColor: '--plasma-button-background-color',
20
18
  buttonColorHover: '--plasma-button-color-hover',
21
19
  buttonBackgroundColorHover: '--plasma-button-background-color-hover',
@@ -34,9 +32,6 @@ var tokens = exports.tokens = {
34
32
  buttonFontWeight: '--plasma-button-font-weight',
35
33
  buttonLetterSpacing: '--plasma-button-letter-spacing',
36
34
  buttonLineHeight: '--plasma-button-line-height',
37
- buttonLeftContentMargin: '--plasma-button-left-content-margin',
38
- buttonRightContentMargin: '--plasma-button-right-content-margin',
39
- buttonValueMargin: '--plasma-button-value-margin',
40
35
  buttonDisabledOpacity: '--plasma-button-disabled-opacity',
41
36
  buttonFocusColor: '--plasma-button-focus-color',
42
37
  buttonSpinnerColor: '--plasma-button-spinner-color',
@@ -6,4 +6,4 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.base = void 0;
7
7
  var _styledComponents = /*#__PURE__*/require("styled-components");
8
8
  var _Button = /*#__PURE__*/require("../../Button.tokens");
9
- var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["&.", "{width:var(", ");}&.", "{width:100%;}&.", "{width:fit-content;}"], _Button.classes.fixedStretching, _Button.tokens.buttonWidth, _Button.classes.filledStretching, _Button.classes.autoStretching);
9
+ var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["&.", "{width:var(", ");}&.", "{width:100%;}&.", "{width:auto;}"], _Button.classes.fixedStretching, _Button.tokens.buttonWidth, _Button.classes.filledStretching, _Button.classes.autoStretching);
@@ -20,7 +20,6 @@ var classes = exports.classes = {
20
20
  var tokens = exports.tokens = {
21
21
  buttonGroupOrientation: '--plasma-button-group-orientation',
22
22
  buttonColor: '--plasma-button-group-item-color',
23
- buttonValueColor: '--plasma-button-group-item-value-color',
24
23
  buttonBackgroundColor: '--plasma-button-group-item-background-color',
25
24
  buttonColorHover: '--plasma-button-group-item-color-hover',
26
25
  buttonBackgroundColorHover: '--plasma-button-group-item-background-color-hover',
@@ -6,5 +6,4 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.base = void 0;
7
7
  var _styledComponents = /*#__PURE__*/require("styled-components");
8
8
  var _ButtonGroup = /*#__PURE__*/require("../../ButtonGroup.tokens");
9
- var _Button = /*#__PURE__*/require("../../../Button");
10
- var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["flex-direction:var(", ");&.", " .", "{width:auto;}"], _ButtonGroup.tokens.buttonGroupOrientation, _ButtonGroup.classes.vertical, _Button.buttonClasses.buttonItem);
9
+ var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["flex-direction:var(", ");"], _ButtonGroup.tokens.buttonGroupOrientation);
@@ -7,4 +7,4 @@ exports.base = void 0;
7
7
  var _styledComponents = /*#__PURE__*/require("styled-components");
8
8
  var _ButtonGroup = /*#__PURE__*/require("../../ButtonGroup.tokens");
9
9
  var _Button = /*#__PURE__*/require("../../../Button");
10
- var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["&.", " .", "{", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");}"], _ButtonGroup.classes.buttonGroupOverrideStyles, _Button.buttonClasses.buttonItem, _Button.buttonTokens.buttonColor, _ButtonGroup.tokens.buttonColor, _Button.buttonTokens.buttonValueColor, _ButtonGroup.tokens.buttonValueColor, _Button.buttonTokens.buttonBackgroundColor, _ButtonGroup.tokens.buttonBackgroundColor, _Button.buttonTokens.buttonColorHover, _ButtonGroup.tokens.buttonColorHover, _Button.buttonTokens.buttonBackgroundColorHover, _ButtonGroup.tokens.buttonBackgroundColorHover, _Button.buttonTokens.buttonColorActive, _ButtonGroup.tokens.buttonColorActive, _Button.buttonTokens.buttonBackgroundColorActive, _ButtonGroup.tokens.buttonBackgroundColorActive);
10
+ var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["&.", " .", "{", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");}"], _ButtonGroup.classes.buttonGroupOverrideStyles, _Button.buttonClasses.buttonItem, _Button.buttonTokens.buttonColor, _ButtonGroup.tokens.buttonColor, _Button.buttonTokens.buttonBackgroundColor, _ButtonGroup.tokens.buttonBackgroundColor, _Button.buttonTokens.buttonColorHover, _ButtonGroup.tokens.buttonColorHover, _Button.buttonTokens.buttonBackgroundColorHover, _ButtonGroup.tokens.buttonBackgroundColorHover, _Button.buttonTokens.buttonColorActive, _ButtonGroup.tokens.buttonColorActive, _Button.buttonTokens.buttonBackgroundColorActive, _ButtonGroup.tokens.buttonBackgroundColorActive);
@@ -14,7 +14,7 @@ var _utils = /*#__PURE__*/require("../../../../utils");
14
14
  var _HeaderArrow = /*#__PURE__*/require("./HeaderArrow.styles");
15
15
  var _base = /*#__PURE__*/require("./variations/_size/base");
16
16
  var _base2 = /*#__PURE__*/require("./variations/_view/base");
17
- var _excluded = ["arrow", "iconSize", "value"];
17
+ var _excluded = ["arrow", "iconSize"];
18
18
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
19
19
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
20
20
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -31,7 +31,6 @@ var headerArrowRoot = exports.headerArrowRoot = function headerArrowRoot(Root) {
31
31
  var arrow = props.arrow,
32
32
  _props$iconSize = props.iconSize,
33
33
  iconSize = _props$iconSize === void 0 ? 's' : _props$iconSize,
34
- value = props.value,
35
34
  rest = _objectWithoutProperties(props, _excluded);
36
35
  var minimizeClass = arrow === 'minimize' ? _Header.classes.headerArrowIconMinimize : undefined;
37
36
  return /*#__PURE__*/_react["default"].createElement(Root, {
@@ -40,8 +39,7 @@ var headerArrowRoot = exports.headerArrowRoot = function headerArrowRoot(Root) {
40
39
  view: "clear",
41
40
  size: "s",
42
41
  tabIndex: -1,
43
- className: _Header.classes.headerArrow,
44
- value: String(value)
42
+ className: _Header.classes.headerArrow
45
43
  }, rest), /*#__PURE__*/_react["default"].createElement(_Icon.IconChevronLeft, _extends({
46
44
  size: iconSize,
47
45
  sizeCustomProperty: _Header.tokens.headerArrowIconSize,
@@ -0,0 +1,47 @@
1
+ "use strict";
2
+
3
+ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.sliderRoot = exports.sliderConfig = void 0;
8
+ var _react = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("react"));
9
+ var _base = /*#__PURE__*/require("./variations/_view/base");
10
+ var _base2 = /*#__PURE__*/require("./variations/_size/base");
11
+ var _base3 = /*#__PURE__*/require("./variations/_disabled/base");
12
+ var _components = /*#__PURE__*/require("./components");
13
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
14
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
15
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
16
+ var isSingleValueProps = function isSingleValueProps(props) {
17
+ return typeof props.value === 'number';
18
+ };
19
+ var sliderRoot = exports.sliderRoot = function sliderRoot(Root) {
20
+ return /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
21
+ return /*#__PURE__*/_react["default"].createElement(Root, _extends({
22
+ ref: ref
23
+ }, props), isSingleValueProps(props) && /*#__PURE__*/_react["default"].createElement(_components.SingleSlider, props), !isSingleValueProps(props) && /*#__PURE__*/_react["default"].createElement(_components.DoubleSlider, props));
24
+ });
25
+ };
26
+ var sliderConfig = exports.sliderConfig = {
27
+ name: 'Slider',
28
+ tag: 'div',
29
+ layout: sliderRoot,
30
+ base: '',
31
+ variations: {
32
+ view: {
33
+ css: _base.base
34
+ },
35
+ size: {
36
+ css: _base2.base
37
+ },
38
+ disabled: {
39
+ css: _base3.base,
40
+ attrs: true
41
+ }
42
+ },
43
+ defaults: {
44
+ view: 'default',
45
+ size: 'm'
46
+ }
47
+ };
@@ -0,0 +1,77 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.tokens = exports.classes = void 0;
7
+ var classes = exports.classes = {
8
+ labelPlacementOuter: 'slider-label-placement-outer',
9
+ labelPlacementInner: 'slider-label-placement-inner',
10
+ rangeValuesPlacementOuter: 'slider-range-values-placement-outer',
11
+ rangeValuesPlacementInner: 'slider-range-values-placement-inner',
12
+ maxRangeValue: 'slider-max-range-value',
13
+ hideMinValue: 'slider-hide-min-value',
14
+ hideMaxValue: 'slider-hide-max-value',
15
+ textFieldActive: 'slider-text-field-active',
16
+ firstTextField: 'slider-first-text-field',
17
+ secondTextField: 'slider-second-text-field',
18
+ activeRangeValue: 'slider-active-range-value'
19
+ };
20
+ var tokens = exports.tokens = {
21
+ height: '--plasma-slider-height',
22
+ labelWrapperGap: '--plasma-slider-label-wrapper-gap',
23
+ labelWrapperMarginBottom: '--plasma-slider-label-wrapper-margin-bottom',
24
+ labelWrapperMarginRight: '--plasma-slider-label-wrapper-margin-right',
25
+ labelColor: '--plasma-slider-label-color',
26
+ labelFontFamily: '--plasma-slider-label-font-family',
27
+ labelFontSize: '--plasma-slider-label-font-size',
28
+ labelFontStyle: '--plasma-slider-label-font-style',
29
+ labelFontWeight: '--plasma-slider-label-font-weight',
30
+ labelLetterSpacing: '--plasma-slider-label-letter-spacing',
31
+ labelLineHeight: '--plasma-slider-label-line-height',
32
+ rangeMinValueMargin: '--plasma-slider-range-min-value-margin',
33
+ rangeMaxValueMargin: '--plasma-slider-range-max-value-margin',
34
+ rangeValueBottomOffset: '--plasma-slider-range-value-bottom-offset',
35
+ rangeValueColor: '--plasma-slider-range-value-color',
36
+ rangeValueFontFamily: '--plasma-slider-range-value-font-family',
37
+ rangeValueFontSize: '--plasma-slider-range-value-font-size',
38
+ rangeValueFontStyle: '--plasma-slider-range-value-font-style',
39
+ rangeValueFontWeight: '--plasma-slider-range-value-font-weight',
40
+ rangeValueLetterSpacing: '--plasma-slider-range-value-letter-spacing',
41
+ rangeValueLineHeight: '--plasma-slider-range-value-line-height',
42
+ doubleWrapperGap: '--plasma-slider-double-wrapper-gap',
43
+ thumbSize: '--plasma-slider-thumb-size',
44
+ thumbBorder: '--plasma-slider-thumb-border',
45
+ thumbBorderColor: '--plasma-slider-thumb-border-color',
46
+ thumbBackgroundColor: '--plasma-slider-thumb-background-color',
47
+ thumbFocusBorderColor: '--plasma-slider-thumb-focus-border-color',
48
+ currentValueTopOffset: '--plasma-slider-current-value-top-offset',
49
+ currentValueFontFamily: '--plasma-slider-current-value-font-family',
50
+ currentValueFontSize: '--plasma-slider-current-value-font-size',
51
+ currentValueFontStyle: '--plasma-slider-current-value-font-style',
52
+ currentValueFontWeight: '--plasma-slider-current-value-font-weight',
53
+ currentValueLetterSpacing: '--plasma-slider-current-value-letter-spacing',
54
+ currentValueLineHeight: '--plasma-slider-current-value-line-height',
55
+ railBackgroundColor: '--plasma-slider-rail-background-color',
56
+ railHeight: '--plasma-slider-rail-height',
57
+ railBorderRadius: '--plasma-slider-rail-border-radius',
58
+ railIndent: '--plasma-slider-rail-indent',
59
+ fillColor: '--plasma-slider-fill-color',
60
+ textFieldWrapperGap: '--plasma-slider-text-field-wrapper-gap',
61
+ textFieldFontFamily: '--plasma-slider-text-field-font-family',
62
+ textFieldFontSize: '--plasma-slider-text-field-font-size',
63
+ textFieldFontStyle: '--plasma-slider-text-field-font-style',
64
+ textFieldFontWeight: '--plasma-slider-text-field-font-weight',
65
+ textFieldLetterSpacing: '--plasma-slider-text-field-letter-spacing',
66
+ textFieldLineHeight: '--plasma-slider-text-field-line-height',
67
+ textFieldHeight: '--plasma-slider-text-field-height',
68
+ textFieldPadding: '--plasma-slider-text-field-padding',
69
+ textFieldBorderRadius: '--plasma-slider-text-field-border-radius',
70
+ textFieldColor: '--plasma-slider-text-field-color',
71
+ textFieldActiveColor: '--plasma-slider-text-field-active-color',
72
+ textFieldBackgroundColor: '--plasma-slider-text-field-background-color',
73
+ textFieldCaretColor: '--plasma-slider-text-field-caret-color',
74
+ textFieldPlaceholderColor: '--plasma-slider-text-field-placeholder-color',
75
+ textFiledFocusColor: '--plasma-slider-text-field-focus-color',
76
+ disabledOpacity: '--plasma-slider-disabled-opacity'
77
+ };
@@ -0,0 +1,5 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });