Design system interno · uso exclusivo da Up Web Studio

Icon Provider · Lucide

Primitiveinput

Input

Stable

Campo de texto de uma linha. Composto sobre Base UI Input, então uma aplicação consumidora pode envolvê-lo em um Field e receber rótulo, descrição e estado de validação sem que o primitive saiba que o Field existe.

Instalação

npx up-web-ds add input

Preview

Default

With Value

Kebab-case, único em todo o design system.

Invalid

Já existe um primitive com esse id. Use ds:compare em vez de criar um segundo.

Disabled

Primitives são domain-free.

Read Only

Vem da proveniência registrada.

Types

All states

Default

With Value

Kebab-case, único em todo o design system.

Invalid

Já existe um primitive com esse id. Use ds:compare em vez de criar um segundo.

Disabled

Primitives são domain-free.

Read Only

Vem da proveniência registrada.

Types

Metadata

Classificação

Layer
Primitive
Domínio
Domain-free (compartilhado)
Categoria
input
Status
Stable

Origem e distribuição

Fonte
shadcn registry / input
Licença
MIT
Distribuição
Interna

Acessibilidade

  • Teclado: revisado
  • Leitor de tela: revisado
  • Touch: revisado
  • Reduced motion: revisado

Teclado e leitor de tela verificados por teste: alcançável por Tab, digitação e edição funcionam, o campo é nomeado pelo label associado por htmlFor, o placeholder não substitui o nome, e aria-invalid com aria-describedby liga a mensagem de erro ao campo. Um campo desabilitado sai da sequência de tabulação e recusa entrada; readOnly permanece focalizável e anunciado. Touch verificado em viewport de 375px com emulação de toque: altura de 36px, acima do mínimo de 24x24 da WCAG 2.2 SC 2.5.8, e o tamanho do texto permanece em 16px abaixo de md — abaixo disso o iOS aplica zoom no viewport ao focar o campo e não o desfaz. Reduced motion verificado com prefers-reduced-motion: reduce — a transição de cor e sombra do foco colapsa para 1ms.

Dependências

Pacotes
@base-ui/react
Ícones
Nenhum
Construído sobre
Nenhum
Usado por
Input Group