import { i as sanitizeStyle, n as sanitizeHref, r as sanitizeImageSrc, t as sanitizeColor } from "./sanitize-O_3j1mNJ.js";

//#region src/renderers/html.ts
function escapeHtml(str) {
	return str.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
}
function resolveColumn(col) {
	return typeof col === "string" ? { header: col } : col;
}
function styleStr(styles) {
	const parts = [];
	for (const [k, v] of Object.entries(styles)) if (v != null && v !== "") {
		const prop = k.replace(/([A-Z])/g, "-$1").toLowerCase();
		parts.push(`${prop}:${typeof v === "number" ? `${v}px` : v}`);
	}
	return parts.length > 0 ? ` style="${parts.join(";")}"` : "";
}
function padStr(pad) {
	if (pad == null) return void 0;
	if (typeof pad === "number") return `${pad}px`;
	if (pad.length === 2) return `${pad[0]}px ${pad[1]}px`;
	return `${pad[0]}px ${pad[1]}px ${pad[2]}px ${pad[3]}px`;
}
function renderChild(child) {
	if (typeof child === "string") return escapeHtml(child);
	return renderNode(child);
}
function renderChildren(children) {
	return children.map(renderChild).join("");
}
function renderNode(node) {
	const p = node.props;
	switch (node.type) {
		case "document": return `<!DOCTYPE html><html lang="${p.language ?? "en"}"><head><meta charset="utf-8">${p.title ? `<title>${escapeHtml(p.title)}</title>` : ""}<meta name="viewport" content="width=device-width,initial-scale=1"></head><body>${renderChildren(node.children)}</body></html>`;
		case "page": {
			const margin = padStr(p.margin);
			return `<div${styleStr({
				maxWidth: "800px",
				margin: margin ?? "0 auto",
				padding: margin ?? "40px"
			})}>${renderChildren(node.children)}</div>`;
		}
		case "section": {
			const dir = p.direction ?? "column";
			return `<div${styleStr({
				display: dir === "row" ? "flex" : "block",
				flexDirection: dir === "row" ? "row" : void 0,
				gap: p.gap,
				padding: padStr(p.padding),
				background: sanitizeColor(p.background),
				borderRadius: p.borderRadius
			})}>${renderChildren(node.children)}</div>`;
		}
		case "row": return `<div${styleStr({
			display: "flex",
			gap: p.gap,
			alignItems: p.align
		})}>${renderChildren(node.children)}</div>`;
		case "column": return `<div${styleStr({
			flex: p.width ? void 0 : "1",
			width: p.width,
			textAlign: p.align
		})}>${renderChildren(node.children)}</div>`;
		case "heading": {
			const level = p.level ?? 1;
			const tag = `h${Math.min(Math.max(level, 1), 6)}`;
			return `<${tag}${styleStr({
				color: sanitizeColor(p.color),
				textAlign: p.align
			})}>${renderChildren(node.children)}</${tag}>`;
		}
		case "text": return `<p${styleStr({
			fontSize: p.size,
			color: sanitizeColor(p.color),
			fontWeight: p.bold ? "bold" : void 0,
			fontStyle: p.italic ? "italic" : void 0,
			textDecoration: p.underline ? "underline" : p.strikethrough ? "line-through" : void 0,
			textAlign: p.align,
			lineHeight: p.lineHeight
		})}>${renderChildren(node.children)}</p>`;
		case "link": return `<a href="${escapeHtml(sanitizeHref(p.href))}"${styleStr({ color: sanitizeColor(p.color) })}>${renderChildren(node.children)}</a>`;
		case "image": {
			const alignStyle = p.align === "center" ? "display:block;margin:0 auto" : p.align === "right" ? "display:block;margin-left:auto" : "";
			const img = `<img src="${escapeHtml(sanitizeImageSrc(p.src))}"${p.width ? ` width="${p.width}"` : ""}${p.height ? ` height="${p.height}"` : ""}${p.alt ? ` alt="${escapeHtml(p.alt)}"` : ""}${alignStyle ? ` style="${sanitizeStyle(alignStyle)}"` : ""} />`;
			if (p.caption) return `<figure${p.align === "center" ? " style=\"text-align:center\"" : ""}>${img}<figcaption>${escapeHtml(p.caption)}</figcaption></figure>`;
			return img;
		}
		case "table": {
			const columns = (p.columns ?? []).map(resolveColumn);
			const rows = p.rows ?? [];
			const hs = p.headerStyle;
			const striped = p.striped;
			const bordered = p.bordered;
			let html = `<table style="width:100%;${bordered ? "border:1px solid #ddd;border-collapse:collapse;" : "border-collapse:collapse;"}">`;
			if (p.caption) html += `<caption>${escapeHtml(p.caption)}</caption>`;
			html += "<thead><tr>";
			for (const col of columns) {
				const cellBorder = bordered ? "border:1px solid #ddd;" : "";
				const bgStyle = hs?.background ? `background:${sanitizeColor(hs.background)};` : "";
				const colorStyle = hs?.color ? `color:${sanitizeColor(hs.color)};` : "";
				const fontStyle = hs?.bold !== false ? "font-weight:bold;" : "";
				const alignStyle = col.align ? `text-align:${col.align};` : "";
				const widthStyle = col.width ? `width:${typeof col.width === "number" ? `${col.width}px` : col.width};` : "";
				html += `<th style="${cellBorder}${bgStyle}${colorStyle}${fontStyle}${alignStyle}${widthStyle}padding:8px">${escapeHtml(col.header)}</th>`;
			}
			html += "</tr></thead>";
			html += "<tbody>";
			for (let i = 0; i < rows.length; i++) {
				const rowBg = striped && i % 2 === 1 ? " style=\"background:#f9f9f9\"" : "";
				html += `<tr${rowBg}>`;
				for (let j = 0; j < columns.length; j++) {
					const cellBorder = bordered ? "border:1px solid #ddd;" : "";
					const col = columns[j];
					const alignStyle = col?.align ? `text-align:${col.align};` : "";
					html += `<td style="${cellBorder}${alignStyle}padding:8px">${escapeHtml(String(rows[i]?.[j] ?? ""))}</td>`;
				}
				html += "</tr>";
			}
			html += "</tbody></table>";
			return html;
		}
		case "list": {
			const tag = p.ordered ? "ol" : "ul";
			return `<${tag}>${renderChildren(node.children)}</${tag}>`;
		}
		case "list-item": return `<li>${renderChildren(node.children)}</li>`;
		case "code": return `<pre style="background:#f5f5f5;padding:12px;border-radius:4px;overflow-x:auto"><code>${escapeHtml(renderChildren(node.children))}</code></pre>`;
		case "divider": {
			const color = sanitizeColor(p.color ?? "#ddd");
			return `<hr style="border:none;border-top:${p.thickness ?? 1}px solid ${color};margin:16px 0" />`;
		}
		case "page-break": return "<div style=\"page-break-after:always;break-after:page\"></div>";
		case "spacer": return `<div style="height:${p.height}px"></div>`;
		case "button": {
			const bg = sanitizeColor(p.background ?? "#4f46e5");
			const color = sanitizeColor(p.color ?? "#fff");
			const radius = p.borderRadius ?? 4;
			const pad = padStr(p.padding ?? [12, 24]);
			return `<div style="text-align:${p.align ?? "left"}"><a href="${escapeHtml(sanitizeHref(p.href))}" style="display:inline-block;background:${bg};color:${color};padding:${pad};border-radius:${radius}px;text-decoration:none;font-weight:bold">${renderChildren(node.children)}</a></div>`;
		}
		case "quote": return `<blockquote style="margin:0;padding:12px 20px;border-left:4px solid ${sanitizeColor(p.borderColor ?? "#ddd")};color:#555">${renderChildren(node.children)}</blockquote>`;
		default: return renderChildren(node.children);
	}
}
const htmlRenderer = { async render(node, options) {
	let html = renderNode(node);
	if (options?.direction === "rtl") html = html.replace("<body>", "<body dir=\"rtl\" style=\"direction:rtl\">");
	return html;
} };

//#endregion
export { htmlRenderer };
//# sourceMappingURL=html-B5biprN2.js.map