npm - @azure/communication-react - Versions diffs - 1.7.1-alpha-202308170011 → 1.7.1-alpha-202308172328 - Mend

@azure/communication-react 1.7.1-alpha-202308170011 → 1.7.1-alpha-202308172328

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 (128) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"LocalAndRemotePIP.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/components/LocalAndRemotePIP.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAIL,eAAe,EACf,gBAAgB,EAChB,0BAA0B,EAE3B,4CAAmC;AAEpC,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;~~AA2B~~/C;;GAEG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,KAA6B,EAAe,EAAE;;IAC9E,MAAM,EACJ,gBAAgB,EAChB,yBAAyB,EACzB,uBAAuB,EACvB,wBAAwB,EACxB,wBAAwB,EACxB,yBAAyB,EAC1B,GAAG,KAAK,CAAC;IAEV,MAAM,mBAAmB,GAAG,OAAO,CACjC,GAAG,EAAE;;QAAC,OAAA,CAAC;YACL,uBAAuB;YACvB,wBAAwB;YACxB,qBAAqB;YACrB,WAAW,EAAE,gBAAgB,CAAC,WAAW;YACzC,SAAS,EAAE,KAAK;YAChB,iBAAiB,EAAE,KAAK;YACxB,gCAAgC,EAAE,KAAK;YACvC,WAAW,EAAE,MAAA,gBAAgB,CAAC,WAAW,0CAAE,WAAW;YACtD,aAAa,EAAE,MAAA,gBAAgB,CAAC,WAAW,0CAAE,aAAa;~~SAC3D~~,CAAC,CAAA;KAAA,EACF;QACE,gBAAgB,CAAC,WAAW;QAC5B,MAAA,gBAAgB,CAAC,WAAW,0CAAE,WAAW;QACzC,MAAA,gBAAgB,CAAC,WAAW,0CAAE,aAAa;QAC3C,uBAAuB;QACvB,wBAAwB;~~KACzB~~,CACF,CAAC;IAEF,MAAM,oBAAoB,GAAG,OAAO,CAClC,GAAG,EAAE;;QACH,OAAA,CAAC,yBAAyB;YACxB,CAAC,CAAC,SAAS;YACX,CAAC,CAAC;gBACE,iBAAiB,EAAE,yBAAyB;gBAC5C,wBAAwB;gBACxB,yBAAyB;gBACzB,sBAAsB;gBACtB,WAAW,EAAE,yBAAyB,aAAzB,yBAAyB,uBAAzB,yBAAyB,CAAE,WAAW;gBACnD,SAAS,EAAE,KAAK;gBAChB,iBAAiB,EAAE,KAAK;gBACxB,WAAW,EAAE,MAAA,yBAAyB,CAAC,WAAW,0CAAE,WAAW;gBAC/D,WAAW,EAAE,MAAA,yBAAyB,CAAC,WAAW,0CAAE,WAAW;gBAC/D,aAAa,EAAE,MAAA,yBAAyB,CAAC,WAAW,0CAAE,aAAa;gBACnE,MAAM,EAAE,yBAAyB,CAAC,MAAM;gBACxC,GAAG,EAAE,yBAAyB,CAAC,MAAM;aACtC,CAAA;KAAA,EACP,CAAC,yBAAyB,EAAE,wBAAwB,EAAE,yBAAyB,CAAC,CACjF,CAAC;IAEF,MAAM,MAAM,GAAG,SAAS,EAAE,CAAC;IAC3B,MAAM,SAAS,GAAG,MAAM,CAAC,OAAO,CAAC,YAAY,CAAC,6BAA6B,CAAC;IAC5E,MAAM,OAAO,GAAG,OAAO,CACrB,GAAG,EAAE,CAAC,CAAC;QACL,aAAa,EAAE,SAAS;KACzB,CAAC,EACF,CAAC,SAAS,CAAC,CACZ,CAAC;IAEF,sFAAsF;IACtF,MAAM,gBAAgB,GAAwC,OAAO,CACnE,GAAG,EAAE,CAAC,CAAC;QACL,QAAQ,EAAE,oBAAoB,CAAC,CAAC,CAAC,CAC/B,oBAAC,gBAAgB,oBAAK,oBAAoB,EAAI,CAC/C,CAAC,CAAC,CAAC,CACF,oBAAC,eAAe,oBAAK,mBAAmB,EAAI,CAC7C;QACD,uHAAuH;QACvH,WAAW,EAAE,UAAU;KACxB,CAAC,EACF,CAAC,mBAAmB,EAAE,oBAAoB,CAAC,CAC5C,CAAC;IAEF,mGAAmG;IACnG,MAAM,kBAAkB,GAAoD,OAAO,CACjF,GAAG,EAAE,CACH,oBAAoB;QAClB,CAAC,CAAC;YACE,QAAQ,EAAE,oBAAC,eAAe,oBAAK,mBAAmB,IAAE,cAAc,EAAE,EAAE,IAAI;YAC1E,uHAAuH;YACvH,WAAW,EAAE,UAAU;SACxB;QACH,CAAC,CAAC,SAAS,EACf,CAAC,mBAAmB,EAAE,oBAAoB,CAAC,CAC5C,CAAC;IAEF,OAAO,CACL,oBAAC,0BAA0B,IACzB,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,gBAAgB,EAC7B,aAAa,EAAE,kBAAkB,GACjC,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,qBAAqB,GAAuB;IAChD,WAAW,EAAE,MAAM;IACnB,UAAU,EAAE,IAAI;CACjB,CAAC;AAEF,MAAM,sBAAsB,GAAuB;IACjD,WAAW,EAAE,MAAM;IACnB,UAAU,EAAE,KAAK;CAClB,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport React, { useMemo } from 'react';\nimport {\n CreateVideoStreamViewResult,\n VideoGalleryStream,\n VideoStreamOptions,\n _LocalVideoTile,\n _RemoteVideoTile,\n _PictureInPictureInPicture,\n _PictureInPictureInPictureTileProps\n} from '@internal/react-components';\n\nimport { useLocale } from '../../localization';\n\n/*\n @private\n /\nexport interface LocalAndRemotePIPProps {\n localParticipant: { displayName?: string; videoStream?: VideoGalleryStream };\n dominantRemoteParticipant?: {\n userId: string;\n displayName?: string;\n videoStream?: VideoGalleryStream;\n };\n\n /* Callback to create the local video stream view /\n onCreateLocalStreamView?: (options?: VideoStreamOptions) => Promise<void \| CreateVideoStreamViewResult>;\n /* Callback to dispose of the local video stream view /\n onDisposeLocalStreamView?: () => void;\n /* Callback to create a remote video stream view /\n onCreateRemoteStreamView?: (\n userId: string,\n options?: VideoStreamOptions\n ) => Promise<void \| CreateVideoStreamViewResult>;\n /* Callback to dispose a remote video stream view /\n onDisposeRemoteStreamView?: (userId: string) => Promise<void>;\n onClick?: () => void;\n}\n\n/\n @private\n */\nexport const LocalAndRemotePIP = (props: LocalAndRemotePIPProps): JSX.Element => {\n const {\n localParticipant,\n dominantRemoteParticipant,\n onCreateLocalStreamView,\n onDisposeLocalStreamView,\n onCreateRemoteStreamView,\n onDisposeRemoteStreamView\n } = props;\n\n const localVideoTileProps = useMemo(\n () => ({\n onCreateLocalStreamView,\n onDisposeLocalStreamView,\n localVideoViewOptions,\n displayName: localParticipant.displayName,\n showLabel: false,\n showMuteIndicator: false,\n showCameraSwitcherInLocalPreview: false,\n isAvailable: localParticipant.videoStream?.isAvailable,\n renderElement: localParticipant.videoStream?.renderElement\n }),\n [\n localParticipant.displayName,\n localParticipant.videoStream?.isAvailable,\n localParticipant.videoStream?.renderElement,\n onCreateLocalStreamView,\n onDisposeLocalStreamView\n ]\n );\n\n const remoteVideoTileProps = useMemo(\n () =>\n !dominantRemoteParticipant\n ? undefined\n : {\n remoteParticipant: dominantRemoteParticipant,\n onCreateRemoteStreamView,\n onDisposeRemoteStreamView,\n remoteVideoViewOptions,\n displayName: dominantRemoteParticipant?.displayName,\n showLabel: false,\n showMuteIndicator: false,\n isAvailable: dominantRemoteParticipant.videoStream?.isAvailable,\n isReceiving: dominantRemoteParticipant.videoStream?.isReceiving,\n renderElement: dominantRemoteParticipant.videoStream?.renderElement,\n userId: dominantRemoteParticipant.userId,\n key: dominantRemoteParticipant.userId\n },\n [dominantRemoteParticipant, onCreateRemoteStreamView, onDisposeRemoteStreamView]\n );\n\n const locale = useLocale();\n const ariaLabel = locale.strings.callWithChat.pictureInPictureTileAriaLabel;\n const strings = useMemo(\n () => ({\n rootAriaLabel: ariaLabel\n }),\n [ariaLabel]\n );\n\n // If there are no remote participants, show the local participant as the primary tile\n const primaryTileProps: _PictureInPictureInPictureTileProps = useMemo(\n () => ({\n children: remoteVideoTileProps ? (\n <_RemoteVideoTile {...remoteVideoTileProps} />\n ) : (\n <_LocalVideoTile {...localVideoTileProps} />\n ),\n // TODO: when the calling SDK provides height/width stream information - update this to reflect the stream orientation.\n orientation: 'portrait'\n }),\n [localVideoTileProps, remoteVideoTileProps]\n );\n\n // If we are showing the local participant as the primary tile, show nothing for the secondary tile\n const secondaryTileProps: _PictureInPictureInPictureTileProps \| undefined = useMemo(\n () =>\n remoteVideoTileProps\n ? {\n children: <_LocalVideoTile {...localVideoTileProps} personaMinSize={20} />,\n // TODO: when the calling SDK provides height/width stream information - update this to reflect the stream orientation.\n orientation: 'portrait'\n }\n : undefined,\n [localVideoTileProps, remoteVideoTileProps]\n );\n\n return (\n <_PictureInPictureInPicture\n onClick={props.onClick}\n strings={strings}\n primaryTile={primaryTileProps}\n secondaryTile={secondaryTileProps}\n />\n );\n};\n\nconst localVideoViewOptions: VideoStreamOptions = {\n scalingMode: 'Crop',\n isMirrored: true\n};\n\nconst remoteVideoViewOptions: VideoStreamOptions = {\n scalingMode: 'Crop',\n isMirrored: false\n};\n\"../../../../../react-components/src\""]}
1	+ {"version":3,"file":"LocalAndRemotePIP.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/components/LocalAndRemotePIP.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport React, { useMemo } from 'react';\nimport {\n CreateVideoStreamViewResult,\n VideoGalleryStream,\n VideoStreamOptions,\n _LocalVideoTile,\n _RemoteVideoTile,\n _PictureInPictureInPicture,\n _PictureInPictureInPictureTileProps\n} from '@internal/react-components';\n\nimport { useLocale } from '../../localization';\n\n/* @conditional-compile-remove(raise-hand) /\nimport { RaisedHand } from '@internal/react-components';\n\n/\n @private\n /\nexport interface LocalAndRemotePIPProps {\n localParticipant: {\n displayName?: string;\n videoStream?: VideoGalleryStream;\n / @conditional-compile-remove(raise-hand) / raisedHand?: RaisedHand;\n };\n dominantRemoteParticipant?: {\n userId: string;\n displayName?: string;\n videoStream?: VideoGalleryStream;\n };\n\n /* Callback to create the local video stream view /\n onCreateLocalStreamView?: (options?: VideoStreamOptions) => Promise<void \| CreateVideoStreamViewResult>;\n /* Callback to dispose of the local video stream view /\n onDisposeLocalStreamView?: () => void;\n /* Callback to create a remote video stream view /\n onCreateRemoteStreamView?: (\n userId: string,\n options?: VideoStreamOptions\n ) => Promise<void \| CreateVideoStreamViewResult>;\n /* Callback to dispose a remote video stream view /\n onDisposeRemoteStreamView?: (userId: string) => Promise<void>;\n onClick?: () => void;\n}\n\n/\n @private\n /\nexport const LocalAndRemotePIP = (props: LocalAndRemotePIPProps): JSX.Element => {\n const {\n localParticipant,\n dominantRemoteParticipant,\n onCreateLocalStreamView,\n onDisposeLocalStreamView,\n onCreateRemoteStreamView,\n onDisposeRemoteStreamView\n } = props;\n\n const localVideoTileProps = useMemo(\n () => ({\n onCreateLocalStreamView,\n onDisposeLocalStreamView,\n localVideoViewOptions,\n displayName: localParticipant.displayName,\n showLabel: false,\n showMuteIndicator: false,\n showCameraSwitcherInLocalPreview: false,\n isAvailable: localParticipant.videoStream?.isAvailable,\n renderElement: localParticipant.videoStream?.renderElement,\n / @conditional-compile-remove(raise-hand) /\n raisedHand: localParticipant.raisedHand\n }),\n [\n localParticipant.displayName,\n localParticipant.videoStream?.isAvailable,\n localParticipant.videoStream?.renderElement,\n onCreateLocalStreamView,\n onDisposeLocalStreamView,\n / @conditional-compile-remove(raise-hand) */\n localParticipant.raisedHand\n ]\n );\n\n const remoteVideoTileProps = useMemo(\n () =>\n !dominantRemoteParticipant\n ? undefined\n : {\n remoteParticipant: dominantRemoteParticipant,\n onCreateRemoteStreamView,\n onDisposeRemoteStreamView,\n remoteVideoViewOptions,\n displayName: dominantRemoteParticipant?.displayName,\n showLabel: false,\n showMuteIndicator: false,\n isAvailable: dominantRemoteParticipant.videoStream?.isAvailable,\n isReceiving: dominantRemoteParticipant.videoStream?.isReceiving,\n renderElement: dominantRemoteParticipant.videoStream?.renderElement,\n userId: dominantRemoteParticipant.userId,\n key: dominantRemoteParticipant.userId\n },\n [dominantRemoteParticipant, onCreateRemoteStreamView, onDisposeRemoteStreamView]\n );\n\n const locale = useLocale();\n const ariaLabel = locale.strings.callWithChat.pictureInPictureTileAriaLabel;\n const strings = useMemo(\n () => ({\n rootAriaLabel: ariaLabel\n }),\n [ariaLabel]\n );\n\n // If there are no remote participants, show the local participant as the primary tile\n const primaryTileProps: _PictureInPictureInPictureTileProps = useMemo(\n () => ({\n children: remoteVideoTileProps ? (\n <_RemoteVideoTile {...remoteVideoTileProps} />\n ) : (\n <_LocalVideoTile {...localVideoTileProps} />\n ),\n // TODO: when the calling SDK provides height/width stream information - update this to reflect the stream orientation.\n orientation: 'portrait'\n }),\n [localVideoTileProps, remoteVideoTileProps]\n );\n\n // If we are showing the local participant as the primary tile, show nothing for the secondary tile\n const secondaryTileProps: _PictureInPictureInPictureTileProps \| undefined = useMemo(\n () =>\n remoteVideoTileProps\n ? {\n children: <_LocalVideoTile {...localVideoTileProps} personaMinSize={20} />,\n // TODO: when the calling SDK provides height/width stream information - update this to reflect the stream orientation.\n orientation: 'portrait'\n }\n : undefined,\n [localVideoTileProps, remoteVideoTileProps]\n );\n\n return (\n <_PictureInPictureInPicture\n onClick={props.onClick}\n strings={strings}\n primaryTile={primaryTileProps}\n secondaryTile={secondaryTileProps}\n />\n );\n};\n\nconst localVideoViewOptions: VideoStreamOptions = {\n scalingMode: 'Crop',\n isMirrored: true\n};\n\nconst remoteVideoViewOptions: VideoStreamOptions = {\n scalingMode: 'Crop',\n isMirrored: false\n};\n\"../../../../../react-components/src\""]}

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/MediaGallery.d.ts CHANGED Viewed

@@ -1,4 +1,5 @@
 import { OnRenderAvatarCallback } from "../../../../../react-components/src";
+import { VideoGalleryLayout } from "../../../../../react-components/src";
 import { AvatarPersonaDataCallback } from '../../common/AvatarPersona';
 import { RemoteVideoTileMenuOptions } from '../CallComposite';
 import { LocalVideoTileOptions } from '../CallComposite';
