@telia-ace/ace-chat-flamingo 1.1.122-rc.3 → 1.1.122-rc.4

package/index.js

@@ -1935,7 +1935,12 @@ Please report this to https://github.com/markedjs/marked.`,n){const i="<p>An err
         clip: rect(0, 0, 0, 0);
         border: 0;
       }
-    `];let Kt=Ys;Qa([k({attribute:!1})],Kt.prototype,"entry");Qa([he({context:re}),k({attribute:!1})],Kt.prototype,"application");window.customElements.get("ace-contact-data-field")||window.customElements.define("ace-contact-data-field",Kt);var op=Object.defineProperty,ap=(n,e,t,i)=>{for(var s=void 0,r=n.length-1,o;r>=0;r--)(o=n[r])&&(s=o(e,t,s)||s);return s&&op(e,t,s),s};const Qs=class Qs extends _{_onQuit(){this.dispatchResult("quit")}_onCancel(){this.dispatchResult("cancel")}dispatchResult(e){const t=new CustomEvent("action",{composed:!0,detail:{key:"quit-chat",data:{result:e}}});this.dispatchEvent(t)}render(){const e=this.application.texts;return y`<div class="container">
+    `];let Kt=Ys;Qa([k({attribute:!1})],Kt.prototype,"entry");Qa([he({context:re}),k({attribute:!1})],Kt.prototype,"application");window.customElements.get("ace-contact-data-field")||window.customElements.define("ace-contact-data-field",Kt);var op=Object.defineProperty,ap=(n,e,t,i)=>{for(var s=void 0,r=n.length-1,o;r>=0;r--)(o=n[r])&&(s=o(e,t,s)||s);return s&&op(e,t,s),s};const Qs=class Qs extends _{firstUpdated(){var t;const e=(t=this.shadowRoot)==null?void 0:t.querySelector(".container");e&&e.focus()}onQuit(){this.dispatchResult("quit")}onCancel(){this.dispatchResult("cancel")}dispatchResult(e){const t=new CustomEvent("action",{composed:!0,detail:{key:"quit-chat",data:{result:e}}});this.dispatchEvent(t)}render(){const e=this.application.texts;return y`<div
+      class="container"
+      role="dialog"
+      aria-modal="true"
+      tabindex="-1"
+    >
       <h3>
         ${e.getOrFallback("quit-confirm.title","Do you want to end the chat?")}
       </h3>
@@ -1943,10 +1948,10 @@ Please report this to https://github.com/markedjs/marked.`,n){const i="<p>An err
         ${e.getOrFallback("quit-confirm.ingress","Please reach out to us again if you need help with anything else.")}
       </p>
       <div class="button-container">
-        <button class="cancel" @click=${this._onCancel}>
+        <button class="cancel" @click=${this.onCancel}>
           ${e.getOrFallback("quit-confirm.cancel-button","Cancel")}
         </button>
-        <button class="quit" @click=${this._onQuit}>
+        <button class="quit" @click=${this.onQuit}>
           ${e.getOrFallback("quit-confirm.end-chat-button","End chat")}
         </button>
       </div>
@@ -2012,7 +2017,12 @@ Please report this to https://github.com/markedjs/marked.`,n){const i="<p>An err
       button:hover {
         filter: brightness(150%);
       }
-    `];let Wn=Qs;ap([he({context:re}),k({attribute:!1})],Wn.prototype,"application");window.customElements.get("ace-quit-confirm-dialog")||window.customElements.define("ace-quit-confirm-dialog",Wn);var lp=Object.defineProperty,cp=(n,e,t,i)=>{for(var s=void 0,r=n.length-1,o;r>=0;r--)(o=n[r])&&(s=o(e,t,s)||s);return s&&lp(e,t,s),s};const Xs=class Xs extends _{_onQuit(){this.dispatchResult("logout")}_onCancel(){this.dispatchResult("cancel")}dispatchResult(e){const t=new CustomEvent("action",{composed:!0,detail:{key:"logout-chat",data:{result:e}}});this.dispatchEvent(t)}render(){const e=this.application.texts;return y`<div class="container">
+    `];let Wn=Qs;ap([he({context:re}),k({attribute:!1})],Wn.prototype,"application");window.customElements.get("ace-quit-confirm-dialog")||window.customElements.define("ace-quit-confirm-dialog",Wn);var lp=Object.defineProperty,cp=(n,e,t,i)=>{for(var s=void 0,r=n.length-1,o;r>=0;r--)(o=n[r])&&(s=o(e,t,s)||s);return s&&lp(e,t,s),s};const Xs=class Xs extends _{firstUpdated(){var t;const e=(t=this.shadowRoot)==null?void 0:t.querySelector(".container");e&&e.focus()}onQuit(){this.dispatchResult("logout")}onCancel(){this.dispatchResult("cancel")}dispatchResult(e){const t=new CustomEvent("action",{composed:!0,detail:{key:"logout-chat",data:{result:e}}});this.dispatchEvent(t)}render(){const e=this.application.texts;return y`<div
+      class="container"
+      role="dialog"
+      aria-modal="true"
+      tabindex="-1"
+    >
       <h3>
         ${e.getOrFallback("logout-confirm.title","Do you want to log out?")}
       </h3>
@@ -2020,10 +2030,10 @@ Please report this to https://github.com/markedjs/marked.`,n){const i="<p>An err
         ${e.getOrFallback("logout-confirm.ingress","Logging out will end an active chat session")}
       </p>
       <div class="button-container">
-        <button class="cancel" @click=${this._onCancel}>
+        <button class="cancel" @click=${this.onCancel}>
           ${e.getOrFallback("logout-confirm.cancel-button","Cancel")}
         </button>
-        <button class="quit" @click=${this._onQuit}>
+        <button class="quit" @click=${this.onQuit}>
           ${e.getOrFallback("logout-confirm.end-chat-button","Log out")}
         </button>
       </div>
@@ -2235,4 +2245,4 @@ Please report this to https://github.com/markedjs/marked.`,n){const i="<p>An err
         border: 1px solid var(--border-color-medium);
         box-sizing: border-box;
       }
-    `];let Jt=Js;gp([he({context:re}),k({attribute:!1})],Jt.prototype,"application");window.customElements.get("ace-video-iframe")||window.customElements.define("ace-video-iframe",Jt);class Os extends wc{constructor(e,t){var i,s,r,o;super(e,t),this.pendingMessages=[],this.texts=this.component.application.texts,this.headerComponent=this.component.application.getComponent("widget-header"),this.isThirdPartyParticipant=this.component.properties.chat.isThirdPartyWidget,this.agent=this.createAgent(""),this.user=this.createUser(""),this.params=new URLSearchParams(document.location.search),this.invitationUid=this.params.get("invitationUid"),this.customerName=this.params.get("customerName")||void 0,this.idHubUrl="https://idhub.dev-se.telia-ck8s.com/idhub-gateway/public",this.logoutTimer=null,this.disconnected$=new P,this.agentUsername=null,this.conversationOption=null,this._conversationOptions={},this.sessionId=null,this.contactId=null,this.errand=null,this.entrance=null,this.guestId=null,this.chatOverlayActive=!1,this.inVideoCall=!1,this.onQueueStatusReceived=a=>{this.setQueueStatus(a.text||null)},this.onEstablished=a=>{this.contactId=a.contactId,this.errand=a.errand,this.entrance=a.entrance,this.agentUsername=a.agentUsername;const l={contactId:this.contactId,errand:this.errand,entrance:this.entrance,agentUsername:this.agentUsername};this.save({survey:l}),this.setQueueStatus(null),this.agent.name=a.agent,a.videoEnded&&this.removeVideo()},this.onPrepareVideo=()=>{this.showVideoConfirmDialog()},this.onVideoPrepared=a=>{this.showVideoIFrame(a.userUrl)},this.onChatButtonClicked=a=>{this.showChatOverVideo(a.guestId)},this.onEndVideoButtonClicked=a=>{this.guestId&&(a==null?void 0:a.guestId)===this.guestId&&this.removeVideo()},this.onPenStatusChange=a=>{a.penStatus==="on"?this.setTypingState(!0):this.setTypingState(!1)},this.onChatEnded=async a=>{var c,u;this.shouldUseAuth&&this.logoutUser(),this.setToastMessage(null),this.setTypingState(!1),this.videoConfirmDialogEntry&&this.videoConfirmDialogEntry.remove(),this.component.disableInput(),a.showForm&&this.showConversationEndedForm();const l=this.component.application.settings;(c=l==null?void 0:l.survey)!=null&&c.shouldUseSurvey&&((u=l==null?void 0:l.survey)!=null&&u.surveyBaseUrl)&&this.showSurvey(),this.isThirdPartyParticipant?this.removeHeaderOptions():this.setStartNewChatOption(),this.complete()},this.properties=t.properties,this.shouldUseAuth=(s=(i=this.component.application.settings)==null?void 0:i.auth)==null?void 0:s.shouldUseAuth,this.idHubEidType=(o=(r=this.component.application.settings)==null?void 0:r.auth)==null?void 0:o.idHubEidType.toLowerCase()}connect(e={}){super.connect(),this.setupAuthenticationListeners(),this._conversationOptions=e;const t={...this.properties.chat??{},...e},i=!!this.sessionId;if(!i){const r=Ji();this.setSessionId(r)}this.save({chatSessionId:this.sessionId}),this.engine=new Yd(t,this.sessionId),this.engine.messages().subscribe(r=>{switch(r.source){case"agent":this.printAgent(r.text);break;case"customer":this.clearPendingMessages(),this.isThirdPartyParticipant?r.source==="customer"&&r.invitationNo==="0"?this.printAgent(r.text,r.alias):this.printUser(r.text):r.source==="customer"&&Number(r.invitationNo)>0?this.printAgent(r.text,r.alias):this.printUser(r.text);break;case"system":this.printSystem(r.text);break}}),this.engine.actions().pipe(z(this.disconnected$),W(zd)).subscribe(this.onQueueStatusReceived),this.engine.actions().pipe(z(this.disconnected$),W(Hd)).subscribe(this.onEstablished),this.engine.actions().pipe(z(this.disconnected$),W(Fd)).subscribe(this.onPrepareVideo),this.engine.actions().pipe(z(this.disconnected$),W(Bd)).subscribe(this.onVideoPrepared),this.engine.actions().pipe(z(this.disconnected$),W(qd)).subscribe(this.onChatButtonClicked),this.engine.actions().pipe(z(this.disconnected$),W(Vd)).subscribe(this.onEndVideoButtonClicked),this.engine.actions().pipe(z(this.disconnected$),W(jd)).subscribe(this.onPenStatusChange),this.engine.actions().pipe(z(this.disconnected$),W(Wd)).subscribe(this.onChatEnded),this.setHeaderOption();const s=this.component.application.trigger;s&&s.widgetActive$.pipe(z(s.componentIsDestroyed$)).subscribe(r=>{r&&(this.conversationOption=null,this.setHeaderOption())}),this.component.userTyping$.pipe(z(this.disconnected$)).subscribe(r=>{var o;(o=this.engine)==null||o.sendPenStatusOn(r)}),i?this.engine.rehydrate().then(r=>{var o;r?(o=this.engine)==null||o.reconnect().pipe(z(this.disconnected$)).subscribe({error:a=>{console.error("Failed to reconnect to the engine:",a)}}):this.initializeChat(t).catch(a=>{console.error("Failed to initialize chat during rehydration:",a)})}):this.initializeChat(t).catch(r=>{console.error("Failed to initialize chat:",r)})}disconnected(){super.disconnected(),this.logoutTimer&&(clearTimeout(this.logoutTimer),this.logoutTimer=null),this.disconnected$.next()}onUserSubmit(e){const t=this.printUser(e.text);t.setStatus("pending"),this.pendingMessages.push(t),(async()=>{var i;try{await((i=this.engine)==null?void 0:i.chatWrite(e.text))}catch(s){s instanceof Fn?t.setStatus("failed"):(t.setStatus("failed"),console.warn("Unhandled error:",s))}})()}save(e){this.component.stateMachine.session().pipe(Te(t=>(t==null?void 0:t.data$)||tt),fe(1)).subscribe(t=>{this.saveToCurrentSession$.next({...t,...e})})}async rehydrate(e){e.chatSessionId&&this.setSessionId(e.chatSessionId),e.survey&&(this.contactId=e.survey.contactId,this.errand=e.survey.errand,this.entrance=e.survey.entrance,this.agentUsername=e.survey.agentUsername)}static getInstance(e,t){return t.providerInstance??(t.providerInstance=new Os(e,t)),t.providerInstance}async initializeChat(e){this.shouldUseAuth&&this.idHubEidType?(this.setupIDHubAuth(),this.idHubClient&&await this.startAuthenticationFlow()):this.handleWelcomeForm(e)}setupAuthenticationListeners(){var e;this.shouldUseAuth&&this.headerComponent&&this.headerComponent.actions$&&((e=this.headerComponent)==null||e.actions$.pipe(W(t=>t.key==="start-auth"||t.key==="logout-auth"),z(this.disconnected$)).subscribe(t=>{t.key==="start-auth"?this.handleAuthentication():t.key==="logout-auth"&&this.showLogoutConfirmDialog()}))}setupIDHubAuth(){var e;this.idHubClient=new Bt({...(e=this.component.application.settings)==null?void 0:e.auth,idHubUrl:this.idHubUrl})}async startAuthenticationFlow(){this.component.disableInput(),this.resetAuthState(Pe.NonAuthenticated);const e=await this.idHubClient.auth();if(e.status===H.Error){this.printSystem(this.texts.getOrFallback("auth.setup.error-message","An error occurred while setting up authentication.")),this.headerComponent.showAuthOptions=!1;return}switch(this.idHubEidType){case _e.Tunnistus:if(!e.tunnistusURL){this.printSystem(this.texts.getOrFallback("auth.setup.tunnistus.url-error-message","Unable to retrieve the Tunnistus authentication URL.")),this.headerComponent.showAuthOptions=!1;return}this.authURL=e.tunnistusURL,this.headerComponent.authUrl=e.tunnistusURL,this.headerComponent.authState=Pe.NonAuthenticated,this.authenticationCardEntry=this.showTunnistusAuthCard(Ze.Initial,e.tunnistusURL),this.authenticationCardEntry.actions$.pipe(W(t=>t.key==="start-auth"),fe(1)).subscribe(()=>{this.handleAuthentication()});break;case _e.BankId:break}}async handleWelcomeForm(e,t){let i=!0;e.webApiUrl&&(i=await this.isEntranceOpen(e.webApiUrl,e.entrance)),i?this.customerName?this.startChat({customerName:this.customerName,customData:{}},t):this.showWelcomeForm():this.showEntranceClosedDialog()}startChat(e,t){if(!this.engine)return;const i=e.customData.errand??this.engine.config.defaultErrand;if(!i)throw new Error("Errand is required but was not configured");this.isThirdPartyParticipant?(this.component.application.root.style.visibility="visible",this.engine.chatJoin({invitationUid:this.invitationUid,customerName:this.customerName??e.customerName}).pipe(z(this.disconnected$)).subscribe()):this.engine.chatRequest({customerName:e.customerName,customerEmailAddress:e.customerEmailAddress??"",visitorQuestion:e.visitorQuestion??"",customData:e.customData,errand:i,...t&&{idhubEIDToken:t}}).pipe(z(this.disconnected$)).subscribe(),this.component.enableInput(),this.component.enableSkipToLatestMessage(),this.setEndConversationOption()}restartNewChat(){this.engine&&(this.setSessionId(null),this.component.clearMessages(),this.removeHeaderOptions(),this.connect(this._conversationOptions))}setQueueStatus(e){this.setToastMessage(e)}async endConversation(){var e;this.shouldUseAuth&&this.resetAuthState(Pe.ChatEnded),await((e=this.engine)==null?void 0:e.chatQuit())}async sendConversationEmail(e){var t;try{await((t=this.engine)==null?void 0:t.chatEmailSession(e)),this.printSystem(this.texts.getOrFallback("email-form.email-sent-label","An email with the conversation was sent."))}catch(i){this.printSystem(this.texts.getOrFallback("email-form.error-message","Unable to send email with the conversation.")),i instanceof Fn||console.warn("Unhandled error:",i)}}clearPendingMessages(){this.pendingMessages.forEach(e=>{e.remove()})}setSessionId(e){this.sessionId=e}async isEntranceOpen(e,t){var s;let i=!1;try{const r=await fetch(`${e}/1/entrances/${t}/is-open`),o=await r.json();r.ok?i=(s=o==null?void 0:o.resultData)==null?void 0:s.isOpen:console.log(`Problem when fetching open status for entrance ${t}:`,o==null?void 0:o.resultMessage)}catch(r){console.log(`Failed to fetch open status for ${t}:`,r)}return i}resetAuthState(e){this.headerComponent.authState=e,this.headerComponent.userName="",this.headerComponent.authUrl="",this.authURL="",this.component.application.storage.removeItem("auth")}async handleAuthentication(){var t,i,s,r;this.headerComponent.userName=this.texts.getOrFallback("widget-header.authenticating","Authenticating..."),this.headerComponent.authState=Pe.Authenticating;const e=await this.idHubClient.collect();switch(this.authenticationCardEntry&&this.authenticationCardEntry.remove(),this.idHubEidType){case _e.Tunnistus:if(e.status===H.Error){this.headerComponent.userName=this.texts.getOrFallback("widget-header.not-authenticated","Not authenticated"),this.headerComponent.authState=Pe.NonAuthenticated,this.authenticationCardEntry=this.showTunnistusAuthCard(Ze.Error,this.authURL);return}else if(e.status===H.Authenticated){const o=Zd(((t=e==null?void 0:e.idhubEIDToken)==null?void 0:t.split(".")[1])??""),a=JSON.parse(o),l=((s=(i=a==null?void 0:a.completionData)==null?void 0:i.user)==null?void 0:s.name)??"",c=a==null?void 0:a.exp;if(typeof c=="number"&&c>0){const u=c*1e3-Date.now();u<=0?this.logoutUser():(this.logoutTimer&&clearTimeout(this.logoutTimer),this.logoutTimer=setTimeout(()=>{this.logoutUser()},u))}this.headerComponent.userName=l,this.headerComponent.authState=Pe.Authenticated,this.component.application.storage.set("auth",{name:l,authenticated:!0}),(r=this.authenticationCardEntry)==null||r.remove(),this.handleWelcomeForm(this.engine.config,e.idhubEIDToken)}break;case _e.BankId:break}}printAgent(e,t=""){const i=t.length>0?this.agent.print(e,"markdown",t):this.agent.print(e,"markdown");return this.setTypingState(!1),i}printUser(e){const t=Ni(Rr(e));return this.user.print(t)}printSystem(e){const t=Ni(Rr(e));return this.system.print(t)}showSurvey(){const e=new ee(j.System,{name:""},[{items:[["ace-survey",{content:""},{agentUsername:this.agentUsername??"",entrance:this.entrance??this.engine.config.entrance,errand:this.errand??this.engine.config.defaultErrand,contactId:this.contactId??""}]]}]);this.printEntry(e)}showTunnistusAuthCard(e,t,i){const s=new ee(j.System,{name:""},[{items:[["ace-tunnistus-auth-card",{content:""},{state:e,tunnistusURL:t??"",errorMessage:i??""}]]}]);return this.printEntry(s),s}showWelcomeForm(){this.component.disableInput(),this.component.disableSkipToLatestMessage();let e;this.isThirdPartyParticipant?e=new ee(j.System,{name:""},[{items:[["ace-welcome-form-third-party",{content:""}]]}]):e=new ee(j.System,{name:""},[{items:[["ace-welcome-form",{content:""}]]}]),this.printEntry(e),e.actions$.pipe(W(t=>t.key==="submitted"),fe(1)).subscribe(t=>{e.remove(),this.startChat({customerName:t.data.name,customerEmailAddress:t.data.email,visitorQuestion:t.data.question,customData:t.data.customData})})}showEntranceClosedDialog(){this.component.disableInput();const e=new ee(j.System,{name:""},[{items:[["ace-entrance-closed-dialog",{content:""}]]}]);this.printEntry(e)}showQuitConfirmDialog(){var e;(e=this.quitConfirmDialogEntry)==null||e.remove(),this.quitConfirmDialogEntry=new ee(j.System,{name:""},[{items:[["ace-quit-confirm-dialog",{content:""}]]}]),this.printEntry(this.quitConfirmDialogEntry),this.quitConfirmDialogEntry.actions$.pipe(W(t=>t.key==="quit-chat"),fe(1)).subscribe(t=>{var i;this.quitConfirmDialogEntry&&this.quitConfirmDialogEntry.remove(),((i=t.data)==null?void 0:i.result)==="quit"&&this.endConversation()})}showConversationEndedForm(){const e=new ee(j.System,{name:""},[{items:[["ace-conversation-ended-form",{content:""}]]}]);this.printEntry(e),e.actions$.pipe(W(t=>t.key==="submitted"),fe(1)).subscribe(t=>{e.remove(),t.data.email&&this.sendConversationEmail(t.data.email)})}showVideoConfirmDialog(){this.videoConfirmDialogEntry=new ee(j.System,{name:""},[{items:[["ace-video-confirm-dialog",{content:""}]]}]),this.printEntry(this.videoConfirmDialogEntry),this.videoConfirmDialogEntry.actions$.pipe(W(e=>e.key==="video-confirm"),fe(1)).subscribe(e=>{var t;this.videoConfirmDialogEntry&&this.videoConfirmDialogEntry.remove(),e.data.result==="declined"&&(this.guestId=null),(t=this.engine)==null||t.videoPrepared(e.data.result),this.printSystem(e.data.text)})}showVideoIFrame(e){var i;this.guestId=Ji(),this.videoIFrameElement=new Jt(e,this.guestId);const t=this.component.application.root;(i=t==null?void 0:t.shadowRoot)==null||i.prepend(this.videoIFrameElement),this.inVideoCall=!0,this.setHeaderOption()}showChatOverVideo(e){this.guestId&&e===this.guestId&&(this.chatOverlayActive=!0,this.showChatOverlay$.next(this.chatOverlayActive))}async logoutUser(){this.logoutConfirmDialogEntry&&this.logoutConfirmDialogEntry.remove(),await this.engine.getChatStatus()==="noSession"?(this.resetAuthState(Pe.NonAuthenticated),this.setSessionId(null),this.component.clearMessages(),this.shouldUseAuth&&this.startAuthenticationFlow()):this.endConversation()}showLogoutConfirmDialog(){var e;(e=this.logoutConfirmDialogEntry)==null||e.remove(),this.logoutConfirmDialogEntry=new ee(j.System,{name:""},[{items:[["ace-logout-confirm-dialog",{content:""}]]}]),this.printEntry(this.logoutConfirmDialogEntry),this.logoutConfirmDialogEntry.actions$.pipe(W(t=>t.key==="logout-chat"),fe(1)).subscribe(async t=>{var i;((i=t.data)==null?void 0:i.result)==="logout"&&this.logoutUser()})}removeVideo(){var e;(e=this.videoIFrameElement)==null||e.remove(),this.guestId=null,this.chatOverlayActive&&(this.chatOverlayActive=!1,this.showChatOverlay$.next(this.chatOverlayActive)),this.inVideoCall=!1,this.setHeaderOption()}addHeaderOptions(e,t,i,s,r=!0){const o=this.component.application.getComponent("widget-header");if(o)return this.conversationOption?(this.conversationOption.label=e,this.conversationOption.key=t,this.conversationOption.icon=i,this.conversationOption.onClick=s,this.conversationOption.enabled=r,o.requestUpdate(),this.conversationOption):o.addOption({label:e,icon:i,closeOnClick:!0,key:t,onClick:s,enabled:r})}removeHeaderOptions(){const e=this.component.application.getComponent("widget-header");e&&e.removeOption(this.conversationOption)}setStartNewChatOption(){this.conversationOption=this.addHeaderOptions(this.texts.getOrFallback("widget-header.start-new-chat","Start new chat"),"start-new-chat-button",ra.svg,()=>{this.restartNewChat()})}setEndConversationOption(){this.conversationOption=this.addHeaderOptions(this.texts.getOrFallback("widget-header.end-conversation","End conversation"),"end-conversation-button",hs.svg,()=>{this.showQuitConfirmDialog()},!this.inVideoCall)}async setHeaderOption(){switch(await this.engine.getChatStatus()){case"finished":this.isThirdPartyParticipant?this.removeHeaderOptions():this.setStartNewChatOption();break;case"active":this.setEndConversationOption();break;case"noSession":this.conversationOption=null}}}const mp=async n=>{(await os.getInstance(n.container)).registerProvider("ace-chat",t=>Os.getInstance("ace-chat",t))};exports.ChatProviderPlugin=mp;
+    `];let Jt=Js;gp([he({context:re}),k({attribute:!1})],Jt.prototype,"application");window.customElements.get("ace-video-iframe")||window.customElements.define("ace-video-iframe",Jt);class Os extends wc{constructor(e,t){var i,s,r,o;super(e,t),this.pendingMessages=[],this.texts=this.component.application.texts,this.headerComponent=this.component.application.getComponent("widget-header"),this.isThirdPartyParticipant=this.component.properties.chat.isThirdPartyWidget,this.agent=this.createAgent(""),this.user=this.createUser(""),this.params=new URLSearchParams(document.location.search),this.invitationUid=this.params.get("invitationUid"),this.customerName=this.params.get("customerName")||void 0,this.idHubUrl="https://idhub.dev-se.telia-ck8s.com/idhub-gateway/public",this.logoutTimer=null,this.disconnected$=new P,this.agentUsername=null,this.conversationOption=null,this._conversationOptions={},this.sessionId=null,this.contactId=null,this.errand=null,this.entrance=null,this.guestId=null,this.chatOverlayActive=!1,this.inVideoCall=!1,this.onQueueStatusReceived=a=>{this.setQueueStatus(a.text||null)},this.onEstablished=a=>{this.contactId=a.contactId,this.errand=a.errand,this.entrance=a.entrance,this.agentUsername=a.agentUsername;const l={contactId:this.contactId,errand:this.errand,entrance:this.entrance,agentUsername:this.agentUsername};this.save({survey:l}),this.setQueueStatus(null),this.agent.name=a.agent,a.videoEnded&&this.removeVideo()},this.onPrepareVideo=()=>{this.showVideoConfirmDialog()},this.onVideoPrepared=a=>{this.showVideoIFrame(a.userUrl)},this.onChatButtonClicked=a=>{this.showChatOverVideo(a.guestId)},this.onEndVideoButtonClicked=a=>{this.guestId&&(a==null?void 0:a.guestId)===this.guestId&&this.removeVideo()},this.onPenStatusChange=a=>{a.penStatus==="on"?this.setTypingState(!0):this.setTypingState(!1)},this.onChatEnded=async a=>{var c,u;this.shouldUseAuth&&this.logoutUser(),this.setToastMessage(null),this.setTypingState(!1),this.videoConfirmDialogEntry&&this.videoConfirmDialogEntry.remove(),this.component.disableInput(),a.showForm&&this.showConversationEndedForm();const l=this.component.application.settings;(c=l==null?void 0:l.survey)!=null&&c.shouldUseSurvey&&((u=l==null?void 0:l.survey)!=null&&u.surveyBaseUrl)&&this.showSurvey(),this.isThirdPartyParticipant?this.removeHeaderOptions():this.setStartNewChatOption(),this.complete()},this.properties=t.properties,this.shouldUseAuth=(s=(i=this.component.application.settings)==null?void 0:i.auth)==null?void 0:s.shouldUseAuth,this.idHubEidType=(o=(r=this.component.application.settings)==null?void 0:r.auth)==null?void 0:o.idHubEidType.toLowerCase()}connect(e={}){super.connect(),this.setupAuthenticationListeners(),this._conversationOptions=e;const t={...this.properties.chat??{},...e},i=!!this.sessionId;if(!i){const r=Ji();this.setSessionId(r)}this.save({chatSessionId:this.sessionId}),this.engine=new Yd(t,this.sessionId),this.engine.messages().subscribe(r=>{switch(r.source){case"agent":this.printAgent(r.text);break;case"customer":this.clearPendingMessages(),this.isThirdPartyParticipant?r.source==="customer"&&r.invitationNo==="0"?this.printAgent(r.text,r.alias):this.printUser(r.text):r.source==="customer"&&Number(r.invitationNo)>0?this.printAgent(r.text,r.alias):this.printUser(r.text);break;case"system":this.printSystem(r.text);break}}),this.engine.actions().pipe(z(this.disconnected$),W(zd)).subscribe(this.onQueueStatusReceived),this.engine.actions().pipe(z(this.disconnected$),W(Hd)).subscribe(this.onEstablished),this.engine.actions().pipe(z(this.disconnected$),W(Fd)).subscribe(this.onPrepareVideo),this.engine.actions().pipe(z(this.disconnected$),W(Bd)).subscribe(this.onVideoPrepared),this.engine.actions().pipe(z(this.disconnected$),W(qd)).subscribe(this.onChatButtonClicked),this.engine.actions().pipe(z(this.disconnected$),W(Vd)).subscribe(this.onEndVideoButtonClicked),this.engine.actions().pipe(z(this.disconnected$),W(jd)).subscribe(this.onPenStatusChange),this.engine.actions().pipe(z(this.disconnected$),W(Wd)).subscribe(this.onChatEnded),this.setHeaderOption();const s=this.component.application.trigger;s&&s.widgetActive$.pipe(z(s.componentIsDestroyed$)).subscribe(r=>{r&&(this.conversationOption=null,this.setHeaderOption())}),this.component.userTyping$.pipe(z(this.disconnected$)).subscribe(r=>{var o;(o=this.engine)==null||o.sendPenStatusOn(r)}),i?this.engine.rehydrate().then(r=>{var o;r?(o=this.engine)==null||o.reconnect().pipe(z(this.disconnected$)).subscribe({error:a=>{console.error("Failed to reconnect to the engine:",a)}}):this.initializeChat(t).catch(a=>{console.error("Failed to initialize chat during rehydration:",a)})}):this.initializeChat(t).catch(r=>{console.error("Failed to initialize chat:",r)})}disconnected(){super.disconnected(),this.logoutTimer&&(clearTimeout(this.logoutTimer),this.logoutTimer=null),this.disconnected$.next()}onUserSubmit(e){const t=this.printUser(e.text);t.setStatus("pending"),this.pendingMessages.push(t),(async()=>{var i;try{await((i=this.engine)==null?void 0:i.chatWrite(e.text))}catch(s){s instanceof Fn?t.setStatus("failed"):(t.setStatus("failed"),console.warn("Unhandled error:",s))}})()}save(e){this.component.stateMachine.session().pipe(Te(t=>(t==null?void 0:t.data$)||tt),fe(1)).subscribe(t=>{this.saveToCurrentSession$.next({...t,...e})})}async rehydrate(e){e.chatSessionId&&this.setSessionId(e.chatSessionId),e.survey&&(this.contactId=e.survey.contactId,this.errand=e.survey.errand,this.entrance=e.survey.entrance,this.agentUsername=e.survey.agentUsername)}static getInstance(e,t){return t.providerInstance??(t.providerInstance=new Os(e,t)),t.providerInstance}async initializeChat(e){this.shouldUseAuth&&this.idHubEidType?(this.setupIDHubAuth(),this.idHubClient&&await this.startAuthenticationFlow()):this.handleWelcomeForm(e)}setupAuthenticationListeners(){var e;this.shouldUseAuth&&this.headerComponent&&this.headerComponent.actions$&&((e=this.headerComponent)==null||e.actions$.pipe(W(t=>t.key==="start-auth"||t.key==="logout-auth"),z(this.disconnected$)).subscribe(t=>{t.key==="start-auth"?this.handleAuthentication():t.key==="logout-auth"&&this.showLogoutConfirmDialog()}))}setupIDHubAuth(){var e;this.idHubClient=new Bt({...(e=this.component.application.settings)==null?void 0:e.auth,idHubUrl:this.idHubUrl})}async startAuthenticationFlow(){this.component.disableInput(),this.resetAuthState(Pe.NonAuthenticated);const e=await this.idHubClient.auth();if(e.status===H.Error){this.printSystem(this.texts.getOrFallback("auth.setup.error-message","An error occurred while setting up authentication.")),this.headerComponent.showAuthOptions=!1;return}switch(this.idHubEidType){case _e.Tunnistus:if(!e.tunnistusURL){this.printSystem(this.texts.getOrFallback("auth.setup.tunnistus.url-error-message","Unable to retrieve the Tunnistus authentication URL.")),this.headerComponent.showAuthOptions=!1;return}this.authURL=e.tunnistusURL,this.headerComponent.authUrl=e.tunnistusURL,this.headerComponent.authState=Pe.NonAuthenticated,this.authenticationCardEntry=this.showTunnistusAuthCard(Ze.Initial,e.tunnistusURL),this.authenticationCardEntry.actions$.pipe(W(t=>t.key==="start-auth"),fe(1)).subscribe(()=>{this.handleAuthentication()});break;case _e.BankId:break}}async handleWelcomeForm(e,t){let i=!0;e.webApiUrl&&(i=await this.isEntranceOpen(e.webApiUrl,e.entrance)),i?this.customerName?this.startChat({customerName:this.customerName,customData:{}},t):this.showWelcomeForm():this.showEntranceClosedDialog()}startChat(e,t){if(!this.engine)return;const i=e.customData.errand??this.engine.config.defaultErrand;if(!i)throw new Error("Errand is required but was not configured");this.isThirdPartyParticipant?(this.component.application.root.style.visibility="visible",this.engine.chatJoin({invitationUid:this.invitationUid,customerName:this.customerName??e.customerName}).pipe(z(this.disconnected$)).subscribe()):this.engine.chatRequest({customerName:e.customerName,customerEmailAddress:e.customerEmailAddress??"",visitorQuestion:e.visitorQuestion??"",customData:e.customData,errand:i,...t&&{idhubEIDToken:t}}).pipe(z(this.disconnected$)).subscribe(),this.component.enableInput(),this.component.enableSkipToLatestMessage(),this.setEndConversationOption()}restartNewChat(){this.engine&&(this.setSessionId(null),this.component.clearMessages(),this.removeHeaderOptions(),this.connect(this._conversationOptions))}setQueueStatus(e){this.setToastMessage(e)}async endConversation(){var e;this.shouldUseAuth&&this.resetAuthState(Pe.ChatEnded),await((e=this.engine)==null?void 0:e.chatQuit())}async sendConversationEmail(e){var t;try{await((t=this.engine)==null?void 0:t.chatEmailSession(e)),this.printSystem(this.texts.getOrFallback("email-form.email-sent-label","An email with the conversation was sent."))}catch(i){this.printSystem(this.texts.getOrFallback("email-form.error-message","Unable to send email with the conversation.")),i instanceof Fn||console.warn("Unhandled error:",i)}}clearPendingMessages(){this.pendingMessages.forEach(e=>{e.remove()})}setSessionId(e){this.sessionId=e}async isEntranceOpen(e,t){var s;let i=!1;try{const r=await fetch(`${e}/1/entrances/${t}/is-open`),o=await r.json();r.ok?i=(s=o==null?void 0:o.resultData)==null?void 0:s.isOpen:console.log(`Problem when fetching open status for entrance ${t}:`,o==null?void 0:o.resultMessage)}catch(r){console.log(`Failed to fetch open status for ${t}:`,r)}return i}resetAuthState(e){this.headerComponent.authState=e,this.headerComponent.userName="",this.headerComponent.authUrl="",this.authURL="",this.component.application.storage.removeItem("auth")}async handleAuthentication(){var t,i,s,r;this.headerComponent.userName=this.texts.getOrFallback("widget-header.authenticating","Authenticating..."),this.headerComponent.authState=Pe.Authenticating;const e=await this.idHubClient.collect();switch(this.authenticationCardEntry&&this.authenticationCardEntry.remove(),this.idHubEidType){case _e.Tunnistus:if(e.status===H.Error){this.headerComponent.userName=this.texts.getOrFallback("widget-header.not-authenticated","Not authenticated"),this.headerComponent.authState=Pe.NonAuthenticated,this.authenticationCardEntry=this.showTunnistusAuthCard(Ze.Error,this.authURL);return}else if(e.status===H.Authenticated){const o=Zd(((t=e==null?void 0:e.idhubEIDToken)==null?void 0:t.split(".")[1])??""),a=JSON.parse(o),l=((s=(i=a==null?void 0:a.completionData)==null?void 0:i.user)==null?void 0:s.name)??"",c=a==null?void 0:a.exp;if(typeof c=="number"&&c>0){const u=c*1e3-Date.now();u<=0?this.logoutUser():(this.logoutTimer&&clearTimeout(this.logoutTimer),this.logoutTimer=setTimeout(()=>{this.logoutUser()},u))}this.headerComponent.userName=l,this.headerComponent.authState=Pe.Authenticated,this.component.application.storage.set("auth",{name:l,authenticated:!0}),(r=this.authenticationCardEntry)==null||r.remove(),this.handleWelcomeForm(this.engine.config,e.idhubEIDToken)}break;case _e.BankId:break}}printAgent(e,t=""){const i=t.length>0?this.agent.print(e,"markdown",t):this.agent.print(e,"markdown");return this.setTypingState(!1),i}printUser(e){const t=Ni(Rr(e));return this.user.print(t)}printSystem(e){const t=Ni(Rr(e));return this.system.print(t)}showSurvey(){const e=new ee(j.System,{name:""},[{items:[["ace-survey",{content:""},{agentUsername:this.agentUsername??"",entrance:this.entrance??this.engine.config.entrance,errand:this.errand??this.engine.config.defaultErrand,contactId:this.contactId??""}]]}]);this.printEntry(e)}showTunnistusAuthCard(e,t,i){const s=new ee(j.System,{name:""},[{items:[["ace-tunnistus-auth-card",{content:""},{state:e,tunnistusURL:t??"",errorMessage:i??""}]]}]);return this.printEntry(s),s}showWelcomeForm(){this.component.disableInput(),this.component.disableSkipToLatestMessage();let e;this.isThirdPartyParticipant?e=new ee(j.System,{name:""},[{items:[["ace-welcome-form-third-party",{content:""}]]}]):e=new ee(j.System,{name:""},[{items:[["ace-welcome-form",{content:""}]]}]),this.printEntry(e),e.actions$.pipe(W(t=>t.key==="submitted"),fe(1)).subscribe(t=>{e.remove(),this.startChat({customerName:t.data.name,customerEmailAddress:t.data.email,visitorQuestion:t.data.question,customData:t.data.customData})})}showEntranceClosedDialog(){this.component.disableInput();const e=new ee(j.System,{name:""},[{items:[["ace-entrance-closed-dialog",{content:""}]]}]);this.printEntry(e)}showQuitConfirmDialog(){var e;(e=this.quitConfirmDialogEntry)==null||e.remove(),this.quitConfirmDialogEntry=new ee(j.System,{name:""},[{items:[["ace-quit-confirm-dialog",{content:""}]]}]),this.printEntry(this.quitConfirmDialogEntry),this.quitConfirmDialogEntry.actions$.pipe(W(t=>t.key==="quit-chat"),fe(1)).subscribe(t=>{var i,s,r,o;((i=t.data)==null?void 0:i.result)==="quit"?(this.endConversation(),(s=this.quitConfirmDialogEntry)==null||s.remove()):((r=t.data)==null?void 0:r.result)==="cancel"&&((o=this.quitConfirmDialogEntry)==null||o.remove())})}showConversationEndedForm(){const e=new ee(j.System,{name:""},[{items:[["ace-conversation-ended-form",{content:""}]]}]);this.printEntry(e),e.actions$.pipe(W(t=>t.key==="submitted"),fe(1)).subscribe(t=>{e.remove(),t.data.email&&this.sendConversationEmail(t.data.email)})}showVideoConfirmDialog(){this.videoConfirmDialogEntry=new ee(j.System,{name:""},[{items:[["ace-video-confirm-dialog",{content:""}]]}]),this.printEntry(this.videoConfirmDialogEntry),this.videoConfirmDialogEntry.actions$.pipe(W(e=>e.key==="video-confirm"),fe(1)).subscribe(e=>{var t;this.videoConfirmDialogEntry&&this.videoConfirmDialogEntry.remove(),e.data.result==="declined"&&(this.guestId=null),(t=this.engine)==null||t.videoPrepared(e.data.result),this.printSystem(e.data.text)})}showVideoIFrame(e){var i;this.guestId=Ji(),this.videoIFrameElement=new Jt(e,this.guestId);const t=this.component.application.root;(i=t==null?void 0:t.shadowRoot)==null||i.prepend(this.videoIFrameElement),this.inVideoCall=!0,this.setHeaderOption()}showChatOverVideo(e){this.guestId&&e===this.guestId&&(this.chatOverlayActive=!0,this.showChatOverlay$.next(this.chatOverlayActive))}async logoutUser(){this.logoutConfirmDialogEntry&&this.logoutConfirmDialogEntry.remove(),await this.engine.getChatStatus()==="noSession"?(this.resetAuthState(Pe.NonAuthenticated),this.setSessionId(null),this.component.clearMessages(),this.shouldUseAuth&&this.startAuthenticationFlow()):this.endConversation()}showLogoutConfirmDialog(){var e;(e=this.logoutConfirmDialogEntry)==null||e.remove(),this.logoutConfirmDialogEntry=new ee(j.System,{name:""},[{items:[["ace-logout-confirm-dialog",{content:""}]]}]),this.printEntry(this.logoutConfirmDialogEntry),this.logoutConfirmDialogEntry.actions$.pipe(W(t=>t.key==="logout-chat"),fe(1)).subscribe(async t=>{var i,s,r,o;((i=t.data)==null?void 0:i.result)==="logout"?(this.logoutUser(),(s=this.logoutConfirmDialogEntry)==null||s.remove()):((r=t.data)==null?void 0:r.result)==="cancel"&&((o=this.logoutConfirmDialogEntry)==null||o.remove())})}removeVideo(){var e;(e=this.videoIFrameElement)==null||e.remove(),this.guestId=null,this.chatOverlayActive&&(this.chatOverlayActive=!1,this.showChatOverlay$.next(this.chatOverlayActive)),this.inVideoCall=!1,this.setHeaderOption()}addHeaderOptions(e,t,i,s,r=!0){const o=this.component.application.getComponent("widget-header");if(o)return this.conversationOption?(this.conversationOption.label=e,this.conversationOption.key=t,this.conversationOption.icon=i,this.conversationOption.onClick=s,this.conversationOption.enabled=r,o.requestUpdate(),this.conversationOption):o.addOption({label:e,icon:i,closeOnClick:!0,key:t,onClick:s,enabled:r})}removeHeaderOptions(){const e=this.component.application.getComponent("widget-header");e&&e.removeOption(this.conversationOption)}setStartNewChatOption(){this.conversationOption=this.addHeaderOptions(this.texts.getOrFallback("widget-header.start-new-chat","Start new chat"),"start-new-chat-button",ra.svg,()=>{this.restartNewChat()})}setEndConversationOption(){this.conversationOption=this.addHeaderOptions(this.texts.getOrFallback("widget-header.end-conversation","End conversation"),"end-conversation-button",hs.svg,()=>{this.showQuitConfirmDialog()},!this.inVideoCall)}async setHeaderOption(){switch(await this.engine.getChatStatus()){case"finished":this.isThirdPartyParticipant?this.removeHeaderOptions():this.setStartNewChatOption();break;case"active":this.setEndConversationOption();break;case"noSession":this.conversationOption=null}}}const mp=async n=>{(await os.getInstance(n.container)).registerProvider("ace-chat",t=>Os.getInstance("ace-chat",t))};exports.ChatProviderPlugin=mp;

package/index.mjs

@@ -9288,10 +9288,15 @@ var op = Object.defineProperty, ap = (n, e, t, i) => {
   return s && op(e, t, s), s;
 };
 const Qs = class Qs extends _ {
-  _onQuit() {
+  firstUpdated() {
+    var t;
+    const e = (t = this.shadowRoot) == null ? void 0 : t.querySelector(".container");
+    e && e.focus();
+  }
+  onQuit() {
     this.dispatchResult("quit");
   }
-  _onCancel() {
+  onCancel() {
     this.dispatchResult("cancel");
   }
   dispatchResult(e) {
@@ -9308,7 +9313,12 @@ const Qs = class Qs extends _ {
   }
   render() {
     const e = this.application.texts;
-    return y`<div class="container">
+    return y`<div
+      class="container"
+      role="dialog"
+      aria-modal="true"
+      tabindex="-1"
+    >
       <h3>
         ${e.getOrFallback(
       "quit-confirm.title",
@@ -9322,10 +9332,10 @@ const Qs = class Qs extends _ {
     )}
       </p>
       <div class="button-container">
-        <button class="cancel" @click=${this._onCancel}>
+        <button class="cancel" @click=${this.onCancel}>
           ${e.getOrFallback("quit-confirm.cancel-button", "Cancel")}
         </button>
-        <button class="quit" @click=${this._onQuit}>
+        <button class="quit" @click=${this.onQuit}>
           ${e.getOrFallback("quit-confirm.end-chat-button", "End chat")}
         </button>
       </div>
@@ -9409,10 +9419,15 @@ var lp = Object.defineProperty, cp = (n, e, t, i) => {
   return s && lp(e, t, s), s;
 };
 const Xs = class Xs extends _ {
-  _onQuit() {
+  firstUpdated() {
+    var t;
+    const e = (t = this.shadowRoot) == null ? void 0 : t.querySelector(".container");
+    e && e.focus();
+  }
+  onQuit() {
     this.dispatchResult("logout");
   }
-  _onCancel() {
+  onCancel() {
     this.dispatchResult("cancel");
   }
   dispatchResult(e) {
@@ -9429,7 +9444,12 @@ const Xs = class Xs extends _ {
   }
   render() {
     const e = this.application.texts;
-    return y`<div class="container">
+    return y`<div
+      class="container"
+      role="dialog"
+      aria-modal="true"
+      tabindex="-1"
+    >
       <h3>
         ${e.getOrFallback(
       "logout-confirm.title",
@@ -9443,10 +9463,10 @@ const Xs = class Xs extends _ {
     )}
       </p>
       <div class="button-container">
-        <button class="cancel" @click=${this._onCancel}>
+        <button class="cancel" @click=${this.onCancel}>
           ${e.getOrFallback("logout-confirm.cancel-button", "Cancel")}
         </button>
-        <button class="quit" @click=${this._onQuit}>
+        <button class="quit" @click=${this.onQuit}>
           ${e.getOrFallback("logout-confirm.end-chat-button", "Log out")}
         </button>
       </div>
@@ -10249,8 +10269,8 @@ class Os extends wc {
       W((t) => t.key === "quit-chat"),
       fe(1)
     ).subscribe((t) => {
-      var i;
-      this.quitConfirmDialogEntry && this.quitConfirmDialogEntry.remove(), ((i = t.data) == null ? void 0 : i.result) === "quit" && this.endConversation();
+      var i, s, r, o;
+      ((i = t.data) == null ? void 0 : i.result) === "quit" ? (this.endConversation(), (s = this.quitConfirmDialogEntry) == null || s.remove()) : ((r = t.data) == null ? void 0 : r.result) === "cancel" && ((o = this.quitConfirmDialogEntry) == null || o.remove());
     });
   }
   showConversationEndedForm() {
@@ -10320,8 +10340,8 @@ class Os extends wc {
       W((t) => t.key === "logout-chat"),
       fe(1)
     ).subscribe(async (t) => {
-      var i;
-      ((i = t.data) == null ? void 0 : i.result) === "logout" && this.logoutUser();
+      var i, s, r, o;
+      ((i = t.data) == null ? void 0 : i.result) === "logout" ? (this.logoutUser(), (s = this.logoutConfirmDialogEntry) == null || s.remove()) : ((r = t.data) == null ? void 0 : r.result) === "cancel" && ((o = this.logoutConfirmDialogEntry) == null || o.remove());
     });
   }
   // ===========

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "@telia-ace/ace-chat-flamingo",
-  "version": "1.1.122-rc.3",
+  "version": "1.1.122-rc.4",
   "dependencies": {
-    "@telia-ace/widget-core-flamingo": "1.1.122-rc.3",
-    "@telia-ace/widget-conversation-flamingo": "1.1.122-rc.3",
+    "@telia-ace/widget-core-flamingo": "1.1.122-rc.4",
+    "@telia-ace/widget-conversation-flamingo": "1.1.122-rc.4",
     "rxjs": "^7.8.2",
     "lit": "^3.0.2",
     "@teliads/icons": "^8.4.0",

package/ui/logout-confirm-dialog.d.ts

@@ -1,9 +1,10 @@
 import { LitElement } from 'lit';
 export declare class LogoutConfirmDialog extends LitElement {
     static styles: import('lit').CSSResult[];
-    _onQuit(): void;
-    _onCancel(): void;
-    dispatchResult(result?: string): void;
     private application;
+    firstUpdated(): void;
+    private onQuit;
+    private onCancel;
+    private dispatchResult;
     render(): import('lit-html').TemplateResult<1>;
 }

package/ui/quit-confirm-dialog.d.ts

@@ -1,9 +1,10 @@
 import { LitElement } from 'lit';
 export declare class QuitConfirmDialog extends LitElement {
     static readonly styles: import('lit').CSSResult[];
-    _onQuit(): void;
-    _onCancel(): void;
-    dispatchResult(result?: string): void;
     private readonly application;
+    firstUpdated(): void;
+    private onQuit;
+    private onCancel;
+    private dispatchResult;
     render(): import('lit-html').TemplateResult<1>;
 }