@shikijs/rehype 1.19.0 → 1.20.0

package/dist/core.d.mts

@@ -1,8 +1,8 @@
 import { HighlighterGeneric } from '@shikijs/types';
 import { Root } from 'hast';
 import { Transformer } from 'unified';
-import { R as RehypeShikiCoreOptions } from './shared/rehype.198b1df4.mjs';
-export { M as MapLike, a as RehypeShikiExtraOptions } from './shared/rehype.198b1df4.mjs';
+import { R as RehypeShikiCoreOptions } from './shared/rehype.7b862995.mjs';
+export { M as MapLike, a as RehypeShikiExtraOptions } from './shared/rehype.7b862995.mjs';
 import 'shiki';
 
 declare function rehypeShikiFromHighlighter(highlighter: HighlighterGeneric<any, any>, options: RehypeShikiCoreOptions): Transformer<Root, Root>;

package/dist/core.d.ts

@@ -1,8 +1,8 @@
 import { HighlighterGeneric } from '@shikijs/types';
 import { Root } from 'hast';
 import { Transformer } from 'unified';
-import { R as RehypeShikiCoreOptions } from './shared/rehype.198b1df4.js';
-export { M as MapLike, a as RehypeShikiExtraOptions } from './shared/rehype.198b1df4.js';
+import { R as RehypeShikiCoreOptions } from './shared/rehype.7b862995.js';
+export { M as MapLike, a as RehypeShikiExtraOptions } from './shared/rehype.7b862995.js';
 import 'shiki';
 
 declare function rehypeShikiFromHighlighter(highlighter: HighlighterGeneric<any, any>, options: RehypeShikiCoreOptions): Transformer<Root, Root>;

package/dist/core.mjs

@@ -1,30 +1,39 @@
-import { toString } from 'hast-util-to-string';
 import { visit } from 'unist-util-visit';
+import { toString } from 'hast-util-to-string';
 