@@ -16,6 +17,7 @@ export interface MediaGalleryProps {
     remoteVideoTileMenuOptions?: RemoteVideoTileMenuOptions;
     localVideoTileOptions?: boolean | LocalVideoTileOptions;
     userSetOverflowGalleryPosition?: 'Responsive' | 'HorizontalTop';
+    userSetGalleryLayout: VideoGalleryLayout;
 }
 /**
  * @private

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

@@ -73,20 +73,28 @@ export const MediaGallery = (props) => {
                 ? { kind: 'drawer', hostId: props.drawerMenuHostId }
                 : { kind: 'contextual' };
     }, [(_c = props.remoteVideoTileMenuOptions) === null || _c === void 0 ? void 0 : _c.isHidden, props.isMobile, props.drawerMenuHostId]);
-    /* @conditional-compile-remove(vertical-gallery) */ /* @conditional-compile-remove(gallery-layouts) */
+    /* @conditional-compile-remove(vertical-gallery) */
     const overflowGalleryPosition = useMemo(() => {
-        if (props.userSetOverflowGalleryPosition === 'Responsive') {
-            return containerWidth && containerHeight && containerWidth / containerHeight >= 16 / 9
-                ? 'VerticalRight'
-                : 'HorizontalBottom';
-        }
-        else {
+        /* @conditional-compile-remove(gallery-layouts) */
+        if (props.userSetOverflowGalleryPosition === 'HorizontalTop') {
             return props.userSetOverflowGalleryPosition;
         }
-    }, [props.userSetOverflowGalleryPosition, containerWidth, containerHeight]);
+        return containerWidth && containerHeight && containerWidth / containerHeight >= 16 / 9
+            ? 'VerticalRight'
+            : 'HorizontalBottom';
+    }, [
+        /* @conditional-compile-remove(gallery-layouts) */ props.userSetOverflowGalleryPosition,
+        containerWidth,
+        containerHeight
+    ]);
     const VideoGalleryMemoized = useMemo(() => {
         var _a;
-        return (React.createElement(VideoGallery, Object.assign({}, videoGalleryProps, { localVideoViewOptions: localVideoViewOptions, remoteVideoViewOptions: remoteVideoViewOptions, styles: VideoGalleryStyles, layout: layoutBasedOnTilePosition, showCameraSwitcherInLocalPreview: props.isMobile, localVideoCameraCycleButtonProps: cameraSwitcherProps, onRenderAvatar: (_a = props.onRenderAvatar) !== null && _a !== void 0 ? _a : onRenderAvatar,
+        const layoutBasedOnUserSelection = () => {
+            /* @conditional-compile-remove(gallery-layouts) */
+            return props.localVideoTileOptions ? layoutBasedOnTilePosition : props.userSetGalleryLayout;
+            return layoutBasedOnTilePosition;
+        };
+        return (React.createElement(VideoGallery, Object.assign({}, videoGalleryProps, { localVideoViewOptions: localVideoViewOptions, remoteVideoViewOptions: remoteVideoViewOptions, styles: VideoGalleryStyles, layout: layoutBasedOnUserSelection(), showCameraSwitcherInLocalPreview: props.isMobile, localVideoCameraCycleButtonProps: cameraSwitcherProps, onRenderAvatar: (_a = props.onRenderAvatar) !== null && _a !== void 0 ? _a : onRenderAvatar,
             /* @conditional-compile-remove(pinned-participants) */
             remoteVideoTileMenuOptions: remoteVideoTileMenuOptions,
             /* @conditional-compile-remove(vertical-gallery) */
@@ -99,7 +107,6 @@ export const MediaGallery = (props) => {
                     : '16:9' })));
     }, [
         videoGalleryProps,
-        layoutBasedOnTilePosition,
         props.isMobile,
         props.onRenderAvatar,
         /* @conditional-compile-remove(rooms) */
@@ -115,7 +122,10 @@ export const MediaGallery = (props) => {
         /* @conditional-compile-remove(rooms) */
         isRoomsCall,
         /* @conditional-compile-remove(vertical-gallery) */
-        containerAspectRatio
+        containerAspectRatio,
+        /* @conditional-compile-remove(gallery-layouts) */
+        props.userSetGalleryLayout,
+        layoutBasedOnTilePosition
     ]);
     return (React.createElement("div", { ref: containerRef, style: mediaGalleryContainerStyles },
         React.createElement(Announcer, { announcementString: announcerString, ariaLive: 'polite' }),

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

	@@ -1 +1 @@
1	- {"version":3,"file":"MediaGallery.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/components/MediaGallery.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport React, { CSSProperties, useCallback, useEffect, useMemo, useState } from 'react';\n/* @conditional-compile-remove(vertical-gallery) / / @conditional-compile-remove(rooms) /\nimport { useRef } from 'react';\nimport {\n VideoGallery,\n VideoStreamOptions,\n OnRenderAvatarCallback,\n CustomAvatarOptions,\n Announcer,\n VideoGalleryLayout\n} from '@internal/react-components';\n/ @conditional-compile-remove(vertical-gallery) / / @conditional-compile-remove(rooms) /\nimport { _useContainerWidth, _useContainerHeight } from '@internal/react-components';\n/ @conditional-compile-remove(pinned-participants) /\nimport { VideoTileContextualMenuProps, VideoTileDrawerMenuProps } from '@internal/react-components';\nimport { usePropsFor } from '../hooks/usePropsFor';\nimport { AvatarPersona, AvatarPersonaDataCallback } from '../../common/AvatarPersona';\nimport { mergeStyles, Stack } from '@fluentui/react';\nimport { getIsPreviewCameraOn } from '../selectors/baseSelectors';\nimport { useHandlers } from '../hooks/useHandlers';\nimport { useSelector } from '../hooks/useSelector';\nimport { localVideoCameraCycleButtonSelector } from '../selectors/LocalVideoTileSelector';\nimport { LocalVideoCameraCycleButton } from '@internal/react-components';\nimport { _formatString } from '@internal/acs-ui-common';\nimport { useParticipantChangedAnnouncement } from '../utils/MediaGalleryUtils';\n/ @conditional-compile-remove(pinned-participants) /\nimport { RemoteVideoTileMenuOptions } from '../CallComposite';\n/ @conditional-compile-remove(click-to-call) / / @conditional-compile-remove(rooms) /\nimport { LocalVideoTileOptions } from '../CallComposite';\n/ @conditional-compile-remove(rooms) /\nimport { useAdapter } from '../adapter/CallAdapterProvider';\n\nconst VideoGalleryStyles = {\n root: {\n height: '100%',\n minHeight: '10rem', // space affordance to ensure media gallery is never collapsed\n minWidth: '6rem'\n }\n};\n\nconst localVideoViewOptions = {\n scalingMode: 'Crop',\n isMirrored: true\n} as VideoStreamOptions;\n\nconst remoteVideoViewOptions = {\n scalingMode: 'Crop'\n} as VideoStreamOptions;\n\n/\n @private\n /\nexport interface MediaGalleryProps {\n isVideoStreamOn?: boolean;\n isMicrophoneChecked?: boolean;\n onStartLocalVideo: () => Promise<void>;\n onRenderAvatar?: OnRenderAvatarCallback;\n onFetchAvatarPersonaData?: AvatarPersonaDataCallback;\n isMobile?: boolean;\n drawerMenuHostId?: string;\n / @conditional-compile-remove(pinned-participants) /\n remoteVideoTileMenuOptions?: RemoteVideoTileMenuOptions;\n / @conditional-compile-remove(click-to-call) / / @conditional-compile-remove(rooms) /\n localVideoTileOptions?: boolean \| LocalVideoTileOptions;\n / @conditional-compile-remove(gallery-layouts) /\n userSetOverflowGalleryPosition?: 'Responsive' \| 'HorizontalTop';\n}\n\n/\n @private\n /\nexport const MediaGallery = (props: MediaGalleryProps): JSX.Element => {\n const videoGalleryProps = usePropsFor(VideoGallery);\n const cameraSwitcherCameras = useSelector(localVideoCameraCycleButtonSelector);\n const cameraSwitcherCallback = useHandlers(LocalVideoCameraCycleButton);\n const announcerString = useParticipantChangedAnnouncement();\n\n / @conditional-compile-remove(rooms) /\n const adapter = useAdapter();\n / @conditional-compile-remove(rooms) /\n const userRole = adapter.getState().call?.role;\n / @conditional-compile-remove(rooms) /\n const isRoomsCall = adapter.getState().isRoomsCall;\n\n / @conditional-compile-remove(vertical-gallery) / / @conditional-compile-remove(rooms) /\n const containerRef = useRef<HTMLDivElement>(null);\n / @conditional-compile-remove(vertical-gallery) / / @conditional-compile-remove(rooms) /\n const containerWidth = _useContainerWidth(containerRef);\n / @conditional-compile-remove(vertical-gallery) / / @conditional-compile-remove(rooms) /\n const containerHeight = _useContainerHeight(containerRef);\n / @conditional-compile-remove(click-to-call) / / @conditional-compile-remove(rooms) /\n const containerAspectRatio = containerWidth && containerHeight ? containerWidth / containerHeight : 0;\n\n const layoutBasedOnTilePosition: VideoGalleryLayout = localVideoTileLayoutTrampoline(\n / @conditional-compile-remove(click-to-call) / (props.localVideoTileOptions as LocalVideoTileOptions)?.position\n );\n\n const cameraSwitcherProps = useMemo(() => {\n return {\n ...cameraSwitcherCallback,\n ...cameraSwitcherCameras\n };\n }, [cameraSwitcherCallback, cameraSwitcherCameras]);\n\n const onRenderAvatar = useCallback(\n (userId?: string, options?: CustomAvatarOptions) => {\n return (\n <Stack className={mergeStyles({ position: 'absolute', height: '100%', width: '100%' })}>\n <Stack styles={{ root: { margin: 'auto', maxHeight: '100%' } }}>\n {options?.coinSize && (\n <AvatarPersona userId={userId} {...options} dataProvider={props.onFetchAvatarPersonaData} />\n )}\n </Stack>\n </Stack>\n );\n },\n [props.onFetchAvatarPersonaData]\n );\n\n useLocalVideoStartTrigger(!!props.isVideoStreamOn);\n\n / @conditional-compile-remove(pinned-participants) /\n const remoteVideoTileMenuOptions: false \| VideoTileContextualMenuProps \| VideoTileDrawerMenuProps = useMemo(() => {\n return props.remoteVideoTileMenuOptions?.isHidden\n ? false\n : props.isMobile\n ? { kind: 'drawer', hostId: props.drawerMenuHostId }\n : { kind: 'contextual' };\n }, [props.remoteVideoTileMenuOptions?.isHidden, props.isMobile, props.drawerMenuHostId]);\n\n / @conditional-compile-remove(vertical-gallery) / / @conditional-compile-remove(gallery-layouts) /\n const overflowGalleryPosition = useMemo(() => {\n if (props.userSetOverflowGalleryPosition === 'Responsive') {\n return containerWidth && containerHeight && containerWidth / containerHeight >= 16 / 9\n ? 'VerticalRight'\n : 'HorizontalBottom';\n } else {\n return props.userSetOverflowGalleryPosition;\n }\n }, [props.userSetOverflowGalleryPosition, containerWidth, containerHeight]);\n\n const VideoGalleryMemoized = useMemo(() => {\n return (\n <VideoGallery\n {...videoGalleryProps}\n localVideoViewOptions={localVideoViewOptions}\n remoteVideoViewOptions={remoteVideoViewOptions}\n styles={VideoGalleryStyles}\n layout={layoutBasedOnTilePosition}\n showCameraSwitcherInLocalPreview={props.isMobile}\n localVideoCameraCycleButtonProps={cameraSwitcherProps}\n onRenderAvatar={props.onRenderAvatar ?? onRenderAvatar}\n / @conditional-compile-remove(pinned-participants) /\n remoteVideoTileMenuOptions={remoteVideoTileMenuOptions}\n / @conditional-compile-remove(vertical-gallery) /\n overflowGalleryPosition={overflowGalleryPosition}\n / @conditional-compile-remove(rooms) /\n localVideoTileSize={\n props.localVideoTileOptions === false \|\| userRole === 'Consumer' \|\| (isRoomsCall && userRole === 'Unknown')\n ? 'hidden'\n : props.isMobile && containerAspectRatio < 1\n ? '9:16'\n : '16:9'\n }\n />\n );\n }, [\n videoGalleryProps,\n layoutBasedOnTilePosition,\n props.isMobile,\n props.onRenderAvatar,\n / @conditional-compile-remove(rooms) /\n props.localVideoTileOptions,\n cameraSwitcherProps,\n onRenderAvatar,\n / @conditional-compile-remove(pinned-participants) /\n remoteVideoTileMenuOptions,\n / @conditional-compile-remove(vertical-gallery) /\n overflowGalleryPosition,\n / @conditional-compile-remove(rooms) /\n userRole,\n / @conditional-compile-remove(rooms) /\n isRoomsCall,\n / @conditional-compile-remove(vertical-gallery) /\n containerAspectRatio\n ]);\n\n return (\n <div / @conditional-compile-remove(vertical-gallery) / ref={containerRef} style={mediaGalleryContainerStyles}>\n <Announcer announcementString={announcerString} ariaLive={'polite'} />\n {VideoGalleryMemoized}\n </div>\n );\n};\n\n/\n @private\n \n `shouldTransition` is an extra predicate that controls whether this hooks actually transitions the call.\n * The rule of hooks disallows calling the hook conditionally, so this predicate can be used to make the decision.\n /\nexport const useLocalVideoStartTrigger = (isLocalVideoAvailable: boolean, shouldTransition?: boolean): void => {\n // Once a call is joined, we need to transition the local preview camera setting into the call.\n // This logic is needed on any screen that we might join a call from:\n // - The Media gallery\n // - The lobby page\n // - The networkReconnect interstitial that may show at the start of a call.\n //\n // @TODO: Can we simply have the callHandlers handle this transition logic.\n const [isButtonStatusSynced, setIsButtonStatusSynced] = useState(false);\n const isPreviewCameraOn = useSelector(getIsPreviewCameraOn);\n const mediaGalleryHandlers = useHandlers(MediaGallery);\n useEffect(() => {\n if (shouldTransition !== false) {\n if (isPreviewCameraOn && !isLocalVideoAvailable && !isButtonStatusSynced) {\n mediaGalleryHandlers.onStartLocalVideo();\n }\n setIsButtonStatusSynced(true);\n }\n }, [shouldTransition, isButtonStatusSynced, isPreviewCameraOn, isLocalVideoAvailable, mediaGalleryHandlers]);\n};\n\nconst mediaGalleryContainerStyles: CSSProperties = { width: '100%', height: '100%' };\n\nconst localVideoTileLayoutTrampoline = (\n / @conditional-compile-remove(click-to-call) / localTileOptions?: string\n): VideoGalleryLayout => {\n / @conditional-compile-remove(click-to-call) */\n return localTileOptions === 'grid' ? 'default' : 'floatingLocalVideo';\n return 'floatingLocalVideo';\n};\n\"../../../../../react-components/src\"\"../../../../../acs-ui-common/src\""]}
1	+ {"version":3,"file":"MediaGallery.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/components/MediaGallery.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAiB,WAAW,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxF,mDAAmD,CAAC,wCAAwC;AAC5F,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC/B,OAAO,EACL,YAAY,EAIZ,SAAS,EACV,4CAAmC;AAEpC,mDAAmD,CAAC,wCAAwC;AAC5F,OAAO,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,4CAAmC;AAGrF,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAE,aAAa,EAA6B,MAAM,4BAA4B,CAAC;AACtF,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AACrD,OAAO,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAClE,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAE,mCAAmC,EAAE,MAAM,qCAAqC,CAAC;AAC1F,OAAO,EAAE,2BAA2B,EAAE,4CAAmC;AAEzE,OAAO,EAAE,iCAAiC,EAAE,MAAM,4BAA4B,CAAC;AAK/E,wCAAwC;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAE5D,MAAM,kBAAkB,GAAG;IACzB,IAAI,EAAE;QACJ,MAAM,EAAE,MAAM;QACd,SAAS,EAAE,OAAO;QAClB,QAAQ,EAAE,MAAM;KACjB;CACF,CAAC;AAEF,MAAM,qBAAqB,GAAG;IAC5B,WAAW,EAAE,MAAM;IACnB,UAAU,EAAE,IAAI;CACK,CAAC;AAExB,MAAM,sBAAsB,GAAG;IAC7B,WAAW,EAAE,MAAM;CACE,CAAC;AAuBxB;;GAEG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,KAAwB,EAAe,EAAE;;IACpE,MAAM,iBAAiB,GAAG,WAAW,CAAC,YAAY,CAAC,CAAC;IACpD,MAAM,qBAAqB,GAAG,WAAW,CAAC,mCAAmC,CAAC,CAAC;IAC/E,MAAM,sBAAsB,GAAG,WAAW,CAAC,2BAA2B,CAAC,CAAC;IACxE,MAAM,eAAe,GAAG,iCAAiC,EAAE,CAAC;IAE5D,wCAAwC;IACxC,MAAM,OAAO,GAAG,UAAU,EAAE,CAAC;IAC7B,wCAAwC;IACxC,MAAM,QAAQ,GAAG,MAAA,OAAO,CAAC,QAAQ,EAAE,CAAC,IAAI,0CAAE,IAAI,CAAC;IAC/C,wCAAwC;IACxC,MAAM,WAAW,GAAG,OAAO,CAAC,QAAQ,EAAE,CAAC,WAAW,CAAC;IAEnD,mDAAmD,CAAC,wCAAwC;IAC5F,MAAM,YAAY,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAClD,mDAAmD,CAAC,wCAAwC;IAC5F,MAAM,cAAc,GAAG,kBAAkB,CAAC,YAAY,CAAC,CAAC;IACxD,mDAAmD,CAAC,wCAAwC;IAC5F,MAAM,eAAe,GAAG,mBAAmB,CAAC,YAAY,CAAC,CAAC;IAC1D,gDAAgD,CAAC,wCAAwC;IACzF,MAAM,oBAAoB,GAAG,cAAc,IAAI,eAAe,CAAC,CAAC,CAAC,cAAc,GAAG,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC;IAEtG,MAAM,yBAAyB,GAAuB,8BAA8B;IAClF,gDAAgD,CAAC,MAAC,KAAK,CAAC,qBAA+C,0CAAE,QAAQ,CAClH,CAAC;IAEF,MAAM,mBAAmB,GAAG,OAAO,CAAC,GAAG,EAAE;QACvC,uCACK,sBAAsB,GACtB,qBAAqB,EACxB;IACJ,CAAC,EAAE,CAAC,sBAAsB,EAAE,qBAAqB,CAAC,CAAC,CAAC;IAEpD,MAAM,cAAc,GAAG,WAAW,CAChC,CAAC,MAAe,EAAE,OAA6B,EAAE,EAAE;QACjD,OAAO,CACL,oBAAC,KAAK,IAAC,SAAS,EAAE,WAAW,CAAC,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC;YACpF,oBAAC,KAAK,IAAC,MAAM,EAAE,EAAE,IAAI,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,EAAE,IAC3D,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,QAAQ,KAAI,CACpB,oBAAC,aAAa,kBAAC,MAAM,EAAE,MAAM,IAAM,OAAO,IAAE,YAAY,EAAE,KAAK,CAAC,wBAAwB,IAAI,CAC7F,CACK,CACF,CACT,CAAC;IACJ,CAAC,EACD,CAAC,KAAK,CAAC,wBAAwB,CAAC,CACjC,CAAC;IAEF,yBAAyB,CAAC,CAAC,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC;IAEnD,sDAAsD;IACtD,MAAM,0BAA0B,GAAoE,OAAO,CAAC,GAAG,EAAE;;QAC/G,OAAO,CAAA,MAAA,KAAK,CAAC,0BAA0B,0CAAE,QAAQ;YAC/C,CAAC,CAAC,KAAK;YACP,CAAC,CAAC,KAAK,CAAC,QAAQ;gBAChB,CAAC,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,CAAC,gBAAgB,EAAE;gBACpD,CAAC,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,CAAC;IAC7B,CAAC,EAAE,CAAC,MAAA,KAAK,CAAC,0BAA0B,0CAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAEzF,mDAAmD;IACnD,MAAM,uBAAuB,GAAG,OAAO,CAAC,GAAG,EAAE;QAC3C,kDAAkD;QAClD,IAAI,KAAK,CAAC,8BAA8B,KAAK,eAAe,EAAE;YAC5D,OAAO,KAAK,CAAC,8BAA8B,CAAC;SAC7C;QACD,OAAO,cAAc,IAAI,eAAe,IAAI,cAAc,GAAG,eAAe,IAAI,EAAE,GAAG,CAAC;YACpF,CAAC,CAAC,eAAe;YACjB,CAAC,CAAC,kBAAkB,CAAC;IACzB,CAAC,EAAE;QACD,kDAAkD,CAAC,KAAK,CAAC,8BAA8B;QACvF,cAAc;QACd,eAAe;KAChB,CAAC,CAAC;IAEH,MAAM,oBAAoB,GAAG,OAAO,CAAC,GAAG,EAAE;;QACxC,MAAM,0BAA0B,GAAG,GAAuB,EAAE;YAC1D,kDAAkD;YAClD,OAAO,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,yBAAyB,CAAC,CAAC,CAAC,KAAK,CAAC,oBAAoB,CAAC;YAC5F,OAAO,yBAAyB,CAAC;QACnC,CAAC,CAAC;QAEF,OAAO,CACL,oBAAC,YAAY,oBACP,iBAAiB,IACrB,qBAAqB,EAAE,qBAAqB,EAC5C,sBAAsB,EAAE,sBAAsB,EAC9C,MAAM,EAAE,kBAAkB,EAC1B,MAAM,EAAE,0BAA0B,EAAE,EACpC,gCAAgC,EAAE,KAAK,CAAC,QAAQ,EAChD,gCAAgC,EAAE,mBAAmB,EACrD,cAAc,EAAE,MAAA,KAAK,CAAC,cAAc,mCAAI,cAAc;YACtD,sDAAsD;YACtD,0BAA0B,EAAE,0BAA0B;YACtD,mDAAmD;YACnD,uBAAuB,EAAE,uBAAuB;YAChD,wCAAwC;YACxC,kBAAkB,EAChB,KAAK,CAAC,qBAAqB,KAAK,KAAK,IAAI,QAAQ,KAAK,UAAU,IAAI,CAAC,WAAW,IAAI,QAAQ,KAAK,SAAS,CAAC;gBACzG,CAAC,CAAC,QAAQ;gBACV,CAAC,CAAC,KAAK,CAAC,QAAQ,IAAI,oBAAoB,GAAG,CAAC;oBAC5C,CAAC,CAAC,MAAM;oBACR,CAAC,CAAC,MAAM,IAEZ,CACH,CAAC;IACJ,CAAC,EAAE;QACD,iBAAiB;QACjB,KAAK,CAAC,QAAQ;QACd,KAAK,CAAC,cAAc;QACpB,wCAAwC;QACxC,KAAK,CAAC,qBAAqB;QAC3B,mBAAmB;QACnB,cAAc;QACd,sDAAsD;QACtD,0BAA0B;QAC1B,mDAAmD;QACnD,uBAAuB;QACvB,wCAAwC;QACxC,QAAQ;QACR,wCAAwC;QACxC,WAAW;QACX,mDAAmD;QACnD,oBAAoB;QACpB,kDAAkD;QAClD,KAAK,CAAC,oBAAoB;QAC1B,yBAAyB;KAC1B,CAAC,CAAC;IAEH,OAAO,CACL,6BAAyD,GAAG,EAAE,YAAY,EAAE,KAAK,EAAE,2BAA2B;QAC5G,oBAAC,SAAS,IAAC,kBAAkB,EAAE,eAAe,EAAE,QAAQ,EAAE,QAAQ,GAAI;QACrE,oBAAoB,CACjB,CACP,CAAC;AACJ,CAAC,CAAC;AAEF;;;;;GAKG;AACH,MAAM,CAAC,MAAM,yBAAyB,GAAG,CAAC,qBAA8B,EAAE,gBAA0B,EAAQ,EAAE;IAC5G,+FAA+F;IAC/F,qEAAqE;IACrE,sBAAsB;IACtB,mBAAmB;IACnB,4EAA4E;IAC5E,EAAE;IACF,2EAA2E;IAC3E,MAAM,CAAC,oBAAoB,EAAE,uBAAuB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACxE,MAAM,iBAAiB,GAAG,WAAW,CAAC,oBAAoB,CAAC,CAAC;IAC5D,MAAM,oBAAoB,GAAG,WAAW,CAAC,YAAY,CAAC,CAAC;IACvD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,gBAAgB,KAAK,KAAK,EAAE;YAC9B,IAAI,iBAAiB,IAAI,CAAC,qBAAqB,IAAI,CAAC,oBAAoB,EAAE;gBACxE,oBAAoB,CAAC,iBAAiB,EAAE,CAAC;aAC1C;YACD,uBAAuB,CAAC,IAAI,CAAC,CAAC;SAC/B;IACH,CAAC,EAAE,CAAC,gBAAgB,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,qBAAqB,EAAE,oBAAoB,CAAC,CAAC,CAAC;AAC/G,CAAC,CAAC;AAEF,MAAM,2BAA2B,GAAkB,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC;AAErF,MAAM,8BAA8B,GAAG;AACrC,gDAAgD,CAAC,gBAAyB,EACtD,EAAE;IACtB,gDAAgD;IAChD,OAAO,gBAAgB,KAAK,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,oBAAoB,CAAC;IACtE,OAAO,oBAAoB,CAAC;AAC9B,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport React, { CSSProperties, useCallback, useEffect, useMemo, useState } from 'react';\n/* @conditional-compile-remove(vertical-gallery) / / @conditional-compile-remove(rooms) /\nimport { useRef } from 'react';\nimport {\n VideoGallery,\n VideoStreamOptions,\n OnRenderAvatarCallback,\n CustomAvatarOptions,\n Announcer\n} from '@internal/react-components';\nimport { VideoGalleryLayout } from '@internal/react-components';\n/ @conditional-compile-remove(vertical-gallery) / / @conditional-compile-remove(rooms) /\nimport { _useContainerWidth, _useContainerHeight } from '@internal/react-components';\n/ @conditional-compile-remove(pinned-participants) /\nimport { VideoTileContextualMenuProps, VideoTileDrawerMenuProps } from '@internal/react-components';\nimport { usePropsFor } from '../hooks/usePropsFor';\nimport { AvatarPersona, AvatarPersonaDataCallback } from '../../common/AvatarPersona';\nimport { mergeStyles, Stack } from '@fluentui/react';\nimport { getIsPreviewCameraOn } from '../selectors/baseSelectors';\nimport { useHandlers } from '../hooks/useHandlers';\nimport { useSelector } from '../hooks/useSelector';\nimport { localVideoCameraCycleButtonSelector } from '../selectors/LocalVideoTileSelector';\nimport { LocalVideoCameraCycleButton } from '@internal/react-components';\nimport { _formatString } from '@internal/acs-ui-common';\nimport { useParticipantChangedAnnouncement } from '../utils/MediaGalleryUtils';\n/ @conditional-compile-remove(pinned-participants) /\nimport { RemoteVideoTileMenuOptions } from '../CallComposite';\n/ @conditional-compile-remove(click-to-call) / / @conditional-compile-remove(rooms) /\nimport { LocalVideoTileOptions } from '../CallComposite';\n/ @conditional-compile-remove(rooms) /\nimport { useAdapter } from '../adapter/CallAdapterProvider';\n\nconst VideoGalleryStyles = {\n root: {\n height: '100%',\n minHeight: '10rem', // space affordance to ensure media gallery is never collapsed\n minWidth: '6rem'\n }\n};\n\nconst localVideoViewOptions = {\n scalingMode: 'Crop',\n isMirrored: true\n} as VideoStreamOptions;\n\nconst remoteVideoViewOptions = {\n scalingMode: 'Crop'\n} as VideoStreamOptions;\n\n/\n @private\n /\nexport interface MediaGalleryProps {\n isVideoStreamOn?: boolean;\n isMicrophoneChecked?: boolean;\n onStartLocalVideo: () => Promise<void>;\n onRenderAvatar?: OnRenderAvatarCallback;\n onFetchAvatarPersonaData?: AvatarPersonaDataCallback;\n isMobile?: boolean;\n drawerMenuHostId?: string;\n / @conditional-compile-remove(pinned-participants) /\n remoteVideoTileMenuOptions?: RemoteVideoTileMenuOptions;\n / @conditional-compile-remove(click-to-call) / / @conditional-compile-remove(rooms) /\n localVideoTileOptions?: boolean \| LocalVideoTileOptions;\n / @conditional-compile-remove(gallery-layouts) /\n userSetOverflowGalleryPosition?: 'Responsive' \| 'HorizontalTop';\n / @conditional-compile-remove(gallery-layouts) /\n userSetGalleryLayout: VideoGalleryLayout;\n}\n\n/\n @private\n /\nexport const MediaGallery = (props: MediaGalleryProps): JSX.Element => {\n const videoGalleryProps = usePropsFor(VideoGallery);\n const cameraSwitcherCameras = useSelector(localVideoCameraCycleButtonSelector);\n const cameraSwitcherCallback = useHandlers(LocalVideoCameraCycleButton);\n const announcerString = useParticipantChangedAnnouncement();\n\n / @conditional-compile-remove(rooms) /\n const adapter = useAdapter();\n / @conditional-compile-remove(rooms) /\n const userRole = adapter.getState().call?.role;\n / @conditional-compile-remove(rooms) /\n const isRoomsCall = adapter.getState().isRoomsCall;\n\n / @conditional-compile-remove(vertical-gallery) / / @conditional-compile-remove(rooms) /\n const containerRef = useRef<HTMLDivElement>(null);\n / @conditional-compile-remove(vertical-gallery) / / @conditional-compile-remove(rooms) /\n const containerWidth = _useContainerWidth(containerRef);\n / @conditional-compile-remove(vertical-gallery) / / @conditional-compile-remove(rooms) /\n const containerHeight = _useContainerHeight(containerRef);\n / @conditional-compile-remove(click-to-call) / / @conditional-compile-remove(rooms) /\n const containerAspectRatio = containerWidth && containerHeight ? containerWidth / containerHeight : 0;\n\n const layoutBasedOnTilePosition: VideoGalleryLayout = localVideoTileLayoutTrampoline(\n / @conditional-compile-remove(click-to-call) / (props.localVideoTileOptions as LocalVideoTileOptions)?.position\n );\n\n const cameraSwitcherProps = useMemo(() => {\n return {\n ...cameraSwitcherCallback,\n ...cameraSwitcherCameras\n };\n }, [cameraSwitcherCallback, cameraSwitcherCameras]);\n\n const onRenderAvatar = useCallback(\n (userId?: string, options?: CustomAvatarOptions) => {\n return (\n <Stack className={mergeStyles({ position: 'absolute', height: '100%', width: '100%' })}>\n <Stack styles={{ root: { margin: 'auto', maxHeight: '100%' } }}>\n {options?.coinSize && (\n <AvatarPersona userId={userId} {...options} dataProvider={props.onFetchAvatarPersonaData} />\n )}\n </Stack>\n </Stack>\n );\n },\n [props.onFetchAvatarPersonaData]\n );\n\n useLocalVideoStartTrigger(!!props.isVideoStreamOn);\n\n / @conditional-compile-remove(pinned-participants) /\n const remoteVideoTileMenuOptions: false \| VideoTileContextualMenuProps \| VideoTileDrawerMenuProps = useMemo(() => {\n return props.remoteVideoTileMenuOptions?.isHidden\n ? false\n : props.isMobile\n ? { kind: 'drawer', hostId: props.drawerMenuHostId }\n : { kind: 'contextual' };\n }, [props.remoteVideoTileMenuOptions?.isHidden, props.isMobile, props.drawerMenuHostId]);\n\n / @conditional-compile-remove(vertical-gallery) /\n const overflowGalleryPosition = useMemo(() => {\n / @conditional-compile-remove(gallery-layouts) /\n if (props.userSetOverflowGalleryPosition === 'HorizontalTop') {\n return props.userSetOverflowGalleryPosition;\n }\n return containerWidth && containerHeight && containerWidth / containerHeight >= 16 / 9\n ? 'VerticalRight'\n : 'HorizontalBottom';\n }, [\n / @conditional-compile-remove(gallery-layouts) / props.userSetOverflowGalleryPosition,\n containerWidth,\n containerHeight\n ]);\n\n const VideoGalleryMemoized = useMemo(() => {\n const layoutBasedOnUserSelection = (): VideoGalleryLayout => {\n / @conditional-compile-remove(gallery-layouts) /\n return props.localVideoTileOptions ? layoutBasedOnTilePosition : props.userSetGalleryLayout;\n return layoutBasedOnTilePosition;\n };\n\n return (\n <VideoGallery\n {...videoGalleryProps}\n localVideoViewOptions={localVideoViewOptions}\n remoteVideoViewOptions={remoteVideoViewOptions}\n styles={VideoGalleryStyles}\n layout={layoutBasedOnUserSelection()}\n showCameraSwitcherInLocalPreview={props.isMobile}\n localVideoCameraCycleButtonProps={cameraSwitcherProps}\n onRenderAvatar={props.onRenderAvatar ?? onRenderAvatar}\n / @conditional-compile-remove(pinned-participants) /\n remoteVideoTileMenuOptions={remoteVideoTileMenuOptions}\n / @conditional-compile-remove(vertical-gallery) /\n overflowGalleryPosition={overflowGalleryPosition}\n / @conditional-compile-remove(rooms) /\n localVideoTileSize={\n props.localVideoTileOptions === false \|\| userRole === 'Consumer' \|\| (isRoomsCall && userRole === 'Unknown')\n ? 'hidden'\n : props.isMobile && containerAspectRatio < 1\n ? '9:16'\n : '16:9'\n }\n />\n );\n }, [\n videoGalleryProps,\n props.isMobile,\n props.onRenderAvatar,\n / @conditional-compile-remove(rooms) /\n props.localVideoTileOptions,\n cameraSwitcherProps,\n onRenderAvatar,\n / @conditional-compile-remove(pinned-participants) /\n remoteVideoTileMenuOptions,\n / @conditional-compile-remove(vertical-gallery) /\n overflowGalleryPosition,\n / @conditional-compile-remove(rooms) /\n userRole,\n / @conditional-compile-remove(rooms) /\n isRoomsCall,\n / @conditional-compile-remove(vertical-gallery) /\n containerAspectRatio,\n / @conditional-compile-remove(gallery-layouts) /\n props.userSetGalleryLayout,\n layoutBasedOnTilePosition\n ]);\n\n return (\n <div / @conditional-compile-remove(vertical-gallery) / ref={containerRef} style={mediaGalleryContainerStyles}>\n <Announcer announcementString={announcerString} ariaLive={'polite'} />\n {VideoGalleryMemoized}\n </div>\n );\n};\n\n/\n @private\n \n `shouldTransition` is an extra predicate that controls whether this hooks actually transitions the call.\n * The rule of hooks disallows calling the hook conditionally, so this predicate can be used to make the decision.\n /\nexport const useLocalVideoStartTrigger = (isLocalVideoAvailable: boolean, shouldTransition?: boolean): void => {\n // Once a call is joined, we need to transition the local preview camera setting into the call.\n // This logic is needed on any screen that we might join a call from:\n // - The Media gallery\n // - The lobby page\n // - The networkReconnect interstitial that may show at the start of a call.\n //\n // @TODO: Can we simply have the callHandlers handle this transition logic.\n const [isButtonStatusSynced, setIsButtonStatusSynced] = useState(false);\n const isPreviewCameraOn = useSelector(getIsPreviewCameraOn);\n const mediaGalleryHandlers = useHandlers(MediaGallery);\n useEffect(() => {\n if (shouldTransition !== false) {\n if (isPreviewCameraOn && !isLocalVideoAvailable && !isButtonStatusSynced) {\n mediaGalleryHandlers.onStartLocalVideo();\n }\n setIsButtonStatusSynced(true);\n }\n }, [shouldTransition, isButtonStatusSynced, isPreviewCameraOn, isLocalVideoAvailable, mediaGalleryHandlers]);\n};\n\nconst mediaGalleryContainerStyles: CSSProperties = { width: '100%', height: '100%' };\n\nconst localVideoTileLayoutTrampoline = (\n / @conditional-compile-remove(click-to-call) / localTileOptions?: string\n): VideoGalleryLayout => {\n / @conditional-compile-remove(click-to-call) */\n return localTileOptions === 'grid' ? 'default' : 'floatingLocalVideo';\n return 'floatingLocalVideo';\n};\n\"../../../../../react-components/src\"\"../../../../../acs-ui-common/src\""]}

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

@@ -0,0 +1,12 @@
+import { ControlBarButtonStyles } from "../../../../../../react-components/src";
+import { CallControlDisplayType } from '../../../common/types/CommonCallControlOptions';
+/** @private */
+export declare const RaiseHand: (props: {
+    option?: boolean | {
+        disabled: boolean;
+    };
+    displayType?: CallControlDisplayType;
+    styles?: ControlBarButtonStyles;
+    disabled?: boolean;
+}) => JSX.Element;
+//# sourceMappingURL=RaiseHand.d.ts.map

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

@@ -0,0 +1,26 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT license.
+/* @conditional-compile-remove(raise-hand) */
+import { RaiseHandButton } from "../../../../../../react-components/src";
+/* @conditional-compile-remove(raise-hand) */
+import React, { useMemo } from 'react';
+/* @conditional-compile-remove(raise-hand) */
+import { usePropsFor } from '../../hooks/usePropsFor';
+/* @conditional-compile-remove(raise-hand) */
+import { concatButtonBaseStyles } from '../../styles/Buttons.styles';
+/* @conditional-compile-remove(raise-hand) */
+/** @private */
+export const RaiseHand = (props) => {
+    const raiseHandButtonProps = usePropsFor(RaiseHandButton);
+    const styles = useMemo(() => { var _a; return concatButtonBaseStyles((_a = props.styles) !== null && _a !== void 0 ? _a : {}); }, [props.styles]);
+    const raiseHandButtonDisabled = isDisabled(props.option);
+    return (React.createElement(RaiseHandButton, Object.assign({ "data-ui-id": "call-composite-raisehand-button" }, raiseHandButtonProps, { showLabel: props.displayType !== 'compact', disabled: raiseHandButtonDisabled || props.disabled, styles: styles })));
+};
+/* @conditional-compile-remove(raise-hand) */
+const isDisabled = (option) => {
+    if (option === undefined || option === true || option === false) {
+        return false;
+    }
+    return option.disabled;
+};
+//# sourceMappingURL=RaiseHand.js.map

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

@@ -0,0 +1 @@

+ {"version":3,"file":"RaiseHand.js","sourceRoot":"","sources":["../../../../../../../../../react-composites/src/composites/CallComposite/components/buttons/RaiseHand.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAClC,6CAA6C;AAC7C,OAAO,EAA0B,eAAe,EAAE,+CAAmC;AACrF,6CAA6C;AAC7C,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAGvC,6CAA6C;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,6CAA6C;AAC7C,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AAErE,6CAA6C;AAC7C,eAAe;AACf,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,KAMzB,EAAe,EAAE;IAChB,MAAM,oBAAoB,GAAG,WAAW,CAAC,eAAe,CAAC,CAAC;IAC1D,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,EAAE,WAAC,OAAA,sBAAsB,CAAC,MAAA,KAAK,CAAC,MAAM,mCAAI,EAAE,CAAC,CAAA,EAAA,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;IAEzF,MAAM,uBAAuB,GAAG,UAAU,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;IAEzD,OAAO,CACL,oBAAC,eAAe,gCACH,iCAAiC,IACxC,oBAAoB,IACxB,SAAS,EAAE,KAAK,CAAC,WAAW,KAAK,SAAS,EAC1C,QAAQ,EAAE,uBAAuB,IAAI,KAAK,CAAC,QAAQ,EACnD,MAAM,EAAE,MAAM,IACd,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,6CAA6C;AAC7C,MAAM,UAAU,GAAG,CAAC,MAAwC,EAAW,EAAE;IACvE,IAAI,MAAM,KAAK,SAAS,IAAI,MAAM,KAAK,IAAI,IAAI,MAAM,KAAK,KAAK,EAAE;QAC/D,OAAO,KAAK,CAAC;KACd;IACD,OAAO,MAAM,CAAC,QAAQ,CAAC;AACzB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n/* @conditional-compile-remove(raise-hand) */\nimport { ControlBarButtonStyles, RaiseHandButton } from '@internal/react-components';\n/* @conditional-compile-remove(raise-hand) */\nimport React, { useMemo } from 'react';\n/* @conditional-compile-remove(raise-hand) */\nimport { CallControlDisplayType } from '../../../common/types/CommonCallControlOptions';\n/* @conditional-compile-remove(raise-hand) */\nimport { usePropsFor } from '../../hooks/usePropsFor';\n/* @conditional-compile-remove(raise-hand) */\nimport { concatButtonBaseStyles } from '../../styles/Buttons.styles';\n\n/* @conditional-compile-remove(raise-hand) */\n/** @private */\nexport const RaiseHand = (props: {\n // The value of `CallControlOptions.raiseHandButton`.\n option?: boolean | { disabled: boolean };\n displayType?: CallControlDisplayType;\n styles?: ControlBarButtonStyles;\n disabled?: boolean;\n}): JSX.Element => {\n const raiseHandButtonProps = usePropsFor(RaiseHandButton);\n const styles = useMemo(() => concatButtonBaseStyles(props.styles ?? {}), [props.styles]);\n\n const raiseHandButtonDisabled = isDisabled(props.option);\n\n return (\n <RaiseHandButton\n data-ui-id=\"call-composite-raisehand-button\"\n {...raiseHandButtonProps}\n showLabel={props.displayType !== 'compact'}\n disabled={raiseHandButtonDisabled || props.disabled}\n styles={styles}\n />\n );\n};\n\n/* @conditional-compile-remove(raise-hand) */\nconst isDisabled = (option?: boolean | { disabled: boolean }): boolean => {\n if (option === undefined || option === true || option === false) {\n return false;\n }\n return option.disabled;\n};\n\"../../../../../../react-components/src\""]}

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

@@ -48,6 +48,21 @@ const createCompositeHandlers = memoizeOne((adapter) => ({
     onRemoveParticipant: (userId) => __awaiter(void 0, void 0, void 0, function* () {
         yield adapter.removeParticipant(userId);
     }),
+    /* @conditional-compile-remove(raise-hand) */
+    onRaiseHand: () => __awaiter(void 0, void 0, void 0, function* () {
+        yield adapter.raiseHand();
+    }),
+    /* @conditional-compile-remove(raise-hand) */
+    onLowerHand: () => __awaiter(void 0, void 0, void 0, function* () {
+        yield adapter.lowerHand();
+    }),
+    /* @conditional-compile-remove(raise-hand) */
+    onToggleRaiseHand: () => __awaiter(void 0, void 0, void 0, function* () {
+        var _b;
+        ((_b = adapter.getState().call) === null || _b === void 0 ? void 0 : _b.raiseHand.localParticipantRaisedHand)
+            ? yield adapter.lowerHand()
+            : yield adapter.raiseHand();
+    }),
     onSelectCamera: (deviceInfo, options) => __awaiter(void 0, void 0, void 0, function* () {
         yield adapter.setCamera(deviceInfo, options);
     }),
@@ -71,12 +86,12 @@ const createCompositeHandlers = memoizeOne((adapter) => ({
         isCameraOn(adapter.getState()) ? yield adapter.stopCamera() : yield adapter.startCamera(options);
     }),
     onToggleMicrophone: () => __awaiter(void 0, void 0, void 0, function* () {
-        var _b;
-        return ((_b = adapter.getState().call) === null || _b === void 0 ? void 0 : _b.isMuted) ? yield adapter.unmute() : yield adapter.mute();
+        var _c;
+        return ((_c = adapter.getState().call) === null || _c === void 0 ? void 0 : _c.isMuted) ? yield adapter.unmute() : yield adapter.mute();
     }),
     onToggleScreenShare: () => __awaiter(void 0, void 0, void 0, function* () {
-        var _c;
-        return ((_c = adapter.getState().call) === null || _c === void 0 ? void 0 : _c.isScreenSharingOn)
+        var _d;
+        return ((_d = adapter.getState().call) === null || _d === void 0 ? void 0 : _d.isScreenSharingOn)
             ? yield adapter.stopScreenShare()
             : yield adapter.startScreenShare();
     }),

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

	@@ -1 +1 @@
1	- {"version":3,"file":"useHandlers.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/hooks/useHandlers.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { CommonCallingHandlers } from '@internal/calling-component-bindings';\nimport { CommonProperties, toFlatCommunicationIdentifier } from '@internal/acs-ui-common';\nimport { ReactElement } from 'react';\nimport memoizeOne from 'memoize-one';\nimport { CommonCallAdapter } from '..';\n/* @conditional-compile-remove(video-background-effects) /\nimport { VideoBackgroundBlurEffect, VideoBackgroundReplacementEffect } from '..';\nimport { useAdapter } from '../adapter/CallAdapterProvider';\nimport { isCameraOn } from '../utils';\n/ @conditional-compile-remove(PSTN-calls) /\nimport { DtmfTone } from '@azure/communication-calling';\n/ @conditional-compile-remove(video-background-effects) /\nimport type { BackgroundReplacementConfig, BackgroundBlurConfig } from '@azure/communication-calling';\n\n/\n @private\n /\n// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types, @typescript-eslint/explicit-function-return-type\nexport const useHandlers = <PropsT>(\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n _component: (props: PropsT) => ReactElement \| null\n): Pick<CommonCallingHandlers, CommonProperties<CommonCallingHandlers, PropsT>> => {\n return createCompositeHandlers(useAdapter());\n};\n\nconst createCompositeHandlers = memoizeOne(\n (adapter: CommonCallAdapter): CommonCallingHandlers => ({\n onCreateLocalStreamView: async (options) => {\n return await adapter.createStreamView(undefined, options);\n },\n onCreateRemoteStreamView: async (userId, options) => {\n return await adapter.createStreamView(userId, options);\n },\n onHangUp: async (forEveryone?: boolean) => {\n await adapter.leaveCall(forEveryone);\n },\n / @conditional-compile-remove(PSTN-calls) /\n onToggleHold: async () => {\n return adapter.getState().call?.state === 'LocalHold' ? await adapter.resumeCall() : await adapter.holdCall();\n },\n / @conditional-compile-remove(PSTN-calls) /\n onAddParticipant: async (participant, options?) => {\n return await adapter.addParticipant(participant, options);\n },\n / @conditional-compile-remove(PSTN-calls) /\n onSendDtmfTone: async (dtmfTone: DtmfTone) => {\n await adapter.sendDtmfTone(dtmfTone);\n },\n onRemoveParticipant: async (userId) => {\n await adapter.removeParticipant(userId);\n },\n onSelectCamera: async (deviceInfo, options) => {\n await adapter.setCamera(deviceInfo, options);\n },\n onSelectMicrophone: async (deviceInfo) => {\n await adapter.setMicrophone(deviceInfo);\n },\n onSelectSpeaker: async (deviceInfo) => {\n await adapter.setSpeaker(deviceInfo);\n },\n onStartCall: (participants, options?) => {\n const rawIds = participants.map((participant) => toFlatCommunicationIdentifier(participant));\n return adapter.startCall(rawIds, options);\n },\n onStartScreenShare: async () => {\n await adapter.startScreenShare();\n },\n onStopScreenShare: async () => {\n await adapter.stopScreenShare();\n },\n onToggleCamera: async (options) => {\n isCameraOn(adapter.getState()) ? await adapter.stopCamera() : await adapter.startCamera(options);\n },\n onToggleMicrophone: async () => {\n return adapter.getState().call?.isMuted ? await adapter.unmute() : await adapter.mute();\n },\n onToggleScreenShare: async () => {\n return adapter.getState().call?.isScreenSharingOn\n ? await adapter.stopScreenShare()\n : await adapter.startScreenShare();\n },\n onStartLocalVideo: async () => {\n if (adapter.getState().call) {\n return adapter.startCamera();\n }\n },\n onDisposeLocalStreamView: async () => {\n return adapter.disposeLocalVideoStreamView();\n },\n onDisposeRemoteStreamView: async (userId) => {\n return adapter.disposeStreamView(userId);\n },\n onDisposeRemoteScreenShareStreamView: async (userId) => {\n return adapter.disposeScreenShareStreamView(userId);\n },\n onDisposeRemoteVideoStreamView: async (userId) => {\n return adapter.disposeRemoteVideoStreamView(userId);\n },\n / @conditional-compile-remove(call-readiness) /\n askDevicePermission: async (constrain) => {\n return adapter.askDevicePermission(constrain);\n },\n / @conditional-compile-remove(video-background-effects) /\n onRemoveVideoBackgroundEffects: async () => {\n return await adapter.stopVideoBackgroundEffects();\n },\n / @conditional-compile-remove(video-background-effects) /\n onBlurVideoBackground: async (backgroundBlurConfig?: BackgroundBlurConfig) => {\n const blurConfig: VideoBackgroundBlurEffect = {\n effectName: 'blur',\n ...backgroundBlurConfig\n };\n return await adapter.startVideoBackgroundEffect(blurConfig);\n },\n / @conditional-compile-remove(video-background-effects) /\n onReplaceVideoBackground: async (backgroundReplacementConfig: BackgroundReplacementConfig) => {\n const replacementConfig: VideoBackgroundReplacementEffect = {\n effectName: 'replacement',\n ...backgroundReplacementConfig\n };\n return await adapter.startVideoBackgroundEffect(replacementConfig);\n },\n / @conditional-compile-remove(close-captions) /\n onStartCaptions: async (options) => {\n await adapter.startCaptions(options);\n },\n / @conditional-compile-remove(close-captions) /\n onStopCaptions: async () => {\n await adapter.stopCaptions();\n },\n / @conditional-compile-remove(close-captions) /\n onSetSpokenLanguage: async (language) => {\n await adapter.setSpokenLanguage(language);\n },\n / @conditional-compile-remove(close-captions) */\n onSetCaptionLanguage: async (language) => {\n await adapter.setCaptionLanguage(language);\n }\n })\n);\n\"../../../../../calling-component-bindings/src\"\"../../../../../acs-ui-common/src\""]}
1	+ {"version":3,"file":"useHandlers.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/hooks/useHandlers.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;;;;;;;;;;AAGlC,OAAO,EAAoB,6BAA6B,EAAE,yCAAgC;AAE1F,OAAO,UAAU,MAAM,aAAa,CAAC;AAIrC,OAAO,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAC5D,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAMtC;;GAEG;AACH,+HAA+H;AAC/H,MAAM,CAAC,MAAM,WAAW,GAAG;AACzB,6DAA6D;AAC7D,UAAkD,EAC4B,EAAE;IAChF,OAAO,uBAAuB,CAAC,UAAU,EAAE,CAAC,CAAC;AAC/C,CAAC,CAAC;AAEF,MAAM,uBAAuB,GAAG,UAAU,CACxC,CAAC,OAA0B,EAAyB,EAAE,CAAC,CAAC;IACtD,uBAAuB,EAAE,CAAO,OAAO,EAAE,EAAE;QACzC,OAAO,MAAM,OAAO,CAAC,gBAAgB,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;IAC5D,CAAC,CAAA;IACD,wBAAwB,EAAE,CAAO,MAAM,EAAE,OAAO,EAAE,EAAE;QAClD,OAAO,MAAM,OAAO,CAAC,gBAAgB,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACzD,CAAC,CAAA;IACD,QAAQ,EAAE,CAAO,WAAqB,EAAE,EAAE;QACxC,MAAM,OAAO,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACvC,CAAC,CAAA;IACD,6CAA6C;IAC7C,YAAY,EAAE,GAAS,EAAE;;QACvB,OAAO,CAAA,MAAA,OAAO,CAAC,QAAQ,EAAE,CAAC,IAAI,0CAAE,KAAK,MAAK,WAAW,CAAC,CAAC,CAAC,MAAM,OAAO,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC,MAAM,OAAO,CAAC,QAAQ,EAAE,CAAC;IAChH,CAAC,CAAA;IACD,6CAA6C;IAC7C,gBAAgB,EAAE,CAAO,WAAW,EAAE,OAAQ,EAAE,EAAE;QAChD,OAAO,MAAM,OAAO,CAAC,cAAc,CAAC,WAAW,EAAE,OAAO,CAAC,CAAC;IAC5D,CAAC,CAAA;IACD,6CAA6C;IAC7C,cAAc,EAAE,CAAO,QAAkB,EAAE,EAAE;QAC3C,MAAM,OAAO,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;IACvC,CAAC,CAAA;IACD,mBAAmB,EAAE,CAAO,MAAM,EAAE,EAAE;QACpC,MAAM,OAAO,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC;IAC1C,CAAC,CAAA;IACD,6CAA6C;IAC7C,WAAW,EAAE,GAAS,EAAE;QACtB,MAAM,OAAO,CAAC,SAAS,EAAE,CAAC;IAC5B,CAAC,CAAA;IACD,6CAA6C;IAC7C,WAAW,EAAE,GAAS,EAAE;QACtB,MAAM,OAAO,CAAC,SAAS,EAAE,CAAC;IAC5B,CAAC,CAAA;IACD,6CAA6C;IAC7C,iBAAiB,EAAE,GAAS,EAAE;;QAC5B,CAAA,MAAA,OAAO,CAAC,QAAQ,EAAE,CAAC,IAAI,0CAAE,SAAS,CAAC,0BAA0B;YAC3D,CAAC,CAAC,MAAM,OAAO,CAAC,SAAS,EAAE;YAC3B,CAAC,CAAC,MAAM,OAAO,CAAC,SAAS,EAAE,CAAC;IAChC,CAAC,CAAA;IACD,cAAc,EAAE,CAAO,UAAU,EAAE,OAAO,EAAE,EAAE;QAC5C,MAAM,OAAO,CAAC,SAAS,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC;IAC/C,CAAC,CAAA;IACD,kBAAkB,EAAE,CAAO,UAAU,EAAE,EAAE;QACvC,MAAM,OAAO,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IAC1C,CAAC,CAAA;IACD,eAAe,EAAE,CAAO,UAAU,EAAE,EAAE;QACpC,MAAM,OAAO,CAAC,UAAU,CAAC,UAAU,CAAC,CAAC;IACvC,CAAC,CAAA;IACD,WAAW,EAAE,CAAC,YAAY,EAAE,OAAQ,EAAE,EAAE;QACtC,MAAM,MAAM,GAAG,YAAY,CAAC,GAAG,CAAC,CAAC,WAAW,EAAE,EAAE,CAAC,6BAA6B,CAAC,WAAW,CAAC,CAAC,CAAC;QAC7F,OAAO,OAAO,CAAC,SAAS,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC5C,CAAC;IACD,kBAAkB,EAAE,GAAS,EAAE;QAC7B,MAAM,OAAO,CAAC,gBAAgB,EAAE,CAAC;IACnC,CAAC,CAAA;IACD,iBAAiB,EAAE,GAAS,EAAE;QAC5B,MAAM,OAAO,CAAC,eAAe,EAAE,CAAC;IAClC,CAAC,CAAA;IACD,cAAc,EAAE,CAAO,OAAO,EAAE,EAAE;QAChC,UAAU,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,OAAO,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC,MAAM,OAAO,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;IACnG,CAAC,CAAA;IACD,kBAAkB,EAAE,GAAS,EAAE;;QAC7B,OAAO,CAAA,MAAA,OAAO,CAAC,QAAQ,EAAE,CAAC,IAAI,0CAAE,OAAO,EAAC,CAAC,CAAC,MAAM,OAAO,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,MAAM,OAAO,CAAC,IAAI,EAAE,CAAC;IAC1F,CAAC,CAAA;IACD,mBAAmB,EAAE,GAAS,EAAE;;QAC9B,OAAO,CAAA,MAAA,OAAO,CAAC,QAAQ,EAAE,CAAC,IAAI,0CAAE,iBAAiB;YAC/C,CAAC,CAAC,MAAM,OAAO,CAAC,eAAe,EAAE;YACjC,CAAC,CAAC,MAAM,OAAO,CAAC,gBAAgB,EAAE,CAAC;IACvC,CAAC,CAAA;IACD,iBAAiB,EAAE,GAAS,EAAE;QAC5B,IAAI,OAAO,CAAC,QAAQ,EAAE,CAAC,IAAI,EAAE;YAC3B,OAAO,OAAO,CAAC,WAAW,EAAE,CAAC;SAC9B;IACH,CAAC,CAAA;IACD,wBAAwB,EAAE,GAAS,EAAE;QACnC,OAAO,OAAO,CAAC,2BAA2B,EAAE,CAAC;IAC/C,CAAC,CAAA;IACD,yBAAyB,EAAE,CAAO,MAAM,EAAE,EAAE;QAC1C,OAAO,OAAO,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC;IAC3C,CAAC,CAAA;IACD,oCAAoC,EAAE,CAAO,MAAM,EAAE,EAAE;QACrD,OAAO,OAAO,CAAC,4BAA4B,CAAC,MAAM,CAAC,CAAC;IACtD,CAAC,CAAA;IACD,8BAA8B,EAAE,CAAO,MAAM,EAAE,EAAE;QAC/C,OAAO,OAAO,CAAC,4BAA4B,CAAC,MAAM,CAAC,CAAC;IACtD,CAAC,CAAA;IACD,iDAAiD;IACjD,mBAAmB,EAAE,CAAO,SAAS,EAAE,EAAE;QACvC,OAAO,OAAO,CAAC,mBAAmB,CAAC,SAAS,CAAC,CAAC;IAChD,CAAC,CAAA;IACD,2DAA2D;IAC3D,8BAA8B,EAAE,GAAS,EAAE;QACzC,OAAO,MAAM,OAAO,CAAC,0BAA0B,EAAE,CAAC;IACpD,CAAC,CAAA;IACD,2DAA2D;IAC3D,qBAAqB,EAAE,CAAO,oBAA2C,EAAE,EAAE;QAC3E,MAAM,UAAU,mBACd,UAAU,EAAE,MAAM,IACf,oBAAoB,CACxB,CAAC;QACF,OAAO,MAAM,OAAO,CAAC,0BAA0B,CAAC,UAAU,CAAC,CAAC;IAC9D,CAAC,CAAA;IACD,2DAA2D;IAC3D,wBAAwB,EAAE,CAAO,2BAAwD,EAAE,EAAE;QAC3F,MAAM,iBAAiB,mBACrB,UAAU,EAAE,aAAa,IACtB,2BAA2B,CAC/B,CAAC;QACF,OAAO,MAAM,OAAO,CAAC,0BAA0B,CAAC,iBAAiB,CAAC,CAAC;IACrE,CAAC,CAAA;IACD,iDAAiD;IACjD,eAAe,EAAE,CAAO,OAAO,EAAE,EAAE;QACjC,MAAM,OAAO,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;IACvC,CAAC,CAAA;IACD,iDAAiD;IACjD,cAAc,EAAE,GAAS,EAAE;QACzB,MAAM,OAAO,CAAC,YAAY,EAAE,CAAC;IAC/B,CAAC,CAAA;IACD,iDAAiD;IACjD,mBAAmB,EAAE,CAAO,QAAQ,EAAE,EAAE;QACtC,MAAM,OAAO,CAAC,iBAAiB,CAAC,QAAQ,CAAC,CAAC;IAC5C,CAAC,CAAA;IACD,iDAAiD;IACjD,oBAAoB,EAAE,CAAO,QAAQ,EAAE,EAAE;QACvC,MAAM,OAAO,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;IAC7C,CAAC,CAAA;CACF,CAAC,CACH,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { CommonCallingHandlers } from '@internal/calling-component-bindings';\nimport { CommonProperties, toFlatCommunicationIdentifier } from '@internal/acs-ui-common';\nimport { ReactElement } from 'react';\nimport memoizeOne from 'memoize-one';\nimport { CommonCallAdapter } from '..';\n/* @conditional-compile-remove(video-background-effects) /\nimport { VideoBackgroundBlurEffect, VideoBackgroundReplacementEffect } from '..';\nimport { useAdapter } from '../adapter/CallAdapterProvider';\nimport { isCameraOn } from '../utils';\n/ @conditional-compile-remove(PSTN-calls) /\nimport { DtmfTone } from '@azure/communication-calling';\n/ @conditional-compile-remove(video-background-effects) /\nimport type { BackgroundReplacementConfig, BackgroundBlurConfig } from '@azure/communication-calling';\n\n/\n @private\n /\n// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types, @typescript-eslint/explicit-function-return-type\nexport const useHandlers = <PropsT>(\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n _component: (props: PropsT) => ReactElement \| null\n): Pick<CommonCallingHandlers, CommonProperties<CommonCallingHandlers, PropsT>> => {\n return createCompositeHandlers(useAdapter());\n};\n\nconst createCompositeHandlers = memoizeOne(\n (adapter: CommonCallAdapter): CommonCallingHandlers => ({\n onCreateLocalStreamView: async (options) => {\n return await adapter.createStreamView(undefined, options);\n },\n onCreateRemoteStreamView: async (userId, options) => {\n return await adapter.createStreamView(userId, options);\n },\n onHangUp: async (forEveryone?: boolean) => {\n await adapter.leaveCall(forEveryone);\n },\n / @conditional-compile-remove(PSTN-calls) /\n onToggleHold: async () => {\n return adapter.getState().call?.state === 'LocalHold' ? await adapter.resumeCall() : await adapter.holdCall();\n },\n / @conditional-compile-remove(PSTN-calls) /\n onAddParticipant: async (participant, options?) => {\n return await adapter.addParticipant(participant, options);\n },\n / @conditional-compile-remove(PSTN-calls) /\n onSendDtmfTone: async (dtmfTone: DtmfTone) => {\n await adapter.sendDtmfTone(dtmfTone);\n },\n onRemoveParticipant: async (userId) => {\n await adapter.removeParticipant(userId);\n },\n / @conditional-compile-remove(raise-hand) /\n onRaiseHand: async () => {\n await adapter.raiseHand();\n },\n / @conditional-compile-remove(raise-hand) /\n onLowerHand: async () => {\n await adapter.lowerHand();\n },\n / @conditional-compile-remove(raise-hand) /\n onToggleRaiseHand: async () => {\n adapter.getState().call?.raiseHand.localParticipantRaisedHand\n ? await adapter.lowerHand()\n : await adapter.raiseHand();\n },\n onSelectCamera: async (deviceInfo, options) => {\n await adapter.setCamera(deviceInfo, options);\n },\n onSelectMicrophone: async (deviceInfo) => {\n await adapter.setMicrophone(deviceInfo);\n },\n onSelectSpeaker: async (deviceInfo) => {\n await adapter.setSpeaker(deviceInfo);\n },\n onStartCall: (participants, options?) => {\n const rawIds = participants.map((participant) => toFlatCommunicationIdentifier(participant));\n return adapter.startCall(rawIds, options);\n },\n onStartScreenShare: async () => {\n await adapter.startScreenShare();\n },\n onStopScreenShare: async () => {\n await adapter.stopScreenShare();\n },\n onToggleCamera: async (options) => {\n isCameraOn(adapter.getState()) ? await adapter.stopCamera() : await adapter.startCamera(options);\n },\n onToggleMicrophone: async () => {\n return adapter.getState().call?.isMuted ? await adapter.unmute() : await adapter.mute();\n },\n onToggleScreenShare: async () => {\n return adapter.getState().call?.isScreenSharingOn\n ? await adapter.stopScreenShare()\n : await adapter.startScreenShare();\n },\n onStartLocalVideo: async () => {\n if (adapter.getState().call) {\n return adapter.startCamera();\n }\n },\n onDisposeLocalStreamView: async () => {\n return adapter.disposeLocalVideoStreamView();\n },\n onDisposeRemoteStreamView: async (userId) => {\n return adapter.disposeStreamView(userId);\n },\n onDisposeRemoteScreenShareStreamView: async (userId) => {\n return adapter.disposeScreenShareStreamView(userId);\n },\n onDisposeRemoteVideoStreamView: async (userId) => {\n return adapter.disposeRemoteVideoStreamView(userId);\n },\n / @conditional-compile-remove(call-readiness) /\n askDevicePermission: async (constrain) => {\n return adapter.askDevicePermission(constrain);\n },\n / @conditional-compile-remove(video-background-effects) /\n onRemoveVideoBackgroundEffects: async () => {\n return await adapter.stopVideoBackgroundEffects();\n },\n / @conditional-compile-remove(video-background-effects) /\n onBlurVideoBackground: async (backgroundBlurConfig?: BackgroundBlurConfig) => {\n const blurConfig: VideoBackgroundBlurEffect = {\n effectName: 'blur',\n ...backgroundBlurConfig\n };\n return await adapter.startVideoBackgroundEffect(blurConfig);\n },\n / @conditional-compile-remove(video-background-effects) /\n onReplaceVideoBackground: async (backgroundReplacementConfig: BackgroundReplacementConfig) => {\n const replacementConfig: VideoBackgroundReplacementEffect = {\n effectName: 'replacement',\n ...backgroundReplacementConfig\n };\n return await adapter.startVideoBackgroundEffect(replacementConfig);\n },\n / @conditional-compile-remove(close-captions) /\n onStartCaptions: async (options) => {\n await adapter.startCaptions(options);\n },\n / @conditional-compile-remove(close-captions) /\n onStopCaptions: async () => {\n await adapter.stopCaptions();\n },\n / @conditional-compile-remove(close-captions) /\n onSetSpokenLanguage: async (language) => {\n await adapter.setSpokenLanguage(language);\n },\n / @conditional-compile-remove(close-captions) */\n onSetCaptionLanguage: async (language) => {\n await adapter.setCaptionLanguage(language);\n }\n })\n);\n\"../../../../../calling-component-bindings/src\"\"../../../../../acs-ui-common/src\""]}

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

@@ -1,5 +1,6 @@
 import { DiagnosticQuality } from '@azure/communication-calling';
 import { ActiveErrorMessage, OnRenderAvatarCallback, ParticipantMenuItemsCallback } from "../../../../../react-components/src";
+import { VideoGalleryLayout } from "../../../../../react-components/src";
 import { AvatarPersonaDataCallback } from '../../common/AvatarPersona';
 import { CallCompositeOptions } from '../CallComposite';
 import { MobileChatSidePaneTabHeaderProps } from '../../common/TabHeader';
@@ -19,6 +20,7 @@ export interface CallPageProps {
     options?: CallCompositeOptions;
     latestErrors: ActiveErrorMessage[];
     onDismissError: (error: ActiveErrorMessage) => void;
+    galleryLayout: VideoGalleryLayout;
 }
 /**
  * @private

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

@@ -24,7 +24,9 @@ import { reduceCallControlsForMobile } from '../utils';
  * @private
  */
 export const CallPage = (props) => {
-    const { callInvitationURL, onRenderAvatar, onFetchAvatarPersonaData, onFetchParticipantMenuItems, options, mobileView } = props;
+    const { callInvitationURL, onRenderAvatar, onFetchAvatarPersonaData, onFetchParticipantMenuItems, options, mobileView,
+    /* @conditional-compile-remove(gallery-layouts) */
+    galleryLayout = 'floatingLocalVideo' } = props;
     // To use useProps to get these states, we need to create another file wrapping Call,
     // It seems unnecessary in this case, so we get the updated states using this approach.
     const { callStatus } = useSelector(callStatusSelector);
@@ -40,6 +42,8 @@ export const CallPage = (props) => {
     const drawerMenuHostId = useId('drawerMenuHost');
     /* @conditional-compile-remove(gallery-layouts) */
     const [userSetOverflowGalleryPosition, setUserSetOverflowGalleryPosition] = useState('Responsive');
+    /* @conditional-compile-remove(gallery-layouts) */
+    const [userSetGalleryLayout, setUserSetGalleryLayout] = useState(galleryLayout);
     return (React.createElement(CallArrangement, { id: drawerMenuHostId, complianceBannerProps: Object.assign(Object.assign({}, complianceBannerProps), { strings }), errorBarProps: (options === null || options === void 0 ? void 0 : options.errorBar) !== false && errorBarProps, mutedNotificationProps: mutedNotificationProps, callControlProps: {
             callInvitationURL: callInvitationURL,
             onFetchParticipantMenuItems: onFetchParticipantMenuItems,
@@ -53,9 +57,15 @@ export const CallPage = (props) => {
             /* @conditional-compile-remove(click-to-call) */
             localVideoTileOptions: options === null || options === void 0 ? void 0 : options.localVideoTile,
             /* @conditional-compile-remove(gallery-layouts) */
-            userSetOverflowGalleryPosition: userSetOverflowGalleryPosition }))) : (React.createElement(NetworkReconnectTile, Object.assign({}, networkReconnectTileProps)))) : (React.createElement(React.Fragment, null)), updateSidePaneRenderer: props.updateSidePaneRenderer, mobileChatTabHeader: props.mobileChatTabHeader, dataUiId: 'call-page', latestErrors: props.latestErrors, onDismissError: props.onDismissError,
+            userSetOverflowGalleryPosition: userSetOverflowGalleryPosition,
+            /* @conditional-compile-remove(gallery-layouts) */
+            userSetGalleryLayout: userSetGalleryLayout }))) : (React.createElement(NetworkReconnectTile, Object.assign({}, networkReconnectTileProps)))) : (React.createElement(React.Fragment, null)), updateSidePaneRenderer: props.updateSidePaneRenderer, mobileChatTabHeader: props.mobileChatTabHeader, dataUiId: 'call-page', latestErrors: props.latestErrors, onDismissError: props.onDismissError,
+        /* @conditional-compile-remove(gallery-layouts) */
+        onUserSetOverflowGalleryPositionChange: setUserSetOverflowGalleryPosition,
+        /* @conditional-compile-remove(gallery-layouts) */
+        onUserSetGalleryLayoutChange: setUserSetGalleryLayout,
         /* @conditional-compile-remove(gallery-layouts) */
-        onUserSetOverflowGalleryPositionChange: setUserSetOverflowGalleryPosition }));
+        userSetGalleryLayout: userSetGalleryLayout }));
 };
 /**
  * @private

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

	@@ -1 +1 @@
1	- {"version":3,"file":"CallPage.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/pages/CallPage.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { DiagnosticQuality } from '@azure/communication-calling';\nimport { useId } from '@fluentui/react-hooks';\nimport { _isInCall } from '@internal/calling-component-bindings';\nimport {\n ActiveErrorMessage,\n ErrorBar,\n OnRenderAvatarCallback,\n ParticipantMenuItemsCallback\n} from '@internal/react-components';\nimport React from 'react';\n/* @conditional-compile-remove(gallery-layouts) /\nimport { useState } from 'react';\nimport { AvatarPersonaDataCallback } from '../../common/AvatarPersona';\nimport { useLocale } from '../../localization';\nimport { CallCompositeOptions } from '../CallComposite';\nimport { CallArrangement } from '../components/CallArrangement';\nimport { MediaGallery } from '../components/MediaGallery';\nimport { NetworkReconnectTile } from '../components/NetworkReconnectTile';\nimport { useHandlers } from '../hooks/useHandlers';\nimport { usePropsFor } from '../hooks/usePropsFor';\nimport { useSelector } from '../hooks/useSelector';\nimport { callStatusSelector } from '../selectors/callStatusSelector';\nimport { complianceBannerSelector } from '../selectors/complianceBannerSelector';\nimport { mediaGallerySelector } from '../selectors/mediaGallerySelector';\nimport { mutedNotificationSelector } from '../selectors/mutedNotificationSelector';\nimport { networkReconnectTileSelector } from '../selectors/networkReconnectTileSelector';\nimport { reduceCallControlsForMobile } from '../utils';\nimport { MobileChatSidePaneTabHeaderProps } from '../../common/TabHeader';\nimport { SidePaneRenderer } from '../components/SidePane/SidePaneProvider';\n\n/\n @private\n /\nexport interface CallPageProps {\n mobileView: boolean;\n modalLayerHostId: string;\n callInvitationURL?: string;\n onRenderAvatar?: OnRenderAvatarCallback;\n onFetchAvatarPersonaData?: AvatarPersonaDataCallback;\n onFetchParticipantMenuItems?: ParticipantMenuItemsCallback;\n updateSidePaneRenderer: (renderer: SidePaneRenderer \| undefined) => void;\n mobileChatTabHeader?: MobileChatSidePaneTabHeaderProps;\n options?: CallCompositeOptions;\n latestErrors: ActiveErrorMessage[];\n onDismissError: (error: ActiveErrorMessage) => void;\n}\n\n/\n @private\n /\nexport const CallPage = (props: CallPageProps): JSX.Element => {\n const {\n callInvitationURL,\n onRenderAvatar,\n onFetchAvatarPersonaData,\n onFetchParticipantMenuItems,\n options,\n mobileView\n } = props;\n\n // To use useProps to get these states, we need to create another file wrapping Call,\n // It seems unnecessary in this case, so we get the updated states using this approach.\n const { callStatus } = useSelector(callStatusSelector);\n const mediaGalleryProps = useSelector(mediaGallerySelector);\n const mediaGalleryHandlers = useHandlers(MediaGallery);\n const complianceBannerProps = useSelector(complianceBannerSelector);\n const errorBarProps = usePropsFor(ErrorBar);\n const mutedNotificationProps = useSelector(mutedNotificationSelector);\n const networkReconnectTileProps = useSelector(networkReconnectTileSelector);\n\n const strings = useLocale().strings.call;\n\n // Reduce the controls shown when mobile view is enabled.\n const callControlOptions = mobileView ? reduceCallControlsForMobile(options?.callControls) : options?.callControls;\n\n const drawerMenuHostId = useId('drawerMenuHost');\n\n / @conditional-compile-remove(gallery-layouts) /\n const [userSetOverflowGalleryPosition, setUserSetOverflowGalleryPosition] = useState<'Responsive' \| 'HorizontalTop'>(\n 'Responsive'\n );\n\n return (\n <CallArrangement\n id={drawerMenuHostId}\n complianceBannerProps={{ ...complianceBannerProps, strings }}\n errorBarProps={options?.errorBar !== false && errorBarProps}\n mutedNotificationProps={mutedNotificationProps}\n callControlProps={{\n callInvitationURL: callInvitationURL,\n onFetchParticipantMenuItems: onFetchParticipantMenuItems,\n options: callControlOptions,\n increaseFlyoutItemSize: mobileView\n }}\n / @conditional-compile-remove(one-to-n-calling) /\n onFetchAvatarPersonaData={onFetchAvatarPersonaData}\n mobileView={mobileView}\n modalLayerHostId={props.modalLayerHostId}\n onRenderGalleryContent={() =>\n _isInCall(callStatus) ? (\n isNetworkHealthy(networkReconnectTileProps.networkReconnectValue) ? (\n <MediaGallery\n isMobile={mobileView}\n {...mediaGalleryProps}\n {...mediaGalleryHandlers}\n onRenderAvatar={onRenderAvatar}\n onFetchAvatarPersonaData={onFetchAvatarPersonaData}\n / @conditional-compile-remove(pinned-participants) /\n remoteVideoTileMenuOptions={options?.remoteVideoTileMenu}\n drawerMenuHostId={drawerMenuHostId}\n / @conditional-compile-remove(click-to-call) /\n localVideoTileOptions={options?.localVideoTile}\n / @conditional-compile-remove(gallery-layouts) /\n userSetOverflowGalleryPosition={userSetOverflowGalleryPosition}\n />\n ) : (\n <NetworkReconnectTile {...networkReconnectTileProps} />\n )\n ) : (\n <></>\n )\n }\n updateSidePaneRenderer={props.updateSidePaneRenderer}\n mobileChatTabHeader={props.mobileChatTabHeader}\n dataUiId={'call-page'}\n latestErrors={props.latestErrors}\n onDismissError={props.onDismissError}\n / @conditional-compile-remove(gallery-layouts) /\n onUserSetOverflowGalleryPositionChange={setUserSetOverflowGalleryPosition}\n />\n );\n};\n\n/\n @private\n */\nexport const isNetworkHealthy = (value: DiagnosticQuality \| boolean \| undefined): boolean => {\n // We know that the value is actually of type DiagnosticQuality for this diagnostic.\n // We ignore any boolen values, considering the network to still be healthy.\n // Thus, only DiagnosticQuality.Poor or .Bad indicate network problems.\n return value === true \|\| value === false \|\| value === undefined \|\| value === DiagnosticQuality.Good;\n};\n\"../../../../../calling-component-bindings/src\"\"../../../../../react-components/src\""]}
1	+ {"version":3,"file":"CallPage.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/pages/CallPage.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,iBAAiB,EAAE,MAAM,8BAA8B,CAAC;AACjE,OAAO,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAC9C,OAAO,EAAE,SAAS,EAAE,sDAA6C;AACjE,OAAO,EAEL,QAAQ,EAGT,4CAAmC;AAGpC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,kDAAkD;AAClD,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAE/C,OAAO,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAC;AAChE,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,oBAAoB,EAAE,MAAM,oCAAoC,CAAC;AAC1E,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAE,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AACrE,OAAO,EAAE,wBAAwB,EAAE,MAAM,uCAAuC,CAAC;AACjF,OAAO,EAAE,oBAAoB,EAAE,MAAM,mCAAmC,CAAC;AACzE,OAAO,EAAE,yBAAyB,EAAE,MAAM,wCAAwC,CAAC;AACnF,OAAO,EAAE,4BAA4B,EAAE,MAAM,2CAA2C,CAAC;AACzF,OAAO,EAAE,2BAA2B,EAAE,MAAM,UAAU,CAAC;AAuBvD;;GAEG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,KAAoB,EAAe,EAAE;IAC5D,MAAM,EACJ,iBAAiB,EACjB,cAAc,EACd,wBAAwB,EACxB,2BAA2B,EAC3B,OAAO,EACP,UAAU;IACV,kDAAkD;IAClD,aAAa,GAAG,oBAAoB,EACrC,GAAG,KAAK,CAAC;IAEV,qFAAqF;IACrF,uFAAuF;IACvF,MAAM,EAAE,UAAU,EAAE,GAAG,WAAW,CAAC,kBAAkB,CAAC,CAAC;IACvD,MAAM,iBAAiB,GAAG,WAAW,CAAC,oBAAoB,CAAC,CAAC;IAC5D,MAAM,oBAAoB,GAAG,WAAW,CAAC,YAAY,CAAC,CAAC;IACvD,MAAM,qBAAqB,GAAG,WAAW,CAAC,wBAAwB,CAAC,CAAC;IACpE,MAAM,aAAa,GAAG,WAAW,CAAC,QAAQ,CAAC,CAAC;IAC5C,MAAM,sBAAsB,GAAG,WAAW,CAAC,yBAAyB,CAAC,CAAC;IACtE,MAAM,yBAAyB,GAAG,WAAW,CAAC,4BAA4B,CAAC,CAAC;IAE5E,MAAM,OAAO,GAAG,SAAS,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC;IAEzC,yDAAyD;IACzD,MAAM,kBAAkB,GAAG,UAAU,CAAC,CAAC,CAAC,2BAA2B,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,YAAY,CAAC,CAAC,CAAC,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,YAAY,CAAC;IAEnH,MAAM,gBAAgB,GAAG,KAAK,CAAC,gBAAgB,CAAC,CAAC;IAEjD,kDAAkD;IAClD,MAAM,CAAC,8BAA8B,EAAE,iCAAiC,CAAC,GAAG,QAAQ,CAClF,YAAY,CACb,CAAC;IACF,kDAAkD;IAClD,MAAM,CAAC,oBAAoB,EAAE,uBAAuB,CAAC,GAAG,QAAQ,CAAqB,aAAa,CAAC,CAAC;IAEpG,OAAO,CACL,oBAAC,eAAe,IACd,EAAE,EAAE,gBAAgB,EACpB,qBAAqB,kCAAO,qBAAqB,KAAE,OAAO,KAC1D,aAAa,EAAE,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,QAAQ,MAAK,KAAK,IAAI,aAAa,EAC3D,sBAAsB,EAAE,sBAAsB,EAC9C,gBAAgB,EAAE;YAChB,iBAAiB,EAAE,iBAAiB;YACpC,2BAA2B,EAAE,2BAA2B;YACxD,OAAO,EAAE,kBAAkB;YAC3B,sBAAsB,EAAE,UAAU;SACnC;QACD,mDAAmD;QACnD,wBAAwB,EAAE,wBAAwB,EAClD,UAAU,EAAE,UAAU,EACtB,gBAAgB,EAAE,KAAK,CAAC,gBAAgB,EACxC,sBAAsB,EAAE,GAAG,EAAE,CAC3B,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CACtB,gBAAgB,CAAC,yBAAyB,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC,CAClE,oBAAC,YAAY,kBACX,QAAQ,EAAE,UAAU,IAChB,iBAAiB,EACjB,oBAAoB,IACxB,cAAc,EAAE,cAAc,EAC9B,wBAAwB,EAAE,wBAAwB;YAClD,sDAAsD;YACtD,0BAA0B,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,mBAAmB,EACxD,gBAAgB,EAAE,gBAAgB;YAClC,gDAAgD;YAChD,qBAAqB,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,cAAc;YAC9C,kDAAkD;YAClD,8BAA8B,EAAE,8BAA8B;YAC9D,kDAAkD;YAClD,oBAAoB,EAAE,oBAAoB,IAC1C,CACH,CAAC,CAAC,CAAC,CACF,oBAAC,oBAAoB,oBAAK,yBAAyB,EAAI,CACxD,CACF,CAAC,CAAC,CAAC,CACF,yCAAK,CACN,EAEH,sBAAsB,EAAE,KAAK,CAAC,sBAAsB,EACpD,mBAAmB,EAAE,KAAK,CAAC,mBAAmB,EAC9C,QAAQ,EAAE,WAAW,EACrB,YAAY,EAAE,KAAK,CAAC,YAAY,EAChC,cAAc,EAAE,KAAK,CAAC,cAAc;QACpC,kDAAkD;QAClD,sCAAsC,EAAE,iCAAiC;QACzE,kDAAkD;QAClD,4BAA4B,EAAE,uBAAuB;QACrD,kDAAkD;QAClD,oBAAoB,EAAE,oBAAoB,GAC1C,CACH,CAAC;AACJ,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,KAA8C,EAAW,EAAE;IAC1F,oFAAoF;IACpF,4EAA4E;IAC5E,uEAAuE;IACvE,OAAO,KAAK,KAAK,IAAI,IAAI,KAAK,KAAK,KAAK,IAAI,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,iBAAiB,CAAC,IAAI,CAAC;AACtG,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { DiagnosticQuality } from '@azure/communication-calling';\nimport { useId } from '@fluentui/react-hooks';\nimport { _isInCall } from '@internal/calling-component-bindings';\nimport {\n ActiveErrorMessage,\n ErrorBar,\n OnRenderAvatarCallback,\n ParticipantMenuItemsCallback\n} from '@internal/react-components';\n/* @conditional-compile-remove(gallery-layouts) /\nimport { VideoGalleryLayout } from '@internal/react-components';\nimport React from 'react';\n/ @conditional-compile-remove(gallery-layouts) /\nimport { useState } from 'react';\nimport { AvatarPersonaDataCallback } from '../../common/AvatarPersona';\nimport { useLocale } from '../../localization';\nimport { CallCompositeOptions } from '../CallComposite';\nimport { CallArrangement } from '../components/CallArrangement';\nimport { MediaGallery } from '../components/MediaGallery';\nimport { NetworkReconnectTile } from '../components/NetworkReconnectTile';\nimport { useHandlers } from '../hooks/useHandlers';\nimport { usePropsFor } from '../hooks/usePropsFor';\nimport { useSelector } from '../hooks/useSelector';\nimport { callStatusSelector } from '../selectors/callStatusSelector';\nimport { complianceBannerSelector } from '../selectors/complianceBannerSelector';\nimport { mediaGallerySelector } from '../selectors/mediaGallerySelector';\nimport { mutedNotificationSelector } from '../selectors/mutedNotificationSelector';\nimport { networkReconnectTileSelector } from '../selectors/networkReconnectTileSelector';\nimport { reduceCallControlsForMobile } from '../utils';\nimport { MobileChatSidePaneTabHeaderProps } from '../../common/TabHeader';\nimport { SidePaneRenderer } from '../components/SidePane/SidePaneProvider';\n\n/\n @private\n /\nexport interface CallPageProps {\n mobileView: boolean;\n modalLayerHostId: string;\n callInvitationURL?: string;\n onRenderAvatar?: OnRenderAvatarCallback;\n onFetchAvatarPersonaData?: AvatarPersonaDataCallback;\n onFetchParticipantMenuItems?: ParticipantMenuItemsCallback;\n updateSidePaneRenderer: (renderer: SidePaneRenderer \| undefined) => void;\n mobileChatTabHeader?: MobileChatSidePaneTabHeaderProps;\n options?: CallCompositeOptions;\n latestErrors: ActiveErrorMessage[];\n onDismissError: (error: ActiveErrorMessage) => void;\n / @conditional-compile-remove(gallery-layouts) /\n galleryLayout: VideoGalleryLayout;\n}\n\n/\n @private\n /\nexport const CallPage = (props: CallPageProps): JSX.Element => {\n const {\n callInvitationURL,\n onRenderAvatar,\n onFetchAvatarPersonaData,\n onFetchParticipantMenuItems,\n options,\n mobileView,\n / @conditional-compile-remove(gallery-layouts) /\n galleryLayout = 'floatingLocalVideo'\n } = props;\n\n // To use useProps to get these states, we need to create another file wrapping Call,\n // It seems unnecessary in this case, so we get the updated states using this approach.\n const { callStatus } = useSelector(callStatusSelector);\n const mediaGalleryProps = useSelector(mediaGallerySelector);\n const mediaGalleryHandlers = useHandlers(MediaGallery);\n const complianceBannerProps = useSelector(complianceBannerSelector);\n const errorBarProps = usePropsFor(ErrorBar);\n const mutedNotificationProps = useSelector(mutedNotificationSelector);\n const networkReconnectTileProps = useSelector(networkReconnectTileSelector);\n\n const strings = useLocale().strings.call;\n\n // Reduce the controls shown when mobile view is enabled.\n const callControlOptions = mobileView ? reduceCallControlsForMobile(options?.callControls) : options?.callControls;\n\n const drawerMenuHostId = useId('drawerMenuHost');\n\n / @conditional-compile-remove(gallery-layouts) /\n const [userSetOverflowGalleryPosition, setUserSetOverflowGalleryPosition] = useState<'Responsive' \| 'HorizontalTop'>(\n 'Responsive'\n );\n / @conditional-compile-remove(gallery-layouts) /\n const [userSetGalleryLayout, setUserSetGalleryLayout] = useState<VideoGalleryLayout>(galleryLayout);\n\n return (\n <CallArrangement\n id={drawerMenuHostId}\n complianceBannerProps={{ ...complianceBannerProps, strings }}\n errorBarProps={options?.errorBar !== false && errorBarProps}\n mutedNotificationProps={mutedNotificationProps}\n callControlProps={{\n callInvitationURL: callInvitationURL,\n onFetchParticipantMenuItems: onFetchParticipantMenuItems,\n options: callControlOptions,\n increaseFlyoutItemSize: mobileView\n }}\n / @conditional-compile-remove(one-to-n-calling) /\n onFetchAvatarPersonaData={onFetchAvatarPersonaData}\n mobileView={mobileView}\n modalLayerHostId={props.modalLayerHostId}\n onRenderGalleryContent={() =>\n _isInCall(callStatus) ? (\n isNetworkHealthy(networkReconnectTileProps.networkReconnectValue) ? (\n <MediaGallery\n isMobile={mobileView}\n {...mediaGalleryProps}\n {...mediaGalleryHandlers}\n onRenderAvatar={onRenderAvatar}\n onFetchAvatarPersonaData={onFetchAvatarPersonaData}\n / @conditional-compile-remove(pinned-participants) /\n remoteVideoTileMenuOptions={options?.remoteVideoTileMenu}\n drawerMenuHostId={drawerMenuHostId}\n / @conditional-compile-remove(click-to-call) /\n localVideoTileOptions={options?.localVideoTile}\n / @conditional-compile-remove(gallery-layouts) /\n userSetOverflowGalleryPosition={userSetOverflowGalleryPosition}\n / @conditional-compile-remove(gallery-layouts) /\n userSetGalleryLayout={userSetGalleryLayout}\n />\n ) : (\n <NetworkReconnectTile {...networkReconnectTileProps} />\n )\n ) : (\n <></>\n )\n }\n updateSidePaneRenderer={props.updateSidePaneRenderer}\n mobileChatTabHeader={props.mobileChatTabHeader}\n dataUiId={'call-page'}\n latestErrors={props.latestErrors}\n onDismissError={props.onDismissError}\n / @conditional-compile-remove(gallery-layouts) /\n onUserSetOverflowGalleryPositionChange={setUserSetOverflowGalleryPosition}\n / @conditional-compile-remove(gallery-layouts) /\n onUserSetGalleryLayoutChange={setUserSetGalleryLayout}\n / @conditional-compile-remove(gallery-layouts) /\n userSetGalleryLayout={userSetGalleryLayout}\n />\n );\n};\n\n/\n @private\n */\nexport const isNetworkHealthy = (value: DiagnosticQuality \| boolean \| undefined): boolean => {\n // We know that the value is actually of type DiagnosticQuality for this diagnostic.\n // We ignore any boolen values, considering the network to still be healthy.\n // Thus, only DiagnosticQuality.Poor or .Bad indicate network problems.\n return value === true \|\| value === false \|\| value === undefined \|\| value === DiagnosticQuality.Good;\n};\n\"../../../../../calling-component-bindings/src\"\"../../../../../react-components/src\""]}

