Integrate Markstream markdown rendering in Svelte 5 apps

This skill integrates Markstream using Svelte 5 runes and SvelteKit-safe browser boundaries. Its workflow: before changing dependencies or source files, inspect the existing package manager and project conventions, preview the intended edits, and obtain explicit user approval; confirm Svelte 5 and acceptance of a beta package; install only the specifically requested peers, importing the package CSS after resets and KaTeX CSS only for math; start with <MarkdownRender {content} /> and smooth streaming set to auto; for live chat disable fade and opt into the cursor, then on completion set final, disable pacing/cursor, and enable fade only if desired; use nodes only for worker-owned parsing or shared AST state; use $props() and callbacks, configuring KaTeX or Mermaid workers only when requested; prefer renderer-local customComponents, using scoped registration only when sharing is intentional; and keep browser-only workers behind SvelteKit client boundaries, validating with svelte-check, a build, or an end-to-end test.

Documented limitations: Svelte 4 is unsupported and the package is beta, workers and heavy peers require client-side bundler support, and the skill does not migrate unrelated Svelte architecture. A security note: keep safe HTML and strict Mermaid defaults, review dependencies, and never run browser-only peers during SSR.

Use for Svelte 5 or SvelteKit package setup, streaming state, workers, or scoped custom components. Svelte 4 is explicitly unsupported.

Input is an existing Svelte 5 or SvelteKit application. Output is a working MarkdownRender integration using runes-based props, with worker/heavy peers scoped to SvelteKit client boundaries and HTML/Mermaid trust kept at safe defaults.

<script lang="ts">
  import MarkdownRender from 'markstream-svelte'
  import 'markstream-svelte/index.css'

  let { content, isDone }: { content: string; isDone: boolean } = $props()
</script>

<MarkdownRender
  {content}
  final={isDone}
  fade={isDone}
  typewriter={!isDone}
  smoothStreaming={isDone ? false : 'auto'}
  htmlPolicy="safe"
/>

Svelte 5 or SvelteKit developers integrating Markstream's beta streaming markdown renderer who need runes-based bindings and correctly scoped browser-only dependencies.