@skbkontur/react-ui 0.0.0-e55f22da73 → 0.0.0-ea6161656e

package/internal/CustomComboBox/ComboBoxView.d.ts

@@ -1,35 +1,49 @@
-import React from 'react';
-import { Input } from '../../components/Input';
+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 '../CommonWrapper';
+import { ComboBoxExtendedItem } from '../../components/ComboBox';
+import { SizeProp } from '../../lib/types/props';
 import { ComboBoxRequestStatus } from './CustomComboBoxTypes';
-interface ComboBoxViewProps<T> {
+interface ComboBoxViewProps<T> extends Pick<DropdownContainerProps, 'menuPos'>, Pick<AriaAttributes, 'aria-describedby' | 'aria-label'>, CommonProps {
     align?: 'left' | 'center' | 'right';
     autoFocus?: boolean;
     borderless?: boolean;
     disablePortal?: boolean;
     disabled?: boolean;
     editing?: boolean;
+    /**
+     * 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>;
+    /**
+     * Cостояние валидации при предупреждении.
+     */
     warning?: boolean;
     width?: string | number;
     maxLength?: number;
     maxMenuHeight?: number | string;
+    leftIcon?: InputIconType;
+    rightIcon?: InputIconType;
+    inputMode?: React.HTMLAttributes<HTMLInputElement>['inputMode'];
     onValueChange?: (value: T) => void;
     onClickOutside?: (e: Event) => void;
     onFocus?: () => void;
+    onMobileClose?: () => void;
     onFocusOutside?: () => void;
     onInputBlur?: () => void;
     onInputValueChange?: (value: string) => void;
@@ -40,38 +54,49 @@ interface ComboBoxViewProps<T> {
     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;
 }
+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: string | number;
-    };
+    static displayName: string;
+    static defaultProps: DefaultProps<unknown>;
+    private getProps;
     private input;
+    private setRootNode;
+    private mobileInput;
+    private isMobileLayout;
+    private dropdownContainerRef;
+    private theme;
+    private emotion;
+    private menuId;
     componentDidMount(): void;
     componentDidUpdate(prevProps: ComboBoxViewProps<T>): void;
     render(): JSX.Element;
+    renderMain(): JSX.Element;
+    private getComboBoxMenu;
+    private renderMenu;
+    private renderMobileMenu;
+    private getParent;
     private renderAddButton;
     private renderInput;
+    private handleMobileFocus;
     private handleItemSelect;
     private refInput;
     private renderSpinner;
     private getRightIcon;
+    private refMobileInput;
 }
 export {};

package/internal/CustomComboBox/CustomComboBox/CustomComboBox.js

@@ -1,10 +1,20 @@
-import _regeneratorRuntime from "@babel/runtime/regenerator";
+import _extends from "@babel/runtime/helpers/esm/extends";
 import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
 import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
 import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
+
+var _class, _class2, _temp;
+
+import _regeneratorRuntime from "@babel/runtime/regenerator";
 import React from 'react';
+import ReactDOM from 'react-dom';
+import { globalObject } from '@skbkontur/global-object';
 import { CancelationError, taskWithDelay } from "../../../lib/utils";
 import { fixClickFocusIE } from "../../../lib/events/fixClickFocusIE";
+import { CommonWrapper } from "../../CommonWrapper";
+import { responsiveLayout } from "../../../components/ResponsiveLayout/decorator";
+import { rootNode } from "../../../lib/rootNode";
+import { ReactUIFeatureFlagsContext, getFullReactUIFlagsContext } from "../../../lib/featureFlagsContext";
 import { ComboBoxRequestStatus } from "../CustomComboBoxTypes";
 import { reducer } from "../CustomComboBoxReducer";
 import { ComboBoxView } from "../ComboBoxView";
@@ -21,11 +31,13 @@ export var DefaultState = {
   repeatRequest: function repeatRequest() {
     return undefined;
   },
-  requestStatus: ComboBoxRequestStatus.Unknown
+  requestStatus: ComboBoxRequestStatus.Unknown,
+  size: 'small'
 };
