@machinemetrics/mm-react-embeddable 2.0.0-1 → 2.0.0-2

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

@@ -1,9 +1,9 @@
-(function(h,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):(h=typeof globalThis!="undefined"?globalThis:h||self,t(h["mm-react-embeddable"]={},h.React,h.PropTypes,h.styled))})(this,(function(h,t,he,me){"use strict";const Q=n=>n&&n.__esModule?n:{default:n},m=Q(t),w=Q(he),W=Q(me),N=t.createContext(null),K=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,ge=new Set(["host_not_allowed","invalid_token","provider_unavailable"]),J=typeof window!="undefined"&&window.location.protocol==="https:",Ee=8e3,V=n=>{try{return new URL(n).origin}catch{return null}},te=(n,o)=>{const l=o==null?void 0:o.origin;return!l||V(n==null?void 0:n.authUrl)!==l?null:l},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 l=new URL(n),f=new URL(o);return l.protocol!==f.protocol?!0:ne(l.hostname)!==ne(f.hostname)}catch{return!0}},se=(n,{onBlocked:o,onClosed:l})=>{const f=window.open(n.authUrl,"mm-embed-auth","popup,width=600,height=700");if(!f)return o(),()=>{};const b=setInterval(()=>{f.closed&&(clearInterval(b),l())},1e3);return()=>clearInterval(b)},oe=({children:n,launcher:o,broker:l})=>{const f=t.useContext(N),[b,E]=t.useState({}),[F,x]=t.useState({}),[M,S]=t.useState({}),[$,O]=t.useState({}),D=t.useRef(M);D.current=M;const k=t.useRef(b);k.current=b;const U=t.useRef(null),G=t.useRef({}),z=t.useRef({}),j=t.useRef({}),L=t.useRef(l);L.current=l;const I=t.useCallback(e=>{const r=z.current[e];if(!r)return;const s=u=>!u[e]||u[e].clientId?u:{...u,[e]:{...u[e],clientId:r}};E(s),O(s)},[]),c=t.useCallback((e,r)=>{e&&(O(s=>s[e]?s:{...s,[e]:{origin:e,reason:r,clientId:z.current[e]||null}}),I(e))},[I]),a=t.useCallback((e,{v2:r=!1,origin:s=null}={})=>{s&&(r&&D.current[s]||(E(u=>u[s]?u:{...u,[s]:{origin:s,authUrl:e.authUrl,silentUrl:e.silentUrl||null,status:r&&L.current?"broker":r&&e.silentUrl&&J?"silent":"interactive",v2:r,scope:e.scope||null,acceptsCredentials:j.current[s]||null,consent:null,error:null,clientId:e.clientId||z.current[s]||null,popupBlocked:!1}}),I(s)))},[I]),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]),C=t.useCallback(e=>{E(r=>!r[e]||r[e].status==="interactive"?r:{...r,[e]:{...r[e],status:"interactive"}})},[]),T=t.useCallback(e=>{i(e.origin)},[i]),y=t.useCallback((e,r)=>{const s=te(e,r);if(s){if(re(s,window.location.origin)){c(s,"cross-site-legacy");return}a(e,{origin:s})}},[a,c]);t.useEffect(()=>{if(!f)return;const e=[f.addListener("*","init",(r,s)=>{s!=null&&s.origin&&(r!=null&&r.clientId)&&(z.current[s.origin]=r.clientId,I(s.origin)),s!=null&&s.origin&&Array.isArray(r==null?void 0:r.acceptsCredentials)&&(j.current[s.origin]=r.acceptsCredentials)}),f.addListener("*","authorize",y),f.addListener("*","login",y),f.addListener("*","credential-request",(r,s)=>a(r,{v2:!0,origin:te(r,s)}))];return()=>e.forEach(r=>r())},[f,y,a,I]),t.useEffect(()=>{const e=r=>{const s=r==null?void 0:r.data;if(!s||s.type!=="authorized"&&s.type!=="authorize-failed")return;const u=V(s.authUrl);if(!(!u||r.origin!==u)){if(s.type==="authorized"){if(s.accessToken){if(!k.current[u])return;S(p=>({...p,[u]:X({accessToken:s.accessToken})})),i(u)}else d(u);return}C(u)}};return window.addEventListener("message",e),()=>window.removeEventListener("message",e)},[i,d,C]);const _=t.useCallback((e,r)=>{const s=e==null?void 0:e.origin,u=X(r);!s||!u||(S(p=>({...p,[s]:u})),i(s))},[i]),g=t.useCallback((e,r)=>{E(s=>s[e]?{...s,[e]:{...s[e],...r}}:s)},[]),A=t.useCallback(async(e,{approve:r}={})=>{const s=L.current,{origin:u}=e;let p;try{p=await s({origin:u,clientId:e.clientId,scope:e.scope,authUrl:e.authUrl},{approve:r})}catch{r?g(u,{error:{reason:"broker_unavailable"}}):g(u,{status:e.silentUrl&&J?"silent":"interactive"});return}if((p==null?void 0:p.status)===200&&p.credential){_(e,p.credential);return}if((p==null?void 0:p.status)===409&&p.consentRequired){g(u,{status:"interactive",consent:{client:p.client||null,stepUp:!!p.stepUp,scope:p.scope||e.scope},error:null});return}const R=(p==null?void 0:p.error)||"broker_error";if(!r&&ge.has(R)){g(u,{status:e.silentUrl&&J?"silent":"interactive"});return}if(r&&R==="consent_denied"){g(u,{error:null});return}i(u),O(be=>({...be,[u]:{origin:u,reason:`broker:${R}`,detail:p||null,clientId:e.clientId||z.current[u]||null}}))},[_,g,i]),v=t.useRef({});t.useEffect(()=>{Object.values(b).forEach(e=>{e.status!=="broker"||v.current[e.origin]||(v.current[e.origin]=!0,A(e).finally(()=>{delete v.current[e.origin]}))})},[b,A]);const P=t.useCallback(e=>!L.current||!(e!=null&&e.consent)?Promise.resolve():A(e,{approve:!0}),[A]);t.useEffect(()=>{const e=G.current;Object.values(b).forEach(r=>{r.status==="silent"&&!e[r.origin]&&(e[r.origin]=setTimeout(()=>{delete e[r.origin],C(r.origin)},Ee))}),Object.keys(e).forEach(r=>{(!b[r]||b[r].status!=="silent")&&(clearTimeout(e[r]),delete e[r])})},[b,C]),t.useEffect(()=>()=>{U.current&&U.current(),Object.values(G.current).forEach(clearTimeout)},[]);const q=t.useCallback(e=>{U.current&&(U.current(),U.current=null);const r=o||se;U.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]),H={pending:Object.values(b).filter(e=>e.status==="interactive"),authorize:q,approve:P,complete:_,dismiss:T,originEpochs:F,credentials:M,unsupported:$},B=Object.values(b).filter(e=>e.status==="silent"&&e.silentUrl);return m.default.createElement(K.Provider,{value:H},n,B.map(e=>m.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(K),ue=n=>{const{originEpochs:o}=t.useContext(K),l=V(n);return l&&o[l]||0},le=n=>{const{credentials:o}=t.useContext(K),l=V(n);return l&&o[l]||null},ce=n=>{const{unsupported:o}=t.useContext(K),l=V(n);return l&&o[l]||null},ae=({children:n,authorizationLauncher:o,credentialBroker:l})=>{const[f,b]=t.useState({}),[E,F]=t.useState({}),x=t.useRef({}),M=t.useRef({}),S=t.useRef({}),$=t.useCallback((c,a)=>{var i;return!!((i=S.current[c])!=null&&i.has(a))},[]),O=t.useCallback((c,a,i)=>{b(d=>({...d,[c]:{origin:a,frameRef:i}}))},[]),D=t.useCallback(c=>{b(a=>{const i={...a};return delete i[c],i}),F(a=>{const i={...a};return delete i[c],i}),delete S.current[c]},[]);t.useEffect(()=>{const c=(i=[],d,C)=>{i.forEach(T=>T(d,C))},a=i=>{var A,v,P,q,H,B,e;if(!((A=i==null?void 0:i.data)!=null&&A.instanceId))return;const{instanceId:d,type:C}=i.data,T=f[d],y=(P=(v=T==null?void 0:T.frameRef)==null?void 0:v.current)==null?void 0:P.contentWindow;if(!y||i.source!==y||i.origin!==T.origin)return;const _={origin:i.origin},g=x.current;if(C==="response"){const{callbackId:r,response:s,error:u}=i.data,p=M.current[r];p&&(p(s,u),delete M.current[r]);return}if(C==="mark-registered"){const{requestType:r}=i.data;S.current[d]||(S.current[d]=new Set),S.current[d].add(r);return}C==="ready"&&F(r=>({...r,[d]:!0})),c((q=g[d])==null?void 0:q[C],i.data,_),c((H=g["*"])==null?void 0:H[C],i.data,_),c((B=g[d])==null?void 0:B["*"],i.data,_),c((e=g["*"])==null?void 0:e["*"],i.data,_)};return window.addEventListener("message",a),()=>{window.removeEventListener("message",a)}},[f]);const k=t.useCallback((c,a,i)=>{var C,T;const d=f[c];if(!d){console.warn(`Origin not set for id: ${c}. Unable to send message.`);return}(T=(C=d==null?void 0:d.frameRef)==null?void 0:C.current)!=null&&T.contentWindow&&d.frameRef.current.contentWindow.postMessage({type:a,...i,instanceId:c},d.origin)},[f]),U=t.useRef(0),G=t.useCallback(()=>`${Date.now()}-${++U.current}`,[]),z=t.useCallback(async(c,a,i={})=>new Promise((d,C)=>{const T=G(),y=(_,g)=>{delete M.current[T],g?C(g):d(_)};M.current[T]=y,k(c,"request",{callbackId:T,requestType:a,data:i})}),[k]),j=t.useCallback((c,a)=>{k(c,"load-options",a)},[k]),L=t.useCallback((c,a)=>{k(c,"validate",a)},[k]),I=t.useMemo(()=>({registerFrame:O,unregisterFrame:D,sendMessage:k,sendRequest:z,loadOptions:j,validate:L,hasHandler:$,readyFrames:E,addListener:(c,a,i)=>(x.current[c]||(x.current[c]={}),x.current[c][a]||(x.current[c][a]=[]),x.current[c][a].push(i),()=>{x.current[c][a]=x.current[c][a].filter(d=>d!==i)})}),[O,D,k,z,j,L,$,E]);return m.default.createElement(N.Provider,{value:I},m.default.createElement(oe,{launcher:o,broker:l},n))},Z=(n,o,l)=>{const f=t.useContext(N);if(f===null)throw new Error("useEmbeddedEffect must be used within a MMEmbeddableZoneProvider");const b=t.useRef(l);t.useEffect(()=>{b.current=l},[l]),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)=>b.current(...x))}return f.addListener(n,o,(...E)=>b.current(...E))}},[f,n,o])};ae.propTypes={children:w.default.node.isRequired,authorizationLauncher:w.default.func,credentialBroker:w.default.func};const Y=W.default.default||W.default,ke=1e4,Ce="credentials",we=(n,o)=>`${n}/mm-embedded-interop?id=${encodeURIComponent(o)}&origin=${encodeURIComponent(window.location.origin)}&caps=${Ce}`,Te=Y.iframe`
+(function(g,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):(g=typeof globalThis!="undefined"?globalThis:g||self,t(g["mm-react-embeddable"]={},g.React,g.PropTypes,g.styled))})(this,(function(g,t,ge,Ee){"use strict";const Q=n=>n&&n.__esModule?n:{default:n},E=Q(t),y=Q(ge),W=Q(Ee),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,ke=new Set(["host_not_allowed","invalid_token","provider_unavailable"]),J=typeof window!="undefined"&&window.location.protocol==="https:",Ce=8e3,V=n=>{try{return new URL(n).origin}catch{return null}},te=(n,o)=>{const l=o==null?void 0:o.origin;return!l||V(n==null?void 0:n.authUrl)!==l?null:l},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 l=new URL(n),a=new URL(o);return l.protocol!==a.protocol?!0:ne(l.hostname)!==ne(a.hostname)}catch{return!0}},se=(n,{onBlocked:o,onClosed:l})=>{const a=window.open(n.authUrl,"mm-embed-auth","popup,width=600,height=700");if(!a)return o(),()=>{};const m=setInterval(()=>{a.closed&&(clearInterval(m),l())},1e3);return()=>clearInterval(m)},oe=({children:n,launcher:o,broker:l})=>{const a=t.useContext(N),[m,b]=t.useState({}),[M,T]=t.useState({}),[I,f]=t.useState({}),[x,S]=t.useState({}),P=t.useRef(I);P.current=I;const k=t.useRef(m);k.current=m;const O=t.useRef(null),G=t.useRef({}),A=t.useRef({}),q=t.useRef({}),F=t.useRef(l);F.current=l;const _=t.useCallback(e=>{const r=A.current[e];if(!r)return;const s=u=>!u[e]||u[e].clientId?u:{...u,[e]:{...u[e],clientId:r}};b(s),S(s)},[]),c=t.useCallback((e,r)=>{e&&(S(s=>s[e]?s:{...s,[e]:{origin:e,reason:r,clientId:A.current[e]||null}}),_(e))},[_]),d=t.useCallback((e,{v2:r=!1,origin:s=null}={})=>{s&&(r&&P.current[s]||(b(u=>u[s]?u:{...u,[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||A.current[s]||null,popupBlocked:!1}}),_(s)))},[_]),i=t.useCallback(e=>{b(r=>{if(!r[e])return r;const s={...r};return delete s[e],s})},[]),p=t.useCallback(e=>{e&&(i(e),T(r=>({...r,[e]:(r[e]||0)+1})))},[i]),w=t.useCallback(e=>{b(r=>!r[e]||r[e].status==="interactive"?r:{...r,[e]:{...r[e],status:"interactive"}})},[]),z=t.useCallback(e=>{i(e.origin)},[i]),L=t.useCallback((e,r)=>{const s=te(e,r);if(s){if(re(s,window.location.origin)){c(s,"cross-site-legacy");return}d(e,{origin:s})}},[d,c]);t.useEffect(()=>{if(!a)return;const e=[a.addListener("*","init",(r,s)=>{s!=null&&s.origin&&(r!=null&&r.clientId)&&(A.current[s.origin]=r.clientId,_(s.origin)),s!=null&&s.origin&&Array.isArray(r==null?void 0:r.acceptsCredentials)&&(q.current[s.origin]=r.acceptsCredentials)}),a.addListener("*","authorize",L),a.addListener("*","login",L),a.addListener("*","credential-request",(r,s)=>d(r,{v2:!0,origin:te(r,s)}))];return()=>e.forEach(r=>r())},[a,L,d,_]),t.useEffect(()=>{const e=r=>{const s=r==null?void 0:r.data;if(!s||s.type!=="authorized"&&s.type!=="authorize-failed")return;const u=V(s.authUrl);if(!(!u||r.origin!==u)){if(s.type==="authorized"){if(s.accessToken){if(!k.current[u])return;f(h=>({...h,[u]:X({accessToken:s.accessToken})})),i(u)}else p(u);return}w(u)}};return window.addEventListener("message",e),()=>window.removeEventListener("message",e)},[i,p,w]);const U=t.useCallback((e,r)=>{const s=e==null?void 0:e.origin,u=X(r);!s||!u||(f(h=>({...h,[s]:u})),i(s))},[i]),C=t.useCallback((e,r)=>{b(s=>s[e]?{...s,[e]:{...s[e],...r}}:s)},[]),$=t.useCallback(async(e,{approve:r}={})=>{const s=F.current,{origin:u}=e;let h;try{h=await s({origin:u,clientId:e.clientId,scope:e.scope,authUrl:e.authUrl},{approve:r})}catch{r?C(u,{error:{reason:"broker_unavailable"}}):C(u,{status:e.silentUrl&&J?"silent":"interactive"});return}if((h==null?void 0:h.status)===200&&h.credential){U(e,h.credential);return}if((h==null?void 0:h.status)===409&&h.consentRequired){C(u,{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&&ke.has(R)){C(u,{status:e.silentUrl&&J?"silent":"interactive"});return}if(r&&R==="consent_denied"){C(u,{error:null});return}i(u),S(he=>({...he,[u]:{origin:u,reason:`broker:${R}`,detail:h||null,clientId:e.clientId||A.current[u]||null}}))},[U,C,i]),B=t.useRef({});t.useEffect(()=>{Object.values(m).forEach(e=>{e.status!=="broker"||B.current[e.origin]||(B.current[e.origin]=!0,$(e).finally(()=>{delete B.current[e.origin]}))})},[m,$]);const v=t.useCallback(e=>!F.current||!(e!=null&&e.consent)?Promise.resolve():$(e,{approve:!0}),[$]);t.useEffect(()=>{const e=G.current;Object.values(m).forEach(r=>{r.status==="silent"&&!e[r.origin]&&(e[r.origin]=setTimeout(()=>{delete e[r.origin],w(r.origin)},Ce))}),Object.keys(e).forEach(r=>{(!m[r]||m[r].status!=="silent")&&(clearTimeout(e[r]),delete e[r])})},[m,w]),t.useEffect(()=>()=>{O.current&&O.current(),Object.values(G.current).forEach(clearTimeout)},[]);const j=t.useCallback(e=>{O.current&&(O.current(),O.current=null);const r=o||se;O.current=r(e,{onBlocked:()=>{b(s=>s[e.origin]?{...s,[e.origin]:{...s[e.origin],popupBlocked:!0}}:s)},onClosed:()=>{if(e.v2){J&&b(s=>!s[e.origin]||!s[e.origin].silentUrl?s:{...s,[e.origin]:{...s[e.origin],status:"silent"}});return}p(e.origin)}})},[o,p]),K={pending:Object.values(m).filter(e=>e.status==="interactive"),authorize:j,approve:v,complete:U,dismiss:z,originEpochs:M,credentials:I,unsupported:x},D=Object.values(m).filter(e=>e.status==="silent"&&e.silentUrl);return E.default.createElement(H.Provider,{value:K},n,D.map(e=>E.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:y.default.node,launcher:y.default.func,broker:y.default.func};const ie=()=>t.useContext(H),ue=n=>{const{originEpochs:o}=t.useContext(H),l=V(n);return l&&o[l]||0},le=n=>{const{credentials:o}=t.useContext(H),l=V(n);return l&&o[l]||null},ce=n=>{const{unsupported:o}=t.useContext(H),l=V(n);return l&&o[l]||null},ae=({children:n,authorizationLauncher:o,credentialBroker:l})=>{const[a,m]=t.useState({}),[b,M]=t.useState({}),T=t.useRef({}),I=t.useRef({}),f=t.useRef({}),x=t.useCallback((c,d)=>{var i;return!!((i=f.current[c])!=null&&i.has(d))},[]),S=t.useCallback((c,d,i)=>{m(p=>({...p,[c]:{origin:d,frameRef:i}}))},[]),P=t.useCallback(c=>{m(d=>{const i={...d};return delete i[c],i}),M(d=>{const i={...d};return delete i[c],i}),delete f.current[c]},[]);t.useEffect(()=>{const c=(i=[],p,w)=>{i.forEach(z=>z(p,w))},d=i=>{var $,B,v,j,K,D,e;if(!(($=i==null?void 0:i.data)!=null&&$.instanceId))return;const{instanceId:p,type:w}=i.data,z=a[p],L=(v=(B=z==null?void 0:z.frameRef)==null?void 0:B.current)==null?void 0:v.contentWindow;if(!L||i.source!==L||i.origin!==z.origin)return;const U={origin:i.origin},C=T.current;if(w==="response"){const{callbackId:r,response:s,error:u}=i.data,h=I.current[r];h&&(h(s,u),delete I.current[r]);return}if(w==="mark-registered"){const{requestType:r}=i.data;f.current[p]||(f.current[p]=new Set),f.current[p].add(r);return}w==="ready"&&M(r=>({...r,[p]:!0})),c((j=C[p])==null?void 0:j[w],i.data,U),c((K=C["*"])==null?void 0:K[w],i.data,U),c((D=C[p])==null?void 0:D["*"],i.data,U),c((e=C["*"])==null?void 0:e["*"],i.data,U)};return window.addEventListener("message",d),()=>{window.removeEventListener("message",d)}},[a]);const k=t.useCallback((c,d,i)=>{var w,z;const p=a[c];if(!p){console.warn(`Origin not set for id: ${c}. Unable to send message.`);return}(z=(w=p==null?void 0:p.frameRef)==null?void 0:w.current)!=null&&z.contentWindow&&p.frameRef.current.contentWindow.postMessage({type:d,...i,instanceId:c},p.origin)},[a]),O=t.useRef(0),G=t.useCallback(()=>`${Date.now()}-${++O.current}`,[]),A=t.useCallback(async(c,d,i={})=>new Promise((p,w)=>{const z=G(),L=(U,C)=>{delete I.current[z],C?w(C):p(U)};I.current[z]=L,k(c,"request",{callbackId:z,requestType:d,data:i})}),[k]),q=t.useCallback((c,d)=>{k(c,"load-options",d)},[k]),F=t.useCallback((c,d)=>{k(c,"validate",d)},[k]),_=t.useMemo(()=>({registerFrame:S,unregisterFrame:P,sendMessage:k,sendRequest:A,loadOptions:q,validate:F,hasHandler:x,readyFrames:b,addListener:(c,d,i)=>(T.current[c]||(T.current[c]={}),T.current[c][d]||(T.current[c][d]=[]),T.current[c][d].push(i),()=>{T.current[c][d]=T.current[c][d].filter(p=>p!==i)})}),[S,P,k,A,q,F,x,b]);return E.default.createElement(N.Provider,{value:_},E.default.createElement(oe,{launcher:o,broker:l},n))},Z=(n,o,l)=>{const a=t.useContext(N);if(a===null)throw new Error("useEmbeddedEffect must be used within a MMEmbeddableZoneProvider");const m=t.useRef(l);t.useEffect(()=>{m.current=l},[l]),t.useEffect(()=>{if(!(!n||!o)){if(o.startsWith("key:")){const b=o.substring(4);return a.readyFrames[n]&&a.sendMessage(n,"subscribe-key",{keyChord:b}),a.addListener(n,`key-pressed:${b}`,(...T)=>m.current(...T))}return a.addListener(n,o,(...b)=>m.current(...b))}},[a,n,o])};ae.propTypes={children:y.default.node.isRequired,authorizationLauncher:y.default.func,credentialBroker:y.default.func};const Y=W.default.default||W.default,we=1e4,Te="credentials",ye=(n,o)=>`${n}/mm-embedded-interop?id=${encodeURIComponent(o)}&origin=${encodeURIComponent(window.location.origin)}&caps=${Te}`,xe=Y.iframe`
   width: 100%;
   height: 100%;
   border: none;
   visibility: ${n=>n.$isReady?"visible":"hidden"};
