@azure/communication-react 1.7.0-alpha-202308020013 → 1.7.0-alpha-202308040014

package/dist/dist-cjs/communication-react/index.js

@@ -6,7 +6,6 @@ var communicationCommon = require('@azure/communication-common');
 var reselect = require('reselect');
 var communicationCalling = require('@azure/communication-calling');
 var memoizeOne = require('memoize-one');
-var communicationCallingEffects = require('@azure/communication-calling-effects');
 var logger = require('@azure/logger');
 var EventEmitter = require('events');
 var produce = require('immer');
@@ -27,6 +26,7 @@ var reactWindowProvider = require('@fluentui/react-window-provider');
 var copy = require('copy-to-clipboard');
 var communicationChat = require('@azure/communication-chat');
 var nanoid = require('nanoid');
+var communicationCallingEffects = require('@azure/communication-calling-effects');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -178,7 +178,7 @@ const _isValidIdentifier = (identifier) => {
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
 // GENERATED FILE. DO NOT EDIT MANUALLY.
-var telemetryVersion = '1.7.0-alpha-202308020013';
+var telemetryVersion = '1.7.0-alpha-202308040014';
 
 // Copyright (c) Microsoft Corporation.
 /**
@@ -454,7 +454,7 @@ const getSupportedSpokenLanguages = (state, props) => {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$J = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$L = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -493,7 +493,7 @@ const _isPreviewOn = (deviceManager) => {
  *
  * @private
  */
-const disposeAllLocalPreviewViews = (callClient) => __awaiter$J(void 0, void 0, void 0, function* () {
+const disposeAllLocalPreviewViews = (callClient) => __awaiter$L(void 0, void 0, void 0, function* () {
     const unparentedViews = callClient.getState().deviceManager.unparentedViews;
     for (const view of unparentedViews) {
         yield callClient.disposeView(undefined, undefined, view);
@@ -548,10 +548,19 @@ const _isRingingPSTNParticipant = (participant) => {
  *
  * @public
  */
-const microphoneButtonSelector = reselect__namespace.createSelector([getCallExists, getIsMuted, getDeviceManager$1, /* @conditional-compile-remove(capabilities) */ getCapabilites], (callExists, isMuted, deviceManager, /* @conditional-compile-remove(capabilities) */ capabilities) => {
+const microphoneButtonSelector = reselect__namespace.createSelector([
+    getCallExists,
+    getIsMuted,
+    getDeviceManager$1,
+    /* @conditional-compile-remove(capabilities) */ getCapabilites,
+    /* @conditional-compile-remove(capabilities) */ getRole
+], (callExists, isMuted, deviceManager, 
+/* @conditional-compile-remove(capabilities) */ capabilities, 
+/* @conditional-compile-remove(capabilities) */ role) => {
     const permission = deviceManager.deviceAccess ? deviceManager.deviceAccess.audio : true;
     /* @conditional-compile-remove(capabilities) */
-    const incapable = (capabilities === null || capabilities === void 0 ? void 0 : capabilities.muteUnmuteMic.isPresent) === false;
+    const incapable = ((capabilities === null || capabilities === void 0 ? void 0 : capabilities.muteUnmuteMic.isPresent) === false && (capabilities === null || capabilities === void 0 ? void 0 : capabilities.muteUnmuteMic.reason) !== 'NotInitialized') ||
+        role === 'Consumer';
     return {
         disabled: !callExists || !permission || /* @conditional-compile-remove(capabilities) */ incapable,
         checked: callExists ? !isMuted : false,
@@ -566,12 +575,23 @@ const microphoneButtonSelector = reselect__namespace.createSelector([getCallExis
  *
  * @public
  */
-const cameraButtonSelector = reselect__namespace.createSelector([getLocalVideoStreams$1, getDeviceManager$1, /* @conditional-compile-remove(capabilities) */ getCapabilites], (localVideoStreams, deviceManager, /* @conditional-compile-remove(capabilities) */ capabilities) => {
+const cameraButtonSelector = reselect__namespace.createSelector([
+    getLocalVideoStreams$1,
+    getDeviceManager$1,
+    /* @conditional-compile-remove(capabilities) */ getCapabilites,
+    /* @conditional-compile-remove(capabilities) */ getRole
+], (localVideoStreams, deviceManager, 
+/* @conditional-compile-remove(capabilities) */ capabilities, 
+/* @conditional-compile-remove(capabilities) */ role) => {
     const previewOn = _isPreviewOn(deviceManager);
     const localVideoFromCall = localVideoStreams === null || localVideoStreams === void 0 ? void 0 : localVideoStreams.find((stream) => stream.mediaStreamType === 'Video');
     const permission = deviceManager.deviceAccess ? deviceManager.deviceAccess.video : true;
     /* @conditional-compile-remove(capabilities) */
-    const incapable = (capabilities === null || capabilities === void 0 ? void 0 : capabilities.turnVideoOnOff.isPresent) === false;
+    const incapable = ((capabilities === null || capabilities === void 0 ? void 0 : capabilities.turnVideoOnOff.isPresent) === false &&
+        (capabilities === null || capabilities === void 0 ? void 0 : capabilities.turnVideoOnOff.reason) !== 'NotInitialized' &&
+        /* TODO: Remove this when Calling SDK fixes bug that sets capabilities.turnVideoOnOff to be MeetingRestricted by default */
+        (capabilities === null || capabilities === void 0 ? void 0 : capabilities.turnVideoOnOff.reason) !== 'MeetingRestricted') ||
+        role === 'Consumer';
     return {
         disabled: !deviceManager.selectedCamera ||
             !permission ||
@@ -590,13 +610,19 @@ const cameraButtonSelector = reselect__namespace.createSelector([getLocalVideoSt
 const screenShareButtonSelector = reselect__namespace.createSelector([
     getIsScreenSharingOn,
     /* @conditional-compile-remove(PSTN-calls) */ getCallState,
-    /* @conditional-compile-remove(capabilities) */ getCapabilites
+    /* @conditional-compile-remove(capabilities) */ getCapabilites,
+    /* @conditional-compile-remove(capabilities) */ getRole
 ], (isScreenSharingOn, 
 /* @conditional-compile-remove(PSTN-calls) */ callState, 
-/* @conditional-compile-remove(capabilities) */ capabilities) => {
+/* @conditional-compile-remove(capabilities) */ capabilities, 
+/* @conditional-compile-remove(capabilities) */ role) => {
     let disabled = undefined;
     /* @conditional-compile-remove(capabilities) */
-    disabled = disabled || (capabilities === null || capabilities === void 0 ? void 0 : capabilities.shareScreen.isPresent) === false;
+    disabled =
+        disabled ||
+            ((capabilities === null || capabilities === void 0 ? void 0 : capabilities.shareScreen.isPresent) === false && (capabilities === null || capabilities === void 0 ? void 0 : capabilities.shareScreen.reason) !== 'NotInitialized') ||
+            role === 'Consumer' ||
+            role === 'Attendee';
     /* @conditional-compile-remove(PSTN-calls) */
     disabled = disabled || ['InLobby', 'Connecting'].includes(callState);
     return {
@@ -635,7 +661,7 @@ const holdButtonSelector = reselect__namespace.createSelector([getCallState], (c
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$I = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$K = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -655,8 +681,8 @@ const areStreamsEqual = (prevStream, newStream) => {
  *
  * @private
  */
-const createDefaultCommonCallingHandlers = memoizeOne__default['default']((callClient, deviceManager, call) => {
-    const onStartLocalVideo = () => __awaiter$I(void 0, void 0, void 0, function* () {
+const createDefaultCommonCallingHandlers = memoizeOne__default['default']((callClient, deviceManager, call, options) => {
+    const onStartLocalVideo = () => __awaiter$K(void 0, void 0, void 0, function* () {
         // Before the call object creates a stream, dispose of any local preview streams.
         // @TODO: is there any way to parent the unparented view to the call object instead
         // of disposing and creating a new stream?
@@ -676,7 +702,7 @@ const createDefaultCommonCallingHandlers = memoizeOne__default['default']((callC
             yield call.startVideo(stream);
         }
     });
-    const onStopLocalVideo = (stream) => __awaiter$I(void 0, void 0, void 0, function* () {
+    const onStopLocalVideo = (stream) => __awaiter$K(void 0, void 0, void 0, function* () {
         const callId = call === null || call === void 0 ? void 0 : call.id;
         if (!callId) {
             return;
@@ -685,7 +711,7 @@ const createDefaultCommonCallingHandlers = memoizeOne__default['default']((callC
             yield call.stopVideo(stream);
         }
     });
-    const onToggleCamera = (options) => __awaiter$I(void 0, void 0, void 0, function* () {
+    const onToggleCamera = (options) => __awaiter$K(void 0, void 0, void 0, function* () {
         const previewOn = _isPreviewOn(callClient.getState().deviceManager);
         if (previewOn && call && call.state === 'Connecting') {
             // This is to workaround: https://skype.visualstudio.com/SPOOL/_workitems/edit/3030558.
@@ -733,19 +759,19 @@ const createDefaultCommonCallingHandlers = memoizeOne__default['default']((callC
             }
         }
     });
-    const onSelectMicrophone = (device) => __awaiter$I(void 0, void 0, void 0, function* () {
+    const onSelectMicrophone = (device) => __awaiter$K(void 0, void 0, void 0, function* () {
         if (!deviceManager) {
             return;
         }
         return deviceManager.selectMicrophone(device);
     });
-    const onSelectSpeaker = (device) => __awaiter$I(void 0, void 0, void 0, function* () {
+    const onSelectSpeaker = (device) => __awaiter$K(void 0, void 0, void 0, function* () {
         if (!deviceManager) {
             return;
         }
         return deviceManager.selectSpeaker(device);
     });
-    const onSelectCamera = (device, options) => __awaiter$I(void 0, void 0, void 0, function* () {
+    const onSelectCamera = (device, options) => __awaiter$K(void 0, void 0, void 0, function* () {
         if (!deviceManager) {
             return;
         }
@@ -768,19 +794,19 @@ const createDefaultCommonCallingHandlers = memoizeOne__default['default']((callC
             }, options);
         }
     });
-    const onToggleMicrophone = () => __awaiter$I(void 0, void 0, void 0, function* () {
+    const onToggleMicrophone = () => __awaiter$K(void 0, void 0, void 0, function* () {
         if (!call || !_isInCall(call.state)) {
             throw new Error(`Please invoke onToggleMicrophone after call is started`);
         }
         return call.isMuted ? yield call.unmute() : yield call.mute();
     });
-    const onStartScreenShare = () => __awaiter$I(void 0, void 0, void 0, function* () { return yield (call === null || call === void 0 ? void 0 : call.startScreenSharing()); });
-    const onStopScreenShare = () => __awaiter$I(void 0, void 0, void 0, function* () { return yield (call === null || call === void 0 ? void 0 : call.stopScreenSharing()); });
-    const onToggleScreenShare = () => __awaiter$I(void 0, void 0, void 0, function* () { return (call === null || call === void 0 ? void 0 : call.isScreenSharingOn) ? yield onStopScreenShare() : yield onStartScreenShare(); });
-    const onHangUp = (forEveryone) => __awaiter$I(void 0, void 0, void 0, function* () { return yield (call === null || call === void 0 ? void 0 : call.hangUp({ forEveryone: forEveryone === true ? true : false })); });
+    const onStartScreenShare = () => __awaiter$K(void 0, void 0, void 0, function* () { return yield (call === null || call === void 0 ? void 0 : call.startScreenSharing()); });
+    const onStopScreenShare = () => __awaiter$K(void 0, void 0, void 0, function* () { return yield (call === null || call === void 0 ? void 0 : call.stopScreenSharing()); });
+    const onToggleScreenShare = () => __awaiter$K(void 0, void 0, void 0, function* () { return (call === null || call === void 0 ? void 0 : call.isScreenSharingOn) ? yield onStopScreenShare() : yield onStartScreenShare(); });
+    const onHangUp = (forEveryone) => __awaiter$K(void 0, void 0, void 0, function* () { return yield (call === null || call === void 0 ? void 0 : call.hangUp({ forEveryone: forEveryone === true ? true : false })); });
     /* @conditional-compile-remove(PSTN-calls) */
-    const onToggleHold = () => __awaiter$I(void 0, void 0, void 0, function* () { return (call === null || call === void 0 ? void 0 : call.state) === 'LocalHold' ? yield (call === null || call === void 0 ? void 0 : call.resume()) : yield (call === null || call === void 0 ? void 0 : call.hold()); });
-    const onCreateLocalStreamView = (options = { scalingMode: 'Crop', isMirrored: true }) => __awaiter$I(void 0, void 0, void 0, function* () {
+    const onToggleHold = () => __awaiter$K(void 0, void 0, void 0, function* () { return (call === null || call === void 0 ? void 0 : call.state) === 'LocalHold' ? yield (call === null || call === void 0 ? void 0 : call.resume()) : yield (call === null || call === void 0 ? void 0 : call.hold()); });
+    const onCreateLocalStreamView = (options = { scalingMode: 'Crop', isMirrored: true }) => __awaiter$K(void 0, void 0, void 0, function* () {
         var _a;
         if (!call || call.localVideoStreams.length === 0) {
             return;
@@ -796,7 +822,7 @@ const createDefaultCommonCallingHandlers = memoizeOne__default['default']((callC
         const { view } = (_a = (yield callClient.createView(call.id, undefined, localStream, options))) !== null && _a !== void 0 ? _a : {};
         return view ? { view } : undefined;
     });
-    const onCreateRemoteStreamView = (userId, options = { scalingMode: 'Crop' }) => __awaiter$I(void 0, void 0, void 0, function* () {
+    const onCreateRemoteStreamView = (userId, options = { scalingMode: 'Crop' }) => __awaiter$K(void 0, void 0, void 0, function* () {
         if (!call) {
             return;
         }
@@ -827,7 +853,7 @@ const createDefaultCommonCallingHandlers = memoizeOne__default['default']((callC
         }
         return (createViewResult === null || createViewResult === void 0 ? void 0 : createViewResult.view) ? { view: createViewResult === null || createViewResult === void 0 ? void 0 : createViewResult.view } : undefined;
     });
-    const onDisposeRemoteStreamView = (userId) => __awaiter$I(void 0, void 0, void 0, function* () {
+    const onDisposeRemoteStreamView = (userId) => __awaiter$K(void 0, void 0, void 0, function* () {
         if (!call) {
             return;
         }
@@ -848,7 +874,7 @@ const createDefaultCommonCallingHandlers = memoizeOne__default['default']((callC
             callClient.disposeView(call.id, participant.identifier, screenShareStream);
         }
     });
-    const onDisposeRemoteVideoStreamView = (userId) => __awaiter$I(void 0, void 0, void 0, function* () {
+    const onDisposeRemoteVideoStreamView = (userId) => __awaiter$K(void 0, void 0, void 0, function* () {
         if (!call) {
             return;
         }
@@ -865,7 +891,7 @@ const createDefaultCommonCallingHandlers = memoizeOne__default['default']((callC
             callClient.disposeView(call.id, participant.identifier, remoteVideoStream);
         }
     });
-    const onDisposeRemoteScreenShareStreamView = (userId) => __awaiter$I(void 0, void 0, void 0, function* () {
+    const onDisposeRemoteScreenShareStreamView = (userId) => __awaiter$K(void 0, void 0, void 0, function* () {
         if (!call) {
             return;
         }
@@ -882,7 +908,7 @@ const createDefaultCommonCallingHandlers = memoizeOne__default['default']((callC
             callClient.disposeView(call.id, participant.identifier, screenShareStream);
         }
     });
-    const onDisposeLocalStreamView = () => __awaiter$I(void 0, void 0, void 0, function* () {
+    const onDisposeLocalStreamView = () => __awaiter$K(void 0, void 0, void 0, function* () {
         // If the user is currently in a call, dispose of the local stream view attached to that call.
         const callState = call && callClient.getState().calls[call.id];
         const localStream = callState === null || callState === void 0 ? void 0 : callState.localVideoStreams.find((item) => item.mediaStreamType === 'Video');
@@ -895,56 +921,71 @@ const createDefaultCommonCallingHandlers = memoizeOne__default['default']((callC
         yield disposeAllLocalPreviewViews(callClient);
     });
     /* @conditional-compile-remove(dialpad) */ /* @conditional-compile-remove(PSTN-calls) */
-    const onSendDtmfTone = (dtmfTone) => __awaiter$I(void 0, void 0, void 0, function* () { return yield (call === null || call === void 0 ? void 0 : call.sendDtmf(dtmfTone)); });
+    const onSendDtmfTone = (dtmfTone) => __awaiter$K(void 0, void 0, void 0, function* () { return yield (call === null || call === void 0 ? void 0 : call.sendDtmf(dtmfTone)); });
     const notImplemented = () => {
         throw new Error('Not implemented, cannot call a method from an abstract object');
     };
     /* @conditional-compile-remove(call-readiness) */
-    const askDevicePermission = (constrain) => __awaiter$I(void 0, void 0, void 0, function* () {
+    const askDevicePermission = (constrain) => __awaiter$K(void 0, void 0, void 0, function* () {
         if (deviceManager) {
             yield (deviceManager === null || deviceManager === void 0 ? void 0 : deviceManager.askDevicePermission(constrain));
         }
     });
     /* @conditional-compile-remove(video-background-effects) */
-    const onRemoveVideoBackgroundEffects = () => __awaiter$I(void 0, void 0, void 0, function* () {
+    const onRemoveVideoBackgroundEffects = () => __awaiter$K(void 0, void 0, void 0, function* () {
         const stream = (call === null || call === void 0 ? void 0 : call.localVideoStreams.find((stream) => stream.mediaStreamType === 'Video')) ||
             (deviceManager === null || deviceManager === void 0 ? void 0 : deviceManager.getUnparentedVideoStreams().find((stream) => stream.mediaStreamType === 'Video'));
         if (stream) {
-            return stream.feature(communicationCalling.Features.VideoEffects).stopEffects();
+            if (!(options === null || options === void 0 ? void 0 : options.onResolveVideoBackgroundEffectsDependency)) {
+                throw new Error(`Video background effects dependency not resolved`);
+            }
+            else {
+                return stream.feature(communicationCalling.Features.VideoEffects).stopEffects();
+            }
         }
     });
     /* @conditional-compile-remove(video-background-effects) */
-    const onBlurVideoBackground = (backgroundBlurConfig) => __awaiter$I(void 0, void 0, void 0, function* () {
+    const onBlurVideoBackground = (backgroundBlurConfig) => __awaiter$K(void 0, void 0, void 0, function* () {
+        var _b;
         const stream = (call === null || call === void 0 ? void 0 : call.localVideoStreams.find((stream) => stream.mediaStreamType === 'Video')) ||
             (deviceManager === null || deviceManager === void 0 ? void 0 : deviceManager.getUnparentedVideoStreams().find((stream) => stream.mediaStreamType === 'Video'));
         if (stream) {
-            return stream.feature(communicationCalling.Features.VideoEffects).startEffects(new communicationCallingEffects.BackgroundBlurEffect(backgroundBlurConfig));
+            if (!(options === null || options === void 0 ? void 0 : options.onResolveVideoBackgroundEffectsDependency)) {
+                throw new Error(`Video background effects dependency not resolved`);
+            }
+            const createEffect = (options === null || options === void 0 ? void 0 : options.onResolveVideoBackgroundEffectsDependency) &&
+                ((_b = (yield options.onResolveVideoBackgroundEffectsDependency())) === null || _b === void 0 ? void 0 : _b.createBackgroundBlurEffect);
+            return createEffect && stream.feature(communicationCalling.Features.VideoEffects).startEffects(createEffect(backgroundBlurConfig));
         }
     });
     /* @conditional-compile-remove(video-background-effects) */
-    const onReplaceVideoBackground = (backgroundReplacementConfig) => __awaiter$I(void 0, void 0, void 0, function* () {
+    const onReplaceVideoBackground = (backgroundReplacementConfig) => __awaiter$K(void 0, void 0, void 0, function* () {
+        var _c;
         const stream = (call === null || call === void 0 ? void 0 : call.localVideoStreams.find((stream) => stream.mediaStreamType === 'Video')) ||
             (deviceManager === null || deviceManager === void 0 ? void 0 : deviceManager.getUnparentedVideoStreams().find((stream) => stream.mediaStreamType === 'Video'));
         if (stream) {
-            return stream
-                .feature(communicationCalling.Features.VideoEffects)
-                .startEffects(new communicationCallingEffects.BackgroundReplacementEffect(backgroundReplacementConfig));
+            if (!(options === null || options === void 0 ? void 0 : options.onResolveVideoBackgroundEffectsDependency)) {
+                throw new Error(`Video background effects dependency not resolved`);
+            }
+            const createEffect = (options === null || options === void 0 ? void 0 : options.onResolveVideoBackgroundEffectsDependency) &&
+                ((_c = (yield options.onResolveVideoBackgroundEffectsDependency())) === null || _c === void 0 ? void 0 : _c.createBackgroundReplacementEffect);
+            return (createEffect && stream.feature(communicationCalling.Features.VideoEffects).startEffects(createEffect(backgroundReplacementConfig)));
         }
     });
     /* @conditional-compile-remove(close-captions) */
-    const onStartCaptions = (options) => __awaiter$I(void 0, void 0, void 0, function* () {
+    const onStartCaptions = (options) => __awaiter$K(void 0, void 0, void 0, function* () {
         yield (call === null || call === void 0 ? void 0 : call.feature(communicationCalling.Features.TeamsCaptions).startCaptions(options));
     });
     /* @conditional-compile-remove(close-captions) */
-    const onStopCaptions = () => __awaiter$I(void 0, void 0, void 0, function* () {
+    const onStopCaptions = () => __awaiter$K(void 0, void 0, void 0, function* () {
         yield (call === null || call === void 0 ? void 0 : call.feature(communicationCalling.Features.TeamsCaptions).stopCaptions());
     });
     /* @conditional-compile-remove(close-captions) */
-    const onSetSpokenLanguage = (language) => __awaiter$I(void 0, void 0, void 0, function* () {
+    const onSetSpokenLanguage = (language) => __awaiter$K(void 0, void 0, void 0, function* () {
         yield (call === null || call === void 0 ? void 0 : call.feature(communicationCalling.Features.TeamsCaptions).setSpokenLanguage(language));
     });
     /* @conditional-compile-remove(close-captions) */
-    const onSetCaptionLanguage = (language) => __awaiter$I(void 0, void 0, void 0, function* () {
+    const onSetCaptionLanguage = (language) => __awaiter$K(void 0, void 0, void 0, function* () {
         yield (call === null || call === void 0 ? void 0 : call.feature(communicationCalling.Features.TeamsCaptions).setCaptionLanguage(language));
     });
     return {
@@ -992,7 +1033,7 @@ const createDefaultCommonCallingHandlers = memoizeOne__default['default']((callC
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$H = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$J = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -1009,15 +1050,18 @@ var __awaiter$H = (window && window.__awaiter) || function (thisArg, _arguments,
  *
  * @public
  */
-const createDefaultCallingHandlers = memoizeOne__default['default']((callClient, callAgent, deviceManager, call) => {
-    return Object.assign(Object.assign({}, createDefaultCommonCallingHandlers(callClient, deviceManager, call)), { 
+const createDefaultCallingHandlers = memoizeOne__default['default']((...args) => {
+    const [callClient, callAgent, deviceManager, call, 
+    /* @conditional-compile-remove(video-background-effects) */ options] = args;
+    return Object.assign(Object.assign({}, createDefaultCommonCallingHandlers(callClient, deviceManager, call, 
+    /* @conditional-compile-remove(video-background-effects) */ options)), { 
         // FIXME: onStartCall API should use string, not the underlying SDK types.
         onStartCall: (participants, options) => {
             /* @conditional-compile-remove(teams-adhoc-call) */
             return callAgent === null || callAgent === void 0 ? void 0 : callAgent.startCall(participants, options);
         }, 
         /* @conditional-compile-remove(PSTN-calls) */
-        onAddParticipant: (userId, options) => __awaiter$H(void 0, void 0, void 0, function* () {
+        onAddParticipant: (userId, options) => __awaiter$J(void 0, void 0, void 0, function* () {
             const participant = _toCommunicationIdentifier(userId);
             if (communicationCommon.isPhoneNumberIdentifier(participant)) {
                 call === null || call === void 0 ? void 0 : call.addParticipant(participant, options);
@@ -1025,7 +1069,7 @@ const createDefaultCallingHandlers = memoizeOne__default['default']((callClient,
             else if (communicationCommon.isCommunicationUserIdentifier(participant) || communicationCommon.isMicrosoftTeamsUserIdentifier(participant)) {
                 call === null || call === void 0 ? void 0 : call.addParticipant(participant);
             }
-        }), onRemoveParticipant: (userId) => __awaiter$H(void 0, void 0, void 0, function* () {
+        }), onRemoveParticipant: (userId) => __awaiter$J(void 0, void 0, void 0, function* () {
             const participant = _toCommunicationIdentifier(userId);
             yield (call === null || call === void 0 ? void 0 : call.removeParticipant(participant));
         }) });
@@ -1033,7 +1077,7 @@ const createDefaultCallingHandlers = memoizeOne__default['default']((callClient,
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$G = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$I = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -1050,8 +1094,8 @@ var __awaiter$G = (window && window.__awaiter) || function (thisArg, _arguments,
  *
  * @beta
  */
-const createDefaultTeamsCallingHandlers = memoizeOne__default['default']((callClient, callAgent, deviceManager, call) => {
-    return Object.assign(Object.assign({}, createDefaultCommonCallingHandlers(callClient, deviceManager, call)), { onStartCall: (participants, options) => {
+const createDefaultTeamsCallingHandlers = memoizeOne__default['default']((callClient, callAgent, deviceManager, call, options) => {
+    return Object.assign(Object.assign({}, createDefaultCommonCallingHandlers(callClient, deviceManager, call, options)), { onStartCall: (participants, options) => {
             /* @conditional-compile-remove(teams-identity-support) */
             const threadId = options === null || options === void 0 ? void 0 : options.threadId;
             if (!isTeamsCallParticipants(participants)) {
@@ -1065,7 +1109,7 @@ const createDefaultTeamsCallingHandlers = memoizeOne__default['default']((callCl
         }, 
         /* @conditional-compile-remove(teams-identity-support) */
         /* @conditional-compile-remove(PSTN-calls) */
-        onAddParticipant: (userId, options) => __awaiter$G(void 0, void 0, void 0, function* () {
+        onAddParticipant: (userId, options) => __awaiter$I(void 0, void 0, void 0, function* () {
             const participant = _toCommunicationIdentifier(userId);
             /* @conditional-compile-remove(teams-identity-support) */
             const threadId = options === null || options === void 0 ? void 0 : options.threadId;
@@ -1082,7 +1126,7 @@ const createDefaultTeamsCallingHandlers = memoizeOne__default['default']((callCl
             }
             /* @conditional-compile-remove(teams-identity-support) */
             call === null || call === void 0 ? void 0 : call.addParticipant(participant);
-        }), onRemoveParticipant: (userId) => __awaiter$G(void 0, void 0, void 0, function* () {
+        }), onRemoveParticipant: (userId) => __awaiter$I(void 0, void 0, void 0, function* () {
             const participant = _toCommunicationIdentifier(userId);
             if (communicationCommon.isCommunicationUserIdentifier(participant)) {
                 throw new Error('CommunicationIdentifier in Teams call is not supported!');
@@ -1164,7 +1208,7 @@ const getCaptionsSpeakerIdentifier = (captions) => {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$F = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$H = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -1213,13 +1257,13 @@ class ProxyDeviceManager {
         this.selectCamera = (videoDeviceInfo) => {
             this._context.setDeviceManagerSelectedCamera(videoDeviceInfo);
         };
-        this.videoDevicesUpdated = () => __awaiter$F(this, void 0, void 0, function* () {
+        this.videoDevicesUpdated = () => __awaiter$H(this, void 0, void 0, function* () {
             // Device Manager always has a camera with '' name if there are no real camera devices available.
             // We don't want to show that in the UI.
             const realCameras = (yield this._deviceManager.getCameras()).filter((c) => !!c.name);
             this._context.setDeviceManagerCameras(dedupeById(realCameras));
         });
-        this.audioDevicesUpdated = () => __awaiter$F(this, void 0, void 0, function* () {
+        this.audioDevicesUpdated = () => __awaiter$H(this, void 0, void 0, function* () {
             this._context.setDeviceManagerMicrophones(dedupeById(yield this._deviceManager.getMicrophones()));
             this._context.setDeviceManagerSpeakers(dedupeById(yield this._deviceManager.getSpeakers()));
         });
@@ -1607,7 +1651,7 @@ function convertFromSDKToDeclarativeVideoStreamVideoEffects(videoEffects) {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$E = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$G = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -2326,7 +2370,7 @@ class CallContext$2 {
      * @throws CallError. Exceptions thrown from `f` are tagged with the failed `target.
      */
     withAsyncErrorTeedToState(action, target) {
-        return (...args) => __awaiter$E(this, void 0, void 0, function* () {
+        return (...args) => __awaiter$G(this, void 0, void 0, function* () {
             try {
                 return yield action(...args);
             }
@@ -2746,7 +2790,7 @@ function _logStreamEvent(eventName, streamLogInfo, error) {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$D = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$F = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -2756,7 +2800,7 @@ var __awaiter$D = (window && window.__awaiter) || function (thisArg, _arguments,
     });
 };
 function createViewVideo(context, internalContext, callId, stream, participantId, options) {
-    return __awaiter$D(this, void 0, void 0, function* () {
+    return __awaiter$F(this, void 0, void 0, function* () {
         // we can only have 3 types of createView
         let streamEventType;
         // we will reuse these for local as well but we need to make sure the remote stream is passed in like before.
@@ -2878,7 +2922,7 @@ function createViewVideo(context, internalContext, callId, stream, participantId
     });
 }
 function createViewUnparentedVideo(context, internalContext, stream, options) {
-    return __awaiter$D(this, void 0, void 0, function* () {
+    return __awaiter$F(this, void 0, void 0, function* () {
         const renderInfo = internalContext.getUnparentedRenderInfo(stream);
         if (renderInfo && renderInfo.status === 'Rendered') {
             console.warn('Unparented LocalVideoStream is already rendered');
@@ -3046,7 +3090,7 @@ function createView(context, internalContext, callId, participantId, stream, opt
         // Render LocalVideoStream that is not part of a Call
         // Because it is not part of the call we don't tee errors to state naturally (e.g. via a Call Client function such as startVideo).
         // We do not have a startLocalPreviewVideo function, so as a workaround we ensure any errors are propagated here.
-        return context.withAsyncErrorTeedToState(() => __awaiter$D(this, void 0, void 0, function* () { return yield createViewUnparentedVideo(context, internalContext, stream, options); }), 'Call.startVideo')();
+        return context.withAsyncErrorTeedToState(() => __awaiter$F(this, void 0, void 0, function* () { return yield createViewUnparentedVideo(context, internalContext, stream, options); }), 'Call.startVideo')();
     }
     else {
         _logStreamEvent(EventNames.CREATE_STREAM_INVALID_PARAMS, { streamType });
@@ -3594,7 +3638,7 @@ class CallSubscriber {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$C = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$E = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -3614,14 +3658,14 @@ class ProxyIncomingCall {
         switch (prop) {
             case 'accept': {
                 return this._context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$C(this, void 0, void 0, function* () {
+                    return __awaiter$E(this, void 0, void 0, function* () {
                         return yield target.accept(...args);
                     });
                 }, 'IncomingCall.accept');
             }
             case 'reject': {
                 return this._context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$C(this, void 0, void 0, function* () {
+                    return __awaiter$E(this, void 0, void 0, function* () {
                         return yield target.reject(...args);
                     });
                 }, 'IncomingCall.reject');
@@ -3862,7 +3906,7 @@ const clearCallRelatedState = (context, internalContext) => {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$B = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$D = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -3888,56 +3932,56 @@ class ProxyCallCommon {
         switch (prop) {
             case 'mute': {
                 return this._context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$B(this, void 0, void 0, function* () {
+                    return __awaiter$D(this, void 0, void 0, function* () {
                         return yield target.mute(...args);
                     });
                 }, 'Call.mute');
             }
             case 'unmute': {
                 return this._context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$B(this, void 0, void 0, function* () {
+                    return __awaiter$D(this, void 0, void 0, function* () {
                         return yield target.unmute(...args);
                     });
                 }, 'Call.unmute');
             }
             case 'startVideo': {
                 return this._context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$B(this, void 0, void 0, function* () {
+                    return __awaiter$D(this, void 0, void 0, function* () {
                         return yield target.startVideo(...args);
                     });
                 }, 'Call.startVideo');
             }
             case 'stopVideo': {
                 return this._context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$B(this, void 0, void 0, function* () {
+                    return __awaiter$D(this, void 0, void 0, function* () {
                         return yield target.stopVideo(...args);
                     });
                 }, 'Call.stopVideo');
             }
             case 'startScreenSharing': {
                 return this._context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$B(this, void 0, void 0, function* () {
+                    return __awaiter$D(this, void 0, void 0, function* () {
                         return yield target.startScreenSharing(...args);
                     });
                 }, 'Call.startScreenSharing');
             }
             case 'stopScreenSharing': {
                 return this._context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$B(this, void 0, void 0, function* () {
+                    return __awaiter$D(this, void 0, void 0, function* () {
                         return yield target.stopScreenSharing(...args);
                     });
                 }, 'Call.stopScreenSharing');
             }
             case 'hold': {
                 return this._context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$B(this, void 0, void 0, function* () {
+                    return __awaiter$D(this, void 0, void 0, function* () {
                         return yield target.hold(...args);
                     });
                 }, 'Call.hold');
             }
             case 'resume': {
                 return this._context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$B(this, void 0, void 0, function* () {
+                    return __awaiter$D(this, void 0, void 0, function* () {
                         return yield target.resume(...args);
                     });
                 }, 'Call.resume');
@@ -3977,7 +4021,7 @@ class ProxyTeamsCaptionsFeature {
     get(target, prop) {
         switch (prop) {
             case 'startCaptions':
-                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$B(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$D(this, void 0, void 0, function* () {
                     var _a, _b;
                     this._context.setStartCaptionsInProgress(this._call.id, true);
                     const ret = yield target.startCaptions(...args);
@@ -3985,20 +4029,20 @@ class ProxyTeamsCaptionsFeature {
                     return ret;
                 }), 'Call.feature');
             case 'stopCaptions':
-                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$B(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$D(this, void 0, void 0, function* () {
                     const ret = yield target.stopCaptions(...args);
                     this._context.setIsCaptionActive(this._call.id, false);
                     this._context.setStartCaptionsInProgress(this._call.id, false);
                     return ret;
                 }), 'Call.feature');
             case 'setSpokenLanguage':
-                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$B(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$D(this, void 0, void 0, function* () {
                     const ret = yield target.setSpokenLanguage(...args);
                     this._context.setSelectedSpokenLanguage(this._call.id, args[0]);
                     return ret;
                 }), 'Call.feature');
             case 'setCaptionLanguage':
-                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$B(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$D(this, void 0, void 0, function* () {
                     const ret = yield target.setCaptionLanguage(...args);
                     this._context.setSelectedCaptionLanguage(this._call.id, args[0]);
                     return ret;
@@ -4046,7 +4090,7 @@ class ProxyTransferCallFeature {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$A = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$C = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -4060,7 +4104,7 @@ class ProxyCall extends ProxyCallCommon {
         switch (prop) {
             case 'addParticipant': {
                 return this.getContext().withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$A(this, void 0, void 0, function* () {
+                    return __awaiter$C(this, void 0, void 0, function* () {
                         return yield target.addParticipant(...args);
                     });
                 }, 'Call.addParticipant');
@@ -4281,7 +4325,7 @@ class InternalCallContext {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$z = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$B = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -4296,7 +4340,7 @@ class ProxyTeamsCall extends ProxyCallCommon {
         switch (prop) {
             case 'addParticipant': {
                 return this.getContext().withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$z(this, void 0, void 0, function* () {
+                    return __awaiter$B(this, void 0, void 0, function* () {
                         return yield target.addParticipant(...args);
                     });
                 }, 'TeamsCall.addParticipant');
@@ -4411,7 +4455,7 @@ const teamsCallAgentDeclaratify = (callAgent, context, internalContext) => {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$y = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$A = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -4433,7 +4477,7 @@ class ProxyVideoStreamRendererView {
     get(target, prop) {
         switch (prop) {
             case 'updateScalingMode': {
-                return (...args) => __awaiter$y(this, void 0, void 0, function* () {
+                return (...args) => __awaiter$A(this, void 0, void 0, function* () {
                     yield target.updateScalingMode(...args);
                     this._context.setRemoteVideoStreamViewScalingMode(this._callId, this._participantId, this._streamId, args[0]);
                 });
@@ -4454,7 +4498,7 @@ const videoStreamRendererViewDeclaratify = (view, context, callId, participantId
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$x = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$z = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -4476,7 +4520,7 @@ class ProxyCallClient {
     get(target, prop) {
         switch (prop) {
             case 'createCallAgent': {
-                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$x(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$z(this, void 0, void 0, function* () {
                     // createCallAgent will throw an exception if the previous callAgent was not disposed. If the previous
                     // callAgent was disposed then it would have unsubscribed to events so we can just create a new declarative
                     // callAgent if the createCallAgent succeeds.
@@ -4489,7 +4533,7 @@ class ProxyCallClient {
                 }), 'CallClient.createCallAgent');
             }
             case 'createTeamsCallAgent': {
-                /* @conditional-compile-remove(teams-identity-support) */ return this._context.withAsyncErrorTeedToState((...args) => __awaiter$x(this, void 0, void 0, function* () {
+                /* @conditional-compile-remove(teams-identity-support) */ return this._context.withAsyncErrorTeedToState((...args) => __awaiter$z(this, void 0, void 0, function* () {
                     // createCallAgent will throw an exception if the previous callAgent was not disposed. If the previous
                     // callAgent was disposed then it would have unsubscribed to events so we can just create a new declarative
                     // callAgent if the createCallAgent succeeds.
@@ -4502,7 +4546,7 @@ class ProxyCallClient {
                 }), 'CallClient.createTeamsCallAgent');
             }
             case 'getDeviceManager': {
-                return this._context.withAsyncErrorTeedToState(() => __awaiter$x(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState(() => __awaiter$z(this, void 0, void 0, function* () {
                     // As of writing, the SDK always returns the same instance of DeviceManager so we keep a reference of
                     // DeviceManager and if it does not change we return the cached DeclarativeDeviceManager. If it does not we'll
                     // throw an error that indicate we need to fix this issue as our implementation has diverged from the SDK.
@@ -4531,7 +4575,7 @@ class ProxyCallClient {
                         /**
                          * add to this object if we want to proxy anything else off the DebugInfo feature object.
                          */
-                        return Object.assign(Object.assign({}, feature), { getEnvironmentInfo: () => __awaiter$x(this, void 0, void 0, function* () {
+                        return Object.assign(Object.assign({}, feature), { getEnvironmentInfo: () => __awaiter$z(this, void 0, void 0, function* () {
                                 const environmentInfo = yield feature.getEnvironmentInfo();
                                 this._context.setEnvironmentInfo(environmentInfo);
                                 return environmentInfo;
@@ -4584,7 +4628,7 @@ const createStatefulCallClientWithDeps = (callClient, context, internalContext)
     });
     Object.defineProperty(callClient, 'createView', {
         configurable: false,
-        value: (callId, participantId, stream, options) => __awaiter$x(void 0, void 0, void 0, function* () {
+        value: (callId, participantId, stream, options) => __awaiter$z(void 0, void 0, void 0, function* () {
             const participantIdKind = participantId ? communicationCommon.getIdentifierKind(participantId) : undefined;
             const result = yield createView(context, internalContext, callId, participantIdKind, stream, options);
             // We only need to declaratify the VideoStreamRendererView object for remote participants. Because the updateScalingMode only needs to be called on remote participant stream views.
@@ -7286,7 +7330,7 @@ const _MentionPopover = (props) => {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$w = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$y = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -7461,7 +7505,7 @@ const TextFieldWithMention = (props) => {
         onSuggestionSelected,
         updateMentionSuggestions
     ]);
-    const debouncedQueryUpdate = useDebounce.useDebouncedCallback((query) => __awaiter$w(void 0, void 0, void 0, function* () {
+    const debouncedQueryUpdate = useDebounce.useDebouncedCallback((query) => __awaiter$y(void 0, void 0, void 0, function* () {
         var _a;
         let suggestions = (_a = (yield (mentionLookupOptions === null || mentionLookupOptions === void 0 ? void 0 : mentionLookupOptions.onQueryUpdated(query)))) !== null && _a !== void 0 ? _a : [];
         suggestions = suggestions.filter((suggestion) => suggestion.displayText.trim() !== '');
@@ -7638,7 +7682,7 @@ const TextFieldWithMention = (props) => {
             });
         }
     }, [updateSelectionIndexesWithMentionIfNeeded, setSelectionStartValue, setSelectionEndValue]);
-    const handleOnChange = React.useCallback(({ currentSelectionEnd, currentSelectionStart, currentTriggerStartIndex, event, htmlTextValue, inputTextValue, previousSelectionEnd, previousSelectionStart, tagsValue, updatedValue }) => __awaiter$w(void 0, void 0, void 0, function* () {
+    const handleOnChange = React.useCallback(({ currentSelectionEnd, currentSelectionStart, currentTriggerStartIndex, event, htmlTextValue, inputTextValue, previousSelectionEnd, previousSelectionStart, tagsValue, updatedValue }) => __awaiter$y(void 0, void 0, void 0, function* () {
         var _b;
         debouncedQueryUpdate.cancel();
         if (event.currentTarget === null) {
@@ -9386,7 +9430,7 @@ const chatMessageActionMenuProps = (menuProps) => {
     return actionMenuProps;
 };
 
-var __awaiter$v = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$x = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -9429,7 +9473,7 @@ const _FileDownloadCards = (props) => {
             fileCount: `${fileMetadata.filter(isFileSharingAttachment).length}`
         });
     }, [(_b = props.strings) === null || _b === void 0 ? void 0 : _b.fileCardGroupMessage, localeStrings.fileCardGroupMessage, fileMetadata, isFileSharingAttachment]);
-    const fileDownloadHandler = React.useCallback((userId, file) => __awaiter$v(void 0, void 0, void 0, function* () {
+    const fileDownloadHandler = React.useCallback((userId, file) => __awaiter$x(void 0, void 0, void 0, function* () {
         if (!props.downloadHandler) {
             window.open(file.url, '_blank', 'noopener,noreferrer');
         }
@@ -9599,7 +9643,7 @@ const ChatMessageComponentAsMessageBubble = React__default['default'].memo(Messa
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$u = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$w = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -9632,7 +9676,7 @@ const ChatMessageComponent = (props) => {
         onSendMessage && onSendMessage(content !== undefined ? content : '');
     }, [clientMessageId, content, onSendMessage, onDeleteMessage]);
     if (isEditing && message.messageType === 'chat') {
-        return (React__default['default'].createElement(ChatMessageComponentAsEditBox, { message: message, inlineEditButtons: props.inlineAcceptRejectEditButtons, strings: props.strings, onSubmit: (text, metadata, options) => __awaiter$u(void 0, void 0, void 0, function* () {
+        return (React__default['default'].createElement(ChatMessageComponentAsEditBox, { message: message, inlineEditButtons: props.inlineAcceptRejectEditButtons, strings: props.strings, onSubmit: (text, metadata, options) => __awaiter$w(void 0, void 0, void 0, function* () {
                 props.onUpdateMessage &&
                     message.messageId &&
                     (yield props.onUpdateMessage(message.messageId, text, metadata, options));
@@ -9821,7 +9865,7 @@ const LiveAnnouncer = (props) => {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$t = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$v = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -10043,7 +10087,7 @@ const MessageThread = (props) => {
     /* @conditional-compile-remove(teams-inline-images-and-file-sharing) */
     const [inlineAttachments, setInlineAttachments] = React.useState({});
     /* @conditional-compile-remove(teams-inline-images-and-file-sharing) */
-    const onFetchInlineAttachment = React.useCallback((attachment) => __awaiter$t(void 0, void 0, void 0, function* () {
+    const onFetchInlineAttachment = React.useCallback((attachment) => __awaiter$v(void 0, void 0, void 0, function* () {
         if (!onFetchAttachments || attachment.attachmentType !== 'inlineImage' || attachment.id in inlineAttachments) {
             return;
         }
@@ -10092,7 +10136,7 @@ const MessageThread = (props) => {
         setChatMessagesInitialized(chatMessagesInitialized);
     };
     // we try to only send those message status if user is scrolled to the bottom.
-    const sendMessageStatusIfAtBottom = React.useCallback(() => __awaiter$t(void 0, void 0, void 0, function* () {
+    const sendMessageStatusIfAtBottom = React.useCallback(() => __awaiter$v(void 0, void 0, void 0, function* () {
         if (!isAtBottomOfScrollRef.current ||
             !document.hasFocus() ||
             !messagesRef.current ||
@@ -10143,7 +10187,7 @@ const MessageThread = (props) => {
         setIsAtBottomOfScrollRef(atBottom);
     }, [scrollToBottom, sendMessageStatusIfAtBottom]);
     // Infinite scrolling + threadInitialize function
-    const fetchNewMessageWhenAtTop = React.useCallback(() => __awaiter$t(void 0, void 0, void 0, function* () {
+    const fetchNewMessageWhenAtTop = React.useCallback(() => __awaiter$v(void 0, void 0, void 0, function* () {
         if (!isLoadingChatMessagesRef.current) {
             if (onLoadPreviousChatMessages) {
                 isLoadingChatMessagesRef.current = true;
@@ -14506,7 +14550,7 @@ const DevicesButton = (props) => {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$s = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$u = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -14544,7 +14588,7 @@ const CameraButton = (props) => {
     const toggleAnnouncerString = React.useCallback((isCameraOn) => {
         setAnnouncerString(!isCameraOn ? strings.cameraActionTurnedOffAnnouncement : strings.cameraActionTurnedOnAnnouncement);
     }, [strings.cameraActionTurnedOffAnnouncement, strings.cameraActionTurnedOnAnnouncement]);
-    const onToggleClick = React.useCallback(() => __awaiter$s(void 0, void 0, void 0, function* () {
+    const onToggleClick = React.useCallback(() => __awaiter$u(void 0, void 0, void 0, function* () {
         // Throttle click on camera, need to await onToggleCamera then allow another click
         if (onToggleCamera) {
             setWaitForCamera(true);
@@ -14712,7 +14756,7 @@ const lightThemeCallButtonStyles = {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$r = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$t = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -14753,7 +14797,7 @@ const MicrophoneButton = (props) => {
     const toggleAnnouncerString = React.useCallback((isMicOn) => {
         setAnnouncerString(!isMicOn ? strings.microphoneActionTurnedOffAnnouncement : strings.microphoneActionTurnedOnAnnouncement);
     }, [strings.microphoneActionTurnedOffAnnouncement, strings.microphoneActionTurnedOnAnnouncement]);
-    const onToggleClick = React.useCallback(() => __awaiter$r(void 0, void 0, void 0, function* () {
+    const onToggleClick = React.useCallback(() => __awaiter$t(void 0, void 0, void 0, function* () {
         if (onToggleMicrophone) {
             try {
                 yield onToggleMicrophone();
@@ -15649,7 +15693,7 @@ const formatPhoneNumber = (phoneNumber) => {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$q = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$s = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -15691,10 +15735,10 @@ const DialpadButton = (props) => {
     const theme = react.useTheme();
     const { digit, index, onClick, onLongPress, isMobile = false } = props;
     const useLongPressProps = React__default['default'].useMemo(() => ({
-        onClick: () => __awaiter$q(void 0, void 0, void 0, function* () {
+        onClick: () => __awaiter$s(void 0, void 0, void 0, function* () {
             onClick(digit, index);
         }),
-        onLongPress: () => __awaiter$q(void 0, void 0, void 0, function* () {
+        onLongPress: () => __awaiter$s(void 0, void 0, void 0, function* () {
             onLongPress(digit, index);
         }),
         touchEventsOnly: isMobile
@@ -16468,7 +16512,7 @@ const dropdownStyles = {
     callout: Object.assign({ height: _pxToRem(300), overflow: 'auto' }, scrollbarStyles)
 };
 
-var __awaiter$p = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$r = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -16503,7 +16547,7 @@ const _CaptionsSettingsModal = (props) => {
             setHasSetSpokenLanguage(true);
         }
     }, [isCaptionsFeatureActive, onSetSpokenLanguage, selectedItem.key, hasSetSpokenLanguage]);
-    const onConfirm = React.useCallback(() => __awaiter$p(void 0, void 0, void 0, function* () {
+    const onConfirm = React.useCallback(() => __awaiter$r(void 0, void 0, void 0, function* () {
         const languageCode = selectedItem.key.toString();
         if (isCaptionsFeatureActive) {
             onSetSpokenLanguage(languageCode);
@@ -17135,7 +17179,7 @@ const findConditionalCompiledSelector = (component) => {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$o = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$q = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -17158,35 +17202,35 @@ const createDefaultChatHandlers = memoizeOne__default['default']((chatClient, ch
     let messageIterator = undefined;
     let readReceiptIterator = undefined;
     return {
-        onSendMessage: (content, options) => __awaiter$o(void 0, void 0, void 0, function* () {
+        onSendMessage: (content, options) => __awaiter$q(void 0, void 0, void 0, function* () {
             const sendMessageRequest = {
                 content,
                 senderDisplayName: chatClient.getState().displayName
             };
             yield chatThreadClient.sendMessage(sendMessageRequest, options);
         }),
-        onUpdateMessage: (messageId, content, metadata, options) => __awaiter$o(void 0, void 0, void 0, function* () {
+        onUpdateMessage: (messageId, content, metadata, options) => __awaiter$q(void 0, void 0, void 0, function* () {
             const updatedMetadata = metadata ? Object.assign({}, metadata) : {};
             updatedMetadata['fileSharingMetadata'] = JSON.stringify((options === null || options === void 0 ? void 0 : options.attachedFilesMetadata) || []);
             yield chatThreadClient.updateMessage(messageId, { content, metadata: updatedMetadata });
         }),
-        onDeleteMessage: (messageId) => __awaiter$o(void 0, void 0, void 0, function* () {
+        onDeleteMessage: (messageId) => __awaiter$q(void 0, void 0, void 0, function* () {
             yield chatThreadClient.deleteMessage(messageId);
         }),
         // This handler is designed for chatThread to consume
-        onMessageSeen: (chatMessageId) => __awaiter$o(void 0, void 0, void 0, function* () {
+        onMessageSeen: (chatMessageId) => __awaiter$q(void 0, void 0, void 0, function* () {
             yield chatThreadClient.sendReadReceipt({ chatMessageId });
         }),
-        onTyping: () => __awaiter$o(void 0, void 0, void 0, function* () {
+        onTyping: () => __awaiter$q(void 0, void 0, void 0, function* () {
             yield chatThreadClient.sendTypingNotification();
         }),
-        onRemoveParticipant: (userId) => __awaiter$o(void 0, void 0, void 0, function* () {
+        onRemoveParticipant: (userId) => __awaiter$q(void 0, void 0, void 0, function* () {
             yield chatThreadClient.removeParticipant(fromFlatCommunicationIdentifier(userId));
         }),
-        updateThreadTopicName: (topicName) => __awaiter$o(void 0, void 0, void 0, function* () {
+        updateThreadTopicName: (topicName) => __awaiter$q(void 0, void 0, void 0, function* () {
             yield chatThreadClient.updateTopic(topicName);
         }),
-        onLoadPreviousChatMessages: (messagesToLoad) => __awaiter$o(void 0, void 0, void 0, function* () {
+        onLoadPreviousChatMessages: (messagesToLoad) => __awaiter$q(void 0, void 0, void 0, function* () {
             var _a, _b, _c;
             if (messageIterator === undefined) {
                 // Lazy definition so that errors in the method call are reported correctly.
@@ -18053,7 +18097,7 @@ const chatStatefulLogger = logger.createClientLogger('communication-react:chat-s
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$n = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$p = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -18328,7 +18372,7 @@ class ChatContext$1 {
      * @throws ChatError. Exceptions thrown from `f` are tagged with the failed `target.
      */
     withAsyncErrorTeedToState(f, target) {
-        return (...args) => __awaiter$n(this, void 0, void 0, function* () {
+        return (...args) => __awaiter$p(this, void 0, void 0, function* () {
             try {
                 return yield f(...args);
             }
@@ -18440,7 +18484,7 @@ const convertChatMessage = (message, status = 'delivered', clientMessageId) => {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$m = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$o = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -18529,7 +18573,7 @@ class EventSubscriber {
         };
         // This is a temporary fix that no participant message is received for onChatMessageReceived event, which should be handled by JS SDK.
         // Without the temporary fix, there are missing 'participant joined' and 'participant left' system messages in the chat thread.
-        this.fetchLastParticipantMessage = (threadId, actionType) => __awaiter$m(this, void 0, void 0, function* () {
+        this.fetchLastParticipantMessage = (threadId, actionType) => __awaiter$o(this, void 0, void 0, function* () {
             var e_1, _a;
             try {
                 for (var _b = __asyncValues$1(this.chatClient
@@ -18621,7 +18665,7 @@ class EventSubscriber {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$l = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$n = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -18643,7 +18687,7 @@ const createDecoratedIterator = (iteratorCreator, context, decorateFn) => {
         const threadsIterator = iteratorCreator(...args);
         return {
             next() {
-                return __awaiter$l(this, void 0, void 0, function* () {
+                return __awaiter$n(this, void 0, void 0, function* () {
                     const result = yield threadsIterator.next();
                     if (!result.done && result.value) {
                         decorateFn(result.value, context);
@@ -18658,7 +18702,7 @@ const createDecoratedIterator = (iteratorCreator, context, decorateFn) => {
                 const pages = threadsIterator.byPage(settings);
                 return {
                     next() {
-                        return __awaiter$l(this, void 0, void 0, function* () {
+                        return __awaiter$n(this, void 0, void 0, function* () {
                             const result = yield pages.next();
                             const page = result.value;
                             if (!result.done && result.value) {
@@ -18742,7 +18786,7 @@ const createDecoratedListParticipants = (chatThreadClient, context) => {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$k = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$m = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -18761,14 +18805,14 @@ class ProxyChatThreadClient {
                 return createDecoratedListMessages(chatThreadClient, this._context);
             }
             case 'getMessage': {
-                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$k(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$m(this, void 0, void 0, function* () {
                     const message = yield chatThreadClient.getMessage(...args);
                     this._context.setChatMessage(chatThreadClient.threadId, convertChatMessage(message));
                     return message;
                 }), 'ChatThreadClient.getMessage');
             }
             case 'sendMessage': {
-                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$k(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$m(this, void 0, void 0, function* () {
                     // Retry logic?
                     const [request, options] = args;
                     const { content } = request;
@@ -18808,7 +18852,7 @@ class ProxyChatThreadClient {
                 }), 'ChatThreadClient.sendMessage');
             }
             case 'addParticipants': {
-                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$k(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$m(this, void 0, void 0, function* () {
                     const result = yield chatThreadClient.addParticipants(...args);
                     const [addRequest] = args;
                     const participantsToAdd = addRequest.participants;
@@ -18817,7 +18861,7 @@ class ProxyChatThreadClient {
                 }), 'ChatThreadClient.addParticipants');
             }
             case 'deleteMessage': {
-                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$k(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$m(this, void 0, void 0, function* () {
                     // DeleteMessage is able to either delete local one(for failed message) or synced message
                     const [messageId] = args;
                     if (this._context.deleteLocalMessage(chatThreadClient.threadId, messageId)) {
@@ -18835,12 +18879,12 @@ class ProxyChatThreadClient {
                 return createDecoratedListReadReceipts(chatThreadClient, this._context);
             }
             case 'sendTypingNotification': {
-                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$k(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$m(this, void 0, void 0, function* () {
                     return yield chatThreadClient.sendTypingNotification(...args);
                 }), 'ChatThreadClient.sendTypingNotification');
             }
             case 'removeParticipant': {
-                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$k(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$m(this, void 0, void 0, function* () {
                     const result = yield chatThreadClient.removeParticipant(...args);
                     const [removeIdentifier] = args;
                     this._context.deleteParticipant(chatThreadClient.threadId, communicationCommon.getIdentifierKind(removeIdentifier));
@@ -18848,7 +18892,7 @@ class ProxyChatThreadClient {
                 }), 'ChatThreadClient.removeParticipant');
             }
             case 'updateMessage': {
-                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$k(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$m(this, void 0, void 0, function* () {
                     const result = yield chatThreadClient.updateMessage(...args);
                     const [messageId, updateOption] = args;
                     this._context.updateChatMessageContent(chatThreadClient.threadId, messageId, updateOption === null || updateOption === void 0 ? void 0 : updateOption.content);
@@ -18856,7 +18900,7 @@ class ProxyChatThreadClient {
                 }), 'ChatThreadClient.updateMessage');
             }
             case 'updateTopic': {
-                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$k(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$m(this, void 0, void 0, function* () {
                     const result = yield chatThreadClient.updateTopic(...args);
                     const [topic] = args;
                     this._context.updateThreadTopic(chatThreadClient.threadId, topic);
@@ -18864,7 +18908,7 @@ class ProxyChatThreadClient {
                 }), 'ChatThreadClient.updateTopic');
             }
             case 'getProperties': {
-                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$k(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$m(this, void 0, void 0, function* () {
                     const result = yield chatThreadClient.getProperties(...args);
                     this._context.updateThread(chatThreadClient.threadId, result);
                     return result;
@@ -18901,7 +18945,7 @@ const createDecoratedListThreads = (chatClient, context) => {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$j = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$l = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -18920,7 +18964,7 @@ const proxyChatClient = {
         switch (prop) {
             case 'createChatThread': {
                 return context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$j(this, void 0, void 0, function* () {
+                    return __awaiter$l(this, void 0, void 0, function* () {
                         const result = yield chatClient.createChatThread(...args);
                         const thread = result.chatThread;
                         if (thread) {
@@ -18933,7 +18977,7 @@ const proxyChatClient = {
             }
             case 'deleteChatThread': {
                 return context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$j(this, void 0, void 0, function* () {
+                    return __awaiter$l(this, void 0, void 0, function* () {
                         const result = yield chatClient.deleteChatThread(...args);
                         context.deleteThread(args[0]);
                         return result;
@@ -18953,7 +18997,7 @@ const proxyChatClient = {
             }
             case 'startRealtimeNotifications': {
                 return context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$j(this, void 0, void 0, function* () {
+                    return __awaiter$l(this, void 0, void 0, function* () {
                         const ret = yield chatClient.startRealtimeNotifications(...args);
                         if (!receiver.eventSubscriber) {
                             receiver.eventSubscriber = new EventSubscriber(chatClient, context);
@@ -18964,7 +19008,7 @@ const proxyChatClient = {
             }
             case 'stopRealtimeNotifications': {
                 return context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$j(this, void 0, void 0, function* () {
+                    return __awaiter$l(this, void 0, void 0, function* () {
                         const ret = yield chatClient.stopRealtimeNotifications(...args);
                         if (receiver.eventSubscriber) {
                             receiver.eventSubscriber.unsubscribe();
@@ -19114,7 +19158,7 @@ const COMPOSITE_ONLY_ICONS = {
     /* @conditional-compile-remove(PSTN-calls) */
     DialpadStartCall: React__default['default'].createElement(reactIcons.Call20Regular, null),
     /* @conditional-compile-remove(rooms) */
-    NoticePageInvalidRoom: React__default['default'].createElement(reactIcons.Info20Filled, null),
+    NoticePageAccessDeniedRoomsCall: React__default['default'].createElement(reactIcons.Info20Filled, null),
     /* @conditional-compile-remove(video-background-effects) */
     BlurVideoBackground: React__default['default'].createElement(reactIcons.VideoBackgroundEffect20Regular, null),
     /* @conditional-compile-remove(video-background-effects) */
@@ -19630,7 +19674,7 @@ const convertObservableFileUploadToFileUploadsUiState = (fileUploads) => {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$i = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$k = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -19765,9 +19809,9 @@ class AzureCommunicationChatAdapter {
         this.unsubscribeAllEvents();
     }
     fetchInitialData() {
-        return __awaiter$i(this, void 0, void 0, function* () {
+        return __awaiter$k(this, void 0, void 0, function* () {
             // If get properties fails we dont want to try to get the participants after.
-            yield this.asyncTeeErrorToEventEmitter(() => __awaiter$i(this, void 0, void 0, function* () {
+            yield this.asyncTeeErrorToEventEmitter(() => __awaiter$k(this, void 0, void 0, function* () {
                 var e_1, _a;
                 yield this.chatThreadClient.getProperties();
                 try {
@@ -19801,8 +19845,8 @@ class AzureCommunicationChatAdapter {
         this.context.offStateChange(handler);
     }
     sendMessage(content, options = {}) {
-        return __awaiter$i(this, void 0, void 0, function* () {
-            yield this.asyncTeeErrorToEventEmitter(() => __awaiter$i(this, void 0, void 0, function* () {
+        return __awaiter$k(this, void 0, void 0, function* () {
+            yield this.asyncTeeErrorToEventEmitter(() => __awaiter$k(this, void 0, void 0, function* () {
                 /* @conditional-compile-remove(file-sharing) */
                 options.metadata = Object.assign(Object.assign({}, options.metadata), convertFileUploadsUiStateToMessageMetadata(this.context.getState().fileUploads));
                 /* @conditional-compile-remove(file-sharing) */
@@ -19819,51 +19863,51 @@ class AzureCommunicationChatAdapter {
         });
     }
     sendReadReceipt(chatMessageId) {
-        return __awaiter$i(this, void 0, void 0, function* () {
-            yield this.asyncTeeErrorToEventEmitter(() => __awaiter$i(this, void 0, void 0, function* () {
+        return __awaiter$k(this, void 0, void 0, function* () {
+            yield this.asyncTeeErrorToEventEmitter(() => __awaiter$k(this, void 0, void 0, function* () {
                 yield this.handlers.onMessageSeen(chatMessageId);
             }));
         });
     }
     sendTypingIndicator() {
-        return __awaiter$i(this, void 0, void 0, function* () {
-            yield this.asyncTeeErrorToEventEmitter(() => __awaiter$i(this, void 0, void 0, function* () {
+        return __awaiter$k(this, void 0, void 0, function* () {
+            yield this.asyncTeeErrorToEventEmitter(() => __awaiter$k(this, void 0, void 0, function* () {
                 yield this.handlers.onTyping();
             }));
         });
     }
     removeParticipant(userId) {
-        return __awaiter$i(this, void 0, void 0, function* () {
-            yield this.asyncTeeErrorToEventEmitter(() => __awaiter$i(this, void 0, void 0, function* () {
+        return __awaiter$k(this, void 0, void 0, function* () {
+            yield this.asyncTeeErrorToEventEmitter(() => __awaiter$k(this, void 0, void 0, function* () {
                 yield this.handlers.onRemoveParticipant(userId);
             }));
         });
     }
     setTopic(topicName) {
-        return __awaiter$i(this, void 0, void 0, function* () {
-            yield this.asyncTeeErrorToEventEmitter(() => __awaiter$i(this, void 0, void 0, function* () {
+        return __awaiter$k(this, void 0, void 0, function* () {
+            yield this.asyncTeeErrorToEventEmitter(() => __awaiter$k(this, void 0, void 0, function* () {
                 yield this.handlers.updateThreadTopicName(topicName);
             }));
         });
     }
     loadPreviousChatMessages(messagesToLoad) {
-        return __awaiter$i(this, void 0, void 0, function* () {
-            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$i(this, void 0, void 0, function* () {
+        return __awaiter$k(this, void 0, void 0, function* () {
+            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$k(this, void 0, void 0, function* () {
                 return yield this.handlers.onLoadPreviousChatMessages(messagesToLoad);
             }));
         });
     }
     updateMessage(messageId, content, metadata, options) {
-        return __awaiter$i(this, void 0, void 0, function* () {
-            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$i(this, void 0, void 0, function* () {
+        return __awaiter$k(this, void 0, void 0, function* () {
+            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$k(this, void 0, void 0, function* () {
                 /* @conditional-compile-remove(file-sharing) */
                 return yield this.handlers.onUpdateMessage(messageId, content, metadata, options);
             }));
         });
     }
     deleteMessage(messageId) {
-        return __awaiter$i(this, void 0, void 0, function* () {
-            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$i(this, void 0, void 0, function* () {
+        return __awaiter$k(this, void 0, void 0, function* () {
+            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$k(this, void 0, void 0, function* () {
                 return yield this.handlers.onDeleteMessage(messageId);
             }));
         });
@@ -19898,8 +19942,8 @@ class AzureCommunicationChatAdapter {
     }
     /* @conditional-compile-remove(teams-inline-images-and-file-sharing) */
     downloadAttachments(options) {
-        return __awaiter$i(this, void 0, void 0, function* () {
-            return this.asyncTeeErrorToEventEmitter(() => __awaiter$i(this, void 0, void 0, function* () {
+        return __awaiter$k(this, void 0, void 0, function* () {
+            return this.asyncTeeErrorToEventEmitter(() => __awaiter$k(this, void 0, void 0, function* () {
                 if (this.credential === undefined) {
                     const e = new Error();
                     e['target'] = 'ChatThreadClient.getMessage';
@@ -19919,9 +19963,9 @@ class AzureCommunicationChatAdapter {
     }
     /* @conditional-compile-remove(teams-inline-images-and-file-sharing) */
     downloadAuthenticatedFile(accessToken, options) {
-        return __awaiter$i(this, void 0, void 0, function* () {
+        return __awaiter$k(this, void 0, void 0, function* () {
             function fetchWithAuthentication(url, token) {
-                return __awaiter$i(this, void 0, void 0, function* () {
+                return __awaiter$k(this, void 0, void 0, function* () {
                     const headers = new Headers();
                     headers.append('Authorization', `Bearer ${token}`);
                     try {
@@ -19993,7 +20037,7 @@ class AzureCommunicationChatAdapter {
         this.emitter.off(event, listener);
     }
     asyncTeeErrorToEventEmitter(f) {
-        return __awaiter$i(this, void 0, void 0, function* () {
+        return __awaiter$k(this, void 0, void 0, function* () {
             try {
                 return yield f();
             }
@@ -20035,7 +20079,7 @@ const convertEventType = (type) => {
  *
  * @public
  */
-const createAzureCommunicationChatAdapter = ({ endpoint: endpointUrl, userId, displayName, credential, threadId }) => __awaiter$i(void 0, void 0, void 0, function* () {
+const createAzureCommunicationChatAdapter = ({ endpoint: endpointUrl, userId, displayName, credential, threadId }) => __awaiter$k(void 0, void 0, void 0, function* () {
     if (!_isValidIdentifier(userId)) {
         throw new Error('Provided userId is invalid. Please provide valid identifier object.');
     }
@@ -20104,7 +20148,7 @@ beforeDispose) => {
         if (!credential || !displayName || !endpoint || !threadId || !userId) {
             return;
         }
-        (() => __awaiter$i(void 0, void 0, void 0, function* () {
+        (() => __awaiter$k(void 0, void 0, void 0, function* () {
             if (adapterRef.current) {
                 // Dispose the old adapter when a new one is created.
                 //
@@ -20136,7 +20180,7 @@ beforeDispose) => {
     // Dispose any existing adapter when the component unmounts.
     React.useEffect(() => {
         return () => {
-            (() => __awaiter$i(void 0, void 0, void 0, function* () {
+            (() => __awaiter$k(void 0, void 0, void 0, function* () {
                 if (adapterRef.current) {
                     if (beforeDisposeRef.current) {
                         yield beforeDisposeRef.current(adapterRef.current);
@@ -20160,7 +20204,7 @@ beforeDispose) => {
 function createAzureCommunicationChatAdapterFromClient(chatClient, chatThreadClient, 
 /* @conditional-compile-remove(teams-inline-images-and-file-sharing) */
 options) {
-    return __awaiter$i(this, void 0, void 0, function* () {
+    return __awaiter$k(this, void 0, void 0, function* () {
         return new AzureCommunicationChatAdapter(chatClient, chatThreadClient, 
         /* @conditional-compile-remove(teams-inline-images-and-file-sharing) */ options);
     });
@@ -20373,7 +20417,7 @@ const sendboxContainerStyles = {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$h = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$j = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -20394,7 +20438,7 @@ const AvatarPersona = (props) => {
     const { userId, dataProvider, text, imageUrl, imageInitials, initialsColor, initialsTextColor, showOverflowTooltip } = props;
     const [data, setData] = React.useState();
     React.useEffect(() => {
-        (() => __awaiter$h(void 0, void 0, void 0, function* () {
+        (() => __awaiter$j(void 0, void 0, void 0, function* () {
             if (dataProvider && userId) {
                 const newData = yield dataProvider(userId);
                 if (avatarDeepDifferenceCheck(data, newData)) {
@@ -20775,7 +20819,7 @@ const FileDownloadErrorBar = (props) => {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$g = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$i = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -20796,7 +20840,7 @@ const ChatScreen = (props) => {
     const theme = useTheme();
     React.useEffect(() => {
         // Initial data should be always fetched by the composite(or external caller) instead of the adapter
-        const fetchData = () => __awaiter$g(void 0, void 0, void 0, function* () {
+        const fetchData = () => __awaiter$i(void 0, void 0, void 0, function* () {
             // Fetch initial data for adapter
             yield adapter.fetchInitialData();
             // Fetch initial set of messages. Without fetching messages here, if the Composite's adapter is changed the message thread does not load new messages.
@@ -20830,7 +20874,7 @@ const ChatScreen = (props) => {
             setDownloadErrorMessage(errorMessage);
         } })), [fileSharing === null || fileSharing === void 0 ? void 0 : fileSharing.downloadHandler]);
     /* @conditional-compile-remove(teams-inline-images-and-file-sharing) */
-    const onRenderInlineAttachment = React.useCallback((attachment) => __awaiter$g(void 0, void 0, void 0, function* () {
+    const onRenderInlineAttachment = React.useCallback((attachment) => __awaiter$i(void 0, void 0, void 0, function* () {
         if (attachment.attachmentType === 'inlineImage' && attachment.previewUrl) {
             const blob = yield adapter.downloadAttachments({ attachmentUrls: [attachment.previewUrl] });
             return blob;
@@ -21065,7 +21109,7 @@ const END_CALL_PAGES = [
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$f = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$h = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -21295,7 +21339,7 @@ const isDisabled$2 = (option) => {
 /**
  * @returns Permissions state for the camera.
  */
-const queryCameraPermissionFromPermissionsAPI = () => __awaiter$f(void 0, void 0, void 0, function* () {
+const queryCameraPermissionFromPermissionsAPI = () => __awaiter$h(void 0, void 0, void 0, function* () {
     try {
         return (yield navigator.permissions.query({ name: 'camera' })).state;
     }
@@ -21308,7 +21352,7 @@ const queryCameraPermissionFromPermissionsAPI = () => __awaiter$f(void 0, void 0
 /**
  * @returns Permissions state for the microphone.
  */
-const queryMicrophonePermissionFromPermissionsAPI = () => __awaiter$f(void 0, void 0, void 0, function* () {
+const queryMicrophonePermissionFromPermissionsAPI = () => __awaiter$h(void 0, void 0, void 0, function* () {
     try {
         return (yield navigator.permissions.query({ name: 'microphone' })).state;
     }
@@ -21325,7 +21369,7 @@ const queryMicrophonePermissionFromPermissionsAPI = () => __awaiter$f(void 0, vo
  * If permission API is not supported on this browser, permission state is set to unsupported.
  * @private
  */
-const getDevicePermissionState = (setVideoState, setAudioState) => __awaiter$f(void 0, void 0, void 0, function* () {
+const getDevicePermissionState = (setVideoState, setAudioState) => __awaiter$h(void 0, void 0, void 0, function* () {
     const [cameraResult, microphoneResult] = yield Promise.all([
         queryCameraPermissionFromPermissionsAPI(),
         queryMicrophonePermissionFromPermissionsAPI()
@@ -21388,10 +21432,12 @@ const createParticipantModifier = (createModifiedParticipant) => {
 };
 /* @conditional-compile-remove(video-background-effects) */
 /** @private */
-const getBackgroundEffectFromSelectedEffect = (selectedEffect) => (selectedEffect === null || selectedEffect === void 0 ? void 0 : selectedEffect.effectName) === 'blur'
-    ? new communicationCallingEffects.BackgroundBlurEffect()
+const getBackgroundEffectFromSelectedEffect = (selectedEffect, VideoBackgroundEffectsDependency) => (selectedEffect === null || selectedEffect === void 0 ? void 0 : selectedEffect.effectName) === 'blur'
+    ? VideoBackgroundEffectsDependency.createBackgroundBlurEffect()
     : (selectedEffect === null || selectedEffect === void 0 ? void 0 : selectedEffect.effectName) === 'replacement'
-        ? new communicationCallingEffects.BackgroundReplacementEffect({ backgroundImageUrl: selectedEffect.backgroundImageUrl })
+        ? VideoBackgroundEffectsDependency.createBackgroundReplacementEffect({
+            backgroundImageUrl: selectedEffect.backgroundImageUrl
+        })
         : undefined;
 /**
  * @remarks this logic should mimic the onToggleCamera in the common call handlers.
@@ -21401,7 +21447,7 @@ const getSelectedCameraFromAdapterState = (state) => state.devices.selectedCamer
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$e = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$g = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -21420,112 +21466,112 @@ _component) => {
     return createCompositeHandlers(useAdapter());
 };
 const createCompositeHandlers = memoizeOne__default['default']((adapter) => ({
-    onCreateLocalStreamView: (options) => __awaiter$e(void 0, void 0, void 0, function* () {
+    onCreateLocalStreamView: (options) => __awaiter$g(void 0, void 0, void 0, function* () {
         return yield adapter.createStreamView(undefined, options);
     }),
-    onCreateRemoteStreamView: (userId, options) => __awaiter$e(void 0, void 0, void 0, function* () {
+    onCreateRemoteStreamView: (userId, options) => __awaiter$g(void 0, void 0, void 0, function* () {
         return yield adapter.createStreamView(userId, options);
     }),
-    onHangUp: (forEveryone) => __awaiter$e(void 0, void 0, void 0, function* () {
+    onHangUp: (forEveryone) => __awaiter$g(void 0, void 0, void 0, function* () {
         yield adapter.leaveCall(forEveryone);
     }),
     /* @conditional-compile-remove(PSTN-calls) */
-    onToggleHold: () => __awaiter$e(void 0, void 0, void 0, function* () {
+    onToggleHold: () => __awaiter$g(void 0, void 0, void 0, function* () {
         var _a;
         return ((_a = adapter.getState().call) === null || _a === void 0 ? void 0 : _a.state) === 'LocalHold' ? yield adapter.resumeCall() : yield adapter.holdCall();
     }),
     /* @conditional-compile-remove(PSTN-calls) */
-    onAddParticipant: (participant, options) => __awaiter$e(void 0, void 0, void 0, function* () {
+    onAddParticipant: (participant, options) => __awaiter$g(void 0, void 0, void 0, function* () {
         return yield adapter.addParticipant(participant, options);
     }),
     /* @conditional-compile-remove(PSTN-calls) */
-    onSendDtmfTone: (dtmfTone) => __awaiter$e(void 0, void 0, void 0, function* () {
+    onSendDtmfTone: (dtmfTone) => __awaiter$g(void 0, void 0, void 0, function* () {
         yield adapter.sendDtmfTone(dtmfTone);
     }),
-    onRemoveParticipant: (userId) => __awaiter$e(void 0, void 0, void 0, function* () {
+    onRemoveParticipant: (userId) => __awaiter$g(void 0, void 0, void 0, function* () {
         yield adapter.removeParticipant(userId);
     }),
-    onSelectCamera: (deviceInfo, options) => __awaiter$e(void 0, void 0, void 0, function* () {
+    onSelectCamera: (deviceInfo, options) => __awaiter$g(void 0, void 0, void 0, function* () {
         yield adapter.setCamera(deviceInfo, options);
     }),
-    onSelectMicrophone: (deviceInfo) => __awaiter$e(void 0, void 0, void 0, function* () {
+    onSelectMicrophone: (deviceInfo) => __awaiter$g(void 0, void 0, void 0, function* () {
         yield adapter.setMicrophone(deviceInfo);
     }),
-    onSelectSpeaker: (deviceInfo) => __awaiter$e(void 0, void 0, void 0, function* () {
+    onSelectSpeaker: (deviceInfo) => __awaiter$g(void 0, void 0, void 0, function* () {
         yield adapter.setSpeaker(deviceInfo);
     }),
     onStartCall: (participants, options) => {
         const rawIds = participants.map((participant) => toFlatCommunicationIdentifier(participant));
         return adapter.startCall(rawIds, options);
     },
-    onStartScreenShare: () => __awaiter$e(void 0, void 0, void 0, function* () {
+    onStartScreenShare: () => __awaiter$g(void 0, void 0, void 0, function* () {
         yield adapter.startScreenShare();
     }),
-    onStopScreenShare: () => __awaiter$e(void 0, void 0, void 0, function* () {
+    onStopScreenShare: () => __awaiter$g(void 0, void 0, void 0, function* () {
         yield adapter.stopScreenShare();
     }),
-    onToggleCamera: (options) => __awaiter$e(void 0, void 0, void 0, function* () {
+    onToggleCamera: (options) => __awaiter$g(void 0, void 0, void 0, function* () {
         isCameraOn(adapter.getState()) ? yield adapter.stopCamera() : yield adapter.startCamera(options);
     }),
-    onToggleMicrophone: () => __awaiter$e(void 0, void 0, void 0, function* () {
+    onToggleMicrophone: () => __awaiter$g(void 0, void 0, void 0, function* () {
         var _b;
         return ((_b = adapter.getState().call) === null || _b === void 0 ? void 0 : _b.isMuted) ? yield adapter.unmute() : yield adapter.mute();
     }),
-    onToggleScreenShare: () => __awaiter$e(void 0, void 0, void 0, function* () {
+    onToggleScreenShare: () => __awaiter$g(void 0, void 0, void 0, function* () {
         var _c;
         return ((_c = adapter.getState().call) === null || _c === void 0 ? void 0 : _c.isScreenSharingOn)
             ? yield adapter.stopScreenShare()
             : yield adapter.startScreenShare();
     }),
-    onStartLocalVideo: () => __awaiter$e(void 0, void 0, void 0, function* () {
+    onStartLocalVideo: () => __awaiter$g(void 0, void 0, void 0, function* () {
         if (adapter.getState().call) {
             return adapter.startCamera();
         }
     }),
-    onDisposeLocalStreamView: () => __awaiter$e(void 0, void 0, void 0, function* () {
+    onDisposeLocalStreamView: () => __awaiter$g(void 0, void 0, void 0, function* () {
         return adapter.disposeLocalVideoStreamView();
     }),
-    onDisposeRemoteStreamView: (userId) => __awaiter$e(void 0, void 0, void 0, function* () {
+    onDisposeRemoteStreamView: (userId) => __awaiter$g(void 0, void 0, void 0, function* () {
         return adapter.disposeStreamView(userId);
     }),
-    onDisposeRemoteScreenShareStreamView: (userId) => __awaiter$e(void 0, void 0, void 0, function* () {
+    onDisposeRemoteScreenShareStreamView: (userId) => __awaiter$g(void 0, void 0, void 0, function* () {
         return adapter.disposeScreenShareStreamView(userId);
     }),
-    onDisposeRemoteVideoStreamView: (userId) => __awaiter$e(void 0, void 0, void 0, function* () {
+    onDisposeRemoteVideoStreamView: (userId) => __awaiter$g(void 0, void 0, void 0, function* () {
         return adapter.disposeRemoteVideoStreamView(userId);
     }),
     /* @conditional-compile-remove(call-readiness) */
-    askDevicePermission: (constrain) => __awaiter$e(void 0, void 0, void 0, function* () {
+    askDevicePermission: (constrain) => __awaiter$g(void 0, void 0, void 0, function* () {
         return adapter.askDevicePermission(constrain);
     }),
     /* @conditional-compile-remove(video-background-effects) */
-    onRemoveVideoBackgroundEffects: () => __awaiter$e(void 0, void 0, void 0, function* () {
+    onRemoveVideoBackgroundEffects: () => __awaiter$g(void 0, void 0, void 0, function* () {
         return yield adapter.stopVideoBackgroundEffects();
     }),
     /* @conditional-compile-remove(video-background-effects) */
-    onBlurVideoBackground: (backgroundBlurConfig) => __awaiter$e(void 0, void 0, void 0, function* () {
+    onBlurVideoBackground: (backgroundBlurConfig) => __awaiter$g(void 0, void 0, void 0, function* () {
         const blurConfig = Object.assign({ effectName: 'blur' }, backgroundBlurConfig);
         return yield adapter.startVideoBackgroundEffect(blurConfig);
     }),
     /* @conditional-compile-remove(video-background-effects) */
-    onReplaceVideoBackground: (backgroundReplacementConfig) => __awaiter$e(void 0, void 0, void 0, function* () {
+    onReplaceVideoBackground: (backgroundReplacementConfig) => __awaiter$g(void 0, void 0, void 0, function* () {
         const replacementConfig = Object.assign({ effectName: 'replacement' }, backgroundReplacementConfig);
         return yield adapter.startVideoBackgroundEffect(replacementConfig);
     }),
     /* @conditional-compile-remove(close-captions) */
-    onStartCaptions: (options) => __awaiter$e(void 0, void 0, void 0, function* () {
+    onStartCaptions: (options) => __awaiter$g(void 0, void 0, void 0, function* () {
         yield adapter.startCaptions(options);
     }),
     /* @conditional-compile-remove(close-captions) */
-    onStopCaptions: () => __awaiter$e(void 0, void 0, void 0, function* () {
+    onStopCaptions: () => __awaiter$g(void 0, void 0, void 0, function* () {
         yield adapter.stopCaptions();
     }),
     /* @conditional-compile-remove(close-captions) */
-    onSetSpokenLanguage: (language) => __awaiter$e(void 0, void 0, void 0, function* () {
+    onSetSpokenLanguage: (language) => __awaiter$g(void 0, void 0, void 0, function* () {
         yield adapter.setSpokenLanguage(language);
     }),
     /* @conditional-compile-remove(close-captions) */
-    onSetCaptionLanguage: (language) => __awaiter$e(void 0, void 0, void 0, function* () {
+    onSetCaptionLanguage: (language) => __awaiter$g(void 0, void 0, void 0, function* () {
         yield adapter.setCaptionLanguage(language);
     })
 }));
@@ -21656,7 +21702,7 @@ const MoreButton = (props) => {
     return (React__default['default'].createElement(ControlBarButton, Object.assign({}, props, { labelKey: 'optionsButtonLabelKey', showLabel: props.showLabel, onRenderOnIcon: icon$2, onRenderOffIcon: icon$2, onClick: props.onClick, "data-ui-id": props['data-ui-id'] })));
 };
 
-var __awaiter$d = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$f = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -21684,7 +21730,7 @@ const CaptionsBannerMoreButton = (props) => {
     /* @conditional-compile-remove(close-captions) */
     const moreButtonContextualMenuItems = [];
     /* @conditional-compile-remove(close-captions) */
-    const startCaptions = React.useCallback(() => __awaiter$d(void 0, void 0, void 0, function* () {
+    const startCaptions = React.useCallback(() => __awaiter$f(void 0, void 0, void 0, function* () {
         yield startCaptionsButtonHandlers.onStartCaptions({
             spokenLanguage: startCaptionsButtonProps.currentSpokenLanguage
         });
@@ -21826,7 +21872,7 @@ const Camera = (props) => {
             props.disabled ||
             /* @conditional-compile-remove(rooms) */ (isRoomsCall && ((_a = adapter.getState().call) === null || _a === void 0 ? void 0 : _a.role) === 'Unknown'), 
         /* @conditional-compile-remove(video-background-effects) */
-        onShowVideoEffectsPicker: props.onShowVideoEffectsPicker })));
+        onShowVideoEffectsPicker: props.onShowVideoEffectsPicker, componentRef: props.componentRef })));
 };
 
 // Copyright (c) Microsoft Corporation.
@@ -22551,7 +22597,7 @@ const onFetchCustomButtonPropsTrampoline = (options) => {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$c = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$e = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -22574,7 +22620,7 @@ const DesktopMoreButton = (props) => {
     /* @conditional-compile-remove(close-captions) */
     const startCaptionsButtonHandlers = useHandlers();
     /* @conditional-compile-remove(close-captions) */
-    const startCaptions = React.useCallback(() => __awaiter$c(void 0, void 0, void 0, function* () {
+    const startCaptions = React.useCallback(() => __awaiter$e(void 0, void 0, void 0, function* () {
         yield startCaptionsButtonHandlers.onStartCaptions({
             spokenLanguage: startCaptionsButtonProps.currentSpokenLanguage
         });
@@ -22875,7 +22921,7 @@ const CommonCallControlBar = (props) => {
                                         /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */
                                         disabled: props.disableButtonsForHoldScreen || isDisabled$2(options.cameraButton), 
                                         /* @conditional-compile-remove(video-background-effects) */
-                                        onShowVideoEffectsPicker: props.onShowVideoEffectsPicker })),
+                                        onShowVideoEffectsPicker: props.onShowVideoEffectsPicker, componentRef: props.cameraButtonRef })),
                                     screenShareButtonIsEnabled && (React__default['default'].createElement(ScreenShare, { option: options.screenShareButton, displayType: options.displayType, styles: screenShareButtonStyles, 
                                         /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */
                                         disabled: props.disableButtonsForHoldScreen || isDisabled$2(options.screenShareButton) })), (_a = customButtons['primary']) === null || _a === void 0 ? void 0 :
@@ -22900,7 +22946,7 @@ const CommonCallControlBar = (props) => {
                     React__default['default'].createElement(react.Stack, { horizontal: true, className: !props.mobileView ? react.mergeStyles(desktopButtonContainerStyle) : undefined },
                         isEnabled$1(options === null || options === void 0 ? void 0 : options.peopleButton) && (React__default['default'].createElement(PeopleButton, { checked: props.peopleButtonChecked, ariaLabel: peopleButtonStrings === null || peopleButtonStrings === void 0 ? void 0 : peopleButtonStrings.label, showLabel: options.displayType !== 'compact', onClick: props.onPeopleButtonClicked, "data-ui-id": "common-call-composite-people-button", disabled: props.disableButtonsForLobbyPage ||
                                 props.disableButtonsForHoldScreen ||
-                                isDisabled$2(options.peopleButton), strings: peopleButtonStrings, styles: commonButtonStyles })), (_b = customButtons['secondary']) === null || _b === void 0 ? void 0 :
+                                isDisabled$2(options.peopleButton), strings: peopleButtonStrings, styles: commonButtonStyles, componentRef: props.peopleButtonRef })), (_b = customButtons['secondary']) === null || _b === void 0 ? void 0 :
                         _b.slice(0, CUSTOM_BUTTON_OPTIONS.MAX_SECONDARY_DESKTOP_CUSTOM_BUTTONS).map((CustomButton, i) => {
                             return (React__default['default'].createElement(CustomButton, { key: `secondary-custom-button-${i}`, styles: commonButtonStyles, showLabel: options.displayType !== 'compact' }));
                         }))))))));
@@ -23138,7 +23184,7 @@ const themedToggleButtonStyle = (theme, checked) => {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$b = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$d = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -23278,7 +23324,7 @@ const MoreDrawer = (props) => {
     /* @conditional-compile-remove(close-captions) */
     const [currentSpokenLanguage, setCurrentSpokenLanguage] = React.useState(startCaptionsButtonProps.currentSpokenLanguage);
     /* @conditional-compile-remove(close-captions) */
-    const onToggleChange = React.useCallback(() => __awaiter$b(void 0, void 0, void 0, function* () {
+    const onToggleChange = React.useCallback(() => __awaiter$d(void 0, void 0, void 0, function* () {
         if (!startCaptionsButtonProps.checked) {
             yield startCaptionsButtonHandlers.onStartCaptions({
                 spokenLanguage: currentSpokenLanguage
@@ -23967,7 +24013,7 @@ const AddPeopleButton = (props) => {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$a = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$c = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -23989,11 +24035,11 @@ const PeoplePaneContent = (props) => {
         return localeStrings.strings.call;
     };
     const strings = getStrings();
-    const removeParticipantFromCall = React.useCallback((participantId) => __awaiter$a(void 0, void 0, void 0, function* () {
+    const removeParticipantFromCall = React.useCallback((participantId) => __awaiter$c(void 0, void 0, void 0, function* () {
         yield adapter.removeParticipant(participantId);
     }), [adapter]);
     /* @conditional-compile-remove(PSTN-calls) */
-    const addParticipantToCall = React.useCallback((participant, options) => __awaiter$a(void 0, void 0, void 0, function* () {
+    const addParticipantToCall = React.useCallback((participant, options) => __awaiter$c(void 0, void 0, void 0, function* () {
         yield adapter.addParticipant(participant, options);
     }), [adapter]);
     /* @conditional-compile-remove(PSTN-calls) */
@@ -24020,7 +24066,7 @@ const PeoplePaneContent = (props) => {
         setDrawerMenuItems
     ]);
     const participantListProps = React.useMemo(() => {
-        const onRemoveAParticipant = (participantId) => __awaiter$a(void 0, void 0, void 0, function* () { return removeParticipantFromCall(participantId); });
+        const onRemoveAParticipant = (participantId) => __awaiter$c(void 0, void 0, void 0, function* () { return removeParticipantFromCall(participantId); });
         return Object.assign(Object.assign({}, participantListDefaultProps), { 
             // Passing undefined callback for mobile to avoid context menus for participants in ParticipantList are clicked
             onRemoveParticipant: props.mobileView ? undefined : onRemoveAParticipant, 
@@ -24082,10 +24128,12 @@ const hasRemoveParticipantsPermissionTrampoline = (adapter) => {
 const PEOPLE_SIDE_PANE_ID = 'people';
 /** @private */
 const usePeoplePane = (props) => {
-    const { updateSidePaneRenderer, inviteLink, onFetchAvatarPersonaData, onFetchParticipantMenuItems, setDrawerMenuItems, mobileView } = props;
+    const { updateSidePaneRenderer, inviteLink, onFetchAvatarPersonaData, onFetchParticipantMenuItems, setDrawerMenuItems, mobileView, peopleButtonRef } = props;
     const closePane = React.useCallback(() => {
+        var _a;
         updateSidePaneRenderer(undefined);
-    }, [updateSidePaneRenderer]);
+        (_a = peopleButtonRef === null || peopleButtonRef === void 0 ? void 0 : peopleButtonRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+    }, [peopleButtonRef, updateSidePaneRenderer]);
     const localeStrings = localeTrampoline(useLocale());
     const onRenderHeader = React.useCallback(() => (React__default['default'].createElement(SidePaneHeader, { onClose: closePane, headingText: localeStrings.peoplePaneTitle, dismissSidePaneButtonAriaLabel: localeStrings.dismissSidePaneButtonLabel, mobileView: mobileView !== null && mobileView !== void 0 ? mobileView : false })), [mobileView, closePane, localeStrings]);
     const onRenderContent = React.useCallback(() => {
@@ -24154,7 +24202,7 @@ const localVideoSelector = reselect__namespace.createSelector([callStatusSelecto
     };
 });
 
-var __awaiter$9 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$b = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -24223,7 +24271,7 @@ const VideoEffectsPaneContent = (props) => {
         return videoEffects;
     }, [strings, adapter]);
     /* @conditional-compile-remove(video-background-effects) */
-    const onEffectChange = React.useCallback((effectKey) => __awaiter$9(void 0, void 0, void 0, function* () {
+    const onEffectChange = React.useCallback((effectKey) => __awaiter$b(void 0, void 0, void 0, function* () {
         if (effectKey === 'blur') {
             const blurEffect = {
                 effectName: effectKey
@@ -24304,10 +24352,12 @@ const VIDEO_EFFECTS_SIDE_PANE_ID = 'videoeffects';
 /** @private */
 const VIDEO_EFFECTS_SIDE_PANE_WIDTH_REM = 17.5;
 /** @private */
-const useVideoEffectsPane = (updateSidePaneRenderer, mobileView, latestErrors, onDismissError) => {
+const useVideoEffectsPane = (updateSidePaneRenderer, mobileView, latestErrors, onDismissError, cameraButtonRef) => {
     const closePane = React.useCallback(() => {
+        var _a;
         updateSidePaneRenderer(undefined);
-    }, [updateSidePaneRenderer]);
+        (_a = cameraButtonRef === null || cameraButtonRef === void 0 ? void 0 : cameraButtonRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+    }, [cameraButtonRef, updateSidePaneRenderer]);
     /* @conditional-compile-remove(video-background-effects) */
     const locale = useLocale();
     const onRenderHeader = React.useCallback(() => {
@@ -24640,6 +24690,8 @@ const CallArrangement = (props) => {
     }, [props.mobileView]);
     const theme = useTheme();
     const callGalleryStyles = React.useMemo(() => galleryParentContainerStyles(theme.palette.neutralLighterAlt), [theme.palette.neutralLighterAlt]);
+    const peopleButtonRef = React.useRef(null);
+    const cameraButtonRef = React.useRef(null);
     const containerRef = React.useRef(null);
     const containerWidth = _useContainerWidth(containerRef);
     const containerHeight = _useContainerHeight(containerRef);
@@ -24665,7 +24717,8 @@ const CallArrangement = (props) => {
             /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */
             onFetchAvatarPersonaData: props.onFetchAvatarPersonaData,
             onFetchParticipantMenuItems: (_a = props.callControlProps) === null || _a === void 0 ? void 0 : _a.onFetchParticipantMenuItems,
-            mobileView: props.mobileView
+            mobileView: props.mobileView,
+            peopleButtonRef
         });
     }, [
         updateSidePaneRenderer,
@@ -24673,7 +24726,8 @@ const CallArrangement = (props) => {
         (_a = props.callControlProps) === null || _a === void 0 ? void 0 : _a.onFetchParticipantMenuItems,
         /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */
         props.onFetchAvatarPersonaData,
-        props.mobileView
+        props.mobileView,
+        peopleButtonRef
     ]);
     const { isPeoplePaneOpen, openPeoplePane, closePeoplePane } = usePeoplePane(peoplePaneProps);
     const togglePeoplePane = React.useCallback(() => {
@@ -24704,7 +24758,9 @@ const CallArrangement = (props) => {
         placeholderText: callWithChatStrings.dtmfDialpadPlaceholderText
     }), [callWithChatStrings]);
     /* @conditional-compile-remove(video-background-effects) */
-    const { openVideoEffectsPane } = useVideoEffectsPane(props.updateSidePaneRenderer, props.mobileView, props.latestErrors, props.onDismissError);
+    const onResolveVideoEffectDependency = adapter.getState().onResolveVideoEffectDependency;
+    /* @conditional-compile-remove(video-background-effects) */
+    const { openVideoEffectsPane } = useVideoEffectsPane(props.updateSidePaneRenderer, props.mobileView, props.latestErrors, props.onDismissError, cameraButtonRef);
     const [showDrawer, setShowDrawer] = React.useState(false);
     const onMoreButtonClicked = React.useCallback(() => {
         setShowDrawer(true);
@@ -24771,9 +24827,9 @@ const CallArrangement = (props) => {
                     /* @conditional-compile-remove(close-captions) */
                     isCaptionsSupported: isTeamsCall && hasJoinedCall, 
                     /* @conditional-compile-remove(video-background-effects) */
-                    onShowVideoEffectsPicker: openVideoEffectsPane, 
+                    onShowVideoEffectsPicker: onResolveVideoEffectDependency ? openVideoEffectsPane : undefined, 
                     /* @conditional-compile-remove(PSTN-calls) */
-                    onClickShowDialpad: alternateCallerId ? onClickShowDialpad : undefined, displayVertical: verticalControlBar }))))),
+                    onClickShowDialpad: alternateCallerId ? onClickShowDialpad : undefined, displayVertical: verticalControlBar, peopleButtonRef: peopleButtonRef, cameraButtonRef: cameraButtonRef }))))),
                 ((_e = props.callControlProps) === null || _e === void 0 ? void 0 : _e.options) !== false && showDrawer && (React__default['default'].createElement(react.Stack, { styles: drawerContainerStylesValue },
                     React__default['default'].createElement(PreparedMoreDrawer, { callControls: props.callControlProps.options, onLightDismiss: closeDrawer, onPeopleButtonClicked: onMoreDrawerPeopleClicked, 
                         /* @conditional-compile-remove(PSTN-calls) */
@@ -25612,8 +25668,10 @@ const LocalDeviceSettings = (props) => {
     var _a, _b;
     const theme = useTheme();
     const locale = useLocale();
-    /* @conditional-compile-remove(call-readiness) */ /* @conditional-compile-remove(rooms) */
+    /* @conditional-compile-remove(call-readiness) */ /* @conditional-compile-remove(video-background-effects) */ /* @conditional-compile-remove(rooms) */
     const adapter = useAdapter();
+    /* @conditional-compile-remove(video-background-effects) */
+    const onResolveVideoEffectDependency = adapter.getState().onResolveVideoEffectDependency;
     const defaultPlaceHolder = locale.strings.call.defaultPlaceHolder;
     const cameraLabel = locale.strings.call.cameraLabel;
     const soundLabel = locale.strings.call.soundLabel;
@@ -25673,7 +25731,7 @@ const LocalDeviceSettings = (props) => {
             React__default['default'].createElement(react.Stack, { horizontal: true, horizontalAlign: "space-between", styles: cameraAndVideoEffectsContainerStyleDesktop },
                 React__default['default'].createElement(react.Label, { id: 'call-composite-local-camera-settings-label', className: react.mergeStyles(dropDownStyles(theme).label), disabled: !cameraPermissionGranted }, cameraLabel),
                 /* @conditional-compile-remove(video-background-effects) */
-                React__default['default'].createElement(react.DefaultButton, { iconProps: { iconName: 'ConfigurationScreenVideoEffectsButton' }, styles: effectsButtonStyles(theme), onClick: props.onVideoEffectsClick, "data-ui-id": 'call-config-video-effects-button' }, locale.strings.call.configurationPageVideoEffectsButtonLabel)),
+                onResolveVideoEffectDependency && (React__default['default'].createElement(react.DefaultButton, { iconProps: { iconName: 'ConfigurationScreenVideoEffectsButton' }, styles: effectsButtonStyles(theme), onClick: props.onVideoEffectsClick, "data-ui-id": 'call-config-video-effects-button' }, locale.strings.call.configurationPageVideoEffectsButtonLabel))),
             React__default['default'].createElement(ConfigurationPageCameraDropdown, { cameraGrantedDropdown: cameraGrantedDropdown, cameraPermissionGranted: cameraPermissionGranted !== null && cameraPermissionGranted !== void 0 ? cameraPermissionGranted : false, 
                 /* @conditional-compile-remove(call-readiness) */
                 dropdownProps: dropdownProps, 
@@ -25813,7 +25871,7 @@ const localPreviewButtonStyle = {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$8 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$a = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -25833,7 +25891,7 @@ const LocalPreview = (props) => {
     const { audio: microphonePermissionGranted, video: cameraPermissionGranted } = useSelector$1(devicePermissionSelector);
     const isLocalMicrophoneEnabled = useSelector$1(getLocalMicrophoneEnabled);
     const adapter = useAdapter();
-    const onToggleMic = React.useCallback(() => __awaiter$8(void 0, void 0, void 0, function* () {
+    const onToggleMic = React.useCallback(() => __awaiter$a(void 0, void 0, void 0, function* () {
         isLocalMicrophoneEnabled ? adapter.mute() : adapter.unmute();
     }), [adapter, isLocalMicrophoneEnabled]);
     const hasNoDevices = devicesButtonProps.cameras.length === 0 &&
@@ -26101,7 +26159,7 @@ const CallReadinessModalFallBack = (props) => {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$7 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$9 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -26210,7 +26268,7 @@ const ConfigurationPage = (props) => {
     const forceShowingCheckPermissions = !minimumFallbackTimerElapsed;
     /* @conditional-compile-remove(video-background-effects) */
     const { toggleVideoEffectsPane, closeVideoEffectsPane, isVideoEffectsPaneOpen } = useVideoEffectsPane(props.updateSidePaneRenderer, mobileView, props.latestErrors, props.onDismissError);
-    const startCall = React.useCallback(() => __awaiter$7(void 0, void 0, void 0, function* () {
+    const startCall = React.useCallback(() => __awaiter$9(void 0, void 0, void 0, function* () {
         /* @conditional-compile-remove(video-background-effects) */
         closeVideoEffectsPane();
         startCallHandler();
@@ -26696,7 +26754,7 @@ const holdPaneContentStyles = {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$6 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$8 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -26731,7 +26789,7 @@ const HoldPane = () => {
         React__default['default'].createElement(react.Stack, { horizontal: true, styles: holdPaneContentStyles },
             React__default['default'].createElement(react.Text, { styles: holdPaneTimerStyles }, elapsedTime),
             React__default['default'].createElement(react.Text, { styles: holdPaneLabelStyles }, strings.holdScreenLabel),
-            React__default['default'].createElement(react.PrimaryButton, { text: !resumingCall ? strings.resumeCallButtonLabel : strings.resumingCallButtonLabel, ariaLabel: !resumingCall ? strings.resumeCallButtonAriaLabel : strings.resumingCallButtonAriaLabel, styles: resumeButtonStyles, disabled: resumingCall, onClick: () => __awaiter$6(void 0, void 0, void 0, function* () {
+            React__default['default'].createElement(react.PrimaryButton, { text: !resumingCall ? strings.resumeCallButtonLabel : strings.resumingCallButtonLabel, ariaLabel: !resumingCall ? strings.resumeCallButtonAriaLabel : strings.resumingCallButtonAriaLabel, styles: resumeButtonStyles, disabled: resumingCall, onClick: () => __awaiter$8(void 0, void 0, void 0, function* () {
                     setResumingCall(true);
                     try {
                         /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */
@@ -26845,7 +26903,7 @@ const containerStyles = {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$5 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$7 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -26898,10 +26956,10 @@ const MainScreen = (props) => {
     /* @conditional-compile-remove(rooms) */
     switch (page) {
         case 'roomNotFound':
-            pageElement = (React__default['default'].createElement(NoticePage, { iconName: "NoticePageInvalidRoom", title: locale.strings.call.roomNotFoundTitle, moreDetails: locale.strings.call.roomNotFoundDetails, dataUiId: 'room-not-found-page' }));
+            pageElement = (React__default['default'].createElement(NoticePage, { iconName: "NoticePageAccessDeniedRoomsCall", title: locale.strings.call.roomNotFoundTitle, moreDetails: locale.strings.call.roomNotFoundDetails, dataUiId: 'room-not-found-page' }));
             break;
         case 'deniedPermissionToRoom':
-            pageElement = (React__default['default'].createElement(NoticePage, { iconName: "NoticePageInvalidRoom", title: locale.strings.call.deniedPermissionToRoomTitle, moreDetails: locale.strings.call.deniedPermissionToRoomDetails, dataUiId: 'not-invited-to-room-page' }));
+            pageElement = (React__default['default'].createElement(NoticePage, { iconName: "NoticePageAccessDeniedRoomsCall", title: locale.strings.call.deniedPermissionToRoomTitle, moreDetails: locale.strings.call.deniedPermissionToRoomDetails, dataUiId: 'not-invited-to-room-page' }));
             break;
     }
     switch (page) {
@@ -26975,7 +27033,7 @@ const CallComposite = (props) => React__default['default'].createElement(CallCom
 const CallCompositeInner = (props) => {
     const { adapter, callInvitationUrl, onFetchAvatarPersonaData, onFetchParticipantMenuItems, options, formFactor = 'desktop' } = props;
     React.useEffect(() => {
-        (() => __awaiter$5(void 0, void 0, void 0, function* () {
+        (() => __awaiter$7(void 0, void 0, void 0, function* () {
             var _a;
             const constrain = getQueryOptions({
                 /* @conditional-compile-remove(rooms) */ role: (_a = adapter.getState().call) === null || _a === void 0 ? void 0 : _a.role
@@ -27138,21 +27196,27 @@ class DiagnosticsForwarder {
  *
  * This is used to create correct handler for generic agent type
  */
-const createHandlers = (callClient, callAgent, deviceManager, call) => {
+function createHandlers(callClient, callAgent, deviceManager, call, 
+/* @conditional-compile-remove(video-background-effects) */
+options) {
     // Call can be either undefined or ACS Call
     if (_isACSCallAgent(callAgent) && (!call || (call && _isACSCall(call)))) {
-        return createDefaultCallingHandlers(callClient, callAgent, deviceManager, call);
+        return createDefaultCallingHandlers(callClient, callAgent, deviceManager, call, 
+        /* @conditional-compile-remove(video-background-effects) */
+        options);
     }
     /* @conditional-compile-remove(teams-identity-support) */
     if (_isTeamsCallAgent(callAgent) && (!call || (call && _isTeamsCall(call)))) {
-        return createDefaultTeamsCallingHandlers(callClient, callAgent, deviceManager, call);
+        return createDefaultTeamsCallingHandlers(callClient, callAgent, deviceManager, call, 
+        /* @conditional-compile-remove(video-background-effects) */
+        options);
     }
     throw new Error('Unhandled agent type');
-};
+}
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$4 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$6 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -27169,7 +27233,7 @@ const createProfileStateModifier = (onFetchProfile, notifyUpdate) => {
     return (state) => {
         var _a;
         const originalParticipants = (_a = state.call) === null || _a === void 0 ? void 0 : _a.remoteParticipants;
-        (() => __awaiter$4(void 0, void 0, void 0, function* () {
+        (() => __awaiter$6(void 0, void 0, void 0, function* () {
             let shouldNotifyUpdates = false;
             for (const key in originalParticipants) {
                 if (cachedDisplayName[key]) {
@@ -27196,7 +27260,7 @@ const createProfileStateModifier = (onFetchProfile, notifyUpdate) => {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$3 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$5 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -27210,7 +27274,7 @@ class CallContext {
     constructor(clientState, isTeamsCall, 
     /* @conditional-compile-remove(rooms) */
     isRoomsCall, options) {
-        var _a, _b;
+        var _a, _b, _c, _d;
         this.emitter = new EventEmitter.EventEmitter();
         this.state = {
             isLocalPreviewMicrophoneEnabled: false,
@@ -27225,11 +27289,13 @@ class CallContext {
             /* @conditional-compile-remove(PSTN-calls) */ alternateCallerId: clientState.alternateCallerId,
             /* @conditional-compile-remove(unsupported-browser) */ environmentInfo: clientState.environmentInfo,
             /* @conditional-compile-remove(unsupported-browser) */ unsupportedBrowserVersionsAllowed: false,
-            /* @conditional-compile-remove(video-background-effects) */ videoBackgroundImages: options === null || options === void 0 ? void 0 : options.videoBackgroundImages,
+            /* @conditional-compile-remove(video-background-effects) */ videoBackgroundImages: (_b = options === null || options === void 0 ? void 0 : options.videoBackgroundOptions) === null || _b === void 0 ? void 0 : _b.videoBackgroundImages,
+            /* @conditional-compile-remove(video-background-effects) */
+            onResolveVideoEffectDependency: (_c = options === null || options === void 0 ? void 0 : options.videoBackgroundOptions) === null || _c === void 0 ? void 0 : _c.onResolveDependency,
             /* @conditional-compile-remove(video-background-effects) */ selectedVideoBackgroundEffect: undefined,
             cameraStatus: undefined
         };
-        this.emitter.setMaxListeners((_b = options === null || options === void 0 ? void 0 : options.maxListeners) !== null && _b !== void 0 ? _b : 50);
+        this.emitter.setMaxListeners((_d = options === null || options === void 0 ? void 0 : options.maxListeners) !== null && _d !== void 0 ? _d : 50);
         this.bindPublicMethods();
         this.displayNameModifier = (options === null || options === void 0 ? void 0 : options.onFetchProfile)
             ? createProfileStateModifier(options.onFetchProfile, () => {
@@ -27353,6 +27419,7 @@ const findLatestAcceptedTransfer = (acceptedTransfers) => {
  */
 class AzureCommunicationCallAdapter {
     constructor(callClient, locator, callAgent, deviceManager, options) {
+        var _a;
         this.participantSubscribers = new Map();
         this.emitter = new EventEmitter.EventEmitter();
         this.isMyMutedChanged = () => {
@@ -27370,6 +27437,8 @@ class AzureCommunicationCallAdapter {
         const isTeamsMeeting = 'meetingLink' in this.locator;
         /* @conditional-compile-remove(rooms) */
         const isRoomsCall = 'roomId' in this.locator;
+        /* @conditional-compile-remove(video-background-effects) */
+        this.onResolveVideoBackgroundEffectsDependency = (_a = options === null || options === void 0 ? void 0 : options.videoBackgroundOptions) === null || _a === void 0 ? void 0 : _a.onResolveDependency;
         this.context = new CallContext(callClient.getState(), isTeamsMeeting, 
         /* @conditional-compile-remove(rooms) */ isRoomsCall, 
         /* @conditional-compile-remove(video-background-effects) */ options);
@@ -27416,7 +27485,10 @@ class AzureCommunicationCallAdapter {
                 }
             }
         };
-        this.handlers = createHandlers(callClient, callAgent, deviceManager, undefined);
+        this.handlers = createHandlers(callClient, callAgent, deviceManager, undefined, 
+        /* @conditional-compile-remove(video-background-effects) */ {
+            onResolveVideoBackgroundEffectsDependency: this.onResolveVideoBackgroundEffectsDependency
+        });
         this.onClientStateChange = onStateChange;
         this.subscribeDeviceManagerEvents();
         this.callClient.onStateChange(onStateChange);
@@ -27534,9 +27606,9 @@ class AzureCommunicationCallAdapter {
         this.callAgent.dispose();
     }
     queryCameras() {
-        return __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
             const startTime = new Date().getTime();
-            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$3(this, void 0, void 0, function* () {
+            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$5(this, void 0, void 0, function* () {
                 const cameras = yield this.deviceManager.getCameras();
                 const endTime = new Date().getTime();
                 compositeLogger.info('time to query cameras', endTime - startTime, 'ms');
@@ -27545,9 +27617,9 @@ class AzureCommunicationCallAdapter {
         });
     }
     queryMicrophones() {
-        return __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
             const startTime = new Date().getTime();
-            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$3(this, void 0, void 0, function* () {
+            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$5(this, void 0, void 0, function* () {
                 const microphones = yield this.deviceManager.getMicrophones();
                 const endTime = new Date().getTime();
                 compositeLogger.info('time to query microphones', endTime - startTime, 'ms');
@@ -27556,9 +27628,9 @@ class AzureCommunicationCallAdapter {
         });
     }
     querySpeakers() {
-        return __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
             const startTime = new Date().getTime();
-            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$3(this, void 0, void 0, function* () {
+            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$5(this, void 0, void 0, function* () {
                 const speakers = (yield this.deviceManager.isSpeakerSelectionAvailable) ? this.deviceManager.getSpeakers() : [];
                 const endTime = new Date().getTime();
                 compositeLogger.info('time to query speakers', endTime - startTime, 'ms');
@@ -27567,9 +27639,9 @@ class AzureCommunicationCallAdapter {
         });
     }
     askDevicePermission(constrain) {
-        return __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
             const startTime = new Date().getTime();
-            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$3(this, void 0, void 0, function* () {
+            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$5(this, void 0, void 0, function* () {
                 yield this.deviceManager.askDevicePermission(constrain);
                 const endTime = new Date().getTime();
                 compositeLogger.info('time to query askDevicePermissions', endTime - startTime, 'ms');
@@ -27660,7 +27732,7 @@ class AzureCommunicationCallAdapter {
         });
     }
     createStreamView(remoteUserId, options) {
-        return __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
             if (remoteUserId === undefined) {
                 return yield this.handlers.onCreateLocalStreamView(options);
             }
@@ -27670,7 +27742,7 @@ class AzureCommunicationCallAdapter {
         });
     }
     disposeStreamView(remoteUserId) {
-        return __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
             if (remoteUserId === undefined) {
                 yield this.handlers.onDisposeLocalStreamView();
             }
@@ -27680,25 +27752,28 @@ class AzureCommunicationCallAdapter {
         });
     }
     disposeScreenShareStreamView(remoteUserId) {
-        return __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
             yield this.handlers.onDisposeRemoteScreenShareStreamView(remoteUserId);
         });
     }
     disposeRemoteVideoStreamView(remoteUserId) {
-        return __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
             yield this.handlers.onDisposeRemoteVideoStreamView(remoteUserId);
         });
     }
     disposeLocalVideoStreamView() {
-        return __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
             yield this.handlers.onDisposeLocalStreamView();
         });
     }
     leaveCall(forEveryone) {
-        return __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
             yield this.handlers.onHangUp(forEveryone);
             this.unsubscribeCallEvents();
-            this.handlers = createHandlers(this.callClient, this.callAgent, this.deviceManager, undefined);
+            this.handlers = createHandlers(this.callClient, this.callAgent, this.deviceManager, undefined, 
+            /* @conditional-compile-remove(video-background-effects) */ {
+                onResolveVideoBackgroundEffectsDependency: this.onResolveVideoBackgroundEffectsDependency
+            });
             // We set the adapter.call object to undefined immediately when a call is ended.
             // We do not set the context.callId to undefined because it is a part of the immutable data flow loop.
             this.call = undefined;
@@ -27707,29 +27782,29 @@ class AzureCommunicationCallAdapter {
         });
     }
     setCamera(device, options) {
-        return __awaiter$3(this, void 0, void 0, function* () {
-            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
+            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$5(this, void 0, void 0, function* () {
                 yield this.handlers.onSelectCamera(device, options);
             }));
         });
     }
     setMicrophone(device) {
-        return __awaiter$3(this, void 0, void 0, function* () {
-            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
+            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$5(this, void 0, void 0, function* () {
                 yield this.handlers.onSelectMicrophone(device);
             }));
         });
     }
     setSpeaker(device) {
-        return __awaiter$3(this, void 0, void 0, function* () {
-            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
+            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$5(this, void 0, void 0, function* () {
                 yield this.handlers.onSelectSpeaker(device);
             }));
         });
     }
     startCamera(options) {
-        return __awaiter$3(this, void 0, void 0, function* () {
-            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
+            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$5(this, void 0, void 0, function* () {
                 if (!isCameraOn(this.getState())) {
                     // First kick off the effect on the local device before starting the camera in the call.
                     // This prevents the effect not being applied for a brief moment when the camera is started.
@@ -27737,9 +27812,9 @@ class AzureCommunicationCallAdapter {
                     {
                         const selectedEffect = this.getState().selectedVideoBackgroundEffect;
                         const selectedCamera = getSelectedCameraFromAdapterState(this.getState());
-                        if (selectedEffect && selectedCamera) {
+                        if (selectedEffect && selectedCamera && this.onResolveVideoBackgroundEffectsDependency) {
                             const stream = new communicationCalling.LocalVideoStream(selectedCamera);
-                            const effect = getBackgroundEffectFromSelectedEffect(selectedEffect);
+                            const effect = getBackgroundEffectFromSelectedEffect(selectedEffect, yield this.onResolveVideoBackgroundEffectsDependency());
                             if (effect) {
                                 yield stream.feature(communicationCalling.Features.VideoEffects).startEffects(effect);
                             }
@@ -27754,8 +27829,8 @@ class AzureCommunicationCallAdapter {
         });
     }
     stopCamera() {
-        return __awaiter$3(this, void 0, void 0, function* () {
-            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
+            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$5(this, void 0, void 0, function* () {
                 if (isCameraOn(this.getState())) {
                     yield this.handlers.onToggleCamera();
                 }
@@ -27763,8 +27838,8 @@ class AzureCommunicationCallAdapter {
         });
     }
     mute() {
-        return __awaiter$3(this, void 0, void 0, function* () {
-            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
+            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$5(this, void 0, void 0, function* () {
                 var _a, _b;
                 this.context.setIsLocalMicrophoneEnabled(false);
                 if (_isInCall((_a = this.call) === null || _a === void 0 ? void 0 : _a.state) && !((_b = this.call) === null || _b === void 0 ? void 0 : _b.isMuted)) {
@@ -27774,8 +27849,8 @@ class AzureCommunicationCallAdapter {
         });
     }
     unmute() {
-        return __awaiter$3(this, void 0, void 0, function* () {
-            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
+            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$5(this, void 0, void 0, function* () {
                 var _a, _b;
                 this.context.setIsLocalMicrophoneEnabled(true);
                 if (_isInCall((_a = this.call) === null || _a === void 0 ? void 0 : _a.state) && ((_b = this.call) === null || _b === void 0 ? void 0 : _b.isMuted)) {
@@ -27785,8 +27860,8 @@ class AzureCommunicationCallAdapter {
         });
     }
     startScreenShare() {
-        return __awaiter$3(this, void 0, void 0, function* () {
-            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
+            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$5(this, void 0, void 0, function* () {
                 var _a;
                 if (!((_a = this.call) === null || _a === void 0 ? void 0 : _a.isScreenSharingOn)) {
                     yield this.handlers.onToggleScreenShare();
@@ -27795,8 +27870,8 @@ class AzureCommunicationCallAdapter {
         });
     }
     stopScreenShare() {
-        return __awaiter$3(this, void 0, void 0, function* () {
-            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
+            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$5(this, void 0, void 0, function* () {
                 var _a;
                 if ((_a = this.call) === null || _a === void 0 ? void 0 : _a.isScreenSharingOn) {
                     yield this.handlers.onToggleScreenShare();
@@ -27811,7 +27886,7 @@ class AzureCommunicationCallAdapter {
     }
     /* @conditional-compile-remove(video-background-effects) */
     startVideoBackgroundEffect(videoBackgroundEffect) {
-        return __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
             if (this.isBlurEffect(videoBackgroundEffect)) {
                 const blurConfig = videoBackgroundEffect;
                 yield this.handlers.onBlurVideoBackground(blurConfig);
@@ -27824,7 +27899,7 @@ class AzureCommunicationCallAdapter {
     }
     /* @conditional-compile-remove(video-background-effects) */
     stopVideoBackgroundEffects() {
-        return __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
             yield this.handlers.onRemoveVideoBackgroundEffects();
         });
     }
@@ -27868,7 +27943,10 @@ class AzureCommunicationCallAdapter {
         this.context.setCurrentCallId(call.id);
         // Resync state after callId is set
         this.context.updateClientState(this.callClient.getState());
-        this.handlers = createHandlers(this.callClient, this.callAgent, this.deviceManager, this.call);
+        this.handlers = createHandlers(this.callClient, this.callAgent, this.deviceManager, this.call, 
+        /* @conditional-compile-remove(video-background-effects) */ {
+            onResolveVideoBackgroundEffectsDependency: this.onResolveVideoBackgroundEffectsDependency
+        });
         this.subscribeCallEvents();
     }
     /* @conditional-compile-remove(video-background-effects) */
@@ -27880,7 +27958,7 @@ class AzureCommunicationCallAdapter {
         return effect.effectName === 'replacement';
     }
     removeParticipant(userId) {
-        return __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
             let participant = userId;
             /* @conditional-compile-remove(PSTN-calls) */
             participant = _toCommunicationIdentifier(userId);
@@ -27889,7 +27967,7 @@ class AzureCommunicationCallAdapter {
     }
     /* @conditional-compile-remove(PSTN-calls) */
     addParticipant(participant, options) {
-        return __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
             if (communicationCommon.isPhoneNumberIdentifier(participant) && options) {
                 this.handlers.onAddParticipant(participant, options);
             }
@@ -27901,7 +27979,7 @@ class AzureCommunicationCallAdapter {
     /* @conditional-compile-remove(PSTN-calls) */
     holdCall() {
         var _a;
-        return __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
             if (((_a = this.call) === null || _a === void 0 ? void 0 : _a.state) !== 'LocalHold') {
                 this.handlers.onToggleHold();
             }
@@ -27910,7 +27988,7 @@ class AzureCommunicationCallAdapter {
     /* @conditional-compile-remove(PSTN-calls) */
     resumeCall() {
         var _a;
-        return __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
             if (((_a = this.call) === null || _a === void 0 ? void 0 : _a.state) === 'LocalHold') {
                 this.handlers.onToggleHold();
             }
@@ -27918,31 +27996,31 @@ class AzureCommunicationCallAdapter {
     }
     /* @conditional-compile-remove(PSTN-calls) */
     sendDtmfTone(dtmfTone) {
-        return __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
             this.handlers.onSendDtmfTone(dtmfTone);
         });
     }
     /* @conditional-compile-remove(close-captions) */
     startCaptions(options) {
-        return __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
             this.handlers.onStartCaptions(options);
         });
     }
     /* @conditional-compile-remove(close-captions) */
     stopCaptions() {
-        return __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
             this.handlers.onStopCaptions();
         });
     }
     /* @conditional-compile-remove(close-captions) */
     setCaptionLanguage(language) {
-        return __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
             this.handlers.onSetCaptionLanguage(language);
         });
     }
     /* @conditional-compile-remove(close-captions) */
     setSpokenLanguage(language) {
-        return __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
             this.handlers.onSetSpokenLanguage(language);
         });
     }
@@ -28065,7 +28143,7 @@ class AzureCommunicationCallAdapter {
         this.emitter.off(event, listener);
     }
     asyncTeeErrorToEventEmitter(f) {
-        return __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$5(this, void 0, void 0, function* () {
             try {
                 return yield f();
             }
@@ -28100,7 +28178,7 @@ class AzureCommunicationCallAdapter {
  */
 const createAzureCommunicationCallAdapter = ({ userId, displayName, credential, locator, 
 /* @conditional-compile-remove(PSTN-calls) */ alternateCallerId, 
-/* @conditional-compile-remove(video-background-effects) */ options }) => __awaiter$3(void 0, void 0, void 0, function* () {
+/* @conditional-compile-remove(video-background-effects) */ options }) => __awaiter$5(void 0, void 0, void 0, function* () {
     if (!_isValidIdentifier(userId)) {
         throw new Error('Invalid identifier. Please provide valid identifier object.');
     }
@@ -28119,7 +28197,7 @@ const createAzureCommunicationCallAdapter = ({ userId, displayName, credential,
 /**
  * @beta
  */
-const createTeamsCallAdapter = ({ userId, credential, locator, options }) => __awaiter$3(void 0, void 0, void 0, function* () {
+const createTeamsCallAdapter = ({ userId, credential, locator, options }) => __awaiter$5(void 0, void 0, void 0, function* () {
     const callClient = createStatefulCallClient({
         userId
     });
@@ -28159,7 +28237,7 @@ const useAzureCommunicationCallAdapterGeneric = (args, afterCreate, beforeDispos
         if (adapterKind === 'AzureCommunication' && !displayName) {
             return;
         }
-        (() => __awaiter$3(void 0, void 0, void 0, function* () {
+        (() => __awaiter$5(void 0, void 0, void 0, function* () {
             if (adapterRef.current) {
                 // Dispose the old adapter when a new one is created.
                 //
@@ -28238,7 +28316,7 @@ const useAzureCommunicationCallAdapterGeneric = (args, afterCreate, beforeDispos
     // Dispose any existing adapter when the component unmounts.
     React.useEffect(() => {
         return () => {
-            (() => __awaiter$3(void 0, void 0, void 0, function* () {
+            (() => __awaiter$5(void 0, void 0, void 0, function* () {
                 if (adapterRef.current) {
                     if (beforeDisposeRef.current) {
                         yield beforeDisposeRef.current(adapterRef.current);
@@ -28332,7 +28410,7 @@ beforeDispose) => {
  *
  * @public
  */
-const createAzureCommunicationCallAdapterFromClient = (callClient, callAgent, locator, options) => __awaiter$3(void 0, void 0, void 0, function* () {
+const createAzureCommunicationCallAdapterFromClient = (callClient, callAgent, locator, options) => __awaiter$5(void 0, void 0, void 0, function* () {
     const deviceManager = (yield callClient.getDeviceManager());
     yield Promise.all([deviceManager.getCameras(), deviceManager.getMicrophones()]);
     if (deviceManager.isSpeakerSelectionAvailable) {
@@ -28352,7 +28430,7 @@ const createAzureCommunicationCallAdapterFromClient = (callClient, callAgent, lo
  *
  * @beta
  */
-const createTeamsCallAdapterFromClient = (callClient, callAgent, locator, options) => __awaiter$3(void 0, void 0, void 0, function* () {
+const createTeamsCallAdapterFromClient = (callClient, callAgent, locator, options) => __awaiter$5(void 0, void 0, void 0, function* () {
     const deviceManager = (yield callClient.getDeviceManager());
     yield Promise.all([deviceManager.getCameras(), deviceManager.getMicrophones()]);
     if (deviceManager.isSpeakerSelectionAvailable) {
@@ -28395,7 +28473,7 @@ const callCompositeContainerStyles = (isMobile) => ({
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$2 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$4 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -28461,44 +28539,44 @@ class CallWithChatBackedCallAdapter {
                 return this.callWithChatAdapter.joinCall(options);
             }
         };
-        this.leaveCall = (forEveryone) => __awaiter$2(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.leaveCall(forEveryone); });
+        this.leaveCall = (forEveryone) => __awaiter$4(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.leaveCall(forEveryone); });
         this.startCall = (participants, options) => {
             let communicationParticipants = participants;
             /* @conditional-compile-remove(PSTN-calls) */
             communicationParticipants = participants.map(_toCommunicationIdentifier);
             return this.callWithChatAdapter.startCall(communicationParticipants, options);
         };
-        this.setCamera = (sourceId, options) => __awaiter$2(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.setCamera(sourceId, options); });
-        this.setMicrophone = (sourceId) => __awaiter$2(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.setMicrophone(sourceId); });
-        this.setSpeaker = (sourceId) => __awaiter$2(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.setSpeaker(sourceId); });
-        this.askDevicePermission = (constraints) => __awaiter$2(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.askDevicePermission(constraints); });
-        this.queryCameras = () => __awaiter$2(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.queryCameras(); });
-        this.queryMicrophones = () => __awaiter$2(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.queryMicrophones(); });
-        this.querySpeakers = () => __awaiter$2(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.querySpeakers(); });
-        this.startCamera = (options) => __awaiter$2(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.startCamera(options); });
-        this.stopCamera = () => __awaiter$2(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.stopCamera(); });
-        this.mute = () => __awaiter$2(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.mute(); });
-        this.unmute = () => __awaiter$2(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.unmute(); });
-        this.startScreenShare = () => __awaiter$2(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.startScreenShare(); });
-        this.stopScreenShare = () => __awaiter$2(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.stopScreenShare(); });
-        this.removeParticipant = (userId) => __awaiter$2(this, void 0, void 0, function* () {
+        this.setCamera = (sourceId, options) => __awaiter$4(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.setCamera(sourceId, options); });
+        this.setMicrophone = (sourceId) => __awaiter$4(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.setMicrophone(sourceId); });
+        this.setSpeaker = (sourceId) => __awaiter$4(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.setSpeaker(sourceId); });
+        this.askDevicePermission = (constraints) => __awaiter$4(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.askDevicePermission(constraints); });
+        this.queryCameras = () => __awaiter$4(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.queryCameras(); });
+        this.queryMicrophones = () => __awaiter$4(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.queryMicrophones(); });
+        this.querySpeakers = () => __awaiter$4(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.querySpeakers(); });
+        this.startCamera = (options) => __awaiter$4(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.startCamera(options); });
+        this.stopCamera = () => __awaiter$4(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.stopCamera(); });
+        this.mute = () => __awaiter$4(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.mute(); });
+        this.unmute = () => __awaiter$4(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.unmute(); });
+        this.startScreenShare = () => __awaiter$4(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.startScreenShare(); });
+        this.stopScreenShare = () => __awaiter$4(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.stopScreenShare(); });
+        this.removeParticipant = (userId) => __awaiter$4(this, void 0, void 0, function* () {
             let participant = userId;
             /* @conditional-compile-remove(PSTN-calls) */
             participant = _toCommunicationIdentifier(userId);
             yield this.callWithChatAdapter.removeParticipant(participant);
         });
-        this.createStreamView = (remoteUserId, options) => __awaiter$2(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.createStreamView(remoteUserId, options); });
-        this.disposeStreamView = (remoteUserId, options) => __awaiter$2(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.disposeStreamView(remoteUserId, options); });
+        this.createStreamView = (remoteUserId, options) => __awaiter$4(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.createStreamView(remoteUserId, options); });
+        this.disposeStreamView = (remoteUserId, options) => __awaiter$4(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.disposeStreamView(remoteUserId, options); });
         /* @conditional-compile-remove(PSTN-calls) */
-        this.holdCall = () => __awaiter$2(this, void 0, void 0, function* () {
+        this.holdCall = () => __awaiter$4(this, void 0, void 0, function* () {
             yield this.callWithChatAdapter.holdCall();
         });
         /* @conditional-compile-remove(PSTN-calls) */
-        this.resumeCall = () => __awaiter$2(this, void 0, void 0, function* () {
+        this.resumeCall = () => __awaiter$4(this, void 0, void 0, function* () {
             yield this.callWithChatAdapter.resumeCall();
         });
         /* @conditional-compile-remove(PSTN-calls) */
-        this.sendDtmfTone = (dtmfTone) => __awaiter$2(this, void 0, void 0, function* () {
+        this.sendDtmfTone = (dtmfTone) => __awaiter$4(this, void 0, void 0, function* () {
             yield this.callWithChatAdapter.sendDtmfTone(dtmfTone);
         });
         this.callWithChatAdapter = callWithChatAdapter;
@@ -28514,7 +28592,7 @@ class CallWithChatBackedCallAdapter {
     }
     /* @conditional-compile-remove(PSTN-calls) */
     addParticipant(participant, options) {
-        return __awaiter$2(this, void 0, void 0, function* () {
+        return __awaiter$4(this, void 0, void 0, function* () {
             if (communicationCommon.isPhoneNumberIdentifier(participant) && options) {
                 return this.callWithChatAdapter.addParticipant(participant, options);
             }
@@ -28529,37 +28607,37 @@ class CallWithChatBackedCallAdapter {
     }
     /* @conditional-compile-remove(close-captions) */
     startCaptions(options) {
-        return __awaiter$2(this, void 0, void 0, function* () {
+        return __awaiter$4(this, void 0, void 0, function* () {
             this.callWithChatAdapter.startCaptions(options);
         });
     }
     /* @conditional-compile-remove(close-captions) */
     stopCaptions() {
-        return __awaiter$2(this, void 0, void 0, function* () {
+        return __awaiter$4(this, void 0, void 0, function* () {
             this.callWithChatAdapter.stopCaptions();
         });
     }
     /* @conditional-compile-remove(close-captions) */
     setCaptionLanguage(language) {
-        return __awaiter$2(this, void 0, void 0, function* () {
+        return __awaiter$4(this, void 0, void 0, function* () {
             this.callWithChatAdapter.setCaptionLanguage(language);
         });
     }
     /* @conditional-compile-remove(close-captions) */
     setSpokenLanguage(language) {
-        return __awaiter$2(this, void 0, void 0, function* () {
+        return __awaiter$4(this, void 0, void 0, function* () {
             this.callWithChatAdapter.setSpokenLanguage(language);
         });
     }
     /* @conditional-compile-remove(video-background-effects) */
     startVideoBackgroundEffect(videoBackgroundEffect) {
-        return __awaiter$2(this, void 0, void 0, function* () {
+        return __awaiter$4(this, void 0, void 0, function* () {
             yield this.callWithChatAdapter.startVideoBackgroundEffect(videoBackgroundEffect);
         });
     }
     /* @conditional-compile-remove(video-background-effects) */
     stopVideoBackgroundEffects() {
-        return __awaiter$2(this, void 0, void 0, function* () {
+        return __awaiter$4(this, void 0, void 0, function* () {
             yield this.callWithChatAdapter.stopVideoBackgroundEffects();
         });
     }
@@ -28591,13 +28669,15 @@ function callAdapterStateFromCallWithChatAdapterState(callWithChatAdapterState)
         /* @conditional-compile-remove(video-background-effects) */
         videoBackgroundImages: callWithChatAdapterState.videoBackgroundImages,
         /* @conditional-compile-remove(video-background-effects) */
+        onResolveVideoEffectDependency: callWithChatAdapterState.onResolveVideoEffectDependency,
+        /* @conditional-compile-remove(video-background-effects) */
         selectedVideoBackgroundEffect: callWithChatAdapterState.selectedVideoBackgroundEffect
     };
 }
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter$1 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$3 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -28618,12 +28698,12 @@ class CallWithChatBackedChatAdapter {
         // For onStateChange we must convert CallWithChat state to chat state. This involves creating a new handler to be passed into the onStateChange.
         // In order to unsubscribe the handler when offStateChange is called we must have a mapping of the original handler to the newly created handler.
         this.eventStore = new Map();
-        this.fetchInitialData = () => __awaiter$1(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.fetchInitialData(); });
-        this.sendMessage = (content) => __awaiter$1(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.sendMessage(content); });
-        this.sendReadReceipt = (chatMessageId) => __awaiter$1(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.sendReadReceipt(chatMessageId); });
-        this.sendTypingIndicator = () => __awaiter$1(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.sendTypingIndicator(); });
-        this.removeParticipant = (userId) => __awaiter$1(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.removeParticipant(userId); });
-        this.loadPreviousChatMessages = (messagesToLoad) => __awaiter$1(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.loadPreviousChatMessages(messagesToLoad); });
+        this.fetchInitialData = () => __awaiter$3(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.fetchInitialData(); });
+        this.sendMessage = (content) => __awaiter$3(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.sendMessage(content); });
+        this.sendReadReceipt = (chatMessageId) => __awaiter$3(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.sendReadReceipt(chatMessageId); });
+        this.sendTypingIndicator = () => __awaiter$3(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.sendTypingIndicator(); });
+        this.removeParticipant = (userId) => __awaiter$3(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.removeParticipant(userId); });
+        this.loadPreviousChatMessages = (messagesToLoad) => __awaiter$3(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.loadPreviousChatMessages(messagesToLoad); });
         this.dispose = () => this.callWithChatAdapter.dispose();
         this.onStateChange = (handler) => {
             const convertedHandler = (state) => {
@@ -28662,12 +28742,12 @@ class CallWithChatBackedChatAdapter {
                     return this.callWithChatAdapter.off(event, listener);
             }
         };
-        this.updateMessage = (messageId, content, metadata) => __awaiter$1(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.updateMessage(messageId, content, metadata); });
-        this.deleteMessage = (messageId) => __awaiter$1(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.deleteMessage(messageId); });
+        this.updateMessage = (messageId, content, metadata) => __awaiter$3(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.updateMessage(messageId, content, metadata); });
+        this.deleteMessage = (messageId) => __awaiter$3(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.deleteMessage(messageId); });
         this.clearErrors = (errorTypes) => {
             throw new Error(`Method not supported in CallWithChatComposite.`);
         };
-        this.setTopic = (topicName) => __awaiter$1(this, void 0, void 0, function* () {
+        this.setTopic = (topicName) => __awaiter$3(this, void 0, void 0, function* () {
             throw new Error(`Chat Topics are not supported in CallWithChatComposite.`);
         });
         /* @conditional-compile-remove(file-sharing) */
@@ -28702,7 +28782,7 @@ class CallWithChatBackedChatAdapter {
     }
     /* @conditional-compile-remove(teams-inline-images-and-file-sharing) */
     downloadAttachments(options) {
-        return __awaiter$1(this, void 0, void 0, function* () {
+        return __awaiter$3(this, void 0, void 0, function* () {
             return yield this.callWithChatAdapter.downloadAttachments(options);
         });
     }
@@ -29086,6 +29166,8 @@ function callWithChatAdapterStateFromBackingStates(callAdapter, chatAdapter) {
         /* @conditional-compile-remove(video-background-effects) */
         videoBackgroundImages: callAdapterState.videoBackgroundImages,
         /* @conditional-compile-remove(video-background-effects) */
+        onResolveVideoEffectDependency: callAdapterState.onResolveVideoEffectDependency,
+        /* @conditional-compile-remove(video-background-effects) */
         selectedVideoBackgroundEffect: callAdapterState.selectedVideoBackgroundEffect
     };
 }
@@ -29105,6 +29187,8 @@ function mergeCallAdapterStateIntoCallWithChatAdapterState(existingCallWithChatA
         /* @conditional-compile-remove(video-background-effects) */
         videoBackgroundImages: callAdapterState.videoBackgroundImages, 
         /* @conditional-compile-remove(video-background-effects) */
+        onResolveVideoEffectDependency: callAdapterState.onResolveVideoEffectDependency, 
+        /* @conditional-compile-remove(video-background-effects) */
         selectedVideoBackgroundEffect: callAdapterState.selectedVideoBackgroundEffect });
 }
 
@@ -29144,7 +29228,7 @@ const getChatThreadFromTeamsLink = (teamsMeetingLink) => {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-var __awaiter = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+var __awaiter$2 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -29316,7 +29400,7 @@ class AzureCommunicationCallWithChatAdapter {
     }
     /** Leave current Call. */
     leaveCall(forEveryone) {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             // Only remove self from the GroupCall. Contoso must manage access to Chat.
             yield this.callAdapter.leaveCall(forEveryone);
         });
@@ -29355,7 +29439,7 @@ class AzureCommunicationCallWithChatAdapter {
     }
     /** Remove a participant from the Call only. */
     removeParticipant(userId) {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             let participant = userId;
             /* @conditional-compile-remove(PSTN-calls) */
             participant = _toCommunicationIdentifier(userId);
@@ -29363,174 +29447,174 @@ class AzureCommunicationCallWithChatAdapter {
         });
     }
     setCamera(device, options) {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             yield this.callAdapter.setCamera(device, options);
         });
     }
     /** Set the microphone to be used in the Call. */
     setMicrophone(device) {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             yield this.callAdapter.setMicrophone(device);
         });
     }
     /** Set the speaker to be used in the Call. */
     setSpeaker(device) {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             yield this.callAdapter.setSpeaker(device);
         });
     }
     askDevicePermission(constraints) {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             yield this.callAdapter.askDevicePermission(constraints);
         });
     }
     /** Query for available cameras. */
     queryCameras() {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             return yield this.callAdapter.queryCameras();
         });
     }
     /** Query for available microphones. */
     queryMicrophones() {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             return yield this.callAdapter.queryMicrophones();
         });
     }
     /** Query for available speakers. */
     querySpeakers() {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             return yield this.callAdapter.querySpeakers();
         });
     }
     /** Start the camera for the user in the Call. */
     startCamera(options) {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             yield this.callAdapter.startCamera(options);
         });
     }
     /** Stop the camera for the user in the Call. */
     stopCamera() {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             yield this.callAdapter.stopCamera();
         });
     }
     /** Mute the user in the Call. */
     mute() {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             yield this.callAdapter.mute();
         });
     }
     /** Unmute the user in the Call. */
     unmute() {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             yield this.callAdapter.unmute();
         });
     }
     /** Trigger the user to start screen share. */
     startScreenShare() {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             yield this.callAdapter.startScreenShare();
         });
     }
     /** Stop the current active screen share. */
     stopScreenShare() {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             yield this.callAdapter.stopScreenShare();
         });
     }
     /** Create a stream view for a remote participants video feed. */
     createStreamView(remoteUserId, options) {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             return yield this.callAdapter.createStreamView(remoteUserId, options);
         });
     }
     /** Dispose of a created stream view of a remote participants video feed. */
     disposeStreamView(remoteUserId, options) {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             yield this.callAdapter.disposeStreamView(remoteUserId, options);
         });
     }
     /** Dispose of a remote screen share */
     disposeScreenShareStreamView(remoteUserId) {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             yield this.callAdapter.disposeScreenShareStreamView(remoteUserId);
         });
     }
     /** Dispose of a remote video stream */
     disposeRemoteVideoStreamView(remoteUserId) {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             yield this.callAdapter.disposeRemoteVideoStreamView(remoteUserId);
         });
     }
     /** Dispose of the local video stream */
     disposeLocalVideoStreamView() {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             yield this.callAdapter.disposeLocalVideoStreamView();
         });
     }
     /** Fetch initial Call and Chat data such as chat messages. */
     fetchInitialData() {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             yield this.chatAdapter.fetchInitialData();
         });
     }
     /** Send a chat message. */
     sendMessage(content) {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             yield this.chatAdapter.sendMessage(content);
         });
     }
     /** Send a chat read receipt. */
     sendReadReceipt(chatMessageId) {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             yield this.chatAdapter.sendReadReceipt(chatMessageId);
         });
     }
     /** Send an isTyping indicator. */
     sendTypingIndicator() {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             yield this.chatAdapter.sendTypingIndicator();
         });
     }
     /** Load previous Chat messages. */
     loadPreviousChatMessages(messagesToLoad) {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             return yield this.chatAdapter.loadPreviousChatMessages(messagesToLoad);
         });
     }
     /** Update an existing message. */
     updateMessage(messageId, content, metadata) {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             return yield this.chatAdapter.updateMessage(messageId, content, metadata);
         });
     }
     /** Delete an existing message. */
     deleteMessage(messageId) {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             return yield this.chatAdapter.deleteMessage(messageId);
         });
     }
     /* @conditional-compile-remove(teams-inline-images-and-file-sharing) */
     downloadAttachments(options) {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             return yield this.chatAdapter.downloadAttachments(options);
         });
     }
     /* @conditional-compile-remove(PSTN-calls) */
     holdCall() {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             return yield this.callAdapter.holdCall();
         });
     }
     /* @conditional-compile-remove(PSTN-calls) */
     resumeCall() {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             return yield this.callAdapter.resumeCall();
         });
     }
     /* @conditional-compile-remove(PSTN-calls) */
     addParticipant(participant, options) {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             if (communicationCommon.isCommunicationUserIdentifier(participant)) {
                 return yield this.callAdapter.addParticipant(participant);
             }
@@ -29541,7 +29625,7 @@ class AzureCommunicationCallWithChatAdapter {
     }
     /* @conditional-compile-remove(PSTN-calls) */
     sendDtmfTone(dtmfTone) {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             return yield this.callAdapter.sendDtmfTone(dtmfTone);
         });
     }
@@ -29551,37 +29635,37 @@ class AzureCommunicationCallWithChatAdapter {
     }
     /* @conditional-compile-remove(close-captions) */
     startCaptions(options) {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             yield this.callAdapter.startCaptions(options);
         });
     }
     /* @conditional-compile-remove(close-captions) */
     stopCaptions() {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             yield this.callAdapter.stopCaptions();
         });
     }
     /* @conditional-compile-remove(close-captions) */
     setCaptionLanguage(language) {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             yield this.callAdapter.setCaptionLanguage(language);
         });
     }
     /* @conditional-compile-remove(close-captions) */
     setSpokenLanguage(language) {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             yield this.callAdapter.setSpokenLanguage(language);
         });
     }
     /* @conditional-compile-remove(video-background-effects) */
     startVideoBackgroundEffect(videoBackgroundEffect) {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             yield this.callAdapter.startVideoBackgroundEffect(videoBackgroundEffect);
         });
     }
     /* @conditional-compile-remove(video-background-effects) */
     stopVideoBackgroundEffects() {
-        return __awaiter(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
             return yield this.callAdapter.stopVideoBackgroundEffects();
         });
     }
@@ -29734,7 +29818,7 @@ class AzureCommunicationCallWithChatAdapter {
  */
 const createAzureCommunicationCallWithChatAdapter = ({ userId, displayName, credential, endpoint, locator, 
 /* @conditional-compile-remove(PSTN-calls) */ alternateCallerId, 
-/* @conditional-compile-remove(video-background-effects) */ callAdapterOptions }) => __awaiter(void 0, void 0, void 0, function* () {
+/* @conditional-compile-remove(video-background-effects) */ callAdapterOptions }) => __awaiter$2(void 0, void 0, void 0, function* () {
     const callAdapterLocator = isTeamsMeetingLinkLocator(locator) ? locator : locator.callLocator;
     const createCallAdapterPromise = createAzureCommunicationCallAdapter({
         userId,
@@ -29810,7 +29894,7 @@ beforeDispose) => {
         if (!credential || !displayName || !endpoint || !locator || !userId) {
             return;
         }
-        (() => __awaiter(void 0, void 0, void 0, function* () {
+        (() => __awaiter$2(void 0, void 0, void 0, function* () {
             if (adapterRef.current) {
                 // Dispose the old adapter when a new one is created.
                 //
@@ -29855,7 +29939,7 @@ beforeDispose) => {
     // Dispose any existing adapter when the component unmounts.
     React.useEffect(() => {
         return () => {
-            (() => __awaiter(void 0, void 0, void 0, function* () {
+            (() => __awaiter$2(void 0, void 0, void 0, function* () {
                 if (adapterRef.current) {
                     if (beforeDisposeRef.current) {
                         yield beforeDisposeRef.current(adapterRef.current);
@@ -29878,7 +29962,7 @@ beforeDispose) => {
  */
 const createAzureCommunicationCallWithChatAdapterFromClients = ({ callClient, callAgent, callLocator, chatClient, chatThreadClient, 
 /* @conditional-compile-remove(teams-inline-images-and-file-sharing) */
-options }) => __awaiter(void 0, void 0, void 0, function* () {
+options }) => __awaiter$2(void 0, void 0, void 0, function* () {
     const createCallAdapterPromise = createAzureCommunicationCallAdapterFromClient(callClient, callAgent, callLocator);
     const createChatAdapterPromise = createAzureCommunicationChatAdapterFromClient(chatClient, chatThreadClient, 
     /* @conditional-compile-remove(teams-inline-images-and-file-sharing) */
@@ -29890,6 +29974,67 @@ const isTeamsMeetingLinkLocator = (locator) => {
     return 'meetingLink' in locator;
 };
 
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT license.
+var __awaiter$1 = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+/* @conditional-compile-remove(video-background-effects) */
+/**
+ *
+ * Dependency resolution for video background effects using lazy loading.
+ * @beta
+ */
+const onResolveVideoEffectDependencyLazy = () => __awaiter$1(void 0, void 0, void 0, function* () {
+    const module = yield Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('@azure/communication-calling-effects')); });
+    const createBackgroundBlurEffect = (config) => {
+        return new module.BackgroundBlurEffect(config);
+    };
+    const createBackgroundReplacementEffect = (config) => {
+        return new module.BackgroundReplacementEffect(config);
+    };
+    const VideoBackgroundEffectsDependency = {
+        createBackgroundBlurEffect,
+        createBackgroundReplacementEffect
+    };
+    return VideoBackgroundEffectsDependency;
+});
+
+var __awaiter = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+/* @conditional-compile-remove(video-background-effects) */
+/**
+ * Dependency resolution for video background effects.
+ *
+ * @beta
+ */
+const onResolveVideoEffectDependency = () => __awaiter(void 0, void 0, void 0, function* () {
+    const createBackgroundBlurEffect = (config) => {
+        return new communicationCallingEffects.BackgroundBlurEffect(config);
+    };
+    const createBackgroundReplacementEffect = (config) => {
+        return new communicationCallingEffects.BackgroundReplacementEffect(config);
+    };
+    const VideoBackgroundEffectsDependency = {
+        createBackgroundBlurEffect,
+        createBackgroundReplacementEffect
+    };
+    return VideoBackgroundEffectsDependency;
+});
+
 // Copyright (c) Microsoft Corporation.
 /**
  * Hook to obtain a selector for a specified component.
@@ -30061,6 +30206,8 @@ exports.fromFlatCommunicationIdentifier = fromFlatCommunicationIdentifier;
 exports.getCallingSelector = getSelector$1;
 exports.getChatSelector = getSelector;
 exports.lightTheme = lightTheme;
+exports.onResolveVideoEffectDependency = onResolveVideoEffectDependency;
+exports.onResolveVideoEffectDependencyLazy = onResolveVideoEffectDependencyLazy;
 exports.toFlatCommunicationIdentifier = toFlatCommunicationIdentifier;
 exports.useAzureCommunicationCallAdapter = useAzureCommunicationCallAdapter;
 exports.useAzureCommunicationCallWithChatAdapter = useAzureCommunicationCallWithChatAdapter;