@grapesjs/studio-sdk-plugins 1.0.28-rc.0 → 1.0.28-rc.2

package/dist/canvasFullSize/index.cjs.js

@@ -1,4 +1,4 @@
-"use strict";function B(e,i,s){let n,a,c,d,m;const r=i;function l(){const u=Date.now()-d;u<r&&u>=0?n=setTimeout(l,r-u):(n=null,m=e.apply(c,a),c=a=null)}const o=function(){return c=this,a=arguments,d=Date.now(),n||(n=setTimeout(l,r)),m};return o.clear=function(){n&&(clearTimeout(n),n=null)},o.flush=function(){n&&(m=e.apply(c,a),c=a=null,clearTimeout(n),n=null)},o}const _="app.grapesjs.com",k="app-stage.grapesjs.com",P=[_,k,"localhost","127.0.0.1",".local-credentialless.webcontainer.io",".local.webcontainer.io","-sandpack.codesandbox.io"],G="license:check:start",X="license:check:end",Y=()=>typeof window<"u",Z=({isDev:e,isStage:i})=>`${e?"":`https://${i?k:_}`}/api`,J=()=>{const e=Y()&&window.location.hostname;return!!e&&(P.includes(e)||P.some(i=>e.endsWith(i)))};async function Q({path:e,baseApiUrl:i,method:s="GET",headers:n={},params:a,body:c}){const m=`${i||Z({isDev:!1,isStage:!1})}${e}`,r={method:s,headers:{"Content-Type":"application/json",...n}};c&&(r.body=JSON.stringify(c));const l=a?new URLSearchParams(a).toString():"",o=l?`?${l}`:"",u=await fetch(`${m}${o}`,r);if(!u.ok)throw new Error(`HTTP error! status: ${u.status}`);return u.json()}var v=(e=>(e.free="free",e.startup="startup",e.business="business",e.enterprise="enterprise",e))(v||{});const V={[v.free]:0,[v.startup]:10,[v.business]:20,[v.enterprise]:30};function ee(e){const i=e;return i.init=s=>n=>e(n,s),i}const te=e=>ee(e);async function ne({editor:e,plan:i,pluginName:s,licenseKey:n,cleanup:a}){let c="",d=!1;const m=J(),r=o=>{console.warn("Cleanup plugin:",s,"Reason:",o),a()},l=(o={})=>{var b;const{error:u,sdkLicense:w}=o,g=(b=o.plan)==null?void 0:b.category;if(!(w||o.license)||u)r(u||"Invalid license");else if(g){const E=V[i],L=V[g];E>L&&r({pluginRequiredPlan:i,licensePlan:g})}};e.on(G,o=>{c=o==null?void 0:o.baseApiUrl,d=!0}),e.on(X,o=>{l(o)}),setTimeout(async()=>{if(!d){if(m)return;if(n){const o=await se({licenseKey:n,pluginName:s,baseApiUrl:c});o&&l(o)}else r("The `licenseKey` option not provided")}},2e3)}async function se(e){const{licenseKey:i,pluginName:s,baseApiUrl:n}=e;try{return(await Q({baseApiUrl:n,path:`/sdk/${i||"na"}`,method:"POST",params:{d:window.location.hostname,pn:s}})).result||{}}catch(a){return console.error("Error during SDK license check:",a),!1}}const W="canvasFullSize",oe=v.startup,ae=(e,i)=>{const{rule:s,ruleView:n}=i,{style:a}=s.attributes;if(a&&a[e]){const c=a[e],d=/([0-9.]+)(vh|dvh|lvh|svh)/g,m=d.test(c),r=n.frameView.model;if(m&&r.hasAutoHeight()){const l=c.replace(d,(u,w)=>`${window.innerHeight*(parseFloat(w)/100)}px`),o=s.toCSS({style:{...a,[e]:l}});i.css=o}}},ie=e=>{["height","min-height","max-height"].forEach(i=>ae(i,e))},ce=function(e,i={}){const{Canvas:s,Commands:n,Devices:a,Css:c}=e,d={deviceMaxWidth:1200,deviceMinHeigth:500,canvasOffsetY:30,canvasOffsetX:50,canvasTransition:.3,frameBorderRadius:5,frameTransition:.3,...i},{canvasOffsetY:m,canvasOffsetX:r,canvasTransition:l,deviceMaxWidth:o,deviceMinHeigth:u,frameBorderRadius:w,frameTransition:g}=d,y=`${u}px`,b=s.events,E="core:preview",L=`${n.events.stopCommand}${E}`,x=s.getConfig(),M=`${W}:disable`,O=a.getAll().map(t=>({...t.attributes})),R=l*1e3,U={x:r,y:m};let C={},A,S;x.scrollableCanvas=!0,a.getAll().map(t=>{!t.get("width")&&t.set("width",`${o}px`),!t.get("height")&&t.set("height","auto"),!t.get("minHeight")&&t.set("minHeight",y)});const H=t=>{const p="data-gs-plg-full-size",h=document.querySelector(`style[${p}]`);if(t&&h)return h.remove();const f=h||document.createElement("style"),T=s.getZoomMultiplier();f.setAttribute(p,"true"),f.innerHTML=`
+"use strict";function B(e,i,n){let s,a,c,d,m;const r=i;function l(){const u=Date.now()-d;u<r&&u>=0?s=setTimeout(l,r-u):(s=null,m=e.apply(c,a),c=a=null)}const o=function(){return c=this,a=arguments,d=Date.now(),s||(s=setTimeout(l,r)),m};return o.clear=function(){s&&(clearTimeout(s),s=null)},o.flush=function(){s&&(m=e.apply(c,a),c=a=null,clearTimeout(s),s=null)},o}const W="app.grapesjs.com",_="app-stage.grapesjs.com",I=[W,_,"localhost","127.0.0.1",".local-credentialless.webcontainer.io",".local.webcontainer.io","-sandpack.codesandbox.io"],G="license:check:start",X="license:check:end",Y=()=>typeof window<"u",Z=({isDev:e,isStage:i})=>`${e?"":`https://${i?_:W}`}/api`,J=()=>{const e=Y()&&window.location.hostname;return!!e&&(I.includes(e)||I.some(i=>e.endsWith(i)))};async function Q({path:e,baseApiUrl:i,method:n="GET",headers:s={},params:a,body:c}){const m=`${i||Z({isDev:!1,isStage:!1})}${e}`,r={method:n,headers:{"Content-Type":"application/json",...s}};c&&(r.body=JSON.stringify(c));const l=a?new URLSearchParams(a).toString():"",o=l?`?${l}`:"",u=await fetch(`${m}${o}`,r);if(!u.ok)throw new Error(`HTTP error! status: ${u.status}`);return u.json()}var v=(e=>(e.free="free",e.startup="startup",e.business="business",e.enterprise="enterprise",e))(v||{});const N={[v.free]:0,[v.startup]:10,[v.business]:20,[v.enterprise]:30};function ee(e){const i=e;return i.init=n=>s=>e(s,n),i}const te=e=>ee(e);async function ne({editor:e,plan:i,pluginName:n,licenseKey:s,cleanup:a}){let c="",d=!1;const m=J(),r=o=>{console.warn("Cleanup plugin:",n,"Reason:",o),a()},l=(o={})=>{var b;const{error:u,sdkLicense:w}=o,g=(b=o.plan)==null?void 0:b.category;if(!(w||o.license)||u)r(u||"Invalid license");else if(g){const S=N[i],L=N[g];S>L&&r({pluginRequiredPlan:i,licensePlan:g})}};e.on(G,o=>{c=o==null?void 0:o.baseApiUrl,d=!0}),e.on(X,o=>{l(o)}),setTimeout(async()=>{if(!d){if(m)return;if(s){const o=await se({licenseKey:s,pluginName:n,baseApiUrl:c});o&&l(o)}else r("The `licenseKey` option not provided")}},2e3)}async function se(e){const{licenseKey:i,pluginName:n,baseApiUrl:s}=e;try{return(await Q({baseApiUrl:s,path:`/sdk/${i||"na"}`,method:"POST",params:{d:window.location.hostname,pn:n}})).result||{}}catch(a){return console.error("Error during SDK license check:",a),!1}}const k="canvasFullSize",oe=v.startup,ae=(e,i)=>{const{rule:n,ruleView:s}=i,{style:a}=n.attributes;if(a&&a[e]){const c=a[e],d=/([0-9.]+)(vh|dvh|lvh|svh)/g,m=d.test(c),r=s.frameView.model;if(m&&r.hasAutoHeight()){const l=c.replace(d,(u,w)=>`${window.innerHeight*(parseFloat(w)/100)}px`),o=n.toCSS({style:{...a,[e]:l}});i.css=o}}},ie=e=>{["height","min-height","max-height"].forEach(i=>ae(i,e))},ce=function(e,i={}){const{Canvas:n,Commands:s,Devices:a,Css:c}=e,d={deviceMaxWidth:1200,deviceMinHeigth:500,canvasOffsetY:30,canvasOffsetX:50,canvasTransition:.3,frameBorderRadius:5,frameTransition:.3,...i},{canvasOffsetY:m,canvasOffsetX:r,canvasTransition:l,deviceMaxWidth:o,deviceMinHeigth:u,frameBorderRadius:w,frameTransition:g}=d,y=`${u}px`,b=n.events,S="core:preview",L=`${s.events.stopCommand}${S}`,x=n.getConfig(),V=`${k}:disable`,O=a.getAll().map(t=>({...t.attributes})),R=l*1e3,M={x:r,y:m};let C={},A,E;x.scrollableCanvas=!0,a.getAll().map(t=>{!t.get("width")&&t.set("width",`${o}px`),!t.get("height")&&t.set("height","auto"),!t.get("minHeight")&&t.set("minHeight",y)});const H=t=>{const p="data-gs-plg-full-size",h=document.querySelector(`style[${p}]`);if(t&&h)return h.remove();const f=h||document.createElement("style"),T=n.getZoomMultiplier();f.setAttribute(p,"true"),f.innerHTML=`
       .gjs-frame-wrapper { transition: width ${g}s !important; }
       .gjs-frame-wrapper__bottom { height: ${m*T}px }
       .gjs-frame { border-radius: ${w}px }
