@azure/communication-react 1.19.0-alpha-202408250016 → 1.19.0-alpha-202408270015

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 (39) hide show
  1. package/dist/communication-react.d.ts +18 -0
  2. package/dist/dist-cjs/communication-react/{ChatMessageComponentAsRichTextEditBox-vvmyDrAz.js → ChatMessageComponentAsRichTextEditBox-qEJmtx93.js} +2 -2
  3. package/dist/dist-cjs/communication-react/{ChatMessageComponentAsRichTextEditBox-vvmyDrAz.js.map → ChatMessageComponentAsRichTextEditBox-qEJmtx93.js.map} +1 -1
  4. package/dist/dist-cjs/communication-react/{RichTextSendBoxWrapper-BXGkZC3x.js → RichTextSendBoxWrapper-BgnerjU-.js} +2 -2
  5. package/dist/dist-cjs/communication-react/{RichTextSendBoxWrapper-BXGkZC3x.js.map → RichTextSendBoxWrapper-BgnerjU-.js.map} +1 -1
  6. package/dist/dist-cjs/communication-react/{index-Bqw-4OaM.js → index-DejG4i9h.js} +181 -59
  7. package/dist/dist-cjs/communication-react/index-DejG4i9h.js.map +1 -0
  8. package/dist/dist-cjs/communication-react/index.js +1 -1
  9. package/dist/dist-esm/acs-ui-common/src/telemetryVersion.js +1 -1
  10. package/dist/dist-esm/acs-ui-common/src/telemetryVersion.js.map +1 -1
  11. package/dist/dist-esm/calling-stateful-client/src/BreakoutRoomsSubscriber.js +5 -4
  12. package/dist/dist-esm/calling-stateful-client/src/BreakoutRoomsSubscriber.js.map +1 -1
  13. package/dist/dist-esm/calling-stateful-client/src/CallContext.d.ts +1 -1
  14. package/dist/dist-esm/calling-stateful-client/src/CallContext.js.map +1 -1
  15. package/dist/dist-esm/react-composites/src/composites/CallComposite/Strings.d.ts +18 -0
  16. package/dist/dist-esm/react-composites/src/composites/CallComposite/Strings.js.map +1 -1
  17. package/dist/dist-esm/react-composites/src/composites/CallComposite/adapter/AzureCommunicationCallAdapter.d.ts +1 -0
  18. package/dist/dist-esm/react-composites/src/composites/CallComposite/adapter/AzureCommunicationCallAdapter.js +36 -29
  19. package/dist/dist-esm/react-composites/src/composites/CallComposite/adapter/AzureCommunicationCallAdapter.js.map +1 -1
  20. package/dist/dist-esm/react-composites/src/composites/CallComposite/components/Banner.d.ts +47 -0
  21. package/dist/dist-esm/react-composites/src/composites/CallComposite/components/Banner.js +48 -0
  22. package/dist/dist-esm/react-composites/src/composites/CallComposite/components/Banner.js.map +1 -0
  23. package/dist/dist-esm/react-composites/src/composites/CallComposite/components/BreakoutRoomsBanner.d.ts +13 -0
  24. package/dist/dist-esm/react-composites/src/composites/CallComposite/components/BreakoutRoomsBanner.js +43 -0
  25. package/dist/dist-esm/react-composites/src/composites/CallComposite/components/BreakoutRoomsBanner.js.map +1 -0
  26. package/dist/dist-esm/react-composites/src/composites/CallComposite/components/CallArrangement.js +13 -2
  27. package/dist/dist-esm/react-composites/src/composites/CallComposite/components/CallArrangement.js.map +1 -1
  28. package/dist/dist-esm/react-composites/src/composites/CallComposite/selectors/baseSelectors.d.ts +5 -0
  29. package/dist/dist-esm/react-composites/src/composites/CallComposite/selectors/baseSelectors.js +5 -0
  30. package/dist/dist-esm/react-composites/src/composites/CallComposite/selectors/baseSelectors.js.map +1 -1
  31. package/dist/dist-esm/react-composites/src/composites/CallComposite/utils/Utils.d.ts +1 -1
  32. package/dist/dist-esm/react-composites/src/composites/CallComposite/utils/Utils.js +6 -1
  33. package/dist/dist-esm/react-composites/src/composites/CallComposite/utils/Utils.js.map +1 -1
  34. package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/adapter/AzureCommunicationCallWithChatAdapter.js +16 -4
  35. package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/adapter/AzureCommunicationCallWithChatAdapter.js.map +1 -1
  36. package/dist/dist-esm/react-composites/src/composites/common/ControlBar/CommonCallControlBar.js +10 -2
  37. package/dist/dist-esm/react-composites/src/composites/common/ControlBar/CommonCallControlBar.js.map +1 -1
  38. package/package.json +1 -1
  39. package/dist/dist-cjs/communication-react/index-Bqw-4OaM.js.map +0 -1
