@microsoft/omnichannel-chat-widget 1.8.4-main.cbab5fc → 1.8.4-main.cd79f08

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 (81) hide show
  1. package/README.md +12 -3
  2. package/lib/cjs/common/Constants.js +2 -0
  3. package/lib/cjs/common/facades/FacadeChatSDK.js +235 -9
  4. package/lib/cjs/common/telemetry/TelemetryConstants.js +13 -0
  5. package/lib/cjs/common/telemetry/loggers/appInsightsLogger.js +7 -7
  6. package/lib/cjs/common/utils/xssUtils.js +23 -51
  7. package/lib/cjs/common/utils.js +15 -2
  8. package/lib/cjs/components/errorboundary/ErrorBoundary.js +2 -1
  9. package/lib/cjs/components/livechatwidget/LiveChatWidget.js +9 -1
  10. package/lib/cjs/components/livechatwidget/common/ActivitySubscriber/BotAuthActivitySubscriber.js +23 -6
  11. package/lib/cjs/components/livechatwidget/common/ChatWidgetEvents.js +1 -0
  12. package/lib/cjs/components/livechatwidget/common/PersistentConversationHandler.js +9 -0
  13. package/lib/cjs/components/livechatwidget/common/authHelper.js +44 -4
  14. package/lib/cjs/components/livechatwidget/common/createAdapter.js +3 -2
  15. package/lib/cjs/components/livechatwidget/common/liveChatConfigUtils.js +36 -4
  16. package/lib/cjs/components/livechatwidget/common/startChat.js +31 -14
  17. package/lib/cjs/components/livechatwidget/livechatwidgetstateful/LiveChatWidgetStateful.js +62 -2
  18. package/lib/cjs/components/postchatsurveypanestateful/PostChatSurveyPaneStateful.js +6 -4
  19. package/lib/cjs/components/proactivechatpanestateful/ProactiveChatPaneStateful.js +0 -1
  20. package/lib/cjs/components/webchatcontainerstateful/WebChatContainerStateful.js +42 -27
  21. package/lib/cjs/components/webchatcontainerstateful/common/activityConverters/convertPersistentChatHistoryMessageToActivity.js +117 -16
  22. package/lib/cjs/components/webchatcontainerstateful/common/defaultStyles/defaultAdaptiveCardStyles.js +3 -1
  23. package/lib/cjs/components/webchatcontainerstateful/webchatcontroller/WebChatEventSubscribers.js +13 -2
  24. package/lib/cjs/components/webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/activities/LazyLoadActivity.js +160 -167
  25. package/lib/cjs/components/webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/activityMiddleware.js +1 -1
  26. package/lib/cjs/components/webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/timestamps/NotDeliveredTimestamp.js +2 -0
  27. package/lib/cjs/contexts/common/LiveChatWidgetActionType.js +1 -0
  28. package/lib/cjs/contexts/common/LiveChatWidgetContextInitialState.js +6 -1
  29. package/lib/cjs/contexts/createReducer.js +15 -0
  30. package/lib/cjs/controller/componentController.js +13 -1
  31. package/lib/cjs/plugins/newMessageEventHandler.js +20 -3
  32. package/lib/esm/common/Constants.js +2 -0
  33. package/lib/esm/common/facades/FacadeChatSDK.js +236 -10
  34. package/lib/esm/common/telemetry/TelemetryConstants.js +13 -0
  35. package/lib/esm/common/telemetry/loggers/appInsightsLogger.js +7 -7
  36. package/lib/esm/common/utils/xssUtils.js +23 -51
  37. package/lib/esm/common/utils.js +12 -1
  38. package/lib/esm/components/errorboundary/ErrorBoundary.js +4 -2
  39. package/lib/esm/components/livechatwidget/LiveChatWidget.js +9 -1
  40. package/lib/esm/components/livechatwidget/common/ActivitySubscriber/BotAuthActivitySubscriber.js +23 -6
  41. package/lib/esm/components/livechatwidget/common/ChatWidgetEvents.js +1 -0
  42. package/lib/esm/components/livechatwidget/common/PersistentConversationHandler.js +9 -0
  43. package/lib/esm/components/livechatwidget/common/authHelper.js +44 -4
  44. package/lib/esm/components/livechatwidget/common/createAdapter.js +3 -2
  45. package/lib/esm/components/livechatwidget/common/liveChatConfigUtils.js +33 -2
  46. package/lib/esm/components/livechatwidget/common/startChat.js +31 -14
  47. package/lib/esm/components/livechatwidget/livechatwidgetstateful/LiveChatWidgetStateful.js +62 -2
  48. package/lib/esm/components/postchatsurveypanestateful/PostChatSurveyPaneStateful.js +6 -4
  49. package/lib/esm/components/proactivechatpanestateful/ProactiveChatPaneStateful.js +1 -2
  50. package/lib/esm/components/webchatcontainerstateful/WebChatContainerStateful.js +43 -28
  51. package/lib/esm/components/webchatcontainerstateful/common/activityConverters/convertPersistentChatHistoryMessageToActivity.js +117 -16
  52. package/lib/esm/components/webchatcontainerstateful/common/defaultStyles/defaultAdaptiveCardStyles.js +3 -1
  53. package/lib/esm/components/webchatcontainerstateful/webchatcontroller/WebChatEventSubscribers.js +13 -2
  54. package/lib/esm/components/webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/activities/LazyLoadActivity.js +160 -171
  55. package/lib/esm/components/webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/activityMiddleware.js +1 -1
  56. package/lib/esm/components/webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/timestamps/NotDeliveredTimestamp.js +2 -0
  57. package/lib/esm/components/webchatcontainerstateful/webchatcontroller/middlewares/storemiddlewares/channelDataMiddleware.js +1 -0
  58. package/lib/esm/contexts/common/LiveChatWidgetActionType.js +1 -0
  59. package/lib/esm/contexts/common/LiveChatWidgetContextInitialState.js +6 -1
  60. package/lib/esm/contexts/createReducer.js +15 -0
  61. package/lib/esm/controller/componentController.js +13 -1
  62. package/lib/esm/plugins/newMessageEventHandler.js +20 -3
  63. package/lib/types/common/Constants.d.ts +2 -0
  64. package/lib/types/common/facades/FacadeChatSDK.d.ts +29 -0
  65. package/lib/types/common/facades/types/IFacadeChatSDKInput.d.ts +3 -1
  66. package/lib/types/common/telemetry/TelemetryConstants.d.ts +13 -2
  67. package/lib/types/common/utils/xssUtils.d.ts +5 -21
  68. package/lib/types/common/utils.d.ts +9 -1
  69. package/lib/types/components/errorboundary/ErrorBoundary.d.ts +1 -1
  70. package/lib/types/components/livechatwidget/common/ActivitySubscriber/BotAuthActivitySubscriber.d.ts +1 -0
  71. package/lib/types/components/livechatwidget/common/ChatWidgetEvents.d.ts +2 -1
  72. package/lib/types/components/livechatwidget/common/authHelper.d.ts +9 -2
  73. package/lib/types/components/livechatwidget/common/liveChatConfigUtils.d.ts +11 -0
  74. package/lib/types/components/livechatwidget/interfaces/IBotAuthActivitySubscriberOptionalParams.d.ts +1 -0
  75. package/lib/types/components/webchatcontainerstateful/interfaces/IAdaptiveCardStyles.d.ts +2 -0
  76. package/lib/types/components/webchatcontainerstateful/interfaces/IBotAuthConfig.d.ts +7 -0
  77. package/lib/types/components/webchatcontainerstateful/interfaces/IExtendedChatConffig.d.ts +1 -1
  78. package/lib/types/components/webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/activities/LazyLoadActivity.d.ts +14 -38
  79. package/lib/types/contexts/common/ILiveChatWidgetContext.d.ts +1 -0
  80. package/lib/types/contexts/common/LiveChatWidgetActionType.d.ts +2 -1
  81. package/package.json +15 -6
package/lib/cjs/components/webchatcontainerstateful/WebChatContainerStateful.js CHANGED
@@ -62,7 +62,7 @@ const createMagicCodeSuccessResponse = signin => {
62
62
  };
63
63
  };
64
64
  const WebChatContainerStateful = props => {
65
- var _props$webChatContain, _defaultWebChatContai, _extendedChatConfig$L, _extendedChatConfig$L2, _extendedChatConfig$L3, _extendedChatConfig$L4, _webChatContainerProp, _webChatContainerProp2, _webChatContainerProp3, _webChatContainerProp4, _webChatContainerProp5, _webChatContainerProp6, _webChatContainerProp7, _webChatContainerProp8, _webChatContainerProp9, _props$webChatContain6, _props$webChatContain7, _defaultWebChatContai2, _props$webChatContain8, _props$webChatContain9, _defaultWebChatContai3, _webChatContainerProp10, _webChatContainerProp11, _webChatContainerProp12, _webChatContainerProp13, _webChatContainerProp14, _webChatContainerProp15, _webChatContainerProp16, _webChatContainerProp17, _webChatContainerProp18, _webChatContainerProp19, _webChatContainerProp20, _webChatContainerProp21, _webChatContainerProp22, _webChatContainerProp23, _webChatContainerProp24, _props$webChatContain10, _props$webChatContain11, _webChatContainerProp25, _webChatContainerProp26, _webChatContainerProp27, _webChatContainerProp28, _props$citationPanePr, _props$citationPanePr2, _props$citationPanePr3, _props$citationPanePr4, _props$citationPanePr5;
65
+ var _props$webChatContain, _defaultWebChatContai, _webChatContainerProp, _webChatContainerProp2, _webChatContainerProp3, _webChatContainerProp4, _webChatContainerProp5, _webChatContainerProp6, _webChatContainerProp7, _webChatContainerProp8, _webChatContainerProp9, _webChatContainerProp10, _webChatContainerProp11, _webChatContainerProp12, _props$webChatContain6, _props$webChatContain7, _defaultWebChatContai2, _props$webChatContain8, _props$webChatContain9, _defaultWebChatContai3, _webChatContainerProp13, _webChatContainerProp14, _webChatContainerProp15, _webChatContainerProp16, _webChatContainerProp17, _webChatContainerProp18, _webChatContainerProp19, _webChatContainerProp20, _webChatContainerProp21, _webChatContainerProp22, _webChatContainerProp23, _webChatContainerProp24, _webChatContainerProp25, _webChatContainerProp26, _webChatContainerProp27, _webChatContainerProp28, _webChatContainerProp29, _props$webChatContain10, _props$webChatContain11, _webChatContainerProp30, _webChatContainerProp31, _webChatContainerProp32, _webChatContainerProp33, _props$citationPanePr, _props$citationPanePr2, _props$citationPanePr3, _props$citationPanePr4, _props$citationPanePr5;
66
66
  const [facadeChatSDK] = (0, _useFacadeChatSDKStore.default)();
67
67
 
68
68
  // Create a font family that includes emoji support, based on the primary font or default
@@ -96,12 +96,9 @@ const WebChatContainerStateful = props => {
96
96
 
97
97
  // Type the chatConfig properly to avoid 'any' usage
98
98
  const extendedChatConfig = props.chatConfig;
99
- const isHistoryEnabledInConfig = extendedChatConfig === null || extendedChatConfig === void 0 ? void 0 : (_extendedChatConfig$L = extendedChatConfig.LiveWSAndLiveChatEngJoin) === null || _extendedChatConfig$L === void 0 ? void 0 : _extendedChatConfig$L.msdyn_enablepersistentchatpreviousconversations;
100
- const isHistoryEnabledViaFCB = extendedChatConfig === null || extendedChatConfig === void 0 ? void 0 : (_extendedChatConfig$L2 = extendedChatConfig.LcwFcbConfiguration) === null || _extendedChatConfig$L2 === void 0 ? void 0 : _extendedChatConfig$L2.lcwPersistentChatHistoryEnabled;
101
- const isPersistentChatEnabledForWidget = !!(extendedChatConfig !== null && extendedChatConfig !== void 0 && (_extendedChatConfig$L3 = extendedChatConfig.LiveChatConfigAuthSettings) !== null && _extendedChatConfig$L3 !== void 0 && _extendedChatConfig$L3.msdyn_javascriptclientfunction) || (0, _liveChatConfigUtils.isPersistentChatEnabled)(extendedChatConfig === null || extendedChatConfig === void 0 ? void 0 : (_extendedChatConfig$L4 = extendedChatConfig.LiveWSAndLiveChatEngJoin) === null || _extendedChatConfig$L4 === void 0 ? void 0 : _extendedChatConfig$L4.msdyn_conversationmode);
102
99
 
103
- // Check if both persistent chat and widget support are enabled
104
- const shouldLoadPersistentHistoryMessages = isHistoryEnabledInConfig && isHistoryEnabledViaFCB && isPersistentChatEnabledForWidget;
100
+ // Determine if persistent chat history should be loaded based on all conditions
101
+ const shouldLoadPersistentHistoryMessages = (0, _liveChatConfigUtils.shouldLoadPersistentChatHistory)(extendedChatConfig);
105
102
  if (shouldLoadPersistentHistoryMessages) {
106
103
  _TelemetryHelper.TelemetryHelper.logLoadingEvent(_TelemetryConstants.LogLevel.INFO, {
107
104
  Event: _TelemetryConstants.TelemetryEvent.PersistentChatHistoryEnabled
@@ -154,10 +151,18 @@ const WebChatContainerStateful = props => {
154
151
  document.addEventListener("click", clickHandler);
155
152
  return () => document.removeEventListener("click", clickHandler);
156
153
  }, [state]);
154
+ const minimizedStyles = state.appStates.isMinimized ? shouldLoadPersistentHistoryMessages ? {
155
+ visibility: "hidden",
156
+ position: "absolute",
157
+ width: 0,
158
+ height: 0,
159
+ overflow: "hidden",
160
+ pointerEvents: "none"
161
+ } : {
162
+ display: "none"
163
+ } : {};
157
164
  const containerStyles = {
158
- root: Object.assign({}, _defaultWebChatContainerStatefulProps.defaultWebChatContainerStatefulProps.containerStyles, webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : webChatContainerProps.containerStyles, {
159
- display: state.appStates.isMinimized ? "none" : ""
160
- }) // Use this instead of removing WebChat from the picture so that the activity observer inside the adapter is not invoked
165
+ root: Object.assign({}, _defaultWebChatContainerStatefulProps.defaultWebChatContainerStatefulProps.containerStyles, webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : webChatContainerProps.containerStyles, minimizedStyles) // Use visibility-based hiding instead of display:none to preserve scroll position across minimize/maximize
161
166
  };
162
167
 
163
168
  const localizedTexts = {
@@ -264,34 +269,37 @@ const WebChatContainerStateful = props => {
264
269
  return /*#__PURE__*/_react2.default.createElement(_react2.default.Fragment, null, /*#__PURE__*/_react2.default.createElement("style", null, `
265
270
  .webchat__stacked-layout__content .ac-pushButton {
266
271
  cursor: pointer;
272
+ border: 1px solid ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp === void 0 ? void 0 : _webChatContainerProp.color) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.color} !important;
273
+ color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp2 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp2 === void 0 ? void 0 : _webChatContainerProp2.color) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.color} !important;
274
+ background-color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp3 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp3 === void 0 ? void 0 : _webChatContainerProp3.background) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.background};
267
275
  }
268
276
 
269
277
  .webchat__bubble__content>div#ms_lcw_webchat_adaptive_card {
270
- background: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp === void 0 ? void 0 : _webChatContainerProp.background) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.background};
278
+ background: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp4 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp4 === void 0 ? void 0 : _webChatContainerProp4.background) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.background};
271
279
  }
272
280
 
273
281
  .webchat__bubble__content>div#ms_lcw_webchat_adaptive_card .ac-textBlock[role=heading] {
274
- color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp2 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp2 === void 0 ? void 0 : _webChatContainerProp2.color) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.color} !important;
282
+ color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp5 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp5 === void 0 ? void 0 : _webChatContainerProp5.color) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.color} !important;
275
283
  }
276
284
 
277
285
  .webchat__bubble__content>div#ms_lcw_webchat_adaptive_card label .ac-textRun:first-child {
278
- color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp3 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp3 === void 0 ? void 0 : _webChatContainerProp3.color) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.color} !important;
286
+ color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp6 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp6 === void 0 ? void 0 : _webChatContainerProp6.color) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.color} !important;
279
287
  }
280
288
 
281
289
  .webchat__stacked-layout__content div.webchat__stacked-layout__message-row div.webchat__bubble--from-user {
282
- max-width: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp4 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp4 === void 0 ? void 0 : (_webChatContainerProp5 = _webChatContainerProp4.userMessageBoxStyles) === null || _webChatContainerProp5 === void 0 ? void 0 : _webChatContainerProp5.maxWidth) ?? (_defaultUserMessageBoxStyles.defaultUserMessageBoxStyles === null || _defaultUserMessageBoxStyles.defaultUserMessageBoxStyles === void 0 ? void 0 : _defaultUserMessageBoxStyles.defaultUserMessageBoxStyles.maxWidth)}
290
+ max-width: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp7 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp7 === void 0 ? void 0 : (_webChatContainerProp8 = _webChatContainerProp7.userMessageBoxStyles) === null || _webChatContainerProp8 === void 0 ? void 0 : _webChatContainerProp8.maxWidth) ?? (_defaultUserMessageBoxStyles.defaultUserMessageBoxStyles === null || _defaultUserMessageBoxStyles.defaultUserMessageBoxStyles === void 0 ? void 0 : _defaultUserMessageBoxStyles.defaultUserMessageBoxStyles.maxWidth)}
283
291
  }
284
292
 
285
293
  .webchat__stacked-layout--show-avatar div.webchat__stacked-layout__content div.webchat__stacked-layout__message-row div.webchat__stacked-layout__message {
286
- max-width: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp6 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp6 === void 0 ? void 0 : (_webChatContainerProp7 = _webChatContainerProp6.systemMessageBoxStyles) === null || _webChatContainerProp7 === void 0 ? void 0 : _webChatContainerProp7.maxWidth) ?? (_defaultSystemMessageBoxStyles.defaultSystemMessageBoxStyles === null || _defaultSystemMessageBoxStyles.defaultSystemMessageBoxStyles === void 0 ? void 0 : _defaultSystemMessageBoxStyles.defaultSystemMessageBoxStyles.maxWidth)}
294
+ max-width: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp9 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp9 === void 0 ? void 0 : (_webChatContainerProp10 = _webChatContainerProp9.systemMessageBoxStyles) === null || _webChatContainerProp10 === void 0 ? void 0 : _webChatContainerProp10.maxWidth) ?? (_defaultSystemMessageBoxStyles.defaultSystemMessageBoxStyles === null || _defaultSystemMessageBoxStyles.defaultSystemMessageBoxStyles === void 0 ? void 0 : _defaultSystemMessageBoxStyles.defaultSystemMessageBoxStyles.maxWidth)}
287
295
  }
288
296
 
289
297
  div[class="ac-textBlock"] *,
290
- div[class="ac-input-container"] * {white-space:${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp8 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp8 === void 0 ? void 0 : _webChatContainerProp8.textWhiteSpace) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.textWhiteSpace}}
298
+ div[class="ac-input-container"] * {white-space:${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp11 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp11 === void 0 ? void 0 : _webChatContainerProp11.textWhiteSpace) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.textWhiteSpace}}
291
299
 
292
300
  div[class="ac-input-container"] input.ac-multichoiceInput,
293
301
  div[class="ac-input-container"] select.ac-multichoiceInput {
294
- ${webChatContainerProps !== null && webChatContainerProps !== void 0 && (_webChatContainerProp9 = webChatContainerProps.adaptiveCardStyles) !== null && _webChatContainerProp9 !== void 0 && _webChatContainerProp9.choiceInputPadding ? `padding: ${webChatContainerProps.adaptiveCardStyles.choiceInputPadding} !important;` : ""}
302
+ ${webChatContainerProps !== null && webChatContainerProps !== void 0 && (_webChatContainerProp12 = webChatContainerProps.adaptiveCardStyles) !== null && _webChatContainerProp12 !== void 0 && _webChatContainerProp12.choiceInputPadding ? `padding: ${webChatContainerProps.adaptiveCardStyles.choiceInputPadding} !important;` : ""}
295
303
  }
296
304
 
297
305
  .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 {
@@ -303,15 +311,22 @@ const WebChatContainerStateful = props => {
303
311
  div[class="ac-textBlock"] a:visited,
304
312
  div[class="ac-textBlock"] a:hover,
305
313
  div[class="ac-textBlock"] a:active {
306
- color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp10 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp10 === void 0 ? void 0 : _webChatContainerProp10.anchorColor) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.anchorColor};
314
+ color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp13 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp13 === void 0 ? void 0 : _webChatContainerProp13.anchorColor) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.anchorColor};
307
315
  }
308
316
 
309
- .webchat__stacked-layout__content .ac-actionSet > .ac-pushButton > div {white-space: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp11 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp11 === void 0 ? void 0 : _webChatContainerProp11.buttonWhiteSpace) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.buttonWhiteSpace} !important;}
317
+ .webchat__stacked-layout__content .ac-actionSet {
318
+ flex-wrap: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp14 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp14 === void 0 ? void 0 : _webChatContainerProp14.buttonFlexWrap) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.buttonFlexWrap} !important;
319
+ gap: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp15 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp15 === void 0 ? void 0 : _webChatContainerProp15.buttonGap) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.buttonGap} !important;
320
+ }
321
+
322
+ .webchat__stacked-layout__content .ac-actionSet > .ac-pushButton > div {
323
+ white-space: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp16 = webChatContainerProps.adaptiveCardStyles) === null || _webChatContainerProp16 === void 0 ? void 0 : _webChatContainerProp16.buttonWhiteSpace) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.buttonWhiteSpace} !important;
324
+ }
310
325
 
311
326
  .ms_lcw_webchat_received_message img.webchat__render-markdown__external-link-icon {
312
327
  /* Fallback for browsers that don't support mask */
313
328
  background-image: url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIzIDMgMTggMTgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTcuMjUwMSA0LjUwMDE3SDEwLjc0OTVDMTEuMTYzNyA0LjUwMDE3IDExLjQ5OTUgNC44MzU5NiAxMS40OTk1IDUuMjUwMTdDMTEuNDk5NSA1LjYyOTg2IDExLjIxNzMgNS45NDM2NiAxMC44NTEzIDUuOTkzMzJMMTAuNzQ5NSA2LjAwMDE3SDcuMjQ5NzRDNi4wNzA3OSA1Ljk5OTYxIDUuMTAzNDkgNi45MDY1NiA1LjAwNzg2IDguMDYxMTJMNS4wMDAyOCA4LjIyMDAzTDUuMDAzMTIgMTYuNzUwN0M1LjAwMzQzIDE3Ljk0MTUgNS45Mjg4NSAxOC45MTYxIDcuMDk5NjYgMTguOTk0OUw3LjI1MzcxIDE5LjAwMDFMMTUuNzUxOCAxOC45ODg0QzE2Ljk0MTUgMTguOTg2OCAxNy45MTQ1IDE4LjA2MiAxNy45OTM1IDE2Ljg5MjNMMTcuOTk4NyAxNi43Mzg0VjEzLjIzMjFDMTcuOTk4NyAxMi44MTc5IDE4LjMzNDUgMTIuNDgyMSAxOC43NDg3IDEyLjQ4MjFDMTkuMTI4NCAxMi40ODIxIDE5LjQ0MjIgMTIuNzY0MyAxOS40OTE4IDEzLjEzMDNMMTkuNDk4NyAxMy4yMzIxVjE2LjczODRDMTkuNDk4NyAxOC43NDA3IDE3LjkyOTMgMjAuMzc2OSAxNS45NTI4IDIwLjQ4MjlMMTUuNzUzOCAyMC40ODg0TDcuMjU4MjcgMjAuNTAwMUw3LjA1NDk1IDIwLjQ5NDlDNS4xNDIzOSAyMC4zOTU0IDMuNjA4OTUgMTguODYyNyAzLjUwODM3IDE2Ljk1MDJMMy41MDMxMiAxNi43NTExTDMuNTAwODkgOC4yNTI3TDMuNTA1MjkgOC4wNTAyQzMuNjA1MzkgNi4xMzc0OSA1LjEzODY3IDQuNjA0NDkgNy4wNTA5NiA0LjUwNTI3TDcuMjUwMSA0LjUwMDE3SDEwLjc0OTVINy4yNTAxWk0xMy43NDgxIDMuMDAxNDZMMjAuMzAxOCAzLjAwMTk3TDIwLjQwMTQgMy4wMTU3NUwyMC41MDIyIDMuMDQzOTNMMjAuNTU5IDMuMDY4MDNDMjAuNjEyMiAzLjA5MTIyIDIwLjY2MzQgMy4xMjE2MyAyMC43MTExIDMuMTU4ODVMMjAuNzgwNCAzLjIyMTU2TDIwLjg2NDEgMy4zMjAxNEwyMC45MTgzIDMuNDEwMjVMMjAuOTU3IDMuNTAwNTdMMjAuOTc2MiAzLjU2NDc2TDIwLjk4OTggMy42Mjg2MkwyMC45OTkyIDMuNzIyODJMMjAuOTk5NyAxMC4yNTU0QzIwLjk5OTcgMTAuNjY5NiAyMC42NjM5IDExLjAwNTQgMjAuMjQ5NyAxMS4wMDU0QzE5Ljg3IDExLjAwNTQgMTkuNTU2MiAxMC43MjMyIDE5LjUwNjUgMTAuMzU3MUwxOS40OTk3IDEwLjI1NTRMMTkuNDk4OSA1LjU2MTQ3TDEyLjI3OTcgMTIuNzg0N0MxMi4wMTM0IDEzLjA1MSAxMS41OTY4IDEzLjA3NTMgMTEuMzAzMSAxMi44NTc1TDExLjIxOSAxMi43ODQ5QzEwLjk1MjcgMTIuNTE4NyAxMC45Mjg0IDEyLjEwMjEgMTEuMTQ2MiAxMS44MDg0TDExLjIxODggMTEuNzI0M0wxOC40MzY5IDQuNTAxNDZIMTMuNzQ4MUMxMy4zNjg0IDQuNTAxNDYgMTMuMDU0NiA0LjIxOTMxIDEzLjAwNSAzLjg1MzI0TDEyLjk5ODEgMy43NTE0NkMxMi45OTgxIDMuMzcxNzcgMTMuMjgwMyAzLjA1Nzk3IDEzLjY0NjQgMy4wMDgzMUwxMy43NDgxIDMuMDAxNDZaIiBmaWxsPSIjRkZGRkZGIiAvPjwvc3ZnPg==);
314
- filter: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp12 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp12 === void 0 ? void 0 : (_webChatContainerProp13 = _webChatContainerProp12.receivedMessageAnchorStyles) === null || _webChatContainerProp13 === void 0 ? void 0 : _webChatContainerProp13.filter) ?? (_defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === null || _defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === void 0 ? void 0 : _defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles.filter)};
329
+ filter: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp17 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp17 === void 0 ? void 0 : (_webChatContainerProp18 = _webChatContainerProp17.receivedMessageAnchorStyles) === null || _webChatContainerProp18 === void 0 ? void 0 : _webChatContainerProp18.filter) ?? (_defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === null || _defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === void 0 ? void 0 : _defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles.filter)};
315
330
  height: .75em;
316
331
  width: .75em;
317
332
  margin-left: .25em;
@@ -321,7 +336,7 @@ const WebChatContainerStateful = props => {
321
336
  .ms_lcw_webchat_sent_message img.webchat__render-markdown__external-link-icon {
322
337
  /* Fallback for browsers that don't support mask */
323
338
  background-image: url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIzIDMgMTggMTgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTcuMjUwMSA0LjUwMDE3SDEwLjc0OTVDMTEuMTYzNyA0LjUwMDE3IDExLjQ5OTUgNC44MzU5NiAxMS40OTk1IDUuMjUwMTdDMTEuNDk5NSA1LjYyOTg2IDExLjIxNzMgNS45NDM2NiAxMC44NTEzIDUuOTkzMzJMMTAuNzQ5NSA2LjAwMDE3SDcuMjQ5NzRDNi4wNzA3OSA1Ljk5OTYxIDUuMTAzNDkgNi45MDY1NiA1LjAwNzg2IDguMDYxMTJMNS4wMDAyOCA4LjIyMDAzTDUuMDAzMTIgMTYuNzUwN0M1LjAwMzQzIDE3Ljk0MTUgNS45Mjg4NSAxOC45MTYxIDcuMDk5NjYgMTguOTk0OUw3LjI1MzcxIDE5LjAwMDFMMTUuNzUxOCAxOC45ODg0QzE2Ljk0MTUgMTguOTg2OCAxNy45MTQ1IDE4LjA2MiAxNy45OTM1IDE2Ljg5MjNMMTcuOTk4NyAxNi43Mzg0VjEzLjIzMjFDMTcuOTk4NyAxMi44MTc5IDE4LjMzNDUgMTIuNDgyMSAxOC43NDg3IDEyLjQ4MjFDMTkuMTI4NCAxMi40ODIxIDE5LjQ0MjIgMTIuNzY0MyAxOS40OTE4IDEzLjEzMDNMMTkuNDk4NyAxMy4yMzIxVjE2LjczODRDMTkuNDk4NyAxOC43NDA3IDE3LjkyOTMgMjAuMzc2OSAxNS45NTI4IDIwLjQ4MjlMMTUuNzUzOCAyMC40ODg0TDcuMjU4MjcgMjAuNTAwMUw3LjA1NDk1IDIwLjQ5NDlDNS4xNDIzOSAyMC4zOTU0IDMuNjA4OTUgMTguODYyNyAzLjUwODM3IDE2Ljk1MDJMMy41MDMxMiAxNi43NTExTDMuNTAwODkgOC4yNTI3TDMuNTA1MjkgOC4wNTAyQzMuNjA1MzkgNi4xMzc0OSA1LjEzODY3IDQuNjA0NDkgNy4wNTA5NiA0LjUwNTI3TDcuMjUwMSA0LjUwMDE3SDEwLjc0OTVINy4yNTAxWk0xMy43NDgxIDMuMDAxNDZMMjAuMzAxOCAzLjAwMTk3TDIwLjQwMTQgMy4wMTU3NUwyMC41MDIyIDMuMDQzOTNMMjAuNTU5IDMuMDY4MDNDMjAuNjEyMiAzLjA5MTIyIDIwLjY2MzQgMy4xMjE2MyAyMC43MTExIDMuMTU4ODVMMjAuNzgwNCAzLjIyMTU2TDIwLjg2NDEgMy4zMjAxNEwyMC45MTgzIDMuNDEwMjVMMjAuOTU3IDMuNTAwNTdMMjAuOTc2MiAzLjU2NDc2TDIwLjk4OTggMy42Mjg2MkwyMC45OTkyIDMuNzIyODJMMjAuOTk5NyAxMC4yNTU0QzIwLjk5OTcgMTAuNjY5NiAyMC42NjM5IDExLjAwNTQgMjAuMjQ5NyAxMS4wMDU0QzE5Ljg3IDExLjAwNTQgMTkuNTU2MiAxMC43MjMyIDE5LjUwNjUgMTAuMzU3MUwxOS40OTk3IDEwLjI1NTRMMTkuNDk4OSA1LjU2MTQ3TDEyLjI3OTcgMTIuNzg0N0MxMi4wMTM0IDEzLjA1MSAxMS41OTY4IDEzLjA3NTMgMTEuMzAzMSAxMi44NTc1TDExLjIxOSAxMi43ODQ5QzEwLjk1MjcgMTIuNTE4NyAxMC45Mjg0IDEyLjEwMjEgMTEuMTQ2MiAxMS44MDg0TDExLjIxODggMTEuNzI0M0wxOC40MzY5IDQuNTAxNDZIMTMuNzQ4MUMxMy4zNjg0IDQuNTAxNDYgMTMuMDU0NiA0LjIxOTMxIDEzLjAwNSAzLjg1MzI0TDEyLjk5ODEgMy43NTE0NkMxMi45OTgxIDMuMzcxNzcgMTMuMjgwMyAzLjA1Nzk3IDEzLjY0NjQgMy4wMDgzMUwxMy43NDgxIDMuMDAxNDZaIiBmaWxsPSIjRkZGRkZGIiAvPjwvc3ZnPg==);
324
- filter: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp14 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp14 === void 0 ? void 0 : (_webChatContainerProp15 = _webChatContainerProp14.sentMessageAnchorStyles) === null || _webChatContainerProp15 === void 0 ? void 0 : _webChatContainerProp15.filter) ?? (_defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles === null || _defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles === void 0 ? void 0 : _defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles.filter)};
339
+ filter: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp19 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp19 === void 0 ? void 0 : (_webChatContainerProp20 = _webChatContainerProp19.sentMessageAnchorStyles) === null || _webChatContainerProp20 === void 0 ? void 0 : _webChatContainerProp20.filter) ?? (_defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles === null || _defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles === void 0 ? void 0 : _defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles.filter)};
325
340
  height: .75em;
326
341
  width: .75em;
327
342
  margin-left: .25em;
@@ -331,7 +346,7 @@ const WebChatContainerStateful = props => {
331
346
  /* Modern browsers with mask support */
332
347
  @supports (mask: url()) or (-webkit-mask: url()) {
333
348
  .ms_lcw_webchat_received_message img.webchat__render-markdown__external-link-icon {
334
- background-color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp16 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp16 === void 0 ? void 0 : (_webChatContainerProp17 = _webChatContainerProp16.receivedMessageAnchorStyles) === null || _webChatContainerProp17 === void 0 ? void 0 : _webChatContainerProp17.color) ?? (_defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === null || _defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === void 0 ? void 0 : _defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles.color)} !important;
349
+ background-color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp21 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp21 === void 0 ? void 0 : (_webChatContainerProp22 = _webChatContainerProp21.receivedMessageAnchorStyles) === null || _webChatContainerProp22 === void 0 ? void 0 : _webChatContainerProp22.color) ?? (_defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === null || _defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === void 0 ? void 0 : _defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles.color)} !important;
335
350
  background-image: none !important;
336
351
  filter: none !important;
337
352
  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;
@@ -341,7 +356,7 @@ const WebChatContainerStateful = props => {
341
356
  }
342
357
 
343
358
  .ms_lcw_webchat_sent_message img.webchat__render-markdown__external-link-icon {
344
- background-color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp18 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp18 === void 0 ? void 0 : (_webChatContainerProp19 = _webChatContainerProp18.sentMessageAnchorStyles) === null || _webChatContainerProp19 === void 0 ? void 0 : _webChatContainerProp19.color) ?? (_defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles === null || _defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles === void 0 ? void 0 : _defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles.color)} !important;
359
+ background-color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp23 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp23 === void 0 ? void 0 : (_webChatContainerProp24 = _webChatContainerProp23.sentMessageAnchorStyles) === null || _webChatContainerProp24 === void 0 ? void 0 : _webChatContainerProp24.color) ?? (_defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles === null || _defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles === void 0 ? void 0 : _defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles.color)} !important;
345
360
  background-image: none !important;
346
361
  filter: none !important;
347
362
  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;
@@ -359,18 +374,18 @@ const WebChatContainerStateful = props => {
359
374
  .ms_lcw_webchat_received_message a:visited,
360
375
  .ms_lcw_webchat_received_message a:hover,
361
376
  .ms_lcw_webchat_received_message a:active {
362
- color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp20 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp20 === void 0 ? void 0 : (_webChatContainerProp21 = _webChatContainerProp20.receivedMessageAnchorStyles) === null || _webChatContainerProp21 === void 0 ? void 0 : _webChatContainerProp21.color) ?? (_defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === null || _defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === void 0 ? void 0 : _defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles.color)};
377
+ color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp25 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp25 === void 0 ? void 0 : (_webChatContainerProp26 = _webChatContainerProp25.receivedMessageAnchorStyles) === null || _webChatContainerProp26 === void 0 ? void 0 : _webChatContainerProp26.color) ?? (_defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === null || _defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles === void 0 ? void 0 : _defaultReceivedMessageAnchorStyles.defaultReceivedMessageAnchorStyles.color)};
363
378
  }
364
379
  .ms_lcw_webchat_sent_message a:link,
365
380
  .ms_lcw_webchat_sent_message a:visited,
366
381
  .ms_lcw_webchat_sent_message a:hover,
367
382
  .ms_lcw_webchat_sent_message a:active {
368
- color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp22 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp22 === void 0 ? void 0 : (_webChatContainerProp23 = _webChatContainerProp22.sentMessageAnchorStyles) === null || _webChatContainerProp23 === void 0 ? void 0 : _webChatContainerProp23.color) ?? (_defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles === null || _defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles === void 0 ? void 0 : _defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles.color)};
383
+ color: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp27 = webChatContainerProps.renderingMiddlewareProps) === null || _webChatContainerProp27 === void 0 ? void 0 : (_webChatContainerProp28 = _webChatContainerProp27.sentMessageAnchorStyles) === null || _webChatContainerProp28 === void 0 ? void 0 : _webChatContainerProp28.color) ?? (_defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles === null || _defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles === void 0 ? void 0 : _defaultSentMessageAnchorStyles.defaultSentMessageAnchorStyles.color)};
369
384
  }
370
385
 
371
386
  // 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
372
387
  .webchat__bubble:not(.webchat__bubble--from-user) .webchat__bubble__content {
373
- border-radius: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp24 = webChatContainerProps.webChatStyles) === null || _webChatContainerProp24 === void 0 ? void 0 : _webChatContainerProp24.bubbleBorderRadius) ?? 0} !important; /* Override border-radius */
388
+ border-radius: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp29 = webChatContainerProps.webChatStyles) === null || _webChatContainerProp29 === void 0 ? void 0 : _webChatContainerProp29.bubbleBorderRadius) ?? 0} !important; /* Override border-radius */
374
389
  }
375
390
 
376
391
  .webchat__stacked-layout_container>div {
@@ -407,8 +422,8 @@ const WebChatContainerStateful = props => {
407
422
 
408
423
  /* Suggested actions carousel previous/next navigation focus */
409
424
  .webchat__suggested-actions .webchat__suggested-actions__carousel .react-film__flipper:focus-visible .react-film__flipper__body {
410
- outline: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp25 = webChatContainerProps.webChatStyles) === null || _webChatContainerProp25 === void 0 ? void 0 : _webChatContainerProp25.suggestedActionKeyboardFocusIndicatorBorderStyle) ?? "dashed"} ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp26 = webChatContainerProps.webChatStyles) === null || _webChatContainerProp26 === void 0 ? void 0 : _webChatContainerProp26.suggestedActionKeyboardFocusIndicatorBorderWidth) ?? "1px"} ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp27 = webChatContainerProps.webChatStyles) === null || _webChatContainerProp27 === void 0 ? void 0 : _webChatContainerProp27.suggestedActionKeyboardFocusIndicatorBorderColor) ?? "#605E5C"} !important;
411
- outline-offset: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp28 = webChatContainerProps.webChatStyles) === null || _webChatContainerProp28 === void 0 ? void 0 : _webChatContainerProp28.suggestedActionKeyboardFocusIndicatorInset) ?? "2px"} !important;
425
+ outline: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp30 = webChatContainerProps.webChatStyles) === null || _webChatContainerProp30 === void 0 ? void 0 : _webChatContainerProp30.suggestedActionKeyboardFocusIndicatorBorderStyle) ?? "dashed"} ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp31 = webChatContainerProps.webChatStyles) === null || _webChatContainerProp31 === void 0 ? void 0 : _webChatContainerProp31.suggestedActionKeyboardFocusIndicatorBorderWidth) ?? "1px"} ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp32 = webChatContainerProps.webChatStyles) === null || _webChatContainerProp32 === void 0 ? void 0 : _webChatContainerProp32.suggestedActionKeyboardFocusIndicatorBorderColor) ?? "#605E5C"} !important;
426
+ outline-offset: ${(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : (_webChatContainerProp33 = webChatContainerProps.webChatStyles) === null || _webChatContainerProp33 === void 0 ? void 0 : _webChatContainerProp33.suggestedActionKeyboardFocusIndicatorInset) ?? "2px"} !important;
412
427
 
413
428
  `), /*#__PURE__*/_react2.default.createElement(_react.Stack, {
414
429
  styles: containerStyles,
package/lib/cjs/components/webchatcontainerstateful/common/activityConverters/convertPersistentChatHistoryMessageToActivity.js CHANGED
@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.default = void 0;
7
7
  var _Constants = require("../../../../common/Constants");
8
+ var _SupportedAdaptiveCards = require("@microsoft/omnichannel-chat-sdk/lib/utils/printers/interfaces/SupportedAdaptiveCards");
8
9
  var _botActivity = _interopRequireDefault(require("../activities/botActivity"));
9
10
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
10
11
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -23,15 +24,24 @@ const convertStringValueToInt = value => {
23
24
 
24
25
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
25
26
  const convertPersistentChatHistoryMessageToActivity = message => {
26
- var _from$user, _from$application;
27
+ var _from$application, _from$user, _from$application2;
27
28
  const {
28
29
  additionalData,
29
30
  attachments,
31
+ botContentType,
30
32
  content,
31
33
  created,
32
34
  from,
33
35
  transcriptOriginalMessageId
34
36
  } = message;
37
+ const isFromCustomer = (from === null || from === void 0 ? void 0 : (_from$application = from.application) === null || _from$application === void 0 ? void 0 : _from$application.displayName) === "Customer";
38
+
39
+ // Filter out customer responses to adaptive cards (e.g., form submissions like {"value":{"goPaperless":"yes"}}).
40
+ // These are the customer's postBack/messageBack replies to bot adaptive cards — not displayable content.
41
+ // In live chat, webchat hides these natively; in history we must filter them explicitly.
42
+ if (isFromCustomer && botContentType === "azurebotservice.adaptivecard") {
43
+ return null;
44
+ }
35
45
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
36
46
  const activity = {
37
47
  ..._botActivity.default,
@@ -53,20 +63,14 @@ const convertPersistentChatHistoryMessageToActivity = message => {
53
63
  }
54
64
  }
55
65
  if (additionalData !== null && additionalData !== void 0 && additionalData.tags) {
56
- const {
57
- tags,
58
- ConversationId
59
- } = additionalData;
60
- if (ConversationId) {
61
- activity.channelData.conversationId = ConversationId;
62
- }
63
- if (tags) {
64
- const formattedTags = additionalData.tags.split(",");
65
- activity.channelData = {
66
- ...activity.channelData,
67
- tags: [...activity.channelData.tags, ...formattedTags]
68
- };
69
- }
66
+ const formattedTags = additionalData.tags.split(",");
67
+ activity.channelData = {
68
+ ...activity.channelData,
69
+ tags: [...activity.channelData.tags, ...formattedTags]
70
+ };
71
+ }
72
+ if (additionalData !== null && additionalData !== void 0 && additionalData.ConversationId) {
73
+ activity.channelData.conversationId = additionalData.ConversationId;
70
74
  }
71
75
  if (from !== null && from !== void 0 && (_from$user = from.user) !== null && _from$user !== void 0 && _from$user.displayName) {
72
76
  activity.from = {
@@ -74,13 +78,110 @@ const convertPersistentChatHistoryMessageToActivity = message => {
74
78
  name: from.user.displayName
75
79
  };
76
80
  }
77
- if ((from === null || from === void 0 ? void 0 : (_from$application = from.application) === null || _from$application === void 0 ? void 0 : _from$application.displayName) === "Customer") {
81
+ if ((from === null || from === void 0 ? void 0 : (_from$application2 = from.application) === null || _from$application2 === void 0 ? void 0 : _from$application2.displayName) === "Customer") {
78
82
  activity.from = {
79
83
  role: "user",
80
84
  name: from.application.displayName
81
85
  };
82
86
  }
83
87
  if (content) {
88
+ var _parsedContent, _parsedContent$value;
89
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
90
+ let parsedContent;
91
+ try {
92
+ parsedContent = JSON.parse(content);
93
+ } catch (error) {
94
+ parsedContent = null; // fall back to normal text handling
95
+ }
96
+
97
+ // Check if this is a customer form submission response (e.g., RichObjectMessage_Form)
98
+ // These should be ignored as they are form submission data, not displayable content
99
+ if (isFromCustomer && ((_parsedContent = parsedContent) === null || _parsedContent === void 0 ? void 0 : (_parsedContent$value = _parsedContent.value) === null || _parsedContent$value === void 0 ? void 0 : _parsedContent$value.type) === "RichObjectMessage_Form") {
100
+ return null;
101
+ }
102
+ if (parsedContent && typeof parsedContent === "object") {
103
+ var _parsedContent$sugges;
104
+ // Structural detection: check the parsed object's properties directly
105
+ const hasAttachments = Array.isArray(parsedContent.attachments) && parsedContent.attachments.length > 0;
106
+ const hasSuggestedActions = Array.isArray((_parsedContent$sugges = parsedContent.suggestedActions) === null || _parsedContent$sugges === void 0 ? void 0 : _parsedContent$sugges.actions) && parsedContent.suggestedActions.actions.length > 0;
107
+ const isRawAdaptiveCardBody = parsedContent.type === "AdaptiveCard";
108
+
109
+ // Filter out suggested-action-only messages from history.
110
+ // WebChat only renders suggestedActions for the most recent activity, so in history
111
+ // these render as empty "Suggested reply" text bubbles with no actionable buttons.
112
+ if (hasSuggestedActions && !hasAttachments) {
113
+ return null;
114
+ }
115
+
116
+ // Substring detection: check the raw content string for known card type patterns
117
+ const contentLower = content.toLowerCase();
118
+ const isAdaptiveCard = contentLower.includes(_Constants.Constants.AdaptiveCardType);
119
+ const isSuggestedActions = contentLower.includes(_Constants.Constants.SuggestedActionsType);
120
+ const containsSupportedCard = Object.values(_SupportedAdaptiveCards.SupportedAdaptiveCards).some(type => contentLower.includes(type.toLowerCase()));
121
+
122
+ // If the content is a raw adaptive card body (type: "AdaptiveCard"), wrap it as an attachment
123
+ // so webchat can render it properly instead of treating it as an unknown activity type
124
+ if (isRawAdaptiveCardBody) {
125
+ return {
126
+ ...activity,
127
+ text: "",
128
+ attachments: [{
129
+ contentType: _SupportedAdaptiveCards.SupportedAdaptiveCards.Adaptive,
130
+ content: parsedContent
131
+ }],
132
+ timestamp,
133
+ channelData: {
134
+ ...activity.channelData,
135
+ "webchat:sequence-id": webchatSequenceId
136
+ }
137
+ };
138
+ }
139
+
140
+ // Detect rich content using both structural checks and substring matching
141
+ if (hasAttachments || hasSuggestedActions || isAdaptiveCard || isSuggestedActions || containsSupportedCard) {
142
+ var _activity$from;
143
+ // Preserve from.role from the base activity — parsedContent.from may lack the role property
144
+ // which webchat needs to determine how to render the message (bot vs user)
145
+ const preservedFrom = {
146
+ ...activity.from,
147
+ ...(parsedContent.from || {}),
148
+ role: ((_activity$from = activity.from) === null || _activity$from === void 0 ? void 0 : _activity$from.role) || "bot"
149
+ };
150
+ return {
151
+ ...activity,
152
+ ...parsedContent,
153
+ from: preservedFrom,
154
+ timestamp,
155
+ channelData: {
156
+ ...activity.channelData,
157
+ "webchat:sequence-id": webchatSequenceId
158
+ }
159
+ };
160
+ }
161
+
162
+ // If parsedContent is a webchat activity (type: "message") but didn't match any specific card check,
163
+ // still treat it as a rich activity to avoid displaying raw JSON as text
164
+ if (parsedContent.type === "message" && (parsedContent.attachments || parsedContent.suggestedActions || parsedContent.value)) {
165
+ var _activity$from2;
166
+ const preservedFrom = {
167
+ ...activity.from,
168
+ ...(parsedContent.from || {}),
169
+ role: ((_activity$from2 = activity.from) === null || _activity$from2 === void 0 ? void 0 : _activity$from2.role) || "bot"
170
+ };
171
+ return {
172
+ ...activity,
173
+ ...parsedContent,
174
+ from: preservedFrom,
175
+ timestamp,
176
+ channelData: {
177
+ ...activity.channelData,
178
+ "webchat:sequence-id": webchatSequenceId
179
+ }
180
+ };
181
+ }
182
+ }
183
+
184
+ // Plain text message
84
185
  return {
85
186
  ...activity,
86
187
  text: content,
package/lib/cjs/components/webchatcontainerstateful/common/defaultStyles/defaultAdaptiveCardStyles.js CHANGED
@@ -9,6 +9,8 @@ const defaultAdaptiveCardStyles = {
9
9
  color: "black",
10
10
  anchorColor: "blue",
11
11
  textWhiteSpace: "normal",
12
- buttonWhiteSpace: "normal"
12
+ buttonWhiteSpace: "normal",
13
+ buttonFlexWrap: "nowrap",
14
+ buttonGap: "0px"
13
15
  };
14
16
  exports.defaultAdaptiveCardStyles = defaultAdaptiveCardStyles;
package/lib/cjs/components/webchatcontainerstateful/webchatcontroller/WebChatEventSubscribers.js CHANGED
@@ -76,15 +76,26 @@ const WebChatEventSubscribers = () => {
76
76
  // Dispatch events when connection is established
77
77
  setTimeout(() => {
78
78
  (0, _dispatchCustomEvent.default)(_ChatWidgetEvents.default.FETCH_PERSISTENT_CHAT_HISTORY);
79
+ // The trigger activity renders the "Loading previous messages..." banner
80
+ // via LazyLoadActivity. We set webchat:sequence-id to 1 and timestamp
81
+ // to epoch+1ms so WebChat sorts this activity BEFORE all history messages
82
+ // (which have sequence-ids based on transcriptOriginalMessageId timestamps).
83
+ // Without these, WebChat places activities without a sequence-id at the
84
+ // end of the transcript, causing the banner to appear at the bottom and
85
+ // breaking the IntersectionObserver pagination trigger (the observer only
86
+ // fires on visibility transitions — if the element starts visible at the
87
+ // bottom, the initial fire is blocked by the paused state and never
88
+ // re-fires since there is no transition).
79
89
  (0, _dispatchCustomEvent.default)(_ChatWidgetEvents.default.ADD_ACTIVITY, {
80
90
  activity: {
81
91
  from: {
82
92
  role: "bot"
83
93
  },
84
- timestamp: 0,
94
+ timestamp: new Date(1).toISOString(),
85
95
  type: "message",
86
96
  channelData: {
87
- tags: [_Constants.Constants.persistentChatHistoryMessagePullTriggerTag]
97
+ tags: [_Constants.Constants.persistentChatHistoryMessagePullTriggerTag],
98
+ "webchat:sequence-id": 1
88
99
  }
89
100
  }
90
101
  });