enable custom logic for showing/hiding no options slot

docs/api/props.md

@@ -521,6 +521,26 @@ selectOnTab: {
 }
 ```
 
+## shouldNoOptionsSlotDisplay <Badge text="v3.13.0+" />
+
+```js
+/**
+ * Determines whether the no options slot
+ * will be displayed.
+ *
+ * Receives the component instance as the only argument.
+ *
+ * @since v3.13.0
+ * @return boolean
+ */
+shouldNoOptionsSlotDisplay: {
+  type: Function,
+  default({ filteredOptions }) {
+    return filteredOptions.length === 0
+  }
+}
+```
+
 
 ## tabindex
 

src/components/Select.vue

@@ -70,7 +70,7 @@
             {{ getOptionLabel(option) }}
           </slot>
         </li>
-        <li v-if="filteredOptions.length === 0" class="vs__no-options">
+        <li v-if="showNoOptionsSlot" class="vs__no-options">
           <slot name="no-options" v-bind="scope.noOptions">Sorry, no matching options.</slot>
         </li>
         <slot name="list-footer" v-bind="scope.listFooter" />
@@ -579,6 +579,22 @@
         default({noDrop, open, mutableLoading}) {
           return noDrop ? false : open && !mutableLoading;
         }
+      },
+
+      /**
+       * Determines whether the no options slot
+       * will be displayed.
+       *
+       * Receives the component instance as the only argument.
+       *
+       * @since v3.13.0
+       * @return boolean
+       */
+      noOptionsSlotShouldDisplay: {
+        type: Function,
+        default({filteredOptions}) {
+          return filteredOptions.length === 0
+        }
       }
     },
 
@@ -1200,6 +1216,14 @@
       showClearButton() {
         return !this.multiple && this.clearable && !this.open && !this.isValueEmpty
       },
+
+      /**
+       * Determine if the no options slot should be displayed.
+       * @returns {Boolean}
+       */
+      showNoOptionsSlot() {
+        return !! this.noOptionsSlotShouldDisplay(this)
+      }
     },
 
   }

tests/unit/Slots.spec.js

@@ -1,4 +1,4 @@
-import { mountDefault } from '../helpers';
+import { mountDefault, selectWithProps } from '../helpers';
 
 describe('Scoped Slots', () => {
   it('receives an option object to the selected-option-container slot', () => {
@@ -74,6 +74,20 @@ describe('Scoped Slots', () => {
     })
   });
 
+  test('no options slot can be hidden', async () => {
+    const Select = selectWithProps({
+      noOptionsSlotShouldDisplay: () => false,
+      options: []
+    });
+
+    Select.vm.open = true;
+    await Select.vm.$nextTick();
+
+    expect(Select.classes('vs--open')).toBeTruthy();
+    expect(Select.find('.vs__dropdown-menu li')).toBeTruthy();
+    expect(Select.find('.vs__no-options').exists()).toBeFalsy();
+  });
+
   test('header slot props', async () => {
     const header = jest.fn();
     const Select = mountDefault({}, {