components
search
Input dedicado pra busca textual. Visualmente distinto de text-input regular pra reforçar a função.
overview
variantes
Variante única.
tamanhos
Altura padrão 40px. Variantes futuras: small (32px) e large (48px).
estados
comportamentos
- X aparece quando há valor (futuro — depende do browser)
- Enter dispara o submit do form
- Escape limpa o valor
- Navegação por teclado: "/" foca o input (atalho global)
quando usar
use
não use
acessibilidade
- type="search" semântico
- aria-label='buscar' ou label associado
- Foco visível
- role="search" no container quando relevante
código
<div class="search">
<input type="search" placeholder="// buscar..." aria-label="buscar">
</div>