From 0806b7d3aaff9a0e95969fe83eaa26fce7129ea5 Mon Sep 17 00:00:00 2001
From: Tim Berkeley <tim.berkeley@thebookpeople.co.uk>
Date: Wed, 30 Aug 2017 15:11:51 +0100
Subject: [PATCH 1/2] Resolves #23 - setting the text with v-model searches
 with the new value

---
 README.md                              |  2 ++
 src/js/components/vue-autocomplete.vue | 40 +++++++++++++++++++-------
 2 files changed, 31 insertions(+), 11 deletions(-)

diff --git a/README.md b/README.md
index 6e582e0..9b141bc 100644
--- a/README.md
+++ b/README.md
@@ -64,6 +64,8 @@ var Autocomplete = require('vue2-autocomplete-js');
 
 </template>
 
+You can optionally use v-model to access and update the text entry field. If You
+update the model the component will automatically search for the string entered. 
 
 <script>
 
diff --git a/src/js/components/vue-autocomplete.vue b/src/js/components/vue-autocomplete.vue
index c338ded..8e3b449 100644
--- a/src/js/components/vue-autocomplete.vue
+++ b/src/js/components/vue-autocomplete.vue
@@ -28,6 +28,7 @@
         >
           <a
             href="#"
+            @mousedown.prevent="mousedownList()"
             @click.prevent="selectList(data)"
             @mousemove="mousemove(i)"
           >
@@ -55,9 +56,25 @@
   *
   */
 
+  const processInput = function (value) {
+    this.showList = true;
+    // Callback Event
+    if(this.onInput) this.onInput(value)
+    // If Debounce
+    if (this.debounce) {
+      if (this.debounceTask !== undefined) clearTimeout(this.debounceTask)
+      this.debounceTask = setTimeout(() => {
+        return this.getData(value)
+      }, this.debounce)
+    } else {
+      return this.getData(value)
+    }
+  }
+
   export default {
 
     props: {
+      value: String,
       id: String,
       name: String,
       className: String,
@@ -159,6 +176,9 @@
     },
 
     watch: {
+      value(value) {
+        return processInput.bind(this)(value)
+      },
       options(newVal, oldVal) {
         if (this.filterByAnchor) {
           const { type, anchor } = this
@@ -201,17 +221,10 @@
       =============================*/
       handleInput(e){
         const { value } = e.target
-        this.showList = true;
-        // Callback Event
-        if(this.onInput) this.onInput(value)
-        // If Debounce
-        if (this.debounce) {
-          if (this.debounceTask !== undefined) clearTimeout(this.debounceTask)
-          this.debounceTask = setTimeout(() => {
-            return this.getData(value)
-          }, this.debounce)
+        if (this.value !== undefined) {
+          this.$emit('input', value)
         } else {
-          return this.getData(value)
+          return proceessInput.bind(this)(value)
         }
       },
 
@@ -242,7 +255,6 @@
           case ENTER:
             e.preventDefault()
             this.selectList(this.json[this.focusList])
-            this.showList = false;
           break;
           case ESC:
             this.showList = false;
@@ -279,6 +291,12 @@
         this.showList = true;
       },
 
+
+      // Simply here to prevent default on mouse down so that input field does
+      // not blur
+      mousedownList(e){
+      },
+
       handleBlur(e){
         // Callback Event
         this.onBlur ? this.onBlur(e) : null

From 56547ac2e7788709ce798769d447ba6a0944fbef Mon Sep 17 00:00:00 2001
From: Tim Berkeley <tim.berkeley@thebookpeople.co.uk>
Date: Wed, 30 Aug 2017 15:40:07 +0100
Subject: [PATCH 2/2] Ooops - Fixed merge typo

---
 src/js/components/vue-autocomplete.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/js/components/vue-autocomplete.vue b/src/js/components/vue-autocomplete.vue
index 8e3b449..2400297 100644
--- a/src/js/components/vue-autocomplete.vue
+++ b/src/js/components/vue-autocomplete.vue
@@ -224,7 +224,7 @@
         if (this.value !== undefined) {
           this.$emit('input', value)
         } else {
-          return proceessInput.bind(this)(value)
+          return processInput.bind(this)(value)
         }
       },