@salutejs/plasma-new-hope 0.81.0-canary.1208.9111977682.0 → 0.81.1-canary.1209.9113456949.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (194) hide show
  1. package/cjs/components/TextField/TextField.js +4 -10
  2. package/cjs/components/TextField/TextField.js.map +1 -1
  3. package/cjs/components/TextField/TextField.styles.js +1 -13
  4. package/cjs/components/TextField/TextField.styles.js.map +1 -1
  5. package/cjs/components/TextField/{TextField.styles_aqmut.css → TextField.styles_1b1mddp.css} +0 -2
  6. package/cjs/components/TextField/TextField.tokens.js +0 -5
  7. package/cjs/components/TextField/TextField.tokens.js.map +1 -1
  8. package/cjs/components/TextField/variations/_label-placement/inner.js +1 -1
  9. package/cjs/components/TextField/variations/_label-placement/inner.js.map +1 -1
  10. package/cjs/components/TextField/variations/_label-placement/inner_gqlcj2.css +1 -0
  11. package/cjs/components/TextField/variations/_size/base.js +1 -1
  12. package/cjs/components/TextField/variations/_size/base.js.map +1 -1
  13. package/cjs/components/TextField/variations/_size/{base_ntoddv.css → base_1khzr9t.css} +1 -1
  14. package/cjs/components/TextField/variations/_view/base.js +1 -1
  15. package/cjs/components/TextField/variations/_view/base.js.map +1 -1
  16. package/cjs/components/TextField/variations/_view/{base_19gxyva.css → base_1qd77x6.css} +1 -1
  17. package/cjs/index.css +9 -28
  18. package/cjs/index.js +0 -5
  19. package/cjs/index.js.map +1 -1
  20. package/es/components/TextField/TextField.js +5 -11
  21. package/es/components/TextField/TextField.js.map +1 -1
  22. package/es/components/TextField/TextField.styles.js +2 -12
  23. package/es/components/TextField/TextField.styles.js.map +1 -1
  24. package/es/components/TextField/{TextField.styles_aqmut.css → TextField.styles_1b1mddp.css} +0 -2
  25. package/es/components/TextField/TextField.tokens.js +0 -5
  26. package/es/components/TextField/TextField.tokens.js.map +1 -1
  27. package/es/components/TextField/variations/_label-placement/inner.js +1 -1
  28. package/es/components/TextField/variations/_label-placement/inner.js.map +1 -1
  29. package/es/components/TextField/variations/_label-placement/inner_gqlcj2.css +1 -0
  30. package/es/components/TextField/variations/_size/base.js +1 -1
  31. package/es/components/TextField/variations/_size/base.js.map +1 -1
  32. package/es/components/TextField/variations/_size/{base_ntoddv.css → base_1khzr9t.css} +1 -1
  33. package/es/components/TextField/variations/_view/base.js +1 -1
  34. package/es/components/TextField/variations/_view/base.js.map +1 -1
  35. package/es/components/TextField/variations/_view/{base_19gxyva.css → base_1qd77x6.css} +1 -1
  36. package/es/index.css +9 -28
  37. package/es/index.js +0 -2
  38. package/es/index.js.map +1 -1
  39. package/package.json +4 -4
  40. package/styled-components/cjs/components/TextField/TextField.js +4 -10
  41. package/styled-components/cjs/components/TextField/TextField.styles.js +1 -7
  42. package/styled-components/cjs/components/TextField/TextField.tokens.js +0 -5
  43. package/styled-components/cjs/components/TextField/variations/_label-placement/inner.js +1 -1
  44. package/styled-components/cjs/components/TextField/variations/_size/base.js +1 -1
  45. package/styled-components/cjs/components/TextField/variations/_view/base.js +1 -1
  46. package/styled-components/cjs/examples/plasma_b2c/components/TextArea/TextArea.config.js +4 -4
  47. package/styled-components/cjs/examples/plasma_b2c/components/TextField/TextField.config.js +8 -8
  48. package/styled-components/cjs/examples/plasma_b2c/components/TextField/TextField.stories.tsx +0 -2
  49. package/styled-components/cjs/examples/plasma_web/components/TextArea/TextArea.config.js +4 -4
  50. package/styled-components/cjs/index.js +0 -11
  51. package/styled-components/es/components/TextField/TextField.js +5 -11
  52. package/styled-components/es/components/TextField/TextField.styles.js +0 -6
  53. package/styled-components/es/components/TextField/TextField.tokens.js +0 -5
  54. package/styled-components/es/components/TextField/variations/_label-placement/inner.js +2 -2
  55. package/styled-components/es/components/TextField/variations/_size/base.js +2 -2
  56. package/styled-components/es/components/TextField/variations/_view/base.js +2 -2
  57. package/styled-components/es/examples/plasma_b2c/components/TextArea/TextArea.config.js +4 -4
  58. package/styled-components/es/examples/plasma_b2c/components/TextField/TextField.config.js +8 -8
  59. package/styled-components/es/examples/plasma_b2c/components/TextField/TextField.stories.tsx +0 -2
  60. package/styled-components/es/examples/plasma_web/components/TextArea/TextArea.config.js +4 -4
  61. package/styled-components/es/index.js +1 -2
  62. package/types/components/TextField/TextField.d.ts.map +1 -1
  63. package/types/components/TextField/TextField.styles.d.ts +0 -2
  64. package/types/components/TextField/TextField.styles.d.ts.map +1 -1
  65. package/types/components/TextField/TextField.tokens.d.ts +0 -5
  66. package/types/components/TextField/TextField.tokens.d.ts.map +1 -1
  67. package/types/components/TextField/TextField.types.d.ts +0 -8
  68. package/types/components/TextField/TextField.types.d.ts.map +1 -1
  69. package/types/components/TextField/variations/_label-placement/inner.d.ts.map +1 -1
  70. package/types/components/TextField/variations/_size/base.d.ts.map +1 -1
  71. package/types/components/TextField/variations/_view/base.d.ts.map +1 -1
  72. package/types/examples/plasma_b2c/components/TextField/TextField.config.d.ts.map +1 -1
  73. package/types/examples/plasma_b2c/components/TextField/TextField.d.ts +0 -4
  74. package/types/examples/plasma_b2c/components/TextField/TextField.d.ts.map +1 -1
  75. package/types/examples/plasma_web/components/TextField/TextField.d.ts +0 -4
  76. package/types/examples/plasma_web/components/TextField/TextField.d.ts.map +1 -1
  77. package/types/examples/sds_engineer/components/TextField/TextField.d.ts +0 -4
  78. package/types/examples/sds_engineer/components/TextField/TextField.d.ts.map +1 -1
  79. package/types/index.d.ts +0 -1
  80. package/types/index.d.ts.map +1 -1
  81. package/cjs/components/Range/Range.css +0 -63
  82. package/cjs/components/Range/Range.js +0 -146
  83. package/cjs/components/Range/Range.js.map +0 -1
  84. package/cjs/components/Range/Range.styles.js +0 -63
  85. package/cjs/components/Range/Range.styles.js.map +0 -1
  86. package/cjs/components/Range/Range.styles_mc4w65.css +0 -8
  87. package/cjs/components/Range/Range.tokens.js +0 -105
  88. package/cjs/components/Range/Range.tokens.js.map +0 -1
  89. package/cjs/components/Range/utils/index.js +0 -24
  90. package/cjs/components/Range/utils/index.js.map +0 -1
  91. package/cjs/components/Range/variations/_disabled/base.js +0 -9
  92. package/cjs/components/Range/variations/_disabled/base.js.map +0 -1
  93. package/cjs/components/Range/variations/_disabled/base_1ufizo4.css +0 -1
  94. package/cjs/components/Range/variations/_readonly/base.js +0 -9
  95. package/cjs/components/Range/variations/_readonly/base.js.map +0 -1
  96. package/cjs/components/Range/variations/_readonly/base_hzmd8h.css +0 -1
  97. package/cjs/components/Range/variations/_size/base.js +0 -9
  98. package/cjs/components/Range/variations/_size/base.js.map +0 -1
  99. package/cjs/components/Range/variations/_size/base_f8ah3.css +0 -1
  100. package/cjs/components/Range/variations/_view/base.js +0 -9
  101. package/cjs/components/Range/variations/_view/base.js.map +0 -1
  102. package/cjs/components/Range/variations/_view/base_5iz3nr.css +0 -1
  103. package/cjs/components/TextField/variations/_label-placement/inner_7c08qb.css +0 -1
  104. package/es/components/Range/Range.css +0 -63
  105. package/es/components/Range/Range.js +0 -141
  106. package/es/components/Range/Range.js.map +0 -1
  107. package/es/components/Range/Range.styles.js +0 -52
  108. package/es/components/Range/Range.styles.js.map +0 -1
  109. package/es/components/Range/Range.styles_mc4w65.css +0 -8
  110. package/es/components/Range/Range.tokens.js +0 -100
  111. package/es/components/Range/Range.tokens.js.map +0 -1
  112. package/es/components/Range/utils/index.js +0 -19
  113. package/es/components/Range/utils/index.js.map +0 -1
  114. package/es/components/Range/variations/_disabled/base.js +0 -5
  115. package/es/components/Range/variations/_disabled/base.js.map +0 -1
  116. package/es/components/Range/variations/_disabled/base_1ufizo4.css +0 -1
  117. package/es/components/Range/variations/_readonly/base.js +0 -5
  118. package/es/components/Range/variations/_readonly/base.js.map +0 -1
  119. package/es/components/Range/variations/_readonly/base_hzmd8h.css +0 -1
  120. package/es/components/Range/variations/_size/base.js +0 -5
  121. package/es/components/Range/variations/_size/base.js.map +0 -1
  122. package/es/components/Range/variations/_size/base_f8ah3.css +0 -1
  123. package/es/components/Range/variations/_view/base.js +0 -5
  124. package/es/components/Range/variations/_view/base.js.map +0 -1
  125. package/es/components/Range/variations/_view/base_5iz3nr.css +0 -1
  126. package/es/components/TextField/variations/_label-placement/inner_7c08qb.css +0 -1
  127. package/styled-components/cjs/components/Range/Range.js +0 -148
  128. package/styled-components/cjs/components/Range/Range.styles.js +0 -39
  129. package/styled-components/cjs/components/Range/Range.tokens.js +0 -103
  130. package/styled-components/cjs/components/Range/Range.types.js +0 -5
  131. package/styled-components/cjs/components/Range/index.js +0 -25
  132. package/styled-components/cjs/components/Range/utils/index.js +0 -22
  133. package/styled-components/cjs/components/Range/variations/_disabled/base.js +0 -9
  134. package/styled-components/cjs/components/Range/variations/_disabled/tokens.json +0 -4
  135. package/styled-components/cjs/components/Range/variations/_readonly/base.js +0 -10
  136. package/styled-components/cjs/components/Range/variations/_readonly/tokens.json +0 -4
  137. package/styled-components/cjs/components/Range/variations/_size/base.js +0 -10
  138. package/styled-components/cjs/components/Range/variations/_size/tokens.json +0 -26
  139. package/styled-components/cjs/components/Range/variations/_view/base.js +0 -10
  140. package/styled-components/cjs/components/Range/variations/_view/tokens.json +0 -6
  141. package/styled-components/cjs/examples/plasma_b2c/components/Range/Range.config.js +0 -31
  142. package/styled-components/cjs/examples/plasma_b2c/components/Range/Range.js +0 -11
  143. package/styled-components/cjs/examples/plasma_b2c/components/Range/Range.stories.tsx +0 -312
  144. package/styled-components/cjs/examples/plasma_web/components/Range/Range.config.js +0 -31
  145. package/styled-components/cjs/examples/plasma_web/components/Range/Range.js +0 -11
  146. package/styled-components/cjs/examples/plasma_web/components/Range/Range.stories.tsx +0 -312
  147. package/styled-components/es/components/Range/Range.js +0 -139
  148. package/styled-components/es/components/Range/Range.styles.js +0 -31
  149. package/styled-components/es/components/Range/Range.tokens.js +0 -97
  150. package/styled-components/es/components/Range/Range.types.js +0 -1
  151. package/styled-components/es/components/Range/index.js +0 -2
  152. package/styled-components/es/components/Range/utils/index.js +0 -16
  153. package/styled-components/es/components/Range/variations/_disabled/base.js +0 -3
  154. package/styled-components/es/components/Range/variations/_disabled/tokens.json +0 -4
  155. package/styled-components/es/components/Range/variations/_readonly/base.js +0 -4
  156. package/styled-components/es/components/Range/variations/_readonly/tokens.json +0 -4
  157. package/styled-components/es/components/Range/variations/_size/base.js +0 -4
  158. package/styled-components/es/components/Range/variations/_size/tokens.json +0 -26
  159. package/styled-components/es/components/Range/variations/_view/base.js +0 -4
  160. package/styled-components/es/components/Range/variations/_view/tokens.json +0 -6
  161. package/styled-components/es/examples/plasma_b2c/components/Range/Range.config.js +0 -25
  162. package/styled-components/es/examples/plasma_b2c/components/Range/Range.js +0 -5
  163. package/styled-components/es/examples/plasma_b2c/components/Range/Range.stories.tsx +0 -312
  164. package/styled-components/es/examples/plasma_web/components/Range/Range.config.js +0 -25
  165. package/styled-components/es/examples/plasma_web/components/Range/Range.js +0 -5
  166. package/styled-components/es/examples/plasma_web/components/Range/Range.stories.tsx +0 -312
  167. package/types/components/Range/Range.d.ts +0 -31
  168. package/types/components/Range/Range.d.ts.map +0 -1
  169. package/types/components/Range/Range.styles.d.ts +0 -48
  170. package/types/components/Range/Range.styles.d.ts.map +0 -1
  171. package/types/components/Range/Range.tokens.d.ts +0 -98
  172. package/types/components/Range/Range.tokens.d.ts.map +0 -1
  173. package/types/components/Range/Range.types.d.ts +0 -143
  174. package/types/components/Range/Range.types.d.ts.map +0 -1
  175. package/types/components/Range/index.d.ts +0 -4
  176. package/types/components/Range/index.d.ts.map +0 -1
  177. package/types/components/Range/utils/index.d.ts +0 -5
  178. package/types/components/Range/utils/index.d.ts.map +0 -1
  179. package/types/components/Range/variations/_disabled/base.d.ts +0 -2
  180. package/types/components/Range/variations/_disabled/base.d.ts.map +0 -1
  181. package/types/components/Range/variations/_readonly/base.d.ts +0 -2
  182. package/types/components/Range/variations/_readonly/base.d.ts.map +0 -1
  183. package/types/components/Range/variations/_size/base.d.ts +0 -2
  184. package/types/components/Range/variations/_size/base.d.ts.map +0 -1
  185. package/types/components/Range/variations/_view/base.d.ts +0 -2
  186. package/types/components/Range/variations/_view/base.d.ts.map +0 -1
  187. package/types/examples/plasma_b2c/components/Range/Range.config.d.ts +0 -24
  188. package/types/examples/plasma_b2c/components/Range/Range.config.d.ts.map +0 -1
  189. package/types/examples/plasma_b2c/components/Range/Range.d.ts +0 -127
  190. package/types/examples/plasma_b2c/components/Range/Range.d.ts.map +0 -1
  191. package/types/examples/plasma_web/components/Range/Range.config.d.ts +0 -24
  192. package/types/examples/plasma_web/components/Range/Range.config.d.ts.map +0 -1
  193. package/types/examples/plasma_web/components/Range/Range.d.ts +0 -127
  194. package/types/examples/plasma_web/components/Range/Range.d.ts.map +0 -1
