@machinemetrics/mm-react-embeddable 0.10.2 → 0.10.3

package/dist/mm-react-embeddable.cjs.js

@@ -1,6 +1,6 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react"),y=require("prop-types"),x=require("styled-components"),R=t.createContext(null),P=({children:r})=>{const[a,c]=t.useState({}),s=t.useRef({}),l=t.useCallback((e,o,n)=>{c(i=>({...i,[e]:{origin:o,frameRef:n}}))},[]),f=t.useCallback(e=>{c(o=>{const n={...o};return delete n[e],n})},[]);t.useEffect(()=>{const e=(n=[],i)=>{n.forEach(u=>u(i))},o=n=>{var M,E,w,b,p;if(!((M=n==null?void 0:n.data)!=null&&M.instanceId))return;const{instanceId:i,type:u}=n.data,g=s.current;e((E=g[i])==null?void 0:E[u],n.data),e((w=g["*"])==null?void 0:w[u],n.data),e((b=g[i])==null?void 0:b["*"],n.data),e((p=g["*"])==null?void 0:p["*"],n.data)};return window.addEventListener("message",o),()=>{window.removeEventListener("message",o)}},[a]);const d=t.useCallback((e,o,n)=>{const i=a[e];if(!i){console.warn(`Origin not set for id: ${e}. Unable to send message.`);return}i.frameRef.current.contentWindow.postMessage({type:o,...n,instanceId:e},i.origin)},[a]),m=t.useCallback((e,o)=>{d(e,"load-options",o)},[d]),I=t.useCallback((e,o)=>{d(e,"validate",o)},[d]),C={registerFrame:l,unregisterFrame:f,sendMessage:d,loadOptions:m,validate:I,addListener:(e,o,n)=>(s.current[e]||(s.current[e]={}),s.current[e][o]||(s.current[e][o]=[]),s.current[e][o].push(n),()=>{s.current[e][o]=s.current[e][o].filter(i=>i!==n)})};return t.createElement(R.Provider,{value:C},r)},h={},$=async r=>{try{const a=new URL(r).origin;if(h[a]!==void 0)return h[a];const s=await(await fetch(`${a}/mm-app-manifest.json`)).json();if(!s.version)throw new Error("Invalid manifest");return h[a]=s,s}catch{}return h[origin]=!1,!1},L=async r=>!!await $(r),S=(r,a,c)=>{const s=t.useContext(R);if(s===null)throw new Error("useEmbeddedEffect must be used within a MMEmbeddableZoneProvider");const l=t.useRef(c);return t.useEffect(()=>{l.current=c},[c]),t.useEffect(()=>{if(!(!r||!a))return s.addListener(r,a,(...f)=>l.current(...f))},[s,r,a]),t.useCallback((f,d)=>s.sendMessage(r,f,d),[s,r])};P.propTypes={children:y.node.isRequired};const v=x.default||x,F=v.iframe`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react"),y=require("prop-types"),x=require("styled-components"),R=t.createContext(null),P=({children:r})=>{const[o,d]=t.useState({}),a=t.useRef({}),f=t.useCallback((e,s,n)=>{d(i=>({...i,[e]:{origin:s,frameRef:n}}))},[]),m=t.useCallback(e=>{d(s=>{const n={...s};return delete n[e],n})},[]);t.useEffect(()=>{const e=(n=[],i)=>{n.forEach(c=>c(i))},s=n=>{var w,E,M,b,p;if(!((w=n==null?void 0:n.data)!=null&&w.instanceId))return;const{instanceId:i,type:c}=n.data,u=a.current;e((E=u[i])==null?void 0:E[c],n.data),e((M=u["*"])==null?void 0:M[c],n.data),e((b=u[i])==null?void 0:b["*"],n.data),e((p=u["*"])==null?void 0:p["*"],n.data)};return window.addEventListener("message",s),()=>{window.removeEventListener("message",s)}},[o]);const l=t.useCallback((e,s,n)=>{var c,u;const i=o[e];if(!i){console.warn(`Origin not set for id: ${e}. Unable to send message.`);return}(u=(c=i==null?void 0:i.frameRef)==null?void 0:c.current)!=null&&u.contentWindow&&i.frameRef.current.contentWindow.postMessage({type:s,...n,instanceId:e},i.origin)},[o]),g=t.useCallback((e,s)=>{l(e,"load-options",s)},[l]),I=t.useCallback((e,s)=>{l(e,"validate",s)},[l]),C={registerFrame:f,unregisterFrame:m,sendMessage:l,loadOptions:g,validate:I,addListener:(e,s,n)=>(a.current[e]||(a.current[e]={}),a.current[e][s]||(a.current[e][s]=[]),a.current[e][s].push(n),()=>{a.current[e][s]=a.current[e][s].filter(i=>i!==n)})};return t.createElement(R.Provider,{value:C},r)},h={},$=async r=>{try{const o=new URL(r).origin;if(h[o]!==void 0)return h[o];const a=await(await fetch(`${o}/mm-app-manifest.json`)).json();if(!a.version)throw new Error("Invalid manifest");return h[o]=a,a}catch{}return h[origin]=!1,!1},L=async r=>!!await $(r),S=(r,o,d)=>{const a=t.useContext(R);if(a===null)throw new Error("useEmbeddedEffect must be used within a MMEmbeddableZoneProvider");const f=t.useRef(d);t.useEffect(()=>{f.current=d},[d]),t.useEffect(()=>{if(!(!r||!o))return a.addListener(r,o,(...m)=>f.current(...m))},[a,r,o])};P.propTypes={children:y.node.isRequired};const v=x.default||x,F=v.iframe`
   width: 100%;
   height: 100%;
   border: none;
   visibility: ${r=>r.$isReady?"visible":"hidden"};
-`,Z=({id:r,src:a,path:c,onInit:s=()=>{},context:l,isConfiguring:f,...d})=>{const m=t.useRef(),[I,C]=t.useState(),[e,o]=t.useState(0),{registerFrame:n,unregisterFrame:i,sendMessage:u}=t.useContext(R),[g,M]=t.useState(!0),[E,w]=t.useState();return t.useEffect(()=>{e&&u(r,"set-context",{context:l})},[l,r,e]),t.useEffect(()=>{c!==void 0&&w(c)},[c]),t.useEffect(()=>{E===void 0||!e||u(r,"navigate",{path:E})},[E,e,r,u]),t.useEffect(()=>{e&&u(r,"set-configuring",{isConfiguring:f})},[e,f]),t.useEffect(()=>{if(!(!a||!r||!m))return(async()=>{const b=await L(a);if(M(b),b){const p=new URL(a);n(r,p.origin,m),s(),C(`${p.origin}/mm-embedded-interop?id=${r}&origin=${window.location.origin}`);return}})(),()=>{i(r)}},[a,r,n,m]),S(r,"ready",()=>o(b=>b+1)),g?t.createElement(F,{$isReady:e,ref:m,src:I,...d}):t.createElement("div",{style:{height:"100%",display:"flex",alignItems:"center",justifyContent:"center"}},t.createElement("div",{style:{textAlign:"center"}},"Application must adhere to the MM App Manifest specification to be embedded."))};Z.propTypes={id:y.string,src:y.string.isRequired,path:y.string,onInit:y.func};exports.MMEmbeddableZone=Z;exports.MMEmbeddableZoneContext=R;exports.MMEmbeddableZoneProvider=P;exports.getAppInfo=$;exports.testIsEmbeddable=L;exports.useEmbeddedEffect=S;
+`,Z=({id:r,src:o,path:d,onInit:a=()=>{},context:f,isConfiguring:m,...l})=>{const g=t.useRef(),[I,C]=t.useState(),[e,s]=t.useState(0),{registerFrame:n,unregisterFrame:i,sendMessage:c}=t.useContext(R),[u,w]=t.useState(!0),[E,M]=t.useState();return t.useEffect(()=>{e&&c(r,"set-context",{context:f})},[f,r,e]),t.useEffect(()=>{d!==void 0&&M(d)},[d]),t.useEffect(()=>{E===void 0||!e||c(r,"navigate",{path:E})},[E,e,r,c]),t.useEffect(()=>{e&&c(r,"set-configuring",{isConfiguring:m})},[e,m]),t.useEffect(()=>{if(!(!o||!r||!g))return(async()=>{const b=await L(o);if(w(b),b){const p=new URL(o);n(r,p.origin,g),a(),C(`${p.origin}/mm-embedded-interop?id=${r}&origin=${window.location.origin}`);return}})(),()=>{i(r)}},[o,r,n,g]),S(r,"ready",()=>s(b=>b+1)),u?t.createElement(F,{$isReady:e,ref:g,src:I,...l}):t.createElement("div",{style:{height:"100%",display:"flex",alignItems:"center",justifyContent:"center"}},t.createElement("div",{style:{textAlign:"center"}},"Application must adhere to the MM App Manifest specification to be embedded."))};Z.propTypes={id:y.string,src:y.string.isRequired,path:y.string,onInit:y.func};exports.MMEmbeddableZone=Z;exports.MMEmbeddableZoneContext=R;exports.MMEmbeddableZoneProvider=P;exports.getAppInfo=$;exports.testIsEmbeddable=L;exports.useEmbeddedEffect=S;

package/dist/mm-react-embeddable.es.js

@@ -1,95 +1,93 @@
-import x, { createContext as C, useState as y, useRef as F, useCallback as E, useEffect as f, useContext as A } from "react";
+import x, { createContext as C, useState as y, useRef as F, useCallback as E, useEffect as u, useContext as A } from "react";
 import h from "prop-types";
 import v from "styled-components";
 const P = C(null), U = ({ children: t }) => {
-  const [o, a] = y({}), n = F({}), l = E((e, s, r) => {
-    a((i) => ({ ...i, [e]: { origin: s, frameRef: r } }));
-  }, []), u = E((e) => {
-    a((s) => {
-      const r = { ...s };
+  const [s, c] = y({}), o = F({}), f = E((e, n, r) => {
+    c((i) => ({ ...i, [e]: { origin: n, frameRef: r } }));
+  }, []), g = E((e) => {
+    c((n) => {
+      const r = { ...n };
       return delete r[e], r;
     });
   }, []);
-  f(() => {
+  u(() => {
     const e = (r = [], i) => {
-      r.forEach((d) => d(i));
-    }, s = (r) => {
-      var M, b, R, m, w;
-      if (!((M = r == null ? void 0 : r.data) != null && M.instanceId))
+      r.forEach((a) => a(i));
+    }, n = (r) => {
+      var R, b, M, m, w;
+      if (!((R = r == null ? void 0 : r.data) != null && R.instanceId))
         return;
-      const { instanceId: i, type: d } = r.data, p = n.current;
-      e((b = p[i]) == null ? void 0 : b[d], r.data), e((R = p["*"]) == null ? void 0 : R[d], r.data), e((m = p[i]) == null ? void 0 : m["*"], r.data), e((w = p["*"]) == null ? void 0 : w["*"], r.data);
+      const { instanceId: i, type: a } = r.data, d = o.current;
+      e((b = d[i]) == null ? void 0 : b[a], r.data), e((M = d["*"]) == null ? void 0 : M[a], r.data), e((m = d[i]) == null ? void 0 : m["*"], r.data), e((w = d["*"]) == null ? void 0 : w["*"], r.data);
     };
-    return window.addEventListener("message", s), () => {
-      window.removeEventListener("message", s);
+    return window.addEventListener("message", n), () => {
+      window.removeEventListener("message", n);
     };
-  }, [o]);
-  const c = E(
-    (e, s, r) => {
-      const i = o[e];
+  }, [s]);
+  const l = E(
+    (e, n, r) => {
+      var a, d;
+      const i = s[e];
       if (!i) {
         console.warn(`Origin not set for id: ${e}. Unable to send message.`);
         return;
       }
-      i.frameRef.current.contentWindow.postMessage(
-        { type: s, ...r, instanceId: e },
+      (d = (a = i == null ? void 0 : i.frameRef) == null ? void 0 : a.current) != null && d.contentWindow && i.frameRef.current.contentWindow.postMessage(
+        { type: n, ...r, instanceId: e },
         i.origin
       );
     },
-    [o]
-  ), g = E(
-    (e, s) => {
-      c(e, "load-options", s);
+    [s]
+  ), p = E(
+    (e, n) => {
+      l(e, "load-options", n);
     },
-    [c]
+    [l]
   ), $ = E(
-    (e, s) => {
-      c(e, "validate", s);
+    (e, n) => {
+      l(e, "validate", n);
     },
-    [c]
+    [l]
   ), L = {
-    registerFrame: l,
-    unregisterFrame: u,
-    sendMessage: c,
-    loadOptions: g,
+    registerFrame: f,
+    unregisterFrame: g,
+    sendMessage: l,
+    loadOptions: p,
     validate: $,
-    addListener: (e, s, r) => (n.current[e] || (n.current[e] = {}), n.current[e][s] || (n.current[e][s] = []), n.current[e][s].push(r), () => {
-      n.current[e][s] = n.current[e][s].filter((i) => i !== r);
+    addListener: (e, n, r) => (o.current[e] || (o.current[e] = {}), o.current[e][n] || (o.current[e][n] = []), o.current[e][n].push(r), () => {
+      o.current[e][n] = o.current[e][n].filter((i) => i !== r);
     })
   };
   return /* @__PURE__ */ x.createElement(P.Provider, { value: L }, t);
 }, I = {}, Z = async (t) => {
   try {
-    const o = new URL(t).origin;
-    if (I[o] !== void 0)
-      return I[o];
-    const n = await (await fetch(`${o}/mm-app-manifest.json`)).json();
-    if (!n.version)
+    const s = new URL(t).origin;
+    if (I[s] !== void 0)
+      return I[s];
+    const o = await (await fetch(`${s}/mm-app-manifest.json`)).json();
+    if (!o.version)
       throw new Error("Invalid manifest");
-    return I[o] = n, n;
+    return I[s] = o, o;
   } catch {
   }
   return I[origin] = !1, !1;
-}, j = async (t) => !!await Z(t), O = (t, o, a) => {
-  const n = A(P);
-  if (n === null)
+}, j = async (t) => !!await Z(t), O = (t, s, c) => {
+  const o = A(P);
+  if (o === null)
     throw new Error(
       "useEmbeddedEffect must be used within a MMEmbeddableZoneProvider"
     );
-  const l = F(a);
-  return f(() => {
-    l.current = a;
-  }, [a]), f(() => {
-    if (!(!t || !o))
-      return n.addListener(
+  const f = F(c);
+  u(() => {
+    f.current = c;
+  }, [c]), u(() => {
+    if (!(!t || !s))
+      return o.addListener(
         t,
-        o,
-        (...u) => l.current(...u)
+        s,
+        (...g) => f.current(...g)
       );
-  }, [n, t, o]), E(
-    (u, c) => n.sendMessage(t, u, c),
-    [n, t]
-  );
+  }, [o, t, s]);
 };
 U.propTypes = {
   children: h.node.isRequired
@@ -99,34 +97,34 @@ const T = v.default || v, q = T.iframe`
   height: 100%;
   border: none;
   visibility: ${(t) => t.$isReady ? "visible" : "hidden"};
