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

Default

Collapsible is a component that allows you to show or hide content with a click. It can be used to create expandable sections in your UI.

Controlled

You can control the open state of the collapsible component by using the open and onOpenChange props. This allows you to programmatically show or hide the content.