supported custom anchors in API index (#1757)

Author: Jinjiang

src/api/ApiIndex.vue

@@ -31,7 +31,7 @@ const filtered = computed(() => {
             return item
           }
           // filter headers
-          const matchedHeaders = item.headers.filter(matches)
+          const matchedHeaders = item.headers.map(h => h.text).filter(matches)
           return matchedHeaders.length
             ? { text: item.text, link: item.link, headers: matchedHeaders }
             : null
@@ -92,8 +92,8 @@ function slugify(text: string): string {
         >
           <h3>{{ item.text }}</h3>
           <ul>
-            <li v-for="h of item.headers" :key="h">
-              <a :href="item.link + '.html#' + slugify(h)">{{ h }}</a>
+            <li v-for="h of item.headers" :key="h.anchor">
+              <a :href="item.link + '.html#' + slugify(h.anchor)">{{ h.anchor }}</a>
             </li>
           </ul>
         </div>

src/api/api.data.ts

@@ -9,7 +9,10 @@ export interface APIGroup {
   items: {
     text: string
     link: string
-    headers: string[]
+    headers: {
+      anchor: string
+      text: string
+    }[]
   }[]
 }
 
@@ -34,7 +37,10 @@ export default {
 const headersCache = new Map<
   string,
   {
-    headers: string[]
+    headers: {
+      anchor: string
+      text: string
+    }[]
     timestamp: number
   }
 >()
@@ -50,15 +56,22 @@ function parsePageHeaders(link: string) {
 
   const src = fs.readFileSync(fullPath, 'utf-8')
   const h2s = src.match(/^## [^\n]+/gm)
-  let headers: string[] = []
+  let headers: {
+    anchor: string
+    text: string
+  }[] = []
   if (h2s) {
-    headers = h2s.map((h) =>
-      h
-        .slice(2)
-        .replace(/<sup class=.*/, '')
-        .replace(/\\</g, '<')
-        .replace(/`([^`]+)`/g, '$1')
-        .trim()
+    headers = h2s.map((h) => {
+        const text = h
+          .slice(2)
+          .replace(/<sup class=.*/, '')
+          .replace(/\\</g, '<')
+          .replace(/`([^`]+)`/g, '$1')
+          .replace(/\{#([a-zA-Z0-9-]+)\}/g, '') // hidden anchor tag
+          .trim()
+        const anchor = h.match(/\{#([a-zA-Z0-9-]+)\}/)?.[1] ?? text
+        return { text, anchor }
+      }
     )
   }
   headersCache.set(fullPath, {