@microsoft/omnichannel-chat-widget 1.8.3-main.3445895 → 1.8.3-main.4743fdc

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

@@ -5,59 +5,127 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.createCitationsMiddleware = void 0;
 var _TelemetryConstants = require("../../../../../common/telemetry/TelemetryConstants");
+var _LiveChatWidgetActionType = require("../../../../../contexts/common/LiveChatWidgetActionType");
 var _TelemetryHelper = require("../../../../../common/telemetry/TelemetryHelper");
-const createCitationsMiddleware = _ref => {
-  let {
-    dispatch
-  } = _ref;
-  return next => action => {
-    var _action$payload;
-    if ((_action$payload = action.payload) !== null && _action$payload !== void 0 && _action$payload.activity) {
-      if (isApplicable(action)) {
+var _createReducer = require("../../../../../contexts/createReducer");
+// Middleware that extracts citation metadata from incoming ACS activities and
+// updates in-memory app state with a global citation map. Also rewrites
+// per-message citation labels in the activity text to use a stable,
+// message-scoped prefix when the producer provides a message id.
+
+const createCitationsMiddleware = (state, dispatch) => () => next => action => {
+  var _action$payload;
+  if ((_action$payload = action.payload) !== null && _action$payload !== void 0 && _action$payload.activity) {
+    if (isApplicable(action)) {
+      try {
+        var _action$payload2, _action$payload2$acti, _gptFeedback$summariz, _gptFeedback$summariz2;
+        const inMemoryState = (0, _createReducer.executeReducer)(state, {
+          type: _LiveChatWidgetActionType.LiveChatWidgetActionType.GET_IN_MEMORY_STATE,
+          payload: null
+        });
+
+        // Use the producer-supplied messageid as a stable per-message prefix
+        // when present. Do not derive a prefix from activity.id or timestamps.
+        const messagePrefix = ((_action$payload2 = action.payload) === null || _action$payload2 === void 0 ? void 0 : (_action$payload2$acti = _action$payload2.activity) === null || _action$payload2$acti === void 0 ? void 0 : _action$payload2$acti.messageid) ?? "";
+        const gptFeedback = JSON.parse(action.payload.activity.channelData.metadata["pva:gpt-feedback"]);
+        // Extract citation objects from the model response
+        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;
+        // 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 {
-          const gptFeedback = JSON.parse(action.payload.activity.channelData.metadata["pva:gpt-feedback"]);
-          // Replace citations in the text
-          const updatedText = replaceCitations(action.payload.activity.text, gptFeedback.summarizationOpenAIResponse.result.textCitations);
-          action.payload.activity.text = updatedText;
-        } catch (error) {
-          _TelemetryHelper.TelemetryHelper.logActionEvent(_TelemetryConstants.LogLevel.ERROR, {
+          var _inMemoryState$domain;
+          const citationMap = {};
+          if (citations && Array.isArray(citations)) {
+            citations.forEach(citation => {
+              if (citation !== null && citation !== void 0 && citation.id) {
+                // Preserve the 'cite:' scheme so renderer click handling remains consistent
+                const idWithoutScheme = citation.id.replace(/^cite:/, "");
+                const prefixedId = `cite:${messagePrefix}_${idWithoutScheme}`;
+                citationMap[prefixedId] = citation.text || citation.title || "";
+              }
+            });
+          }
+
+          // Read current in-memory state to merge with existing citations
+          //const inMemoryState = executeReducer(state, { type: LiveChatWidgetActionType.GET_IN_MEMORY_STATE, payload: null });
+          const existingCitations = (inMemoryState === null || inMemoryState === void 0 ? void 0 : (_inMemoryState$domain = inMemoryState.domainStates) === null || _inMemoryState$domain === void 0 ? void 0 : _inMemoryState$domain.citations) || {};
+          const updatedCitations = {
+            ...existingCitations,
+            ...citationMap
+          };
+          // Always dispatch to app state
+          dispatch({
+            type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CITATIONS,
+            payload: updatedCitations
+          });
+        } catch (innerErr) {
+          _TelemetryHelper.TelemetryHelper.logActionEvent(_TelemetryConstants.LogLevel.WARN, {
             Event: _TelemetryConstants.TelemetryEvent.CitationMiddlewareFailed,
             ExceptionDetails: {
-              ErrorData: "Error while converting citation labels",
-              Exception: error
+              ErrorData: "Error while populating citation map",
+              Exception: innerErr
             }
           });
         }
+      } catch (error) {
+        _TelemetryHelper.TelemetryHelper.logActionEvent(_TelemetryConstants.LogLevel.ERROR, {
+          Event: _TelemetryConstants.TelemetryEvent.CitationMiddlewareFailed,
+          ExceptionDetails: {
+            ErrorData: "Error while converting citation labels",
+            Exception: error
+          }
+        });
       }
     }
-    return next(action);
-  };
+  }
+  return next(action);
 };
 exports.createCitationsMiddleware = createCitationsMiddleware;
 const isApplicable = action => {
-  var _action$payload2, _action$payload2$acti, _action$payload3, _action$payload3$acti;
-  if ((action === null || action === void 0 ? void 0 : (_action$payload2 = action.payload) === null || _action$payload2 === void 0 ? void 0 : (_action$payload2$acti = _action$payload2.activity) === null || _action$payload2$acti === void 0 ? void 0 : _action$payload2$acti.actionType) === "DIRECT_LINE/INCOMING_ACTIVITY" && (action === null || action === void 0 ? void 0 : (_action$payload3 = action.payload) === null || _action$payload3 === void 0 ? void 0 : (_action$payload3$acti = _action$payload3.activity) === null || _action$payload3$acti === void 0 ? void 0 : _action$payload3$acti.channelId) === "ACS_CHANNEL") {
-    var _action$payload4, _action$payload4$acti, _action$payload4$acti2, _action$payload4$acti3;
-    // Validate if pva:gpt-feedback exists and is not null
-    if (action !== null && action !== void 0 && (_action$payload4 = action.payload) !== null && _action$payload4 !== void 0 && (_action$payload4$acti = _action$payload4.activity) !== null && _action$payload4$acti !== void 0 && (_action$payload4$acti2 = _action$payload4$acti.channelData) !== null && _action$payload4$acti2 !== void 0 && (_action$payload4$acti3 = _action$payload4$acti2.metadata) !== null && _action$payload4$acti3 !== void 0 && _action$payload4$acti3["pva:gpt-feedback"]) {
+  var _action$payload3, _action$payload3$acti, _action$payload4, _action$payload4$acti;
+  if ((action === null || action === void 0 ? void 0 : (_action$payload3 = action.payload) === null || _action$payload3 === void 0 ? void 0 : (_action$payload3$acti = _action$payload3.activity) === null || _action$payload3$acti === void 0 ? void 0 : _action$payload3$acti.actionType) === "DIRECT_LINE/INCOMING_ACTIVITY" && (action === null || action === void 0 ? void 0 : (_action$payload4 = action.payload) === null || _action$payload4 === void 0 ? void 0 : (_action$payload4$acti = _action$payload4.activity) === null || _action$payload4$acti === void 0 ? void 0 : _action$payload4$acti.channelId) === "ACS_CHANNEL") {
+    var _action$payload5, _action$payload5$acti, _action$payload5$acti2, _action$payload5$acti3;
+    // Only applicable for ACS incoming activities that include pva:gpt-feedback
+    if (action !== null && action !== void 0 && (_action$payload5 = action.payload) !== null && _action$payload5 !== void 0 && (_action$payload5$acti = _action$payload5.activity) !== null && _action$payload5$acti !== void 0 && (_action$payload5$acti2 = _action$payload5$acti.channelData) !== null && _action$payload5$acti2 !== void 0 && (_action$payload5$acti3 = _action$payload5$acti2.metadata) !== null && _action$payload5$acti3 !== void 0 && _action$payload5$acti3["pva:gpt-feedback"]) {
       return true;
     }
   }
   return false;
 };
-const replaceCitations = (text, citations) => {
+const replaceCitations = (text, citations, messagePrefix) => {
   if (!citations || !Array.isArray(citations)) {
     return text;
   }
   try {
-    return text.replace(/\[(\d+)\]:\s(cite:\d+)\s"([^"]+)"/g, (match, number, citeId) => {
-      const citation = citations.find(c => c.id === citeId);
+    let updatedText = text;
+
+    // First, handle the citation reference definitions at the end (e.g., [1]: cite:1757450535119_1 "index.html")
+    // These should NOT be escaped as they are proper citation definitions
+    updatedText = updatedText.replace(/\[(\d+)\]:\s(cite:\d+)\s"([^\\"]+)"/g, (match, number, citeId) => {
+      // Attempt to find a citation object matching the inline cite id and
+      // update the displayed id/title. When a messagePrefix exists we
+      // rewrite the id to the prefixed form so it aligns with the
+      // global citation map keys.
+      const lookupId = citeId;
+      const citation = citations.find(c => c.id === lookupId);
       if (citation) {
-        // Replace only the citation label while preserving the original format
-        return `[${number}]: ${citeId} "${citation.title}"`;
+        const idWithoutScheme = citeId.replace(/^cite:/, "");
+        const prefixed = messagePrefix ? `cite:${messagePrefix}_${idWithoutScheme}` : citeId;
+        return `[${number}]: ${prefixed} "${citation.title}"`;
       }
-      return match; // Keep the original match if no replacement is found
+      return match;
+    });
+
+    // Second, escape inline citation references that are NOT followed by a colon
+    // This handles cases like "[1][2]"" in the middle of text that should be escaped for markdown
+    updatedText = updatedText.replace(/\[(\d+)\](?!:)/g, (match, number) => {
+      // Escape the brackets to prevent markdown from treating them as incomplete link syntax
+      return `[${number}]`;
     });
+    return updatedText;
   } catch (error) {
     _TelemetryHelper.TelemetryHelper.logActionEvent(_TelemetryConstants.LogLevel.ERROR, {
       Event: _TelemetryConstants.TelemetryEvent.CitationMiddlewareFailed,
@@ -66,7 +134,6 @@ const replaceCitations = (text, citations) => {
         Exception: error
       }
     });
-    // Return the original text in case of issues
     return text;
   }
 };

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

@@ -0,0 +1,54 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.localizedStringsBotInitialsMiddleware = exports.getOverriddenLocalizedStrings = void 0;
+var _Constants = require("../../../../../common/Constants");
+var _utils = require("../../../../../common/utils");
+var _defaultWebChatStyles = require("../../../common/defaultStyles/defaultWebChatStyles");
+var _WebChatActionType = require("../../enums/WebChatActionType");
+/* eslint-disable @typescript-eslint/no-explicit-any */
+
+let currentAgentInitials = _defaultWebChatStyles.defaultWebChatStyles.botAvatarInitials;
+const localizedStringsBotInitialsMiddleware = () => _ref => {
+  let {
+    dispatch
+  } = _ref;
+  return next => action => {
+    if (action.type === _WebChatActionType.WebChatActionType.DIRECT_LINE_INCOMING_ACTIVITY) {
+      var _action$payload, _activity$from;
+      const activity = (_action$payload = action.payload) === null || _action$payload === void 0 ? void 0 : _action$payload.activity;
+      if (activity !== null && activity !== void 0 && (_activity$from = activity.from) !== null && _activity$from !== void 0 && _activity$from.name && activity.from.role !== _Constants.Constants.userMessageTag && activity.from.name !== _Constants.Constants.userMessageTag) {
+        var _activity$channelData, _activity$channelData2, _activity$tags;
+        const agentName = activity.from.name.trim();
+        const isSystemMessage = agentName === "__agent__" || agentName.startsWith("__") || ((_activity$channelData = activity.channelData) === null || _activity$channelData === void 0 ? void 0 : (_activity$channelData2 = _activity$channelData.tags) === null || _activity$channelData2 === void 0 ? void 0 : _activity$channelData2.includes(_Constants.Constants.systemMessageTag)) || ((_activity$tags = activity.tags) === null || _activity$tags === void 0 ? void 0 : _activity$tags.includes(_Constants.Constants.systemMessageTag));
+        if (!isSystemMessage && agentName !== "") {
+          // Update initials for valid agent/bot names
+          const newInitials = (0, _utils.getIconText)(agentName) || currentAgentInitials;
+          currentAgentInitials = newInitials;
+        }
+      }
+    }
+    return next(action);
+  };
+};
+exports.localizedStringsBotInitialsMiddleware = localizedStringsBotInitialsMiddleware;
+const getOverriddenLocalizedStrings = existingOverrides => {
+  return strings => {
+    const result = {
+      ...strings,
+      ...existingOverrides
+    };
+
+    // Apply dynamic bot initials to alt text if not already overridden through props
+    if (!(existingOverrides !== null && existingOverrides !== void 0 && existingOverrides.ACTIVITY_BOT_SAID_ALT)) {
+      result.ACTIVITY_BOT_SAID_ALT = `${currentAgentInitials} said:`;
+    }
+    if (!(existingOverrides !== null && existingOverrides !== void 0 && existingOverrides.ACTIVITY_BOT_ATTACHED_ALT)) {
+      result.ACTIVITY_BOT_ATTACHED_ALT = `${currentAgentInitials} attached:`;
+    }
+    return result;
+  };
+};
+exports.getOverriddenLocalizedStrings = getOverriddenLocalizedStrings;

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

@@ -4,10 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.createQueueOverflowMiddleware = void 0;
-var _WebChatActionType = require("../../enums/WebChatActionType");
 var _TelemetryConstants = require("../../../../../common/telemetry/TelemetryConstants");
-var _TelemetryHelper = require("../../../../../common/telemetry/TelemetryHelper");
 var _LiveChatWidgetActionType = require("../../../../../contexts/common/LiveChatWidgetActionType");
+var _TelemetryHelper = require("../../../../../common/telemetry/TelemetryHelper");
+var _WebChatActionType = require("../../enums/WebChatActionType");
 var _createReducer = require("../../../../../contexts/createReducer");
 var _utils = require("../../../../../common/utils");
 const queueOverflowHandlingHelper = async (state, dispatch) => {

package/lib/cjs/contexts/common/LiveChatWidgetActionType.js

@@ -10,49 +10,50 @@ exports.LiveChatWidgetActionType = LiveChatWidgetActionType;
   LiveChatWidgetActionType[LiveChatWidgetActionType["SET_WIDGET_ELEMENT_ID"] = 0] = "SET_WIDGET_ELEMENT_ID";
   LiveChatWidgetActionType[LiveChatWidgetActionType["SET_RENDERING_MIDDLEWARE_PROPS"] = 1] = "SET_RENDERING_MIDDLEWARE_PROPS";
   LiveChatWidgetActionType[LiveChatWidgetActionType["SET_MIDDLEWARE_LOCALIZED_TEXTS"] = 2] = "SET_MIDDLEWARE_LOCALIZED_TEXTS";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_GLOBAL_DIR"] = 3] = "SET_GLOBAL_DIR";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_MINIMIZED"] = 4] = "SET_MINIMIZED";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_CONVERSATION_STATE"] = 5] = "SET_CONVERSATION_STATE";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_PREVIOUS_FOCUSED_ELEMENT_ID"] = 6] = "SET_PREVIOUS_FOCUSED_ELEMENT_ID";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_START_CHAT_FAILING"] = 7] = "SET_START_CHAT_FAILING";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_START_CHAT_FAILURE_TYPE"] = 8] = "SET_START_CHAT_FAILURE_TYPE";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_OUTSIDE_OPERATING_HOURS"] = 9] = "SET_OUTSIDE_OPERATING_HOURS";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_PRE_CHAT_SURVEY_RESPONSE"] = 10] = "SET_PRE_CHAT_SURVEY_RESPONSE";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_CUSTOM_CONTEXT"] = 11] = "SET_CUSTOM_CONTEXT";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_SHOW_CONFIRMATION"] = 12] = "SET_SHOW_CONFIRMATION";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_SHOW_EMAIL_TRANSCRIPT_PANE"] = 13] = "SET_SHOW_EMAIL_TRANSCRIPT_PANE";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_PRECHAT_RESPONSE_EMAIL"] = 14] = "SET_PRECHAT_RESPONSE_EMAIL";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_AUDIO_NOTIFICATION"] = 15] = "SET_AUDIO_NOTIFICATION";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_E2VV_ENABLED"] = 16] = "SET_E2VV_ENABLED";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_POST_CHAT_CONTEXT"] = 17] = "SET_POST_CHAT_CONTEXT";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SHOW_CALLING_CONTAINER"] = 18] = "SHOW_CALLING_CONTAINER";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_INCOMING_CALL"] = 19] = "SET_INCOMING_CALL";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["DISABLE_VIDEO_CALL"] = 20] = "DISABLE_VIDEO_CALL";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["DISABLE_LOCAL_VIDEO"] = 21] = "DISABLE_LOCAL_VIDEO";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["DISABLE_REMOTE_VIDEO"] = 22] = "DISABLE_REMOTE_VIDEO";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_CHAT_TOKEN"] = 23] = "SET_CHAT_TOKEN";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_START_CHAT_BUTTON_DISPLAY"] = 24] = "SET_START_CHAT_BUTTON_DISPLAY";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_PROACTIVE_CHAT_PARAMS"] = 25] = "SET_PROACTIVE_CHAT_PARAMS";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_TELEMETRY_DATA"] = 26] = "SET_TELEMETRY_DATA";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_RECONNECT_ID"] = 27] = "SET_RECONNECT_ID";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_UNREAD_MESSAGE_COUNT"] = 28] = "SET_UNREAD_MESSAGE_COUNT";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_FOCUS_CHAT_BUTTON"] = 29] = "SET_FOCUS_CHAT_BUTTON";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_CONVERSATION_ENDED_BY_AGENT_EVENT_RECEIVED"] = 30] = "SET_CONVERSATION_ENDED_BY_AGENT_EVENT_RECEIVED";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_CONVERSATION_ENDED_BY"] = 31] = "SET_CONVERSATION_ENDED_BY";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_WIDGET_STATE"] = 32] = "SET_WIDGET_STATE";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_LIVE_CHAT_CONTEXT"] = 33] = "SET_LIVE_CHAT_CONTEXT";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_BOT_OAUTH_SIGNIN_ID"] = 34] = "SET_BOT_OAUTH_SIGNIN_ID";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_WIDGET_SIZE"] = 35] = "SET_WIDGET_SIZE";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_WIDGET_INSTANCE_ID"] = 36] = "SET_WIDGET_INSTANCE_ID";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_LIVE_CHAT_CONFIG"] = 37] = "SET_LIVE_CHAT_CONFIG";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_POST_CHAT_WORKFLOW_IN_PROGRESS"] = 38] = "SET_POST_CHAT_WORKFLOW_IN_PROGRESS";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_INITIAL_CHAT_SDK_REQUEST_ID"] = 39] = "SET_INITIAL_CHAT_SDK_REQUEST_ID";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_SHOULD_USE_BOT_SURVEY"] = 40] = "SET_SHOULD_USE_BOT_SURVEY";