package/dist/dist-esm/react-composites/src/composites/CallComposite/selectors/baseSelectors.d.ts CHANGED Viewed

@@ -7,6 +7,7 @@ import { CaptionsInfo } from "../../../../../calling-stateful-client/src";
 import { CallAdapterState, CallCompositePage } from '../adapter/CallAdapter';
 import { VideoBackgroundEffect } from '../adapter/CallAdapter';
 import { AdapterErrors } from '../../common/adapters';
+import { RaisedHandState } from "../../../../../calling-stateful-client/src";
 /**
  * @private
  */
@@ -31,6 +32,10 @@ export declare const getDeviceManager: (state: CallAdapterState) => DeviceManage
  * @private
  */
 export declare const getIsScreenShareOn: (state: CallAdapterState) => boolean;
+/**
+ * @private
+ */
+export declare const getLocalParticipantRaisedHand: (state: CallAdapterState) => RaisedHandState | undefined;
 /**
  * @private
  */

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

@@ -25,6 +25,11 @@ export const getDeviceManager = (state) => state.devices;
  * @private
  */
 export const getIsScreenShareOn = (state) => { var _a, _b; return (_b = (_a = state.call) === null || _a === void 0 ? void 0 : _a.isScreenSharingOn) !== null && _b !== void 0 ? _b : false; };
