@salutejs/plasma-new-hope 0.186.0-canary.1511.11719682564.0 → 0.186.0-canary.1534.11720486647.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (305) hide show
  1. package/cjs/index.css +0 -23
  2. package/cjs/index.js +0 -6
  3. package/cjs/index.js.map +1 -1
  4. package/emotion/cjs/components/_Icon/Icon.assets/ArrowBarDown.js +23 -0
  5. package/emotion/cjs/components/_Icon/Icons/IconArrowBarDown.js +22 -0
  6. package/emotion/cjs/components/_Icon/index.js +8 -1
  7. package/emotion/cjs/examples/plasma_b2c/components/Dropzone/Dropzone.js +215 -0
  8. package/emotion/cjs/examples/plasma_b2c/components/Dropzone/Dropzone.stories.tsx +58 -0
  9. package/emotion/cjs/examples/plasma_b2c/components/Dropzone/Dropzone.styles.js +80 -0
  10. package/emotion/cjs/examples/plasma_b2c/components/Dropzone/Dropzone.template-docs.mdx +136 -0
  11. package/emotion/cjs/index.js +0 -11
  12. package/emotion/es/components/_Icon/Icon.assets/ArrowBarDown.js +16 -0
  13. package/emotion/es/components/_Icon/Icons/IconArrowBarDown.js +15 -0
  14. package/emotion/es/components/_Icon/index.js +2 -1
  15. package/emotion/es/examples/plasma_b2c/components/Dropzone/Dropzone.js +207 -0
  16. package/emotion/es/examples/plasma_b2c/components/Dropzone/Dropzone.stories.tsx +58 -0
  17. package/emotion/es/examples/plasma_b2c/components/Dropzone/Dropzone.styles.js +73 -0
  18. package/emotion/es/examples/plasma_b2c/components/Dropzone/Dropzone.template-docs.mdx +136 -0
  19. package/emotion/es/index.js +1 -2
  20. package/es/index.css +0 -23
  21. package/es/index.js +0 -2
  22. package/es/index.js.map +1 -1
  23. package/package.json +2 -2
  24. package/styled-components/cjs/components/_Icon/Icon.assets/ArrowBarDown.js +23 -0
  25. package/styled-components/cjs/components/_Icon/Icons/IconArrowBarDown.js +22 -0
  26. package/styled-components/cjs/components/_Icon/index.js +8 -1
  27. package/styled-components/cjs/examples/plasma_b2c/components/Dropzone/Dropzone.js +215 -0
  28. package/styled-components/cjs/examples/plasma_b2c/components/Dropzone/Dropzone.stories.tsx +58 -0
  29. package/styled-components/cjs/examples/plasma_b2c/components/Dropzone/Dropzone.styles.js +33 -0
  30. package/styled-components/cjs/examples/plasma_b2c/components/Dropzone/Dropzone.template-docs.mdx +136 -0
  31. package/styled-components/cjs/index.js +0 -11
  32. package/styled-components/es/components/_Icon/Icon.assets/ArrowBarDown.js +16 -0
  33. package/styled-components/es/components/_Icon/Icons/IconArrowBarDown.js +15 -0
  34. package/styled-components/es/components/_Icon/index.js +2 -1
  35. package/styled-components/es/examples/plasma_b2c/components/Dropzone/Dropzone.js +207 -0
  36. package/styled-components/es/examples/plasma_b2c/components/Dropzone/Dropzone.stories.tsx +58 -0
  37. package/styled-components/es/examples/plasma_b2c/components/Dropzone/Dropzone.styles.js +26 -0
  38. package/styled-components/es/examples/plasma_b2c/components/Dropzone/Dropzone.template-docs.mdx +136 -0
  39. package/styled-components/es/index.js +1 -2
  40. package/types/components/_Icon/Icon.assets/ArrowBarDown.d.ts +4 -0
  41. package/types/components/_Icon/Icon.assets/ArrowBarDown.d.ts.map +1 -0
  42. package/types/components/_Icon/Icons/IconArrowBarDown.d.ts +4 -0
  43. package/types/components/_Icon/Icons/IconArrowBarDown.d.ts.map +1 -0
  44. package/types/components/_Icon/index.d.ts +1 -0
  45. package/types/components/_Icon/index.d.ts.map +1 -1
  46. package/types/examples/plasma_b2c/components/Dropzone/Dropzone.d.ts +20 -0
  47. package/types/examples/plasma_b2c/components/Dropzone/Dropzone.d.ts.map +1 -0
  48. package/types/examples/plasma_b2c/components/Dropzone/Dropzone.styles.d.ts +15 -0
  49. package/types/examples/plasma_b2c/components/Dropzone/Dropzone.styles.d.ts.map +1 -0
  50. package/types/examples/plasma_b2c/components/Dropzone/Dropzone.types.d.ts +72 -0
  51. package/types/examples/plasma_b2c/components/Dropzone/Dropzone.types.d.ts.map +1 -0
  52. package/types/index.d.ts +0 -1
  53. package/types/index.d.ts.map +1 -1
  54. package/cjs/components/NumberInput/NumberInput.css +0 -52
  55. package/cjs/components/NumberInput/NumberInput.js +0 -207
  56. package/cjs/components/NumberInput/NumberInput.js.map +0 -1
  57. package/cjs/components/NumberInput/NumberInput.styles.js +0 -9
  58. package/cjs/components/NumberInput/NumberInput.styles.js.map +0 -1
  59. package/cjs/components/NumberInput/NumberInput.styles_jeawjl.css +0 -1
  60. package/cjs/components/NumberInput/NumberInput.tokens.js +0 -102
  61. package/cjs/components/NumberInput/NumberInput.tokens.js.map +0 -1
  62. package/cjs/components/NumberInput/ui/ActionButton/ActionButton.js +0 -19
  63. package/cjs/components/NumberInput/ui/ActionButton/ActionButton.js.map +0 -1
  64. package/cjs/components/NumberInput/ui/ActionButton/ActionButton.styles.js +0 -22
  65. package/cjs/components/NumberInput/ui/ActionButton/ActionButton.styles.js.map +0 -1
  66. package/cjs/components/NumberInput/ui/ActionButton/ActionButton.styles_x642ct.css +0 -1
  67. package/cjs/components/NumberInput/ui/Input/Input.css +0 -15
  68. package/cjs/components/NumberInput/ui/Input/Input.js +0 -205
  69. package/cjs/components/NumberInput/ui/Input/Input.js.map +0 -1
  70. package/cjs/components/NumberInput/ui/Input/Input.styles.js +0 -96
  71. package/cjs/components/NumberInput/ui/Input/Input.styles.js.map +0 -1
  72. package/cjs/components/NumberInput/ui/Input/Input.styles_fhgb95.css +0 -8
  73. package/cjs/components/NumberInput/utils/index.js +0 -12
  74. package/cjs/components/NumberInput/utils/index.js.map +0 -1
  75. package/cjs/components/NumberInput/variations/_background-type/base.js +0 -9
  76. package/cjs/components/NumberInput/variations/_background-type/base.js.map +0 -1
  77. package/cjs/components/NumberInput/variations/_background-type/base_dx9knv.css +0 -1
  78. package/cjs/components/NumberInput/variations/_disabled/base.js +0 -9
  79. package/cjs/components/NumberInput/variations/_disabled/base.js.map +0 -1
  80. package/cjs/components/NumberInput/variations/_disabled/base_1sl0mh8.css +0 -1
  81. package/cjs/components/NumberInput/variations/_segmentation/base.js +0 -9
  82. package/cjs/components/NumberInput/variations/_segmentation/base.js.map +0 -1
  83. package/cjs/components/NumberInput/variations/_segmentation/base_14s5rot.css +0 -1
  84. package/cjs/components/NumberInput/variations/_shape/base.js +0 -9
  85. package/cjs/components/NumberInput/variations/_shape/base.js.map +0 -1
  86. package/cjs/components/NumberInput/variations/_shape/base_k05biw.css +0 -1
  87. package/cjs/components/NumberInput/variations/_size/base.js +0 -9
  88. package/cjs/components/NumberInput/variations/_size/base.js.map +0 -1
  89. package/cjs/components/NumberInput/variations/_size/base_yqdmk4.css +0 -1
  90. package/cjs/components/NumberInput/variations/_view/base.js +0 -9
  91. package/cjs/components/NumberInput/variations/_view/base.js.map +0 -1
  92. package/cjs/components/NumberInput/variations/_view/base_tnfbb5.css +0 -1
  93. package/emotion/cjs/components/NumberInput/NumberInput.js +0 -216
  94. package/emotion/cjs/components/NumberInput/NumberInput.styles.js +0 -17
  95. package/emotion/cjs/components/NumberInput/NumberInput.template-doc.mdx +0 -214
  96. package/emotion/cjs/components/NumberInput/NumberInput.tokens.js +0 -99
  97. package/emotion/cjs/components/NumberInput/index.js +0 -31
  98. package/emotion/cjs/components/NumberInput/ui/ActionButton/ActionButton.js +0 -18
  99. package/emotion/cjs/components/NumberInput/ui/ActionButton/ActionButton.styles.js +0 -16
  100. package/emotion/cjs/components/NumberInput/ui/Input/Input.js +0 -213
  101. package/emotion/cjs/components/NumberInput/ui/Input/Input.styles.js +0 -81
  102. package/emotion/cjs/components/NumberInput/ui/Input/Input.types.js +0 -5
  103. package/emotion/cjs/components/NumberInput/ui/index.js +0 -19
  104. package/emotion/cjs/components/NumberInput/utils/index.js +0 -9
  105. package/emotion/cjs/components/NumberInput/variations/_background-type/base.js +0 -10
  106. package/emotion/cjs/components/NumberInput/variations/_background-type/tokens.json +0 -6
  107. package/emotion/cjs/components/NumberInput/variations/_disabled/base.js +0 -9
  108. package/emotion/cjs/components/NumberInput/variations/_disabled/tokens.json +0 -4
  109. package/emotion/cjs/components/NumberInput/variations/_segmentation/base.js +0 -12
  110. package/emotion/cjs/components/NumberInput/variations/_segmentation/tokens.json +0 -1
  111. package/emotion/cjs/components/NumberInput/variations/_shape/base.js +0 -11
  112. package/emotion/cjs/components/NumberInput/variations/_shape/tokens.json +0 -1
  113. package/emotion/cjs/components/NumberInput/variations/_size/base.js +0 -13
  114. package/emotion/cjs/components/NumberInput/variations/_size/tokens.json +0 -22
  115. package/emotion/cjs/components/NumberInput/variations/_view/base.js +0 -13
  116. package/emotion/cjs/components/NumberInput/variations/_view/tokens.json +0 -14
  117. package/emotion/cjs/examples/plasma_b2c/components/NumberInput/NumberInput.config.js +0 -46
  118. package/emotion/cjs/examples/plasma_b2c/components/NumberInput/NumberInput.js +0 -11
  119. package/emotion/cjs/examples/plasma_b2c/components/NumberInput/NumberInput.stories.tsx +0 -108
  120. package/emotion/cjs/examples/plasma_web/components/NumberInput/NumberInput.config.js +0 -46
  121. package/emotion/cjs/examples/plasma_web/components/NumberInput/NumberInput.js +0 -11
  122. package/emotion/cjs/examples/plasma_web/components/NumberInput/NumberInput.stories.tsx +0 -108
  123. package/emotion/es/components/NumberInput/NumberInput.js +0 -208
  124. package/emotion/es/components/NumberInput/NumberInput.styles.js +0 -11
  125. package/emotion/es/components/NumberInput/NumberInput.template-doc.mdx +0 -214
  126. package/emotion/es/components/NumberInput/NumberInput.tokens.js +0 -93
  127. package/emotion/es/components/NumberInput/index.js +0 -2
  128. package/emotion/es/components/NumberInput/ui/ActionButton/ActionButton.js +0 -11
  129. package/emotion/es/components/NumberInput/ui/ActionButton/ActionButton.styles.js +0 -9
  130. package/emotion/es/components/NumberInput/ui/Input/Input.js +0 -204
  131. package/emotion/es/components/NumberInput/ui/Input/Input.styles.js +0 -74
  132. package/emotion/es/components/NumberInput/ui/Input/Input.types.js +0 -1
  133. package/emotion/es/components/NumberInput/ui/index.js +0 -2
  134. package/emotion/es/components/NumberInput/utils/index.js +0 -3
  135. package/emotion/es/components/NumberInput/variations/_background-type/base.js +0 -4
  136. package/emotion/es/components/NumberInput/variations/_background-type/tokens.json +0 -6
  137. package/emotion/es/components/NumberInput/variations/_disabled/base.js +0 -3
  138. package/emotion/es/components/NumberInput/variations/_disabled/tokens.json +0 -4
  139. package/emotion/es/components/NumberInput/variations/_segmentation/base.js +0 -6
  140. package/emotion/es/components/NumberInput/variations/_segmentation/tokens.json +0 -1
  141. package/emotion/es/components/NumberInput/variations/_shape/base.js +0 -5
  142. package/emotion/es/components/NumberInput/variations/_shape/tokens.json +0 -1
  143. package/emotion/es/components/NumberInput/variations/_size/base.js +0 -7
  144. package/emotion/es/components/NumberInput/variations/_size/tokens.json +0 -22
  145. package/emotion/es/components/NumberInput/variations/_view/base.js +0 -7
  146. package/emotion/es/components/NumberInput/variations/_view/tokens.json +0 -14
  147. package/emotion/es/examples/plasma_b2c/components/NumberInput/NumberInput.config.js +0 -40
  148. package/emotion/es/examples/plasma_b2c/components/NumberInput/NumberInput.js +0 -5
  149. package/emotion/es/examples/plasma_b2c/components/NumberInput/NumberInput.stories.tsx +0 -108
  150. package/emotion/es/examples/plasma_web/components/NumberInput/NumberInput.config.js +0 -40
  151. package/emotion/es/examples/plasma_web/components/NumberInput/NumberInput.js +0 -5
  152. package/emotion/es/examples/plasma_web/components/NumberInput/NumberInput.stories.tsx +0 -108
  153. package/es/components/NumberInput/NumberInput.css +0 -52
  154. package/es/components/NumberInput/NumberInput.js +0 -202
  155. package/es/components/NumberInput/NumberInput.js.map +0 -1
  156. package/es/components/NumberInput/NumberInput.styles.js +0 -5
  157. package/es/components/NumberInput/NumberInput.styles.js.map +0 -1
  158. package/es/components/NumberInput/NumberInput.styles_jeawjl.css +0 -1
  159. package/es/components/NumberInput/NumberInput.tokens.js +0 -96
  160. package/es/components/NumberInput/NumberInput.tokens.js.map +0 -1
  161. package/es/components/NumberInput/ui/ActionButton/ActionButton.js +0 -15
  162. package/es/components/NumberInput/ui/ActionButton/ActionButton.js.map +0 -1
  163. package/es/components/NumberInput/ui/ActionButton/ActionButton.styles.js +0 -18
  164. package/es/components/NumberInput/ui/ActionButton/ActionButton.styles.js.map +0 -1
  165. package/es/components/NumberInput/ui/ActionButton/ActionButton.styles_x642ct.css +0 -1
  166. package/es/components/NumberInput/ui/Input/Input.css +0 -15
  167. package/es/components/NumberInput/ui/Input/Input.js +0 -201
  168. package/es/components/NumberInput/ui/Input/Input.js.map +0 -1
  169. package/es/components/NumberInput/ui/Input/Input.styles.js +0 -85
  170. package/es/components/NumberInput/ui/Input/Input.styles.js.map +0 -1
  171. package/es/components/NumberInput/ui/Input/Input.styles_fhgb95.css +0 -8
  172. package/es/components/NumberInput/utils/index.js +0 -6
  173. package/es/components/NumberInput/utils/index.js.map +0 -1
  174. package/es/components/NumberInput/variations/_background-type/base.js +0 -5
  175. package/es/components/NumberInput/variations/_background-type/base.js.map +0 -1
  176. package/es/components/NumberInput/variations/_background-type/base_dx9knv.css +0 -1
  177. package/es/components/NumberInput/variations/_disabled/base.js +0 -5
  178. package/es/components/NumberInput/variations/_disabled/base.js.map +0 -1
  179. package/es/components/NumberInput/variations/_disabled/base_1sl0mh8.css +0 -1
  180. package/es/components/NumberInput/variations/_segmentation/base.js +0 -5
  181. package/es/components/NumberInput/variations/_segmentation/base.js.map +0 -1
  182. package/es/components/NumberInput/variations/_segmentation/base_14s5rot.css +0 -1
  183. package/es/components/NumberInput/variations/_shape/base.js +0 -5
  184. package/es/components/NumberInput/variations/_shape/base.js.map +0 -1
  185. package/es/components/NumberInput/variations/_shape/base_k05biw.css +0 -1
  186. package/es/components/NumberInput/variations/_size/base.js +0 -5
  187. package/es/components/NumberInput/variations/_size/base.js.map +0 -1
  188. package/es/components/NumberInput/variations/_size/base_yqdmk4.css +0 -1
  189. package/es/components/NumberInput/variations/_view/base.js +0 -5
  190. package/es/components/NumberInput/variations/_view/base.js.map +0 -1
  191. package/es/components/NumberInput/variations/_view/base_tnfbb5.css +0 -1
  192. package/styled-components/cjs/components/NumberInput/NumberInput.js +0 -216
  193. package/styled-components/cjs/components/NumberInput/NumberInput.styles.js +0 -8
  194. package/styled-components/cjs/components/NumberInput/NumberInput.template-doc.mdx +0 -214
  195. package/styled-components/cjs/components/NumberInput/NumberInput.tokens.js +0 -99
  196. package/styled-components/cjs/components/NumberInput/NumberInput.types.js +0 -5
  197. package/styled-components/cjs/components/NumberInput/index.js +0 -31
  198. package/styled-components/cjs/components/NumberInput/ui/ActionButton/ActionButton.js +0 -18
  199. package/styled-components/cjs/components/NumberInput/ui/ActionButton/ActionButton.styles.js +0 -15
  200. package/styled-components/cjs/components/NumberInput/ui/ActionButton/ActionButton.types.js +0 -5
  201. package/styled-components/cjs/components/NumberInput/ui/Input/Input.js +0 -213
  202. package/styled-components/cjs/components/NumberInput/ui/Input/Input.styles.js +0 -48
  203. package/styled-components/cjs/components/NumberInput/ui/Input/Input.types.js +0 -5
  204. package/styled-components/cjs/components/NumberInput/ui/index.js +0 -19
  205. package/styled-components/cjs/components/NumberInput/utils/index.js +0 -9
  206. package/styled-components/cjs/components/NumberInput/variations/_background-type/base.js +0 -10
  207. package/styled-components/cjs/components/NumberInput/variations/_background-type/tokens.json +0 -6
  208. package/styled-components/cjs/components/NumberInput/variations/_disabled/base.js +0 -9
  209. package/styled-components/cjs/components/NumberInput/variations/_disabled/tokens.json +0 -4
  210. package/styled-components/cjs/components/NumberInput/variations/_segmentation/base.js +0 -12
  211. package/styled-components/cjs/components/NumberInput/variations/_segmentation/tokens.json +0 -1
  212. package/styled-components/cjs/components/NumberInput/variations/_shape/base.js +0 -11
  213. package/styled-components/cjs/components/NumberInput/variations/_shape/tokens.json +0 -1
  214. package/styled-components/cjs/components/NumberInput/variations/_size/base.js +0 -13
  215. package/styled-components/cjs/components/NumberInput/variations/_size/tokens.json +0 -22
  216. package/styled-components/cjs/components/NumberInput/variations/_view/base.js +0 -13
  217. package/styled-components/cjs/components/NumberInput/variations/_view/tokens.json +0 -14
  218. package/styled-components/cjs/examples/plasma_b2c/components/NumberInput/NumberInput.config.js +0 -46
  219. package/styled-components/cjs/examples/plasma_b2c/components/NumberInput/NumberInput.js +0 -11
  220. package/styled-components/cjs/examples/plasma_b2c/components/NumberInput/NumberInput.stories.tsx +0 -108
  221. package/styled-components/cjs/examples/plasma_web/components/NumberInput/NumberInput.config.js +0 -46
  222. package/styled-components/cjs/examples/plasma_web/components/NumberInput/NumberInput.js +0 -11
  223. package/styled-components/cjs/examples/plasma_web/components/NumberInput/NumberInput.stories.tsx +0 -108
  224. package/styled-components/es/components/NumberInput/NumberInput.js +0 -208
  225. package/styled-components/es/components/NumberInput/NumberInput.styles.js +0 -2
  226. package/styled-components/es/components/NumberInput/NumberInput.template-doc.mdx +0 -214
  227. package/styled-components/es/components/NumberInput/NumberInput.tokens.js +0 -93
  228. package/styled-components/es/components/NumberInput/NumberInput.types.js +0 -1
  229. package/styled-components/es/components/NumberInput/index.js +0 -2
  230. package/styled-components/es/components/NumberInput/ui/ActionButton/ActionButton.js +0 -11
  231. package/styled-components/es/components/NumberInput/ui/ActionButton/ActionButton.styles.js +0 -8
  232. package/styled-components/es/components/NumberInput/ui/ActionButton/ActionButton.types.js +0 -1
  233. package/styled-components/es/components/NumberInput/ui/Input/Input.js +0 -204
  234. package/styled-components/es/components/NumberInput/ui/Input/Input.styles.js +0 -41
  235. package/styled-components/es/components/NumberInput/ui/Input/Input.types.js +0 -1
  236. package/styled-components/es/components/NumberInput/ui/index.js +0 -2
  237. package/styled-components/es/components/NumberInput/utils/index.js +0 -3
  238. package/styled-components/es/components/NumberInput/variations/_background-type/base.js +0 -4
  239. package/styled-components/es/components/NumberInput/variations/_background-type/tokens.json +0 -6
  240. package/styled-components/es/components/NumberInput/variations/_disabled/base.js +0 -3
  241. package/styled-components/es/components/NumberInput/variations/_disabled/tokens.json +0 -4
  242. package/styled-components/es/components/NumberInput/variations/_segmentation/base.js +0 -6
  243. package/styled-components/es/components/NumberInput/variations/_segmentation/tokens.json +0 -1
  244. package/styled-components/es/components/NumberInput/variations/_shape/base.js +0 -5
  245. package/styled-components/es/components/NumberInput/variations/_shape/tokens.json +0 -1
  246. package/styled-components/es/components/NumberInput/variations/_size/base.js +0 -7
  247. package/styled-components/es/components/NumberInput/variations/_size/tokens.json +0 -22
  248. package/styled-components/es/components/NumberInput/variations/_view/base.js +0 -7
  249. package/styled-components/es/components/NumberInput/variations/_view/tokens.json +0 -14
  250. package/styled-components/es/examples/plasma_b2c/components/NumberInput/NumberInput.config.js +0 -40
  251. package/styled-components/es/examples/plasma_b2c/components/NumberInput/NumberInput.js +0 -5
  252. package/styled-components/es/examples/plasma_b2c/components/NumberInput/NumberInput.stories.tsx +0 -108
  253. package/styled-components/es/examples/plasma_web/components/NumberInput/NumberInput.config.js +0 -40
  254. package/styled-components/es/examples/plasma_web/components/NumberInput/NumberInput.js +0 -5
  255. package/styled-components/es/examples/plasma_web/components/NumberInput/NumberInput.stories.tsx +0 -108
  256. package/types/components/NumberInput/NumberInput.d.ts +0 -38
  257. package/types/components/NumberInput/NumberInput.d.ts.map +0 -1
  258. package/types/components/NumberInput/NumberInput.styles.d.ts +0 -2
  259. package/types/components/NumberInput/NumberInput.styles.d.ts.map +0 -1
  260. package/types/components/NumberInput/NumberInput.tokens.d.ts +0 -88
  261. package/types/components/NumberInput/NumberInput.tokens.d.ts.map +0 -1
  262. package/types/components/NumberInput/NumberInput.types.d.ts +0 -112
  263. package/types/components/NumberInput/NumberInput.types.d.ts.map +0 -1
  264. package/types/components/NumberInput/index.d.ts +0 -3
  265. package/types/components/NumberInput/index.d.ts.map +0 -1
  266. package/types/components/NumberInput/ui/ActionButton/ActionButton.d.ts +0 -4
  267. package/types/components/NumberInput/ui/ActionButton/ActionButton.d.ts.map +0 -1
  268. package/types/components/NumberInput/ui/ActionButton/ActionButton.styles.d.ts +0 -45
  269. package/types/components/NumberInput/ui/ActionButton/ActionButton.styles.d.ts.map +0 -1
  270. package/types/components/NumberInput/ui/ActionButton/ActionButton.types.d.ts +0 -7
  271. package/types/components/NumberInput/ui/ActionButton/ActionButton.types.d.ts.map +0 -1
  272. package/types/components/NumberInput/ui/Input/Input.d.ts +0 -19
  273. package/types/components/NumberInput/ui/Input/Input.d.ts.map +0 -1
  274. package/types/components/NumberInput/ui/Input/Input.styles.d.ts +0 -30
  275. package/types/components/NumberInput/ui/Input/Input.styles.d.ts.map +0 -1
  276. package/types/components/NumberInput/ui/Input/Input.types.d.ts +0 -19
  277. package/types/components/NumberInput/ui/Input/Input.types.d.ts.map +0 -1
  278. package/types/components/NumberInput/ui/index.d.ts +0 -3
  279. package/types/components/NumberInput/ui/index.d.ts.map +0 -1
  280. package/types/components/NumberInput/utils/index.d.ts +0 -4
  281. package/types/components/NumberInput/utils/index.d.ts.map +0 -1
  282. package/types/components/NumberInput/variations/_background-type/base.d.ts +0 -2
  283. package/types/components/NumberInput/variations/_background-type/base.d.ts.map +0 -1
  284. package/types/components/NumberInput/variations/_disabled/base.d.ts +0 -2
  285. package/types/components/NumberInput/variations/_disabled/base.d.ts.map +0 -1
  286. package/types/components/NumberInput/variations/_segmentation/base.d.ts +0 -2
  287. package/types/components/NumberInput/variations/_segmentation/base.d.ts.map +0 -1
  288. package/types/components/NumberInput/variations/_shape/base.d.ts +0 -2
  289. package/types/components/NumberInput/variations/_shape/base.d.ts.map +0 -1
  290. package/types/components/NumberInput/variations/_size/base.d.ts +0 -2
  291. package/types/components/NumberInput/variations/_size/base.d.ts.map +0 -1
  292. package/types/components/NumberInput/variations/_view/base.d.ts +0 -2
  293. package/types/components/NumberInput/variations/_view/base.d.ts.map +0 -1
  294. package/types/examples/plasma_b2c/components/NumberInput/NumberInput.config.d.ts +0 -39
  295. package/types/examples/plasma_b2c/components/NumberInput/NumberInput.config.d.ts.map +0 -1
  296. package/types/examples/plasma_b2c/components/NumberInput/NumberInput.d.ts +0 -82
  297. package/types/examples/plasma_b2c/components/NumberInput/NumberInput.d.ts.map +0 -1
  298. package/types/examples/plasma_web/components/NumberInput/NumberInput.config.d.ts +0 -39
  299. package/types/examples/plasma_web/components/NumberInput/NumberInput.config.d.ts.map +0 -1
  300. package/types/examples/plasma_web/components/NumberInput/NumberInput.d.ts +0 -82
  301. package/types/examples/plasma_web/components/NumberInput/NumberInput.d.ts.map +0 -1
  302. /package/emotion/cjs/{components/NumberInput/NumberInput.types.js → examples/plasma_b2c/components/Dropzone/Dropzone.types.js} +0 -0
  303. /package/emotion/es/{components/NumberInput/NumberInput.types.js → examples/plasma_b2c/components/Dropzone/Dropzone.types.js} +0 -0
  304. /package/{emotion/cjs/components/NumberInput/ui/ActionButton/ActionButton.types.js → styled-components/cjs/examples/plasma_b2c/components/Dropzone/Dropzone.types.js} +0 -0
  305. /package/{emotion/es/components/NumberInput/ui/ActionButton/ActionButton.types.js → styled-components/es/examples/plasma_b2c/components/Dropzone/Dropzone.types.js} +0 -0
