Agent work

Web search

Search results with readable citations, metadata, and progressive state.

Web search — gpui-ai

Starts when it scrolls into view

NORD FROST · DARK · RADIUS 6/10 · BASE 16PX · SHADOW

Running the real component, compiled to WebAssembly. The frame is 161 px tall, which is what this story measures at the demo width in the default type size — a narrower column or a theme that changes that size will wrap it differently.

Type: SearchResults
Source: search_results.rs
Story: search
Demo height: 161 px
Events: SearchResultsEvent

Code

Cut from the gallery story this page runs, so it stays true.

crates/gallery/src/gallery.rsOpen in the gallery Implementation

SearchResults::new("search", "alpenrose wholesale pricing")
    .searching(self.sim.answer.is_streaming())
    .results(if self.sim.answer.is_streaming() {
        Vec::new()
    } else {
        vec![
            SearchResult::new(
                "alpenrose-wholesale",
                "Alpenrose Dairy — Wholesale Programs",
            )
            .domain("alpenrose.com"),
            SearchResult::new(
                "dairy-price-index",
                "2026 Dairy Supplier Price Index",
            )
            .domain("dairyreport.org"),
            SearchResult::new(
                "portland-distributors",
                "Portland-area distributors compared",
            )
            .domain("nwfoodtrade.com"),
        ]
    })
    .on_event(cx.listener(|_, event: &SearchResultsEvent, _, _| {
        println!("search event: {event:?}");
    }))

Events and ownership

Who owns the state: SearchResults renders state supplied by the application; it does not own durable work.
What it emits: Interactive intent is reported through the typed SearchResultsEvent contract and stable application IDs.
What it means: Search results with readable citations, metadata, and progressive state.
Overflow and motion: Wide content retains context in a bounded surface; reduced motion preserves a useful state.

Event types

SearchResultsEvent

What the demo does and does not show

The demo above is the same Rust as the native component, compiled to WebAssembly and drawn on a WebGPU canvas — not a mock-up, a recording, or a re-implementation. What it paints is what the component paints: layout, colour from the live theme, and motion.

The live browser specimen requires WebGPU; the native component remains the authoritative runtime.

A canvas cannot stand in for the platform, so treat everything that goes through the operating system as unproven here: keyboard handling and shortcuts, screen reader semantics, text input and IME, the clipboard, file drops, and the frame rate you would get on your own GPU. Judge those in a native build. If your browser has no WebGPU, the frame says so rather than showing an empty box.