upgrade to marked 11

package.json

@@ -90,7 +90,6 @@
     "@size-limit/esbuild-why": "^8.2.6",
     "@size-limit/preset-small-lib": "^8.2.6",
     "@types/jest": "^29.0.0",
-    "@types/marked": "^2.0.0",
     "@types/react": "17.0.11",
     "@typescript-eslint/eslint-plugin": "^6.19.1",
     "@typescript-eslint/parser": "^6.19.1",
@@ -113,7 +112,8 @@
     "jest-environment-jsdom": "^29.6.4",
     "jest-jasmine2": "^29.6.4",
     "make-synchronous": "0.1.1",
-    "marked": "2.1.2",
+    "marked": "^11.2.0",
+    "marked-highlight": "^2.1.0",
     "microtime": "3.0.0",
     "next": "^14.1.0",
     "next-sitemap": "4.2.3",

website/src/static/markdown.ts

@@ -1,4 +1,5 @@
-import marked from 'marked';
+import { Marked } from 'marked';
+import { markedHighlight } from 'marked-highlight';
 import { Prism as prism } from './prism';
 import type { TypeDefs, CallSignature, TypeDefinition } from '../TypeDefs';
 
@@ -30,11 +31,16 @@ export function markdown(content: string, context: MarkdownContext) {
     qualifier: /\b[A-Z][a-z0-9_]+/g,
   });
 
-  marked.setOptions({
-    xhtml: true,
-    highlight: (code: string) =>
-      prism.highlight(code, prism.languages.javascript),
-  });
+  function highlight(code: string): string {
+    return prism.highlight(code, prism.languages.javascript);
+  }
+
+  const marked = new Marked(
+    markedHighlight({
+      langPrefix: 'hljs language-',
+      highlight,
+    })
+  );
 
   const renderer = new marked.Renderer();
 
@@ -56,14 +62,6 @@ export function markdown(content: string, context: MarkdownContext) {
   };
 
   renderer.code = function (code: string, lang: string, escaped: boolean) {
-    if (this.options.highlight) {
-      const out = this.options.highlight(code, lang);
-      if (out != null && out !== code) {
-        escaped = true;
-        code = out;
-      }
-    }
-
     const runItButton = runkitContext.activated
       ? '<a class="try-it" data-options="' +
         escape(JSON.stringify(runkitContext.options)) +
@@ -94,15 +92,10 @@ export function markdown(content: string, context: MarkdownContext) {
     'https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/';
 
   renderer.codespan = function (text: string) {
-    return (
-      '<code>' + decorateCodeSpan(text, this.options.highlight) + '</code>'
-    );
+    return '<code>' + decorateCodeSpan(text) + '</code>';
   };
 
-  function decorateCodeSpan(
-    text: string,
-    highlight?: (code: string, lang: string) => string | void
-  ) {
+  function decorateCodeSpan(text: string) {
     if (
       context.signatures &&
       PARAM_RX.test(text) &&
@@ -126,11 +119,7 @@ export function markdown(content: string, context: MarkdownContext) {
       }
     }
 
-    if (highlight) {
-      return highlight(unescapeCode(text), prism.languages.javascript);
-    }
-
-    return text;
+    return highlight(unescapeCode(text), prism.languages.javascript);
   }
 
   function findTypeRefLink(immutableNS: string, elements: Array<string>) {
@@ -157,7 +146,7 @@ export function markdown(content: string, context: MarkdownContext) {
   }
 
   // @ts-expect-error -- issue with "context", probably because we are on a really old version of marked
-  return marked(content, { renderer, context });
+  return marked.parse(content, { renderer, context });
 }
 
 function findDocsUrl(defs: TypeDefs, elements: Array<string>) {