Web search
The agent's web searches as a trail — each query and what came back, each page read, skimmed or skipped and why, and an answer whose citations light their pages.
Web search shows an agent researching out loud. Each query is a row with how many results came back and how long it took; a query that finds nothing is asked again in other words. Under each query sit the pages it opened, each marked Read, Skimmed, or Skipped with the reason (paywall, blocked, timeout). Once the run is done the trail folds to one line and the answer streams in, its bracketed numbers pointing back at the pages that back them up.
Usage
<!-- include core.css + web-search.css, then the component script -->
<div class="card bare" data-c="web-search">
<div class="stage-in">
<div class="wsx panel">
<button class="wsx-h" aria-expanded="true">
<span class="wsx-ic"><span class="spin"></span></span>
<span class="wsx-st shim">Searching the web</span>
<span class="wsx-marks" aria-hidden="true"></span>
</button>
<div class="fold wsx-fold"><div><div class="wsx-list"></div></div></div>
<div class="wsx-ans"></div>
<p class="wsx-sr" role="status"></p>
</div>
</div>
</div>Properties
| Name | Type | Description |
|---|---|---|
queries | WebQuery[] | The searches, in order. Each has a key, the query text, a status, a result count, a time, an optional rewritten flag, and its pages. |
done | boolean | True once searching and reading are over. The trail folds to its summary line. |
answer | string | The answer, with sources cited as numbers in brackets. Each number points at the page with that cite value. |
open | boolean | Whether the trail is open. Left out, it folds once done turns true. |
onOpenChange / openChange | callback | Fires when the trail is opened or closed. |
bare | boolean | Without the panel, for a chat stream. True by default. |
A WebPage has a title, a domain, an optional date, a status (reading, read, skimmed,
paywall, blocked, or timeout), and an optional cite number the answer refers to it by.
Theming
Works in light and dark (data-theme="dark") and in the Soft style (data-style="soft"). Skipped
pages dim and their tag turns amber; a running page shows a spinner. The site initials stack on the
header, and hovering a citation lights the page that backs it up along with its site mark.