@qiwi/pijma-mobile 1.154.2 → 1.156.0

package/README.md

@@ -16,7 +16,7 @@ yarn add @qiwi/pijma-mobile
 import React from 'react'
 import {cache, themes, fonts, reset, CacheProvider, ThemeProvider, Global, Button, TextField} from '@qiwi/pijma-mobile'
 
-export const App: React.FC = () => (
+export const App = () => (
   <CacheProvider value={cache}>
     <ThemeProvider theme={themes.orange}>
       <Global styles={[reset, fonts]}/>

package/lib/dts/actions/Actions.d.ts

@@ -1,6 +1,6 @@
-import { FunctionComponent, ReactNode } from 'react';
+import { FC, ReactNode } from 'react';
 export interface ActionsProps {
     size: 'accent' | 'normal' | 'minor';
     children?: ReactNode;
 }
-export declare const Actions: FunctionComponent<ActionsProps>;
+export declare const Actions: FC<ActionsProps>;

package/lib/dts/block-accordion/BlockAccordion.d.ts

@@ -1,4 +1,4 @@
-import { FunctionComponent, ReactNode } from 'react';
+import { FC, ReactNode } from 'react';
 export interface BlockAccordionProps<I> {
     items: I[];
     opened: number[];
@@ -9,4 +9,4 @@ export interface BlockAccordionItemModel {
     title: string;
     content: ReactNode;
 }
-export declare const BlockAccordion: FunctionComponent<BlockAccordionProps<BlockAccordionItemModel>>;
+export declare const BlockAccordion: FC<BlockAccordionProps<BlockAccordionItemModel>>;

package/lib/dts/button/Button.d.ts

@@ -1,4 +1,4 @@
-import { FunctionComponent, ReactElement } from 'react';
+import { FC, ReactElement } from 'react';
 export interface ButtonProps {
     onClick?: () => void;
     onFocus?: () => void;
@@ -14,4 +14,4 @@ export interface ButtonProps {
     stub?: boolean;
     radius?: number;
 }
-export declare const Button: FunctionComponent<ButtonProps>;
+export declare const Button: FC<ButtonProps>;

package/lib/dts/checkbox/Checkbox.d.ts

@@ -1,3 +1,3 @@
-import { FunctionComponent } from 'react';
+import { FC } from 'react';
 import { CheckboxProps } from './CheckboxProps';
-export declare const Checkbox: FunctionComponent<CheckboxProps>;
+export declare const Checkbox: FC<CheckboxProps>;

package/lib/dts/checkbox-field/CheckboxField.d.ts

@@ -1,4 +1,4 @@
-import { FunctionComponent } from 'react';
+import { FC } from 'react';
 import { CheckboxFieldOptionModel } from './CheckboxFieldOptionModel';
 import { CheckboxFieldProps } from './CheckboxFieldProps';
-export declare const CheckboxField: FunctionComponent<CheckboxFieldProps<CheckboxFieldOptionModel<any>, any>>;
+export declare const CheckboxField: FC<CheckboxFieldProps<CheckboxFieldOptionModel<any>, any>>;

package/lib/dts/code-field/CodeField.d.ts

@@ -1,3 +1,3 @@
-import React from 'react';
+import { FC } from 'react';
 import { CodeFieldProps } from './CodeFieldProps';
-export declare const CodeField: React.FC<CodeFieldProps>;
+export declare const CodeField: FC<CodeFieldProps>;

package/lib/dts/drop-up/DropUp.d.ts

@@ -1,4 +1,4 @@
-import React, { FunctionComponent, ReactNode } from 'react';
+import { FC, KeyboardEventHandler, ReactNode } from 'react';
 export interface DropUpProps {
     show: boolean;
     onShow?: () => void;
@@ -8,7 +8,7 @@ export interface DropUpProps {
     title: string;
     footer?: ReactNode;
     autoFocus?: boolean;
-    onKeyDown?: React.KeyboardEventHandler;
+    onKeyDown?: KeyboardEventHandler;
     children?: ReactNode;
 }
-export declare const DropUp: FunctionComponent<DropUpProps>;
+export declare const DropUp: FC<DropUpProps>;

package/lib/dts/hint/Hint.d.ts

@@ -0,0 +1,8 @@
+import { FC, ReactNode } from 'react';
+export interface HintProps {
+    show: boolean;
+    children: ReactNode;
+    onShow: () => void;
+    onHide: () => void;
+}
+export declare const Hint: FC<HintProps>;

package/lib/dts/hint/index.d.ts

@@ -0,0 +1 @@
+export * from './Hint';

package/lib/dts/input-modal/InputModal.d.ts

@@ -1,4 +1,4 @@
-import React, { ChangeEventHandler, FocusEventHandler, FunctionComponent, KeyboardEventHandler, MouseEventHandler, ReactNode, RefObject } from 'react';
+import { ChangeEventHandler, FC, FocusEventHandler, KeyboardEventHandler, MouseEventHandler, ReactNode, RefObject } from 'react';
 interface InputModalProps {
     value: string;
     tabIndex?: number;
@@ -15,10 +15,10 @@ interface InputModalProps {
     onBlur?: FocusEventHandler;
     onBack?: MouseEventHandler;
     onSubmit?: MouseEventHandler;
-    onShow?: React.MouseEventHandler;
+    onShow?: () => void;
     onHide?: () => void;
     onEscape?: () => void;
     children?: ReactNode;
 }
-export declare const InputModal: FunctionComponent<InputModalProps>;
+export declare const InputModal: FC<InputModalProps>;
 export {};

package/lib/dts/list/List.d.ts

@@ -1,8 +1,8 @@
-import { FunctionComponent, ReactNode } from 'react';
+import { FC, ReactNode } from 'react';
 export interface ListProps {
     children: ReactNode[];
     type: 'step' | 'number' | 'bullet';
     size?: 's' | 'm' | 'l';
     stub?: boolean;
 }
-export declare const List: FunctionComponent<ListProps>;
+export declare const List: FC<ListProps>;

package/lib/dts/modal/SimpleModal.d.ts

@@ -1,4 +1,4 @@
-import { FunctionComponent, ReactNode } from 'react';
+import { FC, ReactNode } from 'react';
 interface SimpleModalProps {
     show: boolean;
     closable?: boolean;
@@ -10,5 +10,5 @@ interface SimpleModalProps {
     onHide?: () => void;
     children?: ReactNode;
 }
-export declare const SimpleModal: FunctionComponent<SimpleModalProps>;
+export declare const SimpleModal: FC<SimpleModalProps>;
 export {};

package/lib/dts/pagination/Pagination.d.ts

@@ -1,4 +1,4 @@
-import { FunctionComponent } from 'react';
+import { FC } from 'react';
 export interface PaginationProps {
     total: number;
     active: number;
@@ -8,4 +8,4 @@ export interface PaginationProps {
     stub?: boolean;
     onChange?: (index: number) => void;
 }
-export declare const Pagination: FunctionComponent<PaginationProps>;
+export declare const Pagination: FC<PaginationProps>;

package/lib/dts/password-field/PasswordField.d.ts

@@ -1,3 +1,3 @@
-import { FunctionComponent } from 'react';
+import { FC } from 'react';
 import { PasswordFieldProps } from './PasswordFieldProps';
-export declare const PasswordField: FunctionComponent<PasswordFieldProps>;
+export declare const PasswordField: FC<PasswordFieldProps>;

package/lib/dts/phone-field/PhoneField.d.ts

@@ -1,3 +1,3 @@
-import { FunctionComponent } from 'react';
+import { FC } from 'react';
 import { PhoneFieldProps } from './PhoneFieldProps';
-export declare const PhoneField: FunctionComponent<PhoneFieldProps>;
+export declare const PhoneField: FC<PhoneFieldProps>;

package/lib/dts/radio-field/RadioField.d.ts

@@ -1,4 +1,4 @@
-import { FunctionComponent } from 'react';
+import { FC } from 'react';
 import { RadioFieldOptionModel } from './RadioFieldOptionModel';
 import { RadioFieldProps } from './RadioFieldProps';
-export declare const RadioField: FunctionComponent<RadioFieldProps<RadioFieldOptionModel<any>, any>>;
+export declare const RadioField: FC<RadioFieldProps<RadioFieldOptionModel<any>, any>>;

package/lib/dts/select-field/SelectField.d.ts

@@ -1,5 +1,5 @@
 import { OptionModel } from '@qiwi/pijma-core';
-import { FunctionComponent, ReactNode } from 'react';
+import { FC, ReactNode } from 'react';
 export interface SelectFieldProps<I extends OptionModel<V>, V> {
     items: I[];
     title: string;
@@ -20,4 +20,4 @@ export interface SelectFieldProps<I extends OptionModel<V>, V> {
 export interface SelectFieldItemModel<V> extends OptionModel<V> {
     text: string;
 }
-export declare const SelectField: FunctionComponent<SelectFieldProps<SelectFieldItemModel<any>, any>>;
+export declare const SelectField: FC<SelectFieldProps<SelectFieldItemModel<any>, any>>;

package/lib/dts/switch/Switch.d.ts

@@ -1,3 +1,3 @@
-import { FunctionComponent } from 'react';
+import { FC } from 'react';
 import { SwitchProps } from './SwitchProps';
-export declare const Switch: FunctionComponent<SwitchProps>;
+export declare const Switch: FC<SwitchProps>;

package/lib/dts/switch-field/SwitchField.d.ts

@@ -1,4 +1,4 @@
-import { FunctionComponent } from 'react';
+import { FC } from 'react';
 import { SwitchFieldOptionModel } from './SwitchFieldOptionModel';
 import { SwitchFieldProps } from './SwitchFieldProps';
-export declare const SwitchField: FunctionComponent<SwitchFieldProps<SwitchFieldOptionModel<any>, any>>;
+export declare const SwitchField: FC<SwitchFieldProps<SwitchFieldOptionModel<any>, any>>;

package/lib/dts/text-area-field/TextAreaField.d.ts

@@ -16,7 +16,7 @@ export interface TextAreaFieldProps {
     onChange?: (value: string) => void;
     onFocus?: () => void;
     onBlur?: () => void;
-    onKeyDown?: (event: KeyboardEvent) => boolean;
-    onKeyUp?: (event: KeyboardEvent) => boolean;
+    onKeyDown?: (event: KeyboardEvent<HTMLTextAreaElement>) => boolean;
+    onKeyUp?: (event: KeyboardEvent<HTMLTextAreaElement>) => boolean;
 }
 export declare const TextAreaField: FC<TextAreaFieldProps>;

package/lib/dts/text-field/TextField.d.ts

@@ -1,3 +1,3 @@
-import { FunctionComponent } from 'react';
+import { FC } from 'react';
 import { TextFieldProps } from './TextFieldProps';
-export declare const TextField: FunctionComponent<TextFieldProps>;
+export declare const TextField: FC<TextFieldProps>;

package/lib/dts/typography/Caption.d.ts

@@ -1,5 +1,5 @@
 import { TypoProps } from '@qiwi/pijma-core';
-import { FunctionComponent, ReactNode } from 'react';
+import { FC, ReactNode } from 'react';
 export interface CaptionProps {
     color?: 'default' | 'support' | 'inverse';
     align?: TypoProps['align'];
@@ -7,4 +7,4 @@ export interface CaptionProps {
     stub?: boolean;
     children?: ReactNode;
 }
-export declare const Caption: FunctionComponent<CaptionProps>;
+export declare const Caption: FC<CaptionProps>;

package/lib/dts/typography/Heading.d.ts

@@ -1,5 +1,5 @@
 import { TypoProps } from '@qiwi/pijma-core';
-import { FunctionComponent, ReactNode } from 'react';
+import { FC, ReactNode } from 'react';
 export interface HeadingProps {
     tag?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
     size: '1' | '2' | '3' | '4';
@@ -9,4 +9,4 @@ export interface HeadingProps {
     stub?: boolean;
     children?: ReactNode;
 }
-export declare const Heading: FunctionComponent<HeadingProps>;
+export declare const Heading: FC<HeadingProps>;

package/lib/dts/typography/Paragraph.d.ts

@@ -1,5 +1,5 @@
 import { TypoProps } from '@qiwi/pijma-core';
-import { FunctionComponent, ReactNode } from 'react';
+import { FC, ReactNode } from 'react';
 export interface ParagraphProps {
     size?: 's' | 'm' | 'l';
     bold?: boolean;
@@ -11,4 +11,4 @@ export interface ParagraphProps {
     stub?: boolean;
     children?: ReactNode;
 }
-export declare const Paragraph: FunctionComponent<ParagraphProps>;
+export declare const Paragraph: FC<ParagraphProps>;

package/lib/dts/typography/Text.d.ts

@@ -1,5 +1,5 @@
 import { TypoProps } from '@qiwi/pijma-core';
-import { FunctionComponent, ReactNode } from 'react';
+import { FC, ReactNode } from 'react';
 export interface TextProps {
     display?: 'block' | 'inline' | 'inline-block';
     size?: 's' | 'm' | 'l';
@@ -14,4 +14,4 @@ export interface TextProps {
     stub?: boolean;
     children?: ReactNode;
 }
-export declare const Text: FunctionComponent<TextProps>;
+export declare const Text: FC<TextProps>;

package/lib/dts/typography/Title.d.ts

@@ -1,5 +1,5 @@
 import { TypoProps } from '@qiwi/pijma-core';
-import { FunctionComponent, ReactNode } from 'react';
+import { FC, ReactNode } from 'react';
 export interface TitleProps {
     tag?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
     size: '1' | '2';
@@ -9,4 +9,4 @@ export interface TitleProps {
     clamp?: number;
     children?: ReactNode;
 }
-export declare const Title: FunctionComponent<TitleProps>;
+export declare const Title: FC<TitleProps>;

package/lib/es5/button/Button.js

@@ -158,7 +158,7 @@ var Button = function(props) {
                                     height: iconSize[props.size],
                                     transition: "all 300ms cubic-bezier(0.4, 0.0, 0.2, 1)",
                                     transform: "translateZ(0)",
-                                    children: /*#__PURE__*/ _react.default.cloneElement(props.icon, {
+                                    children: /*#__PURE__*/ (0, _react.cloneElement)(props.icon, {
                                         color: props.disabled ? "#666" : props.kind === "brand" ? "#fff" : "#000",
                                         size: 1
                                     })

package/lib/es5/code-field/CodeField.js

@@ -84,21 +84,11 @@ var CodeField = function(_param) {
                                     disabled: props.disabled || loading,
                                     ref: item.ref,
                                     value: loading ? "" : props.value[index],
-                                    onChange: function(e) {
-                                        return item.onChange(e, index);
-                                    },
-                                    onClick: function(e) {
-                                        return item.onClick(e, index);
-                                    },
-                                    onFocus: function(e) {
-                                        return item.onFocus(e, index);
-                                    },
-                                    onBlur: function(e) {
-                                        return item.onBlur(e, index);
-                                    },
-                                    onKeyDown: function(e) {
-                                        return renderProps.onKeyDown(e, index);
-                                    }
+                                    onChange: item.onChange,
+                                    onClick: item.onClick,
+                                    onFocus: item.onFocus,
+                                    onBlur: item.onBlur,
+                                    onKeyDown: item.onKeyDown
                                 })
                             }, index);
                         })

package/lib/es5/drop-up/DropUp.js

@@ -14,14 +14,6 @@ var _jsxRuntime = require("react/jsx-runtime");
 var _pijmaCore = require("@qiwi/pijma-core");
 var _react = /*#__PURE__*/ _interopRequireDefault(require("react"));
 var _typography = require("../typography/index.js");
-var ContentTransitionVertical = function(props) {
-    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.SimpleTransition, _extends({}, props));
-};
-ContentTransitionVertical.displayName = "ContentTransitionVertical";
-var ContentTransitionHorizontal = function(props) {
-    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.SimpleTransition, _extends({}, props));
-};
-ContentTransitionHorizontal.displayName = "ContentTransitionHorizontal";
 var translate3d = {
     vertical: "0, 100%, 0",
     horizontal: "100%, 0, 0"
@@ -48,30 +40,35 @@ var defaultProps = function(direction) {
         }
     };
 };
-ContentTransitionVertical.defaultProps = defaultProps("vertical");
-ContentTransitionHorizontal.defaultProps = defaultProps("horizontal");
+var ContentTransitionVertical = function(props) {
+    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.SimpleTransition, _extends({}, props, defaultProps("vertical")));
+};
+ContentTransitionVertical.displayName = "ContentTransitionVertical";
+var ContentTransitionHorizontal = function(props) {
+    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.SimpleTransition, _extends({}, props, defaultProps("horizontal")));
+};
+ContentTransitionHorizontal.displayName = "ContentTransitionHorizontal";
 var BackdropTransition = function(props) {
-    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.SimpleTransition, _extends({}, props));
+    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.SimpleTransition, _extends({}, props, {
+        timeout: {
+            enter: 370,
+            exit: 250
+        },
+        enterClassName: function(timeout) {
+            return (0, _pijmaCore.css)({
+                opacity: 1,
+                transition: "opacity " + timeout + "ms ease"
+            });
+        },
+        exitClassName: function(timeout) {
+            return (0, _pijmaCore.css)({
+                opacity: 0,
+                transition: "opacity " + timeout + "ms ease"
+            });
+        }
+    }));
 };
 BackdropTransition.displayName = "BackdropTransition";
-BackdropTransition.defaultProps = {
-    timeout: {
-        enter: 370,
-        exit: 250
-    },
-    enterClassName: function(timeout) {
-        return (0, _pijmaCore.css)({
-            opacity: 1,
-            transition: "opacity " + timeout + "ms ease"
-        });
-    },
-    exitClassName: function(timeout) {
-        return (0, _pijmaCore.css)({
-            opacity: 0,
-            transition: "opacity " + timeout + "ms ease"
-        });
-    }
-};
 var FlexPosCard = (0, _pijmaCore.styled)(_pijmaCore.FlexPos)().withComponent(_pijmaCore.Card);
 FlexPosCard.displayName = "FlexPosCard";
 var DropUp = function(props) {

package/lib/es5/header/HeaderMenu.js

@@ -43,25 +43,21 @@ var defaultProps = function(direction) {
     };
 };
 var ContentTransitionTop = function(props) {
-    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.SimpleTransition, _extends({}, props));
+    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.SimpleTransition, _extends({}, props, defaultProps("top")));
 };
+ContentTransitionTop.displayName = "ContentTransitionTop";
 var ContentTransitionRight = function(props) {
-    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.SimpleTransition, _extends({}, props));
+    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.SimpleTransition, _extends({}, props, defaultProps("right")));
 };
+ContentTransitionRight.displayName = "ContentTransitionRight";
 var ContentTransitionBottom = function(props) {
-    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.SimpleTransition, _extends({}, props));
+    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.SimpleTransition, _extends({}, props, defaultProps("bottom")));
 };
