@alfalab/core-components-confirmation 12.5.2 → 13.0.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 (181) hide show
  1. package/component.desktop.d.ts +1 -1
  2. package/component.desktop.js +5 -3
  3. package/component.mobile.js +6 -4
  4. package/component.responsive.d.ts +2 -3
  5. package/component.responsive.js +9 -9
  6. package/components/base-confirmation/component.js +9 -6
  7. package/components/base-confirmation/index.css +2 -2
  8. package/components/base-confirmation/index.js +5 -3
  9. package/components/countdown-loader/component.js +1 -1
  10. package/components/countdown-loader/index.css +2 -2
  11. package/components/header/component.js +1 -1
  12. package/components/header/index.css +4 -4
  13. package/components/index.js +5 -3
  14. package/components/screens/fatal-error/component.js +3 -3
  15. package/components/screens/fatal-error/index.css +6 -6
  16. package/components/screens/hint/component.js +3 -3
  17. package/components/screens/hint/index.css +12 -12
  18. package/components/screens/index.js +5 -3
  19. package/components/screens/initial/component.js +12 -9
  20. package/components/screens/initial/countdown-section.js +1 -1
  21. package/components/screens/initial/index.css +17 -20
  22. package/components/screens/initial/index.js +5 -3
  23. package/components/screens/temp-block/component.js +1 -1
  24. package/components/screens/temp-block/index.css +7 -7
  25. package/context.js +1 -0
  26. package/{countdown-section-41f47745.js → countdown-section-fb6524aa.js} +3 -3
  27. package/cssm/component.desktop.d.ts +1 -1
  28. package/cssm/component.desktop.js +4 -2
  29. package/cssm/component.mobile.js +4 -2
  30. package/cssm/component.responsive.d.ts +2 -3
  31. package/cssm/component.responsive.js +8 -8
  32. package/cssm/components/base-confirmation/component.js +7 -4
  33. package/cssm/components/base-confirmation/index.js +4 -2
  34. package/cssm/components/index.js +4 -2
  35. package/cssm/components/screens/fatal-error/component.js +2 -2
  36. package/cssm/components/screens/hint/component.js +2 -2
  37. package/cssm/components/screens/index.js +4 -2
  38. package/cssm/components/screens/initial/component.js +11 -8
  39. package/cssm/components/screens/initial/countdown-section.js +2 -2
  40. package/cssm/components/screens/initial/index.js +4 -2
  41. package/cssm/components/screens/initial/index.module.css +0 -3
  42. package/cssm/context.js +1 -0
  43. package/cssm/desktop.d.ts +1 -1
  44. package/cssm/desktop.js +7 -3
  45. package/cssm/index.d.ts +2 -6
  46. package/cssm/index.js +18 -26
  47. package/cssm/mobile.d.ts +1 -1
  48. package/cssm/mobile.js +7 -3
  49. package/cssm/shared.d.ts +4 -0
  50. package/cssm/shared.js +43 -0
  51. package/cssm/types.d.ts +11 -0
  52. package/desktop.d.ts +1 -1
  53. package/desktop.js +8 -4
  54. package/esm/component.desktop.d.ts +1 -1
  55. package/esm/component.desktop.js +5 -3
  56. package/esm/component.mobile.js +6 -4
  57. package/esm/component.responsive.d.ts +2 -3
  58. package/esm/component.responsive.js +9 -9
  59. package/esm/components/base-confirmation/component.js +9 -6
  60. package/esm/components/base-confirmation/index.css +2 -2
  61. package/esm/components/base-confirmation/index.js +5 -3
  62. package/esm/components/countdown-loader/component.js +1 -1
  63. package/esm/components/countdown-loader/index.css +2 -2
  64. package/esm/components/header/component.js +1 -1
  65. package/esm/components/header/index.css +4 -4
  66. package/esm/components/index.js +5 -3
  67. package/esm/components/screens/fatal-error/component.js +3 -3
  68. package/esm/components/screens/fatal-error/index.css +6 -6
  69. package/esm/components/screens/hint/component.js +3 -3
  70. package/esm/components/screens/hint/index.css +12 -12
  71. package/esm/components/screens/index.js +5 -3
  72. package/esm/components/screens/initial/component.js +8 -5
  73. package/esm/components/screens/initial/countdown-section.js +1 -1
  74. package/esm/components/screens/initial/index.css +17 -20
  75. package/esm/components/screens/initial/index.js +5 -3
  76. package/esm/components/screens/temp-block/component.js +1 -1
  77. package/esm/components/screens/temp-block/index.css +7 -7
  78. package/esm/context.js +1 -0
  79. package/esm/{countdown-section-83bf5f20.js → countdown-section-c65cff2d.js} +3 -3
  80. package/esm/desktop.d.ts +1 -1
  81. package/esm/desktop.js +6 -4
  82. package/esm/index.d.ts +2 -6
  83. package/esm/index.js +17 -14
  84. package/esm/mobile.css +2 -2
  85. package/esm/mobile.d.ts +1 -1
  86. package/esm/mobile.js +6 -4
  87. package/esm/shared.d.ts +4 -0
  88. package/esm/shared.js +20 -0
  89. package/esm/types.d.ts +11 -0
  90. package/index.d.ts +2 -6
  91. package/index.js +16 -24
  92. package/mobile.css +2 -2
  93. package/mobile.d.ts +1 -1
  94. package/mobile.js +8 -4
  95. package/modern/component.desktop.d.ts +1 -1
  96. package/modern/component.desktop.js +5 -3
  97. package/modern/component.mobile.js +6 -4
  98. package/modern/component.responsive.d.ts +2 -3
  99. package/modern/component.responsive.js +9 -9
  100. package/modern/components/base-confirmation/component.js +8 -5
  101. package/modern/components/base-confirmation/index.css +2 -2
  102. package/modern/components/base-confirmation/index.js +5 -3
  103. package/modern/components/countdown-loader/component.js +1 -1
  104. package/modern/components/countdown-loader/index.css +2 -2
  105. package/modern/components/header/component.js +1 -1
  106. package/modern/components/header/index.css +4 -4
  107. package/modern/components/index.js +5 -3
  108. package/modern/components/screens/fatal-error/component.js +3 -3
  109. package/modern/components/screens/fatal-error/index.css +6 -6
  110. package/modern/components/screens/hint/component.js +3 -3
  111. package/modern/components/screens/hint/index.css +12 -12
  112. package/modern/components/screens/index.js +5 -3
  113. package/modern/components/screens/initial/component.js +8 -5
  114. package/modern/components/screens/initial/countdown-section.js +1 -1
  115. package/modern/components/screens/initial/index.css +17 -20
  116. package/modern/components/screens/initial/index.js +5 -3
  117. package/modern/components/screens/temp-block/component.js +1 -1
  118. package/modern/components/screens/temp-block/index.css +7 -7
  119. package/modern/context.js +1 -0
  120. package/modern/{countdown-section-a28d693c.js → countdown-section-dd4e5fe3.js} +3 -3
  121. package/modern/desktop.d.ts +1 -1
  122. package/modern/desktop.js +6 -4
  123. package/modern/index.d.ts +2 -6
  124. package/modern/index.js +17 -14
  125. package/modern/mobile.css +2 -2
  126. package/modern/mobile.d.ts +1 -1
  127. package/modern/mobile.js +6 -4
  128. package/modern/shared.d.ts +4 -0
  129. package/modern/shared.js +20 -0
  130. package/modern/types.d.ts +11 -0
  131. package/package.json +31 -6
  132. package/shared.d.ts +4 -0
  133. package/shared.js +37 -0
  134. package/src/component.desktop.tsx +10 -0
  135. package/src/component.mobile.tsx +13 -0
  136. package/src/component.responsive.tsx +31 -0
  137. package/src/components/base-confirmation/component.tsx +123 -0
  138. package/src/components/base-confirmation/index.module.css +8 -0
  139. package/src/components/base-confirmation/index.ts +1 -0
  140. package/src/components/countdown-loader/component.tsx +37 -0
  141. package/src/components/countdown-loader/index.module.css +7 -0
  142. package/src/components/countdown-loader/index.ts +1 -0
  143. package/src/components/header/component.tsx +28 -0
  144. package/src/components/header/index.module.css +21 -0
  145. package/src/components/header/index.ts +1 -0
  146. package/src/components/index.ts +2 -0
  147. package/src/components/screens/fatal-error/component.tsx +46 -0
  148. package/src/components/screens/fatal-error/index.module.css +23 -0
  149. package/src/components/screens/fatal-error/index.ts +1 -0
  150. package/src/components/screens/hint/component.tsx +94 -0
  151. package/src/components/screens/hint/index.module.css +51 -0
  152. package/src/components/screens/hint/index.ts +1 -0
  153. package/src/components/screens/index.ts +4 -0
  154. package/src/components/screens/initial/component.tsx +190 -0
  155. package/src/components/screens/initial/countdown-section.tsx +79 -0
  156. package/src/components/screens/initial/index.module.css +71 -0
  157. package/src/components/screens/initial/index.ts +1 -0
  158. package/src/components/screens/temp-block/component.tsx +58 -0
  159. package/src/components/screens/temp-block/index.module.css +28 -0
  160. package/src/components/screens/temp-block/index.ts +1 -0
  161. package/src/context.ts +26 -0
  162. package/src/desktop.ts +3 -0
  163. package/src/index.ts +6 -0
  164. package/src/mobile.module.css +3 -0
  165. package/src/mobile.ts +3 -0
  166. package/src/shared.ts +4 -0
  167. package/src/types.ts +219 -0
  168. package/src/utils.ts +107 -0
  169. package/src/vars.css +33 -0
  170. package/types.d.ts +11 -0
  171. package/cssm/responsive.d.ts +0 -2
  172. package/cssm/responsive.js +0 -39
  173. package/esm/responsive.d.ts +0 -2
  174. package/esm/responsive.js +0 -23
  175. package/modern/responsive.d.ts +0 -2
  176. package/modern/responsive.js +0 -22
  177. package/responsive.d.ts +0 -2
  178. package/responsive.js +0 -31
  179. /package/{countdown-section-41f47745.d.ts → countdown-section-fb6524aa.d.ts} +0 -0
  180. /package/esm/{countdown-section-83bf5f20.d.ts → countdown-section-c65cff2d.d.ts} +0 -0
  181. /package/modern/{countdown-section-a28d693c.d.ts → countdown-section-dd4e5fe3.d.ts} +0 -0
