Accordion - Keep React

The Accordion Component in the Keep React allows you to create collapsible sections of content, commonly known as accordions. Users can toggle the visibility of the content by clicking on the disclosure button. With customizable options for the theme, open state, type, and state, you can create accordion components that fit seamlessly into your design and provide an intuitive user experience.

Default Accordion#

The default Accordion component allows users to reveal and hide content by simply clicking on the disclosure button.

Flush Accordion#

Control the initial state of accordion panels with the flush property.

Accordion First Open Panel#

Use the openFirstPanel property to set the first accordion panel to be open by default.

The Keep React is a collection of UI components, styles, and guidelines that ensure consistency and a unified user experience across our products. It simplifies the design and development process by providing ready-to-use components that can be easily customized and integrated into various applications.

Accordion With Icon#

Enhance your accordion with icons for a more visually appealing experience.

Disabled Accordions#

Control user interactions by making specific AccordionPanel components non-interactive with the disabled property.

API Reference#

Explore the available props for the Accordion component

Property	Description	Type	Default
openFirstPanel	Keep first panels always open.	boolean	false
flush	Accordion without outer border and and background color	boolean	false
disabled	Disable interaction with the accordion.	boolean	false