npm - @azure/communication-react - Versions diffs - 1.3.3-alpha-202210250024.0 → 1.3.3-alpha-202210260016.0 - Mend

@azure/communication-react 1.3.3-alpha-202210250024.0 → 1.3.3-alpha-202210260016.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.

Files changed (21) hide show

package/dist/dist-esm/acs-ui-common/src/telemetryVersion.js CHANGED Viewed

@@ -2,5 +2,5 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
 // GENERATED FILE. DO NOT EDIT MANUALLY.
-module.exports = '1.3.3-alpha-202210250024.0';
+module.exports = '1.3.3-alpha-202210260016.0';
 //# sourceMappingURL=telemetryVersion.js.map

package/dist/dist-esm/acs-ui-common/src/telemetryVersion.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"telemetryVersion.js","sourceRoot":"","sources":["../../../../../acs-ui-common/src/telemetryVersion.js"],"names":[],"mappings":";AAAA,uCAAuC;AACvC,kCAAkC;AAElC,wCAAwC;AAExC,MAAM,CAAC,OAAO,GAAG,4BAA4B,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\n// GENERATED FILE. DO NOT EDIT MANUALLY.\n\nmodule.exports = '1.3.3-alpha-~~202210250024~~.0';\n"]}
1	+ {"version":3,"file":"telemetryVersion.js","sourceRoot":"","sources":["../../../../../acs-ui-common/src/telemetryVersion.js"],"names":[],"mappings":";AAAA,uCAAuC;AACvC,kCAAkC;AAElC,wCAAwC;AAExC,MAAM,CAAC,OAAO,GAAG,4BAA4B,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\n// GENERATED FILE. DO NOT EDIT MANUALLY.\n\nmodule.exports = '1.3.3-alpha-202210260016.0';\n"]}

package/dist/dist-esm/calling-component-bindings/src/callControlSelectors.js CHANGED Viewed

@@ -57,14 +57,17 @@ export const screenShareButtonSelector = reselect.createSelector([getIsScreenSha
  */
 export const devicesButtonSelector = reselect.createSelector([getDeviceManager], (deviceManager) => {
     return {
-        microphones: deviceManager.microphones,
-        speakers: deviceManager.speakers,
-        cameras: deviceManager.cameras,
+        microphones: removeBlankNameDevices(deviceManager.microphones),
+        speakers: removeBlankNameDevices(deviceManager.speakers),
+        cameras: removeBlankNameDevices(deviceManager.cameras),
         selectedMicrophone: deviceManager.selectedMicrophone,
         selectedSpeaker: deviceManager.selectedSpeaker,
         selectedCamera: deviceManager.selectedCamera
     };
 });
+function removeBlankNameDevices(devices) {
+    return devices.filter((device) => device.name !== '');
+}
 /* @conditional-compile-remove(PSTN-calls) */
 /**
  * Selector for the {@link HoldButton} component.

package/dist/dist-esm/calling-component-bindings/src/callControlSelectors.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"callControlSelectors.js","sourceRoot":"","sources":["../../../../../calling-component-bindings/src/callControlSelectors.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAIlC,OAAO,KAAK,QAAQ,MAAM,UAAU,CAAC;AACrC,OAAO,EAEL,aAAa,EACb,gBAAgB,EAChB,UAAU,EACV,oBAAoB,EACpB,oBAAoB,EACrB,MAAM,iBAAiB,CAAC;AACzB,6CAA6C;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAmBjD;;;;GAIG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAA6B,QAAQ,CAAC,cAAc,CACvF,CAAC,aAAa,EAAE,UAAU,EAAE,gBAAgB,CAAC,EAC7C,CAAC,UAAU,EAAE,OAAO,EAAE,aAAa,EAAE,EAAE;IACrC,MAAM,UAAU,GAAG,aAAa,CAAC,YAAY,CAAC,CAAC,CAAC,aAAa,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC;IACxF,OAAO;QACL,QAAQ,EAAE,CAAC,UAAU,IAAI,CAAC,UAAU;QACpC,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK;QACtC,WAAW,EAAE,aAAa,CAAC,WAAW;QACtC,QAAQ,EAAE,aAAa,CAAC,QAAQ;QAChC,kBAAkB,EAAE,aAAa,CAAC,kBAAkB;QACpD,eAAe,EAAE,aAAa,CAAC,eAAe;KAC/C,CAAC;AACJ,CAAC,CACF,CAAC;AAiBF;;;;GAIG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAyB,QAAQ,CAAC,cAAc,CAC/E,CAAC,oBAAoB,EAAE,gBAAgB,CAAC,EACxC,CAAC,iBAAiB,EAAE,aAAa,EAAE,EAAE;IACnC,MAAM,SAAS,GAAG,YAAY,CAAC,aAAa,CAAC,CAAC;IAC9C,MAAM,kBAAkB,GAAG,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,eAAe,KAAK,OAAO,CAAC,CAAC;IACnG,MAAM,UAAU,GAAG,aAAa,CAAC,YAAY,CAAC,CAAC,CAAC,aAAa,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC;IAExF,OAAO;QACL,QAAQ,EAAE,CAAC,aAAa,CAAC,cAAc,IAAI,CAAC,UAAU,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC,MAAM;QACvF,OAAO,EAAE,iBAAiB,KAAK,SAAS,IAAI,iBAAiB,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,SAAS;QAC3G,OAAO,EAAE,aAAa,CAAC,OAAO;QAC9B,cAAc,EAAE,aAAa,CAAC,cAAc;KAC7C,CAAC;AACJ,CAAC,CACF,CAAC;AAgBF;;;;GAIG;AACH,MAAM,CAAC,MAAM,yBAAyB,GAA8B,QAAQ,CAAC,cAAc,CACzF,CAAC,oBAAoB,EAAE,6CAA6C,CAAC,YAAY,CAAC,EAClF,CAAC,iBAAiB,EAAE,6CAA6C,CAAC,SAAS,EAAE,EAAE;;IAC7E,OAAO;QACL,OAAO,EAAE,iBAAiB;QAC1B,6CAA6C;QAC7C,QAAQ,EAAE,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,MAAA,SAAS,KAAK,YAAY,mCAAI,KAAK;KAC/E,CAAC;AACJ,CAAC,CACF,CAAC;AAmBF;;;;GAIG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAA0B,QAAQ,CAAC,cAAc,CACjF,CAAC,gBAAgB,CAAC,EAClB,CAAC,aAAa,EAAE,EAAE;IAChB,OAAO;QACL,WAAW,EAAE,aAAa,CAAC,WAAW;~~QACtC~~,QAAQ,EAAE,aAAa,CAAC,QAAQ;~~QAChC~~,OAAO,EAAE,aAAa,CAAC,OAAO;~~QAC9B~~,kBAAkB,EAAE,aAAa,CAAC,kBAAkB;QACpD,eAAe,EAAE,aAAa,CAAC,eAAe;QAC9C,cAAc,EAAE,aAAa,CAAC,cAAc;KAC7C,CAAC;AACJ,CAAC,CACF,CAAC;~~AAcF~~,6CAA6C;AAC7C;;;GAGG;AACH,MAAM,CAAC,MAAM,kBAAkB,GAAuB,QAAQ,CAAC,cAAc,CAAC,CAAC,YAAY,CAAC,EAAE,CAAC,SAAS,EAAE,EAAE;IAC1G,OAAO;QACL,OAAO,EAAE,SAAS,KAAK,WAAW;KACnC,CAAC;AACJ,CAAC,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { AudioDeviceInfo, VideoDeviceInfo } from '@azure/communication-calling';\nimport { CallClientState } from '@internal/calling-stateful-client';\nimport * as reselect from 'reselect';\nimport {\n CallingBaseSelectorProps,\n getCallExists,\n getDeviceManager,\n getIsMuted,\n getIsScreenSharingOn,\n getLocalVideoStreams\n} from './baseSelectors';\n/* @conditional-compile-remove(PSTN-calls) /\nimport { getCallState } from './baseSelectors';\nimport { _isPreviewOn } from './utils/callUtils';\n\n/\n Selector type for {@link MicrophoneButton} component.\n \n @public\n /\nexport type MicrophoneButtonSelector = (\n state: CallClientState,\n props: CallingBaseSelectorProps\n) => {\n disabled: boolean;\n checked: boolean;\n microphones: AudioDeviceInfo[];\n speakers: AudioDeviceInfo[];\n selectedMicrophone?: AudioDeviceInfo;\n selectedSpeaker?: AudioDeviceInfo;\n};\n\n/\n Selector for {@link MicrophoneButton} component.\n \n @public\n /\nexport const microphoneButtonSelector: MicrophoneButtonSelector = reselect.createSelector(\n [getCallExists, getIsMuted, getDeviceManager],\n (callExists, isMuted, deviceManager) => {\n const permission = deviceManager.deviceAccess ? deviceManager.deviceAccess.audio : true;\n return {\n disabled: !callExists \|\| !permission,\n checked: callExists ? !isMuted : false,\n microphones: deviceManager.microphones,\n speakers: deviceManager.speakers,\n selectedMicrophone: deviceManager.selectedMicrophone,\n selectedSpeaker: deviceManager.selectedSpeaker\n };\n }\n);\n\n/\n Selector type for {@link CameraButton} component.\n \n @public\n /\nexport type CameraButtonSelector = (\n state: CallClientState,\n props: CallingBaseSelectorProps\n) => {\n disabled: boolean;\n checked: boolean;\n cameras: VideoDeviceInfo[];\n selectedCamera?: VideoDeviceInfo;\n};\n\n/\n Selector for {@link CameraButton} component.\n \n @public\n /\nexport const cameraButtonSelector: CameraButtonSelector = reselect.createSelector(\n [getLocalVideoStreams, getDeviceManager],\n (localVideoStreams, deviceManager) => {\n const previewOn = _isPreviewOn(deviceManager);\n const localVideoFromCall = localVideoStreams?.find((stream) => stream.mediaStreamType === 'Video');\n const permission = deviceManager.deviceAccess ? deviceManager.deviceAccess.video : true;\n\n return {\n disabled: !deviceManager.selectedCamera \|\| !permission \|\| !deviceManager.cameras.length,\n checked: localVideoStreams !== undefined && localVideoStreams.length > 0 ? !!localVideoFromCall : previewOn,\n cameras: deviceManager.cameras,\n selectedCamera: deviceManager.selectedCamera\n };\n }\n);\n\n/\n Selector type for {@link ScreenShareButton} component.\n \n @public\n /\nexport type ScreenShareButtonSelector = (\n state: CallClientState,\n props: CallingBaseSelectorProps\n) => {\n checked?: boolean;\n / @conditional-compile-remove(PSTN-calls) /\n disabled?: boolean;\n};\n\n/\n Selector for {@link ScreenShareButton} component.\n \n @public\n /\nexport const screenShareButtonSelector: ScreenShareButtonSelector = reselect.createSelector(\n [getIsScreenSharingOn, / @conditional-compile-remove(PSTN-calls) / getCallState],\n (isScreenSharingOn, / @conditional-compile-remove(PSTN-calls) / callState) => {\n return {\n checked: isScreenSharingOn,\n / @conditional-compile-remove(PSTN-calls) /\n disabled: callState === 'InLobby' ? true : callState === 'Connecting' ?? false\n };\n }\n);\n\n/\n Selector type for {@link DevicesButton} component.\n \n @public\n /\nexport type DevicesButtonSelector = (\n state: CallClientState,\n props: CallingBaseSelectorProps\n) => {\n microphones: AudioDeviceInfo[];\n speakers: AudioDeviceInfo[];\n cameras: VideoDeviceInfo[];\n selectedMicrophone?: AudioDeviceInfo;\n selectedSpeaker?: AudioDeviceInfo;\n selectedCamera?: VideoDeviceInfo;\n};\n\n/\n Selector for {@link DevicesButton} component.\n \n @public\n /\nexport const devicesButtonSelector: DevicesButtonSelector = reselect.createSelector(\n [getDeviceManager],\n (deviceManager) => {\n return {\n microphones: deviceManager.microphones,\n speakers: deviceManager.speakers,\n cameras: deviceManager.cameras,\n selectedMicrophone: deviceManager.selectedMicrophone,\n selectedSpeaker: deviceManager.selectedSpeaker,\n selectedCamera: deviceManager.selectedCamera\n };\n }\n);\n\n/ @conditional-compile-remove(PSTN-calls) /\n/\n Selector type for the {@link HoldButton} component.\n * @public\n /\nexport type HoldButtonSelector = (\n state: CallClientState,\n props: CallingBaseSelectorProps\n) => {\n checked: boolean;\n};\n\n/ @conditional-compile-remove(PSTN-calls) /\n/\n Selector for the {@link HoldButton} component.\n * @public\n */\nexport const holdButtonSelector: HoldButtonSelector = reselect.createSelector([getCallState], (callState) => {\n return {\n checked: callState === 'LocalHold'\n };\n});\n\"../../calling-stateful-client/src\""]}
1	+ {"version":3,"file":"callControlSelectors.js","sourceRoot":"","sources":["../../../../../calling-component-bindings/src/callControlSelectors.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { AudioDeviceInfo, VideoDeviceInfo } from '@azure/communication-calling';\nimport { CallClientState } from '@internal/calling-stateful-client';\nimport * as reselect from 'reselect';\nimport {\n CallingBaseSelectorProps,\n getCallExists,\n getDeviceManager,\n getIsMuted,\n getIsScreenSharingOn,\n getLocalVideoStreams\n} from './baseSelectors';\n/* @conditional-compile-remove(PSTN-calls) /\nimport { getCallState } from './baseSelectors';\nimport { _isPreviewOn } from './utils/callUtils';\n\n/\n Selector type for {@link MicrophoneButton} component.\n \n @public\n /\nexport type MicrophoneButtonSelector = (\n state: CallClientState,\n props: CallingBaseSelectorProps\n) => {\n disabled: boolean;\n checked: boolean;\n microphones: AudioDeviceInfo[];\n speakers: AudioDeviceInfo[];\n selectedMicrophone?: AudioDeviceInfo;\n selectedSpeaker?: AudioDeviceInfo;\n};\n\n/\n Selector for {@link MicrophoneButton} component.\n \n @public\n /\nexport const microphoneButtonSelector: MicrophoneButtonSelector = reselect.createSelector(\n [getCallExists, getIsMuted, getDeviceManager],\n (callExists, isMuted, deviceManager) => {\n const permission = deviceManager.deviceAccess ? deviceManager.deviceAccess.audio : true;\n return {\n disabled: !callExists \|\| !permission,\n checked: callExists ? !isMuted : false,\n microphones: deviceManager.microphones,\n speakers: deviceManager.speakers,\n selectedMicrophone: deviceManager.selectedMicrophone,\n selectedSpeaker: deviceManager.selectedSpeaker\n };\n }\n);\n\n/\n Selector type for {@link CameraButton} component.\n \n @public\n /\nexport type CameraButtonSelector = (\n state: CallClientState,\n props: CallingBaseSelectorProps\n) => {\n disabled: boolean;\n checked: boolean;\n cameras: VideoDeviceInfo[];\n selectedCamera?: VideoDeviceInfo;\n};\n\n/\n Selector for {@link CameraButton} component.\n \n @public\n /\nexport const cameraButtonSelector: CameraButtonSelector = reselect.createSelector(\n [getLocalVideoStreams, getDeviceManager],\n (localVideoStreams, deviceManager) => {\n const previewOn = _isPreviewOn(deviceManager);\n const localVideoFromCall = localVideoStreams?.find((stream) => stream.mediaStreamType === 'Video');\n const permission = deviceManager.deviceAccess ? deviceManager.deviceAccess.video : true;\n\n return {\n disabled: !deviceManager.selectedCamera \|\| !permission \|\| !deviceManager.cameras.length,\n checked: localVideoStreams !== undefined && localVideoStreams.length > 0 ? !!localVideoFromCall : previewOn,\n cameras: deviceManager.cameras,\n selectedCamera: deviceManager.selectedCamera\n };\n }\n);\n\n/\n Selector type for {@link ScreenShareButton} component.\n \n @public\n /\nexport type ScreenShareButtonSelector = (\n state: CallClientState,\n props: CallingBaseSelectorProps\n) => {\n checked?: boolean;\n / @conditional-compile-remove(PSTN-calls) /\n disabled?: boolean;\n};\n\n/\n Selector for {@link ScreenShareButton} component.\n \n @public\n /\nexport const screenShareButtonSelector: ScreenShareButtonSelector = reselect.createSelector(\n [getIsScreenSharingOn, / @conditional-compile-remove(PSTN-calls) / getCallState],\n (isScreenSharingOn, / @conditional-compile-remove(PSTN-calls) / callState) => {\n return {\n checked: isScreenSharingOn,\n / @conditional-compile-remove(PSTN-calls) /\n disabled: callState === 'InLobby' ? true : callState === 'Connecting' ?? false\n };\n }\n);\n\n/\n Selector type for {@link DevicesButton} component.\n \n @public\n /\nexport type DevicesButtonSelector = (\n state: CallClientState,\n props: CallingBaseSelectorProps\n) => {\n microphones: AudioDeviceInfo[];\n speakers: AudioDeviceInfo[];\n cameras: VideoDeviceInfo[];\n selectedMicrophone?: AudioDeviceInfo;\n selectedSpeaker?: AudioDeviceInfo;\n selectedCamera?: VideoDeviceInfo;\n};\n\n/\n Selector for {@link DevicesButton} component.\n \n @public\n /\nexport const devicesButtonSelector: DevicesButtonSelector = reselect.createSelector(\n [getDeviceManager],\n (deviceManager) => {\n return {\n microphones: removeBlankNameDevices(deviceManager.microphones),\n speakers: removeBlankNameDevices(deviceManager.speakers),\n cameras: removeBlankNameDevices(deviceManager.cameras),\n selectedMicrophone: deviceManager.selectedMicrophone,\n selectedSpeaker: deviceManager.selectedSpeaker,\n selectedCamera: deviceManager.selectedCamera\n };\n }\n);\n\nfunction removeBlankNameDevices<T extends { name: string }>(devices: T[]): T[] {\n return devices.filter((device) => device.name !== '');\n}\n\n/ @conditional-compile-remove(PSTN-calls) /\n/\n Selector type for the {@link HoldButton} component.\n * @public\n /\nexport type HoldButtonSelector = (\n state: CallClientState,\n props: CallingBaseSelectorProps\n) => {\n checked: boolean;\n};\n\n/ @conditional-compile-remove(PSTN-calls) /\n/\n Selector for the {@link HoldButton} component.\n * @public\n */\nexport const holdButtonSelector: HoldButtonSelector = reselect.createSelector([getCallState], (callState) => {\n return {\n checked: callState === 'LocalHold'\n };\n});\n\"../../calling-stateful-client/src\""]}