@@ -1,14 +1,16 @@
1
1
  import React, { useContext, useRef, useState, useCallback, useEffect, useLayoutEffect } from 'react';
2
2
  import cn from 'classnames';
3
- import { Button } from '@alfalab/core-components-button/esm';
4
- import { CodeInput } from '@alfalab/core-components-code-input/esm';
3
+ import { ButtonMobile } from '@alfalab/core-components-button/esm/mobile';
4
+ import { CodeInputDesktop } from '@alfalab/core-components-code-input/esm/desktop';
5
+ import { CodeInputMobile } from '@alfalab/core-components-code-input/esm/mobile';
5
6
  import { Link } from '@alfalab/core-components-link/esm';
6
7
  import { Typography } from '@alfalab/core-components-typography/esm';
7
8
  import { usePrevious } from '@alfalab/hooks';
8
9
  import { ConfirmationContext } from '../../../context.js';
9
10
  import { Header } from '../../header/component.js';
10
- import { s as styles, C as CountdownSection } from '../../../countdown-section-83bf5f20.js';
11
+ import { s as styles, C as CountdownSection } from '../../../countdown-section-c65cff2d.js';
11
12
  import '../../../utils.js';
13
+ import '@alfalab/core-components-button/esm';
12
14
  import '@alfalab/core-components-loader/esm';
