diff --git a/__tests__/parseMarkdownToReactEmailJSX.test.ts b/__tests__/parseMarkdownToReactEmailJSX.test.ts index cf73d0c..5c6b37b 100644 --- a/__tests__/parseMarkdownToReactEmailJSX.test.ts +++ b/__tests__/parseMarkdownToReactEmailJSX.test.ts @@ -34,7 +34,7 @@ describe("Markdown to React Mail JSX Parser", () => { const markdown = "![alt text](image.jpg)"; const expected = `alt text`; + )}" alt="alt text" src="image.jpg">`; const rendered = parseMarkdownToReactEmailJSX({ markdown }); expect(rendered).toBe(expected); @@ -42,7 +42,7 @@ describe("Markdown to React Mail JSX Parser", () => { it("converts links correctly", () => { const markdown = "[Codeskills](https://codeskills.dev)"; - const expected = `Codeskills`; diff --git a/__tests__/reactEmailMarkdown.test.tsx b/__tests__/reactEmailMarkdown.test.tsx index 479c52e..3f13eff 100644 --- a/__tests__/reactEmailMarkdown.test.tsx +++ b/__tests__/reactEmailMarkdown.test.tsx @@ -8,7 +8,7 @@ describe("ReactEmailMarkdown component renders correctly", () => { ); expect(actualOutput).toMatchInlineSnapshot( - `"

Hello, World!

"` + `"

Hello, World!

"` ); }); }); diff --git a/src/components/reactEmailMarkdown.tsx b/src/components/reactEmailMarkdown.tsx index 81d591d..21417e6 100644 --- a/src/components/reactEmailMarkdown.tsx +++ b/src/components/reactEmailMarkdown.tsx @@ -1,7 +1,6 @@ import * as React from "react"; import { StylesType } from "../types"; import { parseMarkdownToReactEmailJSX } from "../utils"; -import { sanitize } from "isomorphic-dompurify"; interface ReactEmailMarkdownProps { markdown: string; @@ -25,7 +24,7 @@ export const ReactEmailMarkdown: React.FC = ({ return (
); }; diff --git a/src/styles.ts b/src/styles.ts index 2dedf78..5de9100 100644 --- a/src/styles.ts +++ b/src/styles.ts @@ -54,7 +54,7 @@ const codeInline = { fontSize: "87.5%", display: "inline", background: " #f8f8f8", - fontFamily: `SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace`, + fontFamily: `SFMono-Regular,Menlo,Monaco,Consolas,monospace`, }; const codeBlock = { diff --git a/src/utils.ts b/src/utils.ts index 94deb75..fa5dfe5 100644 --- a/src/utils.ts +++ b/src/utils.ts @@ -1,3 +1,4 @@ +import { sanitize } from "isomorphic-dompurify"; import { patterns } from "./patterns"; import { styles } from "./styles"; import { StylesType } from "./types"; @@ -205,15 +206,15 @@ export function parseMarkdownToReactEmailJSX({ // Handle headings (e.g., # Heading) reactMailTemplate = markdown.replace( patterns.h1, - `$1` + }>$1` ); reactMailTemplate = reactMailTemplate.replace( patterns.h2, - `$1` + }>$1` ); reactMailTemplate = reactMailTemplate.replace( patterns.h3, @@ -270,9 +271,11 @@ export function parseMarkdownToReactEmailJSX({ return `${cells .map( (cell, index) => - `${cell}` + )}">${cell}` ) .join("")}`; }) @@ -285,9 +288,9 @@ export function parseMarkdownToReactEmailJSX({ )}">${headers .map( (header, index) => - `${header}` + `${header}` ) .join("")}` + )}">` ); // Handle links (e.g., [link text](url)) @@ -346,9 +349,7 @@ export function parseMarkdownToReactEmailJSX({ patterns.link, `$1` + } style="${parseCssInJsToInlineCss(finalStyles.link)}" href="$2" >$1` ); // Handle code blocks (e.g., ```code```) @@ -389,5 +390,5 @@ export function parseMarkdownToReactEmailJSX({ } style="${parseCssInJsToInlineCss(finalStyles.hr)}" />` ); - return reactMailTemplate; + return sanitize(reactMailTemplate, { USE_PROFILES: { html: true } }); }