@azure/communication-react 1.5.1-beta.2 → 1.5.1-beta.4

package/dist/dist-esm/react-composites/src/composites/CallComposite/adapter/index.d.ts

@@ -6,5 +6,6 @@ export type { AzureCommunicationCallAdapterArgs, CallAdapterLocator } from './Az
 export type { AzureCommunicationCallAdapterOptions } from './AzureCommunicationCallAdapter';
 export type { CallParticipantsLocator } from './AzureCommunicationCallAdapter';
 export type { CallAdapter, CommonCallAdapter, CallAdapterCallEndedEvent, CallAdapterCallManagement, CallAdapterCallOperations, CallAdapterClientState, CallAdapterDeviceManagement, CallAdapterState, CallAdapterSubscribers, CallAdapterUiState, CallCompositePage, CallEndedListener, CallIdChangedListener, DiagnosticChangedEventListner, DisplayNameChangedListener, IsLocalScreenSharingActiveChangedListener, IsMutedChangedListener, IsSpeakingChangedListener, MediaDiagnosticChangedEvent, NetworkDiagnosticChangedEvent, ParticipantsJoinedListener, ParticipantsLeftListener } from './CallAdapter';
+export type { CaptionsReceivedListener, IsCaptionsActiveChangedListener } from './CallAdapter';
 export type { TeamsCallAdapter } from './CallAdapter';
 //# sourceMappingURL=index.d.ts.map

package/dist/dist-esm/react-composites/src/composites/CallComposite/adapter/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/adapter/index.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EACL,mCAAmC,EACnC,6CAA6C,EAC7C,gCAAgC,EACjC,MAAM,iCAAiC,CAAC;AAEzC,yDAAyD;AACzD,OAAO,EACL,sBAAsB,EACtB,gCAAgC,EAChC,mBAAmB,EACpB,MAAM,iCAAiC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nexport {\n  createAzureCommunicationCallAdapter,\n  createAzureCommunicationCallAdapterFromClient,\n  useAzureCommunicationCallAdapter\n} from './AzureCommunicationCallAdapter';\n\n/* @conditional-compile-remove(teams-identity-support) */\nexport {\n  createTeamsCallAdapter,\n  createTeamsCallAdapterFromClient,\n  useTeamsCallAdapter\n} from './AzureCommunicationCallAdapter';\n/* @conditional-compile-remove(teams-identity-support) */\nexport type { TeamsCallAdapterArgs, TeamsAdapterOptions } from './AzureCommunicationCallAdapter';\n/* @conditional-compile-remove(teams-identity-support) */\nexport type { OnFetchProfileCallback, Profile } from './OnFetchProfileCallback';\nexport type { AzureCommunicationCallAdapterArgs, CallAdapterLocator } from './AzureCommunicationCallAdapter';\n/* @conditional-compile-remove(rooms) */\nexport type { AzureCommunicationCallAdapterOptions } from './AzureCommunicationCallAdapter';\n\n/* @conditional-compile-remove(teams-adhoc-call) */\nexport type { CallParticipantsLocator } from './AzureCommunicationCallAdapter';\n\nexport type {\n  CallAdapter,\n  CommonCallAdapter,\n  CallAdapterCallEndedEvent,\n  CallAdapterCallManagement,\n  CallAdapterCallOperations,\n  CallAdapterClientState,\n  CallAdapterDeviceManagement,\n  CallAdapterState,\n  CallAdapterSubscribers,\n  CallAdapterUiState,\n  CallCompositePage,\n  CallEndedListener,\n  CallIdChangedListener,\n  DiagnosticChangedEventListner,\n  DisplayNameChangedListener,\n  IsLocalScreenSharingActiveChangedListener,\n  IsMutedChangedListener,\n  IsSpeakingChangedListener,\n  MediaDiagnosticChangedEvent,\n  NetworkDiagnosticChangedEvent,\n  ParticipantsJoinedListener,\n  ParticipantsLeftListener\n} from './CallAdapter';\n\n/* @conditional-compile-remove(teams-identity-support) */\nexport type { TeamsCallAdapter } from './CallAdapter';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/adapter/index.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EACL,mCAAmC,EACnC,6CAA6C,EAC7C,gCAAgC,EACjC,MAAM,iCAAiC,CAAC;AAEzC,yDAAyD;AACzD,OAAO,EACL,sBAAsB,EACtB,gCAAgC,EAChC,mBAAmB,EACpB,MAAM,iCAAiC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nexport {\n  createAzureCommunicationCallAdapter,\n  createAzureCommunicationCallAdapterFromClient,\n  useAzureCommunicationCallAdapter\n} from './AzureCommunicationCallAdapter';\n\n/* @conditional-compile-remove(teams-identity-support) */\nexport {\n  createTeamsCallAdapter,\n  createTeamsCallAdapterFromClient,\n  useTeamsCallAdapter\n} from './AzureCommunicationCallAdapter';\n/* @conditional-compile-remove(teams-identity-support) */\nexport type { TeamsCallAdapterArgs, TeamsAdapterOptions } from './AzureCommunicationCallAdapter';\n/* @conditional-compile-remove(teams-identity-support) */\nexport type { OnFetchProfileCallback, Profile } from './OnFetchProfileCallback';\nexport type { AzureCommunicationCallAdapterArgs, CallAdapterLocator } from './AzureCommunicationCallAdapter';\n/* @conditional-compile-remove(rooms) */\nexport type { AzureCommunicationCallAdapterOptions } from './AzureCommunicationCallAdapter';\n\n/* @conditional-compile-remove(teams-adhoc-call) */\nexport type { CallParticipantsLocator } from './AzureCommunicationCallAdapter';\n\nexport type {\n  CallAdapter,\n  CommonCallAdapter,\n  CallAdapterCallEndedEvent,\n  CallAdapterCallManagement,\n  CallAdapterCallOperations,\n  CallAdapterClientState,\n  CallAdapterDeviceManagement,\n  CallAdapterState,\n  CallAdapterSubscribers,\n  CallAdapterUiState,\n  CallCompositePage,\n  CallEndedListener,\n  CallIdChangedListener,\n  DiagnosticChangedEventListner,\n  DisplayNameChangedListener,\n  IsLocalScreenSharingActiveChangedListener,\n  IsMutedChangedListener,\n  IsSpeakingChangedListener,\n  MediaDiagnosticChangedEvent,\n  NetworkDiagnosticChangedEvent,\n  ParticipantsJoinedListener,\n  ParticipantsLeftListener\n} from './CallAdapter';\n\n/* @conditional-compile-remove(close-captions) */\nexport type { CaptionsReceivedListener, IsCaptionsActiveChangedListener } from './CallAdapter';\n\n/* @conditional-compile-remove(teams-identity-support) */\nexport type { TeamsCallAdapter } from './CallAdapter';\n"]}

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/CallArrangement.js

@@ -1,28 +1,42 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
 import { mergeStyles, Stack } from '@fluentui/react';
+import { _isInLobbyOrConnecting } from "../../../../../calling-component-bindings/src";
 import { _ComplianceBanner, _useContainerHeight, _useContainerWidth, ErrorBar, useTheme } from "../../../../../react-components/src";
 /* @conditional-compile-remove(rooms) */
 import { _usePermissions } from "../../../../../react-components/src";
-import React, { useMemo, useRef } from 'react';
-/* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */
+import React, { useMemo, useRef, useState } from 'react';
 import { useCallback } from 'react';
+/* @conditional-compile-remove(close-captions) */
+import { CaptionsBanner } from '../../common/CaptionsBanner';
 import { containerDivStyles } from '../../common/ContainerRectProps';
 /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */
 import { compositeMinWidthRem } from '../../common/styles/Composite.styles';
 import { useAdapter } from '../adapter/CallAdapterProvider';
 import { CallControls } from '../components/CallControls';
-/* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */
+import { CommonCallControlBar } from '../../common/ControlBar/CommonCallControlBar';
 import { useSidePaneState } from '../hooks/useSidePaneState';
 import { callArrangementContainerStyles, callControlsContainerStyles, notificationsContainerStyles, containerStyleDesktop, containerStyleMobile, mediaGalleryContainerStyles, galleryParentContainerStyles, bannerNotificationStyles } from '../styles/CallPage.styles';
 /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */
 import { CallPane } from './CallPane';
 import { MutedNotification } from './MutedNotification';
+import { useSelector } from '../hooks/useSelector';
+import { callStatusSelector } from '../selectors/callStatusSelector';
+import { PreparedMoreDrawer } from '../../common/Drawer/PreparedMoreDrawer';
+/* @conditional-compile-remove(PSTN-calls) */
+import { SendDtmfDialpad } from '../../common/SendDtmfDialpad';
+/* @conditional-compile-remove(PSTN-calls) */
+import { useCallWithChatCompositeStrings } from '../../CallWithChatComposite/hooks/useCallWithChatCompositeStrings';
+/* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */
+import { getPage } from '../selectors/baseSelectors';
+/* @conditional-compile-remove(close-captions) */
+import { getCallStatus, getIsTeamsCall } from '../selectors/baseSelectors';
+import { drawerContainerStyles } from '../styles/CallComposite.styles';
 /**
  * @private
  */
 export const CallArrangement = (props) => {
-    var _a, _b;
+    var _a, _b, _c, _d, _e;
     const containerClassName = useMemo(() => {
         return props.mobileView ? containerStyleMobile : containerStyleDesktop;
     }, [props.mobileView]);
@@ -31,10 +45,13 @@ export const CallArrangement = (props) => {
     const containerRef = useRef(null);
     const containerWidth = _useContainerWidth(containerRef);
     const containerHeight = _useContainerHeight(containerRef);
-    /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */
+    const isInLobby = _isInLobbyOrConnecting(useSelector(callStatusSelector).callStatus);
+    /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */
+    const isInLocalHold = useSelector(getPage) === 'hold';
     const adapter = useAdapter();
+    const { activePane, closePane, 
     /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */
-    const { activePane, closePane, openPeoplePane, togglePeoplePane } = useSidePaneState();
+    openPeoplePane, togglePeoplePane } = useSidePaneState();
     /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */
     const isMobileWithActivePane = props.mobileView && activePane;
     /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */
@@ -46,6 +63,39 @@ export const CallArrangement = (props) => {
             height: '100%'
         };
     }, [isMobileWithActivePane, props.mobileView]);
+    /* @conditional-compile-remove(PSTN-calls) */
+    const callWithChatStrings = useCallWithChatCompositeStrings();
+    /* @conditional-compile-remove(PSTN-calls) */
+    const dialpadStrings = useMemo(() => ({
+        dialpadModalAriaLabel: callWithChatStrings.dialpadModalAriaLabel,
+        dialpadCloseModalButtonAriaLabel: callWithChatStrings.dialpadCloseModalButtonAriaLabel,
+        placeholderText: callWithChatStrings.dtmfDialpadPlaceholderText
+    }), [callWithChatStrings]);
+    const [showDrawer, setShowDrawer] = useState(false);
+    const onMoreButtonClicked = useCallback(() => {
+        closePane();
+        setShowDrawer(true);
+    }, [closePane]);
+    const closeDrawer = useCallback(() => {
+        setShowDrawer(false);
+    }, []);
+    const onMoreDrawerPeopleClicked = useCallback(() => {
+        setShowDrawer(false);
+        togglePeoplePane();
+    }, [togglePeoplePane]);
+    /* @conditional-compile-remove(PSTN-calls) */
+    const alternateCallerId = useAdapter().getState().alternateCallerId;
+    /* @conditional-compile-remove(PSTN-calls) */
+    const [showDtmfDialpad, setShowDtmfDialpad] = useState(false);
+    /* @conditional-compile-remove(PSTN-calls) */
+    const onDismissDtmfDialpad = () => {
+        setShowDtmfDialpad(false);
+    };
+    /* @conditional-compile-remove(PSTN-calls) */
+    const onClickShowDialpad = () => {
+        setShowDtmfDialpad(true);
+    };
+    const drawerContainerStylesValue = useMemo(() => drawerContainerStyles(10), []);
     // To be removed once feature is out of beta, replace with callCompositeContainerCSS
     // eslint-disable-next-line @typescript-eslint/explicit-function-return-type
     const callCompositeContainerFlex = () => {
@@ -83,26 +133,47 @@ export const CallArrangement = (props) => {
     if (!rolePermissions.cameraButton && props.errorBarProps) {
         errorBarProps = Object.assign(Object.assign({}, props.errorBarProps), { activeErrorMessages: props.errorBarProps.activeErrorMessages.filter((e) => e.type !== 'callCameraAccessDenied' && e.type !== 'callCameraAccessDeniedSafari') });
     }
+    /* @conditional-compile-remove(close-captions) */
+    const isTeamsCall = useSelector(getIsTeamsCall);
+    /* @conditional-compile-remove(close-captions) */
+    const hasJoinedCall = useSelector(getCallStatus) === 'Connected';
     return (React.createElement("div", { ref: containerRef, className: mergeStyles(containerDivStyles), id: props.id },
         React.createElement(Stack, { verticalFill: true, horizontalAlign: "stretch", className: containerClassName, "data-ui-id": props.dataUiId },
             React.createElement(Stack, { grow: true, styles: callArrangementContainerStyles },
-                React.createElement(Stack.Item, { styles: notificationsContainerStyles },
-                    React.createElement(Stack, { styles: bannerNotificationStyles },
-                        React.createElement(_ComplianceBanner, Object.assign({}, props.complianceBannerProps))),
-                    errorBarProps !== false && (React.createElement(Stack, { styles: bannerNotificationStyles },
-                        React.createElement(ErrorBar, Object.assign({}, errorBarProps)))),
-                    canUnmute && !!props.mutedNotificationProps && React.createElement(MutedNotification, Object.assign({}, props.mutedNotificationProps))),
                 ((_b = props.callControlProps) === null || _b === void 0 ? void 0 : _b.options) !== false &&
                     /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */
-                    !isMobileWithActivePane && (React.createElement(Stack.Item, { className: callControlsContainerStyles },
-                    React.createElement(CallControls, Object.assign({}, props.callControlProps, { containerWidth: containerWidth, containerHeight: containerHeight, isMobile: props.mobileView, 
-                        /* @conditional-compile-remove(one-to-n-calling) */
-                        peopleButtonChecked: activePane === 'people', 
-                        /* @conditional-compile-remove(one-to-n-calling) */
-                        onPeopleButtonClicked: togglePeoplePane })))),
+                    !isMobileWithActivePane && (React.createElement(Stack.Item, { className: callControlsContainerStyles }, isLegacyCallControlEnabled((_c = props.callControlProps) === null || _c === void 0 ? void 0 : _c.options) ? (React.createElement(CallControls, Object.assign({}, props.callControlProps, { containerWidth: containerWidth, containerHeight: containerHeight, isMobile: props.mobileView, 
+                    /* @conditional-compile-remove(one-to-n-calling) */
+                    peopleButtonChecked: activePane === 'people', 
+                    /* @conditional-compile-remove(one-to-n-calling) */
+                    onPeopleButtonClicked: togglePeoplePane }))) : (React.createElement(CommonCallControlBar, Object.assign({}, props.callControlProps, { callControls: props.callControlProps.options, callAdapter: adapter, mobileView: props.mobileView, disableButtonsForLobbyPage: isInLobby, peopleButtonChecked: activePane === 'people', onPeopleButtonClicked: togglePeoplePane, onMoreButtonClicked: onMoreButtonClicked, 
+                    /* @conditional-compile-remove(close-captions) */
+                    isCaptionsSupported: isTeamsCall && hasJoinedCall }))))),
+                ((_d = props.callControlProps) === null || _d === void 0 ? void 0 : _d.options) !== false && showDrawer && (React.createElement(Stack, { styles: drawerContainerStylesValue },
+                    React.createElement(PreparedMoreDrawer, { callControls: props.callControlProps.options, onLightDismiss: closeDrawer, onPeopleButtonClicked: onMoreDrawerPeopleClicked, 
+                        /* @conditional-compile-remove(PSTN-calls) */
+                        onClickShowDialpad: alternateCallerId ? onClickShowDialpad : undefined, 
+                        /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */
+                        disableButtonsForHoldScreen: isInLocalHold, 
+                        /* @conditional-compile-remove(close-captions) */
+                        isCaptionsSupported: isTeamsCall && hasJoinedCall }))),
+                /* @conditional-compile-remove(PSTN-calls) */
+                ((_e = props.callControlProps) === null || _e === void 0 ? void 0 : _e.options) !== false && showDtmfDialpad && (React.createElement(Stack, { styles: drawerContainerStylesValue },
+                    React.createElement(SendDtmfDialpad, { isMobile: props.mobileView, strings: dialpadStrings, showDialpad: showDtmfDialpad, onDismissDialpad: onDismissDtmfDialpad }))),
                 React.createElement(Stack, { horizontal: true, grow: true },
                     React.createElement(Stack.Item, { grow: true, style: callCompositeContainerFlex() },
-                        React.createElement(Stack.Item, { styles: callGalleryStyles, grow: true }, props.onRenderGalleryContent && (React.createElement(Stack, { verticalFill: true, styles: mediaGalleryContainerStyles }, props.onRenderGalleryContent())))),
+                        React.createElement(Stack.Item, { styles: callGalleryStyles, grow: true },
+                            React.createElement(Stack, { verticalFill: true, styles: mediaGalleryContainerStyles },
+                                React.createElement(Stack.Item, { styles: notificationsContainerStyles },
+                                    React.createElement(Stack, { styles: bannerNotificationStyles },
+                                        React.createElement(_ComplianceBanner, Object.assign({}, props.complianceBannerProps))),
+                                    errorBarProps !== false && (React.createElement(Stack, { styles: bannerNotificationStyles },
+                                        React.createElement(ErrorBar, Object.assign({}, errorBarProps)))),
+                                    canUnmute && !!props.mutedNotificationProps && (React.createElement(MutedNotification, Object.assign({}, props.mutedNotificationProps)))),
+                                props.onRenderGalleryContent && props.onRenderGalleryContent(),
+                                /* @conditional-compile-remove(close-captions) */
+                                true &&
+                                    /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */ !isInLocalHold && (React.createElement(CaptionsBanner, { isMobile: props.mobileView }))))),
                     /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */
                     callPaneContent())))));
 };
