Set awesomplete input value on value change

src/components/controls/Autocomplete.vue

@@ -35,6 +35,7 @@ export default {
         minChars: 0,
         maxItems: 99,
         sort: this.sort(),
+        filter: this.filter(),
         item: (text, input) => {
           const li = document.createElement('li');
           li.classList.add('dropdown-item');
@@ -52,7 +53,10 @@ export default {
 
     },
     sort() {
-      //
+      // return a function that handles sorting of items
+    },
+    filter() {
+      // return a function that filters list suggestions based on input
     }
   }
 };

src/components/controls/Link.vue

@@ -1,12 +1,18 @@
 <script>
 import frappe from 'frappejs';
 import feather from 'feather-icons';
+import Awesomplete from 'awesomplete';
 import Autocomplete from './Autocomplete';
 import Form from '../Form/Form';
 import { _ } from 'frappejs/utils';
 
 export default {
     extends: Autocomplete,
+    watch: {
+        value(newValue) {
+            this.$refs.input.value = newValue;
+        }
+    },
     methods: {
         async getList(query) {
             const list = await frappe.db.getAll({
@@ -45,6 +51,14 @@ export default {
                 return a.value > b.value;
             }
         },
+        filter() {
+            return (suggestion, txt) => {
+                if (suggestion.value === '__newItem') {
+                    return true;
+                }
+                return Awesomplete.FILTER_CONTAINS(suggestion, txt);
+            }
+        },
         bindEvents() {
             const input = this.$refs.input;