Campo de texto
Um campo de texto rotulado construído sobre React Aria - adornos principais e finais, texto de dica, e estados obrigatórios/inválidos com um anel de foco cruzado.
Instalação
Você pode adicionar este componente de entrada usando nosso CLI ou manualmente:
Modo escuro pronto - este componente segue tokens semânticos BoardUI automaticamente. Configurar a mudança de tema.
O CLI copia a fonte do componente (com suas dependências internas) em seu projeto e instala quaisquer pacotes npm necessários.
npx boardui@latest add inputUsando um pacote de UI compartilhado ou aliases de importação personalizados? Configure seus caminhos de instalação antes de executar o CLI. Exemplos de copy-paste usam as importações padrão.
Tamanhos
Estados
Mensagem de erro
errorMessage substitui a dica enquanto o campo é inválido, no slot de erro do React Aria, e o campo passa a ser descrito por ela. Só com isRequired, o React Aria valida de forma nativa no envio: bloqueia o formulário, marca o campo como inválido, move o foco para ele e impede o balão do próprio navegador, então a mensagem é o que as pessoas veem. Com validationBehavior="aria", nada bloqueia o envio, e o campo só fica inválido quando você passa isInvalid ou quando validate retorna um erro.