Skip to main content

API Overview

animated_streaming_markdown exposes parser APIs, render block models, and Flutter renderer widgets from one public library:

import 'package:animated_streaming_markdown/animated_streaming_markdown.dart';

Parser

MarkdownStreamParser turns Markdown text into renderable blocks.

final parser = MarkdownStreamParser();
await parser.start();

final result = await parser.parse(
operation: MarkdownParseOperation.append,
text: chunk,
);

Prefer the convenience methods when the operation is static:

await parser.replace(markdown);
await parser.append(chunk);

For short complete Markdown snapshots, MarkdownSyncParser parses on the current isolate:

final result = MarkdownSyncParser.parseMarkdown(
markdown,
backend: MarkdownSyncParserBackend.auto,
);

MarkdownSyncParserBackend.dart uses the pure-Dart parser path. MarkdownSyncParserBackend.native uses the native parser when available and falls back to the pure-Dart parser if the native library cannot be loaded. MarkdownSyncParserBackend.auto prefers the native parser and falls back when needed.

Use result.nativeAvailable and result.mode when diagnostics need to confirm which parser path ran.

On Flutter web, warmUpStreamingMarkdownParser() attempts to load the optional Tree-sitter WASM asset generated by tool/build_wasm.sh. If the asset is not available, parser APIs fall back to the pure-Dart parser where possible.

Parse Result

MarkdownParseResult.blocks is the primary output for rendering:

final List<MarkdownBlock> blocks = result.blocks;

The result also exposes diagnostics such as parser mode, native availability, block counts, inline type counts, and timing values.

Renderer

AnimatedStreamingMarkdown renders parsed blocks:

AnimatedStreamingMarkdown(
blocks: result.blocks,
enableSelection: true,
);

For simple complete Markdown rendering, use the factory constructor:

AnimatedStreamingMarkdown.fromMarkdown(
markdown: markdown,
syncParserBackend: MarkdownSyncParserBackend.auto,
);

Important renderer options include:

  • blocks
  • placeholder
  • asSliver
  • tokenStaggerDelay
  • tokenAnimationDuration
  • tokenAnimationDurationFactor
  • tokenAnimationCurve
  • tokenAnimationBuilder
  • tokenCompaction
  • onTokenDelay
  • onTokenAnimationEnd
  • showCodeBlockCopyButton
  • enableSelection
  • selectionStrategy
  • theme
  • blockBuilder
  • imageBuilder
  • latexBuilder

Inline $...$ / \(...\) and display $$...$$ / \[...\] LaTeX expressions render with the bundled KaTeX-compatible flutter_math_fork integration. Use latexBuilder when you need to wrap or replace the default math widget.

Theming

Use AnimatedMarkdownThemeData to override renderer styling:

AnimatedStreamingMarkdown(
blocks: result.blocks,
theme: const AnimatedMarkdownThemeData(
blockSpacing: 16,
codeBlockBackgroundColor: Color(0xFF0F172A),
),
);

Custom Blocks

Use blockBuilder to replace or wrap a rendered block:

AnimatedStreamingMarkdown(
blocks: result.blocks,
blockBuilder: (context, block) {
if (block.block.type == 'thematic_break') {
return const Divider(thickness: 2);
}
return block.defaultWidget;
},
);

Return null to use the default widget.

Selection And Token Compaction

With enableSelection: true, the renderer maps pointer gestures to absolute Markdown source ranges through selectable render proxies. The visual highlight is projected from that stable range, so appends and scroll motion do not move the chosen endpoints. Users can select partial text within table cells, drag through a table into later blocks, and continue a drag at vertical or horizontal scroll edges.

tokenCompaction defaults to AnimatedMarkdownTokenCompaction.automatic. After animated word tokens settle, it merges their animation hosts into lighter static spans while retaining the same geometry for layout and selection.

API Reference

For guides and examples, use the documentation site at samnn.dev. For constructor parameters, typedefs, and model details, use the generated Dart API reference.