@templatical/editor 0.0.6 → 0.1.1

package/dist/templatical-editor.js

@@ -1,105 +1,97 @@
-import { r as e } from "./timeouts-CmBrLeZA.js";
-import { t, x as n } from "./useEditorCore-ColJh1ST.js";
-import { t as r } from "./_plugin-vue_export-helper-5TQrnOhO.js";
-import { a as i, c as a, i as o, n as s, o as c, r as l, s as u, t as d } from "./styles-nvxFh6L6.js";
-import { Transition as f, createApp as p, createCommentVNode as m, createElementBlock as h, createElementVNode as g, createTextVNode as _, createVNode as v, defineComponent as y, h as b, normalizeClass as x, normalizeStyle as S, onMounted as C, onUnmounted as w, openBlock as T, ref as E, toDisplayString as D, unref as O, vShow as k, withCtx as ee, withDirectives as A } from "vue";
-import { useEditor as j } from "@templatical/core";
+import { A as e, Ct as t, H as n, M as r, Ot as i, S as a, V as o, Y as s, _ as c, b as l, c as u, g as d, h as f, j as p, m, n as h, t as g, tt as _, w as v, wt as y, y as b } from "./vue.runtime.esm-bundler-DryoQb-v.js";
+import { r as x } from "./timeouts-BSGxjuUF.js";
+import { t as S, x as C } from "./useEditorCore-DMH2QpUL.js";
+import { t as w } from "./_plugin-vue_export-helper-OO6pH1Dh.js";
+import { a as T, c as E, i as D, n as O, o as k, r as A, s as j, t as M } from "./styles-tcwlvlEB.js";
+import { useEditor as N } from "@templatical/core";
 //#region src/Editor.vue?vue&type=script&setup=true&lang.ts
-var M = ["data-tpl-theme"], N = {
+var P = ["data-tpl-theme"], F = {
 	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)"
 	}