@@ -116,4 +187,9 @@ const showShowPeopleTabHeaderButton = (callControls) => {
     }
     return callControls.participantsButton !== false;
 };
+const isLegacyCallControlEnabled = (options) => {
+    /* @conditional-compile-remove(new-call-control-bar) */
+    return !!options && options !== true && !!(options === null || options === void 0 ? void 0 : options.legacyControlBarExperience);
+    return true;
+};
 //# sourceMappingURL=CallArrangement.js.map

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/CallArrangement.js.map

@@ -1 +1 @@
-{"version":3,"file":"CallArrangement.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/components/CallArrangement.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { mergeStyles, Stack } from '@fluentui/react';\nimport { _isInCall } from '@internal/calling-component-bindings';\nimport {\n  _ComplianceBanner,\n  _ComplianceBannerProps,\n  _useContainerHeight,\n  _useContainerWidth,\n  ErrorBar,\n  ErrorBarProps,\n  useTheme\n} from '@internal/react-components';\n/* @conditional-compile-remove(rooms) */\nimport { _usePermissions } from '@internal/react-components';\nimport React, { useMemo, useRef } from 'react';\n/* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\nimport { useCallback } from 'react';\n/* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\nimport { AvatarPersonaDataCallback } from '../../common/AvatarPersona';\nimport { containerDivStyles } from '../../common/ContainerRectProps';\n/* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\nimport { compositeMinWidthRem } from '../../common/styles/Composite.styles';\nimport { useAdapter } from '../adapter/CallAdapterProvider';\nimport { CallControls, CallControlsProps } from '../components/CallControls';\n/* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\nimport { useSidePaneState } from '../hooks/useSidePaneState';\nimport {\n  callArrangementContainerStyles,\n  callControlsContainerStyles,\n  notificationsContainerStyles,\n  containerStyleDesktop,\n  containerStyleMobile,\n  mediaGalleryContainerStyles,\n  galleryParentContainerStyles,\n  bannerNotificationStyles\n} from '../styles/CallPage.styles';\n/* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\nimport { CallControlOptions } from '../types/CallControlOptions';\n/* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\nimport { CallPane } from './CallPane';\nimport { MutedNotification, MutedNotificationProps } from './MutedNotification';\n\n/**\n * @private\n */\nexport interface CallArrangementProps {\n  id?: string;\n  complianceBannerProps: _ComplianceBannerProps;\n  errorBarProps: ErrorBarProps | false;\n  mutedNotificationProps?: MutedNotificationProps;\n  callControlProps: CallControlsProps;\n  onRenderGalleryContent: () => JSX.Element;\n  dataUiId: string;\n  mobileView: boolean;\n  /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n  modalLayerHostId: string;\n  /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n  onFetchAvatarPersonaData?: AvatarPersonaDataCallback;\n}\n\n/**\n * @private\n */\nexport const CallArrangement = (props: CallArrangementProps): JSX.Element => {\n  const containerClassName = useMemo(() => {\n    return props.mobileView ? containerStyleMobile : containerStyleDesktop;\n  }, [props.mobileView]);\n\n  const theme = useTheme();\n  const callGalleryStyles = useMemo(\n    () => galleryParentContainerStyles(theme.palette.neutralLighterAlt),\n    [theme.palette.neutralLighterAlt]\n  );\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const containerWidth = _useContainerWidth(containerRef);\n  const containerHeight = _useContainerHeight(containerRef);\n\n  /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n  const adapter = useAdapter();\n  /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n  const { activePane, closePane, openPeoplePane, togglePeoplePane } = useSidePaneState();\n\n  /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n  const isMobileWithActivePane = props.mobileView && activePane;\n\n  /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n  const callCompositeContainerCSS = useMemo(() => {\n    return {\n      display: isMobileWithActivePane ? 'none' : 'flex',\n      minWidth: props.mobileView ? 'unset' : `${compositeMinWidthRem}rem`,\n      width: '100%',\n      height: '100%'\n    };\n  }, [isMobileWithActivePane, props.mobileView]);\n\n  // To be removed once feature is out of beta, replace with callCompositeContainerCSS\n  // eslint-disable-next-line @typescript-eslint/explicit-function-return-type\n  const callCompositeContainerFlex = () => {\n    /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n    return callCompositeContainerCSS;\n    return { display: 'flex', width: '100%', height: '100%' };\n  };\n\n  /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n  const callPaneContent = useCallback((): JSX.Element => {\n    if (adapter && activePane === 'people') {\n      return (\n        <CallPane\n          callAdapter={adapter}\n          onClose={closePane}\n          onFetchAvatarPersonaData={props.onFetchAvatarPersonaData}\n          onFetchParticipantMenuItems={props.callControlProps?.onFetchParticipantMenuItems}\n          onPeopleButtonClicked={\n            showShowPeopleTabHeaderButton(props.callControlProps.options) ? openPeoplePane : undefined\n          }\n          callControls={\n            typeof props.callControlProps.options !== 'boolean' ? props.callControlProps.options : undefined\n          }\n          modalLayerHostId={props.modalLayerHostId}\n          activePane={activePane}\n          mobileView={props.mobileView}\n          inviteLink={props.callControlProps.callInvitationURL}\n        />\n      );\n    }\n    return <></>;\n  }, [\n    activePane,\n    adapter,\n    closePane,\n    props.callControlProps.callInvitationURL,\n    props.callControlProps?.onFetchParticipantMenuItems,\n    props.callControlProps.options,\n    props.mobileView,\n    props.modalLayerHostId,\n    props.onFetchAvatarPersonaData,\n    openPeoplePane\n  ]);\n\n  /* @conditional-compile-remove(rooms) */\n  const rolePermissions = _usePermissions();\n\n  let canUnmute = true;\n  /* @conditional-compile-remove(rooms) */\n  canUnmute = rolePermissions.microphoneButton;\n\n  let errorBarProps = props.errorBarProps;\n\n  /* @conditional-compile-remove(rooms) */\n  // TODO: move this logic to the error bar selector once role is plumbed from the headless SDK\n  if (!rolePermissions.cameraButton && props.errorBarProps) {\n    errorBarProps = {\n      ...props.errorBarProps,\n      activeErrorMessages: props.errorBarProps.activeErrorMessages.filter(\n        (e) => e.type !== 'callCameraAccessDenied' && e.type !== 'callCameraAccessDeniedSafari'\n      )\n    };\n  }\n\n  return (\n    <div ref={containerRef} className={mergeStyles(containerDivStyles)} id={props.id}>\n      <Stack verticalFill horizontalAlign=\"stretch\" className={containerClassName} data-ui-id={props.dataUiId}>\n        <Stack grow styles={callArrangementContainerStyles}>\n          <Stack.Item styles={notificationsContainerStyles}>\n            <Stack styles={bannerNotificationStyles}>\n              <_ComplianceBanner {...props.complianceBannerProps} />\n            </Stack>\n            {errorBarProps !== false && (\n              <Stack styles={bannerNotificationStyles}>\n                <ErrorBar {...errorBarProps} />\n              </Stack>\n            )}\n            {canUnmute && !!props.mutedNotificationProps && <MutedNotification {...props.mutedNotificationProps} />}\n          </Stack.Item>\n          {props.callControlProps?.options !== false &&\n            /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n            !isMobileWithActivePane && (\n              <Stack.Item className={callControlsContainerStyles}>\n                <CallControls\n                  {...props.callControlProps}\n                  containerWidth={containerWidth}\n                  containerHeight={containerHeight}\n                  isMobile={props.mobileView}\n                  /* @conditional-compile-remove(one-to-n-calling) */\n                  peopleButtonChecked={activePane === 'people'}\n                  /* @conditional-compile-remove(one-to-n-calling) */\n                  onPeopleButtonClicked={togglePeoplePane}\n                />\n              </Stack.Item>\n            )}\n          <Stack horizontal grow>\n            <Stack.Item grow style={callCompositeContainerFlex()}>\n              <Stack.Item styles={callGalleryStyles} grow>\n                {props.onRenderGalleryContent && (\n                  <Stack verticalFill styles={mediaGalleryContainerStyles}>\n                    {props.onRenderGalleryContent()}\n                  </Stack>\n                )}\n              </Stack.Item>\n            </Stack.Item>\n            {\n              /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n              callPaneContent()\n            }\n          </Stack>\n        </Stack>\n      </Stack>\n    </div>\n  );\n};\n\n/* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\nconst showShowPeopleTabHeaderButton = (callControls?: boolean | CallControlOptions): boolean => {\n  if (callControls === undefined || callControls === true) {\n    return true;\n  }\n  if (callControls === false) {\n    return false;\n  }\n  return callControls.participantsButton !== false;\n};\n\"../../../../../calling-component-bindings/src\"\"../../../../../react-components/src\""]}
+{"version":3,"file":"CallArrangement.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/components/CallArrangement.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { mergeStyles, Stack } from '@fluentui/react';\nimport { _isInCall, _isInLobbyOrConnecting } from '@internal/calling-component-bindings';\nimport {\n  _ComplianceBanner,\n  _ComplianceBannerProps,\n  _useContainerHeight,\n  _useContainerWidth,\n  ErrorBar,\n  ErrorBarProps,\n  useTheme\n} from '@internal/react-components';\n/* @conditional-compile-remove(rooms) */\nimport { _usePermissions } from '@internal/react-components';\nimport React, { useMemo, useRef, useState } from 'react';\nimport { useCallback } from 'react';\n/* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\nimport { AvatarPersonaDataCallback } from '../../common/AvatarPersona';\n/* @conditional-compile-remove(close-captions) */\nimport { CaptionsBanner } from '../../common/CaptionsBanner';\nimport { containerDivStyles } from '../../common/ContainerRectProps';\n/* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\nimport { compositeMinWidthRem } from '../../common/styles/Composite.styles';\nimport { useAdapter } from '../adapter/CallAdapterProvider';\nimport { CallControls, CallControlsProps } from '../components/CallControls';\nimport { CommonCallControlBar } from '../../common/ControlBar/CommonCallControlBar';\nimport { useSidePaneState } from '../hooks/useSidePaneState';\nimport {\n  callArrangementContainerStyles,\n  callControlsContainerStyles,\n  notificationsContainerStyles,\n  containerStyleDesktop,\n  containerStyleMobile,\n  mediaGalleryContainerStyles,\n  galleryParentContainerStyles,\n  bannerNotificationStyles\n} from '../styles/CallPage.styles';\n/* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\nimport { CommonCallControlOptions } from '../../common/types/CommonCallControlOptions';\n/* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\nimport { CallPane } from './CallPane';\nimport { MutedNotification, MutedNotificationProps } from './MutedNotification';\nimport { CallAdapter } from '../adapter';\nimport { useSelector } from '../hooks/useSelector';\nimport { callStatusSelector } from '../selectors/callStatusSelector';\nimport { CallControlOptions } from '../types/CallControlOptions';\nimport { PreparedMoreDrawer } from '../../common/Drawer/PreparedMoreDrawer';\n/* @conditional-compile-remove(PSTN-calls) */\nimport { SendDtmfDialpad } from '../../common/SendDtmfDialpad';\n/* @conditional-compile-remove(PSTN-calls) */\nimport { useCallWithChatCompositeStrings } from '../../CallWithChatComposite/hooks/useCallWithChatCompositeStrings';\n/* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\nimport { getPage } from '../selectors/baseSelectors';\n/* @conditional-compile-remove(close-captions) */\nimport { getCallStatus, getIsTeamsCall } from '../selectors/baseSelectors';\nimport { drawerContainerStyles } from '../styles/CallComposite.styles';\n\n/**\n * @private\n */\nexport interface CallArrangementProps {\n  id?: string;\n  complianceBannerProps: _ComplianceBannerProps;\n  errorBarProps: ErrorBarProps | false;\n  mutedNotificationProps?: MutedNotificationProps;\n  callControlProps: CallControlsProps;\n  onRenderGalleryContent: () => JSX.Element;\n  dataUiId: string;\n  mobileView: boolean;\n  /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n  modalLayerHostId: string;\n  /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n  onFetchAvatarPersonaData?: AvatarPersonaDataCallback;\n}\n\n/**\n * @private\n */\nexport const CallArrangement = (props: CallArrangementProps): JSX.Element => {\n  const containerClassName = useMemo(() => {\n    return props.mobileView ? containerStyleMobile : containerStyleDesktop;\n  }, [props.mobileView]);\n\n  const theme = useTheme();\n  const callGalleryStyles = useMemo(\n    () => galleryParentContainerStyles(theme.palette.neutralLighterAlt),\n    [theme.palette.neutralLighterAlt]\n  );\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const containerWidth = _useContainerWidth(containerRef);\n  const containerHeight = _useContainerHeight(containerRef);\n\n  const isInLobby = _isInLobbyOrConnecting(useSelector(callStatusSelector).callStatus);\n\n  /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n  const isInLocalHold = useSelector(getPage) === 'hold';\n\n  const adapter = useAdapter();\n\n  const {\n    activePane,\n    closePane,\n    /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n    openPeoplePane,\n    togglePeoplePane\n  } = useSidePaneState();\n\n  /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n  const isMobileWithActivePane = props.mobileView && activePane;\n\n  /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n  const callCompositeContainerCSS = useMemo(() => {\n    return {\n      display: isMobileWithActivePane ? 'none' : 'flex',\n      minWidth: props.mobileView ? 'unset' : `${compositeMinWidthRem}rem`,\n      width: '100%',\n      height: '100%'\n    };\n  }, [isMobileWithActivePane, props.mobileView]);\n\n  /* @conditional-compile-remove(PSTN-calls) */\n  const callWithChatStrings = useCallWithChatCompositeStrings();\n\n  /* @conditional-compile-remove(PSTN-calls) */\n  const dialpadStrings = useMemo(\n    () => ({\n      dialpadModalAriaLabel: callWithChatStrings.dialpadModalAriaLabel,\n      dialpadCloseModalButtonAriaLabel: callWithChatStrings.dialpadCloseModalButtonAriaLabel,\n      placeholderText: callWithChatStrings.dtmfDialpadPlaceholderText\n    }),\n    [callWithChatStrings]\n  );\n\n  const [showDrawer, setShowDrawer] = useState(false);\n  const onMoreButtonClicked = useCallback(() => {\n    closePane();\n    setShowDrawer(true);\n  }, [closePane]);\n  const closeDrawer = useCallback(() => {\n    setShowDrawer(false);\n  }, []);\n  const onMoreDrawerPeopleClicked = useCallback(() => {\n    setShowDrawer(false);\n    togglePeoplePane();\n  }, [togglePeoplePane]);\n\n  /* @conditional-compile-remove(PSTN-calls) */\n  const alternateCallerId = useAdapter().getState().alternateCallerId;\n\n  /* @conditional-compile-remove(PSTN-calls) */\n  const [showDtmfDialpad, setShowDtmfDialpad] = useState(false);\n\n  /* @conditional-compile-remove(PSTN-calls) */\n  const onDismissDtmfDialpad = (): void => {\n    setShowDtmfDialpad(false);\n  };\n\n  /* @conditional-compile-remove(PSTN-calls) */\n  const onClickShowDialpad = (): void => {\n    setShowDtmfDialpad(true);\n  };\n\n  const drawerContainerStylesValue = useMemo(() => drawerContainerStyles(10), []);\n\n  // To be removed once feature is out of beta, replace with callCompositeContainerCSS\n  // eslint-disable-next-line @typescript-eslint/explicit-function-return-type\n  const callCompositeContainerFlex = () => {\n    /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n    return callCompositeContainerCSS;\n    return { display: 'flex', width: '100%', height: '100%' };\n  };\n\n  /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n  const callPaneContent = useCallback((): JSX.Element => {\n    if (adapter && activePane === 'people') {\n      return (\n        <CallPane\n          callAdapter={adapter}\n          onClose={closePane}\n          onFetchAvatarPersonaData={props.onFetchAvatarPersonaData}\n          onFetchParticipantMenuItems={props.callControlProps?.onFetchParticipantMenuItems}\n          onPeopleButtonClicked={\n            showShowPeopleTabHeaderButton(props.callControlProps.options) ? openPeoplePane : undefined\n          }\n          callControls={\n            typeof props.callControlProps.options !== 'boolean' ? props.callControlProps.options : undefined\n          }\n          modalLayerHostId={props.modalLayerHostId}\n          activePane={activePane}\n          mobileView={props.mobileView}\n          inviteLink={props.callControlProps.callInvitationURL}\n        />\n      );\n    }\n    return <></>;\n  }, [\n    activePane,\n    adapter,\n    closePane,\n    props.callControlProps.callInvitationURL,\n    props.callControlProps?.onFetchParticipantMenuItems,\n    props.callControlProps.options,\n    props.mobileView,\n    props.modalLayerHostId,\n    props.onFetchAvatarPersonaData,\n    openPeoplePane\n  ]);\n\n  /* @conditional-compile-remove(rooms) */\n  const rolePermissions = _usePermissions();\n\n  let canUnmute = true;\n  /* @conditional-compile-remove(rooms) */\n  canUnmute = rolePermissions.microphoneButton;\n\n  let errorBarProps = props.errorBarProps;\n\n  /* @conditional-compile-remove(rooms) */\n  // TODO: move this logic to the error bar selector once role is plumbed from the headless SDK\n  if (!rolePermissions.cameraButton && props.errorBarProps) {\n    errorBarProps = {\n      ...props.errorBarProps,\n      activeErrorMessages: props.errorBarProps.activeErrorMessages.filter(\n        (e) => e.type !== 'callCameraAccessDenied' && e.type !== 'callCameraAccessDeniedSafari'\n      )\n    };\n  }\n  /* @conditional-compile-remove(close-captions) */\n  const isTeamsCall = useSelector(getIsTeamsCall);\n  /* @conditional-compile-remove(close-captions) */\n  const hasJoinedCall = useSelector(getCallStatus) === 'Connected';\n\n  return (\n    <div ref={containerRef} className={mergeStyles(containerDivStyles)} id={props.id}>\n      <Stack verticalFill horizontalAlign=\"stretch\" className={containerClassName} data-ui-id={props.dataUiId}>\n        <Stack grow styles={callArrangementContainerStyles}>\n          {props.callControlProps?.options !== false &&\n            /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n            !isMobileWithActivePane && (\n              <Stack.Item className={callControlsContainerStyles}>\n                {isLegacyCallControlEnabled(props.callControlProps?.options) ? (\n                  <CallControls\n                    {...props.callControlProps}\n                    containerWidth={containerWidth}\n                    containerHeight={containerHeight}\n                    isMobile={props.mobileView}\n                    /* @conditional-compile-remove(one-to-n-calling) */\n                    peopleButtonChecked={activePane === 'people'}\n                    /* @conditional-compile-remove(one-to-n-calling) */\n                    onPeopleButtonClicked={togglePeoplePane}\n                  />\n                ) : (\n                  <CommonCallControlBar\n                    {...props.callControlProps}\n                    callControls={props.callControlProps.options}\n                    callAdapter={adapter as CallAdapter}\n                    mobileView={props.mobileView}\n                    disableButtonsForLobbyPage={isInLobby}\n                    peopleButtonChecked={activePane === 'people'}\n                    onPeopleButtonClicked={togglePeoplePane}\n                    onMoreButtonClicked={onMoreButtonClicked}\n                    /* @conditional-compile-remove(close-captions) */\n                    isCaptionsSupported={isTeamsCall && hasJoinedCall}\n                  />\n                )}\n              </Stack.Item>\n            )}\n          {props.callControlProps?.options !== false && showDrawer && (\n            <Stack styles={drawerContainerStylesValue}>\n              <PreparedMoreDrawer\n                callControls={props.callControlProps.options}\n                onLightDismiss={closeDrawer}\n                onPeopleButtonClicked={onMoreDrawerPeopleClicked}\n                /* @conditional-compile-remove(PSTN-calls) */\n                onClickShowDialpad={alternateCallerId ? onClickShowDialpad : undefined}\n                /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n                disableButtonsForHoldScreen={isInLocalHold}\n                /* @conditional-compile-remove(close-captions) */\n                isCaptionsSupported={isTeamsCall && hasJoinedCall}\n              />\n            </Stack>\n          )}\n\n          {\n            /* @conditional-compile-remove(PSTN-calls) */\n            props.callControlProps?.options !== false && showDtmfDialpad && (\n              <Stack styles={drawerContainerStylesValue}>\n                <SendDtmfDialpad\n                  isMobile={props.mobileView}\n                  strings={dialpadStrings}\n                  showDialpad={showDtmfDialpad}\n                  onDismissDialpad={onDismissDtmfDialpad}\n                />\n              </Stack>\n            )\n          }\n          <Stack horizontal grow>\n            <Stack.Item grow style={callCompositeContainerFlex()}>\n              <Stack.Item styles={callGalleryStyles} grow>\n                <Stack verticalFill styles={mediaGalleryContainerStyles}>\n                  <Stack.Item styles={notificationsContainerStyles}>\n                    <Stack styles={bannerNotificationStyles}>\n                      <_ComplianceBanner {...props.complianceBannerProps} />\n                    </Stack>\n                    {errorBarProps !== false && (\n                      <Stack styles={bannerNotificationStyles}>\n                        <ErrorBar {...errorBarProps} />\n                      </Stack>\n                    )}\n                    {canUnmute && !!props.mutedNotificationProps && (\n                      <MutedNotification {...props.mutedNotificationProps} />\n                    )}\n                  </Stack.Item>\n                  {props.onRenderGalleryContent && props.onRenderGalleryContent()}\n                  {\n                    /* @conditional-compile-remove(close-captions) */\n                    true &&\n                      /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */ !isInLocalHold && (\n                        <CaptionsBanner isMobile={props.mobileView} />\n                      )\n                  }\n                </Stack>\n              </Stack.Item>\n            </Stack.Item>\n            {\n              /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n              callPaneContent()\n            }\n          </Stack>\n        </Stack>\n      </Stack>\n    </div>\n  );\n};\n\n/* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\nconst showShowPeopleTabHeaderButton = (callControls?: boolean | CommonCallControlOptions): boolean => {\n  if (callControls === undefined || callControls === true) {\n    return true;\n  }\n  if (callControls === false) {\n    return false;\n  }\n  return callControls.participantsButton !== false;\n};\n\nconst isLegacyCallControlEnabled = (options?: boolean | CallControlOptions): boolean => {\n  /* @conditional-compile-remove(new-call-control-bar) */\n  return !!options && options !== true && !!options?.legacyControlBarExperience;\n  return true;\n};\n\"../../../../../calling-component-bindings/src\"\"../../../../../react-components/src\""]}

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/CallControls.js

