rohit/probo
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Migrate emails to the unified react-email package

Browse Source 
Replace the deprecated @react-email/components dependency (and its
deprecated sub-packages) with the unified react-email package per the
React Email 6 migration, updating all component and render imports across
the email templates from "@react-email/components" to "react-email".

This removes the npm deprecation warnings emitted by the old
@react-email/* packages while keeping the template build output
unchanged.

Signed-off-by: Sacha Al Himdani <sacha@probo.com>
This commit is contained in:
Sacha Al Himdani
2026-06-17 14:38:32 +02:00
parent c195320649
commit 127b78cace
20 changed files with 1152 additions and 375 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1487
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

4
packages/emails/package.json
View File

@@ -9,9 +9,9 @@
"export": "email export"
},
"dependencies": {
"@react-email/components": "^0.5.6",
"react": "^19.0.0",
"react-dom": "^19.0.0"
"react-dom": "^19.0.0",
"react-email": "^6.6.3"
},
"devDependencies": {
"@types/node": "^22.10.7",

2
packages/emails/scripts/build.ts
View File

@@ -12,7 +12,7 @@
// OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
// PERFORMANCE OF THIS SOFTWARE.
import { render } from "@react-email/components";
import { render } from "react-email";
import { copyFile, mkdir, writeFile } from "node:fs/promises";
import { dirname, join } from "node:path";
import { fileURLToPath } from "node:url";

2
packages/emails/src/ConfirmEmail.tsx
View File

@@ -12,7 +12,7 @@
// OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
// PERFORMANCE OF THIS SOFTWARE.
import { Button, Section, Text } from '@react-email/components';
import { Button, Section, Text } from 'react-email';
import * as React from 'react';
import EmailLayout, { bodyText, button, buttonContainer, footerText } from './components/EmailLayout';

2
packages/emails/src/DocumentApproval.tsx
View File

@@ -12,7 +12,7 @@
// OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
// PERFORMANCE OF THIS SOFTWARE.
import { Button, Section, Text } from '@react-email/components';
import { Button, Section, Text } from 'react-email';
import * as React from 'react';
import EmailLayout, { bodyText, button, buttonContainer, footerText } from './components/EmailLayout';

2
packages/emails/src/DocumentExport.tsx
View File

@@ -12,7 +12,7 @@
// OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
// PERFORMANCE OF THIS SOFTWARE.
import { Button, Section, Text } from '@react-email/components';
import { Button, Section, Text } from 'react-email';
import * as React from 'react';
import EmailLayout, { bodyText, button, buttonContainer, footerText } from './components/EmailLayout';

2
packages/emails/src/DocumentSigning.tsx
View File

@@ -12,7 +12,7 @@
// OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
// PERFORMANCE OF THIS SOFTWARE.
import { Button, Section, Text } from '@react-email/components';
import { Button, Section, Text } from 'react-email';
import * as React from 'react';
import EmailLayout, { bodyText, button, buttonContainer, footerText } from './components/EmailLayout';

2
packages/emails/src/ElectronicSignatureCertificate.tsx
View File

@@ -12,7 +12,7 @@
// OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
// PERFORMANCE OF THIS SOFTWARE.
import { Text } from "@react-email/components";
import { Text } from "react-email";
import * as React from "react";
import EmailLayout, {
bodyText,

2
packages/emails/src/FrameworkExport.tsx
View File

@@ -12,7 +12,7 @@
// OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
// PERFORMANCE OF THIS SOFTWARE.
import { Button, Section, Text } from '@react-email/components';
import { Button, Section, Text } from 'react-email';
import * as React from 'react';
import EmailLayout, { bodyText, button, buttonContainer, footerText } from './components/EmailLayout';

2
packages/emails/src/Invitation.tsx
View File

@@ -12,7 +12,7 @@
// OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
// PERFORMANCE OF THIS SOFTWARE.
import { Button, Section, Text } from '@react-email/components';
import { Button, Section, Text } from 'react-email';
import * as React from 'react';
import EmailLayout, { bodyText, button, buttonContainer, footerText } from './components/EmailLayout';

2
packages/emails/src/MagicLink.tsx
View File

@@ -12,7 +12,7 @@
// OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
// PERFORMANCE OF THIS SOFTWARE.
import { Button, Section, Text } from "@react-email/components";
import { Button, Section, Text } from "react-email";
import * as React from "react";
import EmailLayout, {
bodyText,

2
packages/emails/src/MailingListSubscription.tsx
View File

@@ -12,7 +12,7 @@
// OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
// PERFORMANCE OF THIS SOFTWARE.
import { Button, Hr, Link, Section, Text } from "@react-email/components";
import { Button, Hr, Link, Section, Text } from "react-email";
import * as React from "react";
import EmailLayout, {
bodyText,

2
packages/emails/src/MailingListUnsubscription.tsx
View File

@@ -12,7 +12,7 @@
// OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
// PERFORMANCE OF THIS SOFTWARE.
import { Hr, Text } from "@react-email/components";
import { Hr, Text } from "react-email";
import * as React from "react";
import EmailLayout, { bodyText, footerText } from "./components/EmailLayout";

2
packages/emails/src/MailingListUpdates.tsx
View File

@@ -12,7 +12,7 @@
// OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
// PERFORMANCE OF THIS SOFTWARE.
import { Button, Hr, Link, Section, Text } from "@react-email/components";
import { Button, Hr, Link, Section, Text } from "react-email";
import * as React from "react";
import EmailLayout, {
bodyText,

2
packages/emails/src/PasswordReset.tsx
View File

@@ -12,7 +12,7 @@
// OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
// PERFORMANCE OF THIS SOFTWARE.
import { Button, Section, Text } from '@react-email/components';
import { Button, Section, Text } from 'react-email';
import * as React from 'react';
import EmailLayout, { bodyText, button, buttonContainer, footerText } from './components/EmailLayout';

2
packages/emails/src/TrustCenterAccess.tsx
View File

@@ -12,7 +12,7 @@
// OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
// PERFORMANCE OF THIS SOFTWARE.
import { Button, Section, Text } from "@react-email/components";
import { Button, Section, Text } from "react-email";
import * as React from "react";
import EmailLayout, {
bodyText,

2
packages/emails/src/TrustCenterDocumentAccessRejected.tsx
View File

@@ -12,7 +12,7 @@
// OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
// PERFORMANCE OF THIS SOFTWARE.
import { Text } from '@react-email/components';
import { Text } from 'react-email';
import * as React from 'react';
import EmailLayout, { bodyText } from './components/EmailLayout';

2
packages/emails/src/components/EmailLayout.tsx
View File

@@ -20,7 +20,7 @@ import {
Link,
Section,
Text,
} from '@react-email/components';
} from 'react-email';
import * as React from 'react';
import { Logo } from './Logo';
import { ProboLogo } from './ProboLogo';

2
packages/emails/src/components/Logo.tsx
View File

@@ -12,7 +12,7 @@
// OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
// PERFORMANCE OF THIS SOFTWARE.
import { Img } from '@react-email/components';
import { Img } from 'react-email';
import * as React from 'react';
export function Logo() {

2
packages/emails/src/components/ProboLogo.tsx
View File

@@ -12,7 +12,7 @@
// OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
// PERFORMANCE OF THIS SOFTWARE.
import { Img } from '@react-email/components';
import { Img } from 'react-email';
import * as React from 'react';
export function ProboLogo() {