-}, P = { class: "tpl:flex tpl:items-center tpl:gap-2.5" }, F = {
-	class: "tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]",
-	style: { "letter-spacing": "-0.01em" }
-}, I = { class: "tpl:flex tpl:items-center tpl:justify-center tpl:gap-10" }, L = { class: "tpl:sticky tpl:top-0 tpl:z-40 tpl:h-0" }, R = { class: "tpl:flex tpl:justify-center tpl:p-8" }, z = ["aria-label"], B = /* @__PURE__ */ r(/* @__PURE__ */ y({
+}, I = { class: "tpl:flex tpl:items-center tpl:justify-center tpl:gap-10" }, L = { class: "tpl:sticky tpl:top-0 tpl:z-40 tpl:h-0" }, R = { class: "tpl:flex tpl:justify-center tpl:p-8" }, z = ["aria-label"], B = /* @__PURE__ */ w(/* @__PURE__ */ a({
 	__name: "Editor",
 	props: {
 		config: {},
 		translations: {},
 		fontsManager: {}
 	},
-	setup(e, { expose: n }) {
-		let r = e, p = j({
-			content: r.config.content,
-			templateDefaults: r.config.templateDefaults
-		}), y = t({
-			editor: p,
+	setup(a, { expose: s }) {
+		let h = a, v = N({
+			content: h.config.content,
+			templateDefaults: h.config.templateDefaults
+		}), x = S({
+			editor: v,
 			config: {
-				uiTheme: r.config.uiTheme,
-				theme: r.config.theme,
-				blockDefaults: r.config.blockDefaults,
-				customBlocks: r.config.customBlocks,
-				mergeTags: r.config.mergeTags,
-				displayConditions: r.config.displayConditions,
-				onRequestMedia: r.config.onRequestMedia,
-				onSave: r.config.onSave ? () => r.config.onSave(JSON.parse(JSON.stringify(p.state.content))) : void 0
+				uiTheme: h.config.uiTheme,
+				theme: h.config.theme,
+				blockDefaults: h.config.blockDefaults,
+				customBlocks: h.config.customBlocks,
+				mergeTags: h.config.mergeTags,
+				displayConditions: h.config.displayConditions,
+				onRequestMedia: h.config.onRequestMedia,
+				onSave: h.config.onSave ? () => h.config.onSave(JSON.parse(JSON.stringify(v.state.content))) : void 0
 			},
-			translations: r.translations,
-			fontsManager: r.fontsManager,
-			autoSaveOptions: r.config.onChange ? { onChange: () => r.config.onChange(JSON.parse(JSON.stringify(p.state.content))) } : null
+			translations: h.translations,
+			fontsManager: h.fontsManager,
+			autoSaveOptions: h.config.onChange ? { onChange: () => h.config.onChange(JSON.parse(JSON.stringify(v.state.content))) } : null
 		});
-		return C(async () => {
-			await r.fontsManager.loadCustomFonts();
-		}), w(() => {
-			r.fontsManager.cleanupFontLinks(), y.destroy();
-		}), n({
-			getContent: () => p.content.value,
-			setContent: (e) => p.setContent(e),
-			setTheme: (e) => p.setUiTheme(e)
-		}), (e, t) => (T(), h("div", {
-			class: x(["tpl tpl:relative tpl:h-full tpl:overflow-hidden", { "tpl:dark": O(p).state.darkMode }]),
-			"data-tpl-theme": O(y).resolvedTheme.value,
-			style: S(O(y).themeStyles.value)
+		return e(async () => {
+			await h.fontsManager.loadCustomFonts();
+		}), p(() => {
+			h.fontsManager.cleanupFontLinks(), x.destroy();
+		}), s({
+			getContent: () => v.content.value,
+			setContent: (e) => v.setContent(e),
+			setTheme: (e) => v.setUiTheme(e)
+		}), (e, s) => (r(), c("div", {
+			class: t(["tpl tpl:relative tpl:h-full tpl:overflow-hidden", { "tpl:dark": _(v).state.darkMode }]),
+			"data-tpl-theme": _(x).resolvedTheme.value,
+			style: y(_(x).themeStyles.value)
 		}, [
-			g("header", N, [
-				g("div", P, [t[5] ||= g("img", {
-					width: "24",
-					height: "24",
-					src: "https://templatical.com/logo.svg",
-					alt: "Templatical"
-				}, null, -1), g("span", F, D(O(y).t.header.title), 1)]),
-				g("div", I, [
-					v(o, {
-						viewport: O(p).state.viewport,
-						onChange: O(p).setViewport
+			m("header", F, [
+				s[5] ||= m("div", { class: "tpl:flex tpl:items-center tpl:gap-2.5" }, null, -1),
+				m("div", I, [
+					l(D, {
+						viewport: _(v).state.viewport,
+						onChange: _(v).setViewport
 					}, null, 8, ["viewport", "onChange"]),
-					v(s, {
-						"dark-mode": O(p).state.darkMode,
-						onChange: O(p).setDarkMode
+					l(O, {
+						"dark-mode": _(v).state.darkMode,
+						onChange: _(v).setDarkMode
 					}, null, 8, ["dark-mode", "onChange"]),
-					v(l, {
-						"preview-mode": O(p).state.previewMode,
-						onChange: O(p).setPreviewMode
+					l(A, {
+						"preview-mode": _(v).state.previewMode,
+						onChange: _(v).setPreviewMode
 					}, null, 8, ["preview-mode", "onChange"])
 				]),
-				t[6] ||= g("div", { class: "tpl:flex tpl:min-w-[200px] tpl:items-center tpl:justify-end tpl:gap-3" }, null, -1)
+				s[6] ||= m("div", { class: "tpl:flex tpl:min-w-[200px] tpl:items-center tpl:justify-end tpl:gap-3" }, null, -1)
 			]),
-			A(v(c, null, null, 512), [[k, !O(p).state.previewMode]]),
-			g("div", {
-				class: x(["tpl-body tpl:absolute tpl:bottom-0 tpl:overflow-auto tpl:bg-[var(--tpl-canvas-bg)]", [O(p).state.previewMode ? "tpl:left-0 tpl:right-0" : "tpl:left-12 tpl:right-[320px]", "tpl:top-14"]]),
+			n(l(k, null, null, 512), [[u, !_(v).state.previewMode]]),
+			m("div", {
+				class: t(["tpl-body tpl:absolute tpl:bottom-0 tpl:overflow-auto tpl:bg-[var(--tpl-canvas-bg)]", [_(v).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", L, [v(f, { name: "tpl-restore-btn" }, {
-				default: ee(() => [O(y).conditionPreview.hasHiddenBlocks.value ? (T(), h("button", {
+			}, [m("div", L, [l(g, { name: "tpl-restore-btn" }, {
+				default: o(() => [_(x).conditionPreview.hasHiddenBlocks.value ? (r(), c("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: t[0] ||= (e) => O(y).conditionPreview.reset()
-				}, [v(O(a), {
+					onClick: s[0] ||= (e) => _(x).conditionPreview.reset()
+				}, [l(_(E), {
 					size: 13,
 					"stroke-width": 2
-				}), _(" " + D(O(y).t.blockSettings.restoreHiddenBlocks), 1)])) : m("", !0)]),
+				}), b(" " + i(_(x).t.blockSettings.restoreHiddenBlocks), 1)])) : d("", !0)]),
 				_: 1
-			})]), g("div", R, [v(u, {
-				viewport: O(p).state.viewport,
-				content: O(p).content.value,
-				"selected-block-id": O(p).state.selectedBlockId,
-				"dark-mode": O(p).state.darkMode,
-				"preview-mode": O(p).state.previewMode,
-				onSelectBlock: O(p).selectBlock
+			})]), m("div", R, [l(j, {
+				viewport: _(v).state.viewport,
+				content: _(v).content.value,
+				"selected-block-id": _(v).state.selectedBlockId,
+				"dark-mode": _(v).state.darkMode,
+				"preview-mode": _(v).state.previewMode,
+				onSelectBlock: _(v).selectBlock
 			}, null, 8, [
 				"viewport",
 				"content",
@@ -108,29 +100,32 @@ var M = ["data-tpl-theme"], N = {
 				"preview-mode",
 				"onSelectBlock"
 			])])], 2),
-			v(d, { "position-class": [O(p).state.previewMode ? "tpl:left-0 tpl:right-0" : "tpl:left-12 tpl:right-[320px]"] }, null, 8, ["position-class"]),
-			g("div", {
+			a.config.branding === !1 ? d("", !0) : (r(), f(M, {
+				key: 0,
+				"position-class": [_(v).state.previewMode ? "tpl:left-0 tpl:right-0" : "tpl:left-12 tpl:right-[320px]"]
+			}, null, 8, ["position-class"])),
+			m("div", {
 				class: "tpl-sr-only",
 				role: "status",
 				"aria-live": "polite",
 				"aria-atomic": "true",
-				"aria-label": O(y).t.landmarks.reorderAnnouncements
-			}, D(O(y).keyboardReorder.announcement.value), 9, z),
-			A(v(i, {
-				"selected-block": O(p).selectedBlock.value,
-				settings: O(p).content.value.settings,
-				onUpdateBlock: t[1] ||= (e) => O(p).updateBlock(O(p).state.selectedBlockId, e),
-				onDeleteBlock: t[2] ||= () => {
-					O(p).state.selectedBlockId && O(y).blockActions.deleteBlock(O(p).state.selectedBlockId);
+				"aria-label": _(x).t.landmarks.reorderAnnouncements
+			}, i(_(x).keyboardReorder.announcement.value), 9, z),
+			n(l(T, {
+				"selected-block": _(v).selectedBlock.value,
+				settings: _(v).content.value.settings,
+				onUpdateBlock: s[1] ||= (e) => _(v).updateBlock(_(v).state.selectedBlockId, e),
+				onDeleteBlock: s[2] ||= () => {
+					_(v).state.selectedBlockId && _(x).blockActions.deleteBlock(_(v).state.selectedBlockId);
 				},
-				onDuplicateBlock: t[3] ||= () => {
-					O(p).selectedBlock.value && O(y).blockActions.duplicateBlock(O(p).selectedBlock.value);
+				onDuplicateBlock: s[3] ||= () => {
+					_(v).selectedBlock.value && _(x).blockActions.duplicateBlock(_(v).selectedBlock.value);
 				},
-				onUpdateSettings: t[4] ||= (e) => O(p).updateSettings(e)
-			}, null, 8, ["selected-block", "settings"]), [[k, !O(p).state.previewMode]])
-		], 14, M));
+				onUpdateSettings: s[4] ||= (e) => _(v).updateSettings(e)
+			}, null, 8, ["selected-block", "settings"]), [[u, !_(v).state.previewMode]])
+		], 14, P));
 	}
-}), [["__scopeId", "data-v-8c8f0453"]]), V = (e, t, n) => {
+}), [["__scopeId", "data-v-24f3e229"]]), V = (e, t, n) => {
 	let r = t.lastIndexOf("?"), i = e[r === -1 || r < t.lastIndexOf("/") ? t : t.slice(0, r)];
 	return i ? typeof i == "function" ? i() : Promise.resolve(i) : new Promise((e, r) => {
 		(typeof queueMicrotask == "function" ? queueMicrotask : setTimeout)(r.bind(null, /* @__PURE__ */ Error("Unknown variable dynamic import: " + t + (t.split("/").length === n ? "" : ". Note that variables only represent file names one level deep."))));
@@ -142,27 +137,27 @@ function U(e) {
 async function W(e) {
 	let t = U(e), n = H.includes(t) ? t : "en";
 	return (await V(/* @__PURE__ */ Object.assign({
-		"./locales/de.ts": () => import("./de-Dh8ON-dm.js"),
-		"./locales/en.ts": () => import("./en-C7IShRSD.js")
+		"./locales/de.ts": () => import("./de-CN0xu_Tp.js"),
+		"./locales/en.ts": () => import("./en-DXvHkaUF.js")
 	}), `./locales/${n}.ts`, 3)).default;
 }
 //#endregion
 //#region src/index.ts
-var G = null, K = E(null);
+var G = null, K = s(null);
 async function q(e) {
 	let t = typeof e.container == "string" ? document.querySelector(e.container) : e.container;
 	if (!t) throw Error(`[Templatical] Container element not found: ${e.container}`);
 	G && Z();
-	let r = await W(e.locale ?? "en"), i = n(e.fonts);
-	G = p({ setup() {
-		return () => b(B, {
+	let n = await W(e.locale ?? "en"), r = C(e.fonts);
+	G = h({ setup() {
+		return () => v(B, {
 			config: e,
-			translations: r,
-			fontsManager: i,
+			translations: n,
+			fontsManager: r,
 			ref: K
 		});
 	} }), G.mount(t);
-	let a = {
+	let i = {
 		getContent() {
 			return K.value ? JSON.parse(JSON.stringify(K.value.getContent())) : JSON.parse(JSON.stringify(e.content));
 		},
@@ -174,33 +169,33 @@ async function q(e) {
 		},
 		unmount: Z
 	};
-	return $(a), a;
+	return $(i), i;
 }
-var J = null, Y = E(null);
-async function X(t) {
-	let r = typeof t.container == "string" ? document.querySelector(t.container) : t.container;
-	if (!r) throw Error(`[Templatical] Container element not found: ${t.container}`);
+var J = null, Y = s(null);
+async function X(e) {
+	let t = typeof e.container == "string" ? document.querySelector(e.container) : e.container;
+	if (!t) throw Error(`[Templatical] Container element not found: ${e.container}`);
 	J && Q();
-	let { default: i } = await import("./CloudEditor-Bz5Xkxej.js"), a = await W(t.locale ?? "en"), o = n(t.fonts);
-	await new Promise((n, s) => {
-		let c = setTimeout(() => {
-			s(/* @__PURE__ */ Error("[Templatical] Cloud editor initialization timed out"));
-		}, e);
-		J = p({ setup() {
-			return () => b(i, {
-				config: t,
-				translations: a,
-				fontsManager: o,
+	let { default: n } = await import("./CloudEditor-yCOkIkZ-.js"), r = await W(e.locale ?? "en"), i = C(e.fonts);
+	await new Promise((a, o) => {
+		let s = setTimeout(() => {
+			o(/* @__PURE__ */ Error("[Templatical] Cloud editor initialization timed out"));
+		}, x);
+		J = h({ setup() {
+			return () => v(n, {
+				config: e,
+				translations: r,
+				fontsManager: i,
 				ref: Y,
 				onReady: () => {
-					clearTimeout(c), n();
+					clearTimeout(s), a();
 				}
 			});
-		} }), J.mount(r);
+		} }), J.mount(t);
 	});
-	let s = {
+	let a = {
 		getContent() {
-			return Y.value ? JSON.parse(JSON.stringify(Y.value.getContent())) : JSON.parse(JSON.stringify(t.content));
+			return Y.value ? JSON.parse(JSON.stringify(Y.value.getContent())) : JSON.parse(JSON.stringify(e.content));
 		},
 		setContent(e) {
 			Y.value && Y.value.setContent(e);
@@ -219,7 +214,7 @@ async function X(t) {
 			return Y.value ? Y.value.save() : Promise.reject(/* @__PURE__ */ Error("[Templatical] Cloud editor not ready"));
 		}
 	};
-	return $(s), s;
+	return $(a), a;
 }
 function Z() {
 	G && (G.unmount(), G = null, K.value = null);
@@ -233,4 +228,4 @@ function $(e) {
 	}).catch(() => {});
 }
 //#endregion
-export { q as init, X as initCloud, Z as unmount, n as useFonts };
+export { q as init, X as initCloud, Z as unmount, C as useFonts };

package/dist/text-align-start-4Hx15GUf.js

@@ -0,0 +1,43 @@
+import { n as e } from "./_plugin-vue_export-helper-OO6pH1Dh.js";
+var t = e("text-align-center", [
+	["path", {
+		d: "M21 5H3",
+		key: "1fi0y6"
+	}],
+	["path", {
+		d: "M17 12H7",
+		key: "16if0g"
+	}],
+	["path", {
+		d: "M19 19H5",
+		key: "vjpgq2"
+	}]
+]), n = e("text-align-end", [
+	["path", {
+		d: "M21 5H3",
+		key: "1fi0y6"
+	}],
+	["path", {
+		d: "M21 12H9",
+		key: "dn1m92"
+	}],
+	["path", {
+		d: "M21 19H7",
+		key: "4cu937"
+	}]
+]), r = e("text-align-start", [
+	["path", {
+		d: "M21 5H3",
+		key: "1fi0y6"
+	}],
+	["path", {
+		d: "M15 12H3",
+		key: "6jk70r"
+	}],
+	["path", {
+		d: "M17 19H3",
+		key: "z6ezky"
+	}]
+]);
+//#endregion
+export { n, t as r, r as t };

package/dist/{trash-2-CZkMtjeC.js → trash-2-BY-xp5hg.js}

@@ -1,4 +1,4 @@
-import { n as e } from "./_plugin-vue_export-helper-5TQrnOhO.js";
+import { n as e } from "./_plugin-vue_export-helper-OO6pH1Dh.js";
 var t = e("trash-2", [
 	["path", {
 		d: "M10 11v6",

package/dist/{triangle-alert-Dvt51agD.js → triangle-alert-DG72vdb2.js}

@@ -1,4 +1,4 @@
-import { n as e } from "./_plugin-vue_export-helper-5TQrnOhO.js";
+import { n as e } from "./_plugin-vue_export-helper-OO6pH1Dh.js";
 var t = e("triangle-alert", [
 	["path", {
 		d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3",