diff --git a/docs/astro.config.mjs b/docs/astro.config.mjs
index 1712fbef..402a8bfd 100644
--- a/docs/astro.config.mjs
+++ b/docs/astro.config.mjs
@@ -1,3 +1,4 @@
+import mdx from '@astrojs/mdx'
 import sitemap from '@astrojs/sitemap'
 import tailwind from '@astrojs/tailwind'
 import vue from '@astrojs/vue'
@@ -123,8 +124,6 @@ export default defineConfig({
       },
     }),
     sitemap(),
+    mdx(),
   ],
-  legacy: {
-    astroFlavoredMarkdown: true,
-  }
 })
diff --git a/docs/package.json b/docs/package.json
index a0b488ac..51a78b07 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -16,6 +16,7 @@
   "devDependencies": {
     "@astrojs/markdown-component": "^0.2.1",
     "@astrojs/markdown-remark": "^0.14.0",
+    "@astrojs/mdx": "^0.6.0",
     "@astrojs/sitemap": "^0.3.0",
     "@astrojs/tailwind": "^0.2.5",
     "@astrojs/vue": "^0.5.0",
diff --git a/docs/pnpm-lock.yaml b/docs/pnpm-lock.yaml
index e5c82f7b..457246cf 100644
--- a/docs/pnpm-lock.yaml
+++ b/docs/pnpm-lock.yaml
@@ -3,6 +3,7 @@ lockfileVersion: 5.4
 specifiers:
   '@astrojs/markdown-component': ^0.2.1
   '@astrojs/markdown-remark': ^0.14.0
+  '@astrojs/mdx': ^0.6.0
   '@astrojs/sitemap': ^0.3.0
   '@astrojs/tailwind': ^0.2.5
   '@astrojs/vue': ^0.5.0
@@ -62,6 +63,7 @@ dependencies:
 devDependencies:
   '@astrojs/markdown-component': 0.2.1
   '@astrojs/markdown-remark': 0.14.0
+  '@astrojs/mdx': 0.6.0
   '@astrojs/sitemap': 0.3.0
   '@astrojs/tailwind': 0.2.5
   '@astrojs/vue': 0.5.0_vue@3.2.37
@@ -172,6 +174,30 @@ packages:
       - supports-color
     dev: true
 
+  /@astrojs/mdx/0.6.0:
+    resolution: {integrity: sha512-Sy9oB+0som0IDxFXoUsyoKPqgxM2XZywcajUxDxJsS7AVHVv3w3CBP+k7UIwzS3GvpPwHT6eFGoLGGB3MmB+Pw==}
+    engines: {node: ^14.18.0 || >=16.12.0}
+    dependencies:
+      '@astrojs/prism': 0.7.0
+      '@mdx-js/mdx': 2.1.2
+      '@mdx-js/rollup': 2.1.2
+      acorn: 8.8.0
+      es-module-lexer: 0.10.5
+      github-slugger: 1.4.0
+      gray-matter: 4.0.3
+      rehype-raw: 6.1.1
+      remark-frontmatter: 4.0.1
+      remark-gfm: 3.0.1
+      remark-mdx-frontmatter: 2.0.3
+      remark-shiki-twoslash: 3.1.0
+      remark-smartypants: 2.0.0
+      shiki: 0.10.1
+      unist-util-visit: 4.1.0
+    transitivePeerDependencies:
+      - rollup
+      - supports-color
+    dev: true
+
   /@astrojs/micromark-extension-mdx-jsx/1.0.3:
     resolution: {integrity: sha512-O15+i2DGG0qb1R/1SYbFXgOKDGbYdV8iJMtuboVb1S9YFQfMOJxaCMco0bhXQI7PmZcQ4pZWIjT5oZ64dXUtRA==}
     dependencies:
@@ -669,6 +695,43 @@ packages:
     resolution: {integrity: sha512-4/RWEeXDO6bocPONheFe6gX/oQdP/bEpv0oL4HqjPP5DCenBSt0mHgahppY49N0CpsaqffdwPq+TlX9CYOq2Dw==}
     dev: true
 
+  /@mdx-js/mdx/2.1.2:
+    resolution: {integrity: sha512-ASN1GUH0gXsgJ2UD/Td7FzJo1SwFkkQ5V1i9at5o/ROra7brkyMcBsotsOWJWRzmXZaLw2uXWn4aN8B3PMNFMA==}
+    dependencies:
+      '@types/estree-jsx': 0.0.1
+      '@types/mdx': 2.0.2
+      astring: 1.8.3
+      estree-util-build-jsx: 2.2.0
+      estree-util-is-identifier-name: 2.0.1
+      estree-walker: 3.0.1
+      hast-util-to-estree: 2.1.0
+      markdown-extensions: 1.1.1
+      periscopic: 3.0.4
+      remark-mdx: 2.1.2
+      remark-parse: 10.0.1
+      remark-rehype: 10.1.0
+      unified: 10.1.2
+      unist-util-position-from-estree: 1.1.1
+      unist-util-stringify-position: 3.0.2
+      unist-util-visit: 4.1.0
+      vfile: 5.3.4
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
+  /@mdx-js/rollup/2.1.2:
+    resolution: {integrity: sha512-3ahqp3DCpIlGlCRuLX4z7dFEgN5kWBljrk8BpipiWkVrvB4FQpTQu1T7lmDffm8tOunjHAsZEHtb076HiW51NQ==}
+    peerDependencies:
+      rollup: '>=2'
+    dependencies:
+      '@mdx-js/mdx': 2.1.2
+      '@rollup/pluginutils': 4.2.1
+      source-map: 0.7.4
+      vfile: 5.3.4
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
   /@nodelib/fs.scandir/2.1.5:
     resolution: {integrity: sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==}
     engines: {node: '>= 8'}
@@ -732,6 +795,14 @@ packages:
       tsm: 2.2.2
     dev: true
 
+  /@rollup/pluginutils/4.2.1:
+    resolution: {integrity: sha512-iKnFXr7NkdZAIHiIWE+BX5ULi/ucVFYWD6TbAV+rZctiRTY2PL6tsIKhoIOaoskiWAkgu+VsbXgUVDNLHf+InQ==}
+    engines: {node: '>= 8.0.0'}
+    dependencies:
+      estree-walker: 2.0.2
+      picomatch: 2.3.1
+    dev: true
+
   /@types/acorn/4.0.6:
     resolution: {integrity: sha512-veQTnWP+1D/xbxVrPC3zHnCZRjSrKfhbMUlEA43iMZLu7EsnTtkJklIuwrCPbOi8YkvDQAiW05VQQFvvz9oieQ==}
     dependencies:
@@ -784,6 +855,10 @@ packages:
     resolution: {integrity: sha512-eC4U9MlIcu2q0KQmXszyn5Akca/0jrQmwDRgpAMJai7qBWq4amIQhZyNau4VYGtCeALvW1/NtjzJJ567aZxfKA==}
     dev: true
 
+  /@types/mdx/2.0.2:
+    resolution: {integrity: sha512-mJGfgj4aWpiKb8C0nnJJchs1sHBHn0HugkVfqqyQi7Wn6mBRksLeQsPOFvih/Pu8L1vlDzfe/LidhVHBeUk3aQ==}
+    dev: true
+
   /@types/minimist/1.2.2:
     resolution: {integrity: sha512-jhuKLIRrhvCPLqwPcx6INqmKeiA5EWrsCOPhrlFSrbrmU4ZMPjj5Ul/oLCMDO98XRUIwVm78xICz4EPCektzeQ==}
     dev: true
@@ -832,6 +907,32 @@ packages:
     resolution: {integrity: sha512-w7hEHXnPMEZ+4nGKl/KDRVpxkwYxYExuHOYXyzIzCDzEZ9ZCGMAewulr9IqJu2LR4N37fcnb1XVeuZ09qgOxhA==}
     dev: false
 
+  /@typescript/twoslash/3.1.0:
+    resolution: {integrity: sha512-kTwMUQ8xtAZaC4wb2XuLkPqFVBj2dNBueMQ89NWEuw87k2nLBbuafeG5cob/QEr6YduxIdTVUjix0MtC7mPlmg==}
+    dependencies:
+      '@typescript/vfs': 1.3.5
+      debug: 4.3.4
+      lz-string: 1.4.4
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
+  /@typescript/vfs/1.3.4:
+    resolution: {integrity: sha512-RbyJiaAGQPIcAGWFa3jAXSuAexU4BFiDRF1g3hy7LmRqfNpYlTQWGXjcrOaVZjJ8YkkpuwG0FcsYvtWQpd9igQ==}
+    dependencies:
+      debug: 4.3.4
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
+  /@typescript/vfs/1.3.5:
+    resolution: {integrity: sha512-pI8Saqjupf9MfLw7w2+og+fmb0fZS0J6vsKXXrp4/PDXEFvntgzXmChCXC/KefZZS0YGS6AT8e0hGAJcTsdJlg==}
+    dependencies:
+      debug: 4.3.4
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
   /@vicons/fa/0.12.0:
     resolution: {integrity: sha512-g2PIeJLsTHUjt6bK63LxqC0uYQB7iu+xViJOxvp1s8b9/akpXVPVWjDTTsP980/0KYyMMe4U7F/aUo7wY+MsXA==}
     dev: false
@@ -1102,6 +1203,11 @@ packages:
     engines: {node: '>=8'}
     dev: true
 
+  /astring/1.8.3:
+    resolution: {integrity: sha512-sRpyiNrx2dEYIMmUXprS8nlpRg2Drs8m9ElX9vVEXaCB4XEAJhKfs7IcX0IwShjuOAjLR6wzIrgoptz1n19i1A==}
+    hasBin: true
+    dev: true
+
   /astro/1.0.0-rc.6:
     resolution: {integrity: sha512-mJfgUPlbuODLsEkt+R/4ReYet2WKETKvs4whJJS6CDQnAMZKNNcjM33GvYUoU5MAWUwVaobVr8fuUeKHU6RopA==}
     engines: {node: ^14.18.0 || >=16.12.0, npm: '>=6.14.0'}
@@ -2118,10 +2224,31 @@ packages:
     engines: {node: '>=4.0'}
     dev: true
 
+  /estree-util-attach-comments/2.1.0:
+    resolution: {integrity: sha512-rJz6I4L0GaXYtHpoMScgDIwM0/Vwbu5shbMeER596rB2D1EWF6+Gj0e0UKzJPZrpoOc87+Q2kgVFHfjAymIqmw==}
+    dependencies:
+      '@types/estree': 1.0.0
+    dev: true
+
+  /estree-util-build-jsx/2.2.0:
+    resolution: {integrity: sha512-apsfRxF9uLrqosApvHVtYZjISPvTJ+lBiIydpC+9wE6cF6ssbhnjyQLqaIjgzGxvC2Hbmec1M7g91PoBayYoQQ==}
+    dependencies:
+      '@types/estree-jsx': 1.0.0
+      estree-util-is-identifier-name: 2.0.1
+      estree-walker: 3.0.1
+    dev: true
+
   /estree-util-is-identifier-name/2.0.1:
     resolution: {integrity: sha512-rxZj1GkQhY4x1j/CSnybK9cGuMFQYFPLq0iNyopqf14aOVLFtMv7Esika+ObJWPWiOHuMOAHz3YkWoLYYRnzWQ==}
     dev: true
 
+  /estree-util-value-to-estree/1.3.0:
+    resolution: {integrity: sha512-Y+ughcF9jSUJvncXwqRageavjrNPAI+1M/L3BI3PyLp1nmgYTGUXU6t5z1Y7OWuThoDdhPME07bQU+d5LxdJqw==}
+    engines: {node: '>=12.0.0'}
+    dependencies:
+      is-plain-obj: 3.0.0
+    dev: true
+
   /estree-util-visit/1.2.0:
     resolution: {integrity: sha512-wdsoqhWueuJKsh5hqLw3j8lwFqNStm92VcwtAOAny8g/KS/l5Y8RISjR4k5W6skCj3Nirag/WUCMS0Nfy3sgsg==}
     dependencies:
@@ -2132,6 +2259,10 @@ packages:
   /estree-walker/2.0.2:
     resolution: {integrity: sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==}
 
+  /estree-walker/3.0.1:
+    resolution: {integrity: sha512-woY0RUD87WzMBUiZLx8NsYr23N5BKsOMZHhu2hoNRVh6NXGfoiT1KOL8G3UHlJAnEDGmfa5ubNA/AacfG+Kb0g==}
+    dev: true
+
   /esutils/2.0.3:
     resolution: {integrity: sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==}
     engines: {node: '>=0.10.0'}
@@ -2214,6 +2345,17 @@ packages:
       format: 0.2.2
     dev: true
 
+  /fault/2.0.1:
+    resolution: {integrity: sha512-WtySTkS4OKev5JtpHXnib4Gxiurzh5NCGvWrFaZ34m6JehfTUhKZvn9njTfw48t6JumVQOmrKqpmGcdwxnhqBQ==}
+    dependencies:
+      format: 0.2.2
+    dev: true
+
+  /fenceparser/1.1.1:
+    resolution: {integrity: sha512-VdkTsK7GWLT0VWMK5S5WTAPn61wJ98WPFwJiRHumhg4ESNUO/tnkU8bzzzc62o6Uk1SVhuZFLnakmDA4SGV7wA==}
+    engines: {node: '>=12'}
+    dev: true
+
   /fetch-blob/3.2.0:
     resolution: {integrity: sha512-7yAQpD2UMJzLi1Dqv7qFYnPbaPx7ZfFK6PiIxQ4PfkGPyNyl2Ugx+a/umUonmKqjhM4DnfbMvdX6otXq83soQQ==}
     engines: {node: ^12.20 || >= 14.13}
@@ -2544,6 +2686,28 @@ packages:
       zwitch: 2.0.2
     dev: true
 
+  /hast-util-to-estree/2.1.0:
+    resolution: {integrity: sha512-Vwch1etMRmm89xGgz+voWXvVHba2iiMdGMKmaMfYt35rbVtFDq8JNwwAIvi8zHMkO6Gvqo9oTMwJTmzVRfXh4g==}
+    dependencies:
+      '@types/estree': 1.0.0
+      '@types/estree-jsx': 1.0.0
+      '@types/hast': 2.3.4
+      '@types/unist': 2.0.6
+      comma-separated-tokens: 2.0.2
+      estree-util-attach-comments: 2.1.0
+      estree-util-is-identifier-name: 2.0.1
+      hast-util-whitespace: 2.0.0
+      mdast-util-mdx-expression: 1.3.0
+      mdast-util-mdxjs-esm: 1.3.0
+      property-information: 6.1.1
+      space-separated-tokens: 2.0.1
+      style-to-object: 0.3.0
+      unist-util-position: 4.0.3
+      zwitch: 2.0.2
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
   /hast-util-to-html/8.0.3:
     resolution: {integrity: sha512-/D/E5ymdPYhHpPkuTHOUkSatxr4w1ZKrZsG0Zv/3C2SRVT0JFJG53VS45AMrBtYk0wp5A7ksEhiC8QaOZM95+A==}
     dependencies:
@@ -2807,6 +2971,11 @@ packages:
     engines: {node: '>=0.10.0'}
     dev: true
 
+  /is-plain-obj/3.0.0:
+    resolution: {integrity: sha512-gwsOE28k+23GP1B6vFl1oVh/WOzmawBrKwo5Ev6wMKzPkaXaCDIQKzLnvsA42DRlbVTWorkgTKIviAKCWkfUwA==}
+    engines: {node: '>=10'}
+    dev: true
+
   /is-plain-obj/4.1.0:
     resolution: {integrity: sha512-+Pgi+vMuUNkJyExiMBt5IlFoMyKnr5zhJ4Uspz58WOhBF5QoIZkFyNHIbBAtHwzVAgk5RtndVNsDRN61/mmDqg==}
     engines: {node: '>=12'}
@@ -2821,6 +2990,12 @@ packages:
     resolution: {integrity: sha512-+lP4/6lKUBfQjZ2pdxThZvLUAafmZb8OAxFb8XXtiQmS35INgr85hdOGoEs124ez1FCnZJt6jau/T+alh58QFQ==}
     dev: true
 
+  /is-reference/3.0.0:
+    resolution: {integrity: sha512-Eo1W3wUoHWoCoVM4GVl/a+K0IgiqE5aIo4kJABFyMum1ZORlPkC+UC357sSQUL5w5QCE5kCC9upl75b7+7CY/Q==}
+    dependencies:
+      '@types/estree': 1.0.0
+    dev: true
+
   /is-regex/1.1.4:
     resolution: {integrity: sha512-kvRdxDsxZjhzUX07ZnLydzS1TU/TJlTUHHY4YLL87e37oUA49DfkLqgy+VjFocowy29cKvcSiu+kIv728jTTVg==}
     engines: {node: '>= 0.4'}
@@ -3055,6 +3230,11 @@ packages:
       yallist: 4.0.0
     dev: true
 
+  /lz-string/1.4.4:
+    resolution: {integrity: sha512-0ckx7ZHRPqb0oUm8zNr+90mtf9DQB60H1wMCjBtfi62Kl3a7JbHob6gA2bC+xRvZoOL+1hzUK8jeuEIQE8svEQ==}
+    hasBin: true
+    dev: true
+
   /magic-string/0.25.9:
     resolution: {integrity: sha512-RmF0AsMzgt25qzqqLc1+MbHmhdx0ojF2Fvs4XnOqz2ZOBXzzkEwc/dJQZCYHAn7v1jbVOjAZfK8msRn4BxO4VQ==}
     dependencies:
@@ -3070,6 +3250,11 @@ packages:
     engines: {node: '>=8'}
     dev: true
 
+  /markdown-extensions/1.1.1:
+    resolution: {integrity: sha512-WWC0ZuMzCyDHYCasEGs4IPvLyTGftYwh6wIEOULOF0HXcqZlhwRzrK0w2VUlxWA98xnvb/jszw4ZSkJ6ADpM6Q==}
+    engines: {node: '>=0.10.0'}
+    dev: true
+
   /markdown-table/3.0.2:
     resolution: {integrity: sha512-y8j3a5/DkJCmS5x4dMCQL+OR0+2EAq3DOtio1COSHsmW2BGXnNCK3v12hJt1LrUz5iZH5g0LmuYOjDdI+czghA==}
     dev: true
@@ -3150,6 +3335,12 @@ packages:
       micromark-extension-frontmatter: 0.2.2
     dev: true
 
+  /mdast-util-frontmatter/1.0.0:
+    resolution: {integrity: sha512-7itKvp0arEVNpCktOET/eLFAYaZ+0cNjVtFtIPxgQ5tV+3i+D4SDDTjTzPWl44LT59PC+xdx+glNTawBdF98Mw==}
+    dependencies:
+      micromark-extension-frontmatter: 1.0.0
+    dev: true
+
   /mdast-util-gfm-autolink-literal/1.0.2:
     resolution: {integrity: sha512-FzopkOd4xTTBeGXhXSBU0OCDDh5lUj2rd+HQqG92Ld+jL4lpUfgX2AT2OHAVP9aEeDKp7G92fuooSZcYJA3cRg==}
     dependencies:
@@ -3238,6 +3429,43 @@ packages:
       vfile-message: 3.1.2
     dev: true
 
+  /mdast-util-mdx-jsx/2.1.0:
+    resolution: {integrity: sha512-KzgzfWMhdteDkrY4mQtyvTU5bc/W4ppxhe9SzelO6QUUiwLAM+Et2Dnjjprik74a336kHdo0zKm7Tp+n6FFeRg==}
+    dependencies:
+      '@types/estree-jsx': 1.0.0
+      '@types/hast': 2.3.4
+      '@types/mdast': 3.0.10
+      ccount: 2.0.1
+      mdast-util-to-markdown: 1.3.0
+      parse-entities: 4.0.0
+      stringify-entities: 4.0.3
+      unist-util-remove-position: 4.0.1
+      unist-util-stringify-position: 3.0.2
+      vfile-message: 3.1.2
+    dev: true
+
+  /mdast-util-mdx/2.0.0:
+    resolution: {integrity: sha512-M09lW0CcBT1VrJUaF/PYxemxxHa7SLDHdSn94Q9FhxjCQfuW7nMAWKWimTmA3OyDMSTH981NN1csW1X+HPSluw==}
+    dependencies:
+      mdast-util-mdx-expression: 1.3.0
+      mdast-util-mdx-jsx: 2.1.0
+      mdast-util-mdxjs-esm: 1.3.0
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
+  /mdast-util-mdxjs-esm/1.3.0:
+    resolution: {integrity: sha512-7N5ihsOkAEGjFotIX9p/YPdl4TqUoMxL4ajNz7PbT89BqsdWJuBC9rvgt6wpbwTZqWWR0jKWqQbwsOWDBUZv4g==}
+    dependencies:
+      '@types/estree-jsx': 1.0.0
+      '@types/hast': 2.3.4
+      '@types/mdast': 3.0.10
+      mdast-util-from-markdown: 1.2.0
+      mdast-util-to-markdown: 1.3.0
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
   /mdast-util-to-hast/12.2.0:
     resolution: {integrity: sha512-YDwT5KhGzLgPpSnQhAlK1+WpCW4gsPmNNAxUNMkMTDhxQyPp2eX86WOelnKnLKEvSpfxqJbPbInHFkefXZBhEA==}
     dependencies:
@@ -3344,6 +3572,14 @@ packages:
       fault: 1.0.4
     dev: true
 
+  /micromark-extension-frontmatter/1.0.0:
+    resolution: {integrity: sha512-EXjmRnupoX6yYuUJSQhrQ9ggK0iQtQlpi6xeJzVD5xscyAI+giqco5fdymayZhJMbIFecjnE2yz85S9NzIgQpg==}
+    dependencies:
+      fault: 2.0.1
+      micromark-util-character: 1.1.0
+      micromark-util-symbol: 1.0.1
+    dev: true
+
   /micromark-extension-gfm-autolink-literal/1.0.3:
     resolution: {integrity: sha512-i3dmvU0htawfWED8aHMMAzAVp/F0Z+0bPh3YrbTPPL1v4YAlCZpy5rBO5p0LPYiZo0zFVkoYh7vDU7yQSiCMjg==}
     dependencies:
@@ -3441,12 +3677,52 @@ packages:
       uvu: 0.5.6
     dev: true
 
+  /micromark-extension-mdx-jsx/1.0.3:
+    resolution: {integrity: sha512-VfA369RdqUISF0qGgv2FfV7gGjHDfn9+Qfiv5hEwpyr1xscRj/CiVRkU7rywGFCO7JwJ5L0e7CJz60lY52+qOA==}
+    dependencies:
+      '@types/acorn': 4.0.6
+      estree-util-is-identifier-name: 2.0.1
+      micromark-factory-mdx-expression: 1.0.6
+      micromark-factory-space: 1.0.0
+      micromark-util-character: 1.1.0
+      micromark-util-symbol: 1.0.1
+      micromark-util-types: 1.0.2
+      uvu: 0.5.6
+      vfile-message: 3.1.2
+    dev: true
+
   /micromark-extension-mdx-md/1.0.0:
     resolution: {integrity: sha512-xaRAMoSkKdqZXDAoSgp20Azm0aRQKGOl0RrS81yGu8Hr/JhMsBmfs4wR7m9kgVUIO36cMUQjNyiyDKPrsv8gOw==}
     dependencies:
       micromark-util-types: 1.0.2
     dev: true
 
+  /micromark-extension-mdxjs-esm/1.0.3:
+    resolution: {integrity: sha512-2N13ol4KMoxb85rdDwTAC6uzs8lMX0zeqpcyx7FhS7PxXomOnLactu8WI8iBNXW8AVyea3KIJd/1CKnUmwrK9A==}
+    dependencies:
+      micromark-core-commonmark: 1.0.6
+      micromark-util-character: 1.1.0
+      micromark-util-events-to-acorn: 1.2.0
+      micromark-util-symbol: 1.0.1
+      micromark-util-types: 1.0.2
+      unist-util-position-from-estree: 1.1.1
+      uvu: 0.5.6
+      vfile-message: 3.1.2
+    dev: true
+
+  /micromark-extension-mdxjs/1.0.0:
+    resolution: {integrity: sha512-TZZRZgeHvtgm+IhtgC2+uDMR7h8eTKF0QUX9YsgoL9+bADBpBY6SiLvWqnBlLbCEevITmTqmEuY3FoxMKVs1rQ==}
+    dependencies:
+      acorn: 8.8.0
+      acorn-jsx: 5.3.2_acorn@8.8.0
+      micromark-extension-mdx-expression: 1.0.3
+      micromark-extension-mdx-jsx: 1.0.3
+      micromark-extension-mdx-md: 1.0.0
+      micromark-extension-mdxjs-esm: 1.0.3
+      micromark-util-combine-extensions: 1.0.0
+      micromark-util-types: 1.0.2
+    dev: true
+
   /micromark-factory-destination/1.0.0:
     resolution: {integrity: sha512-eUBA7Rs1/xtTVun9TmV3gjfPz2wEwgK5R5xcbIM5ZYAtvGF6JkyaDsj0agx8urXnO31tEO6Ug83iVH3tdedLnw==}
     dependencies:
@@ -3988,6 +4264,13 @@ packages:
     engines: {node: '>=8'}
     dev: true
 
+  /periscopic/3.0.4:
+    resolution: {integrity: sha512-SFx68DxCv0Iyo6APZuw/AKewkkThGwssmU0QWtTlvov3VAtPX+QJ4CadwSaz8nrT5jPIuxdvJWB4PnD2KNDxQg==}
+    dependencies:
+      estree-walker: 3.0.1
+      is-reference: 3.0.0
+    dev: true
+
   /picocolors/1.0.0:
     resolution: {integrity: sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==}
 
@@ -4376,6 +4659,10 @@ packages:
       strip-indent: 3.0.0
     dev: true
 
+  /regenerator-runtime/0.13.9:
+    resolution: {integrity: sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA==}
+    dev: true
+
   /regexpp/3.2.0:
     resolution: {integrity: sha512-pq2bWo9mVD43nbts2wGv17XLiNLya+GklZ8kaDLV2Z08gDCsGpnKn9BFMepvWuHCbyVvY7J5o5+BVvoQbmlJLg==}
     engines: {node: '>=8'}
@@ -4511,6 +4798,15 @@ packages:
       unist-util-visit: 4.1.0
     dev: true
 
+  /remark-frontmatter/4.0.1:
+    resolution: {integrity: sha512-38fJrB0KnmD3E33a5jZC/5+gGAC2WKNiPw1/fdXJvijBlhA7RCsvJklrYJakS0HedninvaCYW8lQGf9C918GfA==}
+    dependencies:
+      '@types/mdast': 3.0.10
+      mdast-util-frontmatter: 1.0.0
+      micromark-extension-frontmatter: 1.0.0
+      unified: 10.1.2
+    dev: true
+
   /remark-gfm/3.0.1:
     resolution: {integrity: sha512-lEFDoi2PICJyNrACFOfDD3JlLkuSbOa5Wd8EPt06HUdptv8Gn0bxYTdbU/XXQ3swAPkEaGxxPN9cbnMHvVu1Ig==}
     dependencies:
@@ -4531,6 +4827,27 @@ packages:
       unified: 10.1.2
     dev: true
 
+  /remark-mdx-frontmatter/2.0.3:
+    resolution: {integrity: sha512-R2H8k+KGS8phDwq6bR/tqD6MFytNcT3qSuBdCdv5+5bViNawVzWNRRI1XSaNB4WUcjoZDYJQUzmfw/5Y5vvB+Q==}
+    engines: {node: '>=14.0.0'}
+    dependencies:
+      '@types/mdast': 3.0.10
+      estree-util-is-identifier-name: 2.0.1
+      estree-util-value-to-estree: 1.3.0
+      toml: 3.0.0
+      unified: 10.1.2
+      yaml: 2.1.1
+    dev: true
+
+  /remark-mdx/2.1.2:
+    resolution: {integrity: sha512-npQagPdczPAv0xN9F8GSi5hJfAe/z6nBjylyfOfjLOmz086ahWrIjlk4BulRfNhA+asutqWxyuT3DFVsxiTVHA==}
+    dependencies:
+      mdast-util-mdx: 2.0.0
+      micromark-extension-mdxjs: 1.0.0
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
   /remark-parse/10.0.1:
     resolution: {integrity: sha512-1fUyHr2jLsVOkhbvPRBJ5zTKZZyD6yZzYaWCS6BPBdQ8vEMBCH+9zNCDA6tET/zHCi/jLqjCWtlJZUPk+DbnFw==}
     dependencies:
@@ -4550,6 +4867,22 @@ packages:
       unified: 10.1.2
     dev: true
 
+  /remark-shiki-twoslash/3.1.0:
+    resolution: {integrity: sha512-6LqSqVtHQR4S0DKfdQ2/ePn9loTKUtpyopYvwk8johjDTeUW5MkaLQuZHlWNkkST/4aMbz6aTkstIcwfwcHpXg==}
+    dependencies:
+      '@typescript/twoslash': 3.1.0
+      '@typescript/vfs': 1.3.4
+      fenceparser: 1.1.1
+      regenerator-runtime: 0.13.9
+      shiki: 0.10.1
+      shiki-twoslash: 3.1.0
+      tslib: 2.1.0
+      typescript: 4.6.4
+      unist-util-visit: 2.0.3
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
   /remark-smartypants/2.0.0:
     resolution: {integrity: sha512-Rc0VDmr/yhnMQIz8n2ACYXlfw/P/XZev884QU1I5u+5DgJls32o97Vc1RbK3pfumLsJomS2yy8eT4Fxj/2MDVA==}
     engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
@@ -4725,6 +5058,17 @@ packages:
     engines: {node: '>=8'}
     dev: true
 
+  /shiki-twoslash/3.1.0:
+    resolution: {integrity: sha512-uDqrTutOIZzyHbo103GsK7Vvc10saK1XCCivnOQ1NHJzgp3FBilEpftGeVzVSMOJs+JyhI7whkvhXV7kXQ5zCg==}
+    dependencies:
+      '@typescript/twoslash': 3.1.0
+      '@typescript/vfs': 1.3.4
+      shiki: 0.10.1
+      typescript: 4.6.4
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
   /shiki/0.10.1:
     resolution: {integrity: sha512-VsY7QJVzU51j5o1+DguUd+6vmCmZ5v/6gYu4vyYAhzjuNQU6P/vmSy4uQaOhvje031qQMiW0d2BwgMH52vqMng==}
     dependencies:
@@ -5150,6 +5494,10 @@ packages:
     resolution: {integrity: sha1-zCAOqyYT9BZtJ/+a/HylbUnfbrQ=}
     dev: true
 
+  /toml/3.0.0:
+    resolution: {integrity: sha512-y/mWCZinnvxjTKYhJ+pYxwD0mRLVvOtdS2Awbgxln6iEnt4rk0yBxeSBHkGJcPucRiG0e55mwWp+g/05rsrd6w==}
+    dev: true
+
   /totalist/3.0.0:
     resolution: {integrity: sha512-eM+pCBxXO/njtF7vdFsHuqb+ElbxqtI4r5EAvk6grfAFyJ6IvWlSkfZ5T9ozC6xWw3Fj1fGoSmrl0gUs46JVIw==}
     engines: {node: '>=6'}
@@ -5183,6 +5531,10 @@ packages:
       type-fest: 0.13.1
     dev: true
 
+  /tslib/2.1.0:
+    resolution: {integrity: sha512-hcVC3wYEziELGGmEEXue7D75zbwIIVUMWAVbHItGPx0ziyXxrOMQx4rQEVEV45Ut/1IotuEvwqPopzIOkDMf0A==}
+    dev: true
+
   /tslib/2.4.0:
     resolution: {integrity: sha512-d6xOpEDfsi2CZVlPQzGeux8XMwLT9hssAsaPYExaQMuYskwb+x1x7J371tWlbBdWHroy99KnVB6qIkUbs5X3UQ==}
     dev: true
@@ -5685,6 +6037,11 @@ packages:
     engines: {node: '>= 6'}
     dev: true
 
+  /yaml/2.1.1:
+    resolution: {integrity: sha512-o96x3OPo8GjWeSLF+wOAbrPfhFOGY0W00GNaxCDv+9hkcDJEnev1yh8S7pgHF0ik6zc8sQLuL8hjHjJULZp8bw==}
+    engines: {node: '>= 14'}
+    dev: true
+
   /yargs-parser/20.2.9:
     resolution: {integrity: sha512-y11nGElTIV+CT3Zv9t7VKl+Q3hTQoT9a1Qzezhhl6Rp21gJ/IVTW7Z3y9EWXhuUBC2Shnf+DX0antecpAwSP8w==}
     engines: {node: '>=10'}
diff --git a/docs/src/components/NavColumn.vue b/docs/src/components/NavColumn.vue
index 6c897f5b..5d63d352 100644
--- a/docs/src/components/NavColumn.vue
+++ b/docs/src/components/NavColumn.vue
@@ -23,7 +23,7 @@ nav#nav-tree
 
 <script setup>
 import { useIntersectionObserver, useTimeoutFn } from '@vueuse/core'
-import anime from 'animejs/lib/anime.es'
+import anime from 'animejs/lib/anime.es.js'
 import { nextTick, onMounted, reactive } from 'vue'
 
 const props = defineProps({
diff --git a/docs/src/layouts/PageLayout.astro b/docs/src/layouts/PageLayout.astro
index 303f1bc0..fc62b44b 100644
--- a/docs/src/layouts/PageLayout.astro
+++ b/docs/src/layouts/PageLayout.astro
@@ -8,7 +8,7 @@ import StripeTitle from '@src/components/StripeTitle.astro'
 import logoURL from '@src/assets/logos/cityseer_logo_light_red.png'
 import '@src/styles/yapper.css'
 
-const currentPath = Astro.canonicalURL.pathname
+const currentPath = Astro.url.pathname
 const navPaths = [
   '/intro/',
   '/guide/',
@@ -35,7 +35,7 @@ const navPaths = [
         <a href='/' title='home' class='hover:scale-105 transition-all object-contain'>
           <img src={logoURL} alt='logo' class='w-full h-full max-w-xs py-10 px-4' />
         </a>
-        <NavColumn client:load {navPaths} {currentPath} />
+        <NavColumn client:only='vue' {navPaths} {currentPath} />
         <div class='flex-grow'></div>
         <div class='self-start px-8 py-2'>
           <RepoLink />
diff --git a/docs/src/pages/metrics/layers.astro b/docs/src/pages/metrics/layers.astro
index a933cd04..b9ad48ef 100644
--- a/docs/src/pages/metrics/layers.astro
+++ b/docs/src/pages/metrics/layers.astro
@@ -1,5 +1,5 @@
 ---
-import { Markdown } from 'astro/components'
+import Markdown from '@astrojs/markdown-component';
 import PageLayout from '@src/layouts/PageLayout.astro'
 ---
 <PageLayout>
@@ -163,7 +163,7 @@ A [`GeoDataFrame`](https://geopandas.org/en/stable/docs/user_guide/data_structur
           <div class="yap doc-str-elem-type">str</div>
         </div>
         <div class="yap doc-str-elem-desc"><Markdown is:raw>
-The column label from which to take landuse categories, e.g. a column labelled &quot;landuse_categories&quot; might contain &quot;shop&quot;, &quot;pub&quot;, &quot;school&quot;, etc., landuse categories.
+The column label from which to take landuse categories, e.g. a column labelled "landuse_categories" might contain "shop", "pub", "school", etc., landuse categories.
 </Markdown></div>
       </div>
       <div class="yap doc-str-elem-container">
@@ -226,7 +226,7 @@ Mixed-use metrics to compute, containing any combination of the `key` values fro
           <div class="yap doc-str-elem-type">tuple[str]</div>
         </div>
         <div class="yap doc-str-elem-desc"><Markdown is:raw>
-Land-use keys for which to compute accessibilities. The keys should be selected from the same land-use schema used for the `landuse_labels` parameter, e.g. &quot;retail&quot;. The calculations will be performed in both `weighted` and `non_weighted` variants. By default None. By default None.
+Land-use keys for which to compute accessibilities. The keys should be selected from the same land-use schema used for the `landuse_labels` parameter, e.g. "retail". The calculations will be performed in both `weighted` and `non_weighted` variants. By default None. By default None.
 </Markdown></div>
       </div>
       <div class="yap doc-str-elem-container">
@@ -316,17 +316,17 @@ print(landuses_gdf.head())
 # compute some metrics - here we'll use the full interface, see below for simplified interfaces
 nodes_gdf, landuses_gdf = layers.compute_landuses(
     data_gdf=landuses_gdf,
-    landuse_column_label=&quot;categorical_landuses&quot;,
+    landuse_column_label="categorical_landuses",
     nodes_gdf=nodes_gdf,
     network_structure=network_structure,
     distances=[200, 400, 800],
-    mixed_use_keys=[&quot;hill&quot;],
+    mixed_use_keys=["hill"],
     qs=[0, 1],
-    accessibility_keys=[&quot;c&quot;, &quot;d&quot;, &quot;e&quot;],
+    accessibility_keys=["c", "d", "e"],
 )
 print(nodes_gdf.columns)  # the data is written to the GeoDataFrame
-print(nodes_gdf[&quot;cc_metric_hill_q0_800&quot;])  # access accordingly, e.g. hill diversity at q=0 and 800m
-print(nodes_gdf[&quot;cc_metric_d_800_non_weighted&quot;])  # weighted landuse accessibility for landuse &quot;d&quot; at 800m
+print(nodes_gdf["cc_metric_hill_q0_800"])  # access accordingly, e.g. hill diversity at q=0 and 800m
+print(nodes_gdf["cc_metric_d_800_non_weighted"])  # weighted landuse accessibility for landuse "d" at 800m
 ```
 
 :::warning
@@ -384,7 +384,7 @@ A [`GeoDataFrame`](https://geopandas.org/en/stable/docs/user_guide/data_structur
           <div class="yap doc-str-elem-type">str</div>
         </div>
         <div class="yap doc-str-elem-desc"><Markdown is:raw>
-The column label from which to take landuse categories, e.g. a column labelled &quot;landuse_categories&quot; might contain &quot;shop&quot;, &quot;pub&quot;, &quot;school&quot;, etc., landuse categories.
+The column label from which to take landuse categories, e.g. a column labelled "landuse_categories" might contain "shop", "pub", "school", etc., landuse categories.
 </Markdown></div>
       </div>
       <div class="yap doc-str-elem-container">
@@ -494,14 +494,14 @@ print(landuses_gdf.head())
 # some of the more commonly used measures can be accessed through simplified interfaces, e.g.
 nodes_gdf, landuses_gdf = layers.hill_diversity(
     data_gdf=landuses_gdf,
-    landuse_column_label=&quot;categorical_landuses&quot;,
+    landuse_column_label="categorical_landuses",
     nodes_gdf=nodes_gdf,
     network_structure=network_structure,
     distances=[200, 400, 800],
     qs=[0, 1],
 )
 print(nodes_gdf.columns)
-print(nodes_gdf[&quot;cc_metric_hill_q1_400&quot;])  # e.g. distance weighted hill at q=1 and 400m
+print(nodes_gdf["cc_metric_hill_q1_400"])  # e.g. distance weighted hill at q=1 and 400m
 ```
 
 </Markdown>
@@ -554,7 +554,7 @@ A [`GeoDataFrame`](https://geopandas.org/en/stable/docs/user_guide/data_structur
           <div class="yap doc-str-elem-type">str</div>
         </div>
         <div class="yap doc-str-elem-desc"><Markdown is:raw>
-The column label from which to take landuse categories, e.g. a column labelled &quot;landuse_categories&quot; might contain &quot;shop&quot;, &quot;pub&quot;, &quot;school&quot;, etc., landuse categories.
+The column label from which to take landuse categories, e.g. a column labelled "landuse_categories" might contain "shop", "pub", "school", etc., landuse categories.
 </Markdown></div>
       </div>
       <div class="yap doc-str-elem-container">
@@ -664,14 +664,14 @@ print(landuses_gdf.head())
 # some of the more commonly used measures can be accessed through simplified interfaces, e.g.
 nodes_gdf, landuses_gdf = layers.hill_branch_wt_diversity(
     data_gdf=landuses_gdf,
-    landuse_column_label=&quot;categorical_landuses&quot;,
+    landuse_column_label="categorical_landuses",
     nodes_gdf=nodes_gdf,
     network_structure=network_structure,
     distances=[200, 400, 800],
     qs=[0, 1],
 )
 print(nodes_gdf.columns)
-print(nodes_gdf[&quot;cc_metric_hill_branch_wt_q1_400&quot;])  # e.g. distance weighted hill at q=1 and 400m
+print(nodes_gdf["cc_metric_hill_branch_wt_q1_400"])  # e.g. distance weighted hill at q=1 and 400m
 ```
 
 </Markdown>
@@ -724,7 +724,7 @@ A [`GeoDataFrame`](https://geopandas.org/en/stable/docs/user_guide/data_structur
           <div class="yap doc-str-elem-type">str</div>
         </div>
         <div class="yap doc-str-elem-desc"><Markdown is:raw>
-The column label from which to take landuse categories, e.g. a column labelled &quot;landuse_categories&quot; might contain &quot;shop&quot;, &quot;pub&quot;, &quot;school&quot;, etc., landuse categories.
+The column label from which to take landuse categories, e.g. a column labelled "landuse_categories" might contain "shop", "pub", "school", etc., landuse categories.
 </Markdown></div>
       </div>
       <div class="yap doc-str-elem-container">
@@ -733,7 +733,7 @@ The column label from which to take landuse categories, e.g. a column labelled &
           <div class="yap doc-str-elem-type">tuple[str]</div>
         </div>
         <div class="yap doc-str-elem-desc"><Markdown is:raw>
-Land-use keys for which to compute accessibilities. The keys should be selected from the same land-use schema used for the `landuse_labels` parameter, e.g. &quot;retail&quot;. The calculations will be performed in both `weighted` and `non_weighted` variants. By default None. By default None.
+Land-use keys for which to compute accessibilities. The keys should be selected from the same land-use schema used for the `landuse_labels` parameter, e.g. "retail". The calculations will be performed in both `weighted` and `non_weighted` variants. By default None. By default None.
 </Markdown></div>
       </div>
       <div class="yap doc-str-elem-container">
@@ -834,15 +834,15 @@ print(landuses_gdf.head())
 # some of the more commonly used measures can be accessed through simplified interfaces, e.g.
 nodes_gdf, landuses_gdf = layers.compute_accessibilities(
     data_gdf=landuses_gdf,
-    landuse_column_label=&quot;categorical_landuses&quot;,
-    accessibility_keys=[&quot;a&quot;, &quot;c&quot;],
+    landuse_column_label="categorical_landuses",
+    accessibility_keys=["a", "c"],
     nodes_gdf=nodes_gdf,
     network_structure=network_structure,
     distances=[200, 400, 800],
 )
 print(nodes_gdf.columns)
-print(nodes_gdf[&quot;cc_metric_c_400_weighted&quot;])  # weighted form
-print(nodes_gdf[&quot;cc_metric_c_400_non_weighted&quot;])  # non-weighted form
+print(nodes_gdf["cc_metric_c_400_weighted"])  # weighted form
+print(nodes_gdf["cc_metric_c_400_non_weighted"])  # non-weighted form
 ```
 
 </Markdown>
@@ -998,14 +998,14 @@ print(numerical_gdf.head())
 # some of the more commonly used measures can be accessed through simplified interfaces, e.g.
 nodes_gdf, numerical_gdf = layers.compute_stats(
     data_gdf=numerical_gdf,
-    stats_column_labels=[&quot;mock_numerical_1&quot;],
+    stats_column_labels=["mock_numerical_1"],
     nodes_gdf=nodes_gdf,
     network_structure=network_structure,
     distances=[200, 400, 800],
 )
 print(nodes_gdf.columns)
-print(nodes_gdf[&quot;cc_metric_mock_numerical_1_mean_weighted_400&quot;])  # weighted form
-print(nodes_gdf[&quot;cc_metric_mock_numerical_1_sum_200&quot;])  # non-weighted form
+print(nodes_gdf["cc_metric_mock_numerical_1_mean_weighted_400"])  # weighted form
+print(nodes_gdf["cc_metric_mock_numerical_1_sum_200"])  # non-weighted form
 ```
 
 
diff --git a/docs/src/pages/metrics/networks.astro b/docs/src/pages/metrics/networks.astro
index 316ec092..09cad4c4 100644
--- a/docs/src/pages/metrics/networks.astro
+++ b/docs/src/pages/metrics/networks.astro
@@ -1,5 +1,5 @@
 ---
-import { Markdown } from 'astro/components'
+import Markdown from '@astrojs/markdown-component';
 import PageLayout from '@src/layouts/PageLayout.astro'
 ---
 <PageLayout>
diff --git a/docs/src/pages/metrics/observe.astro b/docs/src/pages/metrics/observe.astro
index 36b96a40..14968ef3 100644
--- a/docs/src/pages/metrics/observe.astro
+++ b/docs/src/pages/metrics/observe.astro
@@ -1,5 +1,5 @@
 ---
-import { Markdown } from 'astro/components'
+import Markdown from '@astrojs/markdown-component';
 import PageLayout from '@src/layouts/PageLayout.astro'
 ---
 <PageLayout>
diff --git a/docs/src/pages/structures.astro b/docs/src/pages/structures.astro
index b1cbe092..75833be4 100644
--- a/docs/src/pages/structures.astro
+++ b/docs/src/pages/structures.astro
@@ -1,5 +1,5 @@
 ---
-import { Markdown } from 'astro/components'
+import Markdown from '@astrojs/markdown-component';
 import PageLayout from '@src/layouts/PageLayout.astro'
 ---
 <PageLayout>
diff --git a/docs/src/pages/tools/graphs.astro b/docs/src/pages/tools/graphs.astro
index 42d8773a..ce2b935a 100644
--- a/docs/src/pages/tools/graphs.astro
+++ b/docs/src/pages/tools/graphs.astro
@@ -1,5 +1,5 @@
 ---
-import { Markdown } from 'astro/components'
+import Markdown from '@astrojs/markdown-component';
 import PageLayout from '@src/layouts/PageLayout.astro'
 ---
 <PageLayout>
@@ -37,7 +37,7 @@ M12.586 4.586a2 2 0 112.828 2.828l-3 3a2 2 0 01-2.828 0 1 1 0 00-1.414 1.414 4 4
       </div>
     </div>
     <div class="yap"><Markdown is:raw>
-Generate straight-line geometries for each edge. Prepares &quot;simple&quot; straight-lined geometries spanning the `x` and `y` coordinates of each node-pair. The resultant edge geometry will be stored to the edge `geom` attribute.
+Generate straight-line geometries for each edge. Prepares "simple" straight-lined geometries spanning the `x` and `y` coordinates of each node-pair. The resultant edge geometry will be stored to the edge `geom` attribute.
 </Markdown>
       <h3 class="yap">Parameters</h3>
       <div class="yap doc-str-elem-container">
@@ -730,7 +730,7 @@ An optional maximum cumulative degree to consider a valid node group for consoli
           <div class="yap doc-str-elem-type">str</div>
         </div>
         <div class="yap doc-str-elem-desc"><Markdown is:raw>
-Whether all nodes within the buffer distance are merged, or only &quot;direct&quot; or &quot;indirect&quot; neighbours. Defaults to None.
+Whether all nodes within the buffer distance are merged, or only "direct" or "indirect" neighbours. Defaults to None.
 </Markdown></div>
       </div>
       <div class="yap doc-str-elem-container">
diff --git a/docs/src/pages/tools/io.astro b/docs/src/pages/tools/io.astro
index 8814d2b2..fb3884f3 100644
--- a/docs/src/pages/tools/io.astro
+++ b/docs/src/pages/tools/io.astro
@@ -1,5 +1,5 @@
 ---
-import { Markdown } from 'astro/components'
+import Markdown from '@astrojs/markdown-component';
 import PageLayout from '@src/layouts/PageLayout.astro'
 ---
 <PageLayout>
@@ -210,7 +210,7 @@ A shapely Polygon representing the extents for which to fetch the OSM network. M
           <div class="yap doc-str-elem-type">str</div>
         </div>
         <div class="yap doc-str-elem-desc"><Markdown is:raw>
-An optional custom OSM request. None by default. If provided, this must include a &quot;geom_osm&quot; string formatting key for inserting the geometry passed to the OSM API query. See the discussion below.
+An optional custom OSM request. None by default. If provided, this must include a "geom_osm" string formatting key for inserting the geometry passed to the OSM API query. See the discussion below.
 </Markdown></div>
       </div>
       <div class="yap doc-str-elem-container">
@@ -262,13 +262,13 @@ The default OSM request will attempt to find all walkable routes. It will ignore
 custom_request = f'''
 [out:json];
 (
-way[&quot;highway&quot;]
-[&quot;area&quot;!=&quot;yes&quot;]
-[&quot;highway&quot;!~&quot;footway|pedestrian|steps|bus_guideway|escape|raceway|proposed|planned|abandoned|platform|construction&quot;]
-(poly:&quot;{geom_osm}&quot;);
+way["highway"]
+["area"!="yes"]
+["highway"!~"footway|pedestrian|steps|bus_guideway|escape|raceway|proposed|planned|abandoned|platform|construction"]
+(poly:"{geom_osm}");
 );
 out body;
-&gt;;
+>;
 out qt;
 '''
 ```
diff --git a/docs/src/pages/tools/mock.astro b/docs/src/pages/tools/mock.astro
index 8b743c93..513f8af9 100644
--- a/docs/src/pages/tools/mock.astro
+++ b/docs/src/pages/tools/mock.astro
@@ -1,5 +1,5 @@
 ---
-import { Markdown } from 'astro/components'
+import Markdown from '@astrojs/markdown-component';
 import PageLayout from '@src/layouts/PageLayout.astro'
 ---
 <PageLayout>
@@ -274,7 +274,7 @@ An optional random seed, by default None
           <div class="yap doc-str-elem-type">GeoDataFrame</div>
         </div>
         <div class="yap doc-str-elem-desc"><Markdown is:raw>
-A `GeoDataFrame` with a &quot;categorical_landuses&quot; data column for testing purposes. The number of rows will match the `length` parameter. The categorical data will consist of randomly selected characters from `num_classes`.
+A `GeoDataFrame` with a "categorical_landuses" data column for testing purposes. The number of rows will match the `length` parameter. The categorical data will consist of randomly selected characters from `num_classes`.
 </Markdown></div>
       </div>
     </div>
@@ -377,7 +377,7 @@ An optional random seed, by default None
           <div class="yap doc-str-elem-type">GeoDataFrame</div>
         </div>
         <div class="yap doc-str-elem-desc"><Markdown is:raw>
-A `GeoDataFrame` with a &quot;mock_numerical_x&quot; data columns for testing purposes. The number of rows will match the `length` parameter. The numer of numerical columns will match the `num_arrs` paramter.
+A `GeoDataFrame` with a "mock_numerical_x" data columns for testing purposes. The number of rows will match the `length` parameter. The numer of numerical columns will match the `num_arrs` paramter.
 </Markdown></div>
       </div>
     </div>
@@ -401,7 +401,7 @@ M12.586 4.586a2 2 0 112.828 2.828l-3 3a2 2 0 01-2.828 0 1 1 0 00-1.414 1.414 4 4
       </div>
     </div>
     <div class="yap"><Markdown is:raw>
-Generate a series of randomly generated counts and corresponding probabilities. This function is used for testing diversity measures. The data is generated in varying lengths from randomly assigned integers between 1 and 10. Matching integers are then collapsed into species &quot;classes&quot; with probabilities computed accordingly.
+Generate a series of randomly generated counts and corresponding probabilities. This function is used for testing diversity measures. The data is generated in varying lengths from randomly assigned integers between 1 and 10. Matching integers are then collapsed into species "classes" with probabilities computed accordingly.
 </Markdown>
       <h3 class="yap">Parameters</h3>
       <div class="yap doc-str-elem-container">
diff --git a/docs/src/pages/tools/plot.astro b/docs/src/pages/tools/plot.astro
index 1cc46261..9b9930ce 100644
--- a/docs/src/pages/tools/plot.astro
+++ b/docs/src/pages/tools/plot.astro
@@ -1,5 +1,5 @@
 ---
-import { Markdown } from 'astro/components'
+import Markdown from '@astrojs/markdown-component';
 import PageLayout from '@src/layouts/PageLayout.astro'
 ---
 <PageLayout>
@@ -445,16 +445,16 @@ G = graphs.nx_simple_geoms(G)
 G = graphs.nx_decompose(G, 50)
 nodes_gdf, network_structure = graphs.network_structure_from_nx(G, crs=3395)
 networks.node_centrality(
-    measures=[&quot;node_beta&quot;], network_structure=network_structure, nodes_gdf=nodes_gdf, distances=[800]
+    measures=["node_beta"], network_structure=network_structure, nodes_gdf=nodes_gdf, distances=[800]
 )
 G_after = graphs.nx_from_network_structure(nodes_gdf, network_structure, G)
 # let's extract and normalise the values
 vals = []
 for node, data in G_after.nodes(data=True):
-    vals.append(data[&quot;cc_metric_node_beta_800&quot;])
+    vals.append(data["cc_metric_node_beta_800"])
 # let's create a custom colourmap using matplotlib
 cmap = colors.LinearSegmentedColormap.from_list(
-    &quot;cityseer&quot;, [(100 / 255, 193 / 255, 255 / 255, 255 / 255), (211 / 255, 47 / 255, 47 / 255, 1 / 255)]
+    "cityseer", [(100 / 255, 193 / 255, 255 / 255, 255 / 255), (211 / 255, 47 / 255, 47 / 255, 1 / 255)]
 )
 # normalise the values
 vals = colors.Normalize()(vals)
diff --git a/pdm.lock b/pdm.lock
index baa981e8..220363a0 100644
--- a/pdm.lock
+++ b/pdm.lock
@@ -1316,7 +1316,7 @@ summary = "Module for decorators, wrappers and monkey patching."
 
 [[package]]
 name = "yapper"
-version = "0.3.4"
+version = "0.3.5"
 requires_python = ">=3.8,<4.0"
 summary = "Parser for converting python docstrings to .astro files for the Astro static site generator."
 dependencies = [
@@ -2754,9 +2754,9 @@ content_hash = "sha256:0fa61d545097a60d058498b3ce980b0e4fa9d3bd5f6f6d2412cfe3e76
     {url = "https://files.pythonhosted.org/packages/f9/3c/110e52b9da396a4ef3a0521552a1af9c7875a762361f48678c1ac272fd7e/wrapt-1.14.1-cp39-cp39-musllinux_1_1_x86_64.whl", hash = "sha256:34aa51c45f28ba7f12accd624225e2b1e5a3a45206aa191f6f9aac931d9d56fe"},
     {url = "https://files.pythonhosted.org/packages/fd/70/8a133c88a394394dd57159083b86a564247399440b63f2da0ad727593570/wrapt-1.14.1-cp310-cp310-manylinux_2_5_x86_64.manylinux1_x86_64.manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:257fd78c513e0fb5cdbe058c27a0624c9884e735bbd131935fd49e9fe719d310"},
 ]
-"yapper 0.3.4" = [
-    {url = "https://files.pythonhosted.org/packages/dc/88/ce73e045dd50fa967d5f3f1c58f17da19d598a14fa38375a4e41db0b477e/yapper-0.3.4.tar.gz", hash = "sha256:041cdaa45d6a60167a7760f9c775e3462c6a51097cd1944e4a30004e67aef462"},
-    {url = "https://files.pythonhosted.org/packages/ee/b3/d65930e236c067c05be227c38349cd1e4ca5f49e3227cb4ba3e2a1326e39/yapper-0.3.4-py3-none-any.whl", hash = "sha256:65ee32f0279bbbad7282dde66bd2abf332d5ef66dab45c36c2c70316c29b7b25"},
+"yapper 0.3.5" = [
+    {url = "https://files.pythonhosted.org/packages/45/48/e92c9cbaaa8041b2e75e4957889df7761e79c71ea1ccbb18aea3e526fc62/yapper-0.3.5.tar.gz", hash = "sha256:bd2e87d9e42d26329d82eaa795874ff5151dd82db6ed1129ce388d70d23fe8cb"},
+    {url = "https://files.pythonhosted.org/packages/65/7d/0e432fa2b11147ca7380fd216e5f37932f9505fcad432c27e37c85c7006c/yapper-0.3.5-py3-none-any.whl", hash = "sha256:322736a899c3b262ae59f01775691571cd870cdb114fade5d45f4029a43b619a"},
 ]
 "zipp 3.8.1" = [
     {url = "https://files.pythonhosted.org/packages/3b/e3/fb79a1ea5f3a7e9745f688855d3c673f2ef7921639a380ec76f7d4d83a85/zipp-3.8.1.tar.gz", hash = "sha256:05b45f1ee8f807d0cc928485ca40a07cb491cf092ff587c0df9cb1fd154848d2"},
diff --git a/pyproject.toml b/pyproject.toml
index 632202fc..5520e897 100644
--- a/pyproject.toml
+++ b/pyproject.toml
@@ -1,6 +1,6 @@
 [project]
 name = "cityseer"
-version = '3.4.2'
+version = '3.4.3'
 description = "Computational tools for network-based pedestrian-scale urban analysis"
 readme = "README.md"
 requires-python = ">=3.8, <3.11"