@microsoft/omnichannel-chat-widget 1.8.4-main.f6a1732 → 1.8.4-main.fba10aa

package/lib/cjs/components/postchatloadingpanestateful/PostChatLoadingPaneStateful.js

@@ -16,13 +16,22 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 let uiTimer;
 const PostChatLoadingPaneStateful = props => {
-  var _props$styleProps;
+  var _props$controlProps, _props$styleProps;
+  const defaultSubtitleText = "Please take a moment to give us feedback about your chat experience. We are loading the survey for you now.";
+  const subtitleText = ((_props$controlProps = props.controlProps) === null || _props$controlProps === void 0 ? void 0 : _props$controlProps.subtitleText) ?? defaultSubtitleText;
+  const [announcedSubtitleText, setAnnouncedSubtitleText] = (0, _react.useState)("");
   (0, _react.useEffect)(() => {
     uiTimer = (0, _utils.createTimer)();
     _TelemetryHelper.TelemetryHelper.logLoadingEvent(_TelemetryConstants.LogLevel.INFO, {
       Event: _TelemetryConstants.TelemetryEvent.UXPostChatLoadingPaneStart
     });
   }, []);
+  (0, _react.useEffect)(() => {
+    const timeout = window.setTimeout(() => {
+      setAnnouncedSubtitleText(subtitleText);
+    }, 0);
+    return () => window.clearTimeout(timeout);
+  }, [subtitleText]);
   const [state] = (0, _useChatContextStore.default)();
   const generalStyleProps = Object.assign({}, _defaultgeneralPostChatLoadingPaneStyleProps.defaultGeneralPostChatLoadingPaneStyleProps, (_props$styleProps = props.styleProps) === null || _props$styleProps === void 0 ? void 0 : _props$styleProps.generalStyleProps);
   const styleProps = {
@@ -36,8 +45,11 @@ const PostChatLoadingPaneStateful = props => {
     hideTitle: true,
     hideSpinner: true,
     hideSpinnerText: true,
-    subtitleText: "Please take a moment to give us feedback about your chat experience. We are loading the survey for you now.",
-    ...props.controlProps
+    ...props.controlProps,
+    role: "status",
+    "aria-live": "polite",
+    "aria-atomic": "true",
+    subtitleText: announcedSubtitleText
   };
 
   // Move focus to the first button

package/lib/cjs/components/postchatsurveypanestateful/PostChatSurveyPaneStateful.js

@@ -67,6 +67,7 @@ const PostChatSurveyPaneStateful = props => {
   };
   const controlProps = {
     id: "oc-lcw-postchatsurvey-pane",
+    title: "Post-chat survey",
     surveyURL: ((_props$controlProps = props.controlProps) === null || _props$controlProps === void 0 ? void 0 : _props$controlProps.surveyURL) ?? surveyInviteLink,
     ...props.controlProps
   };

package/lib/cjs/components/prechatsurveypanestateful/PreChatSurveyPaneStateful.js

@@ -20,6 +20,34 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 let uiTimer;
+const getFocusedElementAnnouncement = element => {
+  var _element$textContent;
+  const ariaLabel = element.getAttribute(_Constants.HtmlAttributeNames.ariaLabel);
+  if (ariaLabel) {
+    return ariaLabel.trim();
+  }
+  const ariaLabelledBy = element.getAttribute(_Constants.HtmlAttributeNames.ariaLabelledby);
+  if (ariaLabelledBy) {
+    const labelledByText = ariaLabelledBy.split(/\s+/).map(id => {
+      var _document$getElementB, _document$getElementB2;
+      return (_document$getElementB = document.getElementById(id)) === null || _document$getElementB === void 0 ? void 0 : (_document$getElementB2 = _document$getElementB.textContent) === null || _document$getElementB2 === void 0 ? void 0 : _document$getElementB2.trim();
+    }).filter(Boolean).join(" ");
+    if (labelledByText) {
+      return labelledByText;
+    }
+  }
+  if (element.id) {
+    const label = Array.from(document.querySelectorAll("label")).find(candidate => candidate.htmlFor === element.id || candidate.getAttribute("for") === element.id);
+    if (label !== null && label !== void 0 && label.textContent) {
+      return label.textContent.trim();
+    }
+  }
+  const parentLabel = element.closest("label");
+  if (parentLabel !== null && parentLabel !== void 0 && parentLabel.textContent) {
+    return parentLabel.textContent.trim();
+  }
+  return ((_element$textContent = element.textContent) === null || _element$textContent === void 0 ? void 0 : _element$textContent.trim()) ?? "";
+};
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 const PreChatSurveyPaneStateful = props => {
@@ -42,6 +70,8 @@ const PreChatSurveyPaneStateful = props => {
     surveyProps,
     initStartChat
   } = props;
+  const [preChatFocusAnnouncement, setPreChatFocusAnnouncement] = (0, _react.useState)("");
+  const liveRegionUpdateTimeout = (0, _react.useRef)();
   const generalStyleProps = Object.assign({}, _defaultGeneralPreChatSurveyPaneStyleProps.defaultGeneralPreChatSurveyPaneStyleProps, surveyProps === null || surveyProps === void 0 ? void 0 : (_surveyProps$stylePro = surveyProps.styleProps) === null || _surveyProps$stylePro === void 0 ? void 0 : _surveyProps$stylePro.generalStyleProps, {
     display: state.appStates.isMinimized ? "none" : ""
   });
@@ -128,6 +158,16 @@ const PreChatSurveyPaneStateful = props => {
     ...(surveyProps === null || surveyProps === void 0 ? void 0 : surveyProps.styleProps),
     generalStyleProps: generalStyleProps
   };
+  const announceFocusedElement = event => {
+    if (liveRegionUpdateTimeout.current) {
+      window.clearTimeout(liveRegionUpdateTimeout.current);
+    }
+    const announcement = getFocusedElementAnnouncement(event.target);
+    setPreChatFocusAnnouncement("");
+    liveRegionUpdateTimeout.current = window.setTimeout(() => {
+      setPreChatFocusAnnouncement(announcement);
+    }, 0);
+  };
   (0, _react.useEffect)(() => {
     // Set Aria-Label Attribute for Inputs
     const adaptiveCardElements = document.getElementsByClassName(_Constants.HtmlAttributeNames.adaptiveCardClassName);
@@ -175,10 +215,32 @@ const PreChatSurveyPaneStateful = props => {
       }
     }
   }, [state.appStates.isMinimized]);
-  return /*#__PURE__*/_react.default.createElement(_omnichannelChatComponents.PreChatSurveyPane, {
+  (0, _react.useEffect)(() => () => {
+    if (liveRegionUpdateTimeout.current) {
+      window.clearTimeout(liveRegionUpdateTimeout.current);
+    }
+  }, []);
+  return /*#__PURE__*/_react.default.createElement("div", {
+    onFocusCapture: announceFocusedElement
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    role: "status",
+    "aria-live": "polite",
+    "aria-atomic": "true",
+    style: {
+      position: "absolute",
+      width: "1px",
+      height: "1px",
+      margin: "-1px",
+      padding: 0,
+      border: 0,
+      clip: "rect(0, 0, 0, 0)",
+      overflow: "hidden",
+      whiteSpace: "nowrap"
+    }
+  }, preChatFocusAnnouncement), /*#__PURE__*/_react.default.createElement(_omnichannelChatComponents.PreChatSurveyPane, {
     controlProps: controlProps,
     styleProps: styleProps
-  });
+  }));
 };
 exports.PreChatSurveyPaneStateful = PreChatSurveyPaneStateful;
 var _default = PreChatSurveyPaneStateful;

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

@@ -32,6 +32,21 @@ 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");
+        }
+      });
+
       // 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/localizedStringsBotInitialsMiddleware.js

@@ -16,6 +16,32 @@ let currentAgentName = _defaultWebChatStyles.defaultWebChatStyles.botAvatarIniti
 
 // Optional external updater (React context dispatch wrapper) set at runtime
 let externalInitialsUpdater;
+const hasTransferTag = activity => {
+  var _activity$channelData;
+  const tags = [...(Array.isArray(activity === null || activity === void 0 ? void 0 : (_activity$channelData = activity.channelData) === null || _activity$channelData === void 0 ? void 0 : _activity$channelData.tags) ? activity.channelData.tags : []), ...(Array.isArray(activity === null || activity === void 0 ? void 0 : activity.tags) ? activity.tags : [])];
+  return tags.some(tag => typeof tag === "string" && tag.toLowerCase().includes("transfer"));
+};
+const isTransferSystemMessage = activity => {
+  const text = ((activity === null || activity === void 0 ? void 0 : activity.text) || "").toString();
+  return hasTransferTag(activity) || /\btransfer(?:red|ring)?\b/i.test(text);
+};
+const resetCachedAgentName = dispatch => {
+  if (currentAgentName !== _defaultWebChatStyles.defaultWebChatStyles.botAvatarInitials || currentAgentInitials !== _defaultWebChatStyles.defaultWebChatStyles.botAvatarInitials) {
+    var _externalInitialsUpda;
+    currentAgentName = _defaultWebChatStyles.defaultWebChatStyles.botAvatarInitials;
+    currentAgentInitials = _defaultWebChatStyles.defaultWebChatStyles.botAvatarInitials;
+    (_externalInitialsUpda = externalInitialsUpdater) === null || _externalInitialsUpda === void 0 ? void 0 : _externalInitialsUpda(currentAgentInitials || "");
+    _omnichannelChatComponents.BroadcastService.postMessage({
+      eventName: "BotAvatarInitialsUpdated",
+      payload: {
+        initials: currentAgentInitials
+      }
+    });
+    dispatch({
+      type: "__BOT_INITIALS_UPDATED__"
+    });
+  }
+};
 const localizedStringsBotInitialsMiddleware = onInitialsChange => _ref => {
   let {
     dispatch
@@ -29,19 +55,31 @@ const localizedStringsBotInitialsMiddleware = onInitialsChange => _ref => {
       var _action$payload, _activity$from;
       const activity = (_action$payload = action.payload) === null || _action$payload === void 0 ? void 0 : _action$payload.activity;
       if (activity !== null && activity !== void 0 && (_activity$from = activity.from) !== null && _activity$from !== void 0 && _activity$from.name && activity.from.role !== _Constants.Constants.userMessageTag && activity.from.name !== _Constants.Constants.userMessageTag) {
-        var _activity$channelData, _activity$channelData2, _activity$tags;
+        var _activity$channelData2, _activity$channelData3, _activity$tags;
         const agentName = activity.from.name.trim();
-        const isSystemMessage = agentName === "__agent__" || agentName.startsWith("__") || ((_activity$channelData = activity.channelData) === null || _activity$channelData === void 0 ? void 0 : (_activity$channelData2 = _activity$channelData.tags) === null || _activity$channelData2 === void 0 ? void 0 : _activity$channelData2.includes(_Constants.Constants.systemMessageTag)) || ((_activity$tags = activity.tags) === null || _activity$tags === void 0 ? void 0 : _activity$tags.includes(_Constants.Constants.systemMessageTag));
-        if (!isSystemMessage && agentName) {
+        const isSystemMessage = agentName === "__agent__" || agentName.startsWith("__") || ((_activity$channelData2 = activity.channelData) === null || _activity$channelData2 === void 0 ? void 0 : (_activity$channelData3 = _activity$channelData2.tags) === null || _activity$channelData3 === void 0 ? void 0 : _activity$channelData3.includes(_Constants.Constants.systemMessageTag)) || ((_activity$tags = activity.tags) === null || _activity$tags === void 0 ? void 0 : _activity$tags.includes(_Constants.Constants.systemMessageTag));
+        if (isSystemMessage) {
+          // transfer-stale-bot-name: when a transfer system message indicates the
+          // conversation has been routed to a different agent, the
+          // previously-cached agent name must NOT linger. Otherwise the
+          // next non-system activity (e.g. typing indicator, welcome
+          // message, or the new agent's first turn before their name
+          // is observed) is announced to screen readers as the OLD
+          // agent. Reset to defaults so the next observed name takes
+          // effect cleanly.
+          if (isTransferSystemMessage(activity)) {
+            resetCachedAgentName(dispatch);
+          }
+        } else if (agentName) {
           const newInitials = (0, _utils.getIconText)(agentName) || currentAgentInitials;
           const hasInitialsChanged = newInitials !== currentAgentInitials;
           const hasNameChanged = agentName !== currentAgentName;
           currentAgentName = agentName;
           if (hasInitialsChanged) {
-            var _externalInitialsUpda;
+            var _externalInitialsUpda2;
             currentAgentInitials = newInitials;
             // Notify external React context if provided
-            (_externalInitialsUpda = externalInitialsUpdater) === null || _externalInitialsUpda === void 0 ? void 0 : _externalInitialsUpda(currentAgentInitials || "");
+            (_externalInitialsUpda2 = externalInitialsUpdater) === null || _externalInitialsUpda2 === void 0 ? void 0 : _externalInitialsUpda2(currentAgentInitials || "");
             // Broadcast (optional) for multi-tab sync without forcing consumers
             _omnichannelChatComponents.BroadcastService.postMessage({
               eventName: "BotAvatarInitialsUpdated",

package/lib/esm/components/postchatloadingpanestateful/PostChatLoadingPaneStateful.js

@@ -1,5 +1,5 @@
 import { LogLevel, TelemetryEvent } from "../../common/telemetry/TelemetryConstants";
-import React, { useEffect } from "react";
+import React, { useEffect, useState } from "react";
 import { createTimer, findAllFocusableElement } from "../../common/utils";
 import { LoadingPane } from "@microsoft/omnichannel-chat-components";
 import { TelemetryHelper } from "../../common/telemetry/TelemetryHelper";
@@ -7,13 +7,22 @@ import { defaultGeneralPostChatLoadingPaneStyleProps } from "./common/defaultgen
 import useChatContextStore from "../../hooks/useChatContextStore";
 let uiTimer;
 export const PostChatLoadingPaneStateful = props => {
-  var _props$styleProps;
+  var _props$controlProps, _props$styleProps;
+  const defaultSubtitleText = "Please take a moment to give us feedback about your chat experience. We are loading the survey for you now.";
+  const subtitleText = ((_props$controlProps = props.controlProps) === null || _props$controlProps === void 0 ? void 0 : _props$controlProps.subtitleText) ?? defaultSubtitleText;
+  const [announcedSubtitleText, setAnnouncedSubtitleText] = useState("");
   useEffect(() => {
     uiTimer = createTimer();
     TelemetryHelper.logLoadingEvent(LogLevel.INFO, {
       Event: TelemetryEvent.UXPostChatLoadingPaneStart
     });
   }, []);
+  useEffect(() => {
+    const timeout = window.setTimeout(() => {
+      setAnnouncedSubtitleText(subtitleText);
+    }, 0);
+    return () => window.clearTimeout(timeout);
+  }, [subtitleText]);
   const [state] = useChatContextStore();
   const generalStyleProps = Object.assign({}, defaultGeneralPostChatLoadingPaneStyleProps, (_props$styleProps = props.styleProps) === null || _props$styleProps === void 0 ? void 0 : _props$styleProps.generalStyleProps);
   const styleProps = {
@@ -27,8 +36,11 @@ export const PostChatLoadingPaneStateful = props => {
     hideTitle: true,
     hideSpinner: true,
     hideSpinnerText: true,
-    subtitleText: "Please take a moment to give us feedback about your chat experience. We are loading the survey for you now.",
-    ...props.controlProps
+    ...props.controlProps,
+    role: "status",
+    "aria-live": "polite",
+    "aria-atomic": "true",
+    subtitleText: announcedSubtitleText
   };
 
   // Move focus to the first button

package/lib/esm/components/postchatsurveypanestateful/PostChatSurveyPaneStateful.js

@@ -58,6 +58,7 @@ export const PostChatSurveyPaneStateful = props => {
   };
   const controlProps = {
     id: "oc-lcw-postchatsurvey-pane",
+    title: "Post-chat survey",
     surveyURL: ((_props$controlProps = props.controlProps) === null || _props$controlProps === void 0 ? void 0 : _props$controlProps.surveyURL) ?? surveyInviteLink,
     ...props.controlProps
   };

package/lib/esm/components/prechatsurveypanestateful/PreChatSurveyPaneStateful.js

@@ -1,6 +1,6 @@
 import { HtmlAttributeNames, Regex } from "../../common/Constants";
 import { ConversationStage, LogLevel, TelemetryEvent } from "../../common/telemetry/TelemetryConstants";
-import React, { useEffect } from "react";
+import React, { useEffect, useRef, useState } from "react";
 import { createTimer, extractPreChatSurveyResponseValues, findAllFocusableElement, getStateFromCache, getWidgetCacheId, isUndefinedOrEmpty, parseAdaptiveCardPayload } from "../../common/utils";
 import { ConversationState } from "../../contexts/common/ConversationState";
 import { LiveChatWidgetActionType } from "../../contexts/common/LiveChatWidgetActionType";
@@ -11,6 +11,34 @@ import { defaultGeneralPreChatSurveyPaneStyleProps } from "./common/defaultStyle
 import { defaultPreChatSurveyLocalizedTexts } from "./common/defaultProps/defaultPreChatSurveyLocalizedTexts";
 import useChatContextStore from "../../hooks/useChatContextStore";
 let uiTimer;
+const getFocusedElementAnnouncement = element => {
+  var _element$textContent;
+  const ariaLabel = element.getAttribute(HtmlAttributeNames.ariaLabel);
+  if (ariaLabel) {
+    return ariaLabel.trim();
+  }
+  const ariaLabelledBy = element.getAttribute(HtmlAttributeNames.ariaLabelledby);
+  if (ariaLabelledBy) {
+    const labelledByText = ariaLabelledBy.split(/\s+/).map(id => {
+      var _document$getElementB, _document$getElementB2;
+      return (_document$getElementB = document.getElementById(id)) === null || _document$getElementB === void 0 ? void 0 : (_document$getElementB2 = _document$getElementB.textContent) === null || _document$getElementB2 === void 0 ? void 0 : _document$getElementB2.trim();
+    }).filter(Boolean).join(" ");
+    if (labelledByText) {
+      return labelledByText;
+    }
+  }
+  if (element.id) {
+    const label = Array.from(document.querySelectorAll("label")).find(candidate => candidate.htmlFor === element.id || candidate.getAttribute("for") === element.id);
+    if (label !== null && label !== void 0 && label.textContent) {
+      return label.textContent.trim();
+    }
+  }
+  const parentLabel = element.closest("label");
+  if (parentLabel !== null && parentLabel !== void 0 && parentLabel.textContent) {
+    return parentLabel.textContent.trim();
+  }
+  return ((_element$textContent = element.textContent) === null || _element$textContent === void 0 ? void 0 : _element$textContent.trim()) ?? "";
+};
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 export const PreChatSurveyPaneStateful = props => {
@@ -33,6 +61,8 @@ export const PreChatSurveyPaneStateful = props => {
     surveyProps,
     initStartChat
   } = props;
+  const [preChatFocusAnnouncement, setPreChatFocusAnnouncement] = useState("");
+  const liveRegionUpdateTimeout = useRef();
   const generalStyleProps = Object.assign({}, defaultGeneralPreChatSurveyPaneStyleProps, surveyProps === null || surveyProps === void 0 ? void 0 : (_surveyProps$stylePro = surveyProps.styleProps) === null || _surveyProps$stylePro === void 0 ? void 0 : _surveyProps$stylePro.generalStyleProps, {
     display: state.appStates.isMinimized ? "none" : ""
   });
@@ -119,6 +149,16 @@ export const PreChatSurveyPaneStateful = props => {
     ...(surveyProps === null || surveyProps === void 0 ? void 0 : surveyProps.styleProps),
     generalStyleProps: generalStyleProps
   };
+  const announceFocusedElement = event => {
+    if (liveRegionUpdateTimeout.current) {
+      window.clearTimeout(liveRegionUpdateTimeout.current);
+    }
+    const announcement = getFocusedElementAnnouncement(event.target);
+    setPreChatFocusAnnouncement("");
+    liveRegionUpdateTimeout.current = window.setTimeout(() => {
+      setPreChatFocusAnnouncement(announcement);
+    }, 0);
+  };
   useEffect(() => {
     // Set Aria-Label Attribute for Inputs
     const adaptiveCardElements = document.getElementsByClassName(HtmlAttributeNames.adaptiveCardClassName);
@@ -166,9 +206,31 @@ export const PreChatSurveyPaneStateful = props => {
       }
     }
   }, [state.appStates.isMinimized]);
-  return /*#__PURE__*/React.createElement(PreChatSurveyPane, {
+  useEffect(() => () => {
+    if (liveRegionUpdateTimeout.current) {
+      window.clearTimeout(liveRegionUpdateTimeout.current);
+    }
+  }, []);
+  return /*#__PURE__*/React.createElement("div", {
+    onFocusCapture: announceFocusedElement
+  }, /*#__PURE__*/React.createElement("div", {
+    role: "status",
+    "aria-live": "polite",
+    "aria-atomic": "true",
+    style: {
+      position: "absolute",
+      width: "1px",
+      height: "1px",
+      margin: "-1px",
+      padding: 0,
+      border: 0,
+      clip: "rect(0, 0, 0, 0)",
+      overflow: "hidden",
+      whiteSpace: "nowrap"
+    }
+  }, preChatFocusAnnouncement), /*#__PURE__*/React.createElement(PreChatSurveyPane, {
     controlProps: controlProps,
     styleProps: styleProps
-  });
+  }));
 };
 export default PreChatSurveyPaneStateful;

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

@@ -25,6 +25,21 @@ 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");
+        }
+      });
+
       // 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/localizedStringsBotInitialsMiddleware.js

@@ -10,6 +10,32 @@ let currentAgentName = defaultWebChatStyles.botAvatarInitials;
 
 // Optional external updater (React context dispatch wrapper) set at runtime
 let externalInitialsUpdater;
+const hasTransferTag = activity => {
+  var _activity$channelData;
+  const tags = [...(Array.isArray(activity === null || activity === void 0 ? void 0 : (_activity$channelData = activity.channelData) === null || _activity$channelData === void 0 ? void 0 : _activity$channelData.tags) ? activity.channelData.tags : []), ...(Array.isArray(activity === null || activity === void 0 ? void 0 : activity.tags) ? activity.tags : [])];
+  return tags.some(tag => typeof tag === "string" && tag.toLowerCase().includes("transfer"));
+};
+const isTransferSystemMessage = activity => {
+  const text = ((activity === null || activity === void 0 ? void 0 : activity.text) || "").toString();
+  return hasTransferTag(activity) || /\btransfer(?:red|ring)?\b/i.test(text);
+};
+const resetCachedAgentName = dispatch => {
+  if (currentAgentName !== defaultWebChatStyles.botAvatarInitials || currentAgentInitials !== defaultWebChatStyles.botAvatarInitials) {
+    var _externalInitialsUpda;
+    currentAgentName = defaultWebChatStyles.botAvatarInitials;
+    currentAgentInitials = defaultWebChatStyles.botAvatarInitials;
+    (_externalInitialsUpda = externalInitialsUpdater) === null || _externalInitialsUpda === void 0 ? void 0 : _externalInitialsUpda(currentAgentInitials || "");
+    BroadcastService.postMessage({
+      eventName: "BotAvatarInitialsUpdated",
+      payload: {
+        initials: currentAgentInitials
+      }
+    });
+    dispatch({
+      type: "__BOT_INITIALS_UPDATED__"
+    });
+  }
+};
 export const localizedStringsBotInitialsMiddleware = onInitialsChange => _ref => {
   let {
     dispatch
@@ -23,19 +49,31 @@ export const localizedStringsBotInitialsMiddleware = onInitialsChange => _ref =>
       var _action$payload, _activity$from;
       const activity = (_action$payload = action.payload) === null || _action$payload === void 0 ? void 0 : _action$payload.activity;
       if (activity !== null && activity !== void 0 && (_activity$from = activity.from) !== null && _activity$from !== void 0 && _activity$from.name && activity.from.role !== Constants.userMessageTag && activity.from.name !== Constants.userMessageTag) {
-        var _activity$channelData, _activity$channelData2, _activity$tags;
+        var _activity$channelData2, _activity$channelData3, _activity$tags;
         const agentName = activity.from.name.trim();
-        const isSystemMessage = agentName === "__agent__" || agentName.startsWith("__") || ((_activity$channelData = activity.channelData) === null || _activity$channelData === void 0 ? void 0 : (_activity$channelData2 = _activity$channelData.tags) === null || _activity$channelData2 === void 0 ? void 0 : _activity$channelData2.includes(Constants.systemMessageTag)) || ((_activity$tags = activity.tags) === null || _activity$tags === void 0 ? void 0 : _activity$tags.includes(Constants.systemMessageTag));
-        if (!isSystemMessage && agentName) {
+        const isSystemMessage = agentName === "__agent__" || agentName.startsWith("__") || ((_activity$channelData2 = activity.channelData) === null || _activity$channelData2 === void 0 ? void 0 : (_activity$channelData3 = _activity$channelData2.tags) === null || _activity$channelData3 === void 0 ? void 0 : _activity$channelData3.includes(Constants.systemMessageTag)) || ((_activity$tags = activity.tags) === null || _activity$tags === void 0 ? void 0 : _activity$tags.includes(Constants.systemMessageTag));
+        if (isSystemMessage) {
+          // transfer-stale-bot-name: when a transfer system message indicates the
+          // conversation has been routed to a different agent, the
+          // previously-cached agent name must NOT linger. Otherwise the
+          // next non-system activity (e.g. typing indicator, welcome
+          // message, or the new agent's first turn before their name
+          // is observed) is announced to screen readers as the OLD
+          // agent. Reset to defaults so the next observed name takes
+          // effect cleanly.
+          if (isTransferSystemMessage(activity)) {
+            resetCachedAgentName(dispatch);
+          }
+        } else if (agentName) {
           const newInitials = getIconText(agentName) || currentAgentInitials;
           const hasInitialsChanged = newInitials !== currentAgentInitials;
           const hasNameChanged = agentName !== currentAgentName;
           currentAgentName = agentName;
           if (hasInitialsChanged) {
-            var _externalInitialsUpda;
+            var _externalInitialsUpda2;
             currentAgentInitials = newInitials;
             // Notify external React context if provided
-            (_externalInitialsUpda = externalInitialsUpdater) === null || _externalInitialsUpda === void 0 ? void 0 : _externalInitialsUpda(currentAgentInitials || "");
+            (_externalInitialsUpda2 = externalInitialsUpdater) === null || _externalInitialsUpda2 === void 0 ? void 0 : _externalInitialsUpda2(currentAgentInitials || "");
             // Broadcast (optional) for multi-tab sync without forcing consumers
             BroadcastService.postMessage({
               eventName: "BotAvatarInitialsUpdated",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@microsoft/omnichannel-chat-widget",
-  "version": "1.8.4-main.f6a1732",
+  "version": "1.8.4-main.fba10aa",
   "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,