@alfalab/core-components-steps 1.6.1 → 1.6.3

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 (26) hide show
  1. package/Component.js +9 -10
  2. package/components/step/Component.js +1 -1
  3. package/components/step/index.css +56 -49
  4. package/components/step-indicator/Component.js +1 -1
  5. package/components/step-indicator/index.css +2 -2
  6. package/cssm/Component.js +8 -9
  7. package/cssm/components/step/index.module.css +25 -18
  8. package/cssm/components/step-indicator/index.module.css +1 -1
  9. package/cssm/index.module.css +9 -5
  10. package/esm/Component.js +10 -11
  11. package/esm/components/step/Component.js +1 -1
  12. package/esm/components/step/index.css +56 -49
  13. package/esm/components/step-indicator/Component.js +1 -1
  14. package/esm/components/step-indicator/index.css +2 -2
  15. package/esm/index.css +12 -8
  16. package/index.css +12 -8
  17. package/modern/Component.js +10 -11
  18. package/modern/components/step/Component.js +1 -1
  19. package/modern/components/step/index.css +56 -49
  20. package/modern/components/step-indicator/Component.js +1 -1
  21. package/modern/components/step-indicator/index.css +2 -2
  22. package/modern/index.css +12 -8
  23. package/package.json +5 -3
  24. package/src/Component.tsx +10 -11
  25. package/src/components/step/index.module.css +9 -9
  26. package/src/components/step-indicator/index.module.css +1 -1
package/Component.js CHANGED
@@ -11,33 +11,32 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
11
11
  var React__default = /*#__PURE__*/_interopDefaultCompat(React);
12
12
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
13
13
 
14
- var styles = {"component":"steps__component_1n1l2","vertical":"steps__vertical_1n1l2"};
14
+ var styles = {"component":"steps__component_airbo","vertical":"steps__vertical_airbo"};
15
15
  require('./index.css')
16
16
 
