@alfalab/core-components-confirmation 12.3.4 → 12.4.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.
Files changed (160) hide show
  1. package/{component-ad8387ce.d.ts → component-ad335d4a.d.ts} +0 -0
  2. package/{component-ad8387ce.js → component-ad335d4a.js} +9 -9
  3. package/component.desktop.js +8 -10
  4. package/component.mobile.js +10 -12
  5. package/component.responsive.d.ts +7 -1
  6. package/component.responsive.js +15 -16
  7. package/components/base-confirmation/component.js +7 -9
  8. package/components/base-confirmation/index.css +2 -2
  9. package/components/base-confirmation/index.d.ts +1 -1
  10. package/components/base-confirmation/index.js +5 -7
  11. package/components/countdown-loader/component.js +5 -7
  12. package/components/countdown-loader/index.css +2 -2
  13. package/components/countdown-loader/index.js +1 -3
  14. package/components/header/component.js +5 -7
  15. package/components/header/index.css +4 -4
  16. package/components/header/index.js +1 -3
  17. package/components/index.js +10 -12
  18. package/components/screens/fatal-error/component.js +10 -12
  19. package/components/screens/fatal-error/index.css +6 -6
  20. package/components/screens/fatal-error/index.js +3 -5
  21. package/components/screens/hint/component.js +18 -20
  22. package/components/screens/hint/index.css +12 -12
  23. package/components/screens/hint/index.js +3 -5
  24. package/components/screens/index.js +8 -10
  25. package/components/screens/initial/component.js +18 -15
  26. package/components/screens/initial/countdown-section.js +4 -6
  27. package/components/screens/initial/index.css +18 -18
  28. package/components/screens/initial/index.js +5 -7
  29. package/components/screens/temp-block/component.js +12 -14
  30. package/components/screens/temp-block/index.css +7 -7
  31. package/components/screens/temp-block/index.js +4 -6
  32. package/context.js +0 -2
  33. package/{countdown-section-f4894842.d.ts → countdown-section-6d91891a.d.ts} +0 -0
  34. package/countdown-section-6d91891a.js +49 -0
  35. package/cssm/{component-5a4af768.d.ts → component-3c591970.d.ts} +0 -0
  36. package/cssm/{component-5a4af768.js → component-3c591970.js} +9 -9
  37. package/cssm/component.desktop.js +12 -14
  38. package/cssm/component.mobile.js +15 -17
  39. package/cssm/component.responsive.d.ts +7 -1
  40. package/cssm/component.responsive.js +19 -20
  41. package/cssm/components/base-confirmation/component.js +10 -12
  42. package/cssm/components/base-confirmation/index.d.ts +1 -1
  43. package/cssm/components/base-confirmation/index.js +9 -11
  44. package/cssm/components/countdown-loader/component.js +5 -7
  45. package/cssm/components/countdown-loader/index.js +1 -3
  46. package/cssm/components/header/component.js +5 -7
  47. package/cssm/components/header/index.js +1 -3
  48. package/cssm/components/index.js +12 -14
  49. package/cssm/components/screens/fatal-error/component.js +11 -13
  50. package/cssm/components/screens/fatal-error/index.js +4 -6
  51. package/cssm/components/screens/hint/component.js +19 -21
  52. package/cssm/components/screens/hint/index.js +4 -6
  53. package/cssm/components/screens/index.js +10 -12
  54. package/cssm/components/screens/initial/component.js +21 -18
  55. package/cssm/components/screens/initial/countdown-section.js +18 -20
  56. package/cssm/components/screens/initial/index.js +6 -8
  57. package/cssm/components/screens/temp-block/component.js +14 -16
  58. package/cssm/components/screens/temp-block/index.js +6 -8
  59. package/cssm/context.js +0 -2
  60. package/cssm/desktop.d.ts +1 -0
  61. package/cssm/desktop.js +10 -12
  62. package/cssm/index.js +24 -26
  63. package/cssm/mobile.d.ts +1 -0
  64. package/cssm/mobile.js +10 -12
  65. package/cssm/responsive.d.ts +1 -0
  66. package/cssm/responsive.js +11 -13
  67. package/cssm/types.js +0 -2
  68. package/cssm/utils.js +6 -8
  69. package/desktop.d.ts +1 -0
  70. package/desktop.js +6 -8
  71. package/esm/{component-b1ceb5d0.d.ts → component-0eefd74d.d.ts} +0 -0
  72. package/esm/{component-b1ceb5d0.js → component-0eefd74d.js} +4 -4
  73. package/esm/component.desktop.js +5 -5
  74. package/esm/component.mobile.js +6 -6
  75. package/esm/component.responsive.d.ts +7 -1
  76. package/esm/component.responsive.js +13 -12
  77. package/esm/components/base-confirmation/component.js +7 -7
  78. package/esm/components/base-confirmation/index.css +2 -2
  79. package/esm/components/base-confirmation/index.d.ts +1 -1
  80. package/esm/components/base-confirmation/index.js +5 -5
  81. package/esm/components/countdown-loader/component.js +3 -3
  82. package/esm/components/countdown-loader/index.css +2 -2
  83. package/esm/components/countdown-loader/index.js +1 -1
  84. package/esm/components/header/component.js +1 -1
  85. package/esm/components/header/index.css +4 -4
  86. package/esm/components/header/index.js +1 -1
  87. package/esm/components/index.js +9 -9
  88. package/esm/components/screens/fatal-error/component.js +3 -3
  89. package/esm/components/screens/fatal-error/index.css +6 -6
  90. package/esm/components/screens/fatal-error/index.js +3 -3
  91. package/esm/components/screens/hint/component.js +3 -3
  92. package/esm/components/screens/hint/index.css +12 -12
  93. package/esm/components/screens/hint/index.js +3 -3
  94. package/esm/components/screens/index.js +8 -8
  95. package/esm/components/screens/initial/component.js +10 -5
  96. package/esm/components/screens/initial/countdown-section.js +4 -4
  97. package/esm/components/screens/initial/index.css +18 -18
  98. package/esm/components/screens/initial/index.js +5 -5
  99. package/esm/components/screens/temp-block/component.js +4 -4
  100. package/esm/components/screens/temp-block/index.css +7 -7
  101. package/esm/components/screens/temp-block/index.js +4 -4
  102. package/esm/{countdown-section-608e4e3a.d.ts → countdown-section-0837d1c0.d.ts} +0 -0
  103. package/esm/{countdown-section-608e4e3a.js → countdown-section-0837d1c0.js} +6 -6
  104. package/esm/desktop.d.ts +1 -0
  105. package/esm/desktop.js +6 -6
  106. package/esm/index.js +12 -12
  107. package/esm/mobile.css +2 -2
  108. package/esm/mobile.d.ts +1 -0
  109. package/esm/mobile.js +6 -6
  110. package/esm/responsive.d.ts +1 -0
  111. package/esm/responsive.js +6 -6
  112. package/esm/utils.js +6 -6
  113. package/index.js +21 -23
  114. package/mobile.css +2 -2
  115. package/mobile.d.ts +1 -0
  116. package/mobile.js +6 -8
  117. package/modern/component.desktop.js +5 -5
  118. package/modern/component.mobile.js +6 -6
  119. package/modern/component.responsive.d.ts +7 -1
  120. package/modern/component.responsive.js +12 -12
  121. package/modern/components/base-confirmation/component.js +8 -8
  122. package/modern/components/base-confirmation/index.css +2 -2
  123. package/modern/components/base-confirmation/index.js +5 -5
  124. package/modern/components/countdown-loader/component.js +1 -1
  125. package/modern/components/countdown-loader/index.css +2 -2
  126. package/modern/components/countdown-loader/index.js +1 -1
  127. package/modern/components/header/component.js +1 -1
  128. package/modern/components/header/index.css +4 -4
  129. package/modern/components/header/index.js +1 -1
  130. package/modern/components/index.js +9 -9
  131. package/modern/components/screens/fatal-error/component.js +3 -3
  132. package/modern/components/screens/fatal-error/index.css +6 -6
  133. package/modern/components/screens/fatal-error/index.js +3 -3
  134. package/modern/components/screens/hint/component.js +3 -3
  135. package/modern/components/screens/hint/index.css +12 -12
  136. package/modern/components/screens/hint/index.js +3 -3
  137. package/modern/components/screens/index.js +8 -8
  138. package/modern/components/screens/initial/component.js +10 -5
  139. package/modern/components/screens/initial/countdown-section.js +4 -4
  140. package/modern/components/screens/initial/index.css +18 -18
  141. package/modern/components/screens/initial/index.js +5 -5
  142. package/modern/components/screens/temp-block/component.js +4 -4
  143. package/modern/components/screens/temp-block/index.css +7 -7
  144. package/modern/components/screens/temp-block/index.js +4 -4
  145. package/modern/{countdown-section-cb87c8ea.d.ts → countdown-section-4c1f4500.d.ts} +0 -0
  146. package/modern/{countdown-section-cb87c8ea.js → countdown-section-4c1f4500.js} +5 -5
  147. package/modern/desktop.d.ts +1 -0
  148. package/modern/desktop.js +6 -6
  149. package/modern/index.js +12 -12
  150. package/modern/mobile.css +2 -2
  151. package/modern/mobile.d.ts +1 -0
  152. package/modern/mobile.js +6 -6
  153. package/modern/responsive.d.ts +1 -0
  154. package/modern/responsive.js +8 -8
  155. package/package.json +6 -6
  156. package/responsive.d.ts +1 -0
  157. package/responsive.js +6 -8
  158. package/types.js +0 -2
  159. package/utils.js +6 -8
  160. package/countdown-section-f4894842.js +0 -49
