@alfalab/core-components-steps 1.1.0 → 1.1.1

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 (20) hide show
  1. package/Component.js +1 -1
  2. package/components/step/Component.js +2 -2
  3. package/components/step/index.css +26 -26
  4. package/components/step-indicator/Component.js +1 -1
  5. package/components/step-indicator/index.css +2 -2
  6. package/cssm/components/step/Component.js +1 -1
  7. package/esm/Component.js +1 -1
  8. package/esm/components/step/Component.js +2 -2
  9. package/esm/components/step/index.css +26 -26
  10. package/esm/components/step-indicator/Component.js +1 -1
  11. package/esm/components/step-indicator/index.css +2 -2
  12. package/esm/index.css +3 -3
  13. package/index.css +3 -3
  14. package/modern/Component.js +1 -1
  15. package/modern/components/step/Component.js +2 -2
  16. package/modern/components/step/index.css +26 -26
  17. package/modern/components/step-indicator/Component.js +1 -1
  18. package/modern/components/step-indicator/index.css +2 -2
  19. package/modern/index.css +3 -3
  20. package/package.json +3 -3
package/Component.js CHANGED
@@ -17,7 +17,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
17
17
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
18
18
  var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
19
19
 
20
- var styles = {"component":"steps__component_rm960","vertical":"steps__vertical_rm960"};
20
+ var styles = {"component":"steps__component_87mpb","vertical":"steps__vertical_87mpb"};
21
21
  require('./index.css')
22
22
 
