@microsoft/omnichannel-chat-widget 1.8.2-main.5199342 → 1.8.2-main.d82a79b

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (62) hide show
  1. package/README.md +2 -0
  2. package/lib/cjs/common/Constants.js +11 -3
  3. package/lib/cjs/common/telemetry/TelemetryConstants.js +1 -0
  4. package/lib/cjs/common/utils.js +7 -1
  5. package/lib/cjs/components/draggable/DraggableChatWidget.js +16 -1
  6. package/lib/cjs/components/livechatwidget/common/createInternetConnectionChangeHandler.js +22 -9
  7. package/lib/cjs/components/livechatwidget/common/endChat.js +18 -7
  8. package/lib/cjs/components/livechatwidget/common/initWebChatComposer.js +30 -1
  9. package/lib/cjs/components/livechatwidget/common/liveChatConfigUtils.js +18 -1
  10. package/lib/cjs/components/livechatwidget/common/renderSurveyHelpers.js +31 -7
  11. package/lib/cjs/components/livechatwidget/common/setPostChatContextAndLoadSurvey.js +15 -2
  12. package/lib/cjs/components/livechatwidget/common/startChat.js +6 -4
  13. package/lib/cjs/components/livechatwidget/livechatwidgetstateful/LiveChatWidgetStateful.js +22 -11
  14. package/lib/cjs/components/webchatcontainerstateful/WebChatContainerStateful.js +18 -14
  15. package/lib/cjs/components/webchatcontainerstateful/webchatcontroller/middlewares/storemiddlewares/channelDataMiddleware.js +4 -3
  16. package/lib/cjs/components/webchatcontainerstateful/webchatcontroller/middlewares/storemiddlewares/conversationEndMiddleware.js +12 -6
  17. package/lib/cjs/components/webchatcontainerstateful/webchatcontroller/middlewares/storemiddlewares/queueOverflowHandlerMiddleware.js +45 -0
  18. package/lib/cjs/contexts/common/LiveChatWidgetActionType.js +3 -1
  19. package/lib/cjs/contexts/common/LiveChatWidgetContextInitialState.js +3 -1
  20. package/lib/cjs/contexts/createReducer.js +30 -0
  21. package/lib/cjs/controller/componentController.js +2 -2
  22. package/lib/cjs/firstresponselatency/FirstMessageTrackerFromBot.js +101 -36
  23. package/lib/cjs/firstresponselatency/FirstResponseLatencyTracker.js +39 -21
  24. package/lib/cjs/firstresponselatency/util.js +60 -31
  25. package/lib/cjs/plugins/newMessageEventHandler.js +12 -6
  26. package/lib/esm/common/Constants.js +9 -2
  27. package/lib/esm/common/telemetry/TelemetryConstants.js +1 -0
  28. package/lib/esm/common/utils.js +4 -0
  29. package/lib/esm/components/draggable/DraggableChatWidget.js +16 -1
  30. package/lib/esm/components/livechatwidget/common/createInternetConnectionChangeHandler.js +22 -9
  31. package/lib/esm/components/livechatwidget/common/endChat.js +18 -7
  32. package/lib/esm/components/livechatwidget/common/initWebChatComposer.js +30 -1
  33. package/lib/esm/components/livechatwidget/common/liveChatConfigUtils.js +16 -0
  34. package/lib/esm/components/livechatwidget/common/renderSurveyHelpers.js +33 -9
  35. package/lib/esm/components/livechatwidget/common/setPostChatContextAndLoadSurvey.js +16 -3
  36. package/lib/esm/components/livechatwidget/common/startChat.js +6 -4
  37. package/lib/esm/components/livechatwidget/livechatwidgetstateful/LiveChatWidgetStateful.js +22 -11
  38. package/lib/esm/components/webchatcontainerstateful/WebChatContainerStateful.js +18 -14
  39. package/lib/esm/components/webchatcontainerstateful/webchatcontroller/middlewares/storemiddlewares/channelDataMiddleware.js +4 -4
  40. package/lib/esm/components/webchatcontainerstateful/webchatcontroller/middlewares/storemiddlewares/conversationEndMiddleware.js +12 -6
  41. package/lib/esm/components/webchatcontainerstateful/webchatcontroller/middlewares/storemiddlewares/queueOverflowHandlerMiddleware.js +38 -0
  42. package/lib/esm/contexts/common/LiveChatWidgetActionType.js +3 -1
  43. package/lib/esm/contexts/common/LiveChatWidgetContextInitialState.js +3 -1
  44. package/lib/esm/contexts/createReducer.js +30 -0
  45. package/lib/esm/controller/componentController.js +2 -2
  46. package/lib/esm/firstresponselatency/FirstMessageTrackerFromBot.js +101 -36
  47. package/lib/esm/firstresponselatency/FirstResponseLatencyTracker.js +39 -21
  48. package/lib/esm/firstresponselatency/util.js +57 -29
  49. package/lib/esm/plugins/newMessageEventHandler.js +12 -6
  50. package/lib/types/common/Constants.d.ts +8 -2
  51. package/lib/types/common/telemetry/TelemetryConstants.d.ts +1 -0
  52. package/lib/types/common/utils.d.ts +5 -0
  53. package/lib/types/components/livechatwidget/common/liveChatConfigUtils.d.ts +1 -0
  54. package/lib/types/components/webchatcontainerstateful/webchatcontroller/middlewares/storemiddlewares/channelDataMiddleware.d.ts +1 -1
  55. package/lib/types/components/webchatcontainerstateful/webchatcontroller/middlewares/storemiddlewares/conversationEndMiddleware.d.ts +1 -1
  56. package/lib/types/components/webchatcontainerstateful/webchatcontroller/middlewares/storemiddlewares/queueOverflowHandlerMiddleware.d.ts +5 -0
  57. package/lib/types/contexts/common/ILiveChatWidgetContext.d.ts +2 -0
  58. package/lib/types/contexts/common/LiveChatWidgetActionType.d.ts +3 -1
  59. package/lib/types/firstresponselatency/FirstResponseLatencyTracker.d.ts +2 -2
  60. package/lib/types/firstresponselatency/util.d.ts +17 -0
  61. package/lib/types/plugins/newMessageEventHandler.d.ts +1 -1
  62. package/package.json +4 -4
@@ -1,11 +1,11 @@
1
- import { Constants, ParticipantType, PostChatSurveyTelemetryMessage } from "../../../common/Constants";
1
+ import { Constants, ParticipantType, PostChatSurveyTelemetryMessage, SurveyProvider } from "../../../common/Constants";
2
2
  import { LogLevel, TelemetryEvent } from "../../../common/telemetry/TelemetryConstants";
3
3
  import { ConversationState } from "../../../contexts/common/ConversationState";
4
4
  import { LiveChatWidgetActionType } from "../../../contexts/common/LiveChatWidgetActionType";
5
5
  import { PostChatSurveyMode } from "../../postchatsurveypanestateful/enums/PostChatSurveyMode";
6
6
  import { TelemetryHelper } from "../../../common/telemetry/TelemetryHelper";
7
7
  import { addDelayInMs } from "../../../common/utils";
8
- import { isPostChatSurveyEnabled } from "./liveChatConfigUtils";
8
+ import { getPostChatSurveyConfig } from "./liveChatConfigUtils";
9
9
 
10
10
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
11
11
  let conversationDetails = undefined;
@@ -46,23 +46,34 @@ const setSurveyMode = async (props, participantType, state, dispatch) => {
46
46
  };
47
47
 
