@grapesjs/studio-sdk-plugins 1.0.9 → 1.0.10-rc.0

package/dist/fsLightboxComponent/index.cjs.js

@@ -1,6 +1,6 @@
-"use strict";const E="app.grapesjs.com",j="app-stage.grapesjs.com",O=[E,j,"localhost","127.0.0.1",".local-credentialless.webcontainer.io",".local.webcontainer.io","-sandpack.codesandbox.io"],B="license:check:start",P="license:check:end",H=()=>typeof window<"u",W=({isDev:o,isStage:i})=>`${o?"":`https://${i?j:E}`}/api`,R=()=>{const o=H()&&window.location.hostname;return!!o&&(O.includes(o)||O.some(i=>o.endsWith(i)))},U=()=>(H()&&window.location.hostname)===E;var F={};const G=F.NODE_ENV!=="production";async function K({path:o,method:i="GET",headers:c={},body:a}){const u=`${W({isDev:G,isStage:!U()})}${o}`,r={method:i,headers:{"Content-Type":"application/json",...c}};a&&(r.body=JSON.stringify(a));const v=await fetch(u,r);if(!v.ok)throw new Error(`HTTP error! status: ${v.status}`);return v.json()}function Z(o){const i=o;return i.init=c=>a=>o(a,c),i}const J=o=>Z(o);async function q({editor:o,pluginName:i,licenseKey:c,cleanup:a}){let p=!1;const u=R();o.on(B,()=>{p=!0}),o.on(P,({sdkLicense:r})=>{r||a()}),setTimeout(async()=>{if(!p){if(u)return;c&&await z({licenseKey:c,pluginName:i})||a()}},2e3)}async function z({licenseKey:o,pluginName:i}){try{const c=await K({path:`/sdk/${o}`,method:"POST",body:JSON.stringify({d:window.location.hostname,pn:i})}),{license:a}=c.result||{};return!!a}catch(c){return console.error("Error during SDK license check:",c),!1}}const X="gjs-plg-",Y="fsLightboxComponent",S="data-fslightbox",L="data-type",Q="fslightbox-open",b="fslightbox",f={image:'<svg viewBox="0 0 24 24"><path d="m8.5 13.5 2.5 3 3.5-4.5 4.5 6H5m16 1V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2Z"/></svg>',video:'<svg viewBox="0 0 24 24"><path d="M17 10.5V7a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-3.5l4 4v-11l-4 4Z"/></svg>',imageLightbox:'<svg viewBox="0 0 24 24"><path d="M4,2H20A2,2 0 0,1 22,4V16A2,2 0 0,1 20,18H16L12,22L8,18H4A2,2 0 0,1 2,16V4A2,2 0 0,1 4,2M19,15V7L15,11L13,9L7,15H19M7,5A2,2 0 0,0 5,7A2,2 0 0,0 7,9A2,2 0 0,0 9,7A2,2 0 0,0 7,5Z" /></svg>',external:'<svg viewBox="0 0 24 24"><path d="M14 3v2h3.6l-9.8 9.8 1.4 1.4L19 6.4V10h2V3m-2 16H5V5h7V3H5a2 2 0 0 0-2 2v14c0 1.1.9 2 2 2h14a2 2 0 0 0 2-2v-7h-2v7z"/></svg>',eye:'<svg viewBox="0 0 24 24"><path d="M12 9a3 3 0 0 0-3 3 3 3 0 0 0 3 3 3 3 0 0 0 3-3 3 3 0 0 0-3-3m0 8a5 5 0 0 1-5-5 5 5 0 0 1 5-5 5 5 0 0 1 5 5 5 5 0 0 1-5 5m0-12.5C7 4.5 2.7 7.6 1 12a11.8 11.8 0 0 0 22 0c-1.7-4.4-6-7.5-11-7.5Z"/></svg>'},tt=function(o,i={}){const{Blocks:c,Components:a}=o,p="Lightbox",u=`${X}${b}`,r={toolbarIconOpen:f.eye,block:{},defaultSrc:"https://placehold.co/300/777/white.png?text=Image",cdnScript:"https://cdn.jsdelivr.net/npm/fslightbox@3.4.2/index.js",...i},{block:v,toolbarIconOpen:_,defaultSrc:A}=r,$=function(e){const t=this,n="data-fslightbox",s=window,h=()=>{var w;const d=s.refreshFsLightbox;d==null||d();const x=t.getAttribute(n);if((w=s.fsLightboxInstances)==null||w[x],!s._isEditor)return;Array.from(document.querySelectorAll(`[${n}]`)).forEach(g=>{const m=g.onclick;g.onclick=function(T){T.preventDefault();const N=g;!N.__skipLb&&(m==null||m(T)),N.__skipLb=!0}})};if(s.refreshFsLightbox)h();else{const d=document.createElement("script");d.src=e.cdnScript,d.onload=h,document.head.appendChild(d)}},D=e=>({id:`${b}-open-lb`,label:_,command:()=>{const t=e.getView();t==null||t.toggleLightbox()}}),l="source-type",k={type:"radio",name:l,label:"Source type",changeProp:!0,options:[{id:"image",label:"Image",icon:f.image},{id:"video",label:"Video",icon:f.video},{id:"el",label:"Custom Element",icon:f.external}],labelToTitle:!0},C={id:"href-image",name:"href",type:"file",label:"Source Image"},I={id:"href-video",name:"href",label:"Source Video",placeholder:"https://www.youtube.com/watch?v=..."},V={id:"href-el",name:"href",label:"Source Element",placeholder:"#custom-element-id"},M={image:[C],video:[I],el:[V]};a.addType(b,{block:v&&{label:p,media:f.imageLightbox,category:"Extra",select:!0,...r.block},isComponent:e=>{var t;return(t=e.hasAttribute)==null?void 0:t.call(e,S)},extendFn:["initToolbar"],model:{defaults:{tagName:"a",name:p,icon:f.imageLightbox,classes:u,draggable:(e,t)=>!t.is(b),attributes:{[S]:"lightbox",[L]:"image",href:A},components:{type:"image",src:A},script:$,cdnScript:r.cdnScript,"script-props":["attributes","cdnScript"],[l]:"image",traits:[k,{name:S,label:"Group name"},{type:"button",label:"Toggle Lightbox",command(e,t){var s;const n=(s=t.target)==null?void 0:s.getView();n==null||n.toggleLightbox()}}],styles:`
-          .${u} {
+"use strict";const P="app.grapesjs.com",B="app-stage.grapesjs.com",N=[P,B,"localhost","127.0.0.1",".local-credentialless.webcontainer.io",".local.webcontainer.io","-sandpack.codesandbox.io"],D="license:check:start",U="license:check:end",R=()=>typeof window<"u",W=({isDev:t,isStage:a})=>`${t?"":`https://${a?B:P}`}/api`,F=()=>{const t=R()&&window.location.hostname;return!!t&&(N.includes(t)||N.some(a=>t.endsWith(a)))};var x=(t=>(t.free="free",t.startup="startup",t.business="business",t.enterprise="enterprise",t))(x||{});async function K({path:t,baseApiUrl:a,method:r="GET",headers:c={},params:p,body:h}){const w=`${a||W({isDev:!1,isStage:!1})}${t}`,d={method:r,headers:{"Content-Type":"application/json",...c}};h&&(d.body=JSON.stringify(h));const m=p?new URLSearchParams(p).toString():"",n=m?`?${m}`:"",b=await fetch(`${w}${n}`,d);if(!b.ok)throw new Error(`HTTP error! status: ${b.status}`);return b.json()}const O={[x.free]:0,[x.startup]:10,[x.business]:20,[x.enterprise]:30};function G(t){const a=t;return a.init=r=>c=>t(c,r),a}const Z=t=>G(t);async function q({editor:t,plan:a,pluginName:r,licenseKey:c,cleanup:p}){let h="",g=!1;const w=F(),d=n=>{console.warn("Cleanup plugin:",r,"Reason:",n),p()},m=(n={})=>{var A;const{error:b,sdkLicense:l}=n,v=(A=n.plan)==null?void 0:A.category;if(!(l||n.license)||b)d(b||"Invalid license");else if(v){const E=O[a],$=O[v];E>$&&d({pluginRequiredPlan:a,licensePlan:v})}};t.on(D,n=>{h=n==null?void 0:n.baseApiUrl,g=!0}),t.on(U,n=>{m(n)}),setTimeout(async()=>{if(!g){if(w)return;if(c){const n=await z({licenseKey:c,pluginName:r,baseApiUrl:h});n&&m(n)}else d("The `licenseKey` option not provided")}},2e3)}async function z(t){const{licenseKey:a,pluginName:r,baseApiUrl:c}=t;try{return(await K({baseApiUrl:c,path:`/sdk/${a||"na"}`,method:"POST",params:{d:window.location.hostname,pn:r}})).result||{}}catch(p){return console.error("Error during SDK license check:",p),!1}}const J="gjs-plg-",X="fsLightboxComponent",k="data-fslightbox",C="data-type",Y="fslightbox-open",T="fslightbox",S={image:'<svg viewBox="0 0 24 24"><path d="m8.5 13.5 2.5 3 3.5-4.5 4.5 6H5m16 1V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2Z"/></svg>',video:'<svg viewBox="0 0 24 24"><path d="M17 10.5V7a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-3.5l4 4v-11l-4 4Z"/></svg>',imageLightbox:'<svg viewBox="0 0 24 24"><path d="M4,2H20A2,2 0 0,1 22,4V16A2,2 0 0,1 20,18H16L12,22L8,18H4A2,2 0 0,1 2,16V4A2,2 0 0,1 4,2M19,15V7L15,11L13,9L7,15H19M7,5A2,2 0 0,0 5,7A2,2 0 0,0 7,9A2,2 0 0,0 9,7A2,2 0 0,0 7,5Z" /></svg>',external:'<svg viewBox="0 0 24 24"><path d="M14 3v2h3.6l-9.8 9.8 1.4 1.4L19 6.4V10h2V3m-2 16H5V5h7V3H5a2 2 0 0 0-2 2v14c0 1.1.9 2 2 2h14a2 2 0 0 0 2-2v-7h-2v7z"/></svg>',eye:'<svg viewBox="0 0 24 24"><path d="M12 9a3 3 0 0 0-3 3 3 3 0 0 0 3 3 3 3 0 0 0 3-3 3 3 0 0 0-3-3m0 8a5 5 0 0 1-5-5 5 5 0 0 1 5-5 5 5 0 0 1 5 5 5 5 0 0 1-5 5m0-12.5C7 4.5 2.7 7.6 1 12a11.8 11.8 0 0 0 22 0c-1.7-4.4-6-7.5-11-7.5Z"/></svg>'},Q=function(t,a={}){const{Blocks:r,Components:c}=t,p="Lightbox",h=`${J}${T}`,g={toolbarIconOpen:S.eye,block:{},defaultSrc:"https://placehold.co/300/777/white.png?text=Image",cdnScript:"https://cdn.jsdelivr.net/npm/fslightbox@3.4.2/index.js",...a},{block:w,toolbarIconOpen:d,defaultSrc:m}=g,n=function(s){const e=this,i="data-fslightbox",o=window,f=()=>{var H;const u=o.refreshFsLightbox;u==null||u();const j=e.getAttribute(i);if((H=o.fsLightboxInstances)==null||H[j],!o._isEditor)return;Array.from(document.querySelectorAll(`[${i}]`)).forEach(y=>{const L=y.onclick;y.onclick=function(I){I.preventDefault();const M=y;!M.__skipLb&&(L==null||L(I)),M.__skipLb=!0}})};if(o.refreshFsLightbox)f();else{const u=document.createElement("script");u.src=s.cdnScript,u.onload=f,document.head.appendChild(u)}},b=s=>({id:`${T}-open-lb`,label:d,command:()=>{const e=s.getView();e==null||e.toggleLightbox()}}),l="source-type",v={type:"radio",name:l,label:"Source type",changeProp:!0,options:[{id:"image",label:"Image",icon:S.image},{id:"video",label:"Video",icon:S.video},{id:"el",label:"Custom Element",icon:S.external}],labelToTitle:!0},V={id:"href-image",name:"href",type:"file",label:"Source Image"},A={id:"href-video",name:"href",label:"Source Video",placeholder:"https://www.youtube.com/watch?v=..."},E={id:"href-el",name:"href",label:"Source Element",placeholder:"#custom-element-id"},$={image:[V],video:[A],el:[E]};c.addType(T,{block:w&&{label:p,media:S.imageLightbox,category:"Extra",select:!0,...g.block},isComponent:s=>{var e;return(e=s.hasAttribute)==null?void 0:e.call(s,k)},extendFn:["initToolbar"],model:{defaults:{tagName:"a",name:p,icon:S.imageLightbox,classes:h,draggable:(s,e)=>!e.is(T),attributes:{[k]:"lightbox",[C]:"image",href:m},components:{type:"image",src:m},script:n,cdnScript:g.cdnScript,"script-props":["attributes","cdnScript"],[l]:"image",traits:[v,{name:k,label:"Group name"},{type:"button",label:"Toggle Lightbox",command(s,e){var o;const i=(o=e.target)==null?void 0:o.getView();i==null||i.toggleLightbox()}}],styles:`
+          .${h} {
             display: inline-block;
             padding: 10px;
           }
-        `},init(){const e=[l].map(t=>`change:${t}`).join(" ");this.on(e,this.updateTraits),this.on(`change:${l}`,this.onSourceTypeChange),this.on("change:attributes:href",this.adjustSourceType),this.updateTraits({init:!0}),this.adjustSourceType()},onSourceTypeChange(e,t,n){if(n.adjust)return;const h=this.get(l)==="video"?"video":"image";this.addAttributes({[L]:h,href:""})},adjustSourceType(){const e=this.get(l),t=this.getAttributes().href||"",n={adjust:!0};if(e==="video"){const s=t.includes("youtube.com")?"youtube":"video";this.addAttributes({[L]:s},n)}else e!=="el"&&t.startsWith("#")?this.set(l,"el",n):e==="image"&&this.addAttributes({[L]:"image"},n)},updateTraits(e={}){const{changed:t}=this,{init:n}=e;if(t[k.name]||n){this.removeTrait([C.name,I.name,V.name]);const s=this.get(l)||"image",h=this.getTraitIndex(l)+1;this.addTrait(M[s],{at:h})}},initToolbar(){if(!_)return;const{toolbar:e}=this,t=D(this);!e.find(s=>s.id===t.id)&&(e==null||e.unshift(t))}},view:{onRender(){this.el.__skipLb=!0},toggleLightbox(){var g;const{em:e,el:t,model:n}=this,{Canvas:s}=e,h=n.getAttributes()[S],{defaultView:d,documentElement:x}=t.ownerDocument,y=(g=d.fsLightboxInstances)==null?void 0:g[h];if(x.classList.contains(Q))y.close();else{t.__skipLb=!1;let m;y.props.onOpen=()=>{m=s.getSpots(),setTimeout(()=>s.removeSpots())},y.props.onClose=()=>{m.forEach(T=>s.addSpot(T.attributes))},t.click()}}}}),q({editor:o,licenseKey:r.licenseKey,pluginName:Y,cleanup:()=>{c.remove(b),a.removeType(b)}})},et=J(tt);module.exports=et;
+        `},init(){const s=[l].map(e=>`change:${e}`).join(" ");this.on(s,this.updateTraits),this.on(`change:${l}`,this.onSourceTypeChange),this.on("change:attributes:href",this.adjustSourceType),this.updateTraits({init:!0}),this.adjustSourceType()},onSourceTypeChange(s,e,i){if(i.adjust)return;const f=this.get(l)==="video"?"video":"image";this.addAttributes({[C]:f,href:""})},adjustSourceType(){const s=this.get(l),e=this.getAttributes().href||"",i={adjust:!0};if(s==="video"){const o=e.includes("youtube.com")?"youtube":"video";this.addAttributes({[C]:o},i)}else s!=="el"&&e.startsWith("#")?this.set(l,"el",i):s==="image"&&this.addAttributes({[C]:"image"},i)},updateTraits(s={}){const{changed:e}=this,{init:i}=s;if(e[v.name]||i){this.removeTrait([V.name,A.name,E.name]);const o=this.get(l)||"image",f=this.getTraitIndex(l)+1;this.addTrait($[o],{at:f})}},initToolbar(){if(!d)return;const{toolbar:s}=this,e=b(this);!s.find(o=>o.id===e.id)&&(s==null||s.unshift(e))}},view:{onRender(){this.el.__skipLb=!0},toggleLightbox(){var y;const{em:s,el:e,model:i}=this,{Canvas:o}=s,f=i.getAttributes()[k],{defaultView:u,documentElement:j}=e.ownerDocument,_=(y=u.fsLightboxInstances)==null?void 0:y[f];if(j.classList.contains(Y))_.close();else{e.__skipLb=!1;let L;_.props.onOpen=()=>{L=o.getSpots(),setTimeout(()=>o.removeSpots())},_.props.onClose=()=>{L.forEach(I=>o.addSpot(I.attributes))},e.click()}}}}),q({editor:t,plan:x.free,licenseKey:g.licenseKey,pluginName:X,cleanup:()=>{r.remove(T),c.removeType(T)}})},ee=Z(Q);module.exports=ee;