-`, S = ({
+`, W = ({
   id: t,
-  src: o,
-  path: a,
-  onInit: n = () => {
+  src: s,
+  path: c,
+  onInit: o = () => {
   },
-  context: l,
-  isConfiguring: u,
-  ...c
+  context: f,
+  isConfiguring: g,
+  ...l
 }) => {
-  const g = F(), [$, L] = y(), [e, s] = y(0), { registerFrame: r, unregisterFrame: i, sendMessage: d } = A(
+  const p = F(), [$, L] = y(), [e, n] = y(0), { registerFrame: r, unregisterFrame: i, sendMessage: a } = A(
     P
-  ), [p, M] = y(!0), [b, R] = y();
-  return f(() => {
-    e && d(t, "set-context", { context: l });
-  }, [l, t, e]), f(() => {
-    a !== void 0 && R(a);
-  }, [a]), f(() => {
-    b === void 0 || !e || d(t, "navigate", { path: b });
-  }, [b, e, t, d]), f(() => {
-    e && d(t, "set-configuring", { isConfiguring: u });
-  }, [e, u]), f(() => {
-    if (!(!o || !t || !g))
+  ), [d, R] = y(!0), [b, M] = y();
+  return u(() => {
+    e && a(t, "set-context", { context: f });
+  }, [f, t, e]), u(() => {
+    c !== void 0 && M(c);
+  }, [c]), u(() => {
+    b === void 0 || !e || a(t, "navigate", { path: b });
+  }, [b, e, t, a]), u(() => {
+    e && a(t, "set-configuring", { isConfiguring: g });
+  }, [e, g]), u(() => {
+    if (!(!s || !t || !p))
       return (async () => {
-        const m = await j(o);
-        if (M(m), m) {
-          const w = new URL(o);
-          r(t, w.origin, g), n(), L(
+        const m = await j(s);
+        if (R(m), m) {
+          const w = new URL(s);
+          r(t, w.origin, p), o(), L(
             `${w.origin}/mm-embedded-interop?id=${t}&origin=${window.location.origin}`
           );
           return;
@@ -134,7 +132,7 @@ const T = v.default || v, q = T.iframe`
       })(), () => {
         i(t);
       };
-  }, [o, t, r, g]), O(t, "ready", () => s((m) => m + 1)), p ? /* @__PURE__ */ x.createElement(q, { $isReady: e, ref: g, src: $, ...c }) : /* @__PURE__ */ x.createElement(
+  }, [s, t, r, p]), O(t, "ready", () => n((m) => m + 1)), d ? /* @__PURE__ */ x.createElement(q, { $isReady: e, ref: p, src: $, ...l }) : /* @__PURE__ */ x.createElement(
     "div",
     {
       style: {
@@ -147,14 +145,14 @@ const T = v.default || v, q = T.iframe`
     /* @__PURE__ */ x.createElement("div", { style: { textAlign: "center" } }, "Application must adhere to the MM App Manifest specification to be embedded.")
   );
 };
-S.propTypes = {
+W.propTypes = {
   id: h.string,
   src: h.string.isRequired,
   path: h.string,
   onInit: h.func
 };
 export {
-  S as MMEmbeddableZone,
+  W as MMEmbeddableZone,
   P as MMEmbeddableZoneContext,
   U as MMEmbeddableZoneProvider,
   Z as getAppInfo,

package/dist/mm-react-embeddable.umd.js

@@ -1,6 +1,6 @@
-(function(d,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("react"),require("prop-types"),require("styled-components")):typeof define=="function"&&define.amd?define(["exports","react","prop-types","styled-components"],e):(d=typeof globalThis<"u"?globalThis:d||self,e(d["mm-react-embeddable"]={},d.React,d.PropTypes,d.styled))})(this,function(d,e,y,S){"use strict";const M=e.createContext(null),Z=({children:n})=>{const[o,a]=e.useState({}),s=e.useRef({}),m=e.useCallback((t,i,r)=>{a(u=>({...u,[t]:{origin:i,frameRef:r}}))},[]),l=e.useCallback(t=>{a(i=>{const r={...i};return delete r[t],r})},[]);e.useEffect(()=>{const t=(r=[],u)=>{r.forEach(c=>c(u))},i=r=>{var I,p,C,b,h;if(!((I=r==null?void 0:r.data)!=null&&I.instanceId))return;const{instanceId:u,type:c}=r.data,g=s.current;t((p=g[u])==null?void 0:p[c],r.data),t((C=g["*"])==null?void 0:C[c],r.data),t((b=g[u])==null?void 0:b["*"],r.data),t((h=g["*"])==null?void 0:h["*"],r.data)};return window.addEventListener("message",i),()=>{window.removeEventListener("message",i)}},[o]);const f=e.useCallback((t,i,r)=>{const u=o[t];if(!u){console.warn(`Origin not set for id: ${t}. Unable to send message.`);return}u.frameRef.current.contentWindow.postMessage({type:i,...r,instanceId:t},u.origin)},[o]),E=e.useCallback((t,i)=>{f(t,"load-options",i)},[f]),$=e.useCallback((t,i)=>{f(t,"validate",i)},[f]),L={registerFrame:m,unregisterFrame:l,sendMessage:f,loadOptions:E,validate:$,addListener:(t,i,r)=>(s.current[t]||(s.current[t]={}),s.current[t][i]||(s.current[t][i]=[]),s.current[t][i].push(r),()=>{s.current[t][i]=s.current[t][i].filter(u=>u!==r)})};return e.createElement(M.Provider,{value:L},n)},w={},v=async n=>{try{const o=new URL(n).origin;if(w[o]!==void 0)return w[o];const s=await(await fetch(`${o}/mm-app-manifest.json`)).json();if(!s.version)throw new Error("Invalid manifest");return w[o]=s,s}catch{}return w[origin]=!1,!1},x=async n=>!!await v(n),F=(n,o,a)=>{const s=e.useContext(M);if(s===null)throw new Error("useEmbeddedEffect must be used within a MMEmbeddableZoneProvider");const m=e.useRef(a);return e.useEffect(()=>{m.current=a},[a]),e.useEffect(()=>{if(!(!n||!o))return s.addListener(n,o,(...l)=>m.current(...l))},[s,n,o]),e.useCallback((l,f)=>s.sendMessage(n,l,f),[s,n])};Z.propTypes={children:y.node.isRequired};const q=(S.default||S).iframe`
+(function(u,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("react"),require("prop-types"),require("styled-components")):typeof define=="function"&&define.amd?define(["exports","react","prop-types","styled-components"],e):(u=typeof globalThis<"u"?globalThis:u||self,e(u["mm-react-embeddable"]={},u.React,u.PropTypes,u.styled))})(this,function(u,e,y,S){"use strict";const w=e.createContext(null),Z=({children:n})=>{const[i,f]=e.useState({}),o=e.useRef({}),l=e.useCallback((t,s,r)=>{f(d=>({...d,[t]:{origin:s,frameRef:r}}))},[]),E=e.useCallback(t=>{f(s=>{const r={...s};return delete r[t],r})},[]);e.useEffect(()=>{const t=(r=[],d)=>{r.forEach(a=>a(d))},s=r=>{var I,p,C,b,h;if(!((I=r==null?void 0:r.data)!=null&&I.instanceId))return;const{instanceId:d,type:a}=r.data,c=o.current;t((p=c[d])==null?void 0:p[a],r.data),t((C=c["*"])==null?void 0:C[a],r.data),t((b=c[d])==null?void 0:b["*"],r.data),t((h=c["*"])==null?void 0:h["*"],r.data)};return window.addEventListener("message",s),()=>{window.removeEventListener("message",s)}},[i]);const m=e.useCallback((t,s,r)=>{var a,c;const d=i[t];if(!d){console.warn(`Origin not set for id: ${t}. Unable to send message.`);return}(c=(a=d==null?void 0:d.frameRef)==null?void 0:a.current)!=null&&c.contentWindow&&d.frameRef.current.contentWindow.postMessage({type:s,...r,instanceId:t},d.origin)},[i]),g=e.useCallback((t,s)=>{m(t,"load-options",s)},[m]),$=e.useCallback((t,s)=>{m(t,"validate",s)},[m]),L={registerFrame:l,unregisterFrame:E,sendMessage:m,loadOptions:g,validate:$,addListener:(t,s,r)=>(o.current[t]||(o.current[t]={}),o.current[t][s]||(o.current[t][s]=[]),o.current[t][s].push(r),()=>{o.current[t][s]=o.current[t][s].filter(d=>d!==r)})};return e.createElement(w.Provider,{value:L},n)},M={},v=async n=>{try{const i=new URL(n).origin;if(M[i]!==void 0)return M[i];const o=await(await fetch(`${i}/mm-app-manifest.json`)).json();if(!o.version)throw new Error("Invalid manifest");return M[i]=o,o}catch{}return M[origin]=!1,!1},x=async n=>!!await v(n),F=(n,i,f)=>{const o=e.useContext(w);if(o===null)throw new Error("useEmbeddedEffect must be used within a MMEmbeddableZoneProvider");const l=e.useRef(f);e.useEffect(()=>{l.current=f},[f]),e.useEffect(()=>{if(!(!n||!i))return o.addListener(n,i,(...E)=>l.current(...E))},[o,n,i])};Z.propTypes={children:y.node.isRequired};const q=(S.default||S).iframe`
   width: 100%;
   height: 100%;
   border: none;
   visibility: ${n=>n.$isReady?"visible":"hidden"};
-`,j=({id:n,src:o,path:a,onInit:s=()=>{},context:m,isConfiguring:l,...f})=>{const E=e.useRef(),[$,L]=e.useState(),[t,i]=e.useState(0),{registerFrame:r,unregisterFrame:u,sendMessage:c}=e.useContext(M),[g,I]=e.useState(!0),[p,C]=e.useState();return e.useEffect(()=>{t&&c(n,"set-context",{context:m})},[m,n,t]),e.useEffect(()=>{a!==void 0&&C(a)},[a]),e.useEffect(()=>{p===void 0||!t||c(n,"navigate",{path:p})},[p,t,n,c]),e.useEffect(()=>{t&&c(n,"set-configuring",{isConfiguring:l})},[t,l]),e.useEffect(()=>{if(!(!o||!n||!E))return(async()=>{const b=await x(o);if(I(b),b){const h=new URL(o);r(n,h.origin,E),s(),L(`${h.origin}/mm-embedded-interop?id=${n}&origin=${window.location.origin}`);return}})(),()=>{u(n)}},[o,n,r,E]),F(n,"ready",()=>i(b=>b+1)),g?e.createElement(q,{$isReady:t,ref:E,src:$,...f}):e.createElement("div",{style:{height:"100%",display:"flex",alignItems:"center",justifyContent:"center"}},e.createElement("div",{style:{textAlign:"center"}},"Application must adhere to the MM App Manifest specification to be embedded."))};j.propTypes={id:y.string,src:y.string.isRequired,path:y.string,onInit:y.func},d.MMEmbeddableZone=j,d.MMEmbeddableZoneContext=M,d.MMEmbeddableZoneProvider=Z,d.getAppInfo=v,d.testIsEmbeddable=x,d.useEmbeddedEffect=F,Object.defineProperty(d,Symbol.toStringTag,{value:"Module"})});
+`,j=({id:n,src:i,path:f,onInit:o=()=>{},context:l,isConfiguring:E,...m})=>{const g=e.useRef(),[$,L]=e.useState(),[t,s]=e.useState(0),{registerFrame:r,unregisterFrame:d,sendMessage:a}=e.useContext(w),[c,I]=e.useState(!0),[p,C]=e.useState();return e.useEffect(()=>{t&&a(n,"set-context",{context:l})},[l,n,t]),e.useEffect(()=>{f!==void 0&&C(f)},[f]),e.useEffect(()=>{p===void 0||!t||a(n,"navigate",{path:p})},[p,t,n,a]),e.useEffect(()=>{t&&a(n,"set-configuring",{isConfiguring:E})},[t,E]),e.useEffect(()=>{if(!(!i||!n||!g))return(async()=>{const b=await x(i);if(I(b),b){const h=new URL(i);r(n,h.origin,g),o(),L(`${h.origin}/mm-embedded-interop?id=${n}&origin=${window.location.origin}`);return}})(),()=>{d(n)}},[i,n,r,g]),F(n,"ready",()=>s(b=>b+1)),c?e.createElement(q,{$isReady:t,ref:g,src:$,...m}):e.createElement("div",{style:{height:"100%",display:"flex",alignItems:"center",justifyContent:"center"}},e.createElement("div",{style:{textAlign:"center"}},"Application must adhere to the MM App Manifest specification to be embedded."))};j.propTypes={id:y.string,src:y.string.isRequired,path:y.string,onInit:y.func},u.MMEmbeddableZone=j,u.MMEmbeddableZoneContext=w,u.MMEmbeddableZoneProvider=Z,u.getAppInfo=v,u.testIsEmbeddable=x,u.useEmbeddedEffect=F,Object.defineProperty(u,Symbol.toStringTag,{value:"Module"})});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@machinemetrics/mm-react-embeddable",
-  "version": "0.10.2",
+  "version": "0.10.3",
   "license": "MIT",
   "module": "dist/mm-react-embeddable.es.js",
   "main": "dist/mm-react-embeddable.cjs.js",