Primitiveaction

Toggle

Stable

Botão que permanece pressionado. Base UI Toggle fornece o comportamento e o Button do Up Web DS fornece a forma, então um toggle é um botão por construção, não por semelhança. `variant` fica restrito a ghost e outline — as duas que descrevem um controle com estado ligado.

Instalação

npx up-web-ds add toggle

Preview

Default

Pressed

Variants

Sizes

Icon Only

Disabled

Filter Bar

Mostrando: Stable.

All states

Default

Pressed

Variants

Sizes

Icon Only

Disabled

Filter Bar

Mostrando: Stable.

Metadata

Classificação

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

Origem e distribuição

Fonte: shadcn registry / toggle
Licença: MIT
URL: https://ui.shadcn.com/r/styles/base-vega/toggle.json
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, Space e Enter alternam, e o estado é reportado por aria-pressed em vez de depender só da cor. Um toggle desabilitado sai da sequência de tabulação e recusa a alternância mantendo o estado anunciado. Touch verificado em viewport de 375px com emulação de toque: 36x36 no size default e 32x32 no sm, acima do mínimo de 24x24 da WCAG 2.2 SC 2.5.8. Reduced motion verificado com prefers-reduced-motion: reduce — as transições herdadas do Button colapsam para 1ms e o deslocamento de 1px do estado ativo não é animado.

Dependências

Pacotes: @base-ui/react, class-variance-authority
Ícones: Nenhum
Construído sobre: Button
Usado por: Nenhum ainda