feat(ui): also preview HTML email templates

[gabrielmfern]

this does not include compatibility checking for those same templates. this should not be such a hard follow up, though, but I think it better to do that separately.

---

Summary by cubic

Add support for previewing raw .html email templates in @react-email/ui. HTML files render without React, show formatted HTML and plain text, and load in a sandboxed iframe that blocks scripts while allowing safe popups.

• New Features
  • Discover .html emails and resolve slugs to .html paths.
  • Render .html directly: format with react-email’s pretty, generate plain text with toPlainText, and cache results.
  • Preview UI: default to the html tab, show only HTML/Markdown tabs, coerce tsx URL state to html, use pretty markup in the code panel, and sandbox the iframe with allow-same-origin allow-popups allow-popups-to-escape-sandbox.
  • Tooling: hide/skip Compatibility for .html, update “Copy for AI” to label and fence as HTML, and switch the toolbar panel to Linter when navigating from a JSX/TSX email to .html.
  • Tests and fixtures for HTML detection/rendering; minor release changeset; ignore .html in the playground.

^{Written for commit 5c5fe84. Summary will update on new commits. Review in cubic}

[changeset-bot]

🦋 Changeset detected

Latest commit: 5c5fe84

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

This PR includes changesets to release 3 packages

Name	Type
@react-email/ui	Minor
react-email	Minor
@react-email/editor	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	Actions	Updated (UTC)
react-email	Ready	Preview, Comment	May 21, 2026 5:56pm
react-email-demo	Ready	Preview, Comment	May 21, 2026 5:56pm

[pkg-pr-new]

Open in StackBlitz

npm i https://pkg.pr.new/@react-email/ui@3526

commit: 9036c4a

[cubic-dev-ai]

2 issues found across 13 files

Confidence score: 2/5

• packages/ui/src/actions/render-email-by-path.tsx introduces a meaningful security risk: raw template HTML is passed to iframe.srcDoc, so embedded <script> can execute with same-origin access to the preview app.
• packages/ui/src/components/toolbar.tsx has a concrete UX regression risk where stale toolbar-panel=compatibility can leave users on a hidden tab and make reload appear broken.
• The severity/confidence mix (7/10 and 5/10, both with solid confidence) points to high merge risk until these behaviors are addressed.
• Pay close attention to packages/ui/src/actions/render-email-by-path.tsx, packages/ui/src/components/toolbar.tsx - isolate raw HTML preview execution context and clear stale compatibility panel state for raw HTML emails.

<sub>Reply with feedback, questions, or to request a fix.

Re-trigger cubic</sub>

[cubic-dev-ai]

2 issues found across 2 files (changes from recent commits).

<sub>Reply with feedback, questions, or to request a fix.

Re-trigger cubic</sub>

[cubic-dev-ai]

0 issues found across 2 files (changes from recent commits).

<sub>Auto-approved: This PR adds support for previewing raw HTML email templates in a well-contained manner, branching only on file extension and leaving existing .tsx/.jsx preview logic untouched, with thorough tests and error handling.

Re-trigger cubic</sub>