resend / react-email

💌 Build and send emails using React

Home Page:https://react.email

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Link break not left in HTML for Markdown component

sjdeak opened this issue · comments

Describe the Bug

I am reaching out regarding the use of markdown components. I have encountered an issue , Despite including double line breaks in my text, the actual line break is not displayed in the HTML output.

Could you please provide guidance on how to effectively create line breaks between inputs using markdown components? Any assistance or insights on resolving this matter would be greatly appreciated.

Input

<Markdown>
line1

line2
</Markdown>

Output HTML
<p>line1 line2</p>

Which package is affected (leave empty if unsure)

No response

Link to the code that reproduces this issue

Please see the code snippet above

To Reproduce

Please see the code snippet above

Expected Behavior

Output HTML

<p>line1</p>
<p>line2</p>

What's your node version? (if relevant)

v20.11.1

To fix the issue of line breaks not being rendered correctly in the HTML output of the Markdown component, you can try a couple of approaches:

1, Use
Tag: Instead of relying on double line breaks for line breaks in Markdown, you can explicitly use the HTML
tag within the Markdown content.

code
"<Markdown tag
line1
<br tag
<br tag
line2
</Markdown tag"
This will ensure that line breaks are rendered correctly in the HTML output.

2 ,Check Markdown Parser Configuration: Ensure that the Markdown parser being used is configured to recognize double line breaks as line breaks. Some Markdown parsers may treat double line breaks differently or require specific settings to interpret them correctly.If you have control over the Markdown parser settings, consult the documentation or configuration options to ensure that it handles double line breaks as expected

thanks! I figured out I shouldn't directly type markdown text in the tag, but should wrap them in a string, so that line breaks will not be remove by jsx compiler.

<Markdown>
{`Line 1

Line2`}
</Markdown>

IMO this is still a bug, harms the experience for the user, so I'll keep it open for now @sjdeak.