Homecomponentsstructural

Accordion

A container that allows collapsing and expanding specific sections.

Open in Playroom

Multiple Expandable Items

Set type property to multiple to open multiple items at a time.

Open in Playroom

Open By Default

Use expanded property to show an item by default.

  • Online
  • At customer's location
  • At professional's location
Open in Playroom

For multiple items, use expanded property to show an array of items by default.

  • Morning
  • Afternoon
  • Evening

  • Male
  • Female

Open in Playroom

API

Accordion

type
Required
Whether one or multiple items can be opened at the same time.
multiple
single
children
Required
The content of the accordion.
ReactNode
expanded
The item or items that are expanded.
string | string[]
data
An object with the data keys and values.
DataAttributeMap

AccordionItem

id
Required
A unique identifier for the accordion item.
string
title
Required
The title of the accordion item.
string
children
Required
The content associated with accordion item title.
ReactNode
as
The element used for the according titles.
ElementType<any>
Table of Contents
Multiple Expandable Items
Open By Default
API
Accordion
AccordionItem