Collapsible

An interactive component which expands/collapses a panel.

Default

Click the trigger to toggle content visibility.

This content can be shown or hidden by clicking the trigger above.

Open by default

Start with the content visible.

This content starts visible and can be collapsed.

Disabled

A disabled collapsible that cannot be toggled.

This content is hidden and cannot be revealed.

Usage

julia

using Suite

Collapsible(
    CollapsibleTrigger(
        Button(variant="outline", "Toggle"),
    ),
    CollapsibleContent(
        Div("Hidden content revealed on click"),
    ),
)

API Reference

Collapsible

Prop	Type	Default	Description
open	Bool	false	Start with content visible
disabled	Bool	false	Prevent toggling
class	String	""	Additional CSS classes

CollapsibleTrigger

Prop	Type	Default	Description
children...	Any	-	Trigger content (typically a button)
class	String	""	Additional CSS classes

CollapsibleContent

Prop	Type	Default	Description
children...	Any	-	Content to show/hide
class	String	""	Additional CSS classes