@sitecore-feaas/clientside 0.5.16-alpha.1 → 0.5.18

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (50) hide show
  1. package/build/dom/thumbnail.js +1 -1
  2. package/build/dom/thumbnail.js.map +1 -1
  3. package/build/ui/FEAASExternal.js +1 -1
  4. package/build/ui/FEAASExternal.js.map +1 -1
  5. package/build/ui/FEAASPicker.js +2 -2
  6. package/build/ui/FEAASPicker.js.map +1 -1
  7. package/build/ui/react.js +15 -2
  8. package/build/ui/react.js.map +1 -1
  9. package/cdn/browser/index.esm.js +1 -0
  10. package/cdn/node/index.esm.js +1 -0
  11. package/dist/browser/headless.cjs +1 -1
  12. package/dist/browser/headless.cjs.map +2 -2
  13. package/dist/browser/headless.esm.js +1 -1
  14. package/dist/browser/headless.esm.js.map +1 -1
  15. package/dist/browser/index.cjs +6 -6
  16. package/dist/browser/index.cjs.map +3 -3
  17. package/dist/browser/index.esm.js +5 -5
  18. package/dist/browser/index.esm.js.map +1 -1
  19. package/dist/browser/react.cjs +7 -7
  20. package/dist/browser/react.cjs.map +3 -3
  21. package/dist/browser/react.esm.js +7 -7
  22. package/dist/browser/react.esm.js.map +1 -1
  23. package/dist/node/headless.cjs +1 -1
  24. package/dist/node/headless.cjs.map +2 -2
  25. package/dist/node/headless.esm.js +1 -1
  26. package/dist/node/headless.esm.js.map +2 -2
  27. package/dist/node/index.cjs +2 -2
  28. package/dist/node/index.cjs.map +3 -3
  29. package/dist/node/index.esm.js +2 -2
  30. package/dist/node/index.esm.js.map +3 -3
  31. package/dist/node/react.cjs +6 -6
  32. package/dist/node/react.cjs.map +3 -3
  33. package/dist/node/react.esm.js +6 -6
  34. package/dist/node/react.esm.js.map +3 -3
  35. package/headless.cjs +1 -1
  36. package/headless.cjs.map +2 -2
  37. package/headless.js +1 -1
  38. package/headless.js.map +2 -2
  39. package/package.json +3 -3
  40. package/react.cjs +7 -7
  41. package/react.cjs.map +3 -3
  42. package/react.js +7 -7
  43. package/react.js.map +3 -3
  44. package/src/dom/thumbnail.ts +1 -1
  45. package/src/ui/FEAASExternal.tsx +1 -1
  46. package/src/ui/FEAASPicker.tsx +2 -2
  47. package/src/ui/react.tsx +19 -2
  48. package/test/FEAASComponent.react.test.tsx +54 -0
  49. package/types/ui/react.d.ts +3 -2
  50. package/types/ui/react.d.ts.map +1 -1
@@ -66,10 +66,10 @@ var ke=Object.defineProperty;var Y=(t,e)=>{for(var r in e)ke(t,r,{get:e[r],enume
66
66
  style="animation: 1.5s linear 0s infinite normal none running loader-circular-track"
67
67
  ></circle>
68
68
  </svg>
69
- </div>`,this.getRoot().appendChild(this.stylesheet),this.getRoot().appendChild(this.loader)}update(){this.loader.style.opacity=String(this.props.opacity)}};at.observedAttributes=["hidden","opacity"];at.register("feaas-loader");function ge(t){var e,r,i,n;let o=t.getAttribute("src");if(o)var{cdn:s,library:a,revision:l}=B(o);return{library:t==null?void 0:t.getContextAttribute("library"),revision:(r=(e=t==null?void 0:t.getAttribute("revision"))!==null&&e!==void 0?e:l)!==null&&r!==void 0?r:"published",cdn:(n=(i=t==null?void 0:t.getContextAttribute("cdn"))!==null&&i!==void 0?i:t==null?void 0:t.getContextAttribute("hostname"))!==null&&n!==void 0?n:_}}var Et=class extends E{constructor(){super(...arguments),this.onLoad=e=>{this.payload=e,this.advance()}}getProps(){return ge(this)}isReadyToLoad(){return this.props.library!=null&&this.props.revision!=null&&this.props.cdn!=null}load(){return At(this.props,this.onLoad)}};Et.register("feaas-stylesheet");var wt={};Y(wt,{convertBase64toBlob:()=>ve,generate:()=>Ae,get:()=>Be,getVersionForThumbnail:()=>ye,load:()=>be,responseToImage:()=>It,upload:()=>Ee});var ve=t=>fetch(t).then(e=>e.blob()),It=t=>t.blob().then(e=>new Promise((r,i)=>{let n=new Image;n.onerror=i,n.onload=()=>{r(n)},n.src=URL.createObjectURL(e)}));async function ye(t){return t.versions.length||await t.versions.fetch(),t.getVersionForWidth(800)}async function Be(t,e,r){try{if(!t.isNew)return await be(t,e,r)}catch(n){t.sdk.log(`FEAAS: Thumbnail ${t.id}, version: ${(e==null?void 0:e.id)||"responsive"}, status: generating ${status}, reason: ${n}`)}let i=await Ae(t,e);return r==null||r(i,!1),i&&!t.isNew&&ve(i.src).then(n=>Ee(t,e,n)),i}async function be(t,e,r){let i=e?e.getThumbnailURL():t.getThumbnailURL(),n=t.library.stylesheet,o=new Date(Math.max(Number(t.modifiedAt),Number(n.modifiedAt)));t.sdk.log(`FEAAS: Thumbnail ${t.id}/${(e==null?void 0:e.id)||"responsive"}, loading`);var s;return await rt(i,{},(a,l)=>{let d=Math.abs(Number(new Date(a.headers.get("x-ms-meta-componentRenderedAt")))-Number(o))<2e3;return l&&!d&&It(a).then(c=>{s=c,r(c,l)}),d},(a,l,d)=>{t.sdk.log(`FEAAS: Thumbnail ${t.id}/${(e==null?void 0:e.id)||"responsive"}, status: ${l}`),It(a).then(c=>{s=c,r(c,d)})},null),s}async function Ae(t,e,r){let i=e||(t.isNew?null:await ye(t));if(!i||i.isViewEmpty())return null;let n=r||t.library.stylesheets.first,{datasources:o}=t.sdk;return await ze(i.classList,n.getBreakpointForWidth(800,i.getBreakpoints()),i.view,o.reduce((a,l)=>Object.assign(a,{[l.id]:l.sample}),{}),n.css,t.sdk)}function ze(t,e,r,i,n,o){let s=document.createElement("iframe");return s.style.position="absolute",s.style.top="-2000px",s.style.left="-2000px",s.style.width=e.props.minWidth+"px",s.style.height="720px",s.style.zIndex="100011",document.body.appendChild(s),new Promise((a,l)=>{let d=document.createElement("script");d.onerror=l,d.src=o.frontend+"/assets/html2canvas.js",d.onload=()=>{var h;(((h=s.contentWindow.document.fonts)===null||h===void 0?void 0:h.ready)||Promise.resolve()).then(function(){return s.contentWindow.html2canvas(u,{scale:Math.max(1.1,1e3/Math.min(1401,Math.max(320,e.props.minWidth))),width:Math.min(1401,Math.max(320,e.props.minWidth)),height:Math.max(1,Math.min(2e3,u.offsetHeight)),windowWidth:e.props.minWidth+"px",windowHeight:1e3,proxy:o.backend+"/proxy/media",backgroundColor:"#ffffff"}).then(p=>{let b=p.toDataURL("image/jpeg",.6);s.parentElement.removeChild(s);let y=new Image;y.onload=()=>{a(y)},y.onerror=l,y.src=b})})},s.contentWindow.document.head.appendChild(d);let c=s.contentWindow.document.createElement("style");c.textContent=`
69
+ </div>`,this.getRoot().appendChild(this.stylesheet),this.getRoot().appendChild(this.loader)}update(){this.loader.style.opacity=String(this.props.opacity)}};at.observedAttributes=["hidden","opacity"];at.register("feaas-loader");function ge(t){var e,r,i,n;let o=t.getAttribute("src");if(o)var{cdn:s,library:a,revision:l}=B(o);return{library:t==null?void 0:t.getContextAttribute("library"),revision:(r=(e=t==null?void 0:t.getAttribute("revision"))!==null&&e!==void 0?e:l)!==null&&r!==void 0?r:"published",cdn:(n=(i=t==null?void 0:t.getContextAttribute("cdn"))!==null&&i!==void 0?i:t==null?void 0:t.getContextAttribute("hostname"))!==null&&n!==void 0?n:_}}var Et=class extends E{constructor(){super(...arguments),this.onLoad=e=>{this.payload=e,this.advance()}}getProps(){return ge(this)}isReadyToLoad(){return this.props.library!=null&&this.props.revision!=null&&this.props.cdn!=null}load(){return At(this.props,this.onLoad)}};Et.register("feaas-stylesheet");var wt={};Y(wt,{convertBase64toBlob:()=>ve,generate:()=>Ae,get:()=>Be,getVersionForThumbnail:()=>ye,load:()=>be,responseToImage:()=>It,upload:()=>Ee});var ve=t=>fetch(t).then(e=>e.blob()),It=t=>t.blob().then(e=>new Promise((r,i)=>{let n=new Image;n.onerror=i,n.onload=()=>{r(n)},n.src=URL.createObjectURL(e)}));async function ye(t){return t.versions.length||await t.versions.fetch(),t.getVersionForWidth(800)}async function Be(t,e,r){try{if(!t.isNew)return await be(t,e,r)}catch(n){t.sdk.log(`FEAAS: Thumbnail ${t.id}, version: ${(e==null?void 0:e.id)||"responsive"}, status: generating ${status}, reason: ${n}`)}let i=await Ae(t,e);return r==null||r(i,!1),i&&!t.isNew&&ve(i.src).then(n=>Ee(t,e,n)),i}async function be(t,e,r){let i=e?e.getThumbnailURL():t.getThumbnailURL(),n=t.library.stylesheet,o=new Date(Math.max(Number(t.modifiedAt),Number(n.modifiedAt)));t.sdk.log(`FEAAS: Thumbnail ${t.id}/${(e==null?void 0:e.id)||"responsive"}, loading`);var s;return await rt(i,{},(a,l)=>{let d=Math.abs(Number(new Date(a.headers.get("x-ms-meta-componentRenderedAt")))-Number(o))<2e3;return l&&!d&&It(a).then(c=>{s=c,r(c,l)}),d},(a,l,d)=>{t.sdk.log(`FEAAS: Thumbnail ${t.id}/${(e==null?void 0:e.id)||"responsive"}, status: ${l}`),It(a).then(c=>{s=c,r(c,d)})},null),s}async function Ae(t,e,r){let i=e||(t.isNew?null:await ye(t));if(!i||i.isViewEmpty())return null;let n=r||t.library.stylesheets.first,{datasources:o}=t.sdk;return await ze(i.classList,n.getBreakpointForWidth(800,i.getBreakpoints()),i.view,o.reduce((a,l)=>Object.assign(a,{[l.id]:l.sample}),{}),n.css,t.sdk)}function ze(t,e,r,i,n,o){let s=document.createElement("iframe");return s.style.position="absolute",s.style.top="-2000px",s.style.left="-2000px",s.style.width=e.props.minWidth+"px",s.style.height="720px",s.style.zIndex="100011",document.body.appendChild(s),new Promise((a,l)=>{let d=document.createElement("script");d.onerror=l,d.src=o.frontend+"/assets/html2canvas.js",d.onload=()=>{var h;(((h=s.contentWindow.document.fonts)===null||h===void 0?void 0:h.ready)||Promise.resolve()).then(function(){return s.contentWindow.html2canvas(u,{scale:Math.max(1.1,1e3/Math.min(1401,Math.max(320,e.props.minWidth))),width:Math.min(1401,Math.max(320,e.props.minWidth)),height:Math.max(1,Math.min(2e3,u.offsetHeight)),windowWidth:e.props.minWidth||e.props.maxWidth+"px",windowHeight:1e3,proxy:o.backend+"/proxy/media",backgroundColor:"#ffffff"}).then(p=>{let b=p.toDataURL("image/jpeg",.6);s.parentElement.removeChild(s);let y=new Image;y.onload=()=>{a(y)},y.onerror=l,y.src=b})})},s.contentWindow.document.head.appendChild(d);let c=s.contentWindow.document.createElement("style");c.textContent=`
70
70
  ${n}
71
71
  body, html { padding: 0; margin: 0; overflow: hidden }
72
72
  `;let f=s.contentWindow.document.createElement("style");f.textContent=`
73
73
  body, html { padding: 0; margin: 0; overflow: hidden }
74
- `,s.contentWindow.document.head.appendChild(c),s.contentWindow.document.head.appendChild(f);let u=Ft({template:r,data:i});u.classList.add(...t,"-feaas--preview","-emulate--"+e.details.slug),s.contentWindow.document.body.appendChild(u)})}async function Ee(t,e,r){let i=e?e.getThumbnailURL():t.getThumbnailURL(),n=new Date(Math.max(Number(t.modifiedAt),Number(t.library.stylesheet.modifiedAt)));try{await t.sdk.uploadBlob("thumbnails",i.split(/\/thumbnails\//)[1],r,{headers:{"x-ms-blob-content-type":"image/jpg","x-ms-blob-cache-control":"public,max-age=31536000,immutable","x-ms-meta-versionId":e?e.id:null,"x-ms-meta-versionRevision":e?e.revision.toString():null,"x-ms-meta-componentId":t.id,"x-ms-meta-componentRenderedAt":n.toUTCString(),"x-ms-meta-componentModifiedAt":t.modifiedAt.toUTCString(),"x-ms-meta-componentCreatedAt":t.createdAt.toUTCString(),"x-ms-meta-modifiedAt":t.modifiedAt.toUTCString()}}),fetch(i,{cache:"no-cache"}).then(()=>{t.sdk.log("FEAAS: Thumbnail uploaded",i)})}catch(o){t.sdk.log("FEAAS: Thumbnail failed to upload",i,o)}return i}import{registerDatasource as Ve,registerComponent as Je,getComponent as qe,customizeDataSettings as Ge}from"@sitecore/byoc";var Wt;typeof window!="undefined"&&(window.FEAASReactElement=W,(Wt=window.FEAASLoading)!==null&&Wt!==void 0||(window.FEAASLoading=Promise.resolve()));function we(t){let e=[];if(t){let r=t.ownerDocument.defaultView,i,n;for(;r!==window.top;){i=r.parent;for(let o=0;o<i.frames.length;o++)if(i.frames[o]===r){for(let s of i.document.getElementsByTagName("iframe"))if(s.contentWindow===r){n=s.getBoundingClientRect();let a=s.contentWindow.getComputedStyle(s);e.push({left:n.left+parseInt(a.borderLeftWidth),top:n.top+parseInt(a.borderTopWidth)})}r=i;break}}}return e.reduce((r,i)=>({left:r.left+i.left,top:r.top+i.top}),{left:0,top:0})}function Ce(t){var e;return{context:HTMLElement,frontend:t==null?void 0:t.getContextAttribute("frontend"),src:(e=t==null?void 0:t.getAttribute("src"))!==null&&e!==void 0?e:"/editor.js",library:t==null?void 0:t.getAttribute("library"),component:t==null?void 0:t.getAttribute("component"),version:t==null?void 0:t.getAttribute("version"),instance:t==null?void 0:t.getAttribute("instance"),forked:t==null?void 0:t.getAttribute("forked"),revision:(t==null?void 0:t.getAttribute("revision"))||"saved",hidden:(t==null?void 0:t.getAttribute("hidden"))!=null,for:t==null?void 0:t.getAttribute("for"),state:(t==null?void 0:t.getAttribute("state"))||"idle",changed:(t==null?void 0:t.getAttribute("changed"))!=null}}var lt=class extends E{constructor(){super(...arguments),this.framePoint={top:0,left:0},this.wrapperRect={top:0,left:0,width:0,height:0},this.bodyRect={top:0,left:0,width:0,height:0},this.defaultProps={hidden:!1},this.setTarget=(e,r={component:e.getAttribute("component"),version:e.getAttribute("version"),revision:e.getAttribute("revision"),instance:e.getAttribute("instance")})=>{if(!this.closing&&(!this.target||e==null))return this.set(r),this.target=e,!0},this.onChromeMeasureElement=(e,r=e.getBoundingClientRect())=>e.ownerDocument==document?{left:r.left-this.bodyRect.left,top:r.top-this.bodyRect.top,width:r.width,height:r.height}:{left:r.left+this.framePoint.left-this.bodyRect.left,top:r.top+this.framePoint.top-this.bodyRect.top,width:r.width,height:r.height},this.onBeforeMeasure=e=>{e.memoized.focusable&&(this.framePoint=we(e.memoized.focusable)),this.chrome&&(this.wrapperRect=this.chrome.positionable.getBoundingClientRect(),this.bodyRect=this.chrome.positionable.ownerDocument.body.parentElement.getBoundingClientRect())},this.onMeasure=()=>{},this.onPosition=({focusable:e,root:r})=>{!this.chrome||this.props.hidden||(e?(this.chrome.wrapper.style.width=e.width+16*2+"px",this.chrome.wrapper.style.height=e.height+16*1+64+"px",this.chrome.wrapper.style.left=e.left-16+"px",this.chrome.wrapper.style.top=e.top-64+"px",this.chrome.wrapper.style.opacity="1",this.chrome.absolute=this.querySelector(".ui.overlays"),this.chrome.absolute&&(this.chrome.absolute.style.left=r.left+"px",this.chrome.absolute.style.top=r.top+"px")):(this.chrome.wrapper.style.opacity="0",this.chrome.wrapper.style.left="-1000px",this.chrome.wrapper.style.top="-1000px"))},this.onWindowMessage=e=>{var r;switch((r=e.data)===null||r===void 0?void 0:r.type){case"feaasEdit":let i=this.getPlaceholder();this.setTarget(i.editable,e.data)&&(this.loader=i.loader,document.body.appendChild(i.clipper),this.editedUID=e.data.id,this.setPlaceholder(),this.open());break;case"feaasMeasurements":this.measurements=e.data.measurements,this.props.hidden||this.setPlaceholder();break}},this.onContentChange=()=>{this.setAttribute("changed","changed"),requestAnimationFrame(()=>{this.setIframeComponentContent()})},this.onClose=()=>{var e;this.setAttribute("hidden","hidden"),this.placeholder&&(this.placeholder.positionable.style.opacity="0",this.placeholder.positionable.style.pointerEvents="none"),this.chrome&&(this.chrome.wrapper.style.opacity="0"),!((e=this.target)===null||e===void 0)&&e.parentNode&&(this.target.outerHTML=this.target.outerHTML),this.setTarget(null,{component:null,version:null,instance:null,revision:null}),this.setEditorContext({isFocused:!1})},this.onVersionStateChange=(e,r)=>{this.versionContext=e,this.setVersionContext=r},this.onEditorStateChange=(e,r)=>{this.editorContext=e,this.setEditorContext=r,e.editor&&this.props.state=="loading"&&!this.props.hidden&&(this.setAttribute("state","ready"),this.ownerDocument.fonts.ready.then(()=>setTimeout(()=>{this.setReadyState(),this.setIframeComponentContent()},100)))}}getProps(){return Ce(this)}getReactRootElement(){return this.reactRootElement||(this.reactRootElement=document.createElement("div"),this.getRoot().appendChild(this.reactRootElement)),this.reactRootElement}showLoader(){this.loader||(this.loader=document.createElement("feaas-loader"),this.loader.setAttribute("opacity","0.6"),this.loader.style.zIndex="1000",this.target.appendChild(this.loader),this.target.tagName=="FEAAS-COMPONENT"&&(this.target.style.position="relative"))}hideLoader(){this.loader&&(this.loader.setAttribute("hidden","hidden"),this.target.tagName=="FEAAS-COMPONENT"&&(this.target.style.position="relative",this.target.style.position=""))}load(){return import( /*@vite-ignore*/ /* webpackIgnore: true */ this.formatURL(this.props.src,this.props.frontend))}connectedCallback(){super.connectedCallback(),window.addEventListener("message",this.onWindowMessage)}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener("message",this.onWindowMessage)}setIframe(e){this.iframe=e}setIframeComponentContent(){this.placeholder&&this.iframe&&this.placeholder.editable.innerHTML&&this.iframe.contentWindow.postMessage({type:"feaasUpdate",id:this.editedUID,content:this.placeholder.editable.innerHTML})}setPlaceholder(){if(!this.iframe)return;let e=this.iframe.clientWidth,r=this.iframe.clientHeight,i=this.iframe.getBoundingClientRect(),n=this.getPlaceholder(),o=document.body.getBoundingClientRect(),s=this.measurements[this.editedUID];s&&(Object.assign(n.clipper.style,{position:"absolute",top:i.top+this.iframe.clientTop-o.top+"px",left:i.left+this.iframe.clientLeft-o.left+"px",width:e+"px",height:r+"px",pointerEvents:"none",zIndex:1,overflow:"hidden"}),Object.assign(n.positionable.style,{position:"absolute",top:s.top+"px",left:s.left+"px",width:s.width+"px",zIndex:2,transition:"opacity 0.4s",pointerEvents:this.props.hidden?"none":"all"}),Object.assign(n.loader.style,{position:"absolute",top:s.top+"px",left:s.left+"px",width:s.width+"px",height:s.height+"px",filter:"opacity(0.6)",zIndex:3,pointerEvents:"none"}),document.dispatchEvent(new Event("feaasRefresh",{bubbles:!0})))}getPlaceholder(){return this.placeholder?this.placeholder:(this.placeholder={clipper:document.createElement("div"),positionable:document.createElement("div"),editable:Object.assign(document.createElement("div"),{className:"-feaas"}),loader:document.createElement("feaas-loader")},this.placeholder.clipper.appendChild(this.placeholder.positionable),this.placeholder.positionable.appendChild(this.placeholder.editable),this.placeholder.clipper.appendChild(this.placeholder.loader),this.placeholder)}attributeChangedCallback(e,r,i){r!==i&&(e=="hidden"&&(this.style.setProperty("display","block","important"),this.style.setProperty("transition","opacity 0.3s","important"),i?(this.style.setProperty("opacity","0","important"),this.style.pointerEvents="none"):(this.style.setProperty("opacity","1","important"),this.style.pointerEvents="all")),super.attributeChangedCallback(e,r,i))}open(){clearTimeout(this.closing),this.removeAttribute("hidden"),this.removeAttribute("changed"),this.setLoadingState()}shouldFork(e){return e.forkOriginId==null&&this.props.instance!=null}cleanup(){var e;this.placeholder&&((e=this.placeholder.clipper)===null||e===void 0||e.remove(),this.placeholder=null)}close(){console.log("Editor is not ready")}unfork(){console.log("Editor is not ready")}discard(){console.log("Editor is not ready")}save(){console.log("Editor is not ready")}setVersionContext(e){console.log("Editor is not ready")}setEditorContext(e){console.log("Editor is not ready")}setLoadingState(){this.showLoader(),this.setAttribute("state","loading")}setReadyState(){this.hideLoader(),this.setEditorContext({activeVersionId:this.component.versions[0].id}),this.setAttribute("state","ready")}render({children:e,component:r,version:i,instance:n},{Editor:o,VersionStatusList:s,VersionStatusButton:a,Version:l,VersionMenu:d,EditorUIUndo:c,EditorUIMode:f,React:{useEffect:u,useMemo:h,useState:p,useContext:b},Chakra:{HStack:y,Box:A,Button:N,MenuItem:ct},Chrome:Ct,ReactDOM:Bt,useSDK:xt,useLibrary:St,useSlots:I,useModelObserver:Rt,ConfirmationContext:kt,VersionContext:J}){if(!this.payload)return;let{React:g}=this.payload,ht=xt(),q=St(),[v,T]=p(),{setConfirm:P}=b(kt),G=n||i;v&&(this.component=v),u(()=>{if(this.props.hidden)return;let C=q.components.getItem(r).clone();return C.versions.search({ids:[i,n].filter(Boolean),componentIds:[r]}).then(M=>{C.versions.setItems(M);let k=C.findVersion(n,["staged","published"]),X=C.findVersion(i,["staged","published"]);if(k)k.deletedAt?(k.getDraft().changeAndNotify(X.toProperties()).restore(),console.error("FEAAS Editor: Restoring fork")):(console.error("FEAAS Editor: Pre-forked"),this.setAttribute("forked",k.id));else if(this.removeAttribute("forked"),this.shouldFork(X)){console.error("FEAAS Editor: Forking");let _t=X.fork(n).id;this.setAttribute("instance",_t)}else console.error("FEAAS Editor: Regular");T(C)}),()=>{this.closing=setTimeout(()=>{this.closing=null,this.cleanup(),T(null)},400)}},[i,this.props.hidden]);let zt=Rt(v==null?void 0:v.versions,[]).filter(C=>C.id==G),K=zt[0];K&&!this.props.hidden&&(this.version=K),u(()=>(this.unfork=()=>{P({title:"Reverting component customizations",button:"Discard",body:"Are you sure to reset component to its original state? All changes will be lost.",action:()=>{let C=v.findVersion(i,["staged","published"]);v.findVersion(n).unstage().unpublish().changeAndNotify(C.toProperties()),v.saveVersions(!1),this.setVersionContext({needsWrite:!0}),this.removeAttribute("forked"),requestAnimationFrame(this.onClose)}})},this.discard=()=>{this.props.changed&&(v.findVersion(G).revert(),v.saveVersions(!1),this.setVersionContext({needsWrite:!0}))},this.close=()=>{P({title:"Component has unsaved changes",button:"Discard",body:"Are you sure to close editor and discard changes?",bypass:!this.props.changed,action:()=>{this.discard(),requestAnimationFrame(this.onClose)}})},this.save=()=>{P({bypass:!!this.props.forked,title:"Customizing component",button:"Save",body:"Changes to the component will only be visible on that page. Changes to component done in Component Builder will not be reflected here. It will be possible to revert the customization.",action:()=>{var C,M;(M=(C=v.findVersion(G).commitData({view:this.editorContext.editor.getData({rootName:G}),model:""}))===null||C===void 0?void 0:C.stage())===null||M===void 0||M.publish(),this.removeAttribute("changed"),this.setAttribute("forked",G),v.saveVersions(!1)}})},()=>{delete this.unfork,delete this.discard,delete this.save,delete this.editorContext,delete this.versionContext,delete this.setEditorContext,delete this.setVersionContext}),[v]);let Re=h(()=>this.target,[v]);return h(()=>v&&I(e,({picker:C,children:M})=>g.createElement(A,{ref:k=>{this.chrome=k?{positionable:k,wrapper:k.querySelector(".editor-chrome"),absolute:this.querySelector(".ui.overlays")}:null}},g.createElement(A,{className:"editor-wrapper",position:"absolute",left:0,top:0},g.createElement(o,{datasources:ht.datasources,sdk:ht,library:q,component:v,versions:zt,context:{isAutosaveEnabled:!1,onChromeMeasure:this.onMeasure,onChromeBeforeMeasure:this.onBeforeMeasure,onChromeMeasureElement:this.onChromeMeasureElement,onChromePosition:this.onPosition,onContentChange:this.onContentChange}},{exports:this.onEditorStateChange,after:M,chrome:({editor:k})=>k&&g.createElement(Ct,null),children:({isArchivedDisplayed:k,editor:X,status:_t})=>g.createElement(A,{position:"absolute",left:0,top:0,className:"editor-chrome",p:4,boxShadow:"2xl",pointerEvents:"none",opacity:0,transition:"opacity 0.3s"},g.createElement(A,{left:0,width:"4",top:0,bottom:0,backdropFilter:"blur(2px)",background:"rgb(244 244 244 / 80%)",position:"absolute"}),g.createElement(A,{right:0,width:"4",top:0,bottom:0,backdropFilter:"blur(2px)",background:"rgb(244 244 244 / 80%)",position:"absolute"}),g.createElement(A,{top:0,height:"16",left:0,right:0,backdropFilter:"blur(2px)",background:"rgb(244 244 244 / 80%)",position:"absolute"}),g.createElement(A,{bottom:0,height:"4",left:0,right:0,backdropFilter:"blur(2px)",background:"rgb(244 244 244 / 80%)",position:"absolute"}),K&&g.createElement(l,{version:K,node:Re,ignoreBreakpoints:!0,deps:[this.props.forked,this.props.changed]},{exports:this.onVersionStateChange,left:g.createElement(y,{justifyContent:"space-between"},g.createElement(c,{size:"sm",editor:_t=="ready"?X:null}),g.createElement(f,{size:"sm"})),middle:(Ke,Xe)=>[!1],right:g.createElement(g.Fragment,null,g.createElement(N,{variant:"secondary",size:"sm",onClick:this.close},"Close"),g.createElement(N,{variant:"primary",size:"sm",onClick:this.save,isDisabled:!this.props.changed},this.props.changed?this.props.forked?"Save":"Save customization":"Up to date"),g.createElement(d,{isDisabled:!this.props.forked&&!this.props.changed},g.createElement(ct,{onClick:this.unfork,isDisabled:!this.props.forked},"Unfork"),g.createElement(ct,{onClick:this.discard,isDisabled:!this.props.changed},"Discard")))}))})))),[K,this.props.forked,this.props.changed])}isReadyToLoad(){return this.props.component!=null&&this.props.version!=null&&!this.props.hidden}};lt.observedAttributes=["library","component","version","revision","hidden","state","changed","forked"];lt.register("feaas-editor");function xe(t){var e,r;return{part:(t==null?void 0:t.getAttribute("part"))||"picker",slot:(t==null?void 0:t.getAttribute("part"))||"picker",mode:t==null?void 0:t.getAttribute("mode"),dialog:t==null?void 0:t.getAttribute("dialog"),placeholder:(t==null?void 0:t.getAttribute("placeholder"))||"No theme",frontend:(e=t==null?void 0:t.getContextAttribute("frontend"))!==null&&e!==void 0?e:"https://components.sitecorecloud.io",src:(r=t==null?void 0:t.getAttribute("src"))!==null&&r!==void 0?r:"/picker.js",hidden:(t==null?void 0:t.getAttribute("hidden"))!=null,variant:t==null?void 0:t.getAttribute("variant"),context:void 0,onClose:void 0,setAttribute:void 0,getAttribute:void 0}}var dt=class extends E{constructor(){super(...arguments),this.defaultProps={hidden:!1}}getProps(){return xe(this)}load(){return this.import( /*@vite-ignore*/ /* webpackIgnore: true */ this.formatURL(this.props.src,this.props.frontend))}connectedCallback(){this.setAttribute("feaas-role","ui"),super.connectedCallback()}render({placeholder:e,context:r,mode:i,dialog:n,children:o,variant:s},{Picker:a,React:l,useContext:d,EnvironmentContext:c,useLibrary:f,useSDK:u,BYOC:h}){var p,b,y;let[A,N]=l.useReducer(v=>v+1,0),ct=u(),Ct=d(c),Bt=f("collections"),xt=f("components"),St=u("datasources"),I=f(),Rt=((b=(p=I.stylesheets)===null||p===void 0?void 0:p.first)===null||b===void 0?void 0:b.rules)||((y=I==null?void 0:I.stylesheet)===null||y===void 0?void 0:y.styles),kt=u("externalComponents");var J=r==null?void 0:r.getAttribute("data");if(J)try{J=JSON.parse(J)}catch(v){}if(r)var g=ct.ExternalComponent.getDefinition(r),ht=g&&!g.getConfiguration(r),q=(g==null?void 0:g.type)=="feaas"?xt.find(v=>v.id==r.getAttribute("component")):h==null?void 0:h.getComponent(String(r.getAttribute("data-external-id")));return l.createElement(a,{cdn:Ct.cdn,rules:Rt,collections:Bt,themeContext:r,placeholder:e,embed:q,externalComponents:kt,datasources:St,data:J,versionId:r==null?void 0:r.getAttribute("version"),mode:i||(ht?"library":q?"context":null),setAttribute:(v,T,P)=>{T=="data"&&P&&(P=JSON.stringify(P)),this.props.setAttribute(v,T,P),N()},getAttribute:(v,T)=>r==null?void 0:r.getAttribute(T),dialog:n,context:r,variant:s,onModeChange:(v,T)=>{this.set({mode:v,dialog:T})}},o)}};dt.observedAttributes=["library","mode","frontend","src","hidden","variant","dialog"];dt.register("feaas-picker");function Se(t){var e,r,i,n,o;return{library:t==null?void 0:t.getAttribute("library"),src:(e=t==null?void 0:t.getAttribute("src"))!==null&&e!==void 0?e:"/context.js",environment:(r=t==null?void 0:t.getAttribute("environment"))!==null&&r!==void 0?r:void 0,frontend:(i=t==null?void 0:t.getAttribute("frontend"))!==null&&i!==void 0?i:"https://components.sitecorecloud.io",backend:(n=t==null?void 0:t.getAttribute("backend"))!==null&&n!==void 0?n:"https://components.sitecorecloud.io/api",cdn:(o=t==null?void 0:t.getAttribute("cdn"))!==null&&o!==void 0?o:"https://feaas.blob.core.windows.net",auth:null,isolate:(t==null?void 0:t.getAttribute("isolate"))==null||(t==null?void 0:t.getAttribute("isolate"))=="true"}}var j=class extends E{constructor(){super(...arguments),this.defaultProps={isolate:!0},this.onStatusChange=(e,r)=>{e=="ready"&&(this.whenSDKReady.resolve(r),this.dispatchEvent(new CustomEvent("feaasReady",{bubbles:!0,composed:!0,detail:r})))},this.whenSDKReady=S(e=>{this.sdk=e})}getProps(){return Se(this)}load(){return this.import( /*@vite-ignore*/ /* webpackIgnore: true */ this.formatURL(this.props.src,this.props.frontend))}isReadyToLoad(){return super.isReadyToLoad()&&this.props.library!=null}getTheme(e){return e}getRoot(){return this.getAttribute("isolate")==="false"?this:this.shadowRoot||this.attachShadow({mode:"open"})}getReactRootElement(){return this.reactRootElement||(this.reactRootElement=document.createElement("div"),this.getRoot().appendChild(this.reactRootElement)),this.reactRootElement}connectedCallback(){this.setAttribute("feaas-role","ui"),Array.from(this.children).forEach(e=>{this.getRoot().appendChild(e)}),document.addEventListener("feaasMount",this),document.addEventListener("feaasUnmount",this),super.connectedCallback()}disconnectedCallback(){document.removeEventListener("feaasMount",this),document.removeEventListener("feaasUnmount",this),super.disconnectedCallback()}getPortalRoot(){return this.getRoot()}render({children:e,library:r},{AppContext:i,Chakra:{Button:n,Tooltip:o},React:s}){let a={containerRef:{current:this.getPortalRoot()}};return o.defaultProps={hasArrow:!0,placement:"top",portalProps:a},s.createElement(i,{environment:this.props.environment,backend:this.props.backend,libraryId:this.props.library,container:this.getRoot(),auth:this.props.auth,getTheme:this.getTheme,onStatusChange:this.onStatusChange,modalProps:{portalProps:a},chakraProps:{resetScope:':where([feaas-role="ui"])',cssVarsRoot:":host",resetCSS:!0,toastOptions:{portalProps:a}}},e)}};j.observedAttributes=["library","component","version","revision","hostname","template"];j.register("feaas-context");j.prototype.clientside=Ht;export{st as Component,fe as ComponentProps,j as Context,S as ControlledPromise,_ as DEFAULT_CDN_URL,gt as DOM,mt as DataPath,pt as DataScope,w as DataSettings,E as Element,st as FEAASComponent,fe as FEAASComponentsProps,j as FEAASContext,Se as FEAASContextProps,lt as FEAASEditor,Ce as FEAASEditorProps,E as FEAASElement,at as FEAASLoader,me as FEAASLoaderProps,dt as FEAASPicker,xe as FEAASPickerProps,Et as FEAASStylesheet,ge as FEAASStylesheetProps,vt as InvalidResponse,m as JSONPath,at as Loader,ut as MyComponent,dt as Picker,Et as Stylesheet,wt as Thumbnail,Vt as WebComponent,Qt as adjustNumbers,Gt as autoloadScripts,tt as cleanCollectionBit,De as clearFetchCache,he as createStylesheet,Ge as customizeDataSettings,rt as fetchAndRevalidate,z as fetchAndRevalidateComponent,bt as fetchAndRevalidateStylesheet,yt as fetchBypassingCache,et as fetchCache,$e as fetchComponent,jt as fetchData,it as fetchToValidateCache,U as fetchWithCacheAwareness,ce as findStylesheet,qe as getComponent,Me as getComponentSource,Lt as getComponentURL,le as getFetchCache,we as getFramePosition,Zt as getHumanizedLabel,te as getLastPathBit,Yt as getQualifier,Le as getStylesheetSource,ot as getStylesheetURL,Z as loadScript,At as loadStylesheet,$t as loadStylesheetAllowStale,ft as normalizeCollectionScope,qt as observeDOMElement,nt as parseComponentSource,Kt as parseLimit,Xt as parseRange,B as parseStylesheetSource,H as queryObject,Ot as queryObjectRaw,Q as queryScopes,Je as registerComponent,Ve as registerDatasource,Ft as renderComponent,je as renderComponentElement,ue as renderComponentPromise,F as renderDOMContent,R as renderDOMElement,se as renderHTMLContent,Fe as renderStylesheet,de as renderStylesheetPromise,$ as serializeCH1RichText,D as setDOMAttribute};
74
+ `,s.contentWindow.document.head.appendChild(c),s.contentWindow.document.head.appendChild(f);let u=Ft({template:r,data:i});u.classList.add(...t,"-feaas--preview","-emulate--"+e.details.slug),s.contentWindow.document.body.appendChild(u)})}async function Ee(t,e,r){let i=e?e.getThumbnailURL():t.getThumbnailURL(),n=new Date(Math.max(Number(t.modifiedAt),Number(t.library.stylesheet.modifiedAt)));try{await t.sdk.uploadBlob("thumbnails",i.split(/\/thumbnails\//)[1],r,{headers:{"x-ms-blob-content-type":"image/jpg","x-ms-blob-cache-control":"public,max-age=31536000,immutable","x-ms-meta-versionId":e?e.id:null,"x-ms-meta-versionRevision":e?e.revision.toString():null,"x-ms-meta-componentId":t.id,"x-ms-meta-componentRenderedAt":n.toUTCString(),"x-ms-meta-componentModifiedAt":t.modifiedAt.toUTCString(),"x-ms-meta-componentCreatedAt":t.createdAt.toUTCString(),"x-ms-meta-modifiedAt":t.modifiedAt.toUTCString()}}),fetch(i,{cache:"no-cache"}).then(()=>{t.sdk.log("FEAAS: Thumbnail uploaded",i)})}catch(o){t.sdk.log("FEAAS: Thumbnail failed to upload",i,o)}return i}import{registerDatasource as Ve,registerComponent as Je,getComponent as qe,customizeDataSettings as Ge}from"@sitecore/byoc";var Wt;typeof window!="undefined"&&(window.FEAASReactElement=W,(Wt=window.FEAASLoading)!==null&&Wt!==void 0||(window.FEAASLoading=Promise.resolve()));function we(t){let e=[];if(t){let r=t.ownerDocument.defaultView,i,n;for(;r!==window.top;){i=r.parent;for(let o=0;o<i.frames.length;o++)if(i.frames[o]===r){for(let s of i.document.getElementsByTagName("iframe"))if(s.contentWindow===r){n=s.getBoundingClientRect();let a=s.contentWindow.getComputedStyle(s);e.push({left:n.left+parseInt(a.borderLeftWidth),top:n.top+parseInt(a.borderTopWidth)})}r=i;break}}}return e.reduce((r,i)=>({left:r.left+i.left,top:r.top+i.top}),{left:0,top:0})}function Ce(t){var e;return{context:HTMLElement,frontend:t==null?void 0:t.getContextAttribute("frontend"),src:(e=t==null?void 0:t.getAttribute("src"))!==null&&e!==void 0?e:"/editor.js",library:t==null?void 0:t.getAttribute("library"),component:t==null?void 0:t.getAttribute("component"),version:t==null?void 0:t.getAttribute("version"),instance:t==null?void 0:t.getAttribute("instance"),forked:t==null?void 0:t.getAttribute("forked"),revision:(t==null?void 0:t.getAttribute("revision"))||"saved",hidden:(t==null?void 0:t.getAttribute("hidden"))!=null,for:t==null?void 0:t.getAttribute("for"),state:(t==null?void 0:t.getAttribute("state"))||"idle",changed:(t==null?void 0:t.getAttribute("changed"))!=null}}var lt=class extends E{constructor(){super(...arguments),this.framePoint={top:0,left:0},this.wrapperRect={top:0,left:0,width:0,height:0},this.bodyRect={top:0,left:0,width:0,height:0},this.defaultProps={hidden:!1},this.setTarget=(e,r={component:e.getAttribute("component"),version:e.getAttribute("version"),revision:e.getAttribute("revision"),instance:e.getAttribute("instance")})=>{if(!this.closing&&(!this.target||e==null))return this.set(r),this.target=e,!0},this.onChromeMeasureElement=(e,r=e.getBoundingClientRect())=>e.ownerDocument==document?{left:r.left-this.bodyRect.left,top:r.top-this.bodyRect.top,width:r.width,height:r.height}:{left:r.left+this.framePoint.left-this.bodyRect.left,top:r.top+this.framePoint.top-this.bodyRect.top,width:r.width,height:r.height},this.onBeforeMeasure=e=>{e.memoized.focusable&&(this.framePoint=we(e.memoized.focusable)),this.chrome&&(this.wrapperRect=this.chrome.positionable.getBoundingClientRect(),this.bodyRect=this.chrome.positionable.ownerDocument.body.parentElement.getBoundingClientRect())},this.onMeasure=()=>{},this.onPosition=({focusable:e,root:r})=>{!this.chrome||this.props.hidden||(e?(this.chrome.wrapper.style.width=e.width+16*2+"px",this.chrome.wrapper.style.height=e.height+16*1+64+"px",this.chrome.wrapper.style.left=e.left-16+"px",this.chrome.wrapper.style.top=e.top-64+"px",this.chrome.wrapper.style.opacity="1",this.chrome.absolute=this.querySelector(".ui.overlays"),this.chrome.absolute&&(this.chrome.absolute.style.left=r.left+"px",this.chrome.absolute.style.top=r.top+"px")):(this.chrome.wrapper.style.opacity="0",this.chrome.wrapper.style.left="-1000px",this.chrome.wrapper.style.top="-1000px"))},this.onWindowMessage=e=>{var r;switch((r=e.data)===null||r===void 0?void 0:r.type){case"feaasEdit":let i=this.getPlaceholder();this.setTarget(i.editable,e.data)&&(this.loader=i.loader,document.body.appendChild(i.clipper),this.editedUID=e.data.id,this.setPlaceholder(),this.open());break;case"feaasMeasurements":this.measurements=e.data.measurements,this.props.hidden||this.setPlaceholder();break}},this.onContentChange=()=>{this.setAttribute("changed","changed"),requestAnimationFrame(()=>{this.setIframeComponentContent()})},this.onClose=()=>{var e;this.setAttribute("hidden","hidden"),this.placeholder&&(this.placeholder.positionable.style.opacity="0",this.placeholder.positionable.style.pointerEvents="none"),this.chrome&&(this.chrome.wrapper.style.opacity="0"),!((e=this.target)===null||e===void 0)&&e.parentNode&&(this.target.outerHTML=this.target.outerHTML),this.setTarget(null,{component:null,version:null,instance:null,revision:null}),this.setEditorContext({isFocused:!1})},this.onVersionStateChange=(e,r)=>{this.versionContext=e,this.setVersionContext=r},this.onEditorStateChange=(e,r)=>{this.editorContext=e,this.setEditorContext=r,e.editor&&this.props.state=="loading"&&!this.props.hidden&&(this.setAttribute("state","ready"),this.ownerDocument.fonts.ready.then(()=>setTimeout(()=>{this.setReadyState(),this.setIframeComponentContent()},100)))}}getProps(){return Ce(this)}getReactRootElement(){return this.reactRootElement||(this.reactRootElement=document.createElement("div"),this.getRoot().appendChild(this.reactRootElement)),this.reactRootElement}showLoader(){this.loader||(this.loader=document.createElement("feaas-loader"),this.loader.setAttribute("opacity","0.6"),this.loader.style.zIndex="1000",this.target.appendChild(this.loader),this.target.tagName=="FEAAS-COMPONENT"&&(this.target.style.position="relative"))}hideLoader(){this.loader&&(this.loader.setAttribute("hidden","hidden"),this.target.tagName=="FEAAS-COMPONENT"&&(this.target.style.position="relative",this.target.style.position=""))}load(){return import( /*@vite-ignore*/ /* webpackIgnore: true */ this.formatURL(this.props.src,this.props.frontend))}connectedCallback(){super.connectedCallback(),window.addEventListener("message",this.onWindowMessage)}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener("message",this.onWindowMessage)}setIframe(e){this.iframe=e}setIframeComponentContent(){this.placeholder&&this.iframe&&this.placeholder.editable.innerHTML&&this.iframe.contentWindow.postMessage({type:"feaasUpdate",id:this.editedUID,content:this.placeholder.editable.innerHTML})}setPlaceholder(){if(!this.iframe)return;let e=this.iframe.clientWidth,r=this.iframe.clientHeight,i=this.iframe.getBoundingClientRect(),n=this.getPlaceholder(),o=document.body.getBoundingClientRect(),s=this.measurements[this.editedUID];s&&(Object.assign(n.clipper.style,{position:"absolute",top:i.top+this.iframe.clientTop-o.top+"px",left:i.left+this.iframe.clientLeft-o.left+"px",width:e+"px",height:r+"px",pointerEvents:"none",zIndex:1,overflow:"hidden"}),Object.assign(n.positionable.style,{position:"absolute",top:s.top+"px",left:s.left+"px",width:s.width+"px",zIndex:2,transition:"opacity 0.4s",pointerEvents:this.props.hidden?"none":"all"}),Object.assign(n.loader.style,{position:"absolute",top:s.top+"px",left:s.left+"px",width:s.width+"px",height:s.height+"px",filter:"opacity(0.6)",zIndex:3,pointerEvents:"none"}),document.dispatchEvent(new Event("feaasRefresh",{bubbles:!0})))}getPlaceholder(){return this.placeholder?this.placeholder:(this.placeholder={clipper:document.createElement("div"),positionable:document.createElement("div"),editable:Object.assign(document.createElement("div"),{className:"-feaas"}),loader:document.createElement("feaas-loader")},this.placeholder.clipper.appendChild(this.placeholder.positionable),this.placeholder.positionable.appendChild(this.placeholder.editable),this.placeholder.clipper.appendChild(this.placeholder.loader),this.placeholder)}attributeChangedCallback(e,r,i){r!==i&&(e=="hidden"&&(this.style.setProperty("display","block","important"),this.style.setProperty("transition","opacity 0.3s","important"),i?(this.style.setProperty("opacity","0","important"),this.style.pointerEvents="none"):(this.style.setProperty("opacity","1","important"),this.style.pointerEvents="all")),super.attributeChangedCallback(e,r,i))}open(){clearTimeout(this.closing),this.removeAttribute("hidden"),this.removeAttribute("changed"),this.setLoadingState()}shouldFork(e){return e.forkOriginId==null&&this.props.instance!=null}cleanup(){var e;this.placeholder&&((e=this.placeholder.clipper)===null||e===void 0||e.remove(),this.placeholder=null)}close(){console.log("Editor is not ready")}unfork(){console.log("Editor is not ready")}discard(){console.log("Editor is not ready")}save(){console.log("Editor is not ready")}setVersionContext(e){console.log("Editor is not ready")}setEditorContext(e){console.log("Editor is not ready")}setLoadingState(){this.showLoader(),this.setAttribute("state","loading")}setReadyState(){this.hideLoader(),this.setEditorContext({activeVersionId:this.component.versions[0].id}),this.setAttribute("state","ready")}render({children:e,component:r,version:i,instance:n},{Editor:o,VersionStatusList:s,VersionStatusButton:a,Version:l,VersionMenu:d,EditorUIUndo:c,EditorUIMode:f,React:{useEffect:u,useMemo:h,useState:p,useContext:b},Chakra:{HStack:y,Box:A,Button:N,MenuItem:ct},Chrome:Ct,ReactDOM:Bt,useSDK:xt,useLibrary:St,useSlots:I,useModelObserver:Rt,ConfirmationContext:kt,VersionContext:J}){if(!this.payload)return;let{React:g}=this.payload,ht=xt(),q=St(),[v,T]=p(),{setConfirm:P}=b(kt),G=n||i;v&&(this.component=v),u(()=>{if(this.props.hidden)return;let C=q.components.getItem(r).clone();return C.versions.search({ids:[i,n].filter(Boolean),componentIds:[r]}).then(M=>{C.versions.setItems(M);let k=C.findVersion(n,["staged","published"]),X=C.findVersion(i,["staged","published"]);if(k)k.deletedAt?(k.getDraft().changeAndNotify(X.toProperties()).restore(),console.error("FEAAS Editor: Restoring fork")):(console.error("FEAAS Editor: Pre-forked"),this.setAttribute("forked",k.id));else if(this.removeAttribute("forked"),this.shouldFork(X)){console.error("FEAAS Editor: Forking");let _t=X.fork(n).id;this.setAttribute("instance",_t)}else console.error("FEAAS Editor: Regular");T(C)}),()=>{this.closing=setTimeout(()=>{this.closing=null,this.cleanup(),T(null)},400)}},[i,this.props.hidden]);let zt=Rt(v==null?void 0:v.versions,[]).filter(C=>C.id==G),K=zt[0];K&&!this.props.hidden&&(this.version=K),u(()=>(this.unfork=()=>{P({title:"Reverting component customizations",button:"Discard",body:"Are you sure to reset component to its original state? All changes will be lost.",action:()=>{let C=v.findVersion(i,["staged","published"]);v.findVersion(n).unstage().unpublish().changeAndNotify(C.toProperties()),v.saveVersions(!1),this.setVersionContext({needsWrite:!0}),this.removeAttribute("forked"),requestAnimationFrame(this.onClose)}})},this.discard=()=>{this.props.changed&&(v.findVersion(G).revert(),v.saveVersions(!1),this.setVersionContext({needsWrite:!0}))},this.close=()=>{P({title:"Component has unsaved changes",button:"Discard",body:"Are you sure to close editor and discard changes?",bypass:!this.props.changed,action:()=>{this.discard(),requestAnimationFrame(this.onClose)}})},this.save=()=>{P({bypass:!!this.props.forked,title:"Customizing component",button:"Save",body:"Changes to the component will only be visible on that page. Changes to component done in Component Builder will not be reflected here. It will be possible to revert the customization.",action:()=>{var C,M;(M=(C=v.findVersion(G).commitData({view:this.editorContext.editor.getData({rootName:G}),model:""}))===null||C===void 0?void 0:C.stage())===null||M===void 0||M.publish(),this.removeAttribute("changed"),this.setAttribute("forked",G),v.saveVersions(!1)}})},()=>{delete this.unfork,delete this.discard,delete this.save,delete this.editorContext,delete this.versionContext,delete this.setEditorContext,delete this.setVersionContext}),[v]);let Re=h(()=>this.target,[v]);return h(()=>v&&I(e,({picker:C,children:M})=>g.createElement(A,{ref:k=>{this.chrome=k?{positionable:k,wrapper:k.querySelector(".editor-chrome"),absolute:this.querySelector(".ui.overlays")}:null}},g.createElement(A,{className:"editor-wrapper",position:"absolute",left:0,top:0},g.createElement(o,{datasources:ht.datasources,sdk:ht,library:q,component:v,versions:zt,context:{isAutosaveEnabled:!1,onChromeMeasure:this.onMeasure,onChromeBeforeMeasure:this.onBeforeMeasure,onChromeMeasureElement:this.onChromeMeasureElement,onChromePosition:this.onPosition,onContentChange:this.onContentChange}},{exports:this.onEditorStateChange,after:M,chrome:({editor:k})=>k&&g.createElement(Ct,null),children:({isArchivedDisplayed:k,editor:X,status:_t})=>g.createElement(A,{position:"absolute",left:0,top:0,className:"editor-chrome",p:4,boxShadow:"2xl",pointerEvents:"none",opacity:0,transition:"opacity 0.3s"},g.createElement(A,{left:0,width:"4",top:0,bottom:0,backdropFilter:"blur(2px)",background:"rgb(244 244 244 / 80%)",position:"absolute"}),g.createElement(A,{right:0,width:"4",top:0,bottom:0,backdropFilter:"blur(2px)",background:"rgb(244 244 244 / 80%)",position:"absolute"}),g.createElement(A,{top:0,height:"16",left:0,right:0,backdropFilter:"blur(2px)",background:"rgb(244 244 244 / 80%)",position:"absolute"}),g.createElement(A,{bottom:0,height:"4",left:0,right:0,backdropFilter:"blur(2px)",background:"rgb(244 244 244 / 80%)",position:"absolute"}),K&&g.createElement(l,{version:K,node:Re,ignoreBreakpoints:!0,deps:[this.props.forked,this.props.changed]},{exports:this.onVersionStateChange,left:g.createElement(y,{justifyContent:"space-between"},g.createElement(c,{size:"sm",editor:_t=="ready"?X:null}),g.createElement(f,{size:"sm"})),middle:(Ke,Xe)=>[!1],right:g.createElement(g.Fragment,null,g.createElement(N,{variant:"secondary",size:"sm",onClick:this.close},"Close"),g.createElement(N,{variant:"primary",size:"sm",onClick:this.save,isDisabled:!this.props.changed},this.props.changed?this.props.forked?"Save":"Save customization":"Up to date"),g.createElement(d,{isDisabled:!this.props.forked&&!this.props.changed},g.createElement(ct,{onClick:this.unfork,isDisabled:!this.props.forked},"Unfork"),g.createElement(ct,{onClick:this.discard,isDisabled:!this.props.changed},"Discard")))}))})))),[K,this.props.forked,this.props.changed])}isReadyToLoad(){return this.props.component!=null&&this.props.version!=null&&!this.props.hidden}};lt.observedAttributes=["library","component","version","revision","hidden","state","changed","forked"];lt.register("feaas-editor");function xe(t){var e,r;return{part:(t==null?void 0:t.getAttribute("part"))||"picker",slot:(t==null?void 0:t.getAttribute("part"))||"picker",mode:t==null?void 0:t.getAttribute("mode"),dialog:t==null?void 0:t.getAttribute("dialog"),placeholder:(t==null?void 0:t.getAttribute("placeholder"))||"No theme",frontend:(e=t==null?void 0:t.getContextAttribute("frontend"))!==null&&e!==void 0?e:"https://components.sitecorecloud.io",src:(r=t==null?void 0:t.getAttribute("src"))!==null&&r!==void 0?r:"/picker.js",hidden:(t==null?void 0:t.getAttribute("hidden"))!=null,variant:t==null?void 0:t.getAttribute("variant"),context:void 0,onClose:void 0,setAttribute:void 0,getAttribute:void 0}}var dt=class extends E{constructor(){super(...arguments),this.defaultProps={hidden:!1}}getProps(){return xe(this)}load(){return this.import( /*@vite-ignore*/ /* webpackIgnore: true */ this.formatURL(this.props.src,this.props.frontend))}connectedCallback(){this.setAttribute("feaas-role","ui"),super.connectedCallback()}render({placeholder:e,context:r,mode:i,dialog:n,children:o,variant:s},{Picker:a,React:l,useContext:d,EnvironmentContext:c,useLibrary:f,useSDK:u,BYOC:h}){var p,b,y;let[A,N]=l.useReducer(v=>v+1,0),ct=u(),Ct=d(c),Bt=f("collections"),xt=f("components"),St=u("datasources"),I=f(),Rt=((b=(p=I.stylesheets)===null||p===void 0?void 0:p.first)===null||b===void 0?void 0:b.rules)||((y=I==null?void 0:I.stylesheet)===null||y===void 0?void 0:y.styles),kt=u("renderingHost.expandedComponents");var J=r==null?void 0:r.getAttribute("data");if(J)try{J=JSON.parse(J)}catch(v){}if(r)var g=ct.ExternalComponent.getDefinition(r),ht=g&&!g.getConfiguration(r),q=(g==null?void 0:g.type)=="feaas"?xt.find(v=>v.id==r.getAttribute("component")):h==null?void 0:h.getComponent(String(r.getAttribute("data-external-id")));return l.createElement(a,{cdn:Ct.cdn,rules:Rt,collections:Bt,themeContext:r,placeholder:e,embed:q,externalComponents:kt,datasources:St,data:J,versionId:r==null?void 0:r.getAttribute("version"),mode:i||(ht?"library":q?"context":null),setAttribute:(v,T,P)=>{T=="data"&&P&&(P=JSON.stringify(P)),this.props.setAttribute(v,T,P),N()},getAttribute:(v,T)=>r==null?void 0:r.getAttribute(T),dialog:n,context:r,variant:s,onModeChange:(v,T)=>{this.set({mode:v,dialog:T})}},o)}};dt.observedAttributes=["library","mode","frontend","src","hidden","variant","dialog"];dt.register("feaas-picker");function Se(t){var e,r,i,n,o;return{library:t==null?void 0:t.getAttribute("library"),src:(e=t==null?void 0:t.getAttribute("src"))!==null&&e!==void 0?e:"/context.js",environment:(r=t==null?void 0:t.getAttribute("environment"))!==null&&r!==void 0?r:void 0,frontend:(i=t==null?void 0:t.getAttribute("frontend"))!==null&&i!==void 0?i:"https://components.sitecorecloud.io",backend:(n=t==null?void 0:t.getAttribute("backend"))!==null&&n!==void 0?n:"https://components.sitecorecloud.io/api",cdn:(o=t==null?void 0:t.getAttribute("cdn"))!==null&&o!==void 0?o:"https://feaas.blob.core.windows.net",auth:null,isolate:(t==null?void 0:t.getAttribute("isolate"))==null||(t==null?void 0:t.getAttribute("isolate"))=="true"}}var j=class extends E{constructor(){super(...arguments),this.defaultProps={isolate:!0},this.onStatusChange=(e,r)=>{e=="ready"&&(this.whenSDKReady.resolve(r),this.dispatchEvent(new CustomEvent("feaasReady",{bubbles:!0,composed:!0,detail:r})))},this.whenSDKReady=S(e=>{this.sdk=e})}getProps(){return Se(this)}load(){return this.import( /*@vite-ignore*/ /* webpackIgnore: true */ this.formatURL(this.props.src,this.props.frontend))}isReadyToLoad(){return super.isReadyToLoad()&&this.props.library!=null}getTheme(e){return e}getRoot(){return this.getAttribute("isolate")==="false"?this:this.shadowRoot||this.attachShadow({mode:"open"})}getReactRootElement(){return this.reactRootElement||(this.reactRootElement=document.createElement("div"),this.getRoot().appendChild(this.reactRootElement)),this.reactRootElement}connectedCallback(){this.setAttribute("feaas-role","ui"),Array.from(this.children).forEach(e=>{this.getRoot().appendChild(e)}),document.addEventListener("feaasMount",this),document.addEventListener("feaasUnmount",this),super.connectedCallback()}disconnectedCallback(){document.removeEventListener("feaasMount",this),document.removeEventListener("feaasUnmount",this),super.disconnectedCallback()}getPortalRoot(){return this.getRoot()}render({children:e,library:r},{AppContext:i,Chakra:{Button:n,Tooltip:o},React:s}){let a={containerRef:{current:this.getPortalRoot()}};return o.defaultProps={hasArrow:!0,placement:"top",portalProps:a},s.createElement(i,{environment:this.props.environment,backend:this.props.backend,libraryId:this.props.library,container:this.getRoot(),auth:this.props.auth,getTheme:this.getTheme,onStatusChange:this.onStatusChange,modalProps:{portalProps:a},chakraProps:{resetScope:':where([feaas-role="ui"])',cssVarsRoot:":host",resetCSS:!0,toastOptions:{portalProps:a}}},e)}};j.observedAttributes=["library","component","version","revision","hostname","template"];j.register("feaas-context");j.prototype.clientside=Ht;export{st as Component,fe as ComponentProps,j as Context,S as ControlledPromise,_ as DEFAULT_CDN_URL,gt as DOM,mt as DataPath,pt as DataScope,w as DataSettings,E as Element,st as FEAASComponent,fe as FEAASComponentsProps,j as FEAASContext,Se as FEAASContextProps,lt as FEAASEditor,Ce as FEAASEditorProps,E as FEAASElement,at as FEAASLoader,me as FEAASLoaderProps,dt as FEAASPicker,xe as FEAASPickerProps,Et as FEAASStylesheet,ge as FEAASStylesheetProps,vt as InvalidResponse,m as JSONPath,at as Loader,ut as MyComponent,dt as Picker,Et as Stylesheet,wt as Thumbnail,Vt as WebComponent,Qt as adjustNumbers,Gt as autoloadScripts,tt as cleanCollectionBit,De as clearFetchCache,he as createStylesheet,Ge as customizeDataSettings,rt as fetchAndRevalidate,z as fetchAndRevalidateComponent,bt as fetchAndRevalidateStylesheet,yt as fetchBypassingCache,et as fetchCache,$e as fetchComponent,jt as fetchData,it as fetchToValidateCache,U as fetchWithCacheAwareness,ce as findStylesheet,qe as getComponent,Me as getComponentSource,Lt as getComponentURL,le as getFetchCache,we as getFramePosition,Zt as getHumanizedLabel,te as getLastPathBit,Yt as getQualifier,Le as getStylesheetSource,ot as getStylesheetURL,Z as loadScript,At as loadStylesheet,$t as loadStylesheetAllowStale,ft as normalizeCollectionScope,qt as observeDOMElement,nt as parseComponentSource,Kt as parseLimit,Xt as parseRange,B as parseStylesheetSource,H as queryObject,Ot as queryObjectRaw,Q as queryScopes,Je as registerComponent,Ve as registerDatasource,Ft as renderComponent,je as renderComponentElement,ue as renderComponentPromise,F as renderDOMContent,R as renderDOMElement,se as renderHTMLContent,Fe as renderStylesheet,de as renderStylesheetPromise,$ as serializeCH1RichText,D as setDOMAttribute};
75
75
  //# sourceMappingURL=index.esm.js.map