From 80f0ab31aceec35c9fd04a6387b14349b806f713 Mon Sep 17 00:00:00 2001
From: nsfisis <nsfisis@gmail.com>
Date: Fri, 4 Jul 2025 19:14:54 +0900
Subject: feat(blog/nuldoc): implement TOC

---
 .../blog/nuldoc-src/components/TableOfContents.tsx | 33 ++++++++++++++++++++++
 1 file changed, 33 insertions(+)
 create mode 100644 services/blog/nuldoc-src/components/TableOfContents.tsx

(limited to 'services/blog/nuldoc-src/components/TableOfContents.tsx')

diff --git a/services/blog/nuldoc-src/components/TableOfContents.tsx b/services/blog/nuldoc-src/components/TableOfContents.tsx
new file mode 100644
index 00000000..29907d08
--- /dev/null
+++ b/services/blog/nuldoc-src/components/TableOfContents.tsx
@@ -0,0 +1,33 @@
+import { TocEntry, TocRoot } from "../djot/document.ts";
+
+type Props = {
+  toc: TocRoot;
+};
+
+export default function TableOfContents({ toc }: Props) {
+  return (
+    <nav className="toc">
+      <h2>目次</h2>
+      <ul>
+        {toc.entries.map((entry, index) => (
+          <TocEntryComponent key={String(index)} entry={entry} />
+        ))}
+      </ul>
+    </nav>
+  );
+}
+
+function TocEntryComponent({ entry }: { entry: TocEntry }) {
+  return (
+    <li>
+      <a href={`#${entry.id}`}>{entry.text}</a>
+      {entry.children.length > 0 && (
+        <ul>
+          {entry.children.map((child, index) => (
+            <TocEntryComponent key={String(index)} entry={child} />
+          ))}
+        </ul>
+      )}
+    </li>
+  );
+}
-- 
cgit v1.2.3-70-g09d2