@microsoft/omnichannel-chat-widget 0.1.0-main.438e1d0 → 0.1.0-main.4629f07

package/README.md

@@ -11,8 +11,6 @@
 1. [Installation](#installation)
 1. [Example Usage](#example-usage)
 1. [Components](#components)
-1. [Common Scenarios](#common-scenarios)
-    - [Disable Bot Magic Code](#disable-bot-magic-code)
 1. [See Also](#see-also)
 
 ## Introduction
@@ -97,7 +95,9 @@ const render = async () => {
 render();
 ```
 
-A sample widget can be found in this repo [here](https://github.com/microsoft/omnichannel-chat-widget/tree/main/chat-widget/sample). To build it, do ```yarn build-sample``` or ```yarn build-sample:dev``` from project root.
+A javascript sample widget can be found in this repo [here](https://github.com/microsoft/omnichannel-chat-widget/tree/main/chat-widget/samples/javascript-sample). To build it, do ```yarn build-sample``` or ```yarn build-sample:dev``` from project root. 
+
+A typescript sample widget can be found [here](https://github.com/microsoft/omnichannel-chat-widget/tree/main/chat-widget/samples/typescript-sample)
 
 ## Components
 
@@ -129,6 +129,7 @@ These are components that are included in the ```@microsoft/omnichannel-chat-com
 | ----- | -------- | ----- |
 | WebChatContainer | The default wrapper around BotFramework's [WebChat](https://github.com/microsoft/BotFramework-WebChat), which is the message container we are using | [IWebChatContainerStatefulProps](https://github.com/microsoft/omnichannel-chat-widget/blob/main/chat-widget/src/components/webchatcontainerstateful/interfaces/IWebChatContainerStatefulProps.ts) |
 | LiveChatWidget | The default widget that stitches the UI components with Chat SDK | [ILiveChatWidgetProps](https://github.com/microsoft/omnichannel-chat-widget/blob/main/chat-widget/src/components/livechatwidget/interfaces/ILiveChatWidgetProps.ts) |
+| PostChatLoadingPane | The default loading pane used after the chat is ended and before the post chat pane loads completely | [ILoadingPaneProps](https://github.com/microsoft/omnichannel-chat-widget/blob/main/chat-components/src/components/loadingpane/interfaces/ILoadingPaneProps.ts) |
 
 Some of the interfaces listed in the Stateless table have Stateful counterparts defined in the ```@microsoft/omnichannel-chat-widget``` package. For example, [IConfirmationPaneStatefulProps](https://github.com/microsoft/omnichannel-chat-widget/blob/main/chat-widget/src/components/confirmationpanestateful/interfaces/IConfirmationPaneStatefulProps.ts) extends [IConfirmationPaneProps](https://github.com/microsoft/omnichannel-chat-widget/blob/main/chat-components/src/components/confirmationpane/interfaces/IConfirmationPaneProps.ts) with additional attributes that only makes sense in the stateful context.
 
@@ -220,40 +221,12 @@ const customizedFooterProp: IFooterProps = {
 
 > :pushpin: Note that [WebChat hooks](https://github.com/microsoft/BotFramework-WebChat/blob/main/docs/HOOKS.md) can also be used in any custom components.
 
-## Common Scenarios
-
-### Disable Bot Magic Code
-
-Configuration to disable the default behaviour of having to type the magic code in the conversation to complete the sign-in proccess with a bot. Instead, the magic code will be sent to the bot behind the scenes.
-
-1. Add [MagicCodeForwarder.html](sample/MagicCodeForwarder.html) in the same location as the chat widget
-
-2. Add `botMagicCode` configuration to disable default magic code feature
-
-> :exclamation: `fwdUrl` **MUST** have the same `origin` as the chat widget URL
-
-```js
-const liveChatWidgetProps = {
-    chatSDK: chatSDK, // mandatory
-    chatConfig: chatConfig, // mandatory
-    webChatContainerProps: {
-        botMagicCode: {
-            disabled: true, 
-            fwdUrl: 'http://localhost:8000/sample/MagicCodeForwarder.html'
-        }
-    },    
-};
-
-ReactDOM.render(
-    <LiveChatWidget {...liveChatWidgetProps}/>,
-    document.getElementById("my-container")
-);
-```
-
 ## See Also
 
 [Telemetry](https://github.com/microsoft/omnichannel-chat-widget/blob/main/docs/Telemetry.md)\
 [Create LCW widget with Webpack5 and TypeScript](https://github.com/microsoft/omnichannel-chat-widget/blob/main/docs/BuildingUsingWebpack5.md)\
 [Omnichannel Features](https://github.com/microsoft/omnichannel-chat-widget/blob/main/docs/Features.md)\
 [How to Add Visual Regression Tests](https://github.com/microsoft/omnichannel-chat-widget/blob/main/docs/VisualRegressionTestingGuide.md)\
-[Security](https://github.com/microsoft/omnichannel-chat-widget/blob/main/SECURITY.md)
+[Security](https://github.com/microsoft/omnichannel-chat-widget/blob/main/SECURITY.md)\
+[Third Party Cookie Support](https://github.com/microsoft/omnichannel-chat-widget/blob/main/docs/Tpc.md)\
+[Storybook](https://microsoft.github.io/omnichannel-chat-widget/docs/storybook/)

package/lib/cjs/common/telemetry/TelemetryConstants.js

@@ -56,6 +56,10 @@ exports.BroadcastEvent = BroadcastEvent;
   BroadcastEvent["RaiseErrorEvent"] = "RaiseErrorEvent";
   BroadcastEvent["NetworkDisconnected"] = "NetworkDisconnected";
   BroadcastEvent["NetworkReconnected"] = "NetworkReconnected";
+  BroadcastEvent["SigninCardReceived"] = "SignInCardReceived";
+  BroadcastEvent["BotAuthConfigRequest"] = "BotAuthConfigRequest";
+  BroadcastEvent["BotAuthConfigResponse"] = "BotAuthConfigResponse";
+  BroadcastEvent["HideChatVisibilityChangeEvent"] = "hideChatVisibilityChangeEvent";
 })(BroadcastEvent || (exports.BroadcastEvent = BroadcastEvent = {}));
 let TelemetryEvent;
 exports.TelemetryEvent = TelemetryEvent;
@@ -97,6 +101,7 @@ exports.TelemetryEvent = TelemetryEvent;
   TelemetryEvent["ParseAdaptiveCardFailed"] = "ParseAdaptiveCardFailed";
   TelemetryEvent["ClientDataStoreProviderFailed"] = "ClientDataStoreProviderFailed";
   TelemetryEvent["InMemoryDataStoreFailed"] = "InMemoryDataStoreFailed";
+  TelemetryEvent["ChatVisibilityChanged"] = "ChatVisibilityChanged";
   TelemetryEvent["WebChatLoaded"] = "WebChatLoaded";
   TelemetryEvent["LCWChatButtonClicked"] = "LCWChatButtonClicked";
   TelemetryEvent["LCWChatButtonShow"] = "LCWChatButtonShow";
@@ -147,6 +152,11 @@ exports.TelemetryEvent = TelemetryEvent;
   TelemetryEvent["CustomerVoiceResponsePageLoaded"] = "CustomerVoiceResponsePageLoaded";
   TelemetryEvent["CustomerVoiceFormResponseSubmitted"] = "CustomerVoiceFormResponseSubmitted";
   TelemetryEvent["CustomerVoiceFormResponseError"] = "CustomerVoiceFormResponseError";
+  TelemetryEvent["BotAuthActivityEmptySasUrl"] = "BotAuthActivityEmptySasUrl";
+  TelemetryEvent["SetBotAuthProviderFetchConfig"] = "SetBotAuthProviderFetchConfig";
+  TelemetryEvent["SetBotAuthProviderHideCard"] = "SetBotAuthProviderHideCard";
+  TelemetryEvent["SetBotAuthProviderDisplayCard"] = "SetBotAuthProviderDisplayCard";
+  TelemetryEvent["SetBotAuthProviderNotFound"] = "SetBotAuthProviderNotFound";
   TelemetryEvent["ProcessingHTMLTextMiddlewareFailed"] = "ProcessingHTMLTextMiddlewareFailed";
   TelemetryEvent["ProcessingSanitizationMiddlewareFailed"] = "ProcessingSanitizationMiddlewareFailed";
   TelemetryEvent["FormatTagsMiddlewareJSONStringifyFailed"] = "FormatTagsMiddlewareJSONStringifyFailed";

package/lib/cjs/common/utils.js

@@ -3,12 +3,13 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.setTabIndices = exports.setFocusOnSendBox = exports.setFocusOnElement = exports.preventFocusToMoveOutOfElement = exports.parseAdaptiveCardPayload = exports.newGuid = exports.isUndefinedOrEmpty = exports.isNullOrUndefined = exports.isNullOrEmptyString = exports.getWidgetEndChatEventName = exports.getWidgetCacheId = exports.getTimestampHourMinute = exports.getStateFromCache = exports.getLocaleDirection = exports.getIconText = exports.getDomain = exports.getBroadcastChannelName = exports.findParentFocusableElementsWithoutChildContainer = exports.findAllFocusableElement = exports.extractPreChatSurveyResponseValues = exports.escapeHtml = exports.createTimer = exports.changeLanguageCodeFormatForWebChat = exports.addDelayInMs = void 0;
+exports.setTabIndices = exports.setFocusOnSendBox = exports.setFocusOnElement = exports.preventFocusToMoveOutOfElement = exports.parseAdaptiveCardPayload = exports.newGuid = exports.isUndefinedOrEmpty = exports.isNullOrUndefined = exports.isNullOrEmptyString = exports.getWidgetEndChatEventName = exports.getWidgetCacheId = exports.getTimestampHourMinute = exports.getStateFromCache = exports.getLocaleDirection = exports.getIconText = exports.getDomain = exports.getBroadcastChannelName = exports.findParentFocusableElementsWithoutChildContainer = exports.findAllFocusableElement = exports.extractPreChatSurveyResponseValues = exports.escapeHtml = exports.debounceLeading = exports.createTimer = exports.changeLanguageCodeFormatForWebChat = exports.addDelayInMs = void 0;
 var _Constants = require("./Constants");
 var _DataStoreManager = require("./contextDataStore/DataStoreManager");
 var _KeyCodes = require("./KeyCodes");
 var _TelemetryConstants = require("./telemetry/TelemetryConstants");
 var _md5Typescript = require("md5-typescript");
+var _this = void 0;
 const getElementBySelector = selector => {
   let element;
   if (typeof selector === "string") {
@@ -334,4 +335,24 @@ exports.addDelayInMs = addDelayInMs;
 const getBroadcastChannelName = (widgetId, widgetInstanceId) => {
   return widgetInstanceId && !isNullOrEmptyString(widgetInstanceId) ? `${widgetInstanceId}_${widgetId}` : widgetId;
 };
-exports.getBroadcastChannelName = getBroadcastChannelName;
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+exports.getBroadcastChannelName = getBroadcastChannelName;
+const debounceLeading = function (fn) {
+  let ms = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 3000;
+  let timeoutId;
+  return function () {
+    // eslint-disable-line @typescript-eslint/no-explicit-any
+
+    if (!timeoutId) {
+      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+        args[_key] = arguments[_key];
+      }
+      fn.apply(_this, args);
+    }
+    timeoutId = setTimeout(() => {
+      timeoutId = null;
+    }, ms);
+  };
+};
+exports.debounceLeading = debounceLeading;

package/lib/cjs/components/headerstateful/HeaderStateful.js

@@ -72,7 +72,7 @@ const HeaderStateful = props => {
     ...(headerProps === null || headerProps === void 0 ? void 0 : headerProps.controlProps),
     hideTitle: state.appStates.conversationState === _ConversationState.ConversationState.Loading && !state.appStates.isStartChatFailing || state.appStates.conversationState === _ConversationState.ConversationState.PostchatLoading || (headerProps === null || headerProps === void 0 ? void 0 : (_headerProps$controlP = headerProps.controlProps) === null || _headerProps$controlP === void 0 ? void 0 : _headerProps$controlP.hideTitle),
     hideIcon: state.appStates.conversationState === _ConversationState.ConversationState.Loading && !state.appStates.isStartChatFailing || state.appStates.conversationState === _ConversationState.ConversationState.PostchatLoading || (headerProps === null || headerProps === void 0 ? void 0 : (_headerProps$controlP2 = headerProps.controlProps) === null || _headerProps$controlP2 === void 0 ? void 0 : _headerProps$controlP2.hideIcon),
-    hideCloseButton: state.appStates.conversationState === _ConversationState.ConversationState.Loading && !state.appStates.isStartChatFailing || state.appStates.conversationState === _ConversationState.ConversationState.Prechat || state.appStates.conversationState === _ConversationState.ConversationState.ReconnectChat || (headerProps === null || headerProps === void 0 ? void 0 : (_headerProps$controlP3 = headerProps.controlProps) === null || _headerProps$controlP3 === void 0 ? void 0 : _headerProps$controlP3.hideCloseButton)
+    hideCloseButton: state.appStates.conversationState === _ConversationState.ConversationState.Loading && !state.appStates.isStartChatFailing || state.appStates.conversationState === _ConversationState.ConversationState.PostchatLoading || state.appStates.conversationState === _ConversationState.ConversationState.Prechat || state.appStates.conversationState === _ConversationState.ConversationState.ReconnectChat || (headerProps === null || headerProps === void 0 ? void 0 : (_headerProps$controlP3 = headerProps.controlProps) === null || _headerProps$controlP3 === void 0 ? void 0 : _headerProps$controlP3.hideCloseButton)
   };
   const outOfOfficeControlProps = {
     id: "oc-lcw-header",

package/lib/cjs/components/livechatwidget/common/ActivitySubscriber/BotAuthActivitySubscriber.js

@@ -0,0 +1,139 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.BotAuthActivitySubscriber = void 0;
+var _omnichannelChatComponents = require("@microsoft/omnichannel-chat-components");
+var _TelemetryConstants = require("../../../../common/telemetry/TelemetryConstants");
+var _TelemetryHelper = require("../../../../common/telemetry/TelemetryHelper");
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+const supportedSignInCardContentTypes = ["application/vnd.microsoft.card.signin", "application/vnd.microsoft.card.oauth"];
+const botOauthUrlRegex = /[\S]+.botframework.com\/api\/oauth\/signin\?signin=([\S]+)/;
+const delay = t => new Promise(resolve => setTimeout(resolve, t));
+const fetchBotAuthConfigRetries = 3;
+const fetchBotAuthConfigRetryInterval = 1000;
+let response;
+const extractSignInId = signInUrl => {
+  const result = botOauthUrlRegex.exec(signInUrl);
+  if (result && result[1]) {
+    return result[1];
+  }
+  return "";
+};
+const extractSasUrl = async attachment => {
+  let sasUrl = undefined;
+  if (attachment && attachment.content && attachment.content.tokenPostResource && attachment.content.tokenPostResource.sasUrl) {
+    sasUrl = attachment.content.tokenPostResource.sasUrl;
+  }
+  if (!sasUrl) {
+    const signInId = extractSignInId(attachment.content.buttons[0].value);
+    const getTestUrlEndpoint = `https://token.botframework.com/api/sas/gettesturl?signInId=${signInId}`;
+    try {
+      const response = await window.fetch(getTestUrlEndpoint);
+      if (response.status === 200) {
+        const responseJson = await response.json();
+        sasUrl = responseJson.sasUrl;
+      }
+    } catch {
+      sasUrl = undefined;
+    }
+  }
+  return sasUrl;
+};
+const fetchBotAuthConfig = async retries => {
+  _TelemetryHelper.TelemetryHelper.logLoadingEvent(_TelemetryConstants.LogLevel.INFO, {
+    Event: _TelemetryConstants.TelemetryEvent.SetBotAuthProviderFetchConfig
+  });
+  const botAuthConfigRequestEvent = {
+    eventName: _TelemetryConstants.BroadcastEvent.BotAuthConfigRequest
+  };
+  _omnichannelChatComponents.BroadcastService.postMessage(botAuthConfigRequestEvent);
+  const listener = _omnichannelChatComponents.BroadcastService.getMessageByEventName(_TelemetryConstants.BroadcastEvent.BotAuthConfigResponse).subscribe(data => {
+    var _data$payload, _data$payload2;
+    response = ((_data$payload = data.payload) === null || _data$payload === void 0 ? void 0 : _data$payload.response) !== undefined ? (_data$payload2 = data.payload) === null || _data$payload2 === void 0 ? void 0 : _data$payload2.response : response;
+    listener.unsubscribe();
+  });
+  if (response !== undefined) {
+    //return response;
+    return response;
+  }
+  if (retries === 1) {
+    // Base Case
+    throw new Error();
+  }
+  await delay(fetchBotAuthConfigRetryInterval);
+  return await fetchBotAuthConfig(--retries);
+};
+class BotAuthActivitySubscriber {
+  constructor() {
+    _defineProperty(this, "observer", void 0);
+    _defineProperty(this, "signInCardSeen", void 0);
+    this.signInCardSeen = new Set();
+  }
+  applicable(activity) {
+    var _activity$attachments;
+    return (activity === null || activity === void 0 ? void 0 : (_activity$attachments = activity.attachments) === null || _activity$attachments === void 0 ? void 0 : _activity$attachments.length) > 0 && activity.attachments[0] && supportedSignInCardContentTypes.indexOf(activity.attachments[0].contentType) >= 0;
+  }
+  async apply(activity) {
+    this.observer.next(false); // Hides card
+    const attachment = activity.attachments[0];
+    const signInUrl = attachment.content.buttons[0].value;
+    const signInId = extractSignInId(signInUrl);
+    if (!signInId) {
+      return;
+    }
+    if (this.signInCardSeen.has(signInId)) {
+      // Prevents duplicate auth
+      return;
+    }
+    this.signInCardSeen.add(signInId);
+    const sasUrl = await extractSasUrl(attachment);
+    const event = {
+      eventName: _TelemetryConstants.BroadcastEvent.SigninCardReceived,
+      payload: {
+        sasUrl
+      }
+    };
+    if (!sasUrl) {
+      _TelemetryHelper.TelemetryHelper.logLoadingEvent(_TelemetryConstants.LogLevel.INFO, {
+        Event: _TelemetryConstants.TelemetryEvent.BotAuthActivityEmptySasUrl,
+        Description: "SaS Url is empty"
+      });
+      return activity;
+    } else {
+      _omnichannelChatComponents.BroadcastService.postMessage(event);
+    }
+    try {
+      const response = await fetchBotAuthConfig(fetchBotAuthConfigRetries);
+      if (response === false) {
+        _TelemetryHelper.TelemetryHelper.logLoadingEvent(_TelemetryConstants.LogLevel.INFO, {
+          Event: _TelemetryConstants.TelemetryEvent.SetBotAuthProviderHideCard
+        });
+      } else {
+        _TelemetryHelper.TelemetryHelper.logLoadingEvent(_TelemetryConstants.LogLevel.INFO, {
+          Event: _TelemetryConstants.TelemetryEvent.SetBotAuthProviderDisplayCard
+        });
+        return activity;
+      }
+    } catch {
+      _TelemetryHelper.TelemetryHelper.logLoadingEvent(_TelemetryConstants.LogLevel.INFO, {
+        Event: _TelemetryConstants.TelemetryEvent.SetBotAuthProviderNotFound
+      });
+      //this is to ensure listener continues waiting for response
+      if (this.signInCardSeen.has(signInId)) {
+        this.signInCardSeen.delete(signInId);
+      }
+      return activity;
+    }
+  }
+  async next(activity) {
+    if (this.applicable(activity)) {
+      return await this.apply(activity);
+    }
+    return activity;
+  }
+}
+exports.BotAuthActivitySubscriber = BotAuthActivitySubscriber;

package/lib/cjs/components/livechatwidget/common/createAdapter.js

@@ -10,6 +10,7 @@ var _NotificationScenarios = require("../../webchatcontainerstateful/webchatcont
 var _defaultMiddlewareLocalizedTexts = require("../../webchatcontainerstateful/common/defaultProps/defaultMiddlewareLocalizedTexts");
 var _ChatAdapterShim = require("./ChatAdapterShim");
 var _PauseActivitySubscriber = require("./ActivitySubscriber/PauseActivitySubscriber");
+var _BotAuthActivitySubscriber = require("./ActivitySubscriber/BotAuthActivitySubscriber");
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 const createAdapter = async chatSDK => {
   const chatAdapterOptionalParams = {
@@ -34,6 +35,7 @@ const createAdapter = async chatSDK => {
   if (chatSDK.isMockModeOn !== true) {
     adapter = new _ChatAdapterShim.ChatAdapterShim(adapter);
     adapter.addSubscriber(new _PauseActivitySubscriber.PauseActivitySubscriber());
+    adapter.addSubscriber(new _BotAuthActivitySubscriber.BotAuthActivitySubscriber());
     return adapter.chatAdapter;
   }
   return adapter;

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

@@ -17,9 +17,9 @@ var _utils = require("../../../common/utils");
 var _authHelper = require("./authHelper");
 // 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, _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;
+  var _props$chatConfig, _props$chatConfig$Liv, _state$domainStates$l, _state$domainStates$l2, _props$chatConfig2, _props$chatConfig2$Li, _state$domainStates$l3, _state$domainStates$l4, _conversationDetails;
+  const isPostChatEnabled = ((_props$chatConfig = props.chatConfig) === null || _props$chatConfig === void 0 ? void 0 : (_props$chatConfig$Liv = _props$chatConfig.LiveWSAndLiveChatEngJoin) === null || _props$chatConfig$Liv === void 0 ? void 0 : _props$chatConfig$Liv.msdyn_postconversationsurveyenable) ?? ((_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 = ((_props$chatConfig2 = props.chatConfig) === null || _props$chatConfig2 === void 0 ? void 0 : (_props$chatConfig2$Li = _props$chatConfig2.LiveWSAndLiveChatEngJoin) === null || _props$chatConfig2$Li === void 0 ? void 0 : _props$chatConfig2$Li.msdyn_postconversationsurveymode) ?? ((_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);
 
   //Unable to end chat if token has expired
   if (props.getAuthToken) {
@@ -61,15 +61,20 @@ const prepareEndChat = async (props, chatSDK, setAdapter, setWebChatStyles, disp
       chatSDK.requestId = chatSession.requestId;
     }
     if (postChatSurveyMode === _PostChatSurveyMode.PostChatSurveyMode.Embed) {
-      dispatch({
-        type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE,
-        payload: _ConversationState.ConversationState.PostchatLoading
-      });
-      await (0, _utils.addDelayInMs)(_Constants.Constants.PostChatLoadingDurationInMs);
-      const loadPostChatEvent = {
-        eventName: _TelemetryConstants.BroadcastEvent.LoadPostChatSurvey
-      };
-      _omnichannelChatComponents.BroadcastService.postMessage(loadPostChatEvent);
+      // Only start embedded Postchat workflow if postchat context is set successfully else close chat
+      if (state.domainStates.postChatContext) {
+        dispatch({
+          type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE,
+          payload: _ConversationState.ConversationState.PostchatLoading
+        });
+        await (0, _utils.addDelayInMs)(_Constants.Constants.PostChatLoadingDurationInMs);
+        const loadPostChatEvent = {
+          eventName: _TelemetryConstants.BroadcastEvent.LoadPostChatSurvey
+        };
+        _omnichannelChatComponents.BroadcastService.postMessage(loadPostChatEvent);
+      } else {
+        await endChat(props, chatSDK, setAdapter, setWebChatStyles, dispatch, adapter, true, false, true);
+      }
     } else if (postChatSurveyMode === _PostChatSurveyMode.PostChatSurveyMode.Link) {
       var _props$webChatContain, _props$webChatContain2;
       dispatch({

package/lib/cjs/components/livechatwidget/common/initWebChatComposer.js

@@ -39,7 +39,7 @@ var _Constants = require("../../../common/Constants");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 const initWebChatComposer = (props, chatSDK, state, dispatch, setWebChatStyles) => {
-  var _props$webChatContain, _props$webChatContain2, _props$webChatContain3, _state$domainStates$l, _state$domainStates$l2, _state$domainStates$l3, _state$domainStates$l4, _state$domainStates$l8, _state$domainStates$l9, _props$webChatContain7, _props$webChatContain8, _state$domainStates$r, _state$domainStates$r2, _props$webChatContain9, _props$webChatContain10, _state$domainStates$r3, _state$domainStates$r4, _props$webChatContain11, _props$webChatContain12, _defaultWebChatContai, _props$webChatContain13, _props$webChatContain14, _props$webChatContain15, _props$webChatContain16, _state$domainStates$r5, _state$domainStates$r6, _props$webChatContain17, _props$webChatContain18, _defaultWebChatContai2, _props$webChatContain19, _props$webChatContain20, _defaultWebChatContai3, _props$webChatContain21, _props$webChatContain22;
+  var _props$webChatContain, _props$webChatContain2, _props$webChatContain3, _props$chatConfig, _props$chatConfig$Liv, _state$domainStates$l, _state$domainStates$l2, _props$chatConfig2, _props$chatConfig2$Li, _state$domainStates$l3, _state$domainStates$l4, _state$domainStates$l8, _state$domainStates$l9, _props$webChatContain7, _props$webChatContain8, _state$domainStates$r, _state$domainStates$r2, _props$webChatContain9, _props$webChatContain10, _state$domainStates$r3, _state$domainStates$r4, _props$webChatContain11, _props$webChatContain12, _defaultWebChatContai, _props$webChatContain13, _props$webChatContain14, _props$webChatContain15, _props$webChatContain16, _state$domainStates$r5, _state$domainStates$r6, _props$webChatContain17, _props$webChatContain18, _defaultWebChatContai2, _props$webChatContain19, _props$webChatContain20, _defaultWebChatContai3, _props$webChatContain21, _props$webChatContain22;
   const localizedTexts = {
     ..._defaultMiddlewareLocalizedTexts.defaultMiddlewareLocalizedTexts,
     ...((_props$webChatContain = props.webChatContainerProps) === null || _props$webChatContain === void 0 ? void 0 : _props$webChatContain.localizedTexts)
@@ -47,8 +47,8 @@ const initWebChatComposer = (props, chatSDK, state, dispatch, setWebChatStyles)
   const disableNewLineMarkdownSupport = ((_props$webChatContain2 = props.webChatContainerProps) === null || _props$webChatContain2 === void 0 ? void 0 : _props$webChatContain2.disableNewLineMarkdownSupport) ?? _defaultWebChatContainerStatefulProps.defaultWebChatContainerStatefulProps.disableNewLineMarkdownSupport;
   // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
   const markdown = (0, _createMarkdown.createMarkdown)(((_props$webChatContain3 = props.webChatContainerProps) === null || _props$webChatContain3 === void 0 ? void 0 : _props$webChatContain3.disableMarkdownMessageFormatting) ?? _defaultWebChatContainerStatefulProps.defaultWebChatContainerStatefulProps.disableMarkdownMessageFormatting, disableNewLineMarkdownSupport);
-  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 isPostChatEnabled = ((_props$chatConfig = props.chatConfig) === null || _props$chatConfig === void 0 ? void 0 : (_props$chatConfig$Liv = _props$chatConfig.LiveWSAndLiveChatEngJoin) === null || _props$chatConfig$Liv === void 0 ? void 0 : _props$chatConfig$Liv.msdyn_postconversationsurveyenable) ?? ((_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 = ((_props$chatConfig2 = props.chatConfig) === null || _props$chatConfig2 === void 0 ? void 0 : (_props$chatConfig2$Li = _props$chatConfig2.LiveWSAndLiveChatEngJoin) === null || _props$chatConfig2$Li === void 0 ? void 0 : _props$chatConfig2$Li.msdyn_postconversationsurveymode) ?? ((_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);
 
   // Initialize Web Chat's redux store
   let webChatStore = _WebChatStoreLoader.WebChatStoreLoader.store;
@@ -70,16 +70,28 @@ const initWebChatComposer = (props, chatSDK, state, dispatch, setWebChatStyles)
       }
       if (isPostChatEnabled === "true") {
         if (postChatSurveyMode === _PostChatSurveyMode.PostChatSurveyMode.Embed) {
-          _WebChatStoreLoader.WebChatStoreLoader.store = null;
-          dispatch({
-            type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE,
-            payload: _ConversationState.ConversationState.PostchatLoading
-          });
-          await (0, _utils.addDelayInMs)(_Constants.Constants.PostChatLoadingDurationInMs);
-          const loadPostChatEvent = {
-            eventName: _TelemetryConstants.BroadcastEvent.LoadPostChatSurvey
-          };
-          _omnichannelChatComponents.BroadcastService.postMessage(loadPostChatEvent);
+          // Only start embedded Postchat workflow if postchat context is set successfully else close chat
+          if (state.domainStates.postChatContext) {
+            _WebChatStoreLoader.WebChatStoreLoader.store = null;
+            dispatch({
+              type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE,
+              payload: _ConversationState.ConversationState.PostchatLoading
+            });
+            await (0, _utils.addDelayInMs)(_Constants.Constants.PostChatLoadingDurationInMs);
+            const loadPostChatEvent = {
+              eventName: _TelemetryConstants.BroadcastEvent.LoadPostChatSurvey
+            };
+            _omnichannelChatComponents.BroadcastService.postMessage(loadPostChatEvent);
+          } else {
+            dispatch({
+              type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE,
+              payload: _ConversationState.ConversationState.InActive
+            });
+            dispatch({
+              type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_ENDED_BY_AGENT,
+              payload: true
+            });
+          }
         } else if (postChatSurveyMode === _PostChatSurveyMode.PostChatSurveyMode.Link) {
           dispatch({
             type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE,
@@ -128,6 +140,7 @@ const initWebChatComposer = (props, chatSDK, state, dispatch, setWebChatStyles)
     typingIndicatorMiddleware: (_props$webChatContain19 = props.webChatContainerProps) !== null && _props$webChatContain19 !== void 0 && (_props$webChatContain20 = _props$webChatContain19.renderingMiddlewareProps) !== null && _props$webChatContain20 !== void 0 && _props$webChatContain20.disableTypingIndicatorMiddleware ? undefined : (_defaultWebChatContai3 = _defaultWebChatContainerStatefulProps.defaultWebChatContainerStatefulProps.webChatProps) === null || _defaultWebChatContai3 === void 0 ? void 0 : _defaultWebChatContai3.typingIndicatorMiddleware,
     onTelemetry: (0, _WebChatLogger.createWebChatTelemetry)(),
     cardActionMiddleware: (0, _cardActionMiddleware.createCardActionMiddleware)(((_props$webChatContain21 = props.webChatContainerProps) === null || _props$webChatContain21 === void 0 ? void 0 : _props$webChatContain21.botMagicCode) || undefined),
+    sendTypingIndicator: true,
     ...((_props$webChatContain22 = props.webChatContainerProps) === null || _props$webChatContain22 === void 0 ? void 0 : _props$webChatContain22.webChatProps)
   };
   return webChatProps;

package/lib/cjs/components/livechatwidget/livechatwidgetstateful/LiveChatWidgetStateful.js

@@ -55,7 +55,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 const LiveChatWidgetStateful = props => {
-  var _props$webChatContain, _props$styleProps, _chatSDK$omnichannelC, _props$controlProps, _props$controlProps2, _props$webChatContain3, _props$webChatContain4, _props$styleProps2, _props$controlProps14, _props$controlProps15, _props$componentOverr, _props$controlProps16, _props$componentOverr2, _props$controlProps17, _props$componentOverr3, _props$controlProps18, _props$componentOverr4, _props$controlProps19, _props$componentOverr5, _props$controlProps20, _props$componentOverr6, _props$controlProps21, _props$componentOverr7, _props$controlProps22, _props$controlProps23, _props$componentOverr8, _props$controlProps24, _props$componentOverr9, _props$controlProps25, _props$componentOverr10, _props$componentOverr11, _props$componentOverr12;
+  var _props$webChatContain, _props$styleProps, _chatSDK$omnichannelC, _props$controlProps, _props$controlProps2, _props$webChatContain3, _props$webChatContain4, _props$styleProps2, _props$controlProps15, _props$controlProps16, _props$componentOverr, _props$controlProps17, _props$componentOverr2, _props$controlProps18, _props$componentOverr3, _props$controlProps19, _props$componentOverr4, _props$controlProps20, _props$componentOverr5, _props$controlProps21, _props$componentOverr6, _props$controlProps22, _props$componentOverr7, _props$controlProps23, _props$controlProps24, _props$componentOverr8, _props$controlProps25, _props$componentOverr9, _props$controlProps26, _props$componentOverr10, _props$componentOverr11, _props$componentOverr12;
   const [state, dispatch] = (0, _useChatContextStore.default)();
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const [adapter, setAdapter] = (0, _useChatAdapterStore.default)();
@@ -214,7 +214,7 @@ const LiveChatWidgetStateful = props => {
 
   // useEffect for custom context
   (0, _react2.useEffect)(() => {
-    var _chatSDK$omnichannelC8, _chatSDK$omnichannelC9, _props$controlProps12;
+    var _chatSDK$omnichannelC8, _chatSDK$omnichannelC9, _props$controlProps13;
     // Add the custom context on receiving the SetCustomContext event
     _omnichannelChatComponents.BroadcastService.getMessageByEventName(_TelemetryConstants.BroadcastEvent.SetCustomContext).subscribe(msg => {
       _TelemetryHelper.TelemetryHelper.logActionEvent(_TelemetryConstants.LogLevel.INFO, {
@@ -242,14 +242,33 @@ const LiveChatWidgetStateful = props => {
       }
     });
 
+    // Toggle chat visibility
+    _omnichannelChatComponents.BroadcastService.getMessageByEventName(_TelemetryConstants.BroadcastEvent.HideChatVisibilityChangeEvent).subscribe(event => {
+      var _event$payload;
+      if ((event === null || event === void 0 ? void 0 : (_event$payload = event.payload) === null || _event$payload === void 0 ? void 0 : _event$payload.isChatHidden) !== undefined) {
+        var _event$payload2, _props$controlProps10;
+        _TelemetryHelper.TelemetryHelper.logActionEvent(_TelemetryConstants.LogLevel.INFO, {
+          Event: _TelemetryConstants.TelemetryEvent.ChatVisibilityChanged,
+          Description: "Chat visibility changed to " + (event === null || event === void 0 ? void 0 : (_event$payload2 = event.payload) === null || _event$payload2 === void 0 ? void 0 : _event$payload2.isChatHidden)
+        });
+        if ((_props$controlProps10 = props.controlProps) !== null && _props$controlProps10 !== void 0 && _props$controlProps10.hideStartChatButton) {
+          var _event$payload3;
+          dispatch({
+            type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_MINIMIZED,
+            payload: event === null || event === void 0 ? void 0 : (_event$payload3 = event.payload) === null || _event$payload3 === void 0 ? void 0 : _event$payload3.isChatHidden
+          });
+        }
+      }
+    });
+
     // Start chat from SDK Event
     _omnichannelChatComponents.BroadcastService.getMessageByEventName(_TelemetryConstants.BroadcastEvent.StartChat).subscribe(() => {
-      var _chatSDK$omnichannelC4, _chatSDK$omnichannelC5, _props$controlProps10;
+      var _chatSDK$omnichannelC4, _chatSDK$omnichannelC5, _props$controlProps11;
       _TelemetryHelper.TelemetryHelper.logActionEvent(_TelemetryConstants.LogLevel.INFO, {
         Event: _TelemetryConstants.TelemetryEvent.StartChatEventRecevied,
         Description: "Start chat event received."
       });
-      const persistedState = (0, _utils.getStateFromCache)(chatSDK === null || chatSDK === void 0 ? void 0 : (_chatSDK$omnichannelC4 = chatSDK.omnichannelConfig) === null || _chatSDK$omnichannelC4 === void 0 ? void 0 : _chatSDK$omnichannelC4.orgId, chatSDK === null || chatSDK === void 0 ? void 0 : (_chatSDK$omnichannelC5 = chatSDK.omnichannelConfig) === null || _chatSDK$omnichannelC5 === void 0 ? void 0 : _chatSDK$omnichannelC5.widgetId, (props === null || props === void 0 ? void 0 : (_props$controlProps10 = props.controlProps) === null || _props$controlProps10 === void 0 ? void 0 : _props$controlProps10.widgetInstanceId) ?? "");
+      const persistedState = (0, _utils.getStateFromCache)(chatSDK === null || chatSDK === void 0 ? void 0 : (_chatSDK$omnichannelC4 = chatSDK.omnichannelConfig) === null || _chatSDK$omnichannelC4 === void 0 ? void 0 : _chatSDK$omnichannelC4.orgId, chatSDK === null || chatSDK === void 0 ? void 0 : (_chatSDK$omnichannelC5 = chatSDK.omnichannelConfig) === null || _chatSDK$omnichannelC5 === void 0 ? void 0 : _chatSDK$omnichannelC5.widgetId, (props === null || props === void 0 ? void 0 : (_props$controlProps11 = props.controlProps) === null || _props$controlProps11 === void 0 ? void 0 : _props$controlProps11.widgetInstanceId) ?? "");
 
       // Chat not found in cache
       if (persistedState === undefined) {
@@ -290,9 +309,9 @@ const LiveChatWidgetStateful = props => {
     // End chat
     _omnichannelChatComponents.BroadcastService.getMessageByEventName(_TelemetryConstants.BroadcastEvent.InitiateEndChat).subscribe(async () => {
       if (state.appStates.hideStartChatButton === false) {
-        var _chatSDK$omnichannelC6, _chatSDK$omnichannelC7, _props$controlProps11;
+        var _chatSDK$omnichannelC6, _chatSDK$omnichannelC7, _props$controlProps12;
         // This is to ensure to get latest state from cache in multitab
-        const persistedState = (0, _utils.getStateFromCache)(chatSDK === null || chatSDK === void 0 ? void 0 : (_chatSDK$omnichannelC6 = chatSDK.omnichannelConfig) === null || _chatSDK$omnichannelC6 === void 0 ? void 0 : _chatSDK$omnichannelC6.orgId, chatSDK === null || chatSDK === void 0 ? void 0 : (_chatSDK$omnichannelC7 = chatSDK.omnichannelConfig) === null || _chatSDK$omnichannelC7 === void 0 ? void 0 : _chatSDK$omnichannelC7.widgetId, (props === null || props === void 0 ? void 0 : (_props$controlProps11 = props.controlProps) === null || _props$controlProps11 === void 0 ? void 0 : _props$controlProps11.widgetInstanceId) ?? "");
+        const persistedState = (0, _utils.getStateFromCache)(chatSDK === null || chatSDK === void 0 ? void 0 : (_chatSDK$omnichannelC6 = chatSDK.omnichannelConfig) === null || _chatSDK$omnichannelC6 === void 0 ? void 0 : _chatSDK$omnichannelC6.orgId, chatSDK === null || chatSDK === void 0 ? void 0 : (_chatSDK$omnichannelC7 = chatSDK.omnichannelConfig) === null || _chatSDK$omnichannelC7 === void 0 ? void 0 : _chatSDK$omnichannelC7.widgetId, (props === null || props === void 0 ? void 0 : (_props$controlProps12 = props.controlProps) === null || _props$controlProps12 === void 0 ? void 0 : _props$controlProps12.widgetInstanceId) ?? "");
         if (persistedState && persistedState.appStates.conversationState === _ConversationState.ConversationState.Active) {
           (0, _endChat.prepareEndChat)(props, chatSDK, setAdapter, setWebChatStyles, dispatch, adapter, state);
         } else {
@@ -312,7 +331,7 @@ const LiveChatWidgetStateful = props => {
     });
 
     // Listen to end chat event from other tabs
-    const endChatEventName = (0, _utils.getWidgetEndChatEventName)(chatSDK === null || chatSDK === void 0 ? void 0 : (_chatSDK$omnichannelC8 = chatSDK.omnichannelConfig) === null || _chatSDK$omnichannelC8 === void 0 ? void 0 : _chatSDK$omnichannelC8.orgId, chatSDK === null || chatSDK === void 0 ? void 0 : (_chatSDK$omnichannelC9 = chatSDK.omnichannelConfig) === null || _chatSDK$omnichannelC9 === void 0 ? void 0 : _chatSDK$omnichannelC9.widgetId, ((_props$controlProps12 = props.controlProps) === null || _props$controlProps12 === void 0 ? void 0 : _props$controlProps12.widgetInstanceId) ?? "");
+    const endChatEventName = (0, _utils.getWidgetEndChatEventName)(chatSDK === null || chatSDK === void 0 ? void 0 : (_chatSDK$omnichannelC8 = chatSDK.omnichannelConfig) === null || _chatSDK$omnichannelC8 === void 0 ? void 0 : _chatSDK$omnichannelC8.orgId, chatSDK === null || chatSDK === void 0 ? void 0 : (_chatSDK$omnichannelC9 = chatSDK.omnichannelConfig) === null || _chatSDK$omnichannelC9 === void 0 ? void 0 : _chatSDK$omnichannelC9.widgetId, ((_props$controlProps13 = props.controlProps) === null || _props$controlProps13 === void 0 ? void 0 : _props$controlProps13.widgetInstanceId) ?? "");
     _omnichannelChatComponents.BroadcastService.getMessageByEventName(endChatEventName).subscribe(async () => {
       (0, _endChat.endChat)(props, chatSDK, setAdapter, setWebChatStyles, dispatch, adapter, false, false, false);
       return;
@@ -417,7 +436,7 @@ const LiveChatWidgetStateful = props => {
 
   // Publish chat widget state
   (0, _react2.useEffect)(() => {
-    var _props$chatSDK, _props$chatSDK$omnich, _props$chatSDK2, _props$chatSDK2$omnic, _props$controlProps13;
+    var _props$chatSDK, _props$chatSDK$omnich, _props$chatSDK2, _props$chatSDK2$omnic, _props$controlProps14;
     // Only activate these windows events when conversation state is active and chat widget is in popout mode
     // Ghost chat scenarios
     /* COMMENTING THIS CODE FOR PARITY WITH OLD LCW
@@ -435,7 +454,7 @@ const LiveChatWidgetStateful = props => {
         };
     }*/
 
-    widgetStateEventName = (0, _utils.getWidgetCacheId)(props === null || props === void 0 ? void 0 : (_props$chatSDK = props.chatSDK) === null || _props$chatSDK === void 0 ? void 0 : (_props$chatSDK$omnich = _props$chatSDK.omnichannelConfig) === null || _props$chatSDK$omnich === void 0 ? void 0 : _props$chatSDK$omnich.orgId, props === null || props === void 0 ? void 0 : (_props$chatSDK2 = props.chatSDK) === null || _props$chatSDK2 === void 0 ? void 0 : (_props$chatSDK2$omnic = _props$chatSDK2.omnichannelConfig) === null || _props$chatSDK2$omnic === void 0 ? void 0 : _props$chatSDK2$omnic.widgetId, (props === null || props === void 0 ? void 0 : (_props$controlProps13 = props.controlProps) === null || _props$controlProps13 === void 0 ? void 0 : _props$controlProps13.widgetInstanceId) ?? "");
+    widgetStateEventName = (0, _utils.getWidgetCacheId)(props === null || props === void 0 ? void 0 : (_props$chatSDK = props.chatSDK) === null || _props$chatSDK === void 0 ? void 0 : (_props$chatSDK$omnich = _props$chatSDK.omnichannelConfig) === null || _props$chatSDK$omnich === void 0 ? void 0 : _props$chatSDK$omnich.orgId, props === null || props === void 0 ? void 0 : (_props$chatSDK2 = props.chatSDK) === null || _props$chatSDK2 === void 0 ? void 0 : (_props$chatSDK2$omnic = _props$chatSDK2.omnichannelConfig) === null || _props$chatSDK2$omnic === void 0 ? void 0 : _props$chatSDK2$omnic.widgetId, (props === null || props === void 0 ? void 0 : (_props$controlProps14 = props.controlProps) === null || _props$controlProps14 === void 0 ? void 0 : _props$controlProps14.widgetInstanceId) ?? "");
     const chatWidgetStateChangeEvent = {
       eventName: widgetStateEventName,
       payload: {
@@ -497,29 +516,29 @@ const LiveChatWidgetStateful = props => {
     id: widgetElementId,
     styles: generalStyles,
     className: (_props$styleProps2 = props.styleProps) === null || _props$styleProps2 === void 0 ? void 0 : _props$styleProps2.className
-  }, !((_props$controlProps14 = props.controlProps) !== null && _props$controlProps14 !== void 0 && _props$controlProps14.hideChatButton) && !((_props$controlProps15 = props.controlProps) !== null && _props$controlProps15 !== void 0 && _props$controlProps15.hideStartChatButton) && (0, _componentController.shouldShowChatButton)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_props$componentOverr = props.componentOverrides) === null || _props$componentOverr === void 0 ? void 0 : _props$componentOverr.chatButton) || /*#__PURE__*/_react2.default.createElement(_ChatButtonStateful.default, {
+  }, !((_props$controlProps15 = props.controlProps) !== null && _props$controlProps15 !== void 0 && _props$controlProps15.hideChatButton) && !((_props$controlProps16 = props.controlProps) !== null && _props$controlProps16 !== void 0 && _props$controlProps16.hideStartChatButton) && (0, _componentController.shouldShowChatButton)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_props$componentOverr = props.componentOverrides) === null || _props$componentOverr === void 0 ? void 0 : _props$componentOverr.chatButton) || /*#__PURE__*/_react2.default.createElement(_ChatButtonStateful.default, {
     buttonProps: props.chatButtonProps,
     outOfOfficeButtonProps: props.outOfOfficeChatButtonProps,
     startChat: prepareStartChatRelay
-  })), !((_props$controlProps16 = props.controlProps) !== null && _props$controlProps16 !== void 0 && _props$controlProps16.hideProactiveChatPane) && (0, _componentController.shouldShowProactiveChatPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_props$componentOverr2 = props.componentOverrides) === null || _props$componentOverr2 === void 0 ? void 0 : _props$componentOverr2.proactiveChatPane) || /*#__PURE__*/_react2.default.createElement(_ProactiveChatPaneStateful.default, {
+  })), !((_props$controlProps17 = props.controlProps) !== null && _props$controlProps17 !== void 0 && _props$controlProps17.hideProactiveChatPane) && (0, _componentController.shouldShowProactiveChatPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_props$componentOverr2 = props.componentOverrides) === null || _props$componentOverr2 === void 0 ? void 0 : _props$componentOverr2.proactiveChatPane) || /*#__PURE__*/_react2.default.createElement(_ProactiveChatPaneStateful.default, {
     proactiveChatProps: props.proactiveChatPaneProps,
     startChat: prepareStartChatRelay
-  })), !((_props$controlProps17 = props.controlProps) !== null && _props$controlProps17 !== void 0 && _props$controlProps17.hideHeader) && (0, _componentController.shouldShowHeader)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_props$componentOverr3 = props.componentOverrides) === null || _props$componentOverr3 === void 0 ? void 0 : _props$componentOverr3.header) || /*#__PURE__*/_react2.default.createElement(_HeaderStateful.default, {
+  })), !((_props$controlProps18 = props.controlProps) !== null && _props$controlProps18 !== void 0 && _props$controlProps18.hideHeader) && (0, _componentController.shouldShowHeader)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_props$componentOverr3 = props.componentOverrides) === null || _props$componentOverr3 === void 0 ? void 0 : _props$componentOverr3.header) || /*#__PURE__*/_react2.default.createElement(_HeaderStateful.default, {
     headerProps: props.headerProps,
     outOfOfficeHeaderProps: props.outOfOfficeHeaderProps,
     endChat: endChatRelay
-  })), !((_props$controlProps18 = props.controlProps) !== null && _props$controlProps18 !== void 0 && _props$controlProps18.hideLoadingPane) && (0, _componentController.shouldShowLoadingPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_props$componentOverr4 = props.componentOverrides) === null || _props$componentOverr4 === void 0 ? void 0 : _props$componentOverr4.loadingPane) || /*#__PURE__*/_react2.default.createElement(_LoadingPaneStateful.default, props.loadingPaneProps)), !((_props$controlProps19 = props.controlProps) !== null && _props$controlProps19 !== void 0 && _props$controlProps19.hideOutOfOfficeHoursPane) && (0, _componentController.shouldShowOutOfOfficeHoursPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_props$componentOverr5 = props.componentOverrides) === null || _props$componentOverr5 === void 0 ? void 0 : _props$componentOverr5.outOfOfficeHoursPane) || /*#__PURE__*/_react2.default.createElement(_OOOHPaneStateful.default, props.outOfOfficeHoursPaneProps)), !((_props$controlProps20 = props.controlProps) !== null && _props$controlProps20 !== void 0 && _props$controlProps20.hideReconnectChatPane) && (0, _componentController.shouldShowReconnectChatPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_props$componentOverr6 = props.componentOverrides) === null || _props$componentOverr6 === void 0 ? void 0 : _props$componentOverr6.reconnectChatPane) || /*#__PURE__*/_react2.default.createElement(_ReconnectChatPaneStateful.default, {
+  })), !((_props$controlProps19 = props.controlProps) !== null && _props$controlProps19 !== void 0 && _props$controlProps19.hideLoadingPane) && (0, _componentController.shouldShowLoadingPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_props$componentOverr4 = props.componentOverrides) === null || _props$componentOverr4 === void 0 ? void 0 : _props$componentOverr4.loadingPane) || /*#__PURE__*/_react2.default.createElement(_LoadingPaneStateful.default, props.loadingPaneProps)), !((_props$controlProps20 = props.controlProps) !== null && _props$controlProps20 !== void 0 && _props$controlProps20.hideOutOfOfficeHoursPane) && (0, _componentController.shouldShowOutOfOfficeHoursPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_props$componentOverr5 = props.componentOverrides) === null || _props$componentOverr5 === void 0 ? void 0 : _props$componentOverr5.outOfOfficeHoursPane) || /*#__PURE__*/_react2.default.createElement(_OOOHPaneStateful.default, props.outOfOfficeHoursPaneProps)), !((_props$controlProps21 = props.controlProps) !== null && _props$controlProps21 !== void 0 && _props$controlProps21.hideReconnectChatPane) && (0, _componentController.shouldShowReconnectChatPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_props$componentOverr6 = props.componentOverrides) === null || _props$componentOverr6 === void 0 ? void 0 : _props$componentOverr6.reconnectChatPane) || /*#__PURE__*/_react2.default.createElement(_ReconnectChatPaneStateful.default, {
     reconnectChatProps: props.reconnectChatPaneProps,
     initStartChat: initStartChatRelay
-  })), !((_props$controlProps21 = props.controlProps) !== null && _props$controlProps21 !== void 0 && _props$controlProps21.hidePreChatSurveyPane) && (0, _componentController.shouldShowPreChatSurveyPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_props$componentOverr7 = props.componentOverrides) === null || _props$componentOverr7 === void 0 ? void 0 : _props$componentOverr7.preChatSurveyPane) || /*#__PURE__*/_react2.default.createElement(_PreChatSurveyPaneStateful.default, {
+  })), !((_props$controlProps22 = props.controlProps) !== null && _props$controlProps22 !== void 0 && _props$controlProps22.hidePreChatSurveyPane) && (0, _componentController.shouldShowPreChatSurveyPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_props$componentOverr7 = props.componentOverrides) === null || _props$componentOverr7 === void 0 ? void 0 : _props$componentOverr7.preChatSurveyPane) || /*#__PURE__*/_react2.default.createElement(_PreChatSurveyPaneStateful.default, {
     surveyProps: props.preChatSurveyPaneProps,
     initStartChat: initStartChatRelay
-  })), !((_props$controlProps22 = props.controlProps) !== null && _props$controlProps22 !== void 0 && _props$controlProps22.hideCallingContainer) && (0, _componentController.shouldShowCallingContainer)(state) && /*#__PURE__*/_react2.default.createElement(_CallingContainerStateful.default, _extends({
+  })), !((_props$controlProps23 = props.controlProps) !== null && _props$controlProps23 !== void 0 && _props$controlProps23.hideCallingContainer) && (0, _componentController.shouldShowCallingContainer)(state) && /*#__PURE__*/_react2.default.createElement(_CallingContainerStateful.default, _extends({
     voiceVideoCallingSdk: voiceVideoCallingSDK
-  }, props.callingContainerProps)), !((_props$controlProps23 = props.controlProps) !== null && _props$controlProps23 !== void 0 && _props$controlProps23.hideWebChatContainer) && (0, _componentController.shouldShowWebChatContainer)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_props$componentOverr8 = props.componentOverrides) === null || _props$componentOverr8 === void 0 ? void 0 : _props$componentOverr8.webChatContainer) || /*#__PURE__*/_react2.default.createElement(_WebChatContainerStateful.default, props.webChatContainerProps)), !((_props$controlProps24 = props.controlProps) !== null && _props$controlProps24 !== void 0 && _props$controlProps24.hideConfirmationPane) && (0, _componentController.shouldShowConfirmationPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_props$componentOverr9 = props.componentOverrides) === null || _props$componentOverr9 === void 0 ? void 0 : _props$componentOverr9.confirmationPane) || /*#__PURE__*/_react2.default.createElement(_ConfirmationPaneStateful.default, _extends({}, confirmationPaneProps, {
+  }, props.callingContainerProps)), !((_props$controlProps24 = props.controlProps) !== null && _props$controlProps24 !== void 0 && _props$controlProps24.hideWebChatContainer) && (0, _componentController.shouldShowWebChatContainer)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_props$componentOverr8 = props.componentOverrides) === null || _props$componentOverr8 === void 0 ? void 0 : _props$componentOverr8.webChatContainer) || /*#__PURE__*/_react2.default.createElement(_WebChatContainerStateful.default, props.webChatContainerProps)), !((_props$controlProps25 = props.controlProps) !== null && _props$controlProps25 !== void 0 && _props$controlProps25.hideConfirmationPane) && (0, _componentController.shouldShowConfirmationPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_props$componentOverr9 = props.componentOverrides) === null || _props$componentOverr9 === void 0 ? void 0 : _props$componentOverr9.confirmationPane) || /*#__PURE__*/_react2.default.createElement(_ConfirmationPaneStateful.default, _extends({}, confirmationPaneProps, {
     setPostChatContext: setPostChatContextRelay,
     prepareEndChat: prepareEndChatRelay
-  }))), !((_props$controlProps25 = props.controlProps) !== null && _props$controlProps25 !== void 0 && _props$controlProps25.hidePostChatLoadingPane) && (0, _componentController.shouldShowPostChatLoadingPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_props$componentOverr10 = props.componentOverrides) === null || _props$componentOverr10 === void 0 ? void 0 : _props$componentOverr10.postChatLoadingPane) || /*#__PURE__*/_react2.default.createElement(_PostChatLoadingPaneStateful.default, props.postChatLoadingPaneProps)), (0, _componentController.shouldShowPostChatSurveyPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_props$componentOverr11 = props.componentOverrides) === null || _props$componentOverr11 === void 0 ? void 0 : _props$componentOverr11.postChatSurveyPane) || /*#__PURE__*/_react2.default.createElement(_PostChatSurveyPaneStateful.default, _extends({}, props.postChatSurveyPaneProps, props.chatSDK))), (0, _createFooter.createFooter)(props, state), (0, _componentController.shouldShowEmailTranscriptPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_props$componentOverr12 = props.componentOverrides) === null || _props$componentOverr12 === void 0 ? void 0 : _props$componentOverr12.emailTranscriptPane) || /*#__PURE__*/_react2.default.createElement(_EmailTranscriptPaneStateful.default, props.emailTranscriptPane)))));
+  }))), !((_props$controlProps26 = props.controlProps) !== null && _props$controlProps26 !== void 0 && _props$controlProps26.hidePostChatLoadingPane) && (0, _componentController.shouldShowPostChatLoadingPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_props$componentOverr10 = props.componentOverrides) === null || _props$componentOverr10 === void 0 ? void 0 : _props$componentOverr10.postChatLoadingPane) || /*#__PURE__*/_react2.default.createElement(_PostChatLoadingPaneStateful.default, props.postChatLoadingPaneProps)), (0, _componentController.shouldShowPostChatSurveyPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_props$componentOverr11 = props.componentOverrides) === null || _props$componentOverr11 === void 0 ? void 0 : _props$componentOverr11.postChatSurveyPane) || /*#__PURE__*/_react2.default.createElement(_PostChatSurveyPaneStateful.default, _extends({}, props.postChatSurveyPaneProps, props.chatSDK))), (0, _createFooter.createFooter)(props, state), (0, _componentController.shouldShowEmailTranscriptPane)(state) && ((0, _omnichannelChatComponents.decodeComponentString)((_props$componentOverr12 = props.componentOverrides) === null || _props$componentOverr12 === void 0 ? void 0 : _props$componentOverr12.emailTranscriptPane) || /*#__PURE__*/_react2.default.createElement(_EmailTranscriptPaneStateful.default, props.emailTranscriptPane)))));
 };
 exports.LiveChatWidgetStateful = LiveChatWidgetStateful;
 var _default = LiveChatWidgetStateful;