@salutejs/plasma-new-hope 0.83.0-canary.1194.9157747369.0 → 0.83.0-canary.1213.9159050781.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (366) hide show
  1. package/cjs/components/Button/Button.css +9 -6
  2. package/cjs/components/Button/Button.js +16 -2
  3. package/cjs/components/Button/Button.js.map +1 -1
  4. package/cjs/components/Button/Button.styles.js +31 -10
  5. package/cjs/components/Button/Button.styles.js.map +1 -1
  6. package/cjs/components/Button/Button.styles_nedem1.css +8 -0
  7. package/cjs/components/Button/Button.tokens.js +5 -0
  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_1lx0ute.css → cjs/components/Button/variations/_stretching/base_hy8dc.css} +1 -1
  12. package/cjs/components/Combobox/hooks/useFocusController.js +0 -1
  13. package/cjs/components/Combobox/hooks/useFocusController.js.map +1 -1
  14. package/cjs/components/Drawer/Drawer.css +9 -6
  15. package/cjs/components/Drawer/ui/DrawerContent/DrawerContent.css +9 -6
  16. package/cjs/components/Header/ui/HeaderArrow/HeaderArrow.css +9 -6
  17. package/cjs/components/IconButton/IconButton.css +10 -7
  18. package/cjs/components/IconButton/IconButton.styles.js +1 -1
  19. package/cjs/components/IconButton/{IconButton.styles_1hknr37.css → IconButton.styles_7v8g0e.css} +1 -1
  20. package/cjs/components/Notification/Notification.css +9 -6
  21. package/cjs/components/Notification/NotificationsProvider.css +9 -6
  22. package/cjs/components/Pagination/Pagination.css +9 -6
  23. package/cjs/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.css +9 -6
  24. package/cjs/components/Panel/ui/PanelHeader/PanelHeader.css +9 -6
  25. package/cjs/components/Select/Select.css +9 -6
  26. package/cjs/components/Select/ui/SelectTarget/SelectTarget.css +9 -6
  27. package/cjs/components/TextField/TextField.js +3 -12
  28. package/cjs/components/TextField/TextField.js.map +1 -1
  29. package/cjs/components/Toast/Toast.css +9 -6
  30. package/cjs/components/Toast/ToastController.css +9 -6
  31. package/cjs/engines/common.js +0 -4
  32. package/cjs/engines/common.js.map +1 -1
  33. package/cjs/engines/index.js.map +1 -1
  34. package/cjs/index.css +10 -32
  35. package/cjs/index.js +0 -14
  36. package/cjs/index.js.map +1 -1
  37. package/cjs/utils/index.js.map +1 -1
  38. package/es/components/Button/Button.css +9 -6
  39. package/es/components/Button/Button.js +17 -3
  40. package/es/components/Button/Button.js.map +1 -1
  41. package/es/components/Button/Button.styles.js +29 -11
  42. package/es/components/Button/Button.styles.js.map +1 -1
  43. package/es/components/Button/Button.styles_nedem1.css +8 -0
  44. package/es/components/Button/Button.tokens.js +5 -0
  45. package/es/components/Button/Button.tokens.js.map +1 -1
  46. package/es/components/Button/variations/_stretching/base.js +1 -1
  47. package/es/components/Button/variations/_stretching/base.js.map +1 -1
  48. package/{cjs/components/Button/variations/_stretching/base_1lx0ute.css → es/components/Button/variations/_stretching/base_hy8dc.css} +1 -1
  49. package/es/components/Combobox/hooks/useFocusController.js +0 -1
  50. package/es/components/Combobox/hooks/useFocusController.js.map +1 -1
  51. package/es/components/Drawer/Drawer.css +9 -6
  52. package/es/components/Drawer/ui/DrawerContent/DrawerContent.css +9 -6
  53. package/es/components/Header/ui/HeaderArrow/HeaderArrow.css +9 -6
  54. package/es/components/IconButton/IconButton.css +10 -7
  55. package/es/components/IconButton/IconButton.styles.js +1 -1
  56. package/es/components/IconButton/{IconButton.styles_1hknr37.css → IconButton.styles_7v8g0e.css} +1 -1
  57. package/es/components/Notification/Notification.css +9 -6
  58. package/es/components/Notification/NotificationsProvider.css +9 -6
  59. package/es/components/Pagination/Pagination.css +9 -6
  60. package/es/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.css +9 -6
  61. package/es/components/Panel/ui/PanelHeader/PanelHeader.css +9 -6
  62. package/es/components/Select/Select.css +9 -6
  63. package/es/components/Select/ui/SelectTarget/SelectTarget.css +9 -6
  64. package/es/components/TextField/TextField.js +3 -12
  65. package/es/components/TextField/TextField.js.map +1 -1
  66. package/es/components/Toast/Toast.css +9 -6
  67. package/es/components/Toast/ToastController.css +9 -6
  68. package/es/engines/common.js +0 -4
  69. package/es/engines/common.js.map +1 -1
  70. package/es/engines/index.js.map +1 -1
  71. package/es/index.css +10 -32
  72. package/es/index.js +0 -8
  73. package/es/index.js.map +1 -1
  74. package/es/utils/index.js.map +1 -1
  75. package/package.json +2 -3
  76. package/styled-components/cjs/components/Button/Button.js +16 -2
  77. package/styled-components/cjs/components/Button/Button.styles.js +20 -12
  78. package/styled-components/cjs/components/Button/Button.template-doc.mdx +42 -0
  79. package/styled-components/cjs/components/Button/Button.tokens.js +5 -0
  80. package/styled-components/cjs/components/Button/variations/_stretching/base.js +1 -1
  81. package/styled-components/cjs/components/TextField/TextField.js +3 -12
  82. package/styled-components/cjs/engines/common.js +0 -4
  83. package/styled-components/cjs/examples/plasma_b2c/components/Button/Button.config.js +19 -19
  84. package/styled-components/cjs/examples/plasma_b2c/components/Button/Button.stories.tsx +67 -21
  85. package/styled-components/cjs/examples/plasma_web/components/Button/Button.config.js +19 -19
  86. package/styled-components/cjs/examples/plasma_web/components/Button/Button.stories.tsx +90 -28
  87. package/styled-components/cjs/examples/sds_engineer/components/Button/Button.config.js +19 -19
  88. package/styled-components/cjs/examples/sds_engineer/components/Button/Button.stories.tsx +90 -28
  89. package/styled-components/cjs/hooks/index.js +1 -8
  90. package/styled-components/cjs/index.js +0 -11
  91. package/styled-components/cjs/utils/index.js +0 -7
  92. package/styled-components/es/components/Button/Button.js +17 -3
  93. package/styled-components/es/components/Button/Button.styles.js +19 -11
  94. package/styled-components/es/components/Button/Button.template-doc.mdx +42 -0
  95. package/styled-components/es/components/Button/Button.tokens.js +5 -0
  96. package/styled-components/es/components/Button/variations/_stretching/base.js +1 -1
  97. package/styled-components/es/components/TextField/TextField.js +3 -12
  98. package/styled-components/es/engines/common.js +0 -4
  99. package/styled-components/es/examples/plasma_b2c/components/Button/Button.config.js +19 -19
  100. package/styled-components/es/examples/plasma_b2c/components/Button/Button.stories.tsx +67 -21
  101. package/styled-components/es/examples/plasma_web/components/Button/Button.config.js +19 -19
  102. package/styled-components/es/examples/plasma_web/components/Button/Button.stories.tsx +90 -28
  103. package/styled-components/es/examples/sds_engineer/components/Button/Button.config.js +19 -19
  104. package/styled-components/es/examples/sds_engineer/components/Button/Button.stories.tsx +90 -28
  105. package/styled-components/es/hooks/index.js +1 -2
  106. package/styled-components/es/index.js +1 -2
  107. package/styled-components/es/utils/index.js +0 -1
  108. package/types/components/Button/Button.d.ts.map +1 -1
  109. package/types/components/Button/Button.styles.d.ts +5 -1
  110. package/types/components/Button/Button.styles.d.ts.map +1 -1
  111. package/types/components/Button/Button.tokens.d.ts +5 -0
  112. package/types/components/Button/Button.tokens.d.ts.map +1 -1
  113. package/types/components/Button/Button.types.d.ts +10 -0
  114. package/types/components/Button/Button.types.d.ts.map +1 -1
  115. package/types/components/TextField/TextField.d.ts.map +1 -1
  116. package/types/engines/common.d.ts +3 -3
  117. package/types/engines/common.d.ts.map +1 -1
  118. package/types/engines/index.d.ts +1 -1
  119. package/types/engines/index.d.ts.map +1 -1
  120. package/types/engines/types.d.ts +0 -4
  121. package/types/engines/types.d.ts.map +1 -1
  122. package/types/examples/plasma_b2c/components/Button/Button.config.d.ts.map +1 -1
  123. package/types/examples/plasma_web/components/Button/Button.config.d.ts.map +1 -1
  124. package/types/examples/sds_engineer/components/Button/Button.config.d.ts.map +1 -1
  125. package/types/hooks/index.d.ts +0 -1
  126. package/types/hooks/index.d.ts.map +1 -1
  127. package/types/index.d.ts +0 -1
  128. package/types/index.d.ts.map +1 -1
  129. package/types/utils/index.d.ts +0 -1
  130. package/types/utils/index.d.ts.map +1 -1
  131. package/cjs/components/Button/Button.styles_uqvh6u.css +0 -5
  132. package/cjs/components/Slider/Slider.css +0 -69
  133. package/cjs/components/Slider/Slider.js +0 -48
  134. package/cjs/components/Slider/Slider.js.map +0 -1
  135. package/cjs/components/Slider/Slider.tokens.js +0 -79
  136. package/cjs/components/Slider/Slider.tokens.js.map +0 -1
  137. package/cjs/components/Slider/components/Double/Double.css +0 -62
  138. package/cjs/components/Slider/components/Double/Double.js +0 -288
  139. package/cjs/components/Slider/components/Double/Double.js.map +0 -1
  140. package/cjs/components/Slider/components/Double/Double.styles.js +0 -61
  141. package/cjs/components/Slider/components/Double/Double.styles.js.map +0 -1
  142. package/cjs/components/Slider/components/Double/Double.styles_1jhda4u.css +0 -7
  143. package/cjs/components/Slider/components/Single/Single.css +0 -16
  144. package/cjs/components/Slider/components/Single/Single.js +0 -164
  145. package/cjs/components/Slider/components/Single/Single.js.map +0 -1
  146. package/cjs/components/Slider/components/Single/Single.styles.js +0 -45
  147. package/cjs/components/Slider/components/Single/Single.styles.js.map +0 -1
  148. package/cjs/components/Slider/components/Single/Single.styles_1r9f1e0.css +0 -6
  149. package/cjs/components/Slider/components/SliderBase/SliderBase.css +0 -4
  150. package/cjs/components/Slider/components/SliderBase/SliderBase.js +0 -82
  151. package/cjs/components/Slider/components/SliderBase/SliderBase.js.map +0 -1
  152. package/cjs/components/Slider/components/SliderBase/SliderBase.styles.js +0 -33
  153. package/cjs/components/Slider/components/SliderBase/SliderBase.styles.js.map +0 -1
  154. package/cjs/components/Slider/components/SliderBase/SliderBase.styles_7is2ll.css +0 -4
  155. package/cjs/components/Slider/ui/Handler/Handler.css +0 -4
  156. package/cjs/components/Slider/ui/Handler/Handler.js +0 -174
  157. package/cjs/components/Slider/ui/Handler/Handler.js.map +0 -1
  158. package/cjs/components/Slider/ui/Handler/Handler.styles.js +0 -21
  159. package/cjs/components/Slider/ui/Handler/Handler.styles.js.map +0 -1
  160. package/cjs/components/Slider/ui/Handler/Handler.styles_8crx5z.css +0 -2
  161. package/cjs/components/Slider/ui/Thumb/Thumb.css +0 -1
  162. package/cjs/components/Slider/ui/Thumb/Thumb.js +0 -31
  163. package/cjs/components/Slider/ui/Thumb/Thumb.js.map +0 -1
  164. package/cjs/components/Slider/ui/Thumb/Thumb.styles.js +0 -15
  165. package/cjs/components/Slider/ui/Thumb/Thumb.styles.js.map +0 -1
  166. package/cjs/components/Slider/ui/Thumb/Thumb.styles_4w4gzn.css +0 -1
  167. package/cjs/components/Slider/utils/index.js +0 -56
  168. package/cjs/components/Slider/utils/index.js.map +0 -1
  169. package/cjs/components/Slider/variations/_disabled/base.js +0 -9
  170. package/cjs/components/Slider/variations/_disabled/base.js.map +0 -1
  171. package/cjs/components/Slider/variations/_disabled/base_x642ct.css +0 -1
  172. package/cjs/components/Slider/variations/_size/base.js +0 -9
  173. package/cjs/components/Slider/variations/_size/base.js.map +0 -1
  174. package/cjs/components/Slider/variations/_size/base_x642ct.css +0 -1
  175. package/cjs/components/Slider/variations/_view/base.js +0 -9
  176. package/cjs/components/Slider/variations/_view/base.js.map +0 -1
  177. package/cjs/components/Slider/variations/_view/base_x642ct.css +0 -1
  178. package/cjs/hooks/useIsomorphicLayoutEffect.js +0 -15
  179. package/cjs/hooks/useIsomorphicLayoutEffect.js.map +0 -1
  180. package/cjs/utils/canUseDOM.js +0 -12
  181. package/cjs/utils/canUseDOM.js.map +0 -1
  182. package/es/components/Button/Button.styles_uqvh6u.css +0 -5
  183. package/es/components/Slider/Slider.css +0 -69
  184. package/es/components/Slider/Slider.js +0 -43
  185. package/es/components/Slider/Slider.js.map +0 -1
  186. package/es/components/Slider/Slider.tokens.js +0 -74
  187. package/es/components/Slider/Slider.tokens.js.map +0 -1
  188. package/es/components/Slider/components/Double/Double.css +0 -62
  189. package/es/components/Slider/components/Double/Double.js +0 -284
  190. package/es/components/Slider/components/Double/Double.js.map +0 -1
  191. package/es/components/Slider/components/Double/Double.styles.js +0 -51
  192. package/es/components/Slider/components/Double/Double.styles.js.map +0 -1
  193. package/es/components/Slider/components/Double/Double.styles_1jhda4u.css +0 -7
  194. package/es/components/Slider/components/Single/Single.css +0 -16
  195. package/es/components/Slider/components/Single/Single.js +0 -160
  196. package/es/components/Slider/components/Single/Single.js.map +0 -1
  197. package/es/components/Slider/components/Single/Single.styles.js +0 -36
  198. package/es/components/Slider/components/Single/Single.styles.js.map +0 -1
  199. package/es/components/Slider/components/Single/Single.styles_1r9f1e0.css +0 -6
  200. package/es/components/Slider/components/SliderBase/SliderBase.css +0 -4
  201. package/es/components/Slider/components/SliderBase/SliderBase.js +0 -78
  202. package/es/components/Slider/components/SliderBase/SliderBase.js.map +0 -1
  203. package/es/components/Slider/components/SliderBase/SliderBase.styles.js +0 -26
  204. package/es/components/Slider/components/SliderBase/SliderBase.styles.js.map +0 -1
  205. package/es/components/Slider/components/SliderBase/SliderBase.styles_7is2ll.css +0 -4
  206. package/es/components/Slider/ui/Handler/Handler.css +0 -4
  207. package/es/components/Slider/ui/Handler/Handler.js +0 -170
  208. package/es/components/Slider/ui/Handler/Handler.js.map +0 -1
  209. package/es/components/Slider/ui/Handler/Handler.styles.js +0 -16
  210. package/es/components/Slider/ui/Handler/Handler.styles.js.map +0 -1
  211. package/es/components/Slider/ui/Handler/Handler.styles_8crx5z.css +0 -2
  212. package/es/components/Slider/ui/Thumb/Thumb.css +0 -1
  213. package/es/components/Slider/ui/Thumb/Thumb.js +0 -27
  214. package/es/components/Slider/ui/Thumb/Thumb.js.map +0 -1
  215. package/es/components/Slider/ui/Thumb/Thumb.styles.js +0 -11
  216. package/es/components/Slider/ui/Thumb/Thumb.styles.js.map +0 -1
  217. package/es/components/Slider/ui/Thumb/Thumb.styles_4w4gzn.css +0 -1
  218. package/es/components/Slider/utils/index.js +0 -50
  219. package/es/components/Slider/utils/index.js.map +0 -1
  220. package/es/components/Slider/variations/_disabled/base.js +0 -5
  221. package/es/components/Slider/variations/_disabled/base.js.map +0 -1
  222. package/es/components/Slider/variations/_disabled/base_x642ct.css +0 -1
  223. package/es/components/Slider/variations/_size/base.js +0 -5
  224. package/es/components/Slider/variations/_size/base.js.map +0 -1
  225. package/es/components/Slider/variations/_size/base_x642ct.css +0 -1
  226. package/es/components/Slider/variations/_view/base.js +0 -5
  227. package/es/components/Slider/variations/_view/base.js.map +0 -1
  228. package/es/components/Slider/variations/_view/base_x642ct.css +0 -1
  229. package/es/hooks/useIsomorphicLayoutEffect.js +0 -11
  230. package/es/hooks/useIsomorphicLayoutEffect.js.map +0 -1
  231. package/es/utils/canUseDOM.js +0 -8
  232. package/es/utils/canUseDOM.js.map +0 -1
  233. package/styled-components/cjs/components/Slider/Slider.js +0 -47
  234. package/styled-components/cjs/components/Slider/Slider.tokens.js +0 -77
  235. package/styled-components/cjs/components/Slider/Slider.types.js +0 -5
  236. package/styled-components/cjs/components/Slider/components/Double/Double.js +0 -300
  237. package/styled-components/cjs/components/Slider/components/Double/Double.styles.js +0 -36
  238. package/styled-components/cjs/components/Slider/components/Double/Double.types.js +0 -5
  239. package/styled-components/cjs/components/Slider/components/Single/Single.js +0 -176
  240. package/styled-components/cjs/components/Slider/components/Single/Single.styles.js +0 -27
  241. package/styled-components/cjs/components/Slider/components/Single/Single.types.js +0 -5
  242. package/styled-components/cjs/components/Slider/components/SliderBase/SliderBase.js +0 -83
  243. package/styled-components/cjs/components/Slider/components/SliderBase/SliderBase.styles.js +0 -21
  244. package/styled-components/cjs/components/Slider/components/SliderBase/SliderBase.types.js +0 -5
  245. package/styled-components/cjs/components/Slider/components/index.js +0 -27
  246. package/styled-components/cjs/components/Slider/index.js +0 -32
  247. package/styled-components/cjs/components/Slider/ui/Handler/Handler.js +0 -183
  248. package/styled-components/cjs/components/Slider/ui/Handler/Handler.styles.js +0 -15
  249. package/styled-components/cjs/components/Slider/ui/Handler/Handler.types.js +0 -5
  250. package/styled-components/cjs/components/Slider/ui/Thumb/Thumb.js +0 -32
  251. package/styled-components/cjs/components/Slider/ui/Thumb/Thumb.styles.js +0 -18
  252. package/styled-components/cjs/components/Slider/ui/Thumb/Thumb.types.js +0 -5
  253. package/styled-components/cjs/components/Slider/ui/index.js +0 -63
  254. package/styled-components/cjs/components/Slider/utils/index.js +0 -55
  255. package/styled-components/cjs/components/Slider/variations/_disabled/base.js +0 -8
  256. package/styled-components/cjs/components/Slider/variations/_disabled/tokens.json +0 -4
  257. package/styled-components/cjs/components/Slider/variations/_size/base.js +0 -8
  258. package/styled-components/cjs/components/Slider/variations/_size/tokens.json +0 -0
  259. package/styled-components/cjs/components/Slider/variations/_view/base.js +0 -8
  260. package/styled-components/cjs/components/Slider/variations/_view/tokens.json +0 -0
  261. package/styled-components/cjs/examples/plasma_b2c/components/Slider/Slider.config.js +0 -29
  262. package/styled-components/cjs/examples/plasma_b2c/components/Slider/Slider.js +0 -16
  263. package/styled-components/cjs/examples/plasma_b2c/components/Slider/Slider.stories.tsx +0 -164
  264. package/styled-components/cjs/examples/plasma_web/components/Slider/Slider.config.js +0 -29
  265. package/styled-components/cjs/examples/plasma_web/components/Slider/Slider.js +0 -16
  266. package/styled-components/cjs/examples/plasma_web/components/Slider/Slider.stories.tsx +0 -163
  267. package/styled-components/cjs/hooks/useIsomorphicLayoutEffect.js +0 -12
  268. package/styled-components/cjs/utils/canUseDOM.js +0 -11
  269. package/styled-components/es/components/Slider/Slider.js +0 -38
  270. package/styled-components/es/components/Slider/Slider.tokens.js +0 -71
  271. package/styled-components/es/components/Slider/Slider.types.js +0 -1
  272. package/styled-components/es/components/Slider/components/Double/Double.js +0 -292
  273. package/styled-components/es/components/Slider/components/Double/Double.styles.js +0 -29
  274. package/styled-components/es/components/Slider/components/Double/Double.types.js +0 -1
  275. package/styled-components/es/components/Slider/components/Single/Single.js +0 -168
  276. package/styled-components/es/components/Slider/components/Single/Single.styles.js +0 -20
  277. package/styled-components/es/components/Slider/components/Single/Single.types.js +0 -1
  278. package/styled-components/es/components/Slider/components/SliderBase/SliderBase.js +0 -74
  279. package/styled-components/es/components/Slider/components/SliderBase/SliderBase.styles.js +0 -14
  280. package/styled-components/es/components/Slider/components/SliderBase/SliderBase.types.js +0 -1
  281. package/styled-components/es/components/Slider/components/index.js +0 -3
  282. package/styled-components/es/components/Slider/index.js +0 -3
  283. package/styled-components/es/components/Slider/ui/Handler/Handler.js +0 -174
  284. package/styled-components/es/components/Slider/ui/Handler/Handler.styles.js +0 -8
  285. package/styled-components/es/components/Slider/ui/Handler/Handler.types.js +0 -1
  286. package/styled-components/es/components/Slider/ui/Thumb/Thumb.js +0 -25
  287. package/styled-components/es/components/Slider/ui/Thumb/Thumb.styles.js +0 -11
  288. package/styled-components/es/components/Slider/ui/Thumb/Thumb.types.js +0 -1
  289. package/styled-components/es/components/Slider/ui/index.js +0 -5
  290. package/styled-components/es/components/Slider/utils/index.js +0 -47
  291. package/styled-components/es/components/Slider/variations/_disabled/base.js +0 -2
  292. package/styled-components/es/components/Slider/variations/_disabled/tokens.json +0 -4
  293. package/styled-components/es/components/Slider/variations/_size/base.js +0 -2
  294. package/styled-components/es/components/Slider/variations/_size/tokens.json +0 -0
  295. package/styled-components/es/components/Slider/variations/_view/base.js +0 -2
  296. package/styled-components/es/components/Slider/variations/_view/tokens.json +0 -0
  297. package/styled-components/es/examples/plasma_b2c/components/Slider/Slider.config.js +0 -23
  298. package/styled-components/es/examples/plasma_b2c/components/Slider/Slider.js +0 -10
  299. package/styled-components/es/examples/plasma_b2c/components/Slider/Slider.stories.tsx +0 -164
  300. package/styled-components/es/examples/plasma_web/components/Slider/Slider.config.js +0 -23
  301. package/styled-components/es/examples/plasma_web/components/Slider/Slider.js +0 -10
  302. package/styled-components/es/examples/plasma_web/components/Slider/Slider.stories.tsx +0 -163
  303. package/styled-components/es/hooks/useIsomorphicLayoutEffect.js +0 -7
  304. package/styled-components/es/utils/canUseDOM.js +0 -5
  305. package/types/components/Slider/Slider.d.ts +0 -27
  306. package/types/components/Slider/Slider.d.ts.map +0 -1
  307. package/types/components/Slider/Slider.tokens.d.ts +0 -72
  308. package/types/components/Slider/Slider.tokens.d.ts.map +0 -1
  309. package/types/components/Slider/Slider.types.d.ts +0 -3
  310. package/types/components/Slider/Slider.types.d.ts.map +0 -1
  311. package/types/components/Slider/components/Double/Double.d.ts +0 -4
  312. package/types/components/Slider/components/Double/Double.d.ts.map +0 -1
  313. package/types/components/Slider/components/Double/Double.styles.d.ts +0 -43
  314. package/types/components/Slider/components/Double/Double.styles.d.ts.map +0 -1
  315. package/types/components/Slider/components/Double/Double.types.d.ts +0 -65
  316. package/types/components/Slider/components/Double/Double.types.d.ts.map +0 -1
  317. package/types/components/Slider/components/Single/Single.d.ts +0 -4
  318. package/types/components/Slider/components/Single/Single.d.ts.map +0 -1
  319. package/types/components/Slider/components/Single/Single.styles.d.ts +0 -8
  320. package/types/components/Slider/components/Single/Single.styles.d.ts.map +0 -1
  321. package/types/components/Slider/components/Single/Single.types.d.ts +0 -55
  322. package/types/components/Slider/components/Single/Single.types.d.ts.map +0 -1
  323. package/types/components/Slider/components/SliderBase/SliderBase.d.ts +0 -4
  324. package/types/components/Slider/components/SliderBase/SliderBase.d.ts.map +0 -1
  325. package/types/components/Slider/components/SliderBase/SliderBase.styles.d.ts +0 -6
  326. package/types/components/Slider/components/SliderBase/SliderBase.styles.d.ts.map +0 -1
  327. package/types/components/Slider/components/SliderBase/SliderBase.types.d.ts +0 -45
  328. package/types/components/Slider/components/SliderBase/SliderBase.types.d.ts.map +0 -1
  329. package/types/components/Slider/components/index.d.ts +0 -6
  330. package/types/components/Slider/components/index.d.ts.map +0 -1
  331. package/types/components/Slider/index.d.ts +0 -6
  332. package/types/components/Slider/index.d.ts.map +0 -1
  333. package/types/components/Slider/ui/Handler/Handler.d.ts +0 -9
  334. package/types/components/Slider/ui/Handler/Handler.d.ts.map +0 -1
  335. package/types/components/Slider/ui/Handler/Handler.styles.d.ts +0 -4
  336. package/types/components/Slider/ui/Handler/Handler.styles.d.ts.map +0 -1
  337. package/types/components/Slider/ui/Handler/Handler.types.d.ts +0 -24
  338. package/types/components/Slider/ui/Handler/Handler.types.d.ts.map +0 -1
  339. package/types/components/Slider/ui/Thumb/Thumb.d.ts +0 -4
  340. package/types/components/Slider/ui/Thumb/Thumb.d.ts.map +0 -1
  341. package/types/components/Slider/ui/Thumb/Thumb.styles.d.ts +0 -5
  342. package/types/components/Slider/ui/Thumb/Thumb.styles.d.ts.map +0 -1
  343. package/types/components/Slider/ui/Thumb/Thumb.types.d.ts +0 -12
  344. package/types/components/Slider/ui/Thumb/Thumb.types.d.ts.map +0 -1
  345. package/types/components/Slider/ui/index.d.ts +0 -6
  346. package/types/components/Slider/ui/index.d.ts.map +0 -1
  347. package/types/components/Slider/utils/index.d.ts +0 -33
  348. package/types/components/Slider/utils/index.d.ts.map +0 -1
  349. package/types/components/Slider/variations/_disabled/base.d.ts +0 -2
  350. package/types/components/Slider/variations/_disabled/base.d.ts.map +0 -1
  351. package/types/components/Slider/variations/_size/base.d.ts +0 -2
  352. package/types/components/Slider/variations/_size/base.d.ts.map +0 -1
  353. package/types/components/Slider/variations/_view/base.d.ts +0 -2
  354. package/types/components/Slider/variations/_view/base.d.ts.map +0 -1
  355. package/types/examples/plasma_b2c/components/Slider/Slider.config.d.ts +0 -22
  356. package/types/examples/plasma_b2c/components/Slider/Slider.config.d.ts.map +0 -1
  357. package/types/examples/plasma_b2c/components/Slider/Slider.d.ts +0 -21
  358. package/types/examples/plasma_b2c/components/Slider/Slider.d.ts.map +0 -1
  359. package/types/examples/plasma_web/components/Slider/Slider.config.d.ts +0 -22
  360. package/types/examples/plasma_web/components/Slider/Slider.config.d.ts.map +0 -1
  361. package/types/examples/plasma_web/components/Slider/Slider.d.ts +0 -21
  362. package/types/examples/plasma_web/components/Slider/Slider.d.ts.map +0 -1
  363. package/types/hooks/useIsomorphicLayoutEffect.d.ts +0 -6
  364. package/types/hooks/useIsomorphicLayoutEffect.d.ts.map +0 -1
  365. package/types/utils/canUseDOM.d.ts +0 -6
  366. package/types/utils/canUseDOM.d.ts.map +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", "contentLeft", "contentRight", "isLoading", "loader", "stretch", "square", "pin", "disabled", "focused", "outlined", "className", "blur", "style", "stretching"];
