FormField
Moldura de campo: rótulo, controle, dica e mensagem de validação. Gera o id, liga o rótulo ao controle e entrega aria-describedby e aria-invalid pela render prop.
Cadastro do signatário
A mensagem segue a prioridade erro, aviso, sucesso e dica. O erro é anunciado como alerta.
Como aparece no documento de identidade.
CPF incompleto. Faltam dígitos.
Domínio pouco comum. Confira antes de enviar o convite.
Aparece no e-mail do convite.
Rótulo oculto e desabilitado
hideLabel mantém o rótulo para leitores de tela. disabled esmaece o campo e repassa disabled ao controle.
Gerado depois do envio.
Props
| Prop | Tipo | Padrão | Descrição |
|---|---|---|---|
| label | ReactNode | — | Rótulo ligado ao controle por htmlFor. |
| required | boolean | false | Mostra o asterisco e repassa required e aria-required. |
| optionalLabel | ReactNode | — | Marca de campo opcional ao lado do rótulo. |
| hint | ReactNode | — | Dica abaixo do controle. |
| state | "default" | "error" | "warning" | "success" | "default" | Escolhe a mensagem e liga aria-invalid no erro. |
| errorMessage / warningMessage / successMessage | ReactNode | — | Mensagem de cada estado. Substitui a dica. |
| hideLabel | boolean | false | Esconde o rótulo só visualmente. |
| disabled | boolean | false | Esmaece o campo e repassa disabled. |
| id | string | useId() | Id do controle. |
| children | ReactNode | (control) => ReactNode | — | Render prop: o primeiro argumento traz id, required, disabled, aria-describedby, aria-invalid e aria-required para espalhar no controle; o segundo traz o state. |