@microsoft/omnichannel-chat-widget 1.8.4-main.7bdb634 → 1.8.4-main.c687f88

package/lib/cjs/components/postchatsurveypanestateful/PostChatSurveyPaneStateful.js

@@ -18,6 +18,7 @@ var _isValidSurveyUrl = _interopRequireDefault(require("./common/isValidSurveyUr
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 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; }
+let uiTimer;
 const generateSurveyInviteLink = function (surveyInviteLink, isEmbed, locale, compact, customerVoiceSurveyCorrelationId) {
   let showMultiLingual = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : false;
   const surveyLinkParams = new URLSearchParams({
@@ -30,20 +31,32 @@ const generateSurveyInviteLink = function (surveyInviteLink, isEmbed, locale, co
   return `${surveyInviteLink}&${surveyLinkParams.toString()}`;
 };
 const PostChatSurveyPaneStateful = props => {
-  var _props$styleProps, _state$appStates, _props$controlProps;
+  var _props$styleProps, _state$appStates, _state$domainStates$p, _props$controlProps;
+  (0, _react.useEffect)(() => {
+    uiTimer = (0, _utils.createTimer)();
+    _TelemetryHelper.TelemetryHelper.logLoadingEventToAllTelemetry(_TelemetryConstants.LogLevel.INFO, {
+      Event: _TelemetryConstants.TelemetryEvent.UXPostChatPaneStarted,
+      Description: "Postchat survey pane loading started.",
+      CustomProperties: {
+        ConversationStage: _TelemetryConstants.ConversationStage.ConversationEnd
+      }
+    });
+  }, []);
   const [state] = (0, _useChatContextStore.default)();
   const generalStyleProps = Object.assign({}, _defaultgeneralPostChatSurveyPaneStyleProps.defaultGeneralPostChatSurveyPaneStyleProps, (_props$styleProps = props.styleProps) === null || _props$styleProps === void 0 ? void 0 : _props$styleProps.generalStyleProps, {
     display: state.appStates.isMinimized ? "none" : "contents"
   });
   let surveyInviteLink = "";
   const surveyMode = (state === null || state === void 0 ? void 0 : (_state$appStates = state.appStates) === null || _state$appStates === void 0 ? void 0 : _state$appStates.selectedSurveyMode) === _PostChatSurveyMode.PostChatSurveyMode.Embed;
-  if (state.domainStates.postChatContext.botSurveyInviteLink &&
+  if ((_state$domainStates$p = state.domainStates.postChatContext) !== null && _state$domainStates$p !== void 0 && _state$domainStates$p.botSurveyInviteLink &&
   // Bot survey enabled
   state.appStates.postChatParticipantType === _Constants.ParticipantType.Bot) {
+    var _state$domainStates$p2, _state$domainStates$p3;
     // Only Bot has engaged
-    surveyInviteLink = generateSurveyInviteLink(state.domainStates.postChatContext.botSurveyInviteLink, surveyMode, state.domainStates.postChatContext.botFormsProLocale, props.isCustomerVoiceSurveyCompact ?? true, props.customerVoiceSurveyCorrelationId || "");
+    surveyInviteLink = generateSurveyInviteLink((_state$domainStates$p2 = state.domainStates.postChatContext) === null || _state$domainStates$p2 === void 0 ? void 0 : _state$domainStates$p2.botSurveyInviteLink, surveyMode, (_state$domainStates$p3 = state.domainStates.postChatContext) === null || _state$domainStates$p3 === void 0 ? void 0 : _state$domainStates$p3.botFormsProLocale, props.isCustomerVoiceSurveyCompact ?? true, props.customerVoiceSurveyCorrelationId || "");
   } else {
-    surveyInviteLink = generateSurveyInviteLink(state.domainStates.postChatContext.surveyInviteLink, surveyMode, state.domainStates.postChatContext.formsProLocale, props.isCustomerVoiceSurveyCompact ?? true, props.customerVoiceSurveyCorrelationId || "");
+    var _state$domainStates$p4, _state$domainStates$p5;
+    surveyInviteLink = generateSurveyInviteLink((_state$domainStates$p4 = state.domainStates.postChatContext) === null || _state$domainStates$p4 === void 0 ? void 0 : _state$domainStates$p4.surveyInviteLink, surveyMode, (_state$domainStates$p5 = state.domainStates.postChatContext) === null || _state$domainStates$p5 === void 0 ? void 0 : _state$domainStates$p5.formsProLocale, props.isCustomerVoiceSurveyCompact ?? true, props.customerVoiceSurveyCorrelationId || "");
   }
   if (props.copilotSurveyContext) {
     surveyInviteLink = `${surveyInviteLink}&mcs_additionalcontext=${JSON.stringify(props.copilotSurveyContext)}`;
@@ -81,7 +94,14 @@ const PostChatSurveyPaneStateful = props => {
     _TelemetryHelper.TelemetryHelper.logLoadingEvent(_TelemetryConstants.LogLevel.INFO, {
       Event: _TelemetryConstants.TelemetryEvent.PostChatSurveyLoaded
     });
-
+    _TelemetryHelper.TelemetryHelper.logLoadingEventToAllTelemetry(_TelemetryConstants.LogLevel.INFO, {
+      Event: _TelemetryConstants.TelemetryEvent.UXPostChatPaneCompleted,
+      ElapsedTimeInMilliseconds: uiTimer.milliSecondsElapsed,
+      Description: "Postchat survey pane loading completed.",
+      CustomProperties: {
+        ConversationStage: _TelemetryConstants.ConversationStage.ConversationEnd
+      }
+    });
     //Customer Voice Telemetry Events
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     window.addEventListener("message", message => {
@@ -94,16 +114,22 @@ const PostChatSurveyPaneStateful = props => {
           Event: _TelemetryConstants.TelemetryEvent.CustomerVoiceResponsePageLoaded
         });
       } else if (data === _CustomerVoiceEvents.CustomerVoiceEvents.FormResponseSubmitted) {
-        _TelemetryHelper.TelemetryHelper.logActionEventToAllTelemetry(_TelemetryConstants.LogLevel.INFO, {
+        _TelemetryHelper.TelemetryHelper.logActionEvent(_TelemetryConstants.LogLevel.INFO, {
           Event: _TelemetryConstants.TelemetryEvent.CustomerVoiceFormResponseSubmitted,
-          Description: "Customer Voice form response submitted."
+          Description: "Customer Voice form response submitted.",
+          CustomProperties: {
+            ConversationStage: _TelemetryConstants.ConversationStage.ConversationEnd
+          }
         });
       } else if (data === _CustomerVoiceEvents.CustomerVoiceEvents.FormResponseError) {
-        _TelemetryHelper.TelemetryHelper.logActionEventToAllTelemetry(_TelemetryConstants.LogLevel.ERROR, {
+        _TelemetryHelper.TelemetryHelper.logActionEvent(_TelemetryConstants.LogLevel.ERROR, {
           Event: _TelemetryConstants.TelemetryEvent.CustomerVoiceFormResponseError,
           Description: "Customer Voice form response error.",
           ExceptionDetails: {
             message: "Customer Voice form response error."
+          },
+          CustomProperties: {
+            ConversationStage: _TelemetryConstants.ConversationStage.ConversationEnd
           }
         });
       } else if (typeof data === "string" && data.startsWith(_CustomerVoiceEvents.CustomerVoiceEvents.FormsError)) {
@@ -112,6 +138,9 @@ const PostChatSurveyPaneStateful = props => {
           Description: "Customer Voice failed to load with forms error.",
           ExceptionDetails: {
             message: `Customer Voice forms error details: ${data}`
+          },
+          CustomProperties: {
+            ConversationStage: _TelemetryConstants.ConversationStage.ConversationEnd
           }
         });
       }

package/lib/cjs/components/prechatsurveypanestateful/PreChatSurveyPaneStateful.js

@@ -28,7 +28,10 @@ const PreChatSurveyPaneStateful = props => {
     uiTimer = (0, _utils.createTimer)();
     _TelemetryHelper.TelemetryHelper.logLoadingEventToAllTelemetry(_TelemetryConstants.LogLevel.INFO, {
       Event: _TelemetryConstants.TelemetryEvent.UXPrechatPaneStart,
-      Description: "Prechat survey pane loading started."
+      Description: "Prechat survey pane loading started.",
+      CustomProperties: {
+        ConversationStage: _TelemetryConstants.ConversationStage.Initialization
+      }
     });
   }, []);
 
@@ -79,7 +82,10 @@ const PreChatSurveyPaneStateful = props => {
     onSubmit: async values => {
       _TelemetryHelper.TelemetryHelper.logActionEventToAllTelemetry(_TelemetryConstants.LogLevel.INFO, {
         Event: _TelemetryConstants.TelemetryEvent.PrechatSubmitted,
-        Description: "Prechat survey submitted."
+        Description: "Prechat survey submitted.",
+        CustomProperties: {
+          ConversationStage: _TelemetryConstants.ConversationStage.Initialization
+        }
       });
       dispatch({
         type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE,
@@ -153,7 +159,10 @@ const PreChatSurveyPaneStateful = props => {
     _TelemetryHelper.TelemetryHelper.logLoadingEventToAllTelemetry(_TelemetryConstants.LogLevel.INFO, {
       Event: _TelemetryConstants.TelemetryEvent.UXPrechatPaneCompleted,
       ElapsedTimeInMilliseconds: uiTimer.milliSecondsElapsed,
-      Description: "Prechat survey pane loading completed."
+      Description: "Prechat survey pane loading completed.",
+      CustomProperties: {
+        ConversationStage: _TelemetryConstants.ConversationStage.Initialization
+      }
     });
   }, []);
 

package/lib/cjs/components/webchatcontainerstateful/WebChatContainerStateful.js

@@ -62,7 +62,7 @@ const createMagicCodeSuccessResponse = signin => {
   };
 };
 const WebChatContainerStateful = props => {
-  var _props$webChatContain, _defaultWebChatContai, _extendedChatConfig$L, _props$persistentChat, _extendedChatConfig$L2, _extendedChatConfig$L3, _webChatContainerProp, _webChatContainerProp2, _webChatContainerProp3, _webChatContainerProp4, _webChatContainerProp5, _webChatContainerProp6, _webChatContainerProp7, _webChatContainerProp8, _props$webChatContain6, _props$webChatContain7, _defaultWebChatContai2, _props$webChatContain8, _props$webChatContain9, _defaultWebChatContai3, _webChatContainerProp9, _webChatContainerProp10, _webChatContainerProp11, _webChatContainerProp12, _webChatContainerProp13, _webChatContainerProp14, _webChatContainerProp15, _webChatContainerProp16, _webChatContainerProp17, _webChatContainerProp18, _webChatContainerProp19, _webChatContainerProp20, _webChatContainerProp21, _webChatContainerProp22, _webChatContainerProp23, _props$webChatContain10, _props$webChatContain11, _webChatContainerProp24, _webChatContainerProp25, _webChatContainerProp26, _webChatContainerProp27, _props$persistentChat2, _props$citationPanePr, _props$citationPanePr2, _props$citationPanePr3, _props$citationPanePr4, _props$citationPanePr5;
+  var _props$webChatContain, _defaultWebChatContai, _webChatContainerProp, _webChatContainerProp2, _webChatContainerProp3, _webChatContainerProp4, _webChatContainerProp5, _webChatContainerProp6, _webChatContainerProp7, _webChatContainerProp8, _webChatContainerProp9, _props$webChatContain6, _props$webChatContain7, _defaultWebChatContai2, _props$webChatContain8, _props$webChatContain9, _defaultWebChatContai3, _webChatContainerProp10, _webChatContainerProp11, _webChatContainerProp12, _webChatContainerProp13, _webChatContainerProp14, _webChatContainerProp15, _webChatContainerProp16, _webChatContainerProp17, _webChatContainerProp18, _webChatContainerProp19, _webChatContainerProp20, _webChatContainerProp21, _webChatContainerProp22, _webChatContainerProp23, _webChatContainerProp24, _props$webChatContain10, _props$webChatContain11, _webChatContainerProp25, _webChatContainerProp26, _webChatContainerProp27, _webChatContainerProp28, _props$citationPanePr, _props$citationPanePr2, _props$citationPanePr3, _props$citationPanePr4, _props$citationPanePr5;
   const [facadeChatSDK] = (0, _useFacadeChatSDKStore.default)();
 
   // Create a font family that includes emoji support, based on the primary font or default
@@ -96,17 +96,13 @@ const WebChatContainerStateful = props => {
 
   // Type the chatConfig properly to avoid 'any' usage
   const extendedChatConfig = props.chatConfig;
-  const isHistoryEnabledInConfig = extendedChatConfig === null || extendedChatConfig === void 0 ? void 0 : (_extendedChatConfig$L = extendedChatConfig.LcwFcbConfiguration) === null || _extendedChatConfig$L === void 0 ? void 0 : _extendedChatConfig$L.lcwPersistentChatHistoryEnabled;
-  const isHistoryEnabledViaProps = props === null || props === void 0 ? void 0 : (_props$persistentChat = props.persistentChatHistoryProps) === null || _props$persistentChat === void 0 ? void 0 : _props$persistentChat.persistentChatHistoryEnabled;
-  const isPersistentChatEnabledForWidget = !!(extendedChatConfig !== null && extendedChatConfig !== void 0 && (_extendedChatConfig$L2 = extendedChatConfig.LiveChatConfigAuthSettings) !== null && _extendedChatConfig$L2 !== void 0 && _extendedChatConfig$L2.msdyn_javascriptclientfunction) || (0, _liveChatConfigUtils.isPersistentChatEnabled)(extendedChatConfig === null || extendedChatConfig === void 0 ? void 0 : (_extendedChatConfig$L3 = extendedChatConfig.LiveWSAndLiveChatEngJoin) === null || _extendedChatConfig$L3 === void 0 ? void 0 : _extendedChatConfig$L3.msdyn_conversationmode);
 
-  // Persistent chat history is enabled if explicitly set via props, or if enabled in config
-  // Props take precedence over config settings
-  const isPersistentHistoryEnabled = isHistoryEnabledViaProps || isHistoryEnabledInConfig;
-
-  // Check if both persistent chat and widget support are enabled
-  const shouldLoadPersistentHistoryMessages = isPersistentHistoryEnabled && isPersistentChatEnabledForWidget;
+  // Determine if persistent chat history should be loaded based on all conditions
+  const shouldLoadPersistentHistoryMessages = (0, _liveChatConfigUtils.shouldLoadPersistentChatHistory)(extendedChatConfig);
   if (shouldLoadPersistentHistoryMessages) {
+    _TelemetryHelper.TelemetryHelper.logLoadingEvent(_TelemetryConstants.LogLevel.INFO, {
+      Event: _TelemetryConstants.TelemetryEvent.PersistentChatHistoryEnabled
+    });
     (0, _usePersistentChatHistory.default)(facadeChatSDK, (props === null || props === void 0 ? void 0 : props.persistentChatHistoryProps) ?? {});
   }
   // Delegated click handler for citation anchors. Placed after state is
@@ -271,24 +267,28 @@ const WebChatContainerStateful = props => {
             background: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp === void 0 ? void 0 : _webChatContainerProp.background) ?? _defaultAdaptiveCardStyles.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.defaultAdaptiveCardStyles.color};
+        .webchat__bubble__content>div#ms_lcw_webchat_adaptive_card .ac-textBlock[role=heading] {
+            color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp2 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp2 === void 0 ? void 0 : _webChatContainerProp2.color) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.color}  !important;
+        }
+
+        .webchat__bubble__content>div#ms_lcw_webchat_adaptive_card label .ac-textRun:first-child {
+            color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp3 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp3 === void 0 ? void 0 : _webChatContainerProp3.color) ?? _defaultAdaptiveCardStyles.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 : (_webChatContainerProp3 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp3 === void 0 ? void 0 : (_webChatContainerProp4 = _webChatContainerProp3.userMessageBoxStyles) === null || _webChatContainerProp4 === void 0 ? void 0 : _webChatContainerProp4.maxWidth) ?? (_defaultUserMessageBoxStyles.defaultUserMessageBoxStyles === null || _defaultUserMessageBoxStyles.defaultUserMessageBoxStyles === void 0 ? void 0 : _defaultUserMessageBoxStyles.defaultUserMessageBoxStyles.maxWidth)}
+            max-width: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp4 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp4 === void 0 ? void 0 : (_webChatContainerProp5 = _webChatContainerProp4.userMessageBoxStyles) === null || _webChatContainerProp5 === void 0 ? void 0 : _webChatContainerProp5.maxWidth) ?? (_defaultUserMessageBoxStyles.defaultUserMessageBoxStyles === null || _defaultUserMessageBoxStyles.defaultUserMessageBoxStyles === void 0 ? void 0 : _defaultUserMessageBoxStyles.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 : (_webChatContainerProp5 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp5 === void 0 ? void 0 : (_webChatContainerProp6 = _webChatContainerProp5.systemMessageBoxStyles) === null || _webChatContainerProp6 === void 0 ? void 0 : _webChatContainerProp6.maxWidth) ?? (_defaultSystemMessageBoxStyles.defaultSystemMessageBoxStyles === null || _defaultSystemMessageBoxStyles.defaultSystemMessageBoxStyles === void 0 ? void 0 : _defaultSystemMessageBoxStyles.defaultSystemMessageBoxStyles.maxWidth)}
+            max-width: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp6 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp6 === void 0 ? void 0 : (_webChatContainerProp7 = _webChatContainerProp6.systemMessageBoxStyles) === null || _webChatContainerProp7 === void 0 ? void 0 : _webChatContainerProp7.maxWidth) ?? (_defaultSystemMessageBoxStyles.defaultSystemMessageBoxStyles === null || _defaultSystemMessageBoxStyles.defaultSystemMessageBoxStyles === void 0 ? void 0 : _defaultSystemMessageBoxStyles.defaultSystemMessageBoxStyles.maxWidth)}
         }
 
         div[class="ac-textBlock"] *,
-        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.defaultAdaptiveCardStyles.textWhiteSpace}}
+        div[class="ac-input-container"] * {white-space:${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp8 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp8 === void 0 ? void 0 : _webChatContainerProp8.textWhiteSpace) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.textWhiteSpace}}
 
         div[class="ac-input-container"] input.ac-multichoiceInput,
         div[class="ac-input-container"] select.ac-multichoiceInput {
-            ${webChatContainerProps !== null && webChatContainerProps !== void 0 && (_webChatContainerProp8 = webChatContainerProps.adaptiveCardStyles) !== null && _webChatContainerProp8 !== void 0 && _webChatContainerProp8.choiceInputPadding ? `padding: ${webChatContainerProps.adaptiveCardStyles.choiceInputPadding} !important;` : ""}
+            ${webChatContainerProps !== null && webChatContainerProps !== void 0 && (_webChatContainerProp9 = webChatContainerProps.adaptiveCardStyles) !== null && _webChatContainerProp9 !== void 0 && _webChatContainerProp9.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 {
@@ -300,15 +300,15 @@ 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 : (_webChatContainerProp9 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp9 === void 0 ? void 0 : _webChatContainerProp9.anchorColor) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.anchorColor};
+            color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp10 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp10 === void 0 ? void 0 : _webChatContainerProp10.anchorColor) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.anchorColor};
         }
 
