Welcome
Get Started
Contribution
Updates
Foundations
Components
Overview
Accordion
Overview
Style
Usage
React
Accessibility
Action Toolbar
Alert
App Bar
Autocomplete
Avatar
Badge
Banner
Breadcrumbs
Button
Card
Chat
Checkbox
Chip
Chip Input
Data Grid
Date Picker
Data Visualization
Dialog
Divider
Drawer
Dropdown Button
Dropzone
Empty State
Expandable Content
Flag
Fields
Icon
Icon Button
Icon List
Image
Link
Mews Logo
Month Picker
Number Input
Password Input
Pictogram
Progress Indicator
Radio Button
Range Date Picker
Search Input
Segmented Control
Select
Selection Card Group
Side Menu
Signature Input
Simple List
Side Panel
Skeleton
Skip Link
Spinner
Split Button
Status Indicator
Stepper
Table
Tabs
Tag
Text Input
Text Area
Time Picker
Toggle
Tooltip
Patterns
Layout
Resources
Getting Help
Powered by Supernova
Accordion
An interactive component that expands and collapses content to organize information efficiently.
Overview
Style
Usage
React
Accessibility
What the component handles
Expand button is properly labeled and linked to the accordion title
aria-expanded
state management for button (true/false based on open state)
Accordion content container has
role="region"
with
aria-labelledby
using the title
Accordion
React
Action Toolbar
React
On this page
What the component handles