benchflow 0.7.6.dev2096__tar.gz → 0.7.6.dev2102__tar.gz

{benchflow-0.7.6.dev2096 → benchflow-0.7.6.dev2102}/CHANGELOG.md

@@ -2,6 +2,47 @@
 
 ## [Unreleased]
 
+### Added
+- **ACP rollout directories render as an interactive reviewer page.**
+  `bench eval view <rollout>` now assembles a JSON payload (normalized
+  events + result/timing/verifier metadata) and renders it client-side in a
+  self-contained template (no build step, zero network requests): full
+  event stream with collapse instead of truncation, harness/model/skills
+  identity row, reward badge and `result.json` failure-diagnostic banners,
+  Verifier and Metrics tabs, Focus/Full modes, per-kind filters and hues,
+  text search, and per-event `#e42` anchors. Trajectory content is treated
+  as untrusted end to end (data-only embedding, `textContent` rendering).
+  Raw session JSONL files and legacy `turn*.txt` runs remain supported, and
+  the `--confirm` approve/reject contract remains compatible.
+- **Directories of rollouts serve a run catalog.** Pointing
+  `bench eval view` at a job directory (or a whole `jobs/` tree) serves a
+  browsable index: corpus counts, grouping by task or model + harness with
+  per-group pass/fail aggregates and pass rates, sorting by
+  name/reward/duration/cost, text filtering, collapsible groups with
+  incremental pagination, and URL-preserved state — selecting a run opens
+  the detail page and the back control restores the exact catalog view.
+  Traces load dynamically from `/api/rollout?id=…` (ids resolve only by
+  exact membership in a fresh directory scan, so crafted ids cannot reach
+  the filesystem) and `?run=<id>` deep-links a run. `--confirm` on a
+  multi-run directory errors out: a confirmation needs exactly one
+  trajectory.
+- **`hf://` sources browse HuggingFace trajectory datasets directly.**
+  `bench eval view hf://<org>/<dataset>[@revision][/subpath]` fetches the
+  viewer-relevant slice of a trajectory dataset into the shared
+  `huggingface_hub` cache and serves it through browse mode, making the
+  community ground-truth uploads reviewable with one command. The download
+  allowlist is exact — trajectories, result/timing/prompts, and the four
+  verifier sidecars the viewer renders — with no wildcards, so large run
+  artifacts and `llm_trajectory`/`trainer` exports are never fetched. The
+  CLI passes the spec as a string into a typed
+  `LocalPathSource | HfDatasetSource` parser (never through `pathlib.Path`,
+  whose normalization would mangle `hf://` into `hf:/`), and dataset
+  subpaths are validated.
+- **The viewer renders per-event timelines the moment captures provide
+  timestamps.** Steps gain a `+m:ss` offset chip and tool calls a duration
+  chip whenever events carry `ts` / `started_at` / `finished_at` fields;
+  with today's captures (which carry none) nothing changes visually.
+
 ## 0.7.5 — 2026-08-19
 
 ### Added

{benchflow-0.7.6.dev2096 → benchflow-0.7.6.dev2102}/PKG-INFO

@@ -1,6 +1,6 @@
 Metadata-Version: 2.5
 Name: benchflow
-Version: 0.7.6.dev2096
+Version: 0.7.6.dev2102
 Summary: Multi-turn agent benchmarking with ACP — run any agent, any model, any provider.
 Project-URL: Homepage, https://github.com/benchflow-ai/benchflow
 Project-URL: Repository, https://github.com/benchflow-ai/benchflow
@@ -45,6 +45,7 @@ Requires-Dist: deepagents>=0.6; extra == 'deepagents'
 Requires-Dist: langchain-openai>=0.2; extra == 'deepagents'
 Provides-Extra: dev
 Requires-Dist: pathspec>=0.12; extra == 'dev'
