@react-email/render 0.0.7 → 0.0.9-canary.0

package/dist/index.d.mts

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

package/dist/index.d.ts

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

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,10 +23,35 @@ 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 = {};
@@ -35,18 +65,65 @@ module.exports = __toCommonJS(src_exports);
 var ReactDomServer = __toESM(require("react-dom/server"));
 var import_html_to_text = require("html-to-text");
 var import_pretty = __toESM(require("pretty"));
-var render = (component, options) => {
+var readPipeableStream = (readableStream) => __async(void 0, null, function* () {
+  let buffer = "";
+  try {
+    for (var iter = __forAwait(readableStream), more, temp, error; more = !(temp = yield iter.next()).done; more = false) {
+      const chunk = temp.value;
+      const chunkText = new TextDecoder("utf-8").decode(chunk);
+      buffer += chunkText;
+    }
+  } catch (temp) {
+    error = [temp];
+  } finally {
+    try {
+      more && (temp = iter.return) && (yield temp.call(iter));
+    } finally {
+      if (error)
+        throw error[0];
+    }
+  }
+  return buffer;
+});
+var readReactDOMServerReadableStream = (readableStream) => __async(void 0, null, function* () {
+  const reader = readableStream.getReader();
+  const chunks = [];
+  while (true) {
+    const { value, done } = yield reader.read();
+    if (done) {
+      break;
+    }
+    chunks.push(value);
+  }
+  return chunks.map((chunk) => new TextDecoder("utf-8").decode(chunk)).join("");
+});
+var isPipeableStream = (stream) => "pipeTo" in stream;
+var readStream = (readableStream) => __async(void 0, null, function* () {
+  if (isPipeableStream(readableStream)) {
+    return readPipeableStream(readableStream);
+  } else if (typeof readableStream === "string") {
+    return readableStream;
+  }
+  return readReactDOMServerReadableStream(readableStream);
+});
+var render = (component, options) => __async(void 0, null, function* () {
+  const reactDOMServer = (yield import("react-dom/server")).default;
+  const renderToStream2 = (
+    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+    reactDOMServer.renderToReadableStream || reactDOMServer.renderToPipeableStream
+  );
   if (options == null ? void 0 : options.plainText) {
     return renderAsPlainText(component, options);
   }
   const doctype = '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">';
-  const markup = ReactDomServer.renderToStaticMarkup(component);
-  const document = `${doctype}${markup}`;
+  const readableStream = yield renderToStream2(component);
+  const html = yield readStream(readableStream);
+  const document = `${doctype}${html}`;
   if (options && options.pretty) {
     return (0, import_pretty.default)(document);
   }
   return document;
-};
+});
 var renderAsPlainText = (component, _options) => {
   return (0, import_html_to_text.convert)(ReactDomServer.renderToStaticMarkup(component), {
     selectors: [
@@ -56,27 +133,50 @@ var renderAsPlainText = (component, _options) => {
   });
 };
 
-// src/renderAsync.ts
+// src/render-async.ts
 var import_html_to_text2 = require("html-to-text");
 var import_pretty2 = __toESM(require("pretty"));
-var import_server = require("react-dom/server");
-async function renderToString(children) {
-  const stream = await (0, import_server.renderToReadableStream)(children);
-  const html = await readableStreamToString(
-    stream
-  );
-  return html.replace(/^<!DOCTYPE html>/, "").replace(/<!-- -->/g, "");
+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, "");
+  });
 }
-async function readableStreamToString(readableStream) {
-  let result = "";
-  const decoder = new TextDecoder();
-  for await (const chunk of readableStream) {
-    result += decoder.decode(chunk);
-  }
-  return result;
+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 = async (component, options) => {
-  const markup = typeof import_server.renderToStaticMarkup === "undefined" ? await renderToString(component) : (0, import_server.renderToStaticMarkup)(component);
+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: [
@@ -91,7 +191,7 @@ var renderAsync = async (component, options) => {
     return (0, import_pretty2.default)(document);
   }
   return document;
-};
+});
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   render,

package/dist/index.mjs

@@ -1,19 +1,93 @@
+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";
 import pretty from "pretty";
