Search Input
A search input includes a search icon as a submit button.
Important Notes:Set the type attribute to search for the input.Use the search_button_label prop to render a unique label for the search button.
Demo
Twig
{% set form_children %}
{% set label %}
{% include '@bolt-components-form/form-label.twig' with {
title: 'Employees or contractors',
displayType: 'floating',
attributes: {
for: 'search',
},
} only %}
{% endset %}
{% set input %}
{% include '@bolt-components-form/form-input.twig' with {
search_button_label: 'Search people',
attributes: {
placeholder: 'Employees or contractors',
type: 'search',
id: 'search',
},
} only %}
{% endset %}
{% include '@bolt-components-form/form-element.twig' with {
label: label,
children: input,
} only %}
{% endset %}
{% include '@bolt-components-form/form.twig' with {
children: form_children
} only %}