@skbkontur/react-ui 0.0.0-a8f1c3e7a1 → 0.0.0-aa4659ca48

package/CHANGELOG.md

@@ -3,6 +3,223 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.4.4](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@5.4.2...@skbkontur/react-ui@5.4.4) (2025-11-28)
+
+
+### Bug Fixes
+
+* **DateRangePicker:** show picker under input by `menuAnchorElement` on focus ([a0099f3](https://github.com/skbkontur/retail-ui/commit/a0099f30262239f1203e6c9aac910e6a4b304b9f))
+* **Textarea:** baseline alignment ([98e4dc0](https://github.com/skbkontur/retail-ui/commit/98e4dc0575e0c3c6315ea0adedad5f85df7b95d1))
+* **TokenInput:** prevent set hidden items, setting on editing object, fix itemToId prop ([c922996](https://github.com/skbkontur/retail-ui/commit/c922996ed0b27c45e8f3a9876faca6096699b807))
+
+
+
+
+
+## [5.4.3](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@5.4.2...@skbkontur/react-ui@5.4.3) (2025-11-24)
+
+
+### Bug Fixes
+
+* **Textarea:** baseline alignment ([98e4dc0](https://github.com/skbkontur/retail-ui/commit/98e4dc0575e0c3c6315ea0adedad5f85df7b95d1))
+
+
+
+
+
+## [5.4.2](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@5.4.1...@skbkontur/react-ui@5.4.2) (2025-11-20)
+
+
+### Bug Fixes
+
+* **ComboBox:** downgrade `react-focus-lock` to stable ([91eaf3b](https://github.com/skbkontur/retail-ui/commit/91eaf3b68156b6cda33e3049be5cb0d3ddddeb2a))
+
+
+
+
+
+## [5.4.1](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@5.4.0...@skbkontur/react-ui@5.4.1) (2025-11-01)
+
+
+### Bug Fixes
+
+* **CurrencyInput:** do not warn about null value ([5a2f5bd](https://github.com/skbkontur/retail-ui/commit/5a2f5bd09598e11e4e69dd96eca55dd44c6f78e0))
+* **CurrencyInput:** fix onPaste handler ([a50f7e0](https://github.com/skbkontur/retail-ui/commit/a50f7e0cf859381c0eb54a38fe5aca61a77f5f5d))
+* **FxInput:** add support `mask` & feature flag `fxInputUseMaskedInput` ([f86d3bd](https://github.com/skbkontur/retail-ui/commit/f86d3bde8e205dbea77faee0fd079266af04980f))
+
+
+
+
+
+# [5.4.0](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@5.3.11...@skbkontur/react-ui@5.4.0) (2025-10-23)
+
+
+### Bug Fixes
+
+* **Button, Link:** fix passing of disabled attribute to root ([beb66d9](https://github.com/skbkontur/retail-ui/commit/beb66d9cefbe4efa0b55916a5cd0fcb649a12993))
+* **Tooltip:** use correct default positions ([3237031](https://github.com/skbkontur/retail-ui/commit/3237031370d74729b3b4dcb2bc7439cfb38b0df3))
+
+
+### Features
+
+* **SizeControlContext:** Add size control context ([66cc2ac](https://github.com/skbkontur/retail-ui/commit/66cc2acb818f4391fb7349b52da7433f627a367d))
+* **Combobox:** add multiline behavior ([cab53bd](https://github.com/skbkontur/retail-ui/commit/cab53bd482d8716cf294db333d39b6fc8515955c))
+* **Toast,SingleToast:** add  `use` option and `error` view ([9958f1b](https://github.com/skbkontur/retail-ui/commit/9958f1b117645244566ef652290766d3923dfc4a))
+* **react-ui:** update react-focus-lock package ([d733020](https://github.com/skbkontur/retail-ui/commit/d73302034bc23e703fca38022fe038e717635bab))
+
+
+
+
+
+## [5.3.11](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@5.3.10...@skbkontur/react-ui@5.3.11) (2025-10-22)
+
+
+### Bug Fixes
+
+* **SidePage:** fix clipping of shadows/focuses inside SidePage.Body ([d41d10e](https://github.com/skbkontur/retail-ui/commit/d41d10ea28c546c97b3f0dff902b37054f6be364))
+
+
+
+
+
+## [5.3.10](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@5.3.9...@skbkontur/react-ui@5.3.10) (2025-10-16)
+
+
+### Bug Fixes
+
+* **DatePicker:** pass correct value to onValueChange on blur ([8e82ee0](https://github.com/skbkontur/retail-ui/commit/8e82ee07ae2e29a6ab608863e89bb85511597a10))
+
+
+
+
+
+## [5.3.9](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@5.3.8...@skbkontur/react-ui@5.3.9) (2025-10-03)
+
+
+### Bug Fixes
+
+* **SidePage:** add support for overlays from widgets ([8a968cb](https://github.com/skbkontur/retail-ui/commit/8a968cb3b896d4ca22f9ed5116bb600a036426b4))
+
+
+
+
+
+## [5.3.8](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@5.3.7...@skbkontur/react-ui@5.3.8) (2025-10-01)
+
+
+### Bug Fixes
+
+* **TokenInput:** create token on blur in "withoutReference" mode (feature flag) ([10ebcbb](https://github.com/skbkontur/retail-ui/commit/10ebcbb58e3736f5c4887ea8daca148b55b6c6d6))
+
+
+
+
+
+## [5.3.7](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@5.3.6...@skbkontur/react-ui@5.3.7) (2025-09-24)
+
+
+### Bug Fixes
+
+* **MaskedInput:** return "" from onValueChange after input cleaning ([884ed1c](https://github.com/skbkontur/retail-ui/commit/884ed1c296d36bea895b3cb13481dcf67052193f))
+
+
+
+
+
+## [5.3.6](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@5.3.5...@skbkontur/react-ui@5.3.6) (2025-09-24)
+
+
+### Bug Fixes
+
+* **ComboBox,MaskedInput:** support mask and filter value on paste ([a6f6935](https://github.com/skbkontur/retail-ui/commit/a6f69355a1b962dbaf8a86158c6b833b2159eb48))
+
+
+
+
+
+## [5.3.5](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@5.3.4...@skbkontur/react-ui@5.3.5) (2025-09-24)
+
+
+### Bug Fixes
+
+* **FileUploader:** set files on drop ([ba181f3](https://github.com/skbkontur/retail-ui/commit/ba181f3e89354bea9e18e4ca20dd97c43c7e292e))
+
+
+
+
+
+## [5.3.4](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@5.3.3...@skbkontur/react-ui@5.3.4) (2025-09-23)
+
+
+### Bug Fixes
+
+* **react-ui:** use imask with fixed sourcemap ([a4ee23d](https://github.com/skbkontur/retail-ui/commit/a4ee23de971210302c2e3dfcf9f1e9b1c5eb2ad5))
+
+
+
+
+
+## [5.3.3](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@5.3.2...@skbkontur/react-ui@5.3.3) (2025-09-22)
+
+
+### Bug Fixes
+
+* **Tooltip:** fix incorrect import ([58206c9](https://github.com/skbkontur/retail-ui/commit/58206c91875e3180180be91800e302031b1b3266))
+
+
+
+
+
+## [5.3.2](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@5.3.1...@skbkontur/react-ui@5.3.2) (2025-09-10)
+
+**Note:** Version bump only for package @skbkontur/react-ui
+
+
+
+
+
+## [5.3.1](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@5.3.0...@skbkontur/react-ui@5.3.1) (2025-09-01)
+
+
+### Bug Fixes
+
+* **select:** fix pass empty placeholder ([eb5b0ed](https://github.com/skbkontur/retail-ui/commit/eb5b0ed94c5133ab4a0a461ca656512583c292ff))
+
+
+
+
+
+# [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)
 
 

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,11 +1,12 @@
 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 { TGetRootNode } from '../../lib/rootNode';
 import type { SizeProp } from '../../lib/types/props';
-export interface AutocompleteProps extends CommonProps, Pick<AriaAttributes, 'aria-label'>, Override<InputProps, {
+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;
     /** Задает промис, который резолвит элементы меню. */
@@ -51,7 +52,7 @@ export declare const AutocompleteDataTids: {
 export declare const AutocompleteIds: {
     readonly menu: "Autocomplete__menu";
 };
-type DefaultProps = Required<Pick<AutocompleteProps, 'renderItem' | 'size' | 'disablePortal' | 'hasShadow' | 'menuMaxHeight' | 'preventWindowScroll'>>;
+type DefaultProps = Required<Pick<AutocompleteProps, 'renderItem' | 'disablePortal' | 'hasShadow' | 'menuMaxHeight' | 'preventWindowScroll'>>;
 /**
  * `Autocomplete` — стандартный инпут с подсказками.
  *
@@ -61,30 +62,10 @@ type DefaultProps = Required<Pick<AutocompleteProps, 'renderItem' | 'size' | 'di
 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 size;
     private readonly locale;
     private isMobileLayout;
     private opened;
@@ -95,13 +76,22 @@ export declare class Autocomplete extends React.Component<AutocompleteProps, Aut
     private mobilePopup;
     private requestId;
     private getProps;
+    getRootNode: TGetRootNode;
     private setRootNode;
     /**
-     * @public
+     * @public focus method
+     * @description Focuses the input.
+     * @example
+     * <Autocomplete ref={autocompleteRef} />
+     * <button onClick={() => autocompleteRef.current?.focus()}>Focus</button>
      */
     focus(): void;
     /**
-     * @public
+     * @public blur method
+     * @description Blurs the input.
+     * @example
+     * <Autocomplete ref={autocompleteRef} />
+     * <button onClick={() => autocompleteRef.current?.blur()}>Blur</button>
      */
     blur(): void;
     componentDidUpdate(prevProps: AutocompleteProps): void;
@@ -109,6 +99,7 @@ export declare class Autocomplete extends React.Component<AutocompleteProps, Aut
     renderMain: (props: CommonWrapperRestProps<AutocompleteProps>) => React.JSX.Element;
     private renderHints;
     private renderMenu;
+    private getInput;
     private renderMobileMenu;
     private getItems;
     private handleValueChange;

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");
@@ -16,7 +16,6 @@ var _MenuItem = require("../MenuItem");
 var _RenderLayer = require("../../internal/RenderLayer");
 var _createPropsGetter = require("../../lib/createPropsGetter");
 
-var _fixClickFocusIE = require("../../lib/events/fixClickFocusIE");
 
 var _CommonWrapper = require("../../internal/CommonWrapper");
 var _MobilePopup = require("../../internal/MobilePopup");
@@ -28,11 +27,13 @@ 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 _SizeDecorator = require("../../lib/size/SizeDecorator");
 
 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 +109,7 @@ function renderItem(item) {
 
 
 
+
 
 
 var AutocompleteDataTids = exports.AutocompleteDataTids = {
@@ -123,43 +125,17 @@ var AutocompleteIds = exports.AutocompleteIds = {
 
 
 
-
-
-
 /**
  * `Autocomplete` — стандартный инпут с подсказками.
  *
  * Подсказки определяются в пропе `source`.
  * Все свойства передаются во внутренний `Input`.
  */var
-
-
-
-Autocomplete = exports.Autocomplete = (_dec = (0, _decorators.locale)('Autocomplete', _locale.AutocompleteLocaleHelper), (0, _decorator.responsiveLayout)(_class = (0, _rootNode.rootNode)(_class = _dec(_class = (_Autocomplete = /*#__PURE__*/function (_React$Component) {function Autocomplete() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
 
 
 
 
+Autocomplete = exports.Autocomplete = (_dec = (0, _decorators.locale)('Autocomplete', _locale.AutocompleteLocaleHelper), (0, _decorator.responsiveLayout)(_class = (0, _rootNode.rootNode)(_class = _dec(_class = (0, _SizeDecorator.withSize)(_class = (_Autocomplete = /*#__PURE__*/function (_React$Component) {function Autocomplete() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
 
 
 
@@ -181,6 +157,7 @@ Autocomplete = exports.Autocomplete = (_dec = (0, _decorators.locale)('Autocompl
 
 
 
+
     opened = false;_this.
     input = null;_this.
 
@@ -221,6 +198,15 @@ Autocomplete = exports.Autocomplete = (_dec = (0, _decorators.locale)('Autocompl
 
 
 
+
+
+
+
+
+
+
+
+
 
 
 
@@ -253,12 +239,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 +260,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 +322,20 @@ Autocomplete = exports.Autocomplete = (_dec = (0, _decorators.locale)('Autocompl
 
 
 
+
+
+    getInput = function (inputProps) {
+      return _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, inputProps);
+
+    };_this.
 
     renderMobileMenu = function () {var _this$mobilePopup;
       var inputProps = {
@@ -343,7 +345,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 +357,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,
@@ -372,7 +378,7 @@ Autocomplete = exports.Autocomplete = (_dec = (0, _decorators.locale)('Autocompl
       return items ?
       items.map(function (item, i) {
         return /*#__PURE__*/(
-          _react.default.createElement(_MenuItem.MenuItem, { onClick: _this.handleMenuItemClick(i), key: i, isMobile: isMobile, size: _this.props.size },
+          _react.default.createElement(_MenuItem.MenuItem, { onClick: _this.handleMenuItemClick(i), key: i, isMobile: isMobile, size: _this.size },
           _this.getProps().renderItem(item)
           ));
 
@@ -433,8 +439,7 @@ Autocomplete = exports.Autocomplete = (_dec = (0, _decorators.locale)('Autocompl
       }
     };_this.
 
-    handleClickOutside = function (e) {
-      (0, _fixClickFocusIE.fixClickFocusIE)(e);
+    handleClickOutside = function () {
       _this.handleBlur();
     };_this.
 
@@ -530,6 +535,11 @@ Autocomplete = exports.Autocomplete = (_dec = (0, _decorators.locale)('Autocompl
 
 
 
+
+
+
+
+
 
 
 
@@ -551,22 +561,17 @@ Autocomplete = exports.Autocomplete = (_dec = (0, _decorators.locale)('Autocompl
     refMobilePopup = function (mobilePopup) {
       _this.mobilePopup = mobilePopup;
     };return _this;}(0, _inheritsLoose2.default)(Autocomplete, _React$Component);var _proto = Autocomplete.prototype; /**
-   * @public
+   * @public focus method
+   * @description Focuses the input.
+   * @example
+   * <Autocomplete ref={autocompleteRef} />
+   * <button onClick={() => autocompleteRef.current?.focus()}>Focus</button>
    */_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);
+   * @public blur method
+   * @description Blurs the input.
+   * @example
+   * <Autocomplete ref={autocompleteRef} />
+   * <button onClick={() => autocompleteRef.current?.blur()}>Blur</button>
+   */;_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 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, disablePortal: false, hasShadow: true, menuMaxHeight: 300, preventWindowScroll: true }, _Autocomplete)) || _class) || _class) || _class) || _class);