fix(Dropdown): inserting char at a cursor position will the cursor to…

… end (#897)

* fix(Dropdown): inserting char at a cursor position will the cursor to end

* add changelog entry

CHANGELOG.md

@@ -27,6 +27,7 @@ This project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.htm
 - Update cached `rem` size value of `pxToRem` on theme static styles render @kuzhelov ([#883](https://github.com/stardust-ui/react/pull/883))
 - Stardust in TS project with `--isolatedModules` can be built @layershifter ([#894](https://github.com/stardust-ui/react/pull/894))
 - Keyframes are behaving as expected when RTL is dynamically switched @layershifter ([#894](https://github.com/stardust-ui/react/pull/894))
+- Fix inserting char at a cursor position will the cursor to end in `Dropdown` @layershifter ([#897](https://github.com/stardust-ui/react/pull/897))
 
 <!--------------------------------[ v0.21.0 ]------------------------------- -->
 ## [v0.21.0](https://github.com/stardust-ui/react/tree/v0.21.0) (2019-02-12)

packages/react/src/components/Dropdown/Dropdown.tsx

@@ -290,6 +290,7 @@ class Dropdown extends AutoControlledComponent<Extendable<DropdownProps>, Dropdo
       <ElementType className={classes.root} {...unhandledProps}>
         <Downshift
           onChange={this.handleSelectedChange}
+          onInputValueChange={this.handleSearchQueryChange}
           inputValue={search ? searchQuery : null}
           stateReducer={this.handleDownshiftStateChanges}
           itemToString={itemToString}
@@ -574,22 +575,21 @@ class Dropdown extends AutoControlledComponent<Extendable<DropdownProps>, Dropdo
     )
   }
 
+  private handleSearchQueryChange = (searchQuery: string) => {
+    this.trySetState({ searchQuery })
+    _.invoke(
+      this.props,
+      'onSearchQueryChange',
+      {}, // we don't have event for it, but want to keep the event handling interface, event is empty.
+      { ...this.props, searchQuery },
+    )
+  }
+
   private handleDownshiftStateChanges = (
     state: DownshiftState<ShorthandValue>,
     changes: StateChangeOptions<ShorthandValue>,
   ) => {
     switch (changes.type) {
-      case Downshift.stateChangeTypes.changeInput:
-        this.trySetState({
-          searchQuery: changes.inputValue,
-        })
-        _.invoke(
-          this.props,
-          'onSearchQueryChange',
-          {}, // we don't have event for it, but want to keep the event handling interface, event is empty.
-          { ...this.props, searchQuery: changes.inputValue },
-        )
-        return changes
       case Downshift.stateChangeTypes.blurButton:
         // Downshift closes the list by default on trigger blur. It does not support the case when dropdown is
         // single selection and focuses list on trigger click/up/down/space/enter. Treating that here.