@microsoft/omnichannel-chat-widget 1.0.5 → 1.0.6-main.ec7a5f0

package/lib/esm/components/livechatwidget/common/createDownloadTranscriptProps.js

@@ -0,0 +1,20 @@
+import { defaultWebChatContainerStatefulProps } from "../../webchatcontainerstateful/common/defaultProps/defaultWebChatContainerStatefulProps";
+const createDownloadTranscriptProps = (downloadTranscriptProps, webChatStyles, webChatContainerProps) => {
+  const disableNewLineMarkdownSupport = (webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : webChatContainerProps.disableNewLineMarkdownSupport) ?? defaultWebChatContainerStatefulProps.disableNewLineMarkdownSupport;
+  const disableMarkdownMessageFormatting = (webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : webChatContainerProps.disableMarkdownMessageFormatting) ?? defaultWebChatContainerStatefulProps.disableMarkdownMessageFormatting;
+  const props = {
+    ...downloadTranscriptProps,
+    webChatTranscript: {
+      ...(downloadTranscriptProps === null || downloadTranscriptProps === void 0 ? void 0 : downloadTranscriptProps.webChatTranscript),
+      disableNewLineMarkdownSupport,
+      disableMarkdownMessageFormatting,
+      transcriptBackgroundColor: webChatStyles === null || webChatStyles === void 0 ? void 0 : webChatStyles.backgroundColor,
+      agentAvatarBackgroundColor: webChatStyles === null || webChatStyles === void 0 ? void 0 : webChatStyles.bubbleBackground,
+      agentAvatarFontColor: webChatStyles === null || webChatStyles === void 0 ? void 0 : webChatStyles.bubbleTextColor,
+      customerAvatarBackgroundColor: webChatStyles === null || webChatStyles === void 0 ? void 0 : webChatStyles.bubbleFromUserBackground,
+      customerAvatarFontColor: webChatStyles === null || webChatStyles === void 0 ? void 0 : webChatStyles.bubbleFromUserTextColor
+    }
+  };
+  return props;
+};
+export default createDownloadTranscriptProps;

package/lib/esm/components/livechatwidget/common/defaultProps/dummyDefaultProps.js

