github.com/hernad/nomad@v1.6.112/ui/app/components/search-box.js (about)

     1  /**
     2   * Copyright (c) HashiCorp, Inc.
     3   * SPDX-License-Identifier: MPL-2.0
     4   */
     5  
     6  import { reads } from '@ember/object/computed';
     7  import Component from '@ember/component';
     8  import { action } from '@ember/object';
     9  import { debounce } from '@ember/runloop';
    10  import { classNames } from '@ember-decorators/component';
    11  import classic from 'ember-classic-decorator';
    12  
    13  @classic
    14  @classNames('search-box', 'field', 'has-addons')
    15  export default class SearchBox extends Component {
    16    // Passed to the component (mutable)
    17    searchTerm = null;
    18  
    19    // Used as a debounce buffer
    20    @reads('searchTerm') _searchTerm;
    21  
    22    // Used to throttle sets to searchTerm
    23    debounce = 150;
    24  
    25    // A hook that's called when the search value changes
    26    onChange() {}
    27  
    28    @action
    29    setSearchTerm(e) {
    30      this.set('_searchTerm', e.target.value);
    31      debounce(this, updateSearch, this.debounce);
    32    }
    33  
    34    @action
    35    clear() {
    36      this.set('_searchTerm', '');
    37      debounce(this, updateSearch, this.debounce);
    38    }
    39  }
    40  
    41  function updateSearch() {
    42    const newTerm = this._searchTerm;
    43    this.onChange(newTerm);
    44    this.set('searchTerm', newTerm);
    45  }