React Hook Form skill

O que ela faz

Reúne 35 regras pra quem monta formulário com a biblioteca React Hook Form, conferidas na versão 7.82. Estão em 7 grupos por prioridade: configuração do formulário, acompanhamento dos valores dos campos, componentes controlados, validação, estado do formulário, listas de campos dinâmicas e integração com bibliotecas de tela.

Cada regra aponta uma escolha que dá errado por padrão: chamar watch no lugar errado e redesenhar o formulário inteiro a cada tecla, esquecer os valores iniciais, recriar o esquema de validação toda hora, usar posição como chave numa lista de campos. Ensina a ligar campos do MUI, do shadcn e do Ant Design.

Também cuida do envio: try/catch no envio assíncrono, erro do servidor exibido com setError, o que fazer quando a validação barra o envio e como atualizar os valores iniciais depois de salvar. Cada regra tem um arquivo próprio com explicação e exemplo de código.

Nas palavras de quem fez

Quando usar

• Montar um formulário de cadastro ou checkout em React que não engasga ao digitar
• Ligar campos do shadcn ou do MUI ao React Hook Form sem quebrar a validação
• Fazer uma lista de itens que a pessoa adiciona e remove, como produtos de um orçamento
• Revisar um formulário lento e achar onde está o redesenho desnecessário
• Mostrar na tela o erro que o servidor devolveu no envio

Depois de instalar, é só pedir assim

• Revisa esse formulário de checkout com as regras de React Hook Form e me diz o que deixa ele lento
• Cria o formulário de orçamento com uma lista de produtos que a pessoa adiciona e remove
• Liga o Select do shadcn nesse formulário do jeito certo

Segurança

Gen Agent Trust Hub, Socket e Snyk leem o código da skill atrás de comando perigoso, dado vazando e instrução escondida. Alerta não é reprovação: quer dizer que vale ler o que a skill faz antes de instalar.

• Gen Agent Trust HubPassou
• SocketPassou
• SnykPassou

Perguntas