@skbkontur/react-ui 0.0.0-2ac4c133dd → 0.0.0-2d059f9369

package/cjs/internal/CustomComboBox/ArrowDownIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ArrowDownIcon.tsx"],"names":["ArrowDownIcon","small","medium","large"],"mappings":";AACA;;AAEA;AACA;AACA;AACA,mD,CANA;;AAQO,IAAMA,aAAa,GAAG;AAC3B;AACEC,EAAAA,KAAK,EAAE,sCAAM,6BAAC,gDAAD,OAAN,EADT;AAEEC,EAAAA,MAAM,EAAE,uCAAM,6BAAC,gDAAD,OAAN,EAFV;AAGEC,EAAAA,KAAK,EAAE,sCAAM,6BAAC,gDAAD,OAAN,EAHT,EAD2B;;AAM3B,eAN2B,CAAtB,C","sourcesContent":["/* eslint-disable react/display-name */\nimport React from 'react';\n\nimport { ArrowCDownIcon16Regular } from '../icons2022/ArrowCDownIcon/ArrowCDownIcon16Regular';\nimport { ArrowCDownIcon20Regular } from '../icons2022/ArrowCDownIcon/ArrowCDownIcon20Regular';\nimport { ArrowCDownIcon24Regular } from '../icons2022/ArrowCDownIcon/ArrowCDownIcon24Regular';\nimport { iconSizer } from '../icons2022/iconSizer';\n\nexport const ArrowDownIcon = iconSizer(\n  {\n    small: () => <ArrowCDownIcon16Regular />,\n    medium: () => <ArrowCDownIcon20Regular />,\n    large: () => <ArrowCDownIcon24Regular />,\n  },\n  'ArrowDownIcon',\n);\n"]}

package/cjs/internal/CustomComboBox/ComboBoxMenu.d.ts

@@ -1,11 +1,13 @@
-import React, { Component } from 'react';
+import React from 'react';
 import { Menu } from '../Menu';
 import { MenuItemState } from '../../components/MenuItem';
 import { Nullable } from '../../typings/utility-types';