+ContentTransitionBottom.displayName = "ContentTransitionBottom";
 var ContentTransitionLeft = function(props) {
-    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.SimpleTransition, _extends({}, props));
+    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.SimpleTransition, _extends({}, props, defaultProps("left")));
 };
-ContentTransitionTop.displayName = "ContentTransitionTop";
-ContentTransitionRight.displayName = "ContentTransitionRight";
-ContentTransitionBottom.displayName = "ContentTransitionBottom";
 ContentTransitionLeft.displayName = "ContentTransitionLeft";
-ContentTransitionTop.defaultProps = defaultProps("top");
-ContentTransitionRight.defaultProps = defaultProps("right");
-ContentTransitionBottom.defaultProps = defaultProps("bottom");
-ContentTransitionLeft.defaultProps = defaultProps("left");
 var ContentTransition = {
     top: ContentTransitionTop,
     right: ContentTransitionRight,

package/lib/es5/hint/Hint.js

@@ -0,0 +1,45 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "Hint", {
+    enumerable: true,
+    get: function() {
+        return Hint;
+    }
+});
+var _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
+var _jsxRuntime = require("react/jsx-runtime");
+var _pijmaCore = require("@qiwi/pijma-core");
+var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+var _modal = require("../modal/index.js");
+var _typography = require("../typography/index.js");
+var Hint = function(param) {
+    var children = param.children, show = param.show, onShow = param.onShow, onHide = param.onHide;
+    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.HintControl, {
+        show: show,
+        onShow: onShow,
+        children: function(renderProps) {
+            return /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_react.Fragment, {
+                children: [
+                    /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.Box, {
+                        cursor: "pointer",
+                        onClick: renderProps.onClick,
+                        ref: renderProps.target,
+                        width: 6,
+                        height: 6,
+                        children: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.QuestionIcon, {})
+                    }),
+                    /*#__PURE__*/ (0, _jsxRuntime.jsx)(_modal.SimpleModal, {
+                        closable: true,
+                        show: renderProps.show,
+                        onHide: onHide,
+                        children: typeof children === "string" ? /*#__PURE__*/ (0, _jsxRuntime.jsx)(_typography.Paragraph, {
+                            children: children
+                        }) : children
+                    })
+                ]
+            });
+        }
+    });
+};

