chore(markdown): move out of md-to-react-email

[gabrielmfern]

This addresses some comments on #2335.

Currently, our Markdown package heavily relies on md-to-react-email, this makes it much harder for us to fix issues on the Markdown component, and makes it significantly harder for the community to contribute to the component.

This pull requests moves in most of the code from md-to-react-email that we needed, while updating the dependency on marked (which actually fixes the issue), and simplifying the code a bit more. This move shouldn't bring much of a maintenance burden to us, because md-to-react-email was more of a thin-wrapper around marked which actually does much of the heavy lifting.

In the future I think we need to find some way to converting the Markdown content into actual React elements, using our components for a better compatibility, and probably easier maintenance.

---

Summary by cubic

Moved Markdown rendering in-house by replacing md-to-react-email with a custom marked-based renderer. This fixes the Markdown issue and makes the component easier to maintain and contribute to.

• Refactors

  • Re-implemented Markdown with marked and a custom Renderer that applies inline styles via parseCssInJsToInlineCss.
  • Added local default styles (styles.ts) that can be overridden with markdownCustomStyles.
  • Dropped md-to-react-email and now depend on [email protected]. No API changes.

• Bug Fixes

  • Resolves the Markdown rendering issue in Emojis do not render correctly in <Markdown /> #2335 by updating the parser and handling all elements with the custom renderer.

[changeset-bot]

🦋 Changeset detected

Latest commit: 8cf06ac

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 2 packages

Name	Type
@react-email/markdown	Patch
@react-email/components	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Preview	Comments	Updated (UTC)
react-email	Ready	Preview	Comment	Oct 17, 2025 0:49am
react-email-demo	Ready	Preview	Comment	Oct 17, 2025 0:49am

[pkg-pr-new]

Open in StackBlitz

npm i https://pkg.pr.new/resend/react-email/@react-email/markdown@2569

commit: 8cf06ac

[gabrielmfern]

@cubic-dev-ai review

[cubic-dev-ai]

@cubic-dev-ai review

@gabrielmfern I've started the AI code review. It'll take a few minutes to complete.

[cubic-dev-ai]

2 issues found across 6 files

Prompt for AI agents (all 2 issues)

Understand the root cause of the following 2 issues and fix them.


<file name="packages/markdown/src/utils/parse-css-in-js-to-inline-css.ts">

<violation number="1" location="packages/markdown/src/utils/parse-css-in-js-to-inline-css.ts:41">
`lineHeight` must stay unitless. Appending `px` turns values like `1.5` into `1.5px`, collapsing line-height and breaking layout.</violation>
</file>

<file name="packages/markdown/src/markdown.tsx">

<violation number="1" location="packages/markdown/src/markdown.tsx:100">
Image attributes are interpolated without escaping, so characters like quotes in the alt or title break the attribute boundary and allow HTML/script injection. Please HTML-escape attribute values (src/title/alt) before embedding them.</violation>
</file>

_{React with 👍 or 👎 to teach cubic. Mention @cubic-dev-ai to give feedback, ask questions, or re-run the review.}

[cubic-dev-ai]

2 issues found across 6 files

Prompt for AI agents (all 2 issues)

Understand the root cause of the following 2 issues and fix them.


<file name="packages/markdown/src/utils/parse-css-in-js-to-inline-css.ts">

<violation number="1" location="packages/markdown/src/utils/parse-css-in-js-to-inline-css.ts:41">
Please treat numeric lineHeight as unitless; adding it to the px allowlist forces values like 1.5 to become 1.5px and collapses layout spacing.</violation>
</file>

<file name="packages/markdown/src/styles.ts">

<violation number="1" location="packages/markdown/src/styles.ts:57">
Spreading `codeInline` into `codeBlock` carries over `display: &#39;inline&#39;`, so the `&lt;pre&gt;` emitted by the renderer now renders inline instead of block, breaking code block layout.</violation>
</file>

_{React with 👍 or 👎 to teach cubic. Mention @cubic-dev-ai to give feedback, ask questions, or re-run the review.}

[socket-security]

Review the following changes in direct dependencies. Learn more about Socket for GitHub.

Diff	Package	Supply Chain Security	Vulnerability	Quality	Maintenance	License
	commander@​13.1.0

View full report