+Requires-Dist: playwright>=1.49; extra == 'dev'
 Requires-Dist: pre-commit>=3.7; extra == 'dev'
 Requires-Dist: pytest-asyncio>=0.24.0; extra == 'dev'
 Requires-Dist: pytest>=9.0.3; extra == 'dev'

{benchflow-0.7.6.dev2096 → benchflow-0.7.6.dev2102}/pyproject.toml

@@ -1,6 +1,6 @@
 [project]
 name = "benchflow"
-version = "0.7.6.dev2096"
+version = "0.7.6.dev2102"
 description = "Multi-turn agent benchmarking with ACP — run any agent, any model, any provider."
 readme = "README.md"
 requires-python = ">=3.12"
@@ -61,6 +61,11 @@ dev = [
     "pathspec>=0.12",
     "pytest>=9.0.3",
     "pytest-asyncio>=0.24.0",
+    # Browser-level viewer tests (tests/trajectories/test_viewer_browser.py):
+    # drives the interactive template in real Chromium. Tests self-skip when
+    # playwright or its browser binary is absent, so plain `pytest tests/`
+    # stays runnable without `playwright install chromium`.
+    "playwright>=1.49",
     "ruff>=0.7.0",
     "ty>=0.0.1a1",
 ]
@@ -154,6 +159,7 @@ testpaths = ["tests"]
 markers = [
     "live: requires real Anthropic API and Docker daemon (run with -m live)",
     "integration: full integration tests — requires GEMINI_API_KEY + DAYTONA_API_KEY (run with -m integration)",
+    "browser: drives the viewer template in real Chromium via Playwright (self-skips without playwright/chromium; deselect with -m 'not browser')",
 ]
 
 [tool.ruff]

{benchflow-0.7.6.dev2096 → benchflow-0.7.6.dev2102}/src/benchflow/cli/main.py

