@azure/communication-react 1.3.3-alpha-202209210019.0 → 1.3.3-alpha-202210060021.0

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

@@ -188,11 +188,21 @@ const fromFlatCommunicationIdentifier = (id) => {
     }
     return { id };
 };
+/**
+ * Returns a CommunicationIdentifier.
+ * @internal
+ */
+const _toCommunicationIdentifier = (id) => {
+    if (typeof id === 'string') {
+        return fromFlatCommunicationIdentifier(id);
+    }
+    return id;
+};
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
 // GENERATED FILE. DO NOT EDIT MANUALLY.
-var telemetryVersion = '1.3.3-alpha-202209210019.0';
+var telemetryVersion = '1.3.3-alpha-202210060021.0';
 
 // Copyright (c) Microsoft Corporation.
 /**
@@ -391,7 +401,7 @@ const getCallState = (state, props) => { var _a; return (_a = state.calls[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); } }
@@ -429,7 +439,7 @@ const _isPreviewOn = (deviceManager) => {
  *
  * @private
  */
-const disposeAllLocalPreviewViews = (callClient) => __awaiter$w(void 0, void 0, void 0, function* () {
+const disposeAllLocalPreviewViews = (callClient) => __awaiter$y(void 0, void 0, void 0, function* () {
     const unparentedViews = callClient.getState().deviceManager.unparentedViews;
     for (const view of unparentedViews) {
         yield callClient.disposeView(undefined, undefined, view);
@@ -536,7 +546,7 @@ const holdButtonSelector = reselect__namespace.createSelector([getCallState], (c
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-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); } }
@@ -560,7 +570,7 @@ const areStreamsEqual = (prevStream, newStream) => {
  * @public
  */
 const createDefaultCallingHandlers = memoizeOne__default['default']((callClient, callAgent, deviceManager, call) => {
-    const onStartLocalVideo = () => __awaiter$v(void 0, void 0, void 0, function* () {
+    const onStartLocalVideo = () => __awaiter$x(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?
@@ -580,7 +590,7 @@ const createDefaultCallingHandlers = memoizeOne__default['default']((callClient,
             yield call.startVideo(stream);
         }
     });
-    const onStopLocalVideo = (stream) => __awaiter$v(void 0, void 0, void 0, function* () {
+    const onStopLocalVideo = (stream) => __awaiter$x(void 0, void 0, void 0, function* () {
         const callId = call === null || call === void 0 ? void 0 : call.id;
         if (!callId) {
             return;
@@ -593,7 +603,7 @@ const createDefaultCallingHandlers = memoizeOne__default['default']((callClient,
             });
         }
     });
-    const onToggleCamera = (options) => __awaiter$v(void 0, void 0, void 0, function* () {
+    const onToggleCamera = (options) => __awaiter$x(void 0, void 0, void 0, function* () {
         if (call && _isInCall(call.state)) {
             const stream = call.localVideoStreams.find((stream) => stream.mediaStreamType === 'Video');
             if (stream) {
@@ -619,23 +629,22 @@ const createDefaultCallingHandlers = memoizeOne__default['default']((callClient,
             }
         }
     });
-    // FIXME: onStartCall API should use string, not the underlying SDK types.
     const onStartCall = (participants, options) => {
         return callAgent ? callAgent.startCall(participants, options) : undefined;
     };
-    const onSelectMicrophone = (device) => __awaiter$v(void 0, void 0, void 0, function* () {
+    const onSelectMicrophone = (device) => __awaiter$x(void 0, void 0, void 0, function* () {
         if (!deviceManager) {
             return;
         }
         return deviceManager.selectMicrophone(device);
     });
-    const onSelectSpeaker = (device) => __awaiter$v(void 0, void 0, void 0, function* () {
+    const onSelectSpeaker = (device) => __awaiter$x(void 0, void 0, void 0, function* () {
         if (!deviceManager) {
             return;
         }
         return deviceManager.selectSpeaker(device);
     });
-    const onSelectCamera = (device, options) => __awaiter$v(void 0, void 0, void 0, function* () {
+    const onSelectCamera = (device, options) => __awaiter$x(void 0, void 0, void 0, function* () {
         if (!deviceManager) {
             return;
         }
@@ -658,19 +667,19 @@ const createDefaultCallingHandlers = memoizeOne__default['default']((callClient,
             }, options);
         }
     });
-    const onToggleMicrophone = () => __awaiter$v(void 0, void 0, void 0, function* () {
+    const onToggleMicrophone = () => __awaiter$x(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$v(void 0, void 0, void 0, function* () { return yield (call === null || call === void 0 ? void 0 : call.startScreenSharing()); });
-    const onStopScreenShare = () => __awaiter$v(void 0, void 0, void 0, function* () { return yield (call === null || call === void 0 ? void 0 : call.stopScreenSharing()); });
-    const onToggleScreenShare = () => __awaiter$v(void 0, void 0, void 0, function* () { return (call === null || call === void 0 ? void 0 : call.isScreenSharingOn) ? yield onStopScreenShare() : yield onStartScreenShare(); });
-    const onHangUp = () => __awaiter$v(void 0, void 0, void 0, function* () { return yield (call === null || call === void 0 ? void 0 : call.hangUp()); });
+    const onStartScreenShare = () => __awaiter$x(void 0, void 0, void 0, function* () { return yield (call === null || call === void 0 ? void 0 : call.startScreenSharing()); });
+    const onStopScreenShare = () => __awaiter$x(void 0, void 0, void 0, function* () { return yield (call === null || call === void 0 ? void 0 : call.stopScreenSharing()); });
+    const onToggleScreenShare = () => __awaiter$x(void 0, void 0, void 0, function* () { return (call === null || call === void 0 ? void 0 : call.isScreenSharingOn) ? yield onStopScreenShare() : yield onStartScreenShare(); });
+    const onHangUp = () => __awaiter$x(void 0, void 0, void 0, function* () { return yield (call === null || call === void 0 ? void 0 : call.hangUp()); });
     /* @conditional-compile-remove(PSTN-calls) */
-    const onToggleHold = () => __awaiter$v(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$v(void 0, void 0, void 0, function* () {
+    const onToggleHold = () => __awaiter$x(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$x(void 0, void 0, void 0, function* () {
         var _a;
         if (!call || call.localVideoStreams.length === 0) {
             return;
@@ -686,7 +695,7 @@ const createDefaultCallingHandlers = memoizeOne__default['default']((callClient,
         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$v(void 0, void 0, void 0, function* () {
+    const onCreateRemoteStreamView = (userId, options = { scalingMode: 'Crop' }) => __awaiter$x(void 0, void 0, void 0, function* () {
         if (!call) {
             return;
         }
@@ -714,7 +723,7 @@ const createDefaultCallingHandlers = memoizeOne__default['default']((callClient,
         }
         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$v(void 0, void 0, void 0, function* () {
+    const onDisposeRemoteStreamView = (userId) => __awaiter$x(void 0, void 0, void 0, function* () {
         if (!call) {
             return;
         }
@@ -735,7 +744,7 @@ const createDefaultCallingHandlers = memoizeOne__default['default']((callClient,
             callClient.disposeView(call.id, participant.identifier, screenShareStream);
         }
     });
-    const onDisposeLocalStreamView = () => __awaiter$v(void 0, void 0, void 0, function* () {
+    const onDisposeLocalStreamView = () => __awaiter$x(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');
@@ -747,11 +756,12 @@ const createDefaultCallingHandlers = memoizeOne__default['default']((callClient,
         // TODO: we need to remember which LocalVideoStream was used for LocalPreview and dispose that one.
         yield disposeAllLocalPreviewViews(callClient);
     });
-    const onRemoveParticipant = (userId) => __awaiter$v(void 0, void 0, void 0, function* () {
-        yield (call === null || call === void 0 ? void 0 : call.removeParticipant(fromFlatCommunicationIdentifier(userId)));
+    const onRemoveParticipant = (userId) => __awaiter$x(void 0, void 0, void 0, function* () {
+        const participant = _toCommunicationIdentifier(userId);
+        yield (call === null || call === void 0 ? void 0 : call.removeParticipant(participant));
     });
     /* @conditional-compile-remove(PSTN-calls) */
-    const onAddParticipant = (participant, options) => __awaiter$v(void 0, void 0, void 0, function* () {
+    const onAddParticipant = (participant, options) => __awaiter$x(void 0, void 0, void 0, function* () {
         const participantType = participantTypeHelper(participant);
         switch (participantType) {
             case 'PSTN':
@@ -763,7 +773,7 @@ const createDefaultCallingHandlers = memoizeOne__default['default']((callClient,
         }
     });
     /* @conditional-compile-remove(dialpad) */ /* @conditional-compile-remove(PSTN-calls) */
-    const onSendDtmfTone = (dtmfTone) => __awaiter$v(void 0, void 0, void 0, function* () { return yield (call === null || call === void 0 ? void 0 : call.sendDtmf(dtmfTone)); });
+    const onSendDtmfTone = (dtmfTone) => __awaiter$x(void 0, void 0, void 0, function* () { return yield (call === null || call === void 0 ? void 0 : call.sendDtmf(dtmfTone)); });
     return {
         onHangUp,
         /* @conditional-compile-remove(PSTN-calls) */
@@ -978,7 +988,7 @@ const typingIndicatorStringStyle = react.mergeStyles({
     wordBreak: 'break-word'
 });
 
-var participantItem$d={isMeText:"(you)",menuTitle:"More Options",removeButtonLabel:"Remove",sharingIconLabel:"Sharing",mutedIconLabel:"Muted",displayNamePlaceholder:"Unnamed Participant",participantStateConnecting:"Calling...",participantStateRinging:"Calling...",participantStateHold:"On hold"};var typingIndicator$d={singleUser:"{user} is typing ...",multipleUsers:"{users} are typing ...",multipleUsersAbbreviateOne:"{users} and 1 other are typing ...",multipleUsersAbbreviateMany:"{users} and {numOthers} others are typing ...",delimiter:", "};var sendBox$d={placeholderText:"Enter a message",textTooLong:"Your message length is over the maximum limit.",sendButtonAriaLabel:"Send message",fileUploadsPendingError:"Uploading... Please wait.",removeFile:"Remove file",uploading:"Uploading",uploadCompleted:"Upload completed"};var messageStatusIndicator$d={deliveredAriaLabel:"Message sent",deliveredTooltipText:"Sent",seenAriaLabel:"Message seen by others",seenTooltipText:"Seen",readByTooltipText:"Read by {messageThreadReadCount} of {remoteParticipantsCount}",sendingAriaLabel:"Message sending",sendingTooltipText:"Sending",failedToSendAriaLabel:"Message failed to send",failedToSendTooltipText:"Failed to send"};var endCallButton$d={label:"Leave",tooltipContent:"Leave Call"};var cameraButton$d={onLabel:"Turn off",offLabel:"Turn on",tooltipDisabledContent:"Camera is disabled",tooltipOnContent:"Turn off camera",tooltipOffContent:"Turn on camera",tooltipVideoLoadingContent:"Video is loading",cameraMenuTitle:"Camera",cameraMenuTooltip:"Choose Camera",cameraButtonSplitRoleDescription:"Split button",onSplitButtonAriaLabel:"Turn off camera and camera options",offSplitButtonAriaLabel:"Turn on camera and camera options",cameraActionTurnedOnAnnouncement:"Your camera has been turned on",cameraActionTurnedOffAnnouncement:"Your camera has been turned off"};var microphoneButton$d={onLabel:"Mute",offLabel:"Unmute",tooltipDisabledContent:"Microphone is disabled",tooltipOnContent:"Mute microphone",tooltipOffContent:"Unmute microphone",microphoneMenuTitle:"Microphone",microphoneMenuTooltip:"Choose Microphone",speakerMenuTitle:"Speaker",speakerMenuTooltip:"Choose Speaker",microphoneButtonSplitRoleDescription:"Split button",onSplitButtonAriaLabel:"Mute microphone and audio options",offSplitButtonAriaLabel:"Unmute microphone and audio options",microphoneActionTurnedOnAnnouncement:"Your microphone has been turned on",microphoneActionTurnedOffAnnouncement:"Your microphone has been turned off"};var devicesButton$d={label:"Devices",tooltipContent:"Manage devices",cameraMenuTitle:"Camera",cameraMenuTooltip:"Choose Camera",audioDeviceMenuTitle:"Audio Device",audioDeviceMenuTooltip:"Choose Audio Device",microphoneMenuTitle:"Microphone",microphoneMenuTooltip:"Choose Microphone",speakerMenuTitle:"Speaker",speakerMenuTooltip:"Choose Speaker"};var participantsButton$d={label:"People",tooltipContent:"Show Participants",menuHeader:"In this call",participantsListButtonLabel:"{numParticipants} people",muteAllButtonLabel:"Mute all",copyInviteLinkButtonLabel:"Copy invite link"};var screenShareButton$d={onLabel:"Stop presenting",offLabel:"Present",tooltipDisabledContent:"Presenting is disabled",tooltipOnContent:"Presenting your screen",tooltipOffContent:"Present your screen"};var messageThread$d={yesterday:"Yesterday",sunday:"Sunday",monday:"Monday",tuesday:"Tuesday",wednesday:"Wednesday",thursday:"Thursday",friday:"Friday",saturday:"Saturday",participantJoined:"joined the chat.",participantLeft:"left the chat.",editMessage:"Edit",removeMessage:"Delete",resendMessage:"Try sending again",failToSendTag:"Failed to send",editedTag:"Edited",liveAuthorIntro:"{author} says",messageContentAriaText:"{author} said {message}",messageContentMineAriaText:"You said {message}",editBoxTextLimit:"Your message is over the limit of {limitNumber} characters",editBoxPlaceholderText:"Edit your message",newMessagesIndicator:"New messages",noDisplayNameSub:"No name",editBoxCancelButton:"Cancel",editBoxSubmitButton:"Submit",messageReadCount:"Read by {messageReadByCount} of {remoteParticipantsCount}",actionMenuMoreOptions:"More Options",downloadFile:"Download file"};var errorBar$d={unableToReachChatService:"You are offline",accessDenied:"Unable to access chat services - please check the user credentials provided",userNotInChatThread:"You are no longer in this chat thread",sendMessageNotInChatThread:"Failed to send message because you are no longer in this chat thread",sendMessageGeneric:"Failed to send message",callingNetworkFailure:"Troubling connecting call - you seem to be offline",startVideoGeneric:"Failed to start video",stopVideoGeneric:"Failed to stop video",muteGeneric:"Failed to mute microphone",unmuteGeneric:"Failed to unmute microphone",speakingWhileMuted:"Your microphone is muted",startScreenShareGeneric:"Failed to start screen sharing",stopScreenShareGeneric:"Failed to stop screen sharing",callNetworkQualityLow:"Network quality is low.",callNoSpeakerFound:"No speakers or headphones found. Connect an audio device to hear the call.",callNoMicrophoneFound:"No microphones found. Connect an audio input device.",callMicrophoneAccessDenied:"Unable to access microphone. Click the lock in the address bar to grant permission to this webpage.",callMicrophoneMutedBySystem:"You are muted by your system.",callMicrophoneUnmutedBySystem:"Your microphone recovered and you were unmuted by your system.",callMacOsMicrophoneAccessDenied:"Unable to access microphone. Grant microphone permission in your macOS privacy settings.",callLocalVideoFreeze:"Network bandwidth is poor. Your video may appear paused for others on the call.",callCameraAccessDenied:"Unable to access camera. Click the lock in the address bar to grant permission to this webpage.",callCameraAlreadyInUse:"Unable to access camera. It may already be in use by another application.",callVideoStoppedBySystem:"Your video has been stopped by your system.",callVideoRecoveredBySystem:"Your video has resumed.",callMacOsCameraAccessDenied:"MacOS is blocking access to your camera. Update your privacy settings to allow this browser to access your camera.",callMacOsScreenShareAccessDenied:"MacOS is blocking screen sharing. Update your privacy settings to allow this browser to record your screen.",dismissButtonAriaLabel:"Close",failedToJoinCallGeneric:"Failed to join call.",failedToJoinCallInvalidMeetingLink:"Unable to join Meeting. Invalid Link."};var videoGallery$d={screenIsBeingSharedMessage:"You are sharing your screen",screenShareLoadingMessage:"Loading {participant}'s screen",localVideoLabel:"You",localVideoCameraSwitcherLabel:"Switch camera",localVideoMovementLabel:"Movable Local Video Tile",localVideoSelectedDescription:"{cameraName} selected",displayNamePlaceholder:"Unnamed Participant"};var dialpad$d={placeholderText:"Enter phone number",deleteButtonAriaLabel:"Delete"};var holdButton={onLabel:"Resume",offLabel:"Hold",tooltipOnContent:"Resume call",tooltipOffContent:"Hold call"};var videoTile={participantStateConnecting:"Calling...",participantStateRinging:"Calling...",participantStateHold:"On hold"};var DomainPermissions$1={primaryText:"Allow {appName} to use your camera and microphone",secondaryText:"This is so participants can see and hear you.",linkText:"More help"};var UnsupportedBrowser$1={primaryText:"Browser not supported",secondaryText:"Please join this call using a compatible browser.",moreHelpLink:"More help"};var en_US$1 = {participantItem:participantItem$d,typingIndicator:typingIndicator$d,sendBox:sendBox$d,messageStatusIndicator:messageStatusIndicator$d,endCallButton:endCallButton$d,cameraButton:cameraButton$d,microphoneButton:microphoneButton$d,devicesButton:devicesButton$d,participantsButton:participantsButton$d,screenShareButton:screenShareButton$d,messageThread:messageThread$d,errorBar:errorBar$d,videoGallery:videoGallery$d,dialpad:dialpad$d,holdButton:holdButton,videoTile:videoTile,DomainPermissions:DomainPermissions$1,UnsupportedBrowser:UnsupportedBrowser$1};
+var participantItem$d={isMeText:"(you)",menuTitle:"More Options",removeButtonLabel:"Remove",sharingIconLabel:"Sharing",mutedIconLabel:"Muted",displayNamePlaceholder:"Unnamed Participant",participantStateConnecting:"Calling...",participantStateRinging:"Calling...",participantStateHold:"On hold"};var typingIndicator$d={singleUser:"{user} is typing ...",multipleUsers:"{users} are typing ...",multipleUsersAbbreviateOne:"{users} and 1 other are typing ...",multipleUsersAbbreviateMany:"{users} and {numOthers} others are typing ...",delimiter:", "};var sendBox$d={placeholderText:"Enter a message",textTooLong:"Your message length is over the maximum limit.",sendButtonAriaLabel:"Send message",fileUploadsPendingError:"Uploading... Please wait.",removeFile:"Remove file",uploading:"Uploading",uploadCompleted:"Upload completed"};var messageStatusIndicator$d={deliveredAriaLabel:"Message sent",deliveredTooltipText:"Sent",seenAriaLabel:"Message seen by others",seenTooltipText:"Seen",readByTooltipText:"Read by {messageThreadReadCount} of {remoteParticipantsCount}",sendingAriaLabel:"Message sending",sendingTooltipText:"Sending",failedToSendAriaLabel:"Message failed to send",failedToSendTooltipText:"Failed to send"};var endCallButton$d={label:"Leave",tooltipContent:"Leave call"};var cameraButton$d={onLabel:"Turn off",offLabel:"Turn on",tooltipDisabledContent:"Camera is disabled",tooltipOnContent:"Turn off camera",tooltipOffContent:"Turn on camera",tooltipVideoLoadingContent:"Video is loading",cameraMenuTitle:"Camera",cameraMenuTooltip:"Choose camera",cameraButtonSplitRoleDescription:"Split button",onSplitButtonAriaLabel:"Turn off camera and camera options",offSplitButtonAriaLabel:"Turn on camera and camera options",cameraActionTurnedOnAnnouncement:"Your camera has been turned on",cameraActionTurnedOffAnnouncement:"Your camera has been turned off"};var microphoneButton$d={onLabel:"Mute",offLabel:"Unmute",tooltipDisabledContent:"Microphone is disabled",tooltipOnContent:"Mute microphone",tooltipOffContent:"Unmute microphone",microphoneMenuTitle:"Microphone",microphoneMenuTooltip:"Choose microphone",speakerMenuTitle:"Speaker",speakerMenuTooltip:"Choose speaker",microphoneButtonSplitRoleDescription:"Split button",onSplitButtonAriaLabel:"Mute microphone and audio options",offSplitButtonAriaLabel:"Unmute microphone and audio options",microphoneActionTurnedOnAnnouncement:"Your microphone has been turned on",microphoneActionTurnedOffAnnouncement:"Your microphone has been turned off"};var devicesButton$d={label:"Devices",tooltipContent:"Manage devices",cameraMenuTitle:"Camera",cameraMenuTooltip:"Choose camera",audioDeviceMenuTitle:"Audio Device",audioDeviceMenuTooltip:"Choose audio device",microphoneMenuTitle:"Microphone",microphoneMenuTooltip:"Choose microphone",speakerMenuTitle:"Speaker",speakerMenuTooltip:"Choose speaker"};var participantsButton$d={label:"People",tooltipContent:"Show participants",menuHeader:"In this call",participantsListButtonLabel:"{numParticipants} people",muteAllButtonLabel:"Mute all",copyInviteLinkButtonLabel:"Copy invite link"};var screenShareButton$d={onLabel:"Stop presenting",offLabel:"Present",tooltipDisabledContent:"Presenting is disabled",tooltipOnContent:"Presenting your screen",tooltipOffContent:"Present your screen"};var messageThread$d={yesterday:"Yesterday",sunday:"Sunday",monday:"Monday",tuesday:"Tuesday",wednesday:"Wednesday",thursday:"Thursday",friday:"Friday",saturday:"Saturday",participantJoined:"joined the chat.",participantLeft:"left the chat.",editMessage:"Edit",removeMessage:"Delete",resendMessage:"Try sending again",failToSendTag:"Failed to send",editedTag:"Edited",liveAuthorIntro:"{author} says",messageContentAriaText:"{author} said {message}",messageContentMineAriaText:"You said {message}",editBoxTextLimit:"Your message is over the limit of {limitNumber} characters",editBoxPlaceholderText:"Edit your message",newMessagesIndicator:"New messages",noDisplayNameSub:"No name",editBoxCancelButton:"Cancel",editBoxSubmitButton:"Submit",messageReadCount:"Read by {messageReadByCount} of {remoteParticipantsCount}",actionMenuMoreOptions:"More Options",downloadFile:"Download file"};var errorBar$d={unableToReachChatService:"You are offline",accessDenied:"Unable to access chat services - please check the user credentials provided",userNotInChatThread:"You are no longer in this chat thread",sendMessageNotInChatThread:"Failed to send message because you are no longer in this chat thread",sendMessageGeneric:"Failed to send message",callingNetworkFailure:"Troubling connecting call - you seem to be offline",startVideoGeneric:"Failed to start video",stopVideoGeneric:"Failed to stop video",muteGeneric:"Failed to mute microphone",unmuteGeneric:"Failed to unmute microphone",speakingWhileMuted:"Your microphone is muted",startScreenShareGeneric:"Failed to start screen sharing",stopScreenShareGeneric:"Failed to stop screen sharing",callNetworkQualityLow:"Network quality is low.",callNoSpeakerFound:"No speakers or headphones found. Connect an audio device to hear the call.",callNoMicrophoneFound:"No microphones found. Connect an audio input device.",callMicrophoneAccessDenied:"Unable to access microphone. Click the lock in the address bar to grant permission to this webpage.",callMicrophoneMutedBySystem:"You are muted by your system.",callMicrophoneUnmutedBySystem:"Your microphone recovered and you were unmuted by your system.",callMacOsMicrophoneAccessDenied:"Unable to access microphone. Grant microphone permission in your macOS privacy settings.",callLocalVideoFreeze:"Network bandwidth is poor. Your video may appear paused for others on the call.",callCameraAccessDenied:"Unable to access camera. Click the lock in the address bar to grant permission to this webpage.",callCameraAlreadyInUse:"Unable to access camera. It may already be in use by another application.",callVideoStoppedBySystem:"Your video has been stopped by your system.",callVideoRecoveredBySystem:"Your video has resumed.",callMacOsCameraAccessDenied:"MacOS is blocking access to your camera. Update your privacy settings to allow this browser to access your camera.",callMacOsScreenShareAccessDenied:"MacOS is blocking screen sharing. Update your privacy settings to allow this browser to record your screen.",dismissButtonAriaLabel:"Close",failedToJoinCallGeneric:"Failed to join call.",failedToJoinCallInvalidMeetingLink:"Unable to join Meeting. Invalid Link."};var videoGallery$d={screenIsBeingSharedMessage:"You are sharing your screen",screenShareLoadingMessage:"Loading {participant}'s screen",localVideoLabel:"You",localVideoCameraSwitcherLabel:"Switch camera",localVideoMovementLabel:"Movable Local Video Tile",localVideoSelectedDescription:"{cameraName} selected",displayNamePlaceholder:"Unnamed Participant"};var dialpad$d={placeholderText:"Enter phone number",deleteButtonAriaLabel:"Delete"};var holdButton={onLabel:"Resume",offLabel:"Hold",tooltipOnContent:"Resume call",tooltipOffContent:"Hold call"};var videoTile={participantStateConnecting:"Calling...",participantStateRinging:"Calling...",participantStateHold:"On hold"};var DomainPermissions$1={primaryText:"Allow {appName} to use your camera and microphone",secondaryText:"This is so participants can see and hear you.",linkText:"More help"};var UnsupportedBrowser$1={primaryText:"Browser not supported",secondaryText:"Please join this call using a compatible browser.",moreHelpLink:"More help"};var en_US$1 = {participantItem:participantItem$d,typingIndicator:typingIndicator$d,sendBox:sendBox$d,messageStatusIndicator:messageStatusIndicator$d,endCallButton:endCallButton$d,cameraButton:cameraButton$d,microphoneButton:microphoneButton$d,devicesButton:devicesButton$d,participantsButton:participantsButton$d,screenShareButton:screenShareButton$d,messageThread:messageThread$d,errorBar:errorBar$d,videoGallery:videoGallery$d,dialpad:dialpad$d,holdButton:holdButton,videoTile:videoTile,DomainPermissions:DomainPermissions$1,UnsupportedBrowser:UnsupportedBrowser$1};
 
 var participantItem$c={isMeText:"(you)",menuTitle:"More Options",removeButtonLabel:"Remove",sharingIconLabel:"Sharing",mutedIconLabel:"Muted",displayNamePlaceholder:"Unnamed Participant"};var typingIndicator$c={singleUser:"{user} is typing ...",multipleUsers:"{users} are typing ...",multipleUsersAbbreviateOne:"{users} and 1 other are typing ...",multipleUsersAbbreviateMany:"{users} and {numOthers} others are typing ...",delimiter:", "};var sendBox$c={placeholderText:"Enter a message",textTooLong:"Your message length is over the maximum limit.",sendButtonAriaLabel:"Send message",fileUploadsPendingError:"Uploading... Please wait."};var messageStatusIndicator$c={deliveredAriaLabel:"Message sent",deliveredTooltipText:"Sent",seenAriaLabel:"Message seen by others",seenTooltipText:"Seen",readByTooltipText:"Read by {messageThreadReadCount} of {remoteParticipantsCount}",sendingAriaLabel:"Message sending",sendingTooltipText:"Sending",failedToSendAriaLabel:"Message failed to send",failedToSendTooltipText:"Failed to send"};var endCallButton$c={label:"Leave",tooltipContent:"Leave Call"};var cameraButton$c={onLabel:"Turn off",offLabel:"Turn on",tooltipDisabledContent:"Camera is disabled",tooltipOnContent:"Turn off camera",tooltipOffContent:"Turn on camera",tooltipVideoLoadingContent:"Video is loading",cameraMenuTitle:"Camera",cameraMenuTooltip:"Choose Camera",cameraButtonSplitRoleDescription:"Split button",onSplitButtonAriaLabel:"Turn off camera and camera options",offSplitButtonAriaLabel:"Turn on camera and camera options",cameraActionTurnedOnAnnouncement:"Your camera has been turned on",cameraActionTurnedOffAnnouncement:"Your camera has been turned off"};var microphoneButton$c={onLabel:"Mute",offLabel:"Unmute",tooltipDisabledContent:"Microphone is disabled",tooltipOnContent:"Mute microphone",tooltipOffContent:"Unmute microphone",microphoneMenuTitle:"Microphone",microphoneMenuTooltip:"Choose Microphone",speakerMenuTitle:"Speaker",speakerMenuTooltip:"Choose Speaker",microphoneButtonSplitRoleDescription:"Split button",onSplitButtonAriaLabel:"Mute microphone and audio options",offSplitButtonAriaLabel:"Unmute microphone and audio options",microphoneActionTurnedOnAnnouncement:"Your microphone has been turned on",microphoneActionTurnedOffAnnouncement:"Your microphone has been turned off"};var devicesButton$c={label:"Devices",tooltipContent:"Manage devices",cameraMenuTitle:"Camera",cameraMenuTooltip:"Choose Camera",audioDeviceMenuTitle:"Audio Device",audioDeviceMenuTooltip:"Choose Audio Device",microphoneMenuTitle:"Microphone",microphoneMenuTooltip:"Choose Microphone",speakerMenuTitle:"Speaker",speakerMenuTooltip:"Choose Speaker"};var participantsButton$c={label:"People",tooltipContent:"Show Participants",menuHeader:"In this call",participantsListButtonLabel:"{numParticipants} people",muteAllButtonLabel:"Mute all",copyInviteLinkButtonLabel:"Copy invite link"};var screenShareButton$c={onLabel:"Stop presenting",offLabel:"Present",tooltipDisabledContent:"Presenting is disabled",tooltipOnContent:"Presenting your screen",tooltipOffContent:"Present your screen"};var messageThread$c={yesterday:"Yesterday",sunday:"Sunday",monday:"Monday",tuesday:"Tuesday",wednesday:"Wednesday",thursday:"Thursday",friday:"Friday",saturday:"Saturday",participantJoined:"joined the chat.",participantLeft:"left the chat.",editMessage:"Edit",removeMessage:"Delete",resendMessage:"Try sending again",failToSendTag:"Failed to send",editedTag:"Edited",liveAuthorIntro:"{author} says",editBoxTextLimit:"Your message is over the limit of {limitNumber} characters",editBoxPlaceholderText:"Edit your message",newMessagesIndicator:"New messages",noDisplayNameSub:"No name",editBoxCancelButton:"Cancel",editBoxSubmitButton:"Submit",messageReadCount:"Read by {messageReadByCount} of {remoteParticipantsCount}",actionMenuMoreOptions:"More Options"};var errorBar$c={unableToReachChatService:"You are offline",accessDenied:"Unable to access chat services - please check the user credentials provided",userNotInChatThread:"You are no longer in this chat thread",sendMessageNotInChatThread:"Failed to send message because you are no longer in this chat thread",sendMessageGeneric:"Failed to send message",callingNetworkFailure:"Troubling connecting call - you seem to be offline",startVideoGeneric:"Failed to start video",stopVideoGeneric:"Failed to stop video",muteGeneric:"Failed to mute microphone",unmuteGeneric:"Failed to unmute microphone",speakingWhileMuted:"Your microphone is muted",startScreenShareGeneric:"Failed to start screen sharing",stopScreenShareGeneric:"Failed to stop screen sharing",callNetworkQualityLow:"Network quality is low.",callNoSpeakerFound:"No speakers or headphones found. Connect an audio device to hear the call.",callNoMicrophoneFound:"No microphones found. Connect an audio input device.",callMicrophoneAccessDenied:"Unable to access microphone. Click the lock in the address bar to grant permission to this webpage.",callMicrophoneMutedBySystem:"You are muted by your system.",callMacOsMicrophoneAccessDenied:"Unable to access microphone. Grant microphone permission in your macOS privacy settings.",callLocalVideoFreeze:"Network bandwidth is poor. Your video may appear paused for others on the call.",callCameraAccessDenied:"Unable to access camera. Click the lock in the address bar to grant permission to this webpage.",callCameraAlreadyInUse:"Unable to access camera. It may already be in use by another application.",callMacOsCameraAccessDenied:"MacOS is blocking access to your camera. Update your privacy settings to allow this browser to access your camera.",callMacOsScreenShareAccessDenied:"MacOS is blocking screen sharing. Update your privacy settings to allow this browser to record your screen.",dismissButtonAriaLabel:"Close",failedToJoinCallGeneric:"Failed to join call.",failedToJoinCallInvalidMeetingLink:"Unable to join Meeting. Invalid Link."};var videoGallery$c={screenIsBeingSharedMessage:"You are sharing your screen",screenShareLoadingMessage:"Loading {participant}'s screen",localVideoLabel:"You",localVideoCameraSwitcherLabel:"Switch camera",localVideoMovementLabel:"Movable Local Video Tile",localVideoSelectedDescription:"{cameraName} selected",displayNamePlaceholder:"Unnamed Participant"};var dialpad$c={placeholderText:"Enter a number"};var HoldButton$d={onLabel:"Resume",offLabel:"Hold",toolTipOnContent:"Resume call",toolTipOffContent:"Hold call"};var en_GB$1 = {participantItem:participantItem$c,typingIndicator:typingIndicator$c,sendBox:sendBox$c,messageStatusIndicator:messageStatusIndicator$c,endCallButton:endCallButton$c,cameraButton:cameraButton$c,microphoneButton:microphoneButton$c,devicesButton:devicesButton$c,participantsButton:participantsButton$c,screenShareButton:screenShareButton$c,messageThread:messageThread$c,errorBar:errorBar$c,videoGallery:videoGallery$c,dialpad:dialpad$c,HoldButton:HoldButton$d};
 
@@ -1944,6 +1954,23 @@ const MoreHorizontal18Regular = () => (
 // MoreHorizontal icons are 16px x 16px or 20px x 20px so scaling to get desired size
 React__default['default'].createElement("div", { className: react.mergeStyles({ transform: 'scale(0.9)' }) },
     React__default['default'].createElement(reactIcons.MoreHorizontal20Regular, null)));
+/* @conditional-compile-remove(call-readiness) */
+const DomainPermissionMic20Filled = () => {
+    const theme = useTheme();
+    return (React__default['default'].createElement(react.Stack, { horizontalAlign: 'center', styles: { root: { borderRadius: '100%', background: theme.palette.themeLighterAlt, padding: '2rem' } } },
+        React__default['default'].createElement("div", { className: react.mergeStyles(scaledIconStyles(theme)) },
+            React__default['default'].createElement(reactIcons.MicOn20Filled, null))));
+};
+/* @conditional-compile-remove(call-readiness) */
+const DomainPermissionCamera20Filled = () => {
+    const theme = useTheme();
+    return (React__default['default'].createElement(react.Stack, { horizontalAlign: 'center', styles: { root: { borderRadius: '100%', background: theme.palette.themeLighterAlt, padding: '2rem' } } },
+        React__default['default'].createElement("div", { className: react.mergeStyles(scaledIconStyles(theme)) },
+            React__default['default'].createElement(reactIcons.Video20Filled, null))));
+};
+/* @conditional-compile-remove(call-readiness) */
+const DomainPermissionSparkle20Filled = () => (React__default['default'].createElement("div", { className: react.mergeStyles({ transform: 'scale(2)' }) },
+    React__default['default'].createElement(reactIcons.Sparkle20Filled, null)));
 /* @conditional-compile-remove(unsupported-browser) */
 const UnsupportedBrowserWarning = () => {
     const theme = useTheme();
@@ -2027,7 +2054,11 @@ const DEFAULT_COMPONENT_ICONS = {
     /* @conditional-compile-remove(dialpad) */ /* @conditional-compile-remove(PSTN-calls) */
     BackSpace: React__default['default'].createElement(reactIcons.Backspace20Regular, null),
     /* @conditional-compile-remove(call-readiness) */
-    iconBackdrop: React__default['default'].createElement(reactIcons.Circle24Filled, null),
+    DomainPermissionsSparkle: React__default['default'].createElement(DomainPermissionSparkle20Filled, null),
+    /* @conditional-compile-remove(call-readiness) */
+    DomainPermissionCamera: React__default['default'].createElement(DomainPermissionCamera20Filled, null),
+    /* @conditional-compile-remove(call-readiness) */
+    DomainPermissionMic: React__default['default'].createElement(DomainPermissionMic20Filled, null),
     /* @conditional-compile-remove(unsupported-browser) */
     UnsupportedBrowserWarning: React__default['default'].createElement(UnsupportedBrowserWarning, null)
 };
@@ -2038,6 +2069,7 @@ const scaledIconStyles = (theme) => {
         display: 'flex',
         justifyContent: 'center',
         alignItems: 'center',
+        lineHeight: '0.2rem',
         color: theme.palette.themePrimary,
         zIndex: 1
     };
@@ -3472,7 +3504,7 @@ const chatMessageActionMenuProps = (menuProps) => {
     return actionMenuProps;
 };
 
-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); } }
@@ -3497,7 +3529,7 @@ const _FileDownloadCards = (props) => {
         var _a, _b;
         return (_b = (_a = props.strings) === null || _a === void 0 ? void 0 : _a.downloadFile) !== null && _b !== void 0 ? _b : localeStrings.downloadFile;
     }, [(_a = props.strings) === null || _a === void 0 ? void 0 : _a.downloadFile, localeStrings.downloadFile]);
-    const fileDownloadHandler = React.useCallback((userId, file) => __awaiter$u(void 0, void 0, void 0, function* () {
+    const fileDownloadHandler = React.useCallback((userId, file) => __awaiter$w(void 0, void 0, void 0, function* () {
         if (!props.downloadHandler) {
             window.open(file.url, '_blank', 'noopener,noreferrer');
         }
@@ -3645,7 +3677,7 @@ const ChatMessageComponentAsMessageBubble = React__default['default'].memo(Messa
 
 // 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); } }
@@ -3679,7 +3711,7 @@ const ChatMessageComponent = (props) => {
         return React__default['default'].createElement(React__default['default'].Fragment, null);
     }
     else if (isEditing) {
-        return (React__default['default'].createElement(ChatMessageComponentAsEditBox, { message: message, inlineEditButtons: props.inlineAcceptRejectEditButtons, strings: props.strings, onSubmit: (text, metadata, options) => __awaiter$t(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$v(void 0, void 0, void 0, function* () {
                 props.onUpdateMessage &&
                     props.message.messageId &&
                     (yield props.onUpdateMessage(props.message.messageId, text, metadata, options));
@@ -3778,7 +3810,7 @@ const getParticipantsWhoHaveReadMessage = (message, readReceiptsBySenderId) => {
 
 // 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); } }
@@ -4005,7 +4037,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$s(void 0, void 0, void 0, function* () {
+    const sendMessageStatusIfAtBottom = React.useCallback(() => __awaiter$u(void 0, void 0, void 0, function* () {
         if (!isAtBottomOfScrollRef.current ||
             !document.hasFocus() ||
             !messagesRef.current ||
@@ -4056,14 +4088,13 @@ const MessageThread = (props) => {
         setIsAtBottomOfScrollRef(atBottom);
     }, [scrollToBottom, sendMessageStatusIfAtBottom]);
     // Infinite scrolling + threadInitialize function
-    const fetchNewMessageWhenAtTop = React.useCallback(() => __awaiter$s(void 0, void 0, void 0, function* () {
+    const fetchNewMessageWhenAtTop = React.useCallback(() => __awaiter$u(void 0, void 0, void 0, function* () {
         if (chatScrollDivRef.current && !isLoadingChatMessagesRef.current) {
             if (onLoadPreviousChatMessages) {
                 isLoadingChatMessagesRef.current = true;
                 // Fetch message until scrollTop reach the threshold for fetching new message
                 while (!isAllChatMessagesLoadedRef.current && chatScrollDivRef.current.scrollTop <= 500) {
                     isAllChatMessagesLoadedRef.current = yield onLoadPreviousChatMessages(numberOfChatMessagesToReload);
-                    // Release CPU resources for 200 milliseconds between each loop.
                     yield delay(200);
                 }
                 isLoadingChatMessagesRef.current = false;
@@ -4091,11 +4122,8 @@ const MessageThread = (props) => {
         if (!chatScrollDivRef.current) {
             return;
         }
-        if (previousTopRef.current === 0) {
-            const currentHeight = chatScrollDivRef.current.scrollHeight;
-            chatScrollDivRef.current.scrollTop =
-                chatScrollDivRef.current.scrollTop + currentHeight - previousHeightRef.current;
-        }
+        chatScrollDivRef.current.scrollTop =
+            chatScrollDivRef.current.scrollHeight - (previousHeightRef.current - previousTopRef.current);
     }, [messages]);
     // Fetch more messages to make the scroll bar appear, infinity scroll is then handled in the handleScroll function.
     React.useEffect(() => {
@@ -4546,10 +4574,20 @@ const participantStateStringTrampoline$1 = (props, strings) => {
 };
 
 // Copyright (c) Microsoft Corporation.
+/**
+ * @internal
+ */
+const defaultPermissions = {
+    cameraButton: true,
+    microphoneButton: true,
+    screenShare: true,
+    removeParticipantButton: true
+};
 /**
  * @internal
  */
 const presenterPermissions = {
+    role: 'Presenter',
     cameraButton: true,
     microphoneButton: true,
     screenShare: true,
@@ -4559,6 +4597,7 @@ const presenterPermissions = {
  * @internal
  */
 const consumerPermissions = {
+    role: 'Consumer',
     cameraButton: false,
     microphoneButton: false,
     screenShare: false,
@@ -4568,6 +4607,7 @@ const consumerPermissions = {
  * @internal
  */
 const attendeePermissions = {
+    role: 'Attendee',
     cameraButton: true,
     microphoneButton: true,
     screenShare: false,
@@ -4576,7 +4616,7 @@ const attendeePermissions = {
 /**
  * @internal
  */
-const PermissionsContext = React.createContext(presenterPermissions);
+const PermissionsContext = React.createContext(defaultPermissions);
 /**
  * @internal
  */
@@ -4599,9 +4639,10 @@ const _getPermissions = (role) => {
     else if (role === 'Attendee') {
         return attendeePermissions;
     }
-    else {
+    else if (role === 'Presenter') {
         return presenterPermissions;
     }
+    return defaultPermissions;
 };
 
 // Copyright (c) Microsoft Corporation.
@@ -6362,11 +6403,17 @@ const VideoGallery = (props) => {
         lastVisibleParticipants: visibleAudioParticipants.current,
         maxDominantSpeakers: MAX_AUDIO_DOMINANT_SPEAKERS
     });
+    /* @conditional-compile-remove(rooms) */
+    const permissions = _usePermissions();
     /**
      * Utility function for memoized rendering of LocalParticipant.
      */
     const localVideoTile = React.useMemo(() => {
         var _a, _b;
+        /* @conditional-compile-remove(rooms) */
+        if (!permissions.cameraButton) {
+            return undefined;
+        }
         if (onRenderLocalVideoTile) {
             return onRenderLocalVideoTile(localParticipant);
         }
@@ -6394,7 +6441,8 @@ const VideoGallery = (props) => {
         strings.localVideoSelectedDescription,
         strings.displayNamePlaceholder,
         styles === null || styles === void 0 ? void 0 : styles.localVideo,
-        theme.effects.roundedCorner4
+        theme.effects.roundedCorner4,
+        /* @conditional-compile-remove(rooms) */ permissions.cameraButton
     ]);
     const defaultOnRenderVideoTile = React.useCallback((participant, isVideoParticipant) => {
         const remoteVideoStream = participant.videoStream;
@@ -6439,7 +6487,7 @@ const VideoGallery = (props) => {
         }
     };
     const horizontalGalleryTiles = createHorizontalGalleryTiles();
-    if (!shouldFloatLocalVideo && localParticipant) {
+    if (!shouldFloatLocalVideo && localVideoTile) {
         gridTiles.push(localVideoTile);
     }
     const localScreenShareStreamComponent = React__default['default'].createElement(LocalScreenShare, { localParticipant: localParticipant });
@@ -6449,10 +6497,10 @@ const VideoGallery = (props) => {
     return (React__default['default'].createElement("div", { "data-ui-id": ids.videoGallery, ref: containerRef, className: react.mergeStyles(videoGalleryOuterDivStyle, styles === null || styles === void 0 ? void 0 : styles.root) },
         shouldFloatLocalVideo &&
             !shouldFloatNonDraggableLocalVideo &&
-            localParticipant &&
+            localVideoTile &&
             (horizontalGalleryPresent ? (React__default['default'].createElement(react.Stack, { className: react.mergeStyles(localVideoTileContainerStyle(theme, isNarrow)) }, localVideoTile)) : (React__default['default'].createElement(_ModalClone, { isOpen: true, isModeless: true, dragOptions: DRAG_OPTIONS$1, styles: floatingLocalVideoModalStyle(theme, isNarrow), layerProps: { hostId: layerHostId }, maxDragPosition: modalMaxDragPosition, minDragPosition: modalMinDragPosition }, localVideoTile))),
         // When we use showCameraSwitcherInLocalPreview it disables dragging to allow keyboard navigation.
-        shouldFloatNonDraggableLocalVideo && localParticipant && remoteParticipants.length > 0 && (React__default['default'].createElement(react.Stack, { className: react.mergeStyles(localVideoTileWithControlsContainerStyle(theme, isNarrow), {
+        shouldFloatNonDraggableLocalVideo && localVideoTile && remoteParticipants.length > 0 && (React__default['default'].createElement(react.Stack, { className: react.mergeStyles(localVideoTileWithControlsContainerStyle(theme, isNarrow), {
                 boxShadow: theme.effects.elevation8,
                 zIndex: LOCAL_VIDEO_TILE_ZINDEX
             }) }, localVideoTile)),
@@ -6675,9 +6723,9 @@ const ControlBarButton = (props) => {
 /**
  * This is a helper component to define and unify icon colors
  *
- * @private
+ * @internal
  */
-const HighContrastAwareIcon = (props) => {
+const _HighContrastAwareIcon = (props) => {
     const { iconName, disabled } = props;
     const theme = useTheme();
     // setting colors for the icons using color from theme, so in dark mode or other accessibility modes, they have pre-defined contrast colors
@@ -6821,13 +6869,15 @@ const DevicesButton = (props) => {
     const localeStrings = useLocale$1().strings.devicesButton;
     const strings = Object.assign(Object.assign({}, localeStrings), props.strings);
     const devicesButtonMenu = (_a = props.menuProps) !== null && _a !== void 0 ? _a : generateDefaultDeviceMenuProps(Object.assign(Object.assign({}, props), { styles: (_b = props.styles) === null || _b === void 0 ? void 0 : _b.menuStyles }), strings);
-    const onRenderOptionsIcon = () => (React__default['default'].createElement(HighContrastAwareIcon, { disabled: props.disabled, iconName: "ControlButtonOptions" }));
+    const onRenderOptionsIcon = () => {
+        return React__default['default'].createElement(_HighContrastAwareIcon, { disabled: props.disabled, iconName: "ControlButtonOptions" });
+    };
     return (React__default['default'].createElement(ControlBarButton, Object.assign({}, props, { menuProps: devicesButtonMenu, menuIconProps: { hidden: true }, onRenderIcon: onRenderIcon !== null && onRenderIcon !== void 0 ? onRenderIcon : onRenderOptionsIcon, strings: strings, labelKey: (_c = props.labelKey) !== null && _c !== void 0 ? _c : 'devicesButtonLabel' })));
 };
 
 // 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); } }
@@ -6855,8 +6905,8 @@ const CameraButton = (props) => {
     const strings = Object.assign(Object.assign({}, localeStrings), props.strings);
     const [announcerString, setAnnouncerString] = React.useState(undefined);
     const disabled = props.disabled || waitForCamera;
-    const onRenderCameraOnIcon = () => (React__default['default'].createElement(HighContrastAwareIcon, { disabled: disabled, iconName: "ControlButtonCameraOn" }));
-    const onRenderCameraOffIcon = () => (React__default['default'].createElement(HighContrastAwareIcon, { disabled: disabled, iconName: "ControlButtonCameraOff" }));
+    const onRenderCameraOnIcon = () => (React__default['default'].createElement(_HighContrastAwareIcon, { disabled: disabled, iconName: "ControlButtonCameraOn" }));
+    const onRenderCameraOffIcon = () => (React__default['default'].createElement(_HighContrastAwareIcon, { disabled: disabled, iconName: "ControlButtonCameraOff" }));
     if (waitForCamera && strings.tooltipVideoLoadingContent) {
         strings.tooltipDisabledContent = strings.tooltipVideoLoadingContent;
     }
@@ -6865,7 +6915,7 @@ const CameraButton = (props) => {
     const toggleAnnouncerString = React.useCallback((isCameraOn) => {
         setAnnouncerString(!isCameraOn ? strings.cameraActionTurnedOffAnnouncement : strings.cameraActionTurnedOnAnnouncement);
     }, [strings.cameraActionTurnedOffAnnouncement, strings.cameraActionTurnedOnAnnouncement]);
-    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* () {
         // Throttle click on camera, need to await onToggleCamera then allow another click
         if (onToggleCamera) {
             setWaitForCamera(true);
@@ -6997,7 +7047,7 @@ const lightThemeCallButtonStyles = {
 
 // 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); } }
@@ -7028,17 +7078,17 @@ const MicrophoneButton = (props) => {
         (isSplit && !((_c = props.microphones) === null || _c === void 0 ? void 0 : _c.length) && !((_d = props.speakers) === null || _d === void 0 ? void 0 : _d.length)) ||
         (!isSplit && props.microphones && ((_e = props.microphones) === null || _e === void 0 ? void 0 : _e.length) === 0);
     const onRenderMicOnIcon = () => {
-        return React__default['default'].createElement(HighContrastAwareIcon, { disabled: disabled, iconName: "ControlButtonMicOn" });
+        return React__default['default'].createElement(_HighContrastAwareIcon, { disabled: disabled, iconName: "ControlButtonMicOn" });
     };
     const onRenderMicOffIcon = () => {
-        return React__default['default'].createElement(HighContrastAwareIcon, { disabled: disabled, iconName: "ControlButtonMicOff" });
+        return React__default['default'].createElement(_HighContrastAwareIcon, { disabled: disabled, iconName: "ControlButtonMicOff" });
     };
     const isMicOn = props.checked;
     const splitButtonAriaString = isMicOn ? strings.onSplitButtonAriaLabel : strings.offSplitButtonAriaLabel;
     const toggleAnnouncerString = React.useCallback((isMicOn) => {
         setAnnouncerString(!isMicOn ? strings.microphoneActionTurnedOffAnnouncement : strings.microphoneActionTurnedOnAnnouncement);
     }, [strings.microphoneActionTurnedOffAnnouncement, strings.microphoneActionTurnedOnAnnouncement]);
-    const onToggleClick = React.useCallback(() => __awaiter$q(void 0, void 0, void 0, function* () {
+    const onToggleClick = React.useCallback(() => __awaiter$s(void 0, void 0, void 0, function* () {
         if (onToggleMicrophone) {
             try {
                 yield onToggleMicrophone();
@@ -7081,9 +7131,6 @@ const textContainerStyles = {
  */
 const iconPrimaryStyles = {
     root: {
-        position: 'absolute',
-        color: '#2B88D8',
-        transform: 'scale(2)',
         zIndex: 1,
         margin: 'auto'
     }
@@ -7091,11 +7138,12 @@ const iconPrimaryStyles = {
 /**
  * @internal
  */
-const iconBackDropStyles = {
-    root: {
-        color: '#EFF6FC',
-        transform: 'scale(4)'
-    }
+const sparkleIconBackdropStyles = (theme) => {
+    return {
+        root: {
+            color: theme.palette.themeLighterAlt
+        }
+    };
 };
 /**
  * @internal
@@ -7133,15 +7181,15 @@ const linkTextStyles$1 = {
 /* @conditional-compile-remove(call-readiness) */
 const DomainPermissionsContainer = (props) => {
     const { appName, onTroubleshootingClick, strings } = props;
+    const theme = react.useTheme();
     return (React__default['default'].createElement(react.Stack, { style: { padding: '2rem', maxWidth: '25.375rem' } },
-        React__default['default'].createElement(react.Stack, { horizontal: true, style: { padding: '2rem 0' }, horizontalAlign: 'space-between' },
+        React__default['default'].createElement(react.Stack, { horizontal: true, style: { paddingBottom: '1rem' }, horizontalAlign: 'space-between' },
             React__default['default'].createElement(react.Stack, { styles: iconContainerStyles, horizontalAlign: 'center' },
-                React__default['default'].createElement(react.Icon, { styles: iconPrimaryStyles, iconName: 'ControlButtonCameraOn' }),
-                React__default['default'].createElement(react.Icon, { styles: iconBackDropStyles, iconName: 'iconBackdrop' })),
-            React__default['default'].createElement(react.Icon, { styles: iconPrimaryStyles, iconName: 'Sparkle' }),
+                React__default['default'].createElement(react.Icon, { styles: iconPrimaryStyles, iconName: 'DomainPermissionCamera' })),
             React__default['default'].createElement(react.Stack, { styles: iconContainerStyles, horizontalAlign: 'center' },
-                React__default['default'].createElement(react.Icon, { styles: iconPrimaryStyles, iconName: 'ControlButtonMicOn' }),
-                React__default['default'].createElement(react.Icon, { styles: iconBackDropStyles, iconName: 'iconBackdrop' }))),
+                React__default['default'].createElement(react.Icon, { styles: sparkleIconBackdropStyles(theme), iconName: 'DomainPermissionsSparkle' })),
+            React__default['default'].createElement(react.Stack, { styles: iconContainerStyles, horizontalAlign: 'center' },
+                React__default['default'].createElement(react.Icon, { styles: iconPrimaryStyles, iconName: 'DomainPermissionMic' }))),
         React__default['default'].createElement(react.Stack, { styles: textContainerStyles },
             React__default['default'].createElement(react.Text, { styles: primaryTextStyles }, _formatString(strings.primaryText, { appName: appName })),
             React__default['default'].createElement(react.Text, { styles: secondaryTextStyles$2 }, strings.secondaryText),
@@ -7157,7 +7205,7 @@ const DomainPermissions = (props) => {
     /* @conditional-compile-remove(call-readiness) */
     const locale = useLocale$1().strings.DomainPermissions;
     /* @conditional-compile-remove(call-readiness) */
-    return React__default['default'].createElement(DomainPermissionsContainer, Object.assign({}, props, { strings: locale }));
+    return React__default['default'].createElement(DomainPermissionsContainer, Object.assign({}, props, { strings: props.strings ? props.strings : locale }));
 };
 
 // Copyright (c) Microsoft Corporation.
@@ -7176,7 +7224,7 @@ const ParticipantsButton = (props) => {
     var _a, _b, _c, _d;
     const { callInvitationURL, styles, onMuteAll, onRenderIcon, onRenderParticipantList, participants, myUserId, excludeMe, onRenderParticipant, onRenderAvatar, onRemoveParticipant, onFetchParticipantMenuItems, showParticipantOverflowTooltip } = props;
     const disabled = props.disabled;
-    const onRenderPeopleIcon = () => (React__default['default'].createElement(HighContrastAwareIcon, { disabled: disabled, iconName: "ControlButtonParticipants" }));
+    const onRenderPeopleIcon = () => (React__default['default'].createElement(_HighContrastAwareIcon, { disabled: disabled, iconName: "ControlButtonParticipants" }));
     const ids = useIdentifiers();
     const onMuteAllCallback = React.useCallback(() => {
         if (onMuteAll) {
@@ -7319,8 +7367,8 @@ const ScreenShareButton = (props) => {
     const strings = Object.assign(Object.assign({}, localeStrings), props.strings);
     const theme = react.useTheme();
     const styles = screenshareButtonStyles(theme);
-    const onRenderScreenShareOnIcon = () => (React__default['default'].createElement(HighContrastAwareIcon, { disabled: props.disabled, iconName: "ControlButtonScreenShareStop" }));
-    const onRenderScreenShareOffIcon = () => (React__default['default'].createElement(HighContrastAwareIcon, { disabled: props.disabled, iconName: "ControlButtonScreenShareStart" }));
+    const onRenderScreenShareOnIcon = () => (React__default['default'].createElement(_HighContrastAwareIcon, { disabled: props.disabled, iconName: "ControlButtonScreenShareStop" }));
+    const onRenderScreenShareOffIcon = () => (React__default['default'].createElement(_HighContrastAwareIcon, { disabled: props.disabled, iconName: "ControlButtonScreenShareStart" }));
     return (React__default['default'].createElement(ControlBarButton, Object.assign({}, props, { className: react.mergeStyles(styles, props.styles), onClick: (_a = props.onToggleScreenShare) !== null && _a !== void 0 ? _a : props.onClick, onRenderOnIcon: (_b = props.onRenderOnIcon) !== null && _b !== void 0 ? _b : onRenderScreenShareOnIcon, onRenderOffIcon: (_c = props.onRenderOffIcon) !== null && _c !== void 0 ? _c : onRenderScreenShareOffIcon, strings: strings, labelKey: (_d = props.labelKey) !== null && _d !== void 0 ? _d : 'screenShareButtonLabel', disabled: props.disabled })));
 };
 const screenshareButtonStyles = (theme) => ({
@@ -7904,7 +7952,11 @@ const iconButtonStyles = (theme) => {
             color: `${theme.palette.black}`
         },
         icon: {
-            height: 'auto'
+            height: 'auto',
+            // Needed to keep the icon vertically centered.
+            '> span': {
+                display: 'flex'
+            }
         }
     };
 };
@@ -8016,7 +8068,7 @@ function useLongPress(onClick, onLongPress, isMobile) {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-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); } }
@@ -8057,10 +8109,10 @@ const DialpadButton = (props) => {
     var _a, _b, _c, _d;
     const theme = react.useTheme();
     const { digit, index, onClick, onLongPress, isMobile = false } = props;
-    const clickFunction = React.useCallback(() => __awaiter$p(void 0, void 0, void 0, function* () {
+    const clickFunction = React.useCallback(() => __awaiter$r(void 0, void 0, void 0, function* () {
         onClick(digit, index);
     }), [digit, index, onClick]);
-    const longPressFunction = React.useCallback(() => __awaiter$p(void 0, void 0, void 0, function* () {
+    const longPressFunction = React.useCallback(() => __awaiter$r(void 0, void 0, void 0, function* () {
         onLongPress(digit, index);
     }), [digit, index, onLongPress]);
     const { handlers } = useLongPress(clickFunction, longPressFunction, isMobile);
@@ -8180,10 +8232,10 @@ const sanitizeInput = (input) => {
 const HoldButton = (props) => {
     const { onToggleHold, strings } = props;
     const onRenderHoldIcon = () => {
-        return React__default['default'].createElement(HighContrastAwareIcon, { disabled: props.disabled, iconName: "HoldCallButton" });
+        return React__default['default'].createElement(_HighContrastAwareIcon, { disabled: props.disabled, iconName: "HoldCallButton" });
     };
     const onRenderResumeIcon = () => {
-        return React__default['default'].createElement(HighContrastAwareIcon, { disabled: props.disabled, iconName: "ResumeCall" });
+        return React__default['default'].createElement(_HighContrastAwareIcon, { disabled: props.disabled, iconName: "ResumeCall" });
     };
     return (React__default['default'].createElement(ControlBarButton, Object.assign({}, props, { strings: strings, onClick: onToggleHold !== null && onToggleHold !== void 0 ? onToggleHold : props.onClick, onRenderOnIcon: onRenderResumeIcon, onRenderOffIcon: onRenderHoldIcon })));
 };
@@ -8263,6 +8315,25 @@ const UnsupportedBrowser = (props) => {
     return React__default['default'].createElement(UnsupportedBrowserContainer, Object.assign({}, props, { strings: strings }));
 };
 
+// Copyright (c) Microsoft Corporation.
+/**
+ * A dropdown to trigger device permission prompt
+ *
+ * @internal
+ */
+const _DevicePermissionDropdown = (props) => {
+    const { icon, onClickActionButton, strings, options, styles } = props;
+    const onRenderPlaceholder = () => {
+        return (React__default['default'].createElement(react.Stack, { horizontal: true, verticalAlign: "center" },
+            icon,
+            React__default['default'].createElement(react.Text, null, strings === null || strings === void 0 ? void 0 : strings.placeHolderText)));
+    };
+    const onRenderCaretDown = () => {
+        return React__default['default'].createElement(react.Text, null, strings === null || strings === void 0 ? void 0 : strings.actionButtonContent);
+    };
+    return (React__default['default'].createElement(react.Dropdown, { placeholder: strings === null || strings === void 0 ? void 0 : strings.placeHolderText, label: strings === null || strings === void 0 ? void 0 : strings.label, onRenderPlaceholder: onRenderPlaceholder, onRenderCaretDown: onRenderCaretDown, onClick: onClickActionButton, options: options !== null && options !== void 0 ? options : [], styles: styles }));
+};
+
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
 /**
@@ -8705,7 +8776,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); } }
@@ -8728,35 +8799,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.
@@ -9458,7 +9529,7 @@ const findSelector = (component) => {
 
 // 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); } }
@@ -9507,10 +9578,10 @@ class ProxyDeviceManager {
         this.selectCamera = (videoDeviceInfo) => {
             this._context.setDeviceManagerSelectedCamera(videoDeviceInfo);
         };
-        this.videoDevicesUpdated = () => __awaiter$n(this, void 0, void 0, function* () {
+        this.videoDevicesUpdated = () => __awaiter$p(this, void 0, void 0, function* () {
             this._context.setDeviceManagerCameras(dedupeById(yield this._deviceManager.getCameras()));
         });
-        this.audioDevicesUpdated = () => __awaiter$n(this, void 0, void 0, function* () {
+        this.audioDevicesUpdated = () => __awaiter$p(this, void 0, void 0, function* () {
             this._context.setDeviceManagerMicrophones(dedupeById(yield this._deviceManager.getMicrophones()));
             this._context.setDeviceManagerSpeakers(dedupeById(yield this._deviceManager.getSpeakers()));
         });
@@ -9713,7 +9784,7 @@ class CallIdHistory {
 
 // 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); } }
@@ -10198,7 +10269,7 @@ class CallContext$1 {
      * @throws CallError. Exceptions thrown from `f` are tagged with the failed `target.
      */
     withAsyncErrorTeedToState(action, target) {
-        return (...args) => __awaiter$m(this, void 0, void 0, function* () {
+        return (...args) => __awaiter$o(this, void 0, void 0, function* () {
             try {
                 return yield action(...args);
             }
@@ -10262,7 +10333,7 @@ const findOldestCallEnded = (calls) => {
 
 // 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); } }
@@ -10282,63 +10353,63 @@ class ProxyCall {
         switch (prop) {
             case 'mute': {
                 return this._context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$l(this, void 0, void 0, function* () {
+                    return __awaiter$n(this, void 0, void 0, function* () {
                         return yield target.mute(...args);
                     });
                 }, 'Call.mute');
             }
             case 'unmute': {
                 return this._context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$l(this, void 0, void 0, function* () {
+                    return __awaiter$n(this, void 0, void 0, function* () {
                         return yield target.unmute(...args);
                     });
                 }, 'Call.unmute');
             }
             case 'startVideo': {
                 return this._context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$l(this, void 0, void 0, function* () {
+                    return __awaiter$n(this, void 0, void 0, function* () {
                         return yield target.startVideo(...args);
                     });
                 }, 'Call.startVideo');
             }
             case 'stopVideo': {
                 return this._context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$l(this, void 0, void 0, function* () {
+                    return __awaiter$n(this, void 0, void 0, function* () {
                         return yield target.stopVideo(...args);
                     });
                 }, 'Call.stopVideo');
             }
             case 'startScreenSharing': {
                 return this._context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$l(this, void 0, void 0, function* () {
+                    return __awaiter$n(this, void 0, void 0, function* () {
                         return yield target.startScreenSharing(...args);
                     });
                 }, 'Call.startScreenSharing');
             }
             case 'stopScreenSharing': {
                 return this._context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$l(this, void 0, void 0, function* () {
+                    return __awaiter$n(this, void 0, void 0, function* () {
                         return yield target.stopScreenSharing(...args);
                     });
                 }, 'Call.stopScreenSharing');
             }
             case 'hold': {
                 return this._context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$l(this, void 0, void 0, function* () {
+                    return __awaiter$n(this, void 0, void 0, function* () {
                         return yield target.hold(...args);
                     });
                 }, 'Call.hold');
             }
             case 'resume': {
                 return this._context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$l(this, void 0, void 0, function* () {
+                    return __awaiter$n(this, void 0, void 0, function* () {
                         return yield target.resume(...args);
                     });
                 }, 'Call.resume');
             }
             case 'addParticipant': {
                 return this._context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$l(this, void 0, void 0, function* () {
+                    return __awaiter$n(this, void 0, void 0, function* () {
                         return yield target.addParticipant(...args);
                     });
                 }, 'Call.addParticipant');
@@ -10546,7 +10617,7 @@ class RemoteVideoStreamSubscriber {
 
 // 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); } }
@@ -10556,7 +10627,7 @@ var __awaiter$k = (window && window.__awaiter) || function (thisArg, _arguments,
     });
 };
 function createViewRemoteVideo(context, internalContext, callId, participantId, stream, options) {
-    return __awaiter$k(this, void 0, void 0, function* () {
+    return __awaiter$m(this, void 0, void 0, function* () {
         // Render RemoteVideoStream that is part of a Call
         const streamId = stream.id;
         let participantKey;
@@ -10664,7 +10735,7 @@ function createViewRemoteVideo(context, internalContext, callId, participantId,
     });
 }
 function createViewLocalVideo(context, internalContext, callId, options) {
-    return __awaiter$k(this, void 0, void 0, function* () {
+    return __awaiter$m(this, void 0, void 0, function* () {
         _logEvent(callingStatefulLogger, {
             name: EventNames.START_LOCAL_STREAM_RENDERING,
             level: 'info',
@@ -10780,7 +10851,7 @@ function createViewLocalVideo(context, internalContext, callId, options) {
     });
 }
 function createViewUnparentedVideo(context, internalContext, stream, options) {
-    return __awaiter$k(this, void 0, void 0, function* () {
+    return __awaiter$m(this, void 0, void 0, function* () {
         const renderInfo = internalContext.getUnparentedRenderInfo(stream);
         if (renderInfo && renderInfo.status === 'Rendered') {
             console.warn('Unparented LocalVideoStream is already rendered');
@@ -11408,7 +11479,7 @@ class CallSubscriber {
 
 // 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); } }
@@ -11428,14 +11499,14 @@ class ProxyIncomingCall {
         switch (prop) {
             case 'accept': {
                 return this._context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$j(this, void 0, void 0, function* () {
+                    return __awaiter$l(this, void 0, void 0, function* () {
                         return yield target.accept(...args);
                     });
                 }, 'IncomingCall.accept');
             }
             case 'reject': {
                 return this._context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$j(this, void 0, void 0, function* () {
+                    return __awaiter$l(this, void 0, void 0, function* () {
                         return yield target.reject(...args);
                     });
                 }, 'IncomingCall.reject');
@@ -11483,6 +11554,16 @@ class IncomingCallSubscriber {
 }
 
 // Copyright (c) Microsoft Corporation.
+// Licensed under the MIT license.
+(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());
+    });
+};
 /**
  * ProxyCallAgent proxies CallAgent and saves any returned state in the given context. It will subscribe to all state
  * updates in the CallAgent and in the contained Calls and RemoteParticipants. When dispose is called it will
@@ -11636,10 +11717,10 @@ class ProxyCallAgent {
                 };
             }
             case 'dispose': {
+                /* @conditional-compile-remove(calling-beta-sdk) */
                 return () => {
-                    return target.dispose().then(() => {
-                        this.unsubscribe();
-                    });
+                    target.dispose();
+                    this.unsubscribe();
                 };
             }
             /**
@@ -11773,7 +11854,7 @@ class InternalCallContext {
 
 // 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); } }
@@ -11795,7 +11876,7 @@ class ProxyCallClient {
     get(target, prop) {
         switch (prop) {
             case 'createCallAgent': {
-                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$i(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$k(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.
@@ -11808,7 +11889,7 @@ class ProxyCallClient {
                 }), 'CallClient.createCallAgent');
             }
             case 'getDeviceManager': {
-                return this._context.withAsyncErrorTeedToState(() => __awaiter$i(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState(() => __awaiter$k(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.
@@ -11931,7 +12012,7 @@ const chatStatefulLogger = logger.createClientLogger('communication-react:chat-s
 
 // 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); } }
@@ -12206,7 +12287,7 @@ class ChatContext$1 {
      * @throws ChatError. Exceptions thrown from `f` are tagged with the failed `target.
      */
     withAsyncErrorTeedToState(f, target) {
-        return (...args) => __awaiter$h(this, void 0, void 0, function* () {
+        return (...args) => __awaiter$j(this, void 0, void 0, function* () {
             try {
                 return yield f(...args);
             }
@@ -12313,7 +12394,7 @@ const convertChatMessage = (message, status = 'delivered', clientMessageId) => {
 
 // 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); } }
@@ -12397,7 +12478,7 @@ class EventSubscriber {
             this.fetchLastParticipantMessage(event.threadId, 'participantAdded');
         };
         // This is a hot fix that no participant message is received for onChatMessageReceived event, which should be handled by JS SDK
-        this.fetchLastParticipantMessage = (threadId, actionType) => __awaiter$g(this, void 0, void 0, function* () {
+        this.fetchLastParticipantMessage = (threadId, actionType) => __awaiter$i(this, void 0, void 0, function* () {
             var e_1, _a;
             try {
                 for (var _b = __asyncValues$1(this.chatClient
@@ -12483,7 +12564,7 @@ class EventSubscriber {
 
 // 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); } }
@@ -12505,7 +12586,7 @@ const createDecoratedIterator = (iteratorCreator, context, decorateFn) => {
         const threadsIterator = iteratorCreator(...args);
         return {
             next() {
-                return __awaiter$f(this, void 0, void 0, function* () {
+                return __awaiter$h(this, void 0, void 0, function* () {
                     const result = yield threadsIterator.next();
                     if (!result.done && result.value) {
                         decorateFn(result.value, context);
@@ -12520,7 +12601,7 @@ const createDecoratedIterator = (iteratorCreator, context, decorateFn) => {
                 const pages = threadsIterator.byPage(settings);
                 return {
                     next() {
-                        return __awaiter$f(this, void 0, void 0, function* () {
+                        return __awaiter$h(this, void 0, void 0, function* () {
                             const result = yield pages.next();
                             const page = result.value;
                             if (!result.done && result.value) {
@@ -12604,7 +12685,7 @@ const createDecoratedListParticipants = (chatThreadClient, context) => {
 
 // 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); } }
@@ -12623,14 +12704,14 @@ class ProxyChatThreadClient {
                 return createDecoratedListMessages(chatThreadClient, this._context);
             }
             case 'getMessage': {
-                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$e(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$g(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$e(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$g(this, void 0, void 0, function* () {
                     // Retry logic?
                     const [request, options] = args;
                     const { content } = request;
@@ -12670,7 +12751,7 @@ class ProxyChatThreadClient {
                 }), 'ChatThreadClient.sendMessage');
             }
             case 'addParticipants': {
-                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$e(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$g(this, void 0, void 0, function* () {
                     const result = yield chatThreadClient.addParticipants(...args);
                     const [addRequest] = args;
                     const participantsToAdd = addRequest.participants;
@@ -12679,7 +12760,7 @@ class ProxyChatThreadClient {
                 }), 'ChatThreadClient.addParticipants');
             }
             case 'deleteMessage': {
-                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$e(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$g(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)) {
@@ -12697,7 +12778,7 @@ class ProxyChatThreadClient {
                 return createDecoratedListReadReceipts(chatThreadClient, this._context);
             }
             case 'removeParticipant': {
-                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$e(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$g(this, void 0, void 0, function* () {
                     const result = yield chatThreadClient.removeParticipant(...args);
                     const [removeIdentifier] = args;
                     this._context.deleteParticipant(chatThreadClient.threadId, communicationCommon.getIdentifierKind(removeIdentifier));
@@ -12705,7 +12786,7 @@ class ProxyChatThreadClient {
                 }), 'ChatThreadClient.removeParticipant');
             }
             case 'updateMessage': {
-                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$e(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$g(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);
@@ -12713,7 +12794,7 @@ class ProxyChatThreadClient {
                 }), 'ChatThreadClient.updateMessage');
             }
             case 'updateTopic': {
-                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$e(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$g(this, void 0, void 0, function* () {
                     const result = yield chatThreadClient.updateTopic(...args);
                     const [topic] = args;
                     this._context.updateThreadTopic(chatThreadClient.threadId, topic);
@@ -12721,7 +12802,7 @@ class ProxyChatThreadClient {
                 }), 'ChatThreadClient.updateTopic');
             }
             case 'getProperties': {
-                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$e(this, void 0, void 0, function* () {
+                return this._context.withAsyncErrorTeedToState((...args) => __awaiter$g(this, void 0, void 0, function* () {
                     const result = yield chatThreadClient.getProperties(...args);
                     this._context.updateThread(chatThreadClient.threadId, result);
                     return result;
@@ -12758,7 +12839,7 @@ const createDecoratedListThreads = (chatClient, context) => {
 
 // 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); } }
@@ -12777,7 +12858,7 @@ const proxyChatClient = {
         switch (prop) {
             case 'createChatThread': {
                 return context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$d(this, void 0, void 0, function* () {
+                    return __awaiter$f(this, void 0, void 0, function* () {
                         const result = yield chatClient.createChatThread(...args);
                         const thread = result.chatThread;
                         if (thread) {
@@ -12790,7 +12871,7 @@ const proxyChatClient = {
             }
             case 'deleteChatThread': {
                 return context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$d(this, void 0, void 0, function* () {
+                    return __awaiter$f(this, void 0, void 0, function* () {
                         const result = yield chatClient.deleteChatThread(...args);
                         context.deleteThread(args[0]);
                         return result;
@@ -12810,7 +12891,7 @@ const proxyChatClient = {
             }
             case 'startRealtimeNotifications': {
                 return context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$d(this, void 0, void 0, function* () {
+                    return __awaiter$f(this, void 0, void 0, function* () {
                         const ret = yield chatClient.startRealtimeNotifications(...args);
                         if (!receiver.eventSubscriber) {
                             receiver.eventSubscriber = new EventSubscriber(chatClient, context);
@@ -12821,7 +12902,7 @@ const proxyChatClient = {
             }
             case 'stopRealtimeNotifications': {
                 return context.withAsyncErrorTeedToState(function (...args) {
-                    return __awaiter$d(this, void 0, void 0, function* () {
+                    return __awaiter$f(this, void 0, void 0, function* () {
                         const ret = yield chatClient.stopRealtimeNotifications(...args);
                         if (receiver.eventSubscriber) {
                             receiver.eventSubscriber.unsubscribe();
@@ -13010,7 +13091,7 @@ const CallCompositeIcon = (props) => (React__default['default'].createElement(re
  */
 const CallWithChatCompositeIcon = (props) => (React__default['default'].createElement(react.FontIcon, Object.assign({}, props)));
 
-var call$d={cameraLabel:"Camera",cameraPermissionDenied:"Your browser is blocking access to your camera",cameraTurnedOff:"Your camera is turned off",chatButtonLabel:"Chat",close:"Close",complianceBannerNowOnlyRecording:"You are now only recording this meeting.",complianceBannerNowOnlyTranscription:"You are now only transcribing this meeting.",complianceBannerRecordingAndTranscriptionSaved:"Recording and transcription are being saved.",complianceBannerRecordingAndTranscriptionStarted:"Recording and transcription have started.",complianceBannerRecordingAndTranscriptionStopped:"Recording and transcription have stopped.",complianceBannerRecordingSaving:"Recording is being saved.",complianceBannerRecordingStarted:"Recording has started.",complianceBannerRecordingStopped:"Recording has stopped.",complianceBannerTranscriptionStarted:"Transcription has started.",complianceBannerTranscriptionConsent:"By joining, you are giving consent for this meeting to be transcribed.",complianceBannerTranscriptionSaving:"Transcription is being saved.",complianceBannerTranscriptionStopped:"Transcription has stopped.",configurationPageTitle:"Start a call",copyInviteLinkButtonLabel:"Copy invite link",copyInviteLinkActionedAriaLabel:"Invite link copied",defaultPlaceHolder:"Select an option",dismissSidePaneButtonLabel:"Close",failedToJoinCallDueToNoNetworkMoreDetails:"Call was disconnected due to a network issue. Check your connection and join again.",failedToJoinCallDueToNoNetworkTitle:"Call disconnected",failedToJoinTeamsMeetingReasonAccessDeniedMoreDetails:"You were not granted entry in the call. If this was a mistake, re-join the call.",failedToJoinTeamsMeetingReasonAccessDeniedTitle:"Dismissed from lobby",learnMore:"Learn more",leftCallMoreDetails:"If this was a mistake, re-join the call.",leftCallTitle:"You left the call",lobbyScreenConnectingToCallTitle:"Joining call",lobbyScreenWaitingToBeAdmittedTitle:"Waiting to be admitted",microphonePermissionDenied:"Your browser is blocking access to your microphone",microphoneToggleInLobbyNotAllowed:"Cannot mute or unmute while in lobby.",mutedMessage:"You're muted",networkReconnectMoreDetails:"Looks like something went wrong. We're trying to get back into the call.",networkReconnectTitle:"Hold on",deniedPermissionToRoomDetails:"You do not have permission to join this room.",deniedPermissionToRoomTitle:"Permission denied to room",peopleButtonLabel:"People",peoplePaneTitle:"People",peoplePaneSubTitle:"In this call",privacyPolicy:"Privacy policy",rejoinCallButtonLabel:"Re-join call",removedFromCallMoreDetails:"Another participant removed you from the call.",removedFromCallTitle:"You were removed",removeMenuLabel:"Remove",returnToCallButtonAriaDescription:"Return to Call",returnToCallButtonAriaLabel:"Back",roomNotFoundDetails:"Room ID provided is not valid.",roomNotFoundTitle:"Room not found",soundLabel:"Sound",startCallButtonLabel:"Start call",openDialpadButtonLabel:"Dial phone number",peoplePaneAddPeopleButtonLabel:"Add People",dialpadStartCallButtonLabel:"Call",dialpadModalTitle:"Dial Phone Number",dialpadModalAriaLabel:"Dialpad",dialpadCloseModalButtonAriaLabel:"Close dialpad",moreButtonCallingLabel:"More",resumeCallButtonLabel:"Resume",resumingCallButtonLabel:"Resuming...",resumeCallButtonAriaLabel:"Resume call",resumingCallButtonAriaLabel:"Resume call",holdScreenLabel:"You're on hold",openDtmfDialpadLabel:"Show dialpad",dtmfDialpadPlaceHolderText:"Enter number"};var chat$d={chatListHeader:"In this chat",uploadFile:"Upload File"};var callWithChat$d={chatButtonLabel:"Chat",chatButtonNewMessageNotificationLabel:"New Message",chatButtonTooltipClosedWithMessageCount:"Show chat ({unreadMessagesCount} unread)",chatButtonTooltipClose:"Hide chat",chatButtonTooltipOpen:"Show chat",chatPaneTitle:"Chat",copyInviteLinkButtonLabel:"Copy invite link",copyInviteLinkActionedAriaLabel:"Invite link copied",dismissSidePaneButtonLabel:"Close",moreDrawerAudioDeviceMenuTitle:"Audio Device",moreDrawerButtonLabel:"More options",moreDrawerButtonTooltip:"More options",moreDrawerMicrophoneMenuTitle:"Microphone",moreDrawerSpeakerMenuTitle:"Speaker",peopleButtonLabel:"People",peopleButtonTooltipOpen:"Show participants",peopleButtonTooltipClose:"Hide participants",peoplePaneSubTitle:"In this call",peoplePaneTitle:"People",pictureInPictureTileAriaLabel:"Video Feeds. Click to return to call screen.",removeMenuLabel:"Remove",openDialpadButtonLabel:"Dial phone number",returnToCallButtonAriaDescription:"Return to Call",returnToCallButtonAriaLabel:"Back",peoplePaneAddPeopleButtonLabel:"Add People",dialpadStartCallButtonLabel:"Call",dialpadModalTitle:"Dial Phone Number",dialpadModalAriaLabel:"Dialpad",dialpadCloseModalButtonAriaLabel:"Close dialpad",openDtmfDialpadLabel:"Show dialpad",dtmfDialpadPlaceHolderText:"Enter number"};var en_US = {call:call$d,chat:chat$d,callWithChat:callWithChat$d};
+var call$d={cameraLabel:"Camera",cameraPermissionDenied:"Your browser is blocking access to your camera",cameraTurnedOff:"Your camera is turned off",chatButtonLabel:"Chat",close:"Close",complianceBannerNowOnlyRecording:"You are now only recording this meeting.",complianceBannerNowOnlyTranscription:"You are now only transcribing this meeting.",complianceBannerRecordingAndTranscriptionSaved:"Recording and transcription are being saved.",complianceBannerRecordingAndTranscriptionStarted:"Recording and transcription have started.",complianceBannerRecordingAndTranscriptionStopped:"Recording and transcription have stopped.",complianceBannerRecordingSaving:"Recording is being saved.",complianceBannerRecordingStarted:"Recording has started.",complianceBannerRecordingStopped:"Recording has stopped.",complianceBannerTranscriptionStarted:"Transcription has started.",complianceBannerTranscriptionConsent:"By joining, you are giving consent for this meeting to be transcribed.",complianceBannerTranscriptionSaving:"Transcription is being saved.",complianceBannerTranscriptionStopped:"Transcription has stopped.",configurationPageTitle:"Start a call",copyInviteLinkButtonLabel:"Copy invite link",copyInviteLinkActionedAriaLabel:"Invite link copied",defaultPlaceHolder:"Select an option",dismissSidePaneButtonLabel:"Close",failedToJoinCallDueToNoNetworkMoreDetails:"Call was disconnected due to a network issue. Check your connection and join again.",failedToJoinCallDueToNoNetworkTitle:"Call disconnected",failedToJoinTeamsMeetingReasonAccessDeniedMoreDetails:"You were not granted entry in the call. If this was a mistake, re-join the call.",failedToJoinTeamsMeetingReasonAccessDeniedTitle:"Dismissed from lobby",learnMore:"Learn more",leftCallMoreDetails:"If this was a mistake, re-join the call.",leftCallTitle:"You left the call",lobbyScreenConnectingToCallTitle:"Joining call",lobbyScreenWaitingToBeAdmittedTitle:"Waiting to be admitted",microphonePermissionDenied:"Your browser is blocking access to your microphone",microphoneToggleInLobbyNotAllowed:"Cannot mute or unmute while in lobby.",mutedMessage:"You're muted",networkReconnectMoreDetails:"Looks like something went wrong. We're trying to get back into the call.",networkReconnectTitle:"Hold on",deniedPermissionToRoomDetails:"You do not have permission to join this room.",deniedPermissionToRoomTitle:"Permission denied to room",peopleButtonLabel:"People",peoplePaneTitle:"People",peopleButtonTooltipOpen:"Show participants",peopleButtonTooltipClose:"Hide participants",peoplePaneSubTitle:"In this call",privacyPolicy:"Privacy policy",rejoinCallButtonLabel:"Re-join call",removedFromCallMoreDetails:"Another participant removed you from the call.",removedFromCallTitle:"You were removed",removeMenuLabel:"Remove",returnToCallButtonAriaDescription:"Return to Call",returnToCallButtonAriaLabel:"Back",roomNotFoundDetails:"Room ID provided is not valid.",roomNotFoundTitle:"Room not found",soundLabel:"Sound",startCallButtonLabel:"Start call",openDialpadButtonLabel:"Dial phone number",peoplePaneAddPeopleButtonLabel:"Add People",dialpadStartCallButtonLabel:"Call",dialpadModalTitle:"Dial Phone Number",dialpadModalAriaLabel:"Dialpad",dialpadCloseModalButtonAriaLabel:"Close dialpad",moreButtonCallingLabel:"More",resumeCallButtonLabel:"Resume",resumingCallButtonLabel:"Resuming...",resumeCallButtonAriaLabel:"Resume call",resumingCallButtonAriaLabel:"Resume call",holdScreenLabel:"You're on hold",openDtmfDialpadLabel:"Show dialpad",dtmfDialpadPlaceHolderText:"Enter number"};var chat$d={chatListHeader:"In this chat",uploadFile:"Upload File"};var callWithChat$d={chatButtonLabel:"Chat",chatButtonNewMessageNotificationLabel:"New Message",chatButtonTooltipClosedWithMessageCount:"Show chat ({unreadMessagesCount} unread)",chatButtonTooltipClose:"Hide chat",chatButtonTooltipOpen:"Show chat",chatPaneTitle:"Chat",copyInviteLinkButtonLabel:"Copy invite link",copyInviteLinkActionedAriaLabel:"Invite link copied",dismissSidePaneButtonLabel:"Close",moreDrawerAudioDeviceMenuTitle:"Audio Device",moreDrawerButtonLabel:"More options",moreDrawerButtonTooltip:"More options",moreDrawerMicrophoneMenuTitle:"Microphone",moreDrawerSpeakerMenuTitle:"Speaker",peopleButtonLabel:"People",peopleButtonTooltipOpen:"Show participants",peopleButtonTooltipClose:"Hide participants",peoplePaneSubTitle:"In this call",peoplePaneTitle:"People",pictureInPictureTileAriaLabel:"Video Feeds. Click to return to call screen.",removeMenuLabel:"Remove",openDialpadButtonLabel:"Dial phone number",returnToCallButtonAriaDescription:"Return to Call",returnToCallButtonAriaLabel:"Back",peoplePaneAddPeopleButtonLabel:"Add People",dialpadStartCallButtonLabel:"Call",dialpadModalTitle:"Dial Phone Number",dialpadModalAriaLabel:"Dialpad",dialpadCloseModalButtonAriaLabel:"Close dialpad",openDtmfDialpadLabel:"Show dialpad",dtmfDialpadPlaceHolderText:"Enter number"};var en_US = {call:call$d,chat:chat$d,callWithChat:callWithChat$d};
 
 var call$c={cameraLabel:"Camera",cameraPermissionDenied:"Your browser is blocking access to your camera",cameraTurnedOff:"Your camera is turned off",close:"Close",complianceBannerNowOnlyRecording:"You are now only recording this meeting.",complianceBannerNowOnlyTranscription:"You are now only transcribing this meeting.",complianceBannerRecordingAndTranscriptionSaved:"Recording and transcription are being saved.",complianceBannerRecordingAndTranscriptionStarted:"Recording and transcription have started.",complianceBannerRecordingAndTranscriptionStopped:"Recording and transcription have stopped.",complianceBannerRecordingSaving:"Recording is being saved.",complianceBannerRecordingStarted:"Recording has started.",complianceBannerRecordingStopped:"Recording has stopped.",complianceBannerTranscriptionStarted:"Transcription has started.",complianceBannerTranscriptionConsent:"By joining, you are giving consent for this meeting to be transcribed.",complianceBannerTranscriptionSaving:"Transcription is being saved.",complianceBannerTranscriptionStopped:"Transcription has stopped.",configurationPageTitle:"Start a call",defaultPlaceHolder:"Select an option",failedToJoinCallDueToNoNetworkMoreDetails:"Call was disconnected due to a network issue. Check your connection and join again.",failedToJoinCallDueToNoNetworkTitle:"Call disconnected",failedToJoinTeamsMeetingReasonAccessDeniedMoreDetails:"You were not granted entry in the call. If this was a mistake, re-join the call.",failedToJoinTeamsMeetingReasonAccessDeniedTitle:"Dismissed from lobby",learnMore:"Learn more",leftCallMoreDetails:"If this was a mistake, re-join the call.",leftCallTitle:"You left the call",lobbyScreenConnectingToCallTitle:"Joining call",lobbyScreenWaitingToBeAdmittedTitle:"Waiting to be admitted",microphonePermissionDenied:"Your browser is blocking access to your microphone",mutedMessage:"You're muted",networkReconnectMoreDetails:"Looks like something went wrong. We're trying to get back into the call.",networkReconnectTitle:"Hold on",privacyPolicy:"Privacy policy",rejoinCallButtonLabel:"Re-join call",removedFromCallMoreDetails:"Another participant removed you from the call.",removedFromCallTitle:"You were removed",soundLabel:"Sound",startCallButtonLabel:"Start call",microphoneToggleInLobbyNotAllowed:"Cannot mute or unmute while in lobby."};var chat$c={chatListHeader:"In this chat"};var callWithChat$c={peopleButtonLabel:"People",peopleButtonTooltipOpen:"Show participants",peopleButtonTooltipClose:"Hide participants",chatButtonLabel:"Chat",chatButtonTooltipClosedWithMessageCount:"Show chat ({unreadMessagesCount} unread)",chatButtonTooltipOpen:"Show chat",chatButtonTooltipClose:"Hide chat",moreDrawerAudioDeviceMenuTitle:"Audio Device",moreDrawerMicrophoneMenuTitle:"Microphone",moreDrawerSpeakerMenuTitle:"Speaker",moreDrawerButtonLabel:"More options",moreDrawerButtonTooltip:"More options",peoplePaneTitle:"People",peoplePaneSubTitle:"In this call",chatPaneTitle:"Chat",chatButtonNewMessageNotificationLabel:"New Message",pictureInPictureTileAriaLabel:"Video Feeds. Click to return to call screen.",removeMenuLabel:"Remove",copyInviteLinkButtonLabel:"Copy invite link",dismissSidePaneButton:"Close",returnToCallButtonAriaDescription:"Return to Call",returnToCallButtonAriaLabel:"Back"};var en_GB = {call:call$c,chat:chat$c,callWithChat:callWithChat$c};
 
@@ -13412,7 +13493,7 @@ const convertObservableFileUploadToFileUploadsUiState = (fileUploads) => {
 
 // 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); } }
@@ -13538,9 +13619,9 @@ class AzureCommunicationChatAdapter {
         this.unsubscribeAllEvents();
     }
     fetchInitialData() {
-        return __awaiter$c(this, void 0, void 0, function* () {
+        return __awaiter$e(this, void 0, void 0, function* () {
             // If get properties fails we dont want to try to get the participants after.
-            yield this.asyncTeeErrorToEventEmitter(() => __awaiter$c(this, void 0, void 0, function* () {
+            yield this.asyncTeeErrorToEventEmitter(() => __awaiter$e(this, void 0, void 0, function* () {
                 var e_1, _a;
                 yield this.chatThreadClient.getProperties();
                 try {
@@ -13574,8 +13655,8 @@ class AzureCommunicationChatAdapter {
         this.context.offStateChange(handler);
     }
     sendMessage(content, options = {}) {
-        return __awaiter$c(this, void 0, void 0, function* () {
-            yield this.asyncTeeErrorToEventEmitter(() => __awaiter$c(this, void 0, void 0, function* () {
+        return __awaiter$e(this, void 0, void 0, function* () {
+            yield this.asyncTeeErrorToEventEmitter(() => __awaiter$e(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) */
@@ -13592,49 +13673,49 @@ class AzureCommunicationChatAdapter {
         });
     }
     sendReadReceipt(chatMessageId) {
-        return __awaiter$c(this, void 0, void 0, function* () {
-            yield this.asyncTeeErrorToEventEmitter(() => __awaiter$c(this, void 0, void 0, function* () {
+        return __awaiter$e(this, void 0, void 0, function* () {
+            yield this.asyncTeeErrorToEventEmitter(() => __awaiter$e(this, void 0, void 0, function* () {
                 yield this.handlers.onMessageSeen(chatMessageId);
             }));
         });
     }
     sendTypingIndicator() {
-        return __awaiter$c(this, void 0, void 0, function* () {
+        return __awaiter$e(this, void 0, void 0, function* () {
             yield this.handlers.onTyping();
         });
     }
     removeParticipant(userId) {
-        return __awaiter$c(this, void 0, void 0, function* () {
-            yield this.asyncTeeErrorToEventEmitter(() => __awaiter$c(this, void 0, void 0, function* () {
+        return __awaiter$e(this, void 0, void 0, function* () {
+            yield this.asyncTeeErrorToEventEmitter(() => __awaiter$e(this, void 0, void 0, function* () {
                 yield this.handlers.onRemoveParticipant(userId);
             }));
         });
     }
     setTopic(topicName) {
-        return __awaiter$c(this, void 0, void 0, function* () {
-            yield this.asyncTeeErrorToEventEmitter(() => __awaiter$c(this, void 0, void 0, function* () {
+        return __awaiter$e(this, void 0, void 0, function* () {
+            yield this.asyncTeeErrorToEventEmitter(() => __awaiter$e(this, void 0, void 0, function* () {
                 yield this.handlers.updateThreadTopicName(topicName);
             }));
         });
     }
     loadPreviousChatMessages(messagesToLoad) {
-        return __awaiter$c(this, void 0, void 0, function* () {
-            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$c(this, void 0, void 0, function* () {
+        return __awaiter$e(this, void 0, void 0, function* () {
+            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$e(this, void 0, void 0, function* () {
                 return yield this.handlers.onLoadPreviousChatMessages(messagesToLoad);
             }));
         });
     }
     updateMessage(messageId, content, metadata, options) {
-        return __awaiter$c(this, void 0, void 0, function* () {
-            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$c(this, void 0, void 0, function* () {
+        return __awaiter$e(this, void 0, void 0, function* () {
+            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$e(this, void 0, void 0, function* () {
                 /* @conditional-compile-remove(file-sharing) */
                 return yield this.handlers.onUpdateMessage(messageId, content, metadata, options);
             }));
         });
     }
     deleteMessage(messageId) {
-        return __awaiter$c(this, void 0, void 0, function* () {
-            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$c(this, void 0, void 0, function* () {
+        return __awaiter$e(this, void 0, void 0, function* () {
+            return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$e(this, void 0, void 0, function* () {
                 return yield this.handlers.onDeleteMessage(messageId);
             }));
         });
@@ -13715,7 +13796,7 @@ class AzureCommunicationChatAdapter {
         this.emitter.off(event, listener);
     }
     asyncTeeErrorToEventEmitter(f) {
-        return __awaiter$c(this, void 0, void 0, function* () {
+        return __awaiter$e(this, void 0, void 0, function* () {
             try {
                 return yield f();
             }
@@ -13757,7 +13838,7 @@ const convertEventType = (type) => {
  *
  * @public
  */
-const createAzureCommunicationChatAdapter = ({ endpoint: endpointUrl, userId, displayName, credential, threadId }) => __awaiter$c(void 0, void 0, void 0, function* () {
+const createAzureCommunicationChatAdapter = ({ endpoint: endpointUrl, userId, displayName, credential, threadId }) => __awaiter$e(void 0, void 0, void 0, function* () {
     const chatClient = createStatefulChatClient({
         userId,
         displayName,
@@ -13820,7 +13901,7 @@ beforeDispose) => {
         if (!credential || !displayName || !endpoint || !threadId || !userId) {
             return;
         }
-        (() => __awaiter$c(void 0, void 0, void 0, function* () {
+        (() => __awaiter$e(void 0, void 0, void 0, function* () {
             if (adapterRef.current) {
                 // Dispose the old adapter when a new one is created.
                 //
@@ -13852,7 +13933,7 @@ beforeDispose) => {
     // Dispose any existing adapter when the component unmounts.
     React.useEffect(() => {
         return () => {
-            (() => __awaiter$c(void 0, void 0, void 0, function* () {
+            (() => __awaiter$e(void 0, void 0, void 0, function* () {
                 if (adapterRef.current) {
                     if (beforeDisposeRef.current) {
                         yield beforeDisposeRef.current(adapterRef.current);
@@ -13873,7 +13954,7 @@ beforeDispose) => {
  *
  * @public
  */
-const createAzureCommunicationChatAdapterFromClient = (chatClient, chatThreadClient) => __awaiter$c(void 0, void 0, void 0, function* () {
+const createAzureCommunicationChatAdapterFromClient = (chatClient, chatThreadClient) => __awaiter$e(void 0, void 0, void 0, function* () {
     return new AzureCommunicationChatAdapter(chatClient, chatThreadClient);
 });
 const isChatError = (e) => {
@@ -14075,7 +14156,7 @@ const sendboxContainerStyles = {
 
 // 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); } }
@@ -14096,7 +14177,7 @@ const AvatarPersona = (props) => {
     const { userId, dataProvider, text, imageUrl, imageInitials, initialsColor, initialsTextColor, showOverflowTooltip } = props;
     const [data, setData] = React.useState();
     React.useEffect(() => {
-        (() => __awaiter$b(void 0, void 0, void 0, function* () {
+        (() => __awaiter$d(void 0, void 0, void 0, function* () {
             if (dataProvider && userId) {
                 const newData = yield dataProvider(userId);
                 if (avatarDeepDifferenceCheck(data, newData)) {
@@ -14883,7 +14964,7 @@ const isDisabled$2 = (option) => {
 
 // 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); } }
@@ -14902,72 +14983,72 @@ _component) => {
     return createCompositeHandlers(useAdapter());
 };
 const createCompositeHandlers = memoizeOne__default['default']((adapter) => ({
-    onCreateLocalStreamView: (options) => __awaiter$a(void 0, void 0, void 0, function* () {
+    onCreateLocalStreamView: (options) => __awaiter$c(void 0, void 0, void 0, function* () {
         return yield adapter.createStreamView(undefined, options);
     }),
-    onCreateRemoteStreamView: (userId, options) => __awaiter$a(void 0, void 0, void 0, function* () {
+    onCreateRemoteStreamView: (userId, options) => __awaiter$c(void 0, void 0, void 0, function* () {
         return yield adapter.createStreamView(userId, options);
     }),
-    onHangUp: () => __awaiter$a(void 0, void 0, void 0, function* () {
+    onHangUp: () => __awaiter$c(void 0, void 0, void 0, function* () {
         yield adapter.leaveCall();
     }),
     /* @conditional-compile-remove(PSTN-calls) */
-    onToggleHold: () => __awaiter$a(void 0, void 0, void 0, function* () {
+    onToggleHold: () => __awaiter$c(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$a(void 0, void 0, void 0, function* () {
+    onAddParticipant: (participant, options) => __awaiter$c(void 0, void 0, void 0, function* () {
         return yield adapter.addParticipant(participant, options);
     }),
     /* @conditional-compile-remove(PSTN-calls) */
-    onSendDtmfTone: (dtmfTone) => __awaiter$a(void 0, void 0, void 0, function* () {
+    onSendDtmfTone: (dtmfTone) => __awaiter$c(void 0, void 0, void 0, function* () {
         yield adapter.sendDtmfTone(dtmfTone);
     }),
-    onRemoveParticipant: (userId) => __awaiter$a(void 0, void 0, void 0, function* () {
+    onRemoveParticipant: (userId) => __awaiter$c(void 0, void 0, void 0, function* () {
         yield adapter.removeParticipant(userId);
     }),
-    onSelectCamera: (deviceInfo, options) => __awaiter$a(void 0, void 0, void 0, function* () {
+    onSelectCamera: (deviceInfo, options) => __awaiter$c(void 0, void 0, void 0, function* () {
         yield adapter.setCamera(deviceInfo, options);
     }),
-    onSelectMicrophone: (deviceInfo) => __awaiter$a(void 0, void 0, void 0, function* () {
+    onSelectMicrophone: (deviceInfo) => __awaiter$c(void 0, void 0, void 0, function* () {
         yield adapter.setMicrophone(deviceInfo);
     }),
-    onSelectSpeaker: (deviceInfo) => __awaiter$a(void 0, void 0, void 0, function* () {
+    onSelectSpeaker: (deviceInfo) => __awaiter$c(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$a(void 0, void 0, void 0, function* () {
+    onStartScreenShare: () => __awaiter$c(void 0, void 0, void 0, function* () {
         yield adapter.startScreenShare();
     }),
-    onStopScreenShare: () => __awaiter$a(void 0, void 0, void 0, function* () {
+    onStopScreenShare: () => __awaiter$c(void 0, void 0, void 0, function* () {
         yield adapter.stopScreenShare();
     }),
-    onToggleCamera: (options) => __awaiter$a(void 0, void 0, void 0, function* () {
+    onToggleCamera: (options) => __awaiter$c(void 0, void 0, void 0, function* () {
         isCameraOn(adapter.getState()) ? yield adapter.stopCamera() : yield adapter.startCamera(options);
     }),
-    onToggleMicrophone: () => __awaiter$a(void 0, void 0, void 0, function* () {
+    onToggleMicrophone: () => __awaiter$c(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$a(void 0, void 0, void 0, function* () {
+    onToggleScreenShare: () => __awaiter$c(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$a(void 0, void 0, void 0, function* () {
+    onStartLocalVideo: () => __awaiter$c(void 0, void 0, void 0, function* () {
         if (adapter.getState().call) {
             return adapter.startCamera();
         }
     }),
-    onDisposeLocalStreamView: () => __awaiter$a(void 0, void 0, void 0, function* () {
+    onDisposeLocalStreamView: () => __awaiter$c(void 0, void 0, void 0, function* () {
         return adapter.disposeStreamView();
     }),
-    onDisposeRemoteStreamView: (userId) => __awaiter$a(void 0, void 0, void 0, function* () {
+    onDisposeRemoteStreamView: (userId) => __awaiter$c(void 0, void 0, void 0, function* () {
         return adapter.disposeStreamView(userId);
     })
 }));
@@ -15131,13 +15212,21 @@ const Devices = (props) => {
     const permissions = _usePermissions();
     /* @conditional-compile-remove(rooms) */
     const locale = useLocale();
+    /* @conditional-compile-remove(rooms) */
+    const onlyManageSpeakers = !permissions.microphoneButton && !permissions.cameraButton;
+    /* @conditional-compile-remove(rooms) */
+    const onRenderDevicesIcon = () => {
+        return React__default['default'].createElement(_HighContrastAwareIcon, { disabled: props.disabled, iconName: "OptionsSpeaker" });
+    };
     return (React__default['default'].createElement(DevicesButton
     /* By setting `persistMenu?` to true, we prevent options menu from getting hidden every time a participant joins or leaves. */
     , Object.assign({ 
         /* By setting `persistMenu?` to true, we prevent options menu from getting hidden every time a participant joins or leaves. */
         persistMenu: true }, devicesButtonProps, { showLabel: props.displayType !== 'compact', styles: styles, "data-ui-id": "calling-composite-devices-button", disabled: props.disabled, 
         /* @conditional-compile-remove(rooms) */
-        strings: getLabelFromPermissions(permissions, locale) })));
+        strings: getLabelFromPermissions(permissions, locale), 
+        /* @conditional-compile-remove(rooms) */
+        onRenderIcon: onlyManageSpeakers ? onRenderDevicesIcon : undefined })));
 };
 /* @conditional-compile-remove(rooms) */
 const getLabelFromPermissions = (permissions, locale) => {
@@ -15441,9 +15530,9 @@ const CallControls = (props) => {
     const localeStrings = useLocale();
     /* @conditional-compile-remove(one-to-n-calling) */
     const peopleButtonStrings = React.useMemo(() => ({
-        label: localeStrings.strings.callWithChat.peopleButtonLabel,
-        tooltipOffContent: localeStrings.strings.callWithChat.peopleButtonTooltipOpen,
-        tooltipOnContent: localeStrings.strings.callWithChat.peopleButtonTooltipClose
+        label: localeStrings.strings.call.peopleButtonLabel,
+        tooltipOffContent: localeStrings.strings.call.peopleButtonTooltipOpen,
+        tooltipOnContent: localeStrings.strings.call.peopleButtonTooltipClose
     }), [localeStrings]);
     /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */
     const moreButtonStrings = React.useMemo(() => ({
@@ -15480,19 +15569,21 @@ const CallControls = (props) => {
                 ['data-ui-id']: 'call-composite-more-menu-people-button'
             });
         }
-        items.push({
-            key: 'holdButtonKey',
-            text: localeStrings.component.strings.holdButton.tooltipOffContent,
-            onClick: () => {
-                holdButtonProps.onToggleHold();
-            },
-            iconProps: { iconName: 'HoldCallContextualMenuItem', styles: { root: { lineHeight: 0 } } },
-            itemProps: {
-                styles: buttonFlyoutIncreasedSizeStyles
-            },
-            disabled: isDisabled$2(options === null || options === void 0 ? void 0 : options.holdButton),
-            ['data-ui-id']: 'hold-button'
-        });
+        if (!isRoomsCallTrampoline()) {
+            items.push({
+                key: 'holdButtonKey',
+                text: localeStrings.component.strings.holdButton.tooltipOffContent,
+                onClick: () => {
+                    holdButtonProps.onToggleHold();
+                },
+                iconProps: { iconName: 'HoldCallContextualMenuItem', styles: { root: { lineHeight: 0 } } },
+                itemProps: {
+                    styles: buttonFlyoutIncreasedSizeStyles
+                },
+                disabled: isDisabled$2(options === null || options === void 0 ? void 0 : options.holdButton),
+                ['data-ui-id']: 'hold-button'
+            });
+        }
         /* @conditional-compile-remove(PSTN-calls) */
         // dtmf tone sending only works for 1:1 PSTN call
         if (alternateCallerId) {
@@ -15549,11 +15640,18 @@ const CallControls = (props) => {
                 React__default['default'].createElement(People, { checked: props.peopleButtonChecked, showLabel: (options === null || options === void 0 ? void 0 : options.displayType) !== 'compact', onClick: props.onPeopleButtonClicked, "data-ui-id": "call-composite-people-button", strings: peopleButtonStrings, disabled: isDisabled$2(options === null || options === void 0 ? void 0 : options.participantsButton) })),
                 isEnabled$2(options === null || options === void 0 ? void 0 : options.devicesButton) && (React__default['default'].createElement(Devices, { displayType: options === null || options === void 0 ? void 0 : options.displayType, increaseFlyoutItemSize: props.increaseFlyoutItemSize, disabled: isDisabled$2(options === null || options === void 0 ? void 0 : options.devicesButton) })),
                 /* @conditional-compile-remove(one-to-n-calling) */ /* @conditional-compile-remove(PSTN-calls) */
-                isEnabled$2(options === null || options === void 0 ? void 0 : options.moreButton) && (React__default['default'].createElement(MoreButton, { strings: moreButtonStrings, menuIconProps: { hidden: true }, menuProps: { items: moreButtonContextualMenuItems() }, showLabel: !props.isMobile })),
+                isEnabled$2(options === null || options === void 0 ? void 0 : options.moreButton) && moreButtonContextualMenuItems().length > 0 && (React__default['default'].createElement(MoreButton, { strings: moreButtonStrings, menuIconProps: { hidden: true }, menuProps: { items: moreButtonContextualMenuItems() }, showLabel: !props.isMobile })),
                 customButtons['primary'],
                 isEnabled$2(options === null || options === void 0 ? void 0 : options.endCallButton) && React__default['default'].createElement(EndCall, { displayType: options === null || options === void 0 ? void 0 : options.displayType })))));
 };
 const isEnabled$2 = (option) => option !== false;
+/** @private */
+const isRoomsCallTrampoline = () => {
+    /* @conditional-compile-remove(rooms) */
+    const rolePermissions = _usePermissions();
+    /* @conditional-compile-remove(rooms) */
+    return !!rolePermissions.role;
+};
 
 // Copyright (c) Microsoft Corporation.
 /**
@@ -15918,12 +16016,34 @@ const DRAG_OPTIONS = {
     menu: react.ContextualMenu,
     keepInBounds: true
 };
-const _ModalLocalAndRemotePIP = (props) => {
+/**
+ * A wrapping component with a draggable {@link LocalAndRemotePIP} component that is bound to a LayerHost component with id
+ * specified by `modalLayerHostId` prop
+ * @private
+ */
+const ModalLocalAndRemotePIP = (props) => {
     var _a;
     const rootStyles = props.hidden ? hiddenStyle : PIPContainerStyle;
+    /* @conditional-compile-remove(rooms) */
+    const rolePermissions = _usePermissions();
     const pictureInPictureProps = useSelector$1(localAndRemotePIPSelector);
     const pictureInPictureHandlers = useHandlers();
-    const localAndRemotePIP = React.useMemo(() => React__default['default'].createElement(LocalAndRemotePIP, Object.assign({}, pictureInPictureProps, pictureInPictureHandlers)), [pictureInPictureProps, pictureInPictureHandlers]);
+    const localAndRemotePIP = React.useMemo(() => {
+        var _a;
+        /* @conditional-compile-remove(rooms) */
+        if (!rolePermissions.cameraButton && ((_a = pictureInPictureProps.dominantRemoteParticipant) === null || _a === void 0 ? void 0 : _a.userId)) {
+            return React__default['default'].createElement(_RemoteVideoTile, Object.assign({}, pictureInPictureProps.dominantRemoteParticipant));
+        }
+        return React__default['default'].createElement(LocalAndRemotePIP, Object.assign({}, pictureInPictureProps, pictureInPictureHandlers));
+    }, [
+        pictureInPictureProps,
+        pictureInPictureHandlers,
+        /* @conditional-compile-remove(rooms) */ rolePermissions.cameraButton
+    ]);
+    /* @conditional-compile-remove(rooms) */
+    if (!rolePermissions.cameraButton && !pictureInPictureProps.dominantRemoteParticipant) {
+        return null;
+    }
     const modalStylesThemed = react.concatStyleSets(modalStyle, (_a = props.styles) === null || _a === void 0 ? void 0 : _a.modal);
     return (React__default['default'].createElement(react.Stack, { styles: rootStyles },
         React__default['default'].createElement(_ModalClone, { isOpen: true, isModeless: true, dragOptions: DRAG_OPTIONS, styles: modalStylesThemed, layerProps: { hostId: props.modalLayerHostId }, minDragPosition: props.minDragPosition, maxDragPosition: props.maxDragPosition }, 
@@ -15931,15 +16051,6 @@ const _ModalLocalAndRemotePIP = (props) => {
         // possession of the dominant remote participant video stream
         !props.hidden && localAndRemotePIP)));
 };
-/**
- * A wrapping component with a draggable {@link LocalAndRemotePIP} component that is bound to a LayerHost component with id
- * specified by `modalLayerHostId` prop
- * @private
- */
-const ModalLocalAndRemotePIP = (props) => {
-    return (React__default['default'].createElement(CallAdapterProvider, { adapter: props.callAdapter },
-        React__default['default'].createElement(_ModalLocalAndRemotePIP, Object.assign({}, props), props.children)));
-};
 
 // Copyright (c) Microsoft Corporation.
 /**
@@ -16239,8 +16350,8 @@ const AddPeopleDropdown = (props) => {
     if (mobileView) {
         return (React__default['default'].createElement(react.Stack, null,
             React__default['default'].createElement(Announcer, { ariaLive: 'assertive', announcementString: announcerStrings }),
-            React__default['default'].createElement(react.Stack.Item, { styles: copyLinkButtonContainerStyles },
-                React__default['default'].createElement(react.PrimaryButton, { onClick: setDrawerMenuItemsForAddPeople, styles: copyLinkButtonStylesThemed, onRenderIcon: () => PeoplePaneAddPersonIconTrampoline(), text: strings.peoplePaneAddPeopleButtonLabel, "data-ui-id": "call-add-people-button" })),
+            defaultMenuProps.items.length > 0 && (React__default['default'].createElement(react.Stack.Item, { styles: copyLinkButtonContainerStyles },
+                React__default['default'].createElement(react.PrimaryButton, { onClick: setDrawerMenuItemsForAddPeople, styles: copyLinkButtonStylesThemed, onRenderIcon: () => PeoplePaneAddPersonIconTrampoline(), text: strings.peoplePaneAddPeopleButtonLabel, "data-ui-id": "call-add-people-button" }))),
             addPeopleDrawerMenuItems.length > 0 && (React__default['default'].createElement(react.Stack, { styles: drawerContainerStyles, "data-ui-id": "call-add-people-dropdown" },
                 React__default['default'].createElement(_DrawerMenu, { onLightDismiss: () => setAddPeopleDrawerMenuItems([]), items: addPeopleDrawerMenuItems }))),
             alternateCallerId && (React__default['default'].createElement(CallingDialpad, { isMobile: true, strings: strings, showDialpad: showDialpad, onDismissDialpad: onDismissDialpad, onAddParticipant: onAddParticipant, alternateCallerId: alternateCallerId }))));
@@ -16248,8 +16359,8 @@ const AddPeopleDropdown = (props) => {
     return (React__default['default'].createElement(React__default['default'].Fragment, null, React__default['default'].createElement(react.Stack, null,
         React__default['default'].createElement(Announcer, { ariaLive: 'assertive', announcementString: announcerStrings }),
         alternateCallerId && (React__default['default'].createElement(CallingDialpad, { isMobile: false, strings: strings, showDialpad: showDialpad, onDismissDialpad: onDismissDialpad, onAddParticipant: onAddParticipant, alternateCallerId: alternateCallerId })),
-        React__default['default'].createElement(react.Stack, { styles: copyLinkButtonStackStyles },
-            React__default['default'].createElement(react.DefaultButton, { onRenderIcon: () => PeoplePaneAddPersonIconTrampoline(), text: strings.peoplePaneAddPeopleButtonLabel, menuProps: defaultMenuProps, styles: copyLinkButtonStylesThemed, "data-ui-id": "call-add-people-button" })))));
+        defaultMenuProps.items.length > 0 && (React__default['default'].createElement(react.Stack, { styles: copyLinkButtonStackStyles },
+            React__default['default'].createElement(react.DefaultButton, { onRenderIcon: () => PeoplePaneAddPersonIconTrampoline(), text: strings.peoplePaneAddPeopleButtonLabel, menuProps: defaultMenuProps, styles: copyLinkButtonStylesThemed, "data-ui-id": "call-add-people-button" }))))));
 };
 function PeoplePaneOpenDialpadIconNameTrampoline() {
     /* @conditional-compile-remove(PSTN-calls) */
@@ -16279,7 +16390,7 @@ const AddPeopleButton = (props) => {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-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); } }
@@ -16315,7 +16426,7 @@ const PeoplePaneContent = (props) => {
         setDrawerMenuItems
     ]);
     const participantListProps = React.useMemo(() => {
-        const onRemoveAParticipant = (participantId) => __awaiter$9(void 0, void 0, void 0, function* () { return onRemoveParticipant(participantId); });
+        const onRemoveAParticipant = (participantId) => __awaiter$b(void 0, void 0, void 0, function* () { return onRemoveParticipant(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, 
@@ -16513,7 +16624,7 @@ const useMinMaxDragPosition = (modalLayerHostId, rtl) => {
     return { minDragPosition: minDragPosition, maxDragPosition: maxDragPosition };
 };
 
-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); } }
@@ -16543,11 +16654,11 @@ const CallPane = (props) => {
     /**
      * In a Call Composite when a participant is removed, we must remove them from the call.
      */
-    const removeParticipantFromCall = (participantId) => __awaiter$8(void 0, void 0, void 0, function* () {
+    const removeParticipantFromCall = (participantId) => __awaiter$a(void 0, void 0, void 0, function* () {
         yield props.callAdapter.removeParticipant(participantId);
     });
     /* @conditional-compile-remove(PSTN-calls) */
-    const addParticipantToCall = (participant, options) => __awaiter$8(void 0, void 0, void 0, function* () {
+    const addParticipantToCall = (participant, options) => __awaiter$a(void 0, void 0, void 0, function* () {
         yield props.callAdapter.addParticipant(participant, options);
     });
     const minMaxDragPosition = useMinMaxDragPosition(props.modalLayerHostId, props.rtl);
@@ -16567,7 +16678,8 @@ const CallPane = (props) => {
                                 onAddParticipant: addParticipantToCall, setDrawerMenuItems: setDrawerMenuItems, strings: strings, 
                                 /* @conditional-compile-remove(PSTN-calls) */
                                 alternateCallerId: alternateCallerId }))))))),
-        props.mobileView && (React__default['default'].createElement(ModalLocalAndRemotePIP, { callAdapter: props.callAdapter, modalLayerHostId: props.modalLayerHostId, hidden: !props.activePane, styles: pipStyles, minDragPosition: minMaxDragPosition.minDragPosition, maxDragPosition: minMaxDragPosition.maxDragPosition })),
+        props.mobileView && (React__default['default'].createElement(CallAdapterProvider, { adapter: props.callAdapter },
+            React__default['default'].createElement(ModalLocalAndRemotePIP, { modalLayerHostId: props.modalLayerHostId, hidden: !props.activePane, styles: pipStyles, minDragPosition: minMaxDragPosition.minDragPosition, maxDragPosition: minMaxDragPosition.maxDragPosition }))),
         drawerMenuItems.length > 0 && (React__default['default'].createElement(react.Stack, { styles: drawerContainerStyles },
             React__default['default'].createElement(_DrawerMenu, { onLightDismiss: () => setDrawerMenuItems([]), items: drawerMenuItems })))));
 };
@@ -17047,6 +17159,75 @@ const optionIconStyles = react.mergeStyles({
     verticalAlign: 'text-top'
 });
 
+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); } }
+        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());
+    });
+};
+/**
+ * @private
+ */
+const ConfigurationpageCameraDropdown = (props) => {
+    /* @conditional-compile-remove(call-readiness) */
+    const theme = useTheme();
+    /* @conditional-compile-remove(call-readiness) */
+    const adapter = useAdapter();
+    /* @conditional-compile-remove(call-readiness) */
+    const devicePermissionDropdownStringsCamera = {
+        placeHolderText: 'Enable Camera (optional)',
+        actionButtonContent: 'Allow'
+    };
+    /* @conditional-compile-remove(call-readiness) */
+    const cameraBlockedDropdown = (React__default['default'].createElement(_DevicePermissionDropdown, { styles: dropDownStyles(theme), onClickActionButton: () => __awaiter$9(void 0, void 0, void 0, function* () {
+            yield adapter.askDevicePermission({ video: true, audio: false });
+            if (props.cameraPermissionGranted) {
+                adapter.queryCameras();
+            }
+        }), strings: devicePermissionDropdownStringsCamera, icon: React__default['default'].createElement(CallCompositeIcon, { iconName: "ControlButtonCameraOn", style: { height: '1.25rem', marginRight: '0.625rem' } }) }));
+    /* @conditional-compile-remove(call-readiness) */
+    return React__default['default'].createElement(React__default['default'].Fragment, null, props.cameraPermissionGranted ? props.cameraGrantedDropdown : cameraBlockedDropdown);
+};
+
+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); } }
+        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());
+    });
+};
+/**
+ * @private
+ */
+const ConfigurationpageMicDropdown = (props) => {
+    /* @conditional-compile-remove(call-readiness) */
+    const theme = useTheme();
+    /* @conditional-compile-remove(call-readiness) */
+    const adapter = useAdapter();
+    /* @conditional-compile-remove(call-readiness) */
+    const devicePermissionDropdownStringsMicrophone = {
+        placeHolderText: 'Enable Microphone (required)',
+        actionButtonContent: 'Allow'
+    };
+    /* @conditional-compile-remove(call-readiness) */
+    const microphoneBlockedDropdown = (React__default['default'].createElement(_DevicePermissionDropdown, { styles: dropDownStyles(theme), onClickActionButton: () => __awaiter$8(void 0, void 0, void 0, function* () {
+            yield adapter.askDevicePermission({ video: false, audio: true });
+            if (props.micPermissionGranted) {
+                adapter.queryMicrophones();
+                adapter.querySpeakers();
+            }
+        }), strings: devicePermissionDropdownStringsMicrophone, icon: React__default['default'].createElement(CallCompositeIcon, { iconName: "ControlButtonMicOn", style: { height: '1.25rem', marginRight: '0.625rem' } }) }));
+    /* @conditional-compile-remove(call-readiness) */
+    return React__default['default'].createElement(React__default['default'].Fragment, null,
+        " ",
+        props.micPermissionGranted ? props.micGrantedDropdown : microphoneBlockedDropdown);
+};
+
 // Copyright (c) Microsoft Corporation.
 const getDropDownList = (list) => {
     // Remove duplicates
@@ -17094,46 +17275,62 @@ const LocalDeviceSettings = (props) => {
     var _a;
     const theme = useTheme();
     const locale = useLocale();
+    /* @conditional-compile-remove(call-readiness) */
+    const adapter = useAdapter();
     const defaultPlaceHolder = locale.strings.call.defaultPlaceHolder;
     const cameraLabel = locale.strings.call.cameraLabel;
     const soundLabel = locale.strings.call.soundLabel;
-    let isSelectCamEnabled = props.cameraPermissionGranted;
-    let isSelectMicEnabled = props.microphonePermissionGranted;
+    const cameraPermissionGranted = props.cameraPermissionGranted;
+    const micPermissionGranted = props.microphonePermissionGranted;
+    let roleCanUseCamera = true;
+    let roleCanUseMic = true;
     /* @conditional-compile-remove(rooms) */
-    const permissions = _usePermissions();
+    const rolePermissions = _usePermissions();
     /* @conditional-compile-remove(rooms) */
-    isSelectCamEnabled = isSelectCamEnabled && permissions.cameraButton;
+    roleCanUseCamera = rolePermissions.cameraButton;
     /* @conditional-compile-remove(rooms) */
-    isSelectMicEnabled = isSelectMicEnabled && permissions.microphoneButton;
+    roleCanUseMic = rolePermissions.microphoneButton;
     // TODO: speaker permission is tied to microphone permission (when you request 'audio' permission using the SDK) its
     // actually granting access to query both microphone and speaker. However the browser popup asks you explicity for
     // 'microphone'. This needs investigation on how we want to handle this and maybe needs follow up with SDK team.
+    /* @conditional-compile-remove(call-readiness) */
+    React.useEffect(() => {
+        if (cameraPermissionGranted) {
+            adapter.queryCameras();
+        }
+        if (micPermissionGranted) {
+            adapter.queryMicrophones();
+        }
+        adapter.querySpeakers();
+    }, [adapter, cameraPermissionGranted, micPermissionGranted]);
+    const cameraGrantedDropdown = (React__default['default'].createElement(react.Dropdown, { "data-ui-id": "call-composite-local-camera-settings", "aria-labelledby": 'call-composite-local-camera-settings-label', placeholder: defaultPlaceHolder, options: cameraPermissionGranted ? getDropDownList(props.cameras) : [{ key: 'deniedOrUnknown', text: '' }], styles: dropDownStyles(theme), disabled: !cameraPermissionGranted, errorMessage: props.cameraPermissionGranted === undefined || props.cameraPermissionGranted
+            ? undefined
+            : locale.strings.call.cameraPermissionDenied, defaultSelectedKey: micPermissionGranted
+            ? props.selectedCamera
+                ? props.selectedCamera.id
+                : props.cameras
+                    ? (_a = props.cameras[0]) === null || _a === void 0 ? void 0 : _a.id
+                    : ''
+            : 'deniedOrUnknown', onChange: (event, option, index) => {
+            props.onSelectCamera(props.cameras[index !== null && index !== void 0 ? index : 0], localVideoViewOptions);
+        }, onRenderTitle: (props) => onRenderTitle('Camera', props) }));
+    const micGrantedDropdown = (React__default['default'].createElement(React__default['default'].Fragment, null, roleCanUseMic && (React__default['default'].createElement(react.Dropdown, { "aria-labelledby": 'call-composite-local-sound-settings-label', placeholder: defaultPlaceHolder, styles: dropDownStyles(theme), disabled: !micPermissionGranted, errorMessage: props.microphonePermissionGranted === undefined || props.microphonePermissionGranted
+            ? undefined
+            : locale.strings.call.microphonePermissionDenied, options: micPermissionGranted ? getDropDownList(props.microphones) : [{ key: 'deniedOrUnknown', text: '' }], defaultSelectedKey: micPermissionGranted
+            ? props.selectedMicrophone
+                ? props.selectedMicrophone.id
+                : defaultDeviceId(props.microphones)
+            : 'deniedOrUnknown', onChange: (event, option, index) => {
+            props.onSelectMicrophone(props.microphones[index !== null && index !== void 0 ? index : 0]);
+        }, onRenderTitle: (props) => onRenderTitle('Microphone', props) }))));
     return (React__default['default'].createElement(react.Stack, { "data-ui-id": "call-composite-device-settings", tokens: mainStackTokens },
-        isSelectCamEnabled && (React__default['default'].createElement(react.Stack, null,
-            React__default['default'].createElement(react.Label, { id: 'call-composite-local-camera-settings-label', className: react.mergeStyles(dropDownStyles(theme).label), disabled: !isSelectCamEnabled }, cameraLabel),
-            React__default['default'].createElement(react.Dropdown, { "data-ui-id": "call-composite-local-camera-settings", "aria-labelledby": 'call-composite-local-camera-settings-label', placeholder: defaultPlaceHolder, options: isSelectCamEnabled ? getDropDownList(props.cameras) : [{ key: 'deniedOrUnknown', text: '' }], styles: dropDownStyles(theme), errorMessage: props.cameraPermissionGranted === undefined || props.cameraPermissionGranted
-                    ? undefined
-                    : locale.strings.call.cameraPermissionDenied, defaultSelectedKey: isSelectMicEnabled
-                    ? props.selectedCamera
-                        ? props.selectedCamera.id
-                        : props.cameras
-                            ? (_a = props.cameras[0]) === null || _a === void 0 ? void 0 : _a.id
-                            : ''
-                    : 'deniedOrUnknown', onChange: (event, option, index) => {
-                    props.onSelectCamera(props.cameras[index !== null && index !== void 0 ? index : 0], localVideoViewOptions);
-                }, onRenderTitle: (props) => onRenderTitle('Camera', props) }))),
+        roleCanUseCamera && (React__default['default'].createElement(react.Stack, null,
+            React__default['default'].createElement(react.Label, { id: 'call-composite-local-camera-settings-label', className: react.mergeStyles(dropDownStyles(theme).label), disabled: !cameraPermissionGranted }, cameraLabel),
+            React__default['default'].createElement(ConfigurationpageCameraDropdown, { cameraGrantedDropdown: cameraGrantedDropdown, cameraPermissionGranted: cameraPermissionGranted !== null && cameraPermissionGranted !== void 0 ? cameraPermissionGranted : false }))),
         React__default['default'].createElement(react.Stack, null,
-            React__default['default'].createElement(react.Label, { id: 'call-composite-local-sound-settings-label', className: react.mergeStyles(dropDownStyles(theme).label), disabled: !isSelectMicEnabled }, soundLabel),
+            React__default['default'].createElement(react.Label, { id: 'call-composite-local-sound-settings-label', className: react.mergeStyles(dropDownStyles(theme).label), disabled: !micPermissionGranted }, soundLabel),
             React__default['default'].createElement(react.Stack, { "data-ui-id": "call-composite-sound-settings", tokens: mainStackTokens },
-                isSelectMicEnabled && (React__default['default'].createElement(react.Dropdown, { "aria-labelledby": 'call-composite-local-sound-settings-label', placeholder: defaultPlaceHolder, styles: dropDownStyles(theme), errorMessage: props.microphonePermissionGranted === undefined || props.microphonePermissionGranted
-                        ? undefined
-                        : locale.strings.call.microphonePermissionDenied, options: isSelectMicEnabled ? getDropDownList(props.microphones) : [{ key: 'deniedOrUnknown', text: '' }], defaultSelectedKey: isSelectMicEnabled
-                        ? props.selectedMicrophone
-                            ? props.selectedMicrophone.id
-                            : defaultDeviceId(props.microphones)
-                        : 'deniedOrUnknown', onChange: (event, option, index) => {
-                        props.onSelectMicrophone(props.microphones[index !== null && index !== void 0 ? index : 0]);
-                    }, onRenderTitle: (props) => onRenderTitle('Microphone', props) })),
+                React__default['default'].createElement(ConfigurationpageMicDropdown, { micGrantedDropdown: micGrantedDropdown, micPermissionGranted: micPermissionGranted !== null && micPermissionGranted !== void 0 ? micPermissionGranted : false }),
                 React__default['default'].createElement(react.Dropdown, { "aria-labelledby": 'call-composite-local-sound-settings-label', placeholder: defaultPlaceHolder, styles: dropDownStyles(theme), disabled: props.speakers.length === 0, options: getDropDownList(props.speakers), defaultSelectedKey: props.selectedSpeaker ? props.selectedSpeaker.id : defaultDeviceId(props.speakers), onChange: (event, option, index) => {
                         props.onSelectSpeaker(props.speakers[index !== null && index !== void 0 ? index : 0]);
                     }, onRenderTitle: (props) => onRenderTitle('Speaker', props) })))));
@@ -17389,8 +17586,8 @@ const startCallButtonStyleMobile = react.mergeStyles({
  * @private
  */
 const ConfigurationPage = (props) => {
-    var _a;
-    const { startCallHandler, mobileView } = props;
+    var _a, _b;
+    const { startCallHandler, mobileView, /* @conditional-compile-remove(call-readiness) */ devicePermissions } = props;
     const options = useAdaptedSelector(getSelector$1(DevicesButton));
     const localDeviceSettingsHandlers = useHandlers();
     const { video: cameraPermissionGranted, audio: microphonePermissionGranted } = useSelector$1(devicePermissionSelector);
@@ -17406,6 +17603,17 @@ const ConfigurationPage = (props) => {
         // because microphone device permission is not needed for the user's role
         disableStartCallButton = false;
     }
+    /* @conditional-compile-remove(call-readiness) */
+    // Overrides role permissions if CallCompositeOptions devicePermissions are set
+    if (devicePermissions) {
+        if (['doNotPrompt', 'optional'].includes(devicePermissions.camera) &&
+            ['doNotPrompt', 'optional'].includes(devicePermissions.microphone)) {
+            disableStartCallButton = false;
+        }
+        else if (devicePermissions.camera === 'required') {
+            disableStartCallButton = !cameraPermissionGranted || ((_b = deviceState.cameras) === null || _b === void 0 ? void 0 : _b.length) === 0;
+        }
+    }
     const locale = useLocale();
     const title = (React__default['default'].createElement(react.Stack.Item, { className: mobileView ? titleContainerStyleMobile : titleContainerStyleDesktop }, locale.strings.call.configurationPageTitle));
     const callDescription = locale.strings.call.configurationPageCallDetails && (React__default['default'].createElement(react.Stack.Item, { className: mobileView ? callDetailsStyleMobile : callDetailsStyleDesktop }, locale.strings.call.configurationPageCallDetails));
@@ -17770,6 +17978,7 @@ var __awaiter$5 = (window && window.__awaiter) || function (thisArg, _arguments,
     });
 };
 const MainScreen = (props) => {
+    var _a;
     const { callInvitationUrl, onRenderAvatar, onFetchAvatarPersonaData, onFetchParticipantMenuItems } = props;
     const page = useSelector$1(getPage);
     const adapter = useAdapter();
@@ -17788,7 +17997,9 @@ const MainScreen = (props) => {
         case 'configuration':
             pageElement = (React__default['default'].createElement(ConfigurationPage, { mobileView: props.mobileView, startCallHandler: () => {
                     adapter.joinCall();
-                } }));
+                }, 
+                /* @conditional-compile-remove(call-readiness) */
+                devicePermissions: (_a = props.options) === null || _a === void 0 ? void 0 : _a.devicePermissions }));
             break;
         case 'accessDeniedTeamsMeeting':
             pageElement = (React__default['default'].createElement(NoticePage, { iconName: "NoticePageAccessDeniedTeamsMeeting", title: locale.strings.call.failedToJoinTeamsMeetingReasonAccessDeniedTitle, moreDetails: locale.strings.call.failedToJoinTeamsMeetingReasonAccessDeniedMoreDetails, dataUiId: 'access-denied-teams-meeting-page' }));
@@ -17852,12 +18063,33 @@ const CallComposite = (props) => {
                 adapter.querySpeakers();
                 return;
             }
+            /* @conditional-compile-remove(call-readiness) */
+            if (options === null || options === void 0 ? void 0 : options.devicePermissions) {
+                const videoPermission = (options === null || options === void 0 ? void 0 : options.devicePermissions.camera) !== 'doNotPrompt';
+                const audioPermission = (options === null || options === void 0 ? void 0 : options.devicePermissions.microphone) !== 'doNotPrompt';
+                yield adapter.askDevicePermission({
+                    video: videoPermission,
+                    audio: audioPermission
+                });
+                if (videoPermission) {
+                    adapter.queryCameras();
+                }
+                if (audioPermission) {
+                    adapter.queryMicrophones();
+                }
+                adapter.querySpeakers();
+                return;
+            }
             yield adapter.askDevicePermission({ video: true, audio: true });
             adapter.queryCameras();
             adapter.queryMicrophones();
             adapter.querySpeakers();
         }))();
-    }, [adapter, /* @conditional-compile-remove(rooms) */ role]);
+    }, [
+        adapter,
+        /* @conditional-compile-remove(rooms) */ role,
+        /* @conditional-compile-remove(call-readiness) */ options === null || options === void 0 ? void 0 : options.devicePermissions
+    ]);
     const mobileView = formFactor === 'mobile';
     /* @conditional-compile-remove(one-to-n-calling) */
     const modalLayerHostId = reactHooks.useId('modalLayerhost');
@@ -17877,7 +18109,9 @@ const CallComposite = (props) => {
                 // the Modal because the draggable bounds thinks it has no space and will always return to its initial position after dragging.
                 // Additionally, this layer host cannot be in the Call Arrangement as it needs to be rendered before useMinMaxDragPosition() in
                 // common/utils useRef is called.
-                // Warning: this is fragile and works because the call arrangement page is only rendered after the call has connected and thus this LayerHost will be guaranteed to have rendered (and subsequently mounted in the DOM). This ensures the DOM element will be available before the call to `document.getElementById(modalLayerHostId)` is made.
+                // Warning: this is fragile and works because the call arrangement page is only rendered after the call has connected and thus this
+                // LayerHost will be guaranteed to have rendered (and subsequently mounted in the DOM). This ensures the DOM element will be available
+                // before the call to `document.getElementById(modalLayerHostId)` is made.
                 /* @conditional-compile-remove(one-to-n-calling) */
                 mobileView && React__default['default'].createElement(react.LayerHost, { id: modalLayerHostId, className: react.mergeStyles(modalLayerHostStyle) })))));
 };
@@ -18014,7 +18248,7 @@ class CallContext {
         this.emitter.off('callEnded', handler);
     }
     updateClientState(clientState) {
-        var _a, _b, _c;
+        var _a;
         const call = this.callId ? clientState.calls[this.callId] : undefined;
         const latestEndedCall = findLatestEndedCall(clientState.callsEnded);
         // As the state is transitioning to a new state, trigger appropriate callback events.
@@ -18022,13 +18256,11 @@ class CallContext {
         const newPage = getCallCompositePage(call, latestEndedCall);
         if (!IsCallEndedPage(oldPage) && IsCallEndedPage(newPage)) {
             this.emitter.emit('callEnded', {
-                callId: this.callId,
-                callEndedCode: (_a = latestEndedCall === null || latestEndedCall === void 0 ? void 0 : latestEndedCall.callEndReason) === null || _a === void 0 ? void 0 : _a.code,
-                callEndedSubCode: (_b = latestEndedCall === null || latestEndedCall === void 0 ? void 0 : latestEndedCall.callEndReason) === null || _b === void 0 ? void 0 : _b.subCode
+                callId: this.callId
             });
         }
         if (this.state.page) {
-            this.setState(Object.assign(Object.assign({}, this.state), { userId: clientState.userId, displayName: (_c = clientState.callAgent) === null || _c === void 0 ? void 0 : _c.displayName, call, page: newPage, endedCall: latestEndedCall, devices: clientState.deviceManager, latestErrors: clientState.latestErrors }));
+            this.setState(Object.assign(Object.assign({}, this.state), { userId: clientState.userId, displayName: (_a = clientState.callAgent) === null || _a === void 0 ? void 0 : _a.displayName, call, page: newPage, endedCall: latestEndedCall, devices: clientState.deviceManager, latestErrors: clientState.latestErrors }));
         }
     }
 }
@@ -18343,10 +18575,10 @@ class AzureCommunicationCallAdapter {
         const idsToAdd = participants.map((participant) => {
             // FIXME: `onStartCall` does not allow a Teams user.
             // Need some way to return an error if a Teams user is provided.
-            const backendId = fromFlatCommunicationIdentifier(participant);
+            const backendId = _toCommunicationIdentifier(participant);
             if (communicationCommon.isPhoneNumberIdentifier(backendId)) {
                 if ((options === null || options === void 0 ? void 0 : options.alternateCallerId) === undefined) {
-                    throw new Error('unable to start call, PSTN user present with no alternateCallerId.');
+                    throw new Error('Unable to start call, PSTN user present with no alternateCallerId.');
                 }
                 return backendId;
             }
@@ -18372,7 +18604,10 @@ class AzureCommunicationCallAdapter {
     }
     removeParticipant(userId) {
         return __awaiter$4(this, void 0, void 0, function* () {
-            this.handlers.onRemoveParticipant(userId);
+            let participant = userId;
+            /* @conditional-compile-remove(PSTN-calls) */
+            participant = _toCommunicationIdentifier(userId);
+            this.handlers.onRemoveParticipant(participant);
         });
     }
     /* @conditional-compile-remove(PSTN-calls) */
@@ -19155,7 +19390,10 @@ class CallWithChatBackedCallAdapter {
         };
         this.leaveCall = () => __awaiter$3(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.leaveCall(); });
         this.startCall = (participants, options) => {
-            return this.callWithChatAdapter.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$3(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.setCamera(sourceId, options); });
         this.setMicrophone = (sourceId) => __awaiter$3(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.setMicrophone(sourceId); });
@@ -19170,7 +19408,12 @@ class CallWithChatBackedCallAdapter {
         this.unmute = () => __awaiter$3(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.unmute(); });
         this.startScreenShare = () => __awaiter$3(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.startScreenShare(); });
         this.stopScreenShare = () => __awaiter$3(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.stopScreenShare(); });
-        this.removeParticipant = (userId) => __awaiter$3(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.removeParticipant(userId); });
+        this.removeParticipant = (userId) => __awaiter$3(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$3(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.createStreamView(remoteUserId, options); });
         this.disposeStreamView = (remoteUserId, options) => __awaiter$3(this, void 0, void 0, function* () { return yield this.callWithChatAdapter.disposeStreamView(remoteUserId, options); });
         /* @conditional-compile-remove(PSTN-calls) */
@@ -19564,7 +19807,8 @@ const CallWithChatPane = (props) => {
                 React__default['default'].createElement(react.Stack.Item, { verticalFill: true, styles: scrollableContainerContents },
                     React__default['default'].createElement(react.Stack, { styles: props.activePane === 'chat' ? availableSpaceStyles : hiddenStyles }, chatContent),
                     React__default['default'].createElement(react.Stack, { styles: props.activePane === 'people' ? availableSpaceStyles : hiddenStyles }, peopleContent)))),
-        props.mobileView && (React__default['default'].createElement(ModalLocalAndRemotePIP, { callAdapter: props.callAdapter, modalLayerHostId: props.modalLayerHostId, hidden: hidden, styles: pipStyles, minDragPosition: minMaxDragPosition.minDragPosition, maxDragPosition: minMaxDragPosition.maxDragPosition })),
+        props.mobileView && (React__default['default'].createElement(CallAdapterProvider, { adapter: props.callAdapter },
+            React__default['default'].createElement(ModalLocalAndRemotePIP, { modalLayerHostId: props.modalLayerHostId, hidden: hidden, styles: pipStyles, minDragPosition: minMaxDragPosition.minDragPosition, maxDragPosition: minMaxDragPosition.maxDragPosition }))),
         drawerMenuItems.length > 0 && (React__default['default'].createElement(react.Stack, { styles: drawerContainerStyles$1 },
             React__default['default'].createElement(_DrawerMenu, { onLightDismiss: () => setDrawerMenuItems([]), items: drawerMenuItems })))));
 };
@@ -19692,7 +19936,11 @@ const CallWithChatScreen = (props) => {
                 React__default['default'].createElement(react.Stack.Item, { grow: true, styles: callCompositeContainerStyles, 
                     // Perf: Instead of removing the video gallery from DOM, we hide it to prevent re-renders.
                     style: callCompositeContainerCSS },
-                    React__default['default'].createElement(CallComposite, Object.assign({}, props, { formFactor: formFactor, options: { callControls: false }, adapter: callAdapter, fluentTheme: fluentTheme }))),
+                    React__default['default'].createElement(CallComposite, Object.assign({}, props, { formFactor: formFactor, options: {
+                            callControls: false,
+                            /* @conditional-compile-remove(call-readiness) */
+                            devicePermissions: props.devicePermissions
+                        }, adapter: callAdapter, fluentTheme: fluentTheme }))),
                 chatProps.adapter && callAdapter && hasJoinedCall && (React__default['default'].createElement(CallWithChatPane, { chatCompositeProps: chatProps, inviteLink: props.joinInvitationURL, onClose: closePane, chatAdapter: chatProps.adapter, callAdapter: callAdapter, onFetchAvatarPersonaData: props.onFetchAvatarPersonaData, onFetchParticipantMenuItems: props.onFetchParticipantMenuItems, onChatButtonClicked: showShowChatTabHeaderButton(props.callControls) ? selectChat : undefined, onPeopleButtonClicked: showShowPeopleTabHeaderButton(props.callControls) ? selectPeople : undefined, modalLayerHostId: modalLayerHostId, mobileView: mobileView, activePane: activePane, 
                     /* @conditional-compile-remove(file-sharing) */
                     fileSharing: props.fileSharing, rtl: props.rtl, callControls: typeof props.callControls !== 'boolean' ? props.callControls : undefined }))),
@@ -19729,7 +19977,9 @@ const CallWithChatScreen = (props) => {
 const CallWithChatComposite = (props) => {
     const { adapter, fluentTheme, rtl, formFactor, joinInvitationURL, options } = props;
     return (React__default['default'].createElement(BaseProvider, { fluentTheme: fluentTheme, rtl: rtl, locale: props.locale, icons: props.icons },
-        React__default['default'].createElement(CallWithChatScreen, Object.assign({}, props, { callWithChatAdapter: adapter, formFactor: formFactor, callControls: options === null || options === void 0 ? void 0 : options.callControls, joinInvitationURL: joinInvitationURL, fluentTheme: fluentTheme, 
+        React__default['default'].createElement(CallWithChatScreen, Object.assign({}, props, { 
+            /* @conditional-compile-remove(call-readiness) */
+            devicePermissions: options === null || options === void 0 ? void 0 : options.devicePermissions, callWithChatAdapter: adapter, formFactor: formFactor, callControls: options === null || options === void 0 ? void 0 : options.callControls, joinInvitationURL: joinInvitationURL, fluentTheme: fluentTheme, 
             /* @conditional-compile-remove(file-sharing) */
             fileSharing: options === null || options === void 0 ? void 0 : options.fileSharing }))));
 };
@@ -19976,7 +20226,10 @@ class AzureCommunicationCallWithChatAdapter {
     }
     /** Start a new Call. */
     startCall(participants, options) {
-        return this.callAdapter.startCall(participants, options);
+        let communicationParticipants = participants;
+        /* @conditional-compile-remove(PSTN-calls) */
+        communicationParticipants = participants.map(_toCommunicationIdentifier);
+        return this.callAdapter.startCall(communicationParticipants, options);
     }
     /**
      * Subscribe to state change events.
@@ -20006,8 +20259,10 @@ class AzureCommunicationCallWithChatAdapter {
     /** Remove a participant from the Call only. */
     removeParticipant(userId) {
         return __awaiter(this, void 0, void 0, function* () {
-            // Only remove the participant from the GroupCall. Contoso must manage access to Chat.
-            yield this.callAdapter.removeParticipant(userId);
+            let participant = userId;
+            /* @conditional-compile-remove(PSTN-calls) */
+            participant = _toCommunicationIdentifier(userId);
+            yield this.callAdapter.removeParticipant(participant);
         });
     }
     setCamera(device, options) {
@@ -20575,6 +20830,7 @@ exports.TypingIndicator = TypingIndicator;
 exports.UnsupportedBrowser = UnsupportedBrowser;
 exports.VideoGallery = VideoGallery;
 exports.VideoTile = VideoTile;
+exports._DevicePermissionDropdown = _DevicePermissionDropdown;
 exports._IdentifierProvider = _IdentifierProvider;
 exports.createAzureCommunicationCallAdapter = createAzureCommunicationCallAdapter;
 exports.createAzureCommunicationCallAdapterFromClient = createAzureCommunicationCallAdapterFromClient;