@skbkontur/react-ui 0.0.0-ecefada396 → 0.0.0-ee57da3e1e

package/internal/CustomComboBox/CustomComboBox/CustomComboBox.js

@@ -1,3 +1,4 @@
+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";
@@ -6,10 +7,12 @@ var _class, _class2, _temp;
 
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 import React from 'react';
+import ReactDOM from 'react-dom';
 import { CancelationError, taskWithDelay } from "../../../lib/utils";
 import { fixClickFocusIE } from "../../../lib/events/fixClickFocusIE";
 import { CommonWrapper } from "../../../internal/CommonWrapper";
-import { responsiveLayout } from "../../../components/ResponsiveLayout";
+import { responsiveLayout } from "../../../components/ResponsiveLayout/decorator";
+import { rootNode } from "../../../lib/rootNode";
 import { ComboBoxRequestStatus } from "../CustomComboBoxTypes";
 import { reducer } from "../CustomComboBoxReducer";
 import { ComboBoxView } from "../ComboBoxView";
@@ -28,7 +31,10 @@ export var DefaultState = {
   },
   requestStatus: ComboBoxRequestStatus.Unknown
 };
-export var CustomComboBox = responsiveLayout(_class = (_temp = _class2 = /*#__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() {
@@ -40,14 +46,9 @@ export var CustomComboBox = responsiveLayout(_class = (_temp = _class2 = /*#__PU
 
     _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.isMobileLayout = void 0;
     _this.reducer = reducer;
 
     _this.cancelLoaderDelay = function () {
@@ -84,7 +85,7 @@ export var CustomComboBox = responsiveLayout(_class = (_temp = _class2 = /*#__PU
       _this.handleBlur();
     };
 
-    _this.dispatch = function (action) {
+    _this.updateState = function (action) {
       var effects;
       var nextState;
 
@@ -101,6 +102,20 @@ export var CustomComboBox = responsiveLayout(_class = (_temp = _class2 = /*#__PU
       });
     };
 
+    _this.dispatch = function (action, sync) {
+      if (sync === void 0) {
+        sync = true;
+      }
+
+      if (sync) {
+        return ReactDOM.flushSync(function () {
+          _this.updateState(action);
+        });
+      }
+
+      return _this.updateState(action);
+    };
+
     _this.handleEffect = function (effect) {
       effect(_this.dispatch, _this.getState, _this.getProps, function () {
         return _assertThisInitialized(_this);
@@ -119,7 +134,7 @@ export var CustomComboBox = responsiveLayout(_class = (_temp = _class2 = /*#__PU
       _this.dispatch({
         type: 'ValueChange',
         value: value,
-        keepFocus: _this.isMobileLayout ? false : true
+        keepFocus: !_this.isMobileLayout
       });
     };
 
@@ -206,7 +221,8 @@ export var CustomComboBox = responsiveLayout(_class = (_temp = _class2 = /*#__PU
               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) {
@@ -228,22 +244,22 @@ export var CustomComboBox = responsiveLayout(_class = (_temp = _class2 = /*#__PU
                 });
               }
 
-              _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',
@@ -251,12 +267,12 @@ export var CustomComboBox = responsiveLayout(_class = (_temp = _class2 = /*#__PU
                 });
               }
 
-              _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({
@@ -275,8 +291,8 @@ export var CustomComboBox = responsiveLayout(_class = (_temp = _class2 = /*#__PU
                 });
               }
 
-            case 18:
-              _context.prev = 18;
+            case 19:
+              _context.prev = 19;
 
               if (expectingId === this.requestId) {
                 if (!this.state.loading) {
@@ -287,14 +303,14 @@ export var CustomComboBox = responsiveLayout(_class = (_temp = _class2 = /*#__PU
                 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) {
@@ -349,12 +365,14 @@ export var CustomComboBox = responsiveLayout(_class = (_temp = _class2 = /*#__PU
       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'],
       width: this.props.width,
       maxLength: this.props.maxLength,
       maxMenuHeight: this.props.maxMenuHeight,
@@ -387,6 +405,7 @@ export var CustomComboBox = responsiveLayout(_class = (_temp = _class2 = /*#__PU
       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,
@@ -402,13 +421,15 @@ export var CustomComboBox = responsiveLayout(_class = (_temp = _class2 = /*#__PU
         _this3.inputLikeText = inputLikeText;
       }
     };
-    return /*#__PURE__*/React.createElement(CommonWrapper, this.props, /*#__PURE__*/React.createElement(ComboBoxView, viewProps));
+    return /*#__PURE__*/React.createElement(CommonWrapper, this.props, /*#__PURE__*/React.createElement(ComboBoxView, _extends({}, viewProps, {
+      ref: this.setRootNode
+    })));
   };
 
   _proto.componentDidMount = function componentDidMount() {
     this.dispatch({
       type: 'Mount'
-    });
+    }, false);
 
     if (this.props.autoFocus) {
       this.focus();
@@ -424,7 +445,7 @@ export var CustomComboBox = responsiveLayout(_class = (_temp = _class2 = /*#__PU
       type: 'DidUpdate',
       prevProps: prevProps,
       prevState: prevState
-    });
+    }, false);
   }
   /**
   * @public
@@ -438,4 +459,4 @@ export var CustomComboBox = responsiveLayout(_class = (_temp = _class2 = /*#__PU
   };
 
   return CustomComboBox;
-}(React.PureComponent), _class2.__KONTUR_REACT_UI__ = 'CustomComboBox', _temp)) || _class;
+}(React.PureComponent), _class2.__KONTUR_REACT_UI__ = 'CustomComboBox', _temp)) || _class) || _class;

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

@@ -1 +1 @@
-{"version":3,"sources":["CustomComboBox.tsx"],"names":["React","CancelationError","taskWithDelay","fixClickFocusIE","CommonWrapper","responsiveLayout","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","isMobileLayout","cancelLoaderDelay","focus","props","disabled","selectInputText","selectAll","blur","handleBlur","dispatch","action","effects","nextState","setState","stateAndEffect","Array","forEach","handleEffect","effect","getState","getProps","handleValueChange","value","type","keepFocus","handleFocus","handleClickOutside","e","close","setTimeout","handleInputBlur","handleInputClick","search","query","getItems","cancelPromise","Promise","_","reject","expectingId","resolve","cancelLoader","race","code","cancelSearch","open","render","viewProps","align","borderless","disablePortal","error","menuAlign","drawArrow","placeholder","size","totalCount","warning","width","maxLength","maxMenuHeight","leftIcon","rightIcon","inputMode","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';\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 '../../internal/CommonWrapper';\nimport { responsiveLayout } from '../../components/ResponsiveLayout';\n\nimport { ComboBoxRequestStatus } from './CustomComboBoxTypes';\nimport { CustomComboBoxAction, CustomComboBoxEffect, reducer } from './CustomComboBoxReducer';\nimport { ComboBoxView } from './ComboBoxView';\n\nexport interface CustomComboBoxProps<T> extends 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?: 'small' | 'medium' | 'large';\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  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<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<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};\n\n@responsiveLayout\nexport class CustomComboBox<T> extends React.PureComponent<CustomComboBoxProps<T>, CustomComboBoxState<T>> {\n  public static __KONTUR_REACT_UI__ = '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\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\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    const expectingId = (this.requestId += 1);\n\n    if (!this.loaderShowDelay) {\n      this.loaderShowDelay = new Promise<void>((resolve) => {\n        const cancelLoader = taskWithDelay(() => {\n          this.dispatch({ type: 'RequestItems' });\n          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      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      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      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      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      <CommonWrapper {...this.props}>\n        <ComboBoxView {...viewProps} />\n      </CommonWrapper>\n    );\n  }\n\n  public componentDidMount() {\n    this.dispatch({ type: 'Mount' });\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({ type: 'DidUpdate', prevProps, prevState });\n  }\n\n  /**\n   * @public\n   */\n  public reset() {\n    this.dispatch({ type: 'Reset' });\n  }\n\n  private dispatch = (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\n        [nextState, effects] = stateAndEffect instanceof Array ? stateAndEffect : [stateAndEffect, []];\n\n        return nextState;\n      },\n      () => {\n        effects.forEach(this.handleEffect);\n      },\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 ? false : true,\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 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    setTimeout(() => {\n      this.dispatch({ type: 'Blur' });\n    });\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    // TODO: add check for mobile layout, to call `handleBlur`\n\n    if (this.state.opened) {\n      return;\n    }\n    this.handleBlur();\n  };\n\n  private handleInputClick = () => {\n    if (!this.cancelationToken) {\n      this.dispatch({ type: 'InputClick' });\n    }\n  };\n}\n"]}
+{"version":3,"sources":["CustomComboBox.tsx"],"names":["React","ReactDOM","CancelationError","taskWithDelay","fixClickFocusIE","CommonWrapper","responsiveLayout","rootNode","ComboBoxRequestStatus","reducer","ComboBoxView","DELAY_BEFORE_SHOW_LOADER","LOADER_SHOW_TIME","DefaultState","inputChanged","editing","items","loading","opened","focused","textValue","repeatRequest","undefined","requestStatus","Unknown","CustomComboBoxDataTids","comboBoxView","CustomComboBox","state","requestId","cancelationToken","cancelLoaderDelay","focus","props","disabled","input","inputLikeText","selectInputText","selectAll","blur","handleBlur","updateState","action","effects","nextState","setState","stateAndEffect","Array","forEach","handleEffect","dispatch","sync","flushSync","effect","getState","getProps","handleValueChange","value","type","keepFocus","isMobileLayout","handleFocus","handleClickOutside","e","close","setTimeout","handleInputBlur","handleInputClick","search","query","getItems","cancelPromise","Promise","_","reject","expectingId","loaderShowDelay","resolve","cancelLoader","race","code","cancelSearch","open","render","viewProps","align","borderless","disablePortal","error","menuAlign","drawArrow","menuPos","placeholder","size","totalCount","warning","width","maxLength","maxMenuHeight","leftIcon","rightIcon","inputMode","onValueChange","onClickOutside","onFocus","onFocusOutside","onInputBlur","onInputValueChange","onInputFocus","onInputClick","onInputKeyDown","event","persist","onMouseEnter","onMouseOver","onMouseLeave","renderItem","renderNotFound","itemWrapper","renderValue","renderTotalCount","renderAddButton","refInput","refMenu","menu","refInputLikeText","setRootNode","componentDidMount","autoFocus","componentDidUpdate","prevProps","prevState","reset","PureComponent","__KONTUR_REACT_UI__"],"mappings":"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","sourcesContent":["import React, { AriaAttributes } from 'react';\nimport ReactDOM from 'react-dom';\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 '../../internal/CommonWrapper';\nimport { responsiveLayout } from '../../components/ResponsiveLayout/decorator';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { DropdownContainerProps } from '../DropdownContainer';\n\nimport { ComboBoxRequestStatus } from './CustomComboBoxTypes';\nimport { CustomComboBoxAction, CustomComboBoxEffect, reducer } from './CustomComboBoxReducer';\nimport { ComboBoxView } from './ComboBoxView';\n\nexport interface CustomComboBoxProps<T> extends Pick<DropdownContainerProps, 'menuPos'>, 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?: 'small' | 'medium' | 'large';\n  totalCount?: number;\n  value?: Nullable<T>;\n  /**\n   * Cостояние валидации при предупреждении.\n   */\n  warning?: boolean;\n  'aria-describedby'?: AriaAttributes['aria-describedby'];\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<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<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};\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\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\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          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      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      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      <CommonWrapper {...this.props}>\n        <ComboBoxView {...viewProps} ref={this.setRootNode} />\n      </CommonWrapper>\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({ type: 'DidUpdate', prevProps, prevState }, false);\n  }\n\n  /**\n   * @public\n   */\n  public reset() {\n    this.dispatch({ type: 'Reset' });\n  }\n\n  private 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  private dispatch = (action: CustomComboBoxAction<T>, sync = true) => {\n    if (sync) {\n      return ReactDOM.flushSync(() => {\n        this.updateState(action);\n      });\n    }\n\n    return this.updateState(action);\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 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    setTimeout(() => {\n      this.dispatch({ type: 'Blur' });\n    });\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    // TODO: add check for mobile layout, to call `handleBlur`\n\n    if (this.state.opened) {\n      return;\n    }\n    this.handleBlur();\n  };\n\n  private handleInputClick = () => {\n    if (!this.cancelationToken) {\n      this.dispatch({ type: 'InputClick' });\n    }\n  };\n}\n"]}

package/internal/CustomComboBox/CustomComboBox.d.ts

@@ -1,12 +1,13 @@
-import React from 'react';
+import React, { AriaAttributes } from 'react';
 import { Nullable } from '../../typings/utility-types';
 import { Input, InputIconType } from '../../components/Input';
 import { Menu } from '../Menu';
 import { InputLikeText } from '../InputLikeText';
 import { MenuItemState } from '../../components/MenuItem';
 import { CommonProps } from '../../internal/CommonWrapper';
+import { DropdownContainerProps } from '../DropdownContainer';
 import { ComboBoxRequestStatus } from './CustomComboBoxTypes';
-export interface CustomComboBoxProps<T> extends CommonProps {
+export interface CustomComboBoxProps<T> extends Pick<DropdownContainerProps, 'menuPos'>, CommonProps {
     align?: 'left' | 'center' | 'right';
     autoFocus?: boolean;
     borderless?: boolean;
@@ -39,11 +40,13 @@ export interface CustomComboBoxProps<T> extends CommonProps {
      * Cостояние валидации при предупреждении.
      */
     warning?: boolean;
+    'aria-describedby'?: AriaAttributes['aria-describedby'];
     width?: string | number;
     maxMenuHeight?: number | string;
     renderNotFound?: () => React.ReactNode;
     renderTotalCount?: (found: number, total: number) => React.ReactNode;
     renderItem: (item: T, state?: MenuItemState) => React.ReactNode;
+    itemWrapper?: (item?: T) => React.ComponentType<unknown>;
     renderValue: (value: T) => React.ReactNode;
     renderAddButton?: (query?: string) => React.ReactNode;
     valueToString: (value: T) => string;
@@ -75,6 +78,9 @@ export declare const DefaultState: {
     repeatRequest: () => undefined;
     requestStatus: ComboBoxRequestStatus;
 };
+export declare const CustomComboBoxDataTids: {
+    readonly comboBoxView: "ComboBoxView__root";
+};
 export declare class CustomComboBox<T> extends React.PureComponent<CustomComboBoxProps<T>, CustomComboBoxState<T>> {
     static __KONTUR_REACT_UI__: string;
     state: CustomComboBoxState<T>;
@@ -100,6 +106,7 @@ export declare class CustomComboBox<T> extends React.PureComponent<CustomComboBo
      * @public
      */
     blur: () => void;
+    private setRootNode;
     /**
      * @public
      */
@@ -123,6 +130,7 @@ export declare class CustomComboBox<T> extends React.PureComponent<CustomComboBo
      * @public
      */
     reset(): void;
+    private updateState;
     private dispatch;
     private handleEffect;
     private getProps;

package/internal/CustomComboBox/CustomComboBoxReducer/CustomComboBoxReducer.js

@@ -13,20 +13,20 @@ var getValueString = function getValueString(value, valueToString) {
 };
 
 export var Effect = {
-  Search: function Search(query) {
+  search: function search(query) {
     return function (dispatch, getState, getProps, getInstance) {
       getInstance().search(query);
     };
   },
-  DebouncedSearch: debounce(function (dispatch, getState, getProps, getInstance) {
-    var searchEffect = Effect.Search(getState().textValue);
+  debouncedSearch: debounce(function (dispatch, getState, getProps, getInstance) {
+    var searchEffect = Effect.search(getState().textValue);
     searchEffect(dispatch, getState, getProps, getInstance);
   }, DEBOUNCE_DELAY),
-  CancelRequest: function CancelRequest(dispatch, getState, getProps, getInstance) {
-    Effect.DebouncedSearch.cancel();
+  cancelRequest: function cancelRequest(dispatch, getState, getProps, getInstance) {
+    Effect.debouncedSearch.cancel();
     getInstance().cancelSearch();
   },
-  Blur: function Blur(dispatch, getState, getProps) {
+  blur: function blur(dispatch, getState, getProps) {
     var _getProps = getProps(),
         onBlur = _getProps.onBlur;
 
@@ -34,7 +34,7 @@ export var Effect = {
       onBlur();
     }
   },
-  Focus: function Focus(dispatch, getState, getProps) {
+  focus: function focus(dispatch, getState, getProps) {
     var _getProps2 = getProps(),
         onFocus = _getProps2.onFocus;
 
@@ -42,7 +42,7 @@ export var Effect = {
       onFocus();
     }
   },
-  ValueChange: function ValueChange(value) {
+  valueChange: function valueChange(value) {
     return function (dispatch, getState, getProps) {
       var _getProps3 = getProps(),
           onValueChange = _getProps3.onValueChange;
@@ -52,7 +52,7 @@ export var Effect = {
       }
     };
   },
-  UnexpectedInput: function UnexpectedInput(textValue, items) {
+  unexpectedInput: function unexpectedInput(textValue, items) {
     return function (dispatch, getState, getProps) {
       var _getProps4 = getProps(),
           onUnexpectedInput = _getProps4.onUnexpectedInput,
@@ -85,7 +85,7 @@ export var Effect = {
       }
     };
   },
-  InputChange: function InputChange(dispatch, getState, getProps) {
+  inputChange: function inputChange(dispatch, getState, getProps) {
     var _getProps5 = getProps(),
         onInputValueChange = _getProps5.onInputValueChange;
 
@@ -103,7 +103,7 @@ export var Effect = {
       }
     }
   },
-  InputFocus: function InputFocus(dispatch, getState, getProps, getInstance) {
+  inputFocus: function inputFocus(dispatch, getState, getProps, getInstance) {
     var _getInstance = getInstance(),
         input = _getInstance.input;
 
@@ -113,7 +113,7 @@ export var Effect = {
 
     input.focus();
   },
-  HighlightMenuItem: function HighlightMenuItem(dispatch, getState, getProps, getInstance) {
+  highlightMenuItem: function highlightMenuItem(dispatch, getState, getProps, getInstance) {
     var _getProps6 = getProps(),
         value = _getProps6.value,
         itemToValue = _getProps6.itemToValue,
@@ -149,8 +149,7 @@ export var Effect = {
     menu.highlightItem(index);
 
     if (index >= 0) {
-      // FIXME: accessing private props
-      // @ts-ignore
+      // @ts-expect-error: Use of private property.
       requestAnimationFrame(function () {
         return menu && menu.scrollToSelected();
       });
@@ -163,7 +162,7 @@ export var Effect = {
       });
     }
   },
-  SelectMenuItem: function SelectMenuItem(event) {
+  selectMenuItem: function selectMenuItem(event) {
     return function (dispatch, getState, getProps, getInstance) {
       var _getInstance3 = getInstance(),
           menu = _getInstance3.menu;
@@ -173,7 +172,7 @@ export var Effect = {
       }
     };
   },
-  MoveMenuHighlight: function MoveMenuHighlight(direction) {
+  moveMenuHighlight: function moveMenuHighlight(direction) {
     return function (dispatch, getState, getProps, getInstance) {
       var _getInstance4 = getInstance(),
           menu = _getInstance4.menu;
@@ -183,22 +182,22 @@ export var Effect = {
       }
     };
   },
-  ResetHighlightedMenuItem: function ResetHighlightedMenuItem(dispatch, getState, getProps, getInstance) {
+  resetHighlightedMenuItem: function resetHighlightedMenuItem(dispatch, getState, getProps, getInstance) {
     var combobox = getInstance();
 
     if (combobox.menu && combobox.menu.hasHighlightedItem()) {
       combobox.menu.reset();
     }
   },
-  Reflow: function Reflow() {
+  reflow: function reflow() {
     LayoutEvents.emit();
   },
-  SelectInputText: function SelectInputText(dispatch, getState, getProps, getInstance) {
+  selectInputText: function selectInputText(dispatch, getState, getProps, getInstance) {
     var combobox = getInstance();
     combobox.selectInputText();
   },
-  InputKeyDown: function InputKeyDown(event) {
-    return function (dispatch, getState, getProps, getInstance) {
+  inputKeyDown: function inputKeyDown(event) {
+    return function (dispatch, getState, getProps) {
       var _getProps7 = getProps(),
           onInputKeyDown = _getProps7.onInputKeyDown;
 
@@ -209,7 +208,7 @@ export var Effect = {
   }
 };
 
-var never = function never(_) {
+var never = function never() {
   return null;
 };
 
@@ -229,7 +228,7 @@ export function reducer(state, props, action) {
             editing: true,
             items: null,
             textValue: _textValue
-          }, [Effect.ValueChange(_value2), Effect.CancelRequest, Effect.InputFocus]];
+          }, [Effect.valueChange(_value2), Effect.cancelRequest, Effect.inputFocus]];
         }
 
         return [{
@@ -238,7 +237,7 @@ export function reducer(state, props, action) {
           editing: false,
           items: null,
           textValue: _textValue
-        }, [Effect.ValueChange(_value2), Effect.CancelRequest]];
+        }, [Effect.valueChange(_value2), Effect.cancelRequest]];
       }
 
     case 'TextChange':
@@ -252,10 +251,10 @@ export function reducer(state, props, action) {
           return [_extends({}, newState, {
             opened: false,
             items: null
-          }), [Effect.InputChange]];
+          }), [Effect.inputChange]];
         }
 
-        return [newState, [Effect.DebouncedSearch, Effect.InputChange]];
+        return [newState, [Effect.debouncedSearch, Effect.inputChange]];
       }
 
     case 'KeyPress':
@@ -267,15 +266,15 @@ export function reducer(state, props, action) {
         switch (true) {
           case isKeyEnter(e):
             e.preventDefault();
-            effects.push(Effect.SelectMenuItem(e));
+            effects.push(Effect.selectMenuItem(e));
             break;
 
           case isKeyArrowVertical(e):
             e.preventDefault();
-            effects.push(Effect.MoveMenuHighlight(isKeyArrowUp(e) ? 'up' : 'down'));
+            effects.push(Effect.moveMenuHighlight(isKeyArrowUp(e) ? 'up' : 'down'));
 
             if (!state.opened) {
-              effects.push(Effect.Search(state.textValue));
+              effects.push(Effect.search(state.textValue));
             }
 
             break;
@@ -288,7 +287,7 @@ export function reducer(state, props, action) {
             break;
         }
 
-        return [nextState, [].concat(effects, [Effect.InputKeyDown(e)])];
+        return [nextState, [].concat(effects, [Effect.inputKeyDown(e)])];
       }
 
     case 'DidUpdate':
@@ -318,20 +317,24 @@ export function reducer(state, props, action) {
         };
 
         if (!props.searchOnFocus) {
-          return [_newState, [Effect.Focus]];
+          return [_newState, [Effect.focus]];
         }
 
         if (state.editing) {
-          return [_newState, [Effect.Search(state.textValue), Effect.Focus]];
+          return [_newState, [Effect.search(state.textValue), Effect.focus]];
         }
 
-        return [_newState, [Effect.Search(''), Effect.Focus, Effect.SelectInputText]];
+        return [_newState, [Effect.search(''), Effect.focus, Effect.selectInputText]];
       }
 
     case 'InputClick':
       {
+        var _newState2 = {
+          inputChanged: false
+        };
+
         if (!state.opened && props.searchOnFocus) {
-          return [state, [Effect.Search('')]];
+          return [_newState2, [Effect.search('')]];
         }
 
         return state;
@@ -348,14 +351,14 @@ export function reducer(state, props, action) {
             opened: false,
             items: null,
             editing: false
-          }, [Effect.Blur, Effect.CancelRequest]];
+          }, [Effect.blur, Effect.cancelRequest]];
         }
 
         return [{
           focused: false,
           opened: false,
           items: null
-        }, [Effect.Blur, Effect.CancelRequest, Effect.UnexpectedInput(state.textValue, _items)]];
+        }, [Effect.blur, Effect.cancelRequest, Effect.unexpectedInput(state.textValue, _items)]];
       }
 
     case 'Reset':
@@ -380,7 +383,7 @@ export function reducer(state, props, action) {
 
     case 'Search':
       {
-        return [state, [Effect.Search(action.query)]];
+        return [state, [Effect.search(action.query)]];
       }
 
     case 'RequestItems':
@@ -400,7 +403,7 @@ export function reducer(state, props, action) {
           opened: true,
           items: action.items,
           requestStatus: ComboBoxRequestStatus.Success
-        }, [shouldResetMenuHighlight ? Effect.ResetHighlightedMenuItem : Effect.HighlightMenuItem, Effect.Reflow]];
+        }, [shouldResetMenuHighlight ? Effect.resetHighlightedMenuItem : Effect.highlightMenuItem, Effect.reflow]];
       }
 
     case 'RequestFailure':
@@ -411,7 +414,7 @@ export function reducer(state, props, action) {
           items: null,
           requestStatus: ComboBoxRequestStatus.Failed,
           repeatRequest: action.repeatRequest
-        }, [Effect.HighlightMenuItem]];
+        }, [Effect.highlightMenuItem]];
       }
 
     case 'CancelRequest':
@@ -424,7 +427,7 @@ export function reducer(state, props, action) {
 
     default:
       {
-        never(action);
+        never();
       }
   }