+/* @conditional-compile-remove(raise-hand) */
+/**
+ * @private
+ */
+export const getLocalParticipantRaisedHand = (state) => { var _a; return (_a = state.call) === null || _a === void 0 ? void 0 : _a.raiseHand.localParticipantRaisedHand; };
 /**
  * @private
  */

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

	@@ -1 +1 @@
1	- {"version":3,"file":"baseSelectors.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/selectors/baseSelectors.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { CallState as SDKCallStatus, DominantSpeakersInfo } from '@azure/communication-calling';\nimport { VideoDeviceInfo, AudioDeviceInfo } from '@azure/communication-calling';\n/* @conditional-compile-remove(unsupported-browser) /\nimport { EnvironmentInfo } from '@azure/communication-calling';\n/ @conditional-compile-remove(rooms) /\nimport { ParticipantRole } from '@azure/communication-calling';\nimport {\n CallState,\n DeviceManagerState,\n DiagnosticsCallFeatureState,\n LocalVideoStreamState,\n RemoteParticipantState\n} from '@internal/calling-stateful-client';\n/ @conditional-compile-remove(close-captions) /\nimport { CaptionsInfo } from '@internal/calling-stateful-client';\nimport { CallAdapterState, CallCompositePage } from '../adapter/CallAdapter';\n/ @conditional-compile-remove(video-background-effects) /\nimport { VideoBackgroundEffect } from '../adapter/CallAdapter';\nimport { _isInCall, _isPreviewOn, _dominantSpeakersWithFlatId } from '@internal/calling-component-bindings';\nimport { AdapterErrors } from '../../common/adapters';\n\n/\n @private\n /\nexport const getDisplayName = (state: CallAdapterState): string \| undefined => state.displayName;\n\n/\n @private\n /\nexport const getCallId = (state: CallAdapterState): string \| undefined => state.call?.id;\n\n/\n @private\n /\nexport const getEndedCall = (state: CallAdapterState): CallState \| undefined => state.endedCall;\n\n/\n @private\n /\nexport const getCallStatus = (state: CallAdapterState): SDKCallStatus => state.call?.state ?? 'None';\n\n/\n @private\n /\nexport const getDeviceManager = (state: CallAdapterState): DeviceManagerState => state.devices;\n\n/\n @private\n /\nexport const getIsScreenShareOn = (state: CallAdapterState): boolean => state.call?.isScreenSharingOn ?? false;\n\n/\n @private\n /\nexport const getIsPreviewCameraOn = (state: CallAdapterState): boolean => _isPreviewOn(state.devices);\n\n/\n @private\n /\nexport const getMicrophones = (state: CallAdapterState): AudioDeviceInfo[] => state.devices.microphones;\n\n/\n @private\n /\nexport const getCameras = (state: CallAdapterState): VideoDeviceInfo[] => state.devices.cameras;\n\n/ @conditional-compile-remove(rooms) /\n/\n @private\n /\nexport const getRole = (state: CallAdapterState): ParticipantRole \| undefined => state.call?.role;\n\n/\n @private\n /\nexport const getPage = (state: CallAdapterState): CallCompositePage => state.page;\n\n/ @conditional-compile-remove(call-transfer) /\n/\n @private\n /\nexport const getTransferCall = (state: CallAdapterState): CallState \| undefined => state.acceptedTransferCallState;\n\n/\n @private\n /\nexport const getLocalMicrophoneEnabled = (state: CallAdapterState): boolean => state.isLocalPreviewMicrophoneEnabled;\n\n/\n @private\n /\nexport const getLocalVideoStreams = (state: CallAdapterState): LocalVideoStreamState[] \| undefined =>\n state.call?.localVideoStreams;\n\n/\n @private\n /\nexport const getIsTranscriptionActive = (state: CallAdapterState): boolean =>\n !!state.call?.transcription.isTranscriptionActive;\n\n/\n @private\n /\nexport const getIsRecordingActive = (state: CallAdapterState): boolean => !!state.call?.recording.isRecordingActive;\n\n/\n @private\n /\nexport const getUserFacingDiagnostics = (state: CallAdapterState): DiagnosticsCallFeatureState \| undefined =>\n state.call?.diagnostics;\n\n/\n @private\n /\nexport const getDominantSpeakerInfo = (state: CallAdapterState): undefined \| DominantSpeakersInfo =>\n state.call?.dominantSpeakers;\n\n/\n @private\n /\nexport const getRemoteParticipants = (\n state: CallAdapterState\n):\n \| undefined\n \| {\n [keys: string]: RemoteParticipantState;\n } => state.call?.remoteParticipants;\n\n/ @conditional-compile-remove(unsupported-browser) /\n/\n @private\n /\nexport const getEnvironmentInfo = (state: CallAdapterState): EnvironmentInfo \| undefined => state.environmentInfo;\n\n/ @conditional-compile-remove(video-background-effects) /\n/\n @private\n /\nexport const getSelectedVideoEffect = (state: CallAdapterState): VideoBackgroundEffect \| undefined =>\n state.selectedVideoBackgroundEffect;\n\n/ @conditional-compile-remove(close-captions) /\n/* @private /\nexport const getCaptions = (state: CallAdapterState): CaptionsInfo[] \| undefined => {\n return state.call?.captionsFeature.captions;\n};\n\n/ @conditional-compile-remove(close-captions) /\n/* @private /\nexport const getCaptionsStatus = (state: CallAdapterState): boolean \| undefined => {\n return state.call?.captionsFeature.isCaptionsFeatureActive;\n};\n\n/ @conditional-compile-remove(close-captions) /\n/* @private /\nexport const getCurrentCaptionLanguage = (state: CallAdapterState): string \| undefined => {\n return state.call?.captionsFeature.currentCaptionLanguage;\n};\n\n/ @conditional-compile-remove(close-captions) /\n/* @private /\nexport const getCurrentSpokenLanguage = (state: CallAdapterState): string \| undefined => {\n return state.call?.captionsFeature.currentSpokenLanguage;\n};\n\n/ @conditional-compile-remove(close-captions) /\n/* @private /\nexport const getSupportedCaptionLanguages = (state: CallAdapterState): string[] \| undefined => {\n return state.call?.captionsFeature.supportedCaptionLanguages;\n};\n\n/ @conditional-compile-remove(close-captions) /\n/* @private /\nexport const getSupportedSpokenLanguages = (state: CallAdapterState): string[] \| undefined => {\n return state.call?.captionsFeature.supportedSpokenLanguages;\n};\n\n/ @conditional-compile-remove(close-captions) /\n/\n @private\n /\nexport const getIsTeamsCall = (state: CallAdapterState): boolean => state.isTeamsCall;\n\n/\n @private\n */\nexport const getLatestErrors = (state: CallAdapterState): AdapterErrors => state.latestErrors;\n\"../../../../../calling-stateful-client/src\"\"../../../../../calling-component-bindings/src\""]}
1	+ {"version":3,"file":"baseSelectors.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/selectors/baseSelectors.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAoBlC,OAAO,EAAa,YAAY,EAA+B,sDAA6C;AAI5G;;GAEG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,KAAuB,EAAsB,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC;AAEjG;;GAEG;AACH,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,KAAuB,EAAsB,EAAE,WAAC,OAAA,MAAA,KAAK,CAAC,IAAI,0CAAE,EAAE,CAAA,EAAA,CAAC;AAEzF;;GAEG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,KAAuB,EAAyB,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC;AAEhG;;GAEG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,KAAuB,EAAiB,EAAE,eAAC,OAAA,MAAA,MAAA,KAAK,CAAC,IAAI,0CAAE,KAAK,mCAAI,MAAM,CAAA,EAAA,CAAC;AAErG;;GAEG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,KAAuB,EAAsB,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC;AAE/F;;GAEG;AACH,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,KAAuB,EAAW,EAAE,eAAC,OAAA,MAAA,MAAA,KAAK,CAAC,IAAI,0CAAE,iBAAiB,mCAAI,KAAK,CAAA,EAAA,CAAC;AAE/G,6CAA6C;AAC7C;;GAEG;AACH,MAAM,CAAC,MAAM,6BAA6B,GAAG,CAAC,KAAuB,EAA+B,EAAE,WACpG,OAAA,MAAA,KAAK,CAAC,IAAI,0CAAE,SAAS,CAAC,0BAA0B,CAAA,EAAA,CAAC;AAEnD;;GAEG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,KAAuB,EAAW,EAAE,CAAC,YAAY,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;AAEtG;;GAEG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,KAAuB,EAAqB,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC;AAExG;;GAEG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,KAAuB,EAAqB,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC;AAEhG,wCAAwC;AACxC;;GAEG;AACH,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,KAAuB,EAA+B,EAAE,WAAC,OAAA,MAAA,KAAK,CAAC,IAAI,0CAAE,IAAI,CAAA,EAAA,CAAC;AAElG;;GAEG;AACH,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,KAAuB,EAAqB,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC;AAElF,gDAAgD;AAChD;;GAEG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,KAAuB,EAAyB,EAAE,CAAC,KAAK,CAAC,yBAAyB,CAAC;AAEnH;;GAEG;AACH,MAAM,CAAC,MAAM,yBAAyB,GAAG,CAAC,KAAuB,EAAW,EAAE,CAAC,KAAK,CAAC,+BAA+B,CAAC;AAErH;;GAEG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,KAAuB,EAAuC,EAAE,WACnG,OAAA,MAAA,KAAK,CAAC,IAAI,0CAAE,iBAAiB,CAAA,EAAA,CAAC;AAEhC;;GAEG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAG,CAAC,KAAuB,EAAW,EAAE,WAC3E,OAAA,CAAC,CAAC,CAAA,MAAA,KAAK,CAAC,IAAI,0CAAE,aAAa,CAAC,qBAAqB,CAAA,CAAA,EAAA,CAAC;AAEpD;;GAEG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,KAAuB,EAAW,EAAE,WAAC,OAAA,CAAC,CAAC,CAAA,MAAA,KAAK,CAAC,IAAI,0CAAE,SAAS,CAAC,iBAAiB,CAAA,CAAA,EAAA,CAAC;AAEpH;;GAEG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAG,CAAC,KAAuB,EAA2C,EAAE,WAC3G,OAAA,MAAA,KAAK,CAAC,IAAI,0CAAE,WAAW,CAAA,EAAA,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,KAAuB,EAAoC,EAAE,WAClG,OAAA,MAAA,KAAK,CAAC,IAAI,0CAAE,gBAAgB,CAAA,EAAA,CAAC;AAE/B;;GAEG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAG,CACnC,KAAuB,EAKnB,EAAE,WAAC,OAAA,MAAA,KAAK,CAAC,IAAI,0CAAE,kBAAkB,CAAA,EAAA,CAAC;AAExC,sDAAsD;AACtD;;GAEG;AACH,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,KAAuB,EAA+B,EAAE,CAAC,KAAK,CAAC,eAAe,CAAC;AAElH,2DAA2D;AAC3D;;GAEG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,KAAuB,EAAqC,EAAE,CACnG,KAAK,CAAC,6BAA6B,CAAC;AAEtC,iDAAiD;AACjD,eAAe;AACf,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,KAAuB,EAA8B,EAAE;;IACjF,OAAO,MAAA,KAAK,CAAC,IAAI,0CAAE,eAAe,CAAC,QAAQ,CAAC;AAC9C,CAAC,CAAC;AAEF,iDAAiD;AACjD,eAAe;AACf,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,KAAuB,EAAuB,EAAE;;IAChF,OAAO,MAAA,KAAK,CAAC,IAAI,0CAAE,eAAe,CAAC,uBAAuB,CAAC;AAC7D,CAAC,CAAC;AAEF,iDAAiD;AACjD,eAAe;AACf,MAAM,CAAC,MAAM,yBAAyB,GAAG,CAAC,KAAuB,EAAsB,EAAE;;IACvF,OAAO,MAAA,KAAK,CAAC,IAAI,0CAAE,eAAe,CAAC,sBAAsB,CAAC;AAC5D,CAAC,CAAC;AAEF,iDAAiD;AACjD,eAAe;AACf,MAAM,CAAC,MAAM,wBAAwB,GAAG,CAAC,KAAuB,EAAsB,EAAE;;IACtF,OAAO,MAAA,KAAK,CAAC,IAAI,0CAAE,eAAe,CAAC,qBAAqB,CAAC;AAC3D,CAAC,CAAC;AAEF,iDAAiD;AACjD,eAAe;AACf,MAAM,CAAC,MAAM,4BAA4B,GAAG,CAAC,KAAuB,EAAwB,EAAE;;IAC5F,OAAO,MAAA,KAAK,CAAC,IAAI,0CAAE,eAAe,CAAC,yBAAyB,CAAC;AAC/D,CAAC,CAAC;AAEF,iDAAiD;AACjD,eAAe;AACf,MAAM,CAAC,MAAM,2BAA2B,GAAG,CAAC,KAAuB,EAAwB,EAAE;;IAC3F,OAAO,MAAA,KAAK,CAAC,IAAI,0CAAE,eAAe,CAAC,wBAAwB,CAAC;AAC9D,CAAC,CAAC;AAEF,iDAAiD;AACjD;;GAEG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,KAAuB,EAAW,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC;AAEtF;;GAEG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,KAAuB,EAAiB,EAAE,CAAC,KAAK,CAAC,YAAY,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { CallState as SDKCallStatus, DominantSpeakersInfo } from '@azure/communication-calling';\nimport { VideoDeviceInfo, AudioDeviceInfo } from '@azure/communication-calling';\n/* @conditional-compile-remove(unsupported-browser) /\nimport { EnvironmentInfo } from '@azure/communication-calling';\n/ @conditional-compile-remove(rooms) /\nimport { ParticipantRole } from '@azure/communication-calling';\nimport {\n CallState,\n DeviceManagerState,\n DiagnosticsCallFeatureState,\n LocalVideoStreamState,\n RemoteParticipantState\n} from '@internal/calling-stateful-client';\n/ @conditional-compile-remove(close-captions) /\nimport { CaptionsInfo } from '@internal/calling-stateful-client';\nimport { CallAdapterState, CallCompositePage } from '../adapter/CallAdapter';\n/ @conditional-compile-remove(video-background-effects) /\nimport { VideoBackgroundEffect } from '../adapter/CallAdapter';\nimport { _isInCall, _isPreviewOn, _dominantSpeakersWithFlatId } from '@internal/calling-component-bindings';\nimport { AdapterErrors } from '../../common/adapters';\n/ @conditional-compile-remove(raise-hand) /\nimport { RaisedHandState } from '@internal/calling-stateful-client';\n/\n @private\n /\nexport const getDisplayName = (state: CallAdapterState): string \| undefined => state.displayName;\n\n/\n @private\n /\nexport const getCallId = (state: CallAdapterState): string \| undefined => state.call?.id;\n\n/\n @private\n /\nexport const getEndedCall = (state: CallAdapterState): CallState \| undefined => state.endedCall;\n\n/\n @private\n /\nexport const getCallStatus = (state: CallAdapterState): SDKCallStatus => state.call?.state ?? 'None';\n\n/\n @private\n /\nexport const getDeviceManager = (state: CallAdapterState): DeviceManagerState => state.devices;\n\n/\n @private\n /\nexport const getIsScreenShareOn = (state: CallAdapterState): boolean => state.call?.isScreenSharingOn ?? false;\n\n/ @conditional-compile-remove(raise-hand) /\n/\n @private\n /\nexport const getLocalParticipantRaisedHand = (state: CallAdapterState): RaisedHandState \| undefined =>\n state.call?.raiseHand.localParticipantRaisedHand;\n\n/\n @private\n /\nexport const getIsPreviewCameraOn = (state: CallAdapterState): boolean => _isPreviewOn(state.devices);\n\n/\n @private\n /\nexport const getMicrophones = (state: CallAdapterState): AudioDeviceInfo[] => state.devices.microphones;\n\n/\n @private\n /\nexport const getCameras = (state: CallAdapterState): VideoDeviceInfo[] => state.devices.cameras;\n\n/ @conditional-compile-remove(rooms) /\n/\n @private\n /\nexport const getRole = (state: CallAdapterState): ParticipantRole \| undefined => state.call?.role;\n\n/\n @private\n /\nexport const getPage = (state: CallAdapterState): CallCompositePage => state.page;\n\n/ @conditional-compile-remove(call-transfer) /\n/\n @private\n /\nexport const getTransferCall = (state: CallAdapterState): CallState \| undefined => state.acceptedTransferCallState;\n\n/\n @private\n /\nexport const getLocalMicrophoneEnabled = (state: CallAdapterState): boolean => state.isLocalPreviewMicrophoneEnabled;\n\n/\n @private\n /\nexport const getLocalVideoStreams = (state: CallAdapterState): LocalVideoStreamState[] \| undefined =>\n state.call?.localVideoStreams;\n\n/\n @private\n /\nexport const getIsTranscriptionActive = (state: CallAdapterState): boolean =>\n !!state.call?.transcription.isTranscriptionActive;\n\n/\n @private\n /\nexport const getIsRecordingActive = (state: CallAdapterState): boolean => !!state.call?.recording.isRecordingActive;\n\n/\n @private\n /\nexport const getUserFacingDiagnostics = (state: CallAdapterState): DiagnosticsCallFeatureState \| undefined =>\n state.call?.diagnostics;\n\n/\n @private\n /\nexport const getDominantSpeakerInfo = (state: CallAdapterState): undefined \| DominantSpeakersInfo =>\n state.call?.dominantSpeakers;\n\n/\n @private\n /\nexport const getRemoteParticipants = (\n state: CallAdapterState\n):\n \| undefined\n \| {\n [keys: string]: RemoteParticipantState;\n } => state.call?.remoteParticipants;\n\n/ @conditional-compile-remove(unsupported-browser) /\n/\n @private\n /\nexport const getEnvironmentInfo = (state: CallAdapterState): EnvironmentInfo \| undefined => state.environmentInfo;\n\n/ @conditional-compile-remove(video-background-effects) /\n/\n @private\n /\nexport const getSelectedVideoEffect = (state: CallAdapterState): VideoBackgroundEffect \| undefined =>\n state.selectedVideoBackgroundEffect;\n\n/ @conditional-compile-remove(close-captions) /\n/* @private /\nexport const getCaptions = (state: CallAdapterState): CaptionsInfo[] \| undefined => {\n return state.call?.captionsFeature.captions;\n};\n\n/ @conditional-compile-remove(close-captions) /\n/* @private /\nexport const getCaptionsStatus = (state: CallAdapterState): boolean \| undefined => {\n return state.call?.captionsFeature.isCaptionsFeatureActive;\n};\n\n/ @conditional-compile-remove(close-captions) /\n/* @private /\nexport const getCurrentCaptionLanguage = (state: CallAdapterState): string \| undefined => {\n return state.call?.captionsFeature.currentCaptionLanguage;\n};\n\n/ @conditional-compile-remove(close-captions) /\n/* @private /\nexport const getCurrentSpokenLanguage = (state: CallAdapterState): string \| undefined => {\n return state.call?.captionsFeature.currentSpokenLanguage;\n};\n\n/ @conditional-compile-remove(close-captions) /\n/* @private /\nexport const getSupportedCaptionLanguages = (state: CallAdapterState): string[] \| undefined => {\n return state.call?.captionsFeature.supportedCaptionLanguages;\n};\n\n/ @conditional-compile-remove(close-captions) /\n/* @private /\nexport const getSupportedSpokenLanguages = (state: CallAdapterState): string[] \| undefined => {\n return state.call?.captionsFeature.supportedSpokenLanguages;\n};\n\n/ @conditional-compile-remove(close-captions) /\n/\n @private\n /\nexport const getIsTeamsCall = (state: CallAdapterState): boolean => state.isTeamsCall;\n\n/\n @private\n */\nexport const getLatestErrors = (state: CallAdapterState): AdapterErrors => state.latestErrors;\n\"../../../../../calling-stateful-client/src\"\"../../../../../calling-component-bindings/src\""]}

