Emit blur when underlying input blurs, unless the focus changed to a list item.

docs/guide/reference.md

@@ -33,6 +33,7 @@ Name | Description
 hit | Triggered when an autocomplete item is selected. The entry in the input data array that was selected is returned. If no autocomplete item is selected, the first entry matching the query is selected and returned.
 input | The component can be used with `v-model`
 keyup | Triggered when any keyup event is fired in the input. Often used for catching `keyup.enter`.
+blur | Triggered when the input field loses focus, except when pressing the `tab` key to focus the dropdown list.
 
 ## Slots
 

src/components/VueTypeaheadBootstrap.vue

@@ -240,19 +240,20 @@ export default {
       this.isFocused = false
     },
 
-    runFocusOut(tgt) {
+    runFocusOut(evt) {
+      const tgt = evt.relatedTarget
       if (tgt && tgt.classList.contains('vbst-item')) {
         return
       }
+      this.$emit('blur', evt)
       this.isFocused = false
     },
 
     handleFocusOut(evt) {
-      const tgt = evt.relatedTarget
       if (!!navigator.userAgent.match(/Trident.*rv:11\./) && this.ieCloseFix) {
-        setTimeout(() => { this.runFocusOut(tgt) }, 300)
+        setTimeout(() => { this.runFocusOut(evt) }, 300)
       } else {
-        this.runFocusOut(tgt)
+        this.runFocusOut(evt)
       }
     },
 

tests/unit/VueTypeaheadBootstrap.spec.js

@@ -172,5 +172,22 @@ describe('VueTypeaheadBootstrap', () => {
 
       expect(selectPreviousListItem).toHaveBeenCalledWith()
     })
+
+    it('Emits a blur event when the underlying input field blurs', async () => {
+      let input = wrapper.find('input')
+      await input.trigger('blur')
+      expect(wrapper.emitted().blur).toBeTruthy()
+    })
+
+    it('Does not emit a blur event if the focus shifted to the dropdown list', async () => {
+      let input = wrapper.find('input')
+      wrapper.setData({ inputValue: 'Can' })
+      await input.trigger('focus')
+
+      let listItem = wrapper.get('.vbst-item').element
+      await input.trigger('blur', {relatedTarget: listItem})
+
+      expect(wrapper.emitted().blur).toBeFalsy()
+    })
   })
 })