@azure/communication-react 1.7.1-alpha-202309010013 → 1.8.0-alpha-202309020012

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

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

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

@@ -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,0BAA0B,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\n// GENERATED FILE. DO NOT EDIT MANUALLY.\n\nmodule.exports = '1.7.1-alpha-202309010013';\n"]}
+{"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,0BAA0B,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\n// GENERATED FILE. DO NOT EDIT MANUALLY.\n\nmodule.exports = '1.8.0-alpha-202309020012';\n"]}

package/dist/dist-esm/calling-stateful-client/src/CallClientState.d.ts

@@ -190,7 +190,7 @@ export interface LocalVideoStreamVideoEffectsState {
 /**
  * State only version of Optimal Video Count Feature {@link @azure/communication-calling#OptimalVideoCountCallFeature}.
  *
- * @beta
+ * @public
  */
 export interface OptimalVideoCountFeatureState {
     /**

package/dist/dist-esm/calling-stateful-client/src/CallClientState.js.map

@@ -1 +1 @@
-{"version":3,"file":"CallClientState.js","sourceRoot":"","sources":["../../../../../calling-stateful-client/src/CallClientState.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAwrBlC;;;;GAIG;AACH,MAAM,OAAO,SAAU,SAAQ,KAAK;IAclC,YAAY,MAAuB,EAAE,UAAiB,EAAE,SAAgB;QACtE,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC;QACrB,IAAI,CAAC,UAAU,GAAG,UAAU,CAAC;QAC7B,8EAA8E;QAC9E,IAAI,CAAC,SAAS,GAAG,SAAS,aAAT,SAAS,cAAT,SAAS,GAAI,IAAI,IAAI,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;QACnD,IAAI,CAAC,IAAI,GAAG,WAAW,CAAC;QACxB,IAAI,CAAC,OAAO,GAAG,GAAG,IAAI,CAAC,MAAM,KAAK,IAAI,CAAC,UAAU,CAAC,OAAO,EAAE,CAAC;IAC9D,CAAC;CACF","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport {\n  AudioDeviceInfo,\n  CallDirection,\n  CallEndReason,\n  CallerInfo,\n  CallState as CallStatus,\n  DeviceAccess,\n  DominantSpeakersInfo,\n  LatestMediaDiagnostics,\n  LatestNetworkDiagnostics,\n  MediaStreamType,\n  RemoteParticipantState as RemoteParticipantStatus,\n  ScalingMode,\n  VideoDeviceInfo\n} from '@azure/communication-calling';\n/* @conditional-compile-remove(capabilities) */\nimport { CapabilitiesChangeInfo, ParticipantCapabilities } from '@azure/communication-calling';\n/* @conditional-compile-remove(close-captions) */\nimport { CaptionsResultType } from '@azure/communication-calling';\n/* @conditional-compile-remove(video-background-effects) */\nimport { VideoEffectName } from '@azure/communication-calling';\n/* @conditional-compile-remove(teams-identity-support) */\nimport { CallKind } from '@azure/communication-calling';\n/* @conditional-compile-remove(unsupported-browser) */\nimport { EnvironmentInfo } from '@azure/communication-calling';\n/* @conditional-compile-remove(rooms) */\nimport { ParticipantRole } from '@azure/communication-calling';\nimport {\n  CommunicationUserKind,\n  MicrosoftTeamsUserKind,\n  PhoneNumberKind,\n  UnknownIdentifierKind,\n  CommunicationIdentifierKind\n} from '@azure/communication-common';\n/* @conditional-compile-remove(communication-common-beta-v3) */\nimport { MicrosoftBotKind } from '@azure/communication-common';\n\n/**\n * State only version of {@link @azure/communication-calling#CallAgent} except calls is moved to be a child directly of\n * {@link CallClientState} and not included here. The reason to have CallAgent's state proxied is to provide access to\n * displayName. We don't flatten CallAgent.displayName and put it in CallClientState because it would be ambiguious that\n * displayName is actually reliant on the creation/existence of CallAgent to be available.\n *\n * @public\n */\nexport interface CallAgentState {\n  /**\n   * Proxy of {@link @azure/communication-calling#CallAgent.displayName}.\n   */\n  displayName?: string;\n}\n\n/* @conditional-compile-remove(close-captions) */\n/**\n * @beta\n */\nexport interface CaptionsInfo {\n  /**\n   * The state in which this caption data can be classified.\n   */\n  resultType: CaptionsResultType;\n  /**\n   * The information of the call participant who spoke the captioned text.\n   */\n  speaker: CallerInfo;\n  /**\n   * The language that the spoken words were interpretted as. Corresponds to the language specified in startCaptions / setSpokenLanguage.\n   */\n  spokenLanguage: string;\n  /**\n   * The caption text.\n   */\n  captionText: string;\n  /**\n   * Timestamp of when the captioned words were initially spoken.\n   */\n  timestamp: Date;\n  /**\n   * The language that the captions are presented in. Corresponds to the captionLanguage specified in startCaptions / setCaptionLanguage.\n   */\n  captionLanguage?: string;\n  /**\n   * The original spoken caption text prior to translating to subtitle language\n   */\n  spokenText?: string;\n}\n\n/* @conditional-compile-remove(close-captions) */\n/**\n * @beta\n */\nexport interface CaptionsCallFeatureState {\n  /**\n   * supported spoken languages\n   */\n  supportedSpokenLanguages: string[];\n  /**\n   * array of received captions\n   */\n  captions: CaptionsInfo[];\n  /**\n   * whether captions is on/off\n   */\n  isCaptionsFeatureActive: boolean;\n  /**\n   * whether start captions button is clicked or now\n   */\n  startCaptionsInProgress: boolean;\n  /**\n   * supported caption languages\n   */\n  supportedCaptionLanguages: string[];\n  /**\n   * current spoken language\n   */\n  currentSpokenLanguage: string;\n  /**\n   * current caption language\n   */\n  currentCaptionLanguage: string;\n}\n\n/**\n * State only version of {@link @azure/communication-calling#TranscriptionCallFeature}. {@link StatefulCallClient} will\n * automatically listen for transcription state of the call and update the state exposed by {@link StatefulCallClient}\n * accordingly.\n *\n * @public\n */\nexport interface TranscriptionCallFeatureState {\n  /**\n   * Proxy of {@link @azure/communication-calling#TranscriptionCallFeature.isTranscriptionActive}.\n   */\n  isTranscriptionActive: boolean;\n}\n\n/* @conditional-compile-remove(capabilities) */\n/**\n * State only version of {@link @azure/communication-calling#CapabilitiesFeature}\n *\n * @beta\n */\nexport interface CapabilitiesFeatureState {\n  /**\n   * Proxy of {@link @azure/communication-calling#CapabilitiesFeature.capabilities}.\n   */\n  capabilities: ParticipantCapabilities;\n  /**\n   * Proxy of the latest {@link @azure/communication-calling#CapabilitiesChangeInfo}\n   */\n  latestCapabilitiesChangeInfo: CapabilitiesChangeInfo;\n}\n\n/**\n * State only version of {@link @azure/communication-calling#RecordingCallFeature}. {@link StatefulCallClient} will\n * automatically listen for recording state of the call and update the state exposed by {@link StatefulCallClient} accordingly.\n *\n * @public\n */\nexport interface RecordingCallFeatureState {\n  /**\n   * Proxy of {@link @azure/communication-calling#RecordingCallFeature.isRecordingActive}.\n   */\n  isRecordingActive: boolean;\n}\n\n/* @conditional-compile-remove(raise-hand) */\n/**\n * State only version of {@link @azure/communication-calling#RaiseHandCallFeature}. {@link StatefulCallClient} will\n * automatically listen for raised hands on the call and update the state exposed by {@link StatefulCallClient} accordingly.\n *\n * @public\n */\nexport interface RaiseHandCallFeatureState {\n  /**\n   * Proxy of {@link @azure/communication-calling#RaiseHandCallFeature.raisedHands}.\n   */\n  raisedHands: RaisedHandState[];\n  /**\n   * Contains information for local participant from list {@link @azure/communication-calling#RaiseHandCallFeature.raisedHands}.\n   */\n  localParticipantRaisedHand?: RaisedHandState;\n}\n\n/* @conditional-compile-remove(raise-hand) */\n/**\n * Raised hand state with order\n *\n * @public\n */\nexport type RaisedHandState = {\n  raisedHandOrderPosition: number;\n};\n\n/**\n * State only version of {@link @azure/communication-calling#LocalVideoStream}.\n *\n * @public\n */\nexport interface LocalVideoStreamState {\n  /**\n   * Proxy of {@link @azure/communication-calling#LocalVideoStream.source}.\n   */\n  source: VideoDeviceInfo;\n  /**\n   * Proxy of {@link @azure/communication-calling#LocalVideoStream.mediaStreamType}.\n   */\n  mediaStreamType: MediaStreamType;\n  /**\n   * {@link VideoStreamRendererView} that is managed by createView/disposeView in {@link StatefulCallClient}\n   * API. This can be undefined if the stream has not yet been rendered and defined after createView creates the view.\n   */\n  view?: VideoStreamRendererViewState;\n  /* @conditional-compile-remove(video-background-effects) */\n  /**\n   * Stores the state of the video effects.\n   * @beta\n   */\n  videoEffects?: LocalVideoStreamVideoEffectsState;\n}\n\n/* @conditional-compile-remove(video-background-effects) */\n/**\n * State only version of a LocalVideoStream's {@link @azure/communication-calling#VideoEffectsFeature}.\n *\n * @beta\n */\nexport interface LocalVideoStreamVideoEffectsState {\n  /**\n   * List of effects if any are active.\n   */\n  activeEffects?: VideoEffectName[];\n}\n\n/* @conditional-compile-remove(optimal-video-count) */\n/**\n * State only version of Optimal Video Count Feature {@link @azure/communication-calling#OptimalVideoCountCallFeature}.\n *\n * @beta\n */\nexport interface OptimalVideoCountFeatureState {\n  /**\n   * State of the current optimal video count.\n   */\n  maxRemoteVideoStreams: number;\n}\n\n/**\n * State only version of {@link @azure/communication-calling#RemoteVideoStream}.\n *\n * @public\n */\nexport interface RemoteVideoStreamState {\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteVideoStream.id}.\n   */\n  id: number;\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteVideoStream.mediaStreamType}.\n   */\n  mediaStreamType: MediaStreamType;\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteVideoStream.isAvailable}.\n   */\n  isAvailable: boolean;\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteVideoStream.isReceiving}.\n   * @beta\n   */\n  /* @conditional-compile-remove(video-stream-is-receiving-flag) */\n  isReceiving: boolean;\n  /**\n   * {@link VideoStreamRendererView} that is managed by createView/disposeView in {@link StatefulCallClient}\n   * API. This can be undefined if the stream has not yet been rendered and defined after createView creates the view.\n   */\n  view?: VideoStreamRendererViewState;\n  /* @conditional-compile-remove(pinned-participants) */\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteVideoStream.size}.\n   */\n  streamSize?: { width: number; height: number };\n}\n\n/**\n * State only version of {@link @azure/communication-calling#VideoStreamRendererView}. This property is added to the state exposed\n * by {@link StatefulCallClient} by {@link StatefulCallClient.createView} and removed by {@link StatefulCallClient.disposeView}.\n *\n * @public\n */\nexport interface VideoStreamRendererViewState {\n  /**\n   * Proxy of {@link @azure/communication-calling#VideoStreamRendererView.scalingMode}.\n   */\n  scalingMode: ScalingMode;\n  /**\n   * Proxy of {@link @azure/communication-calling#VideoStreamRendererView.isMirrored}.\n   */\n  isMirrored: boolean;\n  /**\n   * Proxy of {@link @azure/communication-calling#VideoStreamRendererView.target}.\n   */\n  target: HTMLElement;\n}\n\n/**\n * State only version of {@link @azure/communication-calling#RemoteParticipant}. {@link StatefulCallClient} will\n * automatically retrieve RemoteParticipants and add their state to the state exposed by {@link StatefulCallClient}.\n *\n * @public\n */\nexport interface RemoteParticipantState {\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteParticipant.identifier}.\n   */\n  identifier:\n    | CommunicationUserKind\n    | PhoneNumberKind\n    | MicrosoftTeamsUserKind\n    | UnknownIdentifierKind\n    | /* @conditional-compile-remove(communication-common-beta-v3) */ MicrosoftBotKind;\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteParticipant.displayName}.\n   */\n  displayName?: string;\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteParticipant.state}.\n   */\n  state: RemoteParticipantStatus;\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteParticipant.callEndReason}.\n   */\n  callEndReason?: CallEndReason;\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteParticipant.videoStreams} as an object with\n   * {@link RemoteVideoStream} fields keyed by {@link @azure/communication-calling#RemoteVideoStream.id}.\n   */\n  videoStreams: { [key: number]: RemoteVideoStreamState };\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteParticipant.isMuted}.\n   */\n  isMuted: boolean;\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteParticipant.isSpeaking}.\n   */\n  isSpeaking: boolean;\n  /* @conditional-compile-remove(rooms) */\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteParticipant.role}.\n   */\n  role?: ParticipantRole;\n\n  /* @conditional-compile-remove(raise-hand) */\n  /**\n   * Proxy of {@link @azure/communication-calling#Call.RaisedHand.raisedHands}.\n   */\n  raisedHand?: RaisedHandState;\n}\n\n/**\n * State only version of {@link @azure/communication-calling#Call}. {@link StatefulCallClient} will automatically\n * retrieve Call's state and add it to the state exposed by {@link StatefulCallClient}.\n *\n * @public\n */\nexport interface CallState {\n  /**\n   * Proxy of {@link @azure/communication-calling#Call.id}.\n   */\n  id: string;\n  /* @conditional-compile-remove(teams-identity-support) */\n  /**\n   * Type of the call.\n   */\n  kind: CallKind;\n  /**\n   * Proxy of {@link @azure/communication-calling#Call.callerInfo}.\n   */\n  callerInfo: CallerInfo;\n  /**\n   * Proxy of {@link @azure/communication-calling#Call.state}.\n   */\n  state: CallStatus;\n  /**\n   * Proxy of {@link @azure/communication-calling#Call.callEndReason}.\n   */\n  callEndReason?: CallEndReason;\n  /**\n   * Proxy of {@link @azure/communication-calling#Call.direction}.\n   */\n  direction: CallDirection;\n  /**\n   * Proxy of {@link @azure/communication-calling#Call.isMuted}.\n   */\n  isMuted: boolean;\n  /**\n   * Proxy of {@link @azure/communication-calling#Call.isScreenSharingOn}.\n   */\n  isScreenSharingOn: boolean;\n  /**\n   * Proxy of {@link @azure/communication-calling#DominantSpeakersInfo }.\n   */\n  dominantSpeakers?: DominantSpeakersInfo;\n  /**\n   * Proxy of {@link @azure/communication-calling#Call.localVideoStreams}.\n   */\n  localVideoStreams: LocalVideoStreamState[];\n  /**\n   * Proxy of {@link @azure/communication-calling#Call.remoteParticipants}.\n   * Object with {@link RemoteParticipant} fields keyed by flattened {@link RemoteParticipantState.identifier}.\n   * To obtain a flattened {@link RemoteParticipantState.identifier}, use\n   * {@link @azure/communication-react#toFlatCommunicationIdentifier}.\n   */\n  remoteParticipants: { [keys: string]: RemoteParticipantState };\n  /**\n   * Stores remote participants that have left the call so that the callEndReason could be retrieved.\n   * Object with {@link RemoteParticipant} fields keyed by flattened {@link RemoteParticipantState.identifier}.\n   * To obtain a flattened {@link RemoteParticipantState.identifier}, use\n   * {@link @azure/communication-react#toFlatCommunicationIdentifier}.\n   */\n  remoteParticipantsEnded: { [keys: string]: RemoteParticipantState };\n  /**\n   * Proxy of {@link @azure/communication-calling#TranscriptionCallFeature}.\n   */\n  transcription: TranscriptionCallFeatureState;\n  /* @conditional-compile-remove(close-captions) */\n  /**\n   * Proxy of {@link @azure/communication-calling#TranscriptionCallFeature}.\n   */\n  captionsFeature: CaptionsCallFeatureState;\n  /* @conditional-compile-remove(optimal-video-count) */\n  /**\n   * Proxy of {@link @azure/communication-calling#OptimalVideoCountCallFeature}.\n   */\n  optimalVideoCount: OptimalVideoCountFeatureState;\n  /**\n   * Proxy of {@link @azure/communication-calling#RecordingCallFeature}.\n   */\n  recording: RecordingCallFeatureState;\n  /* @conditional-compile-remove(raise-hand) */\n  /**\n   * Proxy of {@link @azure/communication-calling#RaiseHandCallFeature}.\n   */\n  raiseHand: RaiseHandCallFeatureState;\n  /**\n   * Stores the currently active screenshare participant's key. If there is no screenshare active, then this will be\n   * undefined. You can use this key to access the remoteParticipant data in {@link CallState.remoteParticipants} object.\n   *\n   * Note this only applies to ScreenShare in RemoteParticipant. A local ScreenShare being active will not affect this\n   * property.\n   *\n   * This property is added by the stateful layer and is not a proxy of SDK state\n   */\n  screenShareRemoteParticipant?: string;\n  /**\n   * Stores the local date when the call started on the client. This property is added by the stateful layer and is not\n   * a proxy of SDK state.\n   */\n  startTime: Date;\n  /**\n   * Stores the local date when the call ended on the client. This property is added by the stateful layer and is not\n   * a proxy of SDK state.\n   */\n  endTime: Date | undefined;\n\n  /**\n   * Stores the latest call diagnostics.\n   */\n  diagnostics: DiagnosticsCallFeatureState;\n  /* @conditional-compile-remove(rooms) */\n  /**\n   * Proxy of {@link @azure/communication-calling#Call.role}.\n   */\n  role?: ParticipantRole;\n\n  /* @conditional-compile-remove(total-participant-count) */\n  /**\n   * Proxy of {@link @azure/communication-calling#Call.totalParticipantCount}.\n   */\n  totalParticipantCount?: number;\n  /* @conditional-compile-remove(call-transfer) */\n  /**\n   * Transfer state of call\n   */\n  transfer: TransferFeatureState;\n  /* @conditional-compile-remove(capabilities) */\n  /**\n   * Proxy of {@link @azure/communication-calling#CapabilitiesFeature}.\n   */\n  capabilitiesFeature?: CapabilitiesFeatureState;\n}\n\n/* @conditional-compile-remove(call-transfer) */\n/**\n * Transfer feature state\n *\n * @beta\n */\nexport interface TransferFeatureState {\n  /**\n   * Accepted transfer requests\n   */\n  acceptedTransfers: { [key: string]: AcceptedTransfer };\n}\n\n/* @conditional-compile-remove(call-transfer) */\n/**\n * Transfer feature state\n *\n * @beta\n */\nexport interface AcceptedTransfer {\n  /**\n   * Stores call id of accepted transfer\n   */\n  callId: string;\n  /**\n   * Stores timestamp when transfer was accepted\n   */\n  timestamp: Date;\n}\n\n/**\n * State only version of {@link @azure/communication-calling#IncomingCall}. {@link StatefulCallClient} will\n * automatically detect incoming calls and add their state to the state exposed by {@link StatefulCallClient}.\n *\n * @public\n */\nexport interface IncomingCallState {\n  /**\n   * Proxy of {@link @azure/communication-calling#IncomingCall.id}.\n   */\n  id: string;\n  /**\n   * Proxy of {@link @azure/communication-calling#IncomingCall.callerInfo}.\n   */\n  callerInfo: CallerInfo;\n  /**\n   * Set to the state returned by 'callEnded' event on {@link @azure/communication-calling#IncomingCall} when received.\n   * This property is added by the stateful layer and is not a proxy of SDK state.\n   */\n  callEndReason?: CallEndReason;\n  /**\n   * Stores the local date when the call started on the client. This property is added by the stateful layer and is not\n   * a proxy of SDK state.\n   */\n  startTime: Date;\n  /**\n   * Stores the local date when the call ended on the client. This property is added by the stateful layer and is not a\n   * proxy of SDK state. It is undefined if the call is not ended yet.\n   */\n  endTime?: Date;\n}\n\n/**\n * This type is meant to encapsulate all the state inside {@link @azure/communication-calling#DeviceManager}. For\n * optional parameters they may not be available until permission is granted by the user. The cameras, microphones,\n * speakers, and deviceAccess states will be empty until the corresponding\n * {@link @azure/communication-calling#DeviceManager}'s getCameras, getMicrophones, getSpeakers, and askDevicePermission\n * APIs are called and completed.\n *\n * @public\n */\nexport type DeviceManagerState = {\n  /**\n   * Proxy of {@link @azure/communication-calling#DeviceManager.isSpeakerSelectionAvailable}.\n   */\n  isSpeakerSelectionAvailable: boolean;\n  /**\n   * Proxy of {@link @azure/communication-calling#DeviceManager.selectedMicrophone}.\n   */\n  selectedMicrophone?: AudioDeviceInfo;\n  /**\n   * Proxy of {@link @azure/communication-calling#DeviceManager.selectedSpeaker}.\n   */\n  selectedSpeaker?: AudioDeviceInfo;\n  /**\n   * Stores the selected camera device info. This is added by the stateful layer and does not exist in the Calling SDK.\n   * It is meant as a convenience to the developer. It must be explicitly set before it has any value and does not\n   * persist across instances of the {@link StatefulCallClient}. The developer controls entirely what this value holds\n   * at any time.\n   */\n  selectedCamera?: VideoDeviceInfo;\n  /**\n   * Stores any cameras data returned from {@link @azure/communication-calling#DeviceManager.getCameras}.\n   */\n  cameras: VideoDeviceInfo[];\n  /**\n   * Stores any microphones data returned from {@link @azure/communication-calling#DeviceManager.getMicrophones}.\n   */\n  microphones: AudioDeviceInfo[];\n  /**\n   * Stores any speakers data returned from {@link @azure/communication-calling#DeviceManager.getSpeakers}.\n   */\n  speakers: AudioDeviceInfo[];\n  /**\n   * Stores deviceAccess data returned from {@link @azure/communication-calling#DeviceManager.askDevicePermission}.\n   */\n  deviceAccess?: DeviceAccess;\n  /**\n   * Stores created views that are not associated with any CallState (when {@link StatefulCallClient.createView} is\n   * called with undefined callId, undefined participantId, and defined LocalVideoStream).\n   *\n   * The values in this array are generated internally when {@link StatefulCallClient.createView} is called and are\n   * considered immutable.\n   */\n  unparentedViews: LocalVideoStreamState[];\n};\n\n/**\n * Container for all of the state data proxied by {@link StatefulCallClient}. The calls, callsEnded, incomingCalls, and\n * incomingCallsEnded states will be automatically provided if a callAgent has been created. The deviceManager will be\n * empty initially until populated see {@link DeviceManagerState}. The userId state is provided as a convenience for the\n * developer and is completely controled and set by the developer.\n *\n * @public\n */\nexport interface CallClientState {\n  /**\n   * Proxy of {@link @azure/communication-calling#CallAgent.calls} as an object with CallState {@link CallState} fields.\n   * It is keyed by {@link @azure/communication-calling#Call.id}. Please note that\n   * {@link @azure/communication-calling#Call.id} could change. You should not cache the id itself but the entire\n   * {@link @azure/communication-calling#Call} and then use the id contained to look up data in this map.\n   */\n  calls: { [key: string]: CallState };\n  /**\n   * Calls that have ended are stored here so the callEndReason could be checked.\n   * It is an object with {@link @azure/communication-calling#Call.id} keys and {@link CallState} values.\n   *\n   * Only {@link MAX_CALL_HISTORY_LENGTH} Calls are kept in the history. Oldest calls are evicted if required.\n   */\n  callsEnded: { [key: string]: CallState };\n  /**\n   * Proxy of {@link @azure/communication-calling#IncomingCall} as an object with {@link IncomingCall} fields.\n   * It is keyed by {@link @azure/communication-calling#IncomingCall.id}.\n   */\n  incomingCalls: { [key: string]: IncomingCallState };\n  /**\n   * Incoming Calls that have ended are stored here so the callEndReason could be checked.\n   * It is an as an object with {@link @azure/communication-calling#Call.id} keys and {@link IncomingCall} values.\n   *\n   * Only {@link MAX_CALL_HISTORY_LENGTH} Calls are kept in the history. Oldest calls are evicted if required.\n   */\n  incomingCallsEnded: { [key: string]: IncomingCallState };\n  /**\n   * Proxy of {@link @azure/communication-calling#DeviceManager}. Please review {@link DeviceManagerState}.\n   */\n  deviceManager: DeviceManagerState;\n  /**\n   * Proxy of {@link @azure/communication-calling#CallAgent}. Please review {@link CallAgentState}.\n   */\n  callAgent?: CallAgentState;\n  /**\n   * Stores a userId. This is not used by the {@link StatefulCallClient} and is provided here as a convenience for the\n   * developer for easier access to userId. Must be passed in at initialization of the {@link StatefulCallClient}.\n   * Completely controlled by the developer.\n   */\n  userId: CommunicationIdentifierKind;\n  /**\n   * Stores the latest error for each API method.\n   *\n   * See documentation of {@Link CallErrors} for details.\n   */\n  latestErrors: CallErrors;\n  /* @conditional-compile-remove(PSTN-calls) */\n  /**\n   * A phone number in E.164 format that will be used to represent callers identity.\n   * For example, using the alternateCallerId to add a participant using PSTN, this number will\n   * be used as the caller id in the PSTN call.\n   */\n  alternateCallerId?: string;\n  /* @conditional-compile-remove(unsupported-browser) */\n  /**\n   * state to track the environment that the stateful client was made in is supported\n   */\n  environmentInfo?: EnvironmentInfo;\n}\n\n/**\n * Errors teed from API calls to the Calling SDK.\n *\n * Each property in the object stores the latest error for a particular SDK API method.\n *\n * Errors from this object can be cleared using the {@link newClearCallErrorsModifier}.\n * Additionally, errors are automatically cleared when:\n * - The state is cleared.\n * - Subsequent calls to related API methods succeed.\n * See documentation of individual stateful client methods for details on when errors may be automatically cleared.\n *\n * @public\n */\nexport type CallErrors = {\n  [target in CallErrorTarget]: CallError;\n};\n\n/**\n * Error thrown from failed stateful API methods.\n *\n * @public\n */\nexport class CallError extends Error {\n  /**\n   * The API method target that failed.\n   */\n  public target: CallErrorTarget;\n  /**\n   * Error thrown by the failed SDK method.\n   */\n  public innerError: Error;\n  /**\n   * Timestamp added to the error by the stateful layer.\n   */\n  public timestamp: Date;\n\n  constructor(target: CallErrorTarget, innerError: Error, timestamp?: Date) {\n    super();\n    this.target = target;\n    this.innerError = innerError;\n    // Testing note: It is easier to mock Date::now() than the Date() constructor.\n    this.timestamp = timestamp ?? new Date(Date.now());\n    this.name = 'CallError';\n    this.message = `${this.target}: ${this.innerError.message}`;\n  }\n}\n\n/**\n * String literal type for all permissible keys in {@Link CallErrors}.\n *\n * @public\n */\nexport type CallErrorTarget =\n  | 'Call.addParticipant'\n  | 'Call.dispose'\n  | 'Call.feature'\n  | 'Call.hangUp'\n  | 'Call.hold'\n  | 'Call.mute'\n  | 'Call.muteIncomingAudio'\n  | 'Call.off'\n  | 'Call.on'\n  | 'Call.removeParticipant'\n  | 'Call.resume'\n  | 'Call.sendDtmf'\n  | 'Call.startAudio'\n  | 'Call.startScreenSharing'\n  | 'Call.startVideo'\n  | 'Call.stopScreenSharing'\n  | 'Call.stopAudio'\n  | 'Call.stopVideo'\n  | 'Call.unmute'\n  | 'Call.unmuteIncomingAudio'\n  | 'CallAgent.dispose'\n  | 'CallAgent.feature'\n  | 'CallAgent.join'\n  | 'CallAgent.off'\n  | 'CallAgent.on'\n  | 'CallAgent.startCall'\n  | 'CallClient.createCallAgent'\n  | 'CallClient.createTeamsCallAgent'\n  | 'CallClient.feature'\n  | 'CallClient.getDeviceManager'\n  | /* @conditional-compile-remove(calling-beta-sdk) */ 'CallClient.getEnvironmentInfo'\n  | 'DeviceManager.askDevicePermission'\n  | 'DeviceManager.getCameras'\n  | 'DeviceManager.getMicrophones'\n  | 'DeviceManager.getSpeakers'\n  | 'DeviceManager.off'\n  | 'DeviceManager.on'\n  | 'DeviceManager.selectMicrophone'\n  | 'DeviceManager.selectSpeaker'\n  | 'IncomingCall.accept'\n  | 'IncomingCall.reject'\n  | /* @conditional-compile-remove(calling-beta-sdk) */ /* @conditional-compile-remove(teams-identity-support) */ 'TeamsCall.addParticipant'\n  | /* @conditional-compile-remove(video-background-effects) */ 'VideoEffectsFeature.startEffects'\n  | /* @conditional-compile-remove(calling-beta-sdk) */ 'CallAgent.handlePushNotification'\n  | /* @conditional-compile-remove(calling-beta-sdk) */ 'Call.admit'\n  | /* @conditional-compile-remove(calling-beta-sdk) */ 'Call.rejectParticipant'\n  | /* @conditional-compile-remove(calling-beta-sdk) */ 'Call.admitAll';\n\n/**\n * State only proxy for {@link @azure/communication-calling#DiagnosticsCallFeature}.\n *\n * @public\n */\nexport interface DiagnosticsCallFeatureState {\n  /**\n   * Stores diagnostics related to network conditions.\n   */\n  network: NetworkDiagnosticsState;\n\n  /**\n   * Stores diagnostics related to media quality.\n   */\n  media: MediaDiagnosticsState;\n}\n\n/**\n * State only proxy for {@link @azure/communication-calling#NetworkDiagnostics}.\n *\n * @public\n */\nexport interface NetworkDiagnosticsState {\n  latest: LatestNetworkDiagnostics;\n}\n\n/**\n * State only proxy for {@link @azure/communication-calling#MediaDiagnostics}.\n *\n * @public\n */\nexport interface MediaDiagnosticsState {\n  latest: LatestMediaDiagnostics;\n}\n"]}
+{"version":3,"file":"CallClientState.js","sourceRoot":"","sources":["../../../../../calling-stateful-client/src/CallClientState.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAwrBlC;;;;GAIG;AACH,MAAM,OAAO,SAAU,SAAQ,KAAK;IAclC,YAAY,MAAuB,EAAE,UAAiB,EAAE,SAAgB;QACtE,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC;QACrB,IAAI,CAAC,UAAU,GAAG,UAAU,CAAC;QAC7B,8EAA8E;QAC9E,IAAI,CAAC,SAAS,GAAG,SAAS,aAAT,SAAS,cAAT,SAAS,GAAI,IAAI,IAAI,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;QACnD,IAAI,CAAC,IAAI,GAAG,WAAW,CAAC;QACxB,IAAI,CAAC,OAAO,GAAG,GAAG,IAAI,CAAC,MAAM,KAAK,IAAI,CAAC,UAAU,CAAC,OAAO,EAAE,CAAC;IAC9D,CAAC;CACF","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport {\n  AudioDeviceInfo,\n  CallDirection,\n  CallEndReason,\n  CallerInfo,\n  CallState as CallStatus,\n  DeviceAccess,\n  DominantSpeakersInfo,\n  LatestMediaDiagnostics,\n  LatestNetworkDiagnostics,\n  MediaStreamType,\n  RemoteParticipantState as RemoteParticipantStatus,\n  ScalingMode,\n  VideoDeviceInfo\n} from '@azure/communication-calling';\n/* @conditional-compile-remove(capabilities) */\nimport { CapabilitiesChangeInfo, ParticipantCapabilities } from '@azure/communication-calling';\n/* @conditional-compile-remove(close-captions) */\nimport { CaptionsResultType } from '@azure/communication-calling';\n/* @conditional-compile-remove(video-background-effects) */\nimport { VideoEffectName } from '@azure/communication-calling';\n/* @conditional-compile-remove(teams-identity-support) */\nimport { CallKind } from '@azure/communication-calling';\n/* @conditional-compile-remove(unsupported-browser) */\nimport { EnvironmentInfo } from '@azure/communication-calling';\n/* @conditional-compile-remove(rooms) */\nimport { ParticipantRole } from '@azure/communication-calling';\nimport {\n  CommunicationUserKind,\n  MicrosoftTeamsUserKind,\n  PhoneNumberKind,\n  UnknownIdentifierKind,\n  CommunicationIdentifierKind\n} from '@azure/communication-common';\n/* @conditional-compile-remove(communication-common-beta-v3) */\nimport { MicrosoftBotKind } from '@azure/communication-common';\n\n/**\n * State only version of {@link @azure/communication-calling#CallAgent} except calls is moved to be a child directly of\n * {@link CallClientState} and not included here. The reason to have CallAgent's state proxied is to provide access to\n * displayName. We don't flatten CallAgent.displayName and put it in CallClientState because it would be ambiguious that\n * displayName is actually reliant on the creation/existence of CallAgent to be available.\n *\n * @public\n */\nexport interface CallAgentState {\n  /**\n   * Proxy of {@link @azure/communication-calling#CallAgent.displayName}.\n   */\n  displayName?: string;\n}\n\n/* @conditional-compile-remove(close-captions) */\n/**\n * @beta\n */\nexport interface CaptionsInfo {\n  /**\n   * The state in which this caption data can be classified.\n   */\n  resultType: CaptionsResultType;\n  /**\n   * The information of the call participant who spoke the captioned text.\n   */\n  speaker: CallerInfo;\n  /**\n   * The language that the spoken words were interpretted as. Corresponds to the language specified in startCaptions / setSpokenLanguage.\n   */\n  spokenLanguage: string;\n  /**\n   * The caption text.\n   */\n  captionText: string;\n  /**\n   * Timestamp of when the captioned words were initially spoken.\n   */\n  timestamp: Date;\n  /**\n   * The language that the captions are presented in. Corresponds to the captionLanguage specified in startCaptions / setCaptionLanguage.\n   */\n  captionLanguage?: string;\n  /**\n   * The original spoken caption text prior to translating to subtitle language\n   */\n  spokenText?: string;\n}\n\n/* @conditional-compile-remove(close-captions) */\n/**\n * @beta\n */\nexport interface CaptionsCallFeatureState {\n  /**\n   * supported spoken languages\n   */\n  supportedSpokenLanguages: string[];\n  /**\n   * array of received captions\n   */\n  captions: CaptionsInfo[];\n  /**\n   * whether captions is on/off\n   */\n  isCaptionsFeatureActive: boolean;\n  /**\n   * whether start captions button is clicked or now\n   */\n  startCaptionsInProgress: boolean;\n  /**\n   * supported caption languages\n   */\n  supportedCaptionLanguages: string[];\n  /**\n   * current spoken language\n   */\n  currentSpokenLanguage: string;\n  /**\n   * current caption language\n   */\n  currentCaptionLanguage: string;\n}\n\n/**\n * State only version of {@link @azure/communication-calling#TranscriptionCallFeature}. {@link StatefulCallClient} will\n * automatically listen for transcription state of the call and update the state exposed by {@link StatefulCallClient}\n * accordingly.\n *\n * @public\n */\nexport interface TranscriptionCallFeatureState {\n  /**\n   * Proxy of {@link @azure/communication-calling#TranscriptionCallFeature.isTranscriptionActive}.\n   */\n  isTranscriptionActive: boolean;\n}\n\n/* @conditional-compile-remove(capabilities) */\n/**\n * State only version of {@link @azure/communication-calling#CapabilitiesFeature}\n *\n * @beta\n */\nexport interface CapabilitiesFeatureState {\n  /**\n   * Proxy of {@link @azure/communication-calling#CapabilitiesFeature.capabilities}.\n   */\n  capabilities: ParticipantCapabilities;\n  /**\n   * Proxy of the latest {@link @azure/communication-calling#CapabilitiesChangeInfo}\n   */\n  latestCapabilitiesChangeInfo: CapabilitiesChangeInfo;\n}\n\n/**\n * State only version of {@link @azure/communication-calling#RecordingCallFeature}. {@link StatefulCallClient} will\n * automatically listen for recording state of the call and update the state exposed by {@link StatefulCallClient} accordingly.\n *\n * @public\n */\nexport interface RecordingCallFeatureState {\n  /**\n   * Proxy of {@link @azure/communication-calling#RecordingCallFeature.isRecordingActive}.\n   */\n  isRecordingActive: boolean;\n}\n\n/* @conditional-compile-remove(raise-hand) */\n/**\n * State only version of {@link @azure/communication-calling#RaiseHandCallFeature}. {@link StatefulCallClient} will\n * automatically listen for raised hands on the call and update the state exposed by {@link StatefulCallClient} accordingly.\n *\n * @public\n */\nexport interface RaiseHandCallFeatureState {\n  /**\n   * Proxy of {@link @azure/communication-calling#RaiseHandCallFeature.raisedHands}.\n   */\n  raisedHands: RaisedHandState[];\n  /**\n   * Contains information for local participant from list {@link @azure/communication-calling#RaiseHandCallFeature.raisedHands}.\n   */\n  localParticipantRaisedHand?: RaisedHandState;\n}\n\n/* @conditional-compile-remove(raise-hand) */\n/**\n * Raised hand state with order\n *\n * @public\n */\nexport type RaisedHandState = {\n  raisedHandOrderPosition: number;\n};\n\n/**\n * State only version of {@link @azure/communication-calling#LocalVideoStream}.\n *\n * @public\n */\nexport interface LocalVideoStreamState {\n  /**\n   * Proxy of {@link @azure/communication-calling#LocalVideoStream.source}.\n   */\n  source: VideoDeviceInfo;\n  /**\n   * Proxy of {@link @azure/communication-calling#LocalVideoStream.mediaStreamType}.\n   */\n  mediaStreamType: MediaStreamType;\n  /**\n   * {@link VideoStreamRendererView} that is managed by createView/disposeView in {@link StatefulCallClient}\n   * API. This can be undefined if the stream has not yet been rendered and defined after createView creates the view.\n   */\n  view?: VideoStreamRendererViewState;\n  /* @conditional-compile-remove(video-background-effects) */\n  /**\n   * Stores the state of the video effects.\n   * @beta\n   */\n  videoEffects?: LocalVideoStreamVideoEffectsState;\n}\n\n/* @conditional-compile-remove(video-background-effects) */\n/**\n * State only version of a LocalVideoStream's {@link @azure/communication-calling#VideoEffectsFeature}.\n *\n * @beta\n */\nexport interface LocalVideoStreamVideoEffectsState {\n  /**\n   * List of effects if any are active.\n   */\n  activeEffects?: VideoEffectName[];\n}\n\n/* @conditional-compile-remove(optimal-video-count) */\n/**\n * State only version of Optimal Video Count Feature {@link @azure/communication-calling#OptimalVideoCountCallFeature}.\n *\n * @public\n */\nexport interface OptimalVideoCountFeatureState {\n  /**\n   * State of the current optimal video count.\n   */\n  maxRemoteVideoStreams: number;\n}\n\n/**\n * State only version of {@link @azure/communication-calling#RemoteVideoStream}.\n *\n * @public\n */\nexport interface RemoteVideoStreamState {\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteVideoStream.id}.\n   */\n  id: number;\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteVideoStream.mediaStreamType}.\n   */\n  mediaStreamType: MediaStreamType;\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteVideoStream.isAvailable}.\n   */\n  isAvailable: boolean;\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteVideoStream.isReceiving}.\n   * @beta\n   */\n  /* @conditional-compile-remove(video-stream-is-receiving-flag) */\n  isReceiving: boolean;\n  /**\n   * {@link VideoStreamRendererView} that is managed by createView/disposeView in {@link StatefulCallClient}\n   * API. This can be undefined if the stream has not yet been rendered and defined after createView creates the view.\n   */\n  view?: VideoStreamRendererViewState;\n  /* @conditional-compile-remove(pinned-participants) */\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteVideoStream.size}.\n   */\n  streamSize?: { width: number; height: number };\n}\n\n/**\n * State only version of {@link @azure/communication-calling#VideoStreamRendererView}. This property is added to the state exposed\n * by {@link StatefulCallClient} by {@link StatefulCallClient.createView} and removed by {@link StatefulCallClient.disposeView}.\n *\n * @public\n */\nexport interface VideoStreamRendererViewState {\n  /**\n   * Proxy of {@link @azure/communication-calling#VideoStreamRendererView.scalingMode}.\n   */\n  scalingMode: ScalingMode;\n  /**\n   * Proxy of {@link @azure/communication-calling#VideoStreamRendererView.isMirrored}.\n   */\n  isMirrored: boolean;\n  /**\n   * Proxy of {@link @azure/communication-calling#VideoStreamRendererView.target}.\n   */\n  target: HTMLElement;\n}\n\n/**\n * State only version of {@link @azure/communication-calling#RemoteParticipant}. {@link StatefulCallClient} will\n * automatically retrieve RemoteParticipants and add their state to the state exposed by {@link StatefulCallClient}.\n *\n * @public\n */\nexport interface RemoteParticipantState {\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteParticipant.identifier}.\n   */\n  identifier:\n    | CommunicationUserKind\n    | PhoneNumberKind\n    | MicrosoftTeamsUserKind\n    | UnknownIdentifierKind\n    | /* @conditional-compile-remove(communication-common-beta-v3) */ MicrosoftBotKind;\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteParticipant.displayName}.\n   */\n  displayName?: string;\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteParticipant.state}.\n   */\n  state: RemoteParticipantStatus;\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteParticipant.callEndReason}.\n   */\n  callEndReason?: CallEndReason;\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteParticipant.videoStreams} as an object with\n   * {@link RemoteVideoStream} fields keyed by {@link @azure/communication-calling#RemoteVideoStream.id}.\n   */\n  videoStreams: { [key: number]: RemoteVideoStreamState };\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteParticipant.isMuted}.\n   */\n  isMuted: boolean;\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteParticipant.isSpeaking}.\n   */\n  isSpeaking: boolean;\n  /* @conditional-compile-remove(rooms) */\n  /**\n   * Proxy of {@link @azure/communication-calling#RemoteParticipant.role}.\n   */\n  role?: ParticipantRole;\n\n  /* @conditional-compile-remove(raise-hand) */\n  /**\n   * Proxy of {@link @azure/communication-calling#Call.RaisedHand.raisedHands}.\n   */\n  raisedHand?: RaisedHandState;\n}\n\n/**\n * State only version of {@link @azure/communication-calling#Call}. {@link StatefulCallClient} will automatically\n * retrieve Call's state and add it to the state exposed by {@link StatefulCallClient}.\n *\n * @public\n */\nexport interface CallState {\n  /**\n   * Proxy of {@link @azure/communication-calling#Call.id}.\n   */\n  id: string;\n  /* @conditional-compile-remove(teams-identity-support) */\n  /**\n   * Type of the call.\n   */\n  kind: CallKind;\n  /**\n   * Proxy of {@link @azure/communication-calling#Call.callerInfo}.\n   */\n  callerInfo: CallerInfo;\n  /**\n   * Proxy of {@link @azure/communication-calling#Call.state}.\n   */\n  state: CallStatus;\n  /**\n   * Proxy of {@link @azure/communication-calling#Call.callEndReason}.\n   */\n  callEndReason?: CallEndReason;\n  /**\n   * Proxy of {@link @azure/communication-calling#Call.direction}.\n   */\n  direction: CallDirection;\n  /**\n   * Proxy of {@link @azure/communication-calling#Call.isMuted}.\n   */\n  isMuted: boolean;\n  /**\n   * Proxy of {@link @azure/communication-calling#Call.isScreenSharingOn}.\n   */\n  isScreenSharingOn: boolean;\n  /**\n   * Proxy of {@link @azure/communication-calling#DominantSpeakersInfo }.\n   */\n  dominantSpeakers?: DominantSpeakersInfo;\n  /**\n   * Proxy of {@link @azure/communication-calling#Call.localVideoStreams}.\n   */\n  localVideoStreams: LocalVideoStreamState[];\n  /**\n   * Proxy of {@link @azure/communication-calling#Call.remoteParticipants}.\n   * Object with {@link RemoteParticipant} fields keyed by flattened {@link RemoteParticipantState.identifier}.\n   * To obtain a flattened {@link RemoteParticipantState.identifier}, use\n   * {@link @azure/communication-react#toFlatCommunicationIdentifier}.\n   */\n  remoteParticipants: { [keys: string]: RemoteParticipantState };\n  /**\n   * Stores remote participants that have left the call so that the callEndReason could be retrieved.\n   * Object with {@link RemoteParticipant} fields keyed by flattened {@link RemoteParticipantState.identifier}.\n   * To obtain a flattened {@link RemoteParticipantState.identifier}, use\n   * {@link @azure/communication-react#toFlatCommunicationIdentifier}.\n   */\n  remoteParticipantsEnded: { [keys: string]: RemoteParticipantState };\n  /**\n   * Proxy of {@link @azure/communication-calling#TranscriptionCallFeature}.\n   */\n  transcription: TranscriptionCallFeatureState;\n  /* @conditional-compile-remove(close-captions) */\n  /**\n   * Proxy of {@link @azure/communication-calling#TranscriptionCallFeature}.\n   */\n  captionsFeature: CaptionsCallFeatureState;\n  /* @conditional-compile-remove(optimal-video-count) */\n  /**\n   * Proxy of {@link @azure/communication-calling#OptimalVideoCountCallFeature}.\n   */\n  optimalVideoCount: OptimalVideoCountFeatureState;\n  /**\n   * Proxy of {@link @azure/communication-calling#RecordingCallFeature}.\n   */\n  recording: RecordingCallFeatureState;\n  /* @conditional-compile-remove(raise-hand) */\n  /**\n   * Proxy of {@link @azure/communication-calling#RaiseHandCallFeature}.\n   */\n  raiseHand: RaiseHandCallFeatureState;\n  /**\n   * Stores the currently active screenshare participant's key. If there is no screenshare active, then this will be\n   * undefined. You can use this key to access the remoteParticipant data in {@link CallState.remoteParticipants} object.\n   *\n   * Note this only applies to ScreenShare in RemoteParticipant. A local ScreenShare being active will not affect this\n   * property.\n   *\n   * This property is added by the stateful layer and is not a proxy of SDK state\n   */\n  screenShareRemoteParticipant?: string;\n  /**\n   * Stores the local date when the call started on the client. This property is added by the stateful layer and is not\n   * a proxy of SDK state.\n   */\n  startTime: Date;\n  /**\n   * Stores the local date when the call ended on the client. This property is added by the stateful layer and is not\n   * a proxy of SDK state.\n   */\n  endTime: Date | undefined;\n\n  /**\n   * Stores the latest call diagnostics.\n   */\n  diagnostics: DiagnosticsCallFeatureState;\n  /* @conditional-compile-remove(rooms) */\n  /**\n   * Proxy of {@link @azure/communication-calling#Call.role}.\n   */\n  role?: ParticipantRole;\n\n  /* @conditional-compile-remove(total-participant-count) */\n  /**\n   * Proxy of {@link @azure/communication-calling#Call.totalParticipantCount}.\n   */\n  totalParticipantCount?: number;\n  /* @conditional-compile-remove(call-transfer) */\n  /**\n   * Transfer state of call\n   */\n  transfer: TransferFeatureState;\n  /* @conditional-compile-remove(capabilities) */\n  /**\n   * Proxy of {@link @azure/communication-calling#CapabilitiesFeature}.\n   */\n  capabilitiesFeature?: CapabilitiesFeatureState;\n}\n\n/* @conditional-compile-remove(call-transfer) */\n/**\n * Transfer feature state\n *\n * @beta\n */\nexport interface TransferFeatureState {\n  /**\n   * Accepted transfer requests\n   */\n  acceptedTransfers: { [key: string]: AcceptedTransfer };\n}\n\n/* @conditional-compile-remove(call-transfer) */\n/**\n * Transfer feature state\n *\n * @beta\n */\nexport interface AcceptedTransfer {\n  /**\n   * Stores call id of accepted transfer\n   */\n  callId: string;\n  /**\n   * Stores timestamp when transfer was accepted\n   */\n  timestamp: Date;\n}\n\n/**\n * State only version of {@link @azure/communication-calling#IncomingCall}. {@link StatefulCallClient} will\n * automatically detect incoming calls and add their state to the state exposed by {@link StatefulCallClient}.\n *\n * @public\n */\nexport interface IncomingCallState {\n  /**\n   * Proxy of {@link @azure/communication-calling#IncomingCall.id}.\n   */\n  id: string;\n  /**\n   * Proxy of {@link @azure/communication-calling#IncomingCall.callerInfo}.\n   */\n  callerInfo: CallerInfo;\n  /**\n   * Set to the state returned by 'callEnded' event on {@link @azure/communication-calling#IncomingCall} when received.\n   * This property is added by the stateful layer and is not a proxy of SDK state.\n   */\n  callEndReason?: CallEndReason;\n  /**\n   * Stores the local date when the call started on the client. This property is added by the stateful layer and is not\n   * a proxy of SDK state.\n   */\n  startTime: Date;\n  /**\n   * Stores the local date when the call ended on the client. This property is added by the stateful layer and is not a\n   * proxy of SDK state. It is undefined if the call is not ended yet.\n   */\n  endTime?: Date;\n}\n\n/**\n * This type is meant to encapsulate all the state inside {@link @azure/communication-calling#DeviceManager}. For\n * optional parameters they may not be available until permission is granted by the user. The cameras, microphones,\n * speakers, and deviceAccess states will be empty until the corresponding\n * {@link @azure/communication-calling#DeviceManager}'s getCameras, getMicrophones, getSpeakers, and askDevicePermission\n * APIs are called and completed.\n *\n * @public\n */\nexport type DeviceManagerState = {\n  /**\n   * Proxy of {@link @azure/communication-calling#DeviceManager.isSpeakerSelectionAvailable}.\n   */\n  isSpeakerSelectionAvailable: boolean;\n  /**\n   * Proxy of {@link @azure/communication-calling#DeviceManager.selectedMicrophone}.\n   */\n  selectedMicrophone?: AudioDeviceInfo;\n  /**\n   * Proxy of {@link @azure/communication-calling#DeviceManager.selectedSpeaker}.\n   */\n  selectedSpeaker?: AudioDeviceInfo;\n  /**\n   * Stores the selected camera device info. This is added by the stateful layer and does not exist in the Calling SDK.\n   * It is meant as a convenience to the developer. It must be explicitly set before it has any value and does not\n   * persist across instances of the {@link StatefulCallClient}. The developer controls entirely what this value holds\n   * at any time.\n   */\n  selectedCamera?: VideoDeviceInfo;\n  /**\n   * Stores any cameras data returned from {@link @azure/communication-calling#DeviceManager.getCameras}.\n   */\n  cameras: VideoDeviceInfo[];\n  /**\n   * Stores any microphones data returned from {@link @azure/communication-calling#DeviceManager.getMicrophones}.\n   */\n  microphones: AudioDeviceInfo[];\n  /**\n   * Stores any speakers data returned from {@link @azure/communication-calling#DeviceManager.getSpeakers}.\n   */\n  speakers: AudioDeviceInfo[];\n  /**\n   * Stores deviceAccess data returned from {@link @azure/communication-calling#DeviceManager.askDevicePermission}.\n   */\n  deviceAccess?: DeviceAccess;\n  /**\n   * Stores created views that are not associated with any CallState (when {@link StatefulCallClient.createView} is\n   * called with undefined callId, undefined participantId, and defined LocalVideoStream).\n   *\n   * The values in this array are generated internally when {@link StatefulCallClient.createView} is called and are\n   * considered immutable.\n   */\n  unparentedViews: LocalVideoStreamState[];\n};\n\n/**\n * Container for all of the state data proxied by {@link StatefulCallClient}. The calls, callsEnded, incomingCalls, and\n * incomingCallsEnded states will be automatically provided if a callAgent has been created. The deviceManager will be\n * empty initially until populated see {@link DeviceManagerState}. The userId state is provided as a convenience for the\n * developer and is completely controled and set by the developer.\n *\n * @public\n */\nexport interface CallClientState {\n  /**\n   * Proxy of {@link @azure/communication-calling#CallAgent.calls} as an object with CallState {@link CallState} fields.\n   * It is keyed by {@link @azure/communication-calling#Call.id}. Please note that\n   * {@link @azure/communication-calling#Call.id} could change. You should not cache the id itself but the entire\n   * {@link @azure/communication-calling#Call} and then use the id contained to look up data in this map.\n   */\n  calls: { [key: string]: CallState };\n  /**\n   * Calls that have ended are stored here so the callEndReason could be checked.\n   * It is an object with {@link @azure/communication-calling#Call.id} keys and {@link CallState} values.\n   *\n   * Only {@link MAX_CALL_HISTORY_LENGTH} Calls are kept in the history. Oldest calls are evicted if required.\n   */\n  callsEnded: { [key: string]: CallState };\n  /**\n   * Proxy of {@link @azure/communication-calling#IncomingCall} as an object with {@link IncomingCall} fields.\n   * It is keyed by {@link @azure/communication-calling#IncomingCall.id}.\n   */\n  incomingCalls: { [key: string]: IncomingCallState };\n  /**\n   * Incoming Calls that have ended are stored here so the callEndReason could be checked.\n   * It is an as an object with {@link @azure/communication-calling#Call.id} keys and {@link IncomingCall} values.\n   *\n   * Only {@link MAX_CALL_HISTORY_LENGTH} Calls are kept in the history. Oldest calls are evicted if required.\n   */\n  incomingCallsEnded: { [key: string]: IncomingCallState };\n  /**\n   * Proxy of {@link @azure/communication-calling#DeviceManager}. Please review {@link DeviceManagerState}.\n   */\n  deviceManager: DeviceManagerState;\n  /**\n   * Proxy of {@link @azure/communication-calling#CallAgent}. Please review {@link CallAgentState}.\n   */\n  callAgent?: CallAgentState;\n  /**\n   * Stores a userId. This is not used by the {@link StatefulCallClient} and is provided here as a convenience for the\n   * developer for easier access to userId. Must be passed in at initialization of the {@link StatefulCallClient}.\n   * Completely controlled by the developer.\n   */\n  userId: CommunicationIdentifierKind;\n  /**\n   * Stores the latest error for each API method.\n   *\n   * See documentation of {@Link CallErrors} for details.\n   */\n  latestErrors: CallErrors;\n  /* @conditional-compile-remove(PSTN-calls) */\n  /**\n   * A phone number in E.164 format that will be used to represent callers identity.\n   * For example, using the alternateCallerId to add a participant using PSTN, this number will\n   * be used as the caller id in the PSTN call.\n   */\n  alternateCallerId?: string;\n  /* @conditional-compile-remove(unsupported-browser) */\n  /**\n   * state to track the environment that the stateful client was made in is supported\n   */\n  environmentInfo?: EnvironmentInfo;\n}\n\n/**\n * Errors teed from API calls to the Calling SDK.\n *\n * Each property in the object stores the latest error for a particular SDK API method.\n *\n * Errors from this object can be cleared using the {@link newClearCallErrorsModifier}.\n * Additionally, errors are automatically cleared when:\n * - The state is cleared.\n * - Subsequent calls to related API methods succeed.\n * See documentation of individual stateful client methods for details on when errors may be automatically cleared.\n *\n * @public\n */\nexport type CallErrors = {\n  [target in CallErrorTarget]: CallError;\n};\n\n/**\n * Error thrown from failed stateful API methods.\n *\n * @public\n */\nexport class CallError extends Error {\n  /**\n   * The API method target that failed.\n   */\n  public target: CallErrorTarget;\n  /**\n   * Error thrown by the failed SDK method.\n   */\n  public innerError: Error;\n  /**\n   * Timestamp added to the error by the stateful layer.\n   */\n  public timestamp: Date;\n\n  constructor(target: CallErrorTarget, innerError: Error, timestamp?: Date) {\n    super();\n    this.target = target;\n    this.innerError = innerError;\n    // Testing note: It is easier to mock Date::now() than the Date() constructor.\n    this.timestamp = timestamp ?? new Date(Date.now());\n    this.name = 'CallError';\n    this.message = `${this.target}: ${this.innerError.message}`;\n  }\n}\n\n/**\n * String literal type for all permissible keys in {@Link CallErrors}.\n *\n * @public\n */\nexport type CallErrorTarget =\n  | 'Call.addParticipant'\n  | 'Call.dispose'\n  | 'Call.feature'\n  | 'Call.hangUp'\n  | 'Call.hold'\n  | 'Call.mute'\n  | 'Call.muteIncomingAudio'\n  | 'Call.off'\n  | 'Call.on'\n  | 'Call.removeParticipant'\n  | 'Call.resume'\n  | 'Call.sendDtmf'\n  | 'Call.startAudio'\n  | 'Call.startScreenSharing'\n  | 'Call.startVideo'\n  | 'Call.stopScreenSharing'\n  | 'Call.stopAudio'\n  | 'Call.stopVideo'\n  | 'Call.unmute'\n  | 'Call.unmuteIncomingAudio'\n  | 'CallAgent.dispose'\n  | 'CallAgent.feature'\n  | 'CallAgent.join'\n  | 'CallAgent.off'\n  | 'CallAgent.on'\n  | 'CallAgent.startCall'\n  | 'CallClient.createCallAgent'\n  | 'CallClient.createTeamsCallAgent'\n  | 'CallClient.feature'\n  | 'CallClient.getDeviceManager'\n  | /* @conditional-compile-remove(calling-beta-sdk) */ 'CallClient.getEnvironmentInfo'\n  | 'DeviceManager.askDevicePermission'\n  | 'DeviceManager.getCameras'\n  | 'DeviceManager.getMicrophones'\n  | 'DeviceManager.getSpeakers'\n  | 'DeviceManager.off'\n  | 'DeviceManager.on'\n  | 'DeviceManager.selectMicrophone'\n  | 'DeviceManager.selectSpeaker'\n  | 'IncomingCall.accept'\n  | 'IncomingCall.reject'\n  | /* @conditional-compile-remove(calling-beta-sdk) */ /* @conditional-compile-remove(teams-identity-support) */ 'TeamsCall.addParticipant'\n  | /* @conditional-compile-remove(video-background-effects) */ 'VideoEffectsFeature.startEffects'\n  | /* @conditional-compile-remove(calling-beta-sdk) */ 'CallAgent.handlePushNotification'\n  | /* @conditional-compile-remove(calling-beta-sdk) */ 'Call.admit'\n  | /* @conditional-compile-remove(calling-beta-sdk) */ 'Call.rejectParticipant'\n  | /* @conditional-compile-remove(calling-beta-sdk) */ 'Call.admitAll';\n\n/**\n * State only proxy for {@link @azure/communication-calling#DiagnosticsCallFeature}.\n *\n * @public\n */\nexport interface DiagnosticsCallFeatureState {\n  /**\n   * Stores diagnostics related to network conditions.\n   */\n  network: NetworkDiagnosticsState;\n\n  /**\n   * Stores diagnostics related to media quality.\n   */\n  media: MediaDiagnosticsState;\n}\n\n/**\n * State only proxy for {@link @azure/communication-calling#NetworkDiagnostics}.\n *\n * @public\n */\nexport interface NetworkDiagnosticsState {\n  latest: LatestNetworkDiagnostics;\n}\n\n/**\n * State only proxy for {@link @azure/communication-calling#MediaDiagnostics}.\n *\n * @public\n */\nexport interface MediaDiagnosticsState {\n  latest: LatestMediaDiagnostics;\n}\n"]}

package/dist/dist-esm/calling-stateful-client/src/Converter.js

@@ -3,7 +3,7 @@
 import { toFlatCommunicationIdentifier } from "../../acs-ui-common/src";
 /* @conditional-compile-remove(teams-identity-support) */
 import { _isACSCall } from './TypeGuards';
-/* @conditional-compile-remove(video-background-effects) */
+/* @conditional-compile-remove(video-background-effects) */ /* @conditional-compile-remove(optimal-video-count) */
 import { Features } from '@azure/communication-calling';
 /**
  * @private

package/dist/dist-esm/calling-stateful-client/src/Converter.js.map

@@ -1 +1 @@
-{"version":3,"file":"Converter.js","sourceRoot":"","sources":["../../../../../calling-stateful-client/src/Converter.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAYlC,OAAO,EAAE,6BAA6B,EAAE,gCAAgC;AAYxE,yDAAyD;AACzD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAG1C,2DAA2D;AAC3D,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AAUxD;;GAEG;AACH,MAAM,UAAU,6CAA6C,CAC3D,MAA2B;IAE3B,2DAA2D;IAC3D,MAAM,0BAA0B,GAAG,MAAM,CAAC,OAAO,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC;IAEzE,OAAO;QACL,MAAM,EAAE,MAAM,CAAC,MAAM;QACrB,eAAe,EAAE,MAAM,CAAC,eAAe;QACvC,IAAI,EAAE,SAAS;QACf,2DAA2D;QAC3D,YAAY,EAAE,kDAAkD,CAAC,0BAA0B,CAAC,aAAa,CAAC;KAC3G,CAAC;AACJ,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,+CAA+C,CAC7D,MAA4B;IAE5B,OAAO;QACL,EAAE,EAAE,MAAM,CAAC,EAAE;QACb,eAAe,EAAE,MAAM,CAAC,eAAe;QACvC,WAAW,EAAE,MAAM,CAAC,WAAW;QAC/B,iEAAiE;QACjE,WAAW,EAAE,MAAM,CAAC,WAAW;QAC/B,IAAI,EAAE,SAAS;QACf,sDAAsD;QACtD,UAAU,EAAE,MAAM,CAAC,IAAI;KACxB,CAAC;AACJ,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,6CAA6C,CAC3D,WAAiC;IAEjC,MAAM,uBAAuB,GAAG,EAAE,CAAC;IACnC,KAAK,MAAM,WAAW,IAAI,WAAW,CAAC,YAAY,EAAE;QAClD,uBAAuB,CAAC,WAAW,CAAC,EAAE,CAAC,GAAG,+CAA+C,CAAC,WAAW,CAAC,CAAC;KACxG;IACD,OAAO;QACL,UAAU,EAAE,WAAW,CAAC,UAAU;QAClC,WAAW,EAAE,WAAW,CAAC,WAAW;QACpC,KAAK,EAAE,WAAW,CAAC,KAAK;QACxB,aAAa,EAAE,WAAW,CAAC,aAAa;QACxC,YAAY,EAAE,uBAAuB;QACrC,OAAO,EAAE,WAAW,CAAC,OAAO;QAC5B,UAAU,EAAE,WAAW,CAAC,UAAU;QAClC,6CAA6C;QAC7C,UAAU,EAAE,SAAS;KACtB,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,+BAA+B,CAAC,IAAgB;IAC9D,MAAM,6BAA6B,GAAG,EAAE,CAAC;IACzC,IAAI,CAAC,kBAAkB,CAAC,OAAO,CAAC,CAAC,WAAiC,EAAE,EAAE;QACpE,6BAA6B,CAAC,6BAA6B,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;YAClF,6CAA6C,CAAC,WAAW,CAAC,CAAC;IAC/D,CAAC,CAAC,CAAC;IACH,OAAO;QACL,EAAE,EAAE,IAAI,CAAC,EAAE;QACX,yDAAyD;QACzD,IAAI,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC,CAAE,MAAmB,CAAC,CAAC,CAAE,WAAwB;QACzE,UAAU,EAAE,IAAI,CAAC,UAAU;QAC3B,KAAK,EAAE,IAAI,CAAC,KAAK;QACjB,aAAa,EAAE,IAAI,CAAC,aAAa;QACjC,WAAW,EAAE;YACX,OAAO,EAAE;gBACP,MAAM,EAAE,EAAE;aACX;YACD,KAAK,EAAE;gBACL,MAAM,EAAE,EAAE;aACX;SACF;QACD,SAAS,EAAE,IAAI,CAAC,SAAS;QACzB,OAAO,EAAE,IAAI,CAAC,OAAO;QACrB,iBAAiB,EAAE,IAAI,CAAC,iBAAiB;QACzC,iBAAiB,EAAE,IAAI,CAAC,iBAAiB,CAAC,GAAG,CAAC,6CAA6C,CAAC;QAC5F,kBAAkB,EAAE,6BAA6B;QACjD,uBAAuB,EAAE,EAAE;QAC3B,SAAS,EAAE,EAAE,iBAAiB,EAAE,KAAK,EAAE;QACvC,6CAA6C;QAC7C,SAAS,EAAE,EAAE,WAAW,EAAE,EAAE,EAAE;QAC9B,aAAa,EAAE,EAAE,qBAAqB,EAAE,KAAK,EAAE;QAC/C,4BAA4B,EAAE,SAAS;QACvC,SAAS,EAAE,IAAI,IAAI,EAAE;QACrB,OAAO,EAAE,SAAS;QAClB,wCAAwC;QACxC,IAAI,EAAE,IAAI,CAAC,IAAI;QACf,iDAAiD;QACjD,eAAe,EAAE;YACf,QAAQ,EAAE,EAAE;YACZ,wBAAwB,EAAE,EAAE;YAC5B,yBAAyB,EAAE,EAAE;YAC7B,sBAAsB,EAAE,EAAE;YAC1B,qBAAqB,EAAE,EAAE;YACzB,uBAAuB,EAAE,KAAK;YAC9B,uBAAuB,EAAE,KAAK;SAC/B;QACD,gDAAgD;QAChD,QAAQ,EAAE;YACR,iBAAiB,EAAE,EAAE;SACtB;QACD,sDAAsD;QACtD,iBAAiB,EAAE;YACjB,qBAAqB,EAAE,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,iBAAiB,CAAC,CAAC,iBAAiB;SAClF;KACF,CAAC;AACJ,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,+CAA+C,CAAC,IAAwB;IACtF,OAAO;QACL,EAAE,EAAE,IAAI,CAAC,EAAE;QACX,UAAU,EAAE,IAAI,CAAC,UAAU;QAC3B,SAAS,EAAE,IAAI,IAAI,EAAE;QACrB,OAAO,EAAE,SAAS;KACnB,CAAC;AACJ,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,kDAAkD,CAChE,IAA6B;IAE7B,OAAO;QACL,WAAW,EAAE,IAAI,CAAC,WAAW;QAC7B,UAAU,EAAE,IAAI,CAAC,UAAU;QAC3B,MAAM,EAAE,IAAI,CAAC,MAAM;KACpB,CAAC;AACJ,CAAC;AAED,iDAAiD;AACjD;;GAEG;AACH,MAAM,UAAU,gCAAgC,CAAC,OAA0B;IACzE,yBACK,OAAO,EACV;AACJ,CAAC;AAED,2DAA2D;AAC3D,eAAe;AACf,MAAM,UAAU,kDAAkD,CAChE,YAA+B;IAE/B,OAAO;QACL,aAAa,EAAE,YAAY;KAC5B,CAAC;AACJ,CAAC;AAED,6CAA6C;AAC7C;;GAEG;AACH,MAAM,UAAU,+BAA+B,CAAC,UAAsB;IACpE,OAAO;QACL,uBAAuB,EAAE,UAAU,CAAC,KAAK;KAC1C,CAAC;AACJ,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport {\n  RemoteParticipant as SdkRemoteParticipant,\n  RemoteVideoStream as SdkRemoteVideoStream,\n  LocalVideoStream as SdkLocalVideoStream,\n  VideoStreamRendererView\n} from '@azure/communication-calling';\n/* @conditional-compile-remove(close-captions) */\nimport { TeamsCaptionsInfo } from '@azure/communication-calling';\n/* @conditional-compile-remove(teams-identity-support) */\nimport { CallKind } from '@azure/communication-calling';\nimport { toFlatCommunicationIdentifier } from '@internal/acs-ui-common';\nimport {\n  CallState,\n  RemoteParticipantState as DeclarativeRemoteParticipant,\n  RemoteVideoStreamState as DeclarativeRemoteVideoStream,\n  LocalVideoStreamState as DeclarativeLocalVideoStream,\n  IncomingCallState as DeclarativeIncomingCall,\n  VideoStreamRendererViewState as DeclarativeVideoStreamRendererView\n} from './CallClientState';\n/* @conditional-compile-remove(close-captions) */\nimport { CaptionsInfo } from './CallClientState';\n\n/* @conditional-compile-remove(teams-identity-support) */\nimport { _isACSCall } from './TypeGuards';\nimport { CallCommon, IncomingCallCommon } from './BetaToStableTypes';\n\n/* @conditional-compile-remove(video-background-effects) */\nimport { Features } from '@azure/communication-calling';\n/* @conditional-compile-remove(video-background-effects) */\nimport { VideoEffectName } from '@azure/communication-calling';\n/* @conditional-compile-remove(video-background-effects) */\nimport { LocalVideoStreamVideoEffectsState } from './CallClientState';\n/* @conditional-compile-remove(raise-hand) */\nimport { RaisedHand } from '@azure/communication-calling';\n/* @conditional-compile-remove(raise-hand) */\nimport { RaisedHandState } from './CallClientState';\n\n/**\n * @private\n */\nexport function convertSdkLocalStreamToDeclarativeLocalStream(\n  stream: SdkLocalVideoStream\n): DeclarativeLocalVideoStream {\n  /* @conditional-compile-remove(video-background-effects) */\n  const localVideoStreamEffectsAPI = stream.feature(Features.VideoEffects);\n\n  return {\n    source: stream.source,\n    mediaStreamType: stream.mediaStreamType,\n    view: undefined,\n    /* @conditional-compile-remove(video-background-effects) */\n    videoEffects: convertFromSDKToDeclarativeVideoStreamVideoEffects(localVideoStreamEffectsAPI.activeEffects)\n  };\n}\n\n/**\n * @private\n */\nexport function convertSdkRemoteStreamToDeclarativeRemoteStream(\n  stream: SdkRemoteVideoStream\n): DeclarativeRemoteVideoStream {\n  return {\n    id: stream.id,\n    mediaStreamType: stream.mediaStreamType,\n    isAvailable: stream.isAvailable,\n    /* @conditional-compile-remove(video-stream-is-receiving-flag) */\n    isReceiving: stream.isReceiving,\n    view: undefined,\n    /* @conditional-compile-remove(pinned-participants) */\n    streamSize: stream.size\n  };\n}\n\n/**\n * @private\n */\nexport function convertSdkParticipantToDeclarativeParticipant(\n  participant: SdkRemoteParticipant\n): DeclarativeRemoteParticipant {\n  const declarativeVideoStreams = {};\n  for (const videoStream of participant.videoStreams) {\n    declarativeVideoStreams[videoStream.id] = convertSdkRemoteStreamToDeclarativeRemoteStream(videoStream);\n  }\n  return {\n    identifier: participant.identifier,\n    displayName: participant.displayName,\n    state: participant.state,\n    callEndReason: participant.callEndReason,\n    videoStreams: declarativeVideoStreams,\n    isMuted: participant.isMuted,\n    isSpeaking: participant.isSpeaking,\n    /* @conditional-compile-remove(raise-hand) */\n    raisedHand: undefined\n  };\n}\n\n/**\n * @private\n *\n * Note at the time of writing only one LocalVideoStream is supported by the SDK.\n */\nexport function convertSdkCallToDeclarativeCall(call: CallCommon): CallState {\n  const declarativeRemoteParticipants = {};\n  call.remoteParticipants.forEach((participant: SdkRemoteParticipant) => {\n    declarativeRemoteParticipants[toFlatCommunicationIdentifier(participant.identifier)] =\n      convertSdkParticipantToDeclarativeParticipant(participant);\n  });\n  return {\n    id: call.id,\n    /* @conditional-compile-remove(teams-identity-support) */\n    kind: _isACSCall(call) ? ('Call' as CallKind) : ('TeamsCall' as CallKind),\n    callerInfo: call.callerInfo,\n    state: call.state,\n    callEndReason: call.callEndReason,\n    diagnostics: {\n      network: {\n        latest: {}\n      },\n      media: {\n        latest: {}\n      }\n    },\n    direction: call.direction,\n    isMuted: call.isMuted,\n    isScreenSharingOn: call.isScreenSharingOn,\n    localVideoStreams: call.localVideoStreams.map(convertSdkLocalStreamToDeclarativeLocalStream),\n    remoteParticipants: declarativeRemoteParticipants,\n    remoteParticipantsEnded: {},\n    recording: { isRecordingActive: false },\n    /* @conditional-compile-remove(raise-hand) */\n    raiseHand: { raisedHands: [] },\n    transcription: { isTranscriptionActive: false },\n    screenShareRemoteParticipant: undefined,\n    startTime: new Date(),\n    endTime: undefined,\n    /* @conditional-compile-remove(rooms) */\n    role: call.role,\n    /* @conditional-compile-remove(close-captions) */\n    captionsFeature: {\n      captions: [],\n      supportedSpokenLanguages: [],\n      supportedCaptionLanguages: [],\n      currentCaptionLanguage: '',\n      currentSpokenLanguage: '',\n      isCaptionsFeatureActive: false,\n      startCaptionsInProgress: false\n    },\n    /* @conditional-compile-remove(call-transfer) */\n    transfer: {\n      acceptedTransfers: {}\n    },\n    /* @conditional-compile-remove(optimal-video-count) */\n    optimalVideoCount: {\n      maxRemoteVideoStreams: call.feature(Features.OptimalVideoCount).optimalVideoCount\n    }\n  };\n}\n\n/**\n * @private\n */\nexport function convertSdkIncomingCallToDeclarativeIncomingCall(call: IncomingCallCommon): DeclarativeIncomingCall {\n  return {\n    id: call.id,\n    callerInfo: call.callerInfo,\n    startTime: new Date(),\n    endTime: undefined\n  };\n}\n\n/**\n * @private\n */\nexport function convertFromSDKToDeclarativeVideoStreamRendererView(\n  view: VideoStreamRendererView\n): DeclarativeVideoStreamRendererView {\n  return {\n    scalingMode: view.scalingMode,\n    isMirrored: view.isMirrored,\n    target: view.target\n  };\n}\n\n/* @conditional-compile-remove(close-captions) */\n/**\n * @private\n */\nexport function convertFromSDKToCaptionInfoState(caption: TeamsCaptionsInfo): CaptionsInfo {\n  return {\n    ...caption\n  };\n}\n\n/* @conditional-compile-remove(video-background-effects) */\n/** @private */\nexport function convertFromSDKToDeclarativeVideoStreamVideoEffects(\n  videoEffects: VideoEffectName[]\n): LocalVideoStreamVideoEffectsState {\n  return {\n    activeEffects: videoEffects\n  };\n}\n\n/* @conditional-compile-remove(raise-hand) */\n/**\n * @private\n */\nexport function convertFromSDKToRaisedHandState(raisedHand: RaisedHand): RaisedHandState {\n  return {\n    raisedHandOrderPosition: raisedHand.order\n  };\n}\n\"../../acs-ui-common/src\""]}
+{"version":3,"file":"Converter.js","sourceRoot":"","sources":["../../../../../calling-stateful-client/src/Converter.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport {\n  RemoteParticipant as SdkRemoteParticipant,\n  RemoteVideoStream as SdkRemoteVideoStream,\n  LocalVideoStream as SdkLocalVideoStream,\n  VideoStreamRendererView\n} from '@azure/communication-calling';\n/* @conditional-compile-remove(close-captions) */\nimport { TeamsCaptionsInfo } from '@azure/communication-calling';\n/* @conditional-compile-remove(teams-identity-support) */\nimport { CallKind } from '@azure/communication-calling';\nimport { toFlatCommunicationIdentifier } from '@internal/acs-ui-common';\nimport {\n  CallState,\n  RemoteParticipantState as DeclarativeRemoteParticipant,\n  RemoteVideoStreamState as DeclarativeRemoteVideoStream,\n  LocalVideoStreamState as DeclarativeLocalVideoStream,\n  IncomingCallState as DeclarativeIncomingCall,\n  VideoStreamRendererViewState as DeclarativeVideoStreamRendererView\n} from './CallClientState';\n/* @conditional-compile-remove(close-captions) */\nimport { CaptionsInfo } from './CallClientState';\n\n/* @conditional-compile-remove(teams-identity-support) */\nimport { _isACSCall } from './TypeGuards';\nimport { CallCommon, IncomingCallCommon } from './BetaToStableTypes';\n\n/* @conditional-compile-remove(video-background-effects) */ /* @conditional-compile-remove(optimal-video-count) */\nimport { Features } from '@azure/communication-calling';\n/* @conditional-compile-remove(video-background-effects) */\nimport { VideoEffectName } from '@azure/communication-calling';\n/* @conditional-compile-remove(video-background-effects) */\nimport { LocalVideoStreamVideoEffectsState } from './CallClientState';\n/* @conditional-compile-remove(raise-hand) */\nimport { RaisedHand } from '@azure/communication-calling';\n/* @conditional-compile-remove(raise-hand) */\nimport { RaisedHandState } from './CallClientState';\n\n/**\n * @private\n */\nexport function convertSdkLocalStreamToDeclarativeLocalStream(\n  stream: SdkLocalVideoStream\n): DeclarativeLocalVideoStream {\n  /* @conditional-compile-remove(video-background-effects) */\n  const localVideoStreamEffectsAPI = stream.feature(Features.VideoEffects);\n\n  return {\n    source: stream.source,\n    mediaStreamType: stream.mediaStreamType,\n    view: undefined,\n    /* @conditional-compile-remove(video-background-effects) */\n    videoEffects: convertFromSDKToDeclarativeVideoStreamVideoEffects(localVideoStreamEffectsAPI.activeEffects)\n  };\n}\n\n/**\n * @private\n */\nexport function convertSdkRemoteStreamToDeclarativeRemoteStream(\n  stream: SdkRemoteVideoStream\n): DeclarativeRemoteVideoStream {\n  return {\n    id: stream.id,\n    mediaStreamType: stream.mediaStreamType,\n    isAvailable: stream.isAvailable,\n    /* @conditional-compile-remove(video-stream-is-receiving-flag) */\n    isReceiving: stream.isReceiving,\n    view: undefined,\n    /* @conditional-compile-remove(pinned-participants) */\n    streamSize: stream.size\n  };\n}\n\n/**\n * @private\n */\nexport function convertSdkParticipantToDeclarativeParticipant(\n  participant: SdkRemoteParticipant\n): DeclarativeRemoteParticipant {\n  const declarativeVideoStreams = {};\n  for (const videoStream of participant.videoStreams) {\n    declarativeVideoStreams[videoStream.id] = convertSdkRemoteStreamToDeclarativeRemoteStream(videoStream);\n  }\n  return {\n    identifier: participant.identifier,\n    displayName: participant.displayName,\n    state: participant.state,\n    callEndReason: participant.callEndReason,\n    videoStreams: declarativeVideoStreams,\n    isMuted: participant.isMuted,\n    isSpeaking: participant.isSpeaking,\n    /* @conditional-compile-remove(raise-hand) */\n    raisedHand: undefined\n  };\n}\n\n/**\n * @private\n *\n * Note at the time of writing only one LocalVideoStream is supported by the SDK.\n */\nexport function convertSdkCallToDeclarativeCall(call: CallCommon): CallState {\n  const declarativeRemoteParticipants = {};\n  call.remoteParticipants.forEach((participant: SdkRemoteParticipant) => {\n    declarativeRemoteParticipants[toFlatCommunicationIdentifier(participant.identifier)] =\n      convertSdkParticipantToDeclarativeParticipant(participant);\n  });\n  return {\n    id: call.id,\n    /* @conditional-compile-remove(teams-identity-support) */\n    kind: _isACSCall(call) ? ('Call' as CallKind) : ('TeamsCall' as CallKind),\n    callerInfo: call.callerInfo,\n    state: call.state,\n    callEndReason: call.callEndReason,\n    diagnostics: {\n      network: {\n        latest: {}\n      },\n      media: {\n        latest: {}\n      }\n    },\n    direction: call.direction,\n    isMuted: call.isMuted,\n    isScreenSharingOn: call.isScreenSharingOn,\n    localVideoStreams: call.localVideoStreams.map(convertSdkLocalStreamToDeclarativeLocalStream),\n    remoteParticipants: declarativeRemoteParticipants,\n    remoteParticipantsEnded: {},\n    recording: { isRecordingActive: false },\n    /* @conditional-compile-remove(raise-hand) */\n    raiseHand: { raisedHands: [] },\n    transcription: { isTranscriptionActive: false },\n    screenShareRemoteParticipant: undefined,\n    startTime: new Date(),\n    endTime: undefined,\n    /* @conditional-compile-remove(rooms) */\n    role: call.role,\n    /* @conditional-compile-remove(close-captions) */\n    captionsFeature: {\n      captions: [],\n      supportedSpokenLanguages: [],\n      supportedCaptionLanguages: [],\n      currentCaptionLanguage: '',\n      currentSpokenLanguage: '',\n      isCaptionsFeatureActive: false,\n      startCaptionsInProgress: false\n    },\n    /* @conditional-compile-remove(call-transfer) */\n    transfer: {\n      acceptedTransfers: {}\n    },\n    /* @conditional-compile-remove(optimal-video-count) */\n    optimalVideoCount: {\n      maxRemoteVideoStreams: call.feature(Features.OptimalVideoCount).optimalVideoCount\n    }\n  };\n}\n\n/**\n * @private\n */\nexport function convertSdkIncomingCallToDeclarativeIncomingCall(call: IncomingCallCommon): DeclarativeIncomingCall {\n  return {\n    id: call.id,\n    callerInfo: call.callerInfo,\n    startTime: new Date(),\n    endTime: undefined\n  };\n}\n\n/**\n * @private\n */\nexport function convertFromSDKToDeclarativeVideoStreamRendererView(\n  view: VideoStreamRendererView\n): DeclarativeVideoStreamRendererView {\n  return {\n    scalingMode: view.scalingMode,\n    isMirrored: view.isMirrored,\n    target: view.target\n  };\n}\n\n/* @conditional-compile-remove(close-captions) */\n/**\n * @private\n */\nexport function convertFromSDKToCaptionInfoState(caption: TeamsCaptionsInfo): CaptionsInfo {\n  return {\n    ...caption\n  };\n}\n\n/* @conditional-compile-remove(video-background-effects) */\n/** @private */\nexport function convertFromSDKToDeclarativeVideoStreamVideoEffects(\n  videoEffects: VideoEffectName[]\n): LocalVideoStreamVideoEffectsState {\n  return {\n    activeEffects: videoEffects\n  };\n}\n\n/* @conditional-compile-remove(raise-hand) */\n/**\n * @private\n */\nexport function convertFromSDKToRaisedHandState(raisedHand: RaisedHand): RaisedHandState {\n  return {\n    raisedHandOrderPosition: raisedHand.order\n  };\n}\n\"../../acs-ui-common/src\""]}

