Skip to main content

search_bar

tessera_components::search

Function search_bar 

Source 
pub fn search_bar() -> SearchBarBuilder
Expand description

Show a full-screen search bar that expands to display results.

§Usage

Use for immersive search flows where results take over the screen.

§Parameters

  • modifier - modifier chain applied to the search bar container.
  • enabled - whether the input is enabled.
  • read_only - whether the input is read-only.
  • is_active - whether the search bar is currently expanded.
  • placeholder - input hint and accessible name for the search field.
  • leading_icon - optional leading icon slot.
  • trailing_icon - optional trailing icon slot.
  • on_query_change - optional callback for query changes.
  • on_search - optional callback invoked when the query is submitted.
  • on_active_change - optional callback invoked when active state changes.
  • shape - shape used for the search input.
  • colors - search bar color configuration.
  • results_container_color - results surface color, matching the input by default.
  • tonal_elevation - tonal elevation for the search container.
  • shadow_elevation - shadow elevation for the search container.
  • dropdown_shape - shape used for docked result surfaces.
  • dropdown_gap - gap between a docked field and its results.
  • show_divider - show the results divider; disable for separated contained surfaces.
  • content_padding - padding inside the result surface.
  • controller - optional external controller for active/query state.
  • content - optional results content slot.

§Examples

use tessera_components::search::search_bar;
material_theme()
    .theme(|| MaterialTheme::default())
    .child(|| {
        search_bar().is_active(true).content(|| {});
    });