@templatical/editor 0.8.4 → 0.8.5

package/dist/cdn/chunks/{renderer-IOmuuZjJ.js → renderer-CYYyu-Di.js}

@@ -1,11 +1,11 @@
 import { n as e } from "./rolldown-runtime-Dqa2HsxW.js";
-import { An as t, Cn as n, Dn as r, En as i, Fn as a, In as o, Mn as s, Nn as c, On as l, Pn as u, Tn as d, jn as f, kn as p, wn as m } from "./features-CUYy5kZQ.js";
+import { An as t, Cn as n, Dn as r, En as i, Fn as a, In as o, Mn as s, Nn as c, On as l, Pn as u, Tn as d, jn as f, kn as p, wn as m } from "./features-LiilsBqW.js";
 //#endregion
 //#region ../renderer/src/render-context.ts
 var h = `https://unpkg.com/@templatical/renderer@${{
 	name: "@templatical/renderer",
 	description: "Render Templatical email templates to MJML",
-	version: "0.8.4",
+	version: "0.8.5",
 	bugs: "https://github.com/templatical/sdk/issues",
 	dependencies: { "@templatical/types": "workspace:*" },
 	devDependencies: {
@@ -90,31 +90,65 @@ function S(e) {
 	return e === "" ? "" : x(e).replace(/[;{}\r\n]/g, "");
 }
 function C(e) {
-	if (e === "") return "";
-	let t = e.replace(/<span[^>]*\bdata-merge-tag="([^"]*)"[^>]*>.*?<\/span>/gs, "$1");
-	return t = t.replace(/<span[^>]*\bdata-logic-merge-tag="([^"]*)"[^>]*>.*?<\/span>/gs, "$1"), t;
+	return e === "" ? "" : w(e, (e) => T(e, "data-merge-tag") ?? T(e, "data-logic-merge-tag"));
+}
+function w(e, t) {
+	let n = "", r = 0;
+	for (; r < e.length;) {
+		let i = e.indexOf("<span", r);
+		if (i === -1) {
+			n += e.substring(r);
+			break;
+		}
+		let a = e[i + 5];
+		if (a !== ">" && a !== " " && a !== "	" && a !== "\n" && a !== "\r" && a !== "/") {
+			n += e.substring(r, i + 5), r = i + 5;
+			continue;
+		}
+		let o = e.indexOf(">", i + 5);
+		if (o === -1) {
+			n += e.substring(r);
+			break;
+		}
+		let s = e.indexOf("</span>", o + 1);
+		if (s === -1) {
+			n += e.substring(r);
+			break;
+		}
+		let c = t(e.substring(i + 5, o));
+		if (c === null) {
+			n += e.substring(r, i + 5), r = i + 5;
+			continue;
+		}
+		n += e.substring(r, i), n += c, r = s + 7;
+	}
+	return n;
+}
+function T(e, t) {
+	let n = RegExp(`(?:^|\\s)${t}="([^"<>]*)"`).exec(e);
+	return n ? n[1] : null;
 }
 //#endregion
 //#region ../renderer/src/padding.ts
