fix(Dropdown): fix multiple problems with minCharacters

Semantic-Org · Jun 24, 2017 · 642fe6a · 642fe6a
1 parent 0163591
commit 642fe6a
Showing 1 changed file with 30 additions and 8 deletions.
diff --git a/src/modules/Dropdown/Dropdown.js b/src/modules/Dropdown/Dropdown.js
@@ -524,7 +524,7 @@ export default class Dropdown extends Component {
     if (move === undefined) return
     e.preventDefault()
     this.moveSelectionBy(move)
-    if (!multiple) this.makeSelectedItemActive(e)
+    if (!multiple) this.makeSelectedItemActive(e, false)
   }
 
   openOnSpace = (e) => {
@@ -550,7 +550,7 @@ export default class Dropdown extends Component {
     this.open(e)
   }
 
-  makeSelectedItemActive = (e) => {
+  makeSelectedItemActive = (e, resetQuery = true) => {
     const { open } = this.state
     const { multiple, onAddItem } = this.props
     const item = this.getSelectedItem()
@@ -568,10 +568,10 @@ export default class Dropdown extends Component {
     if (multiple) {
       // state value may be undefined
       const newValue = _.union(this.state.value, [value])
-      this.setValue(newValue)
+      this.setValue(newValue, resetQuery)
       this.handleChange(e, newValue)
     } else {
-      this.setValue(value)
+      this.setValue(value, resetQuery)
       this.handleChange(e, value)
     }
   }
@@ -657,6 +657,15 @@ export default class Dropdown extends Component {
     if (this.searchRef) this.searchRef.focus()
   }
 
+  handleIconClick = e => {
+    debug('handleIconClick()', e)
+
+    _.invoke(this.props, 'onClick', e, this.props)
+    // prevent handleClick()
+    e.stopPropagation()
+    this.toggle(e)
+  }
+
   handleItemClick = (e, item) => {
     debug('handleItemClick()')
     debug(item)
@@ -852,12 +861,12 @@ export default class Dropdown extends Component {
   // Setters
   // ----------------------------------------
 
-  setValue = (value) => {
+  setValue = (value, resetQuery = true) => {
     debug('setValue()')
     debug('value', value)
-    const newState = {
+    const newState = resetQuery ? {
       searchQuery: '',
-    }
+    } : {}
 
     const { multiple, search } = this.props
     if (multiple && search && this.searchRef) this.searchRef.focus()
@@ -953,6 +962,17 @@ export default class Dropdown extends Component {
     this.scrollSelectedItemIntoView()
   }
 
+  // ----------------------------------------
+  // Overrides
+  // ----------------------------------------
+
+  handleIconOverrides = predefinedProps => ({
+    onClick: (e, props) => {
+      _.invoke(predefinedProps, 'onClick', e, props)
+      this.handleIconClick(e)
+    },
+  })
+
   // ----------------------------------------
   // Refs
   // ----------------------------------------
@@ -1264,7 +1284,9 @@ export default class Dropdown extends Component {
         {this.renderSearchInput()}
         {this.renderSearchSizer()}
         {trigger || this.renderText()}
-        {Icon.create(icon)}
+        {Icon.create(icon, {
+          overrideProps: this.handleIconOverrides,
+        })}
         {this.renderMenu()}
       </ElementType>
     )