@grapesjs/studio-sdk-plugins 1.0.21 → 1.0.22

package/dist/presetPrintable/index.es.js

@@ -1,6 +1,6 @@
-const M = "app.grapesjs.com", U = "app-stage.grapesjs.com", x = [
-  M,
+const U = "app.grapesjs.com", G = "app-stage.grapesjs.com", x = [
   U,
+  G,
   "localhost",
   "127.0.0.1",
   ".local-credentialless.webcontainer.io",
@@ -9,21 +9,21 @@ const M = "app.grapesjs.com", U = "app-stage.grapesjs.com", x = [
   // For stackblitz.com demos
   "-sandpack.codesandbox.io"
   // For Sandpack demos
-], I = "license:check:start", N = "license:check:end", C = () => typeof window < "u", j = (e, n = {}) => {
-  const t = q(e) ? { id: e, src: e } : e;
+], N = "license:check:start", z = "license:check:end", K = () => typeof window < "u", j = (e, n = {}) => {
+  const t = V(e) ? { id: e, src: e } : e;
   return new Promise((s, a) => {
     var p, g;
     const o = document.querySelector(`script[src="${t.src}"]`), { id: i } = t;
     if (o)
       return (p = n.onScript) == null || p.call(n, o), s(i);
-    const c = document.createElement("script");
-    c.src = t.src, c.onload = () => s(i), c.onerror = () => a(i), document.head.appendChild(c), (g = n.onScript) == null || g.call(n, c);
+    const r = document.createElement("script");
+    r.src = t.src, r.onload = () => s(i), r.onerror = () => a(i), document.head.appendChild(r), (g = n.onScript) == null || g.call(n, r);
   });
-}, K = ({ isDev: e, isStage: n }) => `${e ? "" : `https://${n ? U : M}`}/api`, z = () => {
-  const e = C() && window.location.hostname;
+}, C = ({ isDev: e, isStage: n }) => `${e ? "" : `https://${n ? G : U}`}/api`, q = () => {
+  const e = K() && window.location.hostname;
   return !!e && (x.includes(e) || x.some((n) => e.endsWith(n)));
-}, q = (e) => typeof e == "string";
-async function V({
+}, V = (e) => typeof e == "string";
+async function Y({
   path: e,
   baseApiUrl: n,
   method: t = "GET",
@@ -31,7 +31,7 @@ async function V({
   params: a,
   body: o
 }) {
-  const c = `${n || K({ isDev: !1, isStage: !1 })}${e}`, p = {
+  const r = `${n || C({ isDev: !1, isStage: !1 })}${e}`, p = {
     method: t,
     headers: {
       "Content-Type": "application/json",
@@ -39,24 +39,24 @@ async function V({
     }
   };
   o && (p.body = JSON.stringify(o));
-  const g = a ? new URLSearchParams(a).toString() : "", l = g ? `?${g}` : "", u = await fetch(`${c}${l}`, p);
+  const g = a ? new URLSearchParams(a).toString() : "", c = g ? `?${g}` : "", u = await fetch(`${r}${c}`, p);
   if (!u.ok)
     throw new Error(`HTTP error! status: ${u.status}`);
   return u.json();
 }
-var T = /* @__PURE__ */ ((e) => (e.free = "free", e.startup = "startup", e.business = "business", e.enterprise = "enterprise", e))(T || {}), G = /* @__PURE__ */ ((e) => (e.toastAdd = "studio:toastAdd", e.dialogOpen = "studio:dialogOpen", e.dialogClose = "studio:dialogClose", e.sidebarLeftSet = "studio:sidebarLeft:set", e.sidebarLeftGet = "studio:sidebarLeft:get", e.sidebarLeftToggle = "studio:sidebarLeft:toggle", e.sidebarRightSet = "studio:sidebarRight:set", e.sidebarRightGet = "studio:sidebarRight:get", e.sidebarRightToggle = "studio:sidebarRight:toggle", e.sidebarTopSet = "studio:sidebarTop:set", e.sidebarTopGet = "studio:sidebarTop:get", e.sidebarTopToggle = "studio:sidebarTop:toggle", e.sidebarBottomSet = "studio:sidebarBottom:set", e.sidebarBottomGet = "studio:sidebarBottom:get", e.sidebarBottomToggle = "studio:sidebarBottom:toggle", e.symbolAdd = "studio:symbolAdd", e.symbolDetach = "studio:symbolDetach", e.symbolOverride = "studio:symbolOverride", e.symbolPropagateStyles = "studio:propagateStyles", e.getPagesConfig = "studio:getPagesConfig", e.setPagesConfig = "studio:setPagesConfig", e.getPageSettings = "studio:getPageSettings", e.setPageSettings = "studio:setPageSettings", e.projectFiles = "studio:projectFiles", e.canvasReload = "studio:canvasReload", e.getBlocksPanel = "studio:getBlocksPanel", e.setBlocksPanel = "studio:setBlocksPanel", e.getStateContextMenu = "studio:getStateContextMenu", e.setStateContextMenu = "studio:setStateContextMenu", e.contextMenuComponent = "studio:contextMenuComponent", e.layoutAdd = "studio:layoutAdd", e.layoutRemove = "studio:layoutRemove", e.layoutToggle = "studio:layoutToggle", e.layoutUpdate = "studio:layoutUpdate", e.layoutGet = "studio:layoutGet", e.layoutConfigGet = "studio:layoutConfigGet", e.layoutConfigSet = "studio:layoutConfigSet", e.getStateTheme = "studio:getStateTheme", e.setStateTheme = "studio:setStateTheme", e.assetProviderGet = "studio:assetProviderGet", e.assetProviderAdd = "studio:assetProviderAdd", e.assetProviderRemove = "studio:assetProviderRemove", e.fontGet = "studio:fontGet", e.fontAdd = "studio:fontAdd", e.fontRemove = "studio:fontRemove", e.fontManagerOpen = "studio:fontManagerOpen", e.menuFontLoad = "studio:menuFontLoad", e.toggleStateDataSource = "studio:toggleStateDataSource", e.getStateDataSource = "studio:getStateDataSource", e.setDragAbsolute = "studio:setDragAbsolute", e))(G || {});
+var E = /* @__PURE__ */ ((e) => (e.free = "free", e.startup = "startup", e.business = "business", e.enterprise = "enterprise", e))(E || {}), O = /* @__PURE__ */ ((e) => (e.toastAdd = "studio:toastAdd", e.dialogOpen = "studio:dialogOpen", e.dialogClose = "studio:dialogClose", e.sidebarLeftSet = "studio:sidebarLeft:set", e.sidebarLeftGet = "studio:sidebarLeft:get", e.sidebarLeftToggle = "studio:sidebarLeft:toggle", e.sidebarRightSet = "studio:sidebarRight:set", e.sidebarRightGet = "studio:sidebarRight:get", e.sidebarRightToggle = "studio:sidebarRight:toggle", e.sidebarTopSet = "studio:sidebarTop:set", e.sidebarTopGet = "studio:sidebarTop:get", e.sidebarTopToggle = "studio:sidebarTop:toggle", e.sidebarBottomSet = "studio:sidebarBottom:set", e.sidebarBottomGet = "studio:sidebarBottom:get", e.sidebarBottomToggle = "studio:sidebarBottom:toggle", e.symbolAdd = "studio:symbolAdd", e.symbolDetach = "studio:symbolDetach", e.symbolOverride = "studio:symbolOverride", e.symbolPropagateStyles = "studio:propagateStyles", e.getPagesConfig = "studio:getPagesConfig", e.setPagesConfig = "studio:setPagesConfig", e.getPageSettings = "studio:getPageSettings", e.setPageSettings = "studio:setPageSettings", e.projectFiles = "studio:projectFiles", e.canvasReload = "studio:canvasReload", e.getBlocksPanel = "studio:getBlocksPanel", e.setBlocksPanel = "studio:setBlocksPanel", e.getStateContextMenu = "studio:getStateContextMenu", e.setStateContextMenu = "studio:setStateContextMenu", e.contextMenuComponent = "studio:contextMenuComponent", e.layoutAdd = "studio:layoutAdd", e.layoutRemove = "studio:layoutRemove", e.layoutToggle = "studio:layoutToggle", e.layoutUpdate = "studio:layoutUpdate", e.layoutGet = "studio:layoutGet", e.layoutConfigGet = "studio:layoutConfigGet", e.layoutConfigSet = "studio:layoutConfigSet", e.getStateTheme = "studio:getStateTheme", e.setStateTheme = "studio:setStateTheme", e.assetProviderGet = "studio:assetProviderGet", e.assetProviderAdd = "studio:assetProviderAdd", e.assetProviderRemove = "studio:assetProviderRemove", e.fontGet = "studio:fontGet", e.fontAdd = "studio:fontAdd", e.fontRemove = "studio:fontRemove", e.fontManagerOpen = "studio:fontManagerOpen", e.menuFontLoad = "studio:menuFontLoad", e.toggleStateDataSource = "studio:toggleStateDataSource", e.getStateDataSource = "studio:getStateDataSource", e.dataSourceSetGlobalData = "studio:dataSourceSetGlobalData", e.dataSourceSetImporter = "studio:dataSourceSetImporter", e.dataSourceSetExporter = "studio:dataSourceSetExporter", e.setDragAbsolute = "studio:setDragAbsolute", e))(O || {});
 const H = {
-  [T.free]: 0,
-  [T.startup]: 10,
-  [T.business]: 20,
-  [T.enterprise]: 30
+  [E.free]: 0,
+  [E.startup]: 10,
+  [E.business]: 20,
+  [E.enterprise]: 30
 };
-function Y(e) {
+function J(e) {
   const n = e;
   return n.init = (t) => (s) => e(s, t), n;
 }
-const J = (e) => /* @__PURE__ */ Y(e);
-async function X({
+const X = (e) => /* @__PURE__ */ J(e);
+async function Z({
   editor: e,
   plan: n,
   pluginName: t,
@@ -64,37 +64,37 @@ async function X({
   cleanup: a
 }) {
   let o = "", i = !1;
-  const c = z(), p = (l) => {
-    console.warn("Cleanup plugin:", t, "Reason:", l), a();
-  }, g = (l = {}) => {
-    var h;
-    const { error: u, sdkLicense: d } = l, f = (h = l.plan) == null ? void 0 : h.category;
-    if (!(d || l.license) || u)
+  const r = q(), p = (c) => {
+    console.warn("Cleanup plugin:", t, "Reason:", c), a();
+  }, g = (c = {}) => {
+    var l;
+    const { error: u, sdkLicense: d } = c, f = (l = c.plan) == null ? void 0 : l.category;
+    if (!(d || c.license) || u)
       p(u || "Invalid license");
     else if (f) {
-      const E = H[n], y = H[f];
-      E > y && p({ pluginRequiredPlan: n, licensePlan: f });
+      const v = H[n], A = H[f];
+      v > A && p({ pluginRequiredPlan: n, licensePlan: f });
     }
   };
-  e.on(I, (l) => {
-    o = l == null ? void 0 : l.baseApiUrl, i = !0;
-  }), e.on(N, (l) => {
-    g(l);
+  e.on(N, (c) => {
+    o = c == null ? void 0 : c.baseApiUrl, i = !0;
+  }), e.on(z, (c) => {
+    g(c);
   }), setTimeout(async () => {
     if (!i) {
-      if (c) return;
+      if (r) return;
       if (s) {
-        const l = await Z({ licenseKey: s, pluginName: t, baseApiUrl: o });
-        l && g(l);
+        const c = await Q({ licenseKey: s, pluginName: t, baseApiUrl: o });
+        c && g(c);
       } else
         p("The `licenseKey` option not provided");
     }
   }, 2e3);
 }
-async function Z(e) {
+async function Q(e) {
   const { licenseKey: n, pluginName: t, baseApiUrl: s } = e;
   try {
-    return (await V({
+    return (await Y({
       baseApiUrl: s,
       path: `/sdk/${n || "na"}`,
       method: "POST",
@@ -107,31 +107,31 @@ async function Z(e) {
     return console.error("Error during SDK license check:", a), !1;
   }
 }
-const Q = (e) => (n) => {
+const ee = (e) => (n) => {
   var t;
-  return ((t = n.getAttribute) == null ? void 0 : t.call(n, O)) === e;
-}, ee = (...e) => (n, t) => e.some((s) => t.is(s)), F = (e, n, t) => {
+  return ((t = n.getAttribute) == null ? void 0 : t.call(n, W)) === e;
+}, te = (...e) => (n, t) => e.some((s) => t.is(s)), F = (e, n, t) => {
   const { doc: s = document } = t, a = t.target || s.head, o = a.querySelector(`style[${e}]`) || s.createElement("style");
   o.setAttribute(e, "true"), o.innerHTML = n, !a.contains(o) && a.appendChild(o);
-}, te = "gjs-plg-", W = "data-gs-plg-", O = "data-type-role";
-function se(e, n, t) {
-  let s, a, o, i, c;
-  const p = n;
+}, se = "gjs-plg-", I = "data-gs-plg-", W = "data-type-role";
+function _(e, n, t) {
+  let s, a, o, i, r;
+  const p = n === void 0 ? 100 : n;
   function g() {
     const u = Date.now() - i;
-    u < p && u >= 0 ? s = setTimeout(g, p - u) : (s = null, c = e.apply(o, a), o = a = null);
+    u < p && u >= 0 ? s = setTimeout(g, p - u) : (s = null, r = e.apply(o, a), o = a = null);
   }
-  const l = function() {
-    return o = this, a = arguments, i = Date.now(), s || (s = setTimeout(g, p)), c;
+  const c = function() {
+    return o = this, a = arguments, i = Date.now(), s || (s = setTimeout(g, p)), r;
   };
-  return l.clear = function() {
+  return c.clear = function() {
     s && (clearTimeout(s), s = null);
-  }, l.flush = function() {
-    s && (c = e.apply(o, a), o = a = null, clearTimeout(s), s = null);
-  }, l;
+  }, c.flush = function() {
+    s && (r = e.apply(o, a), o = a = null, clearTimeout(s), s = null);
+  }, c;
 }
 const P = "page-break";
-function $(e, n) {
+function L(e, n) {
   const s = {
     mm: 3.7795275590551185,
     // 1mm ≈ 3.78px
@@ -147,7 +147,7 @@ function $(e, n) {
   return s[n] ? e * s[n] : null;
 }
 const ne = (e, n) => {
-  const { name: t, id: s, width: a, height: o, unit: i } = e, { fixedHeight: c } = n, p = `${a}${i}`, g = `${o}${i}`;
+  const { name: t, id: s, width: a, height: o, unit: i } = e, { fixedHeight: r } = n, p = `${a}${i}`, g = `${o}${i}`;
   return {
     id: s || t.toLowerCase().replace(/\s/g, "-"),
     name: `${t} (${p} x ${g})`,
@@ -156,18 +156,18 @@ const ne = (e, n) => {
     sizeUnit: i,
     widthMedia: "",
     width: p,
-    minHeight: c ? "0" : `${$(o, i)}px`,
-    height: c ? g : void 0
+    minHeight: r ? "0" : `${L(o, i)}px`,
+    height: r ? g : void 0
   };
-}, D = "page-breaks", R = "gjs-page-breaks-spot", L = (e) => e.type === D;
+}, $ = "page-breaks", R = "gjs-page-breaks-spot", S = (e) => e.type === $;
 function oe(e) {
-  const { Devices: n } = e, { height: t, minHeight: s } = n.getSelected().attributes, o = parseFloat(`${t && t !== "auto" ? t : s}`), i = e.getWrapper(), c = i == null ? void 0 : i.getEl(), p = [];
-  if (!i || !c)
+  const { Devices: n } = e, { height: t, minHeight: s } = n.getSelected().attributes, o = parseFloat(`${t && t !== "auto" ? t : s}`), i = e.getWrapper(), r = i == null ? void 0 : i.getEl(), p = [];
+  if (!i || !r)
     return p;
-  const g = c.getBoundingClientRect().height, u = i.findType(P).map((f) => f.getEl()).filter(Boolean).map((f) => ({ top: f.offsetTop, height: f.offsetHeight }));
+  const g = r.getBoundingClientRect().height, u = i.findType(P).map((f) => f.getEl()).filter(Boolean).map((f) => ({ top: f.offsetTop, height: f.offsetHeight }));
   let d = 0;
   for (; d < g; ) {
-    const f = u.find((r) => r.top > d && r.top < d + o);
+    const f = u.find((m) => m.top > d && m.top < d + o);
     f ? (d = f.top + f.height, p.push(f.top)) : (d += o, d < g && p.push(d));
   }
   return p;
@@ -177,7 +177,7 @@ function ae(e, n) {
   let o;
   const i = () => {
     F(
-      `${W}preset-printable-spots`,
+      `${I}preset-printable-spots`,
       `.${R} {
         position: absolute;
         left: 0;
@@ -198,61 +198,66 @@ function ae(e, n) {
       `,
       { target: window.document.head }
     );
-  }, c = () => {
+  }, r = () => {
     if (n.enablePageBreaksSpot === !1) return;
-    const r = { id: D, type: D, component: e.getWrapper() };
-    return t.getSpots(r).pop() || t.addSpot(r);
-  }, p = ({ spot: r }) => {
-    const { spotEl: h } = r.attributes;
-    !L(r) || !h || !o || o.removeChild(h);
-  }, g = ({ spot: r }) => {
-    if (!L(r) || !o) return;
-    let { spotEl: h } = r.attributes;
-    h || (h = document.createElement("div"), h.className = `${R}__items`, r.set({ spotEl: h })), o.appendChild(h);
-  }, l = ({ spot: r }) => {
-    const { spotEl: h, pageBreaks: E = [] } = r.attributes;
-    !L(r) || !h || !o || (Object.entries(r.getStyle()).forEach(([y, A]) => h.style.setProperty(y, A)), h.innerHTML = "", E.forEach((y, A) => {
-      const v = document.createElement("div");
-      v.setAttribute("data-page-number", `${A + 2}`), v.className = R, v.style.top = `${y}px`, h.appendChild(v);
+    const l = { id: $, type: $, component: e.getWrapper() };
+    return t.getSpots(l).pop() || t.addSpot(l);
+  }, p = ({ spot: l }) => {
+    const { spotEl: v } = l.attributes;
+    !S(l) || !v || !o || o.removeChild(v);
+  }, g = ({ spot: l }) => {
+    if (!S(l) || !o) return;
+    let { spotEl: v } = l.attributes;
+    v || (v = document.createElement("div"), v.className = `${R}__items`, l.set({ spotEl: v })), o.appendChild(v);
+  }, c = ({ spot: l }) => {
+    const { spotEl: v, pageBreaks: A = [] } = l.attributes;
+    !S(l) || !v || !o || (Object.entries(l.getStyle()).forEach(([T, b]) => v.style.setProperty(T, b)), v.innerHTML = "", A.forEach((T, b) => {
+      const h = document.createElement("div");
+      h.setAttribute("data-page-number", `${b + 2}`), h.className = R, h.style.top = `${T}px`, v.appendChild(h);
     }));
-  }, u = se(() => {
-    const r = c();
-    r && r.set({ pageBreaks: oe(e), up: (r.attributes.up || 0) + 1 });
-  }, 150), d = () => {
-    o = t.getSpotsEl(), c();
-  }, f = [
+  }, u = _(() => {
+    if (e.em.destroyed) return;
+    const l = r();
+    l && l.set({ pageBreaks: oe(e), up: (l.attributes.up || 0) + 1 });
+  }, 150), d = _(u, 200), f = () => {
+    o = t.getSpotsEl(), r();
+  }, m = [
     ["component:input", u],
     [a.update, u],
     [s.spotAdd, g],
-    [s.spotUpdate, l],
+    [s.spotUpdate, c],
     [s.spotRemove, p],
-    [s.frameLoadBody, d]
+    [s.frameLoadBody, f]
   ];
-  return f.forEach(([r, h]) => e.on(r, h)), e.onReady(() => {
-    i();
+  return m.forEach(([l, v]) => e.on(l, v)), e.onReady(() => {
+    i(), new ResizeObserver(d).observe(t.getElement().parentElement);
   }), () => {
-    f.forEach(([r, h]) => e.off(r, h)), u.clear();
+    m.forEach(([l, v]) => e.off(l, v)), u.clear(), d.clear();
   };
 }
-var S = /* @__PURE__ */ ((e) => (e.print = "presetPrintable:print", e))(S || {});
-const _ = (e) => new Promise((n) => {
+var D = /* @__PURE__ */ ((e) => (e.print = "presetPrintable:print", e))(D || {});
+const M = (e) => new Promise((n) => {
   const t = document.createElement("iframe");
   t.style.cssText = "position: absolute; width: 0; height: 0; border: 0; opacity: 0; pointer-events: none;", t.srcdoc = e.content, t.onload = () => n(t), document.body.appendChild(t);
 });
 function ie(e, n) {
   const { Commands: t, Pages: s } = e;
   return t.add(
-    S.print,
+    D.print,
     async (a, o, i = {}) => {
-      const c = {
+      const r = {
         page: i.allPages ? void 0 : s.getSelected(),
-        styles: "inline"
-      }, g = (await t.run(G.projectFiles, c)).filter((d) => d.filename.endsWith(".html")), l = g.map((d) => d.content).join('<div style="break-before: page;"></div>'), u = [];
+        styles: "inline",
+        optionsHtml: {
+          // Avoid DataSource exporter
+          exporter: null
+        }
+      }, g = (await t.run(O.projectFiles, r)).filter((d) => d.filename.endsWith(".html")), c = g.map((d) => d.content).join('<div style="break-before: page;"></div>'), u = [];
       if (i.separatePrints)
         for (const d of g)
-          u.push(await _(d));
+          u.push(await M(d));
       else
-        u.push(await _({ content: l, filename: "", mimeType: "" }));
+        u.push(await M({ content: c, filename: "", mimeType: "" }));
       for (const d of u) {
         const f = d.contentWindow;
         f.focus(), f.print();
@@ -261,14 +266,14 @@ function ie(e, n) {
     }
   ), t.add("presetPrintable:exp", async (a) => {
     await j("https://cdn.jsdelivr.net/npm/html2canvas@1.4.1/dist/html2canvas.min.js"), await j("https://cdn.jsdelivr.net/npm/jspdf@3.0.0/dist/jspdf.umd.min.js");
-    const { Devices: o, Canvas: i } = a, { sizeW: c, sizeH: p, sizeUnit: g } = o.getSelected().attributes, l = i.getFrameEl().contentDocument, u = "px", d = [$(c, g), $(p, g)], f = new window.jspdf.jsPDF({ unit: u, format: d }), r = l.body;
-    f.html(r, { callback: (h) => h.save() });
+    const { Devices: o, Canvas: i } = a, { sizeW: r, sizeH: p, sizeUnit: g } = o.getSelected().attributes, c = i.getFrameEl().contentDocument, u = "px", d = [L(r, g), L(p, g)], f = new window.jspdf.jsPDF({ unit: u, format: d }), m = c.body;
+    f.html(m, { callback: (l) => l.save() });
   }), () => {
-    delete e.Commands.commands[S.print];
+    delete e.Commands.commands[D.print];
   };
 }
 function re(e, n) {
-  const { blockPageBreak: t = {} } = n, { Components: s, Blocks: a } = e, o = "Page Break", i = `${te}${P}`;
+  const { blockPageBreak: t = {} } = n, { Components: s, Blocks: a } = e, o = "Page Break", i = `${se}${P}`;
   return s.addType(P, {
     block: t && {
       label: o,
@@ -277,16 +282,16 @@ function re(e, n) {
       select: !0,
       ...t
     },
-    isComponent: Q(P),
+    isComponent: ee(P),
     model: {
       defaults: {
         name: o,
         classes: i,
-        attributes: { [O]: P },
+        attributes: { [W]: P },
         emptyState: !0,
         stylable: !1,
         droppable: !1,
-        draggable: ee("wrapper"),
+        draggable: te("wrapper"),
         styles: `.${i} { break-before: page; }`,
         traits: []
       }
@@ -299,7 +304,7 @@ const ce = "presetPrintable", le = function(e, n = {}) {
   const t = {
     selectedDevice: "a4",
     ...n
-  }, { Canvas: s, Devices: a } = e, o = s.events, i = e.events, c = t.selectedDevice || a.getConfig().default, g = [
+  }, { Canvas: s, Devices: a } = e, o = s.events, i = e.events, r = t.selectedDevice || a.getConfig().default, g = [
     { name: "A5", width: 148, height: 210, unit: "mm" },
     { name: "A5 Portrait", width: 210, height: 148, unit: "mm" },
     { name: "A4", width: 210, height: 297, unit: "mm" },
@@ -309,15 +314,15 @@ const ce = "presetPrintable", le = function(e, n = {}) {
     { name: "Letter", width: 8.5, height: 11, unit: "in" },
     { name: "Legal", width: 8.5, height: 14, unit: "in" },
     { name: "Ledger", width: 11, height: 17, unit: "in" }
-  ].map((v) => ne(v, t));
+  ].map((b) => ne(b, t));
   a.devices.reset(g);
-  const l = c && a.get(c) || a.getAll().at(0);
-  a.select(l);
+  const c = r && a.get(r) || a.getAll().at(0);
+  a.select(c);
   const u = () => {
-    const v = "page-rule", { rules: b } = e.Css, { width: w, height: m, minHeight: k } = a.getSelected().attributes, B = m && m !== "auto" ? m : k;
-    (b.where({ id: v }).pop() || b.add(
+    const b = "page-rule", { rules: h } = e.Css, { width: w, height: y, minHeight: k } = a.getSelected().attributes, B = y && y !== "auto" ? y : k;
+    (h.where({ id: b }).pop() || h.add(
       {
-        id: v,
+        id: b,
         selectors: [],
         selectorsAdd: "@page"
       },
@@ -326,8 +331,8 @@ const ce = "presetPrintable", le = function(e, n = {}) {
       size: `${w} ${B}`,
       margin: "0"
     });
-  }, d = (v) => {
-    const b = v.document, { minHeight: w } = a.getSelected().attributes, k = `
+  }, d = (b) => {
+    const h = b.document, { minHeight: w } = a.getSelected().attributes, k = `
       ${!!parseFloat(`${w}`) ? `
         [data-gjs-type="wrapper"] { min-height: ${w}; }
       ` : `
@@ -341,48 +346,48 @@ const ce = "presetPrintable", le = function(e, n = {}) {
         }
       `}
     `;
-    F(`${W}preset-printable`, k, { doc: b, target: b.head }), u();
+    F(`${I}preset-printable`, k, { doc: h, target: h.head }), u();
   };
-  e.on(o.frameLoadBody, (v) => {
-    const b = v.window;
-    if (d(b), t.fixedHeight) {
-      const m = v.model.getComponent().getEl();
-      m == null || m.addEventListener("scroll", (k) => {
+  e.on(o.frameLoadBody, (b) => {
+    const h = b.window;
+    if (d(h), t.fixedHeight) {
+      const y = b.model.getComponent().getEl();
+      y == null || y.addEventListener("scroll", (k) => {
         const B = k.target;
         B.scrollTop > 0 && B.scrollTo(0, 0);
       });
     }
   }), e.on(a.events.select, () => {
-    var b;
-    const v = (b = s.getFrameEl().contentDocument) == null ? void 0 : b.defaultView;
-    v && d(v);
+    var h;
+    const b = (h = s.getFrameEl().contentDocument) == null ? void 0 : h.defaultView;
+    b && d(b);
   });
   const f = () => {
-    const b = e.Css.getRules().filter((w) => w.selectorsToString() === "body").pop();
-    b == null || b.addStyle({
+    const h = e.Css.getRules().filter((w) => w.selectorsToString() === "body").pop();
+    h == null || h.addStyle({
       "margin-top": "",
       "margin-right": "",
       "margin-bottom": "",
       "margin-left": "",
       margin: "0"
     });
-  }, r = [[i.projectLoad, f]];
-  r.forEach(([v, b]) => e.on(v, b));
-  const h = ae(e, t), E = ie(e), y = re(e, t);
+  }, m = [[i.projectLoad, f]];
+  m.forEach(([b, h]) => e.on(b, h));
+  const l = ae(e, t), v = ie(e), A = re(e, t);
   e.onReady(() => {
     e.UndoManager.clear();
   });
-  const A = () => {
-    r.forEach(([v, b]) => e.off(v, b)), h(), E(), y();
+  const T = () => {
+    m.forEach(([b, h]) => e.off(b, h)), l(), v(), A();
   };
-  X({
+  e.on(i.destroy, T), Z({
     editor: e,
     licenseKey: t.licenseKey,
-    plan: T.startup,
+    plan: E.startup,
     pluginName: ce,
-    cleanup: A
+    cleanup: T
   });
-}, ge = J(le);
+}, ge = X(le);
 export {
   ge as default
 };

package/dist/presetPrintable/index.umd.js

@@ -1,10 +1,10 @@
-(function(T,E){typeof exports=="object"&&typeof module<"u"?module.exports=E():typeof define=="function"&&define.amd?define(E):(T=typeof globalThis<"u"?globalThis:T||self,T.StudioSdkPlugins_presetPrintable=E())})(this,function(){"use strict";const T="app.grapesjs.com",E="app-stage.grapesjs.com",_=[T,E,"localhost","127.0.0.1",".local-credentialless.webcontainer.io",".local.webcontainer.io","-sandpack.codesandbox.io"],I="license:check:start",N="license:check:end",C=()=>typeof window<"u",H=(e,n={})=>{const t=q(e)?{id:e,src:e}:e;return new Promise((s,a)=>{var p,g;const o=document.querySelector(`script[src="${t.src}"]`),{id:i}=t;if(o)return(p=n.onScript)==null||p.call(n,o),s(i);const c=document.createElement("script");c.src=t.src,c.onload=()=>s(i),c.onerror=()=>a(i),document.head.appendChild(c),(g=n.onScript)==null||g.call(n,c)})},K=({isDev:e,isStage:n})=>`${e?"":`https://${n?E:T}`}/api`,z=()=>{const e=C()&&window.location.hostname;return!!e&&(_.includes(e)||_.some(n=>e.endsWith(n)))},q=e=>typeof e=="string";async function V({path:e,baseApiUrl:n,method:t="GET",headers:s={},params:a,body:o}){const c=`${n||K({isDev:!1,isStage:!1})}${e}`,p={method:t,headers:{"Content-Type":"application/json",...s}};o&&(p.body=JSON.stringify(o));const g=a?new URLSearchParams(a).toString():"",l=g?`?${g}`:"",u=await fetch(`${c}${l}`,p);if(!u.ok)throw new Error(`HTTP error! status: ${u.status}`);return u.json()}var k=(e=>(e.free="free",e.startup="startup",e.business="business",e.enterprise="enterprise",e))(k||{}),M=(e=>(e.toastAdd="studio:toastAdd",e.dialogOpen="studio:dialogOpen",e.dialogClose="studio:dialogClose",e.sidebarLeftSet="studio:sidebarLeft:set",e.sidebarLeftGet="studio:sidebarLeft:get",e.sidebarLeftToggle="studio:sidebarLeft:toggle",e.sidebarRightSet="studio:sidebarRight:set",e.sidebarRightGet="studio:sidebarRight:get",e.sidebarRightToggle="studio:sidebarRight:toggle",e.sidebarTopSet="studio:sidebarTop:set",e.sidebarTopGet="studio:sidebarTop:get",e.sidebarTopToggle="studio:sidebarTop:toggle",e.sidebarBottomSet="studio:sidebarBottom:set",e.sidebarBottomGet="studio:sidebarBottom:get",e.sidebarBottomToggle="studio:sidebarBottom:toggle",e.symbolAdd="studio:symbolAdd",e.symbolDetach="studio:symbolDetach",e.symbolOverride="studio:symbolOverride",e.symbolPropagateStyles="studio:propagateStyles",e.getPagesConfig="studio:getPagesConfig",e.setPagesConfig="studio:setPagesConfig",e.getPageSettings="studio:getPageSettings",e.setPageSettings="studio:setPageSettings",e.projectFiles="studio:projectFiles",e.canvasReload="studio:canvasReload",e.getBlocksPanel="studio:getBlocksPanel",e.setBlocksPanel="studio:setBlocksPanel",e.getStateContextMenu="studio:getStateContextMenu",e.setStateContextMenu="studio:setStateContextMenu",e.contextMenuComponent="studio:contextMenuComponent",e.layoutAdd="studio:layoutAdd",e.layoutRemove="studio:layoutRemove",e.layoutToggle="studio:layoutToggle",e.layoutUpdate="studio:layoutUpdate",e.layoutGet="studio:layoutGet",e.layoutConfigGet="studio:layoutConfigGet",e.layoutConfigSet="studio:layoutConfigSet",e.getStateTheme="studio:getStateTheme",e.setStateTheme="studio:setStateTheme",e.assetProviderGet="studio:assetProviderGet",e.assetProviderAdd="studio:assetProviderAdd",e.assetProviderRemove="studio:assetProviderRemove",e.fontGet="studio:fontGet",e.fontAdd="studio:fontAdd",e.fontRemove="studio:fontRemove",e.fontManagerOpen="studio:fontManagerOpen",e.menuFontLoad="studio:menuFontLoad",e.toggleStateDataSource="studio:toggleStateDataSource",e.getStateDataSource="studio:getStateDataSource",e.setDragAbsolute="studio:setDragAbsolute",e))(M||{});const U={[k.free]:0,[k.startup]:10,[k.business]:20,[k.enterprise]:30};function Y(e){const n=e;return n.init=t=>s=>e(s,t),n}const J=e=>Y(e);async function X({editor:e,plan:n,pluginName:t,licenseKey:s,cleanup:a}){let o="",i=!1;const c=z(),p=l=>{console.warn("Cleanup plugin:",t,"Reason:",l),a()},g=(l={})=>{var h;const{error:u,sdkLicense:d}=l,f=(h=l.plan)==null?void 0:h.category;if(!(d||l.license)||u)p(u||"Invalid license");else if(f){const A=U[n],P=U[f];A>P&&p({pluginRequiredPlan:n,licensePlan:f})}};e.on(I,l=>{o=l==null?void 0:l.baseApiUrl,i=!0}),e.on(N,l=>{g(l)}),setTimeout(async()=>{if(!i){if(c)return;if(s){const l=await Z({licenseKey:s,pluginName:t,baseApiUrl:o});l&&g(l)}else p("The `licenseKey` option not provided")}},2e3)}async function Z(e){const{licenseKey:n,pluginName:t,baseApiUrl:s}=e;try{return(await V({baseApiUrl:s,path:`/sdk/${n||"na"}`,method:"POST",params:{d:window.location.hostname,pn:t}})).result||{}}catch(a){return console.error("Error during SDK license check:",a),!1}}const Q=e=>n=>{var t;return((t=n.getAttribute)==null?void 0:t.call(n,W))===e},ee=(...e)=>(n,t)=>e.some(s=>t.is(s)),G=(e,n,t)=>{const{doc:s=document}=t,a=t.target||s.head,o=a.querySelector(`style[${e}]`)||s.createElement("style");o.setAttribute(e,"true"),o.innerHTML=n,!a.contains(o)&&a.appendChild(o)},te="gjs-plg-",F="data-gs-plg-",W="data-type-role";function se(e,n,t){let s,a,o,i,c;const p=n;function g(){const u=Date.now()-i;u<p&&u>=0?s=setTimeout(g,p-u):(s=null,c=e.apply(o,a),o=a=null)}const l=function(){return o=this,a=arguments,i=Date.now(),s||(s=setTimeout(g,p)),c};return l.clear=function(){s&&(clearTimeout(s),s=null)},l.flush=function(){s&&(c=e.apply(o,a),o=a=null,clearTimeout(s),s=null)},l}const y="page-break";function D(e,n){const s={mm:3.7795275590551185,cm:37.79527559055118,in:96,pt:1.3333333333333333,pc:16};return s[n]?e*s[n]:null}const ne=(e,n)=>{const{name:t,id:s,width:a,height:o,unit:i}=e,{fixedHeight:c}=n,p=`${a}${i}`,g=`${o}${i}`;return{id:s||t.toLowerCase().replace(/\s/g,"-"),name:`${t} (${p} x ${g})`,sizeH:o,sizeW:a,sizeUnit:i,widthMedia:"",width:p,minHeight:c?"0":`${D(o,i)}px`,height:c?g:void 0}},S="page-breaks",L="gjs-page-breaks-spot",x=e=>e.type===S;function oe(e){const{Devices:n}=e,{height:t,minHeight:s}=n.getSelected().attributes,o=parseFloat(`${t&&t!=="auto"?t:s}`),i=e.getWrapper(),c=i==null?void 0:i.getEl(),p=[];if(!i||!c)return p;const g=c.getBoundingClientRect().height,u=i.findType(y).map(f=>f.getEl()).filter(Boolean).map(f=>({top:f.offsetTop,height:f.offsetHeight}));let d=0;for(;d<g;){const f=u.find(r=>r.top>d&&r.top<d+o);f?(d=f.top+f.height,p.push(f.top)):(d+=o,d<g&&p.push(d))}return p}function ae(e,n){const{Canvas:t}=e,s=t.events,a=e.events;let o;const i=()=>{G(`${F}preset-printable-spots`,`.${L} {
+(function(T,E){typeof exports=="object"&&typeof module<"u"?module.exports=E():typeof define=="function"&&define.amd?define(E):(T=typeof globalThis<"u"?globalThis:T||self,T.StudioSdkPlugins_presetPrintable=E())})(this,function(){"use strict";const T="app.grapesjs.com",E="app-stage.grapesjs.com",H=[T,E,"localhost","127.0.0.1",".local-credentialless.webcontainer.io",".local.webcontainer.io","-sandpack.codesandbox.io"],N="license:check:start",z="license:check:end",K=()=>typeof window<"u",_=(e,n={})=>{const t=V(e)?{id:e,src:e}:e;return new Promise((s,a)=>{var p,d;const o=document.querySelector(`script[src="${t.src}"]`),{id:i}=t;if(o)return(p=n.onScript)==null||p.call(n,o),s(i);const r=document.createElement("script");r.src=t.src,r.onload=()=>s(i),r.onerror=()=>a(i),document.head.appendChild(r),(d=n.onScript)==null||d.call(n,r)})},C=({isDev:e,isStage:n})=>`${e?"":`https://${n?E:T}`}/api`,q=()=>{const e=K()&&window.location.hostname;return!!e&&(H.includes(e)||H.some(n=>e.endsWith(n)))},V=e=>typeof e=="string";async function Y({path:e,baseApiUrl:n,method:t="GET",headers:s={},params:a,body:o}){const r=`${n||C({isDev:!1,isStage:!1})}${e}`,p={method:t,headers:{"Content-Type":"application/json",...s}};o&&(p.body=JSON.stringify(o));const d=a?new URLSearchParams(a).toString():"",c=d?`?${d}`:"",u=await fetch(`${r}${c}`,p);if(!u.ok)throw new Error(`HTTP error! status: ${u.status}`);return u.json()}var k=(e=>(e.free="free",e.startup="startup",e.business="business",e.enterprise="enterprise",e))(k||{}),M=(e=>(e.toastAdd="studio:toastAdd",e.dialogOpen="studio:dialogOpen",e.dialogClose="studio:dialogClose",e.sidebarLeftSet="studio:sidebarLeft:set",e.sidebarLeftGet="studio:sidebarLeft:get",e.sidebarLeftToggle="studio:sidebarLeft:toggle",e.sidebarRightSet="studio:sidebarRight:set",e.sidebarRightGet="studio:sidebarRight:get",e.sidebarRightToggle="studio:sidebarRight:toggle",e.sidebarTopSet="studio:sidebarTop:set",e.sidebarTopGet="studio:sidebarTop:get",e.sidebarTopToggle="studio:sidebarTop:toggle",e.sidebarBottomSet="studio:sidebarBottom:set",e.sidebarBottomGet="studio:sidebarBottom:get",e.sidebarBottomToggle="studio:sidebarBottom:toggle",e.symbolAdd="studio:symbolAdd",e.symbolDetach="studio:symbolDetach",e.symbolOverride="studio:symbolOverride",e.symbolPropagateStyles="studio:propagateStyles",e.getPagesConfig="studio:getPagesConfig",e.setPagesConfig="studio:setPagesConfig",e.getPageSettings="studio:getPageSettings",e.setPageSettings="studio:setPageSettings",e.projectFiles="studio:projectFiles",e.canvasReload="studio:canvasReload",e.getBlocksPanel="studio:getBlocksPanel",e.setBlocksPanel="studio:setBlocksPanel",e.getStateContextMenu="studio:getStateContextMenu",e.setStateContextMenu="studio:setStateContextMenu",e.contextMenuComponent="studio:contextMenuComponent",e.layoutAdd="studio:layoutAdd",e.layoutRemove="studio:layoutRemove",e.layoutToggle="studio:layoutToggle",e.layoutUpdate="studio:layoutUpdate",e.layoutGet="studio:layoutGet",e.layoutConfigGet="studio:layoutConfigGet",e.layoutConfigSet="studio:layoutConfigSet",e.getStateTheme="studio:getStateTheme",e.setStateTheme="studio:setStateTheme",e.assetProviderGet="studio:assetProviderGet",e.assetProviderAdd="studio:assetProviderAdd",e.assetProviderRemove="studio:assetProviderRemove",e.fontGet="studio:fontGet",e.fontAdd="studio:fontAdd",e.fontRemove="studio:fontRemove",e.fontManagerOpen="studio:fontManagerOpen",e.menuFontLoad="studio:menuFontLoad",e.toggleStateDataSource="studio:toggleStateDataSource",e.getStateDataSource="studio:getStateDataSource",e.dataSourceSetGlobalData="studio:dataSourceSetGlobalData",e.dataSourceSetImporter="studio:dataSourceSetImporter",e.dataSourceSetExporter="studio:dataSourceSetExporter",e.setDragAbsolute="studio:setDragAbsolute",e))(M||{});const U={[k.free]:0,[k.startup]:10,[k.business]:20,[k.enterprise]:30};function J(e){const n=e;return n.init=t=>s=>e(s,t),n}const X=e=>J(e);async function Z({editor:e,plan:n,pluginName:t,licenseKey:s,cleanup:a}){let o="",i=!1;const r=q(),p=c=>{console.warn("Cleanup plugin:",t,"Reason:",c),a()},d=(c={})=>{var l;const{error:u,sdkLicense:g}=c,f=(l=c.plan)==null?void 0:l.category;if(!(g||c.license)||u)p(u||"Invalid license");else if(f){const b=U[n],B=U[f];b>B&&p({pluginRequiredPlan:n,licensePlan:f})}};e.on(N,c=>{o=c==null?void 0:c.baseApiUrl,i=!0}),e.on(z,c=>{d(c)}),setTimeout(async()=>{if(!i){if(r)return;if(s){const c=await Q({licenseKey:s,pluginName:t,baseApiUrl:o});c&&d(c)}else p("The `licenseKey` option not provided")}},2e3)}async function Q(e){const{licenseKey:n,pluginName:t,baseApiUrl:s}=e;try{return(await Y({baseApiUrl:s,path:`/sdk/${n||"na"}`,method:"POST",params:{d:window.location.hostname,pn:t}})).result||{}}catch(a){return console.error("Error during SDK license check:",a),!1}}const ee=e=>n=>{var t;return((t=n.getAttribute)==null?void 0:t.call(n,F))===e},te=(...e)=>(n,t)=>e.some(s=>t.is(s)),G=(e,n,t)=>{const{doc:s=document}=t,a=t.target||s.head,o=a.querySelector(`style[${e}]`)||s.createElement("style");o.setAttribute(e,"true"),o.innerHTML=n,!a.contains(o)&&a.appendChild(o)},se="gjs-plg-",O="data-gs-plg-",F="data-type-role";function I(e,n,t){let s,a,o,i,r;const p=n===void 0?100:n;function d(){const u=Date.now()-i;u<p&&u>=0?s=setTimeout(d,p-u):(s=null,r=e.apply(o,a),o=a=null)}const c=function(){return o=this,a=arguments,i=Date.now(),s||(s=setTimeout(d,p)),r};return c.clear=function(){s&&(clearTimeout(s),s=null)},c.flush=function(){s&&(r=e.apply(o,a),o=a=null,clearTimeout(s),s=null)},c}const P="page-break";function $(e,n){const s={mm:3.7795275590551185,cm:37.79527559055118,in:96,pt:1.3333333333333333,pc:16};return s[n]?e*s[n]:null}const ne=(e,n)=>{const{name:t,id:s,width:a,height:o,unit:i}=e,{fixedHeight:r}=n,p=`${a}${i}`,d=`${o}${i}`;return{id:s||t.toLowerCase().replace(/\s/g,"-"),name:`${t} (${p} x ${d})`,sizeH:o,sizeW:a,sizeUnit:i,widthMedia:"",width:p,minHeight:r?"0":`${$(o,i)}px`,height:r?d:void 0}},D="page-breaks",R="gjs-page-breaks-spot",x=e=>e.type===D;function oe(e){const{Devices:n}=e,{height:t,minHeight:s}=n.getSelected().attributes,o=parseFloat(`${t&&t!=="auto"?t:s}`),i=e.getWrapper(),r=i==null?void 0:i.getEl(),p=[];if(!i||!r)return p;const d=r.getBoundingClientRect().height,u=i.findType(P).map(f=>f.getEl()).filter(Boolean).map(f=>({top:f.offsetTop,height:f.offsetHeight}));let g=0;for(;g<d;){const f=u.find(m=>m.top>g&&m.top<g+o);f?(g=f.top+f.height,p.push(f.top)):(g+=o,g<d&&p.push(g))}return p}function ae(e,n){const{Canvas:t}=e,s=t.events,a=e.events;let o;const i=()=>{G(`${O}preset-printable-spots`,`.${R} {
         position: absolute;
         left: 0;
         width: 100%;
         border-top: 1px dashed var(--gs-theme-cl-cmp-bg2, var(--gjs-color-blue));
       }
-      .${L}::after {
+      .${R}::after {
         background-color: var(--gs-theme-cl-cmp-bg1, var(--gjs-color-highlight));
         content: attr(data-page-number);
         display: block;
@@ -15,7 +15,7 @@
         right: 0;
         transform: translate(100%, -50%);
       }
-      `,{target:window.document.head})},c=()=>{if(n.enablePageBreaksSpot===!1)return;const r={id:S,type:S,component:e.getWrapper()};return t.getSpots(r).pop()||t.addSpot(r)},p=({spot:r})=>{const{spotEl:h}=r.attributes;!x(r)||!h||!o||o.removeChild(h)},g=({spot:r})=>{if(!x(r)||!o)return;let{spotEl:h}=r.attributes;h||(h=document.createElement("div"),h.className=`${L}__items`,r.set({spotEl:h})),o.appendChild(h)},l=({spot:r})=>{const{spotEl:h,pageBreaks:A=[]}=r.attributes;!x(r)||!h||!o||(Object.entries(r.getStyle()).forEach(([P,B])=>h.style.setProperty(P,B)),h.innerHTML="",A.forEach((P,B)=>{const b=document.createElement("div");b.setAttribute("data-page-number",`${B+2}`),b.className=L,b.style.top=`${P}px`,h.appendChild(b)}))},u=se(()=>{const r=c();r&&r.set({pageBreaks:oe(e),up:(r.attributes.up||0)+1})},150),d=()=>{o=t.getSpotsEl(),c()},f=[["component:input",u],[a.update,u],[s.spotAdd,g],[s.spotUpdate,l],[s.spotRemove,p],[s.frameLoadBody,d]];return f.forEach(([r,h])=>e.on(r,h)),e.onReady(()=>{i()}),()=>{f.forEach(([r,h])=>e.off(r,h)),u.clear()}}var j=(e=>(e.print="presetPrintable:print",e))(j||{});const O=e=>new Promise(n=>{const t=document.createElement("iframe");t.style.cssText="position: absolute; width: 0; height: 0; border: 0; opacity: 0; pointer-events: none;",t.srcdoc=e.content,t.onload=()=>n(t),document.body.appendChild(t)});function ie(e,n){const{Commands:t,Pages:s}=e;return t.add(j.print,async(a,o,i={})=>{const c={page:i.allPages?void 0:s.getSelected(),styles:"inline"},g=(await t.run(M.projectFiles,c)).filter(d=>d.filename.endsWith(".html")),l=g.map(d=>d.content).join('<div style="break-before: page;"></div>'),u=[];if(i.separatePrints)for(const d of g)u.push(await O(d));else u.push(await O({content:l,filename:"",mimeType:""}));for(const d of u){const f=d.contentWindow;f.focus(),f.print()}setTimeout(()=>u.forEach(d=>d.remove()),1e3)}),t.add("presetPrintable:exp",async a=>{await H("https://cdn.jsdelivr.net/npm/html2canvas@1.4.1/dist/html2canvas.min.js"),await H("https://cdn.jsdelivr.net/npm/jspdf@3.0.0/dist/jspdf.umd.min.js");const{Devices:o,Canvas:i}=a,{sizeW:c,sizeH:p,sizeUnit:g}=o.getSelected().attributes,l=i.getFrameEl().contentDocument,u="px",d=[D(c,g),D(p,g)],f=new window.jspdf.jsPDF({unit:u,format:d}),r=l.body;f.html(r,{callback:h=>h.save()})}),()=>{delete e.Commands.commands[j.print]}}function re(e,n){const{blockPageBreak:t={}}=n,{Components:s,Blocks:a}=e,o="Page Break",i=`${te}${y}`;return s.addType(y,{block:t&&{label:o,media:'<svg viewBox="0 0 24 24"><path d="M18 20H6v-2H4v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-2h-2v2M14 2H6a2 2 0 0 0-2 2v8h2V4h8v4h4v4h2V8l-6-6m-3 14H8v-2h3v2m5 0h-3v-2h3v2M3 14h3v2H3v-2m18 2h-3v-2h3v2Z"/></svg>',category:"Extra",select:!0,...t},isComponent:Q(y),model:{defaults:{name:o,classes:i,attributes:{[W]:y},emptyState:!0,stylable:!1,droppable:!1,draggable:ee("wrapper"),styles:`.${i} { break-before: page; }`,traits:[]}}}),()=>{s.removeType(y),a.remove(y)}}const ce="presetPrintable";return J(function(e,n={}){const t={selectedDevice:"a4",...n},{Canvas:s,Devices:a}=e,o=s.events,i=e.events,c=t.selectedDevice||a.getConfig().default,g=[{name:"A5",width:148,height:210,unit:"mm"},{name:"A5 Portrait",width:210,height:148,unit:"mm"},{name:"A4",width:210,height:297,unit:"mm"},{name:"A3",width:297,height:420,unit:"mm"},{name:"B5",width:176,height:250,unit:"mm"},{name:"B4",width:250,height:353,unit:"mm"},{name:"Letter",width:8.5,height:11,unit:"in"},{name:"Legal",width:8.5,height:14,unit:"in"},{name:"Ledger",width:11,height:17,unit:"in"}].map(b=>ne(b,t));a.devices.reset(g);const l=c&&a.get(c)||a.getAll().at(0);a.select(l);const u=()=>{const b="page-rule",{rules:v}=e.Css,{width:w,height:m,minHeight:R}=a.getSelected().attributes,$=m&&m!=="auto"?m:R;(v.where({id:b}).pop()||v.add({id:b,selectors:[],selectorsAdd:"@page"},{at:0})).setStyle({size:`${w} ${$}`,margin:"0"})},d=b=>{const v=b.document,{minHeight:w}=a.getSelected().attributes,R=`
+      `,{target:window.document.head})},r=()=>{if(n.enablePageBreaksSpot===!1)return;const l={id:D,type:D,component:e.getWrapper()};return t.getSpots(l).pop()||t.addSpot(l)},p=({spot:l})=>{const{spotEl:b}=l.attributes;!x(l)||!b||!o||o.removeChild(b)},d=({spot:l})=>{if(!x(l)||!o)return;let{spotEl:b}=l.attributes;b||(b=document.createElement("div"),b.className=`${R}__items`,l.set({spotEl:b})),o.appendChild(b)},c=({spot:l})=>{const{spotEl:b,pageBreaks:B=[]}=l.attributes;!x(l)||!b||!o||(Object.entries(l.getStyle()).forEach(([A,v])=>b.style.setProperty(A,v)),b.innerHTML="",B.forEach((A,v)=>{const h=document.createElement("div");h.setAttribute("data-page-number",`${v+2}`),h.className=R,h.style.top=`${A}px`,b.appendChild(h)}))},u=I(()=>{if(e.em.destroyed)return;const l=r();l&&l.set({pageBreaks:oe(e),up:(l.attributes.up||0)+1})},150),g=I(u,200),f=()=>{o=t.getSpotsEl(),r()},m=[["component:input",u],[a.update,u],[s.spotAdd,d],[s.spotUpdate,c],[s.spotRemove,p],[s.frameLoadBody,f]];return m.forEach(([l,b])=>e.on(l,b)),e.onReady(()=>{i(),new ResizeObserver(g).observe(t.getElement().parentElement)}),()=>{m.forEach(([l,b])=>e.off(l,b)),u.clear(),g.clear()}}var j=(e=>(e.print="presetPrintable:print",e))(j||{});const W=e=>new Promise(n=>{const t=document.createElement("iframe");t.style.cssText="position: absolute; width: 0; height: 0; border: 0; opacity: 0; pointer-events: none;",t.srcdoc=e.content,t.onload=()=>n(t),document.body.appendChild(t)});function ie(e,n){const{Commands:t,Pages:s}=e;return t.add(j.print,async(a,o,i={})=>{const r={page:i.allPages?void 0:s.getSelected(),styles:"inline",optionsHtml:{exporter:null}},d=(await t.run(M.projectFiles,r)).filter(g=>g.filename.endsWith(".html")),c=d.map(g=>g.content).join('<div style="break-before: page;"></div>'),u=[];if(i.separatePrints)for(const g of d)u.push(await W(g));else u.push(await W({content:c,filename:"",mimeType:""}));for(const g of u){const f=g.contentWindow;f.focus(),f.print()}setTimeout(()=>u.forEach(g=>g.remove()),1e3)}),t.add("presetPrintable:exp",async a=>{await _("https://cdn.jsdelivr.net/npm/html2canvas@1.4.1/dist/html2canvas.min.js"),await _("https://cdn.jsdelivr.net/npm/jspdf@3.0.0/dist/jspdf.umd.min.js");const{Devices:o,Canvas:i}=a,{sizeW:r,sizeH:p,sizeUnit:d}=o.getSelected().attributes,c=i.getFrameEl().contentDocument,u="px",g=[$(r,d),$(p,d)],f=new window.jspdf.jsPDF({unit:u,format:g}),m=c.body;f.html(m,{callback:l=>l.save()})}),()=>{delete e.Commands.commands[j.print]}}function re(e,n){const{blockPageBreak:t={}}=n,{Components:s,Blocks:a}=e,o="Page Break",i=`${se}${P}`;return s.addType(P,{block:t&&{label:o,media:'<svg viewBox="0 0 24 24"><path d="M18 20H6v-2H4v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-2h-2v2M14 2H6a2 2 0 0 0-2 2v8h2V4h8v4h4v4h2V8l-6-6m-3 14H8v-2h3v2m5 0h-3v-2h3v2M3 14h3v2H3v-2m18 2h-3v-2h3v2Z"/></svg>',category:"Extra",select:!0,...t},isComponent:ee(P),model:{defaults:{name:o,classes:i,attributes:{[F]:P},emptyState:!0,stylable:!1,droppable:!1,draggable:te("wrapper"),styles:`.${i} { break-before: page; }`,traits:[]}}}),()=>{s.removeType(P),a.remove(P)}}const ce="presetPrintable";return X(function(e,n={}){const t={selectedDevice:"a4",...n},{Canvas:s,Devices:a}=e,o=s.events,i=e.events,r=t.selectedDevice||a.getConfig().default,d=[{name:"A5",width:148,height:210,unit:"mm"},{name:"A5 Portrait",width:210,height:148,unit:"mm"},{name:"A4",width:210,height:297,unit:"mm"},{name:"A3",width:297,height:420,unit:"mm"},{name:"B5",width:176,height:250,unit:"mm"},{name:"B4",width:250,height:353,unit:"mm"},{name:"Letter",width:8.5,height:11,unit:"in"},{name:"Legal",width:8.5,height:14,unit:"in"},{name:"Ledger",width:11,height:17,unit:"in"}].map(v=>ne(v,t));a.devices.reset(d);const c=r&&a.get(r)||a.getAll().at(0);a.select(c);const u=()=>{const v="page-rule",{rules:h}=e.Css,{width:w,height:y,minHeight:S}=a.getSelected().attributes,L=y&&y!=="auto"?y:S;(h.where({id:v}).pop()||h.add({id:v,selectors:[],selectorsAdd:"@page"},{at:0})).setStyle({size:`${w} ${L}`,margin:"0"})},g=v=>{const h=v.document,{minHeight:w}=a.getSelected().attributes,S=`
       ${!!parseFloat(`${w}`)?`
         [data-gjs-type="wrapper"] { min-height: ${w}; }
       `:`
@@ -28,4 +28,4 @@
             height: 100dvh;
         }
       `}
-    `;G(`${F}preset-printable`,R,{doc:v,target:v.head}),u()};e.on(o.frameLoadBody,b=>{const v=b.window;if(d(v),t.fixedHeight){const m=b.model.getComponent().getEl();m==null||m.addEventListener("scroll",R=>{const $=R.target;$.scrollTop>0&&$.scrollTo(0,0)})}}),e.on(a.events.select,()=>{var v;const b=(v=s.getFrameEl().contentDocument)==null?void 0:v.defaultView;b&&d(b)});const f=()=>{const v=e.Css.getRules().filter(w=>w.selectorsToString()==="body").pop();v==null||v.addStyle({"margin-top":"","margin-right":"","margin-bottom":"","margin-left":"",margin:"0"})},r=[[i.projectLoad,f]];r.forEach(([b,v])=>e.on(b,v));const h=ae(e,t),A=ie(e),P=re(e,t);e.onReady(()=>{e.UndoManager.clear()});const B=()=>{r.forEach(([b,v])=>e.off(b,v)),h(),A(),P()};X({editor:e,licenseKey:t.licenseKey,plan:k.startup,pluginName:ce,cleanup:B})})});
+    `;G(`${O}preset-printable`,S,{doc:h,target:h.head}),u()};e.on(o.frameLoadBody,v=>{const h=v.window;if(g(h),t.fixedHeight){const y=v.model.getComponent().getEl();y==null||y.addEventListener("scroll",S=>{const L=S.target;L.scrollTop>0&&L.scrollTo(0,0)})}}),e.on(a.events.select,()=>{var h;const v=(h=s.getFrameEl().contentDocument)==null?void 0:h.defaultView;v&&g(v)});const f=()=>{const h=e.Css.getRules().filter(w=>w.selectorsToString()==="body").pop();h==null||h.addStyle({"margin-top":"","margin-right":"","margin-bottom":"","margin-left":"",margin:"0"})},m=[[i.projectLoad,f]];m.forEach(([v,h])=>e.on(v,h));const l=ae(e,t),b=ie(e),B=re(e,t);e.onReady(()=>{e.UndoManager.clear()});const A=()=>{m.forEach(([v,h])=>e.off(v,h)),l(),b(),B()};e.on(i.destroy,A),Z({editor:e,licenseKey:t.licenseKey,plan:k.startup,pluginName:ce,cleanup:A})})});