20
+ var _excluded = ["children", "view", "size", "text", "value", "contentLeft", "contentRight", "contentPlacing", "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,8 +34,11 @@ 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,
37
38
  contentLeft = props.contentLeft,
38
39
  contentRight = props.contentRight,
40
+ _props$contentPlacing = props.contentPlacing,
41
+ contentPlacing = _props$contentPlacing === void 0 ? 'default' : _props$contentPlacing,
39
42
  isLoading = props.isLoading,
40
43
  loader = props.loader,
41
44
  stretch = props.stretch,
@@ -52,23 +55,34 @@ var buttonRoot = exports.buttonRoot = function buttonRoot(Root) {
52
55
  rest = _objectWithoutProperties(props, _excluded);
53
56
  var txt = typeof children === 'string' ? children : text;
54
57
  var stretchingClass = stretch ? _Button2.classes.filledStretching : _Button2.classes["".concat(stretching, "Stretching")];
58
+ var contentRelaxedClass = contentPlacing === 'relaxed' ? _Button2.classes.contentRelaxed : undefined;
55
59
  var squareClass = square ? _Button2.classes.buttonSquare : undefined;
56
60
  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';
57
66
  return /*#__PURE__*/_react["default"].createElement(Root, _extends({
58
67
  type: "button",
59
68
  ref: ref,
60
69
  view: view,
61
70
  size: size,
71
+ value: value,
62
72
  disabled: disabled,
63
73
  focused: focused || outlined,
74
+ contentPlacing: contentPlacing,
64
75
  className: (0, _utils.cx)(squareClass, stretchingClass, _Button2.classes.buttonItem, className),
65
76
  style: _objectSpread(_objectSpread({}, style), {}, {
66
77
  '--plasma_computed-btn-br': buttonBorderRadius,
67
78
  '--plasma_private-blur': blur
68
79
  })
69
80
  }, rest), /*#__PURE__*/_react["default"].createElement(_Button.LoadWrap, {
81
+ contentPlacing: contentPlacementValue,
70
82
  isLoading: isLoading
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))));
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))));
72
86
  });
