Murasaki
Components

Collapsible

Expands or collapses a single section of content.

Usage

import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@murasakijs/ui'

<Collapsible>
  <CollapsibleTrigger>Advanced settings</CollapsibleTrigger>
  <CollapsibleContent>Settings shown on demand.</CollapsibleContent>
</Collapsible>

Use open and onOpenChange for controlled state, or defaultOpen for uncontrolled state. The trigger receives the correct expanded state and keyboard behavior from React Aria. Use Accordion instead when several related sections must coordinate their open state.

Exports

Collapsible, CollapsibleTrigger, and CollapsibleContent.

Improve this page on GitHub

On this page