Search Input

Search Inputs can accept any user input and are used to collect search queries. The Search Input component can also accept optional functions to manage change and submit events. The function passed to onSearchChange will be called whenever the content of the Search Input is updated. The function passed to onSearchSubmit will be called when the user clicks the search Icon within the Search Input, or when they hit the Enter key. When there has been input provided, a clear Icon will appear that will reset the input when clicked.

The clearButtonAriaLabel, searchButtonAriaLabel, and searchInputAriaLabel props will pass the provided aria-labels to the associated Search Input elements.