UNPKG

dext5editor-react

Version:

React component for DEXT5 Editor

5 lines (4 loc) 17.6 kB
/** * @license Copyright (c) 2003-2022, RAONWIZ DevTeam. All rights reserved. */ !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).DEXT5EditorReact={},e.React)}(this,(function(e,t){"use strict";function n(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}var r=n(t),o=function(){return o=Object.assign||function(e){for(var t,n=1,r=arguments.length;n<r;n++)for(var o in t=arguments[n])Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o]);return e},o.apply(this,arguments)};function a(e,t,n){if(n||2===arguments.length)for(var r,o=0,a=t.length;o<a;o++)!r&&o in t||(r||(r=Array.prototype.slice.call(t,0,o)),r[o]=t[o]);return e.concat(r||Array.prototype.slice.call(t))}"function"==typeof SuppressedError&&SuppressedError;var c=["loaded","creationComplete","destroy"],i=["beforeLoad","namespaceLoaded"],d=a(a([],c,!0),i,!0),u="__RDE__";function p(e){return"".concat(u).concat(e)}function f(e){return e.substr(u.length)}function s(e){var t=e.substr(0,1).toUpperCase()+e.substr(1);return"on".concat(t)}function l(e){return e.substr(2,1).toLowerCase()+e.substr(3)}var m=a(a([],c,!0),i,!0).reduce((function(e,t){var n;return o(o({},e),((n={})[t]=p(t),n))}),{});function v(e){var t=e.debug,n=e.component,r=e.evtName,o=e.handler,a=t&&Math.random().toString(36).replace(/[^a-z]+/g,"").substr(0,5),c=o;return t&&(c=function(e){return console.log({logType:"RAONWIZ Log - invoke",operation:"invoke",component:n,componentName:n.object.ID,evtName:r,handlerId:a,eventInfo:e.eventInfo}),o(e)}),t&&console.log({logType:"RAONWIZ Log - register",operation:"register",component:n,componentName:n.object.ID,evtName:r,handlerId:a}),DEXT5._ExternalAttachEvents(n.object,r,c),function(){t&&console.log({logType:"RAONWIZ Log - unregister",operation:"unregister",component:n,componentName:n.object.ID,evtName:r,handlerId:a})}}var b={};function y(e,t){e.onload=function(){this.onerror=this.onload=null,t(null,e)},e.onerror=function(){this.onerror=this.onload=null,t(new Error("Failed to load "+this.src),e)}}function E(e,t){e.onreadystatechange=function(){"complete"!=this.readyState&&"loaded"!=this.readyState||(this.onreadystatechange=null,t(null,e))}}function I(e,t,n){let r;if("string"!=typeof e||e.length<1)return Promise.reject(new TypeError("Component TYPE must be a non-empty string."));if(e in window){let t=null;switch(e){case"RAONKUPLOAD":t=RAONKUPLOAD;break;case"RAONKEDITOR":t=RAONKEDITOR;break;case"DEXT5UPLOAD":t=DEXT5UPLOAD;break;case"DEXT5":t=DEXT5}return Promise.resolve(t)}return"string"!=typeof t||t.length<1?Promise.reject(new TypeError("Component URL must be a non-empty string.")):(r||(r=I.scriptLoader(e,t).then((e=>(n&&n(e),e)))),r)}Object.defineProperty(b,"__esModule",{value:!0}),I.scriptLoader=(e,t)=>new Promise(((n,r)=>{!function(e,t,n){const r=document.head||document.getElementsByTagName("head")[0],o=document.createElement("script");"function"==typeof t&&(n=t,t={}),t=t||{},n=n||function(){},o.type=t.type||"text/javascript",o.charset=t.charset||"utf8",o.async=!("async"in t)||!!t.async,o.src=e,t.attrs&&function(e,t){for(const n in t)e.setAttribute(n,t[n])}(o,t.attrs),t.text&&(o.text=String(t.text)),("onload"in o?y:E)(o,n),o.onload||y(o,n),r.appendChild(o)}(t,(t=>{let o=null;switch(e){case"RAONKUPLOAD":o=window.RAONKUPLOAD;break;case"RAONKEDITOR":o=window.RAONKEDITOR;break;case"DEXT5UPLOAD":o=window.DEXT5UPLOAD;break;case"DEXT5":o=window.DEXT5}return t?r(t):o?void n(o):r(new Error("Script loaded from componentUrl doesn't provide Component namespace."))}))})),b.debounce=function(e,t){let n,r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};return function(){clearTimeout(n);for(var o=arguments.length,a=new Array(o),c=0;c<o;c++)a[c]=arguments[c];n=setTimeout(e.bind(r,...a),t)}};var D=b.getRaonwizComponentNamespace=I,h=r.useEffect,O=r.useReducer,g=r.useRef,T="DEXT5",j="/dext5editor/js/dext5editor.js",_={};function N(e){var t=e.debug,n=e.element,r=e.config,o=e.componentUrl,a=e.createMode,c=e.initContent,p=e.dispatchEvent,f=e.subscribeTo,s=void 0===f?d:f,l=g(o||j),b=g(a),y=g(null!=s?s:d),E=g(t),I=g(p),N=g(r||_),k=g(c),X=O(x,{component:void 0,hookStatus:"init"}),C=X[0],M=C.component,R=C.hookStatus,L=X[1];return h((function(){if(n&&!M){L({type:"loading"});D(T,l.current,(function(e){var t;-1!==y.current.indexOf("namespaceLoaded")&&(null===(t=I.current)||void 0===t||t.call(I,{type:m.namespaceLoaded,payload:e}))})).then((function(e){var r;-1!==y.current.indexOf("beforeLoad")&&(null===(r=I.current)||void 0===r||r.call(I,{type:m.beforeLoad,payload:e})),void 0===e._ExternalMakeComponent&&function(e){e._ExternalMakeComponent=function(t,n,r){void 0===DEXT5._ExternalCreationCompleteEventMap&&(DEXT5._ExternalLoadedEventMap=new Map,DEXT5._ExternalCreationCompleteEventMap=new Map,DEXT5._ExternalDestroyEventMap=new Map),DEXT5._ExternalLoadedEventMap.set(t.id,[]),DEXT5._ExternalCreationCompleteEventMap.set(t.id,[]),DEXT5._ExternalDestroyEventMap.set(t.id,[]),e._ExternalDestroy=!0;var o={EditorHolder:t.id,Id:t.id};if(o=e.util.objectExtend(!0,n,o),r&&"object"==r.toLowerCase())return{object:new Dext5editor(o),status:"ready"};for(var a=0,c=Object.entries(o);a<c.length;a++){var i=c[a],d=i[0],u=i[1];DEXT5.config[d]=u}return{object:new Dext5editor(t.id),status:"ready"}}}(e),void 0===e._ExternalSetDestroyEvent&&function(e){e._ExternalSetDestroyEvent=function(e){var t,n;"function"==typeof MutationObserver?(t=(n=document.getElementById("dext_frame_holder"+e))||document.getElementById("dext_frame_"+e))&&new MutationObserver((function(){var t=DEXT5._ExternalDestroyEventMap.get(e),n=DEXT5.getEditorByName(e);if(void 0!==t&&t.length>0)for(var r=0,o=t.length;r<o;r++)try{t[r]({eventInfo:{componentName:e,paramObj:void 0}})}catch(e){}else if(n&&void 0!==n._config&&"function"==typeof n._config.event.destroy)try{n._config.event.destroy({eventInfo:{componentName:e,paramObj:void 0}})}catch(e){}else if("function"==typeof DEXTTOP.DEXTWIN.DEXT5_Destroy)try{DEXTTOP.DEXTWIN.DEXT5_Destroy({eventInfo:{componentName:e,paramObj:void 0}})}catch(e){}})).observe(t,{childList:!0}):((n=document.getElementById("dext_frame_"+e))&&(t=n),t&&t.addEventListener("DOMNodeRemoved",(function(t){var n=DEXT5._ExternalDestroyEventMap.get(e);if(void 0!==n&&n.length>0)for(var r=0,o=n.length;r<o;r++)try{n[r]({eventInfo:{componentName:e,paramObj:void 0}})}catch(t){}else if(DEXTTOP.G_CURREDITOR&&void 0!==DEXTTOP.G_CURREDITOR._config&&"function"==typeof DEXTTOP.G_CURREDITOR._config.event.destroy)try{DEXTTOP.G_CURREDITOR._config.event.destroy({eventInfo:{componentName:e,paramObj:void 0}})}catch(t){}else if("function"==typeof DEXTTOP.DEXTWIN.DEXT5_Destroy)try{DEXTTOP.DEXTWIN.DEXT5_Destroy({eventInfo:{componentName:e,paramObj:void 0}})}catch(t){}}),!1))}}(e),void 0===e._ExternalAttachEvents&&function(e){e._ExternalAttachEvents=function(t,n,r){var o=t._config,a=r;switch(n){case"loaded":var c=DEXT5._ExternalLoadedEventMap.get(t.ID);c.push(a),DEXT5._ExternalLoadedEventMap.set(t.ID,c);break;case"creationComplete":if("function"==typeof o.event.loadedEvent)break;var i=DEXT5._ExternalCreationCompleteEventMap.get(t.ID);i.push(a),DEXT5._ExternalCreationCompleteEventMap.set(t.ID,i);var d=function(n){for(var r=DEXT5._ExternalLoadedEventMap.get(t.ID),o=0,a=r.length;o<a;o++)try{r[o]({eventInfo:{componentName:n.ID,paramObj:n}})}catch(e){}var c=DEXT5._ExternalCreationCompleteEventMap.get(t.ID);for(o=0,a=c.length;o<a;o++)try{c[o]({eventInfo:{componentName:n.ID,paramObj:n}})}catch(e){}e._ExternalSetDestroyEvent(t.ID)};o.event.loadedEvent=d;break;case"destroy":var u=DEXT5._ExternalDestroyEventMap.get(t.ID);u.push(a),DEXT5._ExternalDestroyEventMap.set(t.ID,u);break;case"afterChangeMode":o.event[n]=function(e,t,n){if(a){var r={newMode:e,currentMode:t,editorId:n};try{return a({eventInfo:{componentName:n,paramObj:r}})}catch(e){}}};break;case"afterPopupShow":o.event[n]=function(e,t,n){if(a){var r={editorId:e,targetObj:t,popupType:n};try{return a({eventInfo:{componentName:e,paramObj:r}})}catch(e){}}};break;case"applyFontStyle":o.event[n]=function(e,t){if(a){var n={editorId:e,fontStyleObject:t};try{return a({eventInfo:{componentName:e,paramObj:n}})}catch(e){}}};break;case"beforeFullScreen":o.event[n]=function(e,t){if(a){var n={editorId:e,editorFrameStatus:t};try{return a({eventInfo:{componentName:e,paramObj:n}})}catch(e){}}};break;case"beforeInsertHyperlink":o.event[n]=function(e,t){if(a){var n={editorId:e,url:t};try{return a({eventInfo:{componentName:e,paramObj:n}})}catch(e){}}};break;case"beforeInsertUrl":o.event[n]=function(e,t){if(a){var n={editorId:e,url:t};try{return a({eventInfo:{componentName:e,paramObj:n}})}catch(e){}}};break;case"beforePaste":o.event[n]=function(e){if(a){var t={pasteSource:e};try{return a({eventInfo:{paramObj:t}})}catch(e){}}};break;case"command":o.event[n]=function(e,t){if(a){var n={editorId:e,paramObject:t};try{return a({eventInfo:{componentName:e,paramObj:n}})}catch(e){}}};break;case"contentSizeChange":o.event[n]=function(e,t){if(a){var n={editorId:e,sumOfSize:t};try{return a({eventInfo:{componentName:e,paramObj:n}})}catch(e){}}};break;case"customAction":o.event[n]=function(e,t){if(a){var n={editorId:t,command:e};try{return a({eventInfo:{componentName:t,paramObj:n}})}catch(e){}}};break;case"dialogLoaded":o.event[n]=function(e,t){if(a){var n={currentPageName:e,dialogDocument:t};try{return a({eventInfo:{paramObj:n}})}catch(e){}}};break;case"drag":o.event[n]=function(e,t){if(a){var n={DragEvent:e,eventObject:t};try{return a({eventInfo:{paramObj:n}})}catch(e){}}};break;case"editorLoaded":o.event[n]=function(e){if(a){var t={editor:e};try{return a({eventInfo:{componentName:e.ID,paramObj:t}})}catch(e){}}};break;case"focus":o.event[n]=function(e,t){if(a){var n={blur:e,eventObject:t};try{return a({eventInfo:{paramObj:n}})}catch(e){}}};break;case"focusInEditorWhole":o.event[n]=function(e,t){if(a){var n={eventType:e,editorId:t};try{return a({eventInfo:{componentName:t,paramObj:n}})}catch(e){}}};break;case"frameLoaded":o.event[n]=function(e,t,n){if(a){var r={editorId:e,config:t,frame:n};try{return a({eventInfo:{componentName:e,paramObj:r}})}catch(e){}}};break;case"fullScreen":o.event[n]=function(e,t){if(a){var n={editorId:e,editorFrameStatus:t};try{return a({eventInfo:{componentName:e,paramObj:n}})}catch(e){}}};break;case"input":o.event[n]=function(e,t,n,r){if(a){var o={inputStr:e,eventObject:t,currElem:n,editorId:r};try{return a({eventInfo:{componentName:r,paramObj:o}})}catch(e){}}};break;case"insertEmoticon":o.event[n]=function(e,t){if(a){var n={editorId:e,eventObject:t};try{return a({eventInfo:{componentName:e,paramObj:n}})}catch(e){}}};break;case"key":o.event[n]=function(e,t,n,r){if(a){var o={keyEvent:e,eventObject:t,currElem:n,editorId:r};try{return a({eventInfo:{componentName:r,paramObj:o}})}catch(e){}}};break;case"languageDefinition":o.event[n]=function(e,t){if(a){var n={editorLang:e,editorId:t};try{return a({eventInfo:{componentName:t,paramObj:n}})}catch(e){}}};break;case"loadedEvent":o.event[n]=function(e){if(a){var t={editor:e};try{return a({eventInfo:{componentName:e.ID,paramObj:t}})}catch(e){}}};break;case"managerImg":o.event[n]=function(e,t){if(a){var n={element:e,editorId:t};try{return a({eventInfo:{componentName:t,paramObj:n}})}catch(e){}}};break;case"managerInput":o.event[n]=function(e,t){if(a){var n={element:e,editorId:t};try{return a({eventInfo:{componentName:t,paramObj:n}})}catch(e){}}};break;case"managerSelect":o.event[n]=function(e,t){if(a){var n={element:e,editorId:t};try{return a({eventInfo:{componentName:t,paramObj:n}})}catch(e){}}};break;case"managerTextArea":o.event[n]=function(e,t){if(a){var n={element:e,editorId:t};try{return a({eventInfo:{componentName:t,paramObj:n}})}catch(e){}}};break;case"mouse":o.event[n]=function(e,t,n){if(a){var r={mouseEvent:e,eventObject:t,currElem:n};try{return a({eventInfo:{paramObj:r}})}catch(e){}}};break;case"onError":o.event[n]=function(e,t,n){if(a){var r={editorId:e,codemessage:t,response:n};try{return a({eventInfo:{componentName:e,paramObj:r}})}catch(e){}}};break;case"pasteImage":o.event[n]=function(e){if(a){var t={HTMLCollection:e};try{return a({eventInfo:{paramObj:t}})}catch(e){}}};break;case"resized":o.event[n]=function(e){if(a){var t={editor:e};try{return a({eventInfo:{componentName:e.ID,paramObj:t}})}catch(e){}}};break;case"setComplete":o.event[n]=function(e){if(a){var t={editorId:e};try{return a({eventInfo:{componentName:e,paramObj:t}})}catch(e){}}};break;case"setForbiddenWordComplete":o.event[n]=function(e,t){if(a){var n={editorId:e,paramObject:t};try{return a({eventInfo:{componentName:e,paramObj:n}})}catch(e){}}};break;case"setInsertComplete":o.event[n]=function(e){if(a){var t={editorId:e};try{return a({eventInfo:{componentName:e,paramObj:t}})}catch(e){}}};break;default:var p=function(e,t){if(a)try{return a({eventInfo:{componentName:e,paramObj:t}})}catch(e){}};o.event[n]=p}}}(e),t&&console.log({logType:"RAONWIZ Log - initComponent",operation:"makeComponent config",configRef:N.current,componentName:n.id});var o=e._ExternalMakeComponent(n,N.current,b.current);y.current.filter((function(e){return-1===i.indexOf(e)})).forEach((function(e){v({debug:E.current,component:o,evtName:e,handler:function(t){var n;return null===(n=I.current)||void 0===n?void 0:n.call(I,{type:"".concat(u).concat(e),payload:t})}})})),v({debug:E.current,component:o,evtName:"loaded",handler:function(){L({type:"loaded"})}}),v({debug:E.current,component:o,evtName:"creationComplete",handler:function(e){L({type:"ready"}),k.current&&DEXT5.SetHtmlContentsEw(k.current,o.object.ID)}}),v({debug:E.current,component:o,evtName:"destroy",handler:function(){L({type:"destroyed"})}}),L({type:"unloaded",payload:o})})).catch((function(e){console.error(e),L({type:"error"})}))}return function(){M&&M.object&&M.object.ID&&null===document.getElementById(M.object.ID)&&DEXT5&&(DEXT5._ExternalLoadedEventMap.has(M.object.ID)&&DEXT5._ExternalLoadedEventMap.delete(M.object.ID),DEXT5._ExternalCreationCompleteEventMap.has(M.object.ID)&&DEXT5._ExternalCreationCompleteEventMap.delete(M.object.ID),DEXT5._ExternalDestroyEventMap.has(M.object.ID)&&DEXT5._ExternalDestroyEventMap.delete(M.object.ID),DEXT5.Destroy(M.object.ID))}}),[M,n]),{component:M,status:null==M?void 0:M.status,error:"error"===R,loading:"loading"===R}}function x(e,t){switch(t.type){case"init":return o(o({},e),{hookStatus:"init"});case"loading":return o(o({},e),{hookStatus:"loading"});case"unloaded":return{component:t.payload,hookStatus:"unloaded"};case"loaded":return o(o({},e),{hookStatus:"loaded"});case"ready":return o(o({},e),{hookStatus:"ready"});case"destroyed":return{component:void 0,hookStatus:"destroyed"};case"error":return{component:void 0,hookStatus:"error"};default:return e}}var k,X,C,M,R={exports:{}};R.exports=function(){if(M)return C;M=1;var e=X?k:(X=1,k="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");function t(){}function n(){}return n.resetWarningCache=t,C=function(){function r(t,n,r,o,a,c){if(c!==e){var i=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw i.name="Invariant Violation",i}}function o(){return r}r.isRequired=r;var a={array:r,bigint:r,bool:r,func:r,number:r,object:r,string:r,symbol:r,any:r,arrayOf:o,element:r,elementType:r,instanceOf:o,node:r,objectOf:o,oneOf:o,oneOfType:o,shape:o,exact:o,checkPropTypes:n,resetWarningCache:t};return a.PropTypes=a,a}}()();var L=r.useEffect,S=r.useRef,w=r.useState;function P(e){var t=e.debug,n=e.id,o=void 0===n?"dext5editor_"+Math.random().toString(36).replace(/[^a-z]+/g,"").substr(0,5):n,a=e.config,c=void 0===a?{}:a,i=e.componentUrl,d=e.createMode,u=e.initData,p=e.readOnly,m=function(e,t){var n={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&t.indexOf(r)<0&&(n[r]=e[r]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(r=Object.getOwnPropertySymbols(e);o<r.length;o++)t.indexOf(r[o])<0&&Object.prototype.propertyIsEnumerable.call(e,r[o])&&(n[r[o]]=e[r[o]])}return n}(e,["debug","id","config","componentUrl","createMode","initData","readOnly"]),v=w(null),b=v[0],y=v[1],E=S(m),I=N({debug:t,element:b,config:c,componentUrl:i,createMode:d,initContent:"string"==typeof u?u:void 0,dispatchEvent:function(e){var t=e.type,n=e.payload,r=s(f(t)),o=E.current[r];if(o)return o(n)},subscribeTo:Object.keys(m).filter((function(e){return 0===e.indexOf("on")})).map(l)}),D=I.component,h=I.status;return L((function(){if(D&&"ready"===h&&"boolean"==typeof p){var e=DEXT5.IsLoadedEditorEx(D.object.ID);t&&console.log({logType:"RAONWIZ Log - useEffect",operation:"useEffect",component:D,componentName:D.object.ID,readOnly:p,status:h,IsLoadedComponentEx:e}),e&&DEXT5.SetReadOnly(p,"",D.object.ID)}}),[D,h,p]),r.createElement("div",{id:null!=o?o:void 0,ref:y})}var A=o({config:R.exports.object,debug:R.exports.bool,componentUrl:R.exports.string,createMode:R.exports.string,id:R.exports.string,initData:R.exports.node,readOnly:R.exports.bool},d.reduce((function(e,t){var n;return o(o({},e),((n={})[s(t)]=R.exports.func,n))}),{}));P.propTypes=A,e.ComponentEventAction=m,e.DEXT5Editor=P,e.prefixEventName=p,e.registerComponentEventHandler=v,e.stripPrefix=f,e.useDEXT5Editor=N,Object.defineProperty(e,"__esModule",{value:!0})}));