Playground GitHub npm

Collapsible

Single show/hide section — trigger toggles the body.

ui display

Preview

Installation

npx slintcn@latest add collapsible

Usage

import { Collapsible } from "slintcn/components/collapsible.slint";

Collapsible {
    title: "Advanced settings";
    open <=> show-advanced;
    toggled(o) => { /* … */ }
    // body content
    Text { text: "Hidden by default; click the title to reveal."; }
}

Properties

title in string

Trigger label shown next to the chevron.

open in-out bool

Two-way; when true, `@children` are visible.

toggled callback (bool)

Fired with the new `open` value after a toggle click.

API

Accessibility
focusableno

Dependencies

iconlucide-paths

Installed automatically as transitive dependencies of slintcn add collapsible.