All components
Collapsible
Show and hide a region of content behind a trigger, with a bare content slot to style freely.
Custom domains, edge caching, and preview deployments are configured per environment.
Install
zsh — collapsible
1bunx stylexblocks add collapsibleUsage — Ark UI
collapsible.tsx
1234567891011121314151617import { Collapsible } from "#components/ui/ark-ui/collapsible.tsx";import { Button } from "#components/ui/ark-ui/button.tsx";
export function Example() { return ( // the machine wires the trigger and animates the content; the content // slot is deliberately bare — style it freely via the style prop <Collapsible.Root defaultOpen> <Collapsible.Trigger asChild> <Button variant="surface">Show advanced options</Button> </Collapsible.Trigger> <Collapsible.Content> Custom domains, edge caching, and preview deployments. </Collapsible.Content> </Collapsible.Root> );}