render_markdown
Renders Markdown documents into deterministic, self-contained HTML with inline SVG diagrams from fenced archify JSON, plus theme/preset/quality audits and optional live-session verification.
Instructions
Render a markdown document into a deterministic, self-contained HTML artifact - the document layer, so the agent never writes HTML by hand. Prose rides a plain offline shell (no fonts, no scripts); archify fenced code blocks carry typed zero-coordinate diagram JSON (sequence, workflow, architecture, dataflow, lifecycle families) and render to inline SVG via the layout engine. Same input, same bytes: the receipt carries the sha256 so determinism is verifiable. theme picks light (default) or dark; preset picks the palette family — classic (default), signal-flow, blueprint, editorial — orthogonal to theme; colors bake at generation time (presentation attributes, not CSS variables), and the receipt records both preset and theme. quality picks the composition audit profile — standard (default) or showcase, the delivery gate: the receipt's diagrams[].composition grades route crossings, ambiguous corridors, label clearance (2px standard / 4px showcase), route rhythm, and node text projected to the 930px reader width; the audit never changes the artifact bytes. Mermaid sources are the agent's job to translate, not the engine's: flowchart/graph → workflow (lanes + columns), sequenceDiagram → sequence, stateDiagram-v2 → lifecycle (bands), erDiagram/class → architecture (grid + boundaries) — read the topology and emit the matching zero-coordinate archify JSON; the engine accepts only archify JSON. A broken diagram degrades to a visible code block and lands in receipt.diagnostics; an authored route preset that cannot be honored is self-repaired to a verified semantic substitute and disclosed in receipt diagrams[].repairs - the document still renders. A fence may also carry views: [{id,label,nodes,note?}] (node ids of the active family), emitted as guided-view tabs above the diagram plus an inlined viewer script - clicking a tab lights the member nodes and the routes between them (subgraph), clicking a node lights it with its direct neighbors (ego graph), everything else dims; a view's optional note shows as a caption while it is active (the story layer). window.agxViewer in a session drives and reads the same state programmatically: {focus,view,state} as before, plus route(i,from,to) which returns and lights the shortest authored directed path between two nodes (null when unreachable, state untouched), and reach(i,id,down|up) which returns and lights the authored downstream/upstream closure ({nodes,links}); both dim the rest of the diagram. diagrams[].views in the receipt lists the tabs. motion: true bakes an entrance choreography into the artifact: pure-declarative CSS animation with zero scripts - headings split into per-glyph (CJK) / per-word (latin) spans that rise in with expo easing, prose blocks stagger up an nth-child delay ladder, diagram figures grow in with a back ease (GSAP's easing math as public cubic-bezier equivalents, nothing embedded); the diagrams themselves play a flow story on the same clock - nodes land beat by beat, solid edges draw in (dash-offset), dashed returns fade, sequence messages arrive as sent - with a timed caption strip under each figure as the subtitles, which becomes a static transcript under prefers-reduced-motion; the file itself animates in any browser and the receipt records motion plus diagrams[].story (beat times and captions - the hook for muxing voice later). With session_id the artifact is also loaded into that session (local, free) and the reply carries viewport acceptance: scroll extents measured in the live session and graded fits/tall/wide/oversized, telling the agent how to read the page back. Diagram vocabulary adapted from archify (MIT).
Input Schema
| Name | Required | Description | Default |
|---|---|---|---|
| theme | No | Color theme: "light" (default) or "dark" — the shell background/ foreground and every SVG palette slot swap together; the receipt records which theme produced the bytes | |
| motion | No | Bake the entrance choreography into the artifact (default false): pure-declarative CSS animation — headings split into per-glyph/per- word spans that rise in with expo easing, prose blocks stagger up a nth-child delay ladder, and diagram figures grow in with a back ease (GSAP's easing math as public cubic-bezier equivalents). The diagrams animate too, on one story clock: nodes pop in one beat at a time, solid edges draw themselves (dash-offset drain), dashed returns fade, sequence messages land as they are "sent", and a timed caption strip under each figure subtitles the beats — under prefers-reduced-motion the strip becomes a static transcript. Zero scripts: the file itself animates in any browser, subtitles and all; the receipt records motion (plus diagrams[].story with the beat times, the hook for muxing voice later) so a cached artifact is never mistaken for the static one | |
| preset | No | Visual preset: "classic" (default), "signal-flow", "blueprint", or "editorial" — a palette family orthogonal to theme (each preset exists in both light and dark). The receipt records preset and theme separately | |
| quality | No | Quality profile for the composition audit: "standard" (default) or "showcase" — the delivery gate. The audit grades route crossings, corridors, label clearance, rhythm, and projected text size in the receipt (diagrams[].composition); it never changes the artifact bytes, only how findings are severity-rated | |
| markdown | Yes | Full markdown document. Prose rides a plain offline shell; archify fenced code blocks carry typed zero-coordinate diagram JSON and render to inline SVG. | |
| session_id | No | Optional session ID: also load the rendered HTML into that live session (local and free) so session_screenshot / session_state can verify the artifact |