-        .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.defaultAdaptiveCardStyles.buttonWhiteSpace} !important;}
+        .webchat__stacked-layout__content .ac-actionSet > .ac-pushButton > div {white-space: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp11 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp11 === void 0 ? void 0 : _webChatContainerProp11.buttonWhiteSpace) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.buttonWhiteSpace} !important;}
 
         .ms_lcw_webchat_received_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 : (_webChatContainerProp11 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp11 === void 0 ? void 0 : (_webChatContainerProp12 = _webChatContainerProp11.receivedMessageAnchorStyles) === null || _webChatContainerProp12 === void 0 ? void 0 : _webChatContainerProp12.filter) ?? (_defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === null || _defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === void 0 ? void 0 : _defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles.filter)};
+            filter: ${(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.filter) ?? (_defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === null || _defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === void 0 ? void 0 : _defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles.filter)};
             height: .75em;
             width: .75em;
             margin-left: .25em;
@@ -318,7 +318,7 @@ const WebChatContainerStateful = props => {
         .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.defaultSentMessageAnchorStyles === null || _defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles === void 0 ? void 0 : _defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles.filter)};
+            filter: ${(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.filter) ?? (_defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles === null || _defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles === void 0 ? void 0 : _defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles.filter)};
             height: .75em;
             width: .75em;
             margin-left: .25em;