@@ -153,7 +153,7 @@ export const CallControls = (props) => {
                 React.createElement(People, { checked: props.peopleButtonChecked, ariaLabel: peopleButtonStrings === null || peopleButtonStrings === void 0 ? void 0 : peopleButtonStrings.label, showLabel: (options === null || options === void 0 ? void 0 : options.displayType) !== 'compact', onClick: props.onPeopleButtonClicked, "data-ui-id": "call-composite-people-button", strings: peopleButtonStrings, disabled: isDisabled(options === null || options === void 0 ? void 0 : options.participantsButton) })),
                 isEnabled(options === null || options === void 0 ? void 0 : options.devicesButton) && (React.createElement(Devices, { displayType: options === null || options === void 0 ? void 0 : options.displayType, increaseFlyoutItemSize: props.increaseFlyoutItemSize, disabled: isDisabled(options === null || options === void 0 ? void 0 : options.devicesButton) })),
                 /* @conditional-compile-remove(one-to-n-calling) */ /* @conditional-compile-remove(PSTN-calls) */
-                isEnabled(options === null || options === void 0 ? void 0 : options.moreButton) && moreButtonContextualMenuItems().length > 0 && (React.createElement(MoreButton, { strings: moreButtonStrings, menuIconProps: { hidden: true }, menuProps: { items: moreButtonContextualMenuItems() }, showLabel: (options === null || options === void 0 ? void 0 : options.displayType) !== 'compact' })),
+                isEnabled(options === null || options === void 0 ? void 0 : options.moreButton) && moreButtonContextualMenuItems().length > 0 && (React.createElement(MoreButton, { "data-ui-id": "common-call-composite-more-button", strings: moreButtonStrings, menuIconProps: { hidden: true }, menuProps: { items: moreButtonContextualMenuItems() }, showLabel: (options === null || options === void 0 ? void 0 : options.displayType) !== 'compact' })),
                 customButtons['primary'],
                 isEnabled(options === null || options === void 0 ? void 0 : options.endCallButton) && React.createElement(EndCall, { displayType: options === null || options === void 0 ? void 0 : options.displayType })))));
 };

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/CallControls.js.map

