Collapsible
An interactive component that expands and collapses content.
Installation
dotnet add package Lumeo
One-time app setup (AddLumeo(), CSS & JS) is covered in the
installation guide.
Usage
@using Lumeo <Collapsible />
When to Use
- Showing and hiding optional content such as advanced settings or extra details
- Expandable sidebar sections for navigation grouping
- Spoiler text or progressive disclosure where content is hidden by default
Starred Repositories
This section was initially expanded and can be toggled open and closed.
When Disabled, the trigger is inert (aria-disabled) and the open state can no longer be toggled by the user.
API Reference
Collapsible
IsOpen / IsOpenChanged are deprecated aliases for Open / OpenChanged and will be removed in a future release.
CollapsibleTrigger
CollapsibleContent
Styling hooks (data-state)
The collapsible root, trigger, and content expose a data-state
of open or
closed (and
data-disabled when disabled), so a chevron or
panel can animate from CSS with data-[state=open]:…
rather than watching the bound flag.