@salutejs/plasma-new-hope 0.185.0-canary.1511.11704579010.0 → 0.185.0-dev.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (276) hide show
  1. package/cjs/components/Chip/Chip.js +15 -8
  2. package/cjs/components/Chip/Chip.js.map +1 -1
  3. package/cjs/index.css +0 -23
  4. package/cjs/index.js +0 -6
  5. package/cjs/index.js.map +1 -1
  6. package/emotion/cjs/components/Chip/Chip.js +15 -8
  7. package/emotion/cjs/index.js +0 -11
  8. package/emotion/es/components/Chip/Chip.js +16 -9
  9. package/emotion/es/index.js +1 -2
  10. package/es/components/Chip/Chip.js +18 -11
  11. package/es/components/Chip/Chip.js.map +1 -1
  12. package/es/index.css +0 -23
  13. package/es/index.js +0 -2
  14. package/es/index.js.map +1 -1
  15. package/package.json +2 -2
  16. package/styled-components/cjs/components/Chip/Chip.js +15 -8
  17. package/styled-components/cjs/index.js +0 -11
  18. package/styled-components/es/components/Chip/Chip.js +16 -9
  19. package/styled-components/es/index.js +1 -2
  20. package/types/components/Chip/Chip.d.ts.map +1 -1
  21. package/types/components/Chip/Chip.types.d.ts +7 -1
  22. package/types/components/Chip/Chip.types.d.ts.map +1 -1
  23. package/types/index.d.ts +0 -1
  24. package/types/index.d.ts.map +1 -1
  25. package/cjs/components/NumberInput/NumberInput.css +0 -52
  26. package/cjs/components/NumberInput/NumberInput.js +0 -205
  27. package/cjs/components/NumberInput/NumberInput.js.map +0 -1
  28. package/cjs/components/NumberInput/NumberInput.styles.js +0 -9
  29. package/cjs/components/NumberInput/NumberInput.styles.js.map +0 -1
  30. package/cjs/components/NumberInput/NumberInput.styles_jeawjl.css +0 -1
  31. package/cjs/components/NumberInput/NumberInput.tokens.js +0 -102
  32. package/cjs/components/NumberInput/NumberInput.tokens.js.map +0 -1
  33. package/cjs/components/NumberInput/ui/ActionButton/ActionButton.js +0 -19
  34. package/cjs/components/NumberInput/ui/ActionButton/ActionButton.js.map +0 -1
  35. package/cjs/components/NumberInput/ui/ActionButton/ActionButton.styles.js +0 -22
  36. package/cjs/components/NumberInput/ui/ActionButton/ActionButton.styles.js.map +0 -1
  37. package/cjs/components/NumberInput/ui/ActionButton/ActionButton.styles_x642ct.css +0 -1
  38. package/cjs/components/NumberInput/ui/Input/Input.css +0 -15
  39. package/cjs/components/NumberInput/ui/Input/Input.js +0 -204
  40. package/cjs/components/NumberInput/ui/Input/Input.js.map +0 -1
  41. package/cjs/components/NumberInput/ui/Input/Input.styles.js +0 -96
  42. package/cjs/components/NumberInput/ui/Input/Input.styles.js.map +0 -1
  43. package/cjs/components/NumberInput/ui/Input/Input.styles_fhgb95.css +0 -8
  44. package/cjs/components/NumberInput/utils/index.js +0 -12
  45. package/cjs/components/NumberInput/utils/index.js.map +0 -1
  46. package/cjs/components/NumberInput/variations/_background-type/base.js +0 -9
  47. package/cjs/components/NumberInput/variations/_background-type/base.js.map +0 -1
  48. package/cjs/components/NumberInput/variations/_background-type/base_dx9knv.css +0 -1
  49. package/cjs/components/NumberInput/variations/_disabled/base.js +0 -9
  50. package/cjs/components/NumberInput/variations/_disabled/base.js.map +0 -1
  51. package/cjs/components/NumberInput/variations/_disabled/base_1sl0mh8.css +0 -1
  52. package/cjs/components/NumberInput/variations/_segmentation/base.js +0 -9
  53. package/cjs/components/NumberInput/variations/_segmentation/base.js.map +0 -1
  54. package/cjs/components/NumberInput/variations/_segmentation/base_14s5rot.css +0 -1
  55. package/cjs/components/NumberInput/variations/_shape/base.js +0 -9
  56. package/cjs/components/NumberInput/variations/_shape/base.js.map +0 -1
  57. package/cjs/components/NumberInput/variations/_shape/base_k05biw.css +0 -1
  58. package/cjs/components/NumberInput/variations/_size/base.js +0 -9
  59. package/cjs/components/NumberInput/variations/_size/base.js.map +0 -1
  60. package/cjs/components/NumberInput/variations/_size/base_yqdmk4.css +0 -1
  61. package/cjs/components/NumberInput/variations/_view/base.js +0 -9
  62. package/cjs/components/NumberInput/variations/_view/base.js.map +0 -1
  63. package/cjs/components/NumberInput/variations/_view/base_tnfbb5.css +0 -1
  64. package/emotion/cjs/components/NumberInput/NumberInput.js +0 -214
  65. package/emotion/cjs/components/NumberInput/NumberInput.styles.js +0 -17
  66. package/emotion/cjs/components/NumberInput/NumberInput.template-doc.mdx +0 -214
  67. package/emotion/cjs/components/NumberInput/NumberInput.tokens.js +0 -99
  68. package/emotion/cjs/components/NumberInput/NumberInput.types.js +0 -5
  69. package/emotion/cjs/components/NumberInput/index.js +0 -31
  70. package/emotion/cjs/components/NumberInput/ui/ActionButton/ActionButton.js +0 -18
  71. package/emotion/cjs/components/NumberInput/ui/ActionButton/ActionButton.styles.js +0 -16
  72. package/emotion/cjs/components/NumberInput/ui/ActionButton/ActionButton.types.js +0 -5
  73. package/emotion/cjs/components/NumberInput/ui/Input/Input.js +0 -212
  74. package/emotion/cjs/components/NumberInput/ui/Input/Input.styles.js +0 -81
  75. package/emotion/cjs/components/NumberInput/ui/Input/Input.types.js +0 -5
  76. package/emotion/cjs/components/NumberInput/ui/index.js +0 -19
  77. package/emotion/cjs/components/NumberInput/utils/index.js +0 -9
  78. package/emotion/cjs/components/NumberInput/variations/_background-type/base.js +0 -10
  79. package/emotion/cjs/components/NumberInput/variations/_background-type/tokens.json +0 -6
  80. package/emotion/cjs/components/NumberInput/variations/_disabled/base.js +0 -9
  81. package/emotion/cjs/components/NumberInput/variations/_disabled/tokens.json +0 -4
  82. package/emotion/cjs/components/NumberInput/variations/_segmentation/base.js +0 -12
  83. package/emotion/cjs/components/NumberInput/variations/_segmentation/tokens.json +0 -1
  84. package/emotion/cjs/components/NumberInput/variations/_shape/base.js +0 -11
  85. package/emotion/cjs/components/NumberInput/variations/_shape/tokens.json +0 -1
  86. package/emotion/cjs/components/NumberInput/variations/_size/base.js +0 -13
  87. package/emotion/cjs/components/NumberInput/variations/_size/tokens.json +0 -22
  88. package/emotion/cjs/components/NumberInput/variations/_view/base.js +0 -13
  89. package/emotion/cjs/components/NumberInput/variations/_view/tokens.json +0 -14
  90. package/emotion/cjs/examples/plasma_b2c/components/NumberInput/NumberInput.config.js +0 -46
  91. package/emotion/cjs/examples/plasma_b2c/components/NumberInput/NumberInput.js +0 -11
  92. package/emotion/cjs/examples/plasma_b2c/components/NumberInput/NumberInput.stories.tsx +0 -108
  93. package/emotion/cjs/examples/plasma_web/components/NumberInput/NumberInput.config.js +0 -46
  94. package/emotion/cjs/examples/plasma_web/components/NumberInput/NumberInput.js +0 -11
  95. package/emotion/cjs/examples/plasma_web/components/NumberInput/NumberInput.stories.tsx +0 -108
  96. package/emotion/es/components/NumberInput/NumberInput.js +0 -206
  97. package/emotion/es/components/NumberInput/NumberInput.styles.js +0 -11
  98. package/emotion/es/components/NumberInput/NumberInput.template-doc.mdx +0 -214
  99. package/emotion/es/components/NumberInput/NumberInput.tokens.js +0 -93
  100. package/emotion/es/components/NumberInput/NumberInput.types.js +0 -1
  101. package/emotion/es/components/NumberInput/index.js +0 -2
  102. package/emotion/es/components/NumberInput/ui/ActionButton/ActionButton.js +0 -11
  103. package/emotion/es/components/NumberInput/ui/ActionButton/ActionButton.styles.js +0 -9
  104. package/emotion/es/components/NumberInput/ui/ActionButton/ActionButton.types.js +0 -1
  105. package/emotion/es/components/NumberInput/ui/Input/Input.js +0 -203
  106. package/emotion/es/components/NumberInput/ui/Input/Input.styles.js +0 -74
  107. package/emotion/es/components/NumberInput/ui/Input/Input.types.js +0 -1
  108. package/emotion/es/components/NumberInput/ui/index.js +0 -2
  109. package/emotion/es/components/NumberInput/utils/index.js +0 -3
  110. package/emotion/es/components/NumberInput/variations/_background-type/base.js +0 -4
  111. package/emotion/es/components/NumberInput/variations/_background-type/tokens.json +0 -6
  112. package/emotion/es/components/NumberInput/variations/_disabled/base.js +0 -3
  113. package/emotion/es/components/NumberInput/variations/_disabled/tokens.json +0 -4
  114. package/emotion/es/components/NumberInput/variations/_segmentation/base.js +0 -6
  115. package/emotion/es/components/NumberInput/variations/_segmentation/tokens.json +0 -1
  116. package/emotion/es/components/NumberInput/variations/_shape/base.js +0 -5
  117. package/emotion/es/components/NumberInput/variations/_shape/tokens.json +0 -1
  118. package/emotion/es/components/NumberInput/variations/_size/base.js +0 -7
  119. package/emotion/es/components/NumberInput/variations/_size/tokens.json +0 -22
  120. package/emotion/es/components/NumberInput/variations/_view/base.js +0 -7
  121. package/emotion/es/components/NumberInput/variations/_view/tokens.json +0 -14
  122. package/emotion/es/examples/plasma_b2c/components/NumberInput/NumberInput.config.js +0 -40
  123. package/emotion/es/examples/plasma_b2c/components/NumberInput/NumberInput.js +0 -5
  124. package/emotion/es/examples/plasma_b2c/components/NumberInput/NumberInput.stories.tsx +0 -108
  125. package/emotion/es/examples/plasma_web/components/NumberInput/NumberInput.config.js +0 -40
  126. package/emotion/es/examples/plasma_web/components/NumberInput/NumberInput.js +0 -5
  127. package/emotion/es/examples/plasma_web/components/NumberInput/NumberInput.stories.tsx +0 -108
  128. package/es/components/NumberInput/NumberInput.css +0 -52
  129. package/es/components/NumberInput/NumberInput.js +0 -200
  130. package/es/components/NumberInput/NumberInput.js.map +0 -1
  131. package/es/components/NumberInput/NumberInput.styles.js +0 -5
  132. package/es/components/NumberInput/NumberInput.styles.js.map +0 -1
  133. package/es/components/NumberInput/NumberInput.styles_jeawjl.css +0 -1
  134. package/es/components/NumberInput/NumberInput.tokens.js +0 -96
  135. package/es/components/NumberInput/NumberInput.tokens.js.map +0 -1
  136. package/es/components/NumberInput/ui/ActionButton/ActionButton.js +0 -15
  137. package/es/components/NumberInput/ui/ActionButton/ActionButton.js.map +0 -1
  138. package/es/components/NumberInput/ui/ActionButton/ActionButton.styles.js +0 -18
  139. package/es/components/NumberInput/ui/ActionButton/ActionButton.styles.js.map +0 -1
  140. package/es/components/NumberInput/ui/ActionButton/ActionButton.styles_x642ct.css +0 -1
  141. package/es/components/NumberInput/ui/Input/Input.css +0 -15
  142. package/es/components/NumberInput/ui/Input/Input.js +0 -200
  143. package/es/components/NumberInput/ui/Input/Input.js.map +0 -1
  144. package/es/components/NumberInput/ui/Input/Input.styles.js +0 -85
  145. package/es/components/NumberInput/ui/Input/Input.styles.js.map +0 -1
  146. package/es/components/NumberInput/ui/Input/Input.styles_fhgb95.css +0 -8
  147. package/es/components/NumberInput/utils/index.js +0 -6
  148. package/es/components/NumberInput/utils/index.js.map +0 -1
  149. package/es/components/NumberInput/variations/_background-type/base.js +0 -5
  150. package/es/components/NumberInput/variations/_background-type/base.js.map +0 -1
  151. package/es/components/NumberInput/variations/_background-type/base_dx9knv.css +0 -1
  152. package/es/components/NumberInput/variations/_disabled/base.js +0 -5
  153. package/es/components/NumberInput/variations/_disabled/base.js.map +0 -1
  154. package/es/components/NumberInput/variations/_disabled/base_1sl0mh8.css +0 -1
  155. package/es/components/NumberInput/variations/_segmentation/base.js +0 -5
  156. package/es/components/NumberInput/variations/_segmentation/base.js.map +0 -1
  157. package/es/components/NumberInput/variations/_segmentation/base_14s5rot.css +0 -1
  158. package/es/components/NumberInput/variations/_shape/base.js +0 -5
  159. package/es/components/NumberInput/variations/_shape/base.js.map +0 -1
  160. package/es/components/NumberInput/variations/_shape/base_k05biw.css +0 -1
  161. package/es/components/NumberInput/variations/_size/base.js +0 -5
  162. package/es/components/NumberInput/variations/_size/base.js.map +0 -1
  163. package/es/components/NumberInput/variations/_size/base_yqdmk4.css +0 -1
  164. package/es/components/NumberInput/variations/_view/base.js +0 -5
  165. package/es/components/NumberInput/variations/_view/base.js.map +0 -1
  166. package/es/components/NumberInput/variations/_view/base_tnfbb5.css +0 -1
  167. package/styled-components/cjs/components/NumberInput/NumberInput.js +0 -214
  168. package/styled-components/cjs/components/NumberInput/NumberInput.styles.js +0 -8
  169. package/styled-components/cjs/components/NumberInput/NumberInput.template-doc.mdx +0 -214
  170. package/styled-components/cjs/components/NumberInput/NumberInput.tokens.js +0 -99
  171. package/styled-components/cjs/components/NumberInput/NumberInput.types.js +0 -5
  172. package/styled-components/cjs/components/NumberInput/index.js +0 -31
  173. package/styled-components/cjs/components/NumberInput/ui/ActionButton/ActionButton.js +0 -18
  174. package/styled-components/cjs/components/NumberInput/ui/ActionButton/ActionButton.styles.js +0 -15
  175. package/styled-components/cjs/components/NumberInput/ui/ActionButton/ActionButton.types.js +0 -5
  176. package/styled-components/cjs/components/NumberInput/ui/Input/Input.js +0 -212
  177. package/styled-components/cjs/components/NumberInput/ui/Input/Input.styles.js +0 -48
  178. package/styled-components/cjs/components/NumberInput/ui/Input/Input.types.js +0 -5
  179. package/styled-components/cjs/components/NumberInput/ui/index.js +0 -19
  180. package/styled-components/cjs/components/NumberInput/utils/index.js +0 -9
  181. package/styled-components/cjs/components/NumberInput/variations/_background-type/base.js +0 -10
  182. package/styled-components/cjs/components/NumberInput/variations/_background-type/tokens.json +0 -6
  183. package/styled-components/cjs/components/NumberInput/variations/_disabled/base.js +0 -9
  184. package/styled-components/cjs/components/NumberInput/variations/_disabled/tokens.json +0 -4
  185. package/styled-components/cjs/components/NumberInput/variations/_segmentation/base.js +0 -12
  186. package/styled-components/cjs/components/NumberInput/variations/_segmentation/tokens.json +0 -1
  187. package/styled-components/cjs/components/NumberInput/variations/_shape/base.js +0 -11
  188. package/styled-components/cjs/components/NumberInput/variations/_shape/tokens.json +0 -1
  189. package/styled-components/cjs/components/NumberInput/variations/_size/base.js +0 -13
  190. package/styled-components/cjs/components/NumberInput/variations/_size/tokens.json +0 -22
  191. package/styled-components/cjs/components/NumberInput/variations/_view/base.js +0 -13
  192. package/styled-components/cjs/components/NumberInput/variations/_view/tokens.json +0 -14
  193. package/styled-components/cjs/examples/plasma_b2c/components/NumberInput/NumberInput.config.js +0 -46
  194. package/styled-components/cjs/examples/plasma_b2c/components/NumberInput/NumberInput.js +0 -11
  195. package/styled-components/cjs/examples/plasma_b2c/components/NumberInput/NumberInput.stories.tsx +0 -108
  196. package/styled-components/cjs/examples/plasma_web/components/NumberInput/NumberInput.config.js +0 -46
  197. package/styled-components/cjs/examples/plasma_web/components/NumberInput/NumberInput.js +0 -11
  198. package/styled-components/cjs/examples/plasma_web/components/NumberInput/NumberInput.stories.tsx +0 -108
  199. package/styled-components/es/components/NumberInput/NumberInput.js +0 -206
  200. package/styled-components/es/components/NumberInput/NumberInput.styles.js +0 -2
  201. package/styled-components/es/components/NumberInput/NumberInput.template-doc.mdx +0 -214
  202. package/styled-components/es/components/NumberInput/NumberInput.tokens.js +0 -93
  203. package/styled-components/es/components/NumberInput/NumberInput.types.js +0 -1
  204. package/styled-components/es/components/NumberInput/index.js +0 -2
  205. package/styled-components/es/components/NumberInput/ui/ActionButton/ActionButton.js +0 -11
  206. package/styled-components/es/components/NumberInput/ui/ActionButton/ActionButton.styles.js +0 -8
  207. package/styled-components/es/components/NumberInput/ui/ActionButton/ActionButton.types.js +0 -1
  208. package/styled-components/es/components/NumberInput/ui/Input/Input.js +0 -203
  209. package/styled-components/es/components/NumberInput/ui/Input/Input.styles.js +0 -41
  210. package/styled-components/es/components/NumberInput/ui/Input/Input.types.js +0 -1
  211. package/styled-components/es/components/NumberInput/ui/index.js +0 -2
  212. package/styled-components/es/components/NumberInput/utils/index.js +0 -3
  213. package/styled-components/es/components/NumberInput/variations/_background-type/base.js +0 -4
  214. package/styled-components/es/components/NumberInput/variations/_background-type/tokens.json +0 -6
  215. package/styled-components/es/components/NumberInput/variations/_disabled/base.js +0 -3
  216. package/styled-components/es/components/NumberInput/variations/_disabled/tokens.json +0 -4
  217. package/styled-components/es/components/NumberInput/variations/_segmentation/base.js +0 -6
  218. package/styled-components/es/components/NumberInput/variations/_segmentation/tokens.json +0 -1
  219. package/styled-components/es/components/NumberInput/variations/_shape/base.js +0 -5
  220. package/styled-components/es/components/NumberInput/variations/_shape/tokens.json +0 -1
  221. package/styled-components/es/components/NumberInput/variations/_size/base.js +0 -7
  222. package/styled-components/es/components/NumberInput/variations/_size/tokens.json +0 -22
  223. package/styled-components/es/components/NumberInput/variations/_view/base.js +0 -7
  224. package/styled-components/es/components/NumberInput/variations/_view/tokens.json +0 -14
  225. package/styled-components/es/examples/plasma_b2c/components/NumberInput/NumberInput.config.js +0 -40
  226. package/styled-components/es/examples/plasma_b2c/components/NumberInput/NumberInput.js +0 -5
  227. package/styled-components/es/examples/plasma_b2c/components/NumberInput/NumberInput.stories.tsx +0 -108
  228. package/styled-components/es/examples/plasma_web/components/NumberInput/NumberInput.config.js +0 -40
  229. package/styled-components/es/examples/plasma_web/components/NumberInput/NumberInput.js +0 -5
  230. package/styled-components/es/examples/plasma_web/components/NumberInput/NumberInput.stories.tsx +0 -108
  231. package/types/components/NumberInput/NumberInput.d.ts +0 -38
  232. package/types/components/NumberInput/NumberInput.d.ts.map +0 -1
  233. package/types/components/NumberInput/NumberInput.styles.d.ts +0 -2
  234. package/types/components/NumberInput/NumberInput.styles.d.ts.map +0 -1
  235. package/types/components/NumberInput/NumberInput.tokens.d.ts +0 -88
  236. package/types/components/NumberInput/NumberInput.tokens.d.ts.map +0 -1
  237. package/types/components/NumberInput/NumberInput.types.d.ts +0 -112
  238. package/types/components/NumberInput/NumberInput.types.d.ts.map +0 -1
  239. package/types/components/NumberInput/index.d.ts +0 -3
  240. package/types/components/NumberInput/index.d.ts.map +0 -1
  241. package/types/components/NumberInput/ui/ActionButton/ActionButton.d.ts +0 -4
  242. package/types/components/NumberInput/ui/ActionButton/ActionButton.d.ts.map +0 -1
  243. package/types/components/NumberInput/ui/ActionButton/ActionButton.styles.d.ts +0 -45
  244. package/types/components/NumberInput/ui/ActionButton/ActionButton.styles.d.ts.map +0 -1
  245. package/types/components/NumberInput/ui/ActionButton/ActionButton.types.d.ts +0 -7
  246. package/types/components/NumberInput/ui/ActionButton/ActionButton.types.d.ts.map +0 -1
  247. package/types/components/NumberInput/ui/Input/Input.d.ts +0 -19
  248. package/types/components/NumberInput/ui/Input/Input.d.ts.map +0 -1
  249. package/types/components/NumberInput/ui/Input/Input.styles.d.ts +0 -30
  250. package/types/components/NumberInput/ui/Input/Input.styles.d.ts.map +0 -1
  251. package/types/components/NumberInput/ui/Input/Input.types.d.ts +0 -19
  252. package/types/components/NumberInput/ui/Input/Input.types.d.ts.map +0 -1
  253. package/types/components/NumberInput/ui/index.d.ts +0 -3
  254. package/types/components/NumberInput/ui/index.d.ts.map +0 -1
  255. package/types/components/NumberInput/utils/index.d.ts +0 -4
  256. package/types/components/NumberInput/utils/index.d.ts.map +0 -1
  257. package/types/components/NumberInput/variations/_background-type/base.d.ts +0 -2
  258. package/types/components/NumberInput/variations/_background-type/base.d.ts.map +0 -1
  259. package/types/components/NumberInput/variations/_disabled/base.d.ts +0 -2
  260. package/types/components/NumberInput/variations/_disabled/base.d.ts.map +0 -1
  261. package/types/components/NumberInput/variations/_segmentation/base.d.ts +0 -2
  262. package/types/components/NumberInput/variations/_segmentation/base.d.ts.map +0 -1
  263. package/types/components/NumberInput/variations/_shape/base.d.ts +0 -2
  264. package/types/components/NumberInput/variations/_shape/base.d.ts.map +0 -1
  265. package/types/components/NumberInput/variations/_size/base.d.ts +0 -2
  266. package/types/components/NumberInput/variations/_size/base.d.ts.map +0 -1
  267. package/types/components/NumberInput/variations/_view/base.d.ts +0 -2
  268. package/types/components/NumberInput/variations/_view/base.d.ts.map +0 -1
  269. package/types/examples/plasma_b2c/components/NumberInput/NumberInput.config.d.ts +0 -39
  270. package/types/examples/plasma_b2c/components/NumberInput/NumberInput.config.d.ts.map +0 -1
  271. package/types/examples/plasma_b2c/components/NumberInput/NumberInput.d.ts +0 -82
  272. package/types/examples/plasma_b2c/components/NumberInput/NumberInput.d.ts.map +0 -1
  273. package/types/examples/plasma_web/components/NumberInput/NumberInput.config.d.ts +0 -39
  274. package/types/examples/plasma_web/components/NumberInput/NumberInput.config.d.ts.map +0 -1
  275. package/types/examples/plasma_web/components/NumberInput/NumberInput.d.ts +0 -82
  276. package/types/examples/plasma_web/components/NumberInput/NumberInput.d.ts.map +0 -1
