@itcase/ui 1.8.4 → 1.8.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (47) hide show
  1. package/dist/{Input_cjs_DkQh0Utd.js → Input_cjs_C8RWS1SD.js} +134 -38
  2. package/dist/Input_es_FXxp51gq.js +195 -0
  3. package/dist/cjs/components/DadataHintField.js +1 -1
  4. package/dist/cjs/components/DatePicker.js +1 -1
  5. package/dist/cjs/components/Input.js +1 -2
  6. package/dist/cjs/components/Select.js +18 -7
  7. package/dist/cjs/components/Switch.js +1 -1
  8. package/dist/components/DadataHintField.js +1 -1
  9. package/dist/components/DatePicker.js +1 -1
  10. package/dist/components/Input.js +1 -1
  11. package/dist/components/Select.js +18 -7
  12. package/dist/components/Switch.js +1 -1
  13. package/dist/css/components/Avatar/Avatar.css +4 -4
  14. package/dist/css/components/Choice/Choice.css +4 -0
  15. package/dist/css/components/DadataHintField/DadataHintField.css +1 -1
  16. package/dist/css/components/DatePicker/DatePicker.css +10 -12
  17. package/dist/css/components/Input/Input.css +8 -2
  18. package/dist/css/components/InputPassword/InputPassword.css +1 -1
  19. package/dist/css/components/Pagination/Pagination.css +3 -3
  20. package/dist/css/components/Switch/Switch.css +1 -1
  21. package/dist/types/components/Input/Input.appearance.d.ts +1 -2
  22. package/dist/types/components/Input/Input.interface.d.ts +1 -2
  23. package/dist/types/components/Input/appearance/inputDefault.d.ts +24 -0
  24. package/dist/types/components/Input/appearance/inputDisabled.d.ts +20 -0
  25. package/dist/types/components/Input/appearance/inputError.d.ts +20 -0
  26. package/dist/types/components/Input/appearance/inputRequire.d.ts +20 -0
  27. package/dist/types/components/Input/appearance/inputSize.d.ts +31 -0
  28. package/dist/types/components/Input/appearance/inputStyle.d.ts +14 -0
  29. package/dist/types/components/Input/appearance/inputSuccess.d.ts +20 -0
  30. package/dist/types/components/Input/index.d.ts +1 -1
  31. package/dist/types/components/Select/appearance/selectDefault.d.ts +21 -0
  32. package/dist/types/components/Select/appearance/selectSize.d.ts +11 -0
  33. package/package.json +3 -3
  34. package/dist/Input_es_Bs0gEq3L.js +0 -98
  35. package/dist/types/appearance/default/defaultAccent.d.ts +0 -33
  36. package/dist/types/appearance/default/defaultAppearance.d.ts +0 -33
  37. package/dist/types/appearance/default/defaultDanger.d.ts +0 -33
  38. package/dist/types/appearance/default/defaultDisabled.d.ts +0 -33
  39. package/dist/types/appearance/default/defaultError.d.ts +0 -33
  40. package/dist/types/appearance/default/defaultInfo.d.ts +0 -33
  41. package/dist/types/appearance/default/defaultPrimary.d.ts +0 -33
  42. package/dist/types/appearance/default/defaultSecondary.d.ts +0 -33
  43. package/dist/types/appearance/default/defaultSuccess.d.ts +0 -33
  44. package/dist/types/appearance/default/defaultSurface.d.ts +0 -33
  45. package/dist/types/appearance/default/defaultWarning.d.ts +0 -33
  46. package/dist/types/appearance/index.d.ts +0 -12
  47. package/dist/types/appearance/styleAppearance.d.ts +0 -14
@@ -6,64 +6,161 @@ var React = require('react');
6
6
  var clsx = require('clsx');
7
7
  var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
8
8
 
