Live demo

Generative-UI runtime

The engine behind tool-ui: tool-call payloads are matched to registered components and rendered to the DOM. Pure native ESM, zero dependencies. Open DevTools → Console for [toolui] and [runtime] breadcrumbs. Read the docs →

1 · Matched render

A weather payload is dispatched and the registered weather component renders it.

2 · JSON fail-safe

An unrecognized payload matches nothing, so the dispatcher falls back to a pretty-printed JSON card — the UI never crashes.

3 · Approval round-trip

An approval payload renders Approve/Reject. Choosing one resolves a promise and fires a receipt (POST attempted + toolui:receipt event).

Receipt log: —

4 · Reasoning toggle

A collapsible reasoning block for an assistant turn.

5 · Suggestion chips

Tappable chips fill the composer below and emit suggestion:pick.

6 · ThreadList

Switch conversations (in-memory + localStorage). Emits thread:select.

Selected: —

Branch picker

Step through alternate message versions. Emits branch:change.

Branch: —