-`,xe=Y.div`
+`,ze=Y.div`
   width: 100%;
   height: 100%;
   display: flex;
@@ -16,13 +16,13 @@
   text-align: center;
   color: #555;
   font-size: 14px;
-`,de=n=>{const o=n&&n.origin||"This app",l=n&&n.reason||"";switch(l){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 l.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."}}},fe=({entry:n})=>{const o=de(n);return m.default.createElement(xe,{"data-reason":n&&n.reason||void 0},m.default.createElement("div",{style:{fontWeight:600}},o.title),m.default.createElement("div",{style:{fontSize:12,color:"#888"}},o.detail))};fe.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`
+`,de=n=>{const o=n&&n.origin||"This app",l=n&&n.reason||"";switch(l){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 l.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."}}},fe=({entry:n})=>{const o=de(n);return E.default.createElement(ze,{"data-reason":n&&n.reason||void 0},E.default.createElement("div",{style:{fontWeight:600}},o.title),E.default.createElement("div",{style:{fontSize:12,color:"#888"}},o.detail))};fe.propTypes={entry:y.default.shape({origin:y.default.string,name:y.default.string,reason:y.default.string,detail:y.default.object})};const Ie=Y.div`
   height: 100%;
   display: flex;
   flex: 1;
   align-items: center;
   justify-content: center;
