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";
//#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",
	bugs: "https://github.com/templatical/sdk/issues",
	dependencies: { "@templatical/types": "workspace:*" },
	devDependencies: {
		"@resvg/resvg-js": "^2.6.2",
		mjml: "^5.2.2",
		tsup: "^8.5.1",
		typescript: "^6.0.3",
		vitest: "^4.1.7"
	},
	exports: { ".": {
		types: "./dist/index.d.ts",
		import: "./dist/index.js"
	} },
	files: ["dist", "assets"],
	homepage: "https://templatical.com",
	keywords: [
		"email",
		"email-template",
		"html-email",
		"mjml",
		"renderer",
		"templatical"
	],
	license: "MIT",
	module: "./dist/index.js",
	publishConfig: { access: "public" },
	repository: {
		type: "git",
		url: "git+https://github.com/templatical/sdk.git",
		directory: "packages/renderer"
	},
	scripts: {
		build: "tsup && node scripts/rasterize-social.mjs",
		test: "vitest run --config vitest.config.ts",
		typecheck: "tsc --noEmit"
	},
	type: "module",
	types: "./dist/index.d.ts"
}.version}/assets/social`, g = {
	arial: "Arial, sans-serif",
	helvetica: "Helvetica, sans-serif",
	georgia: "Georgia, serif",
	"times new roman": "'Times New Roman', serif",
	verdana: "Verdana, sans-serif",
	"trebuchet ms": "'Trebuchet MS', sans-serif",
	"courier new": "'Courier New', monospace",
	tahoma: "Tahoma, sans-serif"
}, _ = class e {
	containerWidth;
	customFonts;
	defaultFallbackFont;
	allowHtmlBlocks;
	customBlockHtml;
	socialIconsBaseUrl;
	constructor(e, t, n, r, i = /* @__PURE__ */ new Map(), a = h) {
		this.containerWidth = e, this.customFonts = t, this.defaultFallbackFont = n, this.allowHtmlBlocks = r, this.customBlockHtml = i, this.socialIconsBaseUrl = a;
	}
	withContainerWidth(t) {
		return new e(t, this.customFonts, this.defaultFallbackFont, this.allowHtmlBlocks, this.customBlockHtml, this.socialIconsBaseUrl);
	}
	resolveFontFamily(e) {
		for (let t of this.customFonts) if (t.name.toLowerCase() === e.toLowerCase()) {
			let e = t.fallback ?? this.defaultFallbackFont;
			return `'${t.name}', ${e}`;
		}
		return g[e.toLowerCase()] || e;
	}
}, v = {
	"&": "&amp;",
	"<": "&lt;",
	">": "&gt;",
	"\"": "&quot;",
	"'": "&#039;"
}, y = /[&<>"']/g;
function b(e) {
	return e === "" ? "" : e.replace(y, (e) => v[e] ?? e);
}
function x(e) {
	return e === "" ? "" : e.replace(y, (e) => v[e] ?? e);
}
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;
}
//#endregion
//#region ../renderer/src/padding.ts
function w(e) {
	return `${e.top}px ${e.right}px ${e.bottom}px ${e.left}px`;
}
//#endregion
//#region ../renderer/src/utils.ts
function T(e, t) {
	return e ? ` ${t === "native" ? "background-color" : "container-background-color"}="${e}"` : "";
}
//#endregion
//#region ../renderer/src/visibility.ts
function E(e) {
	let t = e.visibility;
	return t ? !t.desktop && !t.tablet && !t.mobile : !1;
}
function D(e) {
	let t = O(e);
	return t === "" ? "" : ` css-class="${t}"`;
}
function O(e) {
	let t = e.visibility;
	if (!t) return "";
	let n = [];
	return t.desktop || n.push("tpl-hide-desktop"), t.tablet || n.push("tpl-hide-tablet"), t.mobile || n.push("tpl-hide-mobile"), n.join(" ");
}
//#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}`;
	return `<mj-text
  font-size="${a}px"
  color="${s}"
  align="${c}"
  line-height="1.3"
  padding="${n}"${r}${l}${u}
><${d} style="margin:0;font-size:inherit;color:inherit;line-height:inherit">${i}</${d}></mj-text>`;
}
function k(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) {
	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);
	return `<mj-text
  line-height="1.5"
  padding="${n}"${r}${D(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 = "";
	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
  src="${s}"
  alt="${c ? "" : x(e.alt)}"
  width="${i}"
  align="${e.align}"
  padding="${n}"${r}${o}${a}${c ? " role=\"presentation\"" : ""}
/>`;
}
//#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);
	return `<mj-button${o}${e.openInNewTab ? " target=\"_blank\" rel=\"noopener\"" : ""}
  background-color="${s}"
  color="${c}"
  font-size="${l}px"
  font-weight="bold"
  border-radius="${u}px"
  inner-padding="${i}"
  padding="${n}"${r}${j(e.fontFamily, t)}${D(e)}
>${d}</mj-button>`;
}
function j(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";
	return `<mj-divider
  border-width="${e.thickness}px"
  border-style="${e.lineStyle}"
  border-color="${x(e.color)}"
  width="${i}"
  padding="${n}"${r}${D(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)} />`;
}
//#endregion
//#region ../renderer/src/renderers/html.ts
function P(e, t) {
	if (E(e) || !t.allowHtmlBlocks) return "";
	let n = e.content;
	return n === "" ? "" : `<mj-text${D(e)}>
${n}
</mj-text>`;
}
//#endregion
//#region ../renderer/src/renderers/social.ts
function F(e, t) {
	if (E(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;
	switch (s) {
		case "small":
			u = 24;
			break;
		case "large":
			u = 48;
			break;
		default:
			u = 32;
			break;
	}
	let d;
	switch (c) {
		case "circle":
			d = "50%";
			break;
		case "rounded":
			d = "8px";
			break;
		case "square":
			d = "0";
			break;
		default:
			d = "4px";
			break;
	}
	let f = n.length;
	return `<mj-social
  mode="horizontal"
  align="${o}"
  icon-padding="0"
  padding="${r}"${i}${a}
>
${n.map((e, n) => {
		let r = e.platform, i = x(e.url), a = `${t.socialIconsBaseUrl}/${c}/${r}.png`, o = n === f - 1 ? 0 : l;
		return `<mj-social-element src="${a}" href="${i}" icon-size="${u}px" padding="0 ${o}px 0 0" border-radius="${d}" background-color="transparent"></mj-social-element>`;
	}).join("\n")}
</mj-social>`;
}
//#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;
	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>`;
}
function L(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>`);
	return o.join("");
}
function R(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) {
	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);
	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>`;
}
function V(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);
	}
	return `<table style="width: 100%; border-collapse: collapse;">${r}</table>`;
}
function H(e, t, n, r, i) {
	let a = "";
	for (let o of e.cells) a += U(o, t, n, r, i);
	return `<tr>${a}</tr>`;
}
function U(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) {
	return e ? ` font-family="${t.resolveFontFamily(e)}"` : "";
}
//#endregion
//#region ../renderer/src/renderers/custom.ts
function G(e, t) {
	if (E(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}>
${n}
</mj-text>`;
}
//#endregion
//#region ../renderer/src/columns.ts
function K(e) {
	switch (e) {
		case "2": return ["50%", "50%"];
		case "3": return [
			"33.33%",
			"33.33%",
			"33.34%"
		];
		case "1-2": return ["33.33%", "66.67%"];
		case "2-1": return ["66.67%", "33.33%"];
		default: return ["100%"];
	}
}
function q(e, t) {
	switch (e) {
		case "2": return [t * .5, t * .5];
		case "3": return [
			t / 3,
			t / 3,
			t / 3
		];
		case "1-2": return [t / 3, t * 2 / 3];
		case "2-1": return [t * 2 / 3, t / 3];
		default: return [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 = [];
	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");
		d.push(`<mj-column width="${s}">
${p === "" ? "<mj-text>&nbsp;</mj-text>" : p}
</mj-column>`);
	}
	return `<mj-section${c} padding="${s}"${l}>
${d.join("\n")}
</mj-section>`;
}
function Y(e, t) {
	return t ? e : e.filter((e) => e.type !== "html");
}
//#endregion
//#region ../renderer/src/renderers/video.ts
function X(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})/]) {
		let n = e.match(t);
		if (n) return `https://img.youtube.com/vi/${n[1]}/maxresdefault.jpg`;
	}
	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);
	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);
	return `<mj-image
  src="${x(n)}"
  alt="${x(e.alt)}"
  width="${a}"
  align="${e.align}"
  padding="${r}"
  href="${x(e.url)}"
  target="_blank"
  rel="noopener"${i}${o}
/>`;
}
//#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) : "";
}
//#endregion
//#region ../renderer/src/index.ts
var ae = /* @__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
});
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);
	return `<mjml lang="${x(e.settings.locale)}">
  <mj-head>${p}
    <mj-attributes>
      <mj-all font-family="${l}" />
      <mj-text font-size="14px" />
      <mj-section padding="0" />
      <mj-column padding="0" />
      <mj-image fluid-on-mobile="true" />
    </mj-attributes>${f}
    <mj-style>
      a { color: inherit; text-decoration: none; }
      @media only screen and (max-width: 480px) {
        .tpl-hide-mobile { display: none !important; mso-hide: all !important; }
      }
      @media only screen and (min-width: 481px) and (max-width: 768px) {
        .tpl-hide-tablet { display: none !important; mso-hide: all !important; }
      }
      @media only screen and (min-width: 769px) {
        .tpl-hide-desktop { display: none !important; mso-hide: all !important; }
      }
    </mj-style>
  </mj-head>
  <mj-body width="${s.containerWidth}px" background-color="${u}">
${d}
  </mj-body>
</mjml>`;
}
function se(e, n) {
	return t(e) ? Q(e, Z(e, n)) : Q(e, ce(Z(e, n)));
}
function Q(e, t) {
	if (t === "") return "";
	let n = e.displayCondition;
	return n ? `<mj-raw>${n.before}</mj-raw>
` + t + `
<mj-raw>${n.after}</mj-raw>` : t;
}
function ce(e) {
	return e === "" ? "" : `<mj-section>
  <mj-column>
${e}
  </mj-column>
</mj-section>`;
}
function le(e) {
	return e.endsWith("/") ? e.slice(0, -1) : e;
}
function ue(e) {
	if (!e) return "";
	let t = e.trim();
	return t === "" ? "" : `\n    <mj-preview>${b(t)}</mj-preview>`;
}
function de(e) {
	return e.length === 0 ? "" : e.map((e) => `\n    <mj-font name="${x(e.name)}" href="${x(e.url)}" />`).join("");
}
function fe(e, t) {
	return t ? e : e.filter((e) => e.type !== "html");
}
async function pe(e, t) {
	let n = /* @__PURE__ */ new Map();
	if (!t) return n;
	let r = [];
	if ($(e.blocks, r), r.length === 0) return n;
	let i = await Promise.all(r.map((e) => t(e)));
	for (let e = 0; e < r.length; e++) n.set(r[e].id, i[e]);
	return n;
}
function $(e, n) {
	for (let r of e) {
		if (m(r)) {
			n.push(r);
			continue;
		}
		if (t(r)) for (let e of r.children) $(e, n);
	}
}
//#endregion
export { ae as t };

//# sourceMappingURL=renderer-IOmuuZjJ.js.map