@microsoft/omnichannel-chat-widget 0.1.0-main.106d830 → 0.1.0-main.1e0880a

package/lib/esm/components/livechatwidget/common/createFooter.js

@@ -3,25 +3,13 @@ import React from "react";
 import { decodeComponentString } from "@microsoft/omnichannel-chat-components";
 import { shouldShowFooter } from "../../../controller/componentController";
 export const createFooter = (props, state) => {
-  var _props$footerProps, _props$controlProps, _props$componentOverr, _props$componentOverr2;
-
-  const footerPropsHidden = { ...props.footerProps,
-    controlProps: { ...((_props$footerProps = props.footerProps) === null || _props$footerProps === void 0 ? void 0 : _props$footerProps.controlProps),
-      hideDownloadTranscriptButton: true,
-      hideEmailTranscriptButton: true,
-      hideAudioNotificationButton: true
-    }
-  };
-  const footer = !((_props$controlProps = props.controlProps) !== null && _props$controlProps !== void 0 && _props$controlProps.hideFooter) && shouldShowFooter(state) ? decodeComponentString((_props$componentOverr = props.componentOverrides) === null || _props$componentOverr === void 0 ? void 0 : _props$componentOverr.footer) || /*#__PURE__*/React.createElement(FooterStateful, {
+  var _props$controlProps, _props$componentOverr;
+  const hideFooterDisplay = !((_props$controlProps = props.controlProps) !== null && _props$controlProps !== void 0 && _props$controlProps.hideFooter) && shouldShowFooter(state) ? false : true;
+  const footer = decodeComponentString((_props$componentOverr = props.componentOverrides) === null || _props$componentOverr === void 0 ? void 0 : _props$componentOverr.footer) || /*#__PURE__*/React.createElement(FooterStateful, {
     footerProps: props.footerProps,
     downloadTranscriptProps: props.downloadTranscriptProps,
     audioNotificationProps: props.audioNotificationProps,
-    hideFooterDisplay: false
-  }) : decodeComponentString((_props$componentOverr2 = props.componentOverrides) === null || _props$componentOverr2 === void 0 ? void 0 : _props$componentOverr2.footer) || /*#__PURE__*/React.createElement(FooterStateful, {
-    footerProps: footerPropsHidden,
-    downloadTranscriptProps: props.downloadTranscriptProps,
-    audioNotificationProps: props.audioNotificationProps,
-    hideFooterDisplay: true
+    hideFooterDisplay: hideFooterDisplay
   });
   return footer;
 };

package/lib/esm/components/livechatwidget/common/createInternetConnectionChangeHandler.js

@@ -2,7 +2,8 @@ import { Constants } from "../../../common/Constants";
 import { NotificationHandler } from "../../webchatcontainerstateful/webchatcontroller/notification/NotificationHandler";
 import { NotificationScenarios } from "../../webchatcontainerstateful/webchatcontroller/enums/NotificationScenarios";
 import { defaultMiddlewareLocalizedTexts } from "../../webchatcontainerstateful/common/defaultProps/defaultMiddlewareLocalizedTexts";
-
+import { TelemetryHelper } from "../../../common/telemetry/TelemetryHelper";
+import { LogLevel, TelemetryEvent } from "../../../common/telemetry/TelemetryConstants";
 const isInternetConnected = async () => {
   try {
     const response = await fetch(Constants.internetConnectionTestUrl);
@@ -12,19 +13,23 @@ const isInternetConnected = async () => {
     return false;
   }
 };
-
 export const createInternetConnectionChangeHandler = async () => {
   const handler = async () => {
     const connected = await isInternetConnected();
-
     if (!connected) {
+      TelemetryHelper.logActionEvent(LogLevel.WARN, {
+        Event: TelemetryEvent.NetworkDisconnected
+      });
       NotificationHandler.notifyError(NotificationScenarios.InternetConnection, defaultMiddlewareLocalizedTexts.MIDDLEWARE_BANNER_NO_INTERNET_CONNECTION);
     } else {
+      TelemetryHelper.logActionEvent(LogLevel.WARN, {
+        Event: TelemetryEvent.NetworkReconnected
+      });
       NotificationHandler.notifySuccess(NotificationScenarios.InternetConnection, defaultMiddlewareLocalizedTexts.MIDDLEWARE_BANNER_INTERNET_BACK_ONLINE);
     }
-  }; // Checking connection status on online & offline events due to possible false positives
-
+  };
 
+  // Checking connection status on online & offline events due to possible false positives
   window.addEventListener("online", () => handler(), false);
   window.addEventListener("offline", () => handler(), false);
 };

package/lib/esm/components/livechatwidget/common/createMarkdown.js

@@ -1,61 +1,62 @@
 import MarkdownIt from "markdown-it";
 import MarkdownItForInline from "markdown-it-for-inline";
 import { defaultMarkdownLocalizedTexts } from "../../webchatcontainerstateful/common/defaultProps/defaultMarkdownLocalizedTexts";
-import { Constants } from "../../../common/Constants"; // eslint-disable-next-line @typescript-eslint/no-explicit-any
+import { Constants } from "../../../common/Constants";
 
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
 export const createMarkdown = (disableMarkdownMessageFormatting, disableNewLineMarkdownSupport) => {
   let markdown;
-
   if (!disableMarkdownMessageFormatting) {
     markdown = new MarkdownIt(Constants.Default, {
       html: true,
       linkify: true,
       breaks: !disableNewLineMarkdownSupport
-    }); // ToDo: Commenting below usage of plugin until deferred bug is resolved: https://github.com/mayashavin/markdown-it-slack/issues/1
-    // markdown.use(MarkdownSlack);
-    // Markdown override for open link in new tab
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any, quotes
-
-    markdown.use(MarkdownItForInline, "url_new_win", "link_open", function (tokens, idx, env) {
-      const targetAttrIndex = tokens[idx].attrIndex(Constants.Target); // Put a transparent pixel instead of the "open in new window" icon, so developers can easily modify the icon in CSS.
-
-      const TRANSPARENT_GIF = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7";
-
-      if (~targetAttrIndex) {
-        tokens[idx].attrs[targetAttrIndex][1] = Constants.Blank;
-      } else {
-        tokens[idx].attrPush([Constants.Target, Constants.Blank]);
-      }
-
-      const relAttrIndex = tokens[idx].attrIndex(Constants.TargetRelationship);
-
-      if (~relAttrIndex) {
-        tokens[idx].attrs[relAttrIndex][1] = Constants.TargetRelationshipAttributes;
-      } else {
-        tokens[idx].attrPush([Constants.TargetRelationship, Constants.TargetRelationshipAttributes]);
-        tokens[idx].attrPush([Constants.Title, defaultMarkdownLocalizedTexts.MARKDOWN_EXTERNAL_LINK_ALT]); // eslint-disable-next-line quotes
-
-        const iconTokens = markdown.parseInline(`![${defaultMarkdownLocalizedTexts.MARKDOWN_EXTERNAL_LINK_ALT}](${TRANSPARENT_GIF})`, env)[0].children;
-
-        if (iconTokens && iconTokens.length > 0) {
-          iconTokens[0].attrJoin("class", Constants.OpenLinkIconCssClass);
-          tokens.splice(idx + 2, 0, ...iconTokens);
-        }
-      }
     });
+    // ToDo: Commenting below usage of plugin until deferred bug is resolved: https://github.com/mayashavin/markdown-it-slack/issues/1
+    // markdown.use(MarkdownSlack);
   } else {
     markdown = new MarkdownIt(Constants.Zero, {
       html: true,
       linkify: true,
       breaks: !disableNewLineMarkdownSupport
     });
-    markdown.enable(["entity", // Rule to process html entity - {, ¯, "
-    "linkify", // Rule to replace link-like texts with link nodes
-    "html_block", // Rule to process html blocks and paragraphs
-    "html_inline", // Rule to process html tags
+    markdown.enable(["entity",
+    // Rule to process html entity - {, ¯, "
+    "linkify",
+    // Rule to replace link-like texts with link nodes
+    "html_block",
+    // Rule to process html blocks and paragraphs
+    "html_inline",
+    // Rule to process html tags
     "newline" // Rule to proceess '\n'
     ]);
   }
 
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  markdown.use(MarkdownItForInline, "url_new_win", "link_open", function (tokens, idx, env) {
+    const targetAttrIndex = tokens[idx].attrIndex(Constants.Target);
+    // Put a transparent pixel instead of the "open in new window" icon, so developers can easily modify the icon in CSS.
+    const TRANSPARENT_GIF = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7";
+    if (~targetAttrIndex) {
+      tokens[idx].attrs[targetAttrIndex][1] = Constants.Blank;
+    } else {
+      tokens[idx].attrPush([Constants.Target, Constants.Blank]);
+    }
+    const relAttrIndex = tokens[idx].attrIndex(Constants.TargetRelationship);
+    if (~relAttrIndex) {
+      tokens[idx].attrs[relAttrIndex][1] = Constants.TargetRelationshipAttributes;
+    } else {
+      tokens[idx].attrPush([Constants.TargetRelationship, Constants.TargetRelationshipAttributes]);
+      if (!disableMarkdownMessageFormatting) {
+        tokens[idx].attrPush([Constants.Title, defaultMarkdownLocalizedTexts.MARKDOWN_EXTERNAL_LINK_ALT]);
+        // eslint-disable-next-line quotes
+        const iconTokens = markdown.parseInline(`![${defaultMarkdownLocalizedTexts.MARKDOWN_EXTERNAL_LINK_ALT}](${TRANSPARENT_GIF})`, env)[0].children;
+        if (iconTokens && iconTokens.length > 0) {
+          iconTokens[0].attrJoin("class", Constants.OpenLinkIconCssClass);
+          tokens.splice(idx + 2, 0, ...iconTokens);
+        }
+      }
+    }
+  });
   return markdown;
 };

package/lib/esm/components/livechatwidget/common/defaultProps/dummyDefaultProps.js

@@ -1,4 +1,5 @@
 /* eslint-disable @typescript-eslint/no-empty-function, @typescript-eslint/no-explicit-any */
+
 import { ChatReconnectIconBase64, CloseChatButtonIconBase64, ModernChatIconBase64, ProactiveChatBannerBase64 } from "@microsoft/omnichannel-chat-components";
 import MockAdapter from "../../../webchatcontainerstateful/common/mockadapter";
 import { NewMessageNotificationSoundBase64 } from "../../../../assets/Audios";
@@ -10,8 +11,9 @@ import { createAvatarMiddleware } from "../../../webchatcontainerstateful/webcha
 import { createMarkdown } from "../createMarkdown";
 import { groupActivitiesMiddleware } from "../../../webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/groupActivitiesMiddleware";
 import { typingIndicatorMiddleware } from "../../../webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/typingIndicatorMiddleware";
-import { createWebChatTelemetry } from "../../../webchatcontainerstateful/webchatcontroller/webchattelemetry/WebChatLogger"; // eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { createWebChatTelemetry } from "../../../webchatcontainerstateful/webchatcontroller/webchattelemetry/WebChatLogger";
 
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
 export const dummyDefaultProps = {
   audioNotificationProps: {
     audioSrc: NewMessageNotificationSoundBase64
@@ -166,24 +168,28 @@ export const dummyDefaultProps = {
         },
         audioCallButtonStyleProps: {
           borderRadius: "50%",
-          color: "#FFFFFF",
           backgroundColor: "#008000",
           lineHeight: "40px",
           height: "40px",
           width: "40px",
-          fontSize: 18
+          icon: {
+            fontSize: 18,
+            color: "#FFFFFF"
+          }
         },
         audioCallButtonHoverStyleProps: {
           filter: "brightness(0.8)"
         },
         videoCallButtonStyleProps: {
           borderRadius: "50%",
-          color: "#FFFFFF",
           backgroundColor: "#008000",
           lineHeight: "40px",
           height: "40px",
           width: "40px",
-          fontSize: 18
+          icon: {
+            fontSize: 18,
+            color: "#FFFFFF"
+          }
         },
         videoCallButtonHoverStyleProps: {
           filter: "brightness(0.8)"
@@ -194,13 +200,15 @@ export const dummyDefaultProps = {
         },
         declineCallButtonStyleProps: {
           borderRadius: "50%",
-          color: "#FFFFFF",
           backgroundColor: "#DC0000",
           lineHeight: "40px",
           height: "40px",
           width: "40px",
-          fontSize: 18,
-          marginLeft: "5px"
+          marginLeft: "5px",
+          icon: {
+            fontSize: 18,
+            color: "#FFFFFF"
+          }
         },
         incomingCallTitleStyleProps: {
           margin: "0 5px",
@@ -253,18 +261,6 @@ export const dummyDefaultProps = {
           width: "50px",
           fontSize: "18px"
         },
-        currentCallTimerStyleProps: {
-          borderRadius: "2px",
-          margin: "1px",
-          color: "#FFFFFF",
-          paddingTop: "18px",
-          fontSize: 12,
-          fontFamily: "Segoe UI, Arial, sans-serif",
-          backgroundColor: "darkgrey",
-          height: "45px",
-          width: "50px",
-          textAlign: "center"
-        },
         videoTileStyleProps: {
           width: "100%",
           marginLeft: "auto",
@@ -328,7 +324,10 @@ export const dummyDefaultProps = {
       hideChatTextContainer: false,
       hideChatSubtitle: false,
       hideChatTitle: false,
-      hideNotificationBubble: true
+      hideNotificationBubble: true,
+      unreadMessageString: "new messages",
+      largeUnreadMessageString: "99+",
+      ariaLabelUnreadMessageString: "you have new messages"
     },
     styleProps: {
       generalStyleProps: {
@@ -474,8 +473,8 @@ export const dummyDefaultProps = {
       onConfirm: () => {},
       // Detailed implementation omitted
       onCancel: () => {} // Detailed implementation omitted
-
     },
+
     styleProps: {
       generalStyleProps: {
         backgroundColor: "#FFFFFF",
@@ -780,6 +779,7 @@ export const dummyDefaultProps = {
       },
       audioNotificationButtonProps: {
         id: "oc-lcw-footer-audionotification-button",
+        type: "icon",
         ariaLabel: "Turn sound off",
         toggleAriaLabel: "Turn sound on",
         iconName: "Volume3",
@@ -805,8 +805,10 @@ export const dummyDefaultProps = {
         padding: "0 10px 5px 10px"
       },
       downloadTranscriptButtonStyleProps: {
-        color: "blue",
-        fontSize: 16,
+        icon: {
+          color: "blue",
+          fontSize: 16
+        },
         height: "25px",
         lineHeight: "25px",
         width: "25px"
@@ -816,8 +818,10 @@ export const dummyDefaultProps = {
         backgroundColor: "#C8C8C8"
       },
       emailTranscriptButtonStyleProps: {
-        color: "blue",
-        fontSize: 16,
+        cicon: {
+          color: "blue",
+          fontSize: 16
+        },
         height: "25px",
         lineHeight: "25px",
         width: "25px"
@@ -827,8 +831,10 @@ export const dummyDefaultProps = {
         backgroundColor: "#C8C8C8"
       },
       audioNotificationButtonStyleProps: {
-        color: "blue",
-        fontSize: 16,
+        icon: {
+          color: "blue",
+          fontSize: 16
+        },
         height: "25px",
         lineHeight: "25px",
         width: "25px"
@@ -879,7 +885,7 @@ export const dummyDefaultProps = {
         className: undefined
       },
       closeButtonProps: {
-        id: "oc-lcw-header-minimize-button",
+        id: "oc-lcw-header-close-button",
         type: "icon",
         iconName: "ChromeClose",
         ariaLabel: "Close",
@@ -1058,8 +1064,8 @@ export const dummyDefaultProps = {
       titleText: "We're Offline",
       subtitleText: "No agents available",
       onClick: () => {} // Detailed implementation omitted
-
     },
+
     styleProps: {
       // ...[Existing chat button style props]
       iconStyleProps: {
@@ -1077,8 +1083,8 @@ export const dummyDefaultProps = {
         text: "We're Offline"
       },
       onMinimizeClick: () => {} // Detailed implementation omitted
-
     },
+
     styleProps: {
       // ...[Existing chat button style props]
       generalStyleProps: {
@@ -1175,7 +1181,8 @@ export const dummyDefaultProps = {
         backgroundColor: "#FFFFFF",
         borderColor: "#F1F1F1"
       }
-    }
+    },
+    isCustomerVoiceSurveyCompact: undefined
   },
   proactiveChatPaneProps: {
     componentOverrides: {
@@ -1195,7 +1202,17 @@ export const dummyDefaultProps = {
       hideSubtitle: false,
       subtitleText: "Live chat support!",
       hideCloseButton: false,
-      closeButtonAriaLabel: "Close Button",
+      closeButtonProps: {
+        id: "oc-lcw-proactivechat-closebutton",
+        type: "icon",
+        iconName: "ChromeClose",
+        ariaLabel: "Close",
+        imageIconProps: undefined,
+        text: "Close",
+        onClick: undefined,
+        className: undefined,
+        hideButtonTitle: true
+      },
       isBodyContainerHorizantal: false,
       hideBodyTitle: false,
       bodyTitleText: "Hi! Have any questions? I am here to help.",
@@ -1205,8 +1222,8 @@ export const dummyDefaultProps = {
       onClose: () => {},
       // Detailed implementation omitted
       onStart: () => {} // Detailed implementation omitted
-
     },
+
     styleProps: {
       generalStyleProps: {
         backgroundColor: "rgb(255, 255, 255)",
@@ -1337,8 +1354,8 @@ export const dummyDefaultProps = {
       onStartNewChat: () => {},
       // Detailed implementation omitted
       onMinimize: () => {} // Detailed implementation omitted
-
     },
+
     styleProps: {
       generalStyleProps: {
         backgroundColor: "rgb(255, 255, 255)",
@@ -1423,7 +1440,6 @@ export const dummyDefaultProps = {
         startNewChatButtonClassName: undefined
       }
     },
-    authClientFunction: undefined,
     isReconnectEnabled: undefined,
     reconnectId: undefined,
     redirectInSameWindow: undefined
@@ -1546,6 +1562,12 @@ export const dummyDefaultProps = {
         lineHeight: "16px",
         padding: "0px 10px 0 10px"
       },
+      userMessageBoxStyles: {
+        maxWidth: "75%"
+      },
+      systemMessageBoxStyles: {
+        maxWidth: "75%"
+      },
       typingIndicatorStyleProps: {
         marginLeft: "10px",
         marginBottom: "5px",
@@ -1665,6 +1687,9 @@ export const dummyDefaultProps = {
       },
       attachmentSizeStyles: {
         display: "none"
+      },
+      receivedMessageAnchorStyles: {
+        color: "white"
       }
     },
     localizedTexts: {
@@ -1688,7 +1713,16 @@ export const dummyDefaultProps = {
       MIDDLEWARE_MESSAGE_RETRY: "Retry",
       PRECHAT_REQUIRED_FIELD_MISSING_MESSAGE: "{0} field is required",
       MARKDOWN_EXTERNAL_LINK_ALT: "Opens in a new window; external."
+    },
+    botMagicCode: {
+      disabled: false,
+      fwdUrl: ""
+    },
+    adaptiveCardStyles: {
+      background: "white",
+      color: "black"
     }
   },
-  telemetryConfig: undefined
+  telemetryConfig: undefined,
+  getAuthToken: undefined
 };

package/lib/esm/components/livechatwidget/common/endChat.js

@@ -7,21 +7,36 @@ import { WebChatStoreLoader } from "../../webchatcontainerstateful/webchatcontro
 import { defaultWebChatContainerStatefulProps } from "../../webchatcontainerstateful/common/defaultProps/defaultWebChatContainerStatefulProps";
 import { PostChatSurveyMode } from "../../postchatsurveypanestateful/enums/PostChatSurveyMode";
 import { Constants } from "../../../common/Constants";
+import { addDelayInMs, getWidgetEndChatEventName } from "../../../common/utils";
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 const prepareEndChat = async (props, chatSDK, setAdapter, setWebChatStyles, dispatch, adapter, state) => {
-  var _state$domainStates$l, _state$domainStates$l2, _state$domainStates$l3, _state$domainStates$l4;
-
+  var _state$domainStates$l, _state$domainStates$l2, _state$domainStates$l3, _state$domainStates$l4, _conversationDetails;
   const isPostChatEnabled = (_state$domainStates$l = state.domainStates.liveChatConfig) === null || _state$domainStates$l === void 0 ? void 0 : (_state$domainStates$l2 = _state$domainStates$l.LiveWSAndLiveChatEngJoin) === null || _state$domainStates$l2 === void 0 ? void 0 : _state$domainStates$l2.msdyn_postconversationsurveyenable;
   const postChatSurveyMode = (_state$domainStates$l3 = state.domainStates.liveChatConfig) === null || _state$domainStates$l3 === void 0 ? void 0 : (_state$domainStates$l4 = _state$domainStates$l3.LiveWSAndLiveChatEngJoin) === null || _state$domainStates$l4 === void 0 ? void 0 : _state$domainStates$l4.msdyn_postconversationsurveymode;
-  const conversationDetails = await chatSDK.getConversationDetails();
 
-  if (isPostChatEnabled === "true" && (conversationDetails === null || conversationDetails === void 0 ? void 0 : conversationDetails.canRenderPostChat) === Constants.truePascal) {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  let conversationDetails = undefined;
+  try {
+    conversationDetails = await chatSDK.getConversationDetails();
+  } catch (erorr) {
+    TelemetryHelper.logActionEvent(LogLevel.ERROR, {
+      Event: TelemetryEvent.GetConversationDetailsException,
+      ExceptionDetails: {
+        exception: `Failed to get conversation details: ${erorr}`
+      }
+    });
+  }
+  if (isPostChatEnabled === "true" && ((_conversationDetails = conversationDetails) === null || _conversationDetails === void 0 ? void 0 : _conversationDetails.canRenderPostChat) === Constants.truePascal) {
     const skipEndChatSDK = false;
     const skipCloseChat = true;
-    await endChat(props, chatSDK, setAdapter, setWebChatStyles, dispatch, adapter, skipEndChatSDK, skipCloseChat);
-
+    await endChat(props, chatSDK, setAdapter, setWebChatStyles, dispatch, adapter, skipEndChatSDK, skipCloseChat, false);
     if (postChatSurveyMode === PostChatSurveyMode.Embed) {
+      dispatch({
+        type: LiveChatWidgetActionType.SET_CONVERSATION_STATE,
+        payload: ConversationState.PostchatLoading
+      });
+      await addDelayInMs(Constants.PostChatLoadingDurationInMs);
       const loadPostChatEvent = {
         eventName: BroadcastEvent.LoadPostChatSurvey
       };
@@ -32,13 +47,13 @@ const prepareEndChat = async (props, chatSDK, setAdapter, setWebChatStyles, disp
         payload: ConversationState.InActive
       });
     }
-  } else {
-    await endChat(props, chatSDK, setAdapter, setWebChatStyles, dispatch, adapter);
+    return;
   }
-}; // eslint-disable-next-line @typescript-eslint/no-explicit-any
-
+  await endChat(props, chatSDK, setAdapter, setWebChatStyles, dispatch, adapter, false, false, true);
+};
 
-const endChat = async (props, chatSDK, setAdapter, setWebChatStyles, dispatch, adapter, skipEndChatSDK, skipCloseChat) => {
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const endChat = async (props, chatSDK, setAdapter, setWebChatStyles, dispatch, adapter, skipEndChatSDK, skipCloseChat, postMessageToOtherTab) => {
   if (!skipEndChatSDK) {
     try {
       TelemetryHelper.logSDKEvent(LogLevel.INFO, {
@@ -52,16 +67,30 @@ const endChat = async (props, chatSDK, setAdapter, setWebChatStyles, dispatch, a
           exception: ex
         }
       });
+      postMessageToOtherTab = false;
     }
   }
 
+  // Need to clear these states immediately when chat ended from OC.
+  dispatch({
+    type: LiveChatWidgetActionType.SET_CUSTOM_CONTEXT,
+    payload: undefined
+  });
+  dispatch({
+    type: LiveChatWidgetActionType.SET_CHAT_TOKEN,
+    payload: undefined
+  });
+  dispatch({
+    type: LiveChatWidgetActionType.SET_LIVE_CHAT_CONTEXT,
+    payload: undefined
+  });
   if (!skipCloseChat) {
     try {
       var _props$webChatContain;
-
       adapter === null || adapter === void 0 ? void 0 : adapter.end();
       setAdapter(undefined);
-      setWebChatStyles({ ...defaultWebChatContainerStatefulProps.webChatStyles,
+      setWebChatStyles({
+        ...defaultWebChatContainerStatefulProps.webChatStyles,
         ...((_props$webChatContain = props.webChatContainerProps) === null || _props$webChatContain === void 0 ? void 0 : _props$webChatContain.webChatStyles)
       });
       WebChatStoreLoader.store = null;
@@ -82,16 +111,24 @@ const endChat = async (props, chatSDK, setAdapter, setWebChatStyles, dispatch, a
         payload: null
       });
       dispatch({
-        type: LiveChatWidgetActionType.SET_CHAT_TOKEN,
-        payload: undefined
+        type: LiveChatWidgetActionType.SET_UNREAD_MESSAGE_COUNT,
+        payload: 0
       });
       dispatch({
-        type: LiveChatWidgetActionType.SET_LIVE_CHAT_CONTEXT,
-        payload: undefined
-      });
-      BroadcastService.postMessage({
-        eventName: BroadcastEvent.EndChat
+        type: LiveChatWidgetActionType.SET_PROACTIVE_CHAT_PARAMS,
+        payload: {
+          proactiveChatBodyTitle: "",
+          proactiveChatEnablePrechat: false,
+          proactiveChatInNewWindow: false
+        }
       });
+      if (postMessageToOtherTab) {
+        var _chatSDK$omnichannelC, _chatSDK$omnichannelC2, _props$controlProps;
+        const endChatEventName = getWidgetEndChatEventName(chatSDK === null || chatSDK === void 0 ? void 0 : (_chatSDK$omnichannelC = chatSDK.omnichannelConfig) === null || _chatSDK$omnichannelC === void 0 ? void 0 : _chatSDK$omnichannelC.orgId, chatSDK === null || chatSDK === void 0 ? void 0 : (_chatSDK$omnichannelC2 = chatSDK.omnichannelConfig) === null || _chatSDK$omnichannelC2 === void 0 ? void 0 : _chatSDK$omnichannelC2.widgetId, (props === null || props === void 0 ? void 0 : (_props$controlProps = props.controlProps) === null || _props$controlProps === void 0 ? void 0 : _props$controlProps.widgetInstanceId) ?? "");
+        BroadcastService.postMessage({
+          eventName: endChatEventName
+        });
+      }
     } catch (error) {
       TelemetryHelper.logActionEvent(LogLevel.ERROR, {
         Event: TelemetryEvent.CloseChatMethodException,
@@ -102,5 +139,4 @@ const endChat = async (props, chatSDK, setAdapter, setWebChatStyles, dispatch, a
     }
   }
 };
-
 export { prepareEndChat, endChat };

package/lib/esm/components/livechatwidget/common/getGeneralStylesForButton.js

@@ -2,7 +2,6 @@ import { shouldShowChatButton, shouldShowProactiveChatPane } from "../../../cont
 import { defaultLiveChatWidgetGeneralStyles } from "./defaultStyles/defaultLiveChatWidgetGeneralStyles";
 export const getGeneralStylesForButton = state => {
   let generalStylesForButton = defaultLiveChatWidgetGeneralStyles;
-
   if (!shouldShowChatButton(state) && !shouldShowProactiveChatPane(state)) {
     generalStylesForButton = Object.assign({}, defaultLiveChatWidgetGeneralStyles, {
       boxShadow: "0px 0px 2px rgba(0, 0, 0, 0.16), 0px 4px 8px rgba(0, 0, 0, 0.12)",
@@ -12,6 +11,5 @@ export const getGeneralStylesForButton = state => {
       padding: "0.5"
     });
   }
-
   return generalStylesForButton;
 };

package/lib/esm/components/livechatwidget/common/initCallingSdk.js

@@ -1,6 +1,7 @@
 import { LogLevel, TelemetryEvent } from "../../../common/telemetry/TelemetryConstants";
-import { TelemetryHelper } from "../../../common/telemetry/TelemetryHelper"; // eslint-disable-next-line @typescript-eslint/no-explicit-any
+import { TelemetryHelper } from "../../../common/telemetry/TelemetryHelper";
 
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
 export const initCallingSdk = async (chatSDK, setVoiceVideoCallingSDK) => {
   try {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -13,18 +14,15 @@ export const initCallingSdk = async (chatSDK, setVoiceVideoCallingSDK) => {
       });
       return true;
     }
-
     return false;
   } catch (error) {
-    if (error !== "Voice and video call is not enabled") {
-      TelemetryHelper.logCallingEvent(LogLevel.ERROR, {
-        Event: TelemetryEvent.CallingSDKLoadFailed,
-        ExceptionDetails: {
-          exception: error
-        }
-      });
-    }
-
+    TelemetryHelper.logCallingEvent(LogLevel.ERROR, {
+      Event: TelemetryEvent.CallingSDKLoadFailed,
+      ExceptionDetails: {
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        exception: error.message
+      }
+    });
     return false;
   }
 };

package/lib/esm/components/livechatwidget/common/initConfirmationPropsComposer.js

@@ -1,14 +1,13 @@
 import { defaultConfirmationPaneLocalizedTexts } from "../../confirmationpanestateful/common/defaultProps/defaultConfirmationPaneLocalizedTexts";
 export const initConfirmationPropsComposer = props => {
   var _props$confirmationPa, _props$footerProps, _props$footerProps$co, _props$footerProps2, _props$footerProps2$c, _props$confirmationPa2;
-
-  const confirmationPanelocalizedTexts = { ...defaultConfirmationPaneLocalizedTexts,
+  const confirmationPanelocalizedTexts = {
+    ...defaultConfirmationPaneLocalizedTexts,
     ...(props === null || props === void 0 ? void 0 : (_props$confirmationPa = props.confirmationPaneProps) === null || _props$confirmationPa === void 0 ? void 0 : _props$confirmationPa.confirmationPaneLocalizedTexts)
   };
   let confirmationPaneInputs;
   const emailTranscriptDisabled = ((_props$footerProps = props.footerProps) === null || _props$footerProps === void 0 ? void 0 : (_props$footerProps$co = _props$footerProps.controlProps) === null || _props$footerProps$co === void 0 ? void 0 : _props$footerProps$co.hideEmailTranscriptButton) ?? false;
   const downloadTranscriptDisabled = ((_props$footerProps2 = props.footerProps) === null || _props$footerProps2 === void 0 ? void 0 : (_props$footerProps2$c = _props$footerProps2.controlProps) === null || _props$footerProps2$c === void 0 ? void 0 : _props$footerProps2$c.hideDownloadTranscriptButton) ?? false;
-
   if (!emailTranscriptDisabled && !downloadTranscriptDisabled) {
     confirmationPaneInputs = {
       title: confirmationPanelocalizedTexts.CLOSE_CONFIRMATION_DIALOG_TITLE_FOR_EMAIL_AND_DOWNLOAD_TRANSCRIPT_ENABLED,
@@ -30,8 +29,8 @@ export const initConfirmationPropsComposer = props => {
       description: confirmationPanelocalizedTexts.CLOSE_CONFIRMATION_DIALOG_DESCRIPTION_DEFAULT
     };
   }
-
-  const confirmationPaneProps = { ...props.confirmationPaneProps,
+  const confirmationPaneProps = {
+    ...props.confirmationPaneProps,
     controlProps: {
       titleText: confirmationPaneInputs.title,
       subtitleText: confirmationPaneInputs.description,