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