@vuemailer/render 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 John Campion Jr
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,62 @@
+# @vuemailer/render
+
+Transform Vue components into HTML email templates. The SSR rendering engine
+behind [`vuemailer`](https://github.com/jcamp-code/vuemailer/tree/main/packages/components):
+it renders a Vue component with `createSSRApp` + `vue/server-renderer`, then
+post-processes the output for email — pretty-printing, plain-text conversion,
+and XHTML void-element self-closing — matching
+[react-email](https://github.com/resend/react-email)'s output.
+
+```bash
+pnpm add @vuemailer/render
+```
+
+## Usage
+
+```ts
+import { render } from '@vuemailer/render'
+import Email from './email.vue'
+
+// Production HTML (minified, self-closed void elements)
+const html = await render(Email, { name: 'Ada' })
+
+// Pretty-printed HTML
+const pretty = await render(Email, { name: 'Ada' }, { pretty: true })
+
+// Plain-text version
+const text = await render(Email, { name: 'Ada' }, { plainText: true })
+```
+
+## API
+
+```ts
+render(
+  component: Component,
+  props?: Record<string, unknown>,
+  options?: {
+    pretty?: boolean
+    plainText?: boolean
+    transform?: (html: string) => string | Promise<string>
+  },
+): Promise<string>
+```
+
+- **`pretty`** — format the HTML with a prettier-based pretty-printer.
+- **`plainText`** — return a plain-text rendering (via `html-to-text`) instead
+  of HTML.
+- **`transform`** — a post-processing hook applied to the final HTML (after
+  pretty-print and self-closing). Pipe the output through an external pipeline —
+  [Maizzle](https://maizzle.com), [`juice`](https://github.com/Automattic/juice)
+  CSS inlining, or your own transforms — without vuemailer depending on any of
+  them. Ignored for `plainText`.
+
+```ts
+import juice from 'juice'
+
+const html = await render(Email, props, { transform: (html) => juice(html) })
+```
+
+## License
+
+MIT. Derived from [react-email](https://github.com/resend/react-email) and
+[vue-email](https://github.com/vue-email/vue-email) (both MIT).

package/dist/browser/index.cjs

@@ -0,0 +1,166 @@
+'use strict';
+
+var htmlToText = require('html-to-text');
+var vue = require('vue');
+var serverRenderer = require('vue/server-renderer');
+var html = require('prettier/plugins/html');
+var standalone = require('prettier/standalone');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var html__namespace = /*#__PURE__*/_interopNamespace(html);
+
+// src/shared/render.ts
+
+// src/shared/plain-text-selectors.ts
+var plainTextSelectors = [
+  { selector: "img", format: "skip" },
+  { selector: "[data-skip-in-text=true]", format: "skip" },
+  {
+    selector: "a",
+    options: { linkBrackets: false, hideLinkHrefIfSameAsText: true }
+  }
+];
+
+// src/shared/utils/cleanup.ts
+function cleanup(str) {
+  if (!str || typeof str !== "string") return str;
+  return str.replace(/ data-v-inspector="[^"]*"/g, "").replace(/<!---->/g, "").replace(/<!--\[-->/g, "").replace(/<!--\]-->/g, "").replace(/<!--teleport (?:start|end)[^>]*-->/g, "").replace(/<template>/g, "").replace(/<template[^>]*>/g, "").replace(/<\/template>/g, "").replace(/<vuemailer-clean-component>/g, "").replace(/<vuemailer-clean-component[^>]*>/g, "").replace(/<\/vuemailer-clean-component>/g, "");
+}
+function getHtmlNode(path) {
+  const topNode = path.node;
+  if (topNode) {
+    return topNode;
+  }
+  return path.stack?.[path.stack.length - 1];
+}
+function recursivelyMapDoc(doc, callback) {
+  if (Array.isArray(doc)) {
+    return doc.map((innerDoc) => recursivelyMapDoc(innerDoc, callback));
+  }
+  if (typeof doc === "object") {
+    if (doc.type === "line") {
+      return callback(doc.soft ? "" : " ");
+    }
+    if (doc.type === "group") {
+      return {
+        ...doc,
+        contents: recursivelyMapDoc(doc.contents, callback),
+        expandedStates: recursivelyMapDoc(doc.expandedStates, callback)
+      };
+    }
+    if ("contents" in doc) {
+      return {
+        ...doc,
+        contents: recursivelyMapDoc(doc.contents, callback)
+      };
+    }
+    if ("parts" in doc) {
+      return {
+        ...doc,
+        parts: recursivelyMapDoc(doc.parts, callback)
+      };
+    }
+    if (doc.type === "if-break") {
+      return {
+        ...doc,
+        breakContents: recursivelyMapDoc(doc.breakContents, callback),
+        flatContents: recursivelyMapDoc(doc.flatContents, callback)
+      };
+    }
+    const nextDoc = { ...doc };
+    for (const [key, value] of Object.entries(nextDoc)) {
+      if (value && typeof value === "object") {
+        nextDoc[key] = recursivelyMapDoc(value, callback);
+      }
+    }
+    return nextDoc;
+  }
+  return callback(doc);
+}
+var modifiedHtml = { ...html__namespace };
+if (modifiedHtml.printers) {
+  const htmlPrinter = modifiedHtml.printers.html;
+  const previousPrint = htmlPrinter.print;
+  htmlPrinter.print = (path, options, print, args) => {
+    const node = getHtmlNode(path);
+    const rawPrintingResult = previousPrint(path, options, print, args);
+    if (node?.type === "ieConditionalComment" || node?.kind === "ieConditionalComment") {
+      const printingResult = recursivelyMapDoc(rawPrintingResult, (doc) => {
+        if (typeof doc === "object" && doc.type === "line") {
+          return doc.soft ? "" : " ";
+        }
+        return doc;
+      });
+      return printingResult;
+    }
+    return rawPrintingResult;
+  };
+}
+var defaults = {
+  endOfLine: "lf",
+  tabWidth: 2,
+  plugins: [modifiedHtml],
+  bracketSameLine: true,
+  parser: "html"
+};
+var pretty = (str, options = {}) => {
+  return standalone.format(str.replaceAll("\0", ""), {
+    ...defaults,
+    ...options
+  });
+};
+
+// src/shared/utils/self-close-void-elements.ts
+var VOID_ELEMENTS = "area|base|br|col|embed|hr|img|input|link|meta|param|source|track|wbr";
+var voidElementRegex = new RegExp(
+  `<(${VOID_ELEMENTS})\\b((?:"[^"]*"|'[^']*'|[^>])*?)\\s*/?>`,
+  "gi"
+);
+function selfCloseVoidElements(html2) {
+  return html2.replace(
+    voidElementRegex,
+    (_match, tag, attrs) => `<${tag}${attrs} />`
+  );
+}
+
+// src/shared/render.ts
+var doctype = '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">';
+async function render(component, props, options) {
+  const app = vue.createSSRApp(component, props ?? {});
+  const markup = await serverRenderer.renderToString(app);
+  if (options?.plainText) {
+    return htmlToText.convert(markup, {
+      wordwrap: false,
+      selectors: plainTextSelectors,
+      ...options.htmlToTextOptions
+    });
+  }
+  let document = `${doctype}${cleanup(markup)}`;
+  if (options?.pretty) {
+    document = await pretty(document);
+  }
+  const html2 = selfCloseVoidElements(document).replace(/ (?:class|style)=""/g, "");
+  return options?.transform ? options.transform(html2) : html2;
+}
+
+exports.cleanup = cleanup;
+exports.plainTextSelectors = plainTextSelectors;
+exports.pretty = pretty;
+exports.render = render;

package/dist/browser/index.d.cts

@@ -0,0 +1,60 @@
+import { VNodeProps, AllowedComponentProps, Component } from 'vue';
+import { HtmlToTextOptions, SelectorDefinition } from 'html-to-text';
+import { Options as Options$1 } from 'prettier';
+
+interface Options {
+    /**
+     * Pretty-print the rendered HTML using prettier.
+     * Ignored when `plainText` is `true`.
+     */
+    pretty?: boolean;
+    /**
+     * Render the email as plain text instead of HTML.
+     */
+    plainText?: boolean;
+    /**
+     * Options forwarded to the `html-to-text` library used for plain-text
+     * conversion. Only relevant when `plainText` is `true`.
+     *
+     * @see https://github.com/html-to-text/node-html-to-text
+     */
+    htmlToTextOptions?: HtmlToTextOptions;
+    /**
+     * A post-processing hook applied to the final HTML output, after
+     * pretty-printing and void-element self-closing. Use it to pipe the rendered
+     * email through an external transformation pipeline — e.g. Maizzle, `juice`
+     * CSS inlining, or your own transforms — without vuemailer taking a
+     * dependency on any of them.
+     *
+     * Receives the rendered HTML and returns the transformed HTML (sync or async).
+     * Ignored when `plainText` is `true`.
+     *
+     * @example
+     * render(Email, props, { transform: (html) => juice(html) })
+     */
+    transform?: (html: string) => string | Promise<string>;
+}
+
+type ExtractComponentProps<TComponent> = TComponent extends new () => {
+    $props: infer P;
+} ? Omit<P, keyof VNodeProps | keyof AllowedComponentProps> : never;
+/**
+ * Renders a Vue component into an HTML email string (or plain text).
+ *
+ * @param component  The Vue component to render.
+ * @param props      Props to pass to the component.
+ * @param options    Rendering options (`pretty`, `plainText`, ...).
+ */
+declare function render<T extends Component>(component: T, props?: ExtractComponentProps<T>, options?: Options): Promise<string>;
+
+declare const plainTextSelectors: SelectorDefinition[];
+
+declare const pretty: (str: string, options?: Options$1) => Promise<string>;
+
+/**
+ * Strips Vue SSR/dev artifacts and non-email-friendly wrappers from the
+ * rendered markup before it is handed back to the caller.
+ */
+declare function cleanup(str: string): string;
+
+export { type ExtractComponentProps, type Options, cleanup, plainTextSelectors, pretty, render };

package/dist/browser/index.d.ts

@@ -0,0 +1,60 @@
+import { VNodeProps, AllowedComponentProps, Component } from 'vue';
+import { HtmlToTextOptions, SelectorDefinition } from 'html-to-text';
+import { Options as Options$1 } from 'prettier';
+
+interface Options {
+    /**
+     * Pretty-print the rendered HTML using prettier.
+     * Ignored when `plainText` is `true`.
+     */
+    pretty?: boolean;
+    /**
+     * Render the email as plain text instead of HTML.
+     */
+    plainText?: boolean;
+    /**
+     * Options forwarded to the `html-to-text` library used for plain-text
+     * conversion. Only relevant when `plainText` is `true`.
+     *
+     * @see https://github.com/html-to-text/node-html-to-text
+     */
+    htmlToTextOptions?: HtmlToTextOptions;
+    /**
+     * A post-processing hook applied to the final HTML output, after
+     * pretty-printing and void-element self-closing. Use it to pipe the rendered
+     * email through an external transformation pipeline — e.g. Maizzle, `juice`
+     * CSS inlining, or your own transforms — without vuemailer taking a
+     * dependency on any of them.
+     *
+     * Receives the rendered HTML and returns the transformed HTML (sync or async).
+     * Ignored when `plainText` is `true`.
+     *
+     * @example
+     * render(Email, props, { transform: (html) => juice(html) })
+     */
+    transform?: (html: string) => string | Promise<string>;
+}
+
+type ExtractComponentProps<TComponent> = TComponent extends new () => {
+    $props: infer P;
+} ? Omit<P, keyof VNodeProps | keyof AllowedComponentProps> : never;
+/**
+ * Renders a Vue component into an HTML email string (or plain text).
+ *
+ * @param component  The Vue component to render.
+ * @param props      Props to pass to the component.
+ * @param options    Rendering options (`pretty`, `plainText`, ...).
+ */
+declare function render<T extends Component>(component: T, props?: ExtractComponentProps<T>, options?: Options): Promise<string>;
+
+declare const plainTextSelectors: SelectorDefinition[];
+
+declare const pretty: (str: string, options?: Options$1) => Promise<string>;
+
+/**
+ * Strips Vue SSR/dev artifacts and non-email-friendly wrappers from the
+ * rendered markup before it is handed back to the caller.
+ */
+declare function cleanup(str: string): string;
+
+export { type ExtractComponentProps, type Options, cleanup, plainTextSelectors, pretty, render };

package/dist/browser/index.js

@@ -0,0 +1 @@
+export { cleanup, plainTextSelectors, pretty, render } from '../chunk-Z2KO5WJS.js';

package/dist/chunk-Z2KO5WJS.js

@@ -0,0 +1,139 @@
+import * as html from 'prettier/plugins/html';
+import { format } from 'prettier/standalone';
+import { convert } from 'html-to-text';
+import { createSSRApp } from 'vue';
+import { renderToString } from 'vue/server-renderer';
+
+// src/shared/plain-text-selectors.ts
+var plainTextSelectors = [
+  { selector: "img", format: "skip" },
+  { selector: "[data-skip-in-text=true]", format: "skip" },
+  {
+    selector: "a",
+    options: { linkBrackets: false, hideLinkHrefIfSameAsText: true }
+  }
+];
+
+// src/shared/utils/cleanup.ts
+function cleanup(str) {
+  if (!str || typeof str !== "string") return str;
+  return str.replace(/ data-v-inspector="[^"]*"/g, "").replace(/<!---->/g, "").replace(/<!--\[-->/g, "").replace(/<!--\]-->/g, "").replace(/<!--teleport (?:start|end)[^>]*-->/g, "").replace(/<template>/g, "").replace(/<template[^>]*>/g, "").replace(/<\/template>/g, "").replace(/<vuemailer-clean-component>/g, "").replace(/<vuemailer-clean-component[^>]*>/g, "").replace(/<\/vuemailer-clean-component>/g, "");
+}
+function getHtmlNode(path) {
+  const topNode = path.node;
+  if (topNode) {
+    return topNode;
+  }
+  return path.stack?.[path.stack.length - 1];
+}
+function recursivelyMapDoc(doc, callback) {
+  if (Array.isArray(doc)) {
+    return doc.map((innerDoc) => recursivelyMapDoc(innerDoc, callback));
+  }
+  if (typeof doc === "object") {
+    if (doc.type === "line") {
+      return callback(doc.soft ? "" : " ");
+    }
+    if (doc.type === "group") {
+      return {
+        ...doc,
+        contents: recursivelyMapDoc(doc.contents, callback),
+        expandedStates: recursivelyMapDoc(doc.expandedStates, callback)
+      };
+    }
+    if ("contents" in doc) {
+      return {
+        ...doc,
+        contents: recursivelyMapDoc(doc.contents, callback)
+      };
+    }
+    if ("parts" in doc) {
+      return {
+        ...doc,
+        parts: recursivelyMapDoc(doc.parts, callback)
+      };
+    }
+    if (doc.type === "if-break") {
+      return {
+        ...doc,
+        breakContents: recursivelyMapDoc(doc.breakContents, callback),
+        flatContents: recursivelyMapDoc(doc.flatContents, callback)
+      };
+    }
+    const nextDoc = { ...doc };
+    for (const [key, value] of Object.entries(nextDoc)) {
+      if (value && typeof value === "object") {
+        nextDoc[key] = recursivelyMapDoc(value, callback);
+      }
+    }
+    return nextDoc;
+  }
+  return callback(doc);
+}
+var modifiedHtml = { ...html };
+if (modifiedHtml.printers) {
+  const htmlPrinter = modifiedHtml.printers.html;
+  const previousPrint = htmlPrinter.print;
+  htmlPrinter.print = (path, options, print, args) => {
+    const node = getHtmlNode(path);
+    const rawPrintingResult = previousPrint(path, options, print, args);
+    if (node?.type === "ieConditionalComment" || node?.kind === "ieConditionalComment") {
+      const printingResult = recursivelyMapDoc(rawPrintingResult, (doc) => {
+        if (typeof doc === "object" && doc.type === "line") {
+          return doc.soft ? "" : " ";
+        }
+        return doc;
+      });
+      return printingResult;
+    }
+    return rawPrintingResult;
+  };
+}
+var defaults = {
+  endOfLine: "lf",
+  tabWidth: 2,
+  plugins: [modifiedHtml],
+  bracketSameLine: true,
+  parser: "html"
+};
+var pretty = (str, options = {}) => {
+  return format(str.replaceAll("\0", ""), {
+    ...defaults,
+    ...options
+  });
+};
+
+// src/shared/utils/self-close-void-elements.ts
+var VOID_ELEMENTS = "area|base|br|col|embed|hr|img|input|link|meta|param|source|track|wbr";
+var voidElementRegex = new RegExp(
+  `<(${VOID_ELEMENTS})\\b((?:"[^"]*"|'[^']*'|[^>])*?)\\s*/?>`,
+  "gi"
+);
+function selfCloseVoidElements(html2) {
+  return html2.replace(
+    voidElementRegex,
+    (_match, tag, attrs) => `<${tag}${attrs} />`
+  );
+}
+
+// src/shared/render.ts
+var doctype = '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">';
+async function render(component, props, options) {
+  const app = createSSRApp(component, props ?? {});
+  const markup = await renderToString(app);
+  if (options?.plainText) {
+    return convert(markup, {
+      wordwrap: false,
+      selectors: plainTextSelectors,
+      ...options.htmlToTextOptions
+    });
+  }
+  let document = `${doctype}${cleanup(markup)}`;
+  if (options?.pretty) {
+    document = await pretty(document);
+  }
+  const html2 = selfCloseVoidElements(document).replace(/ (?:class|style)=""/g, "");
+  return options?.transform ? options.transform(html2) : html2;
+}
+
+export { cleanup, plainTextSelectors, pretty, render };

package/dist/node/index.cjs

@@ -0,0 +1,166 @@
+'use strict';
+
+var htmlToText = require('html-to-text');
+var vue = require('vue');
+var serverRenderer = require('vue/server-renderer');
+var html = require('prettier/plugins/html');
+var standalone = require('prettier/standalone');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var html__namespace = /*#__PURE__*/_interopNamespace(html);
+
+// src/shared/render.ts
+
+// src/shared/plain-text-selectors.ts
+var plainTextSelectors = [
+  { selector: "img", format: "skip" },
+  { selector: "[data-skip-in-text=true]", format: "skip" },
+  {
+    selector: "a",
+    options: { linkBrackets: false, hideLinkHrefIfSameAsText: true }
+  }
+];
+
+// src/shared/utils/cleanup.ts
+function cleanup(str) {
+  if (!str || typeof str !== "string") return str;
+  return str.replace(/ data-v-inspector="[^"]*"/g, "").replace(/<!---->/g, "").replace(/<!--\[-->/g, "").replace(/<!--\]-->/g, "").replace(/<!--teleport (?:start|end)[^>]*-->/g, "").replace(/<template>/g, "").replace(/<template[^>]*>/g, "").replace(/<\/template>/g, "").replace(/<vuemailer-clean-component>/g, "").replace(/<vuemailer-clean-component[^>]*>/g, "").replace(/<\/vuemailer-clean-component>/g, "");
+}
+function getHtmlNode(path) {
+  const topNode = path.node;
+  if (topNode) {
+    return topNode;
+  }
+  return path.stack?.[path.stack.length - 1];
+}
+function recursivelyMapDoc(doc, callback) {
+  if (Array.isArray(doc)) {
+    return doc.map((innerDoc) => recursivelyMapDoc(innerDoc, callback));
+  }
+  if (typeof doc === "object") {
+    if (doc.type === "line") {
+      return callback(doc.soft ? "" : " ");
+    }
+    if (doc.type === "group") {
+      return {
+        ...doc,
+        contents: recursivelyMapDoc(doc.contents, callback),
+        expandedStates: recursivelyMapDoc(doc.expandedStates, callback)
+      };
+    }
+    if ("contents" in doc) {
+      return {
+        ...doc,
+        contents: recursivelyMapDoc(doc.contents, callback)
+      };
+    }
+    if ("parts" in doc) {
+      return {
+        ...doc,
+        parts: recursivelyMapDoc(doc.parts, callback)
+      };
+    }
+    if (doc.type === "if-break") {
+      return {
+        ...doc,
+        breakContents: recursivelyMapDoc(doc.breakContents, callback),
+        flatContents: recursivelyMapDoc(doc.flatContents, callback)
+      };
+    }
+    const nextDoc = { ...doc };
+    for (const [key, value] of Object.entries(nextDoc)) {
+      if (value && typeof value === "object") {
+        nextDoc[key] = recursivelyMapDoc(value, callback);
+      }
+    }
+    return nextDoc;
+  }
+  return callback(doc);
+}
+var modifiedHtml = { ...html__namespace };
+if (modifiedHtml.printers) {
+  const htmlPrinter = modifiedHtml.printers.html;
+  const previousPrint = htmlPrinter.print;
+  htmlPrinter.print = (path, options, print, args) => {
+    const node = getHtmlNode(path);
+    const rawPrintingResult = previousPrint(path, options, print, args);
+    if (node?.type === "ieConditionalComment" || node?.kind === "ieConditionalComment") {
+      const printingResult = recursivelyMapDoc(rawPrintingResult, (doc) => {
+        if (typeof doc === "object" && doc.type === "line") {
+          return doc.soft ? "" : " ";
+        }
+        return doc;
+      });
+      return printingResult;
+    }
+    return rawPrintingResult;
+  };
+}
+var defaults = {
+  endOfLine: "lf",
+  tabWidth: 2,
+  plugins: [modifiedHtml],
+  bracketSameLine: true,
+  parser: "html"
+};
+var pretty = (str, options = {}) => {
+  return standalone.format(str.replaceAll("\0", ""), {
+    ...defaults,
+    ...options
+  });
+};
+
+// src/shared/utils/self-close-void-elements.ts
+var VOID_ELEMENTS = "area|base|br|col|embed|hr|img|input|link|meta|param|source|track|wbr";
+var voidElementRegex = new RegExp(
+  `<(${VOID_ELEMENTS})\\b((?:"[^"]*"|'[^']*'|[^>])*?)\\s*/?>`,
+  "gi"
+);
+function selfCloseVoidElements(html2) {
+  return html2.replace(
+    voidElementRegex,
+    (_match, tag, attrs) => `<${tag}${attrs} />`
+  );
+}
+
+// src/shared/render.ts
+var doctype = '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">';
+async function render(component, props, options) {
+  const app = vue.createSSRApp(component, props ?? {});
+  const markup = await serverRenderer.renderToString(app);
+  if (options?.plainText) {
+    return htmlToText.convert(markup, {
+      wordwrap: false,
+      selectors: plainTextSelectors,
+      ...options.htmlToTextOptions
+    });
+  }
+  let document = `${doctype}${cleanup(markup)}`;
+  if (options?.pretty) {
+    document = await pretty(document);
+  }
+  const html2 = selfCloseVoidElements(document).replace(/ (?:class|style)=""/g, "");
+  return options?.transform ? options.transform(html2) : html2;
+}
+
+exports.cleanup = cleanup;
+exports.plainTextSelectors = plainTextSelectors;
+exports.pretty = pretty;
+exports.render = render;

package/dist/node/index.d.cts

@@ -0,0 +1,4 @@
+export { ExtractComponentProps, Options, cleanup, plainTextSelectors, pretty, render } from '../browser/index.cjs';
+import 'vue';
+import 'html-to-text';
+import 'prettier';

package/dist/node/index.d.ts

@@ -0,0 +1,4 @@
+export { ExtractComponentProps, Options, cleanup, plainTextSelectors, pretty, render } from '../browser/index.js';
+import 'vue';
+import 'html-to-text';
+import 'prettier';

package/dist/node/index.js

@@ -0,0 +1 @@
+export { cleanup, plainTextSelectors, pretty, render } from '../chunk-Z2KO5WJS.js';

package/package.json

@@ -0,0 +1,80 @@
+{
+  "name": "@vuemailer/render",
+  "version": "1.0.0",
+  "description": "Transform Vue components into HTML email templates",
+  "keywords": [
+    "email",
+    "render",
+    "ssr",
+    "vue"
+  ],
+  "homepage": "https://github.com/jcamp-code/vuemailer/tree/main/packages/render#readme",
+  "bugs": "https://github.com/jcamp-code/vuemailer/issues",
+  "license": "MIT",
+  "author": "John Campion Jr",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/jcamp-code/vuemailer.git",
+    "directory": "packages/render"
+  },
+  "files": [
+    "dist/**"
+  ],
+  "type": "module",
+  "sideEffects": false,
+  "main": "./dist/node/index.cjs",
+  "module": "./dist/node/index.js",
+  "types": "./dist/node/index.d.ts",
+  "exports": {
+    ".": {
+      "node": {
+        "import": {
+          "types": "./dist/node/index.d.ts",
+          "default": "./dist/node/index.js"
+        },
+        "require": {
+          "types": "./dist/node/index.d.cts",
+          "default": "./dist/node/index.cjs"
+        }
+      },
+      "default": {
+        "import": {
+          "types": "./dist/browser/index.d.ts",
+          "default": "./dist/browser/index.js"
+        },
+        "require": {
+          "types": "./dist/browser/index.d.cts",
+          "default": "./dist/browser/index.cjs"
+        }
+      }
+    }
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "dependencies": {
+    "html-to-text": "^9.0.5",
+    "prettier": "^3.3.0"
+  },
+  "devDependencies": {
+    "@types/html-to-text": "^9.0.4",
+    "tsup": "^8.3.0",
+    "typescript": "^5.9.3",
+    "vitest": "^4.1.8",
+    "vue": "^3.5.0"
+  },
+  "peerDependencies": {
+    "vue": "^3.4.0"
+  },
+  "engines": {
+    "node": ">=18.0.0"
+  },
+  "scripts": {
+    "build": "tsup",
+    "dev": "tsup --watch",
+    "clean": "rm -rf dist",
+    "typecheck": "tsc --noEmit",
+    "test": "vitest run",
+    "test:watch": "vitest"
+  }
+}