@@ -1 +1 @@
-{"version":3,"file":"CallControls.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/components/CallControls.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { memoizeFunction, Stack, useTheme } from '@fluentui/react';\n/* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\nimport { IContextualMenuItem } from '@fluentui/react';\n/* @conditional-compile-remove(PSTN-calls) */\nimport { useState } from 'react';\nimport { _isInLobbyOrConnecting } from '@internal/calling-component-bindings';\nimport { ControlBar, ParticipantMenuItemsCallback } from '@internal/react-components';\n/* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\nimport { HoldButton } from '@internal/react-components';\n/* @conditional-compile-remove(rooms) */\nimport { _usePermissions } from '@internal/react-components';\nimport React, { useMemo } from 'react';\nimport { CallControlOptions } from '../types/CallControlOptions';\nimport { Camera } from './buttons/Camera';\n/* @conditional-compile-remove(control-bar-button-injection) */\nimport { generateCustomControlBarButtons, onFetchCustomButtonPropsTrampoline } from './buttons/Custom';\nimport { Devices } from './buttons/Devices';\nimport { EndCall } from './buttons/EndCall';\nimport { Microphone } from './buttons/Microphone';\nimport { Participants } from './buttons/Participants';\nimport { ScreenShare } from './buttons/ScreenShare';\nimport { ContainerRectProps } from '../../common/ContainerRectProps';\n/* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\nimport { People } from './buttons/People';\n/* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\nimport { useLocale } from '../../localization';\n/* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\nimport { MoreButton } from '../../common/MoreButton';\n/* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\nimport { usePropsFor } from '../hooks/usePropsFor';\n/* @conditional-compile-remove(one-to-n-calling) */\nimport { buttonFlyoutIncreasedSizeStyles } from '../styles/Buttons.styles';\n/* @conditional-compile-remove(PSTN-calls) */\nimport { SendDtmfDialpad } from '../../common/SendDtmfDialpad';\n/* @conditional-compile-remove(PSTN-calls) */\nimport { useAdapter } from '../adapter/CallAdapterProvider';\nimport { isDisabled } from '../utils';\n\n/**\n * @private\n */\nexport type CallControlsProps = {\n  /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n  peopleButtonChecked?: boolean;\n  /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n  onPeopleButtonClicked?: () => void;\n  callInvitationURL?: string;\n  onFetchParticipantMenuItems?: ParticipantMenuItemsCallback;\n  options?: boolean | CallControlOptions;\n  /**\n   * Option to increase the height of the button flyout menu items from 36px to 48px.\n   * Recommended for mobile devices.\n   */\n  increaseFlyoutItemSize?: boolean;\n  isMobile?: boolean;\n};\n\n// Enforce a background color on control bar to ensure it matches the composite background color.\nconst controlBarStyles = memoizeFunction((background: string) => ({ root: { background: background } }));\n\n/**\n * @private\n */\nexport const CallControls = (props: CallControlsProps & ContainerRectProps): JSX.Element => {\n  const options = useMemo(() => (typeof props.options === 'boolean' ? {} : props.options), [props.options]);\n\n  /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n  const localeStrings = useLocale();\n\n  /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n  const peopleButtonStrings = useMemo(\n    () => ({\n      label: localeStrings.strings.call.peopleButtonLabel,\n      tooltipOffContent: localeStrings.strings.call.peopleButtonTooltipOpen,\n      tooltipOnContent: localeStrings.strings.call.peopleButtonTooltipClose\n    }),\n    [localeStrings]\n  );\n\n  /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n  const moreButtonStrings = useMemo(\n    () => ({\n      label: localeStrings.strings.call.moreButtonCallingLabel,\n      tooltipOffContent: localeStrings.strings.callWithChat.moreDrawerButtonTooltip\n    }),\n    [localeStrings]\n  );\n\n  /* @conditional-compile-remove(PSTN-calls) */\n  const dialpadStrings = useMemo(\n    () => ({\n      dialpadModalAriaLabel: localeStrings.strings.call.dialpadModalAriaLabel,\n      dialpadCloseModalButtonAriaLabel: localeStrings.strings.call.dialpadCloseModalButtonAriaLabel,\n      placeholderText: localeStrings.strings.call.dtmfDialpadPlaceholderText\n    }),\n    [localeStrings]\n  );\n\n  /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n  const holdButtonProps = usePropsFor(HoldButton);\n\n  /* @conditional-compile-remove(PSTN-calls) */\n  const alternateCallerId = useAdapter().getState().alternateCallerId;\n\n  /* @conditional-compile-remove(one-to-n-calling) */ /* @conditional-compile-remove(PSTN-calls) */\n  const moreButtonContextualMenuItems = (): IContextualMenuItem[] => {\n    const items: IContextualMenuItem[] = [];\n\n    if (props.isMobile && props.onPeopleButtonClicked && isEnabled(options?.participantsButton)) {\n      items.push({\n        key: 'peopleButtonKey',\n        text: localeStrings.component.strings.participantsButton.label,\n        onClick: () => {\n          if (props.onPeopleButtonClicked) {\n            props.onPeopleButtonClicked();\n          }\n        },\n        iconProps: { iconName: 'ControlButtonParticipantsContextualMenuItem', styles: { root: { lineHeight: 0 } } },\n        itemProps: {\n          styles: buttonFlyoutIncreasedSizeStyles\n        },\n        disabled: isDisabled(options?.participantsButton),\n        ['data-ui-id']: 'call-composite-more-menu-people-button'\n      });\n    }\n\n    if (!isRoomsCallTrampoline()) {\n      items.push({\n        key: 'holdButtonKey',\n        text: localeStrings.component.strings.holdButton.tooltipOffContent,\n        onClick: () => {\n          holdButtonProps.onToggleHold();\n        },\n        iconProps: { iconName: 'HoldCallContextualMenuItem', styles: { root: { lineHeight: 0 } } },\n        itemProps: {\n          styles: buttonFlyoutIncreasedSizeStyles\n        },\n        disabled: isDisabled(options?.holdButton),\n        ['data-ui-id']: 'hold-button'\n      });\n    }\n\n    /* @conditional-compile-remove(PSTN-calls) */\n    // dtmf tone sending only works for 1:1 PSTN call\n    if (alternateCallerId) {\n      items.push({\n        key: 'showDialpadKey',\n        text: localeStrings.strings.call.openDtmfDialpadLabel,\n        onClick: () => {\n          setShowDialpad(true);\n        },\n        iconProps: { iconName: 'PeoplePaneOpenDialpad', styles: { root: { lineHeight: 0 } } },\n        itemProps: {\n          styles: buttonFlyoutIncreasedSizeStyles\n        }\n      });\n    }\n\n    return items;\n  };\n\n  /* @conditional-compile-remove(PSTN-calls) */\n  const [showDialpad, setShowDialpad] = useState(false);\n\n  const theme = useTheme();\n\n  /* @conditional-compile-remove(control-bar-button-injection) */\n  const customButtons = useMemo(\n    () => generateCustomControlBarButtons(onFetchCustomButtonPropsTrampoline(options), options?.displayType),\n    [options]\n  );\n\n  // when props.options is false then we want to hide the whole control bar.\n  if (props.options === false) {\n    return <></>;\n  }\n\n  /* @conditional-compile-remove(PSTN-calls) */\n  const onDismissDialpad = (): void => {\n    setShowDialpad(false);\n  };\n\n  /* @conditional-compile-remove(rooms) */\n  const rolePermissions = _usePermissions();\n\n  let screenShareButtonIsEnabled = isEnabled(options?.screenShareButton);\n  /* @conditional-compile-remove(rooms) */\n  screenShareButtonIsEnabled = rolePermissions.screenShare && screenShareButtonIsEnabled;\n\n  let microphoneButtonIsEnabled = isEnabled(options?.microphoneButton);\n  /* @conditional-compile-remove(rooms) */\n  microphoneButtonIsEnabled = rolePermissions.microphoneButton && microphoneButtonIsEnabled;\n\n  let cameraButtonIsEnabled = isEnabled(options?.cameraButton);\n  /* @conditional-compile-remove(rooms) */\n  cameraButtonIsEnabled = rolePermissions.cameraButton && cameraButtonIsEnabled;\n\n  return (\n    <Stack horizontalAlign=\"center\">\n      {\n        /* @conditional-compile-remove(PSTN-calls) */\n        <SendDtmfDialpad\n          isMobile={!!props.isMobile}\n          strings={dialpadStrings}\n          showDialpad={showDialpad}\n          onDismissDialpad={onDismissDialpad}\n        />\n      }\n      <Stack.Item>\n        {/*\n            Note: We use the layout=\"horizontal\" instead of dockedBottom because of how we position the\n            control bar. The control bar exists in a Stack below the MediaGallery. The MediaGallery is\n            set to grow and fill the remaining space not taken up by the ControlBar. If we were to use\n            dockedBottom it has position absolute and would therefore float on top of the media gallery,\n            occluding some of its content.\n         */}\n        <ControlBar layout=\"horizontal\" styles={controlBarStyles(theme.semanticColors.bodyBackground)}>\n          {microphoneButtonIsEnabled && (\n            <Microphone displayType={options?.displayType} disabled={isDisabled(options?.microphoneButton)} />\n          )}\n          {cameraButtonIsEnabled && (\n            <Camera displayType={options?.displayType} disabled={isDisabled(options?.cameraButton)} />\n          )}\n          {screenShareButtonIsEnabled && (\n            <ScreenShare\n              option={options?.screenShareButton}\n              displayType={options?.displayType}\n              disabled={isDisabled(options?.screenShareButton)}\n            />\n          )}\n          {isEnabled(options?.participantsButton) &&\n            /* @conditional-compile-remove(one-to-n-calling) */ /* @conditional-compile-remove(PSTN-calls) */\n            !props.isMobile && (\n              <Participants\n                option={options?.participantsButton}\n                callInvitationURL={props.callInvitationURL}\n                onFetchParticipantMenuItems={props.onFetchParticipantMenuItems}\n                displayType={options?.displayType}\n                increaseFlyoutItemSize={props.increaseFlyoutItemSize}\n                isMobile={props.isMobile}\n                disabled={isDisabled(options?.participantsButton)}\n              />\n            ) && (\n              /* @conditional-compile-remove(one-to-n-calling) */ /* @conditional-compile-remove(PSTN-calls) */\n              <People\n                checked={props.peopleButtonChecked}\n                ariaLabel={peopleButtonStrings?.label}\n                showLabel={options?.displayType !== 'compact'}\n                onClick={props.onPeopleButtonClicked}\n                data-ui-id=\"call-composite-people-button\"\n                strings={peopleButtonStrings}\n                disabled={isDisabled(options?.participantsButton)}\n              />\n            )}\n          {isEnabled(options?.devicesButton) && (\n            <Devices\n              displayType={options?.displayType}\n              increaseFlyoutItemSize={props.increaseFlyoutItemSize}\n              disabled={isDisabled(options?.devicesButton)}\n            />\n          )}\n          {\n            /* @conditional-compile-remove(one-to-n-calling) */ /* @conditional-compile-remove(PSTN-calls) */\n            isEnabled(options?.moreButton) && moreButtonContextualMenuItems().length > 0 && (\n              <MoreButton\n                strings={moreButtonStrings}\n                menuIconProps={{ hidden: true }}\n                menuProps={{ items: moreButtonContextualMenuItems() }}\n                showLabel={options?.displayType !== 'compact'}\n              />\n            )\n          }\n          {/* @conditional-compile-remove(control-bar-button-injection) */ customButtons['primary']}\n          {isEnabled(options?.endCallButton) && <EndCall displayType={options?.displayType} />}\n        </ControlBar>\n      </Stack.Item>\n    </Stack>\n  );\n};\n\nconst isEnabled = (option: unknown): boolean => option !== false;\n\n/** @private */\nexport const isRoomsCallTrampoline = (): boolean => {\n  /* @conditional-compile-remove(rooms) */\n  const rolePermissions = _usePermissions();\n  /* @conditional-compile-remove(rooms) */\n  return !!rolePermissions.role;\n\n  return false;\n};\n\"../../../../../calling-component-bindings/src\"\"../../../../../react-components/src\""]}
+{"version":3,"file":"CallControls.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/components/CallControls.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,eAAe,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAGnE,6CAA6C;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,EAAE,UAAU,EAAgC,4CAAmC;AACtF,6CAA6C,CAAC,mDAAmD;AACjG,OAAO,EAAE,UAAU,EAAE,4CAAmC;AACxD,wCAAwC;AACxC,OAAO,EAAE,eAAe,EAAE,4CAAmC;AAC7D,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,+DAA+D;AAC/D,OAAO,EAAE,+BAA+B,EAAE,kCAAkC,EAAE,MAAM,kBAAkB,CAAC;AACvG,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAC5C,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAC5C,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAEpD,2FAA2F;AAC3F,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,2FAA2F;AAC3F,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,6CAA6C,CAAC,mDAAmD;AACjG,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACrD,6CAA6C,CAAC,mDAAmD;AACjG,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,mDAAmD;AACnD,OAAO,EAAE,+BAA+B,EAAE,MAAM,0BAA0B,CAAC;AAC3E,6CAA6C;AAC7C,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC/D,6CAA6C;AAC7C,OAAO,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAC5D,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAqBtC,iGAAiG;AACjG,MAAM,gBAAgB,GAAG,eAAe,CAAC,CAAC,UAAkB,EAAE,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,EAAE,CAAC,CAAC,CAAC;AAEzG;;GAEG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,KAA6C,EAAe,EAAE;IACzF,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,OAAO,KAAK,CAAC,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;IAE1G,2FAA2F;IAC3F,MAAM,aAAa,GAAG,SAAS,EAAE,CAAC;IAElC,2FAA2F;IAC3F,MAAM,mBAAmB,GAAG,OAAO,CACjC,GAAG,EAAE,CAAC,CAAC;QACL,KAAK,EAAE,aAAa,CAAC,OAAO,CAAC,IAAI,CAAC,iBAAiB;QACnD,iBAAiB,EAAE,aAAa,CAAC,OAAO,CAAC,IAAI,CAAC,uBAAuB;QACrE,gBAAgB,EAAE,aAAa,CAAC,OAAO,CAAC,IAAI,CAAC,wBAAwB;KACtE,CAAC,EACF,CAAC,aAAa,CAAC,CAChB,CAAC;IAEF,6CAA6C,CAAC,mDAAmD;IACjG,MAAM,iBAAiB,GAAG,OAAO,CAC/B,GAAG,EAAE,CAAC,CAAC;QACL,KAAK,EAAE,aAAa,CAAC,OAAO,CAAC,IAAI,CAAC,sBAAsB;QACxD,iBAAiB,EAAE,aAAa,CAAC,OAAO,CAAC,YAAY,CAAC,uBAAuB;KAC9E,CAAC,EACF,CAAC,aAAa,CAAC,CAChB,CAAC;IAEF,6CAA6C;IAC7C,MAAM,cAAc,GAAG,OAAO,CAC5B,GAAG,EAAE,CAAC,CAAC;QACL,qBAAqB,EAAE,aAAa,CAAC,OAAO,CAAC,IAAI,CAAC,qBAAqB;QACvE,gCAAgC,EAAE,aAAa,CAAC,OAAO,CAAC,IAAI,CAAC,gCAAgC;QAC7F,eAAe,EAAE,aAAa,CAAC,OAAO,CAAC,IAAI,CAAC,0BAA0B;KACvE,CAAC,EACF,CAAC,aAAa,CAAC,CAChB,CAAC;IAEF,6CAA6C,CAAC,mDAAmD;IACjG,MAAM,eAAe,GAAG,WAAW,CAAC,UAAU,CAAC,CAAC;IAEhD,6CAA6C;IAC7C,MAAM,iBAAiB,GAAG,UAAU,EAAE,CAAC,QAAQ,EAAE,CAAC,iBAAiB,CAAC;IAEpE,mDAAmD,CAAC,6CAA6C;IACjG,MAAM,6BAA6B,GAAG,GAA0B,EAAE;QAChE,MAAM,KAAK,GAA0B,EAAE,CAAC;QAExC,IAAI,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,qBAAqB,IAAI,SAAS,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,kBAAkB,CAAC,EAAE;YAC3F,KAAK,CAAC,IAAI,CAAC;gBACT,GAAG,EAAE,iBAAiB;gBACtB,IAAI,EAAE,aAAa,CAAC,SAAS,CAAC,OAAO,CAAC,kBAAkB,CAAC,KAAK;gBAC9D,OAAO,EAAE,GAAG,EAAE;oBACZ,IAAI,KAAK,CAAC,qBAAqB,EAAE;wBAC/B,KAAK,CAAC,qBAAqB,EAAE,CAAC;qBAC/B;gBACH,CAAC;gBACD,SAAS,EAAE,EAAE,QAAQ,EAAE,6CAA6C,EAAE,MAAM,EAAE,EAAE,IAAI,EAAE,EAAE,UAAU,EAAE,CAAC,EAAE,EAAE,EAAE;gBAC3G,SAAS,EAAE;oBACT,MAAM,EAAE,+BAA+B;iBACxC;gBACD,QAAQ,EAAE,UAAU,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,kBAAkB,CAAC;gBACjD,CAAC,YAAY,CAAC,EAAE,wCAAwC;aACzD,CAAC,CAAC;SACJ;QAED,IAAI,CAAC,qBAAqB,EAAE,EAAE;YAC5B,KAAK,CAAC,IAAI,CAAC;gBACT,GAAG,EAAE,eAAe;gBACpB,IAAI,EAAE,aAAa,CAAC,SAAS,CAAC,OAAO,CAAC,UAAU,CAAC,iBAAiB;gBAClE,OAAO,EAAE,GAAG,EAAE;oBACZ,eAAe,CAAC,YAAY,EAAE,CAAC;gBACjC,CAAC;gBACD,SAAS,EAAE,EAAE,QAAQ,EAAE,4BAA4B,EAAE,MAAM,EAAE,EAAE,IAAI,EAAE,EAAE,UAAU,EAAE,CAAC,EAAE,EAAE,EAAE;gBAC1F,SAAS,EAAE;oBACT,MAAM,EAAE,+BAA+B;iBACxC;gBACD,QAAQ,EAAE,UAAU,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,UAAU,CAAC;gBACzC,CAAC,YAAY,CAAC,EAAE,aAAa;aAC9B,CAAC,CAAC;SACJ;QAED,6CAA6C;QAC7C,iDAAiD;QACjD,IAAI,iBAAiB,EAAE;YACrB,KAAK,CAAC,IAAI,CAAC;gBACT,GAAG,EAAE,gBAAgB;gBACrB,IAAI,EAAE,aAAa,CAAC,OAAO,CAAC,IAAI,CAAC,oBAAoB;gBACrD,OAAO,EAAE,GAAG,EAAE;oBACZ,cAAc,CAAC,IAAI,CAAC,CAAC;gBACvB,CAAC;gBACD,SAAS,EAAE,EAAE,QAAQ,EAAE,uBAAuB,EAAE,MAAM,EAAE,EAAE,IAAI,EAAE,EAAE,UAAU,EAAE,CAAC,EAAE,EAAE,EAAE;gBACrF,SAAS,EAAE;oBACT,MAAM,EAAE,+BAA+B;iBACxC;aACF,CAAC,CAAC;SACJ;QAED,OAAO,KAAK,CAAC;IACf,CAAC,CAAC;IAEF,6CAA6C;IAC7C,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEtD,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IAEzB,+DAA+D;IAC/D,MAAM,aAAa,GAAG,OAAO,CAC3B,GAAG,EAAE,CAAC,+BAA+B,CAAC,kCAAkC,CAAC,OAAO,CAAC,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,WAAW,CAAC,EACxG,CAAC,OAAO,CAAC,CACV,CAAC;IAEF,0EAA0E;IAC1E,IAAI,KAAK,CAAC,OAAO,KAAK,KAAK,EAAE;QAC3B,OAAO,yCAAK,CAAC;KACd;IAED,6CAA6C;IAC7C,MAAM,gBAAgB,GAAG,GAAS,EAAE;QAClC,cAAc,CAAC,KAAK,CAAC,CAAC;IACxB,CAAC,CAAC;IAEF,wCAAwC;IACxC,MAAM,eAAe,GAAG,eAAe,EAAE,CAAC;IAE1C,IAAI,0BAA0B,GAAG,SAAS,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,iBAAiB,CAAC,CAAC;IACvE,wCAAwC;IACxC,0BAA0B,GAAG,eAAe,CAAC,WAAW,IAAI,0BAA0B,CAAC;IAEvF,IAAI,yBAAyB,GAAG,SAAS,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,gBAAgB,CAAC,CAAC;IACrE,wCAAwC;IACxC,yBAAyB,GAAG,eAAe,CAAC,gBAAgB,IAAI,yBAAyB,CAAC;IAE1F,IAAI,qBAAqB,GAAG,SAAS,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,YAAY,CAAC,CAAC;IAC7D,wCAAwC;IACxC,qBAAqB,GAAG,eAAe,CAAC,YAAY,IAAI,qBAAqB,CAAC;IAE9E,OAAO,CACL,oBAAC,KAAK,IAAC,eAAe,EAAC,QAAQ;QAE3B,6CAA6C;QAC7C,oBAAC,eAAe,IACd,QAAQ,EAAE,CAAC,CAAC,KAAK,CAAC,QAAQ,EAC1B,OAAO,EAAE,cAAc,EACvB,WAAW,EAAE,WAAW,EACxB,gBAAgB,EAAE,gBAAgB,GAClC;QAEJ,oBAAC,KAAK,CAAC,IAAI;YAQT,oBAAC,UAAU,IAAC,MAAM,EAAC,YAAY,EAAC,MAAM,EAAE,gBAAgB,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;gBAC1F,yBAAyB,IAAI,CAC5B,oBAAC,UAAU,IAAC,WAAW,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,WAAW,EAAE,QAAQ,EAAE,UAAU,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,gBAAgB,CAAC,GAAI,CACnG;gBACA,qBAAqB,IAAI,CACxB,oBAAC,MAAM,IAAC,WAAW,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,WAAW,EAAE,QAAQ,EAAE,UAAU,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,YAAY,CAAC,GAAI,CAC3F;gBACA,0BAA0B,IAAI,CAC7B,oBAAC,WAAW,IACV,MAAM,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,iBAAiB,EAClC,WAAW,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,WAAW,EACjC,QAAQ,EAAE,UAAU,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,iBAAiB,CAAC,GAChD,CACH;gBACA,SAAS,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,kBAAkB,CAAC;oBACrC,mDAAmD,CAAC,6CAA6C;oBACjG,CAAC,KAAK,CAAC,QAAQ,IAAI,CACjB,oBAAC,YAAY,IACX,MAAM,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,kBAAkB,EACnC,iBAAiB,EAAE,KAAK,CAAC,iBAAiB,EAC1C,2BAA2B,EAAE,KAAK,CAAC,2BAA2B,EAC9D,WAAW,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,WAAW,EACjC,sBAAsB,EAAE,KAAK,CAAC,sBAAsB,EACpD,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,QAAQ,EAAE,UAAU,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,kBAAkB,CAAC,GACjD,CACH,IAAI;gBACH,mDAAmD,CAAC,6CAA6C;gBACjG,oBAAC,MAAM,IACL,OAAO,EAAE,KAAK,CAAC,mBAAmB,EAClC,SAAS,EAAE,mBAAmB,aAAnB,mBAAmB,uBAAnB,mBAAmB,CAAE,KAAK,EACrC,SAAS,EAAE,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,WAAW,MAAK,SAAS,EAC7C,OAAO,EAAE,KAAK,CAAC,qBAAqB,gBACzB,8BAA8B,EACzC,OAAO,EAAE,mBAAmB,EAC5B,QAAQ,EAAE,UAAU,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,kBAAkB,CAAC,GACjD,CACH;gBACF,SAAS,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,aAAa,CAAC,IAAI,CACpC,oBAAC,OAAO,IACN,WAAW,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,WAAW,EACjC,sBAAsB,EAAE,KAAK,CAAC,sBAAsB,EACpD,QAAQ,EAAE,UAAU,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,aAAa,CAAC,GAC5C,CACH;gBAEC,mDAAmD,CAAC,6CAA6C;gBACjG,SAAS,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,UAAU,CAAC,IAAI,6BAA6B,EAAE,CAAC,MAAM,GAAG,CAAC,IAAI,CAC9E,oBAAC,UAAU,kBACE,mCAAmC,EAC9C,OAAO,EAAE,iBAAiB,EAC1B,aAAa,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,EAC/B,SAAS,EAAE,EAAE,KAAK,EAAE,6BAA6B,EAAE,EAAE,EACrD,SAAS,EAAE,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,WAAW,MAAK,SAAS,GAC7C,CACH;gBAE8D,aAAa,CAAC,SAAS,CAAC;gBACxF,SAAS,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,aAAa,CAAC,IAAI,oBAAC,OAAO,IAAC,WAAW,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,WAAW,GAAI,CACzE,CACF,CACP,CACT,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,SAAS,GAAG,CAAC,MAAe,EAAW,EAAE,CAAC,MAAM,KAAK,KAAK,CAAC;AAEjE,eAAe;AACf,MAAM,CAAC,MAAM,qBAAqB,GAAG,GAAY,EAAE;IACjD,wCAAwC;IACxC,MAAM,eAAe,GAAG,eAAe,EAAE,CAAC;IAC1C,wCAAwC;IACxC,OAAO,CAAC,CAAC,eAAe,CAAC,IAAI,CAAC;IAE9B,OAAO,KAAK,CAAC;AACf,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { memoizeFunction, Stack, useTheme } from '@fluentui/react';\n/* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\nimport { IContextualMenuItem } from '@fluentui/react';\n/* @conditional-compile-remove(PSTN-calls) */\nimport { useState } from 'react';\nimport { _isInLobbyOrConnecting } from '@internal/calling-component-bindings';\nimport { ControlBar, ParticipantMenuItemsCallback } from '@internal/react-components';\n/* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\nimport { HoldButton } from '@internal/react-components';\n/* @conditional-compile-remove(rooms) */\nimport { _usePermissions } from '@internal/react-components';\nimport React, { useMemo } from 'react';\nimport { CallControlOptions } from '../types/CallControlOptions';\nimport { Camera } from './buttons/Camera';\n/* @conditional-compile-remove(control-bar-button-injection) */\nimport { generateCustomControlBarButtons, onFetchCustomButtonPropsTrampoline } from './buttons/Custom';\nimport { Devices } from './buttons/Devices';\nimport { EndCall } from './buttons/EndCall';\nimport { Microphone } from './buttons/Microphone';\nimport { Participants } from './buttons/Participants';\nimport { ScreenShare } from './buttons/ScreenShare';\nimport { ContainerRectProps } from '../../common/ContainerRectProps';\n/* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\nimport { People } from './buttons/People';\n/* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\nimport { useLocale } from '../../localization';\n/* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\nimport { MoreButton } from '../../common/MoreButton';\n/* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\nimport { usePropsFor } from '../hooks/usePropsFor';\n/* @conditional-compile-remove(one-to-n-calling) */\nimport { buttonFlyoutIncreasedSizeStyles } from '../styles/Buttons.styles';\n/* @conditional-compile-remove(PSTN-calls) */\nimport { SendDtmfDialpad } from '../../common/SendDtmfDialpad';\n/* @conditional-compile-remove(PSTN-calls) */\nimport { useAdapter } from '../adapter/CallAdapterProvider';\nimport { isDisabled } from '../utils';\n\n/**\n * @private\n */\nexport type CallControlsProps = {\n  /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n  peopleButtonChecked?: boolean;\n  /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n  onPeopleButtonClicked?: () => void;\n  callInvitationURL?: string;\n  onFetchParticipantMenuItems?: ParticipantMenuItemsCallback;\n  options?: boolean | CallControlOptions;\n  /**\n   * Option to increase the height of the button flyout menu items from 36px to 48px.\n   * Recommended for mobile devices.\n   */\n  increaseFlyoutItemSize?: boolean;\n  isMobile?: boolean;\n};\n\n// Enforce a background color on control bar to ensure it matches the composite background color.\nconst controlBarStyles = memoizeFunction((background: string) => ({ root: { background: background } }));\n\n/**\n * @private\n */\nexport const CallControls = (props: CallControlsProps & ContainerRectProps): JSX.Element => {\n  const options = useMemo(() => (typeof props.options === 'boolean' ? {} : props.options), [props.options]);\n\n  /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n  const localeStrings = useLocale();\n\n  /* @conditional-compile-remove(one-to-n-calling) @conditional-compile-remove(PSTN-calls) */\n  const peopleButtonStrings = useMemo(\n    () => ({\n      label: localeStrings.strings.call.peopleButtonLabel,\n      tooltipOffContent: localeStrings.strings.call.peopleButtonTooltipOpen,\n      tooltipOnContent: localeStrings.strings.call.peopleButtonTooltipClose\n    }),\n    [localeStrings]\n  );\n\n  /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n  const moreButtonStrings = useMemo(\n    () => ({\n      label: localeStrings.strings.call.moreButtonCallingLabel,\n      tooltipOffContent: localeStrings.strings.callWithChat.moreDrawerButtonTooltip\n    }),\n    [localeStrings]\n  );\n\n  /* @conditional-compile-remove(PSTN-calls) */\n  const dialpadStrings = useMemo(\n    () => ({\n      dialpadModalAriaLabel: localeStrings.strings.call.dialpadModalAriaLabel,\n      dialpadCloseModalButtonAriaLabel: localeStrings.strings.call.dialpadCloseModalButtonAriaLabel,\n      placeholderText: localeStrings.strings.call.dtmfDialpadPlaceholderText\n    }),\n    [localeStrings]\n  );\n\n  /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n  const holdButtonProps = usePropsFor(HoldButton);\n\n  /* @conditional-compile-remove(PSTN-calls) */\n  const alternateCallerId = useAdapter().getState().alternateCallerId;\n\n  /* @conditional-compile-remove(one-to-n-calling) */ /* @conditional-compile-remove(PSTN-calls) */\n  const moreButtonContextualMenuItems = (): IContextualMenuItem[] => {\n    const items: IContextualMenuItem[] = [];\n\n    if (props.isMobile && props.onPeopleButtonClicked && isEnabled(options?.participantsButton)) {\n      items.push({\n        key: 'peopleButtonKey',\n        text: localeStrings.component.strings.participantsButton.label,\n        onClick: () => {\n          if (props.onPeopleButtonClicked) {\n            props.onPeopleButtonClicked();\n          }\n        },\n        iconProps: { iconName: 'ControlButtonParticipantsContextualMenuItem', styles: { root: { lineHeight: 0 } } },\n        itemProps: {\n          styles: buttonFlyoutIncreasedSizeStyles\n        },\n        disabled: isDisabled(options?.participantsButton),\n        ['data-ui-id']: 'call-composite-more-menu-people-button'\n      });\n    }\n\n    if (!isRoomsCallTrampoline()) {\n      items.push({\n        key: 'holdButtonKey',\n        text: localeStrings.component.strings.holdButton.tooltipOffContent,\n        onClick: () => {\n          holdButtonProps.onToggleHold();\n        },\n        iconProps: { iconName: 'HoldCallContextualMenuItem', styles: { root: { lineHeight: 0 } } },\n        itemProps: {\n          styles: buttonFlyoutIncreasedSizeStyles\n        },\n        disabled: isDisabled(options?.holdButton),\n        ['data-ui-id']: 'hold-button'\n      });\n    }\n\n    /* @conditional-compile-remove(PSTN-calls) */\n    // dtmf tone sending only works for 1:1 PSTN call\n    if (alternateCallerId) {\n      items.push({\n        key: 'showDialpadKey',\n        text: localeStrings.strings.call.openDtmfDialpadLabel,\n        onClick: () => {\n          setShowDialpad(true);\n        },\n        iconProps: { iconName: 'PeoplePaneOpenDialpad', styles: { root: { lineHeight: 0 } } },\n        itemProps: {\n          styles: buttonFlyoutIncreasedSizeStyles\n        }\n      });\n    }\n\n    return items;\n  };\n\n  /* @conditional-compile-remove(PSTN-calls) */\n  const [showDialpad, setShowDialpad] = useState(false);\n\n  const theme = useTheme();\n\n  /* @conditional-compile-remove(control-bar-button-injection) */\n  const customButtons = useMemo(\n    () => generateCustomControlBarButtons(onFetchCustomButtonPropsTrampoline(options), options?.displayType),\n    [options]\n  );\n\n  // when props.options is false then we want to hide the whole control bar.\n  if (props.options === false) {\n    return <></>;\n  }\n\n  /* @conditional-compile-remove(PSTN-calls) */\n  const onDismissDialpad = (): void => {\n    setShowDialpad(false);\n  };\n\n  /* @conditional-compile-remove(rooms) */\n  const rolePermissions = _usePermissions();\n\n  let screenShareButtonIsEnabled = isEnabled(options?.screenShareButton);\n  /* @conditional-compile-remove(rooms) */\n  screenShareButtonIsEnabled = rolePermissions.screenShare && screenShareButtonIsEnabled;\n\n  let microphoneButtonIsEnabled = isEnabled(options?.microphoneButton);\n  /* @conditional-compile-remove(rooms) */\n  microphoneButtonIsEnabled = rolePermissions.microphoneButton && microphoneButtonIsEnabled;\n\n  let cameraButtonIsEnabled = isEnabled(options?.cameraButton);\n  /* @conditional-compile-remove(rooms) */\n  cameraButtonIsEnabled = rolePermissions.cameraButton && cameraButtonIsEnabled;\n\n  return (\n    <Stack horizontalAlign=\"center\">\n      {\n        /* @conditional-compile-remove(PSTN-calls) */\n        <SendDtmfDialpad\n          isMobile={!!props.isMobile}\n          strings={dialpadStrings}\n          showDialpad={showDialpad}\n          onDismissDialpad={onDismissDialpad}\n        />\n      }\n      <Stack.Item>\n        {/*\n            Note: We use the layout=\"horizontal\" instead of dockedBottom because of how we position the\n            control bar. The control bar exists in a Stack below the MediaGallery. The MediaGallery is\n            set to grow and fill the remaining space not taken up by the ControlBar. If we were to use\n            dockedBottom it has position absolute and would therefore float on top of the media gallery,\n            occluding some of its content.\n         */}\n        <ControlBar layout=\"horizontal\" styles={controlBarStyles(theme.semanticColors.bodyBackground)}>\n          {microphoneButtonIsEnabled && (\n            <Microphone displayType={options?.displayType} disabled={isDisabled(options?.microphoneButton)} />\n          )}\n          {cameraButtonIsEnabled && (\n            <Camera displayType={options?.displayType} disabled={isDisabled(options?.cameraButton)} />\n          )}\n          {screenShareButtonIsEnabled && (\n            <ScreenShare\n              option={options?.screenShareButton}\n              displayType={options?.displayType}\n              disabled={isDisabled(options?.screenShareButton)}\n            />\n          )}\n          {isEnabled(options?.participantsButton) &&\n            /* @conditional-compile-remove(one-to-n-calling) */ /* @conditional-compile-remove(PSTN-calls) */\n            !props.isMobile && (\n              <Participants\n                option={options?.participantsButton}\n                callInvitationURL={props.callInvitationURL}\n                onFetchParticipantMenuItems={props.onFetchParticipantMenuItems}\n                displayType={options?.displayType}\n                increaseFlyoutItemSize={props.increaseFlyoutItemSize}\n                isMobile={props.isMobile}\n                disabled={isDisabled(options?.participantsButton)}\n              />\n            ) && (\n              /* @conditional-compile-remove(one-to-n-calling) */ /* @conditional-compile-remove(PSTN-calls) */\n              <People\n                checked={props.peopleButtonChecked}\n                ariaLabel={peopleButtonStrings?.label}\n                showLabel={options?.displayType !== 'compact'}\n                onClick={props.onPeopleButtonClicked}\n                data-ui-id=\"call-composite-people-button\"\n                strings={peopleButtonStrings}\n                disabled={isDisabled(options?.participantsButton)}\n              />\n            )}\n          {isEnabled(options?.devicesButton) && (\n            <Devices\n              displayType={options?.displayType}\n              increaseFlyoutItemSize={props.increaseFlyoutItemSize}\n              disabled={isDisabled(options?.devicesButton)}\n            />\n          )}\n          {\n            /* @conditional-compile-remove(one-to-n-calling) */ /* @conditional-compile-remove(PSTN-calls) */\n            isEnabled(options?.moreButton) && moreButtonContextualMenuItems().length > 0 && (\n              <MoreButton\n                data-ui-id=\"common-call-composite-more-button\"\n                strings={moreButtonStrings}\n                menuIconProps={{ hidden: true }}\n                menuProps={{ items: moreButtonContextualMenuItems() }}\n                showLabel={options?.displayType !== 'compact'}\n              />\n            )\n          }\n          {/* @conditional-compile-remove(control-bar-button-injection) */ customButtons['primary']}\n          {isEnabled(options?.endCallButton) && <EndCall displayType={options?.displayType} />}\n        </ControlBar>\n      </Stack.Item>\n    </Stack>\n  );\n};\n\nconst isEnabled = (option: unknown): boolean => option !== false;\n\n/** @private */\nexport const isRoomsCallTrampoline = (): boolean => {\n  /* @conditional-compile-remove(rooms) */\n  const rolePermissions = _usePermissions();\n  /* @conditional-compile-remove(rooms) */\n  return !!rolePermissions.role;\n\n  return false;\n};\n\"../../../../../calling-component-bindings/src\"\"../../../../../react-components/src\""]}

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/LocalPreview.js

