@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
@@ -14,7 +14,6 @@ export var classes = {
14
14
  export var tokens = {
15
15
  buttonGroupOrientation: '--plasma-button-group-orientation',
16
16
  buttonColor: '--plasma-button-group-item-color',
17
- buttonValueColor: '--plasma-button-group-item-value-color',
18
17
  buttonBackgroundColor: '--plasma-button-group-item-background-color',
19
18
  buttonColorHover: '--plasma-button-group-item-color-hover',
20
19
  buttonBackgroundColorHover: '--plasma-button-group-item-background-color-hover',
@@ -1,4 +1,3 @@
1
1
  import { css } from 'styled-components';
2
- import { classes, tokens } from '../../ButtonGroup.tokens';
3
- import { buttonClasses } from '../../../Button';
4
- export var base = /*#__PURE__*/css(["flex-direction:var(", ");&.", " .", "{width:auto;}"], tokens.buttonGroupOrientation, classes.vertical, buttonClasses.buttonItem);
2
+ import { tokens } from '../../ButtonGroup.tokens';
3
+ export var base = /*#__PURE__*/css(["flex-direction:var(", ");"], tokens.buttonGroupOrientation);
@@ -1,4 +1,4 @@
1
1
  import { css } from 'styled-components';
2
2
  import { classes, tokens } from '../../ButtonGroup.tokens';
3
3
  import { buttonClasses, buttonTokens } from '../../../Button';
4
- export var base = /*#__PURE__*/css(["&.", " .", "{", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");}"], classes.buttonGroupOverrideStyles, buttonClasses.buttonItem, buttonTokens.buttonColor, tokens.buttonColor, buttonTokens.buttonValueColor, tokens.buttonValueColor, buttonTokens.buttonBackgroundColor, tokens.buttonBackgroundColor, buttonTokens.buttonColorHover, tokens.buttonColorHover, buttonTokens.buttonBackgroundColorHover, tokens.buttonBackgroundColorHover, buttonTokens.buttonColorActive, tokens.buttonColorActive, buttonTokens.buttonBackgroundColorActive, tokens.buttonBackgroundColorActive);
4
+ export var base = /*#__PURE__*/css(["&.", " .", "{", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");}"], classes.buttonGroupOverrideStyles, buttonClasses.buttonItem, buttonTokens.buttonColor, tokens.buttonColor, buttonTokens.buttonBackgroundColor, tokens.buttonBackgroundColor, buttonTokens.buttonColorHover, tokens.buttonColorHover, buttonTokens.buttonBackgroundColorHover, tokens.buttonBackgroundColorHover, buttonTokens.buttonColorActive, tokens.buttonColorActive, buttonTokens.buttonBackgroundColorActive, tokens.buttonBackgroundColorActive);
@@ -1,4 +1,4 @@
1
- var _excluded = ["arrow", "iconSize", "value"];
1
+ var _excluded = ["arrow", "iconSize"];
2
2
  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); }
3
3
  function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
