@machinemetrics/mm-react-embeddable 1.4.0-7 → 2.0.0-0

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

@@ -1,9 +1,9 @@
-(function(p,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("react"),require("prop-types"),require("styled-components")):typeof define=="function"&&define.amd?define(["exports","react","prop-types","styled-components"],e):(p=typeof globalThis!="undefined"?globalThis:p||self,e(p["mm-react-embeddable"]={},p.React,p.PropTypes,p.styled))})(this,(function(p,e,C,q){"use strict";const N=e.createContext(null),H=e.createContext({pending:[],authorize:()=>{},approve:()=>{},complete:()=>{},dismiss:()=>{},originEpochs:{},credentials:{},unsupported:{}}),X="access_token",J=r=>r?r.kind?r:r.accessToken?{kind:X,accessToken:r.accessToken,expiresAt:r.expiresAt||null}:null:null,be=new Set(["host_not_allowed","invalid_token","provider_unavailable"]),V=typeof window!="undefined"&&window.location.protocol==="https:",pe=8e3,P=r=>{try{return new URL(r).origin}catch{return null}},Y=(r,i)=>{const o=i==null?void 0:i.origin;return!o||P(r==null?void 0:r.authUrl)!==o?null:o},R=r=>{if(!r||/^\d{1,3}(?:\.\d{1,3}){3}$/.test(r)||r.includes(":"))return r;const i=r.split(".");return i.length<=2?r:i.slice(-2).join(".")},ee=(r,i)=>{try{const o=new URL(r),f=new URL(i);return o.protocol!==f.protocol?!0:R(o.hostname)!==R(f.hostname)}catch{return!0}},ne=(r,{onBlocked:i,onClosed:o})=>{const f=window.open(r.authUrl,"mm-embed-auth","popup,width=600,height=700");if(!f)return i(),()=>{};const m=setInterval(()=>{f.closed&&(clearInterval(m),o())},1e3);return()=>clearInterval(m)},te=({children:r,launcher:i,broker:o})=>{const f=e.useContext(N),[m,k]=e.useState({}),[$,z]=e.useState({}),[I,M]=e.useState({}),[S,A]=e.useState({}),W=e.useRef(I);W.current=I;const b=e.useRef(null),Z=e.useRef({}),L=e.useRef({}),j=e.useRef({}),T=e.useRef(o);T.current=o;const U=e.useCallback(n=>{const t=L.current[n];if(!t)return;const s=a=>!a[n]||a[n].clientId?a:{...a,[n]:{...a[n],clientId:t}};k(s),A(s)},[]),v=e.useCallback((n,t)=>{n&&(A(s=>s[n]?s:{...s,[n]:{origin:n,reason:t,clientId:L.current[n]||null}}),U(n))},[U]),u=e.useCallback((n,{v2:t=!1,origin:s=null}={})=>{s&&(t&&W.current[s]||(k(a=>a[s]?a:{...a,[s]:{origin:s,authUrl:n.authUrl,silentUrl:n.silentUrl||null,status:t&&T.current?"broker":t&&n.silentUrl&&V?"silent":"interactive",v2:t,scope:n.scope||null,acceptsCredentials:j.current[s]||null,consent:null,error:null,clientId:n.clientId||L.current[s]||null,popupBlocked:!1}}),U(s)))},[U]),l=e.useCallback(n=>{k(t=>{if(!t[n])return t;const s={...t};return delete s[n],s})},[]),c=e.useCallback(n=>{n&&(l(n),z(t=>({...t,[n]:(t[n]||0)+1})))},[l]),d=e.useCallback(n=>{k(t=>!t[n]||t[n].status==="interactive"?t:{...t,[n]:{...t[n],status:"interactive"}})},[]),g=e.useCallback(n=>{l(n.origin)},[l]),E=e.useCallback((n,t)=>{const s=Y(n,t);if(s){if(ee(s,window.location.origin)){v(s,"cross-site-legacy");return}u(n,{origin:s})}},[u,v]);e.useEffect(()=>{if(!f)return;const n=[f.addListener("*","init",(t,s)=>{s!=null&&s.origin&&(t!=null&&t.clientId)&&(L.current[s.origin]=t.clientId,U(s.origin)),s!=null&&s.origin&&Array.isArray(t==null?void 0:t.acceptsCredentials)&&(j.current[s.origin]=t.acceptsCredentials)}),f.addListener("*","authorize",E),f.addListener("*","login",E),f.addListener("*","credential-request",(t,s)=>u(t,{v2:!0,origin:Y(t,s)}))];return()=>n.forEach(t=>t())},[f,E,u,U]),e.useEffect(()=>{const n=t=>{const s=t==null?void 0:t.data;if(!s||s.type!=="authorized"&&s.type!=="authorize-failed")return;const a=P(s.authUrl);if(!(!a||t.origin!==a)){if(s.type==="authorized"){s.accessToken?(M(h=>({...h,[a]:J({accessToken:s.accessToken})})),l(a)):c(a);return}d(a)}};return window.addEventListener("message",n),()=>window.removeEventListener("message",n)},[l,c,d]);const _=e.useCallback((n,t)=>{const s=n==null?void 0:n.origin,a=J(t);!s||!a||(M(h=>({...h,[s]:a})),l(s))},[l]),w=e.useCallback((n,t)=>{k(s=>s[n]?{...s,[n]:{...s[n],...t}}:s)},[]),x=e.useCallback(async(n,{approve:t}={})=>{const s=T.current,{origin:a}=n;let h;try{h=await s({origin:a,clientId:n.clientId,scope:n.scope,authUrl:n.authUrl},{approve:t})}catch{t?w(a,{error:{reason:"broker_unavailable"}}):w(a,{status:n.silentUrl&&V?"silent":"interactive"});return}if((h==null?void 0:h.status)===200&&h.credential){_(n,h.credential);return}if((h==null?void 0:h.status)===409&&h.consentRequired){w(a,{status:"interactive",consent:{client:h.client||null,stepUp:!!h.stepUp,scope:h.scope||n.scope},error:null});return}const G=(h==null?void 0:h.error)||"broker_error";if(!t&&be.has(G)){w(a,{status:n.silentUrl&&V?"silent":"interactive"});return}if(t&&G==="consent_denied"){w(a,{error:null});return}l(a),A(fe=>({...fe,[a]:{origin:a,reason:`broker:${G}`,detail:h||null,clientId:n.clientId||L.current[a]||null}}))},[_,w,l]),F=e.useRef({});e.useEffect(()=>{Object.values(m).forEach(n=>{n.status!=="broker"||F.current[n.origin]||(F.current[n.origin]=!0,x(n).finally(()=>{delete F.current[n.origin]}))})},[m,x]);const y=e.useCallback(n=>!T.current||!(n!=null&&n.consent)?Promise.resolve():x(n,{approve:!0}),[x]);e.useEffect(()=>{const n=Z.current;Object.values(m).forEach(t=>{t.status==="silent"&&!n[t.origin]&&(n[t.origin]=setTimeout(()=>{delete n[t.origin],d(t.origin)},pe))}),Object.keys(n).forEach(t=>{(!m[t]||m[t].status!=="silent")&&(clearTimeout(n[t]),delete n[t])})},[m,d]),e.useEffect(()=>()=>{b.current&&b.current(),Object.values(Z.current).forEach(clearTimeout)},[]);const O=e.useCallback(n=>{b.current&&(b.current(),b.current=null);const t=i||ne;b.current=t(n,{onBlocked:()=>{k(s=>s[n.origin]?{...s,[n.origin]:{...s[n.origin],popupBlocked:!0}}:s)},onClosed:()=>{if(n.v2){V&&k(s=>!s[n.origin]||!s[n.origin].silentUrl?s:{...s,[n.origin]:{...s[n.origin],status:"silent"}});return}c(n.origin)}})},[i,c]),D={pending:Object.values(m).filter(n=>n.status==="interactive"),authorize:O,approve:y,complete:_,dismiss:g,originEpochs:$,credentials:I,unsupported:S},K=Object.values(m).filter(n=>n.status==="silent"&&n.silentUrl);return e.createElement(H.Provider,{value:D},r,K.map(n=>e.createElement("iframe",{key:`mm-silent-auth-${n.origin}`,src:n.silentUrl,title:`MachineMetrics silent authorization (${n.origin})`,"aria-hidden":"true",tabIndex:-1,style:{display:"none"}})))};te.propTypes={children:C.node,launcher:C.func,broker:C.func};const re=()=>e.useContext(H),se=r=>{const{originEpochs:i}=e.useContext(H),o=P(r);return o&&i[o]||0},ie=r=>{const{credentials:i}=e.useContext(H),o=P(r);return o&&i[o]||null},oe=r=>{const{unsupported:i}=e.useContext(H),o=P(r);return o&&i[o]||null},ue=({children:r,authorizationLauncher:i,credentialBroker:o})=>{const[f,m]=e.useState({}),[k,$]=e.useState({}),z=e.useRef({}),I=e.useRef({}),M=e.useRef({}),S=e.useCallback((u,l)=>{var c;return!!((c=M.current[u])!=null&&c.has(l))},[]),A=e.useCallback((u,l,c)=>{m(d=>({...d,[u]:{origin:l,frameRef:c}}))},[]),W=e.useCallback(u=>{m(l=>{const c={...l};return delete c[u],c}),$(l=>{const c={...l};return delete c[u],c}),delete M.current[u]},[]);e.useEffect(()=>{const u=(c=[],d,g)=>{c.forEach(E=>E(d,g))},l=c=>{var F,y,O,D,K,n,t;if(!((F=c==null?void 0:c.data)!=null&&F.instanceId))return;const{instanceId:d,type:g}=c.data,E=f[d],_=(O=(y=E==null?void 0:E.frameRef)==null?void 0:y.current)==null?void 0:O.contentWindow;if(!_||c.source!==_||c.origin!==E.origin)return;const w={origin:c.origin},x=z.current;if(g==="response"){const{callbackId:s,response:a,error:h}=c.data,G=I.current[s];G&&(G(a,h),delete I.current[s]);return}if(g==="mark-registered"){const{requestType:s}=c.data;M.current[d]||(M.current[d]=new Set),M.current[d].add(s);return}g==="ready"&&$(s=>({...s,[d]:!0})),u((D=x[d])==null?void 0:D[g],c.data,w),u((K=x["*"])==null?void 0:K[g],c.data,w),u((n=x[d])==null?void 0:n["*"],c.data,w),u((t=x["*"])==null?void 0:t["*"],c.data,w)};return window.addEventListener("message",l),()=>{window.removeEventListener("message",l)}},[f]);const b=e.useCallback((u,l,c)=>{var g,E;const d=f[u];if(!d){console.warn(`Origin not set for id: ${u}. Unable to send message.`);return}(E=(g=d==null?void 0:d.frameRef)==null?void 0:g.current)!=null&&E.contentWindow&&d.frameRef.current.contentWindow.postMessage({type:l,...c,instanceId:u},d.origin)},[f]),Z=e.useRef(0),L=e.useCallback(()=>`${Date.now()}-${++Z.current}`,[]),j=e.useCallback(async(u,l,c={})=>new Promise((d,g)=>{const E=L(),_=(w,x)=>{delete I.current[E],x?g(x):d(w)};I.current[E]=_,b(u,"request",{callbackId:E,requestType:l,data:c})}),[b]),T=e.useCallback((u,l)=>{b(u,"load-options",l)},[b]),U=e.useCallback((u,l)=>{b(u,"validate",l)},[b]),v=e.useMemo(()=>({registerFrame:A,unregisterFrame:W,sendMessage:b,sendRequest:j,loadOptions:T,validate:U,hasHandler:S,readyFrames:k,addListener:(u,l,c)=>(z.current[u]||(z.current[u]={}),z.current[u][l]||(z.current[u][l]=[]),z.current[u][l].push(c),()=>{z.current[u][l]=z.current[u][l].filter(d=>d!==c)})}),[A,W,b,j,T,U,S,k]);return e.createElement(N.Provider,{value:v},e.createElement(te,{launcher:i,broker:o},r))},B=(r,i,o)=>{const f=e.useContext(N);if(f===null)throw new Error("useEmbeddedEffect must be used within a MMEmbeddableZoneProvider");const m=e.useRef(o);e.useEffect(()=>{m.current=o},[o]),e.useEffect(()=>{if(!(!r||!i)){if(i.startsWith("key:")){const k=i.substring(4);return f.readyFrames[r]&&f.sendMessage(r,"subscribe-key",{keyChord:k}),f.addListener(r,`key-pressed:${k}`,(...z)=>m.current(...z))}return f.addListener(r,i,(...k)=>m.current(...k))}},[f,r,i])};ue.propTypes={children:C.node.isRequired,authorizationLauncher:C.func,credentialBroker:C.func};const Q=q.default||q,he=1e4,me="credentials",ce=(r,i)=>`${r}/mm-embedded-interop?id=${i}&origin=${window.location.origin}&caps=${me}`,ge=Q.iframe`
+(function(m,t){typeof exports=="object"&&typeof module!="undefined"?t(exports,require("react"),require("prop-types"),require("styled-components")):typeof define=="function"&&define.amd?define(["exports","react","prop-types","styled-components"],t):(m=typeof globalThis!="undefined"?globalThis:m||self,t(m["mm-react-embeddable"]={},m.React,m.PropTypes,m.styled))})(this,(function(m,t,me,ge){"use strict";const Q=n=>n&&n.__esModule?n:{default:n},g=Q(t),w=Q(me),B=Q(ge),N=t.createContext(null),H=t.createContext({pending:[],authorize:()=>{},approve:()=>{},complete:()=>{},dismiss:()=>{},originEpochs:{},credentials:{},unsupported:{}}),ee="access_token",X=n=>n?n.kind?n:n.accessToken?{kind:ee,accessToken:n.accessToken,expiresAt:n.expiresAt||null}:null:null,Ee=new Set(["host_not_allowed","invalid_token","provider_unavailable"]),J=typeof window!="undefined"&&window.location.protocol==="https:",ke=8e3,V=n=>{try{return new URL(n).origin}catch{return null}},te=(n,o)=>{const u=o==null?void 0:o.origin;return!u||V(n==null?void 0:n.authUrl)!==u?null:u},ne=n=>{if(!n||/^\d{1,3}(?:\.\d{1,3}){3}$/.test(n)||n.includes(":"))return n;const o=n.split(".");return o.length<=2?n:o.slice(-2).join(".")},re=(n,o)=>{try{const u=new URL(n),f=new URL(o);return u.protocol!==f.protocol?!0:ne(u.hostname)!==ne(f.hostname)}catch{return!0}},se=(n,{onBlocked:o,onClosed:u})=>{const f=window.open(n.authUrl,"mm-embed-auth","popup,width=600,height=700");if(!f)return o(),()=>{};const p=setInterval(()=>{f.closed&&(clearInterval(p),u())},1e3);return()=>clearInterval(p)},oe=({children:n,launcher:o,broker:u})=>{const f=t.useContext(N),[p,E]=t.useState({}),[v,x]=t.useState({}),[_,M]=t.useState({}),[U,A]=t.useState({}),Z=t.useRef(_);Z.current=_;const k=t.useRef(p);k.current=p;const S=t.useRef(null),K=t.useRef({}),y=t.useRef({}),q=t.useRef({}),F=t.useRef(u);F.current=u;const z=t.useCallback(e=>{const r=y.current[e];if(!r)return;const s=a=>!a[e]||a[e].clientId?a:{...a,[e]:{...a[e],clientId:r}};E(s),A(s)},[]),l=t.useCallback((e,r)=>{e&&(A(s=>s[e]?s:{...s,[e]:{origin:e,reason:r,clientId:y.current[e]||null}}),z(e))},[z]),c=t.useCallback((e,{v2:r=!1,origin:s=null}={})=>{s&&(r&&Z.current[s]||(E(a=>a[s]?a:{...a,[s]:{origin:s,authUrl:e.authUrl,silentUrl:e.silentUrl||null,status:r&&F.current?"broker":r&&e.silentUrl&&J?"silent":"interactive",v2:r,scope:e.scope||null,acceptsCredentials:q.current[s]||null,consent:null,error:null,clientId:e.clientId||y.current[s]||null,popupBlocked:!1}}),z(s)))},[z]),i=t.useCallback(e=>{E(r=>{if(!r[e])return r;const s={...r};return delete s[e],s})},[]),d=t.useCallback(e=>{e&&(i(e),x(r=>({...r,[e]:(r[e]||0)+1})))},[i]),b=t.useCallback(e=>{E(r=>!r[e]||r[e].status==="interactive"?r:{...r,[e]:{...r[e],status:"interactive"}})},[]),C=t.useCallback(e=>{i(e.origin)},[i]),O=t.useCallback((e,r)=>{const s=te(e,r);if(s){if(re(s,window.location.origin)){l(s,"cross-site-legacy");return}c(e,{origin:s})}},[c,l]);t.useEffect(()=>{if(!f)return;const e=[f.addListener("*","init",(r,s)=>{s!=null&&s.origin&&(r!=null&&r.clientId)&&(y.current[s.origin]=r.clientId,z(s.origin)),s!=null&&s.origin&&Array.isArray(r==null?void 0:r.acceptsCredentials)&&(q.current[s.origin]=r.acceptsCredentials)}),f.addListener("*","authorize",O),f.addListener("*","login",O),f.addListener("*","credential-request",(r,s)=>c(r,{v2:!0,origin:te(r,s)}))];return()=>e.forEach(r=>r())},[f,O,c,z]),t.useEffect(()=>{const e=r=>{const s=r==null?void 0:r.data;if(!s||s.type!=="authorized"&&s.type!=="authorize-failed")return;const a=V(s.authUrl);if(!(!a||r.origin!==a)){if(s.type==="authorized"){if(s.accessToken){if(!k.current[a])return;M(h=>({...h,[a]:X({accessToken:s.accessToken})})),i(a)}else d(a);return}b(a)}};return window.addEventListener("message",e),()=>window.removeEventListener("message",e)},[i,d,b]);const I=t.useCallback((e,r)=>{const s=e==null?void 0:e.origin,a=X(r);!s||!a||(M(h=>({...h,[s]:a})),i(s))},[i]),T=t.useCallback((e,r)=>{E(s=>s[e]?{...s,[e]:{...s[e],...r}}:s)},[]),L=t.useCallback(async(e,{approve:r}={})=>{const s=F.current,{origin:a}=e;let h;try{h=await s({origin:a,clientId:e.clientId,scope:e.scope,authUrl:e.authUrl},{approve:r})}catch{r?T(a,{error:{reason:"broker_unavailable"}}):T(a,{status:e.silentUrl&&J?"silent":"interactive"});return}if((h==null?void 0:h.status)===200&&h.credential){I(e,h.credential);return}if((h==null?void 0:h.status)===409&&h.consentRequired){T(a,{status:"interactive",consent:{client:h.client||null,stepUp:!!h.stepUp,scope:h.scope||e.scope},error:null});return}const R=(h==null?void 0:h.error)||"broker_error";if(!r&&Ee.has(R)){T(a,{status:e.silentUrl&&J?"silent":"interactive"});return}if(r&&R==="consent_denied"){T(a,{error:null});return}i(a),A(he=>({...he,[a]:{origin:a,reason:`broker:${R}`,detail:h||null,clientId:e.clientId||y.current[a]||null}}))},[I,T,i]),j=t.useRef({});t.useEffect(()=>{Object.values(p).forEach(e=>{e.status!=="broker"||j.current[e.origin]||(j.current[e.origin]=!0,L(e).finally(()=>{delete j.current[e.origin]}))})},[p,L]);const $=t.useCallback(e=>!F.current||!(e!=null&&e.consent)?Promise.resolve():L(e,{approve:!0}),[L]);t.useEffect(()=>{const e=K.current;Object.values(p).forEach(r=>{r.status==="silent"&&!e[r.origin]&&(e[r.origin]=setTimeout(()=>{delete e[r.origin],b(r.origin)},ke))}),Object.keys(e).forEach(r=>{(!p[r]||p[r].status!=="silent")&&(clearTimeout(e[r]),delete e[r])})},[p,b]),t.useEffect(()=>()=>{S.current&&S.current(),Object.values(K.current).forEach(clearTimeout)},[]);const D=t.useCallback(e=>{S.current&&(S.current(),S.current=null);const r=o||se;S.current=r(e,{onBlocked:()=>{E(s=>s[e.origin]?{...s,[e.origin]:{...s[e.origin],popupBlocked:!0}}:s)},onClosed:()=>{if(e.v2){J&&E(s=>!s[e.origin]||!s[e.origin].silentUrl?s:{...s,[e.origin]:{...s[e.origin],status:"silent"}});return}d(e.origin)}})},[o,d]),G={pending:Object.values(p).filter(e=>e.status==="interactive"),authorize:D,approve:$,complete:I,dismiss:C,originEpochs:v,credentials:_,unsupported:U},P=Object.values(p).filter(e=>e.status==="silent"&&e.silentUrl);return g.default.createElement(H.Provider,{value:G},n,P.map(e=>g.default.createElement("iframe",{key:`mm-silent-auth-${e.origin}`,src:e.silentUrl,title:`MachineMetrics silent authorization (${e.origin})`,"aria-hidden":"true",tabIndex:-1,style:{display:"none"}})))};oe.propTypes={children:w.default.node,launcher:w.default.func,broker:w.default.func};const ie=()=>t.useContext(H),ue=n=>{const{originEpochs:o}=t.useContext(H),u=V(n);return u&&o[u]||0},le=n=>{const{credentials:o}=t.useContext(H),u=V(n);return u&&o[u]||null},ce=n=>{const{unsupported:o}=t.useContext(H),u=V(n);return u&&o[u]||null},ae=({children:n,authorizationLauncher:o,credentialBroker:u})=>{const[f,p]=t.useState({}),[E,v]=t.useState({}),x=t.useRef({}),_=t.useRef({}),M=t.useRef({}),U=t.useCallback((l,c)=>{var i;return!!((i=M.current[l])!=null&&i.has(c))},[]),A=t.useCallback((l,c,i)=>{p(d=>({...d,[l]:{origin:c,frameRef:i}}))},[]),Z=t.useCallback(l=>{p(c=>{const i={...c};return delete i[l],i}),v(c=>{const i={...c};return delete i[l],i}),delete M.current[l]},[]);t.useEffect(()=>{const l=(i=[],d,b)=>{i.forEach(C=>C(d,b))},c=i=>{var L,j,$,D,G,P,e;if(!((L=i==null?void 0:i.data)!=null&&L.instanceId))return;const{instanceId:d,type:b}=i.data,C=f[d],O=($=(j=C==null?void 0:C.frameRef)==null?void 0:j.current)==null?void 0:$.contentWindow;if(!O||i.source!==O||i.origin!==C.origin)return;const I={origin:i.origin},T=x.current;if(b==="response"){const{callbackId:r,response:s,error:a}=i.data,h=_.current[r];h&&(h(s,a),delete _.current[r]);return}if(b==="mark-registered"){const{requestType:r}=i.data;M.current[d]||(M.current[d]=new Set),M.current[d].add(r);return}b==="ready"&&v(r=>({...r,[d]:!0})),l((D=T[d])==null?void 0:D[b],i.data,I),l((G=T["*"])==null?void 0:G[b],i.data,I),l((P=T[d])==null?void 0:P["*"],i.data,I),l((e=T["*"])==null?void 0:e["*"],i.data,I)};return window.addEventListener("message",c),()=>{window.removeEventListener("message",c)}},[f]);const k=t.useCallback((l,c,i)=>{var b,C;const d=f[l];if(!d){console.warn(`Origin not set for id: ${l}. Unable to send message.`);return}(C=(b=d==null?void 0:d.frameRef)==null?void 0:b.current)!=null&&C.contentWindow&&d.frameRef.current.contentWindow.postMessage({type:c,...i,instanceId:l},d.origin)},[f]),S=t.useRef(0),K=t.useCallback(()=>`${Date.now()}-${++S.current}`,[]),y=t.useCallback(async(l,c,i={})=>new Promise((d,b)=>{const C=K(),O=(I,T)=>{delete _.current[C],T?b(T):d(I)};_.current[C]=O,k(l,"request",{callbackId:C,requestType:c,data:i})}),[k]),q=t.useCallback((l,c)=>{k(l,"load-options",c)},[k]),F=t.useCallback((l,c)=>{k(l,"validate",c)},[k]),z=t.useMemo(()=>({registerFrame:A,unregisterFrame:Z,sendMessage:k,sendRequest:y,loadOptions:q,validate:F,hasHandler:U,readyFrames:E,addListener:(l,c,i)=>(x.current[l]||(x.current[l]={}),x.current[l][c]||(x.current[l][c]=[]),x.current[l][c].push(i),()=>{x.current[l][c]=x.current[l][c].filter(d=>d!==i)})}),[A,Z,k,y,q,F,U,E]);return g.default.createElement(N.Provider,{value:z},g.default.createElement(oe,{launcher:o,broker:u},n))},W=(n,o,u)=>{const f=t.useContext(N);if(f===null)throw new Error("useEmbeddedEffect must be used within a MMEmbeddableZoneProvider");const p=t.useRef(u);t.useEffect(()=>{p.current=u},[u]),t.useEffect(()=>{if(!(!n||!o)){if(o.startsWith("key:")){const E=o.substring(4);return f.readyFrames[n]&&f.sendMessage(n,"subscribe-key",{keyChord:E}),f.addListener(n,`key-pressed:${E}`,(...x)=>p.current(...x))}return f.addListener(n,o,(...E)=>p.current(...E))}},[f,n,o])};ae.propTypes={children:w.default.node.isRequired,authorizationLauncher:w.default.func,credentialBroker:w.default.func};const Y=B.default.default||B.default,Ce=1e4,we="credentials",de=(n,o)=>`${n}/mm-embedded-interop?id=${encodeURIComponent(o)}&origin=${encodeURIComponent(window.location.origin)}&caps=${we}`,Te=Y.iframe`
   width: 100%;
   height: 100%;
   border: none;
-  visibility: ${r=>r.$isReady?"visible":"hidden"};
-`,Ee=Q.div`
+  visibility: ${n=>n.$isReady?"visible":"hidden"};
+`,xe=Y.div`
   width: 100%;
   height: 100%;
   display: flex;
@@ -16,13 +16,13 @@
   text-align: center;
   color: #555;
   font-size: 14px;
-`,le=r=>{const i=r&&r.origin||"This app",o=r&&r.reason||"";switch(o){case"broker:scope_above_ceiling":return{title:`${i} can’t be authorized here`,detail:"It asks for permissions your role doesn’t have."};case"broker:origin_mismatch":case"broker:unknown_client":return{title:`${i} can’t be authorized here`,detail:"It isn’t registered to run at this address."};case"broker:cross_company_principal":return{title:`${i} can’t be authorized here`,detail:"It can’t be authorized for this account."};default:return o.startsWith("broker:")?{title:`${i} can’t be authorized here`,detail:"Authorization was refused."}:{title:`${i} can’t be embedded here`,detail:"It needs an update to support embedding from a different domain."}}},ae=({entry:r})=>{const i=le(r);return e.createElement(Ee,{"data-reason":r&&r.reason||void 0},e.createElement("div",{style:{fontWeight:600}},i.title),e.createElement("div",{style:{fontSize:12,color:"#888"}},i.detail))};ae.propTypes={entry:C.shape({origin:C.string,name:C.string,reason:C.string,detail:C.object})};const ke=Q.div`
+`,fe=n=>{const o=n&&n.origin||"This app",u=n&&n.reason||"";switch(u){case"broker:scope_above_ceiling":return{title:`${o} can’t be authorized here`,detail:"It asks for permissions your role doesn’t have."};case"broker:origin_mismatch":case"broker:unknown_client":return{title:`${o} can’t be authorized here`,detail:"It isn’t registered to run at this address."};case"broker:cross_company_principal":return{title:`${o} can’t be authorized here`,detail:"It can’t be authorized for this account."};default:return u.startsWith("broker:")?{title:`${o} can’t be authorized here`,detail:"Authorization was refused."}:{title:`${o} can’t be embedded here`,detail:"It needs an update to support embedding from a different domain."}}},pe=({entry:n})=>{const o=fe(n);return g.default.createElement(xe,{"data-reason":n&&n.reason||void 0},g.default.createElement("div",{style:{fontWeight:600}},o.title),g.default.createElement("div",{style:{fontSize:12,color:"#888"}},o.detail))};pe.propTypes={entry:w.default.shape({origin:w.default.string,name:w.default.string,reason:w.default.string,detail:w.default.object})};const Ie=Y.div`
   height: 100%;
   display: flex;
   flex: 1;
   align-items: center;
   justify-content: center;
-`,Ce=()=>e.createElement(ke,null,e.createElement("div",{style:{textAlign:"center"}},"This app couldn’t be loaded as an embeddable widget.")),de=({id:r,src:i,path:o,onInit:f=()=>{},onTimeout:m,context:k={},params:$={},renderUnsupported:z,renderTimeout:I,...M})=>{if("isConfiguring"in M)return console.error("isConfiguring must be passed via the params prop to MMEmbeddableZone"),null;if("colorMode"in k)return console.error("colorMode must be passed via the params prop to MMEmbeddableZone"),null;if("isFullScreen"in k)return console.error("isFullScreen must be passed via the params prop to MMEmbeddableZone"),null;const S=e.useRef(),[A,W]=e.useState(),[b,Z]=e.useState(0),[L,j]=e.useState(!1),[T,U]=e.useState(!1),v=se(i),u=ie(i),l=oe(i);e.useEffect(()=>{v>0&&Z(0)},[v]);const{registerFrame:c,unregisterFrame:d,sendMessage:g}=e.useContext(N),[E,_]=e.useState(),w=e.useRef(),x=e.useRef(m),F=e.useRef(f),y=e.useRef(!1);e.useEffect(()=>{x.current=m},[m]),e.useEffect(()=>{F.current=f},[f]),e.useEffect(()=>{b&&g(r,"set-context",{context:{...k}})},[k,r,b]),e.useEffect(()=>{b&&g(r,"set-params",{params:$})},[$,r,b]),e.useEffect(()=>{o!==void 0&&_((o==null?void 0:o.indexOf("/"))===0?o:`/${o}`)},[o]),e.useEffect(()=>{E===void 0||!b||g(r,"navigate",{path:E})},[E,b,r,g]),e.useEffect(()=>{if(!i||!r||!S)return;const t=new URL(i);return c(r,t.origin,S),F.current(),W(ce(t.origin,r)),()=>{d(r)}},[i,r,c,S]),e.useEffect(()=>{if(!(!A||y.current))return w.current=setTimeout(()=>{j(!0),x.current&&x.current()},he),()=>clearTimeout(w.current)},[A]);const O=e.useCallback(()=>{y.current=!0,clearTimeout(w.current),j(!1)},[]),[D,K]=e.useState(null);B(r,"init",t=>{O(),Array.isArray(t==null?void 0:t.acceptsCredentials)&&K(t.acceptsCredentials)}),B(r,"authorize",O),B(r,"login",O),B(r,"credential-request",()=>{O(),U(!0)}),e.useEffect(()=>{if(!T||!u)return;const t=D;if(Array.isArray(t)&&!t.includes(u.kind))return;const s=u.kind==="access_token"?{accessToken:u.accessToken}:{};g(r,"credential",{...s,credential:u})},[T,u,D,r,g]),B(r,"ready",()=>{O(),Z(t=>t+1)});const n=e.useRef();return B(r,"heartbeat",()=>{n.current&&clearTimeout(n.current),n.current=setTimeout(()=>{if(S.current){const t=new URL(i);S.current.src=ce(t.origin,r)}},6e3)}),e.useEffect(()=>()=>{n.current&&clearTimeout(n.current)},[]),l?z?z(l):e.createElement(ae,{entry:l}):L&&!b?I?I():e.createElement(Ce,null):e.createElement(ge,{key:`auth-epoch-${v}`,$isReady:b,ref:S,src:A,...M})};de.propTypes={id:C.string,src:C.string.isRequired,path:C.string,onInit:C.func,onTimeout:C.func,renderUnsupported:C.func,renderTimeout:C.func};const we=q.div`
+`,ze=()=>g.default.createElement(Ie,null,g.default.createElement("div",{style:{textAlign:"center"}},"This app couldn’t be loaded as an embeddable widget.")),be=({id:n,src:o,path:u,onInit:f=()=>{},onTimeout:p,context:E={},params:v={},renderUnsupported:x,renderTimeout:_,...M})=>{if("isConfiguring"in M)return console.error("isConfiguring must be passed via the params prop to MMEmbeddableZone"),null;if("colorMode"in E)return console.error("colorMode must be passed via the params prop to MMEmbeddableZone"),null;if("isFullScreen"in E)return console.error("isFullScreen must be passed via the params prop to MMEmbeddableZone"),null;const U=t.useRef(),[A,Z]=t.useState(),[k,S]=t.useState(0),[K,y]=t.useState(!1),[q,F]=t.useState(!1),z=ue(o),l=le(o),c=ce(o);t.useEffect(()=>{z>0&&S(0)},[z]);const{registerFrame:i,unregisterFrame:d,sendMessage:b}=t.useContext(N),[C,O]=t.useState(),I=t.useRef(),T=t.useRef(p),L=t.useRef(f),j=t.useRef(!1);t.useEffect(()=>{T.current=p},[p]),t.useEffect(()=>{L.current=f},[f]),t.useEffect(()=>{k&&b(n,"set-context",{context:{...E}})},[E,n,k]),t.useEffect(()=>{k&&b(n,"set-params",{params:v})},[v,n,k]),t.useEffect(()=>{u!==void 0&&O((u==null?void 0:u.indexOf("/"))===0?u:`/${u}`)},[u]),t.useEffect(()=>{C===void 0||!k||b(n,"navigate",{path:C})},[C,k,n,b]),t.useEffect(()=>{if(!o||!n||!U)return;const e=new URL(o);return i(n,e.origin,U),L.current(),Z(de(e.origin,n)),()=>{d(n)}},[o,n,i,U]),t.useEffect(()=>{if(!(!A||j.current))return I.current=setTimeout(()=>{y(!0),T.current&&T.current()},Ce),()=>clearTimeout(I.current)},[A]);const $=t.useCallback(()=>{j.current=!0,clearTimeout(I.current),y(!1)},[]),[D,G]=t.useState(null);W(n,"init",e=>{$(),Array.isArray(e==null?void 0:e.acceptsCredentials)&&G(e.acceptsCredentials)}),W(n,"authorize",$),W(n,"login",$),W(n,"credential-request",()=>{$(),F(!0)}),t.useEffect(()=>{if(!q||!l)return;const e=D;if(Array.isArray(e)&&!e.includes(l.kind))return;const r=l.kind==="access_token"?{accessToken:l.accessToken}:{};b(n,"credential",{...r,credential:l})},[q,l,D,n,b]),W(n,"ready",()=>{$(),S(e=>e+1)});const P=t.useRef();return W(n,"heartbeat",()=>{P.current&&clearTimeout(P.current),P.current=setTimeout(()=>{if(U.current){const e=new URL(o);U.current.src=de(e.origin,n)}},6e3)}),t.useEffect(()=>()=>{P.current&&clearTimeout(P.current)},[]),c?x?x(c):g.default.createElement(pe,{entry:c}):K&&!k?_?_():g.default.createElement(ze,null):g.default.createElement(Te,{key:`auth-epoch-${z}`,$isReady:k,ref:U,src:A,...M})};be.propTypes={id:w.default.string,src:w.default.string.isRequired,path:w.default.string,onInit:w.default.func,onTimeout:w.default.func,renderUnsupported:w.default.func,renderTimeout:w.default.func};const _e=B.default.div`
   position: fixed;
   inset: 0;
   background: rgba(0, 0, 0, 0.45);
@@ -30,7 +30,7 @@
   align-items: center;
   justify-content: center;
   z-index: 10000;
-`,xe=q.div`
+`,Me=B.default.div`
   background: #fff;
   border-radius: 8px;
   box-shadow: 0 4px 24px rgba(0, 0, 0, 0.2);
@@ -39,13 +39,13 @@
   max-width: calc(100vw - 32px);
   font-family: sans-serif;
   color: #222;
-`,ze=q.div`
+`,Ue=B.default.div`
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 10px 0;
   gap: 16px;
-`,Ie=q.button`
+`,Se=B.default.button`
   background: #16a500;
   color: #fff;
   border: none;
@@ -54,8 +54,8 @@
   font-size: 14px;
   cursor: pointer;
   white-space: nowrap;
-`,Me=q.p`
+`,ye=B.default.p`
   color: #b3261e;
   font-size: 13px;
   margin: 4px 0 0;
-`,Se=()=>{const{pending:r,authorize:i}=re();return r.length===0?null:e.createElement(we,null,e.createElement(xe,null,e.createElement("h3",{style:{margin:"0 0 8px"}},"Authorization Required"),e.createElement("p",{style:{margin:"0 0 12px",fontSize:14,color:"#555"}},"The following apps need you to sign in and authorize them before they can load."),r.map(o=>e.createElement("div",{key:o.origin},e.createElement(ze,null,e.createElement("div",null,e.createElement("div",{style:{fontWeight:600}},o.origin)),e.createElement(Ie,{onClick:()=>i(o)},"Authorize")),o.popupBlocked&&e.createElement(Me,null,"The sign-in window was blocked. Allow popups for this site, then try again.")))))};p.CREDENTIAL_KIND_ACCESS_TOKEN=X,p.EmbeddedAuthorizationContext=H,p.EmbeddedAuthorizationPrompt=Se,p.MMEmbeddableZone=de,p.MMEmbeddableZoneContext=N,p.MMEmbeddableZoneProvider=ue,p.isCrossSite=ee,p.normalizeCredential=J,p.popupAuthorizationLauncher=ne,p.unsupportedCopy=le,p.useEmbeddedAuthorizations=re,p.useEmbeddedCredential=ie,p.useEmbeddedEffect=B,p.useEmbeddedOriginEpoch=se,p.useEmbeddedUnsupported=oe,Object.defineProperty(p,Symbol.toStringTag,{value:"Module"})}));
+`,Ae=()=>{const{pending:n,authorize:o}=ie();return n.length===0?null:g.default.createElement(_e,null,g.default.createElement(Me,null,g.default.createElement("h3",{style:{margin:"0 0 8px"}},"Authorization Required"),g.default.createElement("p",{style:{margin:"0 0 12px",fontSize:14,color:"#555"}},"The following apps need you to sign in and authorize them before they can load."),n.map(u=>g.default.createElement("div",{key:u.origin},g.default.createElement(Ue,null,g.default.createElement("div",null,g.default.createElement("div",{style:{fontWeight:600}},u.origin)),g.default.createElement(Se,{onClick:()=>o(u)},"Authorize")),u.popupBlocked&&g.default.createElement(ye,null,"The sign-in window was blocked. Allow popups for this site, then try again.")))))};m.CREDENTIAL_KIND_ACCESS_TOKEN=ee,m.EmbeddedAuthorizationContext=H,m.EmbeddedAuthorizationPrompt=Ae,m.MMEmbeddableZone=be,m.MMEmbeddableZoneContext=N,m.MMEmbeddableZoneProvider=ae,m.isCrossSite=re,m.normalizeCredential=X,m.popupAuthorizationLauncher=se,m.unsupportedCopy=fe,m.useEmbeddedAuthorizations=ie,m.useEmbeddedCredential=le,m.useEmbeddedEffect=W,m.useEmbeddedOriginEpoch=ue,m.useEmbeddedUnsupported=ce,Object.defineProperty(m,Symbol.toStringTag,{value:"Module"})}));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@machinemetrics/mm-react-embeddable",
-  "version": "1.4.0-7",
+  "version": "2.0.0-0",
   "license": "MIT",
   "module": "dist/mm-react-embeddable.es.js",
   "main": "dist/mm-react-embeddable.cjs.js",
@@ -44,4 +44,4 @@
     "vite": "^7.2.2",
     "vitest": "^4.0.10"
   }
-}
+}