Primitivelayout

Separator

Stable

Régua de um pixel entre duas coisas, horizontal ou vertical. Composto sobre Base UI Separator. A única decisão que ele carrega não é visual: se apagar a régua fundiria duas coisas que significam coisas diferentes, ela é estrutura e o leitor de tela deve ouvi-la; se apagá-la só deixaria o layout mais apertado, ela é decoração e `decorative` a tira da árvore de acessibilidade.

Instalação

npx up-web-ds add separator

Preview

Default

Proveniência

Ingerido de shadcn/ui e normalizado sobre a Foundation.

Distribuição

Interna. O registry de consumo publica apenas itens stable.

Vertical

Primitive

Overlay

stable

Decorative

DS001Valor visual hardcoded
DS005Examples ausentes
DS011`stable` sem Definition of Done
DS014Animação fora da escala de motion

All states

Default

Proveniência

Ingerido de shadcn/ui e normalizado sobre a Foundation.

Distribuição

Interna. O registry de consumo publica apenas itens stable.

Vertical

Primitive

Overlay

stable

Decorative

DS001Valor visual hardcoded
DS005Examples ausentes
DS011`stable` sem Definition of Done
DS014Animação fora da escala de motion

Metadata

Classificação

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

Origem e distribuição

Fonte: shadcn registry / separator
Licença: MIT
URL: https://ui.shadcn.com/r/styles/base-vega/separator.json
Distribuição: Interna

Acessibilidade

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

Não é interativo: não entra na sequência de tabulação, não tem estado e não anima, então teclado, alvo de toque e movimento não têm superfície onde falhar. Leitor de tela verificado por teste: por padrão tem papel separator com aria-orientation acompanhando a orientação, e `decorative` o remove da árvore por completo em vez de apenas silenciar o papel — uma régua decorativa anunciada uma vez por linha transforma uma lista de quatro itens em oito coisas. Contraste verificado nos dois temas: a régua é o token --border, que já é o valor de hairline da Foundation em light e dark.

Dependências

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