Expand / Collapse Widget Examples

Each widget is wrapped with a div.example. The controlled content container uses the class "details". Buttons manage aria-expanded and aria-controls for accessibility.

This example demonstrates a custom expand/collapse pattern:

The button toggles aria-expanded (true / false).
aria-controls points to the container with class "details".
The region uses role="region" and aria-labelledby for association.

Keyboard behavior: use Space or Enter to toggle the button (native to button element).