brookmind-emails 0.1.11 → 0.1.12

package/dist/foodstudio/templates/PromoSubscriptionEmail.js

@@ -0,0 +1,170 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Html, Head, Body, Container, Section, Text, Link, Preview, Font, Img, Button as ReactEmailButton, } from "@react-email/components";
+import { foodstudioConfig } from "../config.js";
+// Design System Colors - Matching FoodStudio Landing
+const colors = {
+    background: "#0d0d0d",
+    cardBg: "#121212",
+    primary: "#ea580c",
+    accent: "#ea580c",
+    white: "#f2f2f2",
+    textSecondary: "rgba(242, 242, 242, 0.7)",
+    textMuted: "#8c8c8c",
+    border: "#262626",
+};
+const styles = {
+    body: {
+        margin: 0,
+        padding: 0,
+        backgroundColor: colors.background,
+        fontFamily: "'Inter', 'Segoe UI', Arial, sans-serif",
+    },
+    container: {
+        maxWidth: "600px",
+        margin: "0 auto",
+        backgroundColor: colors.background,
+    },
+    header: {
+        backgroundColor: colors.background,
+        padding: "40px 32px 24px",
+        textAlign: "center",
+    },
+    logo: {
+        display: "block",
+        margin: "0 auto",
+    },
+    heroSection: {
+        padding: "24px 32px 40px",
+        textAlign: "center",
+    },
+    heroTagline: {
+        margin: "0 0 12px",
+        fontSize: "13px",
+        fontWeight: 600,
+        color: colors.accent,
+        letterSpacing: "2px",
+        textTransform: "uppercase",
+    },
+    heroHeading: {
+        margin: "0 0 16px",
+        fontSize: "28px",
+        fontWeight: 700,
+        color: colors.white,
+        lineHeight: "1.3",
+    },
+    paragraph: {
+        margin: "0 0 28px",
+        fontSize: "16px",
+        lineHeight: "1.6",
+        color: colors.textSecondary,
+        textAlign: "center",
+    },
+    highlightBox: {
+        backgroundColor: "rgba(234, 88, 12, 0.15)",
+        border: `1px solid rgba(234, 88, 12, 0.3)`,
+        borderRadius: "12px",
+        padding: "24px",
+        marginBottom: "28px",
+    },
+    highlightLabel: {
+        fontSize: "13px",
+        color: colors.textMuted,
+        margin: "0 0 4px",
+    },
+    highlightValue: {
+        fontSize: "16px",
+        fontWeight: 600,
+        color: colors.white,
+        margin: 0,
+    },
+    buttonContainer: {
+        textAlign: "center",
+        marginBottom: "28px",
+    },
+    ctaButton: {
+        display: "inline-block",
+        padding: "14px 36px",
+        fontSize: "15px",
+        fontWeight: 600,
+        textDecoration: "none",
+        borderRadius: "10px",
+        backgroundColor: colors.primary,
+        color: "#ffffff",
+        textAlign: "center",
+    },
+    contentSection: {
+        backgroundColor: colors.cardBg,
+        padding: "32px",
+        borderTop: `1px solid ${colors.border}`,
+    },
+    smallText: {
+        margin: "0 0 12px",
+        fontSize: "14px",
+        lineHeight: "1.6",
+        color: colors.textMuted,
+        textAlign: "center",
+    },
+    notesText: {
+        margin: "0 0 24px",
+        fontSize: "15px",
+        lineHeight: "1.6",
+        color: colors.textSecondary,
+        textAlign: "center",
+        fontStyle: "italic",
+    },
+    link: {
+        color: colors.primary,
+        textDecoration: "none",
+        fontWeight: 600,
+    },
+    footer: {
+        backgroundColor: colors.cardBg,
+        padding: "24px 32px",
+        textAlign: "center",
+        borderTop: `1px solid ${colors.border}`,
+    },
+    footerLogo: {
+        display: "block",
+        margin: "0 auto 12px",
+        opacity: 0.6,
+    },
+    footerText: {
+        margin: "0 0 4px",
+        fontSize: "11px",
+        color: colors.textMuted,
+        lineHeight: "1.6",
+    },
+    footerLink: {
+        color: colors.textMuted,
+        textDecoration: "underline",
+    },
+    downloadSection: {
+        backgroundColor: colors.cardBg,
+        padding: "24px 32px",
+        textAlign: "center",
+        borderTop: `1px solid ${colors.border}`,
+    },
+    downloadText: {
+        margin: "0 0 16px",
+        fontSize: "14px",
+        color: colors.white,
+    },
+    badgeContainer: {
+        textAlign: "center",
+    },
+    badge: {
+        display: "inline-block",
+        margin: "0 8px",
+    },
+};
+export function PromoSubscriptionEmail({ email = "user@example.com", planName = "Pro", durationDays = 30, credits = 500, expiresAt = "January 31, 2025", notes, }) {
+    const safeCredits = Number.isFinite(credits) ? Number(credits) : 0;
+    return (_jsxs(Html, { lang: "en", children: [_jsxs(Head, { children: [_jsx(Font, { fontFamily: "Inter", fallbackFontFamily: "Arial", webFont: {
+                            url: "https://fonts.gstatic.com/s/inter/v13/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuLyfAZ9hjp-Ek-_0.woff2",
+                            format: "woff2",
+                        }, fontWeight: 400, fontStyle: "normal" }), _jsx(Font, { fontFamily: "Inter", fallbackFontFamily: "Arial", webFont: {
+                            url: "https://fonts.gstatic.com/s/inter/v13/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuFuYAZ9hjp-Ek-_0.woff2",
+                            format: "woff2",
+                        }, fontWeight: 700, fontStyle: "normal" })] }), _jsx(Preview, { children: `You've received a ${durationDays}-day ${planName} subscription!` }), _jsx(Body, { style: styles.body, children: _jsxs(Container, { style: styles.container, children: [_jsx(Section, { style: styles.header, children: _jsx(Img, { src: foodstudioConfig.logoUrl, width: "130", height: "auto", alt: "FoodStudio", style: styles.logo }) }), _jsxs(Section, { style: styles.heroSection, children: [_jsx(Text, { style: styles.heroTagline, children: "Gift for You" }), _jsx(Text, { style: styles.heroHeading, children: "You've Got a Gift!" }), _jsxs(Text, { style: { ...styles.paragraph, margin: "0 0 4px" }, children: ["Hi ", _jsx("span", { style: { color: colors.white, fontWeight: 600 }, children: email }), ", great news!"] }), _jsxs(Text, { style: styles.paragraph, children: ["You've been granted a promotional", " ", _jsx("span", { style: { color: colors.accent, fontWeight: 600 }, children: planName }), " subscription."] }), _jsx("div", { style: styles.highlightBox, children: _jsx("table", { width: "100%", cellPadding: 0, cellSpacing: 0, children: _jsxs("tbody", { children: [_jsxs("tr", { children: [_jsxs("td", { style: { paddingBottom: "16px" }, children: [_jsx(Text, { style: styles.highlightLabel, children: "Plan" }), _jsx(Text, { style: styles.highlightValue, children: planName })] }), _jsxs("td", { style: { paddingBottom: "16px", textAlign: "right" }, children: [_jsx(Text, { style: styles.highlightLabel, children: "Duration" }), _jsxs(Text, { style: styles.highlightValue, children: [durationDays, " days"] })] })] }), _jsxs("tr", { children: [_jsxs("td", { children: [_jsx(Text, { style: styles.highlightLabel, children: "Credits Included" }), _jsx(Text, { style: styles.highlightValue, children: safeCredits.toLocaleString() })] }), _jsxs("td", { style: { textAlign: "right" }, children: [_jsx(Text, { style: styles.highlightLabel, children: "Expires" }), _jsx(Text, { style: styles.highlightValue, children: expiresAt })] })] })] }) }) }), notes && _jsxs(Text, { style: styles.notesText, children: ["\"", notes, "\""] }), _jsx("div", { style: styles.buttonContainer, children: _jsx(ReactEmailButton, { href: foodstudioConfig.appUrl, style: styles.ctaButton, children: "Open FoodStudio" }) })] }), _jsxs(Section, { style: styles.contentSection, children: [_jsx(Text, { style: styles.smallText, children: "This promotional subscription will not auto-renew. Enjoy your free access!" }), _jsxs(Text, { style: styles.smallText, children: ["Questions?", " ", _jsx(Link, { href: `mailto:${foodstudioConfig.supportEmail}`, style: styles.link, children: foodstudioConfig.supportEmail })] })] }), _jsxs(Section, { style: styles.downloadSection, children: [_jsx(Text, { style: styles.downloadText, children: "Get the FoodStudio app" }), _jsxs("div", { style: styles.badgeContainer, children: [_jsx(Link, { href: foodstudioConfig.appStoreUrl, style: styles.badge, children: _jsx(Img, { src: foodstudioConfig.appStoreBadgeUrl, width: "120", height: "40", alt: "Download on the App Store" }) }), _jsx(Link, { href: foodstudioConfig.playStoreUrl, style: styles.badge, children: _jsx(Img, { src: foodstudioConfig.playStoreBadgeUrl, width: "135", height: "40", alt: "Get it on Google Play" }) })] })] }), _jsxs(Section, { style: styles.footer, children: [_jsx(Img, { src: foodstudioConfig.logoUrl, width: "80", height: "auto", alt: "FoodStudio", style: styles.footerLogo }), _jsxs(Text, { style: styles.footerText, children: ["\u00A9 ", new Date().getFullYear(), " ", foodstudioConfig.companyName, ". All rights reserved."] }), _jsx(Text, { style: styles.footerText, children: "You received this email because you were granted a promotional subscription." }), _jsx(Text, { style: styles.footerText, children: _jsx(Link, { href: `${foodstudioConfig.appUrl}/privacy`, style: styles.footerLink, children: "Privacy Policy" }) })] })] }) })] }));
+}
+export default PromoSubscriptionEmail;