package/dist/dist-esm/react-components/src/components/ImageGallery.d.ts

@@ -8,7 +8,7 @@ export interface ImageGalleryImageProps {
     /** Image Url used to display the image in a large scale. */
     imageUrl: string;
     /** String used as a file name when downloading this image to user's local device. */
-    saveAsName: string;
+    downloadFilename: string;
     /** Optional string used as a alt text for the image. @default 'image' */
     altText?: string;
     /** Optional string used as the title of the image and displayed on the top left corner of the ImageGallery. */
@@ -37,7 +37,7 @@ export interface ImageGalleryProps {
     /**
      * Callback called when the download button is clicked.
      */
-    onImageDownloadButtonClicked: (imageUrl: string, saveAsName: string) => void;
+    onImageDownloadButtonClicked: (imageUrl: string, downloadFilename: string) => void;
     /**
      * Callback called when there's an error loading the image.
      */

package/dist/dist-esm/react-components/src/components/ImageGallery.js

@@ -23,20 +23,17 @@ export const ImageGallery = (props) => {
     const localeStrings = useLocale().strings.imageGallery;
     const [isImageLoaded, setIsImageLoaded] = useState(true);
     const imageStyle = isImageLoaded ? normalImageStyle : brokenImageStyle(theme);
-    if (images.length <= startIndex) {
-        return React.createElement(React.Fragment, null);
-    }
     const image = images[startIndex];
     const renderHeaderBar = () => {
         return (React.createElement(Stack, { className: mergeStyles(headerStyle) },
-            React.createElement(Stack, { className: mergeStyles(titleBarContainerStyle) },
+            React.createElement(Stack, { className: mergeStyles(titleBarContainerStyle) }, image === null || image === void 0 ? void 0 :
                 image.titleIcon,
-                React.createElement(Stack.Item, { className: mergeStyles(titleStyle(theme)), "aria-label": image.title }, image.title)),
+                React.createElement(Stack.Item, { className: mergeStyles(titleStyle(theme)), "aria-label": image === null || image === void 0 ? void 0 : image.title }, image === null || image === void 0 ? void 0 : image.title)),
             React.createElement(Stack, { className: mergeStyles(controlBarContainerStyle) },
                 React.createElement(DefaultButton, { className: mergeStyles(downloadButtonStyle(theme)), 
                     /* @conditional-compile-remove(image-gallery) */
-                    text: localeStrings.downloadButtonLabel, onClick: () => onImageDownloadButtonClicked(image.imageUrl, image.saveAsName), onRenderIcon: () => React.createElement(Icon, { iconName: downloadIcon.iconName, className: mergeStyles(downloadIconStyle) }), "aria-live": 'polite', "aria-label": localeStrings.downloadButtonLabel }),
-                React.createElement(IconButton, { iconProps: downloadIcon, className: mergeStyles(smallDownloadButtonContainerStyle(theme)), onClick: () => onImageDownloadButtonClicked(image.imageUrl, image.saveAsName), "aria-label": localeStrings.downloadButtonLabel, "aria-live": 'polite' }),
+                    text: localeStrings.downloadButtonLabel, onClick: () => onImageDownloadButtonClicked((image === null || image === void 0 ? void 0 : image.imageUrl) || '', (image === null || image === void 0 ? void 0 : image.downloadFilename) || 'image'), onRenderIcon: () => React.createElement(Icon, { iconName: downloadIcon.iconName, className: mergeStyles(downloadIconStyle) }), "aria-live": 'polite', "aria-label": localeStrings.downloadButtonLabel }),
+                React.createElement(IconButton, { iconProps: downloadIcon, className: mergeStyles(smallDownloadButtonContainerStyle(theme)), onClick: () => onImageDownloadButtonClicked(image === null || image === void 0 ? void 0 : image.imageUrl, image === null || image === void 0 ? void 0 : image.downloadFilename), "aria-label": localeStrings.downloadButtonLabel, "aria-live": 'polite' }),
                 React.createElement(IconButton, { iconProps: cancelIcon, className: mergeStyles(closeButtonStyles(theme)), onClick: onDismiss, 
                     /* @conditional-compile-remove(image-gallery) */
                     ariaLabel: localeStrings.dismissButtonAriaLabel, "aria-live": 'polite' }))));
@@ -50,15 +47,14 @@ export const ImageGallery = (props) => {
                 }, 
                 // Ensure when the focus trap has focus, the light dismiss area can still be clicked with mouse to dismiss.
                 // Note: this still correctly captures keyboard focus, this just allows mouse click outside of the focus trap.
-                isClickableOutsideFocusTrap: true, className: mergeStyles(bodyFocusZone) },
-                React.createElement("img", { src: image.imageUrl, className: mergeStyles(imageStyle), alt: image.altText || 'image', "aria-label": 'image-gallery-main-image', "aria-live": 'polite', onError: (event) => {
-                        setIsImageLoaded(false);
-                        onError && onError(event);
-                    }, onClick: (event) => event.stopPropagation(), onDoubleClick: (event) => {
-                        event.persist();
-                    } }))));
+                isClickableOutsideFocusTrap: true, className: mergeStyles(bodyFocusZone) }, images.length > startIndex && (React.createElement("img", { src: image === null || image === void 0 ? void 0 : image.imageUrl, className: mergeStyles(imageStyle), alt: (image === null || image === void 0 ? void 0 : image.altText) || 'image', "aria-label": 'image-gallery-main-image', "aria-live": 'polite', onError: (event) => {
+                    setIsImageLoaded(false);
+                    onError && onError(event);
+                }, onClick: (event) => event.stopPropagation(), onDoubleClick: (event) => {
+                    event.persist();
+                } })))));
     };
