Combobox
Searchable Select — type to filter, Enter to choose.
ui form
Preview
Installation
npx slintcn@latest add comboboxUsage
import { Combobox, ComboboxItem } from "slintcn/components/combobox.slint";
Combobox {
items: [
{ label: "Apple", value: "apple" },
{ label: "Banana", value: "banana" },
{ label: "Cherry", value: "cherry" },
];
selected-index <=> picked;
query <=> query;
changed(i) => { /* … */ }
Button { text: "Pick a fruit"; } // trigger = @children
}Properties
items
in
[ComboboxItem]
Options shown in the popup; `value` is yours to use, slintcn only reads `label`.
selected-index
in-out
int
Two-way; index of the chosen item in `items`, or -1 for no selection.
query
in-out
string
Two-way; current text in the search field. Reset to "" to clear the filter.
highlighted-index
in-out
int
Row highlighted by Enter; consumers rarely set this directly.
placeholder
in
string
Hint shown in the search field when empty.
content-width
in
length
Pixel width of the popup panel.
changed
callback
(int)
Fired with the chosen item's index when selected.
API
Accessibility
focusableyeskeyboardtext entryArrow keysEnterEscapedismissesDependencies
Installed automatically as transitive dependencies of slintcn add combobox.