@@ -6,4 +6,4 @@
       [data-gjs-type="wrapper"] { min-height: ${y}; }
       [data-gjs-type="mjml"] { min-height: ${y} !important; }
       [data-gjs-type="mj-body"] { min-height: ${y} !important; }
-    `,!f.contains(D)&&f.appendChild(D)});const j=()=>A.style.display="none",z=()=>A.style.display="",$=B(()=>{s.fitViewport({zoom:t=>t>100?100:t,ignoreHeight:!0,gap:U}),H(),setTimeout(()=>{var p,h;const{em:t}=e;t.destroyed||((h=(p=e.getSelected())==null?void 0:p.getEl())==null||h.scrollIntoView({block:"nearest"}),e.refresh({tools:!0}),z(),n.isActive(E)?t.stopDefault():t.runDefault())},R)},100),F=(t={})=>{t.options&&t.options.from!=="fitViewport"&&s.fitViewport({zoom:s.getZoom(),ignoreHeight:!0,gap:U})},K=()=>{j(),$()},q=()=>{C.overflowX="hidden",C.overflowY="auto"},I=()=>{S==null||S.disconnect(),$.clear()},N=[[a.events.select,K],[b.zoom,F],[L,q],[e.events.destroy,I],[c.events.mountBefore,ie]];n.add(M,()=>{a.devices.reset(O),x.scrollableCanvas=!1,s.getModel().updateDevice(),s.setZoom(100),s.setCoords(0,0),C.overflowY="hidden",H(!0),N.forEach(([t,p])=>e.off(t,p)),I(),n.run("studio:canvasReload")}),N.forEach(([t,p])=>e.on(t,p)),e.onReady(()=>{const t=s.getElement(),p=s.getFramesEl();A=s.getSpotsEl(),C=t.style,C.overflowX="hidden",p.style.transition=`transform ${l}s`,H(),S=new ResizeObserver(()=>{j(),$()}),S.observe(t.parentElement),$()}),ne({editor:e,licenseKey:d.licenseKey,plan:oe,pluginName:W,cleanup:()=>{e.runCommand(M)}})},re=te(ce);module.exports=re;
+    `,!f.contains(D)&&f.appendChild(D)});const P=()=>A.style.display="none",z=()=>A.style.display="",$=B(()=>{n.fitViewport({zoom:t=>t>100?100:t,ignoreHeight:!0,gap:M}),H(),setTimeout(()=>{var p,h;const{em:t}=e;t.destroyed||((h=(p=e.getSelected())==null?void 0:p.getEl())==null||h.scrollIntoView({block:"nearest"}),e.refresh({tools:!0}),z(),s.isActive(S)?t.stopDefault():t.runDefault())},R)},100),K=(t={})=>{t.options&&t.options.from!=="fitViewport"&&n.fitViewport({zoom:n.getZoom(),ignoreHeight:!0,gap:M})},F=()=>{P(),$()},q=()=>{C.overflowX="hidden",C.overflowY="auto"},U=()=>{E==null||E.disconnect(),$.clear()},j=[[a.events.select,F],[b.zoom,K],[L,q],[e.events.destroy,U],[c.events.mountBefore,ie]];s.add(V,()=>{a.devices.reset(O),x.scrollableCanvas=!1,n.getModel().updateDevice(),n.setZoom(100),n.setCoords(0,0),C.overflowY="hidden",H(!0),j.forEach(([t,p])=>e.off(t,p)),U(),s.run("studio:canvasReload")}),j.forEach(([t,p])=>e.on(t,p)),e.onReady(()=>{const t=n.getElement(),p=n.getFramesEl(),h=n.getCanvasView();A=n.getSpotsEl(),C=t.style,C.overflowX="hidden",p.style.transition=`transform ${l}s`,document.removeEventListener("keypress",h.onKeyPress),H(),E=new ResizeObserver(()=>{P(),$()}),E.observe(t.parentElement),$()}),ne({editor:e,licenseKey:d.licenseKey,plan:oe,pluginName:k,cleanup:()=>{e.runCommand(V)}})},re=te(ce);module.exports=re;