-function w(e) {
+function E(e) {
 	return `${e.top}px ${e.right}px ${e.bottom}px ${e.left}px`;
 }
 //#endregion
 //#region ../renderer/src/utils.ts
-function T(e, t) {
+function D(e, t) {
 	return e ? ` ${t === "native" ? "background-color" : "container-background-color"}="${e}"` : "";
 }
 //#endregion
 //#region ../renderer/src/visibility.ts
-function E(e) {
+function O(e) {
 	let t = e.visibility;
 	return t ? !t.desktop && !t.tablet && !t.mobile : !1;
 }
-function D(e) {
-	let t = O(e);
+function k(e) {
+	let t = A(e);
 	return t === "" ? "" : ` css-class="${t}"`;
 }
-function O(e) {
+function A(e) {
 	let t = e.visibility;
 	if (!t) return "";
 	let n = [];
@@ -123,8 +157,8 @@ function O(e) {
 //#endregion
 //#region ../renderer/src/renderers/title.ts
 function ee(e, t) {
-	if (E(e)) return "";
-	let n = w(e.styles.padding), r = T(e.styles.backgroundColor, "container"), i = k(C(e.content)), a = o[e.level] ?? o[2], s = x(e.color), c = e.textAlign, l = te(e.fontFamily, t), u = D(e), d = `h${o[e.level] ? e.level : 2}`;
+	if (O(e)) return "";
+	let n = E(e.styles.padding), r = D(e.styles.backgroundColor, "container"), i = te(C(e.content)), a = o[e.level] ?? o[2], s = x(e.color), c = e.textAlign, l = ne(e.fontFamily, t), u = k(e), d = `h${o[e.level] ? e.level : 2}`;
 	return `<mj-text
   font-size="${a}px"
   color="${s}"
@@ -133,28 +167,28 @@ function ee(e, t) {
   padding="${n}"${r}${l}${u}
 ><${d} style="margin:0;font-size:inherit;color:inherit;line-height:inherit">${i}</${d}></mj-text>`;
 }
-function k(e) {
+function te(e) {
 	let t = e.match(/^\s*<p\b[^>]*>([\s\S]*)<\/p>\s*$/);
 	return !t || /<\/p>\s*<p\b/i.test(t[1]) ? e : t[1];
 }
-function te(e, t) {
+function ne(e, t) {
 	return e ? ` font-family="${t.resolveFontFamily(e)}"` : "";
 }
 //#endregion
 //#region ../renderer/src/renderers/paragraph.ts
-function ne(e, t) {
-	if (E(e) || e.content.replace(/<\/?p[^>]*>/gi, "").trim() === "") return "";
-	let n = w(e.styles.padding), r = T(e.styles.backgroundColor, "container"), i = C(e.content);
+function re(e, t) {
+	if (O(e) || e.content.replace(/<\/?p\b[^<>]*>/gi, "").trim() === "") return "";
+	let n = E(e.styles.padding), r = D(e.styles.backgroundColor, "container"), i = C(e.content);
 	return `<mj-text
   line-height="1.5"
-  padding="${n}"${r}${D(e)}
+  padding="${n}"${r}${k(e)}
 >${i}</mj-text>`;
 }
 //#endregion
 //#region ../renderer/src/renderers/image.ts
-function re(e, t) {
-	if (E(e) || e.src === "") return "";
-	let n = w(e.styles.padding), r = T(e.styles.backgroundColor, "container"), i = e.width === "full" ? t.containerWidth + "px" : e.width + "px", a = D(e), o = "";
+function j(e, t) {
+	if (O(e) || e.src === "") return "";
+	let n = E(e.styles.padding), r = D(e.styles.backgroundColor, "container"), i = e.width === "full" ? t.containerWidth + "px" : e.width + "px", a = k(e), o = "";
 	e.linkUrl && (o = ` href="${x(e.linkUrl)}"`, e.linkOpenInNewTab && (o += " target=\"_blank\" rel=\"noopener\""));
 	let s = x(e.src), c = e.decorative === !0;
 	return `<mj-image
@@ -167,9 +201,9 @@ function re(e, t) {
 }
 //#endregion
 //#region ../renderer/src/renderers/button.ts
-function A(e, t) {
-	if (E(e)) return "";
-	let n = w(e.styles.padding), r = T(e.styles.backgroundColor, "container"), i = w(e.buttonPadding), a = e.url === "" ? "" : x(e.url), o = a === "" ? "" : ` href="${a}"`, s = x(e.backgroundColor), c = x(e.textColor), l = e.fontSize, u = e.borderRadius, d = b(e.text);
+function M(e, t) {
+	if (O(e)) return "";
+	let n = E(e.styles.padding), r = D(e.styles.backgroundColor, "container"), i = E(e.buttonPadding), a = e.url === "" ? "" : x(e.url), o = a === "" ? "" : ` href="${a}"`, s = x(e.backgroundColor), c = x(e.textColor), l = e.fontSize, u = e.borderRadius, d = b(e.text);
 	return `<mj-button${o}${e.openInNewTab ? " target=\"_blank\" rel=\"noopener\"" : ""}
   background-color="${s}"
   color="${c}"
@@ -177,46 +211,46 @@ function A(e, t) {
   font-weight="bold"
   border-radius="${u}px"
   inner-padding="${i}"
-  padding="${n}"${r}${j(e.fontFamily, t)}${D(e)}
+  padding="${n}"${r}${N(e.fontFamily, t)}${k(e)}
 >${d}</mj-button>`;
 }
-function j(e, t) {
+function N(e, t) {
 	return e ? ` font-family="${t.resolveFontFamily(e)}"` : "";
 }
 //#endregion
 //#region ../renderer/src/renderers/divider.ts
-function M(e, t) {
-	if (E(e)) return "";
-	let n = w(e.styles.padding), r = e.styles.backgroundColor ? ` container-background-color="${x(e.styles.backgroundColor)}"` : "", i = e.width === "full" ? "100%" : e.width + "px";
+function P(e, t) {
+	if (O(e)) return "";
+	let n = E(e.styles.padding), r = e.styles.backgroundColor ? ` container-background-color="${x(e.styles.backgroundColor)}"` : "", i = e.width === "full" ? "100%" : e.width + "px";
 	return `<mj-divider
   border-width="${e.thickness}px"
   border-style="${e.lineStyle}"
   border-color="${x(e.color)}"
   width="${i}"
-  padding="${n}"${r}${D(e)}
+  padding="${n}"${r}${k(e)}
 />`;
 }
 //#endregion
 //#region ../renderer/src/renderers/spacer.ts
-function N(e, t) {
-	return E(e) ? "" : `<mj-spacer height="${e.height}px" padding="0"${e.styles.backgroundColor ? ` container-background-color="${x(e.styles.backgroundColor)}"` : ""}${D(e)} />`;
+function F(e, t) {
+	return O(e) ? "" : `<mj-spacer height="${e.height}px" padding="0"${e.styles.backgroundColor ? ` container-background-color="${x(e.styles.backgroundColor)}"` : ""}${k(e)} />`;
 }
 //#endregion
 //#region ../renderer/src/renderers/html.ts
-function P(e, t) {
-	if (E(e) || !t.allowHtmlBlocks) return "";
+function I(e, t) {
+	if (O(e) || !t.allowHtmlBlocks) return "";
 	let n = e.content;
-	return n === "" ? "" : `<mj-text${D(e)}>
+	return n === "" ? "" : `<mj-text${k(e)}>
 ${n}
 </mj-text>`;
 }
 //#endregion
 //#region ../renderer/src/renderers/social.ts
-function F(e, t) {
-	if (E(e)) return "";
+function L(e, t) {
+	if (O(e)) return "";
 	let n = e.icons;
 	if (n.length === 0) return "";
-	let r = w(e.styles.padding), i = e.styles.backgroundColor ? ` container-background-color="${x(e.styles.backgroundColor)}"` : "", a = D(e), o = e.align, s = e.iconSize, c = e.iconStyle, l = e.spacing, u;
+	let r = E(e.styles.padding), i = e.styles.backgroundColor ? ` container-background-color="${x(e.styles.backgroundColor)}"` : "", a = k(e), o = e.align, s = e.iconSize, c = e.iconStyle, l = e.spacing, u;
 	switch (s) {
 		case "small":
 			u = 24;
@@ -258,78 +292,78 @@ ${n.map((e, n) => {
 }
 //#endregion
 //#region ../renderer/src/renderers/menu.ts
-function I(e, t) {
-	if (E(e) || e.items.length === 0) return "";
-	let n = w(e.styles.padding), r = T(e.styles.backgroundColor, "container"), i = D(e), a = z(e.fontFamily, t), o = e.textAlign;
+function R(e, t) {
+	if (O(e) || e.items.length === 0) return "";
+	let n = E(e.styles.padding), r = D(e.styles.backgroundColor, "container"), i = k(e), a = V(e.fontFamily, t), o = e.textAlign;
 	return `<mj-text
   font-size="${e.fontSize}px"
   color="${x(e.color)}"
   align="${o}"
   line-height="1.5"
   padding="${n}"${r}${a}${i}
->${L(e)}</mj-text>`;
+>${z(e)}</mj-text>`;
 }
-function L(e) {
+function z(e) {
 	let t = e.items, n = b(e.separator), r = S(e.separatorColor), i = e.spacing, a = e.linkColor ?? e.color, o = [], s = t.length;
-	for (let e = 0; e < s; e++) o.push(R(t[e], a)), e < s - 1 && o.push(`<span style="color: ${r}; padding: 0 ${i}px;">${n}</span>`);
+	for (let e = 0; e < s; e++) o.push(B(t[e], a)), e < s - 1 && o.push(`<span style="color: ${r}; padding: 0 ${i}px;">${n}</span>`);
 	return o.join("");
 }
-function R(e, t) {
+function B(e, t) {
 	let n = b(e.text), r = x(e.url), i = S(e.color ?? t), a = e.openInNewTab ? " target=\"_blank\" rel=\"noopener\"" : "", o = [`color: ${i}`, "text-decoration: none"];
 	return e.bold && o.push("font-weight: bold"), e.underline && o.push("text-decoration: underline"), `<a href="${r}" style="${o.join("; ")}"${a}>${n}</a>`;
 }
-function z(e, t) {
+function V(e, t) {
 	return e ? ` font-family="${t.resolveFontFamily(e)}"` : "";
 }
 //#endregion
 //#region ../renderer/src/renderers/table.ts
-function B(e, t) {
-	if (E(e) || e.rows.length === 0) return "";
-	let n = w(e.styles.padding), r = T(e.styles.backgroundColor, "container"), i = D(e), a = W(e.fontFamily, t);
+function H(e, t) {
+	if (O(e) || e.rows.length === 0) return "";
+	let n = E(e.styles.padding), r = D(e.styles.backgroundColor, "container"), i = k(e), a = K(e.fontFamily, t);
 	return `<mj-text
   font-size="${e.fontSize}px"
   color="${x(e.color)}"
   align="${e.textAlign}"
   line-height="1.5"
   padding="${n}"${r}${a}${i}
->${V(e)}</mj-text>`;
+>${U(e)}</mj-text>`;
 }
-function V(e) {
+function U(e) {
 	let t = S(e.borderColor), n = e.borderWidth, r = "";
 	for (let i = 0; i < e.rows.length; i++) {
 		let a = e.rows[i];
-		r += H(a, e, e.hasHeaderRow && i === 0, t, n);
+		r += W(a, e, e.hasHeaderRow && i === 0, t, n);
 	}
 	return `<table style="width: 100%; border-collapse: collapse;">${r}</table>`;
 }
-function H(e, t, n, r, i) {
+function W(e, t, n, r, i) {
 	let a = "";
-	for (let o of e.cells) a += U(o, t, n, r, i);
+	for (let o of e.cells) a += G(o, t, n, r, i);
 	return `<tr>${a}</tr>`;
 }
-function U(e, t, n, r, i) {
+function G(e, t, n, r, i) {
 	let a = t.cellPadding, o = [`border: ${i}px solid ${r}`, `padding: ${a}px`];
 	n && (o.push("font-weight: bold"), t.headerBackgroundColor && o.push(`background-color: ${S(t.headerBackgroundColor)}`));
 	let s = o.join("; "), c = C(e.content), l = n ? "th" : "td";
 	return `<${l} style="${s}">${c}</${l}>`;
 }
-function W(e, t) {
+function K(e, t) {
 	return e ? ` font-family="${t.resolveFontFamily(e)}"` : "";
 }
 //#endregion
 //#region ../renderer/src/renderers/custom.ts
-function G(e, t) {
-	if (E(e)) return "";
+function ie(e, t) {
+	if (O(e)) return "";
 	let n = t.customBlockHtml.get(e.id) ?? e.renderedHtml;
 	if (!n || n === "") return "";
-	let r = D(e);
-	return `<mj-text${T(e.styles?.backgroundColor, "container")}${r}>
+	let r = k(e);
+	return `<mj-text${D(e.styles?.backgroundColor, "container")}${r}>
 ${n}
 </mj-text>`;
 }
 //#endregion
 //#region ../renderer/src/columns.ts
-function K(e) {
+function q(e) {
 	switch (e) {
 		case "2": return ["50%", "50%"];
 		case "3": return [
@@ -342,7 +376,7 @@ function K(e) {
 		default: return ["100%"];
 	}
 }
-function q(e, t) {
+function J(e, t) {
 	switch (e) {
 		case "2": return [t * .5, t * .5];
 		case "3": return [
@@ -357,11 +391,11 @@ function q(e, t) {
 }
 //#endregion
 //#region ../renderer/src/renderers/section.ts
-function J(e, n, r) {
-	if (E(e)) return "";
-	let i = e.columns, a = K(i), o = q(i, n.containerWidth), s = w(e.styles.padding), c = T(e.styles.backgroundColor, "native"), l = D(e), u = e.children, d = [];
+function Y(e, n, r) {
+	if (O(e)) return "";
+	let i = e.columns, a = q(i), o = J(i, n.containerWidth), s = E(e.styles.padding), c = D(e.styles.backgroundColor, "native"), l = k(e), u = e.children, d = [];
 	for (let e = 0; e < u.length; e++) {
-		let i = u[e], s = a[e] ?? "100%", c = Math.floor(o[e] ?? n.containerWidth), l = Y(i, n.allowHtmlBlocks).filter((e) => !t(e)), f = n.withContainerWidth(c), p = l.map((e) => r(e, f)).filter((e) => e !== "").join("\n");
+		let i = u[e], s = a[e] ?? "100%", c = Math.floor(o[e] ?? n.containerWidth), l = ae(i, n.allowHtmlBlocks).filter((e) => !t(e)), f = n.withContainerWidth(c), p = l.map((e) => r(e, f)).filter((e) => e !== "").join("\n");
 		d.push(`<mj-column width="${s}">
 ${p === "" ? "<mj-text>&nbsp;</mj-text>" : p}
 </mj-column>`);
@@ -370,12 +404,12 @@ ${p === "" ? "<mj-text>&nbsp;</mj-text>" : p}
 ${d.join("\n")}
 </mj-section>`;
 }
-function Y(e, t) {
+function ae(e, t) {
 	return t ? e : e.filter((e) => e.type !== "html");
 }
 //#endregion
 //#region ../renderer/src/renderers/video.ts
-function X(e, t) {
+function oe(e, t) {
 	if (t) return t;
 	if (!e) return null;
 	for (let t of [/(?:youtube\.com\/watch\?v=|youtu\.be\/|youtube\.com\/embed\/)([a-zA-Z0-9_-]{11})/, /youtube\.com\/shorts\/([a-zA-Z0-9_-]{11})/]) {
@@ -385,11 +419,11 @@ function X(e, t) {
 	let n = e.match(/vimeo\.com\/(?:video\/)?(\d+)/);
 	return n ? `https://vumbnail.com/${n[1]}.jpg` : null;
 }
-function ie(e, t) {
-	if (E(e)) return "";
-	let n = X(e.url, e.thumbnailUrl);
+function se(e, t) {
+	if (O(e)) return "";
+	let n = oe(e.url, e.thumbnailUrl);
 	if (!n) return "";
-	let r = w(e.styles.padding), i = T(e.styles.backgroundColor, "container"), a = e.width === "full" ? t.containerWidth + "px" : e.width + "px", o = D(e);
+	let r = E(e.styles.padding), i = D(e.styles.backgroundColor, "container"), a = e.width === "full" ? t.containerWidth + "px" : e.width + "px", o = k(e);
 	return `<mj-image
   src="${x(n)}"
   alt="${x(e.alt)}"
@@ -403,28 +437,28 @@ function ie(e, t) {
 }
 //#endregion
 //#region ../renderer/src/renderers/index.ts
-function Z(e, o) {
-	return t(e) ? J(e, o, Z) : u(e) ? ee(e, o) : p(e) ? ne(e, o) : r(e) ? re(e, o) : n(e) ? A(e, o) : d(e) ? M(e, o) : s(e) ? N(e, o) : i(e) ? P(e, o) : f(e) ? F(e, o) : l(e) ? I(e, o) : c(e) ? B(e, o) : a(e) ? ie(e, o) : m(e) ? G(e, o) : "";
+function X(e, o) {
+	return t(e) ? Y(e, o, X) : u(e) ? ee(e, o) : p(e) ? re(e, o) : r(e) ? j(e, o) : n(e) ? M(e, o) : d(e) ? P(e, o) : s(e) ? F(e, o) : i(e) ? I(e, o) : f(e) ? L(e, o) : l(e) ? R(e, o) : c(e) ? H(e, o) : a(e) ? se(e, o) : m(e) ? ie(e, o) : "";
 }
 //#endregion
 //#region ../renderer/src/index.ts
-var ae = /* @__PURE__ */ e({
+var ce = /* @__PURE__ */ e({
 	DEFAULT_SOCIAL_ICONS_BASE_URL: () => h,
 	RenderContext: () => _,
 	convertMergeTagsToValues: () => C,
 	escapeAttr: () => x,
 	escapeHtml: () => b,
-	getCssClassAttr: () => D,
-	getCssClasses: () => O,
-	getWidthPercentages: () => K,
-	getWidthPixels: () => q,
-	isHiddenOnAll: () => E,
-	renderBlock: () => Z,
-	renderToMjml: () => oe,
-	toPaddingString: () => w
+	getCssClassAttr: () => k,
+	getCssClasses: () => A,
+	getWidthPercentages: () => q,
+	getWidthPixels: () => J,
+	isHiddenOnAll: () => O,
+	renderBlock: () => X,
+	renderToMjml: () => Z,
+	toPaddingString: () => E
 });
-async function oe(e, t) {
-	let n = t?.customFonts ?? [], r = t?.defaultFallbackFont ?? "Arial, sans-serif", i = t?.allowHtmlBlocks ?? !0, a = le(t?.socialIconsBaseUrl ?? h), o = await pe(e, t?.renderCustomBlock), s = new _(e.settings.width, n, r, i, o, a), c = fe(e.blocks, i), l = s.resolveFontFamily(e.settings.fontFamily), u = e.settings.backgroundColor, d = c.map((e) => se(e, s)).filter((e) => e !== "").join("\n"), f = de(n), p = ue(e.settings.preheaderText);
+async function Z(e, t) {
+	let n = t?.customFonts ?? [], r = t?.defaultFallbackFont ?? "Arial, sans-serif", i = t?.allowHtmlBlocks ?? !0, a = de(t?.socialIconsBaseUrl ?? h), o = await he(e, t?.renderCustomBlock), s = new _(e.settings.width, n, r, i, o, a), c = me(e.blocks, i), l = s.resolveFontFamily(e.settings.fontFamily), u = e.settings.backgroundColor, d = c.map((e) => le(e, s)).filter((e) => e !== "").join("\n"), f = pe(n), p = fe(e.settings.preheaderText);
 	return `<mjml lang="${x(e.settings.locale)}">
   <mj-head>${p}
     <mj-attributes>
@@ -452,8 +486,8 @@ ${d}
   </mj-body>
 </mjml>`;
 }
-function se(e, n) {
-	return t(e) ? Q(e, Z(e, n)) : Q(e, ce(Z(e, n)));
+function le(e, n) {
+	return t(e) ? Q(e, X(e, n)) : Q(e, ue(X(e, n)));
 }
 function Q(e, t) {
 	if (t === "") return "";
@@ -462,28 +496,28 @@ function Q(e, t) {
 ` + t + `
 <mj-raw>${n.after}</mj-raw>` : t;
 }
-function ce(e) {
+function ue(e) {
 	return e === "" ? "" : `<mj-section>
   <mj-column>
 ${e}
   </mj-column>
 </mj-section>`;
 }
-function le(e) {
+function de(e) {
 	return e.endsWith("/") ? e.slice(0, -1) : e;
 }
-function ue(e) {
+function fe(e) {
 	if (!e) return "";
 	let t = e.trim();
 	return t === "" ? "" : `\n    <mj-preview>${b(t)}</mj-preview>`;
 }
-function de(e) {
+function pe(e) {
 	return e.length === 0 ? "" : e.map((e) => `\n    <mj-font name="${x(e.name)}" href="${x(e.url)}" />`).join("");
 }
-function fe(e, t) {
+function me(e, t) {
 	return t ? e : e.filter((e) => e.type !== "html");
 }
-async function pe(e, t) {
+async function he(e, t) {
 	let n = /* @__PURE__ */ new Map();
 	if (!t) return n;
 	let r = [];
@@ -502,6 +536,6 @@ function $(e, n) {
 	}
 }
 //#endregion
-export { ae as t };
+export { ce as t };
 
-//# sourceMappingURL=renderer-IOmuuZjJ.js.map
+//# sourceMappingURL=renderer-CYYyu-Di.js.map