@microsoft/omnichannel-chat-widget 0.1.0-main.e170704 → 0.1.0-main.e312ecd

package/lib/cjs/components/proactivechatpanestateful/ProactiveChatPaneStateful.js

@@ -46,6 +46,14 @@ const ProactiveChatPaneStateful = props => {
   const handleProactiveChatInviteTimeout = () => {
     if (!timeoutRemoved) {
       setTimeoutRemoved(true);
+      dispatch({
+        type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_PROACTIVE_CHAT_PARAMS,
+        payload: {
+          proactiveChatBodyTitle: "",
+          proactiveChatEnablePrechat: false,
+          proactiveChatInNewWindow: false
+        }
+      });
       dispatch({
         type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE,
         payload: _ConversationState.ConversationState.Closed
@@ -111,13 +119,21 @@ const ProactiveChatPaneStateful = props => {
         Description: "Proactive chat closed."
       });
 
+      dispatch({
+        type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_PROACTIVE_CHAT_PARAMS,
+        payload: {
+          proactiveChatBodyTitle: "",
+          proactiveChatEnablePrechat: false,
+          proactiveChatInNewWindow: false
+        }
+      });
       dispatch({
         type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE,
         payload: _ConversationState.ConversationState.Closed
       });
     },
     ...(proactiveChatProps === null || proactiveChatProps === void 0 ? void 0 : proactiveChatProps.controlProps),
-    bodyTitleText: state.appStates.proactiveChatStates.proactiveChatBodyTitle ?? (proactiveChatProps === null || proactiveChatProps === void 0 ? void 0 : (_proactiveChatProps$c = proactiveChatProps.controlProps) === null || _proactiveChatProps$c === void 0 ? void 0 : _proactiveChatProps$c.bodyTitleText)
+    bodyTitleText: state.appStates.proactiveChatStates.proactiveChatBodyTitle ? state.appStates.proactiveChatStates.proactiveChatBodyTitle : proactiveChatProps === null || proactiveChatProps === void 0 ? void 0 : (_proactiveChatProps$c = proactiveChatProps.controlProps) === null || _proactiveChatProps$c === void 0 ? void 0 : _proactiveChatProps$c.bodyTitleText
   };
   (0, _react.useEffect)(() => {
     (0, _utils.setFocusOnElement)(document.getElementById(controlProps.id + "-startbutton"));

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

@@ -25,15 +25,59 @@ var _utils = require("../../common/utils");
 
 var _ = require("../..");
 
+var _WebChatActionType = require("./webchatcontroller/enums/WebChatActionType");
+
+var _WebChatStoreLoader = require("./webchatcontroller/WebChatStoreLoader");
+
+var _Constants = require("../../common/Constants");
+
+var _BotMagicCodeStore = require("./webchatcontroller/BotMagicCodeStore");
+
+var _defaultAdaptiveCardStyles = require("./common/defaultStyles/defaultAdaptiveCardStyles");
+
+var _defaultReceivedMessageAnchorStyles = require("./webchatcontroller/middlewares/renderingmiddlewares/defaultStyles/defaultReceivedMessageAnchorStyles");
+
 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; }
 
+const broadcastChannelMessageEvent = "message";
+
+const postActivity = activity => {
+  // eslint-disable-line @typescript-eslint/no-explicit-any
+  return {
+    type: _WebChatActionType.WebChatActionType.DIRECT_LINE_POST_ACTIVITY,
+    meta: {
+      method: "keyboard"
+    },
+    payload: {
+      activity: {
+        channelData: undefined,
+        text: "",
+        textFormat: "plain",
+        type: _Constants.Constants.message,
+        ...activity
+      }
+    }
+  };
+};
+
+const createMagicCodeSuccessResponse = signin => {
+  return {
+    signin,
+    result: "Success"
+  };
+};
+
 const WebChatContainerStateful = props => {
+  var _props$adaptiveCardSt, _props$adaptiveCardSt2, _props$renderingMiddl, _props$renderingMiddl2, _props$renderingMiddl3, _props$renderingMiddl4;
+
   const {
     BasicWebChat
   } = _botframeworkWebchat.Components;
   const [state, dispatch] = (0, _.useChatContextStore)();
+  const magicCodeBroadcastChannel = new BroadcastChannel(_Constants.Constants.magicCodeBroadcastChannel);
+  const magicCodeResponseBroadcastChannel = new BroadcastChannel(_Constants.Constants.magicCodeResponseBroadcastChannel);
   const containerStyles = {
     root: Object.assign({}, _defaultWebChatContainerStatefulProps.defaultWebChatContainerStatefulProps.containerStyles, props === null || props === void 0 ? void 0 : props.containerStyles, {
       display: state.appStates.isMinimized ? "none" : ""
@@ -58,11 +102,61 @@ const WebChatContainerStateful = props => {
       Event: _TelemetryConstants.TelemetryEvent.WebChatLoaded
     });
   }, []);
+  (0, _react2.useEffect)(() => {
+    const eventListener = event => {
+      // eslint-disable-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-empty-function
+      const {
+        data
+      } = event;
+
+      if (_BotMagicCodeStore.BotMagicCodeStore.botOAuthSignInId === data.signin) {
+        const {
+          signin,
+          code
+        } = data;
+        const text = `${code}`;
+        const action = postActivity({
+          text,
+          channelData: {
+            tags: [_Constants.Constants.hiddenTag]
+          }
+        });
+
+        _WebChatStoreLoader.WebChatStoreLoader.store.dispatch(action);
+
+        const response = createMagicCodeSuccessResponse(signin);
+        magicCodeResponseBroadcastChannel.postMessage(response);
+
+        _TelemetryHelper.TelemetryHelper.logActionEvent(_TelemetryConstants.LogLevel.INFO, {
+          Event: _TelemetryConstants.TelemetryEvent.SuppressBotMagicCodeSucceeded
+        });
+
+        _BotMagicCodeStore.BotMagicCodeStore.botOAuthSignInId = "";
+        magicCodeBroadcastChannel.close();
+        magicCodeResponseBroadcastChannel.close();
+      } else {
+        _TelemetryHelper.TelemetryHelper.logActionEvent(_TelemetryConstants.LogLevel.ERROR, {
+          Event: _TelemetryConstants.TelemetryEvent.SuppressBotMagicCodeFailed,
+          Description: "Signin does not match"
+        });
+      }
+    };
+
+    magicCodeBroadcastChannel.addEventListener(broadcastChannelMessageEvent, eventListener);
+  }, []);
   return /*#__PURE__*/_react2.default.createElement(_react2.default.Fragment, null, /*#__PURE__*/_react2.default.createElement("style", null, `
+
+        .webchat__bubble__content>div#ms_lcw_webchat_adaptive_card {
+            background: ${(props === null || props === void 0 ? void 0 : (_props$adaptiveCardSt = props.adaptiveCardStyles) === null || _props$adaptiveCardSt === void 0 ? void 0 : _props$adaptiveCardSt.background) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.background};
+        }
+
+        div[class="ac-textBlock"]>p{color:${(props === null || props === void 0 ? void 0 : (_props$adaptiveCardSt2 = props.adaptiveCardStyles) === null || _props$adaptiveCardSt2 === void 0 ? void 0 : _props$adaptiveCardSt2.color) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.color};}
+
         .ms_lcw_webchat_received_message img.webchat__markdown__external-link-icon { 
             background-image : url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIzIDMgMTggMTgiICB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Ik03LjI1MDEgNC41MDAxN0gxMC43NDk1QzExLjE2MzcgNC41MDAxNyAxMS40OTk1IDQuODM1OTYgMTEuNDk5NSA1LjI1MDE3QzExLjQ5OTUgNS42Mjk4NiAxMS4yMTczIDUuOTQzNjYgMTAuODUxMyA1Ljk5MzMyTDEwLjc0OTUgNi4wMDAxN0g3LjI0OTc0QzYuMDcwNzkgNS45OTk2MSA1LjEwMzQ5IDYuOTA2NTYgNS4wMDc4NiA4LjA2MTEyTDUuMDAwMjggOC4yMjAwM0w1LjAwMzEyIDE2Ljc1MDdDNS4wMDM0MyAxNy45NDE1IDUuOTI4ODUgMTguOTE2MSA3LjA5OTY2IDE4Ljk5NDlMNy4yNTM3MSAxOS4wMDAxTDE1Ljc1MTggMTguOTg4NEMxNi45NDE1IDE4Ljk4NjggMTcuOTE0NSAxOC4wNjIgMTcuOTkzNSAxNi44OTIzTDE3Ljk5ODcgMTYuNzM4NFYxMy4yMzIxQzE3Ljk5ODcgMTIuODE3OSAxOC4zMzQ1IDEyLjQ4MjEgMTguNzQ4NyAxMi40ODIxQzE5LjEyODQgMTIuNDgyMSAxOS40NDIyIDEyLjc2NDMgMTkuNDkxOCAxMy4xMzAzTDE5LjQ5ODcgMTMuMjMyMVYxNi43Mzg0QzE5LjQ5ODcgMTguNzQwNyAxNy45MjkzIDIwLjM3NjkgMTUuOTUyOCAyMC40ODI5TDE1Ljc1MzggMjAuNDg4NEw3LjI1ODI3IDIwLjUwMDFMNy4wNTQ5NSAyMC40OTQ5QzUuMTQyMzkgMjAuMzk1NCAzLjYwODk1IDE4Ljg2MjcgMy41MDgzNyAxNi45NTAyTDMuNTAzMTIgMTYuNzUxMUwzLjUwMDg5IDguMjUyN0wzLjUwNTI5IDguMDUwMkMzLjYwNTM5IDYuMTM3NDkgNS4xMzg2NyA0LjYwNDQ5IDcuMDUwOTYgNC41MDUyN0w3LjI1MDEgNC41MDAxN0gxMC43NDk1SDcuMjUwMVpNMTMuNzQ4MSAzLjAwMTQ2TDIwLjMwMTggMy4wMDE5N0wyMC40MDE0IDMuMDE1NzVMMjAuNTAyMiAzLjA0MzkzTDIwLjU1OSAzLjA2ODAzQzIwLjYxMjIgMy4wOTEyMiAyMC42NjM0IDMuMTIxNjMgMjAuNzExMSAzLjE1ODg1TDIwLjc4MDQgMy4yMjE1NkwyMC44NjQxIDMuMzIwMTRMMjAuOTE4MyAzLjQxMDI1TDIwLjk1NyAzLjUwMDU3TDIwLjk3NjIgMy41NjQ3NkwyMC45ODk4IDMuNjI4NjJMMjAuOTk5MiAzLjcyMjgyTDIwLjk5OTcgMTAuMjU1NEMyMC45OTk3IDEwLjY2OTYgMjAuNjYzOSAxMS4wMDU0IDIwLjI0OTcgMTEuMDA1NEMxOS44NyAxMS4wMDU0IDE5LjU1NjIgMTAuNzIzMiAxOS41MDY1IDEwLjM1NzFMMTkuNDk5NyAxMC4yNTU0TDE5LjQ5ODkgNS41NjE0N0wxMi4yNzk3IDEyLjc4NDdDMTIuMDEzNCAxMy4wNTEgMTEuNTk2OCAxMy4wNzUzIDExLjMwMzEgMTIuODU3NUwxMS4yMTkgMTIuNzg0OUMxMC45NTI3IDEyLjUxODcgMTAuOTI4NCAxMi4xMDIxIDExLjE0NjIgMTEuODA4NEwxMS4yMTg4IDExLjcyNDNMMTguNDM2OSA0LjUwMTQ2SDEzLjc0ODFDMTMuMzY4NCA0LjUwMTQ2IDEzLjA1NDYgNC4yMTkzMSAxMy4wMDUgMy44NTMyNEwxMi45OTgxIDMuNzUxNDZDMTIuOTk4MSAzLjM3MTc3IDEzLjI4MDMgMy4wNTc5NyAxMy42NDY0IDMuMDA4MzFMMTMuNzQ4MSAzLjAwMTQ2WiIgZmlsbD0iI0ZGRkZGRiIgLz48L3N2Zz4) !important;
             height: '.75em';
-            marginLeft: '.25em'; 
+            marginLeft: '.25em';
+            filter:${(props === null || props === void 0 ? void 0 : (_props$renderingMiddl = props.renderingMiddlewareProps) === null || _props$renderingMiddl === void 0 ? void 0 : (_props$renderingMiddl2 = _props$renderingMiddl.receivedMessageAnchorStyles) === null || _props$renderingMiddl2 === void 0 ? void 0 : _props$renderingMiddl2.filter) ?? "none"};
         }
         pre {
             white-space: pre-wrap;
@@ -75,7 +169,7 @@ 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: white;
+            color: ${(props === null || props === void 0 ? void 0 : (_props$renderingMiddl3 = props.renderingMiddlewareProps) === null || _props$renderingMiddl3 === void 0 ? void 0 : (_props$renderingMiddl4 = _props$renderingMiddl3.receivedMessageAnchorStyles) === null || _props$renderingMiddl4 === void 0 ? void 0 : _props$renderingMiddl4.color) ?? (_defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === null || _defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === void 0 ? void 0 : _defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles.color)};
         } `), /*#__PURE__*/_react2.default.createElement(_react.Stack, {
     styles: containerStyles
   }, /*#__PURE__*/_react2.default.createElement(BasicWebChat, null)));

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

@@ -13,6 +13,8 @@ var _defaultWebChatStatefulProps = require("./defaultWebChatStatefulProps");
 
 var _defaultWebChatContainerStatefulStyles = require("../defaultStyles/defaultWebChatContainerStatefulStyles");
 
+var _defaultAdaptiveCardStyles = require("../defaultStyles/defaultAdaptiveCardStyles");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const defaultWebChatContainerStatefulProps = {
@@ -21,6 +23,7 @@ const defaultWebChatContainerStatefulProps = {
   containerStyles: _defaultWebChatStatefulContainerStyles.defaultWebChatStatefulContainerStyles,
   disableNewLineMarkdownSupport: false,
   disableMarkdownMessageFormatting: false,
-  directLine: new _mockadapter.default()
+  directLine: new _mockadapter.default(),
+  adaptiveCardStyles: _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles
 };
 exports.defaultWebChatContainerStatefulProps = defaultWebChatContainerStatefulProps;

package/lib/cjs/components/webchatcontainerstateful/common/defaultStyles/defaultAdaptiveCardStyles.js

@@ -0,0 +1,11 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.defaultAdaptiveCardStyles = void 0;
+const defaultAdaptiveCardStyles = {
+  background: "white",
+  color: "black"
+};
+exports.defaultAdaptiveCardStyles = defaultAdaptiveCardStyles;

package/lib/cjs/components/webchatcontainerstateful/common/mockchatsdk.js

@@ -14,6 +14,8 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 class MockChatSDK {
   constructor() {
     _defineProperty(this, "sleep", ms => new Promise(r => setTimeout(r, ms)));
+
+    _defineProperty(this, "isMockModeOn", true);
   }
 
   async startChat() {

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

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

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

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

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

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.BotMagicCodeStore = void 0;
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+class BotMagicCodeStore {}
+
+exports.BotMagicCodeStore = BotMagicCodeStore;
+
+_defineProperty(BotMagicCodeStore, "botOAuthSignInId", "");

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

@@ -75,6 +75,16 @@ const handleSystemMessage = (next, args, card, systemMessageStyleProps) => {
 }; // eslint-disable-next-line @typescript-eslint/no-explicit-any
 
 
+const isTagIncluded = (card, tag) => {
+  return isDataTagsPresent(card) && card.activity.channelData.tags.includes(tag);
+}; // eslint-disable-next-line @typescript-eslint/no-explicit-any
+
+
+const isDataTagsPresent = card => {
+  return card && card.activity && card.activity.channelData && card.activity.channelData.tags && card.activity.channelData.tags.length > 0;
+}; // eslint-disable-next-line @typescript-eslint/no-explicit-any
+
+
 const createActivityMiddleware = (systemMessageStyleProps, userMessageStyleProps) => () => next => function () {
   for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
     args[_key] = arguments[_key];
@@ -83,7 +93,7 @@ const createActivityMiddleware = (systemMessageStyleProps, userMessageStyleProps
   const [card] = args;
 
   if (card.activity) {
-    var _card$activity$from, _card$activity$channe4, _card$activity$channe5;
+    var _card$activity$from;
 
     if (((_card$activity$from = card.activity.from) === null || _card$activity$from === void 0 ? void 0 : _card$activity$from.role) === _DirectLineSenderRole.DirectLineSenderRole.Channel) {
       var _card$activity$channe3;
@@ -98,7 +108,11 @@ const createActivityMiddleware = (systemMessageStyleProps, userMessageStyleProps
       return () => false;
     }
 
-    if ((_card$activity$channe4 = card.activity.channelData) !== null && _card$activity$channe4 !== void 0 && (_card$activity$channe5 = _card$activity$channe4.tags) !== null && _card$activity$channe5 !== void 0 && _card$activity$channe5.includes(_Constants.Constants.systemMessageTag)) {
+    if (isTagIncluded(card, _Constants.Constants.hiddenTag)) {
+      return () => false;
+    }
+
+    if (isTagIncluded(card, _Constants.Constants.systemMessageTag)) {
       return handleSystemMessage(next, args, card, systemMessageStyleProps);
     } else 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/activityStatusMiddleware.js

@@ -76,7 +76,8 @@ const activityStatusMiddleware = () => next => args => {
       args: args,
       role: current_role,
       name: current_name
-    }));
+    })) // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    ;
   }
 };
 

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

@@ -0,0 +1,52 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createCardActionMiddleware = void 0;
+
+var _BotMagicCodeStore = require("../../BotMagicCodeStore");
+
+var CardActionType;
+
+(function (CardActionType) {
+  CardActionType["OpenUrl"] = "openUrl";
+  CardActionType["SignIn"] = "signin";
+})(CardActionType || (CardActionType = {}));
+
+const validCardActionTypes = [CardActionType.OpenUrl, CardActionType.SignIn];
+const botOauthUrlRegex = /[\S]+.botframework.com\/api\/oauth\/signin\?signin=([\S]+)/;
+
+const createCardActionMiddleware = botMagicCodeConfig => {
+  const cardActionMiddleware = () => next => function () {
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    // eslint-disable-line @typescript-eslint/no-explicit-any
+    const [card] = args;
+
+    if (card.cardAction && validCardActionTypes.indexOf(card.cardAction.type) >= 0 && card.cardAction.value) {
+      // Override signin url only if fwdUrl is valid & feature is enabled
+      if ((botMagicCodeConfig === null || botMagicCodeConfig === void 0 ? void 0 : botMagicCodeConfig.disabled) === true && botMagicCodeConfig !== null && botMagicCodeConfig !== void 0 && botMagicCodeConfig.fwdUrl) {
+        const baseUrl = window.location.origin;
+        const result = botOauthUrlRegex.exec(card.cardAction.value);
+
+        if (result) {
+          _BotMagicCodeStore.BotMagicCodeStore.botOAuthSignInId = `${result[1]}`;
+        } // fwdUrl must be on the same domain as the chat widget
+
+
+        if (botMagicCodeConfig !== null && botMagicCodeConfig !== void 0 && botMagicCodeConfig.fwdUrl.startsWith(baseUrl)) {
+          card.cardAction.value += `&fwdUrl=${botMagicCodeConfig.fwdUrl}`;
+        }
+      }
+    }
+
+    return next(...args);
+  };
+
+  return cardActionMiddleware;
+};
+
+exports.createCardActionMiddleware = createCardActionMiddleware;

package/lib/cjs/components/webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/cardActionMiddleware.spec.js

@@ -0,0 +1,98 @@
+"use strict";
+
+require("@testing-library/jest-dom/extend-expect");
+
+var _cardActionMiddleware = require("./cardActionMiddleware");
+
+describe("cardActionMiddleware test", () => {
+  it("createCardActionMiddleware() with undefined botMagicCodeConfig should not change the sign in card url", () => {
+    const next = args => args; // eslint-disable-line @typescript-eslint/no-explicit-any
+
+
+    const signInUrl = "https://token.botframework.com/api/oauth/signin?signin=[signin]";
+    const args = {
+      cardAction: {
+        type: "signin",
+        value: signInUrl
+      }
+    };
+    const results = (0, _cardActionMiddleware.createCardActionMiddleware)(undefined)()(next)(args);
+    expect(signInUrl).toEqual(results.cardAction.value);
+  });
+  it("createCardActionMiddleware() with botMagicCode enabled should not change the sign in card url", () => {
+    const botMagicCodeConfig = {
+      disabled: false
+    };
+
+    const next = args => args; // eslint-disable-line @typescript-eslint/no-explicit-any
+
+
+    const signInUrl = "https://token.botframework.com/api/oauth/signin?signin=[signin]";
+    const args = {
+      cardAction: {
+        type: "signin",
+        value: signInUrl
+      }
+    };
+    const results = (0, _cardActionMiddleware.createCardActionMiddleware)(botMagicCodeConfig)()(next)(args);
+    expect(args.cardAction.value).toEqual(results.cardAction.value);
+  });
+  it("createCardActionMiddleware() with botMagicCode disabled & no fwdUrl should not change the sign in card url", () => {
+    const botMagicCodeConfig = {
+      disabled: true
+    };
+
+    const next = args => args; // eslint-disable-line @typescript-eslint/no-explicit-any
+
+
+    const signInUrl = "https://token.botframework.com/api/oauth/signin?signin=[signin]";
+    const args = {
+      cardAction: {
+        type: "signin",
+        value: signInUrl
+      }
+    };
+    const results = (0, _cardActionMiddleware.createCardActionMiddleware)(botMagicCodeConfig)()(next)(args);
+    expect(args.cardAction.value).toEqual(results.cardAction.value);
+  });
+  it("createCardActionMiddleware() with botMagicCode disabled & fwdUrl should append the fwdUrl in the sign in card url", () => {
+    const botMagicCodeConfig = {
+      disabled: true,
+      fwdUrl: "http://localhost/forwarder.html"
+    };
+
+    const next = args => args; // eslint-disable-line @typescript-eslint/no-explicit-any
+
+
+    const signInUrl = "https://token.botframework.com/api/oauth/signin?signin=[signin]";
+    const args = {
+      cardAction: {
+        type: "signin",
+        value: signInUrl
+      }
+    };
+    const results = (0, _cardActionMiddleware.createCardActionMiddleware)(botMagicCodeConfig)()(next)(args);
+    expect(signInUrl === results.cardAction.value).toBe(false);
+    expect(results.cardAction.value === `${signInUrl}&fwdUrl=${botMagicCodeConfig.fwdUrl}`).toBe(true);
+  });
+  it("createCardActionMiddleware() should not append fwdUrl if fwdUrl & sign in card url are not in the same domain", () => {
+    const botMagicCodeConfig = {
+      disabled: true,
+      fwdUrl: "https://localhost/forwarder.html"
+    };
+
+    const next = args => args; // eslint-disable-line @typescript-eslint/no-explicit-any
+
+
+    const signInUrl = "https://token.botframework.com/api/oauth/signin?signin=[signin]";
+    const args = {
+      cardAction: {
+        type: "signin",
+        value: signInUrl
+      }
+    };
+    const results = (0, _cardActionMiddleware.createCardActionMiddleware)(botMagicCodeConfig)()(next)(args);
+    expect(signInUrl === results.cardAction.value).toBe(true);
+    expect(results.cardAction.value === `${signInUrl}&fwdUrl=${botMagicCodeConfig.fwdUrl}`).toBe(false);
+  });
+});

package/lib/cjs/components/webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/defaultStyles/defaultReceivedMessageAnchorStyles.js

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.defaultReceivedMessageAnchorStyles = void 0;
+const defaultReceivedMessageAnchorStyles = {
+  color: "white"
+};
+exports.defaultReceivedMessageAnchorStyles = defaultReceivedMessageAnchorStyles;

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

@@ -0,0 +1,117 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _WebChatActionType = require("../../enums/WebChatActionType");
+
+var _Constants = require("../../../../../common/Constants");
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unused-vars
+const createMessageTimeStampMiddleware = _ref => {
+  let {
+    dispatch
+  } = _ref;
+  return next => action => {
+    if (isApplicable(action)) {
+      return next(evaluateTagsAndOverrideTimeStamp(action));
+    }
+
+    return next(action);
+  };
+};
+
+const isApplicable = action => {
+  return action.type === _WebChatActionType.WebChatActionType.DIRECT_LINE_INCOMING_ACTIVITY && isPVAConversation(action) && isPayloadValid(action) && isValidChannel(action);
+};
+
+const isPayloadValid = action => {
+  var _action$payload;
+
+  return action === null || action === void 0 ? void 0 : (_action$payload = action.payload) === null || _action$payload === void 0 ? void 0 : _action$payload.activity;
+};
+
+const isValidChannel = action => {
+  var _action$payload2, _action$payload2$acti;
+
+  return (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.channelId) === _Constants.Constants.acsChannel;
+};
+
+const isPVAConversation = action => {
+  return !isTagIncluded(action, _Constants.Constants.systemMessageTag) && !isTagIncluded(action, _Constants.Constants.publicMessageTag) && !isRoleUserOn(action);
+}; // eslint-disable-next-line @typescript-eslint/no-explicit-any
+
+
+const isTagIncluded = (action, tag) => {
+  return isDataTagsPresent(action) && action.payload.activity.channelData.tags.includes(tag);
+};
+
+const isRoleUserOn = action => {
+  var _action$payload3, _action$payload3$acti, _action$payload3$acti2;
+
+  return (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$acti2 = _action$payload3$acti.from) === null || _action$payload3$acti2 === void 0 ? void 0 : _action$payload3$acti2.role) === _Constants.Constants.userMessageTag;
+};
+
+const overrideTimeStamp = (timestampOriginal, timeStampNew) => {
+  return isTimestampValid(timeStampNew) ? timeStampNew : timestampOriginal;
+};
+
+const isTimestampValid = timeStamp => {
+  const regex = /(\d{4}-(0[1-9]|1[0-2])-(0[1-9]|[12]\d|3[01])(T)(\d{2})(:{1})(\d{2})(:{1})(\d{2})(.\d+)([Z]{1}))/;
+  return regex.test(timeStamp);
+};
+
+const isDataTagsPresent = action => {
+  var _action$payload4, _action$payload4$acti, _action$payload4$acti2;
+
+  return (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$acti2 = _action$payload4$acti.channelData) === null || _action$payload4$acti2 === void 0 ? void 0 : _action$payload4$acti2.tags) && action.payload.activity.channelData.tags.length > 0;
+};
+
+const evaluateTagsAndOverrideTimeStamp = action => {
+  const tagValue = tagLookup(action, _Constants.Constants.prefixTimestampTag);
+
+  if (tagValue) {
+    const newTimestamp = extractTimeStamp(tagValue);
+    action.payload.activity.timestamp = overrideTimeStamp(action.payload.activity.timestamp, newTimestamp);
+  }
+
+  return action;
+};
+
+const extractTimeStamp = timeStamp => {
+  if (timeStamp && timeStamp.length > 0) {
+    const ts = timeStamp.split(_Constants.Constants.prefixTimestampTag);
+
+    if (ts && ts.length > 1) {
+      return ts[1];
+    }
+  }
+
+  return timeStamp;
+};
+
+const tagLookup = (action, tag) => {
+  if (!isDataTagsPresent(action)) {
+    return null;
+  }
+
+  const tags = action.payload.activity.channelData.tags;
+  let value;
+
+  if (tags && tags.length > 0) {
+    for (let i = 0; i < tags.length; i++) {
+      value = tags[i];
+
+      if (value && value.indexOf(tag) > -1) {
+        return value;
+      }
+    }
+  }
+
+  return null;
+};
+
+var _default = createMessageTimeStampMiddleware;
+exports.default = _default;

package/lib/cjs/components/webchatcontainerstateful/webchatcontroller/webchattelemetry/WebChatLogger.js

@@ -10,6 +10,7 @@ var _TelemetryConstants = require("../../../../common/telemetry/TelemetryConstan
 var _TelemetryHelper = require("../../../../common/telemetry/TelemetryHelper");
 
 function createWebChatTelemetry() {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const handleTelemetry = event => {
     const {
       level

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

@@ -15,6 +15,7 @@ exports.ConversationState = ConversationState;
   ConversationState[ConversationState["ProactiveChat"] = 4] = "ProactiveChat";
   ConversationState[ConversationState["Active"] = 5] = "Active";
   ConversationState[ConversationState["InActive"] = 6] = "InActive";
-  ConversationState[ConversationState["Postchat"] = 7] = "Postchat";
-  ConversationState[ConversationState["Closed"] = 8] = "Closed";
+  ConversationState[ConversationState["PostchatLoading"] = 7] = "PostchatLoading";
+  ConversationState[ConversationState["Postchat"] = 8] = "Postchat";
+  ConversationState[ConversationState["Closed"] = 9] = "Closed";
 })(ConversationState || (exports.ConversationState = ConversationState = {}));

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

@@ -39,4 +39,7 @@ exports.LiveChatWidgetActionType = LiveChatWidgetActionType;
   LiveChatWidgetActionType[LiveChatWidgetActionType["SET_CONVERSATION_ENDED_BY_AGENT"] = 28] = "SET_CONVERSATION_ENDED_BY_AGENT";
   LiveChatWidgetActionType[LiveChatWidgetActionType["SET_WIDGET_STATE"] = 29] = "SET_WIDGET_STATE";
   LiveChatWidgetActionType[LiveChatWidgetActionType["SET_LIVE_CHAT_CONTEXT"] = 30] = "SET_LIVE_CHAT_CONTEXT";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_BOT_OAUTH_SIGNIN_ID"] = 31] = "SET_BOT_OAUTH_SIGNIN_ID";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_WIDGET_SIZE"] = 32] = "SET_WIDGET_SIZE";
+  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_WIDGET_INSTANCE_ID"] = 33] = "SET_WIDGET_INSTANCE_ID";
 })(LiveChatWidgetActionType || (exports.LiveChatWidgetActionType = LiveChatWidgetActionType = {}));

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

@@ -9,11 +9,18 @@ var _ConversationState = require("./ConversationState");
 
 var _defaultMiddlewareLocalizedTexts = require("../../components/webchatcontainerstateful/common/defaultProps/defaultMiddlewareLocalizedTexts");
 
+var _utils = require("../../common/utils");
+
+var _defaultClientDataStoreProvider = require("../../common/storage/default/defaultClientDataStoreProvider");
+
 const getLiveChatWidgetContextInitialState = props => {
-  var _props$webChatContain;
+  var _props$chatSDK, _props$chatSDK$omnich, _props$chatSDK2, _props$chatSDK2$omnic, _props$controlProps, _props$webChatContain;
+
+  const widgetCacheId = (0, _utils.getWidgetCacheId)(props === null || props === void 0 ? void 0 : (_props$chatSDK = props.chatSDK) === null || _props$chatSDK === void 0 ? void 0 : (_props$chatSDK$omnich = _props$chatSDK.omnichannelConfig) === null || _props$chatSDK$omnich === void 0 ? void 0 : _props$chatSDK$omnich.orgId, props === null || props === void 0 ? void 0 : (_props$chatSDK2 = props.chatSDK) === null || _props$chatSDK2 === void 0 ? void 0 : (_props$chatSDK2$omnic = _props$chatSDK2.omnichannelConfig) === null || _props$chatSDK2$omnic === void 0 ? void 0 : _props$chatSDK2$omnic.widgetId, (props === null || props === void 0 ? void 0 : (_props$controlProps = props.controlProps) === null || _props$controlProps === void 0 ? void 0 : _props$controlProps.widgetInstanceId) ?? "");
+  const initialState = (0, _defaultClientDataStoreProvider.defaultClientDataStoreProvider)().getData(widgetCacheId, "localStorage");
 
-  if (props !== null && props !== void 0 && props.liveChatContextFromCache) {
-    return props === null || props === void 0 ? void 0 : props.liveChatContextFromCache;
+  if (!(0, _utils.isNullOrUndefined)(initialState)) {
+    return JSON.parse(initialState);
   }
 
   const LiveChatWidgetContextInitialState = {
@@ -28,14 +35,15 @@ const getLiveChatWidgetContextInitialState = props => {
       telemetryInternalData: {},
       globalDir: "ltr",
       liveChatContext: undefined,
-      customContext: undefined
+      customContext: undefined,
+      widgetSize: undefined,
+      widgetInstanceId: ""
     },
     appStates: {
       conversationState: _ConversationState.ConversationState.Closed,
       isMinimized: false,
       previousElementOnFocusBeforeModalOpen: null,
       outsideOperatingHours: false,
-      shouldShowPostChat: false,
       preChatResponseEmail: "",
       isAudioMuted: null,
       newMessage: false,