HTML previews in chat

Last updated: 2026-09-19

On iOS, an agent can show an interactive HTML file directly in a workspace chat. The file is loaded when you first open the sheet or expand the card; collapsed cards do not fetch their HTML. Closing and reopening reuses the loaded preview.

Save the file inside the workspace and reference it on its own line:

visualize{"path":"output/preview.html","title":"Preview"}

An absolute path inside the same workspace also works. The file is read from the device serving that workspace. HTML files outside the workspace cannot be loaded. The file must be HTML or HTM text, at most 1 MiB.

Tap the title or globe to open the preview sheet; tap its leading X to close. The sheet opens at full height and shows only the preview title. The page always gets the whole visible area as its viewport, so height: 100% and 100vh layouts fill the sheet or the expanded card. The chevron on the right expands or collapses the HTML inline. The card uses the selection fill and a tilted globe. Interactive state survives switching between inline and sheet views. A missing or unavailable file shows Retry; an empty file shows Preview is empty. Retry after reconnecting the host or restoring the file. Code-fenced markers stay visible as examples.

Add "mode":"wide" for a horizontally scrollable layout at least 1,024 points wide. Omit it for a responsive layout that fits the phone.

Previews support HTML, CSS, and JavaScript in an isolated session. They do not share browser sign-ins or access RepoGo's native actions. Static dependencies may load from cdnjs.cloudflare.com, esm.sh, cdn.jsdelivr.net, unpkg.com, fonts.googleapis.com, fonts.gstatic.com, and fonts.bunny.net. API requests, forms, navigation, and local sibling-file resources are not supported.

Include the styles and scripts the file needs. The preview supplies basic layout styles, but does not include another application's visualization runtime or host globals such as window.openai, Tweak, or Lucide.

Workspace custom tab#

On iOS, add .repogo/tab.json to show a workspace HTML page beside Browser and Terminal:

{
  "label": "Dashboard",
  "path": "docs/dashboard.html",
  "icon": {
    "ios": "chart.bar.fill"
  }
}

The path is relative to the workspace root. The optional icon.ios value is an SF Symbol name, used in the preview tabs and inspector picker. Missing or unavailable symbols use the existing default icon. The icon object also accepts android and web strings, but those platforms do not currently read this custom tab manifest or render those icons.

To ship several pages, list them under tabs. The top-level label and icon name the tab itself (defaulting to "Pages"); each entry names a row. The tab then opens as a list, and tapping a row pushes that page:

{
  "label": "Pages",
  "icon": { "ios": "doc.richtext" },
  "tabs": [
    { "label": "Dashboard", "path": ".repogo/dashboard.html", "icon": { "ios": "chart.bar.xaxis" } },
    { "label": "Runbook", "path": ".repogo/runbook.html", "icon": { "ios": "book" } },
    { "label": "Metrics", "path": ".repogo/metrics.html" }
  ]
}

A tabs list with one entry behaves like the single-page form and opens straight into the page.

File citations#

An inline :codex-file-citation{path="apps/resources/report.pdf" purpose="output"} renders as a tappable filename with a document icon. It uses the normal workspace file-link handler. Absolute paths use file URLs; relative paths remain relative. purpose does not grant additional file access. Citations inside code spans or code blocks remain literal, and incomplete citations have no file tap target.

HTML files in the file viewer#

The file viewer also runs embedded JavaScript in HTML previews, with a private web session. Ordinary view updates preserve interactive state; changing the HTML or opening a different file reloads the document. Closing the viewer ends that preview session.