GPUI Box GitHub

Components / controls

Combobox view

A Select you can type into.

A view survives a frame. Hold it in an Entity with cx.new(..) and reach it with .update(..).

use gpui_kit::controls::combobox::Combobox;

Reviewed in touch-pickers touch-pickers-open form.

Construct
new(ident: impl Into<Ident>, window: &mut Window, cx: &mut Context<Self>) -> Self
Options

Chain onto the value.

options(options: impl IntoIterator<Item = SelectOption>) -> Self
presentation(presentation: popover::PickerPresentation) -> Self
selected(id: impl Into<SharedString>) -> Self
name(name: impl Into<SharedString>) -> Self
placeholder(placeholder: impl Into<SharedString>) -> Self
invalid(invalid: bool) -> Self
allow_custom(allow_custom: bool) -> Self
Commands

Need a Context, so they need a view.

set_presentation(presentation: popover::PickerPresentation, cx: &mut Context<Self>)
set_name(name: impl Into<SharedString>, cx: &mut Context<Self>)
set_invalid(invalid: bool, cx: &mut Context<Self>)
set_options(options: Vec<SelectOption>, cx: &mut Context<Self>)
set_selected(id: Option<SharedString>, cx: &mut Context<Self>)
set_query(text: impl Into<SharedString>, cx: &mut Context<Self>)
set_placeholder(placeholder: Option<SharedString>, cx: &mut Context<Self>)
set_allow_custom(allow: bool, cx: &mut Context<Self>)
set_control_size(size: ControlSize, cx: &mut Context<Self>)
set_disabled(disabled: bool, cx: &mut Context<Self>)
open(cx: &mut Context<Self>)
toggle(window: &mut Window, cx: &mut Context<Self>)
Queries

Only answer; they change nothing.

selected_id() -> Option<&SharedString>
selected_option() -> Option<&SelectOption>
is_open() -> bool
query_text(cx: &App) -> SharedString
query_input() -> &Entity<TextInput>
is_disabled() -> bool
Reports

The variants of the event it emits. It never applies the change itself.

  • QueryChanged
  • Selected
  • Custom
  • Opened
  • Closed
Example · touch-pickers
fn touch_pickers(window: &mut Window, cx: &mut App) -> AnyElement {
    use crate::overlay::popover::PickerPresentation;
    if !cx.has_global::<TouchPickers>() {
        let options: Vec<_> = (1..=12)
            .map(|id| {
                SelectOption::new(format!("item-{id}"), format!("Fixture choice {id}"))
                    .disabled(id == 3)
            })
            .collect();
        let select = cx.new(|cx| {
            Select::new("scene.touch.select", window, cx)
                .name("Choose one")
                .options(options.clone())
                .selected("item-2")
                .clearable(true)
                .control_size(ControlSize::Touch)
                .presentation(PickerPresentation::Bottom)
        });
        let search = cx.new(|cx| {
            Combobox::new("scene.touch.search", window, cx)
                .name("Search choices")
                .options(options.clone())
                .control_size(ControlSize::Touch)
                .presentation(PickerPresentation::Bottom)
        });
        let multi = cx.new(|cx| {
            MultiSelect::new("scene.touch.multi", window, cx)
                .name("Choose several")
                .options(options)
                .selected(["item-2", "item-5"])
                .control_size(ControlSize::Touch)
                .presentation(PickerPresentation::Bottom)
        });
        cx.set_global(TouchPickers {
            select,
            search,
            multi,
        });
    }
    let theme = cx.theme().clone();
    let pickers = cx.global::<TouchPickers>();
    stack(&theme)
        .w(px(390.0))
        .max_w_full()
        .child(caption(
            &theme,
            "Bottom picker fixtures · choices remain caller-owned",
        ))
        .child(pickers.select.clone())
        .child(pickers.search.clone())
        .child(pickers.multi.clone())
        .into_any_element()
}

Source: crates/gpui-kit/src/controls/combobox.rs