@azure/communication-react 1.5.1-alpha-202303030153 → 1.5.1-alpha-202303040013

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (34) hide show
  1. package/dist/communication-react.d.ts +4 -4
  2. package/dist/dist-cjs/communication-react/index.js +231 -172
  3. package/dist/dist-cjs/communication-react/index.js.map +1 -1
  4. package/dist/dist-esm/acs-ui-common/src/telemetryVersion.js +1 -1
  5. package/dist/dist-esm/acs-ui-common/src/telemetryVersion.js.map +1 -1
  6. package/dist/dist-esm/react-components/src/components/Caption.d.ts +23 -0
  7. package/dist/dist-esm/react-components/src/components/Caption.js +46 -0
  8. package/dist/dist-esm/react-components/src/components/Caption.js.map +1 -0
  9. package/dist/dist-esm/react-components/src/components/HorizontalGallery.js +2 -2
  10. package/dist/dist-esm/react-components/src/components/HorizontalGallery.js.map +1 -1
  11. package/dist/dist-esm/react-components/src/components/MessageThread.js +19 -7
  12. package/dist/dist-esm/react-components/src/components/MessageThread.js.map +1 -1
  13. package/dist/dist-esm/react-components/src/components/ResponsiveVerticalGallery.js +3 -1
  14. package/dist/dist-esm/react-components/src/components/ResponsiveVerticalGallery.js.map +1 -1
  15. package/dist/dist-esm/react-components/src/components/VerticalGallery.js +4 -2
  16. package/dist/dist-esm/react-components/src/components/VerticalGallery.js.map +1 -1
  17. package/dist/dist-esm/react-components/src/components/VideoGallery/FloatingLocalVideoLayout.js +14 -8
  18. package/dist/dist-esm/react-components/src/components/VideoGallery/FloatingLocalVideoLayout.js.map +1 -1
  19. package/dist/dist-esm/react-components/src/components/VideoGallery/OverflowGallery.js +1 -1
  20. package/dist/dist-esm/react-components/src/components/VideoGallery/OverflowGallery.js.map +1 -1
  21. package/dist/dist-esm/react-components/src/components/VideoGallery/styles/VideoGalleryResponsiveVerticalGallery.styles.d.ts +1 -1
  22. package/dist/dist-esm/react-components/src/components/VideoGallery/styles/VideoGalleryResponsiveVerticalGallery.styles.js +15 -7
  23. package/dist/dist-esm/react-components/src/components/VideoGallery/styles/VideoGalleryResponsiveVerticalGallery.styles.js.map +1 -1
  24. package/dist/dist-esm/react-components/src/components/index.d.ts +1 -0
  25. package/dist/dist-esm/react-components/src/components/index.js +1 -0
  26. package/dist/dist-esm/react-components/src/components/index.js.map +1 -1
  27. package/dist/dist-esm/react-components/src/identifiers/IdentifierProvider.d.ts +4 -4
  28. package/dist/dist-esm/react-components/src/identifiers/IdentifierProvider.js +2 -2
  29. package/dist/dist-esm/react-components/src/identifiers/IdentifierProvider.js.map +1 -1
  30. package/dist/dist-esm/react-composites/src/composites/CallComposite/components/MediaGallery.js +21 -3
  31. package/dist/dist-esm/react-composites/src/composites/CallComposite/components/MediaGallery.js.map +1 -1
  32. package/dist/dist-esm/react-composites/src/composites/ChatComposite/ChatScreen.js +16 -1
  33. package/dist/dist-esm/react-composites/src/composites/ChatComposite/ChatScreen.js.map +1 -1
  34. package/package.json +8 -8
