Skip to main content

animated_streaming_markdown

animated_streaming_markdown is a Flutter package for chat-like Markdown interfaces where text arrives progressively and the UI needs stable incremental updates.

The package has two main layers:

  • MarkdownStreamParser converts full snapshots or appended chunks into typed render blocks.
  • AnimatedStreamingMarkdown renders those blocks with token reveal animation, link handling, and optional Markdown-aware selection copy.

Use it when a model, server, or local process streams Markdown into a Flutter surface and you want to avoid reparsing and rebuilding the whole experience by hand.

Key Capabilities​

  • Incremental replace and append parse operations.
  • Typed MarkdownParseResult.blocks output.
  • Flutter renderer for lists, tables, code blocks, HTML blocks, footnotes, and common inline Markdown.
  • KaTeX-compatible LaTeX rendering for inline and display math through the bundled view-only renderer derived from flutter_math_fork.
  • Per-token animation timing and custom token animation builders.
  • Render-backed Markdown selection with a directional controller, stable source ranges, table traversal, and TextField-like edge auto-scroll during drag gestures.
  • One flat highlight layer per visual line, including selectable non-text bounds for images and LaTeX, with touch long-press and selection handles.
  • Source-backed plain, raw Markdown, and rich HTML copy on Web, Android, iOS, macOS, Windows, and Linux, with plain-text fallback.
  • Stable streaming state for incremental appends and list-recycled chat messages.
  • Settled token compaction that reduces widget work without reflowing text.
  • Native tree-sitter parser integration on Android, iOS, macOS, Linux, and Windows.
  • Zero-config Tree-sitter WASM parser support for Flutter web builds, with pure-Dart fallback.
  • A static Flutter web chatbot demo that connects to Ollama, ChatGPT, Claude, Gemini, and Grok-compatible streaming APIs.

Platform Support​

The package is built for Flutter native targets:

  • Android
  • iOS
  • macOS
  • Linux
  • Windows

Flutter web is supported by the published package. The generated Tree-sitter WASM parser asset is bundled as a package asset and loaded automatically, so app developers do not need to edit web/index.html or add custom build scripts. When the WASM asset is unavailable during development, the parser falls back to the pure-Dart implementation.

Selection and rich copy use the same public renderer on all listed targets. Box selection is self-contained; sliver selection keeps lazy rendering through AnimatedStreamingMarkdownSelectionArea. The package requires Flutter >=3.10.0 and uses a compatibility adapter for text scaling across Flutter 3.10 and newer SDKs.

Next Steps​

Support​

If this package helps you, consider buying me a coffee:

Buy Me a Coffee