package/dist/dist-esm/calling-stateful-client/src/StatefulCallClient.d.ts CHANGED Viewed

@@ -111,6 +111,7 @@ export interface StatefulCallClient extends CallClient {
      * @param stream - The LocalVideoStreamState or RemoteVideoStreamState to dispose.
      */
     disposeView(callId: string | undefined, participantId: CommunicationIdentifier | undefined, stream: LocalVideoStreamState | RemoteVideoStreamState): void;
+    /** @conditional-compile-remove(one-to-n-calling) */
     /**
      * The CallAgent is used to handle calls.
      * To create the CallAgent, pass a CommunicationTokenCredential object provided from SDK.

package/dist/dist-esm/calling-stateful-client/src/StatefulCallClient.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StatefulCallClient.js","sourceRoot":"","sources":["../../../../../calling-stateful-client/src/StatefulCallClient.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { deviceManagerDeclaratify } from './DeviceManagerDeclarative';\nimport { CallClient, CallClientOptions, CreateViewOptions, DeviceManager } from '@azure/communication-calling';\nimport { CallClientState, LocalVideoStreamState, RemoteVideoStreamState } from './CallClientState';\nimport { CallContext } from './CallContext';\nimport { callAgentDeclaratify, DeclarativeCallAgent } from './CallAgentDeclarative';\nimport { InternalCallContext } from './InternalCallContext';\nimport { createView, disposeView, CreateViewResult } from './StreamUtils';\nimport { CommunicationIdentifier, CommunicationUserIdentifier, getIdentifierKind } from '@azure/communication-common';\nimport { _getApplicationId } from '@internal/acs-ui-common';\nimport { callingStatefulLogger } from './Logger';\n\n/*\n Defines the methods that allow CallClient {@link @azure/communication-calling#CallClient} to be used statefully.\n * The interface provides access to proxied state and also allows registering a handler for state change events. For\n * state definition see {@link CallClientState}.\n \n State change events are driven by:\n * - Returned data from {@link @azure/communication-calling#DeviceManager} APIs.\n * - Returned data from {@link @azure/communication-calling#CallAgent} APIs.\n * - Listeners automatically attached to various azure communication-calling objects:\n * - CallAgent 'incomingCall'\n * - CallAgent 'callsUpdated'\n * - DeviceManager 'videoDevicesUpdated'\n * - DeviceManager 'audioDevicesUpdated\n * - DeviceManager 'selectedMicrophoneChanged'\n * - DeviceManager 'selectedSpeakerChanged'\n * - Call 'stateChanged'\n * - Call 'idChanged'\n * - Call 'isMutedChanged'\n * - Call 'isScreenSharingOnChanged'\n * - Call 'remoteParticipantsUpdated'\n * - Call 'localVideoStreamsUpdated'\n * - IncomingCall 'callEnded'\n * - RemoteParticipant 'stateChanged'\n * - RemoteParticipant 'isMutedChanged'\n * - RemoteParticipant 'displayNameChanged'\n * - RemoteParticipant 'isSpeakingChanged'\n * - RemoteParticipant 'videoStreamsUpdated'\n * - RemoteVideoStream 'isAvailableChanged'\n * - TranscriptionCallFeature 'isTranscriptionActiveChanged'\n * - RecordingCallFeature 'isRecordingActiveChanged'\n \n @public\n /\nexport interface StatefulCallClient extends CallClient {\n /\n Holds all the state that we could proxy from CallClient {@link @azure/communication-calling#CallClient} as\n * CallClientState {@link CallClientState}.\n /\n getState(): CallClientState;\n /\n Allows a handler to be registered for 'stateChanged' events.\n \n @param handler - Callback to receive the state.\n /\n onStateChange(handler: (state: CallClientState) => void): void;\n /\n Allows unregistering for 'stateChanged' events.\n \n @param handler - Original callback to be unsubscribed.\n /\n offStateChange(handler: (state: CallClientState) => void): void;\n /\n Renders a {@link RemoteVideoStreamState} or {@link LocalVideoStreamState} and stores the resulting\n * {@link VideoStreamRendererViewState} under the relevant {@link RemoteVideoStreamState} or\n * {@link LocalVideoStreamState} or as unparented view in the state. Under the hood calls\n * {@link @azure/communication-calling#VideoStreamRenderer.createView}.\n \n Scenario 1: Render RemoteVideoStreamState\n * - CallId is required, participantId is required, and stream of type RemoteVideoStreamState is required\n * - Resulting {@link VideoStreamRendererViewState} is stored in the given callId and participantId in\n * {@link CallClientState}\n \n Scenario 2: Render LocalVideoStreamState for a call\n * - CallId is required, participantId must be undefined, and stream of type LocalVideoStreamState is required.\n * - The {@link @azure/communication-calling#Call.localVideoStreams} must already be started using\n * {@link @azure/communication-calling#Call.startVideo}.\n * - Resulting {@link VideoStreamRendererViewState} is stored in the given callId {@link CallState.localVideoStreams}\n * in {@link CallClientState}.\n \n - Scenario 2: Render LocalVideoStreamState not part of a call (example rendering camera for local preview)\n * - CallId must be undefined, participantId must be undefined, and stream of type LocalVideoStreamState is required.\n * - Resulting {@link VideoStreamRendererViewState} is stored in under the given LocalVideoStreamState in\n * {@link CallClientState.deviceManager.unparentedViews}\n \n @param callId - CallId for the given stream. Can be undefined if the stream is not part of any call.\n * @param participantId - {@link RemoteParticipant.identifier} associated with the given RemoteVideoStreamState. Could\n * be undefined if rendering LocalVideoStreamState.\n * @param stream - The LocalVideoStreamState or RemoteVideoStreamState to start rendering.\n * @param options - Options that are passed to the {@link @azure/communication-calling#VideoStreamRenderer}.\n /\n createView(\n callId: string \| undefined,\n participantId: CommunicationIdentifier \| undefined,\n stream: LocalVideoStreamState \| RemoteVideoStreamState,\n options?: CreateViewOptions\n ): Promise<CreateViewResult \| undefined>;\n /\n Stops rendering a {@link RemoteVideoStreamState} or {@link LocalVideoStreamState} and removes the\n * {@link VideoStreamRendererView} from the relevant {@link RemoteVideoStreamState} in {@link CallClientState} or\n * {@link LocalVideoStream} in {@link CallClientState} or appropriate\n * {@link CallClientState.deviceManager.unparentedViews} Under the hood calls\n * {@link @azure/communication-calling#VideoStreamRenderer.dispose}.\n \n Its important to disposeView to clean up resources properly.\n \n Scenario 1: Dispose RemoteVideoStreamState\n * - CallId is required, participantId is required, and stream of type RemoteVideoStreamState is required\n \n Scenario 2: Dispose LocalVideoStreamState for a call\n * - CallId is required, participantId must be undefined, and stream of type LocalVideoStreamState is required.\n \n - Scenario 2: Dispose LocalVideoStreamState not part of a call\n * - CallId must be undefined, participantId must be undefined, and stream of type LocalVideoStreamState is required.\n * - LocalVideoStreamState must be the original one passed to createView.\n \n @param callId - CallId for the given stream. Can be undefined if the stream is not part of any call.\n * @param participantId - {@link RemoteParticipant.identifier} associated with the given RemoteVideoStreamState. Could\n * be undefined if disposing LocalVideoStreamState.\n * @param stream - The LocalVideoStreamState or RemoteVideoStreamState to dispose.\n /\n disposeView(\n callId: string \| undefined,\n participantId: CommunicationIdentifier \| undefined,\n stream: LocalVideoStreamState \| RemoteVideoStreamState\n ): void;\n\n /\n The CallAgent is used to handle calls.\n * To create the CallAgent, pass a CommunicationTokenCredential object provided from SDK.\n * - The CallClient can only have one active CallAgent instance at a time.\n * - You can create a new CallClient instance to create a new CallAgent.\n * - You can dispose of a CallClient's current active CallAgent, and call the CallClient's\n * createCallAgent() method again to create a new CallAgent.\n * @param tokenCredential - The token credential. Use AzureCommunicationTokenCredential from `@azure/communication-common` to create a credential.\n * @param options - The CallAgentOptions for additional options like display name.\n * @public\n /\n createCallAgent(...args: Parameters<CallClient['createCallAgent']>): Promise<DeclarativeCallAgent>;\n}\n\n/\n A function to modify the state of the StatefulCallClient.\n \n Provided as a callback to the {@link StatefulCallClient.modifyState} method.\n \n The function must modify the provided state in place as much as possible.\n * Making large modifications can lead to bad performance by causing spurious rerendering of the UI.\n \n Consider using commonly used modifier functions exported from this package.\n /\nexport type CallStateModifier = (state: CallClientState) => void;\n\n/\n ProxyCallClient proxies CallClient {@link @azure/communication-calling#CallClient} and subscribes to all events that\n * affect state. ProxyCallClient keeps its own copy of the call state and when state is updated, ProxyCallClient emits\n * the event 'stateChanged'.\n /\nclass ProxyCallClient implements ProxyHandler<CallClient> {\n private _context: CallContext;\n private _internalContext: InternalCallContext;\n private _callAgent: DeclarativeCallAgent \| undefined;\n private _deviceManager: DeviceManager \| undefined;\n private _sdkDeviceManager: DeviceManager \| undefined;\n\n constructor(context: CallContext, internalContext: InternalCallContext) {\n this._context = context;\n this._internalContext = internalContext;\n }\n\n public get<P extends keyof CallClient>(target: CallClient, prop: P): any {\n switch (prop) {\n case 'createCallAgent': {\n return this._context.withAsyncErrorTeedToState(\n async (...args: Parameters<CallClient['createCallAgent']>): Promise<DeclarativeCallAgent> => {\n // createCallAgent will throw an exception if the previous callAgent was not disposed. If the previous\n // callAgent was disposed then it would have unsubscribed to events so we can just create a new declarative\n // callAgent if the createCallAgent succeeds.\n const callAgent = await target.createCallAgent(...args);\n this._callAgent = callAgentDeclaratify(callAgent, this._context, this._internalContext);\n this._context.setCallAgent({\n displayName: this._callAgent.displayName\n });\n return this._callAgent;\n },\n 'CallClient.createCallAgent'\n );\n }\n case 'getDeviceManager': {\n return this._context.withAsyncErrorTeedToState(async () => {\n // As of writing, the SDK always returns the same instance of DeviceManager so we keep a reference of\n // DeviceManager and if it does not change we return the cached DeclarativeDeviceManager. If it does not we'll\n // throw an error that indicate we need to fix this issue as our implementation has diverged from the SDK.\n const deviceManager = await target.getDeviceManager();\n if (this._sdkDeviceManager) {\n if (this._sdkDeviceManager === deviceManager) {\n return this._deviceManager;\n } else {\n throw new Error(\n 'Multiple DeviceManager not supported. This means a incompatible version of communication-calling is ' +\n 'used OR calling declarative was not properly updated to communication-calling version.'\n );\n }\n } else {\n this._sdkDeviceManager = deviceManager;\n }\n this._deviceManager = deviceManagerDeclaratify(deviceManager, this._context);\n return this._deviceManager;\n }, 'CallClient.getDeviceManager');\n }\n default:\n return Reflect.get(target, prop);\n }\n }\n}\n\n/\n Arguments to construct the StatefulCallClient.\n \n @public\n /\nexport type StatefulCallClientArgs = {\n /\n UserId from SDK. This is provided for developer convenience to easily access the userId from the\n * state. It is not used by StatefulCallClient.\n /\n userId: CommunicationUserIdentifier;\n / @conditional-compile-remove(PSTN-calls) /\n /\n A phone number in E.164 format that will be used to represent the callers identity. This number is required\n * to start a PSTN call.\n \n example: +11234567\n \n This is not a cached value from the headless calling client.\n /\n alternateCallerId?: string;\n};\n\n/\n Options to construct the StatefulCallClient with.\n \n @public\n /\nexport type StatefulCallClientOptions = {\n /\n Options to construct the {@link @axure/communication-calling#CallClient} with.\n /\n callClientOptions: CallClientOptions;\n /\n Sets the max listeners limit of the 'stateChange' event. Defaults to the node.js EventEmitter.defaultMaxListeners\n * if not specified.\n /\n maxStateChangeListeners?: number;\n};\n\n/\n Creates a StatefulCallClient {@link StatefulCallClient} by proxying CallClient\n * {@link @azure/communication-calling#CallClient} with ProxyCallClient {@link ProxyCallClient} which then allows access\n * to state in a declarative way.\n \n It is important to use the {@link @azure/communication-calling#DeviceManager} and\n * {@link @azure/communication-calling#CallAgent} and {@link @azure/communication-calling#Call} (and etc.) that are\n * obtained from the StatefulCallClient in order for their state changes to be proxied properly.\n \n @param args - {@link StatefulCallClientArgs}\n * @param options - {@link StatefulCallClientOptions}\n \n @public\n /\nexport const createStatefulCallClient = (\n args: StatefulCallClientArgs,\n options?: StatefulCallClientOptions\n): StatefulCallClient => {\n callingStatefulLogger.info(`Creating calling stateful client using library version: ${_getApplicationId()}`);\n return createStatefulCallClientWithDeps(\n new CallClient(withTelemetryTag(options?.callClientOptions)),\n new CallContext(\n getIdentifierKind(args.userId),\n options?.maxStateChangeListeners,\n / @conditional-compile-remove(PSTN-calls) / args.alternateCallerId\n ),\n new InternalCallContext()\n );\n};\n\n/\n Package-internal version of createStatefulCallClient that allows dependency injection.\n \n This function should not be exported from the package.\n */\nexport const createStatefulCallClientWithDeps = (\n callClient: CallClient,\n context: CallContext,\n internalContext: InternalCallContext\n): StatefulCallClient => {\n Object.defineProperty(callClient, 'getState', {\n configurable: false,\n value: () => context.getState()\n });\n Object.defineProperty(callClient, 'onStateChange', {\n configurable: false,\n value: (handler: (state: CallClientState) => void) => context.onStateChange(handler)\n });\n Object.defineProperty(callClient, 'offStateChange', {\n configurable: false,\n value: (handler: (state: CallClientState) => void) => context.offStateChange(handler)\n });\n Object.defineProperty(callClient, 'createView', {\n configurable: false,\n value: (\n callId: string \| undefined,\n participantId: CommunicationIdentifier \| undefined,\n stream: LocalVideoStreamState \| RemoteVideoStreamState,\n options?: CreateViewOptions\n ): Promise<CreateViewResult \| undefined> => {\n const participantIdKind = participantId ? getIdentifierKind(participantId) : undefined;\n return createView(context, internalContext, callId, participantIdKind, stream, options);\n }\n });\n Object.defineProperty(callClient, 'disposeView', {\n configurable: false,\n value: (\n callId: string \| undefined,\n participantId: CommunicationIdentifier \| undefined,\n stream: LocalVideoStreamState \| RemoteVideoStreamState\n ): void => {\n const participantIdKind = participantId ? getIdentifierKind(participantId) : undefined;\n disposeView(context, internalContext, callId, participantIdKind, stream);\n }\n });\n\n return new Proxy(callClient, new ProxyCallClient(context, internalContext)) as StatefulCallClient;\n};\n\nconst withTelemetryTag = (options?: CallClientOptions): CallClientOptions => {\n const tags = options?.diagnostics?.tags ?? [];\n tags.push(_getApplicationId());\n return {\n ...options,\n diagnostics: {\n ...options?.diagnostics,\n tags\n }\n };\n};\n\"../../acs-ui-common/src\""]}
1	+ {"version":3,"file":"StatefulCallClient.js","sourceRoot":"","sources":["../../../../../calling-stateful-client/src/StatefulCallClient.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { deviceManagerDeclaratify } from './DeviceManagerDeclarative';\nimport { CallClient, CallClientOptions, CreateViewOptions, DeviceManager } from '@azure/communication-calling';\nimport { CallClientState, LocalVideoStreamState, RemoteVideoStreamState } from './CallClientState';\nimport { CallContext } from './CallContext';\nimport { callAgentDeclaratify, DeclarativeCallAgent } from './CallAgentDeclarative';\nimport { InternalCallContext } from './InternalCallContext';\nimport { createView, disposeView, CreateViewResult } from './StreamUtils';\nimport { CommunicationIdentifier, CommunicationUserIdentifier, getIdentifierKind } from '@azure/communication-common';\nimport { _getApplicationId } from '@internal/acs-ui-common';\nimport { callingStatefulLogger } from './Logger';\n\n/*\n Defines the methods that allow CallClient {@link @azure/communication-calling#CallClient} to be used statefully.\n * The interface provides access to proxied state and also allows registering a handler for state change events. For\n * state definition see {@link CallClientState}.\n \n State change events are driven by:\n * - Returned data from {@link @azure/communication-calling#DeviceManager} APIs.\n * - Returned data from {@link @azure/communication-calling#CallAgent} APIs.\n * - Listeners automatically attached to various azure communication-calling objects:\n * - CallAgent 'incomingCall'\n * - CallAgent 'callsUpdated'\n * - DeviceManager 'videoDevicesUpdated'\n * - DeviceManager 'audioDevicesUpdated\n * - DeviceManager 'selectedMicrophoneChanged'\n * - DeviceManager 'selectedSpeakerChanged'\n * - Call 'stateChanged'\n * - Call 'idChanged'\n * - Call 'isMutedChanged'\n * - Call 'isScreenSharingOnChanged'\n * - Call 'remoteParticipantsUpdated'\n * - Call 'localVideoStreamsUpdated'\n * - IncomingCall 'callEnded'\n * - RemoteParticipant 'stateChanged'\n * - RemoteParticipant 'isMutedChanged'\n * - RemoteParticipant 'displayNameChanged'\n * - RemoteParticipant 'isSpeakingChanged'\n * - RemoteParticipant 'videoStreamsUpdated'\n * - RemoteVideoStream 'isAvailableChanged'\n * - TranscriptionCallFeature 'isTranscriptionActiveChanged'\n * - RecordingCallFeature 'isRecordingActiveChanged'\n \n @public\n /\nexport interface StatefulCallClient extends CallClient {\n /\n Holds all the state that we could proxy from CallClient {@link @azure/communication-calling#CallClient} as\n * CallClientState {@link CallClientState}.\n /\n getState(): CallClientState;\n /\n Allows a handler to be registered for 'stateChanged' events.\n \n @param handler - Callback to receive the state.\n /\n onStateChange(handler: (state: CallClientState) => void): void;\n /\n Allows unregistering for 'stateChanged' events.\n \n @param handler - Original callback to be unsubscribed.\n /\n offStateChange(handler: (state: CallClientState) => void): void;\n /\n Renders a {@link RemoteVideoStreamState} or {@link LocalVideoStreamState} and stores the resulting\n * {@link VideoStreamRendererViewState} under the relevant {@link RemoteVideoStreamState} or\n * {@link LocalVideoStreamState} or as unparented view in the state. Under the hood calls\n * {@link @azure/communication-calling#VideoStreamRenderer.createView}.\n \n Scenario 1: Render RemoteVideoStreamState\n * - CallId is required, participantId is required, and stream of type RemoteVideoStreamState is required\n * - Resulting {@link VideoStreamRendererViewState} is stored in the given callId and participantId in\n * {@link CallClientState}\n \n Scenario 2: Render LocalVideoStreamState for a call\n * - CallId is required, participantId must be undefined, and stream of type LocalVideoStreamState is required.\n * - The {@link @azure/communication-calling#Call.localVideoStreams} must already be started using\n * {@link @azure/communication-calling#Call.startVideo}.\n * - Resulting {@link VideoStreamRendererViewState} is stored in the given callId {@link CallState.localVideoStreams}\n * in {@link CallClientState}.\n \n - Scenario 2: Render LocalVideoStreamState not part of a call (example rendering camera for local preview)\n * - CallId must be undefined, participantId must be undefined, and stream of type LocalVideoStreamState is required.\n * - Resulting {@link VideoStreamRendererViewState} is stored in under the given LocalVideoStreamState in\n * {@link CallClientState.deviceManager.unparentedViews}\n \n @param callId - CallId for the given stream. Can be undefined if the stream is not part of any call.\n * @param participantId - {@link RemoteParticipant.identifier} associated with the given RemoteVideoStreamState. Could\n * be undefined if rendering LocalVideoStreamState.\n * @param stream - The LocalVideoStreamState or RemoteVideoStreamState to start rendering.\n * @param options - Options that are passed to the {@link @azure/communication-calling#VideoStreamRenderer}.\n /\n createView(\n callId: string \| undefined,\n participantId: CommunicationIdentifier \| undefined,\n stream: LocalVideoStreamState \| RemoteVideoStreamState,\n options?: CreateViewOptions\n ): Promise<CreateViewResult \| undefined>;\n /\n Stops rendering a {@link RemoteVideoStreamState} or {@link LocalVideoStreamState} and removes the\n * {@link VideoStreamRendererView} from the relevant {@link RemoteVideoStreamState} in {@link CallClientState} or\n * {@link LocalVideoStream} in {@link CallClientState} or appropriate\n * {@link CallClientState.deviceManager.unparentedViews} Under the hood calls\n * {@link @azure/communication-calling#VideoStreamRenderer.dispose}.\n \n Its important to disposeView to clean up resources properly.\n \n Scenario 1: Dispose RemoteVideoStreamState\n * - CallId is required, participantId is required, and stream of type RemoteVideoStreamState is required\n \n Scenario 2: Dispose LocalVideoStreamState for a call\n * - CallId is required, participantId must be undefined, and stream of type LocalVideoStreamState is required.\n \n - Scenario 2: Dispose LocalVideoStreamState not part of a call\n * - CallId must be undefined, participantId must be undefined, and stream of type LocalVideoStreamState is required.\n * - LocalVideoStreamState must be the original one passed to createView.\n \n @param callId - CallId for the given stream. Can be undefined if the stream is not part of any call.\n * @param participantId - {@link RemoteParticipant.identifier} associated with the given RemoteVideoStreamState. Could\n * be undefined if disposing LocalVideoStreamState.\n * @param stream - The LocalVideoStreamState or RemoteVideoStreamState to dispose.\n /\n disposeView(\n callId: string \| undefined,\n participantId: CommunicationIdentifier \| undefined,\n stream: LocalVideoStreamState \| RemoteVideoStreamState\n ): void;\n\n /* @conditional-compile-remove(one-to-n-calling) /\n /\n The CallAgent is used to handle calls.\n * To create the CallAgent, pass a CommunicationTokenCredential object provided from SDK.\n * - The CallClient can only have one active CallAgent instance at a time.\n * - You can create a new CallClient instance to create a new CallAgent.\n * - You can dispose of a CallClient's current active CallAgent, and call the CallClient's\n * createCallAgent() method again to create a new CallAgent.\n * @param tokenCredential - The token credential. Use AzureCommunicationTokenCredential from `@azure/communication-common` to create a credential.\n * @param options - The CallAgentOptions for additional options like display name.\n * @public\n /\n createCallAgent(...args: Parameters<CallClient['createCallAgent']>): Promise<DeclarativeCallAgent>;\n}\n\n/\n A function to modify the state of the StatefulCallClient.\n \n Provided as a callback to the {@link StatefulCallClient.modifyState} method.\n \n The function must modify the provided state in place as much as possible.\n * Making large modifications can lead to bad performance by causing spurious rerendering of the UI.\n \n Consider using commonly used modifier functions exported from this package.\n /\nexport type CallStateModifier = (state: CallClientState) => void;\n\n/\n ProxyCallClient proxies CallClient {@link @azure/communication-calling#CallClient} and subscribes to all events that\n * affect state. ProxyCallClient keeps its own copy of the call state and when state is updated, ProxyCallClient emits\n * the event 'stateChanged'.\n /\nclass ProxyCallClient implements ProxyHandler<CallClient> {\n private _context: CallContext;\n private _internalContext: InternalCallContext;\n private _callAgent: DeclarativeCallAgent \| undefined;\n private _deviceManager: DeviceManager \| undefined;\n private _sdkDeviceManager: DeviceManager \| undefined;\n\n constructor(context: CallContext, internalContext: InternalCallContext) {\n this._context = context;\n this._internalContext = internalContext;\n }\n\n public get<P extends keyof CallClient>(target: CallClient, prop: P): any {\n switch (prop) {\n case 'createCallAgent': {\n return this._context.withAsyncErrorTeedToState(\n async (...args: Parameters<CallClient['createCallAgent']>): Promise<DeclarativeCallAgent> => {\n // createCallAgent will throw an exception if the previous callAgent was not disposed. If the previous\n // callAgent was disposed then it would have unsubscribed to events so we can just create a new declarative\n // callAgent if the createCallAgent succeeds.\n const callAgent = await target.createCallAgent(...args);\n this._callAgent = callAgentDeclaratify(callAgent, this._context, this._internalContext);\n this._context.setCallAgent({\n displayName: this._callAgent.displayName\n });\n return this._callAgent;\n },\n 'CallClient.createCallAgent'\n );\n }\n case 'getDeviceManager': {\n return this._context.withAsyncErrorTeedToState(async () => {\n // As of writing, the SDK always returns the same instance of DeviceManager so we keep a reference of\n // DeviceManager and if it does not change we return the cached DeclarativeDeviceManager. If it does not we'll\n // throw an error that indicate we need to fix this issue as our implementation has diverged from the SDK.\n const deviceManager = await target.getDeviceManager();\n if (this._sdkDeviceManager) {\n if (this._sdkDeviceManager === deviceManager) {\n return this._deviceManager;\n } else {\n throw new Error(\n 'Multiple DeviceManager not supported. This means a incompatible version of communication-calling is ' +\n 'used OR calling declarative was not properly updated to communication-calling version.'\n );\n }\n } else {\n this._sdkDeviceManager = deviceManager;\n }\n this._deviceManager = deviceManagerDeclaratify(deviceManager, this._context);\n return this._deviceManager;\n }, 'CallClient.getDeviceManager');\n }\n default:\n return Reflect.get(target, prop);\n }\n }\n}\n\n/\n Arguments to construct the StatefulCallClient.\n \n @public\n /\nexport type StatefulCallClientArgs = {\n /\n UserId from SDK. This is provided for developer convenience to easily access the userId from the\n * state. It is not used by StatefulCallClient.\n /\n userId: CommunicationUserIdentifier;\n / @conditional-compile-remove(PSTN-calls) /\n /\n A phone number in E.164 format that will be used to represent the callers identity. This number is required\n * to start a PSTN call.\n \n example: +11234567\n \n This is not a cached value from the headless calling client.\n /\n alternateCallerId?: string;\n};\n\n/\n Options to construct the StatefulCallClient with.\n \n @public\n /\nexport type StatefulCallClientOptions = {\n /\n Options to construct the {@link @axure/communication-calling#CallClient} with.\n /\n callClientOptions: CallClientOptions;\n /\n Sets the max listeners limit of the 'stateChange' event. Defaults to the node.js EventEmitter.defaultMaxListeners\n * if not specified.\n /\n maxStateChangeListeners?: number;\n};\n\n/\n Creates a StatefulCallClient {@link StatefulCallClient} by proxying CallClient\n * {@link @azure/communication-calling#CallClient} with ProxyCallClient {@link ProxyCallClient} which then allows access\n * to state in a declarative way.\n \n It is important to use the {@link @azure/communication-calling#DeviceManager} and\n * {@link @azure/communication-calling#CallAgent} and {@link @azure/communication-calling#Call} (and etc.) that are\n * obtained from the StatefulCallClient in order for their state changes to be proxied properly.\n \n @param args - {@link StatefulCallClientArgs}\n * @param options - {@link StatefulCallClientOptions}\n \n @public\n /\nexport const createStatefulCallClient = (\n args: StatefulCallClientArgs,\n options?: StatefulCallClientOptions\n): StatefulCallClient => {\n callingStatefulLogger.info(`Creating calling stateful client using library version: ${_getApplicationId()}`);\n return createStatefulCallClientWithDeps(\n new CallClient(withTelemetryTag(options?.callClientOptions)),\n new CallContext(\n getIdentifierKind(args.userId),\n options?.maxStateChangeListeners,\n / @conditional-compile-remove(PSTN-calls) / args.alternateCallerId\n ),\n new InternalCallContext()\n );\n};\n\n/\n Package-internal version of createStatefulCallClient that allows dependency injection.\n \n This function should not be exported from the package.\n */\nexport const createStatefulCallClientWithDeps = (\n callClient: CallClient,\n context: CallContext,\n internalContext: InternalCallContext\n): StatefulCallClient => {\n Object.defineProperty(callClient, 'getState', {\n configurable: false,\n value: () => context.getState()\n });\n Object.defineProperty(callClient, 'onStateChange', {\n configurable: false,\n value: (handler: (state: CallClientState) => void) => context.onStateChange(handler)\n });\n Object.defineProperty(callClient, 'offStateChange', {\n configurable: false,\n value: (handler: (state: CallClientState) => void) => context.offStateChange(handler)\n });\n Object.defineProperty(callClient, 'createView', {\n configurable: false,\n value: (\n callId: string \| undefined,\n participantId: CommunicationIdentifier \| undefined,\n stream: LocalVideoStreamState \| RemoteVideoStreamState,\n options?: CreateViewOptions\n ): Promise<CreateViewResult \| undefined> => {\n const participantIdKind = participantId ? getIdentifierKind(participantId) : undefined;\n return createView(context, internalContext, callId, participantIdKind, stream, options);\n }\n });\n Object.defineProperty(callClient, 'disposeView', {\n configurable: false,\n value: (\n callId: string \| undefined,\n participantId: CommunicationIdentifier \| undefined,\n stream: LocalVideoStreamState \| RemoteVideoStreamState\n ): void => {\n const participantIdKind = participantId ? getIdentifierKind(participantId) : undefined;\n disposeView(context, internalContext, callId, participantIdKind, stream);\n }\n });\n\n return new Proxy(callClient, new ProxyCallClient(context, internalContext)) as StatefulCallClient;\n};\n\nconst withTelemetryTag = (options?: CallClientOptions): CallClientOptions => {\n const tags = options?.diagnostics?.tags ?? [];\n tags.push(_getApplicationId());\n return {\n ...options,\n diagnostics: {\n ...options?.diagnostics,\n tags\n }\n };\n};\n\"../../acs-ui-common/src\""]}

