docs: improve doc rendering

Change-Id: I6a6a6964b1def9e8e9109fbd9319fa32595f1b72

docs/highlighter.js

@@ -0,0 +1,111 @@
+"use strict";
+
+const { bundledLanguages, bundledThemes } = require("shiki");
+const { createHighlighterCoreSync } = require("shiki/core");
+const { createJavaScriptRegexEngine } = require("shiki/engine/javascript");
+const { transformerColorizedBrackets } = require("@shikijs/colorized-brackets");
+
+const schemeGrammar = require('tm-grammars/grammars/scheme.json');
+const baseTheme = structuredClone(require("@shikijs/themes/github-light").default);
+
+baseTheme.tokenColors.unshift({
+  scope: ["comment.output"],
+  settings: { foreground: '#052b57', fontStyle: 'italic' }
+}, {
+  scope: ["comment.console"],
+  settings: { foreground: '#005cc5', fontStyle: 'italic' }
+}, {
+  scope: ["comment.note"],
+  settings: { foreground: '#6a737d', fontStyle: 'italic' }
+}, {
+  scope: ["comment.hide"],
+  settings: { foreground: '#052b59', fontStyle: 'bold' }
+});
+
+const patchScheme = () => {
+  const myLang = structuredClone(schemeGrammar);
+
+  // Add special comment patterns
+  myLang.repository.comment.patterns.splice(0, 0, {
+    begin: ';;( ?)',
+    beginCaptures: { '0': { name: 'comment.hide' } },
+    end: '\\n',
+    name: 'comment.output'
+  }, {
+    begin: ';!( ?)',
+    beginCaptures: { '0': { name: 'comment.hide' } },
+    end: '\\n',
+    name: 'comment.note'
+  }, {
+    begin: ';>( ?)',
+    beginCaptures: { '0': { name: 'comment.hide' } },
+    end: '\\n',
+    name: 'comment.console'
+  });
+
+  // copy all quote patterns to work with not just 'foo but with #$foo and #~foo
+  // for zexps
+  let patterns = myLang.repository.quote.patterns;
+  for (let item of structuredClone(patterns)) {
+    if (item.match) {
+      item.match = item.match.replace("(')", "(#[$~])");
+    }
+    if (item.begin) {
+      item.begin = item.begin.replace("(')", "(#[$~])");
+    }
+
+    patterns.push(item);
+  }
+
+  return myLang;
+}
+
+const highlighter = createHighlighterCoreSync({
+  themes: [baseTheme],
+  langs: [
+    patchScheme(),
+    require("@shikijs/langs/shellsession").default,
+    require("@shikijs/langs/bash").default,
+    require("@shikijs/langs/nix").default,
+  ],
+  engine: createJavaScriptRegexEngine(),
+});
+
+const commentHider = {
+  tokens(tokens) {
+    for (const line of tokens) {
+      for (const token of line) {
+        for (const expl of token.explanation ?? []) {
+          if (expl.scopes.find(a => a.scopeName === 'comment.hide')) {
+            token.htmlStyle ||= {}
+            token.htmlStyle["font-size"] = '0';
+            break;
+          }
+        }
+      }
+    }
+  }
+}
+
+class ShikiHighlighter {
+  format(node, lang, opts = {}) {
+    return node.getContent();
+  }
+
+  highlight(node, source, lang, opts) {
+    return highlighter.codeToHtml(source, {
+      lang,
+      theme: "github-light",
+      transformers: [transformerColorizedBrackets(), commentHider]
+    });
+  }
+
+  handlesHighlighting() {
+    return true;
+  }
+}
+
+module.exports = function(registry) {
+  const { SyntaxHighlighter } = registry.$$class.$$base_module.$$base_module.$$;
+  SyntaxHighlighter.register("shiki", ShikiHighlighter);
+}