fable-editor 1.0.0 → 1.0.2

package/dist/core/index.mjs

@@ -1,4 +1,4 @@
-const W = {
+const j = {
   en: {
     dir: "ltr",
     file: "File",
@@ -133,7 +133,13 @@ const W = {
     insertimg: "Insert",
     dropimage: "Drop image here",
     uploading: "Uploading…",
-    uploadfailed: "Upload failed — click to retry"
+    uploadfailed: "Upload failed — click to retry",
+    template: "Templates",
+    tplimgleft: "Image left, text right",
+    tplimgright: "Image right, text left",
+    tplimgtop: "Image top, text below",
+    tplimgcenter: "Text top, image center",
+    deltemplate: "Delete template"
   },
   ar: {
     dir: "rtl",
@@ -269,13 +275,19 @@ const W = {
     insertimg: "إدراج",
     dropimage: "أسقط الصورة هنا",
     uploading: "جارٍ الرفع…",
-    uploadfailed: "فشل الرفع — انقر لإعادة المحاولة"
+    uploadfailed: "فشل الرفع — انقر لإعادة المحاولة",
+    template: "قوالب",
+    tplimgleft: "صورة يسار، نص يمين",
+    tplimgright: "صورة يمين، نص يسار",
+    tplimgtop: "صورة أعلى، نص أسفل",
+    tplimgcenter: "نص أعلى، صورة وسط",
+    deltemplate: "حذف القالب"
   }
 };
 function B(p) {
-  return W[p];
+  return j[p];
 }
-const U = "undo redo | preview print | importword revhistory | fontfamily fontsize | fontsizeincrease fontsizedecrease | bold italic underline strikethrough | forecolor backcolor | alignleft aligncenter alignright alignjustify | bullist numlist | outdent indent | link blockquote changecase lineheight wordspacing | removeformat | blocks | ltr rtl | quickimage quicktable charmap | fullscreen sourcecode", j = "file edit view insert format tools table help", X = [
+const X = "undo redo | preview print | importword revhistory | fontfamily fontsize | fontsizeincrease fontsizedecrease | bold italic underline strikethrough | forecolor backcolor | alignleft aligncenter alignright alignjustify | bullist numlist | outdent indent | link blockquote changecase lineheight wordspacing | removeformat | blocks | ltr rtl | quickimage quicktable template charmap | fullscreen sourcecode", _ = "file edit view insert format tools table help", Q = [
   ["Andale Mono", "andale mono,times"],
   ["Arial", "arial,helvetica,sans-serif"],
   ["Arial Black", "arial black,avant garde"],
@@ -295,7 +307,7 @@ const U = "undo redo | preview print | importword revhistory | fontfamily fontsi
   ["Verdana", "verdana,geneva"],
   ["Webdings", "webdings"],
   ["Wingdings", "wingdings,zapf dingbats"]
-], _ = ["8px", "9px", "10px", "11px", "12px", "14px", "16px", "18px", "20px", "24px", "28px", "32px", "36px", "48px", "72px", "96px"], Q = 1, G = 100, Y = ["1", "1.15", "1.4", "1.5", "1.75", "2", "2.5", "3"], K = ["1px", "2px", "4px", "6px", "8px", "12px"], D = [
+], Y = ["8px", "9px", "10px", "11px", "12px", "14px", "16px", "18px", "20px", "24px", "28px", "32px", "36px", "48px", "72px", "96px"], G = 1, K = 100, V = ["1", "1.15", "1.4", "1.5", "1.75", "2", "2.5", "3"], J = ["1px", "2px", "4px", "6px", "8px", "12px"], P = [
   ["p", "para"],
   ["h1", "heading1"],
   ["h2", "heading2"],
@@ -304,7 +316,7 @@ const U = "undo redo | preview print | importword revhistory | fontfamily fontsi
   ["h5", "heading5"],
   ["h6", "heading6"],
   ["pre", "pre"]
-], V = ["#F76707", "#4263EB", "#CC5DE8"], J = [
+], tt = ["#F76707", "#4263EB", "#CC5DE8"], et = [
   "#BFEDD2",
   "#FBEEB8",
   "#F8CAC6",
@@ -327,7 +339,7 @@ const U = "undo redo | preview print | importword revhistory | fontfamily fontsi
   "#34495E",
   "#000000",
   "#FFFFFF"
-], tt = [
+], it = [
   "©",
   "®",
   "™",
@@ -376,7 +388,7 @@ const U = "undo redo | preview print | importword revhistory | fontfamily fontsi
   "ـ",
   "٠",
   "١"
-], w = (p, t) => `<svg viewBox="${t || "0 0 24 24"}">${p}</svg>`, u = (p) => w(`<path class="f" d="${p}"/>`, "0 -960 960 960"), k = (p, t = 7.5) => w(
+], b = (p, t) => `<svg viewBox="${t || "0 0 24 24"}">${p}</svg>`, u = (p) => b(`<path class="f" d="${p}"/>`, "0 -960 960 960"), L = (p, t = 7.5) => b(
   '<path d="M10 6h10M10 12h10M10 18h10"/>' + p.map(
     (e, i) => `<text x="2.5" y="${8.4 + i * 6}" font-size="${t}" stroke="none" fill="#222f3e" font-family="Arial">${e}</text>`
   ).join("")
@@ -423,7 +435,7 @@ const U = "undo redo | preview print | importword revhistory | fontfamily fontsi
   bullist: u(
     "M360-200v-80h480v80H360Zm0-240v-80h480v80H360Zm0-240v-80h480v80H360ZM200-160q-33 0-56.5-23.5T120-240q0-33 23.5-56.5T200-320q33 0 56.5 23.5T280-240q0 33-23.5 56.5T200-160Zm0-240q-33 0-56.5-23.5T120-480q0-33 23.5-56.5T200-560q33 0 56.5 23.5T280-480q0 33-23.5 56.5T200-400Zm-56.5-263.5Q120-687 120-720t23.5-56.5Q167-800 200-800t56.5 23.5Q280-753 280-720t-23.5 56.5Q233-640 200-640t-56.5-23.5Z"
   ),
-  chev: w('<path d="M2 3.5 6 7.5 10 3.5"/>', "0 0 12 11"),
+  chev: b('<path d="M2 3.5 6 7.5 10 3.5"/>', "0 0 12 11"),
   backcolor: u(
     "M440-80q-33 0-56.5-23.5T360-160v-160H240q-33 0-56.5-23.5T160-400v-280q0-66 47-113t113-47h480v440q0 33-23.5 56.5T720-320H600v160q0 33-23.5 56.5T520-80h-80ZM240-560h480v-200h-40v160h-80v-160h-40v80h-80v-80H320q-33 0-56.5 23.5T240-680v120Zm0 160h480v-80H240v80Zm0 0v-80 80Z"
   ),
@@ -433,7 +445,7 @@ const U = "undo redo | preview print | importword revhistory | fontfamily fontsi
   indent: u(
     "M120-120v-80h720v80H120Zm320-160v-80h400v80H440Zm0-160v-80h400v80H440Zm0-160v-80h400v80H440ZM120-760v-80h720v80H120Zm0 440v-320l160 160-160 160Z"
   ),
-  more: w(
+  more: b(
     '<circle class="f" cx="5" cy="12" r="1.7"/><circle class="f" cx="12" cy="12" r="1.7"/><circle class="f" cx="19" cy="12" r="1.7"/>'
   ),
   image: u(
@@ -445,17 +457,17 @@ const U = "undo redo | preview print | importword revhistory | fontfamily fontsi
   tableic: u(
     "M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Zm240-240H200v160h240v-160Zm80 0v160h240v-160H520Zm-80-80v-160H200v160h240Zm80 0h240v-160H520v160ZM200-680h560v-80H200v80Z"
   ),
-  hric: w('<path d="M4 12h16"/>'),
+  hric: b('<path d="M4 12h16"/>'),
   charic: u(
     "M120-120v-120h200q-84-45-132-125t-48-175q0-142 99-241t241-99q142 0 241 99t99 241q0 95-48 175T640-240h200v120H520v-204q78-14 129-75t51-141q0-92-64-156t-156-64q-92 0-156 64t-64 156q0 80 51 141t129 75v204H120Z"
   ),
-  dateic: w(
+  dateic: b(
     '<rect x="4" y="6" width="16" height="14" rx="1.5"/><path d="M4 10h16M8 4v4M16 4v4"/>'
   ),
   pbic: u(
     "M240-80q-33 0-56.5-23.5T160-160v-120h80v120h480v-120h80v120q0 33-23.5 56.5T720-80H240Zm-80-440v-280q0-33 23.5-56.5T240-880h320l240 240v120h-80v-80H520v-200H240v280h-80Zm200 160v-80h240v80H360Zm320 0v-80h240v80H680Zm-640 0v-80h240v80H40Zm440-160Zm0 240Z"
   ),
-  nbspic: w('<path d="M6 12v4h12v-4"/>'),
+  nbspic: b('<path d="M6 12v4h12v-4"/>'),
   srcic: u(
     "M240-280 40-480l200-200 56 56-143 144 143 144-56 56Zm178 132-76-24 200-640 76 24-200 640Zm302-132-56-56 143-144-143-144 56-56 200 200-200 200Z"
   ),
@@ -483,11 +495,11 @@ const U = "undo redo | preview print | importword revhistory | fontfamily fontsi
   subscriptic: u(
     "M760-160v-80q0-17 11.5-28.5T800-280h80v-40H760v-40h120q17 0 28.5 11.5T920-320v40q0 17-11.5 28.5T880-240h-80v40h120v40H760Zm-525-80 185-291-172-269h106l124 200h4l123-200h107L539-531l186 291H618L482-457h-4L342-240H235Z"
   ),
-  newic: w('<path d="M6 3h8l5 5v13H6z"/><path d="M14 3v5h5"/>'),
-  helpic: w(
+  newic: b('<path d="M6 3h8l5 5v13H6z"/><path d="M14 3v5h5"/>'),
+  helpic: b(
     '<circle cx="12" cy="12" r="8.5"/><path d="M9.6 9.6a2.5 2.5 0 1 1 3.4 2.6c-.8.3-1 .9-1 1.8"/><circle class="f" cx="12" cy="16.6" r="1.1"/>'
   ),
-  wcic: w('<path d="M4 6h16M4 10h16M4 14h9"/><path d="M15 17.5l2 2 3.6-4"/>'),
+  wcic: b('<path d="M4 6h16M4 10h16M4 14h9"/><path d="M15 17.5l2 2 3.6-4"/>'),
   rowbefore: u(
     "M200-160h560v-240H200v240Zm640 80H120v-720h160v80h-80v240h560v-240h-80v-80h160v720ZM480-480Zm0 80v-80 80Zm0 0Zm-40-240v-80h-80v-80h80v-80h80v80h80v80h-80v80h-80Z"
   ),
@@ -506,7 +518,7 @@ const U = "undo redo | preview print | importword revhistory | fontfamily fontsi
   coldelete: u(
     "M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200ZM200-200h560v-560H200ZM400-200v-560h160v560H400ZM330-580l250 250 50-50-250-250ZM330-380l250-250 50 50-250 250Z"
   ),
-  tabledelete: w(
+  tabledelete: b(
     '<rect x="4" y="5" width="16" height="14" rx="1.5"/><path d="M4 10h16M4 14.5h16M9.5 5v14M14.5 5v14"/><path d="M6.5 6.5l11 11M17.5 6.5l-11 11" stroke-width="2.1"/>'
   ),
   quote: u(
@@ -515,7 +527,7 @@ const U = "undo redo | preview print | importword revhistory | fontfamily fontsi
   link: u(
     "M440-280H280q-83 0-141.5-58.5T80-480q0-83 58.5-141.5T280-680h160v80H280q-50 0-85 35t-35 85q0 50 35 85t85 35h160v80ZM320-440v-80h320v80H320Zm200 160v-80h160q50 0 85-35t35-85q0-50-35-85t-85-35H520v-80h160q83 0 141.5 58.5T880-480q0 83-58.5 141.5T680-280H520Z"
   ),
-  unlink: w(
+  unlink: b(
     '<path d="M13.5 6.5l1.7-1.7a4 4 0 0 1 5.6 5.6L19 12.2"/><path d="M10.5 17.5l-1.7 1.7a4 4 0 0 1-5.6-5.6L5 11.8"/><path d="M4 4l16 16"/>'
   ),
   lineheight: u(
@@ -536,8 +548,8 @@ const U = "undo redo | preview print | importword revhistory | fontfamily fontsi
   capitalizeic: u(
     "M344-250v-366H224v-64h308v64H412v366h-68Zm344 10q-44 0-69-25.5T594-336v-162h-54v-58h54v-87h66v87h74v58h-74v148q0 23 10.5 36t28.5 13q9 0 18.5-3.5T736-314v65q-10 5-22 7t-26 2Z"
   ),
-  plus: w('<path d="M12 5.5v13M5.5 12h13"/>'),
-  minus: w('<path d="M5.5 12h13"/>'),
+  plus: b('<path d="M12 5.5v13M5.5 12h13"/>'),
+  minus: b('<path d="M5.5 12h13"/>'),
   fontsizeup: u(
     "m40-200 210-560h100l210 560h-96l-51-143H187l-51 143H40Zm176-224h168l-82-232h-4l-82 232Zm504 104v-120H600v-80h120v-120h80v120h120v80H800v120h-80Z"
   ),
@@ -547,29 +559,44 @@ const U = "undo redo | preview print | importword revhistory | fontfamily fontsi
   historyic: u(
     "M480-120q-138 0-240.5-91.5T122-440h82q14 104 92.5 172T480-200q117 0 198.5-81.5T760-480q0-117-81.5-198.5T480-760q-69 0-129 32t-101 88h110v80H120v-240h80v94q51-64 124.5-99T480-840q75 0 140.5 28.5t114 77q48.5 48.5 77 114T840-480q0 75-28.5 140.5t-77 114q-48.5 48.5-114 77T480-120Zm112-192L440-464v-216h80v184l128 128-56 56Z"
   ),
-  wordic: w(
+  wordic: b(
     '<path d="M6 3h8l5 5v13H6z"/><path d="M14 3v5h5"/><text x="8" y="17" font-size="8.5" stroke="none" fill="#222f3e" font-family="Arial" font-weight="bold">W</text>'
   ),
   draftic: u(
     "M480-160q-134 0-227-93t-93-227q0-134 93-227t227-93q69 0 132 28.5T720-690v-110h80v280H520v-80h168q-32-56-87.5-88T480-720q-100 0-170 70t-70 170q0 100 70 170t170 70q77 0 139-44t87-116h84q-28 106-114 173t-196 67Z"
   ),
-  trash: w(
+  trash: b(
     '<path d="M5 7h14M10 7V5h4v2M7.5 7l1 13h7l1-13"/>'
   ),
-  rotateleft: w(
+  templateic: b(
+    '<rect x="4" y="4" width="16" height="16" rx="1.5"/><rect x="6.5" y="6.5" width="5" height="5" rx=".5"/><path d="M14 7.5h3.5M14 10h3.5M6.5 14h11M6.5 17h11"/>'
+  ),
+  tplleft: b(
+    '<rect x="3" y="5" width="8" height="8" rx=".8"/><path d="M13.5 6.5H21M13.5 9.5H21M13.5 12.5H21M3 15.5h18M3 18.5h18"/>'
+  ),
+  tplright: b(
+    '<rect x="13" y="5" width="8" height="8" rx=".8"/><path d="M3 6.5h7.5M3 9.5h7.5M3 12.5h7.5M3 15.5h18M3 18.5h18"/>'
+  ),
+  tpltop: b(
+    '<rect x="5" y="3" width="14" height="9" rx=".8"/><path d="M3 15h18M3 18h18M3 21h12"/>'
+  ),
+  tplcenter: b(
+    '<path d="M3 4h18M3 7h18M3 10h12"/><rect x="5" y="12.5" width="14" height="9" rx=".8"/>'
+  ),
+  rotateleft: b(
     '<polyline points="1 4 1 10 7 10"/><path d="M3.51 15a9 9 0 1 0 2.13-9.36L1 10"/>'
   ),
-  rotateright: w(
+  rotateright: b(
     '<polyline points="23 4 23 10 17 10"/><path d="M20.49 15a9 9 0 1 1-2.12-9.36L23 10"/>'
   ),
-  fliphorizontal: w(
+  fliphorizontal: b(
     '<path d="M12 3v18"/><path d="M7 8l-4 4 4 4"/><path d="M17 8l4 4-4 4"/>'
   ),
-  flipvertical: w(
+  flipvertical: b(
     '<path d="M3 12h18"/><path d="M8 7l4-4 4 4"/><path d="M8 17l4 4 4-4"/>'
   ),
-  check: w('<path d="M5 12.5 9.5 17 19 7"/>'),
-  palette: w(
+  check: b('<path d="M5 12.5 9.5 17 19 7"/>'),
+  palette: b(
     '<path d="M12 3a9 9 0 1 0 0 18h1.2a2 2 0 0 0 2-2 2 2 0 0 1 2-2H18a3 3 0 0 0 3-3c0-6.1-4.5-11-9-11z"/><circle class="f" cx="7.8" cy="10.2" r="1.3"/><circle class="f" cx="11.6" cy="7.3" r="1.3"/><circle class="f" cx="15.8" cy="9.6" r="1.3"/><circle class="f" cx="9" cy="14.8" r="1.3"/>'
   ),
   ul_circle: u(
@@ -578,11 +605,11 @@ const U = "undo redo | preview print | importword revhistory | fontfamily fontsi
   ul_square: u(
     "M80-160v-160h160v160H80Zm240 0v-160h560v160H320ZM80-400v-160h160v160H80Zm240 0v-160h560v160H320ZM80-640v-160h160v160H80Zm240 0v-160h560v160H320Z"
   ),
-  ol_alpha: k(["a", "b", "c"]),
-  ol_roman: k(["i", "ii", "iii"], 6.5),
-  ol_alphau: k(["A", "B", "C"]),
-  ol_romanu: k(["I", "II", "III"], 6.5)
-}, yt = (p) => `<span class="txt">${p}</span>`, et = /* @__PURE__ */ new Set([
+  ol_alpha: L(["a", "b", "c"]),
+  ol_roman: L(["i", "ii", "iii"], 6.5),
+  ol_alphau: L(["A", "B", "C"]),
+  ol_romanu: L(["I", "II", "III"], 6.5)
+}, Ct = (p) => `<span class="txt">${p}</span>`, st = /* @__PURE__ */ new Set([
   "p",
   "div",
   "span",
@@ -624,7 +651,7 @@ const U = "undo redo | preview print | importword revhistory | fontfamily fontsi
   "figure",
   "figcaption",
   "mark"
-]), it = /* @__PURE__ */ new Set([
+]), lt = /* @__PURE__ */ new Set([
   "text-align",
   "direction",
   "unicode-bidi",
@@ -680,7 +707,7 @@ const U = "undo redo | preview print | importword revhistory | fontfamily fontsi
   "box-sizing",
   "list-style-type",
   "white-space"
-]), R = {
+]), O = {
   "*": ["dir", "lang", "colspan", "rowspan"],
   a: ["href", "target", "rel", "title"],
   img: ["src", "alt", "width", "height", "title"],
@@ -696,13 +723,13 @@ function Z(p) {
     s < 1 || (t[i.slice(0, s).trim().toLowerCase()] = i.slice(s + 1).trim());
   }), t;
 }
-function st(p) {
+function nt(p) {
   return p.replace(/<!--\[if !supportLists\]-->([\s\S]*?)<!--\[endif\]-->/gi, "$1").replace(/<!--\[if !supportLists\]>([\s\S]*?)<!\[endif\]-->/gi, "$1").replace(/<!\[if !supportLists\]>([\s\S]*?)<!\[endif\]>/gi, "$1").replace(/<!--\[if [\s\S]*?<!\[endif\]-->/gi, "").replace(/<!--[\s\S]*?-->/g, "").replace(/<(script|style|xml|title)[\s\S]*?<\/\1>/gi, "").replace(/<\/?(meta|link)[^>]*>/gi, "").replace(/<\?xml[\s\S]*?\?>/gi, "").replace(/<\/?(o|v|w|m|st1):[^>]*>/gi, "");
 }
-function lt(p) {
+function ot(p) {
   return /^[0-9]+[\.\)،]/.test(p) ? { ordered: !0 } : /^[٠-٩۰-۹]+/.test(p) ? { ordered: !0, style: "arabic-indic" } : /^[ivxlc]{2,}[\.\)]/.test(p) ? { ordered: !0, style: "lower-roman" } : /^[IVXLC]{2,}[\.\)]/.test(p) ? { ordered: !0, style: "upper-roman" } : /^[a-z][\.\)]/.test(p) ? { ordered: !0, style: "lower-alpha" } : /^[A-Z][\.\)]/.test(p) ? { ordered: !0, style: "upper-alpha" } : /^[ء-ي][\.\)،-]/.test(p) ? { ordered: !0, style: "arabic-indic" } : { ordered: !1 };
 }
-function nt(p) {
+function rt(p) {
   const t = (s) => {
     const l = (s.getAttribute("style") || "") + " " + (s.className || "");
     return /mso-list\s*:(?!\s*ignore)/i.test(l) || /MsoListParagraph/i.test(l);
@@ -718,10 +745,10 @@ function nt(p) {
   }), e.forEach((s) => {
     const l = [], n = s[0];
     s.forEach((o) => {
-      var T, M, S;
+      var T, S, M;
       const c = +(((T = (o.getAttribute("style") || "").match(/level(\d+)/i)) == null ? void 0 : T[1]) || 1), h = Array.from(o.querySelectorAll("span")).find(
         (x) => /mso-list\s*:\s*ignore/i.test(x.getAttribute("style") || "")
-      ), d = h ? ((M = h.textContent) == null ? void 0 : M.trim()) || "" : (((S = o.textContent) == null ? void 0 : S.trim().match(/^\S{1,4}/)) || [""])[0], { ordered: m, style: g } = lt(d);
+      ), d = h ? ((S = h.textContent) == null ? void 0 : S.trim()) || "" : (((M = o.textContent) == null ? void 0 : M.trim().match(/^\S{1,4}/)) || [""])[0], { ordered: m, style: g } = ot(d);
       for (h && h.remove(); l.length && l[l.length - 1].level > c; ) l.pop();
       if (!l.length || l[l.length - 1].level < c) {
         const x = p.createElement(m ? "ol" : "ul");
@@ -732,19 +759,19 @@ function nt(p) {
           n.parentNode.insertBefore(x, n);
         l.push({ list: x, level: c });
       }
-      const f = p.createElement("li"), b = Z(o), v = ["text-align", "direction", "unicode-bidi", "color", "font-size", "font-family", "background-color"].filter((x) => b[x]).map((x) => x + ":" + b[x]).join(";");
-      for (v && f.setAttribute("style", v), o.getAttribute("dir") && f.setAttribute("dir", o.getAttribute("dir")); o.firstChild; ) f.appendChild(o.firstChild);
+      const f = p.createElement("li"), v = Z(o), y = ["text-align", "direction", "unicode-bidi", "color", "font-size", "font-family", "background-color"].filter((x) => v[x]).map((x) => x + ":" + v[x]).join(";");
+      for (y && f.setAttribute("style", y), o.getAttribute("dir") && f.setAttribute("dir", o.getAttribute("dir")); o.firstChild; ) f.appendChild(o.firstChild);
       l[l.length - 1].list.appendChild(f), o.remove();
     });
   });
 }
-function ot(p) {
+function at(p) {
   p.querySelectorAll('b[id^="docs-internal-guid"]').forEach((t) => {
     for (; t.firstChild; ) t.parentNode.insertBefore(t.firstChild, t);
     t.remove();
   });
 }
-function rt(p) {
+function ct(p) {
   p.querySelectorAll("table").forEach((t) => {
     const e = t;
     Z(e)["border-collapse"] || (e.style.borderCollapse = "collapse");
@@ -763,7 +790,7 @@ function rt(p) {
     e.style.backgroundColor = e.style.backgroundColor || e.getAttribute("bgcolor"), e.removeAttribute("bgcolor");
   });
 }
-function L(p, t) {
+function q(p, t) {
   Array.from(p.childNodes).forEach((e) => {
     if (e.nodeType === Node.COMMENT_NODE) {
       e.remove();
@@ -771,7 +798,7 @@ function L(p, t) {
     }
     if (e.nodeType !== Node.ELEMENT_NODE) return;
     const i = e, s = i.tagName.toLowerCase();
-    if (!et.has(s)) {
+    if (!st.has(s)) {
       if (s === "font") {
         const r = t.createElement("span");
         i.getAttribute("style") && r.setAttribute("style", i.getAttribute("style")), i.getAttribute("color") && (r.style.color = i.getAttribute("color")), i.getAttribute("face") && (r.style.fontFamily = i.getAttribute("face"));
@@ -789,14 +816,14 @@ function L(p, t) {
           h[c] && (r.style.fontSize = h[c]);
         }
         for (; i.firstChild; ) r.appendChild(i.firstChild);
-        i.replaceWith(r), L(r, t);
+        i.replaceWith(r), q(r, t);
         return;
       }
-      for (L(i, t); i.firstChild; ) i.parentNode.insertBefore(i.firstChild, i);
+      for (q(i, t); i.firstChild; ) i.parentNode.insertBefore(i.firstChild, i);
       i.remove();
       return;
     }
-    const l = /* @__PURE__ */ new Set([...R["*"] || [], ...R[s] || []]);
+    const l = /* @__PURE__ */ new Set([...O["*"] || [], ...O[s] || []]);
     if (Array.from(i.attributes).forEach((r) => {
       const c = r.name.toLowerCase();
       c !== "style" && !l.has(c) && i.removeAttribute(r.name);
@@ -814,14 +841,14 @@ function L(p, t) {
     }
     const n = Z(i), o = [];
     for (const [r, c] of Object.entries(n))
-      it.has(r) && (/expression|javascript|url\s*\(\s*['"]?\s*file:/i.test(c) || r === "font-weight" && /^(400|normal)$/i.test(c) || r === "font-style" && /^normal$/i.test(c) || r === "text-decoration" && /^none$/i.test(c) || o.push(r + ":" + c));
-    if (o.length ? i.setAttribute("style", o.join(";")) : i.removeAttribute("style"), i.removeAttribute("class"), L(i, t), s === "span" && !i.attributes.length) {
+      lt.has(r) && (/expression|javascript|url\s*\(\s*['"]?\s*file:/i.test(c) || r === "font-weight" && /^(400|normal)$/i.test(c) || r === "font-style" && /^normal$/i.test(c) || r === "text-decoration" && /^none$/i.test(c) || o.push(r + ":" + c));
+    if (o.length ? i.setAttribute("style", o.join(";")) : i.removeAttribute("style"), i.removeAttribute("class"), q(i, t), s === "span" && !i.attributes.length) {
       for (; i.firstChild; ) i.parentNode.insertBefore(i.firstChild, i);
       i.remove();
     }
   });
 }
-function at(p) {
+function ht(p) {
   const t = [], e = /<style[^>]*>([\s\S]*?)<\/style>/gi;
   let i;
   for (; i = e.exec(p); ) {
@@ -839,7 +866,7 @@ function at(p) {
   }
   return t;
 }
-function ct(p, t) {
+function dt(p, t) {
   if (!t.length) return;
   const e = /* @__PURE__ */ new Map();
   t.forEach(({ sel: i, decls: s }) => {
@@ -862,18 +889,18 @@ function ct(p, t) {
     s.setAttribute("style", h ? c + ";" + h : c);
   });
 }
-function z(p) {
+function U(p) {
   return p.replace(/[ﭐ-﷿ﹰ-ﻼ]+/g, (t) => t.normalize("NFKC"));
 }
-function ht(p) {
+function pt(p) {
   const t = p.createTreeWalker(p.body, NodeFilter.SHOW_TEXT, null);
   let e;
   for (; e = t.nextNode(); )
-    /[ﭐ-﷿ﹰ-ﻼ]/.test(e.nodeValue || "") && (e.nodeValue = z(e.nodeValue || ""));
+    /[ﭐ-﷿ﹰ-ﻼ]/.test(e.nodeValue || "") && (e.nodeValue = U(e.nodeValue || ""));
 }
-function dt(p, t = "ltr") {
-  const e = at(p), i = new DOMParser().parseFromString(st(p), "text/html");
-  ct(i, e), /class="?Mso|mso-|urn:schemas-microsoft-com/i.test(i.body.innerHTML) && nt(i), ot(i), rt(i), L(i.body, i), ht(i);
+function mt(p, t = "ltr") {
+  const e = ht(p), i = new DOMParser().parseFromString(nt(p), "text/html");
+  dt(i, e), /class="?Mso|mso-|urn:schemas-microsoft-com/i.test(i.body.innerHTML) && rt(i), at(i), ct(i), q(i.body, i), pt(i);
   const s = (l) => {
     var n;
     return l && l.tagName === "P" && !((n = l.textContent) != null && n.trim()) && !l.querySelector("img,table");
@@ -882,11 +909,11 @@ function dt(p, t = "ltr") {
   for (; s(i.body.lastElementChild); ) i.body.lastElementChild.remove();
   return i.body.innerHTML.trim();
 }
-function pt(p) {
-  const t = z(p).replace(/\r/g, ""), e = (i) => i.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+function ut(p) {
+  const t = U(p).replace(/\r/g, ""), e = (i) => i.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
   return /\n/.test(t) ? t.split(/\n{2,}/).map((i) => `<p dir="auto">${e(i).replace(/\n/g, "<br>") || "<br>"}</p>`).join("") : e(t);
 }
-function mt(p) {
+function gt(p) {
   const t = new DataView(p), e = /* @__PURE__ */ new Map();
   let i = -1;
   for (let o = p.byteLength - 22; o >= Math.max(0, p.byteLength - 22 - 65535); o--)
@@ -904,7 +931,7 @@ function mt(p) {
   }
   return e;
 }
-async function P(p, t) {
+async function $(p, t) {
   const e = new DataView(p, t.localOffset);
   if (e.getUint32(0, !0) !== 67324752) throw new Error("Bad local header");
   const i = e.getUint16(26, !0), s = e.getUint16(28, !0), l = t.localOffset + 30 + i + s, n = new Uint8Array(p.slice(l, l + t.compSize));
@@ -913,24 +940,24 @@ async function P(p, t) {
   const o = new Blob([n]).stream().pipeThrough(new DecompressionStream("deflate-raw"));
   return new Uint8Array(await new Response(o).arrayBuffer());
 }
-const O = (p) => p.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;"), I = (p, t) => Array.from(p.children).filter((e) => e.localName === t), C = (p, ...t) => {
+const F = (p) => p.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;"), I = (p, t) => Array.from(p.children).filter((e) => e.localName === t), C = (p, ...t) => {
   let e = p;
   for (const i of t) {
     if (!e) return null;
     e = Array.from(e.children).find((s) => s.localName === i) || null;
   }
   return e;
-}, y = (p, t = "val") => {
+}, w = (p, t = "val") => {
   if (!p) return "";
   for (const e of Array.from(p.attributes))
     if (e.localName === t) return e.value;
   return "";
-}, q = (p, t) => {
+}, k = (p, t) => {
   const e = p ? C(p, t) : null;
   if (!e) return !1;
-  const i = y(e);
+  const i = w(e);
   return i !== "false" && i !== "0";
-}, F = {
+}, z = {
   yellow: "#FFFF00",
   green: "#00FF00",
   cyan: "#00FFFF",
@@ -947,7 +974,7 @@ const O = (p) => p.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&
   lightGray: "#D3D3D3",
   black: "#000000",
   white: "#FFFFFF"
-}, ut = {
+}, ft = {
   png: "image/png",
   jpg: "image/jpeg",
   jpeg: "image/jpeg",
@@ -955,13 +982,13 @@ const O = (p) => p.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&
   bmp: "image/bmp",
   webp: "image/webp"
 };
-function gt(p) {
+function vt(p) {
   let t = "";
   for (let e = 0; e < p.length; e += 32768)
     t += String.fromCharCode(...p.subarray(e, e + 32768));
   return btoa(t);
 }
-class ft {
+class bt {
   constructor(t, e, i) {
     this.rels = t, this.images = e, this.numFmt = i;
   }
@@ -988,17 +1015,17 @@ class ft {
   paraList(t) {
     const e = C(t, "pPr", "numPr");
     if (!e) return null;
-    const i = y(C(e, "numId"));
+    const i = w(C(e, "numId"));
     if (!i || i === "0") return null;
-    const s = parseInt(y(C(e, "ilvl")) || "0", 10) || 0;
+    const s = parseInt(w(C(e, "ilvl")) || "0", 10) || 0;
     return { type: this.numFmt.get(i) || "ul", ilvl: Math.min(s, 8) };
   }
   convertPara(t) {
-    const e = C(t, "pPr"), i = y(C(t, "pPr", "pStyle"));
+    const e = C(t, "pPr"), i = w(C(t, "pPr", "pStyle"));
     let s = "p";
     const l = /^Heading([1-6])$/i.exec(i);
     l ? s = "h" + l[1] : /^Title$/i.test(i) && (s = "h1");
-    const n = [], o = y(C(t, "pPr", "jc"));
+    const n = [], o = w(C(t, "pPr", "jc"));
     o === "center" ? n.push("text-align:center") : o === "right" || o === "end" ? n.push("text-align:right") : (o === "both" || o === "distribute") && n.push("text-align:justify"), e && C(e, "bidi") && n.push("direction:rtl");
     const r = this.runsOf(t), c = n.length ? ` style="${n.join(";")}"` : "";
     return `<${s}${c}>${r || "<br>"}</${s}>`;
@@ -1008,11 +1035,11 @@ class ft {
     for (const i of Array.from(t.children))
       if (i.localName === "r") e += this.convertRun(i);
       else if (i.localName === "hyperlink") {
-        let s = this.rels.get(y(i, "id")) || "";
-        const l = y(i, "anchor");
+        let s = this.rels.get(w(i, "id")) || "";
+        const l = w(i, "anchor");
         !s && l && (s = "#" + l);
         const n = this.runsOf(i);
-        e += s ? `<a href="${O(s)}">${n}</a>` : n;
+        e += s ? `<a href="${F(s)}">${n}</a>` : n;
       } else (i.localName === "smartTag" || i.localName === "ins") && (e += this.runsOf(i));
     return e;
   }
@@ -1020,23 +1047,23 @@ class ft {
     const e = C(t, "rPr");
     let i = "";
     for (const d of Array.from(t.children))
-      d.localName === "t" ? i += O(d.textContent || "") : d.localName === "br" || d.localName === "cr" ? i += "<br>" : d.localName === "tab" ? i += "&emsp;" : (d.localName === "drawing" || d.localName === "pict" || d.localName === "object") && (i += this.convertImage(d));
+      d.localName === "t" ? i += F(d.textContent || "") : d.localName === "br" || d.localName === "cr" ? i += "<br>" : d.localName === "tab" ? i += "&emsp;" : (d.localName === "drawing" || d.localName === "pict" || d.localName === "object") && (i += this.convertImage(d));
     if (!i) return "";
-    const s = [], l = y(e ? C(e, "color") : null);
+    const s = [], l = w(e ? C(e, "color") : null);
     l && l !== "auto" && s.push("color:#" + l);
-    const n = y(e ? C(e, "highlight") : null);
-    n && F[n] && s.push("background-color:" + F[n]);
-    const o = parseFloat(y(e ? C(e, "sz") : null));
+    const n = w(e ? C(e, "highlight") : null);
+    n && z[n] && s.push("background-color:" + z[n]);
+    const o = parseFloat(w(e ? C(e, "sz") : null));
     o && s.push("font-size:" + Math.round(o / 2 * (4 / 3)) + "px");
-    const r = e ? C(e, "rFonts") : null, c = y(r, "ascii") || y(r, "cs");
-    c && s.push(`font-family:'${c}'`), s.length && (i = `<span style="${s.join(";")}">${i}</span>`), q(e, "b") && (i = `<strong>${i}</strong>`), q(e, "i") && (i = `<em>${i}</em>`), q(e, "u") && y(C(e, "u")) !== "none" && (i = `<u>${i}</u>`), q(e, "strike") && (i = `<s>${i}</s>`);
-    const h = y(e ? C(e, "vertAlign") : null);
+    const r = e ? C(e, "rFonts") : null, c = w(r, "ascii") || w(r, "cs");
+    c && s.push(`font-family:'${c}'`), s.length && (i = `<span style="${s.join(";")}">${i}</span>`), k(e, "b") && (i = `<strong>${i}</strong>`), k(e, "i") && (i = `<em>${i}</em>`), k(e, "u") && w(C(e, "u")) !== "none" && (i = `<u>${i}</u>`), k(e, "strike") && (i = `<s>${i}</s>`);
+    const h = w(e ? C(e, "vertAlign") : null);
     return h === "superscript" ? i = `<sup>${i}</sup>` : h === "subscript" && (i = `<sub>${i}</sub>`), i;
   }
   convertImage(t) {
     let e = "", i = 0;
     const s = (o) => {
-      if (o.localName === "blip" && (e = e || y(o, "embed") || y(o, "link")), o.localName === "imagedata" && (e = e || y(o, "id")), o.localName === "extent") {
+      if (o.localName === "blip" && (e = e || w(o, "embed") || w(o, "link")), o.localName === "imagedata" && (e = e || w(o, "id")), o.localName === "extent") {
         const r = parseFloat(o.getAttribute("cx") || "0");
         r && (i = Math.round(r / 9525));
       }
@@ -1053,7 +1080,7 @@ class ft {
     for (const i of I(t, "tr")) {
       e += "<tr>";
       for (const s of I(i, "tc")) {
-        const l = parseInt(y(C(s, "tcPr", "gridSpan")) || "1", 10) || 1, n = l > 1 ? ` colspan="${l}"` : "";
+        const l = parseInt(w(C(s, "tcPr", "gridSpan")) || "1", 10) || 1, n = l > 1 ? ` colspan="${l}"` : "";
         let o = "";
         for (const r of Array.from(s.children))
           r.localName === "p" ? o += this.convertPara(r) : r.localName === "tbl" && (o += this.convertTable(r));
@@ -1064,10 +1091,10 @@ class ft {
     return e + "</tbody></table>";
   }
 }
-async function bt(p) {
-  const t = p instanceof ArrayBuffer ? p : await p.arrayBuffer(), e = mt(t), i = new TextDecoder(), s = async (f) => {
-    const b = e.get(f);
-    return b ? new DOMParser().parseFromString(i.decode(await P(t, b)), "application/xml") : null;
+async function yt(p) {
+  const t = p instanceof ArrayBuffer ? p : await p.arrayBuffer(), e = gt(t), i = new TextDecoder(), s = async (f) => {
+    const v = e.get(f);
+    return v ? new DOMParser().parseFromString(i.decode(await $(t, v)), "application/xml") : null;
   }, l = await s("word/document.xml"), n = l == null ? void 0 : l.getElementsByTagName("*");
   let o = null;
   if (n) {
@@ -1082,39 +1109,49 @@ async function bt(p) {
   if (h)
     for (const f of Array.from(h.getElementsByTagName("*"))) {
       if (f.localName !== "Relationship") continue;
-      const b = f.getAttribute("Id") || "", v = f.getAttribute("Target") || "", T = f.getAttribute("Type") || "";
-      /hyperlink/i.test(T) ? r.set(b, v) : /image/i.test(T) && c.set(b, v);
+      const v = f.getAttribute("Id") || "", y = f.getAttribute("Target") || "", T = f.getAttribute("Type") || "";
+      /hyperlink/i.test(T) ? r.set(v, y) : /image/i.test(T) && c.set(v, y);
     }
   const d = /* @__PURE__ */ new Map();
-  for (const [f, b] of c) {
-    const v = b.startsWith("/") ? b.slice(1) : "word/" + b.replace(/^\.\//, ""), T = e.get(v);
+  for (const [f, v] of c) {
+    const y = v.startsWith("/") ? v.slice(1) : "word/" + v.replace(/^\.\//, ""), T = e.get(y);
     if (!T) continue;
-    const M = (v.split(".").pop() || "").toLowerCase(), S = ut[M];
-    if (S)
+    const S = (y.split(".").pop() || "").toLowerCase(), M = ft[S];
+    if (M)
       try {
-        d.set(f, `data:${S};base64,${gt(await P(t, T))}`);
+        d.set(f, `data:${M};base64,${vt(await $(t, T))}`);
       } catch {
       }
   }
   const m = /* @__PURE__ */ new Map(), g = await s("word/numbering.xml");
   if (g) {
-    const f = /* @__PURE__ */ new Map(), b = Array.from(g.getElementsByTagName("*"));
-    for (const v of b) {
-      if (v.localName !== "abstractNum") continue;
-      const T = y(v, "abstractNumId"), M = I(v, "lvl").find((x) => y(x, "ilvl") === "0") || I(v, "lvl")[0], S = M ? y(C(M, "numFmt")) : "";
-      f.set(T, S === "bullet" ? "ul" : "ol");
+    const f = /* @__PURE__ */ new Map(), v = Array.from(g.getElementsByTagName("*"));
+    for (const y of v) {
+      if (y.localName !== "abstractNum") continue;
+      const T = w(y, "abstractNumId"), S = I(y, "lvl").find((x) => w(x, "ilvl") === "0") || I(y, "lvl")[0], M = S ? w(C(S, "numFmt")) : "";
+      f.set(T, M === "bullet" ? "ul" : "ol");
     }
-    for (const v of b) {
-      if (v.localName !== "num") continue;
-      const T = y(v, "numId"), M = y(C(v, "abstractNumId"));
-      m.set(T, f.get(M) || "ul");
+    for (const y of v) {
+      if (y.localName !== "num") continue;
+      const T = w(y, "numId"), S = w(C(y, "abstractNumId"));
+      m.set(T, f.get(S) || "ul");
     }
   }
-  return new ft(r, d, m).convertBody(o);
+  return new bt(r, d, m).convertBody(o);
 }
-const vt = ["nw", "ne", "sw", "se"], A = class A {
+const wt = ["nw", "ne", "sw", "se"], D = ["img-left", "img-right", "img-top", "img-center"], R = {
+  "img-left": "tplimgleft",
+  "img-right": "tplimgright",
+  "img-top": "tplimgtop",
+  "img-center": "tplimgcenter"
+}, xt = {
+  "img-left": a.tplleft,
+  "img-right": a.tplright,
+  "img-top": a.tpltop,
+  "img-center": a.tplcenter
+}, A = class A {
   constructor(t) {
-    this.lang = "en", this.contentClass = "fable-content-" + A.instanceCounter++, this.contentStyleEl = null, this.savedRange = null, this.foreColor = "#000000", this.backColor = "#FACC15", this.openPop = null, this.openSubEl = null, this.popAnchor = null, this.dlgOvl = null, this.tblActive = null, this.tblCorner = null, this.tblColBars = [], this.tblCtx = null, this.tblCellMark = null, this.tblOpMark = null, this.tblOpMarkKind = null, this.imgActive = null, this.imgHandles = [], this.imgCtx = null, this.imgHideTimer = null, this.phActive = null, this.phCtx = null, this.phUploadTarget = null, this.selCtx = null, this.revisions = [], this.revTimer = null, this.draftTimer = null, this.draftStorageKey = "", this.listeners = [], this.isDestroyed = !1, this.options = {
+    this.lang = "en", this.contentClass = "fable-content-" + A.instanceCounter++, this.contentStyleEl = null, this.savedRange = null, this.foreColor = "#000000", this.backColor = "#FACC15", this.openPop = null, this.openSubEl = null, this.popAnchor = null, this.dlgOvl = null, this.tblActive = null, this.tblCorner = null, this.tblColBars = [], this.tblCtx = null, this.tblCellMark = null, this.tblOpMark = null, this.tblOpMarkKind = null, this.imgActive = null, this.imgHandles = [], this.imgCtx = null, this.imgHideTimer = null, this.phActive = null, this.phCtx = null, this.phUploadTarget = null, this.selCtx = null, this.tplActive = null, this.tplCtx = null, this.revisions = [], this.revTimer = null, this.draftTimer = null, this.draftStorageKey = "", this.listeners = [], this.isDestroyed = !1, this.options = {
       target: t.target,
       language: t.language || "en",
       height: t.height ?? 302,
@@ -1128,7 +1165,7 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
       statusbar: t.statusbar ?? !0,
       readonly: t.readonly ?? !1,
       draftKey: t.draftKey ?? (typeof location < "u" ? location.pathname : "default"),
-      fontFamilyFormats: t.fontFamilyFormats ?? X,
+      fontFamilyFormats: t.fontFamilyFormats ?? Q,
       imageFileTypes: t.imageFileTypes ?? ["image/jpeg", "image/jpg", "image/png", "image/gif", "image/bmp", "image/webp"]
     }, this.imageUploadHandler = t.imageUploadHandler, this.onImageUploadError = t.onImageUploadError, this.contentStyle = t.contentStyle, this.lang = this.options.language, this.draftStorageKey = "tmclone-draft:" + this.options.draftKey, this.initDOM(), this.bindEvents(), this.initUI(), this.recordRevision(), this.options.onReady(this);
   }
@@ -1185,9 +1222,9 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
       const t = window.getSelection();
       t && this.ed.contains(t.anchorNode) ? (this.saveSel(), this.refreshState(), this.updateSelToolbar(t), this.positionCellMarker()) : this.clearSelToolbar();
     }), this.on(this.ed, "input", () => {
-      this.refreshState(), this.onChange(), this.positionTableHandles(), this.positionImageHandles(), this.positionImgPhCtx();
+      this.refreshState(), this.onChange(), this.positionTableHandles(), this.positionImageHandles(), this.positionImgPhCtx(), this.positionTplCtx();
     }), this.on(this.ed, "keydown", (t) => {
-      t.altKey && t.key === "0" && (t.preventDefault(), this.helpDlg());
+      t.altKey && t.key === "0" && (t.preventDefault(), this.helpDlg()), (t.key === "Delete" || t.key === "Backspace") && this.phActive && (t.preventDefault(), this.removeImgPlaceholder());
     }), this.on(this.ed, "paste", (t) => this.handlePaste(t)), this.on(this.ed, "drop", (t) => {
       var s, l, n;
       t.preventDefault();
@@ -1196,13 +1233,15 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
       const i = Array.from(((n = t.dataTransfer) == null ? void 0 : n.files) || []).find((o) => o.type.startsWith("image/"));
       i && this.readImageFileInto(i, e);
     }), this.on(this.ed, "dragover", (t) => t.preventDefault()), this.on(this.ed, "mousedown", (t) => {
-      var n, o, r;
-      const e = t.target, i = (n = e.closest) == null ? void 0 : n.call(e, "table");
+      var o, r, c, h;
+      const e = t.target, i = (o = e.closest) == null ? void 0 : o.call(e, "table");
       i && this.ed.contains(i) ? this.selectTableForResize(i) : this.clearTableHandles();
-      const s = (o = e.closest) == null ? void 0 : o.call(e, ".img-ph");
-      s && this.ed.contains(s) && !this.options.readonly ? (t.preventDefault(), this.selectImgPlaceholder(s)) : this.clearImgPlaceholderSel();
-      const l = (r = e.closest) == null ? void 0 : r.call(e, "img");
-      l && this.ed.contains(l) && !this.options.readonly ? (t.preventDefault(), this.selectImage(l)) : this.clearImageHandles();
+      const s = (r = e.closest) == null ? void 0 : r.call(e, ".img-ph");
+      s && this.ed.contains(s) && !this.options.readonly ? (t.preventDefault(), this.ed.focus(), this.selectImgPlaceholder(s)) : this.clearImgPlaceholderSel();
+      const l = (c = e.closest) == null ? void 0 : c.call(e, ".tpl");
+      l && this.ed.contains(l) && !this.options.readonly ? this.selectTemplate(l) : this.clearTplSel();
+      const n = (h = e.closest) == null ? void 0 : h.call(e, "img");
+      n && this.ed.contains(n) && !this.options.readonly ? (t.preventDefault(), this.selectImage(n)) : this.clearImageHandles();
     }), this.on(this.ed, "mouseover", (t) => {
       var i, s;
       if (this.options.readonly) return;
@@ -1215,15 +1254,15 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
       const i = t.relatedTarget;
       i && ((n = this.imgCtx) != null && n.contains(i) || this.imgHandles.some((r) => r.contains(i)) || ((o = i.closest) == null ? void 0 : o.call(i, "img")) === e) || this.scheduleImgHide();
     }), this.on(this.ed, "scroll", () => {
-      this.positionTableHandles(), this.positionImageHandles(), this.positionImgPhCtx();
+      this.positionTableHandles(), this.positionImageHandles(), this.positionImgPhCtx(), this.positionTplCtx();
     }), this.onWin(
       "scroll",
       () => {
-        this.positionTableHandles(), this.positionImageHandles(), this.positionImgPhCtx(), this.repositionSelToolbar();
+        this.positionTableHandles(), this.positionImageHandles(), this.positionImgPhCtx(), this.positionTplCtx(), this.repositionSelToolbar();
       },
       !0
     ), this.onWin("resize", () => {
-      this.positionTableHandles(), this.positionImageHandles(), this.positionImgPhCtx(), this.repositionSelToolbar();
+      this.positionTableHandles(), this.positionImageHandles(), this.positionImgPhCtx(), this.positionTplCtx(), this.repositionSelToolbar();
     }), this.on(this.imgInput, "change", () => {
       var s;
       const t = (s = this.imgInput.files) == null ? void 0 : s[0];
@@ -1246,7 +1285,7 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
       const t = (e = this.docInput.files) == null ? void 0 : e[0];
       t && this.importWordFile(t).catch(() => alert(this.t("importfail")));
     }), this.onDoc("mousedown", (t) => {
-      this.ed.contains(t.target) || t.target === this.tblCorner || this.tblColBars.includes(t.target) || this.tblCtx && this.tblCtx.contains(t.target) || this.imgHandles.includes(t.target) || this.imgCtx && this.imgCtx.contains(t.target) || this.phCtx && this.phCtx.contains(t.target) || this.selCtx && this.selCtx.contains(t.target) || this.openPop && this.openPop.contains(t.target) || this.openSubEl && this.openSubEl.contains(t.target) || (this.clearTableHandles(), this.clearImageHandles(), this.clearImgPlaceholderSel(), this.clearSelToolbar());
+      this.ed.contains(t.target) || t.target === this.tblCorner || this.tblColBars.includes(t.target) || this.tblCtx && this.tblCtx.contains(t.target) || this.imgHandles.includes(t.target) || this.imgCtx && this.imgCtx.contains(t.target) || this.phCtx && this.phCtx.contains(t.target) || this.tplCtx && this.tplCtx.contains(t.target) || this.selCtx && this.selCtx.contains(t.target) || this.openPop && this.openPop.contains(t.target) || this.openSubEl && this.openSubEl.contains(t.target) || (this.clearTableHandles(), this.clearImageHandles(), this.clearImgPlaceholderSel(), this.clearTplSel(), this.clearSelToolbar());
     });
   }
   on(t, e, i) {
@@ -1263,7 +1302,7 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
     return this.ed.innerHTML;
   }
   setContent(t) {
-    this.ed.innerHTML = t || "<p><br></p>", this.refreshState(), this.clearTableHandles(), this.clearImageHandles(), this.clearImgPlaceholderSel(), this.clearSelToolbar(), this.onChange();
+    this.ed.innerHTML = t || "<p><br></p>", this.refreshState(), this.clearTableHandles(), this.clearImageHandles(), this.clearImgPlaceholderSel(), this.clearTplSel(), this.clearSelToolbar(), this.onChange();
   }
   insertContent(t) {
     this.restoreSel(), document.execCommand("insertHTML", !1, t), this.saveSel(), this.refreshState(), this.onChange();
@@ -1275,7 +1314,7 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
     this.ed.focus();
   }
   async importWordFile(t) {
-    const e = await bt(t);
+    const e = await yt(t);
     this.recordRevision(), this.setContent(e), this.recordRevision();
   }
   restoreDraft() {
@@ -1296,7 +1335,7 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
     return this.revisions.slice();
   }
   destroy() {
-    this.isDestroyed || (this.isDestroyed = !0, this.revTimer != null && window.clearTimeout(this.revTimer), this.draftTimer != null && window.clearTimeout(this.draftTimer), this.closePop(), this.closeDlg(), this.clearTableHandles(), this.clearImageHandles(), this.clearImgPlaceholderSel(), this.clearSelToolbar(), this.listeners.forEach((t) => t()), this.listeners = [], this.shell && this.shell.parentNode && this.shell.parentNode.removeChild(this.shell), this.imgInput && this.imgInput.parentNode && this.imgInput.parentNode.removeChild(this.imgInput), this.docInput && this.docInput.parentNode && this.docInput.parentNode.removeChild(this.docInput), this.contentStyleEl = null);
+    this.isDestroyed || (this.isDestroyed = !0, this.revTimer != null && window.clearTimeout(this.revTimer), this.draftTimer != null && window.clearTimeout(this.draftTimer), this.closePop(), this.closeDlg(), this.clearTableHandles(), this.clearImageHandles(), this.clearImgPlaceholderSel(), this.clearTplSel(), this.clearSelToolbar(), this.listeners.forEach((t) => t()), this.listeners = [], this.shell && this.shell.parentNode && this.shell.parentNode.removeChild(this.shell), this.imgInput && this.imgInput.parentNode && this.imgInput.parentNode.removeChild(this.imgInput), this.docInput && this.docInput.parentNode && this.docInput.parentNode.removeChild(this.docInput), this.contentStyleEl = null);
   }
   /* ---------------------------------------------------------- selection */
   saveSel() {
@@ -1388,8 +1427,8 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
       for (let h = this.revisions.length - 1; h >= 0; h--) {
         const d = this.revisions[h], m = document.createElement("button");
         m.type = "button";
-        const g = (new DOMParser().parseFromString(d.html, "text/html").body.textContent || "").trim(), f = g ? g.split(/\s+/).length : 0, b = h === this.revisions.length - 1;
-        m.innerHTML = `<span>${b ? this.t("currentver") : o.format(new Date(d.time))}</span><span class="wc">${f} ${this.t("words")}</span>`, m.addEventListener("click", () => c(h)), r[h] = m, i.appendChild(m);
+        const g = (new DOMParser().parseFromString(d.html, "text/html").body.textContent || "").trim(), f = g ? g.split(/\s+/).length : 0, v = h === this.revisions.length - 1;
+        m.innerHTML = `<span>${v ? this.t("currentver") : o.format(new Date(d.time))}</span><span class="wc">${f} ${this.t("words")}</span>`, m.addEventListener("click", () => c(h)), r[h] = m, i.appendChild(m);
       }
       i.append(l), l.addEventListener("click", () => {
         const h = this.revisions[n];
@@ -1473,7 +1512,7 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
       return l.type = "button", l.className = "cchip", l.title = s, l.addEventListener("mousedown", (n) => {
         n.preventDefault(), this.saveSel();
       }), l;
-    }, e = V.map((s) => {
+    }, e = tt.map((s) => {
       const l = t(this.t("forecolor"));
       return l.style.background = s, l.addEventListener("click", () => this.applyColor("fore", s)), l;
     }), i = t(this.t("forecolor"));
@@ -1521,17 +1560,17 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
       ]), h.insertAdjacentHTML("beforeend", '<div class="sep"></div>');
       const d = document.createElement("div");
       d.className = "mi-grid", s.forEach(([m, g], f) => {
-        const b = document.createElement("button");
-        b.className = "mi" + (r === m ? " on" : ""), b.innerHTML = `<span class="ic">${g}</span><span class="prev">${l[f]}</span>`, b.addEventListener("click", () => {
+        const v = document.createElement("button");
+        v.className = "mi" + (r === m ? " on" : ""), v.innerHTML = `<span class="ic">${g}</span><span class="prev">${l[f]}</span>`, v.addEventListener("click", () => {
           this.closePop(), this.setListStyle(e, m);
-        }), d.appendChild(b);
+        }), d.appendChild(v);
       }), h.appendChild(d);
     });
   }
   colorMenu(t, e) {
     this.popup(t, (i) => {
       const s = document.createElement("div");
-      s.className = "cpal", J.forEach((d) => {
+      s.className = "cpal", et.forEach((d) => {
         const m = document.createElement("button");
         m.style.background = d, m.title = d, m.addEventListener("click", () => {
           this.closePop(), this.applyColor(e, d);
@@ -1578,7 +1617,7 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
     this.popup(t, (e) => {
       this.menuItems(
         e,
-        _.map((i) => ({
+        Y.map((i) => ({
           label: i,
           on: this.currentSize() === i,
           action: () => this.applyFontSize(i)
@@ -1630,7 +1669,7 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
     this.saveSel(), this.refreshState(), this.onChange();
   }
   stepFontSize(t) {
-    const e = parseInt(this.currentSize(), 10) || 14, i = Math.min(G, Math.max(Q, e + t));
+    const e = parseInt(this.currentSize(), 10) || 14, i = Math.min(K, Math.max(G, e + t));
     i !== e && this.applyFontSize(i + "px");
   }
   /* ------------------------------------------------ case / spacing / link */
@@ -1672,7 +1711,7 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
     this.popup(t, (i) => {
       this.menuItems(i, [
         { label: this.t("normal"), on: !e, action: () => this.applyBlockStyle("lineHeight", "") },
-        ...Y.map((s) => ({
+        ...V.map((s) => ({
           label: s,
           on: e === s,
           action: () => this.applyBlockStyle("lineHeight", s)
@@ -1685,7 +1724,7 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
     this.popup(t, (i) => {
       this.menuItems(i, [
         { label: this.t("normal"), on: !e, action: () => this.applyBlockStyle("wordSpacing", "") },
-        ...K.map((s) => ({
+        ...J.map((s) => ({
           label: s,
           on: e === s,
           action: () => this.applyBlockStyle("wordSpacing", s)
@@ -1747,7 +1786,7 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
     this.popup(t, (e) => {
       this.menuItems(
         e,
-        D.map(([i, s]) => ({
+        P.map(([i, s]) => ({
           label: this.blockLabel(i),
           previewStyle: i.startsWith("h") ? `font-weight:700;font-size:${22 - 2 * +i[1]}px` : i === "pre" ? "font-family:monospace" : "",
           on: this.currentBlock() === i,
@@ -1850,6 +1889,7 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
       rtl: () => this.tbtn(a.rtl, this.t("rtl"), () => this.setDir("rtl"), "rtl"),
       quickimage: () => this.tbtn(a.image, this.t("quickimage"), () => this.insertImagePlaceholder()),
       quicktable: () => t,
+      template: () => this.menuTbtn(a.templateic, this.t("template"), (e) => this.templateMenu(e)),
       charmap: () => this.tbtn(a.charic, this.t("charmap"), () => this.charMap()),
       fullscreen: () => this.tbtn(a.fullscreen, this.t("fullscreen"), () => this.toggleFullscreen(), "fullscreen"),
       sourcecode: () => this.tbtn(a.srcic, this.t("sourcecode"), () => this.sourceDlg())
@@ -1857,7 +1897,7 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
   }
   buildToolbar() {
     this.toolbar.innerHTML = "";
-    const t = this.options.toolbar === !0 ? U : this.options.toolbar, e = this.buildToolbarRegistry();
+    const t = this.options.toolbar === !0 ? X : this.options.toolbar, e = this.buildToolbarRegistry();
     this.parseToolbarString(t).forEach((i) => {
       const s = [];
       i.forEach((l) => {
@@ -1911,6 +1951,7 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
         this.mItem("link", a.link, () => this.linkDlg()),
         this.mItem("image", a.image, () => this.insertImagePlaceholder()),
         { label: this.t("inserttable"), icon: a.tableic, action: () => this.tableGrid(this.menubar.querySelector('[data-menu-key="table"]') || this.menubar) },
+        { label: this.t("template"), icon: a.templateic, subBuild: (s) => this.buildTemplatePickInto(s) },
         this.mItem("hr", a.hric, () => this.exec("insertHorizontalRule")),
         "|",
         this.mItem("charmap", a.charic, () => this.charMap()),
@@ -1984,10 +2025,10 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
             this.tblActive = s.closest("table"), this.tablePropsDlg();
           }
         },
-        { label: this.t("deltable"), icon: a.tabledelete, action: () => this.tableOp("deltable") }
+        { label: this.t("deltable"), icon: a.trash, action: () => this.tableOp("deltable") }
       ],
       help: [this.mItem("helpttl", a.helpic, () => this.helpDlg(), "Alt+0")]
-    }, e = this.options.menubar === !0 ? j : this.options.menubar, i = /* @__PURE__ */ new Set();
+    }, e = this.options.menubar === !0 ? _ : this.options.menubar, i = /* @__PURE__ */ new Set();
     e.split(/\s+/).filter(Boolean).forEach((s) => {
       if (i.has(s)) return;
       if (i.add(s), !t[s]) {
@@ -2036,17 +2077,17 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
     const t = this.tblActive;
     if (!t) return;
     let e, i, s, l, n;
-    const o = "display:flex;align-items:center;gap:10px;margin:10px 0", r = "width:120px;color:#556;flex:none", c = "flex:1;border:1px solid #cfd6df;border-radius:6px;padding:7px 9px;font:14px inherit", h = t.querySelector("td,th"), d = t.style.width || "", m = h && h.style.padding ? parseFloat(h.style.padding) : "", g = t.style.borderSpacing ? parseFloat(t.style.borderSpacing) : "", f = t.style.borderWidth ? parseFloat(t.style.borderWidth) : "", b = t.style.marginLeft, v = t.style.marginRight, T = b === "auto" && v === "auto" ? "center" : b === "auto" ? "right" : v === "auto" && b === "0" ? "left" : "";
+    const o = "display:flex;align-items:center;gap:10px;margin:10px 0", r = "width:120px;color:#556;flex:none", c = "flex:1;border:1px solid #cfd6df;border-radius:6px;padding:7px 9px;font:14px inherit", h = t.querySelector("td,th"), d = t.style.width || "", m = h && h.style.padding ? parseFloat(h.style.padding) : "", g = t.style.borderSpacing ? parseFloat(t.style.borderSpacing) : "", f = t.style.borderWidth ? parseFloat(t.style.borderWidth) : "", v = t.style.marginLeft, y = t.style.marginRight, T = v === "auto" && y === "auto" ? "center" : v === "auto" ? "right" : y === "auto" && v === "0" ? "left" : "";
     this.dialog(
       this.t("tablepropsttl"),
-      (M) => {
-        const S = (x, E) => {
+      (S) => {
+        const M = (x, E) => {
           const H = document.createElement("div");
           H.style.cssText = o;
           const N = document.createElement("span");
-          N.style.cssText = r, N.textContent = this.t(x), H.append(N, E), M.appendChild(H);
+          N.style.cssText = r, N.textContent = this.t(x), H.append(N, E), S.appendChild(H);
         };
-        e = document.createElement("input"), e.type = "text", e.style.cssText = c, e.placeholder = "e.g. 600px or 100%", e.value = d, S("tblwidth", e), i = document.createElement("input"), i.type = "number", i.min = "0", i.style.cssText = c, i.value = String(m), S("tblcellpadding", i), s = document.createElement("input"), s.type = "number", s.min = "0", s.style.cssText = c, s.value = String(g), S("tblcellspacing", s), l = document.createElement("input"), l.type = "number", l.min = "0", l.style.cssText = c, l.value = String(f), S("tblborder", l), n = document.createElement("select"), n.style.cssText = c, [
+        e = document.createElement("input"), e.type = "text", e.style.cssText = c, e.placeholder = "e.g. 600px or 100%", e.value = d, M("tblwidth", e), i = document.createElement("input"), i.type = "number", i.min = "0", i.style.cssText = c, i.value = String(m), M("tblcellpadding", i), s = document.createElement("input"), s.type = "number", s.min = "0", s.style.cssText = c, s.value = String(g), M("tblcellspacing", s), l = document.createElement("input"), l.type = "number", l.min = "0", l.style.cssText = c, l.value = String(f), M("tblborder", l), n = document.createElement("select"), n.style.cssText = c, [
           ["", "alignnone"],
           ["left", "alignleft"],
           ["center", "aligncenter"],
@@ -2054,7 +2095,7 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
         ].forEach(([x, E]) => {
           const H = document.createElement("option");
           H.value = x, H.textContent = this.t(E), x === T && (H.selected = !0), n.appendChild(H);
-        }), S("tblalign", n);
+        }), M("tblalign", n);
       },
       [
         { label: this.t("cancel"), action: () => this.closeDlg() },
@@ -2284,7 +2325,7 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
       this.t("charmap").replace("…", ""),
       (t) => {
         const e = document.createElement("div");
-        e.className = "chgrid", tt.forEach((i) => {
+        e.className = "chgrid", it.forEach((i) => {
           const s = document.createElement("button");
           s.textContent = i, s.onclick = () => {
             this.closeDlg(), this.exec("insertText", i);
@@ -2303,14 +2344,13 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
     this.imgInput.value = "", this.imgInput.click();
   }
   /* ---------------------------------------------- image upload placeholder */
+  imgPhHTML(t) {
+    return `<div class="img-ph"${t ? ` id="${t}"` : ""} contenteditable="false">${a.image}<span>${this.t("dropimage")}</span></div>`;
+  }
   insertImagePlaceholder() {
     this.restoreSel();
     const t = "img-ph-" + Date.now().toString(36) + Math.random().toString(36).slice(2, 6);
-    document.execCommand(
-      "insertHTML",
-      !1,
-      `<div class="img-ph" id="${t}" contenteditable="false">${a.image}<span>${this.t("dropimage")}</span></div>`
-    );
+    document.execCommand("insertHTML", !1, this.imgPhHTML(t));
     const e = this.ed.querySelector("#" + t);
     e && (e.removeAttribute("id"), this.selectImgPlaceholder(e)), this.onChange();
   }
@@ -2318,6 +2358,10 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
     var t, e;
     (t = this.phCtx) == null || t.remove(), this.phCtx = null, (e = this.phActive) == null || e.classList.remove("active"), this.phActive = null;
   }
+  removeImgPlaceholder() {
+    const t = this.phActive;
+    t && (this.clearImgPlaceholderSel(), (t.closest(".tpl-media") || t).remove(), this.refreshState(), this.onChange());
+  }
   selectImgPlaceholder(t) {
     this.phActive !== t && (this.clearImgPlaceholderSel(), this.phActive = t, t.classList.add("active"), this.phCtx = document.createElement("div"), this.phCtx.className = "imgctx img-ph-ctx", this.phCtx.dir = this.dir(), document.body.appendChild(this.phCtx), this.renderPhCtxButtons());
   }
@@ -2327,7 +2371,9 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
       this.ctxBtn(a.uploadic, this.t("uploadimg"), () => {
         this.phUploadTarget = this.phActive, this.pickImage();
       }),
-      this.ctxBtn(a.link, this.t("imagelink"), () => this.renderPhCtxUrlInput())
+      this.ctxBtn(a.link, this.t("imagelink"), () => this.renderPhCtxUrlInput()),
+      this.ctxSep(),
+      this.ctxBtn(a.trash, this.t("deleteimg"), () => this.removeImgPlaceholder())
     ), this.positionImgPhCtx());
   }
   renderPhCtxUrlInput() {
@@ -2395,6 +2441,67 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
     let l = t.bottom + scrollY + 8;
     t.bottom + 8 + i > innerHeight - 4 && (l = Math.max(this.ctxMinTop(), t.top + scrollY - i - 8)), this.phCtx.style.left = s + "px", this.phCtx.style.top = l + "px";
   }
+  /* ---------------------------------------------------------- templates */
+  templateMenu(t) {
+    this.popup(t, (e) => this.buildTemplatePickInto(e));
+  }
+  /** Miniature div-based mockup of a layout, mirroring what the block looks
+      like in the editor: grey box = image slot, bars = heading/paragraph. */
+  tplPreviewHTML(t) {
+    const e = '<span class="pv-img"></span>', i = '<span class="pv-h"></span>', s = (r) => `<span class="pv-l" style="width:${r}%"></span>`, l = (r) => `<span class="pv-col">${r}</span>`, n = (r) => `<span class="pv-row">${r}</span>`, o = l(i + s(100) + s(88));
+    return t === "img-left" ? `<span class="pv">${n(e + o)}${s(100)}${s(72)}</span>` : t === "img-right" ? `<span class="pv">${n(o + e)}${s(100)}${s(72)}</span>` : t === "img-top" ? `<span class="pv pv-c">${e}${i}${s(100)}${s(72)}</span>` : `<span class="pv pv-c">${i}${s(100)}${s(72)}${e}</span>`;
+  }
+  buildTemplatePickInto(t, e) {
+    const i = document.createElement("div");
+    i.className = "tplpick", D.forEach((s) => {
+      const l = document.createElement("button");
+      l.type = "button", l.className = "tpltile", l.title = this.t(R[s]), l.innerHTML = this.tplPreviewHTML(s) + `<span class="tpllbl">${this.t(R[s])}</span>`, l.addEventListener("click", () => {
+        this.closePop(), this.insertTemplate(s), e == null || e();
+      }), i.appendChild(l);
+    }), t.appendChild(i);
+  }
+  insertTemplate(t) {
+    this.restoreSel();
+    const e = `<div class="tpl-media" contenteditable="false">${this.imgPhHTML()}</div>`, i = `<div class="tpl-text"><h2>${this.t("heading")}</h2><p>${this.t("para")}</p></div>`, s = t === "img-center" ? i + e : e + i;
+    document.execCommand("insertHTML", !1, `<div class="tpl tpl-${t}">${s}</div><p><br></p>`), this.saveSel(), this.onChange();
+  }
+  clearTplSel() {
+    var t, e;
+    (t = this.tplCtx) == null || t.remove(), this.tplCtx = null, (e = this.tplActive) == null || e.classList.remove("tpl-selected"), this.tplActive = null;
+  }
+  selectTemplate(t) {
+    this.tplActive !== t && (this.clearTplSel(), this.tplActive = t, t.classList.add("tpl-selected"), this.tplCtx = document.createElement("div"), this.tplCtx.className = "imgctx tplctx", this.tplCtx.dir = this.dir(), document.body.appendChild(this.tplCtx), this.renderTplCtxButtons());
+  }
+  renderTplCtxButtons() {
+    const t = this.tplCtx, e = this.tplActive;
+    !t || !e || (t.innerHTML = "", D.forEach((i) => {
+      const s = this.ctxBtn(xt[i], this.t(R[i]), () => this.setTplLayout(i));
+      s.classList.toggle("on", e.classList.contains("tpl-" + i)), t.appendChild(s);
+    }), t.append(this.ctxSep(), this.ctxBtn(a.trash, this.t("deltemplate"), () => this.removeTemplate())), this.positionTplCtx());
+  }
+  setTplLayout(t) {
+    const e = this.tplActive;
+    if (!e) return;
+    D.forEach((l) => e.classList.remove("tpl-" + l)), e.classList.add("tpl-" + t);
+    const i = e.querySelector(":scope > .tpl-media"), s = e.querySelector(":scope > .tpl-text");
+    i && s && (t === "img-center" ? e.appendChild(i) : e.insertBefore(i, s)), this.renderTplCtxButtons(), this.positionImgPhCtx(), this.positionImageHandles(), this.onChange();
+  }
+  removeTemplate() {
+    const t = this.tplActive;
+    t && (this.clearTplSel(), this.phActive && t.contains(this.phActive) && this.clearImgPlaceholderSel(), this.imgActive && t.contains(this.imgActive) && this.clearImageHandles(), t.remove(), this.refreshState(), this.onChange());
+  }
+  positionTplCtx() {
+    if (this.tplActive && !document.body.contains(this.tplActive)) {
+      this.clearTplSel();
+      return;
+    }
+    if (!this.tplActive || !this.tplCtx) return;
+    const t = this.tplActive.getBoundingClientRect(), e = this.tplCtx.offsetWidth, i = this.tplCtx.offsetHeight;
+    let s = t.left + scrollX + (t.width - e) / 2;
+    s = Math.max(8 + scrollX, Math.min(s, scrollX + innerWidth - e - 8));
+    let l = t.top + scrollY - i - 8;
+    l < this.ctxMinTop() && (l = t.bottom + scrollY + 8), this.tplCtx.style.left = s + "px", this.tplCtx.style.top = l + "px";
+  }
   pickWordDoc() {
     this.docInput.value = "", this.docInput.click();
   }
@@ -2463,7 +2570,7 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
       e(this.ctxBtn(a.colafter, this.t("colafter"), () => this.tableOp("colafter")), "col"),
       e(this.ctxBtn(a.coldelete, this.t("delcol"), () => this.tableOp("delcol")), "col"),
       this.ctxSep(),
-      this.ctxBtn(a.tabledelete, this.t("deltable"), () => this.tableOp("deltable")),
+      this.ctxBtn(a.trash, this.t("deltable"), () => this.tableOp("deltable")),
       this.ctxBtn(a.tableic, this.t("tablepropsttl"), () => this.tablePropsDlg())
     ), document.body.appendChild(t), t;
   }
@@ -2522,8 +2629,8 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
     const r = t.clientX, c = n[0].getBoundingClientRect().width, h = o[0].getBoundingClientRect().width;
     i.style.tableLayout = "fixed", this.withNoTextSelect((d) => {
       const m = (f) => {
-        const b = (s ? -1 : 1) * (f.clientX - r);
-        n.forEach((v) => v.style.width = Math.max(24, Math.round(c + b)) + "px"), o.forEach((v) => v.style.width = Math.max(24, Math.round(h - b)) + "px"), this.positionTableHandles();
+        const v = (s ? -1 : 1) * (f.clientX - r);
+        n.forEach((y) => y.style.width = Math.max(24, Math.round(c + v)) + "px"), o.forEach((y) => y.style.width = Math.max(24, Math.round(h - v)) + "px"), this.positionTableHandles();
       }, g = () => {
         window.removeEventListener("mousemove", m), window.removeEventListener("mouseup", g), d(), this.onChange();
       };
@@ -2542,7 +2649,7 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
     this.cancelImgHide(), this.imgHandles.forEach((i) => i.remove()), this.imgHandles = [], (t = this.imgCtx) == null || t.remove(), this.imgCtx = null, (e = this.imgActive) == null || e.classList.remove("img-selected"), this.imgActive = null;
   }
   selectImage(t) {
-    this.imgActive !== t && (this.clearImageHandles(), this.imgActive = t, t.classList.add("img-selected"), this.imgHandles = vt.map((e) => {
+    this.imgActive !== t && (this.clearImageHandles(), this.imgActive = t, t.classList.add("img-selected"), this.imgHandles = wt.map((e) => {
       const i = document.createElement("div");
       return i.className = "img-handle img-handle-" + e, i.dataset.corner = e, i.addEventListener("mousedown", (s) => this.startImageResizeDrag(s, e)), i.addEventListener("mouseenter", () => this.cancelImgHide()), i.addEventListener("mouseleave", () => this.scheduleImgHide()), document.body.appendChild(i), i;
     }), this.imgCtx = this.buildImageCtxToolbar(t), this.positionImageHandles());
@@ -2580,7 +2687,8 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
       }),
       this.ctxSep(),
       r(a.trash, this.t("deleteimg"), !1, () => {
-        t.remove(), this.clearImageHandles(), this.onChange();
+        const c = t.closest(".tpl-media");
+        c && this.ed.contains(c) ? t.outerHTML = this.imgPhHTML() : t.remove(), this.clearImageHandles(), this.onChange();
       })
     ), e.addEventListener("mousedown", (c) => c.preventDefault()), e.addEventListener("mouseenter", () => this.cancelImgHide()), e.addEventListener("mouseleave", () => this.scheduleImgHide()), document.body.appendChild(e), e;
   }
@@ -2745,7 +2853,7 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
       const f = this.toolbar.querySelector(`[data-id=${d}] .lbl`);
       f && (f.textContent = m || g || "", f.classList.toggle("empty", !m));
     };
-    o("fontsel", this.currentFont()), o("sizesel", this.currentSize().replace("px", "")), e && o("blocksel", D.some((d) => d[0] === i) ? this.blockLabel(i) : this.t("para")), this.sbWords.textContent = this.countWords() + " " + this.t("words");
+    o("fontsel", this.currentFont()), o("sizesel", this.currentSize().replace("px", "")), e && o("blocksel", P.some((d) => d[0] === i) ? this.blockLabel(i) : this.t("para")), this.sbWords.textContent = this.countWords() + " " + this.t("words");
   }
   countWords() {
     const t = (this.ed.textContent || "").trim();
@@ -2764,7 +2872,7 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
       }, l.readAsDataURL(s.getAsFile());
       return;
     }
-    i ? document.execCommand("insertHTML", !1, dt(i, this.dir())) : document.execCommand("insertHTML", !1, pt(e.getData("text/plain"))), this.onChange();
+    i ? document.execCommand("insertHTML", !1, mt(i, this.dir())) : document.execCommand("insertHTML", !1, ut(e.getData("text/plain"))), this.onChange();
   }
   /* ---------------------------------------------------------- init */
   initUI() {
@@ -2772,18 +2880,18 @@ const vt = ["nw", "ne", "sw", "se"], A = class A {
   }
 };
 A.instanceCounter = 0;
-let $ = A;
+let W = A;
 export {
-  D as BLOCKS,
-  tt as CHARS,
-  J as COLORS,
-  X as FONTS,
-  $ as FableEditor,
-  W as I18N,
+  P as BLOCKS,
+  it as CHARS,
+  et as COLORS,
+  Q as FONTS,
+  W as FableEditor,
+  j as I18N,
   a as IC,
-  _ as SIZES,
-  yt as TXT,
-  dt as cleanPastedHTML,
+  Y as SIZES,
+  Ct as TXT,
+  mt as cleanPastedHTML,
   B as getStrings,
-  pt as normalizeTextPaste
+  ut as normalizeTextPaste
 };