package/dist/dist-esm/react-components/src/components/TroubleshootingGuideErrorBar.d.ts CHANGED Viewed

@@ -6,7 +6,8 @@ import { ErrorBarProps } from './ErrorBar';
  * @internal
  */
 export interface _TroubleshootingGuideErrorBarStrings {
-    linkText?: string;
+    devicePermissionLinkText?: string;
+    networkTroubleshootingLinkText?: string;
     dismissButtonText?: string;
 }
 /**

package/dist/dist-esm/react-components/src/components/TroubleshootingGuideErrorBar.js CHANGED Viewed

@@ -24,20 +24,30 @@ export const _TroubleshootingGuideErrorBar = (props) => {
     // Without this behaviour, this `useEffect` block would cause a render loop.
     useEffect(() => setDismissedErrors(dropDismissalsForInactiveErrors(props.activeErrorMessages, dismissedErrors)), [props.activeErrorMessages, dismissedErrors]);
     const toShow = errorsToShow(props.activeErrorMessages, dismissedErrors);
-    return (React.createElement(Stack, { "data-ui-id": "error-bar-stack" }, toShow.map((error) => (React.createElement(MessageBar, Object.assign({}, props, { styles: messageBarStyle(theme, messageBarType(error.type)), key: error.type, messageBarType: messageBarType(error.type), messageBarIconProps: messageBarIconProps(error.type), actions: React.createElement(MessageBarButton, { text: troubleshootingGuideStrings.dismissButtonText, styles: dismissButtonStyle(theme), onClick: () => {
-                setDismissedErrors(dismissError(dismissedErrors, error));
-            }, ariaLabel: strings.dismissButtonAriaLabel }), isMultiline: false }), onPermissionsTroubleshootingClick || onNetworkingTroubleshootingClick ? (React.createElement("div", null,
-        strings[error.type],
-        React.createElement(Link, { styles: linkStyle(theme), onClick: () => {
-                if (onPermissionsTroubleshootingClick) {
+    return (React.createElement(Stack, { "data-ui-id": "error-bar-stack" }, toShow.map((error) => {
+        const devicePermissionErrorBar = (React.createElement("div", null,
+            strings[error.type],
+            ' ',
+            onPermissionsTroubleshootingClick && (React.createElement(Link, { styles: linkStyle(theme), onClick: () => {
                     onPermissionsTroubleshootingClick(permissionsState);
-                }
-                else if (onNetworkingTroubleshootingClick) {
-                    onNetworkingTroubleshootingClick();
-                }
-            }, underline: true },
-            React.createElement("span", null, troubleshootingGuideStrings.linkText)))) : (React.createElement("div", null,
-        strings[error.type],
-        " ")))))));
+                }, underline: true },
+                React.createElement("span", null, troubleshootingGuideStrings.devicePermissionLinkText)))));
+        const networkErrorBar = (React.createElement("div", null,
+            strings[error.type],
+            ' ',
+            onNetworkingTroubleshootingClick && (React.createElement(Link, { styles: linkStyle(theme), onClick: onNetworkingTroubleshootingClick, underline: true },
+                React.createElement("span", null, troubleshootingGuideStrings.networkTroubleshootingLinkText)))));
+        return (React.createElement(MessageBar, Object.assign({}, props, { styles: messageBarStyle(theme, messageBarType(error.type)), key: error.type, messageBarType: messageBarType(error.type), messageBarIconProps: messageBarIconProps(error.type), actions: React.createElement(MessageBarButton, { text: troubleshootingGuideStrings.dismissButtonText, styles: dismissButtonStyle(theme), onClick: () => {
+                    setDismissedErrors(dismissError(dismissedErrors, error));
+                }, ariaLabel: strings.dismissButtonAriaLabel }), isMultiline: false }), showErrorBar(error.type, devicePermissionErrorBar, networkErrorBar)));
+    })));
+};
+const showErrorBar = (errorType, devicePermissionErrorBar, networkErrorBar) => {
+    if (errorType === 'callNetworkQualityLow') {
+        return networkErrorBar;
+    }
+    else {
+        return devicePermissionErrorBar;
+    }
 };
 //# sourceMappingURL=TroubleshootingGuideErrorBar.js.map

package/dist/dist-esm/react-components/src/components/TroubleshootingGuideErrorBar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TroubleshootingGuideErrorBar.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/TroubleshootingGuideErrorBar.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,gBAAgB,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AACtF,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAE5C,OAAO,EAAE,kBAAkB,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,8CAA8C,CAAC;AAC9G,OAAO,EAEL,YAAY,EACZ,+BAA+B,EAC/B,YAAY,EACZ,mBAAmB,EACnB,cAAc,EACf,MAAM,SAAS,CAAC;~~AA8DjB~~;;;GAGG;AACH,MAAM,CAAC,MAAM,6BAA6B,GAAG,CAAC,KAAyC,EAAe,EAAE;;IACtG,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,oBAAoB;IACpB,MAAM,aAAa,GAAG,SAAS,EAAE,CAAC,OAAO,CAAC,QAAQ,CAAC;IACnD,MAAM,OAAO,GAAG,MAAA,KAAK,CAAC,OAAO,mCAAI,aAAa,CAAC;IAE/C,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAmB,EAAE,CAAC,CAAC;IAE7E,MAAM,EACJ,iCAAiC,EACjC,gCAAgC,EAChC,gBAAgB,GAAG;QACjB,MAAM,EAAE,QAAQ;QAChB,UAAU,EAAE,QAAQ;KACrB,EACD,2BAA2B,EAC5B,GAAG,KAAK,CAAC;IAEV,mGAAmG;IACnG,4EAA4E;IAC5E,SAAS,CACP,GAAG,EAAE,CAAC,kBAAkB,CAAC,+BAA+B,CAAC,KAAK,CAAC,mBAAmB,EAAE,eAAe,CAAC,CAAC,EACrG,CAAC,KAAK,CAAC,mBAAmB,EAAE,eAAe,CAAC,CAC7C,CAAC;IAEF,MAAM,MAAM,GAAG,YAAY,CAAC,KAAK,CAAC,mBAAmB,EAAE,eAAe,CAAC,CAAC;IAExE,OAAO,CACL,oBAAC,KAAK,kBAAY,iBAAiB,IAChC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,~~CACrB~~,oBAAC,UAAU,oBACL,KAAK,IACT,MAAM,EAAE,eAAe,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,EAC1D,GAAG,EAAE,KAAK,CAAC,IAAI,EACf,cAAc,EAAE,cAAc,CAAC,KAAK,CAAC,IAAI,CAAC,EAC1C,mBAAmB,EAAE,mBAAmB,CAAC,KAAK,CAAC,IAAI,CAAC,EACpD,OAAO,EACL,oBAAC,gBAAgB,IACf,IAAI,EAAE,2BAA2B,CAAC,iBAAiB,EACnD,MAAM,EAAE,kBAAkB,CAAC,KAAK,CAAC,EACjC,OAAO,EAAE,GAAG,EAAE;~~gBACZ~~,kBAAkB,CAAC,YAAY,CAAC,eAAe,EAAE,KAAK,CAAC,CAAC,CAAC;~~YAC3D~~,CAAC,EACD,SAAS,EAAE,OAAO,CAAC,sBAAsB,GACzC,EAEJ,WAAW,EAAE,KAAK,KAEjB,~~iCAAiC~~,~~IAAI,gCAAgC,~~CAAC,~~CAAC,CAAC,CACvE;QACG,OAAO,CAAC,~~KAAK,CAAC,IAAI,~~CAAC;QACpB~~,~~oBAAC~~,~~IAAI,IACH,MAAM,~~EAAE,~~SAAS~~,CAAC,~~KAAK~~,CAAC~~,EACxB,OAAO,EAAE,GAAG,EAAE~~;~~gBACZ~~,~~IAAI~~,~~iCAAiC,EAAE;oBACrC,iCAAiC,~~CAAC,~~gBAAgB~~,~~CAAC~~,CAAC;~~iBACrD;qBAAM~~,~~IAAI,gCAAgC,EAAE;oBAC3C,gCAAgC,EAAE,~~CAAC~~;iBACpC;YACH~~,CAAC~~,EACD,SAAS~~;~~YAET~~,~~kCAAO~~,~~2BAA2B~~,~~CAAC~~,~~QAAQ~~,~~CAAQ~~,~~CAC9C~~,~~CACH~~,~~CACP~~,~~CAAC~~,~~CAAC~~,~~CAAC,CACF~~;~~QAAM~~,~~OAAO~~,~~CAAC~~,KAAK,~~CAAC~~,~~IAAI,CAAC~~;~~YAAQ~~,~~CAClC~~,~~CACU~~,~~CACd,~~CAAC,~~CACI~~,~~CACT~~,CAAC;~~AACJ~~,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport React, { useEffect, useState } from 'react';\nimport { Link, MessageBar, MessageBarButton, Stack, useTheme } from '@fluentui/react';\nimport { useLocale } from '../localization';\nimport { ErrorBarProps } from './ErrorBar';\nimport { dismissButtonStyle, linkStyle, messageBarStyle } from './styles/TroubleshootingGuideErrorBar.styles';\nimport {\n DismissedError,\n dismissError,\n dropDismissalsForInactiveErrors,\n errorsToShow,\n messageBarIconProps,\n messageBarType\n} from './utils';\n\n/*\n Strings for {@link _TroubleshootingGuideErrorBar}.\n \n @internal\n /\nexport interface _TroubleshootingGuideErrorBarStrings {\n ~~linkText~~?: string;\n dismissButtonText?: string;\n}\n\n/\n Props for {@link _TroubleshootingGuideErrorBar}.\n \n @internal\n /\nexport interface _TroubleshootingGuideErrorBarProps extends ErrorBarProps {\n /\n permissions state for camera/microphone\n /\n permissionsState?: {\n camera: PermissionState;\n microphone: PermissionState;\n };\n /\n Callback you may provide to supply users with further steps to troubleshoot why they have been\n * unable to grant your site the required permissions for the call.\n \n @example\n * ```ts\n * onPermissionsTroubleshootingClick: () =>\n * window.open('https://contoso.com/permissions-troubleshooting', '_blank');\n * ```\n \n @remarks\n * if this is not supplied, the composite will not show a 'further troubleshooting' link.\n /\n onPermissionsTroubleshootingClick?: (permissionsState: {\n camera: PermissionState;\n microphone: PermissionState;\n }) => void;\n /\n Optional callback to supply users with further troubleshooting steps for network issues\n * experienced when connecting to a call.\n \n @example\n * ```ts\n * onNetworkingTroubleshootingClick?: () =>\n * window.open('https://contoso.com/network-troubleshooting', '_blank');\n * ```\n \n @remarks\n * if this is not supplied, the composite will not show a 'network troubleshooting' link.\n /\n onNetworkingTroubleshootingClick?: () => void;\n /\n strings related to trouble shooting guidance link and dismiss button\n /\n troubleshootingGuideStrings: _TroubleshootingGuideErrorBarStrings;\n}\n\n/\n @internal\n * A component to show device Permission/network connection related errors, contains link that leads to further trouble shooting guide\n */\nexport const _TroubleshootingGuideErrorBar = (props: _TroubleshootingGuideErrorBarProps): JSX.Element => {\n const theme = useTheme();\n // error bar strings\n const localeStrings = useLocale().strings.errorBar;\n const strings = props.strings ?? localeStrings;\n\n const [dismissedErrors, setDismissedErrors] = useState<DismissedError[]>([]);\n\n const {\n onPermissionsTroubleshootingClick,\n onNetworkingTroubleshootingClick,\n permissionsState = {\n camera: 'denied',\n microphone: 'denied'\n },\n troubleshootingGuideStrings\n } = props;\n\n // dropDismissalsForInactiveErrors only returns a new object if `dismissedErrors` actually changes.\n // Without this behaviour, this `useEffect` block would cause a render loop.\n useEffect(\n () => setDismissedErrors(dropDismissalsForInactiveErrors(props.activeErrorMessages, dismissedErrors)),\n [props.activeErrorMessages, dismissedErrors]\n );\n\n const toShow = errorsToShow(props.activeErrorMessages, dismissedErrors);\n\n return (\n <Stack data-ui-id=\"error-bar-stack\">\n {toShow.map((error) => (\n <MessageBar\n {...props}\n styles={messageBarStyle(theme, messageBarType(error.type))}\n key={error.type}\n messageBarType={messageBarType(error.type)}\n messageBarIconProps={messageBarIconProps(error.type)}\n actions={\n <MessageBarButton\n text={troubleshootingGuideStrings.dismissButtonText}\n styles={dismissButtonStyle(theme)}\n onClick={() => {\n setDismissedErrors(dismissError(dismissedErrors, error));\n }}\n ariaLabel={strings.dismissButtonAriaLabel}\n />\n }\n isMultiline={false}\n >\n {~~onPermissionsTroubleshootingClick \|\| onNetworkingTroubleshootingClick ?~~ (~~\n <div>\n {strings[~~error.type]}\n ~~<Link\~~n ~~styles={linkStyle(theme~~)}~~\n onClick={(~~) ~~=> {~~\n ~~if (onPermissionsTroubleshootingClick) {\~~n ~~onPermissionsTroubleshootingClick(permissionsState~~);\n } ~~else~~ if (~~onNetworkingTroubleshootingClick) {~~\n ~~onNetworkingTroubleshootingClick();\~~n }\n }}\n ~~underline\n >\n <span>{troubleshootingGuideStrings.linkText}</span>\n </Link>\n </div>\n~~ ) : (\n ~~<div>{strings[error.type]}~~ ~~</div>\n~~ )}\n ~~</MessageBar>\~~n ))}\n ~~</Stack>\~~n ~~);\~~n};\n"]}
1	+ {"version":3,"file":"TroubleshootingGuideErrorBar.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/TroubleshootingGuideErrorBar.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport React, { useEffect, useState } from 'react';\nimport { Link, MessageBar, MessageBarButton, Stack, useTheme } from '@fluentui/react';\nimport { useLocale } from '../localization';\nimport { ErrorBarProps } from './ErrorBar';\nimport { dismissButtonStyle, linkStyle, messageBarStyle } from './styles/TroubleshootingGuideErrorBar.styles';\nimport {\n DismissedError,\n dismissError,\n dropDismissalsForInactiveErrors,\n errorsToShow,\n messageBarIconProps,\n messageBarType\n} from './utils';\n\n/*\n Strings for {@link _TroubleshootingGuideErrorBar}.\n \n @internal\n /\nexport interface _TroubleshootingGuideErrorBarStrings {\n devicePermissionLinkText?: string;\n networkTroubleshootingLinkText?: string;\n dismissButtonText?: string;\n}\n\n/\n Props for {@link _TroubleshootingGuideErrorBar}.\n \n @internal\n /\nexport interface _TroubleshootingGuideErrorBarProps extends ErrorBarProps {\n /\n permissions state for camera/microphone\n /\n permissionsState?: {\n camera: PermissionState;\n microphone: PermissionState;\n };\n /\n Callback you may provide to supply users with further steps to troubleshoot why they have been\n * unable to grant your site the required permissions for the call.\n \n @example\n * ```ts\n * onPermissionsTroubleshootingClick: () =>\n * window.open('https://contoso.com/permissions-troubleshooting', '_blank');\n * ```\n \n @remarks\n * if this is not supplied, the composite will not show a 'further troubleshooting' link.\n /\n onPermissionsTroubleshootingClick?: (permissionsState: {\n camera: PermissionState;\n microphone: PermissionState;\n }) => void;\n /\n Optional callback to supply users with further troubleshooting steps for network issues\n * experienced when connecting to a call.\n \n @example\n * ```ts\n * onNetworkingTroubleshootingClick?: () =>\n * window.open('https://contoso.com/network-troubleshooting', '_blank');\n * ```\n \n @remarks\n * if this is not supplied, the composite will not show a 'network troubleshooting' link.\n /\n onNetworkingTroubleshootingClick?: () => void;\n /\n strings related to trouble shooting guidance link and dismiss button\n /\n troubleshootingGuideStrings: _TroubleshootingGuideErrorBarStrings;\n}\n\n/\n @internal\n * A component to show device Permission/network connection related errors, contains link that leads to further trouble shooting guide\n */\nexport const _TroubleshootingGuideErrorBar = (props: _TroubleshootingGuideErrorBarProps): JSX.Element => {\n const theme = useTheme();\n // error bar strings\n const localeStrings = useLocale().strings.errorBar;\n const strings = props.strings ?? localeStrings;\n\n const [dismissedErrors, setDismissedErrors] = useState<DismissedError[]>([]);\n\n const {\n onPermissionsTroubleshootingClick,\n onNetworkingTroubleshootingClick,\n permissionsState = {\n camera: 'denied',\n microphone: 'denied'\n },\n troubleshootingGuideStrings\n } = props;\n\n // dropDismissalsForInactiveErrors only returns a new object if `dismissedErrors` actually changes.\n // Without this behaviour, this `useEffect` block would cause a render loop.\n useEffect(\n () => setDismissedErrors(dropDismissalsForInactiveErrors(props.activeErrorMessages, dismissedErrors)),\n [props.activeErrorMessages, dismissedErrors]\n );\n\n const toShow = errorsToShow(props.activeErrorMessages, dismissedErrors);\n\n return (\n <Stack data-ui-id=\"error-bar-stack\">\n {toShow.map((error) => {\n const devicePermissionErrorBar = (\n <div>\n {strings[error.type]}{' '}\n {onPermissionsTroubleshootingClick && (\n <Link\n styles={linkStyle(theme)}\n onClick={() => {\n onPermissionsTroubleshootingClick(permissionsState);\n }}\n underline\n >\n <span>{troubleshootingGuideStrings.devicePermissionLinkText}</span>\n </Link>\n )}\n </div>\n );\n\n const networkErrorBar = (\n <div>\n {strings[error.type]}{' '}\n {onNetworkingTroubleshootingClick && (\n <Link styles={linkStyle(theme)} onClick={onNetworkingTroubleshootingClick} underline>\n <span>{troubleshootingGuideStrings.networkTroubleshootingLinkText}</span>\n </Link>\n )}\n </div>\n );\n\n return (\n <MessageBar\n {...props}\n styles={messageBarStyle(theme, messageBarType(error.type))}\n key={error.type}\n messageBarType={messageBarType(error.type)}\n messageBarIconProps={messageBarIconProps(error.type)}\n actions={\n <MessageBarButton\n text={troubleshootingGuideStrings.dismissButtonText}\n styles={dismissButtonStyle(theme)}\n onClick={() => {\n setDismissedErrors(dismissError(dismissedErrors, error));\n }}\n ariaLabel={strings.dismissButtonAriaLabel}\n />\n }\n isMultiline={false}\n >\n {showErrorBar(error.type, devicePermissionErrorBar, networkErrorBar)}\n </MessageBar>\n );\n })}\n </Stack>\n );\n};\n\nconst showErrorBar = (\n errorType: string,\n devicePermissionErrorBar: JSX.Element,\n networkErrorBar: JSX.Element\n): JSX.Element => {\n if (errorType === 'callNetworkQualityLow') {\n return networkErrorBar;\n } else {\n return devicePermissionErrorBar;\n }\n};\n"]}