9
- var inputAppearance = {
10
- dev: {
11
- size: 'm',
9
+ var inputAppearanceDefault = {
10
+ defaultPrimary: {
11
+ fill: 'surfaceSecondary',
12
12
  borderColor: 'surfaceBorderTertiary',
13
+ borderHover: 'surfaceBorderQuaternary',
14
+ iconBeforeFill: 'surfaceItemQuaternary',
15
+ iconClearFill: 'surfaceItemPrimary',
13
16
  textColor: 'surfaceTextPrimary',
14
- textSize: 'm',
17
+ textColorDisabled: 'surfaceTextDisabled',
18
+ caret: 'secondaryItemSecondary',
19
+ },
20
+ defaultSecondary: {
21
+ fill: 'surfacePrimary',
22
+ borderColor: 'surfaceBorderTertiary',
23
+ borderHover: 'surfaceBorderQuaternary',
24
+ iconBeforeFill: 'surfaceItemQuaternary',
25
+ iconClearFill: 'surfaceItemPrimary',
15
26
  placeholderTextColor: 'surfaceTextSecondary',
16
- shape: 'rounded',
27
+ textColor: 'surfaceTextPrimary',
28
+ textColorDisabled: 'surfaceTextDisabled',
29
+ caret: 'secondaryItemSecondary',
17
30
  },
18
31
  };
19
- var inputState = {
20
- filled: {
21
- borderColor: 'surfaceBorderQuaternary',
22
- textColor: 'surfaceTextPrimary',
32
+
33
+ var inputAppearanceDisabled = {
34
+ disabledPrimary: {
35
+ fill: 'surfaceFillDisabled',
36
+ borderColor: 'errorBorderQuaternary',
37
+ borderHover: 'errorBorderQuaternary',
38
+ textColor: 'surfaceTextQuaternary',
39
+ iconBeforeFill: 'errorItemQuaternary',
40
+ iconClearFill: 'errorItemPrimary',
41
+ placeholderTextColor: 'surfaceTextQuaternary',
42
+ },
43
+ disabledSecondary: {
44
+ fill: 'surfaceSecondary',
45
+ borderColor: 'surfaceBorderTertiary',
46
+ borderHover: 'surfaceBorderQuaternary',
47
+ iconBeforeFill: 'surfaceItemQuaternary',
48
+ iconClearFill: 'surfaceItemPrimary',
49
+ placeholderTextColor: 'surfaceTextSecondary',
23
50
  },
24
- disabled: {
25
- borderColor: 'surfaceBorderDisabled',
26
- borderColorHover: 'surfaceBorderDisabled',
51
+ };
52
+
53
+ var inputAppearanceError = {
54
+ errorPrimary: {
55
+ fill: 'errorTertiary',
56
+ borderColor: 'errorBorderQuaternary',
57
+ borderHover: 'errorBorderQuaternary',
27
58
  textColor: 'surfaceTextPrimary',
28
- placeholderTextColor: 'surfaceTextDisabled',
59
+ iconBeforeFill: 'errorItemQuaternary',
60
+ iconClearFill: 'errorItemPrimary',
61
+ placeholderTextColor: 'surfaceTextQuaternary',
29
62
  },
30
- error: {
31
- borderColor: 'errorBorderPrimary',
32
- placeholderTextColor: 'secondaryTextSecondary',
63
+ errorSecondary: {
64
+ fill: 'errorSecondary',
65
+ borderColor: 'errorBorderTertiary',
66
+ borderHover: 'errorBorderQuaternary',
67
+ iconBeforeFill: 'errorItemQuaternary',
68
+ iconClearFill: 'errorItemPrimary',
69
+ placeholderTextColor: 'errorTextSecondary',
33
70
  },
34
- errorFilled: {
35
- borderColor: 'errorBorderPrimary',
71
+ };
72
+
73
+ var inputAppearanceRequire = {
74
+ requirePrimary: {
75
+ fill: 'warningTertiary',
76
+ borderColor: 'warningBorderQuaternary',
77
+ borderHover: 'warningBorderQuaternary',
36
78
  textColor: 'surfaceTextPrimary',
79
+ iconBeforeFill: 'warningItemQuaternary',
80
+ iconClearFill: 'warningItemPrimary',
81
+ placeholderTextColor: 'surfaceTextQuaternary',
37
82
  },
38
- success: {
39
- borderColor: 'successBorderPrimary',
40
- textColor: 'surfaceTextPrimary',
83
+ requireSecondary: {
84
+ fill: 'surfaceSecondary',
85
+ borderColor: 'surfaceBorderTertiary',
86
+ borderHover: 'surfaceBorderQuaternary',
87
+ iconBeforeFill: 'surfaceItemQuaternary',
88
+ iconClearFill: 'surfaceItemPrimary',
89
+ placeholderTextColor: 'surfaceTextSecondary',
90
+ },
91
+ };
92
+
93
+ var inputAppearanceSize = {
94
+ sizeXXL: {
95
+ size: 'xxl',
96
+ textSize: 'l',
41
97
  },
42
- active: {
43
- borderColor: 'surfaceBorderActive',
44
- placeholderTextColor: 'secondaryTextSecondary',
98
+ sizeXL: {
99
+ size: 'xl',
100
+ textSize: 's',
45
101
  },
46
- activeFilled: {
47
- borderColor: 'surfaceBorderActive',
48
- textColor: 'surfaceTextPrimary',
102
+ sizeL: {
103
+ size: 'l',
104
+ textSize: 's',
49
105
  },
50
- normal: {
51
- borderColor: 'surfaceBorderQuaternary',
52
- placeholderTextColor: 'secondaryTextSecondary',
106
+ sizeM: {
107
+ size: 'm',
108
+ textSize: 'm',
53
109
  },
54
- readonly: {
55
- borderColor: 'surfaceBorderDisabled',
56
- textColor: 'surfaceTextPrimary',
110
+ sizeS: {
111
+ size: 's',
112
+ textSize: 's',
113
+ },
114
+ sizeXS: {
115
+ size: 'xs',
116
+ textSize: 's',
117
+ },
118
+ sizeXXS: {
119
+ size: 'xxs',
120
+ textSize: 's',
121
+ },
122
+ };
123
+
124
+ var inputAppearanceStyle = {
125
+ full: {
126
+ /* border / fill */
57
127
  },
58
- require: {
59
- borderColor: 'surfaceBorderActive',
128
+ ghost: {
129
+ fill: 'none',
130
+ borderWidth: '0',
131
+ },
132
+ outlined: {
133
+ fill: 'none',
134
+ },
135
+ solid: {
136
+ borderWidth: '0',
137
+ },
138
+ };
139
+
140
+ var inputAppearanceSuccess = {
141
+ successPrimary: {
142
+ fill: 'successTertiary',
143
+ borderColor: 'successBorderQuaternary',
144
+ borderHover: 'successBorderQuaternary',
60
145
  textColor: 'surfaceTextPrimary',
146
+ iconBeforeFill: 'successItemQuaternary',
147
+ iconClearFill: 'successItemPrimary',
148
+ placeholderTextColor: 'surfaceTextQuaternary',
149
+ },
150
+ successSecondary: {
151
+ fill: 'surfaceSecondary',
152
+ borderColor: 'surfaceBorderTertiary',
153
+ borderHover: 'surfaceBorderQuaternary',
154
+ iconBeforeFill: 'surfaceItemQuaternary',
155
+ iconClearFill: 'surfaceItemPrimary',
156
+ placeholderTextColor: 'surfaceTextSecondary',
61
157
  },
62
158
  };
63
159
 
160
+ var inputAppearance = tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign({}, inputAppearanceDefault), inputAppearanceError), inputAppearanceSuccess), inputAppearanceRequire), inputAppearanceDisabled), inputAppearanceSize), inputAppearanceStyle);
161
+
64
162
  var inputConfig = {
65
163
  appearance: inputAppearance,
66
- state: inputState,
67
164
  setAppearance: function (appearanceConfig) {
68
165
  inputConfig.appearance = appearanceConfig;
69
166
  },
@@ -80,7 +177,7 @@ var Input = React.forwardRef(function Input(props, ref) {
80
177
  // const stateConfig = state && inputConfig.state && inputConfig.state[state]
81
178
  var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
82
179
  var fillClass = propsGenerator.fillClass, fillDisabledClass = propsGenerator.fillDisabledClass, fillHoverClass = propsGenerator.fillHoverClass, borderColorClass = propsGenerator.borderColorClass, borderColorDisabledClass = propsGenerator.borderColorDisabledClass, borderWidthClass = propsGenerator.borderWidthClass, borderWidthDisabledClass = propsGenerator.borderWidthDisabledClass, textColorClass = propsGenerator.textColorClass, textColorDisabledClass = propsGenerator.textColorDisabledClass, textSizeClass = propsGenerator.textSizeClass, textWeightClass = propsGenerator.textWeightClass, placeholderTextColorDisabledClass = propsGenerator.placeholderTextColorDisabledClass, caretClass = propsGenerator.caretClass, placeholderTextColorClass = propsGenerator.placeholderTextColorClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
83
- return (jsxRuntime.jsx("input", { id: String(id), className: clsx(className, 'input', type === 'number' && 'input_type_number', (textSizeClass || textColorClass || textWeightClass) && 'text', caretClass && "caret-color_".concat(caretClass), shapeClass && "input_shape_".concat(shapeClass), textSizeClass && "text_size_".concat(textSizeClass), textWeightClass && "text-weight_".concat(textWeightClass), widthClass && "width_".concat(widthClass), sizeClass && "input_size_".concat(sizeClass), textColorClass && "text-color_".concat(textColorClass), !isDisabled
180
+ return (jsxRuntime.jsx("input", { id: String(id), className: clsx(className, 'input', type === 'number' && 'input_type_number', (textSizeClass || textColorClass || textWeightClass) && 'text', caretClass && "caret-color_".concat(caretClass), shapeClass && "input_shape_".concat(shapeClass), textColorClass && "text-color_".concat(textColorClass), textSizeClass && "text_size_".concat(textSizeClass), textWeightClass && "text-weight_".concat(textWeightClass), widthClass && "width_".concat(widthClass), sizeClass && "input_size_".concat(sizeClass), !isDisabled
84
181
  ? fillClass && "fill_".concat(fillClass)
85
182
  : fillDisabledClass && "fill_disabled_".concat(fillDisabledClass), !isDisabled
86
183
  ? borderWidthClass && "border-width_".concat(borderWidthClass)
@@ -100,4 +197,3 @@ var Input = React.forwardRef(function Input(props, ref) {
100
197
  exports.Input = Input;
101
198
  exports.inputAppearance = inputAppearance;
102
199
  exports.inputConfig = inputConfig;
103
- exports.inputState = inputState;
@@ -0,0 +1,195 @@
1
+ import { _ as __assign } from './tslib.es6_es_Bwu1Cn-t.js';
2
+ import { jsx } from 'react/jsx-runtime';
3
+ import React from 'react';
4
+ import clsx from 'clsx';
5
+ import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
6
+
7
+ var inputAppearanceDefault = {
8
+ defaultPrimary: {
9
+ fill: 'surfaceSecondary',
10
+ borderColor: 'surfaceBorderTertiary',
11
+ borderHover: 'surfaceBorderQuaternary',
12
+ iconBeforeFill: 'surfaceItemQuaternary',
13
+ iconClearFill: 'surfaceItemPrimary',
14
+ textColor: 'surfaceTextPrimary',
15
+ textColorDisabled: 'surfaceTextDisabled',
16
+ caret: 'secondaryItemSecondary',
17
+ },
18
+ defaultSecondary: {
19
+ fill: 'surfacePrimary',
20
+ borderColor: 'surfaceBorderTertiary',
21
+ borderHover: 'surfaceBorderQuaternary',
22
+ iconBeforeFill: 'surfaceItemQuaternary',
23
+ iconClearFill: 'surfaceItemPrimary',
24
+ placeholderTextColor: 'surfaceTextSecondary',
25
+ textColor: 'surfaceTextPrimary',
26
+ textColorDisabled: 'surfaceTextDisabled',
27
+ caret: 'secondaryItemSecondary',
28
+ },
29
+ };
30
+
31
+ var inputAppearanceDisabled = {
32
+ disabledPrimary: {
33
+ fill: 'surfaceFillDisabled',
34
+ borderColor: 'errorBorderQuaternary',
35
+ borderHover: 'errorBorderQuaternary',
36
+ textColor: 'surfaceTextQuaternary',
37
+ iconBeforeFill: 'errorItemQuaternary',
38
+ iconClearFill: 'errorItemPrimary',
39
+ placeholderTextColor: 'surfaceTextQuaternary',
40
+ },
41
+ disabledSecondary: {
42
+ fill: 'surfaceSecondary',
43
+ borderColor: 'surfaceBorderTertiary',
44
+ borderHover: 'surfaceBorderQuaternary',
45
+ iconBeforeFill: 'surfaceItemQuaternary',
46
+ iconClearFill: 'surfaceItemPrimary',
47
+ placeholderTextColor: 'surfaceTextSecondary',
48
+ },
49
+ };
50
+
51
+ var inputAppearanceError = {
52
+ errorPrimary: {
53
+ fill: 'errorTertiary',
54
+ borderColor: 'errorBorderQuaternary',
55
+ borderHover: 'errorBorderQuaternary',
56
+ textColor: 'surfaceTextPrimary',
57
+ iconBeforeFill: 'errorItemQuaternary',
58
+ iconClearFill: 'errorItemPrimary',
59
+ placeholderTextColor: 'surfaceTextQuaternary',
60
+ },
61
+ errorSecondary: {
62
+ fill: 'errorSecondary',
63
+ borderColor: 'errorBorderTertiary',
64
+ borderHover: 'errorBorderQuaternary',
65
+ iconBeforeFill: 'errorItemQuaternary',
66
+ iconClearFill: 'errorItemPrimary',
67
+ placeholderTextColor: 'errorTextSecondary',
68
+ },
69
+ };
70
+
71
+ var inputAppearanceRequire = {
72
+ requirePrimary: {
73
+ fill: 'warningTertiary',
74
+ borderColor: 'warningBorderQuaternary',
75
+ borderHover: 'warningBorderQuaternary',
76
+ textColor: 'surfaceTextPrimary',
77
+ iconBeforeFill: 'warningItemQuaternary',
78
+ iconClearFill: 'warningItemPrimary',
79
+ placeholderTextColor: 'surfaceTextQuaternary',
80
+ },
81
+ requireSecondary: {
82
+ fill: 'surfaceSecondary',
83
+ borderColor: 'surfaceBorderTertiary',
84
+ borderHover: 'surfaceBorderQuaternary',
85
+ iconBeforeFill: 'surfaceItemQuaternary',
86
+ iconClearFill: 'surfaceItemPrimary',
87
+ placeholderTextColor: 'surfaceTextSecondary',
88
+ },
89
+ };
90
+
91
+ var inputAppearanceSize = {
92
+ sizeXXL: {
93
+ size: 'xxl',
94
+ textSize: 'l',
95
+ },
96
+ sizeXL: {
97
+ size: 'xl',
98
+ textSize: 's',
99
+ },
100
+ sizeL: {
101
+ size: 'l',
102
+ textSize: 's',
103
+ },
104
+ sizeM: {
105
+ size: 'm',
106
+ textSize: 'm',
107
+ },
108
+ sizeS: {
109
+ size: 's',
110
+ textSize: 's',
111
+ },
112
+ sizeXS: {
113
+ size: 'xs',
114
+ textSize: 's',
115
+ },
116
+ sizeXXS: {
117
+ size: 'xxs',
118
+ textSize: 's',
119
+ },
120
+ };
121
+
122
+ var inputAppearanceStyle = {
123
+ full: {
124
+ /* border / fill */
125
+ },
126
+ ghost: {
127
+ fill: 'none',
128
+ borderWidth: '0',
129
+ },
130
+ outlined: {
131
+ fill: 'none',
132
+ },
133
+ solid: {
134
+ borderWidth: '0',
135
+ },
136
+ };
137
+
138
+ var inputAppearanceSuccess = {
139
+ successPrimary: {
140
+ fill: 'successTertiary',
141
+ borderColor: 'successBorderQuaternary',
142
+ borderHover: 'successBorderQuaternary',
143
+ textColor: 'surfaceTextPrimary',
144
+ iconBeforeFill: 'successItemQuaternary',
145
+ iconClearFill: 'successItemPrimary',
146
+ placeholderTextColor: 'surfaceTextQuaternary',
147
+ },
148
+ successSecondary: {
149
+ fill: 'surfaceSecondary',
150
+ borderColor: 'surfaceBorderTertiary',
151
+ borderHover: 'surfaceBorderQuaternary',
152
+ iconBeforeFill: 'surfaceItemQuaternary',
153
+ iconClearFill: 'surfaceItemPrimary',
154
+ placeholderTextColor: 'surfaceTextSecondary',
155
+ },
156
+ };
157
+
158
+ var inputAppearance = __assign(__assign(__assign(__assign(__assign(__assign(__assign({}, inputAppearanceDefault), inputAppearanceError), inputAppearanceSuccess), inputAppearanceRequire), inputAppearanceDisabled), inputAppearanceSize), inputAppearanceStyle);
159
+
160
+ var inputConfig = {
161
+ appearance: inputAppearance,
162
+ setAppearance: function (appearanceConfig) {
163
+ inputConfig.appearance = appearanceConfig;
164
+ },
165
+ setState: function (newComponent) {
166
+ inputConfig.state = newComponent;
167
+ },
168
+ };
169
+ var Input = React.forwardRef(function Input(props, ref) {
170
+ var id = props.id, className = props.className, _a = props.type, type = _a === void 0 ? 'text' : _a, name = props.name, appearance = props.appearance, isDisabled = props.isDisabled, autocomplete = props.autocomplete, dataTestId = props.dataTestId, index = props.index, placeholder = props.placeholder, value = props.value, onBlur = props.onBlur, onChange = props.onChange, onFocus = props.onFocus, onKeyDown = props.onKeyDown;
171
+ var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultConfig, appearanceKey) {
172
+ var _a;
173
+ return (__assign(__assign({}, resultConfig), (_a = inputConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
174
+ }, {});
175
+ // const stateConfig = state && inputConfig.state && inputConfig.state[state]
176
+ var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
177
+ var fillClass = propsGenerator.fillClass, fillDisabledClass = propsGenerator.fillDisabledClass, fillHoverClass = propsGenerator.fillHoverClass, borderColorClass = propsGenerator.borderColorClass, borderColorDisabledClass = propsGenerator.borderColorDisabledClass, borderWidthClass = propsGenerator.borderWidthClass, borderWidthDisabledClass = propsGenerator.borderWidthDisabledClass, textColorClass = propsGenerator.textColorClass, textColorDisabledClass = propsGenerator.textColorDisabledClass, textSizeClass = propsGenerator.textSizeClass, textWeightClass = propsGenerator.textWeightClass, placeholderTextColorDisabledClass = propsGenerator.placeholderTextColorDisabledClass, caretClass = propsGenerator.caretClass, placeholderTextColorClass = propsGenerator.placeholderTextColorClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
178
+ return (jsx("input", { id: String(id), className: clsx(className, 'input', type === 'number' && 'input_type_number', (textSizeClass || textColorClass || textWeightClass) && 'text', caretClass && "caret-color_".concat(caretClass), shapeClass && "input_shape_".concat(shapeClass), textColorClass && "text-color_".concat(textColorClass), textSizeClass && "text_size_".concat(textSizeClass), textWeightClass && "text-weight_".concat(textWeightClass), widthClass && "width_".concat(widthClass), sizeClass && "input_size_".concat(sizeClass), !isDisabled
179
+ ? fillClass && "fill_".concat(fillClass)
180
+ : fillDisabledClass && "fill_disabled_".concat(fillDisabledClass), !isDisabled
181
+ ? borderWidthClass && "border-width_".concat(borderWidthClass)
182
+ : borderWidthDisabledClass &&
183
+ "border-width_disabled_".concat(borderWidthDisabledClass), !isDisabled ? fillHoverClass && "fill_hover_".concat(fillHoverClass) : null, !isDisabled
184
+ ? borderColorClass && "border-color_".concat(borderColorClass)
185
+ : borderColorDisabledClass &&
186
+ "border-color_disabled_".concat(borderColorDisabledClass), !isDisabled
187
+ ? placeholderTextColorClass &&
188
+ "placeholder-text-color_".concat(placeholderTextColorClass)
189
+ : placeholderTextColorDisabledClass &&
190
+ "placeholder-text-color_disabled_".concat(placeholderTextColorDisabledClass), !isDisabled
191
+ ? textColorClass && "text-color_".concat(textColorClass)
192
+ : textColorDisabledClass && "text-color_".concat(textColorDisabledClass)), type: type, disabled: isDisabled, autocomplete: autocomplete, "data-test-id": dataTestId || (name ? "".concat(name, "Input") : 'input'), index: index, placeholder: placeholder, ref: ref, value: value, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }));
193
+ });
194
+
195
+ export { Input as I, inputAppearance as a, inputConfig as i };
@@ -5,7 +5,7 @@ var jsxRuntime = require('react/jsx-runtime');
5
5
  var React = require('react');
6
6
  var clsx = require('clsx');
7
7
  var reactDadata = require('react-dadata');
8
- var Input = require('../../Input_cjs_DkQh0Utd.js');
8
+ var Input = require('../../Input_cjs_C8RWS1SD.js');
9
9
  require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
10
10
  require('lodash/camelCase');
11
11
  require('lodash/castArray');
@@ -10,7 +10,7 @@ var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevic
10
10
  var useStyles = require('../hooks/useStyles/useStyles.js');
11
11
  var Button = require('../../Button_cjs_B7OmqizJ.js');
12
12
  var Icon = require('../../Icon_cjs_DSzfNqif.js');
13
- var Input = require('../../Input_cjs_DkQh0Utd.js');
13
+ var Input = require('../../Input_cjs_C8RWS1SD.js');
14
14
  var Label = require('../../Label_cjs_BCjB-mxC.js');
15
15
  var Text = require('../../Text_cjs_D4xG0cKD.js');
16
16
  require('lodash/camelCase');
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var Input = require('../../Input_cjs_DkQh0Utd.js');
3
+ var Input = require('../../Input_cjs_C8RWS1SD.js');
4
4
  require('../../tslib.es6_cjs_CCZ3TN_7.js');
5
5
  require('react/jsx-runtime');
6
6
  require('react');
@@ -22,4 +22,3 @@ require('../utils/setViewportProperty.js');
22
22
  exports.Input = Input.Input;
23
23
  exports.inputAppearance = Input.inputAppearance;
24
24
  exports.inputConfig = Input.inputConfig;
25
- exports.inputState = Input.inputState;
@@ -40,29 +40,40 @@ var SelectClearIndicator = function (props) {
40
40
  return (jsxRuntime.jsx(Select.components.ClearIndicator, tslib_es6.__assign({}, props, { children: clearIcon ? (jsxRuntime.jsx(Icon.Icon, { iconFill: clearIconFill, SvgImage: clearIcon })) : (children) })));
41
41
  };
42
42
 
43
- var selectAppearance = {
44
- dev: {
45
- size: 'normal',
43
+ var selectAppearanceDefault = {
44
+ defaultPrimary: {
46
45
  elevation: 8,
47
46
  inputBorderColor: 'surfaceBorderTertiary',
48
47
  inputBorderColorHover: 'surfaceBorderQuaternary',
49
48
  inputFill: 'surfacePrimary',
50
49
  inputShape: 'rounded',
51
50
  inputTextColor: 'surfaceTextPrimary',
52
- inputTextSize: 'm',
51
+ multipleItemFill: 'surfaceSecondary',
52
+ multipleItemFillHover: 'surfaceHover',
53
+ multipleTextColor: 'accentTextPrimary',
53
54
  noOptionsText: 'Ничего не найдено...',
54
55
  noOptionsTextColor: 'surfaceTextPrimary',
55
- noOptionsTextSize: 'm',
56
56
  optionFill: 'surfacePrimary',
57
57
  optionFillHover: 'surfacePrimaryHover',
58
58
  optionTextColor: 'surfaceTextPrimary',
59
- optionTextSize: 'm',
60
59
  placeholder: 'Выбрать...',
61
- placeholderTextColor: 'surfaceTextSecondary',
60
+ placeholderTextColor: 'surfaceTextQuaternary',
61
+ },
62
+ };
63
+
64
+ var selectAppearanceSize = {
65
+ sizeM: {
66
+ size: 'm',
67
+ inputTextSize: 'm',
68
+ multipleItemTextSize: 'm',
69
+ noOptionsTextSize: 'm',
70
+ optionTextSize: 'm',
62
71
  placeholderTextSize: 'm',
63
72
  },
64
73
  };
65
74
 
75
+ var selectAppearance = tslib_es6.__assign(tslib_es6.__assign({}, selectAppearanceDefault), selectAppearanceSize);
76
+
66
77
  var SelectControl = function (props) {
67
78
  var _a = props.selectProps, inputBorderColor = _a.inputBorderColor, inputBorderColorHover = _a.inputBorderColorHover, inputFill = _a.inputFill, inputShape = _a.inputShape, before = _a.before, after = _a.after;
68
79
  return (jsxRuntime.jsxs(React.Fragment, { children: [before, jsxRuntime.jsx(Select.components.Control, tslib_es6.__assign({}, props, { className: clsx('select__control', inputFill, inputShape, inputBorderColor && "border-color_".concat(inputBorderColor), inputBorderColorHover &&
@@ -34,7 +34,7 @@ var Switch = React.forwardRef(function Switch(props, ref) {
34
34
  var id = props.id, className = props.className, appearance = props.appearance, _a = props.align, align = _a === void 0 ? 'left' : _a, size = props.size, title = props.title, desc = props.desc, disabled = props.disabled, checked = props.checked, onChange = props.onChange;
35
35
  var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultConfig, appearanceKey) {
36
36
  var _a;
37
- return (tslib_es6.__assign(tslib_es6.__assign({}, resultConfig), (_a = segmentedConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
37
+ return (tslib_es6.__assign(tslib_es6.__assign({}, resultConfig), (_a = switchConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
38
38
  }, {});
39
39
  var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
40
40
  var titleTextColor = propsGenerator.titleTextColor, titleTextSize = propsGenerator.titleTextSize, descTextColor = propsGenerator.descTextColor, descTextSize = propsGenerator.descTextSize;
@@ -3,7 +3,7 @@ import { jsx } from 'react/jsx-runtime';
3
3
  import { useMemo } from 'react';
4
4
  import clsx from 'clsx';
5
5
  import { PartySuggestions } from 'react-dadata';
6
- import { I as Input } from '../Input_es_Bs0gEq3L.js';
6
+ import { I as Input } from '../Input_es_FXxp51gq.js';
7
7
  import '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
8
8
  import 'lodash/camelCase';
9
9
  import 'lodash/castArray';
@@ -8,7 +8,7 @@ import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDev
8
8
  import { useStyles } from '../hooks/useStyles/useStyles.js';
9
9
  import { B as Button } from '../Button_es_CBbHMy1v.js';
10
10
  import { I as Icon } from '../Icon_es_BBmoZ7_3.js';
11
- import { I as Input } from '../Input_es_Bs0gEq3L.js';
11
+ import { I as Input } from '../Input_es_FXxp51gq.js';
12
12
  import { L as Label } from '../Label_es_CZpanSdR.js';
13
13
  import { T as Text } from '../Text_es_FJGduy7Z.js';
14
14
  import 'lodash/camelCase';
@@ -1,4 +1,4 @@
1
- export { I as Input, a as inputAppearance, i as inputConfig, b as inputState } from '../Input_es_Bs0gEq3L.js';
1
+ export { I as Input, a as inputAppearance, i as inputConfig } from '../Input_es_FXxp51gq.js';
2
2
  import '../tslib.es6_es_Bwu1Cn-t.js';
3
3
  import 'react/jsx-runtime';
4
4
  import 'react';
@@ -38,29 +38,40 @@ var SelectClearIndicator = function (props) {
38
38
  return (jsx(components.ClearIndicator, __assign({}, props, { children: clearIcon ? (jsx(Icon, { iconFill: clearIconFill, SvgImage: clearIcon })) : (children) })));
39
39
  };
40
40
 
41
- var selectAppearance = {
42
- dev: {
43
- size: 'normal',
41
+ var selectAppearanceDefault = {
42
+ defaultPrimary: {
44
43
  elevation: 8,
45
44
  inputBorderColor: 'surfaceBorderTertiary',
46
45
  inputBorderColorHover: 'surfaceBorderQuaternary',
47
46
  inputFill: 'surfacePrimary',
48
47
  inputShape: 'rounded',
49
48
  inputTextColor: 'surfaceTextPrimary',
50
- inputTextSize: 'm',
49
+ multipleItemFill: 'surfaceSecondary',
50
+ multipleItemFillHover: 'surfaceHover',
51
+ multipleTextColor: 'accentTextPrimary',
51
52
  noOptionsText: 'Ничего не найдено...',
52
53
  noOptionsTextColor: 'surfaceTextPrimary',
53
- noOptionsTextSize: 'm',
54
54
  optionFill: 'surfacePrimary',
55
55
  optionFillHover: 'surfacePrimaryHover',
56
56
  optionTextColor: 'surfaceTextPrimary',
57
- optionTextSize: 'm',
58
57
  placeholder: 'Выбрать...',
59
- placeholderTextColor: 'surfaceTextSecondary',
58
+ placeholderTextColor: 'surfaceTextQuaternary',
59
+ },
60
+ };
61
+
62
+ var selectAppearanceSize = {
63
+ sizeM: {
64
+ size: 'm',
65
+ inputTextSize: 'm',
66
+ multipleItemTextSize: 'm',
67
+ noOptionsTextSize: 'm',
68
+ optionTextSize: 'm',
60
69
  placeholderTextSize: 'm',
61
70
  },
62
71
  };
63
72
 
73
+ var selectAppearance = __assign(__assign({}, selectAppearanceDefault), selectAppearanceSize);
74
+
64
75
  var SelectControl = function (props) {
65
76
  var _a = props.selectProps, inputBorderColor = _a.inputBorderColor, inputBorderColorHover = _a.inputBorderColorHover, inputFill = _a.inputFill, inputShape = _a.inputShape, before = _a.before, after = _a.after;
66
77
  return (jsxs(React.Fragment, { children: [before, jsx(components.Control, __assign({}, props, { className: clsx('select__control', inputFill, inputShape, inputBorderColor && "border-color_".concat(inputBorderColor), inputBorderColorHover &&
@@ -32,7 +32,7 @@ var Switch = React.forwardRef(function Switch(props, ref) {
32
32
  var id = props.id, className = props.className, appearance = props.appearance, _a = props.align, align = _a === void 0 ? 'left' : _a, size = props.size, title = props.title, desc = props.desc, disabled = props.disabled, checked = props.checked, onChange = props.onChange;
33
33
  var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultConfig, appearanceKey) {
34
34
  var _a;
35
- return (__assign(__assign({}, resultConfig), (_a = segmentedConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
35
+ return (__assign(__assign({}, resultConfig), (_a = switchConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
36
36
  }, {});
37
37
  var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
38
38
  var titleTextColor = propsGenerator.titleTextColor, titleTextSize = propsGenerator.titleTextSize, descTextColor = propsGenerator.descTextColor, descTextSize = propsGenerator.descTextSize;
@@ -82,11 +82,11 @@
82
82
  justify-content: center;
83
83
  align-items: center;
84
84
  ^^^&__image {
85
- width: $(size) px;
86
- height: $(size) px;
85
+ width: $(size)px;
86
+ height: $(size)px;
87
87
  & .image__item {
88
- width: $(size) px;
89
- height: $(size) px;
88
+ width: $(size)px;
89
+ height: $(size)px;
90
90
  }
91
91
  }
92
92
  }
@@ -66,9 +66,13 @@
66
66
  display: flex;
67
67
  &__before {
68
68
  margin: 2px 0;
69
+ display: flex;
70
+ align-items: center;
69
71
  }
70
72
  &__after {
71
73
  margin: 2px 0;
74
+ display: flex;
75
+ align-items: center;
72
76
  }
73
77
  }
74
78
  .choice {
@@ -23,7 +23,7 @@
23
23
  }
24
24
  }
25
25
  &--highlighted {
26
- color: var(--color-accent-primary);
26
+ color: var(--color-accent-fill-primary);
27
27
  }
28
28
  & .input_state {
29
29
  &_error {