docs(website): add anchor tags to headings and api parameters

sdorra · Apr 15, 2024 · e1e4f04 · e1e4f04
1 parent 941bc31
commit e1e4f04
Show file tree

Hide file tree

Showing 4 changed files with 113 additions and 16 deletions.
diff --git a/docs/04-migrate-from-contentlayer.mdx b/docs/04-migrate-from-contentlayer.mdx
@@ -12,7 +12,7 @@ The concepts are similar, but there are some differences.
 
 ## Fields
 
-Content Collections uses a [schema](/docs/main/configuration#collections) to define the fields of a collection.
+Content Collections uses a [schema](/docs/main/configuration#schema) to define the fields of a collection.
 Computed fields can be added with the [transform](/docs/main/transform) function.
 
 ## Content

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/website/content-collections.ts b/website/content-collections.ts
@@ -1,9 +1,31 @@
 import { defineCollection, defineConfig } from "@content-collections/core";
+import rehypeSlug from "rehype-slug";
 import rehypeShiki from "@shikijs/rehype";
 import { Options, compileMDX } from "@content-collections/mdx";
+import { selectAll } from "hast-util-select";
+import { Root } from "hast";
+import GithubSlugger from "github-slugger";
+
+function liCodeSlug() {
+  return (tree: Root) => {
+    const slugger = new GithubSlugger();
+
+    selectAll("li p code:first-of-type", tree).forEach((node) => {
+      const children = node.children;
+      if (children.length === 1 && children[0].type === "text") {
+        const text = slugger.slug(children[0].value);
+        node.properties.id = text;
+      }
+    });
+  };
+}
 
 const mdxOptions: Options = {
-  rehypePlugins: [[rehypeShiki, { theme: "one-dark-pro" }]],
+  rehypePlugins: [
+    liCodeSlug,
+    rehypeSlug,
+    [rehypeShiki, { theme: "one-dark-pro" }],
+  ],
 };
 
 const integrations = defineCollection({
@@ -98,7 +120,7 @@ const docs = defineCollection({
       linkText,
       body,
       href,
-      name
+      name,
     };
   },
 });

diff --git a/website/package.json b/website/package.json
@@ -28,15 +28,19 @@
     "@shikijs/rehype": "1.2.4",
     "@shikijs/transformers": "1.2.4",
     "@tailwindcss/typography": "^0.5.10",
+    "@types/hast": "^3.0.4",
     "@types/node": "^20",
     "@types/react": "^18",
     "@types/react-dom": "^18",
     "autoprefixer": "^10.4.19",
     "concurrently": "^8.2.2",
     "eslint": "^8",
     "eslint-config-next": "14.2.1",
+    "github-slugger": "^2.0.0",
+    "hast-util-select": "^6.0.2",
     "hast-util-to-jsx-runtime": "^2.3.0",
     "postcss": "^8",
+    "rehype-slug": "^6.0.0",
     "shiki": "1.2.3",
     "tailwindcss": "^3.4.0",
     "typescript": "^5"