@salutejs/plasma-new-hope 0.176.0-canary.1514.11570064677.0 → 0.176.1-canary.1510.11572230988.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (397) hide show
  1. package/cjs/components/Counter/Counter.css +1 -1
  2. package/cjs/components/Counter/Counter.js +3 -12
  3. package/cjs/components/Counter/Counter.js.map +1 -1
  4. package/cjs/components/Counter/Counter.tokens.js +0 -4
  5. package/cjs/components/Counter/Counter.tokens.js.map +1 -1
  6. package/cjs/components/Counter/variations/_size/base.js +1 -1
  7. package/cjs/components/Counter/variations/_size/base.js.map +1 -1
  8. package/cjs/components/Counter/variations/_size/{base_4mz17d.css → base_1z0ohiy.css} +1 -1
  9. package/cjs/components/Notification/Notification.css +11 -11
  10. package/cjs/components/Notification/Notification.js +2 -2
  11. package/cjs/components/Notification/Notification.js.map +1 -1
  12. package/cjs/components/Notification/Notification.styles.js +11 -2
  13. package/cjs/components/Notification/Notification.styles.js.map +1 -1
  14. package/{es/components/Notification/Notification.styles_7h8hp0.css → cjs/components/Notification/Notification.styles_e6274r.css} +2 -2
  15. package/cjs/components/Notification/Notification.tokens.js +2 -1
  16. package/cjs/components/Notification/Notification.tokens.js.map +1 -1
  17. package/cjs/components/Notification/Notification.types.js.map +1 -1
  18. package/cjs/components/Notification/NotificationsPortal.js +8 -4
  19. package/cjs/components/Notification/NotificationsPortal.js.map +1 -1
  20. package/cjs/components/Notification/NotificationsProvider.css +11 -11
  21. package/cjs/components/Notification/NotificationsProvider.js +3 -1
  22. package/cjs/components/Notification/NotificationsProvider.js.map +1 -1
  23. package/cjs/components/Pagination/Pagination.css +12 -12
  24. package/cjs/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.css +12 -12
  25. package/cjs/components/Select/Select.css +12 -12
  26. package/cjs/components/Select/Select.tokens.js +2 -1
  27. package/cjs/components/Select/Select.tokens.js.map +1 -1
  28. package/cjs/components/Select/ui/Inner/Inner.css +12 -12
  29. package/cjs/components/Select/ui/Inner/ui/Item/Item.css +12 -12
  30. package/cjs/components/Select/ui/Target/Target.css +12 -12
  31. package/cjs/components/Select/ui/Target/ui/Textfield/Textfield.css +12 -12
  32. package/cjs/components/Select/ui/Target/ui/Textfield/Textfield.styles.js +1 -1
  33. package/cjs/components/Select/ui/Target/ui/Textfield/Textfield.styles.js.map +1 -1
  34. package/{es/components/Select/ui/Target/ui/Textfield/Textfield.styles_11yj58s.css → cjs/components/Select/ui/Target/ui/Textfield/Textfield.styles_jzeap2.css} +1 -1
  35. package/cjs/components/Slider/Slider.css +15 -13
  36. package/cjs/components/Slider/Slider.js +11 -2
  37. package/cjs/components/Slider/Slider.js.map +1 -1
  38. package/cjs/components/Slider/Slider.tokens.js +23 -17
  39. package/cjs/components/Slider/Slider.tokens.js.map +1 -1
  40. package/cjs/components/Slider/components/Double/Double.css +8 -8
  41. package/cjs/components/Slider/components/Double/Double.js +58 -23
  42. package/cjs/components/Slider/components/Double/Double.js.map +1 -1
  43. package/cjs/components/Slider/components/DoubleUncontrolled/DoubleUncontrolled.css +98 -0
  44. package/cjs/components/Slider/components/Single/Single.css +14 -14
  45. package/cjs/components/Slider/components/Single/Single.js +64 -33
  46. package/cjs/components/Slider/components/Single/Single.js.map +1 -1
  47. package/cjs/components/Slider/components/Single/Single.styles.js +4 -4
  48. package/cjs/components/Slider/components/Single/Single.styles.js.map +1 -1
  49. package/cjs/components/Slider/components/Single/Single.styles_1h7n2s2.css +6 -0
  50. package/cjs/components/Slider/components/SliderBase/SliderBase.css +5 -5
  51. package/cjs/components/Slider/components/SliderBase/SliderBase.js +31 -12
  52. package/cjs/components/Slider/components/SliderBase/SliderBase.js.map +1 -1
  53. package/cjs/components/Slider/components/SliderBase/SliderBase.styles.js +7 -7
  54. package/cjs/components/Slider/components/SliderBase/SliderBase.styles.js.map +1 -1
  55. package/cjs/components/Slider/components/SliderBase/SliderBase.styles_1qt1224.css +5 -0
  56. package/cjs/components/Slider/ui/Handler/Handler.css +3 -3
  57. package/cjs/components/Slider/ui/Handler/Handler.js +49 -88
  58. package/cjs/components/Slider/ui/Handler/Handler.js.map +1 -1
  59. package/cjs/components/Slider/ui/Handler/Handler.styles.js +17 -7
  60. package/cjs/components/Slider/ui/Handler/Handler.styles.js.map +1 -1
  61. package/cjs/components/Slider/ui/Handler/Handler.styles_irtcgm.css +2 -0
  62. package/cjs/components/Slider/ui/Handler/computeKeyPressData.js +122 -0
  63. package/cjs/components/Slider/ui/Handler/computeKeyPressData.js.map +1 -0
  64. package/cjs/components/Slider/ui/Thumb/Thumb.css +1 -1
  65. package/cjs/components/Slider/ui/Thumb/Thumb.js +3 -2
  66. package/cjs/components/Slider/ui/Thumb/Thumb.js.map +1 -1
  67. package/cjs/components/Slider/ui/Thumb/Thumb.styles.js +1 -1
  68. package/cjs/components/Slider/ui/Thumb/Thumb.styles.js.map +1 -1
  69. package/cjs/components/Slider/ui/Thumb/Thumb.styles_uyn20e.css +1 -0
  70. package/cjs/components/Slider/utils/index.js +28 -10
  71. package/cjs/components/Slider/utils/index.js.map +1 -1
  72. package/cjs/components/Slider/variations/_view/base.js +1 -1
  73. package/cjs/components/Slider/variations/_view/base.js.map +1 -1
  74. package/cjs/components/Slider/variations/_view/base_1s3f6q8.css +1 -0
  75. package/cjs/index.css +38 -36
  76. package/cjs/index.js +1 -1
  77. package/cjs/utils/index.js.map +1 -1
  78. package/emotion/cjs/components/Counter/Counter.js +3 -12
  79. package/emotion/cjs/components/Counter/Counter.template-doc.mdx +2 -2
  80. package/emotion/cjs/components/Counter/Counter.tokens.js +1 -4
  81. package/emotion/cjs/components/Counter/variations/_size/base.js +1 -1
  82. package/emotion/cjs/components/Notification/Notification.js +2 -2
  83. package/emotion/cjs/components/Notification/Notification.styles.js +14 -19
  84. package/emotion/cjs/components/Notification/Notification.template-doc.mdx +17 -8
  85. package/emotion/cjs/components/Notification/Notification.tokens.js +2 -1
  86. package/emotion/cjs/components/Notification/NotificationsPortal.js +9 -5
  87. package/emotion/cjs/components/Notification/NotificationsProvider.js +3 -1
  88. package/emotion/cjs/components/Notification/index.js +4 -4
  89. package/emotion/cjs/components/Select/Select.tokens.js +2 -1
  90. package/emotion/cjs/components/Select/ui/Target/ui/Textfield/Textfield.styles.js +12 -21
  91. package/emotion/cjs/components/Slider/Slider.js +10 -2
  92. package/emotion/cjs/components/Slider/Slider.template-doc.mdx +26 -0
  93. package/emotion/cjs/components/Slider/Slider.tokens.js +23 -17
  94. package/emotion/cjs/components/Slider/components/Double/Double.js +54 -19
  95. package/emotion/cjs/components/Slider/components/Single/Single.js +64 -33
  96. package/emotion/cjs/components/Slider/components/Single/Single.styles.js +18 -9
  97. package/emotion/cjs/components/Slider/components/SliderBase/SliderBase.js +31 -12
  98. package/emotion/cjs/components/Slider/components/SliderBase/SliderBase.styles.js +10 -10
  99. package/emotion/cjs/components/Slider/ui/Handler/Handler.js +52 -88
  100. package/emotion/cjs/components/Slider/ui/Handler/Handler.styles.js +9 -15
  101. package/emotion/cjs/components/Slider/ui/Handler/computeKeyPressData.js +121 -0
  102. package/emotion/cjs/components/Slider/ui/Thumb/Thumb.js +3 -2
  103. package/emotion/cjs/components/Slider/ui/Thumb/Thumb.styles.js +3 -3
  104. package/emotion/cjs/components/Slider/utils/index.js +28 -10
  105. package/emotion/cjs/components/Slider/variations/_view/base.js +2 -1
  106. package/emotion/cjs/examples/plasma_b2c/components/Counter/Counter.config.js +9 -12
  107. package/emotion/cjs/examples/plasma_b2c/components/Counter/Counter.stories.tsx +5 -7
  108. package/emotion/cjs/examples/plasma_b2c/components/Notification/Notification.js +5 -3
  109. package/emotion/cjs/examples/plasma_b2c/components/Notification/Notification.stories.tsx +25 -4
  110. package/emotion/cjs/examples/plasma_b2c/components/Slider/Slider.config.js +7 -7
  111. package/emotion/cjs/examples/plasma_b2c/components/Slider/Slider.stories.tsx +98 -16
  112. package/emotion/cjs/examples/plasma_web/components/Counter/Counter.config.js +9 -12
  113. package/emotion/cjs/examples/plasma_web/components/Counter/Counter.stories.tsx +5 -7
  114. package/emotion/cjs/examples/plasma_web/components/Notification/Notification.js +5 -3
  115. package/emotion/cjs/examples/plasma_web/components/Notification/Notification.stories.tsx +25 -4
  116. package/emotion/cjs/examples/plasma_web/components/Slider/Slider.config.js +7 -7
  117. package/emotion/cjs/examples/plasma_web/components/Slider/Slider.stories.tsx +98 -15
  118. package/emotion/es/components/Counter/Counter.js +3 -12
  119. package/emotion/es/components/Counter/Counter.template-doc.mdx +2 -2
  120. package/emotion/es/components/Counter/Counter.tokens.js +0 -3
  121. package/emotion/es/components/Counter/variations/_size/base.js +2 -2
  122. package/emotion/es/components/Notification/Notification.js +1 -1
  123. package/emotion/es/components/Notification/Notification.styles.js +14 -19
  124. package/emotion/es/components/Notification/Notification.template-doc.mdx +17 -8
  125. package/emotion/es/components/Notification/Notification.tokens.js +2 -1
  126. package/emotion/es/components/Notification/NotificationsPortal.js +9 -5
  127. package/emotion/es/components/Notification/NotificationsProvider.js +3 -1
  128. package/emotion/es/components/Notification/index.js +1 -1
  129. package/emotion/es/components/Select/Select.tokens.js +2 -1
  130. package/emotion/es/components/Select/ui/Target/ui/Textfield/Textfield.styles.js +12 -21
  131. package/emotion/es/components/Slider/Slider.js +11 -2
  132. package/emotion/es/components/Slider/Slider.template-doc.mdx +26 -0
  133. package/emotion/es/components/Slider/Slider.tokens.js +23 -17
  134. package/emotion/es/components/Slider/components/Double/Double.js +54 -19
  135. package/emotion/es/components/Slider/components/Single/Single.js +65 -34
  136. package/emotion/es/components/Slider/components/Single/Single.styles.js +17 -8
  137. package/emotion/es/components/Slider/components/SliderBase/SliderBase.js +31 -12
  138. package/emotion/es/components/Slider/components/SliderBase/SliderBase.styles.js +11 -11
  139. package/emotion/es/components/Slider/ui/Handler/Handler.js +51 -86
  140. package/emotion/es/components/Slider/ui/Handler/Handler.styles.js +10 -16
  141. package/emotion/es/components/Slider/ui/Handler/computeKeyPressData.js +115 -0
  142. package/emotion/es/components/Slider/ui/Thumb/Thumb.js +3 -2
  143. package/emotion/es/components/Slider/ui/Thumb/Thumb.styles.js +3 -3
  144. package/emotion/es/components/Slider/utils/index.js +28 -10
  145. package/emotion/es/components/Slider/variations/_view/base.js +2 -1
  146. package/emotion/es/examples/plasma_b2c/components/Counter/Counter.config.js +9 -12
  147. package/emotion/es/examples/plasma_b2c/components/Counter/Counter.stories.tsx +5 -7
  148. package/emotion/es/examples/plasma_b2c/components/Notification/Notification.js +6 -4
  149. package/emotion/es/examples/plasma_b2c/components/Notification/Notification.stories.tsx +25 -4
  150. package/emotion/es/examples/plasma_b2c/components/Slider/Slider.config.js +7 -7
  151. package/emotion/es/examples/plasma_b2c/components/Slider/Slider.stories.tsx +98 -16
  152. package/emotion/es/examples/plasma_web/components/Counter/Counter.config.js +9 -12
  153. package/emotion/es/examples/plasma_web/components/Counter/Counter.stories.tsx +5 -7
  154. package/emotion/es/examples/plasma_web/components/Notification/Notification.js +6 -4
  155. package/emotion/es/examples/plasma_web/components/Notification/Notification.stories.tsx +25 -4
  156. package/emotion/es/examples/plasma_web/components/Slider/Slider.config.js +7 -7
  157. package/emotion/es/examples/plasma_web/components/Slider/Slider.stories.tsx +98 -15
  158. package/es/components/Counter/Counter.css +1 -1
  159. package/es/components/Counter/Counter.js +3 -12
  160. package/es/components/Counter/Counter.js.map +1 -1
  161. package/es/components/Counter/Counter.tokens.js +1 -4
  162. package/es/components/Counter/Counter.tokens.js.map +1 -1
  163. package/es/components/Counter/variations/_size/base.js +1 -1
  164. package/es/components/Counter/variations/_size/base.js.map +1 -1
  165. package/es/components/Counter/variations/_size/{base_4mz17d.css → base_1z0ohiy.css} +1 -1
  166. package/es/components/Notification/Notification.css +11 -11
  167. package/es/components/Notification/Notification.js +2 -2
  168. package/es/components/Notification/Notification.js.map +1 -1
  169. package/es/components/Notification/Notification.styles.js +11 -2
  170. package/es/components/Notification/Notification.styles.js.map +1 -1
  171. package/{cjs/components/Notification/Notification.styles_7h8hp0.css → es/components/Notification/Notification.styles_e6274r.css} +2 -2
  172. package/es/components/Notification/Notification.tokens.js +2 -1
  173. package/es/components/Notification/Notification.tokens.js.map +1 -1
  174. package/es/components/Notification/Notification.types.js.map +1 -1
  175. package/es/components/Notification/NotificationsPortal.js +8 -4
  176. package/es/components/Notification/NotificationsPortal.js.map +1 -1
  177. package/es/components/Notification/NotificationsProvider.css +11 -11
  178. package/es/components/Notification/NotificationsProvider.js +3 -1
  179. package/es/components/Notification/NotificationsProvider.js.map +1 -1
  180. package/es/components/Pagination/Pagination.css +12 -12
  181. package/es/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.css +12 -12
  182. package/es/components/Select/Select.css +12 -12
  183. package/es/components/Select/Select.tokens.js +2 -1
  184. package/es/components/Select/Select.tokens.js.map +1 -1
  185. package/es/components/Select/ui/Inner/Inner.css +12 -12
  186. package/es/components/Select/ui/Inner/ui/Item/Item.css +12 -12
  187. package/es/components/Select/ui/Target/Target.css +12 -12
  188. package/es/components/Select/ui/Target/ui/Textfield/Textfield.css +12 -12
  189. package/es/components/Select/ui/Target/ui/Textfield/Textfield.styles.js +1 -1
  190. package/es/components/Select/ui/Target/ui/Textfield/Textfield.styles.js.map +1 -1
  191. package/{cjs/components/Select/ui/Target/ui/Textfield/Textfield.styles_11yj58s.css → es/components/Select/ui/Target/ui/Textfield/Textfield.styles_jzeap2.css} +1 -1
  192. package/es/components/Slider/Slider.css +15 -13
  193. package/es/components/Slider/Slider.js +11 -2
  194. package/es/components/Slider/Slider.js.map +1 -1
  195. package/es/components/Slider/Slider.tokens.js +23 -17
  196. package/es/components/Slider/Slider.tokens.js.map +1 -1
  197. package/es/components/Slider/components/Double/Double.css +8 -8
  198. package/es/components/Slider/components/Double/Double.js +54 -19
  199. package/es/components/Slider/components/Double/Double.js.map +1 -1
  200. package/es/components/Slider/components/DoubleUncontrolled/DoubleUncontrolled.css +98 -0
  201. package/es/components/Slider/components/Single/Single.css +14 -14
  202. package/es/components/Slider/components/Single/Single.js +65 -34
  203. package/es/components/Slider/components/Single/Single.js.map +1 -1
  204. package/es/components/Slider/components/Single/Single.styles.js +4 -4
  205. package/es/components/Slider/components/Single/Single.styles.js.map +1 -1
  206. package/es/components/Slider/components/Single/Single.styles_1h7n2s2.css +6 -0
  207. package/es/components/Slider/components/SliderBase/SliderBase.css +5 -5
  208. package/es/components/Slider/components/SliderBase/SliderBase.js +31 -12
  209. package/es/components/Slider/components/SliderBase/SliderBase.js.map +1 -1
  210. package/es/components/Slider/components/SliderBase/SliderBase.styles.js +7 -7
  211. package/es/components/Slider/components/SliderBase/SliderBase.styles.js.map +1 -1
  212. package/es/components/Slider/components/SliderBase/SliderBase.styles_1qt1224.css +5 -0
  213. package/es/components/Slider/ui/Handler/Handler.css +3 -3
  214. package/es/components/Slider/ui/Handler/Handler.js +48 -87
  215. package/es/components/Slider/ui/Handler/Handler.js.map +1 -1
  216. package/es/components/Slider/ui/Handler/Handler.styles.js +17 -7
  217. package/es/components/Slider/ui/Handler/Handler.styles.js.map +1 -1
  218. package/es/components/Slider/ui/Handler/Handler.styles_irtcgm.css +2 -0
  219. package/es/components/Slider/ui/Handler/computeKeyPressData.js +118 -0
  220. package/es/components/Slider/ui/Handler/computeKeyPressData.js.map +1 -0
  221. package/es/components/Slider/ui/Thumb/Thumb.css +1 -1
  222. package/es/components/Slider/ui/Thumb/Thumb.js +3 -2
  223. package/es/components/Slider/ui/Thumb/Thumb.js.map +1 -1
  224. package/es/components/Slider/ui/Thumb/Thumb.styles.js +1 -1
  225. package/es/components/Slider/ui/Thumb/Thumb.styles.js.map +1 -1
  226. package/es/components/Slider/ui/Thumb/Thumb.styles_uyn20e.css +1 -0
  227. package/es/components/Slider/utils/index.js +28 -10
  228. package/es/components/Slider/utils/index.js.map +1 -1
  229. package/es/components/Slider/variations/_view/base.js +1 -1
  230. package/es/components/Slider/variations/_view/base.js.map +1 -1
  231. package/es/components/Slider/variations/_view/base_1s3f6q8.css +1 -0
  232. package/es/index.css +38 -36
  233. package/es/index.js +1 -1
  234. package/es/utils/index.js.map +1 -1
  235. package/package.json +2 -2
  236. package/styled-components/cjs/components/Counter/Counter.js +3 -12
  237. package/styled-components/cjs/components/Counter/Counter.template-doc.mdx +2 -2
  238. package/styled-components/cjs/components/Counter/Counter.tokens.js +1 -4
  239. package/styled-components/cjs/components/Counter/variations/_size/base.js +1 -1
  240. package/styled-components/cjs/components/Notification/Notification.js +2 -2
  241. package/styled-components/cjs/components/Notification/Notification.styles.js +5 -2
  242. package/styled-components/cjs/components/Notification/Notification.template-doc.mdx +17 -8
  243. package/styled-components/cjs/components/Notification/Notification.tokens.js +2 -1
  244. package/styled-components/cjs/components/Notification/NotificationsPortal.js +8 -4
  245. package/styled-components/cjs/components/Notification/NotificationsProvider.js +3 -1
  246. package/styled-components/cjs/components/Notification/index.js +4 -4
  247. package/styled-components/cjs/components/Select/Select.tokens.js +2 -1
  248. package/styled-components/cjs/components/Select/ui/Target/ui/Textfield/Textfield.styles.js +1 -1
  249. package/styled-components/cjs/components/Slider/Slider.js +10 -2
  250. package/styled-components/cjs/components/Slider/Slider.template-doc.mdx +26 -0
  251. package/styled-components/cjs/components/Slider/Slider.tokens.js +23 -17
  252. package/styled-components/cjs/components/Slider/components/Double/Double.js +54 -19
  253. package/styled-components/cjs/components/Slider/components/Single/Single.js +64 -33
  254. package/styled-components/cjs/components/Slider/components/Single/Single.styles.js +6 -6
  255. package/styled-components/cjs/components/Slider/components/SliderBase/SliderBase.js +31 -12
  256. package/styled-components/cjs/components/Slider/components/SliderBase/SliderBase.styles.js +6 -6
  257. package/styled-components/cjs/components/Slider/ui/Handler/Handler.js +52 -88
  258. package/styled-components/cjs/components/Slider/ui/Handler/Handler.styles.js +7 -4
  259. package/styled-components/cjs/components/Slider/ui/Handler/computeKeyPressData.js +121 -0
  260. package/styled-components/cjs/components/Slider/ui/Thumb/Thumb.js +3 -2
  261. package/styled-components/cjs/components/Slider/ui/Thumb/Thumb.styles.js +2 -2
  262. package/styled-components/cjs/components/Slider/utils/index.js +28 -10
  263. package/styled-components/cjs/components/Slider/variations/_view/base.js +2 -1
  264. package/styled-components/cjs/examples/plasma_b2c/components/Counter/Counter.config.js +2 -5
  265. package/styled-components/cjs/examples/plasma_b2c/components/Counter/Counter.stories.tsx +5 -7
  266. package/styled-components/cjs/examples/plasma_b2c/components/Notification/Notification.js +5 -3
  267. package/styled-components/cjs/examples/plasma_b2c/components/Notification/Notification.stories.tsx +25 -4
  268. package/styled-components/cjs/examples/plasma_b2c/components/Slider/Slider.config.js +3 -3
  269. package/styled-components/cjs/examples/plasma_b2c/components/Slider/Slider.stories.tsx +98 -16
  270. package/styled-components/cjs/examples/plasma_web/components/Counter/Counter.config.js +2 -5
  271. package/styled-components/cjs/examples/plasma_web/components/Counter/Counter.stories.tsx +5 -7
  272. package/styled-components/cjs/examples/plasma_web/components/Notification/Notification.js +5 -3
  273. package/styled-components/cjs/examples/plasma_web/components/Notification/Notification.stories.tsx +25 -4
  274. package/styled-components/cjs/examples/plasma_web/components/Slider/Slider.config.js +3 -3
  275. package/styled-components/cjs/examples/plasma_web/components/Slider/Slider.stories.tsx +98 -15
  276. package/styled-components/es/components/Counter/Counter.js +3 -12
  277. package/styled-components/es/components/Counter/Counter.template-doc.mdx +2 -2
  278. package/styled-components/es/components/Counter/Counter.tokens.js +0 -3
  279. package/styled-components/es/components/Counter/variations/_size/base.js +2 -2
  280. package/styled-components/es/components/Notification/Notification.js +1 -1
  281. package/styled-components/es/components/Notification/Notification.styles.js +5 -2
  282. package/styled-components/es/components/Notification/Notification.template-doc.mdx +17 -8
  283. package/styled-components/es/components/Notification/Notification.tokens.js +2 -1
  284. package/styled-components/es/components/Notification/NotificationsPortal.js +8 -4
  285. package/styled-components/es/components/Notification/NotificationsProvider.js +3 -1
  286. package/styled-components/es/components/Notification/index.js +1 -1
  287. package/styled-components/es/components/Select/Select.tokens.js +2 -1
  288. package/styled-components/es/components/Select/ui/Target/ui/Textfield/Textfield.styles.js +1 -1
  289. package/styled-components/es/components/Slider/Slider.js +11 -2
  290. package/styled-components/es/components/Slider/Slider.template-doc.mdx +26 -0
  291. package/styled-components/es/components/Slider/Slider.tokens.js +23 -17
  292. package/styled-components/es/components/Slider/components/Double/Double.js +54 -19
  293. package/styled-components/es/components/Slider/components/Single/Single.js +65 -34
  294. package/styled-components/es/components/Slider/components/Single/Single.styles.js +5 -5
  295. package/styled-components/es/components/Slider/components/SliderBase/SliderBase.js +31 -12
  296. package/styled-components/es/components/Slider/components/SliderBase/SliderBase.styles.js +7 -7
  297. package/styled-components/es/components/Slider/ui/Handler/Handler.js +51 -86
  298. package/styled-components/es/components/Slider/ui/Handler/Handler.styles.js +8 -5
  299. package/styled-components/es/components/Slider/ui/Handler/computeKeyPressData.js +115 -0
  300. package/styled-components/es/components/Slider/ui/Thumb/Thumb.js +3 -2
  301. package/styled-components/es/components/Slider/ui/Thumb/Thumb.styles.js +2 -2
  302. package/styled-components/es/components/Slider/utils/index.js +28 -10
  303. package/styled-components/es/components/Slider/variations/_view/base.js +2 -1
  304. package/styled-components/es/examples/plasma_b2c/components/Counter/Counter.config.js +2 -5
  305. package/styled-components/es/examples/plasma_b2c/components/Counter/Counter.stories.tsx +5 -7
  306. package/styled-components/es/examples/plasma_b2c/components/Notification/Notification.js +6 -4
  307. package/styled-components/es/examples/plasma_b2c/components/Notification/Notification.stories.tsx +25 -4
  308. package/styled-components/es/examples/plasma_b2c/components/Slider/Slider.config.js +3 -3
  309. package/styled-components/es/examples/plasma_b2c/components/Slider/Slider.stories.tsx +98 -16
  310. package/styled-components/es/examples/plasma_web/components/Counter/Counter.config.js +2 -5
  311. package/styled-components/es/examples/plasma_web/components/Counter/Counter.stories.tsx +5 -7
  312. package/styled-components/es/examples/plasma_web/components/Notification/Notification.js +6 -4
  313. package/styled-components/es/examples/plasma_web/components/Notification/Notification.stories.tsx +25 -4
  314. package/styled-components/es/examples/plasma_web/components/Slider/Slider.config.js +3 -3
  315. package/styled-components/es/examples/plasma_web/components/Slider/Slider.stories.tsx +98 -15
  316. package/types/components/Counter/Counter.d.ts.map +1 -1
  317. package/types/components/Counter/Counter.tokens.d.ts +0 -3
  318. package/types/components/Counter/Counter.tokens.d.ts.map +1 -1
  319. package/types/components/Counter/Counter.types.d.ts +2 -2
  320. package/types/components/Counter/variations/_size/base.d.ts.map +1 -1
  321. package/types/components/Notification/Notification.d.ts +3 -3
  322. package/types/components/Notification/Notification.d.ts.map +1 -1
  323. package/types/components/Notification/Notification.styles.d.ts +4 -2
  324. package/types/components/Notification/Notification.styles.d.ts.map +1 -1
  325. package/types/components/Notification/Notification.tokens.d.ts +1 -0
  326. package/types/components/Notification/Notification.tokens.d.ts.map +1 -1
  327. package/types/components/Notification/Notification.types.d.ts +11 -5
  328. package/types/components/Notification/Notification.types.d.ts.map +1 -1
  329. package/types/components/Notification/NotificationsPortal.d.ts.map +1 -1
  330. package/types/components/Notification/NotificationsProvider.d.ts +4 -3
  331. package/types/components/Notification/NotificationsProvider.d.ts.map +1 -1
  332. package/types/components/Notification/index.d.ts +2 -2
  333. package/types/components/Notification/index.d.ts.map +1 -1
  334. package/types/components/Select/Select.tokens.d.ts +1 -0
  335. package/types/components/Select/Select.tokens.d.ts.map +1 -1
  336. package/types/components/Select/ui/Target/ui/Textfield/Textfield.styles.d.ts.map +1 -1
  337. package/types/components/Slider/Slider.d.ts.map +1 -1
  338. package/types/components/Slider/Slider.tokens.d.ts +22 -16
  339. package/types/components/Slider/Slider.tokens.d.ts.map +1 -1
  340. package/types/components/Slider/components/Double/Double.d.ts.map +1 -1
  341. package/types/components/Slider/components/Double/Double.types.d.ts +1 -0
  342. package/types/components/Slider/components/Double/Double.types.d.ts.map +1 -1
  343. package/types/components/Slider/components/Single/Single.d.ts.map +1 -1
  344. package/types/components/Slider/components/Single/Single.styles.d.ts +1 -1
  345. package/types/components/Slider/components/Single/Single.styles.d.ts.map +1 -1
  346. package/types/components/Slider/components/Single/Single.types.d.ts +79 -7
  347. package/types/components/Slider/components/Single/Single.types.d.ts.map +1 -1
  348. package/types/components/Slider/components/SliderBase/SliderBase.d.ts.map +1 -1
  349. package/types/components/Slider/components/SliderBase/SliderBase.styles.d.ts +1 -1
  350. package/types/components/Slider/components/SliderBase/SliderBase.styles.d.ts.map +1 -1
  351. package/types/components/Slider/components/SliderBase/SliderBase.types.d.ts +6 -0
  352. package/types/components/Slider/components/SliderBase/SliderBase.types.d.ts.map +1 -1
  353. package/types/components/Slider/ui/Handler/Handler.d.ts.map +1 -1
  354. package/types/components/Slider/ui/Handler/Handler.styles.d.ts +6 -2
  355. package/types/components/Slider/ui/Handler/Handler.styles.d.ts.map +1 -1
  356. package/types/components/Slider/ui/Handler/Handler.types.d.ts +5 -1
  357. package/types/components/Slider/ui/Handler/Handler.types.d.ts.map +1 -1
  358. package/types/components/Slider/ui/Handler/computeKeyPressData.d.ts +12 -0
  359. package/types/components/Slider/ui/Handler/computeKeyPressData.d.ts.map +1 -0
  360. package/types/components/Slider/ui/Thumb/Thumb.d.ts +1 -1
  361. package/types/components/Slider/ui/Thumb/Thumb.d.ts.map +1 -1
  362. package/types/components/Slider/ui/Thumb/Thumb.styles.d.ts.map +1 -1
  363. package/types/components/Slider/ui/Thumb/Thumb.types.d.ts +1 -0
  364. package/types/components/Slider/ui/Thumb/Thumb.types.d.ts.map +1 -1
  365. package/types/components/Slider/utils/index.d.ts +26 -8
  366. package/types/components/Slider/utils/index.d.ts.map +1 -1
  367. package/types/components/Slider/variations/_view/base.d.ts.map +1 -1
  368. package/types/examples/plasma_b2c/components/Counter/Counter.config.d.ts +0 -3
  369. package/types/examples/plasma_b2c/components/Counter/Counter.config.d.ts.map +1 -1
  370. package/types/examples/plasma_b2c/components/Counter/Counter.d.ts +0 -3
  371. package/types/examples/plasma_b2c/components/Counter/Counter.d.ts.map +1 -1
  372. package/types/examples/plasma_b2c/components/Notification/Notification.d.ts +4 -2
  373. package/types/examples/plasma_b2c/components/Notification/Notification.d.ts.map +1 -1
  374. package/types/examples/plasma_b2c/components/Slider/Slider.config.d.ts.map +1 -1
  375. package/types/examples/plasma_b2c/components/Slider/Slider.d.ts +80 -2
  376. package/types/examples/plasma_b2c/components/Slider/Slider.d.ts.map +1 -1
  377. package/types/examples/plasma_web/components/Counter/Counter.config.d.ts +0 -3
  378. package/types/examples/plasma_web/components/Counter/Counter.config.d.ts.map +1 -1
  379. package/types/examples/plasma_web/components/Counter/Counter.d.ts +0 -3
  380. package/types/examples/plasma_web/components/Counter/Counter.d.ts.map +1 -1
  381. package/types/examples/plasma_web/components/Notification/Notification.d.ts +4 -13
  382. package/types/examples/plasma_web/components/Notification/Notification.d.ts.map +1 -1
  383. package/types/examples/plasma_web/components/Slider/Slider.config.d.ts.map +1 -1
  384. package/types/examples/plasma_web/components/Slider/Slider.d.ts +80 -2
  385. package/types/examples/plasma_web/components/Slider/Slider.d.ts.map +1 -1
  386. package/types/utils/index.d.ts +1 -1
  387. package/types/utils/index.d.ts.map +1 -1
  388. package/cjs/components/Slider/components/Single/Single.styles_1r9f1e0.css +0 -6
  389. package/cjs/components/Slider/components/SliderBase/SliderBase.styles_9s4eb3.css +0 -5
  390. package/cjs/components/Slider/ui/Handler/Handler.styles_8crx5z.css +0 -2
  391. package/cjs/components/Slider/ui/Thumb/Thumb.styles_4w4gzn.css +0 -1
  392. package/cjs/components/Slider/variations/_view/base_x642ct.css +0 -1
  393. package/es/components/Slider/components/Single/Single.styles_1r9f1e0.css +0 -6
  394. package/es/components/Slider/components/SliderBase/SliderBase.styles_9s4eb3.css +0 -5
  395. package/es/components/Slider/ui/Handler/Handler.styles_8crx5z.css +0 -2
  396. package/es/components/Slider/ui/Thumb/Thumb.styles_4w4gzn.css +0 -1
  397. package/es/components/Slider/variations/_view/base_x642ct.css +0 -1