package/dist/foodstudio/templates/WelcomeEmail.d.ts

@@ -0,0 +1,6 @@
+export interface WelcomeEmailProps {
+    email: string;
+}
+export declare function WelcomeEmail({ email }: WelcomeEmailProps): React.ReactElement;
+export default WelcomeEmail;
+//# sourceMappingURL=WelcomeEmail.d.ts.map

package/dist/foodstudio/templates/WelcomeEmail.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"WelcomeEmail.d.ts","sourceRoot":"","sources":["../../../src/foodstudio/templates/WelcomeEmail.tsx"],"names":[],"mappings":"AAeA,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,MAAM,CAAC;CACf;AA+ID,wBAAgB,YAAY,CAAC,EAAE,KAA0B,EAAE,EAAE,iBAAiB,GAAG,KAAK,CAAC,YAAY,CAkIlG;AAED,eAAe,YAAY,CAAC"}

package/dist/foodstudio/templates/WelcomeEmail.js

@@ -0,0 +1,155 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Html, Head, Body, Container, Section, Text, Link, Preview, Font, Img, Button as ReactEmailButton, } from "@react-email/components";
+import { foodstudioConfig } from "../config.js";
+// Design System Colors - Matching FoodStudio Landing
+const colors = {
+    background: "#0d0d0d",
+    cardBg: "#121212",
+    primary: "#ea580c",
+    white: "#f2f2f2",
+    textSecondary: "rgba(242, 242, 242, 0.7)",
+    textMuted: "#8c8c8c",
+    border: "#262626",
+};
+const styles = {
+    body: {
+        margin: 0,
+        padding: 0,
+        backgroundColor: colors.background,
+        fontFamily: "'Inter', 'Segoe UI', Arial, sans-serif",
+    },
+    container: {
+        maxWidth: "600px",
+        margin: "0 auto",
+        backgroundColor: colors.background,
+    },
+    header: {
+        backgroundColor: colors.background,
+        padding: "40px 32px 24px",
+        textAlign: "center",
+    },
+    logo: {
+        display: "block",
+        margin: "0 auto",
+    },
+    heroSection: {
+        padding: "24px 32px 40px",
+        textAlign: "center",
+    },
+    heroTagline: {
+        margin: "0 0 12px",
+        fontSize: "13px",
+        fontWeight: 600,
+        color: colors.primary,
+        letterSpacing: "2px",
+        textTransform: "uppercase",
+    },
+    heroHeading: {
+        margin: "0 0 16px",
+        fontSize: "28px",
+        fontWeight: 700,
+        color: colors.white,
+        lineHeight: "1.3",
+    },
+    heroSubheading: {
+        margin: "0 0 28px",
+        fontSize: "16px",
+        lineHeight: "1.6",
+        color: colors.textSecondary,
+    },
+    heroCta: {
+        display: "inline-block",
+        padding: "14px 36px",
+        fontSize: "15px",
+        fontWeight: 600,
+        textDecoration: "none",
+        borderRadius: "10px",
+        backgroundColor: colors.primary,
+        color: "#ffffff",
+        textAlign: "center",
+    },
+    welcomeSection: {
+        backgroundColor: colors.cardBg,
+        padding: "32px",
+        textAlign: "center",
+        borderTop: `1px solid ${colors.border}`,
+        borderBottom: `1px solid ${colors.border}`,
+    },
+    welcomeText: {
+        margin: "0 0 16px",
+        fontSize: "16px",
+        lineHeight: "1.6",
+        color: colors.textSecondary,
+    },
+    welcomeEmail: {
+        color: colors.white,
+        fontWeight: 600,
+    },
+    supportSection: {
+        backgroundColor: colors.background,
+        padding: "32px",
+        textAlign: "center",
+    },
+    supportText: {
+        margin: "0 0 4px",
+        fontSize: "13px",
+        color: colors.textMuted,
+    },
+    supportLink: {
+        color: colors.primary,
+        textDecoration: "none",
+        fontWeight: 600,
+    },
+    footer: {
+        backgroundColor: colors.cardBg,
+        padding: "24px 32px",
+        textAlign: "center",
+        borderTop: `1px solid ${colors.border}`,
+    },
+    footerLogo: {
+        display: "block",
+        margin: "0 auto 12px",
+        opacity: 0.6,
+    },
+    footerText: {
+        margin: "0 0 4px",
+        fontSize: "11px",
+        color: colors.textMuted,
+        lineHeight: "1.6",
+    },
+    footerLink: {
+        color: colors.textMuted,
+        textDecoration: "underline",
+    },
+    downloadSection: {
+        backgroundColor: colors.cardBg,
+        padding: "24px 32px",
+        textAlign: "center",
+        borderTop: `1px solid ${colors.border}`,
+    },
+    downloadText: {
+        margin: "0 0 16px",
+        fontSize: "14px",
+        color: colors.white,
+    },
+    badgeContainer: {
+        textAlign: "center",
+    },
+    badge: {
+        display: "inline-block",
+        margin: "0 8px",
+    },
+};
+export function WelcomeEmail({ email = "user@example.com" }) {
+    return (_jsxs(Html, { lang: "en", children: [_jsxs(Head, { children: [_jsx(Font, { fontFamily: "Inter", fallbackFontFamily: "Arial", webFont: {
+                            url: "https://fonts.gstatic.com/s/inter/v13/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuLyfAZ9hjp-Ek-_0.woff2",
+                            format: "woff2",
+                        }, fontWeight: 400, fontStyle: "normal" }), _jsx(Font, { fontFamily: "Inter", fallbackFontFamily: "Arial", webFont: {
+                            url: "https://fonts.gstatic.com/s/inter/v13/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuI6fAZ9hjp-Ek-_0.woff2",
+                            format: "woff2",
+                        }, fontWeight: 600, fontStyle: "normal" }), _jsx(Font, { fontFamily: "Inter", fallbackFontFamily: "Arial", webFont: {
+                            url: "https://fonts.gstatic.com/s/inter/v13/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuFuYAZ9hjp-Ek-_0.woff2",
+                            format: "woff2",
+                        }, fontWeight: 700, fontStyle: "normal" })] }), _jsx(Preview, { children: "Welcome to FoodStudio" }), _jsx(Body, { style: styles.body, children: _jsxs(Container, { style: styles.container, children: [_jsx(Section, { style: styles.header, children: _jsx(Img, { src: foodstudioConfig.logoUrl, width: "130", height: "auto", alt: "FoodStudio", style: styles.logo }) }), _jsxs(Section, { style: styles.heroSection, children: [_jsx(Text, { style: styles.heroTagline, children: "Welcome to FoodStudio" }), _jsx(Text, { style: styles.heroHeading, children: "Your Account is Ready!" }), _jsx(Text, { style: styles.heroSubheading, children: "We're excited to have you on board. Start exploring FoodStudio and discover all the amazing features waiting for you." }), _jsx(ReactEmailButton, { href: foodstudioConfig.appUrl, style: styles.heroCta, children: "Get Started" })] }), _jsx(Section, { style: styles.welcomeSection, children: _jsxs(Text, { style: styles.welcomeText, children: ["Hi ", _jsx("span", { style: styles.welcomeEmail, children: email }), ", your account is ready.", _jsx("br", {}), "You now have access to the complete FoodStudio platform."] }) }), _jsxs(Section, { style: styles.supportSection, children: [_jsx(Text, { style: styles.supportText, children: "Need help getting started?" }), _jsx(Text, { style: styles.supportText, children: _jsx(Link, { href: `mailto:${foodstudioConfig.supportEmail}`, style: styles.supportLink, children: foodstudioConfig.supportEmail }) })] }), _jsxs(Section, { style: styles.downloadSection, children: [_jsx(Text, { style: styles.downloadText, children: "Get the FoodStudio app" }), _jsxs("div", { style: styles.badgeContainer, children: [_jsx(Link, { href: foodstudioConfig.appStoreUrl, style: styles.badge, children: _jsx(Img, { src: foodstudioConfig.appStoreBadgeUrl, width: "120", height: "40", alt: "Download on the App Store" }) }), _jsx(Link, { href: foodstudioConfig.playStoreUrl, style: styles.badge, children: _jsx(Img, { src: foodstudioConfig.playStoreBadgeUrl, width: "135", height: "40", alt: "Get it on Google Play" }) })] })] }), _jsxs(Section, { style: styles.footer, children: [_jsx(Img, { src: foodstudioConfig.logoUrl, width: "80", height: "auto", alt: "FoodStudio", style: styles.footerLogo }), _jsxs(Text, { style: styles.footerText, children: ["\u00A9 ", new Date().getFullYear(), " ", foodstudioConfig.companyName, ". All rights reserved."] }), _jsx(Text, { style: styles.footerText, children: "You received this email because you signed up for FoodStudio." }), _jsx(Text, { style: styles.footerText, children: _jsx(Link, { href: `${foodstudioConfig.appUrl}/privacy`, style: styles.footerLink, children: "Privacy Policy" }) })] })] }) })] }));
+}
+export default WelcomeEmail;

