feat: add id to documentation headings

apps/documentation/src/components/mdx-provider/mdx-h2/mdx-h2.tsx

@@ -1,8 +1,17 @@
 import { Title } from '@mantine/core'
-import type { HTMLAttributes } from 'react'
+import { useRef, type HTMLAttributes } from 'react'
 
 export default function MdxH2(
   props: HTMLAttributes<HTMLHeadingElement>,
 ): JSX.Element {
-  return <Title {...props} mt={20} order={2} />
+  return (
+    <Title
+      {...props}
+      mt={20}
+      order={2}
+      id={String(props.children ?? '')
+        .toLowerCase()
+        .replaceAll(' ', '-')}
+    />
+  )
 }

apps/documentation/src/components/mdx-provider/mdx-title/mdx-title.tsx

@@ -4,5 +4,13 @@ import type { HTMLAttributes } from 'react'
 export default function MdxTitle(
   props: HTMLAttributes<HTMLHeadingElement>,
 ): JSX.Element {
-  return <Title {...props} order={1} />
+  return (
+    <Title
+      {...props}
+      order={1}
+      id={String(props.children ?? '')
+        .toLowerCase()
+        .replaceAll(' ', '-')}
+    />
+  )
 }

apps/documentation/src/routes/documentation/contributing.mdx

@@ -26,7 +26,7 @@ The `tuono` project can mostly be split by the following sub-domains:
 - The documentation website (which is written with tuono 🚀)
 
 To check what are the knowledge requirement for each domain check the
-[requirements](/documentation/contributing?#requirements) section below.
+[requirements](#requirements) section below.
 
 Currently I'm keeping a private dashboard to prioritize new features and bug fixes but if you
 want to propose something please open a new issue on github or reach me using

apps/documentation/tsconfig.json

@@ -2,7 +2,7 @@
   "compilerOptions": {
     "target": "ES2020",
     "useDefineForClassFields": true,
-    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "lib": ["ES2021", "DOM", "DOM.Iterable"],
     "module": "ESNext",
     "skipLibCheck": true,