@@ -189,7 +189,7 @@ function getDefaultExportFromCjs (x) {
189
189
  // Copyright (c) Microsoft Corporation.
190
190
  // Licensed under the MIT License.
191
191
  // GENERATED FILE. DO NOT EDIT MANUALLY.
192
- var telemetryVersion = '1.19.0-alpha-202408250016';
192
+ var telemetryVersion = '1.19.0-alpha-202408270015';
193
193
 
194
194
 
195
195
  var telemetryVersion$1 = /*@__PURE__*/getDefaultExportFromCjs(telemetryVersion);
@@ -10753,7 +10753,7 @@ class _ErrorBoundary extends React.Component {
10753
10753
  // Copyright (c) Microsoft Corporation.
10754
10754
  // Licensed under the MIT License.
10755
10755
  /* @conditional-compile-remove(rich-text-editor) */
10756
- const ChatMessageComponentAsRichTextEditBox = React.lazy(() => Promise.resolve().then(function () { return require('./ChatMessageComponentAsRichTextEditBox-vvmyDrAz.js'); }));
10756
+ const ChatMessageComponentAsRichTextEditBox = React.lazy(() => Promise.resolve().then(function () { return require('./ChatMessageComponentAsRichTextEditBox-qEJmtx93.js'); }));
10757
10757
  /**
10758
10758
  * @private
10759
10759
  * Use this function to load RoosterJS dependencies early in the lifecycle.
@@ -10761,7 +10761,7 @@ const ChatMessageComponentAsRichTextEditBox = React.lazy(() => Promise.resolve()
10761
10761
  *
10762
10762
  * @conditional-compile-remove(rich-text-editor)
10763
10763
  */
10764
- const loadChatMessageComponentAsRichTextEditBox = () => Promise.resolve().then(function () { return require('./ChatMessageComponentAsRichTextEditBox-vvmyDrAz.js'); });
10764
+ const loadChatMessageComponentAsRichTextEditBox = () => Promise.resolve().then(function () { return require('./ChatMessageComponentAsRichTextEditBox-qEJmtx93.js'); });
10765
10765
  /**
10766
10766
  * @private
10767
10767
  */
@@ -12567,13 +12567,13 @@ const DrawerContentContainer = (props) => {
12567
12567
  const theme = react.useTheme();
12568
12568
  const backgroundColor = theme.palette.white;
12569
12569
  const borderRadius = theme.effects.roundedCorner4;
12570
- const rootStyles = react.mergeStyles(containerStyles$5(backgroundColor, borderRadius), (_a = props.styles) === null || _a === void 0 ? void 0 : _a.root);
12570
+ const rootStyles = react.mergeStyles(containerStyles$6(backgroundColor, borderRadius), (_a = props.styles) === null || _a === void 0 ? void 0 : _a.root);
12571
12571
  return (React.createElement(react.Stack, { className: rootStyles },
12572
12572
  props.heading && (React.createElement(react.Stack, { className: react.mergeStyles(headingContainerStyles) },
12573
12573
  React.createElement(react.Text, { className: react.mergeStyles(headingStyles(theme)) }, props.heading))),
12574
12574
  props.children));
12575
12575
  };
12576
- const containerStyles$5 = (backgroundColor, borderRadius) => (Object.assign({ background: backgroundColor, borderTopRightRadius: borderRadius, borderTopLeftRadius: borderRadius }, react.AnimationStyles.slideUpIn10));
12576
+ const containerStyles$6 = (backgroundColor, borderRadius) => (Object.assign({ background: backgroundColor, borderTopRightRadius: borderRadius, borderTopLeftRadius: borderRadius }, react.AnimationStyles.slideUpIn10));
12577
12577
  const headingContainerStyles = {
12578
12578
  textAlign: 'center',
12579
12579
  width: '100%',
@@ -18358,7 +18358,7 @@ const secondaryTileFloatingStyles = {
18358
18358
  /**
18359
18359
  * @private
18360
18360
  */
18361
- const containerStyles$4 = (theme) => {
18361
+ const containerStyles$5 = (theme) => {
18362
18362
  return {
18363
18363
  maxWidth: '16rem',
18364
18364
  textAlign: 'center',
@@ -18738,7 +18738,7 @@ const DialpadContainer = (props) => {
18738
18738
  const modifiedInput = plainTextValue.substring(0, plainTextValue.length - 1);
18739
18739
  setText(modifiedInput);
18740
18740
  };
18741
- return (React.createElement(react.Stack, { className: react.mergeStyles(containerStyles$4(theme), (_a = props.styles) === null || _a === void 0 ? void 0 : _a.root), "data-test-id": "dialpadContainer", "data-ui-id": "dialpadContainer", horizontalAlign: 'center' },
18741
+ return (React.createElement(react.Stack, { className: react.mergeStyles(containerStyles$5(theme), (_a = props.styles) === null || _a === void 0 ? void 0 : _a.root), "data-test-id": "dialpadContainer", "data-ui-id": "dialpadContainer", horizontalAlign: 'center' },
18742
18742
  dialpadMode === 'dialer' && (React.createElement(react.TextField, { styles: react.concatStyleSets(textFieldStyles(theme, plainTextValue !== ''), (_b = props.styles) === null || _b === void 0 ? void 0 : _b.textField), value: textFieldValue ? textFieldValue : _formatPhoneNumber(plainTextValue),
18743
18743
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
18744
18744
  onChange: (e) => {
@@ -19139,7 +19139,7 @@ const linkTextStyles = {
19139
19139
  /**
19140
19140
  * @internal
19141
19141
  */
19142
- const containerStyles$3 = {
19142
+ const containerStyles$4 = {
19143
19143
  root: {
19144
19144
  maxWidth: _pxToRem(375),
19145
19145
  padding: '2rem'
@@ -19166,7 +19166,7 @@ const continueAnywayButtonStyles = (theme) => {
19166
19166
  const UnsupportedEnvironmentContainer = (props) => {
19167
19167
  const { onTroubleshootingClick, strings, onContinueAnywayClick } = props;
19168
19168
  const theme = useTheme();
19169
- return (React.createElement(react.Stack, { styles: containerStyles$3, tokens: { childrenGap: '2rem' } },
19169
+ return (React.createElement(react.Stack, { styles: containerStyles$4, tokens: { childrenGap: '2rem' } },
19170
19170
  React.createElement(react.Icon, { iconName: "UnsupportedEnvironmentWarning", "data-ui-id": "unsupported-environment-icon" }),
19171
19171
  React.createElement(react.Stack, { styles: testContainerStyles, tokens: { childrenGap: '0.25rem' } },
19172
19172
  React.createElement(react.Text, { styles: mainTextStyles }, strings === null || strings === void 0 ? void 0 : strings.primaryText),
@@ -20109,7 +20109,7 @@ const messageTextStyle = (theme) => react.mergeStyles({
20109
20109
  /**
20110
20110
  * @private
20111
20111
  */
20112
- const titleTextClassName = react.mergeStyles({
20112
+ const titleTextClassName$1 = react.mergeStyles({
20113
20113
  fontWeight: 400,
20114
20114
  fontSize: _pxToRem(14),
20115
20115
  lineHeight: _pxToRem(16),
@@ -20118,7 +20118,7 @@ const titleTextClassName = react.mergeStyles({
20118
20118
  /**
20119
20119
  * @private
20120
20120
  */
20121
- const containerStyles$2 = (theme) => react.mergeStyles({
20121
+ const containerStyles$3 = (theme) => react.mergeStyles({
20122
20122
  boxShadow: theme.effects.elevation8,
20123
20123
  width: '20rem',
20124
20124
  padding: '0.75rem',
@@ -20172,11 +20172,11 @@ const Notification = (props) => {
20172
20172
  }
20173
20173
  }
20174
20174
  return (React.createElement(react.Stack, { horizontalAlign: "center" },
20175
- React.createElement(react.Stack, { "data-ui-id": "notification-bar", className: containerStyles$2(theme) },
20175
+ React.createElement(react.Stack, { "data-ui-id": "notification-bar", className: containerStyles$3(theme) },
20176
20176
  React.createElement(react.Stack, { horizontal: true, horizontalAlign: "space-between" },
20177
20177
  React.createElement(react.Stack, { horizontal: true },
20178
20178
  React.createElement(react.Icon, Object.assign({ className: notificationIconClassName, iconName: (_b = (_a = props.notificationIconProps) === null || _a === void 0 ? void 0 : _a.iconName) !== null && _b !== void 0 ? _b : 'ErrorBadge' }, props.notificationIconProps)),
20179
- React.createElement(react.Text, { className: titleTextClassName }, strings === null || strings === void 0 ? void 0 : strings.title)),
20179
+ React.createElement(react.Text, { className: titleTextClassName$1 }, strings === null || strings === void 0 ? void 0 : strings.title)),
20180
20180
  React.createElement(react.IconButton, { iconProps: cancelIcon, ariaLabel: strings === null || strings === void 0 ? void 0 : strings.dismissButtonAriaLabel, "aria-live": 'polite', onClick: props.onDismiss })),
20181
20181
  React.createElement(react.Text, { className: messageTextStyle(theme) }, strings === null || strings === void 0 ? void 0 : strings.message),
20182
20182
  React.createElement(react.Stack, { horizontal: true, horizontalAlign: "space-evenly" },
@@ -22982,7 +22982,7 @@ const AttachmentDownloadErrorBar = (props) => {
22982
22982
  /**
22983
22983
  * Wrapper for RichTextSendBox component to allow us to use usePropsFor with richTextSendBox with lazy loading
22984
22984
  */
22985
- const RichTextSendBoxWrapper = React.lazy(() => Promise.resolve().then(function () { return require('./RichTextSendBoxWrapper-BXGkZC3x.js'); }).then((module) => ({ default: module.RichTextSendBoxWrapper })));
22985
+ const RichTextSendBoxWrapper = React.lazy(() => Promise.resolve().then(function () { return require('./RichTextSendBoxWrapper-BgnerjU-.js'); }).then((module) => ({ default: module.RichTextSendBoxWrapper })));
22986
22986
  /**
22987
22987
  * @private
22988
22988
  * Use this function to load RoosterJS dependencies early in the lifecycle.
@@ -22990,7 +22990,7 @@ const RichTextSendBoxWrapper = React.lazy(() => Promise.resolve().then(function
22990
22990
  *
22991
22991
  /* @conditional-compile-remove(rich-text-editor-composite-support)
22992
22992
  */
22993
- const loadRichTextSendBox = () => Promise.resolve().then(function () { return require('./RichTextSendBoxWrapper-BXGkZC3x.js'); }).then((module) => ({ default: module.RichTextSendBoxWrapper }));
22993
+ const loadRichTextSendBox = () => Promise.resolve().then(function () { return require('./RichTextSendBoxWrapper-BgnerjU-.js'); }).then((module) => ({ default: module.RichTextSendBoxWrapper }));
22994
22994
  /**
22995
22995
  * @private
22996
22996
  */
@@ -23915,7 +23915,7 @@ const getLatestErrors = (state) => state.latestErrors;
23915
23915
  /**
23916
23916
  * @private
23917
23917
  */
23918
- const getLatestNotifications = (state) => state.latestNotifications;
23918
+ const getLatestNotifications$1 = (state) => state.latestNotifications;
23919
23919
  /**
23920
23920
  * @private
23921
23921
  */
@@ -24885,7 +24885,7 @@ const createDefaultTeamsCallingHandlers = memoizeOne((callClient, callAgent, dev
24885
24885
  */
24886
24886
  const notificationStackSelector = reselect.createSelector([
24887
24887
  getLatestErrors,
24888
- /* @conditional-compile-remove(breakout-rooms) */ getLatestNotifications,
24888
+ /* @conditional-compile-remove(breakout-rooms) */ getLatestNotifications$1,
24889
24889
  getDiagnostics,
24890
24890
  getDeviceManager$1,
24891
24891
  getEnvironmentInfo,
@@ -28135,16 +28135,13 @@ class BreakoutRoomsSubscriber {
28135
28135
  clearTimeout(this._breakoutRoomClosingSoonTimeoutId);
28136
28136
  };
28137
28137
  this.onBreakoutRoomsUpdated = (eventData) => {
28138
- if (!eventData.data) {
28139
- return;
28140
- }
28141
28138
  if (eventData.type === 'assignedBreakoutRooms') {
28142
28139
  this.onAssignedBreakoutRoomUpdated(eventData.data);
28143
28140
  }
28144
28141
  else if (eventData.type === 'join') {
28145
28142
  this.onBreakoutRoomsJoined(eventData.data);
28146
28143
  }
28147
- else if (eventData.type === 'breakoutRoomsSettings') {
28144
+ else if (eventData.type === 'breakoutRoomsSettings' && eventData.data) {
28148
28145
  this.onBreakoutRoomSettingsUpdated(eventData.data);
28149
28146
  }
28150
28147
  };
@@ -28157,6 +28154,10 @@ class BreakoutRoomsSubscriber {
28157
28154
  if (callState === undefined) {
28158
28155
  return;
28159
28156
  }
28157
+ if (!breakoutRoom) {
28158
+ this._context.setAssignedBreakoutRoom(this._callIdRef.callId, breakoutRoom);
28159
+ return;
28160
+ }
28160
28161
  if (breakoutRoom.state === 'open' &&
28161
28162
  (currentAssignedBreakoutRoom === null || currentAssignedBreakoutRoom === void 0 ? void 0 : currentAssignedBreakoutRoom.state) === 'open' &&
28162
28163
  ((_b = currentAssignedBreakoutRoom === null || currentAssignedBreakoutRoom === void 0 ? void 0 : currentAssignedBreakoutRoom.call) === null || _b === void 0 ? void 0 : _b.id) !== ((_c = breakoutRoom.call) === null || _c === void 0 ? void 0 : _c.id)) {
@@ -30911,7 +30912,8 @@ const getEndedCallPageProps = (locale, endedCall) => {
30911
30912
  *
30912
30913
  * @private
30913
30914
  */
30914
- const getCallCompositePage = (call, previousCall, transferCall, unsupportedBrowserInfo) => {
30915
+ const getCallCompositePage = (call, previousCall, transferCall, originCall, unsupportedBrowserInfo) => {
30916
+ var _a;
30915
30917
  /* @conditional-compile-remove(unsupported-browser) */
30916
30918
  if (isUnsupportedEnvironment(unsupportedBrowserInfo === null || unsupportedBrowserInfo === void 0 ? void 0 : unsupportedBrowserInfo.environmentInfo, unsupportedBrowserInfo === null || unsupportedBrowserInfo === void 0 ? void 0 : unsupportedBrowserInfo.unsupportedBrowserVersionOptedIn)) {
30917
30919
  return 'unsupportedEnvironment';
@@ -30947,6 +30949,10 @@ const getCallCompositePage = (call, previousCall, transferCall, unsupportedBrows
30947
30949
  return 'configuration';
30948
30950
  }
30949
30951
  }
30952
+ // /* @conditional-compile-remove(breakout-rooms) */
30953
+ if (((_a = previousCall === null || previousCall === void 0 ? void 0 : previousCall.breakoutRooms) === null || _a === void 0 ? void 0 : _a.breakoutRoomOriginCallId) && originCall) {
30954
+ return 'call';
30955
+ }
30950
30956
  if (previousCall) {
30951
30957
  const reason = getCallEndReason(previousCall);
30952
30958
  switch (reason) {
@@ -32057,6 +32063,11 @@ const getBreakoutRoomSettings = (state) => { var _a, _b; return (_b = (_a = stat
32057
32063
  * @private
32058
32064
  */
32059
32065
  const getBreakoutRoomDisplayName = (state) => { var _a, _b; return (_b = (_a = state.call) === null || _a === void 0 ? void 0 : _a.breakoutRooms) === null || _b === void 0 ? void 0 : _b.breakoutRoomDisplayName; };
32066
+ /* @conditional-compile-remove(breakout-rooms) */
32067
+ /**
32068
+ * @private
32069
+ */
32070
+ const getLatestNotifications = (state) => state.latestNotifications;
32060
32071
 
32061
32072
  // Copyright (c) Microsoft Corporation.
32062
32073
  // Licensed under the MIT License.
@@ -33504,7 +33515,12 @@ const CommonCallControlBar = (props) => {
33504
33515
  /* @conditional-compile-remove(breakout-rooms) */
33505
33516
  const assignedBreakoutRoom = useSelector$1(getAssignedBreakoutRoom);
33506
33517
  /* @conditional-compile-remove(breakout-rooms) */
33518
+ const latestNotifications = useSelector$1(getLatestNotifications);
33519
+ /* @conditional-compile-remove(breakout-rooms) */
33507
33520
  const breakoutRoomSettings = useSelector$1(getBreakoutRoomSettings);
33521
+ /* @conditional-compile-remove(breakout-rooms) */
33522
+ const movingToBreakoutRoomAutomatically = (assignedBreakoutRoom === null || assignedBreakoutRoom === void 0 ? void 0 : assignedBreakoutRoom.autoMoveParticipantToBreakoutRoom) &&
33523
+ (latestNotifications['assignedBreakoutRoomOpened'] || latestNotifications['assignedBreakoutRoomChanged']);
33508
33524
  const handleResize = React.useCallback(() => {
33509
33525
  setControlBarButtonsWidth(controlBarContainerRef.current ? controlBarContainerRef.current.offsetWidth : 0);
33510
33526
  setPanelsButtonsWidth(sidepaneControlsRef.current ? sidepaneControlsRef.current.offsetWidth : 0);
@@ -33623,7 +33639,10 @@ const CommonCallControlBar = (props) => {
33623
33639
  React.createElement("div", { ref: controlBarContainerRef },
33624
33640
  React.createElement(ControlBar, { layout: props.displayVertical ? 'vertical' : 'horizontal', styles: centerContainerStyles },
33625
33641
  /* @conditional-compile-remove(breakout-rooms) */
33626
- assignedBreakoutRoom && assignedBreakoutRoom.state === 'open' && (React.createElement(react.PrimaryButton, { text: callStrings.joinBreakoutRoomButtonLabel, onClick: () => __awaiter$l(void 0, void 0, void 0, function* () {
33642
+ !props.mobileView &&
33643
+ assignedBreakoutRoom &&
33644
+ assignedBreakoutRoom.state === 'open' &&
33645
+ !movingToBreakoutRoomAutomatically && (React.createElement(react.PrimaryButton, { text: callStrings.joinBreakoutRoomButtonLabel, onClick: () => __awaiter$l(void 0, void 0, void 0, function* () {
33627
33646
  assignedBreakoutRoom.join();
33628
33647
  }), styles: commonButtonStyles })),
33629
33648
  microphoneButtonIsEnabled && (React.createElement(Microphone, { displayType: options.displayType, styles: commonButtonStyles, splitButtonsForDeviceSelection: !props.mobileView,
@@ -36334,6 +36353,81 @@ const useCompositeStringsForNotificationStackStrings = (locale) => {
36334
36353
  return notificationStackStrings;
36335
36354
  };
36336
36355
 
36356
+ // Copyright (c) Microsoft Corporation.
36357
+ // Licensed under the MIT License.
36358
+ /**
36359
+ * A component to show a banner in the UI.
36360
+ *
36361
+ * @private
36362
+ */
36363
+ const Banner = (props) => {
36364
+ var _a, _b;
36365
+ const strings = props.strings;
36366
+ const theme = react.useTheme();
36367
+ return (React.createElement(react.Stack, { horizontalAlign: "center" },
36368
+ React.createElement(react.Stack, { "data-ui-id": "banner", className: containerStyles$2(theme) },
36369
+ React.createElement(react.Stack, { horizontal: true, horizontalAlign: "space-between" },
36370
+ React.createElement(react.Stack, { horizontal: true },
36371
+ ((_a = props.iconProps) === null || _a === void 0 ? void 0 : _a.iconName) && (React.createElement(react.Icon, Object.assign({ className: bannerIconClassName, iconName: (_b = props.iconProps) === null || _b === void 0 ? void 0 : _b.iconName }, props.iconProps))),
36372
+ React.createElement(react.Text, { className: titleTextClassName }, strings === null || strings === void 0 ? void 0 : strings.title)),
36373
+ props.primaryButton ? (React.createElement(react.PrimaryButton, { text: strings === null || strings === void 0 ? void 0 : strings.primaryButtonLabel, ariaLabel: strings === null || strings === void 0 ? void 0 : strings.primaryButtonLabel, onClick: props.onClickButton })) : (React.createElement(react.DefaultButton, { text: strings === null || strings === void 0 ? void 0 : strings.primaryButtonLabel, ariaLabel: strings === null || strings === void 0 ? void 0 : strings.primaryButtonLabel, onClick: props.onClickButton }))))));
36374
+ };
36375
+ const titleTextClassName = react.mergeStyles({
36376
+ fontWeight: 400,
36377
+ fontSize: _pxToRem(14),
36378
+ lineHeight: _pxToRem(16),
36379
+ alignSelf: 'center'
36380
+ });
36381
+ const containerStyles$2 = (theme) => react.mergeStyles({
36382
+ boxShadow: theme.effects.elevation8,
36383
+ width: '20rem',
36384
+ padding: '0.75rem',
36385
+ borderRadius: '0.25rem',
36386
+ position: 'relative',
36387
+ backgroundColor: theme.palette.white
36388
+ });
36389
+ const bannerIconClassName = react.mergeStyles({
36390
+ fontSize: '1.25rem',
36391
+ alignSelf: 'center',
36392
+ marginRight: '0.5rem',
36393
+ svg: {
36394
+ width: '1.25rem',
36395
+ height: '1.25rem'
36396
+ }
36397
+ });
36398
+
36399
+ // Copyright (c) Microsoft Corporation.
36400
+ // Licensed under the MIT License.
36401
+ /* @conditional-compile-remove(breakout-rooms) */
36402
+ /* @conditional-compile-remove(breakout-rooms) */
36403
+ /**
36404
+ * @private
36405
+ */
36406
+ const BreakoutRoomsBanner = (props) => {
36407
+ const { latestNotifications, locale, adapter } = props;
36408
+ const assignedBreakoutRoom = useSelector$1(getAssignedBreakoutRoom);
36409
+ const breakoutRoomSettings = useSelector$1(getBreakoutRoomSettings);
36410
+ const autoMoveToBreakoutRoomCurrentlyInEffect = (assignedBreakoutRoom === null || assignedBreakoutRoom === void 0 ? void 0 : assignedBreakoutRoom.autoMoveParticipantToBreakoutRoom) &&
36411
+ (latestNotifications === null || latestNotifications === void 0 ? void 0 : latestNotifications.find((notification) => notification.type === 'assignedBreakoutRoomOpened' || notification.type === 'assignedBreakoutRoomChanged'));
36412
+ if (assignedBreakoutRoom && assignedBreakoutRoom.state === 'open' && !autoMoveToBreakoutRoomCurrentlyInEffect) {
36413
+ return (React.createElement(react.Stack, { styles: bannerNotificationStyles },
36414
+ React.createElement(Banner, { strings: {
36415
+ title: assignedBreakoutRoom.displayName
36416
+ ? locale.strings.call.joinBreakoutRoomBannerTitle.replace('{roomName}', assignedBreakoutRoom.displayName)
36417
+ : locale.strings.call.joinBreakoutRoomBannerTitle,
36418
+ primaryButtonLabel: locale.strings.call.joinBreakoutRoomBannerButtonLabel
36419
+ }, onClickButton: () => assignedBreakoutRoom.join(), iconProps: { iconName: 'NotificationBarBreakoutRoomPromptJoin' }, primaryButton: true })));
36420
+ }
36421
+ else if (breakoutRoomSettings && breakoutRoomSettings.disableReturnToMainMeeting !== true) {
36422
+ return (React.createElement(react.Stack, { styles: bannerNotificationStyles },
36423
+ React.createElement(Banner, { strings: {
36424
+ title: locale.strings.call.returnFromBreakoutRoomBannerTitle,
36425
+ primaryButtonLabel: locale.strings.call.returnFromBreakoutRoomBannerButtonLabel
36426
+ }, onClickButton: () => adapter.returnFromBreakoutRoom(), iconProps: { iconName: 'NotificationBarBreakoutRoomClosingSoon' } })));
36427
+ }
36428
+ return undefined;
36429
+ };
36430
+
36337
36431
  // Copyright (c) Microsoft Corporation.
36338
36432
  // Licensed under the MIT License.
36339
36433
  /**
@@ -36586,6 +36680,13 @@ const CallArrangement = (props) => {
36586
36680
  : (_f = props.capabilitiesChangedNotificationBarProps) === null || _f === void 0 ? void 0 : _f.capabilitiesChangedNotifications;
36587
36681
  /* @conditional-compile-remove(breakout-rooms) */
36588
36682
  const notificationStackStrings = useCompositeStringsForNotificationStackStrings(locale);
36683
+ let latestNotifications = props.latestNotifications;
36684
+ /* @conditional-compile-remove(breakout-rooms) */
36685
+ // Filter out breakout room notification that prompts user to join breakout room when in mobile view. We will
36686
+ // replace it with a non-dismissible banner
36687
+ latestNotifications = props.mobileView
36688
+ ? (latestNotifications !== null && latestNotifications !== void 0 ? latestNotifications : []).filter((notification) => notification.type !== 'assignedBreakoutRoomOpenedPromptJoin')
36689
+ : latestNotifications;
36589
36690
  return (React.createElement("div", { ref: containerRef, className: react.mergeStyles(containerDivStyles), id: props.id },
36590
36691
  React.createElement(react.Stack, { verticalFill: true, horizontalAlign: "stretch", className: containerClassName, "data-ui-id": props.dataUiId },
36591
36692
  React.createElement(react.Stack, { reversed: true, horizontal: verticalControlBar, grow: true, styles: callArrangementContainerStyles(verticalControlBar) },
@@ -36616,10 +36717,12 @@ const CallArrangement = (props) => {
36616
36717
  React.createElement(react.Stack.Item, { styles: callGalleryStyles, grow: true },
36617
36718
  React.createElement(react.Stack, { verticalFill: true, styles: mediaGalleryContainerStyles$1 },
36618
36719
  React.createElement(react.Stack.Item, { styles: notificationsContainerStyles },
36720
+ /* @conditional-compile-remove(breakout-rooms) */
36721
+ props.mobileView && (React.createElement(BreakoutRoomsBanner, { latestNotifications: latestNotifications, locale: locale, adapter: adapter })),
36619
36722
  props.showErrorNotifications && (React.createElement(react.Stack, { styles: notificationStackStyles, horizontalAlign: "center", verticalAlign: "center" },
36620
36723
  React.createElement(NotificationStack, { onDismissNotification: props.onDismissError, activeNotifications: filteredLatestErrorNotifications }))),
36621
- props.latestNotifications && (React.createElement(react.Stack, { styles: notificationStackStyles, horizontalAlign: "center", verticalAlign: "center" },
36622
- React.createElement(NotificationStack, { activeNotifications: props.latestNotifications, onDismissNotification: props.onDismissNotification,
36724
+ latestNotifications && (React.createElement(react.Stack, { styles: notificationStackStyles, horizontalAlign: "center", verticalAlign: "center" },
36725
+ React.createElement(NotificationStack, { activeNotifications: latestNotifications, onDismissNotification: props.onDismissNotification,
36623
36726
  /* @conditional-compile-remove(breakout-rooms) */
36624
36727
  strings: notificationStackStrings }))),
36625
36728
  props.capabilitiesChangedNotificationBarProps &&
@@ -39970,7 +40073,7 @@ class CallContext {
39970
40073
  this.emitter.off('callEnded', handler);
39971
40074
  }
39972
40075
  updateClientState(clientState) {
39973
- var _a;
40076
+ var _a, _b, _c, _d, _e;
39974
40077
  let call = this.callId ? clientState.calls[this.callId] : undefined;
39975
40078
  const latestEndedCall = clientState.callsEnded ? findLatestEndedCall(clientState.callsEnded) : undefined;
39976
40079
  // As the state is transitioning to a new state, trigger appropriate callback events.
@@ -39984,7 +40087,14 @@ class CallContext {
39984
40087
  ? findLatestAcceptedTransfer(call.transfer.acceptedTransfers)
39985
40088
  : undefined;
39986
40089
  const transferCall = latestAcceptedTransfer ? clientState.calls[latestAcceptedTransfer.callId] : undefined;
40090
+ /* @conditional-compile-remove(breakout-rooms) */
40091
+ const originCall = ((_a = call === null || call === void 0 ? void 0 : call.breakoutRooms) === null || _a === void 0 ? void 0 : _a.breakoutRoomOriginCallId)
40092
+ ? clientState.calls[(_b = call === null || call === void 0 ? void 0 : call.breakoutRooms) === null || _b === void 0 ? void 0 : _b.breakoutRoomOriginCallId]
40093
+ : ((_c = latestEndedCall === null || latestEndedCall === void 0 ? void 0 : latestEndedCall.breakoutRooms) === null || _c === void 0 ? void 0 : _c.breakoutRoomOriginCallId)
40094
+ ? clientState.calls[(_d = latestEndedCall === null || latestEndedCall === void 0 ? void 0 : latestEndedCall.breakoutRooms) === null || _d === void 0 ? void 0 : _d.breakoutRoomOriginCallId]
40095
+ : undefined;
39987
40096
  const newPage = getCallCompositePage(call, latestEndedCall, transferCall,
40097
+ /* @conditional-compile-remove(breakout-rooms) */ originCall,
39988
40098
  /* @conditional-compile-remove(unsupported-browser) */ environmentInfo);
39989
40099
  if (!IsCallEndedPage(oldPage) && IsCallEndedPage(newPage)) {
39990
40100
  this.emitter.emit('callEnded', { callId: this.callId });
@@ -39994,7 +40104,7 @@ class CallContext {
39994
40104
  call = undefined;
39995
40105
  }
39996
40106
  if (this.state.page) {
39997
- this.setState(Object.assign(Object.assign({}, this.state), { userId: clientState.userId, displayName: (_a = clientState.callAgent) === null || _a === void 0 ? void 0 : _a.displayName, call, page: newPage, endedCall: latestEndedCall, devices: clientState.deviceManager, latestErrors: clientState.latestErrors,
40107
+ this.setState(Object.assign(Object.assign({}, this.state), { userId: clientState.userId, displayName: (_e = clientState.callAgent) === null || _e === void 0 ? void 0 : _e.displayName, call, page: newPage, endedCall: latestEndedCall, devices: clientState.deviceManager, latestErrors: clientState.latestErrors,
39998
40108
  /* @conditional-compile-remove(breakout-rooms) */ latestNotifications: clientState.latestNotifications, cameraStatus: (call === null || call === void 0 ? void 0 : call.localVideoStreams.find((s) => s.mediaStreamType === 'Video')) ||
39999
40109
  clientState.deviceManager.unparentedViews.find((s) => s.mediaStreamType === 'Video')
40000
40110
  ? 'On'
@@ -40307,6 +40417,8 @@ class AzureCommunicationCallAdapter {
40307
40417
  ? { localVideoStreams: [new communicationCalling.LocalVideoStream(selectedCamera)] }
40308
40418
  : {};
40309
40419
  const call = this._joinCall(audioOptions, videoOptions);
40420
+ /* @conditional-compile-remove(breakout-rooms) */
40421
+ this.originCall = call;
40310
40422
  this.processNewCall(call);
40311
40423
  return call;
40312
40424
  });
@@ -40714,28 +40826,18 @@ class AzureCommunicationCallAdapter {
40714
40826
  /* @conditional-compile-remove(breakout-rooms) */
40715
40827
  returnFromBreakoutRoom() {
40716
40828
  return __awaiter$9(this, void 0, void 0, function* () {
40717
- var _a, _b, _c, _d;
40718
- if (this.call === undefined) {
40719
- return;
40720
- }
40721
- // Find call state of current call from stateful layer. The current call state of breakout room may not be present in calls array
40722
- // if the breakout room call is ended. So search the callsEnded array as well.
40723
- const callState = this.callClient.getState().calls[(_a = this.call) === null || _a === void 0 ? void 0 : _a.id]
40724
- ? this.callClient.getState().callsEnded[(_b = this.call) === null || _b === void 0 ? void 0 : _b.id]
40725
- : undefined;
40726
- // Find origin call id from breakout room call state
40727
- const originCallId = (_c = callState === null || callState === void 0 ? void 0 : callState.breakoutRooms) === null || _c === void 0 ? void 0 : _c.breakoutRoomOriginCallId;
40728
- // Find origin call from call agent
40729
- const originCall = (_d = this.callAgent) === null || _d === void 0 ? void 0 : _d.calls.find((callAgentCall) => {
40730
- return callAgentCall.id === originCallId;
40731
- });
40732
- if (!originCall) {
40829
+ var _a;
40830
+ if (!this.originCall) {
40733
40831
  throw new Error('Could not return from breakout room because the origin call could not be retrieved.');
40734
40832
  }
40833
+ if (((_a = this.call) === null || _a === void 0 ? void 0 : _a.id) === this.originCall.id) {
40834
+ console.error('Return from breakout room will not be done because current call is the origin call.');
40835
+ return;
40836
+ }
40735
40837
  const breakoutRoomCall = this.call;
40736
- this.processNewCall(originCall);
40838
+ this.processNewCall(this.originCall);
40737
40839
  yield this.resumeCall();
40738
- if ((breakoutRoomCall === null || breakoutRoomCall === void 0 ? void 0 : breakoutRoomCall.state) === 'Connected') {
40840
+ if ((breakoutRoomCall === null || breakoutRoomCall === void 0 ? void 0 : breakoutRoomCall.state) && !['Disconnecting', 'Disconnected'].includes(breakoutRoomCall.state)) {
40739
40841
  breakoutRoomCall.hangUp();
40740
40842
  }
40741
40843
  });
@@ -40823,7 +40925,7 @@ class AzureCommunicationCallAdapter {
40823
40925
  }
40824
40926
  }
40825
40927
  unsubscribeCallEvents() {
40826
- var _a, _b, _c, _d, _e;
40928
+ var _a, _b, _c, _d, _e, _f;
40827
40929
  for (const subscriber of this.participantSubscribers.values()) {
40828
40930
  subscriber.unsubscribeAll();
40829
40931
  }
@@ -40837,6 +40939,12 @@ class AzureCommunicationCallAdapter {
40837
40939
  if (this.callingSoundSubscriber) {
40838
40940
  this.callingSoundSubscriber.unsubscribeAll();
40839
40941
  }
40942
+ /* @conditional-compile-remove(breakout-rooms) */
40943
+ const breakoutRoomsFeature = (_f = this.call) === null || _f === void 0 ? void 0 : _f.feature(communicationCalling.Features.BreakoutRooms);
40944
+ /* @conditional-compile-remove(breakout-rooms) */
40945
+ if (breakoutRoomsFeature) {
40946
+ breakoutRoomsFeature.off('breakoutRoomsUpdated', this.breakoutRoomsUpdated.bind(this));
40947
+ }
40840
40948
  }
40841
40949
  /* @conditional-compile-remove(acs-close-captions) */
40842
40950
  captionsKindChanged() {
@@ -40929,19 +41037,21 @@ class AzureCommunicationCallAdapter {
40929
41037
  }
40930
41038
  /* @conditional-compile-remove(breakout-rooms) */
40931
41039
  breakoutRoomsUpdated(eventData) {
40932
- if (eventData.data) {
40933
- if (eventData.type === 'assignedBreakoutRooms') {
40934
- this.assignedBreakoutRoomUpdated(eventData.data);
40935
- }
40936
- else if (eventData.type === 'join') {
40937
- this.breakoutRoomJoined(eventData.data);
40938
- }
41040
+ if (eventData.type === 'assignedBreakoutRooms') {
41041
+ this.assignedBreakoutRoomUpdated(eventData.data);
41042
+ }
41043
+ else if (eventData.type === 'join') {
41044
+ this.breakoutRoomJoined(eventData.data);
40939
41045
  }
40940
41046
  this.emitter.emit('breakoutRoomsUpdated', eventData);
40941
41047
  }
40942
41048
  /* @conditional-compile-remove(breakout-rooms) */
40943
41049
  assignedBreakoutRoomUpdated(breakoutRoom) {
40944
- if (breakoutRoom.state === 'closed') {
41050
+ var _a, _b, _c;
41051
+ if (!((_a = this.call) === null || _a === void 0 ? void 0 : _a.id)) {
41052
+ return;
41053
+ }
41054
+ if (((_b = this.originCall) === null || _b === void 0 ? void 0 : _b.id) !== ((_c = this.call) === null || _c === void 0 ? void 0 : _c.id) && (!breakoutRoom || breakoutRoom.state === 'closed')) {
40945
41055
  this.returnFromBreakoutRoom();
40946
41056
  }
40947
41057
  }
@@ -42864,12 +42974,16 @@ class AzureCommunicationCallWithChatAdapter {
42864
42974
  /* @conditional-compile-remove(breakout-rooms) */
42865
42975
  returnFromBreakoutRoom() {
42866
42976
  return __awaiter$6(this, void 0, void 0, function* () {
42867
- var _a;
42868
- if (this.originCallChatAdapter) {
42869
- (_a = this.breakoutRoomChatAdapter) === null || _a === void 0 ? void 0 : _a.dispose();
42977
+ var _a, _b, _c, _d;
42978
+ if (this.originCallChatAdapter &&
42979
+ ((_a = this.context.getState().chat) === null || _a === void 0 ? void 0 : _a.threadId) !== this.originCallChatAdapter.getState().thread.threadId) {
42980
+ (_b = this.breakoutRoomChatAdapter) === null || _b === void 0 ? void 0 : _b.dispose();
42870
42981
  this.updateChatAdapter(this.originCallChatAdapter);
42871
42982
  }
42872
- yield this.callAdapter.returnFromBreakoutRoom();
42983
+ const originCallId = (_d = (_c = this.callAdapter.getState().call) === null || _c === void 0 ? void 0 : _c.breakoutRooms) === null || _d === void 0 ? void 0 : _d.breakoutRoomOriginCallId;
42984
+ if (originCallId) {
42985
+ yield this.callAdapter.returnFromBreakoutRoom();
42986
+ }
42873
42987
  });
42874
42988
  }
42875
42989
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -42969,6 +43083,10 @@ class AzureCommunicationCallWithChatAdapter {
42969
43083
  case 'spotlightChanged':
42970
43084
  this.callAdapter.on('spotlightChanged', listener);
42971
43085
  break;
43086
+ /* @conditional-compile-remove(breakout-rooms) */
43087
+ case 'breakoutRoomsUpdated':
43088
+ this.callAdapter.on('breakoutRoomsUpdated', listener);
43089
+ break;
42972
43090
  default:
42973
43091
  throw `Unknown AzureCommunicationCallWithChatAdapter Event: ${event}`;
42974
43092
  }
@@ -43070,6 +43188,10 @@ class AzureCommunicationCallWithChatAdapter {
43070
43188
  case 'spotlightChanged':
43071
43189
  this.callAdapter.off('spotlightChanged', listener);
43072
43190
  break;
43191
+ /* @conditional-compile-remove(breakout-rooms) */
43192
+ case 'breakoutRoomsUpdated':
43193
+ this.callAdapter.off('breakoutRoomsUpdated', listener);
43194
+ break;
43073
43195
  default:
43074
43196
  throw `Unknown AzureCommunicationCallWithChatAdapter Event: ${event}`;
43075
43197
  }
@@ -44112,4 +44234,4 @@ exports.useTeamsCall = useTeamsCall;
44112
44234
  exports.useTeamsCallAdapter = useTeamsCallAdapter;
44113
44235
  exports.useTeamsCallAgent = useTeamsCallAgent;
44114
44236
  exports.useTheme = useTheme;
44115
- //# sourceMappingURL=index-Bqw-4OaM.js.map
44237
+ //# sourceMappingURL=index-DejG4i9h.js.map