XL React Email Renderer

[jmarbutt]

Overview

This pull request introduces a new example for converting BlockNote documents into React Email documents, along with setup and dependencies for the @blocknote/xl-react-email-exporter package. The changes include adding a complete example implementation, updating configurations, and creating the necessary package files for React Email integration.

Example

I have setup the example in the examples folder to test with.

Implemented Rendering for react-email

This implementation is a first pass allowing exporting to react-email components to send via email. Most of the implementation was done originally in the branch https://github.com/TypeCellOS/BlockNote/tree/feature/react-email-exporter

• Paragraph - This is unchanged from the first pass in the original branch.
• Bullet List - I implemented this using standard '
  ...
  ', from what I can tell this is completely compatible with the react-email rendering
• Numbered List - Followed the pattern in the pdfExporterBlocks to create the numbered list correctly
• Check List - Setup the Check list with SVGs, I am not 100% this will work in every email client but this is a first pass. My original pass just used a simple block but did not render well. I need to test this in more email clients to find the compatibility.
• Heading - Unchanged since original implementation
• Code Block - This utilizes the built in react-email codeblock component which renders pretty nicely in the email.
• Audio, Video, Files - I have these return blank for now because they are really not compatible with email.
• Image - Unchanged
• Table - Table utilizes the section component from react-email as their recommendation. But one thing you will find is it renders 1 table per row, which this created an issue with the alignment of columns. So I am currently setting a defaultColWidth but a future enhancement may be to make that better
• Quote - Simple Implementation, not sure if it needs something else
• Page Break - Unchanged

[vercel]

@jmarbutt is attempting to deploy a commit to the TypeCell Team on Vercel.

A member of the Team first needs to authorize it.

[YousefED]

awesome stuff, I dropped some notes that I hope are helpful!

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated (UTC)
blocknote	✅ Ready (Inspect)	Visit Preview	Jun 19, 2025 6:46pm