package/dist/dist-cjs/communication-react/index.js CHANGED
@@ -161,7 +161,7 @@ const _toCommunicationIdentifier = (id) => {
161
161
  // Copyright (c) Microsoft Corporation.
162
162
  // Licensed under the MIT license.
163
163
  // GENERATED FILE. DO NOT EDIT MANUALLY.
164
- var telemetryVersion = '1.5.1-alpha-202303030153';
164
+ var telemetryVersion = '1.5.1-alpha-202303040013';
165
165
 
166
166
  // Copyright (c) Microsoft Corporation.
167
167
  /**
@@ -377,7 +377,7 @@ const getEnvironmentInfo = (state) => {
377
377
 
378
378
  // Copyright (c) Microsoft Corporation.
379
379
  // Licensed under the MIT license.
380
- var __awaiter$D = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
380
+ var __awaiter$E = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
381
381
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
382
382
  return new (P || (P = Promise))(function (resolve, reject) {
383
383
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -415,7 +415,7 @@ const _isPreviewOn = (deviceManager) => {
415
415
  *
416
416
  * @private
417
417
  */
418
- const disposeAllLocalPreviewViews = (callClient) => __awaiter$D(void 0, void 0, void 0, function* () {
418
+ const disposeAllLocalPreviewViews = (callClient) => __awaiter$E(void 0, void 0, void 0, function* () {
419
419
  const unparentedViews = callClient.getState().deviceManager.unparentedViews;
420
420
  for (const view of unparentedViews) {
421
421
  yield callClient.disposeView(undefined, undefined, view);
@@ -548,7 +548,7 @@ const holdButtonSelector = reselect__namespace.createSelector([getCallState], (c
548
548
 
549
549
  // Copyright (c) Microsoft Corporation.
550
550
  // Licensed under the MIT license.
551
- var __awaiter$C = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
551
+ var __awaiter$D = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
552
552
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
553
553
  return new (P || (P = Promise))(function (resolve, reject) {
554
554
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -569,7 +569,7 @@ const areStreamsEqual = (prevStream, newStream) => {
569
569
  * @private
570
570
  */
571
571
  const createDefaultCommonCallingHandlers = memoizeOne__default['default']((callClient, deviceManager, call) => {
572
- const onStartLocalVideo = () => __awaiter$C(void 0, void 0, void 0, function* () {
572
+ const onStartLocalVideo = () => __awaiter$D(void 0, void 0, void 0, function* () {
573
573
  // Before the call object creates a stream, dispose of any local preview streams.
574
574
  // @TODO: is there any way to parent the unparented view to the call object instead
575
575
  // of disposing and creating a new stream?
@@ -589,7 +589,7 @@ const createDefaultCommonCallingHandlers = memoizeOne__default['default']((callC
589
589
  yield call.startVideo(stream);
590
590
  }
591
591
  });
592
- const onStopLocalVideo = (stream) => __awaiter$C(void 0, void 0, void 0, function* () {
592
+ const onStopLocalVideo = (stream) => __awaiter$D(void 0, void 0, void 0, function* () {
593
593
  const callId = call === null || call === void 0 ? void 0 : call.id;
594
594
  if (!callId) {
595
595
  return;
@@ -598,7 +598,7 @@ const createDefaultCommonCallingHandlers = memoizeOne__default['default']((callC
598
598
  yield call.stopVideo(stream);
599
599
  }
600
600
  });
601
- const onToggleCamera = (options) => __awaiter$C(void 0, void 0, void 0, function* () {
601
+ const onToggleCamera = (options) => __awaiter$D(void 0, void 0, void 0, function* () {
602
602
  const previewOn = _isPreviewOn(callClient.getState().deviceManager);
603
603
  if (previewOn && call && call.state === 'Connecting') {
604
604
  // This is to workaround: https://skype.visualstudio.com/SPOOL/_workitems/edit/3030558.
@@ -646,19 +646,19 @@ const createDefaultCommonCallingHandlers = memoizeOne__default['default']((callC
646
646
  }
647
647
  }
648
648
  });
649
- const onSelectMicrophone = (device) => __awaiter$C(void 0, void 0, void 0, function* () {
649
+ const onSelectMicrophone = (device) => __awaiter$D(void 0, void 0, void 0, function* () {
650
650
  if (!deviceManager) {
651
651
  return;
652
652
  }
653
653
  return deviceManager.selectMicrophone(device);
654
654
  });
655
- const onSelectSpeaker = (device) => __awaiter$C(void 0, void 0, void 0, function* () {
655
+ const onSelectSpeaker = (device) => __awaiter$D(void 0, void 0, void 0, function* () {
656
656
  if (!deviceManager) {
657
657
  return;
658
658
  }
659
659
  return deviceManager.selectSpeaker(device);
660
660
  });
661
- const onSelectCamera = (device, options) => __awaiter$C(void 0, void 0, void 0, function* () {
661
+ const onSelectCamera = (device, options) => __awaiter$D(void 0, void 0, void 0, function* () {
662
662
  if (!deviceManager) {
663
663
  return;
664
664
  }
@@ -681,19 +681,19 @@ const createDefaultCommonCallingHandlers = memoizeOne__default['default']((callC
681
681
  }, options);
682
682
  }
683
683
  });
684
- const onToggleMicrophone = () => __awaiter$C(void 0, void 0, void 0, function* () {
684
+ const onToggleMicrophone = () => __awaiter$D(void 0, void 0, void 0, function* () {
685
685
  if (!call || !_isInCall(call.state)) {
686
686
  throw new Error(`Please invoke onToggleMicrophone after call is started`);
687
687
  }
688
688
  return call.isMuted ? yield call.unmute() : yield call.mute();
689
689
  });
690
- const onStartScreenShare = () => __awaiter$C(void 0, void 0, void 0, function* () { return yield (call === null || call === void 0 ? void 0 : call.startScreenSharing()); });
691
- const onStopScreenShare = () => __awaiter$C(void 0, void 0, void 0, function* () { return yield (call === null || call === void 0 ? void 0 : call.stopScreenSharing()); });
692
- const onToggleScreenShare = () => __awaiter$C(void 0, void 0, void 0, function* () { return (call === null || call === void 0 ? void 0 : call.isScreenSharingOn) ? yield onStopScreenShare() : yield onStartScreenShare(); });
693
- const onHangUp = (forEveryone) => __awaiter$C(void 0, void 0, void 0, function* () { return yield (call === null || call === void 0 ? void 0 : call.hangUp({ forEveryone: forEveryone === true ? true : false })); });
690
+ const onStartScreenShare = () => __awaiter$D(void 0, void 0, void 0, function* () { return yield (call === null || call === void 0 ? void 0 : call.startScreenSharing()); });
691
+ const onStopScreenShare = () => __awaiter$D(void 0, void 0, void 0, function* () { return yield (call === null || call === void 0 ? void 0 : call.stopScreenSharing()); });
692
+ const onToggleScreenShare = () => __awaiter$D(void 0, void 0, void 0, function* () { return (call === null || call === void 0 ? void 0 : call.isScreenSharingOn) ? yield onStopScreenShare() : yield onStartScreenShare(); });
693
+ const onHangUp = (forEveryone) => __awaiter$D(void 0, void 0, void 0, function* () { return yield (call === null || call === void 0 ? void 0 : call.hangUp({ forEveryone: forEveryone === true ? true : false })); });
694
694
  /* @conditional-compile-remove(PSTN-calls) */
695
- const onToggleHold = () => __awaiter$C(void 0, void 0, void 0, function* () { return (call === null || call === void 0 ? void 0 : call.state) === 'LocalHold' ? yield (call === null || call === void 0 ? void 0 : call.resume()) : yield (call === null || call === void 0 ? void 0 : call.hold()); });
696
- const onCreateLocalStreamView = (options = { scalingMode: 'Crop', isMirrored: true }) => __awaiter$C(void 0, void 0, void 0, function* () {
695
+ const onToggleHold = () => __awaiter$D(void 0, void 0, void 0, function* () { return (call === null || call === void 0 ? void 0 : call.state) === 'LocalHold' ? yield (call === null || call === void 0 ? void 0 : call.resume()) : yield (call === null || call === void 0 ? void 0 : call.hold()); });
696
+ const onCreateLocalStreamView = (options = { scalingMode: 'Crop', isMirrored: true }) => __awaiter$D(void 0, void 0, void 0, function* () {
697
697
  var _a;
698
698
  if (!call || call.localVideoStreams.length === 0) {
699
699
  return;
@@ -709,7 +709,7 @@ const createDefaultCommonCallingHandlers = memoizeOne__default['default']((callC
709
709
  const { view } = (_a = (yield callClient.createView(call.id, undefined, localStream, options))) !== null && _a !== void 0 ? _a : {};
710
710
  return view ? { view } : undefined;
711
711
  });
712
- const onCreateRemoteStreamView = (userId, options = { scalingMode: 'Crop' }) => __awaiter$C(void 0, void 0, void 0, function* () {
712
+ const onCreateRemoteStreamView = (userId, options = { scalingMode: 'Crop' }) => __awaiter$D(void 0, void 0, void 0, function* () {
713
713
  if (!call) {
714
714
  return;
715
715
  }
@@ -740,7 +740,7 @@ const createDefaultCommonCallingHandlers = memoizeOne__default['default']((callC
740
740
  }
741
741
  return (createViewResult === null || createViewResult === void 0 ? void 0 : createViewResult.view) ? { view: createViewResult === null || createViewResult === void 0 ? void 0 : createViewResult.view } : undefined;
742
742
  });
743
- const onDisposeRemoteStreamView = (userId) => __awaiter$C(void 0, void 0, void 0, function* () {
743
+ const onDisposeRemoteStreamView = (userId) => __awaiter$D(void 0, void 0, void 0, function* () {
744
744
  if (!call) {
745
745
  return;
746
746
  }
@@ -761,7 +761,7 @@ const createDefaultCommonCallingHandlers = memoizeOne__default['default']((callC
761
761
  callClient.disposeView(call.id, participant.identifier, screenShareStream);
762
762
  }
763
763
  });
764
- const onDisposeLocalStreamView = () => __awaiter$C(void 0, void 0, void 0, function* () {
764
+ const onDisposeLocalStreamView = () => __awaiter$D(void 0, void 0, void 0, function* () {
765
765
  // If the user is currently in a call, dispose of the local stream view attached to that call.
766
766
  const callState = call && callClient.getState().calls[call.id];
767
767
  const localStream = callState === null || callState === void 0 ? void 0 : callState.localVideoStreams.find((item) => item.mediaStreamType === 'Video');
@@ -774,12 +774,12 @@ const createDefaultCommonCallingHandlers = memoizeOne__default['default']((callC
774
774
  yield disposeAllLocalPreviewViews(callClient);
775
775
  });
776
776
  /* @conditional-compile-remove(dialpad) */ /* @conditional-compile-remove(PSTN-calls) */
777
- const onSendDtmfTone = (dtmfTone) => __awaiter$C(void 0, void 0, void 0, function* () { return yield (call === null || call === void 0 ? void 0 : call.sendDtmf(dtmfTone)); });
777
+ const onSendDtmfTone = (dtmfTone) => __awaiter$D(void 0, void 0, void 0, function* () { return yield (call === null || call === void 0 ? void 0 : call.sendDtmf(dtmfTone)); });
778
778
  const notImplemented = () => {
779
779
  throw new Error('Not implemented, cannot call a method from an abstract object');
780
780
  };
781
781
  /* @conditional-compile-remove(call-readiness) */
782
- const askDevicePermission = (constrain) => __awaiter$C(void 0, void 0, void 0, function* () {
782
+ const askDevicePermission = (constrain) => __awaiter$D(void 0, void 0, void 0, function* () {
783
783
  if (deviceManager) {
784
784
  yield (deviceManager === null || deviceManager === void 0 ? void 0 : deviceManager.askDevicePermission(constrain));
785
785
  }
@@ -813,7 +813,7 @@ const createDefaultCommonCallingHandlers = memoizeOne__default['default']((callC
813
813
 
814
814
  // Copyright (c) Microsoft Corporation.
815
815
  // Licensed under the MIT license.
816
- var __awaiter$B = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
816
+ var __awaiter$C = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
817
817
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
818
818
  return new (P || (P = Promise))(function (resolve, reject) {
819
819
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -840,7 +840,7 @@ const createDefaultCallingHandlers = memoizeOne__default['default']((callClient,
840
840
  return callAgent ? callAgent.startCall(participants, options) : undefined;
841
841
  },
842
842
  /* @conditional-compile-remove(PSTN-calls) */
843
- onAddParticipant: (userId, options) => __awaiter$B(void 0, void 0, void 0, function* () {
843
+ onAddParticipant: (userId, options) => __awaiter$C(void 0, void 0, void 0, function* () {
844
844
  const participant = _toCommunicationIdentifier(userId);
845
845
  if (communicationCommon.isPhoneNumberIdentifier(participant)) {
846
846
  call === null || call === void 0 ? void 0 : call.addParticipant(participant, options);
@@ -848,7 +848,7 @@ const createDefaultCallingHandlers = memoizeOne__default['default']((callClient,
848
848
  else if (communicationCommon.isCommunicationUserIdentifier(participant) || communicationCommon.isMicrosoftTeamsUserIdentifier(participant)) {
849
849
  call === null || call === void 0 ? void 0 : call.addParticipant(participant);
850
850
  }
851
- }), onRemoveParticipant: (userId) => __awaiter$B(void 0, void 0, void 0, function* () {
851
+ }), onRemoveParticipant: (userId) => __awaiter$C(void 0, void 0, void 0, function* () {
852
852
  const participant = _toCommunicationIdentifier(userId);
853
853
  yield (call === null || call === void 0 ? void 0 : call.removeParticipant(participant));
854
854
  }) });
@@ -856,7 +856,7 @@ const createDefaultCallingHandlers = memoizeOne__default['default']((callClient,
856
856
 
857
857
  // Copyright (c) Microsoft Corporation.
858
858
  // Licensed under the MIT license.
859
- var __awaiter$A = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
859
+ var __awaiter$B = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
860
860
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
861
861
  return new (P || (P = Promise))(function (resolve, reject) {
862
862
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -888,7 +888,7 @@ const createDefaultTeamsCallingHandlers = memoizeOne__default['default']((callCl
888
888
  },
889
889
  /* @conditional-compile-remove(teams-identity-support) */
890
890
  /* @conditional-compile-remove(PSTN-calls) */
891
- onAddParticipant: (userId, options) => __awaiter$A(void 0, void 0, void 0, function* () {
891
+ onAddParticipant: (userId, options) => __awaiter$B(void 0, void 0, void 0, function* () {
892
892
  const participant = _toCommunicationIdentifier(userId);
893
893
  /* @conditional-compile-remove(teams-identity-support) */
894
894
  const threadId = options === null || options === void 0 ? void 0 : options.threadId;
@@ -901,7 +901,7 @@ const createDefaultTeamsCallingHandlers = memoizeOne__default['default']((callCl
901
901
  }
902
902
  /* @conditional-compile-remove(teams-identity-support) */
903
903
  call === null || call === void 0 ? void 0 : call.addParticipant(participant);
904
- }), onRemoveParticipant: (userId) => __awaiter$A(void 0, void 0, void 0, function* () {
904
+ }), onRemoveParticipant: (userId) => __awaiter$B(void 0, void 0, void 0, function* () {
905
905
  const participant = _toCommunicationIdentifier(userId);
906
906
  if (communicationCommon.isCommunicationUserIdentifier(participant)) {
907
907
  throw new Error('CommunicationIdentifier in Teams call is not supported!');
@@ -913,7 +913,7 @@ const createDefaultTeamsCallingHandlers = memoizeOne__default['default']((callCl
913
913
 
914
914
  // Copyright (c) Microsoft Corporation.
915
915
  // Licensed under the MIT license.
916
- var __awaiter$z = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
916
+ var __awaiter$A = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
917
917
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
918
918
  return new (P || (P = Promise))(function (resolve, reject) {
919
919
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -962,13 +962,13 @@ class ProxyDeviceManager {
962
962
  this.selectCamera = (videoDeviceInfo) => {
963
963
  this._context.setDeviceManagerSelectedCamera(videoDeviceInfo);
964
964
  };
965
- this.videoDevicesUpdated = () => __awaiter$z(this, void 0, void 0, function* () {
965
+ this.videoDevicesUpdated = () => __awaiter$A(this, void 0, void 0, function* () {
966
966
  // Device Manager always has a camera with '' name if there are no real camera devices available.
967
967
  // We don't want to show that in the UI.
968
968
  const realCameras = (yield this._deviceManager.getCameras()).filter((c) => !!c.name);
969
969
  this._context.setDeviceManagerCameras(dedupeById(realCameras));
970
970
  });
971
- this.audioDevicesUpdated = () => __awaiter$z(this, void 0, void 0, function* () {
971
+ this.audioDevicesUpdated = () => __awaiter$A(this, void 0, void 0, function* () {
972
972
  this._context.setDeviceManagerMicrophones(dedupeById(yield this._deviceManager.getMicrophones()));
973
973
  this._context.setDeviceManagerSpeakers(dedupeById(yield this._deviceManager.getSpeakers()));
974
974
  });
@@ -1184,7 +1184,7 @@ class CallIdHistory {
1184
1184
 
1185
1185
  // Copyright (c) Microsoft Corporation.
1186
1186
  // Licensed under the MIT license.
1187
- var __awaiter$y = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
1187
+ var __awaiter$z = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
1188
1188
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
1189
1189
  return new (P || (P = Promise))(function (resolve, reject) {
1190
1190
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -1768,7 +1768,7 @@ class CallContext$2 {
1768
1768
  * @throws CallError. Exceptions thrown from `f` are tagged with the failed `target.
1769
1769
  */
1770
1770
  withAsyncErrorTeedToState(action, target) {
1771
- return (...args) => __awaiter$y(this, void 0, void 0, function* () {
1771
+ return (...args) => __awaiter$z(this, void 0, void 0, function* () {
1772
1772
  try {
1773
1773
  return yield action(...args);
1774
1774
  }
@@ -2100,7 +2100,7 @@ class RemoteVideoStreamSubscriber {
2100
2100
 
2101
2101
  // Copyright (c) Microsoft Corporation.
2102
2102
  // Licensed under the MIT license.
2103
- var __awaiter$x = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
2103
+ var __awaiter$y = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
2104
2104
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
2105
2105
  return new (P || (P = Promise))(function (resolve, reject) {
2106
2106
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -2110,7 +2110,7 @@ var __awaiter$x = (window && window.__awaiter) || function (thisArg, _arguments,
2110
2110
  });
2111
2111
  };
2112
2112
  function createViewRemoteVideo(context, internalContext, callId, participantId, stream, options) {
2113
- return __awaiter$x(this, void 0, void 0, function* () {
2113
+ return __awaiter$y(this, void 0, void 0, function* () {
2114
2114
  // Render RemoteVideoStream that is part of a Call
2115
2115
  const streamId = stream.id;
2116
2116
  const streamType = stream.mediaStreamType;
@@ -2237,7 +2237,7 @@ function createViewRemoteVideo(context, internalContext, callId, participantId,
2237
2237
  });
2238
2238
  }
2239
2239
  function createViewLocalVideo(context, internalContext, callId, options) {
2240
- return __awaiter$x(this, void 0, void 0, function* () {
2240
+ return __awaiter$y(this, void 0, void 0, function* () {
2241
2241
  // Render LocalVideoStream that is part of a Call
2242
2242
  const renderInfo = internalContext.getLocalRenderInfo(callId);
2243
2243
  const streamType = renderInfo === null || renderInfo === void 0 ? void 0 : renderInfo.stream.mediaStreamType;
@@ -2358,7 +2358,7 @@ function createViewLocalVideo(context, internalContext, callId, options) {
2358
2358
  });
2359
2359
  }
2360
2360
  function createViewUnparentedVideo(context, internalContext, stream, options) {
2361
- return __awaiter$x(this, void 0, void 0, function* () {
2361
+ return __awaiter$y(this, void 0, void 0, function* () {
2362
2362
  const renderInfo = internalContext.getUnparentedRenderInfo(stream);
2363
2363
  if (renderInfo && renderInfo.status === 'Rendered') {
2364
2364
  console.warn('Unparented LocalVideoStream is already rendered');
@@ -2643,7 +2643,7 @@ function createView(context, internalContext, callId, participantId, stream, opt
2643
2643
  // Render LocalVideoStream that is not part of a Call
2644
2644
  // Because it is not part of the call we don't tee errors to state naturally (e.g. via a Call Client function such as startVideo).
2645
2645
  // We do not have a startLocalPreviewVideo function, so as a workaround we ensure any errors are propagated here.
2646
- return context.withAsyncErrorTeedToState(() => __awaiter$x(this, void 0, void 0, function* () { return yield createViewUnparentedVideo(context, internalContext, stream, options); }), 'Call.startVideo')();
2646
+ return context.withAsyncErrorTeedToState(() => __awaiter$y(this, void 0, void 0, function* () { return yield createViewUnparentedVideo(context, internalContext, stream, options); }), 'Call.startVideo')();
2647
2647
  }
2648
2648
  else {
2649
2649
  _logEvent(callingStatefulLogger, {
@@ -3092,7 +3092,7 @@ class CallSubscriber {
3092
3092
 
3093
3093
  // Copyright (c) Microsoft Corporation.
3094
3094
  // Licensed under the MIT license.
3095
- var __awaiter$w = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
3095
+ var __awaiter$x = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
3096
3096
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
3097
3097
  return new (P || (P = Promise))(function (resolve, reject) {
3098
3098
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -3112,14 +3112,14 @@ class ProxyIncomingCall {
3112
3112
  switch (prop) {
3113
3113
  case 'accept': {
3114
3114
  return this._context.withAsyncErrorTeedToState(function (...args) {
3115
- return __awaiter$w(this, void 0, void 0, function* () {
3115
+ return __awaiter$x(this, void 0, void 0, function* () {
3116
3116
  return yield target.accept(...args);
3117
3117
  });
3118
3118
  }, 'IncomingCall.accept');
3119
3119
  }
3120
3120
  case 'reject': {
3121
3121
  return this._context.withAsyncErrorTeedToState(function (...args) {
3122
- return __awaiter$w(this, void 0, void 0, function* () {
3122
+ return __awaiter$x(this, void 0, void 0, function* () {
3123
3123
  return yield target.reject(...args);
3124
3124
  });
3125
3125
  }, 'IncomingCall.reject');
@@ -3356,7 +3356,7 @@ const clearCallRelatedState = (context, internalContext) => {
3356
3356
 
3357
3357
  // Copyright (c) Microsoft Corporation.
3358
3358
  // Licensed under the MIT license.
3359
- var __awaiter$v = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
3359
+ var __awaiter$w = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
3360
3360
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
3361
3361
  return new (P || (P = Promise))(function (resolve, reject) {
3362
3362
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -3382,56 +3382,56 @@ class ProxyCallCommon {
3382
3382
  switch (prop) {
3383
3383
  case 'mute': {
3384
3384
  return this._context.withAsyncErrorTeedToState(function (...args) {
3385
- return __awaiter$v(this, void 0, void 0, function* () {
3385
+ return __awaiter$w(this, void 0, void 0, function* () {
3386
3386
  return yield target.mute(...args);
3387
3387
  });
3388
3388
  }, 'Call.mute');
3389
3389
  }
3390
3390
  case 'unmute': {
3391
3391
  return this._context.withAsyncErrorTeedToState(function (...args) {
3392
- return __awaiter$v(this, void 0, void 0, function* () {
3392
+ return __awaiter$w(this, void 0, void 0, function* () {
3393
3393
  return yield target.unmute(...args);
3394
3394
  });
3395
3395
  }, 'Call.unmute');
3396
3396
  }
3397
3397
  case 'startVideo': {
3398
3398
  return this._context.withAsyncErrorTeedToState(function (...args) {
3399
- return __awaiter$v(this, void 0, void 0, function* () {
3399
+ return __awaiter$w(this, void 0, void 0, function* () {
3400
3400
  return yield target.startVideo(...args);
3401
3401
  });
3402
3402
  }, 'Call.startVideo');
3403
3403
  }
3404
3404
  case 'stopVideo': {
3405
3405
  return this._context.withAsyncErrorTeedToState(function (...args) {
3406
- return __awaiter$v(this, void 0, void 0, function* () {
3406
+ return __awaiter$w(this, void 0, void 0, function* () {
3407
3407
  return yield target.stopVideo(...args);
3408
3408
  });
3409
3409
  }, 'Call.stopVideo');
3410
3410
  }
3411
3411
  case 'startScreenSharing': {
3412
3412
  return this._context.withAsyncErrorTeedToState(function (...args) {
3413
- return __awaiter$v(this, void 0, void 0, function* () {
3413
+ return __awaiter$w(this, void 0, void 0, function* () {
3414
3414
  return yield target.startScreenSharing(...args);
3415
3415
  });
3416
3416
  }, 'Call.startScreenSharing');
3417
3417
  }
3418
3418
  case 'stopScreenSharing': {
3419
3419
  return this._context.withAsyncErrorTeedToState(function (...args) {
3420
- return __awaiter$v(this, void 0, void 0, function* () {
3420
+ return __awaiter$w(this, void 0, void 0, function* () {
3421
3421
  return yield target.stopScreenSharing(...args);
3422
3422
  });
3423
3423
  }, 'Call.stopScreenSharing');
3424
3424
  }
3425
3425
  case 'hold': {
3426
3426
  return this._context.withAsyncErrorTeedToState(function (...args) {
3427
- return __awaiter$v(this, void 0, void 0, function* () {
3427
+ return __awaiter$w(this, void 0, void 0, function* () {
3428
3428
  return yield target.hold(...args);
3429
3429
  });
3430
3430
  }, 'Call.hold');
3431
3431
  }
3432
3432
  case 'resume': {
3433
3433
  return this._context.withAsyncErrorTeedToState(function (...args) {
3434
- return __awaiter$v(this, void 0, void 0, function* () {
3434
+ return __awaiter$w(this, void 0, void 0, function* () {
3435
3435
  return yield target.resume(...args);
3436
3436
  });
3437
3437
  }, 'Call.resume');
@@ -3444,7 +3444,7 @@ class ProxyCallCommon {
3444
3444
 
3445
3445
  // Copyright (c) Microsoft Corporation.
3446
3446
  // Licensed under the MIT license.
3447
- var __awaiter$u = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
3447
+ var __awaiter$v = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
3448
3448
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
3449
3449
  return new (P || (P = Promise))(function (resolve, reject) {
3450
3450
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -3458,7 +3458,7 @@ class ProxyCall extends ProxyCallCommon {
3458
3458
  switch (prop) {
3459
3459
  case 'addParticipant': {
3460
3460
  return this.getContext().withAsyncErrorTeedToState(function (...args) {
3461
- return __awaiter$u(this, void 0, void 0, function* () {
3461
+ return __awaiter$v(this, void 0, void 0, function* () {
3462
3462
  return yield target.addParticipant(...args);
3463
3463
  });
3464
3464
  }, 'Call.addParticipant');
@@ -3679,7 +3679,7 @@ class InternalCallContext {
3679
3679
 
3680
3680
  // Copyright (c) Microsoft Corporation.
3681
3681
  // Licensed under the MIT license.
3682
- var __awaiter$t = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
3682
+ var __awaiter$u = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
3683
3683
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
3684
3684
  return new (P || (P = Promise))(function (resolve, reject) {
3685
3685
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -3694,7 +3694,7 @@ class ProxyTeamsCall extends ProxyCallCommon {
3694
3694
  switch (prop) {
3695
3695
  case 'addParticipant': {
3696
3696
  return this.getContext().withAsyncErrorTeedToState(function (...args) {
3697
- return __awaiter$t(this, void 0, void 0, function* () {
3697
+ return __awaiter$u(this, void 0, void 0, function* () {
3698
3698
  return yield target.addParticipant(...args);
3699
3699
  });
3700
3700
  }, 'TeamsCall.addParticipant');
@@ -3809,7 +3809,7 @@ const teamsCallAgentDeclaratify = (callAgent, context, internalContext) => {
3809
3809
 
3810
3810
  // Copyright (c) Microsoft Corporation.
3811
3811
  // Licensed under the MIT license.
3812
- var __awaiter$s = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
3812
+ var __awaiter$t = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
3813
3813
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
3814
3814
  return new (P || (P = Promise))(function (resolve, reject) {
3815
3815
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -3831,7 +3831,7 @@ class ProxyVideoStreamRendererView {
3831
3831
  get(target, prop) {
3832
3832
  switch (prop) {
3833
3833
  case 'updateScalingMode': {
3834
- return (...args) => __awaiter$s(this, void 0, void 0, function* () {
3834
+ return (...args) => __awaiter$t(this, void 0, void 0, function* () {
3835
3835
  yield target.updateScalingMode(...args);
3836
3836
  this._context.setRemoteVideoStreamViewScalingMode(this._callId, this._participantId, this._streamId, args[0]);
3837
3837
  });
@@ -3852,7 +3852,7 @@ const videoStreamRendererViewDeclaratify = (view, context, callId, participantId
3852
3852
 
3853
3853
  // Copyright (c) Microsoft Corporation.
3854
3854
  // Licensed under the MIT license.
3855
- var __awaiter$r = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
3855
+ var __awaiter$s = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
3856
3856
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
3857
3857
  return new (P || (P = Promise))(function (resolve, reject) {
3858
3858
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -3874,7 +3874,7 @@ class ProxyCallClient {
3874
3874
  get(target, prop) {
3875
3875
  switch (prop) {
3876
3876
  case 'createCallAgent': {
3877
- return this._context.withAsyncErrorTeedToState((...args) => __awaiter$r(this, void 0, void 0, function* () {
3877
+ return this._context.withAsyncErrorTeedToState((...args) => __awaiter$s(this, void 0, void 0, function* () {
3878
3878
  // createCallAgent will throw an exception if the previous callAgent was not disposed. If the previous
3879
3879
  // callAgent was disposed then it would have unsubscribed to events so we can just create a new declarative
3880
3880
  // callAgent if the createCallAgent succeeds.
@@ -3887,7 +3887,7 @@ class ProxyCallClient {
3887
3887
  }), 'CallClient.createCallAgent');
3888
3888
  }
3889
3889
  case 'createTeamsCallAgent': {
3890
- /* @conditional-compile-remove(teams-identity-support) */ return this._context.withAsyncErrorTeedToState((...args) => __awaiter$r(this, void 0, void 0, function* () {
3890
+ /* @conditional-compile-remove(teams-identity-support) */ return this._context.withAsyncErrorTeedToState((...args) => __awaiter$s(this, void 0, void 0, function* () {
3891
3891
  // createCallAgent will throw an exception if the previous callAgent was not disposed. If the previous
3892
3892
  // callAgent was disposed then it would have unsubscribed to events so we can just create a new declarative
3893
3893
  // callAgent if the createCallAgent succeeds.
@@ -3900,7 +3900,7 @@ class ProxyCallClient {
3900
3900
  }), 'CallClient.createTeamsCallAgent');
3901
3901
  }
3902
3902
  case 'getDeviceManager': {
3903
- return this._context.withAsyncErrorTeedToState(() => __awaiter$r(this, void 0, void 0, function* () {
3903
+ return this._context.withAsyncErrorTeedToState(() => __awaiter$s(this, void 0, void 0, function* () {
3904
3904
  // As of writing, the SDK always returns the same instance of DeviceManager so we keep a reference of
3905
3905
  // DeviceManager and if it does not change we return the cached DeclarativeDeviceManager. If it does not we'll
3906
3906
  // throw an error that indicate we need to fix this issue as our implementation has diverged from the SDK.
@@ -3929,7 +3929,7 @@ class ProxyCallClient {
3929
3929
  /**
3930
3930
  * add to this object if we want to proxy anything else off the DebugInfo feature object.
3931
3931
  */
3932
- return Object.assign(Object.assign({}, feature), { getEnvironmentInfo: () => __awaiter$r(this, void 0, void 0, function* () {
3932
+ return Object.assign(Object.assign({}, feature), { getEnvironmentInfo: () => __awaiter$s(this, void 0, void 0, function* () {
3933
3933
  const environmentInfo = yield feature.getEnvironmentInfo();
3934
3934
  this._context.setEnvironmentInfo(environmentInfo);
3935
3935
  return environmentInfo;
@@ -3982,7 +3982,7 @@ const createStatefulCallClientWithDeps = (callClient, context, internalContext)
3982
3982
  });
3983
3983
  Object.defineProperty(callClient, 'createView', {
3984
3984
  configurable: false,
3985
- value: (callId, participantId, stream, options) => __awaiter$r(void 0, void 0, void 0, function* () {
3985
+ value: (callId, participantId, stream, options) => __awaiter$s(void 0, void 0, void 0, function* () {
3986
3986
  const participantIdKind = participantId ? communicationCommon.getIdentifierKind(participantId) : undefined;
3987
3987
  const result = yield createView(context, internalContext, callId, participantIdKind, stream, options);
3988
3988
  // We only need to declaratify the VideoStreamRendererView object for remote participants. Because the updateScalingMode only needs to be called on remote participant stream views.
@@ -4367,8 +4367,8 @@ const defaultIdentifiers = {
4367
4367
  typingIndicator: 'typing-indicator',
4368
4368
  videoGallery: 'video-gallery',
4369
4369
  videoTile: 'video-tile',
4370
- horizontalGalleryLeftNavButton: 'horizontal-gallery-left-nav-button',
4371
- horizontalGalleryRightNavButton: 'horizontal-gallery-right-nav-button'
4370
+ overflowGalleryLeftNavButton: 'overflow-gallery-left-nav-button',
4371
+ overflowGalleryRightNavButton: 'overflow-gallery-right-nav-button'
4372
4372
  };
4373
4373
  /**
4374
4374
  * @private
@@ -6800,7 +6800,7 @@ const chatMessageActionMenuProps = (menuProps) => {
6800
6800
  return actionMenuProps;
6801
6801
  };
6802
6802
 
6803
- var __awaiter$q = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
6803
+ var __awaiter$r = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
6804
6804
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
6805
6805
  return new (P || (P = Promise))(function (resolve, reject) {
6806
6806
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -6825,7 +6825,7 @@ const _FileDownloadCards = (props) => {
6825
6825
  var _a, _b;
6826
6826
  return (_b = (_a = props.strings) === null || _a === void 0 ? void 0 : _a.downloadFile) !== null && _b !== void 0 ? _b : localeStrings.downloadFile;
6827
6827
  }, [(_a = props.strings) === null || _a === void 0 ? void 0 : _a.downloadFile, localeStrings.downloadFile]);
6828
- const fileDownloadHandler = React.useCallback((userId, file) => __awaiter$q(void 0, void 0, void 0, function* () {
6828
+ const fileDownloadHandler = React.useCallback((userId, file) => __awaiter$r(void 0, void 0, void 0, function* () {
6829
6829
  if (!props.downloadHandler) {
6830
6830
  window.open(file.url, '_blank', 'noopener,noreferrer');
6831
6831
  }
@@ -6973,7 +6973,7 @@ const ChatMessageComponentAsMessageBubble = React__default['default'].memo(Messa
6973
6973
 
6974
6974
  // Copyright (c) Microsoft Corporation.
6975
6975
  // Licensed under the MIT license.
6976
- var __awaiter$p = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
6976
+ var __awaiter$q = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
6977
6977
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
6978
6978
  return new (P || (P = Promise))(function (resolve, reject) {
6979
6979
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -7007,7 +7007,7 @@ const ChatMessageComponent = (props) => {
7007
7007
  return React__default['default'].createElement(React__default['default'].Fragment, null);
7008
7008
  }
7009
7009
  else if (isEditing) {
7010
- return (React__default['default'].createElement(ChatMessageComponentAsEditBox, { message: message, inlineEditButtons: props.inlineAcceptRejectEditButtons, strings: props.strings, onSubmit: (text, metadata, options) => __awaiter$p(void 0, void 0, void 0, function* () {
7010
+ return (React__default['default'].createElement(ChatMessageComponentAsEditBox, { message: message, inlineEditButtons: props.inlineAcceptRejectEditButtons, strings: props.strings, onSubmit: (text, metadata, options) => __awaiter$q(void 0, void 0, void 0, function* () {
7011
7011
  props.onUpdateMessage &&
7012
7012
  props.message.messageId &&
7013
7013
  (yield props.onUpdateMessage(props.message.messageId, text, metadata, options));
@@ -7106,7 +7106,7 @@ const getParticipantsWhoHaveReadMessage = (message, readReceiptsBySenderId) => {
7106
7106
 
7107
7107
  // Copyright (c) Microsoft Corporation.
7108
7108
  // Licensed under the MIT license.
7109
- var __awaiter$o = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
7109
+ var __awaiter$p = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
7110
7110
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
7111
7111
  return new (P || (P = Promise))(function (resolve, reject) {
7112
7112
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -7307,6 +7307,13 @@ const MessageThread = (props) => {
7307
7307
  // readCount and participantCount will only need to be updated on-fly when user hover on an indicator
7308
7308
  const [readCountForHoveredIndicator, setReadCountForHoveredIndicator] = React.useState(undefined);
7309
7309
  const isAllChatMessagesLoadedRef = React.useRef(false);
7310
+ // isAllChatMessagesLoadedRef needs to be updated every time when a new adapter is set in order to display correct data
7311
+ // onLoadPreviousChatMessages is updated when a new adapter is set
7312
+ React.useEffect(() => {
7313
+ if (onLoadPreviousChatMessages) {
7314
+ isAllChatMessagesLoadedRef.current = false;
7315
+ }
7316
+ }, [onLoadPreviousChatMessages]);
7310
7317
  const previousTopRef = React.useRef(-1);
7311
7318
  const previousHeightRef = React.useRef(-1);
7312
7319
  const messageIdSeenByMeRef = React.useRef('');
@@ -7334,7 +7341,7 @@ const MessageThread = (props) => {
7334
7341
  setChatMessagesInitialized(chatMessagesInitialized);
7335
7342
  };
7336
7343
  // we try to only send those message status if user is scrolled to the bottom.
7337
- const sendMessageStatusIfAtBottom = React.useCallback(() => __awaiter$o(void 0, void 0, void 0, function* () {
7344
+ const sendMessageStatusIfAtBottom = React.useCallback(() => __awaiter$p(void 0, void 0, void 0, function* () {
7338
7345
  if (!isAtBottomOfScrollRef.current ||
7339
7346
  !document.hasFocus() ||
7340
7347
  !messagesRef.current ||
@@ -7385,18 +7392,23 @@ const MessageThread = (props) => {
7385
7392
  setIsAtBottomOfScrollRef(atBottom);
7386
7393
  }, [scrollToBottom, sendMessageStatusIfAtBottom]);
7387
7394
  // Infinite scrolling + threadInitialize function
7388
- const fetchNewMessageWhenAtTop = React.useCallback(() => __awaiter$o(void 0, void 0, void 0, function* () {
7395
+ const fetchNewMessageWhenAtTop = React.useCallback(() => __awaiter$p(void 0, void 0, void 0, function* () {
7389
7396
  if (!isLoadingChatMessagesRef.current) {
7390
7397
  if (onLoadPreviousChatMessages) {
7391
7398
  isLoadingChatMessagesRef.current = true;
7392
- // Fetch message until scrollTop reach the threshold for fetching new message
7393
- while (!isAllChatMessagesLoadedRef.current &&
7394
- chatScrollDivRef.current &&
7395
- chatScrollDivRef.current.scrollTop <= 500) {
7396
- isAllChatMessagesLoadedRef.current = yield onLoadPreviousChatMessages(numberOfChatMessagesToReload);
7397
- yield delay(200);
7399
+ try {
7400
+ // Fetch message until scrollTop reach the threshold for fetching new message
7401
+ while (!isAllChatMessagesLoadedRef.current &&
7402
+ chatScrollDivRef.current &&
7403
+ chatScrollDivRef.current.scrollTop <= 500) {
7404
+ isAllChatMessagesLoadedRef.current = yield onLoadPreviousChatMessages(numberOfChatMessagesToReload);
7405
+ yield delay(200);
7406
+ }
7407
+ }
7408
+ finally {
7409
+ // Set isLoadingChatMessagesRef to false after messages are fetched
7410
+ isLoadingChatMessagesRef.current = false;
7398
7411
  }
7399
- isLoadingChatMessagesRef.current = false;
7400
7412
  }
7401
7413
  }
7402
7414
  }), [numberOfChatMessagesToReload, onLoadPreviousChatMessages]);
@@ -9476,9 +9488,9 @@ const HorizontalGallery = (props) => {
9476
9488
  const disablePreviousButton = page === 0;
9477
9489
  const disableNextButton = page === lastPage;
9478
9490
  return (React__default['default'].createElement(react.Stack, { horizontal: true, className: react.mergeStyles(rootStyle$1, (_a = props.styles) === null || _a === void 0 ? void 0 : _a.root) },
9479
- showButtons && (React__default['default'].createElement(HorizontalGalleryNavigationButton, { key: "previous-nav-button", icon: React__default['default'].createElement(react.Icon, { iconName: "HorizontalGalleryLeftButton" }), styles: styles === null || styles === void 0 ? void 0 : styles.previousButton, onClick: () => setPage(Math.max(0, Math.min(lastPage, page - 1))), disabled: disablePreviousButton, identifier: ids.horizontalGalleryLeftNavButton })),
9491
+ showButtons && (React__default['default'].createElement(HorizontalGalleryNavigationButton, { key: "previous-nav-button", icon: React__default['default'].createElement(react.Icon, { iconName: "HorizontalGalleryLeftButton" }), styles: styles === null || styles === void 0 ? void 0 : styles.previousButton, onClick: () => setPage(Math.max(0, Math.min(lastPage, page - 1))), disabled: disablePreviousButton, identifier: ids.overflowGalleryLeftNavButton })),
9480
9492
  React__default['default'].createElement(react.Stack, { horizontal: true, className: react.mergeStyles(childrenContainerStyle$1, { '> *': (_b = props.styles) === null || _b === void 0 ? void 0 : _b.children }) }, childrenOnCurrentPage),
9481
- showButtons && (React__default['default'].createElement(HorizontalGalleryNavigationButton, { key: "next-nav-button", icon: React__default['default'].createElement(react.Icon, { iconName: "HorizontalGalleryRightButton" }), styles: styles === null || styles === void 0 ? void 0 : styles.nextButton, onClick: () => setPage(Math.min(lastPage, page + 1)), disabled: disableNextButton, identifier: ids.horizontalGalleryRightNavButton }))));
9493
+ showButtons && (React__default['default'].createElement(HorizontalGalleryNavigationButton, { key: "next-nav-button", icon: React__default['default'].createElement(react.Icon, { iconName: "HorizontalGalleryRightButton" }), styles: styles === null || styles === void 0 ? void 0 : styles.nextButton, onClick: () => setPage(Math.min(lastPage, page + 1)), disabled: disableNextButton, identifier: ids.overflowGalleryRightNavButton }))));
9482
9494
  };
9483
9495
  const HorizontalGalleryNavigationButton = (props) => {
9484
9496
  const theme = useTheme();
@@ -9670,6 +9682,7 @@ const VerticalGallery = (props) => {
9670
9682
  const VerticalGalleryControlBar = (props) => {
9671
9683
  const { onNextButtonClick, onPreviousButtonClick, buttonsDisabled, currentPage, totalPages, styles } = props;
9672
9684
  const theme = useTheme();
9685
+ const ids = useIdentifiers();
9673
9686
  const pageCounterContainerStyles = React.useMemo(() => {
9674
9687
  return react.mergeStyles(pageNavigationControlBarContainerStyle, styles === null || styles === void 0 ? void 0 : styles.root);
9675
9688
  }, [styles === null || styles === void 0 ? void 0 : styles.root]);
@@ -9684,10 +9697,10 @@ const VerticalGalleryControlBar = (props) => {
9684
9697
  }, [styles === null || styles === void 0 ? void 0 : styles.nextButton, theme]);
9685
9698
  const controlBarSpacing = { childrenGap: '0.5rem' };
9686
9699
  return (React__default['default'].createElement(react.Stack, { horizontalAlign: "center", tokens: controlBarSpacing, horizontal: true, className: pageCounterContainerStyles },
9687
- React__default['default'].createElement(react.DefaultButton, { className: previousButtonSyles, onClick: onPreviousButtonClick, disabled: buttonsDisabled === null || buttonsDisabled === void 0 ? void 0 : buttonsDisabled.previous },
9700
+ React__default['default'].createElement(react.DefaultButton, { className: previousButtonSyles, onClick: onPreviousButtonClick, disabled: buttonsDisabled === null || buttonsDisabled === void 0 ? void 0 : buttonsDisabled.previous, "data-ui-id": ids.overflowGalleryLeftNavButton },
9688
9701
  React__default['default'].createElement(react.Icon, { iconName: "VerticalGalleryLeftButton", styles: navIconStyles })),
9689
9702
  React__default['default'].createElement(react.Text, { className: pageCounterStyles }, `${currentPage} / ${totalPages}`),
9690
- React__default['default'].createElement(react.DefaultButton, { className: nextButtonsStyles, onClick: onNextButtonClick, disabled: buttonsDisabled === null || buttonsDisabled === void 0 ? void 0 : buttonsDisabled.next },
9703
+ React__default['default'].createElement(react.DefaultButton, { className: nextButtonsStyles, onClick: onNextButtonClick, disabled: buttonsDisabled === null || buttonsDisabled === void 0 ? void 0 : buttonsDisabled.next, "data-ui-id": ids.overflowGalleryRightNavButton },
9691
9704
  React__default['default'].createElement(react.Icon, { iconName: "VerticalGalleryRightButton", styles: navIconStyles }))));
9692
9705
  };
9693
9706
 
@@ -9792,12 +9805,20 @@ const VERTICAL_GALLERY_TILE_SIZE_REM = { minHeight: 5.625, maxHeight: 9, width:
9792
9805
  * @param shouldFloatLocalVideo whether rendered in floating layout or not
9793
9806
  * @returns Style set for VerticalGallery container.
9794
9807
  */
9795
- const verticalGalleryContainerStyle = (shouldFloatLocalVideo) => {
9796
- return {
9797
- width: `${VERTICAL_GALLERY_TILE_SIZE_REM.width}rem`,
9798
- height: shouldFloatLocalVideo ? `calc(100% - ${_pxToRem(VERTICAL_GALLERY_FLOATING_MODAL_SIZE_PX.height)})` : '100%',
9799
- paddingBottom: '0.5rem'
9800
- };
9808
+ const verticalGalleryContainerStyle = (shouldFloatLocalVideo, isNarrow) => {
9809
+ return isNarrow
9810
+ ? {
9811
+ width: `${VERTICAL_GALLERY_TILE_SIZE_REM.width}rem`,
9812
+ height: shouldFloatLocalVideo ? `calc(100% - ${_pxToRem(SMALL_FLOATING_MODAL_SIZE_PX.height)})` : '100%',
9813
+ paddingBottom: '0.5rem'
9814
+ }
9815
+ : {
9816
+ width: `${VERTICAL_GALLERY_TILE_SIZE_REM.width}rem`,
9817
+ height: shouldFloatLocalVideo
9818
+ ? `calc(100% - ${_pxToRem(VERTICAL_GALLERY_FLOATING_MODAL_SIZE_PX.height)})`
9819
+ : '100%',
9820
+ paddingBottom: '0.5rem'
9821
+ };
9801
9822
  };
9802
9823
  /**
9803
9824
  * @private
@@ -9883,8 +9904,10 @@ const calculateChildrenPerPage = (args) => {
9883
9904
  /**
9884
9905
  * Now that we have the childrenSpace height we can figure out how many Children can fir in the childrenSpace.
9885
9906
  * childrenSpace = n * childHeightMin + (n - 1) * gapHeight. isolate n and take the floor.
9907
+ *
9908
+ * We want to always return at least one video tile if there are children present.So we take the max.
9886
9909
  */
9887
- return Math.floor((childSpace + gapHeightPx) / (childMinHeightPx + gapHeightPx));
9910
+ return Math.max(Math.floor((childSpace + gapHeightPx) / (childMinHeightPx + gapHeightPx)), 1);
9888
9911
  };
9889
9912
 
9890
9913
  // Copyright (c) Microsoft Corporation.
@@ -9991,7 +10014,7 @@ const OverflowGallery = (props) => {
9991
10014
  const containerStyles = React.useMemo(() => {
9992
10015
  /* @conditional-compile-remove(vertical-gallery) */
9993
10016
  if (overflowGalleryLayout === 'VerticalRight') {
9994
- return verticalGalleryContainerStyle(shouldFloatLocalVideo);
10017
+ return verticalGalleryContainerStyle(shouldFloatLocalVideo, isNarrow);
9995
10018
  }
9996
10019
  return horizontalGalleryContainerStyle(shouldFloatLocalVideo, isNarrow);
9997
10020
  }, [shouldFloatLocalVideo, isNarrow, /* @conditional-compile-remove(vertical-gallery) */ overflowGalleryLayout]);
@@ -10841,14 +10864,20 @@ const FloatingLocalVideoLayout = (props) => {
10841
10864
  : (_b = p.videoStream) === null || _b === void 0 ? void 0 : _b.isAvailable);
10842
10865
  });
10843
10866
  const layerHostId = reactHooks.useId('layerhost');
10844
- let localVideoSize = LARGE_FLOATING_MODAL_SIZE_PX;
10845
- if (isNarrow) {
10846
- localVideoSize = SMALL_FLOATING_MODAL_SIZE_PX;
10847
- }
10848
- /* @conditional-compile-remove(vertical-gallery) */
10849
- if (overflowGalleryLayout === 'VerticalRight') {
10850
- localVideoSize = VERTICAL_GALLERY_FLOATING_MODAL_SIZE_PX;
10851
- }
10867
+ const localVideoSize = React.useMemo(() => {
10868
+ if (isNarrow) {
10869
+ return SMALL_FLOATING_MODAL_SIZE_PX;
10870
+ }
10871
+ /* @conditional-compile-remove(vertical-gallery) */
10872
+ if (horizontalGalleryTiles.length > 0 && overflowGalleryLayout === 'VerticalRight') {
10873
+ return isNarrow ? SMALL_FLOATING_MODAL_SIZE_PX : VERTICAL_GALLERY_FLOATING_MODAL_SIZE_PX;
10874
+ }
10875
+ return LARGE_FLOATING_MODAL_SIZE_PX;
10876
+ }, [
10877
+ horizontalGalleryTiles.length,
10878
+ isNarrow,
10879
+ /* @conditional-compile-remove(vertical-gallery) */ overflowGalleryLayout
10880
+ ]);
10852
10881
  const wrappedLocalVideoComponent = localVideoComponent && shouldFloatLocalVideo ? (
10853
10882
  // When we use showCameraSwitcherInLocalPreview it disables dragging to allow keyboard navigation.
10854
10883
  showCameraSwitcherInLocalPreview ? (React__default['default'].createElement(react.Stack, { className: react.mergeStyles(localVideoTileWithControlsContainerStyle(theme, localVideoSize), {
@@ -11484,7 +11513,7 @@ const DevicesButton = (props) => {
11484
11513
 
11485
11514
  // Copyright (c) Microsoft Corporation.
11486
11515
  // Licensed under the MIT license.
11487
- var __awaiter$n = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
11516
+ var __awaiter$o = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
11488
11517
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
11489
11518
  return new (P || (P = Promise))(function (resolve, reject) {
11490
11519
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -11522,7 +11551,7 @@ const CameraButton = (props) => {
11522
11551
  const toggleAnnouncerString = React.useCallback((isCameraOn) => {
11523
11552
  setAnnouncerString(!isCameraOn ? strings.cameraActionTurnedOffAnnouncement : strings.cameraActionTurnedOnAnnouncement);
11524
11553
  }, [strings.cameraActionTurnedOffAnnouncement, strings.cameraActionTurnedOnAnnouncement]);
11525
- const onToggleClick = React.useCallback(() => __awaiter$n(void 0, void 0, void 0, function* () {
11554
+ const onToggleClick = React.useCallback(() => __awaiter$o(void 0, void 0, void 0, function* () {
11526
11555
  // Throttle click on camera, need to await onToggleCamera then allow another click
11527
11556
  if (onToggleCamera) {
11528
11557
  setWaitForCamera(true);
@@ -11654,7 +11683,7 @@ const lightThemeCallButtonStyles = {
11654
11683
 
11655
11684
  // Copyright (c) Microsoft Corporation.
11656
11685
  // Licensed under the MIT license.
11657
- var __awaiter$m = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
11686
+ var __awaiter$n = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
11658
11687
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
11659
11688
  return new (P || (P = Promise))(function (resolve, reject) {
11660
11689
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -11695,7 +11724,7 @@ const MicrophoneButton = (props) => {
11695
11724
  const toggleAnnouncerString = React.useCallback((isMicOn) => {
11696
11725
  setAnnouncerString(!isMicOn ? strings.microphoneActionTurnedOffAnnouncement : strings.microphoneActionTurnedOnAnnouncement);
11697
11726
  }, [strings.microphoneActionTurnedOffAnnouncement, strings.microphoneActionTurnedOnAnnouncement]);
11698
- const onToggleClick = React.useCallback(() => __awaiter$m(void 0, void 0, void 0, function* () {
11727
+ const onToggleClick = React.useCallback(() => __awaiter$n(void 0, void 0, void 0, function* () {
11699
11728
  if (onToggleMicrophone) {
11700
11729
  try {
11701
11730
  yield onToggleMicrophone();
@@ -12556,7 +12585,7 @@ const formatPhoneNumber = (phoneNumber) => {
12556
12585
 
12557
12586
  // Copyright (c) Microsoft Corporation.
12558
12587
  // Licensed under the MIT license.
12559
- var __awaiter$l = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
12588
+ var __awaiter$m = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
12560
12589
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
12561
12590
  return new (P || (P = Promise))(function (resolve, reject) {
12562
12591
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -12598,10 +12627,10 @@ const DialpadButton = (props) => {
12598
12627
  const theme = react.useTheme();
12599
12628
  const { digit, index, onClick, onLongPress, isMobile = false } = props;
12600
12629
  const useLongPressProps = React__default['default'].useMemo(() => ({
12601
- onClick: () => __awaiter$l(void 0, void 0, void 0, function* () {
12630
+ onClick: () => __awaiter$m(void 0, void 0, void 0, function* () {
12602
12631
  onClick(digit, index);
12603
12632
  }),
12604
- onLongPress: () => __awaiter$l(void 0, void 0, void 0, function* () {
12633
+ onLongPress: () => __awaiter$m(void 0, void 0, void 0, function* () {
12605
12634
  onLongPress(digit, index);
12606
12635
  }),
12607
12636
  touchEventsOnly: isMobile
@@ -13526,7 +13555,7 @@ const findConditionalCompiledSelector = (component) => {
13526
13555
 
13527
13556
  // Copyright (c) Microsoft Corporation.
13528
13557
  // Licensed under the MIT license.
13529
- var __awaiter$k = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
13558
+ var __awaiter$l = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
13530
13559
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
13531
13560
  return new (P || (P = Promise))(function (resolve, reject) {
13532
13561
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -13549,35 +13578,35 @@ const createDefaultChatHandlers = memoizeOne__default['default']((chatClient, ch
13549
13578
  let messageIterator = undefined;
13550
13579
  let readReceiptIterator = undefined;
13551
13580
  return {
13552
- onSendMessage: (content, options) => __awaiter$k(void 0, void 0, void 0, function* () {
13581
+ onSendMessage: (content, options) => __awaiter$l(void 0, void 0, void 0, function* () {
13553
13582
  const sendMessageRequest = {
13554
13583
  content,
13555
13584
  senderDisplayName: chatClient.getState().displayName
13556
13585
  };
13557
13586
  yield chatThreadClient.sendMessage(sendMessageRequest, options);
13558
13587
  }),
13559
- onUpdateMessage: (messageId, content, metadata, options) => __awaiter$k(void 0, void 0, void 0, function* () {
13588
+ onUpdateMessage: (messageId, content, metadata, options) => __awaiter$l(void 0, void 0, void 0, function* () {
13560
13589
  const updatedMetadata = metadata ? Object.assign({}, metadata) : {};
13561
13590
  updatedMetadata['fileSharingMetadata'] = JSON.stringify((options === null || options === void 0 ? void 0 : options.attachedFilesMetadata) || []);
13562
13591
  yield chatThreadClient.updateMessage(messageId, { content, metadata: updatedMetadata });
13563
13592
  }),
13564
- onDeleteMessage: (messageId) => __awaiter$k(void 0, void 0, void 0, function* () {
13593
+ onDeleteMessage: (messageId) => __awaiter$l(void 0, void 0, void 0, function* () {
13565
13594
  yield chatThreadClient.deleteMessage(messageId);
13566
13595
  }),
13567
13596
  // This handler is designed for chatThread to consume
13568
- onMessageSeen: (chatMessageId) => __awaiter$k(void 0, void 0, void 0, function* () {
13597
+ onMessageSeen: (chatMessageId) => __awaiter$l(void 0, void 0, void 0, function* () {
13569
13598
  yield chatThreadClient.sendReadReceipt({ chatMessageId });
13570
13599
  }),
13571
- onTyping: () => __awaiter$k(void 0, void 0, void 0, function* () {
13600
+ onTyping: () => __awaiter$l(void 0, void 0, void 0, function* () {
13572
13601
  yield chatThreadClient.sendTypingNotification();
13573
13602
  }),
13574
- onRemoveParticipant: (userId) => __awaiter$k(void 0, void 0, void 0, function* () {
13603
+ onRemoveParticipant: (userId) => __awaiter$l(void 0, void 0, void 0, function* () {
13575
13604
  yield chatThreadClient.removeParticipant(fromFlatCommunicationIdentifier(userId));
13576
13605
  }),
13577
- updateThreadTopicName: (topicName) => __awaiter$k(void 0, void 0, void 0, function* () {
13606
+ updateThreadTopicName: (topicName) => __awaiter$l(void 0, void 0, void 0, function* () {
13578
13607
  yield chatThreadClient.updateTopic(topicName);
13579
13608
  }),
13580
- onLoadPreviousChatMessages: (messagesToLoad) => __awaiter$k(void 0, void 0, void 0, function* () {
13609
+ onLoadPreviousChatMessages: (messagesToLoad) => __awaiter$l(void 0, void 0, void 0, function* () {
13581
13610
  var _a, _b, _c;
13582
13611
  if (messageIterator === undefined) {
13583
13612
  // Lazy definition so that errors in the method call are reported correctly.
@@ -14314,7 +14343,7 @@ const chatStatefulLogger = logger.createClientLogger('communication-react:chat-s
14314
14343
 
14315
14344
  // Copyright (c) Microsoft Corporation.
14316
14345
  // Licensed under the MIT license.
14317
- var __awaiter$j = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
14346
+ var __awaiter$k = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
14318
14347
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
14319
14348
  return new (P || (P = Promise))(function (resolve, reject) {
14320
14349
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -14589,7 +14618,7 @@ class ChatContext$1 {
14589
14618
  * @throws ChatError. Exceptions thrown from `f` are tagged with the failed `target.
14590
14619
  */
14591
14620
  withAsyncErrorTeedToState(f, target) {
14592
- return (...args) => __awaiter$j(this, void 0, void 0, function* () {
14621
+ return (...args) => __awaiter$k(this, void 0, void 0, function* () {
14593
14622
  try {
14594
14623
  return yield f(...args);
14595
14624
  }
@@ -14696,7 +14725,7 @@ const convertChatMessage = (message, status = 'delivered', clientMessageId) => {
14696
14725
 
14697
14726
  // Copyright (c) Microsoft Corporation.
14698
14727
  // Licensed under the MIT license.
14699
- var __awaiter$i = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
14728
+ var __awaiter$j = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
14700
14729
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
14701
14730
  return new (P || (P = Promise))(function (resolve, reject) {
14702
14731
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -14781,7 +14810,7 @@ class EventSubscriber {
14781
14810
  };
14782
14811
  // This is a temporary fix that no participant message is received for onChatMessageReceived event, which should be handled by JS SDK.
14783
14812
  // Without the temporary fix, there are missing 'participant joined' and 'participant left' system messages in the chat thread.
14784
- this.fetchLastParticipantMessage = (threadId, actionType) => __awaiter$i(this, void 0, void 0, function* () {
14813
+ this.fetchLastParticipantMessage = (threadId, actionType) => __awaiter$j(this, void 0, void 0, function* () {
14785
14814
  var e_1, _a;
14786
14815
  try {
14787
14816
  for (var _b = __asyncValues$1(this.chatClient
@@ -14873,7 +14902,7 @@ class EventSubscriber {
14873
14902
 
14874
14903
  // Copyright (c) Microsoft Corporation.
14875
14904
  // Licensed under the MIT license.
14876
- var __awaiter$h = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
14905
+ var __awaiter$i = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
14877
14906
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
14878
14907
  return new (P || (P = Promise))(function (resolve, reject) {
14879
14908
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -14895,7 +14924,7 @@ const createDecoratedIterator = (iteratorCreator, context, decorateFn) => {
14895
14924
  const threadsIterator = iteratorCreator(...args);
14896
14925
  return {
14897
14926
  next() {
14898
- return __awaiter$h(this, void 0, void 0, function* () {
14927
+ return __awaiter$i(this, void 0, void 0, function* () {
14899
14928
  const result = yield threadsIterator.next();
14900
14929
  if (!result.done && result.value) {
14901
14930
  decorateFn(result.value, context);
@@ -14910,7 +14939,7 @@ const createDecoratedIterator = (iteratorCreator, context, decorateFn) => {
14910
14939
  const pages = threadsIterator.byPage(settings);
14911
14940
  return {
14912
14941
  next() {
14913
- return __awaiter$h(this, void 0, void 0, function* () {
14942
+ return __awaiter$i(this, void 0, void 0, function* () {
14914
14943
  const result = yield pages.next();
14915
14944
  const page = result.value;
14916
14945
  if (!result.done && result.value) {
@@ -14994,7 +15023,7 @@ const createDecoratedListParticipants = (chatThreadClient, context) => {
14994
15023
 
14995
15024
  // Copyright (c) Microsoft Corporation.
14996
15025
  // Licensed under the MIT license.
14997
- var __awaiter$g = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
15026
+ var __awaiter$h = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
14998
15027
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
14999
15028
  return new (P || (P = Promise))(function (resolve, reject) {
15000
15029
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -15013,14 +15042,14 @@ class ProxyChatThreadClient {
15013
15042
  return createDecoratedListMessages(chatThreadClient, this._context);
15014
15043
  }
15015
15044
  case 'getMessage': {
15016
- return this._context.withAsyncErrorTeedToState((...args) => __awaiter$g(this, void 0, void 0, function* () {
15045
+ return this._context.withAsyncErrorTeedToState((...args) => __awaiter$h(this, void 0, void 0, function* () {
15017
15046
  const message = yield chatThreadClient.getMessage(...args);
15018
15047
  this._context.setChatMessage(chatThreadClient.threadId, convertChatMessage(message));
15019
15048
  return message;
15020
15049
  }), 'ChatThreadClient.getMessage');
15021
15050
  }
15022
15051
  case 'sendMessage': {
15023
- return this._context.withAsyncErrorTeedToState((...args) => __awaiter$g(this, void 0, void 0, function* () {
15052
+ return this._context.withAsyncErrorTeedToState((...args) => __awaiter$h(this, void 0, void 0, function* () {
15024
15053
  // Retry logic?
15025
15054
  const [request, options] = args;
15026
15055
  const { content } = request;
@@ -15060,7 +15089,7 @@ class ProxyChatThreadClient {
15060
15089
  }), 'ChatThreadClient.sendMessage');
15061
15090
  }
15062
15091
  case 'addParticipants': {
15063
- return this._context.withAsyncErrorTeedToState((...args) => __awaiter$g(this, void 0, void 0, function* () {
15092
+ return this._context.withAsyncErrorTeedToState((...args) => __awaiter$h(this, void 0, void 0, function* () {
15064
15093
  const result = yield chatThreadClient.addParticipants(...args);
15065
15094
  const [addRequest] = args;
15066
15095
  const participantsToAdd = addRequest.participants;
@@ -15069,7 +15098,7 @@ class ProxyChatThreadClient {
15069
15098
  }), 'ChatThreadClient.addParticipants');
15070
15099
  }
15071
15100
  case 'deleteMessage': {
15072
- return this._context.withAsyncErrorTeedToState((...args) => __awaiter$g(this, void 0, void 0, function* () {
15101
+ return this._context.withAsyncErrorTeedToState((...args) => __awaiter$h(this, void 0, void 0, function* () {
15073
15102
  // DeleteMessage is able to either delete local one(for failed message) or synced message
15074
15103
  const [messageId] = args;
15075
15104
  if (this._context.deleteLocalMessage(chatThreadClient.threadId, messageId)) {
@@ -15087,12 +15116,12 @@ class ProxyChatThreadClient {
15087
15116
  return createDecoratedListReadReceipts(chatThreadClient, this._context);
15088
15117
  }
15089
15118
  case 'sendTypingNotification': {
15090
- return this._context.withAsyncErrorTeedToState((...args) => __awaiter$g(this, void 0, void 0, function* () {
15119
+ return this._context.withAsyncErrorTeedToState((...args) => __awaiter$h(this, void 0, void 0, function* () {
15091
15120
  return yield chatThreadClient.sendTypingNotification(...args);
15092
15121
  }), 'ChatThreadClient.sendTypingNotification');
15093
15122
  }
15094
15123
  case 'removeParticipant': {
15095
- return this._context.withAsyncErrorTeedToState((...args) => __awaiter$g(this, void 0, void 0, function* () {
15124
+ return this._context.withAsyncErrorTeedToState((...args) => __awaiter$h(this, void 0, void 0, function* () {
15096
15125
  const result = yield chatThreadClient.removeParticipant(...args);
15097
15126
  const [removeIdentifier] = args;
15098
15127
  this._context.deleteParticipant(chatThreadClient.threadId, communicationCommon.getIdentifierKind(removeIdentifier));
@@ -15100,7 +15129,7 @@ class ProxyChatThreadClient {
15100
15129
  }), 'ChatThreadClient.removeParticipant');
15101
15130
  }
15102
15131
  case 'updateMessage': {
15103
- return this._context.withAsyncErrorTeedToState((...args) => __awaiter$g(this, void 0, void 0, function* () {
15132
+ return this._context.withAsyncErrorTeedToState((...args) => __awaiter$h(this, void 0, void 0, function* () {
15104
15133
  const result = yield chatThreadClient.updateMessage(...args);
15105
15134
  const [messageId, updateOption] = args;
15106
15135
  this._context.updateChatMessageContent(chatThreadClient.threadId, messageId, updateOption === null || updateOption === void 0 ? void 0 : updateOption.content);
@@ -15108,7 +15137,7 @@ class ProxyChatThreadClient {
15108
15137
  }), 'ChatThreadClient.updateMessage');
15109
15138
  }
15110
15139
  case 'updateTopic': {
15111
- return this._context.withAsyncErrorTeedToState((...args) => __awaiter$g(this, void 0, void 0, function* () {
15140
+ return this._context.withAsyncErrorTeedToState((...args) => __awaiter$h(this, void 0, void 0, function* () {
15112
15141
  const result = yield chatThreadClient.updateTopic(...args);
15113
15142
  const [topic] = args;
15114
15143
  this._context.updateThreadTopic(chatThreadClient.threadId, topic);
@@ -15116,7 +15145,7 @@ class ProxyChatThreadClient {
15116
15145
  }), 'ChatThreadClient.updateTopic');
15117
15146
  }
15118
15147
  case 'getProperties': {
15119
- return this._context.withAsyncErrorTeedToState((...args) => __awaiter$g(this, void 0, void 0, function* () {
15148
+ return this._context.withAsyncErrorTeedToState((...args) => __awaiter$h(this, void 0, void 0, function* () {
15120
15149
  const result = yield chatThreadClient.getProperties(...args);
15121
15150
  this._context.updateThread(chatThreadClient.threadId, result);
15122
15151
  return result;
@@ -15153,7 +15182,7 @@ const createDecoratedListThreads = (chatClient, context) => {
15153
15182
 
15154
15183
  // Copyright (c) Microsoft Corporation.
15155
15184
  // Licensed under the MIT license.
15156
- var __awaiter$f = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
15185
+ var __awaiter$g = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
15157
15186
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
15158
15187
  return new (P || (P = Promise))(function (resolve, reject) {
15159
15188
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -15172,7 +15201,7 @@ const proxyChatClient = {
15172
15201
  switch (prop) {
15173
15202
  case 'createChatThread': {
15174
15203
  return context.withAsyncErrorTeedToState(function (...args) {
15175
- return __awaiter$f(this, void 0, void 0, function* () {
15204
+ return __awaiter$g(this, void 0, void 0, function* () {
15176
15205
  const result = yield chatClient.createChatThread(...args);
15177
15206
  const thread = result.chatThread;
15178
15207
  if (thread) {
@@ -15185,7 +15214,7 @@ const proxyChatClient = {
15185
15214
  }
15186
15215
  case 'deleteChatThread': {
15187
15216
  return context.withAsyncErrorTeedToState(function (...args) {
15188
- return __awaiter$f(this, void 0, void 0, function* () {
15217
+ return __awaiter$g(this, void 0, void 0, function* () {
15189
15218
  const result = yield chatClient.deleteChatThread(...args);
15190
15219
  context.deleteThread(args[0]);
15191
15220
  return result;
@@ -15205,7 +15234,7 @@ const proxyChatClient = {
15205
15234
  }
15206
15235
  case 'startRealtimeNotifications': {
15207
15236
  return context.withAsyncErrorTeedToState(function (...args) {
15208
- return __awaiter$f(this, void 0, void 0, function* () {
15237
+ return __awaiter$g(this, void 0, void 0, function* () {
15209
15238
  const ret = yield chatClient.startRealtimeNotifications(...args);
15210
15239
  if (!receiver.eventSubscriber) {
15211
15240
  receiver.eventSubscriber = new EventSubscriber(chatClient, context);
@@ -15216,7 +15245,7 @@ const proxyChatClient = {
15216
15245
  }
15217
15246
  case 'stopRealtimeNotifications': {
15218
15247
  return context.withAsyncErrorTeedToState(function (...args) {
15219
- return __awaiter$f(this, void 0, void 0, function* () {
15248
+ return __awaiter$g(this, void 0, void 0, function* () {
15220
15249
  const ret = yield chatClient.stopRealtimeNotifications(...args);
15221
15250
  if (receiver.eventSubscriber) {
15222
15251
  receiver.eventSubscriber.unsubscribe();
@@ -15823,7 +15852,7 @@ const END_CALL_PAGES = [
15823
15852
 
15824
15853
  // Copyright (c) Microsoft Corporation.
15825
15854
  // Licensed under the MIT license.
15826
- var __awaiter$e = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
15855
+ var __awaiter$f = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
15827
15856
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
15828
15857
  return new (P || (P = Promise))(function (resolve, reject) {
15829
15858
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -16046,7 +16075,7 @@ const isDisabled$2 = (option) => {
16046
16075
  /**
16047
16076
  * @returns Permissions state for the camera.
16048
16077
  */
16049
- const queryCameraPermissionFromPermissionsAPI = () => __awaiter$e(void 0, void 0, void 0, function* () {
16078
+ const queryCameraPermissionFromPermissionsAPI = () => __awaiter$f(void 0, void 0, void 0, function* () {
16050
16079
  try {
16051
16080
  return (yield navigator.permissions.query({ name: 'camera' })).state;
16052
16081
  }
@@ -16059,7 +16088,7 @@ const queryCameraPermissionFromPermissionsAPI = () => __awaiter$e(void 0, void 0
16059
16088
  /**
16060
16089
  * @returns Permissions state for the microphone.
16061
16090
  */
16062
- const queryMicrophonePermissionFromPermissionsAPI = () => __awaiter$e(void 0, void 0, void 0, function* () {
16091
+ const queryMicrophonePermissionFromPermissionsAPI = () => __awaiter$f(void 0, void 0, void 0, function* () {
16063
16092
  try {
16064
16093
  return (yield navigator.permissions.query({ name: 'microphone' })).state;
16065
16094
  }
@@ -16076,7 +16105,7 @@ const queryMicrophonePermissionFromPermissionsAPI = () => __awaiter$e(void 0, vo
16076
16105
  * If permission API is not supported on this browser, permission state is set to unsupported.
16077
16106
  * @private
16078
16107
  */
16079
- const getDevicePermissionState = (setVideoState, setAudioState) => __awaiter$e(void 0, void 0, void 0, function* () {
16108
+ const getDevicePermissionState = (setVideoState, setAudioState) => __awaiter$f(void 0, void 0, void 0, function* () {
16080
16109
  const [cameraResult, microphoneResult] = yield Promise.all([
16081
16110
  queryCameraPermissionFromPermissionsAPI(),
16082
16111
  queryMicrophonePermissionFromPermissionsAPI()
@@ -16153,7 +16182,7 @@ const createParticipantModifier = (createModifiedParticipant) => {
16153
16182
 
16154
16183
  // Copyright (c) Microsoft Corporation.
16155
16184
  // Licensed under the MIT license.
16156
- var __awaiter$d = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
16185
+ var __awaiter$e = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
16157
16186
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
16158
16187
  return new (P || (P = Promise))(function (resolve, reject) {
16159
16188
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -16279,9 +16308,9 @@ class AzureCommunicationChatAdapter {
16279
16308
  this.unsubscribeAllEvents();
16280
16309
  }
16281
16310
  fetchInitialData() {
16282
- return __awaiter$d(this, void 0, void 0, function* () {
16311
+ return __awaiter$e(this, void 0, void 0, function* () {
16283
16312
  // If get properties fails we dont want to try to get the participants after.
16284
- yield this.asyncTeeErrorToEventEmitter(() => __awaiter$d(this, void 0, void 0, function* () {
16313
+ yield this.asyncTeeErrorToEventEmitter(() => __awaiter$e(this, void 0, void 0, function* () {
16285
16314
  var e_1, _a;
16286
16315
  yield this.chatThreadClient.getProperties();
16287
16316
  try {
@@ -16315,8 +16344,8 @@ class AzureCommunicationChatAdapter {
16315
16344
  this.context.offStateChange(handler);
16316
16345
  }
16317
16346
  sendMessage(content, options = {}) {
16318
- return __awaiter$d(this, void 0, void 0, function* () {
16319
- yield this.asyncTeeErrorToEventEmitter(() => __awaiter$d(this, void 0, void 0, function* () {
16347
+ return __awaiter$e(this, void 0, void 0, function* () {
16348
+ yield this.asyncTeeErrorToEventEmitter(() => __awaiter$e(this, void 0, void 0, function* () {
16320
16349
  /* @conditional-compile-remove(file-sharing) */
16321
16350
  options.metadata = Object.assign(Object.assign({}, options.metadata), convertFileUploadsUiStateToMessageMetadata(this.context.getState().fileUploads));
16322
16351
  /* @conditional-compile-remove(file-sharing) */
@@ -16333,51 +16362,51 @@ class AzureCommunicationChatAdapter {
16333
16362
  });
16334
16363
  }
16335
16364
  sendReadReceipt(chatMessageId) {
16336
- return __awaiter$d(this, void 0, void 0, function* () {
16337
- yield this.asyncTeeErrorToEventEmitter(() => __awaiter$d(this, void 0, void 0, function* () {
16365
+ return __awaiter$e(this, void 0, void 0, function* () {
16366
+ yield this.asyncTeeErrorToEventEmitter(() => __awaiter$e(this, void 0, void 0, function* () {
16338
16367
  yield this.handlers.onMessageSeen(chatMessageId);
16339
16368
  }));
16340
16369
  });
16341
16370
  }
16342
16371
  sendTypingIndicator() {
16343
- return __awaiter$d(this, void 0, void 0, function* () {
16344
- yield this.asyncTeeErrorToEventEmitter(() => __awaiter$d(this, void 0, void 0, function* () {
16372
+ return __awaiter$e(this, void 0, void 0, function* () {
16373
+ yield this.asyncTeeErrorToEventEmitter(() => __awaiter$e(this, void 0, void 0, function* () {
16345
16374
  yield this.handlers.onTyping();
16346
16375
  }));
16347
16376
  });
16348
16377
  }
16349
16378
  removeParticipant(userId) {
16350
- return __awaiter$d(this, void 0, void 0, function* () {
16351
- yield this.asyncTeeErrorToEventEmitter(() => __awaiter$d(this, void 0, void 0, function* () {
16379
+ return __awaiter$e(this, void 0, void 0, function* () {
16380
+ yield this.asyncTeeErrorToEventEmitter(() => __awaiter$e(this, void 0, void 0, function* () {
16352
16381
  yield this.handlers.onRemoveParticipant(userId);
16353
16382
  }));
16354
16383
  });
16355
16384
  }
16356
16385
  setTopic(topicName) {
16357
- return __awaiter$d(this, void 0, void 0, function* () {
16358
- yield this.asyncTeeErrorToEventEmitter(() => __awaiter$d(this, void 0, void 0, function* () {
16386
+ return __awaiter$e(this, void 0, void 0, function* () {
16387
+ yield this.asyncTeeErrorToEventEmitter(() => __awaiter$e(this, void 0, void 0, function* () {
16359
16388
  yield this.handlers.updateThreadTopicName(topicName);
16360
16389
  }));
16361
16390
  });
16362
16391
  }
16363
16392
  loadPreviousChatMessages(messagesToLoad) {
16364
- return __awaiter$d(this, void 0, void 0, function* () {
16365
- return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$d(this, void 0, void 0, function* () {
16393
+ return __awaiter$e(this, void 0, void 0, function* () {
16394
+ return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$e(this, void 0, void 0, function* () {
16366
16395
  return yield this.handlers.onLoadPreviousChatMessages(messagesToLoad);
16367
16396
  }));
16368
16397
  });
16369
16398
  }
16370
16399
  updateMessage(messageId, content, metadata, options) {
16371
- return __awaiter$d(this, void 0, void 0, function* () {
16372
- return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$d(this, void 0, void 0, function* () {
16400
+ return __awaiter$e(this, void 0, void 0, function* () {
16401
+ return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$e(this, void 0, void 0, function* () {
16373
16402
  /* @conditional-compile-remove(file-sharing) */
16374
16403
  return yield this.handlers.onUpdateMessage(messageId, content, metadata, options);
16375
16404
  }));
16376
16405
  });
16377
16406
  }
16378
16407
  deleteMessage(messageId) {
16379
- return __awaiter$d(this, void 0, void 0, function* () {
16380
- return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$d(this, void 0, void 0, function* () {
16408
+ return __awaiter$e(this, void 0, void 0, function* () {
16409
+ return yield this.asyncTeeErrorToEventEmitter(() => __awaiter$e(this, void 0, void 0, function* () {
16381
16410
  return yield this.handlers.onDeleteMessage(messageId);
16382
16411
  }));
16383
16412
  });
@@ -16458,7 +16487,7 @@ class AzureCommunicationChatAdapter {
16458
16487
  this.emitter.off(event, listener);
16459
16488
  }
16460
16489
  asyncTeeErrorToEventEmitter(f) {
16461
- return __awaiter$d(this, void 0, void 0, function* () {
16490
+ return __awaiter$e(this, void 0, void 0, function* () {
16462
16491
  try {
16463
16492
  return yield f();
16464
16493
  }
@@ -16500,7 +16529,7 @@ const convertEventType = (type) => {
16500
16529
  *
16501
16530
  * @public
16502
16531
  */
16503
- const createAzureCommunicationChatAdapter = ({ endpoint: endpointUrl, userId, displayName, credential, threadId }) => __awaiter$d(void 0, void 0, void 0, function* () {
16532
+ const createAzureCommunicationChatAdapter = ({ endpoint: endpointUrl, userId, displayName, credential, threadId }) => __awaiter$e(void 0, void 0, void 0, function* () {
16504
16533
  if (!isValidIdentifier(userId)) {
16505
16534
  throw new Error('Provided userId is invalid. Please provide valid identifier object.');
16506
16535
  }
@@ -16566,7 +16595,7 @@ beforeDispose) => {
16566
16595
  if (!credential || !displayName || !endpoint || !threadId || !userId) {
16567
16596
  return;
16568
16597
  }
16569
- (() => __awaiter$d(void 0, void 0, void 0, function* () {
16598
+ (() => __awaiter$e(void 0, void 0, void 0, function* () {
16570
16599
  if (adapterRef.current) {
16571
16600
  // Dispose the old adapter when a new one is created.
16572
16601
  //
@@ -16598,7 +16627,7 @@ beforeDispose) => {
16598
16627
  // Dispose any existing adapter when the component unmounts.
16599
16628
  React.useEffect(() => {
16600
16629
  return () => {
16601
- (() => __awaiter$d(void 0, void 0, void 0, function* () {
16630
+ (() => __awaiter$e(void 0, void 0, void 0, function* () {
16602
16631
  if (adapterRef.current) {
16603
16632
  if (beforeDisposeRef.current) {
16604
16633
  yield beforeDisposeRef.current(adapterRef.current);
@@ -16619,7 +16648,7 @@ beforeDispose) => {
16619
16648
  *
16620
16649
  * @public
16621
16650
  */
16622
- const createAzureCommunicationChatAdapterFromClient = (chatClient, chatThreadClient) => __awaiter$d(void 0, void 0, void 0, function* () {
16651
+ const createAzureCommunicationChatAdapterFromClient = (chatClient, chatThreadClient) => __awaiter$e(void 0, void 0, void 0, function* () {
16623
16652
  return new AzureCommunicationChatAdapter(chatClient, chatThreadClient);
16624
16653
  });
16625
16654
  const isChatError = (e) => {
@@ -16830,7 +16859,7 @@ const sendboxContainerStyles = {
16830
16859
 
16831
16860
  // Copyright (c) Microsoft Corporation.
16832
16861
  // Licensed under the MIT license.
16833
- var __awaiter$c = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
16862
+ var __awaiter$d = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
16834
16863
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
16835
16864
  return new (P || (P = Promise))(function (resolve, reject) {
16836
16865
  function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
@@ -16851,7 +16880,7 @@ const AvatarPersona = (props) => {
16851
16880
  const { userId, dataProvider, text, imageUrl, imageInitials, initialsColor, initialsTextColor, showOverflowTooltip } = props;
16852
16881
  const [data, setData] = React.useState();
16853
16882
  React.useEffect(() => {
16854
- (() => __awaiter$c(void 0, void 0, void 0, function* () {
16883
+ (() => __awaiter$d(void 0, void 0, void 0, function* () {
16855
16884
  if (dataProvider && userId) {
16856
16885
  const newData = yield dataProvider(userId);
16857
16886
  if (avatarDeepDifferenceCheck(data, newData)) {
@@ -17214,6 +17243,16 @@ const FileDownloadErrorBar = (props) => {
17214
17243
  };
17215
17244
 
17216
17245
  // Copyright (c) Microsoft Corporation.
17246
+ // Licensed under the MIT license.
17247
+ var __awaiter$c = (window && window.__awaiter) || function (thisArg, _arguments, P, generator) {
17248
+ function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
17249
+ return new (P || (P = Promise))(function (resolve, reject) {
17250
+ function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
17251
+ function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
17252
+ function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
17253
+ step((generator = generator.apply(thisArg, _arguments || [])).next());
17254
+ });
17255
+ };
17217
17256
  /**
17218
17257
  * @private
17219
17258
  */
@@ -17226,7 +17265,13 @@ const ChatScreen = (props) => {
17226
17265
  const theme = useTheme();
17227
17266
  React.useEffect(() => {
17228
17267
  // Initial data should be always fetched by the composite(or external caller) instead of the adapter
17229
- adapter.fetchInitialData();
17268
+ const fetchData = () => __awaiter$c(void 0, void 0, void 0, function* () {
17269
+ // Fetch initial data for adapter
17270
+ yield adapter.fetchInitialData();
17271
+ // Fetch initial set of messages. Without fetching messages here, if the Composite's adapter is changed the message thread does not load new messages.
17272
+ yield adapter.loadPreviousChatMessages(defaultNumberOfChatMessagesToReload);
17273
+ });
17274
+ fetchData();
17230
17275
  }, [adapter]);
17231
17276
  const messageThreadProps = usePropsFor$2(MessageThread);
17232
17277
  const sendBoxProps = usePropsFor$2(SendBox);
@@ -18219,7 +18264,7 @@ const galleryParentContainerStyles = (backgroundColor) => ({
18219
18264
  /**
18220
18265
  * @private
18221
18266
  */
18222
- const mediaGalleryContainerStyles = {
18267
+ const mediaGalleryContainerStyles$1 = {
18223
18268
  root: {
18224
18269
  height: '100%'
18225
18270
  }
@@ -19274,7 +19319,7 @@ const CallArrangement = (props) => {
19274
19319
  onPeopleButtonClicked: togglePeoplePane })))),
19275
19320
  React__default['default'].createElement(react.Stack, { horizontal: true, grow: true },
19276
19321
  React__default['default'].createElement(react.Stack.Item, { grow: true, style: callCompositeContainerFlex() },
19277
- React__default['default'].createElement(react.Stack.Item, { styles: callGalleryStyles, grow: true }, props.onRenderGalleryContent && (React__default['default'].createElement(react.Stack, { verticalFill: true, styles: mediaGalleryContainerStyles }, props.onRenderGalleryContent())))),
19322
+ React__default['default'].createElement(react.Stack.Item, { styles: callGalleryStyles, grow: true }, props.onRenderGalleryContent && (React__default['default'].createElement(react.Stack, { verticalFill: true, styles: mediaGalleryContainerStyles$1 }, props.onRenderGalleryContent())))),
19278
19323
  /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */
19279
19324
  callPaneContent())))));
19280
19325
  };
@@ -19457,6 +19502,12 @@ const MediaGallery = (props) => {
19457
19502
  const cameraSwitcherCameras = useSelector$1(localVideoCameraCycleButtonSelector);
19458
19503
  const cameraSwitcherCallback = useHandlers();
19459
19504
  const announcerString = useParticipantChangedAnnouncement();
19505
+ /* @conditional-compile-remove(vertical-gallery) */
19506
+ const containerRef = React.useRef(null);
19507
+ /* @conditional-compile-remove(vertical-gallery) */
19508
+ const containerWidth = _useContainerWidth(containerRef);
19509
+ /* @conditional-compile-remove(vertical-gallery) */
19510
+ const containerHeight = _useContainerHeight(containerRef);
19460
19511
  const cameraSwitcherProps = React.useMemo(() => {
19461
19512
  return Object.assign(Object.assign({}, cameraSwitcherCallback), cameraSwitcherCameras);
19462
19513
  }, [cameraSwitcherCallback, cameraSwitcherCameras]);
@@ -19475,18 +19526,25 @@ const MediaGallery = (props) => {
19475
19526
  ? { kind: 'drawer', hostId: props.drawerMenuHostId }
19476
19527
  : { kind: 'contextual' };
19477
19528
  }, [(_a = props.remoteVideoTileMenuOptions) === null || _a === void 0 ? void 0 : _a.isHidden, props.isMobile, props.drawerMenuHostId]);
19529
+ /* @conditional-compile-remove(vertical-gallery) */
19530
+ const overflowGalleryLayout = React.useMemo(() => containerWidth && containerHeight && containerWidth / containerHeight >= 16 / 9
19531
+ ? 'VerticalRight'
19532
+ : 'HorizontalBottom', [containerWidth, containerHeight]);
19478
19533
  const VideoGalleryMemoized = React.useMemo(() => {
19479
19534
  return (React__default['default'].createElement(VideoGallery, Object.assign({}, videoGalleryProps, { localVideoViewOptions: localVideoViewOptions$2, remoteVideoViewOptions: remoteVideoViewOptions, styles: VideoGalleryStyles, layout: "floatingLocalVideo", showCameraSwitcherInLocalPreview: props.isMobile, localVideoCameraCycleButtonProps: cameraSwitcherProps, onRenderAvatar: onRenderAvatar,
19480
19535
  /* @conditional-compile-remove(pinned-participants) */
19481
- remoteVideoTileMenuOptions: remoteVideoTileMenuOptions })));
19536
+ remoteVideoTileMenuOptions: remoteVideoTileMenuOptions,
19537
+ /* @conditional-compile-remove(vertical-gallery) */
19538
+ overflowGalleryLayout: overflowGalleryLayout })));
19482
19539
  }, [
19483
19540
  videoGalleryProps,
19484
19541
  props.isMobile,
19485
19542
  onRenderAvatar,
19486
19543
  cameraSwitcherProps,
19487
- /* @conditional-compile-remove(pinned-participants) */ remoteVideoTileMenuOptions
19544
+ /* @conditional-compile-remove(pinned-participants) */ remoteVideoTileMenuOptions,
19545
+ /* @conditional-compile-remove(vertical-gallery) */ overflowGalleryLayout
19488
19546
  ]);
19489
- return (React__default['default'].createElement(React__default['default'].Fragment, null,
19547
+ return (React__default['default'].createElement("div", { ref: containerRef, style: mediaGalleryContainerStyles },
19490
19548
  React__default['default'].createElement(Announcer, { announcementString: announcerString, ariaLive: 'polite' }),
19491
19549
  VideoGalleryMemoized));
19492
19550
  };
@@ -19516,6 +19574,7 @@ const useLocalVideoStartTrigger = (isLocalVideoAvailable, shouldTransition) => {
19516
19574
  }
19517
19575
  }, [shouldTransition, isButtonStatusSynced, isPreviewCameraOn, isLocalVideoAvailable, mediaGalleryHandlers]);
19518
19576
  };
19577
+ const mediaGalleryContainerStyles = { width: '100%', height: '100%' };
19519
19578
 
19520
19579
  // Copyright (c) Microsoft Corporation.
19521
19580
  // Licensed under the MIT license.