@@ -21,7 +21,7 @@ import { getLocalMicrophoneEnabled } from '../selectors/baseSelectors';
 import { devicePermissionSelector } from '../selectors/devicePermissionSelector';
 import { localPreviewSelector } from '../selectors/localPreviewSelector';
 import { buttonFlyoutIncreasedSizeStyles } from '../styles/Buttons.styles';
-import { cameraOffLabelStyle, localPreviewContainerStyleDesktop, localPreviewContainerStyleMobile, localPreviewTileStyle } from '../styles/LocalPreview.styles';
+import { cameraOffLabelStyle, localPreviewButtonStyle, localPreviewContainerStyleDesktop, localPreviewContainerStyleMobile, localPreviewTileStyle } from '../styles/LocalPreview.styles';
 /**
  * @private
  */
@@ -59,8 +59,8 @@ export const LocalPreview = (props) => {
     return (React.createElement(Stack, { "data-ui-id": "call-composite-local-preview", className: props.mobileView ? localPreviewContainerStyleMobile : localPreviewContainerStyleDesktop },
         React.createElement(VideoTile, { styles: localPreviewTileStyle, renderElement: (localPreviewProps === null || localPreviewProps === void 0 ? void 0 : localPreviewProps.videoStreamElement) ? (React.createElement(StreamMedia, { videoStreamElement: localPreviewProps.videoStreamElement })) : undefined, onRenderPlaceholder: onRenderPlaceholder },
             React.createElement(ControlBar, { layout: "floatingBottom" },
-                React.createElement(MicrophoneButton, { "data-ui-id": "call-composite-local-device-settings-microphone-button", checked: isLocalMicrophoneEnabled, onToggleMicrophone: onToggleMic, disabled: !microphonePermissionGranted || !hasMicrophones, showLabel: true }),
-                React.createElement(CameraButton, Object.assign({ "data-ui-id": "call-composite-local-device-settings-camera-button" }, cameraButtonProps, { showLabel: true, disabled: !cameraPermissionGranted || !hasCameras })),
+                React.createElement(MicrophoneButton, { "data-ui-id": "call-composite-local-device-settings-microphone-button", checked: isLocalMicrophoneEnabled, onToggleMicrophone: onToggleMic, disabled: !microphonePermissionGranted || !hasMicrophones, showLabel: true, styles: localPreviewButtonStyle }),
+                React.createElement(CameraButton, Object.assign({ "data-ui-id": "call-composite-local-device-settings-camera-button" }, cameraButtonProps, { showLabel: true, disabled: !cameraPermissionGranted || !hasCameras, styles: localPreviewButtonStyle })),
                 props.showDevicesButton && (React.createElement(DevicesButton, Object.assign({ "data-ui-id": "call-composite-local-device-settings-options-button" }, devicesButtonProps, { 
                     // disable button whilst all other buttons are disabled
                     disabled: !microphonePermissionGranted || !cameraPermissionGranted || hasNoDevices, showLabel: true, styles: devicesButtonStyles })))))));

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/LocalPreview.js.map

@@ -1 +1 @@
-{"version":3,"file":"LocalPreview.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/components/LocalPreview.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { mergeStyles, Stack, Text } from '@fluentui/react';\nimport {\n  CameraButton,\n  ControlBar,\n  MicrophoneButton,\n  DevicesButton,\n  StreamMedia,\n  useTheme,\n  VideoTile\n} from '@internal/react-components';\nimport React, { useCallback } from 'react';\nimport { CallCompositeIcon } from '../../common/icons';\nimport { useLocale } from '../../localization';\nimport { useAdapter } from '../adapter/CallAdapterProvider';\nimport { usePropsFor } from '../hooks/usePropsFor';\nimport { useSelector } from '../hooks/useSelector';\nimport { getLocalMicrophoneEnabled } from '../selectors/baseSelectors';\nimport { devicePermissionSelector } from '../selectors/devicePermissionSelector';\nimport { localPreviewSelector } from '../selectors/localPreviewSelector';\nimport { buttonFlyoutIncreasedSizeStyles } from '../styles/Buttons.styles';\nimport {\n  cameraOffLabelStyle,\n  localPreviewContainerStyleDesktop,\n  localPreviewContainerStyleMobile,\n  localPreviewTileStyle\n} from '../styles/LocalPreview.styles';\n\n/**\n * @private\n */\nexport interface LocalPreviewProps {\n  mobileView: boolean;\n  showDevicesButton: boolean;\n}\n\n/**\n * @private\n */\nexport const LocalPreview = (props: LocalPreviewProps): JSX.Element => {\n  const locale = useLocale();\n  const cameraButtonProps = usePropsFor(CameraButton);\n  const localPreviewProps = useSelector(localPreviewSelector);\n  const devicesButtonProps = usePropsFor(DevicesButton);\n  const { audio: microphonePermissionGranted, video: cameraPermissionGranted } = useSelector(devicePermissionSelector);\n\n  const isLocalMicrophoneEnabled = useSelector(getLocalMicrophoneEnabled);\n  const adapter = useAdapter();\n\n  const onToggleMic = useCallback(async () => {\n    isLocalMicrophoneEnabled ? adapter.mute() : adapter.unmute();\n  }, [adapter, isLocalMicrophoneEnabled]);\n\n  const hasNoDevices =\n    devicesButtonProps.cameras.length === 0 &&\n    devicesButtonProps.microphones.length === 0 &&\n    devicesButtonProps.speakers.length === 0;\n\n  const hasCameras = devicesButtonProps.cameras.length > 0;\n  const hasMicrophones = devicesButtonProps.microphones.length > 0;\n\n  const theme = useTheme();\n  const onRenderPlaceholder = useCallback((): JSX.Element => {\n    return (\n      <Stack\n        className={mergeStyles({ width: '100%', height: '100%' })}\n        verticalAlign=\"center\"\n        tokens={{ childrenGap: '0.25rem' }}\n      >\n        <Stack.Item align=\"center\">\n          <CallCompositeIcon\n            iconName=\"LocalPreviewPlaceholder\"\n            className={mergeStyles(cameraOffLabelStyle, { color: theme.palette.neutralTertiary })}\n          />\n        </Stack.Item>\n        <Stack.Item align=\"center\">\n          <Text className={mergeStyles(cameraOffLabelStyle, { color: theme.palette.neutralSecondary })}>\n            {locale.strings.call.cameraTurnedOff}\n          </Text>\n        </Stack.Item>\n      </Stack>\n    );\n  }, [theme, locale.strings.call.cameraTurnedOff]);\n\n  const devicesButtonStyles = props.mobileView\n    ? {\n        menuStyles: {\n          menuItemStyles: buttonFlyoutIncreasedSizeStyles\n        }\n      }\n    : undefined;\n\n  return (\n    <Stack\n      data-ui-id=\"call-composite-local-preview\"\n      className={props.mobileView ? localPreviewContainerStyleMobile : localPreviewContainerStyleDesktop}\n    >\n      <VideoTile\n        styles={localPreviewTileStyle}\n        renderElement={\n          localPreviewProps?.videoStreamElement ? (\n            <StreamMedia videoStreamElement={localPreviewProps.videoStreamElement} />\n          ) : undefined\n        }\n        onRenderPlaceholder={onRenderPlaceholder}\n      >\n        <ControlBar layout=\"floatingBottom\">\n          <MicrophoneButton\n            data-ui-id=\"call-composite-local-device-settings-microphone-button\"\n            checked={isLocalMicrophoneEnabled}\n            onToggleMicrophone={onToggleMic}\n            disabled={!microphonePermissionGranted || !hasMicrophones}\n            showLabel={true}\n          />\n          <CameraButton\n            data-ui-id=\"call-composite-local-device-settings-camera-button\"\n            {...cameraButtonProps}\n            showLabel={true}\n            disabled={!cameraPermissionGranted || !hasCameras}\n          />\n          {props.showDevicesButton && (\n            <DevicesButton\n              data-ui-id=\"call-composite-local-device-settings-options-button\"\n              {...devicesButtonProps}\n              // disable button whilst all other buttons are disabled\n              disabled={!microphonePermissionGranted || !cameraPermissionGranted || hasNoDevices}\n              showLabel={true}\n              styles={devicesButtonStyles}\n            />\n          )}\n        </ControlBar>\n      </VideoTile>\n    </Stack>\n  );\n};\n\"../../../../../react-components/src\""]}
+{"version":3,"file":"LocalPreview.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/components/LocalPreview.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { mergeStyles, Stack, Text } from '@fluentui/react';\nimport {\n  CameraButton,\n  ControlBar,\n  MicrophoneButton,\n  DevicesButton,\n  StreamMedia,\n  useTheme,\n  VideoTile\n} from '@internal/react-components';\nimport React, { useCallback } from 'react';\nimport { CallCompositeIcon } from '../../common/icons';\nimport { useLocale } from '../../localization';\nimport { useAdapter } from '../adapter/CallAdapterProvider';\nimport { usePropsFor } from '../hooks/usePropsFor';\nimport { useSelector } from '../hooks/useSelector';\nimport { getLocalMicrophoneEnabled } from '../selectors/baseSelectors';\nimport { devicePermissionSelector } from '../selectors/devicePermissionSelector';\nimport { localPreviewSelector } from '../selectors/localPreviewSelector';\nimport { buttonFlyoutIncreasedSizeStyles } from '../styles/Buttons.styles';\nimport {\n  cameraOffLabelStyle,\n  localPreviewButtonStyle,\n  localPreviewContainerStyleDesktop,\n  localPreviewContainerStyleMobile,\n  localPreviewTileStyle\n} from '../styles/LocalPreview.styles';\n\n/**\n * @private\n */\nexport interface LocalPreviewProps {\n  mobileView: boolean;\n  showDevicesButton: boolean;\n}\n\n/**\n * @private\n */\nexport const LocalPreview = (props: LocalPreviewProps): JSX.Element => {\n  const locale = useLocale();\n  const cameraButtonProps = usePropsFor(CameraButton);\n  const localPreviewProps = useSelector(localPreviewSelector);\n  const devicesButtonProps = usePropsFor(DevicesButton);\n  const { audio: microphonePermissionGranted, video: cameraPermissionGranted } = useSelector(devicePermissionSelector);\n\n  const isLocalMicrophoneEnabled = useSelector(getLocalMicrophoneEnabled);\n  const adapter = useAdapter();\n\n  const onToggleMic = useCallback(async () => {\n    isLocalMicrophoneEnabled ? adapter.mute() : adapter.unmute();\n  }, [adapter, isLocalMicrophoneEnabled]);\n\n  const hasNoDevices =\n    devicesButtonProps.cameras.length === 0 &&\n    devicesButtonProps.microphones.length === 0 &&\n    devicesButtonProps.speakers.length === 0;\n\n  const hasCameras = devicesButtonProps.cameras.length > 0;\n  const hasMicrophones = devicesButtonProps.microphones.length > 0;\n\n  const theme = useTheme();\n  const onRenderPlaceholder = useCallback((): JSX.Element => {\n    return (\n      <Stack\n        className={mergeStyles({ width: '100%', height: '100%' })}\n        verticalAlign=\"center\"\n        tokens={{ childrenGap: '0.25rem' }}\n      >\n        <Stack.Item align=\"center\">\n          <CallCompositeIcon\n            iconName=\"LocalPreviewPlaceholder\"\n            className={mergeStyles(cameraOffLabelStyle, { color: theme.palette.neutralTertiary })}\n          />\n        </Stack.Item>\n        <Stack.Item align=\"center\">\n          <Text className={mergeStyles(cameraOffLabelStyle, { color: theme.palette.neutralSecondary })}>\n            {locale.strings.call.cameraTurnedOff}\n          </Text>\n        </Stack.Item>\n      </Stack>\n    );\n  }, [theme, locale.strings.call.cameraTurnedOff]);\n\n  const devicesButtonStyles = props.mobileView\n    ? {\n        menuStyles: {\n          menuItemStyles: buttonFlyoutIncreasedSizeStyles\n        }\n      }\n    : undefined;\n\n  return (\n    <Stack\n      data-ui-id=\"call-composite-local-preview\"\n      className={props.mobileView ? localPreviewContainerStyleMobile : localPreviewContainerStyleDesktop}\n    >\n      <VideoTile\n        styles={localPreviewTileStyle}\n        renderElement={\n          localPreviewProps?.videoStreamElement ? (\n            <StreamMedia videoStreamElement={localPreviewProps.videoStreamElement} />\n          ) : undefined\n        }\n        onRenderPlaceholder={onRenderPlaceholder}\n      >\n        <ControlBar layout=\"floatingBottom\">\n          <MicrophoneButton\n            data-ui-id=\"call-composite-local-device-settings-microphone-button\"\n            checked={isLocalMicrophoneEnabled}\n            onToggleMicrophone={onToggleMic}\n            disabled={!microphonePermissionGranted || !hasMicrophones}\n            showLabel={true}\n            styles={localPreviewButtonStyle}\n          />\n          <CameraButton\n            data-ui-id=\"call-composite-local-device-settings-camera-button\"\n            {...cameraButtonProps}\n            showLabel={true}\n            disabled={!cameraPermissionGranted || !hasCameras}\n            styles={localPreviewButtonStyle}\n          />\n          {props.showDevicesButton && (\n            <DevicesButton\n              data-ui-id=\"call-composite-local-device-settings-options-button\"\n              {...devicesButtonProps}\n              // disable button whilst all other buttons are disabled\n              disabled={!microphonePermissionGranted || !cameraPermissionGranted || hasNoDevices}\n              showLabel={true}\n              styles={devicesButtonStyles}\n            />\n          )}\n        </ControlBar>\n      </VideoTile>\n    </Stack>\n  );\n};\n\"../../../../../react-components/src\""]}

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/Camera.d.ts