+import { ComboBoxExtendedItem } from '../../components/ComboBox';
+import { SizeProp } from '../../lib/types/props';
 import { ComboBoxRequestStatus } from './CustomComboBoxTypes';
 export interface ComboBoxMenuProps<T> {
     opened?: boolean;
-    items?: Nullable<T[]>;
+    items?: Nullable<Array<ComboBoxExtendedItem<T>>>;
     totalCount?: number;
     loading?: boolean;
     maxMenuHeight?: number | string;
@@ -13,12 +15,15 @@ export interface ComboBoxMenuProps<T> {
     renderNotFound?: () => React.ReactNode;
     renderTotalCount?: (found: number, total: number) => React.ReactNode;
     renderItem: (item: T, state: MenuItemState) => React.ReactNode;
+    itemWrapper?: (item: T) => React.ComponentType<unknown>;
     onValueChange: (value: T) => any;
     renderAddButton?: () => React.ReactNode;
     caption?: React.ReactNode;
     repeatRequest?: () => void;
     requestStatus?: ComboBoxRequestStatus;
     isMobile?: boolean;
+    menuId?: string;
+    size?: SizeProp;
 }
 export declare const ComboBoxMenuDataTids: {
     readonly loading: "ComboBoxMenu__loading";
@@ -27,13 +32,15 @@ export declare const ComboBoxMenuDataTids: {
     readonly items: "ComboBoxMenu__items";
     readonly item: "ComboBoxMenu__item";
 };
-export declare class ComboBoxMenu<T> extends Component<ComboBoxMenuProps<T>> {
+declare type DefaultProps<T> = Required<Pick<ComboBoxMenuProps<T>, 'repeatRequest' | 'requestStatus'>>;
+export declare class ComboBoxMenu<T> extends React.Component<ComboBoxMenuProps<T>> {
     static __KONTUR_REACT_UI__: string;
-    static defaultProps: {
-        repeatRequest: () => undefined;
-        requestStatus: ComboBoxRequestStatus;
-    };
+    static defaultProps: DefaultProps<unknown>;
+    private getProps;
     private readonly locale;
-    render(): JSX.Element | null;
+    private theme;
+    render(): JSX.Element;
+    renderMain(): JSX.Element | null;
     private renderItem;
 }
+export {};

package/cjs/internal/CustomComboBox/ComboBoxMenu.js

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.ComboBoxMenuDataTids = exports.ComboBoxMenu = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireWildcard(require("react"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.ComboBoxMenuDataTids = exports.ComboBoxMenu = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 
 var _utils = require("../../lib/utils");
 var _decorators = require("../../lib/locale/decorators");
@@ -7,9 +7,19 @@ var _MenuItem = require("../../components/MenuItem");
 var _Spinner = require("../../components/Spinner");
 
 var _MenuSeparator = require("../../components/MenuSeparator");
+var _createPropsGetter = require("../../lib/createPropsGetter");
+var _MenuMessage = require("../MenuMessage");
+
+
+var _ThemeContext = require("../../lib/theming/ThemeContext");
+var _MenuFooter = require("../../components/MenuFooter");
+
 
 var _CustomComboBoxTypes = require("./CustomComboBoxTypes");
-var _locale = require("./locale");var _dec, _class, _class2, _temp;function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}
+var _locale = require("./locale");var _dec, _class, _class2, _temp;
+
+
+
 
 
 
@@ -38,7 +48,33 @@ var ComboBoxMenuDataTids = {
 
 
 
-ComboBoxMenu = (_dec = (0, _decorators.locale)('ComboBox', _locale.CustomComboBoxLocaleHelper), _dec(_class = (_temp = _class2 = /*#__PURE__*/function (_Component) {(0, _inheritsLoose2.default)(ComboBoxMenu, _Component);function ComboBoxMenu() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _Component.call.apply(_Component, [this].concat(args)) || this;_this.
+
+
+ComboBoxMenu = (_dec = (0, _decorators.locale)('ComboBox', _locale.CustomComboBoxLocaleHelper), _dec(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(ComboBoxMenu, _React$Component);function ComboBoxMenu() {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.
+
+
+
+
+
+
+
+    getProps = (0, _createPropsGetter.createPropsGetter)(ComboBoxMenu.defaultProps);_this.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
 
 
 
@@ -156,10 +192,10 @@ ComboBoxMenu = (_dec = (0, _decorators.locale)('ComboBox', _locale.CustomComboBo
     renderItem = function (item, index) {
       // NOTE this is undesireable feature, better
       // to remove it from further versions
-      var _this$props = _this.props,renderItem = _this$props.renderItem,onValueChange = _this$props.onValueChange;
-      if (typeof item === 'function' || /*#__PURE__*/_react.default.isValidElement(item)) {
-        // @ts-ignore
-        var element = typeof item === 'function' ? item() : item;
+      var _this$props = _this.props,renderItem = _this$props.renderItem,onValueChange = _this$props.onValueChange,itemWrapper = _this$props.itemWrapper;
+
+      if (!isSimpleItem(item)) {
+        var element = (0, _utils.isFunction)(item) ? item() : item;
         var props = Object.assign(
         {
           key: index,
@@ -172,13 +208,19 @@ ComboBoxMenu = (_dec = (0, _decorators.locale)('ComboBox', _locale.CustomComboBo
 
       return /*#__PURE__*/(
         _react.default.createElement(_MenuItem.MenuItem, {
+          component: itemWrapper == null ? void 0 : itemWrapper(item),
           "data-tid": ComboBoxMenuDataTids.item,
           onClick: function onClick() {return onValueChange(item);},
           key: index,
+          size: _this.props.size,
           isMobile: _this.props.isMobile },
 
         function (state) {return renderItem(item, state);}));
 
 
-    };return _this;}var _proto = ComboBoxMenu.prototype;_proto.render = function render() {var _this$props2 = this.props,opened = _this$props2.opened,items = _this$props2.items,totalCount = _this$props2.totalCount,loading = _this$props2.loading,refMenu = _this$props2.refMenu,_this$props2$renderNo = _this$props2.renderNotFound,renderNotFound = _this$props2$renderNo === void 0 ? function () {return notFound;} : _this$props2$renderNo,renderTotalCount = _this$props2.renderTotalCount,maxMenuHeight = _this$props2.maxMenuHeight,requestStatus = _this$props2.requestStatus,isMobile = _this$props2.isMobile;var _this$locale = this.locale,notFound = _this$locale.notFound,errorNetworkButton = _this$locale.errorNetworkButton,errorNetworkMessage = _this$locale.errorNetworkMessage;if (!opened) {return null;}var renderAddButton = null;if (this.props.renderAddButton) {renderAddButton = this.props.renderAddButton();}var maxHeight = isMobile ? 'auto' : maxMenuHeight;if (loading && (!items || !items.length)) {return /*#__PURE__*/_react.default.createElement(_Menu.Menu, { maxHeight: maxHeight, ref: refMenu, disableScrollContainer: isMobile, "data-tid": ComboBoxMenuDataTids.loading }, /*#__PURE__*/_react.default.createElement(_MenuItem.MenuItem, { disabled: true, isMobile: isMobile }, /*#__PURE__*/_react.default.createElement(_Spinner.Spinner, { type: "mini", dimmed: true })));}if (items === null && requestStatus === _CustomComboBoxTypes.ComboBoxRequestStatus.Failed) {return /*#__PURE__*/_react.default.createElement(_Menu.Menu, { ref: refMenu, maxHeight: maxHeight, disableScrollContainer: isMobile, "data-tid": ComboBoxMenuDataTids.failed }, /*#__PURE__*/_react.default.createElement(_MenuItem.MenuItem, { disabled: true, key: "message", isMobile: isMobile }, /*#__PURE__*/_react.default.createElement("div", { style: { maxWidth: 300, whiteSpace: 'normal' } }, errorNetworkMessage)), /*#__PURE__*/_react.default.createElement(_MenuItem.MenuItem, { link: true, onClick: this.props.repeatRequest, key: "retry", isMobile: isMobile }, errorNetworkButton));}if (((0, _utils.isNullable)(items) || items.length === 0) && renderNotFound) {var notFoundValue = renderNotFound();if (renderAddButton) {return /*#__PURE__*/_react.default.createElement(_Menu.Menu, { maxHeight: maxHeight, ref: refMenu, disableScrollContainer: isMobile }, renderAddButton);}if (notFoundValue) {return /*#__PURE__*/_react.default.createElement(_Menu.Menu, { maxHeight: maxHeight, ref: refMenu, disableScrollContainer: isMobile }, /*#__PURE__*/_react.default.createElement(_MenuItem.MenuItem, { "data-tid": ComboBoxMenuDataTids.notFound, disabled: true, isMobile: isMobile }, notFoundValue));}return null;}var total = null;var renderedItems = items && items.map(this.renderItem); // @ts-ignore // todo fix checking
-    var countItems = renderedItems == null ? void 0 : renderedItems.filter(function (item) {var _item$type;return (item == null ? void 0 : (_item$type = item.type) == null ? void 0 : _item$type.__KONTUR_REACT_UI__) === 'MenuItem';}).length;if (countItems && renderTotalCount && totalCount && countItems < totalCount) {total = /*#__PURE__*/_react.default.createElement(_MenuItem.MenuItem, { disabled: true, key: "total", isMobile: isMobile }, /*#__PURE__*/_react.default.createElement("div", { style: { fontSize: 12 } }, renderTotalCount(countItems, totalCount)));}return /*#__PURE__*/_react.default.createElement(_Menu.Menu, { "data-tid": ComboBoxMenuDataTids.items, ref: refMenu, maxHeight: maxHeight, disableScrollContainer: isMobile }, renderedItems, total, renderAddButton && [/*#__PURE__*/_react.default.createElement(_MenuSeparator.MenuSeparator, { key: "separator" }), renderAddButton]);};return ComboBoxMenu;}(_react.Component), _class2.__KONTUR_REACT_UI__ = 'ComboBoxMenu', _class2.defaultProps = { repeatRequest: function repeatRequest() {return undefined;}, requestStatus: _CustomComboBoxTypes.ComboBoxRequestStatus.Unknown }, _temp)) || _class);exports.ComboBoxMenu = ComboBoxMenu;
+    };return _this;}var _proto = ComboBoxMenu.prototype;_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Provider, { value: _this2.theme }, _this2.renderMain());});};_proto.renderMain = function renderMain() {var _this$props2 = this.props,opened = _this$props2.opened,items = _this$props2.items,totalCount = _this$props2.totalCount,loading = _this$props2.loading,refMenu = _this$props2.refMenu,_this$props2$renderNo = _this$props2.renderNotFound,renderNotFound = _this$props2$renderNo === void 0 ? function () {return notFound;} : _this$props2$renderNo,renderTotalCount = _this$props2.renderTotalCount,maxMenuHeight = _this$props2.maxMenuHeight,isMobile = _this$props2.isMobile;var requestStatus = this.getProps().requestStatus;var _this$locale = this.locale,notFound = _this$locale.notFound,errorNetworkButton = _this$locale.errorNetworkButton,errorNetworkMessage = _this$locale.errorNetworkMessage;if (!opened) {return null;}var renderAddButton = null;if (this.props.renderAddButton) {renderAddButton = this.props.renderAddButton();}var maxHeight = isMobile ? 'auto' : maxMenuHeight;if (loading && (!items || !items.length)) {return /*#__PURE__*/_react.default.createElement(_Menu.Menu, { maxHeight: maxHeight, ref: refMenu, disableScrollContainer: isMobile, id: this.props.menuId, "data-tid": ComboBoxMenuDataTids.loading }, /*#__PURE__*/_react.default.createElement(_MenuMessage.MenuMessage, { size: this.props.size, as: "div" }, /*#__PURE__*/_react.default.createElement(_Spinner.Spinner, { type: "mini", dimmed: true })));}if (items === null && requestStatus === _CustomComboBoxTypes.ComboBoxRequestStatus.Failed) {return /*#__PURE__*/_react.default.createElement(_Menu.Menu, { ref: refMenu, maxHeight: maxHeight, disableScrollContainer: isMobile, id: this.props.menuId, "data-tid": ComboBoxMenuDataTids.failed }, /*#__PURE__*/_react.default.createElement(_MenuMessage.MenuMessage, { size: this.props.size, key: "message" }, /*#__PURE__*/_react.default.createElement("div", { style: { maxWidth: 300, whiteSpace: 'normal' } }, errorNetworkMessage)), /*#__PURE__*/_react.default.createElement(_MenuItem.MenuItem, { link: true, onClick: this.getProps().repeatRequest, size: this.props.size, key: "retry", isMobile: isMobile }, errorNetworkButton));}if (((0, _utils.isNullable)(items) || items.length === 0) && renderNotFound) {var notFoundValue = renderNotFound();if (renderAddButton) {return /*#__PURE__*/_react.default.createElement(_Menu.Menu, { id: this.props.menuId, maxHeight: maxHeight, ref: refMenu, disableScrollContainer: isMobile }, renderAddButton);}if (notFoundValue) {return /*#__PURE__*/_react.default.createElement(_Menu.Menu, { id: this.props.menuId, maxHeight: maxHeight, ref: refMenu, disableScrollContainer: isMobile }, /*#__PURE__*/_react.default.createElement(_MenuMessage.MenuMessage, { size: this.props.size, "data-tid": ComboBoxMenuDataTids.notFound }, notFoundValue));}return null;}var total = null;var renderedItems = items && items.map(this.renderItem);var menuItems = renderedItems == null ? void 0 : renderedItems.filter(function (item) {return (0, _MenuItem.isMenuItem)(item);});var countItems = menuItems == null ? void 0 : menuItems.length;if (countItems && renderTotalCount && totalCount && countItems < totalCount) {total = /*#__PURE__*/_react.default.createElement(_MenuFooter.MenuFooter, { size: this.props.size, key: "total" }, /*#__PURE__*/_react.default.createElement("div", null, renderTotalCount(countItems, totalCount)));}return /*#__PURE__*/_react.default.createElement(_Menu.Menu, { id: this.props.menuId, "data-tid": ComboBoxMenuDataTids.items, ref: refMenu, maxHeight: maxHeight, disableScrollContainer: isMobile }, renderedItems, total, renderAddButton && [/*#__PURE__*/_react.default.createElement(_MenuSeparator.MenuSeparator, { key: "separator" }), renderAddButton]);};return ComboBoxMenu;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'ComboBoxMenu', _class2.defaultProps = { repeatRequest: function repeatRequest() {return undefined;}, requestStatus: _CustomComboBoxTypes.ComboBoxRequestStatus.Unknown }, _temp)) || _class);exports.ComboBoxMenu = ComboBoxMenu;
+
+
+function isSimpleItem(item) {
+  return !(0, _utils.isFunction)(item) && ! /*#__PURE__*/_react.default.isValidElement(item);
+}

package/cjs/internal/CustomComboBox/ComboBoxMenu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ComboBoxMenu.tsx"],"names":["ComboBoxMenuDataTids","loading","failed","notFound","items","item","ComboBoxMenu","CustomComboBoxLocaleHelper","renderItem","index","props","onValueChange","React","isValidElement","element","Object","assign","key","onClick","cloneElement","isMobile","state","render","opened","totalCount","refMenu","renderNotFound","renderTotalCount","maxMenuHeight","requestStatus","locale","errorNetworkButton","errorNetworkMessage","renderAddButton","maxHeight","length","ComboBoxRequestStatus","Failed","maxWidth","whiteSpace","repeatRequest","notFoundValue","total","renderedItems","map","countItems","filter","type","__KONTUR_REACT_UI__","fontSize","Component","defaultProps","undefined","Unknown"],"mappings":"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","sourcesContent":["import React, { Component } from 'react';\n\nimport { isNullable } from '../../lib/utils';\nimport { locale } from '../../lib/locale/decorators';\nimport { Menu } from '../Menu';\nimport { MenuItem, MenuItemState } from '../../components/MenuItem';\nimport { Spinner } from '../../components/Spinner';\nimport { Nullable } from '../../typings/utility-types';\nimport { MenuSeparator } from '../../components/MenuSeparator';\n\nimport { ComboBoxRequestStatus } from './CustomComboBoxTypes';\nimport { ComboBoxLocale, CustomComboBoxLocaleHelper } from './locale';\n\nexport interface ComboBoxMenuProps<T> {\n  opened?: boolean;\n  items?: Nullable<T[]>;\n  totalCount?: number;\n  loading?: boolean;\n  maxMenuHeight?: number | string;\n  refMenu?: (menu: Nullable<Menu>) => void;\n  renderNotFound?: () => React.ReactNode;\n  renderTotalCount?: (found: number, total: number) => React.ReactNode;\n  renderItem: (item: T, state: MenuItemState) => React.ReactNode;\n  onValueChange: (value: T) => any;\n  renderAddButton?: () => React.ReactNode;\n  caption?: React.ReactNode;\n  repeatRequest?: () => void;\n  requestStatus?: ComboBoxRequestStatus;\n  isMobile?: boolean;\n}\n\nexport const ComboBoxMenuDataTids = {\n  loading: 'ComboBoxMenu__loading',\n  failed: 'ComboBoxMenu__failed',\n  notFound: 'ComboBoxMenu__notFound',\n  items: 'ComboBoxMenu__items',\n  item: 'ComboBoxMenu__item',\n} as const;\n\n@locale('ComboBox', CustomComboBoxLocaleHelper)\nexport class ComboBoxMenu<T> extends Component<ComboBoxMenuProps<T>> {\n  public static __KONTUR_REACT_UI__ = 'ComboBoxMenu';\n\n  public static defaultProps = {\n    repeatRequest: () => undefined,\n    requestStatus: ComboBoxRequestStatus.Unknown,\n  };\n\n  private readonly locale!: ComboBoxLocale;\n\n  public render() {\n    const {\n      opened,\n      items,\n      totalCount,\n      loading,\n      refMenu,\n      renderNotFound = () => notFound,\n      renderTotalCount,\n      maxMenuHeight,\n      requestStatus,\n      isMobile,\n    } = this.props;\n\n    const { notFound, errorNetworkButton, errorNetworkMessage } = this.locale;\n\n    if (!opened) {\n      return null;\n    }\n\n    let renderAddButton = null;\n    if (this.props.renderAddButton) {\n      renderAddButton = this.props.renderAddButton();\n    }\n\n    const maxHeight = isMobile ? 'auto' : maxMenuHeight;\n\n    if (loading && (!items || !items.length)) {\n      return (\n        <Menu\n          maxHeight={maxHeight}\n          ref={refMenu}\n          disableScrollContainer={isMobile}\n          data-tid={ComboBoxMenuDataTids.loading}\n        >\n          <MenuItem disabled isMobile={isMobile}>\n            <Spinner type=\"mini\" dimmed />\n          </MenuItem>\n        </Menu>\n      );\n    }\n\n    if (items === null && requestStatus === ComboBoxRequestStatus.Failed) {\n      return (\n        <Menu\n          ref={refMenu}\n          maxHeight={maxHeight}\n          disableScrollContainer={isMobile}\n          data-tid={ComboBoxMenuDataTids.failed}\n        >\n          <MenuItem disabled key=\"message\" isMobile={isMobile}>\n            <div style={{ maxWidth: 300, whiteSpace: 'normal' }}>{errorNetworkMessage}</div>\n          </MenuItem>\n          <MenuItem link onClick={this.props.repeatRequest} key=\"retry\" isMobile={isMobile}>\n            {errorNetworkButton}\n          </MenuItem>\n        </Menu>\n      );\n    }\n\n    if ((isNullable(items) || items.length === 0) && renderNotFound) {\n      const notFoundValue = renderNotFound();\n      if (renderAddButton) {\n        return (\n          <Menu maxHeight={maxHeight} ref={refMenu} disableScrollContainer={isMobile}>\n            {renderAddButton}\n          </Menu>\n        );\n      }\n\n      if (notFoundValue) {\n        return (\n          <Menu maxHeight={maxHeight} ref={refMenu} disableScrollContainer={isMobile}>\n            <MenuItem data-tid={ComboBoxMenuDataTids.notFound} disabled isMobile={isMobile}>\n              {notFoundValue}\n            </MenuItem>\n          </Menu>\n        );\n      }\n\n      return null;\n    }\n\n    let total = null;\n    const renderedItems = items && items.map(this.renderItem);\n    // @ts-ignore // todo fix checking\n    const countItems = renderedItems?.filter((item) => item?.type?.__KONTUR_REACT_UI__ === 'MenuItem').length;\n\n    if (countItems && renderTotalCount && totalCount && countItems < totalCount) {\n      total = (\n        <MenuItem disabled key=\"total\" isMobile={isMobile}>\n          <div style={{ fontSize: 12 }}>{renderTotalCount(countItems, totalCount)}</div>\n        </MenuItem>\n      );\n    }\n\n    return (\n      <Menu data-tid={ComboBoxMenuDataTids.items} ref={refMenu} maxHeight={maxHeight} disableScrollContainer={isMobile}>\n        {renderedItems}\n        {total}\n        {renderAddButton && [<MenuSeparator key=\"separator\" />, renderAddButton]}\n      </Menu>\n    );\n  }\n\n  private renderItem = (item: T, index: number): React.ReactNode => {\n    // NOTE this is undesireable feature, better\n    // to remove it from further versions\n    const { renderItem, onValueChange } = this.props;\n    if (typeof item === 'function' || React.isValidElement(item)) {\n      // @ts-ignore\n      const element = typeof item === 'function' ? item() : item;\n      const props = Object.assign(\n        {\n          key: index,\n          onClick: () => onValueChange(element.props),\n        },\n        element.props,\n      );\n      return React.cloneElement(element, props);\n    }\n\n    return (\n      <MenuItem\n        data-tid={ComboBoxMenuDataTids.item}\n        onClick={() => onValueChange(item)}\n        key={index}\n        isMobile={this.props.isMobile}\n      >\n        {(state) => renderItem(item, state)}\n      </MenuItem>\n    );\n  };\n}\n"]}
+{"version":3,"sources":["ComboBoxMenu.tsx"],"names":["ComboBoxMenuDataTids","loading","failed","notFound","items","item","ComboBoxMenu","CustomComboBoxLocaleHelper","getProps","defaultProps","renderItem","index","props","onValueChange","itemWrapper","isSimpleItem","element","Object","assign","key","onClick","React","cloneElement","size","isMobile","state","render","theme","renderMain","opened","totalCount","refMenu","renderNotFound","renderTotalCount","maxMenuHeight","requestStatus","locale","errorNetworkButton","errorNetworkMessage","renderAddButton","maxHeight","length","menuId","ComboBoxRequestStatus","Failed","maxWidth","whiteSpace","repeatRequest","notFoundValue","total","renderedItems","map","menuItems","filter","countItems","Component","__KONTUR_REACT_UI__","undefined","Unknown","isValidElement"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { isFunction, isNullable } from '../../lib/utils';\nimport { locale } from '../../lib/locale/decorators';\nimport { Menu } from '../Menu';\nimport { isMenuItem, MenuItem, MenuItemState } from '../../components/MenuItem';\nimport { Spinner } from '../../components/Spinner';\nimport { Nullable } from '../../typings/utility-types';\nimport { MenuSeparator } from '../../components/MenuSeparator';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { MenuMessage } from '../MenuMessage';\nimport { ComboBoxExtendedItem } from '../../components/ComboBox';\nimport { Theme } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { MenuFooter } from '../../components/MenuFooter';\nimport { SizeProp } from '../../lib/types/props';\n\nimport { ComboBoxRequestStatus } from './CustomComboBoxTypes';\nimport { ComboBoxLocale, CustomComboBoxLocaleHelper } from './locale';\n\nexport interface ComboBoxMenuProps<T> {\n  opened?: boolean;\n  items?: Nullable<Array<ComboBoxExtendedItem<T>>>;\n  totalCount?: number;\n  loading?: boolean;\n  maxMenuHeight?: number | string;\n  refMenu?: (menu: Nullable<Menu>) => void;\n  renderNotFound?: () => React.ReactNode;\n  renderTotalCount?: (found: number, total: number) => React.ReactNode;\n  renderItem: (item: T, state: MenuItemState) => React.ReactNode;\n  itemWrapper?: (item: T) => React.ComponentType<unknown>;\n  onValueChange: (value: T) => any;\n  renderAddButton?: () => React.ReactNode;\n  caption?: React.ReactNode;\n  repeatRequest?: () => void;\n  requestStatus?: ComboBoxRequestStatus;\n  isMobile?: boolean;\n  menuId?: string;\n  size?: SizeProp;\n}\n\nexport const ComboBoxMenuDataTids = {\n  loading: 'ComboBoxMenu__loading',\n  failed: 'ComboBoxMenu__failed',\n  notFound: 'ComboBoxMenu__notFound',\n  items: 'ComboBoxMenu__items',\n  item: 'ComboBoxMenu__item',\n} as const;\n\ntype DefaultProps<T> = Required<Pick<ComboBoxMenuProps<T>, 'repeatRequest' | 'requestStatus'>>;\n\n@locale('ComboBox', CustomComboBoxLocaleHelper)\nexport class ComboBoxMenu<T> extends React.Component<ComboBoxMenuProps<T>> {\n  public static __KONTUR_REACT_UI__ = 'ComboBoxMenu';\n\n  public static defaultProps: DefaultProps<unknown> = {\n    repeatRequest: () => undefined,\n    requestStatus: ComboBoxRequestStatus.Unknown,\n  };\n\n  private getProps = createPropsGetter(ComboBoxMenu.defaultProps);\n\n  private readonly locale!: ComboBoxLocale;\n\n  private theme!: Theme;\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return <ThemeContext.Provider value={this.theme}>{this.renderMain()}</ThemeContext.Provider>;\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  public renderMain() {\n    const {\n      opened,\n      items,\n      totalCount,\n      loading,\n      refMenu,\n      renderNotFound = () => notFound,\n      renderTotalCount,\n      maxMenuHeight,\n      isMobile,\n    } = this.props;\n\n    const requestStatus = this.getProps().requestStatus;\n\n    const { notFound, errorNetworkButton, errorNetworkMessage } = this.locale;\n\n    if (!opened) {\n      return null;\n    }\n\n    let renderAddButton = null;\n    if (this.props.renderAddButton) {\n      renderAddButton = this.props.renderAddButton();\n    }\n\n    const maxHeight = isMobile ? 'auto' : maxMenuHeight;\n\n    if (loading && (!items || !items.length)) {\n      return (\n        <Menu\n          maxHeight={maxHeight}\n          ref={refMenu}\n          disableScrollContainer={isMobile}\n          id={this.props.menuId}\n          data-tid={ComboBoxMenuDataTids.loading}\n        >\n          <MenuMessage size={this.props.size} as=\"div\">\n            <Spinner type=\"mini\" dimmed />\n          </MenuMessage>\n        </Menu>\n      );\n    }\n\n    if (items === null && requestStatus === ComboBoxRequestStatus.Failed) {\n      return (\n        <Menu\n          ref={refMenu}\n          maxHeight={maxHeight}\n          disableScrollContainer={isMobile}\n          id={this.props.menuId}\n          data-tid={ComboBoxMenuDataTids.failed}\n        >\n          <MenuMessage size={this.props.size} key=\"message\">\n            <div style={{ maxWidth: 300, whiteSpace: 'normal' }}>{errorNetworkMessage}</div>\n          </MenuMessage>\n          <MenuItem link onClick={this.getProps().repeatRequest} size={this.props.size} key=\"retry\" isMobile={isMobile}>\n            {errorNetworkButton}\n          </MenuItem>\n        </Menu>\n      );\n    }\n\n    if ((isNullable(items) || items.length === 0) && renderNotFound) {\n      const notFoundValue = renderNotFound();\n      if (renderAddButton) {\n        return (\n          <Menu id={this.props.menuId} maxHeight={maxHeight} ref={refMenu} disableScrollContainer={isMobile}>\n            {renderAddButton}\n          </Menu>\n        );\n      }\n\n      if (notFoundValue) {\n        return (\n          <Menu id={this.props.menuId} maxHeight={maxHeight} ref={refMenu} disableScrollContainer={isMobile}>\n            <MenuMessage size={this.props.size} data-tid={ComboBoxMenuDataTids.notFound}>\n              {notFoundValue}\n            </MenuMessage>\n          </Menu>\n        );\n      }\n\n      return null;\n    }\n\n    let total = null;\n    const renderedItems = items && items.map(this.renderItem);\n    const menuItems = renderedItems?.filter((item) => {\n      return isMenuItem(item);\n    });\n    const countItems = menuItems?.length;\n    if (countItems && renderTotalCount && totalCount && countItems < totalCount) {\n      total = (\n        <MenuFooter size={this.props.size} key=\"total\">\n          <div>{renderTotalCount(countItems, totalCount)}</div>\n        </MenuFooter>\n      );\n    }\n\n    return (\n      <Menu\n        id={this.props.menuId}\n        data-tid={ComboBoxMenuDataTids.items}\n        ref={refMenu}\n        maxHeight={maxHeight}\n        disableScrollContainer={isMobile}\n      >\n        {renderedItems}\n        {total}\n        {renderAddButton && [<MenuSeparator key=\"separator\" />, renderAddButton]}\n      </Menu>\n    );\n  }\n\n  private renderItem = (item: ComboBoxExtendedItem<T>, index: number): React.ReactNode => {\n    // NOTE this is undesireable feature, better\n    // to remove it from further versions\n    const { renderItem, onValueChange, itemWrapper } = this.props;\n\n    if (!isSimpleItem<T>(item)) {\n      const element = isFunction(item) ? item() : item;\n      const props = Object.assign(\n        {\n          key: index,\n          onClick: () => onValueChange(element.props),\n        },\n        element.props,\n      );\n      return React.cloneElement(element, props);\n    }\n\n    return (\n      <MenuItem\n        component={itemWrapper?.(item)}\n        data-tid={ComboBoxMenuDataTids.item}\n        onClick={() => onValueChange(item)}\n        key={index}\n        size={this.props.size}\n        isMobile={this.props.isMobile}\n      >\n        {(state) => renderItem(item, state)}\n      </MenuItem>\n    );\n  };\n}\n\nfunction isSimpleItem<T>(item: ComboBoxExtendedItem<T>): item is T {\n  return !isFunction(item) && !React.isValidElement(item);\n}\n"]}

package/cjs/internal/CustomComboBox/ComboBoxView.d.ts

@@ -1,12 +1,15 @@
-import React from 'react';
+import React, { AriaAttributes } from 'react';
+import { DropdownContainerProps } from '../DropdownContainer';
 import { Input, InputIconType } from '../../components/Input';
 import { InputLikeText } from '../InputLikeText';
 import { Menu } from '../Menu';
 import { MenuItemState } from '../../components/MenuItem';
 import { Nullable } from '../../typings/utility-types';
-import { CommonProps } from '../../internal/CommonWrapper';
+import { CommonProps } from '../CommonWrapper';
+import { ComboBoxExtendedItem } from '../../components/ComboBox';
+import { SizeProp } from '../../lib/types/props';
 import { ComboBoxRequestStatus } from './CustomComboBoxTypes';
-interface ComboBoxViewProps<T> extends CommonProps {
+interface ComboBoxViewProps<T> extends Pick<DropdownContainerProps, 'menuPos'>, Pick<AriaAttributes, 'aria-describedby' | 'aria-label'>, CommonProps {
     align?: 'left' | 'center' | 'right';
     autoFocus?: boolean;
     borderless?: boolean;
@@ -17,13 +20,13 @@ interface ComboBoxViewProps<T> extends CommonProps {
      * Cостояние валидации при ошибке.
      */
     error?: boolean;
-    items?: Nullable<T[]>;
+    items?: Nullable<Array<ComboBoxExtendedItem<T>>>;
     loading?: boolean;
     menuAlign?: 'left' | 'right';
     opened?: boolean;
     drawArrow?: boolean;
     placeholder?: string;
-    size?: 'small' | 'medium' | 'large';
+    size?: SizeProp;
     textValue?: string;
     totalCount?: number;
     value?: Nullable<T>;
@@ -40,6 +43,7 @@ interface ComboBoxViewProps<T> extends CommonProps {
     onValueChange?: (value: T) => void;
     onClickOutside?: (e: Event) => void;
     onFocus?: () => void;
+    onMobileClose?: () => void;
     onFocusOutside?: () => void;
     onInputBlur?: () => void;
     onInputValueChange?: (value: string) => void;
@@ -50,49 +54,43 @@ interface ComboBoxViewProps<T> extends CommonProps {
     onMouseOver?: (e: React.MouseEvent) => void;
     onMouseLeave?: (e: React.MouseEvent) => void;
     renderItem?: (item: T, state: MenuItemState) => React.ReactNode;
+    itemWrapper?: (item: T) => React.ComponentType<unknown>;
     renderNotFound?: () => React.ReactNode;
     renderTotalCount?: (found: number, total: number) => React.ReactNode;
     renderValue?: (item: T) => React.ReactNode;
-    renderAddButton: (query?: string) => React.ReactNode;
+    renderAddButton?: (query?: string) => React.ReactNode;
     repeatRequest?: () => void;
     requestStatus?: ComboBoxRequestStatus;
     refInput?: (input: Nullable<Input>) => void;
     refMenu?: (menu: Nullable<Menu>) => void;
     refInputLikeText?: (inputLikeText: Nullable<InputLikeText>) => void;
 }
-interface ComboBoxViewState {
-    isMobileOpened: boolean;
-}
-export declare class ComboBoxView<T> extends React.Component<ComboBoxViewProps<T>, ComboBoxViewState> {
+declare type DefaultProps<T> = Required<Pick<ComboBoxViewProps<T>, 'renderItem' | 'renderValue' | 'renderAddButton' | 'repeatRequest' | 'requestStatus' | 'onClickOutside' | 'onFocusOutside' | 'size' | 'width'>>;
+export declare const ComboBoxViewIds: {
+    menu: string;
+};
+export declare class ComboBoxView<T> extends React.Component<ComboBoxViewProps<T>> {
     static __KONTUR_REACT_UI__: string;
-    static defaultProps: {
-        renderItem: (item: any) => any;
-        renderValue: (item: any) => any;
-        renderAddButton: () => null;
-        repeatRequest: () => undefined;
-        requestStatus: ComboBoxRequestStatus;
-        onClickOutside: () => void;
-        onFocusOutside: () => void;
-        size: string;
-        width: number;
-    };
+    static defaultProps: DefaultProps<unknown>;
+    private getProps;
     private input;
     private setRootNode;
     private mobileInput;
     private isMobileLayout;
     private dropdownContainerRef;
+    private theme;
+    private menuId;
     componentDidMount(): void;
-    state: ComboBoxViewState;
     componentDidUpdate(prevProps: ComboBoxViewProps<T>): void;
     render(): JSX.Element;
+    renderMain(): JSX.Element;
     private getComboBoxMenu;
     private renderMenu;
     private renderMobileMenu;
-    private handleCloseMobile;
     private getParent;
     private renderAddButton;
     private renderInput;
-    private handleFocusMobile;
+    private handleMobileFocus;
     private handleItemSelect;
     private refInput;
     private renderSpinner;

package/cjs/internal/CustomComboBox/ComboBoxView.js

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.ComboBoxView = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.ComboBoxViewIds = exports.ComboBoxView = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 
 var _utils = require("../../lib/utils");
 var _DropdownContainer = require("../DropdownContainer");
@@ -10,15 +10,42 @@ var _RenderLayer = require("../RenderLayer");
 var _Spinner = require("../../components/Spinner");
 
 var _px = require("../icons/16px");
-var _CommonWrapper = require("../../internal/CommonWrapper");
+var _CommonWrapper = require("../CommonWrapper");
 var _MobilePopup = require("../MobilePopup");
 var _decorator = require("../../components/ResponsiveLayout/decorator");
 var _rootNode = require("../../lib/rootNode");
+var _createPropsGetter = require("../../lib/createPropsGetter");
+var _ThemeHelpers = require("../../lib/theming/ThemeHelpers");
+var _ThemeContext = require("../../lib/theming/ThemeContext");
 
+var _LoadingIcon = require("../icons2022/LoadingIcon");
+
+
+
+var _ArrowDownIcon = require("./ArrowDownIcon");
 var _ComboBoxMenu = require("./ComboBoxMenu");
 var _CustomComboBoxTypes = require("./CustomComboBoxTypes");
 var _CustomComboBox = require("./CustomComboBox.styles");
-var _CustomComboBox2 = require("./CustomComboBox");var _class, _class2, _temp;var
+var _CustomComboBox2 = require("./CustomComboBox");
+var _getComboBoxTheme = require("./getComboBoxTheme");var _class, _class2, _temp;
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
 
 
 
@@ -78,6 +105,8 @@ var _CustomComboBox2 = require("./CustomComboBox");var _class, _class2, _temp;va
 
 
 
+var ComboBoxViewIds = {
+  menu: 'ComboBoxView__menu' };exports.ComboBoxViewIds = ComboBoxViewIds;var
 
 
 
@@ -101,12 +130,15 @@ ComboBoxView = (0, _decorator.responsiveLayout)(_class = (0, _rootNode.rootNode)
 
 
 
+    getProps = (0, _createPropsGetter.createPropsGetter)(ComboBoxView.defaultProps);_this.
+
 
 
     mobileInput = null;_this.
 
     dropdownContainerRef = /*#__PURE__*/_react.default.createRef();_this.
 
+    menuId = ComboBoxViewIds.menu + (0, _utils.getRandomID)();_this.
 
 
 
@@ -114,8 +146,6 @@ ComboBoxView = (0, _decorator.responsiveLayout)(_class = (0, _rootNode.rootNode)
 
 
 
-    state = {
-      isMobileOpened: false };_this.
 
 
 
@@ -153,8 +183,6 @@ ComboBoxView = (0, _decorator.responsiveLayout)(_class = (0, _rootNode.rootNode)
 
 
 
-    getComboBoxMenu = function () {
-      var _this$props =
 
 
 
@@ -166,10 +194,14 @@ ComboBoxView = (0, _decorator.responsiveLayout)(_class = (0, _rootNode.rootNode)
 
 
 
-      _this.props,items = _this$props.items,loading = _this$props.loading,opened = _this$props.opened,refMenu = _this$props.refMenu,maxMenuHeight = _this$props.maxMenuHeight,renderTotalCount = _this$props.renderTotalCount,renderItem = _this$props.renderItem,renderNotFound = _this$props.renderNotFound,repeatRequest = _this$props.repeatRequest,requestStatus = _this$props.requestStatus,totalCount = _this$props.totalCount;
+    getComboBoxMenu = function () {
+      var _this$props =
+      _this.props,items = _this$props.items,loading = _this$props.loading,opened = _this$props.opened,refMenu = _this$props.refMenu,maxMenuHeight = _this$props.maxMenuHeight,renderTotalCount = _this$props.renderTotalCount,renderNotFound = _this$props.renderNotFound,totalCount = _this$props.totalCount,size = _this$props.size;
 
+      var _this$getProps = _this.getProps(),repeatRequest = _this$getProps.repeatRequest,requestStatus = _this$getProps.requestStatus,renderItem = _this$getProps.renderItem,itemWrapper = _this$getProps.itemWrapper;
       return /*#__PURE__*/(
         _react.default.createElement(_ComboBoxMenu.ComboBoxMenu, {
+          menuId: _this.menuId,
           items: items,
           loading: loading,
           maxMenuHeight: maxMenuHeight,
@@ -179,24 +211,26 @@ ComboBoxView = (0, _decorator.responsiveLayout)(_class = (0, _rootNode.rootNode)
           renderTotalCount: renderTotalCount,
           renderItem: renderItem,
           renderNotFound: renderNotFound,
+          itemWrapper: itemWrapper,
           renderAddButton: _this.renderAddButton,
           repeatRequest: repeatRequest,
           requestStatus: requestStatus,
           totalCount: totalCount,
-          isMobile: _this.isMobileLayout }));
+          isMobile: _this.isMobileLayout,
+          size: size }));
 
 
     };_this.
 
     renderMenu = function () {
-      var _this$props2 = _this.props,menuAlign = _this$props2.menuAlign,opened = _this$props2.opened;
+      var _this$props2 = _this.props,menuAlign = _this$props2.menuAlign,opened = _this$props2.opened,menuPos = _this$props2.menuPos;
 
       return (
         opened && /*#__PURE__*/
         _react.default.createElement(_DropdownContainer.DropdownContainer, {
+          menuPos: menuPos,
           align: menuAlign,
           getParent: _this.getParent,
-          offsetY: 1,
           disablePortal: _this.props.disablePortal,
           ref: _this.dropdownContainerRef },
 
@@ -209,7 +243,7 @@ ComboBoxView = (0, _decorator.responsiveLayout)(_class = (0, _rootNode.rootNode)
     renderMobileMenu = function () {
       var rightIcon = null;
 
-      var _this$props3 = _this.props,loading = _this$props3.loading,items = _this$props3.items;
+      var _this$props3 = _this.props,loading = _this$props3.loading,items = _this$props3.items,opened = _this$props3.opened,onFocus = _this$props3.onFocus,onInputValueChange = _this$props3.onInputValueChange,placeholder = _this$props3.placeholder,textValue = _this$props3.textValue;
       if (loading && items && !!items.length) {
         rightIcon = _this.renderSpinner();
       }
@@ -217,33 +251,24 @@ ComboBoxView = (0, _decorator.responsiveLayout)(_class = (0, _rootNode.rootNode)
       var inputProps = {
         autoFocus: true,
         width: '100%',
-        onFocus: _this.props.onFocus,
-        onValueChange: _this.props.onInputValueChange,
-        value: _this.props.textValue,
-        placeholder: _this.props.placeholder,
+        onFocus: onFocus,
+        onValueChange: onInputValueChange,
+        value: textValue,
+        placeholder: placeholder,
         rightIcon: rightIcon };
 
 
-      return /*#__PURE__*/(
+      return (
+        opened && /*#__PURE__*/
         _react.default.createElement(_MobilePopup.MobilePopup, {
           headerChildComponent: /*#__PURE__*/_react.default.createElement(_Input.Input, (0, _extends2.default)({ ref: _this.refMobileInput }, inputProps)),
-          useFullHeight: true,
-          onCloseRequest: _this.handleCloseMobile,
-          opened: _this.state.isMobileOpened },
+          onCloseRequest: _this.props.onMobileClose,
+          opened: true },
 
         _this.getComboBoxMenu()));
 
 
-    };_this.
-
-    handleCloseMobile = function () {
-      _this.setState({
-        isMobileOpened: false });
-
 
-      if (_this.props.onInputBlur) {
-        _this.props.onInputBlur();
-      }
     };_this.
 
     getParent = function () {
@@ -251,7 +276,7 @@ ComboBoxView = (0, _decorator.responsiveLayout)(_class = (0, _rootNode.rootNode)
     };_this.
 
     renderAddButton = function () {
-      return _this.props.renderAddButton(_this.props.textValue);
+      return _this.getProps().renderAddButton(_this.props.textValue);
     };_this.
 
 
@@ -328,14 +353,18 @@ ComboBoxView = (0, _decorator.responsiveLayout)(_class = (0, _rootNode.rootNode)
 
 
 
-    handleFocusMobile = function () {
-      _this.setState({
-        isMobileOpened: true });
 
 
-      if (_this.mobileInput) {
-        _this.mobileInput.focus();
-      }
+
+
+
+
+
+
+    handleMobileFocus = function () {var _this$mobileInput;
+      _this.props.onInputClick == null ? void 0 : _this.props.onInputClick();
+
+      (_this$mobileInput = _this.mobileInput) == null ? void 0 : _this$mobileInput.focus();
     };_this.
 
     handleItemSelect = function (item) {
@@ -344,7 +373,7 @@ ComboBoxView = (0, _decorator.responsiveLayout)(_class = (0, _rootNode.rootNode)
       }
 
       if (_this.isMobileLayout) {
-        _this.handleCloseMobile();
+        _this.props.onMobileClose == null ? void 0 : _this.props.onMobileClose();
       }
     };_this.
 
@@ -362,13 +391,19 @@ ComboBoxView = (0, _decorator.responsiveLayout)(_class = (0, _rootNode.rootNode)
 
 
     getRightIcon = function () {
-      var _this$props4 = _this.props,loading = _this$props4.loading,items = _this$props4.items,drawArrow = _this$props4.drawArrow,rightIcon = _this$props4.rightIcon;
+      var _this$props4 = _this.props,loading = _this$props4.loading,items = _this$props4.items,drawArrow = _this$props4.drawArrow,rightIcon = _this$props4.rightIcon,size = _this$props4.size;
 
       if (loading && items && !!items.length) {
+        if ((0, _ThemeHelpers.isTheme2022)(_this.theme)) {
+          return /*#__PURE__*/_react.default.createElement(_LoadingIcon.LoadingIcon, { size: size });
+        }
         return _this.renderSpinner();
       }
 
       if (rightIcon || drawArrow) {
+        if ((0, _ThemeHelpers.isTheme2022)(_this.theme)) {
+          return rightIcon || /*#__PURE__*/_react.default.createElement(_ArrowDownIcon.ArrowDownIcon, { size: size });
+        }
         return /*#__PURE__*/_react.default.createElement("span", { className: _CustomComboBox.styles.rightIconWrapper() }, rightIcon != null ? rightIcon : /*#__PURE__*/_react.default.createElement(_px.ArrowChevronDownIcon, null));
       }
 
@@ -377,4 +412,4 @@ ComboBoxView = (0, _decorator.responsiveLayout)(_class = (0, _rootNode.rootNode)
 
     refMobileInput = function (input) {
       _this.mobileInput = input;
-    };return _this;}var _proto = ComboBoxView.prototype;_proto.componentDidMount = function componentDidMount() {var _this$dropdownContain;if (this.props.autoFocus && this.props.onFocus) {this.props.onFocus();}this.props.opened && ((_this$dropdownContain = this.dropdownContainerRef.current) == null ? void 0 : _this$dropdownContain.position());};_proto.componentDidUpdate = function componentDidUpdate(prevProps) {var input = this.input,props = this.props;if (props.editing && !prevProps.editing && input) {input.focus();}};_proto.render = function render() {var _this$props5 = this.props,onClickOutside = _this$props5.onClickOutside,onFocusOutside = _this$props5.onFocusOutside,onMouseEnter = _this$props5.onMouseEnter,onMouseLeave = _this$props5.onMouseLeave,onMouseOver = _this$props5.onMouseOver,opened = _this$props5.opened,width = _this$props5.width;var isMobile = this.isMobileLayout;var input = this.renderInput();return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, this.props, /*#__PURE__*/_react.default.createElement(_RenderLayer.RenderLayer, { onClickOutside: onClickOutside, onFocusOutside: onFocusOutside, active: opened }, /*#__PURE__*/_react.default.createElement("span", { "data-tid": _CustomComboBox2.CustomComboBoxDataTids.comboBoxView, style: { width: width }, className: _CustomComboBox.styles.root(), onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, onMouseOver: onMouseOver, ref: this.setRootNode }, input, isMobile ? this.renderMobileMenu() : this.renderMenu())));};_proto.renderInput = function renderInput() {var isMobile = this.isMobileLayout;var _this$props6 = this.props,align = _this$props6.align,borderless = _this$props6.borderless,disabled = _this$props6.disabled,editing = _this$props6.editing,error = _this$props6.error,onFocus = _this$props6.onFocus,onInputBlur = _this$props6.onInputBlur,onInputValueChange = _this$props6.onInputValueChange,onInputFocus = _this$props6.onInputFocus,onInputClick = _this$props6.onInputClick,onInputKeyDown = _this$props6.onInputKeyDown,placeholder = _this$props6.placeholder,renderValue = _this$props6.renderValue,size = _this$props6.size,textValue = _this$props6.textValue,value = _this$props6.value,warning = _this$props6.warning,refInputLikeText = _this$props6.refInputLikeText,leftIcon = _this$props6.leftIcon,inputMode = _this$props6.inputMode;var rightIcon = this.getRightIcon();if (editing) {return /*#__PURE__*/_react.default.createElement(_Input.Input, { align: align, borderless: borderless, disabled: disabled, error: error, maxLength: this.props.maxLength, onBlur: isMobile ? undefined : onInputBlur, onValueChange: onInputValueChange, onFocus: isMobile ? this.handleFocusMobile : onInputFocus, onClick: isMobile ? this.handleFocusMobile : onInputClick, leftIcon: leftIcon, rightIcon: rightIcon, value: textValue || '', onKeyDown: onInputKeyDown, placeholder: placeholder, width: "100%", size: size, ref: this.refInput, warning: warning, inputMode: inputMode });}return /*#__PURE__*/_react.default.createElement(_InputLikeText.InputLikeText, { align: align, borderless: borderless, error: error, onFocus: onFocus, leftIcon: leftIcon, rightIcon: rightIcon, disabled: disabled, warning: warning, placeholder: placeholder, size: size, width: "100%", ref: refInputLikeText }, (0, _utils.isNonNullable)(value) && renderValue ? renderValue(value) : null);};return ComboBoxView;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'ComboBoxView', _class2.defaultProps = { renderItem: function renderItem(item) {return item;}, renderValue: function renderValue(item) {return item;}, renderAddButton: function renderAddButton() {return null;}, repeatRequest: function repeatRequest() {return undefined;}, requestStatus: _CustomComboBoxTypes.ComboBoxRequestStatus.Unknown, onClickOutside: function onClickOutside() {/**/}, onFocusOutside: function onFocusOutside() {/**/}, size: 'small', width: 250 }, _temp)) || _class) || _class;exports.ComboBoxView = ComboBoxView;
+    };return _this;}var _proto = ComboBoxView.prototype;_proto.componentDidMount = function componentDidMount() {var _this$dropdownContain;if (this.props.autoFocus && this.props.onFocus) {this.props.onFocus();}this.props.opened && ((_this$dropdownContain = this.dropdownContainerRef.current) == null ? void 0 : _this$dropdownContain.position());};_proto.componentDidUpdate = function componentDidUpdate(prevProps) {var input = this.input,props = this.props;if (props.editing && !prevProps.editing && input) {input.focus();}};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = (0, _getComboBoxTheme.getComboBoxTheme)(theme);return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Provider, { value: _this2.theme }, _this2.renderMain());});};_proto.renderMain = function renderMain() {var _this$props5 = this.props,onMouseEnter = _this$props5.onMouseEnter,onMouseLeave = _this$props5.onMouseLeave,onMouseOver = _this$props5.onMouseOver,opened = _this$props5.opened;var _this$getProps2 = this.getProps(),onClickOutside = _this$getProps2.onClickOutside,onFocusOutside = _this$getProps2.onFocusOutside,width = _this$getProps2.width;var isMobile = this.isMobileLayout;var input = this.renderInput();return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, this.props, /*#__PURE__*/_react.default.createElement(_RenderLayer.RenderLayer, { onClickOutside: onClickOutside, onFocusOutside: onFocusOutside, active: opened }, /*#__PURE__*/_react.default.createElement("span", { "data-tid": _CustomComboBox2.CustomComboBoxDataTids.comboBoxView, style: { width: width }, className: _CustomComboBox.styles.root(), onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, onMouseOver: onMouseOver, ref: this.setRootNode }, input, isMobile ? this.renderMobileMenu() : this.renderMenu())));};_proto.renderInput = function renderInput() {var isMobile = this.isMobileLayout;var _this$props6 = this.props,align = _this$props6.align,borderless = _this$props6.borderless,disabled = _this$props6.disabled,editing = _this$props6.editing,error = _this$props6.error,onFocus = _this$props6.onFocus,onInputBlur = _this$props6.onInputBlur,onInputValueChange = _this$props6.onInputValueChange,onInputFocus = _this$props6.onInputFocus,onInputClick = _this$props6.onInputClick,onInputKeyDown = _this$props6.onInputKeyDown,placeholder = _this$props6.placeholder,textValue = _this$props6.textValue,value = _this$props6.value,warning = _this$props6.warning,refInputLikeText = _this$props6.refInputLikeText,leftIcon = _this$props6.leftIcon,inputMode = _this$props6.inputMode,size = _this$props6.size,ariaDescribedby = _this$props6['aria-describedby'],ariaLabel = _this$props6['aria-label'];var _this$getProps3 = this.getProps(),renderValue = _this$getProps3.renderValue;var rightIcon = this.getRightIcon();if (editing) {return /*#__PURE__*/_react.default.createElement(_Input.Input, { align: align, borderless: borderless, disabled: disabled, error: error, maxLength: this.props.maxLength, onBlur: isMobile ? undefined : onInputBlur, onValueChange: onInputValueChange, onFocus: onInputFocus, onClick: isMobile ? this.handleMobileFocus : onInputClick, leftIcon: leftIcon, rightIcon: rightIcon, value: textValue || '', onKeyDown: onInputKeyDown, placeholder: placeholder, width: "100%", size: size, ref: this.refInput, warning: warning, inputMode: inputMode, "aria-describedby": ariaDescribedby, "aria-controls": this.menuId, "aria-label": ariaLabel });}return /*#__PURE__*/_react.default.createElement(_InputLikeText.InputLikeText, { align: align, borderless: borderless, error: error, onFocus: onFocus, leftIcon: leftIcon, rightIcon: rightIcon, disabled: disabled, warning: warning, placeholder: placeholder, size: size, width: "100%", ref: refInputLikeText, "aria-describedby": ariaDescribedby, "aria-controls": this.menuId }, (0, _utils.isNonNullable)(value) && renderValue ? renderValue(value) : null);};return ComboBoxView;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'ComboBoxView', _class2.defaultProps = { renderItem: function renderItem(item) {return item;}, renderValue: function renderValue(item) {return item;}, renderAddButton: function renderAddButton() {return null;}, repeatRequest: function repeatRequest() {return undefined;}, requestStatus: _CustomComboBoxTypes.ComboBoxRequestStatus.Unknown, onClickOutside: function onClickOutside() {/**/}, onFocusOutside: function onFocusOutside() {/**/}, size: 'small', width: 250 }, _temp)) || _class) || _class;exports.ComboBoxView = ComboBoxView;