@@ -1,4 +1,4 @@
1
- .Thumb_styles_4w4gzn_tqbdf8b__14129a5b{width:var(--plasma-slider-thumb-size);height:var(--plasma-slider-thumb-size);position:relative;left:-0.125rem;top:-0.125rem;border-radius:50%;box-sizing:border-box;background:var(--plasma-slider-thumb-background-color);margin:0.125rem;-webkit-transition:border-color 0.1s ease-in-out;transition:border-color 0.1s ease-in-out;position:relative;}.Thumb_styles_4w4gzn_tqbdf8b__14129a5b:after{background:var(--plasma-slider-thumb-border-color);margin:-0.125rem;content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;}.Thumb_styles_4w4gzn_tqbdf8b__14129a5b:not([disabled]):hover:after,.Thumb_styles_4w4gzn_tqbdf8b__14129a5b:not([disabled]):active:after{background:var(--plasma-slider-thumb-focus-border-color);}.Thumb_styles_4w4gzn_tqbdf8b__14129a5b[disabled]{cursor:not-allowed;}.Thumb_styles_4w4gzn_tqbdf8b__14129a5b:focus{outline:none;}.Thumb_styles_4w4gzn_tqbdf8b__14129a5b::before{content:'';position:absolute;top:0.125rem;left:0.125rem;right:0.125rem;bottom:0.125rem;z-index:1;display:block;box-sizing:content-box;border:0.125rem solid transparent;border-radius:50%;-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.Thumb_styles_4w4gzn_tqbdf8b__14129a5b.Thumb_styles_4w4gzn_focusVisible__14129a5b:focus::before,.Thumb_styles_4w4gzn_tqbdf8b__14129a5b[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 0.125rem var(--plasma-slider-thumb-focus-border-color);}
1
+ .Thumb_styles_uyn20e_tqbdf8b__de0962c7{width:var(--thumb-size);height:var(--thumb-size);min-width:var(--thumb-size);min-height:var(--thumb-size);position:relative;border-radius:50%;box-sizing:border-box;background:var(--plasma-slider-thumb-background-color);margin:0.0625rem;-webkit-transition:border-color 0.1s ease-in-out;transition:border-color 0.1s ease-in-out;position:relative;}.Thumb_styles_uyn20e_tqbdf8b__de0962c7:after{background:var(--plasma-slider-thumb-border-color);margin:-0.0625rem;content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;}.Thumb_styles_uyn20e_tqbdf8b__de0962c7:not([disabled]):hover:after,.Thumb_styles_uyn20e_tqbdf8b__de0962c7:not([disabled]):active:after{background:var(--plasma-slider-thumb-focus-border-color);}.Thumb_styles_uyn20e_tqbdf8b__de0962c7[disabled]{cursor:not-allowed;}.Thumb_styles_uyn20e_tqbdf8b__de0962c7:focus{outline:none;}.Thumb_styles_uyn20e_tqbdf8b__de0962c7::before{content:'';position:absolute;top:0.0625rem;left:0.0625rem;right:0.0625rem;bottom:0.0625rem;z-index:1;display:block;box-sizing:content-box;border:0.125rem solid transparent;border-radius:50%;-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.Thumb_styles_uyn20e_tqbdf8b__de0962c7.Thumb_styles_uyn20e_focusVisible__de0962c7:focus::before,.Thumb_styles_uyn20e_tqbdf8b__de0962c7[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 0.125rem var(--plasma-slider-thumb-focus-border-color);}
2
2
 
3
- .Handler_styles_8crx5z_h1tnrnip__2d4342c7{cursor:pointer;position:absolute;z-index:1;top:0;left:0;}
4
- .Handler_styles_8crx5z_s12uu2lj__2d4342c7{position:absolute;z-index:1;top:var(--plasma-slider-current-value-top-offset);text-align:center;width:100%;margin-left:-0.125rem;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;font-family:var(--plasma-slider-current-value-font-family);font-size:var(--plasma-slider-current-value-font-size);font-style:var(--plasma-slider-current-value-font-style);font-weight:var(--plasma-slider-current-value-font-weight);-webkit-letter-spacing:var(--plasma-slider-current-value-letter-spacing);-moz-letter-spacing:var(--plasma-slider-current-value-letter-spacing);-ms-letter-spacing:var(--plasma-slider-current-value-letter-spacing);letter-spacing:var(--plasma-slider-current-value-letter-spacing);line-height:var(--plasma-slider-current-value-line-height);}
3
+ .Handler_styles_irtcgm_s1tnrnip__e8f853c5{position:absolute;z-index:1;top:var(--plasma-slider-current-value-top-offset);text-align:center;width:100%;margin-left:-0.125rem;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;font-family:var(--plasma-slider-value-font-family);font-size:var(--plasma-slider-value-font-size);font-style:var(--plasma-slider-value-font-style);font-weight:var(--plasma-slider-value-font-weight);-webkit-letter-spacing:var(--plasma-slider-value-letter-spacing);-moz-letter-spacing:var(--plasma-slider-value-letter-spacing);-ms-letter-spacing:var(--plasma-slider-value-letter-spacing);letter-spacing:var(--plasma-slider-value-letter-spacing);line-height:var(--plasma-slider-value-line-height);}
4
+ .Handler_styles_irtcgm_h12uu2lj__e8f853c5{cursor:pointer;position:absolute;z-index:1;top:0;left:0;bottom:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;--thumb-size:var(--h12uu2lj-0);}.Handler_styles_irtcgm_h12uu2lj__e8f853c5.Handler_styles_irtcgm_sliderVerticalOrientation__e8f853c5{right:0;bottom:auto;-webkit-align-items:flex-start;-webkit-box-align:flex-start;-ms-flex-align:flex-start;align-items:flex-start;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;}.Handler_styles_irtcgm_h12uu2lj__e8f853c5.Handler_styles_irtcgm_sliderVerticalOrientation__e8f853c5 .Handler_styles_irtcgm_s1tnrnip__e8f853c5{margin:0;top:0;bottom:0;right:0;left:calc(var(--plasma-slider-size) - (var(--plasma-slider-size) - var(--thumb-size)) / 2 + 0.25rem);-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:start;-webkit-justify-content:flex-start;-ms-flex-pack:start;justify-content:flex-start;}.Handler_styles_irtcgm_h12uu2lj__e8f853c5.Handler_styles_irtcgm_sliderValuePlacementLeft__e8f853c5 .Handler_styles_irtcgm_s1tnrnip__e8f853c5{left:auto;right:calc(var(--plasma-slider-size) - (var(--plasma-slider-size) - var(--thumb-size)) / 2 + 0.3125rem);-webkit-box-pack:end;-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end;}
@@ -5,30 +5,25 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var _rollupPluginBabelHelpers = require('../../../../_virtual/_rollupPluginBabelHelpers.js');
6
6
  var React = require('react');
7
7
  var Draggable = require('react-draggable');
8
- var index = require('../../utils/index.js');
8
+ var index = require('../../../../utils/index.js');
9
+ var index$1 = require('../../utils/index.js');
9
10
  var Thumb = require('../Thumb/Thumb.js');
11
+ var Slider_tokens = require('../../Slider.tokens.js');
10
12
  var Handler_styles = require('./Handler.styles.js');
13
+ var computeKeyPressData = require('./computeKeyPressData.js');
11
14
 
12
- var _excluded = ["stepSize", "onChangeCommitted", "onChange", "xPosition", "min", "max", "bounds", "zIndex", "disabled", "side", "showCurrentValue", "startOffset", "endOffset", "value"];
15
+ var _excluded = ["size", "orientation", "stepSize", "onChangeCommitted", "onChange", "position", "min", "max", "bounds", "zIndex", "disabled", "side", "showCurrentValue", "startOffset", "endOffset", "value", "valuePlacement"];
13
16
 
14
17
  // TODO: PLASMA-1707
15
18
 
16
- var KeyboardSupport = {
17
- PageUp: 33,
18
- PageDown: 34,
19
- End: 35,
20
- Home: 36,
21
- ArrowLeft: 37,
22
- ArrowUp: 38,
23
- ArrowRight: 39,
24
- ArrowDown: 40
25
- };
26
19
  var Handler = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
27
- var stepSize = _ref.stepSize,
20
+ var size = _ref.size,
21
+ orientation = _ref.orientation,
22
+ stepSize = _ref.stepSize,
28
23
  onChangeCommitted = _ref.onChangeCommitted,
29
24
  onChange = _ref.onChange,
30
- _ref$xPosition = _ref.xPosition,
31
- xPosition = _ref$xPosition === void 0 ? 0 : _ref$xPosition,
25
+ _ref$position = _ref.position,
26
+ position = _ref$position === void 0 ? 0 : _ref$position,
32
27
  min = _ref.min,
33
28
  max = _ref.max,
34
29
  _ref$bounds = _ref.bounds,
@@ -43,123 +38,89 @@ var Handler = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
43
38
  _ref$endOffset = _ref.endOffset,
44
39
  endOffset = _ref$endOffset === void 0 ? 0 : _ref$endOffset,
45
40
  value = _ref.value,
41
+ valuePlacement = _ref.valuePlacement,
46
42
  rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
43
+ var isVertical = orientation === 'vertical';
47
44
  var lastOnChangeValue = React.useRef();
48
- var _getOffsets = index.getOffsets(ref, side),
45
+ var _getOffsets = index$1.getOffsets(ref, side, isVertical),
49
46
  _getOffsets2 = _rollupPluginBabelHelpers.slicedToArray(_getOffsets, 2),
50
- offsetLeft = _getOffsets2[0],
51
- offsetRight = _getOffsets2[1];
47
+ startClientOffset = _getOffsets2[0],
48
+ endClientOffset = _getOffsets2[1];
52
49
  var _bounds = _rollupPluginBabelHelpers.slicedToArray(bounds, 2),
53
- leftValueBound = _bounds[0],
54
- rightValueBound = _bounds[1];
55
- var leftPositionBound = leftValueBound ? (leftValueBound - min) * stepSize : null;
56
- var rightPositionBound = rightValueBound ? (rightValueBound - min) * stepSize : null;
57
- var position = typeof xPosition === 'number' ? {
58
- x: xPosition,
59
- y: 0
50
+ startValueBound = _bounds[0],
51
+ endValueBound = _bounds[1];
52
+ var startPositionBound = startValueBound ? (startValueBound - min) * stepSize : null;
53
+ var endPositionBound = endValueBound ? (endValueBound - min) * stepSize : null;
54
+ var dragPosition = typeof position === 'number' ? {
55
+ x: isVertical ? 0 : position,
56
+ y: isVertical ? position : 0
60
57
  } : undefined;
61
58
  var tabIndex = disabled ? -1 : 0;
62
- var computedBounds = {
63
- left: (leftPositionBound !== null && leftPositionBound !== void 0 ? leftPositionBound : 0) - (offsetLeft ? stepSize : 0),
64
- right: (rightPositionBound !== null && rightPositionBound !== void 0 ? rightPositionBound : stepSize * (max - min)) - (offsetRight ? stepSize : 0)
65
- };
66
- var showCurrentValueCondition = showCurrentValue && (xPosition >= startOffset && xPosition <= max * stepSize - endOffset || xPosition === 0 && value !== 0);
59
+ var computedBounds = _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, isVertical ? 'top' : 'left', (startPositionBound !== null && startPositionBound !== void 0 ? startPositionBound : 0) - (startClientOffset ? stepSize : 0)), isVertical ? 'bottom' : 'right', (endPositionBound !== null && endPositionBound !== void 0 ? endPositionBound : stepSize * (max - min)) - (endClientOffset ? stepSize : 0));
60
+ var showCurrentValueCondition = showCurrentValue && (position >= startOffset && position <= max * stepSize - endOffset || position === 0 && value !== 0);
67
61
  var onDrag = function onDrag(_, data) {
68
- var newValue = index.getSliderThumbValue(data.x, stepSize, min, max);
62
+ var newValue = index$1.getSliderThumbValue(isVertical ? data.y : data.x, stepSize, min, max);
69
63
  if (lastOnChangeValue.current !== newValue) {
70
64
  onChange === null || onChange === void 0 || onChange(newValue, data);
71
65
  lastOnChangeValue.current = newValue;
72
66
  }
73
67
  };
74
68
  var onStop = function onStop(_, data) {
75
- var newValue = index.getSliderThumbValue(data.x, stepSize, min, max);
69
+ var newValue = index$1.getSliderThumbValue(isVertical ? data.y : data.x, stepSize, min, max);
76
70
  onChangeCommitted && onChangeCommitted(newValue, data);
77
71
  };
78
72
  var onKeyPress = function onKeyPress(event) {
79
73
  event.persist();
80
- var keyCode = event.keyCode,
81
- target = event.target;
82
- if (!Object.values(KeyboardSupport).includes(keyCode)) {
83
- return;
84
- }
85
- var ArrowUp = KeyboardSupport.ArrowUp,
86
- ArrowRight = KeyboardSupport.ArrowRight,
87
- ArrowDown = KeyboardSupport.ArrowDown,
88
- ArrowLeft = KeyboardSupport.ArrowLeft,
89
- Home = KeyboardSupport.Home,
90
- End = KeyboardSupport.End,
91
- PageDown = KeyboardSupport.PageDown,
92
- PageUp = KeyboardSupport.PageUp;
93
74
  var computedMultipleSteps = stepSize * (rest.multipleStepSize / 100 * max);
94
- var data = {
95
- x: 0,
96
- deltaX: stepSize,
97
- lastX: xPosition,
98
- y: 0,
99
- deltaY: 0,
100
- lastY: 0,
101
- node: target
102
- };
103
- switch (keyCode) {
104
- case ArrowUp:
105
- case ArrowRight:
106
- data.x = xPosition + stepSize;
107
- break;
108
- case ArrowDown:
109
- case ArrowLeft:
110
- data.x = xPosition - stepSize;
111
- data.deltaX = -stepSize;
112
- break;
113
- case PageUp:
114
- data.x = xPosition + computedMultipleSteps;
115
- data.deltaX = computedMultipleSteps;
116
- break;
117
- case PageDown:
118
- data.x = xPosition - computedMultipleSteps;
119
- data.deltaX = -computedMultipleSteps;
120
- break;
121
- case End:
122
- data.x = max * stepSize;
123
- break;
124
- case Home:
125
- data.x = 0;
126
- break;
127
- default:
128
- data.x = 0;
75
+ var data = computeKeyPressData.computeKeyPressData(event, {
76
+ isVertical: isVertical,
77
+ stepSize: stepSize,
78
+ position: position,
79
+ max: max,
80
+ computedMultipleSteps: computedMultipleSteps
81
+ });
82
+ if (!data) {
83
+ return;
129
84
  }
130
85
  var left = computedBounds.left,
131
- right = computedBounds.right;
86
+ right = computedBounds.right,
87
+ top = computedBounds.top,
88
+ bottom = computedBounds.bottom;
132
89
 
133
90
  /*
134
91
  * INFO: Находим значение в диапазоне между указанными левой и правой границами.
92
+ * Или между верхней и нижней
135
93
  * Необходимо для правильного расчета положения SliderThumb.
136
94
  * см. функция clamp
137
95
  */
138
- var boundedValue = Math.max(Math.min(right, data.x), left);
139
- var computedValue = index.getSliderThumbValue(boundedValue, stepSize, min, max);
96
+ var boundedValue = isVertical ? Math.max(Math.min(bottom, data.y), top) : Math.max(Math.min(right, data.x), left);
97
+ var computedValue = index$1.getSliderThumbValue(boundedValue, stepSize, min, max);
140
98
  lastOnChangeValue.current = computedValue;
141
99
  onChangeCommitted && onChangeCommitted(computedValue, data);
142
100
  };
143
101
  return /*#__PURE__*/React.createElement(Draggable, {
144
- axis: "x",
102
+ axis: isVertical ? 'y' : 'x',
145
103
  bounds: computedBounds,
146
- grid: [stepSize, 1],
104
+ grid: isVertical ? [1, stepSize] : [stepSize, 1],
147
105
  onStop: onStop,
148
106
  onDrag: onDrag,
149
- position: position,
107
+ position: dragPosition,
150
108
  disabled: disabled
151
109
  }, /*#__PURE__*/React.createElement(Handler_styles.HandlerStyled, {
152
110
  ref: ref,
153
111
  style: {
154
112
  zIndex: zIndex
155
113
  },
114
+ className: index.cx(isVertical && Slider_tokens.classes.verticalOrientation, valuePlacement === 'left' && Slider_tokens.classes.valuePlacementLeft),
115
+ isLarge: size === 'large',
156
116
  onKeyDown: onKeyPress
157
- }, /*#__PURE__*/React.createElement(Thumb.Thumb, _rollupPluginBabelHelpers.extends({
117
+ }, size !== 'none' && /*#__PURE__*/React.createElement(Thumb.Thumb, _rollupPluginBabelHelpers.extends({
158
118
  tabIndex: tabIndex,
159
119
  min: min,
160
120
  max: max,
161
121
  value: value,
162
- disabled: disabled
122
+ disabled: disabled,
123
+ orientation: orientation
163
124
  }, rest)), showCurrentValueCondition && /*#__PURE__*/React.createElement(Handler_styles.StyledValue, null, value)));
164
125
  });
165
126
 
@@ -1 +1 @@
1
- {"version":3,"file":"Handler.js","sources":["../../../../../src/components/Slider/ui/Handler/Handler.tsx"],"sourcesContent":["import React, { useRef, forwardRef, KeyboardEvent } from 'react';\nimport Draggable, { DraggableEventHandler } from 'react-draggable';\nimport type { DraggableData } from 'react-draggable';\n\nimport { getSliderThumbValue, getOffsets } from '../../utils';\nimport { Thumb } from '../Thumb/Thumb';\n\nimport type { HandlerProps } from './Handler.types';\nimport { HandlerStyled, StyledValue } from './Handler.styles';\n\n// TODO: PLASMA-1707\ndeclare module 'react-draggable' {\n export interface DraggableProps {\n children: React.ReactNode;\n }\n}\n\nconst KeyboardSupport = {\n PageUp: 33,\n PageDown: 34,\n End: 35,\n Home: 36,\n ArrowLeft: 37,\n ArrowUp: 38,\n ArrowRight: 39,\n ArrowDown: 40,\n};\n\nexport const Handler = forwardRef<HTMLDivElement, HandlerProps>(\n (\n {\n stepSize,\n onChangeCommitted,\n onChange,\n xPosition = 0,\n min,\n max,\n bounds = [],\n zIndex,\n disabled,\n side,\n showCurrentValue = false,\n startOffset = 0,\n endOffset = 0,\n value,\n ...rest\n },\n ref,\n ) => {\n const lastOnChangeValue = useRef<number>();\n\n const [offsetLeft, offsetRight] = getOffsets(ref, side);\n\n const [leftValueBound, rightValueBound] = bounds;\n const leftPositionBound = leftValueBound ? (leftValueBound - min) * stepSize : null;\n const rightPositionBound = rightValueBound ? (rightValueBound - min) * stepSize : null;\n\n const position = typeof xPosition === 'number' ? { x: xPosition, y: 0 } : undefined;\n const tabIndex = disabled ? -1 : 0;\n\n const computedBounds = {\n left: (leftPositionBound ?? 0) - (offsetLeft ? stepSize : 0),\n right: (rightPositionBound ?? stepSize * (max - min)) - (offsetRight ? stepSize : 0),\n };\n\n const showCurrentValueCondition =\n showCurrentValue &&\n ((xPosition >= startOffset && xPosition <= max * stepSize - endOffset) || (xPosition === 0 && value !== 0));\n\n const onDrag: DraggableEventHandler = (_, data) => {\n const newValue = getSliderThumbValue(data.x, stepSize, min, max);\n if (lastOnChangeValue.current !== newValue) {\n onChange?.(newValue, data);\n lastOnChangeValue.current = newValue;\n }\n };\n\n const onStop: DraggableEventHandler = (_, data) => {\n const newValue = getSliderThumbValue(data.x, stepSize, min, max);\n onChangeCommitted && onChangeCommitted(newValue, data);\n };\n\n const onKeyPress = (event: KeyboardEvent<HTMLDivElement>) => {\n event.persist();\n\n const { keyCode, target } = event;\n\n if (!Object.values(KeyboardSupport).includes(keyCode)) {\n return;\n }\n\n const { ArrowUp, ArrowRight, ArrowDown, ArrowLeft, Home, End, PageDown, PageUp } = KeyboardSupport;\n\n const computedMultipleSteps = stepSize * ((rest.multipleStepSize / 100) * max);\n\n const data: DraggableData = {\n x: 0,\n deltaX: stepSize,\n lastX: xPosition,\n y: 0,\n deltaY: 0,\n lastY: 0,\n node: target as HTMLDivElement,\n };\n\n switch (keyCode) {\n case ArrowUp:\n case ArrowRight:\n data.x = xPosition + stepSize;\n break;\n case ArrowDown:\n case ArrowLeft:\n data.x = xPosition - stepSize;\n data.deltaX = -stepSize;\n break;\n case PageUp:\n data.x = xPosition + computedMultipleSteps;\n data.deltaX = computedMultipleSteps;\n break;\n case PageDown:\n data.x = xPosition - computedMultipleSteps;\n data.deltaX = -computedMultipleSteps;\n break;\n case End:\n data.x = max * stepSize;\n break;\n case Home:\n data.x = 0;\n break;\n default:\n data.x = 0;\n }\n\n const { left, right } = computedBounds;\n\n /*\n * INFO: Находим значение в диапазоне между указанными левой и правой границами.\n * Необходимо для правильного расчета положения SliderThumb.\n * см. функция clamp\n */\n const boundedValue = Math.max(Math.min(right, data.x), left);\n\n const computedValue = getSliderThumbValue(boundedValue, stepSize, min, max);\n lastOnChangeValue.current = computedValue;\n\n onChangeCommitted && onChangeCommitted(computedValue, data);\n };\n\n return (\n <Draggable\n axis=\"x\"\n bounds={computedBounds}\n grid={[stepSize, 1]}\n onStop={onStop}\n onDrag={onDrag}\n position={position}\n disabled={disabled}\n >\n <HandlerStyled ref={ref} style={{ zIndex }} onKeyDown={onKeyPress}>\n <Thumb tabIndex={tabIndex} min={min} max={max} value={value} disabled={disabled} {...rest} />\n {showCurrentValueCondition && <StyledValue>{value}</StyledValue>}\n </HandlerStyled>\n </Draggable>\n );\n },\n);\n"],"names":["KeyboardSupport","PageUp","PageDown","End","Home","ArrowLeft","ArrowUp","ArrowRight","ArrowDown","Handler","forwardRef","_ref","ref","stepSize","onChangeCommitted","onChange","_ref$xPosition","xPosition","min","max","_ref$bounds","bounds","zIndex","disabled","side","_ref$showCurrentValue","showCurrentValue","_ref$startOffset","startOffset","_ref$endOffset","endOffset","value","rest","_objectWithoutProperties","_excluded","lastOnChangeValue","useRef","_getOffsets","getOffsets","_getOffsets2","_slicedToArray","offsetLeft","offsetRight","_bounds","leftValueBound","rightValueBound","leftPositionBound","rightPositionBound","position","x","y","undefined","tabIndex","computedBounds","left","right","showCurrentValueCondition","onDrag","_","data","newValue","getSliderThumbValue","current","onStop","onKeyPress","event","persist","keyCode","target","Object","values","includes","computedMultipleSteps","multipleStepSize","deltaX","lastX","deltaY","lastY","node","boundedValue","Math","computedValue","React","createElement","Draggable","axis","grid","HandlerStyled","style","onKeyDown","Thumb","_extends","StyledValue"],"mappings":"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"}
1
+ {"version":3,"file":"Handler.js","sources":["../../../../../src/components/Slider/ui/Handler/Handler.tsx"],"sourcesContent":["import React, { useRef, forwardRef, KeyboardEvent } from 'react';\nimport Draggable, { DraggableEventHandler } from 'react-draggable';\n\nimport { cx } from '../../../../utils';\nimport { getSliderThumbValue, getOffsets } from '../../utils';\nimport { Thumb } from '../Thumb/Thumb';\nimport { classes } from '../../Slider.tokens';\n\nimport type { HandlerProps } from './Handler.types';\nimport { HandlerStyled, StyledValue } from './Handler.styles';\nimport { computeKeyPressData } from './computeKeyPressData';\n\n// TODO: PLASMA-1707\ndeclare module 'react-draggable' {\n export interface DraggableProps {\n children: React.ReactNode;\n }\n}\n\nexport const Handler = forwardRef<HTMLDivElement, HandlerProps>(\n (\n {\n size,\n orientation,\n stepSize,\n onChangeCommitted,\n onChange,\n position = 0,\n min,\n max,\n bounds = [],\n zIndex,\n disabled,\n side,\n showCurrentValue = false,\n startOffset = 0,\n endOffset = 0,\n value,\n valuePlacement,\n ...rest\n },\n ref,\n ) => {\n const isVertical = orientation === 'vertical';\n\n const lastOnChangeValue = useRef<number>();\n const [startClientOffset, endClientOffset] = getOffsets(ref, side, isVertical);\n\n const [startValueBound, endValueBound] = bounds;\n const startPositionBound = startValueBound ? (startValueBound - min) * stepSize : null;\n const endPositionBound = endValueBound ? (endValueBound - min) * stepSize : null;\n\n const dragPosition =\n typeof position === 'number' ? { x: isVertical ? 0 : position, y: isVertical ? position : 0 } : undefined;\n const tabIndex = disabled ? -1 : 0;\n\n const computedBounds = {\n [isVertical ? 'top' : 'left']: (startPositionBound ?? 0) - (startClientOffset ? stepSize : 0),\n [isVertical ? 'bottom' : 'right']:\n (endPositionBound ?? stepSize * (max - min)) - (endClientOffset ? stepSize : 0),\n };\n\n const showCurrentValueCondition =\n showCurrentValue &&\n ((position >= startOffset && position <= max * stepSize - endOffset) || (position === 0 && value !== 0));\n\n const onDrag: DraggableEventHandler = (_, data) => {\n const newValue = getSliderThumbValue(isVertical ? data.y : data.x, stepSize, min, max);\n if (lastOnChangeValue.current !== newValue) {\n onChange?.(newValue, data);\n lastOnChangeValue.current = newValue;\n }\n };\n\n const onStop: DraggableEventHandler = (_, data) => {\n const newValue = getSliderThumbValue(isVertical ? data.y : data.x, stepSize, min, max);\n onChangeCommitted && onChangeCommitted(newValue, data);\n };\n\n const onKeyPress = (event: KeyboardEvent<HTMLDivElement>) => {\n event.persist();\n\n const computedMultipleSteps = stepSize * ((rest.multipleStepSize / 100) * max);\n\n const data = computeKeyPressData(event, {\n isVertical,\n stepSize,\n position,\n max,\n computedMultipleSteps,\n });\n\n if (!data) {\n return;\n }\n\n const { left, right, top, bottom } = computedBounds;\n\n /*\n * INFO: Находим значение в диапазоне между указанными левой и правой границами.\n * Или между верхней и нижней\n * Необходимо для правильного расчета положения SliderThumb.\n * см. функция clamp\n */\n const boundedValue = isVertical\n ? Math.max(Math.min(bottom, data.y), top)\n : Math.max(Math.min(right, data.x), left);\n\n const computedValue = getSliderThumbValue(boundedValue, stepSize, min, max);\n lastOnChangeValue.current = computedValue;\n\n onChangeCommitted && onChangeCommitted(computedValue, data);\n };\n\n return (\n <Draggable\n axis={isVertical ? 'y' : 'x'}\n bounds={computedBounds}\n grid={isVertical ? [1, stepSize] : [stepSize, 1]}\n onStop={onStop}\n onDrag={onDrag}\n position={dragPosition}\n disabled={disabled}\n >\n <HandlerStyled\n ref={ref}\n style={{ zIndex }}\n className={cx(\n isVertical && classes.verticalOrientation,\n valuePlacement === 'left' && classes.valuePlacementLeft,\n )}\n isLarge={size === 'large'}\n onKeyDown={onKeyPress}\n >\n {size !== 'none' && (\n <Thumb\n tabIndex={tabIndex}\n min={min}\n max={max}\n value={value}\n disabled={disabled}\n orientation={orientation}\n {...rest}\n />\n )}\n {showCurrentValueCondition && <StyledValue>{value}</StyledValue>}\n </HandlerStyled>\n </Draggable>\n );\n },\n);\n"],"names":["Handler","forwardRef","_ref","ref","size","orientation","stepSize","onChangeCommitted","onChange","_ref$position","position","min","max","_ref$bounds","bounds","zIndex","disabled","side","_ref$showCurrentValue","showCurrentValue","_ref$startOffset","startOffset","_ref$endOffset","endOffset","value","valuePlacement","rest","_objectWithoutProperties","_excluded","isVertical","lastOnChangeValue","useRef","_getOffsets","getOffsets","_getOffsets2","_slicedToArray","startClientOffset","endClientOffset","_bounds","startValueBound","endValueBound","startPositionBound","endPositionBound","dragPosition","x","y","undefined","tabIndex","computedBounds","_defineProperty","showCurrentValueCondition","onDrag","_","data","newValue","getSliderThumbValue","current","onStop","onKeyPress","event","persist","computedMultipleSteps","multipleStepSize","computeKeyPressData","left","right","top","bottom","boundedValue","Math","computedValue","React","createElement","Draggable","axis","grid","HandlerStyled","style","className","cx","classes","verticalOrientation","valuePlacementLeft","isLarge","onKeyDown","Thumb","_extends","StyledValue"],"mappings":"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"}
@@ -1,20 +1,30 @@
1
- import './Handler.styles_8crx5z.css';
1
+ import './Handler.styles_irtcgm.css';
2
2
  'use strict';
3
3
 
4
4
  Object.defineProperty(exports, '__esModule', { value: true });
5
5
 
6
6
  var react = require('@linaria/react');
7
+ var Slider_tokens = require('../../Slider.tokens.js');
7
8
 
8
- var HandlerStyled = /*#__PURE__*/react.styled('div')({
9
- name: "HandlerStyled",
10
- "class": "h1tnrnip",
11
- propsAsIs: false
12
- });
13
9
  var StyledValue = /*#__PURE__*/react.styled('span')({
14
10
  name: "StyledValue",
15
- "class": "s12uu2lj",
11
+ "class": "s1tnrnip",
16
12
  propsAsIs: false
17
13
  });
14
+ var _exp8 = function _exp8() {
15
+ return function (_ref) {
16
+ var isLarge = _ref.isLarge;
17
+ return isLarge ? "var(".concat(Slider_tokens.tokens.thumbSizeLarge, ")") : "var(".concat(Slider_tokens.tokens.thumbSize, ")");
18
+ };
19
+ };
20
+ var HandlerStyled = /*#__PURE__*/react.styled('div')({
21
+ name: "HandlerStyled",
22
+ "class": "h12uu2lj",
23
+ propsAsIs: false,
24
+ vars: {
25
+ "h12uu2lj-0": [/*#__PURE__*/_exp8()]
26
+ }
27
+ });
18
28
 
19
29
  exports.HandlerStyled = HandlerStyled;
20
30
  exports.StyledValue = StyledValue;
@@ -1 +1 @@
1
- {"version":3,"file":"Handler.styles.js","sources":["../../../../../src/components/Slider/ui/Handler/Handler.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\n\nimport { tokens } from '../../Slider.tokens';\n\nexport const HandlerStyled = styled.div`\n cursor: pointer;\n position: absolute;\n z-index: 1;\n top: 0;\n left: 0;\n`;\n\nexport const StyledValue = styled.span`\n position: absolute;\n z-index: 1;\n top: var(${tokens.currentValueTopOffset});\n text-align: center;\n width: 100%;\n margin-left: -0.125rem;\n display: flex;\n justify-content: center;\n font-family: var(${tokens.currentValueFontFamily});\n font-size: var(${tokens.currentValueFontSize});\n font-style: var(${tokens.currentValueFontStyle});\n font-weight: var(${tokens.currentValueFontWeight});\n letter-spacing: var(${tokens.currentValueLetterSpacing});\n line-height: var(${tokens.currentValueLineHeight});\n`;\n"],"names":["HandlerStyled","styled","name","class","propsAsIs","StyledValue"],"mappings":";;;;;;AAIO,IAAMA,aAAa,gBAAGC,YAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,eAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAMlC,EAAA;AAEM,IAAMC,WAAW,gBAAGJ,YAAM,CAAA,MAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,aAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAehC;;;;;"}
1
+ {"version":3,"file":"Handler.styles.js","sources":["../../../../../src/components/Slider/ui/Handler/Handler.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\n\nimport { classes, tokens } from '../../Slider.tokens';\n\nexport const StyledValue = styled.span<{ isLargeThumb?: boolean }>`\n position: absolute;\n z-index: 1;\n top: var(${tokens.currentValueTopOffset});\n text-align: center;\n width: 100%;\n margin-left: -0.125rem;\n display: flex;\n justify-content: center;\n font-family: var(${tokens.valueFontFamily});\n font-size: var(${tokens.valueFontSize});\n font-style: var(${tokens.valueFontStyle});\n font-weight: var(${tokens.valueFontWeight});\n letter-spacing: var(${tokens.valueLetterSpacing});\n line-height: var(${tokens.valueLineHeight});\n`;\n\nexport const HandlerStyled = styled.div<{ isLarge?: boolean }>`\n cursor: pointer;\n position: absolute;\n z-index: 1;\n top: 0;\n left: 0;\n bottom: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n\n --thumb-size: ${({ isLarge }) => (isLarge ? `var(${tokens.thumbSizeLarge})` : `var(${tokens.thumbSize})`)};\n\n &.${classes.verticalOrientation} {\n right: 0;\n bottom: auto;\n align-items: flex-start;\n justify-content: center;\n\n ${StyledValue} {\n margin: 0;\n top: 0;\n bottom: 0;\n right: 0;\n left: calc(var(${tokens.size}) - (var(${tokens.size}) - var(--thumb-size)) / 2 + 0.25rem);\n align-items: center;\n justify-content: flex-start;\n }\n }\n\n &.${classes.valuePlacementLeft} {\n ${StyledValue} {\n left: auto;\n right: calc(var(${tokens.size}) - (var(${tokens.size}) - var(--thumb-size)) / 2 + 0.3125rem);\n justify-content: flex-end;\n }\n }\n`;\n"],"names":["StyledValue","styled","name","class","propsAsIs","_exp8","_ref","isLarge","concat","tokens","thumbSizeLarge","thumbSize","HandlerStyled","vars"],"mappings":";;;;;;;AAIO,IAAMA,WAAW,gBAAGC,YAAM,CAAA,MAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,aAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAehC,EAAA;AAAC,IAAAC,KAAA,GAlBgBA,SAkBhBA,KAAAA,GAAA;AAAA,EAAA,OAakB,UAAAC,IAAA,EAAA;AAAA,IAAA,IAAGC,OAAAA,GAAAA,IAAAA,CAAAA,OAAAA,CAAAA;AAAAA,IAAAA,OAAeA,OAAO,GAAA,MAAA,CAAAC,MAAA,CAAUC,oBAAM,CAACC,cAAe,EAAA,GAAA,CAAA,GAAA,MAAA,CAAAF,MAAA,CAAYC,oBAAM,CAACE,SAAU,EAAG,GAAA,CAAA,CAAA;AAAA,GAAA,CAAA;AAAA,CAAA,CAAA;AAXtG,IAAMC,aAAa,gBAAGX,YAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,eAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAAS,EAAAA,IAAA,EAAA;AAAA,IAAA,YAAA,EAAA,cAWfR,KAAyF,EAAA,CAAA;AAAA,GAAA;AAAA,CA0B5G;;;;;"}
@@ -0,0 +1,2 @@
1
+ .s1tnrnip{position:absolute;z-index:1;top:var(--plasma-slider-current-value-top-offset);text-align:center;width:100%;margin-left:-0.125rem;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;font-family:var(--plasma-slider-value-font-family);font-size:var(--plasma-slider-value-font-size);font-style:var(--plasma-slider-value-font-style);font-weight:var(--plasma-slider-value-font-weight);-webkit-letter-spacing:var(--plasma-slider-value-letter-spacing);-moz-letter-spacing:var(--plasma-slider-value-letter-spacing);-ms-letter-spacing:var(--plasma-slider-value-letter-spacing);letter-spacing:var(--plasma-slider-value-letter-spacing);line-height:var(--plasma-slider-value-line-height);}
2
+ .h12uu2lj{cursor:pointer;position:absolute;z-index:1;top:0;left:0;bottom:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;--thumb-size:var(--h12uu2lj-0);}.h12uu2lj.slider-vertical-orientation{right:0;bottom:auto;-webkit-align-items:flex-start;-webkit-box-align:flex-start;-ms-flex-align:flex-start;align-items:flex-start;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;}.h12uu2lj.slider-vertical-orientation .s1tnrnip{margin:0;top:0;bottom:0;right:0;left:calc(var(--plasma-slider-size) - (var(--plasma-slider-size) - var(--thumb-size)) / 2 + 0.25rem);-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:start;-webkit-justify-content:flex-start;-ms-flex-pack:start;justify-content:flex-start;}.h12uu2lj.slider-value-placement-left .s1tnrnip{left:auto;right:calc(var(--plasma-slider-size) - (var(--plasma-slider-size) - var(--thumb-size)) / 2 + 0.3125rem);-webkit-box-pack:end;-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end;}
@@ -0,0 +1,122 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var KeyboardSupport = {
6
+ PageUp: 33,
7
+ PageDown: 34,
8
+ End: 35,
9
+ Home: 36,
10
+ ArrowLeft: 37,
11
+ ArrowUp: 38,
12
+ ArrowRight: 39,
13
+ ArrowDown: 40
14
+ };
15
+ var ArrowUp = KeyboardSupport.ArrowUp,
16
+ ArrowRight = KeyboardSupport.ArrowRight,
17
+ ArrowDown = KeyboardSupport.ArrowDown,
18
+ ArrowLeft = KeyboardSupport.ArrowLeft,
19
+ Home = KeyboardSupport.Home,
20
+ End = KeyboardSupport.End,
21
+ PageDown = KeyboardSupport.PageDown,
22
+ PageUp = KeyboardSupport.PageUp;
23
+ var computeVerticalMovement = function computeVerticalMovement(event, _ref) {
24
+ var stepSize = _ref.stepSize,
25
+ position = _ref.position,
26
+ max = _ref.max,
27
+ computedMultipleSteps = _ref.computedMultipleSteps;
28
+ var keyCode = event.keyCode,
29
+ target = event.target;
30
+ var data = {
31
+ x: 0,
32
+ deltaX: 0,
33
+ lastX: 0,
34
+ y: 0,
35
+ deltaY: stepSize,
36
+ lastY: position,
37
+ node: target
38
+ };
39
+ switch (keyCode) {
40
+ case ArrowUp:
41
+ case ArrowRight:
42
+ data.y = position - stepSize;
43
+ data.deltaY = -stepSize;
44
+ break;
45
+ case ArrowDown:
46
+ case ArrowLeft:
47
+ data.y = position + stepSize;
48
+ break;
49
+ case PageUp:
50
+ data.y = position - computedMultipleSteps;
51
+ data.deltaY = -computedMultipleSteps;
52
+ break;
53
+ case PageDown:
54
+ data.y = position + computedMultipleSteps;
55
+ data.deltaY = computedMultipleSteps;
56
+ break;
57
+ case End:
58
+ data.y = max * stepSize;
59
+ break;
60
+ case Home:
61
+ data.y = 0;
62
+ break;
63
+ default:
64
+ data.y = 0;
65
+ }
66
+ return data;
67
+ };
68
+ var computeHorizontalMovement = function computeHorizontalMovement(event, _ref2) {
69
+ var stepSize = _ref2.stepSize,
70
+ position = _ref2.position,
71
+ max = _ref2.max,
72
+ computedMultipleSteps = _ref2.computedMultipleSteps;
73
+ var keyCode = event.keyCode,
74
+ target = event.target;
75
+ var data = {
76
+ x: 0,
77
+ deltaX: stepSize,
78
+ lastX: position,
79
+ y: 0,
80
+ deltaY: 0,
81
+ lastY: 0,
82
+ node: target
83
+ };
84
+ switch (keyCode) {
85
+ case ArrowUp:
86
+ case ArrowRight:
87
+ data.x = position + stepSize;
88
+ break;
89
+ case ArrowDown:
90
+ case ArrowLeft:
91
+ data.x = position - stepSize;
92
+ data.deltaX = -stepSize;
93
+ break;
94
+ case PageUp:
95
+ data.x = position + computedMultipleSteps;
96
+ data.deltaX = computedMultipleSteps;
97
+ break;
98
+ case PageDown:
99
+ data.x = position - computedMultipleSteps;
100
+ data.deltaX = -computedMultipleSteps;
101
+ break;
102
+ case End:
103
+ data.x = max * stepSize;
104
+ break;
105
+ case Home:
106
+ data.x = 0;
107
+ break;
108
+ default:
109
+ data.x = 0;
110
+ }
111
+ return data;
112
+ };
113
+ var computeKeyPressData = function computeKeyPressData(event, params) {
114
+ var keyCode = event.keyCode;
115
+ if (!Object.values(KeyboardSupport).includes(keyCode)) {
116
+ return null;
117
+ }
118
+ return params.isVertical ? computeVerticalMovement(event, params) : computeHorizontalMovement(event, params);
119
+ };
120
+
121
+ exports.computeKeyPressData = computeKeyPressData;
122
+ //# sourceMappingURL=computeKeyPressData.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"computeKeyPressData.js","sources":["../../../../../src/components/Slider/ui/Handler/computeKeyPressData.ts"],"sourcesContent":["import { KeyboardEvent } from 'react';\nimport type { DraggableData } from 'react-draggable';\n\nconst KeyboardSupport = {\n PageUp: 33,\n PageDown: 34,\n End: 35,\n Home: 36,\n ArrowLeft: 37,\n ArrowUp: 38,\n ArrowRight: 39,\n ArrowDown: 40,\n};\n\ninterface Params {\n isVertical: boolean;\n stepSize: number;\n position: number;\n max: number;\n computedMultipleSteps: number;\n}\n\nconst { ArrowUp, ArrowRight, ArrowDown, ArrowLeft, Home, End, PageDown, PageUp } = KeyboardSupport;\n\nconst computeVerticalMovement = (\n event: KeyboardEvent<HTMLDivElement>,\n { stepSize, position, max, computedMultipleSteps }: Params,\n) => {\n const { keyCode, target } = event;\n\n const data: DraggableData = {\n x: 0,\n deltaX: 0,\n lastX: 0,\n y: 0,\n deltaY: stepSize,\n lastY: position,\n node: target as HTMLDivElement,\n };\n\n switch (keyCode) {\n case ArrowUp:\n case ArrowRight:\n data.y = position - stepSize;\n data.deltaY = -stepSize;\n break;\n case ArrowDown:\n case ArrowLeft:\n data.y = position + stepSize;\n break;\n case PageUp:\n data.y = position - computedMultipleSteps;\n data.deltaY = -computedMultipleSteps;\n break;\n case PageDown:\n data.y = position + computedMultipleSteps;\n data.deltaY = computedMultipleSteps;\n break;\n case End:\n data.y = max * stepSize;\n break;\n case Home:\n data.y = 0;\n break;\n default:\n data.y = 0;\n }\n\n return data;\n};\n\nconst computeHorizontalMovement = (\n event: KeyboardEvent<HTMLDivElement>,\n { stepSize, position, max, computedMultipleSteps }: Params,\n) => {\n const { keyCode, target } = event;\n\n const data: DraggableData = {\n x: 0,\n deltaX: stepSize,\n lastX: position,\n y: 0,\n deltaY: 0,\n lastY: 0,\n node: target as HTMLDivElement,\n };\n\n switch (keyCode) {\n case ArrowUp:\n case ArrowRight:\n data.x = position + stepSize;\n break;\n case ArrowDown:\n case ArrowLeft:\n data.x = position - stepSize;\n data.deltaX = -stepSize;\n break;\n case PageUp:\n data.x = position + computedMultipleSteps;\n data.deltaX = computedMultipleSteps;\n break;\n case PageDown:\n data.x = position - computedMultipleSteps;\n data.deltaX = -computedMultipleSteps;\n break;\n case End:\n data.x = max * stepSize;\n break;\n case Home:\n data.x = 0;\n break;\n default:\n data.x = 0;\n }\n\n return data;\n};\n\nexport const computeKeyPressData = (event: KeyboardEvent<HTMLDivElement>, params: Params) => {\n const { keyCode } = event;\n\n if (!Object.values(KeyboardSupport).includes(keyCode)) {\n return null;\n }\n\n return params.isVertical ? computeVerticalMovement(event, params) : computeHorizontalMovement(event, params);\n};\n"],"names":["KeyboardSupport","PageUp","PageDown","End","Home","ArrowLeft","ArrowUp","ArrowRight","ArrowDown","computeVerticalMovement","event","_ref","stepSize","position","max","computedMultipleSteps","keyCode","target","data","x","deltaX","lastX","y","deltaY","lastY","node","computeHorizontalMovement","_ref2","computeKeyPressData","params","Object","values","includes","isVertical"],"mappings":";;;;AAGA,IAAMA,eAAe,GAAG;AACpBC,EAAAA,MAAM,EAAE,EAAE;AACVC,EAAAA,QAAQ,EAAE,EAAE;AACZC,EAAAA,GAAG,EAAE,EAAE;AACPC,EAAAA,IAAI,EAAE,EAAE;AACRC,EAAAA,SAAS,EAAE,EAAE;AACbC,EAAAA,OAAO,EAAE,EAAE;AACXC,EAAAA,UAAU,EAAE,EAAE;AACdC,EAAAA,SAAS,EAAE,EAAA;AACf,CAAC,CAAA;AAUD,IAAQF,OAAO,GAAoEN,eAAe,CAA1FM,OAAO;EAAEC,UAAU,GAAwDP,eAAe,CAAjFO,UAAU;EAAEC,SAAS,GAA6CR,eAAe,CAArEQ,SAAS;EAAEH,SAAS,GAAkCL,eAAe,CAA1DK,SAAS;EAAED,IAAI,GAA4BJ,eAAe,CAA/CI,IAAI;EAAED,GAAG,GAAuBH,eAAe,CAAzCG,GAAG;EAAED,QAAQ,GAAaF,eAAe,CAApCE,QAAQ;EAAED,MAAM,GAAKD,eAAe,CAA1BC,MAAM,CAAA;AAE9E,IAAMQ,uBAAuB,GAAG,SAA1BA,uBAAuBA,CACzBC,KAAoC,EAAAC,IAAA,EAEnC;AAAA,EAAA,IADCC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IAAEC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;IAAEC,GAAG,GAAAH,IAAA,CAAHG,GAAG;IAAEC,qBAAqB,GAAAJ,IAAA,CAArBI,qBAAqB,CAAA;AAEhD,EAAA,IAAQC,OAAO,GAAaN,KAAK,CAAzBM,OAAO;IAAEC,MAAM,GAAKP,KAAK,CAAhBO,MAAM,CAAA;AAEvB,EAAA,IAAMC,IAAmB,GAAG;AACxBC,IAAAA,CAAC,EAAE,CAAC;AACJC,IAAAA,MAAM,EAAE,CAAC;AACTC,IAAAA,KAAK,EAAE,CAAC;AACRC,IAAAA,CAAC,EAAE,CAAC;AACJC,IAAAA,MAAM,EAAEX,QAAQ;AAChBY,IAAAA,KAAK,EAAEX,QAAQ;AACfY,IAAAA,IAAI,EAAER,MAAAA;GACT,CAAA;AAED,EAAA,QAAQD,OAAO;AACX,IAAA,KAAKV,OAAO,CAAA;AACZ,IAAA,KAAKC,UAAU;AACXW,MAAAA,IAAI,CAACI,CAAC,GAAGT,QAAQ,GAAGD,QAAQ,CAAA;AAC5BM,MAAAA,IAAI,CAACK,MAAM,GAAG,CAACX,QAAQ,CAAA;AACvB,MAAA,MAAA;AACJ,IAAA,KAAKJ,SAAS,CAAA;AACd,IAAA,KAAKH,SAAS;AACVa,MAAAA,IAAI,CAACI,CAAC,GAAGT,QAAQ,GAAGD,QAAQ,CAAA;AAC5B,MAAA,MAAA;AACJ,IAAA,KAAKX,MAAM;AACPiB,MAAAA,IAAI,CAACI,CAAC,GAAGT,QAAQ,GAAGE,qBAAqB,CAAA;AACzCG,MAAAA,IAAI,CAACK,MAAM,GAAG,CAACR,qBAAqB,CAAA;AACpC,MAAA,MAAA;AACJ,IAAA,KAAKb,QAAQ;AACTgB,MAAAA,IAAI,CAACI,CAAC,GAAGT,QAAQ,GAAGE,qBAAqB,CAAA;MACzCG,IAAI,CAACK,MAAM,GAAGR,qBAAqB,CAAA;AACnC,MAAA,MAAA;AACJ,IAAA,KAAKZ,GAAG;AACJe,MAAAA,IAAI,CAACI,CAAC,GAAGR,GAAG,GAAGF,QAAQ,CAAA;AACvB,MAAA,MAAA;AACJ,IAAA,KAAKR,IAAI;MACLc,IAAI,CAACI,CAAC,GAAG,CAAC,CAAA;AACV,MAAA,MAAA;AACJ,IAAA;MACIJ,IAAI,CAACI,CAAC,GAAG,CAAC,CAAA;AAClB,GAAA;AAEA,EAAA,OAAOJ,IAAI,CAAA;AACf,CAAC,CAAA;AAED,IAAMQ,yBAAyB,GAAG,SAA5BA,yBAAyBA,CAC3BhB,KAAoC,EAAAiB,KAAA,EAEnC;AAAA,EAAA,IADCf,QAAQ,GAAAe,KAAA,CAARf,QAAQ;IAAEC,QAAQ,GAAAc,KAAA,CAARd,QAAQ;IAAEC,GAAG,GAAAa,KAAA,CAAHb,GAAG;IAAEC,qBAAqB,GAAAY,KAAA,CAArBZ,qBAAqB,CAAA;AAEhD,EAAA,IAAQC,OAAO,GAAaN,KAAK,CAAzBM,OAAO;IAAEC,MAAM,GAAKP,KAAK,CAAhBO,MAAM,CAAA;AAEvB,EAAA,IAAMC,IAAmB,GAAG;AACxBC,IAAAA,CAAC,EAAE,CAAC;AACJC,IAAAA,MAAM,EAAER,QAAQ;AAChBS,IAAAA,KAAK,EAAER,QAAQ;AACfS,IAAAA,CAAC,EAAE,CAAC;AACJC,IAAAA,MAAM,EAAE,CAAC;AACTC,IAAAA,KAAK,EAAE,CAAC;AACRC,IAAAA,IAAI,EAAER,MAAAA;GACT,CAAA;AAED,EAAA,QAAQD,OAAO;AACX,IAAA,KAAKV,OAAO,CAAA;AACZ,IAAA,KAAKC,UAAU;AACXW,MAAAA,IAAI,CAACC,CAAC,GAAGN,QAAQ,GAAGD,QAAQ,CAAA;AAC5B,MAAA,MAAA;AACJ,IAAA,KAAKJ,SAAS,CAAA;AACd,IAAA,KAAKH,SAAS;AACVa,MAAAA,IAAI,CAACC,CAAC,GAAGN,QAAQ,GAAGD,QAAQ,CAAA;AAC5BM,MAAAA,IAAI,CAACE,MAAM,GAAG,CAACR,QAAQ,CAAA;AACvB,MAAA,MAAA;AACJ,IAAA,KAAKX,MAAM;AACPiB,MAAAA,IAAI,CAACC,CAAC,GAAGN,QAAQ,GAAGE,qBAAqB,CAAA;MACzCG,IAAI,CAACE,MAAM,GAAGL,qBAAqB,CAAA;AACnC,MAAA,MAAA;AACJ,IAAA,KAAKb,QAAQ;AACTgB,MAAAA,IAAI,CAACC,CAAC,GAAGN,QAAQ,GAAGE,qBAAqB,CAAA;AACzCG,MAAAA,IAAI,CAACE,MAAM,GAAG,CAACL,qBAAqB,CAAA;AACpC,MAAA,MAAA;AACJ,IAAA,KAAKZ,GAAG;AACJe,MAAAA,IAAI,CAACC,CAAC,GAAGL,GAAG,GAAGF,QAAQ,CAAA;AACvB,MAAA,MAAA;AACJ,IAAA,KAAKR,IAAI;MACLc,IAAI,CAACC,CAAC,GAAG,CAAC,CAAA;AACV,MAAA,MAAA;AACJ,IAAA;MACID,IAAI,CAACC,CAAC,GAAG,CAAC,CAAA;AAClB,GAAA;AAEA,EAAA,OAAOD,IAAI,CAAA;AACf,CAAC,CAAA;AAEM,IAAMU,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAIlB,KAAoC,EAAEmB,MAAc,EAAK;AACzF,EAAA,IAAQb,OAAO,GAAKN,KAAK,CAAjBM,OAAO,CAAA;AAEf,EAAA,IAAI,CAACc,MAAM,CAACC,MAAM,CAAC/B,eAAe,CAAC,CAACgC,QAAQ,CAAChB,OAAO,CAAC,EAAE;AACnD,IAAA,OAAO,IAAI,CAAA;AACf,GAAA;AAEA,EAAA,OAAOa,MAAM,CAACI,UAAU,GAAGxB,uBAAuB,CAACC,KAAK,EAAEmB,MAAM,CAAC,GAAGH,yBAAyB,CAAChB,KAAK,EAAEmB,MAAM,CAAC,CAAA;AAChH;;;;"}
@@ -1 +1 @@
1
- .Thumb_styles_4w4gzn_tqbdf8b__14129a5b{width:var(--plasma-slider-thumb-size);height:var(--plasma-slider-thumb-size);position:relative;left:-0.125rem;top:-0.125rem;border-radius:50%;box-sizing:border-box;background:var(--plasma-slider-thumb-background-color);margin:0.125rem;-webkit-transition:border-color 0.1s ease-in-out;transition:border-color 0.1s ease-in-out;position:relative;}.Thumb_styles_4w4gzn_tqbdf8b__14129a5b:after{background:var(--plasma-slider-thumb-border-color);margin:-0.125rem;content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;}.Thumb_styles_4w4gzn_tqbdf8b__14129a5b:not([disabled]):hover:after,.Thumb_styles_4w4gzn_tqbdf8b__14129a5b:not([disabled]):active:after{background:var(--plasma-slider-thumb-focus-border-color);}.Thumb_styles_4w4gzn_tqbdf8b__14129a5b[disabled]{cursor:not-allowed;}.Thumb_styles_4w4gzn_tqbdf8b__14129a5b:focus{outline:none;}.Thumb_styles_4w4gzn_tqbdf8b__14129a5b::before{content:'';position:absolute;top:0.125rem;left:0.125rem;right:0.125rem;bottom:0.125rem;z-index:1;display:block;box-sizing:content-box;border:0.125rem solid transparent;border-radius:50%;-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.Thumb_styles_4w4gzn_tqbdf8b__14129a5b.Thumb_styles_4w4gzn_focusVisible__14129a5b:focus::before,.Thumb_styles_4w4gzn_tqbdf8b__14129a5b[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 0.125rem var(--plasma-slider-thumb-focus-border-color);}
1
+ .Thumb_styles_uyn20e_tqbdf8b__de0962c7{width:var(--thumb-size);height:var(--thumb-size);min-width:var(--thumb-size);min-height:var(--thumb-size);position:relative;border-radius:50%;box-sizing:border-box;background:var(--plasma-slider-thumb-background-color);margin:0.0625rem;-webkit-transition:border-color 0.1s ease-in-out;transition:border-color 0.1s ease-in-out;position:relative;}.Thumb_styles_uyn20e_tqbdf8b__de0962c7:after{background:var(--plasma-slider-thumb-border-color);margin:-0.0625rem;content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;}.Thumb_styles_uyn20e_tqbdf8b__de0962c7:not([disabled]):hover:after,.Thumb_styles_uyn20e_tqbdf8b__de0962c7:not([disabled]):active:after{background:var(--plasma-slider-thumb-focus-border-color);}.Thumb_styles_uyn20e_tqbdf8b__de0962c7[disabled]{cursor:not-allowed;}.Thumb_styles_uyn20e_tqbdf8b__de0962c7:focus{outline:none;}.Thumb_styles_uyn20e_tqbdf8b__de0962c7::before{content:'';position:absolute;top:0.0625rem;left:0.0625rem;right:0.0625rem;bottom:0.0625rem;z-index:1;display:block;box-sizing:content-box;border:0.125rem solid transparent;border-radius:50%;-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.Thumb_styles_uyn20e_tqbdf8b__de0962c7.Thumb_styles_uyn20e_focusVisible__de0962c7:focus::before,.Thumb_styles_uyn20e_tqbdf8b__de0962c7[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 0.125rem var(--plasma-slider-thumb-focus-border-color);}
@@ -6,7 +6,7 @@ var _rollupPluginBabelHelpers = require('../../../../_virtual/_rollupPluginBabel
6
6
  var React = require('react');
7
7
  var Thumb_styles = require('./Thumb.styles.js');
8
8
 
9
- var _excluded = ["min", "max", "value", "ariaValueMin", "ariaLabel", "disabled"];
9
+ var _excluded = ["min", "max", "value", "ariaValueMin", "ariaLabel", "disabled", "orientation"];
10
10
  var Thumb = function Thumb(_ref) {
11
11
  var min = _ref.min,
12
12
  max = _ref.max,
@@ -15,6 +15,7 @@ var Thumb = function Thumb(_ref) {
15
15
  ariaValueMin = _ref$ariaValueMin === void 0 ? min : _ref$ariaValueMin,
16
16
  ariaLabel = _ref.ariaLabel,
17
17
  disabled = _ref.disabled,
18
+ orientation = _ref.orientation,
18
19
  rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
19
20
  return /*#__PURE__*/React.createElement(Thumb_styles.ThumbBase, _rollupPluginBabelHelpers.extends({
20
21
  role: "slider",
@@ -23,7 +24,7 @@ var Thumb = function Thumb(_ref) {
23
24
  "aria-valuemax": max,
24
25
  "aria-valuenow": value,
25
26
  disabled: disabled,
26
- "aria-orientation": "horizontal"
27
+ "aria-orientation": orientation
27
28
  }, rest));
28
29
  };
29
30
 
@@ -1 +1 @@
1
- {"version":3,"file":"Thumb.js","sources":["../../../../../src/components/Slider/ui/Thumb/Thumb.tsx"],"sourcesContent":["import React from 'react';\n\nimport type { ThumbProps } from './Thumb.types';\nimport { ThumbBase } from './Thumb.styles';\n\nexport const Thumb = ({ min, max, value, ariaValueMin = min, ariaLabel, disabled, ...rest }: ThumbProps) => {\n return (\n <ThumbBase\n role=\"slider\"\n aria-label={ariaLabel}\n aria-valuemin={ariaValueMin}\n aria-valuemax={max}\n aria-valuenow={value}\n disabled={disabled}\n aria-orientation=\"horizontal\"\n {...rest}\n />\n );\n};\n"],"names":["Thumb","_ref","min","max","value","_ref$ariaValueMin","ariaValueMin","ariaLabel","disabled","rest","_objectWithoutProperties","_excluded","React","createElement","ThumbBase","_extends","role"],"mappings":";;;;;;;;;IAKaA,KAAK,GAAG,SAARA,KAAKA,CAAAC,IAAA,EAA0F;AAAA,EAAA,IAApFC,GAAG,GAAAD,IAAA,CAAHC,GAAG;IAAEC,GAAG,GAAAF,IAAA,CAAHE,GAAG;IAAEC,KAAK,GAAAH,IAAA,CAALG,KAAK;IAAAC,iBAAA,GAAAJ,IAAA,CAAEK,YAAY;AAAZA,IAAAA,YAAY,GAAAD,iBAAA,KAAGH,KAAAA,CAAAA,GAAAA,GAAG,GAAAG,iBAAA;IAAEE,SAAS,GAAAN,IAAA,CAATM,SAAS;IAAEC,QAAQ,GAAAP,IAAA,CAARO,QAAQ;AAAKC,IAAAA,IAAI,GAAAC,iDAAA,CAAAT,IAAA,EAAAU,SAAA,CAAA,CAAA;AACrF,EAAA,oBACIC,KAAA,CAAAC,aAAA,CAACC,sBAAS,EAAAC,iCAAA,CAAA;AACNC,IAAAA,IAAI,EAAC,QAAQ;AACb,IAAA,YAAA,EAAYT,SAAU;AACtB,IAAA,eAAA,EAAeD,YAAa;AAC5B,IAAA,eAAA,EAAeH,GAAI;AACnB,IAAA,eAAA,EAAeC,KAAM;AACrBI,IAAAA,QAAQ,EAAEA,QAAS;IACnB,kBAAiB,EAAA,YAAA;GACbC,EAAAA,IAAI,CACX,CAAC,CAAA;AAEV;;;;"}
1
+ {"version":3,"file":"Thumb.js","sources":["../../../../../src/components/Slider/ui/Thumb/Thumb.tsx"],"sourcesContent":["import React from 'react';\n\nimport type { ThumbProps } from './Thumb.types';\nimport { ThumbBase } from './Thumb.styles';\n\nexport const Thumb = ({\n min,\n max,\n value,\n ariaValueMin = min,\n ariaLabel,\n disabled,\n orientation,\n ...rest\n}: ThumbProps) => {\n return (\n <ThumbBase\n role=\"slider\"\n aria-label={ariaLabel}\n aria-valuemin={ariaValueMin}\n aria-valuemax={max}\n aria-valuenow={value}\n disabled={disabled}\n aria-orientation={orientation}\n {...rest}\n />\n );\n};\n"],"names":["Thumb","_ref","min","max","value","_ref$ariaValueMin","ariaValueMin","ariaLabel","disabled","orientation","rest","_objectWithoutProperties","_excluded","React","createElement","ThumbBase","_extends","role"],"mappings":";;;;;;;;;IAKaA,KAAK,GAAG,SAARA,KAAKA,CAAAC,IAAA,EASA;AAAA,EAAA,IARdC,GAAG,GAAAD,IAAA,CAAHC,GAAG;IACHC,GAAG,GAAAF,IAAA,CAAHE,GAAG;IACHC,KAAK,GAAAH,IAAA,CAALG,KAAK;IAAAC,iBAAA,GAAAJ,IAAA,CACLK,YAAY;AAAZA,IAAAA,YAAY,GAAAD,iBAAA,KAAGH,KAAAA,CAAAA,GAAAA,GAAG,GAAAG,iBAAA;IAClBE,SAAS,GAAAN,IAAA,CAATM,SAAS;IACTC,QAAQ,GAAAP,IAAA,CAARO,QAAQ;IACRC,WAAW,GAAAR,IAAA,CAAXQ,WAAW;AACRC,IAAAA,IAAI,GAAAC,iDAAA,CAAAV,IAAA,EAAAW,SAAA,CAAA,CAAA;AAEP,EAAA,oBACIC,KAAA,CAAAC,aAAA,CAACC,sBAAS,EAAAC,iCAAA,CAAA;AACNC,IAAAA,IAAI,EAAC,QAAQ;AACb,IAAA,YAAA,EAAYV,SAAU;AACtB,IAAA,eAAA,EAAeD,YAAa;AAC5B,IAAA,eAAA,EAAeH,GAAI;AACnB,IAAA,eAAA,EAAeC,KAAM;AACrBI,IAAAA,QAAQ,EAAEA,QAAS;IACnB,kBAAkBC,EAAAA,WAAAA;GACdC,EAAAA,IAAI,CACX,CAAC,CAAA;AAEV;;;;"}
@@ -1,4 +1,4 @@
1
- import './Thumb.styles_4w4gzn.css';
1
+ import './Thumb.styles_uyn20e.css';
2
2
  'use strict';
3
3
 
4
4
  Object.defineProperty(exports, '__esModule', { value: true });
@@ -1 +1 @@
1
- {"version":3,"file":"Thumb.styles.js","sources":["../../../../../src/components/Slider/ui/Thumb/Thumb.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\n\nimport { addFocus } from '../../../../mixins';\nimport { tokens } from '../../Slider.tokens';\n\nexport const ThumbBase = styled.div<{ disabled?: boolean }>`\n width: var(${tokens.thumbSize});\n height: var(${tokens.thumbSize});\n position: relative;\n left: -0.125rem;\n top: -0.125rem;\n border-radius: 50%;\n box-sizing: border-box;\n background: var(${tokens.thumbBackgroundColor});\n margin: 0.125rem;\n transition: border-color 0.1s ease-in-out;\n\n &:after {\n background: var(${tokens.thumbBorderColor});\n margin: -0.125rem;\n content: '';\n position: absolute;\n inset: 0;\n z-index: -1;\n border-radius: inherit;\n }\n\n &:not([disabled]):hover:after,\n &:not([disabled]):active:after {\n background: var(${tokens.thumbFocusBorderColor});\n }\n\n &[disabled] {\n cursor: not-allowed;\n }\n\n &:focus {\n outline: none;\n }\n\n ${addFocus({\n outlineOffset: '0.125rem',\n outlineSize: '0.125rem',\n outlineRadius: '50%',\n outlineColor: `var(${tokens.thumbFocusBorderColor})`,\n })}\n`;\n"],"names":["ThumbBase","styled","name","class","propsAsIs"],"mappings":";;;;;;AAKO,IAAMA,SAAS,gBAAGC,YAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,WAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAyC9B;;;;"}
1
+ {"version":3,"file":"Thumb.styles.js","sources":["../../../../../src/components/Slider/ui/Thumb/Thumb.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\n\nimport { addFocus } from '../../../../mixins';\nimport { tokens } from '../../Slider.tokens';\n\nexport const ThumbBase = styled.div<{ disabled?: boolean }>`\n width: var(--thumb-size);\n height: var(--thumb-size);\n min-width: var(--thumb-size);\n min-height: var(--thumb-size);\n\n position: relative;\n border-radius: 50%;\n box-sizing: border-box;\n background: var(${tokens.thumbBackgroundColor});\n margin: 0.0625rem;\n transition: border-color 0.1s ease-in-out;\n\n &:after {\n background: var(${tokens.thumbBorderColor});\n margin: -0.0625rem;\n content: '';\n position: absolute;\n inset: 0;\n z-index: -1;\n border-radius: inherit;\n }\n\n &:not([disabled]):hover:after,\n &:not([disabled]):active:after {\n background: var(${tokens.thumbFocusBorderColor});\n }\n\n &[disabled] {\n cursor: not-allowed;\n }\n\n &:focus {\n outline: none;\n }\n\n ${addFocus({\n outlineOffset: '0.0625rem',\n outlineSize: '0.125rem',\n outlineRadius: '50%',\n outlineColor: `var(${tokens.thumbFocusBorderColor})`,\n })}\n`;\n"],"names":["ThumbBase","styled","name","class","propsAsIs"],"mappings":";;;;;;AAKO,IAAMA,SAAS,gBAAGC,YAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,WAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CA0C9B;;;;"}
@@ -0,0 +1 @@
1
+ .tqbdf8b{width:var(--thumb-size);height:var(--thumb-size);min-width:var(--thumb-size);min-height:var(--thumb-size);position:relative;border-radius:50%;box-sizing:border-box;background:var(--plasma-slider-thumb-background-color);margin:0.0625rem;-webkit-transition:border-color 0.1s ease-in-out;transition:border-color 0.1s ease-in-out;position:relative;}.tqbdf8b:after{background:var(--plasma-slider-thumb-border-color);margin:-0.0625rem;content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;}.tqbdf8b:not([disabled]):hover:after,.tqbdf8b:not([disabled]):active:after{background:var(--plasma-slider-thumb-focus-border-color);}.tqbdf8b[disabled]{cursor:not-allowed;}.tqbdf8b:focus{outline:none;}.tqbdf8b::before{content:'';position:absolute;top:0.0625rem;left:0.0625rem;right:0.0625rem;bottom:0.0625rem;z-index:1;display:block;box-sizing:content-box;border:0.125rem solid transparent;border-radius:50%;-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.tqbdf8b.focus-visible:focus::before,.tqbdf8b[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 0.125rem var(--plasma-slider-thumb-focus-border-color);}
@@ -10,8 +10,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
10
10
  * @param {number} max
11
11
  * @return {number}
12
12
  */
13
- function getSliderThumbValue(handleCenterXRelative, stepSize, min, max) {
14
- var newValue = Math.round(handleCenterXRelative / stepSize) + min;
13
+ function getSliderThumbValue(handleCenterPosRelative, stepSize, min, max) {
14
+ var newValue = Math.round(handleCenterPosRelative / stepSize) + min;
15
15
  return Math.min(Math.max(newValue, min), max);
16
16
  }
17
17
 
@@ -22,11 +22,11 @@ function getSliderThumbValue(handleCenterXRelative, stepSize, min, max) {
22
22
  * @param {'left' | 'right'} side
23
23
  * @return Array<number>
24
24
  */
25
- function getOffsets(ref, side) {
25
+ function getOffsets(ref, side, isVertical) {
26
26
  if (!ref || !('current' in ref) || !ref.current || !side) {
27
27
  return [0, 0];
28
28
  }
29
- var size = ref.current.clientWidth;
29
+ var size = isVertical ? ref.current.clientHeight : ref.current.clientWidth;
30
30
  if (side === 'left') {
31
31
  return [0, size];
32
32
  }
@@ -37,16 +37,34 @@ function getOffsets(ref, side) {
37
37
  }
38
38
  var sizeData = {
39
39
  s: {
40
- indent: 0.5,
41
- fontSizeMultiplier: 16
40
+ small: {
41
+ indent: 0.5,
42
+ fontSizeMultiplier: 16
43
+ },
44
+ large: {
45
+ indent: 0.625,
46
+ fontSizeMultiplier: 16
47
+ }
42
48
  },
43
49
  m: {
44
- indent: 0.75,
45
- fontSizeMultiplier: 16
50
+ small: {
51
+ indent: 0.5,
52
+ fontSizeMultiplier: 16
53
+ },
54
+ large: {
55
+ indent: 0.625,
56
+ fontSizeMultiplier: 16
57
+ }
46
58
  },
47
59
  l: {
48
- indent: 0.75,
49
- fontSizeMultiplier: 16
60
+ small: {
61
+ indent: 0.5,
62
+ fontSizeMultiplier: 16
63
+ },
64
+ large: {
65
+ indent: 0.625,
66
+ fontSizeMultiplier: 16
67
+ }
50
68
  }
51
69
  };
52
70