package/dist/dist-esm/react-composites/src/composites/CallComposite/CallComposite.js CHANGED Viewed

@@ -33,7 +33,7 @@ import { HoldPage } from './pages/HoldPage';
 /* @conditional-compile-remove(unsupported-browser) */
 import { UnsupportedBrowserPage } from './pages/UnsupportedBrowser';
 const MainScreen = (props) => {
-    var _a, _b;
+    var _a, _b, _c, _d;
     const { callInvitationUrl, onRenderAvatar, onFetchAvatarPersonaData, onFetchParticipantMenuItems } = props;
     const page = useSelector(getPage);
     const adapter = useAdapter();
@@ -54,7 +54,11 @@ const MainScreen = (props) => {
                     adapter.joinCall();
                 },
                 /* @conditional-compile-remove(call-readiness) */
-                devicePermissions: (_a = props.options) === null || _a === void 0 ? void 0 : _a.devicePermissions }));
+                devicePermissions: (_a = props.options) === null || _a === void 0 ? void 0 : _a.devicePermissions,
+                /* @conditional-compile-remove(call-readiness) */
+                onPermissionsTroubleshootingClick: (_b = props.options) === null || _b === void 0 ? void 0 : _b.onPermissionsTroubleshootingClick,
+                /* @conditional-compile-remove(call-readiness) */
+                onNetworkingTroubleShootingClick: (_c = props.options) === null || _c === void 0 ? void 0 : _c.onNetworkingTroubleShootingClick }));
             break;
         case 'accessDeniedTeamsMeeting':
             pageElement = (React.createElement(NoticePage, { iconName: "NoticePageAccessDeniedTeamsMeeting", title: locale.strings.call.failedToJoinTeamsMeetingReasonAccessDeniedTitle, moreDetails: locale.strings.call.failedToJoinTeamsMeetingReasonAccessDeniedMoreDetails, dataUiId: 'access-denied-teams-meeting-page' }));
