@skbkontur/react-ui 6.3.4 → 6.4.1-8cb58.0

package/components/TokenInput/TokenInputMenu.js

@@ -14,11 +14,15 @@ var __extends = (this && this.__extends) || (function () {
     };
 })();
 import React from 'react';
+import { ComboBoxRequestStatus } from '../../internal/CustomComboBox/CustomComboBoxTypes.js';
 import { ComboBoxMenu } from '../../internal/CustomComboBox/index.js';
 import { Popup } from '../../internal/Popup/index.js';
 import { ThemeContext } from '../../lib/theming/ThemeContext.js';
 import { ThemeFactory } from '../../lib/theming/ThemeFactory.js';
+import { isThemeGTE } from '../../lib/theming/ThemeHelpers.js';
 import { TokenInputDataTids } from './TokenInput.js';
+import { TokenInputFailedMenu } from './TokenInputFailedMenu.js';
+var cursorNearFieldEdgeTolerancePx = 1;
 var TokenInputMenu = /** @class */ (function (_super) {
     __extends(TokenInputMenu, _super);
     function TokenInputMenu() {
@@ -26,50 +30,161 @@ var TokenInputMenu = /** @class */ (function (_super) {
         _this.state = {};
         _this.menu = null;
         _this.getMenuRef = function () { return _this.menu; };
-        _this.handleMenuPositionChange = function (_, isFullyVisible) {
+        _this.handleMenuPositionChange = function (position, isFullyVisible) {
+            var nextState = {};
+            if (_this.shouldUpgradeToRootAnchor(position)) {
+                nextState.useRootAnchor = true;
+            }
             if (!_this.state.forceMenuLeftAlign && !isFullyVisible && _this.props.menuAlign === 'cursor') {
-                _this.setState({ forceMenuLeftAlign: true });
+                nextState.forceMenuLeftAlign = true;
+            }
+            if (Object.keys(nextState).length > 0) {
+                _this.setState(nextState);
             }
-        };
-        _this.getPopupMargin = function () {
-            var paddingY = parseInt(_this.theme.tokenInputPaddingYSmall, 10) || 0;
-            var outlineWidth = parseInt(_this.theme.controlOutlineWidth, 10) || 0;
-            var marginY = parseInt(_this.theme.tokenMarginYSmall, 10) || 0;
-            return paddingY + outlineWidth + marginY;
         };
         _this.menuRef = function (node) { return (_this.menu = node); };
         return _this;
     }
+    TokenInputMenu.prototype.componentDidUpdate = function (prevProps) {
+        if (prevProps.opened && !this.props.opened && (this.state.forceMenuLeftAlign || this.state.useRootAnchor)) {
+            this.setState({ forceMenuLeftAlign: false, useRootAnchor: false });
+        }
+    };
     TokenInputMenu.prototype.render = function () {
         var _this = this;
         return (React.createElement(ThemeContext.Consumer, null, function (theme) {
             _this.theme = theme;
             return (React.createElement(ThemeContext.Provider, { value: ThemeFactory.create({
-                    popupMargin: _this.getPopupMargin() + 'px',
                     popupBackground: _this.theme.tokenInputMenuPopupBg,
                 }, theme) }, _this.renderMain()));
         }));
     };
-    TokenInputMenu.prototype.getPopupMarginSize = function (t) {
+    TokenInputMenu.prototype.getLabelPaddingY = function (t, size) {
+        switch (size) {
+            case 'large':
+                return parseInt(t.tokenInputPaddingYLarge, 10) || 0;
+            case 'medium':
+                return parseInt(t.tokenInputPaddingYMedium, 10) || 0;
+            case 'small':
+            default:
+                return parseInt(t.tokenInputPaddingYSmall, 10) || 0;
+        }
+    };
+    TokenInputMenu.prototype.getTokenPaddingY = function (t, size) {
+        switch (size) {
+            case 'large':
+                return parseInt(t.tokenPaddingYLarge, 10) || 0;
+            case 'medium':
+                return parseInt(t.tokenPaddingYMedium, 10) || 0;
+            case 'small':
+            default:
+                return parseInt(t.tokenPaddingYSmall, 10) || 0;
+        }
+    };
+    TokenInputMenu.prototype.getTokenMarginY = function (t, size) {
+        switch (size) {
+            case 'large':
+                return parseInt(t.tokenMarginYLarge, 10) || 0;
+            case 'medium':
+                return parseInt(t.tokenMarginYMedium, 10) || 0;
+            case 'small':
+            default:
+                return parseInt(t.tokenMarginYSmall, 10) || 0;
+        }
+    };
+    TokenInputMenu.prototype.getExpectedDistanceToFieldEdge = function (t, size) {
+        var tokenPaddingY = this.getTokenPaddingY(t, size);
+        var tokenBorderWidth = parseInt(t.tokenBorderWidth, 10) || 0;
+        var tokenMarginY = this.getTokenMarginY(t, size);
+        var labelPaddingY = this.getLabelPaddingY(t, size);
+        var labelBorderWidth = parseInt(t.tokenInputBorderWidth, 10) || 0;
+        return tokenPaddingY + tokenBorderWidth + tokenMarginY + labelPaddingY + labelBorderWidth;
+    };
+    TokenInputMenu.prototype.getAnchorRects = function () {
+        var _a = this.props, anchorElementRoot = _a.anchorElementRoot, anchorElementForCursor = _a.anchorElementForCursor;
+        if (!(anchorElementRoot instanceof HTMLElement) || !(anchorElementForCursor instanceof HTMLElement)) {
+            return null;
+        }
+        return {
+            root: anchorElementRoot.getBoundingClientRect(),
+            cursor: anchorElementForCursor.getBoundingClientRect(),
+        };
+    };
+    TokenInputMenu.prototype.isCursorNearFieldTop = function () {
+        var rects = this.getAnchorRects();
+        if (!rects) {
+            return false;
+        }
+        var expected = this.getExpectedDistanceToFieldEdge(this.theme, this.props.size);
+        return rects.cursor.top - rects.root.top <= expected + cursorNearFieldEdgeTolerancePx;
+    };
+    TokenInputMenu.prototype.isCursorNearFieldBottom = function () {
+        var rects = this.getAnchorRects();
+        if (!rects) {
+            return false;
+        }
+        var expected = this.getExpectedDistanceToFieldEdge(this.theme, this.props.size);
+        return rects.root.bottom - rects.cursor.bottom <= expected + cursorNearFieldEdgeTolerancePx;
+    };
+    TokenInputMenu.prototype.shouldUseRootAnchor = function (menuAlign) {
+        if (menuAlign === 'left') {
+            return true;
+        }
+        if (!isThemeGTE(this.theme, '6.4')) {
+            return false;
+        }
+        return !!this.state.useRootAnchor;
+    };
+    TokenInputMenu.prototype.shouldUpgradeToRootAnchor = function (position) {
+        if (this.state.useRootAnchor || !isThemeGTE(this.theme, '6.4') || this.props.menuAlign !== 'cursor') {
+            return false;
+        }
+        var direction = position.split(' ')[0];
+        if (direction === 'top') {
+            return this.isCursorNearFieldTop();
+        }
+        return this.isCursorNearFieldBottom();
+    };
+    TokenInputMenu.prototype.getPopupMargin = function (menuAlign) {
+        var t = this.theme;
+        var menuOffsetY = parseInt(t.tokenInputMenuOffsetY, 10) || 0;
+        if (isThemeGTE(t, '6.4')) {
+            return menuOffsetY;
+        }
+        if (menuAlign === 'left') {
+            return 1;
+        }
         switch (this.props.size) {
             case 'large':
-                return t.tokenInputPopupMarginLarge;
+                return parseInt(t.tokenInputPopupMarginLarge, 10) || 0;
             case 'medium':
-                return t.tokenInputPopupMarginMedium;
+                return parseInt(t.tokenInputPopupMarginMedium, 10) || 0;
             case 'small':
             default:
-                return t.tokenInputPopupMarginSmall;
+                return parseInt(t.tokenInputPopupMarginSmall, 10) || 0;
+        }
+    };
+    TokenInputMenu.prototype.getPopupOffset = function (menuAlign, useRootAnchor) {
+        var baseOffset = parseInt(this.theme.tokenInputPopupOffset, 10) || 0;
+        if (menuAlign === 'left') {
+            return baseOffset;
+        }
+        var cursorOffset = 8 + baseOffset;
+        if (!useRootAnchor) {
+            return cursorOffset;
+        }
+        var rects = this.getAnchorRects();
+        if (!rects) {
+            return cursorOffset;
         }
+        return rects.root.left - rects.cursor.left + cursorOffset;
     };
     TokenInputMenu.prototype.renderMain = function () {
         var _a = this.props, loading = _a.loading, maxMenuHeight = _a.maxMenuHeight, renderTotalCount = _a.renderTotalCount, totalCount = _a.totalCount, opened = _a.opened, items = _a.items, renderNotFound = _a.renderNotFound, renderItem = _a.renderItem, onValueChange = _a.onValueChange, renderAddButton = _a.renderAddButton, anchorElementForCursor = _a.anchorElementForCursor, anchorElementRoot = _a.anchorElementRoot, menuWidth = _a.menuWidth;
         var menuAlign = this.state.forceMenuLeftAlign ? 'left' : this.props.menuAlign;
-        return (React.createElement(Popup, { id: this.props.popupMenuId, "data-tid": TokenInputDataTids.tokenInputMenu, opened: !!opened, positions: menuAlign === 'cursor'
-                ? ['bottom left', 'top left']
-                : ['bottom left', 'top left', 'bottom right', 'top right'], anchorElement: menuAlign === 'cursor' ? anchorElementForCursor : anchorElementRoot, popupOffset: menuAlign === 'left'
-                ? parseInt(this.theme.tokenInputPopupOffset)
-                : 8 + parseInt(this.theme.tokenInputPopupOffset), margin: menuAlign === 'left' ? 1 : parseInt(this.getPopupMarginSize(this.theme)), hasShadow: true, width: menuAlign === 'cursor' ? 'auto' : menuWidth, onPositionChange: this.handleMenuPositionChange },
-            React.createElement(ComboBoxMenu, { size: this.props.size, items: items, loading: loading, hasMargin: false, maxMenuHeight: maxMenuHeight, onValueChange: onValueChange, opened: opened, refMenu: this.menuRef, renderTotalCount: renderTotalCount, renderItem: renderItem, renderNotFound: renderNotFound, totalCount: totalCount, renderAddButton: renderAddButton })));
+        var isCursorAlign = menuAlign === 'cursor';
+        var useRootAnchor = this.shouldUseRootAnchor(menuAlign);
+        return (React.createElement(Popup, { id: this.props.popupMenuId, "data-tid": TokenInputDataTids.tokenInputMenu, opened: !!opened, positions: isCursorAlign ? ['bottom left', 'top left'] : ['bottom left', 'top left', 'bottom right', 'top right'], anchorElement: useRootAnchor ? anchorElementRoot : anchorElementForCursor, popupOffset: this.getPopupOffset(menuAlign, useRootAnchor), margin: this.getPopupMargin(menuAlign), hasShadow: true, width: isCursorAlign ? 'auto' : menuWidth, onPositionChange: this.handleMenuPositionChange }, opened && items === null && this.props.requestStatus === ComboBoxRequestStatus.Failed && !loading ? (React.createElement(TokenInputFailedMenu, { refMenu: this.menuRef, maxMenuHeight: maxMenuHeight, size: this.props.size, hasMargin: false, repeatRequest: this.props.repeatRequest, renderAddButton: renderAddButton })) : (React.createElement(ComboBoxMenu, { size: this.props.size, items: items, loading: loading, hasMargin: false, maxMenuHeight: maxMenuHeight, onValueChange: onValueChange, opened: opened, refMenu: this.menuRef, renderTotalCount: renderTotalCount, renderItem: renderItem, renderNotFound: renderNotFound, totalCount: totalCount, renderAddButton: renderAddButton, requestStatus: this.props.requestStatus, repeatRequest: this.props.repeatRequest }))));
     };
     TokenInputMenu.__KONTUR_REACT_UI__ = 'TokenInputMenu';
     TokenInputMenu.displayName = 'TokenInputMenu';

package/components/TokenInput/TokenInputMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"TokenInputMenu.js","sourceRoot":"","sources":["TokenInputMenu.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { ComboBoxMenu } from '../../internal/CustomComboBox/index.js';\nimport type { ComboBoxMenuProps } from '../../internal/CustomComboBox/index.js';\nimport type { Menu } from '../../internal/Menu/index.js';\nimport type { PopupPositionsType, PopupProps } from '../../internal/Popup/index.js';\nimport { Popup } from '../../internal/Popup/index.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory.js';\nimport type { HTMLProps } from '../../typings/html.js';\nimport type { TokenSize } from '../Token/index.js';\nimport type { TokenInputMenuAlign, TokenInputProps } from './TokenInput.js';\nimport { TokenInputDataTids } from './TokenInput.js';\n\nexport interface TokenInputMenuProps<T> extends ComboBoxMenuProps<T> {\n  /** html-элемент от которого будет позиционировано Menu в случае menuAlign cursor */\n  anchorElementForCursor: PopupProps['anchorElement'];\n  /** html-элемент от которого будет позиционировано Menu в случае menuAlign left */\n  anchorElementRoot: PopupProps['anchorElement'];\n  /** Задает ширину выпадающего меню. */\n  menuWidth: TokenInputProps<string>['menuWidth'];\n  /** Задает выравнивание выпадающего меню. */\n  menuAlign: TokenInputMenuAlign;\n  /** Задает id выпадающему меню.\n   Полезно при реализации a11y. Например, помогает связать aria-controls с выпадающим меню. */\n  popupMenuId?: HTMLProps['id'];\n  /** Задает размер контрола. */\n  size?: TokenSize;\n}\n\ninterface TokenInputMenuState {\n  forceMenuLeftAlign?: boolean;\n}\n\nexport class TokenInputMenu<T = string> extends React.Component<TokenInputMenuProps<T>, TokenInputMenuState> {\n  public static __KONTUR_REACT_UI__ = 'TokenInputMenu';\n  public static displayName = 'TokenInputMenu';\n\n  public state: TokenInputMenuState = {};\n\n  private theme!: Theme;\n\n  private menu: Menu | null = null;\n\n  public render(): React.JSX.Element {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return (\n            <ThemeContext.Provider\n              value={ThemeFactory.create(\n                {\n                  popupMargin: this.getPopupMargin() + 'px',\n                  popupBackground: this.theme.tokenInputMenuPopupBg,\n                },\n                theme,\n              )}\n            >\n              {this.renderMain()}\n            </ThemeContext.Provider>\n          );\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  public getMenuRef = (): Menu | null => this.menu;\n\n  private getPopupMarginSize(t: Theme) {\n    switch (this.props.size) {\n      case 'large':\n        return t.tokenInputPopupMarginLarge;\n      case 'medium':\n        return t.tokenInputPopupMarginMedium;\n      case 'small':\n      default:\n        return t.tokenInputPopupMarginSmall;\n    }\n  }\n\n  private renderMain() {\n    const {\n      loading,\n      maxMenuHeight,\n      renderTotalCount,\n      totalCount,\n      opened,\n      items,\n      renderNotFound,\n      renderItem,\n      onValueChange,\n      renderAddButton,\n      anchorElementForCursor,\n      anchorElementRoot,\n      menuWidth,\n    } = this.props;\n\n    const menuAlign = this.state.forceMenuLeftAlign ? 'left' : this.props.menuAlign;\n\n    return (\n      <Popup\n        id={this.props.popupMenuId}\n        data-tid={TokenInputDataTids.tokenInputMenu}\n        opened={!!opened}\n        positions={\n          menuAlign === 'cursor'\n            ? ['bottom left', 'top left']\n            : ['bottom left', 'top left', 'bottom right', 'top right']\n        }\n        anchorElement={menuAlign === 'cursor' ? anchorElementForCursor : anchorElementRoot}\n        popupOffset={\n          menuAlign === 'left'\n            ? parseInt(this.theme.tokenInputPopupOffset)\n            : 8 + parseInt(this.theme.tokenInputPopupOffset)\n        }\n        margin={menuAlign === 'left' ? 1 : parseInt(this.getPopupMarginSize(this.theme))}\n        hasShadow\n        width={menuAlign === 'cursor' ? 'auto' : menuWidth}\n        onPositionChange={this.handleMenuPositionChange}\n      >\n        <ComboBoxMenu\n          size={this.props.size}\n          items={items}\n          loading={loading}\n          hasMargin={false}\n          maxMenuHeight={maxMenuHeight}\n          onValueChange={onValueChange}\n          opened={opened}\n          refMenu={this.menuRef}\n          renderTotalCount={renderTotalCount}\n          renderItem={renderItem}\n          renderNotFound={renderNotFound}\n          totalCount={totalCount}\n          renderAddButton={renderAddButton}\n        />\n      </Popup>\n    );\n  }\n\n  private handleMenuPositionChange = (_: PopupPositionsType, isFullyVisible: boolean) => {\n    if (!this.state.forceMenuLeftAlign && !isFullyVisible && this.props.menuAlign === 'cursor') {\n      this.setState({ forceMenuLeftAlign: true });\n    }\n  };\n\n  private getPopupMargin = (): number => {\n    const paddingY = parseInt(this.theme.tokenInputPaddingYSmall, 10) || 0;\n    const outlineWidth = parseInt(this.theme.controlOutlineWidth, 10) || 0;\n    const marginY = parseInt(this.theme.tokenMarginYSmall, 10) || 0;\n\n    return paddingY + outlineWidth + marginY;\n  };\n\n  private menuRef = (node: any) => (this.menu = node);\n}\n"]}
+{"version":3,"file":"TokenInputMenu.js","sourceRoot":"","sources":["TokenInputMenu.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { ComboBoxRequestStatus } from '../../internal/CustomComboBox/CustomComboBoxTypes.js';\nimport { ComboBoxMenu } from '../../internal/CustomComboBox/index.js';\nimport type { ComboBoxMenuProps } from '../../internal/CustomComboBox/index.js';\nimport type { Menu } from '../../internal/Menu/index.js';\nimport type { PopupPositionsType, PopupProps } from '../../internal/Popup/index.js';\nimport { Popup } from '../../internal/Popup/index.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory.js';\nimport { isThemeGTE } from '../../lib/theming/ThemeHelpers.js';\nimport type { HTMLProps } from '../../typings/html.js';\nimport type { TokenSize } from '../Token/index.js';\nimport type { TokenInputMenuAlign, TokenInputProps } from './TokenInput.js';\nimport { TokenInputDataTids } from './TokenInput.js';\nimport { TokenInputFailedMenu } from './TokenInputFailedMenu.js';\n\nconst cursorNearFieldEdgeTolerancePx = 1;\n\nexport interface TokenInputMenuProps<T> extends ComboBoxMenuProps<T> {\n  /** html-элемент от которого будет позиционировано Menu в случае menuAlign cursor */\n  anchorElementForCursor: PopupProps['anchorElement'];\n  /** html-элемент от которого будет позиционировано Menu в случае menuAlign left */\n  anchorElementRoot: PopupProps['anchorElement'];\n  /** Задает ширину выпадающего меню. */\n  menuWidth: TokenInputProps<string>['menuWidth'];\n  /** Задает выравнивание выпадающего меню. */\n  menuAlign: TokenInputMenuAlign;\n  /** Задает id выпадающему меню.\n   Полезно при реализации a11y. Например, помогает связать aria-controls с выпадающим меню. */\n  popupMenuId?: HTMLProps['id'];\n  /** Задает размер контрола. */\n  size?: TokenSize;\n}\n\ninterface TokenInputMenuState {\n  forceMenuLeftAlign?: boolean;\n  useRootAnchor?: boolean;\n}\n\nexport class TokenInputMenu<T = string> extends React.Component<TokenInputMenuProps<T>, TokenInputMenuState> {\n  public static __KONTUR_REACT_UI__ = 'TokenInputMenu';\n  public static displayName = 'TokenInputMenu';\n\n  public state: TokenInputMenuState = {};\n\n  private theme!: Theme;\n\n  private menu: Menu | null = null;\n\n  public componentDidUpdate(prevProps: TokenInputMenuProps<T>) {\n    if (prevProps.opened && !this.props.opened && (this.state.forceMenuLeftAlign || this.state.useRootAnchor)) {\n      this.setState({ forceMenuLeftAlign: false, useRootAnchor: false });\n    }\n  }\n\n  public render(): React.JSX.Element {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return (\n            <ThemeContext.Provider\n              value={ThemeFactory.create(\n                {\n                  popupBackground: this.theme.tokenInputMenuPopupBg,\n                },\n                theme,\n              )}\n            >\n              {this.renderMain()}\n            </ThemeContext.Provider>\n          );\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  public getMenuRef = (): Menu | null => this.menu;\n\n  private getLabelPaddingY(t: Theme, size: TokenSize | undefined): number {\n    switch (size) {\n      case 'large':\n        return parseInt(t.tokenInputPaddingYLarge, 10) || 0;\n      case 'medium':\n        return parseInt(t.tokenInputPaddingYMedium, 10) || 0;\n      case 'small':\n      default:\n        return parseInt(t.tokenInputPaddingYSmall, 10) || 0;\n    }\n  }\n\n  private getTokenPaddingY(t: Theme, size: TokenSize | undefined): number {\n    switch (size) {\n      case 'large':\n        return parseInt(t.tokenPaddingYLarge, 10) || 0;\n      case 'medium':\n        return parseInt(t.tokenPaddingYMedium, 10) || 0;\n      case 'small':\n      default:\n        return parseInt(t.tokenPaddingYSmall, 10) || 0;\n    }\n  }\n\n  private getTokenMarginY(t: Theme, size: TokenSize | undefined): number {\n    switch (size) {\n      case 'large':\n        return parseInt(t.tokenMarginYLarge, 10) || 0;\n      case 'medium':\n        return parseInt(t.tokenMarginYMedium, 10) || 0;\n      case 'small':\n      default:\n        return parseInt(t.tokenMarginYSmall, 10) || 0;\n    }\n  }\n\n  private getExpectedDistanceToFieldEdge(t: Theme, size: TokenSize | undefined): number {\n    const tokenPaddingY = this.getTokenPaddingY(t, size);\n    const tokenBorderWidth = parseInt(t.tokenBorderWidth, 10) || 0;\n    const tokenMarginY = this.getTokenMarginY(t, size);\n    const labelPaddingY = this.getLabelPaddingY(t, size);\n    const labelBorderWidth = parseInt(t.tokenInputBorderWidth, 10) || 0;\n\n    return tokenPaddingY + tokenBorderWidth + tokenMarginY + labelPaddingY + labelBorderWidth;\n  }\n\n  private getAnchorRects() {\n    const { anchorElementRoot, anchorElementForCursor } = this.props;\n    if (!(anchorElementRoot instanceof HTMLElement) || !(anchorElementForCursor instanceof HTMLElement)) {\n      return null;\n    }\n\n    return {\n      root: anchorElementRoot.getBoundingClientRect(),\n      cursor: anchorElementForCursor.getBoundingClientRect(),\n    };\n  }\n\n  private isCursorNearFieldTop(): boolean {\n    const rects = this.getAnchorRects();\n    if (!rects) {\n      return false;\n    }\n\n    const expected = this.getExpectedDistanceToFieldEdge(this.theme, this.props.size);\n    return rects.cursor.top - rects.root.top <= expected + cursorNearFieldEdgeTolerancePx;\n  }\n\n  private isCursorNearFieldBottom(): boolean {\n    const rects = this.getAnchorRects();\n    if (!rects) {\n      return false;\n    }\n\n    const expected = this.getExpectedDistanceToFieldEdge(this.theme, this.props.size);\n    return rects.root.bottom - rects.cursor.bottom <= expected + cursorNearFieldEdgeTolerancePx;\n  }\n\n  private shouldUseRootAnchor(menuAlign: TokenInputMenuAlign): boolean {\n    if (menuAlign === 'left') {\n      return true;\n    }\n\n    if (!isThemeGTE(this.theme, '6.4')) {\n      return false;\n    }\n\n    return !!this.state.useRootAnchor;\n  }\n\n  private shouldUpgradeToRootAnchor(position: PopupPositionsType): boolean {\n    if (this.state.useRootAnchor || !isThemeGTE(this.theme, '6.4') || this.props.menuAlign !== 'cursor') {\n      return false;\n    }\n\n    const direction = position.split(' ')[0];\n\n    if (direction === 'top') {\n      return this.isCursorNearFieldTop();\n    }\n\n    return this.isCursorNearFieldBottom();\n  }\n\n  private getPopupMargin(menuAlign: TokenInputMenuAlign): number {\n    const t = this.theme;\n    const menuOffsetY = parseInt(t.tokenInputMenuOffsetY, 10) || 0;\n\n    if (isThemeGTE(t, '6.4')) {\n      return menuOffsetY;\n    }\n\n    if (menuAlign === 'left') {\n      return 1;\n    }\n\n    switch (this.props.size) {\n      case 'large':\n        return parseInt(t.tokenInputPopupMarginLarge, 10) || 0;\n      case 'medium':\n        return parseInt(t.tokenInputPopupMarginMedium, 10) || 0;\n      case 'small':\n      default:\n        return parseInt(t.tokenInputPopupMarginSmall, 10) || 0;\n    }\n  }\n\n  private getPopupOffset(menuAlign: TokenInputMenuAlign, useRootAnchor: boolean): number {\n    const baseOffset = parseInt(this.theme.tokenInputPopupOffset, 10) || 0;\n\n    if (menuAlign === 'left') {\n      return baseOffset;\n    }\n\n    const cursorOffset = 8 + baseOffset;\n    if (!useRootAnchor) {\n      return cursorOffset;\n    }\n\n    const rects = this.getAnchorRects();\n    if (!rects) {\n      return cursorOffset;\n    }\n\n    return rects.root.left - rects.cursor.left + cursorOffset;\n  }\n\n  private renderMain() {\n    const {\n      loading,\n      maxMenuHeight,\n      renderTotalCount,\n      totalCount,\n      opened,\n      items,\n      renderNotFound,\n      renderItem,\n      onValueChange,\n      renderAddButton,\n      anchorElementForCursor,\n      anchorElementRoot,\n      menuWidth,\n    } = this.props;\n\n    const menuAlign = this.state.forceMenuLeftAlign ? 'left' : this.props.menuAlign;\n    const isCursorAlign = menuAlign === 'cursor';\n    const useRootAnchor = this.shouldUseRootAnchor(menuAlign);\n\n    return (\n      <Popup\n        id={this.props.popupMenuId}\n        data-tid={TokenInputDataTids.tokenInputMenu}\n        opened={!!opened}\n        positions={\n          isCursorAlign ? ['bottom left', 'top left'] : ['bottom left', 'top left', 'bottom right', 'top right']\n        }\n        anchorElement={useRootAnchor ? anchorElementRoot : anchorElementForCursor}\n        popupOffset={this.getPopupOffset(menuAlign, useRootAnchor)}\n        margin={this.getPopupMargin(menuAlign)}\n        hasShadow\n        width={isCursorAlign ? 'auto' : menuWidth}\n        onPositionChange={this.handleMenuPositionChange}\n      >\n        {opened && items === null && this.props.requestStatus === ComboBoxRequestStatus.Failed && !loading ? (\n          <TokenInputFailedMenu\n            refMenu={this.menuRef}\n            maxMenuHeight={maxMenuHeight}\n            size={this.props.size}\n            hasMargin={false}\n            repeatRequest={this.props.repeatRequest}\n            renderAddButton={renderAddButton}\n          />\n        ) : (\n          <ComboBoxMenu\n            size={this.props.size}\n            items={items}\n            loading={loading}\n            hasMargin={false}\n            maxMenuHeight={maxMenuHeight}\n            onValueChange={onValueChange}\n            opened={opened}\n            refMenu={this.menuRef}\n            renderTotalCount={renderTotalCount}\n            renderItem={renderItem}\n            renderNotFound={renderNotFound}\n            totalCount={totalCount}\n            renderAddButton={renderAddButton}\n            requestStatus={this.props.requestStatus}\n            repeatRequest={this.props.repeatRequest}\n          />\n        )}\n      </Popup>\n    );\n  }\n\n  private handleMenuPositionChange = (position: PopupPositionsType, isFullyVisible: boolean) => {\n    const nextState: Partial<TokenInputMenuState> = {};\n\n    if (this.shouldUpgradeToRootAnchor(position)) {\n      nextState.useRootAnchor = true;\n    }\n\n    if (!this.state.forceMenuLeftAlign && !isFullyVisible && this.props.menuAlign === 'cursor') {\n      nextState.forceMenuLeftAlign = true;\n    }\n\n    if (Object.keys(nextState).length > 0) {\n      this.setState(nextState);\n    }\n  };\n\n  private menuRef = (node: any) => (this.menu = node);\n}\n"]}

package/components/TokenInput/TokenInputMobileMenu.js

@@ -14,8 +14,10 @@ var __extends = (this && this.__extends) || (function () {
     };
 })();
 import React from 'react';
+import { ComboBoxRequestStatus } from '../../internal/CustomComboBox/CustomComboBoxTypes.js';
 import { ComboBoxMenu } from '../../internal/CustomComboBox/index.js';
 import { MobilePopup } from '../../internal/MobilePopup/index.js';
+import { TokenInputFailedMenu } from './TokenInputFailedMenu.js';
 var TokenInputMobileMenu = /** @class */ (function (_super) {
     __extends(TokenInputMobileMenu, _super);
     function TokenInputMobileMenu() {
@@ -29,8 +31,7 @@ var TokenInputMobileMenu = /** @class */ (function (_super) {
     }
     TokenInputMobileMenu.prototype.render = function () {
         var _a = this.props, loading = _a.loading, maxMenuHeight = _a.maxMenuHeight, renderTotalCount = _a.renderTotalCount, totalCount = _a.totalCount, opened = _a.opened, items = _a.items, renderNotFound = _a.renderNotFound, renderItem = _a.renderItem, onValueChange = _a.onValueChange, renderAddButton = _a.renderAddButton, onCloseRequest = _a.onCloseRequest;
-        return (React.createElement(MobilePopup, { opened: true, footerChildComponent: this.props.mobileFooterComponent, size: this.props.size, id: this.props.popupMenuId, onCloseRequest: onCloseRequest },
-            React.createElement(ComboBoxMenu, { size: this.props.size, items: items, loading: loading, hasMargin: false, refMenu: this.menuRef, maxMenuHeight: maxMenuHeight, onValueChange: onValueChange, opened: opened, renderTotalCount: renderTotalCount, renderItem: renderItem, renderNotFound: renderNotFound, totalCount: totalCount, renderAddButton: renderAddButton })));
+        return (React.createElement(MobilePopup, { opened: true, footerChildComponent: this.props.mobileFooterComponent, size: this.props.size, id: this.props.popupMenuId, onCloseRequest: onCloseRequest }, opened && items === null && this.props.requestStatus === ComboBoxRequestStatus.Failed && !loading ? (React.createElement(TokenInputFailedMenu, { refMenu: this.menuRef, maxMenuHeight: maxMenuHeight, size: this.props.size, isMobile: true, hasMargin: false, repeatRequest: this.props.repeatRequest, renderAddButton: renderAddButton })) : (React.createElement(ComboBoxMenu, { size: this.props.size, items: items, loading: loading, hasMargin: false, refMenu: this.menuRef, maxMenuHeight: maxMenuHeight, onValueChange: onValueChange, opened: opened, renderTotalCount: renderTotalCount, renderItem: renderItem, renderNotFound: renderNotFound, totalCount: totalCount, renderAddButton: renderAddButton, requestStatus: this.props.requestStatus, repeatRequest: this.props.repeatRequest }))));
     };
     TokenInputMobileMenu.__KONTUR_REACT_UI__ = 'TokenInputMobileMenu';
     TokenInputMobileMenu.displayName = 'TokenInputMobileMenu';

package/components/TokenInput/TokenInputMobileMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"TokenInputMobileMenu.js","sourceRoot":"","sources":["TokenInputMobileMenu.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,YAAY,EAAE,MAAM,wCAAwC,CAAC;AAEtE,OAAO,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAC;AAiBlE;IAAsD,wCAA6C;IAAnG;;QAIU,UAAI,GAAgB,IAAI,CAAC;QAE1B,gBAAU,GAAG,cAAmB,OAAA,KAAI,CAAC,IAAI,EAAT,CAAS,CAAC;QA4CzC,aAAO,GAAG,UAAC,IAAoB;YACrC,KAAI,CAAC,IAAI,GAAG,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,IAAI,CAAC;QAC3B,CAAC,CAAC;;IACJ,CAAC;IA7CQ,qCAAM,GAAb;QACQ,IAAA,KAYF,IAAI,CAAC,KAAK,EAXZ,OAAO,aAAA,EACP,aAAa,mBAAA,EACb,gBAAgB,sBAAA,EAChB,UAAU,gBAAA,EACV,MAAM,YAAA,EACN,KAAK,WAAA,EACL,cAAc,oBAAA,EACd,UAAU,gBAAA,EACV,aAAa,mBAAA,EACb,eAAe,qBAAA,EACf,cAAc,oBACF,CAAC;QAEf,OAAO,CACL,oBAAC,WAAW,IACV,MAAM,QACN,oBAAoB,EAAE,IAAI,CAAC,KAAK,CAAC,qBAAqB,EACtD,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,EACrB,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC,WAAW,EAC1B,cAAc,EAAE,cAAc;YAE9B,oBAAC,YAAY,IACX,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,EACrB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,KAAK,EAChB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,aAAa,EAAE,aAAa,EAC5B,aAAa,EAAE,aAAa,EAC5B,MAAM,EAAE,MAAM,EACd,gBAAgB,EAAE,gBAAgB,EAClC,UAAU,EAAE,UAAU,EACtB,cAAc,EAAE,cAAc,EAC9B,UAAU,EAAE,UAAU,EACtB,eAAe,EAAE,eAAe,GAChC,CACU,CACf,CAAC;IACJ,CAAC;IA/Ca,wCAAmB,GAAG,sBAAsB,AAAzB,CAA0B;IAC7C,gCAAW,GAAG,sBAAsB,AAAzB,CAA0B;IAmDrD,2BAAC;CAAA,AArDD,CAAsD,KAAK,CAAC,SAAS,GAqDpE;SArDY,oBAAoB","sourcesContent":["import type { ReactElement, ReactNode } from 'react';\nimport React from 'react';\n\nimport type { ComboBoxMenuProps } from '../../internal/CustomComboBox/index.js';\nimport { ComboBoxMenu } from '../../internal/CustomComboBox/index.js';\nimport type { Menu } from '../../internal/Menu/index.js';\nimport { MobilePopup } from '../../internal/MobilePopup/index.js';\nimport type { HTMLProps } from '../../typings/html.js';\nimport type { Nullable } from '../../typings/utility-types.js';\nimport type { TokenSize } from '../Token/index.js';\n\nexport interface TokenInputMobileMenuProps<T> extends ComboBoxMenuProps<T> {\n  /** Задает id выпадающему меню.\n   Полезно при реализации a11y. Например, помогает связать aria-controls с выпадающим меню. */\n  popupMenuId?: HTMLProps['id'];\n  /** Задает размер контрола. */\n  size?: TokenSize;\n  /** Компонент для футера в мобильном попапе */\n  mobileFooterComponent?: ReactNode;\n  /** Функция вызываем при клике по вуали в мобильном модале */\n  onCloseRequest?: () => void;\n}\n\nexport class TokenInputMobileMenu<T = string> extends React.Component<TokenInputMobileMenuProps<T>> {\n  public static __KONTUR_REACT_UI__ = 'TokenInputMobileMenu';\n  public static displayName = 'TokenInputMobileMenu';\n\n  private menu: Menu | null = null;\n\n  public getMenuRef = (): Menu | null => this.menu;\n\n  public render(): ReactElement {\n    const {\n      loading,\n      maxMenuHeight,\n      renderTotalCount,\n      totalCount,\n      opened,\n      items,\n      renderNotFound,\n      renderItem,\n      onValueChange,\n      renderAddButton,\n      onCloseRequest,\n    } = this.props;\n\n    return (\n      <MobilePopup\n        opened\n        footerChildComponent={this.props.mobileFooterComponent}\n        size={this.props.size}\n        id={this.props.popupMenuId}\n        onCloseRequest={onCloseRequest}\n      >\n        <ComboBoxMenu\n          size={this.props.size}\n          items={items}\n          loading={loading}\n          hasMargin={false}\n          refMenu={this.menuRef}\n          maxMenuHeight={maxMenuHeight}\n          onValueChange={onValueChange}\n          opened={opened}\n          renderTotalCount={renderTotalCount}\n          renderItem={renderItem}\n          renderNotFound={renderNotFound}\n          totalCount={totalCount}\n          renderAddButton={renderAddButton}\n        />\n      </MobilePopup>\n    );\n  }\n\n  private menuRef = (node: Nullable<Menu>) => {\n    this.menu = node ?? null;\n  };\n}\n"]}
+{"version":3,"file":"TokenInputMobileMenu.js","sourceRoot":"","sources":["TokenInputMobileMenu.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,qBAAqB,EAAE,MAAM,sDAAsD,CAAC;AAE7F,OAAO,EAAE,YAAY,EAAE,MAAM,wCAAwC,CAAC;AAEtE,OAAO,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAC;AAIlE,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAC;AAcjE;IAAsD,wCAA6C;IAAnG;;QAIU,UAAI,GAAgB,IAAI,CAAC;QAE1B,gBAAU,GAAG,cAAmB,OAAA,KAAI,CAAC,IAAI,EAAT,CAAS,CAAC;QA0DzC,aAAO,GAAG,UAAC,IAAoB;YACrC,KAAI,CAAC,IAAI,GAAG,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,IAAI,CAAC;QAC3B,CAAC,CAAC;;IACJ,CAAC;IA3DQ,qCAAM,GAAb;QACQ,IAAA,KAYF,IAAI,CAAC,KAAK,EAXZ,OAAO,aAAA,EACP,aAAa,mBAAA,EACb,gBAAgB,sBAAA,EAChB,UAAU,gBAAA,EACV,MAAM,YAAA,EACN,KAAK,WAAA,EACL,cAAc,oBAAA,EACd,UAAU,gBAAA,EACV,aAAa,mBAAA,EACb,eAAe,qBAAA,EACf,cAAc,oBACF,CAAC;QAEf,OAAO,CACL,oBAAC,WAAW,IACV,MAAM,QACN,oBAAoB,EAAE,IAAI,CAAC,KAAK,CAAC,qBAAqB,EACtD,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,EACrB,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC,WAAW,EAC1B,cAAc,EAAE,cAAc,IAE7B,MAAM,IAAI,KAAK,KAAK,IAAI,IAAI,IAAI,CAAC,KAAK,CAAC,aAAa,KAAK,qBAAqB,CAAC,MAAM,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CACnG,oBAAC,oBAAoB,IACnB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,aAAa,EAAE,aAAa,EAC5B,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,EACrB,QAAQ,QACR,SAAS,EAAE,KAAK,EAChB,aAAa,EAAE,IAAI,CAAC,KAAK,CAAC,aAAa,EACvC,eAAe,EAAE,eAAe,GAChC,CACH,CAAC,CAAC,CAAC,CACF,oBAAC,YAAY,IACX,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,EACrB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,KAAK,EAChB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,aAAa,EAAE,aAAa,EAC5B,aAAa,EAAE,aAAa,EAC5B,MAAM,EAAE,MAAM,EACd,gBAAgB,EAAE,gBAAgB,EAClC,UAAU,EAAE,UAAU,EACtB,cAAc,EAAE,cAAc,EAC9B,UAAU,EAAE,UAAU,EACtB,eAAe,EAAE,eAAe,EAChC,aAAa,EAAE,IAAI,CAAC,KAAK,CAAC,aAAa,EACvC,aAAa,EAAE,IAAI,CAAC,KAAK,CAAC,aAAa,GACvC,CACH,CACW,CACf,CAAC;IACJ,CAAC;IA7Da,wCAAmB,GAAG,sBAAsB,AAAzB,CAA0B;IAC7C,gCAAW,GAAG,sBAAsB,AAAzB,CAA0B;IAiErD,2BAAC;CAAA,AAnED,CAAsD,KAAK,CAAC,SAAS,GAmEpE;SAnEY,oBAAoB","sourcesContent":["import type { ReactElement, ReactNode } from 'react';\nimport React from 'react';\n\nimport { ComboBoxRequestStatus } from '../../internal/CustomComboBox/CustomComboBoxTypes.js';\nimport type { ComboBoxMenuProps } from '../../internal/CustomComboBox/index.js';\nimport { ComboBoxMenu } from '../../internal/CustomComboBox/index.js';\nimport type { Menu } from '../../internal/Menu/index.js';\nimport { MobilePopup } from '../../internal/MobilePopup/index.js';\nimport type { HTMLProps } from '../../typings/html.js';\nimport type { Nullable } from '../../typings/utility-types.js';\nimport type { TokenSize } from '../Token/index.js';\nimport { TokenInputFailedMenu } from './TokenInputFailedMenu.js';\n\nexport interface TokenInputMobileMenuProps<T> extends ComboBoxMenuProps<T> {\n  /** Задает id выпадающему меню.\n   Полезно при реализации a11y. Например, помогает связать aria-controls с выпадающим меню. */\n  popupMenuId?: HTMLProps['id'];\n  /** Задает размер контрола. */\n  size?: TokenSize;\n  /** Компонент для футера в мобильном попапе */\n  mobileFooterComponent?: ReactNode;\n  /** Функция вызываем при клике по вуали в мобильном модале */\n  onCloseRequest?: () => void;\n}\n\nexport class TokenInputMobileMenu<T = string> extends React.Component<TokenInputMobileMenuProps<T>> {\n  public static __KONTUR_REACT_UI__ = 'TokenInputMobileMenu';\n  public static displayName = 'TokenInputMobileMenu';\n\n  private menu: Menu | null = null;\n\n  public getMenuRef = (): Menu | null => this.menu;\n\n  public render(): ReactElement {\n    const {\n      loading,\n      maxMenuHeight,\n      renderTotalCount,\n      totalCount,\n      opened,\n      items,\n      renderNotFound,\n      renderItem,\n      onValueChange,\n      renderAddButton,\n      onCloseRequest,\n    } = this.props;\n\n    return (\n      <MobilePopup\n        opened\n        footerChildComponent={this.props.mobileFooterComponent}\n        size={this.props.size}\n        id={this.props.popupMenuId}\n        onCloseRequest={onCloseRequest}\n      >\n        {opened && items === null && this.props.requestStatus === ComboBoxRequestStatus.Failed && !loading ? (\n          <TokenInputFailedMenu\n            refMenu={this.menuRef}\n            maxMenuHeight={maxMenuHeight}\n            size={this.props.size}\n            isMobile\n            hasMargin={false}\n            repeatRequest={this.props.repeatRequest}\n            renderAddButton={renderAddButton}\n          />\n        ) : (\n          <ComboBoxMenu\n            size={this.props.size}\n            items={items}\n            loading={loading}\n            hasMargin={false}\n            refMenu={this.menuRef}\n            maxMenuHeight={maxMenuHeight}\n            onValueChange={onValueChange}\n            opened={opened}\n            renderTotalCount={renderTotalCount}\n            renderItem={renderItem}\n            renderNotFound={renderNotFound}\n            totalCount={totalCount}\n            renderAddButton={renderAddButton}\n            requestStatus={this.props.requestStatus}\n            repeatRequest={this.props.repeatRequest}\n          />\n        )}\n      </MobilePopup>\n    );\n  }\n\n  private menuRef = (node: Nullable<Menu>) => {\n    this.menu = node ?? null;\n  };\n}\n"]}

package/components/TokenInput/TokenInputReducer.d.ts

@@ -1,4 +1,8 @@
+import { ComboBoxRequestStatus } from '../../internal/CustomComboBox/CustomComboBoxTypes.js';
 import type { TokenInputState } from './TokenInput.js';
+export interface TokenInputInternalState<T> extends TokenInputState<T> {
+    requestStatus: ComboBoxRequestStatus;
+}
 export interface TokenInputAction {
     type: TokenInputActionType;
     payload?: any;
@@ -14,6 +18,7 @@ export declare const TokenActions: {
     SET_ACTIVE_TOKENS: string;
     REMOVE_ALL_ACTIVE_TOKENS: string;
     SET_LOADING: string;
+    SET_REQUEST_FAILURE: string;
     CLEAR_INPUT: string;
     RESET: string;
     SET_EDITING_TOKEN_INDEX: string;
@@ -24,4 +29,4 @@ export declare const TokenActions: {
     SET_CLOSE_MOBILE_POPUP: string;
 };
 export type TokenInputActionType = keyof typeof TokenActions;
-export declare function tokenInputReducer<T = string>(state: TokenInputState<T>, action: TokenInputAction): Pick<TokenInputState<T>, never>;
+export declare function tokenInputReducer<T = string>(state: TokenInputInternalState<T>, action: TokenInputAction): Pick<TokenInputInternalState<T>, never>;

package/components/TokenInput/TokenInputReducer.js

@@ -1,3 +1,4 @@
+import { ComboBoxRequestStatus } from '../../internal/CustomComboBox/CustomComboBoxTypes.js';
 import { DefaultState } from './TokenInput.js';
 export var TokenActions = {
     SET_INPUT_VALUE_WIDTH: 'SET_INPUT_VALUE_WIDTH',
@@ -10,6 +11,7 @@ export var TokenActions = {
     SET_ACTIVE_TOKENS: 'SET_ACTIVE_TOKENS',
     REMOVE_ALL_ACTIVE_TOKENS: 'REMOVE_ALL_ACTIVE_TOKENS',
     SET_LOADING: 'SET_LOADING',
+    SET_REQUEST_FAILURE: 'SET_REQUEST_FAILURE',
     CLEAR_INPUT: 'CLEAR_INPUT',
     RESET: 'RESET',
     SET_EDITING_TOKEN_INDEX: 'SET_EDITING_TOKEN_INDEX',
@@ -38,7 +40,7 @@ export function tokenInputReducer(state, action) {
             return { preventBlur: payload };
         }
         case TokenActions.SET_AUTOCOMPLETE_ITEMS: {
-            return { autocompleteItems: payload };
+            return { autocompleteItems: payload, loading: false, requestStatus: ComboBoxRequestStatus.Unknown };
         }
         case TokenActions.SET_ACTIVE_TOKENS: {
             return { activeTokens: payload };
@@ -49,17 +51,24 @@ export function tokenInputReducer(state, action) {
                 preventBlur: false,
                 autocompleteItems: undefined,
                 activeTokens: [],
+                loading: false,
+                requestStatus: ComboBoxRequestStatus.Unknown,
             };
         }
         case TokenActions.REMOVE_ALL_ACTIVE_TOKENS: {
             return { activeTokens: [] };
         }
         case TokenActions.CLEAR_INPUT: {
-            return { inputValue: '', autocompleteItems: undefined };
+            return { inputValue: '', autocompleteItems: undefined, requestStatus: ComboBoxRequestStatus.Unknown };
         }
         case TokenActions.SET_LOADING: {
+            return payload ? { loading: true } : { loading: false, requestStatus: ComboBoxRequestStatus.Unknown };
+        }
+        case TokenActions.SET_REQUEST_FAILURE: {
             return {
-                loading: payload,
+                loading: false,
+                autocompleteItems: undefined,
+                requestStatus: ComboBoxRequestStatus.Failed,
             };
         }
         case TokenActions.RESET: {
@@ -87,6 +96,8 @@ export function tokenInputReducer(state, action) {
                 preventBlur: false,
                 autocompleteItems: undefined,
                 activeTokens: [],
+                loading: false,
+                requestStatus: ComboBoxRequestStatus.Unknown,
             };
         }
         default:

package/components/TokenInput/TokenInputReducer.js.map

@@ -1 +1 @@
-{"version":3,"file":"TokenInputReducer.js","sourceRoot":"","sources":["TokenInputReducer.ts"],"names":[],"mappings":"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","sourcesContent":["import { DefaultState } from './TokenInput.js';\nimport type { TokenInputState } from './TokenInput.js';\n\nexport interface TokenInputAction {\n  type: TokenInputActionType;\n  payload?: any;\n}\n\nexport const TokenActions = {\n  SET_INPUT_VALUE_WIDTH: 'SET_INPUT_VALUE_WIDTH',\n  SET_INPUT_VALUE_HEIGHT: 'SET_INPUT_VALUE_HEIGHT',\n  UPDATE_QUERY: 'UPDATE_QUERY',\n  SET_FOCUS_IN: 'SET_FOCUS_IN',\n  SET_PREVENT_BLUR: 'SET_PREVENT_BLUR',\n  BLUR: 'BLUR',\n  SET_AUTOCOMPLETE_ITEMS: 'SET_AUTOCOMPLETE_ITEMS',\n  SET_ACTIVE_TOKENS: 'SET_ACTIVE_TOKENS',\n  REMOVE_ALL_ACTIVE_TOKENS: 'REMOVE_ALL_ACTIVE_TOKENS',\n  SET_LOADING: 'SET_LOADING',\n  CLEAR_INPUT: 'CLEAR_INPUT',\n  RESET: 'RESET',\n  SET_EDITING_TOKEN_INDEX: 'SET_EDITING_TOKEN_INDEX',\n  REMOVE_EDITING_TOKEN_INDEX: 'REMOVE_EDITING_TOKEN_INDEX',\n  SET_TEMPORARY_QUERY: 'SET_TEMPORARY_QUERY',\n  REMOVE_TEMPORARY_QUERY: 'REMOVE_TEMPORARY_QUERY',\n  SET_SHOW_MOBILE_POPUP: 'SET_SHOW_MOBILE_POPUP',\n  SET_CLOSE_MOBILE_POPUP: 'SET_CLOSE_MOBILE_POPUP',\n};\n\nexport type TokenInputActionType = keyof typeof TokenActions;\n\nexport function tokenInputReducer<T = string>(\n  state: TokenInputState<T>,\n  action: TokenInputAction,\n): Pick<TokenInputState<T>, never> {\n  const payload = action.payload;\n  switch (action.type) {\n    case TokenActions.SET_INPUT_VALUE_WIDTH: {\n      return { inputValueWidth: payload };\n    }\n    case TokenActions.SET_INPUT_VALUE_HEIGHT: {\n      return { inputValueHeight: payload };\n    }\n    case TokenActions.UPDATE_QUERY: {\n      return { inputValue: payload };\n    }\n    case TokenActions.SET_FOCUS_IN: {\n      return { inFocus: true };\n    }\n    case TokenActions.SET_PREVENT_BLUR: {\n      return { preventBlur: payload };\n    }\n    case TokenActions.SET_AUTOCOMPLETE_ITEMS: {\n      return { autocompleteItems: payload };\n    }\n    case TokenActions.SET_ACTIVE_TOKENS: {\n      return { activeTokens: payload };\n    }\n    case TokenActions.BLUR: {\n      return {\n        inFocus: false,\n        preventBlur: false,\n        autocompleteItems: undefined,\n        activeTokens: [],\n      };\n    }\n    case TokenActions.REMOVE_ALL_ACTIVE_TOKENS: {\n      return { activeTokens: [] };\n    }\n    case TokenActions.CLEAR_INPUT: {\n      return { inputValue: '', autocompleteItems: undefined };\n    }\n    case TokenActions.SET_LOADING: {\n      return {\n        loading: payload,\n      };\n    }\n    case TokenActions.RESET: {\n      return DefaultState;\n    }\n    case TokenActions.SET_EDITING_TOKEN_INDEX: {\n      return { editingTokenIndex: payload };\n    }\n    case TokenActions.REMOVE_EDITING_TOKEN_INDEX: {\n      return { editingTokenIndex: -1 };\n    }\n    case TokenActions.SET_TEMPORARY_QUERY: {\n      return { reservedInputValue: payload };\n    }\n    case TokenActions.REMOVE_TEMPORARY_QUERY: {\n      return { reservedInputValue: undefined };\n    }\n    case TokenActions.SET_SHOW_MOBILE_POPUP: {\n      return { showMobilePopup: true };\n    }\n    case TokenActions.SET_CLOSE_MOBILE_POPUP: {\n      return {\n        showMobilePopup: false,\n        inFocus: false,\n        preventBlur: false,\n        autocompleteItems: undefined,\n        activeTokens: [],\n      };\n    }\n    default:\n      return state;\n  }\n}\n"]}
+{"version":3,"file":"TokenInputReducer.js","sourceRoot":"","sources":["TokenInputReducer.ts"],"names":[],"mappings":"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","sourcesContent":["import { ComboBoxRequestStatus } from '../../internal/CustomComboBox/CustomComboBoxTypes.js';\nimport { DefaultState } from './TokenInput.js';\nimport type { TokenInputState } from './TokenInput.js';\n\nexport interface TokenInputInternalState<T> extends TokenInputState<T> {\n  requestStatus: ComboBoxRequestStatus;\n}\n\nexport interface TokenInputAction {\n  type: TokenInputActionType;\n  payload?: any;\n}\n\nexport const TokenActions = {\n  SET_INPUT_VALUE_WIDTH: 'SET_INPUT_VALUE_WIDTH',\n  SET_INPUT_VALUE_HEIGHT: 'SET_INPUT_VALUE_HEIGHT',\n  UPDATE_QUERY: 'UPDATE_QUERY',\n  SET_FOCUS_IN: 'SET_FOCUS_IN',\n  SET_PREVENT_BLUR: 'SET_PREVENT_BLUR',\n  BLUR: 'BLUR',\n  SET_AUTOCOMPLETE_ITEMS: 'SET_AUTOCOMPLETE_ITEMS',\n  SET_ACTIVE_TOKENS: 'SET_ACTIVE_TOKENS',\n  REMOVE_ALL_ACTIVE_TOKENS: 'REMOVE_ALL_ACTIVE_TOKENS',\n  SET_LOADING: 'SET_LOADING',\n  SET_REQUEST_FAILURE: 'SET_REQUEST_FAILURE',\n  CLEAR_INPUT: 'CLEAR_INPUT',\n  RESET: 'RESET',\n  SET_EDITING_TOKEN_INDEX: 'SET_EDITING_TOKEN_INDEX',\n  REMOVE_EDITING_TOKEN_INDEX: 'REMOVE_EDITING_TOKEN_INDEX',\n  SET_TEMPORARY_QUERY: 'SET_TEMPORARY_QUERY',\n  REMOVE_TEMPORARY_QUERY: 'REMOVE_TEMPORARY_QUERY',\n  SET_SHOW_MOBILE_POPUP: 'SET_SHOW_MOBILE_POPUP',\n  SET_CLOSE_MOBILE_POPUP: 'SET_CLOSE_MOBILE_POPUP',\n};\n\nexport type TokenInputActionType = keyof typeof TokenActions;\n\nexport function tokenInputReducer<T = string>(\n  state: TokenInputInternalState<T>,\n  action: TokenInputAction,\n): Pick<TokenInputInternalState<T>, never> {\n  const payload = action.payload;\n  switch (action.type) {\n    case TokenActions.SET_INPUT_VALUE_WIDTH: {\n      return { inputValueWidth: payload };\n    }\n    case TokenActions.SET_INPUT_VALUE_HEIGHT: {\n      return { inputValueHeight: payload };\n    }\n    case TokenActions.UPDATE_QUERY: {\n      return { inputValue: payload };\n    }\n    case TokenActions.SET_FOCUS_IN: {\n      return { inFocus: true };\n    }\n    case TokenActions.SET_PREVENT_BLUR: {\n      return { preventBlur: payload };\n    }\n    case TokenActions.SET_AUTOCOMPLETE_ITEMS: {\n      return { autocompleteItems: payload, loading: false, requestStatus: ComboBoxRequestStatus.Unknown };\n    }\n    case TokenActions.SET_ACTIVE_TOKENS: {\n      return { activeTokens: payload };\n    }\n    case TokenActions.BLUR: {\n      return {\n        inFocus: false,\n        preventBlur: false,\n        autocompleteItems: undefined,\n        activeTokens: [],\n        loading: false,\n        requestStatus: ComboBoxRequestStatus.Unknown,\n      };\n    }\n    case TokenActions.REMOVE_ALL_ACTIVE_TOKENS: {\n      return { activeTokens: [] };\n    }\n    case TokenActions.CLEAR_INPUT: {\n      return { inputValue: '', autocompleteItems: undefined, requestStatus: ComboBoxRequestStatus.Unknown };\n    }\n    case TokenActions.SET_LOADING: {\n      return payload ? { loading: true } : { loading: false, requestStatus: ComboBoxRequestStatus.Unknown };\n    }\n    case TokenActions.SET_REQUEST_FAILURE: {\n      return {\n        loading: false,\n        autocompleteItems: undefined,\n        requestStatus: ComboBoxRequestStatus.Failed,\n      };\n    }\n    case TokenActions.RESET: {\n      return DefaultState;\n    }\n    case TokenActions.SET_EDITING_TOKEN_INDEX: {\n      return { editingTokenIndex: payload };\n    }\n    case TokenActions.REMOVE_EDITING_TOKEN_INDEX: {\n      return { editingTokenIndex: -1 };\n    }\n    case TokenActions.SET_TEMPORARY_QUERY: {\n      return { reservedInputValue: payload };\n    }\n    case TokenActions.REMOVE_TEMPORARY_QUERY: {\n      return { reservedInputValue: undefined };\n    }\n    case TokenActions.SET_SHOW_MOBILE_POPUP: {\n      return { showMobilePopup: true };\n    }\n    case TokenActions.SET_CLOSE_MOBILE_POPUP: {\n      return {\n        showMobilePopup: false,\n        inFocus: false,\n        preventBlur: false,\n        autocompleteItems: undefined,\n        activeTokens: [],\n        loading: false,\n        requestStatus: ComboBoxRequestStatus.Unknown,\n      };\n    }\n    default:\n      return state;\n  }\n}\n"]}

package/components/TokenInput/locale/locales/en.js

@@ -1,5 +1,6 @@
 export var componentsLocales = {
     addButtonComment: 'Type comma',
+    addButtonInvalidComment: 'Invalid format',
     addButtonTitle: 'Add',
 };
 //# sourceMappingURL=en.js.map

package/components/TokenInput/locale/locales/en.js.map

@@ -1 +1 @@
-{"version":3,"file":"en.js","sourceRoot":"","sources":["en.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,IAAM,iBAAiB,GAAqB;IACjD,gBAAgB,EAAE,YAAY;IAC9B,cAAc,EAAE,KAAK;CACtB,CAAC","sourcesContent":["import type { TokenInputLocale } from '../types.js';\n\nexport const componentsLocales: TokenInputLocale = {\n  addButtonComment: 'Type comma',\n  addButtonTitle: 'Add',\n};\n"]}
+{"version":3,"file":"en.js","sourceRoot":"","sources":["en.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,IAAM,iBAAiB,GAAqB;IACjD,gBAAgB,EAAE,YAAY;IAC9B,uBAAuB,EAAE,gBAAgB;IACzC,cAAc,EAAE,KAAK;CACtB,CAAC","sourcesContent":["import type { TokenInputLocale } from '../types.js';\n\nexport const componentsLocales: TokenInputLocale = {\n  addButtonComment: 'Type comma',\n  addButtonInvalidComment: 'Invalid format',\n  addButtonTitle: 'Add',\n};\n"]}

package/components/TokenInput/locale/locales/ru.js

@@ -1,5 +1,6 @@
 export var componentsLocales = {
     addButtonComment: 'Нажмите запятую',
+    addButtonInvalidComment: 'Неверный формат',
     addButtonTitle: 'Добавить',
 };
 //# sourceMappingURL=ru.js.map

package/components/TokenInput/locale/locales/ru.js.map

@@ -1 +1 @@
-{"version":3,"file":"ru.js","sourceRoot":"","sources":["ru.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,IAAM,iBAAiB,GAAqB;IACjD,gBAAgB,EAAE,iBAAiB;IACnC,cAAc,EAAE,UAAU;CAC3B,CAAC","sourcesContent":["import type { TokenInputLocale } from '../types.js';\n\nexport const componentsLocales: TokenInputLocale = {\n  addButtonComment: 'Нажмите запятую',\n  addButtonTitle: 'Добавить',\n};\n"]}
+{"version":3,"file":"ru.js","sourceRoot":"","sources":["ru.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,IAAM,iBAAiB,GAAqB;IACjD,gBAAgB,EAAE,iBAAiB;IACnC,uBAAuB,EAAE,iBAAiB;IAC1C,cAAc,EAAE,UAAU;CAC3B,CAAC","sourcesContent":["import type { TokenInputLocale } from '../types.js';\n\nexport const componentsLocales: TokenInputLocale = {\n  addButtonComment: 'Нажмите запятую',\n  addButtonInvalidComment: 'Неверный формат',\n  addButtonTitle: 'Добавить',\n};\n"]}

package/components/TokenInput/locale/types.d.ts

@@ -1,4 +1,5 @@
 export interface TokenInputLocale {
     addButtonComment: string;
+    addButtonInvalidComment: string;
     addButtonTitle: string;
 }

package/components/TokenInput/locale/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["types.ts"],"names":[],"mappings":"","sourcesContent":["export interface TokenInputLocale {\n  addButtonComment: string;\n  addButtonTitle: string;\n}\n"]}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["types.ts"],"names":[],"mappings":"","sourcesContent":["export interface TokenInputLocale {\n  addButtonComment: string;\n  addButtonInvalidComment: string;\n  addButtonTitle: string;\n}\n"]}

package/components/Tooltip/Tooltip.d.ts

@@ -86,6 +86,7 @@ export declare class Tooltip extends React.PureComponent<TooltipProps, TooltipSt
     private static triggersToOverrideOnMobile;
     state: TooltipState;
     private isMobileLayout;
+    private isMobileInteraction;
     private globalObject;
     private emotion;
     private cx;

package/components/Tooltip/Tooltip.js

@@ -89,6 +89,7 @@ var Tooltip = /** @class */ (function (_super) {
         _this.getProps = createPropsGetter(Tooltip_1.defaultProps);
         _this.state = { opened: false, focused: false };
         _this.isMobileLayout = false;
+        _this.isMobileInteraction = false;
         _this.contentElement = null;
         _this.clickedOutside = true;
         _this.popupRef = React.createRef();
@@ -107,7 +108,7 @@ var Tooltip = /** @class */ (function (_super) {
         };
         _this.getTrigger = function () {
             var trigger = _this.getProps().trigger;
-            return _this.isMobileLayout && Tooltip_1.triggersToOverrideOnMobile.includes(trigger) ? 'click' : trigger;
+            return _this.isMobileInteraction && Tooltip_1.triggersToOverrideOnMobile.includes(trigger) ? 'click' : trigger;
         };
         _this.getPos = function () {
             var positions = _this.getPositions();
@@ -129,7 +130,7 @@ var Tooltip = /** @class */ (function (_super) {
         _this.open = function () { return _this.setState({ opened: true }); };
         _this.close = function () { return _this.setState({ opened: false }); };
         _this.handleMouseEnter = function (event) {
-            if (_this.isMobileLayout) {
+            if (_this.isMobileInteraction) {
                 return;
             }
             var isHoverAnchor = _this.getProps().trigger === 'hoverAnchor';
@@ -140,7 +141,7 @@ var Tooltip = /** @class */ (function (_super) {
             _this.hoverTimeout = setTimeout(_this.open, _this.getProps().delayBeforeShow);
         };
         _this.handleMouseLeave = function (event) {
-            if (_this.isMobileLayout) {
+            if (_this.isMobileInteraction) {
                 return;
             }
             var trigger = _this.getTrigger();
@@ -178,13 +179,13 @@ var Tooltip = /** @class */ (function (_super) {
         _this.handleClick = function () {
             var _a, _b;
             var toggleOpenState = function () {
-                if (_this.isMobileLayout && _this.state.opened) {
+                if (_this.isMobileInteraction && _this.state.opened) {
                     _this.close();
                     return;
                 }
                 _this.open();
             };
-            if (_this.isMobileLayout) {
+            if (_this.isMobileInteraction) {
                 // Don't lose change event of Checkbox/RadioGroup/Toggle on mobile tap
                 _this.clickTimeout = (_b = (_a = _this.globalObject).requestAnimationFrame) === null || _b === void 0 ? void 0 : _b.call(_a, function () {
                     _this.clickTimeout = null;
@@ -315,15 +316,16 @@ var Tooltip = /** @class */ (function (_super) {
                     popupPinOffsetY: _this.sizeVariables.pinOffsetY,
                     popupMargin: _this.sizeVariables.margin,
                 }, theme) },
-                React.createElement(ResponsiveLayout, null, function (layout) {
+                React.createElement(ResponsiveLayout, { customMediaQueries: { canHover: '(hover: hover)' } }, function (layout) {
                     _this.isMobileLayout = layout.isMobile;
+                    _this.isMobileInteraction = layout.isMobile && !layout.canHover;
                     return _this.renderMain();
                 })));
         }));
     };
     Tooltip.prototype.renderCloseButton = function () {
         var hasCross = this.props.closeButton === undefined
-            ? !Tooltip_1.triggersWithoutCloseButton.includes(this.getTrigger())
+            ? this.isMobileLayout || !Tooltip_1.triggersWithoutCloseButton.includes(this.getTrigger())
             : this.props.closeButton;
         if (!hasCross) {
             return null;