@azure/communication-react 1.3.2-alpha-202208060014.0 → 1.3.2-alpha-202208110020.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/communication-react.d.ts +27 -9
- package/dist/dist-cjs/communication-react/index.js +266 -103
- package/dist/dist-cjs/communication-react/index.js.map +1 -1
- package/dist/dist-esm/acs-ui-common/src/telemetryVersion.js +1 -1
- package/dist/dist-esm/calling-component-bindings/src/utils/videoGalleryUtils.d.ts.map +1 -1
- package/dist/dist-esm/calling-component-bindings/src/utils/videoGalleryUtils.js +1 -24
- package/dist/dist-esm/calling-component-bindings/src/utils/videoGalleryUtils.js.map +1 -1
- package/dist/dist-esm/communication-react/src/index.d.ts +2 -2
- package/dist/dist-esm/communication-react/src/index.d.ts.map +1 -1
- package/dist/dist-esm/communication-react/src/index.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/CameraButton.d.ts.map +1 -1
- package/dist/dist-esm/react-components/src/components/CameraButton.js +3 -1
- package/dist/dist-esm/react-components/src/components/CameraButton.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/Dialpad/Dialpad.d.ts.map +1 -1
- package/dist/dist-esm/react-components/src/components/Dialpad/Dialpad.js +1 -1
- package/dist/dist-esm/react-components/src/components/Dialpad/Dialpad.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/FileCard.js +1 -1
- package/dist/dist-esm/react-components/src/components/FileCard.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/ParticipantItem.d.ts +15 -0
- package/dist/dist-esm/react-components/src/components/ParticipantItem.d.ts.map +1 -1
- package/dist/dist-esm/react-components/src/components/ParticipantItem.js +32 -14
- package/dist/dist-esm/react-components/src/components/ParticipantItem.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/ParticipantList.d.ts.map +1 -1
- package/dist/dist-esm/react-components/src/components/ParticipantList.js +4 -1
- package/dist/dist-esm/react-components/src/components/ParticipantList.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/RemoteVideoTile.d.ts +2 -2
- package/dist/dist-esm/react-components/src/components/RemoteVideoTile.d.ts.map +1 -1
- package/dist/dist-esm/react-components/src/components/RemoteVideoTile.js +3 -3
- package/dist/dist-esm/react-components/src/components/RemoteVideoTile.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/StreamMedia.d.ts.map +1 -1
- package/dist/dist-esm/react-components/src/components/StreamMedia.js +1 -1
- package/dist/dist-esm/react-components/src/components/StreamMedia.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/VideoGallery/RemoteScreenShare.js +1 -1
- package/dist/dist-esm/react-components/src/components/VideoGallery/RemoteScreenShare.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/VideoGallery.d.ts.map +1 -1
- package/dist/dist-esm/react-components/src/components/VideoGallery.js +46 -16
- package/dist/dist-esm/react-components/src/components/VideoGallery.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/VideoTile.d.ts +2 -2
- package/dist/dist-esm/react-components/src/components/VideoTile.d.ts.map +1 -1
- package/dist/dist-esm/react-components/src/components/VideoTile.js +2 -2
- package/dist/dist-esm/react-components/src/components/VideoTile.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/styles/ParticipantItem.styles.d.ts +8 -0
- package/dist/dist-esm/react-components/src/components/styles/ParticipantItem.styles.d.ts.map +1 -1
- package/dist/dist-esm/react-components/src/components/styles/ParticipantItem.styles.js +17 -0
- package/dist/dist-esm/react-components/src/components/styles/ParticipantItem.styles.js.map +1 -1
- package/dist/dist-esm/react-components/src/index.d.ts +1 -1
- package/dist/dist-esm/react-components/src/index.d.ts.map +1 -1
- package/dist/dist-esm/react-components/src/localization/locales/en-US/strings.json +6 -3
- package/dist/dist-esm/react-components/src/types/OnRender.d.ts +3 -0
- package/dist/dist-esm/react-components/src/types/OnRender.d.ts.map +1 -1
- package/dist/dist-esm/react-components/src/types/ParticipantListParticipant.d.ts +6 -1
- package/dist/dist-esm/react-components/src/types/ParticipantListParticipant.d.ts.map +1 -1
- package/dist/dist-esm/react-components/src/types/VideoGalleryParticipant.d.ts +2 -6
- package/dist/dist-esm/react-components/src/types/VideoGalleryParticipant.d.ts.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/adapter/AzureCommunicationCallAdapter.js +2 -2
- package/dist/dist-esm/react-composites/src/composites/CallComposite/adapter/AzureCommunicationCallAdapter.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/CallArrangement.d.ts.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/CallArrangement.js +2 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/CallArrangement.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/CallPane.d.ts.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/CallPane.js +13 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/CallPane.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/LocalDeviceSettings.d.ts.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/LocalDeviceSettings.js +4 -2
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/LocalDeviceSettings.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/MediaGallery.d.ts.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/MediaGallery.js +26 -2
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/MediaGallery.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/pages/LobbyPage.js +2 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/pages/LobbyPage.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/styles/MediaGallery.styles.d.ts +40 -0
- package/dist/dist-esm/react-composites/src/composites/CallComposite/styles/MediaGallery.styles.d.ts.map +1 -0
- package/dist/dist-esm/react-composites/src/composites/CallComposite/styles/MediaGallery.styles.js +64 -0
- package/dist/dist-esm/react-composites/src/composites/CallComposite/styles/MediaGallery.styles.js.map +1 -0
- package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/CallWithChatPane.d.ts.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/CallWithChatPane.js +11 -1
- package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/CallWithChatPane.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/adapter/CallWithChatBackedCallAdapter.js +3 -1
- package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/adapter/CallWithChatBackedCallAdapter.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/state/CallWithChatAdapterState.d.ts +2 -0
- package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/state/CallWithChatAdapterState.d.ts.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/state/CallWithChatAdapterState.js +3 -1
- package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/state/CallWithChatAdapterState.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/common/AddPeopleButton.d.ts +4 -0
- package/dist/dist-esm/react-composites/src/composites/common/AddPeopleButton.d.ts.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/common/AddPeopleButton.js +2 -2
- package/dist/dist-esm/react-composites/src/composites/common/AddPeopleButton.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/common/AddPeopleDropdown.d.ts +4 -0
- package/dist/dist-esm/react-composites/src/composites/common/AddPeopleDropdown.d.ts.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/common/AddPeopleDropdown.js +19 -15
- package/dist/dist-esm/react-composites/src/composites/common/AddPeopleDropdown.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/common/CallingDialpad.d.ts +4 -0
- package/dist/dist-esm/react-composites/src/composites/common/CallingDialpad.d.ts.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/common/CallingDialpad.js +11 -4
- package/dist/dist-esm/react-composites/src/composites/common/CallingDialpad.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/common/PeoplePaneContent.d.ts +4 -0
- package/dist/dist-esm/react-composites/src/composites/common/PeoplePaneContent.d.ts.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/common/PeoplePaneContent.js +10 -2
- package/dist/dist-esm/react-composites/src/composites/common/PeoplePaneContent.js.map +1 -1
- package/package.json +8 -8
@@ -192,7 +192,7 @@ const fromFlatCommunicationIdentifier = (id) => {
|
|
192
192
|
// Copyright (c) Microsoft Corporation.
|
193
193
|
// Licensed under the MIT license.
|
194
194
|
// GENERATED FILE. DO NOT EDIT MANUALLY.
|
195
|
-
var telemetryVersion = '1.3.2-alpha-
|
195
|
+
var telemetryVersion = '1.3.2-alpha-202208110020.0';
|
196
196
|
|
197
197
|
// Copyright (c) Microsoft Corporation.
|
198
198
|
/**
|
@@ -958,7 +958,7 @@ const typingIndicatorStringStyle = react.mergeStyles({
|
|
958
958
|
wordBreak: 'break-word'
|
959
959
|
});
|
960
960
|
|
961
|
-
var participantItem$d={isMeText:"(you)",menuTitle:"More Options",removeButtonLabel:"Remove",sharingIconLabel:"Sharing",mutedIconLabel:"Muted",displayNamePlaceholder:"Unnamed Participant"};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$e={onLabel:"Resume",offLabel:"Hold",toolTipOnContent:"Resume call",toolTipOffContent:"Hold call"};var videoTile={participantStateConnecting:"
|
961
|
+
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$e={onLabel:"Resume",offLabel:"Hold",toolTipOnContent:"Resume call",toolTipOffContent:"Hold call"};var videoTile={participantStateConnecting:"Calling...",participantStateRinging:"Calling...",participantStateHold:"On Hold"};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$e,videoTile:videoTile};
|
962
962
|
|
963
963
|
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};
|
964
964
|
|
@@ -2336,7 +2336,7 @@ const _FileCard = (props) => {
|
|
2336
2336
|
height: _pxToRem(progressBarThicknessPx)
|
2337
2337
|
}
|
2338
2338
|
};
|
2339
|
-
return (React__default['default'].createElement(
|
2339
|
+
return (React__default['default'].createElement("div", { "data-is-focusable": true },
|
2340
2340
|
React__default['default'].createElement(Announcer, { announcementString: announcerString, ariaLive: 'polite' }),
|
2341
2341
|
React__default['default'].createElement(react.Stack, { className: containerClassName, onClick: () => {
|
2342
2342
|
var _a;
|
@@ -4316,7 +4316,7 @@ const StreamMedia = (props) => {
|
|
4316
4316
|
};
|
4317
4317
|
}, [videoStreamElement]);
|
4318
4318
|
return (React__default['default'].createElement("div", { className: container() },
|
4319
|
-
React__default['default'].createElement("div", { className: react.mergeStyles(isMirrored && pipEnabled ? invertedVideoInPipStyle(theme) : mediaContainer(theme), styles === null || styles === void 0 ? void 0 : styles.root), ref: containerEl }),
|
4319
|
+
React__default['default'].createElement("div", { "data-ui-id": "stream-media-container", className: react.mergeStyles(isMirrored && pipEnabled ? invertedVideoInPipStyle(theme) : mediaContainer(theme), styles === null || styles === void 0 ? void 0 : styles.root), ref: containerEl }),
|
4320
4320
|
loadingState === 'loading' && (React__default['default'].createElement("div", { className: loadingSpinnerContainer() },
|
4321
4321
|
React__default['default'].createElement(react.Spinner, { "data-ui-id": "stream-media-loading-spinner", styles: loadSpinnerStyles })))));
|
4322
4322
|
};
|
@@ -4342,6 +4342,23 @@ const participantItemContainerStyle = (options) => {
|
|
4342
4342
|
const menuButtonContainerStyle = {
|
4343
4343
|
width: '1.5rem'
|
4344
4344
|
};
|
4345
|
+
/**
|
4346
|
+
* @private
|
4347
|
+
*/
|
4348
|
+
const participantStateMaxWidth = '5rem';
|
4349
|
+
/**
|
4350
|
+
* @private
|
4351
|
+
*/
|
4352
|
+
const participantStateStringStyles = {
|
4353
|
+
maxWidth: participantStateMaxWidth,
|
4354
|
+
overflow: 'hidden',
|
4355
|
+
textOverflow: 'ellipsis',
|
4356
|
+
whiteSpace: 'nowrap',
|
4357
|
+
lineHeight: 'normal',
|
4358
|
+
paddingLeft: '1rem',
|
4359
|
+
marginLeft: 'auto',
|
4360
|
+
marginRight: 0
|
4361
|
+
};
|
4345
4362
|
/**
|
4346
4363
|
* @private
|
4347
4364
|
*/
|
@@ -4375,16 +4392,16 @@ const meContainerStyle = {
|
|
4375
4392
|
* @public
|
4376
4393
|
*/
|
4377
4394
|
const ParticipantItem = (props) => {
|
4378
|
-
|
4379
|
-
|
4395
|
+
const { userId, displayName, onRenderAvatar, menuItems, onRenderIcon, presence, styles, me, onClick, showParticipantOverflowTooltip
|
4396
|
+
/* @conditional-compile-remove(PSTN-calls) */
|
4397
|
+
} = props;
|
4380
4398
|
const [itemHovered, setItemHovered] = React.useState(false);
|
4381
4399
|
const [menuHidden, setMenuHidden] = React.useState(true);
|
4382
4400
|
const containerRef = React.useRef(null);
|
4383
4401
|
const theme = useTheme();
|
4384
4402
|
const localeStrings = useLocale$1().strings.participantItem;
|
4385
4403
|
const ids = useIdentifiers();
|
4386
|
-
const
|
4387
|
-
const menuTitle = (_d = (_c = props.strings) === null || _c === void 0 ? void 0 : _c.menuTitle) !== null && _d !== void 0 ? _d : localeStrings.menuTitle;
|
4404
|
+
const strings = Object.assign(Object.assign({}, localeStrings), props.strings);
|
4388
4405
|
const avatarOptions = {
|
4389
4406
|
text: displayName,
|
4390
4407
|
size: react.PersonaSize.size32,
|
@@ -4399,26 +4416,43 @@ const ParticipantItem = (props) => {
|
|
4399
4416
|
const meTextStyle = React.useMemo(() => react.mergeStyles(meContainerStyle, { color: theme.palette.neutralTertiary }, styles === null || styles === void 0 ? void 0 : styles.me), [theme.palette.neutralTertiary, styles === null || styles === void 0 ? void 0 : styles.me]);
|
4400
4417
|
const contextualMenuStyle = React.useMemo(() => react.mergeStyles({ background: theme.palette.neutralLighterAlt }, styles === null || styles === void 0 ? void 0 : styles.menu), [theme.palette.neutralLighterAlt, styles === null || styles === void 0 ? void 0 : styles.menu]);
|
4401
4418
|
const infoContainerStyle = React.useMemo(() => react.mergeStyles(iconContainerStyle$1, { color: theme.palette.neutralTertiary }, styles === null || styles === void 0 ? void 0 : styles.iconContainer), [theme.palette.neutralTertiary, styles === null || styles === void 0 ? void 0 : styles.iconContainer]);
|
4402
|
-
const menuButton = React.useMemo(() => (React__default['default'].createElement(react.Stack, { horizontal: true, horizontalAlign: "end", className: react.mergeStyles(menuButtonContainerStyle), title: menuTitle, "data-ui-id": ids.participantItemMenuButton },
|
4403
|
-
React__default['default'].createElement(react.Icon, { iconName: itemHovered ? 'ParticipantItemOptionsHovered' : 'ParticipantItemOptions', className: iconStyles$3 }))), [itemHovered, menuTitle, ids.participantItemMenuButton]);
|
4419
|
+
const menuButton = React.useMemo(() => (React__default['default'].createElement(react.Stack, { horizontal: true, horizontalAlign: "end", className: react.mergeStyles(menuButtonContainerStyle), title: strings.menuTitle, "data-ui-id": ids.participantItemMenuButton },
|
4420
|
+
React__default['default'].createElement(react.Icon, { iconName: itemHovered ? 'ParticipantItemOptionsHovered' : 'ParticipantItemOptions', className: iconStyles$3 }))), [itemHovered, strings.menuTitle, ids.participantItemMenuButton]);
|
4404
4421
|
const onDismissMenu = () => {
|
4405
4422
|
setItemHovered(false);
|
4406
4423
|
setMenuHidden(true);
|
4407
4424
|
};
|
4425
|
+
const participantStateString = participantStateStringTrampoline(props, strings);
|
4408
4426
|
return (React__default['default'].createElement("div", { ref: containerRef, role: 'menuitem', "data-is-focusable": true, className: react.mergeStyles(participantItemContainerStyle({ localparticipant: me, clickable: !!menuItems }), styles === null || styles === void 0 ? void 0 : styles.root), onMouseEnter: () => setItemHovered(true), onMouseLeave: () => setItemHovered(false), onClick: () => {
|
4409
|
-
|
4410
|
-
|
4411
|
-
|
4427
|
+
if (!participantStateString) {
|
4428
|
+
setItemHovered(true);
|
4429
|
+
setMenuHidden(false);
|
4430
|
+
onClick === null || onClick === void 0 ? void 0 : onClick(props);
|
4431
|
+
}
|
4412
4432
|
}, tabIndex: 0 },
|
4413
|
-
React__default['default'].createElement(react.Stack, { horizontal: true, className: react.mergeStyles({
|
4433
|
+
React__default['default'].createElement(react.Stack, { horizontal: true, className: react.mergeStyles({
|
4434
|
+
width: `calc(100% - ${!me && participantStateString ? participantStateMaxWidth : menuButtonContainerStyle.width})`,
|
4435
|
+
alignItems: 'center'
|
4436
|
+
}) },
|
4414
4437
|
avatar,
|
4415
|
-
me && React__default['default'].createElement(react.Text, { className: meTextStyle }, isMeText),
|
4438
|
+
me && React__default['default'].createElement(react.Text, { className: meTextStyle }, strings.isMeText),
|
4416
4439
|
React__default['default'].createElement(react.Stack, { horizontal: true, className: react.mergeStyles(infoContainerStyle) }, onRenderIcon && onRenderIcon(props))),
|
4417
|
-
menuItems && menuItems.length > 0 && (React__default['default'].createElement(React__default['default'].Fragment, null,
|
4440
|
+
!me && participantStateString ? (React__default['default'].createElement(react.Text, { className: react.mergeStyles(participantStateStringStyles) }, participantStateString)) : (React__default['default'].createElement("div", null, menuItems && menuItems.length > 0 && (React__default['default'].createElement(React__default['default'].Fragment, null,
|
4418
4441
|
menuButton,
|
4419
4442
|
React__default['default'].createElement(react.ContextualMenu, { items: menuItems, hidden: menuHidden, target: containerRef, onItemClick: onDismissMenu, onDismiss: onDismissMenu, directionalHint: react.DirectionalHint.bottomRightEdge, className: contextualMenuStyle, calloutProps: {
|
4420
4443
|
preventDismissOnEvent: _preventDismissOnEvent
|
4421
|
-
} })))));
|
4444
|
+
} })))))));
|
4445
|
+
};
|
4446
|
+
const participantStateStringTrampoline = (props, strings) => {
|
4447
|
+
/* @conditional-compile-remove(one-to-n-calling) */
|
4448
|
+
/* @conditional-compile-remove(PSTN-calls) */
|
4449
|
+
return props.participantState === 'Idle' || props.participantState === 'Connecting'
|
4450
|
+
? strings === null || strings === void 0 ? void 0 : strings.participantStateConnecting
|
4451
|
+
: props.participantState === 'EarlyMedia' || props.participantState === 'Ringing'
|
4452
|
+
? strings === null || strings === void 0 ? void 0 : strings.participantStateRinging
|
4453
|
+
: props.participantState === 'Hold'
|
4454
|
+
? strings === null || strings === void 0 ? void 0 : strings.participantStateHold
|
4455
|
+
: undefined;
|
4422
4456
|
};
|
4423
4457
|
|
4424
4458
|
// Copyright (c) Microsoft Corporation.
|
@@ -4466,7 +4500,10 @@ const onRenderParticipantDefault = (participant, strings, myUserId, onRenderAvat
|
|
4466
4500
|
callingParticipant.isMuted && (React__default['default'].createElement(react.Icon, { iconName: "ParticipantItemMicOff", className: iconStyles$2, ariaLabel: strings.mutedIconLabel }))))
|
4467
4501
|
: () => null;
|
4468
4502
|
const displayName = !participant.displayName ? strings.displayNamePlaceholder : participant.displayName;
|
4469
|
-
return (React__default['default'].createElement(ParticipantItem, { styles: styles, key: participant.userId, userId: participant.userId, displayName: displayName, me: myUserId ? participant.userId === myUserId : false, menuItems: menuItems, presence: presence, onRenderIcon: onRenderIcon, onRenderAvatar: onRenderAvatar, onClick: () => onParticipantClick === null || onParticipantClick === void 0 ? void 0 : onParticipantClick(participant), showParticipantOverflowTooltip: showParticipantOverflowTooltip
|
4503
|
+
return (React__default['default'].createElement(ParticipantItem, { styles: styles, key: participant.userId, userId: participant.userId, displayName: displayName, me: myUserId ? participant.userId === myUserId : false, menuItems: menuItems, presence: presence, onRenderIcon: onRenderIcon, onRenderAvatar: onRenderAvatar, onClick: () => onParticipantClick === null || onParticipantClick === void 0 ? void 0 : onParticipantClick(participant), showParticipantOverflowTooltip: showParticipantOverflowTooltip,
|
4504
|
+
/* @conditional-compile-remove(one-to-n-calling) */
|
4505
|
+
/* @conditional-compile-remove(PSTN-calls) */
|
4506
|
+
participantState: callingParticipant.state }));
|
4470
4507
|
};
|
4471
4508
|
const getParticipantsForDefaultRender = (participants, excludeMe, myUserId) => {
|
4472
4509
|
if (!excludeMe || !myUserId) {
|
@@ -4736,7 +4773,7 @@ const displayNameStyle = {
|
|
4736
4773
|
/**
|
4737
4774
|
* @private
|
4738
4775
|
*/
|
4739
|
-
const participantStateStyle = {
|
4776
|
+
const participantStateStyle$1 = {
|
4740
4777
|
textAlign: 'center',
|
4741
4778
|
paddingTop: '0.5rem',
|
4742
4779
|
fontWeight: 600,
|
@@ -4786,10 +4823,10 @@ const DefaultPlaceholder = (props) => {
|
|
4786
4823
|
if (!strings) {
|
4787
4824
|
return;
|
4788
4825
|
}
|
4789
|
-
if (participantState === 'Connecting') {
|
4826
|
+
if (participantState === 'Idle' || participantState === 'Connecting') {
|
4790
4827
|
return strings === null || strings === void 0 ? void 0 : strings.participantStateConnecting;
|
4791
4828
|
}
|
4792
|
-
else if (participantState === 'Ringing') {
|
4829
|
+
else if (participantState === 'EarlyMedia' || participantState === 'Ringing') {
|
4793
4830
|
return strings === null || strings === void 0 ? void 0 : strings.participantStateRinging;
|
4794
4831
|
}
|
4795
4832
|
else if (participantState === 'Hold') {
|
@@ -4800,7 +4837,7 @@ const DefaultPlaceholder = (props) => {
|
|
4800
4837
|
return (React__default['default'].createElement(react.Stack, { className: react.mergeStyles({ position: 'absolute', height: '100%', width: '100%' }) },
|
4801
4838
|
React__default['default'].createElement(react.Stack, { styles: defaultPersonaStyles },
|
4802
4839
|
React__default['default'].createElement(react.Persona, { coinSize: coinSize, hidePersonaDetails: hidePersonaDetails, text: text !== null && text !== void 0 ? text : '', initialsTextColor: "white", "aria-label": noVideoAvailableAriaLabel !== null && noVideoAvailableAriaLabel !== void 0 ? noVideoAvailableAriaLabel : '', showOverflowTooltip: false }),
|
4803
|
-
participantStateString && React__default['default'].createElement(react.Text, { className: react.mergeStyles(participantStateStyle) }, participantStateString))));
|
4840
|
+
participantStateString && React__default['default'].createElement(react.Text, { className: react.mergeStyles(participantStateStyle$1) }, participantStateString))));
|
4804
4841
|
};
|
4805
4842
|
const defaultPersonaStyles = { root: { margin: 'auto', maxHeight: '100%' } };
|
4806
4843
|
/**
|
@@ -4882,7 +4919,7 @@ const _RemoteVideoTile = React__default['default'].memo((props) => {
|
|
4882
4919
|
isMuted, isSpeaking, isScreenSharingOn, onCreateRemoteStreamView, onDisposeRemoteStreamView, remoteVideoViewOptions, renderElement, userId, displayName, onRenderAvatar, showMuteIndicator,
|
4883
4920
|
/* @conditional-compile-remove(one-to-n-calling) */
|
4884
4921
|
/* @conditional-compile-remove(PSTN-calls) */
|
4885
|
-
|
4922
|
+
participantState } = props;
|
4886
4923
|
const remoteVideoStreamProps = React.useMemo(() => ({
|
4887
4924
|
isMirrored: remoteVideoViewOptions === null || remoteVideoViewOptions === void 0 ? void 0 : remoteVideoViewOptions.isMirrored,
|
4888
4925
|
isScreenSharingOn,
|
@@ -4913,12 +4950,12 @@ const _RemoteVideoTile = React__default['default'].memo((props) => {
|
|
4913
4950
|
// Returning `undefined` results in the placeholder with avatar being shown
|
4914
4951
|
return undefined;
|
4915
4952
|
}
|
4916
|
-
return React__default['default'].createElement(StreamMedia, { videoStreamElement: renderElement, loadingState: isReceiving ? '
|
4953
|
+
return (React__default['default'].createElement(StreamMedia, { videoStreamElement: renderElement, loadingState: isReceiving === false ? 'loading' : 'none' }));
|
4917
4954
|
}, [renderElement, isReceiving]);
|
4918
4955
|
return (React__default['default'].createElement(VideoTile, { key: userId, userId: userId, renderElement: renderVideoStreamElement, displayName: displayName, onRenderPlaceholder: onRenderAvatar, isMuted: isMuted, isSpeaking: isSpeaking, showMuteIndicator: showMuteIndicator, showLabel: props.showLabel, personaMinSize: props.personaMinSize,
|
4919
4956
|
/* @conditional-compile-remove(one-to-n-calling) */
|
4920
4957
|
/* @conditional-compile-remove(PSTN-calls) */
|
4921
|
-
participantState:
|
4958
|
+
participantState: participantState }));
|
4922
4959
|
});
|
4923
4960
|
|
4924
4961
|
// Copyright (c) Microsoft Corporation.
|
@@ -5346,7 +5383,7 @@ const RemoteScreenShare = React__default['default'].memo((props) => {
|
|
5346
5383
|
participant: displayName
|
5347
5384
|
})
|
5348
5385
|
: '';
|
5349
|
-
return (React__default['default'].createElement(VideoTile, { displayName: displayName, isMuted: isMuted, renderElement: renderElement ? (React__default['default'].createElement(StreamMedia, { videoStreamElement: renderElement, loadingState: isReceiving ? '
|
5386
|
+
return (React__default['default'].createElement(VideoTile, { displayName: displayName, isMuted: isMuted, renderElement: renderElement ? (React__default['default'].createElement(StreamMedia, { videoStreamElement: renderElement, loadingState: isReceiving === false ? 'loading' : 'none' })) : undefined, onRenderPlaceholder: () => React__default['default'].createElement(LoadingSpinner, { loadingMessage: loadingMessage }) }));
|
5350
5387
|
});
|
5351
5388
|
const LoadingSpinner = (props) => {
|
5352
5389
|
return (React__default['default'].createElement(react.Stack, { verticalAlign: "center", className: loadingStyle },
|
@@ -6124,7 +6161,7 @@ const modalMaxDragPosition = { x: localVideoTileOuterPaddingPX, y: localVideoTil
|
|
6124
6161
|
* @public
|
6125
6162
|
*/
|
6126
6163
|
const VideoGallery = (props) => {
|
6127
|
-
var _a, _b, _c, _d;
|
6164
|
+
var _a, _b, _c, _d, _e;
|
6128
6165
|
const { localParticipant, remoteParticipants = [], localVideoViewOptions, remoteVideoViewOptions, dominantSpeakers, onRenderLocalVideoTile, onRenderRemoteVideoTile, onCreateLocalStreamView, onDisposeLocalStreamView, onCreateRemoteStreamView, onDisposeRemoteStreamView, styles, layout, onRenderAvatar, showMuteIndicator, maxRemoteVideoStreams = DEFAULT_MAX_REMOTE_VIDEO_STREAMS, showCameraSwitcherInLocalPreview, localVideoCameraCycleButtonProps } = props;
|
6129
6166
|
const ids = useIdentifiers();
|
6130
6167
|
const theme = useTheme();
|
@@ -6138,6 +6175,8 @@ const VideoGallery = (props) => {
|
|
6138
6175
|
const isNarrow = containerWidth ? isNarrowWidth(containerWidth) : false;
|
6139
6176
|
const visibleVideoParticipants = React.useRef([]);
|
6140
6177
|
const visibleAudioParticipants = React.useRef([]);
|
6178
|
+
/* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */
|
6179
|
+
const visibleCallingParticipants = React.useRef([]);
|
6141
6180
|
const modalWidth = isNarrow ? SMALL_FLOATING_MODAL_SIZE_PX.width : LARGE_FLOATING_MODAL_SIZE_PX.width;
|
6142
6181
|
const modalHeight = isNarrow ? SMALL_FLOATING_MODAL_SIZE_PX.height : LARGE_FLOATING_MODAL_SIZE_PX.height;
|
6143
6182
|
// The minimum drag position is the top left of the video gallery. i.e. the modal (PiP) should not be able
|
@@ -6156,10 +6195,20 @@ const VideoGallery = (props) => {
|
|
6156
6195
|
lastVisibleParticipants: visibleVideoParticipants.current,
|
6157
6196
|
maxDominantSpeakers: maxRemoteVideoStreams
|
6158
6197
|
}).slice(0, maxRemoteVideoStreams);
|
6198
|
+
/* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */
|
6199
|
+
visibleCallingParticipants.current = smartDominantSpeakerParticipants({
|
6200
|
+
participants: (_b = remoteParticipants === null || remoteParticipants === void 0 ? void 0 : remoteParticipants.filter((p) => p.state === ('Connecting' ))) !== null && _b !== void 0 ? _b : [],
|
6201
|
+
dominantSpeakers,
|
6202
|
+
lastVisibleParticipants: visibleCallingParticipants.current,
|
6203
|
+
maxDominantSpeakers: 0
|
6204
|
+
});
|
6159
6205
|
// This set will be used to filter out participants already in visibleVideoParticipants
|
6160
6206
|
const visibleVideoParticipantsSet = new Set(visibleVideoParticipants.current.map((p) => p.userId));
|
6207
|
+
/* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */
|
6208
|
+
const visibleCallingParticipantsSet = new Set(visibleCallingParticipants.current.map((p) => p.userId));
|
6161
6209
|
visibleAudioParticipants.current = smartDominantSpeakerParticipants({
|
6162
|
-
participants: (
|
6210
|
+
participants: (_c = remoteParticipants === null || remoteParticipants === void 0 ? void 0 : remoteParticipants.filter((p) => !visibleVideoParticipantsSet.has(p.userId) &&
|
6211
|
+
/* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */ !visibleCallingParticipantsSet.has(p.userId))) !== null && _c !== void 0 ? _c : [],
|
6163
6212
|
dominantSpeakers,
|
6164
6213
|
lastVisibleParticipants: visibleAudioParticipants.current,
|
6165
6214
|
maxDominantSpeakers: MAX_AUDIO_DOMINANT_SPEAKERS
|
@@ -6200,7 +6249,9 @@ const VideoGallery = (props) => {
|
|
6200
6249
|
]);
|
6201
6250
|
const defaultOnRenderVideoTile = React.useCallback((participant, isVideoParticipant) => {
|
6202
6251
|
const remoteVideoStream = participant.videoStream;
|
6203
|
-
return (React__default['default'].createElement(_RemoteVideoTile, Object.assign({ key: participant.userId }, participant, { onCreateRemoteStreamView: isVideoParticipant ? onCreateRemoteStreamView : undefined, onDisposeRemoteStreamView: isVideoParticipant ? onDisposeRemoteStreamView : undefined, isAvailable: isVideoParticipant ? remoteVideoStream === null || remoteVideoStream === void 0 ? void 0 : remoteVideoStream.isAvailable : false, isReceiving: isVideoParticipant ? remoteVideoStream === null || remoteVideoStream === void 0 ? void 0 : remoteVideoStream.isReceiving : false, renderElement: isVideoParticipant ? remoteVideoStream === null || remoteVideoStream === void 0 ? void 0 : remoteVideoStream.renderElement : undefined, remoteVideoViewOptions: isVideoParticipant ? remoteVideoViewOptions : undefined, onRenderAvatar: onRenderAvatar, showMuteIndicator: showMuteIndicator
|
6252
|
+
return (React__default['default'].createElement(_RemoteVideoTile, Object.assign({ key: participant.userId }, participant, { onCreateRemoteStreamView: isVideoParticipant ? onCreateRemoteStreamView : undefined, onDisposeRemoteStreamView: isVideoParticipant ? onDisposeRemoteStreamView : undefined, isAvailable: isVideoParticipant ? remoteVideoStream === null || remoteVideoStream === void 0 ? void 0 : remoteVideoStream.isAvailable : false, isReceiving: isVideoParticipant ? remoteVideoStream === null || remoteVideoStream === void 0 ? void 0 : remoteVideoStream.isReceiving : false, renderElement: isVideoParticipant ? remoteVideoStream === null || remoteVideoStream === void 0 ? void 0 : remoteVideoStream.renderElement : undefined, remoteVideoViewOptions: isVideoParticipant ? remoteVideoViewOptions : undefined, onRenderAvatar: onRenderAvatar, showMuteIndicator: showMuteIndicator,
|
6253
|
+
/* @conditional-compile-remove(PSTN-calls) */
|
6254
|
+
participantState: participant.state })));
|
6204
6255
|
}, [onCreateRemoteStreamView, onDisposeRemoteStreamView, remoteVideoViewOptions, onRenderAvatar, showMuteIndicator]);
|
6205
6256
|
const videoTiles = onRenderRemoteVideoTile
|
6206
6257
|
? visibleVideoParticipants.current.map((participant) => onRenderRemoteVideoTile(participant))
|
@@ -6212,25 +6263,38 @@ const VideoGallery = (props) => {
|
|
6212
6263
|
: visibleAudioParticipants.current.map((participant) => {
|
6213
6264
|
return defaultOnRenderVideoTile(participant, false);
|
6214
6265
|
});
|
6266
|
+
/* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */
|
6267
|
+
const callingTiles = onRenderRemoteVideoTile
|
6268
|
+
? visibleCallingParticipants.current.map((participant) => onRenderRemoteVideoTile(participant))
|
6269
|
+
: visibleCallingParticipants.current.map((participant) => {
|
6270
|
+
return defaultOnRenderVideoTile(participant, false);
|
6271
|
+
});
|
6215
6272
|
const screenShareParticipant = remoteParticipants.find((participant) => { var _a; return (_a = participant.screenShareStream) === null || _a === void 0 ? void 0 : _a.isAvailable; });
|
6216
6273
|
const screenShareActive = screenShareParticipant || (localParticipant === null || localParticipant === void 0 ? void 0 : localParticipant.isScreenSharingOn);
|
6217
|
-
|
6218
|
-
|
6219
|
-
|
6220
|
-
|
6221
|
-
|
6222
|
-
|
6223
|
-
|
6224
|
-
|
6225
|
-
|
6226
|
-
|
6227
|
-
|
6228
|
-
|
6274
|
+
const createGridTiles = () => {
|
6275
|
+
/* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */
|
6276
|
+
return videoTiles.length > 0 ? videoTiles : audioTiles.concat(callingTiles);
|
6277
|
+
};
|
6278
|
+
const gridTiles = createGridTiles();
|
6279
|
+
const createHorizontalGalleryTiles = () => {
|
6280
|
+
if (screenShareActive) {
|
6281
|
+
// If screen sharing is active, assign video and audio participants as horizontal gallery participants
|
6282
|
+
/* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */
|
6283
|
+
return videoTiles.concat(audioTiles.concat(callingTiles));
|
6284
|
+
}
|
6285
|
+
else {
|
6286
|
+
// If screen sharing is not active, then assign all video tiles as grid tiles.
|
6287
|
+
// If there are no video tiles, then assign audio tiles as grid tiles.
|
6288
|
+
/* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */
|
6289
|
+
return videoTiles.length > 0 ? audioTiles.concat(callingTiles) : [];
|
6290
|
+
}
|
6291
|
+
};
|
6292
|
+
const horizontalGalleryTiles = createHorizontalGalleryTiles();
|
6229
6293
|
if (!shouldFloatLocalVideo && localParticipant) {
|
6230
6294
|
gridTiles.push(localVideoTile);
|
6231
6295
|
}
|
6232
6296
|
const localScreenShareStreamComponent = React__default['default'].createElement(LocalScreenShare, { localParticipant: localParticipant });
|
6233
|
-
const remoteScreenShareComponent = screenShareParticipant && (React__default['default'].createElement(RemoteScreenShare, Object.assign({}, screenShareParticipant, { renderElement: (
|
6297
|
+
const remoteScreenShareComponent = screenShareParticipant && (React__default['default'].createElement(RemoteScreenShare, Object.assign({}, screenShareParticipant, { renderElement: (_d = screenShareParticipant.screenShareStream) === null || _d === void 0 ? void 0 : _d.renderElement, onCreateRemoteStreamView: onCreateRemoteStreamView, onDisposeRemoteStreamView: onDisposeRemoteStreamView, isReceiving: (_e = screenShareParticipant.screenShareStream) === null || _e === void 0 ? void 0 : _e.isReceiving })));
|
6234
6298
|
const horizontalGalleryPresent = horizontalGalleryTiles && horizontalGalleryTiles.length > 0;
|
6235
6299
|
const layerHostId = reactHooks.useId('layerhost');
|
6236
6300
|
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) },
|
@@ -6710,7 +6774,9 @@ const CameraButton = (props) => {
|
|
6710
6774
|
const [announcerString, setAnnouncerString] = React.useState(undefined);
|
6711
6775
|
let disabled = props.disabled || waitForCamera;
|
6712
6776
|
/* @conditional-compile-remove(rooms) */
|
6713
|
-
|
6777
|
+
const permissions = _usePermissions();
|
6778
|
+
/* @conditional-compile-remove(rooms) */
|
6779
|
+
disabled = disabled || !permissions.cameraButton;
|
6714
6780
|
const onRenderCameraOnIcon = () => (React__default['default'].createElement(HighContrastAwareIcon, { disabled: disabled, iconName: "ControlButtonCameraOn" }));
|
6715
6781
|
const onRenderCameraOffIcon = () => (React__default['default'].createElement(HighContrastAwareIcon, { disabled: disabled, iconName: "ControlButtonCameraOff" }));
|
6716
6782
|
if (waitForCamera && strings.tooltipVideoLoadingContent) {
|
@@ -7790,7 +7856,7 @@ const DialpadContainer = (props) => {
|
|
7790
7856
|
onChange(onDisplayDialpadInput ? onDisplayDialpadInput(modifiedInput) : formatPhoneNumber(modifiedInput));
|
7791
7857
|
}
|
7792
7858
|
};
|
7793
|
-
return (React__default['default'].createElement("div", { className: react.mergeStyles(containerStyles$1(theme), (_a = props.styles) === null || _a === void 0 ? void 0 : _a.root), "data-test-id": "dialpadContainer" },
|
7859
|
+
return (React__default['default'].createElement("div", { className: react.mergeStyles(containerStyles$1(theme), (_a = props.styles) === null || _a === void 0 ? void 0 : _a.root), "data-test-id": "dialpadContainer", "data-ui-id": "dialpadContainer" },
|
7794
7860
|
React__default['default'].createElement(react.TextField, { styles: react.concatStyleSets(textFieldStyles(theme), (_b = props.styles) === null || _b === void 0 ? void 0 : _b.textField), value: onDisplayDialpadInput ? onDisplayDialpadInput(textValue) : formatPhoneNumber(textValue),
|
7795
7861
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
7796
7862
|
onChange: (e) => {
|
@@ -7926,7 +7992,7 @@ const convertRemoteParticipantToVideoGalleryRemoteParticipant = (userId, isMuted
|
|
7926
7992
|
isScreenSharingOn: screenShareStream !== undefined && screenShareStream.isAvailable,
|
7927
7993
|
/* @conditional-compile-remove(one-to-n-calling) */
|
7928
7994
|
/* @conditional-compile-remove(PSTN-calls) */
|
7929
|
-
state
|
7995
|
+
state
|
7930
7996
|
};
|
7931
7997
|
};
|
7932
7998
|
const convertRemoteVideoStreamToVideoGalleryStream = (stream) => {
|
@@ -7940,29 +8006,6 @@ const convertRemoteVideoStreamToVideoGalleryStream = (stream) => {
|
|
7940
8006
|
renderElement: (_b = stream.view) === null || _b === void 0 ? void 0 : _b.target
|
7941
8007
|
};
|
7942
8008
|
};
|
7943
|
-
/* @conditional-compile-remove(one-to-n-calling) */
|
7944
|
-
/* @conditional-compile-remove(PSTN-calls) */
|
7945
|
-
/**
|
7946
|
-
* We convert the Communication Participant states to simpler states that can be used with VideoTiles/VideoGallery.
|
7947
|
-
*/
|
7948
|
-
const convertRemoteParticipantStateToVideoGalleryRemoteParticipantState = (state) => {
|
7949
|
-
// `Idle` is the first state of the participant.
|
7950
|
-
if (state === 'Idle' || state === 'Connecting') {
|
7951
|
-
return 'Connecting';
|
7952
|
-
}
|
7953
|
-
// `EarlyMedia` is a state when the media is played before a participant connects to the call.
|
7954
|
-
// It occurs immediately after the `Connecting` state.
|
7955
|
-
if (state === 'EarlyMedia' || state === 'Ringing') {
|
7956
|
-
return 'Ringing';
|
7957
|
-
}
|
7958
|
-
if (state === 'Hold') {
|
7959
|
-
return 'Hold';
|
7960
|
-
}
|
7961
|
-
if (state === 'Connected') {
|
7962
|
-
return 'Connected';
|
7963
|
-
}
|
7964
|
-
return;
|
7965
|
-
};
|
7966
8009
|
|
7967
8010
|
// Copyright (c) Microsoft Corporation.
|
7968
8011
|
/**
|
@@ -15387,7 +15430,7 @@ const drawerContainerStyles$1 = {
|
|
15387
15430
|
// Copyright (c) Microsoft Corporation.
|
15388
15431
|
/** @private */
|
15389
15432
|
const CallingDialpad = (props) => {
|
15390
|
-
const { strings, isMobile, showDialpad, onDismissDialpad } = props;
|
15433
|
+
const { strings, isMobile, showDialpad, onDismissDialpad, onAddParticipant, alternateCallerId } = props;
|
15391
15434
|
const [textFieldInput, setTextFieldInput] = React.useState('');
|
15392
15435
|
const theme = react.useTheme();
|
15393
15436
|
const onDismissTriggered = () => {
|
@@ -15395,15 +15438,22 @@ const CallingDialpad = (props) => {
|
|
15395
15438
|
onDismissDialpad();
|
15396
15439
|
};
|
15397
15440
|
const onClickCall = () => {
|
15398
|
-
|
15399
|
-
|
15441
|
+
if (onAddParticipant) {
|
15442
|
+
/**
|
15443
|
+
* Format the phone number in dialpad textfield to make sure the phone number is in E.164 format.
|
15444
|
+
* We assume the input number always include countrycode
|
15445
|
+
*/
|
15446
|
+
const phoneNumber = { phoneNumber: '+' + textFieldInput.replace(/\D/g, '').replaceAll(' ', '') };
|
15447
|
+
onAddParticipant(phoneNumber, { alternateCallerId: { phoneNumber: alternateCallerId } });
|
15448
|
+
onDismissTriggered();
|
15449
|
+
}
|
15400
15450
|
};
|
15401
15451
|
const dialpadModelStyle = React.useMemo(() => themedDialpadModelStyle(theme), [theme]);
|
15402
15452
|
const dialpadStyle = React.useMemo(() => themedDialpadStyle(isMobile, theme), [theme, isMobile]);
|
15403
15453
|
const callButtonStyle = React.useMemo(() => themedCallButtonStyle(theme), [theme]);
|
15404
15454
|
const dialpadComponent = () => {
|
15405
15455
|
return (React__default['default'].createElement(React__default['default'].Fragment, null,
|
15406
|
-
React__default['default'].createElement(Dialpad, {
|
15456
|
+
React__default['default'].createElement(Dialpad, { styles: dialpadStyle, onChange: setTextFieldInput }),
|
15407
15457
|
React__default['default'].createElement(react.PrimaryButton, { text: strings.dialpadStartCallButtonLabel, onRenderIcon: () => DialpadStartCallIconTrampoline(), onClick: onClickCall, styles: callButtonStyle, disabled: textFieldInput === '' })));
|
15408
15458
|
};
|
15409
15459
|
if (isMobile) {
|
@@ -15455,7 +15505,7 @@ const drawerContainerStyles = {
|
|
15455
15505
|
/** @private */
|
15456
15506
|
const AddPeopleDropdown = (props) => {
|
15457
15507
|
const theme = react.useTheme();
|
15458
|
-
const { inviteLink, strings, mobileView } = props;
|
15508
|
+
const { inviteLink, strings, mobileView, onAddParticipant, alternateCallerId } = props;
|
15459
15509
|
const [showDialpad, setShowDialpad] = React.useState(false);
|
15460
15510
|
const menuStyleThemed = React.useMemo(() => themedMenuStyle(theme), [theme]);
|
15461
15511
|
const copyLinkButtonStylesThemed = React.useMemo(() => themedCopyLinkButtonStyles(theme, mobileView), [mobileView, theme]);
|
@@ -15477,21 +15527,25 @@ const AddPeopleDropdown = (props) => {
|
|
15477
15527
|
onClick: () => copy__default['default'](inviteLink)
|
15478
15528
|
});
|
15479
15529
|
}
|
15480
|
-
|
15481
|
-
|
15482
|
-
|
15483
|
-
|
15484
|
-
|
15485
|
-
|
15486
|
-
|
15487
|
-
|
15530
|
+
// only show the dialpad option when alternateCallerId is set
|
15531
|
+
if (alternateCallerId) {
|
15532
|
+
menuProps.items.push({
|
15533
|
+
key: 'DialpadKey',
|
15534
|
+
text: strings.openDialpadButtonLabel,
|
15535
|
+
itemProps: { styles: copyLinkButtonStylesThemed },
|
15536
|
+
iconProps: { iconName: PeoplePaneOpenDialpadIconNameTrampoline(), style: iconStyles },
|
15537
|
+
onClick: () => setShowDialpad(true),
|
15538
|
+
'data-ui-id': 'call-dial-phone-number-button'
|
15539
|
+
});
|
15540
|
+
}
|
15488
15541
|
return menuProps;
|
15489
15542
|
}, [
|
15490
15543
|
strings.copyInviteLinkButtonLabel,
|
15491
15544
|
strings.openDialpadButtonLabel,
|
15492
15545
|
copyLinkButtonStylesThemed,
|
15493
15546
|
inviteLink,
|
15494
|
-
menuStyleThemed
|
15547
|
+
menuStyleThemed,
|
15548
|
+
alternateCallerId
|
15495
15549
|
]);
|
15496
15550
|
const onDismissDialpad = () => {
|
15497
15551
|
setShowDialpad(false);
|
@@ -15506,15 +15560,15 @@ const AddPeopleDropdown = (props) => {
|
|
15506
15560
|
if (mobileView) {
|
15507
15561
|
return (React__default['default'].createElement(react.Stack, null,
|
15508
15562
|
React__default['default'].createElement(react.Stack.Item, { styles: copyLinkButtonContainerStyles },
|
15509
|
-
React__default['default'].createElement(react.PrimaryButton, { onClick: setDrawerMenuItemsForAddPeople, styles: copyLinkButtonStylesThemed, onRenderIcon: () => PeoplePaneAddPersonIconTrampoline(), text: strings.peoplePaneAddPeopleButtonLabel, "data-ui-id": "call-
|
15510
|
-
addPeopleDrawerMenuItems.length > 0 && (React__default['default'].createElement(react.Stack, { styles: drawerContainerStyles, "data-ui-id": "call-
|
15563
|
+
React__default['default'].createElement(react.PrimaryButton, { onClick: setDrawerMenuItemsForAddPeople, styles: copyLinkButtonStylesThemed, onRenderIcon: () => PeoplePaneAddPersonIconTrampoline(), text: strings.peoplePaneAddPeopleButtonLabel, "data-ui-id": "call-add-people-button" })),
|
15564
|
+
addPeopleDrawerMenuItems.length > 0 && (React__default['default'].createElement(react.Stack, { styles: drawerContainerStyles, "data-ui-id": "call-add-people-dropdown" },
|
15511
15565
|
React__default['default'].createElement(_DrawerMenu, { onLightDismiss: () => setAddPeopleDrawerMenuItems([]), items: addPeopleDrawerMenuItems }))),
|
15512
|
-
React__default['default'].createElement(CallingDialpad, { isMobile: true, strings: strings, showDialpad: showDialpad, onDismissDialpad: onDismissDialpad })));
|
15566
|
+
alternateCallerId && (React__default['default'].createElement(CallingDialpad, { isMobile: true, strings: strings, showDialpad: showDialpad, onDismissDialpad: onDismissDialpad, onAddParticipant: onAddParticipant, alternateCallerId: alternateCallerId }))));
|
15513
15567
|
}
|
15514
15568
|
return (React__default['default'].createElement(React__default['default'].Fragment, null, React__default['default'].createElement(react.Stack, null,
|
15515
|
-
React__default['default'].createElement(CallingDialpad, { isMobile: false, strings: strings, showDialpad: showDialpad, onDismissDialpad: onDismissDialpad }),
|
15569
|
+
alternateCallerId && (React__default['default'].createElement(CallingDialpad, { isMobile: false, strings: strings, showDialpad: showDialpad, onDismissDialpad: onDismissDialpad, onAddParticipant: onAddParticipant, alternateCallerId: alternateCallerId })),
|
15516
15570
|
React__default['default'].createElement(react.Stack, { styles: copyLinkButtonStackStyles },
|
15517
|
-
React__default['default'].createElement(react.DefaultButton, { onRenderIcon: () => PeoplePaneAddPersonIconTrampoline(), text: strings.peoplePaneAddPeopleButtonLabel, menuProps: defaultMenuProps, styles: copyLinkButtonStylesThemed, "data-ui-id": "call-
|
15571
|
+
React__default['default'].createElement(react.DefaultButton, { onRenderIcon: () => PeoplePaneAddPersonIconTrampoline(), text: strings.peoplePaneAddPeopleButtonLabel, menuProps: defaultMenuProps, styles: copyLinkButtonStylesThemed, "data-ui-id": "call-add-people-button" })))));
|
15518
15572
|
};
|
15519
15573
|
function PeoplePaneOpenDialpadIconNameTrampoline() {
|
15520
15574
|
/* @conditional-compile-remove(PSTN-calls) */
|
@@ -15533,11 +15587,11 @@ const AddPeopleButton = (props) => {
|
|
15533
15587
|
React.useMemo(() => react.concatStyleSets(copyLinkButtonStyles, themedCopyLinkButtonStyles$1(mobileView, theme)), [mobileView, theme]);
|
15534
15588
|
/* @conditional-compile-remove(PSTN-calls) */
|
15535
15589
|
if (mobileView) {
|
15536
|
-
return React__default['default'].createElement(AddPeopleDropdown, { strings: strings, mobileView: mobileView, inviteLink: inviteLink });
|
15590
|
+
return (React__default['default'].createElement(AddPeopleDropdown, { strings: strings, mobileView: mobileView, inviteLink: inviteLink, onAddParticipant: props.onAddParticipant, alternateCallerId: props.alternateCallerId }));
|
15537
15591
|
}
|
15538
15592
|
else {
|
15539
15593
|
return (React__default['default'].createElement(react.Stack, { tokens: peoplePaneContainerTokens },
|
15540
|
-
React__default['default'].createElement(AddPeopleDropdown, { strings: strings, mobileView: mobileView, inviteLink: inviteLink }),
|
15594
|
+
React__default['default'].createElement(AddPeopleDropdown, { strings: strings, mobileView: mobileView, inviteLink: inviteLink, onAddParticipant: props.onAddParticipant, alternateCallerId: props.alternateCallerId }),
|
15541
15595
|
participantList));
|
15542
15596
|
}
|
15543
15597
|
};
|
@@ -15589,9 +15643,17 @@ const PeoplePaneContent = (props) => {
|
|
15589
15643
|
if (props.mobileView) {
|
15590
15644
|
return (React__default['default'].createElement(react.Stack, { verticalFill: true, styles: peoplePaneContainerStyle, tokens: peoplePaneContainerTokens },
|
15591
15645
|
React__default['default'].createElement(react.Stack.Item, { grow: true, styles: participantListContainerStyles }, participantList),
|
15592
|
-
React__default['default'].createElement(AddPeopleButton, { inviteLink: inviteLink, mobileView: props.mobileView, participantList: participantList, strings: strings
|
15646
|
+
React__default['default'].createElement(AddPeopleButton, { inviteLink: inviteLink, mobileView: props.mobileView, participantList: participantList, strings: strings,
|
15647
|
+
/* @conditional-compile-remove(PSTN-calls) */
|
15648
|
+
onAddParticipant: props.onAddParticipant,
|
15649
|
+
/* @conditional-compile-remove(PSTN-calls) */
|
15650
|
+
alternateCallerId: props.alternateCallerId })));
|
15593
15651
|
}
|
15594
|
-
return (React__default['default'].createElement(AddPeopleButton, { inviteLink: inviteLink, mobileView: props.mobileView, participantList: participantList, strings: strings
|
15652
|
+
return (React__default['default'].createElement(AddPeopleButton, { inviteLink: inviteLink, mobileView: props.mobileView, participantList: participantList, strings: strings,
|
15653
|
+
/* @conditional-compile-remove(PSTN-calls) */
|
15654
|
+
onAddParticipant: props.onAddParticipant,
|
15655
|
+
/* @conditional-compile-remove(PSTN-calls) */
|
15656
|
+
alternateCallerId: props.alternateCallerId }));
|
15595
15657
|
};
|
15596
15658
|
/**
|
15597
15659
|
* Create default contextual menu items for particant
|
@@ -15795,9 +15857,15 @@ const CallPane = (props) => {
|
|
15795
15857
|
const removeParticipantFromCall = (participantId) => __awaiter$7(void 0, void 0, void 0, function* () {
|
15796
15858
|
yield props.callAdapter.removeParticipant(participantId);
|
15797
15859
|
});
|
15860
|
+
/* @conditional-compile-remove(PSTN-calls) */
|
15861
|
+
const addParticipantToCall = (participant, options) => __awaiter$7(void 0, void 0, void 0, function* () {
|
15862
|
+
yield props.callAdapter.addParticipant(participant, options);
|
15863
|
+
});
|
15798
15864
|
const minMaxDragPosition = useMinMaxDragPosition(props.modalLayerHostId, props.rtl);
|
15799
15865
|
const pipStyles = React.useMemo(() => getPipStyles(theme), [theme]);
|
15800
15866
|
const dataUiId = props.activePane === 'people' ? 'call-composite-people-pane' : '';
|
15867
|
+
/* @conditional-compile-remove(PSTN-calls) */
|
15868
|
+
const alternateCallerId = useAdapter().getState().alternateCallerId;
|
15801
15869
|
return (React__default['default'].createElement(react.Stack, { verticalFill: true, grow: true, styles: paneStyles, "data-ui-id": dataUiId, tokens: props.mobileView ? {} : sidePaneTokens },
|
15802
15870
|
header,
|
15803
15871
|
React__default['default'].createElement(react.Stack.Item, { verticalFill: true, grow: true, styles: paneBodyContainer },
|
@@ -15805,7 +15873,11 @@ const CallPane = (props) => {
|
|
15805
15873
|
React__default['default'].createElement(react.Stack.Item, { verticalFill: true, styles: scrollableContainerContents },
|
15806
15874
|
React__default['default'].createElement(react.Stack, { styles: props.activePane === 'people' ? availableSpaceStyles : hiddenStyles },
|
15807
15875
|
React__default['default'].createElement(CallAdapterProvider, { adapter: props.callAdapter },
|
15808
|
-
React__default['default'].createElement(PeoplePaneContent, Object.assign({}, props, { onRemoveParticipant: removeParticipantFromCall,
|
15876
|
+
React__default['default'].createElement(PeoplePaneContent, Object.assign({}, props, { onRemoveParticipant: removeParticipantFromCall,
|
15877
|
+
/* @conditional-compile-remove(PSTN-calls) */
|
15878
|
+
onAddParticipant: addParticipantToCall, setDrawerMenuItems: setDrawerMenuItems, strings: strings,
|
15879
|
+
/* @conditional-compile-remove(PSTN-calls) */
|
15880
|
+
alternateCallerId: alternateCallerId }))))))),
|
15809
15881
|
props.mobileView && (React__default['default'].createElement(ModalLocalAndRemotePIP, { callAdapter: props.callAdapter, modalLayerHostId: props.modalLayerHostId, hidden: hidden, styles: pipStyles, minDragPosition: minMaxDragPosition.minDragPosition, maxDragPosition: minMaxDragPosition.maxDragPosition })),
|
15810
15882
|
drawerMenuItems.length > 0 && (React__default['default'].createElement(react.Stack, { styles: drawerContainerStyles },
|
15811
15883
|
React__default['default'].createElement(_DrawerMenu, { onLightDismiss: () => setDrawerMenuItems([]), items: drawerMenuItems })))));
|
@@ -15902,8 +15974,9 @@ const CallArrangement = (props) => {
|
|
15902
15974
|
};
|
15903
15975
|
/* @conditional-compile-remove(one-to-n-calling) */
|
15904
15976
|
const callPaneContent = () => {
|
15977
|
+
var _a;
|
15905
15978
|
if (adapter && callStatus === 'Connected') {
|
15906
|
-
return (React__default['default'].createElement(CallPane, { callAdapter: adapter, onClose: closePane, onFetchAvatarPersonaData: props.onFetchAvatarPersonaData, onPeopleButtonClicked: showShowPeopleTabHeaderButton$1(props.callControlProps.options) ? selectPeople : undefined, modalLayerHostId: props.modalLayerHostId, activePane: activePane, mobileView: props.mobileView, inviteLink: props.callControlProps.callInvitationURL }));
|
15979
|
+
return (React__default['default'].createElement(CallPane, { callAdapter: adapter, onClose: closePane, onFetchAvatarPersonaData: props.onFetchAvatarPersonaData, onFetchParticipantMenuItems: (_a = props.callControlProps) === null || _a === void 0 ? void 0 : _a.onFetchParticipantMenuItems, onPeopleButtonClicked: showShowPeopleTabHeaderButton$1(props.callControlProps.options) ? selectPeople : undefined, modalLayerHostId: props.modalLayerHostId, activePane: activePane, mobileView: props.mobileView, inviteLink: props.callControlProps.callInvitationURL }));
|
15907
15980
|
}
|
15908
15981
|
return React__default['default'].createElement(React__default['default'].Fragment, null);
|
15909
15982
|
};
|
@@ -15950,6 +16023,61 @@ const localVideoCameraCycleButtonSelector = reselect.createSelector([getDeviceMa
|
|
15950
16023
|
};
|
15951
16024
|
});
|
15952
16025
|
|
16026
|
+
// Copyright (c) Microsoft Corporation.
|
16027
|
+
const videoBaseStyle = react.mergeStyles({
|
16028
|
+
border: 0
|
16029
|
+
});
|
16030
|
+
/**
|
16031
|
+
* @private
|
16032
|
+
*/
|
16033
|
+
react.mergeStyles(videoBaseStyle, {
|
16034
|
+
width: '100%',
|
16035
|
+
height: '100%'
|
16036
|
+
});
|
16037
|
+
/**
|
16038
|
+
* @private
|
16039
|
+
*/
|
16040
|
+
react.mergeStyles(videoBaseStyle, {
|
16041
|
+
width: '100%',
|
16042
|
+
height: 0,
|
16043
|
+
position: 'relative',
|
16044
|
+
paddingTop: '56.25%' /* default to 16:9 Aspect Ratio for now*/
|
16045
|
+
});
|
16046
|
+
/**
|
16047
|
+
* @private
|
16048
|
+
*/
|
16049
|
+
react.mergeStyles({
|
16050
|
+
position: 'absolute',
|
16051
|
+
top: 0,
|
16052
|
+
left: 0,
|
16053
|
+
width: '100%',
|
16054
|
+
height: '100%'
|
16055
|
+
});
|
16056
|
+
/**
|
16057
|
+
* @private
|
16058
|
+
*/
|
16059
|
+
react.mergeStyles({
|
16060
|
+
height: '100%',
|
16061
|
+
width: '15%'
|
16062
|
+
});
|
16063
|
+
/**
|
16064
|
+
* @private
|
16065
|
+
*/
|
16066
|
+
react.mergeStyles({
|
16067
|
+
height: '100%',
|
16068
|
+
width: '85%',
|
16069
|
+
position: 'relative'
|
16070
|
+
});
|
16071
|
+
/**
|
16072
|
+
* @private
|
16073
|
+
*/
|
16074
|
+
const participantStateStyle = {
|
16075
|
+
textAlign: 'center',
|
16076
|
+
paddingTop: '0.5rem',
|
16077
|
+
fontWeight: 400,
|
16078
|
+
fontSize: '0.75rem'
|
16079
|
+
};
|
16080
|
+
|
15953
16081
|
// Copyright (c) Microsoft Corporation.
|
15954
16082
|
const VideoGalleryStyles = {
|
15955
16083
|
root: {
|
@@ -15975,8 +16103,26 @@ const MediaGallery = (props) => {
|
|
15975
16103
|
const cameraSwitcherProps = React.useMemo(() => {
|
15976
16104
|
return Object.assign(Object.assign({}, cameraSwitcherCallback), cameraSwitcherCameras);
|
15977
16105
|
}, [cameraSwitcherCallback, cameraSwitcherCameras]);
|
15978
|
-
|
15979
|
-
|
16106
|
+
/* @conditional-compile-remove(one-to-n-calling) */ /* @conditional-compile-remove(PSTN-calls) */
|
16107
|
+
const locale = useLocale().component;
|
16108
|
+
/* @conditional-compile-remove(one-to-n-calling) */ /* @conditional-compile-remove(PSTN-calls) */
|
16109
|
+
const videoTileStrings = locale.strings.videoTile;
|
16110
|
+
const onRenderAvatar = React.useCallback((userId, options) => {
|
16111
|
+
return (React__default['default'].createElement(react.Stack, { className: react.mergeStyles({ position: 'absolute', height: '100%', width: '100%' }) },
|
16112
|
+
React__default['default'].createElement(react.Stack, { styles: { root: { margin: 'auto', maxHeight: '100%' } } },
|
16113
|
+
React__default['default'].createElement(AvatarPersona, Object.assign({ userId: userId }, options, { dataProvider: props.onFetchAvatarPersonaData })),
|
16114
|
+
/* @conditional-compile-remove(one-to-n-calling) */ /* @conditional-compile-remove(PSTN-calls) */
|
16115
|
+
(options === null || options === void 0 ? void 0 : options.participantState) === 'Ringing' && (React__default['default'].createElement(react.Text, { className: react.mergeStyles(participantStateStyle) }, videoTileStrings.participantStateConnecting)),
|
16116
|
+
/* @conditional-compile-remove(one-to-n-calling) */ /* @conditional-compile-remove(PSTN-calls) */
|
16117
|
+
(options === null || options === void 0 ? void 0 : options.participantState) === 'Connecting' && (React__default['default'].createElement(react.Text, { className: react.mergeStyles(participantStateStyle) }, videoTileStrings.participantStateRinging)),
|
16118
|
+
/* @conditional-compile-remove(one-to-n-calling) */ /* @conditional-compile-remove(PSTN-calls) */
|
16119
|
+
(options === null || options === void 0 ? void 0 : options.participantState) === 'Hold' && (React__default['default'].createElement(react.Text, { className: react.mergeStyles(participantStateStyle) }, videoTileStrings.participantStateHold)))));
|
16120
|
+
}, [
|
16121
|
+
props.onFetchAvatarPersonaData,
|
16122
|
+
/* @conditional-compile-remove(one-to-n-calling) */ /* @conditional-compile-remove(PSTN-calls) */ videoTileStrings.participantStateConnecting,
|
16123
|
+
/* @conditional-compile-remove(one-to-n-calling) */ /* @conditional-compile-remove(PSTN-calls) */ videoTileStrings.participantStateRinging,
|
16124
|
+
/* @conditional-compile-remove(one-to-n-calling) */ /* @conditional-compile-remove(PSTN-calls) */ videoTileStrings.participantStateHold
|
16125
|
+
]);
|
15980
16126
|
useLocalVideoStartTrigger(!!props.isVideoStreamOn);
|
15981
16127
|
const VideoGalleryMemoized = React.useMemo(() => {
|
15982
16128
|
return (React__default['default'].createElement(VideoGallery, Object.assign({}, videoGalleryProps, { localVideoViewOptions: localVideoViewOptions$2, remoteVideoViewOptions: remoteVideoViewOptions, styles: VideoGalleryStyles, layout: "floatingLocalVideo", showCameraSwitcherInLocalPreview: props.isMobile, localVideoCameraCycleButtonProps: cameraSwitcherProps, onRenderAvatar: onRenderAvatar })));
|
@@ -16341,9 +16487,11 @@ const LocalDeviceSettings = (props) => {
|
|
16341
16487
|
let isSelectCamEnabled = props.cameraPermissionGranted;
|
16342
16488
|
let isSelectMicEnabled = props.microphonePermissionGranted;
|
16343
16489
|
/* @conditional-compile-remove(rooms) */
|
16344
|
-
|
16490
|
+
const permissions = _usePermissions();
|
16491
|
+
/* @conditional-compile-remove(rooms) */
|
16492
|
+
isSelectCamEnabled = isSelectCamEnabled && permissions.cameraButton;
|
16345
16493
|
/* @conditional-compile-remove(rooms) */
|
16346
|
-
isSelectMicEnabled = isSelectMicEnabled &&
|
16494
|
+
isSelectMicEnabled = isSelectMicEnabled && permissions.microphoneButton;
|
16347
16495
|
// TODO: speaker permission is tied to microphone permission (when you request 'audio' permission using the SDK) its
|
16348
16496
|
// actually granting access to query both microphone and speaker. However the browser popup asks you explicity for
|
16349
16497
|
// 'microphone'. This needs investigation on how we want to handle this and maybe needs follow up with SDK team.
|
@@ -16781,7 +16929,8 @@ const LobbyPage = (props) => {
|
|
16781
16929
|
modalLayerHostId: props.modalLayerHostId, onRenderGalleryContent: () => React__default['default'].createElement(LobbyTile, Object.assign({}, lobbyProps, { overlayProps: overlayProps(strings, inLobby) })), dataUiId: 'lobby-page' }));
|
16782
16930
|
};
|
16783
16931
|
const disableLobbyPageControls = (callControlOptions) => {
|
16784
|
-
|
16932
|
+
// Ensure we clone the prop if it is an object to ensure we do not mutate the original prop.
|
16933
|
+
let newOptions = callControlOptions instanceof Object ? Object.assign({}, callControlOptions) : callControlOptions;
|
16785
16934
|
if (newOptions !== false) {
|
16786
16935
|
if (newOptions === true || newOptions === undefined) {
|
16787
16936
|
newOptions = {
|
@@ -17203,9 +17352,9 @@ class AzureCommunicationCallAdapter {
|
|
17203
17352
|
});
|
17204
17353
|
}
|
17205
17354
|
_joinCall(audioOptions, videoOptions) {
|
17206
|
-
const isTeamsMeeting =
|
17355
|
+
const isTeamsMeeting = 'teamsLink' in this.locator;
|
17207
17356
|
/* @conditional-compile-remove(rooms) */
|
17208
|
-
const isRoomsCall =
|
17357
|
+
const isRoomsCall = 'roomId' in this.locator;
|
17209
17358
|
if (isTeamsMeeting) {
|
17210
17359
|
return this.callAgent.join(this.locator, {
|
17211
17360
|
audioOptions,
|
@@ -18133,7 +18282,9 @@ function callAdapterStateFromCallWithChatAdapterState(callWithChatAdapterState)
|
|
18133
18282
|
call: callWithChatAdapterState.call,
|
18134
18283
|
devices: callWithChatAdapterState.devices,
|
18135
18284
|
isTeamsCall: callWithChatAdapterState.isTeamsCall,
|
18136
|
-
latestErrors: callWithChatAdapterState.latestCallErrors
|
18285
|
+
latestErrors: callWithChatAdapterState.latestCallErrors,
|
18286
|
+
/* @conditional-compile-remove(PSTN-calls) */
|
18287
|
+
alternateCallerId: callWithChatAdapterState.alternateCallerId
|
18137
18288
|
};
|
18138
18289
|
}
|
18139
18290
|
|
@@ -18406,6 +18557,8 @@ const CallWithChatPane = (props) => {
|
|
18406
18557
|
const paneStyles = hidden ? hiddenStyles : props.mobileView ? availableSpaceStyles : sidePaneStyles;
|
18407
18558
|
const callWithChatStrings = useCallWithChatCompositeStrings();
|
18408
18559
|
const theme = useTheme();
|
18560
|
+
/* @conditional-compile-remove(PSTN-calls) */
|
18561
|
+
const alternateCallerId = props.callAdapter.getState().alternateCallerId;
|
18409
18562
|
const header = props.activePane === 'none' ? null : props.mobileView ? (React__default['default'].createElement(TabHeader, Object.assign({}, props, { strings: callWithChatStrings, activeTab: props.activePane }))) : (React__default['default'].createElement(SidePaneHeader, Object.assign({}, props, { strings: callWithChatStrings, headingText: props.activePane === 'chat'
|
18410
18563
|
? callWithChatStrings.chatPaneTitle
|
18411
18564
|
: props.activePane === 'people'
|
@@ -18426,8 +18579,16 @@ const CallWithChatPane = (props) => {
|
|
18426
18579
|
yield props.callAdapter.removeParticipant(participantId);
|
18427
18580
|
yield props.chatAdapter.removeParticipant(participantId);
|
18428
18581
|
});
|
18582
|
+
/* @conditional-compile-remove(PSTN-calls) */
|
18583
|
+
const addParticipantToCall = (participant, options) => __awaiter$1(void 0, void 0, void 0, function* () {
|
18584
|
+
yield props.callAdapter.addParticipant(participant, options);
|
18585
|
+
});
|
18429
18586
|
const peopleContent = (React__default['default'].createElement(CallAdapterProvider, { adapter: props.callAdapter },
|
18430
|
-
React__default['default'].createElement(PeoplePaneContent, Object.assign({}, props, { onRemoveParticipant: removeParticipantFromCallWithChat, setDrawerMenuItems: setDrawerMenuItems, strings: callWithChatStrings
|
18587
|
+
React__default['default'].createElement(PeoplePaneContent, Object.assign({}, props, { onRemoveParticipant: removeParticipantFromCallWithChat, setDrawerMenuItems: setDrawerMenuItems, strings: callWithChatStrings,
|
18588
|
+
/* @conditional-compile-remove(PSTN-calls) */
|
18589
|
+
onAddParticipant: addParticipantToCall,
|
18590
|
+
/* @conditional-compile-remove(PSTN-calls) */
|
18591
|
+
alternateCallerId: alternateCallerId }))));
|
18431
18592
|
const minMaxDragPosition = useMinMaxDragPosition(props.modalLayerHostId, props.rtl);
|
18432
18593
|
const pipStyles = React.useMemo(() => getPipStyles(theme), [theme]);
|
18433
18594
|
const dataUiId = props.activePane === 'chat'
|
@@ -18615,7 +18776,9 @@ function callWithChatAdapterStateFromBackingStates(callAdapter, chatAdapter) {
|
|
18615
18776
|
latestCallErrors: callAdapterState.latestErrors,
|
18616
18777
|
latestChatErrors: chatAdapterState.latestErrors,
|
18617
18778
|
/* @conditional-compile-remove(file-sharing) */
|
18618
|
-
fileUploads: chatAdapterState.fileUploads
|
18779
|
+
fileUploads: chatAdapterState.fileUploads,
|
18780
|
+
/* @conditional-compile-remove(PSTN-calls) */
|
18781
|
+
alternateCallerId: callAdapterState.alternateCallerId
|
18619
18782
|
};
|
18620
18783
|
}
|
18621
18784
|
/**
|