-var render = (component, options) => {
+var readPipeableStream = (readableStream) => __async(void 0, null, function* () {
+  let buffer = "";
+  try {
+    for (var iter = __forAwait(readableStream), more, temp, error; more = !(temp = yield iter.next()).done; more = false) {
+      const chunk = temp.value;
+      const chunkText = new TextDecoder("utf-8").decode(chunk);
+      buffer += chunkText;
+    }
+  } catch (temp) {
+    error = [temp];
+  } finally {
+    try {
+      more && (temp = iter.return) && (yield temp.call(iter));
+    } finally {
+      if (error)
+        throw error[0];
+    }
+  }
+  return buffer;
+});
+var readReactDOMServerReadableStream = (readableStream) => __async(void 0, null, function* () {
+  const reader = readableStream.getReader();
+  const chunks = [];
+  while (true) {
+    const { value, done } = yield reader.read();
+    if (done) {
+      break;
+    }
+    chunks.push(value);
+  }
+  return chunks.map((chunk) => new TextDecoder("utf-8").decode(chunk)).join("");
+});
+var isPipeableStream = (stream) => "pipeTo" in stream;
+var readStream = (readableStream) => __async(void 0, null, function* () {
+  if (isPipeableStream(readableStream)) {
+    return readPipeableStream(readableStream);
+  } else if (typeof readableStream === "string") {
+    return readableStream;
+  }
+  return readReactDOMServerReadableStream(readableStream);
+});
+var render = (component, options) => __async(void 0, null, function* () {
+  const reactDOMServer = (yield import("react-dom/server")).default;
+  const renderToStream2 = (
+    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+    reactDOMServer.renderToReadableStream || reactDOMServer.renderToPipeableStream
+  );
   if (options == null ? void 0 : options.plainText) {
     return renderAsPlainText(component, options);
   }
   const doctype = '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">';
-  const markup = ReactDomServer.renderToStaticMarkup(component);
-  const document = `${doctype}${markup}`;
+  const readableStream = yield renderToStream2(component);
+  const html = yield readStream(readableStream);
+  const document = `${doctype}${html}`;
   if (options && options.pretty) {
     return pretty(document);
   }
   return document;
-};
+});
 var renderAsPlainText = (component, _options) => {
   return convert(ReactDomServer.renderToStaticMarkup(component), {
     selectors: [
@@ -23,27 +97,50 @@ var renderAsPlainText = (component, _options) => {
   });
 };
 
-// src/renderAsync.ts
+// src/render-async.ts
 import { convert as convert2 } from "html-to-text";
 import pretty2 from "pretty";
-import { renderToReadableStream, renderToStaticMarkup as renderToStaticMarkup2 } from "react-dom/server";
-async function renderToString(children) {
-  const stream = await renderToReadableStream(children);
-  const html = await readableStreamToString(
-    stream
-  );
-  return html.replace(/^<!DOCTYPE html>/, "").replace(/<!-- -->/g, "");
+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, "");
+  });
 }
-async function readableStreamToString(readableStream) {
-  let result = "";
-  const decoder = new TextDecoder();
-  for await (const chunk of readableStream) {
-    result += decoder.decode(chunk);
-  }
-  return result;
+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 = async (component, options) => {
-  const markup = typeof renderToStaticMarkup2 === "undefined" ? await renderToString(component) : renderToStaticMarkup2(component);
+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: [
@@ -58,7 +155,7 @@ var renderAsync = async (component, options) => {
     return pretty2(document);
   }
   return document;
-};
+});
 export {
   render,
   renderAsync

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-email/render",
-  "version": "0.0.7",
+  "version": "0.0.9-canary.0",
   "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 --check \"**/*.{ts,tsx,md}\"",
-    "format": "prettier --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,28 +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": "29.5.0",
+    "@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",
-    "jest": "28.1.3",
-    "prettier": "2.8.4",
-    "ts-jest": "28.0.8",
-    "tsup": "6.2.3",
-    "typescript": "4.8.3"
+    "eslint-config-custom": "workspace:*",
+    "tsconfig": "workspace:*",
+    "typescript": "5.1.6"
   },
   "publishConfig": {
     "access": "public"