17
17
  var Steps = function (_a) {
18
18
  var _b;
19
19
  var className = _a.className, children = _a.children, _c = _a.defaultActiveStep, defaultActiveStep = _c === void 0 ? 1 : _c, activeStepProp = _a.activeStep, _d = _a.isMarkCompletedSteps, isMarkCompletedSteps = _d === void 0 ? true : _d, _e = _a.isVerticalAlign, isVerticalAlign = _e === void 0 ? false : _e, _f = _a.ordered, ordered = _f === void 0 ? true : _f, _g = _a.interactive, interactive = _g === void 0 ? true : _g, _h = _a.fullWidth, fullWidth = _h === void 0 ? false : _h, _j = _a.minSpaceBetweenSteps, minSpaceBetweenSteps = _j === void 0 ? 24 : _j, checkIsStepDisabled = _a.checkIsStepDisabled, checkIsStepError = _a.checkIsStepError, checkIsStepWarning = _a.checkIsStepWarning, checkIsStepWaiting = _a.checkIsStepWaiting, checkIsStepPositive = _a.checkIsStepPositive, checkIsStepCustom = _a.checkIsStepCustom, onChange = _a.onChange, dataTestId = _a.dataTestId;
20
- var _k = React.useState(activeStepProp || defaultActiveStep), activeStep = _k[0], setActiveStep = _k[1];
20
+ var uncontrolled = activeStepProp === undefined;
21
+ var _k = React.useState(defaultActiveStep), activeStep = _k[0], setActiveStep = _k[1];
21
22
  var stepsLength = React__default.default.Children.count(children);
22
- React.useEffect(function () {
23
- if (activeStepProp) {
24
- setActiveStep(activeStepProp);
25
- }
26
- }, [activeStepProp]);
27
23
  var handleStepClick = function (stepNumber) {
28
- setActiveStep(stepNumber);
24
+ if (uncontrolled) {
25
+ setActiveStep(stepNumber);
26
+ }
29
27
  if (onChange) {
30
28
  onChange(stepNumber);
31
29
  }
32
30
  };
33
31
  if (!stepsLength)
34
32
  return null;
33
+ var visibleActiveStep = uncontrolled ? activeStep : activeStepProp;
35
34
  return (React__default.default.createElement("div", { className: cn__default.default(className, styles.component, (_b = {},
36
35
  _b[styles.vertical] = isVerticalAlign,
37
36
  _b)), "data-test-id": dataTestId }, React__default.default.Children.map(children, function (step, index) {
38
37
  var stepNumber = index + 1;
39
- var isSelected = stepNumber === activeStep;
40
- var isStepCompleted = isMarkCompletedSteps && stepNumber < activeStep;
38
+ var isSelected = stepNumber === visibleActiveStep;
39
+ var isStepCompleted = isMarkCompletedSteps && stepNumber < visibleActiveStep;
41
40
  var disabled = checkIsStepDisabled ? checkIsStepDisabled(stepNumber) : false;
42
41
  var isPositive = checkIsStepPositive ? checkIsStepPositive(stepNumber) : false;
43
42
  var isError = checkIsStepError ? checkIsStepError(stepNumber) : false;
package/components/step/Component.js CHANGED
@@ -16,7 +16,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
16
16
  var React__default = /*#__PURE__*/_interopDefaultCompat(React);
17
17
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
18
18
 
19
- var styles = {"step":"steps__step_1ohj2","vertical":"steps__vertical_1ohj2","interactive":"steps__interactive_1ohj2","disabled":"steps__disabled_1ohj2","text":"steps__text_1ohj2","indicator":"steps__indicator_1ohj2","option":"steps__option_1ohj2","dash":"steps__dash_1ohj2","size-16":"steps__size-16_1ohj2","size-8":"steps__size-8_1ohj2","completed":"steps__completed_1ohj2","focused":"steps__focused_1ohj2","selected":"steps__selected_1ohj2","checkbox":"steps__checkbox_1ohj2","dot":"steps__dot_1ohj2","error":"steps__error_1ohj2","unordered":"steps__unordered_1ohj2","completedIndicator":"steps__completedIndicator_1ohj2","fullWidth":"steps__fullWidth_1ohj2"};
19
+ var styles = {"step":"steps__step_wyak7","vertical":"steps__vertical_wyak7","interactive":"steps__interactive_wyak7","disabled":"steps__disabled_wyak7","text":"steps__text_wyak7","indicator":"steps__indicator_wyak7","option":"steps__option_wyak7","dash":"steps__dash_wyak7","size-16":"steps__size-16_wyak7","size-8":"steps__size-8_wyak7","completed":"steps__completed_wyak7","focused":"steps__focused_wyak7","selected":"steps__selected_wyak7","checkbox":"steps__checkbox_wyak7","dot":"steps__dot_wyak7","error":"steps__error_wyak7","unordered":"steps__unordered_wyak7","completedIndicator":"steps__completedIndicator_wyak7","fullWidth":"steps__fullWidth_wyak7"};
20
20
  require('./index.css')
21
21
 
22
22
  var SIZE_TO_CLASSNAME_MAP = {
package/components/step/index.css CHANGED
@@ -1,16 +1,16 @@
1
- /* hash: 1hf3o */
1
+ /* hash: zeykt */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root {
4
- --color-light-border-link: #2288fa;
5
4
  --color-light-neutral-translucent-1300: rgba(3, 3, 6, 0.88);
6
5
  --color-light-neutral-translucent-300: rgba(15, 25, 55, 0.1);
6
+ --color-light-status-info: #2288fa;
7
7
  --color-light-status-positive: #0cc44d;
8
8
  --color-light-text-primary: rgba(3, 3, 6, 0.88);
9
9
  --color-light-text-primary-inverted: rgba(255, 255, 255, 0.94);
10
10
  --color-light-transparent-default-hover: rgba(38, 55, 88, 0.06);
11
- --color-light-transparent-default-press: rgba(30, 43, 68, 0.08); /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
12
- } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
13
- } :root {
11
+ --color-light-transparent-default-press: rgba(30, 43, 68, 0.08); /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
12
+ } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
13
+ } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
14
14
  } :root {
15
15
 
16
16
  /* Hard */
@@ -18,38 +18,45 @@
18
18
  /* Up */
19
19
 
20
20
  /* Hard up */
21
- } :root {
21
+ } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
22
22
  --border-radius-circle: 50%;
23
+
24
+ /* новые значения, используйте их */
23
25
  } :root {
24
- --gap-3xs: 2px;
25
- --gap-2xs: 4px;
26
- --gap-xs: 8px;
26
+ --gap-3xs: 2px; /* deprecated */
27
+ --gap-2xs: 4px; /* deprecated */
28
+ --gap-xs: 8px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
29
+
30
+ /* новые значения, используйте их */
31
+ --gap-2: var(--gap-3xs);
32
+ --gap-4: var(--gap-2xs);
33
+ --gap-8: var(--gap-xs);
27
34
  } :root {
28
35
  } :root {
29
- --focus-color: var(--color-light-border-link);
36
+ --focus-color: var(--color-light-status-info);
30
37
  } :root {
31
38
  --steps-option-svg-color: var(--color-light-status-positive);
32
39
  --steps-dash-border: 2px solid var(--color-light-status-positive);
33
- } .steps__step_1ohj2 {
40
+ } .steps__step_wyak7 {
34
41
  display: flex;
35
42
  outline: none
36
- } .steps__step_1ohj2:not(.steps__vertical_1ohj2) {
43
+ } .steps__step_wyak7:not(.steps__vertical_wyak7) {
37
44
  align-items: center;
38
- } .steps__step_1ohj2.steps__interactive_1ohj2:not(.steps__disabled_1ohj2):hover {
45
+ } .steps__step_wyak7.steps__interactive_wyak7:not(.steps__disabled_wyak7):hover {
39
46
  cursor: pointer;
40
- } .steps__step_1ohj2.steps__disabled_1ohj2:hover .steps__text_1ohj2 {
47
+ } .steps__step_wyak7.steps__disabled_wyak7:hover .steps__text_wyak7 {
41
48
  background: unset;
42
- } .steps__step_1ohj2.steps__disabled_1ohj2 .steps__indicator_1ohj2 {
49
+ } .steps__step_wyak7.steps__disabled_wyak7 .steps__indicator_wyak7 {
43
50
  cursor: unset;
44
- } .steps__indicator_1ohj2 {
51
+ } .steps__indicator_wyak7 {
45
52
  cursor: pointer;
46
53
  display: flex;
47
54
  align-items: center;
48
- margin-right: var(--gap-2xs)
49
- } .steps__indicator_1ohj2.steps__vertical_1ohj2 {
55
+ margin-right: var(--gap-4)
56
+ } .steps__indicator_wyak7.steps__vertical_wyak7 {
50
57
  flex-direction: column;
51
- margin-right: var(--gap-xs);
52
- } .steps__option_1ohj2 {
58
+ margin-right: var(--gap-8);
59
+ } .steps__option_wyak7 {
53
60
  font-size: 14px;
54
61
  line-height: 20px;
55
62
  font-weight: 700;
@@ -62,55 +69,55 @@
62
69
  min-width: 24px;
63
70
  height: 24px;
64
71
  border-radius: var(--border-radius-circle)
65
- } .steps__option_1ohj2.steps__vertical_1ohj2 {
66
- margin-top: var(--gap-xs);
67
- } .steps__dash_1ohj2 {
72
+ } .steps__option_wyak7.steps__vertical_wyak7 {
73
+ margin-top: var(--gap-8);
74
+ } .steps__dash_wyak7 {
68
75
  flex: 1 1 auto;
69
76
  min-width: 24px;
70
77
  border-top: 2px solid var(--color-light-neutral-translucent-300);
71
- margin-right: var(--gap-xs)
72
- } .steps__dash_1ohj2.steps__size-16_1ohj2 {
78
+ margin-right: var(--gap-8)
79
+ } .steps__dash_wyak7.steps__size-16_wyak7 {
73
80
  min-width: 16px;
74
- } .steps__dash_1ohj2.steps__size-8_1ohj2 {
81
+ } .steps__dash_wyak7.steps__size-8_wyak7 {
75
82
  min-width: 8px;
76
- } .steps__dash_1ohj2.steps__completed_1ohj2 {
83
+ } .steps__dash_wyak7.steps__completed_wyak7 {
77
84
  border-top: var(--steps-dash-border);
78
- } .steps__dash_1ohj2.steps__vertical_1ohj2 {
85
+ } .steps__dash_wyak7.steps__vertical_wyak7 {
79
86
  min-width: unset;
80
87
  min-height: 24px;
81
88
  margin-right: 0;
82
- margin-top: var(--gap-xs);
89
+ margin-top: var(--gap-8);
83
90
  border-left: 2px solid var(--color-light-neutral-translucent-300);
84
91
  border-top: none
85
- } .steps__dash_1ohj2.steps__vertical_1ohj2.steps__size-16_1ohj2 {
92
+ } .steps__dash_wyak7.steps__vertical_wyak7.steps__size-16_wyak7 {
86
93
  min-height: 16px;
87
- } .steps__dash_1ohj2.steps__vertical_1ohj2.steps__size-8_1ohj2 {
94
+ } .steps__dash_wyak7.steps__vertical_wyak7.steps__size-8_wyak7 {
88
95
  min-height: 8px;
89
- } .steps__dash_1ohj2.steps__completed_1ohj2.steps__vertical_1ohj2 {
96
+ } .steps__dash_wyak7.steps__completed_wyak7.steps__vertical_wyak7 {
90
97
  border-left: var(--steps-dash-border);
91
- } .steps__text_1ohj2 {
98
+ } .steps__text_wyak7 {
92
99
  font-size: 16px;
93
100
  line-height: 24px;
94
101
  font-weight: 400;
95
102
 
96
103
  transition: background 0.2s;
97
- padding: var(--gap-xs);
104
+ padding: var(--gap-8);
98
105
  color: var(--color-light-text-primary);
99
- border-radius: var(--gap-xs);
106
+ border-radius: var(--gap-8);
100
107
  height: min-content
101
- } .steps__text_1ohj2.steps__interactive_1ohj2:not(.steps__disabled_1ohj2):hover {
108
+ } .steps__text_wyak7.steps__interactive_wyak7:not(.steps__disabled_wyak7):hover {
102
109
  background: var(--color-light-transparent-default-hover);
103
- } .steps__text_1ohj2.steps__interactive_1ohj2:not(.steps__disabled_1ohj2):active {
110
+ } .steps__text_wyak7.steps__interactive_wyak7:not(.steps__disabled_wyak7):active {
104
111
  background: var(--color-light-transparent-default-press);
105
- } .steps__focused_1ohj2 {
106
- outline: var(--gap-3xs) solid var(--focus-color);
107
- outline-offset: var(--gap-3xs);
108
- } .steps__selected_1ohj2 .steps__text_1ohj2 {
112
+ } .steps__focused_wyak7 {
113
+ outline: var(--gap-2) solid var(--focus-color);
114
+ outline-offset: var(--gap-2);
115
+ } .steps__selected_wyak7 .steps__text_wyak7 {
109
116
  color: var(--color-light-text-primary);
110
- } .steps__selected_1ohj2 .steps__option_1ohj2 {
117
+ } .steps__selected_wyak7 .steps__option_wyak7 {
111
118
  color: var(--color-light-text-primary-inverted);
112
119
  background: var(--color-light-neutral-translucent-1300);
113
- } .steps__checkbox_1ohj2 {
120
+ } .steps__checkbox_wyak7 {
114
121
  display: flex;
115
122
  justify-content: center;
116
123
  align-items: center;
@@ -118,20 +125,20 @@
118
125
  width: 20px;
119
126
  height: 20px;
120
127
  border: 2px solid var(--color-light-neutral-translucent-300);
121
- } .steps__dot_1ohj2 {
128
+ } .steps__dot_wyak7 {
122
129
  width: 10px;
123
130
  height: 10px;
124
131
  border-radius: var(--border-radius-circle);
125
132
  background: var(--color-light-neutral-translucent-300);
126
- } .steps__selected_1ohj2 .steps__checkbox_1ohj2 {
133
+ } .steps__selected_wyak7 .steps__checkbox_wyak7 {
127
134
  border: 2px solid var(--color-light-neutral-translucent-1300)
128
- } .steps__selected_1ohj2 .steps__checkbox_1ohj2 .steps__dot_1ohj2 {
135
+ } .steps__selected_wyak7 .steps__checkbox_wyak7 .steps__dot_wyak7 {
129
136
  background: var(--color-light-neutral-translucent-1300);
130
- } .steps__option_1ohj2:not(.steps__error_1ohj2).steps__unordered_1ohj2 {
137
+ } .steps__option_wyak7:not(.steps__error_wyak7).steps__unordered_wyak7 {
131
138
  background: unset;
132
- } .steps__completedIndicator_1ohj2 > [class*='positive'] {
139
+ } .steps__completedIndicator_wyak7 > [class*='positive'] {
133
140
  color: var(--steps-option-svg-color);
134
141
  background-color: var(--steps-option-svg-color);
135
- } .steps__fullWidth_1ohj2 {
142
+ } .steps__fullWidth_wyak7 {
136
143
  width: 100%;
137
144
  }
package/components/step-indicator/Component.js CHANGED
@@ -11,7 +11,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
11
11
  var React__default = /*#__PURE__*/_interopDefaultCompat(React);
12
12
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
13
13
 
14
- var styles = {"component":"steps__component_1akb5"};
14
+ var styles = {"component":"steps__component_1igwc"};
15
15
  require('./index.css')
16
16
 
17
17
  var StepIndicator = function (_a) {
package/components/step-indicator/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 1w3kq */
2
- .steps__component_1akb5 {
1
+ /* hash: 1e3fn */
2
+ .steps__component_1igwc.steps__component_1igwc {
3
3
  padding: 0;
4
4
  }
package/cssm/Component.js CHANGED
@@ -16,27 +16,26 @@ var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
16
16
  var Steps = function (_a) {
17
17
  var _b;
18
18
  var className = _a.className, children = _a.children, _c = _a.defaultActiveStep, defaultActiveStep = _c === void 0 ? 1 : _c, activeStepProp = _a.activeStep, _d = _a.isMarkCompletedSteps, isMarkCompletedSteps = _d === void 0 ? true : _d, _e = _a.isVerticalAlign, isVerticalAlign = _e === void 0 ? false : _e, _f = _a.ordered, ordered = _f === void 0 ? true : _f, _g = _a.interactive, interactive = _g === void 0 ? true : _g, _h = _a.fullWidth, fullWidth = _h === void 0 ? false : _h, _j = _a.minSpaceBetweenSteps, minSpaceBetweenSteps = _j === void 0 ? 24 : _j, checkIsStepDisabled = _a.checkIsStepDisabled, checkIsStepError = _a.checkIsStepError, checkIsStepWarning = _a.checkIsStepWarning, checkIsStepWaiting = _a.checkIsStepWaiting, checkIsStepPositive = _a.checkIsStepPositive, checkIsStepCustom = _a.checkIsStepCustom, onChange = _a.onChange, dataTestId = _a.dataTestId;
19
- var _k = React.useState(activeStepProp || defaultActiveStep), activeStep = _k[0], setActiveStep = _k[1];
19
+ var uncontrolled = activeStepProp === undefined;
20
+ var _k = React.useState(defaultActiveStep), activeStep = _k[0], setActiveStep = _k[1];
20
21
  var stepsLength = React__default.default.Children.count(children);
21
- React.useEffect(function () {
22
- if (activeStepProp) {
23
- setActiveStep(activeStepProp);
24
- }
25
- }, [activeStepProp]);
26
22
  var handleStepClick = function (stepNumber) {
27
- setActiveStep(stepNumber);
23
+ if (uncontrolled) {
24
+ setActiveStep(stepNumber);
25
+ }
28
26
  if (onChange) {
29
27
  onChange(stepNumber);
30
28
  }
31
29
  };
32
30
  if (!stepsLength)
33
31
  return null;
32
+ var visibleActiveStep = uncontrolled ? activeStep : activeStepProp;
34
33
  return (React__default.default.createElement("div", { className: cn__default.default(className, styles__default.default.component, (_b = {},
35
34
  _b[styles__default.default.vertical] = isVerticalAlign,
36
35
  _b)), "data-test-id": dataTestId }, React__default.default.Children.map(children, function (step, index) {
37
36
  var stepNumber = index + 1;
38
- var isSelected = stepNumber === activeStep;
39
- var isStepCompleted = isMarkCompletedSteps && stepNumber < activeStep;
37
+ var isSelected = stepNumber === visibleActiveStep;
38
+ var isStepCompleted = isMarkCompletedSteps && stepNumber < visibleActiveStep;
40
39
  var disabled = checkIsStepDisabled ? checkIsStepDisabled(stepNumber) : false;
41
40
  var isPositive = checkIsStepPositive ? checkIsStepPositive(stepNumber) : false;
42
41
  var isError = checkIsStepError ? checkIsStepError(stepNumber) : false;
package/cssm/components/step/index.module.css CHANGED
@@ -1,15 +1,15 @@
1
1
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
2
2
  } /* deprecated */ :root {
3
- --color-light-border-link: #2288fa;
4
3
  --color-light-neutral-translucent-1300: rgba(3, 3, 6, 0.88);
5
4
  --color-light-neutral-translucent-300: rgba(15, 25, 55, 0.1);
5
+ --color-light-status-info: #2288fa;
6
6
  --color-light-status-positive: #0cc44d;
7
7
  --color-light-text-primary: rgba(3, 3, 6, 0.88);
8
8
  --color-light-text-primary-inverted: rgba(255, 255, 255, 0.94);
9
9
  --color-light-transparent-default-hover: rgba(38, 55, 88, 0.06);
10
- --color-light-transparent-default-press: rgba(30, 43, 68, 0.08); /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
11
- } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
12
- } :root {
10
+ --color-light-transparent-default-press: rgba(30, 43, 68, 0.08); /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
11
+ } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
12
+ } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
13
13
  } :root {
14
14
 
15
15
  /* Hard */
@@ -17,15 +17,22 @@
17
17
  /* Up */
18
18
 
19
19
  /* Hard up */
20
- } :root {
20
+ } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
21
21
  --border-radius-circle: 50%;
22
+
23
+ /* новые значения, используйте их */
22
24
  } :root {
23
- --gap-3xs: 2px;
24
- --gap-2xs: 4px;
25
- --gap-xs: 8px;
25
+ --gap-3xs: 2px; /* deprecated */
26
+ --gap-2xs: 4px; /* deprecated */
27
+ --gap-xs: 8px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
28
+
29
+ /* новые значения, используйте их */
30
+ --gap-2: var(--gap-3xs);
31
+ --gap-4: var(--gap-2xs);
32
+ --gap-8: var(--gap-xs);
26
33
  } :root {
27
34
  } :root {
28
- --focus-color: var(--color-light-border-link);
35
+ --focus-color: var(--color-light-status-info);
29
36
  } :root {
30
37
  --steps-option-svg-color: var(--color-light-status-positive);
31
38
  --steps-dash-border: 2px solid var(--color-light-status-positive);
@@ -44,10 +51,10 @@
44
51
  cursor: pointer;
45
52
  display: flex;
46
53
  align-items: center;
47
- margin-right: var(--gap-2xs)
54
+ margin-right: var(--gap-4)
48
55
  } .indicator.vertical {
49
56
  flex-direction: column;
50
- margin-right: var(--gap-xs);
57
+ margin-right: var(--gap-8);
51
58
  } .option {
52
59
  font-size: 14px;
53
60
  line-height: 20px;
@@ -62,12 +69,12 @@
62
69
  height: 24px;
63
70
  border-radius: var(--border-radius-circle)
64
71
  } .option.vertical {
65
- margin-top: var(--gap-xs);
72
+ margin-top: var(--gap-8);
66
73
  } .dash {
67
74
  flex: 1 1 auto;
68
75
  min-width: 24px;
69
76
  border-top: 2px solid var(--color-light-neutral-translucent-300);
70
- margin-right: var(--gap-xs)
77
+ margin-right: var(--gap-8)
71
78
  } .dash.size-16 {
72
79
  min-width: 16px;
73
80
  } .dash.size-8 {
@@ -78,7 +85,7 @@
78
85
  min-width: unset;
79
86
  min-height: 24px;
80
87
  margin-right: 0;
81
- margin-top: var(--gap-xs);
88
+ margin-top: var(--gap-8);
82
89
  border-left: 2px solid var(--color-light-neutral-translucent-300);
83
90
  border-top: none
84
91
  } .dash.vertical.size-16 {
@@ -93,17 +100,17 @@
93
100
  font-weight: 400;
94
101
 
95
102
  transition: background 0.2s;
96
- padding: var(--gap-xs);
103
+ padding: var(--gap-8);
97
104
  color: var(--color-light-text-primary);
98
- border-radius: var(--gap-xs);
105
+ border-radius: var(--gap-8);
99
106
  height: min-content
100
107
  } .text.interactive:not(.disabled):hover {
101
108
  background: var(--color-light-transparent-default-hover);
102
109
  } .text.interactive:not(.disabled):active {
103
110
  background: var(--color-light-transparent-default-press);
104
111
  } .focused {
105
- outline: var(--gap-3xs) solid var(--focus-color);
106
- outline-offset: var(--gap-3xs);
112
+ outline: var(--gap-2) solid var(--focus-color);
113
+ outline-offset: var(--gap-2);
107
114
  } .selected .text {
108
115
  color: var(--color-light-text-primary);
109
116
  } .selected .option {
package/cssm/components/step-indicator/index.module.css CHANGED
@@ -1,3 +1,3 @@
1
- .component {
1
+ .component.component {
2
2
  padding: 0;
3
3
  }
package/cssm/index.module.css CHANGED
@@ -1,7 +1,7 @@
1
1
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
2
- } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
- } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
4
- } :root {
2
+ } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
+ } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
4
+ } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
5
5
  } :root {
6
6
 
7
7
  /* Hard */
@@ -9,8 +9,12 @@
9
9
  /* Up */
10
10
 
11
11
  /* Hard up */
12
- } :root {
13
- } :root {
12
+ } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
13
+
14
+ /* новые значения, используйте их */
15
+ } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
16
+
17
+ /* новые значения, используйте их */
14
18
  } :root {
15
19
  } :root {
16
20
  } .component {
package/esm/Component.js CHANGED
@@ -1,34 +1,33 @@
1
- import React, { useState, useEffect } from 'react';
1
+ import React, { useState } from 'react';
2
2
  import cn from 'classnames';
3
3
  import { Step } from './components/step/Component.js';
4
4
 
5
- var styles = {"component":"steps__component_1n1l2","vertical":"steps__vertical_1n1l2"};
5
+ var styles = {"component":"steps__component_airbo","vertical":"steps__vertical_airbo"};
6
6
  require('./index.css')
7
7
 
8
8
  var Steps = function (_a) {
9
9
  var _b;
10
10
  var className = _a.className, children = _a.children, _c = _a.defaultActiveStep, defaultActiveStep = _c === void 0 ? 1 : _c, activeStepProp = _a.activeStep, _d = _a.isMarkCompletedSteps, isMarkCompletedSteps = _d === void 0 ? true : _d, _e = _a.isVerticalAlign, isVerticalAlign = _e === void 0 ? false : _e, _f = _a.ordered, ordered = _f === void 0 ? true : _f, _g = _a.interactive, interactive = _g === void 0 ? true : _g, _h = _a.fullWidth, fullWidth = _h === void 0 ? false : _h, _j = _a.minSpaceBetweenSteps, minSpaceBetweenSteps = _j === void 0 ? 24 : _j, checkIsStepDisabled = _a.checkIsStepDisabled, checkIsStepError = _a.checkIsStepError, checkIsStepWarning = _a.checkIsStepWarning, checkIsStepWaiting = _a.checkIsStepWaiting, checkIsStepPositive = _a.checkIsStepPositive, checkIsStepCustom = _a.checkIsStepCustom, onChange = _a.onChange, dataTestId = _a.dataTestId;
11
- var _k = useState(activeStepProp || defaultActiveStep), activeStep = _k[0], setActiveStep = _k[1];
11
+ var uncontrolled = activeStepProp === undefined;
12
+ var _k = useState(defaultActiveStep), activeStep = _k[0], setActiveStep = _k[1];
12
13
  var stepsLength = React.Children.count(children);
13
- useEffect(function () {
14
- if (activeStepProp) {
15
- setActiveStep(activeStepProp);
16
- }
17
- }, [activeStepProp]);
18
14
  var handleStepClick = function (stepNumber) {
19
- setActiveStep(stepNumber);
15
+ if (uncontrolled) {
16
+ setActiveStep(stepNumber);
17
+ }
20
18
  if (onChange) {
21
19
  onChange(stepNumber);
22
20
  }
23
21
  };
24
22
  if (!stepsLength)
25
23
  return null;
24
+ var visibleActiveStep = uncontrolled ? activeStep : activeStepProp;
26
25
  return (React.createElement("div", { className: cn(className, styles.component, (_b = {},
27
26
  _b[styles.vertical] = isVerticalAlign,
28
27
  _b)), "data-test-id": dataTestId }, React.Children.map(children, function (step, index) {
29
28
  var stepNumber = index + 1;
30
- var isSelected = stepNumber === activeStep;
31
- var isStepCompleted = isMarkCompletedSteps && stepNumber < activeStep;
29
+ var isSelected = stepNumber === visibleActiveStep;
30
+ var isStepCompleted = isMarkCompletedSteps && stepNumber < visibleActiveStep;
32
31
  var disabled = checkIsStepDisabled ? checkIsStepDisabled(stepNumber) : false;
33
32
  var isPositive = checkIsStepPositive ? checkIsStepPositive(stepNumber) : false;
34
33
  var isError = checkIsStepError ? checkIsStepError(stepNumber) : false;