Overlay
Hover Card
Card flutuante ao passar o mouse, para informações extras.
Uso
Use o elemento <y-hover-card> no seu HTML:
html
<y-hover-card> <span slot="trigger">@yampi</span> <div>Informações do perfil Yampi</div></y-hover-card>Exemplos
Padrão
Padrão
Importação
Importe todos os componentes ou apenas este:
typescript
// Importar tudoimport '@yampi/ui';// Importar apenas este componenteimport '@yampi/ui/dist/components/hover-card.js';Acessibilidade
- Suporta navegação por teclado
- Utiliza atributos ARIA apropriados
focus-visiblepara indicação de foco