@react-email/render 0.0.6 → 0.0.8

package/dist/index.d.mts

@@ -0,0 +1,12 @@
+interface Options {
+    pretty?: boolean;
+    plainText?: boolean;
+}
+declare const render: (component: React.ReactElement, options?: Options) => string;
+
+declare const renderAsync: (component: React.ReactElement, options?: {
+    pretty?: boolean;
+    plainText?: boolean;
+}) => Promise<string>;
+
+export { Options, render, renderAsync };

package/dist/index.d.ts

@@ -4,4 +4,9 @@ interface Options {
 }
 declare const render: (component: React.ReactElement, options?: Options) => string;
 
-export { Options, render };
+declare const renderAsync: (component: React.ReactElement, options?: {
+    pretty?: boolean;
+    plainText?: boolean;
+}) => Promise<string>;
+
+export { Options, render, renderAsync };

package/dist/index.js

@@ -5,6 +5,11 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __knownSymbol = (name, symbol) => {
+  if (symbol = Symbol[name])
+    return symbol;
+  throw Error("Symbol." + name + " is not defined");
+};
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
@@ -18,15 +23,41 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+var __forAwait = (obj, it, method) => (it = obj[__knownSymbol("asyncIterator")]) ? it.call(obj) : (obj = obj[__knownSymbol("iterator")](), it = {}, method = (key, fn) => (fn = obj[key]) && (it[key] = (arg) => new Promise((yes, no, done) => (arg = fn.call(obj, arg), done = arg.done, Promise.resolve(arg.value).then((value) => yes({ value, done }), no)))), method("next"), method("return"), it);
 
 // src/index.ts
 var src_exports = {};
 __export(src_exports, {
-  render: () => render
+  render: () => render,
+  renderAsync: () => renderAsync
 });
 module.exports = __toCommonJS(src_exports);
 
@@ -54,7 +85,68 @@ var renderAsPlainText = (component, _options) => {
     ]
   });
 };
+
+// src/render-async.ts
+var import_html_to_text2 = require("html-to-text");
+var import_pretty2 = __toESM(require("pretty"));
+var import_server = __toESM(require("react-dom/server"));
+var { renderToStaticMarkup: renderToStaticMarkup2 } = import_server.default;
+var renderToStream = (
+  // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+  import_server.default.renderToReadableStream || import_server.default.renderToPipeableStream
+);
+function renderToString(children) {
+  return __async(this, null, function* () {
+    const stream = yield renderToStream(children);
+    const html = yield readableStreamToString(
+      // ReactDOMServerReadableStream behaves like ReadableStream
+      // in modern edge runtimes but the types are not compatible
+      stream
+    );
+    return html.replace(/^<!DOCTYPE html>/, "").replace(/<!-- -->/g, "");
+  });
+}
+function readableStreamToString(readableStream) {
+  return __async(this, null, function* () {
+    let result = "";
+    const decoder = new TextDecoder();
+    try {
+      for (var iter = __forAwait(readableStream), more, temp, error; more = !(temp = yield iter.next()).done; more = false) {
+        const chunk = temp.value;
+        result += decoder.decode(chunk);
+      }
+    } catch (temp) {
+      error = [temp];
+    } finally {
+      try {
+        more && (temp = iter.return) && (yield temp.call(iter));
+      } finally {
+        if (error)
+          throw error[0];
+      }
+    }
+    return result;
+  });
+}
+var renderAsync = (component, options) => __async(void 0, null, function* () {
+  const markup = typeof renderToStaticMarkup2 === "undefined" ? yield renderToString(component) : renderToStaticMarkup2(component);
+  if (options == null ? void 0 : options.plainText) {
+    return (0, import_html_to_text2.convert)(markup, {
+      selectors: [
+        { selector: "img", format: "skip" },
+        { selector: "#__react-email-preview", format: "skip" }
+      ]
+    });
+  }
+  const doctype = '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">';
+  const document = `${doctype}${markup}`;
+  if (options == null ? void 0 : options.pretty) {
+    return (0, import_pretty2.default)(document);
+  }
+  return document;
+});
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  render
+  render,
+  renderAsync
 });

package/dist/index.mjs

@@ -1,3 +1,30 @@
+var __knownSymbol = (name, symbol) => {
+  if (symbol = Symbol[name])
+    return symbol;
+  throw Error("Symbol." + name + " is not defined");
+};
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+var __forAwait = (obj, it, method) => (it = obj[__knownSymbol("asyncIterator")]) ? it.call(obj) : (obj = obj[__knownSymbol("iterator")](), it = {}, method = (key, fn) => (fn = obj[key]) && (it[key] = (arg) => new Promise((yes, no, done) => (arg = fn.call(obj, arg), done = arg.done, Promise.resolve(arg.value).then((value) => yes({ value, done }), no)))), method("next"), method("return"), it);
+
 // src/render.ts
 import * as ReactDomServer from "react-dom/server";
 import { convert } from "html-to-text";