13
15
 
14
16
  var CODE_SEND_HINT_VISIBLE_DURATION = 2000;
@@ -81,14 +83,15 @@ var Initial = function (_a) {
81
83
  };
82
84
  var processing = ['CODE_CHECKING', 'CODE_SENDING'].includes(state);
83
85
  var timePassed = timeLeft === 0;
86
+ var ComponentCodeInput = mobile ? CodeInputMobile : CodeInputDesktop;
84
87
  return (React.createElement("div", { className: cn(styles.component, styles[alignContent]) },
85
88
  React.createElement(Header, { mobile: mobile }, texts.title),
86
89
  React.createElement(Typography.Text, { view: 'primary-medium', color: 'primary', className: cn(styles.phone, (_b = {}, _b[styles.typographyTheme] = !mobile, _b)) },
87
90
  "\u041A\u043E\u0434 \u043E\u0442\u043F\u0440\u0430\u0432\u043B\u0435\u043D \u043D\u0430 ",
88
91
  phone),
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 }),
92
+ React.createElement(ComponentCodeInput, { disabled: processing, error: getCodeInputError(), ref: inputRef, fields: requiredCharAmount, className: cn(styles.containerInput, styles.codeInput), onComplete: handleInputComplete, onChange: handleInputChange, clearCodeOnError: clearCodeOnError, onErrorAnimationEnd: handleErrorAnimationEnd }),
90
93
  !hideCountdownSection && (React.createElement(CountdownSection, { processing: processing, timePassed: timePassed, codeSendHintVisible: codeSendHintVisible, handleSmsRetryClick: handleSmsRetryClick, mobile: mobile })),
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))));
94
+ mobile ? (React.createElement(ButtonMobile, { onClick: handleSmsHintLinkClick, view: 'link', size: 'xs' }, texts.linkToHint)) : (React.createElement(Link, { onClick: handleSmsHintLinkClick, className: styles.smsComeLink, view: mobile ? 'primary' : 'secondary', pseudo: true }, texts.linkToHint))));
92
95
  };
93
96
 
94
97
  export { Initial };
@@ -5,4 +5,4 @@ import '@alfalab/core-components-loader/esm';
5
5
  import '@alfalab/core-components-typography/esm';
6
6
  import '../../../context.js';
7
7
  import '../../../utils.js';
8
- export { C as CountdownSection } from '../../../countdown-section-83bf5f20.js';
8
+ export { C as CountdownSection } from '../../../countdown-section-c65cff2d.js';
@@ -1,4 +1,4 @@
1
- /* hash: 1hf3q */
1
+ /* hash: 26rxz */
2
2
  :root {
3
3
  } /* deprecated */ :root {
4
4
  --color-light-text-primary: #0e0e0e;
@@ -14,7 +14,6 @@
14
14
  /* Hard up */
15
15
  } :root {
16
16
  } :root {
17
- --gap-2xs: 4px;
18
17
  --gap-s: 12px;
19
18
  --gap-m: 16px;
20
19
  --gap-l: 20px;
@@ -38,51 +37,49 @@
38
37
  --confirmation-text-color: var(--color-light-text-primary)
39
38
 
40
39
  /* header */
41
- } .confirmation__component_16lwf {
40
+ } .confirmation__component_7ycwi {
42
41
  display: flex;
43
42
  flex-direction: column;
44
- } .confirmation__typographyTheme_16lwf.confirmation__typographyTheme_16lwf {
43
+ } .confirmation__typographyTheme_7ycwi.confirmation__typographyTheme_7ycwi {
45
44
  font-size: var(--confirmation-text-font-size);
46
45
  line-height: var(--confirmation-text-line-height);
47
46
  font-weight: var(--confirmation-text-font-weight);
48
47
  font-family: var(--confirmation-text-font-family);
49
48
  color: var(--confirmation-text-color);
50
- } .confirmation__phone_16lwf.confirmation__phone_16lwf {
49
+ } .confirmation__phone_7ycwi.confirmation__phone_7ycwi {
51
50
  color: var(--color-light-text-primary);
52
51
  margin-bottom: var(--gap-2xl);
53
- } .confirmation__compact_16lwf {
52
+ } .confirmation__compact_7ycwi {
54
53
  margin-bottom: var(--gap-xl);
55
- } .confirmation__loaderWrap_16lwf {
54
+ } .confirmation__loaderWrap_7ycwi {
56
55
  display: flex;
57
56
  align-items: center;
58
- } .confirmation__left_16lwf {
57
+ } .confirmation__left_7ycwi {
59
58
  align-items: flex-start;
60
- } .confirmation__center_16lwf {
59
+ } .confirmation__center_7ycwi {
61
60
  align-items: center;
62
61
  text-align: center
63
- } .confirmation__center_16lwf .confirmation__loaderWrap_16lwf {
62
+ } .confirmation__center_7ycwi .confirmation__loaderWrap_7ycwi {
64
63
  justify-content: center;
65
- } .confirmation__center_16lwf input {
66
- margin: 0 var(--gap-2xs);
67
- } .confirmation__codeInput_16lwf {
64
+ } .confirmation__codeInput_7ycwi {
68
65
  margin-bottom: var(--gap-s);
69
- } .confirmation__smsComeLink_16lwf.confirmation__smsComeLink_16lwf {
66
+ } .confirmation__smsComeLink_7ycwi.confirmation__smsComeLink_7ycwi {
70
67
  font-size: 14px;
71
68
  line-height: 20px;
72
69
  font-weight: 500;
73
- } .confirmation__countdownContainer_16lwf.confirmation__countdownContainer_16lwf {
70
+ } .confirmation__countdownContainer_7ycwi.confirmation__countdownContainer_7ycwi {
74
71
  color: var(--color-light-text-secondary);
75
72
  margin-bottom: var(--gap-xl);
76
- } .confirmation__countdownMobile_16lwf.confirmation__countdownMobile_16lwf {
73
+ } .confirmation__countdownMobile_7ycwi.confirmation__countdownMobile_7ycwi {
77
74
  margin-bottom: var(--gap-l);
78
- } .confirmation__countdownLoaderMobile_16lwf.confirmation__countdownLoaderMobile_16lwf {
75
+ } .confirmation__countdownLoaderMobile_7ycwi.confirmation__countdownLoaderMobile_7ycwi {
79
76
  margin-bottom: var(--gap-m);
80
- } .confirmation__getCodeButton_16lwf {
77
+ } .confirmation__getCodeButton_7ycwi {
81
78
  position: relative;
82
79
  top: var(--gap-2xs-neg);
83
80
  margin-bottom: var(--gap-m);
84
- } .confirmation__getCodeButtonMobile_16lwf {
81
+ } .confirmation__getCodeButtonMobile_7ycwi {
85
82
  margin-bottom: 0;
86
- } .confirmation__containerInput_16lwf {
83
+ } .confirmation__containerInput_7ycwi {
87
84
  min-height: 80px;
88
85
  }