package/dist/fsLightboxComponent/index.es.js

@@ -1,6 +1,6 @@
-const E = "app.grapesjs.com", j = "app-stage.grapesjs.com", O = [
-  E,
-  j,
+const P = "app.grapesjs.com", B = "app-stage.grapesjs.com", N = [
+  P,
+  B,
   "localhost",
   "127.0.0.1",
   ".local-credentialless.webcontainer.io",
@@ -9,225 +9,249 @@ const E = "app.grapesjs.com", j = "app-stage.grapesjs.com", O = [
   // For stackblitz.com demos
   "-sandpack.codesandbox.io"
   // For Sandpack demos
-], B = "license:check:start", P = "license:check:end", H = () => typeof window < "u", W = ({ isDev: o, isStage: i }) => `${o ? "" : `https://${i ? j : E}`}/api`, R = () => {
-  const o = H() && window.location.hostname;
-  return !!o && (O.includes(o) || O.some((i) => o.endsWith(i)));
-}, U = () => (H() && window.location.hostname) === E;
-var F = {};
-const G = F.NODE_ENV !== "production";
+], D = "license:check:start", U = "license:check:end", R = () => typeof window < "u", W = ({ isDev: t, isStage: a }) => `${t ? "" : `https://${a ? B : P}`}/api`, F = () => {
+  const t = R() && window.location.hostname;
+  return !!t && (N.includes(t) || N.some((a) => t.endsWith(a)));
+};
+var x = /* @__PURE__ */ ((t) => (t.free = "free", t.startup = "startup", t.business = "business", t.enterprise = "enterprise", t))(x || {});
 async function K({
-  path: o,
-  method: i = "GET",
+  path: t,
+  baseApiUrl: a,
+  method: r = "GET",
   headers: c = {},
-  body: a
+  params: p,
+  body: h
 }) {
-  const u = `${W({ isDev: G, isStage: !U() })}${o}`, r = {
-    method: i,
+  const w = `${a || W({ isDev: !1, isStage: !1 })}${t}`, d = {
+    method: r,
     headers: {
       "Content-Type": "application/json",
       ...c
     }
   };
-  a && (r.body = JSON.stringify(a));
-  const v = await fetch(u, r);
-  if (!v.ok)
-    throw new Error(`HTTP error! status: ${v.status}`);
-  return v.json();
+  h && (d.body = JSON.stringify(h));
+  const m = p ? new URLSearchParams(p).toString() : "", n = m ? `?${m}` : "", b = await fetch(`${w}${n}`, d);
+  if (!b.ok)
+    throw new Error(`HTTP error! status: ${b.status}`);
+  return b.json();
 }
-function Z(o) {
-  const i = o;
-  return i.init = (c) => (a) => o(a, c), i;
+const O = {
+  [x.free]: 0,
+  [x.startup]: 10,
+  [x.business]: 20,
+  [x.enterprise]: 30
+};
+function G(t) {
+  const a = t;
+  return a.init = (r) => (c) => t(c, r), a;
 }
-const J = (o) => /* @__PURE__ */ Z(o);
+const Z = (t) => /* @__PURE__ */ G(t);
 async function q({
-  editor: o,
-  pluginName: i,
+  editor: t,
+  plan: a,
+  pluginName: r,
   licenseKey: c,
-  cleanup: a
+  cleanup: p
 }) {
-  let p = !1;
-  const u = R();
-  o.on(B, () => {
-    p = !0;
-  }), o.on(P, ({ sdkLicense: r }) => {
-    r || a();
+  let h = "", g = !1;
+  const w = F(), d = (n) => {
+    console.warn("Cleanup plugin:", r, "Reason:", n), p();
+  }, m = (n = {}) => {
+    var A;
+    const { error: b, sdkLicense: l } = n, v = (A = n.plan) == null ? void 0 : A.category;
+    if (!(l || n.license) || b)
+      d(b || "Invalid license");
+    else if (v) {
+      const E = O[a], $ = O[v];
+      E > $ && d({ pluginRequiredPlan: a, licensePlan: v });
+    }
+  };
+  t.on(D, (n) => {
+    h = n == null ? void 0 : n.baseApiUrl, g = !0;
+  }), t.on(U, (n) => {
+    m(n);
   }), setTimeout(async () => {
-    if (!p) {
-      if (u) return;
-      c && await z({ licenseKey: c, pluginName: i }) || a();
+    if (!g) {
+      if (w) return;
+      if (c) {
+        const n = await z({ licenseKey: c, pluginName: r, baseApiUrl: h });
+        n && m(n);
+      } else
+        d("The `licenseKey` option not provided");
     }
   }, 2e3);
 }
-async function z({ licenseKey: o, pluginName: i }) {
+async function z(t) {
+  const { licenseKey: a, pluginName: r, baseApiUrl: c } = t;
   try {
-    const c = await K({
-      path: `/sdk/${o}`,
+    return (await K({
+      baseApiUrl: c,
+      path: `/sdk/${a || "na"}`,
       method: "POST",
-      body: JSON.stringify({
+      params: {
         d: window.location.hostname,
-        pn: i
-      })
-    }), { license: a } = c.result || {};
-    return !!a;
-  } catch (c) {
-    return console.error("Error during SDK license check:", c), !1;
+        pn: r
+      }
+    })).result || {};
+  } catch (p) {
+    return console.error("Error during SDK license check:", p), !1;
   }
 }
-const X = "gjs-plg-", Y = "fsLightboxComponent", S = "data-fslightbox", L = "data-type", Q = "fslightbox-open", b = "fslightbox", f = {
+const J = "gjs-plg-", X = "fsLightboxComponent", k = "data-fslightbox", C = "data-type", Y = "fslightbox-open", T = "fslightbox", S = {
   image: '<svg viewBox="0 0 24 24"><path d="m8.5 13.5 2.5 3 3.5-4.5 4.5 6H5m16 1V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2Z"/></svg>',
   video: '<svg viewBox="0 0 24 24"><path d="M17 10.5V7a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-3.5l4 4v-11l-4 4Z"/></svg>',
   imageLightbox: '<svg viewBox="0 0 24 24"><path d="M4,2H20A2,2 0 0,1 22,4V16A2,2 0 0,1 20,18H16L12,22L8,18H4A2,2 0 0,1 2,16V4A2,2 0 0,1 4,2M19,15V7L15,11L13,9L7,15H19M7,5A2,2 0 0,0 5,7A2,2 0 0,0 7,9A2,2 0 0,0 9,7A2,2 0 0,0 7,5Z" /></svg>',
   external: '<svg viewBox="0 0 24 24"><path d="M14 3v2h3.6l-9.8 9.8 1.4 1.4L19 6.4V10h2V3m-2 16H5V5h7V3H5a2 2 0 0 0-2 2v14c0 1.1.9 2 2 2h14a2 2 0 0 0 2-2v-7h-2v7z"/></svg>',
   eye: '<svg viewBox="0 0 24 24"><path d="M12 9a3 3 0 0 0-3 3 3 3 0 0 0 3 3 3 3 0 0 0 3-3 3 3 0 0 0-3-3m0 8a5 5 0 0 1-5-5 5 5 0 0 1 5-5 5 5 0 0 1 5 5 5 5 0 0 1-5 5m0-12.5C7 4.5 2.7 7.6 1 12a11.8 11.8 0 0 0 22 0c-1.7-4.4-6-7.5-11-7.5Z"/></svg>'
-}, tt = function(o, i = {}) {
-  const { Blocks: c, Components: a } = o, p = "Lightbox", u = `${X}${b}`, r = {
-    toolbarIconOpen: f.eye,
+}, Q = function(t, a = {}) {
+  const { Blocks: r, Components: c } = t, p = "Lightbox", h = `${J}${T}`, g = {
+    toolbarIconOpen: S.eye,
     block: {},
     defaultSrc: "https://placehold.co/300/777/white.png?text=Image",
     cdnScript: "https://cdn.jsdelivr.net/npm/fslightbox@3.4.2/index.js",
-    ...i
-  }, { block: v, toolbarIconOpen: _, defaultSrc: A } = r, $ = function(e) {
-    const t = this, n = "data-fslightbox", s = window, h = () => {
-      var w;
-      const d = s.refreshFsLightbox;
-      d == null || d();
-      const x = t.getAttribute(n);
-      if ((w = s.fsLightboxInstances) == null || w[x], !s._isEditor) return;
-      Array.from(document.querySelectorAll(`[${n}]`)).forEach((g) => {
-        const m = g.onclick;
-        g.onclick = function(T) {
-          T.preventDefault();
-          const N = g;
-          !N.__skipLb && (m == null || m(T)), N.__skipLb = !0;
+    ...a
+  }, { block: w, toolbarIconOpen: d, defaultSrc: m } = g, n = function(s) {
+    const e = this, i = "data-fslightbox", o = window, f = () => {
+      var H;
+      const u = o.refreshFsLightbox;
+      u == null || u();
+      const j = e.getAttribute(i);
+      if ((H = o.fsLightboxInstances) == null || H[j], !o._isEditor) return;
+      Array.from(document.querySelectorAll(`[${i}]`)).forEach((y) => {
+        const L = y.onclick;
+        y.onclick = function(I) {
+          I.preventDefault();
+          const M = y;
+          !M.__skipLb && (L == null || L(I)), M.__skipLb = !0;
         };
       });
     };
-    if (s.refreshFsLightbox)
-      h();
+    if (o.refreshFsLightbox)
+      f();
     else {
-      const d = document.createElement("script");
-      d.src = e.cdnScript, d.onload = h, document.head.appendChild(d);
+      const u = document.createElement("script");
+      u.src = s.cdnScript, u.onload = f, document.head.appendChild(u);
     }
-  }, D = (e) => ({
-    id: `${b}-open-lb`,
-    label: _,
+  }, b = (s) => ({
+    id: `${T}-open-lb`,
+    label: d,
     command: () => {
-      const t = e.getView();
-      t == null || t.toggleLightbox();
+      const e = s.getView();
+      e == null || e.toggleLightbox();
     }
-  }), l = "source-type", k = {
+  }), l = "source-type", v = {
     type: "radio",
     name: l,
     label: "Source type",
     changeProp: !0,
     options: [
-      { id: "image", label: "Image", icon: f.image },
-      { id: "video", label: "Video", icon: f.video },
-      { id: "el", label: "Custom Element", icon: f.external }
+      { id: "image", label: "Image", icon: S.image },
+      { id: "video", label: "Video", icon: S.video },
+      { id: "el", label: "Custom Element", icon: S.external }
     ],
     // @ts-expect-error Studio related prop
     labelToTitle: !0
-  }, C = {
+  }, V = {
     id: "href-image",
     name: "href",
     type: "file",
     label: "Source Image"
-  }, I = {
+  }, A = {
     id: "href-video",
     name: "href",
     label: "Source Video",
     placeholder: "https://www.youtube.com/watch?v=..."
-  }, V = {
+  }, E = {
     id: "href-el",
     name: "href",
     label: "Source Element",
     placeholder: "#custom-element-id"
-  }, M = {
-    image: [C],
-    video: [I],
-    el: [V]
+  }, $ = {
+    image: [V],
+    video: [A],
+    el: [E]
   };
-  a.addType(b, {
-    block: v && {
+  c.addType(T, {
+    block: w && {
       label: p,
-      media: f.imageLightbox,
+      media: S.imageLightbox,
       category: "Extra",
       select: !0,
-      ...r.block
+      ...g.block
     },
-    isComponent: (e) => {
-      var t;
-      return (t = e.hasAttribute) == null ? void 0 : t.call(e, S);
+    isComponent: (s) => {
+      var e;
+      return (e = s.hasAttribute) == null ? void 0 : e.call(s, k);
     },
     extendFn: ["initToolbar"],
     model: {
       defaults: {
         tagName: "a",
         name: p,
-        icon: f.imageLightbox,
-        classes: u,
-        draggable: (e, t) => !t.is(b),
+        icon: S.imageLightbox,
+        classes: h,
+        draggable: (s, e) => !e.is(T),
         attributes: {
-          [S]: "lightbox",
-          [L]: "image",
-          href: A
+          [k]: "lightbox",
+          [C]: "image",
+          href: m
         },
-        components: { type: "image", src: A },
-        script: $,
-        cdnScript: r.cdnScript,
+        components: { type: "image", src: m },
+        script: n,
+        cdnScript: g.cdnScript,
         "script-props": ["attributes", "cdnScript"],
         [l]: "image",
         traits: [
-          k,
+          v,
           {
-            name: S,
+            name: k,
             label: "Group name"
           },
           {
             type: "button",
             label: "Toggle Lightbox",
-            command(e, t) {
-              var s;
-              const n = (s = t.target) == null ? void 0 : s.getView();
-              n == null || n.toggleLightbox();
+            command(s, e) {
+              var o;
+              const i = (o = e.target) == null ? void 0 : o.getView();
+              i == null || i.toggleLightbox();
             }
           }
         ],
         styles: `
-          .${u} {
+          .${h} {
             display: inline-block;
             padding: 10px;
           }
         `
       },
       init() {
-        const e = [l].map((t) => `change:${t}`).join(" ");
-        this.on(e, this.updateTraits), this.on(`change:${l}`, this.onSourceTypeChange), this.on("change:attributes:href", this.adjustSourceType), this.updateTraits({ init: !0 }), this.adjustSourceType();
+        const s = [l].map((e) => `change:${e}`).join(" ");
+        this.on(s, this.updateTraits), this.on(`change:${l}`, this.onSourceTypeChange), this.on("change:attributes:href", this.adjustSourceType), this.updateTraits({ init: !0 }), this.adjustSourceType();
       },
-      onSourceTypeChange(e, t, n) {
-        if (n.adjust) return;
-        const h = this.get(l) === "video" ? "video" : "image";
-        this.addAttributes({ [L]: h, href: "" });
+      onSourceTypeChange(s, e, i) {
+        if (i.adjust) return;
+        const f = this.get(l) === "video" ? "video" : "image";
+        this.addAttributes({ [C]: f, href: "" });
       },
       adjustSourceType() {
-        const e = this.get(l), t = this.getAttributes().href || "", n = { adjust: !0 };
-        if (e === "video") {
-          const s = t.includes("youtube.com") ? "youtube" : "video";
-          this.addAttributes({ [L]: s }, n);
-        } else e !== "el" && t.startsWith("#") ? this.set(l, "el", n) : e === "image" && this.addAttributes({ [L]: "image" }, n);
+        const s = this.get(l), e = this.getAttributes().href || "", i = { adjust: !0 };
+        if (s === "video") {
+          const o = e.includes("youtube.com") ? "youtube" : "video";
+          this.addAttributes({ [C]: o }, i);
+        } else s !== "el" && e.startsWith("#") ? this.set(l, "el", i) : s === "image" && this.addAttributes({ [C]: "image" }, i);
       },
-      updateTraits(e = {}) {
-        const { changed: t } = this, { init: n } = e;
-        if (t[k.name] || n) {
-          this.removeTrait([C.name, I.name, V.name]);
-          const s = this.get(l) || "image", h = this.getTraitIndex(l) + 1;
-          this.addTrait(M[s], { at: h });
+      updateTraits(s = {}) {
+        const { changed: e } = this, { init: i } = s;
+        if (e[v.name] || i) {
+          this.removeTrait([V.name, A.name, E.name]);
+          const o = this.get(l) || "image", f = this.getTraitIndex(l) + 1;
+          this.addTrait($[o], { at: f });
         }
       },
       initToolbar() {
-        if (!_) return;
-        const { toolbar: e } = this, t = D(this);
-        !e.find((s) => s.id === t.id) && (e == null || e.unshift(t));
+        if (!d) return;
+        const { toolbar: s } = this, e = b(this);
+        !s.find((o) => o.id === e.id) && (s == null || s.unshift(e));
       }
     },
     view: {
@@ -235,30 +259,31 @@ const X = "gjs-plg-", Y = "fsLightboxComponent", S = "data-fslightbox", L = "dat
         this.el.__skipLb = !0;
       },
       toggleLightbox() {
-        var g;
-        const { em: e, el: t, model: n } = this, { Canvas: s } = e, h = n.getAttributes()[S], { defaultView: d, documentElement: x } = t.ownerDocument, y = (g = d.fsLightboxInstances) == null ? void 0 : g[h];
-        if (x.classList.contains(Q))
-          y.close();
+        var y;
+        const { em: s, el: e, model: i } = this, { Canvas: o } = s, f = i.getAttributes()[k], { defaultView: u, documentElement: j } = e.ownerDocument, _ = (y = u.fsLightboxInstances) == null ? void 0 : y[f];
+        if (j.classList.contains(Y))
+          _.close();
         else {
-          t.__skipLb = !1;
-          let m;
-          y.props.onOpen = () => {
-            m = s.getSpots(), setTimeout(() => s.removeSpots());
-          }, y.props.onClose = () => {
-            m.forEach((T) => s.addSpot(T.attributes));
-          }, t.click();
+          e.__skipLb = !1;
+          let L;
+          _.props.onOpen = () => {
+            L = o.getSpots(), setTimeout(() => o.removeSpots());
+          }, _.props.onClose = () => {
+            L.forEach((I) => o.addSpot(I.attributes));
+          }, e.click();
         }
       }
     }
   }), q({
-    editor: o,
-    licenseKey: r.licenseKey,
-    pluginName: Y,
+    editor: t,
+    plan: x.free,
+    licenseKey: g.licenseKey,
+    pluginName: X,
     cleanup: () => {
-      c.remove(b), a.removeType(b);
+      r.remove(T), c.removeType(T);
     }
   });
-}, et = J(tt);
+}, ee = Z(Q);
 export {
-  et as default
+  ee as default
 };

package/dist/fsLightboxComponent/index.umd.js

@@ -1,6 +1,6 @@
-(function(h,u){typeof exports=="object"&&typeof module<"u"?module.exports=u():typeof define=="function"&&define.amd?define(u):(h=typeof globalThis<"u"?globalThis:h||self,h.StudioSdkPlugins_fsLightboxComponent=u())})(this,function(){"use strict";const h="app.grapesjs.com",u="app-stage.grapesjs.com",k=[h,u,"localhost","127.0.0.1",".local-credentialless.webcontainer.io",".local.webcontainer.io","-sandpack.codesandbox.io"],$="license:check:start",D="license:check:end",A=()=>typeof window<"u",M=({isDev:o,isStage:i})=>`${o?"":`https://${i?u:h}`}/api`,B=()=>{const o=A()&&window.location.hostname;return!!o&&(k.includes(o)||k.some(i=>o.endsWith(i)))},P=()=>(A()&&window.location.hostname)===h;var W={};const R=W.NODE_ENV!=="production";async function U({path:o,method:i="GET",headers:c={},body:a}){const f=`${M({isDev:R,isStage:!P()})}${o}`,r={method:i,headers:{"Content-Type":"application/json",...c}};a&&(r.body=JSON.stringify(a));const v=await fetch(f,r);if(!v.ok)throw new Error(`HTTP error! status: ${v.status}`);return v.json()}function F(o){const i=o;return i.init=c=>a=>o(a,c),i}const G=o=>F(o);async function K({editor:o,pluginName:i,licenseKey:c,cleanup:a}){let b=!1;const f=B();o.on($,()=>{b=!0}),o.on(D,({sdkLicense:r})=>{r||a()}),setTimeout(async()=>{if(!b){if(f)return;c&&await Z({licenseKey:c,pluginName:i})||a()}},2e3)}async function Z({licenseKey:o,pluginName:i}){try{const c=await U({path:`/sdk/${o}`,method:"POST",body:JSON.stringify({d:window.location.hostname,pn:i})}),{license:a}=c.result||{};return!!a}catch(c){return console.error("Error during SDK license check:",c),!1}}const J="gjs-plg-",q="fsLightboxComponent",S="data-fslightbox",L="data-type",z="fslightbox-open",g="fslightbox",m={image:'<svg viewBox="0 0 24 24"><path d="m8.5 13.5 2.5 3 3.5-4.5 4.5 6H5m16 1V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2Z"/></svg>',video:'<svg viewBox="0 0 24 24"><path d="M17 10.5V7a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-3.5l4 4v-11l-4 4Z"/></svg>',imageLightbox:'<svg viewBox="0 0 24 24"><path d="M4,2H20A2,2 0 0,1 22,4V16A2,2 0 0,1 20,18H16L12,22L8,18H4A2,2 0 0,1 2,16V4A2,2 0 0,1 4,2M19,15V7L15,11L13,9L7,15H19M7,5A2,2 0 0,0 5,7A2,2 0 0,0 7,9A2,2 0 0,0 9,7A2,2 0 0,0 7,5Z" /></svg>',external:'<svg viewBox="0 0 24 24"><path d="M14 3v2h3.6l-9.8 9.8 1.4 1.4L19 6.4V10h2V3m-2 16H5V5h7V3H5a2 2 0 0 0-2 2v14c0 1.1.9 2 2 2h14a2 2 0 0 0 2-2v-7h-2v7z"/></svg>',eye:'<svg viewBox="0 0 24 24"><path d="M12 9a3 3 0 0 0-3 3 3 3 0 0 0 3 3 3 3 0 0 0 3-3 3 3 0 0 0-3-3m0 8a5 5 0 0 1-5-5 5 5 0 0 1 5-5 5 5 0 0 1 5 5 5 5 0 0 1-5 5m0-12.5C7 4.5 2.7 7.6 1 12a11.8 11.8 0 0 0 22 0c-1.7-4.4-6-7.5-11-7.5Z"/></svg>'};return G(function(o,i={}){const{Blocks:c,Components:a}=o,b="Lightbox",f=`${J}${g}`,r={toolbarIconOpen:m.eye,block:{},defaultSrc:"https://placehold.co/300/777/white.png?text=Image",cdnScript:"https://cdn.jsdelivr.net/npm/fslightbox@3.4.2/index.js",...i},{block:v,toolbarIconOpen:C,defaultSrc:I}=r,X=function(e){const t=this,s="data-fslightbox",n=window,p=()=>{var E;const d=n.refreshFsLightbox;d==null||d();const _=t.getAttribute(s);if((E=n.fsLightboxInstances)==null||E[_],!n._isEditor)return;Array.from(document.querySelectorAll(`[${s}]`)).forEach(y=>{const T=y.onclick;y.onclick=function(w){w.preventDefault();const H=y;!H.__skipLb&&(T==null||T(w)),H.__skipLb=!0}})};if(n.refreshFsLightbox)p();else{const d=document.createElement("script");d.src=e.cdnScript,d.onload=p,document.head.appendChild(d)}},Y=e=>({id:`${g}-open-lb`,label:C,command:()=>{const t=e.getView();t==null||t.toggleLightbox()}}),l="source-type",V={type:"radio",name:l,label:"Source type",changeProp:!0,options:[{id:"image",label:"Image",icon:m.image},{id:"video",label:"Video",icon:m.video},{id:"el",label:"Custom Element",icon:m.external}],labelToTitle:!0},N={id:"href-image",name:"href",type:"file",label:"Source Image"},j={id:"href-video",name:"href",label:"Source Video",placeholder:"https://www.youtube.com/watch?v=..."},O={id:"href-el",name:"href",label:"Source Element",placeholder:"#custom-element-id"},Q={image:[N],video:[j],el:[O]};a.addType(g,{block:v&&{label:b,media:m.imageLightbox,category:"Extra",select:!0,...r.block},isComponent:e=>{var t;return(t=e.hasAttribute)==null?void 0:t.call(e,S)},extendFn:["initToolbar"],model:{defaults:{tagName:"a",name:b,icon:m.imageLightbox,classes:f,draggable:(e,t)=>!t.is(g),attributes:{[S]:"lightbox",[L]:"image",href:I},components:{type:"image",src:I},script:X,cdnScript:r.cdnScript,"script-props":["attributes","cdnScript"],[l]:"image",traits:[V,{name:S,label:"Group name"},{type:"button",label:"Toggle Lightbox",command(e,t){var n;const s=(n=t.target)==null?void 0:n.getView();s==null||s.toggleLightbox()}}],styles:`
-          .${f} {
+(function(v,y){typeof exports=="object"&&typeof module<"u"?module.exports=y():typeof define=="function"&&define.amd?define(y):(v=typeof globalThis<"u"?globalThis:v||self,v.StudioSdkPlugins_fsLightboxComponent=y())})(this,function(){"use strict";const v="app.grapesjs.com",y="app-stage.grapesjs.com",O=[v,y,"localhost","127.0.0.1",".local-credentialless.webcontainer.io",".local.webcontainer.io","-sandpack.codesandbox.io"],D="license:check:start",U="license:check:end",R=()=>typeof window<"u",W=({isDev:t,isStage:a})=>`${t?"":`https://${a?y:v}`}/api`,F=()=>{const t=R()&&window.location.hostname;return!!t&&(O.includes(t)||O.some(a=>t.endsWith(a)))};var T=(t=>(t.free="free",t.startup="startup",t.business="business",t.enterprise="enterprise",t))(T||{});async function K({path:t,baseApiUrl:a,method:r="GET",headers:c={},params:d,body:h}){const E=`${a||W({isDev:!1,isStage:!1})}${t}`,p={method:r,headers:{"Content-Type":"application/json",...c}};h&&(p.body=JSON.stringify(h));const m=d?new URLSearchParams(d).toString():"",s=m?`?${m}`:"",b=await fetch(`${E}${s}`,p);if(!b.ok)throw new Error(`HTTP error! status: ${b.status}`);return b.json()}const P={[T.free]:0,[T.startup]:10,[T.business]:20,[T.enterprise]:30};function G(t){const a=t;return a.init=r=>c=>t(c,r),a}const Z=t=>G(t);async function q({editor:t,plan:a,pluginName:r,licenseKey:c,cleanup:d}){let h="",g=!1;const E=F(),p=s=>{console.warn("Cleanup plugin:",r,"Reason:",s),d()},m=(s={})=>{var _;const{error:b,sdkLicense:l}=s,x=(_=s.plan)==null?void 0:_.category;if(!(l||s.license)||b)p(b||"Invalid license");else if(x){const C=P[a],H=P[x];C>H&&p({pluginRequiredPlan:a,licensePlan:x})}};t.on(D,s=>{h=s==null?void 0:s.baseApiUrl,g=!0}),t.on(U,s=>{m(s)}),setTimeout(async()=>{if(!g){if(E)return;if(c){const s=await z({licenseKey:c,pluginName:r,baseApiUrl:h});s&&m(s)}else p("The `licenseKey` option not provided")}},2e3)}async function z(t){const{licenseKey:a,pluginName:r,baseApiUrl:c}=t;try{return(await K({baseApiUrl:c,path:`/sdk/${a||"na"}`,method:"POST",params:{d:window.location.hostname,pn:r}})).result||{}}catch(d){return console.error("Error during SDK license check:",d),!1}}const J="gjs-plg-",X="fsLightboxComponent",k="data-fslightbox",I="data-type",Y="fslightbox-open",L="fslightbox",S={image:'<svg viewBox="0 0 24 24"><path d="m8.5 13.5 2.5 3 3.5-4.5 4.5 6H5m16 1V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2Z"/></svg>',video:'<svg viewBox="0 0 24 24"><path d="M17 10.5V7a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-3.5l4 4v-11l-4 4Z"/></svg>',imageLightbox:'<svg viewBox="0 0 24 24"><path d="M4,2H20A2,2 0 0,1 22,4V16A2,2 0 0,1 20,18H16L12,22L8,18H4A2,2 0 0,1 2,16V4A2,2 0 0,1 4,2M19,15V7L15,11L13,9L7,15H19M7,5A2,2 0 0,0 5,7A2,2 0 0,0 7,9A2,2 0 0,0 9,7A2,2 0 0,0 7,5Z" /></svg>',external:'<svg viewBox="0 0 24 24"><path d="M14 3v2h3.6l-9.8 9.8 1.4 1.4L19 6.4V10h2V3m-2 16H5V5h7V3H5a2 2 0 0 0-2 2v14c0 1.1.9 2 2 2h14a2 2 0 0 0 2-2v-7h-2v7z"/></svg>',eye:'<svg viewBox="0 0 24 24"><path d="M12 9a3 3 0 0 0-3 3 3 3 0 0 0 3 3 3 3 0 0 0 3-3 3 3 0 0 0-3-3m0 8a5 5 0 0 1-5-5 5 5 0 0 1 5-5 5 5 0 0 1 5 5 5 5 0 0 1-5 5m0-12.5C7 4.5 2.7 7.6 1 12a11.8 11.8 0 0 0 22 0c-1.7-4.4-6-7.5-11-7.5Z"/></svg>'};return Z(function(t,a={}){const{Blocks:r,Components:c}=t,d="Lightbox",h=`${J}${L}`,g={toolbarIconOpen:S.eye,block:{},defaultSrc:"https://placehold.co/300/777/white.png?text=Image",cdnScript:"https://cdn.jsdelivr.net/npm/fslightbox@3.4.2/index.js",...a},{block:E,toolbarIconOpen:p,defaultSrc:m}=g,s=function(n){const e=this,i="data-fslightbox",o=window,f=()=>{var N;const u=o.refreshFsLightbox;u==null||u();const M=e.getAttribute(i);if((N=o.fsLightboxInstances)==null||N[M],!o._isEditor)return;Array.from(document.querySelectorAll(`[${i}]`)).forEach(w=>{const A=w.onclick;w.onclick=function($){$.preventDefault();const B=w;!B.__skipLb&&(A==null||A($)),B.__skipLb=!0}})};if(o.refreshFsLightbox)f();else{const u=document.createElement("script");u.src=n.cdnScript,u.onload=f,document.head.appendChild(u)}},b=n=>({id:`${L}-open-lb`,label:p,command:()=>{const e=n.getView();e==null||e.toggleLightbox()}}),l="source-type",x={type:"radio",name:l,label:"Source type",changeProp:!0,options:[{id:"image",label:"Image",icon:S.image},{id:"video",label:"Video",icon:S.video},{id:"el",label:"Custom Element",icon:S.external}],labelToTitle:!0},j={id:"href-image",name:"href",type:"file",label:"Source Image"},_={id:"href-video",name:"href",label:"Source Video",placeholder:"https://www.youtube.com/watch?v=..."},C={id:"href-el",name:"href",label:"Source Element",placeholder:"#custom-element-id"},H={image:[j],video:[_],el:[C]};c.addType(L,{block:E&&{label:d,media:S.imageLightbox,category:"Extra",select:!0,...g.block},isComponent:n=>{var e;return(e=n.hasAttribute)==null?void 0:e.call(n,k)},extendFn:["initToolbar"],model:{defaults:{tagName:"a",name:d,icon:S.imageLightbox,classes:h,draggable:(n,e)=>!e.is(L),attributes:{[k]:"lightbox",[I]:"image",href:m},components:{type:"image",src:m},script:s,cdnScript:g.cdnScript,"script-props":["attributes","cdnScript"],[l]:"image",traits:[x,{name:k,label:"Group name"},{type:"button",label:"Toggle Lightbox",command(n,e){var o;const i=(o=e.target)==null?void 0:o.getView();i==null||i.toggleLightbox()}}],styles:`
+          .${h} {
             display: inline-block;
             padding: 10px;
           }
-        `},init(){const e=[l].map(t=>`change:${t}`).join(" ");this.on(e,this.updateTraits),this.on(`change:${l}`,this.onSourceTypeChange),this.on("change:attributes:href",this.adjustSourceType),this.updateTraits({init:!0}),this.adjustSourceType()},onSourceTypeChange(e,t,s){if(s.adjust)return;const p=this.get(l)==="video"?"video":"image";this.addAttributes({[L]:p,href:""})},adjustSourceType(){const e=this.get(l),t=this.getAttributes().href||"",s={adjust:!0};if(e==="video"){const n=t.includes("youtube.com")?"youtube":"video";this.addAttributes({[L]:n},s)}else e!=="el"&&t.startsWith("#")?this.set(l,"el",s):e==="image"&&this.addAttributes({[L]:"image"},s)},updateTraits(e={}){const{changed:t}=this,{init:s}=e;if(t[V.name]||s){this.removeTrait([N.name,j.name,O.name]);const n=this.get(l)||"image",p=this.getTraitIndex(l)+1;this.addTrait(Q[n],{at:p})}},initToolbar(){if(!C)return;const{toolbar:e}=this,t=Y(this);!e.find(n=>n.id===t.id)&&(e==null||e.unshift(t))}},view:{onRender(){this.el.__skipLb=!0},toggleLightbox(){var y;const{em:e,el:t,model:s}=this,{Canvas:n}=e,p=s.getAttributes()[S],{defaultView:d,documentElement:_}=t.ownerDocument,x=(y=d.fsLightboxInstances)==null?void 0:y[p];if(_.classList.contains(z))x.close();else{t.__skipLb=!1;let T;x.props.onOpen=()=>{T=n.getSpots(),setTimeout(()=>n.removeSpots())},x.props.onClose=()=>{T.forEach(w=>n.addSpot(w.attributes))},t.click()}}}}),K({editor:o,licenseKey:r.licenseKey,pluginName:q,cleanup:()=>{c.remove(g),a.removeType(g)}})})});
+        `},init(){const n=[l].map(e=>`change:${e}`).join(" ");this.on(n,this.updateTraits),this.on(`change:${l}`,this.onSourceTypeChange),this.on("change:attributes:href",this.adjustSourceType),this.updateTraits({init:!0}),this.adjustSourceType()},onSourceTypeChange(n,e,i){if(i.adjust)return;const f=this.get(l)==="video"?"video":"image";this.addAttributes({[I]:f,href:""})},adjustSourceType(){const n=this.get(l),e=this.getAttributes().href||"",i={adjust:!0};if(n==="video"){const o=e.includes("youtube.com")?"youtube":"video";this.addAttributes({[I]:o},i)}else n!=="el"&&e.startsWith("#")?this.set(l,"el",i):n==="image"&&this.addAttributes({[I]:"image"},i)},updateTraits(n={}){const{changed:e}=this,{init:i}=n;if(e[x.name]||i){this.removeTrait([j.name,_.name,C.name]);const o=this.get(l)||"image",f=this.getTraitIndex(l)+1;this.addTrait(H[o],{at:f})}},initToolbar(){if(!p)return;const{toolbar:n}=this,e=b(this);!n.find(o=>o.id===e.id)&&(n==null||n.unshift(e))}},view:{onRender(){this.el.__skipLb=!0},toggleLightbox(){var w;const{em:n,el:e,model:i}=this,{Canvas:o}=n,f=i.getAttributes()[k],{defaultView:u,documentElement:M}=e.ownerDocument,V=(w=u.fsLightboxInstances)==null?void 0:w[f];if(M.classList.contains(Y))V.close();else{e.__skipLb=!1;let A;V.props.onOpen=()=>{A=o.getSpots(),setTimeout(()=>o.removeSpots())},V.props.onClose=()=>{A.forEach($=>o.addSpot($.attributes))},e.click()}}}}),q({editor:t,plan:T.free,licenseKey:g.licenseKey,pluginName:X,cleanup:()=>{r.remove(L),c.removeType(L)}})})});