LifeUI
1.53.2Acordeón
Se utiliza para mostrar y ocultar secciones de contenido relacionado en una página
Acordeón Múltiple
Acordeón Controlado
Ejemplos
FAQ
Preguntas frecuentes
Tus preguntas respondidas aquí
Puedes instalar Blife UI usando npm: npm install @blifedesarrollo/ui
Formulario de configuración
Props
Accordion
| Prop | Tipo | Requerido | Descripción |
|---|---|---|---|
type | single | multiple | ✅ | Indica el tipo de acordeón. single permite solo un elemento abierto y multiple permite varios |
collapsible | boolean | - | Permite colapsar todos los elementos (solo para type=single) |
value | string | string[] | - | Valor controlado del acordeón |
defaultValue | string | string[] | - | Valor inicial del acordeón |
onValueChange | (value: string | string[]) => void | - | Callback que es ejecutado cuando cambia el valor del acordeón |
{...props} | React.ComponentProps<"div"> | - | Todas las props estandar de un div |
AccordionItem
| Prop | Tipo | Requerido | Descripción |
|---|---|---|---|
value | string | ✅ | Valor único del elemento del acordeón |
disabled | boolean | - | Si el elemento está deshabilitado |
className | string | - | Clases CSS adicionales |
children | ReactNode | - | Contenido del elemento del acordeón |
AccordionTrigger
| Prop | Tipo | Requerido | Descripción |
|---|---|---|---|
asChild | boolean | - | Reemplaza el elemento predeterminado con el hijo proporcionado, fusionando sus props y comportamiento |
className | string | - | Clases CSS adicionales |
children | ReactNode | - | Contenido del trigger (título del acordeón) |
AccordionContent
| Prop | Tipo | Requerido | Descripción |
|---|---|---|---|
asChild | boolean | - | Reemplaza el elemento predeterminado con el hijo proporcionado, fusionando sus props y comportamiento |
className | string | - | Clases CSS adicionales |
children | ReactNode | - | Contenido colapsable del acordeón |