InputMultiple
Múltiplos valores como tags, com overflow e contador. Estende o UInputTags.
Componente EletroDS —
InputMultiple, usado no código como <MeInputMultiple> (estende o UInputTags do Nuxt UI). No Figma, use o componente da Library.O InputMultiple captura vários valores num campo só, como tags removíveis, com overflow + contador quando passam da largura (ex.: categorias, e-mails). Para montar um subconjunto a partir de um catálogo grande movendo itens entre listas, use o DualList. Vive dentro de um FormField.
Variantes
| Quero… | Use |
|---|---|
| Contador de excedentes | counter (ex.: "+2") |
| Separador ao digitar | delimiter (vírgula, Enter) |
| Densidade | size |
No código
<MeInputMultiple> é um componente EletroDS. Doc técnica em eletro.design/components/inputmultiple. Aqui o foco é o uso em Design.
Acessibilidade
- Cada tag removível por teclado; o botão de remover (×) tem nome acessível (ex.: "Remover {valor}").
- Adição/remoção de valores anunciada (
aria-live); o contador de overflow ("+N") também acessível. - Rótulo do campo associado (FormField); foco visível ao navegar entre tags.
- Valor inválido/duplicado sinalizado por texto, não só por cor.