Accordion

Accordion is a vertical stack of headers that expand or collapse to show or hide content, providing an organized, user-friendly way to manage information.

Basic

An accordion functions as a vertical stack of headers that expand to reveal or conceal content sections.

Installation

If you hit any issues, make sure you check out the installation guide here.

Manual Installation

Sometimes, using the CLI is the way to go, so make sure you install the necessary dependencies for the components you want to use.

And next, you can copy the code below and paste it into your dopest component folder.

Anatomy

Import the components and use them as shown below, adapting the structure to fit each component.

Default Expanded

Set the initially expanded sections by providing an array of keys to the defaultExpandedKeys prop. These keys can be either numbers or strings.

Yes, you can upgrade or downgrade your subscription plan at any time from your account settings.
Your past orders can be viewed in the 'Orders' section of your account dashboard.

Hide Indicator

Eliminate the visual indicator (arrow key) by using the hideIndicator prop.

Disabled

Disable specific sections by using the disabledKeys prop. For instance, keys 1, 2, and 4 are disabled in this example, making them non-interactive and unable to be expanded or collapsed.