@@ -86,7 +90,7 @@ const MainScreen = (props) => {
         case unsupportedEnvironmentPageTrampoline():
             pageElement = (React.createElement(React.Fragment, null,
             /* @conditional-compile-remove(unsupported-browser) */
-            React.createElement(UnsupportedBrowserPage, { onTroubleshootingClick: (_b = props.options) === null || _b === void 0 ? void 0 : _b.onEnvironmentInfoTroubleshootingClick })));
+            React.createElement(UnsupportedBrowserPage, { onTroubleshootingClick: (_d = props.options) === null || _d === void 0 ? void 0 : _d.onEnvironmentInfoTroubleshootingClick })));
     }
     if (!pageElement) {
         throw new Error('Invalid call composite page');

package/dist/dist-esm/react-composites/src/composites/CallComposite/CallComposite.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CallComposite.js","sourceRoot":"","sources":["../../../../../../../react-composites/src/composites/CallComposite/CallComposite.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { _isInCall } from '@internal/calling-component-bindings';\nimport { OnRenderAvatarCallback, ParticipantMenuItemsCallback } from '@internal/react-components';\nimport React, { useEffect, useMemo } from 'react';\nimport { AvatarPersonaDataCallback } from '../common/AvatarPersona';\nimport { BaseProvider, BaseCompositeProps } from '../common/BaseComposite';\nimport { CallCompositeIcons } from '../common/icons';\nimport { useLocale } from '../localization';\nimport { CallAdapter } from './adapter/CallAdapter';\nimport { CallAdapterProvider, useAdapter } from './adapter/CallAdapterProvider';\nimport { CallPage } from './pages/CallPage';\nimport { ConfigurationPage } from './pages/ConfigurationPage';\nimport { NoticePage } from './pages/NoticePage';\nimport { useSelector } from './hooks/useSelector';\nimport { getPage } from './selectors/baseSelectors';\nimport { LobbyPage } from './pages/LobbyPage';\nimport { mainScreenContainerStyleDesktop, mainScreenContainerStyleMobile } from './styles/CallComposite.styles';\nimport { CallControlOptions } from './types/CallControlOptions';\n\n/* @conditional-compile-remove(rooms) /\nimport { _PermissionsProvider, Role, _getPermissions } from '@internal/react-components';\n/ @conditional-compile-remove(one-to-n-calling) /\nimport { LayerHost, mergeStyles } from '@fluentui/react';\n/ @conditional-compile-remove(one-to-n-calling) /\nimport { modalLayerHostStyle } from '../common/styles/ModalLocalAndRemotePIP.styles';\n/ @conditional-compile-remove(one-to-n-calling) /\nimport { useId } from '@fluentui/react-hooks';\n/ @conditional-compile-remove(one-to-n-calling) / / @conditional-compile-remove(PSTN-calls) /\nimport { HoldPage } from './pages/HoldPage';\n/ @conditional-compile-remove(unsupported-browser) /\nimport { UnsupportedBrowserPage } from './pages/UnsupportedBrowser';\n\n/\n Props for {@link CallComposite}.\n \n @public\n /\nexport interface CallCompositeProps extends BaseCompositeProps<CallCompositeIcons> {\n /\n An adapter provides logic and data to the composite.\n * Composite can also be controlled using the adapter.\n /\n adapter: CallAdapter;\n /\n Optimizes the composite form factor for either desktop or mobile.\n * @remarks `mobile` is currently only optimized for Portrait mode on mobile devices and does not support landscape.\n * @defaultValue 'desktop'\n /\n formFactor?: 'desktop' \| 'mobile';\n /\n URL to invite new participants to the current call. If this is supplied, a button appears in the Participants\n * Button flyout menu.\n /\n callInvitationUrl?: string;\n /\n Flags to enable/disable or customize UI elements of the {@link CallComposite}.\n /\n options?: CallCompositeOptions;\n\n / @conditional-compile-remove(rooms) /\n /\n Set this to enable/disable capacities for different roles\n /\n role?: Role;\n}\n\n/ @conditional-compile-remove(call-readiness) /\n/\n Device Permission restrictions.\n * Be able to start a call depending on camera and microphone permission options.\n \n @beta\n /\nexport interface DevicePermissionRestrictions {\n /\n Camera Permission prompts for your call.\n * 'required' - requires the permission to be allowed before permitting the user join the call.\n * 'optional' - permission can be disallowed and the user is still permitted to join the call.\n * 'doNotPrompt' - permission is not required and the user is not prompted to allow the permission.\n /\n camera: 'required' \| 'optional' \| 'doNotPrompt';\n /\n Microphone permission prompts for your call.\n * 'required' - requires the permission to be allowed before permitting the user join the call.\n * 'optional' - permission can be disallowed and the user is still permitted to join the call.\n * 'doNotPrompt' - permission is not required and the user is not prompted to allow the permission.\n /\n microphone: 'required' \| 'optional' \| 'doNotPrompt';\n}\n\n/\n Optional features of the {@link CallComposite}.\n \n @public\n /\nexport type CallCompositeOptions = {\n /\n Surface Azure Communication Services backend errors in the UI with {@link @azure/communication-react#ErrorBar}.\n * Hide or show the error bar.\n * @defaultValue true\n /\n errorBar?: boolean;\n /\n Hide or Customize the control bar element.\n * Can be customized by providing an object of type {@link @azure/communication-react#CallControlOptions}.\n * @defaultValue true\n /\n callControls?: boolean \| CallControlOptions;\n / @conditional-compile-remove(call-readiness) /\n /\n Device permission restrictions for your call.\n * Require device permissions to be set or have them as optional or not required to start a call\n /\n devicePermissions?: DevicePermissionRestrictions;\n / @conditional-compile-remove(call-readiness) /\n /\n Callback you may provide to supply users with further steps to troubleshoot why they have been\n * unable to grant your site the required permissions for the call.\n \n @example\n * ```ts\n * onPermissionsTroubleshootingClick: () =>\n * window.open('https://contoso.com/permissions-troubleshooting', '_blank');\n * ```\n \n @remarks\n * if this is not supplied, the composite will not show a 'further troubleshooting' link.\n /\n onPermissionsTroubleshootingClick?: (permissionsState: {\n camera: PermissionState;\n microphone: PermissionState;\n }) => void;\n / @conditional-compile-remove(call-readiness) /\n /\n Callback you may provide to supply users with further steps to troubleshoot why they have been\n * having network issues when connecting to the call.\n \n @example\n * ```ts\n * onNetworkingTroubleShootingClick?: () =>\n * window.open('https://contoso.com/network-troubleshooting', '_blank');\n * ```\n \n @remarks\n * if this is not supplied, the composite will not show a 'network troubleshooting' link.\n /\n onNetworkingTroubleShootingClick?: () => void;\n / @conditional-compile-remove(unsupported-browser) /\n /\n Callback you may provide to supply users with a provided page to showcase supported browsers by ACS.\n \n @example\n * ```ts\n * onBrowserTroubleShootingClick?: () =>\n * window.open('https://contoso.com/browser-troubleshooting', '_blank');\n * ```\n \n @remarks\n * if this is not supplied, the composite will not show a unsupported browser page.\n /\n onEnvironmentInfoTroubleshootingClick?: () => void;\n};\n\ntype MainScreenProps = {\n mobileView: boolean;\n / @conditional-compile-remove(one-to-n-calling) /\n modalLayerHostId: string;\n onRenderAvatar?: OnRenderAvatarCallback;\n callInvitationUrl?: string;\n onFetchAvatarPersonaData?: AvatarPersonaDataCallback;\n onFetchParticipantMenuItems?: ParticipantMenuItemsCallback;\n options?: CallCompositeOptions;\n / @conditional-compile-remove(rooms) /\n role?: Role;\n};\n\nconst MainScreen = (props: MainScreenProps): JSX.Element => {\n const { callInvitationUrl, onRenderAvatar, onFetchAvatarPersonaData, onFetchParticipantMenuItems } = props;\n const page = useSelector(getPage);\n\n const adapter = useAdapter();\n const locale = useLocale();\n\n let pageElement: JSX.Element \| undefined;\n / @conditional-compile-remove(rooms) /\n switch (page) {\n case 'roomNotFound':\n pageElement = (\n <NoticePage\n iconName=\"NoticePageInvalidRoom\"\n title={locale.strings.call.roomNotFoundTitle}\n moreDetails={locale.strings.call.roomNotFoundDetails}\n dataUiId={'room-not-found-page'}\n />\n );\n break;\n case 'deniedPermissionToRoom':\n pageElement = (\n <NoticePage\n iconName=\"NoticePageInvalidRoom\"\n title={locale.strings.call.deniedPermissionToRoomTitle}\n moreDetails={locale.strings.call.deniedPermissionToRoomDetails}\n dataUiId={'not-invited-to-room-page'}\n />\n );\n break;\n }\n switch (page) {\n case 'configuration':\n pageElement = (\n <ConfigurationPage\n mobileView={props.mobileView}\n startCallHandler={(): void => {\n adapter.joinCall();\n }}\n / @conditional-compile-remove(call-readiness) /\n devicePermissions={props.options?.devicePermissions}\n />\n );\n break;\n case 'accessDeniedTeamsMeeting':\n pageElement = (\n <NoticePage\n iconName=\"NoticePageAccessDeniedTeamsMeeting\"\n title={locale.strings.call.failedToJoinTeamsMeetingReasonAccessDeniedTitle}\n moreDetails={locale.strings.call.failedToJoinTeamsMeetingReasonAccessDeniedMoreDetails}\n dataUiId={'access-denied-teams-meeting-page'}\n />\n );\n break;\n case 'removedFromCall':\n pageElement = (\n <NoticePage\n iconName=\"NoticePageRemovedFromCall\"\n title={locale.strings.call.removedFromCallTitle}\n moreDetails={locale.strings.call.removedFromCallMoreDetails}\n dataUiId={'removed-from-call-page'}\n />\n );\n break;\n case 'joinCallFailedDueToNoNetwork':\n pageElement = (\n <NoticePage\n iconName=\"NoticePageJoinCallFailedDueToNoNetwork\"\n title={locale.strings.call.failedToJoinCallDueToNoNetworkTitle}\n moreDetails={locale.strings.call.failedToJoinCallDueToNoNetworkMoreDetails}\n dataUiId={'join-call-failed-due-to-no-network-page'}\n />\n );\n break;\n case 'leftCall':\n pageElement = (\n <NoticePage\n iconName=\"NoticePageLeftCall\"\n title={locale.strings.call.leftCallTitle}\n moreDetails={locale.strings.call.leftCallMoreDetails}\n dataUiId={'left-call-page'}\n />\n );\n break;\n case 'lobby':\n pageElement = (\n <LobbyPage\n mobileView={props.mobileView}\n / @conditional-compile-remove(one-to-n-calling) /\n modalLayerHostId={props.modalLayerHostId}\n options={props.options}\n />\n );\n break;\n case 'call':\n pageElement = (\n <CallPage\n onRenderAvatar={onRenderAvatar}\n callInvitationURL={callInvitationUrl}\n onFetchAvatarPersonaData={onFetchAvatarPersonaData}\n onFetchParticipantMenuItems={onFetchParticipantMenuItems}\n mobileView={props.mobileView}\n / @conditional-compile-remove(one-to-n-calling) /\n modalLayerHostId={props.modalLayerHostId}\n options={props.options}\n />\n );\n break;\n / @conditional-compile-remove(PSTN-calls) / / @conditional-compile-remove(one-to-n-calling) /\n case holdPageTrampoline():\n pageElement = (\n <>\n {\n / @conditional-compile-remove(PSTN-calls) / / @conditional-compile-remove(one-to-n-calling) / <HoldPage\n mobileView={props.mobileView}\n modalLayerHostId={props.modalLayerHostId}\n options={props.options}\n />\n }\n </>\n );\n break;\n case unsupportedEnvironmentPageTrampoline():\n pageElement = (\n <>\n {\n / @conditional-compile-remove(unsupported-browser) /\n <UnsupportedBrowserPage onTroubleshootingClick={props.options?.onEnvironmentInfoTroubleshootingClick} />\n }\n </>\n );\n }\n\n if (!pageElement) {\n throw new Error('Invalid call composite page');\n }\n\n / @conditional-compile-remove(rooms) /\n const permissions = _getPermissions(props.role);\n\n // default retElement for stable version\n let retElement = pageElement;\n / @conditional-compile-remove(rooms) /\n retElement = <_PermissionsProvider permissions={permissions}>{pageElement}</_PermissionsProvider>;\n\n return retElement;\n};\n\n/\n A customizable UI composite for calling experience.\n \n @remarks Call composite min width/height are as follow:\n * - mobile: 17.5rem x 21rem (280px x 336px, with default rem at 16px)\n * - desktop: 30rem x 22rem (480px x 352px, with default rem at 16px)\n \n @public\n /\nexport const CallComposite = (props: CallCompositeProps): JSX.Element => {\n const {\n adapter,\n callInvitationUrl,\n onFetchAvatarPersonaData,\n onFetchParticipantMenuItems,\n options,\n formFactor = 'desktop',\n / @conditional-compile-remove(rooms) /\n role\n } = props;\n useEffect(() => {\n (async () => {\n / @conditional-compile-remove(rooms) /\n if (role === 'Consumer') {\n // Need to ask for audio devices to get access to speakers. Speaker permission is tied to microphone permission (when you request 'audio' permission using the SDK) its\n // actually granting access to query both microphone and speaker. TODO: Need some investigation to see if we can get access to speakers without SDK.\n await adapter.askDevicePermission({ video: false, audio: true });\n adapter.querySpeakers();\n return;\n }\n / @conditional-compile-remove(call-readiness) /\n if (options?.devicePermissions) {\n const videoPermission = options?.devicePermissions.camera !== 'doNotPrompt';\n const audioPermission = options?.devicePermissions.microphone !== 'doNotPrompt';\n await adapter.askDevicePermission({\n video: videoPermission,\n audio: audioPermission\n });\n if (videoPermission) {\n adapter.queryCameras();\n }\n if (audioPermission) {\n adapter.queryMicrophones();\n }\n adapter.querySpeakers();\n return;\n }\n\n await adapter.askDevicePermission({ video: true, audio: true });\n adapter.queryCameras();\n adapter.queryMicrophones();\n adapter.querySpeakers();\n })();\n }, [\n adapter,\n / @conditional-compile-remove(rooms) / role,\n / @conditional-compile-remove(call-readiness) / options?.devicePermissions\n ]);\n\n const mobileView = formFactor === 'mobile';\n\n / @conditional-compile-remove(one-to-n-calling) /\n const modalLayerHostId = useId('modalLayerhost');\n\n const mainScreenContainerClassName = useMemo(() => {\n return mobileView ? mainScreenContainerStyleMobile : mainScreenContainerStyleDesktop;\n }, [mobileView]);\n\n return (\n <div className={mainScreenContainerClassName}>\n <BaseProvider {...props}>\n <CallAdapterProvider adapter={adapter}>\n <MainScreen\n callInvitationUrl={callInvitationUrl}\n onFetchAvatarPersonaData={onFetchAvatarPersonaData}\n onFetchParticipantMenuItems={onFetchParticipantMenuItems}\n mobileView={mobileView}\n / @conditional-compile-remove(one-to-n-calling) /\n modalLayerHostId={modalLayerHostId}\n options={options}\n / @conditional-compile-remove(rooms) /\n role={role}\n />\n {\n // This layer host is for ModalLocalAndRemotePIP in CallPane. This LayerHost cannot be inside the CallPane\n // because when the CallPane is hidden, ie. style property display is 'none', it takes up no space. This causes problems when dragging\n // the Modal because the draggable bounds thinks it has no space and will always return to its initial position after dragging.\n // Additionally, this layer host cannot be in the Call Arrangement as it needs to be rendered before useMinMaxDragPosition() in\n // common/utils useRef is called.\n // Warning: this is fragile and works because the call arrangement page is only rendered after the call has connected and thus this\n // LayerHost will be guaranteed to have rendered (and subsequently mounted in the DOM). This ensures the DOM element will be available\n // before the call to `document.getElementById(modalLayerHostId)` is made.\n / @conditional-compile-remove(one-to-n-calling) /\n mobileView && <LayerHost id={modalLayerHostId} className={mergeStyles(modalLayerHostStyle)} />\n }\n </CallAdapterProvider>\n </BaseProvider>\n </div>\n );\n};\n\nconst holdPageTrampoline = (): string => {\n / @conditional-compile-remove(one-to-n-calling) /\n / @conditional-compile-remove(PSTN-calls) /\n return 'hold';\n return 'call';\n};\n\nconst unsupportedEnvironmentPageTrampoline = (): string => {\n / @conditional-compile-remove(unsupported-browser) */\n return 'unsupportedEnvironment';\n return 'call';\n};\n\"../../../../calling-component-bindings/src\"\"../../../../react-components/src\""]}
1	+ {"version":3,"file":"CallComposite.js","sourceRoot":"","sources":["../../../../../../../react-composites/src/composites/CallComposite/CallComposite.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { _isInCall } from '@internal/calling-component-bindings';\nimport { OnRenderAvatarCallback, ParticipantMenuItemsCallback } from '@internal/react-components';\nimport React, { useEffect, useMemo } from 'react';\nimport { AvatarPersonaDataCallback } from '../common/AvatarPersona';\nimport { BaseProvider, BaseCompositeProps } from '../common/BaseComposite';\nimport { CallCompositeIcons } from '../common/icons';\nimport { useLocale } from '../localization';\nimport { CallAdapter } from './adapter/CallAdapter';\nimport { CallAdapterProvider, useAdapter } from './adapter/CallAdapterProvider';\nimport { CallPage } from './pages/CallPage';\nimport { ConfigurationPage } from './pages/ConfigurationPage';\nimport { NoticePage } from './pages/NoticePage';\nimport { useSelector } from './hooks/useSelector';\nimport { getPage } from './selectors/baseSelectors';\nimport { LobbyPage } from './pages/LobbyPage';\nimport { mainScreenContainerStyleDesktop, mainScreenContainerStyleMobile } from './styles/CallComposite.styles';\nimport { CallControlOptions } from './types/CallControlOptions';\n\n/* @conditional-compile-remove(rooms) /\nimport { _PermissionsProvider, Role, _getPermissions } from '@internal/react-components';\n/ @conditional-compile-remove(one-to-n-calling) /\nimport { LayerHost, mergeStyles } from '@fluentui/react';\n/ @conditional-compile-remove(one-to-n-calling) /\nimport { modalLayerHostStyle } from '../common/styles/ModalLocalAndRemotePIP.styles';\n/ @conditional-compile-remove(one-to-n-calling) /\nimport { useId } from '@fluentui/react-hooks';\n/ @conditional-compile-remove(one-to-n-calling) / / @conditional-compile-remove(PSTN-calls) /\nimport { HoldPage } from './pages/HoldPage';\n/ @conditional-compile-remove(unsupported-browser) /\nimport { UnsupportedBrowserPage } from './pages/UnsupportedBrowser';\n\n/\n Props for {@link CallComposite}.\n \n @public\n /\nexport interface CallCompositeProps extends BaseCompositeProps<CallCompositeIcons> {\n /\n An adapter provides logic and data to the composite.\n * Composite can also be controlled using the adapter.\n /\n adapter: CallAdapter;\n /\n Optimizes the composite form factor for either desktop or mobile.\n * @remarks `mobile` is currently only optimized for Portrait mode on mobile devices and does not support landscape.\n * @defaultValue 'desktop'\n /\n formFactor?: 'desktop' \| 'mobile';\n /\n URL to invite new participants to the current call. If this is supplied, a button appears in the Participants\n * Button flyout menu.\n /\n callInvitationUrl?: string;\n /\n Flags to enable/disable or customize UI elements of the {@link CallComposite}.\n /\n options?: CallCompositeOptions;\n\n / @conditional-compile-remove(rooms) /\n /\n Set this to enable/disable capacities for different roles\n /\n role?: Role;\n}\n\n/ @conditional-compile-remove(call-readiness) /\n/\n Device Permission restrictions.\n * Be able to start a call depending on camera and microphone permission options.\n \n @beta\n /\nexport interface DevicePermissionRestrictions {\n /\n Camera Permission prompts for your call.\n * 'required' - requires the permission to be allowed before permitting the user join the call.\n * 'optional' - permission can be disallowed and the user is still permitted to join the call.\n * 'doNotPrompt' - permission is not required and the user is not prompted to allow the permission.\n /\n camera: 'required' \| 'optional' \| 'doNotPrompt';\n /\n Microphone permission prompts for your call.\n * 'required' - requires the permission to be allowed before permitting the user join the call.\n * 'optional' - permission can be disallowed and the user is still permitted to join the call.\n * 'doNotPrompt' - permission is not required and the user is not prompted to allow the permission.\n /\n microphone: 'required' \| 'optional' \| 'doNotPrompt';\n}\n\n/\n Optional features of the {@link CallComposite}.\n \n @public\n /\nexport type CallCompositeOptions = {\n /\n Surface Azure Communication Services backend errors in the UI with {@link @azure/communication-react#ErrorBar}.\n * Hide or show the error bar.\n * @defaultValue true\n /\n errorBar?: boolean;\n /\n Hide or Customize the control bar element.\n * Can be customized by providing an object of type {@link @azure/communication-react#CallControlOptions}.\n * @defaultValue true\n /\n callControls?: boolean \| CallControlOptions;\n / @conditional-compile-remove(call-readiness) /\n /\n Device permission restrictions for your call.\n * Require device permissions to be set or have them as optional or not required to start a call\n /\n devicePermissions?: DevicePermissionRestrictions;\n / @conditional-compile-remove(call-readiness) /\n /\n Callback you may provide to supply users with further steps to troubleshoot why they have been\n * unable to grant your site the required permissions for the call.\n \n @example\n * ```ts\n * onPermissionsTroubleshootingClick: () =>\n * window.open('https://contoso.com/permissions-troubleshooting', '_blank');\n * ```\n \n @remarks\n * if this is not supplied, the composite will not show a 'further troubleshooting' link.\n /\n onPermissionsTroubleshootingClick?: (permissionsState: {\n camera: PermissionState;\n microphone: PermissionState;\n }) => void;\n / @conditional-compile-remove(call-readiness) /\n /\n Callback you may provide to supply users with further steps to troubleshoot why they have been\n * having network issues when connecting to the call.\n \n @example\n * ```ts\n * onNetworkingTroubleShootingClick?: () =>\n * window.open('https://contoso.com/network-troubleshooting', '_blank');\n * ```\n \n @remarks\n * if this is not supplied, the composite will not show a 'network troubleshooting' link.\n /\n onNetworkingTroubleShootingClick?: () => void;\n / @conditional-compile-remove(unsupported-browser) /\n /\n Callback you may provide to supply users with a provided page to showcase supported browsers by ACS.\n \n @example\n * ```ts\n * onBrowserTroubleShootingClick?: () =>\n * window.open('https://contoso.com/browser-troubleshooting', '_blank');\n * ```\n \n @remarks\n * if this is not supplied, the composite will not show a unsupported browser page.\n /\n onEnvironmentInfoTroubleshootingClick?: () => void;\n};\n\ntype MainScreenProps = {\n mobileView: boolean;\n / @conditional-compile-remove(one-to-n-calling) /\n modalLayerHostId: string;\n onRenderAvatar?: OnRenderAvatarCallback;\n callInvitationUrl?: string;\n onFetchAvatarPersonaData?: AvatarPersonaDataCallback;\n onFetchParticipantMenuItems?: ParticipantMenuItemsCallback;\n options?: CallCompositeOptions;\n / @conditional-compile-remove(rooms) /\n role?: Role;\n};\n\nconst MainScreen = (props: MainScreenProps): JSX.Element => {\n const { callInvitationUrl, onRenderAvatar, onFetchAvatarPersonaData, onFetchParticipantMenuItems } = props;\n const page = useSelector(getPage);\n\n const adapter = useAdapter();\n const locale = useLocale();\n\n let pageElement: JSX.Element \| undefined;\n / @conditional-compile-remove(rooms) /\n switch (page) {\n case 'roomNotFound':\n pageElement = (\n <NoticePage\n iconName=\"NoticePageInvalidRoom\"\n title={locale.strings.call.roomNotFoundTitle}\n moreDetails={locale.strings.call.roomNotFoundDetails}\n dataUiId={'room-not-found-page'}\n />\n );\n break;\n case 'deniedPermissionToRoom':\n pageElement = (\n <NoticePage\n iconName=\"NoticePageInvalidRoom\"\n title={locale.strings.call.deniedPermissionToRoomTitle}\n moreDetails={locale.strings.call.deniedPermissionToRoomDetails}\n dataUiId={'not-invited-to-room-page'}\n />\n );\n break;\n }\n switch (page) {\n case 'configuration':\n pageElement = (\n <ConfigurationPage\n mobileView={props.mobileView}\n startCallHandler={(): void => {\n adapter.joinCall();\n }}\n / @conditional-compile-remove(call-readiness) /\n devicePermissions={props.options?.devicePermissions}\n / @conditional-compile-remove(call-readiness) /\n onPermissionsTroubleshootingClick={props.options?.onPermissionsTroubleshootingClick}\n / @conditional-compile-remove(call-readiness) /\n onNetworkingTroubleShootingClick={props.options?.onNetworkingTroubleShootingClick}\n />\n );\n break;\n case 'accessDeniedTeamsMeeting':\n pageElement = (\n <NoticePage\n iconName=\"NoticePageAccessDeniedTeamsMeeting\"\n title={locale.strings.call.failedToJoinTeamsMeetingReasonAccessDeniedTitle}\n moreDetails={locale.strings.call.failedToJoinTeamsMeetingReasonAccessDeniedMoreDetails}\n dataUiId={'access-denied-teams-meeting-page'}\n />\n );\n break;\n case 'removedFromCall':\n pageElement = (\n <NoticePage\n iconName=\"NoticePageRemovedFromCall\"\n title={locale.strings.call.removedFromCallTitle}\n moreDetails={locale.strings.call.removedFromCallMoreDetails}\n dataUiId={'removed-from-call-page'}\n />\n );\n break;\n case 'joinCallFailedDueToNoNetwork':\n pageElement = (\n <NoticePage\n iconName=\"NoticePageJoinCallFailedDueToNoNetwork\"\n title={locale.strings.call.failedToJoinCallDueToNoNetworkTitle}\n moreDetails={locale.strings.call.failedToJoinCallDueToNoNetworkMoreDetails}\n dataUiId={'join-call-failed-due-to-no-network-page'}\n />\n );\n break;\n case 'leftCall':\n pageElement = (\n <NoticePage\n iconName=\"NoticePageLeftCall\"\n title={locale.strings.call.leftCallTitle}\n moreDetails={locale.strings.call.leftCallMoreDetails}\n dataUiId={'left-call-page'}\n />\n );\n break;\n case 'lobby':\n pageElement = (\n <LobbyPage\n mobileView={props.mobileView}\n / @conditional-compile-remove(one-to-n-calling) /\n modalLayerHostId={props.modalLayerHostId}\n options={props.options}\n />\n );\n break;\n case 'call':\n pageElement = (\n <CallPage\n onRenderAvatar={onRenderAvatar}\n callInvitationURL={callInvitationUrl}\n onFetchAvatarPersonaData={onFetchAvatarPersonaData}\n onFetchParticipantMenuItems={onFetchParticipantMenuItems}\n mobileView={props.mobileView}\n / @conditional-compile-remove(one-to-n-calling) /\n modalLayerHostId={props.modalLayerHostId}\n options={props.options}\n />\n );\n break;\n / @conditional-compile-remove(PSTN-calls) / / @conditional-compile-remove(one-to-n-calling) /\n case holdPageTrampoline():\n pageElement = (\n <>\n {\n / @conditional-compile-remove(PSTN-calls) / / @conditional-compile-remove(one-to-n-calling) / <HoldPage\n mobileView={props.mobileView}\n modalLayerHostId={props.modalLayerHostId}\n options={props.options}\n />\n }\n </>\n );\n break;\n case unsupportedEnvironmentPageTrampoline():\n pageElement = (\n <>\n {\n / @conditional-compile-remove(unsupported-browser) /\n <UnsupportedBrowserPage onTroubleshootingClick={props.options?.onEnvironmentInfoTroubleshootingClick} />\n }\n </>\n );\n }\n\n if (!pageElement) {\n throw new Error('Invalid call composite page');\n }\n\n / @conditional-compile-remove(rooms) /\n const permissions = _getPermissions(props.role);\n\n // default retElement for stable version\n let retElement = pageElement;\n / @conditional-compile-remove(rooms) /\n retElement = <_PermissionsProvider permissions={permissions}>{pageElement}</_PermissionsProvider>;\n\n return retElement;\n};\n\n/\n A customizable UI composite for calling experience.\n \n @remarks Call composite min width/height are as follow:\n * - mobile: 17.5rem x 21rem (280px x 336px, with default rem at 16px)\n * - desktop: 30rem x 22rem (480px x 352px, with default rem at 16px)\n \n @public\n /\nexport const CallComposite = (props: CallCompositeProps): JSX.Element => {\n const {\n adapter,\n callInvitationUrl,\n onFetchAvatarPersonaData,\n onFetchParticipantMenuItems,\n options,\n formFactor = 'desktop',\n / @conditional-compile-remove(rooms) /\n role\n } = props;\n useEffect(() => {\n (async () => {\n / @conditional-compile-remove(rooms) /\n if (role === 'Consumer') {\n // Need to ask for audio devices to get access to speakers. Speaker permission is tied to microphone permission (when you request 'audio' permission using the SDK) its\n // actually granting access to query both microphone and speaker. TODO: Need some investigation to see if we can get access to speakers without SDK.\n await adapter.askDevicePermission({ video: false, audio: true });\n adapter.querySpeakers();\n return;\n }\n / @conditional-compile-remove(call-readiness) /\n if (options?.devicePermissions) {\n const videoPermission = options?.devicePermissions.camera !== 'doNotPrompt';\n const audioPermission = options?.devicePermissions.microphone !== 'doNotPrompt';\n await adapter.askDevicePermission({\n video: videoPermission,\n audio: audioPermission\n });\n if (videoPermission) {\n adapter.queryCameras();\n }\n if (audioPermission) {\n adapter.queryMicrophones();\n }\n adapter.querySpeakers();\n return;\n }\n\n await adapter.askDevicePermission({ video: true, audio: true });\n adapter.queryCameras();\n adapter.queryMicrophones();\n adapter.querySpeakers();\n })();\n }, [\n adapter,\n / @conditional-compile-remove(rooms) / role,\n / @conditional-compile-remove(call-readiness) / options?.devicePermissions\n ]);\n\n const mobileView = formFactor === 'mobile';\n\n / @conditional-compile-remove(one-to-n-calling) /\n const modalLayerHostId = useId('modalLayerhost');\n\n const mainScreenContainerClassName = useMemo(() => {\n return mobileView ? mainScreenContainerStyleMobile : mainScreenContainerStyleDesktop;\n }, [mobileView]);\n\n return (\n <div className={mainScreenContainerClassName}>\n <BaseProvider {...props}>\n <CallAdapterProvider adapter={adapter}>\n <MainScreen\n callInvitationUrl={callInvitationUrl}\n onFetchAvatarPersonaData={onFetchAvatarPersonaData}\n onFetchParticipantMenuItems={onFetchParticipantMenuItems}\n mobileView={mobileView}\n / @conditional-compile-remove(one-to-n-calling) /\n modalLayerHostId={modalLayerHostId}\n options={options}\n / @conditional-compile-remove(rooms) /\n role={role}\n />\n {\n // This layer host is for ModalLocalAndRemotePIP in CallPane. This LayerHost cannot be inside the CallPane\n // because when the CallPane is hidden, ie. style property display is 'none', it takes up no space. This causes problems when dragging\n // the Modal because the draggable bounds thinks it has no space and will always return to its initial position after dragging.\n // Additionally, this layer host cannot be in the Call Arrangement as it needs to be rendered before useMinMaxDragPosition() in\n // common/utils useRef is called.\n // Warning: this is fragile and works because the call arrangement page is only rendered after the call has connected and thus this\n // LayerHost will be guaranteed to have rendered (and subsequently mounted in the DOM). This ensures the DOM element will be available\n // before the call to `document.getElementById(modalLayerHostId)` is made.\n / @conditional-compile-remove(one-to-n-calling) /\n mobileView && <LayerHost id={modalLayerHostId} className={mergeStyles(modalLayerHostStyle)} />\n }\n </CallAdapterProvider>\n </BaseProvider>\n </div>\n );\n};\n\nconst holdPageTrampoline = (): string => {\n / @conditional-compile-remove(one-to-n-calling) /\n / @conditional-compile-remove(PSTN-calls) /\n return 'hold';\n return 'call';\n};\n\nconst unsupportedEnvironmentPageTrampoline = (): string => {\n / @conditional-compile-remove(unsupported-browser) */\n return 'unsupportedEnvironment';\n return 'call';\n};\n\"../../../../calling-component-bindings/src\"\"../../../../react-components/src\""]}

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/ConfigurationpageErrorBar.d.ts ADDED Viewed

