127 lines
3.8 KiB
TypeScript
127 lines
3.8 KiB
TypeScript
import type { ReactNode } from "react";
|
||
import type { Components } from "react-markdown";
|
||
import { renderMarkdownToReact } from "@/components/markdown/renderMarkdown";
|
||
import { splitContentSegments } from "@/lib/directiveBlocks";
|
||
import { expandDyEmojiShortcodes } from "@/lib/dyEmoji";
|
||
import type { HideKind } from "@/lib/hideBlocks";
|
||
import MdHideBlock from "@/components/markdown/MdHideBlock";
|
||
import MdTimeline from "@/components/markdown/MdTimeline";
|
||
import MdEntries from "@/components/markdown/MdEntries";
|
||
import MdDetails from "@/components/markdown/MdDetails";
|
||
import MdVideo from "@/components/markdown/MdVideo";
|
||
import MdSnippet from "@/components/markdown/MdSnippet";
|
||
|
||
type MarkdownBodyProps = {
|
||
content: string;
|
||
className?: string;
|
||
components?: Components;
|
||
/** 详情页解锁门禁需要 */
|
||
postId?: number;
|
||
/** 登录跳转（公告等无 postId 时） */
|
||
loginHref?: string;
|
||
loggedIn?: boolean;
|
||
/** 书级「全章节条目卡模式」：章节内容免写 [entries] 壳 */
|
||
entriesAuto?: boolean;
|
||
/** 按分段索引的条目标题锚点 id（与章内目录共享；阅读页传入，其他场景缺省） */
|
||
entriesTitleIds?: (string[] | undefined)[];
|
||
};
|
||
|
||
/**
|
||
* 站点统一 Markdown 渲染（服务端）：GFM + Shiki；支持 [hide] / [timeline] / [entries]。
|
||
*/
|
||
export default async function MarkdownBody({
|
||
content,
|
||
className = "prose-content",
|
||
components,
|
||
postId,
|
||
loginHref,
|
||
loggedIn = false,
|
||
entriesAuto = false,
|
||
entriesTitleIds,
|
||
}: MarkdownBodyProps) {
|
||
const segs = splitContentSegments(expandDyEmojiShortcodes(content || ""), {
|
||
entriesAuto,
|
||
});
|
||
const nodes = [];
|
||
for (let i = 0; i < segs.length; i++) {
|
||
const seg = segs[i];
|
||
if (seg.type === "md") {
|
||
if (!seg.text.trim()) continue;
|
||
nodes.push(
|
||
<div key={`md-${i}`}>{await renderMarkdownToReact(seg.text, components)}</div>
|
||
);
|
||
continue;
|
||
}
|
||
if (seg.type === "timeline") {
|
||
const bodies: ReactNode[] = [];
|
||
for (let j = 0; j < seg.items.length; j++) {
|
||
const it = seg.items[j];
|
||
if (!it.body.trim()) {
|
||
bodies.push(null);
|
||
continue;
|
||
}
|
||
// 条目正文不挂目录 id，避免与块外 headingRenderer 错位
|
||
bodies.push(await renderMarkdownToReact(expandDyEmojiShortcodes(it.body)));
|
||
}
|
||
nodes.push(
|
||
<MdTimeline
|
||
key={`tl-${i}`}
|
||
items={seg.items}
|
||
renderBody={(_it, idx) => bodies[idx]}
|
||
/>
|
||
);
|
||
continue;
|
||
}
|
||
if (seg.type === "entries") {
|
||
nodes.push(
|
||
<MdEntries key={`entries-${i}`} items={seg.items} titleIds={entriesTitleIds?.[i]} />
|
||
);
|
||
continue;
|
||
}
|
||
if (seg.type === "details") {
|
||
const inner = seg.body.trim()
|
||
? await renderMarkdownToReact(expandDyEmojiShortcodes(seg.body))
|
||
: null;
|
||
nodes.push(
|
||
<MdDetails key={`details-${i}`} title={seg.title}>
|
||
{inner}
|
||
</MdDetails>
|
||
);
|
||
continue;
|
||
}
|
||
if (seg.type === "video") {
|
||
nodes.push(<MdVideo key={`video-${i}`} provider={seg.provider} id={seg.id} />);
|
||
continue;
|
||
}
|
||
if (seg.type === "snippet") {
|
||
nodes.push(<MdSnippet key={`snippet-${i}`} id={seg.id} />);
|
||
continue;
|
||
}
|
||
const kind = seg.kind as HideKind;
|
||
if (seg.locked) {
|
||
nodes.push(
|
||
<MdHideBlock
|
||
key={`hide-${i}`}
|
||
kind={kind}
|
||
points={seg.points}
|
||
locked
|
||
postId={postId}
|
||
loginHref={loginHref}
|
||
loggedIn={loggedIn}
|
||
/>
|
||
);
|
||
continue;
|
||
}
|
||
const inner = seg.body.trim()
|
||
? await renderMarkdownToReact(expandDyEmojiShortcodes(seg.body))
|
||
: null;
|
||
nodes.push(
|
||
<MdHideBlock key={`hide-${i}`} kind={kind} points={seg.points}>
|
||
{inner}
|
||
</MdHideBlock>
|
||
);
|
||
}
|
||
|
||
return <div className={className}>{nodes}</div>;
|
||
}
|