@beyondcorp/beyond-ui 1.4.4 → 1.4.8
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/components/Auth/ForgotPasswordForm.js +1 -1
- package/dist/components/Auth/ForgotPasswordForm.js.map +1 -1
- package/dist/components/Auth/LoginForm.js +1 -1
- package/dist/components/Auth/LoginForm.js.map +1 -1
- package/dist/components/Auth/ResetPasswordForm.js +1 -1
- package/dist/components/Auth/ResetPasswordForm.js.map +1 -1
- package/dist/components/Auth/SignupForm.js +2 -2
- package/dist/components/Auth/SignupForm.js.map +1 -1
- package/dist/components/Email/EmailShowcase.js +1 -0
- package/dist/components/Email/EmailShowcase.js.map +1 -1
- package/dist/components/Email/components/EmailButton.js +1 -1
- package/dist/components/Email/components/EmailDivider.js +1 -1
- package/dist/components/Email/components/EmailFooter.js +1 -3
- package/dist/components/Email/components/EmailFooter.js.map +1 -1
- package/dist/components/Email/components/EmailHeader.js +1 -2
- package/dist/components/Email/components/EmailHeader.js.map +1 -1
- package/dist/components/Email/components/EmailLayout.js +1 -6
- package/dist/components/Email/components/EmailLayout.js.map +1 -1
- package/dist/components/Email/components/EmailPreviewer.js +1 -1
- package/dist/components/Email/templates/auth/ConfirmEmail.js +2 -2
- package/dist/components/Email/templates/auth/EmailChangeVerification.js +2 -2
- package/dist/components/Email/templates/auth/MagicLinkEmail.js +2 -2
- package/dist/components/Email/templates/auth/ResetPasswordEmail.js +2 -2
- package/dist/components/Email/templates/auth/WelcomeEmail.js +2 -2
- package/dist/components/Email/templates/billing/CreditCardExpiring.js +2 -2
- package/dist/components/Email/templates/billing/InvoiceEmail.js +2 -4
- package/dist/components/Email/templates/billing/InvoiceEmail.js.map +1 -1
- package/dist/components/Email/templates/billing/OverduePaymentNotice.js +2 -2
- package/dist/components/Email/templates/billing/PaymentFailedEmail.js +2 -2
- package/dist/components/Email/templates/billing/PaymentReceipt.js +2 -4
- package/dist/components/Email/templates/billing/PaymentReceipt.js.map +1 -1
- package/dist/components/Email/templates/billing/SubscriptionCancelled.js +2 -2
- package/dist/components/Email/templates/billing/SubscriptionConfirmation.js +2 -2
- package/dist/components/Email/templates/billing/TrialEndingEmail.js +2 -2
- package/dist/components/Email/templates/engagement/FeatureAnnouncement.js +2 -3
- package/dist/components/Email/templates/engagement/FeatureAnnouncement.js.map +1 -1
- package/dist/components/Email/templates/engagement/FeedbackRequestEmail.js +2 -2
- package/dist/components/Email/templates/engagement/InactivityWarning.js +2 -2
- package/dist/components/Email/templates/engagement/MilestoneEmail.js +2 -2
- package/dist/components/Email/templates/engagement/ProductChangelog.js +2 -2
- package/dist/components/Email/templates/engagement/TeamInviteEmail.js +2 -2
- package/dist/components/Email/templates/engagement/TipOfWeek.js +2 -2
- package/dist/components/Email/templates/engagement/WeeklyDigest.js +2 -4
- package/dist/components/Email/templates/engagement/WeeklyDigest.js.map +1 -1
- package/dist/components/Email/templates/growth/ReferralConverted.js +2 -2
- package/dist/components/Email/templates/growth/ReferralInvite.js +2 -2
- package/dist/components/Email/templates/growth/ReferralReward.js +2 -2
- package/dist/components/Email/templates/growth/SocialSharePrompt.js +2 -4
- package/dist/components/Email/templates/growth/SocialSharePrompt.js.map +1 -1
- package/dist/components/Email/templates/growth/WaitlistWelcome.js +2 -2
- package/dist/components/Email/templates/internal/comms/CompanyEventsCalendar.js +2 -4
- package/dist/components/Email/templates/internal/comms/CompanyEventsCalendar.js.map +1 -1
- package/dist/components/Email/templates/internal/comms/LeadershipUpdate.js +2 -1
- package/dist/components/Email/templates/internal/comms/LeadershipUpdate.js.map +1 -1
- package/dist/components/Email/templates/internal/comms/MeetingRecap.js +2 -4
- package/dist/components/Email/templates/internal/comms/MeetingRecap.js.map +1 -1
- package/dist/components/Email/templates/internal/hr/BirthdayAnniversary.js +2 -1
- package/dist/components/Email/templates/internal/hr/BirthdayAnniversary.js.map +1 -1
- package/dist/components/Email/templates/internal/hr/EmployeeFarewell.js +2 -2
- package/dist/components/Email/templates/internal/hr/ExitInterviewRequest.js +2 -2
- package/dist/components/Email/templates/internal/hr/NewHireAnnouncement.js +2 -2
- package/dist/components/Email/templates/internal/hr/PolicyUpdate.js +2 -2
- package/dist/components/Email/templates/internal/it/AppAccessGranted.js +2 -2
- package/dist/components/Email/templates/internal/it/ITOutageReport.js +2 -2
- package/dist/components/Email/templates/internal/it/PasswordRotationReminder.js +2 -2
- package/dist/components/Email/templates/legal/DMCANotice.js +2 -2
- package/dist/components/Email/templates/legal/DPANotice.js +2 -2
- package/dist/components/Email/templates/legal/GDPRCompliance.js +2 -2
- package/dist/components/Email/templates/legal/PrivacyPolicyUpdate.js +2 -2
- package/dist/components/Email/templates/legal/TermsOfServiceUpdate.js +2 -2
- package/dist/components/Email/templates/marketing/affiliate/AffiliateInvite.js +2 -2
- package/dist/components/Email/templates/marketing/affiliate/AffiliatePayout.js +2 -2
- package/dist/components/Email/templates/marketing/affiliate/AffiliateTopPerformer.js +2 -2
- package/dist/components/Email/templates/marketing/affiliate/AffiliateWelcome.js +2 -2
- package/dist/components/Email/templates/marketing/affiliate/PartnerComarketing.js +2 -2
- package/dist/components/Email/templates/marketing/blog/BestOfRoundup.js +2 -2
- package/dist/components/Email/templates/marketing/blog/BlogSeries.js +2 -2
- package/dist/components/Email/templates/marketing/blog/NewBlogPost.js +2 -2
- package/dist/components/Email/templates/marketing/content/InfographicEmail.js +2 -2
- package/dist/components/Email/templates/marketing/content/NewGuideEbook.js +2 -2
- package/dist/components/Email/templates/marketing/content/PodcastEpisode.js +2 -2
- package/dist/components/Email/templates/marketing/content/ToolTemplateDelivery.js +2 -2
- package/dist/components/Email/templates/marketing/content/YouTubeNotification.js +2 -2
- package/dist/components/Email/templates/marketing/events/ConferenceSeries.js +2 -2
- package/dist/components/Email/templates/marketing/events/EarlyBirdReminder.js +2 -2
- package/dist/components/Email/templates/marketing/events/EventAnnouncement.js +2 -2
- package/dist/components/Email/templates/marketing/events/PostEventThankYou.js +2 -2
- package/dist/components/Email/templates/marketing/events/ScheduleReleased.js +2 -2
- package/dist/components/Email/templates/marketing/events/VIPInvite.js +2 -2
- package/dist/components/Email/templates/marketing/lead-nurturing/CaseStudyDelivery.js +2 -2
- package/dist/components/Email/templates/marketing/lead-nurturing/DripCampaignComplete.js +2 -2
- package/dist/components/Email/templates/marketing/lead-nurturing/DripCampaignDay1.js +2 -2
- package/dist/components/Email/templates/marketing/lead-nurturing/LeadMagnetDelivery.js +2 -2
- package/dist/components/Email/templates/marketing/lead-nurturing/WebinarConfirmation.js +2 -2
- package/dist/components/Email/templates/marketing/lead-nurturing/WebinarFollowup.js +2 -2
- package/dist/components/Email/templates/marketing/lead-nurturing/WebinarReminder.js +2 -2
- package/dist/components/Email/templates/marketing/newsletters/CuratedIndustryNews.js +2 -2
- package/dist/components/Email/templates/marketing/newsletters/MonthlyDigest.js +2 -5
- package/dist/components/Email/templates/marketing/newsletters/MonthlyDigest.js.map +1 -1
- package/dist/components/Email/templates/marketing/newsletters/WeeklyNewsletter.js +2 -4
- package/dist/components/Email/templates/marketing/newsletters/WeeklyNewsletter.js.map +1 -1
- package/dist/components/Email/templates/marketing/promotional/AbandonedCart.js +2 -5
- package/dist/components/Email/templates/marketing/promotional/AbandonedCart.js.map +1 -1
- package/dist/components/Email/templates/marketing/promotional/BackInStock.js +2 -2
- package/dist/components/Email/templates/marketing/promotional/BirthdayOffer.js +2 -2
- package/dist/components/Email/templates/marketing/promotional/BrowseAbandonment.js +2 -2
- package/dist/components/Email/templates/marketing/promotional/FlashSale.js +2 -2
- package/dist/components/Email/templates/marketing/promotional/MilestoneDiscount.js +2 -2
- package/dist/components/Email/templates/marketing/promotional/PriceDropAlert.js +2 -2
- package/dist/components/Email/templates/marketing/promotional/SeasonalCampaign.js +2 -2
- package/dist/components/Email/templates/marketing/reengagement/ComeBack60Day.js +2 -2
- package/dist/components/Email/templates/marketing/reengagement/LastChance90Day.js +2 -2
- package/dist/components/Email/templates/marketing/reengagement/ProductUpdateReengagement.js +2 -2
- package/dist/components/Email/templates/marketing/reengagement/WeMissYou30Day.js +2 -2
- package/dist/components/Email/templates/marketing/social/CommunityMilestone.js +2 -2
- package/dist/components/Email/templates/marketing/social/NewFollowerWelcome.js +2 -2
- package/dist/components/Email/templates/marketing/social/ShareYourStory.js +2 -2
- package/dist/components/Email/templates/marketing/social/SocialProof.js +2 -2
- package/dist/components/Email/templates/marketing/social/UserSpotlight.js +2 -2
- package/dist/components/Email/templates/marketing/surveys/BetaFeedback.js +2 -2
- package/dist/components/Email/templates/marketing/surveys/CSATSurvey.js +2 -2
- package/dist/components/Email/templates/marketing/surveys/ExitSurvey.js +2 -3
- package/dist/components/Email/templates/marketing/surveys/ExitSurvey.js.map +1 -1
- package/dist/components/Email/templates/marketing/surveys/NPSSurvey.js +2 -5
- package/dist/components/Email/templates/marketing/surveys/NPSSurvey.js.map +1 -1
- package/dist/components/Email/templates/marketing/surveys/ProductFeedback.js +2 -2
- package/dist/components/Email/templates/sales/ClientReferenceRequest.js +2 -2
- package/dist/components/Email/templates/sales/ClientWinBack.js +2 -2
- package/dist/components/Email/templates/sales/ColdOutreach.js +2 -2
- package/dist/components/Email/templates/sales/FollowUpEmail.js +2 -2
- package/dist/components/Email/templates/sales/ProjectTermination.js +2 -2
- package/dist/components/Email/templates/sales/ProposalAccepted.js +2 -2
- package/dist/components/Email/templates/sales/ScheduleDemo.js +2 -2
- package/dist/components/Email/templates/sales/SendProposal.js +2 -2
- package/dist/components/Email/templates/security/AccountDeletedConfirmation.js +2 -2
- package/dist/components/Email/templates/security/ApiKeyCreated.js +2 -2
- package/dist/components/Email/templates/security/DataExportReady.js +2 -2
- package/dist/components/Email/templates/security/NewLoginAlert.js +2 -2
- package/dist/components/Email/templates/security/PolicyUpdateEmail.js +2 -2
- package/dist/components/Email/templates/security/TwoFactorCode.js +2 -2
- package/dist/components/Email/templates/support/SupportFeedbackRequest.js +2 -4
- package/dist/components/Email/templates/support/SupportFeedbackRequest.js.map +1 -1
- package/dist/components/Email/templates/support/TicketCreatedEmail.js +2 -2
- package/dist/components/Email/templates/support/TicketReplyEmail.js +2 -2
- package/dist/components/Email/templates/support/TicketResolvedEmail.js +2 -2
- package/dist/components/Email/templates/system/IncidentReport.js +2 -2
- package/dist/components/Email/templates/system/MaintenanceNotice.js +2 -2
- package/dist/components/Email/templates/system/NotificationEmail.js +2 -2
- package/dist/components/Email/templates/system/StatusPageUpdate.js +2 -2
- package/dist/styles.css +1 -1
- package/package.json +1 -1
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailDivider } from '../../../components/EmailDivider.js';
|
|
4
5
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
5
6
|
import 'react';
|
|
6
|
-
import
|
|
7
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
7
|
+
import '@react-email/render';
|
|
8
8
|
|
|
9
9
|
const LeadMagnetDelivery = ({ userName = 'Alex', resourceName = 'The Ultimate Guide to React Email', downloadLink = 'https://example.com/download/guide.pdf', exploreMoreLink = 'https://example.com/blog' }) => {
|
|
10
10
|
return (jsxs(EmailLayout, { previewText: `Your download: ${resourceName}`, title: "Your Requested Resource", children: [jsx(Text, { className: "text-2xl font-bold text-gray-900 dark:text-white mb-4", children: "Here is your requested guide!" }), jsxs(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: ["Hi ", userName, ", thanks for your interest in ", jsx("strong", { children: resourceName }), ". We've packed this resource with actionable insights that you can start using today."] }), jsx(Section, { className: "text-center mb-6", children: jsx(EmailButton, { href: downloadLink, children: "Download Your Copy" }) }), jsx(EmailDivider, {}), jsx(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-4", children: "Looking for more resources? Check out our blog for weekly tips, tutorials, and case studies." })] }));
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailDivider } from '../../../components/EmailDivider.js';
|
|
4
5
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
5
6
|
import 'react';
|
|
6
|
-
import
|
|
7
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
7
|
+
import '@react-email/render';
|
|
8
8
|
|
|
9
9
|
const WebinarConfirmation = ({ userName = 'Alex', webinarTitle = 'Mastering React Email Components', dateTime = 'Thursday, Nov 12th @ 1:00 PM EST', joinLink = 'https://zoom.us/j/123456789' }) => {
|
|
10
10
|
return (jsxs(EmailLayout, { previewText: `Registration Confirmed: ${webinarTitle}`, title: "Webinar Confirmation", children: [jsx(Text, { className: "text-2xl font-bold text-gray-900 dark:text-white mb-4", children: "You're Registered!" }), jsxs(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: ["Hi ", userName, ", your spot for ", jsx("strong", { children: webinarTitle }), " has been confirmed. We can't wait to see you there!"] }), jsxs(Section, { className: "bg-gray-50 dark:bg-gray-700 p-4 rounded-lg mb-6 border border-gray-100 dark:border-gray-600 text-center", children: [jsx(Text, { className: "text-gray-500 dark:text-gray-400 text-sm font-semibold uppercase tracking-wider mb-2 m-0", children: "When" }), jsx(Text, { className: "text-lg font-bold text-gray-900 dark:text-white m-0", children: dateTime })] }), jsx(Section, { className: "text-center mb-6", children: jsx(EmailButton, { href: joinLink, children: "Join Webinar" }) }), jsx(EmailDivider, {}), jsx(Text, { className: "text-gray-500 dark:text-gray-400 text-sm text-center", children: "Pro tip: Add this to your calendar so you don't miss it!" })] }));
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
7
7
|
|
|
8
8
|
const WebinarFollowup = ({ link = '#' }) => (jsxs(EmailLayout, { previewText: "Thanks for attending! Here's the recording.", title: "Webinar Followup", children: [jsx(Text, { className: "text-2xl font-bold text-gray-900 dark:text-white mb-4", children: "Thanks for joining us!" }), jsx(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: "It was great having you at our latest live session. In case you missed anything, or if you want to review the slides, we've uploaded the full replay." }), jsx(Section, { className: "text-center mb-6", children: jsx(EmailButton, { href: link, children: "Watch the Replay" }) })] }));
|
|
9
9
|
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
7
7
|
|
|
8
8
|
const WebinarReminder = ({ link = '#' }) => (jsxs(EmailLayout, { previewText: "Starting in 1 hour!", title: "Webinar Reminder", children: [jsx(Text, { className: "text-2xl font-bold text-gray-900 dark:text-white mb-4", children: "Starting Soon!" }), jsx(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: "This is a quick reminder that our upcoming webinar is starting in exactly one hour. Grab a coffee, test your connection, and we'll see you inside!" }), jsx(Section, { className: "text-center mb-6", children: jsx(EmailButton, { href: link, children: "Join the Room" }) })] }));
|
|
9
9
|
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
7
7
|
|
|
8
8
|
const CuratedIndustryNews = ({ link = '#' }) => (jsxs(EmailLayout, { previewText: "The latest news and trends", title: "Industry Roundup", children: [jsx(Text, { className: "text-2xl font-bold text-gray-900 dark:text-white mb-4", children: "Weekly Industry News" }), jsx(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: "We scoured the web to find the most important news, updates, and trends in the industry so you don't have to. Here's what you need to know this week." }), jsx(Section, { className: "text-center mb-6", children: jsx(EmailButton, { href: link, children: "Read the Roundup" }) })] }));
|
|
9
9
|
|
|
@@ -1,12 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section, Row, Column, Link } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
7
|
-
import { Row } from '../../../../../node_modules/@react-email/row/dist/index.js';
|
|
8
|
-
import { Column } from '../../../../../node_modules/@react-email/column/dist/index.js';
|
|
9
|
-
import { Link } from '../../../../../node_modules/@react-email/link/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
10
7
|
|
|
11
8
|
const MonthlyDigest = ({ userName = 'Alex', monthName = 'October', topStories = [
|
|
12
9
|
{ title: 'The Future of AI in SaaS', link: 'https://example.com/blog/ai' },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MonthlyDigest.js","sources":["../../../../../../src/components/Email/templates/marketing/newsletters/MonthlyDigest.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, Section, Link, Row, Column } from '@react-email/components';\nimport { EmailLayout, EmailButton } from '../../../components';\n\nexport interface MonthlyDigestProps {\n userName?: string;\n monthName?: string;\n topStories?: { title: string; link: string }[];\n stats?: { label: string; value: string | number }[];\n dashboardLink?: string;\n}\n\nexport const MonthlyDigest: React.FC<MonthlyDigestProps> = ({\n userName = 'Alex',\n monthName = 'October',\n topStories = [\n { title: 'The Future of AI in SaaS', link: 'https://example.com/blog/ai' },\n { title: '10 Tips to Boost Productivity', link: 'https://example.com/blog/productivity' }\n ],\n stats = [\n { label: 'Hours Saved', value: 12 },\n { label: 'Tasks Completed', value: 45 }\n ],\n dashboardLink = 'https://example.com/dashboard'\n}) => {\n return (\n <EmailLayout previewText={`Your ${monthName} recap is here!`} title={`${monthName} Digest`}>\n <Text className=\"text-2xl font-bold text-gray-900 dark:text-white mb-4\">Your {monthName} Recap</Text>\n <Text className=\"text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6\">\n Hi {userName}, {monthName} was a busy month! Here is a quick look at what you accomplished and what you might have missed.\n </Text>\n\n <Section className=\"bg-gray-50 dark:bg-gray-700 p-6 rounded-lg mb-6 border border-gray-100 dark:border-gray-600\">\n <Text className=\"text-gray-900 dark:text-white font-bold mb-4 m-0\">Your Impact</Text>\n {stats.map((stat, index) => (\n <Row key={index} className=\"mb-2\">\n <Column><Text className=\"text-gray-600 dark:text-gray-300 m-0\">{stat.label}</Text></Column>\n <Column className=\"text-right\"><Text className=\"text-blue-600 dark:text-blue-400 font-bold m-0\">{stat.value}</Text></Column>\n </Row>\n ))}\n </Section>\n\n <Section className=\"mb-6\">\n <Text className=\"text-gray-900 dark:text-white font-bold mb-4 m-0\">Top Stories</Text>\n {topStories.map((story, index) => (\n <Text key={index} className=\"m-0 mb-2\">\n <Link href={story.link} className=\"text-blue-600 dark:text-blue-400 font-semibold hover:underline\">\n {story.title}\n </Link>\n </Text>\n ))}\n </Section>\n\n <Section className=\"text-center mb-6\">\n <EmailButton href={dashboardLink}>View Your Dashboard</EmailButton>\n </Section>\n </EmailLayout>\n );\n};\n\nexport default MonthlyDigest;\n"],"names":["_jsxs","_jsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"MonthlyDigest.js","sources":["../../../../../../src/components/Email/templates/marketing/newsletters/MonthlyDigest.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, Section, Link, Row, Column } from '@react-email/components';\nimport { EmailLayout, EmailButton } from '../../../components';\n\nexport interface MonthlyDigestProps {\n userName?: string;\n monthName?: string;\n topStories?: { title: string; link: string }[];\n stats?: { label: string; value: string | number }[];\n dashboardLink?: string;\n}\n\nexport const MonthlyDigest: React.FC<MonthlyDigestProps> = ({\n userName = 'Alex',\n monthName = 'October',\n topStories = [\n { title: 'The Future of AI in SaaS', link: 'https://example.com/blog/ai' },\n { title: '10 Tips to Boost Productivity', link: 'https://example.com/blog/productivity' }\n ],\n stats = [\n { label: 'Hours Saved', value: 12 },\n { label: 'Tasks Completed', value: 45 }\n ],\n dashboardLink = 'https://example.com/dashboard'\n}) => {\n return (\n <EmailLayout previewText={`Your ${monthName} recap is here!`} title={`${monthName} Digest`}>\n <Text className=\"text-2xl font-bold text-gray-900 dark:text-white mb-4\">Your {monthName} Recap</Text>\n <Text className=\"text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6\">\n Hi {userName}, {monthName} was a busy month! Here is a quick look at what you accomplished and what you might have missed.\n </Text>\n\n <Section className=\"bg-gray-50 dark:bg-gray-700 p-6 rounded-lg mb-6 border border-gray-100 dark:border-gray-600\">\n <Text className=\"text-gray-900 dark:text-white font-bold mb-4 m-0\">Your Impact</Text>\n {stats.map((stat, index) => (\n <Row key={index} className=\"mb-2\">\n <Column><Text className=\"text-gray-600 dark:text-gray-300 m-0\">{stat.label}</Text></Column>\n <Column className=\"text-right\"><Text className=\"text-blue-600 dark:text-blue-400 font-bold m-0\">{stat.value}</Text></Column>\n </Row>\n ))}\n </Section>\n\n <Section className=\"mb-6\">\n <Text className=\"text-gray-900 dark:text-white font-bold mb-4 m-0\">Top Stories</Text>\n {topStories.map((story, index) => (\n <Text key={index} className=\"m-0 mb-2\">\n <Link href={story.link} className=\"text-blue-600 dark:text-blue-400 font-semibold hover:underline\">\n {story.title}\n </Link>\n </Text>\n ))}\n </Section>\n\n <Section className=\"text-center mb-6\">\n <EmailButton href={dashboardLink}>View Your Dashboard</EmailButton>\n </Section>\n </EmailLayout>\n );\n};\n\nexport default MonthlyDigest;\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;AAYO,MAAM,aAAa,GAAiC,CAAC,EAC1D,QAAQ,GAAG,MAAM,EACjB,SAAS,GAAG,SAAS,EACrB,UAAU,GAAG;AACX,IAAA,EAAE,KAAK,EAAE,0BAA0B,EAAE,IAAI,EAAE,6BAA6B,EAAE;AAC1E,IAAA,EAAE,KAAK,EAAE,+BAA+B,EAAE,IAAI,EAAE,uCAAuC;AACxF,CAAA,EACD,KAAK,GAAG;AACN,IAAA,EAAE,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,EAAE,EAAE;AACnC,IAAA,EAAE,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,EAAE;AACtC,CAAA,EACD,aAAa,GAAG,+BAA+B,EAChD,KAAI;IACH,QACEA,KAAC,WAAW,EAAA,EAAC,WAAW,EAAE,CAAA,KAAA,EAAQ,SAAS,CAAA,eAAA,CAAiB,EAAE,KAAK,EAAE,CAAA,EAAG,SAAS,CAAA,OAAA,CAAS,EAAA,QAAA,EAAA,CACxFA,KAAC,IAAI,EAAA,EAAC,SAAS,EAAC,uDAAuD,sBAAO,SAAS,EAAA,QAAA,CAAA,EAAA,CAAc,EACrGA,IAAA,CAAC,IAAI,IAAC,SAAS,EAAC,iEAAiE,EAAA,QAAA,EAAA,CAAA,KAAA,EAC3E,QAAQ,QAAI,SAAS,EAAA,kGAAA,CAAA,EAAA,CACpB,EAEPA,IAAA,CAAC,OAAO,IAAC,SAAS,EAAC,6FAA6F,EAAA,QAAA,EAAA,CAC9GC,GAAA,CAAC,IAAI,EAAA,EAAC,SAAS,EAAC,kDAAkD,EAAA,QAAA,EAAA,aAAA,EAAA,CAAmB,EACpF,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,MACrBD,IAAA,CAAC,GAAG,IAAa,SAAS,EAAC,MAAM,EAAA,QAAA,EAAA,CAC/BC,GAAA,CAAC,MAAM,EAAA,EAAA,QAAA,EAACA,GAAA,CAAC,IAAI,EAAA,EAAC,SAAS,EAAC,sCAAsC,EAAA,QAAA,EAAE,IAAI,CAAC,KAAK,GAAQ,EAAA,CAAS,EAC3FA,IAAC,MAAM,EAAA,EAAC,SAAS,EAAC,YAAY,YAACA,GAAA,CAAC,IAAI,IAAC,SAAS,EAAC,gDAAgD,EAAA,QAAA,EAAE,IAAI,CAAC,KAAK,EAAA,CAAQ,GAAS,CAAA,EAAA,EAFpH,KAAK,CAGT,CACP,CAAC,IACM,EAEVD,IAAA,CAAC,OAAO,EAAA,EAAC,SAAS,EAAC,MAAM,EAAA,QAAA,EAAA,CACvBC,IAAC,IAAI,EAAA,EAAC,SAAS,EAAC,kDAAkD,4BAAmB,EACpF,UAAU,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,MAC3BA,GAAA,CAAC,IAAI,EAAA,EAAa,SAAS,EAAC,UAAU,EAAA,QAAA,EACpCA,IAAC,IAAI,EAAA,EAAC,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,SAAS,EAAC,gEAAgE,YAC/F,KAAK,CAAC,KAAK,EAAA,CACP,EAAA,EAHE,KAAK,CAIT,CACR,CAAC,CAAA,EAAA,CACM,EAEVA,IAAC,OAAO,EAAA,EAAC,SAAS,EAAC,kBAAkB,YACnCA,GAAA,CAAC,WAAW,IAAC,IAAI,EAAE,aAAa,EAAA,QAAA,EAAA,qBAAA,EAAA,CAAmC,EAAA,CAC3D,CAAA,EAAA,CACE;AAElB;;;;"}
|
|
@@ -1,11 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Section, Heading, Text, Link } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
7
|
-
import { Text } from '../../../../../node_modules/@react-email/text/dist/index.js';
|
|
8
|
-
import { Link } from '../../../../../node_modules/@react-email/link/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
9
7
|
|
|
10
8
|
const WeeklyNewsletter = ({ username = 'Reader', weekNumber = 42, featuredArticles = [
|
|
11
9
|
{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"WeeklyNewsletter.js","sources":["../../../../../../src/components/Email/templates/marketing/newsletters/WeeklyNewsletter.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, Section, Link, Heading } from '@react-email/components';\nimport { EmailLayout, EmailButton } from '../../../components';\n\nexport interface Article {\n title: string;\n excerpt: string;\n readTime: number;\n link: string;\n}\n\nexport interface WeeklyNewsletterProps {\n username?: string;\n weekNumber?: number;\n featuredArticles?: Article[];\n topPickTitle?: string;\n communityHighlight?: string;\n}\n\nexport const WeeklyNewsletter: React.FC<WeeklyNewsletterProps> = ({\n username = 'Reader',\n weekNumber = 42,\n featuredArticles = [\n {\n title: '10 Tips for Better React Components',\n excerpt: 'Learn how to write more maintainable and scalable React components with these simple tips.',\n readTime: 5,\n link: 'https://example.com/blog/react-tips'\n },\n {\n title: 'Understanding Server Actions in Next.js',\n excerpt: 'A deep dive into how Server Actions work and when to use them in your Next.js applications.',\n readTime: 8,\n link: 'https://example.com/blog/server-actions'\n }\n ],\n topPickTitle = 'The Future of Web Development',\n communityHighlight = 'This week, we want to shout out @johndoe for their amazing contribution to our open-source repository!',\n}) => {\n const previewText = `Your weekly roundup: ${topPickTitle} and more →`;\n\n return (\n <EmailLayout previewText={previewText} title={`Week ${weekNumber} Newsletter`}>\n <Section className=\"bg-blue-50 dark:bg-blue-900 rounded-lg p-8 mb-6 text-center border-b-4 border-blue-500\">\n <Heading className=\"text-3xl font-bold text-gray-900 dark:text-white m-0\">\n Beyond<span className=\"text-blue-600 dark:text-blue-400\">Weekly</span>\n </Heading>\n <Text className=\"text-gray-600 dark:text-gray-300 mt-2 m-0\">Week {weekNumber}</Text>\n </Section>\n\n <Text className=\"text-2xl font-bold text-gray-900 dark:text-white mb-4\">Hey {username} 👋</Text>\n <Text className=\"text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6\">\n Here's what you missed this week. We've curated the best content to help you stay ahead.\n </Text>\n\n <Section className=\"mb-6\">\n <Heading className=\"text-xl font-semibold text-gray-900 dark:text-white border-b-2 border-gray-100 dark:border-gray-700 pb-2 mb-4\">\n Top Reads This Week\n </Heading>\n \n {featuredArticles.map((article, index) => (\n <Section key={index} className=\"mb-6\">\n <Link href={article.link} className=\"text-blue-600 dark:text-blue-400 font-semibold text-lg hover:underline\">\n {article.title}\n </Link>\n <Text className=\"text-gray-700 dark:text-gray-300 text-base mt-1 mb-2\">\n {article.excerpt}\n </Text>\n <Text className=\"text-gray-400 dark:text-gray-500 text-xs font-semibold uppercase tracking-wider m-0\">\n {article.readTime} min read\n </Text>\n </Section>\n ))}\n </Section>\n\n <Section className=\"bg-gray-50 dark:bg-gray-700 p-6 rounded-lg mb-6 border border-gray-100 dark:border-gray-600\">\n <Text className=\"text-blue-600 dark:text-blue-400 font-bold text-xs uppercase tracking-wider m-0 mb-2\">\n ⭐ Editor's Top Pick\n </Text>\n <Heading className=\"text-xl font-bold text-gray-900 dark:text-white m-0 mb-4\">\n {topPickTitle}\n </Heading>\n <EmailButton href=\"#\">Read Now →</EmailButton>\n </Section>\n\n <Section className=\"bg-blue-50 dark:bg-blue-900 p-6 rounded-lg mb-6 border border-blue-100 dark:border-blue-800\">\n <Heading className=\"text-lg font-semibold text-blue-900 dark:text-blue-100 m-0 mb-2\">\n 🌟 Community Corner\n </Heading>\n <Text className=\"text-blue-800 dark:text-blue-200 italic m-0 mb-4\">\n \"{communityHighlight}\"\n </Text>\n <Link href=\"#\" className=\"text-blue-600 dark:text-blue-400 font-semibold text-sm hover:underline\">\n Share your story →\n </Link>\n </Section>\n </EmailLayout>\n );\n};\n\nexport default WeeklyNewsletter;\n"],"names":["_jsxs","_jsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"WeeklyNewsletter.js","sources":["../../../../../../src/components/Email/templates/marketing/newsletters/WeeklyNewsletter.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, Section, Link, Heading } from '@react-email/components';\nimport { EmailLayout, EmailButton } from '../../../components';\n\nexport interface Article {\n title: string;\n excerpt: string;\n readTime: number;\n link: string;\n}\n\nexport interface WeeklyNewsletterProps {\n username?: string;\n weekNumber?: number;\n featuredArticles?: Article[];\n topPickTitle?: string;\n communityHighlight?: string;\n}\n\nexport const WeeklyNewsletter: React.FC<WeeklyNewsletterProps> = ({\n username = 'Reader',\n weekNumber = 42,\n featuredArticles = [\n {\n title: '10 Tips for Better React Components',\n excerpt: 'Learn how to write more maintainable and scalable React components with these simple tips.',\n readTime: 5,\n link: 'https://example.com/blog/react-tips'\n },\n {\n title: 'Understanding Server Actions in Next.js',\n excerpt: 'A deep dive into how Server Actions work and when to use them in your Next.js applications.',\n readTime: 8,\n link: 'https://example.com/blog/server-actions'\n }\n ],\n topPickTitle = 'The Future of Web Development',\n communityHighlight = 'This week, we want to shout out @johndoe for their amazing contribution to our open-source repository!',\n}) => {\n const previewText = `Your weekly roundup: ${topPickTitle} and more →`;\n\n return (\n <EmailLayout previewText={previewText} title={`Week ${weekNumber} Newsletter`}>\n <Section className=\"bg-blue-50 dark:bg-blue-900 rounded-lg p-8 mb-6 text-center border-b-4 border-blue-500\">\n <Heading className=\"text-3xl font-bold text-gray-900 dark:text-white m-0\">\n Beyond<span className=\"text-blue-600 dark:text-blue-400\">Weekly</span>\n </Heading>\n <Text className=\"text-gray-600 dark:text-gray-300 mt-2 m-0\">Week {weekNumber}</Text>\n </Section>\n\n <Text className=\"text-2xl font-bold text-gray-900 dark:text-white mb-4\">Hey {username} 👋</Text>\n <Text className=\"text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6\">\n Here's what you missed this week. We've curated the best content to help you stay ahead.\n </Text>\n\n <Section className=\"mb-6\">\n <Heading className=\"text-xl font-semibold text-gray-900 dark:text-white border-b-2 border-gray-100 dark:border-gray-700 pb-2 mb-4\">\n Top Reads This Week\n </Heading>\n \n {featuredArticles.map((article, index) => (\n <Section key={index} className=\"mb-6\">\n <Link href={article.link} className=\"text-blue-600 dark:text-blue-400 font-semibold text-lg hover:underline\">\n {article.title}\n </Link>\n <Text className=\"text-gray-700 dark:text-gray-300 text-base mt-1 mb-2\">\n {article.excerpt}\n </Text>\n <Text className=\"text-gray-400 dark:text-gray-500 text-xs font-semibold uppercase tracking-wider m-0\">\n {article.readTime} min read\n </Text>\n </Section>\n ))}\n </Section>\n\n <Section className=\"bg-gray-50 dark:bg-gray-700 p-6 rounded-lg mb-6 border border-gray-100 dark:border-gray-600\">\n <Text className=\"text-blue-600 dark:text-blue-400 font-bold text-xs uppercase tracking-wider m-0 mb-2\">\n ⭐ Editor's Top Pick\n </Text>\n <Heading className=\"text-xl font-bold text-gray-900 dark:text-white m-0 mb-4\">\n {topPickTitle}\n </Heading>\n <EmailButton href=\"#\">Read Now →</EmailButton>\n </Section>\n\n <Section className=\"bg-blue-50 dark:bg-blue-900 p-6 rounded-lg mb-6 border border-blue-100 dark:border-blue-800\">\n <Heading className=\"text-lg font-semibold text-blue-900 dark:text-blue-100 m-0 mb-2\">\n 🌟 Community Corner\n </Heading>\n <Text className=\"text-blue-800 dark:text-blue-200 italic m-0 mb-4\">\n \"{communityHighlight}\"\n </Text>\n <Link href=\"#\" className=\"text-blue-600 dark:text-blue-400 font-semibold text-sm hover:underline\">\n Share your story →\n </Link>\n </Section>\n </EmailLayout>\n );\n};\n\nexport default WeeklyNewsletter;\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;AAmBO,MAAM,gBAAgB,GAAoC,CAAC,EAChE,QAAQ,GAAG,QAAQ,EACnB,UAAU,GAAG,EAAE,EACf,gBAAgB,GAAG;AACjB,IAAA;AACE,QAAA,KAAK,EAAE,qCAAqC;AAC5C,QAAA,OAAO,EAAE,4FAA4F;AACrG,QAAA,QAAQ,EAAE,CAAC;AACX,QAAA,IAAI,EAAE;AACP,KAAA;AACD,IAAA;AACE,QAAA,KAAK,EAAE,yCAAyC;AAChD,QAAA,OAAO,EAAE,6FAA6F;AACtG,QAAA,QAAQ,EAAE,CAAC;AACX,QAAA,IAAI,EAAE;AACP;CACF,EACD,YAAY,GAAG,+BAA+B,EAC9C,kBAAkB,GAAG,wGAAwG,GAC9H,KAAI;AACH,IAAA,MAAM,WAAW,GAAG,CAAA,qBAAA,EAAwB,YAAY,aAAa;IAErE,QACEA,KAAC,WAAW,EAAA,EAAC,WAAW,EAAE,WAAW,EAAE,KAAK,EAAE,CAAA,KAAA,EAAQ,UAAU,CAAA,WAAA,CAAa,EAAA,QAAA,EAAA,CAC3EA,IAAA,CAAC,OAAO,EAAA,EAAC,SAAS,EAAC,wFAAwF,EAAA,QAAA,EAAA,CACzGA,IAAA,CAAC,OAAO,EAAA,EAAC,SAAS,EAAC,sDAAsD,EAAA,QAAA,EAAA,CAAA,QAAA,EACjEC,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,kCAAkC,uBAAc,CAAA,EAAA,CAC9D,EACVD,IAAA,CAAC,IAAI,EAAA,EAAC,SAAS,EAAC,2CAA2C,EAAA,QAAA,EAAA,CAAA,OAAA,EAAO,UAAU,CAAA,EAAA,CAAQ,CAAA,EAAA,CAC5E,EAEVA,KAAC,IAAI,EAAA,EAAC,SAAS,EAAC,uDAAuD,EAAA,QAAA,EAAA,CAAA,MAAA,EAAM,QAAQ,EAAA,eAAA,CAAA,EAAA,CAAW,EAChGC,GAAA,CAAC,IAAI,EAAA,EAAC,SAAS,EAAC,iEAAiE,EAAA,QAAA,EAAA,0FAAA,EAAA,CAE1E,EAEPD,IAAA,CAAC,OAAO,EAAA,EAAC,SAAS,EAAC,MAAM,EAAA,QAAA,EAAA,CACvBC,GAAA,CAAC,OAAO,EAAA,EAAC,SAAS,EAAC,+GAA+G,EAAA,QAAA,EAAA,qBAAA,EAAA,CAExH,EAET,gBAAgB,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,KAAK,MACnCD,IAAA,CAAC,OAAO,EAAA,EAAa,SAAS,EAAC,MAAM,EAAA,QAAA,EAAA,CACnCC,GAAA,CAAC,IAAI,EAAA,EAAC,IAAI,EAAE,OAAO,CAAC,IAAI,EAAE,SAAS,EAAC,wEAAwE,EAAA,QAAA,EACzG,OAAO,CAAC,KAAK,EAAA,CACT,EACPA,IAAC,IAAI,EAAA,EAAC,SAAS,EAAC,sDAAsD,EAAA,QAAA,EACnE,OAAO,CAAC,OAAO,EAAA,CACX,EACPD,IAAA,CAAC,IAAI,IAAC,SAAS,EAAC,qFAAqF,EAAA,QAAA,EAAA,CAClG,OAAO,CAAC,QAAQ,EAAA,WAAA,CAAA,EAAA,CACZ,CAAA,EAAA,EATK,KAAK,CAUT,CACX,CAAC,IACM,EAEVA,IAAA,CAAC,OAAO,EAAA,EAAC,SAAS,EAAC,6FAA6F,EAAA,QAAA,EAAA,CAC9GC,GAAA,CAAC,IAAI,EAAA,EAAC,SAAS,EAAC,sFAAsF,EAAA,QAAA,EAAA,0BAAA,EAAA,CAE/F,EACPA,GAAA,CAAC,OAAO,EAAA,EAAC,SAAS,EAAC,0DAA0D,EAAA,QAAA,EAC1E,YAAY,EAAA,CACL,EACVA,GAAA,CAAC,WAAW,EAAA,EAAC,IAAI,EAAC,GAAG,EAAA,QAAA,EAAA,iBAAA,EAAA,CAAyB,CAAA,EAAA,CACtC,EAEVD,IAAA,CAAC,OAAO,EAAA,EAAC,SAAS,EAAC,6FAA6F,aAC9GC,GAAA,CAAC,OAAO,EAAA,EAAC,SAAS,EAAC,iEAAiE,8CAE1E,EACVD,IAAA,CAAC,IAAI,EAAA,EAAC,SAAS,EAAC,kDAAkD,EAAA,QAAA,EAAA,CAAA,IAAA,EAC9D,kBAAkB,EAAA,IAAA,CAAA,EAAA,CACf,EACPC,GAAA,CAAC,IAAI,IAAC,IAAI,EAAC,GAAG,EAAC,SAAS,EAAC,wEAAwE,EAAA,QAAA,EAAA,yBAAA,EAAA,CAE1F,CAAA,EAAA,CACC,CAAA,EAAA,CACE;AAElB;;;;"}
|
|
@@ -1,13 +1,10 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section, Row, Column, Img } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailDivider } from '../../../components/EmailDivider.js';
|
|
4
5
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
5
6
|
import 'react';
|
|
6
|
-
import
|
|
7
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
8
|
-
import { Row } from '../../../../../node_modules/@react-email/row/dist/index.js';
|
|
9
|
-
import { Column } from '../../../../../node_modules/@react-email/column/dist/index.js';
|
|
10
|
-
import { Img } from '../../../../../node_modules/@react-email/img/dist/index.js';
|
|
7
|
+
import '@react-email/render';
|
|
11
8
|
|
|
12
9
|
const AbandonedCart = ({ userName = 'Alex', cartItems = [
|
|
13
10
|
{ name: 'Premium UI Kit License', price: '$49.00', image: 'https://via.placeholder.com/100' },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AbandonedCart.js","sources":["../../../../../../src/components/Email/templates/marketing/promotional/AbandonedCart.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, Section, Row, Column, Img } from '@react-email/components';\nimport { EmailLayout, EmailButton, EmailDivider } from '../../../components';\n\nexport interface EmailCartItem {\n name: string;\n price: string;\n image: string;\n}\n\nexport interface AbandonedCartProps {\n userName?: string;\n cartItems?: EmailCartItem[];\n totalValue?: string;\n checkoutLink?: string;\n discountCode?: string;\n}\n\nexport const AbandonedCart: React.FC<AbandonedCartProps> = ({\n userName = 'Alex',\n cartItems = [\n { name: 'Premium UI Kit License', price: '$49.00', image: 'https://via.placeholder.com/100' },\n { name: '1 Year Updates & Support', price: '$29.00', image: 'https://via.placeholder.com/100' }\n ],\n totalValue = '$78.00',\n checkoutLink = 'https://example.com/checkout/recover/123',\n discountCode = 'COMEBACK10'\n}) => {\n return (\n <EmailLayout previewText=\"You left something behind...\" title=\"Complete Your Purchase\">\n <Text className=\"text-2xl font-bold text-gray-900 dark:text-white mb-4\">Did you forget something?</Text>\n <Text className=\"text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6\">\n Hi {userName}, we noticed you left some great items in your cart. They are selling out fast, but we've saved them for you for a little while longer!\n </Text>\n\n <Section className=\"bg-gray-50 dark:bg-gray-700 p-6 rounded-lg mb-6 border border-gray-100 dark:border-gray-600\">\n {cartItems.map((item, index) => (\n <Row key={index} className=\"mb-4\">\n <Column style={{ width: '60px' }}>\n <Img src={item.image} width=\"50\" height=\"50\" alt={item.name} className=\"rounded-md border border-gray-200 dark:border-gray-600\" />\n </Column>\n <Column>\n <Text className=\"text-gray-900 dark:text-white font-semibold m-0\">{item.name}</Text>\n <Text className=\"text-gray-500 dark:text-gray-400 text-sm m-0\">{item.price}</Text>\n </Column>\n </Row>\n ))}\n <EmailDivider />\n <Text className=\"text-gray-900 dark:text-white font-bold text-right m-0\">Total: {totalValue}</Text>\n </Section>\n\n <Section className=\"bg-blue-50 dark:bg-blue-900 p-4 rounded-lg mb-6 text-center border border-blue-100 dark:border-blue-800\">\n <Text className=\"text-blue-800 dark:text-blue-200 font-semibold m-0 mb-2\">Ready to checkout? Use this code for 10% off:</Text>\n <Text className=\"text-2xl font-bold font-mono tracking-widest text-blue-600 dark:text-blue-400 m-0\">{discountCode}</Text>\n </Section>\n\n <Section className=\"text-center mb-6\">\n <EmailButton href={checkoutLink}>Complete Purchase</EmailButton>\n </Section>\n </EmailLayout>\n );\n};\n\nexport default AbandonedCart;\n"],"names":["_jsxs","_jsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"AbandonedCart.js","sources":["../../../../../../src/components/Email/templates/marketing/promotional/AbandonedCart.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, Section, Row, Column, Img } from '@react-email/components';\nimport { EmailLayout, EmailButton, EmailDivider } from '../../../components';\n\nexport interface EmailCartItem {\n name: string;\n price: string;\n image: string;\n}\n\nexport interface AbandonedCartProps {\n userName?: string;\n cartItems?: EmailCartItem[];\n totalValue?: string;\n checkoutLink?: string;\n discountCode?: string;\n}\n\nexport const AbandonedCart: React.FC<AbandonedCartProps> = ({\n userName = 'Alex',\n cartItems = [\n { name: 'Premium UI Kit License', price: '$49.00', image: 'https://via.placeholder.com/100' },\n { name: '1 Year Updates & Support', price: '$29.00', image: 'https://via.placeholder.com/100' }\n ],\n totalValue = '$78.00',\n checkoutLink = 'https://example.com/checkout/recover/123',\n discountCode = 'COMEBACK10'\n}) => {\n return (\n <EmailLayout previewText=\"You left something behind...\" title=\"Complete Your Purchase\">\n <Text className=\"text-2xl font-bold text-gray-900 dark:text-white mb-4\">Did you forget something?</Text>\n <Text className=\"text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6\">\n Hi {userName}, we noticed you left some great items in your cart. They are selling out fast, but we've saved them for you for a little while longer!\n </Text>\n\n <Section className=\"bg-gray-50 dark:bg-gray-700 p-6 rounded-lg mb-6 border border-gray-100 dark:border-gray-600\">\n {cartItems.map((item, index) => (\n <Row key={index} className=\"mb-4\">\n <Column style={{ width: '60px' }}>\n <Img src={item.image} width=\"50\" height=\"50\" alt={item.name} className=\"rounded-md border border-gray-200 dark:border-gray-600\" />\n </Column>\n <Column>\n <Text className=\"text-gray-900 dark:text-white font-semibold m-0\">{item.name}</Text>\n <Text className=\"text-gray-500 dark:text-gray-400 text-sm m-0\">{item.price}</Text>\n </Column>\n </Row>\n ))}\n <EmailDivider />\n <Text className=\"text-gray-900 dark:text-white font-bold text-right m-0\">Total: {totalValue}</Text>\n </Section>\n\n <Section className=\"bg-blue-50 dark:bg-blue-900 p-4 rounded-lg mb-6 text-center border border-blue-100 dark:border-blue-800\">\n <Text className=\"text-blue-800 dark:text-blue-200 font-semibold m-0 mb-2\">Ready to checkout? Use this code for 10% off:</Text>\n <Text className=\"text-2xl font-bold font-mono tracking-widest text-blue-600 dark:text-blue-400 m-0\">{discountCode}</Text>\n </Section>\n\n <Section className=\"text-center mb-6\">\n <EmailButton href={checkoutLink}>Complete Purchase</EmailButton>\n </Section>\n </EmailLayout>\n );\n};\n\nexport default AbandonedCart;\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;AAkBO,MAAM,aAAa,GAAiC,CAAC,EAC1D,QAAQ,GAAG,MAAM,EACjB,SAAS,GAAG;IACV,EAAE,IAAI,EAAE,wBAAwB,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,iCAAiC,EAAE;IAC7F,EAAE,IAAI,EAAE,0BAA0B,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,iCAAiC;AAC9F,CAAA,EACD,UAAU,GAAG,QAAQ,EACrB,YAAY,GAAG,0CAA0C,EACzD,YAAY,GAAG,YAAY,EAC5B,KAAI;AACH,IAAA,QACEA,IAAA,CAAC,WAAW,IAAC,WAAW,EAAC,8BAA8B,EAAC,KAAK,EAAC,wBAAwB,EAAA,QAAA,EAAA,CACpFC,IAAC,IAAI,EAAA,EAAC,SAAS,EAAC,uDAAuD,0CAAiC,EACxGD,IAAA,CAAC,IAAI,EAAA,EAAC,SAAS,EAAC,iEAAiE,EAAA,QAAA,EAAA,CAAA,KAAA,EAC3E,QAAQ,EAAA,yIAAA,CAAA,EAAA,CACP,EAEPA,KAAC,OAAO,EAAA,EAAC,SAAS,EAAC,6FAA6F,aAC7G,SAAS,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,MACzBA,IAAA,CAAC,GAAG,IAAa,SAAS,EAAC,MAAM,EAAA,QAAA,EAAA,CAC/BC,GAAA,CAAC,MAAM,EAAA,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,YAC9BA,GAAA,CAAC,GAAG,IAAC,GAAG,EAAE,IAAI,CAAC,KAAK,EAAE,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,GAAG,EAAE,IAAI,CAAC,IAAI,EAAE,SAAS,EAAC,wDAAwD,GAAG,EAAA,CAC3H,EACTD,KAAC,MAAM,EAAA,EAAA,QAAA,EAAA,CACLC,IAAC,IAAI,EAAA,EAAC,SAAS,EAAC,iDAAiD,YAAE,IAAI,CAAC,IAAI,EAAA,CAAQ,EACpFA,IAAC,IAAI,EAAA,EAAC,SAAS,EAAC,8CAA8C,YAAE,IAAI,CAAC,KAAK,EAAA,CAAQ,CAAA,EAAA,CAC3E,KAPD,KAAK,CAQT,CACP,CAAC,EACFA,IAAC,YAAY,EAAA,EAAA,CAAG,EAChBD,IAAA,CAAC,IAAI,IAAC,SAAS,EAAC,wDAAwD,EAAA,QAAA,EAAA,CAAA,SAAA,EAAS,UAAU,IAAQ,CAAA,EAAA,CAC3F,EAEVA,KAAC,OAAO,EAAA,EAAC,SAAS,EAAC,yGAAyG,aAC1HC,GAAA,CAAC,IAAI,IAAC,SAAS,EAAC,yDAAyD,EAAA,QAAA,EAAA,+CAAA,EAAA,CAAqD,EAC9HA,IAAC,IAAI,EAAA,EAAC,SAAS,EAAC,mFAAmF,YAAE,YAAY,EAAA,CAAQ,IACjH,EAEVA,GAAA,CAAC,OAAO,EAAA,EAAC,SAAS,EAAC,kBAAkB,EAAA,QAAA,EACnCA,IAAC,WAAW,EAAA,EAAC,IAAI,EAAE,YAAY,kCAAiC,EAAA,CACxD,CAAA,EAAA,CACE;AAElB;;;;"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
7
7
|
|
|
8
8
|
const BackInStock = ({ link = '#' }) => (jsxs(EmailLayout, { previewText: "It's back!", title: "Back in Stock", children: [jsx(Text, { className: "text-2xl font-bold text-gray-900 dark:text-white mb-4", children: "Back in Stock!" }), jsx(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: "You asked us to notify you when it returned, and it's finally here! Your requested item is back in stock." }), jsx(Section, { className: "text-center mb-6", children: jsx(EmailButton, { href: link, children: "Shop Now" }) })] }));
|
|
9
9
|
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
7
7
|
|
|
8
8
|
const BirthdayOffer = ({ link = '#' }) => (jsxs(EmailLayout, { previewText: "We got you a little something...", title: "Happy Birthday", children: [jsx(Text, { className: "text-2xl font-bold text-gray-900 dark:text-white mb-4", children: "Happy Birthday! \uD83C\uDF82" }), jsx(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: "To help you celebrate your special day, we've deposited a special discount code into your account!" }), jsx(Section, { className: "text-center mb-6", children: jsx(EmailButton, { href: link, children: "Claim Your Gift" }) })] }));
|
|
9
9
|
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
7
7
|
|
|
8
8
|
const BrowseAbandonment = ({ link = '#' }) => (jsxs(EmailLayout, { previewText: "Still thinking about it?", title: "Items you viewed", children: [jsx(Text, { className: "text-2xl font-bold text-gray-900 dark:text-white mb-4", children: "Did something catch your eye?" }), jsx(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: "We noticed you were browsing some of our top-rated products. If you have any questions or need help deciding, our team is here for you!" }), jsx(Section, { className: "text-center mb-6", children: jsx(EmailButton, { href: link, children: "Take another look" }) })] }));
|
|
9
9
|
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Section, Text } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailDivider } from '../../../components/EmailDivider.js';
|
|
4
5
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
5
6
|
import 'react';
|
|
6
|
-
import
|
|
7
|
-
import { Text } from '../../../../../node_modules/@react-email/text/dist/index.js';
|
|
7
|
+
import '@react-email/render';
|
|
8
8
|
|
|
9
9
|
const FlashSale = ({ discountAmount = '40%', saleName = 'Summer Flash Sale', endTime = 'Midnight Tonight', shopLink = 'https://example.com/sale' }) => {
|
|
10
10
|
return (jsxs(EmailLayout, { previewText: `${discountAmount} OFF ends ${endTime}!`, title: saleName, children: [jsxs(Section, { className: "bg-red-600 dark:bg-red-700 p-8 rounded-lg mb-6 text-center", children: [jsx(Text, { className: "text-white font-bold tracking-widest text-xs uppercase m-0 mb-2", children: saleName }), jsxs(Text, { className: "text-6xl font-bold text-white m-0 mb-4", children: [discountAmount, " OFF"] }), jsx(Text, { className: "text-red-100 text-base m-0", children: "Everything sitewide. No code needed." })] }), jsxs(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6 text-center", children: ["Our biggest sale of the season is here, but it won't last long. Grab your favorite items before the prices go back up at ", jsx("strong", { children: endTime }), "."] }), jsx(Section, { className: "text-center mb-6", children: jsx(EmailButton, { href: shopLink, children: "Shop The Sale Now" }) }), jsx(EmailDivider, {}), jsx(Text, { className: "text-gray-500 dark:text-gray-400 text-sm text-center", children: "Discount applies automatically at checkout. Excludes enterprise plans." })] }));
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
7
7
|
|
|
8
8
|
const MilestoneDiscount = ({ link = '#' }) => (jsxs(EmailLayout, { previewText: "Thanks for being loyal!", title: "Milestone Reached", children: [jsx(Text, { className: "text-2xl font-bold text-gray-900 dark:text-white mb-4", children: "You hit a milestone! \uD83C\uDF1F" }), jsx(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: "Thanks for your ongoing loyalty. You've reached a new tier in our rewards program, unlocking exclusive discounts and perks." }), jsx(Section, { className: "text-center mb-6", children: jsx(EmailButton, { href: link, children: "View Your Perks" }) })] }));
|
|
9
9
|
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
7
7
|
|
|
8
8
|
const PriceDropAlert = ({ link = '#' }) => (jsxs(EmailLayout, { previewText: "Great news! The price just dropped.", title: "Price Drop Alert", children: [jsx(Text, { className: "text-2xl font-bold text-gray-900 dark:text-white mb-4", children: "Price Drop Alert \uD83D\uDCC9" }), jsx(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: "Great news! An item you've been keeping your eye on recently dropped in price. Grab it now before it's gone." }), jsx(Section, { className: "text-center mb-6", children: jsx(EmailButton, { href: link, children: "Shop the Item" }) })] }));
|
|
9
9
|
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
7
7
|
|
|
8
8
|
const SeasonalCampaign = ({ link = '#' }) => (jsxs(EmailLayout, { previewText: "Celebrate the season with us!", title: "Holiday Special", children: [jsx(Text, { className: "text-2xl font-bold text-gray-900 dark:text-white mb-4", children: "Happy Holidays! \uD83C\uDF81" }), jsx(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: "To celebrate the season, we are offering exclusive bundles and discounts. Treat yourself or find the perfect gift." }), jsx(Section, { className: "text-center mb-6", children: jsx(EmailButton, { href: link, children: "View Offers" }) })] }));
|
|
9
9
|
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
7
7
|
|
|
8
8
|
const ComeBack60Day = ({ link = '#' }) => (jsxs(EmailLayout, { previewText: "You've been missed!", title: "Come Back", children: [jsx(Text, { className: "text-2xl font-bold text-gray-900 dark:text-white mb-4", children: "It's been a while!" }), jsx(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: "It's been two months since we last saw you. Our platform has evolved a lot since then, and we'd love to show you around." }), jsx(Section, { className: "text-center mb-6", children: jsx(EmailButton, { href: link, children: "Log In to See What's New" }) })] }));
|
|
9
9
|
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
7
7
|
|
|
8
8
|
const LastChance90Day = ({ link = '#' }) => (jsxs(EmailLayout, { previewText: "Final Notice regarding your account", title: "Account Inactive", children: [jsx(Text, { className: "text-2xl font-bold text-gray-900 dark:text-white mb-4", children: "Do you still want to hear from us?" }), jsx(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: "We notice you haven't opened any of our emails recently. If we don't hear from you, we'll remove you from our mailing list soon to keep your inbox clean." }), jsx(Section, { className: "text-center mb-6", children: jsx(EmailButton, { href: link, children: "Keep Me Subscribed" }) })] }));
|
|
9
9
|
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
7
7
|
|
|
8
8
|
const ProductUpdateReengagement = ({ link = '#' }) => (jsxs(EmailLayout, { previewText: "We built the feature you wanted!", title: "Major Update", children: [jsx(Text, { className: "text-2xl font-bold text-gray-900 dark:text-white mb-4", children: "You asked, we listened." }), jsx(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: "We just rolled out a massive update that completely changes the way you can use our platform. Come back and take it for a spin!" }), jsx(Section, { className: "text-center mb-6", children: jsx(EmailButton, { href: link, children: "Try the New Feature" }) })] }));
|
|
9
9
|
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
7
7
|
|
|
8
8
|
const WeMissYou30Day = ({ userName = 'Alex', daysInactive = 30, returnLink = 'https://example.com/dashboard' }) => {
|
|
9
9
|
return (jsxs(EmailLayout, { previewText: `We miss you, ${userName}! Come see what's new.`, title: "We Miss You", children: [jsx(Text, { className: "text-2xl font-bold text-gray-900 dark:text-white mb-4", children: "It's been a while!" }), jsxs(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: ["Hi ", userName, ", we noticed you haven't logged in for the last ", daysInactive, " days. We've missed you!"] }), jsx(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: "Since you last visited, we've added some exciting new features that we think you'll love. Jump back in to explore what's changed and pick up right where you left off." }), jsx(Section, { className: "text-center mb-6", children: jsx(EmailButton, { href: returnLink, children: "Log In to Your Account" }) })] }));
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
7
7
|
|
|
8
8
|
const CommunityMilestone = ({ link = '#' }) => (jsxs(EmailLayout, { previewText: "We hit a massive milestone!", title: "Community Celebration", children: [jsx(Text, { className: "text-2xl font-bold text-gray-900 dark:text-white mb-4", children: "We did it! \uD83C\uDF89" }), jsx(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: "Our community just crossed a massive milestone, and we couldn't have done it without you. To say thanks, we're doing a massive giveaway on our social channels!" }), jsx(Section, { className: "text-center mb-6", children: jsx(EmailButton, { href: link, children: "Enter the Giveaway" }) })] }));
|
|
9
9
|
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
7
7
|
|
|
8
8
|
const NewFollowerWelcome = ({ link = '#' }) => (jsxs(EmailLayout, { previewText: "Thanks for following us!", title: "Welcome to the Community", children: [jsx(Text, { className: "text-2xl font-bold text-gray-900 dark:text-white mb-4", children: "Thanks for following!" }), jsx(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: "We love connecting with our community on social media. Check out some of our most popular posts and feel free to jump into the conversation!" }), jsx(Section, { className: "text-center mb-6", children: jsx(EmailButton, { href: link, children: "Join the Chat" }) })] }));
|
|
9
9
|
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
7
7
|
|
|
8
8
|
const ShareYourStory = ({ link = '#' }) => (jsxs(EmailLayout, { previewText: "We want to hear from you!", title: "Share Your Story", children: [jsx(Text, { className: "text-2xl font-bold text-gray-900 dark:text-white mb-4", children: "Tell us your story" }), jsx(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: "How has our platform helped you? Share your experience with us on social media using our hashtag, and you might get featured on our page!" }), jsx(Section, { className: "text-center mb-6", children: jsx(EmailButton, { href: link, children: "Post on Social" }) })] }));
|
|
9
9
|
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
7
7
|
|
|
8
8
|
const SocialProof = ({ userName = 'Alex', testimonials = [
|
|
9
9
|
{ quote: "This platform completely changed how our team ships code. We've reduced our time-to-market by 40%.", authorName: "Jane Doe", company: "TechFlow" },
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
7
7
|
|
|
8
8
|
const UserSpotlight = ({ link = '#' }) => (jsxs(EmailLayout, { previewText: "Check out this month's featured user", title: "User Spotlight", children: [jsx(Text, { className: "text-2xl font-bold text-gray-900 dark:text-white mb-4", children: "User Spotlight \uD83C\uDF1F" }), jsx(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: "Every month we highlight a user who is doing amazing things. Meet this month's featured creator and learn how they are finding success." }), jsx(Section, { className: "text-center mb-6", children: jsx(EmailButton, { href: link, children: "Read Their Story" }) })] }));
|
|
9
9
|
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
7
7
|
|
|
8
8
|
const BetaFeedback = ({ link = '#' }) => (jsxs(EmailLayout, { previewText: "How is the new feature working for you?", title: "Beta Feedback", children: [jsx(Text, { className: "text-2xl font-bold text-gray-900 dark:text-white mb-4", children: "Beta Tester Feedback" }), jsx(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: "Thank you for being part of our exclusive beta program. Have you run into any bugs or friction? Let our engineers know so we can smooth it out before launch." }), jsx(Section, { className: "text-center mb-6", children: jsx(EmailButton, { href: link, children: "Report an Issue" }) })] }));
|
|
9
9
|
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
7
7
|
|
|
8
8
|
const CSATSurvey = ({ link = '#' }) => (jsxs(EmailLayout, { previewText: "How was your recent support experience?", title: "CSAT Survey", children: [jsx(Text, { className: "text-2xl font-bold text-gray-900 dark:text-white mb-4", children: "Rate Your Experience" }), jsx(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: "Your support ticket was recently closed. Could you take 10 seconds to let us know how our agent handled your request?" }), jsx(Section, { className: "text-center mb-6", children: jsx(EmailButton, { href: link, children: "Leave Feedback" }) })] }));
|
|
9
9
|
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section, Link } from '@react-email/components';
|
|
2
3
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
3
4
|
import 'react';
|
|
4
|
-
import
|
|
5
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
6
|
-
import { Link } from '../../../../../node_modules/@react-email/link/dist/index.js';
|
|
5
|
+
import '@react-email/render';
|
|
7
6
|
|
|
8
7
|
const ExitSurvey = ({ userName = 'User', feedbackLinkBase = 'https://example.com/survey/exit?reason=' }) => {
|
|
9
8
|
const reasons = [
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ExitSurvey.js","sources":["../../../../../../src/components/Email/templates/marketing/surveys/ExitSurvey.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, Section, Row, Column, Link } from '@react-email/components';\nimport { EmailLayout, EmailDivider } from '../../../components';\n\nexport interface ExitSurveyProps {\n userName?: string;\n feedbackLinkBase?: string;\n}\n\nexport const ExitSurvey: React.FC<ExitSurveyProps> = ({\n userName = 'User',\n feedbackLinkBase = 'https://example.com/survey/exit?reason='\n}) => {\n const reasons = [\n { id: 'too-expensive', label: 'It is too expensive' },\n { id: 'too-complex', label: 'It was too hard to use' },\n { id: 'missing-features', label: 'It is missing features I need' },\n { id: 'switched-product', label: 'I am switching to another product' },\n { id: 'other', label: 'Other reason' }\n ];\n\n return (\n <EmailLayout previewText=\"We're sorry to see you go! Can you tell us why?\" title=\"Exit Survey\">\n <Text className=\"text-2xl font-bold text-gray-900 dark:text-white mb-4\">We're sorry to see you go!</Text>\n <Text className=\"text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6\">\n Hi {userName}, your subscription has been cancelled. As a growing company, your feedback is the absolute best way for us to improve. Could you click the option below that best describes why you are leaving?\n </Text>\n\n <Section className=\"bg-gray-50 dark:bg-gray-700 p-4 rounded-lg mb-6 border border-gray-100 dark:border-gray-600\">\n {reasons.map((reason) => (\n <Link key={reason.id} href={`${feedbackLinkBase}${reason.id}`} className=\"block w-full bg-white dark:bg-gray-800 text-gray-700 dark:text-gray-300 border border-gray-200 dark:border-gray-600 rounded-md p-3 mb-2 text-center text-sm font-semibold hover:bg-gray-50 dark:hover:bg-gray-700\" style={{ textDecoration: 'none' }}>\n {reason.label}\n </Link>\n ))}\n </Section>\n </EmailLayout>\n );\n};\n\nexport default ExitSurvey;\n"],"names":["_jsxs","_jsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ExitSurvey.js","sources":["../../../../../../src/components/Email/templates/marketing/surveys/ExitSurvey.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, Section, Row, Column, Link } from '@react-email/components';\nimport { EmailLayout, EmailDivider } from '../../../components';\n\nexport interface ExitSurveyProps {\n userName?: string;\n feedbackLinkBase?: string;\n}\n\nexport const ExitSurvey: React.FC<ExitSurveyProps> = ({\n userName = 'User',\n feedbackLinkBase = 'https://example.com/survey/exit?reason='\n}) => {\n const reasons = [\n { id: 'too-expensive', label: 'It is too expensive' },\n { id: 'too-complex', label: 'It was too hard to use' },\n { id: 'missing-features', label: 'It is missing features I need' },\n { id: 'switched-product', label: 'I am switching to another product' },\n { id: 'other', label: 'Other reason' }\n ];\n\n return (\n <EmailLayout previewText=\"We're sorry to see you go! Can you tell us why?\" title=\"Exit Survey\">\n <Text className=\"text-2xl font-bold text-gray-900 dark:text-white mb-4\">We're sorry to see you go!</Text>\n <Text className=\"text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6\">\n Hi {userName}, your subscription has been cancelled. As a growing company, your feedback is the absolute best way for us to improve. Could you click the option below that best describes why you are leaving?\n </Text>\n\n <Section className=\"bg-gray-50 dark:bg-gray-700 p-4 rounded-lg mb-6 border border-gray-100 dark:border-gray-600\">\n {reasons.map((reason) => (\n <Link key={reason.id} href={`${feedbackLinkBase}${reason.id}`} className=\"block w-full bg-white dark:bg-gray-800 text-gray-700 dark:text-gray-300 border border-gray-200 dark:border-gray-600 rounded-md p-3 mb-2 text-center text-sm font-semibold hover:bg-gray-50 dark:hover:bg-gray-700\" style={{ textDecoration: 'none' }}>\n {reason.label}\n </Link>\n ))}\n </Section>\n </EmailLayout>\n );\n};\n\nexport default ExitSurvey;\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;AASO,MAAM,UAAU,GAA8B,CAAC,EACpD,QAAQ,GAAG,MAAM,EACjB,gBAAgB,GAAG,yCAAyC,EAC7D,KAAI;AACH,IAAA,MAAM,OAAO,GAAG;AACd,QAAA,EAAE,EAAE,EAAE,eAAe,EAAE,KAAK,EAAE,qBAAqB,EAAE;AACrD,QAAA,EAAE,EAAE,EAAE,aAAa,EAAE,KAAK,EAAE,wBAAwB,EAAE;AACtD,QAAA,EAAE,EAAE,EAAE,kBAAkB,EAAE,KAAK,EAAE,+BAA+B,EAAE;AAClE,QAAA,EAAE,EAAE,EAAE,kBAAkB,EAAE,KAAK,EAAE,mCAAmC,EAAE;AACtE,QAAA,EAAE,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,cAAc;KACrC;AAED,IAAA,QACEA,IAAA,CAAC,WAAW,IAAC,WAAW,EAAC,iDAAiD,EAAC,KAAK,EAAC,aAAa,aAC5FC,GAAA,CAAC,IAAI,IAAC,SAAS,EAAC,uDAAuD,EAAA,QAAA,EAAA,4BAAA,EAAA,CAAkC,EACzGD,IAAA,CAAC,IAAI,IAAC,SAAS,EAAC,iEAAiE,EAAA,QAAA,EAAA,CAAA,KAAA,EAC3E,QAAQ,yMACP,EAEPC,GAAA,CAAC,OAAO,EAAA,EAAC,SAAS,EAAC,6FAA6F,YAC7G,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,MAClBA,IAAC,IAAI,EAAA,EAAiB,IAAI,EAAE,CAAA,EAAG,gBAAgB,CAAA,EAAG,MAAM,CAAC,EAAE,EAAE,EAAE,SAAS,EAAC,mNAAmN,EAAC,KAAK,EAAE,EAAE,cAAc,EAAE,MAAM,EAAE,EAAA,QAAA,EAC3T,MAAM,CAAC,KAAK,IADJ,MAAM,CAAC,EAAE,CAEb,CACR,CAAC,EAAA,CACM,CAAA,EAAA,CACE;AAElB;;;;"}
|
|
@@ -1,12 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section, Row, Column, Link } from '@react-email/components';
|
|
2
3
|
import { EmailDivider } from '../../../components/EmailDivider.js';
|
|
3
4
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
7
|
-
import { Row } from '../../../../../node_modules/@react-email/row/dist/index.js';
|
|
8
|
-
import { Column } from '../../../../../node_modules/@react-email/column/dist/index.js';
|
|
9
|
-
import { Link } from '../../../../../node_modules/@react-email/link/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
10
7
|
|
|
11
8
|
const NPSSurvey = ({ userName = 'Alex', surveyLinkBase = 'https://example.com/survey/nps?score=' }) => {
|
|
12
9
|
const scores = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NPSSurvey.js","sources":["../../../../../../src/components/Email/templates/marketing/surveys/NPSSurvey.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, Section, Row, Column, Link } from '@react-email/components';\nimport { EmailLayout, EmailDivider } from '../../../components';\n\nexport interface NPSSurveyProps {\n userName?: string;\n surveyLinkBase?: string;\n}\n\nexport const NPSSurvey: React.FC<NPSSurveyProps> = ({\n userName = 'Alex',\n surveyLinkBase = 'https://example.com/survey/nps?score='\n}) => {\n const scores = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10];\n\n return (\n <EmailLayout previewText=\"How likely are you to recommend us?\" title=\"How are we doing?\">\n <Text className=\"text-2xl font-bold text-gray-900 dark:text-white mb-4\">How are we doing?</Text>\n <Text className=\"text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6\">\n Hi {userName}, we are always looking for ways to improve our platform. Based on your recent experience, how likely are you to recommend us to a friend or colleague?\n </Text>\n\n <Section className=\"bg-gray-50 dark:bg-gray-700 p-4 rounded-lg mb-6 border border-gray-100 dark:border-gray-600\">\n <Text className=\"text-center text-sm font-semibold text-gray-500 dark:text-gray-400 mb-4\">\n 0 = Not likely at all, 10 = Extremely likely\n </Text>\n <Row className=\"text-center\">\n {scores.map((score) => (\n <Column key={score} className=\"px-0.5\">\n <Link href={`${surveyLinkBase}${score}`} className=\"inline-block w-full py-2 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded text-blue-600 dark:text-blue-400 font-bold hover:bg-blue-50 dark:hover:bg-blue-900/50\" style={{ textDecoration: 'none' }}>\n {score}\n </Link>\n </Column>\n ))}\n </Row>\n </Section>\n <EmailDivider />\n <Text className=\"text-gray-500 dark:text-gray-400 text-sm text-center\">It only takes a click, and your feedback means the world to us!</Text>\n </EmailLayout>\n );\n};\n\nexport default NPSSurvey;\n"],"names":["_jsxs","_jsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"NPSSurvey.js","sources":["../../../../../../src/components/Email/templates/marketing/surveys/NPSSurvey.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, Section, Row, Column, Link } from '@react-email/components';\nimport { EmailLayout, EmailDivider } from '../../../components';\n\nexport interface NPSSurveyProps {\n userName?: string;\n surveyLinkBase?: string;\n}\n\nexport const NPSSurvey: React.FC<NPSSurveyProps> = ({\n userName = 'Alex',\n surveyLinkBase = 'https://example.com/survey/nps?score='\n}) => {\n const scores = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10];\n\n return (\n <EmailLayout previewText=\"How likely are you to recommend us?\" title=\"How are we doing?\">\n <Text className=\"text-2xl font-bold text-gray-900 dark:text-white mb-4\">How are we doing?</Text>\n <Text className=\"text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6\">\n Hi {userName}, we are always looking for ways to improve our platform. Based on your recent experience, how likely are you to recommend us to a friend or colleague?\n </Text>\n\n <Section className=\"bg-gray-50 dark:bg-gray-700 p-4 rounded-lg mb-6 border border-gray-100 dark:border-gray-600\">\n <Text className=\"text-center text-sm font-semibold text-gray-500 dark:text-gray-400 mb-4\">\n 0 = Not likely at all, 10 = Extremely likely\n </Text>\n <Row className=\"text-center\">\n {scores.map((score) => (\n <Column key={score} className=\"px-0.5\">\n <Link href={`${surveyLinkBase}${score}`} className=\"inline-block w-full py-2 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded text-blue-600 dark:text-blue-400 font-bold hover:bg-blue-50 dark:hover:bg-blue-900/50\" style={{ textDecoration: 'none' }}>\n {score}\n </Link>\n </Column>\n ))}\n </Row>\n </Section>\n <EmailDivider />\n <Text className=\"text-gray-500 dark:text-gray-400 text-sm text-center\">It only takes a click, and your feedback means the world to us!</Text>\n </EmailLayout>\n );\n};\n\nexport default NPSSurvey;\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;AASO,MAAM,SAAS,GAA6B,CAAC,EAClD,QAAQ,GAAG,MAAM,EACjB,cAAc,GAAG,uCAAuC,EACzD,KAAI;IACH,MAAM,MAAM,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC;IAEjD,QACEA,IAAA,CAAC,WAAW,EAAA,EAAC,WAAW,EAAC,qCAAqC,EAAC,KAAK,EAAC,mBAAmB,EAAA,QAAA,EAAA,CACtFC,IAAC,IAAI,EAAA,EAAC,SAAS,EAAC,uDAAuD,EAAA,QAAA,EAAA,mBAAA,EAAA,CAAyB,EAChGD,IAAA,CAAC,IAAI,EAAA,EAAC,SAAS,EAAC,iEAAiE,EAAA,QAAA,EAAA,CAAA,KAAA,EAC3E,QAAQ,EAAA,yJAAA,CAAA,EAAA,CACP,EAEPA,IAAA,CAAC,OAAO,EAAA,EAAC,SAAS,EAAC,6FAA6F,EAAA,QAAA,EAAA,CAC9GC,GAAA,CAAC,IAAI,EAAA,EAAC,SAAS,EAAC,yEAAyE,EAAA,QAAA,EAAA,8CAAA,EAAA,CAElF,EACPA,GAAA,CAAC,GAAG,EAAA,EAAC,SAAS,EAAC,aAAa,EAAA,QAAA,EACzB,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,MAChBA,GAAA,CAAC,MAAM,EAAA,EAAa,SAAS,EAAC,QAAQ,EAAA,QAAA,EACpCA,GAAA,CAAC,IAAI,EAAA,EAAC,IAAI,EAAE,CAAA,EAAG,cAAc,CAAA,EAAG,KAAK,CAAA,CAAE,EAAE,SAAS,EAAC,8LAA8L,EAAC,KAAK,EAAE,EAAE,cAAc,EAAE,MAAM,EAAE,EAAA,QAAA,EAChR,KAAK,EAAA,CACD,EAAA,EAHI,KAAK,CAIT,CACV,CAAC,EAAA,CACE,CAAA,EAAA,CACE,EACVA,IAAC,YAAY,EAAA,EAAA,CAAG,EAChBA,GAAA,CAAC,IAAI,EAAA,EAAC,SAAS,EAAC,sDAAsD,EAAA,QAAA,EAAA,iEAAA,EAAA,CAAuE,CAAA,EAAA,CACjI;AAElB;;;;"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../../components/EmailButton.js';
|
|
3
4
|
import { EmailLayout } from '../../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../../node_modules/@react-email/section/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
7
7
|
|
|
8
8
|
const ProductFeedback = ({ link = '#' }) => (jsxs(EmailLayout, { previewText: "Help us build a better product", title: "Product Feedback", children: [jsx(Text, { className: "text-2xl font-bold text-gray-900 dark:text-white mb-4", children: "Have your say!" }), jsx(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: "We are planning our roadmap for the next quarter, and we want your input! Take our quick survey to vote on the features you want to see most." }), jsx(Section, { className: "text-center mb-6", children: jsx(EmailButton, { href: link, children: "Take the Survey" }) })] }));
|
|
9
9
|
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Text, Section } from '@react-email/components';
|
|
2
3
|
import { EmailButton } from '../../components/EmailButton.js';
|
|
3
4
|
import { EmailLayout } from '../../components/EmailLayout.js';
|
|
4
5
|
import 'react';
|
|
5
|
-
import
|
|
6
|
-
import { Section } from '../../../../node_modules/@react-email/section/dist/index.js';
|
|
6
|
+
import '@react-email/render';
|
|
7
7
|
|
|
8
8
|
const ClientReferenceRequest = ({ clientName = 'Alex', senderName = 'Jordan', reviewLink = 'https://g2.com/example/review' }) => {
|
|
9
9
|
return (jsxs(EmailLayout, { previewText: "Would you mind sharing your experience?", title: "Review Request", children: [jsxs(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-4", children: ["Hi ", clientName, ","] }), jsx(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: "I hope you're having a great week! I'm reaching out because you've been one of our most successful clients, and we truly value our partnership." }), jsx(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed mb-6", children: "Would you be open to writing a quick review of your experience working with us? It only takes a couple of minutes and helps us immensely." }), jsx(Section, { className: "mb-6", children: jsx(EmailButton, { href: reviewLink, children: "Leave a Review" }) }), jsxs(Text, { className: "text-gray-700 dark:text-gray-300 text-base leading-relaxed", children: ["Thanks so much for your support!", jsx("br", {}), senderName] })] }));
|