Accordion

import Accordion from '@semcore/ui/accordion';

<Accordion />;

AccordionProps

& {...}

Name	Type	Description
value		Value for the active tab. Can be set as stroke, number, null or as array.
defaultValue		Value of the active tabs selected by default
onChange	((value: , event: React.SyntheticEvent) => void) | React.Dispatch<React.SetStateAction<>>	Called when the selection is changed
duration	number	Animation duration of each Accordion.Item inside
use	"primary" | "secondary"	Changes the visual appearance of the component

Accordion.Item

import { Accordion } from '@semcore/ui/accordion';

<Accordion.Item />;

AccordionItemProps

Name	Type	Description
value	string | number	Tab value
disabled	boolean	Disabling selection changes
duration	number	Animation duration

Accordion.Item.Toggle

import { Accordion } from '@semcore/ui/accordion';

<Accordion.Item.Toggle />;

Has all properties as BoxProps prop does.

Accordion.Item.Collapse

import { Accordion } from '@semcore/ui/accordion';

<Accordion.Item.Collapse />;

AccordionCollapseProps

& & {...}

Name	Type	Description
duration	number | [number, number]	Animation duration in ms
preserveNode	boolean	If it set to `true`, animated node is persisted in dom even if `visible=false`
overflowHidden	boolean	Add overflow=clip when passing animation
defaultHeight	"auto" | "100%"	Value for height after animation

Has all properties as BoxProps prop does.

Accordion.Item.Chevron

import { Accordion } from '@semcore/ui/accordion';

<Accordion.Item.Chevron />;

Has all properties as BoxProps prop does.