ComponentClient component

Collapsible

An expandable content region controlled by a trigger.

Installation

Preview

Three active branches

Updated a moment ago

main

feature/new-primitives

docs/registry

Usage

tsx

import {
  Collapsible,
  CollapsibleContent,
  CollapsibleTrigger,
} from "@/components/ui/collapsible"

<Collapsible>
  <CollapsibleTrigger>Toggle details</CollapsibleTrigger>
  <CollapsibleContent>Hidden content</CollapsibleContent>
</Collapsible>

API reference

Prop	Type	Default	Description
`defaultOpen`	`boolean`	`false`	Sets the initial uncontrolled state.
`open`	`boolean`	`—`	Controls the expanded state.
`className`	`string`	`—`	Overrides or extends the generated Tailwind classes.
`disabled`	`boolean`	`false`	Prevents user interaction when supported.