# Select

> One value from a list, as a popup or a sheet.

`ui.Select[T]` chooses one of a list of values of any comparable type. The list opens under the trigger on every device; `Presentation: base.PresentSheet` opens it as a sheet from the bottom instead, as a phone app may want.

```go
size := core.NewSignal(cx, "m")
ui.Select[string]{
	Options: []ui.Option[string]{{Value: "s", Label: "Small"}, {Value: "m", Label: "Medium"}, {Value: "l", Label: "Large"}},
	Value:   size.Get,
	OnChange: size.Set,
	Label:   "Size",
}
```

## Options and search

`Options` are `ui.Option[T]`s, each with a `Value`, a `Label`, and an optional `Icon`, `Disabled` function or `Content` of the app's own. `Placeholder` shows while no option is chosen. `Searchable` filters the list by typing, `OnClear` shows a clear button, and `Disabled` stops it.

```go
ui.Select[string]{
	Options:  languages,
	Value:    language.Get,
	OnChange: language.Set,
	Searchable: true,
	SearchPlaceholder: "Search languages",
	OnClear:  func() { language.Set("") },
	Placeholder: "Choose a language",
}
```

## Behavior

Up, Down, Return and Space open the list from the focused trigger; arrows move the highlight and typeahead jumps by the items' titles. Choosing an item closes the list and reports its value. Escape, back and a press outside close it without a change. `Empty` is the text shown while search finds nothing.

## Accessibility

The trigger and list carry the select's roles; `Label` names the field, and the selected item is reported. The keyboard reaches the trigger with Tab and opens it with Return or Space.

## Platform

On macOS, Windows and Linux the list is a popup beside the trigger. On iOS and Android it is a sheet, and the selected row stays on the field. The same options and values work on every target.

## Related

- [Forms](https://nsgo.dev/docs/forms.md): selects in a form.
- [Menu](https://nsgo.dev/docs/ui/menu.md): commands rather than a value.
- [Tabs](https://nsgo.dev/docs/ui/tabs.md): a few options shown at once.
- The gallery's Select and Combobox pages.
- [Unstyled components](https://nsgo.dev/docs/authoring/base.md#select): `base.Select`, with groups and a trigger of your own.