import { A as e, Dt as t, H as n, M as r, Mt as i, Ot as a, Q as o, S as s, V as c, _ as l, b as u, c as d, g as f, h as p, it as m, j as h, m as g, n as _, t as v, w as y, y as b } from "./vue.runtime.esm-bundler-DpvJL-nX.js";
import { r as x } from "./timeouts-BSGxjuUF.js";
import { L as S, t as C, x as w } from "./useEditorCore-D0uZbPKG.js";
import { t as T } from "./_plugin-vue_export-helper-GRmvIR5A.js";
import { a as E, c as ee, i as te, n as ne, o as re, r as D, s as O, t as k } from "./styles-C-FrkTA9.js";
//#region src/Editor.vue?vue&type=script&setup=true&lang.ts
var A = ["data-tpl-theme"], j = {
	class: "tpl-header tpl:absolute tpl:top-0 tpl:right-0 tpl:left-0 tpl:z-50 tpl:grid tpl:h-14 tpl:grid-cols-[1fr_auto_1fr] tpl:items-center tpl:px-4 tpl:shadow-[var(--tpl-shadow-md)] tpl:border-b tpl:border-[var(--tpl-border)]",
	style: {
		"background-color": "color-mix(in srgb, var(--tpl-bg) 80%, transparent)",
		"backdrop-filter": "blur(12px)",
		"-webkit-backdrop-filter": "blur(12px)"
	}
}, M = { class: "tpl:flex tpl:items-center tpl:justify-center tpl:gap-10" }, N = { class: "tpl:sticky tpl:top-0 tpl:z-40 tpl:h-0" }, P = { class: "tpl:flex tpl:justify-center tpl:p-8" }, F = ["aria-label"], I = /* @__PURE__ */ T(/* @__PURE__ */ s({
	__name: "Editor",
	props: {
		config: {},
		translations: {},
		fontsManager: {}
	},
	setup(o, { expose: s }) {
		let _ = o, y = S({
			content: _.config.content,
			templateDefaults: _.config.templateDefaults
		}), x = C({
			editor: y,
			config: {
				uiTheme: _.config.uiTheme,
				theme: _.config.theme,
				blockDefaults: _.config.blockDefaults,
				customBlocks: _.config.customBlocks,
				mergeTags: _.config.mergeTags,
				displayConditions: _.config.displayConditions,
				onRequestMedia: _.config.onRequestMedia,
				onSave: _.config.onSave ? () => _.config.onSave(JSON.parse(JSON.stringify(y.state.content))) : void 0
			},
			translations: _.translations,
			fontsManager: _.fontsManager,
			autoSaveOptions: _.config.onChange ? { onChange: () => _.config.onChange(JSON.parse(JSON.stringify(y.state.content))) } : null
		});
		return e(async () => {
			await _.fontsManager.loadCustomFonts();
		}), h(() => {
			_.fontsManager.cleanupFontLinks(), x.destroy();
		}), s({
			getContent: () => y.content.value,
			setContent: (e) => y.setContent(e),
			setTheme: (e) => y.setUiTheme(e),
			renderCustomBlock: x.registry.renderCustomBlock
		}), (e, s) => (r(), l("div", {
			class: t(["tpl tpl:relative tpl:h-full tpl:overflow-hidden", { "tpl:dark": m(y).state.darkMode }]),
			"data-tpl-theme": m(x).resolvedTheme.value,
			style: a(m(x).themeStyles.value)
		}, [
			g("header", j, [
				s[5] ||= g("div", { class: "tpl:flex tpl:items-center tpl:gap-2.5" }, null, -1),
				g("div", M, [
					u(te, {
						viewport: m(y).state.viewport,
						onChange: m(y).setViewport
					}, null, 8, ["viewport", "onChange"]),
					u(ne, {
						"dark-mode": m(y).state.darkMode,
						onChange: m(y).setDarkMode
					}, null, 8, ["dark-mode", "onChange"]),
					u(D, {
						"preview-mode": m(y).state.previewMode,
						onChange: m(y).setPreviewMode
					}, null, 8, ["preview-mode", "onChange"])
				]),
				s[6] ||= g("div", { class: "tpl:flex tpl:min-w-[200px] tpl:items-center tpl:justify-end tpl:gap-3" }, null, -1)
			]),
			n(u(re, null, null, 512), [[d, !m(y).state.previewMode]]),
			g("div", {
				class: t(["tpl-body tpl:absolute tpl:bottom-0 tpl:overflow-auto tpl:bg-[var(--tpl-canvas-bg)]", [m(y).state.previewMode ? "tpl:left-0 tpl:right-0" : "tpl:left-12 tpl:right-[320px]", "tpl:top-14"]]),
				style: { transition: "all 300ms cubic-bezier(0.34, 1.56, 0.64, 1)" }
			}, [g("div", N, [u(v, { name: "tpl-restore-btn" }, {
				default: c(() => [m(x).conditionPreview.hasHiddenBlocks.value ? (r(), l("button", {
					key: 0,
					class: "tpl:absolute tpl:left-1/2 tpl:top-2 tpl:-translate-x-1/2 tpl:inline-flex tpl:items-center tpl:gap-1.5 tpl:rounded-full tpl:border tpl:px-3.5 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:whitespace-nowrap tpl:shadow-md tpl:hover:opacity-80 tpl:bg-[var(--tpl-warning-light)] tpl:text-[var(--tpl-warning)] tpl:border-[var(--tpl-warning)]",
					style: { "backdrop-filter": "blur(8px)" },
					onClick: s[0] ||= (e) => m(x).conditionPreview.reset()
				}, [u(m(ee), {
					size: 13,
					"stroke-width": 2
				}), b(" " + i(m(x).t.blockSettings.restoreHiddenBlocks), 1)])) : f("", !0)]),
				_: 1
			})]), g("div", P, [u(O, {
				viewport: m(y).state.viewport,
				content: m(y).content.value,
				"selected-block-id": m(y).state.selectedBlockId,
				"dark-mode": m(y).state.darkMode,
				"preview-mode": m(y).state.previewMode,
				onSelectBlock: m(y).selectBlock
			}, null, 8, [
				"viewport",
				"content",
				"selected-block-id",
				"dark-mode",
				"preview-mode",
				"onSelectBlock"
			])])], 2),
			o.config.branding === !1 ? f("", !0) : (r(), p(k, {
				key: 0,
				"position-class": [m(y).state.previewMode ? "tpl:left-0 tpl:right-0" : "tpl:left-12 tpl:right-[320px]"]
			}, null, 8, ["position-class"])),
			g("div", {
				class: "tpl-sr-only",
				role: "status",
				"aria-live": "polite",
				"aria-atomic": "true",
				"aria-label": m(x).t.landmarks.reorderAnnouncements
			}, i(m(x).keyboardReorder.announcement.value), 9, F),
			n(u(E, {
				"selected-block": m(y).selectedBlock.value,
				settings: m(y).content.value.settings,
				onUpdateBlock: s[1] ||= (e) => m(y).updateBlock(m(y).state.selectedBlockId, e),
				onDeleteBlock: s[2] ||= () => {
					m(y).state.selectedBlockId && m(x).blockActions.deleteBlock(m(y).state.selectedBlockId);
				},
				onDuplicateBlock: s[3] ||= () => {
					m(y).selectedBlock.value && m(x).blockActions.duplicateBlock(m(y).selectedBlock.value);
				},
				onUpdateSettings: s[4] ||= (e) => m(y).updateSettings(e)
			}, null, 8, ["selected-block", "settings"]), [[d, !m(y).state.previewMode]])
		], 14, A));
	}
}), [["__scopeId", "data-v-1bfc44e9"]]), L = /* @__PURE__ */ Object.assign({
	"./locales/de.ts": () => import("./de-DwLWZn6p.js"),
	"./locales/en.ts": () => import("./en-BrlGVpmd.js")
}), R = /* @__PURE__ */ Object.assign({
	"./locales/cloud/de.ts": () => import("./de-CbSb23fl.js"),
	"./locales/cloud/en.ts": () => import("./en-2fvenFu0.js")
});
function z(e) {
	return Object.keys(e).map((e) => e.match(/\/([^/]+)\.ts$/)?.[1]).filter((e) => !!e);
}
var B = z(L), V = z(R);
function H(e) {
	return e.split("-")[0].toLowerCase();
}
function U(e, t) {
	let n = H(e);
	return t.includes(n) ? n : "en";
}
async function W(e) {
	let t = L[`./locales/${U(e, B)}.ts`];
	return (await t()).default;
}
async function G(e) {
	let t = R[`./locales/cloud/${U(e, V)}.ts`];
	return (await t()).default;
}
//#endregion
//#region src/utils/toMjml.ts
async function K(e) {
	let t;
	try {
		t = await import("@templatical/renderer");
	} catch {
		throw Error("[Templatical] toMjml() requires the @templatical/renderer package. Please install it.");
	}
	return t.renderToMjml(e.getContent(), { renderCustomBlock: e.renderCustomBlock });
}
//#endregion
//#region src/index.ts
var q = null, J = o(null);
async function Y(e) {
	let t = typeof e.container == "string" ? document.querySelector(e.container) : e.container;
	if (!t) throw Error(`[Templatical] Container element not found: ${e.container}`);
	let n = await W(e.locale ?? "en"), r = w(e.fonts);
	q && Q(), q = _({ setup() {
		return () => y(I, {
			config: e,
			translations: n,
			fontsManager: r,
			ref: J
		});
	} }), q.mount(t);
	let i = {
		getContent() {
			return J.value ? JSON.parse(JSON.stringify(J.value.getContent())) : JSON.parse(JSON.stringify(e.content));
		},
		setContent(t) {
			J.value && J.value.setContent(t), e.content = t;
		},
		setTheme(e) {
			J.value && J.value.setTheme(e);
		},
		unmount: Q,
		renderCustomBlock(e) {
			return J.value ? J.value.renderCustomBlock(e) : Promise.reject(/* @__PURE__ */ Error("[Templatical] Editor not ready"));
		},
		toMjml: () => K(i)
	};
	return i;
}
var X = null, Z = o(null);
async function ie(e) {
	let t = typeof e.container == "string" ? document.querySelector(e.container) : e.container;
	if (!t) throw Error(`[Templatical] Container element not found: ${e.container}`);
	let { default: n } = await import("./CloudEditor-DG8fWnXI.js"), [r, i] = await Promise.all([W(e.locale ?? "en"), G(e.locale ?? "en")]), a = w(e.fonts);
	return X && $(), await new Promise((o, s) => {
		let c = setTimeout(() => {
			s(/* @__PURE__ */ Error("[Templatical] Cloud editor initialization timed out"));
		}, x);
		X = _({ setup() {
			return () => y(n, {
				config: e,
				translations: r,
				cloudTranslations: i,
				fontsManager: a,
				ref: Z,
				onReady: () => {
					clearTimeout(c), o();
				}
			});
		} }), X.mount(t);
	}), {
		getContent() {
			return Z.value ? JSON.parse(JSON.stringify(Z.value.getContent())) : JSON.parse(JSON.stringify(e.content));
		},
		setContent(e) {
			Z.value && Z.value.setContent(e);
		},
		setTheme(e) {
			Z.value && Z.value.setTheme(e);
		},
		unmount: $,
		create(e) {
			return Z.value ? Z.value.create(e) : Promise.reject(/* @__PURE__ */ Error("[Templatical] Cloud editor not ready"));
		},
		load(e) {
			return Z.value ? Z.value.load(e) : Promise.reject(/* @__PURE__ */ Error("[Templatical] Cloud editor not ready"));
		},
		save() {
			return Z.value ? Z.value.save() : Promise.reject(/* @__PURE__ */ Error("[Templatical] Cloud editor not ready"));
		}
	};
}
function Q() {
	q && (q.unmount(), q = null, J.value = null);
}
function $() {
	X && (X.unmount(), X = null, Z.value = null);
}
//#endregion
export { Y as init, ie as initCloud, Q as unmount, w as useFonts };
