@skbkontur/react-ui 5.2.0 → 5.3.0

package/CHANGELOG.md

@@ -3,6 +3,53 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [5.3.0](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@5.2.1...@skbkontur/react-ui@5.3.0) (2025-08-25)
+
+
+### Bug Fixes
+
+* **Autocomplete:** fix display with percentage menuWidth ([bf66bf3](https://github.com/skbkontur/retail-ui/commit/bf66bf36f9f3021693b6fba73a86e13df578f424))
+* **Button:** backless buttons theme variables work ([4ea52a2](https://github.com/skbkontur/retail-ui/commit/4ea52a2139b8126ba7f1dfad99b6baf1e361d14d))
+* **Button:** fix padding for Button with rightIcon ([0ef8416](https://github.com/skbkontur/retail-ui/commit/0ef8416b03068f92cdf2d53a042a6d08266eac4f))
+* **MiniModal:** change fontSize and lineHeight at description section ([edbe400](https://github.com/skbkontur/retail-ui/commit/edbe4002e5872ba088336267ecf46ed5aab3a297))
+* **Tooltip:** remove extra gap between Popup and pin ([f7e7533](https://github.com/skbkontur/retail-ui/commit/f7e75338ca72db382866a3aca22083dd05093a31))
+* **react-ui:** make getRootNode public ([192b23b](https://github.com/skbkontur/retail-ui/commit/192b23b1374eb5460a151879ac1cf113a82f85ff))
+* export PopupMenuCaptionProps type ([3283924](https://github.com/skbkontur/retail-ui/commit/3283924fe3839524ee446243cf71bb3b75a392b2))
+
+
+### Features
+
+* **Autocomplete:** change mask behaviour ([2ef8a58](https://github.com/skbkontur/retail-ui/commit/2ef8a586d1f24548ba907439de4624c220aa999d))
+* **Group:** add Hint and Tooltip support ([8a0f130](https://github.com/skbkontur/retail-ui/commit/8a0f13013a667dc5097ae9d326f796f7b75500dc))
+* mark that react 19 is not supported yet ([7a2dcc0](https://github.com/skbkontur/retail-ui/commit/7a2dcc0bdbf4e112c064abdf4c157768dcb49ce2))
+* **Paging:** add `size` prop and adaptivity ([1011f0d](https://github.com/skbkontur/retail-ui/commit/1011f0d3dffce1f85a06a4d1c040367ddd3ff62a))
+* **Paging:** show `⌥"` symbol in macOS ([1011f0d](https://github.com/skbkontur/retail-ui/commit/1011f0d3dffce1f85a06a4d1c040367ddd3ff62a))
+* remove propTypes ([569e003](https://github.com/skbkontur/retail-ui/commit/569e00312319557883da6536622a393aee932e95))
+* **SidePage, Modal:** unifiy headers behavior ([bc9e505](https://github.com/skbkontur/retail-ui/commit/bc9e505b58d5d4676f1f528144b777d312eede40))
+* **SidePage:** fix SidePage header blinking ([bc9e505](https://github.com/skbkontur/retail-ui/commit/bc9e505b58d5d4676f1f528144b777d312eede40))
+* **Switcher:** add `width` prop ([949ccb6](https://github.com/skbkontur/retail-ui/commit/949ccb6e9f1ada57f086e3ed58ba265ad9f84b85))
+* **Tooltip:** add `size` prop ([f7e7533](https://github.com/skbkontur/retail-ui/commit/f7e75338ca72db382866a3aca22083dd05093a31))
+
+
+
+
+
+# [5.2.1](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@5.2.0...@skbkontur/react-ui@5.2.1) (2025-07-24)
+
+
+### Bug Fixes
+
+* **Link:** fix Hint on Link disabled ([e34d0a4](https://github.com/skbkontur/retail-ui/commit/e34d0a45fd4c621547012fc5f10025e785ac3e0c))
+
+
+### Features
+
+* **Modal:** add ability change ModalSeparator margin ([55e4819](https://github.com/skbkontur/retail-ui/commit/55e48198d192d4aaa7c83a51987eb82f900f759a))
+
+
+
+
+
 # [5.2.0](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@5.1.7...@skbkontur/react-ui@5.2.0) (2025-07-16)
 
 

package/README.md

@@ -30,7 +30,7 @@ const MyApp = () => (
 использовался метод findDomNode, который в StrictMode запрещён. Теперь получение DOM-ноды реализовано в библиотеке через
 ref, из-за чего появились некоторые требования к компонентам, передаваемым в Hint, Tooltip, Popup или Tab:
 
-- при передаче функциональных компонентов, они должны использовать `React.ForwardRef`:
+- при передаче функциональных компонентов в react <= 18, они должны использовать `React.ForwardRef`:
 
 ```js static
 import { Hint } from '@skbkontur/react-ui';
@@ -84,7 +84,7 @@ class CustomClassComponent extends React.Component {
     return <div ref={this.rootNode}>children text</div>;
   }
 
-  getRootNode() {
+  getRootNode = () => {
     return this.rootNode.current;
   }
 }
@@ -104,15 +104,15 @@ export const WithClassChildren = () => (
 
 ## FAQ
 
-### Выпадашки и несколько react-рутов
+### Выпадающие элементы и несколько React root
 
-Реакт позволяет создавать рут внутри рута. Но контекст между ними не прокидывается. Это вызывает проблемы в работе
-различных выпадашек, типа `Tooltip`, `Select`, `Modal` и других.
+React позволяет создавать root внутри root, но контекст между ними не прокидывается. Это вызывает проблемы в работе
+различных выпадашек, типа `Hint`, `Tooltip`, `Select`, `Modal` и других.
 
-В версии `4.26.0` появился мехнизм, который решает большинство этих проблем. Если вложенный реакт-рут является виджетом,
+В версии `4.26.0` появился мехнизм, который решает большинство этих проблем. Если вложенный root является виджетом,
 то будет достаточно обновить библиотеку только в нём.
 
-Однако, при удалении html-элемента, который был реакт-рутом, его необходимо предварительно явно размонтировать:
+Однако, при удалении HTML-элемента, который был root, его необходимо предварительно явно размонтировать:
 
 ```tsx static
 React.useLayoutEffect(

package/cjs/components/Autocomplete/Autocomplete.d.ts

@@ -1,132 +1,115 @@
-import type { AriaAttributes } from 'react';
-import React from 'react';
-import PropTypes from 'prop-types';
-import type { InputProps } from '../Input';
-import type { Nullable, Override } from '../../typings/utility-types';
-import type { CommonProps, CommonWrapperRestProps } from '../../internal/CommonWrapper';
-import type { SizeProp } from '../../lib/types/props';
-export interface AutocompleteProps extends CommonProps, Pick<AriaAttributes, 'aria-label'>, Override<InputProps, {
-    /** Задает функцию, которая отрисовывает элементы меню. */
-    renderItem?: (item: string) => React.ReactNode;
-    /** Задает промис, который резолвит элементы меню. */
-    source?: string[] | ((patter: string) => Promise<string[]>);
-    /** Отключает использование портала. */
-    disablePortal?: boolean;
-    /** Определяет, нужно ли показывать тень у выпадающего меню. */
-    hasShadow?: boolean;
-    /** Задает выравнивание выпадающего меню. */
-    menuAlign?: 'left' | 'right';
-    /** Задает максимальную высоту выпадающего меню. */
-    menuMaxHeight?: number | string;
-    /** Задает ширину выпадающего меню. */
-    menuWidth?: number | string;
-    /** Отключает скролл окна, когда меню открыто. */
-    preventWindowScroll?: boolean;
-    /** Задает функцию, которая вызывается при изменении value. */
-    onValueChange: (value: string) => void;
-    /** Задает функцию, которая вызывается при потере автокомплитом фокуса. */
-    onBlur?: () => void;
-    /** Задаёт размер инпута. */
-    size?: SizeProp;
-    /** Задает значение автокомплита. */
-    value: string;
-    /** Задает текст заголовка выпадающего меню в мобильной версии. */
-    mobileMenuHeaderText?: string;
-}> {
-    /**
-     * Позволяет вручную задать текущую позицию выпадающего окна
-     */
-    menuPos?: 'top' | 'bottom';
-}
-export interface AutocompleteState {
-    items: Nullable<string[]>;
-    selected: number;
-    focused: boolean;
-    isMobileOpened: boolean;
-}
-export declare const AutocompleteDataTids: {
-    readonly root: "Autocomplete__root";
-    readonly menu: "Autocomplete__menu";
-};
-export declare const AutocompleteIds: {
-    readonly menu: "Autocomplete__menu";
-};
-type DefaultProps = Required<Pick<AutocompleteProps, 'renderItem' | 'size' | 'disablePortal' | 'hasShadow' | 'menuMaxHeight' | 'preventWindowScroll'>>;
-/**
- * `Autocomplete` — стандартный инпут с подсказками.
- *
- * Подсказки определяются в пропе `source`.
- * Все свойства передаются во внутренний `Input`.
- */
-export declare class Autocomplete extends React.Component<AutocompleteProps, AutocompleteState> {
-    static __KONTUR_REACT_UI__: string;
-    static displayName: string;
-    static propTypes: {
-        /**
-         * Функция для отрисовки элемента в выпадающем списке. Единственный аргумент
-         * — *item*.
-         */
-        renderItem: PropTypes.Requireable<(...args: any[]) => any>;
-        /**
-         * Если передан массив, то совпадения ищутся по этому массиву.
-         *
-         * Если передается функция, то она должна возвращать thenable, который
-         * резолвится уже отфильтрованным массивом. Возвращенный thenable может
-         * иметь метод cancel, который будет вызван при отмене поиска (пользователь
-         * изменил строку поиска, автокомплит потерял фокус).
-         * ```
-         * function(pattern) {
-         *   return service.findAll(pattern);
-         * }
-         * ```
-         */
-        source: PropTypes.Requireable<NonNullable<any[] | ((...args: any[]) => any) | null | undefined>>;
-    };
-    static defaultProps: DefaultProps;
-    state: AutocompleteState;
-    private theme;
-    private readonly locale;
-    private isMobileLayout;
-    private opened;
-    private input;
-    private menu;
-    private menuId;
-    private rootSpan;
-    private mobilePopup;
-    private requestId;
-    private getProps;
-    private setRootNode;
-    /**
-     * @public
-     */
-    focus(): void;
-    /**
-     * @public
-     */
-    blur(): void;
-    componentDidUpdate(prevProps: AutocompleteProps): void;
-    render(): React.JSX.Element;
-    renderMain: (props: CommonWrapperRestProps<AutocompleteProps>) => React.JSX.Element;
-    private renderHints;
-    private renderMenu;
-    private renderMobileMenu;
-    private getItems;
-    private handleValueChange;
-    private handleCloseMobile;
-    private handleKeyPressMobile;
-    private handleFocus;
-    private handleBlur;
-    private handleClickOutside;
-    private handleKeyDown;
-    private handleMenuItemClick;
-    private getAnchor;
-    private handleItemClick;
-    private choose;
-    private updateItems;
-    private fireChange;
-    private refInput;
-    private refMenu;
-    private refRootSpan;
-    private refMobilePopup;
-}
-export {};
+import type { AriaAttributes } from 'react';
+import React from 'react';
+import type { InputProps } from '../Input';
+import type { Nullable, Override } from '../../typings/utility-types';
+import type { CommonProps, CommonWrapperRestProps } from '../../internal/CommonWrapper';
+import type { TGetRootNode } from '../../lib/rootNode';
+import type { SizeProp } from '../../lib/types/props';
+import { type MaskedProps } from '../MaskedInput';
+export interface AutocompleteProps extends CommonProps, Pick<AriaAttributes, 'aria-label'>, Pick<Partial<MaskedProps>, 'alwaysShowMask' | 'mask' | 'maskChar'>, Override<Omit<InputProps, 'alwaysShowMask' | 'mask' | 'maskChar'>, {
+    /** Задает функцию, которая отрисовывает элементы меню. */
+    renderItem?: (item: string) => React.ReactNode;
+    /** Задает промис, который резолвит элементы меню. */
+    source?: string[] | ((patter: string) => Promise<string[]>);
+    /** Отключает использование портала. */
+    disablePortal?: boolean;
+    /** Определяет, нужно ли показывать тень у выпадающего меню. */
+    hasShadow?: boolean;
+    /** Задает выравнивание выпадающего меню. */
+    menuAlign?: 'left' | 'right';
+    /** Задает максимальную высоту выпадающего меню. */
+    menuMaxHeight?: number | string;
+    /** Задает ширину выпадающего меню. */
+    menuWidth?: number | string;
+    /** Отключает скролл окна, когда меню открыто. */
+    preventWindowScroll?: boolean;
+    /** Задает функцию, которая вызывается при изменении value. */
+    onValueChange: (value: string) => void;
+    /** Задает функцию, которая вызывается при потере автокомплитом фокуса. */
+    onBlur?: () => void;
+    /** Задаёт размер инпута. */
+    size?: SizeProp;
+    /** Задает значение автокомплита. */
+    value: string;
+    /** Задает текст заголовка выпадающего меню в мобильной версии. */
+    mobileMenuHeaderText?: string;
+}> {
+    /**
+     * Позволяет вручную задать текущую позицию выпадающего окна
+     */
+    menuPos?: 'top' | 'bottom';
+}
+export interface AutocompleteState {
+    items: Nullable<string[]>;
+    selected: number;
+    focused: boolean;
+    isMobileOpened: boolean;
+}
+export declare const AutocompleteDataTids: {
+    readonly root: "Autocomplete__root";
+    readonly menu: "Autocomplete__menu";
+};
+export declare const AutocompleteIds: {
+    readonly menu: "Autocomplete__menu";
+};
+type DefaultProps = Required<Pick<AutocompleteProps, 'renderItem' | 'size' | 'disablePortal' | 'hasShadow' | 'menuMaxHeight' | 'preventWindowScroll'>>;
+/**
+ * `Autocomplete` — стандартный инпут с подсказками.
+ *
+ * Подсказки определяются в пропе `source`.
+ * Все свойства передаются во внутренний `Input`.
+ */
+export declare class Autocomplete extends React.Component<AutocompleteProps, AutocompleteState> {
+    static __KONTUR_REACT_UI__: string;
+    static displayName: string;
+    static defaultProps: DefaultProps;
+    state: AutocompleteState;
+    private theme;
+    private readonly locale;
+    private isMobileLayout;
+    private opened;
+    private input;
+    private menu;
+    private menuId;
+    private rootSpan;
+    private mobilePopup;
+    private featureFlags;
+    private requestId;
+    private getProps;
+    getRootNode: TGetRootNode;
+    private setRootNode;
+    /**
+     * @public
+     */
+    focus(): void;
+    /**
+     * @public
+     */
+    blur(): void;
+    componentDidUpdate(prevProps: AutocompleteProps): void;
+    render(): React.JSX.Element;
+    renderMain: (props: CommonWrapperRestProps<AutocompleteProps>) => React.JSX.Element;
+    private renderHints;
+    private renderMenu;
+    private getInput;
+    private renderMobileMenu;
+    private getItems;
+    private handleValueChange;
+    private handleCloseMobile;
+    private handleKeyPressMobile;
+    private handleFocus;
+    private handleBlur;
+    private handleClickOutside;
+    private handleKeyDown;
+    private handleMenuItemClick;
+    private getAnchor;
+    private handleItemClick;
+    private choose;
+    private updateItems;
+    private fireChange;
+    private refInput;
+    private refMenu;
+    private refRootSpan;
+    private refMobilePopup;
+}
+export {};

package/cjs/components/Autocomplete/Autocomplete.js

@@ -1,6 +1,6 @@
 "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.AutocompleteIds = exports.AutocompleteDataTids = exports.Autocomplete = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
 var _react = _interopRequireDefault(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
+var _globalObject = require("@skbkontur/global-object");
 
 var _MenuMessage = require("../../internal/MenuMessage");
 var _decorators = require("../../lib/locale/decorators");
@@ -28,11 +28,15 @@ var _getDOMRect = require("../../lib/dom/getDOMRect");
 var _Popup = require("../../internal/Popup");
 var _getMenuPositions = require("../../lib/getMenuPositions");
 var _ZIndex = require("../../internal/ZIndex");
+var _MaskedInput = require("../MaskedInput");
+
+var _ReactUIFeatureFlagsContext = require("../../lib/featureFlagsContext/ReactUIFeatureFlagsContext");
+var _FeatureFlagsHelpers = require("../../lib/featureFlagsContext/FeatureFlagsHelpers");
 
 var _Autocomplete2 = require("./Autocomplete.styles");
 
 var _locale = require("./locale");
-var _getAutocompleteTheme = require("./getAutocompleteTheme");var _excluded = ["onValueChange", "onKeyDown", "onFocus", "onBlur", "renderItem", "disablePortal", "hasShadow", "menuAlign", "menuMaxHeight", "preventWindowScroll", "source", "menuPos", "width", "mobileMenuHeaderText", "aria-label"];var _dec, _class, _Autocomplete;
+var _getAutocompleteTheme = require("./getAutocompleteTheme");var _excluded = ["onValueChange", "onKeyDown", "onFocus", "onBlur", "renderItem", "disablePortal", "hasShadow", "menuAlign", "menuMaxHeight", "preventWindowScroll", "source", "menuPos", "width", "mobileMenuHeaderText", "type"];var _dec, _class, _Autocomplete;
 
 function match(pattern, items) {
   if (!pattern || !items) {
@@ -108,6 +112,7 @@ function renderItem(item) {
 
 
 
+
 
 
 var AutocompleteDataTids = exports.AutocompleteDataTids = {
@@ -148,29 +153,6 @@ Autocomplete = exports.Autocomplete = (_dec = (0, _decorators.locale)('Autocompl
 
 
 
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
     state = {
       items: null,
       selected: -1,
@@ -188,6 +170,7 @@ Autocomplete = exports.Autocomplete = (_dec = (0, _decorators.locale)('Autocompl
 
 
 
+
     requestId = 0;_this.
 
     getProps = (0, _createPropsGetter.createPropsGetter)(Autocomplete.defaultProps);_this.
@@ -222,6 +205,14 @@ Autocomplete = exports.Autocomplete = (_dec = (0, _decorators.locale)('Autocompl
 
 
 
+
+
+
+
+
+
+
+
 
 
 
@@ -253,12 +244,13 @@ Autocomplete = exports.Autocomplete = (_dec = (0, _decorators.locale)('Autocompl
 
 
 
-        props.onValueChange,onKeyDown = props.onKeyDown,onFocus = props.onFocus,onBlur = props.onBlur,_renderItem = props.renderItem,disablePortal = props.disablePortal,hasShadow = props.hasShadow,menuAlign = props.menuAlign,menuMaxHeight = props.menuMaxHeight,preventWindowScroll = props.preventWindowScroll,source = props.source,menuPos = props.menuPos,_props$width = props.width,width = _props$width === void 0 ? _this.theme.inputWidth : _props$width,mobileMenuHeaderText = props.mobileMenuHeaderText,ariaLabel = props['aria-label'],rest = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+        props.onValueChange,onKeyDown = props.onKeyDown,onFocus = props.onFocus,onBlur = props.onBlur,_renderItem = props.renderItem,disablePortal = props.disablePortal,hasShadow = props.hasShadow,menuAlign = props.menuAlign,menuMaxHeight = props.menuMaxHeight,preventWindowScroll = props.preventWindowScroll,source = props.source,menuPos = props.menuPos,_props$width = props.width,width = _props$width === void 0 ? _this.theme.inputWidth : _props$width,mobileMenuHeaderText = props.mobileMenuHeaderText,type = props.type,rest = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
 
       var inputProps = (0, _extends2.default)({},
       rest, {
         width: '100%',
         autoComplete: 'off',
+        'aria-controls': _this.menuId,
         onValueChange: _this.handleValueChange,
         onKeyDown: _this.handleKeyDown,
         onFocus: _this.handleFocus,
@@ -273,9 +265,10 @@ Autocomplete = exports.Autocomplete = (_dec = (0, _decorators.locale)('Autocompl
           _Autocomplete2.styles.noPortal()] = disablePortal, _cx)
           ),
           style: { width: width },
-          ref: _this.refRootSpan }, /*#__PURE__*/
+          ref: _this.refRootSpan },
+
+        _this.getInput(inputProps),
 
-        _react.default.createElement(_Input.Input, (0, _extends2.default)({ "aria-label": ariaLabel, "aria-controls": _this.menuId }, inputProps)),
         isMobile ? _this.renderMobileMenu() : _this.renderMenu()
         )
         ));
@@ -334,6 +327,20 @@ Autocomplete = exports.Autocomplete = (_dec = (0, _decorators.locale)('Autocompl
 
 
 
+
+
+    getInput = function (inputProps) {
+      return _this.featureFlags.autocompleteUseMaskedInput && _this.props.mask ? /*#__PURE__*/
+      _react.default.createElement(_MaskedInput.MaskedInput, (0, _extends2.default)({},
+      inputProps, {
+        type: (0, _MaskedInput.getSafeMaskInputType)(_this.props.type),
+        mask: _this.props.mask,
+        maskChar: _this.props.maskChar })
+      ) : /*#__PURE__*/
+
+      _react.default.createElement(_Input.Input, (0, _extends2.default)({}, inputProps, { mask: _this.props.mask, maskChar: _this.props.maskChar }));
+
+    };_this.
 
     renderMobileMenu = function () {var _this$mobilePopup;
       var inputProps = {
@@ -343,7 +350,11 @@ Autocomplete = exports.Autocomplete = (_dec = (0, _decorators.locale)('Autocompl
         onValueChange: _this.handleValueChange,
         onKeyPress: _this.handleKeyPressMobile,
         value: _this.props.value,
-        placeholder: _this.locale.enterValue
+        placeholder: _this.locale.enterValue,
+        type: _this.props.type,
+        inputMode: _this.props.inputMode,
+        'aria-label': _this.props['aria-label'],
+        'aria-controls': _this.menuId
       };
 
       var items = _this.state.items;
@@ -351,7 +362,7 @@ Autocomplete = exports.Autocomplete = (_dec = (0, _decorators.locale)('Autocompl
       return /*#__PURE__*/(
         _react.default.createElement(_MobilePopup.MobilePopup, {
           id: _this.menuId,
-          headerChildComponent: /*#__PURE__*/_react.default.createElement(_Input.Input, inputProps),
+          headerChildComponent: _this.getInput(inputProps),
           caption: _this.props.mobileMenuHeaderText,
           opened: _this.state.isMobileOpened,
           onCloseRequest: _this.handleCloseMobile,
@@ -530,6 +541,11 @@ Autocomplete = exports.Autocomplete = (_dec = (0, _decorators.locale)('Autocompl
 
 
 
+
+
+
+
+
 
 
 
@@ -554,19 +570,6 @@ Autocomplete = exports.Autocomplete = (_dec = (0, _decorators.locale)('Autocompl
    * @public
    */_proto.focus = function focus() {if (this.input) {this.input.focus();}} /**
    * @public
-   */;_proto.blur = function blur() {this.handleBlur();};_proto.componentDidUpdate = function componentDidUpdate(prevProps) {if (prevProps.value !== this.props.value) {this.updateItems(this.props.value || '');}};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = (0, _getAutocompleteTheme.getAutocompleteTheme)(theme);return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Provider, { value: _this2.theme }, /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: _this2.setRootNode }, _this2.getProps()), _this2.renderMain));});};_proto.renderHints = function renderHints() {var items = this.state.items;if (!this.props.value) {return /*#__PURE__*/_react.default.createElement(_MenuMessage.MenuMessage, null, this.locale.enterValue);}if ((items == null ? void 0 : items.length) === 0 && this.props.value) {return /*#__PURE__*/_react.default.createElement(_MenuMessage.MenuMessage, null, this.locale.notFound);}if ((0, _utils.isNullable)(items) && this.props.value) {return /*#__PURE__*/_react.default.createElement(_MenuMessage.MenuMessage, null, this.locale.updateValue);}return null;};_proto.renderMenu = function renderMenu() {var items = this.state.items;var _this$getProps = this.getProps(),menuPos = _this$getProps.menuPos,menuAlign = _this$getProps.menuAlign,menuMaxHeight = _this$getProps.menuMaxHeight,hasShadow = _this$getProps.hasShadow,menuWidth = _this$getProps.menuWidth,width = _this$getProps.width,preventWindowScroll = _this$getProps.preventWindowScroll,disablePortal = _this$getProps.disablePortal;var menuProps = { ref: this.refMenu, maxHeight: menuMaxHeight, hasShadow: false, hasMargin: false, width: menuWidth || width && (0, _getDOMRect.getDOMRect)(this.rootSpan).width, preventWindowScroll: preventWindowScroll };if (!items || items.length === 0) {return null;}return /*#__PURE__*/_react.default.createElement(_Popup.Popup, { opened: true, hasShadow: hasShadow, id: this.menuId, priority: _ZIndex.ZIndex.priorities.PopupMenu, "data-tid": AutocompleteDataTids.menu, anchorElement: this.getAnchor(), disablePortal: disablePortal, width: menuWidth, minWidth: menuWidth === undefined ? '100%' : undefined, positions: (0, _getMenuPositions.getMenuPositions)(menuPos, menuAlign), margin: parseInt(this.theme.menuOffsetY) - 1 }, /*#__PURE__*/_react.default.createElement(_Menu.Menu, menuProps, this.getItems()));};_proto.handleMenuItemClick = function handleMenuItemClick(i) {var _this3 = this;return function (event) {return _this3.handleItemClick(event, i);};};_proto.handleItemClick = function handleItemClick(event, index) {if (event.button) {return;}event.preventDefault();this.choose(index);};_proto.choose = function choose(index) {if (!this.state.items) {return;}var value = this.state.items[index];this.opened = false;this.setState({ selected: -1, items: null });this.fireChange(value);this.blur();};_proto.updateItems = function updateItems(value) {var _this4 = this;if (!this.opened) {return;}var pattern = value.trim();var source = this.props.source;if (!source) {return;}var promise;this.requestId += 1;var expectingId = this.requestId;if (typeof source === 'function') {promise = source(pattern);} else {promise = match(pattern, source);}promise.then(function (items) {if (_this4.opened && expectingId === _this4.requestId) {_this4.setState({ items: items, selected: -1 });}});};_proto.fireChange = function fireChange(value) {if (this.props.onValueChange) {this.props.onValueChange(value);}};return Autocomplete;}(_react.default.Component), _Autocomplete.__KONTUR_REACT_UI__ = 'Autocomplete', _Autocomplete.displayName = 'Autocomplete', _Autocomplete.propTypes = { /**
-   * Функция для отрисовки элемента в выпадающем списке. Единственный аргумент
-   * — *item*.
-   */renderItem: _propTypes.default.func, /**
-   * Если передан массив, то совпадения ищутся по этому массиву.
-   *
-   * Если передается функция, то она должна возвращать thenable, который
-   * резолвится уже отфильтрованным массивом. Возвращенный thenable может
-   * иметь метод cancel, который будет вызван при отмене поиска (пользователь
-   * изменил строку поиска, автокомплит потерял фокус).
-   * ```
-   * function(pattern) {
-   *   return service.findAll(pattern);
-   * }
-   * ```
-   */source: _propTypes.default.oneOfType([_propTypes.default.array, _propTypes.default.func]) }, _Autocomplete.defaultProps = { renderItem: renderItem, size: 'small', disablePortal: false, hasShadow: true, menuMaxHeight: 300, preventWindowScroll: true }, _Autocomplete)) || _class) || _class) || _class);
+   */;_proto.blur = function blur() {this.handleBlur();};_proto.componentDidUpdate = function componentDidUpdate(prevProps) {if (prevProps.value !== this.props.value) {this.updateItems(this.props.value || '');}};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ReactUIFeatureFlagsContext.ReactUIFeatureFlagsContext.Consumer, null, function (flags) {_this2.featureFlags = (0, _FeatureFlagsHelpers.getFullReactUIFlagsContext)(flags);return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = (0, _getAutocompleteTheme.getAutocompleteTheme)(theme);return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Provider, { value: _this2.theme }, /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: _this2.setRootNode }, _this2.getProps()), _this2.renderMain));});});};_proto.renderHints = function renderHints() {var items = this.state.items;if (!this.props.value) {return /*#__PURE__*/_react.default.createElement(_MenuMessage.MenuMessage, null, this.locale.enterValue);}if ((items == null ? void 0 : items.length) === 0 && this.props.value) {return /*#__PURE__*/_react.default.createElement(_MenuMessage.MenuMessage, null, this.locale.notFound);}if ((0, _utils.isNullable)(items) && this.props.value) {return /*#__PURE__*/_react.default.createElement(_MenuMessage.MenuMessage, null, this.locale.updateValue);}return null;};_proto.renderMenu = function renderMenu() {var items = this.state.items;var _this$getProps = this.getProps(),menuPos = _this$getProps.menuPos,menuAlign = _this$getProps.menuAlign,menuMaxHeight = _this$getProps.menuMaxHeight,hasShadow = _this$getProps.hasShadow,menuWidth = _this$getProps.menuWidth,width = _this$getProps.width,preventWindowScroll = _this$getProps.preventWindowScroll,disablePortal = _this$getProps.disablePortal;var calculatedMenuWidth = menuWidth ? '100%' : width && (0, _getDOMRect.getDOMRect)(this.rootSpan).width;var menuProps = { ref: this.refMenu, maxHeight: menuMaxHeight, hasShadow: false, hasMargin: false, width: calculatedMenuWidth, preventWindowScroll: preventWindowScroll };if (!items || items.length === 0) {return null;}return /*#__PURE__*/_react.default.createElement(_Popup.Popup, { opened: true, hasShadow: hasShadow, id: this.menuId, priority: _ZIndex.ZIndex.priorities.PopupMenu, "data-tid": AutocompleteDataTids.menu, anchorElement: this.getAnchor(), disablePortal: disablePortal, width: menuWidth, minWidth: menuWidth === undefined ? '100%' : undefined, positions: (0, _getMenuPositions.getMenuPositions)(menuPos, menuAlign), margin: parseInt(this.theme.menuOffsetY) - 1 }, /*#__PURE__*/_react.default.createElement(_Menu.Menu, menuProps, this.getItems()));};_proto.handleMenuItemClick = function handleMenuItemClick(i) {var _this3 = this;return function (event) {return _this3.handleItemClick(event, i);};};_proto.handleItemClick = function handleItemClick(event, index) {if (event.button) {return;}event.preventDefault();this.choose(index);};_proto.choose = function choose(index) {var _this4 = this;if (!this.state.items) {return;}var value = this.state.items[index];this.opened = false;this.setState({ selected: -1, items: null });this.fireChange(value); // NOTE: этот таймаут - костыль. Проблема в старом ReactInputMask, он сеттит пустой value при потере фокуса.
+    // Можно будет убрать после полного перехода на MaskedInput
+    _globalObject.globalObject.setTimeout(function () {_this4.blur();}, 0);};_proto.updateItems = function updateItems(value) {var _this5 = this;if (!this.opened) {return;}var pattern = value.trim();var source = this.props.source;if (!source) {return;}var promise;this.requestId += 1;var expectingId = this.requestId;if (typeof source === 'function') {promise = source(pattern);} else {promise = match(pattern, source);}promise.then(function (items) {if (_this5.opened && expectingId === _this5.requestId) {_this5.setState({ items: items, selected: -1 });}});};_proto.fireChange = function fireChange(value) {if (this.props.onValueChange) {this.props.onValueChange(value);}};return Autocomplete;}(_react.default.Component), _Autocomplete.__KONTUR_REACT_UI__ = 'Autocomplete', _Autocomplete.displayName = 'Autocomplete', _Autocomplete.defaultProps = { renderItem: renderItem, size: 'small', disablePortal: false, hasShadow: true, menuMaxHeight: 300, preventWindowScroll: true }, _Autocomplete)) || _class) || _class) || _class);