From 41052635ad444be6e17b31788060944fc9aedde8 Mon Sep 17 00:00:00 2001
From: Gustav Ahlberg <Gustav.Ahlberg@gmail.com>
Date: Mon, 26 Oct 2026 18:09:33 +0100
Subject: [PATCH] fix(react-email): render block tokens in tight list items

Parse every list item with marked's loose flag so tight text stays bare and block tokens still render.

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 .changeset/tight-list-blocks.md               |  5 ++
 .../src/components/markdown/markdown.spec.tsx | 47 +++++++++++++++++--
 .../src/components/markdown/markdown.tsx      |  6 +--
 3 files changed, 49 insertions(+), 9 deletions(-)
 create mode 100644 .changeset/tight-list-blocks.md

diff --git a/.changeset/tight-list-blocks.md b/.changeset/tight-list-blocks.md
new file mode 100644
index 0000000000..fa1506a710
--- /dev/null
+++ b/.changeset/tight-list-blocks.md
@@ -0,0 +1,5 @@
+---
+"react-email": patch
+---
+
+render block tokens in tight list items
diff --git a/packages/react-email/src/components/markdown/markdown.spec.tsx b/packages/react-email/src/components/markdown/markdown.spec.tsx
index 5c39487c73..9f39d0d976 100644
--- a/packages/react-email/src/components/markdown/markdown.spec.tsx
+++ b/packages/react-email/src/components/markdown/markdown.spec.tsx
@@ -202,14 +202,12 @@ console.log(\`Hello, $\{name}!\`);
     );
     expect(actualOutput).toMatchInlineSnapshot(`
       "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><!--$--><div data-id="react-email-markdown"><ul>
-      <li><p>parent list item</p>
-      <ul>
+      <li>parent list item<ul>
       <li>nested list item 1</li>
       <li>nested list item 2</li>
       </ul>
       </li>
-      <li><p>another parent item</p>
-      <ol>
+      <li>another parent item<ol>
       <li>nested ordered item 1</li>
       <li>nested ordered item 2</li>
       </ol>
@@ -218,6 +216,47 @@ console.log(\`Hello, $\{name}!\`);
       </div><!--/$-->"
     `);
   });
+
+  it('renders a tight list followed by a heading and paragraph', async () => {
+    const actualOutput = await render(
+      <Markdown>{'- Hello\n ## Heading\n body\n'}</Markdown>,
+    );
+    expect(actualOutput).toMatchInlineSnapshot(`
+      "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><!--$--><div data-id="react-email-markdown"><ul>
+      <li>Hello</li>
+      </ul>
+      <h2 style="font-weight:500;padding-top:20px;font-size:2rem">Heading</h2><p> body</p>
+      </div><!--/$-->"
+    `);
+  });
+
+  it('renders a heading that starts a tight list item', async () => {
+    const actualOutput = await render(
+      <Markdown>{'- ## Heading\n body\n'}</Markdown>,
+    );
+    expect(actualOutput).toMatchInlineSnapshot(`
+      "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><!--$--><div data-id="react-email-markdown"><ul>
+      <li><h2 style="font-weight:500;padding-top:20px;font-size:2rem">Heading</h2></li>
+      </ul>
+      <p> body</p>
+      </div><!--/$-->"
+    `);
+  });
+
+  it('renders a tight list followed by a code block', async () => {
+    const actualOutput = await render(
+      <Markdown>{'- item\n ```\n code\n ```\n'}</Markdown>,
+    );
+    expect(actualOutput).toMatchInlineSnapshot(`
+      "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><!--$--><div data-id="react-email-markdown"><ul>
+      <li>item</li>
+      </ul>
+      <pre style="color:#212529;font-size:87.5%;display:block;background: #f8f8f8;font-family:SFMono-Regular,Menlo,Monaco,Consolas,monospace;padding-top:10px;padding-right:10px;padding-left:10px;padding-bottom:1px;margin-bottom:20px;word-wrap:break-word"><code>code
+      </code></pre>
+      </div><!--/$-->"
+    `);
+  });
+
   it('applies th styles to table header cells and td styles to body cells', async () => {
     const actualOutput = await render(
       <Markdown
diff --git a/packages/react-email/src/components/markdown/markdown.tsx b/packages/react-email/src/components/markdown/markdown.tsx
index fc2345c435..d1662ffab8 100644
--- a/packages/react-email/src/components/markdown/markdown.tsx
+++ b/packages/react-email/src/components/markdown/markdown.tsx
@@ -119,11 +119,7 @@ export const Markdown = React.forwardRef<HTMLDivElement, MarkdownProps>(
     };
 
     renderer.listitem = ({ tokens, loose }) => {
-      const hasNestedList = tokens.some((token) => token.type === 'list');
-      const text =
-        loose || hasNestedList
-          ? renderer.parser.parse(tokens)
-          : renderer.parser.parseInline(tokens);
+      const text = renderer.parser.parse(tokens, !!loose);
 
       return `<li${
         parseCssInJsToInlineCss(finalStyles.li) !== ''