UNPKG

@faire/mjml-react

Version:

React component library to generate the HTML emails on the fly

117 lines (116 loc) 4.5 kB
"use strict"; var __rest = (this && this.__rest) || function (s, e) { var t = {}; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p]; if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]]; } return t; }; var __importDefault = (this && this.__importDefault) || function (mod) { return (mod && mod.__esModule) ? mod : { "default": mod }; }; Object.defineProperty(exports, "__esModule", { value: true }); exports.renderToJSON = void 0; const react_1 = __importDefault(require("react")); const server_1 = __importDefault(require("react-dom/server")); const react_reconciler_1 = __importDefault(require("react-reconciler")); const render_utils_1 = require("./render-utils"); const reconciler = (0, react_reconciler_1.default)({ supportsMutation: true, isPrimaryRenderer: true, createTextInstance(text /* rootContainerInstance, hostContext, internalInstanceHandle,*/) { return text; }, createInstance(type, props /* rootContainerInstance, hostContext */) { const { children, dangerouslySetInnerHTML } = props, rest = __rest(props, ["children", "dangerouslySetInnerHTML"]); const res = { tagName: type, attributes: rest, }; Object.keys(res.attributes).forEach((key) => { const attrKey = res.attributes[key]; if (attrKey === undefined) { delete res.attributes[key]; } if (typeof attrKey === "string") { res.attributes[key] = (0, render_utils_1.escapeTextForBrowser)(attrKey); } }); if (!type.startsWith("mj")) { return { type, props, children: [], isReact: true, }; } if (props.dangerouslySetInnerHTML && props.dangerouslySetInnerHTML.__html) { // using replace to prevent issue with $ sign in MJML // https://github.com/mjmlio/mjml2json#L145 res.content = props.dangerouslySetInnerHTML.__html.replace("$", "&#36;"); } return res; }, appendChildToContainer(container, child) { (0, render_utils_1.trimContent)(child); container.resultObj = child; }, appendInitialChild(parent, child) { if (child.isReact) { if (parent.isReact) { parent.children.push(child); } else { const reactElement = toReactElement(child); if (!parent.content) { parent.content = ""; } parent.content += server_1.default.renderToStaticMarkup(reactElement); } } else if (typeof child === "string") { if (!child) { return; } if (parent.isReact) { parent.children.push(child); } else { if (!parent.content) { parent.content = ""; } parent.content += (0, render_utils_1.escapeTextForBrowser)(child); } } else { if (!parent.children) { parent.children = []; } parent.children.push(child); } }, prepareForCommit: render_utils_1.noop, resetAfterCommit: render_utils_1.noop, clearContainer: render_utils_1.noop, appendChild: render_utils_1.noop, finalizeInitialChildren: render_utils_1.noop, getChildHostContext: render_utils_1.noop, getRootHostContext: render_utils_1.noop, shouldSetTextContent: render_utils_1.noop, }); function renderToJSON(whatToRender) { const container = reconciler.createContainer({}, false, false); reconciler.updateContainer(whatToRender, container, null, null); return container.containerInfo.resultObj; } exports.renderToJSON = renderToJSON; function toReactElement(element) { if (element.children.length === 0) { return react_1.default.createElement(element.type, element.props); } return react_1.default.createElement(element.type, element.props, element.children.map((child) => typeof child === "string" ? child : toReactElement(child))); }