@llm-ui/markdown

Renders markdown content incrementally as it streams from LLM APIs, parsing and displaying markdown syntax (headings, lists, code blocks, tables) in real-time without waiting for complete response. Uses a streaming-aware markdown parser that handles partial tokens and incomplete syntax trees, enabling progressive UI updates as tokens arrive from OpenAI, Anthropic, or other LLM providers.

Automatically detects programming language from markdown code fence declarations and applies syntax highlighting using a lightweight highlighting library. Integrates with the streaming markdown parser to highlight code blocks as they complete, supporting 50+ languages with fallback to plain text rendering for unknown languages.

Provides comprehensive TypeScript type definitions for all markdown elements, component props, and configuration options. Includes JSDoc comments for IDE autocomplete and inline documentation, enabling developers to discover API surface through IDE intellisense. Exports type utilities for building custom markdown components.

Parses markdown table syntax (pipe-delimited rows and columns) and renders as HTML table elements with proper cell alignment and styling. Handles table headers, body rows, and alignment directives (left, center, right) specified in markdown table syntax, with responsive layout support for mobile screens.

Parses ordered and unordered markdown lists with multi-level nesting, preserving hierarchy through indentation analysis. Converts nested list syntax into hierarchical React components or HTML ul/ol elements, handling mixed list types (bullets and numbers) and partial list arrival during streaming.

Parses markdown emphasis syntax (bold, italic, strikethrough) and blockquote markers (>) to apply semantic HTML tags and styling. Handles nested emphasis, escaped characters, and blockquotes with multiple paragraphs, rendering them as styled React components with proper CSS classes for theme support.

Parses markdown link syntax ([text](url)) and image syntax () to extract URLs and alt text, rendering as HTML anchor and img elements. Supports relative and absolute URLs, validates URL format, and handles image loading with fallback for broken images. Integrates with streaming to render links and images as they complete.

Parses markdown heading syntax (# through ######) to extract heading levels and text content, rendering as semantic HTML heading elements (h1-h6) with proper hierarchy. Maintains heading structure during streaming and supports CSS styling per heading level, enabling table-of-contents generation and document outline extraction.

Parses markdown horizontal rule syntax (---, ***, ___) and line break syntax (double newline for paragraphs, double space for soft breaks) to render as HTML hr elements and proper paragraph/br elements. Handles whitespace normalization during streaming to prevent layout shifts from incomplete line breaks.

Parses markdown escape sequences (\*, \[, \#, etc.) to prevent interpretation of special markdown characters as syntax. Handles HTML entities and special Unicode characters, rendering them correctly during streaming without triggering false markdown parsing. Supports both markdown escapes and HTML entity references.

Provides a composable React component API for markdown rendering with support for custom component overrides and CSS theming. Allows developers to pass custom React components for any markdown element (heading, code block, table, etc.), enabling integration with design systems and custom styling. Supports CSS modules, Tailwind, and inline styles for theming.