Merge pull request #253 from jaredwray/adding-support-for-mdx

adding support for mdx

README.md

@@ -26,6 +26,7 @@
 * Markdown to HTML (rehype-stringify).
 * Github Flavor Markdown (remark-gfm).
 * Emoji Support (remark-emoji).
+* MDX Support (remark-mdx).
 
 ## Getting Started 
 
@@ -88,12 +89,13 @@ import { Writr, WritrOptions } from 'writr';
 const writrOptions = {
   openai: 'your-api-key', // openai api key (default: undefined)
   renderOptions: {
-	emoji: true,
-	toc: true,
-	slug: true,
-	highlight: true,
-	gfm: true,
-	math: true
+    emoji: true,
+    toc: true,
+    slug: true,
+    highlight: true,
+    gfm: true,
+    math: true,
+    mdx: true
   }
 };
 const writr = new Writr(writrOptions);

package.json

@@ -1,6 +1,6 @@
 {
   "name": "writr",
-  "version": "3.1.0",
+  "version": "3.2.0",
   "description": "Markdown Rendering Simplified",
   "type": "module",
   "exports": "./dist/writr.js",
@@ -57,6 +57,7 @@
     "remark-emoji": "^4.0.1",
     "remark-gfm": "^4.0.0",
     "remark-math": "^6.0.0",
+    "remark-mdx": "^3.0.1",
     "remark-parse": "^11.0.0",
     "remark-rehype": "^11.1.0",
     "remark-toc": "^9.0.0",

src/writr.ts

@@ -9,6 +9,7 @@ import remarkMath from 'remark-math';
 import rehypeKatex from 'rehype-katex';
 import remarkGfm from 'remark-gfm';
 import remarkEmoji from 'remark-emoji';
+import remarkMDX from 'remark-mdx';
 import parse, {type HTMLReactParserOptions} from 'html-react-parser';
 import type React from 'react';
 
@@ -24,6 +25,7 @@ type RenderOptions = {
 	highlight?: boolean; // Code highlighting (default: true)
 	gfm?: boolean; // Github flavor markdown (default: true)
 	math?: boolean; // Math support (default: true)
+	mdx?: boolean; // MDX support (default: true)
 };
 
 class Writr {
@@ -37,6 +39,7 @@ class Writr {
 		.use(remarkMath) // Add math support
 		.use(rehypeKatex) // Add math support
 		.use(rehypeHighlight) // Apply syntax highlighting
+		.use(remarkMDX) // Add MDX support
 		.use(rehypeStringify); // Stringify HTML
 
 	private readonly _options: WritrOptions = {
@@ -48,6 +51,7 @@ class Writr {
 			highlight: true,
 			gfm: true,
 			math: true,
+			mdx: true,
 		},
 	};
 
@@ -133,6 +137,14 @@ class Writr {
 			processor.use(rehypeHighlight);
 		}
 
+		if (options.math) {
+			processor.use(remarkMath).use(rehypeKatex);
+		}
+
+		if (options.mdx) {
+			processor.use(remarkMDX);
+		}
+
 		processor.use(rehypeStringify);
 
 		return processor;