Autocomplete component: hide panel when no results found

[marcelo2605]

Event adding a blank space to the props emptySearchMessage, the panel is still visible. I want to hide it because if no result were found I'll run a custom logic.

I tried this:

@complete="searchSuggestions"

searchSuggestions(event) {
      const query = event.query.toLowerCase();
      this.filteredSuggestions = this.termsSuggestions.filter((item) =>
        item.ttl.toLowerCase().includes(query),
      );

      if (!this.filteredSuggestions.length) {
        this.$refs.autocomplete.hide();
      }
    },

But the result is not so good. There must be a better solution.