Collapsible
Collapsible
A Radix Collapsible — a single expandable/collapsible section (for a set of mutually-exclusive ones, see Accordion).
import { Collapsible, CollapsibleTrigger, CollapsibleContent } from "@pompeitech/vesuvius-ui";Default
Starred repos
@radix-ui/primitives
API
Collapsible
| Prop | Type | Default | Description |
|---|---|---|---|
open | boolean | Controlled open state. | |
defaultOpen | boolean | false | Initial state, uncontrolled. |
onOpenChange | (open: boolean) => void | ||
disabled | boolean | false |
CollapsibleTrigger — every native <button> prop, plus asChild (boolean, default false) to render on a single child instead of a <button>.
CollapsibleContent — every native <div> prop. Animates open/closed height via CSS custom properties Radix sets (--radix-collapsible-content-height), not JavaScript. Stays mounted (hidden) after closing by default unless forceMount is used elsewhere in your composition.
Accessibility
The trigger is a real <button> with aria-expanded, and content is linked to it via aria-controls — no custom keyboard handling needed, Tab then Space/Enter operates it like any button.