ScrollArea
Área com rolagem e barra de rolagem estilizada.
Playground
Itens
<ScrollArea className="h-48 w-56 rounded-lg border"> <div className="p-3">…itens…</div> </ScrollArea>
Quando usar
- ✓Listas longas dentro de painel, popover ou menu de altura fixa
Evite quando
- A página inteira rola→ rolagem nativa do documento
Estados
rolandobarra visível no hover
Acompanha data-density="compact" (tamanhos vêm de --spacing, --text-*, --radius).
Acessibilidade
- Papel
- região rolável
- Teclado
- foco + setas/PageDown
- Garanta que o conteúdo focável seja alcançável pelo teclado