Usage
import { EmailDraft } from "@/registry/components/email-draft/email-draft";
<EmailDraft>Label</EmailDraft>Props
| Name | Type | Default | Description |
|---|---|---|---|
| reference | string | "SUB-1182" | Reference of the record the email is about |
| account | string | "Northwind Logistics" | Account or company under the reference |
| amount | string | "$8,900" | Amount on the right |
| status | string | "Renews in 5 days" | Status chip next to the reference |
| agent | string | "Renewal agent" | Who wrote the draft, shown in the footer |
| contacts | DraftContact[] | People the email can go to – the first is preselected | |
| attachment | string | null | File name of the attachment; it can be removed and added back | |
| tones | DraftTone[] | Text variants { id, label, body(contact) } – Friendly, Short and Formal by default | |
| link | { label, href } | Link appended to the email text | |
| onSend | ({ to, body, attachment }) => void | Called after Send with the final email | |
| onDiscard | () => void | Called when the draft is discarded | |
| className | string | Extra class on the root |
When to use
- Human-in-the-loop flows where an agent drafts an email and someone approves it – renewals, reminders, follow-ups - Inboxes or task lists of pending outreach, one card per record
When not to use
A full email client or composer.