-    return (React.createElement(Modal, { titleAriaId: image.title, isOpen: isOpen, onDismiss: onDismiss, overlay: { styles: Object.assign({}, overlayStyles(theme)) }, styles: { main: focusTrapZoneStyle, scrollableContent: scrollableContentStyle }, isDarkOverlay: true },
+    return (React.createElement(Modal, { titleAriaId: image === null || image === void 0 ? void 0 : image.title, isOpen: isOpen, onDismiss: onDismiss, overlay: { styles: Object.assign({}, overlayStyles(theme)) }, styles: { main: focusTrapZoneStyle, scrollableContent: scrollableContentStyle }, isDarkOverlay: true },
         renderHeaderBar(),
         renderBodyWithLightDismiss()));
 };

package/dist/dist-esm/react-components/src/components/ImageGallery.js.map

@@ -1 +1 @@
-{"version":3,"file":"ImageGallery.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/ImageGallery.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n/* @conditional-compile-remove(image-gallery) */\nimport { DefaultButton, FocusTrapZone, Icon, IconButton, Modal, Stack, mergeStyles } from '@fluentui/react';\n/* @conditional-compile-remove(image-gallery) */\nimport React, { SyntheticEvent, useState } from 'react';\n/* @conditional-compile-remove(image-gallery) */\nimport {\n  bodyContainer,\n  bodyFocusZone,\n  brokenImageStyle,\n  cancelIcon,\n  closeButtonStyles,\n  controlBarContainerStyle,\n  downloadButtonStyle,\n  downloadIcon,\n  downloadIconStyle,\n  focusTrapZoneStyle,\n  headerStyle,\n  normalImageStyle,\n  overlayStyles,\n  scrollableContentStyle,\n  smallDownloadButtonContainerStyle,\n  titleBarContainerStyle,\n  titleStyle\n} from './styles/ImageGallery.style';\n/* @conditional-compile-remove(image-gallery) */\nimport { useTheme } from '../theming/FluentThemeProvider';\n/* @conditional-compile-remove(image-gallery) */\nimport { useLocale } from '../localization';\n/* @conditional-compile-remove(image-gallery) */\nimport { ChatTheme } from '../theming';\n/**\n * Props for {@link ImageGallery}.\n *\n * @beta\n */\nexport interface ImageGalleryImageProps {\n  /** Image Url used to display the image in a large scale. */\n  imageUrl: string;\n  /** String used as a file name when downloading this image to user's local device. */\n  saveAsName: string;\n  /** Optional string used as a alt text for the image. @default 'image' */\n  altText?: string;\n  /** Optional string used as the title of the image and displayed on the top left corner of the ImageGallery. */\n  title?: string;\n  /** Optional JSX element used as a title icon and displayed to the left of the title element. */\n  titleIcon?: JSX.Element;\n}\n/* @conditional-compile-remove(image-gallery) */\n/**\n * Props for {@link ImageGallery}.\n *\n * @beta\n */\nexport interface ImageGalleryProps {\n  /**\n   * Boolean that controls whether the modal is displayed.\n   */\n  isOpen: boolean;\n  /**\n   * Array of images used to populate the ImageGallery\n   */\n  images: Array<ImageGalleryImageProps>;\n  /**\n   * Callback to invoke when the ImageGallery modal is dismissed\n   */\n  onDismiss: () => void;\n  /**\n   * Callback called when the download button is clicked.\n   */\n  onImageDownloadButtonClicked: (imageUrl: string, saveAsName: string) => void;\n  /**\n   * Callback called when there's an error loading the image.\n   */\n  onError?: (event: SyntheticEvent<HTMLImageElement, Event>) => void;\n  /**\n   * Indicating which index of the images array to start with.\n   */\n  startIndex?: number;\n}\n/* @conditional-compile-remove(image-gallery) */\n/**\n * Strings of {@link ImageGallery} that can be overridden.\n *\n * @beta\n */\nexport interface ImageGalleryStrings {\n  /**\n   * Download button label for ImageGallery\n   */\n  downloadButtonLabel: string;\n  /**\n   * Dismiss button aria label for ImageGallery\n   */\n  dismissButtonAriaLabel: string;\n}\n/* @conditional-compile-remove(image-gallery) */\n/**\n * Component to render a fullscreen modal for a selected image.\n *\n * @beta\n */\nexport const ImageGallery = (props: ImageGalleryProps): JSX.Element => {\n  const { isOpen, images, onImageDownloadButtonClicked, onDismiss, onError, startIndex = 0 } = props;\n  const theme = useTheme() as unknown as ChatTheme;\n\n  /* @conditional-compile-remove(image-gallery) */\n  const localeStrings = useLocale().strings.imageGallery;\n\n  const [isImageLoaded, setIsImageLoaded] = useState<boolean>(true);\n\n  const imageStyle = isImageLoaded ? normalImageStyle : brokenImageStyle(theme);\n\n  if (images.length <= startIndex) {\n    return <></>;\n  }\n  const image = images[startIndex];\n  const renderHeaderBar = (): JSX.Element => {\n    return (\n      <Stack className={mergeStyles(headerStyle)}>\n        <Stack className={mergeStyles(titleBarContainerStyle)}>\n          {image.titleIcon}\n          <Stack.Item className={mergeStyles(titleStyle(theme))} aria-label={image.title}>\n            {image.title}\n          </Stack.Item>\n        </Stack>\n        <Stack className={mergeStyles(controlBarContainerStyle)}>\n          <DefaultButton\n            className={mergeStyles(downloadButtonStyle(theme))}\n            /* @conditional-compile-remove(image-gallery) */\n            text={localeStrings.downloadButtonLabel}\n            onClick={() => onImageDownloadButtonClicked(image.imageUrl, image.saveAsName)}\n            onRenderIcon={() => <Icon iconName={downloadIcon.iconName} className={mergeStyles(downloadIconStyle)} />}\n            aria-live={'polite'}\n            /* @conditional-compile-remove(image-gallery) */\n            aria-label={localeStrings.downloadButtonLabel}\n          />\n          <IconButton\n            iconProps={downloadIcon}\n            className={mergeStyles(smallDownloadButtonContainerStyle(theme))}\n            onClick={() => onImageDownloadButtonClicked(image.imageUrl, image.saveAsName)}\n            /* @conditional-compile-remove(image-gallery) */\n            aria-label={localeStrings.downloadButtonLabel}\n            aria-live={'polite'}\n          />\n          <IconButton\n            iconProps={cancelIcon}\n            className={mergeStyles(closeButtonStyles(theme))}\n            onClick={onDismiss}\n            /* @conditional-compile-remove(image-gallery) */\n            ariaLabel={localeStrings.dismissButtonAriaLabel}\n            aria-live={'polite'}\n          />\n        </Stack>\n      </Stack>\n    );\n  };\n\n  const renderBodyWithLightDismiss = (): JSX.Element => {\n    return (\n      <Stack className={mergeStyles(bodyContainer)} onClick={() => props.onDismiss()}>\n        <FocusTrapZone\n          onKeyDown={(e) => {\n            if (e.key === 'Escape' || e.key === 'Esc') {\n              onDismiss();\n            }\n          }}\n          // Ensure when the focus trap has focus, the light dismiss area can still be clicked with mouse to dismiss.\n          // Note: this still correctly captures keyboard focus, this just allows mouse click outside of the focus trap.\n          isClickableOutsideFocusTrap={true}\n          className={mergeStyles(bodyFocusZone)}\n        >\n          <img\n            src={image.imageUrl}\n            className={mergeStyles(imageStyle)}\n            alt={image.altText || 'image'}\n            aria-label={'image-gallery-main-image'}\n            aria-live={'polite'}\n            onError={(event) => {\n              setIsImageLoaded(false);\n              onError && onError(event);\n            }}\n            onClick={(event) => event.stopPropagation()}\n            onDoubleClick={(event) => {\n              event.persist();\n            }}\n          />\n        </FocusTrapZone>\n      </Stack>\n    );\n  };\n\n  return (\n    <Modal\n      titleAriaId={image.title}\n      isOpen={isOpen}\n      onDismiss={onDismiss}\n      overlay={{ styles: { ...overlayStyles(theme) } }}\n      styles={{ main: focusTrapZoneStyle, scrollableContent: scrollableContentStyle }}\n      isDarkOverlay={true}\n    >\n      {renderHeaderBar()}\n      {renderBodyWithLightDismiss()}\n    </Modal>\n  );\n};\n"]}
+{"version":3,"file":"ImageGallery.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/ImageGallery.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n/* @conditional-compile-remove(image-gallery) */\nimport { DefaultButton, FocusTrapZone, Icon, IconButton, Modal, Stack, mergeStyles } from '@fluentui/react';\n/* @conditional-compile-remove(image-gallery) */\nimport React, { SyntheticEvent, useState } from 'react';\n/* @conditional-compile-remove(image-gallery) */\nimport {\n  bodyContainer,\n  bodyFocusZone,\n  brokenImageStyle,\n  cancelIcon,\n  closeButtonStyles,\n  controlBarContainerStyle,\n  downloadButtonStyle,\n  downloadIcon,\n  downloadIconStyle,\n  focusTrapZoneStyle,\n  headerStyle,\n  normalImageStyle,\n  overlayStyles,\n  scrollableContentStyle,\n  smallDownloadButtonContainerStyle,\n  titleBarContainerStyle,\n  titleStyle\n} from './styles/ImageGallery.style';\n/* @conditional-compile-remove(image-gallery) */\nimport { useTheme } from '../theming/FluentThemeProvider';\n/* @conditional-compile-remove(image-gallery) */\nimport { useLocale } from '../localization';\n/* @conditional-compile-remove(image-gallery) */\nimport { ChatTheme } from '../theming';\n/**\n * Props for {@link ImageGallery}.\n *\n * @beta\n */\nexport interface ImageGalleryImageProps {\n  /** Image Url used to display the image in a large scale. */\n  imageUrl: string;\n  /** String used as a file name when downloading this image to user's local device. */\n  downloadFilename: string;\n  /** Optional string used as a alt text for the image. @default 'image' */\n  altText?: string;\n  /** Optional string used as the title of the image and displayed on the top left corner of the ImageGallery. */\n  title?: string;\n  /** Optional JSX element used as a title icon and displayed to the left of the title element. */\n  titleIcon?: JSX.Element;\n}\n/* @conditional-compile-remove(image-gallery) */\n/**\n * Props for {@link ImageGallery}.\n *\n * @beta\n */\nexport interface ImageGalleryProps {\n  /**\n   * Boolean that controls whether the modal is displayed.\n   */\n  isOpen: boolean;\n  /**\n   * Array of images used to populate the ImageGallery\n   */\n  images: Array<ImageGalleryImageProps>;\n  /**\n   * Callback to invoke when the ImageGallery modal is dismissed\n   */\n  onDismiss: () => void;\n  /**\n   * Callback called when the download button is clicked.\n   */\n  onImageDownloadButtonClicked: (imageUrl: string, downloadFilename: string) => void;\n  /**\n   * Callback called when there's an error loading the image.\n   */\n  onError?: (event: SyntheticEvent<HTMLImageElement, Event>) => void;\n  /**\n   * Indicating which index of the images array to start with.\n   */\n  startIndex?: number;\n}\n/* @conditional-compile-remove(image-gallery) */\n/**\n * Strings of {@link ImageGallery} that can be overridden.\n *\n * @beta\n */\nexport interface ImageGalleryStrings {\n  /**\n   * Download button label for ImageGallery\n   */\n  downloadButtonLabel: string;\n  /**\n   * Dismiss button aria label for ImageGallery\n   */\n  dismissButtonAriaLabel: string;\n}\n/* @conditional-compile-remove(image-gallery) */\n/**\n * Component to render a fullscreen modal for a selected image.\n *\n * @beta\n */\nexport const ImageGallery = (props: ImageGalleryProps): JSX.Element => {\n  const { isOpen, images, onImageDownloadButtonClicked, onDismiss, onError, startIndex = 0 } = props;\n  const theme = useTheme() as unknown as ChatTheme;\n\n  /* @conditional-compile-remove(image-gallery) */\n  const localeStrings = useLocale().strings.imageGallery;\n\n  const [isImageLoaded, setIsImageLoaded] = useState<boolean>(true);\n\n  const imageStyle = isImageLoaded ? normalImageStyle : brokenImageStyle(theme);\n\n  const image = images[startIndex];\n  const renderHeaderBar = (): JSX.Element => {\n    return (\n      <Stack className={mergeStyles(headerStyle)}>\n        <Stack className={mergeStyles(titleBarContainerStyle)}>\n          {image?.titleIcon}\n          <Stack.Item className={mergeStyles(titleStyle(theme))} aria-label={image?.title}>\n            {image?.title}\n          </Stack.Item>\n        </Stack>\n        <Stack className={mergeStyles(controlBarContainerStyle)}>\n          <DefaultButton\n            className={mergeStyles(downloadButtonStyle(theme))}\n            /* @conditional-compile-remove(image-gallery) */\n            text={localeStrings.downloadButtonLabel}\n            onClick={() => onImageDownloadButtonClicked(image?.imageUrl || '', image?.downloadFilename || 'image')}\n            onRenderIcon={() => <Icon iconName={downloadIcon.iconName} className={mergeStyles(downloadIconStyle)} />}\n            aria-live={'polite'}\n            /* @conditional-compile-remove(image-gallery) */\n            aria-label={localeStrings.downloadButtonLabel}\n          />\n          <IconButton\n            iconProps={downloadIcon}\n            className={mergeStyles(smallDownloadButtonContainerStyle(theme))}\n            onClick={() => onImageDownloadButtonClicked(image?.imageUrl, image?.downloadFilename)}\n            /* @conditional-compile-remove(image-gallery) */\n            aria-label={localeStrings.downloadButtonLabel}\n            aria-live={'polite'}\n          />\n          <IconButton\n            iconProps={cancelIcon}\n            className={mergeStyles(closeButtonStyles(theme))}\n            onClick={onDismiss}\n            /* @conditional-compile-remove(image-gallery) */\n            ariaLabel={localeStrings.dismissButtonAriaLabel}\n            aria-live={'polite'}\n          />\n        </Stack>\n      </Stack>\n    );\n  };\n\n  const renderBodyWithLightDismiss = (): JSX.Element => {\n    return (\n      <Stack className={mergeStyles(bodyContainer)} onClick={() => props.onDismiss()}>\n        <FocusTrapZone\n          onKeyDown={(e) => {\n            if (e.key === 'Escape' || e.key === 'Esc') {\n              onDismiss();\n            }\n          }}\n          // Ensure when the focus trap has focus, the light dismiss area can still be clicked with mouse to dismiss.\n          // Note: this still correctly captures keyboard focus, this just allows mouse click outside of the focus trap.\n          isClickableOutsideFocusTrap={true}\n          className={mergeStyles(bodyFocusZone)}\n        >\n          {images.length > startIndex && (\n            <img\n              src={image?.imageUrl}\n              className={mergeStyles(imageStyle)}\n              alt={image?.altText || 'image'}\n              aria-label={'image-gallery-main-image'}\n              aria-live={'polite'}\n              onError={(event) => {\n                setIsImageLoaded(false);\n                onError && onError(event);\n              }}\n              onClick={(event) => event.stopPropagation()}\n              onDoubleClick={(event) => {\n                event.persist();\n              }}\n            />\n          )}\n        </FocusTrapZone>\n      </Stack>\n    );\n  };\n\n  return (\n    <Modal\n      titleAriaId={image?.title}\n      isOpen={isOpen}\n      onDismiss={onDismiss}\n      overlay={{ styles: { ...overlayStyles(theme) } }}\n      styles={{ main: focusTrapZoneStyle, scrollableContent: scrollableContentStyle }}\n      isDarkOverlay={true}\n    >\n      {renderHeaderBar()}\n      {renderBodyWithLightDismiss()}\n    </Modal>\n  );\n};\n"]}

package/dist/dist-esm/react-components/src/components/VideoGallery/DefaultLayout.js

@@ -73,7 +73,7 @@ export const DefaultLayout = (props) => {
             isShort: isShort, shouldFloatLocalVideo: false, overflowGalleryElements: overflowGalleryTiles, horizontalGalleryStyles: styles === null || styles === void 0 ? void 0 : styles.horizontalGallery, 
             /* @conditional-compile-remove(vertical-gallery) */
             verticalGalleryStyles: styles === null || styles === void 0 ? void 0 : styles.verticalGallery, 
-            /* @conditional-compile-remove(pinned-participants) */
+            /* @conditional-compile-remove(vertical-gallery) */
             overflowGalleryPosition: overflowGalleryPosition, onFetchTilesToRender: setIndexesToRender, onChildrenPerPageChange: (n) => {
                 childrenPerPage.current = n;
             } }));

package/dist/dist-esm/react-components/src/components/VideoGallery/DefaultLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"DefaultLayout.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/VideoGallery/DefaultLayout.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { Stack } from '@fluentui/react';\nimport React, { useMemo, useState, useRef } from 'react';\nimport { GridLayout } from '../GridLayout';\nimport { isNarrowWidth } from '../utils/responsive';\n/* @conditional-compile-remove(vertical-gallery) */\nimport { isShortHeight } from '../utils/responsive';\nimport { LayoutProps } from './Layout';\nimport { rootLayoutStyle } from './styles/DefaultLayout.styles';\nimport { videoGalleryLayoutGap } from './styles/Layout.styles';\nimport { useOrganizedParticipants } from './utils/videoGalleryLayoutUtils';\nimport { OverflowGallery } from './OverflowGallery';\n\n/**\n * Props for {@link DefaultLayout}.\n *\n * @private\n */\nexport type DefaultLayoutProps = LayoutProps;\n\n/**\n * DefaultLayout displays remote participants, local video component, and screen sharing component in\n * a grid an overflow gallery.\n *\n * @private\n */\nexport const DefaultLayout = (props: DefaultLayoutProps): JSX.Element => {\n  const {\n    remoteParticipants = [],\n    localParticipant,\n    dominantSpeakers,\n    localVideoComponent,\n    screenShareComponent,\n    onRenderRemoteParticipant,\n    styles,\n    maxRemoteVideoStreams,\n    parentWidth,\n    /* @conditional-compile-remove(vertical-gallery) */\n    parentHeight,\n    pinnedParticipantUserIds = [],\n    /* @conditional-compile-remove(vertical-gallery) */ overflowGalleryPosition = 'HorizontalBottom'\n  } = props;\n\n  const isNarrow = parentWidth ? isNarrowWidth(parentWidth) : false;\n\n  /* @conditional-compile-remove(vertical-gallery) */\n  const isShort = parentHeight ? isShortHeight(parentHeight) : false;\n\n  // This is for tracking the number of children in the first page of overflow gallery.\n  // This number will be used for the maxOverflowGalleryDominantSpeakers when organizing the remote participants.\n  // We need to add the local participant to the pinned participant count so we are placing the speakers correctly.\n  const childrenPerPage = useRef(4);\n  const { gridParticipants, overflowGalleryParticipants } = useOrganizedParticipants({\n    remoteParticipants,\n    localParticipant,\n    dominantSpeakers,\n    maxRemoteVideoStreams,\n    isScreenShareActive: !!screenShareComponent,\n    maxOverflowGalleryDominantSpeakers: screenShareComponent\n      ? childrenPerPage.current - ((pinnedParticipantUserIds.length + 1) % childrenPerPage.current)\n      : childrenPerPage.current,\n    /* @conditional-compile-remove(pinned-participants) */ pinnedParticipantUserIds,\n    /* @conditional-compile-remove(gallery-layouts) */ layout: 'default'\n  });\n\n  let activeVideoStreams = 0;\n\n  const gridTiles = gridParticipants.map((p) => {\n    return onRenderRemoteParticipant(\n      p,\n      maxRemoteVideoStreams && maxRemoteVideoStreams >= 0\n        ? p.videoStream?.isAvailable && activeVideoStreams++ < maxRemoteVideoStreams\n        : p.videoStream?.isAvailable\n    );\n  });\n\n  /**\n   * instantiate indexes available to render with indexes available that would be on first page\n   *\n   * For some components which do not strictly follow the order of the array, we might\n   * re-render the initial tiles -> dispose them -> create new tiles, we need to take care of\n   * this case when those components are here\n   */\n  const [indexesToRender, setIndexesToRender] = useState<number[]>([]);\n\n  const overflowGalleryTiles = overflowGalleryParticipants.map((p, i) => {\n    return onRenderRemoteParticipant(\n      p,\n      maxRemoteVideoStreams && maxRemoteVideoStreams >= 0\n        ? p.videoStream?.isAvailable && indexesToRender.includes(i) && activeVideoStreams++ < maxRemoteVideoStreams\n        : p.videoStream?.isAvailable\n    );\n  });\n\n  if (localVideoComponent) {\n    gridTiles.push(localVideoComponent);\n  }\n\n  const overflowGallery = useMemo(() => {\n    if (overflowGalleryTiles.length === 0) {\n      return null;\n    }\n    return (\n      <OverflowGallery\n        isNarrow={isNarrow}\n        /* @conditional-compile-remove(vertical-gallery) */\n        isShort={isShort}\n        shouldFloatLocalVideo={false}\n        overflowGalleryElements={overflowGalleryTiles}\n        horizontalGalleryStyles={styles?.horizontalGallery}\n        /* @conditional-compile-remove(vertical-gallery) */\n        verticalGalleryStyles={styles?.verticalGallery}\n        /* @conditional-compile-remove(pinned-participants) */\n        overflowGalleryPosition={overflowGalleryPosition}\n        onFetchTilesToRender={setIndexesToRender}\n        onChildrenPerPageChange={(n: number) => {\n          childrenPerPage.current = n;\n        }}\n      />\n    );\n  }, [\n    isNarrow,\n    /* @conditional-compile-remove(vertical-gallery) */ isShort,\n    overflowGalleryTiles,\n    styles?.horizontalGallery,\n    /* @conditional-compile-remove(vertical-gallery) */ overflowGalleryPosition,\n    setIndexesToRender,\n    /* @conditional-compile-remove(vertical-gallery) */ styles?.verticalGallery\n  ]);\n\n  return (\n    <Stack\n      /* @conditional-compile-remove(vertical-gallery) */\n      horizontal={overflowGalleryPosition === 'VerticalRight'}\n      styles={rootLayoutStyle}\n      tokens={videoGalleryLayoutGap}\n    >\n      {\n        /* @conditional-compile-remove(gallery-layouts) */ props.overflowGalleryPosition === 'HorizontalTop' ? (\n          overflowGallery\n        ) : (\n          <></>\n        )\n      }\n      {screenShareComponent ? (\n        screenShareComponent\n      ) : (\n        <GridLayout key=\"grid-layout\" styles={styles?.gridLayout}>\n          {gridTiles}\n        </GridLayout>\n      )}\n      {overflowGalleryTrampoline(\n        overflowGallery,\n        /* @conditional-compile-remove(gallery-layouts) */ props.overflowGalleryPosition\n      )}\n    </Stack>\n  );\n};\n\nconst overflowGalleryTrampoline = (\n  gallery: JSX.Element | null,\n  galleryPosition?: 'HorizontalBottom' | 'VerticalRight' | 'HorizontalTop'\n): JSX.Element | null => {\n  /* @conditional-compile-remove(gallery-layouts) */\n  return galleryPosition !== 'HorizontalTop' ? gallery : <></>;\n  return gallery;\n};\n"]}
+{"version":3,"file":"DefaultLayout.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/VideoGallery/DefaultLayout.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AACxC,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACzD,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACpD,mDAAmD;AACnD,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAEpD,OAAO,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAC;AAChE,OAAO,EAAE,qBAAqB,EAAE,MAAM,wBAAwB,CAAC;AAC/D,OAAO,EAAE,wBAAwB,EAAE,MAAM,iCAAiC,CAAC;AAC3E,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AASpD;;;;;GAKG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,KAAyB,EAAe,EAAE;IACtE,MAAM,EACJ,kBAAkB,GAAG,EAAE,EACvB,gBAAgB,EAChB,gBAAgB,EAChB,mBAAmB,EACnB,oBAAoB,EACpB,yBAAyB,EACzB,MAAM,EACN,qBAAqB,EACrB,WAAW;IACX,mDAAmD;IACnD,YAAY,EACZ,wBAAwB,GAAG,EAAE;IAC7B,mDAAmD,CAAC,uBAAuB,GAAG,kBAAkB,EACjG,GAAG,KAAK,CAAC;IAEV,MAAM,QAAQ,GAAG,WAAW,CAAC,CAAC,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;IAElE,mDAAmD;IACnD,MAAM,OAAO,GAAG,YAAY,CAAC,CAAC,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;IAEnE,qFAAqF;IACrF,+GAA+G;IAC/G,iHAAiH;IACjH,MAAM,eAAe,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC;IAClC,MAAM,EAAE,gBAAgB,EAAE,2BAA2B,EAAE,GAAG,wBAAwB,CAAC;QACjF,kBAAkB;QAClB,gBAAgB;QAChB,gBAAgB;QAChB,qBAAqB;QACrB,mBAAmB,EAAE,CAAC,CAAC,oBAAoB;QAC3C,kCAAkC,EAAE,oBAAoB;YACtD,CAAC,CAAC,eAAe,CAAC,OAAO,GAAG,CAAC,CAAC,wBAAwB,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,eAAe,CAAC,OAAO,CAAC;YAC7F,CAAC,CAAC,eAAe,CAAC,OAAO;QAC3B,sDAAsD,CAAC,wBAAwB;QAC/E,kDAAkD,CAAC,MAAM,EAAE,SAAS;KACrE,CAAC,CAAC;IAEH,IAAI,kBAAkB,GAAG,CAAC,CAAC;IAE3B,MAAM,SAAS,GAAG,gBAAgB,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE;;QAC3C,OAAO,yBAAyB,CAC9B,CAAC,EACD,qBAAqB,IAAI,qBAAqB,IAAI,CAAC;YACjD,CAAC,CAAC,CAAA,MAAA,CAAC,CAAC,WAAW,0CAAE,WAAW,KAAI,kBAAkB,EAAE,GAAG,qBAAqB;YAC5E,CAAC,CAAC,MAAA,CAAC,CAAC,WAAW,0CAAE,WAAW,CAC/B,CAAC;IACJ,CAAC,CAAC,CAAC;IAEH;;;;;;OAMG;IACH,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAW,EAAE,CAAC,CAAC;IAErE,MAAM,oBAAoB,GAAG,2BAA2B,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;;QACpE,OAAO,yBAAyB,CAC9B,CAAC,EACD,qBAAqB,IAAI,qBAAqB,IAAI,CAAC;YACjD,CAAC,CAAC,CAAA,MAAA,CAAC,CAAC,WAAW,0CAAE,WAAW,KAAI,eAAe,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,kBAAkB,EAAE,GAAG,qBAAqB;YAC3G,CAAC,CAAC,MAAA,CAAC,CAAC,WAAW,0CAAE,WAAW,CAC/B,CAAC;IACJ,CAAC,CAAC,CAAC;IAEH,IAAI,mBAAmB,EAAE;QACvB,SAAS,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAC;KACrC;IAED,MAAM,eAAe,GAAG,OAAO,CAAC,GAAG,EAAE;QACnC,IAAI,oBAAoB,CAAC,MAAM,KAAK,CAAC,EAAE;YACrC,OAAO,IAAI,CAAC;SACb;QACD,OAAO,CACL,oBAAC,eAAe,IACd,QAAQ,EAAE,QAAQ;YAClB,mDAAmD;YACnD,OAAO,EAAE,OAAO,EAChB,qBAAqB,EAAE,KAAK,EAC5B,uBAAuB,EAAE,oBAAoB,EAC7C,uBAAuB,EAAE,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,iBAAiB;YAClD,mDAAmD;YACnD,qBAAqB,EAAE,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,eAAe;YAC9C,mDAAmD;YACnD,uBAAuB,EAAE,uBAAuB,EAChD,oBAAoB,EAAE,kBAAkB,EACxC,uBAAuB,EAAE,CAAC,CAAS,EAAE,EAAE;gBACrC,eAAe,CAAC,OAAO,GAAG,CAAC,CAAC;YAC9B,CAAC,GACD,CACH,CAAC;IACJ,CAAC,EAAE;QACD,QAAQ;QACR,mDAAmD,CAAC,OAAO;QAC3D,oBAAoB;QACpB,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,iBAAiB;QACzB,mDAAmD,CAAC,uBAAuB;QAC3E,kBAAkB;QAClB,mDAAmD,CAAC,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,eAAe;KAC5E,CAAC,CAAC;IAEH,OAAO,CACL,oBAAC,KAAK;IACJ,mDAAmD;;QAAnD,mDAAmD;QACnD,UAAU,EAAE,uBAAuB,KAAK,eAAe,EACvD,MAAM,EAAE,eAAe,EACvB,MAAM,EAAE,qBAAqB;QAG3B,kDAAkD,CAAC,KAAK,CAAC,uBAAuB,KAAK,eAAe,CAAC,CAAC,CAAC,CACrG,eAAe,CAChB,CAAC,CAAC,CAAC,CACF,yCAAK,CACN;QAEF,oBAAoB,CAAC,CAAC,CAAC,CACtB,oBAAoB,CACrB,CAAC,CAAC,CAAC,CACF,oBAAC,UAAU,IAAC,GAAG,EAAC,aAAa,EAAC,MAAM,EAAE,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,UAAU,IACrD,SAAS,CACC,CACd;QACA,yBAAyB,CACxB,eAAe;QACf,kDAAkD,CAAC,KAAK,CAAC,uBAAuB,CACjF,CACK,CACT,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,yBAAyB,GAAG,CAChC,OAA2B,EAC3B,eAAwE,EACpD,EAAE;IACtB,kDAAkD;IAClD,OAAO,eAAe,KAAK,eAAe,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,yCAAK,CAAC;IAC7D,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { Stack } from '@fluentui/react';\nimport React, { useMemo, useState, useRef } from 'react';\nimport { GridLayout } from '../GridLayout';\nimport { isNarrowWidth } from '../utils/responsive';\n/* @conditional-compile-remove(vertical-gallery) */\nimport { isShortHeight } from '../utils/responsive';\nimport { LayoutProps } from './Layout';\nimport { rootLayoutStyle } from './styles/DefaultLayout.styles';\nimport { videoGalleryLayoutGap } from './styles/Layout.styles';\nimport { useOrganizedParticipants } from './utils/videoGalleryLayoutUtils';\nimport { OverflowGallery } from './OverflowGallery';\n\n/**\n * Props for {@link DefaultLayout}.\n *\n * @private\n */\nexport type DefaultLayoutProps = LayoutProps;\n\n/**\n * DefaultLayout displays remote participants, local video component, and screen sharing component in\n * a grid an overflow gallery.\n *\n * @private\n */\nexport const DefaultLayout = (props: DefaultLayoutProps): JSX.Element => {\n  const {\n    remoteParticipants = [],\n    localParticipant,\n    dominantSpeakers,\n    localVideoComponent,\n    screenShareComponent,\n    onRenderRemoteParticipant,\n    styles,\n    maxRemoteVideoStreams,\n    parentWidth,\n    /* @conditional-compile-remove(vertical-gallery) */\n    parentHeight,\n    pinnedParticipantUserIds = [],\n    /* @conditional-compile-remove(vertical-gallery) */ overflowGalleryPosition = 'HorizontalBottom'\n  } = props;\n\n  const isNarrow = parentWidth ? isNarrowWidth(parentWidth) : false;\n\n  /* @conditional-compile-remove(vertical-gallery) */\n  const isShort = parentHeight ? isShortHeight(parentHeight) : false;\n\n  // This is for tracking the number of children in the first page of overflow gallery.\n  // This number will be used for the maxOverflowGalleryDominantSpeakers when organizing the remote participants.\n  // We need to add the local participant to the pinned participant count so we are placing the speakers correctly.\n  const childrenPerPage = useRef(4);\n  const { gridParticipants, overflowGalleryParticipants } = useOrganizedParticipants({\n    remoteParticipants,\n    localParticipant,\n    dominantSpeakers,\n    maxRemoteVideoStreams,\n    isScreenShareActive: !!screenShareComponent,\n    maxOverflowGalleryDominantSpeakers: screenShareComponent\n      ? childrenPerPage.current - ((pinnedParticipantUserIds.length + 1) % childrenPerPage.current)\n      : childrenPerPage.current,\n    /* @conditional-compile-remove(pinned-participants) */ pinnedParticipantUserIds,\n    /* @conditional-compile-remove(gallery-layouts) */ layout: 'default'\n  });\n\n  let activeVideoStreams = 0;\n\n  const gridTiles = gridParticipants.map((p) => {\n    return onRenderRemoteParticipant(\n      p,\n      maxRemoteVideoStreams && maxRemoteVideoStreams >= 0\n        ? p.videoStream?.isAvailable && activeVideoStreams++ < maxRemoteVideoStreams\n        : p.videoStream?.isAvailable\n    );\n  });\n\n  /**\n   * instantiate indexes available to render with indexes available that would be on first page\n   *\n   * For some components which do not strictly follow the order of the array, we might\n   * re-render the initial tiles -> dispose them -> create new tiles, we need to take care of\n   * this case when those components are here\n   */\n  const [indexesToRender, setIndexesToRender] = useState<number[]>([]);\n\n  const overflowGalleryTiles = overflowGalleryParticipants.map((p, i) => {\n    return onRenderRemoteParticipant(\n      p,\n      maxRemoteVideoStreams && maxRemoteVideoStreams >= 0\n        ? p.videoStream?.isAvailable && indexesToRender.includes(i) && activeVideoStreams++ < maxRemoteVideoStreams\n        : p.videoStream?.isAvailable\n    );\n  });\n\n  if (localVideoComponent) {\n    gridTiles.push(localVideoComponent);\n  }\n\n  const overflowGallery = useMemo(() => {\n    if (overflowGalleryTiles.length === 0) {\n      return null;\n    }\n    return (\n      <OverflowGallery\n        isNarrow={isNarrow}\n        /* @conditional-compile-remove(vertical-gallery) */\n        isShort={isShort}\n        shouldFloatLocalVideo={false}\n        overflowGalleryElements={overflowGalleryTiles}\n        horizontalGalleryStyles={styles?.horizontalGallery}\n        /* @conditional-compile-remove(vertical-gallery) */\n        verticalGalleryStyles={styles?.verticalGallery}\n        /* @conditional-compile-remove(vertical-gallery) */\n        overflowGalleryPosition={overflowGalleryPosition}\n        onFetchTilesToRender={setIndexesToRender}\n        onChildrenPerPageChange={(n: number) => {\n          childrenPerPage.current = n;\n        }}\n      />\n    );\n  }, [\n    isNarrow,\n    /* @conditional-compile-remove(vertical-gallery) */ isShort,\n    overflowGalleryTiles,\n    styles?.horizontalGallery,\n    /* @conditional-compile-remove(vertical-gallery) */ overflowGalleryPosition,\n    setIndexesToRender,\n    /* @conditional-compile-remove(vertical-gallery) */ styles?.verticalGallery\n  ]);\n\n  return (\n    <Stack\n      /* @conditional-compile-remove(vertical-gallery) */\n      horizontal={overflowGalleryPosition === 'VerticalRight'}\n      styles={rootLayoutStyle}\n      tokens={videoGalleryLayoutGap}\n    >\n      {\n        /* @conditional-compile-remove(gallery-layouts) */ props.overflowGalleryPosition === 'HorizontalTop' ? (\n          overflowGallery\n        ) : (\n          <></>\n        )\n      }\n      {screenShareComponent ? (\n        screenShareComponent\n      ) : (\n        <GridLayout key=\"grid-layout\" styles={styles?.gridLayout}>\n          {gridTiles}\n        </GridLayout>\n      )}\n      {overflowGalleryTrampoline(\n        overflowGallery,\n        /* @conditional-compile-remove(gallery-layouts) */ props.overflowGalleryPosition\n      )}\n    </Stack>\n  );\n};\n\nconst overflowGalleryTrampoline = (\n  gallery: JSX.Element | null,\n  galleryPosition?: 'HorizontalBottom' | 'VerticalRight' | 'HorizontalTop'\n): JSX.Element | null => {\n  /* @conditional-compile-remove(gallery-layouts) */\n  return galleryPosition !== 'HorizontalTop' ? gallery : <></>;\n  return gallery;\n};\n"]}

