@microsoft/omnichannel-chat-widget 0.1.0-main.01a30be

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

@@ -0,0 +1,132 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.ProactiveChatPaneStateful = void 0;
+var _TelemetryConstants = require("../../common/telemetry/TelemetryConstants");
+var _react = _interopRequireWildcard(require("react"));
+var _utils = require("../../common/utils");
+var _omnichannelChatComponents = require("@microsoft/omnichannel-chat-components");
+var _Constants = require("../../common/Constants");
+var _ConversationState = require("../../contexts/common/ConversationState");
+var _LiveChatWidgetActionType = require("../../contexts/common/LiveChatWidgetActionType");
+var _TelemetryHelper = require("../../common/telemetry/TelemetryHelper");
+var _TelemetryManager = require("../../common/telemetry/TelemetryManager");
+var _useChatContextStore = _interopRequireDefault(require("../../hooks/useChatContextStore"));
+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-next-line @typescript-eslint/no-explicit-any
+const ProactiveChatPaneStateful = props => {
+  var _proactiveChatProps$c;
+  const [state, dispatch] = (0, _useChatContextStore.default)();
+  const {
+    proactiveChatProps,
+    startChat
+  } = props;
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  const [timeoutRemoved, setTimeoutRemoved] = (0, _react.useState)(false);
+  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
+      });
+      _TelemetryHelper.TelemetryHelper.logActionEvent(_TelemetryConstants.LogLevel.INFO, {
+        Event: _TelemetryConstants.TelemetryEvent.ProactiveChatRejected,
+        ElapsedTimeInMilliseconds: _TelemetryManager.TelemetryTimers.LcwLoadToChatButtonTimer.milliSecondsElapsed,
+        Description: "Proactive chat invitation timed out."
+      });
+    }
+  };
+  const controlProps = {
+    id: "oc-lcw-proactivechat",
+    dir: state.domainStates.globalDir,
+    onStart: async () => {
+      var _state$domainStates$l, _state$domainStates$l2;
+      setTimeoutRemoved(true);
+      _TelemetryHelper.TelemetryHelper.logActionEvent(_TelemetryConstants.LogLevel.INFO, {
+        Event: _TelemetryConstants.TelemetryEvent.ProactiveChatAccepted,
+        Description: "Proactive chat accepted."
+      });
+      if (state.appStates.proactiveChatStates.proactiveChatInNewWindow) {
+        // TODO: BroadcastService: replace with the sdk broadcast service, when in place
+        const startPopoutChatEvent = {
+          eventName: _TelemetryConstants.BroadcastEvent.ProactiveChatStartPopoutChat
+        };
+        _omnichannelChatComponents.BroadcastService.postMessage(startPopoutChatEvent);
+        dispatch({
+          type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE,
+          payload: _ConversationState.ConversationState.Closed
+        });
+      } else if (((_state$domainStates$l = state.domainStates.liveChatConfig) === null || _state$domainStates$l === void 0 ? void 0 : (_state$domainStates$l2 = _state$domainStates$l.LiveWSAndLiveChatEngJoin) === null || _state$domainStates$l2 === void 0 ? void 0 : _state$domainStates$l2.OutOfOperatingHours) === "True") {
+        dispatch({
+          type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_OUTSIDE_OPERATING_HOURS,
+          payload: true
+        });
+        dispatch({
+          type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE,
+          payload: _ConversationState.ConversationState.OutOfOffice
+        });
+      } else {
+        const proactiveChatStarted = {
+          eventName: _TelemetryConstants.BroadcastEvent.ProactiveChatStartChat
+        };
+        _omnichannelChatComponents.BroadcastService.postMessage(proactiveChatStarted);
+        await startChat();
+      }
+    },
+    onClose: () => {
+      setTimeoutRemoved(true);
+      _TelemetryHelper.TelemetryHelper.logActionEvent(_TelemetryConstants.LogLevel.INFO, {
+        Event: _TelemetryConstants.TelemetryEvent.ProactiveChatClosed,
+        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 ? 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"));
+    _TelemetryManager.TelemetryTimers.ProactiveChatScreenTimer = (0, _utils.createTimer)();
+    const timeoutEvent = setTimeout(() => {
+      handleProactiveChatInviteTimeout();
+    }, (proactiveChatProps === null || proactiveChatProps === void 0 ? void 0 : proactiveChatProps.ProactiveChatInviteTimeoutInMs) ?? _Constants.Constants.ProactiveChatInviteTimeoutInMs);
+    _TelemetryHelper.TelemetryHelper.logLoadingEvent(_TelemetryConstants.LogLevel.INFO, {
+      Event: _TelemetryConstants.TelemetryEvent.ProactiveChatPaneLoaded
+    });
+    return () => {
+      clearTimeout(timeoutEvent);
+    };
+  }, []);
+  return /*#__PURE__*/_react.default.createElement(_omnichannelChatComponents.ProactiveChatPane, {
+    componentOverrides: proactiveChatProps === null || proactiveChatProps === void 0 ? void 0 : proactiveChatProps.componentOverrides,
+    controlProps: controlProps,
+    styleProps: proactiveChatProps === null || proactiveChatProps === void 0 ? void 0 : proactiveChatProps.styleProps
+  });
+};
+exports.ProactiveChatPaneStateful = ProactiveChatPaneStateful;
+var _default = ProactiveChatPaneStateful;
+exports.default = _default;

package/lib/cjs/components/proactivechatpanestateful/interfaces/IProactiveChatNotificationConfig.js

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

package/lib/cjs/components/proactivechatpanestateful/interfaces/IProactiveChatPaneStatefulProps.js

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

package/lib/cjs/components/reconnectchatpanestateful/ReconnectChatPaneStateful.js

@@ -0,0 +1,107 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.ReconnectChatPaneStateful = void 0;
+var _TelemetryConstants = require("../../common/telemetry/TelemetryConstants");
+var _react = _interopRequireWildcard(require("react"));
+var _ConversationState = require("../../contexts/common/ConversationState");
+var _LiveChatWidgetActionType = require("../../contexts/common/LiveChatWidgetActionType");
+var _omnichannelChatComponents = require("@microsoft/omnichannel-chat-components");
+var _TelemetryHelper = require("../../common/telemetry/TelemetryHelper");
+var _utils = require("../../common/utils");
+var _useChatContextStore = _interopRequireDefault(require("../../hooks/useChatContextStore"));
+var _useChatSDKStore = _interopRequireDefault(require("../../hooks/useChatSDKStore"));
+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; }
+const ReconnectChatPaneStateful = props => {
+  const [state, dispatch] = (0, _useChatContextStore.default)();
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  const chatSDK = (0, _useChatSDKStore.default)();
+  const {
+    reconnectChatProps,
+    initStartChat
+  } = props;
+  const startChat = async continueChat => {
+    dispatch({
+      type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE,
+      payload: _ConversationState.ConversationState.Loading
+    });
+    if (continueChat && state.appStates.reconnectId) {
+      const optionalParams = {
+        reconnectId: state.appStates.reconnectId
+      };
+      await initStartChat(optionalParams);
+    } else {
+      var _state$domainStates;
+      dispatch({
+        type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_RECONNECT_ID,
+        payload: undefined
+      });
+      chatSDK.requestId = state === null || state === void 0 ? void 0 : (_state$domainStates = state.domainStates) === null || _state$domainStates === void 0 ? void 0 : _state$domainStates.initialChatSdkRequestId;
+      const parseToJson = false;
+      const preChatSurveyResponse = await chatSDK.getPreChatSurvey(parseToJson);
+      if (preChatSurveyResponse) {
+        dispatch({
+          type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_PRE_CHAT_SURVEY_RESPONSE,
+          payload: preChatSurveyResponse
+        });
+        dispatch({
+          type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE,
+          payload: _ConversationState.ConversationState.Prechat
+        });
+      } else {
+        dispatch({
+          type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_CONVERSATION_STATE,
+          payload: _ConversationState.ConversationState.Loading
+        });
+        await initStartChat();
+      }
+    }
+  };
+  const controlProps = {
+    id: "lcw-components-reconnect-chat-pane",
+    dir: state.domainStates.globalDir,
+    onContinueChat: () => {
+      _TelemetryHelper.TelemetryHelper.logActionEvent(_TelemetryConstants.LogLevel.INFO, {
+        Event: _TelemetryConstants.TelemetryEvent.ReconnectChatContinueConversation,
+        Description: "Reconnect chat continue conversation button clicked."
+      });
+      startChat(true);
+    },
+    onStartNewChat: () => {
+      _TelemetryHelper.TelemetryHelper.logActionEvent(_TelemetryConstants.LogLevel.INFO, {
+        Event: _TelemetryConstants.TelemetryEvent.ReconnectChatStartNewConversation,
+        Description: "Reconnect chat start new conversation button clicked."
+      });
+      startChat(false);
+    },
+    onMinimize: () => {
+      _TelemetryHelper.TelemetryHelper.logActionEvent(_TelemetryConstants.LogLevel.INFO, {
+        Event: _TelemetryConstants.TelemetryEvent.ReconnectChatMinimize,
+        Description: "Reconnect chat minimized."
+      });
+      dispatch({
+        type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_MINIMIZED,
+        payload: true
+      });
+    },
+    ...(reconnectChatProps === null || reconnectChatProps === void 0 ? void 0 : reconnectChatProps.controlProps)
+  };
+  (0, _react.useEffect)(() => {
+    (0, _utils.setFocusOnElement)(document.getElementById(controlProps.id));
+    _TelemetryHelper.TelemetryHelper.logLoadingEvent(_TelemetryConstants.LogLevel.INFO, {
+      Event: _TelemetryConstants.TelemetryEvent.ReconnectChatPaneLoaded
+    });
+  }, []);
+  return /*#__PURE__*/_react.default.createElement(_omnichannelChatComponents.ReconnectChatPane, {
+    componentOverrides: reconnectChatProps === null || reconnectChatProps === void 0 ? void 0 : reconnectChatProps.componentOverrides,
+    controlProps: controlProps,
+    styleProps: reconnectChatProps === null || reconnectChatProps === void 0 ? void 0 : reconnectChatProps.styleProps
+  });
+};
+exports.ReconnectChatPaneStateful = ReconnectChatPaneStateful;
+var _default = ReconnectChatPaneStateful;
+exports.default = _default;

