Markstream Svelte
SkillDev toolsLets your agent add a streaming markdown renderer to Svelte 5 or SvelteKit apps.
Available today. Use it from your connected AI after setup.
No other account needed.
Connect ahel once, and every AI you use reads what you have installed.
Then ask your AI: use the Markstream Svelte skill
About this capability
Integrate the beta markstream-svelte package in Svelte 5 or SvelteKit apps. Use when Codex needs Svelte 5 runes, CSS and optional peers, smooth streaming, worker setup, renderer-local or scoped custom components, or SSR-safe boundaries. Svelte 4 is unsupported.
What this skill tells your AI
The instructions your AI receives, as published by simon-he95/markstream-vue in .agents/skills/markstream-svelte/SKILL.md and read by ahel’s review.
- Confirm Svelte 5; ask Svelte 4 users to upgrade.
- Add package and only requested peers.
- Import CSS after resets; KaTeX CSS for math.
- Treat the package as beta and confirm the app accepts that API maturity.
- Default to
<MarkdownRender {content} />.- For streaming AI chat, keep
contentand use built-in smooth streaming first.smoothStreaming="auto"is the default and activates whentypewriter={true}ormaxLiveNodes <= 0.typewriteronly controls the blinking cursor and defaults tofalse.fadecontrols node enter and streamed-text fade animations and defaults totrue.
- Streaming vs recovering history: in chat UIs the same renderer starts streaming and later switches to history when
final={true}.- Streaming:
smoothStreaming="auto",fade={false},typewriter={true}. This is a conservative visual/performance choice, not an API incompatibility. This adapter has not adopted Vue 3's bounded append fades, so verify its animation behavior before enabling both. - Recovering history:
smoothStreaming={false},fade={true},typewriter={false}. Content is already complete — pacing would slow it down, but fade gives a polished entry animation. - Dynamic switch:
smoothStreaming={isStreaming ? 'auto' : false},fade={!isStreaming}.
- Streaming:
- Use
nodes+finalfor worker-preparsed content, shared AST stores, or custom AST control.
- For streaming AI chat, keep
- Use
$props()and callbacks. - Workers:
setKaTeXWorker,setMermaidWorker,workers/*?worker. - Custom UI: prefer the renderer-local
customComponentsprop for one surface; use scopedsetCustomComponents,customId, andcustomHtmlTagswhen shared registration is intentional. - Keep browser-only workers and heavy peers behind SvelteKit client boundaries.
- Verify with
svelte-check, build, or e2e.
Useful Doc Targets
docs/guide/svelte.mddocs/frameworks/svelte.md
Signals
- GitHub stars
- 3k
- Forks
- 182
- Last commit
- Sep 2026
Advanced
- Catalog kind
- skill
- Gateway key
markstream-svelte- Source
- github.com/simon-he95/markstream-vue