better-react-email-editor 0.1.6 → 0.1.7

package/dist/index.js

@@ -5,49 +5,50 @@ import { EmailNode as _, composeReactEmail as v } from "@react-email/editor/core
 import { Button as y, StarterKit as b } from "@react-email/editor/extensions";
 import { EmailTheming as x, extendTheme as S, getEmailTheming as C, setGlobalStyles as w, useEditorImage as T } from "@react-email/editor/plugins";
 import { Fragment as E } from "@tiptap/pm/model";
-import { NodeSelection as D, Plugin as O, PluginKey as ee, Selection as k, TextSelection as A } from "@tiptap/pm/state";
-import { generateJSON as te } from "@tiptap/html";
-import { Extension as ne, mergeAttributes as re } from "@tiptap/core";
-import { ReplaceStep as ie } from "@tiptap/pm/transform";
-import { AlignCenterIcon as ae, AlignLeftIcon as oe, AlignRightIcon as se, BoldIcon as j, BubbleMenu as ce, CodeIcon as le, Columns2Icon as ue, Columns3Icon as de, Columns4Icon as fe, EditorFocusScope as M, Heading1Icon as pe, ImageIcon as me, Inspector as N, ItalicIcon as he, LayoutIcon as ge, LinkIcon as _e, ListIcon as ve, ListOrderedIcon as ye, MinusIcon as be, MousePointerClickIcon as xe, PanelLeftIcon as P, PanelTopIcon as Se, PlusIcon as Ce, SlashCommand as F, SquareCodeIcon as we, StrikethroughIcon as Te, TableIcon as Ee, TextQuoteIcon as De, TypeIcon as Oe, UnderlineIcon as ke, XIcon as Ae, defaultSlashCommands as je } from "@react-email/editor/ui";
-import { Fragment as I, jsx as L, jsxs as R } from "react/jsx-runtime";
-import * as Me from "@radix-ui/react-popover";
-import { HexColorInput as Ne, HexColorPicker as Pe } from "react-colorful";
-import { Column as Fe, Img as Ie, Link as Le, Row as Re, Section as ze } from "react-email";
-import { createPortal as Be } from "react-dom";
+import { NodeSelection as D, Plugin as O, PluginKey as k, Selection as A, TextSelection as j } from "@tiptap/pm/state";
+import { generateJSON as ee } from "@tiptap/html";
+import { Extension as te, mergeAttributes as ne } from "@tiptap/core";
+import { ReplaceStep as re } from "@tiptap/pm/transform";
+import { Decoration as ie, DecorationSet as ae } from "@tiptap/pm/view";
+import { AlignCenterIcon as oe, AlignLeftIcon as se, AlignRightIcon as ce, BoldIcon as le, BubbleMenu as ue, CodeIcon as de, Columns2Icon as fe, Columns3Icon as pe, Columns4Icon as me, EditorFocusScope as M, Heading1Icon as he, ImageIcon as ge, Inspector as N, ItalicIcon as _e, LayoutIcon as ve, LinkIcon as ye, ListIcon as be, ListOrderedIcon as xe, MinusIcon as Se, MousePointerClickIcon as P, PanelLeftIcon as Ce, PanelTopIcon as we, PlusIcon as F, SlashCommand as Te, SquareCodeIcon as Ee, StrikethroughIcon as De, TableIcon as Oe, TextQuoteIcon as ke, TypeIcon as Ae, UnderlineIcon as je, XIcon as Me, defaultSlashCommands as Ne } from "@react-email/editor/ui";
+import { Fragment as Pe, jsx as I, jsxs as L } from "react/jsx-runtime";
+import * as Fe from "@radix-ui/react-popover";
+import { HexColorInput as Ie, HexColorPicker as Le } from "react-colorful";
+import { Column as Re, Img as ze, Link as Be, Row as Ve, Section as He } from "react-email";
+import { createPortal as Ue } from "react-dom";
 //#region \0rolldown/runtime.js
-var Ve = Object.defineProperty, He = (e, t) => {
+var We = Object.defineProperty, Ge = (e, t) => {
 	let n = {};
-	for (var r in e) Ve(n, r, {
+	for (var r in e) We(n, r, {
 		get: e[r],
 		enumerable: !0
 	});
-	return t || Ve(n, Symbol.toStringTag, { value: "Module" }), n;
+	return t || We(n, Symbol.toStringTag, { value: "Module" }), n;
 };
 //#endregion
 //#region src/core/cx.ts
-function z(...e) {
+function R(...e) {
 	return e.filter(Boolean).join(" ");
 }
 //#endregion
 //#region src/core/dnd.ts
-var Ue = /* @__PURE__ */ new Set([
+var Ke = /* @__PURE__ */ new Set([
 	"container",
 	"section",
 	"columnsColumn"
-]), We = /* @__PURE__ */ new Set([
+]), qe = /* @__PURE__ */ new Set([
 	"twoColumns",
 	"threeColumns",
 	"fourColumns"
-]), Ge = "application/x-email-block";
-function Ke(e, t) {
+]), Je = "application/x-email-block";
+function Ye(e, t) {
 	let n = e.nodeDOM(t);
 	return n instanceof HTMLElement ? n.getBoundingClientRect() : null;
 }
-function qe(e, t, n) {
+function Xe(e, t, n) {
 	let r = [];
 	return t.forEach((t, i) => {
-		let a = n + 1 + i, o = Ke(e, a);
+		let a = n + 1 + i, o = Ye(e, a);
 		o && r.push({
 			node: t,
 			pos: a,
@@ -55,10 +56,10 @@ function qe(e, t, n) {
 		});
 	}), r;
 }
-function Je(e) {
+function Ze(e) {
 	return e.type.name === "paragraph" && e.childCount === 0;
 }
-function Ye(e) {
+function Qe(e) {
 	let t = null;
 	return e.forEach((e, n) => {
 		!t && e.type.name === "container" && (t = {
@@ -67,28 +68,28 @@ function Ye(e) {
 		});
 	}), t;
 }
-function Xe(e, t, n, r, i) {
-	let a = Ye(e.state.doc);
+function $e(e, t, n, r, i) {
+	let a = Qe(e.state.doc);
 	if (!a) return null;
 	let o = (e) => !!i && e >= i.from && e < i.to, s = (i, a) => {
-		let c = qe(e, i, a), l = Ke(e, a);
+		let c = Xe(e, i, a), l = Ye(e, a);
 		if (!l) return null;
 		for (let r of c) {
 			let { rect: i } = r, a = Math.min(12, i.height / 4), c = n > i.top + a && n < i.bottom - a, l = t >= i.left && t <= i.right;
 			if (!c || !l || o(r.pos)) continue;
 			let u = r.node.type.name;
-			if (Ue.has(u)) {
+			if (Ke.has(u)) {
 				let e = s(r.node, r.pos);
 				if (e) return e;
-			} else if (We.has(u)) {
-				let n = qe(e, r.node, r.pos), i = n.find((e) => t >= e.rect.left && t <= e.rect.right) ?? (t < n[0]?.rect.left ? n[0] : n[n.length - 1]);
+			} else if (qe.has(u)) {
+				let n = Xe(e, r.node, r.pos), i = n.find((e) => t >= e.rect.left && t <= e.rect.right) ?? (t < n[0]?.rect.left ? n[0] : n[n.length - 1]);
 				if (i && !o(i.pos)) {
 					let e = s(i.node, i.pos);
 					if (e) return e;
 				}
 			}
 		}
-		if (c.length === 1 && Je(c[0].node) && !o(c[0].pos)) {
+		if (c.length === 1 && Ze(c[0].node) && !o(c[0].pos)) {
 			let e = c[0];
 			return i.type.validContent(r) ? {
 				pos: e.pos,
@@ -133,7 +134,7 @@ function Xe(e, t, n, r, i) {
 	};
 	return s(a.node, a.pos);
 }
-function Ze(e, t) {
+function et(e, t) {
 	let { schema: n, doc: r } = e.state;
 	if (t.kind === "new") try {
 		return E.fromArray(t.content().map((e) => n.nodeFromJSON(e)));
@@ -143,49 +144,49 @@ function Ze(e, t) {
 	let i = r.nodeAt(t.pos);
 	return i ? E.from(i) : null;
 }
-function Qe(e, t) {
+function tt(e, t) {
 	let n = e.doc.nodeAt(t);
-	n && (n.isAtom || n.type.name === "horizontalRule" ? e.setSelection(D.create(e.doc, t)) : e.setSelection(A.near(e.doc.resolve(t + 1))));
+	n && (n.isAtom || n.type.name === "horizontalRule" ? e.setSelection(D.create(e.doc, t)) : e.setSelection(j.near(e.doc.resolve(t + 1))));
 }
-function $e(e) {
+function nt(e) {
 	let { selection: t, doc: n } = e.state;
-	t instanceof D && e.dispatch(e.state.tr.setSelection(k.near(n.resolve(t.from))));
+	t instanceof D && e.dispatch(e.state.tr.setSelection(A.near(n.resolve(t.from))));
 }
-function et(e, t) {
+function rt(e, t) {
 	if (t.replaceTo !== void 0) return t;
 	let n = e.resolve(t.pos), r = n.parent, i = r.lastChild;
-	return n.index() !== r.childCount || !i || r.childCount < 2 || !Je(i) ? t : {
+	return n.index() !== r.childCount || !i || r.childCount < 2 || !Ze(i) ? t : {
 		...t,
 		pos: t.pos - i.nodeSize
 	};
 }
-function tt(e, t, n) {
+function it(e, t, n) {
 	let { view: r } = e;
-	$e(r);
-	let i = Ze(r, t);
+	nt(r);
+	let i = et(r, t);
 	if (!i) return !1;
-	let a = et(r.state.doc, n), o = r.state.tr;
-	if (t.kind === "new") a.replaceTo === void 0 ? o.insert(a.pos, i) : o.replaceWith(a.pos, a.replaceTo, i), Qe(o, a.pos);
+	let a = rt(r.state.doc, n), o = r.state.tr;
+	if (t.kind === "new") a.replaceTo === void 0 ? o.insert(a.pos, i) : o.replaceWith(a.pos, a.replaceTo, i), tt(o, a.pos);
 	else {
 		let e = r.state.doc.nodeAt(t.pos);
 		if (!e) return !1;
 		let n = t.pos, i = n + e.nodeSize;
 		if (a.replaceTo === void 0 && (a.pos === n || a.pos === i)) return !1;
-		nt(o, n, i);
+		at(o, n, i);
 		let s = o.mapping.map(a.pos, -1);
 		if (a.replaceTo !== void 0) {
 			let t = o.mapping.map(a.replaceTo, 1);
 			o.replaceWith(s, t, e);
 		} else o.insert(s, e);
-		Qe(o, s);
+		tt(o, s);
 	}
 	return r.dispatch(o.scrollIntoView()), r.focus(), !0;
 }
-function nt(e, t, n) {
+function at(e, t, n) {
 	let r = e.doc.resolve(t).parent;
-	r.childCount === 1 && Ue.has(r.type.name) ? e.replaceWith(t, n, e.doc.type.schema.nodes.paragraph.create()) : e.delete(t, n);
+	r.childCount === 1 && Ke.has(r.type.name) ? e.replaceWith(t, n, e.doc.type.schema.nodes.paragraph.create()) : e.delete(t, n);
 }
-function rt(e, t, n = !0) {
+function z(e, t, n = !0) {
 	if (t < 0 || t > e.content.size) return null;
 	let r = [], i = e.nodeAt(t);
 	n && i && r.push({
@@ -199,55 +200,55 @@ function rt(e, t, n = !0) {
 	});
 	for (let t of r) {
 		let n = e.resolve(t.pos).parent.type.name;
-		if (Ue.has(n) || We.has(n)) return t;
+		if (Ke.has(n) || qe.has(n)) return t;
 	}
 	return null;
 }
-function it(e) {
+function ot(e) {
 	return e.node.type.name === "columnsColumn";
 }
-function at(e, t) {
+function st(e, t) {
 	let n = e.resolve(t.pos);
 	for (let r = n.depth; r > 0; r--) {
-		let i = rt(e, n.before(r));
+		let i = z(e, n.before(r));
 		if (i && i.pos !== t.pos) return i;
 	}
 	return null;
 }
-function ot(e) {
+function ct(e) {
 	let { selection: t, doc: n } = e.state;
-	return t instanceof D ? rt(n, t.from) ?? {
+	return t instanceof D ? z(n, t.from) ?? {
 		pos: t.from,
 		node: t.node
-	} : rt(n, t.from, !1);
+	} : z(n, t.from, !1);
 }
-function st(e, t) {
+function lt(e, t) {
 	let { view: n } = e, r = n.state.tr.setSelection(D.create(n.state.doc, t.pos));
 	n.dispatch(r), n.focus();
 }
-function ct(e, t) {
+function ut(e, t) {
 	let { view: n } = e;
-	$e(n);
+	nt(n);
 	let r = n.state.doc.nodeAt(t.pos);
 	if (!r) return;
 	let i = t.pos + r.nodeSize, a = n.state.tr.insert(i, r.copy(r.content));
 	a.setSelection(D.create(a.doc, i)), n.dispatch(a.scrollIntoView()), n.focus();
 }
-function lt(e, t) {
+function dt(e, t) {
 	let { view: n } = e, r = n.state.doc.nodeAt(t.pos);
 	if (!r) return;
 	let i = n.state.tr;
-	nt(i, t.pos, t.pos + r.nodeSize), n.dispatch(i);
+	at(i, t.pos, t.pos + r.nodeSize), n.dispatch(i);
 }
-function ut(e, t) {
-	let n = Ye(e.state.doc);
+function ft(e, t) {
+	let n = Qe(e.state.doc);
 	if (!n) return;
 	let r = n.node.lastChild, i = n.pos + n.node.nodeSize - 1;
-	tt(e, {
+	it(e, {
 		kind: "new",
 		label: "",
 		content: () => t
-	}, r && Je(r) && n.node.childCount > 1 ? {
+	}, r && Ze(r) && n.node.childCount > 1 ? {
 		pos: i - r.nodeSize,
 		replaceTo: i,
 		line: {
@@ -266,7 +267,7 @@ function ut(e, t) {
 }
 //#endregion
 //#region src/core/paste.ts
-var dt = y.extend({ parseHTML() {
+var pt = y.extend({ parseHTML() {
 	return [{
 		tag: "a[data-id=\"react-email-button\"]",
 		getAttrs: (e) => {
@@ -281,29 +282,29 @@ var dt = y.extend({ parseHTML() {
 		}
 	}];
 } });
-function ft(e, t) {
+function mt(e, t) {
 	let n = t.clipboardData?.getData("text/html") ?? "", r = n.includes("data-pm-slice");
 	if ((t.clipboardData?.files?.length ?? 0) > 0) return !1;
 	let { view: i } = e, { state: a } = i, { selection: o } = a;
 	if (o instanceof D && o.node.isBlock) {
 		let e = o.node, t = e.type.name === "columnsColumn" ? o.from + e.nodeSize - 1 : o.from + e.nodeSize, n = a.doc.resolve(t), r = a.schema.nodes.paragraph;
-		if (We.has(n.parent.type.name) || !n.parent.canReplaceWith(n.index(), n.index(), r)) return !1;
-		i.dispatch(a.tr.setSelection(A.near(n)));
+		if (qe.has(n.parent.type.name) || !n.parent.canReplaceWith(n.index(), n.index(), r)) return !1;
+		i.dispatch(a.tr.setSelection(j.near(n)));
 		let s = i.state.tr.insert(t, r.create());
-		s.setSelection(A.create(s.doc, t + 1)), i.dispatch(s);
+		s.setSelection(j.create(s.doc, t + 1)), i.dispatch(s);
 	}
 	return r ? (t.preventDefault(), t.stopPropagation(), i.pasteHTML(n), !0) : !1;
 }
 //#endregion
 //#region src/core/paste-handler.ts
-var pt = /class="[^"]*node-/, mt = [
+var ht = /class="[^"]*node-/, gt = [
 	"script",
 	"iframe",
 	"object",
 	"embed",
 	"meta",
 	"base"
-], ht = ["href", "src"], gt = {
+], _t = ["href", "src"], vt = {
 	a: [
 		"href",
 		"target",
@@ -328,49 +329,49 @@ var pt = /class="[^"]*node-/, mt = [
 	],
 	"*": ["id"]
 };
-function _t(e, t) {
+function yt(e, t) {
 	let n = e.trim().toLowerCase();
 	return n.startsWith("javascript:") || n.startsWith("vbscript:") ? !1 : !n.startsWith("data:") || t && n.startsWith("data:image/");
 }
-function vt(e) {
-	let t = /* @__PURE__ */ new Set([...gt[e.tagName.toLowerCase()] ?? [], ...gt["*"]]);
+function bt(e) {
+	let t = /* @__PURE__ */ new Set([...vt[e.tagName.toLowerCase()] ?? [], ...vt["*"]]);
 	for (let n of Array.from(e.attributes)) (n.name.startsWith("data-") || !t.has(n.name)) && e.removeAttribute(n.name);
 }
-function yt(e) {
-	e.nodeType === Node.ELEMENT_NODE && vt(e);
-	for (let t of Array.from(e.childNodes)) yt(t);
+function xt(e) {
+	e.nodeType === Node.ELEMENT_NODE && bt(e);
+	for (let t of Array.from(e.childNodes)) xt(t);
 }
-function bt(e) {
+function St(e) {
 	let t = new DOMParser().parseFromString(e, "text/html");
-	for (let e of mt) for (let n of Array.from(t.body.getElementsByTagName(e))) n.remove();
+	for (let e of gt) for (let n of Array.from(t.body.getElementsByTagName(e))) n.remove();
 	for (let e of Array.from(t.body.querySelectorAll("[href], [src]"))) {
 		let t = e.tagName.toLowerCase() === "img";
-		for (let n of ht) {
+		for (let n of _t) {
 			let r = e.getAttribute(n);
-			r !== null && !_t(r, t) && e.removeAttribute(n);
+			r !== null && !yt(r, t) && e.removeAttribute(n);
 		}
 	}
-	return pt.test(e) || yt(t.body), t.body.innerHTML;
+	return ht.test(e) || xt(t.body), t.body.innerHTML;
 }
-function xt(e) {
+function Ct(e) {
 	return (t, n, r) => {
 		if (r.content.childCount === 1) return !1;
 		let i = n.clipboardData?.getData?.("text/html");
 		if (!i) return !1;
 		n.preventDefault();
-		let a = te(bt(i), e), o = t.state.schema.nodeFromJSON(a);
+		let a = ee(St(i), e), o = t.state.schema.nodeFromJSON(a);
 		return t.dispatch(t.state.tr.replaceSelectionWith(o, !1)), !0;
 	};
 }
 //#endregion
 //#region src/core/select-all.ts
-var St = /* @__PURE__ */ new Set(["columnsColumn", "codeBlock"]), Ct = ne.create({
+var wt = /* @__PURE__ */ new Set(["columnsColumn", "codeBlock"]), Tt = te.create({
 	name: "selectAllFix",
 	priority: 101,
 	addKeyboardShortcuts() {
 		return { "Mod-a": ({ editor: e }) => {
 			let { state: t } = e, { $from: n } = t.selection;
-			for (let e = n.depth; e > 0; e--) if (St.has(n.node(e).type.name) && (t.selection.from !== n.start(e) || t.selection.to !== n.end(e))) return !1;
+			for (let e = n.depth; e > 0; e--) if (wt.has(n.node(e).type.name) && (t.selection.from !== n.start(e) || t.selection.to !== n.end(e))) return !1;
 			let r = -1;
 			t.doc.forEach((e, t) => {
 				r < 0 && e.type.name === "container" && (r = t);
@@ -378,25 +379,46 @@ var St = /* @__PURE__ */ new Set(["columnsColumn", "codeBlock"]), Ct = ne.create
 			let i = r < 0 ? null : t.doc.nodeAt(r);
 			if (!i) return !1;
 			let a = r + 1, o = r + i.nodeSize - 1;
-			return (t.selection.from !== a || t.selection.to !== o) && e.view.dispatch(t.tr.setSelection(A.create(t.doc, a, o))), !0;
+			return (t.selection.from !== a || t.selection.to !== o) && e.view.dispatch(t.tr.setSelection(j.create(t.doc, a, o))), !0;
 		} };
 	},
 	addProseMirrorPlugins() {
 		return [new O({
-			key: new ee("selectAllFix"),
+			key: new k("selectAllFix"),
 			appendTransaction(e, t, n) {
 				let r = t.selection;
-				if (!(r instanceof A) || r.$from.parent.inlineContent && r.$to.parent.inlineContent || !e.some((e) => e.steps.some((e) => e instanceof ie && e.from === r.from && e.to === r.to))) return null;
+				if (!(r instanceof j) || r.$from.parent.inlineContent && r.$to.parent.inlineContent || !e.some((e) => e.steps.some((e) => e instanceof re && e.from === r.from && e.to === r.to))) return null;
 				let i = r.from, a = r.to;
 				for (let t of e) i = t.mapping.map(i, -1), a = t.mapping.map(a, 1);
 				let { selection: o } = n;
-				if (o instanceof A && o.from >= i && o.to <= a) return null;
+				if (o instanceof j && o.from >= i && o.to <= a) return null;
 				let s = n.doc.resolve(i);
-				return n.tr.setSelection(k.findFrom(s, 1, !0) ?? k.near(s));
+				return n.tr.setSelection(A.findFrom(s, 1, !0) ?? A.near(s));
+			}
+		})];
+	}
+}), Et = te.create({
+	name: "focusedSpellcheck",
+	addProseMirrorPlugins() {
+		let { editor: e } = this;
+		return [new O({
+			key: new k("focusedSpellcheck"),
+			props: {
+				attributes: { spellcheck: "false" },
+				decorations: (t) => {
+					if (!e.isFocused) return ae.empty;
+					let { from: n, to: r, $from: i } = t.selection, a = [];
+					return t.doc.nodesBetween(n, r, (e, t) => !e.isTextblock || (a.push(ie.node(t, t + e.nodeSize, { spellcheck: "true" })), !1)), !a.length && i.parent.isTextblock && i.depth > 0 && a.push(ie.node(i.before(), i.after(), { spellcheck: "true" })), ae.create(t.doc, a);
+				}
 			}
 		})];
 	}
-}), wt = [
+}), Dt = [
+	{
+		label: "Inter",
+		value: "Inter, Arial, Helvetica, sans-serif",
+		href: "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700;800&display=swap"
+	},
 	{
 		label: "Arial",
 		value: "Arial, Helvetica, sans-serif"
@@ -418,17 +440,26 @@ var St = /* @__PURE__ */ new Set(["columnsColumn", "codeBlock"]), Ct = ne.create
 		value: "'Times New Roman', Times, serif"
 	}
 ];
-function Tt(e) {
+function Ot(e) {
 	return e.split(",")[0].trim().replace(/^['"]|['"]$/g, "").toLowerCase();
 }
-function Et(e, t) {
+function kt(e, t) {
 	if (!t) return;
-	let n = Tt(t);
-	return e.find((e) => Tt(e.value) === n);
+	let n = Ot(t);
+	return e.find((e) => Ot(e.value) === n);
+}
+function At(e, t) {
+	let n = /* @__PURE__ */ new Set();
+	for (let t of e.matchAll(/font-family:\s*([^;"]+)/gi)) n.add(Ot(t[1].replace(/&#x27;|&quot;/g, "'")));
+	return t.filter((e) => e.href && n.has(Ot(e.value)));
+}
+function jt(e, t) {
+	let n = At(e, t).map((e) => `<link href="${e.href.replace(/&/g, "&amp;")}" rel="stylesheet" />`).join("");
+	return n ? e.replace("</head>", `${n}</head>`) : e;
 }
 //#endregion
 //#region src/core/stores.ts
-function Dt() {
+function Mt() {
 	let e = null;
 	return {
 		get: () => e,
@@ -440,7 +471,7 @@ function Dt() {
 		}
 	};
 }
-function Ot() {
+function Nt() {
 	let e = null, t = /* @__PURE__ */ new Set();
 	return {
 		get: () => e,
@@ -457,7 +488,7 @@ function Ot() {
 }
 //#endregion
 //#region src/i18n/en.ts
-var kt = {
+var Pt = {
 	topBar: {
 		layers: "Layers",
 		toggleLayers: "Show / hide layers",
@@ -736,7 +767,7 @@ var kt = {
 		starterTitle: "Our favourites"
 	},
 	slashCommands: {}
-}, At = {
+}, Ft = {
 	topBar: {
 		layers: "Calques",
 		toggleLayers: "Afficher / masquer les calques",
@@ -1072,43 +1103,43 @@ var kt = {
 			description: "Mise en page sur quatre colonnes"
 		}
 	}
-}, jt = {
-	en: kt,
-	fr: At
+}, It = {
+	en: Pt,
+	fr: Ft
 };
-function Mt(e, t) {
+function Lt(e, t) {
 	return typeof e == "function" ? e(t) : e;
 }
-function Nt(e) {
+function Rt(e) {
 	return typeof e == "object" && !!e && !Array.isArray(e);
 }
-function Pt(e, t) {
-	if (!Nt(t) || !Nt(e)) return t ?? e;
+function zt(e, t) {
+	if (!Rt(t) || !Rt(e)) return t ?? e;
 	let n = { ...e };
-	for (let [e, r] of Object.entries(t)) r !== void 0 && (n[e] = Nt(r) && Nt(n[e]) ? Pt(n[e], r) : r);
+	for (let [e, r] of Object.entries(t)) r !== void 0 && (n[e] = Rt(r) && Rt(n[e]) ? zt(n[e], r) : r);
 	return n;
 }
-function Ft(e, t) {
-	let n = jt[e] ?? kt;
-	return t ? Pt(n, t) : n;
+function Bt(e, t) {
+	let n = It[e] ?? Pt;
+	return t ? zt(n, t) : n;
 }
 //#endregion
 //#region src/components/icons.tsx
-var It = /* @__PURE__ */ He({
-	CopyIcon: () => Rt,
-	DesktopIcon: () => Ut,
-	GripIcon: () => Lt,
-	LayersIcon: () => Gt,
-	MobileIcon: () => Wt,
-	OneColumnIcon: () => Xt,
-	ParentIcon: () => Bt,
-	PipetteIcon: () => Kt,
-	RedoIcon: () => Ht,
-	SocialIcon: () => Yt,
-	SpacerIcon: () => qt,
-	SpacerTileIcon: () => Jt,
-	TrashIcon: () => zt,
-	UndoIcon: () => Vt
+var Vt = /* @__PURE__ */ Ge({
+	CopyIcon: () => Ut,
+	DesktopIcon: () => Jt,
+	GripIcon: () => Ht,
+	LayersIcon: () => Xt,
+	MobileIcon: () => Yt,
+	OneColumnIcon: () => tn,
+	ParentIcon: () => Gt,
+	PipetteIcon: () => Zt,
+	RedoIcon: () => qt,
+	SocialIcon: () => en,
+	SpacerIcon: () => Qt,
+	SpacerTileIcon: () => $t,
+	TrashIcon: () => Wt,
+	UndoIcon: () => Kt
 }), B = (e, t = 2) => ({
 	viewBox: "0 0 24 24",
 	width: e,
@@ -1119,7 +1150,7 @@ var It = /* @__PURE__ */ He({
 	strokeLinecap: "round",
 	strokeLinejoin: "round",
 	"aria-hidden": !0
-}), Lt = ({ size: e = 14 }) => /* @__PURE__ */ L("svg", {
+}), Ht = ({ size: e = 14 }) => /* @__PURE__ */ I("svg", {
 	viewBox: "0 0 24 24",
 	width: e,
 	height: e,
@@ -1129,93 +1160,93 @@ var It = /* @__PURE__ */ He({
 		6,
 		12,
 		18
-	].map((e) => /* @__PURE__ */ R("g", { children: [/* @__PURE__ */ L("circle", {
+	].map((e) => /* @__PURE__ */ L("g", { children: [/* @__PURE__ */ I("circle", {
 		cx: "9",
 		cy: e,
 		r: "1.6"
-	}), /* @__PURE__ */ L("circle", {
+	}), /* @__PURE__ */ I("circle", {
 		cx: "15",
 		cy: e,
 		r: "1.6"
 	})] }, e))
-}), Rt = ({ size: e = 14 }) => /* @__PURE__ */ R("svg", {
+}), Ut = ({ size: e = 14 }) => /* @__PURE__ */ L("svg", {
 	...B(e),
-	children: [/* @__PURE__ */ L("rect", {
+	children: [/* @__PURE__ */ I("rect", {
 		x: "8",
 		y: "8",
 		width: "12",
 		height: "12",
 		rx: "2"
-	}), /* @__PURE__ */ L("path", { d: "M16 8V6a2 2 0 0 0-2-2H6a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h2" })]
-}), zt = ({ size: e = 14 }) => /* @__PURE__ */ L("svg", {
+	}), /* @__PURE__ */ I("path", { d: "M16 8V6a2 2 0 0 0-2-2H6a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h2" })]
+}), Wt = ({ size: e = 14 }) => /* @__PURE__ */ I("svg", {
 	...B(e),
-	children: /* @__PURE__ */ L("path", { d: "M4 7h16M10 11v6M14 11v6M6 7l1 12a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2l1-12M9 7V4h6v3" })
-}), Bt = ({ size: e = 14 }) => /* @__PURE__ */ L("svg", {
+	children: /* @__PURE__ */ I("path", { d: "M4 7h16M10 11v6M14 11v6M6 7l1 12a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2l1-12M9 7V4h6v3" })
+}), Gt = ({ size: e = 14 }) => /* @__PURE__ */ I("svg", {
 	...B(e),
-	children: /* @__PURE__ */ L("path", { d: "M12 19V5M6 11l6-6 6 6" })
-}), Vt = ({ size: e = 16 }) => /* @__PURE__ */ R("svg", {
+	children: /* @__PURE__ */ I("path", { d: "M12 19V5M6 11l6-6 6 6" })
+}), Kt = ({ size: e = 16 }) => /* @__PURE__ */ L("svg", {
 	...B(e),
-	children: [/* @__PURE__ */ L("path", { d: "M9 14 4 9l5-5" }), /* @__PURE__ */ L("path", { d: "M4 9h10.5a5.5 5.5 0 0 1 0 11H11" })]
-}), Ht = ({ size: e = 16 }) => /* @__PURE__ */ R("svg", {
+	children: [/* @__PURE__ */ I("path", { d: "M9 14 4 9l5-5" }), /* @__PURE__ */ I("path", { d: "M4 9h10.5a5.5 5.5 0 0 1 0 11H11" })]
+}), qt = ({ size: e = 16 }) => /* @__PURE__ */ L("svg", {
 	...B(e),
-	children: [/* @__PURE__ */ L("path", { d: "m15 14 5-5-5-5" }), /* @__PURE__ */ L("path", { d: "M20 9H9.5a5.5 5.5 0 0 0 0 11H13" })]
-}), Ut = ({ size: e = 16 }) => /* @__PURE__ */ R("svg", {
+	children: [/* @__PURE__ */ I("path", { d: "m15 14 5-5-5-5" }), /* @__PURE__ */ I("path", { d: "M20 9H9.5a5.5 5.5 0 0 0 0 11H13" })]
+}), Jt = ({ size: e = 16 }) => /* @__PURE__ */ L("svg", {
 	...B(e),
-	children: [/* @__PURE__ */ L("rect", {
+	children: [/* @__PURE__ */ I("rect", {
 		x: "3",
 		y: "4",
 		width: "18",
 		height: "12",
 		rx: "2"
-	}), /* @__PURE__ */ L("path", { d: "M8 20h8M12 16v4" })]
-}), Wt = ({ size: e = 16 }) => /* @__PURE__ */ R("svg", {
+	}), /* @__PURE__ */ I("path", { d: "M8 20h8M12 16v4" })]
+}), Yt = ({ size: e = 16 }) => /* @__PURE__ */ L("svg", {
 	...B(e),
-	children: [/* @__PURE__ */ L("rect", {
+	children: [/* @__PURE__ */ I("rect", {
 		x: "7",
 		y: "2",
 		width: "10",
 		height: "20",
 		rx: "2"
-	}), /* @__PURE__ */ L("path", { d: "M11 18h2" })]
-}), Gt = ({ size: e = 16 }) => /* @__PURE__ */ R("svg", {
+	}), /* @__PURE__ */ I("path", { d: "M11 18h2" })]
+}), Xt = ({ size: e = 16 }) => /* @__PURE__ */ L("svg", {
 	...B(e),
-	children: [/* @__PURE__ */ L("path", { d: "m12 3 9 5-9 5-9-5 9-5Z" }), /* @__PURE__ */ L("path", { d: "m3 13 9 5 9-5" })]
-}), Kt = ({ size: e = 15 }) => /* @__PURE__ */ R("svg", {
+	children: [/* @__PURE__ */ I("path", { d: "m12 3 9 5-9 5-9-5 9-5Z" }), /* @__PURE__ */ I("path", { d: "m3 13 9 5 9-5" })]
+}), Zt = ({ size: e = 15 }) => /* @__PURE__ */ L("svg", {
 	...B(e),
 	children: [
-		/* @__PURE__ */ L("path", { d: "m2 22 1-1h3l9-9" }),
-		/* @__PURE__ */ L("path", { d: "M3 21v-3l9-9" }),
-		/* @__PURE__ */ L("path", { d: "m15 6 3.4-3.4a2.1 2.1 0 1 1 3 3L18 9l.4.4a2.1 2.1 0 1 1-3 3l-3.8-3.8a2.1 2.1 0 1 1 3-3l.4.4Z" })
+		/* @__PURE__ */ I("path", { d: "m2 22 1-1h3l9-9" }),
+		/* @__PURE__ */ I("path", { d: "M3 21v-3l9-9" }),
+		/* @__PURE__ */ I("path", { d: "m15 6 3.4-3.4a2.1 2.1 0 1 1 3 3L18 9l.4.4a2.1 2.1 0 1 1-3 3l-3.8-3.8a2.1 2.1 0 1 1 3-3l.4.4Z" })
 	]
-}), qt = ({ size: e = 14 }) => /* @__PURE__ */ L("svg", {
+}), Qt = ({ size: e = 14 }) => /* @__PURE__ */ I("svg", {
 	...B(e),
-	children: /* @__PURE__ */ L("path", { d: "M4 4h16M4 20h16M12 8v8" })
-}), Jt = ({ size: e = 22 }) => /* @__PURE__ */ L("svg", {
+	children: /* @__PURE__ */ I("path", { d: "M4 4h16M4 20h16M12 8v8" })
+}), $t = ({ size: e = 22 }) => /* @__PURE__ */ I("svg", {
 	...B(e, 1.8),
-	children: /* @__PURE__ */ L("path", { d: "M4 4h16M4 20h16M12 7v10M9 9.5 12 7l3 2.5M9 14.5l3 2.5 3-2.5" })
-}), Yt = ({ size: e = 22 }) => /* @__PURE__ */ R("svg", {
+	children: /* @__PURE__ */ I("path", { d: "M4 4h16M4 20h16M12 7v10M9 9.5 12 7l3 2.5M9 14.5l3 2.5 3-2.5" })
+}), en = ({ size: e = 22 }) => /* @__PURE__ */ L("svg", {
 	...B(e, 1.8),
 	children: [
-		/* @__PURE__ */ L("circle", {
+		/* @__PURE__ */ I("circle", {
 			cx: "6",
 			cy: "12",
 			r: "2.5"
 		}),
-		/* @__PURE__ */ L("circle", {
+		/* @__PURE__ */ I("circle", {
 			cx: "18",
 			cy: "6",
 			r: "2.5"
 		}),
-		/* @__PURE__ */ L("circle", {
+		/* @__PURE__ */ I("circle", {
 			cx: "18",
 			cy: "18",
 			r: "2.5"
 		}),
-		/* @__PURE__ */ L("path", { d: "m8.2 10.8 7.6-3.6M8.2 13.2l7.6 3.6" })
+		/* @__PURE__ */ I("path", { d: "m8.2 10.8 7.6-3.6M8.2 13.2l7.6 3.6" })
 	]
-}), Xt = ({ size: e = 22 }) => /* @__PURE__ */ L("svg", {
+}), tn = ({ size: e = 22 }) => /* @__PURE__ */ I("svg", {
 	...B(e, 1.8),
-	children: /* @__PURE__ */ L("rect", {
+	children: /* @__PURE__ */ I("rect", {
 		x: "4",
 		y: "4",
 		width: "16",
@@ -1227,46 +1258,46 @@ var It = /* @__PURE__ */ He({
 //#region src/components/fields.tsx
 function V({ title: e, children: t, defaultOpen: n = !0, className: r, style: i }) {
 	let [a, o] = u(n);
-	return /* @__PURE__ */ R("section", {
-		className: z("bree-group", r),
+	return /* @__PURE__ */ L("section", {
+		className: R("bree-group", r),
 		style: i,
-		children: [/* @__PURE__ */ R("button", {
+		children: [/* @__PURE__ */ L("button", {
 			type: "button",
 			className: "bree-group-header",
 			onClick: () => o(!a),
 			"aria-expanded": a,
-			children: [/* @__PURE__ */ L("span", { children: e }), /* @__PURE__ */ L("span", {
-				className: z("bree-chevron", a && "bree-open"),
+			children: [/* @__PURE__ */ I("span", { children: e }), /* @__PURE__ */ I("span", {
+				className: R("bree-chevron", a && "bree-open"),
 				"aria-hidden": !0,
 				children: "›"
 			})]
-		}), a && /* @__PURE__ */ L("div", {
+		}), a && /* @__PURE__ */ I("div", {
 			className: "bree-group-body",
 			children: t
 		})]
 	});
 }
 function H({ label: e, children: t, stacked: n, className: r, style: i }) {
-	return /* @__PURE__ */ R("label", {
-		className: z("bree-field", n && "bree-stacked", r),
+	return /* @__PURE__ */ L("label", {
+		className: R("bree-field", n && "bree-stacked", r),
 		style: i,
-		children: [/* @__PURE__ */ L("span", {
+		children: [/* @__PURE__ */ I("span", {
 			className: "bree-field-label",
 			children: e
-		}), /* @__PURE__ */ L("span", {
+		}), /* @__PURE__ */ I("span", {
 			className: "bree-field-control",
 			children: t
 		})]
 	});
 }
-function Zt(e) {
+function nn(e) {
 	let [t, n] = u(e), [r, i] = u(e);
 	return Object.is(e, r) || (i(e), n(e)), [t, n];
 }
 function U({ value: e, onChange: t, placeholder: n, type: r = "text", className: i, style: a }) {
-	let [o, s] = Zt(e);
-	return /* @__PURE__ */ L("input", {
-		className: z("bree-input", i),
+	let [o, s] = nn(e);
+	return /* @__PURE__ */ I("input", {
+		className: R("bree-input", i),
 		style: a,
 		type: r,
 		value: o,
@@ -1278,10 +1309,10 @@ function U({ value: e, onChange: t, placeholder: n, type: r = "text", className:
 		}
 	});
 }
-function Qt({ value: e, onChange: t, rows: n = 8, className: r, style: i }) {
-	let [a, o] = Zt(e);
-	return /* @__PURE__ */ L("textarea", {
-		className: z("bree-input bree-textarea", r),
+function rn({ value: e, onChange: t, rows: n = 8, className: r, style: i }) {
+	let [a, o] = nn(e);
+	return /* @__PURE__ */ I("textarea", {
+		className: R("bree-input bree-textarea", r),
 		style: i,
 		rows: n,
 		value: a,
@@ -1290,21 +1321,21 @@ function Qt({ value: e, onChange: t, rows: n = 8, className: r, style: i }) {
 		onBlur: () => a !== e && t(a)
 	});
 }
-function $t(e) {
+function an(e) {
 	if (e == null || e === "" || e === "auto") return "";
 	let t = Number.parseFloat(String(e));
 	return Number.isFinite(t) ? t : "";
 }
 function W({ value: e, onChange: t, unit: n = "px", min: r = 0, max: i, step: a = 1, placeholder: o, className: s, style: c }) {
-	let l = $(), [u, d] = Zt(String($t(e))), f = (e) => {
+	let l = $(), [u, d] = nn(String(an(e))), f = (e) => {
 		if (e.trim() === "") return t("");
 		let n = Number.parseFloat(e);
 		Number.isFinite(n) && t(Math.max(r, i === void 0 ? n : Math.min(i, n)));
 	};
-	return /* @__PURE__ */ R("span", {
-		className: z("bree-number", s),
+	return /* @__PURE__ */ L("span", {
+		className: R("bree-number", s),
 		style: c,
-		children: [/* @__PURE__ */ L("input", {
+		children: [/* @__PURE__ */ I("input", {
 			className: "bree-input",
 			inputMode: "decimal",
 			value: u,
@@ -1314,34 +1345,34 @@ function W({ value: e, onChange: t, unit: n = "px", min: r = 0, max: i, step: a
 			onKeyDown: (e) => {
 				if (e.key === "Enter" && f(u), e.key === "ArrowUp" || e.key === "ArrowDown") {
 					e.preventDefault();
-					let t = ($t(u) || 0) + (e.key === "ArrowUp" ? a : -a) * (e.shiftKey ? 10 : 1);
+					let t = (an(u) || 0) + (e.key === "ArrowUp" ? a : -a) * (e.shiftKey ? 10 : 1);
 					d(String(t)), f(String(t));
 				}
 			}
-		}), n && /* @__PURE__ */ L("span", {
+		}), n && /* @__PURE__ */ I("span", {
 			className: "bree-unit",
 			children: n
 		})]
 	});
 }
-function en({ value: e, onChange: t, min: n, max: r, unit: i = "px", className: a, style: o }) {
-	let s = $t(e) || n;
-	return /* @__PURE__ */ R("span", {
-		className: z("bree-range", a),
+function on({ value: e, onChange: t, min: n, max: r, unit: i = "px", className: a, style: o }) {
+	let s = an(e) || n;
+	return /* @__PURE__ */ L("span", {
+		className: R("bree-range", a),
 		style: o,
-		children: [/* @__PURE__ */ L("input", {
+		children: [/* @__PURE__ */ I("input", {
 			type: "range",
 			min: n,
 			max: r,
 			value: s,
 			onChange: (e) => t(Number(e.target.value))
-		}), /* @__PURE__ */ R("span", {
+		}), /* @__PURE__ */ L("span", {
 			className: "bree-range-value",
 			children: [s, i]
 		})]
 	});
 }
-var tn = [
+var sn = [
 	"#111827",
 	"#374151",
 	"#6b7280",
@@ -1361,15 +1392,15 @@ var tn = [
 	"#ecfdf5",
 	"#fef3c7"
 ];
-function nn(e) {
+function cn(e) {
 	let t = e.trim().toLowerCase();
 	if (/^#[0-9a-f]{6}$/.test(t)) return t;
 	if (/^#[0-9a-f]{3}$/.test(t)) return `#${[...t.slice(1)].map((e) => e + e).join("")}`;
 	let n = t.match(/^rgba?\(\s*(\d+)[\s,]+(\d+)[\s,]+(\d+)/);
 	return n ? `#${n.slice(1, 4).map((e) => Number(e).toString(16).padStart(2, "0")).join("")}` : null;
 }
-function G({ value: e, onChange: t, presets: n = [], swatches: r = tn, placeholder: a, className: o, style: s, popoverClassName: c }) {
-	let d = $(), f = a ?? d.fields.colorDefault, p = typeof e == "string" ? e : "", m = nn(p), [h, g] = u(!1), [_, v] = u(m ?? "#ffffff"), y = l(t);
+function G({ value: e, onChange: t, presets: n = [], swatches: r = sn, placeholder: a, className: o, style: s, popoverClassName: c }) {
+	let d = $(), f = a ?? d.fields.colorDefault, p = typeof e == "string" ? e : "", m = cn(p), [h, g] = u(!1), [_, v] = u(m ?? "#ffffff"), y = l(t);
 	i(() => {
 		y.current = t;
 	});
@@ -1378,71 +1409,71 @@ function G({ value: e, onChange: t, presets: n = [], swatches: r = tn, placehold
 	}, C = (e) => {
 		v(e), b.current = e, x.current ||= window.setTimeout(S, 60);
 	}, w = (e) => {
-		b.current = null, window.clearTimeout(x.current), x.current = 0, v(nn(e) ?? _), y.current(e);
-	}, T = typeof window < "u" ? window.EyeDropper : void 0, E = [...new Set(n.map((e) => nn(e)).filter((e) => !!e))].slice(0, 9);
-	return /* @__PURE__ */ R(Me.Root, {
+		b.current = null, window.clearTimeout(x.current), x.current = 0, v(cn(e) ?? _), y.current(e);
+	}, T = typeof window < "u" ? window.EyeDropper : void 0, E = [...new Set(n.map((e) => cn(e)).filter((e) => !!e))].slice(0, 9);
+	return /* @__PURE__ */ L(Fe.Root, {
 		open: h,
 		onOpenChange: (e) => {
 			e ? v(m ?? "#ffffff") : S(), g(e);
 		},
-		children: [/* @__PURE__ */ R("span", {
-			className: z("bree-color-field", o),
+		children: [/* @__PURE__ */ L("span", {
+			className: R("bree-color-field", o),
 			style: s,
-			children: [/* @__PURE__ */ L(Me.Trigger, {
+			children: [/* @__PURE__ */ I(Fe.Trigger, {
 				asChild: !0,
-				children: /* @__PURE__ */ L("button", {
+				children: /* @__PURE__ */ I("button", {
 					type: "button",
-					className: z("bree-color-trigger", !m && "bree-empty"),
+					className: R("bree-color-trigger", !m && "bree-empty"),
 					style: m ? { background: m } : void 0,
 					"aria-label": d.fields.chooseColor(p || f)
 				})
-			}), /* @__PURE__ */ L(U, {
+			}), /* @__PURE__ */ I(U, {
 				value: p,
 				onChange: t,
 				placeholder: f
 			})]
-		}), /* @__PURE__ */ L(Me.Portal, { children: /* @__PURE__ */ L(M, { children: /* @__PURE__ */ R(Me.Content, {
-			className: z("bree bree-color-popover", c),
+		}), /* @__PURE__ */ I(Fe.Portal, { children: /* @__PURE__ */ I(M, { children: /* @__PURE__ */ L(Fe.Content, {
+			className: R("bree bree-color-popover", c),
 			side: "left",
 			align: "start",
 			sideOffset: 10,
 			collisionPadding: 12,
 			onOpenAutoFocus: (e) => e.preventDefault(),
 			children: [
-				/* @__PURE__ */ L(Pe, {
+				/* @__PURE__ */ I(Le, {
 					color: _,
 					onChange: C
 				}),
-				/* @__PURE__ */ R("div", {
+				/* @__PURE__ */ L("div", {
 					className: "bree-color-popover-row",
 					children: [
-						/* @__PURE__ */ L("span", {
+						/* @__PURE__ */ I("span", {
 							className: "bree-color-preview",
 							style: { background: _ }
 						}),
-						/* @__PURE__ */ R("label", {
+						/* @__PURE__ */ L("label", {
 							className: "bree-hex-field",
-							children: [/* @__PURE__ */ L("span", { children: "#" }), /* @__PURE__ */ L(Ne, {
+							children: [/* @__PURE__ */ I("span", { children: "#" }), /* @__PURE__ */ I(Ie, {
 								color: _,
 								onChange: w,
 								"aria-label": d.fields.hexCode
 							})]
 						}),
-						T && /* @__PURE__ */ L("button", {
+						T && /* @__PURE__ */ I("button", {
 							type: "button",
 							className: "bree-icon-button",
 							title: d.fields.eyedropper,
 							onClick: () => new T().open().then((e) => w(e.sRGBHex)).catch(() => {}),
-							children: /* @__PURE__ */ L(Kt, {})
+							children: /* @__PURE__ */ I(Zt, {})
 						})
 					]
 				}),
-				E.length > 0 && /* @__PURE__ */ R(I, { children: [/* @__PURE__ */ L("span", {
+				E.length > 0 && /* @__PURE__ */ L(Pe, { children: [/* @__PURE__ */ I("span", {
 					className: "bree-color-popover-title",
 					children: d.fields.documentColors
-				}), /* @__PURE__ */ L("div", {
+				}), /* @__PURE__ */ I("div", {
 					className: "bree-swatches",
-					children: E.map((e) => /* @__PURE__ */ L("button", {
+					children: E.map((e) => /* @__PURE__ */ I("button", {
 						type: "button",
 						className: "bree-swatch",
 						style: { background: e },
@@ -1450,21 +1481,21 @@ function G({ value: e, onChange: t, presets: n = [], swatches: r = tn, placehold
 						onClick: () => w(e)
 					}, e))
 				})] }),
-				/* @__PURE__ */ L("span", {
+				/* @__PURE__ */ I("span", {
 					className: "bree-color-popover-title",
 					children: d.fields.palette
 				}),
-				/* @__PURE__ */ L("div", {
+				/* @__PURE__ */ I("div", {
 					className: "bree-swatches",
-					children: r.map((e) => /* @__PURE__ */ L("button", {
+					children: r.map((e) => /* @__PURE__ */ I("button", {
 						type: "button",
-						className: z("bree-swatch", e === _ && "bree-active"),
+						className: R("bree-swatch", e === _ && "bree-active"),
 						style: { background: e },
 						title: e,
 						onClick: () => w(e)
 					}, e))
 				}),
-				/* @__PURE__ */ L("button", {
+				/* @__PURE__ */ I("button", {
 					type: "button",
 					className: "bree-color-reset",
 					onClick: () => {
@@ -1476,61 +1507,61 @@ function G({ value: e, onChange: t, presets: n = [], swatches: r = tn, placehold
 		}) }) })]
 	});
 }
-function rn({ value: e, onChange: t, options: n, className: r, style: i }) {
-	return /* @__PURE__ */ L("select", {
-		className: z("bree-input bree-select", r),
+function ln({ value: e, onChange: t, options: n, className: r, style: i }) {
+	return /* @__PURE__ */ I("select", {
+		className: R("bree-input bree-select", r),
 		style: i,
 		value: e,
 		onChange: (e) => t(e.target.value),
-		children: n.map(([e, t]) => /* @__PURE__ */ L("option", {
+		children: n.map(([e, t]) => /* @__PURE__ */ I("option", {
 			value: e,
 			children: t
 		}, e))
 	});
 }
-function an({ value: e, onChange: t, emptyLabel: n, className: r, style: i }) {
-	let a = Zn()?.fonts ?? wt, o = Et(a, e), s = e && !o ? {
+function un({ value: e, onChange: t, emptyLabel: n, className: r, style: i }) {
+	let a = nr()?.fonts ?? Dt, o = kt(a, e), s = e && !o ? {
 		label: e.split(",")[0].replace(/['"]/g, "").trim(),
 		value: e
 	} : null, c = s ? [...a, s] : a;
-	return /* @__PURE__ */ R("select", {
-		className: z("bree-input bree-select", r),
+	return /* @__PURE__ */ L("select", {
+		className: R("bree-input bree-select", r),
 		style: {
 			fontFamily: e || void 0,
 			...i
 		},
 		value: o?.value ?? e ?? "",
 		onChange: (e) => t(e.target.value),
-		children: [(n !== void 0 || !e) && /* @__PURE__ */ L("option", {
+		children: [(n !== void 0 || !e) && /* @__PURE__ */ I("option", {
 			value: "",
 			children: n ?? ""
-		}), c.map((e) => /* @__PURE__ */ L("option", {
+		}), c.map((e) => /* @__PURE__ */ I("option", {
 			value: e.value,
 			style: { fontFamily: e.value },
 			children: e.label
 		}, e.value))]
 	});
 }
-function on({ value: e, onChange: t, options: n, ariaLabel: r, className: i, style: a }) {
-	return /* @__PURE__ */ L("span", {
-		className: z("bree-segmented", i),
+function dn({ value: e, onChange: t, options: n, ariaLabel: r, className: i, style: a }) {
+	return /* @__PURE__ */ I("span", {
+		className: R("bree-segmented", i),
 		style: a,
 		role: "radiogroup",
 		"aria-label": r,
-		children: n.map((n) => /* @__PURE__ */ L("button", {
+		children: n.map((n) => /* @__PURE__ */ I("button", {
 			type: "button",
 			role: "radio",
 			"aria-checked": e === n.value,
 			title: n.title,
-			className: z(e === n.value && "bree-active"),
+			className: R(e === n.value && "bree-active"),
 			onClick: () => t(n.value),
 			children: n.label
 		}, n.value))
 	});
 }
-function sn({ value: e, onChange: t, className: n, style: r }) {
+function fn({ value: e, onChange: t, className: n, style: r }) {
 	let i = $();
-	return /* @__PURE__ */ L(on, {
+	return /* @__PURE__ */ I(dn, {
 		className: n,
 		style: r,
 		value: e || "left",
@@ -1538,52 +1569,52 @@ function sn({ value: e, onChange: t, className: n, style: r }) {
 		options: [
 			{
 				value: "left",
-				label: /* @__PURE__ */ L(oe, { size: 14 }),
+				label: /* @__PURE__ */ I(se, { size: 14 }),
 				title: i.fields.alignLeft
 			},
 			{
 				value: "center",
-				label: /* @__PURE__ */ L(ae, { size: 14 }),
+				label: /* @__PURE__ */ I(oe, { size: 14 }),
 				title: i.fields.alignCenter
 			},
 			{
 				value: "right",
-				label: /* @__PURE__ */ L(se, { size: 14 }),
+				label: /* @__PURE__ */ I(ce, { size: 14 }),
 				title: i.fields.alignRight
 			}
 		]
 	});
 }
-function cn({ get: e, set: t, className: n, style: r }) {
+function pn({ get: e, set: t, className: n, style: r }) {
 	let i = $(), a = [
 		"Top",
 		"Right",
 		"Bottom",
 		"Left"
-	], o = a.map((t) => $t(e(t))), s = o.every((e) => e === o[0]), [c, l] = u(!s), d = {
+	], o = a.map((t) => an(e(t))), s = o.every((e) => e === o[0]), [c, l] = u(!s), d = {
 		Top: i.fields.top,
 		Right: i.fields.right,
 		Bottom: i.fields.bottom,
 		Left: i.fields.left
 	};
-	return /* @__PURE__ */ R("div", {
-		className: z("bree-padding", n),
+	return /* @__PURE__ */ L("div", {
+		className: R("bree-padding", n),
 		style: r,
-		children: [c ? /* @__PURE__ */ L("div", {
+		children: [c ? /* @__PURE__ */ I("div", {
 			className: "bree-padding-grid",
-			children: a.map((e, n) => /* @__PURE__ */ R("label", {
+			children: a.map((e, n) => /* @__PURE__ */ L("label", {
 				className: "bree-padding-side",
-				children: [/* @__PURE__ */ L("span", { children: d[e] }), /* @__PURE__ */ L(W, {
+				children: [/* @__PURE__ */ I("span", { children: d[e] }), /* @__PURE__ */ I(W, {
 					value: o[n],
 					onChange: (n) => t([[e, n]])
 				})]
 			}, e))
-		}) : /* @__PURE__ */ L(W, {
+		}) : /* @__PURE__ */ I(W, {
 			value: o[0],
 			onChange: (e) => t(a.map((t) => [t, e]))
-		}), /* @__PURE__ */ R("label", {
+		}), /* @__PURE__ */ L("label", {
 			className: "bree-checkbox",
-			children: [/* @__PURE__ */ L("input", {
+			children: [/* @__PURE__ */ I("input", {
 				type: "checkbox",
 				checked: c,
 				onChange: (e) => l(e.target.checked)
@@ -1594,42 +1625,42 @@ function cn({ get: e, set: t, className: n, style: r }) {
 //#endregion
 //#region src/components/inspectors/groups.tsx
 var K = (e) => e;
-function ln({ ctx: e, alignment: t, setAlignment: n, className: r, style: i }) {
+function mn({ ctx: e, alignment: t, setAlignment: n, className: r, style: i }) {
 	let a = $().inspector;
-	return /* @__PURE__ */ R(V, {
+	return /* @__PURE__ */ L(V, {
 		title: a.typography,
 		className: r,
 		style: i,
 		children: [
-			/* @__PURE__ */ L(H, {
+			/* @__PURE__ */ I(H, {
 				label: a.font,
-				children: /* @__PURE__ */ L(an, {
+				children: /* @__PURE__ */ I(un, {
 					value: e.getStyle(K("fontFamily")),
 					emptyLabel: a.fontDefault,
 					onChange: (t) => e.setStyle(K("fontFamily"), t)
 				})
 			}),
-			/* @__PURE__ */ L(H, {
+			/* @__PURE__ */ I(H, {
 				label: a.color,
 				stacked: !0,
-				children: /* @__PURE__ */ L(G, {
+				children: /* @__PURE__ */ I(G, {
 					value: e.getStyle(K("color")),
 					presets: e.presetColors,
 					onChange: (t) => e.setStyle(K("color"), t)
 				})
 			}),
-			/* @__PURE__ */ L(H, {
+			/* @__PURE__ */ I(H, {
 				label: a.size,
-				children: /* @__PURE__ */ L(W, {
+				children: /* @__PURE__ */ I(W, {
 					value: e.getStyle(K("fontSize")),
 					onChange: (t) => e.setStyle(K("fontSize"), t),
 					min: 8,
 					max: 96
 				})
 			}),
-			/* @__PURE__ */ L(H, {
+			/* @__PURE__ */ I(H, {
 				label: a.weight,
-				children: /* @__PURE__ */ L(rn, {
+				children: /* @__PURE__ */ I(ln, {
 					value: String(e.getStyle(K("fontWeight")) ?? "400"),
 					onChange: (t) => e.setStyle(K("fontWeight"), t),
 					options: [
@@ -1641,9 +1672,9 @@ function ln({ ctx: e, alignment: t, setAlignment: n, className: r, style: i }) {
 					]
 				})
 			}),
-			/* @__PURE__ */ L(H, {
+			/* @__PURE__ */ I(H, {
 				label: a.lineHeight,
-				children: /* @__PURE__ */ L(W, {
+				children: /* @__PURE__ */ I(W, {
 					value: e.getStyle(K("lineHeight")),
 					unit: "%",
 					onChange: (t) => e.setStyle(K("lineHeight"), t),
@@ -1652,9 +1683,9 @@ function ln({ ctx: e, alignment: t, setAlignment: n, className: r, style: i }) {
 					step: 5
 				})
 			}),
-			n && /* @__PURE__ */ L(H, {
+			n && /* @__PURE__ */ I(H, {
 				label: a.alignment,
-				children: /* @__PURE__ */ L(sn, {
+				children: /* @__PURE__ */ I(fn, {
 					value: t ?? "left",
 					onChange: n
 				})
@@ -1664,14 +1695,14 @@ function ln({ ctx: e, alignment: t, setAlignment: n, className: r, style: i }) {
 }
 function q({ ctx: e, title: t, className: n, style: r }) {
 	let i = $();
-	return /* @__PURE__ */ L(V, {
+	return /* @__PURE__ */ I(V, {
 		title: t ?? i.inspector.spacing,
 		className: n,
 		style: r,
-		children: /* @__PURE__ */ L(H, {
+		children: /* @__PURE__ */ I(H, {
 			label: i.inspector.padding,
 			stacked: !0,
-			children: /* @__PURE__ */ L(cn, {
+			children: /* @__PURE__ */ I(pn, {
 				get: (t) => e.getStyle(K(`padding${t}`)) ?? e.getStyle(K("padding")),
 				set: (t) => e.batchSetStyle([{
 					prop: K("padding"),
@@ -1684,32 +1715,32 @@ function q({ ctx: e, title: t, className: n, style: r }) {
 		})
 	});
 }
-function un({ ctx: e, className: t, style: n }) {
+function hn({ ctx: e, className: t, style: n }) {
 	let r = $().inspector;
-	return /* @__PURE__ */ R(V, {
+	return /* @__PURE__ */ L(V, {
 		title: r.box,
 		className: t,
 		style: n,
 		children: [
-			/* @__PURE__ */ L(H, {
+			/* @__PURE__ */ I(H, {
 				label: r.backgroundColor,
 				stacked: !0,
-				children: /* @__PURE__ */ L(G, {
+				children: /* @__PURE__ */ I(G, {
 					value: e.getStyle(K("backgroundColor")),
 					presets: e.presetColors,
 					onChange: (t) => e.setStyle(K("backgroundColor"), t)
 				})
 			}),
-			/* @__PURE__ */ L(H, {
+			/* @__PURE__ */ I(H, {
 				label: r.radius,
-				children: /* @__PURE__ */ L(W, {
+				children: /* @__PURE__ */ I(W, {
 					value: e.getStyle(K("borderRadius")),
 					onChange: (t) => e.setStyle(K("borderRadius"), t)
 				})
 			}),
-			/* @__PURE__ */ L(H, {
+			/* @__PURE__ */ I(H, {
 				label: r.border,
-				children: /* @__PURE__ */ L(W, {
+				children: /* @__PURE__ */ I(W, {
 					value: e.getStyle(K("borderWidth")),
 					onChange: (t) => e.batchSetStyle([{
 						prop: K("borderWidth"),
@@ -1720,10 +1751,10 @@ function un({ ctx: e, className: t, style: n }) {
 					}])
 				})
 			}),
-			/* @__PURE__ */ L(H, {
+			/* @__PURE__ */ I(H, {
 				label: r.borderColor,
 				stacked: !0,
-				children: /* @__PURE__ */ L(G, {
+				children: /* @__PURE__ */ I(G, {
 					value: e.getStyle(K("borderColor")),
 					presets: e.presetColors,
 					onChange: (t) => e.setStyle(K("borderColor"), t)
@@ -1734,71 +1765,71 @@ function un({ ctx: e, className: t, style: n }) {
 }
 //#endregion
 //#region src/components/inspectors/ButtonInspector.tsx
-function dn({ ctx: e, className: t, style: n }) {
+function gn({ ctx: e, className: t, style: n }) {
 	let r = $().inspector;
-	return /* @__PURE__ */ R("div", {
-		className: z("bree-inspector", t),
+	return /* @__PURE__ */ L("div", {
+		className: R("bree-inspector", t),
 		style: n,
 		children: [
-			/* @__PURE__ */ L(V, {
+			/* @__PURE__ */ I(V, {
 				title: r.action,
-				children: /* @__PURE__ */ L(H, {
+				children: /* @__PURE__ */ I(H, {
 					label: r.linkUrl,
 					stacked: !0,
-					children: /* @__PURE__ */ L(U, {
+					children: /* @__PURE__ */ I(U, {
 						value: String(e.getAttr("href") ?? ""),
 						onChange: (t) => e.setAttr("href", t),
 						placeholder: "https://"
 					})
 				})
 			}),
-			/* @__PURE__ */ R(V, {
+			/* @__PURE__ */ L(V, {
 				title: r.button,
 				children: [
-					/* @__PURE__ */ L(H, {
+					/* @__PURE__ */ I(H, {
 						label: r.alignment,
-						children: /* @__PURE__ */ L(sn, {
+						children: /* @__PURE__ */ I(fn, {
 							value: String(e.getAttr("alignment") ?? "left"),
 							onChange: (t) => e.setAttr("alignment", t)
 						})
 					}),
-					/* @__PURE__ */ L(H, {
+					/* @__PURE__ */ I(H, {
 						label: r.backgroundColor,
 						stacked: !0,
-						children: /* @__PURE__ */ L(G, {
+						children: /* @__PURE__ */ I(G, {
 							value: e.getStyle(K("backgroundColor")),
 							presets: e.presetColors,
 							onChange: (t) => e.setStyle(K("backgroundColor"), t)
 						})
 					}),
-					/* @__PURE__ */ L(H, {
+					/* @__PURE__ */ I(H, {
 						label: r.textColor,
 						stacked: !0,
-						children: /* @__PURE__ */ L(G, {
+						children: /* @__PURE__ */ I(G, {
 							value: e.getStyle(K("color")),
 							presets: e.presetColors,
 							onChange: (t) => e.setStyle(K("color"), t)
 						})
 					}),
-					/* @__PURE__ */ L(H, {
+					/* @__PURE__ */ I(H, {
 						label: r.textSize,
-						children: /* @__PURE__ */ L(W, {
+						children: /* @__PURE__ */ I(W, {
 							value: e.getStyle(K("fontSize")),
 							onChange: (t) => e.setStyle(K("fontSize"), t),
 							min: 8,
 							max: 48
 						})
 					}),
-					/* @__PURE__ */ L(H, {
+					/* @__PURE__ */ I(H, {
 						label: r.radius,
-						children: /* @__PURE__ */ L(W, {
+						children: /* @__PURE__ */ I(W, {
 							value: e.getStyle(K("borderRadius")),
 							onChange: (t) => e.setStyle(K("borderRadius"), t)
 						})
 					})
 				]
 			}),
-			/* @__PURE__ */ L(q, {
+			/* @__PURE__ */ I(q, {
 				ctx: e,
 				title: r.buttonPadding
 			})
@@ -1807,7 +1838,7 @@ function dn({ ctx: e, className: t, style: n }) {
 }
 //#endregion
 //#region src/components/inspectors/ColumnsInspector.tsx
-function fn({ ctx: e, className: t, style: n }) {
+function _n({ ctx: e, className: t, style: n }) {
 	let { editor: r, t: i } = Q(), a = i.inspector, o = {
 		twoColumns: 2,
 		threeColumns: 3,
@@ -1842,36 +1873,36 @@ function fn({ ctx: e, className: t, style: n }) {
 			});
 		}), n.selection instanceof D && a.setSelection(D.create(a.doc, e.nodePos.pos)), r.view.dispatch(a);
 	};
-	return /* @__PURE__ */ L("div", {
-		className: z("bree-inspector", t),
+	return /* @__PURE__ */ I("div", {
+		className: R("bree-inspector", t),
 		style: n,
-		children: /* @__PURE__ */ R(V, {
+		children: /* @__PURE__ */ L(V, {
 			title: a.columns,
 			children: [
-				/* @__PURE__ */ L(H, {
+				/* @__PURE__ */ I(H, {
 					label: a.distribution,
 					stacked: !0,
-					children: /* @__PURE__ */ L("div", {
+					children: /* @__PURE__ */ I("div", {
 						className: "bree-ratio-grid",
-						children: s.map(([e, t]) => /* @__PURE__ */ R("button", {
+						children: s.map(([e, t]) => /* @__PURE__ */ L("button", {
 							type: "button",
 							className: "bree-ratio",
 							onClick: () => c(t),
-							children: [/* @__PURE__ */ L("span", {
+							children: [/* @__PURE__ */ I("span", {
 								className: "bree-ratio-bars",
-								children: t.map((e, t) => /* @__PURE__ */ L("i", { style: { flex: e } }, t))
+								children: t.map((e, t) => /* @__PURE__ */ I("i", { style: { flex: e } }, t))
 							}), e]
 						}, e))
 					})
 				}),
-				/* @__PURE__ */ L(H, {
+				/* @__PURE__ */ I(H, {
 					label: a.columnGap,
-					children: /* @__PURE__ */ L(W, {
+					children: /* @__PURE__ */ I(W, {
 						value: e.getAttr("cellspacing") ?? 0,
 						onChange: (t) => e.setAttr("cellspacing", t === "" ? null : t)
 					})
 				}),
-				/* @__PURE__ */ L("p", {
+				/* @__PURE__ */ I("p", {
 					className: "bree-hint",
 					children: a.columnsHint
 				})
@@ -1881,17 +1912,17 @@ function fn({ ctx: e, className: t, style: n }) {
 }
 //#endregion
 //#region src/components/inspectors/HeadingInspector.tsx
-function pn({ ctx: e, className: t, style: n }) {
+function vn({ ctx: e, className: t, style: n }) {
 	let r = $();
-	return /* @__PURE__ */ R("div", {
-		className: z("bree-inspector", t),
+	return /* @__PURE__ */ L("div", {
+		className: R("bree-inspector", t),
 		style: n,
 		children: [
-			/* @__PURE__ */ L(V, {
+			/* @__PURE__ */ I(V, {
 				title: r.inspector.heading,
-				children: /* @__PURE__ */ L(H, {
+				children: /* @__PURE__ */ I(H, {
 					label: r.inspector.level,
-					children: /* @__PURE__ */ L(on, {
+					children: /* @__PURE__ */ I(dn, {
 						value: String(e.getAttr("level") ?? 1),
 						onChange: (t) => e.setAttr("level", Number(t)),
 						options: [
@@ -1911,37 +1942,37 @@ function pn({ ctx: e, className: t, style: n }) {
 					})
 				})
 			}),
-			/* @__PURE__ */ L(ln, {
+			/* @__PURE__ */ I(mn, {
 				ctx: e,
 				alignment: String(e.getAttr("alignment") ?? "left"),
 				setAlignment: (t) => e.setAttr("alignment", t)
 			}),
-			/* @__PURE__ */ L(q, { ctx: e }),
-			/* @__PURE__ */ L(un, { ctx: e })
+			/* @__PURE__ */ I(q, { ctx: e }),
+			/* @__PURE__ */ I(hn, { ctx: e })
 		]
 	});
 }
 //#endregion
 //#region src/components/inspectors/ImageInspector.tsx
-function mn({ ctx: e, className: t, style: n }) {
+function yn({ ctx: e, className: t, style: n }) {
 	let { t: r, uploadImage: i } = Q(), a = r.inspector, o = String(e.getAttr("width") ?? "auto");
-	return /* @__PURE__ */ R("div", {
-		className: z("bree-inspector", t),
+	return /* @__PURE__ */ L("div", {
+		className: R("bree-inspector", t),
 		style: n,
 		children: [
-			/* @__PURE__ */ R(V, {
+			/* @__PURE__ */ L(V, {
 				title: a.image,
 				children: [
-					/* @__PURE__ */ L("div", {
+					/* @__PURE__ */ I("div", {
 						className: "bree-image-preview",
-						children: e.getAttr("src") ? /* @__PURE__ */ L("img", {
+						children: e.getAttr("src") ? /* @__PURE__ */ I("img", {
 							src: String(e.getAttr("src")),
 							alt: ""
 						}) : null
 					}),
-					/* @__PURE__ */ R("label", {
+					/* @__PURE__ */ L("label", {
 						className: "bree-button-like",
-						children: [a.uploadImage, /* @__PURE__ */ L("input", {
+						children: [a.uploadImage, /* @__PURE__ */ I("input", {
 							type: "file",
 							accept: "image/*",
 							hidden: !0,
@@ -1951,18 +1982,18 @@ function mn({ ctx: e, className: t, style: n }) {
 							}
 						})]
 					}),
-					/* @__PURE__ */ L(H, {
+					/* @__PURE__ */ I(H, {
 						label: a.imageUrl,
 						stacked: !0,
-						children: /* @__PURE__ */ L(U, {
+						children: /* @__PURE__ */ I(U, {
 							value: String(e.getAttr("src") ?? ""),
 							onChange: (t) => e.setAttr("src", t)
 						})
 					}),
-					/* @__PURE__ */ L(H, {
+					/* @__PURE__ */ I(H, {
 						label: a.altText,
 						stacked: !0,
-						children: /* @__PURE__ */ L(U, {
+						children: /* @__PURE__ */ I(U, {
 							value: String(e.getAttr("alt") ?? ""),
 							onChange: (t) => e.setAttr("alt", t),
 							placeholder: a.altPlaceholder
@@ -1970,70 +2001,70 @@ function mn({ ctx: e, className: t, style: n }) {
 					})
 				]
 			}),
-			/* @__PURE__ */ R(V, {
+			/* @__PURE__ */ L(V, {
 				title: a.layout,
 				children: [
-					/* @__PURE__ */ L(H, {
+					/* @__PURE__ */ I(H, {
 						label: a.autoWidth,
-						children: /* @__PURE__ */ L("input", {
+						children: /* @__PURE__ */ I("input", {
 							type: "checkbox",
 							checked: o === "auto",
 							onChange: (t) => e.setAttr("width", t.target.checked ? "auto" : "300")
 						})
 					}),
-					o !== "auto" && /* @__PURE__ */ L(H, {
+					o !== "auto" && /* @__PURE__ */ I(H, {
 						label: a.width,
-						children: /* @__PURE__ */ L(en, {
+						children: /* @__PURE__ */ I(on, {
 							value: o,
 							min: 20,
 							max: 900,
 							onChange: (t) => e.setAttr("width", String(t))
 						})
 					}),
-					/* @__PURE__ */ L(H, {
+					/* @__PURE__ */ I(H, {
 						label: a.alignment,
-						children: /* @__PURE__ */ L(sn, {
+						children: /* @__PURE__ */ I(fn, {
 							value: String(e.getAttr("alignment") ?? "center"),
 							onChange: (t) => e.setAttr("alignment", t)
 						})
 					}),
-					/* @__PURE__ */ L(H, {
+					/* @__PURE__ */ I(H, {
 						label: a.radius,
-						children: /* @__PURE__ */ L(W, {
+						children: /* @__PURE__ */ I(W, {
 							value: e.getStyle(K("borderRadius")),
 							onChange: (t) => e.setStyle(K("borderRadius"), t)
 						})
 					})
 				]
 			}),
-			/* @__PURE__ */ L(V, {
+			/* @__PURE__ */ I(V, {
 				title: a.action,
-				children: /* @__PURE__ */ L(H, {
+				children: /* @__PURE__ */ I(H, {
 					label: a.clickLink,
 					stacked: !0,
-					children: /* @__PURE__ */ L(U, {
+					children: /* @__PURE__ */ I(U, {
 						value: String(e.getAttr("href") ?? ""),
 						onChange: (t) => e.setAttr("href", t || null),
 						placeholder: "https://"
 					})
 				})
 			}),
-			/* @__PURE__ */ L(q, { ctx: e })
+			/* @__PURE__ */ I(q, { ctx: e })
 		]
 	});
 }
 //#endregion
 //#region src/components/inspectors/SimpleInspectors.tsx
-function hn({ ctx: e, className: t, style: n }) {
+function bn({ ctx: e, className: t, style: n }) {
 	let r = $();
-	return /* @__PURE__ */ L("div", {
-		className: z("bree-inspector", t),
+	return /* @__PURE__ */ I("div", {
+		className: R("bree-inspector", t),
 		style: n,
-		children: /* @__PURE__ */ L(V, {
+		children: /* @__PURE__ */ I(V, {
 			title: r.inspector.spacer,
-			children: /* @__PURE__ */ L(H, {
+			children: /* @__PURE__ */ I(H, {
 				label: r.inspector.height,
-				children: /* @__PURE__ */ L(en, {
+				children: /* @__PURE__ */ I(on, {
 					value: e.getAttr("height"),
 					min: 4,
 					max: 160,
@@ -2043,44 +2074,44 @@ function hn({ ctx: e, className: t, style: n }) {
 		})
 	});
 }
-function gn({ ctx: e, className: t, style: n }) {
+function xn({ ctx: e, className: t, style: n }) {
 	let r = $();
-	return /* @__PURE__ */ L("div", {
-		className: z("bree-inspector", t),
+	return /* @__PURE__ */ I("div", {
+		className: R("bree-inspector", t),
 		style: n,
-		children: /* @__PURE__ */ R(V, {
+		children: /* @__PURE__ */ L(V, {
 			title: r.inspector.htmlCode,
-			children: [/* @__PURE__ */ L(Qt, {
+			children: [/* @__PURE__ */ I(rn, {
 				value: String(e.getAttr("html") ?? ""),
 				onChange: (t) => e.setAttr("html", t),
 				rows: 14
-			}), /* @__PURE__ */ L("p", {
+			}), /* @__PURE__ */ I("p", {
 				className: "bree-hint",
 				children: r.inspector.htmlHint
 			})]
 		})
 	});
 }
-function _n({ ctx: e, className: t, style: n }) {
+function Sn({ ctx: e, className: t, style: n }) {
 	let r = $().inspector;
-	return /* @__PURE__ */ L("div", {
-		className: z("bree-inspector", t),
+	return /* @__PURE__ */ I("div", {
+		className: R("bree-inspector", t),
 		style: n,
-		children: /* @__PURE__ */ R(V, {
+		children: /* @__PURE__ */ L(V, {
 			title: r.line,
 			children: [
-				/* @__PURE__ */ L(H, {
+				/* @__PURE__ */ I(H, {
 					label: r.color,
 					stacked: !0,
-					children: /* @__PURE__ */ L(G, {
+					children: /* @__PURE__ */ I(G, {
 						value: e.getStyle(K("borderTopColor")),
 						presets: e.presetColors,
 						onChange: (t) => e.setStyle(K("borderTopColor"), t)
 					})
 				}),
-				/* @__PURE__ */ L(H, {
+				/* @__PURE__ */ I(H, {
 					label: r.thickness,
-					children: /* @__PURE__ */ L(W, {
+					children: /* @__PURE__ */ I(W, {
 						value: e.getStyle(K("borderTopWidth")) ?? 1,
 						onChange: (t) => e.batchSetStyle([{
 							prop: K("borderTopWidth"),
@@ -2093,9 +2124,9 @@ function _n({ ctx: e, className: t, style: n }) {
 						max: 12
 					})
 				}),
-				/* @__PURE__ */ L(H, {
+				/* @__PURE__ */ I(H, {
 					label: r.lineStyle,
-					children: /* @__PURE__ */ L(on, {
+					children: /* @__PURE__ */ I(dn, {
 						value: String(e.getStyle(K("borderTopStyle")) ?? "solid"),
 						onChange: (t) => e.setStyle(K("borderTopStyle"), t),
 						options: [
@@ -2118,16 +2149,16 @@ function _n({ ctx: e, className: t, style: n }) {
 		})
 	});
 }
-function vn({ ctx: e, className: t, style: n }) {
-	return /* @__PURE__ */ R("div", {
-		className: z("bree-inspector", t),
+function Cn({ ctx: e, className: t, style: n }) {
+	return /* @__PURE__ */ L("div", {
+		className: R("bree-inspector", t),
 		style: n,
-		children: [/* @__PURE__ */ L(un, { ctx: e }), /* @__PURE__ */ L(q, { ctx: e })]
+		children: [/* @__PURE__ */ I(hn, { ctx: e }), /* @__PURE__ */ I(q, { ctx: e })]
 	});
 }
 //#endregion
 //#region src/core/style-utils.ts
-function yn(e) {
+function wn(e) {
 	if (typeof e != "string" || !e.trim()) return {};
 	let t = {};
 	for (let n of e.split(";")) {
@@ -2140,18 +2171,18 @@ function yn(e) {
 }
 //#endregion
 //#region src/nodes/custom-nodes.tsx
-var bn = { style: {
+var Tn = { style: {
 	default: null,
 	parseHTML: (e) => e.getAttribute("style"),
 	renderHTML: (e) => e.style ? { style: e.style } : {}
-} }, xn = _.create({
+} }, En = _.create({
 	name: "spacer",
 	group: "block",
 	atom: !0,
 	selectable: !0,
 	addAttributes() {
 		return {
-			...bn,
+			...Tn,
 			height: {
 				default: 32,
 				parseHTML: (e) => Number(e.dataset.height) || 32,
@@ -2163,7 +2194,7 @@ var bn = { style: {
 		return [{ tag: "div[data-type=\"spacer\"]" }];
 	},
 	renderHTML({ node: e, HTMLAttributes: t }) {
-		return ["div", re(t, {
+		return ["div", ne(t, {
 			"data-type": "spacer",
 			class: "node-spacer",
 			style: `height:${Number(e.attrs.height)}px`
@@ -2171,17 +2202,17 @@ var bn = { style: {
 	},
 	renderToReactEmail({ node: e }) {
 		let t = Number(e.attrs?.height ?? 32);
-		return /* @__PURE__ */ L(ze, {
+		return /* @__PURE__ */ I(He, {
 			style: {
 				height: t,
 				lineHeight: `${t}px`,
 				fontSize: "1px",
-				...yn(e.attrs?.style)
+				...wn(e.attrs?.style)
 			},
 			children: "\xA0"
 		});
 	}
-}), Sn = {
+}), Dn = {
 	facebook: {
 		label: "Facebook",
 		slug: "facebook",
@@ -2217,13 +2248,13 @@ var bn = { style: {
 		slug: "github",
 		color: "181717"
 	}
-}, Cn = { linkedin: "https://cdn.jsdelivr.net/npm/simple-icons@9.21.0/icons/linkedin.svg" };
-function wn(e) {
-	if (Cn[e]) return Cn[e];
-	let t = Sn[e] ?? Sn.facebook;
+}, On = { linkedin: "https://cdn.jsdelivr.net/npm/simple-icons@9.21.0/icons/linkedin.svg" };
+function kn(e) {
+	if (On[e]) return On[e];
+	let t = Dn[e] ?? Dn.facebook;
 	return `https://cdn.simpleicons.org/${t.slug}/${t.color}`;
 }
-function Tn(e) {
+function An(e) {
 	if (Array.isArray(e)) return e;
 	if (typeof e == "string") try {
 		return JSON.parse(e);
@@ -2232,14 +2263,14 @@ function Tn(e) {
 	}
 	return [];
 }
-var En = _.create({
+var jn = _.create({
 	name: "socialLinks",
 	group: "block",
 	atom: !0,
 	selectable: !0,
 	addAttributes() {
 		return {
-			...bn,
+			...Tn,
 			links: {
 				default: [
 					{
@@ -2259,7 +2290,7 @@ var En = _.create({
 						url: "https://linkedin.com/"
 					}
 				],
-				parseHTML: (e) => Tn(e.dataset.links),
+				parseHTML: (e) => An(e.dataset.links),
 				renderHTML: (e) => ({ "data-links": JSON.stringify(e.links ?? []) })
 			},
 			size: { default: 28 },
@@ -2271,10 +2302,10 @@ var En = _.create({
 		return [{ tag: "div[data-type=\"social-links\"]" }];
 	},
 	renderHTML({ node: e, HTMLAttributes: t }) {
-		let n = Number(e.attrs.size), r = Number(e.attrs.gap), i = Tn(e.attrs.links);
+		let n = Number(e.attrs.size), r = Number(e.attrs.gap), i = An(e.attrs.links);
 		return [
 			"div",
-			re(t, {
+			ne(t, {
 				"data-type": "social-links",
 				class: "node-socialLinks",
 				alignment: e.attrs.alignment
@@ -2286,37 +2317,37 @@ var En = _.create({
 					style: `margin-left:${t === 0 ? 0 : r}px`
 				},
 				["img", {
-					src: wn(e.network),
+					src: kn(e.network),
 					width: String(n),
 					height: String(n),
-					alt: Sn[e.network]?.label ?? e.network
+					alt: Dn[e.network]?.label ?? e.network
 				}]
 			])
 		];
 	},
 	renderToReactEmail({ node: e }) {
-		let t = Number(e.attrs?.size ?? 28), n = Number(e.attrs?.gap ?? 12), r = Tn(e.attrs?.links), i = e.attrs?.alignment ?? "center";
-		return /* @__PURE__ */ L(ze, {
-			style: yn(e.attrs?.style),
-			children: /* @__PURE__ */ L(Re, { children: /* @__PURE__ */ L(Fe, {
+		let t = Number(e.attrs?.size ?? 28), n = Number(e.attrs?.gap ?? 12), r = An(e.attrs?.links), i = e.attrs?.alignment ?? "center";
+		return /* @__PURE__ */ I(He, {
+			style: wn(e.attrs?.style),
+			children: /* @__PURE__ */ I(Ve, { children: /* @__PURE__ */ I(Re, {
 				align: i,
-				children: r.map((e, r) => /* @__PURE__ */ L(Le, {
+				children: r.map((e, r) => /* @__PURE__ */ I(Be, {
 					href: e.url,
 					style: {
 						display: "inline-block",
 						marginLeft: r === 0 ? 0 : n
 					},
-					children: /* @__PURE__ */ L(Ie, {
-						src: wn(e.network),
+					children: /* @__PURE__ */ I(ze, {
+						src: kn(e.network),
 						width: t,
 						height: t,
-						alt: Sn[e.network]?.label ?? e.network
+						alt: Dn[e.network]?.label ?? e.network
 					})
 				}, `${e.network}-${r}`))
 			}) })
 		});
 	}
-}), Dn = _.create({
+}), Mn = _.create({
 	name: "htmlBlock",
 	group: "block",
 	atom: !0,
@@ -2332,7 +2363,7 @@ var En = _.create({
 		return [{ tag: "div[data-type=\"html-block\"]" }];
 	},
 	renderHTML({ node: e, HTMLAttributes: t }) {
-		return ["div", re(t, {
+		return ["div", ne(t, {
 			"data-type": "html-block",
 			class: "node-htmlBlock",
 			"data-html": e.attrs.html
@@ -2351,49 +2382,49 @@ var En = _.create({
 		};
 	},
 	renderToReactEmail({ node: e }) {
-		return /* @__PURE__ */ L("div", { dangerouslySetInnerHTML: { __html: e.attrs?.html ?? "" } });
+		return /* @__PURE__ */ I("div", { dangerouslySetInnerHTML: { __html: e.attrs?.html ?? "" } });
 	}
 });
 //#endregion
 //#region src/components/inspectors/SocialLinksInspector.tsx
-function On({ ctx: e, className: t, style: n }) {
+function Nn({ ctx: e, className: t, style: n }) {
 	let r = $().inspector, i = e.getAttr("links"), a = Array.isArray(i) ? i : [], o = (t) => e.setAttr("links", t);
-	return /* @__PURE__ */ R("div", {
-		className: z("bree-inspector", t),
+	return /* @__PURE__ */ L("div", {
+		className: R("bree-inspector", t),
 		style: n,
 		children: [
-			/* @__PURE__ */ R(V, {
+			/* @__PURE__ */ L(V, {
 				title: r.networks,
-				children: [/* @__PURE__ */ L("div", {
+				children: [/* @__PURE__ */ I("div", {
 					className: "bree-social-list",
-					children: a.map((e, t) => /* @__PURE__ */ R("div", {
+					children: a.map((e, t) => /* @__PURE__ */ L("div", {
 						className: "bree-social-row",
 						children: [
-							/* @__PURE__ */ L(rn, {
+							/* @__PURE__ */ I(ln, {
 								value: e.network,
 								onChange: (e) => o(a.map((n, r) => r === t ? {
 									...n,
 									network: e
 								} : n)),
-								options: Object.entries(Sn).map(([e, t]) => [e, t.label])
+								options: Object.entries(Dn).map(([e, t]) => [e, t.label])
 							}),
-							/* @__PURE__ */ L(U, {
+							/* @__PURE__ */ I(U, {
 								value: e.url,
 								onChange: (e) => o(a.map((n, r) => r === t ? {
 									...n,
 									url: e
 								} : n))
 							}),
-							/* @__PURE__ */ L("button", {
+							/* @__PURE__ */ I("button", {
 								type: "button",
 								className: "bree-icon-button",
 								title: r.removeNetwork,
 								onClick: () => o(a.filter((e, n) => n !== t)),
-								children: /* @__PURE__ */ L(Ae, { size: 14 })
+								children: /* @__PURE__ */ I(Me, { size: 14 })
 							})
 						]
 					}, t))
-				}), /* @__PURE__ */ L("button", {
+				}), /* @__PURE__ */ I("button", {
 					type: "button",
 					className: "bree-button-like",
 					onClick: () => o([...a, {
@@ -2403,68 +2434,68 @@ function On({ ctx: e, className: t, style: n }) {
 					children: r.addNetwork
 				})]
 			}),
-			/* @__PURE__ */ R(V, {
+			/* @__PURE__ */ L(V, {
 				title: r.appearance,
 				children: [
-					/* @__PURE__ */ L(H, {
+					/* @__PURE__ */ I(H, {
 						label: r.iconSize,
-						children: /* @__PURE__ */ L(en, {
+						children: /* @__PURE__ */ I(on, {
 							value: e.getAttr("size"),
 							min: 16,
 							max: 64,
 							onChange: (t) => e.setAttr("size", t)
 						})
 					}),
-					/* @__PURE__ */ L(H, {
+					/* @__PURE__ */ I(H, {
 						label: r.gap,
-						children: /* @__PURE__ */ L(en, {
+						children: /* @__PURE__ */ I(on, {
 							value: e.getAttr("gap"),
 							min: 0,
 							max: 40,
 							onChange: (t) => e.setAttr("gap", t)
 						})
 					}),
-					/* @__PURE__ */ L(H, {
+					/* @__PURE__ */ I(H, {
 						label: r.alignment,
-						children: /* @__PURE__ */ L(sn, {
+						children: /* @__PURE__ */ I(fn, {
 							value: String(e.getAttr("alignment") ?? "center"),
 							onChange: (t) => e.setAttr("alignment", t)
 						})
 					})
 				]
 			}),
-			/* @__PURE__ */ L(q, { ctx: e })
+			/* @__PURE__ */ I(q, { ctx: e })
 		]
 	});
 }
 //#endregion
 //#region src/registry/default-nodes.tsx
-function kn(e, t = 36) {
+function Pn(e, t = 36) {
 	let n = e.replace(/\s+/g, " ").trim();
 	return n.length > t ? `${n.slice(0, t)}…` : n;
 }
-var An = (e, { t }) => kn(e.textContent) || t.layers.empty, jn = () => "", Mn = [
+var Fn = (e, { t }) => Pn(e.textContent) || t.layers.empty, In = () => "", Ln = [
 	{
 		type: "paragraph",
-		icon: Oe
+		icon: Ae
 	},
 	{
 		type: "heading",
-		icon: pe,
-		inspector: pn
+		icon: he,
+		inspector: vn
 	},
 	{
 		type: "image",
-		icon: me,
-		inspector: mn,
+		icon: ge,
+		inspector: yn,
 		preview: (e, { t }) => {
 			let { attrs: n } = e;
-			if (n.alt) return kn(n.alt);
+			if (n.alt) return Pn(n.alt);
 			let r = String(n.src ?? "");
 			if (r.startsWith("data:")) return t.layers.uploadedImage;
 			try {
 				let e = new URL(r);
-				return kn(e.searchParams.get("text") ?? decodeURIComponent(e.pathname.split("/").pop() ?? ""));
+				return Pn(e.searchParams.get("text") ?? decodeURIComponent(e.pathname.split("/").pop() ?? ""));
 			} catch {
 				return "";
 			}
@@ -2472,99 +2503,99 @@ var An = (e, { t }) => kn(e.textContent) || t.layers.empty, jn = () => "", Mn =
 	},
 	{
 		type: "button",
-		icon: xe,
-		inspector: dn
+		icon: P,
+		inspector: gn
 	},
 	{
 		type: "horizontalRule",
-		icon: be,
-		inspector: _n,
-		preview: jn
+		icon: Se,
+		inspector: Sn,
+		preview: In
 	},
 	{
 		type: "spacer",
-		icon: qt,
-		inspector: hn,
+		icon: Qt,
+		inspector: bn,
 		preview: (e) => `${e.attrs.height}px`,
-		extensions: [xn]
+		extensions: [En]
 	},
 	{
 		type: "socialLinks",
-		icon: _e,
-		inspector: On,
+		icon: ye,
+		inspector: Nn,
 		preview: (e) => Array.isArray(e.attrs.links) ? e.attrs.links.map((e) => e.network).join(", ") : "",
-		extensions: [En]
+		extensions: [jn]
 	},
 	{
 		type: "htmlBlock",
-		icon: we,
-		inspector: gn,
-		preview: (e) => kn(String(e.attrs.html ?? "").replace(/<[^>]+>/g, " ")),
-		extensions: [Dn]
+		icon: Ee,
+		inspector: xn,
+		preview: (e) => Pn(String(e.attrs.html ?? "").replace(/<[^>]+>/g, " ")),
+		extensions: [Mn]
 	},
 	{
 		type: "section",
-		icon: ge,
-		inspector: vn,
-		preview: jn
+		icon: ve,
+		inspector: Cn,
+		preview: In
 	},
 	{
 		type: "columnsColumn",
-		icon: P,
-		inspector: vn,
-		preview: jn
+		icon: Ce,
+		inspector: Cn,
+		preview: In
 	},
 	{
 		type: "twoColumns",
-		icon: ue,
-		inspector: fn,
-		preview: jn
+		icon: fe,
+		inspector: _n,
+		preview: In
 	},
 	{
 		type: "threeColumns",
-		icon: de,
-		inspector: fn,
-		preview: jn
+		icon: pe,
+		inspector: _n,
+		preview: In
 	},
 	{
 		type: "fourColumns",
-		icon: fe,
-		inspector: fn,
-		preview: jn
+		icon: me,
+		inspector: _n,
+		preview: In
 	},
 	{
 		type: "bulletList",
-		icon: ve
+		icon: be
 	},
 	{
 		type: "orderedList",
-		icon: ye
+		icon: xe
 	},
 	{
 		type: "blockquote",
-		icon: De
+		icon: ke
 	},
 	{
 		type: "codeBlock",
-		icon: le
+		icon: de
 	},
 	{
 		type: "table",
-		icon: Ee
+		icon: Oe
 	}
-], Nn = /* @__PURE__ */ He({
-	button: () => Fn,
-	column: () => Ln,
+], Rn = /* @__PURE__ */ Ge({
+	button: () => Bn,
+	column: () => Hn,
 	columns: () => X,
-	doc: () => Un,
-	heading: () => Pn,
-	image: () => In,
-	link: () => Vn,
-	padding: () => Bn,
+	doc: () => Jn,
+	heading: () => zn,
+	image: () => Vn,
+	link: () => Kn,
+	padding: () => Gn,
 	paragraph: () => Y,
-	placeholderImage: () => Hn,
-	section: () => zn,
-	sized: () => Rn,
+	placeholderImage: () => qn,
+	section: () => Wn,
+	sized: () => Un,
 	text: () => J
 }), J = (e, t) => ({
 	type: "text",
@@ -2574,14 +2605,14 @@ var An = (e, { t }) => kn(e.textContent) || t.layers.empty, jn = () => "", Mn =
 	type: "paragraph",
 	attrs: t,
 	content: typeof e == "string" ? e ? [J(e)] : [] : e
-}), Pn = (e, t, n = {}) => ({
+}), zn = (e, t, n = {}) => ({
 	type: "heading",
 	attrs: {
 		level: e,
 		...n
 	},
 	content: [J(t)]
-}), Fn = (e, t = {}) => ({
+}), Bn = (e, t = {}) => ({
 	type: "button",
 	attrs: {
 		href: "https://example.com",
@@ -2589,7 +2620,7 @@ var An = (e, { t }) => kn(e.textContent) || t.layers.empty, jn = () => "", Mn =
 		...t
 	},
 	content: [J(e)]
-}), In = (e, t = {}) => ({
+}), Vn = (e, t = {}) => ({
 	type: "image",
 	attrs: {
 		src: e,
@@ -2597,10 +2628,10 @@ var An = (e, { t }) => kn(e.textContent) || t.layers.empty, jn = () => "", Mn =
 		alignment: "center",
 		...t
 	}
-}), Ln = (...e) => ({
+}), Hn = (...e) => ({
 	type: "columnsColumn",
 	content: e.length ? e : [Y()]
-}), Rn = (e, t) => ({
+}), Un = (e, t) => ({
 	...e,
 	attrs: {
 		...e.attrs,
@@ -2613,100 +2644,100 @@ var An = (e, { t }) => kn(e.textContent) || t.layers.empty, jn = () => "", Mn =
 		4: "fourColumns"
 	}[e],
 	...n ? { attrs: n } : {},
-	content: t ?? Array.from({ length: e }, () => Ln())
-}), zn = (e, ...t) => ({
+	content: t ?? Array.from({ length: e }, () => Hn())
+}), Wn = (e, ...t) => ({
 	type: "section",
 	attrs: { style: e },
 	content: t
-}), Bn = (e, t = e) => `padding-top:${e}px;padding-right:${t}px;padding-bottom:${e}px;padding-left:${t}px`, Vn = (e) => [{
+}), Gn = (e, t = e) => `padding-top:${e}px;padding-right:${t}px;padding-bottom:${e}px;padding-left:${t}px`, Kn = (e) => [{
 	type: "link",
 	attrs: { href: e }
-}], Hn = (e, t, n = "Image") => `https://placehold.co/${e}x${t}/e2e8f0/64748b/png?text=${encodeURIComponent(n)}`, Un = (...e) => ({
+}], qn = (e, t, n = "Image") => `https://placehold.co/${e}x${t}/e2e8f0/64748b/png?text=${encodeURIComponent(n)}`, Jn = (...e) => ({
 	type: "doc",
 	content: e
-}), Wn = ({ t: e }, t = "center") => Y([
-	J(e.content.menuHome, Vn("https://example.com")),
+}), Yn = ({ t: e }, t = "center") => Y([
+	J(e.content.menuHome, Kn("https://example.com")),
 	J("  ·  "),
-	J(e.content.menuShop, Vn("https://example.com/shop")),
+	J(e.content.menuShop, Kn("https://example.com/shop")),
 	J("  ·  "),
-	J(e.content.menuBlog, Vn("https://example.com/blog")),
+	J(e.content.menuBlog, Kn("https://example.com/blog")),
 	J("  ·  "),
-	J(e.content.menuContact, Vn("https://example.com/contact"))
-], { alignment: t }), Gn = [{
+	J(e.content.menuContact, Kn("https://example.com/contact"))
+], { alignment: t }), Xn = [{
 	id: "layout",
 	title: ({ t: e }) => e.sidebar.layoutTitle
 }, {
 	id: "content",
 	title: ({ t: e }) => e.sidebar.contentTitle
-}], Kn = [
+}], Zn = [
 	{
 		id: "section",
 		group: "layout",
 		label: ({ t: e }) => e.palette.oneColumn,
-		icon: /* @__PURE__ */ L(Xt, {}),
-		content: () => [zn(Bn(16), Y())]
+		icon: /* @__PURE__ */ I(tn, {}),
+		content: () => [Wn(Gn(16), Y())]
 	},
 	{
 		id: "columns-2",
 		group: "layout",
 		label: ({ t: e }) => e.palette.twoColumns,
-		icon: /* @__PURE__ */ L(ue, { size: 22 }),
+		icon: /* @__PURE__ */ I(fe, { size: 22 }),
 		content: () => [X(2)]
 	},
 	{
 		id: "columns-3",
 		group: "layout",
 		label: ({ t: e }) => e.palette.threeColumns,
-		icon: /* @__PURE__ */ L(de, { size: 22 }),
+		icon: /* @__PURE__ */ I(pe, { size: 22 }),
 		content: () => [X(3)]
 	},
 	{
 		id: "columns-4",
 		group: "layout",
 		label: ({ t: e }) => e.palette.fourColumns,
-		icon: /* @__PURE__ */ L(fe, { size: 22 }),
+		icon: /* @__PURE__ */ I(me, { size: 22 }),
 		content: () => [X(4)]
 	},
 	{
 		id: "heading",
 		group: "content",
 		label: ({ t: e }) => e.palette.heading,
-		icon: /* @__PURE__ */ L(pe, { size: 22 }),
-		content: ({ t: e }) => [Pn(2, e.content.heading)]
+		icon: /* @__PURE__ */ I(he, { size: 22 }),
+		content: ({ t: e }) => [zn(2, e.content.heading)]
 	},
 	{
 		id: "text",
 		group: "content",
 		label: ({ t: e }) => e.palette.text,
-		icon: /* @__PURE__ */ L(Oe, { size: 22 }),
+		icon: /* @__PURE__ */ I(Ae, { size: 22 }),
 		content: ({ t: e }) => [Y(e.content.text)]
 	},
 	{
 		id: "button",
 		group: "content",
 		label: ({ t: e }) => e.palette.button,
-		icon: /* @__PURE__ */ L(xe, { size: 22 }),
-		content: ({ t: e }) => [Fn(e.content.button)]
+		icon: /* @__PURE__ */ I(P, { size: 22 }),
+		content: ({ t: e }) => [Bn(e.content.button)]
 	},
 	{
 		id: "image",
 		group: "content",
 		label: ({ t: e }) => e.palette.image,
-		icon: /* @__PURE__ */ L(me, { size: 22 }),
-		content: ({ t: e }) => [In(Hn(600, 300, e.content.image))]
+		icon: /* @__PURE__ */ I(ge, { size: 22 }),
+		content: ({ t: e }) => [Vn(qn(600, 300, e.content.image))]
 	},
 	{
 		id: "divider",
 		group: "content",
 		label: ({ t: e }) => e.palette.divider,
-		icon: /* @__PURE__ */ L(be, { size: 22 }),
+		icon: /* @__PURE__ */ I(Se, { size: 22 }),
 		content: () => [{ type: "horizontalRule" }]
 	},
 	{
 		id: "spacer",
 		group: "content",
 		label: ({ t: e }) => e.palette.spacer,
-		icon: /* @__PURE__ */ L(Jt, {}),
+		icon: /* @__PURE__ */ I($t, {}),
 		content: () => [{
 			type: "spacer",
 			attrs: { height: 32 }
@@ -2716,21 +2747,21 @@ var An = (e, { t }) => kn(e.textContent) || t.layers.empty, jn = () => "", Mn =
 		id: "social",
 		group: "content",
 		label: ({ t: e }) => e.palette.social,
-		icon: /* @__PURE__ */ L(Yt, {}),
+		icon: /* @__PURE__ */ I(en, {}),
 		content: () => [{ type: "socialLinks" }]
 	},
 	{
 		id: "menu",
 		group: "content",
 		label: ({ t: e }) => e.palette.menu,
-		icon: /* @__PURE__ */ L(Se, { size: 22 }),
-		content: (e) => [Wn(e)]
+		icon: /* @__PURE__ */ I(we, { size: 22 }),
+		content: (e) => [Yn(e)]
 	},
 	{
 		id: "list",
 		group: "content",
 		label: ({ t: e }) => e.palette.list,
-		icon: /* @__PURE__ */ L(ve, { size: 22 }),
+		icon: /* @__PURE__ */ I(be, { size: 22 }),
 		content: ({ t: e }) => [{
 			type: "bulletList",
 			content: e.content.listItems.map((e) => ({
@@ -2743,7 +2774,7 @@ var An = (e, { t }) => kn(e.textContent) || t.layers.empty, jn = () => "", Mn =
 		id: "quote",
 		group: "content",
 		label: ({ t: e }) => e.palette.quote,
-		icon: /* @__PURE__ */ L(De, { size: 22 }),
+		icon: /* @__PURE__ */ I(ke, { size: 22 }),
 		content: ({ t: e }) => [{
 			type: "blockquote",
 			content: [Y(e.content.quote)]
@@ -2753,7 +2784,7 @@ var An = (e, { t }) => kn(e.textContent) || t.layers.empty, jn = () => "", Mn =
 		id: "html",
 		group: "content",
 		label: ({ t: e }) => e.palette.html,
-		icon: /* @__PURE__ */ L(we, { size: 22 }),
+		icon: /* @__PURE__ */ I(Ee, { size: 22 }),
 		content: ({ t: e }) => [{
 			type: "htmlBlock",
 			attrs: { html: e.content.html }
@@ -2763,61 +2794,61 @@ var An = (e, { t }) => kn(e.textContent) || t.layers.empty, jn = () => "", Mn =
 		id: "card",
 		group: "content",
 		label: ({ t: e }) => e.palette.card,
-		icon: /* @__PURE__ */ L(ge, { size: 22 }),
-		content: ({ t: e }) => [zn(`${Bn(24)};background-color:#f1f5f9;border-radius:12px`, Pn(3, e.content.cardTitle), Y(e.content.cardText))]
+		icon: /* @__PURE__ */ I(ve, { size: 22 }),
+		content: ({ t: e }) => [Wn(`${Gn(24)};background-color:#f1f5f9;border-radius:12px`, zn(3, e.content.cardTitle), Y(e.content.cardText))]
 	}
 ];
 //#endregion
 //#region src/registry/default-templates.tsx
 function Z({ variant: e }) {
-	return /* @__PURE__ */ R("span", {
+	return /* @__PURE__ */ L("span", {
 		className: `bree-block-thumb bree-thumb-${e}`,
 		"aria-hidden": !0,
 		children: [
-			/* @__PURE__ */ L("i", {}),
-			/* @__PURE__ */ L("i", {}),
-			/* @__PURE__ */ L("i", {})
+			/* @__PURE__ */ I("i", {}),
+			/* @__PURE__ */ I("i", {}),
+			/* @__PURE__ */ I("i", {})
 		]
 	});
 }
-var qn = [
+var Qn = [
 	{
 		id: "header",
 		label: ({ t: e }) => e.templates.header,
 		description: ({ t: e }) => e.templates.headerDescription,
-		thumbnail: /* @__PURE__ */ L(Z, { variant: "header" }),
-		content: (e) => [X(2, [Rn(Ln(In(Hn(140, 40, e.t.content.logo), {
+		thumbnail: /* @__PURE__ */ I(Z, { variant: "header" }),
+		content: (e) => [X(2, [Un(Hn(Vn(qn(140, 40, e.t.content.logo), {
 			alignment: "left",
 			width: "140"
-		})), 33), Rn(Ln(Wn(e, "right")), 67)])]
+		})), 33), Un(Hn(Yn(e, "right")), 67)])]
 	},
 	{
 		id: "hero",
 		label: ({ t: e }) => e.templates.hero,
 		description: ({ t: e }) => e.templates.heroDescription,
-		thumbnail: /* @__PURE__ */ L(Z, { variant: "hero" }),
-		content: ({ t: e }) => [zn(`${Bn(40, 24)};background-color:#eef2ff;border-radius:12px`, Pn(1, e.content.heroTitle, { alignment: "center" }), Y(e.content.heroText, { alignment: "center" }), Fn(e.content.heroButton, { style: `background-color:#4f46e5;color:#ffffff;${Bn(12, 24)};border-radius:8px` }))]
+		thumbnail: /* @__PURE__ */ I(Z, { variant: "hero" }),
+		content: ({ t: e }) => [Wn(`${Gn(40, 24)};background-color:#eef2ff;border-radius:12px`, zn(1, e.content.heroTitle, { alignment: "center" }), Y(e.content.heroText, { alignment: "center" }), Bn(e.content.heroButton, { style: `background-color:#4f46e5;color:#ffffff;${Gn(12, 24)};border-radius:8px` }))]
 	},
 	{
 		id: "products",
 		label: ({ t: e }) => e.templates.products,
 		description: ({ t: e }) => e.templates.productsDescription,
-		thumbnail: /* @__PURE__ */ L(Z, { variant: "products" }),
-		content: ({ t: e }) => [X(2, [e.content.productA, e.content.productB].map((t) => Ln(In(Hn(280, 200, t)), Pn(3, t, { alignment: "center" }), Y(e.content.productText, { alignment: "center" }), Fn(e.content.productButton))), { cellspacing: 16 })]
+		thumbnail: /* @__PURE__ */ I(Z, { variant: "products" }),
+		content: ({ t: e }) => [X(2, [e.content.productA, e.content.productB].map((t) => Hn(Vn(qn(280, 200, t)), zn(3, t, { alignment: "center" }), Y(e.content.productText, { alignment: "center" }), Bn(e.content.productButton))), { cellspacing: 16 })]
 	},
 	{
 		id: "features",
 		label: ({ t: e }) => e.templates.features,
 		description: ({ t: e }) => e.templates.featuresDescription,
-		thumbnail: /* @__PURE__ */ L(Z, { variant: "features" }),
-		content: ({ t: e }) => [X(3, e.content.features.map((t) => Ln(Pn(3, t, { alignment: "center" }), Y(e.content.featureText, { alignment: "center" }))))]
+		thumbnail: /* @__PURE__ */ I(Z, { variant: "features" }),
+		content: ({ t: e }) => [X(3, e.content.features.map((t) => Hn(zn(3, t, { alignment: "center" }), Y(e.content.featureText, { alignment: "center" }))))]
 	},
 	{
 		id: "testimonial",
 		label: ({ t: e }) => e.templates.testimonial,
 		description: ({ t: e }) => e.templates.testimonialDescription,
-		thumbnail: /* @__PURE__ */ L(Z, { variant: "testimonial" }),
-		content: ({ t: e }) => [zn(`${Bn(24)};background-color:#f8fafc;border-radius:12px`, {
+		thumbnail: /* @__PURE__ */ I(Z, { variant: "testimonial" }),
+		content: ({ t: e }) => [Wn(`${Gn(24)};background-color:#f8fafc;border-radius:12px`, {
 			type: "blockquote",
 			content: [Y(e.content.testimonialQuote)]
 		}, Y(e.content.testimonialAuthor, {
@@ -2829,7 +2860,7 @@ var qn = [
 		id: "footer",
 		label: ({ t: e }) => e.templates.footer,
 		description: ({ t: e }) => e.templates.footerDescription,
-		thumbnail: /* @__PURE__ */ L(Z, { variant: "footer" }),
+		thumbnail: /* @__PURE__ */ I(Z, { variant: "footer" }),
 		content: ({ t: e }) => [
 			{ type: "horizontalRule" },
 			{ type: "socialLinks" },
@@ -2837,14 +2868,14 @@ var qn = [
 				alignment: "center",
 				style: "color:#94a3b8;font-size:12px"
 			}),
-			Y([J(e.content.unsubscribe, Vn("https://example.com/unsubscribe"))], {
+			Y([J(e.content.unsubscribe, Kn("https://example.com/unsubscribe"))], {
 				alignment: "center",
 				style: "font-size:12px"
 			})
 		]
 	}
-], Jn = (e, t) => qn.find((t) => t.id === e)?.content(t) ?? [];
-function Yn(e) {
+], $n = (e, t) => Qn.find((t) => t.id === e)?.content(t) ?? [];
+function er(e) {
 	let t = {
 		type: "spacer",
 		attrs: { height: 16 }
@@ -2852,39 +2883,39 @@ function Yn(e) {
 	return {
 		type: "doc",
 		content: [
-			...Jn("header", e),
+			...$n("header", e),
 			t,
-			...Jn("hero", e),
+			...$n("hero", e),
 			t,
-			Pn(2, e.t.content.starterTitle, { alignment: "center" }),
-			...Jn("products", e),
+			zn(2, e.t.content.starterTitle, { alignment: "center" }),
+			...$n("products", e),
 			t,
-			...Jn("footer", e)
+			...$n("footer", e)
 		]
 	};
 }
 //#endregion
 //#region src/context.tsx
-var Xn = e(null);
+var tr = e(null);
 function Q() {
-	let e = r(Xn);
+	let e = r(tr);
 	if (!e) throw Error("useEmailEditor must be used inside <EditorRoot> or <BetterEmailEditor>.");
 	return e;
 }
-function Zn() {
-	return r(Xn);
+function nr() {
+	return r(tr);
 }
 function $() {
-	return r(Xn)?.t ?? kt;
+	return r(tr)?.t ?? Pt;
 }
-function Qn() {
+function rr() {
 	let { locale: e, t } = Q();
 	return c(() => ({
 		locale: e,
 		t
 	}), [e, t]);
 }
-var $n = S("basic", {
+var ir = S("basic", {
 	body: {
 		backgroundColor: "#eef1f5",
 		padding: "32px 16px"
@@ -2894,22 +2925,22 @@ var $n = S("basic", {
 		padding: "24px",
 		borderRadius: "12px"
 	}
-}), er = (e) => new Promise((t, n) => {
+}), ar = (e) => new Promise((t, n) => {
 	let r = new FileReader();
 	r.onload = () => t({ url: String(r.result) }), r.onerror = n, r.readAsDataURL(e);
-}), tr = {
+}), or = {
 	type: "doc",
 	content: [{ type: "paragraph" }]
 };
-function nr(e) {
+function sr(e) {
 	return typeof e == "object" && !!e && "doc" in e;
 }
-function rr(e) {
+function cr(e) {
 	let t = {
 		subject: "",
 		previewText: ""
 	};
-	return e ? nr(e) ? {
+	return e ? sr(e) ? {
 		doc: e.doc,
 		settings: {
 			...t,
@@ -2920,31 +2951,32 @@ function rr(e) {
 		doc: e,
 		settings: t
 	} : {
-		doc: tr,
+		doc: or,
 		settings: t
 	};
 }
-function ir(e, t, r) {
+function lr(e, t, r) {
 	let [i, a] = u(t);
 	return [e === void 0 ? i : e, n((t) => {
 		e === void 0 && a(t), r?.(t);
 	}, [e, r])];
 }
-var ar = t(function({ defaultValue: e, onChange: t, onReady: r, locale: a = "en", messages: d, nodes: p = Mn, palette: g = Kn, paletteGroups: _ = Gn, templates: y = qn, fonts: S = wt, starterDocument: C = Yn, extensions: w, theme: E = $n, uploadImage: D = er, editable: O = !0, device: ee, defaultDevice: k = "desktop", onDeviceChange: A, layersOpen: te, defaultLayersOpen: ne = !0, onLayersOpenChange: re, className: ie, style: ae, children: oe }, se) {
-	let j = c(() => Ft(a, d), [a, d]), [ce] = u(() => rr(e)), [le, ue] = u(ce.settings), de = l(le), fe = l(j), M = l(t), pe = l(r), me = l(D);
+var ur = t(function({ defaultValue: e, onChange: t, onReady: r, locale: a = "en", messages: d, nodes: p = Ln, palette: g = Zn, paletteGroups: _ = Xn, templates: y = Qn, fonts: S = Dt, starterDocument: C = er, extensions: w, theme: E = ir, uploadImage: D = ar, editable: O = !0, device: k, defaultDevice: A = "desktop", onDeviceChange: j, layersOpen: ee, defaultLayersOpen: te = !0, onLayersOpenChange: ne, className: re, style: ie, children: ae }, oe) {
+	let se = c(() => Bt(a, d), [a, d]), [ce] = u(() => cr(e)), [le, ue] = u(ce.settings), de = l(le), fe = l(se), pe = l(t), me = l(r), M = l(D), he = l(S);
 	s(() => {
-		fe.current = j, M.current = t, pe.current = r, me.current = D;
+		fe.current = se, pe.current = t, me.current = r, M.current = D, he.current = S;
 	});
-	let [N, he] = ir(ee, k, A), [ge, _e] = ir(te, ne, re), [ve] = u(() => ({
-		dragSession: Dt(),
-		hoverStore: Ot()
-	})), ye = n((e) => me.current(e), []), be = T({ uploadImage: ye }), [xe] = u(() => [
+	let [ge, N] = lr(k, A, j), [_e, ve] = lr(ee, te, ne), [ye] = u(() => ({
+		dragSession: Mt(),
+		hoverStore: Nt()
+	})), be = n((e) => M.current(e), []), xe = T({ uploadImage: be }), [Se] = u(() => [
 		b.configure({
 			TiptapStarterKit: { dropcursor: !1 },
 			Button: !1
 		}),
-		dt,
-		Ct,
+		pt,
+		Tt,
+		Et,
 		f.configure({
 			placeholder: ({ node: e }) => e.type.name === "heading" ? fe.current.placeholder.heading : fe.current.placeholder.paragraph,
 			includeChildren: !0
@@ -2952,134 +2984,148 @@ var ar = t(function({ defaultValue: e, onChange: t, onReady: r, locale: a = "en"
 		x.configure({ theme: E }),
 		...p.flatMap((e) => e.extensions ?? []),
 		...w ?? [],
-		be
+		xe
 	]), P = h({
-		extensions: xe,
+		extensions: Se,
 		content: ce.doc,
 		editable: O,
 		immediatelyRender: !1,
-		editorProps: { handlePaste: xt(xe) }
+		editorProps: { handlePaste: Ct(Se) }
 	}, []);
 	i(() => {
 		P?.setEditable(O);
 	}, [P, O]);
-	let Se = n(() => ({
-		doc: P?.getJSON() ?? tr,
+	let Ce = n(() => ({
+		doc: P?.getJSON() ?? or,
 		settings: de.current
-	}), [P]), Ce = n((e) => {
+	}), [P]), we = n((e) => {
 		let t = {
 			...de.current,
 			...e
 		};
-		de.current = t, ue(t), P && M.current?.({
+		de.current = t, ue(t), P && pe.current?.({
 			doc: P.getJSON(),
 			settings: t
 		});
 	}, [P]), F = c(() => {
-		let e = async () => P ? v({
-			editor: P,
-			preview: de.current.previewText || void 0
-		}) : {
-			html: "",
-			text: "",
-			unformattedHtml: ""
+		let e = async () => {
+			if (!P) return {
+				html: "",
+				text: "",
+				unformattedHtml: ""
+			};
+			let e = await v({
+				editor: P,
+				preview: de.current.previewText || void 0
+			});
+			return {
+				...e,
+				html: jt(e.html, he.current),
+				unformattedHtml: jt(e.unformattedHtml, he.current)
+			};
 		};
 		return {
 			editor: P,
-			getValue: Se,
-			getJSON: () => P?.getJSON() ?? tr,
+			getValue: Ce,
+			getJSON: () => P?.getJSON() ?? or,
 			setValue: (e) => {
-				let t = rr(e);
+				let t = cr(e);
 				de.current = t.settings, ue(t.settings), P?.commands.setContent(t.doc, { emitUpdate: !0 });
 			},
 			exportEmail: e,
 			getHtml: async () => (await e()).html,
 			getText: async () => (await e()).text,
 			insertBlocks: (e) => {
-				P && ut(P, e);
+				P && ft(P, e);
 			}
 		};
-	}, [P, Se]);
-	o(se, () => F, [F]), i(() => {
+	}, [P, Ce]);
+	o(oe, () => F, [F]), i(() => {
 		if (!P) return;
-		pe.current?.(F);
-		let e = () => M.current?.(Se());
+		me.current?.(F);
+		let e = () => pe.current?.(Ce());
 		return P.on("update", e), () => {
 			P.off("update", e);
 		};
 	}, [
 		P,
 		F,
-		Se
-	]);
-	let we = c(() => new Map(p.map((e) => [e.type, e])), [p]), Te = c(() => {
+		Ce
+	]), i(() => {
+		for (let { href: e } of S) {
+			if (!e || document.querySelector(`link[data-bree-font="${CSS.escape(e)}"]`)) continue;
+			let t = document.createElement("link");
+			t.rel = "stylesheet", t.href = e, t.dataset.breeFont = e, document.head.appendChild(t);
+		}
+	}, [S]);
+	let Te = c(() => new Map(p.map((e) => [e.type, e])), [p]), Ee = c(() => {
 		if (!P) return null;
 		let e = {
 			locale: a,
-			t: j
+			t: se
 		};
 		return {
 			...e,
 			editor: P,
 			handle: F,
-			nodes: we,
+			nodes: Te,
 			nodeLabel: (t) => {
-				let n = we.get(t)?.label;
-				return n ? Mt(n, e) : j.nodes[t] ?? t;
+				let n = Te.get(t)?.label;
+				return n ? Lt(n, e) : se.nodes[t] ?? t;
 			},
 			palette: g,
 			paletteGroups: _,
 			templates: y,
 			fonts: S,
 			starterDocument: C,
-			uploadImage: ye,
-			...ve,
-			device: N,
-			setDevice: he,
-			layersOpen: ge,
-			setLayersOpen: _e,
+			uploadImage: be,
+			...ye,
+			device: ge,
+			setDevice: N,
+			layersOpen: _e,
+			setLayersOpen: ve,
 			settings: le,
-			updateSettings: Ce
+			updateSettings: we
 		};
 	}, [
 		P,
 		a,
-		j,
+		se,
 		F,
-		we,
+		Te,
 		g,
 		_,
 		y,
 		S,
 		C,
+		be,
 		ye,
-		ve,
-		N,
-		he,
 		ge,
+		N,
 		_e,
+		ve,
 		le,
-		Ce
-	]), Ee = c(() => ({ editor: P }), [P]), De = {
-		"--bree-empty-zone-label": JSON.stringify(j.canvas.emptyZone),
-		...ae
+		we
+	]), De = c(() => ({ editor: P }), [P]), Oe = {
+		"--bree-empty-zone-label": JSON.stringify(se.canvas.emptyZone),
+		...ie
 	};
-	return /* @__PURE__ */ L("div", {
-		className: z("bree bree-root", ie),
-		style: De,
+	return /* @__PURE__ */ I("div", {
+		className: R("bree bree-root", re),
+		style: Oe,
 		lang: a,
-		children: Te && /* @__PURE__ */ L(m.Provider, {
-			value: Ee,
-			children: /* @__PURE__ */ L(Xn.Provider, {
-				value: Te,
-				children: oe
+		children: Ee && /* @__PURE__ */ I(m.Provider, {
+			value: De,
+			children: /* @__PURE__ */ I(tr.Provider, {
+				value: Ee,
+				children: ae
 			})
 		})
 	});
 });
 //#endregion
 //#region src/components/CanvasOverlay.tsx
-function or(e, t) {
+function dr(e, t) {
 	let n = e.getBoundingClientRect();
 	return {
 		top: t.top - n.top + e.scrollTop,
@@ -3088,23 +3134,23 @@ function or(e, t) {
 		height: t.height ?? 0
 	};
 }
-function sr(e, t, n) {
+function fr(e, t, n) {
 	if (!n) return null;
 	let r = e.view.nodeDOM(n.pos);
-	return r instanceof HTMLElement ? or(t, r.getBoundingClientRect()) : null;
+	return r instanceof HTMLElement ? dr(t, r.getBoundingClientRect()) : null;
 }
-function cr(e, t, n) {
+function pr(e, t, n) {
 	let r = e.view.posAtCoords({
 		left: t,
 		top: n
 	});
-	return r && r.inside >= 0 ? rt(e.state.doc, r.inside) : null;
+	return r && r.inside >= 0 ? z(e.state.doc, r.inside) : null;
 }
-function lr(e) {
+function mr(e) {
 	let t = e.node.type.name;
-	return Ue.has(t) || We.has(t);
+	return Ke.has(t) || qe.has(t);
 }
-function ur({ editor: e, host: t }) {
+function hr({ editor: e, host: t }) {
 	let { dragSession: r, hoverStore: a, nodeLabel: o, t: c } = Q(), f = l(o);
 	s(() => {
 		f.current = o;
@@ -3116,10 +3162,10 @@ function ur({ editor: e, host: t }) {
 		editor: e,
 		selector: ({ editor: e }) => {
 			if (!e?.isFocused) return null;
-			let t = ot(e);
+			let t = ct(e);
 			return t ? `${t.pos}:${t.node.type.name}:${e.state.doc.content.size}` : null;
 		}
-	}) ? ot(e) : null;
+	}) ? ct(e) : null;
 	i(() => {
 		let n = () => S(), r = () => {
 			a.set(null), S();
@@ -3137,7 +3183,7 @@ function ur({ editor: e, host: t }) {
 	]), i(() => {
 		let n = 0, i = (t) => {
 			r.get() || t.target.closest(".bree-ov-toolbar, .bree-ov-handle, .bree-ov-tag") || (cancelAnimationFrame(n), n = requestAnimationFrame(() => {
-				a.set(cr(e, t.clientX, t.clientY)?.pos ?? null);
+				a.set(pr(e, t.clientX, t.clientY)?.pos ?? null);
 			}));
 		}, o = () => a.set(null);
 		return t.addEventListener("mousemove", i), t.addEventListener("mouseleave", o), () => {
@@ -3161,14 +3207,14 @@ function ur({ editor: e, host: t }) {
 				t instanceof HTMLElement && t.blur(), e.commands.blur();
 				return;
 			}
-			let r = cr(e, n.clientX, n.clientY);
-			if (r && lr(r)) {
-				n.preventDefault(), st(e, r);
+			let r = pr(e, n.clientX, n.clientY);
+			if (r && mr(r)) {
+				n.preventDefault(), lt(e, r);
 				return;
 			}
 			!e.isFocused && e.state.selection instanceof D && e.view.focus();
 		}, r = (t) => {
-			e.view.dom.contains(t.target) && ft(e, t);
+			e.view.dom.contains(t.target) && mt(e, t);
 		};
 		return t.addEventListener("mousedown", n, !0), t.addEventListener("paste", r, !0), () => {
 			t.removeEventListener("mousedown", n, !0), t.removeEventListener("paste", r, !0);
@@ -3176,12 +3222,12 @@ function ur({ editor: e, host: t }) {
 	}, [e, t]), i(() => {
 		let n = 0, i = null, o = null, s = (t) => {
 			let n = r.get();
-			if (!n || (i !== n && (i = n, o = Ze(e.view, n)), !o)) return null;
+			if (!n || (i !== n && (i = n, o = et(e.view, n)), !o)) return null;
 			let a = n.kind === "move" ? {
 				from: n.pos,
 				to: n.pos + (e.state.doc.nodeAt(n.pos)?.nodeSize ?? 0)
 			} : void 0;
-			return Xe(e.view, t.clientX, t.clientY, o, a);
+			return $e(e.view, t.clientX, t.clientY, o, a);
 		}, c = (e) => {
 			let t = r.get();
 			t && (e.preventDefault(), e.stopPropagation(), e.dataTransfer && (e.dataTransfer.dropEffect = t.kind === "move" ? "move" : "copy"), cancelAnimationFrame(n), n = requestAnimationFrame(() => v(s(e))));
@@ -3190,7 +3236,7 @@ function ur({ editor: e, host: t }) {
 			if (!i) return;
 			t.preventDefault(), t.stopPropagation(), cancelAnimationFrame(n);
 			let o = s(t);
-			o && tt(e, i, o), e.view.dragging = null, r.end(), v(null), b(null), a.set(null);
+			o && it(e, i, o), e.view.dragging = null, r.end(), v(null), b(null), a.set(null);
 		}, u = (e) => {
 			r.get() && (t.contains(e.relatedTarget) || (cancelAnimationFrame(n), v(null)));
 		}, d = () => {
@@ -3198,16 +3244,16 @@ function ur({ editor: e, host: t }) {
 		}, p = (t) => {
 			let n = t.target;
 			if (r.get() || n.tagName !== "IMG" || !e.view.dom.contains(n)) return;
-			let i = e.view.posAtDOM(n, 0), a = rt(e.state.doc, i);
-			a && !it(a) && (r.start({
+			let i = e.view.posAtDOM(n, 0), a = z(e.state.doc, i);
+			a && !ot(a) && (r.start({
 				kind: "move",
 				pos: a.pos,
 				label: f.current(a.node.type.name)
 			}), requestAnimationFrame(() => b(a.pos)));
 		}, m = (t) => {
 			if (t.key !== "Escape" || !e.isFocused) return;
-			let n = ot(e), r = n ? at(e.state.doc, n) : null;
-			if (t.preventDefault(), r) st(e, r);
+			let n = ct(e), r = n ? st(e.state.doc, n) : null;
+			if (t.preventDefault(), r) lt(e, r);
 			else {
 				let t = document.activeElement;
 				t instanceof HTMLElement && t.blur(), e.commands.blur();
@@ -3228,36 +3274,36 @@ function ur({ editor: e, host: t }) {
 			kind: "move",
 			pos: n.pos,
 			label: o(n.node.type.name)
-		}), t.dataTransfer.setData(Ge, "move"), t.dataTransfer.effectAllowed = "move", i instanceof HTMLElement) {
+		}), t.dataTransfer.setData(Je, "move"), t.dataTransfer.effectAllowed = "move", i instanceof HTMLElement) {
 			let e = i.getBoundingClientRect();
 			t.dataTransfer.setDragImage(i, Math.min(24, e.width / 2), Math.min(24, e.height / 2));
 		}
 		requestAnimationFrame(() => b(n.pos));
-	}, T = y !== null, E = h && h.pos !== C?.pos ? sr(e, t, h) : null, O = sr(e, t, C), ee = T ? sr(e, t, rt(e.state.doc, y)) : null, k = C ? at(e.state.doc, C) : null;
-	return /* @__PURE__ */ R("div", {
+	}, T = y !== null, E = h && h.pos !== C?.pos ? fr(e, t, h) : null, O = fr(e, t, C), k = T ? fr(e, t, z(e.state.doc, y)) : null, A = C ? st(e.state.doc, C) : null;
+	return /* @__PURE__ */ L("div", {
 		className: "bree-ov-layer",
 		children: [
-			E && h && /* @__PURE__ */ L("div", {
-				className: z("bree-ov-frame bree-ov-hover", T && "bree-ov-ghost"),
+			E && h && /* @__PURE__ */ I("div", {
+				className: R("bree-ov-frame bree-ov-hover", T && "bree-ov-ghost"),
 				style: E,
-				children: /* @__PURE__ */ L("button", {
+				children: /* @__PURE__ */ I("button", {
 					type: "button",
 					className: "bree-ov-tag",
 					onMouseDown: (t) => {
-						t.preventDefault(), st(e, h);
+						t.preventDefault(), lt(e, h);
 					},
 					children: o(h.node.type.name)
 				})
 			}),
-			O && C && /* @__PURE__ */ R("div", {
-				className: z("bree-ov-frame bree-ov-selected", T && "bree-ov-ghost"),
+			O && C && /* @__PURE__ */ L("div", {
+				className: R("bree-ov-frame bree-ov-selected", T && "bree-ov-ghost"),
 				style: O,
 				children: [
-					/* @__PURE__ */ L("span", {
+					/* @__PURE__ */ I("span", {
 						className: "bree-ov-tag bree-ov-tag-selected",
 						children: o(C.node.type.name)
 					}),
-					!it(C) && /* @__PURE__ */ L(M, { children: /* @__PURE__ */ L("span", {
+					!ot(C) && /* @__PURE__ */ I(M, { children: /* @__PURE__ */ I("span", {
 						className: "bree-ov-handle",
 						role: "button",
 						tabIndex: -1,
@@ -3265,38 +3311,38 @@ function ur({ editor: e, host: t }) {
 						title: c.canvas.move,
 						"aria-label": c.canvas.moveLabel(o(C.node.type.name)),
 						onDragStart: (e) => w(e, C),
-						children: /* @__PURE__ */ L(Lt, {})
+						children: /* @__PURE__ */ I(Ht, {})
 					}) }),
-					/* @__PURE__ */ L(M, { children: /* @__PURE__ */ R("div", {
+					/* @__PURE__ */ I(M, { children: /* @__PURE__ */ L("div", {
 						className: "bree-ov-toolbar",
 						onMouseDown: (e) => e.preventDefault(),
-						children: [k && /* @__PURE__ */ L("button", {
+						children: [A && /* @__PURE__ */ I("button", {
 							type: "button",
 							className: "bree-ov-tool",
-							title: c.canvas.selectParent(o(k.node.type.name)),
-							onClick: () => st(e, k),
-							children: /* @__PURE__ */ L(Bt, {})
-						}), !it(C) && /* @__PURE__ */ R(I, { children: [/* @__PURE__ */ L("button", {
+							title: c.canvas.selectParent(o(A.node.type.name)),
+							onClick: () => lt(e, A),
+							children: /* @__PURE__ */ I(Gt, {})
+						}), !ot(C) && /* @__PURE__ */ L(Pe, { children: [/* @__PURE__ */ I("button", {
 							type: "button",
 							className: "bree-ov-tool",
 							title: c.canvas.duplicate,
-							onClick: () => ct(e, C),
-							children: /* @__PURE__ */ L(Rt, {})
-						}), /* @__PURE__ */ L("button", {
+							onClick: () => ut(e, C),
+							children: /* @__PURE__ */ I(Ut, {})
+						}), /* @__PURE__ */ I("button", {
 							type: "button",
 							className: "bree-ov-tool bree-ov-danger",
 							title: c.canvas.delete,
-							onClick: () => lt(e, C),
-							children: /* @__PURE__ */ L(zt, {})
+							onClick: () => dt(e, C),
+							children: /* @__PURE__ */ I(Wt, {})
 						})] })]
 					}) })
 				]
 			}),
-			ee && /* @__PURE__ */ L("div", {
+			k && /* @__PURE__ */ I("div", {
 				className: "bree-ov-frame bree-ov-source",
-				style: ee
+				style: k
 			}),
-			_ && /* @__PURE__ */ L(dr, {
+			_ && /* @__PURE__ */ I(gr, {
 				host: t,
 				target: _,
 				label: r.get()?.label ?? "",
@@ -3305,32 +3351,32 @@ function ur({ editor: e, host: t }) {
 		]
 	});
 }
-function dr({ host: e, target: t, label: n, messages: r }) {
+function gr({ host: e, target: t, label: n, messages: r }) {
 	if (t.emptyZone) {
-		let i = or(e, t.emptyZone);
-		return /* @__PURE__ */ L("div", {
+		let i = dr(e, t.emptyZone);
+		return /* @__PURE__ */ I("div", {
 			className: "bree-ov-dropzone",
 			style: i,
-			children: /* @__PURE__ */ R("span", { children: [
-				/* @__PURE__ */ L(Ce, { size: 14 }),
+			children: /* @__PURE__ */ L("span", { children: [
+				/* @__PURE__ */ I(F, { size: 14 }),
 				" ",
 				r.canvas.dropLabel(n)
 			] })
 		});
 	}
 	if (!t.line) return null;
-	let i = or(e, {
+	let i = dr(e, {
 		...t.line,
 		height: 0
 	});
-	return /* @__PURE__ */ L("div", {
+	return /* @__PURE__ */ I("div", {
 		className: "bree-ov-dropline",
 		style: {
 			top: i.top,
 			left: i.left,
 			width: i.width
 		},
-		children: /* @__PURE__ */ L("span", {
+		children: /* @__PURE__ */ I("span", {
 			className: "bree-ov-dropline-label",
 			children: r.canvas.dropHere
 		})
@@ -3338,29 +3384,29 @@ function dr({ host: e, target: t, label: n, messages: r }) {
 }
 //#endregion
 //#region src/components/EmailHeader.tsx
-function fr({ className: e, style: t }) {
+function _r({ className: e, style: t }) {
 	let { settings: n, updateSettings: r, t: i } = Q(), o = i.emailHeader, s = a();
-	return /* @__PURE__ */ R("div", {
-		className: z("bree-email-header", e),
+	return /* @__PURE__ */ L("div", {
+		className: R("bree-email-header", e),
 		style: t,
-		children: [/* @__PURE__ */ R("div", {
+		children: [/* @__PURE__ */ L("div", {
 			className: "bree-email-header-row",
-			children: [/* @__PURE__ */ L("label", {
+			children: [/* @__PURE__ */ I("label", {
 				htmlFor: `${s}-subject`,
 				children: o.subject
-			}), /* @__PURE__ */ L("input", {
+			}), /* @__PURE__ */ I("input", {
 				id: `${s}-subject`,
 				className: "bree-email-header-subject",
 				value: n.subject ?? "",
 				placeholder: o.subjectPlaceholder,
 				onChange: (e) => r({ subject: e.target.value })
 			})]
-		}), /* @__PURE__ */ R("div", {
+		}), /* @__PURE__ */ L("div", {
 			className: "bree-email-header-row",
-			children: [/* @__PURE__ */ L("label", {
+			children: [/* @__PURE__ */ I("label", {
 				htmlFor: `${s}-preview`,
 				children: o.previewText
-			}), /* @__PURE__ */ L("input", {
+			}), /* @__PURE__ */ I("input", {
 				id: `${s}-preview`,
 				value: n.previewText,
 				placeholder: o.previewTextPlaceholder,
@@ -3371,7 +3417,7 @@ function fr({ className: e, style: t }) {
 }
 //#endregion
 //#region src/components/Canvas.tsx
-function pr(e, t, n) {
+function vr(e, t, n) {
 	let [r, a] = u(null);
 	return i(() => {
 		if (!t || !n) return;
@@ -3401,19 +3447,19 @@ function pr(e, t, n) {
 		n
 	]), n ? r : null;
 }
-function mr({ overlay: e = !0, bubbleMenu: t = !0, slashCommands: n = !0, header: r = !1, className: i, style: a, children: o }) {
-	let { editor: s, device: l, t: d } = Q(), [f, m] = u(null), [h, g] = u(null), _ = pr(s, f, r ? h : null), v = c(() => Array.isArray(n) ? n : je.map((e) => ({
+function yr({ overlay: e = !0, bubbleMenu: t = !0, slashCommands: n = !0, header: r = !1, className: i, style: a, children: o }) {
+	let { editor: s, device: l, t: d } = Q(), [f, m] = u(null), [h, g] = u(null), _ = vr(s, f, r ? h : null), v = c(() => Array.isArray(n) ? n : Ne.map((e) => ({
 		...e,
 		...d.slashCommands[e.title]
 	})), [n, d]);
-	return /* @__PURE__ */ R("div", {
+	return /* @__PURE__ */ L("div", {
 		ref: m,
-		className: z("bree-canvas", i),
+		className: R("bree-canvas", i),
 		style: a,
 		"data-device": l,
 		"data-email-header": r || void 0,
 		children: [
-			r && /* @__PURE__ */ L("div", {
+			r && /* @__PURE__ */ I("div", {
 				ref: g,
 				className: "bree-canvas-header",
 				"data-placed": _ ? "" : void 0,
@@ -3424,23 +3470,23 @@ function mr({ overlay: e = !0, bubbleMenu: t = !0, slashCommands: n = !0, header
 					width: _.width,
 					"--bree-email-header-radius": _.radius
 				} : void 0,
-				children: /* @__PURE__ */ L(fr, {})
+				children: /* @__PURE__ */ I(_r, {})
 			}),
-			/* @__PURE__ */ L(p, {
+			/* @__PURE__ */ I(p, {
 				editor: s,
 				className: "bree-canvas-content"
 			}),
-			t && /* @__PURE__ */ R(I, { children: [
-				/* @__PURE__ */ L(ce, {
+			t && /* @__PURE__ */ L(Pe, { children: [
+				/* @__PURE__ */ I(ue, {
 					hideWhenActiveNodes: ["button", "horizontalRule"],
 					hideWhenActiveMarks: ["link"]
 				}),
-				/* @__PURE__ */ L(ce.LinkDefault, {}),
-				/* @__PURE__ */ L(ce.ButtonDefault, {}),
-				/* @__PURE__ */ L(ce.ImageDefault, {})
+				/* @__PURE__ */ I(ue.LinkDefault, {}),
+				/* @__PURE__ */ I(ue.ButtonDefault, {}),
+				/* @__PURE__ */ I(ue.ImageDefault, {})
 			] }),
-			n !== !1 && /* @__PURE__ */ L(F, { items: v }),
-			e && f && /* @__PURE__ */ L(ur, {
+			n !== !1 && /* @__PURE__ */ I(Te, { items: v }),
+			e && f && /* @__PURE__ */ I(hr, {
 				editor: s,
 				host: f
 			}),
@@ -3450,36 +3496,36 @@ function mr({ overlay: e = !0, bubbleMenu: t = !0, slashCommands: n = !0, header
 }
 //#endregion
 //#region src/core/layers.ts
-function hr(e, t) {
+function br(e, t) {
 	let n = e.child(t);
-	return t === e.childCount - 1 && e.childCount > 1 && Je(n) && e.child(t - 1).type.name !== "paragraph";
+	return t === e.childCount - 1 && e.childCount > 1 && Ze(n) && e.child(t - 1).type.name !== "paragraph";
 }
-function gr(e, t, n, r) {
+function xr(e, t, n, r) {
 	let i = [];
 	return e.forEach((a, o, s) => {
-		if (hr(e, s)) return;
-		let c = t + 1 + o, l = a.type.name, u = `${r}${s}`, d = Ue.has(l), f = d && a.childCount === 1 && Je(a.firstChild), p = d || We.has(l);
+		if (br(e, s)) return;
+		let c = t + 1 + o, l = a.type.name, u = `${r}${s}`, d = Ke.has(l), f = d && a.childCount === 1 && Ze(a.firstChild), p = d || qe.has(l);
 		i.push({
 			key: u,
 			pos: c,
 			node: a,
 			depth: n,
 			index: s + 1,
-			children: p && !f ? gr(a, c, n + 1, `${u}.`) : [],
+			children: p && !f ? xr(a, c, n + 1, `${u}.`) : [],
 			accepts: d,
 			fixed: l === "columnsColumn",
 			empty: f
 		});
 	}), i;
 }
-function _r(e) {
-	let t = Ye(e);
-	return t ? gr(t.node, t.pos, 0, "") : [];
+function Sr(e) {
+	let t = Qe(e);
+	return t ? xr(t.node, t.pos, 0, "") : [];
 }
-function vr(e, t) {
+function Cr(e, t) {
 	return e.fixed ? "inside" : e.accepts ? t < .25 ? "before" : t > .75 ? "after" : "inside" : t < .5 ? "before" : "after";
 }
-function yr(e, t, n, r, i) {
+function wr(e, t, n, r, i) {
 	let a, o;
 	if (n === "inside") {
 		if (!t.accepts) return null;
@@ -3497,8 +3543,8 @@ function yr(e, t, n, r, i) {
 }
 //#endregion
 //#region src/components/LayersPanel.tsx
-function br({ onClose: e, title: t, expandCollapseButtons: n = !0, className: r, style: a }) {
-	let { editor: o, t: s, locale: f, nodes: p, nodeLabel: m, dragSession: h, hoverStore: _ } = Q(), v = (e) => e.node.type.name === "columnsColumn" ? s.layers.column(e.index) : m(e.node.type.name), y = (e) => (p.get(e.node.type.name)?.preview ?? An)(e.node, {
+function Tr({ onClose: e, title: t, expandCollapseButtons: n = !0, className: r, style: a }) {
+	let { editor: o, t: s, locale: f, nodes: p, nodeLabel: m, dragSession: h, hoverStore: _ } = Q(), v = (e) => e.node.type.name === "columnsColumn" ? s.layers.column(e.index) : m(e.node.type.name), y = (e) => (p.get(e.node.type.name)?.preview ?? Fn)(e.node, {
 		locale: f,
 		t: s
 	}), b = g({
@@ -3507,16 +3553,16 @@ function br({ onClose: e, title: t, expandCollapseButtons: n = !0, className: r,
 		equalityFn: (e, t) => e === t
 	}), x = g({
 		editor: o,
-		selector: ({ editor: e }) => e?.isFocused ? ot(e)?.pos ?? null : null
-	}), S = d(_.subscribe, _.get), C = c(() => b ? _r(b) : [], [b]), [w, T] = u(() => /* @__PURE__ */ new Set()), [E, D] = u(null), O = l(null);
+		selector: ({ editor: e }) => e?.isFocused ? ct(e)?.pos ?? null : null
+	}), S = d(_.subscribe, _.get), C = c(() => b ? Sr(b) : [], [b]), [w, T] = u(() => /* @__PURE__ */ new Set()), [E, D] = u(null), O = l(null);
 	i(() => {
 		x !== null && O.current?.querySelector("[aria-selected=\"true\"]")?.scrollIntoView({ block: "nearest" });
 	}, [x]);
-	let ee = (e) => T((t) => {
+	let k = (e) => T((t) => {
 		let n = new Set(t);
 		return n.has(e) ? n.delete(e) : n.add(e), n;
-	}), k = (e) => {
-		st(o, {
+	}), A = (e) => {
+		lt(o, {
 			pos: e.pos,
 			node: e.node
 		});
@@ -3525,41 +3571,41 @@ function br({ onClose: e, title: t, expandCollapseButtons: n = !0, className: r,
 			block: "nearest",
 			behavior: "smooth"
 		});
-	}, A = (e, t) => {
+	}, j = (e, t) => {
 		let n = h.get();
 		if (!n) return null;
-		let r = Ze(o.view, n);
+		let r = et(o.view, n);
 		if (!r) return null;
-		let i = e.currentTarget.getBoundingClientRect(), a = vr(t, (e.clientY - i.top) / i.height), s = n.kind === "move" ? o.state.doc.nodeAt(n.pos) : null, c = n.kind === "move" && s ? {
+		let i = e.currentTarget.getBoundingClientRect(), a = Cr(t, (e.clientY - i.top) / i.height), s = n.kind === "move" ? o.state.doc.nodeAt(n.pos) : null, c = n.kind === "move" && s ? {
 			from: n.pos,
 			to: n.pos + s.nodeSize
-		} : void 0, l = yr(o.state.doc, t, a, r, c);
+		} : void 0, l = wr(o.state.doc, t, a, r, c);
 		return l ? {
 			zone: a,
 			target: l,
 			payload: n
 		} : null;
-	}, te = () => {
+	}, ee = () => {
 		h.end(), D(null);
-	}, ne = (e) => e.map((e) => {
-		let t = p.get(e.node.type.name)?.icon ?? ge, n = e.children.length > 0, r = w.has(e.key), i = y(e), a = E?.key === e.key ? E.zone : null;
-		return /* @__PURE__ */ R("div", {
+	}, te = (e) => e.map((e) => {
+		let t = p.get(e.node.type.name)?.icon ?? ve, n = e.children.length > 0, r = w.has(e.key), i = y(e), a = E?.key === e.key ? E.zone : null;
+		return /* @__PURE__ */ L("div", {
 			role: "none",
 			children: [
-				/* @__PURE__ */ R("div", {
+				/* @__PURE__ */ L("div", {
 					role: "treeitem",
 					tabIndex: x === e.pos || x === null && e.key === "0" ? 0 : -1,
 					"aria-level": e.depth + 1,
 					"aria-selected": x === e.pos,
 					"aria-expanded": n ? !r : void 0,
-					className: z("bree-layer", x === e.pos && "bree-selected", S === e.pos && "bree-hovered", a && `bree-drop-${a}`, e.fixed && "bree-fixed"),
+					className: R("bree-layer", x === e.pos && "bree-selected", S === e.pos && "bree-hovered", a && `bree-drop-${a}`, e.fixed && "bree-fixed"),
 					style: { paddingLeft: 6 + e.depth * 16 },
 					draggable: !e.fixed,
 					title: e.fixed ? s.layers.fixedHint : s.layers.itemHint,
-					onClick: () => k(e),
+					onClick: () => A(e),
 					onKeyDown: (t) => {
-						if (t.key === "Enter" || t.key === " ") t.preventDefault(), k(e);
-						else if (t.key === "ArrowLeft" && n && !r || t.key === "ArrowRight" && r) ee(e.key);
+						if (t.key === "Enter" || t.key === " ") t.preventDefault(), A(e);
+						else if (t.key === "ArrowLeft" && n && !r || t.key === "ArrowRight" && r) k(e.key);
 						else if (t.key === "ArrowDown" || t.key === "ArrowUp") {
 							t.preventDefault();
 							let e = [...O.current?.querySelectorAll("[role=\"treeitem\"]") ?? []];
@@ -3573,11 +3619,11 @@ function br({ onClose: e, title: t, expandCollapseButtons: n = !0, className: r,
 							kind: "move",
 							pos: e.pos,
 							label: v(e)
-						}), t.dataTransfer.setData(Ge, "move"), t.dataTransfer.effectAllowed = "move";
+						}), t.dataTransfer.setData(Je, "move"), t.dataTransfer.effectAllowed = "move";
 					},
-					onDragEnd: te,
+					onDragEnd: ee,
 					onDragOver: (t) => {
-						let n = A(t, e);
+						let n = j(t, e);
 						if (!n) {
 							E?.key === e.key && D(null);
 							return;
@@ -3588,63 +3634,63 @@ function br({ onClose: e, title: t, expandCollapseButtons: n = !0, className: r,
 						});
 					},
 					onDrop: (t) => {
-						let n = A(t, e);
-						t.preventDefault(), n && tt(o, n.payload, n.target), te();
+						let n = j(t, e);
+						t.preventDefault(), n && it(o, n.payload, n.target), ee();
 					},
 					children: [
-						n ? /* @__PURE__ */ L("button", {
+						n ? /* @__PURE__ */ I("button", {
 							type: "button",
-							className: z("bree-layer-caret", !r && "bree-open"),
+							className: R("bree-layer-caret", !r && "bree-open"),
 							"aria-label": r ? s.layers.expand : s.layers.collapse,
 							tabIndex: -1,
 							onClick: (t) => {
-								t.stopPropagation(), ee(e.key);
+								t.stopPropagation(), k(e.key);
 							},
 							children: "›"
-						}) : /* @__PURE__ */ L("span", { className: "bree-layer-caret-spacer" }),
-						/* @__PURE__ */ L("span", {
+						}) : /* @__PURE__ */ I("span", { className: "bree-layer-caret-spacer" }),
+						/* @__PURE__ */ I("span", {
 							className: "bree-layer-icon",
-							children: /* @__PURE__ */ L(t, { size: 14 })
+							children: /* @__PURE__ */ I(t, { size: 14 })
 						}),
-						/* @__PURE__ */ L("span", {
+						/* @__PURE__ */ I("span", {
 							className: "bree-layer-label",
 							children: v(e)
 						}),
-						i && /* @__PURE__ */ L("span", {
+						i && /* @__PURE__ */ I("span", {
 							className: "bree-layer-preview",
 							children: i
 						})
 					]
 				}),
-				e.empty && /* @__PURE__ */ L("div", {
+				e.empty && /* @__PURE__ */ I("div", {
 					className: "bree-layer-empty",
 					style: { paddingLeft: 6 + (e.depth + 1) * 16 + 18 },
 					children: s.layers.emptyZone
 				}),
-				n && !r && /* @__PURE__ */ L("div", {
+				n && !r && /* @__PURE__ */ I("div", {
 					role: "group",
-					children: ne(e.children)
+					children: te(e.children)
 				})
 			]
 		}, e.key);
 	});
-	return /* @__PURE__ */ L(M, { children: /* @__PURE__ */ R("aside", {
-		className: z("bree-layers", r),
+	return /* @__PURE__ */ I(M, { children: /* @__PURE__ */ L("aside", {
+		className: R("bree-layers", r),
 		style: a,
 		"aria-label": t ?? s.layers.title,
 		tabIndex: -1,
 		onDragLeave: (e) => !e.currentTarget.contains(e.relatedTarget) && D(null),
-		children: [/* @__PURE__ */ R("header", {
+		children: [/* @__PURE__ */ L("header", {
 			className: "bree-layers-header",
-			children: [/* @__PURE__ */ L("h2", { children: t ?? s.layers.title }), /* @__PURE__ */ R("div", {
+			children: [/* @__PURE__ */ I("h2", { children: t ?? s.layers.title }), /* @__PURE__ */ L("div", {
 				className: "bree-layers-actions",
-				children: [n && /* @__PURE__ */ R(I, { children: [/* @__PURE__ */ L("button", {
+				children: [n && /* @__PURE__ */ L(Pe, { children: [/* @__PURE__ */ I("button", {
 					type: "button",
 					className: "bree-icon-button bree-small",
 					title: s.layers.expandAll,
 					onClick: () => T(/* @__PURE__ */ new Set()),
 					children: "⊞"
-				}), /* @__PURE__ */ L("button", {
+				}), /* @__PURE__ */ I("button", {
 					type: "button",
 					className: "bree-icon-button bree-small",
 					title: s.layers.collapseAll,
@@ -3655,20 +3701,20 @@ function br({ onClose: e, title: t, expandCollapseButtons: n = !0, className: r,
 						t(C), T(e);
 					},
 					children: "⊟"
-				})] }), e && /* @__PURE__ */ L("button", {
+				})] }), e && /* @__PURE__ */ I("button", {
 					type: "button",
 					className: "bree-icon-button bree-small",
 					title: s.layers.close,
 					onClick: e,
-					children: /* @__PURE__ */ L(Ae, { size: 14 })
+					children: /* @__PURE__ */ I(Me, { size: 14 })
 				})]
 			})]
-		}), /* @__PURE__ */ L("div", {
+		}), /* @__PURE__ */ I("div", {
 			className: "bree-layers-list",
 			role: "tree",
 			"aria-label": s.layers.tree,
 			ref: O,
-			children: C.length ? ne(C) : /* @__PURE__ */ L("p", {
+			children: C.length ? te(C) : /* @__PURE__ */ I("p", {
 				className: "bree-hint",
 				children: s.layers.emptyEmail
 			})
@@ -3677,58 +3723,58 @@ function br({ onClose: e, title: t, expandCollapseButtons: n = !0, className: r,
 }
 //#endregion
 //#region src/components/inspectors/DefaultInspector.tsx
-function xr({ ctx: e, className: t, style: n }) {
-	return /* @__PURE__ */ R("div", {
-		className: z("bree-inspector", t),
+function Er({ ctx: e, className: t, style: n }) {
+	return /* @__PURE__ */ L("div", {
+		className: R("bree-inspector", t),
 		style: n,
 		children: [
-			/* @__PURE__ */ L(ln, {
+			/* @__PURE__ */ I(mn, {
 				ctx: e,
 				alignment: String(e.getAttr("alignment") ?? "left"),
 				setAlignment: (t) => e.setAttr("alignment", t)
 			}),
-			/* @__PURE__ */ L(q, { ctx: e }),
-			/* @__PURE__ */ L(un, { ctx: e })
+			/* @__PURE__ */ I(q, { ctx: e }),
+			/* @__PURE__ */ I(hn, { ctx: e })
 		]
 	});
 }
 //#endregion
 //#region src/components/PropertiesPanel.tsx
-function Sr() {
+function Dr() {
 	let { editor: e } = Q();
 	return () => {
 		let t = document.activeElement;
 		t instanceof HTMLElement && t.blur(), e.commands.blur();
 	};
 }
-function Cr({ title: e, children: t, breadcrumb: n = !0, className: r, style: i }) {
-	let { t: a, nodeLabel: o } = Q(), s = Sr();
-	return /* @__PURE__ */ R("div", {
-		className: z("bree-properties", r),
+function Or({ title: e, children: t, breadcrumb: n = !0, className: r, style: i }) {
+	let { t: a, nodeLabel: o } = Q(), s = Dr();
+	return /* @__PURE__ */ L("div", {
+		className: R("bree-properties", r),
 		style: i,
 		children: [
-			/* @__PURE__ */ R("header", {
+			/* @__PURE__ */ L("header", {
 				className: "bree-properties-header",
-				children: [/* @__PURE__ */ R("div", { children: [/* @__PURE__ */ L("span", {
+				children: [/* @__PURE__ */ L("div", { children: [/* @__PURE__ */ I("span", {
 					className: "bree-eyebrow",
 					children: a.sidebar.propertiesEyebrow
-				}), /* @__PURE__ */ L("h2", { children: e })] }), /* @__PURE__ */ L("button", {
+				}), /* @__PURE__ */ I("h2", { children: e })] }), /* @__PURE__ */ I("button", {
 					type: "button",
 					className: "bree-icon-button",
 					title: a.sidebar.closeProperties,
 					onClick: s,
-					children: /* @__PURE__ */ L(Ae, { size: 16 })
+					children: /* @__PURE__ */ I(Me, { size: 16 })
 				})]
 			}),
-			n && /* @__PURE__ */ L(N.Breadcrumb, { children: (e) => e.length > 1 && /* @__PURE__ */ L("nav", {
+			n && /* @__PURE__ */ I(N.Breadcrumb, { children: (e) => e.length > 1 && /* @__PURE__ */ I("nav", {
 				className: "bree-breadcrumb",
 				"aria-label": a.sidebar.breadcrumb,
-				children: e.map((t, n) => /* @__PURE__ */ R("span", {
+				children: e.map((t, n) => /* @__PURE__ */ L("span", {
 					className: "bree-crumb",
-					children: [n > 0 && /* @__PURE__ */ L("span", {
+					children: [n > 0 && /* @__PURE__ */ I("span", {
 						className: "bree-crumb-sep",
 						children: "/"
-					}), /* @__PURE__ */ L("button", {
+					}), /* @__PURE__ */ I("button", {
 						type: "button",
 						disabled: n === e.length - 1,
 						onClick: t.focus,
@@ -3736,7 +3782,7 @@ function Cr({ title: e, children: t, breadcrumb: n = !0, className: r, style: i
 					})]
 				}, `${t.node.nodeType}-${t.node.nodePos.pos}`))
 			}) }),
-			/* @__PURE__ */ L("div", {
+			/* @__PURE__ */ I("div", {
 				className: "bree-panel-scroll",
 				children: t
 			})
@@ -3745,18 +3791,18 @@ function Cr({ title: e, children: t, breadcrumb: n = !0, className: r, style: i
 }
 //#endregion
 //#region src/components/BlockProperties.tsx
-function wr({ ctx: e, className: t, style: n }) {
-	let { nodes: r, nodeLabel: i } = Q(), a = r.get(e.nodeType)?.inspector ?? xr;
-	return /* @__PURE__ */ L(Cr, {
+function kr({ ctx: e, className: t, style: n }) {
+	let { nodes: r, nodeLabel: i } = Q(), a = r.get(e.nodeType)?.inspector ?? Er;
+	return /* @__PURE__ */ I(Or, {
 		title: i(e.nodeType),
 		className: t,
 		style: n,
-		children: /* @__PURE__ */ L(a, { ctx: e }, `${e.nodeType}-${e.nodePos.pos}`)
+		children: /* @__PURE__ */ I(a, { ctx: e }, `${e.nodeType}-${e.nodePos.pos}`)
 	});
 }
 //#endregion
 //#region src/components/useDraggableBlock.ts
-function Tr(e, t) {
+function Ar(e, t) {
 	let { editor: n, dragSession: r } = Q();
 	return {
 		draggable: !0,
@@ -3765,50 +3811,50 @@ function Tr(e, t) {
 				kind: "new",
 				label: e,
 				content: t
-			}), n.dataTransfer.setData(Ge, e), n.dataTransfer.effectAllowed = "copy";
+			}), n.dataTransfer.setData(Je, e), n.dataTransfer.effectAllowed = "copy";
 		},
 		onDragEnd: () => r.end(),
-		onClick: () => ut(n, t())
+		onClick: () => ft(n, t())
 	};
 }
 //#endregion
 //#region src/components/BlocksTab.tsx
-function Er({ template: e, className: t, style: n }) {
-	let r = Qn(), i = Mt(e.label, r), a = Tr(i, () => e.content(r));
-	return /* @__PURE__ */ R("button", {
+function jr({ template: e, className: t, style: n }) {
+	let r = rr(), i = Lt(e.label, r), a = Ar(i, () => e.content(r));
+	return /* @__PURE__ */ L("button", {
 		type: "button",
-		className: z("bree-block-card", t),
+		className: R("bree-block-card", t),
 		style: n,
 		...a,
-		children: [e.thumbnail ?? /* @__PURE__ */ L(Z, { variant: "default" }), /* @__PURE__ */ R("span", {
+		children: [e.thumbnail ?? /* @__PURE__ */ I(Z, { variant: "default" }), /* @__PURE__ */ L("span", {
 			className: "bree-block-text",
-			children: [/* @__PURE__ */ L("strong", { children: i }), e.description && /* @__PURE__ */ L("span", { children: Mt(e.description, r) })]
+			children: [/* @__PURE__ */ I("strong", { children: i }), e.description && /* @__PURE__ */ I("span", { children: Lt(e.description, r) })]
 		})]
 	});
 }
-function Dr({ templates: e, className: t, style: n }) {
+function Mr({ templates: e, className: t, style: n }) {
 	let r = Q();
-	return /* @__PURE__ */ L("div", {
-		className: z("bree-block-list", t),
+	return /* @__PURE__ */ I("div", {
+		className: R("bree-block-list", t),
 		style: n,
-		children: (e ?? r.templates).map((e) => /* @__PURE__ */ L(Er, { template: e }, e.id))
+		children: (e ?? r.templates).map((e) => /* @__PURE__ */ I(jr, { template: e }, e.id))
 	});
 }
 //#endregion
 //#region src/core/email-font.ts
-var Or = ["body", "blockquote"];
-function kr(e) {
+var Nr = ["body", "blockquote"];
+function Pr(e) {
 	let { styles: t } = C(e), n = t.flatMap((e) => e.inputs).find((e) => e.prop === "fontFamily" && e.classReference === "body");
 	return String(n?.value ?? "");
 }
-function Ar(e, t) {
-	let { styles: n } = C(e), r = (e) => e.prop === "fontFamily" && Or.includes(e.classReference ?? ""), i = Math.max(0, n.findIndex((e) => e.id === "body")), a = n.map((e, n) => {
+function Fr(e, t) {
+	let { styles: n } = C(e), r = (e) => e.prop === "fontFamily" && Nr.includes(e.classReference ?? ""), i = Math.max(0, n.findIndex((e) => e.id === "body")), a = n.map((e, n) => {
 		let a = e.inputs.filter((e) => !r(e));
 		if (n !== i || !t) return {
 			...e,
 			inputs: a
 		};
-		let o = Or.map((e) => ({
+		let o = Nr.map((e) => ({
 			label: "Font",
 			type: "text",
 			prop: "fontFamily",
@@ -3824,100 +3870,100 @@ function Ar(e, t) {
 }
 //#endregion
 //#region src/components/BodyTab.tsx
-function jr({ ctx: e, className: t, style: n }) {
+function Ir({ ctx: e, className: t, style: n }) {
 	let { editor: r, settings: i, updateSettings: a, t: o } = Q(), s = o.body, { findStyleValue: c, setGlobalStyle: l } = e;
-	return /* @__PURE__ */ R("div", {
-		className: z("bree-body-tab", t),
+	return /* @__PURE__ */ L("div", {
+		className: R("bree-body-tab", t),
 		style: n,
 		children: [
-			/* @__PURE__ */ L(V, {
+			/* @__PURE__ */ I(V, {
 				title: s.general,
-				children: /* @__PURE__ */ L(H, {
+				children: /* @__PURE__ */ I(H, {
 					label: s.previewText,
 					stacked: !0,
-					children: /* @__PURE__ */ L(U, {
+					children: /* @__PURE__ */ I(U, {
 						value: i.previewText,
 						onChange: (e) => a({ previewText: e }),
 						placeholder: s.previewTextPlaceholder
 					})
 				})
 			}),
-			/* @__PURE__ */ R(V, {
+			/* @__PURE__ */ L(V, {
 				title: s.background,
-				children: [/* @__PURE__ */ L(H, {
+				children: [/* @__PURE__ */ I(H, {
 					label: s.backgroundColor,
 					stacked: !0,
-					children: /* @__PURE__ */ L(G, {
+					children: /* @__PURE__ */ I(G, {
 						value: c("body", "backgroundColor"),
 						onChange: (e) => l("body", "backgroundColor", e)
 					})
-				}), /* @__PURE__ */ L(H, {
+				}), /* @__PURE__ */ I(H, {
 					label: s.outerPadding,
-					children: /* @__PURE__ */ L(W, {
+					children: /* @__PURE__ */ I(W, {
 						value: c("body", "padding"),
 						onChange: (e) => l("body", "padding", e)
 					})
 				})]
 			}),
-			/* @__PURE__ */ R(V, {
+			/* @__PURE__ */ L(V, {
 				title: s.content,
 				children: [
-					/* @__PURE__ */ L(H, {
+					/* @__PURE__ */ I(H, {
 						label: s.width,
-						children: /* @__PURE__ */ L(W, {
+						children: /* @__PURE__ */ I(W, {
 							value: c("container", "width"),
 							onChange: (e) => l("container", "width", e),
 							min: 320,
 							max: 900
 						})
 					}),
-					/* @__PURE__ */ L(H, {
+					/* @__PURE__ */ I(H, {
 						label: s.contentColor,
 						stacked: !0,
-						children: /* @__PURE__ */ L(G, {
+						children: /* @__PURE__ */ I(G, {
 							value: c("container", "backgroundColor"),
 							onChange: (e) => l("container", "backgroundColor", e)
 						})
 					}),
-					/* @__PURE__ */ L(H, {
+					/* @__PURE__ */ I(H, {
 						label: s.innerPadding,
-						children: /* @__PURE__ */ L(W, {
+						children: /* @__PURE__ */ I(W, {
 							value: c("container", "padding"),
 							onChange: (e) => l("container", "padding", e)
 						})
 					}),
-					/* @__PURE__ */ L(H, {
+					/* @__PURE__ */ I(H, {
 						label: s.radius,
-						children: /* @__PURE__ */ L(W, {
+						children: /* @__PURE__ */ I(W, {
 							value: c("container", "borderRadius"),
 							onChange: (e) => l("container", "borderRadius", e)
 						})
 					})
 				]
 			}),
-			/* @__PURE__ */ R(V, {
+			/* @__PURE__ */ L(V, {
 				title: s.defaultStyles,
 				children: [
-					/* @__PURE__ */ L(H, {
+					/* @__PURE__ */ I(H, {
 						label: s.font,
-						children: /* @__PURE__ */ L(an, {
-							value: kr(r),
+						children: /* @__PURE__ */ I(un, {
+							value: Pr(r),
 							emptyLabel: s.fontDefault,
-							onChange: (e) => Ar(r, e)
+							onChange: (e) => Fr(r, e)
 						})
 					}),
-					/* @__PURE__ */ L(H, {
+					/* @__PURE__ */ I(H, {
 						label: s.text,
 						stacked: !0,
-						children: /* @__PURE__ */ L(G, {
+						children: /* @__PURE__ */ I(G, {
 							value: c("paragraph", "color"),
 							onChange: (e) => l("paragraph", "color", e)
 						})
 					}),
-					/* @__PURE__ */ L(H, {
+					/* @__PURE__ */ I(H, {
 						label: s.headings,
 						stacked: !0,
-						children: /* @__PURE__ */ L(G, {
+						children: /* @__PURE__ */ I(G, {
 							value: c("h1", "color"),
 							onChange: (t) => e.batchSetGlobalStyle([
 								"h1",
@@ -3930,26 +3976,26 @@ function jr({ ctx: e, className: t, style: n }) {
 							})))
 						})
 					}),
-					/* @__PURE__ */ L(H, {
+					/* @__PURE__ */ I(H, {
 						label: s.links,
 						stacked: !0,
-						children: /* @__PURE__ */ L(G, {
+						children: /* @__PURE__ */ I(G, {
 							value: c("link", "color"),
 							onChange: (e) => l("link", "color", e)
 						})
 					}),
-					/* @__PURE__ */ L(H, {
+					/* @__PURE__ */ I(H, {
 						label: s.buttonBackground,
 						stacked: !0,
-						children: /* @__PURE__ */ L(G, {
+						children: /* @__PURE__ */ I(G, {
 							value: c("button", "backgroundColor"),
 							onChange: (e) => l("button", "backgroundColor", e)
 						})
 					}),
-					/* @__PURE__ */ L(H, {
+					/* @__PURE__ */ I(H, {
 						label: s.buttonText,
 						stacked: !0,
-						children: /* @__PURE__ */ L(G, {
+						children: /* @__PURE__ */ I(G, {
 							value: c("button", "color"),
 							onChange: (e) => l("button", "color", e)
 						})
@@ -3961,41 +4007,41 @@ function jr({ ctx: e, className: t, style: n }) {
 }
 //#endregion
 //#region src/components/ContentTab.tsx
-function Mr({ item: e, className: t, style: n }) {
-	let r = Qn(), i = Mt(e.label, r), a = Tr(i, () => e.content(r));
-	return /* @__PURE__ */ R("button", {
+function Lr({ item: e, className: t, style: n }) {
+	let r = rr(), i = Lt(e.label, r), a = Ar(i, () => e.content(r));
+	return /* @__PURE__ */ L("button", {
 		type: "button",
-		className: z("bree-tile", t),
+		className: R("bree-tile", t),
 		style: n,
 		title: r.t.sidebar.tileTitle(i),
 		...a,
-		children: [/* @__PURE__ */ L("span", {
+		children: [/* @__PURE__ */ I("span", {
 			className: "bree-tile-icon",
 			children: e.icon
-		}), /* @__PURE__ */ L("span", {
+		}), /* @__PURE__ */ I("span", {
 			className: "bree-tile-label",
 			children: i
 		})]
 	});
 }
-function Nr({ items: e, groups: t, hint: n, className: r, style: i }) {
+function Rr({ items: e, groups: t, hint: n, className: r, style: i }) {
 	let a = Q(), o = e ?? a.palette, s = t ?? a.paletteGroups, c = [...s, ...[...new Set(o.map((e) => e.group))].filter((e) => !s.some((t) => t.id === e)).map((e) => ({
 		id: e,
 		title: e
 	}))];
-	return /* @__PURE__ */ R("div", {
-		className: z("bree-content-tab", r),
+	return /* @__PURE__ */ L("div", {
+		className: R("bree-content-tab", r),
 		style: i,
 		children: [c.map((e) => {
 			let t = o.filter((t) => t.group === e.id);
-			return t.length ? /* @__PURE__ */ R("section", { children: [/* @__PURE__ */ L("h3", {
+			return t.length ? /* @__PURE__ */ L("section", { children: [/* @__PURE__ */ I("h3", {
 				className: "bree-panel-title",
-				children: Mt(e.title, a)
-			}), /* @__PURE__ */ L("div", {
+				children: Lt(e.title, a)
+			}), /* @__PURE__ */ I("div", {
 				className: "bree-tiles",
-				children: t.map((e) => /* @__PURE__ */ L(Mr, { item: e }, e.id))
+				children: t.map((e) => /* @__PURE__ */ I(Lr, { item: e }, e.id))
 			})] }, e.id) : null;
-		}), n !== null && /* @__PURE__ */ L("p", {
+		}), n !== null && /* @__PURE__ */ I("p", {
 			className: "bree-hint",
 			children: n ?? a.t.sidebar.dragHint
 		})]
@@ -4003,7 +4049,7 @@ function Nr({ items: e, groups: t, hint: n, className: r, style: i }) {
 }
 //#endregion
 //#region src/components/ContentPanel.tsx
-function Pr({ ctx: e, tabs: t = [
+function zr({ ctx: e, tabs: t = [
 	"content",
 	"blocks",
 	"body"
@@ -4012,34 +4058,34 @@ function Pr({ ctx: e, tabs: t = [
 		content: {
 			id: "content",
 			label: a.sidebar.tabContent,
-			render: () => /* @__PURE__ */ L(Nr, {})
+			render: () => /* @__PURE__ */ I(Rr, {})
 		},
 		blocks: {
 			id: "blocks",
 			label: a.sidebar.tabBlocks,
-			render: () => /* @__PURE__ */ L(Dr, {})
+			render: () => /* @__PURE__ */ I(Mr, {})
 		},
 		body: {
 			id: "body",
 			label: a.sidebar.tabBody,
-			render: (e) => /* @__PURE__ */ L(jr, { ctx: e })
+			render: (e) => /* @__PURE__ */ I(Ir, { ctx: e })
 		}
 	}, s = t.map((e) => typeof e == "string" ? o[e] : e), [c, l] = u(n ?? s[0]?.id), d = s.find((e) => e.id === c) ?? s[0];
-	return /* @__PURE__ */ R("div", {
-		className: z("bree-content-panel", r),
+	return /* @__PURE__ */ L("div", {
+		className: R("bree-content-panel", r),
 		style: i,
-		children: [s.length > 1 && /* @__PURE__ */ L("nav", {
+		children: [s.length > 1 && /* @__PURE__ */ I("nav", {
 			className: "bree-tabs",
 			role: "tablist",
-			children: s.map((e) => /* @__PURE__ */ L("button", {
+			children: s.map((e) => /* @__PURE__ */ I("button", {
 				type: "button",
 				role: "tab",
 				"aria-selected": e.id === d?.id,
-				className: z(e.id === d?.id && "bree-active"),
+				className: R(e.id === d?.id && "bree-active"),
 				onClick: () => l(e.id),
 				children: e.label
 			}, e.id))
-		}), /* @__PURE__ */ L("div", {
+		}), /* @__PURE__ */ I("div", {
 			className: "bree-panel-scroll",
 			children: d?.render(e)
 		})]
@@ -4047,66 +4093,66 @@ function Pr({ ctx: e, tabs: t = [
 }
 //#endregion
 //#region src/components/TextProperties.tsx
-function Fr({ ctx: e, className: t, style: n }) {
+function Br({ ctx: e, className: t, style: n }) {
 	let r = $(), i = r.inspector, a = [
 		{
 			mark: "bold",
-			Icon: j,
+			Icon: le,
 			title: i.bold
 		},
 		{
 			mark: "italic",
-			Icon: he,
+			Icon: _e,
 			title: i.italic
 		},
 		{
 			mark: "underline",
-			Icon: ke,
+			Icon: je,
 			title: i.underline
 		},
 		{
 			mark: "strike",
-			Icon: Te,
+			Icon: De,
 			title: i.strike
 		}
 	];
-	return /* @__PURE__ */ R(Cr, {
+	return /* @__PURE__ */ L(Or, {
 		title: r.sidebar.selectedText,
 		className: t,
 		style: n,
 		children: [
-			/* @__PURE__ */ L(V, {
+			/* @__PURE__ */ I(V, {
 				title: i.formatting,
-				children: /* @__PURE__ */ L("div", {
+				children: /* @__PURE__ */ I("div", {
 					className: "bree-mark-row",
-					children: a.map(({ mark: t, Icon: n, title: r }) => /* @__PURE__ */ L("button", {
+					children: a.map(({ mark: t, Icon: n, title: r }) => /* @__PURE__ */ I("button", {
 						type: "button",
 						title: r,
 						"aria-pressed": !!e.marks[t],
-						className: z("bree-mark", e.marks[t] && "bree-active"),
+						className: R("bree-mark", e.marks[t] && "bree-active"),
 						onClick: () => e.toggleMark(t),
-						children: /* @__PURE__ */ L(n, { size: 14 })
+						children: /* @__PURE__ */ I(n, { size: 14 })
 					}, t))
 				})
 			}),
-			/* @__PURE__ */ L(ln, {
+			/* @__PURE__ */ I(mn, {
 				ctx: e,
 				alignment: e.alignment,
 				setAlignment: e.setAlignment
 			}),
-			e.isLinkActive && /* @__PURE__ */ R(V, {
+			e.isLinkActive && /* @__PURE__ */ L(V, {
 				title: i.link,
-				children: [/* @__PURE__ */ L(H, {
+				children: [/* @__PURE__ */ I(H, {
 					label: i.url,
 					stacked: !0,
-					children: /* @__PURE__ */ L("span", {
+					children: /* @__PURE__ */ I("span", {
 						className: "bree-readonly",
 						children: e.linkHref
 					})
-				}), /* @__PURE__ */ L(H, {
+				}), /* @__PURE__ */ I(H, {
 					label: i.linkColor,
 					stacked: !0,
-					children: /* @__PURE__ */ L(G, {
+					children: /* @__PURE__ */ I(G, {
 						value: e.linkColor,
 						presets: e.presetColors,
 						onChange: e.setLinkColor
@@ -4118,26 +4164,26 @@ function Fr({ ctx: e, className: t, style: n }) {
 }
 //#endregion
 //#region src/components/Sidebar.tsx
-function Ir({ renderDocument: e = (e) => /* @__PURE__ */ L(Pr, { ctx: e }), renderNode: t = (e) => /* @__PURE__ */ L(wr, { ctx: e }), renderText: n = (e) => /* @__PURE__ */ L(Fr, { ctx: e }), className: r, style: i }) {
+function Vr({ renderDocument: e = (e) => /* @__PURE__ */ I(zr, { ctx: e }), renderNode: t = (e) => /* @__PURE__ */ I(kr, { ctx: e }), renderText: n = (e) => /* @__PURE__ */ I(Br, { ctx: e }), className: r, style: i }) {
 	let { t: a } = Q();
-	return /* @__PURE__ */ R(N.Root, {
-		className: z("bree-sidebar", r),
+	return /* @__PURE__ */ L(N.Root, {
+		className: R("bree-sidebar", r),
 		style: i,
 		"aria-label": a.sidebar.label,
 		children: [
-			/* @__PURE__ */ L(N.Document, { children: e }),
-			/* @__PURE__ */ L(N.Node, { children: t }),
-			/* @__PURE__ */ L(N.Text, { children: n })
+			/* @__PURE__ */ I(N.Document, { children: e }),
+			/* @__PURE__ */ I(N.Node, { children: t }),
+			/* @__PURE__ */ I(N.Text, { children: n })
 		]
 	});
 }
 //#endregion
 //#region src/components/PreviewDialog.tsx
-function Lr(e, t, n) {
+function Hr(e, t, n) {
 	let r = URL.createObjectURL(new Blob([t], { type: n })), i = document.createElement("a");
 	i.href = r, i.download = e, i.click(), URL.revokeObjectURL(r);
 }
-function Rr({ onClose: e, defaultView: t = "desktop", views: n = [
+function Ur({ onClose: e, defaultView: t = "desktop", views: n = [
 	"desktop",
 	"mobile",
 	"html",
@@ -4156,76 +4202,76 @@ function Rr({ onClose: e, defaultView: t = "desktop", views: n = [
 	let y = async () => {
 		p && (await navigator.clipboard.writeText(d === "text" ? p.text : p.html), v(!0), setTimeout(() => v(!1), 1500));
 	}, b = l.preview;
-	return Be(/* @__PURE__ */ L(M, { children: /* @__PURE__ */ L("div", {
+	return Ue(/* @__PURE__ */ I(M, { children: /* @__PURE__ */ I("div", {
 		className: "bree bree-modal-backdrop",
 		onMouseDown: (t) => t.target === t.currentTarget && e(),
-		children: /* @__PURE__ */ R("div", {
-			className: z("bree-modal", a),
+		children: /* @__PURE__ */ L("div", {
+			className: R("bree-modal", a),
 			style: o,
 			role: "dialog",
 			"aria-modal": "true",
 			"aria-label": b.dialogLabel,
-			children: [/* @__PURE__ */ R("header", {
+			children: [/* @__PURE__ */ L("header", {
 				className: "bree-modal-header",
-				children: [/* @__PURE__ */ L("nav", {
+				children: [/* @__PURE__ */ I("nav", {
 					className: "bree-tabs bree-compact",
 					role: "tablist",
-					children: n.map((e) => /* @__PURE__ */ L("button", {
+					children: n.map((e) => /* @__PURE__ */ I("button", {
 						type: "button",
 						role: "tab",
 						"aria-selected": d === e,
-						className: z(d === e && "bree-active"),
+						className: R(d === e && "bree-active"),
 						onClick: () => f(e),
 						children: b[e]
 					}, e))
-				}), /* @__PURE__ */ R("div", {
+				}), /* @__PURE__ */ L("div", {
 					className: "bree-modal-actions",
 					children: [
-						p && (d === "html" || d === "text") && /* @__PURE__ */ L("button", {
+						p && (d === "html" || d === "text") && /* @__PURE__ */ I("button", {
 							type: "button",
 							className: "bree-btn",
 							onClick: y,
 							children: _ ? b.copied : b.copy
 						}),
-						p && /* @__PURE__ */ L("button", {
+						p && /* @__PURE__ */ I("button", {
 							type: "button",
 							className: "bree-btn bree-primary",
-							onClick: () => Lr(r, p.unformattedHtml, "text/html"),
+							onClick: () => Hr(r, p.unformattedHtml, "text/html"),
 							children: b.download
 						}),
-						/* @__PURE__ */ L("button", {
+						/* @__PURE__ */ I("button", {
 							type: "button",
 							className: "bree-icon-button",
 							onClick: e,
 							title: b.close,
-							children: /* @__PURE__ */ L(Ae, { size: 18 })
+							children: /* @__PURE__ */ I(Me, { size: 18 })
 						})
 					]
 				})]
-			}), /* @__PURE__ */ R("div", {
+			}), /* @__PURE__ */ L("div", {
 				className: "bree-modal-body",
 				children: [
-					h && /* @__PURE__ */ L("p", {
+					h && /* @__PURE__ */ I("p", {
 						className: "bree-error",
 						children: b.renderError(h)
 					}),
-					!p && !h && /* @__PURE__ */ L("p", {
+					!p && !h && /* @__PURE__ */ I("p", {
 						className: "bree-loading",
 						children: b.rendering
 					}),
-					p && (d === "desktop" || d === "mobile") && /* @__PURE__ */ L("div", {
-						className: z("bree-preview-frame", `bree-preview-${d}`),
-						children: /* @__PURE__ */ L("iframe", {
+					p && (d === "desktop" || d === "mobile") && /* @__PURE__ */ I("div", {
+						className: R("bree-preview-frame", `bree-preview-${d}`),
+						children: /* @__PURE__ */ I("iframe", {
 							title: b.iframeTitle,
 							srcDoc: p.html,
 							sandbox: "allow-same-origin allow-popups"
 						})
 					}),
-					p && d === "html" && /* @__PURE__ */ L("pre", {
+					p && d === "html" && /* @__PURE__ */ I("pre", {
 						className: "bree-code",
 						children: p.html
 					}),
-					p && d === "text" && /* @__PURE__ */ L("pre", {
+					p && d === "text" && /* @__PURE__ */ I("pre", {
 						className: "bree-code",
 						children: p.text
 					})
@@ -4236,23 +4282,23 @@ function Rr({ onClose: e, defaultView: t = "desktop", views: n = [
 }
 //#endregion
 //#region src/components/TopBar.tsx
-function zr({ className: e, style: t }) {
+function Wr({ className: e, style: t }) {
 	let { layersOpen: n, setLayersOpen: r, t: i } = Q();
-	return /* @__PURE__ */ R("button", {
+	return /* @__PURE__ */ L("button", {
 		type: "button",
-		className: z("bree-btn bree-ghost bree-layers-toggle", n && "bree-active", e),
+		className: R("bree-btn bree-ghost bree-layers-toggle", n && "bree-active", e),
 		style: t,
 		"aria-pressed": n,
 		onClick: () => r(!n),
 		title: i.topBar.toggleLayers,
 		children: [
-			/* @__PURE__ */ L(Gt, {}),
+			/* @__PURE__ */ I(Xt, {}),
 			" ",
 			i.topBar.layers
 		]
 	});
 }
-function Br({ className: e, style: t }) {
+function Gr({ className: e, style: t }) {
 	let { editor: n, t: r } = Q(), i = g({
 		editor: n,
 		selector: ({ editor: e }) => ({
@@ -4260,57 +4306,57 @@ function Br({ className: e, style: t }) {
 			redo: !!e?.can().redo()
 		})
 	});
-	return /* @__PURE__ */ R("div", {
-		className: z("bree-btn-group", e),
+	return /* @__PURE__ */ L("div", {
+		className: R("bree-btn-group", e),
 		style: t,
-		children: [/* @__PURE__ */ L("button", {
+		children: [/* @__PURE__ */ I("button", {
 			type: "button",
 			className: "bree-icon-button",
 			title: r.topBar.undo,
 			disabled: !i?.undo,
 			onClick: () => n.chain().focus().undo().run(),
-			children: /* @__PURE__ */ L(Vt, {})
-		}), /* @__PURE__ */ L("button", {
+			children: /* @__PURE__ */ I(Kt, {})
+		}), /* @__PURE__ */ I("button", {
 			type: "button",
 			className: "bree-icon-button",
 			title: r.topBar.redo,
 			disabled: !i?.redo,
 			onClick: () => n.chain().focus().redo().run(),
-			children: /* @__PURE__ */ L(Ht, {})
+			children: /* @__PURE__ */ I(qt, {})
 		})]
 	});
 }
-function Vr({ className: e, style: t }) {
+function Kr({ className: e, style: t }) {
 	let { device: n, setDevice: r, t: i } = Q(), a = [{
 		id: "desktop",
 		label: i.topBar.desktop,
-		Icon: Ut
+		Icon: Jt
 	}, {
 		id: "mobile",
 		label: i.topBar.mobile,
-		Icon: Wt
+		Icon: Yt
 	}];
-	return /* @__PURE__ */ L("div", {
-		className: z("bree-segmented bree-device-toggle", e),
+	return /* @__PURE__ */ I("div", {
+		className: R("bree-segmented bree-device-toggle", e),
 		style: t,
 		role: "radiogroup",
 		"aria-label": i.topBar.canvasWidth,
-		children: a.map(({ id: e, label: t, Icon: i }) => /* @__PURE__ */ L("button", {
+		children: a.map(({ id: e, label: t, Icon: i }) => /* @__PURE__ */ I("button", {
 			type: "button",
 			role: "radio",
 			"aria-checked": n === e,
-			className: z(n === e && "bree-active"),
+			className: R(n === e && "bree-active"),
 			onClick: () => r(e),
 			title: t,
-			children: /* @__PURE__ */ L(i, {})
+			children: /* @__PURE__ */ I(i, {})
 		}, e))
 	});
 }
-function Hr({ className: e, style: t }) {
+function qr({ className: e, style: t }) {
 	let { editor: n, starterDocument: r, locale: i, t: a } = Q();
-	return /* @__PURE__ */ L("button", {
+	return /* @__PURE__ */ I("button", {
 		type: "button",
-		className: z("bree-btn bree-ghost", e),
+		className: R("bree-btn bree-ghost", e),
 		style: t,
 		onClick: () => {
 			confirm(a.topBar.confirmTemplate) && n.commands.setContent(r({
@@ -4321,7 +4367,7 @@ function Hr({ className: e, style: t }) {
 		children: a.topBar.template
 	});
 }
-function Ur({ className: e, style: t }) {
+function Jr({ className: e, style: t }) {
 	let { handle: n, t: r } = Q(), i = l(null), a = async (e) => {
 		try {
 			n.setValue(JSON.parse(await e.text()));
@@ -4329,13 +4375,13 @@ function Ur({ className: e, style: t }) {
 			alert(r.topBar.invalidFile(e instanceof Error ? e.message : String(e)));
 		}
 	};
-	return /* @__PURE__ */ R(I, { children: [/* @__PURE__ */ L("button", {
+	return /* @__PURE__ */ L(Pe, { children: [/* @__PURE__ */ I("button", {
 		type: "button",
-		className: z("bree-btn bree-ghost", e),
+		className: R("bree-btn bree-ghost", e),
 		style: t,
 		onClick: () => i.current?.click(),
 		children: r.topBar.import
-	}), /* @__PURE__ */ L("input", {
+	}), /* @__PURE__ */ I("input", {
 		ref: i,
 		type: "file",
 		accept: "application/json,.json",
@@ -4346,76 +4392,76 @@ function Ur({ className: e, style: t }) {
 		}
 	})] });
 }
-function Wr({ className: e, style: t, filename: n = "email.json" }) {
+function Yr({ className: e, style: t, filename: n = "email.json" }) {
 	let { handle: r, t: i } = Q();
-	return /* @__PURE__ */ L("button", {
+	return /* @__PURE__ */ I("button", {
 		type: "button",
-		className: z("bree-btn bree-ghost", e),
+		className: R("bree-btn bree-ghost", e),
 		style: t,
-		onClick: () => Lr(n, JSON.stringify(r.getValue(), null, 2), "application/json"),
+		onClick: () => Hr(n, JSON.stringify(r.getValue(), null, 2), "application/json"),
 		children: i.topBar.exportJson
 	});
 }
-function Gr({ view: e = "desktop", variant: t = "default", children: n, className: r, style: i }) {
+function Xr({ view: e = "desktop", variant: t = "default", children: n, className: r, style: i }) {
 	let { t: a } = Q(), [o, s] = u(!1);
-	return /* @__PURE__ */ R(I, { children: [/* @__PURE__ */ L("button", {
+	return /* @__PURE__ */ L(Pe, { children: [/* @__PURE__ */ I("button", {
 		type: "button",
-		className: z("bree-btn", t !== "default" && `bree-${t}`, r),
+		className: R("bree-btn", t !== "default" && `bree-${t}`, r),
 		style: i,
 		onClick: () => s(!0),
 		children: n ?? a.topBar.preview
-	}), o && /* @__PURE__ */ L(Rr, {
+	}), o && /* @__PURE__ */ I(Ur, {
 		defaultView: e,
 		onClose: () => s(!1)
 	})] });
 }
-function Kr(e) {
+function Zr(e) {
 	let { t } = Q();
-	return /* @__PURE__ */ L(Gr, {
+	return /* @__PURE__ */ I(Xr, {
 		view: "html",
 		variant: "primary",
 		...e,
 		children: t.topBar.exportHtml
 	});
 }
-function qr({ brand: e, actions: t, children: n, className: r, style: i }) {
-	return /* @__PURE__ */ L(M, { children: /* @__PURE__ */ R("header", {
-		className: z("bree-topbar", r),
+function Qr({ brand: e, actions: t, children: n, className: r, style: i }) {
+	return /* @__PURE__ */ I(M, { children: /* @__PURE__ */ L("header", {
+		className: R("bree-topbar", r),
 		style: i,
-		children: [/* @__PURE__ */ L("div", {
+		children: [/* @__PURE__ */ I("div", {
 			className: "bree-topbar-start",
 			children: e
-		}), n ?? /* @__PURE__ */ R(I, { children: [/* @__PURE__ */ L("div", {
+		}), n ?? /* @__PURE__ */ L(Pe, { children: [/* @__PURE__ */ I("div", {
 			className: "bree-topbar-center",
-			children: /* @__PURE__ */ L(Vr, {})
-		}), /* @__PURE__ */ R("div", {
+			children: /* @__PURE__ */ I(Kr, {})
+		}), /* @__PURE__ */ L("div", {
 			className: "bree-topbar-actions",
-			children: [t, /* @__PURE__ */ L(Kr, {})]
+			children: [t, /* @__PURE__ */ I(Zr, {})]
 		})] })]
 	}) });
 }
 //#endregion
 //#region src/components/BetterEmailEditor.tsx
-function Jr({ showTopBar: e = !0, showLayers: t = !0, showSidebar: n = !0, showEmailHeader: r = !1, components: i = {}, slotProps: a = {} }) {
-	let { layersOpen: o } = Q(), { TopBar: s = qr, LayersPanel: c = br, Canvas: l = mr, Sidebar: u = Ir } = i, d = t && o;
-	return /* @__PURE__ */ R("div", {
-		className: z("bree-layout", e && "bree-with-topbar", d && "bree-with-layers", n && "bree-with-sidebar"),
+function $r({ showTopBar: e = !0, showLayers: t = !0, showSidebar: n = !0, showEmailHeader: r = !1, components: i = {}, slotProps: a = {} }) {
+	let { layersOpen: o } = Q(), { TopBar: s = Qr, LayersPanel: c = Tr, Canvas: l = yr, Sidebar: u = Vr } = i, d = t && o;
+	return /* @__PURE__ */ L("div", {
+		className: R("bree-layout", e && "bree-with-topbar", d && "bree-with-layers", n && "bree-with-sidebar"),
 		children: [
-			e && /* @__PURE__ */ L(s, { ...a.topBar }),
-			d && /* @__PURE__ */ L(c, { ...a.layersPanel }),
-			/* @__PURE__ */ L(l, {
+			e && /* @__PURE__ */ I(s, { ...a.topBar }),
+			d && /* @__PURE__ */ I(c, { ...a.layersPanel }),
+			/* @__PURE__ */ I(l, {
 				header: r,
 				...a.canvas
 			}),
-			n && /* @__PURE__ */ L(u, { ...a.sidebar })
+			n && /* @__PURE__ */ I(u, { ...a.sidebar })
 		]
 	});
 }
-var Yr = t(function({ showTopBar: e, showLayers: t, showSidebar: n, showEmailHeader: r, components: i, slotProps: a, ...o }, s) {
-	return /* @__PURE__ */ L(ar, {
+var ei = t(function({ showTopBar: e, showLayers: t, showSidebar: n, showEmailHeader: r, components: i, slotProps: a, ...o }, s) {
+	return /* @__PURE__ */ I(ur, {
 		ref: s,
 		...o,
-		children: /* @__PURE__ */ L(Jr, {
+		children: /* @__PURE__ */ I($r, {
 			showTopBar: e,
 			showLayers: t,
 			showSidebar: n,
@@ -4426,6 +4472,6 @@ var Yr = t(function({ showTopBar: e, showLayers: t, showSidebar: n, showEmailHea
 	});
 });
 //#endregion
-export { sn as AlignInput, Ue as BLOCK_CONTAINERS, Yr as BetterEmailEditor, wr as BlockProperties, Dr as BlocksTab, jr as BodyTab, un as BoxGroup, dn as ButtonInspector, We as COLUMN_PARENTS, mr as Canvas, ur as CanvasOverlay, G as ColorInput, fn as ColumnsInspector, vn as ContainerInspector, Pr as ContentPanel, Nr as ContentTab, tn as DEFAULT_SWATCHES, xr as DefaultInspector, Vr as DeviceToggle, _n as DividerInspector, ar as EditorRoot, dt as EmailButton, fr as EmailHeader, Kr as ExportHtmlButton, Wr as ExportJsonButton, H as Field, an as FontInput, V as Group, pn as HeadingInspector, Dn as HtmlBlock, gn as HtmlInspector, mn as ImageInspector, Ur as ImportButton, br as LayersPanel, zr as LayersToggle, W as NumberInput, cn as PaddingInput, Mr as PaletteTile, Gr as PreviewButton, Rr as PreviewDialog, Cr as PropertiesPanel, en as RangeInput, Sn as SOCIAL_NETWORKS, on as Segmented, rn as Select, Ir as Sidebar, En as SocialLinks, On as SocialLinksInspector, xn as Spacer, hn as SpacerInspector, q as SpacingGroup, Hr as TemplateButton, Er as TemplateCard, Z as TemplateThumbnail, Qt as TextArea, U as TextInput, Fr as TextProperties, qr as TopBar, ln as TypographyGroup, Br as UndoRedo, ut as appendBlocks, tt as applyDrop, Nn as content, Yn as createStarterDocument, K as css, z as cx, wt as defaultFonts, Mn as defaultNodes, Kn as defaultPalette, Gn as defaultPaletteGroups, qn as defaultTemplates, $n as defaultTheme, lt as deleteUnit, Lr as download, ct as duplicateUnit, kt as en, Xe as findDropTarget, Et as findFont, At as fr, wn as iconUrl, It as icons, yn as inlineStyleToObject, jt as locales, Wn as menuParagraph, at as parentUnit, er as readFileAsDataUrl, Mt as resolveLabel, Ft as resolveMessages, st as selectUnit, ot as selectedUnit, An as textPreview, nn as toHex, kn as truncate, rt as unitAt, Sr as useDeselect, Tr as useDraggableBlock, Q as useEmailEditor, Qn as useI18n, $ as useMessages, Zn as useOptionalEmailEditor };
+export { fn as AlignInput, Ke as BLOCK_CONTAINERS, ei as BetterEmailEditor, kr as BlockProperties, Mr as BlocksTab, Ir as BodyTab, hn as BoxGroup, gn as ButtonInspector, qe as COLUMN_PARENTS, yr as Canvas, hr as CanvasOverlay, G as ColorInput, _n as ColumnsInspector, Cn as ContainerInspector, zr as ContentPanel, Rr as ContentTab, sn as DEFAULT_SWATCHES, Er as DefaultInspector, Kr as DeviceToggle, Sn as DividerInspector, ur as EditorRoot, pt as EmailButton, _r as EmailHeader, Zr as ExportHtmlButton, Yr as ExportJsonButton, H as Field, un as FontInput, V as Group, vn as HeadingInspector, Mn as HtmlBlock, xn as HtmlInspector, yn as ImageInspector, Jr as ImportButton, Tr as LayersPanel, Wr as LayersToggle, W as NumberInput, pn as PaddingInput, Lr as PaletteTile, Xr as PreviewButton, Ur as PreviewDialog, Or as PropertiesPanel, on as RangeInput, Dn as SOCIAL_NETWORKS, dn as Segmented, ln as Select, Vr as Sidebar, jn as SocialLinks, Nn as SocialLinksInspector, En as Spacer, bn as SpacerInspector, q as SpacingGroup, qr as TemplateButton, jr as TemplateCard, Z as TemplateThumbnail, rn as TextArea, U as TextInput, Br as TextProperties, Qr as TopBar, mn as TypographyGroup, Gr as UndoRedo, ft as appendBlocks, it as applyDrop, Rn as content, er as createStarterDocument, K as css, R as cx, Dt as defaultFonts, Ln as defaultNodes, Zn as defaultPalette, Xn as defaultPaletteGroups, Qn as defaultTemplates, ir as defaultTheme, dt as deleteUnit, Hr as download, ut as duplicateUnit, Pt as en, $e as findDropTarget, kt as findFont, Ft as fr, kn as iconUrl, Vt as icons, wn as inlineStyleToObject, jt as linkWebFonts, It as locales, Yn as menuParagraph, st as parentUnit, ar as readFileAsDataUrl, Lt as resolveLabel, Bt as resolveMessages, lt as selectUnit, ct as selectedUnit, Fn as textPreview, cn as toHex, Pn as truncate, z as unitAt, Dr as useDeselect, Ar as useDraggableBlock, Q as useEmailEditor, rr as useI18n, $ as useMessages, nr as useOptionalEmailEditor, At as usedWebFonts };
 
 //# sourceMappingURL=index.js.map