@@ -1,9 +1,9 @@
1
1
  import React, { useEffect } from 'react';
2
2
  import cn from 'classnames';
3
3
  import { usePrevious } from '@alfalab/hooks';
4
- import { useCountdown, ONE_MINUTE, ONE_DAY } from './utils.js';
5
4
  import { ConfirmationContext } from './context.js';
6
5
  import { defaultTexts } from './types.js';
6
+ import { useCountdown, ONE_MINUTE, ONE_DAY } from './utils.js';
7
7
  import { Initial } from './components/screens/initial/component.js';
8
8
  import { Hint } from './components/screens/hint/component.js';
9
9
  import { FatalError } from './components/screens/fatal-error/component.js';
@@ -48,7 +48,7 @@ function __rest(s, e) {
48
48
  return t;
49
49
  }
50
50
 
51
- var styles = {"component":"confirmation__component_jlzzz"};
51
+ var styles = {"component":"confirmation__component_1uz85"};
52
52
  require('./components/base-confirmation/index.css')
53
53
 
54
54
  var confirmationScreens = {
@@ -58,8 +58,8 @@ var confirmationScreens = {
58
58
  TEMP_BLOCK: TempBlock,
59
59
  };
60
60
  var BaseConfirmation = function (_a) {
61
- var state = _a.state, screen = _a.screen, _b = _a.alignContent, alignContent = _b === void 0 ? 'left' : _b, children = _a.children, _c = _a.requiredCharAmount, requiredCharAmount = _c === void 0 ? 5 : _c, _d = _a.countdownDuration, countdownDuration = _d === void 0 ? ONE_MINUTE : _d, _e = _a.tempBlockDuration, tempBlockDuration = _e === void 0 ? ONE_DAY : _e, phone = _a.phone, blockSmsRetry = _a.blockSmsRetry, dataTestId = _a.dataTestId, className = _a.className, getScreensMap = _a.getScreensMap, onInputFinished = _a.onInputFinished, onChangeState = _a.onChangeState, onSmsRetryClick = _a.onSmsRetryClick, onChangeScreen = _a.onChangeScreen, onFatalErrorOkButtonClick = _a.onFatalErrorOkButtonClick, onTempBlockFinished = _a.onTempBlockFinished, mobile = _a.mobile, clearCodeOnError = _a.clearCodeOnError, restProps = __rest(_a, ["state", "screen", "alignContent", "children", "requiredCharAmount", "countdownDuration", "tempBlockDuration", "phone", "blockSmsRetry", "dataTestId", "className", "getScreensMap", "onInputFinished", "onChangeState", "onSmsRetryClick", "onChangeScreen", "onFatalErrorOkButtonClick", "onTempBlockFinished", "mobile", "clearCodeOnError"]);
62
- var _f = useCountdown(countdownDuration), timeLeft = _f[0], startTimer = _f[1], stopTimer = _f[2];
61
+ var state = _a.state, screen = _a.screen, _b = _a.alignContent, alignContent = _b === void 0 ? 'left' : _b; _a.children; var _c = _a.requiredCharAmount, requiredCharAmount = _c === void 0 ? 5 : _c, _d = _a.countdownDuration, countdownDuration = _d === void 0 ? ONE_MINUTE : _d, _e = _a.tempBlockDuration, tempBlockDuration = _e === void 0 ? ONE_DAY : _e, phone = _a.phone, blockSmsRetry = _a.blockSmsRetry, dataTestId = _a.dataTestId, className = _a.className, getScreensMap = _a.getScreensMap, onInputFinished = _a.onInputFinished, onChangeState = _a.onChangeState, onSmsRetryClick = _a.onSmsRetryClick, onChangeScreen = _a.onChangeScreen, onFatalErrorOkButtonClick = _a.onFatalErrorOkButtonClick, onTempBlockFinished = _a.onTempBlockFinished, mobile = _a.mobile, _f = _a.clearCodeOnError, clearCodeOnError = _f === void 0 ? true : _f, restProps = __rest(_a, ["state", "screen", "alignContent", "children", "requiredCharAmount", "countdownDuration", "tempBlockDuration", "phone", "blockSmsRetry", "dataTestId", "className", "getScreensMap", "onInputFinished", "onChangeState", "onSmsRetryClick", "onChangeScreen", "onFatalErrorOkButtonClick", "onTempBlockFinished", "mobile", "clearCodeOnError"]);
62
+ var _g = useCountdown(countdownDuration), timeLeft = _g[0], startTimer = _g[1], stopTimer = _g[2];
63
63
  var prevState = usePrevious(state);
64
64
  useEffect(function () {
65
65
  startTimer();
@@ -1,22 +1,22 @@
1
- import { B as BaseConfirmation, _ as __assign } from './component-b1ceb5d0.js';
1
+ import { B as BaseConfirmation, _ as __assign } from './component-0eefd74d.js';
2
2
  import React from 'react';
3
3
  import 'classnames';
4
4
  import '@alfalab/hooks';
5
- import './utils.js';
6
5
  import './context.js';
6
+ import './utils.js';
7
7
  import './types.js';
8
+ import './components/screens/initial/component.js';
8
9
  import '@alfalab/core-components-button/esm';
9
10
  import '@alfalab/core-components-code-input/esm';
10
11
  import '@alfalab/core-components-link/esm';
11
12
  import '@alfalab/core-components-typography/esm';
12
13
  import './components/header/component.js';
14
+ import './countdown-section-0837d1c0.js';
13
15
  import '@alfalab/core-components-loader/esm';
14
- import './countdown-section-608e4e3a.js';
15
- import './components/screens/initial/component.js';
16
16
  import './components/screens/hint/component.js';
17
17
  import './components/screens/fatal-error/component.js';
18
- import './components/countdown-loader/component.js';
19
18
  import './components/screens/temp-block/component.js';
19
+ import './components/countdown-loader/component.js';
20
20
 
21
21
  var ConfirmationDesktop = function (props) { return (React.createElement(BaseConfirmation, __assign({}, props))); };
22
22
 
@@ -1,24 +1,24 @@
1
- import { a as __rest, B as BaseConfirmation, _ as __assign } from './component-b1ceb5d0.js';
1
+ import { a as __rest, B as BaseConfirmation, _ as __assign } from './component-0eefd74d.js';
2
2
  import React from 'react';
3
3
  import cn from 'classnames';
4
4
  import '@alfalab/hooks';
5
- import './utils.js';
6
5
  import './context.js';
6
+ import './utils.js';
7
7
  import './types.js';
8
+ import './components/screens/initial/component.js';
8
9
  import '@alfalab/core-components-button/esm';
9
10
  import '@alfalab/core-components-code-input/esm';
10
11
  import '@alfalab/core-components-link/esm';
11
12
  import '@alfalab/core-components-typography/esm';
12
13
  import './components/header/component.js';
14
+ import './countdown-section-0837d1c0.js';
13
15
  import '@alfalab/core-components-loader/esm';
14
- import './countdown-section-608e4e3a.js';
15
- import './components/screens/initial/component.js';
16
16
  import './components/screens/hint/component.js';
17
17
  import './components/screens/fatal-error/component.js';
18
- import './components/countdown-loader/component.js';
19
18
  import './components/screens/temp-block/component.js';
19
+ import './components/countdown-loader/component.js';
20
20
 
21
- var styles = {"container":"confirmation__container_15921"};
21
+ var styles = {"container":"confirmation__container_15eld"};
22
22
  require('./mobile.css')
23
23
 
24
24
  var ConfirmationMobile = function (_a) {
@@ -1,6 +1,12 @@
1
1
  import { FC } from 'react';
2
2
  import { ConfirmationProps } from "./types";
3
- type ResponsiveConfirmationProps = Omit<ConfirmationProps, 'confirmationScreens'>;
3
+ type ResponsiveConfirmationProps = Omit<ConfirmationProps, 'confirmationScreens'> & {
4
+ /**
5
+ * Контрольная точка, с нее начинается desktop версия
6
+ * @default 1024
7
+ */
8
+ breakpoint?: number;
9
+ };
4
10
  type ConfirmationMedia = 'desktop' | 'mobile';
5
11
  declare const ConfirmationResponsive: FC<ResponsiveConfirmationProps>;
6
12
  export { ResponsiveConfirmationProps, ConfirmationMedia, ConfirmationResponsive };
@@ -1,31 +1,32 @@
1
- import { _ as __assign } from './component-b1ceb5d0.js';
1
+ import { a as __rest, _ as __assign } from './component-0eefd74d.js';
2
2
  import React from 'react';
3
- import 'classnames';
4
3
  import { useMedia } from '@alfalab/hooks';
5
- import './utils.js';
4
+ import { ConfirmationDesktop } from './component.desktop.js';
5
+ import { ConfirmationMobile } from './component.mobile.js';
6
+ import 'classnames';
6
7
  import './context.js';
8
+ import './utils.js';
7
9
  import './types.js';
10
+ import './components/screens/initial/component.js';
8
11
  import '@alfalab/core-components-button/esm';
9
12
  import '@alfalab/core-components-code-input/esm';
10
13
  import '@alfalab/core-components-link/esm';
11
14
  import '@alfalab/core-components-typography/esm';
12
15
  import './components/header/component.js';
16
+ import './countdown-section-0837d1c0.js';
13
17
  import '@alfalab/core-components-loader/esm';
14
- import './countdown-section-608e4e3a.js';
15
- import './components/screens/initial/component.js';
16
18
  import './components/screens/hint/component.js';
17
19
  import './components/screens/fatal-error/component.js';
18
- import './components/countdown-loader/component.js';
19
20
  import './components/screens/temp-block/component.js';
20
- import { ConfirmationDesktop } from './component.desktop.js';
21
- import { ConfirmationMobile } from './component.mobile.js';
21
+ import './components/countdown-loader/component.js';
22
22
 
23
- var ConfirmationResponsive = function (props) {
23
+ var ConfirmationResponsive = function (_a) {
24
+ var _b = _a.breakpoint, breakpoint = _b === void 0 ? 1024 : _b, restProps = __rest(_a, ["breakpoint"]);
24
25
  var view = useMedia([
25
- ['mobile', '(max-width: 1023px)'],
26
- ['desktop', '(min-width: 1024px)'],
26
+ ['mobile', "(max-width: ".concat(breakpoint - 1, "px)")],
27
+ ['desktop', "(min-width: ".concat(breakpoint, "px)")],
27
28
  ], 'desktop')[0];
28
- return view === 'desktop' ? (React.createElement(ConfirmationDesktop, __assign({}, props))) : (React.createElement(ConfirmationMobile, __assign({}, props)));
29
+ return view === 'desktop' ? (React.createElement(ConfirmationDesktop, __assign({}, restProps))) : (React.createElement(ConfirmationMobile, __assign({}, restProps)));
29
30
  };
30
31
 
31
32
  export { ConfirmationResponsive };
@@ -1,19 +1,19 @@
1
- export { B as BaseConfirmation } from '../../component-b1ceb5d0.js';
1
+ export { B as BaseConfirmation } from '../../component-0eefd74d.js';
2
2
  import 'react';
3
3
  import 'classnames';
4
4
  import '@alfalab/hooks';
5
- import '../../utils.js';
6
5
  import '../../context.js';
7
6
  import '../../types.js';
7
+ import '../../utils.js';
8
+ import '../screens/initial/component.js';
9
+ import '../screens/hint/component.js';
10
+ import '../screens/fatal-error/component.js';
11
+ import '../screens/temp-block/component.js';
8
12
  import '@alfalab/core-components-button/esm';
9
13
  import '@alfalab/core-components-code-input/esm';
10
14
  import '@alfalab/core-components-link/esm';
11
15
  import '@alfalab/core-components-typography/esm';
12
16
  import '../header/component.js';
17
+ import '../../countdown-section-0837d1c0.js';
13
18
  import '@alfalab/core-components-loader/esm';
14
- import '../../countdown-section-608e4e3a.js';
15
- import '../screens/initial/component.js';
16
- import '../screens/hint/component.js';
17
- import '../screens/fatal-error/component.js';
18
19
  import '../countdown-loader/component.js';
19
- import '../screens/temp-block/component.js';
@@ -1,4 +1,4 @@
1
- /* hash: 5tjjg */
1
+ /* hash: 10mbd */
2
2
  :root {
3
3
  --color-light-text-secondary: rgba(11, 31, 53, 0.7);
4
4
  }
@@ -10,7 +10,7 @@
10
10
 
11
11
  /* Hard up */
12
12
  }
13
- .confirmation__component_jlzzz {
13
+ .confirmation__component_1uz85 {
14
14
  width: 100%;
15
15
  max-width: 388px;
16
16
  margin: 0 auto;
@@ -1 +1 @@
1
- export * from "../../component-b1ceb5d0";
1
+ export * from "../../component-0eefd74d";
@@ -1,19 +1,19 @@
1
- export { B as BaseConfirmation } from '../../component-b1ceb5d0.js';
1
+ export { B as BaseConfirmation } from '../../component-0eefd74d.js';
2
2
  import 'react';
3
3
  import 'classnames';
4
4
  import '@alfalab/hooks';
5
- import '../../utils.js';
6
5
  import '../../context.js';
6
+ import '../../utils.js';
7
7
  import '../../types.js';
8
+ import '../screens/initial/component.js';
8
9
  import '@alfalab/core-components-button/esm';
9
10
  import '@alfalab/core-components-code-input/esm';
10
11
  import '@alfalab/core-components-link/esm';
11
12
  import '@alfalab/core-components-typography/esm';
12
13
  import '../header/component.js';
14
+ import '../../countdown-section-0837d1c0.js';
13
15
  import '@alfalab/core-components-loader/esm';
14
- import '../../countdown-section-608e4e3a.js';
15
- import '../screens/initial/component.js';
16
16
  import '../screens/hint/component.js';
17
17
  import '../screens/fatal-error/component.js';
18
- import '../countdown-loader/component.js';
19
18
  import '../screens/temp-block/component.js';
19
+ import '../countdown-loader/component.js';
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
2
 
3
- var styles = {"circle":"confirmation__circle_8bmir"};
3
+ var styles = {"circle":"confirmation__circle_nvm89"};
4
4
  require('./index.css')
5
5
 
6
6
  var SIZE = 16;
@@ -14,8 +14,8 @@ var CountdownLoader = function (_a) {
14
14
  var value = Math.min(progress, 1);
15
15
  var strokeDasharray = CIRCUMFERENCE.toFixed(2);
16
16
  var strokeDashoffset = (value * CIRCUMFERENCE).toFixed(2);
17
- return (React.createElement("svg", { width: SIZE, height: SIZE, viewBox: "0 0 " + SIZE + " " + SIZE, className: className },
18
- React.createElement("circle", { cx: CENTER, cy: CENTER, r: RADIUS, strokeDasharray: strokeDasharray, strokeDashoffset: strokeDashoffset, transform: "rotate(-90 " + CENTER + " " + CENTER + ")", className: styles.circle })));
17
+ return (React.createElement("svg", { width: SIZE, height: SIZE, viewBox: "0 0 ".concat(SIZE, " ").concat(SIZE), className: className },
18
+ React.createElement("circle", { cx: CENTER, cy: CENTER, r: RADIUS, strokeDasharray: strokeDasharray, strokeDashoffset: strokeDashoffset, transform: "rotate(-90 ".concat(CENTER, " ").concat(CENTER, ")"), className: styles.circle })));
19
19
  };
20
20
 
21
21
  export { CountdownLoader };
@@ -1,4 +1,4 @@
1
- /* hash: 16dc1 */
1
+ /* hash: 13k5c */
2
2
  :root {
3
3
  --color-light-graphic-tertiary: #b6bcc3;
4
4
  }
@@ -10,7 +10,7 @@
10
10
 
11
11
  /* Hard up */
12
12
  }
13
- .confirmation__circle_8bmir {
13
+ .confirmation__circle_nvm89 {
14
14
  fill: transparent;
15
15
  stroke: var(--color-light-graphic-tertiary);
16
16
  stroke-width: 2px;
@@ -1,2 +1,2 @@
1
- import 'react';
2
1
  export { CountdownLoader } from './component.js';
2
+ import 'react';
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import cn from 'classnames';
3
3
  import { Typography } from '@alfalab/core-components-typography/esm';
4
4
 
5
- var styles = {"header":"confirmation__header_oznd3","typography":"confirmation__typography_oznd3","typographyMobile":"confirmation__typographyMobile_oznd3"};
5
+ var styles = {"header":"confirmation__header_1knch","typography":"confirmation__typography_1knch","typographyMobile":"confirmation__typographyMobile_1knch"};
6
6
  require('./index.css')
7
7
 
8
8
  var Header = function (_a) {
@@ -1,4 +1,4 @@
1
- /* hash: 1qs6c */
1
+ /* hash: ly8nc */
2
2
  :root {
3
3
 
4
4
  /* Hard */
@@ -32,17 +32,17 @@
32
32
  /* header */
33
33
  --confirmation-header-font-feature-settings: normal
34
34
  }
35
- .confirmation__header_oznd3.confirmation__header_oznd3 {
35
+ .confirmation__header_1knch.confirmation__header_1knch {
36
36
  margin-bottom: var(--gap-xl);
37
37
  }
38
- .confirmation__typography_oznd3.confirmation__typography_oznd3 {
38
+ .confirmation__typography_1knch.confirmation__typography_1knch {
39
39
  font-feature-settings: var(--confirmation-header-font-feature-settings);
40
40
  font-size: var(--confirmation-header-desktop-font-size);
41
41
  line-height: var(--confirmation-header-desktop-line-height);
42
42
  font-weight: var(--confirmation-header-desktop-font-weight);
43
43
  font-family: var(--confirmation-header-desktop-font-family);
44
44
  }
45
- .confirmation__typographyMobile_oznd3.confirmation__typographyMobile_oznd3 {
45
+ .confirmation__typographyMobile_1knch.confirmation__typographyMobile_1knch {
46
46
  font-feature-settings: var(--confirmation-header-font-feature-settings);
47
47
  font-size: var(--confirmation-header-mobile-font-size);
48
48
  line-height: var(--confirmation-header-mobile-line-height);
@@ -1,4 +1,4 @@
1
+ export { Header } from './component.js';
1
2
  import 'react';
2
3
  import 'classnames';
3
4
  import '@alfalab/core-components-typography/esm';
4
- export { Header } from './component.js';
@@ -1,17 +1,17 @@
1
+ export { Initial } from './screens/initial/component.js';
2
+ export { Hint } from './screens/hint/component.js';
3
+ export { FatalError } from './screens/fatal-error/component.js';
4
+ export { TempBlock } from './screens/temp-block/component.js';
5
+ export { CountdownLoader } from './countdown-loader/component.js';
1
6
  import 'react';
2
7
  import 'classnames';
3
- import '@alfalab/hooks';
4
- import '../utils.js';
5
- import '../context.js';
6
8
  import '@alfalab/core-components-button/esm';
7
9
  import '@alfalab/core-components-code-input/esm';
8
10
  import '@alfalab/core-components-link/esm';
9
11
  import '@alfalab/core-components-typography/esm';
12
+ import '@alfalab/hooks';
13
+ import '../context.js';
14
+ import '../utils.js';
10
15
  import './header/component.js';
16
+ import '../countdown-section-0837d1c0.js';
11
17
  import '@alfalab/core-components-loader/esm';
12
- import '../countdown-section-608e4e3a.js';
13
- export { Initial } from './screens/initial/component.js';
14
- export { Hint } from './screens/hint/component.js';
15
- export { FatalError } from './screens/fatal-error/component.js';
16
- export { CountdownLoader } from './countdown-loader/component.js';
17
- export { TempBlock } from './screens/temp-block/component.js';
@@ -1,12 +1,12 @@
1
1
  import React, { useContext } from 'react';
2
2
  import cn from 'classnames';
3
- import '../../../utils.js';
4
- import { ConfirmationContext } from '../../../context.js';
5
3
  import { Button } from '@alfalab/core-components-button/esm';
6
4
  import { Typography } from '@alfalab/core-components-typography/esm';
5
+ import { ConfirmationContext } from '../../../context.js';
7
6
  import { Header } from '../../header/component.js';
7
+ import '../../../utils.js';
8
8
 
9
- var styles = {"component":"confirmation__component_90sl5","typographyTheme":"confirmation__typographyTheme_90sl5","left":"confirmation__left_90sl5","center":"confirmation__center_90sl5","button":"confirmation__button_90sl5"};
9
+ var styles = {"component":"confirmation__component_1hz3b","typographyTheme":"confirmation__typographyTheme_1hz3b","left":"confirmation__left_1hz3b","center":"confirmation__center_1hz3b","button":"confirmation__button_1hz3b"};
10
10
  require('./index.css')
11
11
 
12
12
  var FatalError = function (_a) {
@@ -1,4 +1,4 @@
1
- /* hash: yc2fe */
1
+ /* hash: le2ko */
2
2
  :root {
3
3
  --color-light-text-primary: #0b1f35;
4
4
  }
@@ -31,24 +31,24 @@
31
31
 
32
32
  /* header */
33
33
  }
34
- .confirmation__component_90sl5 {
34
+ .confirmation__component_1hz3b {
35
35
  display: flex;
36
36
  flex-direction: column;
37
37
  }
38
- .confirmation__typographyTheme_90sl5.confirmation__typographyTheme_90sl5 {
38
+ .confirmation__typographyTheme_1hz3b.confirmation__typographyTheme_1hz3b {
39
39
  font-size: var(--confirmation-text-font-size);
40
40
  line-height: var(--confirmation-text-line-height);
41
41
  font-weight: var(--confirmation-text-font-weight);
42
42
  font-family: var(--confirmation-text-font-family);
43
43
  color: var(--confirmation-text-color);
44
44
  }
45
- .confirmation__left_90sl5 {
45
+ .confirmation__left_1hz3b {
46
46
  align-items: flex-start;
47
47
  }
48
- .confirmation__center_90sl5 {
48
+ .confirmation__center_1hz3b {
49
49
  align-items: center;
50
50
  text-align: center;
51
51
  }
52
- .confirmation__button_90sl5 {
52
+ .confirmation__button_1hz3b {
53
53
  margin-top: var(--gap-2xl);
54
54
  }
@@ -1,8 +1,8 @@
1
+ export { FatalError } from './component.js';
1
2
  import 'react';
2
3
  import 'classnames';
3
- import '../../../utils.js';
4
- import '../../../context.js';
5
4
  import '@alfalab/core-components-button/esm';
6
5
  import '@alfalab/core-components-typography/esm';
6
+ import '../../../context.js';
7
+ import '../../../utils.js';
7
8
  import '../../header/component.js';
8
- export { FatalError } from './component.js';
@@ -1,13 +1,13 @@
1
1
  import React, { useContext } from 'react';
2
2
  import cn from 'classnames';
3
- import '../../../utils.js';
4
- import { ConfirmationContext } from '../../../context.js';
5
3
  import { Button } from '@alfalab/core-components-button/esm';
6
4
  import { Link } from '@alfalab/core-components-link/esm';
7
5
  import { Typography } from '@alfalab/core-components-typography/esm';
6
+ import { ConfirmationContext } from '../../../context.js';
8
7
  import { Header } from '../../header/component.js';
8
+ import '../../../utils.js';
9
9
 
10
- var styles = {"component":"confirmation__component_8p0cq","center":"confirmation__center_8p0cq","text":"confirmation__text_8p0cq","typographyTheme":"confirmation__typographyTheme_8p0cq","phonesWrap":"confirmation__phonesWrap_8p0cq","phoneWrap":"confirmation__phoneWrap_8p0cq","phoneLink":"confirmation__phoneLink_8p0cq","hintButton":"confirmation__hintButton_8p0cq","phoneContentMobile":"confirmation__phoneContentMobile_8p0cq"};
10
+ var styles = {"component":"confirmation__component_1xcu4","center":"confirmation__center_1xcu4","text":"confirmation__text_1xcu4","typographyTheme":"confirmation__typographyTheme_1xcu4","phonesWrap":"confirmation__phonesWrap_1xcu4","phoneWrap":"confirmation__phoneWrap_1xcu4","phoneLink":"confirmation__phoneLink_1xcu4","hintButton":"confirmation__hintButton_1xcu4","phoneContentMobile":"confirmation__phoneContentMobile_1xcu4"};
11
11
  require('./index.css')
12
12
 
13
13
  var Hint = function (_a) {
@@ -1,4 +1,4 @@
1
- /* hash: 1hget */
1
+ /* hash: 1540f */
2
2
  :root {
3
3
  --color-light-text-primary: #0b1f35;
4
4
  }
@@ -33,48 +33,48 @@
33
33
 
34
34
  /* header */
35
35
  }
36
- .confirmation__component_8p0cq {
36
+ .confirmation__component_1xcu4 {
37
37
  display: flex;
38
38
  flex-direction: column;
39
39
  align-items: flex-start
40
40
  }
41
- .confirmation__component_8p0cq span:last-of-type {
41
+ .confirmation__component_1xcu4 span:last-of-type {
42
42
  margin-bottom: 0;
43
43
  }
44
- .confirmation__center_8p0cq {
44
+ .confirmation__center_1xcu4 {
45
45
  align-items: center;
46
46
  text-align: center;
47
47
  }
48
- .confirmation__text_8p0cq.confirmation__text_8p0cq {
48
+ .confirmation__text_1xcu4.confirmation__text_1xcu4 {
49
49
  margin-bottom: var(--gap-xl);
50
50
  }
51
- .confirmation__typographyTheme_8p0cq.confirmation__typographyTheme_8p0cq {
51
+ .confirmation__typographyTheme_1xcu4.confirmation__typographyTheme_1xcu4 {
52
52
  font-size: var(--confirmation-text-font-size);
53
53
  line-height: var(--confirmation-text-line-height);
54
54
  font-weight: var(--confirmation-text-font-weight);
55
55
  font-family: var(--confirmation-text-font-family);
56
56
  color: var(--confirmation-text-color);
57
57
  }
58
- .confirmation__phonesWrap_8p0cq {
58
+ .confirmation__phonesWrap_1xcu4 {
59
59
  display: flex;
60
60
  flex-direction: column;
61
61
  margin-bottom: var(--gap-xl);
62
62
  }
63
- .confirmation__phoneWrap_8p0cq {
63
+ .confirmation__phoneWrap_1xcu4 {
64
64
  margin-bottom: var(--gap-xs)
65
65
  }
66
- .confirmation__phoneWrap_8p0cq:last-child {
66
+ .confirmation__phoneWrap_1xcu4:last-child {
67
67
  margin-bottom: 0;
68
68
  }
69
- .confirmation__phoneLink_8p0cq.confirmation__phoneLink_8p0cq {
69
+ .confirmation__phoneLink_1xcu4.confirmation__phoneLink_1xcu4 {
70
70
  font-size: 16px;
71
71
  line-height: 24px;
72
72
  font-weight: 500;
73
73
  }
74
- .confirmation__hintButton_8p0cq {
74
+ .confirmation__hintButton_1xcu4 {
75
75
  margin-top: var(--gap-2xl);
76
76
  }
77
- .confirmation__phoneContentMobile_8p0cq {
77
+ .confirmation__phoneContentMobile_1xcu4 {
78
78
  display: flex;
79
79
  flex-direction: column;
80
80
  align-items: center;
@@ -1,9 +1,9 @@
1
+ export { Hint } from './component.js';
1
2
  import 'react';
2
3
  import 'classnames';
3
- import '../../../utils.js';
4
- import '../../../context.js';
5
4
  import '@alfalab/core-components-button/esm';
6
5
  import '@alfalab/core-components-link/esm';
7
6
  import '@alfalab/core-components-typography/esm';
7
+ import '../../../context.js';
8
+ import '../../../utils.js';
8
9
  import '../../header/component.js';
9
- export { Hint } from './component.js';
@@ -1,17 +1,17 @@
1
+ export { Initial } from './initial/component.js';
2
+ export { Hint } from './hint/component.js';
3
+ export { FatalError } from './fatal-error/component.js';
4
+ export { TempBlock } from './temp-block/component.js';
1
5
  import 'react';
2
6
  import 'classnames';
3
- import '@alfalab/hooks';
4
- import '../../utils.js';
5
- import '../../context.js';
6
7
  import '@alfalab/core-components-button/esm';
7
8
  import '@alfalab/core-components-code-input/esm';
8
9
  import '@alfalab/core-components-link/esm';
9
10
  import '@alfalab/core-components-typography/esm';
11
+ import '@alfalab/hooks';
12
+ import '../../context.js';
13
+ import '../../utils.js';
10
14
  import '../header/component.js';
15
+ import '../../countdown-section-0837d1c0.js';
11
16
  import '@alfalab/core-components-loader/esm';
12
- import '../../countdown-section-608e4e3a.js';
13
- export { Initial } from './initial/component.js';
14
- export { Hint } from './hint/component.js';
15
- export { FatalError } from './fatal-error/component.js';
16
17
  import '../countdown-loader/component.js';
17
- export { TempBlock } from './temp-block/component.js';
@@ -1,15 +1,15 @@
1
1
  import React, { useContext, useRef, useState, useCallback, useEffect, useLayoutEffect } from 'react';
2
2
  import cn from 'classnames';
3
- import { usePrevious } from '@alfalab/hooks';
4
- import '../../../utils.js';
5
- import { ConfirmationContext } from '../../../context.js';
6
3
  import { Button } from '@alfalab/core-components-button/esm';
7
4
  import { CodeInput } from '@alfalab/core-components-code-input/esm';
8
5
  import { Link } from '@alfalab/core-components-link/esm';
9
6
  import { Typography } from '@alfalab/core-components-typography/esm';
7
+ import { usePrevious } from '@alfalab/hooks';
8
+ import { ConfirmationContext } from '../../../context.js';
10
9
  import { Header } from '../../header/component.js';
10
+ import { s as styles, C as CountdownSection } from '../../../countdown-section-0837d1c0.js';
11
+ import '../../../utils.js';
11
12
  import '@alfalab/core-components-loader/esm';
12
- import { s as styles, C as CountdownSection } from '../../../countdown-section-608e4e3a.js';
13
13
 
14
14
  var CODE_SEND_HINT_VISIBLE_DURATION = 2000;
15
15
  var Initial = function (_a) {
@@ -37,6 +37,11 @@ var Initial = function (_a) {
37
37
  }
38
38
  onSmsRetryClick();
39
39
  };
40
+ var handleErrorAnimationEnd = function () {
41
+ if (clearCodeOnError && state !== 'INITIAL') {
42
+ onChangeState('INITIAL');
43
+ }
44
+ };
40
45
  var clearTimer = useCallback(function () {
41
46
  window.clearTimeout(timerId.current);
42
47
  }, []);
@@ -81,7 +86,7 @@ var Initial = function (_a) {
81
86
  React.createElement(Typography.Text, { view: 'primary-medium', color: 'primary', className: cn(styles.phone, (_b = {}, _b[styles.typographyTheme] = !mobile, _b)) },
82
87
  "\u041A\u043E\u0434 \u043E\u0442\u043F\u0440\u0430\u0432\u043B\u0435\u043D \u043D\u0430 ",
83
88
  phone),
84
- React.createElement(CodeInput, { disabled: processing, error: getCodeInputError(), ref: inputRef, fields: requiredCharAmount, className: cn(styles.containerInput, styles.codeInput), onComplete: handleInputComplete, onChange: handleInputChange, clearCodeOnError: clearCodeOnError }),
89
+ React.createElement(CodeInput, { disabled: processing, error: getCodeInputError(), ref: inputRef, fields: requiredCharAmount, className: cn(styles.containerInput, styles.codeInput), onComplete: handleInputComplete, onChange: handleInputChange, clearCodeOnError: clearCodeOnError, onErrorAnimationEnd: handleErrorAnimationEnd }),
85
90
  React.createElement(CountdownSection, { processing: processing, timePassed: timePassed, codeSendHintVisible: codeSendHintVisible, handleSmsRetryClick: handleSmsRetryClick, mobile: mobile }),
86
91
  mobile ? (React.createElement(Button, { onClick: handleSmsHintLinkClick, view: 'link', size: 'xs' }, texts.linkToHint)) : (React.createElement(Link, { onClick: handleSmsHintLinkClick, className: styles.smsComeLink, view: mobile ? 'primary' : 'secondary', pseudo: true }, texts.linkToHint))));
87
92
  };
@@ -1,8 +1,8 @@
1
1
  import 'react';
2
2
  import 'classnames';
3
- import '../../../utils.js';
4
- import '../../../context.js';
5
3
  import '@alfalab/core-components-button/esm';
6
- import '@alfalab/core-components-typography/esm';
7
4
  import '@alfalab/core-components-loader/esm';
8
- export { C as CountdownSection } from '../../../countdown-section-608e4e3a.js';
5
+ import '@alfalab/core-components-typography/esm';
6
+ import '../../../context.js';
7
+ import '../../../utils.js';
8
+ export { C as CountdownSection } from '../../../countdown-section-0837d1c0.js';