Skip to content
aq-ui
Back to ComponentsComponent

Collapsible

Open-code aq-ui accessible component family for Collapsible.

Preview

This is a live example. Interact with the available controls and use the keyboard to inspect the component's states and behavior.

Loading interactive preview…

Installation

pnpm dlx aq-ui@alpha add collapsible

API reference

Client module

Import the parts you need, then jump to an export for its contract.

View full source

Quick start

"use client"

import { Collapsible } from "@/components/ui/collapsible"

<Collapsible />

Collapsible

constSource L7

Open-code aq-ui accessible component family for Collapsible.

const Collapsible = React.forwardRef<React.ComponentRef<typeof CollapsiblePrimitive.Root>, CollapsiblePrimitive.Root.Props>(…)
Props type
CollapsiblePrimitive.Root.Props
<Collapsible />

CollapsibleContent

constSource L31

Content export for composing Collapsible.

const CollapsibleContent = React.forwardRef<React.ComponentRef<typeof CollapsiblePrimitive.Panel>, CollapsiblePrimitive.Panel.Props>(…)
Props type
CollapsiblePrimitive.Panel.Props
<CollapsibleContent />

CollapsibleTrigger

constSource L17

Trigger export for composing Collapsible.

const CollapsibleTrigger = React.forwardRef<React.ComponentRef<typeof CollapsiblePrimitive.Trigger>, CollapsiblePrimitive.Trigger.Props>(…)
Props type
CollapsiblePrimitive.Trigger.Props
<CollapsibleTrigger />

Package dependencies

@base-ui/react@^1.7.0

Files

  • components/ui/collapsible.tsx

Source