npm - @microsoft/omnichannel-chat-widget - Versions diffs - 1.8.2-main.4b1a5f0 → 1.8.2-main.5195aba - Mend

@microsoft/omnichannel-chat-widget 1.8.2-main.4b1a5f0 → 1.8.2-main.5195aba

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (63) hide show

package/lib/esm/components/livechatwidget/common/liveChatConfigUtils.js CHANGED Viewed

@@ -6,6 +6,22 @@ export const isPostChatSurveyEnabled = async facadeChatSDK => {
   const postChatEnabled = (_chatConfig$LiveWSAnd = chatConfig.LiveWSAndLiveChatEngJoin) === null || _chatConfig$LiveWSAnd === void 0 ? void 0 : _chatConfig$LiveWSAnd.msdyn_postconversationsurveyenable.toString().toLowerCase();
   return postChatEnabled === "true";
 };
+export const getPostChatSurveyConfig = async facadeChatSDK => {
+  var _chatConfig$LiveWSAnd2, _chatConfig$LiveWSAnd3, _chatConfig$LiveWSAnd4, _chatConfig$LiveWSAnd5, _chatConfig$LiveWSAnd6, _chatConfig$LiveWSAnd7, _chatConfig$LiveWSAnd8, _chatConfig$LiveWSAnd9, _chatConfig$LiveWSAnd10;
+  const chatConfig = await facadeChatSDK.getLiveChatConfig();
+  const postChatEnabled = (_chatConfig$LiveWSAnd2 = chatConfig.LiveWSAndLiveChatEngJoin) === null || _chatConfig$LiveWSAnd2 === void 0 ? void 0 : _chatConfig$LiveWSAnd2.msdyn_postconversationsurveyenable.toString().toLowerCase();
+  const agentSurveyMode = (_chatConfig$LiveWSAnd3 = chatConfig.LiveWSAndLiveChatEngJoin) === null || _chatConfig$LiveWSAnd3 === void 0 ? void 0 : (_chatConfig$LiveWSAnd4 = _chatConfig$LiveWSAnd3.msdyn_postconversationsurveymode) === null || _chatConfig$LiveWSAnd4 === void 0 ? void 0 : _chatConfig$LiveWSAnd4.toString();
+  const botSurveyMode = (_chatConfig$LiveWSAnd5 = chatConfig.LiveWSAndLiveChatEngJoin) === null || _chatConfig$LiveWSAnd5 === void 0 ? void 0 : (_chatConfig$LiveWSAnd6 = _chatConfig$LiveWSAnd5.msdyn_postconversationsurveybotsurveymode) === null || _chatConfig$LiveWSAnd6 === void 0 ? void 0 : _chatConfig$LiveWSAnd6.toString();
+  const surveyProvider = (_chatConfig$LiveWSAnd7 = chatConfig.LiveWSAndLiveChatEngJoin) === null || _chatConfig$LiveWSAnd7 === void 0 ? void 0 : (_chatConfig$LiveWSAnd8 = _chatConfig$LiveWSAnd7.msdyn_surveyprovider) === null || _chatConfig$LiveWSAnd8 === void 0 ? void 0 : _chatConfig$LiveWSAnd8.toString();
+  const isConversationalSurveyEnabled = (_chatConfig$LiveWSAnd9 = chatConfig.LiveWSAndLiveChatEngJoin) === null || _chatConfig$LiveWSAnd9 === void 0 ? void 0 : (_chatConfig$LiveWSAnd10 = _chatConfig$LiveWSAnd9.msdyn_isConversationalPostChatSurveyEnabled) === null || _chatConfig$LiveWSAnd10 === void 0 ? void 0 : _chatConfig$LiveWSAnd10.toString().toLowerCase();
+  return {
+    postChatEnabled: postChatEnabled === "true",
+    agentSurveyMode: agentSurveyMode,
+    botSurveyMode: botSurveyMode,
+    surveyProvider: surveyProvider,
+    isConversationalSurveyEnabled: isConversationalSurveyEnabled === "true"
+  };
+};
 export const isPersistentChatEnabled = conversationMode => {
   if (isNullOrUndefined(conversationMode)) {
     return false;

package/lib/esm/components/livechatwidget/common/renderSurveyHelpers.js CHANGED Viewed

@@ -1,11 +1,11 @@
-import { Constants, ParticipantType, PostChatSurveyTelemetryMessage } from "../../../common/Constants";
+import { Constants, ParticipantType, PostChatSurveyTelemetryMessage, SurveyProvider } from "../../../common/Constants";
 import { LogLevel, TelemetryEvent } from "../../../common/telemetry/TelemetryConstants";
 import { ConversationState } from "../../../contexts/common/ConversationState";
 import { LiveChatWidgetActionType } from "../../../contexts/common/LiveChatWidgetActionType";
 import { PostChatSurveyMode } from "../../postchatsurveypanestateful/enums/PostChatSurveyMode";
 import { TelemetryHelper } from "../../../common/telemetry/TelemetryHelper";
 import { addDelayInMs } from "../../../common/utils";
-import { isPostChatSurveyEnabled } from "./liveChatConfigUtils";
+import { getPostChatSurveyConfig } from "./liveChatConfigUtils";
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 let conversationDetails = undefined;
@@ -46,23 +46,34 @@ const setSurveyMode = async (props, participantType, state, dispatch) => {
 };
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-const renderSurvey = async (postChatContext, dispatch) => {
+const renderSurvey = async (postChatContext, state, dispatch) => {
   if (postChatSurveyMode === PostChatSurveyMode.Link) {
     setWidgetStateToInactive(dispatch);
     return;
   }
   if (postChatSurveyMode === PostChatSurveyMode.Embed) {
-    await embedModePostChatWorkflow(postChatContext, dispatch);
+    await embedModePostChatWorkflow(postChatContext, state, dispatch);
   }
 };
 // Function for embed mode postchat workflow which is essentially same for both customer and agent
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-const embedModePostChatWorkflow = async (postChatContext, dispatch) => {
+const embedModePostChatWorkflow = async (postChatContext, state, dispatch) => {
   TelemetryHelper.logActionEvent(LogLevel.INFO, {
     Event: TelemetryEvent.EmbedModePostChatWorkflowStarted
   });
   if (postChatContext) {
+    if (postChatContext.isConversationalSurveyEnabled && postChatContext.surveyProvider === SurveyProvider.MicrosoftCopilotStudio) {
+      dispatch({
+        type: LiveChatWidgetActionType.SET_CONVERSATION_STATE,
+        payload: ConversationState.Postchat
+      });
+      dispatch({
+        type: LiveChatWidgetActionType.SET_CONVERSATIONAL_SURVEY_DISPLAY,
+        payload: true
+      });
+      return;
+    }
     dispatch({
       type: LiveChatWidgetActionType.SET_CONVERSATION_STATE,
       payload: ConversationState.PostchatLoading
@@ -89,7 +100,7 @@ const initiatePostChat = async (props, conversationDetailsParam, state, dispatch
   conversationDetails = conversationDetailsParam;
   const participantType = ((_conversationDetails = conversationDetails) === null || _conversationDetails === void 0 ? void 0 : _conversationDetails.participantType) ?? postchatContext.participantType;
   await setSurveyMode(props, participantType, state, dispatch);
-  await renderSurvey(postchatContext, dispatch);
+  await renderSurvey(postchatContext, state, dispatch);
 };
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -102,7 +113,14 @@ const isPostChatEnabled = (props, state) => {
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 const getPostChatContext = async (facadeChatSDK, state, dispatch) => {
   try {
-    const postChatEnabled = await isPostChatSurveyEnabled(facadeChatSDK);
+    const postChatConfig = await getPostChatSurveyConfig(facadeChatSDK);
+    const postChatEnabled = postChatConfig.postChatEnabled;
+    if (postChatConfig.isConversationalSurveyEnabled) {
+      dispatch({
+        type: LiveChatWidgetActionType.SET_CONVERSATIONAL_SURVEY_ENABLED,
+        payload: true
+      });
+    }
     if (postChatEnabled) {
       var _state$domainStates2;
       if ((state === null || state === void 0 ? void 0 : (_state$domainStates2 = state.domainStates) === null || _state$domainStates2 === void 0 ? void 0 : _state$domainStates2.postChatContext) === undefined) {
@@ -112,11 +130,17 @@ const getPostChatContext = async (facadeChatSDK, state, dispatch) => {
           Event: TelemetryEvent.PostChatContextCallSucceed,
           Description: PostChatSurveyTelemetryMessage.PostChatContextCallSucceed
         });
+        // Merge postChatConfig with postChatSurveyContext
+        const mergedContext = {
+          ...context,
+          ...postChatConfig
+        };
         dispatch({
           type: LiveChatWidgetActionType.SET_POST_CHAT_CONTEXT,
-          payload: context
+          payload: mergedContext
         });
-        return context;
+        return mergedContext;
       }
     }
   } catch (error) {

package/lib/esm/components/livechatwidget/common/setPostChatContextAndLoadSurvey.js CHANGED Viewed

@@ -4,12 +4,19 @@ import { ConversationState } from "../../../contexts/common/ConversationState";
 import { LiveChatWidgetActionType } from "../../../contexts/common/LiveChatWidgetActionType";
 import { PostChatSurveyTelemetryMessage } from "../../../common/Constants";
 import { TelemetryHelper } from "../../../common/telemetry/TelemetryHelper";
-import { isPostChatSurveyEnabled } from "./liveChatConfigUtils";
+import { getPostChatSurveyConfig } from "./liveChatConfigUtils";
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 export const setPostChatContextAndLoadSurvey = async (facadeChatSDK, dispatch, persistedChat) => {
   try {
-    const postChatEnabled = await isPostChatSurveyEnabled(facadeChatSDK);
+    const postChatConfig = await getPostChatSurveyConfig(facadeChatSDK);
+    if (postChatConfig.isConversationalSurveyEnabled) {
+      dispatch({
+        type: LiveChatWidgetActionType.SET_CONVERSATIONAL_SURVEY_ENABLED,
+        payload: true
+      });
+    }
+    const postChatEnabled = postChatConfig.postChatEnabled;
     if (postChatEnabled) {
       if (!persistedChat) {
         TelemetryHelper.logSDKEventToAllTelemetry(LogLevel.INFO, {
@@ -22,9 +29,15 @@ export const setPostChatContextAndLoadSurvey = async (facadeChatSDK, dispatch, p
           Event: TelemetryEvent.PostChatContextCallSucceed,
           Description: PostChatSurveyTelemetryMessage.PostChatContextCallSucceed
         });
+        // Merge postChatConfig with postChatSurveyContext
+        const mergedContext = {
+          ...context,
+          ...postChatConfig
+        };
         dispatch({
           type: LiveChatWidgetActionType.SET_POST_CHAT_CONTEXT,
-          payload: context
+          payload: mergedContext
         });
       }
     }

package/lib/esm/components/livechatwidget/common/startChat.js CHANGED Viewed

@@ -197,8 +197,11 @@ const initStartChat = async (facadeChatSDK, dispatch, setAdapter, state, props,
         portalContactId: (_window$Microsoft = window.Microsoft) === null || _window$Microsoft === void 0 ? void 0 : (_window$Microsoft$Dyn = _window$Microsoft.Dynamic365) === null || _window$Microsoft$Dyn === void 0 ? void 0 : (_window$Microsoft$Dyn2 = _window$Microsoft$Dyn.Portal) === null || _window$Microsoft$Dyn2 === void 0 ? void 0 : (_window$Microsoft$Dyn3 = _window$Microsoft$Dyn2.User) === null || _window$Microsoft$Dyn3 === void 0 ? void 0 : _window$Microsoft$Dyn3.contactId
       };
       const startChatOptionalParams = Object.assign({}, params, optionalParams, defaultOptionalParams);
+      // startTime is used to determine if a message is history or new, better to be set before creating the adapter to get bandwidth
+      const startTime = new Date().getTime();
       await facadeChatSDK.startChat(startChatOptionalParams);
       isStartChatSuccessful = true;
+      await createAdapterAndSubscribe(facadeChatSDK, dispatch, setAdapter, startTime, props);
     } catch (error) {
       checkContactIdError(error);
       TelemetryHelper.logSDKEvent(LogLevel.ERROR, {
@@ -216,7 +219,6 @@ const initStartChat = async (facadeChatSDK, dispatch, setAdapter, state, props,
       isStartChatSuccessful = false;
       throw error;
     }
-    await createAdapterAndSubscribe(facadeChatSDK, dispatch, setAdapter, props);
     // Set app state to Active
     if (isStartChatSuccessful) {
@@ -266,7 +268,7 @@ const initStartChat = async (facadeChatSDK, dispatch, setAdapter, state, props,
 };
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-const createAdapterAndSubscribe = async (facadeChatSDK, dispatch, setAdapter, props) => {
+const createAdapterAndSubscribe = async (facadeChatSDK, dispatch, setAdapter, startTime, props) => {
   // New adapter creation
   const newAdapter = await createAdapter(facadeChatSDK, props);
   setAdapter(newAdapter);
@@ -277,7 +279,7 @@ const createAdapterAndSubscribe = async (facadeChatSDK, dispatch, setAdapter, pr
   });
   if (chatToken !== null && chatToken !== void 0 && chatToken.chatId && chatToken !== null && chatToken !== void 0 && chatToken.visitorId) {
     var _newAdapter$activity$;
-    newAdapter === null || newAdapter === void 0 ? void 0 : (_newAdapter$activity$ = newAdapter.activity$) === null || _newAdapter$activity$ === void 0 ? void 0 : _newAdapter$activity$.subscribe(createOnNewAdapterActivityHandler(chatToken.chatId, chatToken.visitorId));
+    newAdapter === null || newAdapter === void 0 ? void 0 : (_newAdapter$activity$ = newAdapter.activity$) === null || _newAdapter$activity$ === void 0 ? void 0 : _newAdapter$activity$.subscribe(createOnNewAdapterActivityHandler(chatToken.chatId, chatToken.visitorId, startTime));
   }
 };
 // eslint-disable-next-line @typescript-eslint/no-explicit-any

package/lib/esm/components/livechatwidget/livechatwidgetstateful/LiveChatWidgetStateful.js CHANGED Viewed

@@ -611,12 +611,15 @@ export const LiveChatWidgetStateful = props => {
           payload: null
         });
         if ("participantsRemoved" in event && (inMemoryState === null || inMemoryState === void 0 ? void 0 : (_inMemoryState$appSta5 = inMemoryState.appStates) === null || _inMemoryState$appSta5 === void 0 ? void 0 : _inMemoryState$appSta5.conversationState) === ConversationState.Active) {
-          setWebChatStyles(styles => {
-            return {
-              ...styles,
-              hideSendBox: true
-            };
-          });
+          var _inMemoryState$appSta6;
+          if ((inMemoryState === null || inMemoryState === void 0 ? void 0 : (_inMemoryState$appSta6 = inMemoryState.appStates) === null || _inMemoryState$appSta6 === void 0 ? void 0 : _inMemoryState$appSta6.isConversationalSurveyEnabled) === false) {
+            setWebChatStyles(styles => {
+              return {
+                ...styles,
+                hideSendBox: true
+              };
+            });
+          }
           TelemetryHelper.logSDKEvent(LogLevel.INFO, {
             Event: TelemetryEvent.ParticipantsRemovedEvent,
             Description: "Participants removed event received."
@@ -712,7 +715,15 @@ export const LiveChatWidgetStateful = props => {
       endChat(props, facadeChatSDK, state, dispatch, setAdapter, setWebChatStyles, adapter, false, false, true);
       return;
     }
-    if ((state === null || state === void 0 ? void 0 : (_state$appStates12 = state.appStates) === null || _state$appStates12 === void 0 ? void 0 : _state$appStates12.conversationEndedBy) === ConversationEndEntity.Agent || (state === null || state === void 0 ? void 0 : (_state$appStates13 = state.appStates) === null || _state$appStates13 === void 0 ? void 0 : _state$appStates13.conversationEndedBy) === ConversationEndEntity.Bot) {
+    const inMemoryState = executeReducer(state, {
+      type: LiveChatWidgetActionType.GET_IN_MEMORY_STATE,
+      payload: null
+    });
+    let isConversationalSurveyEnabled = state.appStates.isConversationalSurveyEnabled;
+    // In conversational survey, we need to check post chat survey logics before we set ConversationState to InActive
+    // Hence setting ConversationState to InActive will be done later in the post chat flows
+    if (!isConversationalSurveyEnabled && ((state === null || state === void 0 ? void 0 : (_state$appStates12 = state.appStates) === null || _state$appStates12 === void 0 ? void 0 : _state$appStates12.conversationEndedBy) === ConversationEndEntity.Agent || (state === null || state === void 0 ? void 0 : (_state$appStates13 = state.appStates) === null || _state$appStates13 === void 0 ? void 0 : _state$appStates13.conversationEndedBy) === ConversationEndEntity.Bot)) {
       dispatch({
         type: LiveChatWidgetActionType.SET_CONVERSATION_STATE,
         payload: ConversationState.InActive
@@ -753,13 +764,13 @@ export const LiveChatWidgetStateful = props => {
   // Handle Chat disconnect cases
   useEffect(() => {
-    var _inMemoryState$appSta6;
+    var _inMemoryState$appSta7;
     const inMemoryState = executeReducer(state, {
       type: LiveChatWidgetActionType.GET_IN_MEMORY_STATE,
       payload: null
     });
     handleChatDisconnect(props, inMemoryState, setWebChatStyles);
-    const chatDisconnectState = inMemoryState === null || inMemoryState === void 0 ? void 0 : (_inMemoryState$appSta6 = inMemoryState.appStates) === null || _inMemoryState$appSta6 === void 0 ? void 0 : _inMemoryState$appSta6.chatDisconnectEventReceived;
+    const chatDisconnectState = inMemoryState === null || inMemoryState === void 0 ? void 0 : (_inMemoryState$appSta7 = inMemoryState.appStates) === null || _inMemoryState$appSta7 === void 0 ? void 0 : _inMemoryState$appSta7.chatDisconnectEventReceived;
     if (chatDisconnectState && adapter) {
       try {
         adapter.end();
@@ -887,8 +898,8 @@ export const LiveChatWidgetStateful = props => {
                 margin-left: .25em;
             }
             ${(sendBoxTextArea === null || sendBoxTextArea === void 0 ? void 0 : sendBoxTextArea.minHeight) && `
-            textarea.webchat__send-box-text-box__html-text-area {
-                min-height: ${sendBoxTextArea === null || sendBoxTextArea === void 0 ? void 0 : sendBoxTextArea.minHeight};
+            .webchat__auto-resize-textarea.webchat__send-box-text-box__text-area {
+                min-height: ${sendBoxTextArea === null || sendBoxTextArea === void 0 ? void 0 : sendBoxTextArea.minHeight} !important;
             }`}
             `), /*#__PURE__*/React.createElement(DraggableChatWidget, chatWidgetDraggableConfig, /*#__PURE__*/React.createElement(Composer, _extends({}, webChatProps, {
     userID: userID,

package/lib/esm/components/webchatcontainerstateful/WebChatContainerStateful.js CHANGED Viewed

@@ -48,7 +48,7 @@ const createMagicCodeSuccessResponse = signin => {
   };
 };
 export const WebChatContainerStateful = props => {
-  var _webChatContainerProp, _webChatContainerProp2, _webChatContainerProp3, _webChatContainerProp4, _webChatContainerProp5, _webChatContainerProp6, _webChatContainerProp7, _props$webChatContain5, _props$webChatContain6, _defaultWebChatContai, _props$webChatContain7, _props$webChatContain8, _defaultWebChatContai2, _webChatContainerProp8, _webChatContainerProp9, _webChatContainerProp10, _webChatContainerProp11, _webChatContainerProp12, _webChatContainerProp13, _webChatContainerProp14, _webChatContainerProp15, _webChatContainerProp16, _props$webChatContain9, _props$webChatContain10;
+  var _webChatContainerProp, _webChatContainerProp2, _webChatContainerProp3, _webChatContainerProp4, _webChatContainerProp5, _webChatContainerProp6, _webChatContainerProp7, _webChatContainerProp8, _props$webChatContain5, _props$webChatContain6, _defaultWebChatContai, _props$webChatContain7, _props$webChatContain8, _defaultWebChatContai2, _webChatContainerProp9, _webChatContainerProp10, _webChatContainerProp11, _webChatContainerProp12, _webChatContainerProp13, _webChatContainerProp14, _webChatContainerProp15, _webChatContainerProp16, _webChatContainerProp17, _webChatContainerProp18, _webChatContainerProp19, _webChatContainerProp20, _webChatContainerProp21, _webChatContainerProp22, _webChatContainerProp23, _props$webChatContain9, _props$webChatContain10;
   useEffect(() => {
     uiTimer = createTimer();
     TelemetryHelper.logLoadingEvent(LogLevel.INFO, {
@@ -177,20 +177,24 @@ export const WebChatContainerStateful = props => {
             background: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp === void 0 ? void 0 : _webChatContainerProp.background) ?? defaultAdaptiveCardStyles.background};
         }
+        .webchat__bubble__content>div#ms_lcw_webchat_adaptive_card .ac-textBlock {
+            color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp2 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp2 === void 0 ? void 0 : _webChatContainerProp2.color) ?? defaultAdaptiveCardStyles.color} !important;
+        }
         .webchat__stacked-layout__content div.webchat__stacked-layout__message-row div.webchat__bubble--from-user {
-            max-width: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp2 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp2 === void 0 ? void 0 : (_webChatContainerProp3 = _webChatContainerProp2.userMessageBoxStyles) === null || _webChatContainerProp3 === void 0 ? void 0 : _webChatContainerProp3.maxWidth) ?? (defaultUserMessageBoxStyles === null || defaultUserMessageBoxStyles === void 0 ? void 0 : defaultUserMessageBoxStyles.maxWidth)}
+            max-width: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp3 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp3 === void 0 ? void 0 : (_webChatContainerProp4 = _webChatContainerProp3.userMessageBoxStyles) === null || _webChatContainerProp4 === void 0 ? void 0 : _webChatContainerProp4.maxWidth) ?? (defaultUserMessageBoxStyles === null || defaultUserMessageBoxStyles === void 0 ? void 0 : defaultUserMessageBoxStyles.maxWidth)}
         }
         .webchat__stacked-layout--show-avatar div.webchat__stacked-layout__content div.webchat__stacked-layout__message-row div.webchat__stacked-layout__message {
-            max-width: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp4 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp4 === void 0 ? void 0 : (_webChatContainerProp5 = _webChatContainerProp4.systemMessageBoxStyles) === null || _webChatContainerProp5 === void 0 ? void 0 : _webChatContainerProp5.maxWidth) ?? (defaultSystemMessageBoxStyles === null || defaultSystemMessageBoxStyles === void 0 ? void 0 : defaultSystemMessageBoxStyles.maxWidth)}
+            max-width: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp5 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp5 === void 0 ? void 0 : (_webChatContainerProp6 = _webChatContainerProp5.systemMessageBoxStyles) === null || _webChatContainerProp6 === void 0 ? void 0 : _webChatContainerProp6.maxWidth) ?? (defaultSystemMessageBoxStyles === null || defaultSystemMessageBoxStyles === void 0 ? void 0 : defaultSystemMessageBoxStyles.maxWidth)}
         }
         div[class="ac-textBlock"] *,
-        div[class="ac-input-container"] * {white-space:${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp6 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp6 === void 0 ? void 0 : _webChatContainerProp6.textWhiteSpace) ?? defaultAdaptiveCardStyles.textWhiteSpace}}
+        div[class="ac-input-container"] * {white-space:${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp7 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp7 === void 0 ? void 0 : _webChatContainerProp7.textWhiteSpace) ?? defaultAdaptiveCardStyles.textWhiteSpace}}
         div[class="ac-input-container"] input.ac-multichoiceInput,
         div[class="ac-input-container"] select.ac-multichoiceInput {
-            ${webChatContainerProps !== null && webChatContainerProps !== void 0 && (_webChatContainerProp7 = webChatContainerProps.adaptiveCardStyles) !== null && _webChatContainerProp7 !== void 0 && _webChatContainerProp7.choiceInputPadding ? `padding: ${webChatContainerProps.adaptiveCardStyles.choiceInputPadding} !important;` : ""}
+            ${webChatContainerProps !== null && webChatContainerProps !== void 0 && (_webChatContainerProp8 = webChatContainerProps.adaptiveCardStyles) !== null && _webChatContainerProp8 !== void 0 && _webChatContainerProp8.choiceInputPadding ? `padding: ${webChatContainerProps.adaptiveCardStyles.choiceInputPadding} !important;` : ""}
         }
         .ms_lcw_webchat_received_message>div.webchat__stacked-layout>div.webchat__stacked-layout__main>div.webchat__stacked-layout__content>div.webchat__stacked-layout__message-row>[class^=webchat]:not(.webchat__bubble--from-user)>.webchat__bubble__content {
@@ -202,20 +206,54 @@ export const WebChatContainerStateful = props => {
         div[class="ac-textBlock"] a:visited,
         div[class="ac-textBlock"] a:hover,
         div[class="ac-textBlock"] a:active {
-            color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp8 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp8 === void 0 ? void 0 : _webChatContainerProp8.anchorColor) ?? defaultAdaptiveCardStyles.anchorColor};
+            color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp9 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp9 === void 0 ? void 0 : _webChatContainerProp9.anchorColor) ?? defaultAdaptiveCardStyles.anchorColor};
         }
-        .webchat__stacked-layout__content .ac-actionSet > .ac-pushButton > div {white-space: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp9 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp9 === void 0 ? void 0 : _webChatContainerProp9.buttonWhiteSpace) ?? defaultAdaptiveCardStyles.buttonWhiteSpace} !important;}
+        .webchat__stacked-layout__content .ac-actionSet > .ac-pushButton > div {white-space: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp10 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp10 === void 0 ? void 0 : _webChatContainerProp10.buttonWhiteSpace) ?? defaultAdaptiveCardStyles.buttonWhiteSpace} !important;}
         .ms_lcw_webchat_received_message img.webchat__render-markdown__external-link-icon {
-            background-image: url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIzIDMgMTggMTgiICB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Ik03LjI1MDEgNC41MDAxN0gxMC43NDk1QzExLjE2MzcgNC41MDAxNyAxMS40OTk1IDQuODM1OTYgMTEuNDk5NSA1LjI1MDE3QzExLjQ5OTUgNS42Mjk4NiAxMS4yMTczIDUuOTQzNjYgMTAuODUxMyA1Ljk5MzMyTDEwLjc0OTUgNi4wMDAxN0g3LjI0OTc0QzYuMDcwNzkgNS45OTk2MSA1LjEwMzQ5IDYuOTA2NTYgNS4wMDc4NiA4LjA2MTEyTDUuMDAwMjggOC4yMjAwM0w1LjAwMzEyIDE2Ljc1MDdDNS4wMDM0MyAxNy45NDE1IDUuOTI4ODUgMTguOTE2MSA3LjA5OTY2IDE4Ljk5NDlMNy4yNTM3MSAxOS4wMDAxTDE1Ljc1MTggMTguOTg4NEMxNi45NDE1IDE4Ljk4NjggMTcuOTE0NSAxOC4wNjIgMTcuOTkzNSAxNi44OTIzTDE3Ljk5ODcgMTYuNzM4NFYxMy4yMzIxQzE3Ljk5ODcgMTIuODE3OSAxOC4zMzQ1IDEyLjQ4MjEgMTguNzQ4NyAxMi40ODIxQzE5LjEyODQgMTIuNDgyMSAxOS40NDIyIDEyLjc2NDMgMTkuNDkxOCAxMy4xMzAzTDE5LjQ5ODcgMTMuMjMyMVYxNi43Mzg0QzE5LjQ5ODcgMTguNzQwNyAxNy45MjkzIDIwLjM3NjkgMTUuOTUyOCAyMC40ODI5TDE1Ljc1MzggMjAuNDg4NEw3LjI1ODI3IDIwLjUwMDFMNy4wNTQ5NSAyMC40OTQ5QzUuMTQyMzkgMjAuMzk1NCAzLjYwODk1IDE4Ljg2MjcgMy41MDgzNyAxNi45NTAyTDMuNTAzMTIgMTYuNzUxMUwzLjUwMDg5IDguMjUyN0wzLjUwNTI5IDguMDUwMkMzLjYwNTM5IDYuMTM3NDkgNS4xMzg2NyA0LjYwNDQ5IDcuMDUwOTYgNC41MDUyN0w3LjI1MDEgNC41MDAxN0gxMC43NDk1SDcuMjUwMVpNMTMuNzQ4MSAzLjAwMTQ2TDIwLjMwMTggMy4wMDE5N0wyMC40MDE0IDMuMDE1NzVMMjAuNTAyMiAzLjA0MzkzTDIwLjU1OSAzLjA2ODAzQzIwLjYxMjIgMy4wOTEyMiAyMC42NjM0IDMuMTIxNjMgMjAuNzExMSAzLjE1ODg1TDIwLjc4MDQgMy4yMjE1NkwyMC44NjQxIDMuMzIwMTRMMjAuOTE4MyAzLjQxMDI1TDIwLjk1NyAzLjUwMDU3TDIwLjk3NjIgMy41NjQ3NkwyMC45ODk4IDMuNjI4NjJMMjAuOTk5MiAzLjcyMjgyTDIwLjk5OTcgMTAuMjU1NEMyMC45OTk3IDEwLjY2OTYgMjAuNjYzOSAxMS4wMDU0IDIwLjI0OTcgMTEuMDA1NEMxOS44NyAxMS4wMDU0IDE5LjU1NjIgMTAuNzIzMiAxOS41MDY1IDEwLjM1NzFMMTkuNDk5NyAxMC4yNTU0TDE5LjQ5ODkgNS41NjE0N0wxMi4yNzk3IDEyLjc4NDdDMTIuMDEzNCAxMy4wNTEgMTEuNTk2OCAxMy4wNzUzIDExLjMwMzEgMTIuODU3NUwxMS4yMTkgMTIuNzg0OUMxMC45NTI3IDEyLjUxODcgMTAuOTI4NCAxMi4xMDIxIDExLjE0NjIgMTEuODA4NEwxMS4yMTg4IDExLjcyNDNMMTguNDM2OSA0LjUwMTQ2SDEzLjc0ODFDMTMuMzY4NCA0LjUwMTQ2IDEzLjA1NDYgNC4yMTkzMSAxMy4wMDUgMy44NTMyNEwxMi45OTgxIDMuNzUxNDZDMTIuOTk4MSAzLjM3MTc3IDEzLjI4MDMgMy4wNTc5NyAxMy42NDY0IDMuMDA4MzFMMTMuNzQ4MSAzLjAwMTQ2WiIgZmlsbD0iI0ZGRkZGRiIgLz48L3N2Zz4) !important;
+            /* Fallback for browsers that don't support mask */
+            background-image: url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIzIDMgMTggMTgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTcuMjUwMSA0LjUwMDE3SDEwLjc0OTVDMTEuMTYzNyA0LjUwMDE3IDExLjQ5OTUgNC44MzU5NiAxMS40OTk1IDUuMjUwMTdDMTEuNDk5NSA1LjYyOTg2IDExLjIxNzMgNS45NDM2NiAxMC44NTEzIDUuOTkzMzJMMTAuNzQ5NSA2LjAwMDE3SDcuMjQ5NzRDNi4wNzA3OSA1Ljk5OTYxIDUuMTAzNDkgNi45MDY1NiA1LjAwNzg2IDguMDYxMTJMNS4wMDAyOCA4LjIyMDAzTDUuMDAzMTIgMTYuNzUwN0M1LjAwMzQzIDE3Ljk0MTUgNS45Mjg4NSAxOC45MTYxIDcuMDk5NjYgMTguOTk0OUw3LjI1MzcxIDE5LjAwMDFMMTUuNzUxOCAxOC45ODg0QzE2Ljk0MTUgMTguOTg2OCAxNy45MTQ1IDE4LjA2MiAxNy45OTM1IDE2Ljg5MjNMMTcuOTk4NyAxNi43Mzg0VjEzLjIzMjFDMTcuOTk4NyAxMi44MTc5IDE4LjMzNDUgMTIuNDgyMSAxOC43NDg3IDEyLjQ4MjFDMTkuMTI4NCAxMi40ODIxIDE5LjQ0MjIgMTIuNzY0MyAxOS40OTE4IDEzLjEzMDNMMTkuNDk4NyAxMy4yMzIxVjE2LjczODRDMTkuNDk4NyAxOC43NDA3IDE3LjkyOTMgMjAuMzc2OSAxNS45NTI4IDIwLjQ4MjlMMTUuNzUzOCAyMC40ODg0TDcuMjU4MjcgMjAuNTAwMUw3LjA1NDk1IDIwLjQ5NDlDNS4xNDIzOSAyMC4zOTU0IDMuNjA4OTUgMTguODYyNyAzLjUwODM3IDE2Ljk1MDJMMy41MDMxMiAxNi43NTExTDMuNTAwODkgOC4yNTI3TDMuNTA1MjkgOC4wNTAyQzMuNjA1MzkgNi4xMzc0OSA1LjEzODY3IDQuNjA0NDkgNy4wNTA5NiA0LjUwNTI3TDcuMjUwMSA0LjUwMDE3SDEwLjc0OTVINy4yNTAxWk0xMy43NDgxIDMuMDAxNDZMMjAuMzAxOCAzLjAwMTk3TDIwLjQwMTQgMy4wMTU3NUwyMC41MDIyIDMuMDQzOTNMMjAuNTU5IDMuMDY4MDNDMjAuNjEyMiAzLjA5MTIyIDIwLjY2MzQgMy4xMjE2MyAyMC43MTExIDMuMTU4ODVMMjAuNzgwNCAzLjIyMTU2TDIwLjg2NDEgMy4zMjAxNEwyMC45MTgzIDMuNDEwMjVMMjAuOTU3IDMuNTAwNTdMMjAuOTc2MiAzLjU2NDc2TDIwLjk4OTggMy42Mjg2MkwyMC45OTkyIDMuNzIyODJMMjAuOTk5NyAxMC4yNTU0QzIwLjk5OTcgMTAuNjY5NiAyMC42NjM5IDExLjAwNTQgMjAuMjQ5NyAxMS4wMDU0QzE5Ljg3IDExLjAwNTQgMTkuNTU2MiAxMC43MjMyIDE5LjUwNjUgMTAuMzU3MUwxOS40OTk3IDEwLjI1NTRMMTkuNDk4OSA1LjU2MTQ3TDEyLjI3OTcgMTIuNzg0N0MxMi4wMTM0IDEzLjA1MSAxMS41OTY4IDEzLjA3NTMgMTEuMzAzMSAxMi44NTc1TDExLjIxOSAxMi43ODQ5QzEwLjk1MjcgMTIuNTE4NyAxMC45Mjg0IDEyLjEwMjEgMTEuMTQ2MiAxMS44MDg0TDExLjIxODggMTEuNzI0M0wxOC40MzY5IDQuNTAxNDZIMTMuNzQ4MUMxMy4zNjg0IDQuNTAxNDYgMTMuMDU0NiA0LjIxOTMxIDEzLjAwNSAzLjg1MzI0TDEyLjk5ODEgMy43NTE0NkMxMi45OTgxIDMuMzcxNzcgMTMuMjgwMyAzLjA1Nzk3IDEzLjY0NjQgMy4wMDgzMUwxMy43NDgxIDMuMDAxNDZaIiBmaWxsPSIjRkZGRkZGIiAvPjwvc3ZnPg==);
+            filter: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp11 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp11 === void 0 ? void 0 : (_webChatContainerProp12 = _webChatContainerProp11.receivedMessageAnchorStyles) === null || _webChatContainerProp12 === void 0 ? void 0 : _webChatContainerProp12.filter) ?? (defaultReceivedMessageAnchorStyles === null || defaultReceivedMessageAnchorStyles === void 0 ? void 0 : defaultReceivedMessageAnchorStyles.filter)};
+            height: .75em;
+            width: .75em;
+            margin-left: .25em;
+            display: inline-block;
+        }
+        .ms_lcw_webchat_sent_message img.webchat__render-markdown__external-link-icon {
+            /* Fallback for browsers that don't support mask */
+            background-image: url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIzIDMgMTggMTgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTcuMjUwMSA0LjUwMDE3SDEwLjc0OTVDMTEuMTYzNyA0LjUwMDE3IDExLjQ5OTUgNC44MzU5NiAxMS40OTk1IDUuMjUwMTdDMTEuNDk5NSA1LjYyOTg2IDExLjIxNzMgNS45NDM2NiAxMC44NTEzIDUuOTkzMzJMMTAuNzQ5NSA2LjAwMDE3SDcuMjQ5NzRDNi4wNzA3OSA1Ljk5OTYxIDUuMTAzNDkgNi45MDY1NiA1LjAwNzg2IDguMDYxMTJMNS4wMDAyOCA4LjIyMDAzTDUuMDAzMTIgMTYuNzUwN0M1LjAwMzQzIDE3Ljk0MTUgNS45Mjg4NSAxOC45MTYxIDcuMDk5NjYgMTguOTk0OUw3LjI1MzcxIDE5LjAwMDFMMTUuNzUxOCAxOC45ODg0QzE2Ljk0MTUgMTguOTg2OCAxNy45MTQ1IDE4LjA2MiAxNy45OTM1IDE2Ljg5MjNMMTcuOTk4NyAxNi43Mzg0VjEzLjIzMjFDMTcuOTk4NyAxMi44MTc5IDE4LjMzNDUgMTIuNDgyMSAxOC43NDg3IDEyLjQ4MjFDMTkuMTI4NCAxMi40ODIxIDE5LjQ0MjIgMTIuNzY0MyAxOS40OTE4IDEzLjEzMDNMMTkuNDk4NyAxMy4yMzIxVjE2LjczODRDMTkuNDk4NyAxOC43NDA3IDE3LjkyOTMgMjAuMzc2OSAxNS45NTI4IDIwLjQ4MjlMMTUuNzUzOCAyMC40ODg0TDcuMjU4MjcgMjAuNTAwMUw3LjA1NDk1IDIwLjQ5NDlDNS4xNDIzOSAyMC4zOTU0IDMuNjA4OTUgMTguODYyNyAzLjUwODM3IDE2Ljk1MDJMMy41MDMxMiAxNi43NTExTDMuNTAwODkgOC4yNTI3TDMuNTA1MjkgOC4wNTAyQzMuNjA1MzkgNi4xMzc0OSA1LjEzODY3IDQuNjA0NDkgNy4wNTA5NiA0LjUwNTI3TDcuMjUwMSA0LjUwMDE3SDEwLjc0OTVINy4yNTAxWk0xMy43NDgxIDMuMDAxNDZMMjAuMzAxOCAzLjAwMTk3TDIwLjQwMTQgMy4wMTU3NUwyMC41MDIyIDMuMDQzOTNMMjAuNTU5IDMuMDY4MDNDMjAuNjEyMiAzLjA5MTIyIDIwLjY2MzQgMy4xMjE2MyAyMC43MTExIDMuMTU4ODVMMjAuNzgwNCAzLjIyMTU2TDIwLjg2NDEgMy4zMjAxNEwyMC45MTgzIDMuNDEwMjVMMjAuOTU3IDMuNTAwNTdMMjAuOTc2MiAzLjU2NDc2TDIwLjk4OTggMy42Mjg2MkwyMC45OTkyIDMuNzIyODJMMjAuOTk5NyAxMC4yNTU0QzIwLjk5OTcgMTAuNjY5NiAyMC42NjM5IDExLjAwNTQgMjAuMjQ5NyAxMS4wMDU0QzE5Ljg3IDExLjAwNTQgMTkuNTU2MiAxMC43MjMyIDE5LjUwNjUgMTAuMzU3MUwxOS40OTk3IDEwLjI1NTRMMTkuNDk4OSA1LjU2MTQ3TDEyLjI3OTcgMTIuNzg0N0MxMi4wMTM0IDEzLjA1MSAxMS41OTY4IDEzLjA3NTMgMTEuMzAzMSAxMi44NTc1TDExLjIxOSAxMi43ODQ5QzEwLjk1MjcgMTIuNTE4NyAxMC45Mjg0IDEyLjEwMjEgMTEuMTQ2MiAxMS44MDg0TDExLjIxODggMTEuNzI0M0wxOC40MzY5IDQuNTAxNDZIMTMuNzQ4MUMxMy4zNjg0IDQuNTAxNDYgMTMuMDU0NiA0LjIxOTMxIDEzLjAwNSAzLjg1MzI0TDEyLjk5ODEgMy43NTE0NkMxMi45OTgxIDMuMzcxNzcgMTMuMjgwMyAzLjA1Nzk3IDEzLjY0NjQgMy4wMDgzMUwxMy43NDgxIDMuMDAxNDZaIiBmaWxsPSIjRkZGRkZGIiAvPjwvc3ZnPg==);
+            filter: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp13 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp13 === void 0 ? void 0 : (_webChatContainerProp14 = _webChatContainerProp13.sentMessageAnchorStyles) === null || _webChatContainerProp14 === void 0 ? void 0 : _webChatContainerProp14.filter) ?? (defaultSentMessageAnchorStyles === null || defaultSentMessageAnchorStyles === void 0 ? void 0 : defaultSentMessageAnchorStyles.filter)};
             height: .75em;
+            width: .75em;
             margin-left: .25em;
-            filter:${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp10 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp10 === void 0 ? void 0 : (_webChatContainerProp11 = _webChatContainerProp10.receivedMessageAnchorStyles) === null || _webChatContainerProp11 === void 0 ? void 0 : _webChatContainerProp11.filter) ?? (defaultReceivedMessageAnchorStyles === null || defaultReceivedMessageAnchorStyles === void 0 ? void 0 : defaultReceivedMessageAnchorStyles.filter)};
+            display: inline-block;
+        }
+        /* Modern browsers with mask support */
+        @supports (mask: url()) or (-webkit-mask: url()) {
+            .ms_lcw_webchat_received_message img.webchat__render-markdown__external-link-icon {
+                background-color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp15 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp15 === void 0 ? void 0 : (_webChatContainerProp16 = _webChatContainerProp15.receivedMessageAnchorStyles) === null || _webChatContainerProp16 === void 0 ? void 0 : _webChatContainerProp16.color) ?? (defaultReceivedMessageAnchorStyles === null || defaultReceivedMessageAnchorStyles === void 0 ? void 0 : defaultReceivedMessageAnchorStyles.color)} !important;
+                background-image: none !important;
+                filter: none !important;
+                mask: url("data:image/svg+xml,%3Csvg viewBox='3 3 18 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.2501 4.50017H10.7495C11.1637 4.50017 11.4995 4.83596 11.4995 5.25017C11.4995 5.62986 11.2173 5.94366 10.8513 5.99332L10.7495 6.00017H7.24974C6.07079 5.99961 5.10349 6.90656 5.00786 8.06112L5.00028 8.22003L5.00312 16.7507C5.00343 17.9415 5.92885 18.9161 7.09966 18.9949L7.25371 19.0001L15.7518 18.9884C16.9415 18.9868 17.9145 18.062 17.9935 16.8923L17.9987 16.7384V13.2321C17.9987 12.8179 18.3345 12.4821 18.7487 12.4821C19.1284 12.4821 19.4422 12.7643 19.4918 13.1303L19.4987 13.2321V16.7384C19.4987 18.7407 17.9293 20.3769 15.9528 20.4829L15.7538 20.4884L7.25827 20.5001L7.05495 20.4949C5.14239 20.3954 3.60895 18.8627 3.50837 16.9502L3.50312 16.7511L3.50089 8.2527L3.50529 8.0502C3.60539 6.13749 5.13867 4.60449 7.05096 4.50527L7.2501 4.50017H10.7495H7.2501ZM13.7481 3.00146L20.3018 3.00197L20.4014 3.01575L20.5022 3.04393L20.559 3.06803C20.6122 3.09122 20.6634 3.12163 20.7111 3.15885L20.7804 3.22156L20.8641 3.32014L20.9183 3.41025L20.957 3.50057L20.9762 3.56476L20.9898 3.62862L20.9992 3.72282L20.9997 10.2554C20.9997 10.6696 20.6639 11.0054 20.2497 11.0054C19.87 11.0054 19.5562 10.7232 19.5065 10.3571L19.4997 10.2554L19.4989 5.56147L12.2797 12.7847C12.0134 13.051 11.5968 13.0753 11.3031 12.8575L11.219 12.7849C10.9527 12.5187 10.9284 12.1021 11.1462 11.8084L11.2188 11.7243L18.4369 4.50146H13.7481C13.3684 4.50146 13.0546 4.21931 13.005 3.85324L12.9981 3.75146C12.9981 3.37177 13.2803 3.05797 13.6464 3.00831L13.7481 3.00146Z' fill='currentColor' /%3E%3C/svg%3E") no-repeat center;
+                -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='3 3 18 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.2501 4.50017H10.7495C11.1637 4.50017 11.4995 4.83596 11.4995 5.25017C11.4995 5.62986 11.2173 5.94366 10.8513 5.99332L10.7495 6.00017H7.24974C6.07079 5.99961 5.10349 6.90656 5.00786 8.06112L5.00028 8.22003L5.00312 16.7507C5.00343 17.9415 5.92885 18.9161 7.09966 18.9949L7.25371 19.0001L15.7518 18.9884C16.9415 18.9868 17.9145 18.062 17.9935 16.8923L17.9987 16.7384V13.2321C17.9987 12.8179 18.3345 12.4821 18.7487 12.4821C19.1284 12.4821 19.4422 12.7643 19.4918 13.1303L19.4987 13.2321V16.7384C19.4987 18.7407 17.9293 20.3769 15.9528 20.4829L15.7538 20.4884L7.25827 20.5001L7.05495 20.4949C5.14239 20.3954 3.60895 18.8627 3.50837 16.9502L3.50312 16.7511L3.50089 8.2527L3.50529 8.0502C3.60539 6.13749 5.13867 4.60449 7.05096 4.50527L7.2501 4.50017H10.7495H7.2501ZM13.7481 3.00146L20.3018 3.00197L20.4014 3.01575L20.5022 3.04393L20.559 3.06803C20.6122 3.09122 20.6634 3.12163 20.7111 3.15885L20.7804 3.22156L20.8641 3.32014L20.9183 3.41025L20.957 3.50057L20.9762 3.56476L20.9898 3.62862L20.9992 3.72282L20.9997 10.2554C20.9997 10.6696 20.6639 11.0054 20.2497 11.0054C19.87 11.0054 19.5562 10.7232 19.5065 10.3571L19.4997 10.2554L19.4989 5.56147L12.2797 12.7847C12.0134 13.051 11.5968 13.0753 11.3031 12.8575L11.219 12.7849C10.9527 12.5187 10.9284 12.1021 11.1462 11.8084L11.2188 11.7243L18.4369 4.50146H13.7481C13.3684 4.50146 13.0546 4.21931 13.005 3.85324L12.9981 3.75146C12.9981 3.37177 13.2803 3.05797 13.6464 3.00831L13.7481 3.00146Z' fill='currentColor' /%3E%3C/svg%3E") no-repeat center;
+                mask-size: contain;
+                -webkit-mask-size: contain;
+            }
+            .ms_lcw_webchat_sent_message img.webchat__render-markdown__external-link-icon {
+                background-color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp17 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp17 === void 0 ? void 0 : (_webChatContainerProp18 = _webChatContainerProp17.sentMessageAnchorStyles) === null || _webChatContainerProp18 === void 0 ? void 0 : _webChatContainerProp18.color) ?? (defaultSentMessageAnchorStyles === null || defaultSentMessageAnchorStyles === void 0 ? void 0 : defaultSentMessageAnchorStyles.color)} !important;
+                background-image: none !important;
+                filter: none !important;
+                mask: url("data:image/svg+xml,%3Csvg viewBox='3 3 18 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.2501 4.50017H10.7495C11.1637 4.50017 11.4995 4.83596 11.4995 5.25017C11.4995 5.62986 11.2173 5.94366 10.8513 5.99332L10.7495 6.00017H7.24974C6.07079 5.99961 5.10349 6.90656 5.00786 8.06112L5.00028 8.22003L5.00312 16.7507C5.00343 17.9415 5.92885 18.9161 7.09966 18.9949L7.25371 19.0001L15.7518 18.9884C16.9415 18.9868 17.9145 18.062 17.9935 16.8923L17.9987 16.7384V13.2321C17.9987 12.8179 18.3345 12.4821 18.7487 12.4821C19.1284 12.4821 19.4422 12.7643 19.4918 13.1303L19.4987 13.2321V16.7384C19.4987 18.7407 17.9293 20.3769 15.9528 20.4829L15.7538 20.4884L7.25827 20.5001L7.05495 20.4949C5.14239 20.3954 3.60895 18.8627 3.50837 16.9502L3.50312 16.7511L3.50089 8.2527L3.50529 8.0502C3.60539 6.13749 5.13867 4.60449 7.05096 4.50527L7.2501 4.50017H10.7495H7.2501ZM13.7481 3.00146L20.3018 3.00197L20.4014 3.01575L20.5022 3.04393L20.559 3.06803C20.6122 3.09122 20.6634 3.12163 20.7111 3.15885L20.7804 3.22156L20.8641 3.32014L20.9183 3.41025L20.957 3.50057L20.9762 3.56476L20.9898 3.62862L20.9992 3.72282L20.9997 10.2554C20.9997 10.6696 20.6639 11.0054 20.2497 11.0054C19.87 11.0054 19.5562 10.7232 19.5065 10.3571L19.4997 10.2554L19.4989 5.56147L12.2797 12.7847C12.0134 13.051 11.5968 13.0753 11.3031 12.8575L11.219 12.7849C10.9527 12.5187 10.9284 12.1021 11.1462 11.8084L11.2188 11.7243L18.4369 4.50146H13.7481C13.3684 4.50146 13.0546 4.21931 13.005 3.85324L12.9981 3.75146C12.9981 3.37177 13.2803 3.05797 13.6464 3.00831L13.7481 3.00146Z' fill='currentColor' /%3E%3C/svg%3E") no-repeat center;
+                -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='3 3 18 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.2501 4.50017H10.7495C11.1637 4.50017 11.4995 4.83596 11.4995 5.25017C11.4995 5.62986 11.2173 5.94366 10.8513 5.99332L10.7495 6.00017H7.24974C6.07079 5.99961 5.10349 6.90656 5.00786 8.06112L5.00028 8.22003L5.00312 16.7507C5.00343 17.9415 5.92885 18.9161 7.09966 18.9949L7.25371 19.0001L15.7518 18.9884C16.9415 18.9868 17.9145 18.062 17.9935 16.8923L17.9987 16.7384V13.2321C17.9987 12.8179 18.3345 12.4821 18.7487 12.4821C19.1284 12.4821 19.4422 12.7643 19.4918 13.1303L19.4987 13.2321V16.7384C19.4987 18.7407 17.9293 20.3769 15.9528 20.4829L15.7538 20.4884L7.25827 20.5001L7.05495 20.4949C5.14239 20.3954 3.60895 18.8627 3.50837 16.9502L3.50312 16.7511L3.50089 8.2527L3.50529 8.0502C3.60539 6.13749 5.13867 4.60449 7.05096 4.50527L7.2501 4.50017H10.7495H7.2501ZM13.7481 3.00146L20.3018 3.00197L20.4014 3.01575L20.5022 3.04393L20.559 3.06803C20.6122 3.09122 20.6634 3.12163 20.7111 3.15885L20.7804 3.22156L20.8641 3.32014L20.9183 3.41025L20.957 3.50057L20.9762 3.56476L20.9898 3.62862L20.9992 3.72282L20.9997 10.2554C20.9997 10.6696 20.6639 11.0054 20.2497 11.0054C19.87 11.0054 19.5562 10.7232 19.5065 10.3571L19.4997 10.2554L19.4989 5.56147L12.2797 12.7847C12.0134 13.051 11.5968 13.0753 11.3031 12.8575L11.219 12.7849C10.9527 12.5187 10.9284 12.1021 11.1462 11.8084L11.2188 11.7243L18.4369 4.50146H13.7481C13.3684 4.50146 13.0546 4.21931 13.005 3.85324L12.9981 3.75146C12.9981 3.37177 13.2803 3.05797 13.6464 3.00831L13.7481 3.00146Z' fill='currentColor' /%3E%3C/svg%3E") no-repeat center;
+                mask-size: contain;
+                -webkit-mask-size: contain;
+            }
         }
         pre {
-            white-space: pre-wrap;
-            white-space: -moz-pre-wrap;
             white-space: -pre-wrap;
             white-space: -o-pre-wrap;
             word-wrap: break-word;
@@ -224,18 +262,18 @@ export const WebChatContainerStateful = props => {
         .ms_lcw_webchat_received_message a:visited,
         .ms_lcw_webchat_received_message a:hover,
         .ms_lcw_webchat_received_message a:active {
-            color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp12 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp12 === void 0 ? void 0 : (_webChatContainerProp13 = _webChatContainerProp12.receivedMessageAnchorStyles) === null || _webChatContainerProp13 === void 0 ? void 0 : _webChatContainerProp13.color) ?? (defaultReceivedMessageAnchorStyles === null || defaultReceivedMessageAnchorStyles === void 0 ? void 0 : defaultReceivedMessageAnchorStyles.color)};
+            color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp19 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp19 === void 0 ? void 0 : (_webChatContainerProp20 = _webChatContainerProp19.receivedMessageAnchorStyles) === null || _webChatContainerProp20 === void 0 ? void 0 : _webChatContainerProp20.color) ?? (defaultReceivedMessageAnchorStyles === null || defaultReceivedMessageAnchorStyles === void 0 ? void 0 : defaultReceivedMessageAnchorStyles.color)};
         }
         .ms_lcw_webchat_sent_message a:link,
         .ms_lcw_webchat_sent_message a:visited,
         .ms_lcw_webchat_sent_message a:hover,
         .ms_lcw_webchat_sent_message a:active {
-            color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp14 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp14 === void 0 ? void 0 : (_webChatContainerProp15 = _webChatContainerProp14.sentMessageAnchorStyles) === null || _webChatContainerProp15 === void 0 ? void 0 : _webChatContainerProp15.color) ?? (defaultSentMessageAnchorStyles === null || defaultSentMessageAnchorStyles === void 0 ? void 0 : defaultSentMessageAnchorStyles.color)};
+            color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp21 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp21 === void 0 ? void 0 : (_webChatContainerProp22 = _webChatContainerProp21.sentMessageAnchorStyles) === null || _webChatContainerProp22 === void 0 ? void 0 : _webChatContainerProp22.color) ?? (defaultSentMessageAnchorStyles === null || defaultSentMessageAnchorStyles === void 0 ? void 0 : defaultSentMessageAnchorStyles.color)};
         }
         // we had a nasty bug long time ago with crashing borders messing with the sendbox, so if customer adds this value, they need to deal with that
         .webchat__bubble:not(.webchat__bubble--from-user) .webchat__bubble__content {
-            border-radius: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp16 = webChatContainerProps.webChatStyles) === null || _webChatContainerProp16 === void 0 ? void 0 : _webChatContainerProp16.bubbleBorderRadius) ?? 0} !important; /* Override border-radius */
+            border-radius: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp23 = webChatContainerProps.webChatStyles) === null || _webChatContainerProp23 === void 0 ? void 0 : _webChatContainerProp23.bubbleBorderRadius) ?? 0} !important; /* Override border-radius */
         }
         .webchat__stacked-layout_container>div {

package/lib/esm/components/webchatcontainerstateful/webchatcontroller/middlewares/storemiddlewares/channelDataMiddleware.js CHANGED Viewed

@@ -7,15 +7,14 @@
 import { Constants } from "../../../../../common/Constants";
 import { DeliveryMode } from "@microsoft/omnichannel-chat-sdk";
 import { WebChatActionType } from "../../enums/WebChatActionType";
 // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unused-vars
-const channelDataMiddleware = _ref => {
+const channelDataMiddleware = addConversationalSurveyTagsCallback => _ref => {
   let {
     dispatch
   } = _ref;
   return next => action => {
-    var _action$payload, _action$payload$activ;
-    if ((action === null || action === void 0 ? void 0 : action.type) === WebChatActionType.DIRECT_LINE_POST_ACTIVITY_PENDING && action !== null && action !== void 0 && (_action$payload = action.payload) !== null && _action$payload !== void 0 && (_action$payload$activ = _action$payload.activity) !== null && _action$payload$activ !== void 0 && _action$payload$activ.channelData) {
+    var _action, _action2, _action2$payload, _action2$payload$acti;
+    if (((_action = action) === null || _action === void 0 ? void 0 : _action.type) === WebChatActionType.DIRECT_LINE_POST_ACTIVITY_PENDING && (_action2 = action) !== null && _action2 !== void 0 && (_action2$payload = _action2.payload) !== null && _action2$payload !== void 0 && (_action2$payload$acti = _action2$payload.activity) !== null && _action2$payload$acti !== void 0 && _action2$payload$acti.channelData) {
       const channelIdTag = `${Constants.channelIdKey}${Constants.ChannelId}`;
       const customerMessageTag = `${Constants.CustomerTag}`;
       if (action.payload.activity.channelData.tags) {
@@ -29,6 +28,7 @@ const channelDataMiddleware = _ref => {
         action.payload.activity.channelData.tags = [channelIdTag];
         action.payload.activity.channelData.tags.push(customerMessageTag);
       }
+      action = addConversationalSurveyTagsCallback(action);
       action.payload.activity.channelData.metadata = {
         deliveryMode: DeliveryMode.Bridged
       };

package/lib/esm/components/webchatcontainerstateful/webchatcontroller/middlewares/storemiddlewares/conversationEndMiddleware.js CHANGED Viewed

@@ -11,27 +11,33 @@ import { MessageTypes } from "../../enums/MessageType";
 import { WebChatActionType } from "../../enums/WebChatActionType";
 // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unused-vars
-const createConversationEndMiddleware = conversationEndCallback => _ref => {
+const createConversationEndMiddleware = (conversationEndCallback, startConversationalSurveyCallback, endConversationalSurveyCallback) => _ref => {
   let {
     dispatch
   } = _ref;
   return next => action => {
     var _action$payload;
     if ((action === null || action === void 0 ? void 0 : action.type) == WebChatActionType.DIRECT_LINE_INCOMING_ACTIVITY && (_action$payload = action.payload) !== null && _action$payload !== void 0 && _action$payload.activity) {
-      var _activity$from2, _activity$channelData7, _activity$channelData8;
+      var _activity$from2, _activity$channelData17, _activity$channelData18;
       const activity = action.payload.activity;
       if (activity.channelId === "ACS_CHANNEL") {
         var _activity$from;
         if (((_activity$from = activity.from) === null || _activity$from === void 0 ? void 0 : _activity$from.role) === DirectLineSenderRole.Bot) {
-          var _activity$channelData, _activity$channelData2, _activity$channelData3, _activity$channelData4, _activity$channelData5, _activity$channelData6;
+          var _activity$channelData, _activity$channelData2, _activity$channelData3, _activity$channelData4, _activity$channelData5, _activity$channelData6, _activity$channelData7, _activity$channelData8, _activity$channelData9, _activity$channelData10, _activity$channelData11, _activity$channelData12, _activity$channelData13, _activity$channelData14, _activity$channelData15, _activity$channelData16;
           if ((_activity$channelData = activity.channelData) !== null && _activity$channelData !== void 0 && (_activity$channelData2 = _activity$channelData.tags) !== null && _activity$channelData2 !== void 0 && _activity$channelData2.includes(Constants.systemMessageTag) && ((_activity$channelData3 = activity.channelData) !== null && _activity$channelData3 !== void 0 && (_activity$channelData4 = _activity$channelData3.tags) !== null && _activity$channelData4 !== void 0 && _activity$channelData4.includes(Constants.agentEndConversationMessageTag) || (_activity$channelData5 = activity.channelData) !== null && _activity$channelData5 !== void 0 && (_activity$channelData6 = _activity$channelData5.tags) !== null && _activity$channelData6 !== void 0 && _activity$channelData6.includes(Constants.supervisorForceCloseMessageTag))) {
             conversationEndCallback();
           }
+          if ((_activity$channelData7 = activity.channelData) !== null && _activity$channelData7 !== void 0 && (_activity$channelData8 = _activity$channelData7.tags) !== null && _activity$channelData8 !== void 0 && _activity$channelData8.includes(Constants.systemMessageTag) && ((_activity$channelData9 = activity.channelData) !== null && _activity$channelData9 !== void 0 && (_activity$channelData10 = _activity$channelData9.tags) !== null && _activity$channelData10 !== void 0 && _activity$channelData10.includes(Constants.startConversationalSurveyMessageTag) || (_activity$channelData11 = activity.channelData) !== null && _activity$channelData11 !== void 0 && (_activity$channelData12 = _activity$channelData11.tags) !== null && _activity$channelData12 !== void 0 && _activity$channelData12.includes(Constants.startConversationalSurveyMessageTag))) {
+            startConversationalSurveyCallback();
+          }
+          if ((_activity$channelData13 = activity.channelData) !== null && _activity$channelData13 !== void 0 && (_activity$channelData14 = _activity$channelData13.tags) !== null && _activity$channelData14 !== void 0 && _activity$channelData14.includes(Constants.systemMessageTag) && (_activity$channelData15 = activity.channelData) !== null && _activity$channelData15 !== void 0 && (_activity$channelData16 = _activity$channelData15.tags) !== null && _activity$channelData16 !== void 0 && _activity$channelData16.includes(Constants.endConversationalSurveyMessageTag)) {
+            endConversationalSurveyCallback();
+          }
         }
-      } else if (((_activity$from2 = activity.from) === null || _activity$from2 === void 0 ? void 0 : _activity$from2.role) === DirectLineSenderRole.Channel && ((_activity$channelData7 = activity.channelData) === null || _activity$channelData7 === void 0 ? void 0 : _activity$channelData7.type) === MessageTypes.Thread && (_activity$channelData8 = activity.channelData) !== null && _activity$channelData8 !== void 0 && _activity$channelData8.properties) {
-        var _activity$channelData9, _activity$channelData10, _activity$channelData11, _activity$channelData12;
+      } else if (((_activity$from2 = activity.from) === null || _activity$from2 === void 0 ? void 0 : _activity$from2.role) === DirectLineSenderRole.Channel && ((_activity$channelData17 = activity.channelData) === null || _activity$channelData17 === void 0 ? void 0 : _activity$channelData17.type) === MessageTypes.Thread && (_activity$channelData18 = activity.channelData) !== null && _activity$channelData18 !== void 0 && _activity$channelData18.properties) {
+        var _activity$channelData19, _activity$channelData20, _activity$channelData21, _activity$channelData22;
         // IC3
-        if (((_activity$channelData9 = activity.channelData) === null || _activity$channelData9 === void 0 ? void 0 : (_activity$channelData10 = _activity$channelData9.properties) === null || _activity$channelData10 === void 0 ? void 0 : _activity$channelData10.isdeleted) === Constants.truePascal || !((_activity$channelData11 = activity.channelData) !== null && _activity$channelData11 !== void 0 && (_activity$channelData12 = _activity$channelData11.properties) !== null && _activity$channelData12 !== void 0 && _activity$channelData12.containsExternalEntitiesListeningAll)) {
+        if (((_activity$channelData19 = activity.channelData) === null || _activity$channelData19 === void 0 ? void 0 : (_activity$channelData20 = _activity$channelData19.properties) === null || _activity$channelData20 === void 0 ? void 0 : _activity$channelData20.isdeleted) === Constants.truePascal || !((_activity$channelData21 = activity.channelData) !== null && _activity$channelData21 !== void 0 && (_activity$channelData22 = _activity$channelData21.properties) !== null && _activity$channelData22 !== void 0 && _activity$channelData22.containsExternalEntitiesListeningAll)) {
           conversationEndCallback();
         }
       }

package/lib/esm/components/webchatcontainerstateful/webchatcontroller/middlewares/storemiddlewares/queueOverflowHandlerMiddleware.js ADDED Viewed

@@ -0,0 +1,38 @@
+import { WebChatActionType } from "../../enums/WebChatActionType";
+import { LogLevel, TelemetryEvent } from "../../../../../common/telemetry/TelemetryConstants";
+import { TelemetryHelper } from "../../../../../common/telemetry/TelemetryHelper";
+import { LiveChatWidgetActionType } from "../../../../../contexts/common/LiveChatWidgetActionType";
+import { executeReducer } from "../../../../../contexts/createReducer";
+import { isEndConversationDueToOverflowActivity } from "../../../../../common/utils";
+const queueOverflowHandlingHelper = async (state, dispatch) => {
+  const {
+    appStates
+  } = executeReducer(state, {
+    type: LiveChatWidgetActionType.GET_IN_MEMORY_STATE,
+    payload: undefined
+  });
+  if (!appStates.chatDisconnectEventReceived) {
+    dispatch({
+      type: LiveChatWidgetActionType.SET_CHAT_DISCONNECT_EVENT_RECEIVED,
+      payload: true
+    });
+    TelemetryHelper.logActionEvent(LogLevel.INFO, {
+      Event: TelemetryEvent.QueueOverflowEvent,
+      Description: "Set chat disconnect event received."
+    });
+  }
+};
+export const createQueueOverflowMiddleware = (state, dispatch) => () => next => action => {
+  var _action$payload;
+  if ((action === null || action === void 0 ? void 0 : action.type) == WebChatActionType.DIRECT_LINE_INCOMING_ACTIVITY && (_action$payload = action.payload) !== null && _action$payload !== void 0 && _action$payload.activity) {
+    const activity = action.payload.activity;
+    if (isEndConversationDueToOverflowActivity(activity)) {
+      TelemetryHelper.logActionEvent(LogLevel.INFO, {
+        Event: TelemetryEvent.QueueOverflowEvent,
+        Description: "Queue overflow event received."
+      });
+      queueOverflowHandlingHelper(state, dispatch);
+    }
+  }
+  return next(action);
+};

package/lib/esm/contexts/common/LiveChatWidgetActionType.js CHANGED Viewed

@@ -45,5 +45,7 @@ export let LiveChatWidgetActionType;
   LiveChatWidgetActionType[LiveChatWidgetActionType["SET_SURVEY_MODE"] = 42] = "SET_SURVEY_MODE";
   LiveChatWidgetActionType[LiveChatWidgetActionType["SET_CONFIRMATION_STATE"] = 43] = "SET_CONFIRMATION_STATE";
   LiveChatWidgetActionType[LiveChatWidgetActionType["SET_POST_CHAT_PARTICIPANT_TYPE"] = 44] = "SET_POST_CHAT_PARTICIPANT_TYPE";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["GET_IN_MEMORY_STATE"] = 45] = "GET_IN_MEMORY_STATE";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_CONVERSATIONAL_SURVEY_ENABLED"] = 45] = "SET_CONVERSATIONAL_SURVEY_ENABLED";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_CONVERSATIONAL_SURVEY_DISPLAY"] = 46] = "SET_CONVERSATIONAL_SURVEY_DISPLAY";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["GET_IN_MEMORY_STATE"] = 47] = "GET_IN_MEMORY_STATE";
 })(LiveChatWidgetActionType || (LiveChatWidgetActionType = {}));

package/lib/esm/contexts/common/LiveChatWidgetContextInitialState.js CHANGED Viewed

@@ -77,7 +77,9 @@ export const getLiveChatWidgetContextInitialState = props => {
       conversationEndedBy: ConversationEndEntity.NotSet,
       chatDisconnectEventReceived: false,
       selectedSurveyMode: null,
-      postChatParticipantType: undefined
+      postChatParticipantType: undefined,
+      isConversationalSurvey: false,
+      isConversationalSurveyEnabled: false
     },
     uiStates: {
       showConfirmationPane: false,

package/lib/esm/contexts/createReducer.js CHANGED Viewed

@@ -648,6 +648,36 @@ const reducer = (state, action) => {
           postChatParticipantType: action.payload
         }
       };
+    case LiveChatWidgetActionType.SET_CONVERSATIONAL_SURVEY_ENABLED:
+      inMemory = {
+        ...inMemory,
+        appStates: {
+          ...inMemory.appStates,
+          isConversationalSurveyEnabled: action.payload
+        }
+      };
+      return {
+        ...state,
+        appStates: {
+          ...state.appStates,
+          isConversationalSurveyEnabled: action.payload
+        }
+      };
+    case LiveChatWidgetActionType.SET_CONVERSATIONAL_SURVEY_DISPLAY:
+      inMemory = {
+        ...inMemory,
+        appStates: {
+          ...inMemory.appStates,
+          isConversationalSurvey: action.payload
+        }
+      };
+      return {
+        ...state,
+        appStates: {
+          ...state.appStates,
+          isConversationalSurvey: action.payload
+        }
+      };
     case LiveChatWidgetActionType.GET_IN_MEMORY_STATE:
       return inMemory;
     default: