Overview

Contains all the parts of a collapsible section.

Properties

Properties	Description
type	Determines whether one or multiple items can be opened at the same time.
value	The controlled value of the item to expand when type is "single". Must be used in conjunction with onValueChange.
defaultValue	The value of the item to expand when initially rendered and type is "single". Use when you do not need to control the state of the items.
onValueChange	Event handler called when the expanded state of an item changes and type is "single".
collapsible	When type is "single", allows closing content when clicking trigger for an open item.
disabled	When true, prevents the user from interacting with the accordion and all its items.
header	AccordionItem's Header content
content	Contains the collapsible content for an item.
className	The className property can be used to add a CSS class to a component that accepts styling. In Clutch, the className property powers the visual styling panel and the class name itself is auto-generated. Additional class names can be passed to the component by twirling open the className control and passing in strings.
style	The style property accepts a CSS JavaScript object with camelCased properties rather than a CSS string. Using the style attribute as the primary means of styling elements is generally not recommended. The style is most often used in React applications to add dynamically-computed styles at render time. Learn more about the style property here.
ref	The ref property allows users to attach React refs to the component. Learn more about refs in React here
children	The Children prop allows users to pass other components as a property, enabling users to compose together components.