@@ -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_b2c/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,46 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.config = void 0;
7
- var _styledComponents = /*#__PURE__*/require("styled-components");
8
- var _NumberInput = /*#__PURE__*/require("../../../../components/NumberInput");
9
- var config = exports.config = {
10
- defaults: {
11
- view: 'default',
12
- size: 'l',
13
- shape: 'cornered',
14
- inputBackgroundType: 'fill'
15
- },
16
- variations: {
17
- view: {
18
- "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-accent);", ":var(--text-negative);", ":var(--surface-negative);", ":var(--text-primary);", ":var(--inverse-text-primary);", ":var(--text-tertiary);", ":var(--inverse-text-tertiary);", ":var(--surface-accent);", ":var(--surface-accent);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--inverse-text-primary-hover);", ":var(--surface-solid-default-hover);", ":var(--inverse-text-primary);", ":var(--inverse-text-primary-active);", ":var(--surface-solid-default-active);", ":0.4;", ":inherit;", ":inherit;"], _NumberInput.numberInputTokens.caretColor, _NumberInput.numberInputTokens.errorColor, _NumberInput.numberInputTokens.borderErrorColor, _NumberInput.numberInputTokens.color, _NumberInput.numberInputTokens.colorSolid, _NumberInput.numberInputTokens.additionalTextColor, _NumberInput.numberInputTokens.additionalTextColorSolid, _NumberInput.numberInputTokens.borderColorFocus, _NumberInput.numberInputTokens.borderColorSolidFocus, _NumberInput.numberInputTokens.backgroundColorSolid, _NumberInput.numberInputTokens.iconButtonColor, _NumberInput.numberInputTokens.iconButtonBackgroundColor, _NumberInput.numberInputTokens.iconButtonColorHover, _NumberInput.numberInputTokens.iconButtonColorSolidHover, _NumberInput.numberInputTokens.iconButtonBackgroundColorHover, _NumberInput.numberInputTokens.iconButtonColorActive, _NumberInput.numberInputTokens.iconButtonColorSolidActive, _NumberInput.numberInputTokens.iconButtonBackgroundColorActive, _NumberInput.numberInputTokens.actionButtonDisabledOpacity, _NumberInput.numberInputTokens.loaderSpinnerColor, _NumberInput.numberInputTokens.loaderSpinnerColorSolid),
19
- secondary: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-accent);", ":var(--text-negative);", ":var(--surface-negative);", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--surface-accent);", ":var(--surface-accent);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--text-primary-hover);", ":var(--surface-transparent-secondary-hover);", ":var(--text-primary);", ":var(--text-primary-active);", ":var(--surface-transparent-secondary-active);", ":0.4;", ":inherit;", ":inherit;"], _NumberInput.numberInputTokens.caretColor, _NumberInput.numberInputTokens.errorColor, _NumberInput.numberInputTokens.borderErrorColor, _NumberInput.numberInputTokens.color, _NumberInput.numberInputTokens.colorSolid, _NumberInput.numberInputTokens.additionalTextColor, _NumberInput.numberInputTokens.additionalTextColorSolid, _NumberInput.numberInputTokens.borderColorFocus, _NumberInput.numberInputTokens.borderColorSolidFocus, _NumberInput.numberInputTokens.backgroundColorSolid, _NumberInput.numberInputTokens.iconButtonColor, _NumberInput.numberInputTokens.iconButtonBackgroundColor, _NumberInput.numberInputTokens.iconButtonColorHover, _NumberInput.numberInputTokens.iconButtonColorSolidHover, _NumberInput.numberInputTokens.iconButtonBackgroundColorHover, _NumberInput.numberInputTokens.iconButtonColorActive, _NumberInput.numberInputTokens.iconButtonColorSolidActive, _NumberInput.numberInputTokens.iconButtonBackgroundColorActive, _NumberInput.numberInputTokens.actionButtonDisabledOpacity, _NumberInput.numberInputTokens.loaderSpinnerColor, _NumberInput.numberInputTokens.loaderSpinnerColorSolid),
20
- accent: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-accent);", ":var(--inverse-text-primary);", ":var(--text-negative);", ":var(--surface-negative);", ":var(--text-primary);", ":var(--inverse-text-primary);", ":var(--text-tertiary);", ":var(--inverse-text-tertiary);", ":var(--surface-accent);", ":var(--light-background-primary);", ":var(--surface-accent);", ":var(--inverse-text-primary);", ":var(--surface-accent);", ":var(--inverse-text-primary);", ":var(--inverse-text-primary-hover);", ":var(--surface-accent-hover);", ":var(--inverse-text-primary);", ":var(--inverse-text-primary-active);", ":var(--surface-accent-active);", ":0.4;", ":inherit;", ":inherit;"], _NumberInput.numberInputTokens.caretColor, _NumberInput.numberInputTokens.caretColorSolid, _NumberInput.numberInputTokens.errorColor, _NumberInput.numberInputTokens.borderErrorColor, _NumberInput.numberInputTokens.color, _NumberInput.numberInputTokens.colorSolid, _NumberInput.numberInputTokens.additionalTextColor, _NumberInput.numberInputTokens.additionalTextColorSolid, _NumberInput.numberInputTokens.borderColorFocus, _NumberInput.numberInputTokens.borderColorSolidFocus, _NumberInput.numberInputTokens.backgroundColorSolid, _NumberInput.numberInputTokens.iconButtonColor, _NumberInput.numberInputTokens.iconButtonBackgroundColor, _NumberInput.numberInputTokens.iconButtonColorHover, _NumberInput.numberInputTokens.iconButtonColorSolidHover, _NumberInput.numberInputTokens.iconButtonBackgroundColorHover, _NumberInput.numberInputTokens.iconButtonColorActive, _NumberInput.numberInputTokens.iconButtonColorSolidActive, _NumberInput.numberInputTokens.iconButtonBackgroundColorActive, _NumberInput.numberInputTokens.actionButtonDisabledOpacity, _NumberInput.numberInputTokens.loaderSpinnerColor, _NumberInput.numberInputTokens.loaderSpinnerColorSolid),
21
- clear: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-accent);", ":var(--text-negative);", ":var(--surface-negative);", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--surface-accent);", ":var(--surface-accent);", ":transparent;", ":var(--text-primary);", ":transparent;", ":var(--text-primary);", ":var(--text-primary-hover);", ":transparent;", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":transparent;", ":0.4;", ":inherit;", ":inherit;"], _NumberInput.numberInputTokens.caretColor, _NumberInput.numberInputTokens.errorColor, _NumberInput.numberInputTokens.borderErrorColor, _NumberInput.numberInputTokens.color, _NumberInput.numberInputTokens.colorSolid, _NumberInput.numberInputTokens.additionalTextColor, _NumberInput.numberInputTokens.additionalTextColorSolid, _NumberInput.numberInputTokens.borderColorFocus, _NumberInput.numberInputTokens.borderColorSolidFocus, _NumberInput.numberInputTokens.backgroundColorSolid, _NumberInput.numberInputTokens.iconButtonColor, _NumberInput.numberInputTokens.iconButtonBackgroundColor, _NumberInput.numberInputTokens.iconButtonColorHover, _NumberInput.numberInputTokens.iconButtonColorSolidHover, _NumberInput.numberInputTokens.iconButtonBackgroundColorHover, _NumberInput.numberInputTokens.iconButtonColorActive, _NumberInput.numberInputTokens.backgroundColorFocus, _NumberInput.numberInputTokens.iconButtonBackgroundColorActive, _NumberInput.numberInputTokens.actionButtonDisabledOpacity, _NumberInput.numberInputTokens.loaderSpinnerColor, _NumberInput.numberInputTokens.loaderSpinnerColorSolid)
22
- },
23
- size: {
24
- l: /*#__PURE__*/(0, _styledComponents.css)(["", ":11.75rem;", ":3.5rem;", ":3.5rem;", ":1.5rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-bold-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":0.875rem;", ":0.375rem;", ":0 0.125rem;", ":0.875rem;", ":3.5rem;", ":0.063rem;", ":1.063rem 1.125rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":0.25rem;", ":0.25rem;", ":1.375rem;"], _NumberInput.numberInputTokens.rootMinWidth, _NumberInput.numberInputTokens.iconButtonHeight, _NumberInput.numberInputTokens.iconButtonWidth, _NumberInput.numberInputTokens.iconButtonPadding, _NumberInput.numberInputTokens.iconButtonFontFamily, _NumberInput.numberInputTokens.iconButtonFontSize, _NumberInput.numberInputTokens.iconButtonFontStyle, _NumberInput.numberInputTokens.iconButtonFontWeight, _NumberInput.numberInputTokens.iconButtonLetterSpacing, _NumberInput.numberInputTokens.iconButtonLineHeight, _NumberInput.numberInputTokens.iconButtonRadius, _NumberInput.numberInputTokens.iconButtonSegmentationRadius, _NumberInput.numberInputTokens.inputWrapperMargin, _NumberInput.numberInputTokens.inputWrapperBorderRadius, _NumberInput.numberInputTokens.textWrapperHeight, _NumberInput.numberInputTokens.inputWrapperBorderWidth, _NumberInput.numberInputTokens.textWrapperPadding, _NumberInput.numberInputTokens.fontFamily, _NumberInput.numberInputTokens.fontSize, _NumberInput.numberInputTokens.fontStyle, _NumberInput.numberInputTokens.fontWeight, _NumberInput.numberInputTokens.letterSpacing, _NumberInput.numberInputTokens.lineHeight, _NumberInput.numberInputTokens.textBeforeMarginRight, _NumberInput.numberInputTokens.textAfterMarginLeft, _NumberInput.numberInputTokens.loaderSpinnerSize),
25
- m: /*#__PURE__*/(0, _styledComponents.css)(["", ":10.25rem;", ":3rem;", ":3rem;", ":1.25rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-bold-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":0.75rem;", ":0.25rem;", ":0 0.125rem;", ":0.75rem;", ":3rem;", ":0.063rem;", ":0.875rem 1rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":0.25rem;", ":0.25rem;", ":1.375rem;"], _NumberInput.numberInputTokens.rootMinWidth, _NumberInput.numberInputTokens.iconButtonHeight, _NumberInput.numberInputTokens.iconButtonWidth, _NumberInput.numberInputTokens.iconButtonPadding, _NumberInput.numberInputTokens.iconButtonFontFamily, _NumberInput.numberInputTokens.iconButtonFontSize, _NumberInput.numberInputTokens.iconButtonFontStyle, _NumberInput.numberInputTokens.iconButtonFontWeight, _NumberInput.numberInputTokens.iconButtonLetterSpacing, _NumberInput.numberInputTokens.iconButtonLineHeight, _NumberInput.numberInputTokens.iconButtonRadius, _NumberInput.numberInputTokens.iconButtonSegmentationRadius, _NumberInput.numberInputTokens.inputWrapperMargin, _NumberInput.numberInputTokens.inputWrapperBorderRadius, _NumberInput.numberInputTokens.textWrapperHeight, _NumberInput.numberInputTokens.inputWrapperBorderWidth, _NumberInput.numberInputTokens.textWrapperPadding, _NumberInput.numberInputTokens.fontFamily, _NumberInput.numberInputTokens.fontSize, _NumberInput.numberInputTokens.fontStyle, _NumberInput.numberInputTokens.fontWeight, _NumberInput.numberInputTokens.letterSpacing, _NumberInput.numberInputTokens.lineHeight, _NumberInput.numberInputTokens.textBeforeMarginRight, _NumberInput.numberInputTokens.textAfterMarginLeft, _NumberInput.numberInputTokens.loaderSpinnerSize),
26
- s: /*#__PURE__*/(0, _styledComponents.css)(["", ":8.75rem;", ":2.5rem;", ":2.5rem;", ":1rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-bold-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":0.625rem;", ":0.25rem;", ":0 0.125rem;", ":0.625rem;", ":2.5rem;", ":0.063rem;", ":0.688rem 0.875rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":0.25rem;", ":0.25rem;", ":1.375rem;"], _NumberInput.numberInputTokens.rootMinWidth, _NumberInput.numberInputTokens.iconButtonHeight, _NumberInput.numberInputTokens.iconButtonWidth, _NumberInput.numberInputTokens.iconButtonPadding, _NumberInput.numberInputTokens.iconButtonFontFamily, _NumberInput.numberInputTokens.iconButtonFontSize, _NumberInput.numberInputTokens.iconButtonFontStyle, _NumberInput.numberInputTokens.iconButtonFontWeight, _NumberInput.numberInputTokens.iconButtonLetterSpacing, _NumberInput.numberInputTokens.iconButtonLineHeight, _NumberInput.numberInputTokens.iconButtonRadius, _NumberInput.numberInputTokens.iconButtonSegmentationRadius, _NumberInput.numberInputTokens.inputWrapperMargin, _NumberInput.numberInputTokens.inputWrapperBorderRadius, _NumberInput.numberInputTokens.textWrapperHeight, _NumberInput.numberInputTokens.inputWrapperBorderWidth, _NumberInput.numberInputTokens.textWrapperPadding, _NumberInput.numberInputTokens.fontFamily, _NumberInput.numberInputTokens.fontSize, _NumberInput.numberInputTokens.fontStyle, _NumberInput.numberInputTokens.fontWeight, _NumberInput.numberInputTokens.letterSpacing, _NumberInput.numberInputTokens.lineHeight, _NumberInput.numberInputTokens.textBeforeMarginRight, _NumberInput.numberInputTokens.textAfterMarginLeft, _NumberInput.numberInputTokens.loaderSpinnerSize),
27
- xs: /*#__PURE__*/(0, _styledComponents.css)(["", ":6.875rem;", ":2rem;", ":2rem;", ":0.75rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":0.5rem;", ":0.125rem;", ":0 0.125rem;", ":0.5rem;", ":2rem;", ":0.063rem;", ":0.563rem 0.625rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":0.25rem;", ":0.25rem;", ":1rem;"], _NumberInput.numberInputTokens.rootMinWidth, _NumberInput.numberInputTokens.iconButtonHeight, _NumberInput.numberInputTokens.iconButtonWidth, _NumberInput.numberInputTokens.iconButtonPadding, _NumberInput.numberInputTokens.iconButtonFontFamily, _NumberInput.numberInputTokens.iconButtonFontSize, _NumberInput.numberInputTokens.iconButtonFontStyle, _NumberInput.numberInputTokens.iconButtonFontWeight, _NumberInput.numberInputTokens.iconButtonLetterSpacing, _NumberInput.numberInputTokens.iconButtonLineHeight, _NumberInput.numberInputTokens.iconButtonRadius, _NumberInput.numberInputTokens.iconButtonSegmentationRadius, _NumberInput.numberInputTokens.inputWrapperMargin, _NumberInput.numberInputTokens.inputWrapperBorderRadius, _NumberInput.numberInputTokens.textWrapperHeight, _NumberInput.numberInputTokens.inputWrapperBorderWidth, _NumberInput.numberInputTokens.textWrapperPadding, _NumberInput.numberInputTokens.fontFamily, _NumberInput.numberInputTokens.fontSize, _NumberInput.numberInputTokens.fontStyle, _NumberInput.numberInputTokens.fontWeight, _NumberInput.numberInputTokens.letterSpacing, _NumberInput.numberInputTokens.lineHeight, _NumberInput.numberInputTokens.textBeforeMarginRight, _NumberInput.numberInputTokens.textAfterMarginLeft, _NumberInput.numberInputTokens.loaderSpinnerSize)
28
- },
29
- shape: {
30
- cornered: /*#__PURE__*/(0, _styledComponents.css)([""]),
31
- pilled: /*#__PURE__*/(0, _styledComponents.css)(["", ":50%;"], _NumberInput.numberInputTokens.iconButtonRadius)
32
- },
33
- inputBackgroundType: {
34
- fill: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--surface-transparent-tertiary);", ":var(--text-secondary);"], _NumberInput.numberInputTokens.borderColor, _NumberInput.numberInputTokens.borderColorHover),
35
- clear: /*#__PURE__*/(0, _styledComponents.css)(["", ":transparent;", ":transparent;"], _NumberInput.numberInputTokens.borderColor, _NumberInput.numberInputTokens.borderColorHover)
36
- },
37
- segmentation: {
38
- "default": /*#__PURE__*/(0, _styledComponents.css)([""]),
39
- segmented: /*#__PURE__*/(0, _styledComponents.css)([""]),
40
- solid: /*#__PURE__*/(0, _styledComponents.css)(["", ":0;"], _NumberInput.numberInputTokens.iconButtonSegmentationRadius)
41
- },
42
- disabled: {
43
- "true": /*#__PURE__*/(0, _styledComponents.css)(["", ":0.4;"], _NumberInput.numberInputTokens.disabledOpacity)
44
- }
45
- }
46
- };
@@ -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,206 +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
- if (isLoading || disabled || isAnimationRun) {
91
- return;
92
- }
93
- var diffValue = Number(innerValue) - step;
94
- var resValue = min !== undefined && diffValue <= min ? min : diffValue;
95
- setInnerValue(resValue);
96
- if (onDecrement) {
97
- onDecrement(resValue);
98
- }
99
- if (onChange) {
100
- onChange(null, resValue);
101
- }
102
- };
103
- var handleIncrement = function handleIncrement() {
104
- if (isLoading || disabled || isAnimationRun) {
105
- return;
106
- }
107
- var diffValue = Number(innerValue) + step;
108
- var resValue = max !== undefined && diffValue >= max ? max : diffValue;
109
- setInnerValue(resValue);
110
- if (onIncrement) {
111
- onIncrement(resValue);
112
- }
113
- if (onChange) {
114
- onChange(null, resValue);
115
- }
116
- };
117
- useEffect(function () {
118
- if (value === undefined || !isNumber(value)) {
119
- return;
120
- }
121
- setInnerValue(function (prevValue) {
122
- return prevValue !== value ? value : prevValue;
123
- });
124
- }, [value]);
125
- return /*#__PURE__*/React.createElement(Root, _extends({
126
- view: view,
127
- size: size,
128
- disabled: disabled,
129
- clear: clear,
130
- shape: shape,
131
- segmentation: segmentation,
132
- isLoading: isLoading
133
- }, segmentation === 'solid' ? {
134
- inputBackgroundType: 'clear'
135
- } : {
136
- inputBackgroundType: inputBackgroundType
137
- }, {
138
- className: cx(className, solidViewClass, segmentedViewClass, clearViewClass, disabledClass, loadingClass, focusedClass),
139
- style: _objectSpread(_objectSpread({}, style), {}, _defineProperty({}, privateTokens.inputWidth, innerWidth))
140
- }), customDecrementButton || /*#__PURE__*/React.createElement(ActionButton, {
141
- className: cx(classes.actionButtonDecrement, decrementButtonDisabled, solidViewClass, segmentedViewClass),
142
- icon: decrementIcon || /*#__PURE__*/React.createElement(IconMinus, {
143
- color: "inherit",
144
- size: actionIconSize
145
- }),
146
- onClick: handleDecrement
147
- }), /*#__PURE__*/React.createElement(NumberInput, _extends({
148
- ref: ref,
149
- segmentation: segmentation,
150
- value: innerValue,
151
- min: min,
152
- max: max,
153
- isManualInput: isManualInput,
154
- textBefore: textBefore,
155
- textAfter: textAfter,
156
- isLoading: isLoading,
157
- loader: loader,
158
- disabled: disabled,
159
- isInputFocused: isInputFocused,
160
- setIsInputFocused: setIsInputFocused,
161
- setIsAnimationRun: setIsAnimationRun,
162
- setInnerValue: setInnerValue,
163
- onChange: onChange
164
- }, rest)), customIncrementButton || /*#__PURE__*/React.createElement(ActionButton, {
165
- className: cx(classes.actionButtonIncrement, incrementButtonDisabled, solidViewClass, segmentedViewClass),
166
- icon: incrementIcon || /*#__PURE__*/React.createElement(IconPlus, {
167
- color: "inherit",
168
- size: actionIconSize
169
- }),
170
- onClick: handleIncrement
171
- }));
172
- });
173
- };
174
- export var numberInputConfig = {
175
- name: 'NumberInput',
176
- tag: 'div',
177
- layout: numberInputRoot,
178
- base: base,
179
- variations: {
180
- view: {
181
- css: viewCSS
182
- },
183
- size: {
184
- css: sizeCSS
185
- },
186
- shape: {
187
- css: shapeCSS
188
- },
189
- inputBackgroundType: {
190
- css: inputBackgroundTypeCSS
191
- },
192
- segmentation: {
193
- css: segmentationCSS
194
- },
195
- disabled: {
196
- css: disabledCSS,
197
- attrs: true
198
- }
199
- },
200
- defaults: {
201
- view: 'default',
202
- size: 'l',
203
- shape: 'cornered',
204
- segmentation: 'default'
205
- }
206
- };
@@ -1,2 +0,0 @@
1
- import { css } from 'styled-components';
2
- export var base = /*#__PURE__*/css(["display:flex;align-items:center;"]);