563bb99
import { useMemo } from 'react'
import DOMPurify from 'dompurify'
import { marked } from 'marked'
marked.use({ gfm: true, breaks: true })
/**
* AI 生成的 Markdown 渲染器。
*
* 模型输出的是 Markdown(总结、评审结论、release 正文),必须按 Markdown
* 渲染而不是当纯文本显示。模型输出属于不可信内容,因此渲染结果一律经
* DOMPurify 清洗:脚本、事件属性与 `javascript:` 链接都会被剥离。
*/
export function Markdown({
children,
className = '',
compact = false,
}: {
children: string
className?: string
/** 行内发现等小字号场景。 */
compact?: boolean
}) {
const html = useMemo(
() => DOMPurify.sanitize(marked.parse(children, { async: false })),
[children],
)
return (
<div
className={`gitdata-markdown ${compact ? 'gitdata-markdown-compact' : ''} ${className}`}
dangerouslySetInnerHTML={{ __html: html }}
/>
)
}