@@ -328,7 +328,7 @@ const WebChatContainerStateful = props => {
         /* 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.defaultReceivedMessageAnchorStyles === null || _defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === void 0 ? void 0 : _defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles.color)} !important;
+                background-color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp16 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp16 === void 0 ? void 0 : (_webChatContainerProp17 = _webChatContainerProp16.receivedMessageAnchorStyles) === null || _webChatContainerProp17 === void 0 ? void 0 : _webChatContainerProp17.color) ?? (_defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === null || _defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === void 0 ? void 0 : _defaultReceivedMessageAnchorStyles.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;
@@ -338,7 +338,7 @@ const WebChatContainerStateful = props => {
             }
 
             .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.defaultSentMessageAnchorStyles === null || _defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles === void 0 ? void 0 : _defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles.color)} !important;
+                background-color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp18 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp18 === void 0 ? void 0 : (_webChatContainerProp19 = _webChatContainerProp18.sentMessageAnchorStyles) === null || _webChatContainerProp19 === void 0 ? void 0 : _webChatContainerProp19.color) ?? (_defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles === null || _defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles === void 0 ? void 0 : _defaultSentMessageAnchorStyles.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;
@@ -356,18 +356,18 @@ 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 : (_webChatContainerProp19 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp19 === void 0 ? void 0 : (_webChatContainerProp20 = _webChatContainerProp19.receivedMessageAnchorStyles) === null || _webChatContainerProp20 === void 0 ? void 0 : _webChatContainerProp20.color) ?? (_defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === null || _defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === void 0 ? void 0 : _defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles.color)};
+            color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp20 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp20 === void 0 ? void 0 : (_webChatContainerProp21 = _webChatContainerProp20.receivedMessageAnchorStyles) === null || _webChatContainerProp21 === void 0 ? void 0 : _webChatContainerProp21.color) ?? (_defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === null || _defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === void 0 ? void 0 : _defaultReceivedMessageAnchorStyles.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 : (_webChatContainerProp21 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp21 === void 0 ? void 0 : (_webChatContainerProp22 = _webChatContainerProp21.sentMessageAnchorStyles) === null || _webChatContainerProp22 === void 0 ? void 0 : _webChatContainerProp22.color) ?? (_defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles === null || _defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles === void 0 ? void 0 : _defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles.color)};
+            color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp22 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp22 === void 0 ? void 0 : (_webChatContainerProp23 = _webChatContainerProp22.sentMessageAnchorStyles) === null || _webChatContainerProp23 === void 0 ? void 0 : _webChatContainerProp23.color) ?? (_defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles === null || _defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles === void 0 ? void 0 : _defaultSentMessageAnchorStyles.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 : (_webChatContainerProp23 = webChatContainerProps.webChatStyles) === null || _webChatContainerProp23 === void 0 ? void 0 : _webChatContainerProp23.bubbleBorderRadius) ?? 0} !important; /* Override border-radius */
+            border-radius: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp24 = webChatContainerProps.webChatStyles) === null || _webChatContainerProp24 === void 0 ? void 0 : _webChatContainerProp24.bubbleBorderRadius) ?? 0} !important; /* Override border-radius */
         }
 
         .webchat__stacked-layout_container>div {
@@ -404,8 +404,8 @@ const WebChatContainerStateful = props => {
 
         /* Suggested actions carousel previous/next navigation focus */
         .webchat__suggested-actions .webchat__suggested-actions__carousel .react-film__flipper:focus-visible .react-film__flipper__body {
-            outline: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp24 = webChatContainerProps.webChatStyles) === null || _webChatContainerProp24 === void 0 ? void 0 : _webChatContainerProp24.suggestedActionKeyboardFocusIndicatorBorderStyle) ?? "dashed"} ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp25 = webChatContainerProps.webChatStyles) === null || _webChatContainerProp25 === void 0 ? void 0 : _webChatContainerProp25.suggestedActionKeyboardFocusIndicatorBorderWidth) ?? "1px"} ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp26 = webChatContainerProps.webChatStyles) === null || _webChatContainerProp26 === void 0 ? void 0 : _webChatContainerProp26.suggestedActionKeyboardFocusIndicatorBorderColor) ?? "#605E5C"} !important;
-            outline-offset: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp27 = webChatContainerProps.webChatStyles) === null || _webChatContainerProp27 === void 0 ? void 0 : _webChatContainerProp27.suggestedActionKeyboardFocusIndicatorInset) ?? "2px"} !important;
+            outline: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp25 = webChatContainerProps.webChatStyles) === null || _webChatContainerProp25 === void 0 ? void 0 : _webChatContainerProp25.suggestedActionKeyboardFocusIndicatorBorderStyle) ?? "dashed"} ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp26 = webChatContainerProps.webChatStyles) === null || _webChatContainerProp26 === void 0 ? void 0 : _webChatContainerProp26.suggestedActionKeyboardFocusIndicatorBorderWidth) ?? "1px"} ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp27 = webChatContainerProps.webChatStyles) === null || _webChatContainerProp27 === void 0 ? void 0 : _webChatContainerProp27.suggestedActionKeyboardFocusIndicatorBorderColor) ?? "#605E5C"} !important;
+            outline-offset: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp28 = webChatContainerProps.webChatStyles) === null || _webChatContainerProp28 === void 0 ? void 0 : _webChatContainerProp28.suggestedActionKeyboardFocusIndicatorInset) ?? "2px"} !important;
 
         `), /*#__PURE__*/_react2.default.createElement(_react.Stack, {
     styles: containerStyles,
@@ -416,9 +416,7 @@ const WebChatContainerStateful = props => {
       height: "100%",
       width: "100%"
     }
-  }, shouldLoadPersistentHistoryMessages && /*#__PURE__*/_react2.default.createElement(_WebChatEventSubscribers.default, {
-    persistentChatHistoryEnabled: props === null || props === void 0 ? void 0 : (_props$persistentChat2 = props.persistentChatHistoryProps) === null || _props$persistentChat2 === void 0 ? void 0 : _props$persistentChat2.persistentChatHistoryEnabled
-  }), /*#__PURE__*/_react2.default.createElement(BasicWebChat, null))), citationPaneOpen && /*#__PURE__*/_react2.default.createElement(_CitationPaneStateful.default, {
+  }, shouldLoadPersistentHistoryMessages && /*#__PURE__*/_react2.default.createElement(_WebChatEventSubscribers.default, null), /*#__PURE__*/_react2.default.createElement(BasicWebChat, null))), citationPaneOpen && /*#__PURE__*/_react2.default.createElement(_CitationPaneStateful.default, {
     id: ((_props$citationPanePr = props.citationPaneProps) === null || _props$citationPanePr === void 0 ? void 0 : _props$citationPanePr.id) || _Constants.HtmlAttributeNames.ocwCitationPaneClassName,
     title: ((_props$citationPanePr2 = props.citationPaneProps) === null || _props$citationPanePr2 === void 0 ? void 0 : _props$citationPanePr2.title) || _Constants.HtmlAttributeNames.ocwCitationPaneTitle,
     contentHtml: citationPaneText,

package/lib/cjs/components/webchatcontainerstateful/common/activityConverters/convertPersistentChatHistoryMessageToActivity.js

@@ -53,20 +53,20 @@ const convertPersistentChatHistoryMessageToActivity = message => {
     }
   }
   if (additionalData !== null && additionalData !== void 0 && additionalData.tags) {
-    const {
-      tags,
-      ConversationId
-    } = additionalData;
-    if (ConversationId) {
-      activity.channelData.conversationId = ConversationId;
-    }
-    if (tags) {
-      const formattedTags = additionalData.tags.split(",");
-      activity.channelData.tags = [...activity.channelData.tags, ...formattedTags];
-    }
+    const formattedTags = additionalData.tags.split(",");
+    activity.channelData = {
+      ...activity.channelData,
+      tags: [...activity.channelData.tags, ...formattedTags]
+    };
+  }
+  if (additionalData !== null && additionalData !== void 0 && additionalData.ConversationId) {
+    activity.channelData.conversationId = additionalData.ConversationId;
   }
   if (from !== null && from !== void 0 && (_from$user = from.user) !== null && _from$user !== void 0 && _from$user.displayName) {
-    activity.from.name = from.user.displayName;
+    activity.from = {
+      ...activity.from,
+      name: from.user.displayName
+    };
   }
   if ((from === null || from === void 0 ? void 0 : (_from$application = from.application) === null || _from$application === void 0 ? void 0 : _from$application.displayName) === "Customer") {
     activity.from = {

package/lib/cjs/components/webchatcontainerstateful/common/defaultProps/defaultMiddlewareLocalizedTexts.js

@@ -35,6 +35,7 @@ const defaultMiddlewareLocalizedTexts = {
   MIDDLEWARE_BANNER_FILE_IS_MALICIOUS: "{0} has been blocked because the file may contain a malware.",
   MIDDLEWARE_BANNER_FILE_EMAIL_ADDRESS_RECORDED_SUCCESS: "Email will be sent after chat ends!",
   MIDDLEWARE_BANNER_FILE_EMAIL_ADDRESS_RECORDED_ERROR: "Email {0} could not be saved, try again later.",
-  PREVIOUS_MESSAGES_LOADING: "Loading previous messages..."
+  PREVIOUS_MESSAGES_LOADING: "Loading previous messages...",
+  CONVERSATION_DIVIDER_ARIA_LABEL: "Conversation history divider"
 };
 exports.defaultMiddlewareLocalizedTexts = defaultMiddlewareLocalizedTexts;

package/lib/cjs/components/webchatcontainerstateful/hooks/usePersistentChatHistory.js

@@ -8,9 +8,8 @@ var _TelemetryConstants = require("../../../common/telemetry/TelemetryConstants"
 var _react = require("react");
 var _ChatWidgetEvents = _interopRequireDefault(require("../../livechatwidget/common/ChatWidgetEvents"));
 var _PersistentConversationHandler = _interopRequireDefault(require("../../livechatwidget/common/PersistentConversationHandler"));
-var _TelemetryHelper = require("../../../common/telemetry/TelemetryHelper");
-var _dispatchCustomEvent = _interopRequireDefault(require("../../../common/utils/dispatchCustomEvent"));
 var _SecureEventBus = _interopRequireDefault(require("../../../common/utils/SecureEventBus"));
+var _TelemetryHelper = require("../../../common/telemetry/TelemetryHelper");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 const usePersistentChatHistory = (facadeChatSDK, props) => {
   const handlerRef = (0, _react.useRef)(null);
@@ -31,7 +30,6 @@ const usePersistentChatHistory = (facadeChatSDK, props) => {
       try {
         var _handlerRef$current;
         await ((_handlerRef$current = handlerRef.current) === null || _handlerRef$current === void 0 ? void 0 : _handlerRef$current.pullHistory());
-        (0, _dispatchCustomEvent.default)(_ChatWidgetEvents.default.HIDE_LOADING_BANNER);
         _TelemetryHelper.TelemetryHelper.logActionEventToAllTelemetry(_TelemetryConstants.LogLevel.INFO, {
           Event: _TelemetryConstants.TelemetryEvent.LCWPersistentChatHistoryFetchCompleted,
           Description: "Persistent chat history fetch completed successfully"

package/lib/cjs/components/webchatcontainerstateful/interfaces/IExtendedChatConffig.js

@@ -0,0 +1 @@
+"use strict";

package/lib/cjs/components/webchatcontainerstateful/webchatcontroller/WebChatEventSubscribers.js

@@ -17,14 +17,13 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
  * Component to handle persistent chat history events.
  * Uses WebChatStoreLoader instead of hooks to avoid context issues.
  */
-const WebChatEventSubscribers = props => {
+const WebChatEventSubscribers = () => {
   const [isConnected, setIsConnected] = (0, _react.useState)(false);
   const [storeReady, setStoreReady] = (0, _react.useState)(false);
   const storeWaitTimer = (0, _utils.createTimer)();
+  // Type the chatConfig properly to avoid 'any' usage
+
   (0, _react.useEffect)(() => {
-    if (!props.persistentChatHistoryEnabled) {
-      return;
-    }
     _TelemetryHelper.TelemetryHelper.logActionEventToAllTelemetry(_TelemetryConstants.LogLevel.INFO, {
       Event: _TelemetryConstants.TelemetryEvent.LCWWebChatStorePollingStarted,
       Description: "WebChat store polling started"
@@ -56,9 +55,9 @@ const WebChatEventSubscribers = props => {
         clearInterval(storeCheckInterval);
       };
     }
-  }, [props.persistentChatHistoryEnabled]);
+  }, []);
   (0, _react.useEffect)(() => {
-    if (!props.persistentChatHistoryEnabled || !storeReady) {
+    if (!storeReady) {
       return;
     }
     const checkConnectionStatus = () => {
@@ -115,7 +114,7 @@ const WebChatEventSubscribers = props => {
     return () => {
       clearInterval(interval);
     };
-  }, [isConnected, props.persistentChatHistoryEnabled, storeReady]);
+  }, [isConnected, storeReady]);
   return null;
 };
 var _default = WebChatEventSubscribers;

package/lib/cjs/components/webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/activities/ConversationDividerActivity.js

@@ -5,13 +5,42 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
+var _defaultMiddlewareLocalizedTexts = require("../../../../common/defaultProps/defaultMiddlewareLocalizedTexts");
 var _defaultPersistentChatHistoryProps = require("../../../../../livechatwidget/common/defaultProps/defaultPersistentChatHistoryProps");
 var _react2 = require("@fluentui/react");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 const ConversationDividerActivity = props => {
   const styleApplied = (0, _react2.mergeStyles)(_defaultPersistentChatHistoryProps.defaultPersistentChatHistoryProps.dividerActivityStyle, props.dividerActivityStyle);
+  const ariaLabel = props.dividerActivityAriaLabel || _defaultMiddlewareLocalizedTexts.defaultMiddlewareLocalizedTexts.CONVERSATION_DIVIDER_ARIA_LABEL;
+
+  // Create a simple separator that screen readers can detect without being interactive
+  // Preserve the visual divider styling while making it accessible
+  // Use a ref to programmatically remove only the "EL said:" prefix from the label
+  const dividerRef = _react.default.useRef(null);
+  _react.default.useEffect(() => {
+    if (dividerRef.current) {
+      // Find and hardcode the text in the label div to just show the divider label
+      const article = dividerRef.current.closest(".webchat__basic-transcript__activity");
+      if (article) {
+        const labelDiv = article.querySelector("div[id*=\"webchat__basic-transcript__active-descendant-label--\"]");
+        if (labelDiv) {
+          // Hardcode the text to just the aria label
+          labelDiv.textContent = ariaLabel || "";
+        }
+      }
+    }
+  }, [ariaLabel]);
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: styleApplied
+    ref: dividerRef,
+    role: "separator",
+    "aria-label": ariaLabel,
+    "aria-hidden": false,
+    className: styleApplied,
+    "data-accessibility-divider": "true",
+    style: {
+      // Add accessibility enhancements
+      position: "relative"
+    }
   });
 };
 var _default = ConversationDividerActivity;

package/lib/cjs/components/webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/activities/LazyLoadActivity.js

@@ -62,7 +62,7 @@ let LazyLoadHandler = /*#__PURE__*/function () {
 
     // Scroll operation state
     // Current scroll operation tracking
-    // Prevents concurrent scroll operations
+    // Prevents concurrent scroll operations (public for event handlers)
 
     // Timeout and queue management
     // Tracks all setTimeout IDs for cleanup
@@ -934,6 +934,21 @@ const LazyLoadActivity = props => {
       setHasMoreHistory(false);
     };
 
+    // Event listener for HISTORY_LOAD_ERROR - hides banner temporarily without disabling future loads
+    const handleHistoryLoadError = () => {
+      // Temporarily hide the banner by pausing, but keep hasMoreHistory true to allow retry
+      LazyLoadHandler.paused = true;
+      LazyLoadHandler.pendingScrollAction = false;
+
+      // Re-enable after a delay to allow retry on next scroll
+      // Note: This timeout is intentionally not tracked as it's scoped to the component lifecycle
+      window.setTimeout(() => {
+        LazyLoadHandler.paused = false;
+      }, 2000); // 2 second delay before allowing retry
+
+      LazyLoadHandler.logLifecycleEvent(_TelemetryConstants.TelemetryEvent.LCWLazyLoadHistoryError, "History load error - will retry on next scroll");
+    };
+
     // Event listener for PersistentConversationReset to sync React state
     // This fixes the issue where banner doesn't appear in start chat + close chat + start chat sequence
     // by ensuring React state (hasMoreHistory) is synchronized with handler state when reset occurs
@@ -946,6 +961,9 @@ const LazyLoadActivity = props => {
     const eventBus = _SecureEventBus.default.getInstance();
     const unsubscribeNoMoreHistory = eventBus.subscribe(_ChatWidgetEvents.default.NO_MORE_HISTORY_AVAILABLE, handleNoMoreHistory);
 
+    // Add event listener for history load errors
+    const unsubscribeHistoryError = eventBus.subscribe(_ChatWidgetEvents.default.HISTORY_LOAD_ERROR, handleHistoryLoadError);
+
     // Add event listener for persistent conversation reset
     const resetSubscription = _omnichannelChatComponents.BroadcastService.getMessageByEventName(_TelemetryConstants.BroadcastEvent.PersistentConversationReset).subscribe(handlePersistentConversationReset);
 
@@ -962,6 +980,7 @@ const LazyLoadActivity = props => {
       // Still need to return cleanup function even after reset
       return () => {
         unsubscribeNoMoreHistory();
+        unsubscribeHistoryError();
         resetSubscription.unsubscribe();
       };
     }
@@ -1014,6 +1033,7 @@ const LazyLoadActivity = props => {
 
       // Remove event listeners
       unsubscribeNoMoreHistory();
+      unsubscribeHistoryError();
       resetSubscription.unsubscribe();
       if (container) {
         container.removeEventListener("scroll", handleScroll);

package/lib/cjs/components/webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/activityMiddleware.js

@@ -12,6 +12,7 @@ var _DirectLineActivityType = require("../../enums/DirectLineActivityType");
 var _DirectLineSenderRole = require("../../enums/DirectLineSenderRole");
 var _react = _interopRequireDefault(require("react"));
 var _TelemetryHelper = require("../../../../../common/telemetry/TelemetryHelper");
+var _defaultMiddlewareLocalizedTexts = require("../../../common/defaultProps/defaultMiddlewareLocalizedTexts");
 var _defaultSystemMessageStyles = require("./defaultStyles/defaultSystemMessageStyles");
 var _defaultUserMessageStyles = require("./defaultStyles/defaultUserMessageStyles");
 var _utils = require("../../../../../common/utils");
@@ -79,7 +80,7 @@ const isDataTagsPresent = card => {
 };
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-const createActivityMiddleware = (renderMarkdown, systemMessageStyleProps, userMessageStyleProps) => () => next => function () {
+const createActivityMiddleware = (renderMarkdown, systemMessageStyleProps, userMessageStyleProps, localizedTexts) => () => next => function () {
   for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
     args[_key] = arguments[_key];
   }
@@ -130,7 +131,11 @@ const createActivityMiddleware = (renderMarkdown, systemMessageStyleProps, userM
       };
     }
     if (isTagIncluded(card, _Constants.Constants.conversationDividerTag)) {
-      return /*#__PURE__*/_react.default.createElement(_ConversationDividerActivity.default, null);
+      const conversationDividerLabel = (localizedTexts === null || localizedTexts === void 0 ? void 0 : localizedTexts.CONVERSATION_DIVIDER_ARIA_LABEL) || _defaultMiddlewareLocalizedTexts.defaultMiddlewareLocalizedTexts.CONVERSATION_DIVIDER_ARIA_LABEL;
+      // Pass the computed localized text to the divider component
+      return /*#__PURE__*/_react.default.createElement(_ConversationDividerActivity.default, {
+        dividerActivityAriaLabel: conversationDividerLabel
+      });
     }
     if (card.activity.text && card.activity.type === _DirectLineActivityType.DirectLineActivityType.Message) {
       if (!card.activity.channelData.isHtmlEncoded && card.activity.channelId === _Constants.Constants.webchatChannelId) {

package/lib/cjs/components/webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/timestamps/NotDeliveredTimestamp.js

@@ -17,6 +17,8 @@ var _useChatContextStore = _interopRequireDefault(require("../../../../../../hoo
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 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; }
+/* eslint-disable @typescript-eslint/no-explicit-any */
+
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 const NotDeliveredTimestamp = _ref => {
   var _state$domainStates$r, _state$domainStates$r2, _state$domainStates$r3, _state$domainStates$r4, _state$domainStates$m, _state$domainStates$m2;
@@ -77,6 +79,7 @@ const NotDeliveredTimestamp = _ref => {
     style: failedTextStyles
   }, " ", ((_state$domainStates$m = state.domainStates.middlewareLocalizedTexts) === null || _state$domainStates$m === void 0 ? void 0 : _state$domainStates$m.MIDDLEWARE_MESSAGE_NOT_DELIVERED) ?? _defaultMiddlewareLocalizedTexts.defaultMiddlewareLocalizedTexts.MIDDLEWARE_MESSAGE_NOT_DELIVERED, " "), /*#__PURE__*/_react.default.createElement("span", null, " \xA0-\xA0 "), /*#__PURE__*/_react.default.createElement("span", {
     style: retryTextStyles,
+    role: "button",
     onClick: onRetryClick,
     onKeyDown: onRetryKeyEnter,
     tabIndex: 0

package/lib/cjs/components/webchatcontainerstateful/webchatcontroller/middlewares/storemiddlewares/citationsMiddleware.js

@@ -32,7 +32,12 @@ const createCitationsMiddleware = (state, dispatch) => () => next => action => {
         const citations = (_gptFeedback$summariz = gptFeedback.summarizationOpenAIResponse) === null || _gptFeedback$summariz === void 0 ? void 0 : (_gptFeedback$summariz2 = _gptFeedback$summariz.result) === null || _gptFeedback$summariz2 === void 0 ? void 0 : _gptFeedback$summariz2.textCitations;
         // Rewrite inline citation labels in activity.text to match the global map keys
         const updatedText = replaceCitations(action.payload.activity.text, citations, messagePrefix);
-        action.payload.activity.text = updatedText;
+
+        // Create new activity object to avoid mutation
+        action.payload.activity = {
+          ...action.payload.activity,
+          text: updatedText
+        };
         // Build a global citation map keyed by the prefixed citation id and
         // dispatch it to app state so the UI container can render citations.
         try {