package/lib/cjs/components/reconnectchatpanestateful/interfaces/IReconnectChatContext.js

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

package/lib/cjs/components/reconnectchatpanestateful/interfaces/IReconnectChatOptionalParams.js

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

package/lib/cjs/components/reconnectchatpanestateful/interfaces/IReconnectChatPaneStatefulParams.js

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

package/lib/cjs/components/reconnectchatpanestateful/interfaces/IReconnectChatPaneStatefulProps.js

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

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

@@ -0,0 +1,161 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.WebChatContainerStateful = void 0;
+var _react = require("@fluentui/react");
+var _TelemetryConstants = require("../../common/telemetry/TelemetryConstants");
+var _react2 = _interopRequireWildcard(require("react"));
+var _botframeworkWebchat = require("botframework-webchat");
+var _broadcastChannel = require("broadcast-channel");
+var _LiveChatWidgetActionType = require("../../contexts/common/LiveChatWidgetActionType");
+var _TelemetryHelper = require("../../common/telemetry/TelemetryHelper");
+var _defaultMiddlewareLocalizedTexts = require("./common/defaultProps/defaultMiddlewareLocalizedTexts");
+var _defaultWebChatContainerStatefulProps = require("./common/defaultProps/defaultWebChatContainerStatefulProps");
+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");
+var _defaultUserMessageBoxStyles = require("./webchatcontroller/middlewares/renderingmiddlewares/defaultStyles/defaultUserMessageBoxStyles");
+var _defaultSystemMessageBoxStyles = require("./webchatcontroller/middlewares/renderingmiddlewares/defaultStyles/defaultSystemMessageBoxStyles");
+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$renderingMiddl, _props$renderingMiddl2, _props$renderingMiddl3, _props$renderingMiddl4, _props$adaptiveCardSt2, _props$renderingMiddl5, _props$renderingMiddl6, _props$renderingMiddl7, _props$renderingMiddl8;
+  const {
+    BasicWebChat
+  } = _botframeworkWebchat.Components;
+  const [state, dispatch] = (0, _.useChatContextStore)();
+  const magicCodeBroadcastChannel = new _broadcastChannel.BroadcastChannel(_Constants.Constants.magicCodeBroadcastChannel);
+  const magicCodeResponseBroadcastChannel = new _broadcastChannel.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" : ""
+    }) // Use this instead of removing WebChat from the picture so that the activity observer inside the adapter is not invoked 
+  };
+
+  const localizedTexts = {
+    ..._defaultMiddlewareLocalizedTexts.defaultMiddlewareLocalizedTexts,
+    ...(props === null || props === void 0 ? void 0 : props.localizedTexts)
+  };
+  (0, _react2.useEffect)(() => {
+    (0, _utils.setFocusOnSendBox)();
+    dispatch({
+      type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_RENDERING_MIDDLEWARE_PROPS,
+      payload: props === null || props === void 0 ? void 0 : props.renderingMiddlewareProps
+    });
+    dispatch({
+      type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_MIDDLEWARE_LOCALIZED_TEXTS,
+      payload: localizedTexts
+    });
+    _TelemetryHelper.TelemetryHelper.logLoadingEvent(_TelemetryConstants.LogLevel.INFO, {
+      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};
+        }
+
+        .webchat__stacked-layout__content div.webchat__stacked-layout__message-row div.webchat__bubble--from-user {
+            max-width: ${(props === null || props === void 0 ? void 0 : (_props$renderingMiddl = props.renderingMiddlewareProps) === null || _props$renderingMiddl === void 0 ? void 0 : (_props$renderingMiddl2 = _props$renderingMiddl.userMessageBoxStyles) === null || _props$renderingMiddl2 === void 0 ? void 0 : _props$renderingMiddl2.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: ${(props === null || props === void 0 ? void 0 : (_props$renderingMiddl3 = props.renderingMiddlewareProps) === null || _props$renderingMiddl3 === void 0 ? void 0 : (_props$renderingMiddl4 = _props$renderingMiddl3.systemMessageBoxStyles) === null || _props$renderingMiddl4 === void 0 ? void 0 : _props$renderingMiddl4.maxWidth) ?? (_defaultSystemMessageBoxStyles.defaultSystemMessageBoxStyles === null || _defaultSystemMessageBoxStyles.defaultSystemMessageBoxStyles === void 0 ? void 0 : _defaultSystemMessageBoxStyles.defaultSystemMessageBoxStyles.maxWidth)}
+        }
+
+        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';
+            filter:${(props === null || props === void 0 ? void 0 : (_props$renderingMiddl5 = props.renderingMiddlewareProps) === null || _props$renderingMiddl5 === void 0 ? void 0 : (_props$renderingMiddl6 = _props$renderingMiddl5.receivedMessageAnchorStyles) === null || _props$renderingMiddl6 === void 0 ? void 0 : _props$renderingMiddl6.filter) ?? "none"};
+        }
+        pre {
+            white-space: pre-wrap;
+            white-space: -moz-pre-wrap;
+            white-space: -pre-wrap;
+            white-space: -o-pre-wrap;
+            word-wrap: break-word;
+        }
+        .ms_lcw_webchat_received_message a:link,
+        .ms_lcw_webchat_received_message a:visited,
+        .ms_lcw_webchat_received_message a:hover,
+        .ms_lcw_webchat_received_message a:active {
+            color: ${(props === null || props === void 0 ? void 0 : (_props$renderingMiddl7 = props.renderingMiddlewareProps) === null || _props$renderingMiddl7 === void 0 ? void 0 : (_props$renderingMiddl8 = _props$renderingMiddl7.receivedMessageAnchorStyles) === null || _props$renderingMiddl8 === void 0 ? void 0 : _props$renderingMiddl8.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)));
+};
+exports.WebChatContainerStateful = WebChatContainerStateful;
+var _default = WebChatContainerStateful;
+exports.default = _default;

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

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.defaultAttachmentProps = void 0;
+const defaultAttachmentProps = {
+  webChatAttachmentId: "oc-lcw-webchat-attachment",
+  adaptiveCardAttachmentId: "ms_lcw_webchat_adaptive_card",
+  enableInlinePlaying: true
+};
+exports.defaultAttachmentProps = defaultAttachmentProps;

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

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.defaultMarkdownLocalizedTexts = void 0;
+const defaultMarkdownLocalizedTexts = {
+  MARKDOWN_EXTERNAL_LINK_ALT: "Opens in a new window; external."
+};
+exports.defaultMarkdownLocalizedTexts = defaultMarkdownLocalizedTexts;

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

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.defaultMiddlewareLocalizedTexts = void 0;
+const defaultMiddlewareLocalizedTexts = {
+  MIDDLEWARE_BANNER_FILE_NULL_ERROR: "There was an error uploading the file, please try again.",
+  MIDDLEWARE_BANNER_FILE_SIZE_WITHOUT_EXTENSION_ERROR: "File exceeds the allowed limit of {0} MB and please upload the file with an appropriate file extension.",
+  MIDDLEWARE_BANNER_FILE_SIZE_EXTENSION_ERROR: "File exceeds the allowed limit of {0} MB and {1} files are not supported.",
+  MIDDLEWARE_BANNER_FILE_WITHOUT_EXTENSION: "File upload error. Please upload the file with an appropriate file extension.",
+  MIDDLEWARE_BANNER_FILE_EXTENSION_ERROR: "{0} files are not supported.",
+  MIDDLEWARE_BANNER_FILE_SIZE_ERROR: "File exceeds the allowed limit of {0} MB.",
+  MIDDLEWARE_BANNER_FILE_IS_EMPTY_ERROR: "This file can't be attached because it's empty. Please try again with a different file.",
+  MIDDLEWARE_BANNER_ERROR_MESSAGE: "Upload failed, please try again.",
+  MIDDLEWARE_BANNER_INTERNET_BACK_ONLINE: "You’re back online.",
+  MIDDLEWARE_BANNER_NO_INTERNET_CONNECTION: "Unable to connect—please check your internet connection.",
+  MIDDLEWARE_MAX_CHARACTER_COUNT_EXCEEDED: "This message is too long. Please shorten your message to avoid sending failure.",
+  MIDDLEWARE_TYPING_INDICATOR_ONE: "{0} is typing ...",
+  MIDDLEWARE_TYPING_INDICATOR_TWO: "{0} and {1} are typing ...",
+  MIDDLEWARE_TYPING_INDICATOR_MULTIPLE: "{0} agents are typing ...",
+  MIDDLEWARE_MESSAGE_SENDING: "Sending ...",
+  MIDDLEWARE_MESSAGE_DELIVERED: "Sent",
+  MIDDLEWARE_MESSAGE_NOT_DELIVERED: "Not Delivered",
+  MIDDLEWARE_MESSAGE_RETRY: "Retry"
+};
+exports.defaultMiddlewareLocalizedTexts = defaultMiddlewareLocalizedTexts;

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

@@ -0,0 +1,22 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.defaultWebChatContainerStatefulProps = void 0;
+var _mockadapter = _interopRequireDefault(require("../mockadapter"));
+var _defaultWebChatStatefulContainerStyles = require("../defaultStyles/defaultWebChatStatefulContainerStyles");
+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 = {
+  webChatStyles: _defaultWebChatContainerStatefulStyles.defaultWebChatStatefulStyles,
+  webChatProps: _defaultWebChatStatefulProps.defaultWebChatStatefulProps,
+  containerStyles: _defaultWebChatStatefulContainerStyles.defaultWebChatStatefulContainerStyles,
+  disableNewLineMarkdownSupport: false,
+  disableMarkdownMessageFormatting: false,
+  directLine: new _mockadapter.default(),
+  adaptiveCardStyles: _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles
+};
+exports.defaultWebChatContainerStatefulProps = defaultWebChatContainerStatefulProps;

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

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.defaultWebChatStatefulProps = void 0;
+var _activityStatusMiddleware = require("../../webchatcontroller/middlewares/renderingmiddlewares/activityStatusMiddleware");
+var _groupActivitiesMiddleware = require("../../webchatcontroller/middlewares/renderingmiddlewares/groupActivitiesMiddleware");
+var _typingIndicatorMiddleware = require("../../webchatcontroller/middlewares/renderingmiddlewares/typingIndicatorMiddleware");
+const defaultWebChatStatefulProps = {
+  // activityMiddleware: activityMiddleware, - this is implemented elsewhere and can be customized
+  activityStatusMiddleware: _activityStatusMiddleware.activityStatusMiddleware,
+  // avatarMiddleware: avatarMiddleware, - this is implemented elsewhere and can be customized
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  groupActivitiesMiddleware: _groupActivitiesMiddleware.groupActivitiesMiddleware,
+  typingIndicatorMiddleware: _typingIndicatorMiddleware.typingIndicatorMiddleware
+  // attachmentMiddleware: createAttachmentMiddleware(false), - this is implemented elsewhere and can be customized
+};
+exports.defaultWebChatStatefulProps = defaultWebChatStatefulProps;

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/defaultStyles/defaultWebChatContainerStatefulStyles.js

@@ -0,0 +1,39 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.defaultWebChatStatefulStyles = void 0;
+const defaultWebChatStatefulStyles = {
+  avatarSize: 32,
+  backgroundColor: "#F7F7F9",
+  botAvatarBackgroundColor: "#315FA2",
+  botAvatarInitials: "WC",
+  bubbleBackground: "#315FA2",
+  bubbleBorderRadius: 4,
+  bubbleBorderWidth: 0,
+  bubbleFromUserBackground: "White",
+  bubbleFromUserBorderRadius: 4,
+  bubbleFromUserBorderWidth: 1,
+  bubbleFromUserTextColor: "Black",
+  bubbleImageHeight: 240,
+  bubbleMaxWidth: 250,
+  bubbleMinHeight: 34,
+  bubbleMinWidth: 20,
+  bubbleTextColor: "White",
+  hideSendBox: false,
+  hideUploadButton: true,
+  primaryFont: "Segoe UI, Arial, sans-serif",
+  rootHeight: "100%",
+  rootWidth: "100%",
+  sendBoxTextWrap: true,
+  sendBoxHeight: 60,
+  sendBoxMaxHeight: 96,
+  sendBoxBackground: "White",
+  showAvatarInGroup: true,
+  suggestedActionsStackedHeight: 125,
+  suggestedActionsStackedOverflow: "scroll",
+  // eslint-disable-line @typescript-eslint/no-explicit-any
+  typingAnimationDuration: 3500
+};
+exports.defaultWebChatStatefulStyles = defaultWebChatStatefulStyles;

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

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.defaultWebChatStatefulContainerStyles = void 0;
+const defaultWebChatStatefulContainerStyles = {
+  height: "100%",
+  width: "100%",
+  overflowY: "hidden"
+};
+exports.defaultWebChatStatefulContainerStyles = defaultWebChatStatefulContainerStyles;