Accordion

Example#

Live Editor

<Accordion headers={[ 'First Question', 'Second Question']}>
    <FreeTextQuestion />
    <FreeTextQuestion />
</Accordion>

<Accordion headers={[ 'First Question', 'Second Question']}>
    <FreeTextQuestion />
    <FreeTextQuestion />
</Accordion>

Result

active | number: index of slider to be opened at the beginning. Default: none.
canCloseAll | boolean: whether one can collapse all headers. Default: false.
headers | array<(string|node)>: array of header names. Default: none.
headerStyle | object: one may also assign a style to the header bars. Default: none.
headerClassName | string: this overrules the given class name of the headers. Default: none.
onChange | function: callback invoked with index of new active vertical slider. Default: onChange() {}.
className | string: class name for outer div. Default: ''.
style | object: CSS inline styles for outer div. Default: none.