SearchBar
SearchBar is a wrapper around an HTML input element that makes it convenient to capture changes in user input, often for the purpose of searching or filtering a list.
Demo
Required Imports
import { SearchBarModule } from 'nextsapien-component-lib';
Properties

Type | Name | Description | Data type | Required | Default | Demo
--- | --- | --- | --- | --- | --- | ---
Input | placeholderText | Sets the placeholder text in the search bar. | string | true | n/a |
Input | inputText | Sets the value of the search bar. | string | false | n/a |
Input | order | Sets the order of arrangement of the the search bar parts in the order: Input, Clear icon and Search Icon | Order | Order.CIS (it can either be SIC, ICS, CIS ) | n/a |
Output | handleSearchStringChange | Determines how many placeholders are displayed. | number | n/a | n/a | n/a
Output | cleared | Emits when clear button pressed | null | n/a | n/a | n/a
Input | clearIcon | The icon displayed for clearing the input.
Input | searchIcon | The icon displayed for triggering a search.
Output | searchStringChange | Emits the current value of the search input whenever it changes.
Output | focused | Emits an event when the input field gains focus.
Output | unfocused | Emits an event when the input field loses focus.

Example usage
`{{ searchBarCode1 }}`
Example usage
`{{ searchBarCode2 }}`