UNPKG

@connectifi/agent-web

Version:

A simple web implementation of a connectifi agent

2 lines 29 kB
import"./chunk-KW4W5UDY.js";var te='@keyframes throbber{0%{opacity:0}50%{opacity:.5}to{opacity:0}}@keyframes fadeInUp{0%{opacity:0;transform:translate3d(0,100%,0)}to{opacity:1;transform:translateZ(0)}}@keyframes fadeOutDown{0%{opacity:1}to{opacity:0;transform:translate3d(0,100%,0)}}@keyframes zoomIn{0%{opacity:0;transform:scale3d(.3,.3,.3)}50%{opacity:1}}@keyframes zoomOut{0%{opacity:1}50%{opacity:0;transform:scale3d(.3,.3,.3)}to{opacity:0}}*{color:var(--text-color);font-family:Arial,Helvetica,sans-serif;line-height:1rem}img{height:1.2rem;width:1.2rem}button{align-items:center;background:transparent;border:none;border-radius:50%;display:flex;filter:var(--drop-shadow-sm);height:1.8rem;justify-content:center;margin:.2rem;padding:0;transition:var(--ease);width:1.8rem}button:hover{transform:scale(1.1)}button img{height:.7rem;width:.7rem}button:hover{transform:var(--grow)}.container{--text-color:#111;--shadow:#27272ac2;--drop-shadow:drop-shadow(5px 5px 10px var(--shadow));--drop-shadow-sm:drop-shadow(3px 3px 5px var(--shadow));--box-shadow:rgba(50,50,93,.2) 0px 13px 27px -5px,rgba(0,0,0,.25) 0px 8px 16px -8px;--border:1px solid var(--secondary-variant);--ease:all 0.2s ease-in-out;--grow:scale(1.1);--grow-sm:scale(1.04);--radius:0.25rem;--background:#fff;--primary:#000;--primary-variant:#27272a;--secondary:#aaa;--secondary-variant:#d0d4db;font-size:.8rem}.fab{align-items:center;display:flex;flex-direction:column;position:fixed;z-index:99999}.fab.bl,.fab.bl .picker,.fab.br,.fab.br .picker{flex-direction:column-reverse}.fab.br .inner,.fab.mr .inner,.fab.tr .inner{align-items:end}.fabHeader,.inner{display:flex;flex-direction:column;height:3.5rem;justify-content:center;width:3.5rem}.fabHeader{align-items:center;background-color:var(--secondary);border-radius:50%;filter:var(--drop-shadow);margin:0;padding:0;transition:background-color .25s linear,var(--ease)}.fabHeader:hover{transform:var(--grow-sm)}.fab.tl{left:1rem;top:2rem}.fab.ml{left:1rem;top:calc(50vh - 1.8rem)}.fab.bl{bottom:2rem;left:1rem}.fab.tr{right:1rem;top:2rem}.fab.mr{right:1rem;top:calc(50vh - 1.8rem)}.fab.br{bottom:1.75rem;right:1rem}.fabHeader img{border-radius:50%;height:3rem;width:3rem}.fabHeader .mask{background-color:#fff;border-radius:50%;height:100%;opacity:0;position:absolute;transition:transform 2s ease-in-out;width:100%}.fabHeader .indicator{background-color:gray;border:1px solid #fff;border-radius:50%;bottom:0;height:.8rem;position:absolute;right:0;width:.8rem}.fabHeader.connected .indicator{background-color:#90ee90}.fabHeader.busy .mask{animation:throbber 2s infinite}.fabHeader.connected{background-color:var(--primary)}.toast{align-items:center;background-color:var(--background);border:var(--border);border-radius:var(--radius);box-shadow:var(--box-shadow);display:flex;flex-flow:row;flex-wrap:nowrap;justify-content:left;margin-left:70px;margin-right:70px;max-width:25rem;min-width:12rem;opacity:.9;padding:.4rem;position:fixed;visibility:hidden}.toast.show{animation-duration:.3s;animation-name:fadeInUp;visibility:visible}.toast.hide{animation-duration:.26s;animation-name:fadeOutDown}.toast>img{height:1.5rem;margin-right:.4rem;width:1.5rem}.toast>button>img{height:1.2rem;width:1.2rem}.toast .title{font-weight:600}.toast .message{font-size:.7rem;margin-right:.5rem;overflow:hidden;text-overflow:ellipsis}.picker{align-items:center;color:var(--text-color);display:none;flex-direction:column;justify-content:center;padding:.2rem 0}.picker.show{display:flex}.picker button>img{filter:invert(1)}.picker.show button{animation-duration:.4s;animation-name:zoomIn;opacity:1;visibility:visible}.picker button{animation-duration:.5s;animation-name:zoomOut;opacity:0;visibility:hidden}.toolbar{align-items:center;display:flex;flex-flow:row}.toolbar>button{background-color:var(--primary-variant)}.toolbar .title{margin-left:.5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100vw - 3rem)}.channels{display:none;flex-wrap:wrap;justify-content:center}.channels.show{display:flex}.resolver{background-color:var(--background);border:var(--border);border-radius:.6rem .6rem 0 0;box-shadow:var(--box-shadow);display:none;height:24rem;left:50%;margin-left:-15rem;margin-top:-12rem;opacity:0;position:fixed;top:50%;width:30rem;z-index:99999}.resolver.open{display:block;opacity:1;transition-duration:.3s;transition-property:opacity}.resolver .header{align-items:center;background-color:var(--primary-variant);border-top-left-radius:.6rem;border-top-right-radius:.6rem;display:flex;flex-direction:row;font-size:1rem;padding:.6rem 0 .3rem;width:100%}.resolver .header *{color:#fff}.resolver .header .logo img{height:1.5rem;margin:2px .5em 0;width:1.5rem}.resolver .header .title{flex-grow:1;overflow:hidden;white-space:wrap}.resolver .header .title:after{background:linear-gradient(90deg,transparent,transparent 85%,var(--primary-variant) 90%);border-top-right-radius:.6em;content:"";display:block;height:2em;left:0;pointer-events:none;position:absolute;top:0;width:100%}.resolver .header .title span{display:inline-block;margin:0 0 4px}.resolver .header .dismissContainer{align-items:start;display:flex}.resolver .header .dismiss{margin:0 .5em;z-index:1}.resolver .header .dismiss>div{background-color:transparent;border-radius:50%;cursor:pointer;height:1.2em;text-align:center;width:1.2em}.resolver .header .dismiss>div>span{position:relative;top:2px}.resolver .header .dismiss div:hover{background-color:#555}.resolver .list{height:20.5rem;overflow:scroll}.resolver .list .item{align-items:center;cursor:pointer;display:flex;flex-direction:row;flex-wrap:nowrap;height:2rem;overflow:hidden;padding:.3rem .3rem .3rem .6rem}.resolver .list .item:hover{background-color:#e7e7e7}.resolver .list .group{border-bottom:.5px solid #bbb;border-top:.5px solid #bbb;padding:.25rem .75rem}.resolver .list .item .icon-container{display:flex;flex-direction:row;flex-wrap:nowrap}.resolver .list .item img{background-repeat:no-repeat;background-size:contain;margin-right:.4rem}.resolver .list .item .title{flex-grow:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.resolver .list .item .info{display:flex;flex-direction:row;flex-wrap:nowrap;padding-right:.4rem}.resolver .list .item .info>div{background-repeat:no-repeat;background-size:contain;height:1.2rem;margin-left:.4rem;padding:.3em;text-align:center;width:1.2rem}.resolver .list .item .info .agent>div{margin-top:.1em}.resolver .list .item .info .more{background-color:#d3d3d3;height:1.2rem;padding-top:.5em;width:1.2rem}.resolver .list .item .info .more>span{border-color:#aaa;border-style:dashed;border-width:0 2px}.resolver .list .intentRow{background-color:#ddd;border-top:1px solid #bbb;padding-bottom:.6rem;padding-top:.6rem}.resolver .list .intentTitle{font-size:1rem;padding:0 .5em}.resolverBackground{background-color:#111;display:none;height:100%;left:0;opacity:.2;position:absolute;top:0;width:100%;z-index:9999}.resolverBackground.open{display:block}@media (max-width:600px){.resolver{margin-left:calc(-50vw - -1rem);width:calc(100vw - 2rem)}}@media (max-height:480px){.resolver{height:calc(100vh - 2rem);margin-top:calc(-50vh - -1rem)}.resolver .list{height:calc(100vh - 4.7rem)}}';var y=class{constructor(e){this.images=e}updateImageSource(e){this.images.forEach(t=>{t.src=e})}};var w=class{constructor(e){this.element=document.createElement(e)}},s=class extends w{constructor(){super("div")}},p=class extends w{constructor(){super("button")}},x=class extends w{constructor(){super("img")}};function k(i){i.title=""}var L=class extends p{constructor(t){super();this.containerElement=document.createElement("span");this.element.title="reconnect now";let n=`${t}/connect.png`,r=document.createElement("img");r.src=n,this.element.appendChild(r)}};var T=class{constructor(e,t){this.picker=e;this.logo=t}update(e){this.picker.updateInteropStrategy(e.interopStrategy),e.icon&&this.logo.updateImageSource(e.icon)}};var A=class extends p{constructor(){super();this.icon=document.createElement("img");this.element.appendChild(this.icon)}updateOwner(t,n,r){if(n!=="strict"&&n!=="openauth"){this.element.style.display="none";return}if(this.element.style.display="",!r){this.element.setAttribute("title","please sign in"),this.icon.src=`${t}/signin.svg`;return}this.element.setAttribute("title",`sign out of ${r}`),this.icon.src=`${t}/signout.svg`}};var E=class extends s{constructor(){super(),this.element.classList.add("toolbar"),this.button=new A,this.element.appendChild(this.button.element)}};function ee(i){let e=new Image;return e.src=i,e}function g(i){return`${i}/warning.svg`}function R(i){return`${i}/error.svg`}function ne(i){return`${i}/check.svg`}function C(i){return`${i}/unlock.svg`}function ie(i){return`${i}/connectifi-logo-white.png`}function re(i){return`${i}/channel.svg`}var X=new Map;function d(i){return X.has(i)||X.set(i,ee(i)),X.get(i)}function oe(i,e=0){if(!i)return!1;let t=i.getBoundingClientRect();return t.y+t.height-e<0||t.y>window.innerHeight-e}var D=class extends s{constructor(t,n){super();this.channelSrc=t;this.onChannelPicked=n;this.element.classList.add("channels"),this.addEventListeners()}addEventListeners(){window.addEventListener("resize",this.handleResize.bind(this))}handleResize(){let n=this.element.children.item(0),r=this.element.children.length;if(!n)return;let o=n.getBoundingClientRect().height,a=getComputedStyle(n),l=parseFloat(a.marginTop)+parseFloat(a.marginBottom),m=o+l;for(let c=1;c<r+1;c++){let h=m*c+"px";if(this.element.style.width=h,!oe(this.element.firstChild,45)&&!oe(this.element.lastChild,45))return}}async pickChannel(t,n){n==null||n.stopPropagation(),this.onChannelPicked(t)}renderChannel(t){var m,c;let n=`channel-item-${t.id}`;if(this.element.querySelector(`#${n}`)||t.id==="global")return;let o=document.createElement("button"),a=((m=t.displayMetadata)==null?void 0:m.name)||t.id,l=((c=t.displayMetadata)==null?void 0:c.color)||"black";o.id=n,o.title=a+" Channel",o.style.backgroundColor=l,o.addEventListener("click",h=>{this.pickChannel(t.id,h)}),o.appendChild(ee(this.channelSrc)),this.element.appendChild(o)}renderChannels(t){t.forEach(n=>this.renderChannel(n)),this.handleResize()}};var I=class extends s{constructor(t,n,r){super();this.onChannelPicked=r;this.animationDelay=-1;this.isShowing=!1;this.canShow=!1;this.element.classList.add("picker",n),this.toolbar=new E,this.element.appendChild(this.toolbar.element),this.channels=new D(t,this.handleChannelPicked.bind(this)),this.element.appendChild(this.channels.element),this.stopRootClickPropagation()}handleChannelPicked(t){this.onChannelPicked(t),this.hide()}stopRootClickPropagation(){this.element.addEventListener("click",t=>{t.stopPropagation()})}hide(){this.canShow&&(this.isShowing=!1,this.element.classList.remove("show"),this.animationDelay=window.setTimeout(()=>{this.channels.element.classList.remove("show")},500))}show(){this.canShow&&(window.clearTimeout(this.animationDelay),this.isShowing=!0,this.channels.element.classList.add("show"),this.element.classList.add("show"))}toggle(){if(this.isShowing)return this.hide();this.show()}updateInteropStrategy(t){t&&this.element.classList.add(t)}};var M=class extends x{constructor(e){super(),this.element.alt="connectifi",this.element.classList.add("logo"),this.element.classList.add("loaded"),this.element.classList.add("connected"),this.element.src=e}};var S=class extends s{constructor(t){super();this.indicator=document.createElement("div");this.mask=document.createElement("div");this.element.classList.add("fabHeader"),this.mask.classList.add("mask"),this.element.appendChild(this.mask),this.indicator.classList.add("indicator"),this.element.appendChild(this.indicator),this.logo=new M(t),this.element.appendChild(this.logo.element)}connected(t){this.element.classList.add("connected"),this.element.title=`Connected to directory '${t}'.`}disconnected(){k(this.element),this.element.classList.remove("connected")}loading(){k(this.element),this.element.classList.add("busy")}loaded(){k(this.element),this.element.classList.remove("busy")}setBackgroundColor(t){this.element.style.backgroundColor=t}};var H=class extends s{constructor(){super(),this.element.classList.add("dismissContainer");let e=document.createElement("div");e.classList.add("dismiss");let t=document.createElement("span");t.innerHTML="&#215;";let n=document.createElement("div");n.appendChild(t),e.appendChild(n),this.element.appendChild(e)}};var P=class extends s{constructor(t){super();this.icon=document.createElement("img");this.element.classList.add("logo"),this.icon.src=t,this.element.appendChild(this.icon)}};var u=class extends s{constructor(){super(),this.element.classList.add("title")}updateDirectoryName(e){this.element.textContent=e,this.element.title=`Connected to directory: '${e}'`}};var $=class extends u{constructor(){super();this.containerElement=document.createElement("span");this.containerElement.innerHTML="&#215;",this.element.appendChild(this.containerElement)}};var U=class extends s{constructor(t){super();this.dismiss=new H;this.title=new $;this.element.classList.add("header"),this.logo=new P(t),this.element.appendChild(this.logo.element),this.element.appendChild(this.title.element),this.element.appendChild(this.dismiss.element)}};var le=(i,e)=>{if(e){let t=typeof e=="string"?e:e.src;return t.toLowerCase().startsWith("http")?t:`${i}/${t}`}return""},O=class extends s{constructor(e,t,n,r){if(super(),this.element.classList.add("icon-container"),t)return;let o=`${e}/${n?"lock":"warning"}.svg`,a=document.createElement("div");a.setAttribute("style",`background-image: url('${o}');`),a.classList.add("icon","mask"),this.element.appendChild(a);let l=document.createElement("img");r&&r.length>0&&(l.src=le(e,r[0])),this.element.appendChild(l)}};var b=class extends s{constructor(t,n,r){super();this.containerElement=document.createElement("div");let o=n&&n.toLocaleLowerCase();this.element.setAttribute("class",`agent ${o}`),r?this.element.setAttribute("title",`${n} (${r})`):this.element.title=n,this.element.setAttribute("style",`background-image: url('${t}/${o}.svg')`),this.element.appendChild(this.containerElement)}};var B=class extends s{constructor(e,t,n,r,o,a){if(super(),this.element.classList.add("info"),this.element.setAttribute("title",`proximity: ${t}`),n!=="directory"){if(t>1){let l=new b(e,r,o);this.element.appendChild(l.element)}if(t>0){let l=new b(e,a);this.element.appendChild(l.element)}}}};var W=class extends u{constructor(e){super(),this.updateAppTitle(e)}updateAppTitle(e){this.element.textContent=e,this.element.setAttribute("title",`${e}`)}};var ce=i=>{let e=i.title||i.name,t=i.instanceTitle;return t?e&&!t.startsWith(e)?`${e} - ${t}`:t:e||"unknown"},z=class extends s{constructor(e,t,n){super(),this.element.classList.add("item"),this.iconContainer=new O(e,n,t.isSecure,t.icons),this.element.appendChild(this.iconContainer.element);let r=ce(t);this.title=new W(r),this.element.appendChild(this.title.element),this.info=new B(e,t.proximity,t.type,t.os,t.device,t.browser),this.element.appendChild(this.info.element)}};var de=i=>i==="directory"?"Open New":"Send To",q=class extends s{constructor(e,t){super(),this.element.classList.add("group"),e?this.element.textContent="Local Container":this.element.textContent=de(t)}};var F=class extends s{constructor(t){super();this.titleElement=document.createElement("div");this.element.classList.add("intentRow"),this.titleElement.className="intentTitle",this.titleElement.textContent=t,this.element.appendChild(this.titleElement)}};var me=(i,e)=>i.type!=="window"?0:i.proximity===e.proximity?e.lastUpdate-i.lastUpdate:i.proximity-e.proximity,he=(i,e)=>i.type===e.type?me(i,e):i.type==="directory"?1:-1,V=class extends s{constructor(){super(),this.element.classList.add("list")}clear(){this.element.innerHTML=""}renderIntentRow({intent:{displayName:e,name:t}={displayName:"",name:""}}){let n=new F(e||t);this.element.appendChild(n.element)}renderAppRows(e,t,n,r=!1){let{apps:o}=t;o.sort(he);let a="";o.forEach(l=>{if(l.type!==a){let c=new q(r,l.type);this.element.appendChild(c.element),a=l.type}let m=new z(e,l,r);this.element.appendChild(m.element),m.element.addEventListener("click",c=>{c.stopPropagation(),n(l,t,r)})})}};var N=class extends s{constructor(t){super();this.list=new V;this.isOpen=!1;this.element.classList.add("resolver"),this.header=new U(t),this.element.appendChild(this.header.element),this.element.appendChild(this.list.element),this.stopClickPropagation()}stopClickPropagation(){this.element.addEventListener("click",t=>{t.stopPropagation()})}open(){this.element.classList.add("open"),this.isOpen=!0}close(){this.element.classList.remove("open"),this.isOpen=!1}};var j=class extends s{constructor(){super(),this.element.classList.add("resolverBackground")}open(){this.element.classList.add("open")}close(){this.element.classList.remove("open")}};var J=class extends s{constructor(){super(),this.element.classList.add("message")}clear(){this.element.innerHTML=""}setMessage(e){this.element.innerText=e}};var _=class extends s{constructor(){super();this.title=new u;this.message=new J;this.animationDurationMs=250;this.element.classList.add("toast");let t=document.createElement("div");t.appendChild(this.title.element),t.appendChild(this.message.element),this.element.appendChild(t)}clearAction(){this.action&&(this.element.removeChild(this.action),this.action=void 0)}setAction(t){t&&(this.action=t,this.element.appendChild(t))}clearImage(){this.image&&(this.element.removeChild(this.image),this.image=void 0)}setImage(t){this.image=t,this.element.insertBefore(t,this.element.firstChild)}clear(){clearTimeout(this.durationTimer),this.element.classList.remove("success","show","hide","error"),this.message.clear(),this.clearAction(),this.clearImage()}async hide(){return this.hidePromise===void 0&&(this.hidePromise=new Promise(t=>{this.element.classList.add("hide"),this.animationTimer=window.setTimeout(()=>{this.element.classList.remove("hide","show"),this.hidePromise=void 0,t()},this.animationDurationMs)})),this.hidePromise}setDuration(t){this.durationTimer=window.setTimeout(()=>this.hide(),t)}async show({title:t,message:n,actionElement:r,duration:o=3e3,image:a}){this.element.classList.contains("show")&&await this.hide(),this.clear(),this.title.element.innerText=t,this.message.setMessage(n),this.setAction(r),this.setImage(a),this.element.classList.add("show"),o>0&&this.setDuration(o)}update(t){this.message.setMessage(t)}};var G=class extends s{constructor(t,n,r,o){super();this.resolverBackground=new j;this.element.classList.add("container");let a=document.createElement("div");a.classList.add("inner"),this.header=new S(t),a.appendChild(this.header.element),this.toast=new _,a.appendChild(this.toast.element);let l=document.createElement("div");l.classList.add("fab",r),l.appendChild(a),this.picker=new I(n,r,o),l.appendChild(this.picker.element),this.element.appendChild(l),this.resolver=new N(t),this.element.appendChild(this.resolver.element),this.element.appendChild(this.resolverBackground.element)}};var f=class extends p{constructor(e){super(),this.element.title="sign in";let t=`${e}/signin.svg`,n=document.createElement("img");n.src=t,this.element.appendChild(n)}};var K=class{constructor(e,t="sameWindow"){this.interopHost=e;this.style=t;this.window=null}createButton(){let e=new f(this.interopHost),t=n=>{n.stopPropagation(),this.open()};return e.element.addEventListener("click",t),e}close(){var e;(e=this.window)==null||e.close()}open(){if(this.style==="newWindow"){this.window=window.open(`${this.interopHost}/api/logout?target=interop`,"_blank");return}let e=window.location.href;window.location.href=`${this.interopHost}/api/logout?target=interop&interopUrl=${encodeURIComponent(e)}`}};var Y=class{constructor(e,t,n,r){this.interopHost=e;this.toast=t;this.directoryView=n;this.redirectStyle=r}async authenticate(e){let{name:t,authenticate:n}=e,r=new f(this.interopHost);return this.toast.show({title:"Sign In",message:`Please sign in to '${t}'.`,actionElement:r.element,duration:-1,image:d(C(this.interopHost))}),this.directoryView.update(e),new Promise(o=>r.element.addEventListener("click",async a=>{a.preventDefault(),await n(this.redirectStyle),o()}))}};var v=class extends p{constructor(e){super(),this.element.title="Open";let t=`${e}/signin.svg`,n=document.createElement("img");n.src=t,this.element.appendChild(n)}};var Z=class{constructor(e,t,n="sameWindow"){this.interopUrl=e;this.toast=t;this.consentRedirectStyle=n}createConsentButton(){return new v(this.interopUrl)}async requestConsentInToast(e){let t=this.createConsentButton();return await this.toast.show({title:"Accept Cookie Policy",message:"Please accept Connectifi's cookie policy.",image:d(C(this.interopUrl)),actionElement:t.element,duration:-1}),new Promise(n=>{t.element.addEventListener("click",async r=>{r.preventDefault(),await e("newWindow"),n()})})}async requestStorageAccess(e){let{button:t,waitForStorageAccess:n,requestConsent:r}=e,o=new URL(this.interopUrl).host;if(await this.toast.show({title:"Grant Connectifi Access",message:`Please grant ${o} interop access.`,image:d(C(this.interopUrl)),actionElement:t,duration:-1}),await n())return this.toast.hide();if(this.consentRedirectStyle==="sameWindow"){await r("sameWindow");return}await this.requestConsentInToast(r)}};var Q=class{constructor(e,t){this.toast=e;this.interopHost=t}createButton(e){let t=new v(this.interopHost);return t.element.addEventListener("click",()=>{window.open(e)}),t.element}open(e){!e.url||window.open(e.url)||this.toast.show({title:"Open Application",message:"Press here if application did not open",image:d(g(this.interopHost)),actionElement:this.createButton(e.url),duration:5e3})}};var pe=27,Ln=(i,e)=>{e.handleFABClicked&&(i.handleClick=e.handleFABClicked);let t={handleAuthenticate:i.handleAuthenticate.bind(i),handleRequestStorageAccess:i.handleRequestStorageAccess.bind(i),handleIntentResolution:i.handleIntentResolution.bind(i),handleOpen:i.handleOpen.bind(i),...e};return t.onFDC3Ready=n=>{var r;i.onFDC3Ready(n),(r=e.onFDC3Ready)==null||r.call(e,n)},t.onSessionStarted=(n,r)=>{var o;i.onSessionStarted(n,r),(o=e.onSessionStarted)==null||o.call(e,n,r)},t.onSessionError=n=>{var r;i.onSessionError(n),(r=e.onSessionError)==null||r.call(e,n)},t.onSignedOut=()=>{var n;i.onSignedOut(),(n=e.onSignedOut)==null||n.call(e)},t.onChannelJoined=n=>{var r;i.onChannelJoined(n),(r=e.onChannelJoined)==null||r.call(e,n)},t.onChannelLeft=()=>{var n;i.onChannelLeft(),(n=e.onChannelLeft)==null||n.call(e)},t.onConnected=n=>{var r;i.onConnected(n),(r=e.onConnected)==null||r.call(e,n)},t.onDisconnected=n=>{var r;i.onDisconnected(n),(r=e.onDisconnected)==null||r.call(e,n)},t.onWorkingChanged=n=>{var r;i.onWorkingChanged(n),(r=e.onWorkingChanged)==null||r.call(e,n)},t.onSessionAuthRequired=n=>{var r;i.onSessionAuthRequired(n),(r=e.onSessionAuthRequired)==null||r.call(e,n)},t},se=class{constructor(e,t,n={}){this.interopHost=e;this.root=t;this.connected=!1;this.channel="global";this.channels=[];this.directory=null;this.onChannelJoined=e=>{this.channel=e,this.updateChannelColor()};this.onChannelLeft=()=>{this.channel="global",this.updateChannelColor()};this.onWorkingChanged=e=>{e?this.startLoading():this.stopLoading()};let r=n.position||"br";["tl","ml","bl","tr","mr","br"].includes(r)===!1&&(r="br"),this.logout=new K(e,n.loginStyle);let a=n.logoSrc||ie(e);this.container=new G(a,re(e),r,this.handleChannelPicked.bind(this)),this.logoView=new y([this.container.header.logo.element,this.container.resolver.header.logo.icon]),this.directoryView=new T(this.container.picker,this.logoView),this.authenticator=new Y(e,this.container.toast,this.directoryView,n.loginStyle),this.storageAccess=new Z(e,this.container.toast,n.loginStyle),this.opener=new Q(this.container.toast,e),this.createRoot()}bind(e){this.agent=e}preloadImages(){[R,g].forEach(e=>d(e(this.interopHost)))}handleChannelPicked(e){var t,n;e===this.channel?(t=this.fdc3)==null||t.leaveCurrentChannel():(n=this.fdc3)==null||n.joinUserChannel(e)}createRoot(){let e=this.root.attachShadow({mode:"open",slotAssignment:"named"}),t=document.createElement("style");t.innerHTML=te,e.appendChild(t);let n=document.createElement("div");n.appendChild(this.container.element),e.appendChild(n),this.preloadImages(),this.container.header.element.addEventListener("click",o=>{o.stopPropagation(),this.handleClick?this.handleClick(o):this.container.picker.toggle()}),document.addEventListener("click",o=>{var a;o.stopPropagation(),this.container.picker.hide(),this.container.resolver.isOpen&&((a=this.closeResolverCallback)==null||a.call(this),this.hideResolver())}),document.addEventListener("keydown",o=>{var a;this.container.resolver.isOpen&&o.code==="Escape"&&((a=this.closeResolverCallback)==null||a.call(this),this.hideResolver())}),this.container.resolver.header.dismiss.element.addEventListener("click",()=>{var o;(o=this.closeResolverCallback)==null||o.call(this),this.hideResolver()});let r=this.container.picker;r.toolbar.button.element.addEventListener("click",o=>{var a;if(o.stopPropagation(),r.hide(),!this.hasOwner())return(a=this.agent)==null?void 0:a.authenticate();this.logout.open()}),this.startLoading()}onSignedOut(){this.owner="",this.logout.close()}onSessionStarted(e,t){this.directory=e,this.directoryView.update(e),t&&(this.owner=t,this.container.picker.toolbar.button.updateOwner(this.interopHost,this.directory.interopStrategy,this.owner))}onSessionError(e){this.container.toast.show({title:"Error",message:e,image:d(R(this.interopHost))})}onFDC3Ready(e){this.fdc3=e,e.getUserChannels().then(t=>{this.channels=t,this.container.picker.channels.renderChannels(t),this.container.picker.canShow=!0})}handleOpen(e){this.opener.open(e)}handleAuthenticate(e){return this.authenticator.authenticate(e)}handleRequestStorageAccess(e){return this.storageAccess.requestStorageAccess(e)}onSessionAuthRequired(e){this.directoryView.update(e),this.container.picker.toolbar.button.updateOwner(this.interopHost,e.interopStrategy,void 0)}onConnected(e){var n;let t=(n=this.directory)==null?void 0:n.name;e===!0?this.container.toast.show({title:"Connected",message:`Connected to directory '${t}'`,image:d(ne(this.interopHost))}):this.container.toast.hide(),this.container.header.connected(t),clearInterval(this.reconnectCountdownTimer),this.stopLoading()}createReconnectButton(e){let t=new L(e);return t.element.addEventListener("click",()=>{var n;(n=this.agent)==null||n.connect()}),t}onDisconnected(e){var t;if(this.container.header.disconnected(),clearInterval(this.reconnectCountdownTimer),e!==void 0&&e>0){let n=Math.floor(e/1e3),r=`Reconnecting in ${n}s`;n>pe?this.container.toast.show({title:"Reconnecting",message:r,actionElement:this.createReconnectButton(this.interopHost).element,duration:-1,image:d(g(this.interopHost))}):this.container.toast.show({title:"Reconnecting",message:r,duration:-1,image:d(g(this.interopHost))});let o=n;this.reconnectCountdownTimer=setInterval(()=>{o=o>0?o-1:0,this.container.toast.update(`Reconnecting in ${o}s`)},1e3)}else this.container.toast.show({title:"Disconnected",message:`Disconnected from directory ${(t=this.directory)==null?void 0:t.name}`,actionElement:this.createReconnectButton(this.interopHost).element,duration:-1,image:d(R(this.interopHost))}),this.stopLoading()}startLoading(){this.container.header.loading()}stopLoading(){this.container.header.loaded()}updateChannelColor(){var t;let e=this.channels.find(n=>n.id===this.channel);this.container.header.setBackgroundColor(((t=e==null?void 0:e.displayMetadata)==null?void 0:t.color)||"black")}hasOwner(){return!!this.owner}handleIntentResolution(e,t,n){this.resolveCallback=t,this.closeResolverCallback=n,this.container.resolver.open(),this.container.resolverBackground.open();let r=(m,c,h)=>{this.resolveCallback&&(this.hideResolver(),this.resolveCallback({selected:m,intent:c.intent.name,context:e.context,bridge:h}))},o=this.container.resolver.header.title.containerElement,a=this.getContextDisplayName(e.context);if(e.resolutionType==="intent-resolver"){let h=`${(Array.isArray(e.data)?e.data[0]:e.data).intent.name} for ${a}`;o.innerHTML=h,o.setAttribute("title",h)}else e.resolutionType==="context-resolver"&&(o.innerHTML=a);let l=this.container.resolver.list;if(l.clear(),e.resolutionType==="intent-resolver"){let m=Array.isArray(e.data)?e.data[0]:e.data;if(l.renderAppRows(this.interopHost,m,r),e.bridgeData){let c=Array.isArray(e.bridgeData)?e.bridgeData[0]:e.bridgeData;l.renderAppRows(this.interopHost,c,r,!0)}}else e.resolutionType==="context-resolver"&&((Array.isArray(e.data)?e.data:[e.data]).forEach(c=>{l.renderIntentRow(c),l.renderAppRows(this.interopHost,c,r)}),e.bridgeData&&e.bridgeData.forEach(h=>{l.renderIntentRow(h),l.renderAppRows(this.interopHost,h,r,!0)}))}hideResolver(){this.container.resolver.close(),this.container.resolverBackground.close()}getContextDisplayName(e){var n;let t=e.name||e.type||"";return e.type==="fdc3.instrument"&&(t=`${(n=e.id)==null?void 0:n.ticker} - ${e.name}`),t}};export{se as ConnectifiFab,Ln as wrapConfig}; //# sourceMappingURL=fab-XF4DWIIX.js.map