brookmind-emails 0.1.8 → 0.1.9
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/dist/modelfy/config.d.ts +4 -0
- package/dist/modelfy/config.d.ts.map +1 -1
- package/dist/modelfy/config.js +6 -0
- package/dist/modelfy/index.d.ts +4 -2
- package/dist/modelfy/index.d.ts.map +1 -1
- package/dist/modelfy/index.js +11 -1
- package/dist/modelfy/templates/GrantCreditsEmail.d.ts.map +1 -1
- package/dist/modelfy/templates/GrantCreditsEmail.js +137 -50
- package/dist/modelfy/templates/OtpEmail.d.ts.map +1 -1
- package/dist/modelfy/templates/OtpEmail.js +108 -30
- package/dist/modelfy/templates/PromoSubscriptionEmail.d.ts.map +1 -1
- package/dist/modelfy/templates/PromoSubscriptionEmail.js +128 -41
- package/dist/modelfy/templates/WelcomeEmail.d.ts +6 -0
- package/dist/modelfy/templates/WelcomeEmail.d.ts.map +1 -0
- package/dist/modelfy/templates/WelcomeEmail.js +377 -0
- package/dist/modelfy/templates/index.d.ts +1 -0
- package/dist/modelfy/templates/index.d.ts.map +1 -1
- package/dist/modelfy/templates/index.js +1 -0
- package/package.json +1 -1
- package/src/modelfy/config.ts +6 -0
- package/src/modelfy/index.ts +16 -2
- package/src/modelfy/templates/GrantCreditsEmail.tsx +229 -82
- package/src/modelfy/templates/OtpEmail.tsx +185 -40
- package/src/modelfy/templates/PromoSubscriptionEmail.tsx +234 -79
- package/src/modelfy/templates/WelcomeEmail.tsx +619 -0
- package/src/modelfy/templates/index.ts +1 -0
package/dist/modelfy/config.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["../../src/modelfy/config.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,aAAa
|
|
1
|
+
{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["../../src/modelfy/config.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,aAAa;;;;;;;;;CAWzB,CAAC"}
|
package/dist/modelfy/config.js
CHANGED
|
@@ -3,4 +3,10 @@ export const modelfyConfig = {
|
|
|
3
3
|
companyName: "Modelfy",
|
|
4
4
|
supportEmail: "support@modelfy.ai",
|
|
5
5
|
appUrl: "https://modelfy.ai",
|
|
6
|
+
// App Store links
|
|
7
|
+
appStoreUrl: "https://apps.apple.com/app/id6753621155",
|
|
8
|
+
playStoreUrl: "https://play.google.com/store/apps/details?id=com.brookmind.modelfy",
|
|
9
|
+
// Badge images (using landing page assets)
|
|
10
|
+
appStoreBadgeUrl: "https://modelfy.ai/images/appstore.svg",
|
|
11
|
+
playStoreBadgeUrl: "https://modelfy.ai/images/googleplay.svg",
|
|
6
12
|
};
|
package/dist/modelfy/index.d.ts
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import { OtpEmail, type OtpEmailProps } from "./templates/OtpEmail.js";
|
|
2
2
|
import { PromoSubscriptionEmail, type PromoSubscriptionEmailProps } from "./templates/PromoSubscriptionEmail.js";
|
|
3
3
|
import { GrantCreditsEmail, type GrantCreditsEmailProps } from "./templates/GrantCreditsEmail.js";
|
|
4
|
-
|
|
5
|
-
export {
|
|
4
|
+
import { WelcomeEmail, type WelcomeEmailProps } from "./templates/WelcomeEmail.js";
|
|
5
|
+
export type { OtpEmailProps, PromoSubscriptionEmailProps, GrantCreditsEmailProps, WelcomeEmailProps };
|
|
6
|
+
export { OtpEmail, PromoSubscriptionEmail, GrantCreditsEmail, WelcomeEmail };
|
|
6
7
|
export interface RenderResult {
|
|
7
8
|
subject: string;
|
|
8
9
|
html: string;
|
|
@@ -11,4 +12,5 @@ export interface RenderResult {
|
|
|
11
12
|
export declare function renderOtpEmail(props: OtpEmailProps): Promise<RenderResult>;
|
|
12
13
|
export declare function renderPromoSubscriptionEmail(props: PromoSubscriptionEmailProps): Promise<RenderResult>;
|
|
13
14
|
export declare function renderGrantCreditsEmail(props: GrantCreditsEmailProps): Promise<RenderResult>;
|
|
15
|
+
export declare function renderWelcomeEmail(props: WelcomeEmailProps): Promise<RenderResult>;
|
|
14
16
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/modelfy/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,yBAAyB,CAAC;AACvE,OAAO,EACL,sBAAsB,EACtB,KAAK,2BAA2B,EACjC,MAAM,uCAAuC,CAAC;AAC/C,OAAO,EAAE,iBAAiB,EAAE,KAAK,sBAAsB,EAAE,MAAM,kCAAkC,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/modelfy/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,yBAAyB,CAAC;AACvE,OAAO,EACL,sBAAsB,EACtB,KAAK,2BAA2B,EACjC,MAAM,uCAAuC,CAAC;AAC/C,OAAO,EAAE,iBAAiB,EAAE,KAAK,sBAAsB,EAAE,MAAM,kCAAkC,CAAC;AAClG,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAGnF,YAAY,EAAE,aAAa,EAAE,2BAA2B,EAAE,sBAAsB,EAAE,iBAAiB,EAAE,CAAC;AAGtG,OAAO,EAAE,QAAQ,EAAE,sBAAsB,EAAE,iBAAiB,EAAE,YAAY,EAAE,CAAC;AAG7E,MAAM,WAAW,YAAY;IAC3B,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;CACd;AAED,wBAAsB,cAAc,CAAC,KAAK,EAAE,aAAa,GAAG,OAAO,CAAC,YAAY,CAAC,CAShF;AAED,wBAAsB,4BAA4B,CAChD,KAAK,EAAE,2BAA2B,GACjC,OAAO,CAAC,YAAY,CAAC,CASvB;AAED,wBAAsB,uBAAuB,CAC3C,KAAK,EAAE,sBAAsB,GAC5B,OAAO,CAAC,YAAY,CAAC,CASvB;AAED,wBAAsB,kBAAkB,CACtC,KAAK,EAAE,iBAAiB,GACvB,OAAO,CAAC,YAAY,CAAC,CASvB"}
|
package/dist/modelfy/index.js
CHANGED
|
@@ -2,8 +2,9 @@ import { render } from "@react-email/render";
|
|
|
2
2
|
import { OtpEmail } from "./templates/OtpEmail.js";
|
|
3
3
|
import { PromoSubscriptionEmail, } from "./templates/PromoSubscriptionEmail.js";
|
|
4
4
|
import { GrantCreditsEmail } from "./templates/GrantCreditsEmail.js";
|
|
5
|
+
import { WelcomeEmail } from "./templates/WelcomeEmail.js";
|
|
5
6
|
// Re-export components for preview
|
|
6
|
-
export { OtpEmail, PromoSubscriptionEmail, GrantCreditsEmail };
|
|
7
|
+
export { OtpEmail, PromoSubscriptionEmail, GrantCreditsEmail, WelcomeEmail };
|
|
7
8
|
export async function renderOtpEmail(props) {
|
|
8
9
|
const html = await render(OtpEmail(props));
|
|
9
10
|
const text = await render(OtpEmail(props), { plainText: true });
|
|
@@ -31,3 +32,12 @@ export async function renderGrantCreditsEmail(props) {
|
|
|
31
32
|
text,
|
|
32
33
|
};
|
|
33
34
|
}
|
|
35
|
+
export async function renderWelcomeEmail(props) {
|
|
36
|
+
const html = await render(WelcomeEmail(props));
|
|
37
|
+
const text = await render(WelcomeEmail(props), { plainText: true });
|
|
38
|
+
return {
|
|
39
|
+
subject: "Welcome to Modelfy!",
|
|
40
|
+
html,
|
|
41
|
+
text,
|
|
42
|
+
};
|
|
43
|
+
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GrantCreditsEmail.d.ts","sourceRoot":"","sources":["../../../src/modelfy/templates/GrantCreditsEmail.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"GrantCreditsEmail.d.ts","sourceRoot":"","sources":["../../../src/modelfy/templates/GrantCreditsEmail.tsx"],"names":[],"mappings":"AAeA,MAAM,WAAW,sBAAsB;IACrC,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,YAAY,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAkLD,wBAAgB,iBAAiB,CAAC,EAChC,KAA0B,EAC1B,OAAO,EACP,YAAiB,EACjB,SAA8B,EAC9B,WAAW,GACZ,EAAE,sBAAsB,2CAgJxB;AAED,eAAe,iBAAiB,CAAC"}
|
|
@@ -1,101 +1,188 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { Html, Head, Body, Container, Section, Text, Link, Preview, Font, } from "@react-email/components";
|
|
3
|
-
import { Header, Footer, Button } from "../../shared/components/index.js";
|
|
2
|
+
import { Html, Head, Body, Container, Section, Text, Link, Preview, Font, Img, Button as ReactEmailButton, } from "@react-email/components";
|
|
4
3
|
import { modelfyConfig } from "../config.js";
|
|
4
|
+
// Design System Colors - Matching Modelfy Landing
|
|
5
|
+
const colors = {
|
|
6
|
+
background: "#0d0d0d",
|
|
7
|
+
cardBg: "#121212",
|
|
8
|
+
primary: "#0a8f5a",
|
|
9
|
+
white: "#f2f2f2",
|
|
10
|
+
textSecondary: "rgba(242, 242, 242, 0.7)",
|
|
11
|
+
textMuted: "#8c8c8c",
|
|
12
|
+
border: "#262626",
|
|
13
|
+
};
|
|
5
14
|
const styles = {
|
|
6
15
|
body: {
|
|
7
16
|
margin: 0,
|
|
8
17
|
padding: 0,
|
|
9
|
-
backgroundColor:
|
|
10
|
-
fontFamily: "'
|
|
18
|
+
backgroundColor: colors.background,
|
|
19
|
+
fontFamily: "'Inter', 'Segoe UI', Arial, sans-serif",
|
|
11
20
|
},
|
|
12
21
|
container: {
|
|
13
|
-
maxWidth: "
|
|
14
|
-
margin: "
|
|
15
|
-
backgroundColor:
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
22
|
+
maxWidth: "600px",
|
|
23
|
+
margin: "0 auto",
|
|
24
|
+
backgroundColor: colors.background,
|
|
25
|
+
},
|
|
26
|
+
header: {
|
|
27
|
+
backgroundColor: colors.background,
|
|
28
|
+
padding: "40px 32px 24px",
|
|
29
|
+
textAlign: "center",
|
|
30
|
+
},
|
|
31
|
+
logo: {
|
|
32
|
+
display: "block",
|
|
33
|
+
margin: "0 auto",
|
|
34
|
+
},
|
|
35
|
+
heroSection: {
|
|
36
|
+
padding: "24px 32px 40px",
|
|
37
|
+
textAlign: "center",
|
|
38
|
+
},
|
|
39
|
+
heroTagline: {
|
|
40
|
+
margin: "0 0 12px",
|
|
41
|
+
fontSize: "13px",
|
|
42
|
+
fontWeight: 600,
|
|
43
|
+
color: colors.primary,
|
|
44
|
+
letterSpacing: "2px",
|
|
45
|
+
textTransform: "uppercase",
|
|
46
|
+
},
|
|
47
|
+
heroHeading: {
|
|
25
48
|
margin: "0 0 16px",
|
|
26
|
-
fontSize: "
|
|
49
|
+
fontSize: "28px",
|
|
27
50
|
fontWeight: 700,
|
|
28
|
-
color:
|
|
29
|
-
|
|
51
|
+
color: colors.white,
|
|
52
|
+
lineHeight: "1.3",
|
|
30
53
|
},
|
|
31
54
|
paragraph: {
|
|
32
|
-
margin: "0 0
|
|
55
|
+
margin: "0 0 28px",
|
|
33
56
|
fontSize: "16px",
|
|
34
57
|
lineHeight: "1.6",
|
|
35
|
-
color:
|
|
58
|
+
color: colors.textSecondary,
|
|
59
|
+
textAlign: "center",
|
|
36
60
|
},
|
|
37
61
|
creditBox: {
|
|
38
|
-
backgroundColor: "rgba(
|
|
39
|
-
border:
|
|
62
|
+
backgroundColor: "rgba(10, 143, 90, 0.15)",
|
|
63
|
+
border: `1px solid rgba(10, 143, 90, 0.3)`,
|
|
40
64
|
borderRadius: "12px",
|
|
41
65
|
padding: "24px",
|
|
42
|
-
marginBottom: "
|
|
66
|
+
marginBottom: "28px",
|
|
43
67
|
textAlign: "center",
|
|
44
68
|
},
|
|
45
69
|
creditAmount: {
|
|
46
70
|
fontSize: "48px",
|
|
47
71
|
fontWeight: 700,
|
|
48
|
-
color:
|
|
49
|
-
margin: "0 0
|
|
72
|
+
color: colors.white,
|
|
73
|
+
margin: "0 0 4px",
|
|
50
74
|
},
|
|
51
75
|
creditLabel: {
|
|
52
|
-
fontSize: "
|
|
53
|
-
color:
|
|
76
|
+
fontSize: "14px",
|
|
77
|
+
color: colors.textMuted,
|
|
54
78
|
margin: 0,
|
|
55
79
|
},
|
|
56
80
|
detailsBox: {
|
|
57
|
-
backgroundColor:
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
detailRow: {
|
|
63
|
-
display: "flex",
|
|
64
|
-
justifyContent: "space-between",
|
|
65
|
-
marginBottom: "8px",
|
|
81
|
+
backgroundColor: colors.cardBg,
|
|
82
|
+
border: `1px solid ${colors.border}`,
|
|
83
|
+
borderRadius: "12px",
|
|
84
|
+
padding: "20px 24px",
|
|
85
|
+
marginBottom: "28px",
|
|
66
86
|
},
|
|
67
87
|
detailLabel: {
|
|
68
|
-
fontSize: "
|
|
69
|
-
color:
|
|
70
|
-
margin: 0,
|
|
88
|
+
fontSize: "13px",
|
|
89
|
+
color: colors.textMuted,
|
|
90
|
+
margin: "0 0 4px",
|
|
71
91
|
},
|
|
72
92
|
detailValue: {
|
|
73
|
-
fontSize: "
|
|
93
|
+
fontSize: "16px",
|
|
74
94
|
fontWeight: 600,
|
|
75
|
-
color:
|
|
95
|
+
color: colors.white,
|
|
76
96
|
margin: 0,
|
|
77
97
|
},
|
|
78
98
|
buttonContainer: {
|
|
79
99
|
textAlign: "center",
|
|
80
|
-
marginBottom: "
|
|
100
|
+
marginBottom: "28px",
|
|
101
|
+
},
|
|
102
|
+
ctaButton: {
|
|
103
|
+
display: "inline-block",
|
|
104
|
+
padding: "14px 36px",
|
|
105
|
+
fontSize: "15px",
|
|
106
|
+
fontWeight: 600,
|
|
107
|
+
textDecoration: "none",
|
|
108
|
+
borderRadius: "10px",
|
|
109
|
+
backgroundColor: colors.primary,
|
|
110
|
+
color: "#ffffff",
|
|
111
|
+
textAlign: "center",
|
|
112
|
+
},
|
|
113
|
+
contentSection: {
|
|
114
|
+
backgroundColor: colors.cardBg,
|
|
115
|
+
padding: "32px",
|
|
116
|
+
borderTop: `1px solid ${colors.border}`,
|
|
81
117
|
},
|
|
82
118
|
smallText: {
|
|
83
119
|
margin: "0 0 12px",
|
|
84
120
|
fontSize: "14px",
|
|
85
121
|
lineHeight: "1.6",
|
|
86
|
-
color:
|
|
122
|
+
color: colors.textMuted,
|
|
123
|
+
textAlign: "center",
|
|
124
|
+
},
|
|
125
|
+
descriptionText: {
|
|
126
|
+
margin: "0 0 24px",
|
|
127
|
+
fontSize: "15px",
|
|
128
|
+
lineHeight: "1.6",
|
|
129
|
+
color: colors.textSecondary,
|
|
130
|
+
textAlign: "center",
|
|
131
|
+
fontStyle: "italic",
|
|
87
132
|
},
|
|
88
133
|
link: {
|
|
89
|
-
color:
|
|
134
|
+
color: colors.primary,
|
|
90
135
|
textDecoration: "none",
|
|
91
136
|
fontWeight: 600,
|
|
92
137
|
},
|
|
138
|
+
footer: {
|
|
139
|
+
backgroundColor: colors.cardBg,
|
|
140
|
+
padding: "24px 32px",
|
|
141
|
+
textAlign: "center",
|
|
142
|
+
borderTop: `1px solid ${colors.border}`,
|
|
143
|
+
},
|
|
144
|
+
footerLogo: {
|
|
145
|
+
display: "block",
|
|
146
|
+
margin: "0 auto 12px",
|
|
147
|
+
opacity: 0.6,
|
|
148
|
+
},
|
|
149
|
+
footerText: {
|
|
150
|
+
margin: "0 0 4px",
|
|
151
|
+
fontSize: "11px",
|
|
152
|
+
color: colors.textMuted,
|
|
153
|
+
lineHeight: "1.6",
|
|
154
|
+
},
|
|
155
|
+
footerLink: {
|
|
156
|
+
color: colors.textMuted,
|
|
157
|
+
textDecoration: "underline",
|
|
158
|
+
},
|
|
159
|
+
downloadSection: {
|
|
160
|
+
backgroundColor: colors.cardBg,
|
|
161
|
+
padding: "24px 32px",
|
|
162
|
+
textAlign: "center",
|
|
163
|
+
borderTop: `1px solid ${colors.border}`,
|
|
164
|
+
},
|
|
165
|
+
downloadText: {
|
|
166
|
+
margin: "0 0 16px",
|
|
167
|
+
fontSize: "14px",
|
|
168
|
+
color: colors.white,
|
|
169
|
+
},
|
|
170
|
+
badgeContainer: {
|
|
171
|
+
textAlign: "center",
|
|
172
|
+
},
|
|
173
|
+
badge: {
|
|
174
|
+
display: "inline-block",
|
|
175
|
+
margin: "0 8px",
|
|
176
|
+
},
|
|
93
177
|
};
|
|
94
|
-
export function GrantCreditsEmail({ email, credits, durationDays, expiresAt, description, }) {
|
|
178
|
+
export function GrantCreditsEmail({ email = "user@example.com", credits, durationDays = 30, expiresAt = "January 31, 2025", description, }) {
|
|
95
179
|
const safeCredits = Number.isFinite(credits) ? Number(credits) : 0;
|
|
96
|
-
return (_jsxs(Html, { lang: "en", children: [
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
180
|
+
return (_jsxs(Html, { lang: "en", children: [_jsxs(Head, { children: [_jsx(Font, { fontFamily: "Inter", fallbackFontFamily: "Arial", webFont: {
|
|
181
|
+
url: "https://fonts.gstatic.com/s/inter/v13/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuLyfAZ9hjp-Ek-_0.woff2",
|
|
182
|
+
format: "woff2",
|
|
183
|
+
}, fontWeight: 400, fontStyle: "normal" }), _jsx(Font, { fontFamily: "Inter", fallbackFontFamily: "Arial", webFont: {
|
|
184
|
+
url: "https://fonts.gstatic.com/s/inter/v13/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuFuYAZ9hjp-Ek-_0.woff2",
|
|
185
|
+
format: "woff2",
|
|
186
|
+
}, fontWeight: 700, fontStyle: "normal" })] }), _jsxs(Preview, { children: ["You've received ", safeCredits.toLocaleString(), " credits on Modelfy!"] }), _jsx(Body, { style: styles.body, children: _jsxs(Container, { style: styles.container, children: [_jsx(Section, { style: styles.header, children: _jsx(Img, { src: modelfyConfig.logoUrl, width: "130", height: "auto", alt: "Modelfy", style: styles.logo }) }), _jsxs(Section, { style: styles.heroSection, children: [_jsx(Text, { style: styles.heroTagline, children: "Bonus Credits" }), _jsx(Text, { style: styles.heroHeading, children: "Credits Added to Your Account!" }), _jsxs(Text, { style: styles.paragraph, children: ["Hi ", _jsx("span", { style: { color: colors.white, fontWeight: 600 }, children: email }), ", you've received bonus credits to use on Modelfy."] }), _jsxs("div", { style: styles.creditBox, children: [_jsx(Text, { style: styles.creditAmount, children: safeCredits.toLocaleString() }), _jsx(Text, { style: styles.creditLabel, children: "credits" })] }), _jsx("div", { style: styles.detailsBox, children: _jsx("table", { width: "100%", cellPadding: 0, cellSpacing: 0, children: _jsx("tbody", { children: _jsxs("tr", { children: [_jsxs("td", { style: { paddingBottom: "16px" }, children: [_jsx(Text, { style: styles.detailLabel, children: "Valid for" }), _jsxs(Text, { style: styles.detailValue, children: [durationDays, " days"] })] }), _jsxs("td", { style: { paddingBottom: "16px", textAlign: "right" }, children: [_jsx(Text, { style: styles.detailLabel, children: "Expires" }), _jsx(Text, { style: styles.detailValue, children: expiresAt })] })] }) }) }) }), description && _jsxs(Text, { style: styles.descriptionText, children: ["\"", description, "\""] }), _jsx("div", { style: styles.buttonContainer, children: _jsx(ReactEmailButton, { href: modelfyConfig.appUrl, style: styles.ctaButton, children: "Start Creating" }) })] }), _jsxs(Section, { style: styles.contentSection, children: [_jsxs(Text, { style: styles.smallText, children: ["These credits will be used before your regular credits and expire on ", expiresAt, "."] }), _jsxs(Text, { style: styles.smallText, children: ["Questions?", " ", _jsx(Link, { href: `mailto:${modelfyConfig.supportEmail}`, style: styles.link, children: modelfyConfig.supportEmail })] })] }), _jsxs(Section, { style: styles.downloadSection, children: [_jsx(Text, { style: styles.downloadText, children: "Get the Modelfy app" }), _jsxs("div", { style: styles.badgeContainer, children: [_jsx(Link, { href: modelfyConfig.appStoreUrl, style: styles.badge, children: _jsx(Img, { src: modelfyConfig.appStoreBadgeUrl, width: "120", height: "40", alt: "Download on the App Store" }) }), _jsx(Link, { href: modelfyConfig.playStoreUrl, style: styles.badge, children: _jsx(Img, { src: modelfyConfig.playStoreBadgeUrl, width: "135", height: "40", alt: "Get it on Google Play" }) })] })] }), _jsxs(Section, { style: styles.footer, children: [_jsx(Img, { src: modelfyConfig.logoUrl, width: "80", height: "auto", alt: "Modelfy", style: styles.footerLogo }), _jsxs(Text, { style: styles.footerText, children: ["\u00A9 ", new Date().getFullYear(), " ", modelfyConfig.companyName, ". All rights reserved."] }), _jsx(Text, { style: styles.footerText, children: "You received this email because credits were added to your Modelfy account." }), _jsx(Text, { style: styles.footerText, children: _jsx(Link, { href: `${modelfyConfig.appUrl}/privacy`, style: styles.footerLink, children: "Privacy Policy" }) })] })] }) })] }));
|
|
100
187
|
}
|
|
101
188
|
export default GrantCreditsEmail;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OtpEmail.d.ts","sourceRoot":"","sources":["../../../src/modelfy/templates/OtpEmail.tsx"],"names":[],"mappings":"AAcA,MAAM,WAAW,aAAa;IAC5B,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;
|
|
1
|
+
{"version":3,"file":"OtpEmail.d.ts","sourceRoot":"","sources":["../../../src/modelfy/templates/OtpEmail.tsx"],"names":[],"mappings":"AAcA,MAAM,WAAW,aAAa;IAC5B,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAoID,wBAAgB,QAAQ,CAAC,EAAE,GAAc,EAAE,KAA0B,EAAE,iBAAsB,EAAE,EAAE,aAAa,2CAwH7G;AAED,eAAe,QAAQ,CAAC"}
|
|
@@ -1,66 +1,144 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { Html, Head, Body, Container, Section, Text, Link, Preview, Font, } from "@react-email/components";
|
|
3
|
-
import { Header, Footer } from "../../shared/components/index.js";
|
|
2
|
+
import { Html, Head, Body, Container, Section, Text, Link, Preview, Font, Img, } from "@react-email/components";
|
|
4
3
|
import { modelfyConfig } from "../config.js";
|
|
4
|
+
// Design System Colors - Matching Modelfy Landing
|
|
5
|
+
const colors = {
|
|
6
|
+
background: "#0d0d0d",
|
|
7
|
+
cardBg: "#121212",
|
|
8
|
+
primary: "#0a8f5a",
|
|
9
|
+
white: "#f2f2f2",
|
|
10
|
+
textSecondary: "rgba(242, 242, 242, 0.7)",
|
|
11
|
+
textMuted: "#8c8c8c",
|
|
12
|
+
border: "#262626",
|
|
13
|
+
};
|
|
5
14
|
const styles = {
|
|
6
15
|
body: {
|
|
7
16
|
margin: 0,
|
|
8
17
|
padding: 0,
|
|
9
|
-
backgroundColor:
|
|
10
|
-
fontFamily: "'
|
|
18
|
+
backgroundColor: colors.background,
|
|
19
|
+
fontFamily: "'Inter', 'Segoe UI', Arial, sans-serif",
|
|
11
20
|
},
|
|
12
21
|
container: {
|
|
13
|
-
maxWidth: "
|
|
14
|
-
margin: "
|
|
15
|
-
backgroundColor:
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
22
|
+
maxWidth: "600px",
|
|
23
|
+
margin: "0 auto",
|
|
24
|
+
backgroundColor: colors.background,
|
|
25
|
+
},
|
|
26
|
+
header: {
|
|
27
|
+
backgroundColor: colors.background,
|
|
28
|
+
padding: "40px 32px 24px",
|
|
29
|
+
textAlign: "center",
|
|
30
|
+
},
|
|
31
|
+
logo: {
|
|
32
|
+
display: "block",
|
|
33
|
+
margin: "0 auto",
|
|
34
|
+
},
|
|
35
|
+
heroSection: {
|
|
36
|
+
padding: "24px 32px 40px",
|
|
37
|
+
textAlign: "center",
|
|
38
|
+
},
|
|
39
|
+
heroTagline: {
|
|
40
|
+
margin: "0 0 12px",
|
|
41
|
+
fontSize: "13px",
|
|
42
|
+
fontWeight: 600,
|
|
43
|
+
color: colors.primary,
|
|
44
|
+
letterSpacing: "2px",
|
|
45
|
+
textTransform: "uppercase",
|
|
20
46
|
},
|
|
21
|
-
|
|
22
|
-
|
|
47
|
+
heroHeading: {
|
|
48
|
+
margin: "0 0 16px",
|
|
49
|
+
fontSize: "28px",
|
|
50
|
+
fontWeight: 700,
|
|
51
|
+
color: colors.white,
|
|
52
|
+
lineHeight: "1.3",
|
|
23
53
|
},
|
|
24
54
|
paragraph: {
|
|
25
|
-
margin: "
|
|
55
|
+
margin: "0 0 28px",
|
|
26
56
|
fontSize: "16px",
|
|
27
57
|
lineHeight: "1.6",
|
|
28
|
-
color:
|
|
58
|
+
color: colors.textSecondary,
|
|
29
59
|
},
|
|
30
60
|
otpContainer: {
|
|
31
61
|
display: "inline-block",
|
|
32
|
-
backgroundColor: "rgba(
|
|
33
|
-
border:
|
|
62
|
+
backgroundColor: "rgba(10, 143, 90, 0.15)",
|
|
63
|
+
border: `1px solid rgba(10, 143, 90, 0.3)`,
|
|
34
64
|
borderRadius: "12px",
|
|
35
|
-
padding: "
|
|
36
|
-
marginBottom: "
|
|
65
|
+
padding: "24px 40px",
|
|
66
|
+
marginBottom: "28px",
|
|
37
67
|
},
|
|
38
68
|
otp: {
|
|
39
|
-
fontSize: "
|
|
40
|
-
letterSpacing: "
|
|
69
|
+
fontSize: "36px",
|
|
70
|
+
letterSpacing: "10px",
|
|
41
71
|
fontWeight: 700,
|
|
42
|
-
color:
|
|
72
|
+
color: colors.white,
|
|
43
73
|
margin: 0,
|
|
44
74
|
},
|
|
75
|
+
contentSection: {
|
|
76
|
+
backgroundColor: colors.cardBg,
|
|
77
|
+
padding: "32px",
|
|
78
|
+
borderTop: `1px solid ${colors.border}`,
|
|
79
|
+
},
|
|
45
80
|
smallText: {
|
|
46
81
|
margin: "0 0 12px",
|
|
47
|
-
fontSize: "
|
|
82
|
+
fontSize: "14px",
|
|
48
83
|
lineHeight: "1.6",
|
|
49
|
-
color:
|
|
84
|
+
color: colors.textMuted,
|
|
85
|
+
textAlign: "center",
|
|
50
86
|
},
|
|
51
87
|
link: {
|
|
52
|
-
color:
|
|
88
|
+
color: colors.primary,
|
|
53
89
|
textDecoration: "none",
|
|
54
90
|
fontWeight: 600,
|
|
55
91
|
},
|
|
92
|
+
footer: {
|
|
93
|
+
backgroundColor: colors.cardBg,
|
|
94
|
+
padding: "24px 32px",
|
|
95
|
+
textAlign: "center",
|
|
96
|
+
borderTop: `1px solid ${colors.border}`,
|
|
97
|
+
},
|
|
98
|
+
footerLogo: {
|
|
99
|
+
display: "block",
|
|
100
|
+
margin: "0 auto 12px",
|
|
101
|
+
opacity: 0.6,
|
|
102
|
+
},
|
|
103
|
+
footerText: {
|
|
104
|
+
margin: "0 0 4px",
|
|
105
|
+
fontSize: "11px",
|
|
106
|
+
color: colors.textMuted,
|
|
107
|
+
lineHeight: "1.6",
|
|
108
|
+
},
|
|
109
|
+
footerLink: {
|
|
110
|
+
color: colors.textMuted,
|
|
111
|
+
textDecoration: "underline",
|
|
112
|
+
},
|
|
113
|
+
downloadSection: {
|
|
114
|
+
backgroundColor: colors.cardBg,
|
|
115
|
+
padding: "24px 32px",
|
|
116
|
+
textAlign: "center",
|
|
117
|
+
borderTop: `1px solid ${colors.border}`,
|
|
118
|
+
},
|
|
119
|
+
downloadText: {
|
|
120
|
+
margin: "0 0 16px",
|
|
121
|
+
fontSize: "14px",
|
|
122
|
+
color: colors.white,
|
|
123
|
+
},
|
|
124
|
+
badgeContainer: {
|
|
125
|
+
textAlign: "center",
|
|
126
|
+
},
|
|
127
|
+
badge: {
|
|
128
|
+
display: "inline-block",
|
|
129
|
+
margin: "0 8px",
|
|
130
|
+
},
|
|
56
131
|
};
|
|
57
|
-
export function OtpEmail({ otp, email, expirationMinutes = 10 }) {
|
|
132
|
+
export function OtpEmail({ otp = "123456", email = "user@example.com", expirationMinutes = 10 }) {
|
|
58
133
|
const sanitizedOtp = (typeof otp === "string" ? otp : String(otp ?? ""))
|
|
59
134
|
.replace(/\s+/g, "")
|
|
60
135
|
.trim();
|
|
61
|
-
return (_jsxs(Html, { lang: "en", children: [
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
136
|
+
return (_jsxs(Html, { lang: "en", children: [_jsxs(Head, { children: [_jsx(Font, { fontFamily: "Inter", fallbackFontFamily: "Arial", webFont: {
|
|
137
|
+
url: "https://fonts.gstatic.com/s/inter/v13/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuLyfAZ9hjp-Ek-_0.woff2",
|
|
138
|
+
format: "woff2",
|
|
139
|
+
}, fontWeight: 400, fontStyle: "normal" }), _jsx(Font, { fontFamily: "Inter", fallbackFontFamily: "Arial", webFont: {
|
|
140
|
+
url: "https://fonts.gstatic.com/s/inter/v13/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuFuYAZ9hjp-Ek-_0.woff2",
|
|
141
|
+
format: "woff2",
|
|
142
|
+
}, fontWeight: 700, fontStyle: "normal" })] }), _jsxs(Preview, { children: ["Your Modelfy access code: ", sanitizedOtp] }), _jsx(Body, { style: styles.body, children: _jsxs(Container, { style: styles.container, children: [_jsx(Section, { style: styles.header, children: _jsx(Img, { src: modelfyConfig.logoUrl, width: "130", height: "auto", alt: "Modelfy", style: styles.logo }) }), _jsxs(Section, { style: styles.heroSection, children: [_jsx(Text, { style: styles.heroTagline, children: "Access Code" }), _jsx(Text, { style: styles.heroHeading, children: "Sign In to Modelfy" }), _jsxs(Text, { style: { ...styles.paragraph, margin: "0 0 4px" }, children: ["Hi ", _jsx("span", { style: { color: colors.white, fontWeight: 600 }, children: email }), ", use the code below to sign in."] }), _jsxs(Text, { style: styles.paragraph, children: ["It will stay valid for the next ", _jsxs("span", { style: { color: colors.white, fontWeight: 600 }, children: [expirationMinutes, " minutes"] }), "."] }), _jsx("div", { style: styles.otpContainer, children: _jsx(Text, { style: styles.otp, children: sanitizedOtp }) })] }), _jsxs(Section, { style: styles.contentSection, children: [_jsx(Text, { style: styles.smallText, children: "If you didn't request this code, you can safely ignore this email. No one else can access your account without it." }), _jsxs(Text, { style: styles.smallText, children: ["Need help?", " ", _jsx(Link, { href: `mailto:${modelfyConfig.supportEmail}`, style: styles.link, children: modelfyConfig.supportEmail })] })] }), _jsxs(Section, { style: styles.downloadSection, children: [_jsx(Text, { style: styles.downloadText, children: "Get the Modelfy app" }), _jsxs("div", { style: styles.badgeContainer, children: [_jsx(Link, { href: modelfyConfig.appStoreUrl, style: styles.badge, children: _jsx(Img, { src: modelfyConfig.appStoreBadgeUrl, width: "120", height: "40", alt: "Download on the App Store" }) }), _jsx(Link, { href: modelfyConfig.playStoreUrl, style: styles.badge, children: _jsx(Img, { src: modelfyConfig.playStoreBadgeUrl, width: "135", height: "40", alt: "Get it on Google Play" }) })] })] }), _jsxs(Section, { style: styles.footer, children: [_jsx(Img, { src: modelfyConfig.logoUrl, width: "80", height: "auto", alt: "Modelfy", style: styles.footerLogo }), _jsxs(Text, { style: styles.footerText, children: ["\u00A9 ", new Date().getFullYear(), " ", modelfyConfig.companyName, ". All rights reserved."] }), _jsx(Text, { style: styles.footerText, children: "You received this email because someone attempted to sign in to Modelfy with this address." }), _jsx(Text, { style: styles.footerText, children: _jsx(Link, { href: `${modelfyConfig.appUrl}/privacy`, style: styles.footerLink, children: "Privacy Policy" }) })] })] }) })] }));
|
|
65
143
|
}
|
|
66
144
|
export default OtpEmail;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PromoSubscriptionEmail.d.ts","sourceRoot":"","sources":["../../../src/modelfy/templates/PromoSubscriptionEmail.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"PromoSubscriptionEmail.d.ts","sourceRoot":"","sources":["../../../src/modelfy/templates/PromoSubscriptionEmail.tsx"],"names":[],"mappings":"AAeA,MAAM,WAAW,2BAA2B;IAC1C,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAgKD,wBAAgB,sBAAsB,CAAC,EACrC,KAA0B,EAC1B,QAAgB,EAChB,YAAiB,EACjB,OAAa,EACb,SAA8B,EAC9B,KAAK,GACN,EAAE,2BAA2B,2CAwJ7B;AAED,eAAe,sBAAsB,CAAC"}
|