23
23
  var Steps = function (_a) {
package/components/step/Component.js CHANGED
@@ -43,7 +43,7 @@ var __assign = function () {
43
43
  return __assign.apply(this, arguments);
44
44
  };
45
45
 
46
- var styles = {"step":"steps__step_xhvt7","vertical":"steps__vertical_xhvt7","interactive":"steps__interactive_xhvt7","disabled":"steps__disabled_xhvt7","text":"steps__text_xhvt7","indicator":"steps__indicator_xhvt7","option":"steps__option_xhvt7","dash":"steps__dash_xhvt7","completed":"steps__completed_xhvt7","focused":"steps__focused_xhvt7","selected":"steps__selected_xhvt7","checkbox":"steps__checkbox_xhvt7","dot":"steps__dot_xhvt7","error":"steps__error_xhvt7","unordered":"steps__unordered_xhvt7","completedIndicator":"steps__completedIndicator_xhvt7"};
46
+ var styles = {"step":"steps__step_js9jf","vertical":"steps__vertical_js9jf","interactive":"steps__interactive_js9jf","disabled":"steps__disabled_js9jf","text":"steps__text_js9jf","indicator":"steps__indicator_js9jf","option":"steps__option_js9jf","dash":"steps__dash_js9jf","completed":"steps__completed_js9jf","focused":"steps__focused_js9jf","selected":"steps__selected_js9jf","checkbox":"steps__checkbox_js9jf","dot":"steps__dot_js9jf","error":"steps__error_js9jf","unordered":"steps__unordered_js9jf","completedIndicator":"steps__completedIndicator_js9jf"};
47
47
  require('./index.css')
48
48
 
49
49
  var Step = function (_a) {
@@ -83,7 +83,7 @@ var Step = function (_a) {
83
83
  return React__default['default'].createElement(components_stepIndicator_Component.StepIndicator, { iconColor: 'positive', content: React__default['default'].createElement(CheckmarkCircleMIcon.CheckmarkCircleMIcon, null) });
84
84
  }
85
85
  if (isStepCompleted) {
86
- return React__default['default'].createElement(components_stepIndicator_Component.StepIndicator, { iconColor: 'positive', content: React__default['default'].createElement(CheckmarkCircleMIcon.CheckmarkCircleMIcon, null), className: styles.completedIndicator });
86
+ return (React__default['default'].createElement(components_stepIndicator_Component.StepIndicator, { iconColor: 'positive', content: React__default['default'].createElement(CheckmarkCircleMIcon.CheckmarkCircleMIcon, null), className: styles.completedIndicator }));
87
87
  }
88
88
  if (!ordered) {
89
89
  return (React__default['default'].createElement("div", { className: styles.checkbox },
package/components/step/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: j46l8 */
1
+ /* hash: lfrzu */
2
2
  :root {
3
3
  --color-light-border-link: #007aff;
4
4
  --color-light-border-primary: #dbdee1;
@@ -30,33 +30,33 @@
30
30
  --steps-option-svg-color: var(--color-light-graphic-positive);
31
31
  --steps-dash-border: 2px solid var(--color-light-graphic-positive);
32
32
  }
33
- .steps__step_xhvt7 {
33
+ .steps__step_js9jf {
34
34
  display: flex;
35
35
  outline: none
36
36
  }
37
- .steps__step_xhvt7:not(.steps__vertical_xhvt7) {
37
+ .steps__step_js9jf:not(.steps__vertical_js9jf) {
38
38
  align-items: center;
39
39
  }
40
- .steps__step_xhvt7.steps__interactive_xhvt7:not(.steps__disabled_xhvt7):hover {
40
+ .steps__step_js9jf.steps__interactive_js9jf:not(.steps__disabled_js9jf):hover {
41
41
  cursor: pointer;
42
42
  }
43
- .steps__step_xhvt7.steps__disabled_xhvt7:hover .steps__text_xhvt7 {
43
+ .steps__step_js9jf.steps__disabled_js9jf:hover .steps__text_js9jf {
44
44
  background: unset;
45
45
  }
46
- .steps__step_xhvt7.steps__disabled_xhvt7 .steps__indicator_xhvt7 {
46
+ .steps__step_js9jf.steps__disabled_js9jf .steps__indicator_js9jf {
47
47
  cursor: unset;
48
48
  }
49
- .steps__indicator_xhvt7 {
49
+ .steps__indicator_js9jf {
50
50
  cursor: pointer;
51
51
  display: flex;
52
52
  align-items: center;
53
53
  margin-right: var(--gap-2xs)
54
54
  }
55
- .steps__indicator_xhvt7.steps__vertical_xhvt7 {
55
+ .steps__indicator_js9jf.steps__vertical_js9jf {
56
56
  flex-direction: column;
57
57
  margin-right: var(--gap-xs);
58
58
  }
59
- .steps__option_xhvt7 {
59
+ .steps__option_js9jf {
60
60
  font-size: 14px;
61
61
  line-height: 20px;
62
62
  font-weight: 700;
@@ -70,19 +70,19 @@
70
70
  height: 24px;
71
71
  border-radius: 50%
72
72
  }
73
- .steps__option_xhvt7.steps__vertical_xhvt7 {
73
+ .steps__option_js9jf.steps__vertical_js9jf {
74
74
  margin-top: var(--gap-xs);
75
75
  }
76
- .steps__dash_xhvt7 {
76
+ .steps__dash_js9jf {
77
77
  flex: 1 1 auto;
78
78
  min-width: 24px;
79
79
  border-top: 2px solid var(--color-light-border-primary);
80
80
  margin-right: var(--gap-xs)
81
81
  }
82
- .steps__dash_xhvt7.steps__completed_xhvt7 {
82
+ .steps__dash_js9jf.steps__completed_js9jf {
83
83
  border-top: var(--steps-dash-border);
84
84
  }
85
- .steps__dash_xhvt7.steps__vertical_xhvt7 {
85
+ .steps__dash_js9jf.steps__vertical_js9jf {
86
86
  min-width: unset;
87
87
  min-height: 24px;
88
88
  margin-right: 0;
@@ -90,10 +90,10 @@
90
90
  border-left: 2px solid var(--color-light-border-primary);
91
91
  border-top: none;
92
92
  }
93
- .steps__dash_xhvt7.steps__completed_xhvt7.steps__vertical_xhvt7 {
93
+ .steps__dash_js9jf.steps__completed_js9jf.steps__vertical_js9jf {
94
94
  border-left: var(--steps-dash-border);
95
95
  }
96
- .steps__text_xhvt7 {
96
+ .steps__text_js9jf {
97
97
  font-size: 16px;
98
98
  line-height: 24px;
99
99
  font-weight: 400;
@@ -104,24 +104,24 @@
104
104
  border-radius: var(--gap-xs);
105
105
  height: min-content
106
106
  }
107
- .steps__text_xhvt7.steps__interactive_xhvt7:not(.steps__disabled_xhvt7):hover {
107
+ .steps__text_js9jf.steps__interactive_js9jf:not(.steps__disabled_js9jf):hover {
108
108
  background: var(--color-light-bg-primary-inverted-alpha-7);
109
109
  }
110
- .steps__text_xhvt7.steps__interactive_xhvt7:not(.steps__disabled_xhvt7):active {
110
+ .steps__text_js9jf.steps__interactive_js9jf:not(.steps__disabled_js9jf):active {
111
111
  background: var(--color-light-bg-primary-inverted-alpha-15);
112
112
  }
113
- .steps__focused_xhvt7 {
113
+ .steps__focused_js9jf {
114
114
  outline: var(--gap-3xs) solid var(--focus-color);
115
115
  outline-offset: var(--gap-3xs);
116
116
  }
117
- .steps__selected_xhvt7 .steps__text_xhvt7 {
117
+ .steps__selected_js9jf .steps__text_js9jf {
118
118
  color: var(--color-light-graphic-primary);
119
119
  }
120
- .steps__selected_xhvt7 .steps__option_xhvt7 {
120
+ .steps__selected_js9jf .steps__option_js9jf {
121
121
  color: var(--color-light-graphic-primary-inverted);
122
122
  background: var(--color-light-graphic-primary);
123
123
  }
124
- .steps__checkbox_xhvt7 {
124
+ .steps__checkbox_js9jf {
125
125
  display: flex;
126
126
  justify-content: center;
127
127
  align-items: center;
@@ -130,22 +130,22 @@
130
130
  height: 20px;
131
131
  border: 2px solid var(--color-light-graphic-quaternary);
132
132
  }
133
- .steps__dot_xhvt7 {
133
+ .steps__dot_js9jf {
134
134
  width: 10px;
135
135
  height: 10px;
136
136
  border-radius: 50%;
137
137
  background: var(--color-light-graphic-quaternary);
138
138
  }
139
- .steps__selected_xhvt7 .steps__checkbox_xhvt7 {
139
+ .steps__selected_js9jf .steps__checkbox_js9jf {
140
140
  border: 2px solid var(--color-light-graphic-primary)
141
141
  }
142
- .steps__selected_xhvt7 .steps__checkbox_xhvt7 .steps__dot_xhvt7 {
142
+ .steps__selected_js9jf .steps__checkbox_js9jf .steps__dot_js9jf {
143
143
  background: var(--color-light-graphic-primary);
144
144
  }
145
- .steps__option_xhvt7:not(.steps__error_xhvt7).steps__unordered_xhvt7 {
145
+ .steps__option_js9jf:not(.steps__error_js9jf).steps__unordered_js9jf {
146
146
  background: unset;
147
147
  }
148
- .steps__completedIndicator_xhvt7 > [class*='positive'] {
148
+ .steps__completedIndicator_js9jf > [class*='positive'] {
149
149
  color: var(--steps-option-svg-color);
150
150
  background-color: var(--steps-option-svg-color);
151
151
  }
package/components/step-indicator/Component.js CHANGED
@@ -11,7 +11,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
11
11
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
12
12
  var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
13
13
 
14
- var styles = {"component":"steps__component_19vei"};
14
+ var styles = {"component":"steps__component_w5s8e"};
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: crmt3 */
2
- .steps__component_19vei {
1
+ /* hash: xoamc */
2
+ .steps__component_w5s8e {
3
3
  padding: 0;
4
4
  }
package/cssm/components/step/Component.js CHANGED
@@ -83,7 +83,7 @@ var Step = function (_a) {
83
83
  return React__default['default'].createElement(components_stepIndicator_Component.StepIndicator, { iconColor: 'positive', content: React__default['default'].createElement(CheckmarkCircleMIcon.CheckmarkCircleMIcon, null) });
84
84
  }
85
85
  if (isStepCompleted) {
86
- return React__default['default'].createElement(components_stepIndicator_Component.StepIndicator, { iconColor: 'positive', content: React__default['default'].createElement(CheckmarkCircleMIcon.CheckmarkCircleMIcon, null), className: styles__default['default'].completedIndicator });
86
+ return (React__default['default'].createElement(components_stepIndicator_Component.StepIndicator, { iconColor: 'positive', content: React__default['default'].createElement(CheckmarkCircleMIcon.CheckmarkCircleMIcon, null), className: styles__default['default'].completedIndicator }));
87
87
  }
88
88
  if (!ordered) {
89
89
  return (React__default['default'].createElement("div", { className: styles__default['default'].checkbox },
package/esm/Component.js CHANGED
@@ -8,7 +8,7 @@ import '@alfalab/icons-glyph/ClockMIcon';
8
8
  import '@alfalab/core-components-badge/esm';
9
9
  import './components/step-indicator/Component.js';
10
10
 
11
- var styles = {"component":"steps__component_rm960","vertical":"steps__vertical_rm960"};
11
+ var styles = {"component":"steps__component_87mpb","vertical":"steps__vertical_87mpb"};
12
12
  require('./index.css')
13
13
 
14
14
  var Steps = function (_a) {
package/esm/components/step/Component.js CHANGED
@@ -34,7 +34,7 @@ var __assign = function () {
34
34
  return __assign.apply(this, arguments);
35
35
  };
36
36
 
37
- var styles = {"step":"steps__step_xhvt7","vertical":"steps__vertical_xhvt7","interactive":"steps__interactive_xhvt7","disabled":"steps__disabled_xhvt7","text":"steps__text_xhvt7","indicator":"steps__indicator_xhvt7","option":"steps__option_xhvt7","dash":"steps__dash_xhvt7","completed":"steps__completed_xhvt7","focused":"steps__focused_xhvt7","selected":"steps__selected_xhvt7","checkbox":"steps__checkbox_xhvt7","dot":"steps__dot_xhvt7","error":"steps__error_xhvt7","unordered":"steps__unordered_xhvt7","completedIndicator":"steps__completedIndicator_xhvt7"};
37
+ var styles = {"step":"steps__step_js9jf","vertical":"steps__vertical_js9jf","interactive":"steps__interactive_js9jf","disabled":"steps__disabled_js9jf","text":"steps__text_js9jf","indicator":"steps__indicator_js9jf","option":"steps__option_js9jf","dash":"steps__dash_js9jf","completed":"steps__completed_js9jf","focused":"steps__focused_js9jf","selected":"steps__selected_js9jf","checkbox":"steps__checkbox_js9jf","dot":"steps__dot_js9jf","error":"steps__error_js9jf","unordered":"steps__unordered_js9jf","completedIndicator":"steps__completedIndicator_js9jf"};
38
38
  require('./index.css')
39
39
 
40
40
  var Step = function (_a) {
@@ -74,7 +74,7 @@ var Step = function (_a) {
74
74
  return React.createElement(StepIndicator, { iconColor: 'positive', content: React.createElement(CheckmarkCircleMIcon, null) });
75
75
  }
76
76
  if (isStepCompleted) {
77
- return React.createElement(StepIndicator, { iconColor: 'positive', content: React.createElement(CheckmarkCircleMIcon, null), className: styles.completedIndicator });
77
+ return (React.createElement(StepIndicator, { iconColor: 'positive', content: React.createElement(CheckmarkCircleMIcon, null), className: styles.completedIndicator }));
78
78
  }
79
79
  if (!ordered) {
80
80
  return (React.createElement("div", { className: styles.checkbox },
package/esm/components/step/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: j46l8 */
1
+ /* hash: lfrzu */
2
2
  :root {
3
3
  --color-light-border-link: #007aff;
4
4
  --color-light-border-primary: #dbdee1;
@@ -30,33 +30,33 @@
30
30
  --steps-option-svg-color: var(--color-light-graphic-positive);
31
31
  --steps-dash-border: 2px solid var(--color-light-graphic-positive);
32
32
  }
33
- .steps__step_xhvt7 {
33
+ .steps__step_js9jf {
34
34
  display: flex;
35
35
  outline: none
36
36
  }
37
- .steps__step_xhvt7:not(.steps__vertical_xhvt7) {
37
+ .steps__step_js9jf:not(.steps__vertical_js9jf) {
38
38
  align-items: center;
39
39
  }
40
- .steps__step_xhvt7.steps__interactive_xhvt7:not(.steps__disabled_xhvt7):hover {
40
+ .steps__step_js9jf.steps__interactive_js9jf:not(.steps__disabled_js9jf):hover {
41
41
  cursor: pointer;
42
42
  }
43
- .steps__step_xhvt7.steps__disabled_xhvt7:hover .steps__text_xhvt7 {
43
+ .steps__step_js9jf.steps__disabled_js9jf:hover .steps__text_js9jf {
44
44
  background: unset;
45
45
  }
46
- .steps__step_xhvt7.steps__disabled_xhvt7 .steps__indicator_xhvt7 {
46
+ .steps__step_js9jf.steps__disabled_js9jf .steps__indicator_js9jf {
47
47
  cursor: unset;
48
48
  }
49
- .steps__indicator_xhvt7 {
49
+ .steps__indicator_js9jf {
50
50
  cursor: pointer;
51
51
  display: flex;
52
52
  align-items: center;
53
53
  margin-right: var(--gap-2xs)
54
54
  }
55
- .steps__indicator_xhvt7.steps__vertical_xhvt7 {
55
+ .steps__indicator_js9jf.steps__vertical_js9jf {
56
56
  flex-direction: column;
57
57
  margin-right: var(--gap-xs);
58
58
  }
59
- .steps__option_xhvt7 {
59
+ .steps__option_js9jf {
60
60
  font-size: 14px;
61
61
  line-height: 20px;
62
62
  font-weight: 700;
@@ -70,19 +70,19 @@
70
70
  height: 24px;
71
71
  border-radius: 50%
72
72
  }
73
- .steps__option_xhvt7.steps__vertical_xhvt7 {
73
+ .steps__option_js9jf.steps__vertical_js9jf {
74
74
  margin-top: var(--gap-xs);
75
75
  }
76
- .steps__dash_xhvt7 {
76
+ .steps__dash_js9jf {
77
77
  flex: 1 1 auto;
78
78
  min-width: 24px;
79
79
  border-top: 2px solid var(--color-light-border-primary);
80
80
  margin-right: var(--gap-xs)
81
81
  }
82
- .steps__dash_xhvt7.steps__completed_xhvt7 {
82
+ .steps__dash_js9jf.steps__completed_js9jf {
83
83
  border-top: var(--steps-dash-border);
84
84
  }
85
- .steps__dash_xhvt7.steps__vertical_xhvt7 {
85
+ .steps__dash_js9jf.steps__vertical_js9jf {
86
86
  min-width: unset;
87
87
  min-height: 24px;
88
88
  margin-right: 0;
@@ -90,10 +90,10 @@
90
90
  border-left: 2px solid var(--color-light-border-primary);
91
91
  border-top: none;
92
92
  }
93
- .steps__dash_xhvt7.steps__completed_xhvt7.steps__vertical_xhvt7 {
93
+ .steps__dash_js9jf.steps__completed_js9jf.steps__vertical_js9jf {
94
94
  border-left: var(--steps-dash-border);
95
95
  }
96
- .steps__text_xhvt7 {
96
+ .steps__text_js9jf {
97
97
  font-size: 16px;
98
98
  line-height: 24px;
99
99
  font-weight: 400;
@@ -104,24 +104,24 @@
104
104
  border-radius: var(--gap-xs);
105
105
  height: min-content
106
106
  }
107
- .steps__text_xhvt7.steps__interactive_xhvt7:not(.steps__disabled_xhvt7):hover {
107
+ .steps__text_js9jf.steps__interactive_js9jf:not(.steps__disabled_js9jf):hover {
108
108
  background: var(--color-light-bg-primary-inverted-alpha-7);
109
109
  }
110
- .steps__text_xhvt7.steps__interactive_xhvt7:not(.steps__disabled_xhvt7):active {
110
+ .steps__text_js9jf.steps__interactive_js9jf:not(.steps__disabled_js9jf):active {
111
111
  background: var(--color-light-bg-primary-inverted-alpha-15);
112
112
  }
113
- .steps__focused_xhvt7 {
113
+ .steps__focused_js9jf {
114
114
  outline: var(--gap-3xs) solid var(--focus-color);
115
115
  outline-offset: var(--gap-3xs);
116
116
  }
117
- .steps__selected_xhvt7 .steps__text_xhvt7 {
117
+ .steps__selected_js9jf .steps__text_js9jf {
118
118
  color: var(--color-light-graphic-primary);
119
119
  }
120
- .steps__selected_xhvt7 .steps__option_xhvt7 {
120
+ .steps__selected_js9jf .steps__option_js9jf {
121
121
  color: var(--color-light-graphic-primary-inverted);
122
122
  background: var(--color-light-graphic-primary);
123
123
  }
124
- .steps__checkbox_xhvt7 {
124
+ .steps__checkbox_js9jf {
125
125
  display: flex;
126
126
  justify-content: center;
127
127
  align-items: center;
@@ -130,22 +130,22 @@
130
130
  height: 20px;
131
131
  border: 2px solid var(--color-light-graphic-quaternary);
132
132
  }
133
- .steps__dot_xhvt7 {
133
+ .steps__dot_js9jf {
134
134
  width: 10px;
135
135
  height: 10px;
136
136
  border-radius: 50%;
137
137
  background: var(--color-light-graphic-quaternary);
138
138
  }
139
- .steps__selected_xhvt7 .steps__checkbox_xhvt7 {
139
+ .steps__selected_js9jf .steps__checkbox_js9jf {
140
140
  border: 2px solid var(--color-light-graphic-primary)
141
141
  }
142
- .steps__selected_xhvt7 .steps__checkbox_xhvt7 .steps__dot_xhvt7 {
142
+ .steps__selected_js9jf .steps__checkbox_js9jf .steps__dot_js9jf {
143
143
  background: var(--color-light-graphic-primary);
144
144
  }
145
- .steps__option_xhvt7:not(.steps__error_xhvt7).steps__unordered_xhvt7 {
145
+ .steps__option_js9jf:not(.steps__error_js9jf).steps__unordered_js9jf {
146
146
  background: unset;
147
147
  }
148
- .steps__completedIndicator_xhvt7 > [class*='positive'] {
148
+ .steps__completedIndicator_js9jf > [class*='positive'] {
149
149
  color: var(--steps-option-svg-color);
150
150
  background-color: var(--steps-option-svg-color);
151
151
  }
package/esm/components/step-indicator/Component.js CHANGED
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import cn from 'classnames';
3
3
  import { Badge } from '@alfalab/core-components-badge/esm';
4
4
 
5
- var styles = {"component":"steps__component_19vei"};
5
+ var styles = {"component":"steps__component_w5s8e"};
6
6
  require('./index.css')
7
7
 
8
8
  var StepIndicator = function (_a) {
package/esm/components/step-indicator/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: crmt3 */
2
- .steps__component_19vei {
1
+ /* hash: xoamc */
2
+ .steps__component_w5s8e {
3
3
  padding: 0;
4
4
  }
package/esm/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: hx0e0 */
1
+ /* hash: 11k18 */
2
2
  :root {
3
3
 
4
4
  /* Hard */
@@ -7,12 +7,12 @@
7
7
 
8
8
  /* Hard up */
9
9
  }
10
- .steps__component_rm960 {
10
+ .steps__component_87mpb {
11
11
  display: flex;
12
12
  align-items: center;
13
13
  flex-direction: row
14
14
  }
15
- .steps__component_rm960.steps__vertical_rm960 {
15
+ .steps__component_87mpb.steps__vertical_87mpb {
16
16
  flex-direction: column;
17
17
  align-items: flex-start;
18
18
  }
package/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: hx0e0 */
1
+ /* hash: 11k18 */
2
2
  :root {
3
3
 
4
4
  /* Hard */
@@ -7,12 +7,12 @@
7
7
 
8
8
  /* Hard up */
9
9
  }
10
- .steps__component_rm960 {
10
+ .steps__component_87mpb {
11
11
  display: flex;
12
12
  align-items: center;
13
13
  flex-direction: row
14
14
  }
15
- .steps__component_rm960.steps__vertical_rm960 {
15
+ .steps__component_87mpb.steps__vertical_87mpb {
16
16
  flex-direction: column;
17
17
  align-items: flex-start;
18
18
  }
package/modern/Component.js CHANGED
@@ -8,7 +8,7 @@ import '@alfalab/core-components-badge/modern';
8
8
  import './components/step-indicator/Component.js';
9
9
  import { Step } from './components/step/Component.js';
10
10
 
11
- var styles = {"component":"steps__component_rm960","vertical":"steps__vertical_rm960"};
11
+ var styles = {"component":"steps__component_87mpb","vertical":"steps__vertical_87mpb"};
12
12
  require('./index.css')
13
13
 
14
14
  const Steps = ({ className, children, defaultActiveStep = 1, activeStep: activeStepProp, isMarkCompletedSteps = true, isVerticalAlign = false, ordered = true, interactive = true, checkIsStepDisabled, checkIsStepError, checkIsStepWarning, checkIsStepWaiting, checkIsStepPositive, checkIsStepCustom, onChange, dataTestId, }) => {
package/modern/components/step/Component.js CHANGED
@@ -7,7 +7,7 @@ import { ClockMIcon } from '@alfalab/icons-glyph/ClockMIcon';
7
7
  import '@alfalab/core-components-badge/modern';
8
8
  import { StepIndicator } from '../step-indicator/Component.js';
9
9
 
10
- var styles = {"step":"steps__step_xhvt7","vertical":"steps__vertical_xhvt7","interactive":"steps__interactive_xhvt7","disabled":"steps__disabled_xhvt7","text":"steps__text_xhvt7","indicator":"steps__indicator_xhvt7","option":"steps__option_xhvt7","dash":"steps__dash_xhvt7","completed":"steps__completed_xhvt7","focused":"steps__focused_xhvt7","selected":"steps__selected_xhvt7","checkbox":"steps__checkbox_xhvt7","dot":"steps__dot_xhvt7","error":"steps__error_xhvt7","unordered":"steps__unordered_xhvt7","completedIndicator":"steps__completedIndicator_xhvt7"};
10
+ var styles = {"step":"steps__step_js9jf","vertical":"steps__vertical_js9jf","interactive":"steps__interactive_js9jf","disabled":"steps__disabled_js9jf","text":"steps__text_js9jf","indicator":"steps__indicator_js9jf","option":"steps__option_js9jf","dash":"steps__dash_js9jf","completed":"steps__completed_js9jf","focused":"steps__focused_js9jf","selected":"steps__selected_js9jf","checkbox":"steps__checkbox_js9jf","dot":"steps__dot_js9jf","error":"steps__error_js9jf","unordered":"steps__unordered_js9jf","completedIndicator":"steps__completedIndicator_js9jf"};
11
11
  require('./index.css')
12
12
 
13
13
  const Step = ({ children, stepNumber, isSelected, disabled, ordered, isPositive, isError, isWarning, isWaiting, customStepIndicator, isStepCompleted, onClick, interactive, isVerticalAlign, isNotLastStep, }) => {
@@ -45,7 +45,7 @@ const Step = ({ children, stepNumber, isSelected, disabled, ordered, isPositive,
45
45
  return React.createElement(StepIndicator, { iconColor: 'positive', content: React.createElement(CheckmarkCircleMIcon, null) });
46
46
  }
47
47
  if (isStepCompleted) {
48
- return React.createElement(StepIndicator, { iconColor: 'positive', content: React.createElement(CheckmarkCircleMIcon, null), className: styles.completedIndicator });
48
+ return (React.createElement(StepIndicator, { iconColor: 'positive', content: React.createElement(CheckmarkCircleMIcon, null), className: styles.completedIndicator }));
49
49
  }
50
50
  if (!ordered) {
51
51
  return (React.createElement("div", { className: styles.checkbox },
package/modern/components/step/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: j46l8 */
1
+ /* hash: lfrzu */
2
2
  :root {
3
3
  --color-light-border-link: #007aff;
4
4
  --color-light-border-primary: #dbdee1;
@@ -30,33 +30,33 @@
30
30
  --steps-option-svg-color: var(--color-light-graphic-positive);
31
31
  --steps-dash-border: 2px solid var(--color-light-graphic-positive);
32
32
  }
33
- .steps__step_xhvt7 {
33
+ .steps__step_js9jf {
34
34
  display: flex;
35
35
  outline: none
36
36
  }
37
- .steps__step_xhvt7:not(.steps__vertical_xhvt7) {
37
+ .steps__step_js9jf:not(.steps__vertical_js9jf) {
38
38
  align-items: center;
39
39
  }
40
- .steps__step_xhvt7.steps__interactive_xhvt7:not(.steps__disabled_xhvt7):hover {
40
+ .steps__step_js9jf.steps__interactive_js9jf:not(.steps__disabled_js9jf):hover {
41
41
  cursor: pointer;
42
42
  }
43
- .steps__step_xhvt7.steps__disabled_xhvt7:hover .steps__text_xhvt7 {
43
+ .steps__step_js9jf.steps__disabled_js9jf:hover .steps__text_js9jf {
44
44
  background: unset;
45
45
  }
46
- .steps__step_xhvt7.steps__disabled_xhvt7 .steps__indicator_xhvt7 {
46
+ .steps__step_js9jf.steps__disabled_js9jf .steps__indicator_js9jf {
47
47
  cursor: unset;
48
48
  }
49
- .steps__indicator_xhvt7 {
49
+ .steps__indicator_js9jf {
50
50
  cursor: pointer;
51
51
  display: flex;
52
52
  align-items: center;
53
53
  margin-right: var(--gap-2xs)
54
54
  }
55
- .steps__indicator_xhvt7.steps__vertical_xhvt7 {
55
+ .steps__indicator_js9jf.steps__vertical_js9jf {
56
56
  flex-direction: column;
57
57
  margin-right: var(--gap-xs);
58
58
  }
59
- .steps__option_xhvt7 {
59
+ .steps__option_js9jf {
60
60
  font-size: 14px;
61
61
  line-height: 20px;
62
62
  font-weight: 700;
@@ -70,19 +70,19 @@
70
70
  height: 24px;
71
71
  border-radius: 50%
72
72
  }
73
- .steps__option_xhvt7.steps__vertical_xhvt7 {
73
+ .steps__option_js9jf.steps__vertical_js9jf {
74
74
  margin-top: var(--gap-xs);
75
75
  }
76
- .steps__dash_xhvt7 {
76
+ .steps__dash_js9jf {
77
77
  flex: 1 1 auto;
78
78
  min-width: 24px;
79
79
  border-top: 2px solid var(--color-light-border-primary);
80
80
  margin-right: var(--gap-xs)
81
81
  }
82
- .steps__dash_xhvt7.steps__completed_xhvt7 {
82
+ .steps__dash_js9jf.steps__completed_js9jf {
83
83
  border-top: var(--steps-dash-border);
84
84
  }
85
- .steps__dash_xhvt7.steps__vertical_xhvt7 {
85
+ .steps__dash_js9jf.steps__vertical_js9jf {
86
86
  min-width: unset;
87
87
  min-height: 24px;
88
88
  margin-right: 0;
@@ -90,10 +90,10 @@
90
90
  border-left: 2px solid var(--color-light-border-primary);
91
91
  border-top: none;
92
92
  }
93
- .steps__dash_xhvt7.steps__completed_xhvt7.steps__vertical_xhvt7 {
93
+ .steps__dash_js9jf.steps__completed_js9jf.steps__vertical_js9jf {
94
94
  border-left: var(--steps-dash-border);
95
95
  }
96
- .steps__text_xhvt7 {
96
+ .steps__text_js9jf {
97
97
  font-size: 16px;
98
98
  line-height: 24px;
99
99
  font-weight: 400;
@@ -104,24 +104,24 @@
104
104
  border-radius: var(--gap-xs);
105
105
  height: min-content
106
106
  }
107
- .steps__text_xhvt7.steps__interactive_xhvt7:not(.steps__disabled_xhvt7):hover {
107
+ .steps__text_js9jf.steps__interactive_js9jf:not(.steps__disabled_js9jf):hover {
108
108
  background: var(--color-light-bg-primary-inverted-alpha-7);
109
109
  }
110
- .steps__text_xhvt7.steps__interactive_xhvt7:not(.steps__disabled_xhvt7):active {
110
+ .steps__text_js9jf.steps__interactive_js9jf:not(.steps__disabled_js9jf):active {
111
111
  background: var(--color-light-bg-primary-inverted-alpha-15);
112
112
  }
113
- .steps__focused_xhvt7 {
113
+ .steps__focused_js9jf {
114
114
  outline: var(--gap-3xs) solid var(--focus-color);
115
115
  outline-offset: var(--gap-3xs);
116
116
  }
117
- .steps__selected_xhvt7 .steps__text_xhvt7 {
117
+ .steps__selected_js9jf .steps__text_js9jf {
118
118
  color: var(--color-light-graphic-primary);
119
119
  }
120
- .steps__selected_xhvt7 .steps__option_xhvt7 {
120
+ .steps__selected_js9jf .steps__option_js9jf {
121
121
  color: var(--color-light-graphic-primary-inverted);
122
122
  background: var(--color-light-graphic-primary);
123
123
  }
124
- .steps__checkbox_xhvt7 {
124
+ .steps__checkbox_js9jf {
125
125
  display: flex;
126
126
  justify-content: center;
127
127
  align-items: center;
@@ -130,22 +130,22 @@
130
130
  height: 20px;
131
131
  border: 2px solid var(--color-light-graphic-quaternary);
132
132
  }
133
- .steps__dot_xhvt7 {
133
+ .steps__dot_js9jf {
134
134
  width: 10px;
135
135
  height: 10px;
136
136
  border-radius: 50%;
137
137
  background: var(--color-light-graphic-quaternary);
138
138
  }
139
- .steps__selected_xhvt7 .steps__checkbox_xhvt7 {
139
+ .steps__selected_js9jf .steps__checkbox_js9jf {
140
140
  border: 2px solid var(--color-light-graphic-primary)
141
141
  }
142
- .steps__selected_xhvt7 .steps__checkbox_xhvt7 .steps__dot_xhvt7 {
142
+ .steps__selected_js9jf .steps__checkbox_js9jf .steps__dot_js9jf {
143
143
  background: var(--color-light-graphic-primary);
144
144
  }
145
- .steps__option_xhvt7:not(.steps__error_xhvt7).steps__unordered_xhvt7 {
145
+ .steps__option_js9jf:not(.steps__error_js9jf).steps__unordered_js9jf {
146
146
  background: unset;
147
147
  }
148
- .steps__completedIndicator_xhvt7 > [class*='positive'] {
148
+ .steps__completedIndicator_js9jf > [class*='positive'] {
149
149
  color: var(--steps-option-svg-color);
150
150
  background-color: var(--steps-option-svg-color);
151
151
  }
package/modern/components/step-indicator/Component.js CHANGED
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import cn from 'classnames';
3
3
  import { Badge } from '@alfalab/core-components-badge/modern';
4
4
 
5
- var styles = {"component":"steps__component_19vei"};
5
+ var styles = {"component":"steps__component_w5s8e"};
6
6
  require('./index.css')
7
7
 
8
8
  const StepIndicator = ({ content, iconColor, className }) => {
package/modern/components/step-indicator/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: crmt3 */
2
- .steps__component_19vei {
1
+ /* hash: xoamc */
2
+ .steps__component_w5s8e {
3
3
  padding: 0;
4
4
  }
package/modern/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: hx0e0 */
1
+ /* hash: 11k18 */
2
2
  :root {
3
3
 
4
4
  /* Hard */
@@ -7,12 +7,12 @@
7
7
 
8
8
  /* Hard up */
9
9
  }
10
- .steps__component_rm960 {
10
+ .steps__component_87mpb {
11
11
  display: flex;
12
12
  align-items: center;
13
13
  flex-direction: row
14
14
  }
15
- .steps__component_rm960.steps__vertical_rm960 {
15
+ .steps__component_87mpb.steps__vertical_87mpb {
16
16
  flex-direction: column;
17
17
  align-items: flex-start;
18
18
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-steps",
3
- "version": "1.1.0",
3
+ "version": "1.1.1",
4
4
  "description": "",
5
5
  "keywords": [],
6
6
  "license": "MIT",
@@ -17,9 +17,9 @@
17
17
  "react": "^16.9.0 || ^17.0.1 || ^18.0.0"
18
18
  },
19
19
  "dependencies": {
20
- "@alfalab/core-components-badge": "^4.0.1",
20
+ "@alfalab/core-components-badge": "^4.0.2",
21
21
  "@alfalab/hooks": "^1.13.0",
22
- "@alfalab/icons-glyph": "^2.64.0",
22
+ "@alfalab/icons-glyph": "^2.71.0",
23
23
  "classnames": "^2.3.1"
24
24
  }
25
25
  }