Module search_field 

SearchField — a TextInput preset configured for search workflows: leading magnifier glyph, default-on clear-X, and an optional anchored suggestions popover with keyboard navigation and the ARIA combobox-with-listbox accessibility pattern. The popover is shown via OverlayRequest so it floats above sibling content and escapes ancestor clipping (same pattern as ComboBox).

let query = ctx.signal(String::new());
SearchField::new(query.clone())
    .placeholder("Search documents")
    .with_suggestions(|prefix| {
        FRUITS.iter()
            .filter(|f| f.to_lowercase().starts_with(&prefix.to_lowercase()))
            .map(|s| s.to_string())
            .collect()
    })
    .on_select(|value, _ctx| println!("picked: {value}"))
    .on_submit_fn(|ctx| ctx.send_intent(AppIntent::Search))

Design — comparison with searchable ComboBox

A searchable ComboBox and a SearchField are visually similar but semantically different:

• ComboBox is a value picker — the bound state is the selected item from a known list. The text input is a transient filter, embedded inside the dropdown popup; the closed combo shows the selected value, not the user’s query.
• SearchField is a query input — the bound state is the query string itself. The text input is always visible at the top level; suggestions are completion hints, not the source of truth. The bound Signal<String> keeps whatever the user typed, even if no suggestion matches.

The two share the same dropdown-of-options machinery in spirit; a future refactor could lift a common OverlayList<T> primitive out of both. For now they’re separate so each can keep a small API surface tuned to its semantics.

Accessibility

The field is Role::SearchInput with HasPopup::Listbox and AutoComplete::List. When the popup is open it advertises set_expanded(true) and set_controls(listbox_id) (mapped to accesskit::NodeId via widget_id_to_node_id). Each row is Role::ListBoxOption with set_selected(is_highlighted), set_position_in_set(idx + 1), and set_size_of_set(total) so screen readers can announce “Apple, 1 of 5”.

Structs

SearchField

A search input with optional inline suggestions popup.