diff --git a/apps/demo/emails/tailwind.config.ts b/apps/demo/emails/tailwind.config.ts new file mode 100644 index 0000000000..3c1a2b8acb --- /dev/null +++ b/apps/demo/emails/tailwind.config.ts @@ -0,0 +1,5 @@ +import { pixelBasedPreset, type TailwindConfig } from '@react-email/components'; + +export default { + presets: [pixelBasedPreset], +} satisfies TailwindConfig; 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..bec52fc050 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 @@ -3512,6 +3512,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 +3613,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 +3650,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: @@ -8206,6 +8331,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'} @@ -11573,6 +11701,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 +11797,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 +11829,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) @@ -17376,6 +17617,8 @@ snapshots: transitivePeerDependencies: - ts-node + tailwindcss@4.1.12: {} + tapable@2.2.1: {} tar-fs@3.0.8: