diff --git a/apps/demo/emails/magic-links/aws-verify-email.tsx b/apps/demo/emails/magic-links/aws-verify-email.tsx index ab93659440..8155680ee3 100644 --- a/apps/demo/emails/magic-links/aws-verify-email.tsx +++ b/apps/demo/emails/magic-links/aws-verify-email.tsx @@ -9,8 +9,10 @@ import { Link, Preview, Section, + Tailwind, Text, } from '@react-email/components'; +import tailwindConfig from '../tailwind.config'; interface AWSVerifyEmailProps { verificationCode?: string; @@ -26,59 +28,76 @@ export default function AWSVerifyEmail({ return ( - - AWS Email Verification - -
-
- AWS's Logo -
-
- Verify your email address - - Thanks for starting the new AWS account creation process. We - want to make sure it's really you. Please enter the following - verification code when prompted. If you don't want to - create an account, you can ignore this message. - -
- Verification code - - {verificationCode} - - (This code is valid for 10 minutes) + + + AWS Email Verification + +
+
+ AWS's Logo +
+
+ + Verify your email address + + + Thanks for starting the new AWS account creation process. We + want to make sure it's really you. Please enter the following + verification code when prompted. If you don't want to + create an account, you can ignore this message. + +
+ + Verification code + + + + {verificationCode} + + + (This code is valid for 10 minutes) + +
+
+
+
+ + Amazon Web Services will never email you and ask you to + disclose or verify your password, credit card, or banking + account number.
-
-
- - Amazon Web Services will never email you and ask you to disclose - or verify your password, credit card, or banking account number. - -
-
- - This message was produced and distributed by Amazon Web Services, - Inc., 410 Terry Ave. North, Seattle, WA 98109. Β© 2022, Amazon Web - Services, Inc.. All rights reserved. AWS is a registered trademark - of{' '} - - Amazon.com - - , Inc. View our{' '} - - privacy policy - - . - - - + + This message was produced and distributed by Amazon Web Services, + Inc., 410 Terry Ave. North, Seattle, WA 98109. Β© 2022, Amazon Web + Services, Inc.. All rights reserved. AWS is a registered trademark + of{' '} + + Amazon.com + + , Inc. View our{' '} + + privacy policy + + . + + + + ); } @@ -86,90 +105,3 @@ export default function AWSVerifyEmail({ AWSVerifyEmail.PreviewProps = { verificationCode: '596853', } satisfies AWSVerifyEmailProps; - -const main = { - backgroundColor: '#fff', - color: '#212121', -}; - -const container = { - padding: '20px', - margin: '0 auto', - backgroundColor: '#eee', -}; - -const h1 = { - color: '#333', - fontFamily: - "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif", - fontSize: '20px', - fontWeight: 'bold', - marginBottom: '15px', -}; - -const link = { - color: '#2754C5', - fontFamily: - "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif", - fontSize: '14px', - textDecoration: 'underline', -}; - -const text = { - color: '#333', - fontFamily: - "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif", - fontSize: '14px', - margin: '24px 0', -}; - -const imageSection = { - backgroundColor: '#252f3d', - display: 'flex', - padding: '20px 0', - alignItems: 'center', - justifyContent: 'center', -}; - -const coverSection = { backgroundColor: '#fff' }; - -const upperSection = { padding: '25px 35px' }; - -const lowerSection = { padding: '25px 35px' }; - -const footerText = { - ...text, - fontSize: '12px', - padding: '0 20px', -}; - -const verifyText = { - ...text, - margin: 0, - fontWeight: 'bold', - textAlign: 'center' as const, -}; - -const codeText = { - ...text, - fontWeight: 'bold', - fontSize: '36px', - margin: '10px 0', - textAlign: 'center' as const, -}; - -const validityText = { - ...text, - margin: '0px', - textAlign: 'center' as const, -}; - -const verificationSection = { - display: 'flex', - alignItems: 'center', - justifyContent: 'center', -}; - -const mainText = { ...text, marginBottom: '14px' }; - -const cautionText = { ...text, margin: '0px' }; diff --git a/apps/demo/emails/magic-links/linear-login-code.tsx b/apps/demo/emails/magic-links/linear-login-code.tsx index 6c6265daf6..1e94cb076d 100644 --- a/apps/demo/emails/magic-links/linear-login-code.tsx +++ b/apps/demo/emails/magic-links/linear-login-code.tsx @@ -10,8 +10,10 @@ import { Link, Preview, Section, + Tailwind, Text, } from '@react-email/components'; +import tailwindConfig from '../tailwind.config'; interface LinearLoginCodeEmailProps { validationCode?: string; @@ -26,33 +28,46 @@ export const LinearLoginCodeEmail = ({ }: LinearLoginCodeEmailProps) => ( - - Your login code for Linear - - Linear - Your login code for Linear -
- -
- - This link and code will only be valid for the next 5 minutes. If the - link does not work, you can use the login verification code directly: - - {validationCode} -
- - Linear - - - + + + Your login code for Linear + + Linear + + Your login code for Linear + +
+ +
+ + This link and code will only be valid for the next 5 minutes. If the + link does not work, you can use the login verification code + directly: + + + {validationCode} + +
+ + Linear + + + + ); @@ -61,74 +76,3 @@ LinearLoginCodeEmail.PreviewProps = { } as LinearLoginCodeEmailProps; export default LinearLoginCodeEmail; - -const logo = { - borderRadius: 21, - width: 42, - height: 42, -}; - -const main = { - backgroundColor: '#ffffff', - fontFamily: - '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif', -}; - -const container = { - margin: '0 auto', - padding: '20px 0 48px', - maxWidth: '560px', -}; - -const heading = { - fontSize: '24px', - letterSpacing: '-0.5px', - lineHeight: '1.3', - fontWeight: '400', - color: '#484848', - padding: '17px 0 0', -}; - -const paragraph = { - margin: '0 0 15px', - fontSize: '15px', - lineHeight: '1.4', - color: '#3c4149', -}; - -const buttonContainer = { - padding: '27px 0 27px', -}; - -const button = { - backgroundColor: '#5e6ad2', - borderRadius: '3px', - fontWeight: '600', - color: '#fff', - fontSize: '15px', - textDecoration: 'none', - textAlign: 'center' as const, - display: 'block', - padding: '11px 23px', -}; - -const reportLink = { - fontSize: '14px', - color: '#b4becc', -}; - -const hr = { - borderColor: '#dfe1e4', - margin: '42px 0 26px', -}; - -const code = { - fontFamily: 'monospace', - fontWeight: '700', - padding: '1px 4px', - backgroundColor: '#dfe1e4', - letterSpacing: '-0.3px', - fontSize: '21px', - borderRadius: '4px', - color: '#3c4149', -}; diff --git a/apps/demo/emails/magic-links/notion-magic-link.tsx b/apps/demo/emails/magic-links/notion-magic-link.tsx index 1fe5774d4c..ddbebb400b 100644 --- a/apps/demo/emails/magic-links/notion-magic-link.tsx +++ b/apps/demo/emails/magic-links/notion-magic-link.tsx @@ -7,8 +7,10 @@ import { Img, Link, Preview, + Tailwind, Text, } from '@react-email/components'; +import tailwindConfig from '../tailwind.config'; interface NotionMagicLinkEmailProps { loginCode?: string; @@ -23,66 +25,54 @@ export const NotionMagicLinkEmail = ({ }: NotionMagicLinkEmailProps) => ( - - Log in with this magic link - - Login - - Click here to log in with this magic link - - - Or, copy and paste this temporary login code: - - {loginCode} - - If you didn't try to login, you can safely ignore this email. - - - Hint: You can set a permanent password in Settings & members β†’ My - account. - - Notion's Logo - + + + Log in with this magic link + + + Login + - Notion.so + Click here to log in with this magic link - , the all-in-one-workspace -
- for your notes, tasks, wikis, and databases. - - - + + Or, copy and paste this temporary login code: + + + {loginCode} + + + If you didn't try to login, you can safely ignore this email. + + + Hint: You can set a permanent password in Settings & members β†’ My + account. + + Notion's Logo + + + Notion.so + + , the all-in-one-workspace +
+ for your notes, tasks, wikis, and databases. + + + + ); @@ -91,59 +81,3 @@ NotionMagicLinkEmail.PreviewProps = { } as NotionMagicLinkEmailProps; export default NotionMagicLinkEmail; - -const main = { - backgroundColor: '#ffffff', -}; - -const container = { - paddingLeft: '12px', - paddingRight: '12px', - margin: '0 auto', -}; - -const h1 = { - color: '#333', - fontFamily: - "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif", - fontSize: '24px', - fontWeight: 'bold', - margin: '40px 0', - padding: '0', -}; - -const link = { - color: '#2754C5', - fontFamily: - "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif", - fontSize: '14px', - textDecoration: 'underline', -}; - -const text = { - color: '#333', - fontFamily: - "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif", - fontSize: '14px', - margin: '24px 0', -}; - -const footer = { - color: '#898989', - fontFamily: - "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif", - fontSize: '12px', - lineHeight: '22px', - marginTop: '12px', - marginBottom: '24px', -}; - -const code = { - display: 'inline-block', - padding: '16px 4.5%', - width: '90.5%', - backgroundColor: '#f4f4f4', - borderRadius: '5px', - border: '1px solid #eee', - color: '#333', -}; diff --git a/apps/demo/emails/magic-links/plaid-verify-identity.tsx b/apps/demo/emails/magic-links/plaid-verify-identity.tsx index cd967538d3..1be7fe2b58 100644 --- a/apps/demo/emails/magic-links/plaid-verify-identity.tsx +++ b/apps/demo/emails/magic-links/plaid-verify-identity.tsx @@ -7,8 +7,10 @@ import { Img, Link, Section, + Tailwind, Text, } from '@react-email/components'; +import tailwindConfig from '../tailwind.config'; interface PlaidVerifyIdentityEmailProps { validationCode?: string; @@ -23,33 +25,46 @@ export const PlaidVerifyIdentityEmail = ({ }: PlaidVerifyIdentityEmailProps) => ( - - - Plaid - Verify Your Identity - - Enter the following code to finish linking Venmo. - -
- {validationCode} -
- Not expecting this email? - - Contact{' '} - - login@plaid.com - {' '} - if you did not request this code. + + + + Plaid + + Verify Your Identity + + + Enter the following code to finish linking Venmo. + +
+ + {validationCode} + +
+ + Not expecting this email? + + + Contact{' '} + + login@plaid.com + {' '} + if you did not request this code. + + + + Securely powered by Plaid. - - Securely powered by Plaid. - + + ); @@ -58,99 +73,3 @@ PlaidVerifyIdentityEmail.PreviewProps = { } as PlaidVerifyIdentityEmailProps; export default PlaidVerifyIdentityEmail; - -const main = { - backgroundColor: '#ffffff', - fontFamily: 'HelveticaNeue,Helvetica,Arial,sans-serif', -}; - -const container = { - backgroundColor: '#ffffff', - border: '1px solid #eee', - borderRadius: '5px', - boxShadow: '0 5px 10px rgba(20,50,70,.2)', - marginTop: '20px', - maxWidth: '360px', - margin: '0 auto', - padding: '68px 0 130px', -}; - -const logo = { - margin: '0 auto', -}; - -const tertiary = { - color: '#0a85ea', - fontSize: '11px', - fontWeight: 700, - fontFamily: 'HelveticaNeue,Helvetica,Arial,sans-serif', - height: '16px', - letterSpacing: '0', - lineHeight: '16px', - margin: '16px 8px 8px 8px', - textTransform: 'uppercase' as const, - textAlign: 'center' as const, -}; - -const secondary = { - color: '#000', - display: 'inline-block', - fontFamily: 'HelveticaNeue-Medium,Helvetica,Arial,sans-serif', - fontSize: '20px', - fontWeight: 500, - lineHeight: '24px', - marginBottom: '0', - marginTop: '0', - textAlign: 'center' as const, -}; - -const codeContainer = { - background: 'rgba(0,0,0,.05)', - borderRadius: '4px', - margin: '16px auto 14px', - verticalAlign: 'middle', - width: '280px', -}; - -const code = { - color: '#000', - fontFamily: 'HelveticaNeue-Bold', - fontSize: '32px', - fontWeight: 700, - letterSpacing: '6px', - lineHeight: '40px', - paddingBottom: '8px', - paddingTop: '8px', - margin: '0 auto', - display: 'block', - textAlign: 'center' as const, -}; - -const paragraph = { - color: '#444', - fontSize: '15px', - fontFamily: 'HelveticaNeue,Helvetica,Arial,sans-serif', - letterSpacing: '0', - lineHeight: '23px', - padding: '0 40px', - margin: '0', - textAlign: 'center' as const, -}; - -const link = { - color: '#444', - textDecoration: 'underline', -}; - -const footer = { - color: '#000', - fontSize: '12px', - fontWeight: 800, - letterSpacing: '0', - lineHeight: '23px', - margin: '0', - marginTop: '20px', - fontFamily: 'HelveticaNeue,Helvetica,Arial,sans-serif', - textAlign: 'center' as const, - textTransform: 'uppercase' as const, -}; diff --git a/apps/demo/emails/magic-links/raycast-magic-link.tsx b/apps/demo/emails/magic-links/raycast-magic-link.tsx index 5a8e7c1b4e..1d091f0d1c 100644 --- a/apps/demo/emails/magic-links/raycast-magic-link.tsx +++ b/apps/demo/emails/magic-links/raycast-magic-link.tsx @@ -9,8 +9,10 @@ import { Link, Preview, Section, + Tailwind, Text, } from '@react-email/components'; +import tailwindConfig from '../tailwind.config'; interface RaycastMagicLinkEmailProps { magicLink?: string; @@ -25,47 +27,52 @@ export const RaycastMagicLinkEmail = ({ }: RaycastMagicLinkEmailProps) => ( - - Log in with this magic link. - - Raycast - πŸͺ„ Your magic link -
- - - πŸ‘‰ Click here to sign in πŸ‘ˆ - + + + Log in with this magic link. + + Raycast + + πŸͺ„ Your magic link + +
+ + + πŸ‘‰ Click here to sign in πŸ‘ˆ + + + + If you didn't request this, please ignore this email. + +
+ + Best, +
- Raycast Team - - If you didn't request this, please ignore this email. +
+ + + Raycast Technologies Inc. -
- - Best, -
- Raycast Team - -
- - Raycast Technologies Inc. - - 2093 Philadelphia Pike #3222, Claymont, DE 19703 - - - + + 2093 Philadelphia Pike #3222, Claymont, DE 19703 + + + + ); @@ -74,47 +81,3 @@ RaycastMagicLinkEmail.PreviewProps = { } as RaycastMagicLinkEmailProps; export default RaycastMagicLinkEmail; - -const main = { - backgroundColor: '#ffffff', - fontFamily: - '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif', -}; - -const container = { - margin: '0 auto', - padding: '20px 25px 48px', - backgroundImage: 'url("/static/raycast-bg.png")', - backgroundPosition: 'bottom', - backgroundRepeat: 'no-repeat, no-repeat', -}; - -const heading = { - fontSize: '28px', - fontWeight: 'bold', - marginTop: '48px', -}; - -const body = { - margin: '24px 0', -}; - -const paragraph = { - fontSize: '16px', - lineHeight: '26px', -}; - -const link = { - color: '#FF6363', -}; - -const hr = { - borderColor: '#dddddd', - marginTop: '48px', -}; - -const footer = { - color: '#8898aa', - fontSize: '12px', - marginLeft: '4px', -}; diff --git a/apps/demo/emails/magic-links/slack-confirm.tsx b/apps/demo/emails/magic-links/slack-confirm.tsx index a9269416ac..01c3a7f546 100644 --- a/apps/demo/emails/magic-links/slack-confirm.tsx +++ b/apps/demo/emails/magic-links/slack-confirm.tsx @@ -10,8 +10,10 @@ import { Preview, Row, Section, + Tailwind, Text, } from '@react-email/components'; +import tailwindConfig from '../tailwind.config'; interface SlackConfirmEmailProps { validationCode?: string; @@ -26,121 +28,127 @@ export const SlackConfirmEmail = ({ }: SlackConfirmEmailProps) => ( - - Confirm your email address - -
- Slack -
- Confirm your email address - - Your confirmation code is below - enter it in your open browser window - and we'll help you get signed in. - + + + Confirm your email address + +
+ Slack +
+ + Confirm your email address + + + Your confirmation code is below - enter it in your open browser + window and we'll help you get signed in. + -
- {validationCode} -
+
+ + {validationCode} + +
- - If you didn't request this email, there's nothing to worry about, you - can safely ignore it. - + + If you didn't request this email, there's nothing to worry about, + you can safely ignore it. + -
- - - Slack - - - - Slack - - +
+ + Slack - - - Slack - - - -
- -
- - Our blog - -    |    - - Policies - -    |    - - Help center - -    |    - - Slack Community - - - Β©2022 Slack Technologies, LLC, a Salesforce company.
- 500 Howard Street, San Francisco, CA 94105, USA
-
- All rights reserved. - -
- - + + + + Slack + + + Slack + + + Slack + + + +
+ +
+ + Our blog + +    |    + + Policies + +    |    + + Help center + +    |    + + Slack Community + + + Β©2022 Slack Technologies, LLC, a Salesforce company.
+ 500 Howard Street, San Francisco, CA 94105, USA
+
+ All rights reserved. + +
+ + + ); @@ -149,77 +157,3 @@ SlackConfirmEmail.PreviewProps = { } as SlackConfirmEmailProps; export default SlackConfirmEmail; - -const footerText = { - fontSize: '12px', - color: '#b7b7b7', - lineHeight: '15px', - textAlign: 'left' as const, - marginBottom: '50px', -}; - -const footerLink = { - color: '#b7b7b7', - textDecoration: 'underline', -}; - -const footerLogos = { - marginBottom: '32px', - paddingLeft: '8px', - paddingRight: '8px', -}; - -const socialMediaIcon = { - display: 'inline', - marginLeft: '8px', -}; - -const main = { - backgroundColor: '#ffffff', - margin: '0 auto', - fontFamily: - "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif", -}; - -const container = { - margin: '0 auto', - padding: '0px 20px', -}; - -const logoContainer = { - marginTop: '32px', -}; - -const h1 = { - color: '#1d1c1d', - fontSize: '36px', - fontWeight: '700', - margin: '30px 0', - padding: '0', - lineHeight: '42px', -}; - -const heroText = { - fontSize: '20px', - lineHeight: '28px', - marginBottom: '30px', -}; - -const codeBox = { - background: 'rgb(245, 244, 245)', - borderRadius: '4px', - marginBottom: '30px', - padding: '40px 10px', -}; - -const confirmationCodeText = { - fontSize: '30px', - textAlign: 'center' as const, - verticalAlign: 'middle', -}; - -const text = { - color: '#000', - fontSize: '14px', - lineHeight: '24px', -}; diff --git a/apps/demo/emails/newsletters/codepen-challengers.tsx b/apps/demo/emails/newsletters/codepen-challengers.tsx index d72e903041..af35271c89 100644 --- a/apps/demo/emails/newsletters/codepen-challengers.tsx +++ b/apps/demo/emails/newsletters/codepen-challengers.tsx @@ -11,8 +11,10 @@ import { Preview, Row, Section, + Tailwind, Text, } from '@react-email/components'; +import tailwindConfig from '../tailwind.config'; const baseUrl = process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` @@ -21,398 +23,263 @@ const baseUrl = process.env.VERCEL_URL export const CodepenChallengersEmail = () => ( - - #CodePenChallenge: Cubes -
- codepen -
- - - View this Challenge on CodePen - - - - This week: #CodePenChallenge:{' '} - Cubes - - -
- The Shape challenge continues! - - - Last week, we kicked things off with round shapes. We "rounded" up - the Pens from week one in our{' '} - #CodePenChallenge: Round collection. + + + #CodePenChallenge: Cubes +
+ codepen +
+ + + + View this Challenge on CodePen + - This week, we move on to cubes 🧊 + + This week: #CodePenChallenge:{' '} + Cubes + + +
+ The Shape challenge continues! + + + Last week, we kicked things off with round shapes. We "rounded" up + the Pens from week one in our{' '} + + #CodePenChallenge: Round + {' '} + collection. + - - Creating cubes in the browser is all about mastery of illusion. Take - control of perspective and shadows and you can make the magic of 3D - on a flat screen πŸ§™ - + This week, we move on to cubes 🧊 - - This week is a fun chance to work on your CSS shape-building skills, - or dig into a 3D JavaScript library like Three.js. - + + Creating cubes in the browser is all about mastery of illusion. + Take control of perspective and shadows and you can make the magic + of 3D on a flat screen πŸ§™ + - - This week's starter template features an ice cube emoji to help - inspire a "cool" idea for your Pen. As always, the template is just - as jumping off point. Feel free to incorporate the 🧊 in your - creation, add more elements, or freeze it out completely and start - over from scratch! - + + This week is a fun chance to work on your CSS shape-building + skills, or dig into a 3D JavaScript library like Three.js. + - - πŸ’ͺ Your Challenge:{' '} - - create a Pen that includes cube shapes. - - + + This week's starter template features an ice cube emoji to help + inspire a "cool" idea for your Pen. As always, the template is + just as jumping off point. Feel free to incorporate the 🧊 in your + creation, add more elements, or freeze it out completely and start + over from scratch! + - codepen + + πŸ’ͺ Your Challenge:{' '} + + create a Pen that includes cube shapes. + + -
codepen - - CodePen PRO combines a bunch of features that can help any - front-end designer or developer at any experience level. - - - +
+ codepen + + + CodePen PRO combines a bunch of features that can help any + front-end designer or developer at any experience level. + + + +
-
- - - To participate:{' '} - Create a Pen β†’ and tag it{' '} - - codepenchallenge - {' '} - and - - {' '} - cpc-cubes - - . We'll be watching and gathering the Pens into a Collection, and - sharing on Twitter and{' '} - Instagram (Use the #CodePenChallenge tag - on Twitter and Instagram as well). - -
- - - IDEAS! - -
- 🌟 - - This week we move from 2 dimensions to three! Maybe you could - exercise your perspective in CSS - to create a 3D cube. Or, you can try out creating 3D shapes in - JavaScript, using WebGL or - building a Three.js scene. - -
- -
- 🌟 - - There's more to cubes than just six square sides. There are - variations on the cube that could be fun to play with this - week: cuboid shapes are - hexahedrons with faces that aren't always squares. And if you - want to really push the boundaries of shape, consider the 4 - dimensional tesseract! - -
- -
- 🌟 - - Here's a mind-bending idea that can combine the round shapes - from week one with this week's cube theme:{' '} - Spherical Cubes 😳 Solving - longstanding mathematical mysteries is probably outside the - scope of a CodePen challenge, but you could use front-end - tools to explore fitting spheres into cubes, or vice-versa. - -
- - - RESOURCES! - -
- πŸ“– - - Learn all about{' '} - How CSS Perspective Works and - how to build a 3D CSS cube from scratch in Amit Sheen's - in-depth tutorial for CSS-Tricks. Or, check out stunning - examples of WebGL cubes from Matthias Hurrle:{' '} - Just Ice and{' '} - Posing. - -
+ + To participate:{' '} + Create a Pen β†’{' '} + and tag it{' '} + + codepenchallenge + {' '} + and + + {' '} + cpc-cubes + + . We'll be watching and gathering the Pens into a Collection, and + sharing on{' '} + Twitter and{' '} + Instagram (Use + the #CodePenChallenge tag on Twitter and Instagram as well). + -
- πŸ“– - - Want to go beyond the square cube? Draw inspiration from - EntropyReversed's{' '} - Pulsating Tesseract, Josetxu's{' '} - Rainbow Cuboid Loader, or Ana - Tudor's{' '} - Pure CSS cuboid jellyfish. +
+ + + IDEAS! + +
+ 🌟 + + This week we move from 2 dimensions to three! Maybe you + could exercise your{' '} + + perspective + {' '} + in CSS to create a 3D cube. Or, you can try out creating 3D + shapes in JavaScript, using{' '} + WebGL or + building a{' '} + + Three.js scene + + . + +
+ +
+ 🌟 + + There's more to cubes than just six square sides. There are + variations on the cube that could be fun to play with this + week:{' '} + + cuboid shapes + {' '} + are hexahedrons with faces that aren't always squares. And + if you want to really push the boundaries of shape, consider + the 4 dimensional{' '} + + tesseract! + + +
+ +
+ 🌟 + + Here's a mind-bending idea that can combine the round shapes + from week one with this week's cube theme:{' '} + + Spherical Cubes + {' '} + 😳 Solving longstanding mathematical mysteries is probably + outside the scope of a CodePen challenge, but you could use + front-end tools to explore fitting spheres into cubes, or + vice-versa. + +
+ + + + RESOURCES! -
-
- πŸ“– - - Did that spherical cubes concept pique your interest? Explore - Ryan Mulligan's Cube Sphere, - Munir Safi's{' '} - - 3D Sphere to Cube Animation With Virtual Trackball - {' '} - and Ana Tudor's{' '} - Infinitely unpack prism for more - mindbending cube concepts that test the boundaries of how - shapes interact with each other. - -
- - -
+
+ πŸ“– + + Learn all about{' '} + + How CSS Perspective Works + {' '} + and how to build a 3D CSS cube from scratch in Amit Sheen's + in-depth tutorial for CSS-Tricks. Or, check out stunning + examples of WebGL cubes from Matthias Hurrle:{' '} + Just Ice{' '} + and{' '} + Posing. + +
+ +
+ πŸ“– + + Want to go beyond the square cube? Draw inspiration from + EntropyReversed's{' '} + + Pulsating Tesseract + + , Josetxu's{' '} + + Rainbow Cuboid Loader + + , or Ana Tudor's{' '} + + Pure CSS cuboid jellyfish + + . + +
+ +
+ πŸ“– + + Did that spherical cubes concept pique your interest? + Explore Ryan Mulligan's{' '} + + Cube Sphere + + , Munir Safi's{' '} + + 3D Sphere to Cube Animation With Virtual Trackball + {' '} + and Ana Tudor's{' '} + + Infinitely unpack prism + {' '} + for more mindbending cube concepts that test the boundaries + of how shapes interact with each other. + +
+ + +
-
- -
+
+ +
-
- - You can adjust your{' '} - email preferences any time, or{' '} - instantly opt out of emails of this - kind. Need help with anything? Hit up{' '} - support. - -
- - +
+ + You can adjust your{' '} + + email preferences + {' '} + any time, or{' '} + + instantly opt out + {' '} + of emails of this kind. Need help with anything? Hit up{' '} + + support + + . + +
+ + + ); export default CodepenChallengersEmail; - -const main = { - fontFamily: '"Google Sans",Roboto,RobotoDraft,Helvetica,Arial,sans-serif', - backgroundColor: '#505050', - margin: '0', -}; - -const imgHeader = { - margin: 'auto', - maxWidth: '100%', -}; - -const imgCube = { - maxWidth: '100%', -}; - -const header = { - width: '100%', - backgroundColor: '#191919', - margin: '0 auto', - paddingBottom: '30px', - zIndex: '999', -}; - -const container = { - margin: '0 auto', - width: '648px', - maxWidth: '100%', - position: 'relative' as const, -}; - -const challengeLink = { - backgroundColor: '#505050', - textAlign: 'center' as const, - padding: '10px 0', - fontSize: '13px', - position: 'absolute' as const, - width: '648px', - maxWidth: '100%', - top: '-28px', - margin: '0 0 16px 0', -}; - -const link = { - color: '#fff', - cursor: 'pointer', -}; - -const blueLink = { - color: '#15c', - cursor: 'pointer', -}; - -const heading = { - background: '#f0d361', - padding: '30px', - color: '#191919', - fontWeight: '400', - marginBottom: '0', -}; - -const section = { - margin: '0', - background: '#fff', - padding: '0 24px', -}; - -const yellowSection = { - background: '#f5d247', - padding: '30px', - fontSize: '18px', - lineHeight: '1.5', -}; - -const text = { - fontSize: '16px', -}; - -const cubeText = { fontSize: '32px', margin: '4px 0 0 0' }; - -const yourChallenge = { - fontSize: '16px', - border: '6px solid #ebd473', - padding: '20px', - margin: '0 0 40px 0', -}; - -const sectionPro = { - marginTop: '40px', - marginBottom: '24px', - textAlign: 'center' as const, - background: '#0b112a', - color: '#fff', - padding: '35px 20px 30px 20px', - border: '6px solid #2138c6', -}; - -const imagePro = { margin: '0 auto 30px auto' }; - -const button = { - background: '#2138c6', - color: '#fff', - border: '0', - fontSize: '15px', - lineHeight: '18px', - cursor: 'pointer', - borderRadius: '4px', - padding: '12px', -}; - -const resourcesTitle = { - fontWeight: '900', - lineHeight: '1.1', - marginTop: '-40px', - fontSize: '18px', -}; - -const ideasTitle = { - fontWeight: '900', - lineHeight: '1.1', - fontSize: '18px', -}; - -const ideas = { - width: '50%', - paddingRight: '10px', -}; - -const resources = { - width: '50%', - paddingLeft: '10px', -}; - -const card = { - padding: '20px', - margin: '0 0 20px 0', - borderRadius: '10px', - fontSize: '36px', - textAlign: 'center' as const, -}; - -const yellowCard = { - ...card, - background: '#fff4c8', - border: '1px solid #f4d247', -}; - -const blueCard = { - ...card, - background: '#d9f6ff', - border: '1px solid #92bfd0', -}; - -const textCard = { - fontSize: '13px', - textAlign: 'left' as const, -}; - -const goToChallenge = { - margin: '40px 0 120px 0', - textAlign: 'center' as const, -}; - -const footerButton = { - fontSize: '26px', - color: '#15c', - background: '#222', - borderRadius: '4px', - fontWeight: 'bold', - cursor: 'pointer', - padding: '15px 30px', -}; - -const footer = { - background: '#fff', - color: '#505050', - padding: '0 24px', - marginBottom: '48px', -}; - -const footerText = { - fontSize: '13px', -}; - -const footerLink = { - textDecoration: 'underline', - color: '#505050', - cursor: 'pointer', -}; diff --git a/apps/demo/emails/newsletters/google-play-policy-update.tsx b/apps/demo/emails/newsletters/google-play-policy-update.tsx index 079e50de8d..0db7403682 100644 --- a/apps/demo/emails/newsletters/google-play-policy-update.tsx +++ b/apps/demo/emails/newsletters/google-play-policy-update.tsx @@ -10,8 +10,10 @@ import { Preview, Row, Section, + Tailwind, Text, } from '@react-email/components'; +import tailwindConfig from '../tailwind.config'; const baseUrl = process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` @@ -20,171 +22,167 @@ const baseUrl = process.env.VERCEL_URL export const GooglePlayPolicyUpdateEmail = () => ( - - Google Play developers - -
- - - Google Play developers header blue transparent - Google Play - - -
- -
-
- DEVELOPER UPDATE - Hello Google Play Developer, - - We strive to make Google Play a safe and trusted experience for - users. - - - We've added clarifications to our{' '} - - Target API Level policy - - . Because this is a clarification, our enforcement standards and - practices for this policy remain the same. - -
-
- - We’re noting exceptions to the{' '} - - Target API Level policy - - , which can be found in our updated{' '} - - Help Center article. - - These exceptions include permanently private apps and apps that - target automotive or wearables form factors and are bundled within - the same package.{' '} - - Learn more - - -
-
- - We’re also extending the deadline to give you more time to adjust to - these changes. Now, apps that target API level 29 or below will - start experiencing reduced distribution starting Jan 31, 2023{' '} - instead of Nov 1, 2022. If you need more time to update your app, - you can request an extension to keep your app discoverable to all - users until May 1, 2023. - -
-
- -
- Thank you, - - The Google Play team - -
- -
- - Connect with us - - - - + + + Google Play developers + +
+ + Google Play developers header blue transparent - - - - Google Play + + +
+ +
+
+ + DEVELOPER UPDATE + + + Hello Google Play Developer, + + + We strive to make Google Play a safe and trusted experience for + users. + + + We've added clarifications to our{' '} + + Target API Level policy - - - - + . Because this is a clarification, our enforcement standards and + practices for this policy remain the same. + +
+
+ + We're noting exceptions to the{' '} + + Target API Level policy + + , which can be found in our updated{' '} + + Help Center article. - - - - - -
- -
- - Β© 2022 Google LLC 1600 Amphitheatre Parkway, Mountain View, CA - 94043, USA - - - You have received this mandatory email service announcement to - update you about important changes to your Google Play Developer - account. - -
- - + These exceptions include permanently private apps and apps that + target automotive or wearables form factors and are bundled within + the same package.{' '} + + Learn more + + +
+
+ + We're also extending the deadline to give you more time to adjust + to these changes. Now, apps that target API level 29 or below will + start experiencing reduced distribution starting{' '} + Jan 31, 2023 instead of Nov 1, 2022. If you need more time + to update your app, you can request an extension to keep your app + discoverable to all users until May 1, 2023. + +
+
+ +
+ + Thank you, + + + The Google Play team + +
+ +
+ + + Connect with us + + + + + + + + + + + + + + + + + + + + + + +
+ +
+ + Β© 2022 Google LLC 1600 Amphitheatre Parkway, Mountain View, CA + 94043, USA + + + You have received this mandatory email service announcement to + update you about important changes to your Google Play Developer + account. + +
+ + + ); export default GooglePlayPolicyUpdateEmail; -const main = { - backgroundColor: '#dbddde', - fontFamily: - '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif', -}; - const sectionLogo = { padding: '0 40px', }; diff --git a/apps/demo/emails/newsletters/stack-overflow-tips.tsx b/apps/demo/emails/newsletters/stack-overflow-tips.tsx index f7819747ea..465cd8c278 100644 --- a/apps/demo/emails/newsletters/stack-overflow-tips.tsx +++ b/apps/demo/emails/newsletters/stack-overflow-tips.tsx @@ -11,8 +11,10 @@ import { Preview, Row, Section, + Tailwind, Text, } from '@react-email/components'; +import tailwindConfig from '../tailwind.config'; interface StackOverflowTipsEmailProps { tips?: { id: number; description: string }[]; @@ -47,107 +49,143 @@ export const StackOverflowTipsEmail = ({ }: StackOverflowTipsEmailProps) => ( - - Stack overflow tips for searching - -
- -
- -
- - - - Find what you want, faster - - - Tips and tricks for searching on Stack Overflow - - - - - - -
+ + + Stack overflow tips for searching + +
+ +
-
- - Searching for solutions - - - With more than 18 million questions, it's possible that someone has - already provided a solution to the problem you're facing.{' '} - +
+ + + + Find what you want, faster + + + Tips and tricks for searching on Stack Overflow + + + + + + +
-
+
+ + Searching for solutions + + + With more than 18 million questions, it's possible that someone + has already provided a solution to the problem you're facing.{' '} + + +
+ + + Use the search bar at the top of the page to find what you need + + + Here are a few simple search tips to get you started: + +
    + {tips.map((tip) => ( +
  • + + {tip.description} + +
    • + ))} +
+ + + The more information you can put in the search bar, the more + likely you will be to either find the answer you need or feel + confident that no one else has asked the question before. + + +
+ + + Take a break and read about the worst coder in the world + + +
+ + I need a break + +
+
+ - - Use the search bar at the top of the page to find what you need - - - Here are a few simple search tips to get you started: +
+ + You're receiving this email because your Stack Overflow activity + triggered this tip or reminder. -
    - {tips.map((tip) => ( -
  • - {tip.description} -
    • - ))} -
- - The more information you can put in the search bar, the more likely - you will be to either find the answer you need or feel confident - that no one else has asked the question before. + + Unsubscribe from emails like this{' '} + + + Edit email settings{' '} + + + Contact us + + + Privacy + + +
+ + + + Stack Overflow, 110 William Street, 28th Floor, New + York, NY 10038 + + + {'<3'} - -
- - - Take a break and read about the worst coder in the world - - -
- - I need a break - -
- - -
- - You're receiving this email because your Stack Overflow activity - triggered this tip or reminder. - - - - Unsubscribe from emails like this{' '} - - - Edit email settings{' '} - - - Contact us - - - Privacy - - -
- - - - Stack Overflow, 110 William Street, 28th Floor, New - York, NY 10038 - - {'<3'} -
- + + ); @@ -156,136 +194,3 @@ StackOverflowTipsEmail.PreviewProps = { } as StackOverflowTipsEmailProps; export default StackOverflowTipsEmail; - -const main = { - backgroundColor: '#f3f3f5', - fontFamily: 'HelveticaNeue,Helvetica,Arial,sans-serif', -}; - -const headerContent = { padding: '20px 30px 15px' }; - -const headerContentTitle = { - color: '#fff', - fontSize: '27px', - fontWeight: 'bold', - lineHeight: '27px', -}; - -const headerContentSubtitle = { - color: '#fff', - fontSize: '17px', -}; - -const headerImageContainer = { - padding: '30px 10px', -}; - -const headerImage = { - maxWidth: '100%', -}; - -const title = { - margin: '0 0 15px', - fontWeight: 'bold', - fontSize: '21px', - lineHeight: '21px', - color: '#0c0d0e', -}; - -const paragraph = { - fontSize: '15px', - lineHeight: '21px', - color: '#3c3f44', -}; - -const divider = { - margin: '30px 0', -}; - -const container = { - width: '680px', - maxWidth: '100%', - margin: '0 auto', - backgroundColor: '#ffffff', -}; - -const footer = { - width: '680px', - maxWidth: '100%', - margin: '32px auto 0 auto', - padding: '0 30px', -}; - -const content = { - padding: '30px 30px 40px 30px', -}; - -const logo = { - display: 'flex', - background: '#f3f3f5', - padding: '20px 30px', -}; - -const header = { - borderRadius: '5px 5px 0 0', - display: 'flex', - flexDireciont: 'column', - backgroundColor: '#2b2d6e', -}; - -const buttonContainer = { - marginTop: '24px', - display: 'block', -}; - -const button = { - backgroundColor: '#0095ff', - border: '1px solid #0077cc', - fontSize: '17px', - lineHeight: '17px', - padding: '13px 17px', - borderRadius: '4px', - maxWidth: '120px', - color: '#fff', -}; - -const footerDivider = { - ...divider, - borderColor: '#d6d8db', -}; - -const footerText = { - fontSize: '12px', - lineHeight: '15px', - color: '#9199a1', - margin: '0', -}; - -const footerLink = { - display: 'inline-block', - color: '#9199a1', - textDecoration: 'underline', - fontSize: '12px', - marginRight: '10px', - marginBottom: '0', - marginTop: '8px', -}; - -const footerAddress = { - margin: '4px 0', - fontSize: '12px', - lineHeight: '15px', - color: '#9199a1', -}; - -const footerHeart = { - borderRadius: '1px', - border: '1px solid #d6d9dc', - padding: '4px 6px 3px 6px', - fontSize: '11px', - lineHeight: '11px', - fontFamily: 'Consolas,monospace', - color: '#e06c77', - maxWidth: 'min-content', - margin: '0 0 32px 0', -}; diff --git a/apps/demo/emails/notifications/github-access-token.tsx b/apps/demo/emails/notifications/github-access-token.tsx index ee85b69b38..adb8d18885 100644 --- a/apps/demo/emails/notifications/github-access-token.tsx +++ b/apps/demo/emails/notifications/github-access-token.tsx @@ -8,8 +8,10 @@ import { Link, Preview, Section, + Tailwind, Text, } from '@react-email/components'; +import tailwindConfig from '../tailwind.config'; interface GithubAccessTokenEmailProps { username?: string; @@ -24,44 +26,51 @@ export const GithubAccessTokenEmail = ({ }: GithubAccessTokenEmailProps) => ( - - - A fine-grained personal access token has been added to your account - - - Github - - - @{username}, a personal access was created on your - account. - - -
- - Hey {username}! - - - A fine-grained personal access token (resend) was - recently added to your account. + + + + A fine-grained personal access token has been added to your account + + + Github + + + @{username}, a personal access was created on your + account. - -
- - Your security audit log ・{' '} - Contact support - +
+ + Hey {username}! + + + A fine-grained personal access token (resend) was + recently added to your account. + + + +
+ + + Your security audit log + {' '} + ・{' '} + Contact support + - - GitHub, Inc. ・88 Colin P Kelly Jr Street ・San Francisco, CA 94107 - - - + + GitHub, Inc. ・88 Colin P Kelly Jr Street ・San Francisco, CA 94107 + + + + ); @@ -70,58 +79,3 @@ GithubAccessTokenEmail.PreviewProps = { } as GithubAccessTokenEmailProps; export default GithubAccessTokenEmail; - -const main = { - backgroundColor: '#ffffff', - color: '#24292e', - fontFamily: - '-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji"', -}; - -const container = { - maxWidth: '480px', - margin: '0 auto', - padding: '20px 0 48px', -}; - -const title = { - fontSize: '24px', - lineHeight: 1.25, -}; - -const section = { - padding: '24px', - border: 'solid 1px #dedede', - borderRadius: '5px', - textAlign: 'center' as const, -}; - -const text = { - margin: '0 0 10px 0', - textAlign: 'left' as const, -}; - -const button = { - fontSize: '14px', - backgroundColor: '#28a745', - color: '#fff', - lineHeight: 1.5, - borderRadius: '0.5em', - padding: '12px 24px', -}; - -const links = { - textAlign: 'center' as const, -}; - -const link = { - color: '#0366d6', - fontSize: '12px', -}; - -const footer = { - color: '#6a737d', - fontSize: '12px', - textAlign: 'center' as const, - marginTop: '60px', -}; diff --git a/apps/demo/emails/notifications/yelp-recent-login.tsx b/apps/demo/emails/notifications/yelp-recent-login.tsx index 5b56a4a219..dc350ae55a 100644 --- a/apps/demo/emails/notifications/yelp-recent-login.tsx +++ b/apps/demo/emails/notifications/yelp-recent-login.tsx @@ -10,8 +10,10 @@ import { Preview, Row, Section, + Tailwind, Text, } from '@react-email/components'; +import tailwindConfig from '../tailwind.config'; interface YelpRecentLoginEmailProps { userFirstName?: string; @@ -39,106 +41,88 @@ export const YelpRecentLoginEmail = ({ return ( - - - Yelp recent login - -
- Yelp logo -
- -
- + + + + Yelp recent login + +
+ Yelp logo +
+ +
+ + Yelp header illustration + + + + + + Hi {userFirstName}, + + + We noticed a recent login to your Yelp account. + + + + Time: + {formattedDate} + + + Device: + {loginDevice} + + + Location: + {loginLocation} + + + *Approximate geographic location based on IP address: + {loginIp} + + + + If this was you, there's nothing else you need to do. + + + If this wasn't you or if you have additional questions, + please see our support page. + + + + + + + + +
+ +
Yelp header illustration - - - - - - Hi {userFirstName}, - - - We noticed a recent login to your Yelp account. - - - - Time: - {formattedDate} - - - Device: - {loginDevice} - - - Location: - {loginLocation} - - - *Approximate geographic location based on IP address: - {loginIp} - - - - If this was you, there's nothing else you need to do. - - - If this wasn't you or if you have additional questions, please - see our support page. - - - - - - - - -
- -
- Yelp footer decoration -
- - - Β© 2022 | Yelp Inc., 350 Mission Street, San Francisco, CA 94105, - U.S.A. | www.yelp.com - - - +
+ + + Β© 2022 | Yelp Inc., 350 Mission Street, San Francisco, CA 94105, + U.S.A. | www.yelp.com + + + + ); }; @@ -152,51 +136,3 @@ YelpRecentLoginEmail.PreviewProps = { } as YelpRecentLoginEmailProps; export default YelpRecentLoginEmail; - -const main = { - backgroundColor: '#fff', - fontFamily: - '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif', -}; - -const paragraph = { - fontSize: 16, -}; - -const logo = { - padding: '30px 20px', -}; - -const buttonContainer = { - textAlign: 'center' as const, -}; - -const button = { - backgroundColor: '#e00707', - borderRadius: 3, - color: '#FFF', - fontWeight: 'bold', - border: '1px solid rgb(0,0,0, 0.1)', - cursor: 'pointer', - display: 'inline-block', - padding: '12px 30px', - textDecoration: 'none', -}; - -const content = { - border: '1px solid rgb(0,0,0, 0.1)', - borderRadius: '3px', - overflow: 'hidden', -}; - -const image = { - maxWidth: '100%', -}; - -const boxInfos = { - padding: '20px', -}; - -const containerImageFooter = { - padding: '45px 0 0 0', -}; diff --git a/apps/demo/emails/receipts/apple-receipt.tsx b/apps/demo/emails/receipts/apple-receipt.tsx index 194a2c1348..0fe12f8992 100644 --- a/apps/demo/emails/receipts/apple-receipt.tsx +++ b/apps/demo/emails/receipts/apple-receipt.tsx @@ -10,8 +10,10 @@ import { Preview, Row, Section, + Tailwind, Text, } from '@react-email/components'; +import tailwindConfig from '../tailwind.config'; const baseUrl = process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` @@ -20,473 +22,313 @@ const baseUrl = process.env.VERCEL_URL export const AppleReceiptEmail = () => ( - - - Apple Receipt - -
- - - Apple Logo - - - - Receipt - - -
-
- - Save 3% on all your Apple purchases with Apple Card. - 1{' '} - - Apply and use in minutes + + + Apple Receipt + +
+ + + Apple Logo + + + + + Receipt + + + +
+
+ + Save 3% on all your Apple purchases with Apple Card. + 1{' '} + + Apply and use in minutes + + 2 + +
+
+ + +
+ + + + APPLE ID + + + alan.turing@gmail.com + + + + + + + + INVOICE DATE + + + 18 Jan 2023 + + + + + + + + ORDER ID + + + ML4F5L8522 + + + + + DOCUMENT NO. + + + 186623754793 + + + +
+ + + + BILLED TO + + + Visa .... 7461 (Apple Pay) + + + Alan Turing + + + 2125 Chestnut St + + + San Francisco, CA 94123 + + USA + + +
+
+ + App Store + +
+
+ + + HBO Max + + + + HBO Max: Stream TV & Movies + + + HBO Max Ad-Free (Monthly) + + + Renews Aug 20, 2023 + + + Write a Review + + + | + + + Report a Problem + + + + + + $14.99 + + + +
+
+
+ + + + TOTAL + + + + + + $14.99 + + + +
+
+
+ + + Apple Card + + +
+
+ + + + Save 3% on all your Apple purchases. + + + +
+
+ + + + Apple Wallet + + Apply and use in minutes + + + + +
+
+ + 1. 3% savings is earned as Daily Cash and is transferred to your + Apple Cash card when transactions post to your Apple Card account. + If you do not have an Apple Cash card, Daily Cash can be applied by + you as a credit on your statement balance. 3% is the total amount of + Daily Cash earned for these purchases. See the Apple Card Customer + Agreement for more details on Daily Cash and qualifying + transactions. + + + 2. Subject to credit approval. + + + To access and use all the features of Apple Card, you must add Apple + Card to Wallet on an iPhone or iPad with iOS or iPadOS 13.2 or + later. Update to the latest version of iOS or iPadOS by going to + Settings > General > Software Update. Tap Download and + Install. + + + Available for qualifying applicants in the United States. + + + Apple Card is issued by Goldman Sachs Bank USA, Salt Lake City + Branch. + + + If you reside in the US territories, please call Goldman Sachs at + 877-255-5923 with questions about Apple Card. + + + Privacy: We use a + + {' '} + Subscriber ID{' '} - 2 + to provide reports to developers. + + + Get help with subscriptions and purchases. + + Visit Apple Support. + + + + Learn how to{' '} + + manage your password preferences + {' '} + for iTunes, Apple Books, and App Store purchases. -
-
- - -
- - - APPLE ID - - alan.turing@gmail.com - - - - - - - INVOICE DATE - 18 Jan 2023 - - - - - - ORDER ID - - ML4F5L8522 - - - - DOCUMENT NO. - 186623754793 - - -
- - - BILLED TO - - Visa .... 7461 (Apple Pay) - - Alan Turing - 2125 Chestnut St - San Francisco, CA 94123 - USA - - -
-
- App Store -
-
- - - HBO Max - - - HBO Max: Stream TV & Movies - HBO Max Ad-Free (Monthly) - Renews Aug 20, 2023 - - Write a Review - - | - - Report a Problem - - - - $14.99 - - -
-
-
- - - TOTAL - - - - $14.99 - - -
-
-
- - - Apple Card - - -
-
- - - Save 3% on all your Apple purchases. - - -
-
- - - + + {' '} + You have the option to stop receiving email receipts for your + subscription renewals. If you have opted out, you can still view + your receipts in your account under Purchase History. To manage + receipts or to opt in again, go to{' '} + Account Settings. + +
+ + Apple Wallet - Apply and use in minutes - - - -
-
- - 1. 3% savings is earned as Daily Cash and is transferred to your Apple - Cash card when transactions post to your Apple Card account. If you do - not have an Apple Cash card, Daily Cash can be applied by you as a - credit on your statement balance. 3% is the total amount of Daily Cash - earned for these purchases. See the Apple Card Customer Agreement for - more details on Daily Cash and qualifying transactions. - - 2. Subject to credit approval. - - To access and use all the features of Apple Card, you must add Apple - Card to Wallet on an iPhone or iPad with iOS or iPadOS 13.2 or later. - Update to the latest version of iOS or iPadOS by going to Settings - > General > Software Update. Tap Download and Install. - - - Available for qualifying applicants in the United States. - - - Apple Card is issued by Goldman Sachs Bank USA, Salt Lake City Branch. - - - If you reside in the US territories, please call Goldman Sachs at - 877-255-5923 with questions about Apple Card. - - - Privacy: We use a - - {' '} - Subscriber ID{' '} - - to provide reports to developers. - - - Get help with subscriptions and purchases. - - Visit Apple Support. - - - - Learn how to{' '} - - manage your password preferences - {' '} - for iTunes, Apple Books, and App Store purchases. - - - - {' '} - You have the option to stop receiving email receipts for your - subscription renewals. If you have opted out, you can still view your - receipts in your account under Purchase History. To manage receipts or - to opt in again, go to{' '} - Account Settings. - -
- - - Apple Card - - -
- - Account Settings β€’{' '} - Terms of Sale β€’{' '} - - Privacy Policy{' '} - - - - Copyright Β© 2023 Apple Inc.
{' '} - All rights reserved - - - + + +
+ + Account Settings β€’{' '} + Terms of Sale β€’{' '} + + Privacy Policy{' '} + + + + Copyright Β© 2023 Apple Inc.
{' '} + All rights reserved + + + + ); export default AppleReceiptEmail; - -const main = { - fontFamily: '"Helvetica Neue",Helvetica,Arial,sans-serif', - backgroundColor: '#ffffff', -}; - -const resetText = { - margin: '0', - padding: '0', - lineHeight: 1.4, -}; - -const container = { - margin: '0 auto', - padding: '20px 0 48px', - width: '660px', - maxWidth: '100%', -}; - -const tableCell = { display: 'table-cell' }; - -const heading = { - fontSize: '32px', - fontWeight: '300', - color: '#888888', -}; - -const cupomText = { - textAlign: 'center' as const, - margin: '36px 0 40px 0', - fontSize: '14px', - fontWeight: '500', - color: '#111111', -}; - -const supStyle = { - fontWeight: '300', -}; - -const informationTable = { - borderCollapse: 'collapse' as const, - borderSpacing: '0px', - color: 'rgb(51,51,51)', - backgroundColor: 'rgb(250,250,250)', - borderRadius: '3px', - fontSize: '12px', -}; - -const informationTableRow = { - minHeight: '46px', -}; - -const informationTableColumn = { - paddingLeft: '20px', - borderStyle: 'solid', - borderColor: 'white', - borderWidth: '0px 1px 1px 0px', - minHeight: '44px', -}; - -const informationTableLabel = { - ...resetText, - color: 'rgb(102,102,102)', - fontSize: '10px', -}; - -const informationTableValue = { - fontSize: '12px', - margin: '0', - padding: '0', - lineHeight: 1.4, -}; - -const productTitleTable = { - ...informationTable, - margin: '30px 0 15px 0', - minHeight: '24px', -}; - -const productsTitle = { - background: '#fafafa', - paddingLeft: '10px', - fontSize: '14px', - fontWeight: '500', - margin: '0', -}; - -const productIcon = { - margin: '0 0 0 20px', - borderRadius: '14px', - border: '1px solid rgb(242,242,242)', -}; - -const productTitle = { fontSize: '12px', fontWeight: '600', ...resetText }; - -const productDescription = { - fontSize: '12px', - color: 'rgb(102,102,102)', - ...resetText, -}; - -const productLink = { - fontSize: '12px', - color: 'rgb(0,112,201)', - textDecoration: 'none', -}; - -const divisor = { - marginLeft: '4px', - marginRight: '4px', - color: 'rgb(51,51,51)', - fontWeight: 200, -}; - -const productPriceTotal = { - margin: '0', - color: 'rgb(102,102,102)', - fontSize: '10px', - fontWeight: '600', - padding: '0px 30px 0px 0px', - textAlign: 'right' as const, -}; - -const productPrice = { - fontSize: '12px', - fontWeight: '600', - margin: '0', -}; - -const productPriceLarge = { - margin: '0px 20px 0px 0px', - fontSize: '16px', - fontWeight: '600', - whiteSpace: 'nowrap' as const, - textAlign: 'right' as const, -}; - -const productPriceWrapper = { - display: 'table-cell', - padding: '0px 20px 0px 0px', - width: '100px', - verticalAlign: 'top', -}; - -const productPriceLine = { margin: '30px 0 0 0' }; - -const productPriceVerticalLine = { - minHeight: '48px', - paddingTop: '48px', - borderLeft: '1px solid', - borderColor: 'rgb(238,238,238)', -}; - -const productPriceLargeWrapper = { display: 'table-cell', width: '90px' }; - -const productPriceLineBottom = { margin: '0 0 75px 0' }; - -const block = { display: 'block' }; - -const ctaTitle = { - display: 'block', - margin: '15px 0 0 0', -}; - -const ctaText = { fontSize: '24px', fontWeight: '500' }; - -const walletWrapper = { display: 'table-cell', margin: '10px 0 0 0' }; - -const walletLink = { color: 'rgb(0,126,255)', textDecoration: 'none' }; - -const walletImage = { - display: 'inherit', - paddingRight: '8px', - verticalAlign: 'middle', -}; - -const walletBottomLine = { margin: '65px 0 20px 0' }; - -const footerText = { - fontSize: '12px', - color: 'rgb(102,102,102)', - margin: '0', - lineHeight: 'auto', - marginBottom: '16px', -}; - -const footerTextCenter = { - fontSize: '12px', - color: 'rgb(102,102,102)', - margin: '20px 0', - lineHeight: 'auto', - textAlign: 'center' as const, -}; - -const footerLink = { color: 'rgb(0,115,255)' }; - -const footerIcon = { display: 'block', margin: '40px 0 0 0' }; - -const footerLinksWrapper = { - margin: '8px 0 0 0', - textAlign: 'center' as const, - fontSize: '12px', - color: 'rgb(102,102,102)', -}; - -const footerCopyright = { - margin: '25px 0 0 0', - textAlign: 'center' as const, - fontSize: '12px', - color: 'rgb(102,102,102)', -}; - -const walletLinkText = { - fontSize: '14px', - fontWeight: '400', - textDecoration: 'none', -}; diff --git a/apps/demo/emails/receipts/nike-receipt.tsx b/apps/demo/emails/receipts/nike-receipt.tsx index db13e06a87..d58e6a59a1 100644 --- a/apps/demo/emails/receipts/nike-receipt.tsx +++ b/apps/demo/emails/receipts/nike-receipt.tsx @@ -11,9 +11,10 @@ import { Preview, Row, Section, + Tailwind, Text, } from '@react-email/components'; -import type * as React from 'react'; +import tailwindConfig from '../tailwind.config'; const baseUrl = process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` @@ -22,442 +23,336 @@ const baseUrl = process.env.VERCEL_URL export const NikeReceiptEmail = () => ( - - - Get your order summary, estimated delivery date and more - - -
- - - Tracking Number - 1ZV218970300071628 - - - Track Package - - -
-
-
- Nike - It's On Its Way. - - You order's is on its way. Use the link above to track its progress. - - - WeΒ΄ve also charged your payment method for the cost of your order - and will be removing any authorization holds. For payment details, - please visit your Orders page on Nike.com or in the Nike app. - -
-
-
- Shipping to: Alan Turing - - 2125 Chestnut St, San Francisco, CA 94123 - -
-
-
- - - Brazil 2022/23 Stadium Away Women's Nike Dri-FIT Soccer Jersey - - - - Brazil 2022/23 Stadium Away Women's Nike Dri-FIT Soccer Jersey - - Size L (12–14) - - -
-
-
- - - Order Number - C0106373851 - - - Order Date - Sep 22, 2022 - - - - - Order Status - - -
-
-
- - Top Picks For You - - - - Brazil 2022/23 Stadium Away Women's Nike Dri-FIT Soccer Jersey - - USWNT 2022/23 Stadium Home - - - Women's Nike Dri-FIT Soccer Jersey + + + + Get your order summary, estimated delivery date and more + + +
+ + + + Tracking Number + + + 1ZV218970300071628 + + + + + Track Package + + + +
+
+
+ Nike + + It's On Its Way. + + + You order's is on its way. Use the link above to track its + progress. + + + WeΒ΄ve also charged your payment method for the cost of your order + and will be removing any authorization holds. For payment details, + please visit your Orders page on Nike.com or in the Nike app. + +
+
+
+ + Shipping to: Alan Turing + + + 2125 Chestnut St, San Francisco, CA 94123 + +
+
+
+ + + Brazil 2022/23 Stadium Away Women's Nike Dri-FIT Soccer Jersey + + + + Brazil 2022/23 Stadium Away Women's Nike Dri-FIT Soccer Jersey + + + Size L (12–14) + + + +
+
+
+ + + + Order Number + + + C0106373851 + + + + + Order Date + + + Sep 22, 2022 + + + + + + + Order Status + + + +
+
+
+ + + Top Picks For You - - - Brazil 2022/23 Stadium Away Women's Nike Dri-FIT Soccer Jersey - - Brazil 2022/23 Stadium Goalkeeper + + + + Brazil 2022/23 Stadium Away Women's Nike Dri-FIT Soccer Jersey + + USWNT 2022/23 Stadium Home + + + Women's Nike Dri-FIT Soccer Jersey + + + + Brazil 2022/23 Stadium Away Women's Nike Dri-FIT Soccer Jersey + + Brazil 2022/23 Stadium Goalkeeper + + + Men's Nike Dri-FIT Short-Sleeve Football Shirt + + + + Brazil 2022/23 Stadium Away Women's Nike Dri-FIT Soccer Jersey + + FFF + + + Women's Soccer Jacket + + + + Brazil 2022/23 Stadium Away Women's Nike Dri-FIT Soccer Jersey + + FFF + + + Women's Nike Pre-Match Football Top + + + +
+
+
+ + Get Help + + + + + Shipping Status + + + + + Shipping & Delivery + + + + + Returns & Exchanges + + + + + + + How to Return + + + + + Contact Options + + + +
+ + + + + Nike Phone + + + + 1-800-806-6453 + + + + + + + 4 am - 11 pm PT + + + +
+
+
+ + + Nike.com - - Men's Nike Dri-FIT Short-Sleeve Football Shirt + + + + + Men + + + + + Women + + + + + Kids + + + + + Customize + + + +
+
+
+ + + + Web Version + + + + + Privacy Policy + + + + + + Please contact us if you have any questions. (If you reply to + this email, we won't be able to see it.) - - - Brazil 2022/23 Stadium Away Women's Nike Dri-FIT Soccer Jersey - FFF - Women's Soccer Jacket - - - Brazil 2022/23 Stadium Away Women's Nike Dri-FIT Soccer Jersey - FFF - - Women's Nike Pre-Match Football Top + + + + Β© 2022 Nike, Inc. All Rights Reserved. - - -
-
-
- - Get Help - - - - - Shipping Status - - - - - Shipping & Delivery - - - - - Returns & Exchanges - - - - - - - How to Return - - - - - Contact Options - - - -
- - - - - Nike Phone - - - - 1-800-806-6453 - - - - - - - 4 am - 11 pm PT + + + + NIKE, INC. One Bowerman Drive, Beaverton, Oregon 97005, USA. - - -
-
-
- - Nike.com - - - - - Men - - - - - Women - - - - - Kids - - - - - Customize - - - -
-
-
- - - Web Version - - - Privacy Policy - - - - - Please contact us if you have any questions. (If you reply to this - email, we won't be able to see it.) - - - - - Β© 2022 Nike, Inc. All Rights Reserved. - - - - - NIKE, INC. One Bowerman Drive, Beaverton, Oregon 97005, USA. - - -
- - + +
+ + + ); export default NikeReceiptEmail; - -const paddingX = { - paddingLeft: '40px', - paddingRight: '40px', -}; - -const paddingY = { - paddingTop: '22px', - paddingBottom: '22px', -}; - -const paragraph = { - margin: '0', - lineHeight: '2', -}; - -const global = { - paddingX, - paddingY, - defaultPadding: { - ...paddingX, - ...paddingY, - }, - paragraphWithBold: { ...paragraph, fontWeight: 'bold' }, - heading: { - fontSize: '32px', - lineHeight: '1.3', - fontWeight: '700', - textAlign: 'center', - letterSpacing: '-1px', - } as React.CSSProperties, - text: { - ...paragraph, - color: '#747474', - fontWeight: '500', - }, - button: { - border: '1px solid #929292', - fontSize: '16px', - textDecoration: 'none', - padding: '10px 0px', - width: '220px', - display: 'block', - textAlign: 'center', - fontWeight: 500, - color: '#000', - } as React.CSSProperties, - hr: { - borderColor: '#E5E5E5', - margin: '0', - }, -}; - -const main = { - backgroundColor: '#ffffff', - fontFamily: - '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif', -}; - -const container = { - margin: '10px auto', - width: '600px', - maxWidth: '100%', - border: '1px solid #E5E5E5', -}; - -const track = { - container: { - padding: '22px 40px', - backgroundColor: '#F7F7F7', - }, - number: { - margin: '12px 0 0 0', - fontWeight: 500, - lineHeight: '1.4', - color: '#6F6F6F', - }, -}; - -const message = { - padding: '40px 74px', - textAlign: 'center', -} as React.CSSProperties; - -const adressTitle = { - ...paragraph, - fontSize: '15px', - fontWeight: 'bold', -}; - -const recomendationsText = { - margin: '0', - fontSize: '15px', - lineHeight: '1', - paddingLeft: '10px', - paddingRight: '10px', -}; - -const recomendations = { - container: { - padding: '20px 0', - }, - product: { - verticalAlign: 'top', - textAlign: 'left' as const, - paddingLeft: '2px', - paddingRight: '2px', - }, - title: { ...recomendationsText, paddingTop: '12px', fontWeight: '500' }, - text: { - ...recomendationsText, - paddingTop: '4px', - color: '#747474', - }, -}; - -const menu = { - container: { - paddingLeft: '20px', - paddingRight: '20px', - paddingTop: '20px', - backgroundColor: '#F7F7F7', - }, - content: { - ...paddingY, - paddingLeft: '20px', - paddingRight: '20px', - }, - title: { - paddingLeft: '20px', - paddingRight: '20px', - fontWeight: 'bold', - }, - text: { - fontSize: '13.5px', - marginTop: 0, - fontWeight: 500, - color: '#000', - }, - tel: { - paddingLeft: '20px', - paddingRight: '20px', - paddingTop: '32px', - paddingBottom: '22px', - }, -}; - -const categories = { - container: { - width: '370px', - margin: 'auto', - paddingTop: '12px', - }, - text: { - fontWeight: '500', - color: '#000', - }, -}; - -const footer = { - policy: { - width: '166px', - margin: 'auto', - }, - text: { - margin: '0', - color: '#AFAFAF', - fontSize: '13px', - textAlign: 'center', - } as React.CSSProperties, -}; diff --git a/apps/demo/emails/reset-password/dropbox-reset-password.tsx b/apps/demo/emails/reset-password/dropbox-reset-password.tsx index 91a4ef6d83..907fe6e021 100644 --- a/apps/demo/emails/reset-password/dropbox-reset-password.tsx +++ b/apps/demo/emails/reset-password/dropbox-reset-password.tsx @@ -8,8 +8,10 @@ import { Link, Preview, Section, + Tailwind, Text, } from '@react-email/components'; +import tailwindConfig from '../tailwind.config'; interface DropboxResetPasswordEmailProps { userFirstname?: string; @@ -27,39 +29,48 @@ export const DropboxResetPasswordEmail = ({ return ( - - Dropbox reset your password - - Dropbox -
- Hi {userFirstname}, - - Someone recently requested a password change for your Dropbox - account. If this was you, you can set a new password here: - - - - If you don't want to change your password or didn't - request this, just ignore and delete this message. - - - To keep your account secure, please don't forward this email - to anyone. See our Help Center for{' '} - - more security tips. - - - Happy Dropboxing! -
- - + + + Dropbox reset your password + + Dropbox +
+ + Hi {userFirstname}, + + + Someone recently requested a password change for your Dropbox + account. If this was you, you can set a new password here: + + + + If you don't want to change your password or didn't + request this, just ignore and delete this message. + + + To keep your account secure, please don't forward this + email to anyone. See our Help Center for{' '} + + more security tips. + + + + Happy Dropboxing! + +
+ + + ); }; @@ -69,41 +80,6 @@ DropboxResetPasswordEmail.PreviewProps = { resetPasswordLink: 'https://www.dropbox.com', } as DropboxResetPasswordEmailProps; -export default DropboxResetPasswordEmail; - -const main = { - backgroundColor: '#f6f9fc', - padding: '10px 0', -}; +DropboxResetPasswordEmail.tailwindConfig = tailwindConfig; -const container = { - backgroundColor: '#ffffff', - border: '1px solid #f0f0f0', - padding: '45px', -}; - -const text = { - fontSize: '16px', - fontFamily: - "'Open Sans', 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, 'Lucida Grande', sans-serif", - fontWeight: '300', - color: '#404040', - lineHeight: '26px', -}; - -const button = { - backgroundColor: '#007ee6', - borderRadius: '4px', - color: '#fff', - fontFamily: "'Open Sans', 'Helvetica Neue', Arial", - fontSize: '15px', - textDecoration: 'none', - textAlign: 'center' as const, - display: 'block', - width: '210px', - padding: '14px 7px', -}; - -const anchor = { - textDecoration: 'underline', -}; +export default DropboxResetPasswordEmail; diff --git a/apps/demo/emails/reset-password/twitch-reset-password.tsx b/apps/demo/emails/reset-password/twitch-reset-password.tsx index 60eb156c32..de99963778 100644 --- a/apps/demo/emails/reset-password/twitch-reset-password.tsx +++ b/apps/demo/emails/reset-password/twitch-reset-password.tsx @@ -9,8 +9,10 @@ import { Preview, Row, Section, + Tailwind, Text, } from '@react-email/components'; +import tailwindConfig from '../tailwind.config'; interface TwitchResetPasswordEmailProps { username?: string; @@ -33,83 +35,85 @@ export const TwitchResetPasswordEmail = ({ return ( - - You updated the password for your Twitch account - -
- Twitch -
-
+ + + You updated the password for your Twitch account + +
+ Twitch +
+
+ + + + + +
+
+ Hi {username}, + + You updated the password for your Twitch account on{' '} + {formattedDate}. If this was you, then no further action is + required. + + + However if you did NOT perform this password change, please{' '} + + reset your account password + {' '} + immediately. + + + Remember to use a password that is both strong and unique to + your Twitch account. To learn more about how to create a strong + and unique password,{' '} + + click here. + + + + Still have questions? Please contact{' '} + + Twitch Support + + + + Thanks, +
+ Twitch Support Team + +
+ + +
- - - + + Twitter + + + Facebook + + + + + Β© 2022 Twitch, All Rights Reserved
+ 350 Bush Street, 2nd Floor, San Francisco, CA, 94104 - USA +
-
- Hi {username}, - - You updated the password for your Twitch account on{' '} - {formattedDate}. If this was you, then no further action is - required. - - - However if you did NOT perform this password change, please{' '} - - reset your account password - {' '} - immediately. - - - Remember to use a password that is both strong and unique to your - Twitch account. To learn more about how to create a strong and - unique password,{' '} - - click here. - - - - Still have questions? Please contact{' '} - - Twitch Support - - - - Thanks, -
- Twitch Support Team - -
- - -
- - - Twitter - - - Facebook - - - - - Β© 2022 Twitch, All Rights Reserved
- 350 Bush Street, 2nd Floor, San Francisco, CA, 94104 - USA - - -
- + + ); }; @@ -120,56 +124,3 @@ TwitchResetPasswordEmail.PreviewProps = { } as TwitchResetPasswordEmailProps; export default TwitchResetPasswordEmail; - -const fontFamily = 'HelveticaNeue,Helvetica,Arial,sans-serif'; - -const main = { - backgroundColor: '#efeef1', - fontFamily, -}; - -const paragraph = { - lineHeight: 1.5, - fontSize: 14, -}; - -const container = { - maxWidth: '580px', - margin: '30px auto', - backgroundColor: '#ffffff', -}; - -const footer = { - maxWidth: '580px', - margin: '0 auto', -}; - -const content = { - padding: '5px 20px 10px 20px', -}; - -const logo = { - padding: 30, -}; - -const logoImg = { - margin: '0 auto', -}; - -const sectionsBorders = { - width: '100%', -}; - -const sectionBorder = { - borderBottom: '1px solid rgb(238,238,238)', - width: '249px', -}; - -const sectionCenter = { - borderBottom: '1px solid rgb(145,71,255)', - width: '102px', -}; - -const link = { - textDecoration: 'underline', -}; diff --git a/apps/demo/emails/reviews/airbnb-review.tsx b/apps/demo/emails/reviews/airbnb-review.tsx index 52381120bd..d345f8d646 100644 --- a/apps/demo/emails/reviews/airbnb-review.tsx +++ b/apps/demo/emails/reviews/airbnb-review.tsx @@ -10,8 +10,10 @@ import { Preview, Row, Section, + Tailwind, Text, } from '@react-email/components'; +import tailwindConfig from '../tailwind.config'; interface AirbnbReviewEmailProps { authorName?: string; @@ -34,78 +36,100 @@ export const AirbnbReviewEmail = ({ - - {previewText} - -
- Airbnb -
-
- {authorName} -
-
- - Here's what {authorName} wrote - {reviewText} - - Now that the review period is over, we’ve posted {authorName} - ’s review to your Airbnb profile. - - - While it’s too late to write a review of your own, you can send - your feedback to {authorName} using your Airbnb message thread. - - - - -
- -
- -
- - - Common questions - - - - How do reviews work? - - - - - How do star ratings work? + + + {previewText} + +
+ Airbnb +
+
+ {authorName} +
+
+ + + Here's what {authorName} wrote + + + {reviewText} + + + Now that the review period is over, we've posted {authorName} + 's review to your Airbnb profile. + + + While it's too late to write a review of your own, you can + send your feedback to {authorName} using your Airbnb message + thread. + + + + +
+ +
+ +
+ + + Common questions + + + + How do reviews work? + + + + + How do star ratings work? + + + + + Can I leave a review after 14 days? + + +
+ + Airbnb, Inc., 888 Brannan St, San Francisco, CA 94103 + + + Report unsafe behavior - - - - Can I leave a review after 14 days? - - -
- - Airbnb, Inc., 888 Brannan St, San Francisco, CA 94103 - - - Report unsafe behavior - - -
- - + +
+ + + ); }; @@ -119,77 +143,6 @@ AirbnbReviewEmail.PreviewProps = { host!”`, } as AirbnbReviewEmailProps; -export default AirbnbReviewEmail; - -const main = { - backgroundColor: '#ffffff', - fontFamily: - '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif', -}; - -const container = { - margin: '0 auto', - padding: '20px 0 48px', - width: '580px', - maxWidth: '100%', -}; - -const userImage = { - margin: '0 auto', - marginBottom: '16px', - borderRadius: '50%', -}; - -const heading = { - fontSize: '32px', - lineHeight: '1.3', - fontWeight: '700', - color: '#484848', -}; - -const paragraph = { - fontSize: '18px', - lineHeight: '1.4', - color: '#484848', -}; - -const review = { - ...paragraph, - padding: '24px', - backgroundColor: '#f2f3f3', - borderRadius: '4px', -}; - -const button = { - backgroundColor: '#ff5a5f', - borderRadius: '3px', - color: '#fff', - fontSize: '18px', - padding: '19px 30px', - textDecoration: 'none', - textAlign: 'center' as const, - display: 'block', -}; - -const link = { - ...paragraph, - color: '#ff5a5f', - display: 'block', -}; - -const reportLink = { - fontSize: '14px', - color: '#9ca299', - textDecoration: 'underline', -}; +AirbnbReviewEmail.tailwindConfig = tailwindConfig; -const hr = { - borderColor: '#cccccc', - margin: '20px 0', -}; - -const footer = { - color: '#9ca299', - fontSize: '14px', - marginBottom: '10px', -}; +export default AirbnbReviewEmail; diff --git a/apps/demo/emails/reviews/amazon-review.tsx b/apps/demo/emails/reviews/amazon-review.tsx index 08fb4a2ffb..02da9acef4 100644 --- a/apps/demo/emails/reviews/amazon-review.tsx +++ b/apps/demo/emails/reviews/amazon-review.tsx @@ -10,8 +10,10 @@ import { Preview, Row, Section, + Tailwind, Text, } from '@react-email/components'; +import tailwindConfig from '../tailwind.config'; interface AmazonReviewEmailProps { titleText?: string; @@ -38,204 +40,158 @@ export const AmazonReviewEmail = ({ - - Amazon Review - -
- - - + + + Amazon Review + +
+ + + + Amazon Prime Logo + + + +
+ +
+ + + + {titleText} + + {reviewText} + + +
+ +
+ + Amazon Prime Logo - - - -
- -
- - - {titleText} - {reviewText} - - -
- -
- - - Amazon Book - - - - - 14 Habits of Highly Productive Developers (English Edition) - - Start with rating this product - - {reviwStars.map((star, index) => ( + + + + + 14 Habits of Highly Productive Developers (English Edition) + + Start with rating this product + + {reviwStars.map((star, index) => ( + Amazon Rating + ))} + + + Your reviews will be posted on Amazon using your public + name. + Check your public name. + + + +
+ +
+ + + + How about evaluating a previous purchase?{' '} + + View more + + + + +
+ +
+ +
+ + Amazon Rating - ))} - - - Your reviews will be posted on Amazon using your public name. - Check your public name. + + + + {socialMediaIcons.map((src, index) => ( + Amazon Social Midia + ))} + + +
+ +
+ + + Customer reviews must adhere to the{' '} + + Community Guidelines + {' '} + . - - -
- -
- - - - How about evaluating a previous purchase?{' '} - View more + + We hope this message was helpful to you. However, if you + prefer not to receive this type of communication from{' '} + + Amazon.com + {' '} + at{' '} + + alanturing@gmail.com{' '} + + ,{' '} + + click here + {' '} + . - - -
- -
- -
- - - Amazon Logo - - - - {socialMediaIcons.map((src, index) => ( - Amazon Social Midia - ))} - - -
- -
- - - Customer reviews must adhere to the{' '} - Community Guidelines . - - - We hope this message was helpful to you. However, if you prefer - not to receive this type of communication from{' '} - Amazon.com at{' '} - alanturing@gmail.com ,{' '} - click here . - - - Please note that product prices and availability are subject to - change. - - - Β© 2023 Amazon.com, Inc. or its affiliates. Amazon and all - associated marks are trademarks of Amazon.com, Inc. or its - affiliates. - - Reference: 706784740 - -
- - + + Please note that product prices and availability are subject + to change. + + + Β© 2023 Amazon.com, Inc. or its affiliates. Amazon and all + associated marks are trademarks of Amazon.com, Inc. or its + affiliates. + + + Reference: 706784740 + + +
+ + + ); }; -export default AmazonReviewEmail; - -const main = { - fontFamily: 'Ember,Helvetica,Arial,sans-seri', - backgroundColor: '#ffffff', -}; - -const container = { - borderTop: '4px solid #FF9900', - margin: '0 auto', - padding: '20px', - width: '640px', -}; - -const title = { - color: '#232f3e', - fontSize: '36px', - lineHeight: '38px', - fontWeight: '400', - margin: '20px 0', -}; - -const ratingContent = { - paddingLeft: '30px', -}; +AmazonReviewEmail.tailwindConfig = tailwindConfig; -const rating = { - display: 'inline-block', -}; - -const previewPurchase = { - background: '#008296', - color: '#ffffff', - padding: '8px 0', -}; - -const previewPurchaseLink = { - color: '#ffffff', - textDecoration: 'underline', - cursor: 'pointer', -}; - -const socialMedia = { - display: 'inline-block', - marginLeft: '10px', -}; - -const communityLink = { - color: '#666666', - textDecoration: 'underline', - cursor: 'pointer', -}; - -const clickHereLink = { - color: '#999999', - textDecoration: 'underline', - cursor: 'pointer', -}; - -const urlLink = { - color: '#1155cc', - textDecoration: 'underline', - cursor: 'pointer', -}; - -const footerText = { - fontSize: '10px', - color: '#666666', - margin: '8px 0', -}; +export default AmazonReviewEmail; diff --git a/apps/demo/emails/tailwind.config.ts b/apps/demo/emails/tailwind.config.ts new file mode 100644 index 0000000000..6568f85368 --- /dev/null +++ b/apps/demo/emails/tailwind.config.ts @@ -0,0 +1,93 @@ +import { pixelBasedPreset, type TailwindConfig } from '@react-email/components'; + +export default { + presets: [pixelBasedPreset], + theme: { + fontFamily: { + amazon: ['Ember', 'Helvetica', 'Arial', 'sans-serif'], + koala: [ + '-apple-system', + 'BlinkMacSystemFont', + 'Segoe UI', + 'Roboto', + 'Oxygen-Sans', + 'Ubuntu', + 'Cantarell', + 'Helvetica Neue', + 'sans-serif', + ], + raycast: + '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif', + slack: + "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif", + twitch: ['HelveticaNeue', 'Helvetica', 'Arial', 'sans-serif'], + 'stack-overflow': ['Helvetica Neue', 'Helvetica', 'Arial', 'sans-serif'], + 'stack-overflow-mono': 'Consolas,monospace', + github: + '-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji"', + yelp: [ + '-apple-system', + 'BlinkMacSystemFont', + '"Segoe UI"', + 'Roboto', + 'Oxygen-Sans', + 'Ubuntu', + 'Cantarell', + '"Helvetica Neue"', + 'sans-serif', + ], + nike: [ + '-apple-system', + 'BlinkMacSystemFont', + '"Segoe UI"', + 'Roboto', + 'Oxygen-Sans', + 'Ubuntu', + 'Cantarell', + '"Helvetica Neue"', + 'sans-serif', + ], + linear: + '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif', + stripe: [ + '-apple-system', + 'BlinkMacSystemFont', + '"Segoe UI"', + 'Roboto', + '"Helvetica Neue"', + 'Ubuntu', + 'sans-serif', + ], + notion: + "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif", + aws: "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif", + airbnb: [ + '-apple-system', + 'BlinkMacSystemFont', + '"Segoe UI"', + 'Roboto', + 'Oxygen-Sans', + 'Ubuntu', + 'Cantarell', + '"Helvetica Neue"', + 'sans-serif', + ], + apple: ['"Helvetica Neue"', 'Helvetica', 'Arial', 'sans-serif'], + dropbox: [ + 'Open Sans', + 'HelveticaNeue-Light', + 'Helvetica Neue Light', + 'Helvetica Neue', + 'Helvetica', + 'Arial', + 'Lucida Grande', + 'sans-serif', + ], + 'dropbox-sans': ['Open Sans', 'Helvetica Neue', 'Arial'], + codepen: '"Google Sans",Roboto,RobotoDraft,Helvetica,Arial,sans-serif', + plaid: 'HelveticaNeue,Helvetica,Arial,sans-serif', + google: + '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif', + }, + }, +} satisfies TailwindConfig; diff --git a/apps/demo/emails/welcome/koala-welcome.tsx b/apps/demo/emails/welcome/koala-welcome.tsx index 5ec1ebe0bc..1267a887ae 100644 --- a/apps/demo/emails/welcome/koala-welcome.tsx +++ b/apps/demo/emails/welcome/koala-welcome.tsx @@ -8,8 +8,10 @@ import { Img, Preview, Section, + Tailwind, Text, } from '@react-email/components'; +import tailwindConfig from '../tailwind.config'; interface KoalaWelcomeEmailProps { userFirstname: string; @@ -24,39 +26,47 @@ export const KoalaWelcomeEmail = ({ }: KoalaWelcomeEmailProps) => ( - - - The sales intelligence platform that helps you uncover qualified leads. - - - Koala - Hi {userFirstname}, - - Welcome to Koala, the sales intelligence platform that helps you - uncover qualified leads and close deals faster. - -
- -
- - Best, -
- The Koala team - -
- - 470 Noor Ave STE B #1148, South San Francisco, CA 94080 - - - + + + + The sales intelligence platform that helps you uncover qualified + leads. + + + Koala + + Hi {userFirstname}, + + + Welcome to Koala, the sales intelligence platform that helps you + uncover qualified leads and close deals faster. + +
+ +
+ + Best, +
+ The Koala team + +
+ + 470 Noor Ave STE B #1148, South San Francisco, CA 94080 + + + + ); @@ -65,48 +75,3 @@ KoalaWelcomeEmail.PreviewProps = { } as KoalaWelcomeEmailProps; export default KoalaWelcomeEmail; - -const main = { - backgroundColor: '#ffffff', - fontFamily: - '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif', -}; - -const container = { - margin: '0 auto', - padding: '20px 0 48px', -}; - -const logo = { - margin: '0 auto', -}; - -const paragraph = { - fontSize: '16px', - lineHeight: '26px', -}; - -const btnContainer = { - textAlign: 'center' as const, -}; - -const button = { - backgroundColor: '#5F51E8', - borderRadius: '3px', - color: '#fff', - fontSize: '16px', - textDecoration: 'none', - textAlign: 'center' as const, - display: 'block', - padding: '12px', -}; - -const hr = { - borderColor: '#cccccc', - margin: '20px 0', -}; - -const footer = { - color: '#8898aa', - fontSize: '12px', -}; diff --git a/apps/demo/emails/welcome/stripe-welcome.tsx b/apps/demo/emails/welcome/stripe-welcome.tsx index 9422531e01..1ceac00d5d 100644 --- a/apps/demo/emails/welcome/stripe-welcome.tsx +++ b/apps/demo/emails/welcome/stripe-welcome.tsx @@ -9,8 +9,10 @@ import { Link, Preview, Section, + Tailwind, Text, } from '@react-email/components'; +import tailwindConfig from '../tailwind.config'; const baseUrl = process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` @@ -19,138 +21,98 @@ const baseUrl = process.env.VERCEL_URL export const StripeWelcomeEmail = () => ( - - You're now ready to make live transactions with Stripe! - -
- Stripe -
- - Thanks for submitting your account information. You're now ready to - make live transactions with Stripe! - - - You can view your payments and a variety of other information about - your account right from your dashboard. - - -
- - If you haven't finished your integration, you might find our{' '} - + + + You're now ready to make live transactions with Stripe! + + +
+ Stripe +
+ + Thanks for submitting your account information. You're now ready + to make live transactions with Stripe! + + + You can view your payments and a variety of other information + about your account right from your dashboard. + +
- - + View your Stripe Dashboard + +
+ + If you haven't finished your integration, you might find our{' '} + + docs + {' '} + handy. + + + Once you're ready to start accepting payments, you'll just need to + use your live{' '} + + API keys + {' '} + instead of your test API keys. Your account can simultaneously be + used for both test and live requests, so you can continue testing + while accepting live payments. Check out our{' '} + + tutorial about account basics + + . + + + Finally, we've put together a{' '} + + quick checklist + {' '} + to ensure your website conforms to card network standards. + + + We'll be here to help you with any step along the way. You can + find answers to most questions and get in touch with us on our{' '} + + support site + + . + + + β€” The Stripe team + +
+ + Stripe, 354 Oyster Point Blvd, South San Francisco, CA 94080 + +
+ + + ); export default StripeWelcomeEmail; - -const main = { - backgroundColor: '#f6f9fc', - fontFamily: - '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Ubuntu,sans-serif', -}; - -const container = { - backgroundColor: '#ffffff', - margin: '0 auto', - padding: '20px 0 48px', - marginBottom: '64px', -}; - -const box = { - padding: '0 48px', -}; - -const hr = { - borderColor: '#e6ebf1', - margin: '20px 0', -}; - -const paragraph = { - color: '#525f7f', - - fontSize: '16px', - lineHeight: '24px', - textAlign: 'left' as const, -}; - -const anchor = { - color: '#556cd6', -}; - -const button = { - backgroundColor: '#656ee8', - borderRadius: '5px', - color: '#fff', - fontSize: '16px', - fontWeight: 'bold', - textDecoration: 'none', - textAlign: 'center' as const, - display: 'block', - padding: '10px', -}; - -const footer = { - color: '#8898aa', - fontSize: '12px', - lineHeight: '16px', -}; diff --git a/apps/demo/package.json b/apps/demo/package.json index 79ff536b09..c5e35d446c 100644 --- a/apps/demo/package.json +++ b/apps/demo/package.json @@ -9,15 +9,15 @@ "export": "email-dev export" }, "dependencies": { - "@react-email/components": "workspace:*", + "@react-email/components": "npm:@react-email/components@1.0.0-tailwindv4.5", + "email-dev": "workspace:*", "react": "^19", - "react-dom": "^19", - "email-dev": "workspace:*" + "react-dom": "^19" }, "devDependencies": { "@react-email/preview-server": "workspace:*", - "next": "^15.3.2", "@types/react": "^19", - "@types/react-dom": "^19" + "@types/react-dom": "^19", + "next": "^15.3.2" } } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index b93c205785..055178be78 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -57,8 +57,8 @@ importers: apps/demo: dependencies: '@react-email/components': - specifier: workspace:* - version: link:../../packages/components + specifier: npm:@react-email/components@1.0.0-tailwindv4.5 + version: 1.0.0-tailwindv4.5(react-dom@19.0.0(react@19.0.0))(react@19.0.0) email-dev: specifier: workspace:* version: link:../../packages/react-email/dev @@ -168,7 +168,7 @@ importers: version: 1.2.3(@types/react@19.0.1)(react@19.0.0) '@radix-ui/react-tabs': specifier: ^1.1.0 - version: 1.1.13(@types/react-dom@19.0.1)(@types/react@19.0.1)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 1.1.2(@types/react-dom@19.0.1)(@types/react@19.0.1)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@radix-ui/react-tooltip': specifier: 1.2.8 version: 1.2.8(@types/react-dom@19.0.1)(@types/react@19.0.1)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) @@ -456,10 +456,10 @@ importers: version: 13.1.0 fs-extra: specifier: ^11.1.1 - version: 11.3.2 + version: 11.3.0 log-symbols: specifier: ^7.0.0 - version: 7.0.1 + version: 7.0.0 ora: specifier: ^8.0.0 version: 8.2.0 @@ -788,16 +788,16 @@ importers: version: 2.0.0 esbuild: specifier: ^0.25.0 - version: 0.25.10 + version: 0.25.0 glob: specifier: ^11.0.0 - version: 11.0.3 + version: 11.0.1 jiti: specifier: 2.4.2 version: 2.4.2 log-symbols: specifier: ^7.0.0 - version: 7.0.1 + version: 7.0.0 mime-types: specifier: ^3.0.0 version: 3.0.1 @@ -1478,6 +1478,12 @@ packages: cpu: [ppc64] os: [aix] + '@esbuild/aix-ppc64@0.25.0': + resolution: {integrity: sha512-O7vun9Sf8DFjH2UtqK8Ku3LkquL9SZL8OLY1T5NZkA34+wG3OQF7cl4Ql8vdNzM6fzBbYfLaiRLIOZ+2FOCgBQ==} + engines: {node: '>=18'} + cpu: [ppc64] + os: [aix] + '@esbuild/aix-ppc64@0.25.10': resolution: {integrity: sha512-0NFWnA+7l41irNuaSVlLfgNT12caWJVLzp5eAVhZ0z1qpxbockccEt3s+149rE64VUI3Ml2zt8Nv5JVc4QXTsw==} engines: {node: '>=18'} @@ -1490,6 +1496,12 @@ packages: cpu: [arm64] os: [android] + '@esbuild/android-arm64@0.25.0': + resolution: {integrity: sha512-grvv8WncGjDSyUBjN9yHXNt+cq0snxXbDxy5pJtzMKGmmpPxeAmAhWxXI+01lU5rwZomDgD3kJwulEnhTRUd6g==} + engines: {node: '>=18'} + cpu: [arm64] + os: [android] + '@esbuild/android-arm64@0.25.10': resolution: {integrity: sha512-LSQa7eDahypv/VO6WKohZGPSJDq5OVOo3UoFR1E4t4Gj1W7zEQMUhI+lo81H+DtB+kP+tDgBp+M4oNCwp6kffg==} engines: {node: '>=18'} @@ -1502,6 +1514,12 @@ packages: cpu: [arm] os: [android] + '@esbuild/android-arm@0.25.0': + resolution: {integrity: sha512-PTyWCYYiU0+1eJKmw21lWtC+d08JDZPQ5g+kFyxP0V+es6VPPSUhM6zk8iImp2jbV6GwjX4pap0JFbUQN65X1g==} + engines: {node: '>=18'} + cpu: [arm] + os: [android] + '@esbuild/android-arm@0.25.10': resolution: {integrity: sha512-dQAxF1dW1C3zpeCDc5KqIYuZ1tgAdRXNoZP7vkBIRtKZPYe2xVr/d3SkirklCHudW1B45tGiUlz2pUWDfbDD4w==} engines: {node: '>=18'} @@ -1514,6 +1532,12 @@ packages: cpu: [x64] os: [android] + '@esbuild/android-x64@0.25.0': + resolution: {integrity: sha512-m/ix7SfKG5buCnxasr52+LI78SQ+wgdENi9CqyCXwjVR2X4Jkz+BpC3le3AoBPYTC9NHklwngVXvbJ9/Akhrfg==} + engines: {node: '>=18'} + cpu: [x64] + os: [android] + '@esbuild/android-x64@0.25.10': resolution: {integrity: sha512-MiC9CWdPrfhibcXwr39p9ha1x0lZJ9KaVfvzA0Wxwz9ETX4v5CHfF09bx935nHlhi+MxhA63dKRRQLiVgSUtEg==} engines: {node: '>=18'} @@ -1526,6 +1550,12 @@ packages: cpu: [arm64] os: [darwin] + '@esbuild/darwin-arm64@0.25.0': + resolution: {integrity: sha512-mVwdUb5SRkPayVadIOI78K7aAnPamoeFR2bT5nszFUZ9P8UpK4ratOdYbZZXYSqPKMHfS1wdHCJk1P1EZpRdvw==} + engines: {node: '>=18'} + cpu: [arm64] + os: [darwin] + '@esbuild/darwin-arm64@0.25.10': resolution: {integrity: sha512-JC74bdXcQEpW9KkV326WpZZjLguSZ3DfS8wrrvPMHgQOIEIG/sPXEN/V8IssoJhbefLRcRqw6RQH2NnpdprtMA==} engines: {node: '>=18'} @@ -1538,6 +1568,12 @@ packages: cpu: [x64] os: [darwin] + '@esbuild/darwin-x64@0.25.0': + resolution: {integrity: sha512-DgDaYsPWFTS4S3nWpFcMn/33ZZwAAeAFKNHNa1QN0rI4pUjgqf0f7ONmXf6d22tqTY+H9FNdgeaAa+YIFUn2Rg==} + engines: {node: '>=18'} + cpu: [x64] + os: [darwin] + '@esbuild/darwin-x64@0.25.10': resolution: {integrity: sha512-tguWg1olF6DGqzws97pKZ8G2L7Ig1vjDmGTwcTuYHbuU6TTjJe5FXbgs5C1BBzHbJ2bo1m3WkQDbWO2PvamRcg==} engines: {node: '>=18'} @@ -1550,6 +1586,12 @@ packages: cpu: [arm64] os: [freebsd] + '@esbuild/freebsd-arm64@0.25.0': + resolution: {integrity: sha512-VN4ocxy6dxefN1MepBx/iD1dH5K8qNtNe227I0mnTRjry8tj5MRk4zprLEdG8WPyAPb93/e4pSgi1SoHdgOa4w==} + engines: {node: '>=18'} + cpu: [arm64] + os: [freebsd] + '@esbuild/freebsd-arm64@0.25.10': resolution: {integrity: sha512-3ZioSQSg1HT2N05YxeJWYR+Libe3bREVSdWhEEgExWaDtyFbbXWb49QgPvFH8u03vUPX10JhJPcz7s9t9+boWg==} engines: {node: '>=18'} @@ -1562,6 +1604,12 @@ packages: cpu: [x64] os: [freebsd] + '@esbuild/freebsd-x64@0.25.0': + resolution: {integrity: sha512-mrSgt7lCh07FY+hDD1TxiTyIHyttn6vnjesnPoVDNmDfOmggTLXRv8Id5fNZey1gl/V2dyVK1VXXqVsQIiAk+A==} + engines: {node: '>=18'} + cpu: [x64] + os: [freebsd] + '@esbuild/freebsd-x64@0.25.10': resolution: {integrity: sha512-LLgJfHJk014Aa4anGDbh8bmI5Lk+QidDmGzuC2D+vP7mv/GeSN+H39zOf7pN5N8p059FcOfs2bVlrRr4SK9WxA==} engines: {node: '>=18'} @@ -1574,6 +1622,12 @@ packages: cpu: [arm64] os: [linux] + '@esbuild/linux-arm64@0.25.0': + resolution: {integrity: sha512-9QAQjTWNDM/Vk2bgBl17yWuZxZNQIF0OUUuPZRKoDtqF2k4EtYbpyiG5/Dk7nqeK6kIJWPYldkOcBqjXjrUlmg==} + engines: {node: '>=18'} + cpu: [arm64] + os: [linux] + '@esbuild/linux-arm64@0.25.10': resolution: {integrity: sha512-5luJWN6YKBsawd5f9i4+c+geYiVEw20FVW5x0v1kEMWNq8UctFjDiMATBxLvmmHA4bf7F6hTRaJgtghFr9iziQ==} engines: {node: '>=18'} @@ -1586,6 +1640,12 @@ packages: cpu: [arm] os: [linux] + '@esbuild/linux-arm@0.25.0': + resolution: {integrity: sha512-vkB3IYj2IDo3g9xX7HqhPYxVkNQe8qTK55fraQyTzTX/fxaDtXiEnavv9geOsonh2Fd2RMB+i5cbhu2zMNWJwg==} + engines: {node: '>=18'} + cpu: [arm] + os: [linux] + '@esbuild/linux-arm@0.25.10': resolution: {integrity: sha512-oR31GtBTFYCqEBALI9r6WxoU/ZofZl962pouZRTEYECvNF/dtXKku8YXcJkhgK/beU+zedXfIzHijSRapJY3vg==} engines: {node: '>=18'} @@ -1598,6 +1658,12 @@ packages: cpu: [ia32] os: [linux] + '@esbuild/linux-ia32@0.25.0': + resolution: {integrity: sha512-43ET5bHbphBegyeqLb7I1eYn2P/JYGNmzzdidq/w0T8E2SsYL1U6un2NFROFRg1JZLTzdCoRomg8Rvf9M6W6Gg==} + engines: {node: '>=18'} + cpu: [ia32] + os: [linux] + '@esbuild/linux-ia32@0.25.10': resolution: {integrity: sha512-NrSCx2Kim3EnnWgS4Txn0QGt0Xipoumb6z6sUtl5bOEZIVKhzfyp/Lyw4C1DIYvzeW/5mWYPBFJU3a/8Yr75DQ==} engines: {node: '>=18'} @@ -1610,6 +1676,12 @@ packages: cpu: [loong64] os: [linux] + '@esbuild/linux-loong64@0.25.0': + resolution: {integrity: sha512-fC95c/xyNFueMhClxJmeRIj2yrSMdDfmqJnyOY4ZqsALkDrrKJfIg5NTMSzVBr5YW1jf+l7/cndBfP3MSDpoHw==} + engines: {node: '>=18'} + cpu: [loong64] + os: [linux] + '@esbuild/linux-loong64@0.25.10': resolution: {integrity: sha512-xoSphrd4AZda8+rUDDfD9J6FUMjrkTz8itpTITM4/xgerAZZcFW7Dv+sun7333IfKxGG8gAq+3NbfEMJfiY+Eg==} engines: {node: '>=18'} @@ -1622,6 +1694,12 @@ packages: cpu: [mips64el] os: [linux] + '@esbuild/linux-mips64el@0.25.0': + resolution: {integrity: sha512-nkAMFju7KDW73T1DdH7glcyIptm95a7Le8irTQNO/qtkoyypZAnjchQgooFUDQhNAy4iu08N79W4T4pMBwhPwQ==} + engines: {node: '>=18'} + cpu: [mips64el] + os: [linux] + '@esbuild/linux-mips64el@0.25.10': resolution: {integrity: sha512-ab6eiuCwoMmYDyTnyptoKkVS3k8fy/1Uvq7Dj5czXI6DF2GqD2ToInBI0SHOp5/X1BdZ26RKc5+qjQNGRBelRA==} engines: {node: '>=18'} @@ -1634,6 +1712,12 @@ packages: cpu: [ppc64] os: [linux] + '@esbuild/linux-ppc64@0.25.0': + resolution: {integrity: sha512-NhyOejdhRGS8Iwv+KKR2zTq2PpysF9XqY+Zk77vQHqNbo/PwZCzB5/h7VGuREZm1fixhs4Q/qWRSi5zmAiO4Fw==} + engines: {node: '>=18'} + cpu: [ppc64] + os: [linux] + '@esbuild/linux-ppc64@0.25.10': resolution: {integrity: sha512-NLinzzOgZQsGpsTkEbdJTCanwA5/wozN9dSgEl12haXJBzMTpssebuXR42bthOF3z7zXFWH1AmvWunUCkBE4EA==} engines: {node: '>=18'} @@ -1646,6 +1730,12 @@ packages: cpu: [riscv64] os: [linux] + '@esbuild/linux-riscv64@0.25.0': + resolution: {integrity: sha512-5S/rbP5OY+GHLC5qXp1y/Mx//e92L1YDqkiBbO9TQOvuFXM+iDqUNG5XopAnXoRH3FjIUDkeGcY1cgNvnXp/kA==} + engines: {node: '>=18'} + cpu: [riscv64] + os: [linux] + '@esbuild/linux-riscv64@0.25.10': resolution: {integrity: sha512-FE557XdZDrtX8NMIeA8LBJX3dC2M8VGXwfrQWU7LB5SLOajfJIxmSdyL/gU1m64Zs9CBKvm4UAuBp5aJ8OgnrA==} engines: {node: '>=18'} @@ -1658,6 +1748,12 @@ packages: cpu: [s390x] os: [linux] + '@esbuild/linux-s390x@0.25.0': + resolution: {integrity: sha512-XM2BFsEBz0Fw37V0zU4CXfcfuACMrppsMFKdYY2WuTS3yi8O1nFOhil/xhKTmE1nPmVyvQJjJivgDT+xh8pXJA==} + engines: {node: '>=18'} + cpu: [s390x] + os: [linux] + '@esbuild/linux-s390x@0.25.10': resolution: {integrity: sha512-3BBSbgzuB9ajLoVZk0mGu+EHlBwkusRmeNYdqmznmMc9zGASFjSsxgkNsqmXugpPk00gJ0JNKh/97nxmjctdew==} engines: {node: '>=18'} @@ -1670,12 +1766,24 @@ packages: cpu: [x64] os: [linux] + '@esbuild/linux-x64@0.25.0': + resolution: {integrity: sha512-9yl91rHw/cpwMCNytUDxwj2XjFpxML0y9HAOH9pNVQDpQrBxHy01Dx+vaMu0N1CKa/RzBD2hB4u//nfc+Sd3Cw==} + engines: {node: '>=18'} + cpu: [x64] + os: [linux] + '@esbuild/linux-x64@0.25.10': resolution: {integrity: sha512-QSX81KhFoZGwenVyPoberggdW1nrQZSvfVDAIUXr3WqLRZGZqWk/P4T8p2SP+de2Sr5HPcvjhcJzEiulKgnxtA==} engines: {node: '>=18'} cpu: [x64] os: [linux] + '@esbuild/netbsd-arm64@0.25.0': + resolution: {integrity: sha512-RuG4PSMPFfrkH6UwCAqBzauBWTygTvb1nxWasEJooGSJ/NwRw7b2HOwyRTQIU97Hq37l3npXoZGYMy3b3xYvPw==} + engines: {node: '>=18'} + cpu: [arm64] + os: [netbsd] + '@esbuild/netbsd-arm64@0.25.10': resolution: {integrity: sha512-AKQM3gfYfSW8XRk8DdMCzaLUFB15dTrZfnX8WXQoOUpUBQ+NaAFCP1kPS/ykbbGYz7rxn0WS48/81l9hFl3u4A==} engines: {node: '>=18'} @@ -1688,12 +1796,24 @@ packages: cpu: [x64] os: [netbsd] + '@esbuild/netbsd-x64@0.25.0': + resolution: {integrity: sha512-jl+qisSB5jk01N5f7sPCsBENCOlPiS/xptD5yxOx2oqQfyourJwIKLRA2yqWdifj3owQZCL2sn6o08dBzZGQzA==} + engines: {node: '>=18'} + cpu: [x64] + os: [netbsd] + '@esbuild/netbsd-x64@0.25.10': resolution: {integrity: sha512-7RTytDPGU6fek/hWuN9qQpeGPBZFfB4zZgcz2VK2Z5VpdUxEI8JKYsg3JfO0n/Z1E/6l05n0unDCNc4HnhQGig==} engines: {node: '>=18'} cpu: [x64] os: [netbsd] + '@esbuild/openbsd-arm64@0.25.0': + resolution: {integrity: sha512-21sUNbq2r84YE+SJDfaQRvdgznTD8Xc0oc3p3iW/a1EVWeNj/SdUCbm5U0itZPQYRuRTW20fPMWMpcrciH2EJw==} + engines: {node: '>=18'} + cpu: [arm64] + os: [openbsd] + '@esbuild/openbsd-arm64@0.25.10': resolution: {integrity: sha512-5Se0VM9Wtq797YFn+dLimf2Zx6McttsH2olUBsDml+lm0GOCRVebRWUvDtkY4BWYv/3NgzS8b/UM3jQNh5hYyw==} engines: {node: '>=18'} @@ -1706,6 +1826,12 @@ packages: cpu: [x64] os: [openbsd] + '@esbuild/openbsd-x64@0.25.0': + resolution: {integrity: sha512-2gwwriSMPcCFRlPlKx3zLQhfN/2WjJ2NSlg5TKLQOJdV0mSxIcYNTMhk3H3ulL/cak+Xj0lY1Ym9ysDV1igceg==} + engines: {node: '>=18'} + cpu: [x64] + os: [openbsd] + '@esbuild/openbsd-x64@0.25.10': resolution: {integrity: sha512-XkA4frq1TLj4bEMB+2HnI0+4RnjbuGZfet2gs/LNs5Hc7D89ZQBHQ0gL2ND6Lzu1+QVkjp3x1gIcPKzRNP8bXw==} engines: {node: '>=18'} @@ -1724,6 +1850,12 @@ packages: cpu: [x64] os: [sunos] + '@esbuild/sunos-x64@0.25.0': + resolution: {integrity: sha512-bxI7ThgLzPrPz484/S9jLlvUAHYMzy6I0XiU1ZMeAEOBcS0VePBFxh1JjTQt3Xiat5b6Oh4x7UC7IwKQKIJRIg==} + engines: {node: '>=18'} + cpu: [x64] + os: [sunos] + '@esbuild/sunos-x64@0.25.10': resolution: {integrity: sha512-fswk3XT0Uf2pGJmOpDB7yknqhVkJQkAQOcW/ccVOtfx05LkbWOaRAtn5SaqXypeKQra1QaEa841PgrSL9ubSPQ==} engines: {node: '>=18'} @@ -1736,6 +1868,12 @@ packages: cpu: [arm64] os: [win32] + '@esbuild/win32-arm64@0.25.0': + resolution: {integrity: sha512-ZUAc2YK6JW89xTbXvftxdnYy3m4iHIkDtK3CLce8wg8M2L+YZhIvO1DKpxrd0Yr59AeNNkTiic9YLf6FTtXWMw==} + engines: {node: '>=18'} + cpu: [arm64] + os: [win32] + '@esbuild/win32-arm64@0.25.10': resolution: {integrity: sha512-ah+9b59KDTSfpaCg6VdJoOQvKjI33nTaQr4UluQwW7aEwZQsbMCfTmfEO4VyewOxx4RaDT/xCy9ra2GPWmO7Kw==} engines: {node: '>=18'} @@ -1748,6 +1886,12 @@ packages: cpu: [ia32] os: [win32] + '@esbuild/win32-ia32@0.25.0': + resolution: {integrity: sha512-eSNxISBu8XweVEWG31/JzjkIGbGIJN/TrRoiSVZwZ6pkC6VX4Im/WV2cz559/TXLcYbcrDN8JtKgd9DJVIo8GA==} + engines: {node: '>=18'} + cpu: [ia32] + os: [win32] + '@esbuild/win32-ia32@0.25.10': resolution: {integrity: sha512-QHPDbKkrGO8/cz9LKVnJU22HOi4pxZnZhhA2HYHez5Pz4JeffhDjf85E57Oyco163GnzNCVkZK0b/n4Y0UHcSw==} engines: {node: '>=18'} @@ -1760,6 +1904,12 @@ packages: cpu: [x64] os: [win32] + '@esbuild/win32-x64@0.25.0': + resolution: {integrity: sha512-ZENoHJBxA20C2zFzh6AI4fT6RraMzjYw4xKWemRTRmRVtN9c5DcH9r/f2ihEkMjOW5eGgrwCslG/+Y/3bL+DHQ==} + engines: {node: '>=18'} + cpu: [x64] + os: [win32] + '@esbuild/win32-x64@0.25.10': resolution: {integrity: sha512-9KpxSVFCu0iK1owoez6aC/s/EdUQLDN3adTxGCqxMVhrPDj6bt5dbrHDXUuq+Bs2vATFBBrQS5vdQ/Ed2P+nbw==} engines: {node: '>=18'} @@ -2295,14 +2445,6 @@ packages: '@types/node': optional: true - '@isaacs/balanced-match@4.0.1': - resolution: {integrity: sha512-yzMTt9lEb8Gv7zRioUilSglI0c0smZ9k5D65677DLWLtWJaXIS3CqcGyUFByYKlnUj6TkjLVs54fBl6+TiGQDQ==} - engines: {node: 20 || >=22} - - '@isaacs/brace-expansion@5.0.0': - resolution: {integrity: sha512-ZT55BDLV0yv0RBm2czMiZ+SqCGO7AvmOM3G/w2xhVPH+te0aKgFjmBvGlL1dH+ql2tgGO3MVrbb3jCKyvpgnxA==} - engines: {node: 20 || >=22} - '@isaacs/cliui@8.0.2': resolution: {integrity: sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==} engines: {node: '>=12'} @@ -2781,6 +2923,19 @@ packages: '@types/react-dom': optional: true + '@radix-ui/react-collection@1.1.1': + resolution: {integrity: sha512-LwT3pSho9Dljg+wY2KN2mrrh6y3qELfftINERIzBUO9e0N+t0oMTyn3k9iv+ZqgrwGkRnLpNJrsMv9BZlt2yuA==} + peerDependencies: + '@types/react': ^19.0.1 + '@types/react-dom': ^19.0.1 + react: ^19.0.0 + react-dom: ^19.0.0 + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + '@radix-ui/react-collection@1.1.7': resolution: {integrity: sha512-Fh9rGN0MoI4ZFUNyfFVNU4y9LUz93u9/0K+yLgA2bwRojxM8JU1DyvvMBabnZPBgMWREAJvU2jjVzq+LrFUglw==} peerDependencies: @@ -3210,6 +3365,19 @@ packages: '@types/react-dom': optional: true + '@radix-ui/react-roving-focus@1.1.1': + resolution: {integrity: sha512-QE1RoxPGJ/Nm8Qmk0PxP8ojmoaS67i0s7hVssS7KuI2FQoc/uzVlZsqKfQvxPE6D8hICCPHJ4D88zNhT3OOmkw==} + peerDependencies: + '@types/react': ^19.0.1 + '@types/react-dom': ^19.0.1 + react: ^19.0.0 + react-dom: ^19.0.0 + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + '@radix-ui/react-roving-focus@1.1.11': resolution: {integrity: sha512-7A6S9jSgm/S+7MdtNDSb+IU859vQqJ/QAtcYQcfFC6W8RS4IxIZDldLR0xqCFZ6DCyrQLjLPsxtTNch5jVA4lA==} peerDependencies: @@ -3276,6 +3444,19 @@ packages: '@types/react-dom': optional: true + '@radix-ui/react-tabs@1.1.2': + resolution: {integrity: sha512-9u/tQJMcC2aGq7KXpGivMm1mgq7oRJKXphDwdypPd/j21j/2znamPU8WkXgnhUaTrSFNIt8XhOyCAupg8/GbwQ==} + peerDependencies: + '@types/react': ^19.0.1 + '@types/react-dom': ^19.0.1 + react: ^19.0.0 + react-dom: ^19.0.0 + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + '@radix-ui/react-toggle-group@1.1.0': resolution: {integrity: sha512-PpTJV68dZU2oqqgq75Uzto5o/XfOVgkrJ9rulVmfTKxWp3HfUjHE6CP/WLRR4AzPX9HWxw7vFow2me85Yu+Naw==} peerDependencies: @@ -3512,6 +3693,100 @@ packages: '@radix-ui/rect@1.1.1': resolution: {integrity: sha512-HPwpGIzkl28mWyZqG52jiqDJ12waP11Pa1lGoiyUkIEuMLBP0oeK/C89esbXrxsky5we7dfd8U58nm0SgAWpVw==} + '@react-email/body@0.1.1-tailwindv4.0': + resolution: {integrity: sha512-9yWjQmQw6/XLeus6vnr4rB09hVlJUW0+MwCT8aqngfIfDNcxF0muzmGG4wyUwhtFtoxnECEaivVhjvuJDCEnuw==} + peerDependencies: + react: ^19.0.0 + + '@react-email/button@0.2.1-tailwindv4.0': + resolution: {integrity: sha512-Dl8JfMsYApz+Jd3z4TTHeeLVak0dxu8Ms7gWy8fwT9/tu49ULGYWf7t1AEYtHG1OH4HN2UrGIDErJn1ACMR8TQ==} + engines: {node: '>=18.0.0'} + peerDependencies: + react: ^19.0.0 + + '@react-email/code-block@0.1.1-tailwindv4.0': + resolution: {integrity: sha512-X9NV4lKKmGQobRU5t4B+OVe+RUtsOQ9Ej5HorFWFA0a3M0kaD8bbAvWgSD58S7mA2pFlwqhg7ti2ifMmQD+3Pw==} + engines: {node: '>=18.0.0'} + peerDependencies: + react: ^19.0.0 + + '@react-email/code-inline@0.0.6-tailwindv4.0': + resolution: {integrity: sha512-2cZ1tzmVfKe4O3Xom/yEgBfNGrGS763xDLnhCter8R2GYUNBUEjJjAz/pXLiFjpqvSWPPH3elwowqURIB3orjQ==} + engines: {node: '>=18.0.0'} + peerDependencies: + react: ^19.0.0 + + '@react-email/column@0.0.13': + resolution: {integrity: sha512-Lqq17l7ShzJG/d3b1w/+lVO+gp2FM05ZUo/nW0rjxB8xBICXOVv6PqjDnn3FXKssvhO5qAV20lHM6S+spRhEwQ==} + engines: {node: '>=18.0.0'} + peerDependencies: + react: ^19.0.0 + + '@react-email/components@1.0.0-tailwindv4.5': + resolution: {integrity: sha512-q12JqHQk0r1ET4g5TS9pETKz38NrNCzdQlUp4rilpdfO8D5Ivjd5ly6ft7jRN+op7H+bmBl+bDkSJq8qfncmzQ==} + engines: {node: '>=18.0.0'} + peerDependencies: + react: ^19.0.0 + + '@react-email/container@0.0.16-tailwindv4.0': + resolution: {integrity: sha512-RUgvF17EDOgjxwvPejNRf3j9w4PplHfBecRa/5vpL3QdTWrETIBIXDJCprStTNkjo81y+sD49iDwDcKuohMjWw==} + engines: {node: '>=18.0.0'} + peerDependencies: + react: ^19.0.0 + + '@react-email/font@0.0.9': + resolution: {integrity: sha512-4zjq23oT9APXkerqeslPH3OZWuh5X4crHK6nx82mVHV2SrLba8+8dPEnWbaACWTNjOCbcLIzaC9unk7Wq2MIXw==} + peerDependencies: + react: ^19.0.0 + + '@react-email/head@0.0.12': + resolution: {integrity: sha512-X2Ii6dDFMF+D4niNwMAHbTkeCjlYYnMsd7edXOsi0JByxt9wNyZ9EnhFiBoQdqkE+SMDcu8TlNNttMrf5sJeMA==} + engines: {node: '>=18.0.0'} + peerDependencies: + react: ^19.0.0 + + '@react-email/heading@0.0.16-tailwindv4.0': + resolution: {integrity: sha512-WbcKUHcCkyoaQZceNf/RmhSe/qqnRJnWrg13IFwCM3/7i7zFqMZz7XiLsyraOeqKPafb3K9/OZW3iM7oYy0TiA==} + engines: {node: '>=18.0.0'} + peerDependencies: + react: ^19.0.0 + + '@react-email/hr@0.0.12-tailwindv4.0': + resolution: {integrity: sha512-N4cmqCuNt/35WjwiTsAl2YjMn/0JEF5BIkgdW5NbT3bypJq9uD6IuDrZuoQdhQF/U6nXKoAnDDM0olOJI5Fvfg==} + engines: {node: '>=18.0.0'} + peerDependencies: + react: ^19.0.0 + + '@react-email/html@0.0.11': + resolution: {integrity: sha512-qJhbOQy5VW5qzU74AimjAR9FRFQfrMa7dn4gkEXKMB/S9xZN8e1yC1uA9C15jkXI/PzmJ0muDIWmFwatm5/+VA==} + engines: {node: '>=18.0.0'} + peerDependencies: + react: ^19.0.0 + + '@react-email/img@0.0.12-tailwindv4.0': + resolution: {integrity: sha512-fyux6rY919CvYyQ3naIwIFEFwWsLVhwOdUDOrVkpjypB/5f4E39niM74xaMr/u1CNcWsxINwxlryp44tjAHGhw==} + engines: {node: '>=18.0.0'} + peerDependencies: + react: ^19.0.0 + + '@react-email/link@0.0.13-tailwindv4.0': + resolution: {integrity: sha512-undFRiSltzPPdMmk/9OhAitDMqPxASiKo3ee9MSPUHyMz8VsaJmy8TPgOH/j6D30TObfcmH0fCQTrWH28qqbJw==} + engines: {node: '>=18.0.0'} + peerDependencies: + react: ^19.0.0 + + '@react-email/markdown@0.0.15': + resolution: {integrity: sha512-UQA9pVm5sbflgtg3EX3FquUP4aMBzmLReLbGJ6DZQZnAskBF36aI56cRykDq1o+1jT+CKIK1CducPYziaXliag==} + engines: {node: '>=18.0.0'} + peerDependencies: + react: ^19.0.0 + + '@react-email/preview@0.0.14-tailwindv4.0': + resolution: {integrity: sha512-20IIqdGeSGGWAy0hKvAS2XoQX1muE1K8wLYVyJBFNpX/ghuKUeSDno72Xb8egUFHGlDVwM5q735j7bXpH1/bgg==} + engines: {node: '>=18.0.0'} + peerDependencies: + react: ^19.0.0 + '@react-email/render@1.0.6': resolution: {integrity: sha512-zNueW5Wn/4jNC1c5LFgXzbUdv5Lhms+FWjOvWAhal7gx5YVf0q6dPJ0dnR70+ifo59gcMLwCZEaTS9EEuUhKvQ==} engines: {node: '>=18.0.0'} @@ -3519,12 +3794,31 @@ packages: react: ^19.0.0 react-dom: ^19.0.0 + '@react-email/render@1.3.2': + resolution: {integrity: sha512-oq8/BD/I/YspeuBjjdLJG6xaf9tsPYk+VWu8/mX9xWbRN0t0ExKSVm9sEBL6RsCpndQA2jbY2VgPEreIrzUgqw==} + engines: {node: '>=18.0.0'} + peerDependencies: + react: ^19.0.0 + react-dom: ^19.0.0 + + '@react-email/row@0.0.12': + resolution: {integrity: sha512-HkCdnEjvK3o+n0y0tZKXYhIXUNPDx+2vq1dJTmqappVHXS5tXS6W5JOPZr5j+eoZ8gY3PShI2LWj5rWF7ZEtIQ==} + engines: {node: '>=18.0.0'} + peerDependencies: + react: ^19.0.0 + '@react-email/section@0.0.14': resolution: {integrity: sha512-+fYWLb4tPU1A/+GE5J1+SEMA7/wR3V30lQ+OR9t2kAJqNrARDbMx0bLnYnR1QL5TiFRz0pCF05SQUobk6gHEDQ==} engines: {node: '>=18.0.0'} peerDependencies: react: ^19.0.0 + '@react-email/section@0.0.16': + resolution: {integrity: sha512-FjqF9xQ8FoeUZYKSdt8sMIKvoT9XF8BrzhT3xiFKdEMwYNbsDflcjfErJe3jb7Wj/es/lKTbV5QR1dnLzGpL3w==} + engines: {node: '>=18.0.0'} + peerDependencies: + react: ^19.0.0 + '@react-email/tailwind@0.0.12': resolution: {integrity: sha512-s8Ch7GL30qRKScn9NWwItMqxjtzbyUtCnXfC6sL2YTVtulbfvZZ06W+aA0S6f7fdrVlOOlQzZuK/sVaQCHhcSw==} engines: {node: '>=18.0.0'} @@ -3537,6 +3831,18 @@ packages: peerDependencies: react: ^19.0.0 + '@react-email/tailwind@2.0.0-tailwindv4.3': + resolution: {integrity: sha512-uuTYJY+UZdq6mtq/wh2CANjsYv79DpcgVLFg5yBlME0DNHO+nQ5IHVNckVvWlvs2maS6IP8sUYWxuFgYqUvf6w==} + engines: {node: '>=18.0.0'} + peerDependencies: + react: ^19.0.0 + + '@react-email/text@0.1.6-tailwindv4.0': + resolution: {integrity: sha512-IVoq2zqCzokjbeEtpFw0VgfL2z7O2K+BTG8nWMZKofUf8UX66X3JwdOGRw/K6U3XS6IahE9gy3yycX7rqn3gKw==} + engines: {node: '>=18.0.0'} + peerDependencies: + react: ^19.0.0 + '@react-spring/animated@9.7.5': resolution: {integrity: sha512-Tqrwz7pIlsSDITzxoLS3n/v/YCUHQdOIKtOJf4yL6kYVSDTSmVK1LI1Q3M/uu2Sx4X3pIWF3xLUhlsA6SPNTNg==} peerDependencies: @@ -4488,16 +4794,12 @@ packages: resolution: {integrity: sha512-7HSX4QQb4CspciLpVFwyRe79O3xsIZDDLER21kERQ71oaPodF8jL725AgJMFAYbooIqolJoRLuM81SpeUkpkvA==} engines: {node: '>=12'} - ansi-regex@6.2.2: - resolution: {integrity: sha512-Bq3SmSpyFHaWjPk8If9yc6svM8c56dB5BAtW4Qbw5jHTwwXXcTLoRMkpDJp6VL0XzlWaCHTXrkFURMYmD0sLqg==} - engines: {node: '>=12'} - ansi-styles@4.3.0: resolution: {integrity: sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==} engines: {node: '>=8'} - ansi-styles@6.2.3: - resolution: {integrity: sha512-4Dj6M28JB+oAH8kFkTLUo+a2jwOFkuqb3yucU0CANcRRUbxS0cP0nZYCGjcc3BNXwRIsUVmDGgzawme7zvJHvg==} + ansi-styles@6.2.1: + resolution: {integrity: sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==} engines: {node: '>=12'} ansis@4.1.0: @@ -5364,6 +5666,11 @@ packages: engines: {node: '>=12'} hasBin: true + esbuild@0.25.0: + resolution: {integrity: sha512-BXq5mqc8ltbaN34cDqWuYKyNhX8D/Z0J1xdtdQ8UcIIIyJyz+ZMKUt58tF3SrZ85jcfN/PZYhjR5uDQAYNVbuw==} + engines: {node: '>=18'} + hasBin: true + esbuild@0.25.10: resolution: {integrity: sha512-9RiGKvCwaqxO2owP61uQ4BgNborAQskMR6QusfWzQqv7AZOg5oGehdY2pRJMTKuwxd1IDBP4rSbI5lHzU7SMsQ==} engines: {node: '>=18'} @@ -5686,8 +5993,8 @@ packages: resolution: {integrity: sha512-zJ2mQYM18rEFOudeV4GShTGIQ7RbzA7ozbU9I/XBpm7kqgMywgmylMwXHxZJmkVoYkna9d2pVXVXPdYTP9ej8Q==} engines: {node: '>= 0.6'} - fs-extra@11.3.2: - resolution: {integrity: sha512-Xr9F6z6up6Ws+NjzMCZc6WXg2YFRlrLP9NQDO3VQrWrfiojdhS56TzueT88ze0uBdCTwEIhQ3ptnmKeWGFAe0A==} + fs-extra@11.3.0: + resolution: {integrity: sha512-Z4XaCL6dUDHfP/jT25jJKMmtxvuwbkrD1vNSMFlo9lNLY2c5FHYSQgHPRZUjAB26TpDEoW9HCOgplrdbaPV/ew==} engines: {node: '>=14.14'} fs-extra@7.0.1: @@ -5793,8 +6100,8 @@ packages: resolution: {integrity: sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg==} hasBin: true - glob@11.0.3: - resolution: {integrity: sha512-2Nim7dha1KVkaiF4q6Dj+ngPPMdfvLJEOpZk/jKiUAkqKebpGAWQXAq9z1xu9HKu5lWfqw/FASuccEjyznjPaA==} + glob@11.0.1: + resolution: {integrity: sha512-zrQDm8XPnYEKawJScsnM0QzobJxlT/kHOOlRTio8IH/GrmxRE5fjllkzdaHclIuNjUQTJYH2xHNIGfdpJkDJUw==} engines: {node: 20 || >=22} hasBin: true @@ -6287,8 +6594,8 @@ packages: jackspeak@3.4.3: resolution: {integrity: sha512-OGlZQpz2yfahA/Rd1Y8Cd9SIEsqvXkLVoSw/cgwhnhFMDbsQFeZYoJJ7bIZBS9BcamUW96asq/npPWugM+RQBw==} - jackspeak@4.1.1: - resolution: {integrity: sha512-zptv57P3GpL+O0I7VdMJNBZCu+BPHVQUk55Ft8/QCJjTVxrnJHuVuX/0Bl2A6/+2oyR/ZMEuFKwmzqqZ/U5nPQ==} + jackspeak@4.1.0: + resolution: {integrity: sha512-9DDdhb5j6cpeitCbvLO7n7J4IxnbM6hoF6O1g4HQ5TfhvvKN8ywDM7668ZhMHRqVmxqhps/F6syWK2KcPxYlkw==} engines: {node: 20 || >=22} jest-worker@27.5.1: @@ -6371,8 +6678,8 @@ packages: jsonfile@4.0.0: resolution: {integrity: sha512-m6F1R3z8jjlf2imQHS2Qez5sjKWQzbuuhuJ/FKYFRZvPE3PuHcSMVZzfsLhGVOkfd20obL5SWEBew5ShlquNxg==} - jsonfile@6.2.0: - resolution: {integrity: sha512-FGuPw30AdOIUTRMC2OMRtQV+jkVj2cfPqSeWXv1NEAJ1qZ5zb1X6z1mFhbfOB/iy3ssJCD+3KuZ8r8C3uVFlAg==} + jsonfile@6.1.0: + resolution: {integrity: sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==} jsonpath-plus@10.3.0: resolution: {integrity: sha512-8TNmfeTCk2Le33A3vRRwtuworG/L5RrgMvdjhKZxvyShO+mBu2fP50OWUjRLNtvw344DdDarFh9buFAZs5ujeA==} @@ -6473,8 +6780,8 @@ packages: resolution: {integrity: sha512-i24m8rpwhmPIS4zscNzK6MSEhk0DUWa/8iYQWxhffV8jkI4Phvs3F+quL5xvS0gdQR0FyTCMMH33Y78dDTzzIw==} engines: {node: '>=18'} - log-symbols@7.0.1: - resolution: {integrity: sha512-ja1E3yCr9i/0hmBVaM0bfwDjnGy8I/s6PP4DFp+yP+a+mrHO4Rm7DtmnqROTUkHIkqffC84YY7AeqX6oFk0WFg==} + log-symbols@7.0.0: + resolution: {integrity: sha512-zrc91EDk2M+2AXo/9BTvK91pqb7qrPg2nX/Hy+u8a5qQlbaOflCKO+6SqgZ+M+xUFxGdKTgwnGiL96b1W3ikRA==} engines: {node: '>=18'} longest-streak@3.1.0: @@ -6497,8 +6804,8 @@ packages: lru-cache@10.4.3: resolution: {integrity: sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==} - lru-cache@11.2.2: - resolution: {integrity: sha512-F9ODfyqML2coTIsQpSkRHnLSZMtkU8Q+mSfcaIyKwy58u+8k5nvAYeiNhsyMARvzNcXJ9QfWVrcPsC9e9rAxtg==} + lru-cache@11.1.0: + resolution: {integrity: sha512-QIXZUBJUx+2zHUdQujWejBkcD9+cs94tLn0+YL8UrCh+D5sCXZ4c7LaEH48pNwRY3MLDgqUFyhlCyjJPf1WP0A==} engines: {node: 20 || >=22} lru-cache@5.1.1: @@ -6786,8 +7093,8 @@ packages: resolution: {integrity: sha512-e5ISH9xMYU0DzrT+jl8q2ze9D6eWBto+I8CNpe+VI+K2J/F/k3PdkdTdz4wvGVH4NTpo+NRYTVIuMQEMMcsLqg==} engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0} - minimatch@10.0.3: - resolution: {integrity: sha512-IPZ167aShDZZUMdRk66cyQAW3qr0WzbHkPdMYa8bzZhlHhO3jALbKdxcaak7W9FfT2rZNpQuUu4Od7ILEpXSaw==} + minimatch@10.0.1: + resolution: {integrity: sha512-ethXTt3SGGR+95gudmqJ1eNhRO7eGEGIgYA9vnPatK4/etz2MEVDno5GMCibdMTuBMyElzIlgxMna3K94XDIDQ==} engines: {node: 20 || >=22} minimatch@3.0.8: @@ -7523,6 +7830,16 @@ packages: '@types/react': optional: true + react-remove-scroll@2.6.2: + resolution: {integrity: sha512-KmONPx5fnlXYJQqC62Q+lwIeAk64ws/cUw6omIumRzMRPqgnYqhSSti99nbj0Ry13bv7dF+BKn7NB+OqkdZGTw==} + engines: {node: '>=10'} + peerDependencies: + '@types/react': ^19.0.1 + react: ^19.0.0 + peerDependenciesMeta: + '@types/react': + optional: true + react-remove-scroll@2.6.3: resolution: {integrity: sha512-pnAi91oOk8g8ABQKGF5/M9qxmmOPxaAnopyTHYfqYEwJhyFrbbBtHuSgtKEoH0jpcxx5o3hXqH1mNd9/Oi+8iQ==} engines: {node: '>=10'} @@ -8103,10 +8420,6 @@ packages: resolution: {integrity: sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==} engines: {node: '>=12'} - strip-ansi@7.1.2: - resolution: {integrity: sha512-gmBGslpoQJtgnMAvOVqGZpEz9dyoKTCzy2nfz/n8aIFhN/jCE/rCmcxabB6jOOHV+0WNnylOxaxBQPSvcWklhA==} - engines: {node: '>=12'} - strip-bom-string@1.0.0: resolution: {integrity: sha512-uCC2VHvQRYu+lMh4My/sFNmF2klFymLX1wHJeXnbEJERpV/ZsVuonzerjfrGpIGF7LBVa1O7i9kjiWvJiFck8g==} engines: {node: '>=0.10.0'} @@ -8206,6 +8519,9 @@ packages: engines: {node: '>=14.0.0'} hasBin: true + tailwindcss@4.1.12: + resolution: {integrity: sha512-DzFtxOi+7NsFf7DBtI3BJsynR+0Yp6etH+nRPTbpWnS2pZBaSksv/JGctNwSWzbFjp0vxSqknaUylseZqMDGrA==} + tapable@2.2.1: resolution: {integrity: sha512-GNzQvQTOIP6RyTfE2Qxb8ZVlNmw0n88vp1szwWRimP02mnTsx3Wtn5qRdqY9w2XduFNUgvOwhNnQsjwCp+kqaQ==} engines: {node: '>=6'} @@ -8967,8 +9283,8 @@ packages: resolution: {integrity: sha512-cYVsTjKl8b+FrnidjibDWskAv7UKOfcwaVZdp/it9n1s9fU3IkgDbhdIRKCW4JDsAlECJY0ytoVPT3sK6kideA==} engines: {node: '>=18'} - yoctocolors@2.1.2: - resolution: {integrity: sha512-CzhO+pFNo8ajLM2d2IW/R93ipy99LWjtwblvC1RsoSUMZgyLbYFr221TnSNT7GjGdYui6P459mw9JH/g/zW2ug==} + yoctocolors@2.1.1: + resolution: {integrity: sha512-GQHQqAopRhwU8Kt1DDM8NjibDXHC8eoh1erhGAJPEyveY9qqVeXvVikNKrDz69sHowPMorbPUrH/mx8c50eiBQ==} engines: {node: '>=18'} zod-package-json@1.1.0: @@ -9624,120 +9940,183 @@ snapshots: '@esbuild/aix-ppc64@0.19.11': optional: true + '@esbuild/aix-ppc64@0.25.0': + optional: true + '@esbuild/aix-ppc64@0.25.10': optional: true '@esbuild/android-arm64@0.19.11': optional: true + '@esbuild/android-arm64@0.25.0': + optional: true + '@esbuild/android-arm64@0.25.10': optional: true '@esbuild/android-arm@0.19.11': optional: true + '@esbuild/android-arm@0.25.0': + optional: true + '@esbuild/android-arm@0.25.10': optional: true '@esbuild/android-x64@0.19.11': optional: true + '@esbuild/android-x64@0.25.0': + optional: true + '@esbuild/android-x64@0.25.10': optional: true '@esbuild/darwin-arm64@0.19.11': optional: true + '@esbuild/darwin-arm64@0.25.0': + optional: true + '@esbuild/darwin-arm64@0.25.10': optional: true '@esbuild/darwin-x64@0.19.11': optional: true + '@esbuild/darwin-x64@0.25.0': + optional: true + '@esbuild/darwin-x64@0.25.10': optional: true '@esbuild/freebsd-arm64@0.19.11': optional: true + '@esbuild/freebsd-arm64@0.25.0': + optional: true + '@esbuild/freebsd-arm64@0.25.10': optional: true '@esbuild/freebsd-x64@0.19.11': optional: true + '@esbuild/freebsd-x64@0.25.0': + optional: true + '@esbuild/freebsd-x64@0.25.10': optional: true '@esbuild/linux-arm64@0.19.11': optional: true + '@esbuild/linux-arm64@0.25.0': + optional: true + '@esbuild/linux-arm64@0.25.10': optional: true '@esbuild/linux-arm@0.19.11': optional: true + '@esbuild/linux-arm@0.25.0': + optional: true + '@esbuild/linux-arm@0.25.10': optional: true '@esbuild/linux-ia32@0.19.11': optional: true + '@esbuild/linux-ia32@0.25.0': + optional: true + '@esbuild/linux-ia32@0.25.10': optional: true '@esbuild/linux-loong64@0.19.11': optional: true + '@esbuild/linux-loong64@0.25.0': + optional: true + '@esbuild/linux-loong64@0.25.10': optional: true '@esbuild/linux-mips64el@0.19.11': optional: true + '@esbuild/linux-mips64el@0.25.0': + optional: true + '@esbuild/linux-mips64el@0.25.10': optional: true '@esbuild/linux-ppc64@0.19.11': optional: true + '@esbuild/linux-ppc64@0.25.0': + optional: true + '@esbuild/linux-ppc64@0.25.10': optional: true '@esbuild/linux-riscv64@0.19.11': optional: true + '@esbuild/linux-riscv64@0.25.0': + optional: true + '@esbuild/linux-riscv64@0.25.10': optional: true '@esbuild/linux-s390x@0.19.11': optional: true + '@esbuild/linux-s390x@0.25.0': + optional: true + '@esbuild/linux-s390x@0.25.10': optional: true '@esbuild/linux-x64@0.19.11': optional: true + '@esbuild/linux-x64@0.25.0': + optional: true + '@esbuild/linux-x64@0.25.10': optional: true + '@esbuild/netbsd-arm64@0.25.0': + optional: true + '@esbuild/netbsd-arm64@0.25.10': optional: true '@esbuild/netbsd-x64@0.19.11': optional: true + '@esbuild/netbsd-x64@0.25.0': + optional: true + '@esbuild/netbsd-x64@0.25.10': optional: true + '@esbuild/openbsd-arm64@0.25.0': + optional: true + '@esbuild/openbsd-arm64@0.25.10': optional: true '@esbuild/openbsd-x64@0.19.11': optional: true + '@esbuild/openbsd-x64@0.25.0': + optional: true + '@esbuild/openbsd-x64@0.25.10': optional: true @@ -9747,24 +10126,36 @@ snapshots: '@esbuild/sunos-x64@0.19.11': optional: true + '@esbuild/sunos-x64@0.25.0': + optional: true + '@esbuild/sunos-x64@0.25.10': optional: true '@esbuild/win32-arm64@0.19.11': optional: true + '@esbuild/win32-arm64@0.25.0': + optional: true + '@esbuild/win32-arm64@0.25.10': optional: true '@esbuild/win32-ia32@0.19.11': optional: true + '@esbuild/win32-ia32@0.25.0': + optional: true + '@esbuild/win32-ia32@0.25.10': optional: true '@esbuild/win32-x64@0.19.11': optional: true + '@esbuild/win32-x64@0.25.0': + optional: true + '@esbuild/win32-x64@0.25.10': optional: true @@ -10192,17 +10583,11 @@ snapshots: optionalDependencies: '@types/node': 22.14.1 - '@isaacs/balanced-match@4.0.1': {} - - '@isaacs/brace-expansion@5.0.0': - dependencies: - '@isaacs/balanced-match': 4.0.1 - '@isaacs/cliui@8.0.2': dependencies: string-width: 5.1.2 string-width-cjs: string-width@4.2.3 - strip-ansi: 7.1.2 + strip-ansi: 7.1.0 strip-ansi-cjs: strip-ansi@6.0.1 wrap-ansi: 8.1.0 wrap-ansi-cjs: wrap-ansi@7.0.0 @@ -10368,7 +10753,7 @@ snapshots: '@mintlify/validation': 0.1.398 chalk: 5.4.0 detect-port: 1.6.1 - fs-extra: 11.3.2 + fs-extra: 11.3.0 inquirer: 12.4.2(@types/node@22.14.1) js-yaml: 4.1.0 ora: 6.1.2 @@ -10437,7 +10822,7 @@ snapshots: dependencies: '@mintlify/common': 1.0.428(@types/react@19.0.1)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mintlify/prebuild': 1.0.543(@types/react@19.0.1)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)(typescript@5.8.3) - fs-extra: 11.3.2 + fs-extra: 11.3.0 unist-util-visit: 4.1.2 transitivePeerDependencies: - '@types/react' @@ -10496,7 +10881,7 @@ snapshots: axios: 1.7.9 chalk: 5.4.0 favicons: 7.2.0 - fs-extra: 11.3.2 + fs-extra: 11.3.0 gray-matter: 4.0.3 js-yaml: 4.1.0 mdast: 3.0.0 @@ -10523,7 +10908,7 @@ snapshots: chalk: 5.4.0 chokidar: 3.6.0 express: 4.21.2 - fs-extra: 11.3.2 + fs-extra: 11.3.0 got: 13.0.0 gray-matter: 4.0.3 is-online: 10.0.0 @@ -10551,7 +10936,7 @@ snapshots: dependencies: '@mintlify/common': 1.0.428(@types/react@19.0.1)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mintlify/openapi-parser': 0.0.7 - fs-extra: 11.3.2 + fs-extra: 11.3.0 hast-util-to-mdast: 10.1.2 js-yaml: 4.1.0 mdast-util-mdx-jsx: 3.2.0 @@ -10869,6 +11254,18 @@ snapshots: '@types/react': 19.0.1 '@types/react-dom': 19.0.1 + '@radix-ui/react-collection@1.1.1(@types/react-dom@19.0.1)(@types/react@19.0.1)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)': + dependencies: + '@radix-ui/react-compose-refs': 1.1.1(@types/react@19.0.1)(react@19.0.0) + '@radix-ui/react-context': 1.1.1(@types/react@19.0.1)(react@19.0.0) + '@radix-ui/react-primitive': 2.0.1(@types/react-dom@19.0.1)(@types/react@19.0.1)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + '@radix-ui/react-slot': 1.1.1(@types/react@19.0.1)(react@19.0.0) + react: 19.0.0 + react-dom: 19.0.0(react@19.0.0) + optionalDependencies: + '@types/react': 19.0.1 + '@types/react-dom': 19.0.1 + '@radix-ui/react-collection@1.1.7(@types/react-dom@19.0.1)(@types/react@19.0.1)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)': dependencies: '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.0.1)(react@19.0.0) @@ -10934,7 +11331,7 @@ snapshots: aria-hidden: 1.2.4 react: 19.0.0 react-dom: 19.0.0(react@19.0.0) - react-remove-scroll: 2.6.3(@types/react@19.0.1)(react@19.0.0) + react-remove-scroll: 2.6.2(@types/react@19.0.1)(react@19.0.0) optionalDependencies: '@types/react': 19.0.1 '@types/react-dom': 19.0.1 @@ -11282,6 +11679,23 @@ snapshots: '@types/react': 19.0.1 '@types/react-dom': 19.0.1 + '@radix-ui/react-roving-focus@1.1.1(@types/react-dom@19.0.1)(@types/react@19.0.1)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)': + dependencies: + '@radix-ui/primitive': 1.1.1 + '@radix-ui/react-collection': 1.1.1(@types/react-dom@19.0.1)(@types/react@19.0.1)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + '@radix-ui/react-compose-refs': 1.1.1(@types/react@19.0.1)(react@19.0.0) + '@radix-ui/react-context': 1.1.1(@types/react@19.0.1)(react@19.0.0) + '@radix-ui/react-direction': 1.1.0(@types/react@19.0.1)(react@19.0.0) + '@radix-ui/react-id': 1.1.0(@types/react@19.0.1)(react@19.0.0) + '@radix-ui/react-primitive': 2.0.1(@types/react-dom@19.0.1)(@types/react@19.0.1)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + '@radix-ui/react-use-callback-ref': 1.1.0(@types/react@19.0.1)(react@19.0.0) + '@radix-ui/react-use-controllable-state': 1.1.0(@types/react@19.0.1)(react@19.0.0) + react: 19.0.0 + react-dom: 19.0.0(react@19.0.0) + optionalDependencies: + '@types/react': 19.0.1 + '@types/react-dom': 19.0.1 + '@radix-ui/react-roving-focus@1.1.11(@types/react-dom@19.0.1)(@types/react@19.0.1)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)': dependencies: '@radix-ui/primitive': 1.1.3 @@ -11365,6 +11779,22 @@ snapshots: '@types/react': 19.0.1 '@types/react-dom': 19.0.1 + '@radix-ui/react-tabs@1.1.2(@types/react-dom@19.0.1)(@types/react@19.0.1)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)': + dependencies: + '@radix-ui/primitive': 1.1.1 + '@radix-ui/react-context': 1.1.1(@types/react@19.0.1)(react@19.0.0) + '@radix-ui/react-direction': 1.1.0(@types/react@19.0.1)(react@19.0.0) + '@radix-ui/react-id': 1.1.0(@types/react@19.0.1)(react@19.0.0) + '@radix-ui/react-presence': 1.1.2(@types/react-dom@19.0.1)(@types/react@19.0.1)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + '@radix-ui/react-primitive': 2.0.1(@types/react-dom@19.0.1)(@types/react@19.0.1)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + '@radix-ui/react-roving-focus': 1.1.1(@types/react-dom@19.0.1)(@types/react@19.0.1)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + '@radix-ui/react-use-controllable-state': 1.1.0(@types/react@19.0.1)(react@19.0.0) + react: 19.0.0 + react-dom: 19.0.0(react@19.0.0) + optionalDependencies: + '@types/react': 19.0.1 + '@types/react-dom': 19.0.1 + '@radix-ui/react-toggle-group@1.1.0(@types/react-dom@19.0.1)(@types/react@19.0.1)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)': dependencies: '@radix-ui/primitive': 1.1.0 @@ -11573,6 +12003,94 @@ snapshots: '@radix-ui/rect@1.1.1': {} + '@react-email/body@0.1.1-tailwindv4.0(react@19.0.0)': + dependencies: + react: 19.0.0 + + '@react-email/button@0.2.1-tailwindv4.0(react@19.0.0)': + dependencies: + react: 19.0.0 + + '@react-email/code-block@0.1.1-tailwindv4.0(react@19.0.0)': + dependencies: + prismjs: 1.30.0 + react: 19.0.0 + + '@react-email/code-inline@0.0.6-tailwindv4.0(react@19.0.0)': + dependencies: + react: 19.0.0 + + '@react-email/column@0.0.13(react@19.0.0)': + dependencies: + react: 19.0.0 + + '@react-email/components@1.0.0-tailwindv4.5(react-dom@19.0.0(react@19.0.0))(react@19.0.0)': + dependencies: + '@react-email/body': 0.1.1-tailwindv4.0(react@19.0.0) + '@react-email/button': 0.2.1-tailwindv4.0(react@19.0.0) + '@react-email/code-block': 0.1.1-tailwindv4.0(react@19.0.0) + '@react-email/code-inline': 0.0.6-tailwindv4.0(react@19.0.0) + '@react-email/column': 0.0.13(react@19.0.0) + '@react-email/container': 0.0.16-tailwindv4.0(react@19.0.0) + '@react-email/font': 0.0.9(react@19.0.0) + '@react-email/head': 0.0.12(react@19.0.0) + '@react-email/heading': 0.0.16-tailwindv4.0(react@19.0.0) + '@react-email/hr': 0.0.12-tailwindv4.0(react@19.0.0) + '@react-email/html': 0.0.11(react@19.0.0) + '@react-email/img': 0.0.12-tailwindv4.0(react@19.0.0) + '@react-email/link': 0.0.13-tailwindv4.0(react@19.0.0) + '@react-email/markdown': 0.0.15(react@19.0.0) + '@react-email/preview': 0.0.14-tailwindv4.0(react@19.0.0) + '@react-email/render': 1.3.2(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + '@react-email/row': 0.0.12(react@19.0.0) + '@react-email/section': 0.0.16(react@19.0.0) + '@react-email/tailwind': 2.0.0-tailwindv4.3(react@19.0.0) + '@react-email/text': 0.1.6-tailwindv4.0(react@19.0.0) + react: 19.0.0 + transitivePeerDependencies: + - react-dom + + '@react-email/container@0.0.16-tailwindv4.0(react@19.0.0)': + dependencies: + react: 19.0.0 + + '@react-email/font@0.0.9(react@19.0.0)': + dependencies: + react: 19.0.0 + + '@react-email/head@0.0.12(react@19.0.0)': + dependencies: + react: 19.0.0 + + '@react-email/heading@0.0.16-tailwindv4.0(react@19.0.0)': + dependencies: + react: 19.0.0 + + '@react-email/hr@0.0.12-tailwindv4.0(react@19.0.0)': + dependencies: + react: 19.0.0 + + '@react-email/html@0.0.11(react@19.0.0)': + dependencies: + react: 19.0.0 + + '@react-email/img@0.0.12-tailwindv4.0(react@19.0.0)': + dependencies: + react: 19.0.0 + + '@react-email/link@0.0.13-tailwindv4.0(react@19.0.0)': + dependencies: + react: 19.0.0 + + '@react-email/markdown@0.0.15(react@19.0.0)': + dependencies: + md-to-react-email: 5.0.5(react@19.0.0) + react: 19.0.0 + + '@react-email/preview@0.0.14-tailwindv4.0(react@19.0.0)': + dependencies: + react: 19.0.0 + '@react-email/render@1.0.6(react-dom@19.0.0(react@19.0.0))(react@19.0.0)': dependencies: html-to-text: 9.0.5 @@ -11581,10 +12099,26 @@ snapshots: react-dom: 19.0.0(react@19.0.0) react-promise-suspense: 0.3.4 + '@react-email/render@1.3.2(react-dom@19.0.0(react@19.0.0))(react@19.0.0)': + dependencies: + html-to-text: 9.0.5 + prettier: 3.5.3 + react: 19.0.0 + react-dom: 19.0.0(react@19.0.0) + react-promise-suspense: 0.3.4 + + '@react-email/row@0.0.12(react@19.0.0)': + dependencies: + react: 19.0.0 + '@react-email/section@0.0.14(react@19.0.0)': dependencies: react: 19.0.0 + '@react-email/section@0.0.16(react@19.0.0)': + dependencies: + react: 19.0.0 + '@react-email/tailwind@0.0.12(react@19.0.0)': dependencies: react: 19.0.0 @@ -11597,6 +12131,15 @@ snapshots: dependencies: react: 19.0.0 + '@react-email/tailwind@2.0.0-tailwindv4.3(react@19.0.0)': + dependencies: + react: 19.0.0 + tailwindcss: 4.1.12 + + '@react-email/text@0.1.6-tailwindv4.0(react@19.0.0)': + dependencies: + react: 19.0.0 + '@react-spring/animated@9.7.5(react@19.0.0)': dependencies: '@react-spring/shared': 9.7.5(react@19.0.0) @@ -11817,7 +12360,7 @@ snapshots: ajv: 8.13.0 ajv-draft-04: 1.0.0(ajv@8.13.0) ajv-formats: 3.0.1(ajv@8.13.0) - fs-extra: 11.3.2 + fs-extra: 11.3.0 import-lazy: 4.0.0 jju: 1.4.0 resolve: 1.22.9 @@ -12665,13 +13208,11 @@ snapshots: ansi-regex@6.1.0: {} - ansi-regex@6.2.2: {} - ansi-styles@4.3.0: dependencies: color-convert: 2.0.1 - ansi-styles@6.2.3: {} + ansi-styles@6.2.1: {} ansis@4.1.0: {} @@ -13600,6 +14141,34 @@ snapshots: '@esbuild/win32-ia32': 0.19.11 '@esbuild/win32-x64': 0.19.11 + esbuild@0.25.0: + optionalDependencies: + '@esbuild/aix-ppc64': 0.25.0 + '@esbuild/android-arm': 0.25.0 + '@esbuild/android-arm64': 0.25.0 + '@esbuild/android-x64': 0.25.0 + '@esbuild/darwin-arm64': 0.25.0 + '@esbuild/darwin-x64': 0.25.0 + '@esbuild/freebsd-arm64': 0.25.0 + '@esbuild/freebsd-x64': 0.25.0 + '@esbuild/linux-arm': 0.25.0 + '@esbuild/linux-arm64': 0.25.0 + '@esbuild/linux-ia32': 0.25.0 + '@esbuild/linux-loong64': 0.25.0 + '@esbuild/linux-mips64el': 0.25.0 + '@esbuild/linux-ppc64': 0.25.0 + '@esbuild/linux-riscv64': 0.25.0 + '@esbuild/linux-s390x': 0.25.0 + '@esbuild/linux-x64': 0.25.0 + '@esbuild/netbsd-arm64': 0.25.0 + '@esbuild/netbsd-x64': 0.25.0 + '@esbuild/openbsd-arm64': 0.25.0 + '@esbuild/openbsd-x64': 0.25.0 + '@esbuild/sunos-x64': 0.25.0 + '@esbuild/win32-arm64': 0.25.0 + '@esbuild/win32-ia32': 0.25.0 + '@esbuild/win32-x64': 0.25.0 + esbuild@0.25.10: optionalDependencies: '@esbuild/aix-ppc64': 0.25.10 @@ -13993,10 +14562,10 @@ snapshots: fresh@0.5.2: {} - fs-extra@11.3.2: + fs-extra@11.3.0: dependencies: graceful-fs: 4.2.11 - jsonfile: 6.2.0 + jsonfile: 6.1.0 universalify: 2.0.1 fs-extra@7.0.1: @@ -14120,11 +14689,11 @@ snapshots: package-json-from-dist: 1.0.1 path-scurry: 1.11.1 - glob@11.0.3: + glob@11.0.1: dependencies: foreground-child: 3.3.1 - jackspeak: 4.1.1 - minimatch: 10.0.3 + jackspeak: 4.1.0 + minimatch: 10.0.1 minipass: 7.1.2 package-json-from-dist: 1.0.1 path-scurry: 2.0.0 @@ -14722,7 +15291,7 @@ snapshots: optionalDependencies: '@pkgjs/parseargs': 0.11.0 - jackspeak@4.1.1: + jackspeak@4.1.0: dependencies: '@isaacs/cliui': 8.0.2 @@ -14804,7 +15373,7 @@ snapshots: optionalDependencies: graceful-fs: 4.2.11 - jsonfile@6.2.0: + jsonfile@6.1.0: dependencies: universalify: 2.0.1 optionalDependencies: @@ -14896,10 +15465,10 @@ snapshots: chalk: 5.4.0 is-unicode-supported: 1.3.0 - log-symbols@7.0.1: + log-symbols@7.0.0: dependencies: is-unicode-supported: 2.1.0 - yoctocolors: 2.1.2 + yoctocolors: 2.1.1 longest-streak@3.1.0: {} @@ -14915,7 +15484,7 @@ snapshots: lru-cache@10.4.3: {} - lru-cache@11.2.2: {} + lru-cache@11.1.0: {} lru-cache@5.1.1: dependencies: @@ -15471,9 +16040,9 @@ snapshots: mimic-response@4.0.0: {} - minimatch@10.0.3: + minimatch@10.0.1: dependencies: - '@isaacs/brace-expansion': 5.0.0 + brace-expansion: 2.0.1 minimatch@3.0.8: dependencies: @@ -15948,7 +16517,7 @@ snapshots: path-scurry@2.0.0: dependencies: - lru-cache: 11.2.2 + lru-cache: 11.1.0 minipass: 7.1.2 path-to-regexp@0.1.12: {} @@ -16315,6 +16884,17 @@ snapshots: optionalDependencies: '@types/react': 19.0.1 + react-remove-scroll@2.6.2(@types/react@19.0.1)(react@19.0.0): + dependencies: + react: 19.0.0 + react-remove-scroll-bar: 2.3.8(@types/react@19.0.1)(react@19.0.0) + react-style-singleton: 2.2.3(@types/react@19.0.1)(react@19.0.0) + tslib: 2.8.1 + use-callback-ref: 1.3.3(@types/react@19.0.1)(react@19.0.0) + use-sidecar: 1.1.3(@types/react@19.0.1)(react@19.0.0) + optionalDependencies: + '@types/react': 19.0.1 + react-remove-scroll@2.6.3(@types/react@19.0.1)(react@19.0.0): dependencies: react: 19.0.0 @@ -17149,7 +17729,7 @@ snapshots: dependencies: eastasianwidth: 0.2.0 emoji-regex: 9.2.2 - strip-ansi: 7.1.2 + strip-ansi: 7.1.0 string-width@7.2.0: dependencies: @@ -17201,10 +17781,6 @@ snapshots: dependencies: ansi-regex: 6.1.0 - strip-ansi@7.1.2: - dependencies: - ansi-regex: 6.2.2 - strip-bom-string@1.0.0: {} strip-bom@3.0.0: {} @@ -17376,6 +17952,8 @@ snapshots: transitivePeerDependencies: - ts-node + tailwindcss@4.1.12: {} + tapable@2.2.1: {} tar-fs@3.0.8: @@ -18196,9 +18774,9 @@ snapshots: wrap-ansi@8.1.0: dependencies: - ansi-styles: 6.2.3 + ansi-styles: 6.2.1 string-width: 5.1.2 - strip-ansi: 7.1.2 + strip-ansi: 7.1.0 wrappy@1.0.2: {} @@ -18273,7 +18851,7 @@ snapshots: yoctocolors-cjs@2.1.2: {} - yoctocolors@2.1.2: {} + yoctocolors@2.1.1: {} zod-package-json@1.1.0: dependencies: