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

package/README.md

@@ -1,3 +1,17 @@
 # mm-react-embeddable
 
 Components and hooks for embedding mm-apps into an interface. Primarily used for sandbox testing the creation of custom dashboard widgets.
+
+## Consent UI
+
+The library ships no consent UI. `useEmbeddedAuthorizations()` exposes the pending
+entries and the actions on them: `approve`/`dismiss` for entries the host brokered
+(`entry.consent` is set), `authorize` for legacy entries that take the popup path.
+Every host renders its own modal over that hook — converge, OperatorView,
+operator-kiosk and the mmdev playground each have one, all the same shape (rows name
+the app and where it runs; footer Cancel/Approve; checkbox rows when several apps are
+pending; legacy rows keep their own Authorize button because a popup must open from
+the user's click on that row).
+
+Removed in 2.0: `EmbeddedAuthorizationPrompt`, the old default popup prompt. Its only
+consumer (the playground) now renders its own modal.

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

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