SearchList
A search field over rows: typing filters, arrows move, Enter picks.
Group: Inputs · Kind: native · in the lite catalog
Preview
Section titled “Preview”Platforms
Section titled “Platforms”The same specimen painted by React, SwiftUI, Compose and gpui.
| Prop | Type | Required | Bindable | Description |
|---|---|---|---|---|
items |
[searchItem] |
yes | yes | The rows; refill on search. |
query |
string |
– | yes | The input text. |
placeholder |
string |
– | – | The placeholder. Default "$string.search". |
value |
string |
– | yes | The picked value (a check). |
emptyText |
string |
– | – | Shown on no match. Default "$string.noResults". |
maxRows |
number |
– | – | Rows before it scrolls. Default 8. |
showCount |
boolean |
– | – | A count while typing. Default true. |
Events
Section titled “Events”on.search: runs an actionon.select: runs an action
None.
Children
Section titled “Children”none
A2UI basic mapping
Section titled “A2UI basic mapping”No basic catalog component maps here.
Built from
Section titled “Built from”A native component: every renderer paints it directly.
Accessibility
Section titled “Accessibility”Role: combobox
combobox (the input) controlling a listbox of options; the highlighted row = aria-activedescendant, the count a polite status
| Keys | Action |
|---|---|
| – | Focus stays in the input |
ArrowDown ArrowUp |
move the highlighted row (no wrap, no animation) |
Enter Tab |
pick the highlighted row (fires select) |
Typing |
filters; the top row is highlighted again |
Theming
Section titled “Theming”Recipe parts: SearchList/root SearchList/head SearchList/search SearchList/count SearchList/list SearchList/item SearchList/icon SearchList/identifier SearchList/label SearchList/check SearchList/empty SearchList/fade
Keyed by: :hover :pressed :focus :disabled :checked :open :selected :invalid :dragover
Related
Section titled “Related”Form · FieldGroup · FormActions · Input · Textarea · NumberField · Checkbox · Radio