@machinemetrics/mm-react-embeddable 0.9.13 → 0.9.14

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

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

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

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

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

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

package/package.json

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