-  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_CHAT_DISCONNECT_EVENT_RECEIVED"] = 41] = "SET_CHAT_DISCONNECT_EVENT_RECEIVED";
-  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["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["SET_CITATIONS"] = 3] = "SET_CITATIONS";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_GLOBAL_DIR"] = 4] = "SET_GLOBAL_DIR";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_MINIMIZED"] = 5] = "SET_MINIMIZED";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_CONVERSATION_STATE"] = 6] = "SET_CONVERSATION_STATE";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_PREVIOUS_FOCUSED_ELEMENT_ID"] = 7] = "SET_PREVIOUS_FOCUSED_ELEMENT_ID";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_START_CHAT_FAILING"] = 8] = "SET_START_CHAT_FAILING";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_START_CHAT_FAILURE_TYPE"] = 9] = "SET_START_CHAT_FAILURE_TYPE";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_OUTSIDE_OPERATING_HOURS"] = 10] = "SET_OUTSIDE_OPERATING_HOURS";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_PRE_CHAT_SURVEY_RESPONSE"] = 11] = "SET_PRE_CHAT_SURVEY_RESPONSE";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_CUSTOM_CONTEXT"] = 12] = "SET_CUSTOM_CONTEXT";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_SHOW_CONFIRMATION"] = 13] = "SET_SHOW_CONFIRMATION";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_SHOW_EMAIL_TRANSCRIPT_PANE"] = 14] = "SET_SHOW_EMAIL_TRANSCRIPT_PANE";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_PRECHAT_RESPONSE_EMAIL"] = 15] = "SET_PRECHAT_RESPONSE_EMAIL";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_AUDIO_NOTIFICATION"] = 16] = "SET_AUDIO_NOTIFICATION";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_E2VV_ENABLED"] = 17] = "SET_E2VV_ENABLED";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_POST_CHAT_CONTEXT"] = 18] = "SET_POST_CHAT_CONTEXT";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SHOW_CALLING_CONTAINER"] = 19] = "SHOW_CALLING_CONTAINER";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_INCOMING_CALL"] = 20] = "SET_INCOMING_CALL";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["DISABLE_VIDEO_CALL"] = 21] = "DISABLE_VIDEO_CALL";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["DISABLE_LOCAL_VIDEO"] = 22] = "DISABLE_LOCAL_VIDEO";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["DISABLE_REMOTE_VIDEO"] = 23] = "DISABLE_REMOTE_VIDEO";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_CHAT_TOKEN"] = 24] = "SET_CHAT_TOKEN";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_START_CHAT_BUTTON_DISPLAY"] = 25] = "SET_START_CHAT_BUTTON_DISPLAY";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_PROACTIVE_CHAT_PARAMS"] = 26] = "SET_PROACTIVE_CHAT_PARAMS";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_TELEMETRY_DATA"] = 27] = "SET_TELEMETRY_DATA";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_RECONNECT_ID"] = 28] = "SET_RECONNECT_ID";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_UNREAD_MESSAGE_COUNT"] = 29] = "SET_UNREAD_MESSAGE_COUNT";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_FOCUS_CHAT_BUTTON"] = 30] = "SET_FOCUS_CHAT_BUTTON";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_CONVERSATION_ENDED_BY_AGENT_EVENT_RECEIVED"] = 31] = "SET_CONVERSATION_ENDED_BY_AGENT_EVENT_RECEIVED";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_CONVERSATION_ENDED_BY"] = 32] = "SET_CONVERSATION_ENDED_BY";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_WIDGET_STATE"] = 33] = "SET_WIDGET_STATE";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_LIVE_CHAT_CONTEXT"] = 34] = "SET_LIVE_CHAT_CONTEXT";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_BOT_OAUTH_SIGNIN_ID"] = 35] = "SET_BOT_OAUTH_SIGNIN_ID";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_WIDGET_SIZE"] = 36] = "SET_WIDGET_SIZE";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_WIDGET_INSTANCE_ID"] = 37] = "SET_WIDGET_INSTANCE_ID";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_LIVE_CHAT_CONFIG"] = 38] = "SET_LIVE_CHAT_CONFIG";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_POST_CHAT_WORKFLOW_IN_PROGRESS"] = 39] = "SET_POST_CHAT_WORKFLOW_IN_PROGRESS";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_INITIAL_CHAT_SDK_REQUEST_ID"] = 40] = "SET_INITIAL_CHAT_SDK_REQUEST_ID";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_SHOULD_USE_BOT_SURVEY"] = 41] = "SET_SHOULD_USE_BOT_SURVEY";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_CHAT_DISCONNECT_EVENT_RECEIVED"] = 42] = "SET_CHAT_DISCONNECT_EVENT_RECEIVED";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_SURVEY_MODE"] = 43] = "SET_SURVEY_MODE";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_CONFIRMATION_STATE"] = 44] = "SET_CONFIRMATION_STATE";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_POST_CHAT_PARTICIPANT_TYPE"] = 45] = "SET_POST_CHAT_PARTICIPANT_TYPE";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_CONVERSATIONAL_SURVEY_ENABLED"] = 46] = "SET_CONVERSATIONAL_SURVEY_ENABLED";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_CONVERSATIONAL_SURVEY_DISPLAY"] = 47] = "SET_CONVERSATIONAL_SURVEY_DISPLAY";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["GET_IN_MEMORY_STATE"] = 48] = "GET_IN_MEMORY_STATE";
 })(LiveChatWidgetActionType || (exports.LiveChatWidgetActionType = LiveChatWidgetActionType = {}));

