@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_web/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,139 +0,0 @@
1
- var _StyledDivider;
2
- var _excluded = ["label", "leftHelper", "contentLeft", "contentRight", "view", "size", "readOnly", "disabled", "dividerVariant", "dividerIcon", "firstValue", "secondValue", "firstValueError", "secondValueError", "firstValueSuccess", "secondValueSuccess", "firstPlaceholder", "secondPlaceholder", "firstTextfieldContentLeft", "firstTextfieldContentRight", "secondTextfieldContentLeft", "secondTextfieldContentRight", "firstTextfieldTextBefore", "secondTextfieldTextBefore", "firstTextfieldTextAfter", "secondTextfieldTextAfter", "onChangeFirstValue", "onChangeSecondValue", "onSearchFirstValue", "onSearchSecondValue", "onFocusFirstTextfield", "onFocusSecondTextfield", "onBlurFirstTextfield", "onBlurSecondTextfield"];
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 _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; }
5
- 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; }
6
- import React, { forwardRef, useCallback, useMemo } from 'react';
7
- import { cx } from '../../utils';
8
- import { base as sizeCSS } from './variations/_size/base';
9
- import { base as viewCSS } from './variations/_view/base';
10
- import { base as disabledCSS } from './variations/_disabled/base';
11
- import { base as readOnlyCSS } from './variations/_readonly/base';
12
- import { getChangeHandler, getSearchHandler } from './utils';
13
- import { ContentWrapper, LeftHelper, StyledContentLeft, StyledContentRight, StyledDivider, StyledInput, StyledLabel, base } from './Range.styles';
14
- import { classes } from './Range.tokens';
15
- export var rangeRoot = function rangeRoot(Root) {
16
- return /*#__PURE__*/forwardRef(function (_ref, ref) {
17
- var _StyledDivider2;
18
- var label = _ref.label,
19
- leftHelper = _ref.leftHelper,
20
- contentLeft = _ref.contentLeft,
21
- contentRight = _ref.contentRight,
22
- view = _ref.view,
23
- size = _ref.size,
24
- _ref$readOnly = _ref.readOnly,
25
- readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
26
- _ref$disabled = _ref.disabled,
27
- disabled = _ref$disabled === void 0 ? false : _ref$disabled,
28
- _ref$dividerVariant = _ref.dividerVariant,
29
- dividerVariant = _ref$dividerVariant === void 0 ? 'dash' : _ref$dividerVariant,
30
- dividerIcon = _ref.dividerIcon,
31
- firstValue = _ref.firstValue,
32
- secondValue = _ref.secondValue,
33
- firstValueError = _ref.firstValueError,
34
- secondValueError = _ref.secondValueError,
35
- firstValueSuccess = _ref.firstValueSuccess,
36
- secondValueSuccess = _ref.secondValueSuccess,
37
- firstPlaceholder = _ref.firstPlaceholder,
38
- secondPlaceholder = _ref.secondPlaceholder,
39
- firstTextfieldContentLeft = _ref.firstTextfieldContentLeft,
40
- firstTextfieldContentRight = _ref.firstTextfieldContentRight,
41
- secondTextfieldContentLeft = _ref.secondTextfieldContentLeft,
42
- secondTextfieldContentRight = _ref.secondTextfieldContentRight,
43
- firstTextfieldTextBefore = _ref.firstTextfieldTextBefore,
44
- secondTextfieldTextBefore = _ref.secondTextfieldTextBefore,
45
- firstTextfieldTextAfter = _ref.firstTextfieldTextAfter,
46
- secondTextfieldTextAfter = _ref.secondTextfieldTextAfter,
47
- onChangeFirstValue = _ref.onChangeFirstValue,
48
- onChangeSecondValue = _ref.onChangeSecondValue,
49
- onSearchFirstValue = _ref.onSearchFirstValue,
50
- onSearchSecondValue = _ref.onSearchSecondValue,
51
- onFocusFirstTextfield = _ref.onFocusFirstTextfield,
52
- onFocusSecondTextfield = _ref.onFocusSecondTextfield,
53
- onBlurFirstTextfield = _ref.onBlurFirstTextfield,
54
- onBlurSecondTextfield = _ref.onBlurSecondTextfield,
55
- rest = _objectWithoutProperties(_ref, _excluded);
56
- var rangeErrorClass = firstValueError && secondValueError ? classes.rangeError : undefined;
57
- var firstValueErrorClass = !rangeErrorClass && firstValueError ? classes.rangeValueError : undefined;
58
- var secondValueErrorClass = !rangeErrorClass && secondValueError ? classes.rangeValueError : undefined;
59
- var rangeSuccessClass = firstValueSuccess && secondValueSuccess ? classes.rangeSuccess : undefined;
60
- var firstValueSuccessClass = !rangeSuccessClass && firstValueSuccess ? classes.rangeValueSuccess : undefined;
61
- var secondValueSuccessClass = !rangeSuccessClass && secondValueSuccess ? classes.rangeValueSuccess : undefined;
62
- var handleChangeFirstValue = useCallback(getChangeHandler(onChangeFirstValue, disabled, readOnly), [onChangeFirstValue, disabled, readOnly]);
63
- var handleChangeSecondValue = useCallback(getChangeHandler(onChangeSecondValue, disabled, readOnly), [onChangeSecondValue, disabled, readOnly]);
64
- var handleSearchFirstValue = useCallback(getSearchHandler(onSearchFirstValue, disabled, readOnly), [onSearchFirstValue, disabled, readOnly]);
65
- var handleSearchSecondValue = useCallback(getSearchHandler(onSearchSecondValue, disabled, readOnly), [onSearchFirstValue, disabled, readOnly]);
66
- var Divider = useMemo(function () {
67
- if (dividerVariant === 'none') {
68
- return null;
69
- }
70
- if (dividerVariant === 'dash') {
71
- return _StyledDivider || (_StyledDivider = /*#__PURE__*/React.createElement(StyledDivider, null, "-"));
72
- }
73
- return _StyledDivider2 || (_StyledDivider2 = /*#__PURE__*/React.createElement(StyledDivider, null, dividerIcon));
74
- }, [dividerVariant, dividerIcon]);
75
- return /*#__PURE__*/React.createElement(Root, _extends({
76
- view: view,
77
- size: size,
78
- disabled: disabled,
79
- readOnly: !disabled && readOnly,
80
- ref: ref
81
- }, rest), label && /*#__PURE__*/React.createElement(StyledLabel, null, label), /*#__PURE__*/React.createElement(ContentWrapper, {
82
- className: cx(rangeErrorClass, rangeSuccessClass)
83
- }, contentLeft && /*#__PURE__*/React.createElement(StyledContentLeft, null, contentLeft), /*#__PURE__*/React.createElement(StyledInput, {
84
- className: cx(firstValueErrorClass, firstValueSuccessClass),
85
- value: firstValue,
86
- readOnly: readOnly,
87
- disabled: disabled,
88
- placeholder: firstPlaceholder,
89
- contentLeft: firstTextfieldContentLeft,
90
- contentRight: firstTextfieldContentRight,
91
- textBefore: firstTextfieldTextBefore,
92
- textAfter: firstTextfieldTextAfter,
93
- onChange: handleChangeFirstValue,
94
- onSearch: handleSearchFirstValue,
95
- onFocus: onFocusFirstTextfield,
96
- onBlur: onBlurFirstTextfield
97
- }), Divider, /*#__PURE__*/React.createElement(StyledInput, {
98
- className: cx(secondValueErrorClass, secondValueSuccessClass),
99
- value: secondValue,
100
- readOnly: readOnly,
101
- disabled: disabled,
102
- placeholder: secondPlaceholder,
103
- contentLeft: secondTextfieldContentLeft,
104
- contentRight: secondTextfieldContentRight,
105
- textBefore: secondTextfieldTextBefore,
106
- textAfter: secondTextfieldTextAfter,
107
- onChange: handleChangeSecondValue,
108
- onSearch: handleSearchSecondValue,
109
- onFocus: onFocusSecondTextfield,
110
- onBlur: onBlurSecondTextfield
111
- }), contentRight && /*#__PURE__*/React.createElement(StyledContentRight, null, contentRight)), leftHelper && /*#__PURE__*/React.createElement(LeftHelper, null, leftHelper));
112
- });
113
- };
114
- export var rangeConfig = {
115
- name: 'Range',
116
- tag: 'div',
117
- layout: rangeRoot,
118
- base: base,
119
- variations: {
120
- view: {
121
- css: viewCSS
122
- },
123
- size: {
124
- css: sizeCSS
125
- },
126
- disabled: {
127
- css: disabledCSS,
128
- attrs: true
129
- },
130
- readOnly: {
131
- css: readOnlyCSS,
132
- attrs: true
133
- }
134
- },
135
- defaults: {
136
- size: 'm',
137
- view: 'default'
138
- }
139
- };
@@ -1,31 +0,0 @@
1
- import styled from 'styled-components';
2
- import { css } from 'styled-components';
3
- import { component, mergeConfig } from '../../engines';
4
- import { textFieldConfig, textFieldTokens } from '../TextField';
5
- import { classes, tokens } from './Range.tokens';
6
- var mergedConfig = /*#__PURE__*/mergeConfig(textFieldConfig);
7
- var TextField = /*#__PURE__*/component(mergedConfig);
8
-
9
- // NOTE: переопределение токенов TextField
10
- export var StyledInput = /*#__PURE__*/styled(TextField).withConfig({
11
- componentId: "plasma-new-hope__sc-xpkrak-0"
12
- })(["flex:1;", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");&.", "{", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");}&.", "{", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");}"], textFieldTokens.color, tokens.textFieldColor, textFieldTokens.placeholderColor, tokens.textFieldPlaceholderColor, textFieldTokens.caretColor, tokens.textFieldCaretColor, textFieldTokens.focusColor, tokens.textFieldFocusColor, textFieldTokens.backgroundColor, tokens.textFieldBackgroundColor, textFieldTokens.backgroundColorHover, tokens.textFieldBackgroundColorHover, textFieldTokens.backgroundColorFocus, tokens.textFieldBackgroundColorFocus, textFieldTokens.borderColor, tokens.textFieldBorderColor, textFieldTokens.borderColorHover, tokens.textFieldBorderColorHover, textFieldTokens.borderColorFocus, tokens.textFieldBorderColorFocus, textFieldTokens.colorReadOnly, tokens.textFieldColorReadOnly, textFieldTokens.backgroundColorReadOnly, tokens.textFieldBackgroundColorReadOnly, textFieldTokens.borderColorReadOnly, tokens.textFieldBorderColorReadOnly, textFieldTokens.placeholderColorReadOnly, tokens.textFieldPlaceholderColorReadOnly, textFieldTokens.height, tokens.textFieldHeight, textFieldTokens.borderWidth, tokens.textFieldBorderWidth, textFieldTokens.borderRadius, tokens.textFieldBorderRadius, textFieldTokens.padding, tokens.textFieldPadding, textFieldTokens.leftContentMargin, tokens.textFieldLeftContentMargin, textFieldTokens.rightContentMargin, tokens.textFieldRightContentMargin, textFieldTokens.fontFamily, tokens.textFieldFontFamily, textFieldTokens.fontSize, tokens.textFieldFontSize, textFieldTokens.fontStyle, tokens.textFieldFontStyle, textFieldTokens.fontWeight, tokens.textFieldFontWeight, textFieldTokens.letterSpacing, tokens.textFieldLetterSpacing, textFieldTokens.lineHeight, tokens.textFieldLineHeight, textFieldTokens.disabledOpacity, tokens.disabledOpacity, textFieldTokens.textBeforeColor, tokens.textFieldTextBeforeColor, textFieldTokens.textAfterColor, tokens.textFieldTextAfterColor, textFieldTokens.textBeforeMargin, tokens.textFieldTextBeforeMargin, textFieldTokens.textAfterMargin, tokens.textFieldTextAfterMargin, classes.rangeValueError, textFieldTokens.backgroundColor, tokens.textFieldBackgroundErrorColor, textFieldTokens.backgroundColorHover, tokens.textFieldBackgroundErrorColorHover, textFieldTokens.backgroundColorFocus, tokens.textFieldBackgroundErrorColorFocus, textFieldTokens.borderColor, tokens.textFieldBorderColorError, textFieldTokens.borderColorHover, tokens.textFieldBorderColorErrorHover, textFieldTokens.borderColorFocus, tokens.textFieldBorderColorErrorFocus, classes.rangeValueSuccess, textFieldTokens.backgroundColor, tokens.textFieldBackgroundSuccessColor, textFieldTokens.backgroundColorHover, tokens.textFieldBackgroundSuccessColorHover, textFieldTokens.backgroundColorFocus, tokens.textFieldBackgroundSuccessColorFocus, textFieldTokens.borderColor, tokens.textFieldBorderColorSuccess, textFieldTokens.borderColorHover, tokens.textFieldBorderColorSuccessHover, textFieldTokens.borderColorFocus, tokens.textFieldBorderColorSuccessFocus);
13
- export var base = /*#__PURE__*/css([""]);
14
- export var StyledLabel = /*#__PURE__*/styled.label.withConfig({
15
- componentId: "plasma-new-hope__sc-xpkrak-1"
16
- })([""]);
17
- export var LeftHelper = /*#__PURE__*/styled.div.withConfig({
18
- componentId: "plasma-new-hope__sc-xpkrak-2"
19
- })([""]);
20
- export var ContentWrapper = /*#__PURE__*/styled.div.withConfig({
21
- componentId: "plasma-new-hope__sc-xpkrak-3"
22
- })(["display:flex;align-items:center;"]);
23
- export var StyledDivider = /*#__PURE__*/styled.div.withConfig({
24
- componentId: "plasma-new-hope__sc-xpkrak-4"
25
- })([""]);
26
- export var StyledContentLeft = /*#__PURE__*/styled.div.withConfig({
27
- componentId: "plasma-new-hope__sc-xpkrak-5"
28
- })([""]);
29
- export var StyledContentRight = /*#__PURE__*/styled.div.withConfig({
30
- componentId: "plasma-new-hope__sc-xpkrak-6"
31
- })([""]);
@@ -1,97 +0,0 @@
1
- export var classes = {
2
- rangeError: 'range-error',
3
- rangeValueError: 'range-value-error',
4
- rangeSuccess: 'range-success',
5
- rangeValueSuccess: 'range-value-success'
6
- };
7
- export var tokens = {
8
- background: '--plasma-range-background',
9
- backgroundError: '--plasma-range-background-error',
10
- backgroundSuccess: '--plasma-range-background-success',
11
- backgroundReadOnly: '--plasma-range-background-readonly',
12
- borderRadius: '--plasma-range-border-radius',
13
- borderWidth: '--plasma-range-border-width',
14
- borderColor: '--plasma-range-border-color',
15
- borderColorError: '--plasma-range-border-color-error',
16
- borderColorSuccess: '--plasma-range-border-color-success',
17
- borderColorReadOnly: '--plasma-range-border-color-readonly',
18
- /** Токены разделителя */
19
- dividerColor: '--plasma-range__divider-color',
20
- dividerPadding: '--plasma-range__divider-padding',
21
- dividerFontFamily: '--plasma-range__divider-font-family',
22
- dividerFontStyle: '--plasma-range__divider-font-style',
23
- dividerFontSize: '--plasma-range__divider-font-size',
24
- dividerFontWeight: '--plasma-range__divider-font-weight',
25
- dividerLetterSpacing: '--plasma-range__divider-letter-spacing',
26
- dividerLineHeight: '--plasma-range__divider-line-height',
27
- /** Токены слотов для контента */
28
- leftContentMargin: '--plasma-range__left-content-margin',
29
- rightContentMargin: '--plasma-range__right-content-margin',
30
- /** Токены лейбла */
31
- labelColor: '--plasma-range__label-color',
32
- labelColorReadOnly: '--plasma-range__label-color-readonly',
33
- labelOffset: '--plasma-range__label-offset',
34
- labelFontFamily: '--plasma-range__label-font-family',
35
- labelFontStyle: '--plasma-range__label-font-style',
36
- labelFontSize: '--plasma-range__label-font-size',
37
- labelFontWeight: '--plasma-range__label-font-weight',
38
- labelLetterSpacing: '--plasma-range__label-letter-spacing',
39
- labelLineHeight: '--plasma-range__label-line-height',
40
- /** Токены вспомогательного текста */
41
- leftHelperColor: '--plasma-range__left-helper-color',
42
- leftHelperColorReadOnly: '--plasma-range__left-helper-color-readonly',
43
- leftHelperOffset: '--plasma-range__left-helper-offset',
44
- leftHelperFontFamily: '--plasma-range__left-helper-font-family',
45
- leftHelperFontStyle: '--plasma-range__left-helper-font-style',
46
- leftHelperFontSize: '--plasma-range__left-helper-font-size',
47
- leftHelperFontWeight: '--plasma-range__left-helper-font-weight',
48
- leftHelperLetterSpacing: '--plasma-range__left-helper-letter-spacing',
49
- leftHelperLineHeight: '--plasma-range__left-helper-line-height',
50
- /** Прозрачность для всего компонента в состоянии disabled */
51
- disabledOpacity: '--plasma-range-disabled-opacity',
52
- /** Цвет обводки поля ввода при фокусе */
53
- focusColor: '--plasma-range-focus-color',
54
- /** Токены полей ввода */
55
- textFieldColor: '--plasma-range-textfield-color',
56
- textFieldFocusColor: '--plasma-range-textfield-focus-color',
57
- textFieldPlaceholderColor: '--plasma-range-textfield-placeholder-color',
58
- textFieldCaretColor: '--plasma-range-textfield-caret-color',
59
- textFieldBackgroundColor: '--plasma-range-textfield-background-color',
60
- textFieldBackgroundColorHover: '--plasma-range-textfield-background-color-hover',
61
- textFieldBackgroundColorFocus: '--plasma-range-textfield-background-color-focus',
62
- textFieldBackgroundErrorColor: '--plasma-range-textfield-background-color-error',
63
- textFieldBackgroundErrorColorHover: '--plasma-range-textfield-background-color-error-hover',
64
- textFieldBackgroundErrorColorFocus: '--plasma-range-textfield-background-color-error-focus',
65
- textFieldBackgroundSuccessColor: '--plasma-range-textfield-background-color-success',
66
- textFieldBackgroundSuccessColorHover: '--plasma-range-textfield-background-color-success-hover',
67
- textFieldBackgroundSuccessColorFocus: '--plasma-range-textfield-background-color-success-focus',
68
- textFieldBorderColor: '--plasma-range-textfield-border-color',
69
- textFieldBorderColorHover: '--plasma-range-textfield-border-color-hover',
70
- textFieldBorderColorFocus: '--plasma-range-textfield-border-color-focus',
71
- textFieldBorderColorError: '--plasma-range-textfield-border-color-error',
72
- textFieldBorderColorErrorHover: '--plasma-range-textfield-border-color-error-hover',
73
- textFieldBorderColorErrorFocus: '--plasma-range-textfield-border-color-error-focus',
74
- textFieldBorderColorSuccess: '--plasma-range-textfield-border-color-success',
75
- textFieldBorderColorSuccessHover: '--plasma-range-textfield-border-color-success-hover',
76
- textFieldBorderColorSuccessFocus: '--plasma-range-textfield-border-color-success-focus',
77
- textFieldColorReadOnly: '--plasma-range-textfield-color-readonly',
78
- textFieldBackgroundColorReadOnly: '--plasma-range-textfield-background-color-readonly',
79
- textFieldBorderColorReadOnly: '--plasma-range-textfield-border-color-readonly',
80
- textFieldPlaceholderColorReadOnly: '--plasma-range-textfield-placeholder-color-readonly',
81
- textFieldHeight: '--plasma-range-textfield-height',
82
- textFieldBorderWidth: '--plasma-range-textfield-border-width',
83
- textFieldBorderRadius: '--plasma-range-textfield-border-radius',
84
- textFieldPadding: '--plasma-range-textfield-padding',
85
- textFieldLeftContentMargin: '--plasma-range-textfield__left-content-margin',
86
- textFieldRightContentMargin: '--plasma-range-textfield__right-content-margin',
87
- textFieldFontFamily: '--plasma-range-textfield-font-family',
88
- textFieldFontStyle: '--plasma-range-textfield-font-style',
89
- textFieldFontSize: '--plasma-range-textfield-font-size',
90
- textFieldFontWeight: '--plasma-range-textfield-font-weight',
91
- textFieldLetterSpacing: '--plasma-range-textfield-letter-spacing',
92
- textFieldLineHeight: '--plasma-range-textfield-line-height',
93
- textFieldTextBeforeColor: '--plasma-range-textfield__before-text-color',
94
- textFieldTextAfterColor: '--plasma-range-textfield__after-text-color',
95
- textFieldTextBeforeMargin: '--plasma-range-textfield__before-text-margin',
96
- textFieldTextAfterMargin: '--plasma-range-textfield__after-text-margin'
97
- };
@@ -1 +0,0 @@
1
- export {};
@@ -1,2 +0,0 @@
1
- export { rangeRoot, rangeConfig } from './Range';
2
- export { tokens as rangeTokens } from './Range.tokens';
@@ -1,16 +0,0 @@
1
- export var getChangeHandler = function getChangeHandler(changeHandler, disabled, readOnly) {
2
- return function (event) {
3
- if (disabled || readOnly) {
4
- return;
5
- }
6
- changeHandler === null || changeHandler === void 0 || changeHandler(event, event.target.value);
7
- };
8
- };
9
- export var getSearchHandler = function getSearchHandler(searchHandler, disabled, readOnly) {
10
- return function (value, event) {
11
- if (disabled || readOnly) {
12
- return;
13
- }
14
- searchHandler === null || searchHandler === void 0 || searchHandler(event, value);
15
- };
16
- };
@@ -1,3 +0,0 @@
1
- import { css } from 'styled-components';
2
- import { tokens } from '../../Range.tokens';
3
- export var base = /*#__PURE__*/css(["&[disabled]{opacity:var(", ");cursor:not-allowed;}"], tokens.disabledOpacity);
@@ -1,4 +0,0 @@
1
- {
2
- "type": "boolean",
3
- "tokens": ["--plasma-range-disabled-opacity"]
4
- }
@@ -1,4 +0,0 @@
1
- import { css } from 'styled-components';
2
- import { tokens } from '../../Range.tokens';
3
- import { ContentWrapper, LeftHelper, StyledLabel } from '../../Range.styles';
4
- export var base = /*#__PURE__*/css(["&[readonly]{cursor:default;", "{background:var(", ");}", "{display:block;color:var(", ");}", "{color:var(", ");}}"], ContentWrapper, tokens.backgroundReadOnly, StyledLabel, tokens.labelColorReadOnly, LeftHelper, tokens.leftHelperColorReadOnly);
@@ -1,4 +0,0 @@
1
- {
2
- "type": "boolean",
3
- "tokens": ["--plasma-range-background-read-only"]
4
- }
@@ -1,4 +0,0 @@
1
- import { css } from 'styled-components';
2
- import { tokens } from '../../Range.tokens';
3
- import { StyledLabel, LeftHelper, StyledContentLeft, StyledContentRight, StyledDivider, ContentWrapper } from '../../Range.styles';
4
- export var base = /*#__PURE__*/css(["", "{width:inherit;border-radius:var(", ");}", "{display:flex;align-items:center;justify-content:center;height:100%;padding:var(", ");font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");}", "{margin:var(", ");font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");}", "{margin:var(", ");}", "{margin:var(", ");}", "{margin:var(", ");font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");}"], ContentWrapper, tokens.borderRadius, StyledDivider, tokens.dividerPadding, tokens.dividerFontFamily, tokens.dividerFontSize, tokens.dividerFontStyle, tokens.dividerFontWeight, tokens.dividerLetterSpacing, tokens.dividerLineHeight, StyledLabel, tokens.labelOffset, tokens.labelFontFamily, tokens.labelFontSize, tokens.labelFontStyle, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, StyledContentLeft, tokens.leftContentMargin, StyledContentRight, tokens.rightContentMargin, LeftHelper, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontSize, tokens.leftHelperFontStyle, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight);