From c6f598e48e3ccbc937a4724815519090fbdac18e Mon Sep 17 00:00:00 2001
From: Andrew Scott <ascott18@gmail.com>
Date: Wed, 1 May 2024 18:53:54 -0700
Subject: [PATCH] docs: fix syntax highlight after page navigations

---
 docs/.vitepress/components/Prop.vue | 36 ++++++++++++----------
 docs/package-lock.json              | 48 ++++-------------------------
 docs/package.json                   |  2 +-
 3 files changed, 26 insertions(+), 60 deletions(-)

diff --git a/docs/.vitepress/components/Prop.vue b/docs/.vitepress/components/Prop.vue
index bd6791386..f1664cf1f 100644
--- a/docs/.vitepress/components/Prop.vue
+++ b/docs/.vitepress/components/Prop.vue
@@ -52,15 +52,13 @@ p + .code-prop {
 
 <script lang="ts">
 import { defineComponent } from 'vue'
-import type { Highlighter, renderToHtml } from 'shiki';
 
 var highlighters = new Map<string, ReturnType<typeof highlighterFactory>>();
 async function highlighterFactory(lang) {
   // Dynamic import to avoid dependency in production builds
-  const shiki = await import('shiki')
-  shiki.setCDN('https://unpkg.com/shiki/');
+  const shiki = await import('shiki');
   const highlighter = await shiki.getHighlighter({
-    theme: 'dark-plus',
+    themes: ['dark-plus'],
     langs: [lang]
   });
   return { highlighter, shiki };
@@ -104,7 +102,6 @@ export default defineComponent({
     },
   },
 
-
   data() {
     return {
       idAttr: '',
@@ -115,6 +112,7 @@ export default defineComponent({
   async serverPrefetch() {
     await this.renderHtml();
   },
+  
   beforeMount() {
     // Copy pre-rendered HTML from the static render if it is present.
     this.html = this.$el?.innerHTML
@@ -175,19 +173,23 @@ export default defineComponent({
         .replace(/[ &<>"']/g,'-')
         .replace(/\$/g,'_')
 
-      const { highlighter, shiki } = await getHighlighter(this.lang)!;
-      const tokens = highlighter.codeToThemedTokens(code, this.lang)
+      const { highlighter } = await getHighlighter(this.lang)!;
       
-      if (!this.noClass) {
-        // Strip out the fake class wrapper that was added to get the colors right:
-        tokens.shift();
-        tokens.pop();
-      }
-
-      const theme = highlighter.getTheme();
-      let html = shiki.renderToHtml(tokens, {
-        fg: theme.fg,
-        bg: theme.bg
+      const noClass = this.noClass;
+      let html = highlighter.codeToHtml(code, {
+        lang: this.lang,
+        theme: 'dark-plus',
+        transformers: [
+          { 
+            tokens(tokens) {
+              if (!noClass) {
+                // Strip out the fake class wrapper that was added to get the colors right:
+                tokens.shift();
+                tokens.pop();
+              }
+            }
+          }
+        ]
       })
       
       this.html = `<a class="header-anchor" href="#${this.idAttr}" aria-hidden="true"></a>${html}`;
diff --git a/docs/package-lock.json b/docs/package-lock.json
index f8f317e40..90da82a23 100644
--- a/docs/package-lock.json
+++ b/docs/package-lock.json
@@ -9,7 +9,7 @@
       "version": "1.0.0",
       "license": "Apache-2.0",
       "dependencies": {
-        "shiki": "0.10.1"
+        "shiki": "1.4.0"
       },
       "devDependencies": {
         "cspell": "^5.20.0",
@@ -1379,8 +1379,7 @@
     "node_modules/@shikijs/core": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/@shikijs/core/-/core-1.4.0.tgz",
-      "integrity": "sha512-CxpKLntAi64h3j+TwWqVIQObPTED0FyXLHTTh3MKXtqiQNn2JGcMQQ362LftDbc9kYbDtrksNMNoVmVXzKFYUQ==",
-      "dev": true
+      "integrity": "sha512-CxpKLntAi64h3j+TwWqVIQObPTED0FyXLHTTh3MKXtqiQNn2JGcMQQ362LftDbc9kYbDtrksNMNoVmVXzKFYUQ=="
     },
     "node_modules/@shikijs/transformers": {
       "version": "1.4.0",
@@ -1391,15 +1390,6 @@
         "shiki": "1.4.0"
       }
     },
-    "node_modules/@shikijs/transformers/node_modules/shiki": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/shiki/-/shiki-1.4.0.tgz",
-      "integrity": "sha512-5WIn0OL8PWm7JhnTwRWXniy6eEDY234mRrERVlFa646V2ErQqwIFd2UML7e0Pq9eqSKLoMa3Ke+xbsF+DAuy+Q==",
-      "dev": true,
-      "dependencies": {
-        "@shikijs/core": "1.4.0"
-      }
-    },
     "node_modules/@sideway/address": {
       "version": "4.1.4",
       "resolved": "https://registry.npmjs.org/@sideway/address/-/address-4.1.4.tgz",
@@ -3977,11 +3967,6 @@
       "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
       "dev": true
     },
-    "node_modules/jsonc-parser": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/jsonc-parser/-/jsonc-parser-3.2.0.tgz",
-      "integrity": "sha512-gfFQZrcTc8CnKXp6Y4/CBT3fTc0OVuDofpre4aEeEpSBPV5X5v4+Vmx+8snU7RLPrNHPKSgLxGo9YuQzz20o+w=="
-    },
     "node_modules/jsonfile": {
       "version": "6.1.0",
       "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
@@ -5280,13 +5265,11 @@
       }
     },
     "node_modules/shiki": {
-      "version": "0.10.1",
-      "resolved": "https://registry.npmjs.org/shiki/-/shiki-0.10.1.tgz",
-      "integrity": "sha512-VsY7QJVzU51j5o1+DguUd+6vmCmZ5v/6gYu4vyYAhzjuNQU6P/vmSy4uQaOhvje031qQMiW0d2BwgMH52vqMng==",
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/shiki/-/shiki-1.4.0.tgz",
+      "integrity": "sha512-5WIn0OL8PWm7JhnTwRWXniy6eEDY234mRrERVlFa646V2ErQqwIFd2UML7e0Pq9eqSKLoMa3Ke+xbsF+DAuy+Q==",
       "dependencies": {
-        "jsonc-parser": "^3.0.0",
-        "vscode-oniguruma": "^1.6.1",
-        "vscode-textmate": "5.2.0"
+        "@shikijs/core": "1.4.0"
       }
     },
     "node_modules/signal-exit": {
@@ -5858,31 +5841,12 @@
         }
       }
     },
-    "node_modules/vitepress/node_modules/shiki": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/shiki/-/shiki-1.4.0.tgz",
-      "integrity": "sha512-5WIn0OL8PWm7JhnTwRWXniy6eEDY234mRrERVlFa646V2ErQqwIFd2UML7e0Pq9eqSKLoMa3Ke+xbsF+DAuy+Q==",
-      "dev": true,
-      "dependencies": {
-        "@shikijs/core": "1.4.0"
-      }
-    },
     "node_modules/vscode-languageserver-textdocument": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/vscode-languageserver-textdocument/-/vscode-languageserver-textdocument-1.0.11.tgz",
       "integrity": "sha512-X+8T3GoiwTVlJbicx/sIAF+yuJAqz8VvwJyoMVhwEMoEKE/fkDmrqUgDMyBECcM2A2frVZIUj5HI/ErRXCfOeA==",
       "dev": true
     },
-    "node_modules/vscode-oniguruma": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/vscode-oniguruma/-/vscode-oniguruma-1.7.0.tgz",
-      "integrity": "sha512-L9WMGRfrjOhgHSdOYgCt/yRMsXzLDJSL7BPrOZt73gU0iWO4mpqzqQzOz5srxqTvMBaR0XZTSrVWo4j55Rc6cA=="
-    },
-    "node_modules/vscode-textmate": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/vscode-textmate/-/vscode-textmate-5.2.0.tgz",
-      "integrity": "sha512-Uw5ooOQxRASHgu6C7GVvUxisKXfSgW4oFlO+aa+PAkgmH89O3CXxEEzNRNtHSqtXFTl0nAC1uYj0GMSH27uwtQ=="
-    },
     "node_modules/vscode-uri": {
       "version": "3.0.8",
       "resolved": "https://registry.npmjs.org/vscode-uri/-/vscode-uri-3.0.8.tgz",
diff --git a/docs/package.json b/docs/package.json
index cbda73c20..5d60d1afd 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -12,7 +12,7 @@
     "build": "cspell \"**/*.md\" && vitepress build --outDir .vitepress/dist/Coalesce && start-server-and-test 'serve -Ll 8087 ./.vitepress/dist' 8087 linkcheck"
   },
   "dependencies": {
-    "shiki": "0.10.1"
+    "shiki": "1.4.0"
   },
   "devDependencies": {
     "cspell": "^5.20.0",