-`,ze=()=>m.default.createElement(Ie,null,m.default.createElement("div",{style:{textAlign:"center"}},"This app couldn’t be loaded as an embeddable widget.")),pe=({id:n,src:o,path:l,onInit:f=()=>{},onTimeout:b,context:E={},params:F={},renderUnsupported:x,renderTimeout:M,...S})=>{if("isConfiguring"in S)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 $=t.useRef(),[O,D]=t.useState(),[k,U]=t.useState(0),[G,z]=t.useState(!1),[j,L]=t.useState(!1),I=ue(o),c=le(o),a=ce(o),[i,d]=t.useState(0),[C,T]=t.useState(null),{registerFrame:y,unregisterFrame:_,sendMessage:g}=t.useContext(N),[A,v]=t.useState(),P=t.useRef(),q=t.useRef(b),H=t.useRef(f),B=t.useRef(!1),e=t.useCallback(()=>{B.current=!1,clearTimeout(P.current),U(0),z(!1),L(!1),T(null)},[]);t.useEffect(()=>{(I>0||i>0)&&e()},[I,i,e]),t.useEffect(()=>{q.current=b},[b]),t.useEffect(()=>{H.current=f},[f]),t.useEffect(()=>{k&&g(n,"set-context",{context:{...E}})},[E,n,k]),t.useEffect(()=>{k&&g(n,"set-params",{params:F})},[F,n,k]),t.useEffect(()=>{l!==void 0&&v((l==null?void 0:l.indexOf("/"))===0?l:`/${l}`)},[l]),t.useEffect(()=>{A===void 0||!k||g(n,"navigate",{path:A})},[A,k,n,g]),t.useEffect(()=>{if(!o||!n||!$)return;e();const u=new URL(o);return y(n,u.origin,$),H.current(),D(we(u.origin,n)),()=>{_(n)}},[o,n,y,$,e]),t.useEffect(()=>{if(!(!O||B.current))return P.current=setTimeout(()=>{z(!0),q.current&&q.current()},ke),()=>clearTimeout(P.current)},[O,o,I,i]);const r=t.useCallback(()=>{B.current=!0,clearTimeout(P.current),z(!1)},[]);Z(n,"init",u=>{r(),Array.isArray(u==null?void 0:u.acceptsCredentials)&&T(u.acceptsCredentials)}),Z(n,"authorize",r),Z(n,"login",r),Z(n,"credential-request",()=>{r(),L(!0)}),t.useEffect(()=>{if(!j||!c)return;const u=C;if(Array.isArray(u)&&!u.includes(c.kind))return;const p=c.kind==="access_token"?{accessToken:c.accessToken}:{};g(n,"credential",{...p,credential:c})},[j,c,C,n,g]),Z(n,"ready",()=>{r(),U(u=>u+1)});const s=t.useRef();return Z(n,"heartbeat",()=>{s.current&&clearTimeout(s.current),s.current=setTimeout(()=>{d(u=>u+1)},6e3)}),t.useEffect(()=>()=>{s.current&&clearTimeout(s.current)},[]),a?x?x(a):m.default.createElement(fe,{entry:a}):G&&!k?M?M():m.default.createElement(ze,null):m.default.createElement(Te,{key:`auth-epoch-${I}-frame-${i}`,$isReady:k,ref:$,src:O,...S})};pe.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=W.default.div`
+`,Se=()=>E.default.createElement(Ie,null,E.default.createElement("div",{style:{textAlign:"center"}},"This app couldn’t be loaded as an embeddable widget.")),pe=({id:n,src:o,path:l,onInit:a=()=>{},onTimeout:m,context:b={},params:M={},renderUnsupported:T,renderTimeout:I,...f})=>{if("isConfiguring"in f)return console.error("isConfiguring must be passed via the params prop to MMEmbeddableZone"),null;if("colorMode"in b)return console.error("colorMode must be passed via the params prop to MMEmbeddableZone"),null;if("isFullScreen"in b)return console.error("isFullScreen must be passed via the params prop to MMEmbeddableZone"),null;const x=t.useRef(),[S,P]=t.useState(),[k,O]=t.useState(0),[G,A]=t.useState(!1),[q,F]=t.useState(!1),_=ue(o),c=le(o),d=ce(o),[i,p]=t.useState(0),[w,z]=t.useState(null),{registerFrame:L,unregisterFrame:U,sendMessage:C}=t.useContext(N),[$,B]=t.useState(),v=t.useRef(),j=t.useRef(m),K=t.useRef(a),D=t.useRef(!1),e=t.useCallback(()=>{D.current=!1,clearTimeout(v.current),O(0),A(!1),F(!1),z(null)},[]);t.useEffect(()=>{(_>0||i>0)&&e()},[_,i,e]),t.useEffect(()=>{j.current=m},[m]),t.useEffect(()=>{K.current=a},[a]),t.useEffect(()=>{k&&C(n,"set-context",{context:{...b}})},[b,n,k]),t.useEffect(()=>{k&&C(n,"set-params",{params:M})},[M,n,k]),t.useEffect(()=>{l!==void 0&&B((l==null?void 0:l.indexOf("/"))===0?l:`/${l}`)},[l]),t.useEffect(()=>{$===void 0||!k||C(n,"navigate",{path:$})},[$,k,n,C]),t.useEffect(()=>{if(!o||!n||!x)return;e();const u=new URL(o);return L(n,u.origin,x),K.current(),P(ye(u.origin,n)),()=>{U(n)}},[o,n,L,x,e]),t.useEffect(()=>{if(!(!S||D.current))return v.current=setTimeout(()=>{A(!0),j.current&&j.current()},we),()=>clearTimeout(v.current)},[S,o,_,i]);const r=t.useCallback(()=>{D.current=!0,clearTimeout(v.current),A(!1)},[]);Z(n,"init",u=>{r(),Array.isArray(u==null?void 0:u.acceptsCredentials)&&z(u.acceptsCredentials)}),Z(n,"authorize",r),Z(n,"login",r),Z(n,"credential-request",()=>{r(),F(!0)}),t.useEffect(()=>{if(!q||!c)return;const u=w;if(Array.isArray(u)&&!u.includes(c.kind))return;const h=c.kind==="access_token"?{accessToken:c.accessToken}:{};C(n,"credential",{...h,credential:c})},[q,c,w,n,C]),Z(n,"ready",()=>{r(),O(u=>u+1)});const s=t.useRef();return Z(n,"heartbeat",()=>{s.current&&clearTimeout(s.current),s.current=setTimeout(()=>{p(u=>u+1)},6e3)}),t.useEffect(()=>()=>{s.current&&clearTimeout(s.current)},[]),d?T?T(d):E.default.createElement(fe,{entry:d}):G&&!k?I?I():E.default.createElement(Se,null):E.default.createElement(xe,{key:`auth-epoch-${_}-frame-${i}`,$isReady:k,ref:x,src:S,...f})};pe.propTypes={id:y.default.string,src:y.default.string.isRequired,path:y.default.string,onInit:y.default.func,onTimeout:y.default.func,renderUnsupported:y.default.func,renderTimeout:y.default.func};const _e=W.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;
-`,Me=W.default.div`
+`,Ae=W.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;
-`,Se=W.default.div`
+`,Ue=W.default.div`
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 10px 0;
   gap: 16px;
-`,Ue=W.default.button`
+`,Me=W.default.button`
   background: #16a500;
   color: #fff;
   border: none;
@@ -54,8 +54,8 @@
   font-size: 14px;
   cursor: pointer;
   white-space: nowrap;
-`,ye=W.default.p`
+`,Oe=W.default.p`
   color: #b3261e;
   font-size: 13px;
   margin: 4px 0 0;
-`,Ae=()=>{const{pending:n,authorize:o}=ie();return n.length===0?null:m.default.createElement(_e,null,m.default.createElement(Me,null,m.default.createElement("h3",{style:{margin:"0 0 8px"}},"Authorization Required"),m.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(l=>m.default.createElement("div",{key:l.origin},m.default.createElement(Se,null,m.default.createElement("div",null,m.default.createElement("div",{style:{fontWeight:600}},l.origin)),m.default.createElement(Ue,{onClick:()=>o(l)},"Authorize")),l.popupBlocked&&m.default.createElement(ye,null,"The sign-in window was blocked. Allow popups for this site, then try again.")))))};h.CREDENTIAL_KIND_ACCESS_TOKEN=ee,h.EmbeddedAuthorizationContext=K,h.EmbeddedAuthorizationPrompt=Ae,h.MMEmbeddableZone=pe,h.MMEmbeddableZoneContext=N,h.MMEmbeddableZoneProvider=ae,h.isCrossSite=re,h.normalizeCredential=X,h.popupAuthorizationLauncher=se,h.unsupportedCopy=de,h.useEmbeddedAuthorizations=ie,h.useEmbeddedCredential=le,h.useEmbeddedEffect=Z,h.useEmbeddedOriginEpoch=ue,h.useEmbeddedUnsupported=ce,Object.defineProperty(h,Symbol.toStringTag,{value:"Module"})}));
+`,me='button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])';let be=!1;const Le=()=>{const{pending:n,authorize:o,dismiss:l}=ie(),a=n.filter(f=>!f.consent),m=n.length-a.length,b=t.useRef(null),M=t.useRef(null),T=a.length>0;if(t.useEffect(()=>{m>0&&!be&&(be=!0,console.error("[mm-react-embeddable] EmbeddedAuthorizationPrompt received a brokered consent entry. A host with a credentialBroker must render its own consent UI (useEmbeddedAuthorizations: approve/dismiss); this default prompt only handles the popup path."))},[m]),t.useEffect(()=>{if(!T||!b.current)return;M.current=document.activeElement;const f=b.current.querySelector(me);return f&&f.focus(),()=>{const x=M.current;x&&typeof x.focus=="function"&&x.focus()}},[T]),!T)return null;const I=f=>{if(f.key==="Escape"){f.preventDefault(),a.forEach(k=>l(k));return}if(f.key!=="Tab"||!b.current)return;const x=Array.from(b.current.querySelectorAll(me));if(x.length===0)return;const S=x[0],P=x[x.length-1];f.shiftKey&&document.activeElement===S?(f.preventDefault(),P.focus()):!f.shiftKey&&document.activeElement===P&&(f.preventDefault(),S.focus())};return E.default.createElement(_e,null,E.default.createElement(Ae,{ref:b,role:"dialog","aria-modal":"true","aria-labelledby":"mm-embedded-authorization-title",onKeyDown:I},E.default.createElement("h3",{id:"mm-embedded-authorization-title",style:{margin:"0 0 8px"}},"Authorization Required"),E.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."),a.map(f=>E.default.createElement("div",{key:f.origin},E.default.createElement(Ue,null,E.default.createElement("div",null,E.default.createElement("div",{style:{fontWeight:600}},f.origin)),E.default.createElement(Me,{onClick:()=>o(f)},"Authorize")),f.popupBlocked&&E.default.createElement(Oe,null,"The sign-in window was blocked. Allow popups for this site, then try again.")))))};g.CREDENTIAL_KIND_ACCESS_TOKEN=ee,g.EmbeddedAuthorizationContext=H,g.EmbeddedAuthorizationPrompt=Le,g.MMEmbeddableZone=pe,g.MMEmbeddableZoneContext=N,g.MMEmbeddableZoneProvider=ae,g.isCrossSite=re,g.normalizeCredential=X,g.popupAuthorizationLauncher=se,g.unsupportedCopy=de,g.useEmbeddedAuthorizations=ie,g.useEmbeddedCredential=le,g.useEmbeddedEffect=Z,g.useEmbeddedOriginEpoch=ue,g.useEmbeddedUnsupported=ce,Object.defineProperty(g,Symbol.toStringTag,{value:"Module"})}));

package/package.json

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