refactor: Optimize renderKatex

cSpell.json

@@ -80,6 +80,7 @@
     "logmsg",
     "lucida",
     "markdownish",
+    "mathml",
     "matthieu",
     "matthieumorel",
     "mdast",

packages/mermaid/package.json

@@ -91,6 +91,7 @@
     "@types/d3-shape": "^3.1.1",
     "@types/dompurify": "^3.0.2",
     "@types/jsdom": "^21.1.1",
+    "@types/katex": "^0.16.7",
     "@types/lodash-es": "^4.17.7",
     "@types/micromatch": "^4.0.2",
     "@types/prettier": "^2.7.2",

packages/mermaid/src/diagrams/common/common.ts

@@ -318,9 +318,15 @@ export const calculateMathMLDimensions = async (text: string, config: MermaidCon
  * @returns String containing MathML if KaTeX is supported, or an error message if it is not and stylesheets aren't present
  */
 export const renderKatex = async (text: string, config: MermaidConfig): Promise<string> => {
-  if (hasKatex(text) && (isMathMLSupported() || config.legacyMathML)) {
+  if (!hasKatex(text)) {
-    // @ts-ignore @types/katex does not work
+    return text;
-    const katex = (await import('katex')).default;
+  }
+
+  if (!isMathMLSupported() && !config.legacyMathML) {
+    return text.replace(katexRegex, 'MathML is unsupported in this environment.');
+  }
+
+  const { default: katex } = await import('katex');
   return text
     .split(lineBreakRegex)
     .map((line) =>
@@ -333,7 +339,7 @@ export const renderKatex = async (text: string, config: MermaidConfig): Promise<
         : `<div>${line}</div>`
     )
     .join('')
-      .replace(katexRegex, (r, c) =>
+    .replace(katexRegex, (_, c) =>
       katex
         .renderToString(c, {
           throwOnError: true,
@@ -343,8 +349,6 @@ export const renderKatex = async (text: string, config: MermaidConfig): Promise<
         .replace(/\n/g, ' ')
         .replace(/<annotation.*<\/annotation>/g, '')
     );
-  }
-  return text.replace(katexRegex, 'MathML is unsupported in this environment.');
 };
 
 export default {

pnpm-lock.yaml

@@ -279,6 +279,9 @@ importers:
       '@types/jsdom':
         specifier: ^21.1.1
         version: 21.1.1
+      '@types/katex':
+        specifier: ^0.16.7
+        version: 0.16.7
       '@types/lodash-es':
         specifier: ^4.17.7
         version: 4.17.7
@@ -4944,6 +4947,10 @@ packages:
     resolution: {integrity: sha512-Hr5Jfhc9eYOQNPYO5WLDq/n4jqijdHNlDXjuAQkkt+mWdQR+XJToOHrsD4cPaMXpn6KO7y2+wM8AZEs8VpBLVA==}
     dev: true
 
+  /@types/katex@0.16.7:
+    resolution: {integrity: sha512-HMwFiRujE5PjrgwHQ25+bsLJgowjGjm5Z8FVSf0N6PwgJrwxH0QxzHYDcKsTfV3wva0vzrpqMTJS2jXPr5BMEQ==}
+    dev: true
+
   /@types/keyv@3.1.4:
     resolution: {integrity: sha512-BQ5aZNSCpj7D6K2ksrRCTmKRLEpnPvWDiLPfoGyhZ++8YtiK9d/3DBKPJgry359X/P1PfruyYwvnvwFjuEiEIg==}
     dependencies: