StreamMarkdown class

A widget that renders Markdown content from a stream in real-time.

StreamMarkdown is designed specifically for streaming scenarios where markdown content arrives incrementally, such as AI chat responses, live documentation updates, or collaborative editing. It efficiently accumulates and renders text chunks as they arrive from a stream.

Basic Usage

StreamController<String> controller = StreamController<String>();

// Display the streaming widget
StreamMarkdown(
  stream: controller.stream,
  styleSheet: MarkdownStyleSheet.light(),
)

// Later, send chunks to the stream
controller.add('# Hello\n\n');
await Future.delayed(Duration(milliseconds: 100));
controller.add('This is **streaming** ');
await Future.delayed(Duration(milliseconds: 100));
controller.add('markdown!');

Use Cases

AI Chat Applications: Perfect for displaying streaming LLM responses

StreamMarkdown(
  stream: openAI.streamCompletion(prompt),
  styleSheet: MarkdownStyleSheet.github(),
  useEnhancedComponents: true,
)

Live Collaboration: Show real-time updates from multiple users

StreamMarkdown(
  stream: firestore
    .collection('documents')
    .doc(docId)
    .snapshots()
    .map((doc) => doc.data()['content'] as String),
  styleSheet: MarkdownStyleSheet.light(),
)

Progressive Loading: Display content as it loads from network

StreamMarkdown(
  stream: fetchLargeDocument(),
  loadingWidget: Center(child: CircularProgressIndicator()),
)

How It Works

1. The widget listens to the provided stream
2. Each chunk received is appended to an internal buffer
3. The accumulated text is parsed and rendered on each update
4. The UI updates smoothly as new content arrives

Performance Considerations

• The widget re-parses and re-renders the entire accumulated content on each chunk
• For very large documents with frequent updates, consider batching chunks
• The parsing is fast (AST-based), but very large documents may cause frame drops
• Consider using SmoothMarkdown for static content instead

Error Handling

Currently, stream errors are silently ignored. The errorBuilder parameter is available but not yet fully implemented. To handle errors:

final stream = sourceStream.handleError((error) {
  print('Stream error: $error');
  // You can transform errors or rethrow
});

StreamMarkdown(stream: stream)

See also:

• SmoothMarkdown, for static markdown content
• MarkdownStyleSheet, for customizing the visual appearance
• MarkdownConfig, for configuring parsing behavior