73
87
  };
74
88
  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.Loader = exports.LoadWrap = exports.ButtonText = void 0;
7
+ exports.baseContent = exports.base = exports.StyledSpinner = exports.StyledContentRight = exports.StyledContentLeft = exports.Loader = exports.LoadWrap = exports.ButtonValue = 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,28 +17,36 @@ 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 пропс
25
20
  var ButtonText = exports.ButtonText = /*#__PURE__*/_styledComponents["default"].span.withConfig({
26
21
  componentId: "plasma-new-hope__sc-9d9bqj-0"
27
- })([":not(:last-child){margin-right:0.375rem;}:not(:first-child){margin-left:0.375rem;}", ""], /*#__PURE__*/(0, _mixins.applyEllipsis)());
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)());
28
26
 
29
27
  // TODO: #720
30
28
  var LoadWrap = exports.LoadWrap = /*#__PURE__*/_styledComponents["default"].div.withConfig({
31
- componentId: "plasma-new-hope__sc-9d9bqj-1"
32
- })(["opacity:", ";display:flex;width:100%;align-items:inherit;justify-content:inherit;height:100%;"], function (_ref) {
29
+ componentId: "plasma-new-hope__sc-9d9bqj-2"
30
+ })(["opacity:", ";display:flex;align-items:inherit;justify-content:", ";height:100%;width:100%;"], function (_ref) {
33
31
  var isLoading = _ref.isLoading;
34
32
  return isLoading ? '0' : '1';
33
+ }, function (_ref2) {
34
+ var contentPlacing = _ref2.contentPlacing;
35
+ return contentPlacing;
35
36
  });
