@alfalab/core-components 47.26.0-beta.1 → 48.0.0-beta.1

package/collapse/modern/index.css

@@ -22,24 +22,24 @@
 } :root {
     --font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica,
         sans-serif;
-} /* сбрасывает синюю подсветку при нажатии */ .collapse__collapse_coqoc {
+} /* сбрасывает синюю подсветку при нажатии */ .collapse__collapse_1e8qu {
     font-family: var(--font-family);
-} .collapse__collapse_coqoc *,
-.collapse__collapse_coqoc:before,
-.collapse__collapse_coqoc:after {
+} .collapse__collapse_1e8qu *,
+.collapse__collapse_1e8qu:before,
+.collapse__collapse_1e8qu:after {
     box-sizing: border-box;
-} .collapse__content_coqoc {
+} .collapse__content_1e8qu {
     position: relative;
     overflow: hidden;
     visibility: hidden;
     height: 0;
     transition: height 0.2s;
-} .collapse__expandedContent_coqoc {
+} .collapse__expandedContent_1e8qu {
     visibility: visible;
     height: auto;
     transform: translate3d(0, 0, 0);
-} .collapse__expandedLabel_coqoc.collapse__expandedLabel_coqoc {
+} .collapse__expandedLabel_1e8qu.collapse__expandedLabel_1e8qu {
     margin-top: 15px;
-} .collapse__toggleIcon_coqoc {
+} .collapse__toggleIcon_1e8qu {
     margin: var(--gap-4);
 }

package/collapse/modern/index.d.ts

@@ -1 +1 @@
-export * from './Component';
+export * from "./Component";

package/collapse/moderncssm/Component.d.ts

@@ -1,5 +1,6 @@
+/// <reference types="react" />
 import React from 'react';
