@alfalab/core-components 45.9.0-beta.0 → 45.9.0-beta.1

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

@@ -1,31 +1,39 @@
-import React, { useContext, useEffect } from 'react';
-import cn from 'classnames';
-import { Typography } from '../../../../../typography/cssm';
-import { ConfirmationContext } from '../../../context.js';
-import { useCountdown, formatMsAsMinutes } from '../../../utils.js';
-import { CountdownLoader } from '../../countdown-loader/component.js';
-import { Header } from '../../header/component.js';
-import styles from './index.module.css';
-import '../../countdown-loader/index.module.css';
-import '../../header/index.module.css';
+Object.defineProperty(exports, '__esModule', { value: true });
 
-const TempBlock = ({ mobile }) => {
-    const { alignContent, texts, tempBlockDuration, onChangeScreen, onTempBlockFinished } = useContext(ConfirmationContext);
-    const [timeLeft, startTimer] = useCountdown(tempBlockDuration);
-    useEffect(() => {
+var React = require('react');
+var cn = require('classnames');
+var coreComponentsTypography = require('../../../../../typography/cssm');
+var context = require('../../../context.js');
+var utils = require('../../../utils.js');
+var components_countdownLoader_component = require('../../countdown-loader/component.js');
+var components_header_component = require('../../header/component.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 TempBlock = function (_a) {
+    var _b, _c;
+    var mobile = _a.mobile;
+    var _d = React.useContext(context.ConfirmationContext), alignContent = _d.alignContent, texts = _d.texts, tempBlockDuration = _d.tempBlockDuration, onChangeScreen = _d.onChangeScreen, onTempBlockFinished = _d.onTempBlockFinished;
+    var _e = utils.useCountdown(tempBlockDuration), timeLeft = _e[0], startTimer = _e[1];
+    React.useEffect(function () {
         startTimer();
     }, [startTimer]);
-    useEffect(() => {
+    React.useEffect(function () {
         if (timeLeft === 0 && onTempBlockFinished) {
             onTempBlockFinished();
         }
     }, [timeLeft, onChangeScreen, onTempBlockFinished]);
-    return (React.createElement("div", { className: cn(styles.component, styles[alignContent]) },
-        React.createElement(Header, { mobile: mobile }, texts.tempBlockTitle),
-        React.createElement(Typography.Text, { view: 'primary-medium', color: 'primary', className: cn(styles.description, { [styles.typographyTheme]: !mobile }) }, texts.tempBlockDescription),
-        React.createElement("div", { className: cn(styles.countdownWrap, { [styles.typographyTheme]: !mobile }) },
-            React.createElement(CountdownLoader, { progress: 1 - timeLeft / tempBlockDuration, className: styles.loader }),
-            formatMsAsMinutes(timeLeft))));
+    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.tempBlockTitle),
+        React__default.default.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', color: 'primary', className: cn__default.default(styles__default.default.description, (_b = {}, _b[styles__default.default.typographyTheme] = !mobile, _b)) }, texts.tempBlockDescription),
+        React__default.default.createElement("div", { className: cn__default.default(styles__default.default.countdownWrap, (_c = {}, _c[styles__default.default.typographyTheme] = !mobile, _c)) },
+            React__default.default.createElement(components_countdownLoader_component.CountdownLoader, { progress: 1 - timeLeft / tempBlockDuration, className: styles__default.default.loader }),
+            utils.formatMsAsMinutes(timeLeft))));
 };
 
-export { TempBlock };
+exports.TempBlock = TempBlock;

package/confirmation/cssm/components/screens/temp-block/index.js

@@ -1,11 +1,7 @@
-export { TempBlock } from './component.js';
-import 'react';
-import 'classnames';
-import '../../../../../typography/cssm';
-import '../../../context.js';
-import '../../../utils.js';
-import '../../countdown-loader/component.js';
-import '../../countdown-loader/index.module.css';
-import '../../header/component.js';
-import '../../header/index.module.css';
-import './index.module.css';
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var components_screens_tempBlock_component = require('./component.js');
+
+
+
+exports.TempBlock = components_screens_tempBlock_component.TempBlock;

package/confirmation/cssm/context.js

@@ -1,16 +1,18 @@
-import { createContext } from 'react';
-import { ONE_MINUTE, ONE_DAY } from './utils.js';
+Object.defineProperty(exports, '__esModule', { value: true });
 
-const mockFn = () => undefined;
-const ConfirmationContext = createContext({
+var React = require('react');
+var utils = require('./utils.js');
+
+var mockFn = function () { return undefined; };
+var ConfirmationContext = React.createContext({
     alignContent: 'left',
     texts: {},
     state: 'INITIAL',
     screen: 'INITIAL',
     requiredCharAmount: 5,
-    countdownDuration: ONE_MINUTE,
-    timeLeft: ONE_MINUTE,
-    tempBlockDuration: ONE_DAY,
+    countdownDuration: utils.ONE_MINUTE,
+    timeLeft: utils.ONE_MINUTE,
+    tempBlockDuration: utils.ONE_DAY,
     phone: '',
     hideCountdownSection: false,
     breakpoint: 1024,
@@ -23,4 +25,4 @@ const ConfirmationContext = createContext({
     onFatalErrorOkButtonClick: mockFn,
 });
 
-export { ConfirmationContext };
+exports.ConfirmationContext = ConfirmationContext;

package/confirmation/cssm/desktop/component.desktop.js

@@ -1,32 +1,13 @@
-import React from 'react';
-import { BaseConfirmation } from '../components/base-confirmation/component.js';
-import 'classnames';
-import '@alfalab/hooks';
-import '../context.js';
-import '../utils.js';
-import '../types.js';
-import '../components/screens/initial/component.js';
-import '../../../button/cssm/mobile';
-import '../../../code-input/cssm/desktop';
-import '../../../code-input/cssm/mobile';
-import '../../../link/cssm';
-import '../../../typography/cssm';
-import '../components/header/component.js';
-import '../components/header/index.module.css';
-import '../components/screens/initial/countdown-section.js';
-import '../../../button/cssm';
-import '../../../spinner/cssm';
-import '../components/screens/initial/index.module.css';
-import '../components/screens/hint/component.js';
-import '../components/screens/hint/index.module.css';
-import '../components/screens/fatal-error/component.js';
-import '../components/screens/fatal-error/index.module.css';
-import '../components/screens/temp-block/component.js';
-import '../components/countdown-loader/component.js';
-import '../components/countdown-loader/index.module.css';
-import '../components/screens/temp-block/index.module.css';
-import '../components/base-confirmation/index.module.css';
+Object.defineProperty(exports, '__esModule', { value: true });
 
-const ConfirmationDesktop = (props) => (React.createElement(BaseConfirmation, { ...props }));
+var tslib = require('tslib');
+var React = require('react');
+var components_baseConfirmation_component = require('../components/base-confirmation/component.js');
 
-export { ConfirmationDesktop };
+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, tslib.__assign({}, props))); };
+
+exports.ConfirmationDesktop = ConfirmationDesktop;

package/confirmation/cssm/desktop/index.js

@@ -1,29 +1,10 @@
-export { ConfirmationDesktop } from './component.desktop.js';
-export { useConfirmation, useCountdown } from '../utils.js';
-import 'react';
-import '../components/base-confirmation/component.js';
-import 'classnames';
-import '@alfalab/hooks';
-import '../context.js';
-import '../types.js';
-import '../components/screens/initial/component.js';
-import '../../../button/cssm/mobile';
-import '../../../code-input/cssm/desktop';
-import '../../../code-input/cssm/mobile';
-import '../../../link/cssm';
-import '../../../typography/cssm';
-import '../components/header/component.js';
-import '../components/header/index.module.css';
-import '../components/screens/initial/countdown-section.js';
-import '../../../button/cssm';
-import '../../../spinner/cssm';
-import '../components/screens/initial/index.module.css';
-import '../components/screens/hint/component.js';
-import '../components/screens/hint/index.module.css';
-import '../components/screens/fatal-error/component.js';
-import '../components/screens/fatal-error/index.module.css';
-import '../components/screens/temp-block/component.js';
-import '../components/countdown-loader/component.js';
-import '../components/countdown-loader/index.module.css';
-import '../components/screens/temp-block/index.module.css';
-import '../components/base-confirmation/index.module.css';
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var desktop_component_desktop = require('./component.desktop.js');
+var utils = require('../utils.js');
+
+
+
+exports.ConfirmationDesktop = desktop_component_desktop.ConfirmationDesktop;
+exports.useConfirmation = utils.useConfirmation;
+exports.useCountdown = utils.useCountdown;

package/confirmation/cssm/index.js

@@ -1,33 +1,10 @@
-export { ConfirmationResponsive as Confirmation } from './component.responsive.js';
-export { useConfirmation, useCountdown } from './utils.js';
-import 'react';
-import '../../mq/cssm';
-import './desktop/component.desktop.js';
-import './components/base-confirmation/component.js';
-import 'classnames';
-import '@alfalab/hooks';
-import './context.js';
-import './types.js';
-import './components/screens/initial/component.js';
-import '../../button/cssm/mobile';
-import '../../code-input/cssm/desktop';
-import '../../code-input/cssm/mobile';
-import '../../link/cssm';
-import '../../typography/cssm';
-import './components/header/component.js';
-import './components/header/index.module.css';
-import './components/screens/initial/countdown-section.js';
-import '../../button/cssm';
-import '../../spinner/cssm';
-import './components/screens/initial/index.module.css';
-import './components/screens/hint/component.js';
-import './components/screens/hint/index.module.css';
-import './components/screens/fatal-error/component.js';
-import './components/screens/fatal-error/index.module.css';
-import './components/screens/temp-block/component.js';
-import './components/countdown-loader/component.js';
-import './components/countdown-loader/index.module.css';
-import './components/screens/temp-block/index.module.css';
-import './components/base-confirmation/index.module.css';
-import './mobile/component.mobile.js';
-import './mobile/mobile.module.css';
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var component_responsive = require('./component.responsive.js');
+var utils = require('./utils.js');
+
+
+
+exports.Confirmation = component_responsive.ConfirmationResponsive;
+exports.useConfirmation = utils.useConfirmation;
+exports.useCountdown = utils.useCountdown;

package/confirmation/cssm/mobile/component.mobile.js

@@ -1,33 +1,20 @@
-import React from 'react';
-import cn from 'classnames';
-import { BaseConfirmation } from '../components/base-confirmation/component.js';
-import styles from './mobile.module.css';
-import '@alfalab/hooks';
-import '../context.js';
-import '../utils.js';
-import '../types.js';
-import '../components/screens/initial/component.js';
-import '../../../button/cssm/mobile';
-import '../../../code-input/cssm/desktop';
-import '../../../code-input/cssm/mobile';
-import '../../../link/cssm';
-import '../../../typography/cssm';
-import '../components/header/component.js';
-import '../components/header/index.module.css';
-import '../components/screens/initial/countdown-section.js';
-import '../../../button/cssm';
-import '../../../spinner/cssm';
-import '../components/screens/initial/index.module.css';
-import '../components/screens/hint/component.js';
-import '../components/screens/hint/index.module.css';
-import '../components/screens/fatal-error/component.js';
-import '../components/screens/fatal-error/index.module.css';
-import '../components/screens/temp-block/component.js';
-import '../components/countdown-loader/component.js';
-import '../components/countdown-loader/index.module.css';
-import '../components/screens/temp-block/index.module.css';
-import '../components/base-confirmation/index.module.css';
+Object.defineProperty(exports, '__esModule', { value: true });
 
-const ConfirmationMobile = ({ className, ...resProps }) => (React.createElement(BaseConfirmation, { mobile: true, className: cn(className, styles.container), ...resProps }));
+var tslib = require('tslib');
+var React = require('react');
+var cn = require('classnames');
+var components_baseConfirmation_component = require('../components/base-confirmation/component.js');
+var styles = require('./mobile.module.css');
 
-export { ConfirmationMobile };
+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 = tslib.__rest(_a, ["className"]);
+    return (React__default.default.createElement(components_baseConfirmation_component.BaseConfirmation, tslib.__assign({ mobile: true, className: cn__default.default(className, styles__default.default.container) }, resProps)));
+};
+
+exports.ConfirmationMobile = ConfirmationMobile;

package/confirmation/cssm/mobile/index.js

@@ -1,30 +1,10 @@
-export { ConfirmationMobile } from './component.mobile.js';
-export { useConfirmation, useCountdown } from '../utils.js';
-import 'react';
-import 'classnames';
-import '../components/base-confirmation/component.js';
-import '@alfalab/hooks';
-import '../context.js';
-import '../types.js';
-import '../components/screens/initial/component.js';
-import '../../../button/cssm/mobile';
-import '../../../code-input/cssm/desktop';
-import '../../../code-input/cssm/mobile';
-import '../../../link/cssm';
-import '../../../typography/cssm';
-import '../components/header/component.js';
-import '../components/header/index.module.css';
-import '../components/screens/initial/countdown-section.js';
-import '../../../button/cssm';
-import '../../../spinner/cssm';
-import '../components/screens/initial/index.module.css';
-import '../components/screens/hint/component.js';
-import '../components/screens/hint/index.module.css';
-import '../components/screens/fatal-error/component.js';
-import '../components/screens/fatal-error/index.module.css';
-import '../components/screens/temp-block/component.js';
-import '../components/countdown-loader/component.js';
-import '../components/countdown-loader/index.module.css';
-import '../components/screens/temp-block/index.module.css';
-import '../components/base-confirmation/index.module.css';
-import './mobile.module.css';
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var mobile_component_mobile = require('./component.mobile.js');
+var utils = require('../utils.js');
+
+
+
+exports.ConfirmationMobile = mobile_component_mobile.ConfirmationMobile;
+exports.useConfirmation = utils.useConfirmation;
+exports.useCountdown = utils.useCountdown;

package/confirmation/cssm/shared/index.js

@@ -1,26 +1,23 @@
-export { Initial } from '../components/screens/initial/component.js';
-export { Hint } from '../components/screens/hint/component.js';
-export { FatalError } from '../components/screens/fatal-error/component.js';
-export { TempBlock } from '../components/screens/temp-block/component.js';
-export { CountdownLoader } from '../components/countdown-loader/component.js';
-export { ConfirmationContext } from '../context.js';
-export { defaultTexts } from '../types.js';
-export { ONE_DAY, ONE_MINUTE, formatMsAsMinutes } from '../utils.js';
-import 'react';
-import 'classnames';
-import '../../../button/cssm/mobile';
-import '../../../code-input/cssm/desktop';
-import '../../../code-input/cssm/mobile';
-import '../../../link/cssm';
-import '../../../typography/cssm';
-import '@alfalab/hooks';
-import '../components/header/component.js';
-import '../components/header/index.module.css';
-import '../components/screens/initial/countdown-section.js';
-import '../../../button/cssm';
-import '../../../spinner/cssm';
-import '../components/screens/initial/index.module.css';
-import '../components/screens/hint/index.module.css';
-import '../components/screens/fatal-error/index.module.css';
-import '../components/screens/temp-block/index.module.css';
-import '../components/countdown-loader/index.module.css';
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var components_screens_initial_component = require('../components/screens/initial/component.js');
+var components_screens_hint_component = require('../components/screens/hint/component.js');
+var components_screens_fatalError_component = require('../components/screens/fatal-error/component.js');
+var components_screens_tempBlock_component = require('../components/screens/temp-block/component.js');
+var components_countdownLoader_component = require('../components/countdown-loader/component.js');
+var context = require('../context.js');
+var types = require('../types.js');
+var utils = require('../utils.js');
+
+
+
+exports.Initial = components_screens_initial_component.Initial;
+exports.Hint = components_screens_hint_component.Hint;
+exports.FatalError = components_screens_fatalError_component.FatalError;
+exports.TempBlock = components_screens_tempBlock_component.TempBlock;
+exports.CountdownLoader = components_countdownLoader_component.CountdownLoader;
+exports.ConfirmationContext = context.ConfirmationContext;
+exports.defaultTexts = types.defaultTexts;
+exports.ONE_DAY = utils.ONE_DAY;
+exports.ONE_MINUTE = utils.ONE_MINUTE;
+exports.formatMsAsMinutes = utils.formatMsAsMinutes;

package/confirmation/cssm/types.js

@@ -1,4 +1,6 @@
-const defaultTexts = {
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var defaultTexts = {
     title: 'Введите код из\xa0сообщения',
     codeError: 'Код введён неверно',
     codeChecking: '',
@@ -16,4 +18,4 @@ const defaultTexts = {
     countdown: 'Запросить повторно можно через',
 };
 
-export { defaultTexts };
+exports.defaultTexts = defaultTexts;

package/confirmation/cssm/utils.js

@@ -1,4 +1,6 @@
-import { useRef, useState, useCallback, useEffect } from 'react';
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
 
 /**
  * Форматирование миллисекунд в hh:mm:ss.
@@ -7,32 +9,33 @@ import { useRef, useState, useCallback, useEffect } from 'react';
  * @returns {String} время в формате mm:ss
  */
 function formatMsAsMinutes(ms) {
-    const totalSeconds = Math.ceil(ms / 1000);
-    const totalMinutes = Math.floor(totalSeconds / 60);
-    const totalHours = Math.floor(totalMinutes / 60);
-    const seconds = totalSeconds % 60;
-    const paddedSeconds = `00${seconds}`.slice(-2);
+    var totalSeconds = Math.ceil(ms / 1000);
+    var totalMinutes = Math.floor(totalSeconds / 60);
+    var totalHours = Math.floor(totalMinutes / 60);
+    var seconds = totalSeconds % 60;
+    var paddedSeconds = "00".concat(seconds).slice(-2);
     if (totalHours > 0) {
-        const minutes = totalMinutes % 60;
-        const paddedMinutes = `00${minutes}`.slice(-2);
-        const paddedHours = `00${totalHours}`.slice(-2);
-        return `${paddedHours}:${paddedMinutes}:${paddedSeconds}`;
+        var minutes = totalMinutes % 60;
+        var paddedMinutes_1 = "00".concat(minutes).slice(-2);
+        var paddedHours = "00".concat(totalHours).slice(-2);
+        return "".concat(paddedHours, ":").concat(paddedMinutes_1, ":").concat(paddedSeconds);
     }
-    const paddedMinutes = `00${totalMinutes}`.slice(-2);
-    return `${paddedMinutes}:${paddedSeconds}`;
+    var paddedMinutes = "00".concat(totalMinutes).slice(-2);
+    return "".concat(paddedMinutes, ":").concat(paddedSeconds);
 }
 /**
  * Возвращает время, которое осталось до истечения таймера в ms
  */
-const useCountdown = (countdownDuration, tick = 1000) => {
-    const timerId = useRef(0);
-    const start = useRef(0);
-    const [timePassed, setTimePassed] = useState(0);
-    const stopTimer = useCallback(() => {
+var useCountdown = function (countdownDuration, tick) {
+    if (tick === void 0) { tick = 1000; }
+    var timerId = React.useRef(0);
+    var start = React.useRef(0);
+    var _a = React.useState(0), timePassed = _a[0], setTimePassed = _a[1];
+    var stopTimer = React.useCallback(function () {
         window.clearInterval(timerId.current);
     }, []);
-    const updateProgress = useCallback(() => {
-        const passed = Date.now() - start.current;
+    var updateProgress = React.useCallback(function () {
+        var passed = Date.now() - start.current;
         if (passed >= countdownDuration) {
             stopTimer();
             setTimePassed(countdownDuration);
@@ -41,32 +44,37 @@ const useCountdown = (countdownDuration, tick = 1000) => {
             setTimePassed(passed);
         }
     }, [countdownDuration, stopTimer]);
-    const startTimer = useCallback(() => {
+    var startTimer = React.useCallback(function () {
         stopTimer();
         start.current = Date.now();
         updateProgress();
         timerId.current = window.setInterval(updateProgress, tick);
     }, [stopTimer, updateProgress, tick]);
-    const timeLeft = countdownDuration - timePassed;
-    useEffect(() => () => {
+    var timeLeft = countdownDuration - timePassed;
+    React.useEffect(function () { return function () {
         stopTimer();
-    }, [stopTimer]);
+    }; }, [stopTimer]);
     return [timeLeft, startTimer, stopTimer];
 };
-const ONE_DAY = 24 * 60 * 60 * 1000;
-const ONE_MINUTE = 60 * 1000;
-const useConfirmation = ({ state, screen, blockSmsRetry } = {}) => {
-    const [confirmationState, setConfirmationState] = useState(state ?? 'INITIAL');
-    const [confirmationScreen, setConfirmationScreen] = useState(screen ?? 'INITIAL');
-    const [confirmationBlockSmsRetry, setConfirmationBlockSmsRetry] = useState(blockSmsRetry ?? false);
+var ONE_DAY = 24 * 60 * 60 * 1000;
+var ONE_MINUTE = 60 * 1000;
+var useConfirmation = function (_a) {
+    var _b = _a === void 0 ? {} : _a, state = _b.state, screen = _b.screen, blockSmsRetry = _b.blockSmsRetry;
+    var _c = React.useState(state !== null && state !== void 0 ? state : 'INITIAL'), confirmationState = _c[0], setConfirmationState = _c[1];
+    var _d = React.useState(screen !== null && screen !== void 0 ? screen : 'INITIAL'), confirmationScreen = _d[0], setConfirmationScreen = _d[1];
+    var _e = React.useState(blockSmsRetry !== null && blockSmsRetry !== void 0 ? blockSmsRetry : false), confirmationBlockSmsRetry = _e[0], setConfirmationBlockSmsRetry = _e[1];
     return {
-        confirmationState,
-        confirmationScreen,
-        confirmationBlockSmsRetry,
-        setConfirmationState,
-        setConfirmationScreen,
-        setConfirmationBlockSmsRetry,
+        confirmationState: confirmationState,
+        confirmationScreen: confirmationScreen,
+        confirmationBlockSmsRetry: confirmationBlockSmsRetry,
+        setConfirmationState: setConfirmationState,
+        setConfirmationScreen: setConfirmationScreen,
+        setConfirmationBlockSmsRetry: setConfirmationBlockSmsRetry,
     };
 };
 
-export { ONE_DAY, ONE_MINUTE, formatMsAsMinutes, useConfirmation, useCountdown };
+exports.ONE_DAY = ONE_DAY;
+exports.ONE_MINUTE = ONE_MINUTE;
+exports.formatMsAsMinutes = formatMsAsMinutes;
+exports.useConfirmation = useConfirmation;
+exports.useCountdown = useCountdown;