@@ -595,7 +595,15 @@ export const dummyDefaultProps = {
   downloadTranscriptProps: {
     bannerMessageOnError: "Download transcript failed.",
     renderMarkDown: undefined,
-    attachmentMessage: "The following attachment was uploaded during the conversation:"
+    attachmentMessage: "The following attachment was uploaded during the conversation:",
+    webChatTranscript: {
+      disabled: false,
+      fileName: "transcript",
+      pageTitle: "Customer Transcript",
+      attachmentMessage: "The following attachment was uploaded during the conversation: ",
+      networkOnlineMessage: "Connection restored. Please refresh the page",
+      networkOfflineMessage: "Network Error. Please make sure you are connected to the internet."
+    }
   },
   emailTranscriptPane: {
     componentOverrides: {

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

@@ -15,6 +15,7 @@ import CallingContainerStateful from "../../callingcontainerstateful/CallingCont
 import ChatButtonStateful from "../../chatbuttonstateful/ChatButtonStateful";
 import ConfirmationPaneStateful from "../../confirmationpanestateful/ConfirmationPaneStateful";
 import { ConversationState } from "../../../contexts/common/ConversationState";
+import createDownloadTranscriptProps from "../common/createDownloadTranscriptProps";
 import { DataStoreManager } from "../../../common/contextDataStore/DataStoreManager";
 import { ElementType } from "@microsoft/omnichannel-chat-components";
 import EmailTranscriptPaneStateful from "../../emailtranscriptpanestateful/EmailTranscriptPaneStateful";
@@ -49,7 +50,7 @@ import useChatAdapterStore from "../../../hooks/useChatAdapterStore";
 import useChatContextStore from "../../../hooks/useChatContextStore";
 import useChatSDKStore from "../../../hooks/useChatSDKStore";
 export const LiveChatWidgetStateful = props => {
-  var _props$webChatContain, _props$styleProps, _chatSDK$omnichannelC, _props$controlProps, _props$controlProps2, _state$appStates7, _props$webChatContain5, _state$appStates14, _props$webChatContain6, _props$styleProps2, _props$controlProps11, _props$controlProps12, _props$componentOverr, _props$controlProps13, _props$componentOverr2, _props$controlProps14, _props$componentOverr3, _props$controlProps15, _props$componentOverr4, _props$controlProps16, _props$componentOverr5, _props$controlProps17, _props$componentOverr6, _props$controlProps18, _props$componentOverr7, _props$controlProps19, _props$controlProps20, _props$componentOverr8, _props$controlProps21, _props$componentOverr9, _props$controlProps22, _props$componentOverr10, _props$componentOverr11, _props$componentOverr12;
+  var _props$webChatContain, _props$styleProps, _chatSDK$omnichannelC, _props$controlProps, _props$controlProps2, _state$appStates7, _props$webChatContain5, _state$appStates14, _props$webChatContain6, _props$webChatContain7, _props$styleProps2, _props$controlProps11, _props$controlProps12, _props$componentOverr, _props$controlProps13, _props$componentOverr2, _props$controlProps14, _props$componentOverr3, _props$controlProps15, _props$componentOverr4, _props$controlProps16, _props$componentOverr5, _props$controlProps17, _props$componentOverr6, _props$controlProps18, _props$componentOverr7, _props$controlProps19, _props$controlProps20, _props$componentOverr8, _props$controlProps21, _props$componentOverr9, _props$controlProps22, _props$componentOverr10, _props$componentOverr11, _props$componentOverr12;
   const [state, dispatch] = useChatContextStore();
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const [adapter, setAdapter] = useChatAdapterStore();
@@ -545,12 +546,11 @@ export const LiveChatWidgetStateful = props => {
     if (state.appStates.conversationState === ConversationState.Active &&
         props.controlProps?.hideStartChatButton === true) {
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        
-        window.onbeforeunload = function () {
+          window.onbeforeunload = function () {
             const prompt = Constants.BrowserUnloadConfirmationMessage;
             return prompt;
         };
-              // eslint-disable-next-line @typescript-eslint/no-explicit-any
+          // eslint-disable-next-line @typescript-eslint/no-explicit-any
         window.onunload = function () {
             initiateEndChatOnBrowserUnload();
         };
@@ -601,26 +601,30 @@ export const LiveChatWidgetStateful = props => {
   const confirmationPaneProps = initConfirmationPropsComposer(props);
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const prepareEndChatRelay = () => prepareEndChat(props, chatSDK, state, dispatch, setAdapter, setWebChatStyles, adapter, uwid.current);
+  props.downloadTranscriptProps = createDownloadTranscriptProps(props.downloadTranscriptProps, {
+    ...defaultWebChatContainerStatefulProps.webChatStyles,
+    ...((_props$webChatContain6 = props.webChatContainerProps) === null || _props$webChatContain6 === void 0 ? void 0 : _props$webChatContain6.webChatStyles)
+  }, props.webChatContainerProps);
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("style", null, `
             ::-webkit-scrollbar {
                 width: ${scrollbarProps.width};
             }
-            
+
             ::-webkit-scrollbar-track {
                 background: ${scrollbarProps.trackBackgroundColor};
             }
-            
+
             ::-webkit-scrollbar-thumb {
                 background: ${scrollbarProps.thumbBackgroundColor};
                 border-radius: ${scrollbarProps.thumbBorderRadius};
             }
-            
+
             ::-webkit-scrollbar-thumb:hover {
                 background: ${scrollbarProps.thumbHoverColor};
-            } 
+            }
             `), /*#__PURE__*/React.createElement(Composer, _extends({}, webChatProps, {
     styleOptions: webChatStyles,
-    directLine: ((_props$webChatContain6 = props.webChatContainerProps) === null || _props$webChatContain6 === void 0 ? void 0 : _props$webChatContain6.directLine) ?? adapter ?? defaultWebChatContainerStatefulProps.directLine
+    directLine: ((_props$webChatContain7 = props.webChatContainerProps) === null || _props$webChatContain7 === void 0 ? void 0 : _props$webChatContain7.directLine) ?? adapter ?? defaultWebChatContainerStatefulProps.directLine
   }), /*#__PURE__*/React.createElement(Stack, {
     id: widgetElementId,
     styles: generalStyles,

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

@@ -1,22 +1,22 @@
 import { Stack } from "@fluentui/react";
 import { LogLevel, TelemetryEvent } from "../../common/telemetry/TelemetryConstants";
 import React, { useEffect } from "react";
-import { Components } from "botframework-webchat";
+import { BotMagicCodeStore } from "./webchatcontroller/BotMagicCodeStore";
 import { BroadcastChannel } from "broadcast-channel";
+import { Components } from "botframework-webchat";
+import { Constants } from "../../common/Constants";
 import { LiveChatWidgetActionType } from "../../contexts/common/LiveChatWidgetActionType";
 import { TelemetryHelper } from "../../common/telemetry/TelemetryHelper";
-import { defaultMiddlewareLocalizedTexts } from "./common/defaultProps/defaultMiddlewareLocalizedTexts";
-import { defaultWebChatContainerStatefulProps } from "./common/defaultProps/defaultWebChatContainerStatefulProps";
-import { setFocusOnSendBox } from "../../common/utils";
-import { useChatContextStore } from "../..";
 import { WebChatActionType } from "./webchatcontroller/enums/WebChatActionType";
 import { WebChatStoreLoader } from "./webchatcontroller/WebChatStoreLoader";
-import { Constants } from "../../common/Constants";
-import { BotMagicCodeStore } from "./webchatcontroller/BotMagicCodeStore";
 import { defaultAdaptiveCardStyles } from "./common/defaultStyles/defaultAdaptiveCardStyles";
+import { defaultMiddlewareLocalizedTexts } from "./common/defaultProps/defaultMiddlewareLocalizedTexts";
 import { defaultReceivedMessageAnchorStyles } from "./webchatcontroller/middlewares/renderingmiddlewares/defaultStyles/defaultReceivedMessageAnchorStyles";
-import { defaultUserMessageBoxStyles } from "./webchatcontroller/middlewares/renderingmiddlewares/defaultStyles/defaultUserMessageBoxStyles";
 import { defaultSystemMessageBoxStyles } from "./webchatcontroller/middlewares/renderingmiddlewares/defaultStyles/defaultSystemMessageBoxStyles";
+import { defaultUserMessageBoxStyles } from "./webchatcontroller/middlewares/renderingmiddlewares/defaultStyles/defaultUserMessageBoxStyles";
+import { defaultWebChatContainerStatefulProps } from "./common/defaultProps/defaultWebChatContainerStatefulProps";
+import { setFocusOnSendBox } from "../../common/utils";
+import { useChatContextStore } from "../..";
 const broadcastChannelMessageEvent = "message";
 const postActivity = activity => {
   // eslint-disable-line @typescript-eslint/no-explicit-any
@@ -43,7 +43,7 @@ const createMagicCodeSuccessResponse = signin => {
   };
 };
 export const WebChatContainerStateful = props => {
-  var _props$adaptiveCardSt, _props$renderingMiddl, _props$renderingMiddl2, _props$renderingMiddl3, _props$renderingMiddl4, _props$adaptiveCardSt2, _props$renderingMiddl5, _props$renderingMiddl6, _props$renderingMiddl7, _props$renderingMiddl8;
+  var _props$adaptiveCardSt, _props$renderingMiddl, _props$renderingMiddl2, _props$renderingMiddl3, _props$renderingMiddl4, _props$adaptiveCardSt2, _props$adaptiveCardSt3, _props$adaptiveCardSt4, _props$renderingMiddl5, _props$renderingMiddl6, _props$renderingMiddl7, _props$renderingMiddl8;
   const {
     BasicWebChat
   } = Components;
@@ -124,7 +124,9 @@ export const WebChatContainerStateful = props => {
             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 === null || defaultSystemMessageBoxStyles === void 0 ? void 0 : 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.color};}
+        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.color}; white-space:${(props === null || props === void 0 ? void 0 : (_props$adaptiveCardSt3 = props.adaptiveCardStyles) === null || _props$adaptiveCardSt3 === void 0 ? void 0 : _props$adaptiveCardSt3.textWhiteSpace) ?? defaultAdaptiveCardStyles.textWhiteSpace}}
+        
+        .webchat__stacked-layout__content .ac-actionSet > .ac-pushButton > div {white-space: ${(props === null || props === void 0 ? void 0 : (_props$adaptiveCardSt4 = props.adaptiveCardStyles) === null || _props$adaptiveCardSt4 === void 0 ? void 0 : _props$adaptiveCardSt4.buttonWhiteSpace) ?? defaultAdaptiveCardStyles.buttonWhiteSpace} !important;}
 
         .ms_lcw_webchat_received_message img.webchat__markdown__external-link-icon { 
             background-image : url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIzIDMgMTggMTgiICB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Ik03LjI1MDEgNC41MDAxN0gxMC43NDk1QzExLjE2MzcgNC41MDAxNyAxMS40OTk1IDQuODM1OTYgMTEuNDk5NSA1LjI1MDE3QzExLjQ5OTUgNS42Mjk4NiAxMS4yMTczIDUuOTQzNjYgMTAuODUxMyA1Ljk5MzMyTDEwLjc0OTUgNi4wMDAxN0g3LjI0OTc0QzYuMDcwNzkgNS45OTk2MSA1LjEwMzQ5IDYuOTA2NTYgNS4wMDc4NiA4LjA2MTEyTDUuMDAwMjggOC4yMjAwM0w1LjAwMzEyIDE2Ljc1MDdDNS4wMDM0MyAxNy45NDE1IDUuOTI4ODUgMTguOTE2MSA3LjA5OTY2IDE4Ljk5NDlMNy4yNTM3MSAxOS4wMDAxTDE1Ljc1MTggMTguOTg4NEMxNi45NDE1IDE4Ljk4NjggMTcuOTE0NSAxOC4wNjIgMTcuOTkzNSAxNi44OTIzTDE3Ljk5ODcgMTYuNzM4NFYxMy4yMzIxQzE3Ljk5ODcgMTIuODE3OSAxOC4zMzQ1IDEyLjQ4MjEgMTguNzQ4NyAxMi40ODIxQzE5LjEyODQgMTIuNDgyMSAxOS40NDIyIDEyLjc2NDMgMTkuNDkxOCAxMy4xMzAzTDE5LjQ5ODcgMTMuMjMyMVYxNi43Mzg0QzE5LjQ5ODcgMTguNzQwNyAxNy45MjkzIDIwLjM3NjkgMTUuOTUyOCAyMC40ODI5TDE1Ljc1MzggMjAuNDg4NEw3LjI1ODI3IDIwLjUwMDFMNy4wNTQ5NSAyMC40OTQ5QzUuMTQyMzkgMjAuMzk1NCAzLjYwODk1IDE4Ljg2MjcgMy41MDgzNyAxNi45NTAyTDMuNTAzMTIgMTYuNzUxMUwzLjUwMDg5IDguMjUyN0wzLjUwNTI5IDguMDUwMkMzLjYwNTM5IDYuMTM3NDkgNS4xMzg2NyA0LjYwNDQ5IDcuMDUwOTYgNC41MDUyN0w3LjI1MDEgNC41MDAxN0gxMC43NDk1SDcuMjUwMVpNMTMuNzQ4MSAzLjAwMTQ2TDIwLjMwMTggMy4wMDE5N0wyMC40MDE0IDMuMDE1NzVMMjAuNTAyMiAzLjA0MzkzTDIwLjU1OSAzLjA2ODAzQzIwLjYxMjIgMy4wOTEyMiAyMC42NjM0IDMuMTIxNjMgMjAuNzExMSAzLjE1ODg1TDIwLjc4MDQgMy4yMjE1NkwyMC44NjQxIDMuMzIwMTRMMjAuOTE4MyAzLjQxMDI1TDIwLjk1NyAzLjUwMDU3TDIwLjk3NjIgMy41NjQ3NkwyMC45ODk4IDMuNjI4NjJMMjAuOTk5MiAzLjcyMjgyTDIwLjk5OTcgMTAuMjU1NEMyMC45OTk3IDEwLjY2OTYgMjAuNjYzOSAxMS4wMDU0IDIwLjI0OTcgMTEuMDA1NEMxOS44NyAxMS4wMDU0IDE5LjU1NjIgMTAuNzIzMiAxOS41MDY1IDEwLjM1NzFMMTkuNDk5NyAxMC4yNTU0TDE5LjQ5ODkgNS41NjE0N0wxMi4yNzk3IDEyLjc4NDdDMTIuMDEzNCAxMy4wNTEgMTEuNTk2OCAxMy4wNzUzIDExLjMwMzEgMTIuODU3NUwxMS4yMTkgMTIuNzg0OUMxMC45NTI3IDEyLjUxODcgMTAuOTI4NCAxMi4xMDIxIDExLjE0NjIgMTEuODA4NEwxMS4yMTg4IDExLjcyNDNMMTguNDM2OSA0LjUwMTQ2SDEzLjc0ODFDMTMuMzY4NCA0LjUwMTQ2IDEzLjA1NDYgNC4yMTkzMSAxMy4wMDUgMy44NTMyNEwxMi45OTgxIDMuNzUxNDZDMTIuOTk4MSAzLjM3MTc3IDEzLjI4MDMgMy4wNTc5NyAxMy42NDY0IDMuMDA4MzFMMTMuNzQ4MSAzLjAwMTQ2WiIgZmlsbD0iI0ZGRkZGRiIgLz48L3N2Zz4) !important;

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

@@ -1,4 +1,6 @@
 export const defaultAdaptiveCardStyles = {
   background: "white",
-  color: "black"
+  color: "black",
+  textWhiteSpace: "normal",
+  buttonWhiteSpace: "normal"
 };