package/dist/dist-esm/react-components/src/components/VideoGallery/OverflowGallery.js

@@ -6,7 +6,6 @@ import { ResponsiveHorizontalGallery } from '../ResponsiveHorizontalGallery';
 /* @conditional-compile-remove(vertical-gallery) */
 import { ResponsiveVerticalGallery } from '../ResponsiveVerticalGallery';
 import { HORIZONTAL_GALLERY_BUTTON_WIDTH, HORIZONTAL_GALLERY_GAP } from '../styles/HorizontalGallery.styles';
-/* @conditional-compile-remove(pinned-participants) */
 import { ScrollableHorizontalGallery } from './ScrollableHorizontalGallery';
 import { horizontalGalleryContainerStyle, horizontalGalleryStyle } from './styles/VideoGalleryResponsiveHorizontalGallery.styles';
 /* @conditional-compile-remove(vertical-gallery) */

package/dist/dist-esm/react-components/src/components/VideoGallery/OverflowGallery.js.map

@@ -1 +1 @@
-{"version":3,"file":"OverflowGallery.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/VideoGallery/OverflowGallery.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { concatStyleSets } from '@fluentui/react';\nimport React, { useMemo } from 'react';\nimport { HorizontalGalleryStyles } from '../HorizontalGallery';\nimport { ResponsiveHorizontalGallery } from '../ResponsiveHorizontalGallery';\n/* @conditional-compile-remove(vertical-gallery) */\nimport { ResponsiveVerticalGallery } from '../ResponsiveVerticalGallery';\nimport { HORIZONTAL_GALLERY_BUTTON_WIDTH, HORIZONTAL_GALLERY_GAP } from '../styles/HorizontalGallery.styles';\n/* @conditional-compile-remove(vertical-gallery) */\nimport { VerticalGalleryStyles } from '../VerticalGallery';\n/* @conditional-compile-remove(vertical-gallery) */\nimport { OverflowGalleryPosition } from '../VideoGallery';\n/* @conditional-compile-remove(pinned-participants) */\nimport { ScrollableHorizontalGallery } from './ScrollableHorizontalGallery';\nimport {\n  horizontalGalleryContainerStyle,\n  horizontalGalleryStyle\n} from './styles/VideoGalleryResponsiveHorizontalGallery.styles';\n/* @conditional-compile-remove(vertical-gallery) */\nimport {\n  verticalGalleryContainerStyle,\n  verticalGalleryStyle\n} from './styles/VideoGalleryResponsiveVerticalGallery.styles';\n\n/**\n * A ResponsiveHorizontalGallery styled for the {@link VideoGallery}\n *\n * @private\n */\nexport const OverflowGallery = (props: {\n  shouldFloatLocalVideo?: boolean;\n  onFetchTilesToRender?: (indexes: number[]) => void;\n  isNarrow?: boolean;\n  /* @conditional-compile-remove(vertical-gallery) */\n  isShort?: boolean;\n  overflowGalleryElements?: JSX.Element[];\n  horizontalGalleryStyles?: HorizontalGalleryStyles;\n  /* @conditional-compile-remove(vertical-gallery) */\n  verticalGalleryStyles?: VerticalGalleryStyles;\n  /* @conditional-compile-remove(vertical-gallery) */\n  overflowGalleryPosition?: OverflowGalleryPosition;\n  onChildrenPerPageChange?: (childrenPerPage: number) => void;\n}): JSX.Element => {\n  const {\n    shouldFloatLocalVideo = false,\n    onFetchTilesToRender,\n    isNarrow = false,\n    /* @conditional-compile-remove(vertical-gallery) */\n    isShort = false,\n    overflowGalleryElements,\n    horizontalGalleryStyles,\n    /* @conditional-compile-remove(vertical-gallery) */ overflowGalleryPosition = 'HorizontalBottom',\n    /* @conditional-compile-remove(vertical-gallery) */ verticalGalleryStyles,\n    onChildrenPerPageChange\n  } = props;\n\n  const containerStyles = useMemo(() => {\n    /* @conditional-compile-remove(vertical-gallery) */\n    if (overflowGalleryPosition === 'VerticalRight') {\n      return verticalGalleryContainerStyle(shouldFloatLocalVideo, isNarrow, isShort);\n    }\n    return horizontalGalleryContainerStyle(shouldFloatLocalVideo, isNarrow);\n  }, [\n    shouldFloatLocalVideo,\n    /* @conditional-compile-remove(vertical-gallery) */ isShort,\n    isNarrow,\n    /* @conditional-compile-remove(vertical-gallery) */ overflowGalleryPosition\n  ]);\n\n  const galleryStyles = useMemo(() => {\n    /* @conditional-compile-remove(vertical-gallery) */\n    if (overflowGalleryPosition === 'VerticalRight') {\n      return concatStyleSets(verticalGalleryStyle(isShort), verticalGalleryStyles);\n    }\n    return concatStyleSets(horizontalGalleryStyle(isNarrow), horizontalGalleryStyles);\n  }, [\n    isNarrow,\n    /* @conditional-compile-remove(vertical-gallery) */ isShort,\n    horizontalGalleryStyles,\n    /* @conditional-compile-remove(vertical-gallery) */ overflowGalleryPosition,\n    /* @conditional-compile-remove(vertical-gallery) */ verticalGalleryStyles\n  ]);\n\n  /* @conditional-compile-remove(vertical-gallery) */\n  if (overflowGalleryPosition === 'VerticalRight') {\n    return (\n      <ResponsiveVerticalGallery\n        key=\"responsive-vertical-gallery\"\n        containerStyles={containerStyles}\n        verticalGalleryStyles={galleryStyles as VerticalGalleryStyles}\n        controlBarHeightRem={HORIZONTAL_GALLERY_BUTTON_WIDTH}\n        gapHeightRem={HORIZONTAL_GALLERY_GAP}\n        isShort={isShort}\n        onFetchTilesToRender={onFetchTilesToRender}\n        onChildrenPerPageChange={onChildrenPerPageChange}\n      >\n        {overflowGalleryElements ? overflowGalleryElements : [<></>]}\n      </ResponsiveVerticalGallery>\n    );\n  }\n\n  /* @conditional-compile-remove(pinned-participants) */\n  if (isNarrow) {\n    // There are no pages for ScrollableHorizontalGallery so we will approximate the first 3 remote\n    // participant tiles are visible\n    onChildrenPerPageChange?.(3);\n    return (\n      <ScrollableHorizontalGallery\n        horizontalGalleryElements={overflowGalleryElements ? overflowGalleryElements : [<></>]}\n        onFetchTilesToRender={onFetchTilesToRender}\n        key=\"scrollable-horizontal-gallery\"\n      />\n    );\n  }\n\n  return (\n    <ResponsiveHorizontalGallery\n      key=\"responsive-horizontal-gallery\"\n      containerStyles={containerStyles}\n      onFetchTilesToRender={onFetchTilesToRender}\n      horizontalGalleryStyles={galleryStyles}\n      buttonWidthRem={HORIZONTAL_GALLERY_BUTTON_WIDTH}\n      gapWidthRem={HORIZONTAL_GALLERY_GAP}\n      onChildrenPerPageChange={onChildrenPerPageChange}\n    >\n      {overflowGalleryElements ? overflowGalleryElements : [<></>]}\n    </ResponsiveHorizontalGallery>\n  );\n};\n"]}
+{"version":3,"file":"OverflowGallery.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/VideoGallery/OverflowGallery.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { concatStyleSets } from '@fluentui/react';\nimport React, { useMemo } from 'react';\nimport { HorizontalGalleryStyles } from '../HorizontalGallery';\nimport { ResponsiveHorizontalGallery } from '../ResponsiveHorizontalGallery';\n/* @conditional-compile-remove(vertical-gallery) */\nimport { ResponsiveVerticalGallery } from '../ResponsiveVerticalGallery';\nimport { HORIZONTAL_GALLERY_BUTTON_WIDTH, HORIZONTAL_GALLERY_GAP } from '../styles/HorizontalGallery.styles';\n/* @conditional-compile-remove(vertical-gallery) */\nimport { VerticalGalleryStyles } from '../VerticalGallery';\n/* @conditional-compile-remove(vertical-gallery) */\nimport { OverflowGalleryPosition } from '../VideoGallery';\nimport { ScrollableHorizontalGallery } from './ScrollableHorizontalGallery';\nimport {\n  horizontalGalleryContainerStyle,\n  horizontalGalleryStyle\n} from './styles/VideoGalleryResponsiveHorizontalGallery.styles';\n/* @conditional-compile-remove(vertical-gallery) */\nimport {\n  verticalGalleryContainerStyle,\n  verticalGalleryStyle\n} from './styles/VideoGalleryResponsiveVerticalGallery.styles';\n\n/**\n * A ResponsiveHorizontalGallery styled for the {@link VideoGallery}\n *\n * @private\n */\nexport const OverflowGallery = (props: {\n  shouldFloatLocalVideo?: boolean;\n  onFetchTilesToRender?: (indexes: number[]) => void;\n  isNarrow?: boolean;\n  /* @conditional-compile-remove(vertical-gallery) */\n  isShort?: boolean;\n  overflowGalleryElements?: JSX.Element[];\n  horizontalGalleryStyles?: HorizontalGalleryStyles;\n  /* @conditional-compile-remove(vertical-gallery) */\n  verticalGalleryStyles?: VerticalGalleryStyles;\n  /* @conditional-compile-remove(vertical-gallery) */\n  overflowGalleryPosition?: OverflowGalleryPosition;\n  onChildrenPerPageChange?: (childrenPerPage: number) => void;\n}): JSX.Element => {\n  const {\n    shouldFloatLocalVideo = false,\n    onFetchTilesToRender,\n    isNarrow = false,\n    /* @conditional-compile-remove(vertical-gallery) */\n    isShort = false,\n    overflowGalleryElements,\n    horizontalGalleryStyles,\n    /* @conditional-compile-remove(vertical-gallery) */ overflowGalleryPosition = 'HorizontalBottom',\n    /* @conditional-compile-remove(vertical-gallery) */ verticalGalleryStyles,\n    onChildrenPerPageChange\n  } = props;\n\n  const containerStyles = useMemo(() => {\n    /* @conditional-compile-remove(vertical-gallery) */\n    if (overflowGalleryPosition === 'VerticalRight') {\n      return verticalGalleryContainerStyle(shouldFloatLocalVideo, isNarrow, isShort);\n    }\n    return horizontalGalleryContainerStyle(shouldFloatLocalVideo, isNarrow);\n  }, [\n    shouldFloatLocalVideo,\n    /* @conditional-compile-remove(vertical-gallery) */ isShort,\n    isNarrow,\n    /* @conditional-compile-remove(vertical-gallery) */ overflowGalleryPosition\n  ]);\n\n  const galleryStyles = useMemo(() => {\n    /* @conditional-compile-remove(vertical-gallery) */\n    if (overflowGalleryPosition === 'VerticalRight') {\n      return concatStyleSets(verticalGalleryStyle(isShort), verticalGalleryStyles);\n    }\n    return concatStyleSets(horizontalGalleryStyle(isNarrow), horizontalGalleryStyles);\n  }, [\n    isNarrow,\n    /* @conditional-compile-remove(vertical-gallery) */ isShort,\n    horizontalGalleryStyles,\n    /* @conditional-compile-remove(vertical-gallery) */ overflowGalleryPosition,\n    /* @conditional-compile-remove(vertical-gallery) */ verticalGalleryStyles\n  ]);\n\n  /* @conditional-compile-remove(vertical-gallery) */\n  if (overflowGalleryPosition === 'VerticalRight') {\n    return (\n      <ResponsiveVerticalGallery\n        key=\"responsive-vertical-gallery\"\n        containerStyles={containerStyles}\n        verticalGalleryStyles={galleryStyles as VerticalGalleryStyles}\n        controlBarHeightRem={HORIZONTAL_GALLERY_BUTTON_WIDTH}\n        gapHeightRem={HORIZONTAL_GALLERY_GAP}\n        isShort={isShort}\n        onFetchTilesToRender={onFetchTilesToRender}\n        onChildrenPerPageChange={onChildrenPerPageChange}\n      >\n        {overflowGalleryElements ? overflowGalleryElements : [<></>]}\n      </ResponsiveVerticalGallery>\n    );\n  }\n\n  /* @conditional-compile-remove(pinned-participants) */\n  if (isNarrow) {\n    // There are no pages for ScrollableHorizontalGallery so we will approximate the first 3 remote\n    // participant tiles are visible\n    onChildrenPerPageChange?.(3);\n    return (\n      <ScrollableHorizontalGallery\n        horizontalGalleryElements={overflowGalleryElements ? overflowGalleryElements : [<></>]}\n        onFetchTilesToRender={onFetchTilesToRender}\n        key=\"scrollable-horizontal-gallery\"\n      />\n    );\n  }\n\n  return (\n    <ResponsiveHorizontalGallery\n      key=\"responsive-horizontal-gallery\"\n      containerStyles={containerStyles}\n      onFetchTilesToRender={onFetchTilesToRender}\n      horizontalGalleryStyles={galleryStyles}\n      buttonWidthRem={HORIZONTAL_GALLERY_BUTTON_WIDTH}\n      gapWidthRem={HORIZONTAL_GALLERY_GAP}\n      onChildrenPerPageChange={onChildrenPerPageChange}\n    >\n      {overflowGalleryElements ? overflowGalleryElements : [<></>]}\n    </ResponsiveHorizontalGallery>\n  );\n};\n"]}

package/dist/dist-esm/react-components/src/components/VideoGallery.d.ts

@@ -190,7 +190,7 @@ export interface VideoGalleryProps {
      *
      * @defaultValue \{ kind: 'contextual' \}
      */
-    remoteVideoTileMenuOptions?: false | VideoTileContextualMenuProps | VideoTileDrawerMenuProps;
+    remoteVideoTileMenu?: false | VideoTileContextualMenuProps | VideoTileDrawerMenuProps;
     /**
      * Determines the layout of the overflowGallery inside the VideoGallery.
      * @defaultValue 'HorizontalBottom'
@@ -207,7 +207,7 @@ export interface VideoGalleryProps {
 /**
  * Properties for showing contextual menu for remote {@link VideoTile} components in {@link VideoGallery}.
  *
- * @beta
+ * @public
  */
 export interface VideoTileContextualMenuProps {
     /**
@@ -218,7 +218,7 @@ export interface VideoTileContextualMenuProps {
 /**
  * Properties for showing drawer menu on remote {@link VideoTile} long touch in {@link VideoGallery}.
  *
- * @beta
+ * @public
  */
 export interface VideoTileDrawerMenuProps {
     /**

package/dist/dist-esm/react-components/src/components/VideoGallery.js

@@ -72,7 +72,7 @@ export const VideoGallery = (props) => {
     /* @conditional-compile-remove(pinned-participants) */
     onUnpinParticipant: onUnpinParticipantHandler, 
     /* @conditional-compile-remove(pinned-participants) */
-    remoteVideoTileMenuOptions = DEFAULT_REMOTE_VIDEO_TILE_MENU_OPTIONS, 
+    remoteVideoTileMenu = DEFAULT_REMOTE_VIDEO_TILE_MENU_OPTIONS, 
     /* @conditional-compile-remove(vertical-gallery) */
     overflowGalleryPosition = 'HorizontalBottom', 
     /* @conditional-compile-remove(rooms) */
@@ -82,8 +82,8 @@ export const VideoGallery = (props) => {
     const localeStrings = useLocale().strings.videoGallery;
     const strings = useMemo(() => (Object.assign(Object.assign({}, localeStrings), props.strings)), [localeStrings, props.strings]);
     /* @conditional-compile-remove(pinned-participants) */
-    const drawerMenuHostIdFromProp = remoteVideoTileMenuOptions && remoteVideoTileMenuOptions.kind === 'drawer'
-        ? remoteVideoTileMenuOptions.hostId
+    const drawerMenuHostIdFromProp = remoteVideoTileMenu && remoteVideoTileMenu.kind === 'drawer'
+        ? remoteVideoTileMenu.hostId
         : undefined;
     /* @conditional-compile-remove(pinned-participants) */
     const drawerMenuHostId = useId('drawerMenuHost', drawerMenuHostIdFromProp);
@@ -219,8 +219,8 @@ export const VideoGallery = (props) => {
             /* @conditional-compile-remove(pinned-participants) */
             menuKind: participant.userId === localParticipant.userId
                 ? undefined
-                : remoteVideoTileMenuOptions
-                    ? remoteVideoTileMenuOptions.kind === 'drawer'
+                : remoteVideoTileMenu
+                    ? remoteVideoTileMenu.kind === 'drawer'
                         ? 'drawer'
                         : 'contextual'
                     : undefined, 
@@ -246,13 +246,13 @@ export const VideoGallery = (props) => {
         onRenderAvatar,
         showMuteIndicator,
         strings,
+        /* @conditional-compile-remove(pinned-participants) */ drawerMenuHostId,
+        /* @conditional-compile-remove(pinned-participants) */ remoteVideoTileMenu,
         /* @conditional-compile-remove(pinned-participants) */ selectedScalingModeState,
-        /* @conditional-compile-remove(pinned-participants) */ remoteVideoTileMenuOptions,
         /* @conditional-compile-remove(pinned-participants) */ pinnedParticipants,
         /* @conditional-compile-remove(pinned-participants) */ onPinParticipant,
         /* @conditional-compile-remove(pinned-participants) */ onUnpinParticipant,
         /* @conditional-compile-remove(pinned-participants) */ toggleAnnouncerString,
-        /* @conditional-compile-remove(pinned-participants) */ drawerMenuHostId,
         /* @conditional-compile-remove(pinned-participants) */ onUpdateScalingMode
     ]);
     const screenShareParticipant = remoteParticipants.find((participant) => { var _a; return (_a = participant.screenShareStream) === null || _a === void 0 ? void 0 : _a.isAvailable; });