@@ -0,0 +1,27 @@
+/// <reference types="react" />
+import { ActiveErrorMessage, ErrorBarProps } from "../../../../../react-components/src";
+import { CallingHandlers } from "../../../../../calling-component-bindings/src";
+import { Common } from "../../../../../acs-ui-common/src";
+/**
+ * @private
+ */
+export interface ConfigurationpageErrorBarProps {
+    errorBarProps: {
+        activeErrorMessages: ActiveErrorMessage[];
+    } & Common<CallingHandlers, ErrorBarProps>;
+    showTroubleShootingErrorBar?: boolean;
+    onPermissionsTroubleshootingClick?: (permissionsState: {
+        camera: PermissionState;
+        microphone: PermissionState;
+    }) => void;
+    onNetworkingTroubleShootingClick?: () => void;
+    permissionsState?: {
+        camera: PermissionState;
+        microphone: PermissionState;
+    };
+}
+/**
+ * @private
+ */
+export declare const ConfigurationpageErrorBar: (props: ConfigurationpageErrorBarProps) => JSX.Element;
+//# sourceMappingURL=ConfigurationpageErrorBar.d.ts.map

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/ConfigurationpageErrorBar.js ADDED Viewed

@@ -0,0 +1,30 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT license.
+import React from 'react';
+import { _TroubleshootingGuideErrorBar, ErrorBar } from "../../../../../react-components/src";
+/**
+ * @private
+ */
+export const ConfigurationpageErrorBar = (props) => {
+    const { errorBarProps,
+    /* @conditional-compile-remove(call-readiness) */
+    showTroubleShootingErrorBar = false,
+    /* @conditional-compile-remove(call-readiness) */
+    onPermissionsTroubleshootingClick,
+    /* @conditional-compile-remove(call-readiness) */
+    onNetworkingTroubleShootingClick,
+    /* @conditional-compile-remove(call-readiness) */
+    permissionsState } = props;
+    /* @conditional-compile-remove(call-readiness) */
+    const permissionTroubleshootingGuideStrings = {
+        devicePermissionLinkText: 'Troubleshooting Camera and Microphone Permissions',
+        networkTroubleshootingLinkText: 'Troubleshooting Network Connection',
+        dismissButtonText: 'OK'
+    };
+    /* @conditional-compile-remove(call-readiness) */
+    if (showTroubleShootingErrorBar) {
+        return (React.createElement(_TroubleshootingGuideErrorBar, Object.assign({ troubleshootingGuideStrings: permissionTroubleshootingGuideStrings, onPermissionsTroubleshootingClick: onPermissionsTroubleshootingClick, onNetworkingTroubleshootingClick: onNetworkingTroubleShootingClick, permissionsState: permissionsState }, errorBarProps)));
+    }
+    return React.createElement(ErrorBar, Object.assign({}, errorBarProps));
+};
+//# sourceMappingURL=ConfigurationpageErrorBar.js.map

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/ConfigurationpageErrorBar.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"ConfigurationpageErrorBar.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/components/ConfigurationpageErrorBar.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAClC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAOL,6BAA6B,EAC7B,QAAQ,EACT,4CAAmC;AAuBpC;;GAEG;AACH,MAAM,CAAC,MAAM,yBAAyB,GAAG,CAAC,KAAqC,EAAe,EAAE;IAC9F,MAAM,EACJ,aAAa;IACb,iDAAiD;IACjD,2BAA2B,GAAG,KAAK;IACnC,iDAAiD;IACjD,iCAAiC;IACjC,iDAAiD;IACjD,gCAAgC;IAChC,iDAAiD;IACjD,gBAAgB,EACjB,GAAG,KAAK,CAAC;IAEV,iDAAiD;IACjD,MAAM,qCAAqC,GAAyC;QAClF,wBAAwB,EAAE,mDAAmD;QAC7E,8BAA8B,EAAE,oCAAoC;QACpE,iBAAiB,EAAE,IAAI;KACxB,CAAC;IAEF,iDAAiD;IACjD,IAAI,2BAA2B,EAAE;QAC/B,OAAO,CACL,oBAAC,6BAA6B,kBAC5B,2BAA2B,EAAE,qCAAqC,EAClE,iCAAiC,EAAE,iCAAiC,EACpE,gCAAgC,EAAE,gCAAgC,EAClE,gBAAgB,EAAE,gBAAgB,IAC9B,aAAa,EACjB,CACH,CAAC;KACH;IAED,OAAO,oBAAC,QAAQ,oBAAK,aAAa,EAAI,CAAC;AACzC,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\nimport React from 'react';\nimport {\n _DevicePermissionDropdownStrings,\n _DevicePermissionDropdown,\n _DevicePermissionDropdownProps,\n ActiveErrorMessage,\n ErrorBarProps,\n _TroubleshootingGuideErrorBarStrings,\n _TroubleshootingGuideErrorBar,\n ErrorBar\n} from '@internal/react-components';\nimport { CallingHandlers } from '@internal/calling-component-bindings';\nimport { Common } from '@internal/acs-ui-common';\n\n/**\n * @private\n */\nexport interface ConfigurationpageErrorBarProps {\n errorBarProps: {\n activeErrorMessages: ActiveErrorMessage[];\n } & Common<CallingHandlers, ErrorBarProps>;\n showTroubleShootingErrorBar?: boolean;\n onPermissionsTroubleshootingClick?: (permissionsState: {\n camera: PermissionState;\n microphone: PermissionState;\n }) => void;\n onNetworkingTroubleShootingClick?: () => void;\n permissionsState?: {\n camera: PermissionState;\n microphone: PermissionState;\n };\n}\n\n/**\n * @private\n */\nexport const ConfigurationpageErrorBar = (props: ConfigurationpageErrorBarProps): JSX.Element => {\n const {\n errorBarProps,\n /* @conditional-compile-remove(call-readiness) */\n showTroubleShootingErrorBar = false,\n /* @conditional-compile-remove(call-readiness) */\n onPermissionsTroubleshootingClick,\n /* @conditional-compile-remove(call-readiness) */\n onNetworkingTroubleShootingClick,\n /* @conditional-compile-remove(call-readiness) */\n permissionsState\n } = props;\n\n /* @conditional-compile-remove(call-readiness) */\n const permissionTroubleshootingGuideStrings: _TroubleshootingGuideErrorBarStrings = {\n devicePermissionLinkText: 'Troubleshooting Camera and Microphone Permissions',\n networkTroubleshootingLinkText: 'Troubleshooting Network Connection',\n dismissButtonText: 'OK'\n };\n\n /* @conditional-compile-remove(call-readiness) */\n if (showTroubleShootingErrorBar) {\n return (\n <_TroubleshootingGuideErrorBar\n troubleshootingGuideStrings={permissionTroubleshootingGuideStrings}\n onPermissionsTroubleshootingClick={onPermissionsTroubleshootingClick}\n onNetworkingTroubleshootingClick={onNetworkingTroubleShootingClick}\n permissionsState={permissionsState}\n {...errorBarProps}\n />\n );\n }\n\n return <ErrorBar {...errorBarProps} />;\n};\n\"../../../../../react-components/src\"\"../../../../../calling-component-bindings/src\"\"../../../../../acs-ui-common/src\""]}