-export var CustomComboBox =
-/*#__PURE__*/
-function (_React$PureComponent) {
+export var CustomComboBoxDataTids = {
+  comboBoxView: 'ComboBoxView__root'
+};
+export var CustomComboBox = responsiveLayout(_class = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$PureComponent) {
   _inheritsLoose(CustomComboBox, _React$PureComponent);
 
   function CustomComboBox() {
@@ -37,11 +49,7 @@ function (_React$PureComponent) {
 
     _this = _React$PureComponent.call.apply(_React$PureComponent, [this].concat(args)) || this;
     _this.state = DefaultState;
-    _this.input = void 0;
-    _this.menu = void 0;
-    _this.inputLikeText = void 0;
     _this.requestId = 0;
-    _this.loaderShowDelay = void 0;
     _this.focused = false;
     _this.cancelationToken = null;
     _this.reducer = reducer;
@@ -55,7 +63,11 @@ function (_React$PureComponent) {
         return;
       }
 
-      _this.handleFocus();
+      if (_this.input) {
+        _this.input.focus();
+      } else if (_this.inputLikeText) {
+        _this.inputLikeText.focus();
+      }
     };
 
     _this.selectInputText = function () {
@@ -76,21 +88,37 @@ function (_React$PureComponent) {
       _this.handleBlur();
     };
 
-    _this.dispatch = function (action) {
-      var effects;
-      var nextState;
+    _this.dispatch = function (action, sync) {
+      if (sync === void 0) {
+        sync = true;
+      }
 
-      _this.setState(function (state) {
-        var stateAndEffect = _this.reducer(state, _this.props, action);
+      var updateState = function updateState(action) {
+        var effects;
+        var nextState;
 
-        var _ref = stateAndEffect instanceof Array ? stateAndEffect : [stateAndEffect, []];
+        _this.setState(function (state) {
+          var stateAndEffect = _this.reducer(state, _this.props, action);
 
-        nextState = _ref[0];
-        effects = _ref[1];
-        return nextState;
-      }, function () {
-        effects.forEach(_this.handleEffect);
-      });
+          var _ref = stateAndEffect instanceof Array ? stateAndEffect : [stateAndEffect, []];
+
+          nextState = _ref[0];
+          effects = _ref[1];
+          return nextState;
+        }, function () {
+          effects.forEach(_this.handleEffect);
+        });
+      }; // Auto-batching React@18 creates problems that are fixed with flushSync
+      // https://github.com/skbkontur/retail-ui/pull/3144#issuecomment-1535235366
+
+
+      if (sync && React.version.search('18') === 0) {
+        ReactDOM.flushSync(function () {
+          return updateState(action);
+        });
+      } else {
+        updateState(action);
+      }
     };
 
     _this.handleEffect = function (effect) {
@@ -111,7 +139,7 @@ function (_React$PureComponent) {
       _this.dispatch({
         type: 'ValueChange',
         value: value,
-        keepFocus: true
+        keepFocus: !_this.isMobileLayout
       });
     };
 
@@ -127,6 +155,10 @@ function (_React$PureComponent) {
       });
     };
 
+    _this.handleMobileClose = function () {
+      _this.handleInputBlur();
+    };
+
     _this.handleClickOutside = function (e) {
       fixClickFocusIE(e);
 
@@ -142,18 +174,22 @@ function (_React$PureComponent) {
         return;
       }
 
-      _this.focused = false;
+      _this.focused = false; // workaround for the similar bug with focusout
+      // in Firefox, Chrome and IE
+      // https://bugzilla.mozilla.org/show_bug.cgi?id=1363964
 
-      _this.dispatch({
-        type: 'Blur'
-      });
+      globalObject.setTimeout(function () {
+        _this.dispatch({
+          type: 'Blur'
+        });
+      }, 0);
     };
 
     _this.handleInputBlur = function () {
       // If menu opened, RenderLayer is active and
       // it would call handleFocusOutside
       // In that way handleBlur would be called
-      if (_this.state.opened) {
+      if (_this.state.opened && !_this.isMobileLayout) {
         return;
       }
 
@@ -172,16 +208,12 @@ function (_React$PureComponent) {
   }
 
   var _proto = CustomComboBox.prototype;
-  /**
-   * @public
-   */
-
-  _proto.search =
-  /*#__PURE__*/
-  function () {
-    var _search = _asyncToGenerator(
-    /*#__PURE__*/
-    _regeneratorRuntime.mark(function _callee(query) {
+  /**
+  * @public
+  */
+
+  _proto.search = /*#__PURE__*/function () {
+    var _search = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(query) {
       var _this2 = this;
 
       var getItems, cancelPromise, expectingId, items;
@@ -197,7 +229,8 @@ function (_React$PureComponent) {
               cancelPromise = new Promise(function (_, reject) {
                 return _this2.cancelationToken = reject;
               });
-              expectingId = this.requestId += 1;
+              this.requestId += 1;
+              expectingId = this.requestId;
 
               if (!this.loaderShowDelay) {
                 this.loaderShowDelay = new Promise(function (resolve) {
@@ -206,7 +239,7 @@ function (_React$PureComponent) {
                       type: 'RequestItems'
                     });
 
-                    setTimeout(resolve, LOADER_SHOW_TIME);
+                    globalObject.setTimeout(resolve, LOADER_SHOW_TIME);
                   }, DELAY_BEFORE_SHOW_LOADER);
                   cancelPromise["catch"](function () {
                     return cancelLoader();
@@ -219,22 +252,22 @@ function (_React$PureComponent) {
                 });
               }
 
-              _context.prev = 5;
-              _context.next = 8;
+              _context.prev = 6;
+              _context.next = 9;
               return Promise.race([getItems(query), cancelPromise]);
 
-            case 8:
+            case 9:
               items = _context.sent;
 
               if (!this.state.loading) {
-                _context.next = 12;
+                _context.next = 13;
                 break;
               }
 
-              _context.next = 12;
+              _context.next = 13;
               return Promise.race([this.loaderShowDelay, cancelPromise]);
 
-            case 12:
+            case 13:
               if (expectingId === this.requestId) {
                 this.dispatch({
                   type: 'ReceiveItems',
@@ -242,12 +275,12 @@ function (_React$PureComponent) {
                 });
               }
 
-              _context.next = 18;
+              _context.next = 19;
               break;
 
-            case 15:
-              _context.prev = 15;
-              _context.t0 = _context["catch"](5);
+            case 16:
+              _context.prev = 16;
+              _context.t0 = _context["catch"](6);
 
               if (_context.t0 && _context.t0.code === 'CancelationError') {
                 this.dispatch({
@@ -266,8 +299,8 @@ function (_React$PureComponent) {
                 });
               }
 
-            case 18:
-              _context.prev = 18;
+            case 19:
+              _context.prev = 19;
 
               if (expectingId === this.requestId) {
                 if (!this.state.loading) {
@@ -278,14 +311,14 @@ function (_React$PureComponent) {
                 this.loaderShowDelay = null;
               }
 
-              return _context.finish(18);
+              return _context.finish(19);
 
-            case 21:
+            case 22:
             case "end":
               return _context.stop();
           }
         }
-      }, _callee, this, [[5, 15, 18, 21]]);
+      }, _callee, this, [[6, 16, 19, 22]]);
     }));
 
     function search(_x) {
@@ -294,9 +327,9 @@ function (_React$PureComponent) {
 
     return search;
   }()
-  /**
-   * @public
-   */
+  /**
+  * @public
+  */
   ;
 
   _proto.cancelSearch = function cancelSearch() {
@@ -304,9 +337,9 @@ function (_React$PureComponent) {
       this.cancelationToken(new CancelationError());
     }
   }
-  /**
-   * @public
-   */
+  /**
+  * @public
+  */
   ;
 
   _proto.open = function open() {
@@ -314,9 +347,9 @@ function (_React$PureComponent) {
       type: 'Open'
     });
   }
-  /**
-   * @public
-   */
+  /**
+  * @public
+  */
   ;
 
   _proto.close = function close() {
@@ -340,18 +373,25 @@ function (_React$PureComponent) {
       menuAlign: this.props.menuAlign,
       opened: this.state.opened,
       drawArrow: this.props.drawArrow,
+      menuPos: this.props.menuPos,
       placeholder: this.props.placeholder,
       size: this.props.size,
       textValue: this.state.textValue,
       totalCount: this.props.totalCount,
       value: this.props.value,
       warning: this.props.warning,
+      'aria-describedby': this.props['aria-describedby'],
+      'aria-label': this.props['aria-label'],
       width: this.props.width,
       maxLength: this.props.maxLength,
       maxMenuHeight: this.props.maxMenuHeight,
+      leftIcon: this.props.leftIcon,
+      rightIcon: this.props.rightIcon,
+      inputMode: this.props.inputMode,
       onValueChange: this.handleValueChange,
       onClickOutside: this.handleClickOutside,
       onFocus: this.handleFocus,
+      onMobileClose: this.handleMobileClose,
       onFocusOutside: this.handleBlur,
       onInputBlur: this.handleInputBlur,
       onInputValueChange: function onInputValueChange(value) {
@@ -375,6 +415,7 @@ function (_React$PureComponent) {
       onMouseLeave: this.props.onMouseLeave,
       renderItem: this.props.renderItem,
       renderNotFound: this.props.renderNotFound,
+      itemWrapper: this.props.itemWrapper,
       renderValue: this.props.renderValue,
       renderTotalCount: this.props.renderTotalCount,
       renderAddButton: this.props.renderAddButton,
@@ -390,13 +431,19 @@ function (_React$PureComponent) {
         _this3.inputLikeText = inputLikeText;
       }
     };
-    return React.createElement(ComboBoxView, viewProps);
+    return /*#__PURE__*/React.createElement(ReactUIFeatureFlagsContext.Consumer, null, function (flags) {
+      _this3.featureFlags = getFullReactUIFlagsContext(flags);
+      return /*#__PURE__*/React.createElement(CommonWrapper, _this3.props, /*#__PURE__*/React.createElement(ComboBoxView, _extends({}, viewProps, {
+        size: _this3.props.size,
+        ref: _this3.setRootNode
+      })));
+    });
   };
 
   _proto.componentDidMount = function componentDidMount() {
     this.dispatch({
       type: 'Mount'
-    });
+    }, false);
 
     if (this.props.autoFocus) {
       this.focus();
@@ -411,12 +458,13 @@ function (_React$PureComponent) {
     this.dispatch({
       type: 'DidUpdate',
       prevProps: prevProps,
-      prevState: prevState
-    });
+      prevState: prevState,
+      fixValueChange: this.featureFlags.comboBoxAllowValueChangeInEditingState
+    }, false);
   }
-  /**
-   * @public
-   */
+  /**
+  * @public
+  */
   ;
 
   _proto.reset = function reset() {
@@ -426,5 +474,4 @@ function (_React$PureComponent) {
   };
 
   return CustomComboBox;
-}(React.PureComponent);
-CustomComboBox.__KONTUR_REACT_UI__ = 'CustomComboBox';
+}(React.PureComponent), _class2.__KONTUR_REACT_UI__ = 'CustomComboBox', _class2.displayName = 'CustomComboBox', _temp)) || _class) || _class;

package/internal/CustomComboBox/CustomComboBox/CustomComboBox.js.map

@@ -1 +1 @@
-{"version":3,"sources":["CustomComboBox.tsx"],"names":["React","CancelationError","taskWithDelay","fixClickFocusIE","ComboBoxRequestStatus","reducer","ComboBoxView","DELAY_BEFORE_SHOW_LOADER","LOADER_SHOW_TIME","DefaultState","inputChanged","editing","items","loading","opened","focused","textValue","repeatRequest","undefined","requestStatus","Unknown","CustomComboBox","state","input","menu","inputLikeText","requestId","loaderShowDelay","cancelationToken","cancelLoaderDelay","focus","props","disabled","handleFocus","selectInputText","selectAll","blur","handleBlur","dispatch","action","effects","nextState","setState","stateAndEffect","Array","forEach","handleEffect","effect","getState","getProps","handleValueChange","value","type","keepFocus","handleClickOutside","e","close","handleInputBlur","handleInputClick","search","query","getItems","cancelPromise","Promise","_","reject","expectingId","resolve","cancelLoader","setTimeout","race","code","cancelSearch","open","render","viewProps","align","borderless","disablePortal","error","menuAlign","drawArrow","placeholder","size","totalCount","warning","width","maxLength","maxMenuHeight","onValueChange","onClickOutside","onFocus","onFocusOutside","onInputBlur","onInputValueChange","onInputFocus","onInputClick","onInputKeyDown","event","persist","onMouseEnter","onMouseOver","onMouseLeave","renderItem","renderNotFound","renderValue","renderTotalCount","renderAddButton","refInput","refMenu","refInputLikeText","componentDidMount","autoFocus","componentDidUpdate","prevProps","prevState","reset","PureComponent","__KONTUR_REACT_UI__"],"mappings":"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","sourcesContent":["import React from 'react';\r\n\r\nimport { Nullable } from '../../typings/utility-types';\r\nimport { Input } from '../../components/Input';\r\nimport { Menu } from '../Menu';\r\nimport { InputLikeText } from '../InputLikeText';\r\nimport { MenuItemState } from '../../components/MenuItem';\r\nimport { CancelationError, taskWithDelay } from '../../lib/utils';\r\nimport { fixClickFocusIE } from '../../lib/events/fixClickFocusIE';\r\n\r\nimport { ComboBoxRequestStatus } from './CustomComboBoxTypes';\r\nimport { CustomComboBoxAction, CustomComboBoxEffect, reducer } from './CustomComboBoxReducer';\r\nimport { ComboBoxView } from './ComboBoxView';\r\n\r\nexport interface CustomComboBoxProps<T> {\r\n  align?: 'left' | 'center' | 'right';\r\n  autoFocus?: boolean;\r\n  borderless?: boolean;\r\n  disablePortal?: boolean;\r\n  disabled?: boolean;\r\n  error?: boolean;\r\n  maxLength?: number;\r\n  menuAlign?: 'left' | 'right';\r\n  drawArrow?: boolean;\r\n  searchOnFocus?: boolean;\r\n  onValueChange?: (value: T) => void;\r\n  onInputValueChange?: (value: string) => Nullable<string> | void;\r\n  onUnexpectedInput?: (value: string) => void | null | T;\r\n  onFocus?: () => void;\r\n  onBlur?: () => void;\r\n  onMouseEnter?: (e: React.MouseEvent) => void;\r\n  onMouseOver?: (e: React.MouseEvent) => void;\r\n  onMouseLeave?: (e: React.MouseEvent) => void;\r\n  onInputKeyDown?: (e: React.KeyboardEvent<HTMLElement>) => void;\r\n  placeholder?: string;\r\n  size?: 'small' | 'medium' | 'large';\r\n  totalCount?: number;\r\n  value?: Nullable<T>;\r\n  warning?: boolean;\r\n  width?: string | number;\r\n  maxMenuHeight?: number | string;\r\n  renderNotFound?: () => React.ReactNode;\r\n  renderTotalCount?: (found: number, total: number) => React.ReactNode;\r\n  renderItem: (item: T, state?: MenuItemState) => React.ReactNode;\r\n  renderValue: (value: T) => React.ReactNode;\r\n  renderAddButton?: (query?: string) => React.ReactNode;\r\n  valueToString: (value: T) => string;\r\n  itemToValue: (item: T) => string | number;\r\n  getItems: (query: string) => Promise<T[]>;\r\n}\r\n\r\nexport interface CustomComboBoxState<T> {\r\n  editing: boolean;\r\n  loading: boolean;\r\n  opened: boolean;\r\n  textValue: string;\r\n  items: Nullable<T[]>;\r\n  inputChanged: boolean;\r\n  focused: boolean;\r\n  repeatRequest: () => void;\r\n  requestStatus: ComboBoxRequestStatus;\r\n}\r\n\r\nexport const DELAY_BEFORE_SHOW_LOADER = 300;\r\nexport const LOADER_SHOW_TIME = 1000;\r\n\r\nexport const DefaultState = {\r\n  inputChanged: false,\r\n  editing: false,\r\n  items: null,\r\n  loading: false,\r\n  opened: false,\r\n  focused: false,\r\n  textValue: '',\r\n  repeatRequest: () => undefined,\r\n  requestStatus: ComboBoxRequestStatus.Unknown,\r\n};\r\n\r\nexport class CustomComboBox<T> extends React.PureComponent<CustomComboBoxProps<T>, CustomComboBoxState<T>> {\r\n  public static __KONTUR_REACT_UI__ = 'CustomComboBox';\r\n\r\n  public state: CustomComboBoxState<T> = DefaultState;\r\n  public input: Nullable<Input>;\r\n  public menu: Nullable<Menu>;\r\n  public inputLikeText: Nullable<InputLikeText>;\r\n  public requestId = 0;\r\n  public loaderShowDelay: Nullable<Promise<never>>;\r\n  private focused = false;\r\n  private cancelationToken: Nullable<(reason?: Error) => void> = null;\r\n\r\n  private reducer = reducer;\r\n  public cancelLoaderDelay: () => void = () => null;\r\n\r\n  /**\r\n   * @public\r\n   */\r\n  public focus = () => {\r\n    if (this.props.disabled) {\r\n      return;\r\n    }\r\n\r\n    this.handleFocus();\r\n  };\r\n\r\n  /**\r\n   * @public\r\n   */\r\n  public selectInputText = () => {\r\n    if (this.props.disabled) {\r\n      return;\r\n    }\r\n    if (this.input) {\r\n      this.input.selectAll();\r\n    }\r\n  };\r\n\r\n  /**\r\n   * @public\r\n   */\r\n  public blur = () => {\r\n    if (this.props.disabled) {\r\n      return;\r\n    }\r\n\r\n    this.handleBlur();\r\n  };\r\n\r\n  /**\r\n   * @public\r\n   */\r\n  public async search(query: string = this.state.textValue) {\r\n    const { getItems } = this.props;\r\n\r\n    const cancelPromise: Promise<never> = new Promise((_, reject) => (this.cancelationToken = reject));\r\n    const expectingId = (this.requestId += 1);\r\n\r\n    if (!this.loaderShowDelay) {\r\n      this.loaderShowDelay = new Promise(resolve => {\r\n        const cancelLoader = taskWithDelay(() => {\r\n          this.dispatch({ type: 'RequestItems' });\r\n          setTimeout(resolve, LOADER_SHOW_TIME);\r\n        }, DELAY_BEFORE_SHOW_LOADER);\r\n\r\n        cancelPromise.catch(() => cancelLoader());\r\n\r\n        this.cancelLoaderDelay = () => {\r\n          cancelLoader();\r\n          resolve();\r\n        };\r\n      });\r\n    }\r\n\r\n    try {\r\n      const items = await Promise.race([getItems(query), cancelPromise]);\r\n      if (this.state.loading) {\r\n        await Promise.race([this.loaderShowDelay, cancelPromise]);\r\n      }\r\n      if (expectingId === this.requestId) {\r\n        this.dispatch({\r\n          type: 'ReceiveItems',\r\n          items,\r\n        });\r\n      }\r\n    } catch (error) {\r\n      if (error && error.code === 'CancelationError') {\r\n        this.dispatch({ type: 'CancelRequest' });\r\n      } else if (expectingId === this.requestId) {\r\n        this.dispatch({\r\n          type: 'RequestFailure',\r\n          repeatRequest: () => {\r\n            this.search(query);\r\n            if (this.input) {\r\n              this.input.focus();\r\n            }\r\n          },\r\n        });\r\n      }\r\n    } finally {\r\n      if (expectingId === this.requestId) {\r\n        if (!this.state.loading) {\r\n          this.cancelLoaderDelay();\r\n        }\r\n        this.cancelationToken = null;\r\n        this.loaderShowDelay = null;\r\n      }\r\n    }\r\n  }\r\n\r\n  /**\r\n   * @public\r\n   */\r\n  public cancelSearch() {\r\n    if (this.cancelationToken) {\r\n      this.cancelationToken(new CancelationError());\r\n    }\r\n  }\r\n\r\n  /**\r\n   * @public\r\n   */\r\n  public open() {\r\n    this.dispatch({ type: 'Open' });\r\n  }\r\n\r\n  /**\r\n   * @public\r\n   */\r\n  public close() {\r\n    this.dispatch({ type: 'Close' });\r\n  }\r\n\r\n  public render() {\r\n    const viewProps = {\r\n      align: this.props.align,\r\n      borderless: this.props.borderless,\r\n      disabled: this.props.disabled,\r\n      disablePortal: this.props.disablePortal,\r\n      editing: this.state.editing,\r\n      error: this.props.error,\r\n      items: this.state.items,\r\n      loading: this.state.loading,\r\n      menuAlign: this.props.menuAlign,\r\n      opened: this.state.opened,\r\n      drawArrow: this.props.drawArrow,\r\n      placeholder: this.props.placeholder,\r\n      size: this.props.size,\r\n      textValue: this.state.textValue,\r\n      totalCount: this.props.totalCount,\r\n      value: this.props.value,\r\n      warning: this.props.warning,\r\n      width: this.props.width,\r\n      maxLength: this.props.maxLength,\r\n      maxMenuHeight: this.props.maxMenuHeight,\r\n\r\n      onValueChange: this.handleValueChange,\r\n      onClickOutside: this.handleClickOutside,\r\n      onFocus: this.handleFocus,\r\n      onFocusOutside: this.handleBlur,\r\n      onInputBlur: this.handleInputBlur,\r\n      onInputValueChange: (value: string) => this.dispatch({ type: 'TextChange', value }),\r\n      onInputFocus: this.handleFocus,\r\n      onInputClick: this.handleInputClick,\r\n      onInputKeyDown: (event: React.KeyboardEvent) => {\r\n        event.persist();\r\n        this.dispatch({ type: 'KeyPress', event });\r\n      },\r\n      onMouseEnter: this.props.onMouseEnter,\r\n      onMouseOver: this.props.onMouseOver,\r\n      onMouseLeave: this.props.onMouseLeave,\r\n      renderItem: this.props.renderItem,\r\n      renderNotFound: this.props.renderNotFound,\r\n      renderValue: this.props.renderValue,\r\n      renderTotalCount: this.props.renderTotalCount,\r\n      renderAddButton: this.props.renderAddButton,\r\n      repeatRequest: this.state.repeatRequest,\r\n      requestStatus: this.state.requestStatus,\r\n\r\n      refInput: (input: Nullable<Input>) => {\r\n        this.input = input;\r\n      },\r\n      refMenu: (menu: Nullable<Menu>) => {\r\n        this.menu = menu;\r\n      },\r\n      refInputLikeText: (inputLikeText: Nullable<InputLikeText>) => {\r\n        this.inputLikeText = inputLikeText;\r\n      },\r\n    };\r\n\r\n    return <ComboBoxView {...viewProps} />;\r\n  }\r\n\r\n  public componentDidMount() {\r\n    this.dispatch({ type: 'Mount' });\r\n    if (this.props.autoFocus) {\r\n      this.focus();\r\n    }\r\n  }\r\n\r\n  public componentDidUpdate(prevProps: CustomComboBoxProps<T>, prevState: CustomComboBoxState<T>) {\r\n    if (prevState.editing && !this.state.editing) {\r\n      this.handleBlur();\r\n    }\r\n    this.dispatch({ type: 'DidUpdate', prevProps, prevState });\r\n  }\r\n\r\n  /**\r\n   * @public\r\n   */\r\n  public reset() {\r\n    this.dispatch({ type: 'Reset' });\r\n  }\r\n\r\n  private dispatch = (action: CustomComboBoxAction<T>) => {\r\n    let effects: Array<CustomComboBoxEffect<T>>;\r\n    let nextState: Pick<CustomComboBoxState<T>, never>;\r\n\r\n    this.setState(\r\n      state => {\r\n        const stateAndEffect = this.reducer(state, this.props, action);\r\n\r\n        [nextState, effects] = stateAndEffect instanceof Array ? stateAndEffect : [stateAndEffect, []];\r\n\r\n        return nextState;\r\n      },\r\n      () => {\r\n        effects.forEach(this.handleEffect);\r\n      },\r\n    );\r\n  };\r\n\r\n  private handleEffect = (effect: CustomComboBoxEffect<T>) => {\r\n    effect(this.dispatch, this.getState, this.getProps, () => this);\r\n  };\r\n\r\n  private getProps = () => this.props;\r\n\r\n  private getState = () => this.state;\r\n\r\n  private handleValueChange = (value: T) => {\r\n    this.dispatch({\r\n      type: 'ValueChange',\r\n      value,\r\n      keepFocus: true,\r\n    });\r\n  };\r\n\r\n  private handleFocus = () => {\r\n    if (this.focused) {\r\n      return;\r\n    }\r\n    this.focused = true;\r\n    this.dispatch({ type: 'Focus' });\r\n  };\r\n\r\n  private handleClickOutside = (e: Event) => {\r\n    fixClickFocusIE(e);\r\n    this.handleBlur();\r\n  };\r\n\r\n  private handleBlur = () => {\r\n    if (!this.focused) {\r\n      if (this.state.opened) {\r\n        this.close();\r\n      }\r\n      return;\r\n    }\r\n    this.focused = false;\r\n    this.dispatch({ type: 'Blur' });\r\n  };\r\n\r\n  private handleInputBlur = () => {\r\n    // If menu opened, RenderLayer is active and\r\n    // it would call handleFocusOutside\r\n    // In that way handleBlur would be called\r\n    if (this.state.opened) {\r\n      return;\r\n    }\r\n    this.handleBlur();\r\n  };\r\n\r\n  private handleInputClick = () => {\r\n    if (!this.cancelationToken) {\r\n      this.dispatch({ type: 'InputClick' });\r\n    }\r\n  };\r\n}\r\n"]}
+{"version":3,"sources":["CustomComboBox.tsx"],"names":["React","ReactDOM","globalObject","CancelationError","taskWithDelay","fixClickFocusIE","CommonWrapper","responsiveLayout","rootNode","ReactUIFeatureFlagsContext","getFullReactUIFlagsContext","ComboBoxRequestStatus","reducer","ComboBoxView","DELAY_BEFORE_SHOW_LOADER","LOADER_SHOW_TIME","DefaultState","inputChanged","editing","items","loading","opened","focused","textValue","repeatRequest","undefined","requestStatus","Unknown","size","CustomComboBoxDataTids","comboBoxView","CustomComboBox","state","requestId","cancelationToken","cancelLoaderDelay","focus","props","disabled","input","inputLikeText","selectInputText","selectAll","blur","handleBlur","dispatch","action","sync","updateState","effects","nextState","setState","stateAndEffect","Array","forEach","handleEffect","version","search","flushSync","effect","getState","getProps","handleValueChange","value","type","keepFocus","isMobileLayout","handleFocus","handleMobileClose","handleInputBlur","handleClickOutside","e","close","setTimeout","handleInputClick","query","getItems","cancelPromise","Promise","_","reject","expectingId","loaderShowDelay","resolve","cancelLoader","race","code","cancelSearch","open","render","viewProps","align","borderless","disablePortal","error","menuAlign","drawArrow","menuPos","placeholder","totalCount","warning","width","maxLength","maxMenuHeight","leftIcon","rightIcon","inputMode","onValueChange","onClickOutside","onFocus","onMobileClose","onFocusOutside","onInputBlur","onInputValueChange","onInputFocus","onInputClick","onInputKeyDown","event","persist","onMouseEnter","onMouseOver","onMouseLeave","renderItem","renderNotFound","itemWrapper","renderValue","renderTotalCount","renderAddButton","refInput","refMenu","menu","refInputLikeText","flags","featureFlags","setRootNode","componentDidMount","autoFocus","componentDidUpdate","prevProps","prevState","fixValueChange","comboBoxAllowValueChangeInEditingState","reset","PureComponent","__KONTUR_REACT_UI__","displayName"],"mappings":"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","sourcesContent":["import React, { AriaAttributes } from 'react';\nimport ReactDOM from 'react-dom';\nimport { globalObject } from '@skbkontur/global-object';\n\nimport { Nullable } from '../../typings/utility-types';\nimport { Input, InputIconType } from '../../components/Input';\nimport { Menu } from '../Menu';\nimport { InputLikeText } from '../InputLikeText';\nimport { MenuItemState } from '../../components/MenuItem';\nimport { CancelationError, taskWithDelay } from '../../lib/utils';\nimport { fixClickFocusIE } from '../../lib/events/fixClickFocusIE';\nimport { CommonProps, CommonWrapper } from '../CommonWrapper';\nimport { responsiveLayout } from '../../components/ResponsiveLayout/decorator';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { DropdownContainerProps } from '../DropdownContainer';\nimport { ComboBoxExtendedItem } from '../../components/ComboBox';\nimport { SizeProp } from '../../lib/types/props';\nimport {\n  ReactUIFeatureFlags,\n  ReactUIFeatureFlagsContext,\n  getFullReactUIFlagsContext,\n} from '../../lib/featureFlagsContext';\n\nimport { ComboBoxRequestStatus } from './CustomComboBoxTypes';\nimport { CustomComboBoxAction, CustomComboBoxEffect, reducer } from './CustomComboBoxReducer';\nimport { ComboBoxView } from './ComboBoxView';\n\nexport interface CustomComboBoxProps<T>\n  extends Pick<DropdownContainerProps, 'menuPos'>,\n    Pick<AriaAttributes, 'aria-describedby' | 'aria-label'>,\n    CommonProps {\n  align?: 'left' | 'center' | 'right';\n  autoFocus?: boolean;\n  borderless?: boolean;\n  disablePortal?: boolean;\n  disabled?: boolean;\n  /**\n   * Cостояние валидации при ошибке.\n   */\n  error?: boolean;\n  maxLength?: number;\n  menuAlign?: 'left' | 'right';\n  drawArrow?: boolean;\n  leftIcon?: InputIconType;\n  rightIcon?: InputIconType;\n  searchOnFocus?: boolean;\n  onValueChange?: (value: T) => void;\n  onInputValueChange?: (value: string) => Nullable<string> | void;\n  onUnexpectedInput?: (value: string) => void | null | T;\n  onFocus?: () => void;\n  onBlur?: () => void;\n  onMouseEnter?: (e: React.MouseEvent) => void;\n  onMouseOver?: (e: React.MouseEvent) => void;\n  onMouseLeave?: (e: React.MouseEvent) => void;\n  onInputKeyDown?: (e: React.KeyboardEvent<HTMLElement>) => void;\n  placeholder?: string;\n  size?: SizeProp;\n  totalCount?: number;\n  value?: Nullable<T>;\n  /**\n   * Cостояние валидации при предупреждении.\n   */\n  warning?: boolean;\n  width?: string | number;\n  maxMenuHeight?: number | string;\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  renderValue: (value: T) => React.ReactNode;\n  renderAddButton?: (query?: string) => React.ReactNode;\n  valueToString: (value: T) => string;\n  itemToValue: (item: T) => string | number;\n  getItems: (query: string) => Promise<Array<ComboBoxExtendedItem<T>>>;\n  inputMode?: React.HTMLAttributes<HTMLInputElement>['inputMode'];\n}\n\nexport interface CustomComboBoxState<T> {\n  editing: boolean;\n  loading: boolean;\n  opened: boolean;\n  textValue: string;\n  items: Nullable<Array<ComboBoxExtendedItem<T>>>;\n  inputChanged: boolean;\n  focused: boolean;\n  repeatRequest: () => void;\n  requestStatus: ComboBoxRequestStatus;\n}\n\nexport const DELAY_BEFORE_SHOW_LOADER = 300;\nexport const LOADER_SHOW_TIME = 1000;\n\nexport const DefaultState = {\n  inputChanged: false,\n  editing: false,\n  items: null,\n  loading: false,\n  opened: false,\n  focused: false,\n  textValue: '',\n  repeatRequest: () => undefined,\n  requestStatus: ComboBoxRequestStatus.Unknown,\n  size: 'small',\n};\n\nexport const CustomComboBoxDataTids = {\n  comboBoxView: 'ComboBoxView__root',\n} as const;\n\n@responsiveLayout\n@rootNode\nexport class CustomComboBox<T> extends React.PureComponent<CustomComboBoxProps<T>, CustomComboBoxState<T>> {\n  public static __KONTUR_REACT_UI__ = 'CustomComboBox';\n  public static displayName = 'CustomComboBox';\n\n  public state: CustomComboBoxState<T> = DefaultState;\n  public input: Nullable<Input>;\n  public menu: Nullable<Menu>;\n  public inputLikeText: Nullable<InputLikeText>;\n  public requestId = 0;\n  public loaderShowDelay: Nullable<Promise<void>>;\n  private focused = false;\n  private cancelationToken: Nullable<(reason?: Error) => void> = null;\n  private isMobileLayout!: boolean;\n  private featureFlags!: ReactUIFeatureFlags;\n\n  private reducer = reducer;\n  public cancelLoaderDelay: () => void = () => null;\n\n  /**\n   * @public\n   */\n  public focus = () => {\n    if (this.props.disabled) {\n      return;\n    }\n\n    if (this.input) {\n      this.input.focus();\n    } else if (this.inputLikeText) {\n      this.inputLikeText.focus();\n    }\n  };\n\n  /**\n   * @public\n   */\n  public selectInputText = () => {\n    if (this.props.disabled) {\n      return;\n    }\n    if (this.input) {\n      this.input.selectAll();\n    }\n  };\n\n  /**\n   * @public\n   */\n  public blur = () => {\n    if (this.props.disabled) {\n      return;\n    }\n\n    this.handleBlur();\n  };\n  private setRootNode!: TSetRootNode;\n\n  /**\n   * @public\n   */\n  public async search(query: string = this.state.textValue) {\n    const { getItems } = this.props;\n\n    const cancelPromise: Promise<never> = new Promise((_, reject) => (this.cancelationToken = reject));\n    this.requestId += 1;\n    const expectingId = this.requestId;\n\n    if (!this.loaderShowDelay) {\n      this.loaderShowDelay = new Promise<void>((resolve) => {\n        const cancelLoader = taskWithDelay(() => {\n          this.dispatch({ type: 'RequestItems' });\n          globalObject.setTimeout(resolve, LOADER_SHOW_TIME);\n        }, DELAY_BEFORE_SHOW_LOADER);\n\n        cancelPromise.catch(() => cancelLoader());\n\n        this.cancelLoaderDelay = () => {\n          cancelLoader();\n          resolve();\n        };\n      });\n    }\n\n    try {\n      const items = await Promise.race([getItems(query), cancelPromise]);\n      if (this.state.loading) {\n        await Promise.race([this.loaderShowDelay, cancelPromise]);\n      }\n      if (expectingId === this.requestId) {\n        this.dispatch({\n          type: 'ReceiveItems',\n          items,\n        });\n      }\n    } catch (error) {\n      if (error && error.code === 'CancelationError') {\n        this.dispatch({ type: 'CancelRequest' });\n      } else if (expectingId === this.requestId) {\n        this.dispatch({\n          type: 'RequestFailure',\n          repeatRequest: () => {\n            this.search(query);\n            if (this.input) {\n              this.input.focus();\n            }\n          },\n        });\n      }\n    } finally {\n      if (expectingId === this.requestId) {\n        if (!this.state.loading) {\n          this.cancelLoaderDelay();\n        }\n        this.cancelationToken = null;\n        this.loaderShowDelay = null;\n      }\n    }\n  }\n\n  /**\n   * @public\n   */\n  public cancelSearch() {\n    if (this.cancelationToken) {\n      this.cancelationToken(new CancelationError());\n    }\n  }\n\n  /**\n   * @public\n   */\n  public open() {\n    this.dispatch({ type: 'Open' });\n  }\n\n  /**\n   * @public\n   */\n  public close() {\n    this.dispatch({ type: 'Close' });\n  }\n\n  public render() {\n    const viewProps = {\n      align: this.props.align,\n      borderless: this.props.borderless,\n      disabled: this.props.disabled,\n      disablePortal: this.props.disablePortal,\n      editing: this.state.editing,\n      error: this.props.error,\n      items: this.state.items,\n      loading: this.state.loading,\n      menuAlign: this.props.menuAlign,\n      opened: this.state.opened,\n      drawArrow: this.props.drawArrow,\n      menuPos: this.props.menuPos,\n      placeholder: this.props.placeholder,\n      size: this.props.size,\n      textValue: this.state.textValue,\n      totalCount: this.props.totalCount,\n      value: this.props.value,\n      warning: this.props.warning,\n      'aria-describedby': this.props['aria-describedby'],\n      'aria-label': this.props['aria-label'],\n      width: this.props.width,\n      maxLength: this.props.maxLength,\n      maxMenuHeight: this.props.maxMenuHeight,\n      leftIcon: this.props.leftIcon,\n      rightIcon: this.props.rightIcon,\n      inputMode: this.props.inputMode,\n\n      onValueChange: this.handleValueChange,\n      onClickOutside: this.handleClickOutside,\n      onFocus: this.handleFocus,\n      onMobileClose: this.handleMobileClose,\n      onFocusOutside: this.handleBlur,\n      onInputBlur: this.handleInputBlur,\n      onInputValueChange: (value: string) => this.dispatch({ type: 'TextChange', value }),\n      onInputFocus: this.handleFocus,\n      onInputClick: this.handleInputClick,\n      onInputKeyDown: (event: React.KeyboardEvent) => {\n        event.persist();\n        this.dispatch({ type: 'KeyPress', event });\n      },\n      onMouseEnter: this.props.onMouseEnter,\n      onMouseOver: this.props.onMouseOver,\n      onMouseLeave: this.props.onMouseLeave,\n      renderItem: this.props.renderItem,\n      renderNotFound: this.props.renderNotFound,\n      itemWrapper: this.props.itemWrapper,\n      renderValue: this.props.renderValue,\n      renderTotalCount: this.props.renderTotalCount,\n      renderAddButton: this.props.renderAddButton,\n      repeatRequest: this.state.repeatRequest,\n      requestStatus: this.state.requestStatus,\n\n      refInput: (input: Nullable<Input>) => {\n        this.input = input;\n      },\n      refMenu: (menu: Nullable<Menu>) => {\n        this.menu = menu;\n      },\n      refInputLikeText: (inputLikeText: Nullable<InputLikeText>) => {\n        this.inputLikeText = inputLikeText;\n      },\n    };\n\n    return (\n      <ReactUIFeatureFlagsContext.Consumer>\n        {(flags) => {\n          this.featureFlags = getFullReactUIFlagsContext(flags);\n          return (\n            <CommonWrapper {...this.props}>\n              <ComboBoxView {...viewProps} size={this.props.size} ref={this.setRootNode} />\n            </CommonWrapper>\n          );\n        }}\n      </ReactUIFeatureFlagsContext.Consumer>\n    );\n  }\n\n  public componentDidMount() {\n    this.dispatch({ type: 'Mount' }, false);\n    if (this.props.autoFocus) {\n      this.focus();\n    }\n  }\n\n  public componentDidUpdate(prevProps: CustomComboBoxProps<T>, prevState: CustomComboBoxState<T>) {\n    if (prevState.editing && !this.state.editing) {\n      this.handleBlur();\n    }\n    this.dispatch(\n      {\n        type: 'DidUpdate',\n        prevProps,\n        prevState,\n        fixValueChange: this.featureFlags.comboBoxAllowValueChangeInEditingState,\n      },\n      false,\n    );\n  }\n\n  /**\n   * @public\n   */\n  public reset() {\n    this.dispatch({ type: 'Reset' });\n  }\n\n  private dispatch = (action: CustomComboBoxAction<T>, sync = true) => {\n    const updateState = (action: CustomComboBoxAction<T>) => {\n      let effects: Array<CustomComboBoxEffect<T>>;\n      let nextState: Pick<CustomComboBoxState<T>, never>;\n\n      this.setState(\n        (state) => {\n          const stateAndEffect = this.reducer(state, this.props, action);\n          [nextState, effects] = stateAndEffect instanceof Array ? stateAndEffect : [stateAndEffect, []];\n          return nextState;\n        },\n        () => {\n          effects.forEach(this.handleEffect);\n        },\n      );\n    };\n\n    // Auto-batching React@18 creates problems that are fixed with flushSync\n    // https://github.com/skbkontur/retail-ui/pull/3144#issuecomment-1535235366\n    if (sync && React.version.search('18') === 0) {\n      ReactDOM.flushSync(() => updateState(action));\n    } else {\n      updateState(action);\n    }\n  };\n\n  private handleEffect = (effect: CustomComboBoxEffect<T>) => {\n    effect(this.dispatch, this.getState, this.getProps, () => this);\n  };\n\n  private getProps = () => this.props;\n\n  private getState = () => this.state;\n\n  private handleValueChange = (value: T) => {\n    this.dispatch({\n      type: 'ValueChange',\n      value,\n      keepFocus: !this.isMobileLayout,\n    });\n  };\n\n  private handleFocus = () => {\n    if (this.focused) {\n      return;\n    }\n    this.focused = true;\n    this.dispatch({ type: 'Focus' });\n  };\n\n  private handleMobileClose = () => {\n    this.handleInputBlur();\n  };\n\n  private handleClickOutside = (e: Event) => {\n    fixClickFocusIE(e);\n    this.handleBlur();\n  };\n\n  private handleBlur = () => {\n    if (!this.focused) {\n      if (this.state.opened) {\n        this.close();\n      }\n      return;\n    }\n\n    this.focused = false;\n    // workaround for the similar bug with focusout\n    // in Firefox, Chrome and IE\n    // https://bugzilla.mozilla.org/show_bug.cgi?id=1363964\n    globalObject.setTimeout(() => {\n      this.dispatch({ type: 'Blur' });\n    }, 0);\n  };\n\n  private handleInputBlur = () => {\n    // If menu opened, RenderLayer is active and\n    // it would call handleFocusOutside\n    // In that way handleBlur would be called\n\n    if (this.state.opened && !this.isMobileLayout) {\n      return;\n    }\n    this.handleBlur();\n  };\n\n  private handleInputClick = () => {\n    if (!this.cancelationToken) {\n      this.dispatch({ type: 'InputClick' });\n    }\n  };\n}\n"]}