Email SDK
UIAccount

Team invite

A personal invitation to join a workspace.

Email preview
FromAcme <hello@acme.com>SubjectYou’re invited to AcmePreviewMaya invited you to join Acme

Installation

npx shadcn@latest add https://email-sdk.dev/r/team-invite.json

Copy this template into your app and customize its props, words, and links.

src/ui/email/team-invite.tsx
import {
  EmailButton,
  EmailCard,
  EmailHeading,
  EmailText,
  ShadcnEmail,
} from "@opencoredev/email-sdk/react";

export function TeamInviteEmail({ inviteUrl, inviter }: {
  inviteUrl: string;
  inviter: string;
}) {
  return (
    <ShadcnEmail preview={`${inviter} invited you to join Acme`}>
      <EmailCard>
        <EmailHeading>Join {inviter} on Acme</EmailHeading>
        <EmailText>{inviter} invited you to collaborate in the Acme workspace.</EmailText>
        <EmailText style={{
          borderLeft: "2px solid #d4d4d8",
          color: "#52525b",
          fontStyle: "italic",
          paddingLeft: 16,
        }}>
          “We’re keeping launch notes, approvals, and customer updates here.”
        </EmailText>
        <EmailButton href={inviteUrl}>Join workspace</EmailButton>
      </EmailCard>
    </ShadcnEmail>
  );
}

On this page