@microsoft/omnichannel-chat-widget 1.8.4-main.1dd5564 → 1.8.4-main.1f36474

package/lib/cjs/common/Constants.js

@@ -158,7 +158,6 @@ let HtmlIdNames = /*#__PURE__*/_createClass(function HtmlIdNames() {
 });
 exports.HtmlIdNames = HtmlIdNames;
 _defineProperty(HtmlIdNames, "MSLiveChatWidget", "MSLiveChatWidget");
-_defineProperty(HtmlIdNames, "fileSentAnnouncementRegionId", "ms_lcw_file_sent_announcement");
 let HtmlClassNames = /*#__PURE__*/_createClass(function HtmlClassNames() {
   _classCallCheck(this, HtmlClassNames);
 });

package/lib/cjs/components/citationpanestateful/CitationPaneStateful.js

@@ -62,7 +62,13 @@ const CitationPaneStateful = props => {
       Event: _TelemetryConstants.TelemetryEvent.UXCitationPaneCompleted,
       ElapsedTimeInMilliseconds: uiTimer.milliSecondsElapsed
     });
-    return cleanup;
+    return () => {
+      // internal tracking: restore parent tab indices on unmount so focus
+      // can escape the widget even if the pane is dismissed by an
+      // external state change rather than a user button click.
+      (0, _utils.setTabIndices)(elements, initialTabIndexMap, true);
+      cleanup();
+    };
   }, []);
 
   // Retry focus once pane is actually visible (isReady) in case initial attempt occurred while wrapper was visibility:hidden

package/lib/cjs/components/confirmationpanestateful/ConfirmationPaneStateful.js

@@ -100,7 +100,17 @@ const ConfirmationPaneStateful = props => {
       Event: _TelemetryConstants.TelemetryEvent.UXConfirmationPaneCompleted,
       ElapsedTimeInMilliseconds: uiTimer.milliSecondsElapsed
     });
-    return cleanup;
+    return () => {
+      // internal tracking: when the confirmation pane unmounts (page reload,
+      // parent state change, or any path that bypasses onConfirm /
+      // onCancel) the tab indices that were forced to -1 on sibling
+      // focusable elements must be restored, otherwise Tab order
+      // remains broken and focus can be trapped inside the widget.
+      // setTabIndices is a no-op when initialTabIndexMap is already
+      // empty (onConfirm / onCancel already restored).
+      (0, _utils.setTabIndices)(elements, initialTabIndexMap, true);
+      cleanup();
+    };
   }, []);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_DimLayer.DimLayer, {
     brightness: (controlProps === null || controlProps === void 0 ? void 0 : controlProps.brightnessValueOnDim) ?? "0.2"

package/lib/cjs/components/emailtranscriptpanestateful/EmailTranscriptPaneStateful.js

@@ -136,7 +136,11 @@ const EmailTranscriptPaneStateful = props => {
       Event: _TelemetryConstants.TelemetryEvent.UXEmailTranscriptPaneCompleted,
       ElapsedTimeInMilliseconds: uiTimer.milliSecondsElapsed
     });
-    return cleanup;
+    return () => {
+      // internal tracking: restore parent tab indices on unmount.
+      (0, _utils.setTabIndices)(elements, initialTabIndexMap, true);
+      cleanup();
+    };
   }, [initialEmail]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_DimLayer.DimLayer, {
     brightness: (controlProps === null || controlProps === void 0 ? void 0 : controlProps.brightnessValueOnDim) ?? "0.2"

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

@@ -232,6 +232,48 @@ const WebChatContainerStateful = props => {
         chatHistoryElement.setAttribute(_Constants.HtmlAttributeNames.ariaLabel, webChatContainerProps.webChatHistoryMobileAccessibilityLabel);
       }
     }
+
+    // internal tracking: WebChats BasicToaster renders a `role="log"` container
+    // with no accessible name. When the toaster is empty (typical idle
+    // state) screen readers traversing the page announce it as "blank".
+    // Inject an aria-label so the region has a meaningful name; the
+    // consumer can override via the new
+    // `webChatNotificationRegionAccessibilityLabel` prop. The toaster
+    // may not be rendered yet when this effect first runs, so observe
+    // for it via a MutationObserver scoped to the widget root (or, if
+    // not yet mounted, the widget container's parent) so we never fire
+    // on host-page mutations outside the widget subtree.
+    const toasterLabel = (webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : webChatContainerProps.webChatNotificationRegionAccessibilityLabel) ?? _defaultWebChatContainerStatefulProps.defaultWebChatContainerStatefulProps.webChatNotificationRegionAccessibilityLabel ?? "Chat notifications";
+    const labelToaster = root => {
+      const toaster = root.querySelector(".webchat__toaster[role='log']");
+      if (toaster && !toaster.getAttribute(_Constants.HtmlAttributeNames.ariaLabel)) {
+        toaster.setAttribute(_Constants.HtmlAttributeNames.ariaLabel, toasterLabel);
+        return true;
+      }
+      return false;
+    };
+    // Prefer the widget root; if it is not yet in the DOM, fall back to
+    // `document` for the *initial* lookup only, then observe the most
+    // specific available scope (widget root if present, otherwise the
+    // widget's parent / document.body as a last resort). The observer
+    // re-resolves the widget root on every callback so we tighten scope
+    // as soon as it mounts.
+    let toasterObserver;
+    const resolveScope = () => document.getElementById("ms_lcw_webchat_root") ?? document.body;
+    if (!labelToaster(resolveScope())) {
+      toasterObserver = new MutationObserver(() => {
+        const scope = resolveScope();
+        if (labelToaster(scope)) {
+          var _toasterObserver;
+          (_toasterObserver = toasterObserver) === null || _toasterObserver === void 0 ? void 0 : _toasterObserver.disconnect();
+          toasterObserver = undefined;
+        }
+      });
+      toasterObserver.observe(resolveScope(), {
+        childList: true,
+        subtree: true
+      });
+    }
     dispatch({
       type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_RENDERING_MIDDLEWARE_PROPS,
       payload: webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : webChatContainerProps.renderingMiddlewareProps
@@ -256,6 +298,10 @@ const WebChatContainerStateful = props => {
         }
       }
     }