package/dist/canvasFullSize/index.es.js

@@ -1,22 +1,22 @@
-function B(e, i, s) {
-  let n, a, c, d, m;
+function B(e, i, n) {
+  let s, a, c, d, m;
   const r = i;
   function l() {
     const u = Date.now() - d;
-    u < r && u >= 0 ? n = setTimeout(l, r - u) : (n = null, m = e.apply(c, a), c = a = null);
+    u < r && u >= 0 ? s = setTimeout(l, r - u) : (s = null, m = e.apply(c, a), c = a = null);
   }
   const o = function() {
-    return c = this, a = arguments, d = Date.now(), n || (n = setTimeout(l, r)), m;
+    return c = this, a = arguments, d = Date.now(), s || (s = setTimeout(l, r)), m;
   };
   return o.clear = function() {
-    n && (clearTimeout(n), n = null);
+    s && (clearTimeout(s), s = null);
   }, o.flush = function() {
-    n && (m = e.apply(c, a), c = a = null, clearTimeout(n), n = null);
+    s && (m = e.apply(c, a), c = a = null, clearTimeout(s), s = null);
   }, o;
 }
-const _ = "app.grapesjs.com", k = "app-stage.grapesjs.com", P = [
+const W = "app.grapesjs.com", _ = "app-stage.grapesjs.com", I = [
+  W,
   _,
-  k,
   "localhost",
   "127.0.0.1",
   ".local-credentialless.webcontainer.io",
@@ -25,23 +25,23 @@ const _ = "app.grapesjs.com", k = "app-stage.grapesjs.com", P = [
   // For stackblitz.com demos
   "-sandpack.codesandbox.io"
   // For Sandpack demos
-], G = "license:check:start", X = "license:check:end", Y = () => typeof window < "u", Z = ({ isDev: e, isStage: i }) => `${e ? "" : `https://${i ? k : _}`}/api`, J = () => {
+], G = "license:check:start", X = "license:check:end", Y = () => typeof window < "u", Z = ({ isDev: e, isStage: i }) => `${e ? "" : `https://${i ? _ : W}`}/api`, J = () => {
   const e = Y() && window.location.hostname;
-  return !!e && (P.includes(e) || P.some((i) => e.endsWith(i)));
+  return !!e && (I.includes(e) || I.some((i) => e.endsWith(i)));
 };
 async function Q({
   path: e,
   baseApiUrl: i,
-  method: s = "GET",
-  headers: n = {},
+  method: n = "GET",
+  headers: s = {},
   params: a,
   body: c
 }) {
   const m = `${i || Z({ isDev: !1, isStage: !1 })}${e}`, r = {
-    method: s,
+    method: n,
     headers: {
       "Content-Type": "application/json",
-      ...n
+      ...s
     }
   };
   c && (r.body = JSON.stringify(c));
@@ -51,7 +51,7 @@ async function Q({
   return u.json();
 }
 var v = /* @__PURE__ */ ((e) => (e.free = "free", e.startup = "startup", e.business = "business", e.enterprise = "enterprise", e))(v || {});
-const V = {
+const N = {
   [v.free]: 0,
   [v.startup]: 10,
   [v.business]: 20,
@@ -59,27 +59,27 @@ const V = {
 };
 function ee(e) {
   const i = e;
-  return i.init = (s) => (n) => e(n, s), i;
+  return i.init = (n) => (s) => e(s, n), i;
 }
 const te = (e) => /* @__PURE__ */ ee(e);
 async function ne({
   editor: e,
   plan: i,
-  pluginName: s,
-  licenseKey: n,
+  pluginName: n,
+  licenseKey: s,
   cleanup: a
 }) {
   let c = "", d = !1;
   const m = J(), r = (o) => {
-    console.warn("Cleanup plugin:", s, "Reason:", o), a();
+    console.warn("Cleanup plugin:", n, "Reason:", o), a();
   }, l = (o = {}) => {
     var b;
     const { error: u, sdkLicense: w } = o, g = (b = o.plan) == null ? void 0 : b.category;
     if (!(w || o.license) || u)
       r(u || "Invalid license");
     else if (g) {
-      const E = V[i], L = V[g];
-      E > L && r({ pluginRequiredPlan: i, licensePlan: g });
+      const S = N[i], L = N[g];
+      S > L && r({ pluginRequiredPlan: i, licensePlan: g });
     }
   };
   e.on(G, (o) => {
@@ -89,8 +89,8 @@ async function ne({
   }), setTimeout(async () => {
     if (!d) {
       if (m) return;
-      if (n) {
-        const o = await se({ licenseKey: n, pluginName: s, baseApiUrl: c });
+      if (s) {
+        const o = await se({ licenseKey: s, pluginName: n, baseApiUrl: c });
         o && l(o);
       } else
         r("The `licenseKey` option not provided");
@@ -98,27 +98,27 @@ async function ne({
   }, 2e3);
 }
 async function se(e) {
-  const { licenseKey: i, pluginName: s, baseApiUrl: n } = e;
+  const { licenseKey: i, pluginName: n, baseApiUrl: s } = e;
   try {
     return (await Q({
-      baseApiUrl: n,
+      baseApiUrl: s,
       path: `/sdk/${i || "na"}`,
       method: "POST",
       params: {
         d: window.location.hostname,
-        pn: s
+        pn: n
       }
     })).result || {};
   } catch (a) {
     return console.error("Error during SDK license check:", a), !1;
   }
 }
-const W = "canvasFullSize", oe = v.startup, ae = (e, i) => {
-  const { rule: s, ruleView: n } = i, { style: a } = s.attributes;
+const k = "canvasFullSize", oe = v.startup, ae = (e, i) => {
+  const { rule: n, ruleView: s } = i, { style: a } = n.attributes;
   if (a && a[e]) {
-    const c = a[e], d = /([0-9.]+)(vh|dvh|lvh|svh)/g, m = d.test(c), r = n.frameView.model;
+    const c = a[e], d = /([0-9.]+)(vh|dvh|lvh|svh)/g, m = d.test(c), r = s.frameView.model;
     if (m && r.hasAutoHeight()) {
-      const l = c.replace(d, (u, w) => `${window.innerHeight * (parseFloat(w) / 100)}px`), o = s.toCSS({
+      const l = c.replace(d, (u, w) => `${window.innerHeight * (parseFloat(w) / 100)}px`), o = n.toCSS({
         style: {
           ...a,
           [e]: l
@@ -130,7 +130,7 @@ const W = "canvasFullSize", oe = v.startup, ae = (e, i) => {
 }, ie = (e) => {
   ["height", "min-height", "max-height"].forEach((i) => ae(i, e));
 }, ce = function(e, i = {}) {
-  const { Canvas: s, Commands: n, Devices: a, Css: c } = e, d = {
+  const { Canvas: n, Commands: s, Devices: a, Css: c } = e, d = {
     deviceMaxWidth: 1200,
     deviceMinHeigth: 500,
     canvasOffsetY: 30,
@@ -147,8 +147,8 @@ const W = "canvasFullSize", oe = v.startup, ae = (e, i) => {
     deviceMinHeigth: u,
     frameBorderRadius: w,
     frameTransition: g
-  } = d, y = `${u}px`, b = s.events, E = "core:preview", L = `${n.events.stopCommand}${E}`, x = s.getConfig(), M = `${W}:disable`, O = a.getAll().map((t) => ({ ...t.attributes })), R = l * 1e3, U = { x: r, y: m };
-  let C = {}, A, S;
+  } = d, y = `${u}px`, b = n.events, S = "core:preview", L = `${s.events.stopCommand}${S}`, x = n.getConfig(), V = `${k}:disable`, O = a.getAll().map((t) => ({ ...t.attributes })), R = l * 1e3, M = { x: r, y: m };
+  let C = {}, A, E;
   x.scrollableCanvas = !0, a.getAll().map((t) => {
     !t.get("width") && t.set("width", `${o}px`), !t.get("height") && t.set("height", "auto"), !t.get("minHeight") && t.set("minHeight", y);
   });
@@ -156,7 +156,7 @@ const W = "canvasFullSize", oe = v.startup, ae = (e, i) => {
     const p = "data-gs-plg-full-size", h = document.querySelector(`style[${p}]`);
     if (t && h)
       return h.remove();
-    const f = h || document.createElement("style"), T = s.getZoomMultiplier();
+    const f = h || document.createElement("style"), T = n.getZoomMultiplier();
     f.setAttribute(p, "true"), f.innerHTML = `
       .gjs-frame-wrapper { transition: width ${g}s !important; }
       .gjs-frame-wrapper__bottom { height: ${m * T}px }
@@ -172,49 +172,49 @@ const W = "canvasFullSize", oe = v.startup, ae = (e, i) => {
       [data-gjs-type="mj-body"] { min-height: ${y} !important; }
     `, !f.contains(D) && f.appendChild(D);
   });
-  const j = () => A.style.display = "none", z = () => A.style.display = "", $ = B(() => {
-    s.fitViewport({
+  const P = () => A.style.display = "none", z = () => A.style.display = "", $ = B(() => {
+    n.fitViewport({
       zoom: (t) => t > 100 ? 100 : t,
       ignoreHeight: !0,
-      gap: U
+      gap: M
     }), H(), setTimeout(() => {
       var p, h;
       const { em: t } = e;
-      t.destroyed || ((h = (p = e.getSelected()) == null ? void 0 : p.getEl()) == null || h.scrollIntoView({ block: "nearest" }), e.refresh({ tools: !0 }), z(), n.isActive(E) ? t.stopDefault() : t.runDefault());
+      t.destroyed || ((h = (p = e.getSelected()) == null ? void 0 : p.getEl()) == null || h.scrollIntoView({ block: "nearest" }), e.refresh({ tools: !0 }), z(), s.isActive(S) ? t.stopDefault() : t.runDefault());
     }, R);
-  }, 100), F = (t = {}) => {
-    t.options && t.options.from !== "fitViewport" && s.fitViewport({
-      zoom: s.getZoom(),
+  }, 100), K = (t = {}) => {
+    t.options && t.options.from !== "fitViewport" && n.fitViewport({
+      zoom: n.getZoom(),
       ignoreHeight: !0,
-      gap: U
+      gap: M
     });
-  }, K = () => {
-    j(), $();
+  }, F = () => {
+    P(), $();
   }, q = () => {
     C.overflowX = "hidden", C.overflowY = "auto";
-  }, I = () => {
-    S == null || S.disconnect(), $.clear();
-  }, N = [
-    [a.events.select, K],
-    [b.zoom, F],
+  }, U = () => {
+    E == null || E.disconnect(), $.clear();
+  }, j = [
+    [a.events.select, F],
+    [b.zoom, K],
     [L, q],
-    [e.events.destroy, I],
+    [e.events.destroy, U],
     [c.events.mountBefore, ie]
   ];
-  n.add(M, () => {
-    a.devices.reset(O), x.scrollableCanvas = !1, s.getModel().updateDevice(), s.setZoom(100), s.setCoords(0, 0), C.overflowY = "hidden", H(!0), N.forEach(([t, p]) => e.off(t, p)), I(), n.run("studio:canvasReload");
-  }), N.forEach(([t, p]) => e.on(t, p)), e.onReady(() => {
-    const t = s.getElement(), p = s.getFramesEl();
-    A = s.getSpotsEl(), C = t.style, C.overflowX = "hidden", p.style.transition = `transform ${l}s`, H(), S = new ResizeObserver(() => {
-      j(), $();
-    }), S.observe(t.parentElement), $();
+  s.add(V, () => {
+    a.devices.reset(O), x.scrollableCanvas = !1, n.getModel().updateDevice(), n.setZoom(100), n.setCoords(0, 0), C.overflowY = "hidden", H(!0), j.forEach(([t, p]) => e.off(t, p)), U(), s.run("studio:canvasReload");
+  }), j.forEach(([t, p]) => e.on(t, p)), e.onReady(() => {
+    const t = n.getElement(), p = n.getFramesEl(), h = n.getCanvasView();
+    A = n.getSpotsEl(), C = t.style, C.overflowX = "hidden", p.style.transition = `transform ${l}s`, document.removeEventListener("keypress", h.onKeyPress), H(), E = new ResizeObserver(() => {
+      P(), $();
+    }), E.observe(t.parentElement), $();
   }), ne({
     editor: e,
     licenseKey: d.licenseKey,
     plan: oe,
-    pluginName: W,
+    pluginName: k,
     cleanup: () => {
-      e.runCommand(M);
+      e.runCommand(V);
     }
   });
 }, re = te(ce);

package/dist/canvasFullSize/index.umd.js

@@ -1,9 +1,9 @@
-(function(y,g){typeof exports=="object"&&typeof module<"u"?module.exports=g():typeof define=="function"&&define.amd?define(g):(y=typeof globalThis<"u"?globalThis:y||self,y.StudioSdkPlugins_canvasFullSize=g())})(this,function(){"use strict";function y(e,a,s){let n,i,c,p,f;const r=a;function l(){const u=Date.now()-p;u<r&&u>=0?n=setTimeout(l,r-u):(n=null,f=e.apply(c,i),c=i=null)}const o=function(){return c=this,i=arguments,p=Date.now(),n||(n=setTimeout(l,r)),f};return o.clear=function(){n&&(clearTimeout(n),n=null)},o.flush=function(){n&&(f=e.apply(c,i),c=i=null,clearTimeout(n),n=null)},o}const g="app.grapesjs.com",P="app-stage.grapesjs.com",U=[g,P,"localhost","127.0.0.1",".local-credentialless.webcontainer.io",".local.webcontainer.io","-sandpack.codesandbox.io"],R="license:check:start",z="license:check:end",F=()=>typeof window<"u",K=({isDev:e,isStage:a})=>`${e?"":`https://${a?P:g}`}/api`,q=()=>{const e=F()&&window.location.hostname;return!!e&&(U.includes(e)||U.some(a=>e.endsWith(a)))};async function B({path:e,baseApiUrl:a,method:s="GET",headers:n={},params:i,body:c}){const f=`${a||K({isDev:!1,isStage:!1})}${e}`,r={method:s,headers:{"Content-Type":"application/json",...n}};c&&(r.body=JSON.stringify(c));const l=i?new URLSearchParams(i).toString():"",o=l?`?${l}`:"",u=await fetch(`${f}${o}`,r);if(!u.ok)throw new Error(`HTTP error! status: ${u.status}`);return u.json()}var v=(e=>(e.free="free",e.startup="startup",e.business="business",e.enterprise="enterprise",e))(v||{});const I={[v.free]:0,[v.startup]:10,[v.business]:20,[v.enterprise]:30};function G(e){const a=e;return a.init=s=>n=>e(n,s),a}const X=e=>G(e);async function Y({editor:e,plan:a,pluginName:s,licenseKey:n,cleanup:i}){let c="",p=!1;const f=q(),r=o=>{console.warn("Cleanup plugin:",s,"Reason:",o),i()},l=(o={})=>{var C;const{error:u,sdkLicense:b}=o,w=(C=o.plan)==null?void 0:C.category;if(!(b||o.license)||u)r(u||"Invalid license");else if(w){const $=I[a],A=I[w];$>A&&r({pluginRequiredPlan:a,licensePlan:w})}};e.on(R,o=>{c=o==null?void 0:o.baseApiUrl,p=!0}),e.on(z,o=>{l(o)}),setTimeout(async()=>{if(!p){if(f)return;if(n){const o=await Z({licenseKey:n,pluginName:s,baseApiUrl:c});o&&l(o)}else r("The `licenseKey` option not provided")}},2e3)}async function Z(e){const{licenseKey:a,pluginName:s,baseApiUrl:n}=e;try{return(await B({baseApiUrl:n,path:`/sdk/${a||"na"}`,method:"POST",params:{d:window.location.hostname,pn:s}})).result||{}}catch(i){return console.error("Error during SDK license check:",i),!1}}const N="canvasFullSize",J=v.startup,Q=(e,a)=>{const{rule:s,ruleView:n}=a,{style:i}=s.attributes;if(i&&i[e]){const c=i[e],p=/([0-9.]+)(vh|dvh|lvh|svh)/g,f=p.test(c),r=n.frameView.model;if(f&&r.hasAutoHeight()){const l=c.replace(p,(u,b)=>`${window.innerHeight*(parseFloat(b)/100)}px`),o=s.toCSS({style:{...i,[e]:l}});a.css=o}}},ee=e=>{["height","min-height","max-height"].forEach(a=>Q(a,e))};return X(function(e,a={}){const{Canvas:s,Commands:n,Devices:i,Css:c}=e,p={deviceMaxWidth:1200,deviceMinHeigth:500,canvasOffsetY:30,canvasOffsetX:50,canvasTransition:.3,frameBorderRadius:5,frameTransition:.3,...a},{canvasOffsetY:f,canvasOffsetX:r,canvasTransition:l,deviceMaxWidth:o,deviceMinHeigth:u,frameBorderRadius:b,frameTransition:w}=p,S=`${u}px`,C=s.events,$="core:preview",A=`${n.events.stopCommand}${$}`,H=s.getConfig(),V=`${N}:disable`,te=i.getAll().map(t=>({...t.attributes})),ne=l*1e3,_={x:r,y:f};let E={},j,T;H.scrollableCanvas=!0,i.getAll().map(t=>{!t.get("width")&&t.set("width",`${o}px`),!t.get("height")&&t.set("height","auto"),!t.get("minHeight")&&t.set("minHeight",S)});const M=t=>{const d="data-gs-plg-full-size",m=document.querySelector(`style[${d}]`);if(t&&m)return m.remove();const h=m||document.createElement("style"),D=s.getZoomMultiplier();h.setAttribute(d,"true"),h.innerHTML=`
+(function(y,g){typeof exports=="object"&&typeof module<"u"?module.exports=g():typeof define=="function"&&define.amd?define(g):(y=typeof globalThis<"u"?globalThis:y||self,y.StudioSdkPlugins_canvasFullSize=g())})(this,function(){"use strict";function y(e,a,n){let s,i,c,p,f;const r=a;function l(){const u=Date.now()-p;u<r&&u>=0?s=setTimeout(l,r-u):(s=null,f=e.apply(c,i),c=i=null)}const o=function(){return c=this,i=arguments,p=Date.now(),s||(s=setTimeout(l,r)),f};return o.clear=function(){s&&(clearTimeout(s),s=null)},o.flush=function(){s&&(f=e.apply(c,i),c=i=null,clearTimeout(s),s=null)},o}const g="app.grapesjs.com",j="app-stage.grapesjs.com",M=[g,j,"localhost","127.0.0.1",".local-credentialless.webcontainer.io",".local.webcontainer.io","-sandpack.codesandbox.io"],R="license:check:start",z="license:check:end",F=()=>typeof window<"u",K=({isDev:e,isStage:a})=>`${e?"":`https://${a?j:g}`}/api`,q=()=>{const e=F()&&window.location.hostname;return!!e&&(M.includes(e)||M.some(a=>e.endsWith(a)))};async function B({path:e,baseApiUrl:a,method:n="GET",headers:s={},params:i,body:c}){const f=`${a||K({isDev:!1,isStage:!1})}${e}`,r={method:n,headers:{"Content-Type":"application/json",...s}};c&&(r.body=JSON.stringify(c));const l=i?new URLSearchParams(i).toString():"",o=l?`?${l}`:"",u=await fetch(`${f}${o}`,r);if(!u.ok)throw new Error(`HTTP error! status: ${u.status}`);return u.json()}var v=(e=>(e.free="free",e.startup="startup",e.business="business",e.enterprise="enterprise",e))(v||{});const U={[v.free]:0,[v.startup]:10,[v.business]:20,[v.enterprise]:30};function G(e){const a=e;return a.init=n=>s=>e(s,n),a}const X=e=>G(e);async function Y({editor:e,plan:a,pluginName:n,licenseKey:s,cleanup:i}){let c="",p=!1;const f=q(),r=o=>{console.warn("Cleanup plugin:",n,"Reason:",o),i()},l=(o={})=>{var S;const{error:u,sdkLicense:b}=o,w=(S=o.plan)==null?void 0:S.category;if(!(b||o.license)||u)r(u||"Invalid license");else if(w){const $=U[a],A=U[w];$>A&&r({pluginRequiredPlan:a,licensePlan:w})}};e.on(R,o=>{c=o==null?void 0:o.baseApiUrl,p=!0}),e.on(z,o=>{l(o)}),setTimeout(async()=>{if(!p){if(f)return;if(s){const o=await Z({licenseKey:s,pluginName:n,baseApiUrl:c});o&&l(o)}else r("The `licenseKey` option not provided")}},2e3)}async function Z(e){const{licenseKey:a,pluginName:n,baseApiUrl:s}=e;try{return(await B({baseApiUrl:s,path:`/sdk/${a||"na"}`,method:"POST",params:{d:window.location.hostname,pn:n}})).result||{}}catch(i){return console.error("Error during SDK license check:",i),!1}}const k="canvasFullSize",J=v.startup,Q=(e,a)=>{const{rule:n,ruleView:s}=a,{style:i}=n.attributes;if(i&&i[e]){const c=i[e],p=/([0-9.]+)(vh|dvh|lvh|svh)/g,f=p.test(c),r=s.frameView.model;if(f&&r.hasAutoHeight()){const l=c.replace(p,(u,b)=>`${window.innerHeight*(parseFloat(b)/100)}px`),o=n.toCSS({style:{...i,[e]:l}});a.css=o}}},ee=e=>{["height","min-height","max-height"].forEach(a=>Q(a,e))};return X(function(e,a={}){const{Canvas:n,Commands:s,Devices:i,Css:c}=e,p={deviceMaxWidth:1200,deviceMinHeigth:500,canvasOffsetY:30,canvasOffsetX:50,canvasTransition:.3,frameBorderRadius:5,frameTransition:.3,...a},{canvasOffsetY:f,canvasOffsetX:r,canvasTransition:l,deviceMaxWidth:o,deviceMinHeigth:u,frameBorderRadius:b,frameTransition:w}=p,C=`${u}px`,S=n.events,$="core:preview",A=`${s.events.stopCommand}${$}`,H=n.getConfig(),I=`${k}:disable`,te=i.getAll().map(t=>({...t.attributes})),ne=l*1e3,N={x:r,y:f};let E={},P,T;H.scrollableCanvas=!0,i.getAll().map(t=>{!t.get("width")&&t.set("width",`${o}px`),!t.get("height")&&t.set("height","auto"),!t.get("minHeight")&&t.set("minHeight",C)});const V=t=>{const d="data-gs-plg-full-size",m=document.querySelector(`style[${d}]`);if(t&&m)return m.remove();const h=m||document.createElement("style"),D=n.getZoomMultiplier();h.setAttribute(d,"true"),h.innerHTML=`
       .gjs-frame-wrapper { transition: width ${w}s !important; }
       .gjs-frame-wrapper__bottom { height: ${f*D}px }
       .gjs-frame { border-radius: ${b}px }
-    `,!m&&document.body.appendChild(h)};e.on(C.frameLoadHead,t=>{if(!H.scrollableCanvas)return;const{window:d}=t,m=d.document,h=m.head,D="data-gs-plg-wrapper-style",L=h.querySelector(`style[${D}]`)||m.createElement("style");L.setAttribute(D,"true"),L.innerHTML=`
-      [data-gjs-type="wrapper"] { min-height: ${S}; }
-      [data-gjs-type="mjml"] { min-height: ${S} !important; }
-      [data-gjs-type="mj-body"] { min-height: ${S} !important; }
-    `,!h.contains(L)&&h.appendChild(L)});const k=()=>j.style.display="none",se=()=>j.style.display="",x=y(()=>{s.fitViewport({zoom:t=>t>100?100:t,ignoreHeight:!0,gap:_}),M(),setTimeout(()=>{var d,m;const{em:t}=e;t.destroyed||((m=(d=e.getSelected())==null?void 0:d.getEl())==null||m.scrollIntoView({block:"nearest"}),e.refresh({tools:!0}),se(),n.isActive($)?t.stopDefault():t.runDefault())},ne)},100),oe=(t={})=>{t.options&&t.options.from!=="fitViewport"&&s.fitViewport({zoom:s.getZoom(),ignoreHeight:!0,gap:_})},ie=()=>{k(),x()},ae=()=>{E.overflowX="hidden",E.overflowY="auto"},W=()=>{T==null||T.disconnect(),x.clear()},O=[[i.events.select,ie],[C.zoom,oe],[A,ae],[e.events.destroy,W],[c.events.mountBefore,ee]];n.add(V,()=>{i.devices.reset(te),H.scrollableCanvas=!1,s.getModel().updateDevice(),s.setZoom(100),s.setCoords(0,0),E.overflowY="hidden",M(!0),O.forEach(([t,d])=>e.off(t,d)),W(),n.run("studio:canvasReload")}),O.forEach(([t,d])=>e.on(t,d)),e.onReady(()=>{const t=s.getElement(),d=s.getFramesEl();j=s.getSpotsEl(),E=t.style,E.overflowX="hidden",d.style.transition=`transform ${l}s`,M(),T=new ResizeObserver(()=>{k(),x()}),T.observe(t.parentElement),x()}),Y({editor:e,licenseKey:p.licenseKey,plan:J,pluginName:N,cleanup:()=>{e.runCommand(V)}})})});
+    `,!m&&document.body.appendChild(h)};e.on(S.frameLoadHead,t=>{if(!H.scrollableCanvas)return;const{window:d}=t,m=d.document,h=m.head,D="data-gs-plg-wrapper-style",L=h.querySelector(`style[${D}]`)||m.createElement("style");L.setAttribute(D,"true"),L.innerHTML=`
+      [data-gjs-type="wrapper"] { min-height: ${C}; }
+      [data-gjs-type="mjml"] { min-height: ${C} !important; }
+      [data-gjs-type="mj-body"] { min-height: ${C} !important; }
+    `,!h.contains(L)&&h.appendChild(L)});const _=()=>P.style.display="none",se=()=>P.style.display="",x=y(()=>{n.fitViewport({zoom:t=>t>100?100:t,ignoreHeight:!0,gap:N}),V(),setTimeout(()=>{var d,m;const{em:t}=e;t.destroyed||((m=(d=e.getSelected())==null?void 0:d.getEl())==null||m.scrollIntoView({block:"nearest"}),e.refresh({tools:!0}),se(),s.isActive($)?t.stopDefault():t.runDefault())},ne)},100),oe=(t={})=>{t.options&&t.options.from!=="fitViewport"&&n.fitViewport({zoom:n.getZoom(),ignoreHeight:!0,gap:N})},ie=()=>{_(),x()},ae=()=>{E.overflowX="hidden",E.overflowY="auto"},W=()=>{T==null||T.disconnect(),x.clear()},O=[[i.events.select,ie],[S.zoom,oe],[A,ae],[e.events.destroy,W],[c.events.mountBefore,ee]];s.add(I,()=>{i.devices.reset(te),H.scrollableCanvas=!1,n.getModel().updateDevice(),n.setZoom(100),n.setCoords(0,0),E.overflowY="hidden",V(!0),O.forEach(([t,d])=>e.off(t,d)),W(),s.run("studio:canvasReload")}),O.forEach(([t,d])=>e.on(t,d)),e.onReady(()=>{const t=n.getElement(),d=n.getFramesEl(),m=n.getCanvasView();P=n.getSpotsEl(),E=t.style,E.overflowX="hidden",d.style.transition=`transform ${l}s`,document.removeEventListener("keypress",m.onKeyPress),V(),T=new ResizeObserver(()=>{_(),x()}),T.observe(t.parentElement),x()}),Y({editor:e,licenseKey:p.licenseKey,plan:J,pluginName:k,cleanup:()=>{e.runCommand(I)}})})});