@astrojs/markdoc 0.5.1 → 0.6.0

package/dist/extensions/shiki.js

@@ -1,6 +1,6 @@
 import Markdoc from "@markdoc/markdoc";
 import { unescapeHTML } from "astro/runtime/server/index.js";
-import { getHighlighter } from "shiki";
+import { bundledLanguages, getHighlighter } from "shikiji";
 const ASTRO_COLOR_REPLACEMENTS = {
   "#000001": "var(--astro-code-color-text)",
   "#000002": "var(--astro-code-color-background)",
@@ -14,28 +14,28 @@ const ASTRO_COLOR_REPLACEMENTS = {
   "#000011": "var(--astro-code-token-punctuation)",
   "#000012": "var(--astro-code-token-link)"
 };
+const COLOR_REPLACEMENT_REGEX = new RegExp(
+  `(${Object.keys(ASTRO_COLOR_REPLACEMENTS).join("|")})`,
+  "g"
+);
 const PRE_SELECTOR = /<pre class="(.*?)shiki(.*?)"/;
 const LINE_SELECTOR = /<span class="line"><span style="(.*?)">([\+|\-])/g;
 const INLINE_STYLE_SELECTOR = /style="(.*?)"/;
+const INLINE_STYLE_SELECTOR_GLOBAL = /style="(.*?)"/g;
 const highlighterCache = /* @__PURE__ */ new Map();
 async function shiki({
   langs = [],
   theme = "github-dark",
   wrap = false
 } = {}) {
-  const cacheID = typeof theme === "string" ? theme : theme.name;
-  if (!highlighterCache.has(cacheID)) {
-    highlighterCache.set(
-      cacheID,
-      await getHighlighter({ theme }).then((hl) => {
-        hl.setColorReplacements(ASTRO_COLOR_REPLACEMENTS);
-        return hl;
-      })
-    );
-  }
-  const highlighter = highlighterCache.get(cacheID);
-  for (const lang of langs) {
-    await highlighter.loadLanguage(lang);
+  const cacheId = typeof theme === "string" ? theme : theme.name || "";
+  let highlighter = highlighterCache.get(cacheId);
+  if (!highlighter) {
+    highlighter = await getHighlighter({
+      langs: langs.length ? langs : Object.keys(bundledLanguages),
+      themes: [theme]
+    });
+    highlighterCache.set(cacheId, highlighter);
   }
   return {
     nodes: {
@@ -56,7 +56,7 @@ async function shiki({
           } else {
             lang = "plaintext";
           }
-          let html = highlighter.codeToHtml(attributes.content, { lang });
+          let html = highlighter.codeToHtml(attributes.content, { lang, theme });
           html = html.replace(PRE_SELECTOR, `<pre class="$1astro-code$2"`);
           if (attributes.language === "diff") {
             html = html.replace(
@@ -72,12 +72,19 @@ async function shiki({
               'style="$1; overflow-x: auto; white-space: pre-wrap; word-wrap: break-word;"'
             );
           }
+          const themeName = typeof theme === "string" ? theme : theme.name;
+          if (themeName === "css-variables") {
+            html = html.replace(INLINE_STYLE_SELECTOR_GLOBAL, (m) => replaceCssVariables(m));
+          }
           return unescapeHTML(html);
         }
       }
     }
   };
 }
+function replaceCssVariables(str) {
+  return str.replace(COLOR_REPLACEMENT_REGEX, (match) => ASTRO_COLOR_REPLACEMENTS[match] || match);
+}
 export {
   shiki as default
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@astrojs/markdoc",
   "description": "Add support for Markdoc in your Astro site",
-  "version": "0.5.1",
+  "version": "0.6.0",
   "type": "module",
   "types": "./dist/index.d.ts",
   "author": "withastro",
@@ -62,13 +62,13 @@
     "gray-matter": "^4.0.3",
     "htmlparser2": "^9.0.0",
     "kleur": "^4.1.5",
-    "shiki": "^0.14.3",
+    "shikiji": "^0.6.8",
     "zod": "3.21.1",
-    "@astrojs/internal-helpers": "0.2.0",
+    "@astrojs/internal-helpers": "0.2.1",
     "@astrojs/prism": "3.0.0"
   },
   "peerDependencies": {
-    "astro": "^3.2.2"
+    "astro": "^3.3.0"
   },
   "devDependencies": {
     "@types/chai": "^4.3.5",
@@ -81,13 +81,16 @@
     "mocha": "^10.2.0",
     "rollup": "^3.28.1",
     "vite": "^4.4.9",
-    "@astrojs/markdown-remark": "3.2.0",
-    "astro": "3.2.2",
+    "@astrojs/markdown-remark": "3.3.0",
+    "astro": "3.3.0",
     "astro-scripts": "0.0.14"
   },
   "engines": {
     "node": ">=18.14.1"
   },
+  "publishConfig": {
+    "provenance": true
+  },
   "scripts": {
     "build": "astro-scripts build \"src/**/*.ts\" && tsc",
     "build:ci": "astro-scripts build \"src/**/*.ts\"",