Search field

The search_field component renders an <input type="search">, made for search queries. Browsers add features to this input type, such as a clear button that resets the search term.

<.search_field
  name=""
  value=""
  label="Search"
  placeholder="What do you have in mind"
/>

The search_button prop is a boolean. It adds a submit button with a magnifying glass icon at the end of the field, so the user can send the query with a click. The button is labeled "Search" for screen readers. search_button_class adds classes to its wrapper.

<.search_field
  name=""
  value=""
  label="Search"
  placeholder="What do you have in mind"
  search_button
/>