@alfalab/core-components-confirmation 9.0.6 → 9.0.7
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/CHANGELOG.md +8 -0
- package/dist/component.js +1 -1
- package/dist/components/code-input/component.js +1 -1
- package/dist/components/code-input/index.css +10 -10
- package/dist/components/countdown/component.js +1 -1
- package/dist/components/countdown/index.css +13 -13
- package/dist/components/countdown-loader/component.js +1 -1
- package/dist/components/countdown-loader/index.css +2 -2
- package/dist/components/overlimit/component.js +1 -1
- package/dist/components/overlimit/index.css +9 -9
- package/dist/components/sign-confirmation/component.js +1 -1
- package/dist/components/sign-confirmation/index.css +13 -13
- package/dist/esm/component.js +1 -1
- package/dist/esm/components/code-input/component.js +1 -1
- package/dist/esm/components/code-input/index.css +10 -10
- package/dist/esm/components/countdown/component.js +1 -1
- package/dist/esm/components/countdown/index.css +13 -13
- package/dist/esm/components/countdown-loader/component.js +1 -1
- package/dist/esm/components/countdown-loader/index.css +2 -2
- package/dist/esm/components/overlimit/component.js +1 -1
- package/dist/esm/components/overlimit/index.css +9 -9
- package/dist/esm/components/sign-confirmation/component.js +1 -1
- package/dist/esm/components/sign-confirmation/index.css +13 -13
- package/dist/esm/index.css +14 -14
- package/dist/index.css +14 -14
- package/dist/modern/component.js +1 -1
- package/dist/modern/components/code-input/component.js +1 -1
- package/dist/modern/components/code-input/index.css +10 -10
- package/dist/modern/components/countdown/component.js +1 -1
- package/dist/modern/components/countdown/index.css +13 -13
- package/dist/modern/components/countdown-loader/component.js +1 -1
- package/dist/modern/components/countdown-loader/index.css +2 -2
- package/dist/modern/components/overlimit/component.js +1 -1
- package/dist/modern/components/overlimit/index.css +9 -9
- package/dist/modern/components/sign-confirmation/component.js +1 -1
- package/dist/modern/components/sign-confirmation/index.css +13 -13
- package/dist/modern/index.css +14 -14
- package/package.json +3 -3
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: u6g7x */
|
|
2
2
|
:root {
|
|
3
3
|
--color-light-text-negative: #d91d0b;
|
|
4
4
|
--color-light-text-primary: #0b1f35;
|
|
@@ -43,20 +43,20 @@
|
|
|
43
43
|
|
|
44
44
|
/* input */
|
|
45
45
|
}
|
|
46
|
-
.
|
|
46
|
+
.confirmation__component_srlhu {
|
|
47
47
|
display: flex;
|
|
48
48
|
flex-direction: column;
|
|
49
49
|
}
|
|
50
|
-
.
|
|
50
|
+
.confirmation__countdown_srlhu {
|
|
51
51
|
max-height: 300px;
|
|
52
52
|
overflow: hidden;
|
|
53
53
|
transition: max-height 0.15s ease;
|
|
54
54
|
}
|
|
55
|
-
.
|
|
55
|
+
.confirmation__hidden_srlhu {
|
|
56
56
|
opacity: 0;
|
|
57
57
|
max-height: 0;
|
|
58
58
|
}
|
|
59
|
-
.
|
|
59
|
+
.confirmation__header_srlhu {
|
|
60
60
|
font-size: var(--confirmation-title-font-size);
|
|
61
61
|
line-height: var(--confirmation-title-line-height);
|
|
62
62
|
font-weight: var(--confirmation-title-font-weight);
|
|
@@ -67,19 +67,19 @@
|
|
|
67
67
|
margin-bottom: var(--gap-3xl);
|
|
68
68
|
color: var(--confirmation-title-color);
|
|
69
69
|
}
|
|
70
|
-
.
|
|
70
|
+
.confirmation__inputContainer_srlhu {
|
|
71
71
|
display: flex;
|
|
72
72
|
flex-direction: column;
|
|
73
73
|
}
|
|
74
|
-
.
|
|
74
|
+
.confirmation__smsComeLinkWrap_srlhu {
|
|
75
75
|
margin-top: var(--gap-l);
|
|
76
76
|
}
|
|
77
|
-
.
|
|
77
|
+
.confirmation__smsComeLink_srlhu {
|
|
78
78
|
font-size: 14px;
|
|
79
79
|
line-height: 20px;
|
|
80
80
|
font-weight: 400;
|
|
81
81
|
}
|
|
82
|
-
.
|
|
82
|
+
.confirmation__error_srlhu {
|
|
83
83
|
font-size: 14px;
|
|
84
84
|
line-height: 20px;
|
|
85
85
|
font-weight: 400;
|
|
@@ -87,12 +87,12 @@
|
|
|
87
87
|
margin-top: var(--gap-xs);
|
|
88
88
|
color: var(--confirmation-error-color);
|
|
89
89
|
}
|
|
90
|
-
.
|
|
90
|
+
.confirmation__loaderWrap_srlhu {
|
|
91
91
|
display: flex;
|
|
92
92
|
align-items: center;
|
|
93
93
|
margin: var(--gap-3xl) 0 var(--gap-xs);
|
|
94
94
|
}
|
|
95
|
-
.
|
|
95
|
+
.confirmation__loaderText_srlhu {
|
|
96
96
|
font-size: var(--confirmation-text-font-size);
|
|
97
97
|
line-height: var(--confirmation-text-line-height);
|
|
98
98
|
font-weight: var(--confirmation-text-font-weight);
|
|
@@ -102,7 +102,7 @@
|
|
|
102
102
|
margin-left: var(--gap-s);
|
|
103
103
|
color: var(--confirmation-text-color);
|
|
104
104
|
}
|
|
105
|
-
.
|
|
106
|
-
.
|
|
105
|
+
.confirmation__center_srlhu .confirmation__codeInput_srlhu,
|
|
106
|
+
.confirmation__center_srlhu .confirmation__loaderWrap_srlhu {
|
|
107
107
|
justify-content: center;
|
|
108
108
|
}
|
package/dist/esm/index.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: 14smn */
|
|
2
2
|
:root {
|
|
3
3
|
--color-light-text-primary: #0b1f35;
|
|
4
4
|
--color-light-text-secondary: #546272;
|
|
@@ -41,18 +41,18 @@
|
|
|
41
41
|
|
|
42
42
|
/* input */
|
|
43
43
|
}
|
|
44
|
-
.
|
|
44
|
+
.confirmation__component_4crub {
|
|
45
45
|
display: flex;
|
|
46
46
|
flex-direction: column;
|
|
47
47
|
width: 100%;
|
|
48
48
|
font-family: var(--confirmation-font-family);
|
|
49
49
|
}
|
|
50
|
-
.
|
|
50
|
+
.confirmation__error_4crub {
|
|
51
51
|
display: flex;
|
|
52
52
|
flex-direction: column;
|
|
53
53
|
align-items: flex-start;
|
|
54
54
|
}
|
|
55
|
-
.
|
|
55
|
+
.confirmation__errorHeader_4crub {
|
|
56
56
|
font-size: var(--confirmation-title-font-size);
|
|
57
57
|
line-height: var(--confirmation-title-line-height);
|
|
58
58
|
font-weight: var(--confirmation-title-font-weight);
|
|
@@ -63,7 +63,7 @@
|
|
|
63
63
|
margin-bottom: var(--gap-2xl);
|
|
64
64
|
color: var(--confirmation-title-color);
|
|
65
65
|
}
|
|
66
|
-
.
|
|
66
|
+
.confirmation__errorText_4crub {
|
|
67
67
|
font-size: var(--confirmation-text-font-size);
|
|
68
68
|
line-height: var(--confirmation-text-line-height);
|
|
69
69
|
font-weight: var(--confirmation-text-font-weight);
|
|
@@ -73,12 +73,12 @@
|
|
|
73
73
|
margin-bottom: var(--gap-2xl);
|
|
74
74
|
color: var(--confirmation-text-color);
|
|
75
75
|
}
|
|
76
|
-
.
|
|
76
|
+
.confirmation__phoneHintWrap_4crub {
|
|
77
77
|
display: flex;
|
|
78
78
|
flex-direction: column;
|
|
79
79
|
align-items: flex-start;
|
|
80
80
|
}
|
|
81
|
-
.
|
|
81
|
+
.confirmation__phoneHintText_4crub {
|
|
82
82
|
font-size: var(--confirmation-text-font-size);
|
|
83
83
|
line-height: var(--confirmation-text-line-height);
|
|
84
84
|
font-weight: var(--confirmation-text-font-weight);
|
|
@@ -88,7 +88,7 @@
|
|
|
88
88
|
margin-bottom: var(--gap-xl);
|
|
89
89
|
color: var(--confirmation-text-color);
|
|
90
90
|
}
|
|
91
|
-
.
|
|
91
|
+
.confirmation__phonesWrap_4crub {
|
|
92
92
|
font-size: var(--confirmation-text-font-size);
|
|
93
93
|
line-height: var(--confirmation-text-line-height);
|
|
94
94
|
font-weight: var(--confirmation-text-font-weight);
|
|
@@ -99,21 +99,21 @@
|
|
|
99
99
|
flex-direction: column;
|
|
100
100
|
margin-bottom: var(--gap-4xl);
|
|
101
101
|
}
|
|
102
|
-
.
|
|
102
|
+
.confirmation__phoneWrap_4crub {
|
|
103
103
|
margin-bottom: var(--gap-xs)
|
|
104
104
|
}
|
|
105
|
-
.
|
|
105
|
+
.confirmation__phoneWrap_4crub:last-child {
|
|
106
106
|
margin-bottom: 0;
|
|
107
107
|
}
|
|
108
|
-
.
|
|
108
|
+
.confirmation__phoneDescription_4crub {
|
|
109
109
|
color: var(--confirmation-text-color);
|
|
110
110
|
}
|
|
111
|
-
.
|
|
111
|
+
.confirmation__component_4crub.confirmation__center_4crub {
|
|
112
112
|
text-align: center;
|
|
113
113
|
}
|
|
114
|
-
.
|
|
114
|
+
.confirmation__center_4crub .confirmation__phoneHintWrap_4crub {
|
|
115
115
|
align-items: center;
|
|
116
116
|
}
|
|
117
|
-
.
|
|
117
|
+
.confirmation__center_4crub .confirmation__error_4crub {
|
|
118
118
|
align-items: center;
|
|
119
119
|
}
|
package/dist/index.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: 14smn */
|
|
2
2
|
:root {
|
|
3
3
|
--color-light-text-primary: #0b1f35;
|
|
4
4
|
--color-light-text-secondary: #546272;
|
|
@@ -41,18 +41,18 @@
|
|
|
41
41
|
|
|
42
42
|
/* input */
|
|
43
43
|
}
|
|
44
|
-
.
|
|
44
|
+
.confirmation__component_4crub {
|
|
45
45
|
display: flex;
|
|
46
46
|
flex-direction: column;
|
|
47
47
|
width: 100%;
|
|
48
48
|
font-family: var(--confirmation-font-family);
|
|
49
49
|
}
|
|
50
|
-
.
|
|
50
|
+
.confirmation__error_4crub {
|
|
51
51
|
display: flex;
|
|
52
52
|
flex-direction: column;
|
|
53
53
|
align-items: flex-start;
|
|
54
54
|
}
|
|
55
|
-
.
|
|
55
|
+
.confirmation__errorHeader_4crub {
|
|
56
56
|
font-size: var(--confirmation-title-font-size);
|
|
57
57
|
line-height: var(--confirmation-title-line-height);
|
|
58
58
|
font-weight: var(--confirmation-title-font-weight);
|
|
@@ -63,7 +63,7 @@
|
|
|
63
63
|
margin-bottom: var(--gap-2xl);
|
|
64
64
|
color: var(--confirmation-title-color);
|
|
65
65
|
}
|
|
66
|
-
.
|
|
66
|
+
.confirmation__errorText_4crub {
|
|
67
67
|
font-size: var(--confirmation-text-font-size);
|
|
68
68
|
line-height: var(--confirmation-text-line-height);
|
|
69
69
|
font-weight: var(--confirmation-text-font-weight);
|
|
@@ -73,12 +73,12 @@
|
|
|
73
73
|
margin-bottom: var(--gap-2xl);
|
|
74
74
|
color: var(--confirmation-text-color);
|
|
75
75
|
}
|
|
76
|
-
.
|
|
76
|
+
.confirmation__phoneHintWrap_4crub {
|
|
77
77
|
display: flex;
|
|
78
78
|
flex-direction: column;
|
|
79
79
|
align-items: flex-start;
|
|
80
80
|
}
|
|
81
|
-
.
|
|
81
|
+
.confirmation__phoneHintText_4crub {
|
|
82
82
|
font-size: var(--confirmation-text-font-size);
|
|
83
83
|
line-height: var(--confirmation-text-line-height);
|
|
84
84
|
font-weight: var(--confirmation-text-font-weight);
|
|
@@ -88,7 +88,7 @@
|
|
|
88
88
|
margin-bottom: var(--gap-xl);
|
|
89
89
|
color: var(--confirmation-text-color);
|
|
90
90
|
}
|
|
91
|
-
.
|
|
91
|
+
.confirmation__phonesWrap_4crub {
|
|
92
92
|
font-size: var(--confirmation-text-font-size);
|
|
93
93
|
line-height: var(--confirmation-text-line-height);
|
|
94
94
|
font-weight: var(--confirmation-text-font-weight);
|
|
@@ -99,21 +99,21 @@
|
|
|
99
99
|
flex-direction: column;
|
|
100
100
|
margin-bottom: var(--gap-4xl);
|
|
101
101
|
}
|
|
102
|
-
.
|
|
102
|
+
.confirmation__phoneWrap_4crub {
|
|
103
103
|
margin-bottom: var(--gap-xs)
|
|
104
104
|
}
|
|
105
|
-
.
|
|
105
|
+
.confirmation__phoneWrap_4crub:last-child {
|
|
106
106
|
margin-bottom: 0;
|
|
107
107
|
}
|
|
108
|
-
.
|
|
108
|
+
.confirmation__phoneDescription_4crub {
|
|
109
109
|
color: var(--confirmation-text-color);
|
|
110
110
|
}
|
|
111
|
-
.
|
|
111
|
+
.confirmation__component_4crub.confirmation__center_4crub {
|
|
112
112
|
text-align: center;
|
|
113
113
|
}
|
|
114
|
-
.
|
|
114
|
+
.confirmation__center_4crub .confirmation__phoneHintWrap_4crub {
|
|
115
115
|
align-items: center;
|
|
116
116
|
}
|
|
117
|
-
.
|
|
117
|
+
.confirmation__center_4crub .confirmation__error_4crub {
|
|
118
118
|
align-items: center;
|
|
119
119
|
}
|
package/dist/modern/component.js
CHANGED
|
@@ -13,7 +13,7 @@ import { SignConfirmation } from './components/sign-confirmation/component.js';
|
|
|
13
13
|
import '@alfalab/icons-glyph';
|
|
14
14
|
import { Overlimit } from './components/overlimit/component.js';
|
|
15
15
|
|
|
16
|
-
var styles = {"component":"
|
|
16
|
+
var styles = {"component":"confirmation__component_4crub","error":"confirmation__error_4crub","errorHeader":"confirmation__errorHeader_4crub","errorText":"confirmation__errorText_4crub","phoneHintWrap":"confirmation__phoneHintWrap_4crub","phoneHintText":"confirmation__phoneHintText_4crub","phonesWrap":"confirmation__phonesWrap_4crub","phoneWrap":"confirmation__phoneWrap_4crub","phoneDescription":"confirmation__phoneDescription_4crub","center":"confirmation__center_4crub"};
|
|
17
17
|
require('./index.css')
|
|
18
18
|
|
|
19
19
|
const Confirmation = forwardRef(({ additionalContent, className, countdownDuration = 60000, dataTestId, errorIsFatal, errorTitle = 'Превышено количество попыток ввода кода', error = false, errorOverlimit = false, errorOverlimitIsFatal = false, errorText, hasPhoneMask = true, hasSmsCountdown = true, phone, requiredCharAmount = 5, signTitle = 'Введите код из\xa0сообщения', overlimitTitle = 'Превышено количество\n попыток ввода кода', overlimitText = 'Повторное подтверждение кодом из SMS\n будет возможно через', overlimitCountdownDuration, code, codeSending = false, codeChecking = false, codeCheckingText = 'Проверка кода', codeSendingText = 'Отправляем код', buttonErrorText = 'Понятно', buttonReturnText = 'Вернуться назад', buttonRetryText = 'Запросить новый код', alignContent = 'left', noAttemptsLeftMessage, countdownContent, onInputFinished, onSmsRetryClick, onOverlimitSmsRetryClick, onActionWithFatalError, onCountdownFinished, onOverlimitCountdownFinished, onInputChange, onSmsHintLinkClick, }, ref) => {
|
|
@@ -3,7 +3,7 @@ import cn from 'classnames';
|
|
|
3
3
|
import { usePrevious } from '@alfalab/hooks';
|
|
4
4
|
import { mergeArrays } from './utils.js';
|
|
5
5
|
|
|
6
|
-
var styles = {"component":"
|
|
6
|
+
var styles = {"component":"confirmation__component_1s527","input":"confirmation__input_1s527","hasError":"confirmation__hasError_1s527","center":"confirmation__center_1s527","disabled":"confirmation__disabled_1s527","compact":"confirmation__compact_1s527","shake":"confirmation__shake_1s527"};
|
|
7
7
|
require('./index.css')
|
|
8
8
|
|
|
9
9
|
const Input = ({ index, slotsCount, error, processing, value, alignContent, handleChange, handleInputKeyDown, setRef, focus, }) => {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: 19upi */
|
|
2
2
|
:root {
|
|
3
3
|
--color-light-bg-negative-muted: #feebea;
|
|
4
4
|
--color-light-bg-secondary: #f3f4f5;
|
|
@@ -41,10 +41,10 @@
|
|
|
41
41
|
--confirmation-input-bg-color: var(--color-light-bg-secondary);
|
|
42
42
|
--confirmation-input-error-bg-color: var(--color-light-bg-negative-muted);
|
|
43
43
|
}
|
|
44
|
-
.
|
|
44
|
+
.confirmation__component_1s527 {
|
|
45
45
|
display: flex;
|
|
46
46
|
}
|
|
47
|
-
.
|
|
47
|
+
.confirmation__input_1s527 {
|
|
48
48
|
flex-shrink: 0;
|
|
49
49
|
width: 36px;
|
|
50
50
|
height: 48px;
|
|
@@ -61,23 +61,23 @@
|
|
|
61
61
|
font-weight: var(--confirmation-input-font-weight);
|
|
62
62
|
font-family: var(--confirmation-input-font-family)
|
|
63
63
|
}
|
|
64
|
-
.
|
|
64
|
+
.confirmation__input_1s527.confirmation__hasError_1s527 {
|
|
65
65
|
color: var(--confirmation-error-color);
|
|
66
66
|
caret-color: var(--confirmation-input-text-color);
|
|
67
67
|
background-color: var(--confirmation-input-error-bg-color);
|
|
68
68
|
}
|
|
69
|
-
.
|
|
69
|
+
.confirmation__input_1s527.confirmation__center_1s527 {
|
|
70
70
|
margin: 0 var(--gap-2xs);
|
|
71
71
|
}
|
|
72
|
-
.
|
|
72
|
+
.confirmation__input_1s527.confirmation__disabled_1s527 {
|
|
73
73
|
color: var(--color-light-text-tertiary);
|
|
74
74
|
opacity: 1;
|
|
75
75
|
}
|
|
76
|
-
.
|
|
76
|
+
.confirmation__compact_1s527 .confirmation__input_1s527 {
|
|
77
77
|
width: 28px;
|
|
78
78
|
height: 40px;
|
|
79
79
|
}
|
|
80
|
-
@keyframes
|
|
80
|
+
@keyframes confirmation__shake_1s527 {
|
|
81
81
|
0% {
|
|
82
82
|
transform: translateX(0);
|
|
83
83
|
}
|
|
@@ -94,6 +94,6 @@
|
|
|
94
94
|
transform: translateX(0);
|
|
95
95
|
}
|
|
96
96
|
}
|
|
97
|
-
.
|
|
98
|
-
animation:
|
|
97
|
+
.confirmation__shake_1s527 {
|
|
98
|
+
animation: confirmation__shake_1s527 0.15s linear 0s 3;
|
|
99
99
|
}
|
|
@@ -5,7 +5,7 @@ import { phoneNumber } from '@alfalab/utils';
|
|
|
5
5
|
import { usePrevious } from '@alfalab/hooks';
|
|
6
6
|
import { CountdownLoader } from '../countdown-loader/component.js';
|
|
7
7
|
|
|
8
|
-
var styles = {"component":"
|
|
8
|
+
var styles = {"component":"confirmation__component_tecu4","hasError":"confirmation__hasError_tecu4","getCodeButton":"confirmation__getCodeButton_tecu4","info":"confirmation__info_tecu4","customContent":"confirmation__customContent_tecu4","loaderWrap":"confirmation__loaderWrap_tecu4","loader":"confirmation__loader_tecu4","center":"confirmation__center_tecu4","timePassed":"confirmation__timePassed_tecu4","noAttemptsLeftMessage":"confirmation__noAttemptsLeftMessage_tecu4"};
|
|
9
9
|
require('./index.css')
|
|
10
10
|
|
|
11
11
|
/**
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: 16vas */
|
|
2
2
|
:root {
|
|
3
3
|
--color-light-text-secondary: #546272;
|
|
4
4
|
}
|
|
@@ -34,7 +34,7 @@
|
|
|
34
34
|
|
|
35
35
|
/* input */
|
|
36
36
|
}
|
|
37
|
-
.
|
|
37
|
+
.confirmation__component_tecu4 {
|
|
38
38
|
font-size: var(--confirmation-text-font-size);
|
|
39
39
|
line-height: var(--confirmation-text-line-height);
|
|
40
40
|
font-weight: var(--confirmation-text-font-weight);
|
|
@@ -47,39 +47,39 @@
|
|
|
47
47
|
margin-top: var(--gap-3xl);
|
|
48
48
|
color: var(--confirmation-text-color);
|
|
49
49
|
}
|
|
50
|
-
.
|
|
50
|
+
.confirmation__hasError_tecu4 .confirmation__getCodeButton_tecu4 {
|
|
51
51
|
margin-top: 0;
|
|
52
52
|
}
|
|
53
|
-
.
|
|
53
|
+
.confirmation__hasError_tecu4 .confirmation__info_tecu4 {
|
|
54
54
|
margin-top: 0;
|
|
55
55
|
}
|
|
56
|
-
.
|
|
56
|
+
.confirmation__hasError_tecu4 .confirmation__customContent_tecu4 {
|
|
57
57
|
margin-bottom: var(--gap-2xl);
|
|
58
58
|
}
|
|
59
|
-
.
|
|
59
|
+
.confirmation__info_tecu4 {
|
|
60
60
|
margin: var(--gap-2xs) 0;
|
|
61
61
|
}
|
|
62
|
-
.
|
|
62
|
+
.confirmation__loaderWrap_tecu4 {
|
|
63
63
|
display: flex;
|
|
64
64
|
align-items: center;
|
|
65
65
|
margin-bottom: var(--gap-xs);
|
|
66
66
|
}
|
|
67
|
-
.
|
|
67
|
+
.confirmation__loader_tecu4 {
|
|
68
68
|
margin-right: var(--gap-xs);
|
|
69
69
|
}
|
|
70
|
-
.
|
|
70
|
+
.confirmation__center_tecu4 {
|
|
71
71
|
align-items: center
|
|
72
72
|
}
|
|
73
|
-
.
|
|
73
|
+
.confirmation__center_tecu4 .confirmation__loaderWrap_tecu4 {
|
|
74
74
|
justify-content: center;
|
|
75
75
|
}
|
|
76
|
-
.
|
|
76
|
+
.confirmation__timePassed_tecu4 {
|
|
77
77
|
display: flex;
|
|
78
78
|
min-width: 3em;
|
|
79
79
|
}
|
|
80
|
-
.
|
|
80
|
+
.confirmation__getCodeButton_tecu4 {
|
|
81
81
|
margin-top: var(--gap-2xl);
|
|
82
82
|
}
|
|
83
|
-
.
|
|
83
|
+
.confirmation__noAttemptsLeftMessage_tecu4 {
|
|
84
84
|
margin: var(--gap-2xs) 0 var(--gap-xs);
|
|
85
85
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: ry20i */
|
|
2
2
|
:root {
|
|
3
3
|
--color-light-graphic-tertiary: #b6bcc3;
|
|
4
4
|
}
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
|
|
20
20
|
/* input */
|
|
21
21
|
}
|
|
22
|
-
.
|
|
22
|
+
.confirmation__circle_1t7fa {
|
|
23
23
|
fill: transparent;
|
|
24
24
|
stroke: var(--color-light-graphic-tertiary);
|
|
25
25
|
stroke-width: 2px;
|
|
@@ -7,7 +7,7 @@ import { CountdownLoader } from '../countdown-loader/component.js';
|
|
|
7
7
|
import { formatMsAsMinutes } from '../countdown/component.js';
|
|
8
8
|
import { CrossCircleMIcon } from '@alfalab/icons-glyph';
|
|
9
9
|
|
|
10
|
-
var styles = {"component":"
|
|
10
|
+
var styles = {"component":"confirmation__component_1iqq7","title":"confirmation__title_1iqq7","description":"confirmation__description_1iqq7","countdown":"confirmation__countdown_1iqq7","loader":"confirmation__loader_1iqq7","timePassed":"confirmation__timePassed_1iqq7","getCodeButton":"confirmation__getCodeButton_1iqq7","alertIcon":"confirmation__alertIcon_1iqq7"};
|
|
11
11
|
require('./index.css')
|
|
12
12
|
|
|
13
13
|
const Overlimit = ({ duration = 60000, buttonRetryText, hasFatalError, onOverlimitRepeatSms, onOverlimitCountdownFinished, text, title, }) => {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: 12an0 */
|
|
2
2
|
:root {
|
|
3
3
|
--color-static-status-red: #d91d0b;
|
|
4
4
|
}
|
|
@@ -45,12 +45,12 @@
|
|
|
45
45
|
|
|
46
46
|
/* input */
|
|
47
47
|
}
|
|
48
|
-
.
|
|
48
|
+
.confirmation__component_1iqq7 {
|
|
49
49
|
display: flex;
|
|
50
50
|
flex-direction: column;
|
|
51
51
|
align-items: center;
|
|
52
52
|
}
|
|
53
|
-
.
|
|
53
|
+
.confirmation__title_1iqq7 {
|
|
54
54
|
font-size: var(--confirmation-title-font-size);
|
|
55
55
|
line-height: var(--confirmation-title-line-height);
|
|
56
56
|
font-weight: var(--confirmation-title-font-weight);
|
|
@@ -60,30 +60,30 @@
|
|
|
60
60
|
|
|
61
61
|
margin-bottom: var(--gap-3xl);
|
|
62
62
|
}
|
|
63
|
-
.
|
|
63
|
+
.confirmation__description_1iqq7 {
|
|
64
64
|
font-size: var(--confirmation-text-font-size);
|
|
65
65
|
line-height: var(--confirmation-text-line-height);
|
|
66
66
|
font-weight: var(--confirmation-text-font-weight);
|
|
67
67
|
font-family: var(--confirmation-text-font-family);
|
|
68
68
|
color: var(--confirmation-text-color);
|
|
69
69
|
}
|
|
70
|
-
.
|
|
70
|
+
.confirmation__countdown_1iqq7 {
|
|
71
71
|
display: flex;
|
|
72
72
|
align-items: center;
|
|
73
73
|
justify-content: center;
|
|
74
74
|
margin-top: var(--gap-2xs);
|
|
75
75
|
}
|
|
76
|
-
.
|
|
76
|
+
.confirmation__loader_1iqq7 {
|
|
77
77
|
margin-right: var(--gap-xs);
|
|
78
78
|
}
|
|
79
|
-
.
|
|
79
|
+
.confirmation__timePassed_1iqq7 {
|
|
80
80
|
display: flex;
|
|
81
81
|
min-width: 3em;
|
|
82
82
|
}
|
|
83
|
-
.
|
|
83
|
+
.confirmation__getCodeButton_1iqq7 {
|
|
84
84
|
margin-top: var(--gap-2xl);
|
|
85
85
|
}
|
|
86
|
-
.
|
|
86
|
+
.confirmation__alertIcon_1iqq7 {
|
|
87
87
|
text-align: center;
|
|
88
88
|
margin-bottom: var(--gap-xl);
|
|
89
89
|
color: var(--color-static-status-red);
|
|
@@ -10,7 +10,7 @@ import { Loader } from '@alfalab/core-components-loader/dist/modern';
|
|
|
10
10
|
import '../code-input/utils.js';
|
|
11
11
|
import { CodeInput } from '../code-input/component.js';
|
|
12
12
|
|
|
13
|
-
var styles = {"component":"
|
|
13
|
+
var styles = {"component":"confirmation__component_srlhu","countdown":"confirmation__countdown_srlhu","hidden":"confirmation__hidden_srlhu","header":"confirmation__header_srlhu","inputContainer":"confirmation__inputContainer_srlhu","smsComeLinkWrap":"confirmation__smsComeLinkWrap_srlhu","smsComeLink":"confirmation__smsComeLink_srlhu","error":"confirmation__error_srlhu","loaderWrap":"confirmation__loaderWrap_srlhu","loaderText":"confirmation__loaderText_srlhu","center":"confirmation__center_srlhu","codeInput":"confirmation__codeInput_srlhu"};
|
|
14
14
|
require('./index.css')
|
|
15
15
|
|
|
16
16
|
const SignConfirmation = ({ codeChecking, codeSending, smsHintVisible, requiredCharAmount, countdownDuration, additionalContent, hasPhoneMask, phone, code: inputValue, error, errorText, title, hasSmsCountdown, inputRef, codeCheckingText, codeSendingText, alignContent, noAttemptsLeftMessage, buttonRetryText, countdownContent, onInputFinished, onInputChange, onSmsRetryClick, onCountdownFinished, onSmsHintLinkClick, }) => {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: u6g7x */
|
|
2
2
|
:root {
|
|
3
3
|
--color-light-text-negative: #d91d0b;
|
|
4
4
|
--color-light-text-primary: #0b1f35;
|
|
@@ -43,20 +43,20 @@
|
|
|
43
43
|
|
|
44
44
|
/* input */
|
|
45
45
|
}
|
|
46
|
-
.
|
|
46
|
+
.confirmation__component_srlhu {
|
|
47
47
|
display: flex;
|
|
48
48
|
flex-direction: column;
|
|
49
49
|
}
|
|
50
|
-
.
|
|
50
|
+
.confirmation__countdown_srlhu {
|
|
51
51
|
max-height: 300px;
|
|
52
52
|
overflow: hidden;
|
|
53
53
|
transition: max-height 0.15s ease;
|
|
54
54
|
}
|
|
55
|
-
.
|
|
55
|
+
.confirmation__hidden_srlhu {
|
|
56
56
|
opacity: 0;
|
|
57
57
|
max-height: 0;
|
|
58
58
|
}
|
|
59
|
-
.
|
|
59
|
+
.confirmation__header_srlhu {
|
|
60
60
|
font-size: var(--confirmation-title-font-size);
|
|
61
61
|
line-height: var(--confirmation-title-line-height);
|
|
62
62
|
font-weight: var(--confirmation-title-font-weight);
|
|
@@ -67,19 +67,19 @@
|
|
|
67
67
|
margin-bottom: var(--gap-3xl);
|
|
68
68
|
color: var(--confirmation-title-color);
|
|
69
69
|
}
|
|
70
|
-
.
|
|
70
|
+
.confirmation__inputContainer_srlhu {
|
|
71
71
|
display: flex;
|
|
72
72
|
flex-direction: column;
|
|
73
73
|
}
|
|
74
|
-
.
|
|
74
|
+
.confirmation__smsComeLinkWrap_srlhu {
|
|
75
75
|
margin-top: var(--gap-l);
|
|
76
76
|
}
|
|
77
|
-
.
|
|
77
|
+
.confirmation__smsComeLink_srlhu {
|
|
78
78
|
font-size: 14px;
|
|
79
79
|
line-height: 20px;
|
|
80
80
|
font-weight: 400;
|
|
81
81
|
}
|
|
82
|
-
.
|
|
82
|
+
.confirmation__error_srlhu {
|
|
83
83
|
font-size: 14px;
|
|
84
84
|
line-height: 20px;
|
|
85
85
|
font-weight: 400;
|
|
@@ -87,12 +87,12 @@
|
|
|
87
87
|
margin-top: var(--gap-xs);
|
|
88
88
|
color: var(--confirmation-error-color);
|
|
89
89
|
}
|
|
90
|
-
.
|
|
90
|
+
.confirmation__loaderWrap_srlhu {
|
|
91
91
|
display: flex;
|
|
92
92
|
align-items: center;
|
|
93
93
|
margin: var(--gap-3xl) 0 var(--gap-xs);
|
|
94
94
|
}
|
|
95
|
-
.
|
|
95
|
+
.confirmation__loaderText_srlhu {
|
|
96
96
|
font-size: var(--confirmation-text-font-size);
|
|
97
97
|
line-height: var(--confirmation-text-line-height);
|
|
98
98
|
font-weight: var(--confirmation-text-font-weight);
|
|
@@ -102,7 +102,7 @@
|
|
|
102
102
|
margin-left: var(--gap-s);
|
|
103
103
|
color: var(--confirmation-text-color);
|
|
104
104
|
}
|
|
105
|
-
.
|
|
106
|
-
.
|
|
105
|
+
.confirmation__center_srlhu .confirmation__codeInput_srlhu,
|
|
106
|
+
.confirmation__center_srlhu .confirmation__loaderWrap_srlhu {
|
|
107
107
|
justify-content: center;
|
|
108
108
|
}
|