4
4
  function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -22,7 +22,6 @@ export var headerArrowRoot = function headerArrowRoot(Root) {
22
22
  var arrow = props.arrow,
23
23
  _props$iconSize = props.iconSize,
24
24
  iconSize = _props$iconSize === void 0 ? 's' : _props$iconSize,
25
- value = props.value,
26
25
  rest = _objectWithoutProperties(props, _excluded);
27
26
  var minimizeClass = arrow === 'minimize' ? classes.headerArrowIconMinimize : undefined;
28
27
  return /*#__PURE__*/React.createElement(Root, {
@@ -31,8 +30,7 @@ export var headerArrowRoot = function headerArrowRoot(Root) {
31
30
  view: "clear",
32
31
  size: "s",
33
32
  tabIndex: -1,
34
- className: classes.headerArrow,
35
- value: String(value)
33
+ className: classes.headerArrow
36
34
  }, rest), /*#__PURE__*/React.createElement(IconChevronLeft, _extends({
37
35
  size: iconSize,
38
36
  sizeCustomProperty: tokens.headerArrowIconSize,
@@ -0,0 +1,38 @@
1
+ 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); }
2
+ import React, { forwardRef } from 'react';
3
+ import { base as viewCSS } from './variations/_view/base';
4
+ import { base as sizeCSS } from './variations/_size/base';
5
+ import { base as disabledCSS } from './variations/_disabled/base';
6
+ import { SingleSlider, DoubleSlider } from './components';
7
+ var isSingleValueProps = function isSingleValueProps(props) {
8
+ return typeof props.value === 'number';
9
+ };
10
+ export var sliderRoot = function sliderRoot(Root) {
11
+ return /*#__PURE__*/forwardRef(function (props, ref) {
12
+ return /*#__PURE__*/React.createElement(Root, _extends({
13
+ ref: ref
14
+ }, props), isSingleValueProps(props) && /*#__PURE__*/React.createElement(SingleSlider, props), !isSingleValueProps(props) && /*#__PURE__*/React.createElement(DoubleSlider, props));
15
+ });
16
+ };
17
+ export var sliderConfig = {
18
+ name: 'Slider',
19
+ tag: 'div',
20
+ layout: sliderRoot,
21
+ base: '',
22
+ variations: {
23
+ view: {
24
+ css: viewCSS
25
+ },
26
+ size: {
27
+ css: sizeCSS
28
+ },
29
+ disabled: {
30
+ css: disabledCSS,
31
+ attrs: true
32
+ }
33
+ },
34
+ defaults: {
35
+ view: 'default',
36
+ size: 'm'
37
+ }
38
+ };
@@ -0,0 +1,71 @@
1
+ export var classes = {
2
+ labelPlacementOuter: 'slider-label-placement-outer',
3
+ labelPlacementInner: 'slider-label-placement-inner',
4
+ rangeValuesPlacementOuter: 'slider-range-values-placement-outer',
5
+ rangeValuesPlacementInner: 'slider-range-values-placement-inner',
6
+ maxRangeValue: 'slider-max-range-value',
7
+ hideMinValue: 'slider-hide-min-value',
8
+ hideMaxValue: 'slider-hide-max-value',
9
+ textFieldActive: 'slider-text-field-active',
10
+ firstTextField: 'slider-first-text-field',
11
+ secondTextField: 'slider-second-text-field',
12
+ activeRangeValue: 'slider-active-range-value'
13
+ };
14
+ export var tokens = {
15
+ height: '--plasma-slider-height',
16
+ labelWrapperGap: '--plasma-slider-label-wrapper-gap',
17
+ labelWrapperMarginBottom: '--plasma-slider-label-wrapper-margin-bottom',
18
+ labelWrapperMarginRight: '--plasma-slider-label-wrapper-margin-right',
19
+ labelColor: '--plasma-slider-label-color',
20
+ labelFontFamily: '--plasma-slider-label-font-family',
21
+ labelFontSize: '--plasma-slider-label-font-size',
22
+ labelFontStyle: '--plasma-slider-label-font-style',
23
+ labelFontWeight: '--plasma-slider-label-font-weight',
24
+ labelLetterSpacing: '--plasma-slider-label-letter-spacing',
25
+ labelLineHeight: '--plasma-slider-label-line-height',
26
+ rangeMinValueMargin: '--plasma-slider-range-min-value-margin',
27
+ rangeMaxValueMargin: '--plasma-slider-range-max-value-margin',
28
+ rangeValueBottomOffset: '--plasma-slider-range-value-bottom-offset',
29
+ rangeValueColor: '--plasma-slider-range-value-color',
30
+ rangeValueFontFamily: '--plasma-slider-range-value-font-family',
31
+ rangeValueFontSize: '--plasma-slider-range-value-font-size',
32
+ rangeValueFontStyle: '--plasma-slider-range-value-font-style',
33
+ rangeValueFontWeight: '--plasma-slider-range-value-font-weight',
34
+ rangeValueLetterSpacing: '--plasma-slider-range-value-letter-spacing',
35
+ rangeValueLineHeight: '--plasma-slider-range-value-line-height',
36
+ doubleWrapperGap: '--plasma-slider-double-wrapper-gap',
37
+ thumbSize: '--plasma-slider-thumb-size',
38
+ thumbBorder: '--plasma-slider-thumb-border',
39
+ thumbBorderColor: '--plasma-slider-thumb-border-color',
40
+ thumbBackgroundColor: '--plasma-slider-thumb-background-color',
41
+ thumbFocusBorderColor: '--plasma-slider-thumb-focus-border-color',
42
+ currentValueTopOffset: '--plasma-slider-current-value-top-offset',
43
+ currentValueFontFamily: '--plasma-slider-current-value-font-family',
44
+ currentValueFontSize: '--plasma-slider-current-value-font-size',
45
+ currentValueFontStyle: '--plasma-slider-current-value-font-style',
46
+ currentValueFontWeight: '--plasma-slider-current-value-font-weight',
47
+ currentValueLetterSpacing: '--plasma-slider-current-value-letter-spacing',
48
+ currentValueLineHeight: '--plasma-slider-current-value-line-height',
49
+ railBackgroundColor: '--plasma-slider-rail-background-color',
50
+ railHeight: '--plasma-slider-rail-height',
51
+ railBorderRadius: '--plasma-slider-rail-border-radius',
52
+ railIndent: '--plasma-slider-rail-indent',
53
+ fillColor: '--plasma-slider-fill-color',
54
+ textFieldWrapperGap: '--plasma-slider-text-field-wrapper-gap',
55
+ textFieldFontFamily: '--plasma-slider-text-field-font-family',
56
+ textFieldFontSize: '--plasma-slider-text-field-font-size',
57
+ textFieldFontStyle: '--plasma-slider-text-field-font-style',
58
+ textFieldFontWeight: '--plasma-slider-text-field-font-weight',
59
+ textFieldLetterSpacing: '--plasma-slider-text-field-letter-spacing',
60
+ textFieldLineHeight: '--plasma-slider-text-field-line-height',
61
+ textFieldHeight: '--plasma-slider-text-field-height',
62
+ textFieldPadding: '--plasma-slider-text-field-padding',
63
+ textFieldBorderRadius: '--plasma-slider-text-field-border-radius',
64
+ textFieldColor: '--plasma-slider-text-field-color',
65
+ textFieldActiveColor: '--plasma-slider-text-field-active-color',
66
+ textFieldBackgroundColor: '--plasma-slider-text-field-background-color',
67
+ textFieldCaretColor: '--plasma-slider-text-field-caret-color',
68
+ textFieldPlaceholderColor: '--plasma-slider-text-field-placeholder-color',
69
+ textFiledFocusColor: '--plasma-slider-text-field-focus-color',
70
+ disabledOpacity: '--plasma-slider-disabled-opacity'
71
+ };
@@ -0,0 +1,310 @@
1
+ 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); }
2
+ var _excluded = ["min", "max", "value", "disabled", "label", "labelContentLeft", "size", "onChangeCommitted", "onChangeTextField", "onBlurTextField", "onKeyDownTextField", "onChange", "ariaLabel", "multipleStepSize"];
3
+ 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); }
4
+ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
5
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
6
+ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
7
+ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
8
+ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
9
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
10
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
11
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
12
+ 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; }
13
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
14
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
15
+ function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
16
+ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
17
+ import React, { useCallback, useEffect, useRef, useState } from 'react';
18
+ import { SliderBase } from '../SliderBase/SliderBase';
19
+ import { Handler } from '../../ui';
20
+ import { sizeData } from '../../utils';
21
+ import { cx, isNumber } from '../../../../utils';
22
+ import { classes } from '../../Slider.tokens';
23
+ import { SliderWrapper, InputsWrapper, Label, LabelContentLeft, LabelWrapper, StyledInput, DoubleWrapper } from './Double.styles';
24
+ function getXCenterHandle(handle) {
25
+ var _handle$parentElement;
26
+ var containerX = ((_handle$parentElement = handle.parentElement) === null || _handle$parentElement === void 0 || (_handle$parentElement = _handle$parentElement.getBoundingClientRect()) === null || _handle$parentElement === void 0 ? void 0 : _handle$parentElement.x) || 0;
27
+ var handleRect = handle.getBoundingClientRect();
28
+ var handlePosition = handleRect.x;
29
+ return handlePosition - containerX;
30
+ }
31
+ export var DoubleSlider = function DoubleSlider(_ref) {
32
+ var min = _ref.min,
33
+ max = _ref.max,
34
+ value = _ref.value,
35
+ disabled = _ref.disabled,
36
+ label = _ref.label,
37
+ labelContentLeft = _ref.labelContentLeft,
38
+ _ref$size = _ref.size,
39
+ size = _ref$size === void 0 ? 'm' : _ref$size,
40
+ onChangeCommitted = _ref.onChangeCommitted,
41
+ onChangeTextField = _ref.onChangeTextField,
42
+ onBlurTextField = _ref.onBlurTextField,
43
+ onKeyDownTextField = _ref.onKeyDownTextField,
44
+ onChange = _ref.onChange,
45
+ ariaLabel = _ref.ariaLabel,
46
+ _ref$multipleStepSize = _ref.multipleStepSize,
47
+ multipleStepSize = _ref$multipleStepSize === void 0 ? 10 : _ref$multipleStepSize,
48
+ rest = _objectWithoutProperties(_ref, _excluded);
49
+ var _useState = useState({
50
+ stepSize: 0,
51
+ railFillWidth: 0,
52
+ railFillXPosition: 0,
53
+ xFirstHandle: 0,
54
+ xSecondHandle: 0,
55
+ firstHandleZIndex: 100,
56
+ secondHandleZIndex: 101,
57
+ firstValue: value[0],
58
+ secondValue: value[1]
59
+ }),
60
+ _useState2 = _slicedToArray(_useState, 2),
61
+ state = _useState2[0],
62
+ setState = _useState2[1];
63
+ var _useState3 = useState(false),
64
+ _useState4 = _slicedToArray(_useState3, 2),
65
+ firstInputActive = _useState4[0],
66
+ setFirstInputActive = _useState4[1];
67
+ var _useState5 = useState(false),
68
+ _useState6 = _slicedToArray(_useState5, 2),
69
+ secondInputActive = _useState6[0],
70
+ setSecondInputActive = _useState6[1];
71
+ var _useState7 = useState(value[0]),
72
+ _useState8 = _slicedToArray(_useState7, 2),
73
+ firstValue = _useState8[0],
74
+ setFirstValue = _useState8[1];
75
+ var _useState9 = useState(value[1]),
76
+ _useState10 = _slicedToArray(_useState9, 2),
77
+ secondValue = _useState10[0],
78
+ setSecondValue = _useState10[1];
79
+ var firstHandleRef = useRef(null);
80
+ var secondHandleRef = useRef(null);
81
+ var firstHandleValue = useRef(value[0]);
82
+ var secondHandleValue = useRef(value[1]);
83
+ var stepSize = state.stepSize;
84
+ var hasLabelContent = label || labelContentLeft;
85
+ var firstInputActiveClass = firstInputActive && !disabled ? classes.textFieldActive : undefined;
86
+ var secondInputActiveClass = secondInputActive && !disabled ? classes.textFieldActive : undefined;
87
+ useEffect(function () {
88
+ var firstLocalValue = Math.min(Math.max(value[0], min), max) - min;
89
+ var secondLocalValue = Math.min(Math.max(value[1], min), max) - min;
90
+ setFirstValue(value[0]);
91
+ setSecondValue(value[1]);
92
+ setState(function (prevState) {
93
+ return _objectSpread(_objectSpread({}, prevState), {}, {
94
+ railFillXPosition: stepSize * firstLocalValue,
95
+ railFillWidth: stepSize * secondLocalValue - stepSize * firstLocalValue,
96
+ xFirstHandle: stepSize * firstLocalValue,
97
+ xSecondHandle: stepSize * secondLocalValue
98
+ });
99
+ });
100
+ }, [value, stepSize, min, max, setFirstValue, setSecondValue]);
101
+ var setStepSize = useCallback(function (newStepSize) {
102
+ setState(function (prevState) {
103
+ return _objectSpread(_objectSpread({}, prevState), {}, {
104
+ stepSize: newStepSize
105
+ });
106
+ });
107
+ }, [setState]);
108
+ var onFirstHandleChange = function onFirstHandleChange(handleValue, data) {
109
+ if (!(secondHandleRef !== null && secondHandleRef !== void 0 && secondHandleRef.current)) {
110
+ return;
111
+ }
112
+ var newHandleXPosition = data.x;
113
+ var secondHandleXPosition = getXCenterHandle(secondHandleRef.current);
114
+ var fillWidth = secondHandleXPosition - newHandleXPosition;
115
+ firstHandleValue.current = handleValue;
116
+ setFirstValue(handleValue);
117
+ setState(function (prevState) {
118
+ return _objectSpread(_objectSpread({}, prevState), {}, {
119
+ firstHandleZIndex: 101,
120
+ secondHandleZIndex: 100,
121
+ railFillWidth: fillWidth < 0 ? 0 : fillWidth,
122
+ railFillXPosition: newHandleXPosition
123
+ });
124
+ });
125
+ if (onChange) {
126
+ onChange([handleValue, value[1]]);
127
+ }
128
+ };
129
+ var onFirstHandleChangeCommitted = function onFirstHandleChangeCommitted(handleValue, data) {
130
+ if (!(secondHandleRef !== null && secondHandleRef !== void 0 && secondHandleRef.current)) {
131
+ return;
132
+ }
133
+ var newHandleXPosition = data.x;
134
+ var secondHandleXPosition = getXCenterHandle(secondHandleRef.current);
135
+ var fillWidth = secondHandleXPosition - newHandleXPosition;
136
+ firstHandleValue.current = handleValue;
137
+ setFirstValue(handleValue);
138
+ if (onChangeCommitted) {
139
+ onChangeCommitted([handleValue, value[1]]);
140
+ }
141
+ setState(function (prevState) {
142
+ return _objectSpread(_objectSpread({}, prevState), {}, {
143
+ firstValue: handleValue,
144
+ xFirstHandle: data.x,
145
+ railFillWidth: fillWidth < 0 ? 0 : fillWidth,
146
+ railFillXPosition: newHandleXPosition
147
+ });
148
+ });
149
+ };
150
+ var onFirstTextfieldChange = function onFirstTextfieldChange(event) {
151
+ if (!isNumber(event.target.value)) {
152
+ return;
153
+ }
154
+ var handleValue = Number(event.target.value);
155
+ setFirstValue(handleValue);
156
+ if (onChangeTextField) {
157
+ onChangeTextField([handleValue, secondValue], event);
158
+ }
159
+ };
160
+ var onFirstTextfieldBlur = function onFirstTextfieldBlur(event) {
161
+ if (!isNumber(event.target.value)) {
162
+ return;
163
+ }
164
+ var handleValue = Number(event.target.value);
165
+ setFirstValue(handleValue);
166
+ if (onBlurTextField) {
167
+ onBlurTextField && onBlurTextField([handleValue, secondValue], event);
168
+ }
169
+ };
170
+ var onSecondHandleChange = function onSecondHandleChange(handleValue, data) {
171
+ if (!(firstHandleRef !== null && firstHandleRef !== void 0 && firstHandleRef.current)) {
172
+ return;
173
+ }
174
+ var firstXHandleXPosition = getXCenterHandle(firstHandleRef.current);
175
+ var newHandleXPosition = data.x;
176
+ var fillWidth = newHandleXPosition - firstXHandleXPosition;
177
+ secondHandleValue.current = handleValue;
178
+ setSecondValue(handleValue);
179
+ setState(function (prevState) {
180
+ return _objectSpread(_objectSpread({}, prevState), {}, {
181
+ firstHandleZIndex: 100,
182
+ secondHandleZIndex: 101,
183
+ railFillWidth: fillWidth < 0 ? 0 : fillWidth,
184
+ railFillXPosition: firstXHandleXPosition
185
+ });
186
+ });
187
+ if (onChange) {
188
+ onChange([value[0], handleValue]);
189
+ }
190
+ };
191
+ var onSecondHandleChangeCommitted = function onSecondHandleChangeCommitted(handleValue, data) {
192
+ if (!(firstHandleRef !== null && firstHandleRef !== void 0 && firstHandleRef.current)) {
193
+ return;
194
+ }
195
+ var firstXHandleXPosition = getXCenterHandle(firstHandleRef.current);
196
+ var newHandleXPosition = data.x;
197
+ var fillWidth = newHandleXPosition - firstXHandleXPosition;
198
+ secondHandleValue.current = handleValue;
199
+ if (onChangeCommitted) {
200
+ onChangeCommitted([value[0], handleValue]);
201
+ }
202
+ setSecondValue(handleValue);
203
+ setState(function (prevState) {
204
+ return _objectSpread(_objectSpread({}, prevState), {}, {
205
+ secondValue: handleValue,
206
+ xSecondHandle: data.x,
207
+ railFillWidth: fillWidth < 0 ? 0 : fillWidth,
208
+ railFillXPosition: firstXHandleXPosition
209
+ });
210
+ });
211
+ };
212
+ var onSecondTextfieldChange = function onSecondTextfieldChange(event) {
213
+ if (!isNumber(event.target.value)) {
214
+ return;
215
+ }
216
+ var handleValue = Number(event.target.value);
217
+ setSecondValue(handleValue);
218
+ if (onChangeTextField) {
219
+ onChangeTextField([firstValue, handleValue], event);
220
+ }
221
+ };
222
+ var onSecondTextfieldBlur = function onSecondTextfieldBlur(event) {
223
+ if (!isNumber(event.target.value)) {
224
+ return;
225
+ }
226
+ var handleValue = Number(event.target.value);
227
+ setSecondValue(handleValue);
228
+ if (onBlurTextField) {
229
+ onBlurTextField([firstValue, handleValue], event);
230
+ }
231
+ };
232
+ var onTextfieldKeyDown = function onTextfieldKeyDown(event) {
233
+ if (onKeyDownTextField) {
234
+ onKeyDownTextField([firstValue, secondValue], event);
235
+ }
236
+ };
237
+ var _ref2 = ariaLabel || [],
238
+ _ref3 = _slicedToArray(_ref2, 2),
239
+ ariaLabelLeft = _ref3[0],
240
+ ariaLabelRight = _ref3[1];
241
+ var currentFirstSliderValue = Math.max(state.firstValue, min);
242
+ return /*#__PURE__*/React.createElement(DoubleWrapper, null, hasLabelContent && /*#__PURE__*/React.createElement(LabelWrapper, null, labelContentLeft && /*#__PURE__*/React.createElement(LabelContentLeft, null, labelContentLeft), label && /*#__PURE__*/React.createElement(Label, null, label)), /*#__PURE__*/React.createElement(SliderWrapper, null, /*#__PURE__*/React.createElement(SliderBase, _extends({
243
+ min: min,
244
+ max: max,
245
+ disabled: disabled,
246
+ setStepSize: setStepSize,
247
+ railFillWidth: state.railFillWidth,
248
+ settings: sizeData[size],
249
+ railFillXPosition: state.railFillXPosition
250
+ }, rest), /*#__PURE__*/React.createElement(Handler, {
251
+ ref: firstHandleRef,
252
+ stepSize: state.stepSize,
253
+ multipleStepSize: multipleStepSize,
254
+ onChangeCommitted: onFirstHandleChangeCommitted,
255
+ onChange: onFirstHandleChange,
256
+ min: min,
257
+ max: state.secondValue,
258
+ disabled: disabled,
259
+ bounds: [min, state.secondValue],
260
+ side: "left",
261
+ xPosition: state.xFirstHandle,
262
+ zIndex: state.firstHandleZIndex,
263
+ value: currentFirstSliderValue,
264
+ ariaLabel: ariaLabelLeft,
265
+ onMouseEnter: function onMouseEnter() {
266
+ return setFirstInputActive(true);
267
+ },
268
+ onMouseLeave: function onMouseLeave() {
269
+ return setFirstInputActive(false);
270
+ }
271
+ }), /*#__PURE__*/React.createElement(Handler, {
272
+ ref: secondHandleRef,
273
+ stepSize: state.stepSize,
274
+ multipleStepSize: multipleStepSize,
275
+ onChangeCommitted: onSecondHandleChangeCommitted,
276
+ onChange: onSecondHandleChange,
277
+ min: min,
278
+ ariaValueMin: currentFirstSliderValue,
279
+ max: max,
280
+ disabled: disabled,
281
+ bounds: [state.firstValue, max],
282
+ side: "right",
283
+ xPosition: state.xSecondHandle,
284
+ zIndex: state.secondHandleZIndex,
285
+ value: Math.max(state.secondValue, min),
286
+ ariaLabel: ariaLabelRight,
287
+ onMouseEnter: function onMouseEnter() {
288
+ return setSecondInputActive(true);
289
+ },
290
+ onMouseLeave: function onMouseLeave() {
291
+ return setSecondInputActive(false);
292
+ }
293
+ })), /*#__PURE__*/React.createElement(InputsWrapper, null, /*#__PURE__*/React.createElement(StyledInput, {
294
+ className: cx(classes.firstTextField, firstInputActiveClass),
295
+ enumerationType: "plain",
296
+ disabled: disabled,
297
+ value: firstValue,
298
+ onChange: onFirstTextfieldChange,
299
+ onBlur: onFirstTextfieldBlur,
300
+ onKeyDown: onTextfieldKeyDown
301
+ }), /*#__PURE__*/React.createElement(StyledInput, {
302
+ className: cx(classes.secondTextField, secondInputActiveClass),
303
+ enumerationType: "plain",
304
+ disabled: disabled,
305
+ value: secondValue,
306
+ onChange: onSecondTextfieldChange,
307
+ onBlur: onSecondTextfieldBlur,
308
+ onKeyDown: onTextfieldKeyDown
309
+ }))));
310
+ };
@@ -0,0 +1,29 @@
1
+ import styled from 'styled-components';
2
+ import { classes, tokens } from '../../Slider.tokens';
3
+ import { component, mergeConfig } from '../../../../engines';
4
+ import { textFieldConfig, textFieldTokens } from '../../../TextField';
5
+ var mergedConfig = /*#__PURE__*/mergeConfig(textFieldConfig);
6
+ var TextField = /*#__PURE__*/component(mergedConfig);
7
+ export var LabelWrapper = /*#__PURE__*/styled.div.withConfig({
8
+ componentId: "plasma-new-hope__sc-97pdfk-0"
9
+ })(["color:var(", ");display:flex;gap:var(", ");margin-bottom:var(", ");"], tokens.labelColor, tokens.labelWrapperGap, tokens.labelWrapperMarginBottom);
10
+ export var LabelContentLeft = /*#__PURE__*/styled.div.withConfig({
11
+ componentId: "plasma-new-hope__sc-97pdfk-1"
12
+ })([""]);
13
+ export var Label = /*#__PURE__*/styled.label.withConfig({
14
+ componentId: "plasma-new-hope__sc-97pdfk-2"
15
+ })(["font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");"], tokens.labelFontFamily, tokens.labelFontSize, tokens.labelFontStyle, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight);
16
+ export var InputsWrapper = /*#__PURE__*/styled.div.withConfig({
17
+ componentId: "plasma-new-hope__sc-97pdfk-3"
18
+ })(["display:flex;gap:var(", ");margin-top:var(", ");"], tokens.textFieldWrapperGap, tokens.doubleWrapperGap);
19
+
20
+ // NOTE: переопределение токенов TextField
21
+ export var StyledInput = /*#__PURE__*/styled(TextField).withConfig({
22
+ componentId: "plasma-new-hope__sc-97pdfk-4"
23
+ })(["flex:1;", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");&.", " > div{border-top-right-radius:0;border-bottom-right-radius:0;}&.", " > div{border-top-left-radius:0;border-bottom-left-radius:0;}input:focus,&.", "{", ":var(", ");}"], textFieldTokens.color, tokens.textFieldColor, textFieldTokens.backgroundColor, tokens.textFieldBackgroundColor, textFieldTokens.caretColor, tokens.textFieldCaretColor, textFieldTokens.placeholderColor, tokens.textFieldPlaceholderColor, textFieldTokens.disabledOpacity, tokens.disabledOpacity, textFieldTokens.height, tokens.textFieldHeight, textFieldTokens.padding, tokens.textFieldPadding, textFieldTokens.borderRadius, tokens.textFieldBorderRadius, textFieldTokens.fontFamily, tokens.textFieldFontFamily, textFieldTokens.fontSize, tokens.textFieldFontSize, textFieldTokens.fontStyle, tokens.textFieldFontStyle, textFieldTokens.fontWeight, tokens.textFieldFontWeight, textFieldTokens.letterSpacing, tokens.textFieldLetterSpacing, textFieldTokens.lineHeight, tokens.textFieldLineHeight, classes.firstTextField, classes.secondTextField, classes.textFieldActive, textFieldTokens.color, tokens.textFiledFocusColor);
24
+ export var DoubleWrapper = /*#__PURE__*/styled.div.withConfig({
25
+ componentId: "plasma-new-hope__sc-97pdfk-5"
26
+ })(["opacity:var(", ");"], tokens.disabledOpacity);
27
+ export var SliderWrapper = /*#__PURE__*/styled.div.withConfig({
28
+ componentId: "plasma-new-hope__sc-97pdfk-6"
29
+ })([""]);