/ui/accordions

El componente BkAccordion permite al usuario mostrar u ocultar secciones y contenidos en la página.

Título de acordeón 1

Icon expand-more-primary

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

<BkAccordion
    label='Título de acordeón 1'
    color='white'
    defaultExpanded
>
    {children}
</BkAccordion>
<BkAccordion
    label='Título de acordeón 2'
    color='white'
    disabled
>
    {children}
</BkAccordion>
<BkAccordion label='Título de acordeón 3' color='white'>
    {children}
</BkAccordion>

Color

Título de acordeón 4

Icon expand-more-secondary

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

<BkAccordion label='Título de acordeón 4' defaultExpanded>
    <BkTypography variant='body3' gutterBottom>
        {children}
    </BkTypography>
</BkAccordion>
<BkAccordion label='Título de acordeón 5' disabled>
    <BkTypography variant='body3' gutterBottom>
        {children}
    </BkTypography>
</BkAccordion>
<BkAccordion label='Título de acordeón 6'>
    <BkTypography variant='body3' gutterBottom>
        {children}
    </BkTypography>
</BkAccordion>
NombreTypeDefaultReuqeridoDescripción
childrennode

null

Icon checked-successContenido del componente.
colorblack | white

black

El estilo de color del componente.
defaultExpandedbool

false

Si es igual a "true" el acordeón estará expandido por defecto.
disabledbool

false

Si es igual a "true" el componente estará deshabilitado.
labelstring

null

Icon checked-successTítulo del acordeón.
onChangefunc

null

Evento: callback function para cuando el estado del componente cambia.