feat(shiki): allow custom highlighters

Author: avivkeller

packages/rehype-shiki/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@node-core/rehype-shiki",
-  "version": "1.2.0",
+  "version": "1.3.0",
   "type": "module",
   "exports": {
     ".": "./src/index.mjs",

packages/rehype-shiki/src/highlighter.mjs

@@ -18,12 +18,20 @@ export const getLanguageByName = (language, langs) => {
   );
 };
 
+/**
+ * @typedef {Object} SyntaxHighlighter
+ * @property {import('@shikijs/core').HighlighterCoreSync} shiki - The underlying shiki core instance.
+ * @property {(code: string, lang: string, meta?: Record<string, any>) => string} highlightToHtml - Highlights code and returns inner HTML of the <code> tag.
+ * @property {(code: string, lang: string, meta?: Record<string, any>) => any} highlightToHast - Highlights code and returns a HAST tree.
+ */
+
 /**
  * Factory function to create a syntax highlighter instance with utility methods.
  *
  * @param {Object} params - Parameters for highlighter creation.
  * @param {import('@shikijs/core').HighlighterCoreOptions} [params.coreOptions] - Core options for the highlighter.
  * @param {import('@shikijs/core').CodeToHastOptions} [params.highlighterOptions] - Additional options for highlighting.
+ * @returns {SyntaxHighlighter}
  */
 const createHighlighter = ({ coreOptions = {}, highlighterOptions = {} }) => {
   const options = {

packages/rehype-shiki/src/index.mjs

@@ -21,8 +21,8 @@ import createHighlighter, { getLanguageByName } from './highlighter.mjs';
  * @property {boolean} [wasm=false] - Enable WebAssembly for the regex engine
  * @property {boolean} [twoslash=false] - Enable twoslash
  * @property {import('@shikijs/twoslash').TransformerTwoslashIndexOptions} [twoslashOptions] - Twoslash configuration options
- * @param {import('@shikijs/core').HighlighterCoreOptions} [coreOptions] - Core options for the highlighter.
- * @param {import('@shikijs/core').CodeToHastOptions} [highlighterOptions] - Additional options for highlighting.
+ * @property {import('@shikijs/core').HighlighterCoreOptions} [coreOptions] - Core options for the highlighter.
+ * @property {import('@shikijs/core').CodeToHastOptions} [highlighterOptions] - Additional options for highlighting.
  */
 
 /**

packages/rehype-shiki/src/plugin.mjs

@@ -54,12 +54,10 @@ function isCodeBlock(node) {
 }
 
 /**
- * @param {import('./index.mjs').HighlighterOptions} options
+ * @param {import('./index.mjs').HighlighterOptions & { highlighter: import('./highlighter.mjs').SyntaxHighlighter }} options
  */
-export default function rehypeShikiji(options) {
-  let highlighter;
-
-  return async function (tree) {
+export default ({ highlighter, ...options }) =>
+  async tree => {
     highlighter ??= await createHighlighter(options);
 
     visit(tree, 'element', (_, index, parent) => {
@@ -195,4 +193,3 @@ export default function rehypeShikiji(options) {
       parent.children.splice(index, 1, ...children);
     });
   };
-}