@microsoft/omnichannel-chat-widget 1.8.7 → 2.0.0-main.5ebd4eb

package/lib/esm/components/webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/timestamps/HistoryMessageTimestamp.js

@@ -1,3 +1,9 @@
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
 import React from "react";
 import { Stack } from "@fluentui/react";
 import { defaultMiddlewareLocalizedTexts } from "../../../../common/defaultProps/defaultMiddlewareLocalizedTexts";
@@ -8,20 +14,16 @@ import useChatContextStore from "../../../../../../hooks/useChatContextStore";
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 export const HistoryMessageTimestamp = _ref => {
   var _state$domainStates$r, _state$domainStates$r2, _state$domainStates$m;
-  let {
-    args
-  } = _ref;
-  const [state] = useChatContextStore();
+  let args = _ref.args;
+  const _useChatContextStore = useChatContextStore(),
+    _useChatContextStore2 = _slicedToArray(_useChatContextStore, 1),
+    state = _useChatContextStore2[0];
   const dir = ((_state$domainStates$r = state.domainStates.renderingMiddlewareProps) === null || _state$domainStates$r === void 0 ? void 0 : _state$domainStates$r.timestampDir) ?? state.domainStates.globalDir;
-  const {
-    activity: {
-      timestamp,
-      from: {
-        name,
-        role
-      }
-    }
-  } = args;
+  const _args$activity = args.activity,
+    timestamp = _args$activity.timestamp,
+    _args$activity$from = _args$activity.from,
+    name = _args$activity$from.name,
+    role = _args$activity$from.role;
   const contentStyles = {
     ...defaultTimestampContentStyles,
     ...((_state$domainStates$r2 = state.domainStates.renderingMiddlewareProps) === null || _state$domainStates$r2 === void 0 ? void 0 : _state$domainStates$r2.timestampContentStyleProps)

package/lib/esm/components/webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/timestamps/NotDeliveredTimestamp.js

@@ -1,7 +1,12 @@
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
 /* eslint-disable @typescript-eslint/no-explicit-any */
 
 import React, { useCallback, useEffect, useRef } from "react";
-import { KeyCodes } from "../../../../../../common/KeyCodes";
 import { Stack } from "@fluentui/react";
 import { defaultMiddlewareLocalizedTexts } from "../../../../common/defaultProps/defaultMiddlewareLocalizedTexts";
 import { defaultTimestampContentStyles } from "../defaultStyles/defaultTimestampContentStyles";
@@ -14,23 +19,17 @@ import useChatContextStore from "../../../../../../hooks/useChatContextStore";
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 export const NotDeliveredTimestamp = _ref => {
   var _state$domainStates$r, _state$domainStates$r2, _state$domainStates$r3, _state$domainStates$r4, _state$domainStates$m, _state$domainStates$m2;
-  let {
-    args
-  } = _ref;
+  let args = _ref.args;
   const timestampRef = useRef();
-  const {
-    useFocus,
-    usePostActivity
-  } = hooks;
+  const useFocus = hooks.useFocus,
+    usePostActivity = hooks.usePostActivity;
   const focus = useFocus();
   const postActivity = usePostActivity();
-  const {
-    activity
-  } = args;
-  const {
-    timestamp
-  } = activity;
-  const [state] = useChatContextStore();
+  const activity = args.activity;
+  const timestamp = activity.timestamp;
+  const _useChatContextStore = useChatContextStore(),
+    _useChatContextStore2 = _slicedToArray(_useChatContextStore, 1),
+    state = _useChatContextStore2[0];
   const dir = ((_state$domainStates$r = state.domainStates.renderingMiddlewareProps) === null || _state$domainStates$r === void 0 ? void 0 : _state$domainStates$r.timestampDir) ?? state.domainStates.globalDir;
   const contentStyles = {
     ...defaultTimestampContentStyles,
@@ -57,23 +56,14 @@ export const NotDeliveredTimestamp = _ref => {
     await postActivity(activity);
     focus("sendBox");
   }, [activity, focus, postActivity]);
-  const onRetryKeyEnter = event => {
-    if (event.code === KeyCodes.ENTER) {
-      event.preventDefault();
-      onRetryClick();
-    }
-  };
   return /*#__PURE__*/React.createElement(Stack, {
     style: contentStyles,
     dir: dir,
     horizontal: true
   }, /*#__PURE__*/React.createElement("span", null, " ", getTimestampHourMinute(timestamp)), /*#__PURE__*/React.createElement("span", null, " \xA0-\xA0 "), /*#__PURE__*/React.createElement("span", {
     style: failedTextStyles
-  }, " ", ((_state$domainStates$m = state.domainStates.middlewareLocalizedTexts) === null || _state$domainStates$m === void 0 ? void 0 : _state$domainStates$m.MIDDLEWARE_MESSAGE_NOT_DELIVERED) ?? defaultMiddlewareLocalizedTexts.MIDDLEWARE_MESSAGE_NOT_DELIVERED, " "), /*#__PURE__*/React.createElement("span", null, " \xA0-\xA0 "), /*#__PURE__*/React.createElement("span", {
+  }, " ", ((_state$domainStates$m = state.domainStates.middlewareLocalizedTexts) === null || _state$domainStates$m === void 0 ? void 0 : _state$domainStates$m.MIDDLEWARE_MESSAGE_NOT_DELIVERED) ?? defaultMiddlewareLocalizedTexts.MIDDLEWARE_MESSAGE_NOT_DELIVERED, " "), /*#__PURE__*/React.createElement("span", null, " \xA0-\xA0 "), /*#__PURE__*/React.createElement("button", {
     style: retryTextStyles,
-    role: "button",
-    onClick: onRetryClick,
-    onKeyDown: onRetryKeyEnter,
-    tabIndex: 0
-  }, " ", ((_state$domainStates$m2 = state.domainStates.middlewareLocalizedTexts) === null || _state$domainStates$m2 === void 0 ? void 0 : _state$domainStates$m2.MIDDLEWARE_MESSAGE_RETRY) ?? defaultMiddlewareLocalizedTexts.MIDDLEWARE_MESSAGE_RETRY, " "));
+    onClick: onRetryClick
+  }, ((_state$domainStates$m2 = state.domainStates.middlewareLocalizedTexts) === null || _state$domainStates$m2 === void 0 ? void 0 : _state$domainStates$m2.MIDDLEWARE_MESSAGE_RETRY) ?? defaultMiddlewareLocalizedTexts.MIDDLEWARE_MESSAGE_RETRY));
 };

package/lib/esm/components/webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/timestamps/SendingTimestamp.js

@@ -1,3 +1,9 @@
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
 import React from "react";
 import { Stack } from "@fluentui/react";
 import { defaultMiddlewareLocalizedTexts } from "../../../../common/defaultProps/defaultMiddlewareLocalizedTexts";
@@ -7,7 +13,9 @@ import useChatContextStore from "../../../../../../hooks/useChatContextStore";
 /* eslint @typescript-eslint/no-explicit-any: "off" */
 export const SendingTimestamp = () => {
   var _state$domainStates$r, _state$domainStates$r2, _state$domainStates$m;
-  const [state] = useChatContextStore();
+  const _useChatContextStore = useChatContextStore(),
+    _useChatContextStore2 = _slicedToArray(_useChatContextStore, 1),
+    state = _useChatContextStore2[0];
   const dir = ((_state$domainStates$r = state.domainStates.renderingMiddlewareProps) === null || _state$domainStates$r === void 0 ? void 0 : _state$domainStates$r.timestampDir) ?? state.domainStates.globalDir;
   const contentStyles = {
     ...defaultTimestampContentStyles,

package/lib/esm/components/webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/toastMiddleware.js

@@ -6,9 +6,7 @@ import NotificationPaneStateful from "../../../../notificationpanestateful/Notif
 export const createToastMiddleware = (notificationPaneProps, endChat) => {
   // eslint-disable-next-line @typescript-eslint/no-explicit-any, react/display-name
   const toastMiddleware = () => next => card => {
-    const {
-      notification
-    } = card;
+    const notification = card.notification;
     if (notificationPaneProps) {
       if (notification.id === NotificationScenarios.ChatDisconnect) {
         return /*#__PURE__*/React.createElement(NotificationPaneStateful, {

package/lib/esm/components/webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/typingIndicatorMiddleware.js

@@ -1,3 +1,9 @@
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
 /******
  * TypingIndicatorMiddleware
  *
@@ -17,12 +23,14 @@ import useFacadeSDKStore from "../../../../../hooks/useFacadeChatSDKStore";
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 const TypingIndicator = _ref => {
   var _state$domainStates$l, _state$domainStates$r, _state$domainStates$r2, _state$domainStates$r3;
-  let {
-    activeTyping,
-    visible
-  } = _ref;
-  const [facadeChatSDK] = useFacadeSDKStore();
-  const [state] = useChatContextStore();
+  let activeTyping = _ref.activeTyping,
+    visible = _ref.visible;
+  const _useFacadeSDKStore = useFacadeSDKStore(),
+    _useFacadeSDKStore2 = _slicedToArray(_useFacadeSDKStore, 1),
+    facadeChatSDK = _useFacadeSDKStore2[0];
+  const _useChatContextStore = useChatContextStore(),
+    _useChatContextStore2 = _slicedToArray(_useChatContextStore, 1),
+    state = _useChatContextStore2[0];
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const debounceTyping = useCallback(debounceLeading(() => facadeChatSDK === null || facadeChatSDK === void 0 ? void 0 : facadeChatSDK.sendTypingEvent()), []);
   if (!activeTyping || Object.keys(activeTyping).length === 0 || ((_state$domainStates$l = state.domainStates.liveChatConfig) === null || _state$domainStates$l === void 0 ? void 0 : _state$domainStates$l.LiveChatVersion) === 1 && !visible) {
@@ -101,10 +109,8 @@ const TypingIndicator = _ref => {
 
 // eslint-disable-next-line react/display-name, @typescript-eslint/no-unused-vars, @typescript-eslint/no-explicit-any
 export const typingIndicatorMiddleware = () => next => args => {
-  const {
-    activeTyping,
-    visible
-  } = args;
+  const activeTyping = args.activeTyping,
+    visible = args.visible;
   return /*#__PURE__*/React.createElement(TypingIndicator, {
     activeTyping: activeTyping,
     visible: visible

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

@@ -4,6 +4,7 @@
  * Handles attachment sending.
  ******/
 
+import { isWebChatAction } from "../../../interfaces/IWebChatAction";
 import { WebChatActionType } from "../../enums/WebChatActionType";
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -15,15 +16,14 @@ const createSendFileAction = files => {
     type: WebChatActionType.WEB_CHAT_SEND_MESSAGE
   };
 };
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
 const attachmentProcessingMiddleware = _ref => {
-  let {
-    dispatch
-  } = _ref;
+  let dispatch = _ref.dispatch;
   return next => async action => {
     var _action$payload;
-    if ((action === null || action === void 0 ? void 0 : action.type) === WebChatActionType.WEB_CHAT_SEND_MESSAGE && (action === null || action === void 0 || (_action$payload = action.payload) === null || _action$payload === void 0 || (_action$payload = _action$payload.attachments) === null || _action$payload === void 0 ? void 0 : _action$payload.length) > 0) {
+    if (!isWebChatAction(action)) {
+      return next(action);
+    }
+    if (action.type === WebChatActionType.WEB_CHAT_SEND_MESSAGE && ((_action$payload = action.payload) === null || _action$payload === void 0 || (_action$payload = _action$payload.attachments) === null || _action$payload === void 0 ? void 0 : _action$payload.length) > 0) {
       const files = action.payload.attachments;
       if (files.length === 1) {
         return next(action);

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

@@ -0,0 +1,77 @@
+/******
+ * AttachmentSentAnnouncementMiddleware
+ *
+ * When a file attachment is successfully sent, announces the result to
+ * screen readers via an aria-live region so that assistive technology
+ * users receive immediate feedback.
+ ******/
+
+import { isWebChatAction } from "../../../interfaces/IWebChatAction";
+import { WebChatActionType } from "../../enums/WebChatActionType";
+const ARIA_LIVE_REGION_ID = "oc-lcw-attachment-announcement";
+
+/**
+ * Ensures a visually-hidden aria-live region exists in the DOM for
+ * announcing attachment upload results to screen readers.
+ */
+const ensureAriaLiveRegion = () => {
+  let region = document.getElementById(ARIA_LIVE_REGION_ID);
+  if (!region) {
+    region = document.createElement("div");
+    region.id = ARIA_LIVE_REGION_ID;
+    region.setAttribute("aria-live", "polite");
+    region.setAttribute("role", "status");
+    region.setAttribute("aria-atomic", "true");
+    // Visually hidden but available to screen readers
+    Object.assign(region.style, {
+      position: "absolute",
+      width: "1px",
+      height: "1px",
+      padding: "0",
+      margin: "-1px",
+      overflow: "hidden",
+      clip: "rect(0, 0, 0, 0)",
+      whiteSpace: "nowrap",
+      border: "0"
+    });
+    const container = document.getElementById("oc-lcw-container");
+    (container || document.body).appendChild(region);
+  }
+  return region;
+};
+
+/**
+ * Announces a message to screen readers by updating the aria-live region.
+ * Clears it briefly first so repeated identical messages are still announced.
+ */
+const announce = message => {
+  const region = ensureAriaLiveRegion();
+  region.textContent = "";
+  // Small delay so the screen reader detects the content change
+  setTimeout(() => {
+    region.textContent = message;
+  }, 100);
+};
+
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+const attachmentSentAnnouncementMiddleware = _ref => {
+  let dispatch = _ref.dispatch;
+  return next => action => {
+    if (!isWebChatAction(action)) {
+      return next(action);
+    }
+
+    // Intercept successfully posted activities that contain attachments
+    if (action.type === WebChatActionType.DIRECT_LINE_POST_ACTIVITY_FULFILLED) {
+      var _action$payload;
+      const attachments = (_action$payload = action.payload) === null || _action$payload === void 0 || (_action$payload = _action$payload.activity) === null || _action$payload === void 0 ? void 0 : _action$payload.attachments;
+      if (attachments && attachments.length > 0) {
+        const count = attachments.length;
+        const message = count === 1 ? "File sent" : `${count} files sent`;
+        announce(message);
+      }
+    }
+    return next(action);
+  };
+};
+export default attachmentSentAnnouncementMiddleware;

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

@@ -6,11 +6,33 @@
 
 import { LogLevel, TelemetryEvent } from "../../../../../common/telemetry/TelemetryConstants";
 import { AMSConstants } from "../../../../../common/Constants";
+import { isWebChatAction } from "../../../interfaces/IWebChatAction";
 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. 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");
+    el.setAttribute("aria-live", "assertive");
+    el.setAttribute("aria-atomic", "true");
+    el.style.cssText = "position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;";
+    el.textContent = message;
+    document.body.appendChild(el);
+    // Remove after TalkBack has had time to read it
+    setTimeout(() => {
+      if (el.parentNode) {
+        el.parentNode.removeChild(el);
+      }
+    }, 3000);
+  }, 500);
+};
 
 /*
 * If an attachment is invalid, delete this attachment from the attachments list
@@ -188,19 +210,25 @@ const getFileSizeErrorMessage = (fileName, maxUploadFileSize, maxFileSizeSupport
   return errorMessage ? errorMessage.includes("{2}") ? errorMessage.replace("{2}", textEllipsis(fileName)) : errorMessage : "";
 };
 
-// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unused-vars
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
 const createAttachmentUploadValidatorMiddleware = (allowedFileExtensions, maxFileSizeSupportedByDynamics, localizedTexts) => _ref => {
-  let {
-    dispatch
-  } = _ref;
+  let dispatch = _ref.dispatch;
   return next => action => {
+    if (!isWebChatAction(action)) {
+      return next(action);
+    }
     if (action.type === WebChatActionType.DIRECT_LINE_POST_ACTIVITY) {
       var _payload$activity, _payload$activity2;
-      const {
-        payload
-      } = action;
+      const payload = action.payload;
       if (payload !== null && payload !== void 0 && payload.activity.attachments && payload.activity.attachments.length > 0 && (payload === null || payload === void 0 || (_payload$activity = payload.activity) === null || _payload$activity === void 0 || (_payload$activity = _payload$activity.attachments) === null || _payload$activity === void 0 ? void 0 : _payload$activity.length) === (payload === null || payload === void 0 || (_payload$activity2 = payload.activity) === null || _payload$activity2 === void 0 || (_payload$activity2 = _payload$activity2.channelData) === null || _payload$activity2 === void 0 || (_payload$activity2 = _payload$activity2.attachmentSizes) === null || _payload$activity2 === void 0 ? void 0 : _payload$activity2.length)) {
-        return next(validateAttachment(action, allowedFileExtensions, maxFileSizeSupportedByDynamics, localizedTexts));
+        var _validatedAction$payl;
+        const validatedAction = validateAttachment(action, allowedFileExtensions, maxFileSizeSupportedByDynamics, localizedTexts);
+
+        // Announce to screen readers that the file was sent when validation passes
+        if (((_validatedAction$payl = validatedAction.payload) === null || _validatedAction$payl === void 0 || (_validatedAction$payl = _validatedAction$payl.activity) === null || _validatedAction$payl === void 0 || (_validatedAction$payl = _validatedAction$payl.attachments) === null || _validatedAction$payl === void 0 ? void 0 : _validatedAction$payl.length) > 0) {
+          announceFileSent(localizedTexts.MIDDLEWARE_BANNER_FILE_SENT ?? "File sent successfully.");
+        }
+        return next(validatedAction);
       }
     }
     return next(action);

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

@@ -4,10 +4,13 @@
  * Intercepts custom call actions and handles tel: URL navigation
  ******/
 
+import { isWebChatAction } from "../../../interfaces/IWebChatAction";
 import { WebChatActionType } from "../../enums/WebChatActionType";
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unused-vars
 const createCallActionMiddleware = () => () => next => action => {
+  if (!isWebChatAction(action)) {
+    return next(action);
+  }
+
   // Intercept incoming activities to modify suggested actions with call type
   if (action.type === WebChatActionType.DIRECT_LINE_INCOMING_ACTIVITY) {
     var _action$payload, _activity$suggestedAc;

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

@@ -6,16 +6,18 @@
 
 import { Constants } from "../../../../../common/Constants";
 import { DeliveryMode } from "@microsoft/omnichannel-chat-sdk";
+import { isWebChatAction } from "../../../interfaces/IWebChatAction";
 import { WebChatActionType } from "../../enums/WebChatActionType";
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unused-vars
 const channelDataMiddleware = addConversationalSurveyTagsCallback => _ref => {
-  let {
-    dispatch
-  } = _ref;
+  let dispatch = _ref.dispatch;
   return next => action => {
-    var _action, _action2;
-    if (((_action = action) === null || _action === void 0 ? void 0 : _action.type) === WebChatActionType.DIRECT_LINE_POST_ACTIVITY_PENDING && (_action2 = action) !== null && _action2 !== void 0 && (_action2 = _action2.payload) !== null && _action2 !== void 0 && (_action2 = _action2.activity) !== null && _action2 !== void 0 && _action2.channelData) {
+    var _action$payload;
+    if (!isWebChatAction(action)) {
+      return next(action);
+    }
+    if (action.type === WebChatActionType.DIRECT_LINE_POST_ACTIVITY_PENDING && (_action$payload = action.payload) !== null && _action$payload !== void 0 && (_action$payload = _action$payload.activity) !== null && _action$payload !== void 0 && _action$payload.channelData) {
       const channelIdTag = `${Constants.channelIdKey}${Constants.ChannelId}`;
       const customerMessageTag = `${Constants.CustomerTag}`;
       if (action.payload.activity.channelData.tags) {
@@ -29,10 +31,11 @@ const channelDataMiddleware = addConversationalSurveyTagsCallback => _ref => {
         action.payload.activity.channelData.tags = [channelIdTag];
         action.payload.activity.channelData.tags.push(customerMessageTag);
       }
-      action = addConversationalSurveyTagsCallback(action);
-      action.payload.activity.channelData.metadata = {
+      const updatedAction = addConversationalSurveyTagsCallback(action);
+      updatedAction.payload.activity.channelData.metadata = {
         deliveryMode: DeliveryMode.Bridged
       };
+      return next(updatedAction);
     }
     return next(action);
   };

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

@@ -1,4 +1,5 @@
 import { LogLevel, TelemetryEvent } from "../../../../../common/telemetry/TelemetryConstants";
+import { isWebChatAction } from "../../../interfaces/IWebChatAction";
 import { LiveChatWidgetActionType } from "../../../../../contexts/common/LiveChatWidgetActionType";
 import { TelemetryHelper } from "../../../../../common/telemetry/TelemetryHelper";
 import { executeReducer } from "../../../../../contexts/createReducer";
@@ -10,6 +11,9 @@ import { executeReducer } from "../../../../../contexts/createReducer";
 
 export const createCitationsMiddleware = (state, dispatch) => () => next => action => {
   var _action$payload;
+  if (!isWebChatAction(action)) {
+    return next(action);
+  }
   if ((_action$payload = action.payload) !== null && _action$payload !== void 0 && _action$payload.activity) {
     if (isApplicable(action)) {
       try {

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

@@ -7,17 +7,19 @@
 
 import { Constants } from "../../../../../common/Constants";
 import { DirectLineSenderRole } from "../../enums/DirectLineSenderRole";
+import { isWebChatAction } from "../../../interfaces/IWebChatAction";
 import { MessageTypes } from "../../enums/MessageType";
 import { WebChatActionType } from "../../enums/WebChatActionType";
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unused-vars
 const createConversationEndMiddleware = (conversationEndCallback, startConversationalSurveyCallback, endConversationalSurveyCallback) => _ref => {
-  let {
-    dispatch
-  } = _ref;
+  let dispatch = _ref.dispatch;
   return next => action => {
     var _action$payload;
-    if ((action === null || action === void 0 ? void 0 : action.type) == WebChatActionType.DIRECT_LINE_INCOMING_ACTIVITY && (_action$payload = action.payload) !== null && _action$payload !== void 0 && _action$payload.activity) {
+    if (!isWebChatAction(action)) {
+      return next(action);
+    }
+    if (action.type == WebChatActionType.DIRECT_LINE_INCOMING_ACTIVITY && (_action$payload = action.payload) !== null && _action$payload !== void 0 && _action$payload.activity) {
       var _activity$from2, _activity$channelData9, _activity$channelData0;
       const activity = action.payload.activity;
       if (activity.channelId === "ACS_CHANNEL") {

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

@@ -6,6 +6,7 @@
  ******/
 
 import { Constants } from "../../../../../common/Constants";
+import { isWebChatAction } from "../../../interfaces/IWebChatAction";
 import { WebChatActionType } from "../../enums/WebChatActionType";
 export const isValidCustomEvent = activity => {
   var _activity$channelData, _activity$channelData2, _activity$channelData3, _activity$from, _activity$channelData4, _activity$channelData5;
@@ -13,7 +14,10 @@ export const isValidCustomEvent = activity => {
 };
 const createCustomEventMiddleware = broadcastservice => () => next => action => {
   var _action$payload;
-  if ((action === null || action === void 0 ? void 0 : action.type) == WebChatActionType.DIRECT_LINE_INCOMING_ACTIVITY && (_action$payload = action.payload) !== null && _action$payload !== void 0 && _action$payload.activity) {
+  if (!isWebChatAction(action)) {
+    return next(action);
+  }
+  if (action.type == WebChatActionType.DIRECT_LINE_INCOMING_ACTIVITY && (_action$payload = action.payload) !== null && _action$payload !== void 0 && _action$payload.activity) {
     const activity = action.payload.activity;
     if (isValidCustomEvent(activity)) {
       const customEvent = {

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

@@ -5,14 +5,13 @@
  ******/
 
 import { LogLevel, TelemetryEvent } from "../../../../../common/telemetry/TelemetryConstants";
+import { isWebChatAction } from "../../../interfaces/IWebChatAction";
 import { TelemetryHelper } from "../../../../../common/telemetry/TelemetryHelper";
 import { WebChatActionType } from "../../enums/WebChatActionType";
 import { isMaskingforCustomer } from "../../../common/utils/isMaskingFromCustomer";
 const applyDataMasking = (action, regexCollection) => {
   const maskedChar = "#"; //to do: load from env once OC SDK supporting.
-  let {
-    text
-  } = action.payload;
+  let text = action.payload.text;
   if (!regexCollection) {
     TelemetryHelper.logActionEvent(LogLevel.ERROR, {
       Event: TelemetryEvent.InvalidConfiguration,
@@ -72,13 +71,14 @@ const applyDataMasking = (action, regexCollection) => {
   return action;
 };
 
-// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unused-vars
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
 const createDataMaskingMiddleware = dataMaskingInfo => _ref => {
-  let {
-    dispatch
-  } = _ref;
+  let dispatch = _ref.dispatch;
   return next => action => {
     var _action$payload;
+    if (!isWebChatAction(action)) {
+      return next(action);
+    }
     if (isMaskingforCustomer(dataMaskingInfo) && (_action$payload = action.payload) !== null && _action$payload !== void 0 && _action$payload.text && action.type === WebChatActionType.WEB_CHAT_SEND_MESSAGE) {
       const regexCollection = dataMaskingInfo === null || dataMaskingInfo === void 0 ? void 0 : dataMaskingInfo.dataMaskingRules;
       return next(applyDataMasking(action, regexCollection));

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

@@ -5,30 +5,26 @@
  ******/
 
 import { Constants } from "../../../../../common/Constants";
+import { isWebChatAction } from "../../../interfaces/IWebChatAction";
 import { WebChatActionType } from "../../enums/WebChatActionType";
 
-// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unused-vars
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
 const gifUploadMiddleware = _ref => {
-  let {
-    dispatch
-  } = _ref;
+  let dispatch = _ref.dispatch;
   return next => action => {
+    if (!isWebChatAction(action)) {
+      return next(action);
+    }
     if (action.type === WebChatActionType.DIRECT_LINE_POST_ACTIVITY) {
       var _activity$attachments, _activity$channelData;
-      const {
-        payload: {
-          activity
-        }
-      } = action;
+      const activity = action.payload.activity;
       if ((activity === null || activity === void 0 || (_activity$attachments = activity.attachments) === null || _activity$attachments === void 0 ? void 0 : _activity$attachments.length) === (activity === null || activity === void 0 || (_activity$channelData = activity.channelData) === null || _activity$channelData === void 0 || (_activity$channelData = _activity$channelData.attachmentSizes) === null || _activity$channelData === void 0 ? void 0 : _activity$channelData.length)) {
         var _activity$attachments2;
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         activity === null || activity === void 0 || (_activity$attachments2 = activity.attachments) === null || _activity$attachments2 === void 0 || _activity$attachments2.forEach(attachment => {
-          const {
-            thumbnailUrl,
-            contentUrl,
-            contentType
-          } = attachment;
+          const thumbnailUrl = attachment.thumbnailUrl,
+            contentUrl = attachment.contentUrl,
+            contentType = attachment.contentType;
           if (contentType === Constants.GifContentType && thumbnailUrl !== contentUrl) {
             attachment.thumbnailUrl = contentUrl;
           }

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

@@ -5,6 +5,7 @@
  ******/
 
 import { Constants } from "../../../../../common/Constants";
+import { isWebChatAction } from "../../../interfaces/IWebChatAction";
 import { WebChatActionType } from "../../enums/WebChatActionType";
 const disableHTMLPlayerDownloadButton = htmlTag => {
   setTimeout(() => {
@@ -23,13 +24,14 @@ const disableHTMLPlayerDownloadButton = htmlTag => {
   }, 500);
 };
 
-// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unused-vars
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
 const htmlPlayerMiddleware = _ref => {
-  let {
-    dispatch
-  } = _ref;
+  let dispatch = _ref.dispatch;
   return next => action => {
     var _action$payload;
+    if (!isWebChatAction(action)) {
+      return next(action);
+    }
     if (action.type === WebChatActionType.DIRECT_LINE_INCOMING_ACTIVITY && ((_action$payload = action.payload) === null || _action$payload === void 0 || (_action$payload = _action$payload.activity) === null || _action$payload === void 0 || (_action$payload = _action$payload.attachments) === null || _action$payload === void 0 ? void 0 : _action$payload.length) > 0) {
       disableHTMLPlayerDownloadButton(Constants.video);
       disableHTMLPlayerDownloadButton(Constants.audio);