github.com/manicqin/nomad@v0.9.5/ui/app/components/search-box.js (about) 1 import { reads } from '@ember/object/computed'; 2 import Component from '@ember/component'; 3 import { run } from '@ember/runloop'; 4 5 export default Component.extend({ 6 // Passed to the component (mutable) 7 searchTerm: null, 8 9 // Used as a debounce buffer 10 _searchTerm: reads('searchTerm'), 11 12 // Used to throttle sets to searchTerm 13 debounce: 150, 14 15 // A hook that's called when the search value changes 16 onChange() {}, 17 18 classNames: ['search-box', 'field', 'has-addons'], 19 20 actions: { 21 setSearchTerm(e) { 22 this.set('_searchTerm', e.target.value); 23 run.debounce(this, updateSearch, this.debounce); 24 }, 25 26 clear() { 27 this.set('_searchTerm', ''); 28 run.debounce(this, updateSearch, this.debounce); 29 }, 30 }, 31 }); 32 33 function updateSearch() { 34 const newTerm = this._searchTerm; 35 this.onChange(newTerm); 36 this.set('searchTerm', newTerm); 37 }