rspress-plugin-mermaid 0.1.3-beta.0 → 0.1.4-beta.0

package/dist/index.js

@@ -1,12 +1,12 @@
 import path from 'node:path';
-import { PresetConfigMutator, RemarkCodeBlockToGlobalComponentPluginFactory, getCompatComponentPath, } from 'rspress-plugin-devkit';
+import { PresetConfigMutator, RemarkCodeBlockToGlobalComponentPluginFactory, } from 'rspress-plugin-devkit';
 export default function rspressPluginMermaid(options = {}) {
     const { mermaidConfig = {} } = options;
     const remarkMermaid = new RemarkCodeBlockToGlobalComponentPluginFactory({
         components: [
             {
                 lang: 'mermaid',
-                componentPath: path.join(__dirname, './components', getCompatComponentPath(__dirname, 'MermaidRender.tsx')),
+                componentPath: path.join(__dirname, '../components', 'MermaidRender.tsx'),
                 childrenProvider() {
                     return [];
                 },

package/dist/typings.d.ts

@@ -0,0 +1,5 @@
+import type { MermaidConfig } from 'mermaid';
+export interface MermaidRendererProps {
+    code: string;
+    config?: MermaidConfig;
+}

package/dist/typings.js

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rspress-plugin-mermaid",
-  "version": "0.1.3-beta.0",
+  "version": "0.1.4-beta.0",
   "description": "Rspress plugin to render mermaid diagrams",
   "files": [
     "dist"
@@ -28,7 +28,7 @@
   "dependencies": {
     "@rspress/shared": "^1.17.1",
     "mermaid": "^10.9.0",
-    "rspress-plugin-devkit": "^0.1.3-beta.0"
+    "rspress-plugin-devkit": "^0.1.3"
   },
   "devDependencies": {
     "@types/node": "^20.12.5",

package/dist/components/MermaidRender.d.ts

@@ -1,8 +0,0 @@
-import React from 'react';
-import { type MermaidConfig } from 'mermaid';
-export interface MermaidRendererProps {
-    code: string;
-    config?: MermaidConfig;
-}
-declare const MermaidRenderer: React.FC<MermaidRendererProps>;
-export default MermaidRenderer;

package/dist/components/MermaidRender.js

@@ -1,32 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
-import { useEffect, useId, useState } from 'react';
-import mermaid from 'mermaid';
-const MermaidRenderer = (props) => {
-    const { code, config = {} } = props;
-    const id = useId();
-    const [svg, setSvg] = useState('');
-    const [renderError, setRenderError] = useState(false);
-    async function renderMermaid2SVG() {
-        // https://github.com/mermaid-js/mermaid/blob/1b40f552b20df4ab99a986dd58c9d254b3bfd7bc/packages/mermaid/src/docs/.vitepress/theme/Mermaid.vue#L53
-        const hasDarkClass = document.documentElement.classList.contains('dark');
-        const mermaidConfig = {
-            securityLevel: 'loose',
-            startOnLoad: false,
-            theme: hasDarkClass ? 'dark' : 'default',
-            ...config,
-        };
-        try {
-            mermaid.initialize(mermaidConfig);
-            const { svg } = await mermaid.render(id.replace(/:/g, ''), code);
-            setSvg(svg);
-        }
-        catch (error) {
-            setRenderError(true);
-        }
-    }
-    useEffect(() => {
-        renderMermaid2SVG();
-    }, [code]);
-    return (_jsx(_Fragment, { children: renderError ? null : _jsx("div", { dangerouslySetInnerHTML: { __html: svg } }) }));
-};
-export default MermaidRenderer;