Componentes · shadcn

Partes do Field

Peças para montar formulários maiores: conjunto com legenda, grupos, linha horizontal, descrição, erro e separador. O Field de render-prop continua igual.

Formulário de signatário

Dados do signatário

Os dados aparecem no relatório de assinaturas anexado ao PDF final.

Nome completo

CPF

O CPF precisa de 11 dígitos.

Observação

Visível apenas para quem enviou o envelope.

Linha horizontal e cartão de escolha

Notificações do envelope

Avisar a cada assinatura

Um e-mail por signatário que concluir.

Avisar por SMS

Disponível no plano com envio de SMS.

Lembrete antes do prazo

Envia um lembrete 2 dias antes de o envelope expirar.

Erros agrupados

Informe o e-mail do signatário.
Defina um prazo de pelo menos 1 dia.

Partes

Prop	Tipo	Padrão	Descrição
FieldSet	fieldset	—	Agrupa campos relacionados. disabled desabilita todos.
FieldLegend	variant: "legend" \| "label"	"legend"	Título do conjunto.
FieldGroup	div	—	Pilha de campos com espaçamento padrão.
FieldRow	orientation: "vertical" \| "horizontal"; invalid; disabled	"vertical"	Linha de um campo. horizontal para checkbox ao lado do texto.
FieldContent	div	—	Coluna de rótulo e descrição ao lado de um controle.
FieldLabel	Label	—	Rótulo. Envolvendo um FieldRow, vira cartão de escolha.
FieldTitle	div	—	Título sem ligação de label, para dentro do cartão.
FieldDescription	p	—	Texto de apoio.
FieldError	errors?: { message?: string }[]	—	Erro com role=alert. Mensagens repetidas aparecem uma vez.
FieldSeparator	div	—	Divisória, com texto opcional no meio.

<FieldSet>
  <FieldLegend>Dados do signatário</FieldLegend>
  <FieldGroup>
    <FieldRow invalid>
      <FieldLabel htmlFor="cpf">CPF</FieldLabel>
      <Input id="cpf" aria-invalid aria-describedby="cpf-error" />
      <FieldError id="cpf-error">O CPF precisa de 11 dígitos.</FieldError>
    </FieldRow>
  </FieldGroup>
</FieldSet>