+    return () => {
+      var _toasterObserver2;
+      (_toasterObserver2 = toasterObserver) === null || _toasterObserver2 === void 0 ? void 0 : _toasterObserver2.disconnect();
+    };
   }, []);
   (0, _react2.useEffect)(() => {
     var _props$webChatContain6, _props$webChatContain7;
@@ -496,23 +542,7 @@ const WebChatContainerStateful = props => {
       height: "100%",
       width: "100%"
     }
-  }, shouldLoadPersistentHistoryMessages && /*#__PURE__*/_react2.default.createElement(_WebChatEventSubscribers.default, null), /*#__PURE__*/_react2.default.createElement(BasicWebChat, null))), /*#__PURE__*/_react2.default.createElement("div", {
-    id: _Constants.HtmlIdNames.fileSentAnnouncementRegionId,
-    role: "alert",
-    "aria-live": "assertive",
-    "aria-atomic": "true",
-    style: {
-      position: "absolute",
-      width: "1px",
-      height: "1px",
-      padding: "0",
-      margin: "-1px",
-      overflow: "hidden",
-      clip: "rect(0, 0, 0, 0)",
-      whiteSpace: "nowrap",
-      border: "0"
-    }
-  }), citationPaneOpen && /*#__PURE__*/_react2.default.createElement(_CitationPaneStateful.default, {
+  }, shouldLoadPersistentHistoryMessages && /*#__PURE__*/_react2.default.createElement(_WebChatEventSubscribers.default, null), /*#__PURE__*/_react2.default.createElement(BasicWebChat, null))), citationPaneOpen && /*#__PURE__*/_react2.default.createElement(_CitationPaneStateful.default, {
     id: ((_props$citationPanePr = props.citationPaneProps) === null || _props$citationPanePr === void 0 ? void 0 : _props$citationPanePr.id) || _Constants.HtmlAttributeNames.ocwCitationPaneClassName,
     title: ((_props$citationPanePr2 = props.citationPaneProps) === null || _props$citationPanePr2 === void 0 ? void 0 : _props$citationPanePr2.title) || _Constants.HtmlAttributeNames.ocwCitationPaneTitle,
     contentHtml: citationPaneText,

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

@@ -59,6 +59,16 @@ let DesignerChatAdapter = /*#__PURE__*/function (_MockAdapter) {
       if (msg.text) {
         if (msg.suggestedActions) {
           (0, _chatAdapterUtils.postAgentSuggestedActionsActivity)(this.activityObserver, msg.text, msg.suggestedActions, index * 100);
+        } else if (msg.from && msg.from.role) {
+          // Route caller-supplied `from` through the shared
+          // postBotMessageActivity helper so the activity shape
+          // (id, channelData.tags, timestamp, type) matches every
+          // other designer-mode path and downstream middleware
+          // (localizedStringsBotInitialsMiddleware, telemetry,
+          // attachment plumbing) behaves identically. The override
+          // narrows only the fields the caller cares about (e.g.
+          // from.name / from.role) — base botUser fields remain.
+          (0, _chatAdapterUtils.postBotMessageActivity)(this.activityObserver, msg.text, undefined, index * 100, msg.from);
         } else {
           (0, _chatAdapterUtils.postBotMessageActivity)(this.activityObserver, msg.text, undefined, index * 100);
         }

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

@@ -20,6 +20,7 @@ const defaultWebChatContainerStatefulProps = {
   honorsTargetInHTMLLinks: false,
   hyperlinkTextOverride: false,
   directLine: new _mockadapter.default(),
-  adaptiveCardStyles: _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles
+  adaptiveCardStyles: _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles,
+  webChatNotificationRegionAccessibilityLabel: "Chat notifications"
 };
 exports.defaultWebChatContainerStatefulProps = defaultWebChatContainerStatefulProps;

package/lib/cjs/components/webchatcontainerstateful/common/utils/chatAdapterUtils.js

@@ -44,11 +44,13 @@ exports.postEchoActivity = postEchoActivity;
 const postBotMessageActivity = function (activityObserver, text) {
   let tags = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : "";
   let delay = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 1000;
+  let fromOverride = arguments.length > 4 ? arguments[4] : undefined;
   setTimeout(() => {
     activityObserver === null || activityObserver === void 0 ? void 0 : activityObserver.next({
       id: (0, _omnichannelChatSdk.uuidv4)(),
       from: {
-        ...botUser
+        ...botUser,
+        ...(fromOverride ?? {})
       },
       text,
       type: "message",

package/lib/cjs/components/webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/attachments/AdaptiveCardAccessibilityWrapper.js

@@ -32,6 +32,56 @@ const AdaptiveCardAccessibilityWrapper = _ref => {
       const container = containerRef.current;
       if (!container) return;
 
+      // dropdown-double-label: compact Input.ChoiceSet renders as a native
+      // <select> with both aria-labelledby and a sibling visible <label for>.
+      // Only remove aria-labelledby when it points solely at that same visible
+      // label; preserve composite labels that include required/error/context text.
+      const compactSelects = container.querySelectorAll(".ac-input-container select.ac-input.ac-multichoiceInput[aria-labelledby]");
+      compactSelects.forEach(select => {
+        const id = select.id;
+        if (!id) return;
+        const visibleLabel = container.querySelector(`label[for="${CSS.escape(id)}"]:not([aria-hidden='true'])`);
+        const labelledBy = (select.getAttribute("aria-labelledby") || "").trim().split(/\s+/);
+        if (visibleLabel !== null && visibleLabel !== void 0 && visibleLabel.id && labelledBy.length === 1 && labelledBy[0] === visibleLabel.id) {
+          select.removeAttribute("aria-labelledby");
+        }
+      });
+
+      // internal tracking: non-radio inputs (Input.Text including
+      // isMultiline=true which renders as <textarea>, Input.Date,
+      // Input.Number, Input.Toggle, Input.ChoiceSet multi-select
+      // checkbox) rendered by adaptivecards can have THREE accessible-
+      // name sources resolving to the same string: a visible
+      // <label for>, aria-label, AND aria-labelledby. TalkBack walks
+      // each accessibility node independently and reads the duplicated
+      // name. When a visible <label for> exists and names the control,
+      // strip the redundant aria-label / aria-labelledby on the input
+      // so only one announceable source remains.
+      const labelledInputs = container.querySelectorAll(".ac-input-container input.ac-input[id]:not([type='radio']), .ac-input-container textarea.ac-input[id]");
+      labelledInputs.forEach(input => {
+        const id = input.id;
+        if (!id) return;
+        const visibleLabel = container.querySelector(`label[for="${CSS.escape(id)}"]:not([aria-hidden='true'])`);
+        if (!visibleLabel) return;
+        const labelText = (visibleLabel.textContent || "").trim();
+        if (!labelText) return;
+        const ariaLabel = input.getAttribute("aria-label");
+        if (ariaLabel && ariaLabel.trim() === labelText) {
+          input.removeAttribute("aria-label");
+        }
+        const labelledBy = (input.getAttribute("aria-labelledby") || "").trim();
+        if (labelledBy) {
+          const ids = labelledBy.split(/\s+/);
+          const resolved = ids.map(rid => {
+            var _document$getElementB;
+            return (((_document$getElementB = document.getElementById(rid)) === null || _document$getElementB === void 0 ? void 0 : _document$getElementB.textContent) || "").trim();
+          }).filter(Boolean).join(" ");
+          if (resolved === labelText) {
+            input.removeAttribute("aria-labelledby");
+          }
+        }
+      });
+
       // action-button-toggle / login-button-toggle: submit/login action buttons can be
       // rendered with toggle-only ARIA that causes screen readers to announce them as
       // switches instead of plain push buttons. Preserve Action.ToggleVisibility buttons,

package/lib/cjs/components/webchatcontainerstateful/webchatcontroller/middlewares/storemiddlewares/attachmentUploadValidatorMiddleware.js

@@ -18,14 +18,10 @@ var _WebChatActionType = require("../../enums/WebChatActionType");
 
 const MBtoBRatio = 1000000;
 const announceFileSent = message => {
-  // TalkBack on Android WebView reliably announces newly *appended* role="alert"
-  // nodes but often misses text-content updates on existing nodes.
-  // Strategy: clear the static region, wait 500ms for the send-box focus shift
-  // to settle, then inject a fresh alert element and remove it after 3s.
-  const region = document.getElementById(_Constants.HtmlIdNames.fileSentAnnouncementRegionId);
-  if (region) {
-    region.textContent = "";
-  }
+  // TalkBack on Android WebView reliably announces newly *appended*
+  // role="alert" nodes but often misses text-content updates on existing
+  // nodes. Wait 500ms for the send-box focus shift to settle, then inject
+  // a fresh alert element appended to document.body and remove it after 3s.
   setTimeout(() => {
     const el = document.createElement("div");
     el.setAttribute("role", "alert");

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

@@ -48,6 +48,17 @@ const getLiveChatWidgetContextInitialState = props => {
     if (initialStateFromCache.appStates.isUserAuthenticated === undefined) {
       initialStateFromCache.appStates.isUserAuthenticated = false;
     }
+    // internal tracking: transient modal pane visibility must NOT survive a page
+    // reload. If `showConfirmationPane` / `showEmailTranscriptPane` are
+    // restored as `true`, the corresponding pane re-mounts and installs
+    // its focus trap (and sets sibling tabindex=-1). The user has no
+    // context for why the modal appeared and Tab from the host page can
+    // no longer traverse out of the widget. Always start cold for these
+    // ephemeral UI flags.
+    if (initialStateFromCache.uiStates) {
+      initialStateFromCache.uiStates.showConfirmationPane = false;
+      initialStateFromCache.uiStates.showEmailTranscriptPane = false;
+    }
     return initialStateFromCache;
   }
   const LiveChatWidgetContextInitialState = {

package/lib/esm/common/Constants.js

@@ -149,7 +149,6 @@ export let HtmlIdNames = /*#__PURE__*/_createClass(function HtmlIdNames() {
   _classCallCheck(this, HtmlIdNames);
 });
 _defineProperty(HtmlIdNames, "MSLiveChatWidget", "MSLiveChatWidget");
-_defineProperty(HtmlIdNames, "fileSentAnnouncementRegionId", "ms_lcw_file_sent_announcement");
 export let HtmlClassNames = /*#__PURE__*/_createClass(function HtmlClassNames() {
   _classCallCheck(this, HtmlClassNames);
 });

package/lib/esm/components/citationpanestateful/CitationPaneStateful.js

@@ -53,7 +53,13 @@ export const CitationPaneStateful = props => {
       Event: TelemetryEvent.UXCitationPaneCompleted,
       ElapsedTimeInMilliseconds: uiTimer.milliSecondsElapsed
     });
-    return cleanup;
+    return () => {
+      // internal tracking: restore parent tab indices on unmount so focus
+      // can escape the widget even if the pane is dismissed by an
+      // external state change rather than a user button click.
+      setTabIndices(elements, initialTabIndexMap, true);
+      cleanup();
+    };
   }, []);
 
   // Retry focus once pane is actually visible (isReady) in case initial attempt occurred while wrapper was visibility:hidden

package/lib/esm/components/confirmationpanestateful/ConfirmationPaneStateful.js

@@ -91,7 +91,17 @@ export const ConfirmationPaneStateful = props => {
       Event: TelemetryEvent.UXConfirmationPaneCompleted,
       ElapsedTimeInMilliseconds: uiTimer.milliSecondsElapsed
     });
-    return cleanup;
+    return () => {
+      // internal tracking: when the confirmation pane unmounts (page reload,
+      // parent state change, or any path that bypasses onConfirm /
+      // onCancel) the tab indices that were forced to -1 on sibling
+      // focusable elements must be restored, otherwise Tab order
+      // remains broken and focus can be trapped inside the widget.
+      // setTabIndices is a no-op when initialTabIndexMap is already
+      // empty (onConfirm / onCancel already restored).
+      setTabIndices(elements, initialTabIndexMap, true);
+      cleanup();
+    };
   }, []);
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(DimLayer, {
     brightness: (controlProps === null || controlProps === void 0 ? void 0 : controlProps.brightnessValueOnDim) ?? "0.2"

package/lib/esm/components/emailtranscriptpanestateful/EmailTranscriptPaneStateful.js

@@ -127,7 +127,11 @@ export const EmailTranscriptPaneStateful = props => {
       Event: TelemetryEvent.UXEmailTranscriptPaneCompleted,
       ElapsedTimeInMilliseconds: uiTimer.milliSecondsElapsed
     });
-    return cleanup;
+    return () => {
+      // internal tracking: restore parent tab indices on unmount.
+      setTabIndices(elements, initialTabIndexMap, true);
+      cleanup();
+    };
   }, [initialEmail]);
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(DimLayer, {
     brightness: (controlProps === null || controlProps === void 0 ? void 0 : controlProps.brightnessValueOnDim) ?? "0.2"

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

@@ -1,4 +1,4 @@
-import { Constants, HtmlAttributeNames, HtmlClassNames, HtmlIdNames } from "../../common/Constants";
+import { Constants, HtmlAttributeNames, HtmlClassNames } from "../../common/Constants";
 import { Stack } from "@fluentui/react";
 import { LogLevel, TelemetryEvent } from "../../common/telemetry/TelemetryConstants";
 import React, { useEffect, useRef, useState } from "react";
@@ -223,6 +223,48 @@ export const WebChatContainerStateful = props => {
         chatHistoryElement.setAttribute(HtmlAttributeNames.ariaLabel, webChatContainerProps.webChatHistoryMobileAccessibilityLabel);
       }
     }
+
+    // internal tracking: WebChats BasicToaster renders a `role="log"` container
+    // with no accessible name. When the toaster is empty (typical idle
+    // state) screen readers traversing the page announce it as "blank".
+    // Inject an aria-label so the region has a meaningful name; the
+    // consumer can override via the new
+    // `webChatNotificationRegionAccessibilityLabel` prop. The toaster
+    // may not be rendered yet when this effect first runs, so observe
+    // for it via a MutationObserver scoped to the widget root (or, if
+    // not yet mounted, the widget container's parent) so we never fire
+    // on host-page mutations outside the widget subtree.
+    const toasterLabel = (webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : webChatContainerProps.webChatNotificationRegionAccessibilityLabel) ?? defaultWebChatContainerStatefulProps.webChatNotificationRegionAccessibilityLabel ?? "Chat notifications";
+    const labelToaster = root => {
+      const toaster = root.querySelector(".webchat__toaster[role='log']");
+      if (toaster && !toaster.getAttribute(HtmlAttributeNames.ariaLabel)) {
+        toaster.setAttribute(HtmlAttributeNames.ariaLabel, toasterLabel);
+        return true;
+      }
+      return false;
+    };
+    // Prefer the widget root; if it is not yet in the DOM, fall back to
+    // `document` for the *initial* lookup only, then observe the most
+    // specific available scope (widget root if present, otherwise the
+    // widget's parent / document.body as a last resort). The observer
+    // re-resolves the widget root on every callback so we tighten scope
+    // as soon as it mounts.
+    let toasterObserver;
+    const resolveScope = () => document.getElementById("ms_lcw_webchat_root") ?? document.body;
+    if (!labelToaster(resolveScope())) {
+      toasterObserver = new MutationObserver(() => {
+        const scope = resolveScope();
+        if (labelToaster(scope)) {
+          var _toasterObserver;
+          (_toasterObserver = toasterObserver) === null || _toasterObserver === void 0 ? void 0 : _toasterObserver.disconnect();
+          toasterObserver = undefined;
+        }
+      });
+      toasterObserver.observe(resolveScope(), {
+        childList: true,
+        subtree: true
+      });
+    }
     dispatch({
       type: LiveChatWidgetActionType.SET_RENDERING_MIDDLEWARE_PROPS,
       payload: webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : webChatContainerProps.renderingMiddlewareProps
@@ -247,6 +289,10 @@ export const WebChatContainerStateful = props => {
         }
       }
     }
+    return () => {
+      var _toasterObserver2;
+      (_toasterObserver2 = toasterObserver) === null || _toasterObserver2 === void 0 ? void 0 : _toasterObserver2.disconnect();
+    };
   }, []);
   useEffect(() => {
     var _props$webChatContain6, _props$webChatContain7;
@@ -487,23 +533,7 @@ export const WebChatContainerStateful = props => {
       height: "100%",
       width: "100%"
     }
-  }, shouldLoadPersistentHistoryMessages && /*#__PURE__*/React.createElement(WebChatEventSubscribers, null), /*#__PURE__*/React.createElement(BasicWebChat, null))), /*#__PURE__*/React.createElement("div", {
-    id: HtmlIdNames.fileSentAnnouncementRegionId,
-    role: "alert",
-    "aria-live": "assertive",
-    "aria-atomic": "true",
-    style: {
-      position: "absolute",
-      width: "1px",
-      height: "1px",
-      padding: "0",
-      margin: "-1px",
-      overflow: "hidden",
-      clip: "rect(0, 0, 0, 0)",
-      whiteSpace: "nowrap",
-      border: "0"
-    }
-  }), citationPaneOpen && /*#__PURE__*/React.createElement(CitationPaneStateful, {
+  }, shouldLoadPersistentHistoryMessages && /*#__PURE__*/React.createElement(WebChatEventSubscribers, null), /*#__PURE__*/React.createElement(BasicWebChat, null))), citationPaneOpen && /*#__PURE__*/React.createElement(CitationPaneStateful, {
     id: ((_props$citationPanePr = props.citationPaneProps) === null || _props$citationPanePr === void 0 ? void 0 : _props$citationPanePr.id) || HtmlAttributeNames.ocwCitationPaneClassName,
     title: ((_props$citationPanePr2 = props.citationPaneProps) === null || _props$citationPanePr2 === void 0 ? void 0 : _props$citationPanePr2.title) || HtmlAttributeNames.ocwCitationPaneTitle,
     contentHtml: citationPaneText,

package/lib/esm/components/webchatcontainerstateful/common/DesignerChatAdapter.js

@@ -52,6 +52,16 @@ export let DesignerChatAdapter = /*#__PURE__*/function (_MockAdapter) {
       if (msg.text) {
         if (msg.suggestedActions) {
           postAgentSuggestedActionsActivity(this.activityObserver, msg.text, msg.suggestedActions, index * 100);
+        } else if (msg.from && msg.from.role) {
+          // Route caller-supplied `from` through the shared
+          // postBotMessageActivity helper so the activity shape
+          // (id, channelData.tags, timestamp, type) matches every
+          // other designer-mode path and downstream middleware
+          // (localizedStringsBotInitialsMiddleware, telemetry,
+          // attachment plumbing) behaves identically. The override
+          // narrows only the fields the caller cares about (e.g.
+          // from.name / from.role) — base botUser fields remain.
+          postBotMessageActivity(this.activityObserver, msg.text, undefined, index * 100, msg.from);
         } else {
           postBotMessageActivity(this.activityObserver, msg.text, undefined, index * 100);
         }

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

@@ -13,5 +13,6 @@ export const defaultWebChatContainerStatefulProps = {
   honorsTargetInHTMLLinks: false,
   hyperlinkTextOverride: false,
   directLine: new MockAdapter(),
-  adaptiveCardStyles: defaultAdaptiveCardStyles
+  adaptiveCardStyles: defaultAdaptiveCardStyles,
+  webChatNotificationRegionAccessibilityLabel: "Chat notifications"
 };

package/lib/esm/components/webchatcontainerstateful/common/utils/chatAdapterUtils.js

@@ -34,11 +34,13 @@ export const postEchoActivity = function (activityObserver, activity, user) {
 export const postBotMessageActivity = function (activityObserver, text) {
   let tags = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : "";
   let delay = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 1000;
+  let fromOverride = arguments.length > 4 ? arguments[4] : undefined;
   setTimeout(() => {
     activityObserver === null || activityObserver === void 0 ? void 0 : activityObserver.next({
       id: uuidv4(),
       from: {
-        ...botUser
+        ...botUser,
+        ...(fromOverride ?? {})
       },
       text,
       type: "message",

package/lib/esm/components/webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/attachments/AdaptiveCardAccessibilityWrapper.js

@@ -25,6 +25,56 @@ const AdaptiveCardAccessibilityWrapper = _ref => {
       const container = containerRef.current;
       if (!container) return;
 
+      // dropdown-double-label: compact Input.ChoiceSet renders as a native
+      // <select> with both aria-labelledby and a sibling visible <label for>.
+      // Only remove aria-labelledby when it points solely at that same visible
+      // label; preserve composite labels that include required/error/context text.
+      const compactSelects = container.querySelectorAll(".ac-input-container select.ac-input.ac-multichoiceInput[aria-labelledby]");
+      compactSelects.forEach(select => {
+        const id = select.id;
+        if (!id) return;
+        const visibleLabel = container.querySelector(`label[for="${CSS.escape(id)}"]:not([aria-hidden='true'])`);
+        const labelledBy = (select.getAttribute("aria-labelledby") || "").trim().split(/\s+/);
+        if (visibleLabel !== null && visibleLabel !== void 0 && visibleLabel.id && labelledBy.length === 1 && labelledBy[0] === visibleLabel.id) {
+          select.removeAttribute("aria-labelledby");
+        }
+      });
+
+      // internal tracking: non-radio inputs (Input.Text including
+      // isMultiline=true which renders as <textarea>, Input.Date,
+      // Input.Number, Input.Toggle, Input.ChoiceSet multi-select
+      // checkbox) rendered by adaptivecards can have THREE accessible-
+      // name sources resolving to the same string: a visible
+      // <label for>, aria-label, AND aria-labelledby. TalkBack walks
+      // each accessibility node independently and reads the duplicated
+      // name. When a visible <label for> exists and names the control,
+      // strip the redundant aria-label / aria-labelledby on the input
+      // so only one announceable source remains.
+      const labelledInputs = container.querySelectorAll(".ac-input-container input.ac-input[id]:not([type='radio']), .ac-input-container textarea.ac-input[id]");
+      labelledInputs.forEach(input => {
+        const id = input.id;
+        if (!id) return;
+        const visibleLabel = container.querySelector(`label[for="${CSS.escape(id)}"]:not([aria-hidden='true'])`);
+        if (!visibleLabel) return;
+        const labelText = (visibleLabel.textContent || "").trim();
+        if (!labelText) return;
+        const ariaLabel = input.getAttribute("aria-label");
+        if (ariaLabel && ariaLabel.trim() === labelText) {
+          input.removeAttribute("aria-label");
+        }
+        const labelledBy = (input.getAttribute("aria-labelledby") || "").trim();
+        if (labelledBy) {
+          const ids = labelledBy.split(/\s+/);
+          const resolved = ids.map(rid => {
+            var _document$getElementB;
+            return (((_document$getElementB = document.getElementById(rid)) === null || _document$getElementB === void 0 ? void 0 : _document$getElementB.textContent) || "").trim();
+          }).filter(Boolean).join(" ");
+          if (resolved === labelText) {
+            input.removeAttribute("aria-labelledby");
+          }
+        }
+      });
+
       // action-button-toggle / login-button-toggle: submit/login action buttons can be
       // rendered with toggle-only ARIA that causes screen readers to announce them as
       // switches instead of plain push buttons. Preserve Action.ToggleVisibility buttons,

package/lib/esm/components/webchatcontainerstateful/webchatcontroller/middlewares/storemiddlewares/attachmentUploadValidatorMiddleware.js

@@ -5,21 +5,17 @@
  ******/
 
 import { LogLevel, TelemetryEvent } from "../../../../../common/telemetry/TelemetryConstants";
-import { AMSConstants, HtmlIdNames } from "../../../../../common/Constants";
+import { AMSConstants } from "../../../../../common/Constants";
 import { NotificationHandler } from "../../notification/NotificationHandler";
 import { NotificationScenarios } from "../../enums/NotificationScenarios";
 import { TelemetryHelper } from "../../../../../common/telemetry/TelemetryHelper";
 import { WebChatActionType } from "../../enums/WebChatActionType";
 const MBtoBRatio = 1000000;
 const announceFileSent = message => {
-  // TalkBack on Android WebView reliably announces newly *appended* role="alert"
-  // nodes but often misses text-content updates on existing nodes.
-  // Strategy: clear the static region, wait 500ms for the send-box focus shift
-  // to settle, then inject a fresh alert element and remove it after 3s.
-  const region = document.getElementById(HtmlIdNames.fileSentAnnouncementRegionId);
-  if (region) {
-    region.textContent = "";
-  }
+  // TalkBack on Android WebView reliably announces newly *appended*
+  // role="alert" nodes but often misses text-content updates on existing
+  // nodes. Wait 500ms for the send-box focus shift to settle, then inject
+  // a fresh alert element appended to document.body and remove it after 3s.
   setTimeout(() => {
     const el = document.createElement("div");
     el.setAttribute("role", "alert");

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

@@ -42,6 +42,17 @@ export const getLiveChatWidgetContextInitialState = props => {
     if (initialStateFromCache.appStates.isUserAuthenticated === undefined) {
       initialStateFromCache.appStates.isUserAuthenticated = false;
     }
+    // internal tracking: transient modal pane visibility must NOT survive a page
+    // reload. If `showConfirmationPane` / `showEmailTranscriptPane` are
+    // restored as `true`, the corresponding pane re-mounts and installs
+    // its focus trap (and sets sibling tabindex=-1). The user has no
+    // context for why the modal appeared and Tab from the host page can
+    // no longer traverse out of the widget. Always start cold for these
+    // ephemeral UI flags.
+    if (initialStateFromCache.uiStates) {
+      initialStateFromCache.uiStates.showConfirmationPane = false;
+      initialStateFromCache.uiStates.showEmailTranscriptPane = false;
+    }
     return initialStateFromCache;
   }
   const LiveChatWidgetContextInitialState = {

package/lib/types/common/Constants.d.ts

@@ -119,7 +119,6 @@ export declare const Regex: {
 };
 export declare class HtmlIdNames {
     static readonly MSLiveChatWidget = "MSLiveChatWidget";
-    static readonly fileSentAnnouncementRegionId = "ms_lcw_file_sent_announcement";
 }
 export declare class HtmlClassNames {
     static readonly webChatBannerCloseButton = "webchat__toast__dismissButton";

package/lib/types/components/webchatcontainerstateful/common/utils/chatAdapterUtils.d.ts

@@ -4,7 +4,7 @@ export declare const customerUser: User;
 export declare const botUser: User;
 export declare const agentUser: User;
 export declare const postEchoActivity: (activityObserver: Subscriber<Activity> | undefined, activity: Message, user: User, delay?: number) => void;
-export declare const postBotMessageActivity: (activityObserver: Subscriber<Activity> | undefined, text: string, tags?: string, delay?: number) => void;
+export declare const postBotMessageActivity: (activityObserver: Subscriber<Activity> | undefined, text: string, tags?: string, delay?: number, fromOverride?: Partial<User>) => void;
 export declare const postAgentMessageActivity: (activityObserver: Subscriber<Activity> | undefined, text: string, tags?: string, delay?: number) => void;
 export declare const postSystemMessageActivity: (activityObserver: Subscriber<Activity> | undefined, text: string, delay?: number) => void;
 export declare const postBotTypingActivity: (activityObserver: Subscriber<Activity> | undefined, delay?: number) => void;

package/lib/types/components/webchatcontainerstateful/interfaces/IWebChatContainerStatefulProps.d.ts

@@ -25,4 +25,11 @@ export interface IWebChatContainerStatefulProps {
     adaptiveCardStyles?: IAdaptiveCardStyles;
     sendBoxTextBox?: ISendBox;
     webChatHistoryMobileAccessibilityLabel?: string;
+    /**
+     * Accessible name applied to WebChats notification toaster region
+     * (`role="log"`). When omitted, defaults to "Chat notifications" so
+     * screen readers don't announce the empty live region as "blank"
+     * (internal tracking).
+     */
+    webChatNotificationRegionAccessibilityLabel?: string;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@microsoft/omnichannel-chat-widget",
-  "version": "1.8.4-main.1dd5564",
+  "version": "1.8.4-main.1f36474",
   "description": "Microsoft Omnichannel Chat Widget",
   "main": "lib/cjs/index.js",
   "types": "lib/types/index.d.ts",
@@ -84,7 +84,7 @@
     "react-test-renderer": "^18.3.1",
     "rimraf": "^6.0.1",
     "storybook-addon-playwright": "^4.9.2",
-    "swiper": "^9.0.5",
+    "swiper": "^12.1.2",
     "terser-webpack-plugin": "^4.2.3",
     "thread-loader": "^2.1.3",
     "ts-loader": "^9.2.6",
@@ -95,7 +95,7 @@
   "dependencies": {
     "@azure/core-tracing": "^1.2.0",
     "@microsoft/applicationinsights-web": "^3.3.6",
-    "@microsoft/omnichannel-chat-components": "1.1.17-main.d4c4cb2",
+    "@microsoft/omnichannel-chat-components": "1.1.17-main.f21df63",
     "@microsoft/omnichannel-chat-sdk": "1.11.9-main.da8219b",
     "@opentelemetry/api": "^1.9.0",
     "abort-controller": "^3",
@@ -172,7 +172,7 @@
     "**/lodash": "4.17.23",
     "**/@babel/runtime-corejs3": "^7.29.0",
     "**/brace-expansion": "2.0.3",
-    "**/swiper": "9.4.1"
+    "**/swiper": "12.1.2"
   },
   "jest": {
     "verbose": true,