Liferay.Loader.define("fragment-web@4.0.70/js/fragment-editor/FragmentPreview",["module","exports","require","@frontend-taglib-clay$clayui/button","@liferay/frontend-js-react-web","liferay!frontend-js-react-web$classnames","frontend-js-web","liferay!frontend-js-react-web$react"],(function(e,t,r){window;{Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var a=r("@frontend-taglib-clay$clayui/button"),n=r("@liferay/frontend-js-react-web"),i=function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}(r("liferay!frontend-js-react-web$classnames")),o=r("frontend-js-web"),c=function _interopRequireWildcard(e){if(e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var t=_getRequireWildcardCache();if(t&&t.has(e))return t.get(e);var r={},a=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var n in e)if(Object.prototype.hasOwnProperty.call(e,n)){var i=a?Object.getOwnPropertyDescriptor(e,n):null;i&&(i.get||i.set)?Object.defineProperty(r,n,i):r[n]=e[n]}r.default=e,t&&t.set(e,r);return r}(r("liferay!frontend-js-react-web$react"));function _getRequireWildcardCache(){if("function"!=typeof WeakMap)return null;var e=new WeakMap;return _getRequireWildcardCache=function _getRequireWildcardCache(){return e},e}const e={desktop:{height:9,width:16},"full-size":{height:"",width:""},"mobile-portrait":{height:16,width:10},"tablet-portrait":{height:3,width:4}},l=["desktop","tablet-portrait","mobile-portrait","full-size"],stopEventPropagation=e=>{e.preventDefault(),e.stopPropagation()};var _default=({configuration:t,css:r,html:s,js:d,namespace:u,urls:f={}})=>{const p=(0,c.useRef)(),h=(0,c.useRef)(),[w,g]=(0,c.useState)("full-size"),[m,b]=(0,c.useState)(!1),[y,v]=(0,c.useState)({}),_=(0,n.useIsMounted)(),j=(0,c.useCallback)((0,o.debounce)((()=>{if(!m&&_()){b(!0);const e=new FormData;e.append("".concat(u,"configuration"),t),e.append("".concat(u,"css"),btoa(r)),e.append("".concat(u,"html"),btoa(s)),e.append("".concat(u,"js"),btoa(d)),(0,o.fetch)(f.render,{body:e,method:"POST"}).then((e=>e.text())).then((e=>{_()&&b(!1),p.current.contentWindow.postMessage(JSON.stringify({data:e}),"*")}))}}),500),[t,r,s,d,p]),E=(0,c.useCallback)((0,o.debounce)((()=>{const t=e[w];if(t&&h.current){const e=h.current.getBoundingClientRect(),r=Math.min(.9*e.width/t.width,.8*e.height/t.height);v({height:t.height?"".concat(t.height*r,"px"):"",width:t.width?"".concat(t.width*r,"px"):""})}}),100),[w]),O=(0,n.usePrevious)(j),P=(0,n.usePrevious)(E);return(0,c.useEffect)((()=>{O&&O!==j&&((0,o.cancelDebounce)(O),j())}),[O,j]),(0,c.useEffect)((()=>{P&&P!==E&&((0,o.cancelDebounce)(P),E())}),[P,E]),(0,n.useEventListener)("click",stopEventPropagation,!0,p.current&&p.current.contentWindow),(0,n.useEventListener)("resize",E,!0,window),c.default.createElement("div",{className:"fragment-preview",ref:h},c.default.createElement("div",{className:"btn-group fragment-preview__toolbar"},l.map((e=>c.default.createElement(a.ClayButtonWithIcon,{borderless:!0,className:(0,i.default)({active:w===e}),displayType:"secondary",key:e,onClick:()=>g(e),size:"sm",symbol:e})))),c.default.createElement("div",{className:(0,i.default)("fragment-preview__wrapper",{"fragment-preview__wrapper--loading":m,"fragment-preview__wrapper--resized":w}),style:y},m&&c.default.createElement("div",{className:"fragment-preview__loading-indicator"},c.default.createElement("span",{"aria-hidden":"true",className:"loading-animation"})),c.default.createElement("iframe",{className:"fragment-preview__content",onLoad:j,ref:p,src:f.preview})))};t.default=_default}}));
//# sourceMappingURL=FragmentPreview.js.map