feat: add mdx

packages/react/package.json

@@ -12,6 +12,7 @@
     "build-storybook": "storybook build"
   },
   "dependencies": {
+    "@mdx-js/react": "^3.0.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-router-dom": "^6.23.1",
@@ -19,6 +20,7 @@
   },
   "devDependencies": {
     "@chromatic-com/storybook": "^1.3.5",
+    "@mdx-js/rollup": "^3.0.1",
     "@storybook/addon-essentials": "^8.1.0",
     "@storybook/addon-interactions": "^8.1.0",
     "@storybook/addon-links": "^8.1.0",
@@ -28,6 +30,7 @@
     "@storybook/react": "^8.1.0",
     "@storybook/react-vite": "^8.1.0",
     "@storybook/test": "^8.1.0",
+    "@types/mdx": "^2.0.13",
     "@types/react": "^18.2.66",
     "@types/react-dom": "^18.2.22",
     "@types/react-router-dom": "^5.3.3",

packages/react/vite.config.ts

@@ -1,10 +1,11 @@
 import { defineConfig } from "vite";
 import react from "@vitejs/plugin-react";
 import tailwindcss from "tailwindcss";
+import mdx from '@mdx-js/rollup';
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [react()],
+  plugins: [react(), mdx()],
   css: {
     postcss: {
       plugins: [tailwindcss()],