@@ -1,14 +1,13 @@
 /// <reference types="react" />
 import { ControlBarButtonStyles } from "../../../../../../react-components/src";
-import { CallControlDisplayType } from '../../types/CallControlOptions';
+import { CallControlDisplayType } from '../../../common/types/CommonCallControlOptions';
 /**
  * @private
  */
 export declare const Camera: (props: {
-    displayType?: CallControlDisplayType | undefined;
-    styles?: import("@fluentui/react").IButtonStyles | undefined;
-    splitButtonsForDeviceSelection?: boolean | undefined;
-    disabled?: boolean | undefined;
-    onShowVideoEffectsPicker?: ((showVideoEffectsOptions: boolean) => void) | undefined;
+    displayType?: CallControlDisplayType;
+    styles?: ControlBarButtonStyles;
+    splitButtonsForDeviceSelection?: boolean;
+    disabled?: boolean;
 }) => JSX.Element;
 //# sourceMappingURL=Camera.d.ts.map

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/Camera.js

@@ -10,8 +10,6 @@ import { concatButtonBaseStyles } from '../../styles/Buttons.styles';
 export const Camera = (props) => {
     const cameraButtonProps = usePropsFor(CameraButton);
     const styles = useMemo(() => { var _a; return concatButtonBaseStyles((_a = props.styles) !== null && _a !== void 0 ? _a : {}); }, [props.styles]);
-    return (React.createElement(CameraButton, Object.assign({ "data-ui-id": "call-composite-camera-button" }, cameraButtonProps, { showLabel: props.displayType !== 'compact', styles: styles, enableDeviceSelectionMenu: props.splitButtonsForDeviceSelection, disabled: cameraButtonProps.disabled || props.disabled, 
-        /* @conditional-compile-remove(video-background-effects) */
-        onShowVideoEffectsPicker: props.onShowVideoEffectsPicker })));
+    return (React.createElement(CameraButton, Object.assign({ "data-ui-id": "call-composite-camera-button" }, cameraButtonProps, { showLabel: props.displayType !== 'compact', styles: styles, enableDeviceSelectionMenu: props.splitButtonsForDeviceSelection, disabled: cameraButtonProps.disabled || props.disabled })));
 };
 //# sourceMappingURL=Camera.js.map

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/Camera.js.map

