[BUG] Syntax Error When Using `render` with React Email Component in Next.js 14

Describe the Bug

Description:

I am encountering a syntax error when trying to use the render function from the @react-email/components library with a React Email component in my Next.js 14 project. The error message is as follows:

Error: 
  × Expression expected
   ╭─[/home/yan/Documentos/Repository/poc-landing-page/src/app/api/helpers/send-welcome-email.ts:2:1]
 2 │ import { render } from '@react-email/components';
 3 │ import NewUserEmail from '../../../../emails/new-user-email';
 4 │ 
 5 │ const emailHtml = render(<NewUserEmail/>);
   ·                                       ─
 6 │ 
 7 │ export const sendWelcomeEmail = async (email: string) => {
 8 │   const mailOptions = {
   ╰────

  × Expression expected
   ╭─[/home/yan/Documentos/Repository/poc-landing-page/src/app/api/helpers/send-welcome-email.ts:2:1]
 2 │ import { render } from '@react-email/components';
 3 │ import NewUserEmail from '../../../../emails/new-user-email';
 4 │ 
 5 │ const emailHtml = render(<NewUserEmail/>);
   ·                                        ─
 6 │ 
 7 │ export const sendWelcomeEmail = async (email: string) => {
 8 │   const mailOptions = {
   ╰────

  × Expression expected
   ╭─[/home/yan/Documentos/Repository/poc-landing-page/src/app/api/helpers/send-welcome-email.ts:2:1]
 2 │ import { render } from '@react-email/components';
 3 │ import NewUserEmail from '../../../../emails/new-user-email';
 4 │ 
 5 │ const emailHtml = render(<NewUserEmail/>);
   ·                                         ─
 6 │ 
 7 │ export const sendWelcomeEmail = async (email: string) => {
 8 │   const mailOptions = {
   ╰────

Caused by:
    Syntax Error

Example Code:

import { render } from '@react-email/components';
import NewUserEmail from '../../../../emails/new-user-email';

const emailHtml = render(<NewUserEmail/>);

export const sendWelcomeEmail = async (email: string) => {
  const mailOptions = {
    from: process.env.MAILADRESS_AWS,
    to: email,
    subject: 'Bem-vindo!',
    html: emailHtml,
  };

  await EmailService.sendMail(mailOptions);
};

Environment:

Next.js 14.2.3
@react-email/components: 0.0.21
TypeScript "^5"
Node.js 20.13.1
nvm 0.37.2
Yarn 1.22.22

Attempts to Resolve:

Verified TypeScript configuration and tsconfig.json.
Updated dependencies and type definitions.
Tested in different environments, but the issue persists.

Request for Assistance:

I would appreciate assistance in understanding if this is a known issue or if there is an alternative solution. I am open to suggestions on how to resolve this error.

Thank you in advance for your help!

Which package is affected (leave empty if unsure)

@react-email/render, docs, examples, react-email

Link to the code that reproduces this issue

cant provide, its a private company project :/

To Reproduce

Steps to Reproduce:

Create a React component for email using the @react-email/components library.
Import and use the render function with the component in a TypeScript file.
Run the Next.js 14 project.

Expected Behavior

Expected Behavior:

I expected the render function to correctly render the NewUserEmail component and produce a valid HTML string without any syntax errors.

What's your node version? (if relevant)

20.13.1

resend / react-email