import {
Body,
Button,
Container,
Head,
Heading,
Hr,
Html,
Img,
Link,
Preview,
Section,
Tailwind,
Text
} from "@react-email/components"
import type { ReactNode } from "react"
import { cn } from "../../lib/utils"
export interface EmailTemplateClassNames {
body?: string
button?: string
container?: string
image?: string
content?: string
footer?: string
heading?: string
hr?: string
link?: string
}
export interface EmailTemplateProps {
classNames?: EmailTemplateClassNames
action?: string
/** @default process.env.BASE_URL || process.env.NEXT_PUBLIC_BASE_URL */
baseUrl?: string
content: ReactNode
heading: ReactNode
/** @default `${baseUrl}/apple-touch-icon.png` */
imageUrl?: string
preview?: string
/** @default process.env.SITE_NAME || process.env.NEXT_PUBLIC_SITE_NAME */
siteName?: string
url?: string
/** @default "vercel" */
variant?: "vercel"
}
export const EmailTemplate = ({
classNames,
action,
baseUrl,
content,
heading,
imageUrl,
preview,
siteName,
variant = "vercel",
url
}: EmailTemplateProps) => {
baseUrl =
baseUrl || process.env.BASE_URL || process.env.NEXT_PUBLIC_BASE_URL
imageUrl = imageUrl || `${baseUrl}/apple-touch-icon.png`
siteName =
siteName || process.env.SITE_NAME || process.env.NEXT_PUBLIC_SITE_NAME
preview = preview || (typeof heading === "string" ? heading : undefined)
return (
{preview && {preview}}
{heading}
{content}
{action && url && (
)}
{siteName && <>{siteName} }
{baseUrl && (
{baseUrl
?.replace("https://", "")
.replace("http://", "")}
)}
)
}