@@ -22,6 +49,67 @@ var renderAsPlainText = (component, _options) => {
     ]
   });
 };
+
+// src/render-async.ts
+import { convert as convert2 } from "html-to-text";
+import pretty2 from "pretty";
+import react from "react-dom/server";
+var { renderToStaticMarkup: renderToStaticMarkup2 } = react;
+var renderToStream = (
+  // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+  react.renderToReadableStream || react.renderToPipeableStream
+);
+function renderToString(children) {
+  return __async(this, null, function* () {
+    const stream = yield renderToStream(children);
+    const html = yield readableStreamToString(
+      // ReactDOMServerReadableStream behaves like ReadableStream
+      // in modern edge runtimes but the types are not compatible
+      stream
+    );
+    return html.replace(/^<!DOCTYPE html>/, "").replace(/<!-- -->/g, "");
+  });
+}
+function readableStreamToString(readableStream) {
+  return __async(this, null, function* () {
+    let result = "";
+    const decoder = new TextDecoder();
+    try {
+      for (var iter = __forAwait(readableStream), more, temp, error; more = !(temp = yield iter.next()).done; more = false) {
+        const chunk = temp.value;
+        result += decoder.decode(chunk);
+      }
+    } catch (temp) {
+      error = [temp];
+    } finally {
+      try {
+        more && (temp = iter.return) && (yield temp.call(iter));
+      } finally {
+        if (error)
+          throw error[0];
+      }
+    }
+    return result;
+  });
+}
+var renderAsync = (component, options) => __async(void 0, null, function* () {
+  const markup = typeof renderToStaticMarkup2 === "undefined" ? yield renderToString(component) : renderToStaticMarkup2(component);
+  if (options == null ? void 0 : options.plainText) {
+    return convert2(markup, {
+      selectors: [
+        { selector: "img", format: "skip" },
+        { selector: "#__react-email-preview", format: "skip" }
+      ]
+    });
+  }
+  const doctype = '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">';
+  const document = `${doctype}${markup}`;
+  if (options == null ? void 0 : options.pretty) {
+    return pretty2(document);
+  }
+  return document;
+});
 export {
-  render
+  render,
+  renderAsync
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-email/render",
-  "version": "0.0.6",
+  "version": "0.0.8",
   "description": "Transform React components into HTML email templates",
   "sideEffects": false,
   "main": "./dist/index.js",
@@ -9,16 +9,26 @@
   "files": [
     "dist/**"
   ],
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.mjs"
+      },
+      "require": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      }
+    }
+  },
   "license": "MIT",
   "scripts": {
     "build": "tsup src/index.ts --format esm,cjs --dts --external react",
-    "dev": "tsup src/index.ts --format esm,cjs --dts --external react --watch",
-    "lint": "eslint",
     "clean": "rm -rf dist",
-    "test": "jest",
-    "test:watch": "jest --watch",
-    "format:check": "prettier --ignore-path ./../../.prettierignore  --check \"**/*.{ts,tsx,md}\"",
-    "format": "prettier --ignore-path ./../../.prettierignore  --write \"**/*.{ts,tsx,md}\""
+    "dev": "tsup src/index.ts --format esm,cjs --dts --external react --watch",
+    "lint": "eslint .",
+    "test:watch": "vitest",
+    "test": "vitest run"
   },
   "repository": {
     "type": "git",
@@ -30,29 +40,21 @@
     "email"
   ],
   "engines": {
-    "node": ">=16.0.0"
+    "node": ">=18.0.0"
   },
   "dependencies": {
-    "html-to-text": "9.0.3",
+    "html-to-text": "9.0.5",
     "pretty": "2.0.0",
     "react": "18.2.0",
     "react-dom": "18.2.0"
   },
   "devDependencies": {
-    "@babel/preset-react": "7.18.6",
-    "@types/html-to-text": "9.0.0",
-    "@types/jest": "28.1.7",
+    "@babel/preset-react": "7.22.5",
+    "@types/html-to-text": "9.0.1",
     "@types/pretty": "2.0.1",
-    "@types/react": "18.0.20",
-    "@types/react-dom": "18.0.6",
-    "babel-jest": "28.1.3",
-    "eslint": "8.23.1",
-    "eslint-config-custom": "*",
-    "jest": "28.1.3",
-    "ts-jest": "28.0.8",
-    "tsconfig": "*",
-    "tsup": "6.2.3",
-    "typescript": "4.8.3"
+    "eslint-config-custom": "workspace:*",
+    "tsconfig": "workspace:*",
+    "typescript": "5.1.6"
   },
   "publishConfig": {
     "access": "public"

package/readme.md

@@ -32,8 +32,8 @@ npm install @react-email/render -E
 Convert React components into a HTML string.
 
 ```jsx
-import { MyTemplate } from '../components/MyTemplate';
-import { render } from '@react-email/render';
+import { MyTemplate } from "../components/MyTemplate";
+import { render } from "@react-email/render";
 
 const html = render(<MyTemplate firstName="Jim" />);
 ```