@@ -1,13 +1,15 @@
1
1
  export { Initial } from './component.js';
2
2
  import 'react';
3
3
  import 'classnames';
4
- import '@alfalab/core-components-button/esm';
5
- import '@alfalab/core-components-code-input/esm';
4
+ import '@alfalab/core-components-button/esm/mobile';
5
+ import '@alfalab/core-components-code-input/esm/desktop';
6
+ import '@alfalab/core-components-code-input/esm/mobile';
6
7
  import '@alfalab/core-components-link/esm';
7
8
  import '@alfalab/core-components-typography/esm';
8
9
  import '@alfalab/hooks';
9
10
  import '../../../context.js';
10
11
  import '../../../utils.js';
11
12
  import '../../header/component.js';
12
- import '../../../countdown-section-83bf5f20.js';
13
+ import '../../../countdown-section-c65cff2d.js';
14
+ import '@alfalab/core-components-button/esm';
13
15
  import '@alfalab/core-components-loader/esm';
@@ -6,7 +6,7 @@ import { useCountdown, formatMsAsMinutes } from '../../../utils.js';
6
6
  import { CountdownLoader } from '../../countdown-loader/component.js';
7
7
  import { Header } from '../../header/component.js';
8
8
 
9
- var styles = {"component":"confirmation__component_1q9mt","center":"confirmation__center_1q9mt","typographyTheme":"confirmation__typographyTheme_1q9mt","description":"confirmation__description_1q9mt","countdownWrap":"confirmation__countdownWrap_1q9mt","loader":"confirmation__loader_1q9mt"};
9
+ var styles = {"component":"confirmation__component_mzsf9","center":"confirmation__center_mzsf9","typographyTheme":"confirmation__typographyTheme_mzsf9","description":"confirmation__description_mzsf9","countdownWrap":"confirmation__countdownWrap_mzsf9","loader":"confirmation__loader_mzsf9"};
10
10
  require('./index.css')
11
11
 
