feat: gfm heading id

src/components/FileTree.tsx

@@ -87,11 +87,14 @@ export const HeadingNode: Component<{
   const handleClick = (e: MouseEvent) => {
     e.preventDefault();
     navigate(href);
-    // 滚动到目标元素
+    // 滚动到目标元素，考虑导航栏高度偏移
     requestAnimationFrame(() => {
       const element = document.getElementById(anchor);
       if (element) {
-        element.scrollIntoView({ behavior: "smooth", block: "start" });
+        const navBarHeight = 80;
+        const elementPosition = element.getBoundingClientRect().top;
+        const offsetPosition = window.scrollY + elementPosition - navBarHeight;
+        window.scrollTo({ top: offsetPosition, behavior: "smooth" });
       }
     });
   };

src/markdown/index.ts

@@ -3,9 +3,11 @@ import {createDirectives, presetDirectiveConfigs} from 'marked-directive';
 import yaml from 'js-yaml';
 import markedAlert from "marked-alert";
 import markedMermaid from "./mermaid";
+import {gfmHeadingId} from "marked-gfm-heading-id";
 
 // 使用 marked-directive 来支持指令语法
 const marked = new Marked()
+    .use(gfmHeadingId())
     .use(markedAlert())
     .use(markedMermaid())
     .use(createDirectives([