Streaming Markdown

Markdown for an agent answer that arrives token by token.

Installation

Once per app, set up Aedis UI. The CLI verifies the signed release before writing anything and pins every dependency:

npx @aedis/cli@0.1.0 init

Import the theme once in your global CSS, after Tailwind:

app/globals.css

@import "tailwindcss";@import "./styles/aedis-theme.css";

Then add the component:

npx @aedis/cli@0.1.0 add streaming-markdown# pnpm dlx @aedis/cli@0.1.0 add streaming-markdown · yarn dlx @aedis/cli@0.1.0 add streaming-markdown · bunx @aedis/cli@0.1.0 add streaming-markdown

Props

Prop	Type	Default	Description
children	string	—	The answer so far, as untrusted markdown.
streaming	boolean	false	Tokens still arriving: caret on, incomplete links held back, aria-busy.
maxLength	number	100000	Longer answers are cut.
allowImages	boolean	false	As in Markdown.
settledMarkdown(text)	string	—	The text rendered while streaming, for custom renderers.

Security

Same rules as Markdown: no raw HTML, safe link protocols, images off by default, hidden characters removed.
A link becomes clickable only once it closes, and a bare URL only once it is followed by a space: a half-written URL is never clickable.
Rendered at most once per animation frame, with a length cap, so a fast or runaway stream cannot freeze the page.