Components / UI components / Rich Content
Rich contentExperimental alpha
RichMarkdownResponse
Optional Markdown with inline math, display equations and Mermaid fences.
RichMarkdownResponse preview
Loading example…
Interactions use local sample data.
Usage and props
Display a Markdown response as text arrives. RichMarkdownResponse also renders supported math and Mermaid fences. Pass the Markdown text from your response. Load optional renderer peers and KaTeX styles. Diagrams render only when the response completes.
textstring- The response so far. Update it as new text arrives.
stateMessageData['state']- The response state from your application, including streaming or complete.
headingLevel1 | 2 | 3 | 4 | 5 | 6 (optional)- Heading level for a Markdown # heading. Defaults to 3; deeper headings stop at 6.
renderCodeBlock(props: MarkdownCodeBlockProps) => ReactNode (optional)- Render fenced code with your own component. Define this callback in your application.
These are the main props for the example. The package's TypeScript declarations include the full API.