React Email

npm install @sendbaze/sdk @react-email/render react react-dom

pnpm add @sendbaze/sdk @react-email/render react react-dom

import { Body, Button, Container, Head, Html, Preview, Text } from "@react-email/components";

export function OrderShipped({ name, tracking }: { name: string; tracking: string }) {
  return (
    <Html lang="en">
      <Head />
      <Preview>Your order is on its way</Preview>
      <Body style={{ fontFamily: "sans-serif" }}>
        <Container>
          <Text>Hi {name},</Text>
          <Text>Your order has shipped. Tracking number: {tracking}</Text>
          <Button href={`https://yourshop.co.za/track/${tracking}`}>Track your parcel</Button>
        </Container>
      </Body>
    </Html>
  );
}

import { Sendbaze } from "@sendbaze/sdk";
import { OrderShipped } from "./emails/order-shipped";

const sendbaze = new Sendbaze({ apiKey: process.env.SENDBAZE_API_KEY! });

await sendbaze.emails.send({
  from: "Yourshop <orders@yourshop.co.za>",
  to: "thandi@example.com",
  subject: "Your order #1042 has shipped",
  react: <OrderShipped name="Thandi" tracking="CG123456789ZA" />,
  tags: ["order-shipped"],
});

​

What gets sent

• The component is rendered once to HTML and once to plain text (links and headings preserved), so every email has both parts. Pass your own text to keep the HTML render and skip the text one.
• The API receives ordinary html and text; the element never leaves your server. Nothing about the message changes on the Sendbaze side.
• react cannot be combined with html or templateId. Rendering happens in your process, so rendering errors are thrown by send() before any request is made.

​

Render without sending

import { renderReactEmail } from "@sendbaze/sdk";

const { html, text } = await renderReactEmail(<OrderShipped name="Thandi" tracking="CG123456789ZA" />);

​

Runtime notes

• Rendering uses react-dom/server, which runs on Node.js 18+, Bun and the Edge runtime. On Next.js, keep the send in a route handler or server action.
• The renderer is loaded on first use with a dynamic import. If it is missing, send() throws Sendbaze: \react` needs the optional peer dependency @react-email/render` with the install command.
• Images referenced from components must be hosted URLs, or inline attachments addressed with cid:.