Merge pull request #666 from sudhanshutech/html/support

Html tag support in markdown component
layer5io · Jul 4, 2024 · 369d3ea · 369d3ea
2 parents cff50a2 + 349a505
commit 369d3ea
Show file tree

Hide file tree

Showing 3 changed files with 272 additions and 0 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -67,6 +67,7 @@
     "prettier-plugin-organize-imports": "^3.2.3",
     "react-error-boundary": "^4.0.12",
     "react-markdown": "^8.0.7",
+    "rehype-raw": "^6.1.1",
     "remark-gfm": "^3.0.1",
     "ts-jest": "^29.1.1",
     "tsup": "^8.0.1",

diff --git a/src/custom/Markdown/index.tsx b/src/custom/Markdown/index.tsx
@@ -1,4 +1,5 @@
 import ReactMarkdown from 'react-markdown';
+import rehypeRaw from 'rehype-raw';
 import remarkGfm from 'remark-gfm';
 import {
   StyledMarkdown,
@@ -24,6 +25,7 @@ export const RenderMarkdown: React.FC<RenderMarkdownProps> = ({ content }) => {
   return (
     <ReactMarkdown
       remarkPlugins={[remarkGfm]}
+      rehypePlugins={[rehypeRaw]}
       components={{
         p: ({ ...props }) => <StyledMarkdownP>{props.children}</StyledMarkdownP>,
         a: ({ ...props }) => (