@alfalab/core-components-confirmation 15.0.11 → 15.1.0

package/components/base-confirmation/component.js

@@ -30,8 +30,8 @@ var confirmationScreens = {
 };
 var BaseConfirmation = function (_a) {
     var _b;
-    var state = _a.state, screen = _a.screen, _c = _a.titleTag, titleTag = _c === void 0 ? 'h3' : _c, _d = _a.alignContent, alignContent = _d === void 0 ? 'left' : _d; _a.children; var _e = _a.requiredCharAmount, requiredCharAmount = _e === void 0 ? 5 : _e, _f = _a.countdownDuration, countdownDuration = _f === void 0 ? utils.ONE_MINUTE : _f, _g = _a.tempBlockDuration, tempBlockDuration = _g === void 0 ? utils.ONE_DAY : _g, phone = _a.phone, blockSmsRetry = _a.blockSmsRetry, dataTestId = _a.dataTestId, className = _a.className, maxWidth = _a.maxWidth, getScreensMap = _a.getScreensMap, onInputFinished = _a.onInputFinished, onChangeState = _a.onChangeState, onSmsRetryClick = _a.onSmsRetryClick, onChangeScreen = _a.onChangeScreen, onFatalErrorOkButtonClick = _a.onFatalErrorOkButtonClick, onTempBlockFinished = _a.onTempBlockFinished, mobile = _a.mobile, _h = _a.clearCodeOnError, clearCodeOnError = _h === void 0 ? true : _h, _j = _a.hideCountdownSection, hideCountdownSection = _j === void 0 ? false : _j, breakpoint = _a.breakpoint, client = _a.client, initialScreenHintSlot = _a.initialScreenHintSlot, errorVisibleDuration = _a.errorVisibleDuration, restProps = tslib.__rest(_a, ["state", "screen", "titleTag", "alignContent", "children", "requiredCharAmount", "countdownDuration", "tempBlockDuration", "phone", "blockSmsRetry", "dataTestId", "className", "maxWidth", "getScreensMap", "onInputFinished", "onChangeState", "onSmsRetryClick", "onChangeScreen", "onFatalErrorOkButtonClick", "onTempBlockFinished", "mobile", "clearCodeOnError", "hideCountdownSection", "breakpoint", "client", "initialScreenHintSlot", "errorVisibleDuration"]);
-    var _k = utils.useCountdown(countdownDuration), timeLeft = _k[0], startTimer = _k[1], stopTimer = _k[2];
+    var state = _a.state, screen = _a.screen, _c = _a.titleTag, titleTag = _c === void 0 ? 'h3' : _c, _d = _a.alignContent, alignContent = _d === void 0 ? 'left' : _d; _a.children; var _e = _a.requiredCharAmount, requiredCharAmount = _e === void 0 ? 5 : _e, _f = _a.countdownDuration, countdownDuration = _f === void 0 ? utils.ONE_MINUTE : _f, _g = _a.tempBlockDuration, tempBlockDuration = _g === void 0 ? utils.ONE_DAY : _g, phone = _a.phone, blockSmsRetry = _a.blockSmsRetry, dataTestId = _a.dataTestId, className = _a.className, maxWidth = _a.maxWidth, getScreensMap = _a.getScreensMap, onInputFinished = _a.onInputFinished, onChangeState = _a.onChangeState, onSmsRetryClick = _a.onSmsRetryClick, onChangeScreen = _a.onChangeScreen, onFatalErrorOkButtonClick = _a.onFatalErrorOkButtonClick, onTempBlockFinished = _a.onTempBlockFinished, mobile = _a.mobile, _h = _a.clearCodeOnError, clearCodeOnError = _h === void 0 ? true : _h, _j = _a.hideCountdownSection, hideCountdownSection = _j === void 0 ? false : _j, breakpoint = _a.breakpoint, client = _a.client, initialScreenHintSlot = _a.initialScreenHintSlot, errorVisibleDuration = _a.errorVisibleDuration, _k = _a.strictFocus, strictFocus = _k === void 0 ? false : _k, restProps = tslib.__rest(_a, ["state", "screen", "titleTag", "alignContent", "children", "requiredCharAmount", "countdownDuration", "tempBlockDuration", "phone", "blockSmsRetry", "dataTestId", "className", "maxWidth", "getScreensMap", "onInputFinished", "onChangeState", "onSmsRetryClick", "onChangeScreen", "onFatalErrorOkButtonClick", "onTempBlockFinished", "mobile", "clearCodeOnError", "hideCountdownSection", "breakpoint", "client", "initialScreenHintSlot", "errorVisibleDuration", "strictFocus"]);
+    var _l = utils.useCountdown(countdownDuration), timeLeft = _l[0], startTimer = _l[1], stopTimer = _l[2];
     var prevState = hooks.usePrevious(state);
     React.useEffect(function () {
         startTimer();
@@ -82,6 +82,7 @@ var BaseConfirmation = function (_a) {
         blockSmsRetry: blockSmsRetry,
         breakpoint: breakpoint,
         client: client,
+        strictFocus: strictFocus,
         onTempBlockFinished: onTempBlockFinished,
         onChangeState: onChangeState,
         onChangeScreen: onChangeScreen,

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

@@ -1 +1 @@
-{"version":3,"file":"component.js","sources":["../../src/components/base-confirmation/component.tsx"],"sourcesContent":["import React, { type ComponentType, type FC, useEffect, useMemo } from 'react';\nimport cn from 'classnames';\n\nimport { usePrevious } from '@alfalab/hooks';\n\nimport { ConfirmationContext } from '../../context';\nimport { type ConfirmationProps, defaultTexts, type TConfirmationContext } from '../../types';\nimport { ONE_DAY, ONE_MINUTE, useCountdown } from '../../utils';\nimport { FatalError, Hint, Initial, TempBlock, TempBlockOver } from '../screens';\n\nimport styles from './index.module.css';\n\nconst confirmationScreens: { [key: string]: ComponentType<{ mobile?: boolean }> } = {\n    INITIAL: Initial,\n    HINT: Hint,\n    FATAL_ERROR: FatalError,\n    TEMP_BLOCK: TempBlock,\n    TEMP_BLOCK_OVER: TempBlockOver,\n};\n\nexport const BaseConfirmation: FC<ConfirmationProps> = ({\n    state,\n    screen,\n    titleTag = 'h3',\n    alignContent = 'left',\n    children,\n    requiredCharAmount = 5,\n    countdownDuration = ONE_MINUTE,\n    tempBlockDuration = ONE_DAY,\n    phone,\n    blockSmsRetry,\n    dataTestId,\n    className,\n    maxWidth,\n    getScreensMap,\n    onInputFinished,\n    onChangeState,\n    onSmsRetryClick,\n    onChangeScreen,\n    onFatalErrorOkButtonClick,\n    onTempBlockFinished,\n    mobile,\n    clearCodeOnError = true,\n    hideCountdownSection = false,\n    breakpoint,\n    client,\n    initialScreenHintSlot,\n    errorVisibleDuration,\n    ...restProps\n}) => {\n    const [timeLeft, startTimer, stopTimer] = useCountdown(countdownDuration);\n\n    const prevState = usePrevious(state);\n\n    useEffect(() => {\n        startTimer();\n    }, [startTimer]);\n\n    useEffect(() => {\n        /**\n         * Перезапускаем таймер после повторного запроса кода\n         */\n        if (state === 'INITIAL' && prevState === 'CODE_SENDING') {\n            startTimer();\n        }\n    }, [state, prevState, startTimer]);\n\n    useEffect(() => {\n        /**\n         * Останавливаем таймер, если новый экран/состояние не содержит таймер\n         */\n        if (\n            !['INITIAL', 'HINT', 'TEMP_BLOCK', 'TEMP_BLOCK_OVER'].includes(screen) ||\n            blockSmsRetry\n        ) {\n            stopTimer();\n        }\n    }, [state, screen, blockSmsRetry, stopTimer]);\n\n    const handleSmsRetry = () => {\n        onChangeState('CODE_SENDING');\n\n        onSmsRetryClick();\n    };\n\n    const handleInputFinished = (code: string) => {\n        onChangeState('CODE_CHECKING');\n\n        onInputFinished(code);\n    };\n\n    const handleFatalErrorOkButtonClick = () => {\n        if (onFatalErrorOkButtonClick) {\n            onFatalErrorOkButtonClick();\n        }\n    };\n\n    // eslint-disable-next-line react/jsx-no-constructed-context-values\n    const contextValue: TConfirmationContext = {\n        hideCountdownSection,\n        alignContent,\n        titleTag,\n        texts: { ...defaultTexts, ...restProps.texts },\n        state,\n        screen,\n        requiredCharAmount,\n        countdownDuration,\n        timeLeft,\n        tempBlockDuration,\n        phone,\n        blockSmsRetry,\n        breakpoint,\n        client,\n        onTempBlockFinished,\n        onChangeState,\n        onChangeScreen,\n        clearCodeOnError,\n        errorVisibleDuration,\n        initialScreenHintSlot,\n        onInputFinished: handleInputFinished,\n        onSmsRetryClick: handleSmsRetry,\n        onFatalErrorOkButtonClick: handleFatalErrorOkButtonClick,\n    };\n\n    const customScreen = useMemo(() => getScreensMap?.(confirmationScreens), [getScreensMap]);\n\n    const screensMap = customScreen || confirmationScreens;\n\n    const CurrentScreen = screensMap[screen];\n\n    return (\n        <ConfirmationContext.Provider value={contextValue}>\n            <div\n                className={cn(styles.component, className, {\n                    [styles.center]: alignContent === 'center',\n                })}\n                style={{ maxWidth }}\n                data-test-id={dataTestId}\n            >\n                {CurrentScreen && <CurrentScreen mobile={mobile} />}\n            </div>\n        </ConfirmationContext.Provider>\n    );\n};\n"],"names":["Initial","Hint","FatalError","TempBlock","TempBlockOver","ONE_MINUTE","ONE_DAY","__rest","useCountdown","usePrevious","useEffect","defaultTexts","useMemo","React","ConfirmationContext","cn","styles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAYA,IAAM,mBAAmB,GAA2D;AAChF,IAAA,OAAO,EAAEA,mBAAO;AAChB,IAAA,IAAI,EAAEC,gBAAI;AACV,IAAA,WAAW,EAAEC,sBAAU;AACvB,IAAA,UAAU,EAAEC,qBAAS;AACrB,IAAA,eAAe,EAAEC,uBAAa;CACjC;AAEM,IAAM,gBAAgB,GAA0B,UAAC,EA6BvD,EAAA;;IA5BG,IAAA,KAAK,GAAA,EAAA,CAAA,KAAA,CAAA,CACL,MAAM,GAAA,EAAA,CAAA,MAAA,EACN,EAAe,GAAA,EAAA,CAAA,QAAA,CAAA,CAAf,QAAQ,GAAA,EAAA,KAAA,MAAA,GAAG,IAAI,GAAA,EAAA,EACf,EAAqB,GAAA,EAAA,CAAA,YAAA,CAAA,CAArB,YAAY,GAAA,EAAA,KAAA,MAAA,GAAG,MAAM,GAAA,EAAA,CACrB,CAAQ,EAAA,CAAA,QAAA,CAAA,KACR,EAAsB,GAAA,EAAA,CAAA,kBAAA,CAAA,CAAtB,kBAAkB,GAAA,EAAA,KAAA,MAAA,GAAG,CAAC,GAAA,EAAA,CAAA,CACtB,EAA8B,GAAA,EAAA,CAAA,iBAAA,CAAA,CAA9B,iBAAiB,GAAA,EAAA,KAAA,MAAA,GAAGC,gBAAU,GAAA,EAAA,CAAA,CAC9B,EAA2B,GAAA,EAAA,CAAA,iBAAA,CAAA,CAA3B,iBAAiB,GAAA,EAAA,KAAA,MAAA,GAAGC,aAAO,GAAA,EAAA,CAAA,CAC3B,KAAK,GAAA,EAAA,CAAA,KAAA,CACL,CAAA,aAAa,GAAA,EAAA,CAAA,aAAA,CAAA,CACb,UAAU,GAAA,EAAA,CAAA,UAAA,CACV,CAAA,SAAS,GAAA,EAAA,CAAA,SAAA,CAAA,CACT,QAAQ,GAAA,EAAA,CAAA,QAAA,CAAA,CACR,aAAa,GAAA,EAAA,CAAA,aAAA,CACb,CAAA,eAAe,qBAAA,CACf,CAAA,aAAa,GAAA,EAAA,CAAA,aAAA,CAAA,CACb,eAAe,GAAA,EAAA,CAAA,eAAA,EACf,cAAc,GAAA,EAAA,CAAA,cAAA,CACd,CAAA,yBAAyB,GAAA,EAAA,CAAA,yBAAA,CAAA,CACzB,mBAAmB,GAAA,EAAA,CAAA,mBAAA,CACnB,CAAA,MAAM,GAAA,EAAA,CAAA,MAAA,CAAA,CACN,EAAuB,GAAA,EAAA,CAAA,gBAAA,CAAA,CAAvB,gBAAgB,GAAG,EAAA,KAAA,MAAA,GAAA,IAAI,GAAA,EAAA,CAAA,CACvB,EAA4B,GAAA,EAAA,CAAA,oBAAA,CAAA,CAA5B,oBAAoB,GAAG,EAAA,KAAA,MAAA,GAAA,KAAK,GAAA,EAAA,CAAA,CAC5B,UAAU,GAAA,EAAA,CAAA,UAAA,EACV,MAAM,GAAA,EAAA,CAAA,MAAA,CACN,CAAA,qBAAqB,GAAA,EAAA,CAAA,qBAAA,CAAA,CACrB,oBAAoB,GAAA,EAAA,CAAA,oBAAA,CACjB,CAAA,SAAS,GA5BwCC,YAAA,CAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,UAAA,EAAA,cAAA,EAAA,UAAA,EAAA,oBAAA,EAAA,mBAAA,EAAA,mBAAA,EAAA,OAAA,EAAA,eAAA,EAAA,YAAA,EAAA,WAAA,EAAA,UAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,2BAAA,EAAA,qBAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,sBAAA,EAAA,YAAA,EAAA,QAAA,EAAA,uBAAA,EAAA,sBAAA,CA6BvD;AACS,IAAA,IAAA,EAAoC,GAAAC,kBAAY,CAAC,iBAAiB,CAAC,EAAlE,QAAQ,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,UAAU,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,SAAS,QAAmC;AAEzE,IAAA,IAAM,SAAS,GAAGC,iBAAW,CAAC,KAAK,CAAC;AAEpC,IAAAC,eAAS,CAAC,YAAA;AACN,QAAA,UAAU,EAAE;AAChB,KAAC,EAAE,CAAC,UAAU,CAAC,CAAC;AAEhB,IAAAA,eAAS,CAAC,YAAA;AACN;;AAEG;QACH,IAAI,KAAK,KAAK,SAAS,IAAI,SAAS,KAAK,cAAc,EAAE;AACrD,YAAA,UAAU,EAAE;;KAEnB,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,UAAU,CAAC,CAAC;AAElC,IAAAA,eAAS,CAAC,YAAA;AACN;;AAEG;AACH,QAAA,IACI,CAAC,CAAC,SAAS,EAAE,MAAM,EAAE,YAAY,EAAE,iBAAiB,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC;AACtE,YAAA,aAAa,EACf;AACE,YAAA,SAAS,EAAE;;KAElB,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,aAAa,EAAE,SAAS,CAAC,CAAC;AAE7C,IAAA,IAAM,cAAc,GAAG,YAAA;QACnB,aAAa,CAAC,cAAc,CAAC;AAE7B,QAAA,eAAe,EAAE;AACrB,KAAC;IAED,IAAM,mBAAmB,GAAG,UAAC,IAAY,EAAA;QACrC,aAAa,CAAC,eAAe,CAAC;QAE9B,eAAe,CAAC,IAAI,CAAC;AACzB,KAAC;AAED,IAAA,IAAM,6BAA6B,GAAG,YAAA;QAClC,IAAI,yBAAyB,EAAE;AAC3B,YAAA,yBAAyB,EAAE;;AAEnC,KAAC;;AAGD,IAAA,IAAM,YAAY,GAAyB;AACvC,QAAA,oBAAoB,EAAA,oBAAA;AACpB,QAAA,YAAY,EAAA,YAAA;AACZ,QAAA,QAAQ,EAAA,QAAA;AACR,QAAA,KAAK,oCAAOC,kBAAY,CAAA,EAAK,SAAS,CAAC,KAAK,CAAE;AAC9C,QAAA,KAAK,EAAA,KAAA;AACL,QAAA,MAAM,EAAA,MAAA;AACN,QAAA,kBAAkB,EAAA,kBAAA;AAClB,QAAA,iBAAiB,EAAA,iBAAA;AACjB,QAAA,QAAQ,EAAA,QAAA;AACR,QAAA,iBAAiB,EAAA,iBAAA;AACjB,QAAA,KAAK,EAAA,KAAA;AACL,QAAA,aAAa,EAAA,aAAA;AACb,QAAA,UAAU,EAAA,UAAA;AACV,QAAA,MAAM,EAAA,MAAA;AACN,QAAA,mBAAmB,EAAA,mBAAA;AACnB,QAAA,aAAa,EAAA,aAAA;AACb,QAAA,cAAc,EAAA,cAAA;AACd,QAAA,gBAAgB,EAAA,gBAAA;AAChB,QAAA,oBAAoB,EAAA,oBAAA;AACpB,QAAA,qBAAqB,EAAA,qBAAA;AACrB,QAAA,eAAe,EAAE,mBAAmB;AACpC,QAAA,eAAe,EAAE,cAAc;AAC/B,QAAA,yBAAyB,EAAE,6BAA6B;KAC3D;IAED,IAAM,YAAY,GAAGC,aAAO,CAAC,cAAM,OAAA,aAAa,aAAb,aAAa,KAAA,MAAA,GAAA,MAAA,GAAb,aAAa,CAAG,mBAAmB,CAAC,CAApC,EAAoC,EAAE,CAAC,aAAa,CAAC,CAAC;AAEzF,IAAA,IAAM,UAAU,GAAG,YAAY,IAAI,mBAAmB;AAEtD,IAAA,IAAM,aAAa,GAAG,UAAU,CAAC,MAAM,CAAC;IAExC,QACIC,qCAACC,2BAAmB,CAAC,QAAQ,EAAC,EAAA,KAAK,EAAE,YAAY,EAAA;QAC7CD,sBACI,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAEE,mBAAE,CAACC,YAAM,CAAC,SAAS,EAAE,SAAS,GAAA,EAAA,GAAA,EAAA;AACrC,gBAAA,EAAA,CAACA,YAAM,CAAC,MAAM,CAAG,GAAA,YAAY,KAAK,QAAQ;oBAC5C,EACF,KAAK,EAAE,EAAE,QAAQ,UAAA,EAAE,EAAA,cAAA,EACL,UAAU,EAEvB,EAAA,aAAa,IAAIH,sBAAC,CAAA,aAAA,CAAA,aAAa,IAAC,MAAM,EAAE,MAAM,EAAI,CAAA,CACjD,CACqB;AAEvC;;;;"}
+{"version":3,"file":"component.js","sources":["../../src/components/base-confirmation/component.tsx"],"sourcesContent":["import React, { type ComponentType, type FC, useEffect, useMemo } from 'react';\nimport cn from 'classnames';\n\nimport { usePrevious } from '@alfalab/hooks';\n\nimport { ConfirmationContext } from '../../context';\nimport { type ConfirmationProps, defaultTexts, type TConfirmationContext } from '../../types';\nimport { ONE_DAY, ONE_MINUTE, useCountdown } from '../../utils';\nimport { FatalError, Hint, Initial, TempBlock, TempBlockOver } from '../screens';\n\nimport styles from './index.module.css';\n\nconst confirmationScreens: { [key: string]: ComponentType<{ mobile?: boolean }> } = {\n    INITIAL: Initial,\n    HINT: Hint,\n    FATAL_ERROR: FatalError,\n    TEMP_BLOCK: TempBlock,\n    TEMP_BLOCK_OVER: TempBlockOver,\n};\n\nexport const BaseConfirmation: FC<ConfirmationProps> = ({\n    state,\n    screen,\n    titleTag = 'h3',\n    alignContent = 'left',\n    children,\n    requiredCharAmount = 5,\n    countdownDuration = ONE_MINUTE,\n    tempBlockDuration = ONE_DAY,\n    phone,\n    blockSmsRetry,\n    dataTestId,\n    className,\n    maxWidth,\n    getScreensMap,\n    onInputFinished,\n    onChangeState,\n    onSmsRetryClick,\n    onChangeScreen,\n    onFatalErrorOkButtonClick,\n    onTempBlockFinished,\n    mobile,\n    clearCodeOnError = true,\n    hideCountdownSection = false,\n    breakpoint,\n    client,\n    initialScreenHintSlot,\n    errorVisibleDuration,\n    strictFocus = false,\n    ...restProps\n}) => {\n    const [timeLeft, startTimer, stopTimer] = useCountdown(countdownDuration);\n\n    const prevState = usePrevious(state);\n\n    useEffect(() => {\n        startTimer();\n    }, [startTimer]);\n\n    useEffect(() => {\n        /**\n         * Перезапускаем таймер после повторного запроса кода\n         */\n        if (state === 'INITIAL' && prevState === 'CODE_SENDING') {\n            startTimer();\n        }\n    }, [state, prevState, startTimer]);\n\n    useEffect(() => {\n        /**\n         * Останавливаем таймер, если новый экран/состояние не содержит таймер\n         */\n        if (\n            !['INITIAL', 'HINT', 'TEMP_BLOCK', 'TEMP_BLOCK_OVER'].includes(screen) ||\n            blockSmsRetry\n        ) {\n            stopTimer();\n        }\n    }, [state, screen, blockSmsRetry, stopTimer]);\n\n    const handleSmsRetry = () => {\n        onChangeState('CODE_SENDING');\n\n        onSmsRetryClick();\n    };\n\n    const handleInputFinished = (code: string) => {\n        onChangeState('CODE_CHECKING');\n\n        onInputFinished(code);\n    };\n\n    const handleFatalErrorOkButtonClick = () => {\n        if (onFatalErrorOkButtonClick) {\n            onFatalErrorOkButtonClick();\n        }\n    };\n\n    // eslint-disable-next-line react/jsx-no-constructed-context-values\n    const contextValue: TConfirmationContext = {\n        hideCountdownSection,\n        alignContent,\n        titleTag,\n        texts: { ...defaultTexts, ...restProps.texts },\n        state,\n        screen,\n        requiredCharAmount,\n        countdownDuration,\n        timeLeft,\n        tempBlockDuration,\n        phone,\n        blockSmsRetry,\n        breakpoint,\n        client,\n        strictFocus,\n        onTempBlockFinished,\n        onChangeState,\n        onChangeScreen,\n        clearCodeOnError,\n        errorVisibleDuration,\n        initialScreenHintSlot,\n        onInputFinished: handleInputFinished,\n        onSmsRetryClick: handleSmsRetry,\n        onFatalErrorOkButtonClick: handleFatalErrorOkButtonClick,\n    };\n\n    const customScreen = useMemo(() => getScreensMap?.(confirmationScreens), [getScreensMap]);\n\n    const screensMap = customScreen || confirmationScreens;\n\n    const CurrentScreen = screensMap[screen];\n\n    return (\n        <ConfirmationContext.Provider value={contextValue}>\n            <div\n                className={cn(styles.component, className, {\n                    [styles.center]: alignContent === 'center',\n                })}\n                style={{ maxWidth }}\n                data-test-id={dataTestId}\n            >\n                {CurrentScreen && <CurrentScreen mobile={mobile} />}\n            </div>\n        </ConfirmationContext.Provider>\n    );\n};\n"],"names":["Initial","Hint","FatalError","TempBlock","TempBlockOver","ONE_MINUTE","ONE_DAY","__rest","useCountdown","usePrevious","useEffect","defaultTexts","useMemo","React","ConfirmationContext","cn","styles"],"mappings":"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"}

package/components/base-confirmation/index.css

@@ -4,11 +4,11 @@
 :root {
     --gap-0: 0px;
 }
-.confirmation__component_apbwq {
+.confirmation__component_uxe4n {
     width: 100%;
     max-width: 388px;
     color: var(--color-light-text-secondary);
 }
-.confirmation__component_apbwq.confirmation__center_apbwq {
+.confirmation__component_uxe4n.confirmation__center_uxe4n {
         margin: var(--gap-0) auto;
     }

package/components/base-confirmation/index.module.css.js

@@ -2,7 +2,7 @@
 
 require('./index.css');
 
-var styles = {"component":"confirmation__component_apbwq","center":"confirmation__center_apbwq"};
+var styles = {"component":"confirmation__component_uxe4n","center":"confirmation__center_uxe4n"};
 
 module.exports = styles;
 //# sourceMappingURL=index.module.css.js.map

package/components/countdown-loader/index.css

@@ -1,7 +1,7 @@
 :root {
     --color-light-neutral-500: #babbc2;
 }
-.confirmation__circle_o29i9 {
+.confirmation__circle_b8lfh {
     fill: transparent;
     stroke: var(--color-light-neutral-500);
     stroke-width: 2px;

package/components/countdown-loader/index.module.css.js

@@ -2,7 +2,7 @@
 
 require('./index.css');
 
-var styles = {"circle":"confirmation__circle_o29i9"};
+var styles = {"circle":"confirmation__circle_b8lfh"};
 
 module.exports = styles;
 //# sourceMappingURL=index.module.css.js.map

package/components/header/index.css

@@ -2,6 +2,6 @@
     --gap-xl: 24px;
     --gap-24: var(--gap-xl);
 }
-.confirmation__header_11m6p.confirmation__header_11m6p {
+.confirmation__header_1k1d7.confirmation__header_1k1d7 {
     margin-bottom: var(--gap-24);
 }

package/components/header/index.module.css.js

@@ -2,7 +2,7 @@
 
 require('./index.css');
 
-var styles = {"header":"confirmation__header_11m6p"};
+var styles = {"header":"confirmation__header_1k1d7"};
 
 module.exports = styles;
 //# sourceMappingURL=index.module.css.js.map

package/components/screens/fatal-error/index.css

@@ -13,27 +13,27 @@
 :root {
     --confirmation-text-color: var(--color-light-text-primary)
 }
-.confirmation__component_95dpi {
+.confirmation__component_142if {
     display: flex;
     flex-direction: column;
 }
-.confirmation__typographyTheme_95dpi.confirmation__typographyTheme_95dpi {
+.confirmation__typographyTheme_142if.confirmation__typographyTheme_142if {
     font-size: 16px;
     line-height: 24px;
     font-weight: 400;
     font-family: var(--font-family-system);
     color: var(--confirmation-text-color);
 }
-.confirmation__typographyThemeMobile_95dpi.confirmation__typographyThemeMobile_95dpi {
+.confirmation__typographyThemeMobile_142if.confirmation__typographyThemeMobile_142if {
     color: var(--color-light-text-secondary);
 }
-.confirmation__left_95dpi {
+.confirmation__left_142if {
     align-items: flex-start;
 }
-.confirmation__center_95dpi {
+.confirmation__center_142if {
     align-items: center;
     text-align: center;
 }
-.confirmation__button_95dpi.confirmation__button_95dpi {
+.confirmation__button_142if.confirmation__button_142if {
     margin-top: var(--gap-32);
 }

package/components/screens/fatal-error/index.module.css.js

@@ -2,7 +2,7 @@
 
 require('./index.css');
 
-var styles = {"component":"confirmation__component_95dpi","typographyTheme":"confirmation__typographyTheme_95dpi","typographyThemeMobile":"confirmation__typographyThemeMobile_95dpi","left":"confirmation__left_95dpi","center":"confirmation__center_95dpi","button":"confirmation__button_95dpi"};
+var styles = {"component":"confirmation__component_142if","typographyTheme":"confirmation__typographyTheme_142if","typographyThemeMobile":"confirmation__typographyThemeMobile_142if","left":"confirmation__left_142if","center":"confirmation__center_142if","button":"confirmation__button_142if"};
 
 module.exports = styles;
 //# sourceMappingURL=index.module.css.js.map

package/components/screens/hint/index.css

@@ -18,52 +18,52 @@
 :root {
     --confirmation-text-color: var(--color-light-text-primary)
 }
-.confirmation__component_hfp5y {
+.confirmation__component_k0ehe {
     display: flex;
     flex-direction: column;
     align-items: flex-start;
 }
-.confirmation__component_hfp5y span:last-of-type {
+.confirmation__component_k0ehe span:last-of-type {
         margin-bottom: var(--gap-0);
     }
-.confirmation__center_hfp5y {
+.confirmation__center_k0ehe {
     align-items: center;
     text-align: center;
 }
-.confirmation__text_hfp5y.confirmation__text_hfp5y {
+.confirmation__text_k0ehe.confirmation__text_k0ehe {
     margin-bottom: var(--gap-24);
 }
-.confirmation__typographyTheme_hfp5y.confirmation__typographyTheme_hfp5y {
+.confirmation__typographyTheme_k0ehe.confirmation__typographyTheme_k0ehe {
     font-size: 16px;
     line-height: 24px;
     font-weight: 400;
     font-family: var(--font-family-system);
     color: var(--confirmation-text-color);
 }
-.confirmation__typographyThemeMobile_hfp5y.confirmation__typographyThemeMobile_hfp5y {
+.confirmation__typographyThemeMobile_k0ehe.confirmation__typographyThemeMobile_k0ehe {
     color: var(--color-light-text-secondary);
 }
-.confirmation__phonesWrap_hfp5y {
+.confirmation__phonesWrap_k0ehe {
     display: flex;
     flex-direction: column;
     margin-bottom: var(--gap-24);
 }
-.confirmation__phoneWrap_hfp5y {
+.confirmation__phoneWrap_k0ehe {
     margin-bottom: var(--gap-8);
 }
-.confirmation__phoneWrap_hfp5y:last-child {
+.confirmation__phoneWrap_k0ehe:last-child {
         margin-bottom: var(--gap-0);
     }
-.confirmation__phoneLink_hfp5y.confirmation__phoneLink_hfp5y {
+.confirmation__phoneLink_k0ehe.confirmation__phoneLink_k0ehe {
     font-size: 16px;
     line-height: 24px;
     font-weight: 500;
     font-family: var(--font-family-system);
 }
-.confirmation__hintButton_hfp5y {
+.confirmation__hintButton_k0ehe {
     margin-top: var(--gap-32);
 }
-.confirmation__phoneContentMobile_hfp5y {
+.confirmation__phoneContentMobile_k0ehe {
     display: flex;
     flex-direction: column;
 }

package/components/screens/hint/index.module.css.js

@@ -2,7 +2,7 @@
 
 require('./index.css');
 
-var styles = {"component":"confirmation__component_hfp5y","center":"confirmation__center_hfp5y","text":"confirmation__text_hfp5y","typographyTheme":"confirmation__typographyTheme_hfp5y","typographyThemeMobile":"confirmation__typographyThemeMobile_hfp5y","phonesWrap":"confirmation__phonesWrap_hfp5y","phoneWrap":"confirmation__phoneWrap_hfp5y","phoneLink":"confirmation__phoneLink_hfp5y","hintButton":"confirmation__hintButton_hfp5y","phoneContentMobile":"confirmation__phoneContentMobile_hfp5y"};
+var styles = {"component":"confirmation__component_k0ehe","center":"confirmation__center_k0ehe","text":"confirmation__text_k0ehe","typographyTheme":"confirmation__typographyTheme_k0ehe","typographyThemeMobile":"confirmation__typographyThemeMobile_k0ehe","phonesWrap":"confirmation__phonesWrap_k0ehe","phoneWrap":"confirmation__phoneWrap_k0ehe","phoneLink":"confirmation__phoneLink_k0ehe","hintButton":"confirmation__hintButton_k0ehe","phoneContentMobile":"confirmation__phoneContentMobile_k0ehe"};
 
 module.exports = styles;
 //# sourceMappingURL=index.module.css.js.map

package/components/screens/initial/component.js

@@ -24,7 +24,7 @@ var CODE_SEND_HINT_VISIBLE_DURATION = 2000;
 var Initial = function (_a) {
     var _b;
     var mobile$2 = _a.mobile;
-    var _c = React.useContext(context.ConfirmationContext), state = _c.state, alignContent = _c.alignContent, titleTag = _c.titleTag, texts = _c.texts, requiredCharAmount = _c.requiredCharAmount, timeLeft = _c.timeLeft, phone = _c.phone, clearCodeOnError = _c.clearCodeOnError, hideCountdownSection = _c.hideCountdownSection, initialScreenHintSlot = _c.initialScreenHintSlot, errorVisibleDuration = _c.errorVisibleDuration, onChangeState = _c.onChangeState, onInputFinished = _c.onInputFinished, onChangeScreen = _c.onChangeScreen, onSmsRetryClick = _c.onSmsRetryClick;
+    var _c = React.useContext(context.ConfirmationContext), state = _c.state, alignContent = _c.alignContent, titleTag = _c.titleTag, texts = _c.texts, requiredCharAmount = _c.requiredCharAmount, timeLeft = _c.timeLeft, phone = _c.phone, clearCodeOnError = _c.clearCodeOnError, hideCountdownSection = _c.hideCountdownSection, initialScreenHintSlot = _c.initialScreenHintSlot, errorVisibleDuration = _c.errorVisibleDuration, strictFocus = _c.strictFocus, onChangeState = _c.onChangeState, onInputFinished = _c.onInputFinished, onChangeScreen = _c.onChangeScreen, onSmsRetryClick = _c.onSmsRetryClick;
     var prevState = hooks.usePrevious(state);
     var inputRef = React.useRef(null);
     var _d = React.useState(false), codeSendHintVisible = _d[0], setCodeSendHintVisible = _d[1];
@@ -111,7 +111,7 @@ var Initial = function (_a) {
                 _b)) },
             "\u041E\u0442\u043F\u0440\u0430\u0432\u0438\u043B\u0438 \u043D\u0430 ",
             phone)) : null,
-        React__default.default.createElement(ComponentCodeInput, { disabled: processing, error: getCodeInputError(), ref: inputRef, fields: requiredCharAmount, className: cn__default.default(index_module.containerInput, index_module.codeInput), onComplete: handleInputComplete, onChange: handleInputChange, clearCodeOnError: clearCodeOnError, errorVisibleDuration: errorVisibleDuration, onErrorAnimationEnd: handleErrorAnimationEnd }),
+        React__default.default.createElement(ComponentCodeInput, { disabled: processing, error: getCodeInputError(), ref: inputRef, fields: requiredCharAmount, strictFocus: strictFocus, className: cn__default.default(index_module.containerInput, index_module.codeInput), onComplete: handleInputComplete, onChange: handleInputChange, clearCodeOnError: clearCodeOnError, errorVisibleDuration: errorVisibleDuration, onErrorAnimationEnd: handleErrorAnimationEnd }),
         !hideCountdownSection && (React__default.default.createElement(countdownSection.CountdownSection, { processing: processing, timePassed: timePassed, codeSendHintVisible: codeSendHintVisible, handleSmsRetryClick: handleSmsRetryClick, mobile: mobile$2 })),
         renderHintButton()));
 };

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

@@ -1 +1 @@
-{"version":3,"file":"component.js","sources":["../../../src/components/screens/initial/component.tsx"],"sourcesContent":["import React, { type FC, useCallback, useContext, useEffect, useRef, useState } from 'react';\nimport cn from 'classnames';\n\nimport { ButtonMobile } from '@alfalab/core-components-button/mobile';\nimport { CodeInputDesktop } from '@alfalab/core-components-code-input/desktop';\nimport { CodeInputMobile } from '@alfalab/core-components-code-input/mobile';\nimport {\n    type BaseCodeInputProps,\n    type CustomInputRef,\n} from '@alfalab/core-components-code-input/shared';\nimport { Link } from '@alfalab/core-components-link';\nimport { TypographyText } from '@alfalab/core-components-typography';\nimport { useLayoutEffect_SAFE_FOR_SSR, usePrevious } from '@alfalab/hooks';\n\nimport { ConfirmationContext } from '../../../context';\nimport { Header } from '../../header';\n\nimport { CountdownSection } from './countdown-section';\n\nimport styles from './index.module.css';\n\nexport type InitialProps = {\n    /**\n     * Отображать в мобильной версии экран компонента\n     */\n    mobile?: boolean;\n};\n\nconst CODE_SEND_HINT_VISIBLE_DURATION = 2000;\n\nexport const Initial: FC<InitialProps> = ({ mobile }) => {\n    const {\n        state,\n        alignContent,\n        titleTag,\n        texts,\n        requiredCharAmount,\n        timeLeft,\n        phone,\n        clearCodeOnError,\n        hideCountdownSection,\n        initialScreenHintSlot,\n        errorVisibleDuration,\n        onChangeState,\n        onInputFinished,\n        onChangeScreen,\n        onSmsRetryClick,\n    } = useContext(ConfirmationContext);\n\n    const prevState = usePrevious(state);\n\n    const inputRef = useRef<CustomInputRef>(null);\n\n    const [codeSendHintVisible, setCodeSendHintVisible] = useState(false);\n\n    const timerId = useRef(0);\n\n    const handleInputComplete: BaseCodeInputProps['onComplete'] = (code) => {\n        onInputFinished(code);\n    };\n\n    const handleSmsHintLinkClick = () => {\n        onChangeScreen('HINT');\n    };\n\n    const handleInputChange = () => {\n        if (state === 'CODE_ERROR') {\n            onChangeState('INITIAL');\n        }\n    };\n\n    const handleSmsRetryClick = () => {\n        if (inputRef.current) {\n            inputRef.current.reset();\n        }\n\n        onSmsRetryClick();\n    };\n\n    const handleErrorAnimationEnd = () => {\n        if (clearCodeOnError && state !== 'INITIAL') {\n            onChangeState('INITIAL');\n        }\n    };\n\n    const clearTimer = useCallback(() => {\n        window.clearTimeout(timerId.current);\n    }, []);\n\n    useEffect(() => {\n        if (inputRef.current) {\n            inputRef.current.focus();\n        }\n\n        return () => {\n            clearTimer();\n        };\n    }, [clearTimer]);\n\n    useEffect(() => {\n        if (!inputRef.current) {\n            return;\n        }\n\n        if (prevState === 'CODE_SENDING' && state !== 'CODE_SENDING') {\n            inputRef.current.focus();\n        }\n    }, [prevState, state, requiredCharAmount]);\n\n    useLayoutEffect_SAFE_FOR_SSR(() => {\n        if (prevState === 'CODE_SENDING' && state !== 'CODE_SENDING') {\n            setCodeSendHintVisible(true);\n\n            clearTimer();\n\n            timerId.current = window.setTimeout(() => {\n                setCodeSendHintVisible(false);\n            }, CODE_SEND_HINT_VISIBLE_DURATION);\n        }\n    }, [prevState, state, clearTimer]);\n\n    const getCodeInputError = (): string | boolean => {\n        if (state === 'CODE_EXPIRED') {\n            return texts.codeErrorExpired || true;\n        }\n\n        if (state === 'CODE_EXPIRED_ENDED') {\n            return texts.codeErrorExpiredEnded || true;\n        }\n\n        if (state === 'CODE_ERROR') {\n            return texts.codeError || true;\n        }\n\n        return false;\n    };\n\n    const renderHintButton = () => {\n        if (initialScreenHintSlot) {\n            return initialScreenHintSlot;\n        }\n\n        if (mobile) {\n            return (\n                <ButtonMobile\n                    onClick={handleSmsHintLinkClick}\n                    className={styles.smsBtn}\n                    view='text'\n                    size={40}\n                >\n                    {texts.linkToHint}\n                </ButtonMobile>\n            );\n        }\n\n        return (\n            <Link\n                onClick={handleSmsHintLinkClick}\n                className={styles.smsComeLink}\n                view={mobile ? 'primary' : 'secondary'}\n                pseudo={true}\n            >\n                {texts.linkToHint}\n            </Link>\n        );\n    };\n\n    const processing = ['CODE_CHECKING', 'CODE_SENDING'].includes(state);\n\n    const timePassed = timeLeft === 0;\n\n    const ComponentCodeInput = mobile ? CodeInputMobile : CodeInputDesktop;\n\n    return (\n        <div className={cn(styles.component, styles[alignContent])}>\n            <Header mobile={mobile} titleTag={titleTag}>\n                {texts.title}\n            </Header>\n\n            {phone ? (\n                <TypographyText\n                    view='primary-medium'\n                    color='primary'\n                    className={cn(styles.phone, {\n                        [styles.typographyTheme]: !mobile,\n                        [styles.typographyThemeMobile]: mobile,\n                    })}\n                >\n                    Отправили на {phone}\n                </TypographyText>\n            ) : null}\n            <ComponentCodeInput\n                disabled={processing}\n                error={getCodeInputError()}\n                ref={inputRef}\n                fields={requiredCharAmount}\n                className={cn(styles.containerInput, styles.codeInput)}\n                onComplete={handleInputComplete}\n                onChange={handleInputChange}\n                clearCodeOnError={clearCodeOnError}\n                errorVisibleDuration={errorVisibleDuration}\n                onErrorAnimationEnd={handleErrorAnimationEnd}\n            />\n            {!hideCountdownSection && (\n                <CountdownSection\n                    processing={processing}\n                    timePassed={timePassed}\n                    codeSendHintVisible={codeSendHintVisible}\n                    handleSmsRetryClick={handleSmsRetryClick}\n                    mobile={mobile}\n                />\n            )}\n\n            {renderHintButton()}\n        </div>\n    );\n};\n"],"names":["mobile","useContext","ConfirmationContext","usePrevious","useRef","useState","useCallback","useEffect","useLayoutEffect_SAFE_FOR_SSR","React","ButtonMobile","styles","Link","CodeInputMobile","CodeInputDesktop","cn","Header","TypographyText","CountdownSection"],"mappings":"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"}
+{"version":3,"file":"component.js","sources":["../../../src/components/screens/initial/component.tsx"],"sourcesContent":["import React, { type FC, useCallback, useContext, useEffect, useRef, useState } from 'react';\nimport cn from 'classnames';\n\nimport { ButtonMobile } from '@alfalab/core-components-button/mobile';\nimport { CodeInputDesktop } from '@alfalab/core-components-code-input/desktop';\nimport { CodeInputMobile } from '@alfalab/core-components-code-input/mobile';\nimport {\n    type BaseCodeInputProps,\n    type CustomInputRef,\n} from '@alfalab/core-components-code-input/shared';\nimport { Link } from '@alfalab/core-components-link';\nimport { TypographyText } from '@alfalab/core-components-typography';\nimport { useLayoutEffect_SAFE_FOR_SSR, usePrevious } from '@alfalab/hooks';\n\nimport { ConfirmationContext } from '../../../context';\nimport { Header } from '../../header';\n\nimport { CountdownSection } from './countdown-section';\n\nimport styles from './index.module.css';\n\nexport type InitialProps = {\n    /**\n     * Отображать в мобильной версии экран компонента\n     */\n    mobile?: boolean;\n};\n\nconst CODE_SEND_HINT_VISIBLE_DURATION = 2000;\n\nexport const Initial: FC<InitialProps> = ({ mobile }) => {\n    const {\n        state,\n        alignContent,\n        titleTag,\n        texts,\n        requiredCharAmount,\n        timeLeft,\n        phone,\n        clearCodeOnError,\n        hideCountdownSection,\n        initialScreenHintSlot,\n        errorVisibleDuration,\n        strictFocus,\n        onChangeState,\n        onInputFinished,\n        onChangeScreen,\n        onSmsRetryClick,\n    } = useContext(ConfirmationContext);\n\n    const prevState = usePrevious(state);\n\n    const inputRef = useRef<CustomInputRef>(null);\n\n    const [codeSendHintVisible, setCodeSendHintVisible] = useState(false);\n\n    const timerId = useRef(0);\n\n    const handleInputComplete: BaseCodeInputProps['onComplete'] = (code) => {\n        onInputFinished(code);\n    };\n\n    const handleSmsHintLinkClick = () => {\n        onChangeScreen('HINT');\n    };\n\n    const handleInputChange = () => {\n        if (state === 'CODE_ERROR') {\n            onChangeState('INITIAL');\n        }\n    };\n\n    const handleSmsRetryClick = () => {\n        if (inputRef.current) {\n            inputRef.current.reset();\n        }\n\n        onSmsRetryClick();\n    };\n\n    const handleErrorAnimationEnd = () => {\n        if (clearCodeOnError && state !== 'INITIAL') {\n            onChangeState('INITIAL');\n        }\n    };\n\n    const clearTimer = useCallback(() => {\n        window.clearTimeout(timerId.current);\n    }, []);\n\n    useEffect(() => {\n        if (inputRef.current) {\n            inputRef.current.focus();\n        }\n\n        return () => {\n            clearTimer();\n        };\n    }, [clearTimer]);\n\n    useEffect(() => {\n        if (!inputRef.current) {\n            return;\n        }\n\n        if (prevState === 'CODE_SENDING' && state !== 'CODE_SENDING') {\n            inputRef.current.focus();\n        }\n    }, [prevState, state, requiredCharAmount]);\n\n    useLayoutEffect_SAFE_FOR_SSR(() => {\n        if (prevState === 'CODE_SENDING' && state !== 'CODE_SENDING') {\n            setCodeSendHintVisible(true);\n\n            clearTimer();\n\n            timerId.current = window.setTimeout(() => {\n                setCodeSendHintVisible(false);\n            }, CODE_SEND_HINT_VISIBLE_DURATION);\n        }\n    }, [prevState, state, clearTimer]);\n\n    const getCodeInputError = (): string | boolean => {\n        if (state === 'CODE_EXPIRED') {\n            return texts.codeErrorExpired || true;\n        }\n\n        if (state === 'CODE_EXPIRED_ENDED') {\n            return texts.codeErrorExpiredEnded || true;\n        }\n\n        if (state === 'CODE_ERROR') {\n            return texts.codeError || true;\n        }\n\n        return false;\n    };\n\n    const renderHintButton = () => {\n        if (initialScreenHintSlot) {\n            return initialScreenHintSlot;\n        }\n\n        if (mobile) {\n            return (\n                <ButtonMobile\n                    onClick={handleSmsHintLinkClick}\n                    className={styles.smsBtn}\n                    view='text'\n                    size={40}\n                >\n                    {texts.linkToHint}\n                </ButtonMobile>\n            );\n        }\n\n        return (\n            <Link\n                onClick={handleSmsHintLinkClick}\n                className={styles.smsComeLink}\n                view={mobile ? 'primary' : 'secondary'}\n                pseudo={true}\n            >\n                {texts.linkToHint}\n            </Link>\n        );\n    };\n\n    const processing = ['CODE_CHECKING', 'CODE_SENDING'].includes(state);\n\n    const timePassed = timeLeft === 0;\n\n    const ComponentCodeInput = mobile ? CodeInputMobile : CodeInputDesktop;\n\n    return (\n        <div className={cn(styles.component, styles[alignContent])}>\n            <Header mobile={mobile} titleTag={titleTag}>\n                {texts.title}\n            </Header>\n\n            {phone ? (\n                <TypographyText\n                    view='primary-medium'\n                    color='primary'\n                    className={cn(styles.phone, {\n                        [styles.typographyTheme]: !mobile,\n                        [styles.typographyThemeMobile]: mobile,\n                    })}\n                >\n                    Отправили на {phone}\n                </TypographyText>\n            ) : null}\n            <ComponentCodeInput\n                disabled={processing}\n                error={getCodeInputError()}\n                ref={inputRef}\n                fields={requiredCharAmount}\n                strictFocus={strictFocus}\n                className={cn(styles.containerInput, styles.codeInput)}\n                onComplete={handleInputComplete}\n                onChange={handleInputChange}\n                clearCodeOnError={clearCodeOnError}\n                errorVisibleDuration={errorVisibleDuration}\n                onErrorAnimationEnd={handleErrorAnimationEnd}\n            />\n            {!hideCountdownSection && (\n                <CountdownSection\n                    processing={processing}\n                    timePassed={timePassed}\n                    codeSendHintVisible={codeSendHintVisible}\n                    handleSmsRetryClick={handleSmsRetryClick}\n                    mobile={mobile}\n                />\n            )}\n\n            {renderHintButton()}\n        </div>\n    );\n};\n"],"names":["mobile","useContext","ConfirmationContext","usePrevious","useRef","useState","useCallback","useEffect","useLayoutEffect_SAFE_FOR_SSR","React","ButtonMobile","styles","Link","CodeInputMobile","CodeInputDesktop","cn","Header","TypographyText","CountdownSection"],"mappings":"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"}

package/components/screens/initial/index.css

@@ -27,64 +27,64 @@
 :root {
     --confirmation-text-color: var(--color-light-text-primary)
 }
-.confirmation__component_1cgem {
+.confirmation__component_dwua5 {
     display: flex;
     flex-direction: column;
 }
-.confirmation__phone_1cgem.confirmation__phone_1cgem {
+.confirmation__phone_dwua5.confirmation__phone_dwua5 {
     color: var(--color-light-text-primary);
     margin-bottom: var(--gap-32);
 }
-.confirmation__typographyTheme_1cgem.confirmation__typographyTheme_1cgem {
+.confirmation__typographyTheme_dwua5.confirmation__typographyTheme_dwua5 {
     font-size: 16px;
     line-height: 24px;
     font-weight: 400;
     font-family: var(--font-family-system);
     color: var(--confirmation-text-color);
 }
-.confirmation__typographyThemeMobile_1cgem.confirmation__typographyThemeMobile_1cgem {
+.confirmation__typographyThemeMobile_dwua5.confirmation__typographyThemeMobile_dwua5 {
     color: var(--color-light-text-secondary);
 }
-.confirmation__compact_1cgem {
+.confirmation__compact_dwua5 {
     margin-bottom: var(--gap-24);
 }
-.confirmation__loaderWrap_1cgem {
+.confirmation__loaderWrap_dwua5 {
     display: flex;
     align-items: center;
 }
-.confirmation__left_1cgem {
+.confirmation__left_dwua5 {
     align-items: flex-start;
 }
-.confirmation__center_1cgem {
+.confirmation__center_dwua5 {
     align-items: center;
     text-align: center;
 }
-.confirmation__center_1cgem .confirmation__loaderWrap_1cgem {
+.confirmation__center_dwua5 .confirmation__loaderWrap_dwua5 {
         justify-content: center;
     }
-.confirmation__codeInput_1cgem {
+.confirmation__codeInput_dwua5 {
     margin-bottom: var(--gap-12);
 }
-.confirmation__smsBtn_1cgem.confirmation__smsBtn_1cgem {
+.confirmation__smsBtn_dwua5.confirmation__smsBtn_dwua5 {
     min-height: var(--size-xs-height);
 }
-.confirmation__smsComeLink_1cgem.confirmation__smsComeLink_1cgem {
+.confirmation__smsComeLink_dwua5.confirmation__smsComeLink_dwua5 {
     font-size: 14px;
     line-height: 20px;
     font-weight: 500;
     font-family: var(--font-family-system);
 }
-.confirmation__countdownContainer_1cgem.confirmation__countdownContainer_1cgem {
+.confirmation__countdownContainer_dwua5.confirmation__countdownContainer_dwua5 {
     color: var(--color-light-text-secondary);
     margin-bottom: var(--gap-24);
 }
-.confirmation__countdownMobile_1cgem.confirmation__countdownMobile_1cgem {
+.confirmation__countdownMobile_dwua5.confirmation__countdownMobile_dwua5 {
     margin-bottom: var(--gap-20);
 }
-.confirmation__countdownLoaderMobile_1cgem.confirmation__countdownLoaderMobile_1cgem {
+.confirmation__countdownLoaderMobile_dwua5.confirmation__countdownLoaderMobile_dwua5 {
     margin-bottom: var(--gap-16);
 }
-.confirmation__timeCounter_1cgem {
+.confirmation__timeCounter_dwua5 {
     display: inline-block;
     min-width: 47px;
     color: var(--color-light-text-secondary);
@@ -92,14 +92,14 @@
     font-feature-settings: lining-nums tabular-nums;
     font-variant-numeric: lining-nums tabular-nums;
 }
-.confirmation__getCodeButton_1cgem {
+.confirmation__getCodeButton_dwua5 {
     position: relative;
     top: var(--gap-4-neg);
     margin-bottom: var(--gap-16);
 }
-.confirmation__getCodeButtonMobile_1cgem {
+.confirmation__getCodeButtonMobile_dwua5 {
     margin-bottom: var(--gap-0);
 }
-.confirmation__containerInput_1cgem {
+.confirmation__containerInput_dwua5 {
     min-height: 80px;
 }

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

@@ -2,7 +2,7 @@
 
 require('./index.css');
 
-var styles = {"component":"confirmation__component_1cgem","phone":"confirmation__phone_1cgem","typographyTheme":"confirmation__typographyTheme_1cgem","typographyThemeMobile":"confirmation__typographyThemeMobile_1cgem","compact":"confirmation__compact_1cgem","loaderWrap":"confirmation__loaderWrap_1cgem","left":"confirmation__left_1cgem","center":"confirmation__center_1cgem","codeInput":"confirmation__codeInput_1cgem","smsBtn":"confirmation__smsBtn_1cgem","smsComeLink":"confirmation__smsComeLink_1cgem","countdownContainer":"confirmation__countdownContainer_1cgem","countdownMobile":"confirmation__countdownMobile_1cgem","countdownLoaderMobile":"confirmation__countdownLoaderMobile_1cgem","timeCounter":"confirmation__timeCounter_1cgem","getCodeButton":"confirmation__getCodeButton_1cgem","getCodeButtonMobile":"confirmation__getCodeButtonMobile_1cgem","containerInput":"confirmation__containerInput_1cgem"};
+var styles = {"component":"confirmation__component_dwua5","phone":"confirmation__phone_dwua5","typographyTheme":"confirmation__typographyTheme_dwua5","typographyThemeMobile":"confirmation__typographyThemeMobile_dwua5","compact":"confirmation__compact_dwua5","loaderWrap":"confirmation__loaderWrap_dwua5","left":"confirmation__left_dwua5","center":"confirmation__center_dwua5","codeInput":"confirmation__codeInput_dwua5","smsBtn":"confirmation__smsBtn_dwua5","smsComeLink":"confirmation__smsComeLink_dwua5","countdownContainer":"confirmation__countdownContainer_dwua5","countdownMobile":"confirmation__countdownMobile_dwua5","countdownLoaderMobile":"confirmation__countdownLoaderMobile_dwua5","timeCounter":"confirmation__timeCounter_dwua5","getCodeButton":"confirmation__getCodeButton_dwua5","getCodeButtonMobile":"confirmation__getCodeButtonMobile_dwua5","containerInput":"confirmation__containerInput_dwua5"};
 
 module.exports = styles;
 //# sourceMappingURL=index.module.css.js.map

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

@@ -13,32 +13,32 @@
 :root {
     --confirmation-text-color: var(--color-light-text-primary)
 }
-.confirmation__component_1m709 {
+.confirmation__component_1lclb {
     display: flex;
     flex-direction: column;
 }
-.confirmation__center_1m709 {
+.confirmation__center_1lclb {
     align-items: center;
     text-align: center;
 }
-.confirmation__typographyTheme_1m709.confirmation__typographyTheme_1m709 {
+.confirmation__typographyTheme_1lclb.confirmation__typographyTheme_1lclb {
     font-size: 16px;
     line-height: 24px;
     font-weight: 400;
     font-family: var(--font-family-system);
     color: var(--confirmation-text-color);
 }
-.confirmation__typographyThemeMobile_1m709.confirmation__typographyThemeMobile_1m709 {
+.confirmation__typographyThemeMobile_1lclb.confirmation__typographyThemeMobile_1lclb {
     color: var(--color-light-text-secondary);
 }
-.confirmation__description_1m709.confirmation__description_1m709 {
+.confirmation__description_1lclb.confirmation__description_1lclb {
     margin-bottom: var(--gap-8);
 }
-.confirmation__countdownWrap_1m709 {
+.confirmation__countdownWrap_1lclb {
     display: flex;
     align-items: center;
 }
-.confirmation__timeCounter_1m709 {
+.confirmation__timeCounter_1lclb {
     display: inline-block;
     min-width: 47px;
     color: var(--color-light-text-secondary);
@@ -46,6 +46,6 @@
     font-feature-settings: lining-nums tabular-nums;
     font-variant-numeric: lining-nums tabular-nums;
 }
-.confirmation__loader_1m709 {
+.confirmation__loader_1lclb {
     margin-right: var(--gap-8);
 }

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

@@ -2,7 +2,7 @@
 
 require('./index.css');
 
-var styles = {"component":"confirmation__component_1m709","center":"confirmation__center_1m709","typographyTheme":"confirmation__typographyTheme_1m709","typographyThemeMobile":"confirmation__typographyThemeMobile_1m709","description":"confirmation__description_1m709","countdownWrap":"confirmation__countdownWrap_1m709","timeCounter":"confirmation__timeCounter_1m709","loader":"confirmation__loader_1m709"};
+var styles = {"component":"confirmation__component_1lclb","center":"confirmation__center_1lclb","typographyTheme":"confirmation__typographyTheme_1lclb","typographyThemeMobile":"confirmation__typographyThemeMobile_1lclb","description":"confirmation__description_1lclb","countdownWrap":"confirmation__countdownWrap_1lclb","timeCounter":"confirmation__timeCounter_1lclb","loader":"confirmation__loader_1lclb"};
 
 module.exports = styles;
 //# sourceMappingURL=index.module.css.js.map

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

@@ -13,24 +13,24 @@
 :root {
     --confirmation-text-color: var(--color-light-text-primary)
 }
-.confirmation__component_uzbk8 {
+.confirmation__component_dkqvd {
     display: flex;
     flex-direction: column;
 }
-.confirmation__center_uzbk8 {
+.confirmation__center_dkqvd {
     align-items: center;
     text-align: center;
 }
-.confirmation__typographyTheme_uzbk8.confirmation__typographyTheme_uzbk8 {
+.confirmation__typographyTheme_dkqvd.confirmation__typographyTheme_dkqvd {
     font-size: 16px;
     line-height: 24px;
     font-weight: 400;
     font-family: var(--font-family-system);
     color: var(--confirmation-text-color);
 }
-.confirmation__typographyThemeMobile_uzbk8.confirmation__typographyThemeMobile_uzbk8 {
+.confirmation__typographyThemeMobile_dkqvd.confirmation__typographyThemeMobile_dkqvd {
     color: var(--color-light-text-secondary);
 }
-.confirmation__button_uzbk8.confirmation__button_uzbk8 {
+.confirmation__button_dkqvd.confirmation__button_dkqvd {
     margin-top: var(--gap-32);
 }

package/components/screens/temp-block-over/index.module.css.js

@@ -2,7 +2,7 @@
 
 require('./index.css');
 
-var styles = {"component":"confirmation__component_uzbk8","center":"confirmation__center_uzbk8","typographyTheme":"confirmation__typographyTheme_uzbk8","typographyThemeMobile":"confirmation__typographyThemeMobile_uzbk8","button":"confirmation__button_uzbk8"};
+var styles = {"component":"confirmation__component_dkqvd","center":"confirmation__center_dkqvd","typographyTheme":"confirmation__typographyTheme_dkqvd","typographyThemeMobile":"confirmation__typographyThemeMobile_dkqvd","button":"confirmation__button_dkqvd"};
 
 module.exports = styles;
 //# sourceMappingURL=index.module.css.js.map

package/context.js

@@ -21,6 +21,7 @@ var ConfirmationContext = React.createContext({
     breakpoint: 1024,
     client: 'desktop',
     initialScreenHintSlot: null,
+    strictFocus: false,
     onTempBlockFinished: mockFn,
     onInputFinished: mockFn,
     onChangeState: mockFn,

package/context.js.map

@@ -1 +1 @@
-{"version":3,"file":"context.js","sources":["src/context.ts"],"sourcesContent":["import { createContext } from 'react';\n\nimport { type TConfirmationContext } from './types';\nimport { ONE_DAY, ONE_MINUTE } from './utils';\n\nconst mockFn = () => undefined;\n\nexport const ConfirmationContext = createContext<TConfirmationContext>({\n    alignContent: 'left',\n    titleTag: 'h3',\n    texts: {},\n    state: 'INITIAL',\n    screen: 'INITIAL',\n    requiredCharAmount: 5,\n    countdownDuration: ONE_MINUTE,\n    timeLeft: ONE_MINUTE,\n    tempBlockDuration: ONE_DAY,\n    phone: '',\n    hideCountdownSection: false,\n    breakpoint: 1024,\n    client: 'desktop',\n    initialScreenHintSlot: null,\n    onTempBlockFinished: mockFn,\n    onInputFinished: mockFn,\n    onChangeState: mockFn,\n    onSmsRetryClick: mockFn,\n    onChangeScreen: mockFn,\n    onFatalErrorOkButtonClick: mockFn,\n});\n"],"names":["createContext","ONE_MINUTE","ONE_DAY"],"mappings":";;;;;;;AAKA,IAAM,MAAM,GAAG,YAAA,EAAM,OAAA,SAAS,CAAA,EAAA;AAEvB,IAAM,mBAAmB,GAAGA,mBAAa,CAAuB;AACnE,IAAA,YAAY,EAAE,MAAM;AACpB,IAAA,QAAQ,EAAE,IAAI;AACd,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,SAAS;AAChB,IAAA,MAAM,EAAE,SAAS;AACjB,IAAA,kBAAkB,EAAE,CAAC;AACrB,IAAA,iBAAiB,EAAEC,gBAAU;AAC7B,IAAA,QAAQ,EAAEA,gBAAU;AACpB,IAAA,iBAAiB,EAAEC,aAAO;AAC1B,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,oBAAoB,EAAE,KAAK;AAC3B,IAAA,UAAU,EAAE,IAAI;AAChB,IAAA,MAAM,EAAE,SAAS;AACjB,IAAA,qBAAqB,EAAE,IAAI;AAC3B,IAAA,mBAAmB,EAAE,MAAM;AAC3B,IAAA,eAAe,EAAE,MAAM;AACvB,IAAA,aAAa,EAAE,MAAM;AACrB,IAAA,eAAe,EAAE,MAAM;AACvB,IAAA,cAAc,EAAE,MAAM;AACtB,IAAA,yBAAyB,EAAE,MAAM;AACpC,CAAA;;;;"}
+{"version":3,"file":"context.js","sources":["src/context.ts"],"sourcesContent":["import { createContext } from 'react';\n\nimport { type TConfirmationContext } from './types';\nimport { ONE_DAY, ONE_MINUTE } from './utils';\n\nconst mockFn = () => undefined;\n\nexport const ConfirmationContext = createContext<TConfirmationContext>({\n    alignContent: 'left',\n    titleTag: 'h3',\n    texts: {},\n    state: 'INITIAL',\n    screen: 'INITIAL',\n    requiredCharAmount: 5,\n    countdownDuration: ONE_MINUTE,\n    timeLeft: ONE_MINUTE,\n    tempBlockDuration: ONE_DAY,\n    phone: '',\n    hideCountdownSection: false,\n    breakpoint: 1024,\n    client: 'desktop',\n    initialScreenHintSlot: null,\n    strictFocus: false,\n    onTempBlockFinished: mockFn,\n    onInputFinished: mockFn,\n    onChangeState: mockFn,\n    onSmsRetryClick: mockFn,\n    onChangeScreen: mockFn,\n    onFatalErrorOkButtonClick: mockFn,\n});\n"],"names":["createContext","ONE_MINUTE","ONE_DAY"],"mappings":";;;;;;;AAKA,IAAM,MAAM,GAAG,YAAA,EAAM,OAAA,SAAS,CAAA,EAAA;AAEvB,IAAM,mBAAmB,GAAGA,mBAAa,CAAuB;AACnE,IAAA,YAAY,EAAE,MAAM;AACpB,IAAA,QAAQ,EAAE,IAAI;AACd,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,SAAS;AAChB,IAAA,MAAM,EAAE,SAAS;AACjB,IAAA,kBAAkB,EAAE,CAAC;AACrB,IAAA,iBAAiB,EAAEC,gBAAU;AAC7B,IAAA,QAAQ,EAAEA,gBAAU;AACpB,IAAA,iBAAiB,EAAEC,aAAO;AAC1B,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,oBAAoB,EAAE,KAAK;AAC3B,IAAA,UAAU,EAAE,IAAI;AAChB,IAAA,MAAM,EAAE,SAAS;AACjB,IAAA,qBAAqB,EAAE,IAAI;AAC3B,IAAA,WAAW,EAAE,KAAK;AAClB,IAAA,mBAAmB,EAAE,MAAM;AAC3B,IAAA,eAAe,EAAE,MAAM;AACvB,IAAA,aAAa,EAAE,MAAM;AACrB,IAAA,eAAe,EAAE,MAAM;AACvB,IAAA,cAAc,EAAE,MAAM;AACtB,IAAA,yBAAyB,EAAE,MAAM;AACpC,CAAA;;;;"}

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

@@ -31,8 +31,8 @@ var confirmationScreens = {
 };
 var BaseConfirmation = function (_a) {
     var _b;
-    var state = _a.state, screen = _a.screen, _c = _a.titleTag, titleTag = _c === void 0 ? 'h3' : _c, _d = _a.alignContent, alignContent = _d === void 0 ? 'left' : _d; _a.children; var _e = _a.requiredCharAmount, requiredCharAmount = _e === void 0 ? 5 : _e, _f = _a.countdownDuration, countdownDuration = _f === void 0 ? utils.ONE_MINUTE : _f, _g = _a.tempBlockDuration, tempBlockDuration = _g === void 0 ? utils.ONE_DAY : _g, phone = _a.phone, blockSmsRetry = _a.blockSmsRetry, dataTestId = _a.dataTestId, className = _a.className, maxWidth = _a.maxWidth, getScreensMap = _a.getScreensMap, onInputFinished = _a.onInputFinished, onChangeState = _a.onChangeState, onSmsRetryClick = _a.onSmsRetryClick, onChangeScreen = _a.onChangeScreen, onFatalErrorOkButtonClick = _a.onFatalErrorOkButtonClick, onTempBlockFinished = _a.onTempBlockFinished, mobile = _a.mobile, _h = _a.clearCodeOnError, clearCodeOnError = _h === void 0 ? true : _h, _j = _a.hideCountdownSection, hideCountdownSection = _j === void 0 ? false : _j, breakpoint = _a.breakpoint, client = _a.client, initialScreenHintSlot = _a.initialScreenHintSlot, errorVisibleDuration = _a.errorVisibleDuration, restProps = tslib.__rest(_a, ["state", "screen", "titleTag", "alignContent", "children", "requiredCharAmount", "countdownDuration", "tempBlockDuration", "phone", "blockSmsRetry", "dataTestId", "className", "maxWidth", "getScreensMap", "onInputFinished", "onChangeState", "onSmsRetryClick", "onChangeScreen", "onFatalErrorOkButtonClick", "onTempBlockFinished", "mobile", "clearCodeOnError", "hideCountdownSection", "breakpoint", "client", "initialScreenHintSlot", "errorVisibleDuration"]);
-    var _k = utils.useCountdown(countdownDuration), timeLeft = _k[0], startTimer = _k[1], stopTimer = _k[2];
+    var state = _a.state, screen = _a.screen, _c = _a.titleTag, titleTag = _c === void 0 ? 'h3' : _c, _d = _a.alignContent, alignContent = _d === void 0 ? 'left' : _d; _a.children; var _e = _a.requiredCharAmount, requiredCharAmount = _e === void 0 ? 5 : _e, _f = _a.countdownDuration, countdownDuration = _f === void 0 ? utils.ONE_MINUTE : _f, _g = _a.tempBlockDuration, tempBlockDuration = _g === void 0 ? utils.ONE_DAY : _g, phone = _a.phone, blockSmsRetry = _a.blockSmsRetry, dataTestId = _a.dataTestId, className = _a.className, maxWidth = _a.maxWidth, getScreensMap = _a.getScreensMap, onInputFinished = _a.onInputFinished, onChangeState = _a.onChangeState, onSmsRetryClick = _a.onSmsRetryClick, onChangeScreen = _a.onChangeScreen, onFatalErrorOkButtonClick = _a.onFatalErrorOkButtonClick, onTempBlockFinished = _a.onTempBlockFinished, mobile = _a.mobile, _h = _a.clearCodeOnError, clearCodeOnError = _h === void 0 ? true : _h, _j = _a.hideCountdownSection, hideCountdownSection = _j === void 0 ? false : _j, breakpoint = _a.breakpoint, client = _a.client, initialScreenHintSlot = _a.initialScreenHintSlot, errorVisibleDuration = _a.errorVisibleDuration, _k = _a.strictFocus, strictFocus = _k === void 0 ? false : _k, restProps = tslib.__rest(_a, ["state", "screen", "titleTag", "alignContent", "children", "requiredCharAmount", "countdownDuration", "tempBlockDuration", "phone", "blockSmsRetry", "dataTestId", "className", "maxWidth", "getScreensMap", "onInputFinished", "onChangeState", "onSmsRetryClick", "onChangeScreen", "onFatalErrorOkButtonClick", "onTempBlockFinished", "mobile", "clearCodeOnError", "hideCountdownSection", "breakpoint", "client", "initialScreenHintSlot", "errorVisibleDuration", "strictFocus"]);
+    var _l = utils.useCountdown(countdownDuration), timeLeft = _l[0], startTimer = _l[1], stopTimer = _l[2];
     var prevState = hooks.usePrevious(state);
     React.useEffect(function () {
         startTimer();
@@ -83,6 +83,7 @@ var BaseConfirmation = function (_a) {
         blockSmsRetry: blockSmsRetry,
         breakpoint: breakpoint,
         client: client,
+        strictFocus: strictFocus,
         onTempBlockFinished: onTempBlockFinished,
         onChangeState: onChangeState,
         onChangeScreen: onChangeScreen,