-const InlineCodeProcessors = {
-  "tailing-curly-colon": ({ node, getLanguage, highlight }) => {
+const InlineCodeHandlers = {
+  "tailing-curly-colon": (_tree, node) => {
     const raw = toString(node);
     const match = raw.match(/(.+)\{:([\w-]+)\}$/);
     if (!match)
       return;
-    const lang = getLanguage(match[2]);
-    if (!lang)
-      return;
-    const code = match[1] ?? raw;
-    const fragment = highlight(lang, code);
-    if (!fragment)
-      return;
-    const head = fragment.children[0];
-    if (head.type === "element" && head.tagName === "pre") {
-      head.tagName = "span";
-    }
-    return fragment;
+    return {
+      type: "inline",
+      code: match[1] ?? raw,
+      lang: match.at(2)
+    };
   }
 };
+const languagePrefix$1 = "language-";
+const PreHandler = (_tree, node) => {
+  const head = node.children[0];
+  if (!head || head.type !== "element" || head.tagName !== "code" || !head.properties) {
+    return;
+  }
+  const classes = head.properties.className;
+  const languageClass = Array.isArray(classes) ? classes.find(
+    (d) => typeof d === "string" && d.startsWith(languagePrefix$1)
+  ) : void 0;
+  return {
+    type: "pre",
+    lang: typeof languageClass === "string" ? languageClass.slice(languagePrefix$1.length) : void 0,
+    code: toString(head),
+    meta: head.data?.meta ?? head.properties.metastring?.toString() ?? ""
+  };
+};
 
 const languagePrefix = "language-";
 function rehypeShikiFromHighlighter(highlighter, options) {
-  const langs = highlighter.getLoadedLanguages();
   const {
     addLanguageClass = false,
     parseMetaString,
@@ -34,13 +43,9 @@ function rehypeShikiFromHighlighter(highlighter, options) {
     onError,
     stripEndNewline = true,
     inline = false,
+    lazy = false,
     ...rest
   } = options;
-  function getLanguage(lang = defaultLanguage) {
-    if (lang && fallbackLanguage && !langs.includes(lang))
-      return fallbackLanguage;
-    return lang;
-  }
   function highlight(lang, code, metaString = "", meta = {}) {
     const cacheKey = `${lang}:${metaString}:${code}`;
     const cachedValue = cache?.get(cacheKey);
@@ -81,43 +86,63 @@ function rehypeShikiFromHighlighter(highlighter, options) {
         throw error;
     }
   }
-  function processPre(tree, node) {
-    const head = node.children[0];
-    if (!head || head.type !== "element" || head.tagName !== "code" || !head.properties) {
-      return;
+  return (tree) => {
+    const languageQueue = [];
+    const queue = [];
+    function getLanguage(lang) {
+      if (!lang)
+        return defaultLanguage;
+      if (highlighter.getLoadedLanguages().includes(lang))
+        return lang;
+      if (lazy) {
+        languageQueue.push(lang);
+        return lang;
+      }
+      if (fallbackLanguage)
+        return fallbackLanguage;
     }
-    const classes = head.properties.className;
-    const languageClass = Array.isArray(classes) ? classes.find(
-      (d) => typeof d === "string" && d.startsWith(languagePrefix)
-    ) : void 0;
-    const lang = getLanguage(
-      typeof languageClass === "string" ? languageClass.slice(languagePrefix.length) : void 0
-    );
-    if (!lang)
-      return;
-    const code = toString(head);
-    const metaString = head.data?.meta ?? head.properties.metastring?.toString() ?? "";
-    const meta = parseMetaString?.(metaString, node, tree) || {};
-    return highlight(lang, code, metaString, meta);
-  }
-  return function(tree) {
     visit(tree, "element", (node, index, parent) => {
+      let handler;
       if (!parent || index == null)
         return;
       if (node.tagName === "pre") {
-        const result = processPre(tree, node);
-        if (result) {
-          parent.children.splice(index, 1, ...result.children);
-        }
-        return "skip";
+        handler = PreHandler;
       }
       if (node.tagName === "code" && inline) {
-        const result = InlineCodeProcessors[inline]?.({ node, getLanguage, highlight });
-        if (result) {
-          parent.children.splice(index, 1, ...result.children);
-        }
+        handler = InlineCodeHandlers[inline];
       }
+      if (!handler)
+        return;
+      const res = handler(tree, node);
+      if (!res)
+        return;
+      const lang = getLanguage(res.lang);
+      if (!lang)
+        return;
+      const processNode = () => {
+        const meta = res.meta ? parseMetaString?.(res.meta, node, tree) : void 0;
+        const fragment = highlight(lang, res.code, res.meta, meta ?? {});
+        if (!fragment)
+          return;
+        if (res.type === "inline") {
+          const head = fragment.children[0];
+          if (head.type === "element" && head.tagName === "pre") {
+            head.tagName = "span";
+          }
+        }
+        parent.children.splice(index, 1, ...fragment.children);
+      };
+      if (lazy)
+        queue.push(processNode);
+      else
+        processNode();
+      return "skip";
     });
+    if (lazy) {
+      return highlighter.loadLanguage(...languageQueue).then(() => {
+        queue.forEach((fn) => fn());
+      });
+    }
   };
 }
 

package/dist/index.d.mts

@@ -2,7 +2,7 @@ import { LanguageInput } from '@shikijs/types';
 import { Root } from 'hast';
 import { BuiltinLanguage } from 'shiki';
 import { Plugin } from 'unified';
-import { R as RehypeShikiCoreOptions } from './shared/rehype.198b1df4.mjs';
+import { R as RehypeShikiCoreOptions } from './shared/rehype.7b862995.mjs';
 
 type RehypeShikiOptions = RehypeShikiCoreOptions & {
     /**

package/dist/index.d.ts

@@ -2,7 +2,7 @@ import { LanguageInput } from '@shikijs/types';
 import { Root } from 'hast';
 import { BuiltinLanguage } from 'shiki';
 import { Plugin } from 'unified';
-import { R as RehypeShikiCoreOptions } from './shared/rehype.198b1df4.js';
+import { R as RehypeShikiCoreOptions } from './shared/rehype.7b862995.js';
 
 type RehypeShikiOptions = RehypeShikiCoreOptions & {
     /**

package/dist/index.mjs

@@ -1,7 +1,7 @@
 import { bundledLanguages, getSingletonHighlighter } from 'shiki';
 import rehypeShikiFromHighlighter from './core.mjs';
-import 'hast-util-to-string';
 import 'unist-util-visit';
+import 'hast-util-to-string';
 
 const rehypeShiki = function(options = {}) {
   const themeNames = ("themes" in options ? Object.values(options.themes) : [options.theme]).filter(Boolean);

package/dist/shared/{rehype.198b1df4.d.mts → rehype.7b862995.d.mts}

@@ -18,8 +18,17 @@ interface RehypeShikiExtraOptions {
     defaultLanguage?: string;
     /**
      * The fallback language to use when specified language is not loaded
+     *
+     * Ignored if `lazy` is enabled
      */
     fallbackLanguage?: string;
+    /**
+     * Load languages and themes on-demand.
+     * When enable, this would make requires the unified pipeline to be async.
+     *
+     * @default false
+     */
+    lazy?: boolean;
     /**
      * `mdast-util-to-hast` adds a newline to the end of code blocks
      *

package/dist/shared/{rehype.198b1df4.d.ts → rehype.7b862995.d.ts}

@@ -18,8 +18,17 @@ interface RehypeShikiExtraOptions {
     defaultLanguage?: string;
     /**
      * The fallback language to use when specified language is not loaded
+     *
+     * Ignored if `lazy` is enabled
      */
     fallbackLanguage?: string;
+    /**
+     * Load languages and themes on-demand.
+     * When enable, this would make requires the unified pipeline to be async.
+     *
+     * @default false
+     */
+    lazy?: boolean;
     /**
      * `mdast-util-to-hast` adds a newline to the end of code blocks
      *

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@shikijs/rehype",
   "type": "module",
-  "version": "1.19.0",
+  "version": "1.20.0",
   "description": "rehype integration for shiki",
   "author": "Anthony Fu <anthonyfu117@hotmail.com>",
   "license": "MIT",
@@ -49,15 +49,15 @@
     "hast-util-to-string": "^3.0.0",
     "unified": "^11.0.5",
     "unist-util-visit": "^5.0.0",
-    "@shikijs/types": "1.19.0",
-    "shiki": "1.19.0"
+    "@shikijs/types": "1.20.0",
+    "shiki": "1.20.0"
   },
   "devDependencies": {
     "rehype-raw": "^7.0.0",
     "rehype-stringify": "^10.0.0",
     "remark-parse": "^11.0.0",
     "remark-rehype": "^11.1.1",
-    "@shikijs/transformers": "1.19.0"
+    "@shikijs/transformers": "1.20.0"
   },
   "scripts": {
     "build": "unbuild",