package/lib/es5/hint/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+var _exportStar = require("@swc/helpers/lib/_export_star.js").default;
+_exportStar(require("./Hint.js"), exports);

package/lib/es5/input-modal/InputModal.js

@@ -14,29 +14,28 @@ var _jsxRuntime = require("react/jsx-runtime");
 var _pijmaCore = require("@qiwi/pijma-core");
 var _react = /*#__PURE__*/ _interopRequireDefault(require("react"));
 var ContentTransition = function(props) {
-    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.SimpleTransition, _extends({}, props));
+    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.SimpleTransition, _extends({}, props, {
+        timeout: {
+            enter: 370,
+            exit: 250
+        },
+        enterClassName: function(timeout) {
+            return (0, _pijmaCore.css)({
+                opacity: 1,
+                transform: "translate3d(0, 0, 0)",
+                transition: "opacity " + timeout + "ms ease, transform " + timeout + "ms ease"
+            });
+        },
+        exitClassName: function(timeout) {
+            return (0, _pijmaCore.css)({
+                opacity: 0,
+                transform: "translate3d(0, -100%, 0)",
+                transition: "opacity " + timeout + "ms ease, transform " + timeout + "ms ease"
+            });
+        }
+    }));
 };
 ContentTransition.displayName = "ContentTransition";
