Tooltip
StableHint transitório ancorado a um gatilho. Composto sobre Base UI Tooltip, que desenha o popup mas não o anuncia: esta camada adiciona o papel `tooltip` e liga `aria-describedby` ao gatilho enquanto ele está aberto. É a única superfície do sistema que inverte foreground e background, para separar à primeira vista um hint de um popover — onde se pode colocar o cursor.
Instalação
npx up-web-ds add tooltipPreview
Default
Sides
Grouped
On Unavailable Action
Indisponível: o item ainda é incoming.
With Longer Text
All states
Default
Sides
Grouped
On Unavailable Action
Indisponível: o item ainda é incoming.
With Longer Text
Metadata
Classificação
- Layer
- Primitive
- Domínio
- Domain-free (compartilhado)
- Categoria
- overlay
- Status
- Stable
Origem e distribuição
- Fonte
- shadcn registry / tooltip
- Licença
- MIT
- Distribuição
- Interna
Acessibilidade
- Teclado: revisado
- Leitor de tela: revisado
- Touch: não revisado
- Reduced motion: revisado
Teclado verificado por teste: o hint abre ao receber foco por Tab — não só no hover —, Escape o dispensa sem tirar o foco do gatilho (WCAG 2.2 SC 1.4.13) e sair do gatilho o fecha. Leitor de tela verificado por teste: o popup carrega role="tooltip" e o gatilho aponta aria-describedby para ele apenas enquanto está aberto, então o nome acessível continua sendo o rótulo visível do gatilho e o hint entra como descrição. Reduced motion verificado em navegador com prefers-reduced-motion: reduce — os tokens de motion colapsam para 1ms e a animação de entrada mede 0.001s, sem perder a abertura. Toque é declarado como falso por decisão de design: o conteúdo é sempre redundante em relação ao gatilho, e um gatilho desabilitado nunca o abre, então a razão de uma ação indisponível vive na página.
Dependências
- Pacotes
- @base-ui/react
- Ícones
- Nenhum
- Construído sobre
- Nenhum
- Usado por
- Nenhum ainda