12
12
  var TempBlock = function (_a) {
@@ -1,4 +1,4 @@
1
- /* hash: 1bz9l */
1
+ /* hash: s6hbt */
2
2
  :root {
3
3
  } /* deprecated */ :root {
4
4
  --color-light-text-primary: #0e0e0e; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -31,23 +31,23 @@
31
31
  --confirmation-text-color: var(--color-light-text-primary)
32
32
 
33
33
  /* header */
34
- } .confirmation__component_1q9mt {
34
+ } .confirmation__component_mzsf9 {
35
35
  display: flex;
36
36
  flex-direction: column;
37
- } .confirmation__center_1q9mt {
37
+ } .confirmation__center_mzsf9 {
38
38
  align-items: center;
39
39
  text-align: center;
40
- } .confirmation__typographyTheme_1q9mt.confirmation__typographyTheme_1q9mt {
40
+ } .confirmation__typographyTheme_mzsf9.confirmation__typographyTheme_mzsf9 {
41
41
  font-size: var(--confirmation-text-font-size);
42
42
  line-height: var(--confirmation-text-line-height);
43
43
  font-weight: var(--confirmation-text-font-weight);
44
44
  font-family: var(--confirmation-text-font-family);
45
45
  color: var(--confirmation-text-color);
46
- } .confirmation__description_1q9mt.confirmation__description_1q9mt {
46
+ } .confirmation__description_mzsf9.confirmation__description_mzsf9 {
47
47
  margin-bottom: var(--gap-xs);
48
- } .confirmation__countdownWrap_1q9mt {
48
+ } .confirmation__countdownWrap_mzsf9 {
49
49
  display: flex;
50
50
  align-items: center;
51
- } .confirmation__loader_1q9mt {
51
+ } .confirmation__loader_mzsf9 {
52
52
  margin-right: var(--gap-xs);
53
53
  }
package/esm/context.js CHANGED
@@ -13,6 +13,7 @@ var ConfirmationContext = createContext({
13
13
  tempBlockDuration: ONE_DAY,
14
14
  phone: '',
15
15
  hideCountdownSection: false,
16
+ breakpoint: 1024,
16
17
  onTempBlockFinished: mockFn,
17
18
  onInputFinished: mockFn,
18
19
  onChangeState: mockFn,
@@ -6,13 +6,13 @@ import { Typography } from '@alfalab/core-components-typography/esm';
6
6
  import { ConfirmationContext } from './context.js';
7
7
  import { formatMsAsMinutes } from './utils.js';
8
8
 
9
- var styles = {"component":"confirmation__component_16lwf","typographyTheme":"confirmation__typographyTheme_16lwf","phone":"confirmation__phone_16lwf","compact":"confirmation__compact_16lwf","loaderWrap":"confirmation__loaderWrap_16lwf","left":"confirmation__left_16lwf","center":"confirmation__center_16lwf","codeInput":"confirmation__codeInput_16lwf","smsComeLink":"confirmation__smsComeLink_16lwf","countdownContainer":"confirmation__countdownContainer_16lwf","countdownMobile":"confirmation__countdownMobile_16lwf","countdownLoaderMobile":"confirmation__countdownLoaderMobile_16lwf","getCodeButton":"confirmation__getCodeButton_16lwf","getCodeButtonMobile":"confirmation__getCodeButtonMobile_16lwf","containerInput":"confirmation__containerInput_16lwf"};
9
+ var styles = {"component":"confirmation__component_7ycwi","typographyTheme":"confirmation__typographyTheme_7ycwi","phone":"confirmation__phone_7ycwi","compact":"confirmation__compact_7ycwi","loaderWrap":"confirmation__loaderWrap_7ycwi","left":"confirmation__left_7ycwi","center":"confirmation__center_7ycwi","codeInput":"confirmation__codeInput_7ycwi","smsComeLink":"confirmation__smsComeLink_7ycwi","countdownContainer":"confirmation__countdownContainer_7ycwi","countdownMobile":"confirmation__countdownMobile_7ycwi","countdownLoaderMobile":"confirmation__countdownLoaderMobile_7ycwi","getCodeButton":"confirmation__getCodeButton_7ycwi","getCodeButtonMobile":"confirmation__getCodeButtonMobile_7ycwi","containerInput":"confirmation__containerInput_7ycwi"};
10
10
  require('./components/screens/initial/index.css')
11
11
 
12
12
  var CountdownSection = function (_a) {
13
13
  var _b, _c;
14
14
  var codeSendHintVisible = _a.codeSendHintVisible, timePassed = _a.timePassed, processing = _a.processing, mobile = _a.mobile, handleSmsRetryClick = _a.handleSmsRetryClick;
15
- var _d = useContext(ConfirmationContext), state = _d.state, texts = _d.texts, timeLeft = _d.timeLeft, blockSmsRetry = _d.blockSmsRetry;
15
+ var _d = useContext(ConfirmationContext), state = _d.state, texts = _d.texts, timeLeft = _d.timeLeft, blockSmsRetry = _d.blockSmsRetry, breakpoint = _d.breakpoint;
16
16
  var renderText = function (text) {
17
17
  var _a;
18
18
  return (React.createElement(Typography.Text, { className: cn(styles.countdownContainer, (_a = {},
@@ -33,7 +33,7 @@ var CountdownSection = function (_a) {
33
33
  if (blockSmsRetry)
34
34
  return renderText(texts.noAttemptsLeft);
35
35
  if (timePassed) {
36
- return (React.createElement(Button, { size: mobile ? 'xs' : 'xxs', view: 'secondary', onClick: handleSmsRetryClick, className: cn(styles.getCodeButton, (_c = {}, _c[styles.getCodeButtonMobile] = mobile, _c)) }, texts.buttonRetry));
36
+ return (React.createElement(Button, { size: mobile ? 'xs' : 'xxs', view: 'secondary', onClick: handleSmsRetryClick, className: cn(styles.getCodeButton, (_c = {}, _c[styles.getCodeButtonMobile] = mobile, _c)), breakpoint: breakpoint }, texts.buttonRetry));
37
37
  }
38
38
  return renderText("".concat(texts.countdown, " ").concat(formatMsAsMinutes(timeLeft)));
39
39
  };
package/esm/desktop.d.ts CHANGED
@@ -1,2 +1,2 @@
1
1
  export * from "./component.desktop";
2
- export {};
2
+ export { useConfirmation, useCountdown } from "./utils";
package/esm/desktop.js CHANGED
@@ -1,19 +1,21 @@
1
1
  export { ConfirmationDesktop } from './component.desktop.js';
2
+ export { useConfirmation, useCountdown } from './utils.js';
2
3
  import 'tslib';
3
4
  import 'react';
4
5
  import './components/base-confirmation/component.js';
5
6
  import 'classnames';
6
7
  import '@alfalab/hooks';
7
8
  import './context.js';
8
- import './utils.js';
9
9
  import './types.js';
10
10
  import './components/screens/initial/component.js';
11
- import '@alfalab/core-components-button/esm';
12
- import '@alfalab/core-components-code-input/esm';
11
+ import '@alfalab/core-components-button/esm/mobile';
12
+ import '@alfalab/core-components-code-input/esm/desktop';
13
+ import '@alfalab/core-components-code-input/esm/mobile';
13
14
  import '@alfalab/core-components-link/esm';
14
15
  import '@alfalab/core-components-typography/esm';
15
16
  import './components/header/component.js';
16
- import './countdown-section-83bf5f20.js';
17
+ import './countdown-section-c65cff2d.js';
18
+ import '@alfalab/core-components-button/esm';
17
19
  import '@alfalab/core-components-loader/esm';
18
20
  import './components/screens/hint/component.js';
19
21
  import './components/screens/fatal-error/component.js';
package/esm/index.d.ts CHANGED
@@ -1,6 +1,2 @@
1
- export { ConfirmationDesktop as Confirmation } from "./desktop";
2
- export * from "./responsive";
3
- export * from "./components/index";
4
- export * from "./context";
5
- export * from "./types";
6
- export * from "./utils";
1
+ export { ConfirmationResponsive as Confirmation, ResponsiveConfirmationProps as ConfirmationProps } from "./component.responsive";
2
+ export { useConfirmation, useCountdown } from "./utils";
package/esm/index.js CHANGED
@@ -1,23 +1,26 @@
1
- export { ConfirmationDesktop as Confirmation } from './component.desktop.js';
2
- export { ConfirmationResponsive } from './component.responsive.js';
3
- export { Initial } from './components/screens/initial/component.js';
4
- export { Hint } from './components/screens/hint/component.js';
5
- export { FatalError } from './components/screens/fatal-error/component.js';
6
- export { TempBlock } from './components/screens/temp-block/component.js';
7
- export { CountdownLoader } from './components/countdown-loader/component.js';
8
- export { ConfirmationContext } from './context.js';
9
- export { defaultTexts } from './types.js';
10
- export { ONE_DAY, ONE_MINUTE, formatMsAsMinutes, useConfirmation, useCountdown } from './utils.js';
1
+ export { ConfirmationResponsive as Confirmation } from './component.responsive.js';
2
+ export { useConfirmation, useCountdown } from './utils.js';
11
3
  import 'tslib';
12
4
  import 'react';
5
+ import '@alfalab/core-components-mq/esm';
6
+ import './component.desktop.js';
13
7
  import './components/base-confirmation/component.js';
14
8
  import 'classnames';
15
9
  import '@alfalab/hooks';
16
- import './component.mobile.js';
17
- import '@alfalab/core-components-button/esm';
18
- import '@alfalab/core-components-code-input/esm';
10
+ import './context.js';
11
+ import './types.js';
12
+ import './components/screens/initial/component.js';
13
+ import '@alfalab/core-components-button/esm/mobile';
14
+ import '@alfalab/core-components-code-input/esm/desktop';
15
+ import '@alfalab/core-components-code-input/esm/mobile';
19
16
  import '@alfalab/core-components-link/esm';
20
17
  import '@alfalab/core-components-typography/esm';
21
18
  import './components/header/component.js';
22
- import './countdown-section-83bf5f20.js';
19
+ import './countdown-section-c65cff2d.js';
20
+ import '@alfalab/core-components-button/esm';
23
21
  import '@alfalab/core-components-loader/esm';
22
+ import './components/screens/hint/component.js';
23
+ import './components/screens/fatal-error/component.js';
24
+ import './components/screens/temp-block/component.js';
25
+ import './components/countdown-loader/component.js';
26
+ import './component.mobile.js';
package/esm/mobile.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 5kxvr */
2
- .confirmation__container_1gfq6 {
1
+ /* hash: pdq5h */
2
+ .confirmation__container_hgizz {
3
3
  max-width: 288px;
4
4
  }
package/esm/mobile.d.ts CHANGED
@@ -1,2 +1,2 @@
1
1
  export * from "./component.mobile";
2
- export {};
2
+ export { useConfirmation, useCountdown } from "./utils";
package/esm/mobile.js CHANGED
@@ -1,19 +1,21 @@
1
1
  export { ConfirmationMobile } from './component.mobile.js';
2
+ export { useConfirmation, useCountdown } from './utils.js';
2
3
  import 'tslib';
3
4
  import 'react';
4
5
  import 'classnames';
5
6
  import './components/base-confirmation/component.js';
6
7
  import '@alfalab/hooks';
7
8
  import './context.js';
8
- import './utils.js';
9
9
  import './types.js';
10
10
  import './components/screens/initial/component.js';
11
- import '@alfalab/core-components-button/esm';
12
- import '@alfalab/core-components-code-input/esm';
11
+ import '@alfalab/core-components-button/esm/mobile';
12
+ import '@alfalab/core-components-code-input/esm/desktop';
13
+ import '@alfalab/core-components-code-input/esm/mobile';
13
14
  import '@alfalab/core-components-link/esm';
14
15
  import '@alfalab/core-components-typography/esm';
15
16
  import './components/header/component.js';
16
- import './countdown-section-83bf5f20.js';
17
+ import './countdown-section-c65cff2d.js';
18
+ import '@alfalab/core-components-button/esm';
17
19
  import '@alfalab/core-components-loader/esm';
18
20
  import './components/screens/hint/component.js';
19
21
  import './components/screens/fatal-error/component.js';
@@ -0,0 +1,4 @@
1
+ export * from "./components/index";
2
+ export * from "./context";
3
+ export * from "./types";
4
+ export { formatMsAsMinutes, ONE_MINUTE, ONE_DAY } from "./utils";
package/esm/shared.js ADDED
@@ -0,0 +1,20 @@
1
+ export { Initial } from './components/screens/initial/component.js';
2
+ export { Hint } from './components/screens/hint/component.js';
3
+ export { FatalError } from './components/screens/fatal-error/component.js';
4
+ export { TempBlock } from './components/screens/temp-block/component.js';
5
+ export { CountdownLoader } from './components/countdown-loader/component.js';
6
+ export { ConfirmationContext } from './context.js';
7
+ export { defaultTexts } from './types.js';
8
+ export { ONE_DAY, ONE_MINUTE, formatMsAsMinutes } from './utils.js';
9
+ import 'react';
10
+ import 'classnames';
11
+ import '@alfalab/core-components-button/esm/mobile';
12
+ import '@alfalab/core-components-code-input/esm/desktop';
13
+ import '@alfalab/core-components-code-input/esm/mobile';
14
+ import '@alfalab/core-components-link/esm';
15
+ import '@alfalab/core-components-typography/esm';
16
+ import '@alfalab/hooks';
17
+ import './components/header/component.js';
18
+ import './countdown-section-c65cff2d.js';
19
+ import '@alfalab/core-components-button/esm';
20
+ import '@alfalab/core-components-loader/esm';
package/esm/types.d.ts CHANGED
@@ -89,9 +89,20 @@ type ConfirmationProps = {
89
89
  * @default false
90
90
  */
91
91
  hideCountdownSection?: boolean;
92
+ /**
93
+ * Контрольная точка для кнопки, с нее начинается desktop версия
94
+ * @default 1024
95
+ */
96
+ breakpoint?: number;
92
97
  };
93
98
  type TConfirmationContext = Required<Pick<ConfirmationProps, 'alignContent' | 'texts' | 'state' | 'screen' | 'requiredCharAmount' | 'onInputFinished' | 'countdownDuration' | 'onChangeState' | 'onSmsRetryClick' | 'onChangeScreen' | 'onFatalErrorOkButtonClick' | 'tempBlockDuration' | 'hideCountdownSection'>> & Pick<ConfirmationProps, 'phone' | 'blockSmsRetry' | 'onTempBlockFinished' | 'clearCodeOnError'> & {
94
99
  timeLeft: number;
100
+ } & {
101
+ /**
102
+ * Контрольная точка для кнопки, с нее начинается desktop версия
103
+ * @default 1024
104
+ */
105
+ breakpoint?: number;
95
106
  };
96
107
  type ConfirmationTexts = {
97
108
  /**
package/index.d.ts CHANGED
@@ -1,6 +1,2 @@
1
- export { ConfirmationDesktop as Confirmation } from "./desktop";
2
- export * from "./responsive";
3
- export * from "./components/index";
4
- export * from "./context";
5
- export * from "./types";
6
- export * from "./utils";
1
+ export { ConfirmationResponsive as Confirmation, ResponsiveConfirmationProps as ConfirmationProps } from "./component.responsive";
2
+ export { useConfirmation, useCountdown } from "./utils";
package/index.js CHANGED
@@ -2,43 +2,35 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var component_desktop = require('./component.desktop.js');
6
5
  var component_responsive = require('./component.responsive.js');
7
- var components_screens_initial_component = require('./components/screens/initial/component.js');
8
- var components_screens_hint_component = require('./components/screens/hint/component.js');
9
- var components_screens_fatalError_component = require('./components/screens/fatal-error/component.js');
10
- var components_screens_tempBlock_component = require('./components/screens/temp-block/component.js');
11
- var components_countdownLoader_component = require('./components/countdown-loader/component.js');
12
- var context = require('./context.js');
13
- var types = require('./types.js');
14
6
  var utils = require('./utils.js');
15
7
  require('tslib');
16
8
  require('react');
9
+ require('@alfalab/core-components-mq');
10
+ require('./component.desktop.js');
17
11
  require('./components/base-confirmation/component.js');
18
12
  require('classnames');
19
13
  require('@alfalab/hooks');
20
- require('./component.mobile.js');
21
- require('@alfalab/core-components-button');
22
- require('@alfalab/core-components-code-input');
14
+ require('./context.js');
15
+ require('./types.js');
16
+ require('./components/screens/initial/component.js');
17
+ require('@alfalab/core-components-button/mobile');
18
+ require('@alfalab/core-components-code-input/desktop');
19
+ require('@alfalab/core-components-code-input/mobile');
23
20
  require('@alfalab/core-components-link');
24
21
  require('@alfalab/core-components-typography');
25
22
  require('./components/header/component.js');
26
- require('./countdown-section-41f47745.js');
23
+ require('./countdown-section-fb6524aa.js');
24
+ require('@alfalab/core-components-button');
27
25
  require('@alfalab/core-components-loader');
26
+ require('./components/screens/hint/component.js');
27
+ require('./components/screens/fatal-error/component.js');
28
+ require('./components/screens/temp-block/component.js');
29
+ require('./components/countdown-loader/component.js');
30
+ require('./component.mobile.js');
28
31
 
29
32
 
30
33
 
31
- exports.Confirmation = component_desktop.ConfirmationDesktop;
32
- exports.ConfirmationResponsive = component_responsive.ConfirmationResponsive;
33
- exports.Initial = components_screens_initial_component.Initial;
34
- exports.Hint = components_screens_hint_component.Hint;
35
- exports.FatalError = components_screens_fatalError_component.FatalError;
36
- exports.TempBlock = components_screens_tempBlock_component.TempBlock;
37
- exports.CountdownLoader = components_countdownLoader_component.CountdownLoader;
38
- exports.ConfirmationContext = context.ConfirmationContext;
39
- exports.defaultTexts = types.defaultTexts;
40
- exports.ONE_DAY = utils.ONE_DAY;
41
- exports.ONE_MINUTE = utils.ONE_MINUTE;
42
- exports.formatMsAsMinutes = utils.formatMsAsMinutes;
34
+ exports.Confirmation = component_responsive.ConfirmationResponsive;
43
35
  exports.useConfirmation = utils.useConfirmation;
44
36
  exports.useCountdown = utils.useCountdown;
package/mobile.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 5kxvr */
2
- .confirmation__container_1gfq6 {
1
+ /* hash: pdq5h */
2
+ .confirmation__container_hgizz {
3
3
  max-width: 288px;
4
4
  }
package/mobile.d.ts CHANGED
@@ -1,2 +1,2 @@
1
1
  export * from "./component.mobile";
2
- export {};
2
+ export { useConfirmation, useCountdown } from "./utils";
package/mobile.js CHANGED
@@ -3,21 +3,23 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var component_mobile = require('./component.mobile.js');
6
+ var utils = require('./utils.js');
6
7
  require('tslib');
7
8
  require('react');
8
9
  require('classnames');
9
10
  require('./components/base-confirmation/component.js');
10
11
  require('@alfalab/hooks');
11
12
  require('./context.js');
12
- require('./utils.js');
13
13
  require('./types.js');
14
14
  require('./components/screens/initial/component.js');
15
- require('@alfalab/core-components-button');
16
- require('@alfalab/core-components-code-input');
15
+ require('@alfalab/core-components-button/mobile');
16
+ require('@alfalab/core-components-code-input/desktop');
17
+ require('@alfalab/core-components-code-input/mobile');
17
18
  require('@alfalab/core-components-link');
18
19
  require('@alfalab/core-components-typography');
19
20
  require('./components/header/component.js');
20
- require('./countdown-section-41f47745.js');
21
+ require('./countdown-section-fb6524aa.js');
22
+ require('@alfalab/core-components-button');
21
23
  require('@alfalab/core-components-loader');
22
24
  require('./components/screens/hint/component.js');
23
25
  require('./components/screens/fatal-error/component.js');
@@ -27,3 +29,5 @@ require('./components/countdown-loader/component.js');
27
29
 
28
30
 
29
31
  exports.ConfirmationMobile = component_mobile.ConfirmationMobile;
32
+ exports.useConfirmation = utils.useConfirmation;
33
+ exports.useCountdown = utils.useCountdown;
@@ -1,5 +1,5 @@
1
1
  import { FC } from 'react';
2
2
  import { ConfirmationProps } from "./types";
3
- type DesktopConfirmationProps = Omit<ConfirmationProps, 'mobile'>;
3
+ type DesktopConfirmationProps = Omit<ConfirmationProps, 'mobile' | 'breakpoint'>;
4
4
  declare const ConfirmationDesktop: FC<DesktopConfirmationProps>;
5
5
  export { DesktopConfirmationProps, ConfirmationDesktop };
@@ -6,12 +6,14 @@ import './context.js';
6
6
  import './utils.js';
7
7
  import './types.js';
8
8
  import './components/screens/initial/component.js';
9
- import '@alfalab/core-components-button/modern';
10
- import '@alfalab/core-components-code-input/modern';
9
+ import '@alfalab/core-components-button/modern/mobile';
10
+ import '@alfalab/core-components-code-input/modern/desktop';
11
+ import '@alfalab/core-components-code-input/modern/mobile';
11
12
  import '@alfalab/core-components-link/modern';
12
13
  import '@alfalab/core-components-typography/modern';
13
14
  import './components/header/component.js';
14
- import './countdown-section-a28d693c.js';
15
+ import './countdown-section-dd4e5fe3.js';
16
+ import '@alfalab/core-components-button/modern';
15
17
  import '@alfalab/core-components-loader/modern';
16
18
  import './components/screens/hint/component.js';
17
19
  import './components/screens/fatal-error/component.js';
@@ -6,19 +6,21 @@ import './context.js';
6
6
  import './utils.js';
7
7
  import './types.js';
8
8
  import './components/screens/initial/component.js';
9
- import '@alfalab/core-components-button/modern';
10
- import '@alfalab/core-components-code-input/modern';
9
+ import '@alfalab/core-components-button/modern/mobile';
10
+ import '@alfalab/core-components-code-input/modern/desktop';
11
+ import '@alfalab/core-components-code-input/modern/mobile';
11
12
  import '@alfalab/core-components-link/modern';
12
13
  import '@alfalab/core-components-typography/modern';
13
14
  import './components/header/component.js';
14
- import './countdown-section-a28d693c.js';
15
+ import './countdown-section-dd4e5fe3.js';
16
+ import '@alfalab/core-components-button/modern';
15
17
  import '@alfalab/core-components-loader/modern';
16
18
  import './components/screens/hint/component.js';
17
19
  import './components/screens/fatal-error/component.js';
18
20
  import './components/screens/temp-block/component.js';
19
21
  import './components/countdown-loader/component.js';
20
22
 
21
- const styles = {"container":"confirmation__container_1gfq6"};
23
+ const styles = {"container":"confirmation__container_hgizz"};
22
24
  require('./mobile.css')
23
25
 
24
26
  const ConfirmationMobile = ({ className, ...resProps }) => (React.createElement(BaseConfirmation, { mobile: true, className: cn(className, styles.container), ...resProps }));
@@ -1,12 +1,11 @@
1
1
  import { FC } from 'react';
2
2
  import { ConfirmationProps } from "./types";
3
- type ResponsiveConfirmationProps = Omit<ConfirmationProps, 'confirmationScreens'> & {
3
+ type ResponsiveConfirmationProps = Omit<ConfirmationProps, 'confirmationScreens' | 'breakpoint'> & {
4
4
  /**
5
5
  * Контрольная точка, с нее начинается desktop версия
6
6
  * @default 1024
7
7
  */
8
8
  breakpoint?: number;
9
9
  };
10
- type ConfirmationMedia = 'desktop' | 'mobile';
11
10
  declare const ConfirmationResponsive: FC<ResponsiveConfirmationProps>;
12
- export { ResponsiveConfirmationProps, ConfirmationMedia, ConfirmationResponsive };
11
+ export { ResponsiveConfirmationProps, ConfirmationResponsive };