Merge branch 'canary' into feat/improved-preview-urls

Author: gabrielmfern

README.md

@@ -62,20 +62,23 @@ const Email = () => {
 
 A set of standard components to help you build amazing emails without having to deal with the mess of creating table-based layouts and maintaining archaic markup.
 
-- [Html](https://github.com/resend/react-email/tree/main/packages/html)
+- [Body](https://github.com/resend/react-email/tree/main/packages/body)
+- [Button](https://github.com/resend/react-email/tree/main/packages/button)
+- [CodeBlock](https://github.com/resend/react-email/tree/main/packages/code-block)
+- [CodeInline](https://github.com/resend/react-email/tree/main/packages/code-inline)
+- [Column](https://github.com/resend/react-email/tree/main/packages/column)
+- [Container](https://github.com/resend/react-email/tree/main/packages/container)
+- [Divider](https://github.com/resend/react-email/tree/main/packages/hr)
+- [Font](https://github.com/resend/react-email/tree/main/packages/font)
 - [Head](https://github.com/resend/react-email/tree/main/packages/head)
 - [Heading](https://github.com/resend/react-email/tree/main/packages/heading)
-- [Button](https://github.com/resend/react-email/tree/main/packages/button)
-- [Link](https://github.com/resend/react-email/tree/main/packages/link)
+- [Html](https://github.com/resend/react-email/tree/main/packages/html)
 - [Image](https://github.com/resend/react-email/tree/main/packages/img)
-- [Divider](https://github.com/resend/react-email/tree/main/packages/hr)
+- [Link](https://github.com/resend/react-email/tree/main/packages/link)
+- [Markdown](https://github.com/resend/react-email/tree/main/packages/markdown)
 - [Paragraph](https://github.com/resend/react-email/tree/main/packages/text)
-- [Container](https://github.com/resend/react-email/tree/main/packages/container)
 - [Preview](https://github.com/resend/react-email/tree/main/packages/preview)
-- [Body](https://github.com/resend/react-email/tree/main/packages/body)
-- [Column](https://github.com/resend/react-email/tree/main/packages/column)
 - [Section](https://github.com/resend/react-email/tree/main/packages/section)
-- [Font](https://github.com/resend/react-email/tree/main/packages/font)
 
 ## Integrations
 

apps/web/package.json

@@ -15,17 +15,17 @@
     "@supabase/supabase-js": "2.39.3",
     "@vercel/analytics": "1.0.1",
     "classnames": "2.3.2",
-    "next": "13.5.3",
+    "next": "13.5.6",
     "prism-react-renderer": "2.1.0",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "resend": "2.0.0"
   },
   "devDependencies": {
-    "@next/eslint-plugin-next": "13.5.3",
+    "@next/eslint-plugin-next": "13.5.6",
     "autoprefixer": "10.4.14",
     "eslint-config-custom": "workspace:*",
-    "postcss": "8.4.31",
+    "postcss": "8.4.35",
     "tailwindcss": "3.3.3",
     "tsconfig": "workspace:*",
     "typescript": "5.1.6"

examples/nodemailer/package.json

@@ -24,7 +24,7 @@
     "@react-email/button": "*",
     "@react-email/html": "*",
     "@react-email/render": "*",
-    "nodemailer": "6.8.0",
+    "nodemailer": "6.9.9",
     "react": "18.2.0"
   },
   "devDependencies": {

packages/body/package.json

@@ -34,8 +34,8 @@
     "react": "18.2.0"
   },
   "devDependencies": {
-    "@babel/core": "7.23.7",
-    "@babel/preset-react": "7.22.5",
+    "@babel/core": "7.23.9",
+    "@babel/preset-react": "7.23.3",
     "@react-email/render": "workspace:*",
     "eslint-config-custom": "workspace:*",
     "tsconfig": "workspace:*",

packages/button/package.json

@@ -46,7 +46,7 @@
     "react": "18.2.0"
   },
   "devDependencies": {
-    "@babel/preset-react": "7.22.5",
+    "@babel/preset-react": "7.23.3",
     "@react-email/render": "workspace:*",
     "eslint-config-custom": "workspace:*",
     "tsconfig": "workspace:*",

packages/button/src/button.tsx

@@ -1,7 +1,7 @@
 import * as React from "react";
 import { parsePadding, pxToPt } from "./utils";
 
-type ButtonProps = React.ComponentPropsWithoutRef<"a">;
+export type ButtonProps = React.ComponentPropsWithoutRef<"a">;
 
 export const Button: React.FC<Readonly<ButtonProps>> = ({
   children,

packages/code-block/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-email/code-block",
-  "version": "0.0.3-canary.0",
+  "version": "0.0.3-canary.1",
   "description": "Display code with a selected theme and regex highlighting using Prism.js",
   "sideEffects": false,
   "main": "./dist/index.js",
@@ -44,7 +44,7 @@
     "react": "18.2.0"
   },
   "devDependencies": {
-    "@babel/preset-react": "7.22.5",
+    "@babel/preset-react": "7.23.3",
     "@react-email/render": "workspace:*",
     "@types/prismjs": "1.26.3",
     "eslint-config-custom": "workspace:*",

packages/code-block/src/code-block.tsx

@@ -12,33 +12,57 @@ export type CodeBlockProps = Readonly<{
   code: string;
 }>;
 
+const stylesForToken = (token: Prism.Token, theme: Theme) => {
+  let styles = { ...theme[token.type] };
+
+  const aliases = Array.isArray(token.alias) ? token.alias : [token.alias];
+
+  for (const alias of aliases) {
+    styles = { ...styles, ...theme[alias] };
+  }
+
+  return styles;
+};
+
 const CodeBlockLine = ({
   token,
   theme,
+  inheritedStyles,
 }: {
   token: string | Prism.Token;
   theme: Theme;
+  inheritedStyles?: React.CSSProperties;
 }) => {
   if (token instanceof Prism.Token) {
+    const styleForToken = {
+      ...inheritedStyles,
+      ...stylesForToken(token, theme),
+    };
+
     if (token.content instanceof Prism.Token) {
       return (
-        <span style={theme[token.type]}>
+        <span style={styleForToken}>
           <CodeBlockLine theme={theme} token={token.content} />
         </span>
       );
     } else if (typeof token.content === "string") {
-      return <span style={theme[token.type]}>{token.content}</span>;
+      return <span style={styleForToken}>{token.content}</span>;
     }
     return (
       <>
         {token.content.map((subToken, i) => (
-          <CodeBlockLine key={i} theme={theme} token={subToken} />
+          <CodeBlockLine
+            inheritedStyles={styleForToken}
+            key={i}
+            theme={theme}
+            token={subToken}
+          />
         ))}
       </>
     );
   }
 
-  return <>{token}</>;
+  return <span style={inheritedStyles}>{token}</span>;
 };
 
 /**

packages/code-inline/package.json

@@ -37,7 +37,7 @@
     "react": "18.2.0"
   },
   "devDependencies": {
-    "@babel/preset-react": "7.22.5",
+    "@babel/preset-react": "7.23.3",
     "@react-email/render": "workspace:*",
     "eslint-config-custom": "workspace:*",
     "tsconfig": "workspace:*",

packages/column/package.json

@@ -46,7 +46,7 @@
     "react": "18.2.0"
   },
   "devDependencies": {
-    "@babel/preset-react": "7.22.5",
+    "@babel/preset-react": "7.23.3",
     "@react-email/render": "workspace:*",
     "eslint-config-custom": "workspace:*",
     "tsconfig": "workspace:*",

packages/components/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-email/components",
-  "version": "0.0.15-canary.0",
+  "version": "0.0.15-canary.1",
   "description": "A collection of all components React Email.",
   "sideEffects": false,
   "main": "./dist/index.js",
@@ -43,7 +43,7 @@
   "dependencies": {
     "@react-email/body": "0.0.7",
     "@react-email/button": "0.0.13",
-    "@react-email/code-block": "0.0.3-canary.0",
+    "@react-email/code-block": "0.0.3-canary.1",
     "@react-email/code-inline": "0.0.1",
     "@react-email/column": "0.0.9",
     "@react-email/container": "0.0.11",
@@ -54,6 +54,7 @@
     "@react-email/html": "0.0.7",
     "@react-email/img": "0.0.7",
     "@react-email/link": "0.0.7",
+    "@react-email/markdown": "0.0.8",
     "@react-email/preview": "0.0.8",
     "@react-email/render": "0.0.12",
     "@react-email/row": "0.0.7",
@@ -65,7 +66,7 @@
     "react": "18.2.0"
   },
   "devDependencies": {
-    "@babel/preset-react": "7.22.5",
+    "@babel/preset-react": "7.23.3",
     "eslint-config-custom": "workspace:*",
     "tsconfig": "workspace:*",
     "typescript": "5.1.6"

packages/components/src/index.ts

@@ -11,6 +11,7 @@ export * from "@react-email/hr";
 export * from "@react-email/html";
 export * from "@react-email/img";
 export * from "@react-email/link";
+export * from "@react-email/markdown";
 export * from "@react-email/preview";
 export * from "@react-email/render";
 export * from "@react-email/row";

packages/container/package.json

@@ -46,7 +46,7 @@
     "react": "18.2.0"
   },
   "devDependencies": {
-    "@babel/preset-react": "7.22.5",
+    "@babel/preset-react": "7.23.3",
     "@react-email/render": "workspace:*",
     "eslint-config-custom": "workspace:*",
     "tsconfig": "workspace:*",

packages/create-email/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-email",
-  "version": "0.0.22",
+  "version": "0.0.23-canary.1",
   "description": "The easiest way to get started with React Email",
   "main": "src/index.js",
   "type": "module",

packages/create-email/template/static/notion-logo.png renamed to packages/create-email/template/emails/static/notion-logo.png

@@ -1,17 +1,19 @@
 {
   "name": "emails",
-  "version": "0.0.18",
+  "version": "0.0.19-canary.1",
   "private": true,
-  "workspaces": [
-    ".react-email"
-  ],
   "scripts": {
     "build": "email build",
     "dev": "email dev",
     "export": "email export"
   },
   "dependencies": {
-    "@react-email/components": "0.0.14",
-    "react-email": "2.0.0"
+    "@react-email/components": "0.0.15-canary.1",
+    "react-email": "2.1.0-canary.1",
+    "react": "18.2.0"
+  },
+  "devDependencies": {
+    "@types/react": "18.2.33",
+    "@types/react-dom": "18.2.14"
   }
 }

packages/create-email/template/static/plaid-logo.png renamed to packages/create-email/template/emails/static/plaid-logo.png

@@ -34,7 +34,7 @@
     "react": "18.2.0"
   },
   "devDependencies": {
-    "@babel/preset-react": "7.22.5",
+    "@babel/preset-react": "7.23.3",
     "@react-email/render": "workspace:*",
     "eslint-config-custom": "workspace:*",
     "tsconfig": "workspace:*",

packages/create-email/template/static/plaid.png renamed to packages/create-email/template/emails/static/plaid.png

@@ -46,7 +46,7 @@
     "react": "18.2.0"
   },
   "devDependencies": {
-    "@babel/preset-react": "7.22.5",
+    "@babel/preset-react": "7.23.3",
     "@react-email/render": "workspace:*",
     "eslint-config-custom": "workspace:*",
     "tsconfig": "workspace:*",

packages/create-email/template/static/stripe-logo.png renamed to packages/create-email/template/emails/static/stripe-logo.png

@@ -49,7 +49,7 @@
     "react": "18.2.0"
   },
   "devDependencies": {
-    "@babel/preset-react": "7.22.5",
+    "@babel/preset-react": "7.23.3",
     "@react-email/render": "workspace:*",
     "eslint-config-custom": "workspace:*",
     "tsconfig": "workspace:*",

packages/create-email/template/static/vercel-arrow.png renamed to packages/create-email/template/emails/static/vercel-arrow.png

@@ -46,7 +46,7 @@
     "react": "18.2.0"
   },
   "devDependencies": {
-    "@babel/preset-react": "7.22.5",
+    "@babel/preset-react": "7.23.3",
     "@react-email/render": "workspace:*",
     "eslint-config-custom": "workspace:*",
     "tsconfig": "workspace:*",

packages/create-email/template/static/vercel-logo.png renamed to packages/create-email/template/emails/static/vercel-logo.png

@@ -46,7 +46,7 @@
     "react": "18.2.0"
   },
   "devDependencies": {
-    "@babel/preset-react": "7.22.5",
+    "@babel/preset-react": "7.23.3",
     "@react-email/render": "workspace:*",
     "eslint-config-custom": "workspace:*",
     "tsconfig": "workspace:*",

packages/create-email/template/static/vercel-team.png renamed to packages/create-email/template/emails/static/vercel-team.png

@@ -46,7 +46,7 @@
     "react": "18.2.0"
   },
   "devDependencies": {
-    "@babel/preset-react": "7.22.5",
+    "@babel/preset-react": "7.23.3",
     "@react-email/render": "workspace:*",
     "eslint-config-custom": "workspace:*",
     "tsconfig": "workspace:*",

packages/create-email/template/static/vercel-user.png renamed to packages/create-email/template/emails/static/vercel-user.png

@@ -46,7 +46,7 @@
     "react": "18.2.0"
   },
   "devDependencies": {
-    "@babel/preset-react": "7.22.5",
+    "@babel/preset-react": "7.23.3",
     "@react-email/render": "workspace:*",
     "eslint-config-custom": "workspace:*",
     "tsconfig": "workspace:*",

packages/create-email/template/package.json

@@ -50,7 +50,7 @@
     "react": "18.2.0"
   },
   "devDependencies": {
-    "@babel/preset-react": "7.22.5",
+    "@babel/preset-react": "7.23.3",
     "@react-email/render": "workspace:*",
     "eslint-config-custom": "workspace:*",
     "tsconfig": "workspace:*",

packages/font/package.json

@@ -46,7 +46,7 @@
     "react": "18.2.0"
   },
   "devDependencies": {
-    "@babel/preset-react": "7.22.5",
+    "@babel/preset-react": "7.23.3",
     "@react-email/render": "workspace:*",
     "eslint-config-custom": "workspace:*",
     "tsconfig": "workspace:*",

packages/head/package.json

@@ -1,13 +1,14 @@
 {
   "name": "react-email",
-  "version": "2.0.0",
+  "version": "2.1.0-canary.1",
   "description": "A live preview of your emails right in your browser.",
   "bin": {
     "email": "./cli/index.js"
   },
   "scripts": {
     "build": "tsup",
     "dev": "tsup --watch",
+    "test": "vitest run",
     "clean": "rm -rf dist",
     "lint": "eslint . && tsc"
   },
@@ -53,7 +54,7 @@
     "next": "14.1.0",
     "normalize-path": "3.0.0",
     "ora": "5.4.1",
-    "postcss": "8.4.32",
+    "postcss": "8.4.35",
     "prism-react-renderer": "2.1.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
@@ -71,7 +72,7 @@
   "devDependencies": {
     "@types/fs-extra": "11.0.1",
     "@types/mime-types": "2.1.4",
-    "@types/node": "20.10.4",
+    "@types/node": "18.0.0",
     "@types/normalize-path": "3.0.2",
     "@types/shelljs": "0.8.15",
     "@vercel/style-guide": "5.1.0",