A general-purpose search bar, built in React. View the demo.
Development
To run the dev server:
npm startTo run tests and lint:
npm run checkProps
| 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.
1 Only when renderSearchButton is true
License
MIT