This skill builds on render-markdown. Read it first for the syntax profile, parser options, AST, and core trust boundaries.

React Rendering

Setup

Render source directly and keep the surrounding semantic element in the application:

import { Markdown } from '@tanstack/markdown/react'

export function Article({ source }: { source: string }) {
  return (
    <article>
      <Markdown>{source}</Markdown>
    </article>
  )
}