A general-purpose search bar, built in React. View the demo.
Development
To run the dev server:
npm start
To run tests and lint:
npm run check
Props
Prop | Type | Required | Description |
---|
autoFocus | boolean | | If true , focuses the input when the component loads |
delay | number | | The number of milliseconds to wait after the last key stroke before calling onChange |
onChange | function | ✓ | Called when input changes |
onClear | function | ✓ | Called when suggestions are cleared |
onSearch | function | ✓1 | Called when clicking the search button or enter (presumes that search button is available) |
onSelection | function | | Called when selecting a suggestion |
renderClearButton | boolean | | Flag indicating whether to display the clear button |
renderSearchButton | boolean | | Flag indicating whether to display the search button |
style | object | | Style object |
suggestionRenderer | function | | Function to render suggestions |
suggestions | array<string> | ✓ | Array of suggestions |
Also accepts supported HTML attributes for the <input>
element.
Only when renderSearchButton
is true
License
MIT