-ContentTransition.defaultProps = {
-    timeout: {
-        enter: 370,
-        exit: 250
-    },
-    enterClassName: function(timeout) {
-        return (0, _pijmaCore.css)({
-            opacity: 1,
-            transform: "translate3d(0, 0, 0)",
-            transition: "opacity " + timeout + "ms ease, transform " + timeout + "ms ease"
-        });
-    },
-    exitClassName: function(timeout) {
-        return (0, _pijmaCore.css)({
-            opacity: 0,
-            transform: "translate3d(0, -100%, 0)",
-            transition: "opacity " + timeout + "ms ease, transform " + timeout + "ms ease"
-        });
-    }
-};
 var PosFlexCard = (0, _pijmaCore.styled)(_pijmaCore.CardPos)().withComponent(_pijmaCore.Flex);
 PosFlexCard.displayName = "PosFlexCard";
 var InputModal = function(props) {

package/lib/es5/markdown/Markdown.js

@@ -120,8 +120,8 @@ var del = function(param) {
 del.displayName = "del";
 var li = function(param) {
     var size = param.size, children = param.children;
-    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_react.default.Fragment, {
-        children: _react.default.Children.map(children, function(child, i) {
+    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_react.Fragment, {
+        children: _react.Children.map(children, function(child, i) {
             return /*#__PURE__*/ (0, _jsxRuntime.jsx)(MarkdownBox, {
                 mt: SizeMargin[size],
                 children: typeof child === "string" ? /*#__PURE__*/ (0, _jsxRuntime.jsx)(_typography.Paragraph, {

package/lib/es5/modal/SimpleModal.js

@@ -14,51 +14,49 @@ var _jsxRuntime = require("react/jsx-runtime");
 var _pijmaCore = require("@qiwi/pijma-core");
 var _react = /*#__PURE__*/ _interopRequireDefault(require("react"));
 var ContentTransition = function(props) {
-    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.SimpleTransition, _extends({}, props));
+    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.SimpleTransition, _extends({}, props, {
+        timeout: {
+            enter: 370,
+            exit: 250
+        },
+        enterClassName: function(timeout) {
+            return (0, _pijmaCore.css)({
+                opacity: 1,
+                transform: "translate3d(0, 0, 0)",
+                transition: "opacity " + timeout + "ms ease, transform " + timeout + "ms ease"
+            });
+        },
+        exitClassName: function(timeout) {
+            return (0, _pijmaCore.css)({
+                opacity: 0,
+                transform: "translate3d(0, -100%, 0)",
+                transition: "opacity " + timeout + "ms ease, transform " + timeout + "ms ease"
+            });
+        }
+    }));
 };
 ContentTransition.displayName = "ContentTransition";
-ContentTransition.defaultProps = {
-    timeout: {
-        enter: 370,
-        exit: 250
-    },
-    enterClassName: function(timeout) {
-        return (0, _pijmaCore.css)({
-            opacity: 1,
-            transform: "translate3d(0, 0, 0)",
-            transition: "opacity " + timeout + "ms ease, transform " + timeout + "ms ease"
-        });
-    },
-    exitClassName: function(timeout) {
-        return (0, _pijmaCore.css)({
-            opacity: 0,
-            transform: "translate3d(0, -100%, 0)",
-            transition: "opacity " + timeout + "ms ease, transform " + timeout + "ms ease"
-        });
-    }
-};
 var BackdropTransition = function(props) {
-    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.SimpleTransition, _extends({}, props));
+    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.SimpleTransition, _extends({}, props, {
+        timeout: {
+            enter: 370,
+            exit: 250
+        },
+        enterClassName: function(timeout) {
+            return (0, _pijmaCore.css)({
+                opacity: 1,
+                transition: "opacity " + timeout + "ms ease"
+            });
+        },
+        exitClassName: function(timeout) {
+            return (0, _pijmaCore.css)({
+                opacity: 0,
+                transition: "opacity " + timeout + "ms ease"
+            });
+        }
+    }));
 };
 BackdropTransition.displayName = "BackdropTransition";
-BackdropTransition.defaultProps = {
-    timeout: {
-        enter: 370,
-        exit: 250
-    },
-    enterClassName: function(timeout) {
-        return (0, _pijmaCore.css)({
-            opacity: 1,
-            transition: "opacity " + timeout + "ms ease"
-        });
-    },
-    exitClassName: function(timeout) {
-        return (0, _pijmaCore.css)({
-            opacity: 0,
-            transition: "opacity " + timeout + "ms ease"
-        });
-    }
-};
 var SimpleModal = function(param) {
     var stub = param.stub, children = param.children, show = param.show, escapeClose = param.escapeClose, onShow = param.onShow, onHide = param.onHide, backdropClose = param.backdropClose, _zIndex = param.zIndex, zIndex = _zIndex === void 0 ? 10050 : _zIndex, closable = param.closable;
     return stub ? /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.Box, {

package/lib/es5/suggest-field/SuggestField.js

@@ -37,8 +37,8 @@ var SuggestField = function(_param) {
         value: props.value,
         suggest: props.suggest,
         items: props.items,
-        total: /*#__PURE__*/ _react.default.isValidElement(props.total) || typeof props.total === "string" ? undefined : props.total,
-        empty: /*#__PURE__*/ _react.default.isValidElement(props.empty) || typeof props.empty === "string" ? undefined : props.empty,
+        total: /*#__PURE__*/ (0, _react.isValidElement)(props.total) || typeof props.total === "string" ? undefined : props.total,
+        empty: /*#__PURE__*/ (0, _react.isValidElement)(props.empty) || typeof props.empty === "string" ? undefined : props.empty,
         equals: equals,
         onRequest: props.onRequest,
         onChange: props.onChange,
@@ -140,7 +140,7 @@ var SuggestField = function(_param) {
                                         }) : null,
                                         props.total && menuRenderProps.items.length > 0 ? /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.Box, {
                                             px: 6,
-                                            children: /*#__PURE__*/ _react.default.isValidElement(props.total) ? props.total : typeof props.total === "string" ? /*#__PURE__*/ (0, _jsxRuntime.jsx)(_markdown.Markdown, {
+                                            children: /*#__PURE__*/ (0, _react.isValidElement)(props.total) ? props.total : typeof props.total === "string" ? /*#__PURE__*/ (0, _jsxRuntime.jsx)(_markdown.Markdown, {
                                                 children: props.total
                                             }) : /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_typography.Paragraph, {
                                                 children: [
@@ -158,7 +158,7 @@ var SuggestField = function(_param) {
                                             })
                                         }) : props.empty && menuRenderProps.items.length === 0 && props.items !== undefined ? /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pijmaCore.Box, {
                                             px: 6,
-                                            children: /*#__PURE__*/ _react.default.isValidElement(props.empty) ? props.empty : typeof props.empty === "string" ? /*#__PURE__*/ (0, _jsxRuntime.jsx)(_markdown.Markdown, {
+                                            children: /*#__PURE__*/ (0, _react.isValidElement)(props.empty) ? props.empty : typeof props.empty === "string" ? /*#__PURE__*/ (0, _jsxRuntime.jsx)(_markdown.Markdown, {
                                                 children: props.empty
                                             }) : /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_typography.Paragraph, {
                                                 children: [

package/lib/es6/button/Button.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Btn, ButtonControl, Card, Flex, FlexItem, Pos, Spinner, Stub, Typo, useTheme } from '@qiwi/pijma-core';
-import React, { Fragment } from 'react';
+import React, { cloneElement, Fragment } from 'react';
 const buttonSize = {
     accent: 12,
     normal: 10,
@@ -145,7 +145,7 @@ export const Button = (props)=>{
                                     height: iconSize[props.size],
                                     transition: "all 300ms cubic-bezier(0.4, 0.0, 0.2, 1)",
                                     transform: "translateZ(0)",
-                                    children: /*#__PURE__*/ React.cloneElement(props.icon, {
+                                    children: /*#__PURE__*/ cloneElement(props.icon, {
                                         color: props.disabled ? '#666' : props.kind === 'brand' ? '#fff' : '#000',
                                         size: 1
                                     })

package/lib/es6/code-field/CodeField.js

@@ -60,11 +60,11 @@ export const CodeField = ({ length =4 , autoFocus =false , loading =false , type
                                     disabled: props.disabled || loading,
                                     ref: item.ref,
                                     value: loading ? '' : props.value[index],
-                                    onChange: (e)=>item.onChange(e, index),
-                                    onClick: (e)=>item.onClick(e, index),
-                                    onFocus: (e)=>item.onFocus(e, index),
-                                    onBlur: (e)=>item.onBlur(e, index),
-                                    onKeyDown: (e)=>renderProps.onKeyDown(e, index)
+                                    onChange: item.onChange,
+                                    onClick: item.onClick,
+                                    onFocus: item.onFocus,
+                                    onBlur: item.onBlur,
+                                    onKeyDown: item.onKeyDown
                                 })
                             }, index))
                     }),

package/lib/es6/drop-up/DropUp.js

@@ -2,14 +2,6 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Box, Card, css, Flex, FlexItem, FlexPos, Icon, Modal, Pos, SimpleTransition, styled } from '@qiwi/pijma-core';
 import React from 'react';
 import { Paragraph } from '../typography/index.js';
-const ContentTransitionVertical = (props)=>/*#__PURE__*/ _jsx(SimpleTransition, {
-        ...props
-    });
-ContentTransitionVertical.displayName = 'ContentTransitionVertical';
-const ContentTransitionHorizontal = (props)=>/*#__PURE__*/ _jsx(SimpleTransition, {
-        ...props
-    });
-ContentTransitionHorizontal.displayName = 'ContentTransitionHorizontal';
 const translate3d = {
     vertical: '0, 100%, 0',
     horizontal: '100%, 0, 0'
@@ -30,26 +22,32 @@ const defaultProps = (direction)=>({
                 transition: `opacity ${timeout}ms ease, transform ${timeout}ms ease`
             })
     });
-ContentTransitionVertical.defaultProps = defaultProps('vertical');
-ContentTransitionHorizontal.defaultProps = defaultProps('horizontal');
+const ContentTransitionVertical = (props)=>/*#__PURE__*/ _jsx(SimpleTransition, {
+        ...props,
+        ...defaultProps('vertical')
+    });
+ContentTransitionVertical.displayName = 'ContentTransitionVertical';
+const ContentTransitionHorizontal = (props)=>/*#__PURE__*/ _jsx(SimpleTransition, {
+        ...props,
+        ...defaultProps('horizontal')
+    });
+ContentTransitionHorizontal.displayName = 'ContentTransitionHorizontal';
 const BackdropTransition = (props)=>/*#__PURE__*/ _jsx(SimpleTransition, {
-        ...props
+        ...props,
+        timeout: {
+            enter: 370,
+            exit: 250
+        },
+        enterClassName: (timeout)=>css({
+                opacity: 1,
+                transition: `opacity ${timeout}ms ease`
+            }),
+        exitClassName: (timeout)=>css({
+                opacity: 0,
+                transition: `opacity ${timeout}ms ease`
+            })
     });
 BackdropTransition.displayName = 'BackdropTransition';
-BackdropTransition.defaultProps = {
-    timeout: {
-        enter: 370,
-        exit: 250
-    },
-    enterClassName: (timeout)=>css({
-            opacity: 1,
-            transition: `opacity ${timeout}ms ease`
-        }),
-    exitClassName: (timeout)=>css({
-            opacity: 0,
-            transition: `opacity ${timeout}ms ease`
-        })
-};
 const FlexPosCard = styled(FlexPos)().withComponent(Card);
 FlexPosCard.displayName = 'FlexPosCard';
 export const DropUp = (props)=>/*#__PURE__*/ _jsx(Modal, {

package/lib/es6/header/HeaderMenu.js

@@ -25,25 +25,25 @@ const defaultProps = (direction)=>({
             })
     });
 const ContentTransitionTop = (props)=>/*#__PURE__*/ _jsx(SimpleTransition, {
-        ...props
+        ...props,
+        ...defaultProps('top')
     });
+ContentTransitionTop.displayName = 'ContentTransitionTop';
 const ContentTransitionRight = (props)=>/*#__PURE__*/ _jsx(SimpleTransition, {
-        ...props
+        ...props,
+        ...defaultProps('right')
     });
+ContentTransitionRight.displayName = 'ContentTransitionRight';
 const ContentTransitionBottom = (props)=>/*#__PURE__*/ _jsx(SimpleTransition, {
-        ...props
+        ...props,
+        ...defaultProps('bottom')
     });
+ContentTransitionBottom.displayName = 'ContentTransitionBottom';
 const ContentTransitionLeft = (props)=>/*#__PURE__*/ _jsx(SimpleTransition, {
-        ...props
+        ...props,
+        ...defaultProps('left')
     });
-ContentTransitionTop.displayName = 'ContentTransitionTop';
-ContentTransitionRight.displayName = 'ContentTransitionRight';
-ContentTransitionBottom.displayName = 'ContentTransitionBottom';
 ContentTransitionLeft.displayName = 'ContentTransitionLeft';
-ContentTransitionTop.defaultProps = defaultProps('top');
-ContentTransitionRight.defaultProps = defaultProps('right');
-ContentTransitionBottom.defaultProps = defaultProps('bottom');
-ContentTransitionLeft.defaultProps = defaultProps('left');
 const ContentTransition = {
     top: ContentTransitionTop,
     right: ContentTransitionRight,

package/lib/es6/hint/Hint.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, HintControl, QuestionIcon } from '@qiwi/pijma-core';
+import React, { Fragment } from 'react';
+import { SimpleModal } from '../modal/index.js';
+import { Paragraph } from '../typography/index.js';
+export const Hint = ({ children , show , onShow , onHide  })=>/*#__PURE__*/ _jsx(HintControl, {
+        show: show,
+        onShow: onShow,
+        children: (renderProps)=>/*#__PURE__*/ _jsxs(Fragment, {
+                children: [
+                    /*#__PURE__*/ _jsx(Box, {
+                        cursor: "pointer",
+                        onClick: renderProps.onClick,
+                        ref: renderProps.target,
+                        width: 6,
+                        height: 6,
+                        children: /*#__PURE__*/ _jsx(QuestionIcon, {})
+                    }),
+                    /*#__PURE__*/ _jsx(SimpleModal, {
+                        closable: true,
+                        show: renderProps.show,
+                        onHide: onHide,
+                        children: typeof children === 'string' ? /*#__PURE__*/ _jsx(Paragraph, {
+                            children: children
+                        }) : children
+                    })
+                ]
+            })
+    });

package/lib/es6/hint/index.js

@@ -0,0 +1 @@
+export * from './Hint.js';

package/lib/es6/input-modal/InputModal.js

@@ -2,25 +2,23 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { BoxPos, Card, CardPos, css, Flex, FlexItem, Icon, Input, Modal, Pos, SimpleTransition, styled } from '@qiwi/pijma-core';
 import React from 'react';
 const ContentTransition = (props)=>/*#__PURE__*/ _jsx(SimpleTransition, {
-        ...props
+        ...props,
+        timeout: {
+            enter: 370,
+            exit: 250
+        },
+        enterClassName: (timeout)=>css({
+                opacity: 1,
+                transform: 'translate3d(0, 0, 0)',
+                transition: `opacity ${timeout}ms ease, transform ${timeout}ms ease`
+            }),
+        exitClassName: (timeout)=>css({
+                opacity: 0,
+                transform: 'translate3d(0, -100%, 0)',
+                transition: `opacity ${timeout}ms ease, transform ${timeout}ms ease`
+            })
     });
 ContentTransition.displayName = 'ContentTransition';
-ContentTransition.defaultProps = {
-    timeout: {
-        enter: 370,
-        exit: 250
-    },
-    enterClassName: (timeout)=>css({
-            opacity: 1,
-            transform: 'translate3d(0, 0, 0)',
-            transition: `opacity ${timeout}ms ease, transform ${timeout}ms ease`
-        }),
-    exitClassName: (timeout)=>css({
-            opacity: 0,
-            transform: 'translate3d(0, -100%, 0)',
-            transition: `opacity ${timeout}ms ease, transform ${timeout}ms ease`
-        })
-};
 const PosFlexCard = styled(CardPos)().withComponent(Flex);
 PosFlexCard.displayName = 'PosFlexCard';
 export const InputModal = (props)=>/*#__PURE__*/ _jsx(Modal, {

package/lib/es6/markdown/Markdown.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Box, Image, MarkdownToJSX, styled } from '@qiwi/pijma-core';
-import React, { Children } from 'react';
+import React, { Children, Fragment } from 'react';
 import { Link } from '../link/index.js';
 import { List } from '../list/index.js';
 import { Heading, Paragraph, Text } from '../typography/index.js';
@@ -79,8 +79,8 @@ const del = ({ children  })=>/*#__PURE__*/ _jsx(Text, {
         children: children
     });
 del.displayName = 'del';
-const li = ({ size , children  })=>/*#__PURE__*/ _jsx(React.Fragment, {
-        children: React.Children.map(children, (child, i)=>/*#__PURE__*/ _jsx(MarkdownBox, {
+const li = ({ size , children  })=>/*#__PURE__*/ _jsx(Fragment, {
+        children: Children.map(children, (child, i)=>/*#__PURE__*/ _jsx(MarkdownBox, {
                 mt: SizeMargin[size],
                 children: typeof child === 'string' ? /*#__PURE__*/ _jsx(Paragraph, {
                     size: size,

package/lib/es6/modal/SimpleModal.js

@@ -2,43 +2,39 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Box, Card, css, Icon, Modal, Pos, SimpleTransition } from '@qiwi/pijma-core';
 import React from 'react';
 const ContentTransition = (props)=>/*#__PURE__*/ _jsx(SimpleTransition, {
-        ...props
+        ...props,
+        timeout: {
+            enter: 370,
+            exit: 250
+        },
+        enterClassName: (timeout)=>css({
+                opacity: 1,
+                transform: 'translate3d(0, 0, 0)',
+                transition: `opacity ${timeout}ms ease, transform ${timeout}ms ease`
+            }),
+        exitClassName: (timeout)=>css({
+                opacity: 0,
+                transform: 'translate3d(0, -100%, 0)',
+                transition: `opacity ${timeout}ms ease, transform ${timeout}ms ease`
+            })
     });
 ContentTransition.displayName = 'ContentTransition';
-ContentTransition.defaultProps = {
-    timeout: {
-        enter: 370,
-        exit: 250
-    },
-    enterClassName: (timeout)=>css({
-            opacity: 1,
-            transform: 'translate3d(0, 0, 0)',
-            transition: `opacity ${timeout}ms ease, transform ${timeout}ms ease`
-        }),
-    exitClassName: (timeout)=>css({
-            opacity: 0,
-            transform: 'translate3d(0, -100%, 0)',
-            transition: `opacity ${timeout}ms ease, transform ${timeout}ms ease`
-        })
-};
 const BackdropTransition = (props)=>/*#__PURE__*/ _jsx(SimpleTransition, {
-        ...props
+        ...props,
+        timeout: {
+            enter: 370,
+            exit: 250
+        },
+        enterClassName: (timeout)=>css({
+                opacity: 1,
+                transition: `opacity ${timeout}ms ease`
+            }),
+        exitClassName: (timeout)=>css({
+                opacity: 0,
+                transition: `opacity ${timeout}ms ease`
+            })
     });
 BackdropTransition.displayName = 'BackdropTransition';
-BackdropTransition.defaultProps = {
-    timeout: {
-        enter: 370,
-        exit: 250
-    },
-    enterClassName: (timeout)=>css({
-            opacity: 1,
-            transition: `opacity ${timeout}ms ease`
-        }),
-    exitClassName: (timeout)=>css({
-            opacity: 0,
-            transition: `opacity ${timeout}ms ease`
-        })
-};
 export const SimpleModal = ({ stub , children , show , escapeClose , onShow , onHide , backdropClose , zIndex =10050 , closable ,  })=>stub ? /*#__PURE__*/ _jsx(Box, {
         display: "none",
         children: children

package/lib/es6/suggest-field/SuggestField.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { BasicInput, Box, Card, Image, InputField, MenuControl, Pos, Spacer, styled, SuggestControl } from '@qiwi/pijma-core';
-import React, { Fragment } from 'react';
+import React, { Fragment, isValidElement } from 'react';
 import { InputModal } from '../input-modal/index.js';
 import { Link } from '../link/index.js';
 import { Markdown } from '../markdown/index.js';
@@ -19,8 +19,8 @@ export const SuggestField = ({ equals =(a, b)=>a === b , ...props })=>props.stub
         value: props.value,
         suggest: props.suggest,
         items: props.items,
-        total: /*#__PURE__*/ React.isValidElement(props.total) || typeof props.total === 'string' ? undefined : props.total,
-        empty: /*#__PURE__*/ React.isValidElement(props.empty) || typeof props.empty === 'string' ? undefined : props.empty,
+        total: /*#__PURE__*/ isValidElement(props.total) || typeof props.total === 'string' ? undefined : props.total,
+        empty: /*#__PURE__*/ isValidElement(props.empty) || typeof props.empty === 'string' ? undefined : props.empty,
         equals: equals,
         onRequest: props.onRequest,
         onChange: props.onChange,
@@ -116,7 +116,7 @@ export const SuggestField = ({ equals =(a, b)=>a === b , ...props })=>props.stub
                                         }) : null,
                                         props.total && menuRenderProps.items.length > 0 ? /*#__PURE__*/ _jsx(Box, {
                                             px: 6,
-                                            children: /*#__PURE__*/ React.isValidElement(props.total) ? props.total : typeof props.total === 'string' ? /*#__PURE__*/ _jsx(Markdown, {
+                                            children: /*#__PURE__*/ isValidElement(props.total) ? props.total : typeof props.total === 'string' ? /*#__PURE__*/ _jsx(Markdown, {
                                                 children: props.total
                                             }) : /*#__PURE__*/ _jsxs(Paragraph, {
                                                 children: [
@@ -134,7 +134,7 @@ export const SuggestField = ({ equals =(a, b)=>a === b , ...props })=>props.stub
                                             })
                                         }) : props.empty && menuRenderProps.items.length === 0 && props.items !== undefined ? /*#__PURE__*/ _jsx(Box, {
                                             px: 6,
-                                            children: /*#__PURE__*/ React.isValidElement(props.empty) ? props.empty : typeof props.empty === 'string' ? /*#__PURE__*/ _jsx(Markdown, {
+                                            children: /*#__PURE__*/ isValidElement(props.empty) ? props.empty : typeof props.empty === 'string' ? /*#__PURE__*/ _jsx(Markdown, {
                                                 children: props.empty
                                             }) : /*#__PURE__*/ _jsxs(Paragraph, {
                                                 children: [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qiwi/pijma-mobile",
-  "version": "1.154.2",
+  "version": "1.156.0",
   "type": "module",
   "main": "./lib/es5/index.js",
   "module": "./lib/es6/index.js",
@@ -37,27 +37,24 @@
     "lib"
   ],
   "dependencies": {
-    "@qiwi/pijma-core": "1.155.2"
+    "@qiwi/pijma-core": "1.157.0"
   },
   "devDependencies": {
-    "@qiwi/pijma-infra": "1.9.1",
-    "concurrently": "7.2.2",
-    "css-loader": "4.3.0",
-    "eslint": "8.19.0",
-    "eslint-config-qiwi": "1.17.3",
+    "@qiwi/pijma-infra": "1.10.0",
+    "concurrently": "7.3.0",
+    "css-loader": "6.7.1",
+    "eslint": "8.21.0",
+    "eslint-config-qiwi": "1.17.4",
     "fast-glob": "3.2.11",
     "file-loader": "6.2.0",
-    "husky": "8.0.1",
-    "minimist": "1.2.6",
     "prettier": "2.7.1",
     "prettier-config-qiwi": "1.7.2",
     "react-docgen-typescript": "patch:react-docgen-typescript@npm%3A2.2.2#~/.yarn/patches/react-docgen-typescript-npm-2.2.2-afb9698a32.patch",
     "react-styleguidist": "11.2.0",
     "react-styleguidist-visual": "patch:react-styleguidist-visual@npm%3A0.9.0#~/.yarn/patches/react-styleguidist-visual-npm-0.9.0-c05bb39789.patch",
-    "style-loader": "2.0.0",
-    "ts-patch": "2.0.1",
-    "tsc-esm-fix": "2.18.0",
-    "typescript": "4.4.4",
+    "style-loader": "3.3.1",
+    "tsc-esm-fix": "2.20.0",
+    "typescript": "4.7.4",
     "wait-on": "6.0.1",
     "webpack": "4.46.0"
   },