package/lib/cjs/contexts/common/LiveChatWidgetContextInitialState.js

@@ -45,6 +45,8 @@ const getLiveChatWidgetContextInitialState = props => {
     domainStates: {
       liveChatConfig: props.chatConfig,
       widgetElementId: "",
+      // Map of citation id => content injected by citations middleware
+      citations: {},
       renderingMiddlewareProps: (_props$webChatContain = props.webChatContainerProps) === null || _props$webChatContain === void 0 ? void 0 : _props$webChatContain.renderingMiddlewareProps,
       middlewareLocalizedTexts: _defaultMiddlewareLocalizedTexts.defaultMiddlewareLocalizedTexts,
       preChatSurveyResponse: "{}",

package/lib/cjs/contexts/createReducer.js

@@ -70,6 +70,21 @@ const reducer = (state, action) => {
           middlewareLocalizedTexts: action.payload
         }
       };
+    case _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CITATIONS:
+      inMemory = {
+        ...inMemory,
+        domainStates: {
+          ...inMemory.domainStates,
+          citations: action.payload
+        }
+      };
+      return {
+        ...state,
+        domainStates: {
+          ...state.domainStates,
+          citations: action.payload
+        }
+      };
     case _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_GLOBAL_DIR:
       inMemory = {
         ...inMemory,

package/lib/esm/common/Constants.js

@@ -184,6 +184,8 @@ _defineProperty(HtmlAttributeNames, "adaptiveCardClassName", "ac-adaptiveCard");
 _defineProperty(HtmlAttributeNames, "adaptiveCardTextBlockClassName", "ac-textBlock");
 _defineProperty(HtmlAttributeNames, "adaptiveCardToggleInputClassName", "ac-toggleInput");
 _defineProperty(HtmlAttributeNames, "adaptiveCardActionSetClassName", "ac-actionSet");
+_defineProperty(HtmlAttributeNames, "ocwCitationPaneClassName", "ocw-citation-pane");
+_defineProperty(HtmlAttributeNames, "ocwCitationPaneTitle", "Citation");
 export let WebChatMiddlewareConstants = /*#__PURE__*/_createClass(function WebChatMiddlewareConstants() {
   _classCallCheck(this, WebChatMiddlewareConstants);
 });

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

@@ -148,6 +148,7 @@ export let TelemetryEvent;
   TelemetryEvent["EmailTranscriptLoaded"] = "EmailTranscriptLoaded";
   TelemetryEvent["OutOfOfficePaneLoaded"] = "OutOfOfficePaneLoaded";
   TelemetryEvent["ConfirmationPaneLoaded"] = "ConfirmationPaneLoaded";
+  TelemetryEvent["CitationPaneLoaded"] = "CitationPaneLoaded";
   TelemetryEvent["ProactiveChatPaneLoaded"] = "ProactiveChatPaneLoaded";
   TelemetryEvent["ReconnectChatPaneLoaded"] = "ReconnectChatPaneLoaded";
   TelemetryEvent["HeaderCloseButtonClicked"] = "HeaderCloseButtonClicked";
@@ -274,7 +275,9 @@ export let TelemetryEvent;
   TelemetryEvent["UXLCWChatButtonLoadingStart"] = "UXLCWChatButtonLoadingStart";
   TelemetryEvent["UXLCWChatButtonLoadingCompleted"] = "UXLCWChatButtonLoadingCompleted";
   TelemetryEvent["UXConfirmationPaneStart"] = "UXConfirmationPaneStart";
+  TelemetryEvent["UXCitationPaneStart"] = "UXCitationPaneStart";
   TelemetryEvent["UXConfirmationPaneCompleted"] = "UXConfirmationPaneCompleted";
+  TelemetryEvent["UXCitationPaneCompleted"] = "UXCitationPaneCompleted";
   TelemetryEvent["UXLiveChatWidgetStart"] = "UXLiveChatWidgetStart";
   TelemetryEvent["UXLiveChatWidgetCompleted"] = "UXLiveChatWidgetCompleted";
   TelemetryEvent["AppInsightsInitialized"] = "AppInsightsInitialized";

package/lib/esm/components/citationpanestateful/CitationDim.js

@@ -0,0 +1,20 @@
+import React from "react";
+import ReactDOM from "react-dom";
+import { DimLayer } from "../dimlayer/DimLayer";
+const CONTAINER_SELECTOR = ".webchat__stacked-layout_container";
+export const CitationDim = _ref => {
+  let {
+    brightness = "0.2"
+  } = _ref;
+  const container = document.querySelector(CONTAINER_SELECTOR);
+  if (!container) return null;
+  return /*#__PURE__*/ReactDOM.createPortal( /*#__PURE__*/React.createElement("div", {
+    style: {
+      position: "absolute",
+      inset: 0
+    }
+  }, /*#__PURE__*/React.createElement(DimLayer, {
+    brightness: brightness
+  })), container);
+};
+export default CitationDim;

package/lib/esm/components/citationpanestateful/CitationPaneStateful.js

@@ -0,0 +1,147 @@
+import { LogLevel, TelemetryEvent } from "../../common/telemetry/TelemetryConstants";
+import React, { useEffect, useState } from "react";
+import { createTimer, findAllFocusableElement, findParentFocusableElementsWithoutChildContainer, preventFocusToMoveOutOfElement, setTabIndices } from "../../common/utils";
+import CitationDim from "./CitationDim";
+import { CitationPane } from "@microsoft/omnichannel-chat-components";
+import { HtmlAttributeNames } from "../../common/Constants";
+import { LiveChatWidgetActionType } from "../../contexts/common/LiveChatWidgetActionType";
+import { TelemetryHelper } from "../../common/telemetry/TelemetryHelper";
+import { defaultCitationPaneStyles } from "./common/defaultProps/defaultCitationPaneProps";
+import useChatContextStore from "../../hooks/useChatContextStore";
+let uiTimer;
+export const CitationPaneStateful = props => {
+  useEffect(() => {
+    uiTimer = createTimer();
+    TelemetryHelper.logLoadingEvent(LogLevel.INFO, {
+      Event: TelemetryEvent.UXCitationPaneStart
+    });
+  }, []);
+  const initialTabIndexMap = new Map();
+  let elements = [];
+
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  const [state, dispatch] = useChatContextStore();
+  const controlId = HtmlAttributeNames.ocwCitationPaneClassName;
+
+  // Pane style computed to match the webchat widget container bounds so the pane
+  // stays within the widget and scrolls only vertically. We also track an
+  // "isReady" flag so we don't render the pane contents until the style is
+  // computed — this prevents a transient render that can appear as a flicker.
+  const [paneStyle, setPaneStyle] = useState(null);
+  const [isReady, setIsReady] = useState(false);
+
+  // Move focus to the container
+  useEffect(() => {
+    preventFocusToMoveOutOfElement(controlId);
+    const focusableElements = findAllFocusableElement(`#${controlId}`);
+    requestAnimationFrame(() => {
+      if (focusableElements && focusableElements.length > 0 && focusableElements[0]) {
+        focusableElements[0].focus({
+          preventScroll: true
+        });
+      }
+    });
+    elements = findParentFocusableElementsWithoutChildContainer(controlId);
+    setTabIndices(elements, initialTabIndexMap, false);
+    TelemetryHelper.logLoadingEvent(LogLevel.INFO, {
+      Event: TelemetryEvent.CitationPaneLoaded
+    });
+    TelemetryHelper.logLoadingEvent(LogLevel.INFO, {
+      Event: TelemetryEvent.UXCitationPaneCompleted,
+      ElapsedTimeInMilliseconds: uiTimer.milliSecondsElapsed
+    });
+  }, []);
+
+  // Compute the widget bounds and set pane style accordingly (95% of widget size
+  // and centered inside the widget). If the widget container can't be found,
+  // fall back to the default pane styles from defaultCitationPaneProps.
+  useEffect(() => {
+    const compute = () => {
+      try {
+        const container = document.querySelector(".webchat__stacked-layout_container");
+        if (container) {
+          const rect = container.getBoundingClientRect();
+          const widthPx = Math.round(rect.width * 0.95);
+          const heightPx = Math.round(rect.height * 0.95);
+          const leftPx = Math.round(rect.left + (rect.width - widthPx) / 2);
+          const topPx = Math.round(rect.top + (rect.height - heightPx) / 2);
+          // Clone defaults and remove transform so explicit left/top pixel
+          // coordinates are respected and the pane stays within the
+          // widget bounds.
+          const base = Object.assign({}, defaultCitationPaneStyles.pane);
+          // eslint-disable-next-line @typescript-eslint/no-explicit-any
+          if (base && base.transform) {
+            // remove centering transform when we compute exact pixel coords
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            delete base.transform;
+          }
+          setPaneStyle(Object.assign({}, base, {
+            left: `${leftPx}px`,
+            top: `${topPx}px`,
+            width: `${widthPx}px`,
+            height: `${heightPx}px`
+          }));
+          // Make the pane visible after the next paint to avoid layout
+          // flashes on initial mount.
+          requestAnimationFrame(() => setIsReady(true));
+          return;
+        }
+      } catch (e) {
+        // ignore
+      }
+
+      // fallback
+      setPaneStyle(defaultCitationPaneStyles.pane);
+      requestAnimationFrame(() => setIsReady(true));
+    };
+    compute();
+    window.addEventListener("resize", compute);
+    return () => window.removeEventListener("resize", compute);
+  }, []);
+  const handleClose = () => {
+    if (props.onClose) props.onClose();
+    dispatch({
+      type: LiveChatWidgetActionType.SET_PREVIOUS_FOCUSED_ELEMENT_ID,
+      payload: null
+    });
+    setTabIndices(elements, initialTabIndexMap, true);
+  };
+
+  // Merge a safe style object for the container and cast to CSSProperties to satisfy TS
+  const mergedStyle = Object.assign({
+    position: "relative"
+  }, paneStyle ?? {
+    position: "fixed"
+  });
+
+  // If paneStyle hasn't been computed yet, render the DimLayer so clicks
+  // still close overlays but hide the pane itself to avoid flashes.
+  const hiddenStyle = {
+    visibility: isReady ? "visible" : "hidden",
+    pointerEvents: isReady ? "auto" : "none"
+  };
+  const controlProps = {
+    id: controlId,
+    dir: state.domainStates.globalDir,
+    titleText: props.title,
+    contentHtml: props.contentHtml,
+    brightnessValueOnDim: "0.2",
+    onClose: handleClose,
+    ...(props === null || props === void 0 ? void 0 : props.controlProps)
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  };
+
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CitationDim, {
+    brightness: "0.2"
+  }), /*#__PURE__*/React.createElement("div", {
+    style: Object.assign({}, mergedStyle, hiddenStyle, {
+      display: "flex",
+      flexDirection: "column",
+      zIndex: 10001
+    })
+  }, /*#__PURE__*/React.createElement(CitationPane, {
+    controlProps: controlProps,
+    styleProps: props === null || props === void 0 ? void 0 : props.styleProps
+  })));
+};
+export default CitationPaneStateful;

