@sitecore-feaas/clientside 0.1.49 → 0.1.50

package/dist/browser/react.esm.js

@@ -65,5 +65,5 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
         style="animation: 1.5s linear 0s infinite normal none running loader-circular-track"
       ></circle>
     </svg>
-  </div>`,this.getRoot().appendChild(this.stylesheet),this.getRoot().appendChild(this.loader)}update(){this.loader.style.opacity=String(this.props.opacity)}};it.observedAttributes=["hidden","opacity"];it.register("feaas-loader");function Ae(t=this){var e,r,n,i;let o=t.getAttribute("src");if(o)var{cdn:s,library:a,revision:l}=At(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:(i=(n=t==null?void 0:t.getContextAttribute("cdn"))!==null&&n!==void 0?n:t==null?void 0:t.getContextAttribute("hostname"))!==null&&i!==void 0?i:k}}var wt=class extends b{constructor(){super(...arguments),this.onLoad=e=>{this.payload=e,this.advance()}}getProps(){return Ae(this)}isReadyToLoad(){return this.props.library!=null&&this.props.revision!=null&&this.props.cdn!=null}load(){return Ct(this.props,this.onLoad)}};wt.register("feaas-stylesheet");import xe from"react";import Ce from"react-dom";function St(t){let e=/[A-Z\u00C0-\u00D6\u00D8-\u00DE]/g;return t.replace(e,function(r){return"-"+r.toLowerCase()})}function Vt(t){let e=/-[a-z\u00E0-\u00F6\u00F8-\u00FE]/g;return t.replace(e,function(r){return r.slice(1).toUpperCase()})}var we=t=>{if(!t)return;let e,r;return t.properties&&(e=Object.keys(t.properties).reduce((n,i)=>(n[St(i)]=t.properties[i],n),{}),r=t.required.map(n=>St(n))),{...t,properties:e,required:r}};function Se(t=this){return t.getAttributeNames().reduce((n,i)=>!i.startsWith("data-attribute")&&!["class","id","contenteditable"].includes(i)?{...n,[Vt(i)]:t.getAttribute(i)}:n,{})}var _FEAASExternal=class extends b{load(){return Promise.resolve({React:xe,ReactDOM:Ce})}render(t,{React:e}){var r;let{dataExternalId:n}=t,i=(r=_FEAASExternal.registered[n])===null||r===void 0?void 0:r.component;return i||console.warn("FEAASExternal: The component you requested is not registered"),e.createElement(e.Fragment,null,i&&e.createElement(i,{...t}))}getProps(){return Se(this)}static registerComponent(t,e={},r){_FEAASExternal.registered[r||t.name]={component:t,schema:e}}static setRegistrationCallback(){_FEAASExternal.registrationCallback||(_FEAASExternal.registrationCallback=setTimeout(()=>{let t=Object.keys(_FEAASExternal.registered).map(e=>({..._FEAASExternal.registered[e],name:e,schema:we(_FEAASExternal.registered[e].schema),component:_FEAASExternal.registered[e].component.toString()}));window.parent.postMessage(JSON.stringify({action:"register-components",data:t}),"*")},500))}static loadComponents(){let components=JSON.parse(sessionStorage.getItem("feaas-external-components"));components.forEach(c=>{let name=c.name,schema=c.schema,component=eval("("+c.component+")");_FEAASExternal.registerComponent(component,schema,name)})}};_FEAASExternal.registered={};_FEAASExternal.register("feaas-external");_FEAASExternal.setRegistrationCallback();var Rt;typeof window!="undefined"&&(window.FEAASElement=$,(Rt=window.FEAASLoading)!==null&&Rt!==void 0||(window.FEAASLoading=Promise.resolve()));function Re(t){let e=[];if(t){let r=t.ownerDocument.defaultView,n,i;for(;r!==window.top;){n=r.parent;for(let o=0;o<n.frames.length;o++)if(n.frames[o]===r){for(let s of n.document.getElementsByTagName("iframe"))if(s.contentWindow===r){i=s.getBoundingClientRect();let a=s.contentWindow.getComputedStyle(s);e.push({left:i.left+parseInt(a.borderLeftWidth),top:i.top+parseInt(a.borderTopWidth)})}r=n;break}}}return e.reduce((r,n)=>({left:r.left+n.left,top:r.top+n.top}),{left:0,top:0})}function _e(t=this){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 ot=class extends b{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=Re(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 n=this.getPlaceholder();this.setTarget(n.editable,e.data)&&(this.loader=n.loader,document.body.appendChild(n.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 _e(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,n=this.iframe.getBoundingClientRect(),i=this.getPlaceholder(),o=document.body.getBoundingClientRect(),s=this.measurements[this.editedUID];s&&(Object.assign(i.clipper.style,{position:"absolute",top:n.top+this.iframe.clientTop-o.top+"px",left:n.left+this.iframe.clientLeft-o.left+"px",width:e+"px",height:r+"px",pointerEvents:"none",zIndex:1,overflow:"hidden"}),Object.assign(i.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(i.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,n){r!==n&&(e=="hidden"&&(this.style.setProperty("display","block","important"),this.style.setProperty("transition","opacity 0.3s","important"),n?(this.style.setProperty("opacity","0","important"),this.style.pointerEvents="none"):(this.style.setProperty("opacity","1","important"),this.style.pointerEvents="all")),super.attributeChangedCallback(e,r,n))}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:n,instance:i},{Editor:o,VersionStatusList:s,VersionStatusButton:a,Version:l,VersionMenu:d,EditorUIUndo:u,EditorUIMode:f,React:{useEffect:h,useMemo:m,useState:x,useContext:g},Chakra:{HStack:C,Box:E,Button:Y,MenuItem:D},Chrome:X,ReactDOM:_t,useSDK:_,useSlots:M,useModelObserver:O,ConfirmationContext:lt,VersionContext:Z}){if(!this.payload)return;let{React:p}=this.payload,{sdk:L}=_(),[y,Ft]=x(),{setConfirm:ut}=g(lt),j=i||n,qt=L.library;y&&(this.component=y),h(()=>{if(this.props.hidden)return;let S=qt.components.getItem(r).clone();return S.versions.search({ids:[n,i].filter(Boolean),componentIds:[r]}).then(ct=>{S.versions.setItems(ct);let w=S.findVersion(i,["staged","published"]),H=S.findVersion(n,["staged","published"]);if(w)w.deletedAt?(w.getDraft().changeAndNotify(H.toProperties()).restore(),console.error("FEAAS Editor: Restoring fork")):(console.error("FEAAS Editor: Pre-forked"),this.setAttribute("forked",w.id));else if(this.removeAttribute("forked"),this.shouldFork(H)){console.error("FEAAS Editor: Forking");let dt=H.fork(i).id;this.setAttribute("instance",dt)}else console.error("FEAAS Editor: Regular");Ft(S)}),()=>{this.closing=setTimeout(()=>{this.closing=null,this.cleanup(),Ft(null)},400)}},[n,this.props.hidden]);let kt=O(y==null?void 0:y.versions,[]).filter(S=>S.id==j),U=kt[0];U&&!this.props.hidden&&(this.version=U),h(()=>(this.unfork=()=>{ut({title:"Reverting component customizations",button:"Discard",body:"Are you sure to reset component to its original state? All changes will be lost.",action:()=>{let S=y.findVersion(n,["staged","published"]);y.findVersion(i).unstage().unpublish().changeAndNotify(S.toProperties()),y.saveVersions(!1),this.setVersionContext({needsWrite:!0}),this.removeAttribute("forked"),requestAnimationFrame(this.onClose)}})},this.discard=()=>{this.props.changed&&(y.findVersion(j).revert(),y.saveVersions(!1),this.setVersionContext({needsWrite:!0}))},this.close=()=>{ut({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=()=>{ut({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:()=>{y.findVersion(j).commitData({view:this.editorContext.editor.getData({rootName:j}),model:""}).stage().publish(),this.removeAttribute("changed"),this.setAttribute("forked",j),y.saveVersions(!1)}})},()=>{delete this.unfork,delete this.discard,delete this.save,delete this.editorContext,delete this.versionContext,delete this.setEditorContext,delete this.setVersionContext}),[y]);let Jt=m(()=>this.target,[y]);return m(()=>y&&M(e,({picker:S,children:ct})=>p.createElement(E,{ref:w=>{this.chrome=w?{positionable:w,wrapper:w.querySelector(".editor-chrome"),absolute:this.querySelector(".ui.overlays")}:null}},p.createElement(E,{className:"editor-wrapper",position:"absolute",left:0,top:0},p.createElement(o,{datasources:L.datasources,sdk:L,library:L.library,component:y,versions:kt,context:{isAutosaveEnabled:!1,onChromeMeasure:this.onMeasure,onChromeBeforeMeasure:this.onBeforeMeasure,onChromeMeasureElement:this.onChromeMeasureElement,onChromePosition:this.onPosition,onContentChange:this.onContentChange}},{exports:this.onEditorStateChange,after:ct,chrome:({editor:w})=>w&&p.createElement(X,null),children:({isArchivedDisplayed:w,editor:H,status:dt})=>p.createElement(E,{position:"absolute",left:0,top:0,className:"editor-chrome",p:4,boxShadow:"2xl",pointerEvents:"none",opacity:0,transition:"opacity 0.3s"},p.createElement(E,{left:0,width:"4",top:0,bottom:0,backdropFilter:"blur(2px)",background:"rgb(244 244 244 / 80%)",position:"absolute"}),p.createElement(E,{right:0,width:"4",top:0,bottom:0,backdropFilter:"blur(2px)",background:"rgb(244 244 244 / 80%)",position:"absolute"}),p.createElement(E,{top:0,height:"16",left:0,right:0,backdropFilter:"blur(2px)",background:"rgb(244 244 244 / 80%)",position:"absolute"}),p.createElement(E,{bottom:0,height:"4",left:0,right:0,backdropFilter:"blur(2px)",background:"rgb(244 244 244 / 80%)",position:"absolute"}),U&&p.createElement(l,{version:U,node:Jt,ignoreBreakpoints:!0,deps:[this.props.forked,this.props.changed]},{exports:this.onVersionStateChange,left:p.createElement(C,{justifyContent:"space-between"},p.createElement(u,{size:"sm",editor:dt=="ready"?H:null}),p.createElement(f,{size:"sm"})),middle:(Oe,Ne)=>[!1],right:p.createElement(p.Fragment,null,p.createElement(Y,{variant:"secondary",size:"sm",onClick:this.close},"Close"),p.createElement(Y,{variant:"primary",size:"sm",onClick:this.save,isDisabled:!this.props.changed},this.props.changed?this.props.forked?"Save":"Save customization":"Up to date"),p.createElement(d,{isDisabled:!this.props.forked&&!this.props.changed},p.createElement(D,{onClick:this.unfork,isDisabled:!this.props.forked},"Unfork"),p.createElement(D,{onClick:this.discard,isDisabled:!this.props.changed},"Discard")))}))})))),[U,this.props.forked,this.props.changed])}isReadyToLoad(){return this.props.component!=null&&this.props.version!=null&&!this.props.hidden}};ot.observedAttributes=["library","component","version","revision","hidden","state","changed","forked"];ot.register("feaas-editor");function Fe(t=this){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"),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,onContextAttributeSet:void 0}}var st=class extends b{constructor(){super(...arguments),this.defaultProps={hidden:!1}}getProps(){return Fe(this)}load(){return this.import( /*@vite-ignore*/ /* webpackIgnore: true */ this.formatURL(this.props.src,this.props.frontend))}render({placeholder:e,context:r,mode:n,children:i,variant:o},{Picker:s,React:a,ReactDOM:l}){return a.createElement(s,{placeholder:e,mode:n||void 0,onClose:this.props.onClose,onContextAttributeSet:this.props.onContextAttributeSet,context:r,variant:o},i)}};st.observedAttributes=["library","mode","frontend","src","hidden","variant"];st.register("feaas-picker");function ke(t=this){var e,r,n,i;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",frontend:(r=t==null?void 0:t.getAttribute("frontend"))!==null&&r!==void 0?r:"https://components.sitecoreclud.io",backend:(n=t==null?void 0:t.getAttribute("backend"))!==null&&n!==void 0?n:"https://components.sitecoreclud.io/api",cdn:(i=t==null?void 0:t.getAttribute("cdn"))!==null&&i!==void 0?i:"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 at=class extends b{constructor(){super(...arguments),this.defaultProps={isolate:!0},this.onStatusChange=e=>{e=="ready"&&this.dispatchEvent(new Event("feaasReady",{bubbles:!0,composed:!0}))}}getProps(){return ke(this)}load(){return this.import( /*@vite-ignore*/ /* webpackIgnore: true */ this.formatURL(this.props.src,this.props.frontend))}isReadyToLoad(){return console.log("Is ready?",this.props,super.isReadyToLoad()&&this.props.library!=null),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(){Array.from(this.children).forEach(e=>{this.getRoot().appendChild(e)}),super.connectedCallback()}render({children:e,library:r},{AppContext:n,Chakra:{Button:i,Tooltip:o},React:s}){let a={containerRef:{current:this.getRoot()}};return o.defaultProps={hasArrow:!0,placement:"top",portalProps:a},s.createElement(n,{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:{cssVarsRoot:":host",resetCSS:!0,toastOptions:{portalProps:a}}},e)}};at.observedAttributes=["library","component","version","revision","hostname","template"];at.register("feaas-context");import Pe from"react";function De({data:t,...e}){if("template"in e&&typeof e.template=="string")var r=$t(e.template,t||{});return"src"in e&&(e={...I(e.src),...e}),Pe.createElement("feaas-component",{...e,template:null,data:typeof t=="string"?t:t?JSON.stringify(t):null,dangerouslySetInnerHTML:{__html:r||""}})}var sn=De;export{b as Base,sn as Component,ye as ComponentProps,k as DEFAULT_CDN_URL,_FEAASExternal as External,b as FEAASBase,nt as FEAASComponent,ye as FEAASComponentsProps,at as FEAASContext,ke as FEAASContextProps,ot as FEAASEditor,_e as FEAASEditorProps,De as FEAASEmbed,Se as FEAASExternalProps,it as FEAASLoader,Ee as FEAASLoaderProps,st as FEAASPicker,Fe as FEAASPickerProps,wt as FEAASStylesheet,Ae as FEAASStylesheetProps,v as JSONPath,it as Loader,ht as MyComponent,wt as Stylesheet,he as autoloadScripts,le as cleanCollectionBit,Ze as clearFetchCache,be as createStylesheet,Ht as fetchAndRevalidate,G as fetchAndRevalidateComponent,xt as fetchAndRevalidateStylesheet,Et as fetchBypassingCache,tt as fetchCache,nr as fetchComponent,et as fetchToValidateCache,B as fetchWithCacheAwareness,ve as findStylesheet,er as getComponentSource,Wt as getComponentURL,fe as getFetchCache,Re as getFramePosition,rr as getStylesheetSource,rt as getStylesheetURL,Q as loadScript,Ct as loadStylesheet,zt as loadStylesheetAllowStale,Mt as normalizeCollectionScope,de as observeDOMElement,I as parseComponentSource,At as parseStylesheetSource,bt as queryScopes,dr as renderComponent,cr as renderComponentElement,ge as renderComponentPromise,K as renderDOMContent,F as renderDOMElement,$t as renderHTMLContent,sr as renderStylesheet,me as renderStylesheetPromise,q as serializeCH1RichText,J as setDOMAttribute};
+  </div>`,this.getRoot().appendChild(this.stylesheet),this.getRoot().appendChild(this.loader)}update(){this.loader.style.opacity=String(this.props.opacity)}};it.observedAttributes=["hidden","opacity"];it.register("feaas-loader");function Ae(t=this){var e,r,n,i;let o=t.getAttribute("src");if(o)var{cdn:s,library:a,revision:l}=At(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:(i=(n=t==null?void 0:t.getContextAttribute("cdn"))!==null&&n!==void 0?n:t==null?void 0:t.getContextAttribute("hostname"))!==null&&i!==void 0?i:k}}var wt=class extends b{constructor(){super(...arguments),this.onLoad=e=>{this.payload=e,this.advance()}}getProps(){return Ae(this)}isReadyToLoad(){return this.props.library!=null&&this.props.revision!=null&&this.props.cdn!=null}load(){return Ct(this.props,this.onLoad)}};wt.register("feaas-stylesheet");var St;typeof window!="undefined"&&(window.FEAASElement=$,(St=window.FEAASLoading)!==null&&St!==void 0||(window.FEAASLoading=Promise.resolve()));function xe(t){let e=[];if(t){let r=t.ownerDocument.defaultView,n,i;for(;r!==window.top;){n=r.parent;for(let o=0;o<n.frames.length;o++)if(n.frames[o]===r){for(let s of n.document.getElementsByTagName("iframe"))if(s.contentWindow===r){i=s.getBoundingClientRect();let a=s.contentWindow.getComputedStyle(s);e.push({left:i.left+parseInt(a.borderLeftWidth),top:i.top+parseInt(a.borderTopWidth)})}r=n;break}}}return e.reduce((r,n)=>({left:r.left+n.left,top:r.top+n.top}),{left:0,top:0})}function Ce(t=this){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 ot=class extends b{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=xe(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 n=this.getPlaceholder();this.setTarget(n.editable,e.data)&&(this.loader=n.loader,document.body.appendChild(n.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,n=this.iframe.getBoundingClientRect(),i=this.getPlaceholder(),o=document.body.getBoundingClientRect(),s=this.measurements[this.editedUID];s&&(Object.assign(i.clipper.style,{position:"absolute",top:n.top+this.iframe.clientTop-o.top+"px",left:n.left+this.iframe.clientLeft-o.left+"px",width:e+"px",height:r+"px",pointerEvents:"none",zIndex:1,overflow:"hidden"}),Object.assign(i.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(i.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,n){r!==n&&(e=="hidden"&&(this.style.setProperty("display","block","important"),this.style.setProperty("transition","opacity 0.3s","important"),n?(this.style.setProperty("opacity","0","important"),this.style.pointerEvents="none"):(this.style.setProperty("opacity","1","important"),this.style.pointerEvents="all")),super.attributeChangedCallback(e,r,n))}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:n,instance:i},{Editor:o,VersionStatusList:s,VersionStatusButton:a,Version:l,VersionMenu:d,EditorUIUndo:u,EditorUIMode:f,React:{useEffect:h,useMemo:m,useState:x,useContext:g},Chakra:{HStack:C,Box:E,Button:Y,MenuItem:D},Chrome:X,ReactDOM:_t,useSDK:_,useSlots:M,useModelObserver:O,ConfirmationContext:lt,VersionContext:Z}){if(!this.payload)return;let{React:p}=this.payload,{sdk:L}=_(),[y,Ft]=x(),{setConfirm:ut}=g(lt),j=i||n,qt=L.library;y&&(this.component=y),h(()=>{if(this.props.hidden)return;let S=qt.components.getItem(r).clone();return S.versions.search({ids:[n,i].filter(Boolean),componentIds:[r]}).then(ct=>{S.versions.setItems(ct);let w=S.findVersion(i,["staged","published"]),H=S.findVersion(n,["staged","published"]);if(w)w.deletedAt?(w.getDraft().changeAndNotify(H.toProperties()).restore(),console.error("FEAAS Editor: Restoring fork")):(console.error("FEAAS Editor: Pre-forked"),this.setAttribute("forked",w.id));else if(this.removeAttribute("forked"),this.shouldFork(H)){console.error("FEAAS Editor: Forking");let dt=H.fork(i).id;this.setAttribute("instance",dt)}else console.error("FEAAS Editor: Regular");Ft(S)}),()=>{this.closing=setTimeout(()=>{this.closing=null,this.cleanup(),Ft(null)},400)}},[n,this.props.hidden]);let kt=O(y==null?void 0:y.versions,[]).filter(S=>S.id==j),U=kt[0];U&&!this.props.hidden&&(this.version=U),h(()=>(this.unfork=()=>{ut({title:"Reverting component customizations",button:"Discard",body:"Are you sure to reset component to its original state? All changes will be lost.",action:()=>{let S=y.findVersion(n,["staged","published"]);y.findVersion(i).unstage().unpublish().changeAndNotify(S.toProperties()),y.saveVersions(!1),this.setVersionContext({needsWrite:!0}),this.removeAttribute("forked"),requestAnimationFrame(this.onClose)}})},this.discard=()=>{this.props.changed&&(y.findVersion(j).revert(),y.saveVersions(!1),this.setVersionContext({needsWrite:!0}))},this.close=()=>{ut({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=()=>{ut({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:()=>{y.findVersion(j).commitData({view:this.editorContext.editor.getData({rootName:j}),model:""}).stage().publish(),this.removeAttribute("changed"),this.setAttribute("forked",j),y.saveVersions(!1)}})},()=>{delete this.unfork,delete this.discard,delete this.save,delete this.editorContext,delete this.versionContext,delete this.setEditorContext,delete this.setVersionContext}),[y]);let Jt=m(()=>this.target,[y]);return m(()=>y&&M(e,({picker:S,children:ct})=>p.createElement(E,{ref:w=>{this.chrome=w?{positionable:w,wrapper:w.querySelector(".editor-chrome"),absolute:this.querySelector(".ui.overlays")}:null}},p.createElement(E,{className:"editor-wrapper",position:"absolute",left:0,top:0},p.createElement(o,{datasources:L.datasources,sdk:L,library:L.library,component:y,versions:kt,context:{isAutosaveEnabled:!1,onChromeMeasure:this.onMeasure,onChromeBeforeMeasure:this.onBeforeMeasure,onChromeMeasureElement:this.onChromeMeasureElement,onChromePosition:this.onPosition,onContentChange:this.onContentChange}},{exports:this.onEditorStateChange,after:ct,chrome:({editor:w})=>w&&p.createElement(X,null),children:({isArchivedDisplayed:w,editor:H,status:dt})=>p.createElement(E,{position:"absolute",left:0,top:0,className:"editor-chrome",p:4,boxShadow:"2xl",pointerEvents:"none",opacity:0,transition:"opacity 0.3s"},p.createElement(E,{left:0,width:"4",top:0,bottom:0,backdropFilter:"blur(2px)",background:"rgb(244 244 244 / 80%)",position:"absolute"}),p.createElement(E,{right:0,width:"4",top:0,bottom:0,backdropFilter:"blur(2px)",background:"rgb(244 244 244 / 80%)",position:"absolute"}),p.createElement(E,{top:0,height:"16",left:0,right:0,backdropFilter:"blur(2px)",background:"rgb(244 244 244 / 80%)",position:"absolute"}),p.createElement(E,{bottom:0,height:"4",left:0,right:0,backdropFilter:"blur(2px)",background:"rgb(244 244 244 / 80%)",position:"absolute"}),U&&p.createElement(l,{version:U,node:Jt,ignoreBreakpoints:!0,deps:[this.props.forked,this.props.changed]},{exports:this.onVersionStateChange,left:p.createElement(C,{justifyContent:"space-between"},p.createElement(u,{size:"sm",editor:dt=="ready"?H:null}),p.createElement(f,{size:"sm"})),middle:(Oe,Ne)=>[!1],right:p.createElement(p.Fragment,null,p.createElement(Y,{variant:"secondary",size:"sm",onClick:this.close},"Close"),p.createElement(Y,{variant:"primary",size:"sm",onClick:this.save,isDisabled:!this.props.changed},this.props.changed?this.props.forked?"Save":"Save customization":"Up to date"),p.createElement(d,{isDisabled:!this.props.forked&&!this.props.changed},p.createElement(D,{onClick:this.unfork,isDisabled:!this.props.forked},"Unfork"),p.createElement(D,{onClick:this.discard,isDisabled:!this.props.changed},"Discard")))}))})))),[U,this.props.forked,this.props.changed])}isReadyToLoad(){return this.props.component!=null&&this.props.version!=null&&!this.props.hidden}};ot.observedAttributes=["library","component","version","revision","hidden","state","changed","forked"];ot.register("feaas-editor");function we(t=this){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"),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,onContextAttributeSet:void 0}}var st=class extends b{constructor(){super(...arguments),this.defaultProps={hidden:!1}}getProps(){return we(this)}load(){return this.import( /*@vite-ignore*/ /* webpackIgnore: true */ this.formatURL(this.props.src,this.props.frontend))}render({placeholder:e,context:r,mode:n,children:i,variant:o},{Picker:s,React:a,ReactDOM:l}){return a.createElement(s,{placeholder:e,mode:n||void 0,onClose:this.props.onClose,onContextAttributeSet:this.props.onContextAttributeSet,context:r,variant:o},i)}};st.observedAttributes=["library","mode","frontend","src","hidden","variant"];st.register("feaas-picker");function Se(t=this){var e,r,n,i;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",frontend:(r=t==null?void 0:t.getAttribute("frontend"))!==null&&r!==void 0?r:"https://components.sitecoreclud.io",backend:(n=t==null?void 0:t.getAttribute("backend"))!==null&&n!==void 0?n:"https://components.sitecoreclud.io/api",cdn:(i=t==null?void 0:t.getAttribute("cdn"))!==null&&i!==void 0?i:"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 at=class extends b{constructor(){super(...arguments),this.defaultProps={isolate:!0},this.onStatusChange=e=>{e=="ready"&&this.dispatchEvent(new Event("feaasReady",{bubbles:!0,composed:!0}))}}getProps(){return Se(this)}load(){return this.import( /*@vite-ignore*/ /* webpackIgnore: true */ this.formatURL(this.props.src,this.props.frontend))}isReadyToLoad(){return console.log("Is ready?",this.props,super.isReadyToLoad()&&this.props.library!=null),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(){Array.from(this.children).forEach(e=>{this.getRoot().appendChild(e)}),super.connectedCallback()}render({children:e,library:r},{AppContext:n,Chakra:{Button:i,Tooltip:o},React:s}){let a={containerRef:{current:this.getRoot()}};return o.defaultProps={hasArrow:!0,placement:"top",portalProps:a},s.createElement(n,{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:{cssVarsRoot:":host",resetCSS:!0,toastOptions:{portalProps:a}}},e)}};at.observedAttributes=["library","component","version","revision","hostname","template"];at.register("feaas-context");import Pe from"react";import Re from"react";import _e from"react-dom";function Rt(t){let e=/[A-Z\u00C0-\u00D6\u00D8-\u00DE]/g;return t.replace(e,function(r){return"-"+r.toLowerCase()})}function Vt(t){let e=/-[a-z\u00E0-\u00F6\u00F8-\u00FE]/g;return t.replace(e,function(r){return r.slice(1).toUpperCase()})}var Fe=t=>{if(!t)return;let e,r;return t.properties&&(e=Object.keys(t.properties).reduce((n,i)=>(n[Rt(i)]=t.properties[i],n),{}),r=t.required.map(n=>Rt(n))),{...t,properties:e,required:r}};function ke(t=this){return t.getAttributeNames().reduce((n,i)=>!i.startsWith("data-attribute")&&!["class","id","contenteditable"].includes(i)?{...n,[Vt(i)]:t.getAttribute(i)}:n,{})}var _FEAASExternal=class extends b{load(){return Promise.resolve({React:Re,ReactDOM:_e})}render(t,{React:e}){var r;let{dataExternalId:n}=t,i=(r=_FEAASExternal.registered[n])===null||r===void 0?void 0:r.component;return i||console.warn("FEAASExternal: The component you requested is not registered"),e.createElement(e.Fragment,null,i&&e.createElement(i,{...t}))}getProps(){return ke(this)}static registerComponent(t,e={},r){_FEAASExternal.registered[r||t.name]={component:t,schema:e}}static setRegistrationCallback(){_FEAASExternal.registrationCallback||(_FEAASExternal.registrationCallback=setTimeout(()=>{let t=Object.keys(_FEAASExternal.registered).map(e=>({..._FEAASExternal.registered[e],name:e,schema:Fe(_FEAASExternal.registered[e].schema),component:_FEAASExternal.registered[e].component.toString()}));window.parent.postMessage(JSON.stringify({action:"register-components",data:t}),"*")},500))}static loadComponents(){let components=JSON.parse(sessionStorage.getItem("feaas-external-components"));components.forEach(c=>{let name=c.name,schema=c.schema,component=eval("("+c.component+")");_FEAASExternal.registerComponent(component,schema,name)})}};_FEAASExternal.registered={};_FEAASExternal.register("feaas-external");_FEAASExternal.setRegistrationCallback();function De({data:t,...e}){if("template"in e&&typeof e.template=="string")var r=$t(e.template,t||{});return"src"in e&&(e={...I(e.src),...e}),Pe.createElement("feaas-component",{...e,template:null,data:typeof t=="string"?t:t?JSON.stringify(t):null,dangerouslySetInnerHTML:{__html:r||""}})}var on=De;export{b as Base,on as Component,ye as ComponentProps,k as DEFAULT_CDN_URL,_FEAASExternal as External,b as FEAASBase,nt as FEAASComponent,ye as FEAASComponentsProps,at as FEAASContext,Se as FEAASContextProps,ot as FEAASEditor,Ce as FEAASEditorProps,De as FEAASEmbed,it as FEAASLoader,Ee as FEAASLoaderProps,st as FEAASPicker,we as FEAASPickerProps,wt as FEAASStylesheet,Ae as FEAASStylesheetProps,v as JSONPath,it as Loader,ht as MyComponent,wt as Stylesheet,he as autoloadScripts,le as cleanCollectionBit,Ze as clearFetchCache,be as createStylesheet,Ht as fetchAndRevalidate,G as fetchAndRevalidateComponent,xt as fetchAndRevalidateStylesheet,Et as fetchBypassingCache,tt as fetchCache,nr as fetchComponent,et as fetchToValidateCache,B as fetchWithCacheAwareness,ve as findStylesheet,er as getComponentSource,Wt as getComponentURL,fe as getFetchCache,xe as getFramePosition,rr as getStylesheetSource,rt as getStylesheetURL,Q as loadScript,Ct as loadStylesheet,zt as loadStylesheetAllowStale,Mt as normalizeCollectionScope,de as observeDOMElement,I as parseComponentSource,At as parseStylesheetSource,bt as queryScopes,dr as renderComponent,cr as renderComponentElement,ge as renderComponentPromise,K as renderDOMContent,F as renderDOMElement,$t as renderHTMLContent,sr as renderStylesheet,me as renderStylesheetPromise,q as serializeCH1RichText,J as setDOMAttribute};
 //# sourceMappingURL=react.esm.js.map