内容组件

这些组件在单元格网格上渲染 Markdown、代码、差异和大号文字。

#<Markdown>

支持流式输入的 Markdown。传入持续增长的字符串，帧仍保持稳定。

const [text, setText] = useState("");useEffect(() => stream.on("token", (t) => setText((s) => s + t)), []);return <Markdown>{text}</Markdown>;

#<Code>

支持 ts、tsx、json、bash、python、rust、go 等语言的语法高亮。

<Code code={source} language="tsx" showLineNumbers maxHeight={12} />

#<Diff>

显示统一差异，或根据 { before, after } 计算差异。

<Diff patch={{ before, after, filename: "app/page.tsx" }} />

#<Spinner>

变体：dots、pulse、matrix、line 和 braille（用于终端；Menlo 没有盲文字形）。暂停期间计时器停止。

<Spinner variant="dots" label="Building…" />

#<AsciiFont>

用于标题的大号像素文字。

<AsciiFont text="▼ TEXT.JS" color="accent" />

使用 font="compact" 可选择 3 行高的变体。传入来自 @textjs/font 的 FIGlet 字体，例如 font={slant}，即可渲染 FIGlet 文字。