Merge pull request #5 from mintlify/ronan/revert-v0.1.0

Revert "Merge pull request #4 from mintlify/ronan/bump-next-mdx-remote"

Author: rpmccarter

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mintlify/mdx",
-  "version": "0.1.0",
+  "version": "0.0.45",
   "description": "Markdown parser from Mintlify",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -36,7 +36,6 @@
     "@mintlify/eslint-config-typescript": "^1.0.9",
     "@mintlify/ts-config": "^2.0.2",
     "@tsconfig/recommended": "1.x",
-    "@types/react": "^18.3.3",
     "@typescript-eslint/eslint-plugin": "6.x",
     "@typescript-eslint/parser": "6.x",
     "eslint": "8.x",
@@ -47,15 +46,13 @@
     "typescript": "^5.2.2"
   },
   "dependencies": {
-    "@types/hast": "^3.0.4",
-    "@types/unist": "^3.0.2",
-    "hast-util-to-string": "^3.0.0",
-    "next-mdx-remote": "^5.0.0",
-    "refractor": "^4.8.1",
-    "rehype-katex": "^7.0.0",
-    "remark-gfm": "^4.0.0",
-    "remark-math": "^6.0.0",
-    "remark-smartypants": "^3.0.1",
-    "unist-util-visit": "^5.0.0"
+    "hast-util-to-string": "^2.0.0",
+    "next-mdx-remote": "^4.4.1",
+    "refractor": "^4.8.0",
+    "rehype-katex": "^6.0.3",
+    "remark-gfm": "^3.0.1",
+    "remark-math": "^5.1.1",
+    "remark-smartypants": "^2.0.0",
+    "unist-util-visit": "^4.1.1"
   }
 }

src/plugins/rehype/rehypeSyntaxHighlighting.ts

@@ -1,14 +1,7 @@
-import { toString } from "hast-util-to-string";
+import { Node, toString } from "hast-util-to-string";
 import { refractor } from "refractor/lib/all.js";
 import { visit } from "unist-util-visit";
-import { Node, Parent } from "unist";
-import { Element } from "hast";
-
-const languagePrefix = "language-";
-
-function isElement(node: Node): node is Element {
-  return node.type === "element";
-}
+import { Parent } from "unist";
 
 export const rehypeSyntaxHighlighting = (options: {
   ignoreMissing?: boolean;
@@ -19,59 +12,70 @@ export const rehypeSyntaxHighlighting = (options: {
   }
 
   return (tree: Parent) => {
-    visit(tree, isElement, (node, _, parent) => {
-      if (
-        !parent ||
-        !isElement(parent) ||
-        parent.tagName !== "pre" ||
-        node.tagName !== "code"
-      ) {
-        return;
-      }
-
-      const lang = getLanguage(node);
+    visit(
+      tree,
+      "element",
+      (
+        node: Node & {
+          tagName: string;
+          children: Node[];
+          properties: {
+            className?: string[];
+          };
+        },
+        _index,
+        parent?: {
+          tagName: string;
+          properties: {
+            className?: string[];
+          };
+        }
+      ) => {
+        if (!parent || parent.tagName !== "pre" || node.tagName !== "code") {
+          return;
+        }
 
-      if (lang === null) {
-        return;
-      }
+        const lang = getLanguage(node);
 
-      try {
-        const existingClassName = parent.properties.className ?? [];
-        if (Array.isArray(existingClassName)) {
-          parent.properties.className = [
-            ...existingClassName,
-            languagePrefix + lang,
-          ];
+        if (lang === null) {
+          return;
         }
-        const result = refractor.highlight(toString(node), lang);
 
-        // @ts-expect-error refractor uses outdated version of @types/hast
-        node.children = result.children;
-      } catch (err) {
-        if (
-          options.ignoreMissing &&
-          /Unknown language/.test((err as Error).message)
-        ) {
-          return;
+        let result;
+        try {
+          parent.properties.className = (
+            parent.properties.className || []
+          ).concat("language-" + lang);
+          result = refractor.highlight(toString(node), lang);
+          node.children = result.children;
+        } catch (err) {
+          if (
+            options.ignoreMissing &&
+            /Unknown language/.test((err as Error).message)
+          ) {
+            return;
+          }
+          throw err;
         }
-        throw err;
       }
-    });
+    );
   };
 };
 
-function getLanguage(node: Element) {
-  const className = node.properties.className || [];
-  if (!Array.isArray(className)) {
-    return null;
+function getLanguage(
+  node: Node & {
+    tagName: string;
+    children: Node[];
+    properties: {
+      className?: string[];
+    };
   }
+) {
+  const className = node.properties.className || [];
 
   for (const classListItem of className) {
-    if (
-      typeof classListItem === "string" &&
-      classListItem.startsWith(languagePrefix)
-    ) {
-      return classListItem.slice(languagePrefix.length).toLowerCase();
+    if (classListItem.slice(0, 9) === "language-") {
+      return classListItem.slice(9).toLowerCase();
     }
   }
 

tsconfig.json

@@ -5,7 +5,10 @@
     "jsx": "react-jsx",
     "target": "ES2021",
     "outDir": "dist",
-    "declaration": true
+    "declaration": true,
+    "moduleResolution": "node",
+    "module": "esnext",
+    "allowJs": true
   },
   "include": ["**/*.ts", "**/*.tsx"],
   "exclude": ["node_modules", "dist"]