@topol.io/editor-react 0.2.1 → 1.0.0-alpha.0
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.
- package/LICENSE +1 -1
- package/dist/topol-editor-react.es.js +631 -414
- package/dist/topol-editor-react.umd.js +11 -11
- package/dist/types/{src/TopolEditor.d.ts → EmailEditor.d.ts} +7 -8
- package/dist/types/LandingPageEditor.d.ts +37 -0
- package/dist/types/TopolEditor.d.ts +3 -0
- package/dist/types/entry.d.ts +48 -0
- package/dist/types/types.d.ts +19 -0
- package/package.json +15 -6
- package/dist/types/types/IReactTopolOptions.d.ts +0 -2
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
(function(
|
|
1
|
+
(function(P,m){typeof exports=="object"&&typeof module<"u"?m(exports,require("react")):typeof define=="function"&&define.amd?define(["exports","react"],m):(P=typeof globalThis<"u"?globalThis:P||self,m(P["topol-editor-react"]={},P.React))})(this,function(P,m){"use strict";function Ae(t){return t&&t.__esModule&&Object.prototype.hasOwnProperty.call(t,"default")?t.default:t}var Oe=function(t,d,g){var s=document.head||document.getElementsByTagName("head")[0],u=document.createElement("script");typeof d=="function"&&(g=d,d={}),d=d||{},g=g||function(){},u.type=d.type||"text/javascript",u.charset=d.charset||"utf8",u.async="async"in d?!!d.async:!0,u.src=t,d.attrs&&je(u,d.attrs),d.text&&(u.text=""+d.text);var E="onload"in u?$:xe;E(u,g),u.onload||$(u,g),s.appendChild(u)};function je(t,d){for(var g in d)t.setAttribute(g,d[g])}function $(t,d){t.onload=function(){this.onerror=this.onload=null,d(null,t)},t.onerror=function(){this.onerror=this.onload=null,d(new Error("Failed to load "+this.src),t)}}function xe(t,d){t.onreadystatechange=function(){this.readyState!="complete"&&this.readyState!="loaded"||(this.onreadystatechange=null,d(null,t))}}const Y=Ae(Oe);var I={};const O={production:I.VITE_TOPOL_URL,dev:I.VITE_TOPOL_DEV_URL,staging:I.VITE_TOPOL_STAGING_URL},Ne="https://d10h8ga60f7b91.cloudfront.net/preview-app-{stage}/loader/build.js";function Be(t="production"){switch(t){case"dev":return O.dev;case"staging":return O.staging;case"production":return O.production;default:return Ne.replace("{stage}",String(t))}}async function Me(t){return new Promise((d,g)=>{Y(O.production,s=>{if(s!==null){g(s);return}window.TopolPlugin.init(t),d(!0)})})}const M={init:(t,d)=>new Promise((g,s)=>{const u=Be(d==null?void 0:d.stage);Y(u,async E=>{if(E!==null){if(u!==O.production)try{return await Me(t),g(!0)}catch(v){s(v)}s(E);return}window.TopolPlugin.init(t),g(!0)})}),save:()=>{window.TopolPlugin.save()},load:t=>{window.TopolPlugin.load(t)},togglePreview:()=>{window.TopolPlugin.togglePreview()},togglePreviewSize:()=>{window.TopolPlugin.togglePreviewSize()},chooseFile:t=>{window.TopolPlugin.chooseFile(t)},undo:()=>{window.TopolPlugin.undo()},redo:()=>{window.TopolPlugin.redo()},destroy:()=>{window.TopolPlugin.destroy()},setSavedBlocks:t=>{window.TopolPlugin.setSavedBlocks(t)},setPreviewHTML:t=>{window.TopolPlugin.setPreviewHTML(t)},createNotification:t=>{window.TopolPlugin.createNotification(t)},setActiveMembers:t=>{window.TopolPlugin.setActiveMembers(t)},changeEmailToMobile:()=>{window.TopolPlugin.changeEmailToMobile()},changeEmailToDesktop:()=>{window.TopolPlugin.changeEmailToDesktop()},toggleBlocksAndStructuresVisibility:()=>{window.TopolPlugin.toggleBlocksAndStructuresVisibility()},updateCustomBlockContent:t=>{window.TopolPlugin.updateCustomBlockContent(t)},refreshComments:t=>{window.TopolPlugin.refreshComments(t)},refreshSyncedRows:()=>{window.TopolPlugin.refreshSyncedRows()},openPremadeTemplatesSelection:()=>{window.TopolPlugin.openPremadeTemplatesSelection()},updateApiAuthorizationHeader:t=>{window.TopolPlugin.updateApiAuthorizationHeader(t)},setTemplateName:t=>{window.TopolPlugin.setTemplateName(t)},toggleChatAI:()=>{window.TopolPlugin.toggleChatAI()},toggleAutosaves:()=>{window.TopolPlugin.toggleAutosaves()},toggleComments:()=>{window.TopolPlugin.toggleComments()},createLanguage:t=>{window.TopolPlugin.createLanguage(t)},setPrimaryLanguage:t=>{window.TopolPlugin.setPrimaryLanguage(t)},deleteLanguage:t=>{window.TopolPlugin.deleteLanguage(t)},selectLanguage:t=>{window.TopolPlugin.selectLanguage(t)}},Le="https://v1.page-assets.topol.io/topol-lpe.js",ee={init:(t,d)=>new Promise((g,s)=>{Y(Le,u=>{if(u!==null){s(u);return}const E=window.LandingPageEditor(t);g(E)})})},ze=M;var L={exports:{}},j={};/**
|
|
2
2
|
* @license React
|
|
3
3
|
* react-jsx-runtime.production.js
|
|
4
4
|
*
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
*
|
|
7
7
|
* This source code is licensed under the MIT license found in the
|
|
8
8
|
* LICENSE file in the root directory of this source tree.
|
|
9
|
-
*/var
|
|
9
|
+
*/var oe;function Ye(){if(oe)return j;oe=1;var t=Symbol.for("react.transitional.element"),d=Symbol.for("react.fragment");function g(s,u,E){var v=null;if(E!==void 0&&(v=""+E),u.key!==void 0&&(v=""+u.key),"key"in u){E={};for(var w in u)w!=="key"&&(E[w]=u[w])}else E=u;return u=E.ref,{$$typeof:t,type:s,key:v,ref:u!==void 0?u:null,props:E}}return j.Fragment=d,j.jsx=g,j.jsxs=g,j}var x={};/**
|
|
10
10
|
* @license React
|
|
11
11
|
* react-jsx-runtime.development.js
|
|
12
12
|
*
|
|
@@ -14,18 +14,18 @@
|
|
|
14
14
|
*
|
|
15
15
|
* This source code is licensed under the MIT license found in the
|
|
16
16
|
* LICENSE file in the root directory of this source tree.
|
|
17
|
-
*/var
|
|
18
|
-
at`)?" (<anonymous>)":-1<
|
|
19
|
-
`+
|
|
20
|
-
`),
|
|
21
|
-
`);for(
|
|
22
|
-
`+
|
|
17
|
+
*/var ne;function Ie(){return ne||(ne=1,process.env.NODE_ENV!=="production"&&function(){function t(e){if(e==null)return null;if(typeof e=="function")return e.$$typeof===Xe?null:e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case H:return"Fragment";case Ge:return"Portal";case fe:return"Profiler";case de:return"StrictMode";case G:return"Suspense";case J:return"SuspenseList"}if(typeof e=="object")switch(typeof e.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),e.$$typeof){case ve:return(e.displayName||"Context")+".Provider";case ge:return(e._context.displayName||"Context")+".Consumer";case F:var r=e.render;return e=e.displayName,e||(e=r.displayName||r.name||"",e=e!==""?"ForwardRef("+e+")":"ForwardRef"),e;case X:return r=e.displayName||null,r!==null?r:t(e.type)||"Memo";case D:r=e._payload,e=e._init;try{return t(e(r))}catch{}}return null}function d(e){return""+e}function g(e){try{d(e);var r=!1}catch{r=!0}if(r){r=console;var a=r.error,f=typeof Symbol=="function"&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return a.call(r,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",f),d(e)}}function s(){}function u(){if(N===0){me=console.log,we=console.info,Te=console.warn,he=console.error,be=console.group,Pe=console.groupCollapsed,Ce=console.groupEnd;var e={configurable:!0,enumerable:!0,value:s,writable:!0};Object.defineProperties(console,{info:e,log:e,warn:e,error:e,group:e,groupCollapsed:e,groupEnd:e})}N++}function E(){if(N--,N===0){var e={configurable:!0,enumerable:!0,writable:!0};Object.defineProperties(console,{log:k({},e,{value:me}),info:k({},e,{value:we}),warn:k({},e,{value:Te}),error:k({},e,{value:he}),group:k({},e,{value:be}),groupCollapsed:k({},e,{value:Pe}),groupEnd:k({},e,{value:Ce})})}0>N&&console.error("disabledDepth fell below zero. This is a bug in React. Please file an issue.")}function v(e){if(Q===void 0)try{throw Error()}catch(a){var r=a.stack.trim().match(/\n( *(at )?)/);Q=r&&r[1]||"",ye=-1<a.stack.indexOf(`
|
|
18
|
+
at`)?" (<anonymous>)":-1<a.stack.indexOf("@")?"@unknown:0:0":""}return`
|
|
19
|
+
`+Q+e+ye}function w(e,r){if(!e||K)return"";var a=q.get(e);if(a!==void 0)return a;K=!0,a=Error.prepareStackTrace,Error.prepareStackTrace=void 0;var f=null;f=S.H,S.H=null,u();try{var h={DetermineComponentFrameRoot:function(){try{if(r){var R=function(){throw Error()};if(Object.defineProperty(R.prototype,"props",{set:function(){throw Error()}}),typeof Reflect=="object"&&Reflect.construct){try{Reflect.construct(R,[])}catch(y){var z=y}Reflect.construct(e,[],R)}else{try{R.call()}catch(y){z=y}e.call(R.prototype)}}else{try{throw Error()}catch(y){z=y}(R=e())&&typeof R.catch=="function"&&R.catch(function(){})}}catch(y){if(y&&z&&typeof y.stack=="string")return[y.stack,z.stack]}return[null,null]}};h.DetermineComponentFrameRoot.displayName="DetermineComponentFrameRoot";var p=Object.getOwnPropertyDescriptor(h.DetermineComponentFrameRoot,"name");p&&p.configurable&&Object.defineProperty(h.DetermineComponentFrameRoot,"name",{value:"DetermineComponentFrameRoot"});var c=h.DetermineComponentFrameRoot(),C=c[0],A=c[1];if(C&&A){var b=C.split(`
|
|
20
|
+
`),_=A.split(`
|
|
21
|
+
`);for(c=p=0;p<b.length&&!b[p].includes("DetermineComponentFrameRoot");)p++;for(;c<_.length&&!_[c].includes("DetermineComponentFrameRoot");)c++;if(p===b.length||c===_.length)for(p=b.length-1,c=_.length-1;1<=p&&0<=c&&b[p]!==_[c];)c--;for(;1<=p&&0<=c;p--,c--)if(b[p]!==_[c]){if(p!==1||c!==1)do if(p--,c--,0>c||b[p]!==_[c]){var B=`
|
|
22
|
+
`+b[p].replace(" at new "," at ");return e.displayName&&B.includes("<anonymous>")&&(B=B.replace("<anonymous>",e.displayName)),typeof e=="function"&&q.set(e,B),B}while(1<=p&&0<=c);break}}}finally{K=!1,S.H=f,E(),Error.prepareStackTrace=a}return b=(b=e?e.displayName||e.name:"")?v(b):"",typeof e=="function"&&q.set(e,b),b}function l(e){if(e==null)return"";if(typeof e=="function"){var r=e.prototype;return w(e,!(!r||!r.isReactComponent))}if(typeof e=="string")return v(e);switch(e){case G:return v("Suspense");case J:return v("SuspenseList")}if(typeof e=="object")switch(e.$$typeof){case F:return e=w(e.render,!1),e;case X:return l(e.type);case D:r=e._payload,e=e._init;try{return l(e(r))}catch{}}return""}function o(){var e=S.A;return e===null?null:e.getOwner()}function n(e){if(pe.call(e,"key")){var r=Object.getOwnPropertyDescriptor(e,"key").get;if(r&&r.isReactWarning)return!1}return e.key!==void 0}function i(e,r){function a(){Re||(Re=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",r))}a.isReactWarning=!0,Object.defineProperty(e,"key",{get:a,configurable:!0})}function T(){var e=t(this.type);return Se[e]||(Se[e]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),e=this.props.ref,e!==void 0?e:null}function Ve(e,r,a,f,h,p){return a=p.ref,e={$$typeof:V,type:e,key:r,props:p,_owner:h},(a!==void 0?a:null)!==null?Object.defineProperty(e,"ref",{enumerable:!1,get:T}):Object.defineProperty(e,"ref",{enumerable:!1,value:null}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function ue(e,r,a,f,h,p){if(typeof e=="string"||typeof e=="function"||e===H||e===fe||e===de||e===G||e===J||e===Je||typeof e=="object"&&e!==null&&(e.$$typeof===D||e.$$typeof===X||e.$$typeof===ve||e.$$typeof===ge||e.$$typeof===F||e.$$typeof===De||e.getModuleId!==void 0)){var c=r.children;if(c!==void 0)if(f)if(Z(c)){for(f=0;f<c.length;f++)se(c[f],e);Object.freeze&&Object.freeze(c)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else se(c,e)}else c="",(e===void 0||typeof e=="object"&&e!==null&&Object.keys(e).length===0)&&(c+=" You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports."),e===null?f="null":Z(e)?f="array":e!==void 0&&e.$$typeof===V?(f="<"+(t(e.type)||"Unknown")+" />",c=" Did you accidentally export a JSX literal instead of a component?"):f=typeof e,console.error("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",f,c);if(pe.call(r,"key")){c=t(e);var C=Object.keys(r).filter(function(b){return b!=="key"});f=0<C.length?"{key: someKey, "+C.join(": ..., ")+": ...}":"{key: someKey}",ke[c+f]||(C=0<C.length?"{"+C.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
|
|
23
23
|
let props = %s;
|
|
24
24
|
<%s {...props} />
|
|
25
25
|
React keys must be passed directly to JSX without using spread:
|
|
26
26
|
let props = %s;
|
|
27
|
-
<%s key={someKey} {...props} />`,
|
|
27
|
+
<%s key={someKey} {...props} />`,f,c,C,c),ke[c+f]=!0)}if(c=null,a!==void 0&&(g(a),c=""+a),n(r)&&(g(r.key),c=""+r.key),"key"in r){a={};for(var A in r)A!=="key"&&(a[A]=r[A])}else a=r;return c&&i(a,typeof e=="function"?e.displayName||e.name||"Unknown":e),Ve(e,c,p,h,o(),a)}function se(e,r){if(typeof e=="object"&&e&&e.$$typeof!==Ze){if(Z(e))for(var a=0;a<e.length;a++){var f=e[a];W(f)&&ce(f,r)}else if(W(e))e._store&&(e._store.validated=1);else if(e===null||typeof e!="object"?a=null:(a=Ee&&e[Ee]||e["@@iterator"],a=typeof a=="function"?a:null),typeof a=="function"&&a!==e.entries&&(a=a.call(e),a!==e))for(;!(e=a.next()).done;)W(e.value)&&ce(e.value,r)}}function W(e){return typeof e=="object"&&e!==null&&e.$$typeof===V}function ce(e,r){if(e._store&&!e._store.validated&&e.key==null&&(e._store.validated=1,r=He(r),!_e[r])){_e[r]=!0;var a="";e&&e._owner!=null&&e._owner!==o()&&(a=null,typeof e._owner.tag=="number"?a=t(e._owner.type):typeof e._owner.name=="string"&&(a=e._owner.name),a=" It was passed a child from "+a+".");var f=S.getCurrentStack;S.getCurrentStack=function(){var h=l(e.type);return f&&(h+=f()||""),h},console.error('Each child in a list should have a unique "key" prop.%s%s See https://react.dev/link/warning-keys for more information.',r,a),S.getCurrentStack=f}}function He(e){var r="",a=o();return a&&(a=t(a.type))&&(r=`
|
|
28
28
|
|
|
29
|
-
Check the render method of \``+
|
|
29
|
+
Check the render method of \``+a+"`."),r||(e=t(e))&&(r=`
|
|
30
30
|
|
|
31
|
-
Check the top-level render call using <`+e+">."),
|
|
31
|
+
Check the top-level render call using <`+e+">."),r}var Fe=m,V=Symbol.for("react.transitional.element"),Ge=Symbol.for("react.portal"),H=Symbol.for("react.fragment"),de=Symbol.for("react.strict_mode"),fe=Symbol.for("react.profiler"),ge=Symbol.for("react.consumer"),ve=Symbol.for("react.context"),F=Symbol.for("react.forward_ref"),G=Symbol.for("react.suspense"),J=Symbol.for("react.suspense_list"),X=Symbol.for("react.memo"),D=Symbol.for("react.lazy"),Je=Symbol.for("react.offscreen"),Ee=Symbol.iterator,Xe=Symbol.for("react.client.reference"),S=Fe.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,pe=Object.prototype.hasOwnProperty,k=Object.assign,De=Symbol.for("react.client.reference"),Z=Array.isArray,N=0,me,we,Te,he,be,Pe,Ce;s.__reactDisabledLog=!0;var Q,ye,K=!1,q=new(typeof WeakMap=="function"?WeakMap:Map),Ze=Symbol.for("react.client.reference"),Re,Se={},ke={},_e={};x.Fragment=H,x.jsx=function(e,r,a,f,h){return ue(e,r,a,!1,f,h)},x.jsxs=function(e,r,a,f,h){return ue(e,r,a,!0,f,h)}}()),x}var te;function Ue(){return te||(te=1,process.env.NODE_ENV==="production"?L.exports=Ye():L.exports=Ie()),L.exports}var U=Ue();const re="topol-email-editor-id";function ae(t){const d=m.useRef(!1),g=m.useRef(!1),s=m.useRef(t);return s.current=t,m.useEffect(()=>d.current?void 0:(d.current=!0,(async()=>{const E=s.current,v={onSave(l,o){var n,i;(i=(n=s.current).onSave)==null||i.call(n,l,o)},onSaveAndClose(l,o){var n,i;(i=(n=s.current).onSaveAndClose)==null||i.call(n,l,o)},onTestSend(l,o,n){var i,T;(T=(i=s.current).onTestSend)==null||T.call(i,l,o,n)},onOpenFileManager(){var l,o;(o=(l=s.current).onOpenFileManager)==null||o.call(l)},onLoaded(){var l,o;(o=(l=s.current).onLoaded)==null||o.call(l)},onBlockSave(l){var o,n;(n=(o=s.current).onBlockSave)==null||n.call(o,l)},onBlockRemove(l){var o,n;(n=(o=s.current).onBlockRemove)==null||n.call(o,l)},onBlockEdit(l){var o,n;(n=(o=s.current).onBlockEdit)==null||n.call(o,l)},onInit(){var l,o;(o=(l=s.current).onInit)==null||o.call(l),g.current=!0},onUndoChange(l){var o,n;(n=(o=s.current).onUndoChange)==null||n.call(o,l)},onRedoChange(l){var o,n;(n=(o=s.current).onRedoChange)==null||n.call(o,l)},onPreview(l){var o,n;(n=(o=s.current).onPreview)==null||n.call(o,l)},onAlert(l){var o,n;(n=(o=s.current).onAlert)==null||n.call(o,l)},onClose(){var l,o;(o=(l=s.current).onClose)==null||o.call(l)},onBannerClick(l,o){var n,i;(i=(n=s.current).onBannerClick)==null||i.call(n,l,o)},onEdittedWithoutSaveChanged(l){var o,n;(n=(o=s.current).onEdittedWithoutSaveChanged)==null||n.call(o,l)},onOpenCustomBlockDialog(l){var o,n;(n=(o=s.current).onOpenCustomBlockDialog)==null||n.call(o,l)},onTemplateRename(l){var o,n;(n=(o=s.current).onTemplateRename)==null||n.call(o,l)},updateTestingEmailAddresses(l){var o,n;(n=(o=s.current).updateTestingEmailAddresses)==null||n.call(o,l)},onError(l,o){var n,i;(i=(n=s.current).onError)==null||i.call(n,l,o)}},w={id:"#"+re,...E.options,callbacks:v};await M.init(w,{stage:E.stage||"production"})})().catch(E=>{var v,w;(w=(v=s.current).onError)==null||w.call(v,"init",(E==null?void 0:E.message)||"Failed to initialize editor"),console.error("[@topol.io/editor-react] EmailEditor initialization failed:",E)}),()=>{g.current&&(M.destroy(),g.current=!1),d.current=!1}),[]),U.jsx("div",{id:re,style:{position:"absolute",height:"100vh",width:"100%"}})}const ie="topol-landing-page-editor-id",le=m.forwardRef((t,d)=>{const g=m.useRef(!1),s=m.useRef(null),u=m.useRef(t);return u.current=t,m.useImperativeHandle(d,()=>({load(E){var v;(v=s.current)==null||v.load(E)}})),m.useEffect(()=>g.current?void 0:(g.current=!0,(async()=>{const v=u.current,w={onSave(o,n){var i,T;(T=(i=u.current).onSave)==null||T.call(i,o,n)},onSaveAndClose(o,n){var i,T;(T=(i=u.current).onSaveAndClose)==null||T.call(i,o,n)},onOpenFileManager(){var o,n;(n=(o=u.current).onOpenFileManager)==null||n.call(o)},onLoaded(){var o,n;(n=(o=u.current).onLoaded)==null||n.call(o)},onBlockSave(o){var n,i;(i=(n=u.current).onBlockSave)==null||i.call(n,o)},onBlockRemove(o){var n,i;(i=(n=u.current).onBlockRemove)==null||i.call(n,o)},onBlockEdit(o){var n,i;(i=(n=u.current).onBlockEdit)==null||i.call(n,o)},onInit(){var o,n;(n=(o=u.current).onInit)==null||n.call(o)},onClose(){var o,n;(n=(o=u.current).onClose)==null||n.call(o)},onUndoChange(o){var n,i;(i=(n=u.current).onUndoChange)==null||i.call(n,o)},onRedoChange(o){var n,i;(i=(n=u.current).onRedoChange)==null||i.call(n,o)},onPreview(o){var n,i;(i=(n=u.current).onPreview)==null||i.call(n,o)},onAlert(o){var n,i;(i=(n=u.current).onAlert)==null||i.call(n,o)},onBannerClick(o,n){var i,T;(T=(i=u.current).onBannerClick)==null||T.call(i,o,n)},onEdittedWithoutSaveChanged(o){var n,i;(i=(n=u.current).onEdittedWithoutSaveChanged)==null||i.call(n,o)},onOpenCustomBlockDialog(o){var n,i;(i=(n=u.current).onOpenCustomBlockDialog)==null||i.call(n,o)},onTemplateRename(o){var n,i;(i=(n=u.current).onTemplateRename)==null||i.call(n,o)},onError(o,n){var i,T;(T=(i=u.current).onError)==null||T.call(i,o,n)}},l=await ee.init({config:v.options,...w},{stage:v.stage||"production"});s.current=l,l.render("#"+ie)})().catch(v=>{var w,l;(l=(w=u.current).onError)==null||l.call(w,"init",(v==null?void 0:v.message)||"Failed to initialize editor"),console.error("[@topol.io/editor-react] LandingPageEditor initialization failed:",v)}),()=>{var v;(v=s.current)==null||v.destroy(),s.current=null,g.current=!1}),[]),U.jsx("div",{id:ie,style:{position:"absolute",height:"100vh",width:"100%"}})});le.displayName="LandingPageEditor";function We(t){return m.useEffect(()=>{console.warn("[@topol.io/editor-react] TopolEditor is deprecated and will be removed in a future version. Please use EmailEditor instead.")},[]),U.jsx(ae,{...t})}P.CoreEmailEditor=M,P.CoreLandingPageEditor=ee,P.EmailEditor=ae,P.LandingPageEditor=le,P.TopolEditor=We,P.TopolPlugin=ze,Object.defineProperty(P,Symbol.toStringTag,{value:"Module"})});
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
3
|
-
type
|
|
4
|
-
options:
|
|
1
|
+
import type { INotification, ISavedBlock, IStage } from '@topol.io/editor';
|
|
2
|
+
import type { IReactEmailOptions } from './types';
|
|
3
|
+
export type EmailEditorProps = {
|
|
4
|
+
options: IReactEmailOptions;
|
|
5
5
|
stage?: IStage;
|
|
6
6
|
onSave?(json: unknown, html: unknown): void;
|
|
7
7
|
onSaveAndClose?(json: unknown, html: unknown): void;
|
|
8
|
-
onTestSend?(email: string, json: unknown, html: unknown): void;
|
|
8
|
+
onTestSend?(email: string | string[], json: unknown, html: unknown): void;
|
|
9
9
|
onOpenFileManager?(): void;
|
|
10
10
|
onLoaded?(): void;
|
|
11
11
|
onBlockSave?(block: ISavedBlock): void;
|
|
@@ -17,12 +17,11 @@ type TopolEditorProps = {
|
|
|
17
17
|
onPreview?(html: unknown): void;
|
|
18
18
|
onAlert?(notification: INotification): void;
|
|
19
19
|
onClose?(): void;
|
|
20
|
+
onBannerClick?(json: unknown, html: unknown): void;
|
|
20
21
|
onEdittedWithoutSaveChanged?(hasUnsavedChanges: boolean): void;
|
|
21
22
|
onOpenCustomBlockDialog?(blockContent: unknown): void;
|
|
22
23
|
onTemplateRename?(title: string): void;
|
|
23
24
|
updateTestingEmailAddresses?(emails: string[]): void;
|
|
24
25
|
onError?(type: string, message: string): void;
|
|
25
26
|
};
|
|
26
|
-
export default function
|
|
27
|
-
export type { IReactTopolOptions, INotification, ISavedBlock };
|
|
28
|
-
export { TopolPlugin };
|
|
27
|
+
export default function EmailEditor(props: EmailEditorProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import type { INotification, IStage, TopolSection } from '@topol.io/editor';
|
|
2
|
+
import type { IReactLandingPageOptions } from './types';
|
|
3
|
+
/**
|
|
4
|
+
* Ref handle for LandingPageEditor component.
|
|
5
|
+
* Provides methods to programmatically control the editor.
|
|
6
|
+
*/
|
|
7
|
+
export interface LandingPageEditorRef {
|
|
8
|
+
/**
|
|
9
|
+
* Load a template into the editor.
|
|
10
|
+
* @param template - The template data (JSON structure)
|
|
11
|
+
*/
|
|
12
|
+
load(template: unknown): void;
|
|
13
|
+
}
|
|
14
|
+
export type LandingPageEditorProps = {
|
|
15
|
+
options: IReactLandingPageOptions;
|
|
16
|
+
stage?: IStage;
|
|
17
|
+
onSave?(json: unknown, html: unknown): void;
|
|
18
|
+
onSaveAndClose?(json: unknown, html: unknown): void;
|
|
19
|
+
onOpenFileManager?(): void;
|
|
20
|
+
onLoaded?(): void;
|
|
21
|
+
onBlockSave?(block: TopolSection): void;
|
|
22
|
+
onBlockRemove?(blockId: number | string): void;
|
|
23
|
+
onBlockEdit?(blockId: number | string): void;
|
|
24
|
+
onInit?(): void;
|
|
25
|
+
onClose?(): void;
|
|
26
|
+
onUndoChange?(count: number): void;
|
|
27
|
+
onRedoChange?(count: number): void;
|
|
28
|
+
onPreview?(html: unknown): void;
|
|
29
|
+
onAlert?(notification: INotification): void;
|
|
30
|
+
onBannerClick?(json: unknown, html: unknown): void;
|
|
31
|
+
onEdittedWithoutSaveChanged?(hasUnsavedChanges: boolean): void;
|
|
32
|
+
onOpenCustomBlockDialog?(blockContent: unknown): void;
|
|
33
|
+
onTemplateRename?(title: string): void;
|
|
34
|
+
onError?(type: string, message: string): void;
|
|
35
|
+
};
|
|
36
|
+
declare const LandingPageEditor: import("react").ForwardRefExoticComponent<LandingPageEditorProps & import("react").RefAttributes<LandingPageEditorRef>>;
|
|
37
|
+
export default LandingPageEditor;
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @topol.io/editor-react - React wrapper for Topol Editor
|
|
3
|
+
*
|
|
4
|
+
* @example Email Editor
|
|
5
|
+
* ```tsx
|
|
6
|
+
* import { EmailEditor, type IReactEmailOptions } from '@topol.io/editor-react';
|
|
7
|
+
*
|
|
8
|
+
* const options: IReactEmailOptions = {
|
|
9
|
+
* authorize: { apiKey: 'your-key', userId: 'user-123' },
|
|
10
|
+
* };
|
|
11
|
+
*
|
|
12
|
+
* function App() {
|
|
13
|
+
* return <EmailEditor options={options} onSave={(json, html) => console.log('Saved')} />;
|
|
14
|
+
* }
|
|
15
|
+
* ```
|
|
16
|
+
*
|
|
17
|
+
* @example Landing Page Editor
|
|
18
|
+
* ```tsx
|
|
19
|
+
* import { useRef } from 'react';
|
|
20
|
+
* import { LandingPageEditor, type LandingPageEditorRef, type IReactLandingPageOptions } from '@topol.io/editor-react';
|
|
21
|
+
*
|
|
22
|
+
* const options: IReactLandingPageOptions = {
|
|
23
|
+
* authorize: { apiKey: 'your-key', userId: 'user-123' },
|
|
24
|
+
* };
|
|
25
|
+
*
|
|
26
|
+
* function App() {
|
|
27
|
+
* const editorRef = useRef<LandingPageEditorRef>(null);
|
|
28
|
+
*
|
|
29
|
+
* const loadTemplate = () => {
|
|
30
|
+
* editorRef.current?.load(templateJson);
|
|
31
|
+
* };
|
|
32
|
+
*
|
|
33
|
+
* return <LandingPageEditor ref={editorRef} options={options} onSave={(json, html) => console.log('Saved')} />;
|
|
34
|
+
* }
|
|
35
|
+
* ```
|
|
36
|
+
*/
|
|
37
|
+
export { default as TopolPlugin, EmailEditor as CoreEmailEditor, LandingPageEditor as CoreLandingPageEditor } from '@topol.io/editor';
|
|
38
|
+
export { default as EmailEditor } from './EmailEditor';
|
|
39
|
+
export type { EmailEditorProps } from './EmailEditor';
|
|
40
|
+
export { default as LandingPageEditor } from './LandingPageEditor';
|
|
41
|
+
export type { LandingPageEditorRef, LandingPageEditorProps } from './LandingPageEditor';
|
|
42
|
+
/**
|
|
43
|
+
* @deprecated Use EmailEditor instead. TopolEditor is an alias for backwards compatibility.
|
|
44
|
+
*/
|
|
45
|
+
export { default as TopolEditor } from './TopolEditor';
|
|
46
|
+
export type { TopolEditorProps } from './TopolEditor';
|
|
47
|
+
export type { ITopolOptions, ILandingPageOptions, ILandingPageEditorInstance, IEmailCallbacks, ILandingPageCallbacks, ISaveData, IErrorData, ISendTestData, INotification, ISavedBlock, IStage, TopolSection, } from '@topol.io/editor';
|
|
48
|
+
export type { IReactEmailOptions, IReactLandingPageOptions, IReactTopolOptions } from './types';
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Type re-exports from core package and React-specific types.
|
|
3
|
+
*/
|
|
4
|
+
export type { ITopolOptions, ILandingPageOptions, ILandingPageEditorInstance, IEmailCallbacks, ILandingPageCallbacks, ISaveData, IErrorData, ISendTestData, INotification, ISavedBlock, IStage, TopolSection, } from '@topol.io/editor';
|
|
5
|
+
import type { ITopolOptions, ILandingPageOptions } from '@topol.io/editor';
|
|
6
|
+
/**
|
|
7
|
+
* React-specific options for EmailEditor component.
|
|
8
|
+
* Omits 'id' and 'callbacks' as they are handled internally by the React wrapper.
|
|
9
|
+
*/
|
|
10
|
+
export type IReactEmailOptions = Omit<ITopolOptions, 'id' | 'callbacks'>;
|
|
11
|
+
/**
|
|
12
|
+
* React-specific options for LandingPageEditor component.
|
|
13
|
+
* Contains only the config options, as callbacks are handled as React props.
|
|
14
|
+
*/
|
|
15
|
+
export type IReactLandingPageOptions = ILandingPageOptions['config'];
|
|
16
|
+
/**
|
|
17
|
+
* @deprecated Use IReactEmailOptions instead.
|
|
18
|
+
*/
|
|
19
|
+
export type IReactTopolOptions = IReactEmailOptions;
|
package/package.json
CHANGED
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
"email-react",
|
|
12
12
|
"email templates"
|
|
13
13
|
],
|
|
14
|
-
"version": "0.
|
|
14
|
+
"version": "1.0.0-alpha.0",
|
|
15
15
|
"author": "Topol.io",
|
|
16
16
|
"homepage": "https://topol.io",
|
|
17
17
|
"license": "Apache-2.0",
|
|
@@ -21,26 +21,33 @@
|
|
|
21
21
|
"type": "module",
|
|
22
22
|
"main": "./dist/topol-editor-react.es.js",
|
|
23
23
|
"module": "./dist/topol-editor-react.es.js",
|
|
24
|
-
"types": "./dist/types/src/
|
|
24
|
+
"types": "./dist/types/src/entry.d.ts",
|
|
25
25
|
"exports": {
|
|
26
26
|
".": {
|
|
27
|
-
"types": "./dist/types/src/
|
|
27
|
+
"types": "./dist/types/src/entry.d.ts",
|
|
28
28
|
"import": "./dist/topol-editor-react.es.js",
|
|
29
29
|
"require": "./dist/topol-editor-react.umd.js"
|
|
30
30
|
}
|
|
31
31
|
},
|
|
32
|
+
"peerDependencies": {
|
|
33
|
+
"react": "^18.0.0 || ^19.0.0",
|
|
34
|
+
"react-dom": "^18.0.0 || ^19.0.0"
|
|
35
|
+
},
|
|
32
36
|
"dependencies": {
|
|
33
|
-
"@topol.io/editor": "0.
|
|
37
|
+
"@topol.io/editor": "1.0.0-alpha.0"
|
|
34
38
|
},
|
|
35
39
|
"devDependencies": {
|
|
40
|
+
"@testing-library/react": "^16.1.0",
|
|
36
41
|
"@types/node": "^20.7.0",
|
|
37
42
|
"@types/react": "^19.0.10",
|
|
38
43
|
"@types/react-dom": "^19.0.4",
|
|
39
44
|
"@vitejs/plugin-react": "^4.2.1",
|
|
45
|
+
"happy-dom": "^20.0.11",
|
|
40
46
|
"react": "^19.0.0",
|
|
41
47
|
"react-dom": "^19.0.0",
|
|
42
48
|
"typescript": "^5.2.2",
|
|
43
|
-
"vite": "^6.2.0"
|
|
49
|
+
"vite": "^6.2.0",
|
|
50
|
+
"vitest": "^4.0.16"
|
|
44
51
|
},
|
|
45
52
|
"publishConfig": {
|
|
46
53
|
"access": "public"
|
|
@@ -48,6 +55,8 @@
|
|
|
48
55
|
"scripts": {
|
|
49
56
|
"dev": "vite",
|
|
50
57
|
"build": "vite build && pnpm run build:types",
|
|
51
|
-
"build:types": "tsc -p tsconfig.prod.json"
|
|
58
|
+
"build:types": "tsc -p tsconfig.prod.json",
|
|
59
|
+
"test": "vitest run",
|
|
60
|
+
"test:watch": "vitest"
|
|
52
61
|
}
|
|
53
62
|
}
|