Browse components
Collapsible
Show-more region whose height, opacity and blur ease open smoothly, controlled or uncontrolled.
Installation
npx shadcn@latest add @glint-ui/collapsibleFirst time using @glint-ui? Add the registry to components.json once, or install by URL: npx shadcn@latest add https://glint-ui-seven.vercel.app/r/collapsible.json
Usage
import { Collapsible } from "@/components/ui/collapsible";
<Collapsible>
<CollapsibleTrigger>Show all items</CollapsibleTrigger>
<CollapsibleContent>...</CollapsibleContent>
</Collapsible>Props
| Prop | Type | Default | Description |
|---|---|---|---|
| defaultOpen | boolean | false | Initial open state when uncontrolled. |
| disabled | boolean | false | Disable the trigger. |
| open | ReactNode | — | Controlled open state (with onOpenChange). |
| onOpenChange | ReactNode | — | Called with the next open state. |
| className | string | — | Extra classes for the root element. |