Files
wehub-resource-sync e30e75b5d4
Code Quality / Oxlint + Oxfmt (push) Waiting to run
Code Quality / Template Sync (push) Waiting to run
Code Quality / Build Changed Packages (push) Waiting to run
Code Quality / Test Changed Packages (push) Waiting to run
Deploy Expo Example / Deploy Production (push) Waiting to run
Deploy Ink Example / Deploy Production (push) Waiting to run
Python Tests / pytest (assistant-stream, 3.10) (push) Waiting to run
Python Tests / pytest (assistant-stream, 3.12) (push) Waiting to run
Python Tests / pytest (assistant-ui-sync-server-api, 3.10) (push) Waiting to run
Python Tests / pytest (assistant-ui-sync-server-api, 3.12) (push) Waiting to run
Deploy Shadcn Registry / Deploy Production (push) Waiting to run
Template Metrics / LOC + Bundle Size (push) Waiting to run
Changesets / Create Version PR (push) Has been cancelled
chore: import upstream snapshot with attribution
2026-07-13 13:40:13 +08:00
..

@assistant-ui/react-markdown

react-markdown integration for @assistant-ui/react. Renders the assistant's markdown output as React components inside MessagePrimitive.Parts.

When to use this

Package Best for
@assistant-ui/react-markdown Lightweight rendering; bring your own syntax highlighter.
@assistant-ui/react-streamdown Feature-rich with built-in Shiki, KaTeX, and Mermaid.
@assistant-ui/react-syntax-highlighter Pair with react-markdown when you only need code-block highlighting.

Installation

npm install @assistant-ui/react @assistant-ui/react-markdown react-markdown remark-gfm

Usage

import { MarkdownTextPrimitive } from "@assistant-ui/react-markdown";
import remarkGfm from "remark-gfm";

export const MarkdownText = () => (
  <MarkdownTextPrimitive remarkPlugins={[remarkGfm]} className="aui-md" />
);

Plug <MarkdownText /> into MessagePrimitive.Parts as the Text component to render markdown for every text part.

Full reference at assistant-ui.com/docs/ui/markdown.