-export declare type CollapseProps = {
+type CollapseProps = {
     /**
      * Состояние компонента
      *
@@ -49,4 +50,5 @@ export declare type CollapseProps = {
      */
     dataTestId?: string;
 };
-export declare const Collapse: React.ForwardRefExoticComponent<CollapseProps & React.RefAttributes<HTMLDivElement>>;
+declare const Collapse: React.ForwardRefExoticComponent<CollapseProps & React.RefAttributes<HTMLDivElement>>;
+export { CollapseProps, Collapse };

package/collapse/moderncssm/index.d.ts

@@ -1 +1 @@
-export * from './Component';
+export * from "./Component";

package/comment/Component.d.ts

@@ -1,5 +1,7 @@
-import React, { ReactNode } from 'react';
-export declare type CommentProps = {
+/// <reference types="react" />
+import React from 'react';
+import { ReactNode } from "react";
+type CommentProps = {
     /**
      * Количество строк
      */
@@ -17,4 +19,5 @@ export declare type CommentProps = {
      */
     children?: ReactNode;
 };
-export declare const Comment: React.FC<CommentProps>;
+declare const Comment: React.FC<CommentProps>;
+export { CommentProps, Comment };

package/comment/Component.js

@@ -9,7 +9,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var styles = {"component":"comment__component_qwmd","rowLimit2":"comment__rowLimit2_qwmd","rowLimit5":"comment__rowLimit5_qwmd"};
+var styles = {"component":"comment__component_1skry","rowLimit2":"comment__rowLimit2_1skry","rowLimit5":"comment__rowLimit5_1skry"};
 require('./index.css');
 
 var Comment = function (_a) {

package/comment/cssm/Component.d.ts

@@ -1,5 +1,7 @@
-import React, { ReactNode } from 'react';
-export declare type CommentProps = {
+/// <reference types="react" />
+import React from 'react';
+import { ReactNode } from "react";
+type CommentProps = {
     /**
      * Количество строк
      */
@@ -17,4 +19,5 @@ export declare type CommentProps = {
      */
     children?: ReactNode;
 };
-export declare const Comment: React.FC<CommentProps>;
+declare const Comment: React.FC<CommentProps>;
+export { CommentProps, Comment };

package/comment/cssm/index.d.ts

@@ -1 +1 @@
-export * from './Component';
+export * from "./Component";

package/comment/esm/Component.d.ts

@@ -1,5 +1,7 @@
-import React, { ReactNode } from 'react';
-export declare type CommentProps = {
+/// <reference types="react" />
+import React from 'react';
+import { ReactNode } from "react";
+type CommentProps = {
     /**
      * Количество строк
      */
@@ -17,4 +19,5 @@ export declare type CommentProps = {
      */
     children?: ReactNode;
 };
-export declare const Comment: React.FC<CommentProps>;
+declare const Comment: React.FC<CommentProps>;
+export { CommentProps, Comment };

package/comment/esm/Component.js

@@ -2,7 +2,7 @@ import React from 'react';
 import cn from 'classnames';
 import { Typography } from '../../typography/esm';
 
-var styles = {"component":"comment__component_qwmd","rowLimit2":"comment__rowLimit2_qwmd","rowLimit5":"comment__rowLimit5_qwmd"};
+var styles = {"component":"comment__component_1skry","rowLimit2":"comment__rowLimit2_1skry","rowLimit5":"comment__rowLimit5_1skry"};
 require('./index.css');
 
 var Comment = function (_a) {

package/comment/esm/index.css

@@ -25,19 +25,19 @@
     --gap-16: var(--gap-m);
 } :root {
 } :root {
-} /* сбрасывает синюю подсветку при нажатии */ .comment__component_qwmd {
+} /* сбрасывает синюю подсветку при нажатии */ .comment__component_1skry {
     width: -moz-fit-content;
     width: fit-content;
     padding: 10px var(--gap-16);
     background-color: var(--color-light-neutral-100);
     border-radius: var(--border-radius-4) var(--border-radius-20) var(--border-radius-20)
         var(--border-radius-20);
-} .comment__rowLimit2_qwmd {
+} .comment__rowLimit2_1skry {
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
-} .comment__rowLimit5_qwmd {
+} .comment__rowLimit5_1skry {
     display: -webkit-box;
     -webkit-line-clamp: 5;
     -webkit-box-orient: vertical;

package/comment/esm/index.d.ts

@@ -1 +1 @@
-export * from './Component';
+export * from "./Component";

package/comment/index.css

@@ -25,19 +25,19 @@
     --gap-16: var(--gap-m);
 } :root {
 } :root {
-} /* сбрасывает синюю подсветку при нажатии */ .comment__component_qwmd {
+} /* сбрасывает синюю подсветку при нажатии */ .comment__component_1skry {
     width: -moz-fit-content;
     width: fit-content;
     padding: 10px var(--gap-16);
     background-color: var(--color-light-neutral-100);
     border-radius: var(--border-radius-4) var(--border-radius-20) var(--border-radius-20)
         var(--border-radius-20);
-} .comment__rowLimit2_qwmd {
+} .comment__rowLimit2_1skry {
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
-} .comment__rowLimit5_qwmd {
+} .comment__rowLimit5_1skry {
     display: -webkit-box;
     -webkit-line-clamp: 5;
     -webkit-box-orient: vertical;

package/comment/index.d.ts

@@ -1 +1 @@
-export * from './Component';
+export * from "./Component";

package/comment/modern/Component.d.ts

@@ -1,5 +1,7 @@
-import React, { ReactNode } from 'react';
-export declare type CommentProps = {
+/// <reference types="react" />
+import React from 'react';
+import { ReactNode } from "react";
+type CommentProps = {
     /**
      * Количество строк
      */
@@ -17,4 +19,5 @@ export declare type CommentProps = {
      */
     children?: ReactNode;
 };
-export declare const Comment: React.FC<CommentProps>;
+declare const Comment: React.FC<CommentProps>;
+export { CommentProps, Comment };

package/comment/modern/Component.js

@@ -2,7 +2,7 @@ import React from 'react';
 import cn from 'classnames';
 import { Typography } from '../../typography/modern';
 
-const styles = {"component":"comment__component_qwmd","rowLimit2":"comment__rowLimit2_qwmd","rowLimit5":"comment__rowLimit5_qwmd"};
+const styles = {"component":"comment__component_1skry","rowLimit2":"comment__rowLimit2_1skry","rowLimit5":"comment__rowLimit5_1skry"};
 require('./index.css');
 
 const Comment = ({ className, dataTestId, children, rowLimit }) => {

package/comment/modern/index.css

@@ -25,19 +25,19 @@
     --gap-16: var(--gap-m);
 } :root {
 } :root {
-} /* сбрасывает синюю подсветку при нажатии */ .comment__component_qwmd {
+} /* сбрасывает синюю подсветку при нажатии */ .comment__component_1skry {
     width: -moz-fit-content;
     width: fit-content;
     padding: 10px var(--gap-16);
     background-color: var(--color-light-neutral-100);
     border-radius: var(--border-radius-4) var(--border-radius-20) var(--border-radius-20)
         var(--border-radius-20);
-} .comment__rowLimit2_qwmd {
+} .comment__rowLimit2_1skry {
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
-} .comment__rowLimit5_qwmd {
+} .comment__rowLimit5_1skry {
     display: -webkit-box;
     -webkit-line-clamp: 5;
     -webkit-box-orient: vertical;

package/comment/modern/index.d.ts

@@ -1 +1 @@
-export * from './Component';
+export * from "./Component";

package/comment/moderncssm/Component.d.ts

@@ -1,5 +1,7 @@
-import React, { ReactNode } from 'react';
-export declare type CommentProps = {
+/// <reference types="react" />
+import React from 'react';
+import { ReactNode } from "react";
+type CommentProps = {
     /**
      * Количество строк
      */
@@ -17,4 +19,5 @@ export declare type CommentProps = {
      */
     children?: ReactNode;
 };
-export declare const Comment: React.FC<CommentProps>;
+declare const Comment: React.FC<CommentProps>;
+export { CommentProps, Comment };

package/comment/moderncssm/index.d.ts

@@ -1 +1 @@
-export * from './Component';
+export * from "./Component";

package/confirmation/component.responsive.d.ts

@@ -1,14 +1,20 @@
 import { FC } from 'react';
-import { ConfirmationProps } from './types';
-export declare type ResponsiveConfirmationProps = Omit<ConfirmationProps, 'confirmationScreens' | 'breakpoint'> & {
+import { ConfirmationProps } from "./types";
+type ResponsiveConfirmationProps = Omit<ConfirmationProps, 'confirmationScreens' | 'breakpoint'> & {
     /**
      * Контрольная точка, с нее начинается desktop версия
      * @default 1024
      */
     breakpoint?: number;
+    /**
+     * Версия, которая будет использоваться при серверном рендеринге
+     */
+    client?: 'desktop' | 'mobile';
     /**
      * Значение по-умолчанию для хука useMatchMedia
+     * @deprecated Используйте client
      */
     defaultMatchMediaValue?: boolean | (() => boolean);
 };
-export declare const ConfirmationResponsive: FC<ResponsiveConfirmationProps>;
+declare const ConfirmationResponsive: FC<ResponsiveConfirmationProps>;
+export { ResponsiveConfirmationProps, ConfirmationResponsive };

package/confirmation/component.responsive.js

@@ -3,7 +3,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var tslib = require('tslib');
 var React = require('react');
 var coreComponentsMq = require('../mq');
-var coreComponentsShared = require('../shared');
 var desktop_component_desktop = require('./desktop/component.desktop.js');
 var mobile_component_mobile = require('./mobile/component.mobile.js');
 
@@ -12,8 +11,8 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
 var ConfirmationResponsive = function (_a) {
-    var _b = _a.breakpoint, breakpoint = _b === void 0 ? coreComponentsShared.getComponentBreakpoint() : _b, _c = _a.defaultMatchMediaValue, defaultMatchMediaValue = _c === void 0 ? true : _c, restProps = tslib.__rest(_a, ["breakpoint", "defaultMatchMediaValue"]);
-    var isDesktop = coreComponentsMq.useMatchMedia("(min-width: ".concat(breakpoint, "px)"), defaultMatchMediaValue)[0];
+    var breakpoint = _a.breakpoint, client = _a.client, _b = _a.defaultMatchMediaValue, defaultMatchMediaValue = _b === void 0 ? client === undefined ? undefined : client === 'desktop' : _b, restProps = tslib.__rest(_a, ["breakpoint", "client", "defaultMatchMediaValue"]);
+    var isDesktop = coreComponentsMq.useIsDesktop(breakpoint, defaultMatchMediaValue);
     return isDesktop ? (React__default.default.createElement(desktop_component_desktop.ConfirmationDesktop, tslib.__assign({}, restProps))) : (React__default.default.createElement(mobile_component_mobile.ConfirmationMobile, tslib.__assign({ breakpoint: breakpoint }, restProps)));
 };
 

package/confirmation/components/base-confirmation/component.d.ts

@@ -1,3 +1,4 @@
 import { FC } from 'react';
-import { ConfirmationProps } from '../../types';
-export declare const BaseConfirmation: FC<ConfirmationProps>;
+import { ConfirmationProps } from "../../types";
+declare const BaseConfirmation: FC<ConfirmationProps>;
+export { BaseConfirmation };

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

@@ -3,7 +3,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var tslib = require('tslib');
 var React = require('react');
 var cn = require('classnames');
-var coreComponentsShared = require('../../../shared');
 var hooks = require('@alfalab/hooks');
 var context = require('../../context.js');
 var types = require('../../types.js');
@@ -18,7 +17,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var styles = {"component":"confirmation__component_yzi3i"};
+var styles = {"component":"confirmation__component_vfpwn"};
 require('./index.css');
 
 var confirmationScreens = {
@@ -28,8 +27,8 @@ var confirmationScreens = {
     TEMP_BLOCK: components_screens_tempBlock_component.TempBlock,
 };
 var BaseConfirmation = function (_a) {
-    var state = _a.state, screen = _a.screen, _b = _a.alignContent, alignContent = _b === void 0 ? 'left' : _b; _a.children; var _c = _a.requiredCharAmount, requiredCharAmount = _c === void 0 ? 5 : _c, _d = _a.countdownDuration, countdownDuration = _d === void 0 ? utils.ONE_MINUTE : _d, _e = _a.tempBlockDuration, tempBlockDuration = _e === void 0 ? utils.ONE_DAY : _e, phone = _a.phone, blockSmsRetry = _a.blockSmsRetry, dataTestId = _a.dataTestId, className = _a.className, getScreensMap = _a.getScreensMap, onInputFinished = _a.onInputFinished, onChangeState = _a.onChangeState, onSmsRetryClick = _a.onSmsRetryClick, onChangeScreen = _a.onChangeScreen, onFatalErrorOkButtonClick = _a.onFatalErrorOkButtonClick, onTempBlockFinished = _a.onTempBlockFinished, mobile = _a.mobile, _f = _a.clearCodeOnError, clearCodeOnError = _f === void 0 ? true : _f, _g = _a.hideCountdownSection, hideCountdownSection = _g === void 0 ? false : _g, _h = _a.breakpoint, breakpoint = _h === void 0 ? coreComponentsShared.getComponentBreakpoint() : _h, initialScreenHintSlot = _a.initialScreenHintSlot, errorVisibleDuration = _a.errorVisibleDuration, restProps = tslib.__rest(_a, ["state", "screen", "alignContent", "children", "requiredCharAmount", "countdownDuration", "tempBlockDuration", "phone", "blockSmsRetry", "dataTestId", "className", "getScreensMap", "onInputFinished", "onChangeState", "onSmsRetryClick", "onChangeScreen", "onFatalErrorOkButtonClick", "onTempBlockFinished", "mobile", "clearCodeOnError", "hideCountdownSection", "breakpoint", "initialScreenHintSlot", "errorVisibleDuration"]);
-    var _j = utils.useCountdown(countdownDuration), timeLeft = _j[0], startTimer = _j[1], stopTimer = _j[2];
+    var state = _a.state, screen = _a.screen, _b = _a.alignContent, alignContent = _b === void 0 ? 'left' : _b; _a.children; var _c = _a.requiredCharAmount, requiredCharAmount = _c === void 0 ? 5 : _c, _d = _a.countdownDuration, countdownDuration = _d === void 0 ? utils.ONE_MINUTE : _d, _e = _a.tempBlockDuration, tempBlockDuration = _e === void 0 ? utils.ONE_DAY : _e, phone = _a.phone, blockSmsRetry = _a.blockSmsRetry, dataTestId = _a.dataTestId, className = _a.className, getScreensMap = _a.getScreensMap, onInputFinished = _a.onInputFinished, onChangeState = _a.onChangeState, onSmsRetryClick = _a.onSmsRetryClick, onChangeScreen = _a.onChangeScreen, onFatalErrorOkButtonClick = _a.onFatalErrorOkButtonClick, onTempBlockFinished = _a.onTempBlockFinished, mobile = _a.mobile, _f = _a.clearCodeOnError, clearCodeOnError = _f === void 0 ? true : _f, _g = _a.hideCountdownSection, hideCountdownSection = _g === void 0 ? false : _g, breakpoint = _a.breakpoint, client = _a.client, initialScreenHintSlot = _a.initialScreenHintSlot, errorVisibleDuration = _a.errorVisibleDuration, restProps = tslib.__rest(_a, ["state", "screen", "alignContent", "children", "requiredCharAmount", "countdownDuration", "tempBlockDuration", "phone", "blockSmsRetry", "dataTestId", "className", "getScreensMap", "onInputFinished", "onChangeState", "onSmsRetryClick", "onChangeScreen", "onFatalErrorOkButtonClick", "onTempBlockFinished", "mobile", "clearCodeOnError", "hideCountdownSection", "breakpoint", "client", "initialScreenHintSlot", "errorVisibleDuration"]);
+    var _h = utils.useCountdown(countdownDuration), timeLeft = _h[0], startTimer = _h[1], stopTimer = _h[2];
     var prevState = hooks.usePrevious(state);
     React.useEffect(function () {
         startTimer();
@@ -77,6 +76,7 @@ var BaseConfirmation = function (_a) {
         phone: phone,
         blockSmsRetry: blockSmsRetry,
         breakpoint: breakpoint,
+        client: client,
         onTempBlockFinished: onTempBlockFinished,
         onChangeState: onChangeState,
         onChangeScreen: onChangeScreen,

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

@@ -20,7 +20,7 @@
     --gap-0: 0;
 } :root {
 } :root {
-} /* сбрасывает синюю подсветку при нажатии */ .confirmation__component_yzi3i {
+} /* сбрасывает синюю подсветку при нажатии */ .confirmation__component_vfpwn {
     width: 100%;
     max-width: 388px;
     margin: var(--gap-0) auto;

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

@@ -1 +1 @@
-export * from './component';
+export * from "./component";

package/confirmation/components/countdown-loader/component.d.ts

@@ -1,7 +1,7 @@
 import { FC } from 'react';
-declare type Props = {
+type Props = {
     progress: number;
     className?: string;
 };
-export declare const CountdownLoader: FC<Props>;
-export {};
+declare const CountdownLoader: FC<Props>;
+export { CountdownLoader };

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

@@ -6,7 +6,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
-var styles = {"circle":"confirmation__circle_ofjrp"};
+var styles = {"circle":"confirmation__circle_10my4"};
 require('./index.css');
 
 var SIZE = 16;

package/confirmation/components/countdown-loader/index.css

@@ -19,7 +19,7 @@
     /* новые значения, используйте их */
 } :root {
 } :root {
-} /* сбрасывает синюю подсветку при нажатии */ .confirmation__circle_ofjrp {
+} /* сбрасывает синюю подсветку при нажатии */ .confirmation__circle_10my4 {
     fill: transparent;
     stroke: var(--color-light-neutral-500);
     stroke-width: 2px;

package/confirmation/components/countdown-loader/index.d.ts

@@ -1 +1 @@
-export * from './component';
+export * from "./component";

package/confirmation/components/header/component.d.ts

@@ -1,5 +1,5 @@
 import { FC, ReactNode } from 'react';
-export declare type HeaderProps = {
+type HeaderProps = {
     /**
      * Контент шапки
      */
@@ -9,4 +9,5 @@ export declare type HeaderProps = {
      */
     mobile?: boolean;
 };
-export declare const Header: FC<HeaderProps>;
+declare const Header: FC<HeaderProps>;
+export { HeaderProps, Header };

package/confirmation/components/header/component.js

@@ -9,7 +9,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var styles = {"header":"confirmation__header_qkme6","typography":"confirmation__typography_qkme6","typographyMobile":"confirmation__typographyMobile_qkme6"};
+var styles = {"header":"confirmation__header_1dubh","typography":"confirmation__typography_1dubh","typographyMobile":"confirmation__typographyMobile_1dubh"};
 require('./index.css');
 
 var Header = function (_a) {

package/confirmation/components/header/index.css

@@ -39,15 +39,15 @@
 
     /* header */
     --confirmation-header-font-feature-settings: normal
-} .confirmation__header_qkme6.confirmation__header_qkme6 {
+} .confirmation__header_1dubh.confirmation__header_1dubh {
     margin-bottom: var(--gap-24);
-} .confirmation__typography_qkme6.confirmation__typography_qkme6.confirmation__typography_qkme6 {
+} .confirmation__typography_1dubh.confirmation__typography_1dubh.confirmation__typography_1dubh {
     font-feature-settings: var(--confirmation-header-font-feature-settings);
     font-size: var(--confirmation-header-desktop-font-size);
     line-height: var(--confirmation-header-desktop-line-height);
     font-weight: var(--confirmation-header-desktop-font-weight);
     font-family: var(--confirmation-header-desktop-font-family);
-} .confirmation__typographyMobile_qkme6.confirmation__typographyMobile_qkme6.confirmation__typographyMobile_qkme6 {
+} .confirmation__typographyMobile_1dubh.confirmation__typographyMobile_1dubh.confirmation__typographyMobile_1dubh {
     font-feature-settings: var(--confirmation-header-font-feature-settings);
     font-size: var(--confirmation-header-mobile-font-size);
     line-height: var(--confirmation-header-mobile-line-height);

package/confirmation/components/header/index.d.ts

@@ -1 +1 @@
-export * from './component';
+export * from "./component";

package/confirmation/components/index.d.ts

@@ -1,2 +1,2 @@
-export * from './screens';
-export * from './countdown-loader';
+export * from "./screens/index";
+export * from "./countdown-loader/index";

package/confirmation/components/screens/fatal-error/component.d.ts

@@ -1,8 +1,9 @@
 import { FC } from 'react';
-export declare type FatalErrorProps = {
+type FatalErrorProps = {
     /**
      * Отображать в мобильной версии экран компонента
      */
     mobile?: boolean;
 };
-export declare const FatalError: FC<FatalErrorProps>;
+declare const FatalError: FC<FatalErrorProps>;
+export { FatalErrorProps, FatalError };

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

@@ -12,20 +12,20 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var styles = {"component":"confirmation__component_gkck3","typographyTheme":"confirmation__typographyTheme_gkck3","typographyThemeMobile":"confirmation__typographyThemeMobile_gkck3","left":"confirmation__left_gkck3","center":"confirmation__center_gkck3","button":"confirmation__button_gkck3"};
+var styles = {"component":"confirmation__component_13u1n","typographyTheme":"confirmation__typographyTheme_13u1n","typographyThemeMobile":"confirmation__typographyThemeMobile_13u1n","left":"confirmation__left_13u1n","center":"confirmation__center_13u1n","button":"confirmation__button_13u1n"};
 require('./index.css');
 
 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, breakpoint = _c.breakpoint;
+    var _c = React.useContext(context.ConfirmationContext), alignContent = _c.alignContent, texts = _c.texts, onFatalErrorOkButtonClick = _c.onFatalErrorOkButtonClick, breakpoint = _c.breakpoint, client = _c.client;
     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.fatalErrorTitle),
         React__default.default.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', color: 'primary', className: cn__default.default((_b = {},
                 _b[styles.typographyTheme] = !mobile,
                 _b[styles.typographyThemeMobile] = mobile,
                 _b)) }, texts.fatalErrorDescription),
-        React__default.default.createElement(coreComponentsButton.Button, { size: mobile ? 'xs' : 's', view: 'secondary', onClick: onFatalErrorOkButtonClick, className: styles.button, breakpoint: breakpoint }, texts.fatalErrorButton)));
+        React__default.default.createElement(coreComponentsButton.Button, { size: mobile ? 'xs' : 's', view: 'secondary', onClick: onFatalErrorOkButtonClick, className: styles.button, breakpoint: breakpoint, client: client }, texts.fatalErrorButton)));
 };
 
 exports.FatalError = FatalError;

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

@@ -37,22 +37,22 @@
     --confirmation-text-color: var(--color-light-text-primary)
 
     /* header */
-} .confirmation__component_gkck3 {
+} .confirmation__component_13u1n {
     display: flex;
     flex-direction: column;
-} .confirmation__typographyTheme_gkck3.confirmation__typographyTheme_gkck3 {
+} .confirmation__typographyTheme_13u1n.confirmation__typographyTheme_13u1n {
     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__typographyThemeMobile_gkck3.confirmation__typographyThemeMobile_gkck3 {
+} .confirmation__typographyThemeMobile_13u1n.confirmation__typographyThemeMobile_13u1n {
     color: var(--color-light-text-secondary);
-} .confirmation__left_gkck3 {
+} .confirmation__left_13u1n {
     align-items: flex-start;
-} .confirmation__center_gkck3 {
+} .confirmation__center_13u1n {
     align-items: center;
     text-align: center;
-} .confirmation__button_gkck3.confirmation__button_gkck3 {
+} .confirmation__button_13u1n.confirmation__button_13u1n {
     margin-top: var(--gap-32);
 }

package/confirmation/components/screens/fatal-error/index.d.ts

@@ -1 +1 @@
-export * from './component';
+export * from "./component";

package/confirmation/components/screens/hint/component.d.ts

@@ -1,8 +1,9 @@
 import { FC } from 'react';
-export declare type HintProps = {
+type HintProps = {
     /**
      * Отображать в мобильной версии экран компонента
      */
     mobile?: boolean;
 };
-export declare const Hint: FC<HintProps>;
+declare const Hint: FC<HintProps>;
+export { HintProps, Hint };

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

@@ -13,13 +13,13 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var styles = {"component":"confirmation__component_hrpid","center":"confirmation__center_hrpid","text":"confirmation__text_hrpid","typographyTheme":"confirmation__typographyTheme_hrpid","typographyThemeMobile":"confirmation__typographyThemeMobile_hrpid","phonesWrap":"confirmation__phonesWrap_hrpid","phoneWrap":"confirmation__phoneWrap_hrpid","phoneLink":"confirmation__phoneLink_hrpid","hintButton":"confirmation__hintButton_hrpid","phoneContentMobile":"confirmation__phoneContentMobile_hrpid"};
+var styles = {"component":"confirmation__component_e7xbi","center":"confirmation__center_e7xbi","text":"confirmation__text_e7xbi","typographyTheme":"confirmation__typographyTheme_e7xbi","typographyThemeMobile":"confirmation__typographyThemeMobile_e7xbi","phonesWrap":"confirmation__phonesWrap_e7xbi","phoneWrap":"confirmation__phoneWrap_e7xbi","phoneLink":"confirmation__phoneLink_e7xbi","hintButton":"confirmation__hintButton_e7xbi","phoneContentMobile":"confirmation__phoneContentMobile_e7xbi"};
 require('./index.css');
 
 var Hint = function (_a) {
     var _b, _c, _d, _e, _f, _g, _h, _j, _k;
     var mobile = _a.mobile;
-    var _l = React.useContext(context.ConfirmationContext), alignContent = _l.alignContent, texts = _l.texts, onChangeScreen = _l.onChangeScreen, onChangeState = _l.onChangeState, breakpoint = _l.breakpoint;
+    var _l = React.useContext(context.ConfirmationContext), alignContent = _l.alignContent, texts = _l.texts, onChangeScreen = _l.onChangeScreen, onChangeState = _l.onChangeState, breakpoint = _l.breakpoint, client = _l.client;
     var handleReturnButtonClick = function () {
         onChangeScreen('INITIAL');
         onChangeState('INITIAL');
@@ -53,7 +53,7 @@ var Hint = function (_a) {
                 _k[styles.typographyTheme] = !mobile,
                 _k[styles.typographyThemeMobile] = mobile,
                 _k)) }, "\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.hintButton, breakpoint: breakpoint }, texts.hintButton)));
+        React__default.default.createElement(coreComponentsButton.Button, { size: mobile ? 'xs' : 's', view: 'secondary', onClick: handleReturnButtonClick, className: styles.hintButton, breakpoint: breakpoint, client: client }, texts.hintButton)));
 };
 
 exports.Hint = Hint;