Exibição
Skeleton
Placeholder animado para conteúdo em carregamento.
Uso
Use o elemento <y-skeleton> no seu HTML:
html
<y-skeleton width="200px" height="20px"></y-skeleton><y-skeleton width="150px" height="20px"></y-skeleton><y-skeleton width="100px" height="20px"></y-skeleton>Exemplos
Padrão
Padrão
Propriedades
| Propriedade | Tipo | Padrão | Descrição |
|---|---|---|---|
width | string | — | Largura do skeleton |
height | string | — | Altura do skeleton |
variant | "text" | "circular" | "rectangular" | "text" | Formato |
Importação
Importe todos os componentes ou apenas este:
typescript
// Importar tudoimport '@yampi/ui';// Importar apenas este componenteimport '@yampi/ui/dist/components/skeleton.js';Acessibilidade
- Suporta navegação por teclado
- Utiliza atributos ARIA apropriados
focus-visiblepara indicação de foco