@microsoft/omnichannel-chat-components 1.1.18 → 1.1.19

package/lib/esm/components/callingcontainer/subcomponents/IncomingCall/IncomingCall.js

@@ -1,5 +1,4 @@
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 import * as React from "react";
 import { Label, Stack } from "@fluentui/react";
 import CommandButton from "../../../common/commandbutton/CommandButton";
@@ -8,52 +7,48 @@ import { decodeComponentString } from "../../../../common/decodeComponentString"
 import { defaultIncomingCallProps } from "./common/defaultProps/defaultIncomingCallProps";
 import { processCustomComponents } from "../../../../common/utils";
 import { useCallback, useEffect } from "react";
-
 function IncomingCall(props) {
-  var _props$controlProps, _defaultIncomingCallP, _props$controlProps2, _props$controlProps2$, _defaultIncomingCallP2, _defaultIncomingCallP3, _props$controlProps3, _props$controlProps3$, _defaultIncomingCallP4, _defaultIncomingCallP5, _props$controlProps4, _props$controlProps4$, _defaultIncomingCallP6, _defaultIncomingCallP7, _defaultIncomingCallP8, _props$styleProps, _props$controlProps5, _props$controlProps5$, _defaultIncomingCallP9, _defaultIncomingCallP10, _props$controlProps6, _props$controlProps6$, _defaultIncomingCallP11, _defaultIncomingCallP12, _props$controlProps7, _props$controlProps7$, _defaultIncomingCallP13, _defaultIncomingCallP14, _defaultIncomingCallP15, _props$controlProps8, _defaultIncomingCallP16, _props$controlProps9, _defaultIncomingCallP17, _props$controlProps10, _defaultIncomingCallP18, _props$controlProps11, _defaultIncomingCallP19, _props$styleProps2, _defaultIncomingCallP20, _props$styleProps3, _defaultIncomingCallP21, _props$styleProps4, _defaultIncomingCallP22, _props$styleProps5, _defaultIncomingCallP23, _props$styleProps6, _defaultIncomingCallP24, _props$styleProps7, _defaultIncomingCallP25, _props$styleProps8, _defaultIncomingCallP26, _props$styleProps9, _props$styleProps10, _props$controlProps18, _defaultIncomingCallP27, _props$controlProps19, _props$componentOverr, _props$controlProps20, _props$controlProps21, _props$controlProps22, _props$controlProps23, _props$controlProps24, _props$controlProps25, _props$controlProps26, _props$controlProps27, _props$controlProps28;
-
+  var _props$controlProps, _defaultIncomingCallP, _props$controlProps2, _defaultIncomingCallP2, _props$controlProps3, _defaultIncomingCallP3, _props$controlProps4, _defaultIncomingCallP4, _defaultIncomingCallP5, _props$styleProps, _props$controlProps5, _defaultIncomingCallP6, _props$controlProps6, _defaultIncomingCallP7, _props$controlProps7, _defaultIncomingCallP8, _defaultIncomingCallP9, _props$controlProps8, _defaultIncomingCallP0, _props$controlProps9, _defaultIncomingCallP1, _props$controlProps0, _defaultIncomingCallP10, _props$controlProps1, _defaultIncomingCallP11, _props$styleProps2, _defaultIncomingCallP12, _props$styleProps3, _defaultIncomingCallP13, _props$styleProps4, _defaultIncomingCallP14, _props$styleProps5, _defaultIncomingCallP15, _props$styleProps6, _defaultIncomingCallP16, _props$styleProps7, _defaultIncomingCallP17, _props$styleProps8, _defaultIncomingCallP18, _props$styleProps9, _props$styleProps0, _props$controlProps16, _defaultIncomingCallP19, _props$controlProps17, _props$componentOverr, _props$controlProps18, _props$controlProps19, _props$controlProps20, _props$controlProps21, _props$controlProps22, _props$controlProps23;
   const incomingCallId = ((_props$controlProps = props.controlProps) === null || _props$controlProps === void 0 ? void 0 : _props$controlProps.id) ?? ((_defaultIncomingCallP = defaultIncomingCallProps.controlProps) === null || _defaultIncomingCallP === void 0 ? void 0 : _defaultIncomingCallP.id);
-  const declineCallButtonId = ((_props$controlProps2 = props.controlProps) === null || _props$controlProps2 === void 0 ? void 0 : (_props$controlProps2$ = _props$controlProps2.declineCallButtonProps) === null || _props$controlProps2$ === void 0 ? void 0 : _props$controlProps2$.id) ?? ((_defaultIncomingCallP2 = defaultIncomingCallProps.controlProps) === null || _defaultIncomingCallP2 === void 0 ? void 0 : (_defaultIncomingCallP3 = _defaultIncomingCallP2.declineCallButtonProps) === null || _defaultIncomingCallP3 === void 0 ? void 0 : _defaultIncomingCallP3.id);
-  const audioCallButtonId = ((_props$controlProps3 = props.controlProps) === null || _props$controlProps3 === void 0 ? void 0 : (_props$controlProps3$ = _props$controlProps3.audioCallButtonProps) === null || _props$controlProps3$ === void 0 ? void 0 : _props$controlProps3$.id) ?? ((_defaultIncomingCallP4 = defaultIncomingCallProps.controlProps) === null || _defaultIncomingCallP4 === void 0 ? void 0 : (_defaultIncomingCallP5 = _defaultIncomingCallP4.audioCallButtonProps) === null || _defaultIncomingCallP5 === void 0 ? void 0 : _defaultIncomingCallP5.id);
-  const videoCallButtonId = ((_props$controlProps4 = props.controlProps) === null || _props$controlProps4 === void 0 ? void 0 : (_props$controlProps4$ = _props$controlProps4.videoCallButtonProps) === null || _props$controlProps4$ === void 0 ? void 0 : _props$controlProps4$.id) ?? ((_defaultIncomingCallP6 = defaultIncomingCallProps.controlProps) === null || _defaultIncomingCallP6 === void 0 ? void 0 : (_defaultIncomingCallP7 = _defaultIncomingCallP6.videoCallButtonProps) === null || _defaultIncomingCallP7 === void 0 ? void 0 : _defaultIncomingCallP7.id);
+  const declineCallButtonId = ((_props$controlProps2 = props.controlProps) === null || _props$controlProps2 === void 0 || (_props$controlProps2 = _props$controlProps2.declineCallButtonProps) === null || _props$controlProps2 === void 0 ? void 0 : _props$controlProps2.id) ?? ((_defaultIncomingCallP2 = defaultIncomingCallProps.controlProps) === null || _defaultIncomingCallP2 === void 0 || (_defaultIncomingCallP2 = _defaultIncomingCallP2.declineCallButtonProps) === null || _defaultIncomingCallP2 === void 0 ? void 0 : _defaultIncomingCallP2.id);
+  const audioCallButtonId = ((_props$controlProps3 = props.controlProps) === null || _props$controlProps3 === void 0 || (_props$controlProps3 = _props$controlProps3.audioCallButtonProps) === null || _props$controlProps3 === void 0 ? void 0 : _props$controlProps3.id) ?? ((_defaultIncomingCallP3 = defaultIncomingCallProps.controlProps) === null || _defaultIncomingCallP3 === void 0 || (_defaultIncomingCallP3 = _defaultIncomingCallP3.audioCallButtonProps) === null || _defaultIncomingCallP3 === void 0 ? void 0 : _defaultIncomingCallP3.id);
+  const videoCallButtonId = ((_props$controlProps4 = props.controlProps) === null || _props$controlProps4 === void 0 || (_props$controlProps4 = _props$controlProps4.videoCallButtonProps) === null || _props$controlProps4 === void 0 ? void 0 : _props$controlProps4.id) ?? ((_defaultIncomingCallP4 = defaultIncomingCallProps.controlProps) === null || _defaultIncomingCallP4 === void 0 || (_defaultIncomingCallP4 = _defaultIncomingCallP4.videoCallButtonProps) === null || _defaultIncomingCallP4 === void 0 ? void 0 : _defaultIncomingCallP4.id);
   const stackStyles = {
-    root: Object.assign({}, (_defaultIncomingCallP8 = defaultIncomingCallProps.styleProps) === null || _defaultIncomingCallP8 === void 0 ? void 0 : _defaultIncomingCallP8.generalStyleProps, (_props$styleProps = props.styleProps) === null || _props$styleProps === void 0 ? void 0 : _props$styleProps.generalStyleProps)
+    root: Object.assign({}, (_defaultIncomingCallP5 = defaultIncomingCallProps.styleProps) === null || _defaultIncomingCallP5 === void 0 ? void 0 : _defaultIncomingCallP5.generalStyleProps, (_props$styleProps = props.styleProps) === null || _props$styleProps === void 0 ? void 0 : _props$styleProps.generalStyleProps)
   };
   const leftGroupStackTokens = {
-    childrenGap: ((_props$controlProps5 = props.controlProps) === null || _props$controlProps5 === void 0 ? void 0 : (_props$controlProps5$ = _props$controlProps5.leftGroup) === null || _props$controlProps5$ === void 0 ? void 0 : _props$controlProps5$.gap) ?? ((_defaultIncomingCallP9 = defaultIncomingCallProps.controlProps) === null || _defaultIncomingCallP9 === void 0 ? void 0 : (_defaultIncomingCallP10 = _defaultIncomingCallP9.leftGroup) === null || _defaultIncomingCallP10 === void 0 ? void 0 : _defaultIncomingCallP10.gap)
+    childrenGap: ((_props$controlProps5 = props.controlProps) === null || _props$controlProps5 === void 0 || (_props$controlProps5 = _props$controlProps5.leftGroup) === null || _props$controlProps5 === void 0 ? void 0 : _props$controlProps5.gap) ?? ((_defaultIncomingCallP6 = defaultIncomingCallProps.controlProps) === null || _defaultIncomingCallP6 === void 0 || (_defaultIncomingCallP6 = _defaultIncomingCallP6.leftGroup) === null || _defaultIncomingCallP6 === void 0 ? void 0 : _defaultIncomingCallP6.gap)
   };
   const rightGroupStackTokens = {
-    childrenGap: ((_props$controlProps6 = props.controlProps) === null || _props$controlProps6 === void 0 ? void 0 : (_props$controlProps6$ = _props$controlProps6.rightGroup) === null || _props$controlProps6$ === void 0 ? void 0 : _props$controlProps6$.gap) ?? ((_defaultIncomingCallP11 = defaultIncomingCallProps.controlProps) === null || _defaultIncomingCallP11 === void 0 ? void 0 : (_defaultIncomingCallP12 = _defaultIncomingCallP11.rightGroup) === null || _defaultIncomingCallP12 === void 0 ? void 0 : _defaultIncomingCallP12.gap)
+    childrenGap: ((_props$controlProps6 = props.controlProps) === null || _props$controlProps6 === void 0 || (_props$controlProps6 = _props$controlProps6.rightGroup) === null || _props$controlProps6 === void 0 ? void 0 : _props$controlProps6.gap) ?? ((_defaultIncomingCallP7 = defaultIncomingCallProps.controlProps) === null || _defaultIncomingCallP7 === void 0 || (_defaultIncomingCallP7 = _defaultIncomingCallP7.rightGroup) === null || _defaultIncomingCallP7 === void 0 ? void 0 : _defaultIncomingCallP7.gap)
   };
   const middleGroupStackTokens = {
-    childrenGap: ((_props$controlProps7 = props.controlProps) === null || _props$controlProps7 === void 0 ? void 0 : (_props$controlProps7$ = _props$controlProps7.middleGroup) === null || _props$controlProps7$ === void 0 ? void 0 : _props$controlProps7$.gap) ?? ((_defaultIncomingCallP13 = defaultIncomingCallProps.controlProps) === null || _defaultIncomingCallP13 === void 0 ? void 0 : (_defaultIncomingCallP14 = _defaultIncomingCallP13.middleGroup) === null || _defaultIncomingCallP14 === void 0 ? void 0 : _defaultIncomingCallP14.gap)
+    childrenGap: ((_props$controlProps7 = props.controlProps) === null || _props$controlProps7 === void 0 || (_props$controlProps7 = _props$controlProps7.middleGroup) === null || _props$controlProps7 === void 0 ? void 0 : _props$controlProps7.gap) ?? ((_defaultIncomingCallP8 = defaultIncomingCallProps.controlProps) === null || _defaultIncomingCallP8 === void 0 || (_defaultIncomingCallP8 = _defaultIncomingCallP8.middleGroup) === null || _defaultIncomingCallP8 === void 0 ? void 0 : _defaultIncomingCallP8.gap)
   };
-  const declineCallButtonProps = Object.assign({}, (_defaultIncomingCallP15 = defaultIncomingCallProps.controlProps) === null || _defaultIncomingCallP15 === void 0 ? void 0 : _defaultIncomingCallP15.declineCallButtonProps, (_props$controlProps8 = props.controlProps) === null || _props$controlProps8 === void 0 ? void 0 : _props$controlProps8.declineCallButtonProps);
-  const videoCallButtonProps = Object.assign({}, (_defaultIncomingCallP16 = defaultIncomingCallProps.controlProps) === null || _defaultIncomingCallP16 === void 0 ? void 0 : _defaultIncomingCallP16.videoCallButtonProps, (_props$controlProps9 = props.controlProps) === null || _props$controlProps9 === void 0 ? void 0 : _props$controlProps9.videoCallButtonProps);
-  const audioCallButtonProps = Object.assign({}, (_defaultIncomingCallP17 = defaultIncomingCallProps.controlProps) === null || _defaultIncomingCallP17 === void 0 ? void 0 : _defaultIncomingCallP17.audioCallButtonProps, (_props$controlProps10 = props.controlProps) === null || _props$controlProps10 === void 0 ? void 0 : _props$controlProps10.audioCallButtonProps);
-  const incomingCallTitleProps = Object.assign({}, (_defaultIncomingCallP18 = defaultIncomingCallProps.controlProps) === null || _defaultIncomingCallP18 === void 0 ? void 0 : _defaultIncomingCallP18.incomingCallTitle, (_props$controlProps11 = props.controlProps) === null || _props$controlProps11 === void 0 ? void 0 : _props$controlProps11.incomingCallTitle);
-  const declineCallButtonStyles = Object.assign({}, (_defaultIncomingCallP19 = defaultIncomingCallProps.styleProps) === null || _defaultIncomingCallP19 === void 0 ? void 0 : _defaultIncomingCallP19.declineCallButtonStyleProps, (_props$styleProps2 = props.styleProps) === null || _props$styleProps2 === void 0 ? void 0 : _props$styleProps2.declineCallButtonStyleProps);
-  const declineCallButtonHoverStyles = Object.assign({}, (_defaultIncomingCallP20 = defaultIncomingCallProps.styleProps) === null || _defaultIncomingCallP20 === void 0 ? void 0 : _defaultIncomingCallP20.declineCallButtonHoverStyleProps, (_props$styleProps3 = props.styleProps) === null || _props$styleProps3 === void 0 ? void 0 : _props$styleProps3.declineCallButtonHoverStyleProps);
-  const videoCallButtonStyles = Object.assign({}, (_defaultIncomingCallP21 = defaultIncomingCallProps.styleProps) === null || _defaultIncomingCallP21 === void 0 ? void 0 : _defaultIncomingCallP21.videoCallButtonStyleProps, (_props$styleProps4 = props.styleProps) === null || _props$styleProps4 === void 0 ? void 0 : _props$styleProps4.videoCallButtonStyleProps);
-  const videoCallButtonHoverStyles = Object.assign({}, (_defaultIncomingCallP22 = defaultIncomingCallProps.styleProps) === null || _defaultIncomingCallP22 === void 0 ? void 0 : _defaultIncomingCallP22.videoCallButtonHoverStyleProps, (_props$styleProps5 = props.styleProps) === null || _props$styleProps5 === void 0 ? void 0 : _props$styleProps5.videoCallButtonHoverStyleProps);
-  const audioCallButtonStyles = Object.assign({}, (_defaultIncomingCallP23 = defaultIncomingCallProps.styleProps) === null || _defaultIncomingCallP23 === void 0 ? void 0 : _defaultIncomingCallP23.audioCallButtonStyleProps, (_props$styleProps6 = props.styleProps) === null || _props$styleProps6 === void 0 ? void 0 : _props$styleProps6.audioCallButtonStyleProps);
-  const audioCallButtonHoverStyles = Object.assign({}, (_defaultIncomingCallP24 = defaultIncomingCallProps.styleProps) === null || _defaultIncomingCallP24 === void 0 ? void 0 : _defaultIncomingCallP24.audioCallButtonHoverStyleProps, (_props$styleProps7 = props.styleProps) === null || _props$styleProps7 === void 0 ? void 0 : _props$styleProps7.audioCallButtonHoverStyleProps);
+  const declineCallButtonProps = Object.assign({}, (_defaultIncomingCallP9 = defaultIncomingCallProps.controlProps) === null || _defaultIncomingCallP9 === void 0 ? void 0 : _defaultIncomingCallP9.declineCallButtonProps, (_props$controlProps8 = props.controlProps) === null || _props$controlProps8 === void 0 ? void 0 : _props$controlProps8.declineCallButtonProps);
+  const videoCallButtonProps = Object.assign({}, (_defaultIncomingCallP0 = defaultIncomingCallProps.controlProps) === null || _defaultIncomingCallP0 === void 0 ? void 0 : _defaultIncomingCallP0.videoCallButtonProps, (_props$controlProps9 = props.controlProps) === null || _props$controlProps9 === void 0 ? void 0 : _props$controlProps9.videoCallButtonProps);
+  const audioCallButtonProps = Object.assign({}, (_defaultIncomingCallP1 = defaultIncomingCallProps.controlProps) === null || _defaultIncomingCallP1 === void 0 ? void 0 : _defaultIncomingCallP1.audioCallButtonProps, (_props$controlProps0 = props.controlProps) === null || _props$controlProps0 === void 0 ? void 0 : _props$controlProps0.audioCallButtonProps);
+  const incomingCallTitleProps = Object.assign({}, (_defaultIncomingCallP10 = defaultIncomingCallProps.controlProps) === null || _defaultIncomingCallP10 === void 0 ? void 0 : _defaultIncomingCallP10.incomingCallTitle, (_props$controlProps1 = props.controlProps) === null || _props$controlProps1 === void 0 ? void 0 : _props$controlProps1.incomingCallTitle);
+  const declineCallButtonStyles = Object.assign({}, (_defaultIncomingCallP11 = defaultIncomingCallProps.styleProps) === null || _defaultIncomingCallP11 === void 0 ? void 0 : _defaultIncomingCallP11.declineCallButtonStyleProps, (_props$styleProps2 = props.styleProps) === null || _props$styleProps2 === void 0 ? void 0 : _props$styleProps2.declineCallButtonStyleProps);
+  const declineCallButtonHoverStyles = Object.assign({}, (_defaultIncomingCallP12 = defaultIncomingCallProps.styleProps) === null || _defaultIncomingCallP12 === void 0 ? void 0 : _defaultIncomingCallP12.declineCallButtonHoverStyleProps, (_props$styleProps3 = props.styleProps) === null || _props$styleProps3 === void 0 ? void 0 : _props$styleProps3.declineCallButtonHoverStyleProps);
+  const videoCallButtonStyles = Object.assign({}, (_defaultIncomingCallP13 = defaultIncomingCallProps.styleProps) === null || _defaultIncomingCallP13 === void 0 ? void 0 : _defaultIncomingCallP13.videoCallButtonStyleProps, (_props$styleProps4 = props.styleProps) === null || _props$styleProps4 === void 0 ? void 0 : _props$styleProps4.videoCallButtonStyleProps);
+  const videoCallButtonHoverStyles = Object.assign({}, (_defaultIncomingCallP14 = defaultIncomingCallProps.styleProps) === null || _defaultIncomingCallP14 === void 0 ? void 0 : _defaultIncomingCallP14.videoCallButtonHoverStyleProps, (_props$styleProps5 = props.styleProps) === null || _props$styleProps5 === void 0 ? void 0 : _props$styleProps5.videoCallButtonHoverStyleProps);
+  const audioCallButtonStyles = Object.assign({}, (_defaultIncomingCallP15 = defaultIncomingCallProps.styleProps) === null || _defaultIncomingCallP15 === void 0 ? void 0 : _defaultIncomingCallP15.audioCallButtonStyleProps, (_props$styleProps6 = props.styleProps) === null || _props$styleProps6 === void 0 ? void 0 : _props$styleProps6.audioCallButtonStyleProps);
+  const audioCallButtonHoverStyles = Object.assign({}, (_defaultIncomingCallP16 = defaultIncomingCallProps.styleProps) === null || _defaultIncomingCallP16 === void 0 ? void 0 : _defaultIncomingCallP16.audioCallButtonHoverStyleProps, (_props$styleProps7 = props.styleProps) === null || _props$styleProps7 === void 0 ? void 0 : _props$styleProps7.audioCallButtonHoverStyleProps);
   const incomingCallTitleStyles = {
-    root: Object.assign({}, (_defaultIncomingCallP25 = defaultIncomingCallProps.styleProps) === null || _defaultIncomingCallP25 === void 0 ? void 0 : _defaultIncomingCallP25.incomingCallTitleStyleProps, (_props$styleProps8 = props.styleProps) === null || _props$styleProps8 === void 0 ? void 0 : _props$styleProps8.incomingCallTitleStyleProps)
+    root: Object.assign({}, (_defaultIncomingCallP17 = defaultIncomingCallProps.styleProps) === null || _defaultIncomingCallP17 === void 0 ? void 0 : _defaultIncomingCallP17.incomingCallTitleStyleProps, (_props$styleProps8 = props.styleProps) === null || _props$styleProps8 === void 0 ? void 0 : _props$styleProps8.incomingCallTitleStyleProps)
   };
-  const incomingCallItemFocusStyles = Object.assign({}, (_defaultIncomingCallP26 = defaultIncomingCallProps.styleProps) === null || _defaultIncomingCallP26 === void 0 ? void 0 : _defaultIncomingCallP26.itemFocusStyleProps, (_props$styleProps9 = props.styleProps) === null || _props$styleProps9 === void 0 ? void 0 : _props$styleProps9.itemFocusStyleProps);
+  const incomingCallItemFocusStyles = Object.assign({}, (_defaultIncomingCallP18 = defaultIncomingCallProps.styleProps) === null || _defaultIncomingCallP18 === void 0 ? void 0 : _defaultIncomingCallP18.itemFocusStyleProps, (_props$styleProps9 = props.styleProps) === null || _props$styleProps9 === void 0 ? void 0 : _props$styleProps9.itemFocusStyleProps);
   const declineCustomEvent = {
     elementType: ElementType.IncomingCallDeclineCallButton,
     elementId: declineCallButtonId,
     eventName: EventNames.IncomingCallEnded
   };
   const handleDeclineCallClick = useCallback(() => {
-    var _props$controlProps12;
-
-    if ((_props$controlProps12 = props.controlProps) !== null && _props$controlProps12 !== void 0 && _props$controlProps12.onDeclineCallClick) {
-      var _props$controlProps13;
-
-      (_props$controlProps13 = props.controlProps) === null || _props$controlProps13 === void 0 ? void 0 : _props$controlProps13.onDeclineCallClick();
+    var _props$controlProps10;
+    if ((_props$controlProps10 = props.controlProps) !== null && _props$controlProps10 !== void 0 && _props$controlProps10.onDeclineCallClick) {
+      var _props$controlProps11;
+      (_props$controlProps11 = props.controlProps) === null || _props$controlProps11 === void 0 || _props$controlProps11.onDeclineCallClick();
     }
   }, []);
   const videoCustomEvent = {
@@ -62,12 +57,10 @@ function IncomingCall(props) {
     eventName: EventNames.OnClick
   };
   const handleVideoCallClick = useCallback(() => {
-    var _props$controlProps14;
-
-    if ((_props$controlProps14 = props.controlProps) !== null && _props$controlProps14 !== void 0 && _props$controlProps14.onVideoCallClick) {
-      var _props$controlProps15;
-
-      (_props$controlProps15 = props.controlProps) === null || _props$controlProps15 === void 0 ? void 0 : _props$controlProps15.onVideoCallClick();
+    var _props$controlProps12;
+    if ((_props$controlProps12 = props.controlProps) !== null && _props$controlProps12 !== void 0 && _props$controlProps12.onVideoCallClick) {
+      var _props$controlProps13;
+      (_props$controlProps13 = props.controlProps) === null || _props$controlProps13 === void 0 || _props$controlProps13.onVideoCallClick();
     }
   }, []);
   const audioCustomEvent = {
@@ -76,21 +69,16 @@ function IncomingCall(props) {
     eventName: EventNames.OnClick
   };
   const handleAudioCallClick = useCallback(() => {
-    var _props$controlProps16;
-
-    if ((_props$controlProps16 = props.controlProps) !== null && _props$controlProps16 !== void 0 && _props$controlProps16.onAudioCallClick) {
-      var _props$controlProps17;
-
-      (_props$controlProps17 = props.controlProps) === null || _props$controlProps17 === void 0 ? void 0 : _props$controlProps17.onAudioCallClick();
+    var _props$controlProps14;
+    if ((_props$controlProps14 = props.controlProps) !== null && _props$controlProps14 !== void 0 && _props$controlProps14.onAudioCallClick) {
+      var _props$controlProps15;
+      (_props$controlProps15 = props.controlProps) === null || _props$controlProps15 === void 0 || _props$controlProps15.onAudioCallClick();
     }
   }, []);
   useEffect(() => {
     const declineCallShortcut = e => e.ctrlKey && e.shiftKey && e.key === KeyCodes.DeclineCallHotKey;
-
     const acceptAudioCallShortcut = e => e.ctrlKey && e.shiftKey && e.key === KeyCodes.AcceptAudioCallHotKey;
-
     const acceptVideoCallShortcut = e => e.ctrlKey && e.shiftKey && e.key === KeyCodes.AcceptVideoCallHotKey;
-
     const shortcutKeysHandler = e => {
       if (declineCallShortcut(e)) {
         handleDeclineCallClick();
@@ -100,13 +88,11 @@ function IncomingCall(props) {
         handleVideoCallClick();
       }
     };
-
     const ignoreDefault = e => {
       if (declineCallShortcut(e) || acceptAudioCallShortcut(e) || acceptVideoCallShortcut(e)) {
         e.preventDefault();
       }
     };
-
     window.addEventListener("keyup", shortcutKeysHandler);
     window.addEventListener("keydown", ignoreDefault);
     return () => {
@@ -119,7 +105,6 @@ function IncomingCall(props) {
     if (declineCallButtonId) {
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
       const declineCallButton = document.getElementById(declineCallButtonId);
-
       if (declineCallButton) {
         declineCallButton.focus();
       }
@@ -127,10 +112,10 @@ function IncomingCall(props) {
   }, []);
   return /*#__PURE__*/React.createElement(Stack, {
     horizontal: true,
-    className: (_props$styleProps10 = props.styleProps) === null || _props$styleProps10 === void 0 ? void 0 : _props$styleProps10.className,
+    className: (_props$styleProps0 = props.styleProps) === null || _props$styleProps0 === void 0 ? void 0 : _props$styleProps0.className,
     horizontalAlign: "space-between",
     styles: stackStyles,
-    dir: ((_props$controlProps18 = props.controlProps) === null || _props$controlProps18 === void 0 ? void 0 : _props$controlProps18.dir) ?? ((_defaultIncomingCallP27 = defaultIncomingCallProps.controlProps) === null || _defaultIncomingCallP27 === void 0 ? void 0 : _defaultIncomingCallP27.dir),
+    dir: ((_props$controlProps16 = props.controlProps) === null || _props$controlProps16 === void 0 ? void 0 : _props$controlProps16.dir) ?? ((_defaultIncomingCallP19 = defaultIncomingCallProps.controlProps) === null || _defaultIncomingCallP19 === void 0 ? void 0 : _defaultIncomingCallP19.dir),
     role: "alert",
     "aria-label": incomingCallTitleProps === null || incomingCallTitleProps === void 0 ? void 0 : incomingCallTitleProps.text
   }, /*#__PURE__*/React.createElement(Stack, {
@@ -138,35 +123,35 @@ function IncomingCall(props) {
     id: Ids.IncomingCallLeftGroupId,
     verticalAlign: "center",
     tokens: leftGroupStackTokens
-  }, !((_props$controlProps19 = props.controlProps) !== null && _props$controlProps19 !== void 0 && _props$controlProps19.hideIncomingCallTitle) && (decodeComponentString((_props$componentOverr = props.componentOverrides) === null || _props$componentOverr === void 0 ? void 0 : _props$componentOverr.incomingCallTitle) || /*#__PURE__*/React.createElement(Label, _extends({}, incomingCallTitleProps, {
+  }, !((_props$controlProps17 = props.controlProps) !== null && _props$controlProps17 !== void 0 && _props$controlProps17.hideIncomingCallTitle) && (decodeComponentString((_props$componentOverr = props.componentOverrides) === null || _props$componentOverr === void 0 ? void 0 : _props$componentOverr.incomingCallTitle) || /*#__PURE__*/React.createElement(Label, _extends({}, incomingCallTitleProps, {
     id: incomingCallId + "-title",
     tabIndex: -1,
     styles: incomingCallTitleStyles
-  }), incomingCallTitleProps === null || incomingCallTitleProps === void 0 ? void 0 : incomingCallTitleProps.text)), processCustomComponents((_props$controlProps20 = props.controlProps) === null || _props$controlProps20 === void 0 ? void 0 : (_props$controlProps21 = _props$controlProps20.leftGroup) === null || _props$controlProps21 === void 0 ? void 0 : _props$controlProps21.children)), /*#__PURE__*/React.createElement(Stack, {
+  }), incomingCallTitleProps === null || incomingCallTitleProps === void 0 ? void 0 : incomingCallTitleProps.text)), processCustomComponents((_props$controlProps18 = props.controlProps) === null || _props$controlProps18 === void 0 || (_props$controlProps18 = _props$controlProps18.leftGroup) === null || _props$controlProps18 === void 0 ? void 0 : _props$controlProps18.children)), /*#__PURE__*/React.createElement(Stack, {
     horizontal: true,
     id: Ids.IncomingCallMiddleGroupId,
     verticalAlign: "center",
     tokens: middleGroupStackTokens
-  }, processCustomComponents((_props$controlProps22 = props.controlProps) === null || _props$controlProps22 === void 0 ? void 0 : (_props$controlProps23 = _props$controlProps22.middleGroup) === null || _props$controlProps23 === void 0 ? void 0 : _props$controlProps23.children)), /*#__PURE__*/React.createElement(Stack, {
+  }, processCustomComponents((_props$controlProps19 = props.controlProps) === null || _props$controlProps19 === void 0 || (_props$controlProps19 = _props$controlProps19.middleGroup) === null || _props$controlProps19 === void 0 ? void 0 : _props$controlProps19.children)), /*#__PURE__*/React.createElement(Stack, {
     horizontal: true,
     id: Ids.IncomingCallRightGroupId,
     verticalAlign: "center",
     tokens: rightGroupStackTokens
-  }, processCustomComponents((_props$controlProps24 = props.controlProps) === null || _props$controlProps24 === void 0 ? void 0 : (_props$controlProps25 = _props$controlProps24.rightGroup) === null || _props$controlProps25 === void 0 ? void 0 : _props$controlProps25.children), !((_props$controlProps26 = props.controlProps) !== null && _props$controlProps26 !== void 0 && _props$controlProps26.hideDeclineCall) && /*#__PURE__*/React.createElement(CommandButton, _extends({}, declineCallButtonProps, {
+  }, processCustomComponents((_props$controlProps20 = props.controlProps) === null || _props$controlProps20 === void 0 || (_props$controlProps20 = _props$controlProps20.rightGroup) === null || _props$controlProps20 === void 0 ? void 0 : _props$controlProps20.children), !((_props$controlProps21 = props.controlProps) !== null && _props$controlProps21 !== void 0 && _props$controlProps21.hideDeclineCall) && /*#__PURE__*/React.createElement(CommandButton, _extends({}, declineCallButtonProps, {
     onClick: handleDeclineCallClick,
     id: declineCallButtonId,
     styles: declineCallButtonStyles,
     hoverStyles: declineCallButtonHoverStyles,
     focusStyles: incomingCallItemFocusStyles,
     customEvent: declineCustomEvent
-  })), !((_props$controlProps27 = props.controlProps) !== null && _props$controlProps27 !== void 0 && _props$controlProps27.hideVideoCall) && /*#__PURE__*/React.createElement(CommandButton, _extends({}, videoCallButtonProps, {
+  })), !((_props$controlProps22 = props.controlProps) !== null && _props$controlProps22 !== void 0 && _props$controlProps22.hideVideoCall) && /*#__PURE__*/React.createElement(CommandButton, _extends({}, videoCallButtonProps, {
     onClick: handleVideoCallClick,
     id: videoCallButtonId,
     styles: videoCallButtonStyles,
     hoverStyles: videoCallButtonHoverStyles,
     focusStyles: incomingCallItemFocusStyles,
     customEvent: videoCustomEvent
-  })), !((_props$controlProps28 = props.controlProps) !== null && _props$controlProps28 !== void 0 && _props$controlProps28.hideAudioCall) && /*#__PURE__*/React.createElement(CommandButton, _extends({}, audioCallButtonProps, {
+  })), !((_props$controlProps23 = props.controlProps) !== null && _props$controlProps23 !== void 0 && _props$controlProps23.hideAudioCall) && /*#__PURE__*/React.createElement(CommandButton, _extends({}, audioCallButtonProps, {
     onClick: handleAudioCallClick,
     id: audioCallButtonId,
     styles: audioCallButtonStyles,
@@ -175,5 +160,4 @@ function IncomingCall(props) {
     customEvent: audioCustomEvent
   }))));
 }
-
 export default IncomingCall;

package/lib/esm/components/callingcontainer/subcomponents/Timer/Timer.js

@@ -1,7 +1,6 @@
 import { Label } from "@fluentui/react";
 import React, { useEffect, useState } from "react";
 import { getHours, getMinutes, getSeconds } from "../../../../common/utils";
-
 function Timer(props) {
   const [time, setTime] = useState(0);
   const running = true;
@@ -18,5 +17,4 @@ function Timer(props) {
     styles: timerStyles
   }, props.showHours && getHours(time) + ":", getMinutes(time), ":", getSeconds(time));
 }
-
 export default Timer;

package/lib/esm/components/chatbutton/ChatButton.js

@@ -10,48 +10,39 @@ import { defaultChatButtonNotificationBubbleStyles } from "./common/defaultStyle
 import { defaultChatButtonSubTitleStyles } from "./common/defaultStyles/defaultChatButtonSubTitleStyles";
 import { defaultChatButtonTextContainerStyles } from "./common/defaultStyles/defaultChatButtonTextContainerStyles";
 import { defaultChatButtonTitleStyles } from "./common/defaultStyles/defaultChatButtonTitleStyles";
-
 function NotificationBubble(props, parentId) {
   var _props$styleProps, _props$controlProps;
-
   const notificationBubbleStyles = {
     root: Object.assign({}, defaultChatButtonNotificationBubbleStyles, (_props$styleProps = props.styleProps) === null || _props$styleProps === void 0 ? void 0 : _props$styleProps.notificationBubbleStyleProps)
   };
   const unreadMessageCount = ((_props$controlProps = props.controlProps) === null || _props$controlProps === void 0 ? void 0 : _props$controlProps.unreadMessageCount) ?? (defaultChatButtonControlProps === null || defaultChatButtonControlProps === void 0 ? void 0 : defaultChatButtonControlProps.unreadMessageCount);
-
   if (unreadMessageCount !== "0") {
-    var _props$componentOverr, _props$controlProps2, _props$controlProps3, _props$styleProps2, _props$styleProps2$cl, _props$controlProps4, _props$controlProps5;
-
+    var _props$componentOverr, _props$controlProps2, _props$controlProps3, _props$styleProps2, _props$controlProps4, _props$controlProps5;
     return decodeComponentString((_props$componentOverr = props.componentOverrides) === null || _props$componentOverr === void 0 ? void 0 : _props$componentOverr.notificationBubble) || /*#__PURE__*/React.createElement(Stack, {
       "aria-live": "polite",
       styles: notificationBubbleStyles,
       "aria-label": (_props$controlProps2 = props.controlProps) !== null && _props$controlProps2 !== void 0 && _props$controlProps2.ariaLabelUnreadMessageString ? (_props$controlProps3 = props.controlProps) === null || _props$controlProps3 === void 0 ? void 0 : _props$controlProps3.ariaLabelUnreadMessageString : defaultChatButtonControlProps.ariaLabelUnreadMessageString,
-      className: (_props$styleProps2 = props.styleProps) === null || _props$styleProps2 === void 0 ? void 0 : (_props$styleProps2$cl = _props$styleProps2.classNames) === null || _props$styleProps2$cl === void 0 ? void 0 : _props$styleProps2$cl.notificationBubbleClassName,
+      className: (_props$styleProps2 = props.styleProps) === null || _props$styleProps2 === void 0 || (_props$styleProps2 = _props$styleProps2.classNames) === null || _props$styleProps2 === void 0 ? void 0 : _props$styleProps2.notificationBubbleClassName,
       id: parentId + "-notification-bubble"
     }, unreadMessageCount, /*#__PURE__*/React.createElement("span", {
       style: HiddenTextStyles
     }, (_props$controlProps4 = props.controlProps) !== null && _props$controlProps4 !== void 0 && _props$controlProps4.unreadMessageString ? (_props$controlProps5 = props.controlProps) === null || _props$controlProps5 === void 0 ? void 0 : _props$controlProps5.unreadMessageString : defaultChatButtonControlProps.unreadMessageString));
   }
-
   return null;
 }
-
 function IconContainer(props, parentId) {
-  var _props$styleProps3, _props$componentOverr2, _props$styleProps4, _props$styleProps4$cl;
-
+  var _props$styleProps3, _props$componentOverr2, _props$styleProps4;
   const iconContainerStyles = {
     root: Object.assign({}, defaultChatButtonIconContainerStyles, (_props$styleProps3 = props.styleProps) === null || _props$styleProps3 === void 0 ? void 0 : _props$styleProps3.iconStyleProps)
   };
   return decodeComponentString((_props$componentOverr2 = props.componentOverrides) === null || _props$componentOverr2 === void 0 ? void 0 : _props$componentOverr2.iconContainer) || /*#__PURE__*/React.createElement(Icon, {
-    className: (_props$styleProps4 = props.styleProps) === null || _props$styleProps4 === void 0 ? void 0 : (_props$styleProps4$cl = _props$styleProps4.classNames) === null || _props$styleProps4$cl === void 0 ? void 0 : _props$styleProps4$cl.iconContainerClassName,
+    className: (_props$styleProps4 = props.styleProps) === null || _props$styleProps4 === void 0 || (_props$styleProps4 = _props$styleProps4.classNames) === null || _props$styleProps4 === void 0 ? void 0 : _props$styleProps4.iconContainerClassName,
     styles: iconContainerStyles,
     id: parentId + "-icon-container"
   });
 }
-
 function TextContainer(props, parentId) {
-  var _props$styleProps5, _props$styleProps6, _props$styleProps7, _props$controlProps6, _props$controlProps7, _props$controlProps8, _props$controlProps9, _props$controlProps10, _props$controlProps11, _props$componentOverr3, _props$styleProps8, _props$styleProps8$cl, _props$componentOverr4, _props$styleProps9, _props$styleProps9$cl, _props$componentOverr5, _props$styleProps10, _props$styleProps10$c;
-
+  var _props$styleProps5, _props$styleProps6, _props$styleProps7, _props$controlProps6, _props$controlProps7, _props$controlProps8, _props$controlProps9, _props$controlProps0, _props$controlProps1, _props$componentOverr3, _props$styleProps8, _props$componentOverr4, _props$styleProps9, _props$componentOverr5, _props$styleProps0;
   const textContainerStyles = {
     root: Object.assign({}, defaultChatButtonTextContainerStyles, (_props$styleProps5 = props.styleProps) === null || _props$styleProps5 === void 0 ? void 0 : _props$styleProps5.textContainerStyleProps)
   };
@@ -65,43 +56,40 @@ function TextContainer(props, parentId) {
   const hideChatSubtitle = ((_props$controlProps7 = props.controlProps) === null || _props$controlProps7 === void 0 ? void 0 : _props$controlProps7.hideChatSubtitle) ?? (defaultChatButtonControlProps === null || defaultChatButtonControlProps === void 0 ? void 0 : defaultChatButtonControlProps.hideChatSubtitle);
   const titleDir = ((_props$controlProps8 = props.controlProps) === null || _props$controlProps8 === void 0 ? void 0 : _props$controlProps8.dir) ?? (defaultChatButtonControlProps === null || defaultChatButtonControlProps === void 0 ? void 0 : defaultChatButtonControlProps.dir);
   const titleText = ((_props$controlProps9 = props.controlProps) === null || _props$controlProps9 === void 0 ? void 0 : _props$controlProps9.titleText) ?? (defaultChatButtonControlProps === null || defaultChatButtonControlProps === void 0 ? void 0 : defaultChatButtonControlProps.titleText);
-  const subtitleDir = ((_props$controlProps10 = props.controlProps) === null || _props$controlProps10 === void 0 ? void 0 : _props$controlProps10.dir) ?? (defaultChatButtonControlProps === null || defaultChatButtonControlProps === void 0 ? void 0 : defaultChatButtonControlProps.dir);
-  const subtitleText = ((_props$controlProps11 = props.controlProps) === null || _props$controlProps11 === void 0 ? void 0 : _props$controlProps11.subtitleText) ?? (defaultChatButtonControlProps === null || defaultChatButtonControlProps === void 0 ? void 0 : defaultChatButtonControlProps.subtitleText);
+  const subtitleDir = ((_props$controlProps0 = props.controlProps) === null || _props$controlProps0 === void 0 ? void 0 : _props$controlProps0.dir) ?? (defaultChatButtonControlProps === null || defaultChatButtonControlProps === void 0 ? void 0 : defaultChatButtonControlProps.dir);
+  const subtitleText = ((_props$controlProps1 = props.controlProps) === null || _props$controlProps1 === void 0 ? void 0 : _props$controlProps1.subtitleText) ?? (defaultChatButtonControlProps === null || defaultChatButtonControlProps === void 0 ? void 0 : defaultChatButtonControlProps.subtitleText);
   return decodeComponentString((_props$componentOverr3 = props.componentOverrides) === null || _props$componentOverr3 === void 0 ? void 0 : _props$componentOverr3.textContainer) || /*#__PURE__*/React.createElement(Stack, {
     styles: textContainerStyles,
-    className: (_props$styleProps8 = props.styleProps) === null || _props$styleProps8 === void 0 ? void 0 : (_props$styleProps8$cl = _props$styleProps8.classNames) === null || _props$styleProps8$cl === void 0 ? void 0 : _props$styleProps8$cl.textContainerClassName,
+    className: (_props$styleProps8 = props.styleProps) === null || _props$styleProps8 === void 0 || (_props$styleProps8 = _props$styleProps8.classNames) === null || _props$styleProps8 === void 0 ? void 0 : _props$styleProps8.textContainerClassName,
     id: parentId + "-text-container"
   }, !hideChatTitle && (decodeComponentString((_props$componentOverr4 = props.componentOverrides) === null || _props$componentOverr4 === void 0 ? void 0 : _props$componentOverr4.title) || /*#__PURE__*/React.createElement(Label, {
     styles: titleStyles,
     dir: titleDir,
-    className: (_props$styleProps9 = props.styleProps) === null || _props$styleProps9 === void 0 ? void 0 : (_props$styleProps9$cl = _props$styleProps9.classNames) === null || _props$styleProps9$cl === void 0 ? void 0 : _props$styleProps9$cl.titleClassName,
+    className: (_props$styleProps9 = props.styleProps) === null || _props$styleProps9 === void 0 || (_props$styleProps9 = _props$styleProps9.classNames) === null || _props$styleProps9 === void 0 ? void 0 : _props$styleProps9.titleClassName,
     id: parentId + "-title"
   }, titleText)), !hideChatSubtitle && (decodeComponentString((_props$componentOverr5 = props.componentOverrides) === null || _props$componentOverr5 === void 0 ? void 0 : _props$componentOverr5.subtitle) || /*#__PURE__*/React.createElement(Label, {
     styles: subtitleStyles,
     dir: subtitleDir,
-    className: (_props$styleProps10 = props.styleProps) === null || _props$styleProps10 === void 0 ? void 0 : (_props$styleProps10$c = _props$styleProps10.classNames) === null || _props$styleProps10$c === void 0 ? void 0 : _props$styleProps10$c.subtitleClassName,
+    className: (_props$styleProps0 = props.styleProps) === null || _props$styleProps0 === void 0 || (_props$styleProps0 = _props$styleProps0.classNames) === null || _props$styleProps0 === void 0 ? void 0 : _props$styleProps0.subtitleClassName,
     id: parentId + "-subtitle"
   }, subtitleText)));
 }
-
 function ChatButton(props) {
-  var _props$controlProps12, _props$controlProps13, _props$controlProps14, _props$controlProps15, _props$controlProps16, _props$controlProps17, _props$controlProps18, _props$controlProps19, _props$styleProps11;
-
-  const elementId = ((_props$controlProps12 = props.controlProps) === null || _props$controlProps12 === void 0 ? void 0 : _props$controlProps12.id) ?? Ids.DefaultChatButtonId;
-  const defaultAriaLabel = ((_props$controlProps13 = props.controlProps) === null || _props$controlProps13 === void 0 ? void 0 : _props$controlProps13.ariaLabel) ?? defaultChatButtonControlProps.ariaLabel;
-  const defaultRole = ((_props$controlProps14 = props.controlProps) === null || _props$controlProps14 === void 0 ? void 0 : _props$controlProps14.role) ?? (defaultChatButtonControlProps === null || defaultChatButtonControlProps === void 0 ? void 0 : defaultChatButtonControlProps.role);
-  const containersDir = ((_props$controlProps15 = props.controlProps) === null || _props$controlProps15 === void 0 ? void 0 : _props$controlProps15.dir) ?? (defaultChatButtonControlProps === null || defaultChatButtonControlProps === void 0 ? void 0 : defaultChatButtonControlProps.dir);
-  const hideChatButton = ((_props$controlProps16 = props.controlProps) === null || _props$controlProps16 === void 0 ? void 0 : _props$controlProps16.hideChatButton) ?? (defaultChatButtonControlProps === null || defaultChatButtonControlProps === void 0 ? void 0 : defaultChatButtonControlProps.hideChatButton);
-  const hideChatIcon = ((_props$controlProps17 = props.controlProps) === null || _props$controlProps17 === void 0 ? void 0 : _props$controlProps17.hideChatIcon) ?? (defaultChatButtonControlProps === null || defaultChatButtonControlProps === void 0 ? void 0 : defaultChatButtonControlProps.hideChatIcon);
-  const hideChatTextContainer = ((_props$controlProps18 = props.controlProps) === null || _props$controlProps18 === void 0 ? void 0 : _props$controlProps18.hideChatTextContainer) ?? (defaultChatButtonControlProps === null || defaultChatButtonControlProps === void 0 ? void 0 : defaultChatButtonControlProps.hideChatTextContainer);
-  const hideNotificationBubble = ((_props$controlProps19 = props.controlProps) === null || _props$controlProps19 === void 0 ? void 0 : _props$controlProps19.hideNotificationBubble) ?? (defaultChatButtonControlProps === null || defaultChatButtonControlProps === void 0 ? void 0 : defaultChatButtonControlProps.hideNotificationBubble);
+  var _props$controlProps10, _props$controlProps11, _props$controlProps12, _props$controlProps13, _props$controlProps14, _props$controlProps15, _props$controlProps16, _props$controlProps17, _props$styleProps1;
+  const elementId = ((_props$controlProps10 = props.controlProps) === null || _props$controlProps10 === void 0 ? void 0 : _props$controlProps10.id) ?? Ids.DefaultChatButtonId;
+  const defaultAriaLabel = ((_props$controlProps11 = props.controlProps) === null || _props$controlProps11 === void 0 ? void 0 : _props$controlProps11.ariaLabel) ?? defaultChatButtonControlProps.ariaLabel;
+  const defaultRole = ((_props$controlProps12 = props.controlProps) === null || _props$controlProps12 === void 0 ? void 0 : _props$controlProps12.role) ?? (defaultChatButtonControlProps === null || defaultChatButtonControlProps === void 0 ? void 0 : defaultChatButtonControlProps.role);
+  const containersDir = ((_props$controlProps13 = props.controlProps) === null || _props$controlProps13 === void 0 ? void 0 : _props$controlProps13.dir) ?? (defaultChatButtonControlProps === null || defaultChatButtonControlProps === void 0 ? void 0 : defaultChatButtonControlProps.dir);
+  const hideChatButton = ((_props$controlProps14 = props.controlProps) === null || _props$controlProps14 === void 0 ? void 0 : _props$controlProps14.hideChatButton) ?? (defaultChatButtonControlProps === null || defaultChatButtonControlProps === void 0 ? void 0 : defaultChatButtonControlProps.hideChatButton);
+  const hideChatIcon = ((_props$controlProps15 = props.controlProps) === null || _props$controlProps15 === void 0 ? void 0 : _props$controlProps15.hideChatIcon) ?? (defaultChatButtonControlProps === null || defaultChatButtonControlProps === void 0 ? void 0 : defaultChatButtonControlProps.hideChatIcon);
+  const hideChatTextContainer = ((_props$controlProps16 = props.controlProps) === null || _props$controlProps16 === void 0 ? void 0 : _props$controlProps16.hideChatTextContainer) ?? (defaultChatButtonControlProps === null || defaultChatButtonControlProps === void 0 ? void 0 : defaultChatButtonControlProps.hideChatTextContainer);
+  const hideNotificationBubble = ((_props$controlProps17 = props.controlProps) === null || _props$controlProps17 === void 0 ? void 0 : _props$controlProps17.hideNotificationBubble) ?? (defaultChatButtonControlProps === null || defaultChatButtonControlProps === void 0 ? void 0 : defaultChatButtonControlProps.hideNotificationBubble);
   const chatButtonGroupStyles = {
-    root: Object.assign({}, defaultChatButtonGeneralStyles, (_props$styleProps11 = props.styleProps) === null || _props$styleProps11 === void 0 ? void 0 : _props$styleProps11.generalStyleProps)
+    root: Object.assign({}, defaultChatButtonGeneralStyles, (_props$styleProps1 = props.styleProps) === null || _props$styleProps1 === void 0 ? void 0 : _props$styleProps1.generalStyleProps)
   };
   const handleInitiateChatClick = useCallback(() => {
-    var _props$controlProps20;
-
-    if ((_props$controlProps20 = props.controlProps) !== null && _props$controlProps20 !== void 0 && _props$controlProps20.onClick) {
+    var _props$controlProps18;
+    if ((_props$controlProps18 = props.controlProps) !== null && _props$controlProps18 !== void 0 && _props$controlProps18.onClick) {
       const customEvent = {
         elementType: ElementType.ChatButton,
         elementId: elementId,
@@ -110,14 +98,14 @@ function ChatButton(props) {
       BroadcastService.postMessage(customEvent);
       props.controlProps.onClick();
     }
-  }, []); // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  }, []);
 
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const handleInputKeyDown = e => {
     if (e.code === KeyCodes.ENTER || e.code === KeyCodes.SPACE) {
       handleInitiateChatClick();
     }
   };
-
   return /*#__PURE__*/React.createElement(React.Fragment, null, !hideChatButton && /*#__PURE__*/React.createElement(Stack, {
     horizontal: true,
     id: elementId,
@@ -130,5 +118,4 @@ function ChatButton(props) {
     "aria-label": defaultAriaLabel
   }, !hideChatIcon && IconContainer(props, elementId), !hideNotificationBubble && NotificationBubble(props, elementId), !hideChatTextContainer && TextContainer(props, elementId)));
 }
-
 export default ChatButton;

package/lib/esm/components/citationpane/CitationPane.js

@@ -13,24 +13,20 @@ import { defaultCitationPaneTitleStyles } from "./common/defaultStyles/defaultCi
 import { defaultCitationPaneTopCloseButtonFocusedStyles } from "./common/defaultStyles/defaultCitationPaneTopCloseButtonFocusedStyles";
 import { defaultCitationPaneTopCloseButtonHoveredStyles } from "./common/defaultStyles/defaultCitationPaneTopCloseButtonHoveredStyles";
 import { defaultCitationPaneTopCloseButtonStyles } from "./common/defaultStyles/defaultCitationPaneTopCloseButtonStyles";
-
 function CitationPane(props) {
-  var _props$controlProps, _props$styleProps, _props$styleProps2, _props$styleProps3, _props$styleProps4, _props$styleProps5, _props$styleProps6, _props$styleProps7, _props$controlProps4, _props$styleProps8, _props$styleProps9, _props$styleProps10, _props$styleProps11, _props$controlProps5, _props$styleProps12, _props$styleProps12$c, _props$controlProps6, _props$componentOverr, _props$controlProps7, _props$styleProps13, _props$styleProps13$c, _props$controlProps8, _props$componentOverr2, _props$styleProps14, _props$styleProps14$c, _props$controlProps9, _props$styleProps15, _props$styleProps15$c, _props$controlProps10, _props$controlProps11, _props$componentOverr3, _props$controlProps12, _props$controlProps13, _props$styleProps16, _props$styleProps16$c;
-
+  var _props$controlProps, _props$styleProps, _props$styleProps2, _props$styleProps3, _props$styleProps4, _props$styleProps5, _props$styleProps6, _props$styleProps7, _props$controlProps4, _props$styleProps8, _props$styleProps9, _props$styleProps0, _props$styleProps1, _props$controlProps5, _props$styleProps10, _props$controlProps6, _props$componentOverr, _props$controlProps7, _props$styleProps11, _props$controlProps8, _props$componentOverr2, _props$styleProps12, _props$controlProps9, _props$styleProps13, _props$controlProps0, _props$controlProps1, _props$componentOverr3, _props$controlProps10, _props$controlProps11, _props$styleProps14;
   const elementId = ((_props$controlProps = props.controlProps) === null || _props$controlProps === void 0 ? void 0 : _props$controlProps.id) ?? defaultCitationPaneControlProps.id;
   const handleClose = useCallback(() => {
     var _props$controlProps2;
-
     if ((_props$controlProps2 = props.controlProps) !== null && _props$controlProps2 !== void 0 && _props$controlProps2.onClose) {
       var _props$controlProps3;
-
       const customEvent = {
         elementType: ElementType.CitationPaneCloseButton,
         elementId: elementId + "-close",
         eventName: EventNames.OnClick
       };
       BroadcastService.postMessage(customEvent);
-      (_props$controlProps3 = props.controlProps) === null || _props$controlProps3 === void 0 ? void 0 : _props$controlProps3.onClose();
+      (_props$controlProps3 = props.controlProps) === null || _props$controlProps3 === void 0 || _props$controlProps3.onClose();
     }
   }, [props.controlProps, elementId]);
   const handleTopClose = useCallback(() => {
@@ -43,8 +39,9 @@ function CitationPane(props) {
       BroadcastService.postMessage(customEvent);
       handleClose();
     }
-  }, [props.controlProps, elementId]); // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  }, [props.controlProps, elementId]);
 
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const handleEscKeyDown = useCallback(e => {
     if (e.key === "Escape") {
       handleClose();
@@ -53,13 +50,13 @@ function CitationPane(props) {
   const containerStyles = {
     root: Object.assign({}, defaultCitationPaneGeneralStyles, (_props$styleProps = props.styleProps) === null || _props$styleProps === void 0 ? void 0 : _props$styleProps.generalStyleProps, {
       position: "relative" // Ensure container is positioned for absolute positioning of top close button
-
     })
   };
   const titleStyles = {
     root: Object.assign({}, defaultCitationPaneTitleStyles, (_props$styleProps2 = props.styleProps) === null || _props$styleProps2 === void 0 ? void 0 : _props$styleProps2.titleStyleProps)
   };
-  const contentStyles = { ...defaultCitationPaneContentStyles,
+  const contentStyles = {
+    ...defaultCitationPaneContentStyles,
     ...((_props$styleProps3 = props.styleProps) === null || _props$styleProps3 === void 0 ? void 0 : _props$styleProps3.contentStyleProps)
   };
   const closeButtonStyles = {
@@ -78,8 +75,8 @@ function CitationPane(props) {
       left: "auto"
     }),
     rootHovered: Object.assign({}, defaultCitationPaneTopCloseButtonHoveredStyles, (_props$styleProps9 = props.styleProps) === null || _props$styleProps9 === void 0 ? void 0 : _props$styleProps9.topCloseButtonHoveredStyleProps),
-    rootFocused: Object.assign({}, defaultCitationPaneTopCloseButtonFocusedStyles, (_props$styleProps10 = props.styleProps) === null || _props$styleProps10 === void 0 ? void 0 : _props$styleProps10.topCloseButtonFocusedStyleProps),
-    rootPressed: Object.assign({}, defaultCitationPaneTopCloseButtonHoveredStyles, (_props$styleProps11 = props.styleProps) === null || _props$styleProps11 === void 0 ? void 0 : _props$styleProps11.topCloseButtonHoveredStyleProps)
+    rootFocused: Object.assign({}, defaultCitationPaneTopCloseButtonFocusedStyles, (_props$styleProps0 = props.styleProps) === null || _props$styleProps0 === void 0 ? void 0 : _props$styleProps0.topCloseButtonFocusedStyleProps),
+    rootPressed: Object.assign({}, defaultCitationPaneTopCloseButtonHoveredStyles, (_props$styleProps1 = props.styleProps) === null || _props$styleProps1 === void 0 ? void 0 : _props$styleProps1.topCloseButtonHoveredStyleProps)
   };
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Stack, {
     id: elementId,
@@ -88,7 +85,7 @@ function CitationPane(props) {
     "aria-describedby": elementId + "-content",
     dir: ((_props$controlProps5 = props.controlProps) === null || _props$controlProps5 === void 0 ? void 0 : _props$controlProps5.dir) || defaultCitationPaneControlProps.dir,
     styles: containerStyles,
-    className: (_props$styleProps12 = props.styleProps) === null || _props$styleProps12 === void 0 ? void 0 : (_props$styleProps12$c = _props$styleProps12.classNames) === null || _props$styleProps12$c === void 0 ? void 0 : _props$styleProps12$c.containerClassName,
+    className: (_props$styleProps10 = props.styleProps) === null || _props$styleProps10 === void 0 || (_props$styleProps10 = _props$styleProps10.classNames) === null || _props$styleProps10 === void 0 ? void 0 : _props$styleProps10.containerClassName,
     onKeyDown: handleEscKeyDown,
     tabIndex: -1
   }, !((_props$controlProps6 = props.controlProps) !== null && _props$controlProps6 !== void 0 && _props$controlProps6.hideTopCloseButton) && (decodeComponentString((_props$componentOverr = props.componentOverrides) === null || _props$componentOverr === void 0 ? void 0 : _props$componentOverr.topCloseButton) || /*#__PURE__*/React.createElement(IconButton, {
@@ -99,26 +96,25 @@ function CitationPane(props) {
     },
     ariaLabel: ((_props$controlProps7 = props.controlProps) === null || _props$controlProps7 === void 0 ? void 0 : _props$controlProps7.topCloseButtonAriaLabel) || defaultCitationPaneControlProps.topCloseButtonAriaLabel,
     styles: topCloseButtonStyles,
-    className: (_props$styleProps13 = props.styleProps) === null || _props$styleProps13 === void 0 ? void 0 : (_props$styleProps13$c = _props$styleProps13.classNames) === null || _props$styleProps13$c === void 0 ? void 0 : _props$styleProps13$c.topCloseButtonClassName
+    className: (_props$styleProps11 = props.styleProps) === null || _props$styleProps11 === void 0 || (_props$styleProps11 = _props$styleProps11.classNames) === null || _props$styleProps11 === void 0 ? void 0 : _props$styleProps11.topCloseButtonClassName
   })), !((_props$controlProps8 = props.controlProps) !== null && _props$controlProps8 !== void 0 && _props$controlProps8.hideTitle) && (decodeComponentString((_props$componentOverr2 = props.componentOverrides) === null || _props$componentOverr2 === void 0 ? void 0 : _props$componentOverr2.title) || /*#__PURE__*/React.createElement(Label, {
     id: elementId + "-title",
     styles: titleStyles,
-    className: (_props$styleProps14 = props.styleProps) === null || _props$styleProps14 === void 0 ? void 0 : (_props$styleProps14$c = _props$styleProps14.classNames) === null || _props$styleProps14$c === void 0 ? void 0 : _props$styleProps14$c.titleClassName
+    className: (_props$styleProps12 = props.styleProps) === null || _props$styleProps12 === void 0 || (_props$styleProps12 = _props$styleProps12.classNames) === null || _props$styleProps12 === void 0 ? void 0 : _props$styleProps12.titleClassName
   }, ((_props$controlProps9 = props.controlProps) === null || _props$controlProps9 === void 0 ? void 0 : _props$controlProps9.titleText) || defaultCitationPaneControlProps.titleText)), /*#__PURE__*/React.createElement("div", {
     id: elementId + "-content",
     style: contentStyles,
-    className: (_props$styleProps15 = props.styleProps) === null || _props$styleProps15 === void 0 ? void 0 : (_props$styleProps15$c = _props$styleProps15.classNames) === null || _props$styleProps15$c === void 0 ? void 0 : _props$styleProps15$c.contentClassName,
+    className: (_props$styleProps13 = props.styleProps) === null || _props$styleProps13 === void 0 || (_props$styleProps13 = _props$styleProps13.classNames) === null || _props$styleProps13 === void 0 ? void 0 : _props$styleProps13.contentClassName,
     dangerouslySetInnerHTML: {
-      __html: ((_props$controlProps10 = props.controlProps) === null || _props$controlProps10 === void 0 ? void 0 : _props$controlProps10.contentHtml) ?? ""
+      __html: ((_props$controlProps0 = props.controlProps) === null || _props$controlProps0 === void 0 ? void 0 : _props$controlProps0.contentHtml) ?? ""
     }
-  }), !((_props$controlProps11 = props.controlProps) !== null && _props$controlProps11 !== void 0 && _props$controlProps11.hideCloseButton) && (decodeComponentString((_props$componentOverr3 = props.componentOverrides) === null || _props$componentOverr3 === void 0 ? void 0 : _props$componentOverr3.closeButton) || /*#__PURE__*/React.createElement(DefaultButton, {
+  }), !((_props$controlProps1 = props.controlProps) !== null && _props$controlProps1 !== void 0 && _props$controlProps1.hideCloseButton) && (decodeComponentString((_props$componentOverr3 = props.componentOverrides) === null || _props$componentOverr3 === void 0 ? void 0 : _props$componentOverr3.closeButton) || /*#__PURE__*/React.createElement(DefaultButton, {
     onClick: handleClose,
     id: elementId + "-close",
-    text: ((_props$controlProps12 = props.controlProps) === null || _props$controlProps12 === void 0 ? void 0 : _props$controlProps12.closeButtonText) || defaultCitationPaneControlProps.closeButtonText,
-    ariaLabel: ((_props$controlProps13 = props.controlProps) === null || _props$controlProps13 === void 0 ? void 0 : _props$controlProps13.closeButtonAriaLabel) || defaultCitationPaneControlProps.closeButtonAriaLabel,
+    text: ((_props$controlProps10 = props.controlProps) === null || _props$controlProps10 === void 0 ? void 0 : _props$controlProps10.closeButtonText) || defaultCitationPaneControlProps.closeButtonText,
+    ariaLabel: ((_props$controlProps11 = props.controlProps) === null || _props$controlProps11 === void 0 ? void 0 : _props$controlProps11.closeButtonAriaLabel) || defaultCitationPaneControlProps.closeButtonAriaLabel,
     styles: closeButtonStyles,
-    className: (_props$styleProps16 = props.styleProps) === null || _props$styleProps16 === void 0 ? void 0 : (_props$styleProps16$c = _props$styleProps16.classNames) === null || _props$styleProps16$c === void 0 ? void 0 : _props$styleProps16$c.closeButtonClassName
+    className: (_props$styleProps14 = props.styleProps) === null || _props$styleProps14 === void 0 || (_props$styleProps14 = _props$styleProps14.classNames) === null || _props$styleProps14 === void 0 ? void 0 : _props$styleProps14.closeButtonClassName
   }))));
 }
-
 export default CitationPane;

package/lib/esm/components/citationpane/ScalingTest.js

@@ -1,10 +1,10 @@
 import CitationPane from "./CitationPane";
 import React from "react";
+
 /**
  * Test component to verify CitationPane scaling behavior at different zoom levels
  * This demonstrates how the component responds to 50% to 400% view sizes
  */
-
 export const CitationPaneScalingTest = () => {
   const baseProps = {
     controlProps: {

package/lib/esm/components/citationpane/common/defaultStyles/defaultCitationPaneCloseButtonStyles.js

@@ -21,7 +21,6 @@ export const defaultCitationPaneCloseButtonStyles = {
   // Responsive hiding at high zoom levels for better content space
   "@media (min-resolution: 2.5dppx), (min-resolution: 240dpi)": {
     display: "none" // Hide at 250%+ zoom to preserve content space
-
   },
   selectors: {
     ":hover": {
@@ -32,7 +31,6 @@ export const defaultCitationPaneCloseButtonStyles = {
       outline: "0.125em solid #0078d4",
       // Scalable outline
       outlineOffset: "0.125em" // Scalable offset
-
     },
     ":active": {
       backgroundColor: "#d2d0ce",

package/lib/esm/components/citationpane/common/defaultStyles/defaultCitationPaneContentStyles.js

@@ -10,5 +10,4 @@ export const defaultCitationPaneContentStyles = {
   overflow: "auto",
   // Enable scrolling for long content
   paddingRight: "0.125em" // Reduced padding to give more space for text at high zoom (scalable)
-
 };

package/lib/esm/components/citationpane/common/defaultStyles/defaultCitationPaneGeneralStyles.js

@@ -22,5 +22,4 @@ export const defaultCitationPaneGeneralStyles = {
   maxHeight: "30em",
   // Container-relative height instead of viewport-based
   overflow: "hidden" // Hide overflow on container, let content area handle scrolling
-
 };

package/lib/esm/components/citationpane/common/defaultStyles/defaultCitationPaneTopCloseButtonStyles.js

@@ -31,6 +31,5 @@ export const defaultCitationPaneTopCloseButtonStyles = {
     outline: "0.125em solid #605e5c",
     // Scalable outline
     outlineOffset: "0.125em" // Scalable offset
-
   }
 };