# Collapsible (/docs/collapsible)

An accessible disclosure region with animated content and composable triggers.

## Install

```bash
npx shadcn@latest add https://4af.selfsimilar.dev/r/collapsible.json
```

## Usage

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

<Collapsible>
  <CollapsibleTrigger>Details</CollapsibleTrigger>
  <CollapsibleContent>More information.</CollapsibleContent>
</Collapsible>
```

## API

**Main exports:** `Collapsible`, `CollapsibleTrigger`, `CollapsibleContent`

A Base UI disclosure in `plain` or `card` appearance. `CollapsibleTrigger` places its chevron
with `chevron="end"` (default) or `"start"`, or hides it with `chevron={false}`.

Plain triggers use the compact 6px radius; card triggers use 8px.

## Motion

The panel animates its height, so content below it moves with the disclosure rather than
jumping. This is a documented exception to compositor-only motion, alongside Sidebar. The content
inside fades and blurs in and out.