Foundations
Skeleton
A placeholder in the final layout's shape (Figma "Skeleton" 179:602), so nothing jumps when content lands.
Always hidden from assistive tech: the loading region sets aria-busy and says "Carregando…" once. No pulse under reduced motion. Width follows the container; set it with className.
<div aria-busy><Skeleton shape="card" /></div>Playground
Um preset por valor do primeiro eixo do Figma. Mude as props; dsState força hover, foco ou pressionado, como na matriz.
Skeleton
Variantes, tamanhos e estados
Cada célula é o componente real, marcada com a variante do Figma que reproduz (passe o mouse pra ver o node).
Shape · Line
| Skeleton |
|---|
Shape · Circle
| Skeleton |
|---|
Shape · Block
| Skeleton |
|---|
Shape · Row
| Skeleton |
|---|
Shape · Text
| Skeleton |
|---|
Shape · Card
| Skeleton |
|---|
Shape · Tile
| Skeleton |
|---|
Shape · Pill
| Skeleton |
|---|
Props
As props que o arquivo do DS declara. O componente também repassa as do primitivo (base-ui), quando ele tem um.
| Prop | Tipo | Padrão | Descrição |
|---|---|---|---|
| shape? | "block" | "card" | "circle" | "line" | "pill" | "row" | "text" | "tile" | null | "line" | |
| className? | string | — |