- add filter function prop

- rename `filterFunction` to `filterComparator`
- add dev example using fuse.js
- update jsdocs
- update tests

src/components/Select.vue

@@ -522,34 +522,6 @@
         }
       },
 
-      /**
-       * Callback to filter the search result the label text.
-       * @type   {Function}
-       * @param  {Object || String} option
-       * @param  {String} label
-       * @param  {String} search
-       * @return {Boolean}
-       */
-      filterFunction: {
-        type: Function,
-        default(option, label, search) {
-          return (label || '').toLowerCase().indexOf(search.toLowerCase()) > -1
-        }
-      },
-
-      filter: {
-        "type": Function,
-        default(vm) {
-          return vm.mutableOptions.filter((option) => {
-            let label = vm.getOptionLabel(option)
-            if (typeof label === 'number') {
-              label = label.toString()
-            }
-            return this.filterFunction(option, label, vm.search)
-          });
-        }
-      },
-
       /**
        * An optional callback function that is called each time the selected
        * value(s) change. When integrating with Vuex, use this callback to trigger
@@ -603,6 +575,44 @@
         default: true
       },
 
+      /**
+       * Callback to determine if the provided option
+       * should match the current search text.
+       * @type   {Function}
+       * @param  {Object || String} option
+       * @param  {String} label
+       * @param  {String} search
+       * @return {Boolean}
+       */
+      filterComparator: {
+        type: Function,
+        default(option, label, search) {
+          return (label || '').toLowerCase().indexOf(search.toLowerCase()) > -1
+        }
+      },
+
+      /**
+       * Callback to filter results when
+       * search text is provided.
+       * @type   {Function}
+       * @param  {Array} list of options
+       * @param  {String} search text
+       * @param  {Object} vSelect instance
+       * @return {Boolean}
+       */
+      filter: {
+        "type": Function,
+        default(options, search) {
+          return options.filter((option) => {
+            let label = this.getOptionLabel(option)
+            if (typeof label === 'number') {
+              label = label.toString()
+            }
+            return this.filterComparator(option, label, search)
+          });
+        }
+      },
+
       /**
        * User defined function for adding Options
        * @type {Function}
@@ -995,8 +1005,11 @@
        * @return {array}
        */
       filteredOptions() {
-        let options = this.search.length ? this.filter(this) : this.mutableOptions;
-        if (this.taggable && !this.optionExists(this.search)) {
+        if (!this.filterable && !this.taggable) {
+          return this.mutableOptions.slice()
+        }
+        let options = this.search.length ? this.filter(this.mutableOptions, this.search, this) : this.mutableOptions;
+        if (this.taggable && this.search.length && !this.optionExists(this.search)) {
           options.unshift(this.search)
         }
         return options

src/dev.js

@@ -1,9 +1,9 @@
 import Vue from 'vue'
 import Fuse from 'fuse.js'
+import debounce from 'lodash/debounce'
 import resource from 'vue-resource'
 import vSelect from './components/Select.vue'
 import countries from 'docs/data/advanced.js'
-import debounce from 'lodash/debounce'
 import fuseSearchOptions from './fuseSearchOptions'
 
 Vue.use(resource)
@@ -20,6 +20,7 @@ new Vue({
     value: null,
     options: countries,
     ajaxRes: [],
+    people: [],
     fuseSearchOptions
   },
   methods: {
@@ -43,8 +44,8 @@ new Vue({
         loading(false)
       })
     }, 250),
-    fuse({mutableOptions, search}) {
-      return new Fuse(mutableOptions, {
+    fuseSearch(options, search) {
+      return new Fuse(options, {
         keys: ['title', 'author.firstName', 'author.lastName'],
       }).search(search);
     }