48
48
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
49
- const renderSurvey = async (postChatContext, dispatch) => {
49
+ const renderSurvey = async (postChatContext, state, dispatch) => {
50
50
  if (postChatSurveyMode === PostChatSurveyMode.Link) {
51
51
  setWidgetStateToInactive(dispatch);
52
52
  return;
53
53
  }
54
54
  if (postChatSurveyMode === PostChatSurveyMode.Embed) {
55
- await embedModePostChatWorkflow(postChatContext, dispatch);
55
+ await embedModePostChatWorkflow(postChatContext, state, dispatch);
56
56
  }
57
57
  };
58
58
 
59
59
  // Function for embed mode postchat workflow which is essentially same for both customer and agent
60
60
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
61
- const embedModePostChatWorkflow = async (postChatContext, dispatch) => {
61
+ const embedModePostChatWorkflow = async (postChatContext, state, dispatch) => {
62
62
  TelemetryHelper.logActionEvent(LogLevel.INFO, {
63
63
  Event: TelemetryEvent.EmbedModePostChatWorkflowStarted
64
64
  });
65
65
  if (postChatContext) {
66
+ if (postChatContext.isConversationalSurveyEnabled && postChatContext.surveyProvider === SurveyProvider.MicrosoftCopilotStudio) {
67
+ dispatch({
68
+ type: LiveChatWidgetActionType.SET_CONVERSATION_STATE,
69
+ payload: ConversationState.Postchat
70
+ });
71
+ dispatch({
72
+ type: LiveChatWidgetActionType.SET_CONVERSATIONAL_SURVEY_DISPLAY,
73
+ payload: true
74
+ });
75
+ return;
76
+ }
66
77
  dispatch({
67
78
  type: LiveChatWidgetActionType.SET_CONVERSATION_STATE,
68
79
  payload: ConversationState.PostchatLoading
@@ -89,7 +100,7 @@ const initiatePostChat = async (props, conversationDetailsParam, state, dispatch
89
100
  conversationDetails = conversationDetailsParam;
90
101
  const participantType = ((_conversationDetails = conversationDetails) === null || _conversationDetails === void 0 ? void 0 : _conversationDetails.participantType) ?? postchatContext.participantType;
91
102
  await setSurveyMode(props, participantType, state, dispatch);
92
- await renderSurvey(postchatContext, dispatch);
103
+ await renderSurvey(postchatContext, state, dispatch);
93
104
  };
94
105
 
95
106
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -102,7 +113,14 @@ const isPostChatEnabled = (props, state) => {
102
113
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
103
114
  const getPostChatContext = async (facadeChatSDK, state, dispatch) => {
104
115
  try {
105
- const postChatEnabled = await isPostChatSurveyEnabled(facadeChatSDK);
116
+ const postChatConfig = await getPostChatSurveyConfig(facadeChatSDK);
117
+ const postChatEnabled = postChatConfig.postChatEnabled;
118
+ if (postChatConfig.isConversationalSurveyEnabled) {
119
+ dispatch({
120
+ type: LiveChatWidgetActionType.SET_CONVERSATIONAL_SURVEY_ENABLED,
121
+ payload: true
122
+ });
123
+ }
106
124
  if (postChatEnabled) {
107
125
  var _state$domainStates2;
108
126
  if ((state === null || state === void 0 ? void 0 : (_state$domainStates2 = state.domainStates) === null || _state$domainStates2 === void 0 ? void 0 : _state$domainStates2.postChatContext) === undefined) {
@@ -112,11 +130,17 @@ const getPostChatContext = async (facadeChatSDK, state, dispatch) => {
112
130
  Event: TelemetryEvent.PostChatContextCallSucceed,
113
131
  Description: PostChatSurveyTelemetryMessage.PostChatContextCallSucceed
114
132
  });
133
+
134
+ // Merge postChatConfig with postChatSurveyContext
135
+ const mergedContext = {
136
+ ...context,
137
+ ...postChatConfig
138
+ };
115
139
  dispatch({
116
140
  type: LiveChatWidgetActionType.SET_POST_CHAT_CONTEXT,
117
- payload: context
141
+ payload: mergedContext
118
142
  });
119
- return context;
143
+ return mergedContext;
120
144
  }
121
145
  }
122
146
  } catch (error) {
@@ -4,12 +4,19 @@ import { ConversationState } from "../../../contexts/common/ConversationState";
4
4
  import { LiveChatWidgetActionType } from "../../../contexts/common/LiveChatWidgetActionType";
5
5
  import { PostChatSurveyTelemetryMessage } from "../../../common/Constants";
6
6
  import { TelemetryHelper } from "../../../common/telemetry/TelemetryHelper";
7
- import { isPostChatSurveyEnabled } from "./liveChatConfigUtils";
7
+ import { getPostChatSurveyConfig } from "./liveChatConfigUtils";
8
8
 
9
9
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
10
10
  export const setPostChatContextAndLoadSurvey = async (facadeChatSDK, dispatch, persistedChat) => {
11
11
  try {
12
- const postChatEnabled = await isPostChatSurveyEnabled(facadeChatSDK);
12
+ const postChatConfig = await getPostChatSurveyConfig(facadeChatSDK);
13
+ if (postChatConfig.isConversationalSurveyEnabled) {
14
+ dispatch({
15
+ type: LiveChatWidgetActionType.SET_CONVERSATIONAL_SURVEY_ENABLED,
16
+ payload: true
17
+ });
18
+ }
19
+ const postChatEnabled = postChatConfig.postChatEnabled;
13
20
  if (postChatEnabled) {
14
21
  if (!persistedChat) {
15
22
  TelemetryHelper.logSDKEventToAllTelemetry(LogLevel.INFO, {
@@ -22,9 +29,15 @@ export const setPostChatContextAndLoadSurvey = async (facadeChatSDK, dispatch, p
22
29
  Event: TelemetryEvent.PostChatContextCallSucceed,
23
30
  Description: PostChatSurveyTelemetryMessage.PostChatContextCallSucceed
24
31
  });
32
+
33
+ // Merge postChatConfig with postChatSurveyContext
34
+ const mergedContext = {
35
+ ...context,
36
+ ...postChatConfig
37
+ };
25
38
  dispatch({
26
39
  type: LiveChatWidgetActionType.SET_POST_CHAT_CONTEXT,
27
- payload: context
40
+ payload: mergedContext
28
41
  });
29
42
  }
30
43
  }
@@ -148,7 +148,6 @@ const setPreChatAndInitiateChat = async (facadeChatSDK, dispatch, setAdapter, is
148
148
  const optionalParams = {
149
149
  isProactiveChat
150
150
  };
151
- createTrackingForFirstMessage();
152
151
  await initStartChat(facadeChatSDK, dispatch, setAdapter, state, props, optionalParams);
153
152
  };
154
153
 
@@ -197,8 +196,12 @@ const initStartChat = async (facadeChatSDK, dispatch, setAdapter, state, props,
197
196
  portalContactId: (_window$Microsoft = window.Microsoft) === null || _window$Microsoft === void 0 ? void 0 : (_window$Microsoft$Dyn = _window$Microsoft.Dynamic365) === null || _window$Microsoft$Dyn === void 0 ? void 0 : (_window$Microsoft$Dyn2 = _window$Microsoft$Dyn.Portal) === null || _window$Microsoft$Dyn2 === void 0 ? void 0 : (_window$Microsoft$Dyn3 = _window$Microsoft$Dyn2.User) === null || _window$Microsoft$Dyn3 === void 0 ? void 0 : _window$Microsoft$Dyn3.contactId
198
197
  };
199
198
  const startChatOptionalParams = Object.assign({}, params, optionalParams, defaultOptionalParams);
199
+ // startTime is used to determine if a message is history or new, better to be set before creating the adapter to get bandwidth
200
+ const startTime = new Date().getTime();
201
+ createTrackingForFirstMessage();
200
202
  await facadeChatSDK.startChat(startChatOptionalParams);
201
203
  isStartChatSuccessful = true;
204
+ await createAdapterAndSubscribe(facadeChatSDK, dispatch, setAdapter, startTime, props);
202
205
  } catch (error) {
203
206
  checkContactIdError(error);
204
207
  TelemetryHelper.logSDKEvent(LogLevel.ERROR, {
@@ -216,7 +219,6 @@ const initStartChat = async (facadeChatSDK, dispatch, setAdapter, state, props,
216
219
  isStartChatSuccessful = false;
217
220
  throw error;
218
221
  }
219
- await createAdapterAndSubscribe(facadeChatSDK, dispatch, setAdapter, props);
220
222
 
221
223
  // Set app state to Active
222
224
  if (isStartChatSuccessful) {
@@ -266,7 +268,7 @@ const initStartChat = async (facadeChatSDK, dispatch, setAdapter, state, props,
266
268
  };
267
269
 
268
270
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
269
- const createAdapterAndSubscribe = async (facadeChatSDK, dispatch, setAdapter, props) => {
271
+ const createAdapterAndSubscribe = async (facadeChatSDK, dispatch, setAdapter, startTime, props) => {
270
272
  // New adapter creation
271
273
  const newAdapter = await createAdapter(facadeChatSDK, props);
272
274
  setAdapter(newAdapter);
@@ -277,7 +279,7 @@ const createAdapterAndSubscribe = async (facadeChatSDK, dispatch, setAdapter, pr
277
279
  });
278
280
  if (chatToken !== null && chatToken !== void 0 && chatToken.chatId && chatToken !== null && chatToken !== void 0 && chatToken.visitorId) {
279
281
  var _newAdapter$activity$;
280
- newAdapter === null || newAdapter === void 0 ? void 0 : (_newAdapter$activity$ = newAdapter.activity$) === null || _newAdapter$activity$ === void 0 ? void 0 : _newAdapter$activity$.subscribe(createOnNewAdapterActivityHandler(chatToken.chatId, chatToken.visitorId));
282
+ newAdapter === null || newAdapter === void 0 ? void 0 : (_newAdapter$activity$ = newAdapter.activity$) === null || _newAdapter$activity$ === void 0 ? void 0 : _newAdapter$activity$.subscribe(createOnNewAdapterActivityHandler(chatToken.chatId, chatToken.visitorId, startTime));
281
283
  }
282
284
  };
283
285
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -611,12 +611,15 @@ export const LiveChatWidgetStateful = props => {
611
611
  payload: null
612
612
  });
613
613
  if ("participantsRemoved" in event && (inMemoryState === null || inMemoryState === void 0 ? void 0 : (_inMemoryState$appSta5 = inMemoryState.appStates) === null || _inMemoryState$appSta5 === void 0 ? void 0 : _inMemoryState$appSta5.conversationState) === ConversationState.Active) {
614
- setWebChatStyles(styles => {
615
- return {
616
- ...styles,
617
- hideSendBox: true
618
- };
619
- });
614
+ var _inMemoryState$appSta6;
615
+ if ((inMemoryState === null || inMemoryState === void 0 ? void 0 : (_inMemoryState$appSta6 = inMemoryState.appStates) === null || _inMemoryState$appSta6 === void 0 ? void 0 : _inMemoryState$appSta6.isConversationalSurveyEnabled) === false) {
616
+ setWebChatStyles(styles => {
617
+ return {
618
+ ...styles,
619
+ hideSendBox: true
620
+ };
621
+ });
622
+ }
620
623
  TelemetryHelper.logSDKEvent(LogLevel.INFO, {
621
624
  Event: TelemetryEvent.ParticipantsRemovedEvent,
622
625
  Description: "Participants removed event received."
@@ -712,7 +715,15 @@ export const LiveChatWidgetStateful = props => {
712
715
  endChat(props, facadeChatSDK, state, dispatch, setAdapter, setWebChatStyles, adapter, false, false, true);
713
716
  return;
714
717
  }
715
- if ((state === null || state === void 0 ? void 0 : (_state$appStates12 = state.appStates) === null || _state$appStates12 === void 0 ? void 0 : _state$appStates12.conversationEndedBy) === ConversationEndEntity.Agent || (state === null || state === void 0 ? void 0 : (_state$appStates13 = state.appStates) === null || _state$appStates13 === void 0 ? void 0 : _state$appStates13.conversationEndedBy) === ConversationEndEntity.Bot) {
718
+ const inMemoryState = executeReducer(state, {
719
+ type: LiveChatWidgetActionType.GET_IN_MEMORY_STATE,
720
+ payload: null
721
+ });
722
+ let isConversationalSurveyEnabled = state.appStates.isConversationalSurveyEnabled;
723
+
724
+ // In conversational survey, we need to check post chat survey logics before we set ConversationState to InActive
725
+ // Hence setting ConversationState to InActive will be done later in the post chat flows
726
+ if (!isConversationalSurveyEnabled && ((state === null || state === void 0 ? void 0 : (_state$appStates12 = state.appStates) === null || _state$appStates12 === void 0 ? void 0 : _state$appStates12.conversationEndedBy) === ConversationEndEntity.Agent || (state === null || state === void 0 ? void 0 : (_state$appStates13 = state.appStates) === null || _state$appStates13 === void 0 ? void 0 : _state$appStates13.conversationEndedBy) === ConversationEndEntity.Bot)) {
716
727
  dispatch({
717
728
  type: LiveChatWidgetActionType.SET_CONVERSATION_STATE,
718
729
  payload: ConversationState.InActive
@@ -753,13 +764,13 @@ export const LiveChatWidgetStateful = props => {
753
764
 
754
765
  // Handle Chat disconnect cases
755
766
  useEffect(() => {
756
- var _inMemoryState$appSta6;
767
+ var _inMemoryState$appSta7;
757
768
  const inMemoryState = executeReducer(state, {
758
769
  type: LiveChatWidgetActionType.GET_IN_MEMORY_STATE,
759
770
  payload: null
760
771
  });
761
772
  handleChatDisconnect(props, inMemoryState, setWebChatStyles);
762
- const chatDisconnectState = inMemoryState === null || inMemoryState === void 0 ? void 0 : (_inMemoryState$appSta6 = inMemoryState.appStates) === null || _inMemoryState$appSta6 === void 0 ? void 0 : _inMemoryState$appSta6.chatDisconnectEventReceived;
773
+ const chatDisconnectState = inMemoryState === null || inMemoryState === void 0 ? void 0 : (_inMemoryState$appSta7 = inMemoryState.appStates) === null || _inMemoryState$appSta7 === void 0 ? void 0 : _inMemoryState$appSta7.chatDisconnectEventReceived;
763
774
  if (chatDisconnectState && adapter) {
764
775
  try {
765
776
  adapter.end();
@@ -887,8 +898,8 @@ export const LiveChatWidgetStateful = props => {
887
898
  margin-left: .25em;
888
899
  }
889
900
  ${(sendBoxTextArea === null || sendBoxTextArea === void 0 ? void 0 : sendBoxTextArea.minHeight) && `
890
- textarea.webchat__send-box-text-box__html-text-area {
891
- min-height: ${sendBoxTextArea === null || sendBoxTextArea === void 0 ? void 0 : sendBoxTextArea.minHeight};
901
+ .webchat__auto-resize-textarea.webchat__send-box-text-box__text-area {
902
+ min-height: ${sendBoxTextArea === null || sendBoxTextArea === void 0 ? void 0 : sendBoxTextArea.minHeight} !important;
892
903
  }`}
893
904
  `), /*#__PURE__*/React.createElement(DraggableChatWidget, chatWidgetDraggableConfig, /*#__PURE__*/React.createElement(Composer, _extends({}, webChatProps, {
894
905
  userID: userID,
@@ -48,7 +48,7 @@ const createMagicCodeSuccessResponse = signin => {
48
48
  };
49
49
  };
50
50
  export const WebChatContainerStateful = props => {
51
- var _webChatContainerProp, _webChatContainerProp2, _webChatContainerProp3, _webChatContainerProp4, _webChatContainerProp5, _webChatContainerProp6, _webChatContainerProp7, _props$webChatContain5, _props$webChatContain6, _defaultWebChatContai, _props$webChatContain7, _props$webChatContain8, _defaultWebChatContai2, _webChatContainerProp8, _webChatContainerProp9, _webChatContainerProp10, _webChatContainerProp11, _webChatContainerProp12, _webChatContainerProp13, _webChatContainerProp14, _webChatContainerProp15, _webChatContainerProp16, _webChatContainerProp17, _webChatContainerProp18, _webChatContainerProp19, _webChatContainerProp20, _webChatContainerProp21, _webChatContainerProp22, _props$webChatContain9, _props$webChatContain10;
51
+ var _webChatContainerProp, _webChatContainerProp2, _webChatContainerProp3, _webChatContainerProp4, _webChatContainerProp5, _webChatContainerProp6, _webChatContainerProp7, _webChatContainerProp8, _props$webChatContain5, _props$webChatContain6, _defaultWebChatContai, _props$webChatContain7, _props$webChatContain8, _defaultWebChatContai2, _webChatContainerProp9, _webChatContainerProp10, _webChatContainerProp11, _webChatContainerProp12, _webChatContainerProp13, _webChatContainerProp14, _webChatContainerProp15, _webChatContainerProp16, _webChatContainerProp17, _webChatContainerProp18, _webChatContainerProp19, _webChatContainerProp20, _webChatContainerProp21, _webChatContainerProp22, _webChatContainerProp23, _props$webChatContain9, _props$webChatContain10;
52
52
  useEffect(() => {
53
53
  uiTimer = createTimer();
54
54
  TelemetryHelper.logLoadingEvent(LogLevel.INFO, {
@@ -177,20 +177,24 @@ export const WebChatContainerStateful = props => {
177
177
  background: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp === void 0 ? void 0 : _webChatContainerProp.background) ?? defaultAdaptiveCardStyles.background};
178
178
  }
179
179
 
180
+ .webchat__bubble__content>div#ms_lcw_webchat_adaptive_card .ac-textBlock {
181
+ color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp2 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp2 === void 0 ? void 0 : _webChatContainerProp2.color) ?? defaultAdaptiveCardStyles.color} !important;
182
+ }
183
+
180
184
  .webchat__stacked-layout__content div.webchat__stacked-layout__message-row div.webchat__bubble--from-user {
181
- max-width: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp2 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp2 === void 0 ? void 0 : (_webChatContainerProp3 = _webChatContainerProp2.userMessageBoxStyles) === null || _webChatContainerProp3 === void 0 ? void 0 : _webChatContainerProp3.maxWidth) ?? (defaultUserMessageBoxStyles === null || defaultUserMessageBoxStyles === void 0 ? void 0 : defaultUserMessageBoxStyles.maxWidth)}
185
+ max-width: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp3 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp3 === void 0 ? void 0 : (_webChatContainerProp4 = _webChatContainerProp3.userMessageBoxStyles) === null || _webChatContainerProp4 === void 0 ? void 0 : _webChatContainerProp4.maxWidth) ?? (defaultUserMessageBoxStyles === null || defaultUserMessageBoxStyles === void 0 ? void 0 : defaultUserMessageBoxStyles.maxWidth)}
182
186
  }
183
187
 
184
188
  .webchat__stacked-layout--show-avatar div.webchat__stacked-layout__content div.webchat__stacked-layout__message-row div.webchat__stacked-layout__message {
185
- max-width: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp4 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp4 === void 0 ? void 0 : (_webChatContainerProp5 = _webChatContainerProp4.systemMessageBoxStyles) === null || _webChatContainerProp5 === void 0 ? void 0 : _webChatContainerProp5.maxWidth) ?? (defaultSystemMessageBoxStyles === null || defaultSystemMessageBoxStyles === void 0 ? void 0 : defaultSystemMessageBoxStyles.maxWidth)}
189
+ max-width: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp5 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp5 === void 0 ? void 0 : (_webChatContainerProp6 = _webChatContainerProp5.systemMessageBoxStyles) === null || _webChatContainerProp6 === void 0 ? void 0 : _webChatContainerProp6.maxWidth) ?? (defaultSystemMessageBoxStyles === null || defaultSystemMessageBoxStyles === void 0 ? void 0 : defaultSystemMessageBoxStyles.maxWidth)}
186
190
  }
187
191
 
188
192
  div[class="ac-textBlock"] *,
189
- div[class="ac-input-container"] * {white-space:${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp6 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp6 === void 0 ? void 0 : _webChatContainerProp6.textWhiteSpace) ?? defaultAdaptiveCardStyles.textWhiteSpace}}
193
+ div[class="ac-input-container"] * {white-space:${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp7 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp7 === void 0 ? void 0 : _webChatContainerProp7.textWhiteSpace) ?? defaultAdaptiveCardStyles.textWhiteSpace}}
190
194
 
191
195
  div[class="ac-input-container"] input.ac-multichoiceInput,
192
196
  div[class="ac-input-container"] select.ac-multichoiceInput {
193
- ${webChatContainerProps !== null && webChatContainerProps !== void 0 && (_webChatContainerProp7 = webChatContainerProps.adaptiveCardStyles) !== null && _webChatContainerProp7 !== void 0 && _webChatContainerProp7.choiceInputPadding ? `padding: ${webChatContainerProps.adaptiveCardStyles.choiceInputPadding} !important;` : ""}
197
+ ${webChatContainerProps !== null && webChatContainerProps !== void 0 && (_webChatContainerProp8 = webChatContainerProps.adaptiveCardStyles) !== null && _webChatContainerProp8 !== void 0 && _webChatContainerProp8.choiceInputPadding ? `padding: ${webChatContainerProps.adaptiveCardStyles.choiceInputPadding} !important;` : ""}
194
198
  }
195
199
 
196
200
  .ms_lcw_webchat_received_message>div.webchat__stacked-layout>div.webchat__stacked-layout__main>div.webchat__stacked-layout__content>div.webchat__stacked-layout__message-row>[class^=webchat]:not(.webchat__bubble--from-user)>.webchat__bubble__content {
@@ -202,15 +206,15 @@ export const WebChatContainerStateful = props => {
202
206
  div[class="ac-textBlock"] a:visited,
203
207
  div[class="ac-textBlock"] a:hover,
204
208
  div[class="ac-textBlock"] a:active {
205
- color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp8 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp8 === void 0 ? void 0 : _webChatContainerProp8.anchorColor) ?? defaultAdaptiveCardStyles.anchorColor};
209
+ color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp9 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp9 === void 0 ? void 0 : _webChatContainerProp9.anchorColor) ?? defaultAdaptiveCardStyles.anchorColor};
206
210
  }
207
211
 
208
- .webchat__stacked-layout__content .ac-actionSet > .ac-pushButton > div {white-space: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp9 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp9 === void 0 ? void 0 : _webChatContainerProp9.buttonWhiteSpace) ?? defaultAdaptiveCardStyles.buttonWhiteSpace} !important;}
212
+ .webchat__stacked-layout__content .ac-actionSet > .ac-pushButton > div {white-space: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp10 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp10 === void 0 ? void 0 : _webChatContainerProp10.buttonWhiteSpace) ?? defaultAdaptiveCardStyles.buttonWhiteSpace} !important;}
209
213
 
210
214
  .ms_lcw_webchat_received_message img.webchat__render-markdown__external-link-icon {
211
215
  /* Fallback for browsers that don't support mask */
212
216
  background-image: url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIzIDMgMTggMTgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTcuMjUwMSA0LjUwMDE3SDEwLjc0OTVDMTEuMTYzNyA0LjUwMDE3IDExLjQ5OTUgNC44MzU5NiAxMS40OTk1IDUuMjUwMTdDMTEuNDk5NSA1LjYyOTg2IDExLjIxNzMgNS45NDM2NiAxMC44NTEzIDUuOTkzMzJMMTAuNzQ5NSA2LjAwMDE3SDcuMjQ5NzRDNi4wNzA3OSA1Ljk5OTYxIDUuMTAzNDkgNi45MDY1NiA1LjAwNzg2IDguMDYxMTJMNS4wMDAyOCA4LjIyMDAzTDUuMDAzMTIgMTYuNzUwN0M1LjAwMzQzIDE3Ljk0MTUgNS45Mjg4NSAxOC45MTYxIDcuMDk5NjYgMTguOTk0OUw3LjI1MzcxIDE5LjAwMDFMMTUuNzUxOCAxOC45ODg0QzE2Ljk0MTUgMTguOTg2OCAxNy45MTQ1IDE4LjA2MiAxNy45OTM1IDE2Ljg5MjNMMTcuOTk4NyAxNi43Mzg0VjEzLjIzMjFDMTcuOTk4NyAxMi44MTc5IDE4LjMzNDUgMTIuNDgyMSAxOC43NDg3IDEyLjQ4MjFDMTkuMTI4NCAxMi40ODIxIDE5LjQ0MjIgMTIuNzY0MyAxOS40OTE4IDEzLjEzMDNMMTkuNDk4NyAxMy4yMzIxVjE2LjczODRDMTkuNDk4NyAxOC43NDA3IDE3LjkyOTMgMjAuMzc2OSAxNS45NTI4IDIwLjQ4MjlMMTUuNzUzOCAyMC40ODg0TDcuMjU4MjcgMjAuNTAwMUw3LjA1NDk1IDIwLjQ5NDlDNS4xNDIzOSAyMC4zOTU0IDMuNjA4OTUgMTguODYyNyAzLjUwODM3IDE2Ljk1MDJMMy41MDMxMiAxNi43NTExTDMuNTAwODkgOC4yNTI3TDMuNTA1MjkgOC4wNTAyQzMuNjA1MzkgNi4xMzc0OSA1LjEzODY3IDQuNjA0NDkgNy4wNTA5NiA0LjUwNTI3TDcuMjUwMSA0LjUwMDE3SDEwLjc0OTVINy4yNTAxWk0xMy43NDgxIDMuMDAxNDZMMjAuMzAxOCAzLjAwMTk3TDIwLjQwMTQgMy4wMTU3NUwyMC41MDIyIDMuMDQzOTNMMjAuNTU5IDMuMDY4MDNDMjAuNjEyMiAzLjA5MTIyIDIwLjY2MzQgMy4xMjE2MyAyMC43MTExIDMuMTU4ODVMMjAuNzgwNCAzLjIyMTU2TDIwLjg2NDEgMy4zMjAxNEwyMC45MTgzIDMuNDEwMjVMMjAuOTU3IDMuNTAwNTdMMjAuOTc2MiAzLjU2NDc2TDIwLjk4OTggMy42Mjg2MkwyMC45OTkyIDMuNzIyODJMMjAuOTk5NyAxMC4yNTU0QzIwLjk5OTcgMTAuNjY5NiAyMC42NjM5IDExLjAwNTQgMjAuMjQ5NyAxMS4wMDU0QzE5Ljg3IDExLjAwNTQgMTkuNTU2MiAxMC43MjMyIDE5LjUwNjUgMTAuMzU3MUwxOS40OTk3IDEwLjI1NTRMMTkuNDk4OSA1LjU2MTQ3TDEyLjI3OTcgMTIuNzg0N0MxMi4wMTM0IDEzLjA1MSAxMS41OTY4IDEzLjA3NTMgMTEuMzAzMSAxMi44NTc1TDExLjIxOSAxMi43ODQ5QzEwLjk1MjcgMTIuNTE4NyAxMC45Mjg0IDEyLjEwMjEgMTEuMTQ2MiAxMS44MDg0TDExLjIxODggMTEuNzI0M0wxOC40MzY5IDQuNTAxNDZIMTMuNzQ4MUMxMy4zNjg0IDQuNTAxNDYgMTMuMDU0NiA0LjIxOTMxIDEzLjAwNSAzLjg1MzI0TDEyLjk5ODEgMy43NTE0NkMxMi45OTgxIDMuMzcxNzcgMTMuMjgwMyAzLjA1Nzk3IDEzLjY0NjQgMy4wMDgzMUwxMy43NDgxIDMuMDAxNDZaIiBmaWxsPSIjRkZGRkZGIiAvPjwvc3ZnPg==);
213
- filter: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp10 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp10 === void 0 ? void 0 : (_webChatContainerProp11 = _webChatContainerProp10.receivedMessageAnchorStyles) === null || _webChatContainerProp11 === void 0 ? void 0 : _webChatContainerProp11.filter) ?? (defaultReceivedMessageAnchorStyles === null || defaultReceivedMessageAnchorStyles === void 0 ? void 0 : defaultReceivedMessageAnchorStyles.filter)};
217
+ filter: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp11 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp11 === void 0 ? void 0 : (_webChatContainerProp12 = _webChatContainerProp11.receivedMessageAnchorStyles) === null || _webChatContainerProp12 === void 0 ? void 0 : _webChatContainerProp12.filter) ?? (defaultReceivedMessageAnchorStyles === null || defaultReceivedMessageAnchorStyles === void 0 ? void 0 : defaultReceivedMessageAnchorStyles.filter)};
214
218
  height: .75em;
215
219
  width: .75em;
216
220
  margin-left: .25em;
@@ -220,7 +224,7 @@ export const WebChatContainerStateful = props => {
220
224
  .ms_lcw_webchat_sent_message img.webchat__render-markdown__external-link-icon {
221
225
  /* Fallback for browsers that don't support mask */
222
226
  background-image: url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIzIDMgMTggMTgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTcuMjUwMSA0LjUwMDE3SDEwLjc0OTVDMTEuMTYzNyA0LjUwMDE3IDExLjQ5OTUgNC44MzU5NiAxMS40OTk1IDUuMjUwMTdDMTEuNDk5NSA1LjYyOTg2IDExLjIxNzMgNS45NDM2NiAxMC44NTEzIDUuOTkzMzJMMTAuNzQ5NSA2LjAwMDE3SDcuMjQ5NzRDNi4wNzA3OSA1Ljk5OTYxIDUuMTAzNDkgNi45MDY1NiA1LjAwNzg2IDguMDYxMTJMNS4wMDAyOCA4LjIyMDAzTDUuMDAzMTIgMTYuNzUwN0M1LjAwMzQzIDE3Ljk0MTUgNS45Mjg4NSAxOC45MTYxIDcuMDk5NjYgMTguOTk0OUw3LjI1MzcxIDE5LjAwMDFMMTUuNzUxOCAxOC45ODg0QzE2Ljk0MTUgMTguOTg2OCAxNy45MTQ1IDE4LjA2MiAxNy45OTM1IDE2Ljg5MjNMMTcuOTk4NyAxNi43Mzg0VjEzLjIzMjFDMTcuOTk4NyAxMi44MTc5IDE4LjMzNDUgMTIuNDgyMSAxOC43NDg3IDEyLjQ4MjFDMTkuMTI4NCAxMi40ODIxIDE5LjQ0MjIgMTIuNzY0MyAxOS40OTE4IDEzLjEzMDNMMTkuNDk4NyAxMy4yMzIxVjE2LjczODRDMTkuNDk4NyAxOC43NDA3IDE3LjkyOTMgMjAuMzc2OSAxNS45NTI4IDIwLjQ4MjlMMTUuNzUzOCAyMC40ODg0TDcuMjU4MjcgMjAuNTAwMUw3LjA1NDk1IDIwLjQ5NDlDNS4xNDIzOSAyMC4zOTU0IDMuNjA4OTUgMTguODYyNyAzLjUwODM3IDE2Ljk1MDJMMy41MDMxMiAxNi43NTExTDMuNTAwODkgOC4yNTI3TDMuNTA1MjkgOC4wNTAyQzMuNjA1MzkgNi4xMzc0OSA1LjEzODY3IDQuNjA0NDkgNy4wNTA5NiA0LjUwNTI3TDcuMjUwMSA0LjUwMDE3SDEwLjc0OTVINy4yNTAxWk0xMy43NDgxIDMuMDAxNDZMMjAuMzAxOCAzLjAwMTk3TDIwLjQwMTQgMy4wMTU3NUwyMC41MDIyIDMuMDQzOTNMMjAuNTU5IDMuMDY4MDNDMjAuNjEyMiAzLjA5MTIyIDIwLjY2MzQgMy4xMjE2MyAyMC43MTExIDMuMTU4ODVMMjAuNzgwNCAzLjIyMTU2TDIwLjg2NDEgMy4zMjAxNEwyMC45MTgzIDMuNDEwMjVMMjAuOTU3IDMuNTAwNTdMMjAuOTc2MiAzLjU2NDc2TDIwLjk4OTggMy42Mjg2MkwyMC45OTkyIDMuNzIyODJMMjAuOTk5NyAxMC4yNTU0QzIwLjk5OTcgMTAuNjY5NiAyMC42NjM5IDExLjAwNTQgMjAuMjQ5NyAxMS4wMDU0QzE5Ljg3IDExLjAwNTQgMTkuNTU2MiAxMC43MjMyIDE5LjUwNjUgMTAuMzU3MUwxOS40OTk3IDEwLjI1NTRMMTkuNDk4OSA1LjU2MTQ3TDEyLjI3OTcgMTIuNzg0N0MxMi4wMTM0IDEzLjA1MSAxMS41OTY4IDEzLjA3NTMgMTEuMzAzMSAxMi44NTc1TDExLjIxOSAxMi43ODQ5QzEwLjk1MjcgMTIuNTE4NyAxMC45Mjg0IDEyLjEwMjEgMTEuMTQ2MiAxMS44MDg0TDExLjIxODggMTEuNzI0M0wxOC40MzY5IDQuNTAxNDZIMTMuNzQ4MUMxMy4zNjg0IDQuNTAxNDYgMTMuMDU0NiA0LjIxOTMxIDEzLjAwNSAzLjg1MzI0TDEyLjk5ODEgMy43NTE0NkMxMi45OTgxIDMuMzcxNzcgMTMuMjgwMyAzLjA1Nzk3IDEzLjY0NjQgMy4wMDgzMUwxMy43NDgxIDMuMDAxNDZaIiBmaWxsPSIjRkZGRkZGIiAvPjwvc3ZnPg==);
223
- filter: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp12 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp12 === void 0 ? void 0 : (_webChatContainerProp13 = _webChatContainerProp12.sentMessageAnchorStyles) === null || _webChatContainerProp13 === void 0 ? void 0 : _webChatContainerProp13.filter) ?? (defaultSentMessageAnchorStyles === null || defaultSentMessageAnchorStyles === void 0 ? void 0 : defaultSentMessageAnchorStyles.filter)};
227
+ filter: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp13 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp13 === void 0 ? void 0 : (_webChatContainerProp14 = _webChatContainerProp13.sentMessageAnchorStyles) === null || _webChatContainerProp14 === void 0 ? void 0 : _webChatContainerProp14.filter) ?? (defaultSentMessageAnchorStyles === null || defaultSentMessageAnchorStyles === void 0 ? void 0 : defaultSentMessageAnchorStyles.filter)};
224
228
  height: .75em;
225
229
  width: .75em;
226
230
  margin-left: .25em;
@@ -230,7 +234,7 @@ export const WebChatContainerStateful = props => {
230
234
  /* Modern browsers with mask support */
231
235
  @supports (mask: url()) or (-webkit-mask: url()) {
232
236
  .ms_lcw_webchat_received_message img.webchat__render-markdown__external-link-icon {
233
- background-color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp14 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp14 === void 0 ? void 0 : (_webChatContainerProp15 = _webChatContainerProp14.receivedMessageAnchorStyles) === null || _webChatContainerProp15 === void 0 ? void 0 : _webChatContainerProp15.color) ?? (defaultReceivedMessageAnchorStyles === null || defaultReceivedMessageAnchorStyles === void 0 ? void 0 : defaultReceivedMessageAnchorStyles.color)} !important;
237
+ background-color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp15 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp15 === void 0 ? void 0 : (_webChatContainerProp16 = _webChatContainerProp15.receivedMessageAnchorStyles) === null || _webChatContainerProp16 === void 0 ? void 0 : _webChatContainerProp16.color) ?? (defaultReceivedMessageAnchorStyles === null || defaultReceivedMessageAnchorStyles === void 0 ? void 0 : defaultReceivedMessageAnchorStyles.color)} !important;
234
238
  background-image: none !important;
235
239
  filter: none !important;
236
240
  mask: url("data:image/svg+xml,%3Csvg viewBox='3 3 18 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.2501 4.50017H10.7495C11.1637 4.50017 11.4995 4.83596 11.4995 5.25017C11.4995 5.62986 11.2173 5.94366 10.8513 5.99332L10.7495 6.00017H7.24974C6.07079 5.99961 5.10349 6.90656 5.00786 8.06112L5.00028 8.22003L5.00312 16.7507C5.00343 17.9415 5.92885 18.9161 7.09966 18.9949L7.25371 19.0001L15.7518 18.9884C16.9415 18.9868 17.9145 18.062 17.9935 16.8923L17.9987 16.7384V13.2321C17.9987 12.8179 18.3345 12.4821 18.7487 12.4821C19.1284 12.4821 19.4422 12.7643 19.4918 13.1303L19.4987 13.2321V16.7384C19.4987 18.7407 17.9293 20.3769 15.9528 20.4829L15.7538 20.4884L7.25827 20.5001L7.05495 20.4949C5.14239 20.3954 3.60895 18.8627 3.50837 16.9502L3.50312 16.7511L3.50089 8.2527L3.50529 8.0502C3.60539 6.13749 5.13867 4.60449 7.05096 4.50527L7.2501 4.50017H10.7495H7.2501ZM13.7481 3.00146L20.3018 3.00197L20.4014 3.01575L20.5022 3.04393L20.559 3.06803C20.6122 3.09122 20.6634 3.12163 20.7111 3.15885L20.7804 3.22156L20.8641 3.32014L20.9183 3.41025L20.957 3.50057L20.9762 3.56476L20.9898 3.62862L20.9992 3.72282L20.9997 10.2554C20.9997 10.6696 20.6639 11.0054 20.2497 11.0054C19.87 11.0054 19.5562 10.7232 19.5065 10.3571L19.4997 10.2554L19.4989 5.56147L12.2797 12.7847C12.0134 13.051 11.5968 13.0753 11.3031 12.8575L11.219 12.7849C10.9527 12.5187 10.9284 12.1021 11.1462 11.8084L11.2188 11.7243L18.4369 4.50146H13.7481C13.3684 4.50146 13.0546 4.21931 13.005 3.85324L12.9981 3.75146C12.9981 3.37177 13.2803 3.05797 13.6464 3.00831L13.7481 3.00146Z' fill='currentColor' /%3E%3C/svg%3E") no-repeat center;
@@ -240,7 +244,7 @@ export const WebChatContainerStateful = props => {
240
244
  }
241
245
 
242
246
  .ms_lcw_webchat_sent_message img.webchat__render-markdown__external-link-icon {
243
- background-color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp16 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp16 === void 0 ? void 0 : (_webChatContainerProp17 = _webChatContainerProp16.sentMessageAnchorStyles) === null || _webChatContainerProp17 === void 0 ? void 0 : _webChatContainerProp17.color) ?? (defaultSentMessageAnchorStyles === null || defaultSentMessageAnchorStyles === void 0 ? void 0 : defaultSentMessageAnchorStyles.color)} !important;
247
+ background-color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp17 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp17 === void 0 ? void 0 : (_webChatContainerProp18 = _webChatContainerProp17.sentMessageAnchorStyles) === null || _webChatContainerProp18 === void 0 ? void 0 : _webChatContainerProp18.color) ?? (defaultSentMessageAnchorStyles === null || defaultSentMessageAnchorStyles === void 0 ? void 0 : defaultSentMessageAnchorStyles.color)} !important;
244
248
  background-image: none !important;
245
249
  filter: none !important;
246
250
  mask: url("data:image/svg+xml,%3Csvg viewBox='3 3 18 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.2501 4.50017H10.7495C11.1637 4.50017 11.4995 4.83596 11.4995 5.25017C11.4995 5.62986 11.2173 5.94366 10.8513 5.99332L10.7495 6.00017H7.24974C6.07079 5.99961 5.10349 6.90656 5.00786 8.06112L5.00028 8.22003L5.00312 16.7507C5.00343 17.9415 5.92885 18.9161 7.09966 18.9949L7.25371 19.0001L15.7518 18.9884C16.9415 18.9868 17.9145 18.062 17.9935 16.8923L17.9987 16.7384V13.2321C17.9987 12.8179 18.3345 12.4821 18.7487 12.4821C19.1284 12.4821 19.4422 12.7643 19.4918 13.1303L19.4987 13.2321V16.7384C19.4987 18.7407 17.9293 20.3769 15.9528 20.4829L15.7538 20.4884L7.25827 20.5001L7.05495 20.4949C5.14239 20.3954 3.60895 18.8627 3.50837 16.9502L3.50312 16.7511L3.50089 8.2527L3.50529 8.0502C3.60539 6.13749 5.13867 4.60449 7.05096 4.50527L7.2501 4.50017H10.7495H7.2501ZM13.7481 3.00146L20.3018 3.00197L20.4014 3.01575L20.5022 3.04393L20.559 3.06803C20.6122 3.09122 20.6634 3.12163 20.7111 3.15885L20.7804 3.22156L20.8641 3.32014L20.9183 3.41025L20.957 3.50057L20.9762 3.56476L20.9898 3.62862L20.9992 3.72282L20.9997 10.2554C20.9997 10.6696 20.6639 11.0054 20.2497 11.0054C19.87 11.0054 19.5562 10.7232 19.5065 10.3571L19.4997 10.2554L19.4989 5.56147L12.2797 12.7847C12.0134 13.051 11.5968 13.0753 11.3031 12.8575L11.219 12.7849C10.9527 12.5187 10.9284 12.1021 11.1462 11.8084L11.2188 11.7243L18.4369 4.50146H13.7481C13.3684 4.50146 13.0546 4.21931 13.005 3.85324L12.9981 3.75146C12.9981 3.37177 13.2803 3.05797 13.6464 3.00831L13.7481 3.00146Z' fill='currentColor' /%3E%3C/svg%3E") no-repeat center;
@@ -258,18 +262,18 @@ export const WebChatContainerStateful = props => {
258
262
  .ms_lcw_webchat_received_message a:visited,
259
263
  .ms_lcw_webchat_received_message a:hover,
260
264
  .ms_lcw_webchat_received_message a:active {
261
- color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp18 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp18 === void 0 ? void 0 : (_webChatContainerProp19 = _webChatContainerProp18.receivedMessageAnchorStyles) === null || _webChatContainerProp19 === void 0 ? void 0 : _webChatContainerProp19.color) ?? (defaultReceivedMessageAnchorStyles === null || defaultReceivedMessageAnchorStyles === void 0 ? void 0 : defaultReceivedMessageAnchorStyles.color)};
265
+ color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp19 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp19 === void 0 ? void 0 : (_webChatContainerProp20 = _webChatContainerProp19.receivedMessageAnchorStyles) === null || _webChatContainerProp20 === void 0 ? void 0 : _webChatContainerProp20.color) ?? (defaultReceivedMessageAnchorStyles === null || defaultReceivedMessageAnchorStyles === void 0 ? void 0 : defaultReceivedMessageAnchorStyles.color)};
262
266
  }
263
267
  .ms_lcw_webchat_sent_message a:link,
264
268
  .ms_lcw_webchat_sent_message a:visited,
265
269
  .ms_lcw_webchat_sent_message a:hover,
266
270
  .ms_lcw_webchat_sent_message a:active {
267
- color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp20 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp20 === void 0 ? void 0 : (_webChatContainerProp21 = _webChatContainerProp20.sentMessageAnchorStyles) === null || _webChatContainerProp21 === void 0 ? void 0 : _webChatContainerProp21.color) ?? (defaultSentMessageAnchorStyles === null || defaultSentMessageAnchorStyles === void 0 ? void 0 : defaultSentMessageAnchorStyles.color)};
271
+ color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp21 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp21 === void 0 ? void 0 : (_webChatContainerProp22 = _webChatContainerProp21.sentMessageAnchorStyles) === null || _webChatContainerProp22 === void 0 ? void 0 : _webChatContainerProp22.color) ?? (defaultSentMessageAnchorStyles === null || defaultSentMessageAnchorStyles === void 0 ? void 0 : defaultSentMessageAnchorStyles.color)};
268
272
  }
269
273
 
270
274
  // we had a nasty bug long time ago with crashing borders messing with the sendbox, so if customer adds this value, they need to deal with that
271
275
  .webchat__bubble:not(.webchat__bubble--from-user) .webchat__bubble__content {
272
- border-radius: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp22 = webChatContainerProps.webChatStyles) === null || _webChatContainerProp22 === void 0 ? void 0 : _webChatContainerProp22.bubbleBorderRadius) ?? 0} !important; /* Override border-radius */
276
+ border-radius: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp23 = webChatContainerProps.webChatStyles) === null || _webChatContainerProp23 === void 0 ? void 0 : _webChatContainerProp23.bubbleBorderRadius) ?? 0} !important; /* Override border-radius */
273
277
  }
274
278
 
275
279
  .webchat__stacked-layout_container>div {
@@ -7,15 +7,14 @@
7
7
  import { Constants } from "../../../../../common/Constants";
8
8
  import { DeliveryMode } from "@microsoft/omnichannel-chat-sdk";
9
9
  import { WebChatActionType } from "../../enums/WebChatActionType";
10
-
11
10
  // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unused-vars
12
- const channelDataMiddleware = _ref => {
11
+ const channelDataMiddleware = addConversationalSurveyTagsCallback => _ref => {
13
12
  let {
14
13
  dispatch
15
14
  } = _ref;
16
15
  return next => action => {
17
- var _action$payload, _action$payload$activ;
18
- if ((action === null || action === void 0 ? void 0 : action.type) === WebChatActionType.DIRECT_LINE_POST_ACTIVITY_PENDING && action !== null && action !== void 0 && (_action$payload = action.payload) !== null && _action$payload !== void 0 && (_action$payload$activ = _action$payload.activity) !== null && _action$payload$activ !== void 0 && _action$payload$activ.channelData) {
16
+ var _action, _action2, _action2$payload, _action2$payload$acti;
17
+ if (((_action = action) === null || _action === void 0 ? void 0 : _action.type) === WebChatActionType.DIRECT_LINE_POST_ACTIVITY_PENDING && (_action2 = action) !== null && _action2 !== void 0 && (_action2$payload = _action2.payload) !== null && _action2$payload !== void 0 && (_action2$payload$acti = _action2$payload.activity) !== null && _action2$payload$acti !== void 0 && _action2$payload$acti.channelData) {
19
18
  const channelIdTag = `${Constants.channelIdKey}${Constants.ChannelId}`;
20
19
  const customerMessageTag = `${Constants.CustomerTag}`;
21
20
  if (action.payload.activity.channelData.tags) {
@@ -29,6 +28,7 @@ const channelDataMiddleware = _ref => {
29
28
  action.payload.activity.channelData.tags = [channelIdTag];
30
29
  action.payload.activity.channelData.tags.push(customerMessageTag);
31
30
  }
31
+ action = addConversationalSurveyTagsCallback(action);
32
32
  action.payload.activity.channelData.metadata = {
33
33
  deliveryMode: DeliveryMode.Bridged
34
34
  };
@@ -11,27 +11,33 @@ import { MessageTypes } from "../../enums/MessageType";
11
11
  import { WebChatActionType } from "../../enums/WebChatActionType";
12
12
 
13
13
  // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unused-vars
14
- const createConversationEndMiddleware = conversationEndCallback => _ref => {
14
+ const createConversationEndMiddleware = (conversationEndCallback, startConversationalSurveyCallback, endConversationalSurveyCallback) => _ref => {
15
15
  let {
16
16
  dispatch
17
17
  } = _ref;
18
18
  return next => action => {
19
19
  var _action$payload;
20
20
  if ((action === null || action === void 0 ? void 0 : action.type) == WebChatActionType.DIRECT_LINE_INCOMING_ACTIVITY && (_action$payload = action.payload) !== null && _action$payload !== void 0 && _action$payload.activity) {
21
- var _activity$from2, _activity$channelData7, _activity$channelData8;
21
+ var _activity$from2, _activity$channelData17, _activity$channelData18;
22
22
  const activity = action.payload.activity;
23
23
  if (activity.channelId === "ACS_CHANNEL") {
24
24
  var _activity$from;
25
25
  if (((_activity$from = activity.from) === null || _activity$from === void 0 ? void 0 : _activity$from.role) === DirectLineSenderRole.Bot) {
26
- var _activity$channelData, _activity$channelData2, _activity$channelData3, _activity$channelData4, _activity$channelData5, _activity$channelData6;
26
+ var _activity$channelData, _activity$channelData2, _activity$channelData3, _activity$channelData4, _activity$channelData5, _activity$channelData6, _activity$channelData7, _activity$channelData8, _activity$channelData9, _activity$channelData10, _activity$channelData11, _activity$channelData12, _activity$channelData13, _activity$channelData14, _activity$channelData15, _activity$channelData16;
27
27
  if ((_activity$channelData = activity.channelData) !== null && _activity$channelData !== void 0 && (_activity$channelData2 = _activity$channelData.tags) !== null && _activity$channelData2 !== void 0 && _activity$channelData2.includes(Constants.systemMessageTag) && ((_activity$channelData3 = activity.channelData) !== null && _activity$channelData3 !== void 0 && (_activity$channelData4 = _activity$channelData3.tags) !== null && _activity$channelData4 !== void 0 && _activity$channelData4.includes(Constants.agentEndConversationMessageTag) || (_activity$channelData5 = activity.channelData) !== null && _activity$channelData5 !== void 0 && (_activity$channelData6 = _activity$channelData5.tags) !== null && _activity$channelData6 !== void 0 && _activity$channelData6.includes(Constants.supervisorForceCloseMessageTag))) {
28
28
  conversationEndCallback();
29
29
  }
30
+ if ((_activity$channelData7 = activity.channelData) !== null && _activity$channelData7 !== void 0 && (_activity$channelData8 = _activity$channelData7.tags) !== null && _activity$channelData8 !== void 0 && _activity$channelData8.includes(Constants.systemMessageTag) && ((_activity$channelData9 = activity.channelData) !== null && _activity$channelData9 !== void 0 && (_activity$channelData10 = _activity$channelData9.tags) !== null && _activity$channelData10 !== void 0 && _activity$channelData10.includes(Constants.startConversationalSurveyMessageTag) || (_activity$channelData11 = activity.channelData) !== null && _activity$channelData11 !== void 0 && (_activity$channelData12 = _activity$channelData11.tags) !== null && _activity$channelData12 !== void 0 && _activity$channelData12.includes(Constants.startConversationalSurveyMessageTag))) {
31
+ startConversationalSurveyCallback();
32
+ }
33
+ if ((_activity$channelData13 = activity.channelData) !== null && _activity$channelData13 !== void 0 && (_activity$channelData14 = _activity$channelData13.tags) !== null && _activity$channelData14 !== void 0 && _activity$channelData14.includes(Constants.systemMessageTag) && (_activity$channelData15 = activity.channelData) !== null && _activity$channelData15 !== void 0 && (_activity$channelData16 = _activity$channelData15.tags) !== null && _activity$channelData16 !== void 0 && _activity$channelData16.includes(Constants.endConversationalSurveyMessageTag)) {
34
+ endConversationalSurveyCallback();
35
+ }
30
36
  }
31
- } else if (((_activity$from2 = activity.from) === null || _activity$from2 === void 0 ? void 0 : _activity$from2.role) === DirectLineSenderRole.Channel && ((_activity$channelData7 = activity.channelData) === null || _activity$channelData7 === void 0 ? void 0 : _activity$channelData7.type) === MessageTypes.Thread && (_activity$channelData8 = activity.channelData) !== null && _activity$channelData8 !== void 0 && _activity$channelData8.properties) {
32
- var _activity$channelData9, _activity$channelData10, _activity$channelData11, _activity$channelData12;
37
+ } else if (((_activity$from2 = activity.from) === null || _activity$from2 === void 0 ? void 0 : _activity$from2.role) === DirectLineSenderRole.Channel && ((_activity$channelData17 = activity.channelData) === null || _activity$channelData17 === void 0 ? void 0 : _activity$channelData17.type) === MessageTypes.Thread && (_activity$channelData18 = activity.channelData) !== null && _activity$channelData18 !== void 0 && _activity$channelData18.properties) {
38
+ var _activity$channelData19, _activity$channelData20, _activity$channelData21, _activity$channelData22;
33
39
  // IC3
34
- if (((_activity$channelData9 = activity.channelData) === null || _activity$channelData9 === void 0 ? void 0 : (_activity$channelData10 = _activity$channelData9.properties) === null || _activity$channelData10 === void 0 ? void 0 : _activity$channelData10.isdeleted) === Constants.truePascal || !((_activity$channelData11 = activity.channelData) !== null && _activity$channelData11 !== void 0 && (_activity$channelData12 = _activity$channelData11.properties) !== null && _activity$channelData12 !== void 0 && _activity$channelData12.containsExternalEntitiesListeningAll)) {
40
+ if (((_activity$channelData19 = activity.channelData) === null || _activity$channelData19 === void 0 ? void 0 : (_activity$channelData20 = _activity$channelData19.properties) === null || _activity$channelData20 === void 0 ? void 0 : _activity$channelData20.isdeleted) === Constants.truePascal || !((_activity$channelData21 = activity.channelData) !== null && _activity$channelData21 !== void 0 && (_activity$channelData22 = _activity$channelData21.properties) !== null && _activity$channelData22 !== void 0 && _activity$channelData22.containsExternalEntitiesListeningAll)) {
35
41
  conversationEndCallback();
36
42
  }
37
43
  }
@@ -0,0 +1,38 @@
1
+ import { WebChatActionType } from "../../enums/WebChatActionType";
2
+ import { LogLevel, TelemetryEvent } from "../../../../../common/telemetry/TelemetryConstants";
3
+ import { TelemetryHelper } from "../../../../../common/telemetry/TelemetryHelper";
4
+ import { LiveChatWidgetActionType } from "../../../../../contexts/common/LiveChatWidgetActionType";
5
+ import { executeReducer } from "../../../../../contexts/createReducer";
6
+ import { isEndConversationDueToOverflowActivity } from "../../../../../common/utils";
7
+ const queueOverflowHandlingHelper = async (state, dispatch) => {
8
+ const {
9
+ appStates
10
+ } = executeReducer(state, {
11
+ type: LiveChatWidgetActionType.GET_IN_MEMORY_STATE,
12
+ payload: undefined
13
+ });
14
+ if (!appStates.chatDisconnectEventReceived) {
15
+ dispatch({
16
+ type: LiveChatWidgetActionType.SET_CHAT_DISCONNECT_EVENT_RECEIVED,
17
+ payload: true
18
+ });
19
+ TelemetryHelper.logActionEvent(LogLevel.INFO, {
20
+ Event: TelemetryEvent.QueueOverflowEvent,
21
+ Description: "Set chat disconnect event received."
22
+ });
23
+ }
24
+ };
25
+ export const createQueueOverflowMiddleware = (state, dispatch) => () => next => action => {
26
+ var _action$payload;
27
+ if ((action === null || action === void 0 ? void 0 : action.type) == WebChatActionType.DIRECT_LINE_INCOMING_ACTIVITY && (_action$payload = action.payload) !== null && _action$payload !== void 0 && _action$payload.activity) {
28
+ const activity = action.payload.activity;
29
+ if (isEndConversationDueToOverflowActivity(activity)) {
30
+ TelemetryHelper.logActionEvent(LogLevel.INFO, {
31
+ Event: TelemetryEvent.QueueOverflowEvent,
32
+ Description: "Queue overflow event received."
33
+ });
34
+ queueOverflowHandlingHelper(state, dispatch);
35
+ }
36
+ }
37
+ return next(action);
38
+ };
@@ -45,5 +45,7 @@ export let LiveChatWidgetActionType;
45
45
  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_SURVEY_MODE"] = 42] = "SET_SURVEY_MODE";
46
46
  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_CONFIRMATION_STATE"] = 43] = "SET_CONFIRMATION_STATE";
47
47
  LiveChatWidgetActionType[LiveChatWidgetActionType["SET_POST_CHAT_PARTICIPANT_TYPE"] = 44] = "SET_POST_CHAT_PARTICIPANT_TYPE";
48
- LiveChatWidgetActionType[LiveChatWidgetActionType["GET_IN_MEMORY_STATE"] = 45] = "GET_IN_MEMORY_STATE";
48
+ LiveChatWidgetActionType[LiveChatWidgetActionType["SET_CONVERSATIONAL_SURVEY_ENABLED"] = 45] = "SET_CONVERSATIONAL_SURVEY_ENABLED";
49
+ LiveChatWidgetActionType[LiveChatWidgetActionType["SET_CONVERSATIONAL_SURVEY_DISPLAY"] = 46] = "SET_CONVERSATIONAL_SURVEY_DISPLAY";
50
+ LiveChatWidgetActionType[LiveChatWidgetActionType["GET_IN_MEMORY_STATE"] = 47] = "GET_IN_MEMORY_STATE";
49
51
  })(LiveChatWidgetActionType || (LiveChatWidgetActionType = {}));
@@ -77,7 +77,9 @@ export const getLiveChatWidgetContextInitialState = props => {
77
77
  conversationEndedBy: ConversationEndEntity.NotSet,
78
78
  chatDisconnectEventReceived: false,
79
79
  selectedSurveyMode: null,
80
- postChatParticipantType: undefined
80
+ postChatParticipantType: undefined,
81
+ isConversationalSurvey: false,
82
+ isConversationalSurveyEnabled: false
81
83
  },
82
84
  uiStates: {
83
85
  showConfirmationPane: false,
@@ -648,6 +648,36 @@ const reducer = (state, action) => {
648
648
  postChatParticipantType: action.payload
649
649
  }
650
650
  };
651
+ case LiveChatWidgetActionType.SET_CONVERSATIONAL_SURVEY_ENABLED:
652
+ inMemory = {
653
+ ...inMemory,
654
+ appStates: {
655
+ ...inMemory.appStates,
656
+ isConversationalSurveyEnabled: action.payload
657
+ }
658
+ };
659
+ return {
660
+ ...state,
661
+ appStates: {
662
+ ...state.appStates,
663
+ isConversationalSurveyEnabled: action.payload
664
+ }
665
+ };
666
+ case LiveChatWidgetActionType.SET_CONVERSATIONAL_SURVEY_DISPLAY:
667
+ inMemory = {
668
+ ...inMemory,
669
+ appStates: {
670
+ ...inMemory.appStates,
671
+ isConversationalSurvey: action.payload
672
+ }
673
+ };
674
+ return {
675
+ ...state,
676
+ appStates: {
677
+ ...state.appStates,
678
+ isConversationalSurvey: action.payload
679
+ }
680
+ };
651
681
  case LiveChatWidgetActionType.GET_IN_MEMORY_STATE:
652
682
  return inMemory;
653
683
  default:
@@ -17,7 +17,7 @@ export const shouldShowEmailTranscriptPane = state => {
17
17
  return state.uiStates.showEmailTranscriptPane;
18
18
  };
19
19
  export const shouldShowWebChatContainer = state => {
20
- return !state.appStates.isMinimized && state.appStates.conversationState === ConversationState.Active || state.appStates.conversationState === ConversationState.InActive;
20
+ return !state.appStates.isMinimized && state.appStates.conversationState === ConversationState.Active || state.appStates.conversationState === ConversationState.InActive || state.appStates.conversationState === ConversationState.Postchat && state.appStates.isConversationalSurveyEnabled && state.appStates.isConversationalSurvey;
21
21
  };
22
22
  export const shouldShowLoadingPane = state => {
23
23
  return !state.appStates.isMinimized && state.appStates.conversationState === ConversationState.Loading;
@@ -42,7 +42,7 @@ export const shouldShowConfirmationPane = state => {
42
42
  return state.uiStates.showConfirmationPane;
43
43
  };
44
44
  export const shouldShowPostChatSurveyPane = state => {
45
- return state.appStates.conversationState === ConversationState.Postchat;
45
+ return state.appStates.conversationState === ConversationState.Postchat && !state.appStates.isConversationalSurvey;
46
46
  };
47
47
  export const shouldShowCallingContainer = state => {
48
48
  return state.appStates.conversationState === ConversationState.Active && state.appStates.e2vvEnabled;