package/dist/index.d.ts

@@ -1,3 +1,4 @@
 export * from "./shared/index.js";
 export * as modelfy from "./modelfy/index.js";
+export * as foodstudio from "./foodstudio/index.js";
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,cAAc,mBAAmB,CAAC;AAGlC,OAAO,KAAK,OAAO,MAAM,oBAAoB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,cAAc,mBAAmB,CAAC;AAGlC,OAAO,KAAK,OAAO,MAAM,oBAAoB,CAAC;AAG9C,OAAO,KAAK,UAAU,MAAM,uBAAuB,CAAC"}

package/dist/index.js

@@ -2,3 +2,5 @@
 export * from "./shared/index.js";
 // Modelfy emails
 export * as modelfy from "./modelfy/index.js";
+// FoodStudio emails
+export * as foodstudio from "./foodstudio/index.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "brookmind-emails",
-  "version": "0.1.11",
+  "version": "0.1.12",
   "description": "Email templates for Brookmind projects",
   "type": "module",
   "main": "./dist/index.js",
@@ -15,6 +15,11 @@
       "require": "./dist/modelfy/index.js",
       "import": "./dist/modelfy/index.js",
       "types": "./dist/modelfy/index.d.ts"
+    },
+    "./foodstudio": {
+      "require": "./dist/foodstudio/index.js",
+      "import": "./dist/foodstudio/index.js",
+      "types": "./dist/foodstudio/index.d.ts"
     }
   },
   "scripts": {

package/src/foodstudio/config.ts

@@ -0,0 +1,12 @@
+export const foodstudioConfig = {
+  logoUrl: "https://foodstudio.ai/FoodStudioLogo.png",
+  companyName: "FoodStudio",
+  supportEmail: "support@foodstudio.ai",
+  appUrl: "https://foodstudio.ai",
+  // App Store links
+  appStoreUrl: "https://apps.apple.com/app/id6757201826",
+  playStoreUrl: "https://play.google.com/store/apps/details?id=com.brookmind.foodstudio",
+  // Badge images
+  appStoreBadgeUrl: "https://foodstudio.ai/images/appstore.svg",
+  playStoreBadgeUrl: "https://foodstudio.ai/images/googleplay.svg",
+};

package/src/foodstudio/index.ts

@@ -0,0 +1,71 @@
+import { render } from "@react-email/render";
+import { OtpEmail, type OtpEmailProps } from "./templates/OtpEmail.js";
+import {
+  PromoSubscriptionEmail,
+  type PromoSubscriptionEmailProps,
+} from "./templates/PromoSubscriptionEmail.js";
+import { GrantCreditsEmail, type GrantCreditsEmailProps } from "./templates/GrantCreditsEmail.js";
+import { WelcomeEmail, type WelcomeEmailProps } from "./templates/WelcomeEmail.js";
+
+// Re-export types
+export type { OtpEmailProps, PromoSubscriptionEmailProps, GrantCreditsEmailProps, WelcomeEmailProps };
+
+// Re-export components for preview
+export { OtpEmail, PromoSubscriptionEmail, GrantCreditsEmail, WelcomeEmail };
+
+// Render functions
+export interface RenderResult {
+  subject: string;
+  html: string;
+  text: string;
+}
+
+export async function renderOtpEmail(props: OtpEmailProps): Promise<RenderResult> {
+  const html = await render(OtpEmail(props));
+  const text = await render(OtpEmail(props), { plainText: true });
+
+  return {
+    subject: "Your FoodStudio access code",
+    html,
+    text,
+  };
+}
+
+export async function renderPromoSubscriptionEmail(
+  props: PromoSubscriptionEmailProps
+): Promise<RenderResult> {
+  const html = await render(PromoSubscriptionEmail(props));
+  const text = await render(PromoSubscriptionEmail(props), { plainText: true });
+
+  return {
+    subject: `You've received a ${props.durationDays}-day ${props.planName} subscription!`,
+    html,
+    text,
+  };
+}
+
+export async function renderGrantCreditsEmail(
+  props: GrantCreditsEmailProps
+): Promise<RenderResult> {
+  const html = await render(GrantCreditsEmail(props));
+  const text = await render(GrantCreditsEmail(props), { plainText: true });
+
+  return {
+    subject: `You've received ${(props.credits ?? 0).toLocaleString()} credits on FoodStudio!`,
+    html,
+    text,
+  };
+}
+
+export async function renderWelcomeEmail(
+  props: WelcomeEmailProps
+): Promise<RenderResult> {
+  const html = await render(WelcomeEmail(props));
+  const text = await render(WelcomeEmail(props), { plainText: true });
+
+  return {
+    subject: "Welcome to FoodStudio!",
+    html,
+    text,
+  };
+}