package/lib/esm/components/citationpanestateful/common/defaultProps/defaultCitationPaneProps.js

@@ -0,0 +1,61 @@
+export const defaultCitationPaneStyles = {
+  pane: {
+    position: "fixed",
+    left: "50%",
+    top: "18%",
+    transform: "translateX(-50%)",
+    background: "#fff",
+    width: "85%",
+    height: "85%",
+    overflowY: "auto",
+    overflowX: "hidden",
+    padding: 16,
+    borderRadius: 6,
+    zIndex: 10001,
+    boxSizing: "border-box"
+  }
+};
+export const defaultCitationContentCSS = controlId => `
+    #${controlId} .citation-content {
+        flex: 1;
+        min-height: 0; /* allow flex child to scroll */
+        overflow-y: auto;
+        overflow-x: auto;
+        margin-bottom: 12px;
+        white-space: normal; /* wrap normal text */
+        word-break: break-word;
+        -webkit-overflow-scrolling: touch;
+    }
+
+    #${controlId} .citation-content pre,
+    #${controlId} .citation-content code {
+        white-space: pre; /* preserve formatting */
+    }
+
+    #${controlId} .citation-content table {
+        width: 100%;
+        border-collapse: collapse;
+        margin-bottom: 12px;
+        table-layout: auto;
+        overflow-x: auto;
+        display: block;
+    }
+
+    #${controlId} .citation-content table th,
+    #${controlId} .citation-content table td {
+        padding: 8px 12px;
+        border: 1px solid rgba(0,0,0,0.08);
+        text-align: left;
+        vertical-align: top;
+        word-break: break-word;
+    }
+
+    #${controlId} .citation-content img {
+        max-width: 100%;
+        height: auto;
+    }
+`;
+export default {
+  defaultCitationPaneStyles,
+  defaultCitationContentCSS
+};