@@ -1,11 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.NumberInput = void 0;
7
- var _NumberInput = /*#__PURE__*/require("../../../../components/NumberInput");
8
- var _engines = /*#__PURE__*/require("../../../../engines");
9
- var _NumberInput2 = /*#__PURE__*/require("./NumberInput.config");
10
- var mergedConfig = /*#__PURE__*/(0, _engines.mergeConfig)(_NumberInput.numberInputConfig, _NumberInput2.config);
11
- var NumberInput = exports.NumberInput = /*#__PURE__*/(0, _engines.component)(mergedConfig);
@@ -1,108 +0,0 @@
1
- import React, { ComponentProps, useState } from 'react';
2
- import type { StoryObj, Meta } from '@storybook/react';
3
- import { action } from '@storybook/addon-actions';
4
-
5
- import { WithTheme } from '../../../_helpers';
6
-
7
- import { NumberInput } from './NumberInput';
8
-
9
- const onChange = action('onChange');
10
- const onDecrement = action('onDecrement');
11
- const onIncrement = action('onIncrement');
12
-
13
- const views = ['default', 'secondary', 'accent', 'clear'];
14
- const sizes = ['l', 'm', 's', 'xs'];
15
- const shapes = ['cornered', 'pilled'];
16
- const inputBackgroundTypes = ['fill', 'clear'];
17
- const segmentation = ['default', 'segmented', 'solid'];
18
-
19
- const meta: Meta<typeof NumberInput> = {
20
- title: 'plasma_web/NumberInput',
21
- component: NumberInput,
22
- decorators: [WithTheme],
23
- argTypes: {
24
- min: {
25
- control: {
26
- type: 'number',
27
- },
28
- },
29
- max: {
30
- control: {
31
- type: 'number',
32
- },
33
- },
34
- view: {
35
- options: views,
36
- control: {
37
- type: 'select',
38
- },
39
- },
40
- size: {
41
- options: sizes,
42
- control: {
43
- type: 'inline-radio',
44
- },
45
- },
46
- shape: {
47
- options: shapes,
48
- control: {
49
- type: 'inline-radio',
50
- },
51
- },
52
- inputBackgroundType: {
53
- options: inputBackgroundTypes,
54
- control: {
55
- type: 'inline-radio',
56
- },
57
- },
58
- segmentation: {
59
- options: segmentation,
60
- control: {
61
- type: 'select',
62
- },
63
- },
64
- },
65
- };
66
-
67
- export default meta;
68
-
69
- type StoryPropsDefault = ComponentProps<typeof NumberInput>;
70
-
71
- const StoryDefault = (args: StoryPropsDefault) => {
72
- const [value, setValue] = useState(5);
73
-
74
- const handleChange = (_: any, newValue: number) => {
75
- setValue(newValue);
76
- onChange(newValue);
77
- };
78
-
79
- return (
80
- <NumberInput
81
- {...args}
82
- value={value}
83
- onChange={handleChange}
84
- onDecrement={onDecrement}
85
- onIncrement={onIncrement}
86
- />
87
- );
88
- };
89
-
90
- export const Default: StoryObj<StoryPropsDefault> = {
91
- args: {
92
- view: 'default',
93
- size: 'l',
94
- shape: 'cornered',
95
- inputBackgroundType: 'fill',
96
- segmentation: 'default',
97
- min: 0,
98
- max: 9,
99
- step: 1,
100
- width: 188,
101
- isManualInput: false,
102
- textBefore: '',
103
- textAfter: '',
104
- isLoading: false,
105
- disabled: false,
106
- },
107
- render: StoryDefault,
108
- };
@@ -1,208 +0,0 @@
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 = ["className", "style", "width", "value", "min", "max", "step", "isLoading", "loader", "size", "view", "clear", "shape", "segmentation", "inputBackgroundType", "disabled", "textBefore", "textAfter", "customIncrementButton", "incrementIcon", "customDecrementButton", "decrementIcon", "isManualInput", "onChange", "onIncrement", "onDecrement"];
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, { forwardRef, useEffect, useState } from 'react';
18
- import { cx, getSizeValueFromProp, isNumber } from '../../utils';
19
- import { IconMinus, IconPlus } from '../_Icon';
20
- import { ActionButton, NumberInput } from './ui';
21
- import { classes, privateTokens } from './NumberInput.tokens';
22
- import { base } from './NumberInput.styles';
23
- import { base as viewCSS } from './variations/_view/base';
24
- import { base as sizeCSS } from './variations/_size/base';
25
- import { base as shapeCSS } from './variations/_shape/base';
26
- import { base as inputBackgroundTypeCSS } from './variations/_background-type/base';
27
- import { base as segmentationCSS } from './variations/_segmentation/base';
28
- import { base as disabledCSS } from './variations/_disabled/base';
29
- export var numberInputRoot = function numberInputRoot(Root) {
30
- return /*#__PURE__*/forwardRef(function (_ref, ref) {
31
- var _ref2;
32
- var className = _ref.className,
33
- style = _ref.style,
34
- width = _ref.width,
35
- value = _ref.value,
36
- min = _ref.min,
37
- max = _ref.max,
38
- _ref$step = _ref.step,
39
- step = _ref$step === void 0 ? 1 : _ref$step,
40
- isLoading = _ref.isLoading,
41
- loader = _ref.loader,
42
- size = _ref.size,
43
- view = _ref.view,
44
- clear = _ref.clear,
45
- shape = _ref.shape,
46
- segmentation = _ref.segmentation,
47
- _ref$inputBackgroundT = _ref.inputBackgroundType,
48
- inputBackgroundType = _ref$inputBackgroundT === void 0 ? 'fill' : _ref$inputBackgroundT,
49
- disabled = _ref.disabled,
50
- textBefore = _ref.textBefore,
51
- textAfter = _ref.textAfter,
52
- customIncrementButton = _ref.customIncrementButton,
53
- incrementIcon = _ref.incrementIcon,
54
- customDecrementButton = _ref.customDecrementButton,
55
- decrementIcon = _ref.decrementIcon,
56
- isManualInput = _ref.isManualInput,
57
- onChange = _ref.onChange,
58
- onIncrement = _ref.onIncrement,
59
- onDecrement = _ref.onDecrement,
60
- rest = _objectWithoutProperties(_ref, _excluded);
61
- var _useState = useState((_ref2 = value !== null && value !== void 0 ? value : min) !== null && _ref2 !== void 0 ? _ref2 : 0),
62
- _useState2 = _slicedToArray(_useState, 2),
63
- innerValue = _useState2[0],
64
- setInnerValue = _useState2[1];
65
- var _useState3 = useState(false),
66
- _useState4 = _slicedToArray(_useState3, 2),
67
- isInputFocused = _useState4[0],
68
- setIsInputFocused = _useState4[1];
69
- var _useState5 = useState(false),
70
- _useState6 = _slicedToArray(_useState5, 2),
71
- isAnimationRun = _useState6[0],
72
- setIsAnimationRun = _useState6[1];
73
- var innerWidth = width ? getSizeValueFromProp(width) : '100%';
74
- var actionIconSize = size === 'xs' ? 'xs' : 's';
75
- var solidViewClass = segmentation === 'solid' ? classes.solidView : undefined;
76
- var segmentedViewClass = segmentation === 'segmented' ? classes.segmentedView : undefined;
77
- var clearViewClass = clear ? classes.clearView : undefined;
78
- var disabledClass = disabled ? classes.disabled : undefined;
79
- var loadingClass = isLoading ? classes.loading : undefined;
80
- var focusedClass = isInputFocused ? classes.focused : undefined;
81
- var isMinValue = function isMinValue(currentValue) {
82
- return min !== undefined && currentValue <= min;
83
- };
84
- var isMaxValue = function isMaxValue(currentValue) {
85
- return max !== undefined && currentValue >= max;
86
- };
87
- var decrementButtonDisabled = isMinValue(Number(innerValue)) && !isAnimationRun || isLoading ? classes.actionButtonDecrementDisabled : undefined;
88
- var incrementButtonDisabled = isMaxValue(Number(innerValue)) && !isAnimationRun || isLoading ? classes.actionButtonIncrementDisabled : undefined;
89
- var handleDecrement = function handleDecrement() {
90
- console.log(isAnimationRun);
91
- if (isLoading || disabled || isAnimationRun) {
92
- return;
93
- }
94
- var diffValue = Number(innerValue) - step;
95
- var resValue = min !== undefined && diffValue <= min ? min : diffValue;
96
- setInnerValue(resValue);
97
- if (onDecrement) {
98
- onDecrement(resValue);
99
- }
100
- if (onChange) {
101
- onChange(null, resValue);
102
- }
103
- };
104
- var handleIncrement = function handleIncrement() {
105
- console.log(isAnimationRun);
106
- if (isLoading || disabled || isAnimationRun) {
107
- return;
108
- }
109
- var diffValue = Number(innerValue) + step;
110
- var resValue = max !== undefined && diffValue >= max ? max : diffValue;
111
- setInnerValue(resValue);
112
- if (onIncrement) {
113
- onIncrement(resValue);
114
- }
115
- if (onChange) {
116
- onChange(null, resValue);
117
- }
118
- };
119
- useEffect(function () {
120
- if (value === undefined || !isNumber(value)) {
121
- return;
122
- }
123
- setInnerValue(function (prevValue) {
124
- return prevValue !== value ? value : prevValue;
125
- });
126
- }, [value]);
127
- return /*#__PURE__*/React.createElement(Root, _extends({
128
- view: view,
129
- size: size,
130
- disabled: disabled,
131
- clear: clear,
132
- shape: shape,
133
- segmentation: segmentation,
134
- isLoading: isLoading
135
- }, segmentation === 'solid' ? {
136
- inputBackgroundType: 'clear'
137
- } : {
138
- inputBackgroundType: inputBackgroundType
139
- }, {
140
- className: cx(className, solidViewClass, segmentedViewClass, clearViewClass, disabledClass, loadingClass, focusedClass),
141
- style: _objectSpread(_objectSpread({}, style), {}, _defineProperty({}, privateTokens.inputWidth, innerWidth))
142
- }), customDecrementButton || /*#__PURE__*/React.createElement(ActionButton, {
143
- className: cx(classes.actionButtonDecrement, decrementButtonDisabled, solidViewClass, segmentedViewClass),
144
- icon: decrementIcon || /*#__PURE__*/React.createElement(IconMinus, {
145
- color: "inherit",
146
- size: actionIconSize
147
- }),
148
- onClick: handleDecrement
149
- }), /*#__PURE__*/React.createElement(NumberInput, _extends({
150
- ref: ref,
151
- segmentation: segmentation,
152
- value: innerValue,
153
- min: min,
154
- max: max,
155
- isManualInput: isManualInput,
156
- textBefore: textBefore,
157
- textAfter: textAfter,
158
- isLoading: isLoading,
159
- loader: loader,
160
- disabled: disabled,
161
- isInputFocused: isInputFocused,
162
- setIsInputFocused: setIsInputFocused,
163
- setIsAnimationRun: setIsAnimationRun,
164
- setInnerValue: setInnerValue,
165
- onChange: onChange
166
- }, rest)), customIncrementButton || /*#__PURE__*/React.createElement(ActionButton, {
167
- className: cx(classes.actionButtonIncrement, incrementButtonDisabled, solidViewClass, segmentedViewClass),
168
- icon: incrementIcon || /*#__PURE__*/React.createElement(IconPlus, {
169
- color: "inherit",
170
- size: actionIconSize
171
- }),
172
- onClick: handleIncrement
173
- }));
174
- });
175
- };
176
- export var numberInputConfig = {
177
- name: 'NumberInput',
178
- tag: 'div',
179
- layout: numberInputRoot,
180
- base: base,
181
- variations: {
182
- view: {
183
- css: viewCSS
184
- },
185
- size: {
186
- css: sizeCSS
187
- },
188
- shape: {
189
- css: shapeCSS
190
- },
191
- inputBackgroundType: {
192
- css: inputBackgroundTypeCSS
193
- },
194
- segmentation: {
195
- css: segmentationCSS
196
- },
197
- disabled: {
198
- css: disabledCSS,
199
- attrs: true
200
- }
201
- },
202
- defaults: {
203
- view: 'default',
204
- size: 'l',
205
- shape: 'cornered',
206
- segmentation: 'default'
207
- }
208
- };
@@ -1,11 +0,0 @@
1
- function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
2
- import { css } from '@emotion/react';
3
- export var base = process.env.NODE_ENV === "production" ? {
4
- name: "1dep0p4-plasma-new-hope__base",
5
- styles: "display:flex;align-items:center;label:plasma-new-hope__base;"
6
- } : {
7
- name: "1dep0p4-plasma-new-hope__base",
8
- styles: "display:flex;align-items:center;label:plasma-new-hope__base;",
9
- map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvTnVtYmVySW5wdXQvTnVtYmVySW5wdXQuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUV1QiIsImZpbGUiOiIuLi8uLi8uLi8uLi9zcmMtZW1vdGlvbi9jb21wb25lbnRzL051bWJlcklucHV0L051bWJlcklucHV0LnN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcblxuZXhwb3J0IGNvbnN0IGJhc2UgPSBjc3NgXG4gICAgZGlzcGxheTogZmxleDtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuYDtcbiJdfQ== */",
10
- toString: _EMOTION_STRINGIFIED_CSS_ERROR__
11
- };
@@ -1,214 +0,0 @@
1
- ---
2
- id: numberInput
3
- title: NumberInput
4
- ---
5
-
6
- import { PropsTable, Description } from '@site/src/components';
7
-
8
- # NumberInput
9
- Числовое поле. Поддерживает как ручной ввод, так и увеличение/уменьшение значения,
10
- посредством нажатия соответствующих кнопок.
11
-
12
- ## NumberInput
13
- <Description name="NumberInput" />
14
- <PropsTable name="NumberInput" />
15
-
16
- ## Примеры
17
-
18
- ### Вид числового поля
19
- Вид числового поля задается с помощью свойства `view`:
20
-
21
- ```tsx live
22
- import React from 'react';
23
- import { NumberInput } from '@salutejs/{{ package }}';
24
-
25
- export function App() {
26
- return (
27
- <div>
28
- <NumberInput value={5} width={188} view="default" />
29
- <NumberInput value={5} width={188} view="secondary" />
30
- <NumberInput value={5} width={188} view="accent" />
31
- <NumberInput value={5} width={188} view="clear" />
32
- </div>
33
- );
34
- }
35
- ```
36
-
37
- ### Модификация вида числового поля
38
- Числовое поле может иметь различные отступы внутри, влияющие на форму. Задается с помощью свойства `segmentation`:
39
-
40
- ```tsx live
41
- import React from 'react';
42
- import { NumberInput } from '@salutejs/{{ package }}';
43
-
44
- export function App() {
45
- return (
46
- <div>
47
- <NumberInput value={5} width={188} view="default" segmentation="default" />
48
- <NumberInput value={5} width={188} view="default" segmentation="segmented" />
49
- <NumberInput value={5} width={188} view="default" segmentation="solid" />
50
- </div>
51
- );
52
- }
53
- ```
54
-
55
- ### Граница числового поля
56
- Граница числового поля задается с помощью свойства `shape`:
57
-
58
- ```tsx live
59
- import React from 'react';
60
- import { NumberInput } from '@salutejs/{{ package }}';
61
-
62
- export function App() {
63
- return (
64
- <div>
65
- <NumberInput value={5} width={188} view="default" segmentation="default" shape="cornered" />
66
- <NumberInput value={5} width={188} view="default" segmentation="solid" shape="cornered" />
67
- <NumberInput value={5} width={188} view="default" segmentation="default" shape="pilled" />
68
- <NumberInput value={5} width={188} view="default" segmentation="solid" shape="pilled" />
69
- </div>
70
- );
71
- }
72
- ```
73
-
74
- ### Размер числового поля
75
- Размер числового поля задается с помощью свойства `size`:
76
-
77
- ```tsx live
78
- import React from 'react';
79
- import { NumberInput } from '@salutejs/{{ package }}';
80
-
81
- export function App() {
82
- return (
83
- <div>
84
- <NumberInput value={5} width={188} size="l" />
85
- <NumberInput value={5} width={188} size="m" />
86
- <NumberInput value={5} width={188} size="s" />
87
- <NumberInput value={5} width={188} size="xs" />
88
- </div>
89
- );
90
- }
91
- ```
92
-
93
- ### Состояние загрузки числового поля
94
- Состояние загрузки числового поля определяется свойством `isLoading`:
95
-
96
- ```tsx live
97
- import React from 'react';
98
- import { NumberInput } from '@salutejs/{{ package }}';
99
-
100
- export function App() {
101
- return (
102
- <div>
103
- <NumberInput value={5} size="l" width={188} isLoading />
104
- </div>
105
- );
106
- }
107
- ```
108
-
109
- ### Ручной ввод
110
- Режим ручного ввода включается свойством `isManualInput`:
111
-
112
- ```tsx live
113
- import React from 'react';
114
- import { NumberInput } from '@salutejs/{{ package }}';
115
-
116
- export function App() {
117
- return (
118
- <div>
119
- <NumberInput value={5} size="l" width={188} isManualInput />
120
- </div>
121
- );
122
- }
123
- ```
124
-
125
- ### Кастомные иконки для кнопок
126
- Можно установить собственную иконку для кнопки используя
127
- свойства `decrementIcon` и `incrementIcon` соответственно:
128
-
129
- ```tsx live
130
- import React from 'react';
131
- import { NumberInput } from '@salutejs/{{ package }}';
132
- import { IconVolumeLevel1Fill, IconVolumeLevel2Fill } from '@salutejs/plasma-icons';
133
-
134
- export function App() {
135
- return (
136
- <div>
137
- <NumberInput
138
- value={5}
139
- size="l"
140
- incrementIcon={<IconVolumeLevel2Fill color="inherit"/>}
141
- decrementIcon={<IconVolumeLevel1Fill color="inherit"/>}
142
- width={188}
143
- />
144
- </div>
145
- );
146
- }
147
- ```
148
-
149
- ### Кастомные кнопки увеличения/уменьшения значения
150
- Можно установить собственные кнопки используя свойства `customDecrementButton` и `customIncrementButton`.
151
- В таком случае нужно определить функции по уменьшению/увелечению значения в поле.
152
-
153
- ```tsx live
154
- import React, {useState} from 'react';
155
- import { NumberInput, IconButton } from '@salutejs/{{ package }}';
156
- import { IconVolumeLevel1Fill, IconVolumeLevel2Fill } from '@salutejs/plasma-icons';
157
-
158
- export function App() {
159
- const [currentValue, setCurrentValue] = useState(0);
160
-
161
- const min = 0;
162
- const max = 10;
163
- const step = 2
164
-
165
- const handleIncrement = () => {
166
- const diffValue = Number(currentValue) + step;
167
- const resValue = currentValue >= max ? max : diffValue;
168
-
169
- setCurrentValue(resValue);
170
- };
171
-
172
- const handleDecrement = () => {
173
- const diffValue = Number(currentValue) - step;
174
- const resValue = currentValue <= min ? min : diffValue;
175
-
176
- setCurrentValue(resValue);
177
- };
178
-
179
- const CustomIncrementButton = () => (
180
- <IconButton
181
- view={currentValue !== max ? "accent" : "critical"}
182
- size="l"
183
- disabled={currentValue === max}
184
- onClick={handleIncrement}
185
- >
186
- <IconVolumeLevel2Fill color="inherit"/>
187
- </IconButton>
188
- )
189
-
190
- const CustomDecrementButton = () => (
191
- <IconButton
192
- view={currentValue !== min ? "accent" : "critical"}
193
- size="l"
194
- disabled={currentValue === min}
195
- onClick={handleDecrement}
196
- >
197
- <IconVolumeLevel1Fill color="inherit"/>
198
- </IconButton>
199
- )
200
-
201
- return (
202
- <div>
203
- <NumberInput
204
- value={currentValue}
205
- step={step}
206
- size="l"
207
- customIncrementButton={<CustomIncrementButton />}
208
- customDecrementButton={<CustomDecrementButton />}
209
- width={188}
210
- />
211
- </div>
212
- );
213
- }
214
- ```
@@ -1,93 +0,0 @@
1
- export var classes = {
2
- actionButtonDecrement: 'action-button-decrement',
3
- actionButtonDecrementDisabled: 'action-button-decrement-disabled',
4
- actionButtonIncrement: 'action-button-increment',
5
- actionButtonIncrementDisabled: 'action-button-increment-disabled',
6
- textBefore: 'text-before',
7
- textAfter: 'text-after',
8
- solidView: 'solid-view',
9
- segmentedView: 'segmented-view',
10
- clearView: 'clear-view',
11
- errorAnimation: 'error-animation',
12
- disabled: 'number-input-disabled',
13
- loading: 'number-input-loading',
14
- focused: 'number-input-focused',
15
- manualInput: 'manual-input-number-input'
16
- };
17
- export var privateTokens = {
18
- inputWidth: '--plasma_private-number-input_width',
19
- segmentationBorderRadius: '--plasma_private-segmentation-border-radius',
20
- segmentationInputBorderRadius: '--plasma_private-segmentation_input_border-radius',
21
- topBoxShadow: '--plasma_private-number-input_top-box-shadow',
22
- bottomBoxShadow: '--plasma_private-number-input_bottom-box-shadow',
23
- leftBoxShadow: '--plasma_private-number-input_left-box-shadow',
24
- rightBoxShadow: '--plasma_private-number-input_right-box-shadow'
25
- };
26
- export var tokens = {
27
- // Root size tokens
28
- rootMinWidth: '--plasma-number-input_min-width',
29
- disabledOpacity: '--plasma-number-input_disabled-opacity',
30
- rootBorderWidth: '--plasma-number-input_input-border-width',
31
- wrapperBorderColor: '--plasma-number-input_wrapper_border-color',
32
- wrapperBorderColorFocus: '--plasma-number-input_wrapper_border-color_focus',
33
- // Action button view tokens
34
- iconButtonColor: '--plasma-number-input_icon-button_color',
35
- iconButtonBackgroundColor: '--plasma-number-input_icon-button_background-color',
36
- iconButtonColorHover: '--plasma-number-input_icon-button_color-hover',
37
- iconButtonColorSolidHover: '--plasma-number-input_icon-button_color_solid-hover',
38
- iconButtonBackgroundColorHover: '--plasma-number-input_icon-button_background-color-hover',
39
- iconButtonColorActive: '--plasma-number-input_icon-button_color-active',
40
- iconButtonColorSolidActive: '--plasma-number-input_icon-button_color_solid-active',
41
- iconButtonBackgroundColorActive: '--plasma-number-input_icon-button_background-color-active',
42
- actionButtonDisabledOpacity: '--plasma-number-input_action-button_disabled-opacity',
43
- // Action button size tokens
44
- iconButtonHeight: '--plasma-number-input_icon-button_height',
45
- iconButtonWidth: '--plasma-number-input_icon-button_width',
46
- iconButtonPadding: '--plasma-number-input_icon-button_padding',
47
- iconButtonRadius: '--plasma-number-input_icon-button_radius',
48
- iconButtonSegmentationRadius: '--plasma-number-input_icon-button_segmentation_radius',
49
- iconButtonFontFamily: '--plasma-number-input_icon-button_font-family',
50
- iconButtonFontSize: '--plasma-number-input_icon-button_font-size',
51
- iconButtonFontStyle: '--plasma-number-input_icon-button_font-style',
52
- iconButtonFontWeight: '--plasma-number-input_icon-button_font-weight',
53
- iconButtonLetterSpacing: '--plasma-number-input_icon-button_letter-spacing',
54
- iconButtonLineHeight: '--plasma-number-input_icon-button_line-height',
55
- // Input size tokens
56
- inputWrapperBorderWidth: '--plasma-number-input_input-wrapper_border-width',
57
- inputWrapperMargin: '--plasma-number-input_input-wrapper_margin',
58
- inputWrapperBorderRadius: '--plasma-number-input_input-wrapper_border-radius',
59
- textWrapperHeight: '--plasma-number-input_text-wrapper_height',
60
- textWrapperPadding: '--plasma-number-input_text-wrapper_padding',
61
- fontFamily: '--plasma-number-input_font-family',
62
- fontStyle: '--plasma-number-input_font-style',
63
- fontSize: '--plasma-number-input_font-size',
64
- fontWeight: '--plasma-number-input_font-weight',
65
- letterSpacing: '--plasma-number-input_letter-spacing',
66
- lineHeight: '--plasma-number-input_line-height',
67
- textBeforeMarginRight: '--plasma-number-input_text-before_margin-right',
68
- textAfterMarginLeft: '--plasma-number-input_text-after_margin-left',
69
- // Input view tokens
70
- caretColor: '--plasma-number-input_caret_color',
71
- caretColorSolid: '--plasma-number-input_caret_color-solid',
72
- color: '--plasma-number-input_color',
73
- colorSolid: '--plasma-number-input_color-solid',
74
- backgroundColor: '--plasma-number-input_background-color',
75
- backgroundColorHover: '--plasma-number-input_background-color-hover',
76
- backgroundColorFocus: '--plasma-number-input_background-color-focus',
77
- backgroundColorSolidFocus: '--plasma-number-input_background-color-solid-focus',
78
- backgroundColorSolid: '--plasma-number-input_background-color-solid',
79
- borderColor: '--plasma-number-input_border-color',
80
- borderColorHover: '--plasma-number-input_border-color-hover',
81
- borderColorFocus: '--plasma-number-input_border-color-focus',
82
- borderColorSolidFocus: '--plasma-number-input_border-color-solid-focus',
83
- borderColorSolid: '--plasma-number-input_border-color-solid',
84
- additionalTextColor: '--plasma-number-input_additional-text_color',
85
- additionalTextColorSolid: '--plasma-number-input_additional-text_color-solid',
86
- errorColor: '--plasma-number-input_error-color',
87
- backgroundErrorColor: '--plasma-number-input_background_error-color',
88
- borderErrorColor: '--plasma-number-input_border_error-color',
89
- // Loader tokens
90
- loaderSpinnerSize: '--plasma-number-input_loader-spinner_size',
91
- loaderSpinnerColor: '--plasma-number-input_loader-spinner_color',
92
- loaderSpinnerColorSolid: '--plasma-number-input_loader-spinner_color-solid'
93
- };
@@ -1,2 +0,0 @@
1
- export { numberInputRoot, numberInputConfig } from './NumberInput';
2
- export { tokens as numberInputTokens, classes as numberInputClasses } from './NumberInput.tokens';
@@ -1,11 +0,0 @@
1
- import React from 'react';
2
- import { StyledIconButton } from './ActionButton.styles';
3
- export var ActionButton = function ActionButton(_ref) {
4
- var icon = _ref.icon,
5
- className = _ref.className,
6
- onClick = _ref.onClick;
7
- return /*#__PURE__*/React.createElement(StyledIconButton, {
8
- className: className,
9
- onClick: onClick
10
- }, icon);
11
- };