package/dist/dist-esm/react-composites/src/composites/CallComposite/selectors/localAndRemotePIPSelector.d.ts CHANGED Viewed

@@ -12,6 +12,7 @@ export declare const localAndRemotePIPSelector: reselect.OutputSelector<import("
             renderElement: HTMLElement | undefined;
             activeVideoEffects: import("../../../../../communication-react/src/index").LocalVideoStreamVideoEffectsState | undefined;
         };
+        raisedHand: import("../../../../../communication-react/src/index").RaisedHandState | undefined;
     };
     dominantRemoteParticipant: import("../../../../../communication-react/src/index").VideoGalleryRemoteParticipant | undefined;
 }, (res1: string | undefined, res2: import("../../../../../communication-react/src/index").VideoGalleryRemoteParticipant | undefined, res3: {
@@ -19,7 +20,7 @@ export declare const localAndRemotePIPSelector: reselect.OutputSelector<import("
     isMirrored: boolean | undefined;
     renderElement: HTMLElement | undefined;
     activeVideoEffects: import("../../../../../communication-react/src/index").LocalVideoStreamVideoEffectsState | undefined;
-}) => {
+}, res4: import("../../../../../communication-react/src/index").RaisedHandState | undefined) => {
     localParticipant: {
         displayName: string | undefined;
         videoStream: {
@@ -28,6 +29,7 @@ export declare const localAndRemotePIPSelector: reselect.OutputSelector<import("
             renderElement: HTMLElement | undefined;
             activeVideoEffects: import("../../../../../communication-react/src/index").LocalVideoStreamVideoEffectsState | undefined;
         };
+        raisedHand: import("../../../../../communication-react/src/index").RaisedHandState | undefined;
     };
     dominantRemoteParticipant: import("../../../../../communication-react/src/index").VideoGalleryRemoteParticipant | undefined;
 }>;

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

@@ -4,15 +4,25 @@ import * as reselect from 'reselect';
 import { localVideoSelector } from './localVideoStreamSelector';
 import { dominantRemoteParticipantSelector } from './dominantRemoteParticipantSelector';
 import { getDisplayName } from './baseSelectors';
+/* @conditional-compile-remove(raise-hand) */
+import { getLocalParticipantRaisedHand } from './baseSelectors';
 /**
  * Picture in picture in picture needs to display the most-dominant remote speaker, as well as the local participant video.
  * @private
  */
-export const localAndRemotePIPSelector = reselect.createSelector([getDisplayName, dominantRemoteParticipantSelector, localVideoSelector], (displayName, dominantRemoteParticipant, localVideoStreamInfo) => {
+export const localAndRemotePIPSelector = reselect.createSelector([
+    getDisplayName,
+    dominantRemoteParticipantSelector,
+    localVideoSelector,
+    /* @conditional-compile-remove(raise-hand) */ getLocalParticipantRaisedHand
+], (displayName, dominantRemoteParticipant, localVideoStreamInfo,
+/* @conditional-compile-remove(raise-hand) */ raisedHand) => {
     return {
         localParticipant: {
             displayName,
-            videoStream: localVideoStreamInfo
+            videoStream: localVideoStreamInfo,
+            /* @conditional-compile-remove(raise-hand) */
+            raisedHand: raisedHand
         },
         dominantRemoteParticipant
     };