Expandable
Expandable crea un simple interruptor mostrar/ocultar para contenido que los lectores pueden querer ver pero que no es esencial para el flujo principal.
Usa Expandable para ocultar respuestas de API extensas, pasos de solución de problemas o detalles complementarios que de otro modo interrumpirían el flujo de lectura. Se renderiza como un único elemento desplegable en el que se puede hacer clic. Es más ligero que Accordion, que está diseñado para secciones agrupadas y navegables.
Usa Expandable cuando:
- Los detalles complementarios interrumpirían la narrativa principal
- La información opcional beneficia a algunos lectores pero no a todos
- El contenido extenso (como respuestas de API completas) debe estar colapsado de forma predeterminada
Uso básico
<Expandable title="Show more details">
These details are hidden by default and revealed when clicked.
</Expandable>Abierto por defecto
Empieza expandido:
Esta sección empieza visible.
<Expandable title="Expanded by default" defaultOpen>
This section starts visible.
</Expandable>Casos de uso comunes
Detalles de la respuesta de la API
Colapsa respuestas extensas que de otro modo interrumpirían el flujo de la documentación:
Pasos de solución de problemas
Props
Texto del encabezado de la sección.
Empieza expandido.
Expandable frente a Accordion
| Feature | Expandable | Accordion |
|---|---|---|
| Purpose | Ocultar contenido complementario | Organizar secciones de igual importancia |
| Icons | No | Sí |
| Descriptions | No | Sí (admite subtítulo) |
| Grouping | Independiente | Se puede agrupar con AccordionGroup |
| Best for | Detalles opcionales, ejemplos extensos | Preguntas frecuentes, listas de funciones, navegación |
Regla general: Si el contenido es "bueno tenerlo", usa Expandable. Si los usuarios necesitan elegir entre secciones, usa Accordion.