@react-email/preview-server 4.3.2 → 5.0.0-canary.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.next/BUILD_ID +1 -1
- package/.next/app-build-manifest.json +4 -4
- package/.next/build-manifest.json +2 -2
- package/.next/prerender-manifest.json +3 -3
- package/.next/server/app/_not-found/page.js +1 -1
- package/.next/server/app/_not-found/page.js.nft.json +1 -1
- package/.next/server/app/_not-found/page_client-reference-manifest.js +1 -1
- package/.next/server/app/page.js +1 -1
- package/.next/server/app/page.js.nft.json +1 -1
- package/.next/server/app/page_client-reference-manifest.js +1 -1
- package/.next/server/app/preview/[...slug]/page.js +3728 -206
- package/.next/server/app/preview/[...slug]/page.js.nft.json +1 -1
- package/.next/server/app/preview/[...slug]/page_client-reference-manifest.js +1 -1
- package/.next/server/chunks/{798.js → 142.js} +1 -1
- package/.next/server/chunks/235.js +1 -1
- package/.next/server/pages/500.html +1 -1
- package/.next/server/server-reference-manifest.js +1 -1
- package/.next/server/server-reference-manifest.json +1 -1
- package/.next/server/webpack-runtime.js +1 -1
- package/.next/static/chunks/{615-d4fa6964c1b18ccd.js → 615-071236a070fce314.js} +1 -1
- package/.next/static/chunks/app/layout-8aa1adb06911a092.js +1 -0
- package/.next/static/chunks/app/preview/[...slug]/page-d1b77693b46ad06d.js +1 -0
- package/.next/trace +28 -29
- package/CHANGELOG.md +11 -0
- package/package.json +4 -3
- package/src/utils/__snapshots__/get-email-component.spec.ts.snap +15 -16
- package/src/utils/caniemail/ast/get-used-style-properties.ts +26 -15
- package/src/utils/caniemail/tailwind/get-tailwind-metadata.ts +4 -5
- package/.next/static/chunks/app/layout-69daa40cb6178a4e.js +0 -1
- package/.next/static/chunks/app/preview/[...slug]/page-16818ec04224d56a.js +0 -1
- package/src/utils/caniemail/tailwind/generate-tailwind-rules.ts +0 -30
- package/src/utils/caniemail/tailwind/setup-tailwind-context.ts +0 -15
- package/tailwind-internals.d.ts +0 -131
- /package/.next/static/{9thySAgTI839NCKpFjqMH → bt2ALz5luAFuNOLQJH7lT}/_buildManifest.js +0 -0
- /package/.next/static/{9thySAgTI839NCKpFjqMH → bt2ALz5luAFuNOLQJH7lT}/_ssgManifest.js +0 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,16 @@
|
|
|
1
1
|
# @react-email/preview-server
|
|
2
2
|
|
|
3
|
+
## 5.0.0-canary.0
|
|
4
|
+
|
|
5
|
+
### Major Changes
|
|
6
|
+
|
|
7
|
+
- 442f5b6: only check compatibility with tailwindcss@4
|
|
8
|
+
|
|
9
|
+
### Patch Changes
|
|
10
|
+
|
|
11
|
+
- Updated dependencies [442f5b6]
|
|
12
|
+
- @react-email/tailwind@2.0.0-canary.1
|
|
13
|
+
|
|
3
14
|
## 4.3.2
|
|
4
15
|
|
|
5
16
|
### Patch Changes
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@react-email/preview-server",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "5.0.0-canary.0",
|
|
4
4
|
"description": "A live preview of your emails right in your browser.",
|
|
5
5
|
"main": "./index.mjs",
|
|
6
6
|
"dependencies": {
|
|
@@ -16,6 +16,7 @@
|
|
|
16
16
|
"@radix-ui/react-tabs": "1.1.13",
|
|
17
17
|
"@radix-ui/react-toggle-group": "1.1.11",
|
|
18
18
|
"@radix-ui/react-tooltip": "1.2.8",
|
|
19
|
+
"@react-email/tailwind": "2.0.0-canary.1",
|
|
19
20
|
"@types/node": "22.14.1",
|
|
20
21
|
"@types/normalize-path": "3.0.2",
|
|
21
22
|
"@types/react": "19.0.10",
|
|
@@ -49,6 +50,7 @@
|
|
|
49
50
|
"devDependencies": {
|
|
50
51
|
"@types/babel__core": "7.20.5",
|
|
51
52
|
"@types/babel__traverse": "7.20.7",
|
|
53
|
+
"@types/css-tree": "2.3.10",
|
|
52
54
|
"@types/fs-extra": "11.0.1",
|
|
53
55
|
"@types/mime-types": "2.1.4",
|
|
54
56
|
"@types/node": "22.10.2",
|
|
@@ -57,10 +59,9 @@
|
|
|
57
59
|
"@types/react-dom": "19.0.4",
|
|
58
60
|
"@types/webpack": "5.28.5",
|
|
59
61
|
"autoprefixer": "10.4.21",
|
|
60
|
-
"postcss": "8.5.3",
|
|
61
62
|
"tailwindcss": "3.4.0",
|
|
62
63
|
"typescript": "5.8.3",
|
|
63
|
-
"@react-email/components": "0.
|
|
64
|
+
"@react-email/components": "1.0.0-canary.1"
|
|
64
65
|
},
|
|
65
66
|
"license": "MIT",
|
|
66
67
|
"repository": {
|
|
@@ -12,8 +12,7 @@ exports[`getEmailComponent() > with a demo email template 1`] = `
|
|
|
12
12
|
<meta name="x-apple-disable-message-reformatting" />
|
|
13
13
|
<!--$-->
|
|
14
14
|
</head>
|
|
15
|
-
<body
|
|
16
|
-
style='margin-left:auto;margin-right:auto;margin-top:auto;margin-bottom:auto;background-color:rgb(255,255,255);padding-left:8px;padding-right:8px;font-family:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"'>
|
|
15
|
+
<body style="background-color:rgb(255,255,255)">
|
|
17
16
|
<table
|
|
18
17
|
border="0"
|
|
19
18
|
width="100%"
|
|
@@ -24,7 +23,7 @@ exports[`getEmailComponent() > with a demo email template 1`] = `
|
|
|
24
23
|
<tbody>
|
|
25
24
|
<tr>
|
|
26
25
|
<td
|
|
27
|
-
style='margin-
|
|
26
|
+
style='margin-right:auto;margin-left:auto;margin-bottom:auto;margin-top:auto;background-color:rgb(255,255,255);padding-right:8px;padding-left:8px;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"'>
|
|
28
27
|
<div
|
|
29
28
|
style="display:none;overflow:hidden;line-height:1px;opacity:0;max-height:0;max-width:0"
|
|
30
29
|
data-skip-in-text="true">
|
|
@@ -40,7 +39,7 @@ exports[`getEmailComponent() > with a demo email template 1`] = `
|
|
|
40
39
|
cellpadding="0"
|
|
41
40
|
cellspacing="0"
|
|
42
41
|
role="presentation"
|
|
43
|
-
style="
|
|
42
|
+
style="max-width:465px;margin-right:auto;margin-left:auto;margin-bottom:40px;margin-top:40px;border-radius:0.25rem;border-style:solid;border-width:1px;border-color:rgb(234,234,234);padding:20px">
|
|
44
43
|
<tbody>
|
|
45
44
|
<tr style="width:100%">
|
|
46
45
|
<td>
|
|
@@ -59,26 +58,26 @@ exports[`getEmailComponent() > with a demo email template 1`] = `
|
|
|
59
58
|
alt="Vercel Logo"
|
|
60
59
|
height="37"
|
|
61
60
|
src="/static/vercel-logo.png"
|
|
62
|
-
style="
|
|
61
|
+
style="display:block;outline:none;border:none;text-decoration:none;margin-right:auto;margin-left:auto;margin-bottom:0;margin-top:0"
|
|
63
62
|
width="40" />
|
|
64
63
|
</td>
|
|
65
64
|
</tr>
|
|
66
65
|
</tbody>
|
|
67
66
|
</table>
|
|
68
67
|
<h1
|
|
69
|
-
style="margin-
|
|
68
|
+
style="margin-right:0;margin-left:0;margin-bottom:30px;margin-top:30px;padding:0;text-align:center;font-weight:400;font-size:24px;color:rgb(0,0,0)">
|
|
70
69
|
Join <strong>Enigma</strong> on <strong>Vercel</strong>
|
|
71
70
|
</h1>
|
|
72
71
|
<p
|
|
73
|
-
style="font-size:14px;color:rgb(0,0,0);
|
|
72
|
+
style="font-size:14px;line-height:24px;color:rgb(0,0,0);margin-top:16px;margin-bottom:16px">
|
|
74
73
|
Hello
|
|
75
74
|
<!-- -->alanturing<!-- -->,
|
|
76
75
|
</p>
|
|
77
76
|
<p
|
|
78
|
-
style="font-size:14px;color:rgb(0,0,0);
|
|
77
|
+
style="font-size:14px;line-height:24px;color:rgb(0,0,0);margin-top:16px;margin-bottom:16px">
|
|
79
78
|
<strong>Alan</strong> (<a
|
|
80
79
|
href="mailto:alan.turing@example.com"
|
|
81
|
-
style="color:rgb(
|
|
80
|
+
style="color:rgb(21,93,252);text-decoration-line:none"
|
|
82
81
|
target="_blank"
|
|
83
82
|
>alan.turing@example.com</a
|
|
84
83
|
>) has invited you to the <strong>Enigma</strong> team on<!-- -->
|
|
@@ -110,7 +109,7 @@ exports[`getEmailComponent() > with a demo email template 1`] = `
|
|
|
110
109
|
alt="alanturing's profile picture"
|
|
111
110
|
height="64"
|
|
112
111
|
src="/static/vercel-user.png"
|
|
113
|
-
style="
|
|
112
|
+
style="display:block;outline:none;border:none;text-decoration:none;border-radius:9999px"
|
|
114
113
|
width="64" />
|
|
115
114
|
</td>
|
|
116
115
|
<td
|
|
@@ -130,7 +129,7 @@ exports[`getEmailComponent() > with a demo email template 1`] = `
|
|
|
130
129
|
alt="Enigma team logo"
|
|
131
130
|
height="64"
|
|
132
131
|
src="/static/vercel-team.png"
|
|
133
|
-
style="
|
|
132
|
+
style="display:block;outline:none;border:none;text-decoration:none;border-radius:9999px"
|
|
134
133
|
width="64" />
|
|
135
134
|
</td>
|
|
136
135
|
</tr>
|
|
@@ -153,7 +152,7 @@ exports[`getEmailComponent() > with a demo email template 1`] = `
|
|
|
153
152
|
<td>
|
|
154
153
|
<a
|
|
155
154
|
href="https://vercel.com"
|
|
156
|
-
style="border-radius:0.25rem;background-color:rgb(0,0,0);padding-
|
|
155
|
+
style="line-height:100%;text-decoration:none;display:inline-block;max-width:100%;mso-padding-alt:0px;border-radius:0.25rem;background-color:rgb(0,0,0);padding-right:20px;padding-left:20px;padding-bottom:12px;padding-top:12px;text-align:center;font-weight:600;font-size:12px;color:rgb(255,255,255);text-decoration-line:none"
|
|
157
156
|
target="_blank"
|
|
158
157
|
><span
|
|
159
158
|
><!--[if mso]><i style="mso-font-width:500%;mso-text-raise:18" hidden>  </i><![endif]--></span
|
|
@@ -169,19 +168,19 @@ exports[`getEmailComponent() > with a demo email template 1`] = `
|
|
|
169
168
|
</tbody>
|
|
170
169
|
</table>
|
|
171
170
|
<p
|
|
172
|
-
style="font-size:14px;color:rgb(0,0,0);
|
|
171
|
+
style="font-size:14px;line-height:24px;color:rgb(0,0,0);margin-top:16px;margin-bottom:16px">
|
|
173
172
|
or copy and paste this URL into your browser:<!-- -->
|
|
174
173
|
<a
|
|
175
174
|
href="https://vercel.com"
|
|
176
|
-
style="color:rgb(
|
|
175
|
+
style="color:rgb(21,93,252);text-decoration-line:none"
|
|
177
176
|
target="_blank"
|
|
178
177
|
>https://vercel.com</a
|
|
179
178
|
>
|
|
180
179
|
</p>
|
|
181
180
|
<hr
|
|
182
|
-
style="margin-
|
|
181
|
+
style="width:100%;border:none;border-top:1px solid #eaeaea;margin-right:0;margin-left:0;margin-bottom:26px;margin-top:26px;border-style:solid;border-width:1px;border-color:rgb(234,234,234)" />
|
|
183
182
|
<p
|
|
184
|
-
style="
|
|
183
|
+
style="font-size:12px;line-height:24px;color:rgb(102,102,102);margin-top:16px;margin-bottom:16px">
|
|
185
184
|
This invitation was intended for<!-- -->
|
|
186
185
|
<span style="color:rgb(0,0,0)">alanturing</span>. This
|
|
187
186
|
invite was sent from
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
/** biome-ignore-all lint/nursery/noNestedComponentDefinitions: There are no components here, just visitor functions */
|
|
2
|
-
import traverse from '@babel/traverse';
|
|
2
|
+
import traverse, { type NodePath } from '@babel/traverse';
|
|
3
|
+
import { inlineStyles, sanitizeStyleSheet } from '@react-email/tailwind';
|
|
4
|
+
import type { StyleSheet } from 'css-tree';
|
|
3
5
|
import type { AST } from '../../../actions/email-validation/check-compatibility';
|
|
4
|
-
import { generateTailwindCssRules } from '../tailwind/generate-tailwind-rules';
|
|
5
6
|
import { getTailwindMetadata } from '../tailwind/get-tailwind-metadata';
|
|
6
7
|
import type { ObjectVariables, SourceLocation } from './get-object-variables';
|
|
7
8
|
|
|
@@ -31,30 +32,40 @@ export const getUsedStyleProperties = async (
|
|
|
31
32
|
);
|
|
32
33
|
|
|
33
34
|
if (tailwindMetadata.hasTailwind) {
|
|
35
|
+
const pathClassNameMap = new Map<string, NodePath>();
|
|
36
|
+
|
|
34
37
|
traverse(ast, {
|
|
35
38
|
JSXAttribute(path) {
|
|
36
39
|
if (path.node.name.name === 'className') {
|
|
37
40
|
path.traverse({
|
|
38
41
|
StringLiteral(stringPath) {
|
|
39
42
|
const className = stringPath.node.value;
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
);
|
|
44
|
-
for (const rule of rules) {
|
|
45
|
-
rule.walkDecls((decl) => {
|
|
46
|
-
styleProperties.push({
|
|
47
|
-
location: stringPath.node.loc,
|
|
48
|
-
name: decl.prop,
|
|
49
|
-
value: decl.value,
|
|
50
|
-
});
|
|
51
|
-
});
|
|
52
|
-
}
|
|
43
|
+
pathClassNameMap.set(className, stringPath);
|
|
44
|
+
const candidates = className.split(/\s+/);
|
|
45
|
+
tailwindMetadata.tailwindSetup.addUtilities(candidates);
|
|
53
46
|
},
|
|
54
47
|
});
|
|
55
48
|
}
|
|
56
49
|
},
|
|
57
50
|
});
|
|
51
|
+
const styleSheet =
|
|
52
|
+
tailwindMetadata.tailwindSetup.getStyleSheet() as StyleSheet;
|
|
53
|
+
sanitizeStyleSheet(styleSheet);
|
|
54
|
+
|
|
55
|
+
for (const [className, nodePath] of pathClassNameMap.entries()) {
|
|
56
|
+
const styles = inlineStyles(styleSheet, className.split(/\s+/));
|
|
57
|
+
for (const [name, value] of Object.entries(styles)) {
|
|
58
|
+
const snakeCasedName = name.replaceAll(
|
|
59
|
+
/[A-Z]/g,
|
|
60
|
+
(capitalLetter) => `-${capitalLetter}`,
|
|
61
|
+
);
|
|
62
|
+
styleProperties.push({
|
|
63
|
+
location: nodePath.node.loc,
|
|
64
|
+
name: snakeCasedName,
|
|
65
|
+
value,
|
|
66
|
+
});
|
|
67
|
+
}
|
|
68
|
+
}
|
|
58
69
|
}
|
|
59
70
|
|
|
60
71
|
traverse(ast, {
|
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
import traverse from '@babel/traverse';
|
|
2
|
-
import type
|
|
2
|
+
import { setupTailwind, type TailwindSetup } from '@react-email/tailwind';
|
|
3
3
|
import type { AST } from '../../../actions/email-validation/check-compatibility';
|
|
4
4
|
import { getTailwindConfig, type TailwindConfig } from './get-tailwind-config';
|
|
5
|
-
import { setupTailwindContext } from './setup-tailwind-context';
|
|
6
5
|
|
|
7
6
|
export const getTailwindMetadata = async (
|
|
8
7
|
ast: AST,
|
|
@@ -15,7 +14,7 @@ export const getTailwindMetadata = async (
|
|
|
15
14
|
| {
|
|
16
15
|
hasTailwind: true;
|
|
17
16
|
config: TailwindConfig;
|
|
18
|
-
|
|
17
|
+
tailwindSetup: TailwindSetup;
|
|
19
18
|
}
|
|
20
19
|
> => {
|
|
21
20
|
let hasTailwind = false as boolean;
|
|
@@ -35,11 +34,11 @@ export const getTailwindMetadata = async (
|
|
|
35
34
|
}
|
|
36
35
|
|
|
37
36
|
const config = await getTailwindConfig(sourceCode, ast, sourcePath);
|
|
38
|
-
const
|
|
37
|
+
const tailwindSetup = await setupTailwind(config);
|
|
39
38
|
|
|
40
39
|
return {
|
|
41
40
|
hasTailwind: true,
|
|
42
41
|
config,
|
|
43
|
-
|
|
42
|
+
tailwindSetup,
|
|
44
43
|
};
|
|
45
44
|
};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[177],{6:e=>{e.exports={style:{fontFamily:"'Inter', 'Inter Fallback'",fontStyle:"normal"},className:"__className_f367f3",variable:"__variable_f367f3"}},1154:e=>{e.exports={style:{fontFamily:"'sfMono', 'sfMono Fallback'"},className:"__className_a0e4c0",variable:"__variable_a0e4c0"}},3359:(e,t,a)=>{"use strict";a.d(t,{EmailsProvider:()=>d,J:()=>_});var r=a(1275),l=a(3611),i=a(4366);let o=(0,i.createServerReference)("7f47253024560a21eac6d7ba5c3e91af4b25be5155",i.callServer,void 0,i.findSourceMapURL,"getEmailsDirectoryMetadataAction");var s=a(9195),n=a(5224);let c=(0,l.createContext)(void 0),_=()=>{let e=(0,l.useContext)(c);if(void 0===e)throw Error("Cannot call `useEmails` outside of an `EmailsContext` provider.");return e},d=e=>{let[t,a]=(0,l.useState)(e.initialEmailsDirectoryMetadata);return s.Hf||s.m4||(0,n.a)(async()=>{let t=await o(e.initialEmailsDirectoryMetadata.absolutePath);if(t)a(t);else throw Error("Hot reloading: unable to find the emails directory to update the sidebar")}),(0,r.jsx)(c.Provider,{value:{emailsDirectoryMetadata:t},children:e.children})}},3526:(e,t,a)=>{Promise.resolve().then(a.t.bind(a,7979,23)),Promise.resolve().then(a.t.bind(a,6,23)),Promise.resolve().then(a.t.bind(a,1154,23)),Promise.resolve().then(a.bind(a,3359))},5224:(e,t,a)=>{"use strict";a.d(t,{a:()=>i});var r=a(3611),l=a(4512);let i=e=>{let t=(0,r.useRef)(null);(0,r.useEffect)(()=>{t.current||(t.current=(0,l.io)());let a=t.current;return a.on("reload",t=>{console.debug("Reloading..."),e(t)}),()=>{a.off()}},[e])}},7979:()=>{},9195:(e,t,a)=>{"use strict";a.d(t,{Hf:()=>l,m4:()=>i});var r=a(2248);r.env.USER_PROJECT_LOCATION,r.env.PREVIEW_SERVER_LOCATION,r.env.EMAILS_DIR_ABSOLUTE_PATH;let l="true"===r.env.NEXT_PUBLIC_IS_BUILDING,i="true"===r.env.NEXT_PUBLIC_IS_PREVIEW_DEVELOPMENT}},e=>{e.O(0,[807,983,105,713,358],()=>e(e.s=3526)),_N_E=e.O()}]);
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[719],{616:(e,t,a)=>{"use strict";a.d(t,{i:()=>l});var s=a(1275),r=a(3611),n=a(4387);let l=r.forwardRef((e,t)=>{let{...a}=e;return(0,s.jsx)(n.z,{ref:t,...a,children:(0,s.jsx)("path",{d:"M16.25 8.75L10.406 15.25L7.75 12.75",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"1.5"})})});l.displayName="IconCheck"},1524:(e,t,a)=>{"use strict";a.d(t,{PreviewProvider:()=>f,$:()=>g});var s=a(1275),r=a(2108),n=a(3611),l=a(9195),i=a(4366);let o=(0,i.createServerReference)("7f683f61ca77af023178ce40584ae3843c7665e233",i.callServer,void 0,i.findSourceMapURL,"getEmailPathFromSlug"),c=(0,i.createServerReference)("7fcb3ae2d2f9ce3f4d09238a9a968a6b2b1f044863",i.callServer,void 0,i.findSourceMapURL,"renderEmailByPath");var d=a(3359);let u=(e,t)=>m(e.replace(t.relativePath,"").split("/").filter(Boolean),t),m=(e,t)=>{if(1===e.length){let a=(e=>{let t=e.split(".");return t.length>1?t.slice(0,-1).join("."):e})(e[0]);return t.emailFilenames.includes(a)}let a=e.join("/");for(let s of t.subDirectories)if(a.startsWith(s.directoryName)){let t=s.directoryName.split("/").filter(Boolean).length;return m(e.slice(t),s)}return!1};var h=a(5224);let x={},p=(0,n.createContext)(void 0),f=e=>{let{emailSlug:t,emailPath:a,serverRenderingResult:i,children:m}=e,f=(0,r.useRouter)(),g=((e,t)=>{let[a,s]=(0,n.useState)(t),{emailsDirectoryMetadata:r}=(0,d.J)();return l.Hf||l.m4||(0,h.a)(async t=>{for await(let a of t){let t=a.filename;if(!u(t,r))continue;let n=await o(t),l=await c(n,!0);n===e&&s(l)}}),a})(a,i),b=((e,t,a)=>((0,n.useEffect)(()=>{"markup"in t?x[e]=t:void 0!==a&&"markup"in a&&void 0===x[e]&&(x[e]=a)},[t,e,a]),"error"in t?x[e]:t))(a,g,i);return l.Hf||l.m4||(0,h.a)(e=>{let a=e.find(e=>e.filename.includes(t));void 0!==a&&"unlink"===a.event&&f.push("/")}),(0,s.jsx)(p.Provider,{value:{emailPath:a,emailSlug:t,renderedEmailMetadata:b,renderingResult:g},children:m})},g=()=>{let e=(0,n.useContext)(p);if(void 0===e)throw Error("Cannot call `usePreviewContext` outside of an `PreviewContext` provider.");return e}},2566:(e,t,a)=>{"use strict";a.d(t,{Toolbar:()=>A,S:()=>_});var s=a(1275),r=a(1923),n=a(4094),l=a(2108),i=a(3611),o=a(9195),c=a(1524),d=a(4600),u=a(6516),m=a(616),h=a(4387);let x=i.forwardRef((e,t)=>{let{...a}=e;return(0,s.jsx)(h.z,{ref:t,...a,children:(0,s.jsx)("path",{d:"M12 4C7.58173 4 4 7.58172 4 12C4 16.4182 7.58173 20 12 20C16.4183 20 20 16.4182 20 12C20 7.58172 16.4183 4 12 4ZM5.14754 12C5.14754 8.21549 8.21551 5.14754 12 5.14754C15.7845 5.14754 18.8525 8.21549 18.8525 12C18.8525 15.7844 15.7845 18.8525 12 18.8525C8.21551 18.8525 5.14754 15.7844 5.14754 12ZM12.906 8.37648C12.906 8.87682 12.5004 9.28243 12 9.28243C11.4997 9.28243 11.0941 8.87682 11.0941 8.37648C11.0941 7.87613 11.4997 7.47053 12 7.47053C12.5004 7.47053 12.906 7.87613 12.906 8.37648ZM10.1883 10.1884H10.7922H12.0002C12.3337 10.1884 12.6041 10.4588 12.6041 10.7924V15.0201H13.2081H13.8121V16.2281H13.2081H12.0002H10.7922H10.1883V15.0201H10.7922H11.3962V11.3963H10.7922H10.1883V10.1884Z",fill:"currentColor",fillRule:"evenodd",clipRule:"evenodd"})})});x.displayName="IconInfo";let p=i.forwardRef((e,t)=>{let{...a}=e;return(0,s.jsx)(h.z,{ref:t,...a,children:(0,s.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M17.9354 12C17.9354 9.01537 15.5828 6.05264 11.9202 6.05264C8.96229 6.05264 7.50033 8.21724 6.87735 9.36841H8.72625C9.02024 9.36841 9.25858 9.60406 9.25858 9.89473C9.25858 10.1854 9.02024 10.421 8.72625 10.421H5.53232C5.23833 10.421 5 10.1854 5 9.89473V6.73684C5 6.44617 5.23833 6.21052 5.53232 6.21052C5.82631 6.21052 6.06465 6.44617 6.06465 6.73684V8.64548C6.81471 7.33819 8.54959 5 11.9202 5C16.2456 5 19 8.51094 19 12C19 15.4891 16.2456 19 11.9202 19C9.8507 19 8.12769 18.1904 6.9009 16.9562C6.24405 16.2954 5.73107 15.5148 5.38132 14.6744C5.26942 14.4057 5.39911 14.0981 5.67098 13.9875C5.94285 13.8768 6.25395 14.0051 6.36583 14.2738C6.66482 14.9921 7.10262 15.6574 7.66023 16.2183C8.69486 17.2593 10.1475 17.9474 11.9202 17.9474C15.5828 17.9474 17.9354 14.9846 17.9354 12Z",fill:"currentColor"})})});p.displayName="IconReload";var f=a(9361);let g={family:{gmail:"Gmail",outlook:"Outlook",yahoo:"Yahoo! Mail","apple-mail":"Apple Mail",aol:"AOL",thunderbird:"Mozilla Thunderbird",microsoft:"Microsoft","samsung-email":"Samsung Email",sfr:"SFR",orange:"Orange",protonmail:"ProtonMail",hey:"HEY","mail-ru":"Mail.ru",fastmail:"Fastmail",laposte:"LaPoste.net","t-online-de":"T-online.de","free-fr":"Free.fr",gmx:"GMX","web-de":"WEB.DE","ionos-1and1":"1&1",rainloop:"RainLoop","wp-pl":"WP.pl"}};var b=a(4366);let j=(0,b.createServerReference)("7fc613da9d3a57418d549491896f4c2437b087f0cb",b.callServer,void 0,b.findSourceMapURL,"checkCompatibility");async function*v(e){let t=e.getReader();try{for(;;){let{value:e,done:a}=await t.read();if(a)break;yield e}}finally{t.releaseLock()}}let w=e=>(0,s.jsxs)("svg",{width:"13",height:"12",viewBox:"0 0 13 12",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e,children:[(0,s.jsx)("path",{d:"M10.8777 8.99999L6.87766 1.99999C6.79044 1.84609 6.66396 1.71808 6.51112 1.62902C6.35828 1.53997 6.18455 1.49304 6.00766 1.49304C5.83077 1.49304 5.65704 1.53997 5.5042 1.62902C5.35136 1.71808 5.22488 1.84609 5.13766 1.99999L1.13766 8.99999C1.0495 9.15267 1.00327 9.32594 1.00366 9.50224C1.00405 9.67855 1.05105 9.85161 1.13988 10.0039C1.22872 10.1562 1.35623 10.2823 1.50951 10.3694C1.66278 10.4565 1.83636 10.5016 2.01266 10.5H10.0127C10.1881 10.4998 10.3604 10.4535 10.5123 10.3656C10.6642 10.2778 10.7903 10.1515 10.8779 9.99955C10.9656 9.84756 11.0117 9.67518 11.0116 9.49973C11.0116 9.32428 10.9654 9.15193 10.8777 8.99999Z",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round"}),(0,s.jsx)("path",{d:"M6.0127 4.5V6.5",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round"}),(0,s.jsx)("path",{d:"M6.0127 8.5H6.01853",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round"})]});w.displayName="IconCircleWarning";var y=a(2664),C=a.n(y);let N=e=>{let{line:t,type:a}=e,r=new URLSearchParams((0,l.useSearchParams)());r.set("view","source"),"html"===a?r.set("lang","markup"):"react"===a&&r.set("lang","jsx");let n="#L".concat(t);return(0,s.jsxs)(C(),{href:{search:r.toString(),hash:n},scroll:!1,className:"appearance-none underline mx-2",children:["L",t.toString().padStart(2,"0")]})},k=e=>{let{children:t,className:a,...r}=e;return(0,s.jsx)("table",{...r,className:(0,d.cn)("group relative w-full border-collapse text-left text-slate-10 text-sm",a),children:(0,s.jsx)("tbody",{children:t})})};k.Row=e=>{let{children:t,className:a,...r}=e;return(0,s.jsx)("tr",{className:(0,d.cn)("border-collapse align-bottom border-slate-6 border-b last:border-b-0",a),...r,children:t})},k.Column=e=>{let{children:t,className:a,...r}=e;return(0,s.jsx)("td",{className:(0,d.cn)("py-1.5 align-bottom font-regular",a),...r,children:t})};let S=e=>{let{results:t}=e;return(0,s.jsx)(k,{children:null==t?void 0:t.map((e,t)=>{let a=Object.entries(e.statsPerEmailClient).filter(e=>{let[,t]=e;return"error"===t.status}),r=a.map(e=>{let[t]=e;return g.family[t]}).join(", ");return(0,s.jsxs)(k.Row,{children:[(0,s.jsx)(k.Column,{children:(0,s.jsxs)("span",{className:"flex text-red-400 uppercase gap-2 items-center",children:[(0,s.jsx)(w,{}),(0,d.aj)(e.entry.title)]})}),(0,s.jsxs)(k.Column,{children:[a.length>0?"Not supported in ".concat(r):null,(0,s.jsx)("a",{href:e.entry.url,className:"underline ml-2 decoration-slate-9 decoration-1 hover:decoration-slate-11 transition-colors hover:text-slate-12",rel:"noreferrer",target:"_blank",children:"More ↗"})]}),(0,s.jsx)(k.Column,{className:"font-mono text-slate-11 text-right",children:(0,s.jsx)(N,{line:e.location.start.line,column:e.location.start.column,type:"react"})})]},t)})})};var L=a(8452);let R=(0,b.createServerReference)("7f233055054f2791ad5cd2a1d5d89aea8d958603fe",b.callServer,void 0,b.findSourceMapURL,"checkImages"),M=(0,b.createServerReference)("7f1c5b951fd1a779b84ee9b2a566c86031356e4f65",b.callServer,void 0,b.findSourceMapURL,"checkLinks");async function*H(e){for await(let t of e)for await(let e of v(await t.getStream())){let a=t.mapValue(e);a&&(yield a)}}let T=e=>{let{rows:t}=e;return void 0===t?null:(0,s.jsx)(k,{children:t.map((e,t)=>{if("link"===e.source){let a=e.result.checks.find(e=>!1===e.passed),r=[];for(let t of e.result.checks)"fetch_attempt"===t.type&&t.metadata.fetchStatusCode&&r.push((0,s.jsxs)(s.Fragment,{children:["HTTP ",t.metadata.fetchStatusCode]}));return r.push((0,s.jsx)(N,{line:e.result.codeLocation.line,column:e.result.codeLocation.column,type:"html"})),(0,s.jsxs)(P,{status:e.result.status,children:[(0,s.jsx)(P.Name,{children:(0,d.aj)(a.type)}),(0,s.jsxs)(P.Description,{children:["security"===a.type?"Insecure URL, use HTTPS instead of HTTP":null,"fetch_attempt"===a.type&&a.metadata.fetchStatusCode&&a.metadata.fetchStatusCode>=300&&a.metadata.fetchStatusCode<400?"There was a redirect, the content may have been moved":null,"fetch_attempt"===a.type&&a.metadata.fetchStatusCode&&a.metadata.fetchStatusCode>=400?"The link is broken":null,"fetch_attempt"===a.type&&void 0===a.metadata.fetchStatusCode?"The link could not be reached":null,"syntax"===a.type?"The link is broken due to invalid syntax":null,(0,s.jsx)("span",{className:"ml-2 text-ellipsis overflow-hidden text-nowrap max-w-[30ch]",children:e.result.link})]}),(0,s.jsx)(P.Metadata,{children:r})]},t)}if("image"===e.source){let a=e.result.checks.find(e=>!1===e.passed),r=[];for(let t of e.result.checks)"image_size"===t.type&&t.metadata.byteCount&&r.push((0,L.A)(t.metadata.byteCount)),"fetch_attempt"===t.type&&t.metadata.fetchStatusCode&&r.push((0,s.jsxs)(s.Fragment,{children:["HTTP ",t.metadata.fetchStatusCode]}));return r.push((0,s.jsx)(N,{line:e.result.codeLocation.line,column:e.result.codeLocation.column,type:"html"})),(0,s.jsxs)(P,{status:e.result.status,children:[(0,s.jsx)(P.Name,{children:(0,d.aj)(a.type)}),(0,s.jsxs)(P.Description,{children:["security"===a.type?"Insecure URL, use HTTPS instead of HTTP":null,"fetch_attempt"===a.type&&a.metadata.fetchStatusCode&&a.metadata.fetchStatusCode>=300&&a.metadata.fetchStatusCode<400?"There was a redirect, the image may have been moved":null,"fetch_attempt"===a.type&&a.metadata.fetchStatusCode&&a.metadata.fetchStatusCode>=400?"The image is broken":null,"fetch_attempt"===a.type&&void 0===a.metadata.fetchStatusCode?"The image could not be reached":null,"syntax"===a.type?"The image is broken due to an invalid source":null,"accessibility"===a.type?"Missing alt text":null,"image_size"===a.type&&a.metadata.byteCount?"This image is too large, keep it under 1mb":null,(0,s.jsx)("span",{className:"ml-2 text-ellipsis overflow-hidden text-nowrap max-w-[30ch]",children:e.result.source})]}),(0,s.jsx)(P.Metadata,{children:r})]},t)}})})},P=e=>{let{children:t,className:a,status:r,...n}=e;return(0,s.jsx)(k.Row,{"data-status":r,...n,className:(0,d.cn)("group/result",a),children:t})};P.Name=e=>{let{children:t,...a}=e;return(0,s.jsx)(k.Column,{...a,children:(0,s.jsxs)("span",{className:"flex uppercase gap-2 items-center group-data-[status=error]/result:text-red-400 group-data-[status=warning]/result:text-orange-300",children:[(0,s.jsx)(w,{}),"string"==typeof t?(0,d.aj)(t):t]})})},P.Description=e=>{let{children:t,className:a,...r}=e;return(0,s.jsx)(k.Column,{...r,children:t})},P.Metadata=e=>{let{children:t,className:a,...r}=e;return(0,s.jsx)(k.Column,{align:"right",...r,className:(0,d.cn)("font-mono text-slate-11",a),children:i.Children.map(t,(e,t)=>(0,s.jsxs)(s.Fragment,{children:[t>0?" \xb7 ":null,e]}))})};let E=e=>{let{result:t}=e;return(0,s.jsx)(s.Fragment,{children:t?(0,s.jsxs)(k,{children:[(0,s.jsxs)(k.Row,{className:"sticky border-b top-0",children:[(0,s.jsx)(k.Column,{className:"uppercase",children:(0,s.jsxs)("span",{className:"flex gap-2 items-center",children:[(0,s.jsx)(w,{className:(0,d.cn)(0===t.points?"text-green-400":null,(t.points>0&&t.points,null),t.points>1.5?"text-yellow-100":null,t.points>3?"text-orange-400":null,t.points>=5?"text-red-400":null)}),"Score"]})}),(0,s.jsx)(k.Column,{children:0===t.points?"Congratulations! Your email is clean of abuse indicators.":"Higher scores are better"}),(0,s.jsxs)(k.Column,{className:"text-right tracking-tighter font-bold",children:[(0,s.jsx)("span",{className:(0,d.cn)("text-3xl",0===t.points?"text-green-400":null,(t.points>0&&t.points,null),t.points>1.5?"text-yellow-200":null,t.points>3?"text-orange-400":null,t.points>=5?"text-red-400":null),children:(10-t.points).toFixed(1)})," ",(0,s.jsx)("span",{className:"text-lg",children:"/ 10"})]})]}),(function(e,t){let a=[...e];return a.sort(t),a})(t.checks,(e,t)=>t.points-e.points).map(e=>(0,s.jsxs)(k.Row,{children:[(0,s.jsx)(k.Column,{className:"uppercase",children:(0,s.jsxs)("span",{className:"flex gap-2 items-center",children:[(0,s.jsx)(w,{className:(0,d.cn)(e.points>1?"text-yellow-200":null,e.points>2?"text-orange-400":null,e.points>3?"text-red-400":null)}),(0,d.aj)(e.name)]})}),(0,s.jsx)(k.Column,{children:e.description}),(0,s.jsxs)(k.Column,{className:(0,d.cn)("text-right font-mono tracking-tighter",e.points>1?"text-yellow-200":null,e.points>2?"text-orange-400":null,e.points>3?"text-red-400":null),children:["-",e.points.toFixed(1)]})]},e.name))]}):null})};var V=a(8031),I=a(5877);let z=e=>{let{children:t,className:a,active:r,tooltip:n,delayDuration:l=500,...i}=e;return(0,s.jsx)(I.m.Provider,{children:(0,s.jsxs)(I.m,{delayDuration:l,children:[(0,s.jsx)(I.m.Trigger,{asChild:!0,children:(0,s.jsxs)("button",{type:"button",...i,className:(0,d.cn)("h-full w-fit font-regular flex text-sm text-slate-10 items-center align-middle justify-center px-1 gap-2 relative","hover:text-slate-12 transition-colors",r&&"data-[state=active]:text-cyan-11",a),children:[t,r?(0,s.jsx)(V.P.span,{className:"-bottom-px absolute rounded-sm left-0 w-full bg-cyan-11 h-px",layoutId:"active-toolbar-button",transition:{type:"spring",bounce:.2,duration:.6}}):null]})}),n?(0,s.jsx)(I.m.Content,{children:n}):null]})})},D=e=>{let t;if("localStorage"in a.g){let s=a.g.localStorage.getItem(e);if(null!==s&&"undefined"!==s)try{t=JSON.parse(s)}catch(t){console.warn("Failed to load stored value for",e,"with value",s)}}return[(0,i.useSyncExternalStore)(()=>()=>{},()=>t,()=>void 0),function(t){"localStorage"in a.g&&a.g.localStorage.setItem(e,JSON.stringify(t))}]},_=()=>{var e;let t=null!=(e=(0,l.useSearchParams)().get("toolbar-panel"))?e:void 0;return{activeTab:t,toggled:void 0!==t}},F=e=>{let{serverLintingRows:t,serverSpamCheckingResult:c,serverCompatibilityResults:m,prettyMarkup:h,reactMarkup:g,plainText:b,emailPath:w,emailSlug:y}=e,C=(0,l.usePathname)(),N=(0,l.useSearchParams)(),k=(0,l.useRouter)(),{activeTab:L,toggled:P}=_(),V=e=>{let t=new URLSearchParams(N);void 0===e?t.delete("toolbar-panel"):t.set("toolbar-panel",e),k.push("".concat(C,"?").concat(t.toString()).concat(location.hash))},[I,F]=D("spam-assassin-".concat(y.replaceAll("/","-"))),[A,{load:Y,loading:J}]=(e=>{let{markup:t,plainText:a,initialResult:s}=e,[r,n]=(0,i.useState)(s),[l,o]=(0,i.useState)(!1),c=(0,i.useRef)(!1);return[r,{loading:l,load:async()=>{if(!c.current){c.current=!0,o(!0);try{let e=await fetch("https://react.email/api/check-spam",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({html:t,plainText:a})}),s=await e.json();if(!("error"in s))return n(s),s;f.oR.error(s.error)}catch(e){console.error(e),f.oR.error(JSON.stringify(e))}finally{o(!1),c.current=!1}}}}]})({markup:h,plainText:b,initialResult:null!=c?c:I}),[X,q]=D("linter-".concat(y.replaceAll("/","-"))),[G,{load:$,loading:Q}]=(e=>{let{markup:t,initialRows:s}=e,[r,n]=(0,i.useState)(s),l=function(e,t){return[{getStream:()=>R(e,t),mapValue(e){if(e&&"success"!==e.status)return{result:e,source:"image"}}},{getStream:()=>M(e),mapValue(e){if(e&&"success"!==e.status)return{result:e,source:"link"}}}]}(t,"location"in a.g?"".concat(a.g.location.protocol,"//").concat(a.g.location.host):""),[o,c]=(0,i.useState)(!1),d=(0,i.useRef)(!1);return[r,{loading:o,load:async()=>{if(!d.current){d.current=!0,c(!0),n([]);try{let e=[];for await(let t of H(l))n(a=>{if(!a)return[t];let s=[...a,t];return s.sort((e,t)=>"error"===e.result.status&&"warning"===t.result.status?-1:+("warning"===e.result.status&&"error"===t.result.status)),e=s,s});return e}finally{c(!1),d.current=!1}}}}]})({markup:h,initialRows:null!=t?t:X}),[K,ee]=D("compatibility-".concat(y.replaceAll("/","-"))),[et,{load:ea,loading:es}]=(e=>{let{reactMarkup:t,emailPath:a,initialResults:s}=e,[r,n]=(0,i.useState)(s),[l,o]=(0,i.useState)(!1),c=(0,i.useRef)(!1);return[r,{loading:l,load:async()=>{if(c.current)return;c.current=!0,o(!0),n([]);let e=[];try{let s=await j(t,a);for await(let t of v(s))"error"===t.status&&n(a=>a?e=[...a,t]:[t])}catch(e){console.error(e),f.oR.error(JSON.stringify(e))}finally{o(!1),c.current=!1}return e}}]})({emailPath:w,reactMarkup:g,initialResults:null!=m?m:K});o.Hf||i.useEffect(()=>{(async()=>{q(await $()),F(await Y()),ee(await ea())})()},[]);let er=i.useId();return(0,s.jsx)("div",{"data-toggled":P,className:(0,d.cn)("absolute bottom-0 left-0 right-0","border-t border-slate-6 group/toolbar text-xs text-slate-11 h-52 transition-transform","data-[toggled=false]:translate-y-[10.625rem]"),children:(0,s.jsx)(r.bL,{value:null!=L?L:"",onValueChange:e=>{V(e)},asChild:!0,children:(0,s.jsxs)("div",{className:"flex flex-col h-full",children:[(0,s.jsxs)(r.B8,{className:"flex gap-4 px-4 border-b border-solid border-slate-6 h-10 w-full flex-shrink-0",children:[(0,s.jsxs)(n.o,{id:"toolbar-".concat(er),children:[(0,s.jsx)(r.l9,{asChild:!0,value:"linter",children:(0,s.jsx)(z,{active:"linter"===L,children:"Linter"})}),(0,s.jsx)(r.l9,{asChild:!0,value:"compatibility",children:(0,s.jsx)(z,{active:"compatibility"===L,children:"Compatibility"})}),(0,s.jsx)(r.l9,{asChild:!0,value:"spam-assassin",children:(0,s.jsx)(z,{active:"spam-assassin"===L,children:"Spam"})})]}),(0,s.jsxs)("div",{className:"flex gap-0.5 ml-auto",children:[(0,s.jsx)(z,{delayDuration:0,tooltip:"linter"===L&&"The Linter tab checks all the images and links for common issues like missing alt text, broken URLs, insecure HTTP methods, and more."||"spam-assassin"===L&&"The Spam tab will look at the content and use a robust scoring framework to determine if the email is likely to be spam. Powered by SpamAssassin."||"compatibility"===L&&"The Compatibility tab shows how well the HTML/CSS is supported across mail clients like Outlook, Gmail, etc. Powered by Can I Email."||"Info",children:(0,s.jsx)(x,{size:24})}),o.Hf?null:(0,s.jsx)(z,{tooltip:"Reload",disabled:Q||J,onClick:async()=>{void 0===L&&V("linter"),"spam-assassin"===L?await Y():"linter"===L?await $():"compatibility"===L&&await ea()},children:(0,s.jsx)(p,{size:24,className:(0,d.cn)({"opacity-60 animate-spin-fast":Q||J})})}),(0,s.jsx)(z,{tooltip:"Toggle toolbar",onClick:()=>{void 0===L?V("linter"):V(void 0)},children:(0,s.jsx)(u.R,{size:24,className:"transition-transform group-data-[toggled=false]/toolbar:rotate-180"})})]})]}),(0,s.jsxs)("div",{className:"flex-grow transition-opacity opacity-100 group-data-[toggled=false]/toolbar:opacity-0 overflow-y-auto pr-3 pl-4 pt-3",children:[(0,s.jsx)(r.UC,{value:"linter",children:Q?(0,s.jsx)(O,{message:"Analyzing your code for linting issues..."}):(null==G?void 0:G.length)===0?(0,s.jsxs)(U,{children:[(0,s.jsx)(W,{}),(0,s.jsx)(Z,{children:"All good"}),(0,s.jsx)(B,{children:"No linting issues found."})]}):(0,s.jsx)(T,{rows:null!=G?G:[]})}),(0,s.jsx)(r.UC,{value:"compatibility",children:es?(0,s.jsx)(O,{message:"Checking email compatibility..."}):(null==et?void 0:et.length)===0?(0,s.jsxs)(U,{children:[(0,s.jsx)(W,{}),(0,s.jsx)(Z,{children:"Great compatibility"}),(0,s.jsx)(B,{children:"Template should render properly everywhere."})]}):(0,s.jsx)(S,{results:null!=et?et:[]})}),(0,s.jsx)(r.UC,{value:"spam-assassin",children:J?(0,s.jsx)(O,{message:"Evaluating your email for spam indicators..."}):(null==A?void 0:A.isSpam)===!1?(0,s.jsxs)(U,{children:[(0,s.jsx)(W,{}),(0,s.jsx)(Z,{children:"10/10"}),(0,s.jsx)(B,{children:"Your email is clean of abuse indicators."})]}):(0,s.jsx)(E,{result:A})})]})]})})})},O=e=>{let{message:t}=e;return(0,s.jsxs)("div",{className:"flex flex-col items-center justify-center pt-8",children:[(0,s.jsxs)("div",{className:"relative mb-8 flex items-center justify-center",children:[(0,s.jsx)("div",{className:"h-12 w-12 rounded-full bg-gradient-to-br from-cyan-400/80 to-cyan-600/80 opacity-10 blur-xl absolute m-auto left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 animate-pulse"}),(0,s.jsx)("div",{className:"h-12 w-12 rounded-full border border-slate-4 absolute m-auto left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2"}),(0,s.jsx)("div",{className:"h-10 w-10 rounded-full flex items-center justify-center absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2",children:(0,s.jsx)("div",{className:"h-5 w-5 rounded-full border-2 border-white/50 border-t-transparent animate-spin-fast"})})]}),(0,s.jsx)("h3",{className:"text-slate-12 font-medium text-base mb-1",children:"Processing"}),(0,s.jsx)("p",{className:"text-slate-11 text-sm text-center max-w-[320px]",children:t})]})},U=e=>{let{children:t}=e;return(0,s.jsx)("div",{className:"flex flex-col items-center justify-center pt-8",children:t})},W=()=>(0,s.jsxs)("div",{className:"relative mb-8 flex items-center justify-center",children:[(0,s.jsx)("div",{className:"h-16 w-16 rounded-full bg-gradient-to-br from-green-300/20 opacity-80 to-emerald-500/30 blur-md absolute m-auto left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2"}),(0,s.jsx)("div",{className:"h-12 w-12 rounded-full bg-gradient-to-br from-green-400/80 opacity-10 to-emerald-600/80 absolute m-auto left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 shadow-lg"}),(0,s.jsx)("div",{className:"h-10 w-10 rounded-full bg-gradient-to-br from-green-400 to-emerald-600 flex items-center justify-center absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 shadow-[inset_0_1px_1px_rgba(255,255,255,0.4)]",children:(0,s.jsx)(m.i,{size:24,className:"text-white drop-shadow-sm"})})]}),Z=e=>{let{children:t}=e;return(0,s.jsx)("h3",{className:"text-slate-12 font-medium text-base mb-1",children:t})},B=e=>{let{children:t}=e;return(0,s.jsx)("p",{className:"text-slate-11 text-sm text-center max-w-[320px]",children:t})},A=e=>{let{serverLintingRows:t,serverSpamCheckingResult:a,serverCompatibilityResults:r}=e,{emailPath:n,emailSlug:l,renderedEmailMetadata:i}=(0,c.$)();if(void 0===i)return null;let{prettyMarkup:o,plainText:d,reactMarkup:u}=i;return(0,s.jsx)(F,{emailPath:n,emailSlug:l,prettyMarkup:o,reactMarkup:u,plainText:d,serverLintingRows:t,serverSpamCheckingResult:a,serverCompatibilityResults:r})}},2733:(e,t,a)=>{"use strict";a.d(t,{default:()=>J});var s=a(1275),r=a(2108),n=a(3611),l=a(7722),i=a(9361),o=a(7034),c=a(1464),d=a(2402);a(6209),a(1988),a(3560);var u=a(4957),m=a(4600);let h=n.forwardRef((e,t)=>{let{as:a="span",size:r="2",color:n="gray",transform:l,weight:i="normal",className:o,children:c,...d}=e;return(0,s.jsx)(u.DX,{className:(0,m.cn)(o,l,x(r),p(n),f(i)),ref:t,...d,children:(0,s.jsx)(a,{children:c})})}),x=e=>{switch(e){case"1":return"text-xs";case void 0:case"2":return"text-sm";case"3":return"text-base";case"4":return"text-lg";case"5":return["text-17px","md:text-xl tracking-[-0.16px]"];case"6":return"text-2xl tracking-[-0.288px]";case"7":return"text-[28px] leading-[34px] tracking-[-0.416px]";case"8":return"text-[35px] leading-[42px] tracking-[-0.64px]";case"9":return"text-6xl leading-[73px] tracking-[-0.896px]";default:return(0,m.HB)(e)}},p=e=>{switch(e){case"white":return"text-slate-12";case void 0:case"gray":return"text-slate-11";default:return(0,m.HB)(e)}},f=e=>{switch(e){case void 0:case"normal":return"font-normal";case"medium":return"font-medium";default:return(0,m.HB)(e)}};h.displayName="Text";var g=a(1789),b=a(4094),j=a(8031);let v={type:"spring",stiffness:2e3,damping:80,mass:1};var w=a(5155);let y=n.forwardRef((e,t)=>{let{children:a,className:r,...n}=e;return(0,s.jsx)("button",{type:"button",...n,className:(0,m.cn)("focus:ring-gray-8 rounded text-slate-11 transition duration-200 ease-in-out hover:text-slate-12 focus:text-slate-12 focus:outline-none focus:ring-2",r),ref:t,children:a})});y.displayName="IconButton";var C=a(616),N=a(4387);let k=n.forwardRef((e,t)=>{let{...a}=e;return(0,s.jsxs)(N.z,{ref:t,...a,children:[(0,s.jsx)("path",{d:"M9 6.75H7.75C6.64543 6.75 5.75 7.64543 5.75 8.75V17.25C5.75 18.3546 6.64543 19.25 7.75 19.25H16.25C17.3546 19.25 18.25 18.3546 18.25 17.25V8.75C18.25 7.64543 17.3546 6.75 16.25 6.75H15",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"1.5"}),(0,s.jsx)("path",{d:"M14 8.25H10C9.44772 8.25 9 7.80228 9 7.25V5.75C9 5.19772 9.44772 4.75 10 4.75H14C14.5523 4.75 15 5.19772 15 5.75V7.25C15 7.80228 14.5523 8.25 14 8.25Z",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"1.5"}),(0,s.jsx)("path",{d:"M9.75 12.25H14.25",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"1.5"}),(0,s.jsx)("path",{d:"M9.75 15.25H14.25",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"1.5"})]})});k.displayName="IconClipboard";let S=n.forwardRef((e,t)=>{let{...a}=e;return(0,s.jsx)(N.z,{ref:t,...a,children:(0,s.jsx)("path",{d:"M4.75 14.75v1.5a3 3 0 0 0 3 3h8.5a3 3 0 0 0 3-3v-1.5M12 14.25v-9.5M8.75 10.75l3.25 3.5 3.25-3.5",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.5})})});S.displayName="IconDownload";var L=a(5877);let R=e=>{let{markups:t,activeLang:a,setActiveLang:r}=e,l=t.find(e=>{let{language:t}=e;return a===t});if(!l)throw Error("No markup found for the active language!",{cause:{activeLang:a,markups:t}});let i=n.useId();return(0,s.jsxs)("div",{className:"relative max-h-[650px] w-full h-full whitespace-pre rounded-md border border-slate-6 text-sm",style:{lineHeight:"130%",background:"linear-gradient(145.37deg, rgba(255, 255, 255, 0.09) -8.75%, rgba(255, 255, 255, 0.027) 83.95%)",boxShadow:"rgb(0 0 0 / 10%) 0px 5px 30px -5px"},children:[(0,s.jsxs)("div",{className:"h-9 border-b border-slate-6",children:[(0,s.jsx)("div",{className:"flex",children:(0,s.jsx)(b.o,{id:i,children:t.map(e=>{let{language:t}=e,n=a===t;return(0,s.jsxs)(j.P.button,{className:"relative px-4 py-[8px] font-sans text-sm font-medium transition duration-200 ease-in-out hover:text-slate-12 ".concat(a!==t?"text-slate-11":"text-slate-12"),onClick:()=>{r(t)},children:[n?(0,s.jsx)(j.P.span,{animate:{opacity:1},className:"absolute bottom-0 left-0 right-0 top-0 bg-slate-4",exit:{opacity:0},initial:{opacity:0},layoutId:"code",transition:v}):null,w.A[t]]},t)})})}),(0,s.jsx)(M,{content:l.content}),(0,s.jsx)(H,{content:l.content,filename:"email.".concat(l.language)})]}),(0,s.jsx)("div",{className:"h-[calc(100%-2.25rem)]",children:(0,s.jsx)(d.Code,{language:a,children:l.content})})]})},M=e=>{let{content:t}=e,[a,r]=n.useState(!1),l=n.useRef(void 0);return n.useEffect(()=>{r(!1),clearTimeout(l.current),l.current=void 0},[t]),(0,s.jsxs)(L.m,{children:[(0,s.jsx)(L.m.Trigger,{asChild:!0,className:"absolute right-2 top-2 hidden md:block",children:(0,s.jsx)(y,{onClick:async()=>{r(!0),await (0,m.eM)(t),l.current=setTimeout(()=>{r(!1)},3e3)},children:a?(0,s.jsx)(C.i,{}):(0,s.jsx)(k,{})})}),(0,s.jsx)(L.m.Content,{children:"Copy to Clipboard"})]})},H=e=>{let{content:t,filename:a}=e,r=n.useMemo(()=>{let e=new File([t],a);return URL.createObjectURL(e)},[t,a]),l=n.useSyncExternalStore(()=>()=>{},()=>r,()=>void 0);return(0,s.jsxs)(L.m,{children:[(0,s.jsx)(L.m.Trigger,{asChild:!0,className:"text-gray-11 absolute right-8 top-2 hidden md:block",children:(0,s.jsx)("a",{className:"text-slate-11 transition duration-200 ease-in-out hover:text-slate-12",download:a,href:l,children:(0,s.jsx)(S,{})})}),(0,s.jsx)(L.m.Content,{children:"Download"})]})};var T=a(7148),P=a(6516);let E=[{name:"Desktop",dimensions:{width:1024,height:600},icon:(0,s.jsx)("svg",{width:"15",height:"15",viewBox:"0 0 15 15",fill:"none",children:(0,s.jsx)("path",{d:"M1 3.25C1 3.11193 1.11193 3 1.25 3H13.75C13.8881 3 14 3.11193 14 3.25V10.75C14 10.8881 13.8881 11 13.75 11H1.25C1.11193 11 1 10.8881 1 10.75V3.25ZM1.25 2C0.559643 2 0 2.55964 0 3.25V10.75C0 11.4404 0.559644 12 1.25 12H5.07341L4.82991 13.2986C4.76645 13.6371 5.02612 13.95 5.37049 13.95H9.62951C9.97389 13.95 10.2336 13.6371 10.1701 13.2986L9.92659 12H13.75C14.4404 12 15 11.4404 15 10.75V3.25C15 2.55964 14.4404 2 13.75 2H1.25ZM9.01091 12H5.98909L5.79222 13.05H9.20778L9.01091 12Z",fill:"currentColor",fillRule:"evenodd",clipRule:"evenodd"})})},{name:"Mobile",dimensions:{width:375,height:667},icon:(0,s.jsx)("svg",{width:"15",height:"15",viewBox:"0 0 15 15",fill:"none",children:(0,s.jsx)("path",{d:"M4 2.5C4 2.22386 4.22386 2 4.5 2H10.5C10.7761 2 11 2.22386 11 2.5V12.5C11 12.7761 10.7761 13 10.5 13H4.5C4.22386 13 4 12.7761 4 12.5V2.5ZM4.5 1C3.67157 1 3 1.67157 3 2.5V12.5C3 13.3284 3.67157 14 4.5 14H10.5C11.3284 14 12 13.3284 12 12.5V2.5C12 1.67157 11.3284 1 10.5 1H4.5ZM6 11.65C5.8067 11.65 5.65 11.8067 5.65 12C5.65 12.1933 5.8067 12.35 6 12.35H9C9.1933 12.35 9.35 12.1933 9.35 12C9.35 11.8067 9.1933 11.65 9 11.65H6Z",fill:"currentColor",fillRule:"evenodd",clipRule:"evenodd"})})}],V=e=>{let{minWidth:t,minHeight:a,viewWidth:r,viewHeight:l,setViewWidth:i,setViewHeight:o}=e,[c,d]=n.useState(!1),[u,h]=n.useState(r),[x,p]=n.useState(l);return n.useEffect(()=>{h(r),p(l)},[r,l]),(0,s.jsxs)("div",{className:"relative flex h-9 w-fit overflow-hidden rounded-lg border border-slate-6 text-sm transition-colors duration-300 ease-in-out",children:[E.map(e=>(0,s.jsxs)(L.m,{children:[(0,s.jsx)(L.m.Trigger,{asChild:!0,children:(0,s.jsx)("button",{onClick:()=>(e=>{i(e.width),o(e.height)})(e.dimensions),className:(0,m.cn)("relative flex items-center justify-center w-9 transition-colors hover:text-slate-12",{"bg-slate-4":r===e.dimensions.width&&l===e.dimensions.height}),type:"button",children:e.icon},e.name)}),(0,s.jsx)(L.m.Content,{children:e.name})]})),(0,s.jsxs)(T.bL,{open:c,onOpenChange:d,children:[(0,s.jsx)(T.l9,{asChild:!0,children:(0,s.jsxs)("button",{type:"button",className:"relative flex items-center justify-center overflow-hidden w-9 text-slate-11 text-sm leading-none outline-none transition-colors ease-linear focus-within:text-slate-12 hover:text-slate-12 focus:text-slate-12",children:[(0,s.jsx)("span",{className:"sr-only",children:"View presets"}),(0,s.jsx)(P.R,{className:(0,m.cn)("transform transition-transform duration-200 ease-[cubic-bezier(.36,.66,.6,1)]",{"-rotate-180":c})})]})}),(0,s.jsx)(T.ZL,{children:(0,s.jsxs)(T.UC,{align:"end",className:"flex min-w-[12rem] flex-col gap-2 rounded-md border border-slate-8 border-solid bg-black px-2 py-2 text-white",sideOffset:5,children:[(0,s.jsxs)("div",{className:"flex w-full items-center justify-between text-sm gap-2",children:[(0,s.jsx)("span",{className:"font-medium text-slate-11 text-xs",children:"Width"}),(0,s.jsx)("input",{type:"number",value:u,onChange:e=>{let a=Number(e.target.value);h(a),a>=t&&i(a)},className:"w-20 appearance-none rounded-lg border border-slate-6 bg-slate-5 px-1 py-1 text-sm text-slate-12 placeholder-slate-10 outline-none transition duration-300 ease-in-out focus:ring-1 focus:ring-slate-10"})]}),(0,s.jsxs)("div",{className:"flex w-full items-center justify-between text-sm gap-2",children:[(0,s.jsx)("span",{className:"font-medium text-slate-11 text-xs",children:"Height"}),(0,s.jsx)("input",{type:"number",value:x,onChange:e=>{let t=Number(e.target.value);p(t),t>=a&&o(t)},className:"w-20 appearance-none rounded-lg border border-slate-6 bg-slate-5 px-1 py-1 text-sm text-slate-12 placeholder-slate-10 outline-none transition duration-300 ease-in-out focus:ring-1 focus:ring-slate-10"})]})]})})]})]})},I=e=>{let{width:t,height:a,onResize:r,onResizeEnd:l,children:i,maxHeight:o,maxWidth:c,minHeight:d,minWidth:h,...x}=e,p=(0,n.useRef)(null),[f,g]=(0,n.useState)(!1),b=(0,n.useRef)(null),[j,v]=(0,n.useState)(null),w=(0,n.useCallback)(()=>{b.current&&document.removeEventListener("mousemove",b.current),document.removeEventListener("mouseup",w),g(!1),v(null),null==l||l()},[]),y=e=>{b.current=t=>{if(0===t.button&&p.current){let a="east"===e||"west"===e,s=a?t.clientX:t.clientY,n=p.current.getBoundingClientRect(),l=a?n.x+n.width/2:n.y+n.height/2,i=2*Math.abs(s-l);g(!0),v(e);for(let t=0;t<E.length;t++){let s=E[t];if(s){if(a&&i>s.dimensions.width-12&&i<s.dimensions.width+12)return void r(s.dimensions.width,e);if(!a&&i>s.dimensions.height-12&&i<s.dimensions.height+12)return void r(s.dimensions.height,e)}}r(2*Math.abs(s-l),e)}else w()},document.addEventListener("mouseup",w),document.addEventListener("mousemove",b.current)};return(0,n.useEffect)(()=>{if(window.document)return()=>{w()}},[]),(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)("div",{className:" overflow-hidden absolute inset-0",children:(0,s.jsx)("div",{className:"absolute mx-auto box-content -translate-x-1/2 -translate-y-1/2 left-1/2 top-1/2",children:E.map(e=>(0,s.jsxs)("div",{className:"-translate-x-1/2 -translate-y-1/2 absolute pointer-events-none select-none",style:{width:e.dimensions.width,height:e.dimensions.height},children:[t===e.dimensions.width&&f&&("east"===j||"west"===j)&&(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)("div",{className:"absolute right-0 -top-[100vw] -bottom-[100vw] border-r-2 border-cyan-5"}),(0,s.jsx)("div",{className:"absolute left-0 -top-[100vw] -bottom-[100vw] border-l-2 border-cyan-5"})]}),a===e.dimensions.height&&f&&("north"===j||"south"===j)&&(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)("div",{className:"absolute top-0 -left-[100vw] -right-[100vw] border-t-2 border-cyan-5"}),(0,s.jsx)("div",{className:"absolute bottom-0 -left-[100vw] -right-[100vw] border-b-2 border-cyan-5"})]})]},e.name))})}),(0,s.jsxs)("div",{...x,className:(0,m.cn)("relative mx-auto my-auto box-content",x.className),children:[(0,s.jsx)("div",{"aria-label":"resize-west","aria-valuenow":t,"aria-valuemin":h,"aria-valuemax":c,className:"-translate-x-1/2 -translate-y-1/2 absolute top-1/2 -left-2 cursor-w-resize p-2 [user-drag:none]",onDragStart:e=>e.preventDefault(),draggable:"false",onMouseDown:()=>{y("west")},role:"slider",tabIndex:0,children:(0,s.jsx)("div",{className:(0,m.cn)("h-8 w-1 rounded-md bg-black/50 transition-colors",{"bg-black":"west"===j})})}),(0,s.jsx)("div",{"aria-label":"resize-east","aria-valuenow":t,"aria-valuemin":h,"aria-valuemax":c,onDragStart:e=>e.preventDefault(),className:"translate-x-1/2 -translate-y-1/2 absolute top-1/2 -right-2 cursor-e-resize p-2 [user-drag:none]",draggable:"false",onMouseDown:()=>{y("east")},role:"slider",tabIndex:0,children:(0,s.jsx)("div",{className:(0,m.cn)("h-8 w-1 rounded-md bg-black/50 transition-colors",{"bg-black":"east"===j})})}),(0,s.jsx)("div",{"aria-label":"resize-north","aria-valuenow":a,"aria-valuemin":d,"aria-valuemax":o,onDragStart:e=>e.preventDefault(),className:"-translate-x-1/2 -translate-y-1/2 absolute -top-2 left-1/2 cursor-n-resize p-2 [user-drag:none]",draggable:"false",onMouseDown:()=>{y("north")},role:"slider",tabIndex:0,children:(0,s.jsx)("div",{className:(0,m.cn)("h-1 w-8 rounded-md bg-black/50 transition-colors",{"bg-black":"north"===j})})}),(0,s.jsx)("div",{"aria-label":"resize-south","aria-valuenow":a,"aria-valuemin":d,"aria-valuemax":o,onDragStart:e=>e.preventDefault(),className:"-translate-x-1/2 translate-y-1/2 absolute -bottom-2 left-1/2 cursor-s-resize p-2 [user-drag:none]",draggable:"false",onMouseDown:()=>{y("south")},role:"slider",tabIndex:0,children:(0,s.jsx)("div",{className:(0,m.cn)("h-1 w-8 rounded-md bg-black/50 transition-colors",{"bg-black":"south"===j})})}),(0,s.jsx)(u.DX,{ref:p,className:f?"pointer-events-none select-none":"",children:i})]})]})},z=e=>{let{markup:t}=e,[a,r]=n.useState(""),[l,o]=n.useState("Testing React Email"),[d,u]=n.useState(!1),[m,x]=n.useState(!1),p=async e=>{try{e.preventDefault(),u(!0);let s=await fetch("https://react.email/api/send/test",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({to:a,subject:l,html:t})});if(429===s.status){let{error:e}=await s.json();i.oR.error(e)}i.oR.success("Email sent! Check your inbox.")}catch(e){i.oR.error("Something went wrong. Please try again.")}finally{u(!1)}},f=n.useId(),g=n.useId();return(0,s.jsxs)(T.bL,{onOpenChange:()=>{m?(document.body.classList.remove("popup-open"),x(!1)):(document.body.classList.add("popup-open"),x(!0))},open:m,children:[(0,s.jsx)(T.l9,{asChild:!0,children:(0,s.jsx)("button",{className:"box-border flex h-5 w-20 items-center justify-center self-center rounded-lg border border-slate-6 bg-slate-2 px-4 py-4 text-center font-sans text-sm text-slate-11 outline-none transition duration-300 ease-in-out hover:border-slate-10 hover:text-slate-12",type:"submit",children:"Send"})}),(0,s.jsx)(T.Mz,{}),(0,s.jsx)(T.ZL,{children:(0,s.jsx)(T.UC,{align:"end",className:"-mt-10 w-80 rounded-lg border border-slate-6 bg-black/70 p-3 text-slate-11 shadow-md backdrop-blur-lg font-sans",sideOffset:48,children:(0,s.jsxs)("form",{className:"mt-1",onSubmit:e=>void p(e),children:[(0,s.jsx)("label",{className:"mb-2 block text-xs uppercase text-slate-10",htmlFor:f,children:"Recipient"}),(0,s.jsx)("input",{autoFocus:!0,className:"mb-3 w-full appearance-none rounded-lg border border-slate-6 bg-slate-3 px-2 py-1 text-sm text-slate-12 placeholder-slate-10 outline-none transition duration-300 ease-in-out focus:ring-1 focus:ring-slate-10",defaultValue:a,id:f,onChange:e=>{r(e.target.value)},placeholder:"you@example.com",required:!0,type:"email"}),(0,s.jsx)("label",{className:"mb-2 mt-1 block text-xs uppercase text-slate-10",htmlFor:g,children:"Subject"}),(0,s.jsx)("input",{className:"mb-3 w-full appearance-none rounded-lg border border-slate-6 bg-slate-3 px-2 py-1 text-sm text-slate-12 placeholder-slate-10 outline-none transition duration-300 ease-in-out focus:ring-1 focus:ring-slate-10",defaultValue:l,id:g,onChange:e=>{o(e.target.value)},placeholder:"My Email",required:!0,type:"text"}),(0,s.jsx)("input",{className:"appearance-none checked:bg-blue-500",type:"checkbox"}),(0,s.jsxs)("div",{className:"mt-3 flex items-center justify-between",children:[(0,s.jsxs)(h,{className:"inline-block",size:"1",children:["Powered by"," ",(0,s.jsx)("a",{className:"text-white/85 transition duration-300 ease-in-out hover:text-slate-12",href:"https://resend.com",rel:"noreferrer",target:"_blank",children:"Resend"})]}),(0,s.jsx)(c.Button,{className:"disabled:border-transparent disabled:bg-slate-11",disabled:0===l.length||0===a.length||d,type:"submit",children:"Send"})]})]})})})]})};var D=a(2566),_=a(5571);let F=n.forwardRef((e,t)=>{let{...a}=e;return(0,s.jsx)(N.z,{ref:t,...a,children:(0,s.jsx)("path",{d:"M9.75 15.25H17.25C18.3546 15.25 19.25 14.3546 19.25 13.25V6.75C19.25 5.64543 18.3546 4.75 17.25 4.75H6.75C5.64543 4.75 4.75 5.64543 4.75 6.75V13.25C4.75 14.3546 5.64543 15.25 6.75 15.25H9.75ZM9.75 15.25C9.75 15.25 10 18.25 8 19.25H16C14 18.25 14.25 15.25 14.25 15.25",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"1.5"})})});F.displayName="IconMonitor";let O=n.forwardRef((e,t)=>{let{...a}=e;return(0,s.jsx)(N.z,{ref:t,...a,children:(0,s.jsx)("path",{d:"M17.4 15L21 11.5L17.4 8M6.6 8L3 11.5L6.6 15M14.25 4.5L9.75 18.5",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"1.5"})})});O.displayName="IconSource";let U=e=>{let{activeView:t,setActiveView:a}=e;return(0,s.jsxs)(_.bL,{"aria-label":"View mode",className:"inline-block items-center bg-slate-2 border border-slate-6 rounded-md overflow-hidden h-[36px]",onValueChange:e=>{e&&a(e)},type:"single",value:t,children:[(0,s.jsx)(_.q7,{value:"preview",children:(0,s.jsxs)(L.m,{children:[(0,s.jsx)(L.m.Trigger,{asChild:!0,children:(0,s.jsxs)("div",{className:(0,m.cn)("w-9 flex items-center py-2 transition ease-in-out duration-200 relative hover:text-slate-12",{"text-slate-11":"desktop"!==t,"text-slate-12":"desktop"===t}),children:["preview"===t&&(0,s.jsx)(j.P.span,{animate:{opacity:1},className:"absolute left-0 right-0 top-0 bottom-0 bg-slate-4",exit:{opacity:0},initial:{opacity:0},layoutId:"topbar-tabs",transition:v}),(0,s.jsx)(F,{className:"m-auto"})]})}),(0,s.jsx)(L.m.Content,{children:"Preview"})]})}),(0,s.jsx)(_.q7,{value:"source",children:(0,s.jsxs)(L.m,{children:[(0,s.jsx)(L.m.Trigger,{asChild:!0,children:(0,s.jsxs)("div",{className:(0,m.cn)("w-9 flex py-2 transition ease-in-out duration-200 relative hover:text-slate-12",{"text-slate-11":"source"!==t,"text-slate-12":"source"===t}),children:["source"===t&&(0,s.jsx)(j.P.span,{animate:{opacity:1},className:"absolute left-0 right-0 top-0 bottom-0 bg-slate-4",exit:{opacity:0},initial:{opacity:0},layoutId:"topbar-tabs",transition:v}),(0,s.jsx)(O,{className:"m-auto"})]})}),(0,s.jsx)(L.m.Content,{children:"Code"})]})})]})};var W=a(1524);let Z=(e,t,a)=>Math.min(Math.max(e,t),a),B=(e,t,a)=>{let[s,r]=(0,n.useState)(e);return[Z(s,t,a),e=>{"function"==typeof e?r(s=>{let r=Z(s,t,a);return Z(e(r),t,a)}):r(Z(e,t,a))}]},A=e=>{let{children:t}=e,a=t.match(/(Unexpected closing tag "[^"]+". It may happen when the tag has already been closed by another tag). (For more info see) (.+)/);if(a){let[e,t,r,n]=a;return(0,s.jsxs)(s.Fragment,{children:[t,".",(0,s.jsxs)("p",{className:"text-lg",children:[r," ",(0,s.jsx)("a",{className:"underline",rel:"noreferrer",target:"_blank",href:n,children:n})]})]})}return t},Y=e=>{let{error:t}=e;return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)("div",{className:"absolute inset-0 z-50 bg-black/80"}),(0,s.jsxs)("div",{className:" min-h-[50vh] w-full max-w-lg sm:rounded-lg md:max-w-[568px] lg:max-w-[920px] absolute left-[50%] top-[50%] z-50 translate-x-[-50%] translate-y-[-50%] rounded-t-sm overflow-hidden bg-white text-black shadow-lg duration-200 flex flex-col selection:!text-black ",children:[(0,s.jsx)("div",{className:"bg-red-500 h-3"}),(0,s.jsxs)("div",{className:"flex flex-grow p-6 min-w-0 max-w-full flex-col space-y-1.5",children:[(0,s.jsxs)("div",{className:"flex-shrink pb-2 text-xl tracking-tight",children:[(0,s.jsx)("b",{children:t.name}),": ",(0,s.jsx)(A,{children:t.message})]}),t.stack?(0,s.jsx)("div",{className:"flex-grow scroll-px-4 overflow-x-auto rounded-lg bg-black p-2 text-gray-100",children:(0,s.jsx)("pre",{className:"w-full min-w-0 font-mono leading-6 selection:!text-cyan-12 text-xs",children:t.stack})}):void 0]})]})]})},J=e=>{var t,a;let{emailTitle:c,className:d,...u}=e,{renderingResult:h,renderedEmailMetadata:x}=(0,W.$)(),p=(0,r.useRouter)(),f=(0,r.usePathname)(),b=(0,r.useSearchParams)(),j=null!=(t=b.get("view"))?t:"preview",v=null!=(a=b.get("lang"))?a:"jsx",w=void 0!==x,y="error"in h,[C,N]=(0,n.useState)(1/0),[k,S]=(0,n.useState)(1/0),M=b.get("width"),H=b.get("height"),[T,P]=B(M?Number.parseInt(M):1024,220,C),[E,_]=B(H?Number.parseInt(H):600,352,k),F=(0,o.YQ)(()=>{let e=new URLSearchParams(b);e.set("width",T.toString()),e.set("height",E.toString()),p.push("".concat(f,"?").concat(e.toString()).concat(location.hash))},300),{toggled:O}=(0,D.S)();return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsxs)(g.Topbar,{emailTitle:c,children:["preview"===j&&(0,s.jsx)(V,{setViewHeight:e=>{_(e),(0,l.flushSync)(()=>{F()})},setViewWidth:e=>{P(e),(0,l.flushSync)(()=>{F()})},viewHeight:E,viewWidth:T,minWidth:220,minHeight:352}),(0,s.jsx)(U,{activeView:j,setActiveView:e=>{let t=new URLSearchParams(b);t.set("view",e),p.push("".concat(f,"?").concat(t.toString()).concat(location.hash))}}),w?(0,s.jsx)("div",{className:"flex justify-end",children:(0,s.jsx)(z,{markup:x.markup})}):null]}),(0,s.jsxs)("div",{...u,className:(0,m.cn)("h-[calc(100%-3.5rem-2.375rem)] will-change-[height] flex p-4 transition-[height] duration-300 relative","preview"===j&&"bg-gray-200",O&&"h-[calc(100%-3.5rem-13rem)]",d),ref:e=>{let t=new ResizeObserver(e=>{let[t]=e;t&&(N(t.contentRect.width),S(t.contentRect.height))});return e&&t.observe(e),()=>{t.disconnect()}},children:[y?(0,s.jsx)(Y,{error:h.error}):null,w?(0,s.jsxs)(s.Fragment,{children:["preview"===j&&(0,s.jsx)(I,{minHeight:352,minWidth:220,maxHeight:k,maxWidth:C,height:E,onResizeEnd:()=>{F()},onResize:(e,t)=>{"east"===t||"west"===t?P(Math.round(e)):_(Math.round(e))},width:T,children:(0,s.jsx)("iframe",{className:"max-h-full rounded-lg bg-white [color-scheme:auto]",ref:e=>{if(e)return(e=>{var t,a;let s=t=>{let a=e.getBoundingClientRect();document.dispatchEvent(new MouseEvent("mousemove",{...t,clientX:t.clientX+a.x,clientY:t.clientY+a.y}))},r=e=>{document.dispatchEvent(new MouseEvent("mouseup",e))};return null==(t=e.contentDocument)||t.addEventListener("mousemove",s),null==(a=e.contentDocument)||a.addEventListener("mouseup",r),()=>{var t,a;null==(t=e.contentDocument)||t.removeEventListener("mousemove",s),null==(a=e.contentDocument)||a.removeEventListener("mouseup",r)}})(e)},srcDoc:x.markup,style:{width:"".concat(T,"px"),height:"".concat(E,"px")},title:c})}),"source"===j&&(0,s.jsx)("div",{className:"h-full w-full",children:(0,s.jsx)("div",{className:"m-auto h-full flex max-w-3xl p-6",children:(0,s.jsx)(L.m.Provider,{children:(0,s.jsx)(R,{activeLang:v,markups:[{language:"jsx",content:x.reactMarkup},{language:"markup",content:x.prettyMarkup},{language:"markdown",content:x.plainText}],setActiveLang:e=>{let t=new URLSearchParams(b);t.set("view","source"),t.set("lang",e);let a=b.get("lang")===e;p.push("".concat(f,"?").concat(t.toString()).concat(a?location.hash:""))}})})})})]}):null,(0,s.jsx)(i.l$,{})]})]})}},4137:(e,t,a)=>{Promise.resolve().then(a.bind(a,2733)),Promise.resolve().then(a.bind(a,6197)),Promise.resolve().then(a.bind(a,2566)),Promise.resolve().then(a.bind(a,1524))}},e=>{e.O(0,[979,983,900,442,615,105,713,358],()=>e(e.s=4137)),_N_E=e.O()}]);
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
import type { Root, Rule } from 'postcss';
|
|
2
|
-
import postcss from 'postcss';
|
|
3
|
-
import evaluateTailwindFunctions from 'tailwindcss/lib/lib/evaluateTailwindFunctions';
|
|
4
|
-
import { generateRules as rawGenerateRules } from 'tailwindcss/lib/lib/generateRules';
|
|
5
|
-
import type { JitContext } from 'tailwindcss/lib/lib/setupContextUtils';
|
|
6
|
-
|
|
7
|
-
export const generateTailwindCssRules = (
|
|
8
|
-
classNames: string[],
|
|
9
|
-
tailwindContext: JitContext,
|
|
10
|
-
): { root: Root; rules: Rule[] } => {
|
|
11
|
-
const bigIntRuleTuples: [bigint, Rule][] = rawGenerateRules(
|
|
12
|
-
new Set(classNames),
|
|
13
|
-
tailwindContext,
|
|
14
|
-
);
|
|
15
|
-
|
|
16
|
-
const root = postcss.root({
|
|
17
|
-
nodes: bigIntRuleTuples.map(([, rule]) => rule),
|
|
18
|
-
});
|
|
19
|
-
evaluateTailwindFunctions(tailwindContext)(root);
|
|
20
|
-
|
|
21
|
-
const actualRules: Rule[] = [];
|
|
22
|
-
root.walkRules((rule) => {
|
|
23
|
-
actualRules.push(rule);
|
|
24
|
-
});
|
|
25
|
-
|
|
26
|
-
return {
|
|
27
|
-
root,
|
|
28
|
-
rules: actualRules,
|
|
29
|
-
};
|
|
30
|
-
};
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import { createContext } from 'tailwindcss/lib/lib/setupContextUtils';
|
|
2
|
-
import resolveConfig from 'tailwindcss/resolveConfig';
|
|
3
|
-
import type { TailwindConfig } from './get-tailwind-config';
|
|
4
|
-
|
|
5
|
-
export const setupTailwindContext = (config: TailwindConfig) => {
|
|
6
|
-
return createContext(
|
|
7
|
-
resolveConfig({
|
|
8
|
-
...config,
|
|
9
|
-
content: [],
|
|
10
|
-
corePlugins: {
|
|
11
|
-
preflight: false,
|
|
12
|
-
},
|
|
13
|
-
}),
|
|
14
|
-
);
|
|
15
|
-
};
|
package/tailwind-internals.d.ts
DELETED
|
@@ -1,131 +0,0 @@
|
|
|
1
|
-
declare module "tailwindcss/lib/lib/evaluateTailwindFunctions" {
|
|
2
|
-
import type { JitContext } from "tailwindcss/lib/lib/setupContextUtils";
|
|
3
|
-
import type { Root } from "postcss";
|
|
4
|
-
|
|
5
|
-
export default function evaluateTailwindFunctions(
|
|
6
|
-
context: JITContext,
|
|
7
|
-
): (root: Root) => void;
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
declare module "tailwindcss/lib/lib/resolveDefaultsAtRules" {
|
|
11
|
-
import type { JitContext } from "tailwindcss/lib/lib/setupContextUtils";
|
|
12
|
-
import type { Root } from "postcss";
|
|
13
|
-
|
|
14
|
-
export default function expandApplyAtRules(
|
|
15
|
-
context: JITContext,
|
|
16
|
-
): (root: Root) => void;
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
declare module "tailwindcss/lib/lib/partitionApplyAtRules" {
|
|
20
|
-
import type { Root } from "postcss";
|
|
21
|
-
|
|
22
|
-
export default function partitionApplyAtRules(): (root: Root) => void;
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
declare module "tailwindcss/lib/lib/substituteScreenAtRules" {
|
|
26
|
-
import type { Root } from "postcss";
|
|
27
|
-
|
|
28
|
-
export default function substituteScreenAtRules(
|
|
29
|
-
context: JITContext,
|
|
30
|
-
): (root: Root) => void;
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
declare module "tailwindcss/lib/lib/resolveDefaultsAtRules" {
|
|
34
|
-
import type { JitContext } from "tailwindcss/lib/lib/setupContextUtils";
|
|
35
|
-
import type { Root } from "postcss";
|
|
36
|
-
|
|
37
|
-
export default function expandApplyAtRules(
|
|
38
|
-
context: JITContext,
|
|
39
|
-
): (root: Root) => void;
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
declare module "tailwindcss/lib/lib/expandApplyAtRules" {
|
|
43
|
-
import type { JitContext } from "tailwindcss/lib/lib/setupContextUtils";
|
|
44
|
-
import type { Root } from "postcss";
|
|
45
|
-
|
|
46
|
-
export default function expandApplyAtRules(
|
|
47
|
-
context: JITContext,
|
|
48
|
-
): (root: Root) => void;
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
declare module "tailwindcss/lib/lib/expandTailwindAtRules" {
|
|
52
|
-
import type { JitContext } from "tailwindcss/lib/lib/setupContextUtils";
|
|
53
|
-
import type { Root } from "postcss";
|
|
54
|
-
|
|
55
|
-
export default async function expandTailwindAtRules(
|
|
56
|
-
context: JITContext,
|
|
57
|
-
): (root: Root) => Promise<void>;
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
declare module "tailwindcss/lib/lib/collapseAdjacentRules" {
|
|
61
|
-
import type { JitContext } from "tailwindcss/lib/lib/setupContextUtils";
|
|
62
|
-
import type { Root } from "postcss";
|
|
63
|
-
|
|
64
|
-
export default async function collapseAdjacentRules(
|
|
65
|
-
context: JITContext,
|
|
66
|
-
): (root: Root) => void;
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
declare module "tailwindcss/lib/lib/collapseDuplicateDeclarations" {
|
|
70
|
-
import type { JitContext } from "tailwindcss/lib/lib/setupContextUtils";
|
|
71
|
-
import type { Root } from "postcss";
|
|
72
|
-
|
|
73
|
-
export default async function collapseDuplicateDeclarations(
|
|
74
|
-
context: JITContext,
|
|
75
|
-
): (root: Root) => void;
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
declare module "tailwindcss/lib/lib/generateRules" {
|
|
79
|
-
import type { JitContext } from "tailwindcss/lib/lib/setupContextUtils";
|
|
80
|
-
import type { Rule } from "postcss";
|
|
81
|
-
|
|
82
|
-
export function generateRules(
|
|
83
|
-
classNames: Set<string>,
|
|
84
|
-
context: JITContext,
|
|
85
|
-
): [bigint, Rule][];
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
// taken from https://github.com/vinicoder/tw-to-css/blob/main/types.d.ts
|
|
89
|
-
// thanks vinicoder!
|
|
90
|
-
declare module "tailwindcss/lib/lib/setupContextUtils" {
|
|
91
|
-
import type { Container, Node } from "postcss";
|
|
92
|
-
import type { Config } from "tailwindcss";
|
|
93
|
-
import type resolveConfig from "tailwindcss/resolveConfig";
|
|
94
|
-
|
|
95
|
-
interface ChangedContent {
|
|
96
|
-
content: string;
|
|
97
|
-
extension?: string;
|
|
98
|
-
}
|
|
99
|
-
|
|
100
|
-
interface Api {
|
|
101
|
-
container: Container;
|
|
102
|
-
separator: string;
|
|
103
|
-
format: (def: string) => void;
|
|
104
|
-
wrap: (rule: Container) => void;
|
|
105
|
-
}
|
|
106
|
-
|
|
107
|
-
type VariantPreview = string;
|
|
108
|
-
|
|
109
|
-
type VariantFn = [number, (api: Api) => VariantPreview | undefined];
|
|
110
|
-
|
|
111
|
-
type VariantName = string;
|
|
112
|
-
|
|
113
|
-
export interface JitContext {
|
|
114
|
-
changedContent: ChangedContent[];
|
|
115
|
-
ruleCache: Set<unknown>;
|
|
116
|
-
candidateRuleCache: Map<unknown, unknown>;
|
|
117
|
-
classCache: Map<unknown, unknown>;
|
|
118
|
-
applyClassCache: Map<unknown, unknown>;
|
|
119
|
-
notClassCache: Set<unknown>;
|
|
120
|
-
postCssNodeCache: Map<unknown, unknown>;
|
|
121
|
-
|
|
122
|
-
getClassList: () => string[];
|
|
123
|
-
tailwindConfig: TailwindConfig;
|
|
124
|
-
variantMap: Map<VariantName, VariantFn[]>;
|
|
125
|
-
}
|
|
126
|
-
|
|
127
|
-
export function createContext(
|
|
128
|
-
config: ReturnType<typeof resolveConfig>,
|
|
129
|
-
changedContent?: ChangedContent[],
|
|
130
|
-
): JitContext;
|
|
131
|
-
}
|
|
File without changes
|
|
File without changes
|