36
37
  var Loader = exports.Loader = /*#__PURE__*/_styledComponents["default"].div.withConfig({
37
- componentId: "plasma-new-hope__sc-9d9bqj-2"
38
+ componentId: "plasma-new-hope__sc-9d9bqj-3"
38
39
  })(["position:absolute;"]);
39
40
  var StyledSpinner = exports.StyledSpinner = /*#__PURE__*/(0, _styledComponents["default"])(Spinner).withConfig({
40
- componentId: "plasma-new-hope__sc-9d9bqj-3"
41
+ componentId: "plasma-new-hope__sc-9d9bqj-4"
41
42
  })(["", ":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
+ })(["margin:var(", ");"], _Button.tokens.buttonLeftContentMargin);
46
+ var StyledContentRight = exports.StyledContentRight = /*#__PURE__*/_styledComponents["default"].div.withConfig({
47
+ componentId: "plasma-new-hope__sc-9d9bqj-6"
48
+ })(["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);
42
50
 
43
51
  // INFO: Для возможности переиспользования стилей в других компонентах
44
52
  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)({
@@ -46,4 +54,4 @@ var baseContent = exports.baseContent = /*#__PURE__*/"\n position: relative;\
46
54
  outlineSize: 'var(--plasma_private-btn-outline-size)',
47
55
  outlineRadius: 'calc(0.125rem + var(--plasma_private-btn-br))',
48
56
  outlineColor: "var(".concat(_Button.tokens.buttonFocusColor, ")")
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");
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");
@@ -68,6 +68,48 @@ 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
+
71
113
  ### Вид кнопки
72
114
  Вид кнопки задается с помощью свойства `view`. Возможные значения свойства `view`:
73
115
  + `"primary"` – основная;
@@ -9,11 +9,13 @@ 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',
12
13
  buttonSquare: 'button-square',
13
14
  buttonItem: 'button-item'
14
15
  };
15
16
  var tokens = exports.tokens = {
16
17
  buttonColor: '--plasma-button-color',
18
+ buttonValueColor: '--plasma-button-value-color',
17
19
  buttonBackgroundColor: '--plasma-button-background-color',
18
20
  buttonColorHover: '--plasma-button-color-hover',
19
21
  buttonBackgroundColorHover: '--plasma-button-background-color-hover',
@@ -32,6 +34,9 @@ var tokens = exports.tokens = {
32
34
  buttonFontWeight: '--plasma-button-font-weight',
33
35
  buttonLetterSpacing: '--plasma-button-letter-spacing',
34
36
  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',
35
40
  buttonDisabledOpacity: '--plasma-button-disabled-opacity',
36
41
  buttonFocusColor: '--plasma-button-focus-color',
37
42
  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:auto;}"], _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:fit-content;}"], _Button.classes.fixedStretching, _Button.tokens.buttonWidth, _Button.classes.filledStretching, _Button.classes.autoStretching);
@@ -18,7 +18,7 @@ var _TextField = /*#__PURE__*/require("./TextField.styles");
18
18
  var _TextField2 = /*#__PURE__*/require("./TextField.tokens");
19
19
  var _ui = /*#__PURE__*/require("./ui");
20
20
  var _hooks = /*#__PURE__*/require("./hooks");
21
- var _excluded = ["id", "className", "style", "contentLeft", "contentRight", "label", "labelPlacement", "placeholder", "leftHelper", "enumerationType", "view", "size", "readOnly", "disabled", "chips", "onChange", "onChangeChips", "onSearch", "onKeyDown"];
21
+ var _excluded = ["id", "contentLeft", "contentRight", "label", "labelPlacement", "placeholder", "leftHelper", "enumerationType", "view", "size", "readOnly", "disabled", "chips", "onChange", "onChangeChips", "onSearch"];
22
22
  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); }
23
23
  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; }
24
24
  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,8 +34,6 @@ var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["display:bloc
34
34
  var textFieldRoot = exports.textFieldRoot = function textFieldRoot(Root) {
35
35
  return /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
36
36
  var id = _ref.id,
37
- className = _ref.className,
38
- style = _ref.style,
39
37
  contentLeft = _ref.contentLeft,
40
38
  contentRight = _ref.contentRight,
41
39
  label = _ref.label,
@@ -54,7 +52,6 @@ var textFieldRoot = exports.textFieldRoot = function textFieldRoot(Root) {
54
52
  onChange = _ref.onChange,
55
53
  onChangeChips = _ref.onChangeChips,
56
54
  onSearch = _ref.onSearch,
57
- onKeyDown = _ref.onKeyDown,
58
55
  rest = _objectWithoutProperties(_ref, _excluded);
59
56
  var contentRef = (0, _react.useRef)(null);
60
57
  var inputRef = (0, _react.useRef)(null);
@@ -134,10 +131,6 @@ var textFieldRoot = exports.textFieldRoot = function textFieldRoot(Root) {
134
131
  chipsRefs.current[index] = element;
135
132
  }
136
133
  };
137
- var handleOnKeyDown = function handleOnKeyDown(event) {
138
- handleInputKeydown(event);
139
- onKeyDown && onKeyDown(event);
140
- };
141
134
  (0, _react.useEffect)(function () {
142
135
  if (!isChipEnumeration && !(values !== null && values !== void 0 && values.length)) {
143
136
  return;
@@ -156,9 +149,7 @@ var textFieldRoot = exports.textFieldRoot = function textFieldRoot(Root) {
156
149
  disabled: disabled,
157
150
  readOnly: !disabled && readOnly,
158
151
  labelPlacement: innerLabelPlacementValue,
159
- onClick: handleInputFocus,
160
- className: className,
161
- style: style
152
+ onClick: handleInputFocus
162
153
  }, labelInside || innerLabelValue && /*#__PURE__*/_react["default"].createElement(_TextField.Label, {
163
154
  id: labelId,
164
155
  htmlFor: id
@@ -199,7 +190,7 @@ var textFieldRoot = exports.textFieldRoot = function textFieldRoot(Root) {
199
190
  disabled: disabled,
200
191
  readOnly: !disabled && readOnly,
201
192
  onChange: handleChange,
202
- onKeyDown: handleOnKeyDown
193
+ onKeyDown: handleInputKeydown
203
194
  })), labelInside && /*#__PURE__*/_react["default"].createElement(_TextField.Label, {
204
195
  id: labelId,
205
196
  htmlFor: innerId
@@ -21,10 +21,6 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
21
21
  function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
22
22
  function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
23
23
  function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
24
- //
25
- // Тип HTMLAttributesOmitOnChange требуется чтобы использовать компонент с кастомным пропсом onChange
26
- //
27
-
28
24
  var getStaticVariants = exports.getStaticVariants = function getStaticVariants(config) {
29
25
  if (!config.variations) {
30
26
  return [];
@@ -14,27 +14,27 @@ var config = exports.config = {
14
14
  },
15
15
  variations: {
16
16
  view: {
17
- "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-solid-default-hover);", ":var(--inverse-text-primary);", ":var(--surface-solid-default-active);"], _Button.buttonTokens.buttonColor, _Button.buttonTokens.buttonBackgroundColor, _Button.buttonTokens.buttonColorHover, _Button.buttonTokens.buttonBackgroundColorHover, _Button.buttonTokens.buttonColorActive, _Button.buttonTokens.buttonBackgroundColorActive),
18
- accent: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--on-dark-text-primary);", ":var(--surface-accent);", ":var(--on-dark-text-primary);", ":var(--surface-accent-hover);", ":var(--on-dark-text-primary);", ":var(--surface-accent-active);"], _Button.buttonTokens.buttonColor, _Button.buttonTokens.buttonBackgroundColor, _Button.buttonTokens.buttonColorHover, _Button.buttonTokens.buttonBackgroundColorHover, _Button.buttonTokens.buttonColorActive, _Button.buttonTokens.buttonBackgroundColorActive),
19
- secondary: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary-hover);", ":var(--text-primary);", ":var(--surface-transparent-secondary-active);"], _Button.buttonTokens.buttonColor, _Button.buttonTokens.buttonBackgroundColor, _Button.buttonTokens.buttonColorHover, _Button.buttonTokens.buttonBackgroundColorHover, _Button.buttonTokens.buttonColorActive, _Button.buttonTokens.buttonBackgroundColorActive),
20
- clear: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--surface-clear);", ":var(--text-primary-hover);", ":var(--surface-clear);", ":var(--text-primary-active);", ":var(--surface-clear);"], _Button.buttonTokens.buttonColor, _Button.buttonTokens.buttonBackgroundColor, _Button.buttonTokens.buttonColorHover, _Button.buttonTokens.buttonBackgroundColorHover, _Button.buttonTokens.buttonColorActive, _Button.buttonTokens.buttonBackgroundColorActive),
21
- positive: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--on-dark-text-primary);", ":var(--surface-positive);", ":var(--on-dark-text-primary);", ":var(--surface-positive-hover);", ":var(--on-dark-text-primary);", ":var(--surface-positive-active);"], _Button.buttonTokens.buttonColor, _Button.buttonTokens.buttonBackgroundColor, _Button.buttonTokens.buttonColorHover, _Button.buttonTokens.buttonBackgroundColorHover, _Button.buttonTokens.buttonColorActive, _Button.buttonTokens.buttonBackgroundColorActive),
22
- warning: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--on-dark-text-primary);", ":var(--surface-warning);", ":var(--on-dark-text-primary);", ":var(--surface-warning-hover);", ":var(--on-dark-text-primary);", ":var(--surface-warning-active);"], _Button.buttonTokens.buttonColor, _Button.buttonTokens.buttonBackgroundColor, _Button.buttonTokens.buttonColorHover, _Button.buttonTokens.buttonBackgroundColorHover, _Button.buttonTokens.buttonColorActive, _Button.buttonTokens.buttonBackgroundColorActive),
23
- negative: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--on-dark-text-primary);", ":var(--surface-negative);", ":var(--on-dark-text-primary);", ":var(--surface-negative-hover);", ":var(--on-dark-text-primary);", ":var(--surface-negative-active);"], _Button.buttonTokens.buttonColor, _Button.buttonTokens.buttonBackgroundColor, _Button.buttonTokens.buttonColorHover, _Button.buttonTokens.buttonBackgroundColorHover, _Button.buttonTokens.buttonColorActive, _Button.buttonTokens.buttonBackgroundColorActive),
24
- dark: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--on-dark-text-primary);", ":var(--on-light-surface-transparent-deep);", ":var(--on-dark-text-primary);", ":var(--on-light-surface-transparent-deep-hover);", ":var(--on-dark-text-primary);", ":var(--on-light-surface-transparent-deep-active);"], _Button.buttonTokens.buttonColor, _Button.buttonTokens.buttonBackgroundColor, _Button.buttonTokens.buttonColorHover, _Button.buttonTokens.buttonBackgroundColorHover, _Button.buttonTokens.buttonColorActive, _Button.buttonTokens.buttonBackgroundColorActive),
25
- black: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--on-dark-text-primary);", ":var(--on-light-surface-solid-default);", ":var(--on-dark-text-primary);", ":var(--on-light-surface-solid-default-hover);", ":var(--on-dark-text-primary);", ":var(--on-light-surface-solid-default-active);"], _Button.buttonTokens.buttonColor, _Button.buttonTokens.buttonBackgroundColor, _Button.buttonTokens.buttonColorHover, _Button.buttonTokens.buttonBackgroundColorHover, _Button.buttonTokens.buttonColorActive, _Button.buttonTokens.buttonBackgroundColorActive),
26
- white: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--on-light-text-primary);", ":var(--on-dark-surface-solid-default);", ":var(--on-light-text-primary);", ":var(--on-dark-surface-solid-default-hover);", ":var(--on-light-text-primary);", ":var(--on-dark-surface-solid-default-active);"], _Button.buttonTokens.buttonColor, _Button.buttonTokens.buttonBackgroundColor, _Button.buttonTokens.buttonColorHover, _Button.buttonTokens.buttonBackgroundColorHover, _Button.buttonTokens.buttonColorActive, _Button.buttonTokens.buttonBackgroundColorActive)
17
+ "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--inverse-text-primary);", ":var(--inverse-text-secondary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-solid-default-hover);", ":var(--inverse-text-primary);", ":var(--surface-solid-default-active);"], _Button.buttonTokens.buttonColor, _Button.buttonTokens.buttonValueColor, _Button.buttonTokens.buttonBackgroundColor, _Button.buttonTokens.buttonColorHover, _Button.buttonTokens.buttonBackgroundColorHover, _Button.buttonTokens.buttonColorActive, _Button.buttonTokens.buttonBackgroundColorActive),
18
+ accent: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--on-dark-text-primary);", ":var(--on-dark-text-secondary);", ":var(--surface-accent);", ":var(--on-dark-text-primary);", ":var(--surface-accent-hover);", ":var(--on-dark-text-primary);", ":var(--surface-accent-active);"], _Button.buttonTokens.buttonColor, _Button.buttonTokens.buttonValueColor, _Button.buttonTokens.buttonBackgroundColor, _Button.buttonTokens.buttonColorHover, _Button.buttonTokens.buttonBackgroundColorHover, _Button.buttonTokens.buttonColorActive, _Button.buttonTokens.buttonBackgroundColorActive),
19
+ secondary: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary-hover);", ":var(--text-primary);", ":var(--surface-transparent-secondary-active);"], _Button.buttonTokens.buttonColor, _Button.buttonTokens.buttonValueColor, _Button.buttonTokens.buttonBackgroundColor, _Button.buttonTokens.buttonColorHover, _Button.buttonTokens.buttonBackgroundColorHover, _Button.buttonTokens.buttonColorActive, _Button.buttonTokens.buttonBackgroundColorActive),
20
+ clear: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-clear);", ":var(--text-primary-hover);", ":var(--surface-clear);", ":var(--text-primary-active);", ":var(--surface-clear);"], _Button.buttonTokens.buttonColor, _Button.buttonTokens.buttonValueColor, _Button.buttonTokens.buttonBackgroundColor, _Button.buttonTokens.buttonColorHover, _Button.buttonTokens.buttonBackgroundColorHover, _Button.buttonTokens.buttonColorActive, _Button.buttonTokens.buttonBackgroundColorActive),
21
+ positive: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--on-dark-text-primary);", ":var(--on-dark-text-secondary);", ":var(--surface-positive);", ":var(--on-dark-text-primary);", ":var(--surface-positive-hover);", ":var(--on-dark-text-primary);", ":var(--surface-positive-active);"], _Button.buttonTokens.buttonColor, _Button.buttonTokens.buttonValueColor, _Button.buttonTokens.buttonBackgroundColor, _Button.buttonTokens.buttonColorHover, _Button.buttonTokens.buttonBackgroundColorHover, _Button.buttonTokens.buttonColorActive, _Button.buttonTokens.buttonBackgroundColorActive),
22
+ warning: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--on-dark-text-primary);", ":var(--on-dark-text-secondary);", ":var(--surface-warning);", ":var(--on-dark-text-primary);", ":var(--surface-warning-hover);", ":var(--on-dark-text-primary);", ":var(--surface-warning-active);"], _Button.buttonTokens.buttonColor, _Button.buttonTokens.buttonValueColor, _Button.buttonTokens.buttonBackgroundColor, _Button.buttonTokens.buttonColorHover, _Button.buttonTokens.buttonBackgroundColorHover, _Button.buttonTokens.buttonColorActive, _Button.buttonTokens.buttonBackgroundColorActive),
23
+ negative: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--on-dark-text-primary);", ":var(--on-dark-text-secondary);", ":var(--surface-negative);", ":var(--on-dark-text-primary);", ":var(--surface-negative-hover);", ":var(--on-dark-text-primary);", ":var(--surface-negative-active);"], _Button.buttonTokens.buttonColor, _Button.buttonTokens.buttonValueColor, _Button.buttonTokens.buttonBackgroundColor, _Button.buttonTokens.buttonColorHover, _Button.buttonTokens.buttonBackgroundColorHover, _Button.buttonTokens.buttonColorActive, _Button.buttonTokens.buttonBackgroundColorActive),
24
+ dark: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--on-dark-text-primary);", ":var(--on-dark-text-secondary);", ":var(--on-light-surface-transparent-deep);", ":var(--on-dark-text-primary);", ":var(--on-light-surface-transparent-deep-hover);", ":var(--on-dark-text-primary);", ":var(--on-light-surface-transparent-deep-active);"], _Button.buttonTokens.buttonColor, _Button.buttonTokens.buttonValueColor, _Button.buttonTokens.buttonBackgroundColor, _Button.buttonTokens.buttonColorHover, _Button.buttonTokens.buttonBackgroundColorHover, _Button.buttonTokens.buttonColorActive, _Button.buttonTokens.buttonBackgroundColorActive),
25
+ black: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--on-dark-text-primary);", ":var(--on-dark-text-secondary);", ":var(--on-light-surface-solid-default);", ":var(--on-dark-text-primary);", ":var(--on-light-surface-solid-default-hover);", ":var(--on-dark-text-primary);", ":var(--on-light-surface-solid-default-active);"], _Button.buttonTokens.buttonColor, _Button.buttonTokens.buttonValueColor, _Button.buttonTokens.buttonBackgroundColor, _Button.buttonTokens.buttonColorHover, _Button.buttonTokens.buttonBackgroundColorHover, _Button.buttonTokens.buttonColorActive, _Button.buttonTokens.buttonBackgroundColorActive),
26
+ white: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--on-light-text-primary);", ":var(--on-light-text-secondary);", ":var(--on-dark-surface-solid-default);", ":var(--on-light-text-primary);", ":var(--on-dark-surface-solid-default-hover);", ":var(--on-light-text-primary);", ":var(--on-dark-surface-solid-default-active);"], _Button.buttonTokens.buttonColor, _Button.buttonTokens.buttonValueColor, _Button.buttonTokens.buttonBackgroundColor, _Button.buttonTokens.buttonColorHover, _Button.buttonTokens.buttonBackgroundColorHover, _Button.buttonTokens.buttonColorActive, _Button.buttonTokens.buttonBackgroundColorActive)
27
27
  },
