@alfalab/core-components-steps 1.1.9 → 1.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/Component.d.ts CHANGED
@@ -72,9 +72,9 @@ type StepsProps = {
72
72
  /**
73
73
  * Кастомный метод для установки кастомного индикатора шага
74
74
  * @param stepNumber - номер шага
75
- * @return Объект StepIndicatorProps { className, content, iconColor }
75
+ * @return Объект StepIndicatorProps { className, content, iconColor } или null
76
76
  */
77
- checkIsStepCustom?: (stepNumber: number) => StepIndicatorProps;
77
+ checkIsStepCustom?: (stepNumber: number) => StepIndicatorProps | null;
78
78
  /**
79
79
  * Обработчик клика на шаг
80
80
  * @param stepNumber - номер активного шага
package/Component.js CHANGED
@@ -18,7 +18,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
18
18
  var React__default = /*#__PURE__*/_interopDefaultCompat(React);
19
19
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
20
20
 
21
- var styles = {"component":"steps__component_1u3oe","vertical":"steps__vertical_1u3oe"};
21
+ var styles = {"component":"steps__component_1hggi","vertical":"steps__vertical_1hggi"};
22
22
  require('./index.css')
23
23
 
24
24
  var Steps = function (_a) {
@@ -50,7 +50,7 @@ type StepProps = {
50
50
  /**
51
51
  * Свойства кастомного индикатора текущего шага
52
52
  */
53
- customStepIndicator?: StepIndicatorProps;
53
+ customStepIndicator?: StepIndicatorProps | null;
54
54
  /**
55
55
  * Управление ориентацией компонента
56
56
  * @default false
@@ -17,7 +17,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
17
17
  var React__default = /*#__PURE__*/_interopDefaultCompat(React);
18
18
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
19
19
 
20
- var styles = {"step":"steps__step_sgdf5","vertical":"steps__vertical_sgdf5","interactive":"steps__interactive_sgdf5","disabled":"steps__disabled_sgdf5","text":"steps__text_sgdf5","indicator":"steps__indicator_sgdf5","option":"steps__option_sgdf5","dash":"steps__dash_sgdf5","completed":"steps__completed_sgdf5","focused":"steps__focused_sgdf5","selected":"steps__selected_sgdf5","checkbox":"steps__checkbox_sgdf5","dot":"steps__dot_sgdf5","error":"steps__error_sgdf5","unordered":"steps__unordered_sgdf5","completedIndicator":"steps__completedIndicator_sgdf5"};
20
+ var styles = {"step":"steps__step_5fjrx","vertical":"steps__vertical_5fjrx","interactive":"steps__interactive_5fjrx","disabled":"steps__disabled_5fjrx","text":"steps__text_5fjrx","indicator":"steps__indicator_5fjrx","option":"steps__option_5fjrx","dash":"steps__dash_5fjrx","completed":"steps__completed_5fjrx","focused":"steps__focused_5fjrx","selected":"steps__selected_5fjrx","checkbox":"steps__checkbox_5fjrx","dot":"steps__dot_5fjrx","error":"steps__error_5fjrx","unordered":"steps__unordered_5fjrx","completedIndicator":"steps__completedIndicator_5fjrx"};
21
21
  require('./index.css')
22
22
 
23
23
  var Step = function (_a) {
@@ -1,4 +1,4 @@
1
- /* hash: vf2p1 */
1
+ /* hash: 1k7af */
2
2
  :root {
3
3
  } /* deprecated */ :root {
4
4
  --color-light-border-link: #0072ef;
@@ -31,26 +31,26 @@
31
31
  } :root {
32
32
  --steps-option-svg-color: var(--color-light-graphic-positive);
33
33
  --steps-dash-border: 2px solid var(--color-light-graphic-positive);
34
- } .steps__step_sgdf5 {
34
+ } .steps__step_5fjrx {
35
35
  display: flex;
36
36
  outline: none
37
- } .steps__step_sgdf5:not(.steps__vertical_sgdf5) {
37
+ } .steps__step_5fjrx:not(.steps__vertical_5fjrx) {
38
38
  align-items: center;
39
- } .steps__step_sgdf5.steps__interactive_sgdf5:not(.steps__disabled_sgdf5):hover {
39
+ } .steps__step_5fjrx.steps__interactive_5fjrx:not(.steps__disabled_5fjrx):hover {
40
40
  cursor: pointer;
41
- } .steps__step_sgdf5.steps__disabled_sgdf5:hover .steps__text_sgdf5 {
41
+ } .steps__step_5fjrx.steps__disabled_5fjrx:hover .steps__text_5fjrx {
42
42
  background: unset;
43
- } .steps__step_sgdf5.steps__disabled_sgdf5 .steps__indicator_sgdf5 {
43
+ } .steps__step_5fjrx.steps__disabled_5fjrx .steps__indicator_5fjrx {
44
44
  cursor: unset;
45
- } .steps__indicator_sgdf5 {
45
+ } .steps__indicator_5fjrx {
46
46
  cursor: pointer;
47
47
  display: flex;
48
48
  align-items: center;
49
49
  margin-right: var(--gap-2xs)
50
- } .steps__indicator_sgdf5.steps__vertical_sgdf5 {
50
+ } .steps__indicator_5fjrx.steps__vertical_5fjrx {
51
51
  flex-direction: column;
52
52
  margin-right: var(--gap-xs);
53
- } .steps__option_sgdf5 {
53
+ } .steps__option_5fjrx {
54
54
  font-size: 14px;
55
55
  line-height: 20px;
56
56
  font-weight: 700;
@@ -63,25 +63,25 @@
63
63
  min-width: 24px;
64
64
  height: 24px;
65
65
  border-radius: var(--border-radius-circle)
66
- } .steps__option_sgdf5.steps__vertical_sgdf5 {
66
+ } .steps__option_5fjrx.steps__vertical_5fjrx {
67
67
  margin-top: var(--gap-xs);
68
- } .steps__dash_sgdf5 {
68
+ } .steps__dash_5fjrx {
69
69
  flex: 1 1 auto;
70
70
  min-width: 24px;
71
71
  border-top: 2px solid var(--color-light-border-primary);
72
72
  margin-right: var(--gap-xs)
73
- } .steps__dash_sgdf5.steps__completed_sgdf5 {
73
+ } .steps__dash_5fjrx.steps__completed_5fjrx {
74
74
  border-top: var(--steps-dash-border);
75
- } .steps__dash_sgdf5.steps__vertical_sgdf5 {
75
+ } .steps__dash_5fjrx.steps__vertical_5fjrx {
76
76
  min-width: unset;
77
77
  min-height: 24px;
78
78
  margin-right: 0;
79
79
  margin-top: var(--gap-xs);
80
80
  border-left: 2px solid var(--color-light-border-primary);
81
81
  border-top: none;
82
- } .steps__dash_sgdf5.steps__completed_sgdf5.steps__vertical_sgdf5 {
82
+ } .steps__dash_5fjrx.steps__completed_5fjrx.steps__vertical_5fjrx {
83
83
  border-left: var(--steps-dash-border);
84
- } .steps__text_sgdf5 {
84
+ } .steps__text_5fjrx {
85
85
  font-size: 16px;
86
86
  line-height: 24px;
87
87
  font-weight: 400;
@@ -91,19 +91,19 @@
91
91
  color: var(--color-light-text-primary);
92
92
  border-radius: var(--gap-xs);
93
93
  height: min-content
94
- } .steps__text_sgdf5.steps__interactive_sgdf5:not(.steps__disabled_sgdf5):hover {
94
+ } .steps__text_5fjrx.steps__interactive_5fjrx:not(.steps__disabled_5fjrx):hover {
95
95
  background: var(--color-light-bg-primary-inverted-alpha-7);
96
- } .steps__text_sgdf5.steps__interactive_sgdf5:not(.steps__disabled_sgdf5):active {
96
+ } .steps__text_5fjrx.steps__interactive_5fjrx:not(.steps__disabled_5fjrx):active {
97
97
  background: var(--color-light-bg-primary-inverted-alpha-15);
98
- } .steps__focused_sgdf5 {
98
+ } .steps__focused_5fjrx {
99
99
  outline: var(--gap-3xs) solid var(--focus-color);
100
100
  outline-offset: var(--gap-3xs);
101
- } .steps__selected_sgdf5 .steps__text_sgdf5 {
101
+ } .steps__selected_5fjrx .steps__text_5fjrx {
102
102
  color: var(--color-light-graphic-primary);
103
- } .steps__selected_sgdf5 .steps__option_sgdf5 {
103
+ } .steps__selected_5fjrx .steps__option_5fjrx {
104
104
  color: var(--color-light-graphic-primary-inverted);
105
105
  background: var(--color-light-graphic-primary);
106
- } .steps__checkbox_sgdf5 {
106
+ } .steps__checkbox_5fjrx {
107
107
  display: flex;
108
108
  justify-content: center;
109
109
  align-items: center;
@@ -111,18 +111,18 @@
111
111
  width: 20px;
112
112
  height: 20px;
113
113
  border: 2px solid var(--color-light-graphic-quaternary);
114
- } .steps__dot_sgdf5 {
114
+ } .steps__dot_5fjrx {
115
115
  width: 10px;
116
116
  height: 10px;
117
117
  border-radius: var(--border-radius-circle);
118
118
  background: var(--color-light-graphic-quaternary);
119
- } .steps__selected_sgdf5 .steps__checkbox_sgdf5 {
119
+ } .steps__selected_5fjrx .steps__checkbox_5fjrx {
120
120
  border: 2px solid var(--color-light-graphic-primary)
121
- } .steps__selected_sgdf5 .steps__checkbox_sgdf5 .steps__dot_sgdf5 {
121
+ } .steps__selected_5fjrx .steps__checkbox_5fjrx .steps__dot_5fjrx {
122
122
  background: var(--color-light-graphic-primary);
123
- } .steps__option_sgdf5:not(.steps__error_sgdf5).steps__unordered_sgdf5 {
123
+ } .steps__option_5fjrx:not(.steps__error_5fjrx).steps__unordered_5fjrx {
124
124
  background: unset;
125
- } .steps__completedIndicator_sgdf5 > [class*='positive'] {
125
+ } .steps__completedIndicator_5fjrx > [class*='positive'] {
126
126
  color: var(--steps-option-svg-color);
127
127
  background-color: var(--steps-option-svg-color);
128
128
  }
@@ -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_cg8qn"};
14
+ var styles = {"component":"steps__component_14mfc"};
15
15
  require('./index.css')
16
16
 
17
17
  var StepIndicator = function (_a) {
@@ -1,4 +1,4 @@
1
- /* hash: nozx6 */
2
- .steps__component_cg8qn {
1
+ /* hash: 1ch7o */
2
+ .steps__component_14mfc {
3
3
  padding: 0;
4
4
  }
@@ -72,9 +72,9 @@ type StepsProps = {
72
72
  /**
73
73
  * Кастомный метод для установки кастомного индикатора шага
74
74
  * @param stepNumber - номер шага
75
- * @return Объект StepIndicatorProps { className, content, iconColor }
75
+ * @return Объект StepIndicatorProps { className, content, iconColor } или null
76
76
  */
77
- checkIsStepCustom?: (stepNumber: number) => StepIndicatorProps;
77
+ checkIsStepCustom?: (stepNumber: number) => StepIndicatorProps | null;
78
78
  /**
79
79
  * Обработчик клика на шаг
80
80
  * @param stepNumber - номер активного шага
@@ -50,7 +50,7 @@ type StepProps = {
50
50
  /**
51
51
  * Свойства кастомного индикатора текущего шага
52
52
  */
53
- customStepIndicator?: StepIndicatorProps;
53
+ customStepIndicator?: StepIndicatorProps | null;
54
54
  /**
55
55
  * Управление ориентацией компонента
56
56
  * @default false
@@ -72,9 +72,9 @@ type StepsProps = {
72
72
  /**
73
73
  * Кастомный метод для установки кастомного индикатора шага
74
74
  * @param stepNumber - номер шага
75
- * @return Объект StepIndicatorProps { className, content, iconColor }
75
+ * @return Объект StepIndicatorProps { className, content, iconColor } или null
76
76
  */
77
- checkIsStepCustom?: (stepNumber: number) => StepIndicatorProps;
77
+ checkIsStepCustom?: (stepNumber: number) => StepIndicatorProps | null;
78
78
  /**
79
79
  * Обработчик клика на шаг
80
80
  * @param stepNumber - номер активного шага
package/esm/Component.js CHANGED
@@ -9,7 +9,7 @@ import '@alfalab/icons-glyph/ExclamationCircleMIcon';
9
9
  import './components/step-indicator/Component.js';
10
10
  import '@alfalab/core-components-badge/esm';
11
11
 
12
- var styles = {"component":"steps__component_1u3oe","vertical":"steps__vertical_1u3oe"};
12
+ var styles = {"component":"steps__component_1hggi","vertical":"steps__vertical_1hggi"};
13
13
  require('./index.css')
14
14
 
15
15
  var Steps = function (_a) {
@@ -50,7 +50,7 @@ type StepProps = {
50
50
  /**
51
51
  * Свойства кастомного индикатора текущего шага
52
52
  */
53
- customStepIndicator?: StepIndicatorProps;
53
+ customStepIndicator?: StepIndicatorProps | null;
54
54
  /**
55
55
  * Управление ориентацией компонента
56
56
  * @default false
@@ -8,7 +8,7 @@ import { ExclamationCircleMIcon } from '@alfalab/icons-glyph/ExclamationCircleMI
8
8
  import { StepIndicator } from '../step-indicator/Component.js';
9
9
  import '@alfalab/core-components-badge/esm';
10
10
 
11
- var styles = {"step":"steps__step_sgdf5","vertical":"steps__vertical_sgdf5","interactive":"steps__interactive_sgdf5","disabled":"steps__disabled_sgdf5","text":"steps__text_sgdf5","indicator":"steps__indicator_sgdf5","option":"steps__option_sgdf5","dash":"steps__dash_sgdf5","completed":"steps__completed_sgdf5","focused":"steps__focused_sgdf5","selected":"steps__selected_sgdf5","checkbox":"steps__checkbox_sgdf5","dot":"steps__dot_sgdf5","error":"steps__error_sgdf5","unordered":"steps__unordered_sgdf5","completedIndicator":"steps__completedIndicator_sgdf5"};
11
+ var styles = {"step":"steps__step_5fjrx","vertical":"steps__vertical_5fjrx","interactive":"steps__interactive_5fjrx","disabled":"steps__disabled_5fjrx","text":"steps__text_5fjrx","indicator":"steps__indicator_5fjrx","option":"steps__option_5fjrx","dash":"steps__dash_5fjrx","completed":"steps__completed_5fjrx","focused":"steps__focused_5fjrx","selected":"steps__selected_5fjrx","checkbox":"steps__checkbox_5fjrx","dot":"steps__dot_5fjrx","error":"steps__error_5fjrx","unordered":"steps__unordered_5fjrx","completedIndicator":"steps__completedIndicator_5fjrx"};
12
12
  require('./index.css')
13
13
 
14
14
  var Step = function (_a) {
@@ -1,4 +1,4 @@
1
- /* hash: vf2p1 */
1
+ /* hash: 1k7af */
2
2
  :root {
3
3
  } /* deprecated */ :root {
4
4
  --color-light-border-link: #0072ef;
@@ -31,26 +31,26 @@
31
31
  } :root {
32
32
  --steps-option-svg-color: var(--color-light-graphic-positive);
33
33
  --steps-dash-border: 2px solid var(--color-light-graphic-positive);
34
- } .steps__step_sgdf5 {
34
+ } .steps__step_5fjrx {
35
35
  display: flex;
36
36
  outline: none
37
- } .steps__step_sgdf5:not(.steps__vertical_sgdf5) {
37
+ } .steps__step_5fjrx:not(.steps__vertical_5fjrx) {
38
38
  align-items: center;
39
- } .steps__step_sgdf5.steps__interactive_sgdf5:not(.steps__disabled_sgdf5):hover {
39
+ } .steps__step_5fjrx.steps__interactive_5fjrx:not(.steps__disabled_5fjrx):hover {
40
40
  cursor: pointer;
41
- } .steps__step_sgdf5.steps__disabled_sgdf5:hover .steps__text_sgdf5 {
41
+ } .steps__step_5fjrx.steps__disabled_5fjrx:hover .steps__text_5fjrx {
42
42
  background: unset;
43
- } .steps__step_sgdf5.steps__disabled_sgdf5 .steps__indicator_sgdf5 {
43
+ } .steps__step_5fjrx.steps__disabled_5fjrx .steps__indicator_5fjrx {
44
44
  cursor: unset;
45
- } .steps__indicator_sgdf5 {
45
+ } .steps__indicator_5fjrx {
46
46
  cursor: pointer;
47
47
  display: flex;
48
48
  align-items: center;
49
49
  margin-right: var(--gap-2xs)
50
- } .steps__indicator_sgdf5.steps__vertical_sgdf5 {
50
+ } .steps__indicator_5fjrx.steps__vertical_5fjrx {
51
51
  flex-direction: column;
52
52
  margin-right: var(--gap-xs);
53
- } .steps__option_sgdf5 {
53
+ } .steps__option_5fjrx {
54
54
  font-size: 14px;
55
55
  line-height: 20px;
56
56
  font-weight: 700;
@@ -63,25 +63,25 @@
63
63
  min-width: 24px;
64
64
  height: 24px;
65
65
  border-radius: var(--border-radius-circle)
66
- } .steps__option_sgdf5.steps__vertical_sgdf5 {
66
+ } .steps__option_5fjrx.steps__vertical_5fjrx {
67
67
  margin-top: var(--gap-xs);
68
- } .steps__dash_sgdf5 {
68
+ } .steps__dash_5fjrx {
69
69
  flex: 1 1 auto;
70
70
  min-width: 24px;
71
71
  border-top: 2px solid var(--color-light-border-primary);
72
72
  margin-right: var(--gap-xs)
73
- } .steps__dash_sgdf5.steps__completed_sgdf5 {
73
+ } .steps__dash_5fjrx.steps__completed_5fjrx {
74
74
  border-top: var(--steps-dash-border);
75
- } .steps__dash_sgdf5.steps__vertical_sgdf5 {
75
+ } .steps__dash_5fjrx.steps__vertical_5fjrx {
76
76
  min-width: unset;
77
77
  min-height: 24px;
78
78
  margin-right: 0;
79
79
  margin-top: var(--gap-xs);
80
80
  border-left: 2px solid var(--color-light-border-primary);
81
81
  border-top: none;
82
- } .steps__dash_sgdf5.steps__completed_sgdf5.steps__vertical_sgdf5 {
82
+ } .steps__dash_5fjrx.steps__completed_5fjrx.steps__vertical_5fjrx {
83
83
  border-left: var(--steps-dash-border);
84
- } .steps__text_sgdf5 {
84
+ } .steps__text_5fjrx {
85
85
  font-size: 16px;
86
86
  line-height: 24px;
87
87
  font-weight: 400;
@@ -91,19 +91,19 @@
91
91
  color: var(--color-light-text-primary);
92
92
  border-radius: var(--gap-xs);
93
93
  height: min-content
94
- } .steps__text_sgdf5.steps__interactive_sgdf5:not(.steps__disabled_sgdf5):hover {
94
+ } .steps__text_5fjrx.steps__interactive_5fjrx:not(.steps__disabled_5fjrx):hover {
95
95
  background: var(--color-light-bg-primary-inverted-alpha-7);
96
- } .steps__text_sgdf5.steps__interactive_sgdf5:not(.steps__disabled_sgdf5):active {
96
+ } .steps__text_5fjrx.steps__interactive_5fjrx:not(.steps__disabled_5fjrx):active {
97
97
  background: var(--color-light-bg-primary-inverted-alpha-15);
98
- } .steps__focused_sgdf5 {
98
+ } .steps__focused_5fjrx {
99
99
  outline: var(--gap-3xs) solid var(--focus-color);
100
100
  outline-offset: var(--gap-3xs);
101
- } .steps__selected_sgdf5 .steps__text_sgdf5 {
101
+ } .steps__selected_5fjrx .steps__text_5fjrx {
102
102
  color: var(--color-light-graphic-primary);
103
- } .steps__selected_sgdf5 .steps__option_sgdf5 {
103
+ } .steps__selected_5fjrx .steps__option_5fjrx {
104
104
  color: var(--color-light-graphic-primary-inverted);
105
105
  background: var(--color-light-graphic-primary);
106
- } .steps__checkbox_sgdf5 {
106
+ } .steps__checkbox_5fjrx {
107
107
  display: flex;
108
108
  justify-content: center;
109
109
  align-items: center;
@@ -111,18 +111,18 @@
111
111
  width: 20px;
112
112
  height: 20px;
113
113
  border: 2px solid var(--color-light-graphic-quaternary);
114
- } .steps__dot_sgdf5 {
114
+ } .steps__dot_5fjrx {
115
115
  width: 10px;
116
116
  height: 10px;
117
117
  border-radius: var(--border-radius-circle);
118
118
  background: var(--color-light-graphic-quaternary);
119
- } .steps__selected_sgdf5 .steps__checkbox_sgdf5 {
119
+ } .steps__selected_5fjrx .steps__checkbox_5fjrx {
120
120
  border: 2px solid var(--color-light-graphic-primary)
121
- } .steps__selected_sgdf5 .steps__checkbox_sgdf5 .steps__dot_sgdf5 {
121
+ } .steps__selected_5fjrx .steps__checkbox_5fjrx .steps__dot_5fjrx {
122
122
  background: var(--color-light-graphic-primary);
123
- } .steps__option_sgdf5:not(.steps__error_sgdf5).steps__unordered_sgdf5 {
123
+ } .steps__option_5fjrx:not(.steps__error_5fjrx).steps__unordered_5fjrx {
124
124
  background: unset;
125
- } .steps__completedIndicator_sgdf5 > [class*='positive'] {
125
+ } .steps__completedIndicator_5fjrx > [class*='positive'] {
126
126
  color: var(--steps-option-svg-color);
127
127
  background-color: var(--steps-option-svg-color);
128
128
  }
@@ -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_cg8qn"};
5
+ var styles = {"component":"steps__component_14mfc"};
6
6
  require('./index.css')
7
7
 
8
8
  var StepIndicator = function (_a) {
@@ -1,4 +1,4 @@
1
- /* hash: nozx6 */
2
- .steps__component_cg8qn {
1
+ /* hash: 1ch7o */
2
+ .steps__component_14mfc {
3
3
  padding: 0;
4
4
  }
package/esm/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 1q3de */
1
+ /* hash: 1pi6i */
2
2
  :root {
3
3
  } /* 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 */
4
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 */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -14,11 +14,11 @@
14
14
  } :root {
15
15
  } :root {
16
16
  } :root {
17
- } .steps__component_1u3oe {
17
+ } .steps__component_1hggi {
18
18
  display: flex;
19
19
  align-items: center;
20
20
  flex-direction: row
21
- } .steps__component_1u3oe.steps__vertical_1u3oe {
21
+ } .steps__component_1hggi.steps__vertical_1hggi {
22
22
  flex-direction: column;
23
23
  align-items: flex-start;
24
24
  }
package/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 1q3de */
1
+ /* hash: 1pi6i */
2
2
  :root {
3
3
  } /* 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 */
4
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 */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -14,11 +14,11 @@
14
14
  } :root {
15
15
  } :root {
16
16
  } :root {
17
- } .steps__component_1u3oe {
17
+ } .steps__component_1hggi {
18
18
  display: flex;
19
19
  align-items: center;
20
20
  flex-direction: row
21
- } .steps__component_1u3oe.steps__vertical_1u3oe {
21
+ } .steps__component_1hggi.steps__vertical_1hggi {
22
22
  flex-direction: column;
23
23
  align-items: flex-start;
24
24
  }
@@ -72,9 +72,9 @@ type StepsProps = {
72
72
  /**
73
73
  * Кастомный метод для установки кастомного индикатора шага
74
74
  * @param stepNumber - номер шага
75
- * @return Объект StepIndicatorProps { className, content, iconColor }
75
+ * @return Объект StepIndicatorProps { className, content, iconColor } или null
76
76
  */
77
- checkIsStepCustom?: (stepNumber: number) => StepIndicatorProps;
77
+ checkIsStepCustom?: (stepNumber: number) => StepIndicatorProps | null;
78
78
  /**
79
79
  * Обработчик клика на шаг
80
80
  * @param stepNumber - номер активного шага
@@ -8,7 +8,7 @@ import '@alfalab/icons-glyph/ExclamationCircleMIcon';
8
8
  import './components/step-indicator/Component.js';
9
9
  import '@alfalab/core-components-badge/modern';
10
10
 
11
- const styles = {"component":"steps__component_1u3oe","vertical":"steps__vertical_1u3oe"};
11
+ const styles = {"component":"steps__component_1hggi","vertical":"steps__vertical_1hggi"};
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, }) => {
@@ -50,7 +50,7 @@ type StepProps = {
50
50
  /**
51
51
  * Свойства кастомного индикатора текущего шага
52
52
  */
53
- customStepIndicator?: StepIndicatorProps;
53
+ customStepIndicator?: StepIndicatorProps | null;
54
54
  /**
55
55
  * Управление ориентацией компонента
56
56
  * @default false
@@ -7,7 +7,7 @@ import { ExclamationCircleMIcon } from '@alfalab/icons-glyph/ExclamationCircleMI
7
7
  import { StepIndicator } from '../step-indicator/Component.js';
8
8
  import '@alfalab/core-components-badge/modern';
9
9
 
10
- const styles = {"step":"steps__step_sgdf5","vertical":"steps__vertical_sgdf5","interactive":"steps__interactive_sgdf5","disabled":"steps__disabled_sgdf5","text":"steps__text_sgdf5","indicator":"steps__indicator_sgdf5","option":"steps__option_sgdf5","dash":"steps__dash_sgdf5","completed":"steps__completed_sgdf5","focused":"steps__focused_sgdf5","selected":"steps__selected_sgdf5","checkbox":"steps__checkbox_sgdf5","dot":"steps__dot_sgdf5","error":"steps__error_sgdf5","unordered":"steps__unordered_sgdf5","completedIndicator":"steps__completedIndicator_sgdf5"};
10
+ const styles = {"step":"steps__step_5fjrx","vertical":"steps__vertical_5fjrx","interactive":"steps__interactive_5fjrx","disabled":"steps__disabled_5fjrx","text":"steps__text_5fjrx","indicator":"steps__indicator_5fjrx","option":"steps__option_5fjrx","dash":"steps__dash_5fjrx","completed":"steps__completed_5fjrx","focused":"steps__focused_5fjrx","selected":"steps__selected_5fjrx","checkbox":"steps__checkbox_5fjrx","dot":"steps__dot_5fjrx","error":"steps__error_5fjrx","unordered":"steps__unordered_5fjrx","completedIndicator":"steps__completedIndicator_5fjrx"};
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, }) => {
@@ -1,4 +1,4 @@
1
- /* hash: vf2p1 */
1
+ /* hash: 1k7af */
2
2
  :root {
3
3
  } /* deprecated */ :root {
4
4
  --color-light-border-link: #0072ef;
@@ -31,26 +31,26 @@
31
31
  } :root {
32
32
  --steps-option-svg-color: var(--color-light-graphic-positive);
33
33
  --steps-dash-border: 2px solid var(--color-light-graphic-positive);
34
- } .steps__step_sgdf5 {
34
+ } .steps__step_5fjrx {
35
35
  display: flex;
36
36
  outline: none
37
- } .steps__step_sgdf5:not(.steps__vertical_sgdf5) {
37
+ } .steps__step_5fjrx:not(.steps__vertical_5fjrx) {
38
38
  align-items: center;
39
- } .steps__step_sgdf5.steps__interactive_sgdf5:not(.steps__disabled_sgdf5):hover {
39
+ } .steps__step_5fjrx.steps__interactive_5fjrx:not(.steps__disabled_5fjrx):hover {
40
40
  cursor: pointer;
41
- } .steps__step_sgdf5.steps__disabled_sgdf5:hover .steps__text_sgdf5 {
41
+ } .steps__step_5fjrx.steps__disabled_5fjrx:hover .steps__text_5fjrx {
42
42
  background: unset;
43
- } .steps__step_sgdf5.steps__disabled_sgdf5 .steps__indicator_sgdf5 {
43
+ } .steps__step_5fjrx.steps__disabled_5fjrx .steps__indicator_5fjrx {
44
44
  cursor: unset;
45
- } .steps__indicator_sgdf5 {
45
+ } .steps__indicator_5fjrx {
46
46
  cursor: pointer;
47
47
  display: flex;
48
48
  align-items: center;
49
49
  margin-right: var(--gap-2xs)
50
- } .steps__indicator_sgdf5.steps__vertical_sgdf5 {
50
+ } .steps__indicator_5fjrx.steps__vertical_5fjrx {
51
51
  flex-direction: column;
52
52
  margin-right: var(--gap-xs);
53
- } .steps__option_sgdf5 {
53
+ } .steps__option_5fjrx {
54
54
  font-size: 14px;
55
55
  line-height: 20px;
56
56
  font-weight: 700;
@@ -63,25 +63,25 @@
63
63
  min-width: 24px;
64
64
  height: 24px;
65
65
  border-radius: var(--border-radius-circle)
66
- } .steps__option_sgdf5.steps__vertical_sgdf5 {
66
+ } .steps__option_5fjrx.steps__vertical_5fjrx {
67
67
  margin-top: var(--gap-xs);
68
- } .steps__dash_sgdf5 {
68
+ } .steps__dash_5fjrx {
69
69
  flex: 1 1 auto;
70
70
  min-width: 24px;
71
71
  border-top: 2px solid var(--color-light-border-primary);
72
72
  margin-right: var(--gap-xs)
73
- } .steps__dash_sgdf5.steps__completed_sgdf5 {
73
+ } .steps__dash_5fjrx.steps__completed_5fjrx {
74
74
  border-top: var(--steps-dash-border);
75
- } .steps__dash_sgdf5.steps__vertical_sgdf5 {
75
+ } .steps__dash_5fjrx.steps__vertical_5fjrx {
76
76
  min-width: unset;
77
77
  min-height: 24px;
78
78
  margin-right: 0;
79
79
  margin-top: var(--gap-xs);
80
80
  border-left: 2px solid var(--color-light-border-primary);
81
81
  border-top: none;
82
- } .steps__dash_sgdf5.steps__completed_sgdf5.steps__vertical_sgdf5 {
82
+ } .steps__dash_5fjrx.steps__completed_5fjrx.steps__vertical_5fjrx {
83
83
  border-left: var(--steps-dash-border);
84
- } .steps__text_sgdf5 {
84
+ } .steps__text_5fjrx {
85
85
  font-size: 16px;
86
86
  line-height: 24px;
87
87
  font-weight: 400;
@@ -91,19 +91,19 @@
91
91
  color: var(--color-light-text-primary);
92
92
  border-radius: var(--gap-xs);
93
93
  height: min-content
94
- } .steps__text_sgdf5.steps__interactive_sgdf5:not(.steps__disabled_sgdf5):hover {
94
+ } .steps__text_5fjrx.steps__interactive_5fjrx:not(.steps__disabled_5fjrx):hover {
95
95
  background: var(--color-light-bg-primary-inverted-alpha-7);
96
- } .steps__text_sgdf5.steps__interactive_sgdf5:not(.steps__disabled_sgdf5):active {
96
+ } .steps__text_5fjrx.steps__interactive_5fjrx:not(.steps__disabled_5fjrx):active {
97
97
  background: var(--color-light-bg-primary-inverted-alpha-15);
98
- } .steps__focused_sgdf5 {
98
+ } .steps__focused_5fjrx {
99
99
  outline: var(--gap-3xs) solid var(--focus-color);
100
100
  outline-offset: var(--gap-3xs);
101
- } .steps__selected_sgdf5 .steps__text_sgdf5 {
101
+ } .steps__selected_5fjrx .steps__text_5fjrx {
102
102
  color: var(--color-light-graphic-primary);
103
- } .steps__selected_sgdf5 .steps__option_sgdf5 {
103
+ } .steps__selected_5fjrx .steps__option_5fjrx {
104
104
  color: var(--color-light-graphic-primary-inverted);
105
105
  background: var(--color-light-graphic-primary);
106
- } .steps__checkbox_sgdf5 {
106
+ } .steps__checkbox_5fjrx {
107
107
  display: flex;
108
108
  justify-content: center;
109
109
  align-items: center;
@@ -111,18 +111,18 @@
111
111
  width: 20px;
112
112
  height: 20px;
113
113
  border: 2px solid var(--color-light-graphic-quaternary);
114
- } .steps__dot_sgdf5 {
114
+ } .steps__dot_5fjrx {
115
115
  width: 10px;
116
116
  height: 10px;
117
117
  border-radius: var(--border-radius-circle);
118
118
  background: var(--color-light-graphic-quaternary);
119
- } .steps__selected_sgdf5 .steps__checkbox_sgdf5 {
119
+ } .steps__selected_5fjrx .steps__checkbox_5fjrx {
120
120
  border: 2px solid var(--color-light-graphic-primary)
121
- } .steps__selected_sgdf5 .steps__checkbox_sgdf5 .steps__dot_sgdf5 {
121
+ } .steps__selected_5fjrx .steps__checkbox_5fjrx .steps__dot_5fjrx {
122
122
  background: var(--color-light-graphic-primary);
123
- } .steps__option_sgdf5:not(.steps__error_sgdf5).steps__unordered_sgdf5 {
123
+ } .steps__option_5fjrx:not(.steps__error_5fjrx).steps__unordered_5fjrx {
124
124
  background: unset;
125
- } .steps__completedIndicator_sgdf5 > [class*='positive'] {
125
+ } .steps__completedIndicator_5fjrx > [class*='positive'] {
126
126
  color: var(--steps-option-svg-color);
127
127
  background-color: var(--steps-option-svg-color);
128
128
  }
@@ -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
- const styles = {"component":"steps__component_cg8qn"};
5
+ const styles = {"component":"steps__component_14mfc"};
6
6
  require('./index.css')
7
7
 
8
8
  const StepIndicator = ({ content, iconColor, className }) => (React.createElement(Badge, { size: 'l', view: 'icon', iconColor: iconColor, className: cn(styles.component, className), content: content }));
@@ -1,4 +1,4 @@
1
- /* hash: nozx6 */
2
- .steps__component_cg8qn {
1
+ /* hash: 1ch7o */
2
+ .steps__component_14mfc {
3
3
  padding: 0;
4
4
  }
package/modern/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 1q3de */
1
+ /* hash: 1pi6i */
2
2
  :root {
3
3
  } /* 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 */
4
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 */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -14,11 +14,11 @@
14
14
  } :root {
15
15
  } :root {
16
16
  } :root {
17
- } .steps__component_1u3oe {
17
+ } .steps__component_1hggi {
18
18
  display: flex;
19
19
  align-items: center;
20
20
  flex-direction: row
21
- } .steps__component_1u3oe.steps__vertical_1u3oe {
21
+ } .steps__component_1hggi.steps__vertical_1hggi {
22
22
  flex-direction: column;
23
23
  align-items: flex-start;
24
24
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-steps",
3
- "version": "1.1.9",
3
+ "version": "1.2.0",
4
4
  "description": "",
5
5
  "keywords": [],
6
6
  "license": "MIT",