Collapsible

Collapsible enables content to be either collapsed (hidden) or expanded (visible). It has two elements: a trigger and a panel whose visibility is controlled by the button.

Also known as: Disclosure
View source code
Note: This tab list includes overflow; tab positions may be inaccurate or change when a tab is selected

Keyboard interactions

KeyFunction
Tab
  • If focus is above the collapsible trigger, Tab moves focus to the trigger.
Shift + Tab
  • If focus is below the collapsible trigger, this action moves focus to the trigger.
Enter / Space
  • Collapsible panels are in the collapsed state by default. This action expands, or collapses, panels.