@@ -1251,9 +1251,15 @@ def eval_metrics(
 @eval_app.command("view")
 def eval_view(
     rollout_dir: Annotated[
-        Path,
+        # A str, not a Path: hf:// specs must arrive verbatim — Path
+        # normalization would collapse the double slash into hf:/.
+        str,
         typer.Argument(
-            help="Rollout directory, job directory, or trajectory JSONL file"
+            help=(
+                "Rollout directory, job directory, trajectory JSONL file, or "
+                "an hf://<org>/<dataset> trajectory dataset "
+                "(optionally with /subpath)"
+            )
         ),
     ],
     port: Annotated[int, typer.Option(help="Server port")] = 8888,
@@ -1285,7 +1291,7 @@ def eval_view(
     from benchflow.trajectories import viewer
 
     decision = viewer.serve(
-        str(rollout_dir), port, confirm=confirm, redaction_summary=redaction_summary
+        rollout_dir, port, confirm=confirm, redaction_summary=redaction_summary
     )
     # Exit-code contract for --confirm: 0 approved, 3 rejected. 3 is chosen
     # so a rejection never collides with the CLI's existing error exits

benchflow-0.7.6.dev2102/src/benchflow/trajectories/viewer/__init__.py

@@ -0,0 +1,77 @@
+"""Trajectory viewer package.
+
+Import surface preserved from the former single-module viewer: everything
+tests and the CLI reached via ``benchflow.trajectories.viewer`` re-exports
+here. See the sibling modules for the actual responsibilities.
+"""
+
+from .catalog import (
+    _discover_rollouts,
+    _resolve_browse_rollout,
+    _rollout_summary,
+    _runs_cap,
+)
+from .legacy import (
+    _NO_TRAJECTORIES_HTML,
+    _VIEWER_CSS,
+    _confirm_bar_html,
+    _inject_confirm_bar,
+    _tool_accent_class,
+    render_jsonl_file,
+    render_rollout,
+    render_turn,
+)
+from .payload import (
+    _DIAGNOSTIC_KEYS_FALLBACK,
+    _build_acp_payload,
+    _diagnostic_keys,
+    _is_acp_rollout_dir,
+    _load_prompts,
+    _parse_jsonl,
+    _safe_json,
+    _tool_content_texts,
+)
+from .render import _render_acp_trajectory, _render_shell
+from .server import serve
+from .sources import (
+    _HF_VIEWER_FILES,
+    HfDatasetSource,
+    LocalPathSource,
+    ViewerSourceError,
+    parse_source,
+    resolve_hf_dataset,
+)
+
+__all__ = [
+    # public surface
+    "render_rollout",
+    "render_turn",
+    "render_jsonl_file",
+    "serve",
+    "parse_source",
+    "resolve_hf_dataset",
+    "LocalPathSource",
+    "HfDatasetSource",
+    "ViewerSourceError",
+    # internals reached by tests and siblings through the historical module
+    "_DIAGNOSTIC_KEYS_FALLBACK",
+    "_HF_VIEWER_FILES",
+    "_NO_TRAJECTORIES_HTML",
+    "_VIEWER_CSS",
+    "_build_acp_payload",
+    "_confirm_bar_html",
+    "_diagnostic_keys",
+    "_discover_rollouts",
+    "_inject_confirm_bar",
+    "_is_acp_rollout_dir",
+    "_load_prompts",
+    "_parse_jsonl",
+    "_render_acp_trajectory",
+    "_render_shell",
+    "_resolve_browse_rollout",
+    "_rollout_summary",
+    "_runs_cap",
+    "_safe_json",
+    "_tool_accent_class",
+    "_tool_content_texts",
+]

benchflow-0.7.6.dev2102/src/benchflow/trajectories/viewer/__main__.py

@@ -0,0 +1,13 @@
+"""``python -m benchflow.trajectories.viewer <rollout_dir_or_jsonl> [port]``"""
+
+import sys
+
+from .server import serve
+
+if len(sys.argv) < 2:
+    print(
+        "Usage: python -m benchflow.trajectories.viewer <rollout_dir_or_jsonl> [port]"
+    )
+    sys.exit(1)
+port = int(sys.argv[2]) if len(sys.argv) > 2 else 8888
+serve(sys.argv[1], port)

benchflow-0.7.6.dev2102/src/benchflow/trajectories/viewer/assets/boot.js

@@ -0,0 +1,135 @@
+BF.navigation = (() => {
+  let generation = 0;
+  let request = null;
+  let loadedRun = null;
+  let selectedRun = null;
+
+  function beginTransition() {
+    generation += 1;
+    if (request) request.abort();
+    request = null;
+    BF.detail.cancel();
+    return generation;
+  }
+
+  function showCatalog(push) {
+    beginTransition();
+    loadedRun = null;
+    if (push) BF.catalog.writeURL(null, true);
+    BF.catalog.show({ focusRun: selectedRun });
+    document.title = "runs - benchflow trajectory";
+  }
+
+  async function openRun(runId, push, sourceButton = null) {
+    const index = document.getElementById("view-index");
+    if (!index.classList.contains("hidden")) BF.catalog.rememberScroll();
+    selectedRun = runId;
+    const transition = beginTransition();
+    loadedRun = null;
+    if (push) BF.catalog.writeURL(runId, true);
+    BF.core.showDetailShell(true);
+    BF.detail.showLoading(runId);
+
+    const controller = new AbortController();
+    request = controller;
+    try {
+      const response = await fetch("/api/rollout?id=" + encodeURIComponent(runId), {
+        signal: controller.signal,
+      });
+      if (!response.ok) throw new Error("HTTP " + response.status + " loading run " + runId);
+      const body = await response.text();
+      let payload;
+      try {
+        payload = JSON.parse(body);
+      } catch (error) {
+        throw new TypeError("malformed JSON from the rollout API: " + error.message);
+      }
+      BF.core.requirePayload(payload);
+      if (transition !== generation) return;
+      BF.detail.loadPayload(payload, { focusHeading: Boolean(sourceButton) });
+      loadedRun = runId;
+      window.scrollTo(0, 0);
+    } catch (error) {
+      if (controller.signal.aborted || transition !== generation) return;
+      BF.detail.showError("Failed to load run " + runId + ": " + error.message);
+    } finally {
+      if (transition === generation) request = null;
+    }
+  }
+
+  function showUnknownRun(runId) {
+    selectedRun = runId;
+    beginTransition();
+    loadedRun = null;
+    BF.core.showDetailShell(true);
+    BF.detail.showError(BF.catalog.unknownRunMessage(runId));
+  }
+
+  function applyLocation() {
+    const runId = BF.catalog.readURL();
+    if (runId && runId === loadedRun && !document.getElementById("content").classList.contains("hidden")) {
+      return;
+    }
+    if (runId && BF.catalog.hasRun(runId)) openRun(runId, false);
+    else if (runId) showUnknownRun(runId);
+    else showCatalog(false);
+  }
+
+  function startBrowse(boot) {
+    BF.catalog.init(boot, (runId, sourceButton) => openRun(runId, true, sourceButton));
+    const back = document.getElementById("backbtn");
+    back.addEventListener("click", () => showCatalog(true));
+    window.addEventListener("popstate", applyLocation);
+    applyLocation();
+  }
+
+  function startSingle(payload) {
+    beginTransition();
+    BF.core.showDetailShell(false);
+    try {
+      BF.detail.loadPayload(payload);
+    } catch (error) {
+      BF.detail.showError("The embedded trajectory payload is malformed: " + error.message, "viewer data error");
+    }
+  }
+
+  return { startBrowse, startSingle };
+})();
+
+(() => {
+  function bootError(message) {
+    BF.core.showDetailShell(false);
+    BF.detail.showError(message, "viewer data error");
+  }
+
+  const node = document.getElementById("bf-payload");
+  let boot;
+  try {
+    boot = JSON.parse(node ? node.textContent : "");
+  } catch (error) {
+    bootError("The embedded viewer data is not valid JSON: " + error.message);
+    return;
+  }
+  if (!BF.core.isRecord(boot)) {
+    bootError("The embedded viewer data must be a JSON object.");
+    return;
+  }
+  if (boot.mode === "single") {
+    BF.navigation.startSingle(boot.payload);
+    return;
+  }
+  if (boot.mode === "browse") {
+    if (!Array.isArray(boot.rollouts)) {
+      bootError("Browse-mode viewer data must contain a rollouts array.");
+      return;
+    }
+    const invalid = boot.rollouts.find((run) => !BF.core.isRecord(run) || typeof run.id !== "string" || !run.id);
+    if (invalid) {
+      bootError("A catalog entry is malformed: every rollout must be an object with a non-empty string id.");
+      return;
+    }
+    BF.navigation.startBrowse(boot);
+    return;
+  }
+  bootError('Unknown viewer mode: expected "single" or "browse".');
+})();

benchflow-0.7.6.dev2102/src/benchflow/trajectories/viewer/assets/catalog.js

@@ -0,0 +1,331 @@
+BF.catalog = (() => {
+  const { el, fmtDuration, fmtTokens } = BF.core;
+  const PAGE_SIZE = 100;
+  const GROUPERS = new Map([
+    ["task", (run) => run.task_name || "(unknown task)"],
+    ["agent", (run) => [run.agent_name, run.model].filter(Boolean).join(" \u00b7 ") || "(unknown agent)"],
+    ["none", () => ""],
+  ]);
+  const SORTS = new Map([
+    ["name", (left, right) => String((left.task_name || "") + (left.name || "")).localeCompare(String((right.task_name || "") + (right.name || "")))],
+    ["reward", (left, right) => (right.reward ?? -1) - (left.reward ?? -1)],
+    ["duration", (left, right) => (right.duration_sec ?? -1) - (left.duration_sec ?? -1)],
+    ["cost", (left, right) => (right.cost_usd ?? -1) - (left.cost_usd ?? -1)],
+  ]);
+
+  let rollouts = [];
+  let capped = false;
+  let onSelectRun = null;
+  const state = {
+    group: "task",
+    sort: "name",
+    query: "",
+    toggled: new Set(),
+    pages: new Map(),
+    scrollY: 0,
+  };
+
+  function init(boot, selectRun) {
+    rollouts = boot.rollouts.slice();
+    capped = Boolean(boot.capped);
+    onSelectRun = selectRun;
+  }
+
+  function runStatus(run) {
+    if (run.reward === null || run.reward === undefined) return "unscored";
+    return run.reward >= 1 ? "pass" : "fail";
+  }
+
+  function fmtCost(value) {
+    return typeof value === "number" && Number.isFinite(value) ? "$" + value.toFixed(2) : null;
+  }
+
+  function readURL() {
+    const params = new URLSearchParams(location.search);
+    const group = params.get("group");
+    const sort = params.get("sort");
+    state.group = GROUPERS.has(group) ? group : "task";
+    state.sort = SORTS.has(sort) ? sort : "name";
+    state.query = params.get("q") || "";
+    const decode = (value) => {
+      try { return decodeURIComponent(value); } catch { return value; }
+    };
+    state.toggled = new Set((params.get("toggled") || "").split(",").filter(Boolean).map(decode));
+    return params.get("run");
+  }
+
+  function writeURL(runId, push) {
+    const params = new URLSearchParams();
+    if (state.group !== "task") params.set("group", state.group);
+    if (state.sort !== "name") params.set("sort", state.sort);
+    if (state.query) params.set("q", state.query);
+    if (state.toggled.size) {
+      params.set("toggled", [...state.toggled].map(encodeURIComponent).join(","));
+    }
+    if (runId) params.set("run", runId);
+    const url = location.pathname + (params.toString() ? "?" + params.toString() : "");
+    history[push ? "pushState" : "replaceState"]({}, "", url);
+  }
+
+  function matchesQuery(run, query) {
+    if (!query) return true;
+    return [run.task_name, run.name, run.agent_name, run.model, run.skill_mode, runStatus(run)]
+      .filter(Boolean)
+      .join(" ")
+      .toLowerCase()
+      .includes(query);
+  }
+
+  function appendSelect(container, id, labelText, options, value, onChange) {
+    const label = el("label", null, labelText);
+    label.htmlFor = id;
+    const select = el("select");
+    select.id = id;
+    options.forEach(([optionValue, text]) => {
+      const option = el("option", null, text);
+      option.value = optionValue;
+      option.selected = optionValue === value;
+      select.appendChild(option);
+    });
+    select.addEventListener("change", () => {
+      onChange(select.value);
+      writeURL(null, false);
+      renderRuns();
+    });
+    container.append(label, select);
+  }
+
+  function renderIndex() {
+    const main = document.getElementById("view-index");
+    main.textContent = "";
+    const stats = el("div");
+    stats.id = "ixstats";
+    main.appendChild(stats);
+
+    const controls = el("div");
+    controls.id = "ixcontrols";
+    appendSelect(
+      controls,
+      "ixgroup",
+      "group",
+      [["task", "task"], ["agent", "model + harness"], ["none", "none"]],
+      state.group,
+      (value) => {
+        state.group = value;
+        state.pages.clear();
+      },
+    );
+    appendSelect(
+      controls,
+      "ixsort",
+      "sort",
+      [["name", "name"], ["reward", "reward"], ["duration", "duration"], ["cost", "cost"]],
+      state.sort,
+      (value) => { state.sort = value; },
+    );
+    const searchLabel = el("label", "visually-hidden", "Filter runs");
+    searchLabel.htmlFor = "ixsearch";
+    const search = el("input");
+    search.id = "ixsearch";
+    search.type = "search";
+    search.placeholder = "filter runs...";
+    search.value = state.query;
+    search.addEventListener("input", () => {
+      state.query = search.value;
+      state.pages.clear();
+      writeURL(null, false);
+      renderRuns();
+    });
+    controls.append(searchLabel, search);
+    main.appendChild(controls);
+
+    const list = el("div");
+    list.id = "ixruns";
+    main.appendChild(list);
+    renderRuns();
+  }
+
+  function renderStats(rows) {
+    const stats = document.getElementById("ixstats");
+    stats.textContent = "";
+    const counts = new Map([["pass", 0], ["fail", 0], ["unscored", 0]]);
+    rows.forEach((run) => counts.set(runStatus(run), counts.get(runStatus(run)) + 1));
+    const total = el("span");
+    total.appendChild(el("b", null, rows.length));
+    total.appendChild(document.createTextNode(
+      (rows.length === rollouts.length ? "" : " / " + rollouts.length)
+        + " runs"
+        + (capped ? " (capped - raise BENCHFLOW_VIEWER_MAX_RUNS)" : ""),
+    ));
+    stats.appendChild(total);
+    ["pass", "fail", "unscored"].forEach((status) => {
+      const item = el("span", null, status + " ");
+      item.appendChild(el("b", null, counts.get(status)));
+      stats.appendChild(item);
+    });
+  }
+
+  function focusGroup(key) {
+    const button = [...document.querySelectorAll(".group-head")]
+      .find((candidate) => candidate.dataset.groupKey === key);
+    if (button) button.focus({ preventScroll: true });
+  }
+
+  function renderRuns(groupToFocus = null) {
+    const list = document.getElementById("ixruns");
+    if (!list) return;
+    list.textContent = "";
+    const query = state.query.trim().toLowerCase();
+    const rows = rollouts.filter((run) => matchesQuery(run, query));
+    renderStats(rows);
+    if (!rows.length) {
+      const empty = el("div", null, rollouts.length ? "No runs match the filter." : "No runs found.");
+      empty.id = "ixempty";
+      list.appendChild(empty);
+      return;
+    }
+
+    const grouper = GROUPERS.get(state.group);
+    const groups = new Map();
+    rows.forEach((run) => {
+      const key = grouper(run);
+      if (!groups.has(key)) groups.set(key, []);
+      groups.get(key).push(run);
+    });
+    const keys = [...groups.keys()].sort((left, right) => left.localeCompare(right));
+    const defaultOpen = new Set(rollouts.map(grouper)).size <= 2;
+    const filtering = query !== "";
+
+    keys.forEach((key, groupIndex) => {
+      const members = groups.get(key).slice().sort(SORTS.get(state.sort));
+      const section = el("section", "group");
+      const body = el("div", "group-body");
+      body.id = "group-body-" + groupIndex;
+      const open = state.group === "none" || filtering || defaultOpen !== state.toggled.has(key);
+
+      if (state.group !== "none") {
+        const heading = el("button", "group-head");
+        heading.type = "button";
+        heading.dataset.groupKey = key;
+        heading.setAttribute("aria-expanded", open ? "true" : "false");
+        heading.setAttribute("aria-controls", body.id);
+        heading.appendChild(el("span", "chev", open ? "\u25be" : "\u25b8"));
+        heading.appendChild(el("span", "gname", key));
+        const groupCounts = new Map([["pass", 0], ["fail", 0], ["unscored", 0]]);
+        members.forEach((run) => groupCounts.set(runStatus(run), groupCounts.get(runStatus(run)) + 1));
+        const summary = el("span", "gstats");
+        summary.appendChild(el("span", null, members.length + " runs"));
+        if (groupCounts.get("pass")) summary.appendChild(el("span", "gpass", groupCounts.get("pass") + " pass"));
+        if (groupCounts.get("fail")) summary.appendChild(el("span", "gfail", groupCounts.get("fail") + " fail"));
+        if (groupCounts.get("unscored")) summary.appendChild(el("span", null, groupCounts.get("unscored") + " unscored"));
+        const scored = groupCounts.get("pass") + groupCounts.get("fail");
+        if (scored) summary.appendChild(el("span", null, Math.round(100 * groupCounts.get("pass") / scored) + "%"));
+        heading.appendChild(summary);
+        heading.addEventListener("click", () => {
+          if (state.toggled.has(key)) state.toggled.delete(key);
+          else state.toggled.add(key);
+          writeURL(null, false);
+          renderRuns(key);
+        });
+        section.appendChild(heading);
+      }
+
+      if (open) {
+        const extra = state.pages.get(key) || 0;
+        const limit = PAGE_SIZE + extra;
+        members.slice(0, limit).forEach((run) => body.appendChild(runRow(run)));
+        if (members.length > limit) {
+          const remaining = members.length - limit;
+          const more = el(
+            "button",
+            "showmore",
+            "Show " + Math.min(PAGE_SIZE * 2, remaining) + " more (" + remaining + " hidden)",
+          );
+          more.type = "button";
+          more.addEventListener("click", () => {
+            state.pages.set(key, extra + PAGE_SIZE * 2);
+            renderRuns();
+          });
+          body.appendChild(more);
+        }
+      }
+      section.appendChild(body);
+      list.appendChild(section);
+    });
+    if (groupToFocus !== null) focusGroup(groupToFocus);
+  }
+
+  function runRow(run) {
+    const status = runStatus(run);
+    const button = el("button", "runrow");
+    button.type = "button";
+    button.dataset.runId = run.id;
+    button.setAttribute("aria-label", "Open " + (run.task_name || run.name || run.id));
+    button.appendChild(el("span", "dot " + status));
+    const main = el("span", "rmain");
+    main.appendChild(el("span", "rtitle", state.group === "task" ? run.name : run.task_name));
+    const subtitle = el("span", "rsub");
+    if (state.group !== "agent") {
+      if (run.agent_name) subtitle.appendChild(el("span", null, run.agent_name));
+      if (run.model) subtitle.appendChild(el("span", null, run.model));
+    }
+    if (run.skill_mode) subtitle.appendChild(el("span", null, run.skill_mode));
+    if (run.has_error) subtitle.appendChild(el("span", null, "error"));
+    main.appendChild(subtitle);
+    button.appendChild(main);
+
+    const stats = el("span", "rstats");
+    stats.appendChild(el(
+      "span",
+      "rreward " + status,
+      status === "unscored" ? "\u2014" : (status === "pass" ? "pass" : "fail " + run.reward),
+    ));
+    const duration = fmtDuration(run.duration_sec);
+    if (duration) stats.appendChild(el("span", null, duration));
+    const tokens = fmtTokens(run.total_tokens);
+    if (tokens) stats.appendChild(el("span", null, tokens + " tok"));
+    const cost = fmtCost(run.cost_usd);
+    if (cost) stats.appendChild(el("span", null, cost));
+    button.appendChild(stats);
+    button.addEventListener("click", () => onSelectRun(run.id, button));
+    return button;
+  }
+
+  function show(options = {}) {
+    document.getElementById("content").classList.add("hidden");
+    const main = document.getElementById("view-index");
+    main.classList.remove("hidden");
+    renderIndex();
+    window.scrollTo(0, state.scrollY);
+    if (options.focusRun) {
+      requestAnimationFrame(() => {
+        const button = [...document.querySelectorAll(".runrow")]
+          .find((candidate) => candidate.dataset.runId === options.focusRun);
+        if (button) button.focus({ preventScroll: true });
+      });
+    }
+  }
+
+  function rememberScroll() {
+    state.scrollY = window.scrollY;
+  }
+
+  function hasRun(runId) {
+    return rollouts.some((run) => run.id === runId);
+  }
+
+  function unknownRunMessage(runId) {
+    return 'Run "' + runId + '" is not among the ' + rollouts.length + " discovered runs"
+      + (capped ? " (list is capped - raise BENCHFLOW_VIEWER_MAX_RUNS)." : ".");
+  }
+
+  return {
+    hasRun,
+    init,
+    readURL,
+    rememberScroll,
+    show,
+    unknownRunMessage,
+    writeURL,
+  };
+})();