@salutejs/sdds-dfa 0.370.0-dev.0 → 0.371.0
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.
- package/README.md +5 -5
- package/dist/styled-components/cjs/components/Autocomplete/Autocomplete.clear.config.js +706 -0
- package/dist/styled-components/cjs/components/Autocomplete/Autocomplete.config.js +40 -0
- package/dist/styled-components/cjs/components/Autocomplete/Autocomplete.js +14 -1
- package/dist/styled-components/cjs/components/DatePicker/DatePicker.clear.config.js +5 -0
- package/dist/styled-components/cjs/components/DatePicker/DatePicker.config.js +5 -0
- package/dist/styled-components/cjs/components/DateTimePicker/DateTimePicker.config.js +5 -0
- package/dist/styled-components/cjs/components/Range/Range.clear.config.js +5 -0
- package/dist/styled-components/cjs/components/Range/Range.config.js +5 -0
- package/dist/styled-components/cjs/components/Select/Select.clear.config.js +1258 -0
- package/dist/styled-components/cjs/components/Select/Select.config.js +39 -0
- package/dist/styled-components/cjs/components/Select/Select.js +8 -1
- package/dist/styled-components/cjs/components/TextArea/TextArea.clear.config.js +5 -0
- package/dist/styled-components/cjs/components/TextArea/TextArea.config.js +5 -0
- package/dist/styled-components/cjs/components/TextField/TextField.clear.config.js +23 -3
- package/dist/styled-components/cjs/components/TextField/TextField.config.js +5 -0
- package/dist/styled-components/cjs/components/TimePicker/TimePicker.config.js +37 -0
- package/dist/styled-components/es/components/Autocomplete/Autocomplete.clear.config.js +696 -0
- package/dist/styled-components/es/components/Autocomplete/Autocomplete.config.js +40 -0
- package/dist/styled-components/es/components/Autocomplete/Autocomplete.js +9 -2
- package/dist/styled-components/es/components/DatePicker/DatePicker.clear.config.js +5 -0
- package/dist/styled-components/es/components/DatePicker/DatePicker.config.js +5 -0
- package/dist/styled-components/es/components/DateTimePicker/DateTimePicker.config.js +5 -0
- package/dist/styled-components/es/components/Range/Range.clear.config.js +5 -0
- package/dist/styled-components/es/components/Range/Range.config.js +5 -0
- package/dist/styled-components/es/components/Select/Select.clear.config.js +1248 -0
- package/dist/styled-components/es/components/Select/Select.config.js +39 -0
- package/dist/styled-components/es/components/Select/Select.js +9 -2
- package/dist/styled-components/es/components/TextArea/TextArea.clear.config.js +5 -0
- package/dist/styled-components/es/components/TextArea/TextArea.config.js +5 -0
- package/dist/styled-components/es/components/TextField/TextField.clear.config.js +23 -3
- package/dist/styled-components/es/components/TextField/TextField.config.js +5 -0
- package/dist/styled-components/es/components/TimePicker/TimePicker.config.js +37 -0
- package/package.json +11 -11
- package/types/components/Autocomplete/Autocomplete.clear.config.d.ts +39 -0
- package/types/components/Autocomplete/Autocomplete.d.ts +2017 -10
- package/types/components/Calendar/Calendar.d.ts +3 -1
- package/types/components/DatePicker/DatePicker.d.ts +36 -36
- package/types/components/DateTimePicker/DateTimePicker.d.ts +2 -2
- package/types/components/Select/Select.clear.config.d.ts +53 -0
- package/types/components/Select/Select.d.ts +36 -10
- package/types/components/TimePicker/TimePicker.d.ts +2 -0
|
@@ -23,6 +23,7 @@ export const config = {
|
|
|
23
23
|
${tokens.textFieldTextAfterColor}: ${textTertiary};
|
|
24
24
|
${tokens.textFieldLabelColor}: ${textPrimary};
|
|
25
25
|
${tokens.textFieldLeftHelperColor}: ${textSecondary};
|
|
26
|
+
${tokens.textFieldTitleCaptionColor}: ${textSecondary};
|
|
26
27
|
${tokens.textFieldFocusColor}: ${textAccent};
|
|
27
28
|
|
|
28
29
|
${tokens.textFieldContentSlotColor}: ${textSecondary};
|
|
@@ -70,6 +71,7 @@ export const config = {
|
|
|
70
71
|
${tokens.textFieldTextAfterColor}: ${textTertiary};
|
|
71
72
|
${tokens.textFieldLabelColor}: ${textPrimary};
|
|
72
73
|
${tokens.textFieldLeftHelperColor}: ${textPositive};
|
|
74
|
+
${tokens.textFieldTitleCaptionColor}: ${textSecondary};
|
|
73
75
|
${tokens.textFieldFocusColor}: ${textAccent};
|
|
74
76
|
|
|
75
77
|
${tokens.textFieldContentSlotColor}: ${textSecondary};
|
|
@@ -117,6 +119,7 @@ export const config = {
|
|
|
117
119
|
${tokens.textFieldTextAfterColor}: ${textTertiary};
|
|
118
120
|
${tokens.textFieldLabelColor}: ${textPrimary};
|
|
119
121
|
${tokens.textFieldLeftHelperColor}: ${textWarning};
|
|
122
|
+
${tokens.textFieldTitleCaptionColor}: ${textSecondary};
|
|
120
123
|
${tokens.textFieldFocusColor}: ${textAccent};
|
|
121
124
|
|
|
122
125
|
${tokens.textFieldContentSlotColor}: ${textSecondary};
|
|
@@ -164,6 +167,7 @@ export const config = {
|
|
|
164
167
|
${tokens.textFieldTextAfterColor}: ${textTertiary};
|
|
165
168
|
${tokens.textFieldLabelColor}: ${textPrimary};
|
|
166
169
|
${tokens.textFieldLeftHelperColor}: ${textNegative};
|
|
170
|
+
${tokens.textFieldTitleCaptionColor}: ${textSecondary};
|
|
167
171
|
${tokens.textFieldFocusColor}: ${textAccent};
|
|
168
172
|
|
|
169
173
|
${tokens.textFieldContentSlotColor}: ${textSecondary};
|
|
@@ -387,6 +391,13 @@ export const config = {
|
|
|
387
391
|
${tokens.textFieldLabelFontWeight}: ${bodyL.fontWeight};
|
|
388
392
|
${tokens.textFieldLabelLetterSpacing}: ${bodyL.letterSpacing};
|
|
389
393
|
${tokens.textFieldLabelLineHeight}: ${bodyL.lineHeight};
|
|
394
|
+
${tokens.textFieldTitleCaptionMargin}: 0.375rem;
|
|
395
|
+
${tokens.textFieldTitleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
396
|
+
${tokens.textFieldTitleCaptionFontSize}: ${bodyXS.fontSize};
|
|
397
|
+
${tokens.textFieldTitleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
398
|
+
${tokens.textFieldTitleCaptionFontWeight}: ${bodyXS.fontWeight};
|
|
399
|
+
${tokens.textFieldTitleCaptionLetterSpacing}: ${bodyXS.letterSpacing};
|
|
400
|
+
${tokens.textFieldTitleCaptionLineHeight}: ${bodyXS.lineHeight};
|
|
390
401
|
|
|
391
402
|
${tokens.textFieldHintMargin}: -0.688rem -0.5rem;
|
|
392
403
|
${tokens.textFieldHintTargetSize}: 2.375rem;
|
|
@@ -512,6 +523,13 @@ export const config = {
|
|
|
512
523
|
${tokens.textFieldLabelFontWeight}: ${bodyL.fontWeight};
|
|
513
524
|
${tokens.textFieldLabelLetterSpacing}: ${bodyL.letterSpacing};
|
|
514
525
|
${tokens.textFieldLabelLineHeight}: ${bodyL.lineHeight};
|
|
526
|
+
${tokens.textFieldTitleCaptionMargin}: 0.375rem;
|
|
527
|
+
${tokens.textFieldTitleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
528
|
+
${tokens.textFieldTitleCaptionFontSize}: ${bodyXS.fontSize};
|
|
529
|
+
${tokens.textFieldTitleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
530
|
+
${tokens.textFieldTitleCaptionFontWeight}: ${bodyXS.fontWeight};
|
|
531
|
+
${tokens.textFieldTitleCaptionLetterSpacing}: ${bodyXS.letterSpacing};
|
|
532
|
+
${tokens.textFieldTitleCaptionLineHeight}: ${bodyXS.lineHeight};
|
|
515
533
|
|
|
516
534
|
${tokens.textFieldHintMargin}: -0.688rem -0.5rem;
|
|
517
535
|
${tokens.textFieldHintTargetSize}: 2.375rem;
|
|
@@ -637,6 +655,13 @@ export const config = {
|
|
|
637
655
|
${tokens.textFieldLabelFontWeight}: ${bodyM.fontWeight};
|
|
638
656
|
${tokens.textFieldLabelLetterSpacing}: ${bodyM.letterSpacing};
|
|
639
657
|
${tokens.textFieldLabelLineHeight}: ${bodyM.lineHeight};
|
|
658
|
+
${tokens.textFieldTitleCaptionMargin}: 0.3125rem;
|
|
659
|
+
${tokens.textFieldTitleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
660
|
+
${tokens.textFieldTitleCaptionFontSize}: ${bodyXS.fontSize};
|
|
661
|
+
${tokens.textFieldTitleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
662
|
+
${tokens.textFieldTitleCaptionFontWeight}: ${bodyXS.fontWeight};
|
|
663
|
+
${tokens.textFieldTitleCaptionLetterSpacing}: ${bodyXS.letterSpacing};
|
|
664
|
+
${tokens.textFieldTitleCaptionLineHeight}: ${bodyXS.lineHeight};
|
|
640
665
|
|
|
641
666
|
${tokens.textFieldHintMargin}: -0.688rem -0.5rem;
|
|
642
667
|
${tokens.textFieldHintTargetSize}: 2.375rem;
|
|
@@ -762,6 +787,13 @@ export const config = {
|
|
|
762
787
|
${tokens.textFieldLabelFontWeight}: ${bodyS.fontWeight};
|
|
763
788
|
${tokens.textFieldLabelLetterSpacing}: ${bodyS.letterSpacing};
|
|
764
789
|
${tokens.textFieldLabelLineHeight}: ${bodyS.lineHeight};
|
|
790
|
+
${tokens.textFieldTitleCaptionMargin}: 0.1875rem;
|
|
791
|
+
${tokens.textFieldTitleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
792
|
+
${tokens.textFieldTitleCaptionFontSize}: ${bodyXS.fontSize};
|
|
793
|
+
${tokens.textFieldTitleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
794
|
+
${tokens.textFieldTitleCaptionFontWeight}: ${bodyXS.fontWeight};
|
|
795
|
+
${tokens.textFieldTitleCaptionLetterSpacing}: ${bodyXS.letterSpacing};
|
|
796
|
+
${tokens.textFieldTitleCaptionLineHeight}: ${bodyXS.lineHeight};
|
|
765
797
|
|
|
766
798
|
${tokens.textFieldHintMargin}: -0.688rem -0.5rem;
|
|
767
799
|
${tokens.textFieldHintTargetSize}: 2.375rem;
|
|
@@ -887,6 +919,13 @@ export const config = {
|
|
|
887
919
|
${tokens.textFieldLabelFontWeight}: ${bodyXS.fontWeight};
|
|
888
920
|
${tokens.textFieldLabelLetterSpacing}: ${bodyXS.letterSpacing};
|
|
889
921
|
${tokens.textFieldLabelLineHeight}: ${bodyXS.lineHeight};
|
|
922
|
+
${tokens.textFieldTitleCaptionMargin}: 0;
|
|
923
|
+
${tokens.textFieldTitleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
924
|
+
${tokens.textFieldTitleCaptionFontSize}: ${bodyXS.fontSize};
|
|
925
|
+
${tokens.textFieldTitleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
926
|
+
${tokens.textFieldTitleCaptionFontWeight}: ${bodyXS.fontWeight};
|
|
927
|
+
${tokens.textFieldTitleCaptionLetterSpacing}: ${bodyXS.letterSpacing};
|
|
928
|
+
${tokens.textFieldTitleCaptionLineHeight}: ${bodyXS.lineHeight};
|
|
890
929
|
|
|
891
930
|
${tokens.textFieldHintMargin}: -0.75rem -0.625rem -0.75rem -0.5rem;
|
|
892
931
|
${tokens.textFieldHintTargetSize}: 2.375rem;
|
|
@@ -1,8 +1,15 @@
|
|
|
1
|
-
import { selectConfig, component, mergeConfig, fixedForwardRef } from '@salutejs/plasma-new-hope/styled-components';
|
|
1
|
+
import { selectConfig, component, mergeConfig, fixedForwardRef, createConditionalComponent } from '@salutejs/plasma-new-hope/styled-components';
|
|
2
2
|
import React from 'react';
|
|
3
3
|
import { config } from './Select.config';
|
|
4
|
+
import { config as clearConfig } from './Select.clear.config';
|
|
4
5
|
const mergedConfig = mergeConfig(selectConfig, config);
|
|
5
|
-
const
|
|
6
|
+
const SelectDefault = component(mergedConfig);
|
|
7
|
+
const mergedConfigClear = mergeConfig(selectConfig, clearConfig);
|
|
8
|
+
const SelectClear = component(mergedConfigClear);
|
|
9
|
+
const SelectNewHope = createConditionalComponent({
|
|
10
|
+
default: SelectDefault,
|
|
11
|
+
clear: SelectClear
|
|
12
|
+
});
|
|
6
13
|
const SelectComponent = (props, ref)=>{
|
|
7
14
|
return /*#__PURE__*/ React.createElement(SelectNewHope, {
|
|
8
15
|
ref: ref,
|
|
@@ -226,6 +226,7 @@ export const config = {
|
|
|
226
226
|
${tokens.hintInnerLabelPlacementOffset}: 0.82rem -2.188rem auto auto;
|
|
227
227
|
|
|
228
228
|
${tokens.titleCaptionInnerLabelOffset}: 0.25rem;
|
|
229
|
+
${tokens.titleCaptionMargin}: 0.375rem;
|
|
229
230
|
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
230
231
|
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
231
232
|
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
@@ -300,6 +301,7 @@ export const config = {
|
|
|
300
301
|
${tokens.hintInnerLabelPlacementOffset}: 0.563rem -2.188rem auto auto;
|
|
301
302
|
|
|
302
303
|
${tokens.titleCaptionInnerLabelOffset}: 0.25rem;
|
|
304
|
+
${tokens.titleCaptionMargin}: 0.375rem;
|
|
303
305
|
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
304
306
|
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
305
307
|
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
@@ -374,6 +376,7 @@ export const config = {
|
|
|
374
376
|
${tokens.hintInnerLabelPlacementOffset}: 0.312rem -2.188rem auto auto;
|
|
375
377
|
|
|
376
378
|
${tokens.titleCaptionInnerLabelOffset}: 0.25rem;
|
|
379
|
+
${tokens.titleCaptionMargin}: 0.3125rem;
|
|
377
380
|
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
378
381
|
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
379
382
|
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
@@ -448,6 +451,7 @@ export const config = {
|
|
|
448
451
|
${tokens.hintInnerLabelPlacementOffset}: 0.062rem -2.188rem auto auto;
|
|
449
452
|
|
|
450
453
|
${tokens.titleCaptionInnerLabelOffset}: 0.25rem;
|
|
454
|
+
${tokens.titleCaptionMargin}: 0.1875rem;
|
|
451
455
|
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
452
456
|
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
453
457
|
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
@@ -522,6 +526,7 @@ export const config = {
|
|
|
522
526
|
${tokens.hintInnerLabelPlacementOffset}: -0.188rem -1.938rem auto auto;
|
|
523
527
|
|
|
524
528
|
${tokens.titleCaptionInnerLabelOffset}: 0.25rem;
|
|
529
|
+
${tokens.titleCaptionMargin}: 0;
|
|
525
530
|
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
526
531
|
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
527
532
|
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
@@ -244,6 +244,7 @@ export const config = {
|
|
|
244
244
|
${tokens.hintInnerLabelPlacementOffset}: 0.751rem -2.938rem auto auto;
|
|
245
245
|
|
|
246
246
|
${tokens.titleCaptionInnerLabelOffset}: 0.25rem;
|
|
247
|
+
${tokens.titleCaptionMargin}: 0.375rem;
|
|
247
248
|
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
248
249
|
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
249
250
|
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
@@ -317,6 +318,7 @@ export const config = {
|
|
|
317
318
|
${tokens.hintInnerLabelPlacementOffset}: 0.563rem -2.938rem auto auto;
|
|
318
319
|
|
|
319
320
|
${tokens.titleCaptionInnerLabelOffset}: 0.25rem;
|
|
321
|
+
${tokens.titleCaptionMargin}: 0.375rem;
|
|
320
322
|
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
321
323
|
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
322
324
|
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
@@ -392,6 +394,7 @@ export const config = {
|
|
|
392
394
|
${tokens.hintInnerLabelPlacementOffset}: 0.312rem -2.813rem auto auto;
|
|
393
395
|
|
|
394
396
|
${tokens.titleCaptionInnerLabelOffset}: 0.25rem;
|
|
397
|
+
${tokens.titleCaptionMargin}: 0.3125rem;
|
|
395
398
|
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
396
399
|
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
397
400
|
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
@@ -465,6 +468,7 @@ export const config = {
|
|
|
465
468
|
${tokens.hintInnerLabelPlacementOffset}: 0.062rem -2.688rem auto auto;
|
|
466
469
|
|
|
467
470
|
${tokens.titleCaptionInnerLabelOffset}: 0.25rem;
|
|
471
|
+
${tokens.titleCaptionMargin}: 0.1875rem;
|
|
468
472
|
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
469
473
|
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
470
474
|
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
@@ -538,6 +542,7 @@ export const config = {
|
|
|
538
542
|
${tokens.hintInnerLabelPlacementOffset}: -0.188rem -2.1875rem auto auto;
|
|
539
543
|
|
|
540
544
|
${tokens.titleCaptionInnerLabelOffset}: 0.25rem;
|
|
545
|
+
${tokens.titleCaptionMargin}: 0;
|
|
541
546
|
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
542
547
|
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
543
548
|
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
@@ -40,9 +40,11 @@ export const config = {
|
|
|
40
40
|
`,
|
|
41
41
|
positive: css`
|
|
42
42
|
${tokens.color}: ${textPositive};
|
|
43
|
+
${tokens.colorFocus}: ${textPrimary};
|
|
43
44
|
|
|
44
45
|
${tokens.placeholderColor}: ${textPositive};
|
|
45
|
-
${tokens.
|
|
46
|
+
${tokens.placeholderColorHover}: ${textSecondary};
|
|
47
|
+
${tokens.placeholderColorFocus}: ${textTertiary};
|
|
46
48
|
|
|
47
49
|
${tokens.backgroundColor}: transparent;
|
|
48
50
|
${tokens.backgroundColorHover}: transparent;
|
|
@@ -53,12 +55,15 @@ export const config = {
|
|
|
53
55
|
${tokens.labelColor}: ${textPrimary};
|
|
54
56
|
${tokens.leftHelperColor}: ${textPositive};
|
|
55
57
|
${tokens.rightHelperColor}: ${textPositive};
|
|
58
|
+
${tokens.leftHelperColorFocus}: ${textSecondary};
|
|
59
|
+
${tokens.rightHelperColorFocus}: ${textSecondary};
|
|
56
60
|
${tokens.titleCaptionColor}: ${textSecondary};
|
|
57
61
|
${tokens.hintIconColor}: ${textSecondary};
|
|
58
62
|
|
|
59
63
|
${tokens.contentSlotColor}: ${textPositive};
|
|
60
64
|
${tokens.contentSlotColorHover}: ${textPositiveHover};
|
|
61
65
|
${tokens.contentSlotColorActive}: ${textPositiveActive};
|
|
66
|
+
${tokens.contentSlotColorFocus}: ${textSecondary};
|
|
62
67
|
|
|
63
68
|
${tokens.contentSlotRightColor}: ${textSecondary};
|
|
64
69
|
${tokens.contentSlotRightColorHover}: ${textSecondaryHover};
|
|
@@ -74,9 +79,11 @@ export const config = {
|
|
|
74
79
|
`,
|
|
75
80
|
warning: css`
|
|
76
81
|
${tokens.color}: ${textWarning};
|
|
82
|
+
${tokens.colorFocus}: ${textPrimary};
|
|
77
83
|
|
|
78
84
|
${tokens.placeholderColor}: ${textWarning};
|
|
79
|
-
${tokens.
|
|
85
|
+
${tokens.placeholderColorHover}: ${textSecondary};
|
|
86
|
+
${tokens.placeholderColorFocus}: ${textTertiary};
|
|
80
87
|
|
|
81
88
|
${tokens.backgroundColor}: transparent;
|
|
82
89
|
${tokens.backgroundColorHover}: transparent;
|
|
@@ -87,12 +94,15 @@ export const config = {
|
|
|
87
94
|
${tokens.labelColor}: ${textPrimary};
|
|
88
95
|
${tokens.leftHelperColor}: ${textWarning};
|
|
89
96
|
${tokens.rightHelperColor}: ${textWarning};
|
|
97
|
+
${tokens.leftHelperColorFocus}: ${textSecondary};
|
|
98
|
+
${tokens.rightHelperColorFocus}: ${textSecondary};
|
|
90
99
|
${tokens.titleCaptionColor}: ${textSecondary};
|
|
91
100
|
${tokens.hintIconColor}: ${textSecondary};
|
|
92
101
|
|
|
93
102
|
${tokens.contentSlotColor}: ${textWarning};
|
|
94
103
|
${tokens.contentSlotColorHover}: ${textWarningHover};
|
|
95
104
|
${tokens.contentSlotColorActive}: ${textWarningActive};
|
|
105
|
+
${tokens.contentSlotColorFocus}: ${textSecondary};
|
|
96
106
|
|
|
97
107
|
${tokens.contentSlotRightColor}: ${textSecondary};
|
|
98
108
|
${tokens.contentSlotRightColorHover}: ${textSecondaryHover};
|
|
@@ -108,9 +118,11 @@ export const config = {
|
|
|
108
118
|
`,
|
|
109
119
|
negative: css`
|
|
110
120
|
${tokens.color}: ${textNegative};
|
|
121
|
+
${tokens.colorFocus}: ${textPrimary};
|
|
111
122
|
|
|
112
123
|
${tokens.placeholderColor}: ${textNegative};
|
|
113
|
-
${tokens.
|
|
124
|
+
${tokens.placeholderColorHover}: ${textSecondary};
|
|
125
|
+
${tokens.placeholderColorFocus}: ${textTertiary};
|
|
114
126
|
|
|
115
127
|
${tokens.backgroundColor}: transparent;
|
|
116
128
|
${tokens.backgroundColorHover}: transparent;
|
|
@@ -121,12 +133,15 @@ export const config = {
|
|
|
121
133
|
${tokens.labelColor}: ${textPrimary};
|
|
122
134
|
${tokens.leftHelperColor}: ${textNegative};
|
|
123
135
|
${tokens.rightHelperColor}: ${textNegative};
|
|
136
|
+
${tokens.leftHelperColorFocus}: ${textSecondary};
|
|
137
|
+
${tokens.rightHelperColorFocus}: ${textSecondary};
|
|
124
138
|
${tokens.titleCaptionColor}: ${textSecondary};
|
|
125
139
|
${tokens.hintIconColor}: ${textSecondary};
|
|
126
140
|
|
|
127
141
|
${tokens.contentSlotColor}: ${textNegative};
|
|
128
142
|
${tokens.contentSlotColorHover}: ${textNegativeHover};
|
|
129
143
|
${tokens.contentSlotColorActive}: ${textNegativeActive};
|
|
144
|
+
${tokens.contentSlotColorFocus}: ${textSecondary};
|
|
130
145
|
|
|
131
146
|
${tokens.contentSlotRightColor}: ${textSecondary};
|
|
132
147
|
${tokens.contentSlotRightColorHover}: ${textSecondaryHover};
|
|
@@ -175,6 +190,7 @@ export const config = {
|
|
|
175
190
|
${tokens.hintInnerLabelPlacementOffset}: 0.82rem -2.063rem auto auto;
|
|
176
191
|
|
|
177
192
|
${tokens.titleCaptionInnerLabelOffset}: 0.25rem;
|
|
193
|
+
${tokens.titleCaptionMargin}: 0.375rem;
|
|
178
194
|
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
179
195
|
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
180
196
|
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
@@ -267,6 +283,7 @@ export const config = {
|
|
|
267
283
|
${tokens.hintInnerLabelPlacementOffset}: 0.563rem -2.188rem auto auto;
|
|
268
284
|
|
|
269
285
|
${tokens.titleCaptionInnerLabelOffset}: 0.25rem;
|
|
286
|
+
${tokens.titleCaptionMargin}: 0.375rem;
|
|
270
287
|
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
271
288
|
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
272
289
|
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
@@ -351,6 +368,7 @@ export const config = {
|
|
|
351
368
|
${tokens.hintInnerLabelPlacementOffset}: 0.312rem -2.188rem auto auto;
|
|
352
369
|
|
|
353
370
|
${tokens.titleCaptionInnerLabelOffset}: 0.25rem;
|
|
371
|
+
${tokens.titleCaptionMargin}: 0.3125rem;
|
|
354
372
|
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
355
373
|
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
356
374
|
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
@@ -435,6 +453,7 @@ export const config = {
|
|
|
435
453
|
${tokens.hintInnerLabelPlacementOffset}: 0.062rem -2.188rem auto auto;
|
|
436
454
|
|
|
437
455
|
${tokens.titleCaptionInnerLabelOffset}: 0.25rem;
|
|
456
|
+
${tokens.titleCaptionMargin}: 0.1875rem;
|
|
438
457
|
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
439
458
|
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
440
459
|
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
@@ -519,6 +538,7 @@ export const config = {
|
|
|
519
538
|
${tokens.hintInnerLabelPlacementOffset}: -0.188rem -1.938rem auto auto;
|
|
520
539
|
|
|
521
540
|
${tokens.titleCaptionInnerLabelOffset}: 0.25rem;
|
|
541
|
+
${tokens.titleCaptionMargin}: 0;
|
|
522
542
|
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
523
543
|
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
524
544
|
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
@@ -159,6 +159,7 @@ export const config = {
|
|
|
159
159
|
${tokens.hintInnerLabelPlacementOffset}: 0.82rem -2.938rem auto auto;
|
|
160
160
|
|
|
161
161
|
${tokens.titleCaptionInnerLabelOffset}: 0.25rem;
|
|
162
|
+
${tokens.titleCaptionMargin}: 0.375rem;
|
|
162
163
|
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
163
164
|
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
164
165
|
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
@@ -252,6 +253,7 @@ export const config = {
|
|
|
252
253
|
${tokens.clearHintInnerLabelPlacementOffset}: 0.563rem -2.188rem auto auto;
|
|
253
254
|
|
|
254
255
|
${tokens.titleCaptionInnerLabelOffset}: 0.25rem;
|
|
256
|
+
${tokens.titleCaptionMargin}: 0.375rem;
|
|
255
257
|
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
256
258
|
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
257
259
|
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
@@ -338,6 +340,7 @@ export const config = {
|
|
|
338
340
|
${tokens.clearHintInnerLabelPlacementOffset}: 0.312rem -2.188rem auto auto;
|
|
339
341
|
|
|
340
342
|
${tokens.titleCaptionInnerLabelOffset}: 0.25rem;
|
|
343
|
+
${tokens.titleCaptionMargin}: 0.3125rem;
|
|
341
344
|
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
342
345
|
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
343
346
|
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
@@ -424,6 +427,7 @@ export const config = {
|
|
|
424
427
|
${tokens.clearHintInnerLabelPlacementOffset}: 0.062rem -2.188rem auto auto;
|
|
425
428
|
|
|
426
429
|
${tokens.titleCaptionInnerLabelOffset}: 0.25rem;
|
|
430
|
+
${tokens.titleCaptionMargin}: 0.1875rem;
|
|
427
431
|
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
428
432
|
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
429
433
|
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
@@ -510,6 +514,7 @@ export const config = {
|
|
|
510
514
|
${tokens.clearHintInnerLabelPlacementOffset}: -0.188rem -1.938rem auto auto;
|
|
511
515
|
|
|
512
516
|
${tokens.titleCaptionInnerLabelOffset}: 0.25rem;
|
|
517
|
+
${tokens.titleCaptionMargin}: 0;
|
|
513
518
|
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
514
519
|
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
515
520
|
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
@@ -47,6 +47,7 @@ export const config = {
|
|
|
47
47
|
${tokens.disabledOpacity}: 0.4;
|
|
48
48
|
|
|
49
49
|
${tokens.leftHelperColor}: ${textSecondary};
|
|
50
|
+
${tokens.titleCaptionColor}: ${textSecondary};
|
|
50
51
|
${tokens.leftHelperColorError}: ${textNegative};
|
|
51
52
|
${tokens.leftHelperColorSuccess}: ${textPositive};
|
|
52
53
|
|
|
@@ -71,6 +72,13 @@ export const config = {
|
|
|
71
72
|
${tokens.labelFontWeight}: ${bodyL.fontWeight};
|
|
72
73
|
${tokens.labelLetterSpacing}: ${bodyL.letterSpacing};
|
|
73
74
|
${tokens.labelLineHeight}: ${bodyL.lineHeight};
|
|
75
|
+
${tokens.titleCaptionMargin}: 0.375rem;
|
|
76
|
+
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
77
|
+
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
78
|
+
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
79
|
+
${tokens.titleCaptionFontWeight}: ${bodyXS.fontWeight};
|
|
80
|
+
${tokens.titleCaptionLetterSpacing}: ${bodyXS.letterSpacing};
|
|
81
|
+
${tokens.titleCaptionLineHeight}: ${bodyXS.lineHeight};
|
|
74
82
|
|
|
75
83
|
${tokens.indicatorSize}: 0.5rem;
|
|
76
84
|
${tokens.indicatorSizeOuter}: 0.375rem;
|
|
@@ -154,6 +162,13 @@ export const config = {
|
|
|
154
162
|
${tokens.labelFontWeight}: ${bodyL.fontWeight};
|
|
155
163
|
${tokens.labelLetterSpacing}: ${bodyL.letterSpacing};
|
|
156
164
|
${tokens.labelLineHeight}: ${bodyL.lineHeight};
|
|
165
|
+
${tokens.titleCaptionMargin}: 0.375rem;
|
|
166
|
+
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
167
|
+
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
168
|
+
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
169
|
+
${tokens.titleCaptionFontWeight}: ${bodyXS.fontWeight};
|
|
170
|
+
${tokens.titleCaptionLetterSpacing}: ${bodyXS.letterSpacing};
|
|
171
|
+
${tokens.titleCaptionLineHeight}: ${bodyXS.lineHeight};
|
|
157
172
|
|
|
158
173
|
${tokens.indicatorSize}: 0.5rem;
|
|
159
174
|
${tokens.indicatorSizeOuter}: 0.375rem;
|
|
@@ -237,6 +252,13 @@ export const config = {
|
|
|
237
252
|
${tokens.labelFontWeight}: ${bodyM.fontWeight};
|
|
238
253
|
${tokens.labelLetterSpacing}: ${bodyM.letterSpacing};
|
|
239
254
|
${tokens.labelLineHeight}: ${bodyM.lineHeight};
|
|
255
|
+
${tokens.titleCaptionMargin}: 0.3125rem;
|
|
256
|
+
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
257
|
+
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
258
|
+
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
259
|
+
${tokens.titleCaptionFontWeight}: ${bodyXS.fontWeight};
|
|
260
|
+
${tokens.titleCaptionLetterSpacing}: ${bodyXS.letterSpacing};
|
|
261
|
+
${tokens.titleCaptionLineHeight}: ${bodyXS.lineHeight};
|
|
240
262
|
|
|
241
263
|
${tokens.indicatorSize}: 0.5rem;
|
|
242
264
|
${tokens.indicatorSizeOuter}: 0.375rem;
|
|
@@ -320,6 +342,13 @@ export const config = {
|
|
|
320
342
|
${tokens.labelFontWeight}: ${bodyS.fontWeight};
|
|
321
343
|
${tokens.labelLetterSpacing}: ${bodyS.letterSpacing};
|
|
322
344
|
${tokens.labelLineHeight}: ${bodyS.lineHeight};
|
|
345
|
+
${tokens.titleCaptionMargin}: 0.1875rem;
|
|
346
|
+
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
347
|
+
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
348
|
+
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
349
|
+
${tokens.titleCaptionFontWeight}: ${bodyXS.fontWeight};
|
|
350
|
+
${tokens.titleCaptionLetterSpacing}: ${bodyXS.letterSpacing};
|
|
351
|
+
${tokens.titleCaptionLineHeight}: ${bodyXS.lineHeight};
|
|
323
352
|
|
|
324
353
|
${tokens.indicatorSize}: 0.375rem;
|
|
325
354
|
${tokens.indicatorSizeOuter}: 0.375rem;
|
|
@@ -403,6 +432,13 @@ export const config = {
|
|
|
403
432
|
${tokens.labelFontWeight}: ${bodyXS.fontWeight};
|
|
404
433
|
${tokens.labelLetterSpacing}: ${bodyXS.letterSpacing};
|
|
405
434
|
${tokens.labelLineHeight}: ${bodyXS.lineHeight};
|
|
435
|
+
${tokens.titleCaptionMargin}: 0;
|
|
436
|
+
${tokens.titleCaptionFontFamily}: ${bodyXS.fontFamily};
|
|
437
|
+
${tokens.titleCaptionFontStyle}: ${bodyXS.fontStyle};
|
|
438
|
+
${tokens.titleCaptionFontSize}: ${bodyXS.fontSize};
|
|
439
|
+
${tokens.titleCaptionFontWeight}: ${bodyXS.fontWeight};
|
|
440
|
+
${tokens.titleCaptionLetterSpacing}: ${bodyXS.letterSpacing};
|
|
441
|
+
${tokens.titleCaptionLineHeight}: ${bodyXS.lineHeight};
|
|
406
442
|
|
|
407
443
|
${tokens.indicatorSize}: 0.375rem;
|
|
408
444
|
${tokens.indicatorSizeOuter}: 0.375rem;
|
|
@@ -538,6 +574,7 @@ export const config = {
|
|
|
538
574
|
${tokens.backgroundReadOnly}: ${surfaceTransparentPrimary};
|
|
539
575
|
${tokens.labelColorReadOnly}: ${textSecondary};
|
|
540
576
|
${tokens.leftHelperColorReadOnly}: ${textSecondary};
|
|
577
|
+
${tokens.titleCaptionColorReadOnly}: ${textSecondary};
|
|
541
578
|
|
|
542
579
|
${tokens.textFieldColorReadOnly}: ${textSecondary};
|
|
543
580
|
${tokens.textFieldBackgroundColorReadOnly}: ${surfaceTransparentPrimary};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@salutejs/sdds-dfa",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.371.0",
|
|
4
4
|
"description": "Salute Design System / React UI kit for SDDS DFA web applications",
|
|
5
5
|
"author": "Salute Frontend Team <salute.developers@gmail.com>",
|
|
6
6
|
"publishConfig": {
|
|
@@ -32,11 +32,11 @@
|
|
|
32
32
|
"peerDependencies": {
|
|
33
33
|
"react": ">=16.13.1",
|
|
34
34
|
"react-dom": ">=16.13.1",
|
|
35
|
-
"styled-components": "^5.3.
|
|
35
|
+
"styled-components": "^5.3.11"
|
|
36
36
|
},
|
|
37
37
|
"dependencies": {
|
|
38
|
-
"@salutejs/plasma-new-hope": "0.
|
|
39
|
-
"@salutejs/sdds-themes": "0.
|
|
38
|
+
"@salutejs/plasma-new-hope": "0.385.0",
|
|
39
|
+
"@salutejs/sdds-themes": "0.85.0"
|
|
40
40
|
},
|
|
41
41
|
"devDependencies": {
|
|
42
42
|
"@babel/cli": "7.24.1",
|
|
@@ -46,11 +46,11 @@
|
|
|
46
46
|
"@babel/preset-env": "7.24.4",
|
|
47
47
|
"@babel/preset-react": "7.24.1",
|
|
48
48
|
"@babel/preset-typescript": "7.24.1",
|
|
49
|
-
"@salutejs/plasma-colors": "0.26.0
|
|
50
|
-
"@salutejs/plasma-core": "1.
|
|
51
|
-
"@salutejs/plasma-cy-utils": "0.
|
|
52
|
-
"@salutejs/plasma-icons": "1.
|
|
53
|
-
"@salutejs/plasma-sb-utils": "0.
|
|
49
|
+
"@salutejs/plasma-colors": "0.26.0",
|
|
50
|
+
"@salutejs/plasma-core": "1.247.0",
|
|
51
|
+
"@salutejs/plasma-cy-utils": "0.177.0",
|
|
52
|
+
"@salutejs/plasma-icons": "1.254.0",
|
|
53
|
+
"@salutejs/plasma-sb-utils": "0.248.0",
|
|
54
54
|
"@types/node": "16.7.13",
|
|
55
55
|
"@types/react": "18.0.28",
|
|
56
56
|
"@types/react-dom": "18.0.11",
|
|
@@ -61,7 +61,7 @@
|
|
|
61
61
|
"default-browser-id": "2.0.0",
|
|
62
62
|
"react": "18.2.0",
|
|
63
63
|
"react-dom": "18.2.0",
|
|
64
|
-
"styled-components": "5.3.
|
|
64
|
+
"styled-components": "5.3.11",
|
|
65
65
|
"typescript-coverage-report": "0.7.0"
|
|
66
66
|
},
|
|
67
67
|
"scripts": {
|
|
@@ -88,5 +88,5 @@
|
|
|
88
88
|
"salute.developers@gmail.com"
|
|
89
89
|
],
|
|
90
90
|
"sideEffects": false,
|
|
91
|
-
"gitHead": "
|
|
91
|
+
"gitHead": "0256ddebc7098127e786152d29679e905aa10230"
|
|
92
92
|
}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
export declare const config: {
|
|
2
|
+
defaults: {
|
|
3
|
+
view: string;
|
|
4
|
+
size: string;
|
|
5
|
+
labelPlacement: string;
|
|
6
|
+
};
|
|
7
|
+
variations: {
|
|
8
|
+
view: {
|
|
9
|
+
default: import("@salutejs/plasma-new-hope/types/engines/types.js").PolymorphicClassName;
|
|
10
|
+
positive: import("@salutejs/plasma-new-hope/types/engines/types.js").PolymorphicClassName;
|
|
11
|
+
warning: import("@salutejs/plasma-new-hope/types/engines/types.js").PolymorphicClassName;
|
|
12
|
+
negative: import("@salutejs/plasma-new-hope/types/engines/types.js").PolymorphicClassName;
|
|
13
|
+
};
|
|
14
|
+
size: {
|
|
15
|
+
xl: import("@salutejs/plasma-new-hope/types/engines/types.js").PolymorphicClassName;
|
|
16
|
+
l: import("@salutejs/plasma-new-hope/types/engines/types.js").PolymorphicClassName;
|
|
17
|
+
m: import("@salutejs/plasma-new-hope/types/engines/types.js").PolymorphicClassName;
|
|
18
|
+
s: import("@salutejs/plasma-new-hope/types/engines/types.js").PolymorphicClassName;
|
|
19
|
+
xs: import("@salutejs/plasma-new-hope/types/engines/types.js").PolymorphicClassName;
|
|
20
|
+
};
|
|
21
|
+
labelPlacement: {
|
|
22
|
+
inner: import("@salutejs/plasma-new-hope/types/engines/types.js").PolymorphicClassName;
|
|
23
|
+
outer: import("@salutejs/plasma-new-hope/types/engines/types.js").PolymorphicClassName;
|
|
24
|
+
};
|
|
25
|
+
hintView: {
|
|
26
|
+
default: import("@salutejs/plasma-new-hope/types/engines/types.js").PolymorphicClassName;
|
|
27
|
+
};
|
|
28
|
+
hintSize: {
|
|
29
|
+
m: import("@salutejs/plasma-new-hope/types/engines/types.js").PolymorphicClassName;
|
|
30
|
+
s: import("@salutejs/plasma-new-hope/types/engines/types.js").PolymorphicClassName;
|
|
31
|
+
};
|
|
32
|
+
disabled: {
|
|
33
|
+
true: import("@salutejs/plasma-new-hope/types/engines/types.js").PolymorphicClassName;
|
|
34
|
+
};
|
|
35
|
+
readOnly: {
|
|
36
|
+
true: import("@salutejs/plasma-new-hope/types/engines/types.js").PolymorphicClassName;
|
|
37
|
+
};
|
|
38
|
+
};
|
|
39
|
+
};
|