@vrplatform/email 1.0.2-stage.39632706800 → 1.0.2-stage.39634972675
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/main/index.d.ts +1 -1
- package/build/main/index.js +2 -3
- package/build/main/index.js.map +1 -1
- package/build/main/render.d.ts +2 -0
- package/build/main/render.js +24 -0
- package/build/main/render.js.map +1 -0
- package/build/main/templates/BankAccountChangedEmailTemplate.d.ts +1 -0
- package/build/main/templates/BankAccountChangedEmailTemplate.js +3 -1
- package/build/main/templates/BankAccountChangedEmailTemplate.js.map +1 -1
- package/build/main/templates/BankAccountChangedTeamAdminEmailTemplate.d.ts +1 -0
- package/build/main/templates/BankAccountChangedTeamAdminEmailTemplate.js +1 -1
- package/build/main/templates/BankAccountChangedTeamAdminEmailTemplate.js.map +1 -1
- package/build/main/templates/BankDetailsRequestEmailTemplate.d.ts +2 -1
- package/build/main/templates/BankDetailsRequestEmailTemplate.js +1 -1
- package/build/main/templates/BankDetailsRequestEmailTemplate.js.map +1 -1
- package/build/module/index.d.ts +1 -1
- package/build/module/index.js +1 -1
- package/build/module/index.js.map +1 -1
- package/build/module/render.d.ts +2 -0
- package/build/module/render.js +20 -0
- package/build/module/render.js.map +1 -0
- package/build/module/templates/BankAccountChangedEmailTemplate.d.ts +1 -0
- package/build/module/templates/BankAccountChangedEmailTemplate.js +3 -1
- package/build/module/templates/BankAccountChangedEmailTemplate.js.map +1 -1
- package/build/module/templates/BankAccountChangedTeamAdminEmailTemplate.d.ts +1 -0
- package/build/module/templates/BankAccountChangedTeamAdminEmailTemplate.js +2 -2
- package/build/module/templates/BankAccountChangedTeamAdminEmailTemplate.js.map +1 -1
- package/build/module/templates/BankDetailsRequestEmailTemplate.d.ts +2 -1
- package/build/module/templates/BankDetailsRequestEmailTemplate.js +1 -1
- package/build/module/templates/BankDetailsRequestEmailTemplate.js.map +1 -1
- package/package.json +1 -1
- package/src/index.ts +1 -1
- package/src/render.ts +24 -0
- package/src/templates/BankAccountChangedEmailTemplate.tsx +23 -9
- package/src/templates/BankAccountChangedTeamAdminEmailTemplate.tsx +11 -5
- package/src/templates/BankDetailsRequestEmailTemplate.tsx +5 -1
package/build/main/index.d.ts
CHANGED
package/build/main/index.js
CHANGED
|
@@ -14,13 +14,12 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
|
14
14
|
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
15
15
|
};
|
|
16
16
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
-
exports.
|
|
17
|
+
exports.VRP_PLATFORM = void 0;
|
|
18
18
|
__exportStar(require("./templates"), exports);
|
|
19
19
|
__exportStar(require("./utils"), exports); // send email utils
|
|
20
20
|
__exportStar(require("./theme"), exports);
|
|
21
21
|
__exportStar(require("./extensions"), exports);
|
|
22
22
|
var const_1 = require("./const");
|
|
23
23
|
Object.defineProperty(exports, "VRP_PLATFORM", { enumerable: true, get: function () { return const_1.VRP_PLATFORM; } });
|
|
24
|
-
|
|
25
|
-
Object.defineProperty(exports, "render", { enumerable: true, get: function () { return render_1.render; } });
|
|
24
|
+
__exportStar(require("./render"), exports);
|
|
26
25
|
//# sourceMappingURL=index.js.map
|
package/build/main/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"src/","sources":["index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,8CAA4B;AAC5B,0CAAwB,CAAC,mBAAmB;AAC5C,0CAAwB;AACxB,+CAA6B;AAC7B,iCAAuC;AAA9B,qGAAA,YAAY,OAAA;AAGrB,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"src/","sources":["index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,8CAA4B;AAC5B,0CAAwB,CAAC,mBAAmB;AAC5C,0CAAwB;AACxB,+CAA6B;AAC7B,iCAAuC;AAA9B,qGAAA,YAAY,OAAA;AAGrB,2CAAyB","sourcesContent":["export * from './templates';\nexport * from './utils'; // send email utils\nexport * from './theme';\nexport * from './extensions';\nexport { VRP_PLATFORM } from './const';\nexport type { ActionEmailData } from './components';\n\nexport * from './render';\n"]}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.render = void 0;
|
|
4
|
+
const render_1 = require("@react-email/render");
|
|
5
|
+
// html-to-text uppercases headings by default, so the plain-text part of an
|
|
6
|
+
// email opened "HI THERE," (PRO-19711). Headings keep their case.
|
|
7
|
+
const render = (component, options) => (0, render_1.render)(component, options?.plainText
|
|
8
|
+
? {
|
|
9
|
+
...options,
|
|
10
|
+
htmlToTextOptions: {
|
|
11
|
+
...options.htmlToTextOptions,
|
|
12
|
+
selectors: [
|
|
13
|
+
...render_1.plainTextSelectors,
|
|
14
|
+
...['h1', 'h2', 'h3', 'h4', 'h5', 'h6'].map((selector) => ({
|
|
15
|
+
selector,
|
|
16
|
+
options: { uppercase: false },
|
|
17
|
+
})),
|
|
18
|
+
...(options.htmlToTextOptions?.selectors ?? []),
|
|
19
|
+
],
|
|
20
|
+
},
|
|
21
|
+
}
|
|
22
|
+
: options);
|
|
23
|
+
exports.render = render;
|
|
24
|
+
//# sourceMappingURL=render.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"render.js","sourceRoot":"src/","sources":["render.ts"],"names":[],"mappings":";;;AAAA,gDAAgF;AAEhF,4EAA4E;AAC5E,kEAAkE;AAC3D,MAAM,MAAM,GAAuB,CAAC,SAAS,EAAE,OAAO,EAAE,EAAE,CAC/D,IAAA,eAAW,EACT,SAAS,EACT,OAAO,EAAE,SAAS;IAChB,CAAC,CAAC;QACE,GAAG,OAAO;QACV,iBAAiB,EAAE;YACjB,GAAG,OAAO,CAAC,iBAAiB;YAC5B,SAAS,EAAE;gBACT,GAAG,2BAAkB;gBACrB,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;oBACzD,QAAQ;oBACR,OAAO,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE;iBAC9B,CAAC,CAAC;gBACH,GAAG,CAAC,OAAO,CAAC,iBAAiB,EAAE,SAAS,IAAI,EAAE,CAAC;aAChD;SACF;KACF;IACH,CAAC,CAAC,OAAO,CACZ,CAAC;AAnBS,QAAA,MAAM,UAmBf","sourcesContent":["import { plainTextSelectors, render as renderEmail } from '@react-email/render';\n\n// html-to-text uppercases headings by default, so the plain-text part of an\n// email opened \"HI THERE,\" (PRO-19711). Headings keep their case.\nexport const render: typeof renderEmail = (component, options) =>\n renderEmail(\n component,\n options?.plainText\n ? {\n ...options,\n htmlToTextOptions: {\n ...options.htmlToTextOptions,\n selectors: [\n ...plainTextSelectors,\n ...['h1', 'h2', 'h3', 'h4', 'h5', 'h6'].map((selector) => ({\n selector,\n options: { uppercase: false },\n })),\n ...(options.htmlToTextOptions?.selectors ?? []),\n ],\n },\n }\n : options\n );\n"]}
|
|
@@ -6,6 +6,7 @@ export type BankAccountChangedEmailTemplateProps = {
|
|
|
6
6
|
bankAccount: {
|
|
7
7
|
last4: string;
|
|
8
8
|
changedOn: string;
|
|
9
|
+
added: boolean;
|
|
9
10
|
};
|
|
10
11
|
};
|
|
11
12
|
export declare const BankAccountChangedEmailTemplate: ({ mode, user, tenant, bankAccount, }: BankAccountChangedEmailTemplateProps) => import("react").JSX.Element;
|
|
@@ -5,6 +5,8 @@ const jsx_runtime_1 = require("react/jsx-runtime");
|
|
|
5
5
|
const heading_1 = require("@react-email/heading");
|
|
6
6
|
const text_1 = require("@react-email/text");
|
|
7
7
|
const components_1 = require("../components");
|
|
8
|
-
const BankAccountChangedEmailTemplate = ({ mode, user, tenant, bankAccount, }) => ((0, jsx_runtime_1.jsxs)(components_1.EmailContainer, { title:
|
|
8
|
+
const BankAccountChangedEmailTemplate = ({ mode, user, tenant, bankAccount, }) => ((0, jsx_runtime_1.jsxs)(components_1.EmailContainer, { title: bankAccount.added
|
|
9
|
+
? 'Your bank account was added'
|
|
10
|
+
: 'Your bank account was changed', shortDescription: `${tenant.name} now pays you to the account ending in ${bankAccount.last4}.`, tenant: tenant, mode: mode, children: [(0, jsx_runtime_1.jsx)(heading_1.Heading, { style: { fontSize: 28, fontWeight: 600, marginBottom: '50px' }, children: user.firstName ? `Hi ${user.firstName},` : 'Hi there,' }), bankAccount.added ? ((0, jsx_runtime_1.jsxs)(text_1.Text, { children: ["A bank account for payments from ", (0, jsx_runtime_1.jsx)("b", { children: tenant.name }), " was added on", ' ', bankAccount.changedOn, ". Future payments go to the account ending in", ' ', (0, jsx_runtime_1.jsx)("b", { children: bankAccount.last4 }), "."] })) : ((0, jsx_runtime_1.jsxs)(text_1.Text, { children: ["The bank account ", (0, jsx_runtime_1.jsx)("b", { children: tenant.name }), " pays you to was changed on", ' ', bankAccount.changedOn, ". Future payments go to the account ending in", ' ', (0, jsx_runtime_1.jsx)("b", { children: bankAccount.last4 }), ". A payment already on its way still goes to the previous account."] })), (0, jsx_runtime_1.jsxs)(text_1.Text, { children: ["If you did not make or request this", ' ', bankAccount.added ? 'addition' : 'change', ", contact ", tenant.name, " right away."] })] }));
|
|
9
11
|
exports.BankAccountChangedEmailTemplate = BankAccountChangedEmailTemplate;
|
|
10
12
|
//# sourceMappingURL=BankAccountChangedEmailTemplate.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BankAccountChangedEmailTemplate.js","sourceRoot":"src/","sources":["templates/BankAccountChangedEmailTemplate.tsx"],"names":[],"mappings":";;;;AAAA,kDAA+C;AAC/C,4CAAyC;AACzC,8CAA+C;
|
|
1
|
+
{"version":3,"file":"BankAccountChangedEmailTemplate.js","sourceRoot":"src/","sources":["templates/BankAccountChangedEmailTemplate.tsx"],"names":[],"mappings":";;;;AAAA,kDAA+C;AAC/C,4CAAyC;AACzC,8CAA+C;AAWxC,MAAM,+BAA+B,GAAG,CAAC,EAC9C,IAAI,EACJ,IAAI,EACJ,MAAM,EACN,WAAW,GAC0B,EAAE,EAAE,CAAC,CAC1C,wBAAC,2BAAc,IACb,KAAK,EACH,WAAW,CAAC,KAAK;QACf,CAAC,CAAC,6BAA6B;QAC/B,CAAC,CAAC,+BAA+B,EAErC,gBAAgB,EAAE,GAAG,MAAM,CAAC,IAAI,0CAA0C,WAAW,CAAC,KAAK,GAAG,EAC9F,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,IAAI,aAEV,uBAAC,iBAAO,IAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,YAAY,EAAE,MAAM,EAAE,YACpE,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC,CAAC,WAAW,GAC/C,EACT,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,CACnB,wBAAC,WAAI,oDAC8B,wCAAI,MAAM,CAAC,IAAI,GAAK,mBAAc,GAAG,EACrE,WAAW,CAAC,SAAS,mDAA+C,GAAG,EACxE,wCAAI,WAAW,CAAC,KAAK,GAAK,SACrB,CACR,CAAC,CAAC,CAAC,CACF,wBAAC,WAAI,oCACc,wCAAI,MAAM,CAAC,IAAI,GAAK,iCAA4B,GAAG,EACnE,WAAW,CAAC,SAAS,mDAA+C,GAAG,EACxE,wCAAI,WAAW,CAAC,KAAK,GAAK,0EAErB,CACR,EACD,wBAAC,WAAI,sDACiC,GAAG,EACtC,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,QAAQ,gBAAY,MAAM,CAAC,IAAI,oBAE5D,IACQ,CAClB,CAAC;AAvCW,QAAA,+BAA+B,mCAuC1C","sourcesContent":["import { Heading } from '@react-email/heading';\nimport { Text } from '@react-email/text';\nimport { EmailContainer } from '../components';\nimport type { EmailBaseProps } from '../types';\n\nexport type BankAccountChangedEmailTemplateProps = {\n mode: EmailBaseProps['mode'];\n user: EmailBaseProps['user'];\n tenant: EmailBaseProps['tenant'];\n // Added: the payee had no bank account before.\n bankAccount: { last4: string; changedOn: string; added: boolean };\n};\n\nexport const BankAccountChangedEmailTemplate = ({\n mode,\n user,\n tenant,\n bankAccount,\n}: BankAccountChangedEmailTemplateProps) => (\n <EmailContainer\n title={\n bankAccount.added\n ? 'Your bank account was added'\n : 'Your bank account was changed'\n }\n shortDescription={`${tenant.name} now pays you to the account ending in ${bankAccount.last4}.`}\n tenant={tenant}\n mode={mode}\n >\n <Heading style={{ fontSize: 28, fontWeight: 600, marginBottom: '50px' }}>\n {user.firstName ? `Hi ${user.firstName},` : 'Hi there,'}\n </Heading>\n {bankAccount.added ? (\n <Text>\n A bank account for payments from <b>{tenant.name}</b> was added on{' '}\n {bankAccount.changedOn}. Future payments go to the account ending in{' '}\n <b>{bankAccount.last4}</b>.\n </Text>\n ) : (\n <Text>\n The bank account <b>{tenant.name}</b> pays you to was changed on{' '}\n {bankAccount.changedOn}. Future payments go to the account ending in{' '}\n <b>{bankAccount.last4}</b>. A payment already on its way still goes to\n the previous account.\n </Text>\n )}\n <Text>\n If you did not make or request this{' '}\n {bankAccount.added ? 'addition' : 'change'}, contact {tenant.name} right\n away.\n </Text>\n </EmailContainer>\n);\n"]}
|
|
@@ -7,6 +7,6 @@ const text_1 = require("@react-email/text");
|
|
|
7
7
|
const Button_1 = require("../components/Button");
|
|
8
8
|
const EmailContainer_1 = require("../components/EmailContainer");
|
|
9
9
|
const theme_1 = require("../theme");
|
|
10
|
-
const BankAccountChangedTeamAdminEmailTemplate = ({ mode, tenant, contact, bankAccount, href, }) => ((0, jsx_runtime_1.jsxs)(EmailContainer_1.EmailContainer, { title: `Bank details changed for ${contact.name}`, shortDescription: `Future payments to ${contact.name} go to the account ending in ${bankAccount.last4}.`, tenant: tenant, mode: mode, children: [(0, jsx_runtime_1.
|
|
10
|
+
const BankAccountChangedTeamAdminEmailTemplate = ({ mode, tenant, contact, bankAccount, href, }) => ((0, jsx_runtime_1.jsxs)(EmailContainer_1.EmailContainer, { title: `Bank details ${bankAccount.added ? 'added' : 'changed'} for ${contact.name}`, shortDescription: `Future payments to ${contact.name} go to the account ending in ${bankAccount.last4}.`, tenant: tenant, mode: mode, children: [(0, jsx_runtime_1.jsxs)(heading_1.Heading, { style: { fontSize: 28, fontWeight: 600, marginBottom: '50px' }, children: ["Bank details ", bankAccount.added ? 'added' : 'changed'] }), (0, jsx_runtime_1.jsxs)(text_1.Text, { children: ["The bank account of ", contact.type, " ", (0, jsx_runtime_1.jsx)("b", { children: contact.name }), " was", ' ', bankAccount.added ? 'added' : 'changed', " on ", bankAccount.changedOn, bankAccount.changedBy ? ` by ${bankAccount.changedBy}` : '', ". Future payments go to the account ending in ", (0, jsx_runtime_1.jsx)("b", { children: bankAccount.last4 }), "."] }), (0, jsx_runtime_1.jsxs)(text_1.Text, { children: ["If you did not expect this change, confirm it with ", contact.name, " by phone before the next payment."] }), (0, jsx_runtime_1.jsx)(Button_1.Button, { href: href, mode: mode, label: "Review payment setup", themeColors: theme_1.THEME_COLORS.vrplatform })] }));
|
|
11
11
|
exports.BankAccountChangedTeamAdminEmailTemplate = BankAccountChangedTeamAdminEmailTemplate;
|
|
12
12
|
//# sourceMappingURL=BankAccountChangedTeamAdminEmailTemplate.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BankAccountChangedTeamAdminEmailTemplate.js","sourceRoot":"src/","sources":["templates/BankAccountChangedTeamAdminEmailTemplate.tsx"],"names":[],"mappings":";;;;AAAA,kDAA+C;AAC/C,4CAAyC;AACzC,iDAA8C;AAC9C,iEAA8D;AAC9D,oCAAwC;
|
|
1
|
+
{"version":3,"file":"BankAccountChangedTeamAdminEmailTemplate.js","sourceRoot":"src/","sources":["templates/BankAccountChangedTeamAdminEmailTemplate.tsx"],"names":[],"mappings":";;;;AAAA,kDAA+C;AAC/C,4CAAyC;AACzC,iDAA8C;AAC9C,iEAA8D;AAC9D,oCAAwC;AAiBjC,MAAM,wCAAwC,GAAG,CAAC,EACvD,IAAI,EACJ,MAAM,EACN,OAAO,EACP,WAAW,EACX,IAAI,GAC0C,EAAE,EAAE,CAAC,CACnD,wBAAC,+BAAc,IACb,KAAK,EAAE,gBAAgB,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,QAAQ,OAAO,CAAC,IAAI,EAAE,EACpF,gBAAgB,EAAE,sBAAsB,OAAO,CAAC,IAAI,gCAAgC,WAAW,CAAC,KAAK,GAAG,EACxG,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,IAAI,aAEV,wBAAC,iBAAO,IAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,YAAY,EAAE,MAAM,EAAE,8BACvD,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,IAC7C,EACV,wBAAC,WAAI,uCACkB,OAAO,CAAC,IAAI,OAAE,wCAAI,OAAO,CAAC,IAAI,GAAK,UAAK,GAAG,EAC/D,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,UAAM,WAAW,CAAC,SAAS,EAClE,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,WAAW,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,EAAE,oDACvB,wCAAI,WAAW,CAAC,KAAK,GAAK,SAC1D,EACP,wBAAC,WAAI,sEACiD,OAAO,CAAC,IAAI,0CAE3D,EACP,uBAAC,eAAM,IACL,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,KAAK,EAAC,sBAAsB,EAC5B,WAAW,EAAE,oBAAY,CAAC,UAAW,GACrC,IACa,CAClB,CAAC;AAjCW,QAAA,wCAAwC,4CAiCnD","sourcesContent":["import { Heading } from '@react-email/heading';\nimport { Text } from '@react-email/text';\nimport { Button } from '../components/Button';\nimport { EmailContainer } from '../components/EmailContainer';\nimport { THEME_COLORS } from '../theme';\nimport type { EmailBaseProps } from '../types';\n\nexport type BankAccountChangedTeamAdminEmailTemplateProps = {\n mode: EmailBaseProps['mode'];\n tenant: EmailBaseProps['tenant'];\n contact: { name: string; type: 'owner' | 'vendor' };\n // Added: the contact had no bank account before.\n bankAccount: {\n last4: string;\n changedOn: string;\n changedBy: string | null;\n added: boolean;\n };\n href: string;\n};\n\nexport const BankAccountChangedTeamAdminEmailTemplate = ({\n mode,\n tenant,\n contact,\n bankAccount,\n href,\n}: BankAccountChangedTeamAdminEmailTemplateProps) => (\n <EmailContainer\n title={`Bank details ${bankAccount.added ? 'added' : 'changed'} for ${contact.name}`}\n shortDescription={`Future payments to ${contact.name} go to the account ending in ${bankAccount.last4}.`}\n tenant={tenant}\n mode={mode}\n >\n <Heading style={{ fontSize: 28, fontWeight: 600, marginBottom: '50px' }}>\n Bank details {bankAccount.added ? 'added' : 'changed'}\n </Heading>\n <Text>\n The bank account of {contact.type} <b>{contact.name}</b> was{' '}\n {bankAccount.added ? 'added' : 'changed'} on {bankAccount.changedOn}\n {bankAccount.changedBy ? ` by ${bankAccount.changedBy}` : ''}. Future\n payments go to the account ending in <b>{bankAccount.last4}</b>.\n </Text>\n <Text>\n If you did not expect this change, confirm it with {contact.name} by phone\n before the next payment.\n </Text>\n <Button\n href={href}\n mode={mode}\n label=\"Review payment setup\"\n themeColors={THEME_COLORS.vrplatform!}\n />\n </EmailContainer>\n);\n"]}
|
|
@@ -3,6 +3,7 @@ export type BankDetailsRequestEmailTemplateProps = {
|
|
|
3
3
|
mode: EmailBaseProps['mode'];
|
|
4
4
|
user: EmailBaseProps['user'];
|
|
5
5
|
tenant: EmailBaseProps['tenant'];
|
|
6
|
+
payeeName: string;
|
|
6
7
|
themeColors: EmailBaseProps['themeColors'];
|
|
7
8
|
href: string;
|
|
8
9
|
form: {
|
|
@@ -13,4 +14,4 @@ export type BankDetailsRequestEmailTemplateProps = {
|
|
|
13
14
|
expiresOn: string;
|
|
14
15
|
};
|
|
15
16
|
};
|
|
16
|
-
export declare const BankDetailsRequestEmailTemplate: ({ mode, user, tenant, themeColors, href, form, }: BankDetailsRequestEmailTemplateProps) => import("react").JSX.Element;
|
|
17
|
+
export declare const BankDetailsRequestEmailTemplate: ({ mode, user, tenant, payeeName, themeColors, href, form, }: BankDetailsRequestEmailTemplateProps) => import("react").JSX.Element;
|
|
@@ -6,7 +6,7 @@ const heading_1 = require("@react-email/heading");
|
|
|
6
6
|
const text_1 = require("@react-email/text");
|
|
7
7
|
const Button_1 = require("../components/Button");
|
|
8
8
|
const EmailContainer_1 = require("../components/EmailContainer");
|
|
9
|
-
const BankDetailsRequestEmailTemplate = ({ mode, user, tenant, themeColors, href, form, }) => ((0, jsx_runtime_1.jsxs)(EmailContainer_1.EmailContainer, { title: `${tenant.name} needs
|
|
9
|
+
const BankDetailsRequestEmailTemplate = ({ mode, user, tenant, payeeName, themeColors, href, form, }) => ((0, jsx_runtime_1.jsxs)(EmailContainer_1.EmailContainer, { title: `${tenant.name} needs payout details for ${payeeName}`, shortDescription: `Add the bank account ${tenant.name} pays you to.`, tenant: tenant, mode: mode, children: [(0, jsx_runtime_1.jsx)(heading_1.Heading, { style: { fontSize: 28, fontWeight: 600, marginBottom: '50px' }, children: user.firstName ? `Hi ${user.firstName},` : 'Hi there,' }), (0, jsx_runtime_1.jsxs)(text_1.Text, { children: [(0, jsx_runtime_1.jsx)("b", { children: tenant.name }), " needs the bank account to send your payments to. Use the button below to add it. Never send bank details by email."] }), (0, jsx_runtime_1.jsx)(text_1.Text, { children: form.type === 'oneTime'
|
|
10
10
|
? `The link works once and expires on ${form.expiresOn}.`
|
|
11
11
|
: form.setsUpLogin
|
|
12
12
|
? 'You will set up your owner portal login first, then add your bank details.'
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BankDetailsRequestEmailTemplate.js","sourceRoot":"src/","sources":["templates/BankDetailsRequestEmailTemplate.tsx"],"names":[],"mappings":";;;;AAAA,kDAA+C;AAC/C,4CAAyC;AACzC,iDAA8C;AAC9C,iEAA8D;
|
|
1
|
+
{"version":3,"file":"BankDetailsRequestEmailTemplate.js","sourceRoot":"src/","sources":["templates/BankDetailsRequestEmailTemplate.tsx"],"names":[],"mappings":";;;;AAAA,kDAA+C;AAC/C,4CAAyC;AACzC,iDAA8C;AAC9C,iEAA8D;AAmBvD,MAAM,+BAA+B,GAAG,CAAC,EAC9C,IAAI,EACJ,IAAI,EACJ,MAAM,EACN,SAAS,EACT,WAAW,EACX,IAAI,EACJ,IAAI,GACiC,EAAE,EAAE,CAAC,CAC1C,wBAAC,+BAAc,IACb,KAAK,EAAE,GAAG,MAAM,CAAC,IAAI,6BAA6B,SAAS,EAAE,EAC7D,gBAAgB,EAAE,wBAAwB,MAAM,CAAC,IAAI,eAAe,EACpE,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,IAAI,aAEV,uBAAC,iBAAO,IAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,YAAY,EAAE,MAAM,EAAE,YACpE,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC,CAAC,WAAW,GAC/C,EACV,wBAAC,WAAI,eACH,wCAAI,MAAM,CAAC,IAAI,GAAK,2HAEf,EACP,uBAAC,WAAI,cACF,IAAI,CAAC,IAAI,KAAK,SAAS;gBACtB,CAAC,CAAC,sCAAsC,IAAI,CAAC,SAAS,GAAG;gBACzD,CAAC,CAAC,IAAI,CAAC,WAAW;oBAChB,CAAC,CAAC,4EAA4E;oBAC9E,CAAC,CAAC,wDAAwD,GACzD,EACP,uBAAC,eAAM,IACL,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,KAAK,EAAC,kBAAkB,EACxB,WAAW,EAAE,WAAW,GACxB,EACF,wBAAC,WAAI,+DAC0C,MAAM,CAAC,IAAI,sCAEnD,IACQ,CAClB,CAAC;AAxCW,QAAA,+BAA+B,mCAwC1C","sourcesContent":["import { Heading } from '@react-email/heading';\nimport { Text } from '@react-email/text';\nimport { Button } from '../components/Button';\nimport { EmailContainer } from '../components/EmailContainer';\nimport type { EmailBaseProps } from '../types';\n\nexport type BankDetailsRequestEmailTemplateProps = {\n mode: EmailBaseProps['mode'];\n user: EmailBaseProps['user'];\n tenant: EmailBaseProps['tenant'];\n // The owner or vendor asked, so requests to different payees do not thread\n // together.\n payeeName: string;\n themeColors: EmailBaseProps['themeColors'];\n href: string;\n // Owners enter their details in the owner portal; vendors in a one-time\n // form that expires.\n form:\n | { type: 'ownerPortal'; setsUpLogin: boolean }\n | { type: 'oneTime'; expiresOn: string };\n};\n\nexport const BankDetailsRequestEmailTemplate = ({\n mode,\n user,\n tenant,\n payeeName,\n themeColors,\n href,\n form,\n}: BankDetailsRequestEmailTemplateProps) => (\n <EmailContainer\n title={`${tenant.name} needs payout details for ${payeeName}`}\n shortDescription={`Add the bank account ${tenant.name} pays you to.`}\n tenant={tenant}\n mode={mode}\n >\n <Heading style={{ fontSize: 28, fontWeight: 600, marginBottom: '50px' }}>\n {user.firstName ? `Hi ${user.firstName},` : 'Hi there,'}\n </Heading>\n <Text>\n <b>{tenant.name}</b> needs the bank account to send your payments to. Use\n the button below to add it. Never send bank details by email.\n </Text>\n <Text>\n {form.type === 'oneTime'\n ? `The link works once and expires on ${form.expiresOn}.`\n : form.setsUpLogin\n ? 'You will set up your owner portal login first, then add your bank details.'\n : 'Sign in to your owner portal to add your bank details.'}\n </Text>\n <Button\n href={href}\n mode={mode}\n label=\"Add bank details\"\n themeColors={themeColors}\n />\n <Text>\n If you did not expect this request, contact {tenant.name} before you enter\n any details.\n </Text>\n </EmailContainer>\n);\n"]}
|
package/build/module/index.d.ts
CHANGED
package/build/module/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"src/","sources":["index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC,CAAC,mBAAmB;AAC5C,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAGvC,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"src/","sources":["index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC,CAAC,mBAAmB;AAC5C,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAGvC,cAAc,UAAU,CAAC","sourcesContent":["export * from './templates';\nexport * from './utils'; // send email utils\nexport * from './theme';\nexport * from './extensions';\nexport { VRP_PLATFORM } from './const';\nexport type { ActionEmailData } from './components';\n\nexport * from './render';\n"]}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { plainTextSelectors, render as renderEmail } from '@react-email/render';
|
|
2
|
+
// html-to-text uppercases headings by default, so the plain-text part of an
|
|
3
|
+
// email opened "HI THERE," (PRO-19711). Headings keep their case.
|
|
4
|
+
export const render = (component, options) => renderEmail(component, options?.plainText
|
|
5
|
+
? {
|
|
6
|
+
...options,
|
|
7
|
+
htmlToTextOptions: {
|
|
8
|
+
...options.htmlToTextOptions,
|
|
9
|
+
selectors: [
|
|
10
|
+
...plainTextSelectors,
|
|
11
|
+
...['h1', 'h2', 'h3', 'h4', 'h5', 'h6'].map((selector) => ({
|
|
12
|
+
selector,
|
|
13
|
+
options: { uppercase: false },
|
|
14
|
+
})),
|
|
15
|
+
...(options.htmlToTextOptions?.selectors ?? []),
|
|
16
|
+
],
|
|
17
|
+
},
|
|
18
|
+
}
|
|
19
|
+
: options);
|
|
20
|
+
//# sourceMappingURL=render.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"render.js","sourceRoot":"src/","sources":["render.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAEhF,4EAA4E;AAC5E,kEAAkE;AAClE,MAAM,CAAC,MAAM,MAAM,GAAuB,CAAC,SAAS,EAAE,OAAO,EAAE,EAAE,CAC/D,WAAW,CACT,SAAS,EACT,OAAO,EAAE,SAAS;IAChB,CAAC,CAAC;QACE,GAAG,OAAO;QACV,iBAAiB,EAAE;YACjB,GAAG,OAAO,CAAC,iBAAiB;YAC5B,SAAS,EAAE;gBACT,GAAG,kBAAkB;gBACrB,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;oBACzD,QAAQ;oBACR,OAAO,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE;iBAC9B,CAAC,CAAC;gBACH,GAAG,CAAC,OAAO,CAAC,iBAAiB,EAAE,SAAS,IAAI,EAAE,CAAC;aAChD;SACF;KACF;IACH,CAAC,CAAC,OAAO,CACZ,CAAC","sourcesContent":["import { plainTextSelectors, render as renderEmail } from '@react-email/render';\n\n// html-to-text uppercases headings by default, so the plain-text part of an\n// email opened \"HI THERE,\" (PRO-19711). Headings keep their case.\nexport const render: typeof renderEmail = (component, options) =>\n renderEmail(\n component,\n options?.plainText\n ? {\n ...options,\n htmlToTextOptions: {\n ...options.htmlToTextOptions,\n selectors: [\n ...plainTextSelectors,\n ...['h1', 'h2', 'h3', 'h4', 'h5', 'h6'].map((selector) => ({\n selector,\n options: { uppercase: false },\n })),\n ...(options.htmlToTextOptions?.selectors ?? []),\n ],\n },\n }\n : options\n );\n"]}
|
|
@@ -6,6 +6,7 @@ export type BankAccountChangedEmailTemplateProps = {
|
|
|
6
6
|
bankAccount: {
|
|
7
7
|
last4: string;
|
|
8
8
|
changedOn: string;
|
|
9
|
+
added: boolean;
|
|
9
10
|
};
|
|
10
11
|
};
|
|
11
12
|
export declare const BankAccountChangedEmailTemplate: ({ mode, user, tenant, bankAccount, }: BankAccountChangedEmailTemplateProps) => import("react").JSX.Element;
|
|
@@ -2,5 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
import { Heading } from '@react-email/heading';
|
|
3
3
|
import { Text } from '@react-email/text';
|
|
4
4
|
import { EmailContainer } from '../components';
|
|
5
|
-
export const BankAccountChangedEmailTemplate = ({ mode, user, tenant, bankAccount, }) => (_jsxs(EmailContainer, { title:
|
|
5
|
+
export const BankAccountChangedEmailTemplate = ({ mode, user, tenant, bankAccount, }) => (_jsxs(EmailContainer, { title: bankAccount.added
|
|
6
|
+
? 'Your bank account was added'
|
|
7
|
+
: 'Your bank account was changed', shortDescription: `${tenant.name} now pays you to the account ending in ${bankAccount.last4}.`, tenant: tenant, mode: mode, children: [_jsx(Heading, { style: { fontSize: 28, fontWeight: 600, marginBottom: '50px' }, children: user.firstName ? `Hi ${user.firstName},` : 'Hi there,' }), bankAccount.added ? (_jsxs(Text, { children: ["A bank account for payments from ", _jsx("b", { children: tenant.name }), " was added on", ' ', bankAccount.changedOn, ". Future payments go to the account ending in", ' ', _jsx("b", { children: bankAccount.last4 }), "."] })) : (_jsxs(Text, { children: ["The bank account ", _jsx("b", { children: tenant.name }), " pays you to was changed on", ' ', bankAccount.changedOn, ". Future payments go to the account ending in", ' ', _jsx("b", { children: bankAccount.last4 }), ". A payment already on its way still goes to the previous account."] })), _jsxs(Text, { children: ["If you did not make or request this", ' ', bankAccount.added ? 'addition' : 'change', ", contact ", tenant.name, " right away."] })] }));
|
|
6
8
|
//# sourceMappingURL=BankAccountChangedEmailTemplate.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BankAccountChangedEmailTemplate.js","sourceRoot":"src/","sources":["templates/BankAccountChangedEmailTemplate.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACzC,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;
|
|
1
|
+
{"version":3,"file":"BankAccountChangedEmailTemplate.js","sourceRoot":"src/","sources":["templates/BankAccountChangedEmailTemplate.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACzC,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAW/C,MAAM,CAAC,MAAM,+BAA+B,GAAG,CAAC,EAC9C,IAAI,EACJ,IAAI,EACJ,MAAM,EACN,WAAW,GAC0B,EAAE,EAAE,CAAC,CAC1C,MAAC,cAAc,IACb,KAAK,EACH,WAAW,CAAC,KAAK;QACf,CAAC,CAAC,6BAA6B;QAC/B,CAAC,CAAC,+BAA+B,EAErC,gBAAgB,EAAE,GAAG,MAAM,CAAC,IAAI,0CAA0C,WAAW,CAAC,KAAK,GAAG,EAC9F,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,IAAI,aAEV,KAAC,OAAO,IAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,YAAY,EAAE,MAAM,EAAE,YACpE,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC,CAAC,WAAW,GAC/C,EACT,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,CACnB,MAAC,IAAI,oDAC8B,sBAAI,MAAM,CAAC,IAAI,GAAK,mBAAc,GAAG,EACrE,WAAW,CAAC,SAAS,mDAA+C,GAAG,EACxE,sBAAI,WAAW,CAAC,KAAK,GAAK,SACrB,CACR,CAAC,CAAC,CAAC,CACF,MAAC,IAAI,oCACc,sBAAI,MAAM,CAAC,IAAI,GAAK,iCAA4B,GAAG,EACnE,WAAW,CAAC,SAAS,mDAA+C,GAAG,EACxE,sBAAI,WAAW,CAAC,KAAK,GAAK,0EAErB,CACR,EACD,MAAC,IAAI,sDACiC,GAAG,EACtC,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,QAAQ,gBAAY,MAAM,CAAC,IAAI,oBAE5D,IACQ,CAClB,CAAC","sourcesContent":["import { Heading } from '@react-email/heading';\nimport { Text } from '@react-email/text';\nimport { EmailContainer } from '../components';\nimport type { EmailBaseProps } from '../types';\n\nexport type BankAccountChangedEmailTemplateProps = {\n mode: EmailBaseProps['mode'];\n user: EmailBaseProps['user'];\n tenant: EmailBaseProps['tenant'];\n // Added: the payee had no bank account before.\n bankAccount: { last4: string; changedOn: string; added: boolean };\n};\n\nexport const BankAccountChangedEmailTemplate = ({\n mode,\n user,\n tenant,\n bankAccount,\n}: BankAccountChangedEmailTemplateProps) => (\n <EmailContainer\n title={\n bankAccount.added\n ? 'Your bank account was added'\n : 'Your bank account was changed'\n }\n shortDescription={`${tenant.name} now pays you to the account ending in ${bankAccount.last4}.`}\n tenant={tenant}\n mode={mode}\n >\n <Heading style={{ fontSize: 28, fontWeight: 600, marginBottom: '50px' }}>\n {user.firstName ? `Hi ${user.firstName},` : 'Hi there,'}\n </Heading>\n {bankAccount.added ? (\n <Text>\n A bank account for payments from <b>{tenant.name}</b> was added on{' '}\n {bankAccount.changedOn}. Future payments go to the account ending in{' '}\n <b>{bankAccount.last4}</b>.\n </Text>\n ) : (\n <Text>\n The bank account <b>{tenant.name}</b> pays you to was changed on{' '}\n {bankAccount.changedOn}. Future payments go to the account ending in{' '}\n <b>{bankAccount.last4}</b>. A payment already on its way still goes to\n the previous account.\n </Text>\n )}\n <Text>\n If you did not make or request this{' '}\n {bankAccount.added ? 'addition' : 'change'}, contact {tenant.name} right\n away.\n </Text>\n </EmailContainer>\n);\n"]}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { Heading } from '@react-email/heading';
|
|
3
3
|
import { Text } from '@react-email/text';
|
|
4
4
|
import { Button } from '../components/Button';
|
|
5
5
|
import { EmailContainer } from '../components/EmailContainer';
|
|
6
6
|
import { THEME_COLORS } from '../theme';
|
|
7
|
-
export const BankAccountChangedTeamAdminEmailTemplate = ({ mode, tenant, contact, bankAccount, href, }) => (_jsxs(EmailContainer, { title: `Bank details changed for ${contact.name}`, shortDescription: `Future payments to ${contact.name} go to the account ending in ${bankAccount.last4}.`, tenant: tenant, mode: mode, children: [
|
|
7
|
+
export const BankAccountChangedTeamAdminEmailTemplate = ({ mode, tenant, contact, bankAccount, href, }) => (_jsxs(EmailContainer, { title: `Bank details ${bankAccount.added ? 'added' : 'changed'} for ${contact.name}`, shortDescription: `Future payments to ${contact.name} go to the account ending in ${bankAccount.last4}.`, tenant: tenant, mode: mode, children: [_jsxs(Heading, { style: { fontSize: 28, fontWeight: 600, marginBottom: '50px' }, children: ["Bank details ", bankAccount.added ? 'added' : 'changed'] }), _jsxs(Text, { children: ["The bank account of ", contact.type, " ", _jsx("b", { children: contact.name }), " was", ' ', bankAccount.added ? 'added' : 'changed', " on ", bankAccount.changedOn, bankAccount.changedBy ? ` by ${bankAccount.changedBy}` : '', ". Future payments go to the account ending in ", _jsx("b", { children: bankAccount.last4 }), "."] }), _jsxs(Text, { children: ["If you did not expect this change, confirm it with ", contact.name, " by phone before the next payment."] }), _jsx(Button, { href: href, mode: mode, label: "Review payment setup", themeColors: THEME_COLORS.vrplatform })] }));
|
|
8
8
|
//# sourceMappingURL=BankAccountChangedTeamAdminEmailTemplate.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BankAccountChangedTeamAdminEmailTemplate.js","sourceRoot":"src/","sources":["templates/BankAccountChangedTeamAdminEmailTemplate.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAC9D,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"BankAccountChangedTeamAdminEmailTemplate.js","sourceRoot":"src/","sources":["templates/BankAccountChangedTeamAdminEmailTemplate.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAC9D,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAiBxC,MAAM,CAAC,MAAM,wCAAwC,GAAG,CAAC,EACvD,IAAI,EACJ,MAAM,EACN,OAAO,EACP,WAAW,EACX,IAAI,GAC0C,EAAE,EAAE,CAAC,CACnD,MAAC,cAAc,IACb,KAAK,EAAE,gBAAgB,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,QAAQ,OAAO,CAAC,IAAI,EAAE,EACpF,gBAAgB,EAAE,sBAAsB,OAAO,CAAC,IAAI,gCAAgC,WAAW,CAAC,KAAK,GAAG,EACxG,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,IAAI,aAEV,MAAC,OAAO,IAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,YAAY,EAAE,MAAM,EAAE,8BACvD,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,IAC7C,EACV,MAAC,IAAI,uCACkB,OAAO,CAAC,IAAI,OAAE,sBAAI,OAAO,CAAC,IAAI,GAAK,UAAK,GAAG,EAC/D,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,UAAM,WAAW,CAAC,SAAS,EAClE,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,WAAW,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,EAAE,oDACvB,sBAAI,WAAW,CAAC,KAAK,GAAK,SAC1D,EACP,MAAC,IAAI,sEACiD,OAAO,CAAC,IAAI,0CAE3D,EACP,KAAC,MAAM,IACL,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,KAAK,EAAC,sBAAsB,EAC5B,WAAW,EAAE,YAAY,CAAC,UAAW,GACrC,IACa,CAClB,CAAC","sourcesContent":["import { Heading } from '@react-email/heading';\nimport { Text } from '@react-email/text';\nimport { Button } from '../components/Button';\nimport { EmailContainer } from '../components/EmailContainer';\nimport { THEME_COLORS } from '../theme';\nimport type { EmailBaseProps } from '../types';\n\nexport type BankAccountChangedTeamAdminEmailTemplateProps = {\n mode: EmailBaseProps['mode'];\n tenant: EmailBaseProps['tenant'];\n contact: { name: string; type: 'owner' | 'vendor' };\n // Added: the contact had no bank account before.\n bankAccount: {\n last4: string;\n changedOn: string;\n changedBy: string | null;\n added: boolean;\n };\n href: string;\n};\n\nexport const BankAccountChangedTeamAdminEmailTemplate = ({\n mode,\n tenant,\n contact,\n bankAccount,\n href,\n}: BankAccountChangedTeamAdminEmailTemplateProps) => (\n <EmailContainer\n title={`Bank details ${bankAccount.added ? 'added' : 'changed'} for ${contact.name}`}\n shortDescription={`Future payments to ${contact.name} go to the account ending in ${bankAccount.last4}.`}\n tenant={tenant}\n mode={mode}\n >\n <Heading style={{ fontSize: 28, fontWeight: 600, marginBottom: '50px' }}>\n Bank details {bankAccount.added ? 'added' : 'changed'}\n </Heading>\n <Text>\n The bank account of {contact.type} <b>{contact.name}</b> was{' '}\n {bankAccount.added ? 'added' : 'changed'} on {bankAccount.changedOn}\n {bankAccount.changedBy ? ` by ${bankAccount.changedBy}` : ''}. Future\n payments go to the account ending in <b>{bankAccount.last4}</b>.\n </Text>\n <Text>\n If you did not expect this change, confirm it with {contact.name} by phone\n before the next payment.\n </Text>\n <Button\n href={href}\n mode={mode}\n label=\"Review payment setup\"\n themeColors={THEME_COLORS.vrplatform!}\n />\n </EmailContainer>\n);\n"]}
|
|
@@ -3,6 +3,7 @@ export type BankDetailsRequestEmailTemplateProps = {
|
|
|
3
3
|
mode: EmailBaseProps['mode'];
|
|
4
4
|
user: EmailBaseProps['user'];
|
|
5
5
|
tenant: EmailBaseProps['tenant'];
|
|
6
|
+
payeeName: string;
|
|
6
7
|
themeColors: EmailBaseProps['themeColors'];
|
|
7
8
|
href: string;
|
|
8
9
|
form: {
|
|
@@ -13,4 +14,4 @@ export type BankDetailsRequestEmailTemplateProps = {
|
|
|
13
14
|
expiresOn: string;
|
|
14
15
|
};
|
|
15
16
|
};
|
|
16
|
-
export declare const BankDetailsRequestEmailTemplate: ({ mode, user, tenant, themeColors, href, form, }: BankDetailsRequestEmailTemplateProps) => import("react").JSX.Element;
|
|
17
|
+
export declare const BankDetailsRequestEmailTemplate: ({ mode, user, tenant, payeeName, themeColors, href, form, }: BankDetailsRequestEmailTemplateProps) => import("react").JSX.Element;
|
|
@@ -3,7 +3,7 @@ import { Heading } from '@react-email/heading';
|
|
|
3
3
|
import { Text } from '@react-email/text';
|
|
4
4
|
import { Button } from '../components/Button';
|
|
5
5
|
import { EmailContainer } from '../components/EmailContainer';
|
|
6
|
-
export const BankDetailsRequestEmailTemplate = ({ mode, user, tenant, themeColors, href, form, }) => (_jsxs(EmailContainer, { title: `${tenant.name} needs
|
|
6
|
+
export const BankDetailsRequestEmailTemplate = ({ mode, user, tenant, payeeName, themeColors, href, form, }) => (_jsxs(EmailContainer, { title: `${tenant.name} needs payout details for ${payeeName}`, shortDescription: `Add the bank account ${tenant.name} pays you to.`, tenant: tenant, mode: mode, children: [_jsx(Heading, { style: { fontSize: 28, fontWeight: 600, marginBottom: '50px' }, children: user.firstName ? `Hi ${user.firstName},` : 'Hi there,' }), _jsxs(Text, { children: [_jsx("b", { children: tenant.name }), " needs the bank account to send your payments to. Use the button below to add it. Never send bank details by email."] }), _jsx(Text, { children: form.type === 'oneTime'
|
|
7
7
|
? `The link works once and expires on ${form.expiresOn}.`
|
|
8
8
|
: form.setsUpLogin
|
|
9
9
|
? 'You will set up your owner portal login first, then add your bank details.'
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BankDetailsRequestEmailTemplate.js","sourceRoot":"src/","sources":["templates/BankDetailsRequestEmailTemplate.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;
|
|
1
|
+
{"version":3,"file":"BankDetailsRequestEmailTemplate.js","sourceRoot":"src/","sources":["templates/BankDetailsRequestEmailTemplate.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAmB9D,MAAM,CAAC,MAAM,+BAA+B,GAAG,CAAC,EAC9C,IAAI,EACJ,IAAI,EACJ,MAAM,EACN,SAAS,EACT,WAAW,EACX,IAAI,EACJ,IAAI,GACiC,EAAE,EAAE,CAAC,CAC1C,MAAC,cAAc,IACb,KAAK,EAAE,GAAG,MAAM,CAAC,IAAI,6BAA6B,SAAS,EAAE,EAC7D,gBAAgB,EAAE,wBAAwB,MAAM,CAAC,IAAI,eAAe,EACpE,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,IAAI,aAEV,KAAC,OAAO,IAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,YAAY,EAAE,MAAM,EAAE,YACpE,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC,CAAC,WAAW,GAC/C,EACV,MAAC,IAAI,eACH,sBAAI,MAAM,CAAC,IAAI,GAAK,2HAEf,EACP,KAAC,IAAI,cACF,IAAI,CAAC,IAAI,KAAK,SAAS;gBACtB,CAAC,CAAC,sCAAsC,IAAI,CAAC,SAAS,GAAG;gBACzD,CAAC,CAAC,IAAI,CAAC,WAAW;oBAChB,CAAC,CAAC,4EAA4E;oBAC9E,CAAC,CAAC,wDAAwD,GACzD,EACP,KAAC,MAAM,IACL,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,KAAK,EAAC,kBAAkB,EACxB,WAAW,EAAE,WAAW,GACxB,EACF,MAAC,IAAI,+DAC0C,MAAM,CAAC,IAAI,sCAEnD,IACQ,CAClB,CAAC","sourcesContent":["import { Heading } from '@react-email/heading';\nimport { Text } from '@react-email/text';\nimport { Button } from '../components/Button';\nimport { EmailContainer } from '../components/EmailContainer';\nimport type { EmailBaseProps } from '../types';\n\nexport type BankDetailsRequestEmailTemplateProps = {\n mode: EmailBaseProps['mode'];\n user: EmailBaseProps['user'];\n tenant: EmailBaseProps['tenant'];\n // The owner or vendor asked, so requests to different payees do not thread\n // together.\n payeeName: string;\n themeColors: EmailBaseProps['themeColors'];\n href: string;\n // Owners enter their details in the owner portal; vendors in a one-time\n // form that expires.\n form:\n | { type: 'ownerPortal'; setsUpLogin: boolean }\n | { type: 'oneTime'; expiresOn: string };\n};\n\nexport const BankDetailsRequestEmailTemplate = ({\n mode,\n user,\n tenant,\n payeeName,\n themeColors,\n href,\n form,\n}: BankDetailsRequestEmailTemplateProps) => (\n <EmailContainer\n title={`${tenant.name} needs payout details for ${payeeName}`}\n shortDescription={`Add the bank account ${tenant.name} pays you to.`}\n tenant={tenant}\n mode={mode}\n >\n <Heading style={{ fontSize: 28, fontWeight: 600, marginBottom: '50px' }}>\n {user.firstName ? `Hi ${user.firstName},` : 'Hi there,'}\n </Heading>\n <Text>\n <b>{tenant.name}</b> needs the bank account to send your payments to. Use\n the button below to add it. Never send bank details by email.\n </Text>\n <Text>\n {form.type === 'oneTime'\n ? `The link works once and expires on ${form.expiresOn}.`\n : form.setsUpLogin\n ? 'You will set up your owner portal login first, then add your bank details.'\n : 'Sign in to your owner portal to add your bank details.'}\n </Text>\n <Button\n href={href}\n mode={mode}\n label=\"Add bank details\"\n themeColors={themeColors}\n />\n <Text>\n If you did not expect this request, contact {tenant.name} before you enter\n any details.\n </Text>\n </EmailContainer>\n);\n"]}
|
package/package.json
CHANGED
package/src/index.ts
CHANGED
package/src/render.ts
ADDED
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { plainTextSelectors, render as renderEmail } from '@react-email/render';
|
|
2
|
+
|
|
3
|
+
// html-to-text uppercases headings by default, so the plain-text part of an
|
|
4
|
+
// email opened "HI THERE," (PRO-19711). Headings keep their case.
|
|
5
|
+
export const render: typeof renderEmail = (component, options) =>
|
|
6
|
+
renderEmail(
|
|
7
|
+
component,
|
|
8
|
+
options?.plainText
|
|
9
|
+
? {
|
|
10
|
+
...options,
|
|
11
|
+
htmlToTextOptions: {
|
|
12
|
+
...options.htmlToTextOptions,
|
|
13
|
+
selectors: [
|
|
14
|
+
...plainTextSelectors,
|
|
15
|
+
...['h1', 'h2', 'h3', 'h4', 'h5', 'h6'].map((selector) => ({
|
|
16
|
+
selector,
|
|
17
|
+
options: { uppercase: false },
|
|
18
|
+
})),
|
|
19
|
+
...(options.htmlToTextOptions?.selectors ?? []),
|
|
20
|
+
],
|
|
21
|
+
},
|
|
22
|
+
}
|
|
23
|
+
: options
|
|
24
|
+
);
|
|
@@ -7,7 +7,8 @@ export type BankAccountChangedEmailTemplateProps = {
|
|
|
7
7
|
mode: EmailBaseProps['mode'];
|
|
8
8
|
user: EmailBaseProps['user'];
|
|
9
9
|
tenant: EmailBaseProps['tenant'];
|
|
10
|
-
|
|
10
|
+
// Added: the payee had no bank account before.
|
|
11
|
+
bankAccount: { last4: string; changedOn: string; added: boolean };
|
|
11
12
|
};
|
|
12
13
|
|
|
13
14
|
export const BankAccountChangedEmailTemplate = ({
|
|
@@ -17,7 +18,11 @@ export const BankAccountChangedEmailTemplate = ({
|
|
|
17
18
|
bankAccount,
|
|
18
19
|
}: BankAccountChangedEmailTemplateProps) => (
|
|
19
20
|
<EmailContainer
|
|
20
|
-
title=
|
|
21
|
+
title={
|
|
22
|
+
bankAccount.added
|
|
23
|
+
? 'Your bank account was added'
|
|
24
|
+
: 'Your bank account was changed'
|
|
25
|
+
}
|
|
21
26
|
shortDescription={`${tenant.name} now pays you to the account ending in ${bankAccount.last4}.`}
|
|
22
27
|
tenant={tenant}
|
|
23
28
|
mode={mode}
|
|
@@ -25,14 +30,23 @@ export const BankAccountChangedEmailTemplate = ({
|
|
|
25
30
|
<Heading style={{ fontSize: 28, fontWeight: 600, marginBottom: '50px' }}>
|
|
26
31
|
{user.firstName ? `Hi ${user.firstName},` : 'Hi there,'}
|
|
27
32
|
</Heading>
|
|
33
|
+
{bankAccount.added ? (
|
|
34
|
+
<Text>
|
|
35
|
+
A bank account for payments from <b>{tenant.name}</b> was added on{' '}
|
|
36
|
+
{bankAccount.changedOn}. Future payments go to the account ending in{' '}
|
|
37
|
+
<b>{bankAccount.last4}</b>.
|
|
38
|
+
</Text>
|
|
39
|
+
) : (
|
|
40
|
+
<Text>
|
|
41
|
+
The bank account <b>{tenant.name}</b> pays you to was changed on{' '}
|
|
42
|
+
{bankAccount.changedOn}. Future payments go to the account ending in{' '}
|
|
43
|
+
<b>{bankAccount.last4}</b>. A payment already on its way still goes to
|
|
44
|
+
the previous account.
|
|
45
|
+
</Text>
|
|
46
|
+
)}
|
|
28
47
|
<Text>
|
|
29
|
-
|
|
30
|
-
{bankAccount.
|
|
31
|
-
<b>{bankAccount.last4}</b>. A payment already on its way still goes to the
|
|
32
|
-
previous account.
|
|
33
|
-
</Text>
|
|
34
|
-
<Text>
|
|
35
|
-
If you did not make or request this change, contact {tenant.name} right
|
|
48
|
+
If you did not make or request this{' '}
|
|
49
|
+
{bankAccount.added ? 'addition' : 'change'}, contact {tenant.name} right
|
|
36
50
|
away.
|
|
37
51
|
</Text>
|
|
38
52
|
</EmailContainer>
|
|
@@ -9,7 +9,13 @@ export type BankAccountChangedTeamAdminEmailTemplateProps = {
|
|
|
9
9
|
mode: EmailBaseProps['mode'];
|
|
10
10
|
tenant: EmailBaseProps['tenant'];
|
|
11
11
|
contact: { name: string; type: 'owner' | 'vendor' };
|
|
12
|
-
|
|
12
|
+
// Added: the contact had no bank account before.
|
|
13
|
+
bankAccount: {
|
|
14
|
+
last4: string;
|
|
15
|
+
changedOn: string;
|
|
16
|
+
changedBy: string | null;
|
|
17
|
+
added: boolean;
|
|
18
|
+
};
|
|
13
19
|
href: string;
|
|
14
20
|
};
|
|
15
21
|
|
|
@@ -21,17 +27,17 @@ export const BankAccountChangedTeamAdminEmailTemplate = ({
|
|
|
21
27
|
href,
|
|
22
28
|
}: BankAccountChangedTeamAdminEmailTemplateProps) => (
|
|
23
29
|
<EmailContainer
|
|
24
|
-
title={`Bank details changed for ${contact.name}`}
|
|
30
|
+
title={`Bank details ${bankAccount.added ? 'added' : 'changed'} for ${contact.name}`}
|
|
25
31
|
shortDescription={`Future payments to ${contact.name} go to the account ending in ${bankAccount.last4}.`}
|
|
26
32
|
tenant={tenant}
|
|
27
33
|
mode={mode}
|
|
28
34
|
>
|
|
29
35
|
<Heading style={{ fontSize: 28, fontWeight: 600, marginBottom: '50px' }}>
|
|
30
|
-
Bank details changed
|
|
36
|
+
Bank details {bankAccount.added ? 'added' : 'changed'}
|
|
31
37
|
</Heading>
|
|
32
38
|
<Text>
|
|
33
|
-
The bank account of {contact.type} <b>{contact.name}</b> was
|
|
34
|
-
{bankAccount.changedOn}
|
|
39
|
+
The bank account of {contact.type} <b>{contact.name}</b> was{' '}
|
|
40
|
+
{bankAccount.added ? 'added' : 'changed'} on {bankAccount.changedOn}
|
|
35
41
|
{bankAccount.changedBy ? ` by ${bankAccount.changedBy}` : ''}. Future
|
|
36
42
|
payments go to the account ending in <b>{bankAccount.last4}</b>.
|
|
37
43
|
</Text>
|
|
@@ -8,6 +8,9 @@ export type BankDetailsRequestEmailTemplateProps = {
|
|
|
8
8
|
mode: EmailBaseProps['mode'];
|
|
9
9
|
user: EmailBaseProps['user'];
|
|
10
10
|
tenant: EmailBaseProps['tenant'];
|
|
11
|
+
// The owner or vendor asked, so requests to different payees do not thread
|
|
12
|
+
// together.
|
|
13
|
+
payeeName: string;
|
|
11
14
|
themeColors: EmailBaseProps['themeColors'];
|
|
12
15
|
href: string;
|
|
13
16
|
// Owners enter their details in the owner portal; vendors in a one-time
|
|
@@ -21,12 +24,13 @@ export const BankDetailsRequestEmailTemplate = ({
|
|
|
21
24
|
mode,
|
|
22
25
|
user,
|
|
23
26
|
tenant,
|
|
27
|
+
payeeName,
|
|
24
28
|
themeColors,
|
|
25
29
|
href,
|
|
26
30
|
form,
|
|
27
31
|
}: BankDetailsRequestEmailTemplateProps) => (
|
|
28
32
|
<EmailContainer
|
|
29
|
-
title={`${tenant.name} needs
|
|
33
|
+
title={`${tenant.name} needs payout details for ${payeeName}`}
|
|
30
34
|
shortDescription={`Add the bank account ${tenant.name} pays you to.`}
|
|
31
35
|
tenant={tenant}
|
|
32
36
|
mode={mode}
|