@alfalab/core-components-confirmation 12.3.5 → 12.4.1

package/components/screens/initial/index.css

@@ -1,4 +1,4 @@
-/* hash: 194ak */
+/* hash: 1m8z2 */
 :root {
     --color-light-text-primary: #0b1f35;
     --color-light-text-secondary: rgba(11, 31, 53, 0.7);
@@ -38,67 +38,67 @@
 
     /* header */
 }
-.confirmation__component_14vvl {
+.confirmation__component_st3wo {
     display: flex;
     flex-direction: column;
 }
-.confirmation__typographyTheme_14vvl.confirmation__typographyTheme_14vvl {
+.confirmation__typographyTheme_st3wo.confirmation__typographyTheme_st3wo {
     font-size: var(--confirmation-text-font-size);
     line-height: var(--confirmation-text-line-height);
     font-weight: var(--confirmation-text-font-weight);
     font-family: var(--confirmation-text-font-family);
     color: var(--confirmation-text-color);
 }
-.confirmation__phone_14vvl.confirmation__phone_14vvl {
+.confirmation__phone_st3wo.confirmation__phone_st3wo {
     color: var(--color-light-text-primary);
     margin-bottom: var(--gap-2xl);
 }
-.confirmation__compact_14vvl {
+.confirmation__compact_st3wo {
     margin-bottom: var(--gap-xl);
 }
-.confirmation__loaderWrap_14vvl {
+.confirmation__loaderWrap_st3wo {
     display: flex;
     align-items: center;
 }
-.confirmation__left_14vvl {
+.confirmation__left_st3wo {
     align-items: flex-start;
 }
-.confirmation__center_14vvl {
+.confirmation__center_st3wo {
     align-items: center;
     text-align: center
 }
-.confirmation__center_14vvl .confirmation__loaderWrap_14vvl {
+.confirmation__center_st3wo .confirmation__loaderWrap_st3wo {
         justify-content: center;
     }
-.confirmation__center_14vvl input {
+.confirmation__center_st3wo input {
         margin: 0 var(--gap-2xs);
     }
-.confirmation__codeInput_14vvl {
+.confirmation__codeInput_st3wo {
     margin-bottom: var(--gap-s);
 }
-.confirmation__smsComeLink_14vvl.confirmation__smsComeLink_14vvl {
+.confirmation__smsComeLink_st3wo.confirmation__smsComeLink_st3wo {
     font-size: 14px;
     line-height: 20px;
     font-weight: 500;
 }
-.confirmation__countdownContainer_14vvl.confirmation__countdownContainer_14vvl {
+.confirmation__countdownContainer_st3wo.confirmation__countdownContainer_st3wo {
     color: var(--color-light-text-secondary);
     margin-bottom: var(--gap-xl);
 }
-.confirmation__countdownMobile_14vvl.confirmation__countdownMobile_14vvl {
+.confirmation__countdownMobile_st3wo.confirmation__countdownMobile_st3wo {
     margin-bottom: var(--gap-l);
 }
-.confirmation__countdownLoaderMobile_14vvl {
+.confirmation__countdownLoaderMobile_st3wo.confirmation__countdownLoaderMobile_st3wo {
     margin-bottom: var(--gap-m);
 }
-.confirmation__getCodeButton_14vvl {
+.confirmation__getCodeButton_st3wo {
     position: relative;
     top: var(--gap-2xs-neg);
     margin-bottom: var(--gap-m);
 }
-.confirmation__getCodeButtonMobile_14vvl {
+.confirmation__getCodeButtonMobile_st3wo {
     margin-bottom: 0;
 }
-.confirmation__containerInput_14vvl {
+.confirmation__containerInput_st3wo {
     min-height: 80px;
 }

package/components/screens/initial/index.js

@@ -11,7 +11,7 @@ require('@alfalab/hooks');
 require('../../../context.js');
 require('../../../utils.js');
 require('../../header/component.js');
-require('../../../countdown-section-b356354f.js');
+require('../../../countdown-section-b5d05328.js');
 require('@alfalab/core-components-loader');
 
 

package/components/screens/temp-block/component.js

@@ -8,7 +8,12 @@ var utils = require('../../../utils.js');
 var components_countdownLoader_component = require('../../countdown-loader/component.js');
 var components_header_component = require('../../header/component.js');
 
-var styles = {"component":"confirmation__component_ef44y","center":"confirmation__center_ef44y","typographyTheme":"confirmation__typographyTheme_ef44y","description":"confirmation__description_ef44y","countdownWrap":"confirmation__countdownWrap_ef44y","loader":"confirmation__loader_ef44y"};
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+
+var styles = {"component":"confirmation__component_we1qs","center":"confirmation__center_we1qs","typographyTheme":"confirmation__typographyTheme_we1qs","description":"confirmation__description_we1qs","countdownWrap":"confirmation__countdownWrap_we1qs","loader":"confirmation__loader_we1qs"};
 require('./index.css')
 
 var TempBlock = function (_a) {
@@ -24,11 +29,11 @@ var TempBlock = function (_a) {
             onTempBlockFinished();
         }
     }, [timeLeft, onChangeScreen, onTempBlockFinished]);
-    return (React.createElement("div", { className: cn(styles.component, styles[alignContent]) },
-        React.createElement(components_header_component.Header, { mobile: mobile }, texts.tempBlockTitle),
-        React.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', color: 'primary', className: cn(styles.description, (_b = {}, _b[styles.typographyTheme] = !mobile, _b)) }, texts.tempBlockDescription),
-        React.createElement("div", { className: cn(styles.countdownWrap, (_c = {}, _c[styles.typographyTheme] = !mobile, _c)) },
-            React.createElement(components_countdownLoader_component.CountdownLoader, { progress: 1 - timeLeft / tempBlockDuration, className: styles.loader }),
+    return (React__default.default.createElement("div", { className: cn__default.default(styles.component, styles[alignContent]) },
+        React__default.default.createElement(components_header_component.Header, { mobile: mobile }, texts.tempBlockTitle),
+        React__default.default.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', color: 'primary', className: cn__default.default(styles.description, (_b = {}, _b[styles.typographyTheme] = !mobile, _b)) }, texts.tempBlockDescription),
+        React__default.default.createElement("div", { className: cn__default.default(styles.countdownWrap, (_c = {}, _c[styles.typographyTheme] = !mobile, _c)) },
+            React__default.default.createElement(components_countdownLoader_component.CountdownLoader, { progress: 1 - timeLeft / tempBlockDuration, className: styles.loader }),
             utils.formatMsAsMinutes(timeLeft))));
 };
 

package/components/screens/temp-block/index.css

@@ -1,4 +1,4 @@
-/* hash: 1jk8w */
+/* hash: 1gt4x */
 :root {
     --color-light-text-primary: #0b1f35;
 }
@@ -31,28 +31,28 @@
 
     /* header */
 }
-.confirmation__component_ef44y {
+.confirmation__component_we1qs {
     display: flex;
     flex-direction: column;
 }
-.confirmation__center_ef44y {
+.confirmation__center_we1qs {
     align-items: center;
     text-align: center;
 }
-.confirmation__typographyTheme_ef44y.confirmation__typographyTheme_ef44y {
+.confirmation__typographyTheme_we1qs.confirmation__typographyTheme_we1qs {
     font-size: var(--confirmation-text-font-size);
     line-height: var(--confirmation-text-line-height);
     font-weight: var(--confirmation-text-font-weight);
     font-family: var(--confirmation-text-font-family);
     color: var(--confirmation-text-color);
 }
-.confirmation__description_ef44y.confirmation__description_ef44y {
+.confirmation__description_we1qs.confirmation__description_we1qs {
     margin-bottom: var(--gap-xs);
 }
-.confirmation__countdownWrap_ef44y {
+.confirmation__countdownWrap_we1qs {
     display: flex;
     align-items: center;
 }
-.confirmation__loader_ef44y {
+.confirmation__loader_we1qs {
     margin-right: var(--gap-xs);
 }

package/countdown-section-b5d05328.js

@@ -0,0 +1,49 @@
+'use strict';
+
+var React = require('react');
+var cn = require('classnames');
+var coreComponentsButton = require('@alfalab/core-components-button');
+var coreComponentsLoader = require('@alfalab/core-components-loader');
+var coreComponentsTypography = require('@alfalab/core-components-typography');
+var context = require('./context.js');
+var utils = require('./utils.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+
+var styles = {"component":"confirmation__component_st3wo","typographyTheme":"confirmation__typographyTheme_st3wo","phone":"confirmation__phone_st3wo","compact":"confirmation__compact_st3wo","loaderWrap":"confirmation__loaderWrap_st3wo","left":"confirmation__left_st3wo","center":"confirmation__center_st3wo","codeInput":"confirmation__codeInput_st3wo","smsComeLink":"confirmation__smsComeLink_st3wo","countdownContainer":"confirmation__countdownContainer_st3wo","countdownMobile":"confirmation__countdownMobile_st3wo","countdownLoaderMobile":"confirmation__countdownLoaderMobile_st3wo","getCodeButton":"confirmation__getCodeButton_st3wo","getCodeButtonMobile":"confirmation__getCodeButtonMobile_st3wo","containerInput":"confirmation__containerInput_st3wo"};
+require('./components/screens/initial/index.css')
+
+var CountdownSection = function (_a) {
+    var _b, _c;
+    var codeSendHintVisible = _a.codeSendHintVisible, timePassed = _a.timePassed, processing = _a.processing, mobile = _a.mobile, handleSmsRetryClick = _a.handleSmsRetryClick;
+    var _d = React.useContext(context.ConfirmationContext), state = _d.state, texts = _d.texts, timeLeft = _d.timeLeft, blockSmsRetry = _d.blockSmsRetry;
+    var renderText = function (text) {
+        var _a;
+        return (React__default.default.createElement(coreComponentsTypography.Typography.Text, { className: cn__default.default(styles.countdownContainer, (_a = {},
+                _a[styles.countdownMobile] = mobile,
+                _a[styles.typographyTheme] = !mobile,
+                _a)), view: mobile ? 'primary-small' : 'primary-medium', tag: 'div' }, text));
+    };
+    if (codeSendHintVisible)
+        return renderText(texts.codeSended);
+    if (processing) {
+        return (React__default.default.createElement("div", { className: cn__default.default(styles.loaderWrap, styles.countdownContainer, (_b = {},
+                _b[styles.countdownLoaderMobile] = mobile,
+                _b[styles.typographyTheme] = !mobile,
+                _b)) },
+            React__default.default.createElement(coreComponentsLoader.Loader, null),
+            React__default.default.createElement("span", { className: styles.loaderText }, state === 'CODE_CHECKING' ? texts.codeChecking : texts.codeSending)));
+    }
+    if (blockSmsRetry)
+        return renderText(texts.noAttemptsLeft);
+    if (timePassed) {
+        return (React__default.default.createElement(coreComponentsButton.Button, { size: mobile ? 'xs' : 'xxs', view: 'secondary', onClick: handleSmsRetryClick, className: cn__default.default(styles.getCodeButton, (_c = {}, _c[styles.getCodeButtonMobile] = mobile, _c)) }, texts.buttonRetry));
+    }
+    return renderText("".concat(texts.countdown, " ").concat(utils.formatMsAsMinutes(timeLeft)));
+};
+
+exports.CountdownSection = CountdownSection;
+exports.styles = styles;

package/cssm/{component-895f6f86.js → component-3c591970.js}

@@ -12,6 +12,12 @@ var components_screens_fatalError_component = require('./components/screens/fata
 var components_screens_tempBlock_component = require('./components/screens/temp-block/component.js');
 var styles = require('./components/base-confirmation/index.module.css');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
 /******************************************************************************
 Copyright (c) Microsoft Corporation.
 
@@ -115,8 +121,8 @@ var BaseConfirmation = function (_a) {
     };
     var screensMap = getScreensMap ? getScreensMap(confirmationScreens) : confirmationScreens;
     var CurrentScreen = screensMap[screen];
-    return (React.createElement(context.ConfirmationContext.Provider, { value: contextValue },
-        React.createElement("div", { className: cn(styles.component, className), "data-test-id": dataTestId }, CurrentScreen && React.createElement(CurrentScreen, { mobile: mobile }))));
+    return (React__default.default.createElement(context.ConfirmationContext.Provider, { value: contextValue },
+        React__default.default.createElement("div", { className: cn__default.default(styles__default.default.component, className), "data-test-id": dataTestId }, CurrentScreen && React__default.default.createElement(CurrentScreen, { mobile: mobile }))));
 };
 
 exports.BaseConfirmation = BaseConfirmation;

package/cssm/component.desktop.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var components_baseConfirmation_component = require('./component-895f6f86.js');
+var components_baseConfirmation_component = require('./component-3c591970.js');
 var React = require('react');
 require('classnames');
 require('@alfalab/hooks');
@@ -27,6 +27,10 @@ require('./components/countdown-loader/index.module.css');
 require('./components/screens/temp-block/index.module.css');
 require('./components/base-confirmation/index.module.css');
 
-var ConfirmationDesktop = function (props) { return (React.createElement(components_baseConfirmation_component.BaseConfirmation, components_baseConfirmation_component.__assign({}, props))); };
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+var ConfirmationDesktop = function (props) { return (React__default.default.createElement(components_baseConfirmation_component.BaseConfirmation, components_baseConfirmation_component.__assign({}, props))); };
 
 exports.ConfirmationDesktop = ConfirmationDesktop;

package/cssm/component.mobile.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var components_baseConfirmation_component = require('./component-895f6f86.js');
+var components_baseConfirmation_component = require('./component-3c591970.js');
 var React = require('react');
 var cn = require('classnames');
 var styles = require('./mobile.module.css');
@@ -28,9 +28,15 @@ require('./components/countdown-loader/index.module.css');
 require('./components/screens/temp-block/index.module.css');
 require('./components/base-confirmation/index.module.css');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
 var ConfirmationMobile = function (_a) {
     var className = _a.className, resProps = components_baseConfirmation_component.__rest(_a, ["className"]);
-    return (React.createElement(components_baseConfirmation_component.BaseConfirmation, components_baseConfirmation_component.__assign({ mobile: true, className: cn(className, styles.container) }, resProps)));
+    return (React__default.default.createElement(components_baseConfirmation_component.BaseConfirmation, components_baseConfirmation_component.__assign({ mobile: true, className: cn__default.default(className, styles__default.default.container) }, resProps)));
 };
 
 exports.ConfirmationMobile = ConfirmationMobile;

package/cssm/component.responsive.d.ts

@@ -1,6 +1,12 @@
 import { FC } from 'react';
 import { ConfirmationProps } from "./types";
-type ResponsiveConfirmationProps = Omit<ConfirmationProps, 'confirmationScreens'>;
+type ResponsiveConfirmationProps = Omit<ConfirmationProps, 'confirmationScreens'> & {
+    /**
+     * Контрольная точка, с нее начинается desktop версия
+     * @default 1024
+     */
+    breakpoint?: number;
+};
 type ConfirmationMedia = 'desktop' | 'mobile';
 declare const ConfirmationResponsive: FC<ResponsiveConfirmationProps>;
 export { ResponsiveConfirmationProps, ConfirmationMedia, ConfirmationResponsive };

package/cssm/component.responsive.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var components_baseConfirmation_component = require('./component-895f6f86.js');
+var components_baseConfirmation_component = require('./component-3c591970.js');
 var React = require('react');
 var hooks = require('@alfalab/hooks');
 var component_desktop = require('./component.desktop.js');
@@ -30,12 +30,17 @@ require('./components/screens/temp-block/index.module.css');
 require('./components/base-confirmation/index.module.css');
 require('./mobile.module.css');
 
-var ConfirmationResponsive = function (props) {
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+var ConfirmationResponsive = function (_a) {
+    var _b = _a.breakpoint, breakpoint = _b === void 0 ? 1024 : _b, restProps = components_baseConfirmation_component.__rest(_a, ["breakpoint"]);
     var view = hooks.useMedia([
-        ['mobile', '(max-width: 1023px)'],
-        ['desktop', '(min-width: 1024px)'],
+        ['mobile', "(max-width: ".concat(breakpoint - 1, "px)")],
+        ['desktop', "(min-width: ".concat(breakpoint, "px)")],
     ], 'desktop')[0];
-    return view === 'desktop' ? (React.createElement(component_desktop.ConfirmationDesktop, components_baseConfirmation_component.__assign({}, props))) : (React.createElement(component_mobile.ConfirmationMobile, components_baseConfirmation_component.__assign({}, props)));
+    return view === 'desktop' ? (React__default.default.createElement(component_desktop.ConfirmationDesktop, components_baseConfirmation_component.__assign({}, restProps))) : (React__default.default.createElement(component_mobile.ConfirmationMobile, components_baseConfirmation_component.__assign({}, restProps)));
 };
 
 exports.ConfirmationResponsive = ConfirmationResponsive;

package/cssm/components/base-confirmation/component.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var components_baseConfirmation_component = require('../../component-895f6f86.js');
+var components_baseConfirmation_component = require('../../component-3c591970.js');
 require('react');
 require('classnames');
 require('@alfalab/hooks');

package/cssm/components/base-confirmation/index.d.ts

@@ -1 +1 @@
-export * from "../../component-895f6f86";
+export * from "../../component-3c591970";

package/cssm/components/base-confirmation/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var components_baseConfirmation_component = require('../../component-895f6f86.js');
+var components_baseConfirmation_component = require('../../component-3c591970.js');
 require('react');
 require('classnames');
 require('@alfalab/hooks');

package/cssm/components/countdown-loader/component.js

@@ -3,6 +3,11 @@
 var React = require('react');
 var styles = require('./index.module.css');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
 var SIZE = 16;
 var STROKE_WIDTH = 2;
 var CENTER = SIZE / 2;
@@ -14,8 +19,8 @@ var CountdownLoader = function (_a) {
     var value = Math.min(progress, 1);
     var strokeDasharray = CIRCUMFERENCE.toFixed(2);
     var strokeDashoffset = (value * CIRCUMFERENCE).toFixed(2);
-    return (React.createElement("svg", { width: SIZE, height: SIZE, viewBox: "0 0 ".concat(SIZE, " ").concat(SIZE), className: className },
-        React.createElement("circle", { cx: CENTER, cy: CENTER, r: RADIUS, strokeDasharray: strokeDasharray, strokeDashoffset: strokeDashoffset, transform: "rotate(-90 ".concat(CENTER, " ").concat(CENTER, ")"), className: styles.circle })));
+    return (React__default.default.createElement("svg", { width: SIZE, height: SIZE, viewBox: "0 0 ".concat(SIZE, " ").concat(SIZE), className: className },
+        React__default.default.createElement("circle", { cx: CENTER, cy: CENTER, r: RADIUS, strokeDasharray: strokeDasharray, strokeDashoffset: strokeDashoffset, transform: "rotate(-90 ".concat(CENTER, " ").concat(CENTER, ")"), className: styles__default.default.circle })));
 };
 
 exports.CountdownLoader = CountdownLoader;

package/cssm/components/header/component.js

@@ -5,10 +5,16 @@ var cn = require('classnames');
 var coreComponentsTypography = require('@alfalab/core-components-typography/cssm');
 var styles = require('./index.module.css');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
 var Header = function (_a) {
     var _b;
     var mobile = _a.mobile, children = _a.children;
-    return (React.createElement(coreComponentsTypography.Typography.Title, { className: cn(styles.header, styles.typography, (_b = {}, _b[styles.typographyMobile] = mobile, _b)), tag: 'h3', color: 'primary' }, children));
+    return (React__default.default.createElement(coreComponentsTypography.Typography.Title, { className: cn__default.default(styles__default.default.header, styles__default.default.typography, (_b = {}, _b[styles__default.default.typographyMobile] = mobile, _b)), tag: 'h3', color: 'primary' }, children));
 };
 
 exports.Header = Header;

package/cssm/components/screens/fatal-error/component.js

@@ -10,14 +10,20 @@ var styles = require('./index.module.css');
 require('../../../utils.js');
 require('../../header/index.module.css');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
 var FatalError = function (_a) {
     var _b;
     var mobile = _a.mobile;
     var _c = React.useContext(context.ConfirmationContext), alignContent = _c.alignContent, texts = _c.texts, onFatalErrorOkButtonClick = _c.onFatalErrorOkButtonClick;
-    return (React.createElement("div", { className: cn(styles.component, styles[alignContent]) },
-        React.createElement(components_header_component.Header, { mobile: mobile }, texts.fatalErrorTitle),
-        React.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', color: 'primary', className: cn((_b = {}, _b[styles.typographyTheme] = !mobile, _b)) }, texts.fatalErrorDescription),
-        React.createElement(coreComponentsButton.Button, { size: mobile ? 'xs' : 's', view: 'secondary', onClick: onFatalErrorOkButtonClick, className: styles.button }, texts.fatalErrorButton)));
+    return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.component, styles__default.default[alignContent]) },
+        React__default.default.createElement(components_header_component.Header, { mobile: mobile }, texts.fatalErrorTitle),
+        React__default.default.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', color: 'primary', className: cn__default.default((_b = {}, _b[styles__default.default.typographyTheme] = !mobile, _b)) }, texts.fatalErrorDescription),
+        React__default.default.createElement(coreComponentsButton.Button, { size: mobile ? 'xs' : 's', view: 'secondary', onClick: onFatalErrorOkButtonClick, className: styles__default.default.button }, texts.fatalErrorButton)));
 };
 
 exports.FatalError = FatalError;

package/cssm/components/screens/hint/component.js

@@ -11,6 +11,12 @@ var styles = require('./index.module.css');
 require('../../../utils.js');
 require('../../header/index.module.css');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
 var Hint = function (_a) {
     var _b, _c, _d, _e, _f, _g;
     var mobile = _a.mobile;
@@ -19,22 +25,22 @@ var Hint = function (_a) {
         onChangeScreen('INITIAL');
         onChangeState('INITIAL');
     };
-    return (React.createElement("div", { className: cn(styles.component, styles[alignContent]) },
-        React.createElement(components_header_component.Header, { mobile: mobile }, "\u041D\u0435\u00A0\u043F\u0440\u0438\u0445\u043E\u0434\u0438\u0442 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435?"),
-        React.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', color: 'primary', className: cn(styles.text, (_b = {}, _b[styles.typographyTheme] = !mobile, _b)) }, "\u0415\u0441\u043B\u0438 \u0443\u00A0\u0432\u0430\u0441 \u0438\u0437\u043C\u0435\u043D\u0438\u043B\u0441\u044F \u043D\u043E\u043C\u0435\u0440 \u0442\u0435\u043B\u0435\u0444\u043E\u043D\u0430, \u043F\u043E\u0437\u0432\u043E\u043D\u0438\u0442\u0435 \u043D\u0430\u043C \u0438\u043B\u0438 \u043E\u0431\u0440\u0430\u0442\u0438\u0442\u0435\u0441\u044C \u0432\u00A0\u043B\u044E\u0431\u043E\u0435 \u043E\u0442\u0434\u0435\u043B\u0435\u043D\u0438\u0435 \u0431\u0430\u043D\u043A\u0430."),
-        React.createElement("div", { className: styles.phonesWrap },
-            React.createElement("div", { className: cn(styles.phoneWrap, (_c = {}, _c[styles.phoneContentMobile] = mobile, _c)) },
-                React.createElement(coreComponentsLink.Link, { href: 'tel:+78002000000', underline: false, className: styles.phoneLink }, "8 800 200-00-00"),
-                React.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', color: 'primary', className: cn(styles.text, (_d = {}, _d[styles.typographyTheme] = !mobile, _d)) }, mobile
+    return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.component, styles__default.default[alignContent]) },
+        React__default.default.createElement(components_header_component.Header, { mobile: mobile }, "\u041D\u0435\u00A0\u043F\u0440\u0438\u0445\u043E\u0434\u0438\u0442 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435?"),
+        React__default.default.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', color: 'primary', className: cn__default.default(styles__default.default.text, (_b = {}, _b[styles__default.default.typographyTheme] = !mobile, _b)) }, "\u0415\u0441\u043B\u0438 \u0443\u00A0\u0432\u0430\u0441 \u0438\u0437\u043C\u0435\u043D\u0438\u043B\u0441\u044F \u043D\u043E\u043C\u0435\u0440 \u0442\u0435\u043B\u0435\u0444\u043E\u043D\u0430, \u043F\u043E\u0437\u0432\u043E\u043D\u0438\u0442\u0435 \u043D\u0430\u043C \u0438\u043B\u0438 \u043E\u0431\u0440\u0430\u0442\u0438\u0442\u0435\u0441\u044C \u0432\u00A0\u043B\u044E\u0431\u043E\u0435 \u043E\u0442\u0434\u0435\u043B\u0435\u043D\u0438\u0435 \u0431\u0430\u043D\u043A\u0430."),
+        React__default.default.createElement("div", { className: styles__default.default.phonesWrap },
+            React__default.default.createElement("div", { className: cn__default.default(styles__default.default.phoneWrap, (_c = {}, _c[styles__default.default.phoneContentMobile] = mobile, _c)) },
+                React__default.default.createElement(coreComponentsLink.Link, { href: 'tel:+78002000000', underline: false, className: styles__default.default.phoneLink }, "8 800 200-00-00"),
+                React__default.default.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', color: 'primary', className: cn__default.default(styles__default.default.text, (_d = {}, _d[styles__default.default.typographyTheme] = !mobile, _d)) }, mobile
                     ? 'Для\u00A0 звонков по\u00A0России'
                     : ' \u2014\u00A0для звонков по\u00A0России')),
-            React.createElement("div", { className: cn(styles.phoneWrap, (_e = {}, _e[styles.phoneContentMobile] = mobile, _e)) },
-                React.createElement(coreComponentsLink.Link, { href: 'tel:+74957888878', underline: false, className: styles.phoneLink }, "+7 495 78-888-78"),
-                React.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', color: 'primary', className: cn(styles.text, (_f = {}, _f[styles.typographyTheme] = !mobile, _f)) }, mobile
+            React__default.default.createElement("div", { className: cn__default.default(styles__default.default.phoneWrap, (_e = {}, _e[styles__default.default.phoneContentMobile] = mobile, _e)) },
+                React__default.default.createElement(coreComponentsLink.Link, { href: 'tel:+74957888878', underline: false, className: styles__default.default.phoneLink }, "+7 495 78-888-78"),
+                React__default.default.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', color: 'primary', className: cn__default.default(styles__default.default.text, (_f = {}, _f[styles__default.default.typographyTheme] = !mobile, _f)) }, mobile
                     ? 'В\u00A0Москве и\u00A0за\u00A0границей'
                     : ' \u2014\u00A0в\u00A0Москве и\u00A0за\u00A0границей'))),
-        React.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', color: 'primary', className: cn(styles.text, (_g = {}, _g[styles.typographyTheme] = !mobile, _g)) }, "\u0415\u0441\u043B\u0438 \u043D\u043E\u043C\u0435\u0440 \u043D\u0435\u00A0\u043C\u0435\u043D\u044F\u043B\u0441\u044F, \u0432\u043E\u0437\u043C\u043E\u0436\u043D\u043E, \u043F\u0435\u0440\u0435\u0433\u0440\u0443\u0436\u0435\u043D \u0441\u0435\u0440\u0432\u0438\u0441 \u043E\u0442\u043F\u0440\u0430\u0432\u043A\u0438 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0439. \u041F\u043E\u043F\u0440\u043E\u0431\u0443\u0439\u0442\u0435 \u043F\u043E\u0432\u0442\u043E\u0440\u0438\u0442\u044C \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0447\u0435\u0440\u0435\u0437 \u043D\u0435\u0441\u043A\u043E\u043B\u044C\u043A\u043E \u043C\u0438\u043D\u0443\u0442."),
-        React.createElement(coreComponentsButton.Button, { size: mobile ? 'xs' : 's', view: 'secondary', onClick: handleReturnButtonClick, className: styles.hintButton }, texts.hintButton)));
+        React__default.default.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', color: 'primary', className: cn__default.default(styles__default.default.text, (_g = {}, _g[styles__default.default.typographyTheme] = !mobile, _g)) }, "\u0415\u0441\u043B\u0438 \u043D\u043E\u043C\u0435\u0440 \u043D\u0435\u00A0\u043C\u0435\u043D\u044F\u043B\u0441\u044F, \u0432\u043E\u0437\u043C\u043E\u0436\u043D\u043E, \u043F\u0435\u0440\u0435\u0433\u0440\u0443\u0436\u0435\u043D \u0441\u0435\u0440\u0432\u0438\u0441 \u043E\u0442\u043F\u0440\u0430\u0432\u043A\u0438 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0439. \u041F\u043E\u043F\u0440\u043E\u0431\u0443\u0439\u0442\u0435 \u043F\u043E\u0432\u0442\u043E\u0440\u0438\u0442\u044C \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0447\u0435\u0440\u0435\u0437 \u043D\u0435\u0441\u043A\u043E\u043B\u044C\u043A\u043E \u043C\u0438\u043D\u0443\u0442."),
+        React__default.default.createElement(coreComponentsButton.Button, { size: mobile ? 'xs' : 's', view: 'secondary', onClick: handleReturnButtonClick, className: styles__default.default.hintButton }, texts.hintButton)));
 };
 
 exports.Hint = Hint;

package/cssm/components/screens/initial/component.js

@@ -15,6 +15,12 @@ require('../../../utils.js');
 require('../../header/index.module.css');
 require('@alfalab/core-components-loader/cssm');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
 var CODE_SEND_HINT_VISIBLE_DURATION = 2000;
 var Initial = function (_a) {
     var _b;
@@ -85,14 +91,14 @@ var Initial = function (_a) {
     };
     var processing = ['CODE_CHECKING', 'CODE_SENDING'].includes(state);
     var timePassed = timeLeft === 0;
-    return (React.createElement("div", { className: cn(styles.component, styles[alignContent]) },
-        React.createElement(components_header_component.Header, { mobile: mobile }, texts.title),
-        React.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', color: 'primary', className: cn(styles.phone, (_b = {}, _b[styles.typographyTheme] = !mobile, _b)) },
+    return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.component, styles__default.default[alignContent]) },
+        React__default.default.createElement(components_header_component.Header, { mobile: mobile }, texts.title),
+        React__default.default.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', color: 'primary', className: cn__default.default(styles__default.default.phone, (_b = {}, _b[styles__default.default.typographyTheme] = !mobile, _b)) },
             "\u041A\u043E\u0434 \u043E\u0442\u043F\u0440\u0430\u0432\u043B\u0435\u043D \u043D\u0430 ",
             phone),
-        React.createElement(coreComponentsCodeInput.CodeInput, { disabled: processing, error: getCodeInputError(), ref: inputRef, fields: requiredCharAmount, className: cn(styles.containerInput, styles.codeInput), onComplete: handleInputComplete, onChange: handleInputChange, clearCodeOnError: clearCodeOnError, onErrorAnimationEnd: handleErrorAnimationEnd }),
-        React.createElement(components_screens_initial_countdownSection.CountdownSection, { processing: processing, timePassed: timePassed, codeSendHintVisible: codeSendHintVisible, handleSmsRetryClick: handleSmsRetryClick, mobile: mobile }),
-        mobile ? (React.createElement(coreComponentsButton.Button, { onClick: handleSmsHintLinkClick, view: 'link', size: 'xs' }, texts.linkToHint)) : (React.createElement(coreComponentsLink.Link, { onClick: handleSmsHintLinkClick, className: styles.smsComeLink, view: mobile ? 'primary' : 'secondary', pseudo: true }, texts.linkToHint))));
+        React__default.default.createElement(coreComponentsCodeInput.CodeInput, { disabled: processing, error: getCodeInputError(), ref: inputRef, fields: requiredCharAmount, className: cn__default.default(styles__default.default.containerInput, styles__default.default.codeInput), onComplete: handleInputComplete, onChange: handleInputChange, clearCodeOnError: clearCodeOnError, onErrorAnimationEnd: handleErrorAnimationEnd }),
+        React__default.default.createElement(components_screens_initial_countdownSection.CountdownSection, { processing: processing, timePassed: timePassed, codeSendHintVisible: codeSendHintVisible, handleSmsRetryClick: handleSmsRetryClick, mobile: mobile }),
+        mobile ? (React__default.default.createElement(coreComponentsButton.Button, { onClick: handleSmsHintLinkClick, view: 'link', size: 'xs' }, texts.linkToHint)) : (React__default.default.createElement(coreComponentsLink.Link, { onClick: handleSmsHintLinkClick, className: styles__default.default.smsComeLink, view: mobile ? 'primary' : 'secondary', pseudo: true }, texts.linkToHint))));
 };
 
 exports.Initial = Initial;

package/cssm/components/screens/initial/countdown-section.js

@@ -9,31 +9,37 @@ var context = require('../../../context.js');
 var utils = require('../../../utils.js');
 var styles = require('./index.module.css');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
 var CountdownSection = function (_a) {
     var _b, _c;
     var codeSendHintVisible = _a.codeSendHintVisible, timePassed = _a.timePassed, processing = _a.processing, mobile = _a.mobile, handleSmsRetryClick = _a.handleSmsRetryClick;
     var _d = React.useContext(context.ConfirmationContext), state = _d.state, texts = _d.texts, timeLeft = _d.timeLeft, blockSmsRetry = _d.blockSmsRetry;
     var renderText = function (text) {
         var _a;
-        return (React.createElement(coreComponentsTypography.Typography.Text, { className: cn(styles.countdownContainer, (_a = {},
-                _a[styles.countdownMobile] = mobile,
-                _a[styles.typographyTheme] = !mobile,
+        return (React__default.default.createElement(coreComponentsTypography.Typography.Text, { className: cn__default.default(styles__default.default.countdownContainer, (_a = {},
+                _a[styles__default.default.countdownMobile] = mobile,
+                _a[styles__default.default.typographyTheme] = !mobile,
                 _a)), view: mobile ? 'primary-small' : 'primary-medium', tag: 'div' }, text));
     };
     if (codeSendHintVisible)
         return renderText(texts.codeSended);
     if (processing) {
-        return (React.createElement("div", { className: cn(styles.loaderWrap, styles.countdownContainer, (_b = {},
-                _b[styles.countdownLoaderMobile] = mobile,
-                _b[styles.typographyTheme] = !mobile,
+        return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.loaderWrap, styles__default.default.countdownContainer, (_b = {},
+                _b[styles__default.default.countdownLoaderMobile] = mobile,
+                _b[styles__default.default.typographyTheme] = !mobile,
                 _b)) },
-            React.createElement(coreComponentsLoader.Loader, null),
-            React.createElement("span", { className: styles.loaderText }, state === 'CODE_CHECKING' ? texts.codeChecking : texts.codeSending)));
+            React__default.default.createElement(coreComponentsLoader.Loader, null),
+            React__default.default.createElement("span", { className: styles__default.default.loaderText }, state === 'CODE_CHECKING' ? texts.codeChecking : texts.codeSending)));
     }
     if (blockSmsRetry)
         return renderText(texts.noAttemptsLeft);
     if (timePassed) {
-        return (React.createElement(coreComponentsButton.Button, { size: mobile ? 'xs' : 'xxs', view: 'secondary', onClick: handleSmsRetryClick, className: cn(styles.getCodeButton, (_c = {}, _c[styles.getCodeButtonMobile] = mobile, _c)) }, texts.buttonRetry));
+        return (React__default.default.createElement(coreComponentsButton.Button, { size: mobile ? 'xs' : 'xxs', view: 'secondary', onClick: handleSmsRetryClick, className: cn__default.default(styles__default.default.getCodeButton, (_c = {}, _c[styles__default.default.getCodeButtonMobile] = mobile, _c)) }, texts.buttonRetry));
     }
     return renderText("".concat(texts.countdown, " ").concat(utils.formatMsAsMinutes(timeLeft)));
 };

package/cssm/components/screens/initial/index.module.css

@@ -87,7 +87,7 @@
 .countdownMobile.countdownMobile {
     margin-bottom: var(--gap-l);
 }
-.countdownLoaderMobile {
+.countdownLoaderMobile.countdownLoaderMobile {
     margin-bottom: var(--gap-m);
 }
 .getCodeButton {