28
28
  size: {
29
- l: /*#__PURE__*/(0, _styledComponents.css)(["", ":3.5rem;", ":12.5rem;", ":1.5rem;", ":0.875rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-bold-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":1.375rem;", ":inherit;"], _Button.buttonTokens.buttonHeight, _Button.buttonTokens.buttonWidth, _Button.buttonTokens.buttonPadding, _Button.buttonTokens.buttonRadius, _Button.buttonTokens.buttonFontFamily, _Button.buttonTokens.buttonFontSize, _Button.buttonTokens.buttonFontStyle, _Button.buttonTokens.buttonFontWeight, _Button.buttonTokens.buttonLetterSpacing, _Button.buttonTokens.buttonLineHeight, _Button.buttonTokens.buttonSpinnerSize, _Button.buttonTokens.buttonSpinnerColor),
30
- lr: /*#__PURE__*/(0, _styledComponents.css)(["", ":3.5rem;", ":12.5rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-bold-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":1.375rem;", ":inherit;"], _Button.buttonTokens.buttonHeight, _Button.buttonTokens.buttonWidth, _Button.buttonTokens.buttonFontFamily, _Button.buttonTokens.buttonFontSize, _Button.buttonTokens.buttonFontStyle, _Button.buttonTokens.buttonFontWeight, _Button.buttonTokens.buttonLetterSpacing, _Button.buttonTokens.buttonLineHeight, _Button.buttonTokens.buttonSpinnerSize, _Button.buttonTokens.buttonSpinnerColor),
31
- m: /*#__PURE__*/(0, _styledComponents.css)(["", ":3rem;", ":11.25rem;", ":1.25rem;", ":0.75rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-bold-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":1.375rem;", ":inherit;"], _Button.buttonTokens.buttonHeight, _Button.buttonTokens.buttonWidth, _Button.buttonTokens.buttonPadding, _Button.buttonTokens.buttonRadius, _Button.buttonTokens.buttonFontFamily, _Button.buttonTokens.buttonFontSize, _Button.buttonTokens.buttonFontStyle, _Button.buttonTokens.buttonFontWeight, _Button.buttonTokens.buttonLetterSpacing, _Button.buttonTokens.buttonLineHeight, _Button.buttonTokens.buttonSpinnerSize, _Button.buttonTokens.buttonSpinnerColor),
32
- mr: /*#__PURE__*/(0, _styledComponents.css)(["", ":3rem;", ":11.25rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-bold-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":1.375rem;", ":inherit;"], _Button.buttonTokens.buttonHeight, _Button.buttonTokens.buttonWidth, _Button.buttonTokens.buttonFontFamily, _Button.buttonTokens.buttonFontSize, _Button.buttonTokens.buttonFontStyle, _Button.buttonTokens.buttonFontWeight, _Button.buttonTokens.buttonLetterSpacing, _Button.buttonTokens.buttonLineHeight, _Button.buttonTokens.buttonSpinnerSize, _Button.buttonTokens.buttonSpinnerColor),
33
- s: /*#__PURE__*/(0, _styledComponents.css)(["", ":2.5rem;", ":11.25rem;", ":1rem;", ":0.625rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-bold-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":1.375rem;", ":inherit;"], _Button.buttonTokens.buttonHeight, _Button.buttonTokens.buttonWidth, _Button.buttonTokens.buttonPadding, _Button.buttonTokens.buttonRadius, _Button.buttonTokens.buttonFontFamily, _Button.buttonTokens.buttonFontSize, _Button.buttonTokens.buttonFontStyle, _Button.buttonTokens.buttonFontWeight, _Button.buttonTokens.buttonLetterSpacing, _Button.buttonTokens.buttonLineHeight, _Button.buttonTokens.buttonSpinnerSize, _Button.buttonTokens.buttonSpinnerColor),
34
- sr: /*#__PURE__*/(0, _styledComponents.css)(["", ":2.5rem;", ":11.25rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-bold-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":1.375rem;", ":inherit;"], _Button.buttonTokens.buttonHeight, _Button.buttonTokens.buttonWidth, _Button.buttonTokens.buttonFontFamily, _Button.buttonTokens.buttonFontSize, _Button.buttonTokens.buttonFontStyle, _Button.buttonTokens.buttonFontWeight, _Button.buttonTokens.buttonLetterSpacing, _Button.buttonTokens.buttonLineHeight, _Button.buttonTokens.buttonSpinnerSize, _Button.buttonTokens.buttonSpinnerColor),
35
- xs: /*#__PURE__*/(0, _styledComponents.css)(["", ":2rem;", ":10rem;", ":0.75rem;", ":0.5rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":1rem;", ":inherit;"], _Button.buttonTokens.buttonHeight, _Button.buttonTokens.buttonWidth, _Button.buttonTokens.buttonPadding, _Button.buttonTokens.buttonRadius, _Button.buttonTokens.buttonFontFamily, _Button.buttonTokens.buttonFontSize, _Button.buttonTokens.buttonFontStyle, _Button.buttonTokens.buttonFontWeight, _Button.buttonTokens.buttonLetterSpacing, _Button.buttonTokens.buttonLineHeight, _Button.buttonTokens.buttonSpinnerSize, _Button.buttonTokens.buttonSpinnerColor),
36
- xsr: /*#__PURE__*/(0, _styledComponents.css)(["", ":2rem;", ":10rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":1rem;", ":inherit;"], _Button.buttonTokens.buttonHeight, _Button.buttonTokens.buttonWidth, _Button.buttonTokens.buttonFontFamily, _Button.buttonTokens.buttonFontSize, _Button.buttonTokens.buttonFontStyle, _Button.buttonTokens.buttonFontWeight, _Button.buttonTokens.buttonLetterSpacing, _Button.buttonTokens.buttonLineHeight, _Button.buttonTokens.buttonSpinnerSize, _Button.buttonTokens.buttonSpinnerColor),
37
- xxs: /*#__PURE__*/(0, _styledComponents.css)(["", ":1.5rem;", ":8.75rem;", ":0.625rem;", ":0.375rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":0.75rem;", ":inherit;"], _Button.buttonTokens.buttonHeight, _Button.buttonTokens.buttonWidth, _Button.buttonTokens.buttonPadding, _Button.buttonTokens.buttonRadius, _Button.buttonTokens.buttonFontFamily, _Button.buttonTokens.buttonFontSize, _Button.buttonTokens.buttonFontStyle, _Button.buttonTokens.buttonFontWeight, _Button.buttonTokens.buttonLetterSpacing, _Button.buttonTokens.buttonLineHeight, _Button.buttonTokens.buttonSpinnerSize, _Button.buttonTokens.buttonSpinnerColor)
29
+ l: /*#__PURE__*/(0, _styledComponents.css)(["", ":3.5rem;", ":12.5rem;", ":1.5rem;", ":0.875rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-bold-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":1.375rem;", ":inherit;", ":0 0.5rem 0 -0.125rem;", ":0 -0.125rem 0 0.5rem;", ":0 0 0 0.25rem;"], _Button.buttonTokens.buttonHeight, _Button.buttonTokens.buttonWidth, _Button.buttonTokens.buttonPadding, _Button.buttonTokens.buttonRadius, _Button.buttonTokens.buttonFontFamily, _Button.buttonTokens.buttonFontSize, _Button.buttonTokens.buttonFontStyle, _Button.buttonTokens.buttonFontWeight, _Button.buttonTokens.buttonLetterSpacing, _Button.buttonTokens.buttonLineHeight, _Button.buttonTokens.buttonSpinnerSize, _Button.buttonTokens.buttonSpinnerColor, _Button.buttonTokens.buttonLeftContentMargin, _Button.buttonTokens.buttonRightContentMargin, _Button.buttonTokens.buttonValueMargin),
30
+ lr: /*#__PURE__*/(0, _styledComponents.css)(["", ":3.5rem;", ":12.5rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-bold-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":1.375rem;", ":inherit;", ":0 0.5rem 0 0;", ":0 0 0 0.5rem;", ":0 0 0 0.25rem;"], _Button.buttonTokens.buttonHeight, _Button.buttonTokens.buttonWidth, _Button.buttonTokens.buttonFontFamily, _Button.buttonTokens.buttonFontSize, _Button.buttonTokens.buttonFontStyle, _Button.buttonTokens.buttonFontWeight, _Button.buttonTokens.buttonLetterSpacing, _Button.buttonTokens.buttonLineHeight, _Button.buttonTokens.buttonSpinnerSize, _Button.buttonTokens.buttonSpinnerColor, _Button.buttonTokens.buttonLeftContentMargin, _Button.buttonTokens.buttonRightContentMargin, _Button.buttonTokens.buttonValueMargin),
31
+ m: /*#__PURE__*/(0, _styledComponents.css)(["", ":3rem;", ":11.25rem;", ":1.25rem;", ":0.75rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-bold-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":1.375rem;", ":inherit;", ":0 0.375rem 0 -0.125rem;", ":0 -0.125rem 0 0.375rem;", ":0 0 0 0.25rem;"], _Button.buttonTokens.buttonHeight, _Button.buttonTokens.buttonWidth, _Button.buttonTokens.buttonPadding, _Button.buttonTokens.buttonRadius, _Button.buttonTokens.buttonFontFamily, _Button.buttonTokens.buttonFontSize, _Button.buttonTokens.buttonFontStyle, _Button.buttonTokens.buttonFontWeight, _Button.buttonTokens.buttonLetterSpacing, _Button.buttonTokens.buttonLineHeight, _Button.buttonTokens.buttonSpinnerSize, _Button.buttonTokens.buttonSpinnerColor, _Button.buttonTokens.buttonLeftContentMargin, _Button.buttonTokens.buttonRightContentMargin, _Button.buttonTokens.buttonValueMargin),
32
+ mr: /*#__PURE__*/(0, _styledComponents.css)(["", ":3rem;", ":11.25rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-bold-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":1.375rem;", ":inherit;", ":0 0.375rem 0 0;", ":0 0 0 0.375rem;", ":0 0 0 0.25rem;"], _Button.buttonTokens.buttonHeight, _Button.buttonTokens.buttonWidth, _Button.buttonTokens.buttonFontFamily, _Button.buttonTokens.buttonFontSize, _Button.buttonTokens.buttonFontStyle, _Button.buttonTokens.buttonFontWeight, _Button.buttonTokens.buttonLetterSpacing, _Button.buttonTokens.buttonLineHeight, _Button.buttonTokens.buttonSpinnerSize, _Button.buttonTokens.buttonSpinnerColor, _Button.buttonTokens.buttonLeftContentMargin, _Button.buttonTokens.buttonRightContentMargin, _Button.buttonTokens.buttonValueMargin),
33
+ s: /*#__PURE__*/(0, _styledComponents.css)(["", ":2.5rem;", ":11.25rem;", ":1rem;", ":0.625rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-bold-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":1.375rem;", ":inherit;", ":0 0.25rem 0 -0.125rem;", ":0 -0.125rem 0 0.25rem;", ":0 0 0 0.25rem;"], _Button.buttonTokens.buttonHeight, _Button.buttonTokens.buttonWidth, _Button.buttonTokens.buttonPadding, _Button.buttonTokens.buttonRadius, _Button.buttonTokens.buttonFontFamily, _Button.buttonTokens.buttonFontSize, _Button.buttonTokens.buttonFontStyle, _Button.buttonTokens.buttonFontWeight, _Button.buttonTokens.buttonLetterSpacing, _Button.buttonTokens.buttonLineHeight, _Button.buttonTokens.buttonSpinnerSize, _Button.buttonTokens.buttonSpinnerColor, _Button.buttonTokens.buttonLeftContentMargin, _Button.buttonTokens.buttonRightContentMargin, _Button.buttonTokens.buttonValueMargin),
34
+ sr: /*#__PURE__*/(0, _styledComponents.css)(["", ":2.5rem;", ":11.25rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-bold-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":1.375rem;", ":inherit;", ":0 0.25rem 0 0;", ":0 0 0 0.25rem;", ":0 0 0 0.25rem;"], _Button.buttonTokens.buttonHeight, _Button.buttonTokens.buttonWidth, _Button.buttonTokens.buttonFontFamily, _Button.buttonTokens.buttonFontSize, _Button.buttonTokens.buttonFontStyle, _Button.buttonTokens.buttonFontWeight, _Button.buttonTokens.buttonLetterSpacing, _Button.buttonTokens.buttonLineHeight, _Button.buttonTokens.buttonSpinnerSize, _Button.buttonTokens.buttonSpinnerColor, _Button.buttonTokens.buttonLeftContentMargin, _Button.buttonTokens.buttonRightContentMargin, _Button.buttonTokens.buttonValueMargin),
35
+ xs: /*#__PURE__*/(0, _styledComponents.css)(["", ":2rem;", ":10rem;", ":0.75rem;", ":0.5rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":1rem;", ":inherit;", ":0 0.25rem 0 -0.125rem;", ":0 -0.125rem 0 0.25rem;", ":0 0 0 0.25rem;"], _Button.buttonTokens.buttonHeight, _Button.buttonTokens.buttonWidth, _Button.buttonTokens.buttonPadding, _Button.buttonTokens.buttonRadius, _Button.buttonTokens.buttonFontFamily, _Button.buttonTokens.buttonFontSize, _Button.buttonTokens.buttonFontStyle, _Button.buttonTokens.buttonFontWeight, _Button.buttonTokens.buttonLetterSpacing, _Button.buttonTokens.buttonLineHeight, _Button.buttonTokens.buttonSpinnerSize, _Button.buttonTokens.buttonSpinnerColor, _Button.buttonTokens.buttonLeftContentMargin, _Button.buttonTokens.buttonRightContentMargin, _Button.buttonTokens.buttonValueMargin),
36
+ xsr: /*#__PURE__*/(0, _styledComponents.css)(["", ":2rem;", ":10rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":1rem;", ":inherit;", ":0 0.25rem 0 0;", ":0 0 0 0.25rem;", ":0 0 0 0.25rem;"], _Button.buttonTokens.buttonHeight, _Button.buttonTokens.buttonWidth, _Button.buttonTokens.buttonFontFamily, _Button.buttonTokens.buttonFontSize, _Button.buttonTokens.buttonFontStyle, _Button.buttonTokens.buttonFontWeight, _Button.buttonTokens.buttonLetterSpacing, _Button.buttonTokens.buttonLineHeight, _Button.buttonTokens.buttonSpinnerSize, _Button.buttonTokens.buttonSpinnerColor, _Button.buttonTokens.buttonLeftContentMargin, _Button.buttonTokens.buttonRightContentMargin, _Button.buttonTokens.buttonValueMargin),
37
+ xxs: /*#__PURE__*/(0, _styledComponents.css)(["", ":1.5rem;", ":8.75rem;", ":0.625rem;", ":0.375rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":0.75rem;", ":inherit;", ":0 0.25rem 0 -0.125rem;", ":0 -0.125rem 0 0.25rem;", ":0 0 0 0.25rem;"], _Button.buttonTokens.buttonHeight, _Button.buttonTokens.buttonWidth, _Button.buttonTokens.buttonPadding, _Button.buttonTokens.buttonRadius, _Button.buttonTokens.buttonFontFamily, _Button.buttonTokens.buttonFontSize, _Button.buttonTokens.buttonFontStyle, _Button.buttonTokens.buttonFontWeight, _Button.buttonTokens.buttonLetterSpacing, _Button.buttonTokens.buttonLineHeight, _Button.buttonTokens.buttonSpinnerSize, _Button.buttonTokens.buttonSpinnerColor, _Button.buttonTokens.buttonLeftContentMargin, _Button.buttonTokens.buttonRightContentMargin, _Button.buttonTokens.buttonValueMargin)
38
38
  },
39
39
  disabled: {
40
40
  "true": /*#__PURE__*/(0, _styledComponents.css)(["", ":0.4;"], _Button.buttonTokens.buttonDisabledOpacity)
@@ -4,57 +4,103 @@ import type { StoryObj, Meta } from '@storybook/react';
4
4
  import { disableProps } from '@salutejs/plasma-sb-utils';
5
5
 
6
6
  import { IconMic } from '../../../../components/_Icon';
7
- import { buttonConfig } from '../../../../components/Button';
8
- import { mergeConfig } from '../../../../engines';
9
- import { WithTheme, argTypesFromConfig } from '../../../_helpers';
7
+ import { WithTheme } from '../../../_helpers';
10
8
 
11
- import { config } from './Button.config';
12
9
  import { Button } from './Button';
13
10
 
11
+ const views = ['default', 'accent', 'positive', 'warning', 'negative', 'dark', 'light'];
12
+ const sizes = ['l', 'm', 's', 'xs', 'xxs'];
13
+ const stretchingValues = ['auto', 'filled', 'fixed'];
14
+ const pinValues = [
15
+ '',
16
+ 'square-square',
17
+ 'square-clear',
18
+ 'clear-square',
19
+ 'clear-clear',
20
+ 'clear-circle',
21
+ 'circle-clear',
22
+ 'circle-circle',
23
+ ];
24
+ const contentPlacinValues = ['default', 'relaxed'];
25
+
14
26
  const meta: Meta<typeof Button> = {
15
27
  title: 'plasma_b2c/Button',
16
28
  decorators: [WithTheme],
17
29
  component: Button,
18
30
  args: {
19
- text: 'Hello',
20
31
  view: 'default',
21
32
  size: 'm',
33
+ contentPlacing: 'default',
34
+ stretching: 'auto',
35
+ text: 'Hello',
36
+ value: 'Value',
22
37
  disabled: false,
23
38
  focused: true,
24
39
  square: false,
25
- stretching: 'auto',
26
40
  isLoading: false,
27
41
  },
28
42
  argTypes: {
29
- ...argTypesFromConfig(mergeConfig(buttonConfig, config)),
30
- pin: {
31
- options: [
32
- 'square-square',
33
- 'square-clear',
34
- 'clear-square',
35
- 'clear-clear',
36
- 'clear-circle',
37
- 'circle-clear',
38
- 'circle-circle',
39
- '',
40
- ],
43
+ view: {
44
+ options: views,
45
+ control: {
46
+ type: 'select',
47
+ },
48
+ },
49
+ size: {
50
+ options: sizes,
51
+ control: {
52
+ type: 'select',
53
+ },
54
+ },
55
+ contentPlacing: {
56
+ options: contentPlacinValues,
41
57
  control: {
42
58
  type: 'select',
43
59
  },
44
- table: { defaultValue: { summary: 'bottom' } },
45
60
  },
46
61
  stretching: {
47
- options: ['auto', 'filled', 'fixed'],
62
+ options: stretchingValues,
48
63
  control: {
49
64
  type: 'select',
50
65
  },
51
66
  },
67
+ pin: {
68
+ options: pinValues,
69
+ control: {
70
+ type: 'select',
71
+ },
72
+ table: { defaultValue: { summary: 'bottom' } },
73
+ },
52
74
  },
53
75
  };
54
76
 
55
77
  export default meta;
56
78
 
57
- export const Default: StoryObj<ComponentProps<typeof Button>> = {};
79
+ type StoryPropsDefault = ComponentProps<typeof Button> & {
80
+ enableContentLeft: boolean;
81
+ enableContentRight: boolean;
82
+ };
83
+
84
+ const StoryDefault = ({ enableContentLeft, enableContentRight, size, ...rest }: StoryPropsDefault) => {
85
+ const iconSize = size === 'xs' ? 'xs' : 's';
86
+
87
+ return (
88
+ <Button
89
+ contentLeft={enableContentLeft ? <IconMic size={iconSize} color="inherit" /> : undefined}
90
+ contentRight={enableContentRight ? <IconMic size={iconSize} color="inherit" /> : undefined}
91
+ size={size}
92
+ {...rest}
93
+ />
94
+ );
95
+ };
96
+
97
+ export const Default: StoryObj<StoryPropsDefault> = {
98
+ args: {
99
+ enableContentLeft: false,
100
+ enableContentRight: false,
101
+ },
102
+ render: (args) => <StoryDefault {...args} />,
103
+ };
58
104
 
59
105
  export const AccessibilityWithChildren: StoryObj<ComponentProps<typeof Button>> = {
60
106
  argTypes: { ...disableProps(['text']) },