@@ -1 +1 @@
-{"version":3,"file":"Camera.js","sourceRoot":"","sources":["../../../../../../../../../react-composites/src/composites/CallComposite/components/buttons/Camera.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,YAAY,EAA0B,+CAAmC;AAClF,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAEtD,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AAErE;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,KAOtB,EAAe,EAAE;IAChB,MAAM,iBAAiB,GAAG,WAAW,CAAC,YAAY,CAAC,CAAC;IACpD,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;IACzF,OAAO,CACL,oBAAC,YAAY,gCACA,8BAA8B,IACrC,iBAAiB,IACrB,SAAS,EAAE,KAAK,CAAC,WAAW,KAAK,SAAS,EAC1C,MAAM,EAAE,MAAM,EACd,yBAAyB,EAAE,KAAK,CAAC,8BAA8B,EAC/D,QAAQ,EAAE,iBAAiB,CAAC,QAAQ,IAAI,KAAK,CAAC,QAAQ;QACtD,2DAA2D;QAC3D,wBAAwB,EAAE,KAAK,CAAC,wBAAwB,IACxD,CACH,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { CameraButton, ControlBarButtonStyles } from '@internal/react-components';\nimport React, { useMemo } from 'react';\nimport { usePropsFor } from '../../hooks/usePropsFor';\nimport { CallControlDisplayType } from '../../types/CallControlOptions';\nimport { concatButtonBaseStyles } from '../../styles/Buttons.styles';\n\n/**\n * @private\n */\nexport const Camera = (props: {\n  displayType?: CallControlDisplayType;\n  styles?: ControlBarButtonStyles;\n  splitButtonsForDeviceSelection?: boolean;\n  disabled?: boolean;\n  /* @conditional-compile-remove(video-background-effects) */\n  onShowVideoEffectsPicker?: (showVideoEffectsOptions: boolean) => void;\n}): JSX.Element => {\n  const cameraButtonProps = usePropsFor(CameraButton);\n  const styles = useMemo(() => concatButtonBaseStyles(props.styles ?? {}), [props.styles]);\n  return (\n    <CameraButton\n      data-ui-id=\"call-composite-camera-button\"\n      {...cameraButtonProps}\n      showLabel={props.displayType !== 'compact'}\n      styles={styles}\n      enableDeviceSelectionMenu={props.splitButtonsForDeviceSelection}\n      disabled={cameraButtonProps.disabled || props.disabled}\n      /* @conditional-compile-remove(video-background-effects) */\n      onShowVideoEffectsPicker={props.onShowVideoEffectsPicker}\n    />\n  );\n};\n\"../../../../../../react-components/src\""]}
+{"version":3,"file":"Camera.js","sourceRoot":"","sources":["../../../../../../../../../react-composites/src/composites/CallComposite/components/buttons/Camera.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,YAAY,EAA0B,+CAAmC;AAClF,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AAErE;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,KAKtB,EAAe,EAAE;IAChB,MAAM,iBAAiB,GAAG,WAAW,CAAC,YAAY,CAAC,CAAC;IACpD,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;IACzF,OAAO,CACL,oBAAC,YAAY,gCACA,8BAA8B,IACrC,iBAAiB,IACrB,SAAS,EAAE,KAAK,CAAC,WAAW,KAAK,SAAS,EAC1C,MAAM,EAAE,MAAM,EACd,yBAAyB,EAAE,KAAK,CAAC,8BAA8B,EAC/D,QAAQ,EAAE,iBAAiB,CAAC,QAAQ,IAAI,KAAK,CAAC,QAAQ,IACtD,CACH,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { CameraButton, ControlBarButtonStyles } from '@internal/react-components';\nimport React, { useMemo } from 'react';\nimport { CallControlDisplayType } from '../../../common/types/CommonCallControlOptions';\nimport { usePropsFor } from '../../hooks/usePropsFor';\nimport { concatButtonBaseStyles } from '../../styles/Buttons.styles';\n\n/**\n * @private\n */\nexport const Camera = (props: {\n  displayType?: CallControlDisplayType;\n  styles?: ControlBarButtonStyles;\n  splitButtonsForDeviceSelection?: boolean;\n  disabled?: boolean;\n}): JSX.Element => {\n  const cameraButtonProps = usePropsFor(CameraButton);\n  const styles = useMemo(() => concatButtonBaseStyles(props.styles ?? {}), [props.styles]);\n  return (\n    <CameraButton\n      data-ui-id=\"call-composite-camera-button\"\n      {...cameraButtonProps}\n      showLabel={props.displayType !== 'compact'}\n      styles={styles}\n      enableDeviceSelectionMenu={props.splitButtonsForDeviceSelection}\n      disabled={cameraButtonProps.disabled || props.disabled}\n    />\n  );\n};\n\"../../../../../../react-components/src\""]}

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/Custom.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { CallControlDisplayType, CustomCallControlButtonCallback, CustomCallControlButtonPlacement } from '../../types/CallControlOptions';
-import { CallControlOptions } from '../../types/CallControlOptions';
+import { CustomCallControlButtonCallback, CustomCallControlButtonPlacement } from '../../../common/ControlBar/CustomButton';
+import { CallControlDisplayType } from '../../../common/types/CommonCallControlOptions';
 /** @private */
 export declare type CustomButtons = {
     [key in CustomCallControlButtonPlacement]: JSX.Element | undefined;
@@ -8,5 +8,11 @@ export declare type CustomButtons = {
 /** @private */
 export declare const generateCustomControlBarButtons: (onFetchCustomButtonProps?: CustomCallControlButtonCallback[] | undefined, displayType?: CallControlDisplayType | undefined) => CustomButtons;
 /** @private */
-export declare const onFetchCustomButtonPropsTrampoline: (options?: CallControlOptions | undefined) => CustomCallControlButtonCallback[] | undefined;
+export declare const onFetchCustomButtonPropsTrampoline: (options?: (import("../../../common/types/CommonCallControlOptions").CommonCallControlOptions & {
+    participantsButton?: boolean | {
+        disabled: boolean;
+    } | undefined;
+    /** @private */
+    legacyControlBarExperience?: boolean | undefined;
+}) | undefined) => CustomCallControlButtonCallback[] | undefined;
 //# sourceMappingURL=Custom.d.ts.map

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/Custom.js

@@ -7,7 +7,9 @@ import React from 'react';
 /** @private */
 export const generateCustomControlBarButtons = (onFetchCustomButtonProps, displayType) => {
     const response = {
-        primary: undefined
+        primary: undefined,
+        overflow: undefined,
+        secondary: undefined
     };
     if (!onFetchCustomButtonProps) {
         return response;

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/Custom.js.map

@@ -1 +1 @@
-{"version":3,"file":"Custom.js","sourceRoot":"","sources":["../../../../../../../../../react-composites/src/composites/CallComposite/components/buttons/Custom.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,iDAAiD;AACjD,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AACvC,OAAO,EAAE,gBAAgB,EAAwB,+CAAmC;AACpF,OAAO,KAAK,MAAM,OAAO,CAAC;AAY1B,eAAe;AACf,MAAM,CAAC,MAAM,+BAA+B,GAAG,CAC7C,wBAA4D,EAC5D,WAAoC,EACrB,EAAE;IACjB,MAAM,QAAQ,GAAG;QACf,OAAO,EAAE,SAAS;KACnB,CAAC;IAEF,IAAI,CAAC,wBAAwB,EAAE;QAC7B,OAAO,QAAQ,CAAC;KACjB;IAED,MAAM,cAAc,GAAG,wBAAwB,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,WAAW,EAAE,CAAC,CAAC,CAAC;IAE/E,KAAK,MAAM,GAAG,IAAI,QAAQ,EAAE;QAC1B,QAAQ,CAAC,GAAG,CAAC,GAAG,CACd,0CACG,cAAc;aACZ,MAAM,CAAC,CAAC,WAAW,EAAE,EAAE,CAAC,WAAW,CAAC,SAAS,KAAK,GAAG,CAAC;aACtD,GAAG,CAAC,CAAC,WAAW,EAAE,CAAC,EAAE,EAAE;;YAAC,OAAA,CACvB,oBAAC,gBAAgB,IACf,eAAe,EAAE,WAAW,CAAC,eAAe,EAC5C,SAAS,EAAE,WAAW,CAAC,SAAS,EAChC,QAAQ,EAAE,WAAW,CAAC,QAAQ,EAC9B,EAAE,EAAE,WAAW,CAAC,EAAE,EAClB,GAAG,EAAE,MAAA,WAAW,CAAC,GAAG,mCAAI,GAAG,WAAW,CAAC,SAAS,IAAI,CAAC,EAAE,EACvD,OAAO,EAAE,WAAW,CAAC,WAAW,EAChC,YAAY,EAAE,GAAG,EAAE,WAAC,OAAA,oBAAC,IAAI,IAAC,QAAQ,EAAE,MAAA,WAAW,CAAC,QAAQ,mCAAI,sBAAsB,GAAI,CAAA,EAAA,EACtF,SAAS,EAAE,WAAW,CAAC,SAAS,EAChC,IAAI,EAAE,WAAW,CAAC,IAAI,EACtB,MAAM,EAAE,WAAW,CAAC,MAAM,GAC1B,CACH,CAAA;SAAA,CAAC,CACH,CACJ,CAAC;KACH;IACD,OAAO,QAAQ,CAAC;AAClB,CAAC,CAAC;AAEF,+DAA+D;AAC/D,eAAe;AACf,MAAM,CAAC,MAAM,kCAAkC,GAAG,CAChD,OAA4B,EACmB,EAAE;IACjD,IAAI,QAAQ,GAAkD,SAAS,CAAC;IACxE,QAAQ,GAAG,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,wBAAwB,CAAC;IAC7C,OAAO,QAAQ,CAAC;AAClB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\n// eslint-disable-next-line no-restricted-imports\nimport { Icon } from '@fluentui/react';\nimport { ControlBarButton, _DrawerMenuItemProps } from '@internal/react-components';\nimport React from 'react';\nimport {\n  CallControlDisplayType,\n  CustomCallControlButtonCallback,\n  CustomCallControlButtonPlacement\n} from '../../types/CallControlOptions';\n/* @conditional-compile-remove(control-bar-button-injection) */\nimport { CallControlOptions } from '../../types/CallControlOptions';\n\n/** @private */\nexport type CustomButtons = { [key in CustomCallControlButtonPlacement]: JSX.Element | undefined };\n\n/** @private */\nexport const generateCustomControlBarButtons = (\n  onFetchCustomButtonProps?: CustomCallControlButtonCallback[],\n  displayType?: CallControlDisplayType\n): CustomButtons => {\n  const response = {\n    primary: undefined\n  };\n\n  if (!onFetchCustomButtonProps) {\n    return response;\n  }\n\n  const allButtonProps = onFetchCustomButtonProps.map((f) => f({ displayType }));\n\n  for (const key in response) {\n    response[key] = (\n      <>\n        {allButtonProps\n          .filter((buttonProps) => buttonProps.placement === key)\n          .map((buttonProps, i) => (\n            <ControlBarButton\n              ariaDescription={buttonProps.ariaDescription}\n              ariaLabel={buttonProps.ariaLabel}\n              disabled={buttonProps.disabled}\n              id={buttonProps.id}\n              key={buttonProps.key ?? `${buttonProps.placement}_${i}`}\n              onClick={buttonProps.onItemClick}\n              onRenderIcon={() => <Icon iconName={buttonProps.iconName ?? 'ControlButtonOptions'} />}\n              showLabel={buttonProps.showLabel}\n              text={buttonProps.text}\n              styles={buttonProps.styles}\n            />\n          ))}\n      </>\n    );\n  }\n  return response;\n};\n\n/* @conditional-compile-remove(control-bar-button-injection) */\n/** @private */\nexport const onFetchCustomButtonPropsTrampoline = (\n  options?: CallControlOptions\n): CustomCallControlButtonCallback[] | undefined => {\n  let response: CustomCallControlButtonCallback[] | undefined = undefined;\n  response = options?.onFetchCustomButtonProps;\n  return response;\n};\n\"../../../../../../react-components/src\""]}
+{"version":3,"file":"Custom.js","sourceRoot":"","sources":["../../../../../../../../../react-composites/src/composites/CallComposite/components/buttons/Custom.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,iDAAiD;AACjD,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AACvC,OAAO,EAAE,gBAAgB,EAAwB,+CAAmC;AACpF,OAAO,KAAK,MAAM,OAAO,CAAC;AAY1B,eAAe;AACf,MAAM,CAAC,MAAM,+BAA+B,GAAG,CAC7C,wBAA4D,EAC5D,WAAoC,EACrB,EAAE;IACjB,MAAM,QAAQ,GAAG;QACf,OAAO,EAAE,SAAS;QAClB,QAAQ,EAAE,SAAS;QACnB,SAAS,EAAE,SAAS;KACrB,CAAC;IAEF,IAAI,CAAC,wBAAwB,EAAE;QAC7B,OAAO,QAAQ,CAAC;KACjB;IAED,MAAM,cAAc,GAAG,wBAAwB,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,WAAW,EAAE,CAAC,CAAC,CAAC;IAE/E,KAAK,MAAM,GAAG,IAAI,QAAQ,EAAE;QAC1B,QAAQ,CAAC,GAAG,CAAC,GAAG,CACd,0CACG,cAAc;aACZ,MAAM,CAAC,CAAC,WAAW,EAAE,EAAE,CAAC,WAAW,CAAC,SAAS,KAAK,GAAG,CAAC;aACtD,GAAG,CAAC,CAAC,WAAW,EAAE,CAAC,EAAE,EAAE;;YAAC,OAAA,CACvB,oBAAC,gBAAgB,IACf,eAAe,EAAE,WAAW,CAAC,eAAe,EAC5C,SAAS,EAAE,WAAW,CAAC,SAAS,EAChC,QAAQ,EAAE,WAAW,CAAC,QAAQ,EAC9B,EAAE,EAAE,WAAW,CAAC,EAAE,EAClB,GAAG,EAAE,MAAA,WAAW,CAAC,GAAG,mCAAI,GAAG,WAAW,CAAC,SAAS,IAAI,CAAC,EAAE,EACvD,OAAO,EAAE,WAAW,CAAC,WAAW,EAChC,YAAY,EAAE,GAAG,EAAE,WAAC,OAAA,oBAAC,IAAI,IAAC,QAAQ,EAAE,MAAA,WAAW,CAAC,QAAQ,mCAAI,sBAAsB,GAAI,CAAA,EAAA,EACtF,SAAS,EAAE,WAAW,CAAC,SAAS,EAChC,IAAI,EAAE,WAAW,CAAC,IAAI,EACtB,MAAM,EAAE,WAAW,CAAC,MAAM,GAC1B,CACH,CAAA;SAAA,CAAC,CACH,CACJ,CAAC;KACH;IACD,OAAO,QAAQ,CAAC;AAClB,CAAC,CAAC;AAEF,+DAA+D;AAC/D,eAAe;AACf,MAAM,CAAC,MAAM,kCAAkC,GAAG,CAChD,OAA4B,EACmB,EAAE;IACjD,IAAI,QAAQ,GAAkD,SAAS,CAAC;IACxE,QAAQ,GAAG,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,wBAAwB,CAAC;IAC7C,OAAO,QAAQ,CAAC;AAClB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\n// eslint-disable-next-line no-restricted-imports\nimport { Icon } from '@fluentui/react';\nimport { ControlBarButton, _DrawerMenuItemProps } from '@internal/react-components';\nimport React from 'react';\nimport {\n  CustomCallControlButtonCallback,\n  CustomCallControlButtonPlacement\n} from '../../../common/ControlBar/CustomButton';\nimport { CallControlDisplayType } from '../../../common/types/CommonCallControlOptions';\n/* @conditional-compile-remove(control-bar-button-injection) */\nimport { CallControlOptions } from '../../types/CallControlOptions';\n\n/** @private */\nexport type CustomButtons = { [key in CustomCallControlButtonPlacement]: JSX.Element | undefined };\n\n/** @private */\nexport const generateCustomControlBarButtons = (\n  onFetchCustomButtonProps?: CustomCallControlButtonCallback[],\n  displayType?: CallControlDisplayType\n): CustomButtons => {\n  const response = {\n    primary: undefined,\n    overflow: undefined,\n    secondary: undefined\n  };\n\n  if (!onFetchCustomButtonProps) {\n    return response;\n  }\n\n  const allButtonProps = onFetchCustomButtonProps.map((f) => f({ displayType }));\n\n  for (const key in response) {\n    response[key] = (\n      <>\n        {allButtonProps\n          .filter((buttonProps) => buttonProps.placement === key)\n          .map((buttonProps, i) => (\n            <ControlBarButton\n              ariaDescription={buttonProps.ariaDescription}\n              ariaLabel={buttonProps.ariaLabel}\n              disabled={buttonProps.disabled}\n              id={buttonProps.id}\n              key={buttonProps.key ?? `${buttonProps.placement}_${i}`}\n              onClick={buttonProps.onItemClick}\n              onRenderIcon={() => <Icon iconName={buttonProps.iconName ?? 'ControlButtonOptions'} />}\n              showLabel={buttonProps.showLabel}\n              text={buttonProps.text}\n              styles={buttonProps.styles}\n            />\n          ))}\n      </>\n    );\n  }\n  return response;\n};\n\n/* @conditional-compile-remove(control-bar-button-injection) */\n/** @private */\nexport const onFetchCustomButtonPropsTrampoline = (\n  options?: CallControlOptions\n): CustomCallControlButtonCallback[] | undefined => {\n  let response: CustomCallControlButtonCallback[] | undefined = undefined;\n  response = options?.onFetchCustomButtonProps;\n  return response;\n};\n\"../../../../../../react-components/src\""]}