[Issue 157] move onConfirm to be after state

Let the state be set with updated value then trigger `onConfirm`
alphagov · Jan 17, 2024 · d2e80b9 · d2e80b9
1 parent 24e5bce
commit d2e80b9
Show file tree

Hide file tree

Showing 7 changed files with 12 additions and 11 deletions.
diff --git a/dist/accessible-autocomplete.min.js b/dist/accessible-autocomplete.min.js
diff --git a/dist/accessible-autocomplete.min.js.map b/dist/accessible-autocomplete.min.js.map
diff --git a/dist/lib/accessible-autocomplete.preact.min.js b/dist/lib/accessible-autocomplete.preact.min.js
diff --git a/dist/lib/accessible-autocomplete.preact.min.js.map b/dist/lib/accessible-autocomplete.preact.min.js.map
diff --git a/dist/lib/accessible-autocomplete.react.min.js b/dist/lib/accessible-autocomplete.react.min.js
diff --git a/dist/lib/accessible-autocomplete.react.min.js.map b/dist/lib/accessible-autocomplete.react.min.js.map
diff --git a/src/autocomplete.js b/src/autocomplete.js
@@ -161,20 +161,22 @@ export default class Autocomplete extends Component {
 
   handleComponentBlur (newState) {
     const { options, query, selected } = this.state
-    let newQuery
+    let newQuery, setStateCallback
+
     if (this.props.confirmOnBlur) {
       newQuery = newState.query || query
-      this.props.onConfirm(options[selected])
+      setStateCallback = this.props.onConfirm(options[selected])
     } else {
       newQuery = query
+      setStateCallback = () => {}
     }
     this.setState({
       focused: null,
       menuOpen: newState.menuOpen || false,
       query: newQuery,
       selected: null,
       validChoiceMade: this.isQueryAnOption(newQuery, options)
-    })
+    }, setStateCallback)
   }
 
   handleListMouseLeave (event) {
@@ -280,15 +282,14 @@ export default class Autocomplete extends Component {
   handleOptionClick (event, index) {
     const selectedOption = this.state.options[index]
     const newQuery = this.templateInputValue(selectedOption)
-    this.props.onConfirm(selectedOption)
     this.setState({
       focused: -1,
       hovered: null,
       menuOpen: false,
       query: newQuery,
       selected: -1,
       validChoiceMade: true
-    })
+    }, this.props.onConfirm(selectedOption))
     this.forceUpdate()
   }