Component Select

Select

A dropdown trigger that picks exactly one option from a list. Like combo_box but the trigger is not editable — it shows the current value (or the placeholder).

The caller owns a Entity<SelectState>.

Import

use yororen_ui::headless::select::{select, SelectState, SelectOption};

Minimal example

use yororen_ui::headless::select::{select, SelectState, SelectOption};
use gpui::Entity;

let select_state: Entity<SelectState> = cx.new(|cx| {
    let mut s = SelectState::new(cx);
    s.set_options(vec![
        SelectOption::new("light", "Light"),
        SelectOption::new("dark", "Dark"),
        SelectOption::new("system", "System"),
    ]);
    s.set_placeholder("Theme…");
    s.set_on_change({
        let entity = cx.entity();
        move |value: SharedString, _window, cx| {
            entity.update(cx, |s, _cx| s.theme = value.to_string());
        }
    });
    s
});

select("theme-picker", select_state).render(cx)

Props (state methods on &Entity<SelectState> via state.update(...) / state.read(...))

The headless select(id, state) factory takes the id and the state entity. All runtime control flows through methods on the state. The methods shown below are the 6 most common; the full list is in the source.

Method	Purpose
new(app)	Mint a fresh state. Returns Entity<Self>.
open() / close() / toggle()	Show or hide the dropdown.
is_open() / is_visible()	Current state.
set_value(v)	Programmatically pick a value.
set_options(opts)	Replace the option list.
set_placeholder(p)	Hint shown when no value is picked.
set_on_change(f)	Fn(SharedString, &mut Window, &mut App) + 'static + Send + Sync.
highlight(i) / highlight_next() / highlight_prev()	Move the highlighted option.
pick(value, w, cx)	Pick value (a SharedString). The value arg is mandatory.
select_highlighted(w, cx)	Pick whatever option is currently highlighted.

Notes

• Factory takes (id, state: Entity<SelectState>).
• .render(cx) is one-arg and returns Stateful<Div>.
• For an editable variant (type to filter), use ComboBox instead.
• set_options(...) takes a Vec<SelectOption> (built with SelectOption::new(value, label)), not Vec<SharedString>.
• To disable an individual option, chain .disabled(true) on the SelectOption value.

See also

ComboBox, Listbox, RadioGroup, Form