package/dist/dist-esm/react-composites/src/composites/CallComposite/pages/ConfigurationPage.d.ts CHANGED Viewed

@@ -7,6 +7,11 @@ export interface ConfigurationPageProps {
     mobileView: boolean;
     startCallHandler(): void;
     devicePermissions?: DevicePermissionRestrictions;
+    onPermissionsTroubleshootingClick?: (permissionsState: {
+        camera: PermissionState;
+        microphone: PermissionState;
+    }) => void;
+    onNetworkingTroubleShootingClick?: () => void;
 }
 /**
  * @private

package/dist/dist-esm/react-composites/src/composites/CallComposite/pages/ConfigurationPage.js CHANGED Viewed

@@ -18,12 +18,16 @@ import { useLocale } from '../../localization';
 import { bannerNotificationStyles } from '../styles/CallPage.styles';
 import { usePropsFor } from '../hooks/usePropsFor';
 import { useAdapter } from '../adapter/CallAdapterProvider';
+import { ConfigurationpageErrorBar } from '../components/ConfigurationpageErrorBar';
 /**
  * @private
  */
 export const ConfigurationPage = (props) => {
     var _a, _b;
-    const { startCallHandler, mobileView, /* @conditional-compile-remove(call-readiness) */ devicePermissions } = props;
+    const { startCallHandler, mobileView,
+    /* @conditional-compile-remove(call-readiness) */ devicePermissions,
+    /* @conditional-compile-remove(call-readiness) */ onPermissionsTroubleshootingClick,
+    /* @conditional-compile-remove(call-readiness) */ onNetworkingTroubleShootingClick } = props;
     const options = useAdaptedSelector(getCallingSelector(DevicesButton));
     const localDeviceSettingsHandlers = useHandlers(LocalDeviceSettings);
     const { video: cameraPermissionGranted, audio: microphonePermissionGranted } = useSelector(devicePermissionSelector);
@@ -61,9 +65,28 @@ export const ConfigurationPage = (props) => {
     let mobileWithPreview = mobileView;
     /* @conditional-compile-remove(rooms) */
     mobileWithPreview = mobileWithPreview && rolePermissions.cameraButton;
+    /* @conditional-compile-remove(call-readiness) */
+    const permissionsState = {
+        camera: cameraPermissionGranted ? 'granted' : 'denied',
+        microphone: microphonePermissionGranted ? 'granted' : 'denied'
+    };
+    /* @conditional-compile-remove(call-readiness) */
+    const networkErrors = errorBarProps.activeErrorMessages.filter((message) => message.type === 'callNetworkQualityLow');
     return (React.createElement(Stack, { className: mobileView ? configurationContainerStyleMobile : configurationContainerStyleDesktop },
         React.createElement(Stack, { styles: bannerNotificationStyles },
-            React.createElement(ErrorBar, Object.assign({}, errorBarProps))),
+            React.createElement(ConfigurationpageErrorBar
+            /* @conditional-compile-remove(call-readiness) */
+            // show trouble shooting error bar when encountering network error/ permission error
+            , {
+                /* @conditional-compile-remove(call-readiness) */
+                // show trouble shooting error bar when encountering network error/ permission error
+                showTroubleShootingErrorBar: !cameraPermissionGranted || !microphonePermissionGranted || networkErrors.length > 0,
+                /* @conditional-compile-remove(call-readiness) */
+                permissionsState: permissionsState,
+                /* @conditional-compile-remove(call-readiness) */
+                onNetworkingTroubleShootingClick: onNetworkingTroubleShootingClick,
+                /* @conditional-compile-remove(call-readiness) */
+                onPermissionsTroubleshootingClick: onPermissionsTroubleshootingClick, errorBarProps: errorBarProps })),
         React.createElement(Stack, { grow: true, horizontal: !mobileWithPreview, horizontalAlign: mobileWithPreview ? 'stretch' : 'center', verticalAlign: "center", tokens: mobileWithPreview ? configurationStackTokensMobile : configurationStackTokensDesktop },
             mobileWithPreview && (React.createElement(Stack.Item, null,
                 title,