@@ -1,312 +0,0 @@
1
- import React, { ChangeEvent, ComponentProps, Dispatch, SetStateAction, useState } from 'react';
2
- import type { StoryObj, Meta } from '@storybook/react';
3
- import { action } from '@storybook/addon-actions';
4
- import { IconPlaceholder } from '@salutejs/plasma-sb-utils';
5
-
6
- import { WithTheme } from '../../../_helpers';
7
- import { IconChevronLeft } from '../../../../components/_Icon';
8
- import { IconButton } from '../IconButton/IconButton';
9
-
10
- import { Range } from './Range';
11
-
12
- const onChangeFirstValue = action('onChangeFirstValue');
13
- const onChangeSecondValue = action('onChangeSecondValue');
14
- const onSearchFirstValue = action('onSearchFirstValue');
15
- const onSearchSecondValue = action('onSearchSecondValue');
16
- const onFocusFirstTextfield = action('onFocusFirstTextfield');
17
- const onFocusSecondTextfield = action('onFocusSecondTextfield');
18
- const onBlurFirstTextfield = action('onBlurFirstTextfield');
19
- const onBlurSecondTextfield = action('onBlurSecondTextfield');
20
-
21
- const sizes = ['l', 'm', 's', 'xs'];
22
- const views = ['default'];
23
- const dividers = ['none', 'dash', 'icon'];
24
-
25
- const meta: Meta<typeof Range> = {
26
- title: 'plasma_b2c/Range',
27
- component: Range,
28
- decorators: [WithTheme],
29
- argTypes: {
30
- view: {
31
- options: views,
32
- control: {
33
- type: 'inline-radio',
34
- },
35
- },
36
- size: {
37
- options: sizes,
38
- control: {
39
- type: 'inline-radio',
40
- },
41
- },
42
- },
43
- };
44
-
45
- export default meta;
46
-
47
- type StoryPropsDefault = ComponentProps<typeof Range> & {
48
- enableContentLeft: boolean;
49
- enableContentRight: boolean;
50
- enableFirstTextfieldContentLeft: boolean;
51
- enableSecondTextfieldContentLeft: boolean;
52
- enableFirstTextfieldContentRight: boolean;
53
- enableSecondTextfieldContentRight: boolean;
54
- };
55
-
56
- const getSizeForIcon = (size) => {
57
- const map = {
58
- m: 's',
59
- l: 's',
60
- s: 's',
61
- xs: 'xs',
62
- };
63
- if (map[size]) {
64
- return map[size];
65
- }
66
-
67
- return size;
68
- };
69
-
70
- const ActionButton = ({ size }) => {
71
- return (
72
- <IconButton view="clear" size={size}>
73
- <IconChevronLeft size={getSizeForIcon(size)} />
74
- </IconButton>
75
- );
76
- };
77
-
78
- const StoryDefault = ({
79
- dividerVariant,
80
- enableContentLeft,
81
- enableContentRight,
82
- firstTextfieldTextBefore,
83
- secondTextfieldTextBefore,
84
- enableFirstTextfieldContentLeft,
85
- enableSecondTextfieldContentLeft,
86
- enableFirstTextfieldContentRight,
87
- enableSecondTextfieldContentRight,
88
- size,
89
- ...rest
90
- }: StoryPropsDefault) => {
91
- const [firstValue, setFirstValue] = useState('');
92
- const [secondValue, setSecondValue] = useState('');
93
-
94
- const iconSize = size === 'xs' ? 'xs' : 's';
95
- const showDividerIcon = dividerVariant === 'icon';
96
- const showDefaultTextBefore = dividerVariant === 'none';
97
-
98
- const dividerIconProps = {
99
- dividerIcon: showDividerIcon ? <IconPlaceholder size="s" /> : null,
100
- dividerVariant,
101
- };
102
-
103
- return (
104
- <Range
105
- size={size}
106
- firstValue={firstValue}
107
- secondValue={secondValue}
108
- contentLeft={enableContentLeft ? <IconPlaceholder size={iconSize} /> : undefined}
109
- contentRight={enableContentRight ? <ActionButton size={size} /> : undefined}
110
- firstTextfieldContentLeft={
111
- enableFirstTextfieldContentLeft ? <IconPlaceholder size={iconSize} /> : undefined
112
- }
113
- firstTextfieldContentRight={
114
- enableFirstTextfieldContentRight ? <IconPlaceholder size={iconSize} /> : undefined
115
- }
116
- secondTextfieldContentLeft={
117
- enableSecondTextfieldContentLeft ? <IconPlaceholder size={iconSize} /> : undefined
118
- }
119
- secondTextfieldContentRight={
120
- enableSecondTextfieldContentRight ? <IconPlaceholder size={iconSize} /> : undefined
121
- }
122
- firstTextfieldTextBefore={
123
- showDefaultTextBefore ? firstTextfieldTextBefore || 'С' : firstTextfieldTextBefore
124
- }
125
- secondTextfieldTextBefore={
126
- showDefaultTextBefore ? secondTextfieldTextBefore || 'ПО' : secondTextfieldTextBefore
127
- }
128
- onChangeFirstValue={(e) => {
129
- setFirstValue(e.target.value);
130
- onChangeFirstValue(e, e.target.value);
131
- }}
132
- onChangeSecondValue={(e) => {
133
- setSecondValue(e.target.value);
134
- onChangeSecondValue(e, e.target.value);
135
- }}
136
- onSearchFirstValue={onSearchFirstValue}
137
- onSearchSecondValue={onSearchSecondValue}
138
- onFocusFirstTextfield={onFocusFirstTextfield}
139
- onFocusSecondTextfield={onFocusSecondTextfield}
140
- onBlurFirstTextfield={onBlurFirstTextfield}
141
- onBlurSecondTextfield={onBlurSecondTextfield}
142
- {...dividerIconProps}
143
- {...rest}
144
- />
145
- );
146
- };
147
-
148
- export const Default: StoryObj<StoryPropsDefault> = {
149
- argTypes: {
150
- dividerVariant: {
151
- options: dividers,
152
- control: {
153
- type: 'inline-radio',
154
- },
155
- },
156
- },
157
- args: {
158
- label: 'Лейбл',
159
- leftHelper: 'Подсказка к полю',
160
- firstPlaceholder: 'Заполните поле 1',
161
- secondPlaceholder: 'Заполните поле 2',
162
- size: 'l',
163
- view: 'default',
164
- disabled: false,
165
- readOnly: false,
166
- firstTextfieldTextBefore: 'С',
167
- secondTextfieldTextBefore: 'ПО',
168
- enableContentLeft: true,
169
- enableContentRight: true,
170
- dividerVariant: 'dash',
171
- enableFirstTextfieldContentLeft: false,
172
- enableFirstTextfieldContentRight: false,
173
- enableSecondTextfieldContentLeft: false,
174
- enableSecondTextfieldContentRight: false,
175
- firstValueError: false,
176
- secondValueError: false,
177
- firstValueSuccess: false,
178
- secondValueSuccess: false,
179
- },
180
- render: (args) => <StoryDefault {...args} />,
181
- };
182
-
183
- const StoryDemo = ({ enableContentLeft, enableContentRight, size, ...rest }: StoryPropsDefault) => {
184
- const [firstValue, setFirstValue] = useState('');
185
- const [secondValue, setSecondValue] = useState('');
186
-
187
- const [firstValueError, setFirstValueError] = useState(false);
188
- const [secondValueError, setSecondValueError] = useState(false);
189
-
190
- const [firstValueSuccess, setFirstValueSuccess] = useState(false);
191
- const [secondValueSuccess, setSecondValueSuccess] = useState(false);
192
-
193
- const checkValue = (value: string) => /^([1-9][0-9]*|)$/.test(value);
194
-
195
- const handleChangeValue = (
196
- e: ChangeEvent<HTMLInputElement>,
197
- setter: Dispatch<SetStateAction<string>>,
198
- error: boolean,
199
- errorSetter: Dispatch<SetStateAction<boolean>>,
200
- success: boolean,
201
- successSetter: Dispatch<SetStateAction<boolean>>,
202
- ) => {
203
- const { value } = e.target;
204
- if (!checkValue(value)) {
205
- return;
206
- }
207
-
208
- if (error) {
209
- errorSetter(false);
210
- }
211
-
212
- if (success) {
213
- successSetter(false);
214
- }
215
-
216
- setter(value);
217
- };
218
-
219
- const firstValueConstraint = (value: number) =>
220
- value <= 0 || value >= 9 || (secondValue && value >= Number(secondValue) && !secondValueError);
221
- const secondValueConstraint = (value: number) =>
222
- value <= 0 || value > 10 || (firstValue && value <= Number(firstValue) && !firstValueError);
223
-
224
- const handleCommitValue = (
225
- value: string,
226
- constraint: (currentValue: number) => boolean,
227
- errorSetter: Dispatch<SetStateAction<boolean>>,
228
- successSetter: Dispatch<SetStateAction<boolean>>,
229
- ) => {
230
- if (!value) {
231
- return;
232
- }
233
-
234
- if (!checkValue(value)) {
235
- return errorSetter(true);
236
- }
237
-
238
- if (constraint(Number(value))) {
239
- return errorSetter(true);
240
- }
241
-
242
- successSetter(true);
243
- };
244
-
245
- const iconSize = size === 'xs' ? 'xs' : 's';
246
-
247
- return (
248
- <Range
249
- dividerVariant="dash"
250
- size={size}
251
- firstValue={firstValue}
252
- secondValue={secondValue}
253
- firstValueError={firstValueError}
254
- secondValueError={secondValueError}
255
- firstValueSuccess={firstValueSuccess}
256
- secondValueSuccess={secondValueSuccess}
257
- contentLeft={enableContentLeft ? <IconPlaceholder size={iconSize} /> : undefined}
258
- contentRight={enableContentRight ? <ActionButton size={size} /> : undefined}
259
- onChangeFirstValue={(e) => {
260
- handleChangeValue(
261
- e,
262
- setFirstValue,
263
- firstValueError,
264
- setFirstValueError,
265
- firstValueSuccess,
266
- setFirstValueSuccess,
267
- );
268
- }}
269
- onChangeSecondValue={(e) => {
270
- handleChangeValue(
271
- e,
272
- setSecondValue,
273
- secondValueError,
274
- setSecondValueError,
275
- secondValueSuccess,
276
- setSecondValueSuccess,
277
- );
278
- }}
279
- onSearchFirstValue={(e) => {
280
- const { value } = e.target as HTMLInputElement;
281
- handleCommitValue(value, firstValueConstraint, setFirstValueError, setFirstValueSuccess);
282
- }}
283
- onSearchSecondValue={(e) => {
284
- const { value } = e.target as HTMLInputElement;
285
- handleCommitValue(value, secondValueConstraint, setSecondValueError, setSecondValueSuccess);
286
- }}
287
- onFocusFirstTextfield={onFocusFirstTextfield}
288
- onFocusSecondTextfield={onFocusSecondTextfield}
289
- onBlurFirstTextfield={onBlurFirstTextfield}
290
- onBlurSecondTextfield={onBlurSecondTextfield}
291
- {...rest}
292
- />
293
- );
294
- };
295
-
296
- export const Demo: StoryObj<StoryPropsDefault> = {
297
- args: {
298
- label: 'Введите кол-во товара',
299
- leftHelper: 'Кол-во товара не может быть меньше 1 и превышать 10',
300
- firstPlaceholder: '1',
301
- secondPlaceholder: '5',
302
- size: 'l',
303
- view: 'default',
304
- disabled: false,
305
- readOnly: false,
306
- firstTextfieldTextBefore: '',
307
- secondTextfieldTextBefore: '',
308
- enableContentLeft: true,
309
- enableContentRight: true,
310
- },
311
- render: (args) => <StoryDemo {...args} />,
312
- };
@@ -1,31 +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 _Range = /*#__PURE__*/require("../../../../components/Range");
9
- var config = exports.config = {
10
- defaults: {
11
- view: 'default',
12
- size: 'l'
13
- },
14
- variations: {
15
- view: {
16
- "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--surface-clear);", ":var(--surface-transparent-tertiary);", ":var(--surface-negative);", ":var(--surface-positive);", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-accent);", ":var(--surface-accent);", ":var(--surface-negative);", ":var(--surface-accent);", ":var(--surface-positive);", ":var(--surface-accent);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--text-accent);"], _Range.rangeTokens.background, _Range.rangeTokens.borderColor, _Range.rangeTokens.borderColorError, _Range.rangeTokens.borderColorSuccess, _Range.rangeTokens.dividerColor, _Range.rangeTokens.labelColor, _Range.rangeTokens.leftHelperColor, _Range.rangeTokens.textFieldColor, _Range.rangeTokens.textFieldPlaceholderColor, _Range.rangeTokens.textFieldCaretColor, _Range.rangeTokens.textFieldBorderColorFocus, _Range.rangeTokens.textFieldBorderColorError, _Range.rangeTokens.textFieldBorderColorErrorFocus, _Range.rangeTokens.textFieldBorderColorSuccess, _Range.rangeTokens.textFieldBorderColorSuccessFocus, _Range.rangeTokens.textFieldTextBeforeColor, _Range.rangeTokens.textFieldTextAfterColor, _Range.rangeTokens.focusColor)
17
- },
18
- size: {
19
- l: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.875rem;", ":0.0625rem;", ":0 0.375rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":0 0.375rem 0 1rem;", ":0;", ":0 0 0.75rem 0;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":3.5rem;", ":0.875rem;", ":0.0625rem;", ":1.0625rem 1.125rem 1.0625rem 1.125rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":0.25rem 0 0 0;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":-0.0625rem 0.5rem -0.0625rem -0.125rem;", ":-0.0625rem -0.125rem -0.0625rem 0.75rem;", ":0 0.25rem 0 0;", ":0 0 0 0.25rem;"], _Range.rangeTokens.borderRadius, _Range.rangeTokens.borderWidth, _Range.rangeTokens.dividerPadding, _Range.rangeTokens.dividerFontFamily, _Range.rangeTokens.dividerFontStyle, _Range.rangeTokens.dividerFontSize, _Range.rangeTokens.dividerFontWeight, _Range.rangeTokens.dividerLetterSpacing, _Range.rangeTokens.dividerLineHeight, _Range.rangeTokens.leftContentMargin, _Range.rangeTokens.rightContentMargin, _Range.rangeTokens.labelOffset, _Range.rangeTokens.labelFontFamily, _Range.rangeTokens.labelFontStyle, _Range.rangeTokens.labelFontSize, _Range.rangeTokens.labelFontWeight, _Range.rangeTokens.labelLetterSpacing, _Range.rangeTokens.labelLineHeight, _Range.rangeTokens.textFieldHeight, _Range.rangeTokens.textFieldBorderRadius, _Range.rangeTokens.textFieldBorderWidth, _Range.rangeTokens.textFieldPadding, _Range.rangeTokens.textFieldFontFamily, _Range.rangeTokens.textFieldFontStyle, _Range.rangeTokens.textFieldFontSize, _Range.rangeTokens.textFieldFontWeight, _Range.rangeTokens.textFieldLetterSpacing, _Range.rangeTokens.textFieldLineHeight, _Range.rangeTokens.leftHelperOffset, _Range.rangeTokens.leftHelperFontFamily, _Range.rangeTokens.leftHelperFontStyle, _Range.rangeTokens.leftHelperFontSize, _Range.rangeTokens.leftHelperFontWeight, _Range.rangeTokens.leftHelperLetterSpacing, _Range.rangeTokens.leftHelperLineHeight, _Range.rangeTokens.textFieldLeftContentMargin, _Range.rangeTokens.textFieldRightContentMargin, _Range.rangeTokens.textFieldTextBeforeMargin, _Range.rangeTokens.textFieldTextAfterMargin),
20
- m: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.75rem;", ":0.0625rem;", ":0 0.375rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":0 0.375rem 0 0.875rem;", ":0;", ":0 0 0.625rem 0;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":3rem;", ":0.75rem;", ":0.0625rem;", ":0.875rem 1rem 0.875rem 1rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":0.25rem 0 0 0;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":-0.125rem 0.375rem -0.125rem -0.125rem;", ":-0.125rem -0.125rem -0.125rem 0.75rem;", ":0 0.25rem 0 0;", ":0 0 0 0.25rem;"], _Range.rangeTokens.borderRadius, _Range.rangeTokens.borderWidth, _Range.rangeTokens.dividerPadding, _Range.rangeTokens.dividerFontFamily, _Range.rangeTokens.dividerFontStyle, _Range.rangeTokens.dividerFontSize, _Range.rangeTokens.dividerFontWeight, _Range.rangeTokens.dividerLetterSpacing, _Range.rangeTokens.dividerLineHeight, _Range.rangeTokens.leftContentMargin, _Range.rangeTokens.rightContentMargin, _Range.rangeTokens.labelOffset, _Range.rangeTokens.labelFontFamily, _Range.rangeTokens.labelFontStyle, _Range.rangeTokens.labelFontSize, _Range.rangeTokens.labelFontWeight, _Range.rangeTokens.labelLetterSpacing, _Range.rangeTokens.labelLineHeight, _Range.rangeTokens.textFieldHeight, _Range.rangeTokens.textFieldBorderRadius, _Range.rangeTokens.textFieldBorderWidth, _Range.rangeTokens.textFieldPadding, _Range.rangeTokens.textFieldFontFamily, _Range.rangeTokens.textFieldFontStyle, _Range.rangeTokens.textFieldFontSize, _Range.rangeTokens.textFieldFontWeight, _Range.rangeTokens.textFieldLetterSpacing, _Range.rangeTokens.textFieldLineHeight, _Range.rangeTokens.leftHelperOffset, _Range.rangeTokens.leftHelperFontFamily, _Range.rangeTokens.leftHelperFontStyle, _Range.rangeTokens.leftHelperFontSize, _Range.rangeTokens.leftHelperFontWeight, _Range.rangeTokens.leftHelperLetterSpacing, _Range.rangeTokens.leftHelperLineHeight, _Range.rangeTokens.textFieldLeftContentMargin, _Range.rangeTokens.textFieldRightContentMargin, _Range.rangeTokens.textFieldTextBeforeMargin, _Range.rangeTokens.textFieldTextAfterMargin),
21
- s: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.625rem;", ":0.0625rem;", ":0 0.375rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":0 0.375rem 0 0.75rem;", ":0;", ":0 0 0.5rem 0;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":2.5rem;", ":0.625rem;", ":0.0625rem;", ":0.6875rem 0.875rem 0.6875rem 0.875rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":0.25rem 0 0 0;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":-0.1875rem 0.25rem -0.1875rem -0.125rem;", ":-0.1875rem -0.125rem -0.1875rem 0.75rem;", ":0 0.25rem 0 0;", ":0 0 0 0.25rem;"], _Range.rangeTokens.borderRadius, _Range.rangeTokens.borderWidth, _Range.rangeTokens.dividerPadding, _Range.rangeTokens.dividerFontFamily, _Range.rangeTokens.dividerFontStyle, _Range.rangeTokens.dividerFontSize, _Range.rangeTokens.dividerFontWeight, _Range.rangeTokens.dividerLetterSpacing, _Range.rangeTokens.dividerLineHeight, _Range.rangeTokens.leftContentMargin, _Range.rangeTokens.rightContentMargin, _Range.rangeTokens.labelOffset, _Range.rangeTokens.labelFontFamily, _Range.rangeTokens.labelFontStyle, _Range.rangeTokens.labelFontSize, _Range.rangeTokens.labelFontWeight, _Range.rangeTokens.labelLetterSpacing, _Range.rangeTokens.labelLineHeight, _Range.rangeTokens.textFieldHeight, _Range.rangeTokens.textFieldBorderRadius, _Range.rangeTokens.textFieldBorderWidth, _Range.rangeTokens.textFieldPadding, _Range.rangeTokens.textFieldFontFamily, _Range.rangeTokens.textFieldFontStyle, _Range.rangeTokens.textFieldFontSize, _Range.rangeTokens.textFieldFontWeight, _Range.rangeTokens.textFieldLetterSpacing, _Range.rangeTokens.textFieldLineHeight, _Range.rangeTokens.leftHelperOffset, _Range.rangeTokens.leftHelperFontFamily, _Range.rangeTokens.leftHelperFontStyle, _Range.rangeTokens.leftHelperFontSize, _Range.rangeTokens.leftHelperFontWeight, _Range.rangeTokens.leftHelperLetterSpacing, _Range.rangeTokens.leftHelperLineHeight, _Range.rangeTokens.textFieldLeftContentMargin, _Range.rangeTokens.textFieldRightContentMargin, _Range.rangeTokens.textFieldTextBeforeMargin, _Range.rangeTokens.textFieldTextAfterMargin),
22
- xs: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.5rem;", ":0.0625rem;", ":0 0.375rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":0 0.25rem 0 0.5rem;", ":0;", ":0 0 0.375rem 0;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":2rem;", ":0.5rem;", ":0.0625rem;", ":0.5625rem 0.625rem 0.5625rem 0.625rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":0.25rem 0 0 0;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":-0.0625rem 0.25rem -0.0625rem -0.125rem;", ":-0.0625rem -0.125rem -0.0625rem 0.75rem;", ":0 0.25rem 0 0;", ":0 0 0 0.25rem;"], _Range.rangeTokens.borderRadius, _Range.rangeTokens.borderWidth, _Range.rangeTokens.dividerPadding, _Range.rangeTokens.dividerFontFamily, _Range.rangeTokens.dividerFontStyle, _Range.rangeTokens.dividerFontSize, _Range.rangeTokens.dividerFontWeight, _Range.rangeTokens.dividerLetterSpacing, _Range.rangeTokens.dividerLineHeight, _Range.rangeTokens.leftContentMargin, _Range.rangeTokens.rightContentMargin, _Range.rangeTokens.labelOffset, _Range.rangeTokens.labelFontFamily, _Range.rangeTokens.labelFontStyle, _Range.rangeTokens.labelFontSize, _Range.rangeTokens.labelFontWeight, _Range.rangeTokens.labelLetterSpacing, _Range.rangeTokens.labelLineHeight, _Range.rangeTokens.textFieldHeight, _Range.rangeTokens.textFieldBorderRadius, _Range.rangeTokens.textFieldBorderWidth, _Range.rangeTokens.textFieldPadding, _Range.rangeTokens.textFieldFontFamily, _Range.rangeTokens.textFieldFontStyle, _Range.rangeTokens.textFieldFontSize, _Range.rangeTokens.textFieldFontWeight, _Range.rangeTokens.textFieldLetterSpacing, _Range.rangeTokens.textFieldLineHeight, _Range.rangeTokens.leftHelperOffset, _Range.rangeTokens.leftHelperFontFamily, _Range.rangeTokens.leftHelperFontStyle, _Range.rangeTokens.leftHelperFontSize, _Range.rangeTokens.leftHelperFontWeight, _Range.rangeTokens.leftHelperLetterSpacing, _Range.rangeTokens.leftHelperLineHeight, _Range.rangeTokens.textFieldLeftContentMargin, _Range.rangeTokens.textFieldRightContentMargin, _Range.rangeTokens.textFieldTextBeforeMargin, _Range.rangeTokens.textFieldTextAfterMargin)
23
- },
24
- disabled: {
25
- "true": /*#__PURE__*/(0, _styledComponents.css)(["", ":0.4;"], _Range.rangeTokens.disabledOpacity)
26
- },
27
- readOnly: {
28
- "true": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--surface-clear);", ":var(--surface-transparent-tertiary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary);", ":transparent;", ":var(--text-secondary);"], _Range.rangeTokens.backgroundReadOnly, _Range.rangeTokens.borderColorReadOnly, _Range.rangeTokens.labelColorReadOnly, _Range.rangeTokens.leftHelperColorReadOnly, _Range.rangeTokens.textFieldColorReadOnly, _Range.rangeTokens.textFieldBackgroundColorReadOnly, _Range.rangeTokens.textFieldPlaceholderColorReadOnly)
29
- }
30
- }
31
- };
@@ -1,11 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.Range = void 0;
7
- var _engines = /*#__PURE__*/require("../../../../engines");
8
- var _Range = /*#__PURE__*/require("../../../../components/Range");
9
- var _Range2 = /*#__PURE__*/require("./Range.config");
10
- var mergedConfig = /*#__PURE__*/(0, _engines.mergeConfig)(_Range.rangeConfig, _Range2.config);
11
- var Range = exports.Range = /*#__PURE__*/(0, _engines.component)(mergedConfig);