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.
Installation
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
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.
Markstream Svelte
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 content and use built-in smooth streaming first.
smoothStreaming="auto" is the default and activates when typewriter={true} or maxLiveNodes <= 0.
typewriter only controls the blinking cursor and defaults to false.
fade controls node enter and streamed-text fade animations and defaults to true.
Streaming vs recovering history: in chat UIs the same renderer starts streaming and later switches to history when final={true}.
Recovering history: smoothStreaming={false}, fade={true}, typewriter={false}. Content is already complete — pacing would slow it down, but fade gives a polished entry animation.
Custom UI: prefer the renderer-local customComponents prop for one surface; use scoped setCustomComponents, customId, and customHtmlTags when shared registration is intentional.
Keep browser-only workers and heavy peers behind SvelteKit client boundaries.