WIP: render Drawio component

packages/app/src/services/renderer/renderer.tsx

@@ -351,6 +351,7 @@ export const generateViewOptions = (
     components.h2 = Header;
     components.h3 = Header;
     components.lsx = props => <Lsx {...props} forceToFetchData />;
+    components.drawio = props => <drawioPlugin.Drawio {...props} />;
   }
 
   // // Add configurers for viewer
@@ -423,6 +424,7 @@ export const generateSimpleViewOptions = (config: RendererConfig, pagePath: stri
   // add components
   if (components != null) {
     components.lsx = props => <Lsx {...props} />;
+    components.drawio = props => <drawioPlugin.Drawio {...props} />;
   }
 
   verifySanitizePlugin(options, false);
@@ -462,6 +464,7 @@ export const generatePreviewOptions = (config: RendererConfig, pagePath: string)
   // add components
   if (components != null) {
     components.lsx = props => <Lsx {...props} />;
+    components.drawio = props => <drawioPlugin.Drawio {...props} />;
   }
 
   // verifySanitizePlugin(options, false);

packages/remark-drawio-plugin/src/components/Drawio.tsx

@@ -0,0 +1,13 @@
+import React, { ReactNode } from 'react';
+
+type Props = {
+  drawioEmbedUri?: string,
+  children?: ReactNode,
+}
+
+export const Drawio = (props: Props): JSX.Element => {
+  const { children } = props;
+  const drawioEmbedUri = props.drawioEmbedUri ?? 'https://embed.diagrams.net/';
+
+  return <span>{children}</span>;
+};

packages/remark-drawio-plugin/src/index.ts

@@ -1,2 +1,2 @@
-// export * from './components';
+export * from './components/Drawio';
 export * from './services/renderer/remark-drawio-plugin';