Collapse
Conteúdo expansível com animação.
Collapse
Click to open/close
This content is toggled with a native details element.
This collapse uses a hidden checkbox and transitions on max-height.
Focus collapse
Click the title (or focus it) to reveal this content.
<!-- Collapse Component -->
<div class="collapse">
Collapse content here
</div>---
import Collapse from '@/components/ui/data-display/Collapse/Collapse.astro';
---
<Collapse />Uso
Quando usar
- Use Collapse para conteúdo expansível com animação.
- Ideal para interfaces que precisam de exibição de dados
Boas práticas
- Mantenha consistência com outros componentes da mesma categoria
- Considere acessibilidade e estados de interação
- Teste em diferentes tamanhos de tela