@azure/communication-react 1.4.3-alpha-202212180014.0 → 1.4.3-alpha-202212210013.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/communication-react.d.ts +152 -225
- package/dist/dist-cjs/communication-react/index.js +423 -345
- package/dist/dist-cjs/communication-react/index.js.map +1 -1
- package/dist/dist-esm/acs-ui-common/src/telemetryVersion.js +1 -1
- package/dist/dist-esm/acs-ui-common/src/telemetryVersion.js.map +1 -1
- package/dist/dist-esm/calling-component-bindings/src/hooks/usePropsFor.d.ts +1 -2
- package/dist/dist-esm/calling-component-bindings/src/hooks/usePropsFor.js +0 -7
- package/dist/dist-esm/calling-component-bindings/src/hooks/usePropsFor.js.map +1 -1
- package/dist/dist-esm/communication-react/src/index.d.ts +2 -4
- package/dist/dist-esm/communication-react/src/index.js +1 -3
- package/dist/dist-esm/communication-react/src/index.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/DevicePermissions/SitePermissions.d.ts +105 -0
- package/dist/dist-esm/react-components/src/components/DevicePermissions/{DomainPermissions.js → SitePermissions.js} +25 -25
- package/dist/dist-esm/react-components/src/components/DevicePermissions/SitePermissions.js.map +1 -0
- package/dist/dist-esm/react-components/src/components/DevicePermissions/{DomainPermissionsScaffolding.d.ts → SitePermissionsScaffolding.d.ts} +12 -12
- package/dist/dist-esm/react-components/src/components/DevicePermissions/{DomainPermissionsScaffolding.js → SitePermissionsScaffolding.js} +3 -3
- package/dist/dist-esm/react-components/src/components/DevicePermissions/SitePermissionsScaffolding.js.map +1 -0
- package/dist/dist-esm/react-components/src/components/RemoteVideoTile.d.ts +1 -0
- package/dist/dist-esm/react-components/src/components/RemoteVideoTile.js +35 -6
- package/dist/dist-esm/react-components/src/components/RemoteVideoTile.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/VideoGallery/styles/RemoteVideoTile.styles.d.ts +9 -0
- package/dist/dist-esm/react-components/src/components/VideoGallery/styles/RemoteVideoTile.styles.js +22 -0
- package/dist/dist-esm/react-components/src/components/VideoGallery/styles/RemoteVideoTile.styles.js.map +1 -0
- package/dist/dist-esm/react-components/src/components/VideoGallery.js +7 -2
- package/dist/dist-esm/react-components/src/components/VideoGallery.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/index.d.ts +3 -3
- package/dist/dist-esm/react-components/src/components/index.js +1 -1
- package/dist/dist-esm/react-components/src/components/index.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/styles/{DomainPermissions.styles.d.ts → SitePermissions.styles.d.ts} +1 -1
- package/dist/dist-esm/react-components/src/components/styles/{DomainPermissions.styles.js → SitePermissions.styles.js} +1 -1
- package/dist/dist-esm/react-components/src/components/styles/SitePermissions.styles.js.map +1 -0
- package/dist/dist-esm/react-components/src/localization/LocalizationProvider.d.ts +25 -25
- package/dist/dist-esm/react-components/src/localization/LocalizationProvider.js.map +1 -1
- package/dist/dist-esm/react-components/src/localization/locales/de-DE/strings.json +1 -1
- package/dist/dist-esm/react-components/src/localization/locales/en-GB/strings.json +1 -1
- package/dist/dist-esm/react-components/src/localization/locales/en-US/strings.json +12 -12
- package/dist/dist-esm/react-components/src/localization/locales/es-ES/strings.json +1 -1
- package/dist/dist-esm/react-components/src/localization/locales/fr-FR/strings.json +1 -1
- package/dist/dist-esm/react-components/src/localization/locales/it-IT/strings.json +1 -1
- package/dist/dist-esm/react-components/src/localization/locales/ja-JP/strings.json +1 -1
- package/dist/dist-esm/react-components/src/localization/locales/ko-KR/strings.json +1 -1
- package/dist/dist-esm/react-components/src/localization/locales/nl-NL/strings.json +1 -1
- package/dist/dist-esm/react-components/src/localization/locales/pt-BR/strings.json +1 -1
- package/dist/dist-esm/react-components/src/localization/locales/ru-RU/strings.json +1 -1
- package/dist/dist-esm/react-components/src/localization/locales/tr-TR/strings.json +1 -1
- package/dist/dist-esm/react-components/src/localization/locales/zh-CN/strings.json +1 -1
- package/dist/dist-esm/react-components/src/localization/locales/zh-TW/strings.json +1 -1
- package/dist/dist-esm/react-components/src/theming/icons.d.ts +5 -5
- package/dist/dist-esm/react-components/src/theming/icons.js +16 -16
- package/dist/dist-esm/react-components/src/theming/icons.js.map +1 -1
- package/dist/dist-esm/react-components/src/theming/icons.styles.d.ts +1 -1
- package/dist/dist-esm/react-components/src/theming/icons.styles.js +1 -1
- package/dist/dist-esm/react-components/src/theming/icons.styles.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/CallComposite.d.ts +7 -11
- package/dist/dist-esm/react-composites/src/composites/CallComposite/CallComposite.js +4 -6
- package/dist/dist-esm/react-composites/src/composites/CallComposite/CallComposite.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/CallArrangement.d.ts +1 -0
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/CallArrangement.js +16 -15
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/CallArrangement.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/CallReadinessModal.js +12 -12
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/CallReadinessModal.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/ConfigurationPageCameraDropdown.d.ts +16 -0
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/{ConfigurationpageCameraDropdown.js → ConfigurationPageCameraDropdown.js} +3 -5
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/ConfigurationPageCameraDropdown.js.map +1 -0
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/{ConfigurationpageErrorBar.d.ts → ConfigurationPageErrorBar.d.ts} +3 -4
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/{ConfigurationpageErrorBar.js → ConfigurationPageErrorBar.js} +4 -6
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/ConfigurationPageErrorBar.js.map +1 -0
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/ConfigurationPageMicDropdown.d.ts +16 -0
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/{ConfigurationpageMicDropdown.js → ConfigurationPageMicDropdown.js} +3 -7
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/ConfigurationPageMicDropdown.js.map +1 -0
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/LocalDeviceSettings.d.ts +0 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/LocalDeviceSettings.js +7 -11
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/LocalDeviceSettings.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/MediaGallery.d.ts +1 -0
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/MediaGallery.js +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/MediaGallery.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/Microphone.js +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/Microphone.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/index.d.ts +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/index.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/pages/CallPage.js +4 -2
- package/dist/dist-esm/react-composites/src/composites/CallComposite/pages/CallPage.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/pages/ConfigurationPage.d.ts +2 -3
- package/dist/dist-esm/react-composites/src/composites/CallComposite/pages/ConfigurationPage.js +12 -24
- package/dist/dist-esm/react-composites/src/composites/CallComposite/pages/ConfigurationPage.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/styles/CallPage.styles.d.ts +4 -0
- package/dist/dist-esm/react-composites/src/composites/CallComposite/styles/CallPage.styles.js +8 -0
- package/dist/dist-esm/react-composites/src/composites/CallComposite/styles/CallPage.styles.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/CallWithChatComposite.d.ts +16 -7
- package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/CallWithChatComposite.js +22 -10
- package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/CallWithChatComposite.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/CallWithChatControlBar.js +2 -0
- package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/CallWithChatControlBar.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/common/HiddenFocusStartPoint.d.ts +8 -0
- package/dist/dist-esm/react-composites/src/composites/common/HiddenFocusStartPoint.js +40 -0
- package/dist/dist-esm/react-composites/src/composites/common/HiddenFocusStartPoint.js.map +1 -0
- package/dist/dist-esm/react-composites/src/composites/common/icons.d.ts +5 -5
- package/dist/dist-esm/react-composites/src/composites/common/styles/Pane.styles.js +1 -0
- package/dist/dist-esm/react-composites/src/composites/common/styles/Pane.styles.js.map +1 -1
- package/package.json +8 -8
- package/dist/dist-esm/react-components/src/components/DevicePermissions/DomainPermissions.d.ts +0 -105
- package/dist/dist-esm/react-components/src/components/DevicePermissions/DomainPermissions.js.map +0 -1
- package/dist/dist-esm/react-components/src/components/DevicePermissions/DomainPermissionsScaffolding.js.map +0 -1
- package/dist/dist-esm/react-components/src/components/styles/DomainPermissions.styles.js.map +0 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/ConfigurationpageCameraDropdown.d.ts +0 -17
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/ConfigurationpageCameraDropdown.js.map +0 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/ConfigurationpageErrorBar.js.map +0 -1
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/ConfigurationpageMicDropdown.d.ts +0 -17
- package/dist/dist-esm/react-composites/src/composites/CallComposite/components/ConfigurationpageMicDropdown.js.map +0 -1
package/dist/dist-esm/react-composites/src/composites/CallComposite/pages/ConfigurationPage.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"ConfigurationPage.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/pages/ConfigurationPage.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport React from 'react';\n/* @conditional-compile-remove(call-readiness) */\nimport { useState } from 'react';\nimport { useAdaptedSelector } from '../hooks/useAdaptedSelector';\nimport { useHandlers } from '../hooks/useHandlers';\nimport { LocalDeviceSettings } from '../components/LocalDeviceSettings';\nimport { StartCallButton } from '../components/StartCallButton';\nimport { devicePermissionSelector } from '../selectors/devicePermissionSelector';\nimport { useSelector } from '../hooks/useSelector';\nimport { DevicesButton, ErrorBar } from '@internal/react-components';\n/* @conditional-compile-remove(rooms) */\nimport { _usePermissions, _Permissions } from '@internal/react-components';\nimport { getCallingSelector } from '@internal/calling-component-bindings';\nimport { Stack } from '@fluentui/react';\nimport { LocalPreview } from '../components/LocalPreview';\nimport {\n callDetailsStyleDesktop,\n callDetailsStyleMobile,\n configurationStackTokensDesktop,\n configurationStackTokensMobile,\n configurationContainerStyleDesktop,\n configurationContainerStyleMobile,\n selectionContainerStyle,\n startCallButtonContainerStyleDesktop,\n startCallButtonContainerStyleMobile,\n startCallButtonStyleMobile,\n titleContainerStyleDesktop,\n titleContainerStyleMobile,\n callDetailsContainerStylesDesktop\n} from '../styles/CallConfiguration.styles';\nimport { useLocale } from '../../localization';\nimport { bannerNotificationStyles } from '../styles/CallPage.styles';\nimport { usePropsFor } from '../hooks/usePropsFor';\nimport { useAdapter } from '../adapter/CallAdapterProvider';\n/* @conditional-compile-remove(call-readiness) */\nimport { DevicePermissionRestrictions } from '../CallComposite';\nimport { ConfigurationpageErrorBar } from '../components/ConfigurationpageErrorBar';\n/* @conditional-compile-remove(call-readiness) */\nimport { getDevicePermissionState } from '../utils';\n/* @conditional-compile-remove(call-readiness) */\nimport { CallReadinessModal, CallReadinessModalFallBack } from '../components/CallReadinessModal';\n\n/**\n * @private\n */\nexport interface ConfigurationPageProps {\n mobileView: boolean;\n startCallHandler(): void;\n /* @conditional-compile-remove(call-readiness) */\n devicePermissions?: DevicePermissionRestrictions;\n /* @conditional-compile-remove(call-readiness) */\n onPermissionsTroubleshootingClick?: (permissionsState: {\n camera: PermissionState;\n microphone: PermissionState;\n }) => void;\n /* @conditional-compile-remove(call-readiness) */\n onNetworkingTroubleShootingClick?: () => void;\n /* @conditional-compile-remove(call-readiness) */\n callReadinessOptedIn?: boolean;\n}\n\n/**\n * @private\n */\nexport const ConfigurationPage = (props: ConfigurationPageProps): JSX.Element => {\n const {\n startCallHandler,\n mobileView,\n /* @conditional-compile-remove(call-readiness) */ devicePermissions,\n /* @conditional-compile-remove(call-readiness) */ onPermissionsTroubleshootingClick,\n /* @conditional-compile-remove(call-readiness) */ onNetworkingTroubleShootingClick,\n /* @conditional-compile-remove(call-readiness) */ callReadinessOptedIn = false\n } = props;\n\n const options = useAdaptedSelector(getCallingSelector(DevicesButton));\n const localDeviceSettingsHandlers = useHandlers(LocalDeviceSettings);\n const { video: cameraPermissionGranted, audio: microphonePermissionGranted } = useSelector(devicePermissionSelector);\n /* @conditional-compile-remove(call-readiness) */\n // use permission API to get video and audio permission state\n const [videoState, setVideoState] = useState<PermissionState | 'unsupported' | undefined>(undefined);\n /* @conditional-compile-remove(call-readiness) */\n const [audioState, setAudioState] = useState<PermissionState | 'unsupported' | undefined>(undefined);\n /* @conditional-compile-remove(call-readiness) */\n getDevicePermissionState(setVideoState, setAudioState);\n\n let errorBarProps = usePropsFor(ErrorBar);\n const adapter = useAdapter();\n const deviceState = adapter.getState().devices;\n /* @conditional-compile-remove(unsupported-browser) */\n const environmentInfo = adapter.getState().environmentInfo;\n\n let disableStartCallButton = !microphonePermissionGranted || deviceState.microphones?.length === 0;\n /* @conditional-compile-remove(rooms) */\n const rolePermissions = _usePermissions();\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) {\n errorBarProps = {\n ...errorBarProps,\n activeErrorMessages: errorBarProps.activeErrorMessages.filter(\n (e) => e.type !== 'callCameraAccessDenied' && e.type !== 'callCameraAccessDeniedSafari'\n )\n };\n }\n /* @conditional-compile-remove(rooms) */\n if (!rolePermissions.microphoneButton) {\n // If user's role permissions do not allow access to the microphone button then DO NOT disable the start call button\n // because microphone device permission is not needed for the user's role\n disableStartCallButton = false;\n }\n\n /* @conditional-compile-remove(call-readiness) */\n // Overrides role permissions if CallCompositeOptions devicePermissions are set\n if (devicePermissions) {\n if (\n ['doNotPrompt', 'optional'].includes(devicePermissions.camera) &&\n ['doNotPrompt', 'optional'].includes(devicePermissions.microphone)\n ) {\n disableStartCallButton = false;\n } else if (devicePermissions.camera === 'required') {\n disableStartCallButton = !cameraPermissionGranted || deviceState.cameras?.length === 0;\n }\n }\n\n const locale = useLocale();\n const title = (\n <Stack.Item className={mobileView ? titleContainerStyleMobile : titleContainerStyleDesktop}>\n {locale.strings.call.configurationPageTitle}\n </Stack.Item>\n );\n\n const callDescription = locale.strings.call.configurationPageCallDetails && (\n <Stack.Item className={mobileView ? callDetailsStyleMobile : callDetailsStyleDesktop}>\n {locale.strings.call.configurationPageCallDetails}\n </Stack.Item>\n );\n\n let mobileWithPreview = mobileView;\n /* @conditional-compile-remove(rooms) */\n mobileWithPreview = mobileWithPreview && rolePermissions.cameraButton;\n\n /* @conditional-compile-remove(call-readiness) */\n const permissionsState: {\n camera: PermissionState;\n microphone: PermissionState;\n } = {\n // fall back to using cameraPermissionGranted and microphonePermissionGranted if permission API is not supported\n camera:\n videoState && videoState !== 'unsupported'\n ? cameraPermissionGranted !== false\n ? videoState\n : 'denied'\n : cameraPermissionGranted !== false\n ? cameraPermissionGranted\n ? 'granted'\n : 'prompt'\n : 'denied',\n microphone:\n audioState && audioState !== 'unsupported'\n ? microphonePermissionGranted !== false\n ? audioState\n : 'denied'\n : microphonePermissionGranted !== false\n ? microphonePermissionGranted\n ? 'granted'\n : 'prompt'\n : 'denied'\n };\n /* @conditional-compile-remove(call-readiness) */\n const networkErrors = errorBarProps.activeErrorMessages.filter((message) => message.type === 'callNetworkQualityLow');\n\n /* @conditional-compile-remove(call-readiness) */\n const [isPermissionsModalDismissed, setIsPermissionsModalDismissed] = useState(true);\n\n // When permission API is not available, we want to show screen saying checking for access (disappears on its own)\n // then based on permission setting, we show permission denied or nothing\n /* @conditional-compile-remove(call-readiness) */\n const [minimumFallbackTimerElapsed, setMinimumFallbackTimerElapsed] = useState(false);\n /* @conditional-compile-remove(call-readiness) */\n setTimeout(() => {\n setMinimumFallbackTimerElapsed(true);\n }, 2000);\n /* @conditional-compile-remove(call-readiness) */\n const forceShowingCheckPermissions = !minimumFallbackTimerElapsed;\n\n return (\n <Stack className={mobileView ? configurationContainerStyleMobile : configurationContainerStyleDesktop}>\n <Stack styles={bannerNotificationStyles}>\n <ConfigurationpageErrorBar\n /* @conditional-compile-remove(call-readiness) */\n // show trouble shooting error bar when encountering network error/ permission error\n showTroubleShootingErrorBar={\n !cameraPermissionGranted || !microphonePermissionGranted || networkErrors.length > 0\n }\n /* @conditional-compile-remove(call-readiness) */\n permissionsState={permissionsState}\n /* @conditional-compile-remove(call-readiness) */\n onNetworkingTroubleShootingClick={onNetworkingTroubleShootingClick}\n /* @conditional-compile-remove(call-readiness) */\n onPermissionsTroubleshootingClick={onPermissionsTroubleshootingClick}\n errorBarProps={errorBarProps}\n /* @conditional-compile-remove(call-readiness) */\n callReadinessOptedIn={callReadinessOptedIn}\n />\n </Stack>\n {\n /* @conditional-compile-remove(call-readiness) */\n // show the following screen if permission API is availible (not unsupported) and videoState, audioState is assigned values\n callReadinessOptedIn &&\n videoState &&\n videoState !== 'unsupported' &&\n audioState &&\n audioState !== 'unsupported' && (\n <CallReadinessModal\n mobileView={mobileView}\n /* @conditional-compile-remove(unsupported-browser) */\n environmentInfo={environmentInfo}\n permissionsState={permissionsState}\n isPermissionsModalDismissed={isPermissionsModalDismissed}\n setIsPermissionsModalDismissed={setIsPermissionsModalDismissed}\n onPermissionsTroubleshootingClick={onPermissionsTroubleshootingClick}\n />\n )\n }\n\n {\n /* @conditional-compile-remove(call-readiness) */\n // show the following screen if permission API is not availible (unsupported) and videoState, audioState is assigned values\n callReadinessOptedIn &&\n videoState &&\n audioState &&\n (videoState === 'unsupported' || audioState === 'unsupported') && (\n <CallReadinessModalFallBack\n mobileView={mobileView}\n checkPermissionModalShowing={forceShowingCheckPermissions}\n permissionsState={permissionsState}\n isPermissionsModalDismissed={isPermissionsModalDismissed}\n /* @conditional-compile-remove(unsupported-browser) */\n environmentInfo={environmentInfo}\n setIsPermissionsModalDismissed={setIsPermissionsModalDismissed}\n onPermissionsTroubleshootingClick={onPermissionsTroubleshootingClick}\n />\n )\n }\n\n <Stack\n grow\n horizontal={!mobileWithPreview}\n horizontalAlign={mobileWithPreview ? 'stretch' : 'center'}\n verticalAlign=\"center\"\n tokens={mobileWithPreview ? configurationStackTokensMobile : configurationStackTokensDesktop}\n >\n {mobileWithPreview && (\n <Stack.Item>\n {title}\n {callDescription}\n </Stack.Item>\n )}\n {localPreviewTrampoline(\n mobileWithPreview,\n /* @conditional-compile-remove(rooms) */ !rolePermissions.cameraButton\n )}\n <Stack className={mobileView ? undefined : selectionContainerStyle}>\n {!mobileWithPreview && (\n <>\n <Stack.Item styles={callDetailsContainerStylesDesktop}>\n {title}\n {callDescription}\n </Stack.Item>\n <LocalDeviceSettings\n {...options}\n {...localDeviceSettingsHandlers}\n cameraPermissionGranted={cameraPermissionGrantedTrampoline(\n cameraPermissionGranted,\n /* @conditional-compile-remove(call-readiness) */ videoState\n )}\n microphonePermissionGranted={micPermissionGrantedTrampoline(\n microphonePermissionGranted,\n /* @conditional-compile-remove(call-readiness) */ audioState\n )}\n /* @conditional-compile-remove(call-readiness) */\n callReadinessOptedIn={callReadinessOptedIn}\n /* @conditional-compile-remove(call-readiness) */\n onClickEnableDevicePermission={() => {\n setIsPermissionsModalDismissed(true);\n }}\n />\n </>\n )}\n <Stack\n styles={mobileWithPreview ? startCallButtonContainerStyleMobile : startCallButtonContainerStyleDesktop}\n >\n <StartCallButton\n className={mobileWithPreview ? startCallButtonStyleMobile : undefined}\n onClick={startCallHandler}\n disabled={disableStartCallButton}\n />\n </Stack>\n </Stack>\n </Stack>\n </Stack>\n );\n};\n\nconst localPreviewTrampoline = (mobileView: boolean, doNotShow?: boolean): JSX.Element | undefined => {\n /* @conditional-compile-remove(rooms) */\n if (doNotShow) {\n return undefined;\n }\n return <LocalPreview mobileView={mobileView} showDevicesButton={mobileView} />;\n};\n\nconst cameraPermissionGrantedTrampoline = (\n cameraPermissionGranted: boolean | undefined,\n videoState?: PermissionState | 'unsupported' | undefined\n): boolean | undefined => {\n /* @conditional-compile-remove(call-readiness) */\n return videoState && videoState !== 'unsupported' ? videoState === 'granted' : cameraPermissionGranted;\n\n return cameraPermissionGranted;\n};\n\nconst micPermissionGrantedTrampoline = (\n microphonePermissionGranted: boolean | undefined,\n audioState?: PermissionState | 'unsupported' | undefined\n): boolean | undefined => {\n /* @conditional-compile-remove(call-readiness) */\n return audioState && audioState !== 'unsupported' ? audioState === 'granted' : microphonePermissionGranted;\n\n return microphonePermissionGranted;\n};\n\"../../../../../react-components/src\"\"../../../../../calling-component-bindings/src\""]}
|
1
|
+
{"version":3,"file":"ConfigurationPage.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/pages/ConfigurationPage.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport React from 'react';\n/* @conditional-compile-remove(call-readiness) */\nimport { useState } from 'react';\nimport { useAdaptedSelector } from '../hooks/useAdaptedSelector';\nimport { useHandlers } from '../hooks/useHandlers';\nimport { LocalDeviceSettings } from '../components/LocalDeviceSettings';\nimport { StartCallButton } from '../components/StartCallButton';\nimport { devicePermissionSelector } from '../selectors/devicePermissionSelector';\nimport { useSelector } from '../hooks/useSelector';\nimport { DevicesButton, ErrorBar } from '@internal/react-components';\n/* @conditional-compile-remove(rooms) */\nimport { _usePermissions, _Permissions } from '@internal/react-components';\nimport { getCallingSelector } from '@internal/calling-component-bindings';\nimport { Stack } from '@fluentui/react';\nimport { LocalPreview } from '../components/LocalPreview';\nimport {\n callDetailsStyleDesktop,\n callDetailsStyleMobile,\n configurationStackTokensDesktop,\n configurationStackTokensMobile,\n configurationContainerStyleDesktop,\n configurationContainerStyleMobile,\n selectionContainerStyle,\n startCallButtonContainerStyleDesktop,\n startCallButtonContainerStyleMobile,\n startCallButtonStyleMobile,\n titleContainerStyleDesktop,\n titleContainerStyleMobile,\n callDetailsContainerStylesDesktop\n} from '../styles/CallConfiguration.styles';\nimport { useLocale } from '../../localization';\nimport { bannerNotificationStyles } from '../styles/CallPage.styles';\nimport { usePropsFor } from '../hooks/usePropsFor';\nimport { useAdapter } from '../adapter/CallAdapterProvider';\n/* @conditional-compile-remove(call-readiness) */\nimport { DeviceCheckOptions } from '../CallComposite';\nimport { ConfigurationPageErrorBar } from '../components/ConfigurationPageErrorBar';\n/* @conditional-compile-remove(call-readiness) */\nimport { getDevicePermissionState } from '../utils';\n/* @conditional-compile-remove(call-readiness) */\nimport { CallReadinessModal, CallReadinessModalFallBack } from '../components/CallReadinessModal';\n\n/**\n * @private\n */\nexport interface ConfigurationPageProps {\n mobileView: boolean;\n startCallHandler(): void;\n /* @conditional-compile-remove(call-readiness) */\n deviceChecks?: DeviceCheckOptions;\n /* @conditional-compile-remove(call-readiness) */\n onPermissionsTroubleshootingClick?: (permissionsState: {\n camera: PermissionState;\n microphone: PermissionState;\n }) => void;\n /* @conditional-compile-remove(call-readiness) */\n onNetworkingTroubleShootingClick?: () => void;\n}\n\n/**\n * @private\n */\nexport const ConfigurationPage = (props: ConfigurationPageProps): JSX.Element => {\n const {\n startCallHandler,\n mobileView,\n /* @conditional-compile-remove(call-readiness) */ deviceChecks,\n /* @conditional-compile-remove(call-readiness) */ onPermissionsTroubleshootingClick,\n /* @conditional-compile-remove(call-readiness) */ onNetworkingTroubleShootingClick\n } = props;\n\n const options = useAdaptedSelector(getCallingSelector(DevicesButton));\n const localDeviceSettingsHandlers = useHandlers(LocalDeviceSettings);\n const { video: cameraPermissionGranted, audio: microphonePermissionGranted } = useSelector(devicePermissionSelector);\n /* @conditional-compile-remove(call-readiness) */\n // use permission API to get video and audio permission state\n const [videoState, setVideoState] = useState<PermissionState | 'unsupported' | undefined>(undefined);\n /* @conditional-compile-remove(call-readiness) */\n const [audioState, setAudioState] = useState<PermissionState | 'unsupported' | undefined>(undefined);\n /* @conditional-compile-remove(call-readiness) */\n getDevicePermissionState(setVideoState, setAudioState);\n\n let errorBarProps = usePropsFor(ErrorBar);\n const adapter = useAdapter();\n const deviceState = adapter.getState().devices;\n /* @conditional-compile-remove(unsupported-browser) */\n const environmentInfo = adapter.getState().environmentInfo;\n\n let disableStartCallButton = !microphonePermissionGranted || deviceState.microphones?.length === 0;\n /* @conditional-compile-remove(rooms) */\n const rolePermissions = _usePermissions();\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) {\n errorBarProps = {\n ...errorBarProps,\n activeErrorMessages: errorBarProps.activeErrorMessages.filter(\n (e) => e.type !== 'callCameraAccessDenied' && e.type !== 'callCameraAccessDeniedSafari'\n )\n };\n }\n /* @conditional-compile-remove(rooms) */\n if (!rolePermissions.microphoneButton) {\n // If user's role permissions do not allow access to the microphone button then DO NOT disable the start call button\n // because microphone device permission is not needed for the user's role\n disableStartCallButton = false;\n }\n\n /* @conditional-compile-remove(call-readiness) */\n // Overrides role permissions if CallCompositeOptions deviceChecks are set\n if (deviceChecks) {\n if (\n ['doNotPrompt', 'optional'].includes(deviceChecks.camera) &&\n ['doNotPrompt', 'optional'].includes(deviceChecks.microphone)\n ) {\n disableStartCallButton = false;\n } else if (deviceChecks.camera === 'required') {\n disableStartCallButton = !cameraPermissionGranted || deviceState.cameras?.length === 0;\n }\n }\n\n const locale = useLocale();\n const title = (\n <Stack.Item className={mobileView ? titleContainerStyleMobile : titleContainerStyleDesktop}>\n {locale.strings.call.configurationPageTitle}\n </Stack.Item>\n );\n\n const callDescription = locale.strings.call.configurationPageCallDetails && (\n <Stack.Item className={mobileView ? callDetailsStyleMobile : callDetailsStyleDesktop}>\n {locale.strings.call.configurationPageCallDetails}\n </Stack.Item>\n );\n\n let mobileWithPreview = mobileView;\n /* @conditional-compile-remove(rooms) */\n mobileWithPreview = mobileWithPreview && rolePermissions.cameraButton;\n\n /* @conditional-compile-remove(call-readiness) */\n const permissionsState: {\n camera: PermissionState;\n microphone: PermissionState;\n } = {\n // fall back to using cameraPermissionGranted and microphonePermissionGranted if permission API is not supported\n camera:\n videoState && videoState !== 'unsupported'\n ? cameraPermissionGranted !== false\n ? videoState\n : 'denied'\n : cameraPermissionGranted !== false\n ? cameraPermissionGranted\n ? 'granted'\n : 'prompt'\n : 'denied',\n microphone:\n audioState && audioState !== 'unsupported'\n ? microphonePermissionGranted !== false\n ? audioState\n : 'denied'\n : microphonePermissionGranted !== false\n ? microphonePermissionGranted\n ? 'granted'\n : 'prompt'\n : 'denied'\n };\n /* @conditional-compile-remove(call-readiness) */\n const networkErrors = errorBarProps.activeErrorMessages.filter((message) => message.type === 'callNetworkQualityLow');\n\n /* @conditional-compile-remove(call-readiness) */\n const [isPermissionsModalDismissed, setIsPermissionsModalDismissed] = useState(true);\n\n // When permission API is not available, we want to show screen saying checking for access (disappears on its own)\n // then based on permission setting, we show permission denied or nothing\n /* @conditional-compile-remove(call-readiness) */\n const [minimumFallbackTimerElapsed, setMinimumFallbackTimerElapsed] = useState(false);\n /* @conditional-compile-remove(call-readiness) */\n setTimeout(() => {\n setMinimumFallbackTimerElapsed(true);\n }, 2000);\n /* @conditional-compile-remove(call-readiness) */\n const forceShowingCheckPermissions = !minimumFallbackTimerElapsed;\n\n return (\n <Stack className={mobileView ? configurationContainerStyleMobile : configurationContainerStyleDesktop}>\n <Stack styles={bannerNotificationStyles}>\n <ConfigurationPageErrorBar\n /* @conditional-compile-remove(call-readiness) */\n // show trouble shooting error bar when encountering network error/ permission error\n showTroubleShootingErrorBar={\n !cameraPermissionGranted || !microphonePermissionGranted || networkErrors.length > 0\n }\n /* @conditional-compile-remove(call-readiness) */\n permissionsState={permissionsState}\n /* @conditional-compile-remove(call-readiness) */\n onNetworkingTroubleShootingClick={onNetworkingTroubleShootingClick}\n /* @conditional-compile-remove(call-readiness) */\n onPermissionsTroubleshootingClick={onPermissionsTroubleshootingClick}\n errorBarProps={errorBarProps}\n />\n </Stack>\n {\n /* @conditional-compile-remove(call-readiness) */\n // show the following screen if permission API is availible (not unsupported) and videoState, audioState is assigned values\n videoState && videoState !== 'unsupported' && audioState && audioState !== 'unsupported' && (\n <CallReadinessModal\n mobileView={mobileView}\n /* @conditional-compile-remove(unsupported-browser) */\n environmentInfo={environmentInfo}\n permissionsState={permissionsState}\n isPermissionsModalDismissed={isPermissionsModalDismissed}\n setIsPermissionsModalDismissed={setIsPermissionsModalDismissed}\n onPermissionsTroubleshootingClick={onPermissionsTroubleshootingClick}\n />\n )\n }\n\n {\n /* @conditional-compile-remove(call-readiness) */\n // show the following screen if permission API is not availible (unsupported) and videoState, audioState is assigned values\n videoState && audioState && (videoState === 'unsupported' || audioState === 'unsupported') && (\n <CallReadinessModalFallBack\n mobileView={mobileView}\n checkPermissionModalShowing={forceShowingCheckPermissions}\n permissionsState={permissionsState}\n isPermissionsModalDismissed={isPermissionsModalDismissed}\n /* @conditional-compile-remove(unsupported-browser) */\n environmentInfo={environmentInfo}\n setIsPermissionsModalDismissed={setIsPermissionsModalDismissed}\n onPermissionsTroubleshootingClick={onPermissionsTroubleshootingClick}\n />\n )\n }\n\n <Stack\n grow\n horizontal={!mobileWithPreview}\n horizontalAlign={mobileWithPreview ? 'stretch' : 'center'}\n verticalAlign=\"center\"\n tokens={mobileWithPreview ? configurationStackTokensMobile : configurationStackTokensDesktop}\n >\n {mobileWithPreview && (\n <Stack.Item>\n {title}\n {callDescription}\n </Stack.Item>\n )}\n {localPreviewTrampoline(\n mobileWithPreview,\n /* @conditional-compile-remove(rooms) */ !rolePermissions.cameraButton\n )}\n <Stack className={mobileView ? undefined : selectionContainerStyle}>\n {!mobileWithPreview && (\n <>\n <Stack.Item styles={callDetailsContainerStylesDesktop}>\n {title}\n {callDescription}\n </Stack.Item>\n <LocalDeviceSettings\n {...options}\n {...localDeviceSettingsHandlers}\n cameraPermissionGranted={cameraPermissionGrantedTrampoline(\n cameraPermissionGranted,\n /* @conditional-compile-remove(call-readiness) */ videoState\n )}\n microphonePermissionGranted={micPermissionGrantedTrampoline(\n microphonePermissionGranted,\n /* @conditional-compile-remove(call-readiness) */ audioState\n )}\n /* @conditional-compile-remove(call-readiness) */\n onClickEnableDevicePermission={() => {\n setIsPermissionsModalDismissed(true);\n }}\n />\n </>\n )}\n <Stack\n styles={mobileWithPreview ? startCallButtonContainerStyleMobile : startCallButtonContainerStyleDesktop}\n >\n <StartCallButton\n className={mobileWithPreview ? startCallButtonStyleMobile : undefined}\n onClick={startCallHandler}\n disabled={disableStartCallButton}\n />\n </Stack>\n </Stack>\n </Stack>\n </Stack>\n );\n};\n\nconst localPreviewTrampoline = (mobileView: boolean, doNotShow?: boolean): JSX.Element | undefined => {\n /* @conditional-compile-remove(rooms) */\n if (doNotShow) {\n return undefined;\n }\n return <LocalPreview mobileView={mobileView} showDevicesButton={mobileView} />;\n};\n\nconst cameraPermissionGrantedTrampoline = (\n cameraPermissionGranted: boolean | undefined,\n videoState?: PermissionState | 'unsupported' | undefined\n): boolean | undefined => {\n /* @conditional-compile-remove(call-readiness) */\n return videoState && videoState !== 'unsupported' ? videoState === 'granted' : cameraPermissionGranted;\n\n return cameraPermissionGranted;\n};\n\nconst micPermissionGrantedTrampoline = (\n microphonePermissionGranted: boolean | undefined,\n audioState?: PermissionState | 'unsupported' | undefined\n): boolean | undefined => {\n /* @conditional-compile-remove(call-readiness) */\n return audioState && audioState !== 'unsupported' ? audioState === 'granted' : microphonePermissionGranted;\n\n return microphonePermissionGranted;\n};\n\"../../../../../react-components/src\"\"../../../../../calling-component-bindings/src\""]}
|
package/dist/dist-esm/react-composites/src/composites/CallComposite/styles/CallPage.styles.d.ts
CHANGED
@@ -27,4 +27,8 @@ export declare const notificationsContainerStyles: IStackStyles;
|
|
27
27
|
* @private
|
28
28
|
*/
|
29
29
|
export declare const bannerNotificationStyles: IStackStyles;
|
30
|
+
/**
|
31
|
+
* @private
|
32
|
+
*/
|
33
|
+
export declare const callArrangementContainerStyles: IStackStyles;
|
30
34
|
//# sourceMappingURL=CallPage.styles.d.ts.map
|
package/dist/dist-esm/react-composites/src/composites/CallComposite/styles/CallPage.styles.js
CHANGED
@@ -66,4 +66,12 @@ export const bannerNotificationStyles = {
|
|
66
66
|
pointerEvents: 'auto' // to allow the dismissal or error and warning bars in the notification container
|
67
67
|
}
|
68
68
|
};
|
69
|
+
/**
|
70
|
+
* @private
|
71
|
+
*/
|
72
|
+
export const callArrangementContainerStyles = {
|
73
|
+
root: {
|
74
|
+
flexDirection: 'column-reverse' // to allow first initial keyboard focus on ControlBar
|
75
|
+
}
|
76
|
+
};
|
69
77
|
//# sourceMappingURL=CallPage.styles.js.map
|
package/dist/dist-esm/react-composites/src/composites/CallComposite/styles/CallPage.styles.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"CallPage.styles.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/styles/CallPage.styles.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAA0C,WAAW,EAAE,MAAM,iBAAiB,CAAC;AACtF,OAAO,EAAE,yBAAyB,EAAE,MAAM,uBAAuB,CAAC;AAElE,MAAM,qBAAqB,GAAG,CAAC,CAAC;AAChC,2HAA2H;AAC3H,MAAM,mBAAmB,GAAG,qBAAqB,GAAG,CAAC,CAAC;AACtD,6GAA6G;AAC7G,MAAM,8BAA8B,GAAG,IAAI,CAAC,GAAG,CAAC,mBAAmB,EAAE,qBAAqB,CAAC,GAAG,CAAC,CAAC;AAEhG;;GAEG;AACH,MAAM,CAAC,MAAM,2BAA2B,GAAG,WAAW,CAAC,yBAAyB,EAAE;IAChF,MAAM,EAAE,mBAAmB;CAC5B,CAAC,CAAC;AAEH,MAAM,cAAc,GAAW;IAC7B,KAAK,EAAE,MAAM;IACb,QAAQ,EAAE,UAAU;IACpB,SAAS,EAAE,OAAO,CAAC,qDAAqD;CACzE,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAG,WAAW,iCAC3C,cAAc,KACjB,QAAQ,EAAE,OAAO,IACjB,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,WAAW,iCAC1C,cAAc,KACjB,QAAQ,EAAE,SAAS,IACnB,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,4BAA4B,GAAG,CAAC,eAAuB,EAAgB,EAAE,CAAC,CAAC;IACtF,IAAI,EAAE;QACJ,MAAM,EAAE,qBAAqB;QAC7B,KAAK,EAAE,MAAM;QACb,UAAU,EAAE,eAAe;KAC5B;CACF,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,2BAA2B,GAAqB;IAC3D,IAAI,EAAE;QACJ,MAAM,EAAE,MAAM;KACf;CACF,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,4BAA4B,GAAiB;IACxD,IAAI,EAAE;QACJ,KAAK,EAAE,MAAM;QACb,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,CAAC;QACN,IAAI,EAAE,CAAC;QACP,OAAO,EAAE,MAAM;QACf,MAAM,EAAE,8BAA8B;QACtC,aAAa,EAAE,MAAM,CAAC,2EAA2E;KAClG;CACF,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAiB;IACpD,IAAI,EAAE;QACJ,aAAa,EAAE,MAAM,CAAC,iFAAiF;KACxG;CACF,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { IStackItemStyles, IStackStyles, IStyle, mergeStyles } from '@fluentui/react';\nimport { controlBarContainerStyles } from './CallControls.styles';\n\nconst VIDEO_GALLERY_Z_INDEX = 1;\n// The control bar must be in a higher z-band than the video gallery so the drop shadow appears on top of the video gallery\nconst CONTROL_BAR_Z_INDEX = VIDEO_GALLERY_Z_INDEX + 1;\n// The notification container should be in the highest z-band to ensure it shows on top of all other content.\nconst NOTIFICATION_CONTAINER_Z_INDEX = Math.max(CONTROL_BAR_Z_INDEX, VIDEO_GALLERY_Z_INDEX) + 1;\n\n/**\n * @private\n */\nexport const callControlsContainerStyles = mergeStyles(controlBarContainerStyles, {\n zIndex: CONTROL_BAR_Z_INDEX\n});\n\nconst containerStyle: IStyle = {\n width: '100%',\n position: 'relative',\n minHeight: '13rem' // linked to minimum space allocated to media gallery\n};\n\n/**\n * @private\n */\nexport const containerStyleDesktop = mergeStyles({\n ...containerStyle,\n minWidth: '30rem'\n});\n\n/**\n * @private\n */\nexport const containerStyleMobile = mergeStyles({\n ...containerStyle,\n minWidth: '17.5rem'\n});\n\n/**\n * @private\n */\nexport const galleryParentContainerStyles = (backgroundColor: string): IStackStyles => ({\n root: {\n zIndex: VIDEO_GALLERY_Z_INDEX,\n width: '100%',\n background: backgroundColor\n }\n});\n\n/**\n * @private\n */\nexport const mediaGalleryContainerStyles: IStackItemStyles = {\n root: {\n height: '100%'\n }\n};\n\n/**\n * @private\n */\nexport const notificationsContainerStyles: IStackStyles = {\n root: {\n width: '100%',\n position: 'absolute',\n top: 0,\n left: 0,\n padding: '1rem',\n zIndex: NOTIFICATION_CONTAINER_Z_INDEX,\n pointerEvents: 'none' // to allow the operation of controls underneath the notification container\n }\n};\n\n/**\n * @private\n */\nexport const bannerNotificationStyles: IStackStyles = {\n root: {\n pointerEvents: 'auto' // to allow the dismissal or error and warning bars in the notification container\n }\n};\n"]}
|
1
|
+
{"version":3,"file":"CallPage.styles.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/styles/CallPage.styles.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAA0C,WAAW,EAAE,MAAM,iBAAiB,CAAC;AACtF,OAAO,EAAE,yBAAyB,EAAE,MAAM,uBAAuB,CAAC;AAElE,MAAM,qBAAqB,GAAG,CAAC,CAAC;AAChC,2HAA2H;AAC3H,MAAM,mBAAmB,GAAG,qBAAqB,GAAG,CAAC,CAAC;AACtD,6GAA6G;AAC7G,MAAM,8BAA8B,GAAG,IAAI,CAAC,GAAG,CAAC,mBAAmB,EAAE,qBAAqB,CAAC,GAAG,CAAC,CAAC;AAEhG;;GAEG;AACH,MAAM,CAAC,MAAM,2BAA2B,GAAG,WAAW,CAAC,yBAAyB,EAAE;IAChF,MAAM,EAAE,mBAAmB;CAC5B,CAAC,CAAC;AAEH,MAAM,cAAc,GAAW;IAC7B,KAAK,EAAE,MAAM;IACb,QAAQ,EAAE,UAAU;IACpB,SAAS,EAAE,OAAO,CAAC,qDAAqD;CACzE,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAG,WAAW,iCAC3C,cAAc,KACjB,QAAQ,EAAE,OAAO,IACjB,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,WAAW,iCAC1C,cAAc,KACjB,QAAQ,EAAE,SAAS,IACnB,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,4BAA4B,GAAG,CAAC,eAAuB,EAAgB,EAAE,CAAC,CAAC;IACtF,IAAI,EAAE;QACJ,MAAM,EAAE,qBAAqB;QAC7B,KAAK,EAAE,MAAM;QACb,UAAU,EAAE,eAAe;KAC5B;CACF,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,2BAA2B,GAAqB;IAC3D,IAAI,EAAE;QACJ,MAAM,EAAE,MAAM;KACf;CACF,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,4BAA4B,GAAiB;IACxD,IAAI,EAAE;QACJ,KAAK,EAAE,MAAM;QACb,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,CAAC;QACN,IAAI,EAAE,CAAC;QACP,OAAO,EAAE,MAAM;QACf,MAAM,EAAE,8BAA8B;QACtC,aAAa,EAAE,MAAM,CAAC,2EAA2E;KAClG;CACF,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAiB;IACpD,IAAI,EAAE;QACJ,aAAa,EAAE,MAAM,CAAC,iFAAiF;KACxG;CACF,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,8BAA8B,GAAiB;IAC1D,IAAI,EAAE;QACJ,aAAa,EAAE,gBAAgB,CAAC,sDAAsD;KACvF;CACF,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { IStackItemStyles, IStackStyles, IStyle, mergeStyles } from '@fluentui/react';\nimport { controlBarContainerStyles } from './CallControls.styles';\n\nconst VIDEO_GALLERY_Z_INDEX = 1;\n// The control bar must be in a higher z-band than the video gallery so the drop shadow appears on top of the video gallery\nconst CONTROL_BAR_Z_INDEX = VIDEO_GALLERY_Z_INDEX + 1;\n// The notification container should be in the highest z-band to ensure it shows on top of all other content.\nconst NOTIFICATION_CONTAINER_Z_INDEX = Math.max(CONTROL_BAR_Z_INDEX, VIDEO_GALLERY_Z_INDEX) + 1;\n\n/**\n * @private\n */\nexport const callControlsContainerStyles = mergeStyles(controlBarContainerStyles, {\n zIndex: CONTROL_BAR_Z_INDEX\n});\n\nconst containerStyle: IStyle = {\n width: '100%',\n position: 'relative',\n minHeight: '13rem' // linked to minimum space allocated to media gallery\n};\n\n/**\n * @private\n */\nexport const containerStyleDesktop = mergeStyles({\n ...containerStyle,\n minWidth: '30rem'\n});\n\n/**\n * @private\n */\nexport const containerStyleMobile = mergeStyles({\n ...containerStyle,\n minWidth: '17.5rem'\n});\n\n/**\n * @private\n */\nexport const galleryParentContainerStyles = (backgroundColor: string): IStackStyles => ({\n root: {\n zIndex: VIDEO_GALLERY_Z_INDEX,\n width: '100%',\n background: backgroundColor\n }\n});\n\n/**\n * @private\n */\nexport const mediaGalleryContainerStyles: IStackItemStyles = {\n root: {\n height: '100%'\n }\n};\n\n/**\n * @private\n */\nexport const notificationsContainerStyles: IStackStyles = {\n root: {\n width: '100%',\n position: 'absolute',\n top: 0,\n left: 0,\n padding: '1rem',\n zIndex: NOTIFICATION_CONTAINER_Z_INDEX,\n pointerEvents: 'none' // to allow the operation of controls underneath the notification container\n }\n};\n\n/**\n * @private\n */\nexport const bannerNotificationStyles: IStackStyles = {\n root: {\n pointerEvents: 'auto' // to allow the dismissal or error and warning bars in the notification container\n }\n};\n\n/**\n * @private\n */\nexport const callArrangementContainerStyles: IStackStyles = {\n root: {\n flexDirection: 'column-reverse' // to allow first initial keyboard focus on ControlBar\n }\n};\n"]}
|
@@ -6,7 +6,7 @@ import { BaseCompositeProps } from '../common/BaseComposite';
|
|
6
6
|
import { CallWithChatCompositeIcons } from '../common/icons';
|
7
7
|
import { FileSharingOptions } from '../ChatComposite';
|
8
8
|
import { CustomCallWithChatControlButtonCallback } from './CustomButton';
|
9
|
-
import {
|
9
|
+
import { DeviceCheckOptions } from '../CallComposite/CallComposite';
|
10
10
|
/**
|
11
11
|
* Props required for the {@link CallWithChatComposite}
|
12
12
|
*
|
@@ -53,10 +53,11 @@ export declare type CallWithChatCompositeOptions = {
|
|
53
53
|
*/
|
54
54
|
fileSharing?: FileSharingOptions;
|
55
55
|
/**
|
56
|
-
* Device
|
57
|
-
*
|
56
|
+
* Device permissions check options for your call.
|
57
|
+
* Here you can choose what device permissions you prompt the user for,
|
58
|
+
* as well as what device permissions must be accepted before starting a call.
|
58
59
|
*/
|
59
|
-
|
60
|
+
deviceChecks?: DeviceCheckOptions;
|
60
61
|
/**
|
61
62
|
* Callback you may provide to supply users with further steps to troubleshoot why they have been
|
62
63
|
* unable to grant your site the required permissions for the call.
|
@@ -89,10 +90,18 @@ export declare type CallWithChatCompositeOptions = {
|
|
89
90
|
*/
|
90
91
|
onNetworkingTroubleShootingClick?: () => void;
|
91
92
|
/**
|
92
|
-
*
|
93
|
-
*
|
93
|
+
* Callback you may provide to supply users with a provided page to showcase supported browsers by ACS.
|
94
|
+
*
|
95
|
+
* @example
|
96
|
+
* ```ts
|
97
|
+
* onBrowserTroubleShootingClick?: () =>
|
98
|
+
* window.open('https://contoso.com/browser-troubleshooting', '_blank');
|
99
|
+
* ```
|
100
|
+
*
|
101
|
+
* @remarks
|
102
|
+
* if this is not supplied, the composite will not show a unsupported browser page.
|
94
103
|
*/
|
95
|
-
|
104
|
+
onEnvironmentInfoTroubleshootingClick?: () => void;
|
96
105
|
};
|
97
106
|
/**
|
98
107
|
* {@link CallWithChatComposite} Call controls to show or hide buttons on the calling control bar.
|
package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/CallWithChatComposite.js
CHANGED
@@ -141,19 +141,33 @@ const CallWithChatScreen = (props) => {
|
|
141
141
|
}), [callWithChatStrings]);
|
142
142
|
/* @conditional-compile-remove(PSTN-calls) */
|
143
143
|
const alternateCallerId = callAdapter.getState().alternateCallerId;
|
144
|
+
const callCompositeOptions = useMemo(() => ({
|
145
|
+
callControls: false,
|
146
|
+
/* @conditional-compile-remove(call-readiness) */
|
147
|
+
deviceChecks: props.deviceChecks,
|
148
|
+
/* @conditional-compile-remove(call-readiness) */
|
149
|
+
onNetworkingTroubleShootingClick: props.onNetworkingTroubleShootingClick,
|
150
|
+
/* @conditional-compile-remove(call-readiness) */
|
151
|
+
onPermissionsTroubleshootingClick: props.onPermissionsTroubleshootingClick,
|
152
|
+
/* @conditional-compile-remove(unsupported-browser) */
|
153
|
+
onEnvironmentInfoTroubleshootingClick: props.onEnvironmentInfoTroubleshootingClick
|
154
|
+
}), [
|
155
|
+
/* @conditional-compile-remove(call-readiness) */
|
156
|
+
props.deviceChecks,
|
157
|
+
/* @conditional-compile-remove(unsupported-browser) */
|
158
|
+
props.onEnvironmentInfoTroubleshootingClick,
|
159
|
+
/* @conditional-compile-remove(call-readiness) */
|
160
|
+
props.onNetworkingTroubleShootingClick,
|
161
|
+
/* @conditional-compile-remove(call-readiness) */
|
162
|
+
props.onPermissionsTroubleshootingClick
|
163
|
+
]);
|
144
164
|
return (React.createElement("div", { ref: containerRef, className: mergeStyles(containerDivStyles) },
|
145
165
|
React.createElement(Stack, { verticalFill: true, grow: true, styles: compositeOuterContainerStyles, id: compositeParentDivId },
|
146
166
|
React.createElement(Stack, { horizontal: true, grow: true },
|
147
167
|
React.createElement(Stack.Item, { grow: true, styles: callCompositeContainerStyles,
|
148
168
|
// Perf: Instead of removing the video gallery from DOM, we hide it to prevent re-renders.
|
149
169
|
style: callCompositeContainerCSS },
|
150
|
-
React.createElement(CallComposite, Object.assign({}, props, { formFactor: formFactor, options:
|
151
|
-
callControls: false,
|
152
|
-
/* @conditional-compile-remove(call-readiness) */
|
153
|
-
devicePermissions: props.devicePermissions,
|
154
|
-
/* @conditional-compile-remove(call-readiness) */
|
155
|
-
callReadinessOptedIn: props.callReadinessOptedIn
|
156
|
-
}, adapter: callAdapter, fluentTheme: fluentTheme }))),
|
170
|
+
React.createElement(CallComposite, Object.assign({}, props, { formFactor: formFactor, options: callCompositeOptions, adapter: callAdapter, fluentTheme: fluentTheme }))),
|
157
171
|
chatProps.adapter && callAdapter && hasJoinedCall && (React.createElement(CallWithChatPane, { chatCompositeProps: chatProps, inviteLink: props.joinInvitationURL, onClose: closePane, chatAdapter: chatProps.adapter, callAdapter: callAdapter, onFetchAvatarPersonaData: props.onFetchAvatarPersonaData, onFetchParticipantMenuItems: props.onFetchParticipantMenuItems, onChatButtonClicked: showShowChatTabHeaderButton(props.callControls) ? selectChat : undefined, onPeopleButtonClicked: showShowPeopleTabHeaderButton(props.callControls) ? selectPeople : undefined, modalLayerHostId: modalLayerHostId, mobileView: mobileView, activePane: activePane,
|
158
172
|
/* @conditional-compile-remove(file-sharing) */
|
159
173
|
fileSharing: props.fileSharing, rtl: props.rtl, callControls: typeof props.callControls !== 'boolean' ? props.callControls : undefined }))),
|
@@ -192,9 +206,7 @@ export const CallWithChatComposite = (props) => {
|
|
192
206
|
return (React.createElement(BaseProvider, { fluentTheme: fluentTheme, rtl: rtl, locale: props.locale, icons: props.icons },
|
193
207
|
React.createElement(CallWithChatScreen, Object.assign({}, props, {
|
194
208
|
/* @conditional-compile-remove(call-readiness) */
|
195
|
-
|
196
|
-
/* @conditional-compile-remove(call-readiness) */
|
197
|
-
callReadinessOptedIn: options === null || options === void 0 ? void 0 : options.callReadinessOptedIn, callWithChatAdapter: adapter, formFactor: formFactor, callControls: options === null || options === void 0 ? void 0 : options.callControls, joinInvitationURL: joinInvitationURL, fluentTheme: fluentTheme,
|
209
|
+
deviceChecks: options === null || options === void 0 ? void 0 : options.deviceChecks, callWithChatAdapter: adapter, formFactor: formFactor, callControls: options === null || options === void 0 ? void 0 : options.callControls, joinInvitationURL: joinInvitationURL, fluentTheme: fluentTheme,
|
198
210
|
/* @conditional-compile-remove(file-sharing) */
|
199
211
|
fileSharing: options === null || options === void 0 ? void 0 : options.fileSharing }))));
|
200
212
|
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"CallWithChatComposite.js","sourceRoot":"","sources":["../../../../../../../react-composites/src/composites/CallWithChatComposite/CallWithChatComposite.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport React, { useCallback, useState, useMemo, useEffect, useRef } from 'react';\nimport { LayerHost, mergeStyles, PartialTheme, Stack, Theme } from '@fluentui/react';\nimport { CallComposite, CallCompositePage, CallControlDisplayType } from '../CallComposite';\nimport { CallAdapterProvider } from '../CallComposite/adapter/CallAdapterProvider';\nimport { CallWithChatControlBar } from './CallWithChatControlBar';\nimport { CallState } from '@azure/communication-calling';\nimport {\n callCompositeContainerStyles,\n compositeOuterContainerStyles,\n controlBarContainerStyles\n} from './styles/CallWithChatCompositeStyles';\nimport { CallWithChatAdapter } from './adapter/CallWithChatAdapter';\nimport { CallWithChatBackedCallAdapter } from './adapter/CallWithChatBackedCallAdapter';\nimport { CallWithChatBackedChatAdapter } from './adapter/CallWithChatBackedChatAdapter';\nimport { CallAdapter } from '../CallComposite';\nimport { ChatCompositeProps } from '../ChatComposite';\nimport { BaseProvider, BaseCompositeProps } from '../common/BaseComposite';\nimport { CallWithChatCompositeIcons } from '../common/icons';\nimport { AvatarPersonaDataCallback } from '../common/AvatarPersona';\nimport { ChatAdapterProvider } from '../ChatComposite/adapter/ChatAdapterProvider';\nimport { CallWithChatAdapterState } from './state/CallWithChatAdapterState';\nimport { PreparedMoreDrawer } from './PreparedMoreDrawer';\nimport { ParticipantMenuItemsCallback, _useContainerHeight, _useContainerWidth } from '@internal/react-components';\nimport { useId } from '@fluentui/react-hooks';\nimport { CallWithChatPane, CallWithChatPaneOption } from './CallWithChatPane';\n/* @conditional-compile-remove(file-sharing) */\nimport { FileSharingOptions } from '../ChatComposite';\nimport { containerDivStyles } from '../common/ContainerRectProps';\n/* @conditional-compile-remove(control-bar-button-injection) */\nimport { CustomCallWithChatControlButtonCallback } from './CustomButton';\nimport { modalLayerHostStyle } from '../common/styles/ModalLocalAndRemotePIP.styles';\n/* @conditional-compile-remove(PSTN-calls) */\nimport { SendDtmfDialpad } from '../common/SendDtmfDialpad';\n/* @conditional-compile-remove(PSTN-calls) */\nimport { useCallWithChatCompositeStrings } from './hooks/useCallWithChatCompositeStrings';\n/* @conditional-compile-remove(call-readiness) */\nimport { DevicePermissionRestrictions } from '../CallComposite/CallComposite';\nimport { drawerContainerStyles } from '../CallComposite/styles/CallComposite.styles';\n\n/**\n * Props required for the {@link CallWithChatComposite}\n *\n * @public\n */\nexport interface CallWithChatCompositeProps extends BaseCompositeProps<CallWithChatCompositeIcons> {\n adapter: CallWithChatAdapter;\n /**\n * Fluent theme for the composite.\n *\n * Defaults to a light theme if undefined.\n */\n fluentTheme?: PartialTheme | Theme;\n /**\n * Optimizes the composite form factor for either desktop or mobile.\n * @remarks `mobile` is currently only optimized for Portrait mode on mobile devices and does not support landscape.\n * @defaultValue 'desktop'\n */\n formFactor?: 'desktop' | 'mobile';\n /**\n * URL that can be used to copy a call-with-chat invite to the Users clipboard.\n */\n joinInvitationURL?: string;\n /**\n * Flags to enable/disable or customize UI elements of the {@link CallWithChatComposite}\n */\n options?: CallWithChatCompositeOptions;\n}\n\n/**\n * Optional features of the {@link CallWithChatComposite}.\n *\n * @public\n */\nexport type CallWithChatCompositeOptions = {\n /**\n * Call control options to change what buttons show on the call-with-chat composite control bar.\n * If using the boolean values, true will cause default behavior across the whole control bar. False hides the whole control bar.\n */\n callControls?: boolean | CallWithChatControlOptions;\n /* @conditional-compile-remove(file-sharing) */\n /**\n * Properties for configuring the File Sharing feature.\n * If undefined, file sharing feature will be disabled.\n * @beta\n */\n fileSharing?: FileSharingOptions;\n /* @conditional-compile-remove(call-readiness) */\n /**\n * Device permission restrictions for your call.\n * Require device permissions to be set or have them as optional or not required to start a call\n */\n devicePermissions?: DevicePermissionRestrictions;\n /* @conditional-compile-remove(call-readiness) */\n /**\n * Callback you may provide to supply users with further steps to troubleshoot why they have been\n * unable to grant your site the required permissions for the call.\n *\n * @example\n * ```ts\n * onPermissionsTroubleshootingClick: () =>\n * window.open('https://contoso.com/permissions-troubleshooting', '_blank');\n * ```\n *\n * @remarks\n * if this is not supplied, the composite will not show a 'further troubleshooting' link.\n */\n onPermissionsTroubleshootingClick?: (permissionsState: {\n camera: PermissionState;\n microphone: PermissionState;\n }) => void;\n /* @conditional-compile-remove(call-readiness) */\n /**\n * Optional callback to supply users with further troubleshooting steps for network issues\n * experienced when connecting to a call.\n *\n * @example\n * ```ts\n * onNetworkingTroubleShootingClick?: () =>\n * window.open('https://contoso.com/network-troubleshooting', '_blank');\n * ```\n *\n * @remarks\n * if this is not supplied, the composite will not show a 'network troubleshooting' link.\n */\n onNetworkingTroubleShootingClick?: () => void;\n /* @conditional-compile-remove(call-readiness) */\n /**\n * Opt in call readiness feature for your call\n * setting this to True will add call readiness feature in call experience\n */\n callReadinessOptedIn?: boolean;\n};\n\n/**\n * {@link CallWithChatComposite} Call controls to show or hide buttons on the calling control bar.\n *\n * @public\n */\nexport interface CallWithChatControlOptions {\n /**\n * {@link CallControlDisplayType} to change how the call controls are displayed.\n * `'compact'` display type will decreases the size of buttons and hide the labels.\n *\n * @remarks\n * If the composite `formFactor` is set to `'mobile'`, the control bar will always use compact view.\n *\n * @defaultValue 'default'\n */\n displayType?: CallControlDisplayType;\n /**\n * Show or Hide Microphone button during a call.\n * @defaultValue true\n */\n microphoneButton?: boolean | /* @conditional-compile-remove(PSTN-calls) */ { disabled: boolean };\n /**\n * Show or Hide Camera Button during a call\n * @defaultValue true\n */\n cameraButton?: boolean | /* @conditional-compile-remove(PSTN-calls) */ { disabled: boolean };\n /**\n * Show, Hide or Disable the screen share button during a call.\n * @defaultValue true\n */\n screenShareButton?: boolean | { disabled: boolean };\n /**\n * Show or Hide EndCall button during a call.\n * @defaultValue true\n */\n endCallButton?: boolean;\n /**\n * Show or hide the chat button in the call-with-chat composite control bar.\n * @defaultValue true\n */\n chatButton?: boolean | /* @conditional-compile-remove(PSTN-calls) */ { disabled: boolean };\n /**\n * Show or hide the people button in the call-with-chat composite control bar.\n * @defaultValue true\n */\n peopleButton?: boolean | /* @conditional-compile-remove(PSTN-calls) */ { disabled: boolean };\n /* @conditional-compile-remove(control-bar-button-injection) */\n /**\n * Inject custom buttons in the call controls.\n *\n * @beta\n */\n onFetchCustomButtonProps?: CustomCallWithChatControlButtonCallback[];\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n /**\n * Show or hide the more button in the call-with-chat control bar.\n */\n moreButton?: boolean;\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n /**\n * Show or hide the hold button in the bottom sheet drawer\n */\n holdButton?: boolean | { disabled: boolean };\n}\n\ntype CallWithChatScreenProps = {\n callWithChatAdapter: CallWithChatAdapter;\n fluentTheme?: PartialTheme | Theme;\n formFactor?: 'desktop' | 'mobile';\n joinInvitationURL?: string;\n callControls?: boolean | CallWithChatControlOptions;\n onFetchAvatarPersonaData?: AvatarPersonaDataCallback;\n onFetchParticipantMenuItems?: ParticipantMenuItemsCallback;\n /* @conditional-compile-remove(file-sharing) */\n fileSharing?: FileSharingOptions;\n rtl?: boolean;\n /* @conditional-compile-remove(call-readiness) */\n devicePermissions?: DevicePermissionRestrictions;\n /* @conditional-compile-remove(call-readiness) */\n callReadinessOptedIn?: boolean;\n};\n\nconst CallWithChatScreen = (props: CallWithChatScreenProps): JSX.Element => {\n const { callWithChatAdapter, fluentTheme, formFactor = 'desktop' } = props;\n const mobileView = formFactor === 'mobile';\n\n if (!callWithChatAdapter) {\n throw new Error('CallWithChatAdapter is undefined');\n }\n\n const callAdapter: CallAdapter = useMemo(\n () => new CallWithChatBackedCallAdapter(callWithChatAdapter),\n [callWithChatAdapter]\n );\n\n const [currentCallState, setCurrentCallState] = useState<CallState>();\n const [currentPage, setCurrentPage] = useState<CallCompositePage>();\n const [activePane, setActivePane] = useState<CallWithChatPaneOption>('none');\n\n const containerRef = useRef<HTMLDivElement>(null);\n const containerWidth = _useContainerWidth(containerRef);\n const containerHeight = _useContainerHeight(containerRef);\n\n useEffect(() => {\n const updateCallWithChatPage = (newState: CallWithChatAdapterState): void => {\n setCurrentPage(newState.page);\n setCurrentCallState(newState.call?.state);\n };\n updateCallWithChatPage(callWithChatAdapter.getState());\n callWithChatAdapter.onStateChange(updateCallWithChatPage);\n return () => {\n callWithChatAdapter.offStateChange(updateCallWithChatPage);\n };\n }, [callWithChatAdapter]);\n\n const closePane = useCallback(() => {\n setActivePane('none');\n }, [setActivePane]);\n\n const chatProps: ChatCompositeProps = useMemo(() => {\n return {\n adapter: new CallWithChatBackedChatAdapter(callWithChatAdapter)\n };\n }, [callWithChatAdapter]);\n\n const modalLayerHostId = useId('modalLayerhost');\n\n const isInLobbyOrConnecting = currentPage === 'lobby';\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n const isInLocalHold = currentPage === 'hold';\n const hasJoinedCall = !!(currentPage && hasJoinedCallFn(currentPage, currentCallState ?? 'None'));\n const showControlBar = isInLobbyOrConnecting || hasJoinedCall;\n const isMobileWithActivePane = mobileView && hasJoinedCall && activePane !== 'none';\n\n /** Constant setting of id for the parent stack of the composite */\n const compositeParentDivId = useId('callWithChatCompositeParentDiv-internal');\n\n const toggleChat = useCallback(() => {\n if (activePane === 'chat' || !hasJoinedCall) {\n setActivePane('none');\n } else {\n setActivePane('chat');\n // timeout is required to give the window time to render the sendbox so we have something to send focus to.\n // TODO: Selecting elements in the DOM via attributes is not stable. We should expose an API from ChatComposite to be able to focus on the sendbox.\n const chatFocusTimeout = setInterval(() => {\n const callWithChatCompositeRootDiv = document.querySelector(`[id=\"${compositeParentDivId}\"]`);\n const sendbox = callWithChatCompositeRootDiv?.querySelector(`[id=\"sendbox\"]`) as HTMLTextAreaElement;\n if (sendbox !== null) {\n sendbox.focus();\n clearInterval(chatFocusTimeout);\n }\n }, 3);\n setTimeout(() => {\n clearInterval(chatFocusTimeout);\n }, 300);\n }\n }, [activePane, setActivePane, compositeParentDivId, hasJoinedCall]);\n\n const togglePeople = useCallback(() => {\n if (activePane === 'people' || !hasJoinedCall) {\n setActivePane('none');\n } else {\n setActivePane('people');\n }\n }, [activePane, setActivePane, hasJoinedCall]);\n\n const selectChat = useCallback(() => {\n if (hasJoinedCall) {\n setActivePane('chat');\n }\n }, [setActivePane, hasJoinedCall]);\n\n const selectPeople = useCallback(() => {\n if (hasJoinedCall) {\n setActivePane('people');\n }\n }, [setActivePane, hasJoinedCall]);\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 togglePeople();\n }, [togglePeople]);\n\n // On mobile, when there is an active call and some side pane is active,\n // we hide the call composite via CSS to show only the pane.\n // We only set `display` to `none` instead of unmounting the call composite component tree\n // to avoid the performance cost of rerendering video streams when we later show the composite again.\n const callCompositeContainerCSS = useMemo(() => {\n return { display: isMobileWithActivePane ? 'none' : 'flex' };\n }, [isMobileWithActivePane]);\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 /* @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 /* @conditional-compile-remove(PSTN-calls) */\n const alternateCallerId = callAdapter.getState().alternateCallerId;\n\n return (\n <div ref={containerRef} className={mergeStyles(containerDivStyles)}>\n <Stack verticalFill grow styles={compositeOuterContainerStyles} id={compositeParentDivId}>\n <Stack horizontal grow>\n <Stack.Item\n grow\n styles={callCompositeContainerStyles}\n // Perf: Instead of removing the video gallery from DOM, we hide it to prevent re-renders.\n style={callCompositeContainerCSS}\n >\n <CallComposite\n {...props}\n formFactor={formFactor}\n options={{\n callControls: false,\n /* @conditional-compile-remove(call-readiness) */\n devicePermissions: props.devicePermissions,\n /* @conditional-compile-remove(call-readiness) */\n callReadinessOptedIn: props.callReadinessOptedIn\n }}\n adapter={callAdapter}\n fluentTheme={fluentTheme}\n />\n </Stack.Item>\n\n {chatProps.adapter && callAdapter && hasJoinedCall && (\n <CallWithChatPane\n chatCompositeProps={chatProps}\n inviteLink={props.joinInvitationURL}\n onClose={closePane}\n chatAdapter={chatProps.adapter}\n callAdapter={callAdapter}\n onFetchAvatarPersonaData={props.onFetchAvatarPersonaData}\n onFetchParticipantMenuItems={props.onFetchParticipantMenuItems}\n onChatButtonClicked={showShowChatTabHeaderButton(props.callControls) ? selectChat : undefined}\n onPeopleButtonClicked={showShowPeopleTabHeaderButton(props.callControls) ? selectPeople : undefined}\n modalLayerHostId={modalLayerHostId}\n mobileView={mobileView}\n activePane={activePane}\n /* @conditional-compile-remove(file-sharing) */\n fileSharing={props.fileSharing}\n rtl={props.rtl}\n callControls={typeof props.callControls !== 'boolean' ? props.callControls : undefined}\n />\n )}\n </Stack>\n {showControlBar && !isMobileWithActivePane && (\n <ChatAdapterProvider adapter={chatProps.adapter}>\n <Stack.Item styles={controlBarContainerStyles}>\n <CallWithChatControlBar\n callAdapter={callAdapter}\n chatAdapter={chatProps.adapter}\n chatButtonChecked={activePane === 'chat'}\n onChatButtonClicked={toggleChat}\n peopleButtonChecked={activePane === 'people'}\n onPeopleButtonClicked={togglePeople}\n onMoreButtonClicked={onMoreButtonClicked}\n mobileView={mobileView}\n disableButtonsForLobbyPage={isInLobbyOrConnecting}\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n disableButtonsForHoldScreen={isInLocalHold}\n callControls={props.callControls}\n containerHeight={containerHeight}\n containerWidth={containerWidth}\n /* @conditional-compile-remove(PSTN-calls) */\n onClickShowDialpad={alternateCallerId ? onClickShowDialpad : undefined}\n />\n </Stack.Item>\n </ChatAdapterProvider>\n )}\n {showControlBar && showDrawer && (\n <ChatAdapterProvider adapter={chatProps.adapter}>\n <CallAdapterProvider adapter={callAdapter}>\n <Stack styles={drawerContainerStyles()}>\n <PreparedMoreDrawer\n callControls={props.callControls}\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 />\n </Stack>\n </CallAdapterProvider>\n </ChatAdapterProvider>\n )}\n\n {\n /* @conditional-compile-remove(PSTN-calls) */\n showControlBar && showDtmfDialpad && (\n <ChatAdapterProvider adapter={chatProps.adapter}>\n <CallAdapterProvider adapter={callAdapter}>\n <Stack styles={drawerContainerStyles()}>\n <SendDtmfDialpad\n isMobile={mobileView}\n strings={dialpadStrings}\n showDialpad={showDtmfDialpad}\n onDismissDialpad={onDismissDtmfDialpad}\n />\n </Stack>\n </CallAdapterProvider>\n </ChatAdapterProvider>\n )\n }\n {\n // This layer host is for ModalLocalAndRemotePIP in CallWithChatPane. This LayerHost cannot be inside the CallWithChatPane\n // because when the CallWithChatPane is hidden, ie. style property display is 'none', it takes up no space. This causes problems when dragging\n // the Modal because the draggable bounds thinks it has no space and will always return to its initial position after dragging.\n mobileView && <LayerHost id={modalLayerHostId} className={mergeStyles(modalLayerHostStyle)} />\n }\n </Stack>\n </div>\n );\n};\n\n/**\n * CallWithChatComposite brings together key components to provide a full call with chat experience out of the box.\n *\n * @public\n */\nexport const CallWithChatComposite = (props: CallWithChatCompositeProps): JSX.Element => {\n const { adapter, fluentTheme, rtl, formFactor, joinInvitationURL, options } = props;\n return (\n <BaseProvider fluentTheme={fluentTheme} rtl={rtl} locale={props.locale} icons={props.icons}>\n <CallWithChatScreen\n {...props}\n /* @conditional-compile-remove(call-readiness) */\n devicePermissions={options?.devicePermissions}\n /* @conditional-compile-remove(call-readiness) */\n callReadinessOptedIn={options?.callReadinessOptedIn}\n callWithChatAdapter={adapter}\n formFactor={formFactor}\n callControls={options?.callControls}\n joinInvitationURL={joinInvitationURL}\n fluentTheme={fluentTheme}\n /* @conditional-compile-remove(file-sharing) */\n fileSharing={options?.fileSharing}\n />\n </BaseProvider>\n );\n};\n\nconst hasJoinedCallFn = (page: CallCompositePage, callStatus: CallState): boolean => {\n /* @conditional-compile-remove(one-to-n-calling) */ /* @conditional-compile-remove(one-to-n-calling) */\n return (\n (page === 'call' &&\n (callStatus === 'Connected' || callStatus === 'RemoteHold' || callStatus === 'Disconnecting')) ||\n (page === 'hold' && (callStatus === 'LocalHold' || callStatus === 'Disconnecting'))\n );\n return page === 'call' && (callStatus === 'Connected' || callStatus === 'Disconnecting');\n};\n\nconst showShowChatTabHeaderButton = (callControls?: boolean | CallWithChatControlOptions): boolean => {\n if (callControls === undefined || callControls === true) {\n return true;\n }\n if (callControls === false) {\n return false;\n }\n return callControls.chatButton !== false;\n};\n\nconst showShowPeopleTabHeaderButton = (callControls?: boolean | CallWithChatControlOptions): boolean => {\n if (callControls === undefined || callControls === true) {\n return true;\n }\n if (callControls === false) {\n return false;\n }\n return callControls.peopleButton !== false;\n};\n\"../../../../react-components/src\""]}
|
1
|
+
{"version":3,"file":"CallWithChatComposite.js","sourceRoot":"","sources":["../../../../../../../react-composites/src/composites/CallWithChatComposite/CallWithChatComposite.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport React, { useCallback, useState, useMemo, useEffect, useRef } from 'react';\nimport { LayerHost, mergeStyles, PartialTheme, Stack, Theme } from '@fluentui/react';\nimport { CallComposite, CallCompositePage, CallControlDisplayType } from '../CallComposite';\nimport { CallAdapterProvider } from '../CallComposite/adapter/CallAdapterProvider';\nimport { CallWithChatControlBar } from './CallWithChatControlBar';\nimport { CallState } from '@azure/communication-calling';\nimport {\n callCompositeContainerStyles,\n compositeOuterContainerStyles,\n controlBarContainerStyles\n} from './styles/CallWithChatCompositeStyles';\nimport { CallWithChatAdapter } from './adapter/CallWithChatAdapter';\nimport { CallWithChatBackedCallAdapter } from './adapter/CallWithChatBackedCallAdapter';\nimport { CallWithChatBackedChatAdapter } from './adapter/CallWithChatBackedChatAdapter';\nimport { CallAdapter } from '../CallComposite';\nimport { ChatCompositeProps } from '../ChatComposite';\nimport { BaseProvider, BaseCompositeProps } from '../common/BaseComposite';\nimport { CallWithChatCompositeIcons } from '../common/icons';\nimport { AvatarPersonaDataCallback } from '../common/AvatarPersona';\nimport { ChatAdapterProvider } from '../ChatComposite/adapter/ChatAdapterProvider';\nimport { CallWithChatAdapterState } from './state/CallWithChatAdapterState';\nimport { PreparedMoreDrawer } from './PreparedMoreDrawer';\nimport { ParticipantMenuItemsCallback, _useContainerHeight, _useContainerWidth } from '@internal/react-components';\nimport { useId } from '@fluentui/react-hooks';\nimport { CallWithChatPane, CallWithChatPaneOption } from './CallWithChatPane';\n/* @conditional-compile-remove(file-sharing) */\nimport { FileSharingOptions } from '../ChatComposite';\nimport { containerDivStyles } from '../common/ContainerRectProps';\n/* @conditional-compile-remove(control-bar-button-injection) */\nimport { CustomCallWithChatControlButtonCallback } from './CustomButton';\nimport { modalLayerHostStyle } from '../common/styles/ModalLocalAndRemotePIP.styles';\n/* @conditional-compile-remove(PSTN-calls) */\nimport { SendDtmfDialpad } from '../common/SendDtmfDialpad';\n/* @conditional-compile-remove(PSTN-calls) */\nimport { useCallWithChatCompositeStrings } from './hooks/useCallWithChatCompositeStrings';\nimport { CallCompositeOptions } from '../CallComposite/CallComposite';\n/* @conditional-compile-remove(call-readiness) */\nimport { DeviceCheckOptions } from '../CallComposite/CallComposite';\nimport { drawerContainerStyles } from '../CallComposite/styles/CallComposite.styles';\n\n/**\n * Props required for the {@link CallWithChatComposite}\n *\n * @public\n */\nexport interface CallWithChatCompositeProps extends BaseCompositeProps<CallWithChatCompositeIcons> {\n adapter: CallWithChatAdapter;\n /**\n * Fluent theme for the composite.\n *\n * Defaults to a light theme if undefined.\n */\n fluentTheme?: PartialTheme | Theme;\n /**\n * Optimizes the composite form factor for either desktop or mobile.\n * @remarks `mobile` is currently only optimized for Portrait mode on mobile devices and does not support landscape.\n * @defaultValue 'desktop'\n */\n formFactor?: 'desktop' | 'mobile';\n /**\n * URL that can be used to copy a call-with-chat invite to the Users clipboard.\n */\n joinInvitationURL?: string;\n /**\n * Flags to enable/disable or customize UI elements of the {@link CallWithChatComposite}\n */\n options?: CallWithChatCompositeOptions;\n}\n\n/**\n * Optional features of the {@link CallWithChatComposite}.\n *\n * @public\n */\nexport type CallWithChatCompositeOptions = {\n /**\n * Call control options to change what buttons show on the call-with-chat composite control bar.\n * If using the boolean values, true will cause default behavior across the whole control bar. False hides the whole control bar.\n */\n callControls?: boolean | CallWithChatControlOptions;\n /* @conditional-compile-remove(file-sharing) */\n /**\n * Properties for configuring the File Sharing feature.\n * If undefined, file sharing feature will be disabled.\n * @beta\n */\n fileSharing?: FileSharingOptions;\n /* @conditional-compile-remove(call-readiness) */\n /**\n * Device permissions check options for your call.\n * Here you can choose what device permissions you prompt the user for,\n * as well as what device permissions must be accepted before starting a call.\n */\n deviceChecks?: DeviceCheckOptions;\n /* @conditional-compile-remove(call-readiness) */\n /**\n * Callback you may provide to supply users with further steps to troubleshoot why they have been\n * unable to grant your site the required permissions for the call.\n *\n * @example\n * ```ts\n * onPermissionsTroubleshootingClick: () =>\n * window.open('https://contoso.com/permissions-troubleshooting', '_blank');\n * ```\n *\n * @remarks\n * if this is not supplied, the composite will not show a 'further troubleshooting' link.\n */\n onPermissionsTroubleshootingClick?: (permissionsState: {\n camera: PermissionState;\n microphone: PermissionState;\n }) => void;\n /* @conditional-compile-remove(call-readiness) */\n /**\n * Optional callback to supply users with further troubleshooting steps for network issues\n * experienced when connecting to a call.\n *\n * @example\n * ```ts\n * onNetworkingTroubleShootingClick?: () =>\n * window.open('https://contoso.com/network-troubleshooting', '_blank');\n * ```\n *\n * @remarks\n * if this is not supplied, the composite will not show a 'network troubleshooting' link.\n */\n onNetworkingTroubleShootingClick?: () => void;\n /* @conditional-compile-remove(unsupported-browser) */\n /**\n * Callback you may provide to supply users with a provided page to showcase supported browsers by ACS.\n *\n * @example\n * ```ts\n * onBrowserTroubleShootingClick?: () =>\n * window.open('https://contoso.com/browser-troubleshooting', '_blank');\n * ```\n *\n * @remarks\n * if this is not supplied, the composite will not show a unsupported browser page.\n */\n onEnvironmentInfoTroubleshootingClick?: () => void;\n};\n\n/**\n * {@link CallWithChatComposite} Call controls to show or hide buttons on the calling control bar.\n *\n * @public\n */\nexport interface CallWithChatControlOptions {\n /**\n * {@link CallControlDisplayType} to change how the call controls are displayed.\n * `'compact'` display type will decreases the size of buttons and hide the labels.\n *\n * @remarks\n * If the composite `formFactor` is set to `'mobile'`, the control bar will always use compact view.\n *\n * @defaultValue 'default'\n */\n displayType?: CallControlDisplayType;\n /**\n * Show or Hide Microphone button during a call.\n * @defaultValue true\n */\n microphoneButton?: boolean | /* @conditional-compile-remove(PSTN-calls) */ { disabled: boolean };\n /**\n * Show or Hide Camera Button during a call\n * @defaultValue true\n */\n cameraButton?: boolean | /* @conditional-compile-remove(PSTN-calls) */ { disabled: boolean };\n /**\n * Show, Hide or Disable the screen share button during a call.\n * @defaultValue true\n */\n screenShareButton?: boolean | { disabled: boolean };\n /**\n * Show or Hide EndCall button during a call.\n * @defaultValue true\n */\n endCallButton?: boolean;\n /**\n * Show or hide the chat button in the call-with-chat composite control bar.\n * @defaultValue true\n */\n chatButton?: boolean | /* @conditional-compile-remove(PSTN-calls) */ { disabled: boolean };\n /**\n * Show or hide the people button in the call-with-chat composite control bar.\n * @defaultValue true\n */\n peopleButton?: boolean | /* @conditional-compile-remove(PSTN-calls) */ { disabled: boolean };\n /* @conditional-compile-remove(control-bar-button-injection) */\n /**\n * Inject custom buttons in the call controls.\n *\n * @beta\n */\n onFetchCustomButtonProps?: CustomCallWithChatControlButtonCallback[];\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n /**\n * Show or hide the more button in the call-with-chat control bar.\n */\n moreButton?: boolean;\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n /**\n * Show or hide the hold button in the bottom sheet drawer\n */\n holdButton?: boolean | { disabled: boolean };\n}\n\ntype CallWithChatScreenProps = {\n callWithChatAdapter: CallWithChatAdapter;\n fluentTheme?: PartialTheme | Theme;\n formFactor?: 'desktop' | 'mobile';\n joinInvitationURL?: string;\n callControls?: boolean | CallWithChatControlOptions;\n onFetchAvatarPersonaData?: AvatarPersonaDataCallback;\n onFetchParticipantMenuItems?: ParticipantMenuItemsCallback;\n /* @conditional-compile-remove(file-sharing) */\n fileSharing?: FileSharingOptions;\n rtl?: boolean;\n /* @conditional-compile-remove(call-readiness) */\n deviceChecks?: DeviceCheckOptions;\n /* @conditional-compile-remove(call-readiness) */\n onPermissionsTroubleshootingClick?: (permissionsState: {\n camera: PermissionState;\n microphone: PermissionState;\n }) => void;\n /* @conditional-compile-remove(call-readiness) */\n onNetworkingTroubleShootingClick?: () => void;\n /* @conditional-compile-remove(unsupported-browser) */\n onEnvironmentInfoTroubleshootingClick?: () => void;\n};\n\nconst CallWithChatScreen = (props: CallWithChatScreenProps): JSX.Element => {\n const { callWithChatAdapter, fluentTheme, formFactor = 'desktop' } = props;\n const mobileView = formFactor === 'mobile';\n\n if (!callWithChatAdapter) {\n throw new Error('CallWithChatAdapter is undefined');\n }\n\n const callAdapter: CallAdapter = useMemo(\n () => new CallWithChatBackedCallAdapter(callWithChatAdapter),\n [callWithChatAdapter]\n );\n\n const [currentCallState, setCurrentCallState] = useState<CallState>();\n const [currentPage, setCurrentPage] = useState<CallCompositePage>();\n const [activePane, setActivePane] = useState<CallWithChatPaneOption>('none');\n\n const containerRef = useRef<HTMLDivElement>(null);\n const containerWidth = _useContainerWidth(containerRef);\n const containerHeight = _useContainerHeight(containerRef);\n\n useEffect(() => {\n const updateCallWithChatPage = (newState: CallWithChatAdapterState): void => {\n setCurrentPage(newState.page);\n setCurrentCallState(newState.call?.state);\n };\n updateCallWithChatPage(callWithChatAdapter.getState());\n callWithChatAdapter.onStateChange(updateCallWithChatPage);\n return () => {\n callWithChatAdapter.offStateChange(updateCallWithChatPage);\n };\n }, [callWithChatAdapter]);\n\n const closePane = useCallback(() => {\n setActivePane('none');\n }, [setActivePane]);\n\n const chatProps: ChatCompositeProps = useMemo(() => {\n return {\n adapter: new CallWithChatBackedChatAdapter(callWithChatAdapter)\n };\n }, [callWithChatAdapter]);\n\n const modalLayerHostId = useId('modalLayerhost');\n\n const isInLobbyOrConnecting = currentPage === 'lobby';\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n const isInLocalHold = currentPage === 'hold';\n const hasJoinedCall = !!(currentPage && hasJoinedCallFn(currentPage, currentCallState ?? 'None'));\n const showControlBar = isInLobbyOrConnecting || hasJoinedCall;\n const isMobileWithActivePane = mobileView && hasJoinedCall && activePane !== 'none';\n\n /** Constant setting of id for the parent stack of the composite */\n const compositeParentDivId = useId('callWithChatCompositeParentDiv-internal');\n\n const toggleChat = useCallback(() => {\n if (activePane === 'chat' || !hasJoinedCall) {\n setActivePane('none');\n } else {\n setActivePane('chat');\n // timeout is required to give the window time to render the sendbox so we have something to send focus to.\n // TODO: Selecting elements in the DOM via attributes is not stable. We should expose an API from ChatComposite to be able to focus on the sendbox.\n const chatFocusTimeout = setInterval(() => {\n const callWithChatCompositeRootDiv = document.querySelector(`[id=\"${compositeParentDivId}\"]`);\n const sendbox = callWithChatCompositeRootDiv?.querySelector(`[id=\"sendbox\"]`) as HTMLTextAreaElement;\n if (sendbox !== null) {\n sendbox.focus();\n clearInterval(chatFocusTimeout);\n }\n }, 3);\n setTimeout(() => {\n clearInterval(chatFocusTimeout);\n }, 300);\n }\n }, [activePane, setActivePane, compositeParentDivId, hasJoinedCall]);\n\n const togglePeople = useCallback(() => {\n if (activePane === 'people' || !hasJoinedCall) {\n setActivePane('none');\n } else {\n setActivePane('people');\n }\n }, [activePane, setActivePane, hasJoinedCall]);\n\n const selectChat = useCallback(() => {\n if (hasJoinedCall) {\n setActivePane('chat');\n }\n }, [setActivePane, hasJoinedCall]);\n\n const selectPeople = useCallback(() => {\n if (hasJoinedCall) {\n setActivePane('people');\n }\n }, [setActivePane, hasJoinedCall]);\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 togglePeople();\n }, [togglePeople]);\n\n // On mobile, when there is an active call and some side pane is active,\n // we hide the call composite via CSS to show only the pane.\n // We only set `display` to `none` instead of unmounting the call composite component tree\n // to avoid the performance cost of rerendering video streams when we later show the composite again.\n const callCompositeContainerCSS = useMemo(() => {\n return { display: isMobileWithActivePane ? 'none' : 'flex' };\n }, [isMobileWithActivePane]);\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 /* @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 /* @conditional-compile-remove(PSTN-calls) */\n const alternateCallerId = callAdapter.getState().alternateCallerId;\n\n const callCompositeOptions: CallCompositeOptions = useMemo(\n () => ({\n callControls: false,\n /* @conditional-compile-remove(call-readiness) */\n deviceChecks: props.deviceChecks,\n /* @conditional-compile-remove(call-readiness) */\n onNetworkingTroubleShootingClick: props.onNetworkingTroubleShootingClick,\n /* @conditional-compile-remove(call-readiness) */\n onPermissionsTroubleshootingClick: props.onPermissionsTroubleshootingClick,\n /* @conditional-compile-remove(unsupported-browser) */\n onEnvironmentInfoTroubleshootingClick: props.onEnvironmentInfoTroubleshootingClick\n }),\n [\n /* @conditional-compile-remove(call-readiness) */\n props.deviceChecks,\n /* @conditional-compile-remove(unsupported-browser) */\n props.onEnvironmentInfoTroubleshootingClick,\n /* @conditional-compile-remove(call-readiness) */\n props.onNetworkingTroubleShootingClick,\n /* @conditional-compile-remove(call-readiness) */\n props.onPermissionsTroubleshootingClick\n ]\n );\n\n return (\n <div ref={containerRef} className={mergeStyles(containerDivStyles)}>\n <Stack verticalFill grow styles={compositeOuterContainerStyles} id={compositeParentDivId}>\n <Stack horizontal grow>\n <Stack.Item\n grow\n styles={callCompositeContainerStyles}\n // Perf: Instead of removing the video gallery from DOM, we hide it to prevent re-renders.\n style={callCompositeContainerCSS}\n >\n <CallComposite\n {...props}\n formFactor={formFactor}\n options={callCompositeOptions}\n adapter={callAdapter}\n fluentTheme={fluentTheme}\n />\n </Stack.Item>\n\n {chatProps.adapter && callAdapter && hasJoinedCall && (\n <CallWithChatPane\n chatCompositeProps={chatProps}\n inviteLink={props.joinInvitationURL}\n onClose={closePane}\n chatAdapter={chatProps.adapter}\n callAdapter={callAdapter}\n onFetchAvatarPersonaData={props.onFetchAvatarPersonaData}\n onFetchParticipantMenuItems={props.onFetchParticipantMenuItems}\n onChatButtonClicked={showShowChatTabHeaderButton(props.callControls) ? selectChat : undefined}\n onPeopleButtonClicked={showShowPeopleTabHeaderButton(props.callControls) ? selectPeople : undefined}\n modalLayerHostId={modalLayerHostId}\n mobileView={mobileView}\n activePane={activePane}\n /* @conditional-compile-remove(file-sharing) */\n fileSharing={props.fileSharing}\n rtl={props.rtl}\n callControls={typeof props.callControls !== 'boolean' ? props.callControls : undefined}\n />\n )}\n </Stack>\n {showControlBar && !isMobileWithActivePane && (\n <ChatAdapterProvider adapter={chatProps.adapter}>\n <Stack.Item styles={controlBarContainerStyles}>\n <CallWithChatControlBar\n callAdapter={callAdapter}\n chatAdapter={chatProps.adapter}\n chatButtonChecked={activePane === 'chat'}\n onChatButtonClicked={toggleChat}\n peopleButtonChecked={activePane === 'people'}\n onPeopleButtonClicked={togglePeople}\n onMoreButtonClicked={onMoreButtonClicked}\n mobileView={mobileView}\n disableButtonsForLobbyPage={isInLobbyOrConnecting}\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n disableButtonsForHoldScreen={isInLocalHold}\n callControls={props.callControls}\n containerHeight={containerHeight}\n containerWidth={containerWidth}\n /* @conditional-compile-remove(PSTN-calls) */\n onClickShowDialpad={alternateCallerId ? onClickShowDialpad : undefined}\n />\n </Stack.Item>\n </ChatAdapterProvider>\n )}\n {showControlBar && showDrawer && (\n <ChatAdapterProvider adapter={chatProps.adapter}>\n <CallAdapterProvider adapter={callAdapter}>\n <Stack styles={drawerContainerStyles()}>\n <PreparedMoreDrawer\n callControls={props.callControls}\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 />\n </Stack>\n </CallAdapterProvider>\n </ChatAdapterProvider>\n )}\n\n {\n /* @conditional-compile-remove(PSTN-calls) */\n showControlBar && showDtmfDialpad && (\n <ChatAdapterProvider adapter={chatProps.adapter}>\n <CallAdapterProvider adapter={callAdapter}>\n <Stack styles={drawerContainerStyles()}>\n <SendDtmfDialpad\n isMobile={mobileView}\n strings={dialpadStrings}\n showDialpad={showDtmfDialpad}\n onDismissDialpad={onDismissDtmfDialpad}\n />\n </Stack>\n </CallAdapterProvider>\n </ChatAdapterProvider>\n )\n }\n {\n // This layer host is for ModalLocalAndRemotePIP in CallWithChatPane. This LayerHost cannot be inside the CallWithChatPane\n // because when the CallWithChatPane is hidden, ie. style property display is 'none', it takes up no space. This causes problems when dragging\n // the Modal because the draggable bounds thinks it has no space and will always return to its initial position after dragging.\n mobileView && <LayerHost id={modalLayerHostId} className={mergeStyles(modalLayerHostStyle)} />\n }\n </Stack>\n </div>\n );\n};\n\n/**\n * CallWithChatComposite brings together key components to provide a full call with chat experience out of the box.\n *\n * @public\n */\nexport const CallWithChatComposite = (props: CallWithChatCompositeProps): JSX.Element => {\n const { adapter, fluentTheme, rtl, formFactor, joinInvitationURL, options } = props;\n return (\n <BaseProvider fluentTheme={fluentTheme} rtl={rtl} locale={props.locale} icons={props.icons}>\n <CallWithChatScreen\n {...props}\n /* @conditional-compile-remove(call-readiness) */\n deviceChecks={options?.deviceChecks}\n callWithChatAdapter={adapter}\n formFactor={formFactor}\n callControls={options?.callControls}\n joinInvitationURL={joinInvitationURL}\n fluentTheme={fluentTheme}\n /* @conditional-compile-remove(file-sharing) */\n fileSharing={options?.fileSharing}\n />\n </BaseProvider>\n );\n};\n\nconst hasJoinedCallFn = (page: CallCompositePage, callStatus: CallState): boolean => {\n /* @conditional-compile-remove(one-to-n-calling) */ /* @conditional-compile-remove(one-to-n-calling) */\n return (\n (page === 'call' &&\n (callStatus === 'Connected' || callStatus === 'RemoteHold' || callStatus === 'Disconnecting')) ||\n (page === 'hold' && (callStatus === 'LocalHold' || callStatus === 'Disconnecting'))\n );\n return page === 'call' && (callStatus === 'Connected' || callStatus === 'Disconnecting');\n};\n\nconst showShowChatTabHeaderButton = (callControls?: boolean | CallWithChatControlOptions): boolean => {\n if (callControls === undefined || callControls === true) {\n return true;\n }\n if (callControls === false) {\n return false;\n }\n return callControls.chatButton !== false;\n};\n\nconst showShowPeopleTabHeaderButton = (callControls?: boolean | CallWithChatControlOptions): boolean => {\n if (callControls === undefined || callControls === true) {\n return true;\n }\n if (callControls === false) {\n return false;\n }\n return callControls.peopleButton !== false;\n};\n\"../../../../react-components/src\""]}
|
@@ -19,6 +19,7 @@ import { CUSTOM_BUTTON_OPTIONS, generateCustomCallWithChatControlBarButton, onFe
|
|
19
19
|
/*@conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */
|
20
20
|
import { DesktopMoreButton } from './components/DesktopMoreButton';
|
21
21
|
import { isDisabled } from '../CallComposite/utils';
|
22
|
+
import { HiddenFocusStartPoint } from '../common/HiddenFocusStartPoint';
|
22
23
|
const inferCallWithChatControlOptions = (mobileView, callWithChatControls) => {
|
23
24
|
if (callWithChatControls === false) {
|
24
25
|
return false;
|
@@ -80,6 +81,7 @@ export const CallWithChatControlBar = (props) => {
|
|
80
81
|
React.createElement(Stack.Item, { grow: true },
|
81
82
|
React.createElement(CallAdapterProvider, { adapter: props.callAdapter },
|
82
83
|
React.createElement(Stack, { horizontalAlign: "center" },
|
84
|
+
React.createElement(HiddenFocusStartPoint, null),
|
83
85
|
React.createElement(Stack.Item, null,
|
84
86
|
React.createElement(ControlBar, { layout: "horizontal", styles: centerContainerStyles },
|
85
87
|
isEnabled(options.microphoneButton) && (React.createElement(Microphone, { displayType: options.displayType, styles: commonButtonStyles, splitButtonsForDeviceSelection: !props.mobileView,
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"CallWithChatControlBar.js","sourceRoot":"","sources":["../../../../../../../react-composites/src/composites/CallWithChatComposite/CallWithChatControlBar.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport React, { useMemo } from 'react';\nimport { CallAdapterProvider } from '../CallComposite/adapter/CallAdapterProvider';\nimport { CallAdapter } from '../CallComposite';\nimport { PeopleButton } from './PeopleButton';\nimport { concatStyleSets, IStyle, ITheme, mergeStyles, mergeStyleSets, Stack, useTheme } from '@fluentui/react';\nimport { controlBarContainerStyles } from '../CallComposite/styles/CallControls.styles';\nimport { callControlsContainerStyles } from '../CallComposite/styles/CallPage.styles';\nimport { useCallWithChatCompositeStrings } from './hooks/useCallWithChatCompositeStrings';\nimport { ChatAdapter } from '../ChatComposite';\nimport { ChatButtonWithUnreadMessagesBadge } from './ChatButtonWithUnreadMessagesBadge';\nimport { BaseCustomStyles, ControlBarButtonStyles } from '@internal/react-components';\nimport { ControlBar } from '@internal/react-components';\nimport { Microphone } from '../CallComposite/components/buttons/Microphone';\nimport { Camera } from '../CallComposite/components/buttons/Camera';\nimport { ScreenShare } from '../CallComposite/components/buttons/ScreenShare';\nimport { EndCall } from '../CallComposite/components/buttons/EndCall';\nimport { MoreButton } from '../common/MoreButton';\nimport { CallWithChatControlOptions } from './CallWithChatComposite';\nimport { ContainerRectProps } from '../common/ContainerRectProps';\n/* @conditional-compile-remove(control-bar-button-injection) */\nimport {\n CUSTOM_BUTTON_OPTIONS,\n generateCustomCallWithChatControlBarButton,\n onFetchCustomButtonPropsTrampoline\n} from './CustomButton';\n/*@conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\nimport { DesktopMoreButton } from './components/DesktopMoreButton';\nimport { isDisabled } from '../CallComposite/utils';\n\n/**\n * @private\n */\nexport interface CallWithChatControlBarProps {\n callAdapter: CallAdapter;\n chatButtonChecked: boolean;\n peopleButtonChecked: boolean;\n onChatButtonClicked: () => void;\n onPeopleButtonClicked: () => void;\n onMoreButtonClicked: () => void;\n mobileView: boolean;\n disableButtonsForLobbyPage: boolean;\n callControls?: boolean | CallWithChatControlOptions;\n chatAdapter: ChatAdapter;\n disableButtonsForHoldScreen?: boolean;\n /* @conditional-compile-remove(PSTN-calls) */\n onClickShowDialpad?: () => void;\n}\n\nconst inferCallWithChatControlOptions = (\n mobileView: boolean,\n callWithChatControls?: boolean | CallWithChatControlOptions\n): CallWithChatControlOptions | false => {\n if (callWithChatControls === false) {\n return false;\n }\n\n const options = callWithChatControls === true || callWithChatControls === undefined ? {} : callWithChatControls;\n if (mobileView) {\n // Set to compressed mode when composite is optimized for mobile\n options.displayType = 'compact';\n // Do not show screen share button when composite is optimized for mobile unless the developer\n // has explicitly opted in.\n if (options.screenShareButton !== true) {\n options.screenShareButton = false;\n }\n }\n return options;\n};\n\n/**\n * @private\n */\nexport const CallWithChatControlBar = (props: CallWithChatControlBarProps & ContainerRectProps): JSX.Element => {\n const theme = useTheme();\n const callWithChatStrings = useCallWithChatCompositeStrings();\n const options = inferCallWithChatControlOptions(props.mobileView, props.callControls);\n const chatButtonStrings = useMemo(\n () => ({\n label: callWithChatStrings.chatButtonLabel,\n tooltipOffContent: callWithChatStrings.chatButtonTooltipOpen,\n tooltipOnContent: callWithChatStrings.chatButtonTooltipClose\n }),\n [callWithChatStrings]\n );\n const peopleButtonStrings = useMemo(\n () => ({\n label: callWithChatStrings.peopleButtonLabel,\n tooltipOffContent: callWithChatStrings.peopleButtonTooltipOpen,\n tooltipOnContent: callWithChatStrings.peopleButtonTooltipClose\n }),\n [callWithChatStrings]\n );\n const moreButtonStrings = useMemo(\n () => ({\n label: callWithChatStrings.moreDrawerButtonLabel,\n tooltipContent: callWithChatStrings.moreDrawerButtonTooltip\n }),\n [callWithChatStrings]\n );\n\n const centerContainerStyles = useMemo(() => {\n const styles: BaseCustomStyles = !props.mobileView ? desktopControlBarStyles : {};\n return mergeStyleSets(styles, {\n root: {\n // Enforce a background color on control bar to ensure it matches the composite background color.\n background: theme.semanticColors.bodyBackground\n }\n });\n }, [props.mobileView, theme.semanticColors.bodyBackground]);\n const screenShareButtonStyles = useMemo(\n () => (!props.mobileView ? getDesktopScreenShareButtonStyles(theme) : undefined),\n [props.mobileView, theme]\n );\n const commonButtonStyles = useMemo(\n () => (!props.mobileView ? getDesktopCommonButtonStyles(theme) : undefined),\n [props.mobileView, theme]\n );\n const endCallButtonStyles = useMemo(\n () => (!props.mobileView ? getDesktopEndCallButtonStyles(theme) : undefined),\n [props.mobileView, theme]\n );\n /* @conditional-compile-remove(control-bar-button-injection) */\n const customButtons = useMemo(\n () =>\n generateCustomCallWithChatControlBarButton(\n onFetchCustomButtonPropsTrampoline(options !== false ? options : undefined),\n options !== false ? options?.displayType : undefined\n ),\n [options]\n );\n\n // when options is false then we want to hide the whole control bar.\n if (options === false) {\n return <></>;\n }\n\n const chatButton = (\n <ChatButtonWithUnreadMessagesBadge\n chatAdapter={props.chatAdapter}\n checked={props.chatButtonChecked}\n showLabel={options.displayType !== 'compact'}\n isChatPaneVisible={props.chatButtonChecked}\n onClick={props.onChatButtonClicked}\n disabled={props.disableButtonsForLobbyPage || isDisabled(options.chatButton)}\n strings={chatButtonStrings}\n styles={commonButtonStyles}\n newMessageLabel={callWithChatStrings.chatButtonNewMessageNotificationLabel}\n />\n );\n\n return (\n <Stack horizontal className={mergeStyles(callControlsContainerStyles, controlBarContainerStyles)}>\n <Stack.Item grow>\n <CallAdapterProvider adapter={props.callAdapter}>\n <Stack horizontalAlign=\"center\">\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={centerContainerStyles}>\n {isEnabled(options.microphoneButton) && (\n <Microphone\n displayType={options.displayType}\n styles={commonButtonStyles}\n splitButtonsForDeviceSelection={!props.mobileView}\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n disabled={props.disableButtonsForHoldScreen || isDisabled(options.microphoneButton)}\n />\n )}\n {isEnabled(options.cameraButton) && (\n <Camera\n displayType={options.displayType}\n styles={commonButtonStyles}\n splitButtonsForDeviceSelection={!props.mobileView}\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n disabled={props.disableButtonsForHoldScreen || isDisabled(options.cameraButton)}\n />\n )}\n {props.mobileView && isEnabled(options?.chatButton) && chatButton}\n {isEnabled(options.screenShareButton) && (\n <ScreenShare\n option={options.screenShareButton}\n displayType={options.displayType}\n styles={screenShareButtonStyles}\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n disabled={props.disableButtonsForHoldScreen || isDisabled(options.screenShareButton)}\n />\n )}\n {\n /* @conditional-compile-remove(control-bar-button-injection) */\n customButtons['primary']?.props.children\n .slice(\n 0,\n props.mobileView\n ? CUSTOM_BUTTON_OPTIONS.MAX_PRIMARY_MOBILE_CUSTOM_BUTTONS\n : CUSTOM_BUTTON_OPTIONS.MAX_PRIMARY_DESKTOP_CUSTOM_BUTTONS\n )\n .map((element) => {\n return (\n <element.type\n {...element.props}\n key={element.props.strings.label}\n styles={commonButtonStyles}\n displayType={options.displayType}\n showLabel={options.displayType !== 'compact'}\n />\n );\n })\n }\n {props.mobileView && (\n <MoreButton\n data-ui-id=\"call-with-chat-composite-more-button\"\n strings={moreButtonStrings}\n onClick={props.onMoreButtonClicked}\n disabled={props.disableButtonsForLobbyPage}\n />\n )}\n {\n /*@conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */ isEnabled(\n options?.moreButton\n ) &&\n /*@conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */ isEnabled(\n options?.holdButton\n ) &&\n !props.mobileView && (\n <DesktopMoreButton\n disableButtonsForHoldScreen={props.disableButtonsForHoldScreen}\n styles={commonButtonStyles}\n onClickShowDialpad={props.onClickShowDialpad}\n />\n )\n }\n <EndCall displayType=\"compact\" styles={endCallButtonStyles} />\n </ControlBar>\n </Stack.Item>\n </Stack>\n </CallAdapterProvider>\n </Stack.Item>\n {!props.mobileView && (\n <Stack horizontal className={!props.mobileView ? mergeStyles(desktopButtonContainerStyle) : undefined}>\n {\n /* @conditional-compile-remove(control-bar-button-injection) */\n customButtons['secondary']?.props.children\n .slice(0, CUSTOM_BUTTON_OPTIONS.MAX_SECONDARY_DESKTOP_CUSTOM_BUTTONS)\n .map((element) => {\n return (\n <element.type\n {...element.props}\n key={element.props.key}\n styles={commonButtonStyles}\n displayType={options.displayType}\n showLabel={options.displayType !== 'compact'}\n />\n );\n })\n }\n {isEnabled(options?.peopleButton) && (\n <PeopleButton\n checked={props.peopleButtonChecked}\n showLabel={options.displayType !== 'compact'}\n onClick={props.onPeopleButtonClicked}\n data-ui-id=\"call-with-chat-composite-people-button\"\n disabled={props.disableButtonsForLobbyPage || isDisabled(options.peopleButton)}\n strings={peopleButtonStrings}\n styles={commonButtonStyles}\n />\n )}\n {isEnabled(options?.chatButton) && chatButton}\n </Stack>\n )}\n </Stack>\n );\n};\n\nconst desktopButtonContainerStyle: IStyle = {\n padding: '0.75rem',\n columnGap: '0.5rem'\n};\n\nconst desktopControlBarStyles: BaseCustomStyles = {\n root: desktopButtonContainerStyle\n};\n\nconst getDesktopCommonButtonStyles = (theme: ITheme): ControlBarButtonStyles => ({\n root: {\n border: `solid 1px ${theme.palette.neutralQuaternaryAlt}`,\n borderRadius: theme.effects.roundedCorner4,\n minHeight: '2.5rem',\n maxWidth: '12rem' // allot extra space than the regular ControlBarButton. This is to give extra room to have the icon beside the text.\n },\n flexContainer: {\n display: 'flex',\n flexFlow: 'row nowrap'\n },\n textContainer: {\n // Override the default so that label doesn't introduce a new block.\n display: 'inline',\n\n // Ensure width is set to permit child to show ellipsis when there is a label that is too long\n maxWidth: '100%'\n },\n label: {\n fontSize: theme.fonts.medium.fontSize,\n\n // Ensure there is enough space between the icon and text to allow for the unread messages badge in the chat button\n marginLeft: '0.625rem',\n\n // Ensure letters that go above and below the standard text line like 'g', 'y', 'j' are not clipped\n lineHeight: '1.5rem',\n\n // Do not allow very long button texts to ruin the control bar experience, instead ensure long text is truncated and shows ellipsis\n display: 'block',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n overflow: 'hidden'\n },\n splitButtonMenuButton: {\n border: `solid 1px ${theme.palette.neutralQuaternaryAlt}`,\n borderTopRightRadius: theme.effects.roundedCorner4,\n borderBottomRightRadius: theme.effects.roundedCorner4,\n borderTopLeftRadius: '0',\n borderBottomLeftRadius: '0'\n },\n splitButtonMenuButtonChecked: {\n // Default colors the menu half similarly for :hover and when button is checked.\n // To align with how the left-half is styled, override the checked style.\n background: 'none'\n }\n});\n\nconst getDesktopScreenShareButtonStyles = (theme: ITheme): ControlBarButtonStyles => {\n const overrideStyles = {\n border: 'none',\n background: theme.palette.themePrimary,\n color: theme.palette.white,\n '* > svg': { fill: theme.palette.white }\n };\n const overrides: ControlBarButtonStyles = {\n rootChecked: overrideStyles,\n rootCheckedHovered: overrideStyles\n };\n return concatStyleSets(getDesktopCommonButtonStyles(theme), overrides);\n};\n\nconst getDesktopEndCallButtonStyles = (theme: ITheme): ControlBarButtonStyles => {\n const overrides: ControlBarButtonStyles = {\n root: {\n // Suppress border around the dark-red button.\n border: 'none'\n }\n };\n return concatStyleSets(getDesktopCommonButtonStyles(theme), overrides);\n};\n\nconst isEnabled = (option: unknown): boolean => option !== false;\n\"../../../../react-components/src\""]}
|
1
|
+
{"version":3,"file":"CallWithChatControlBar.js","sourceRoot":"","sources":["../../../../../../../react-composites/src/composites/CallWithChatComposite/CallWithChatControlBar.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport React, { useMemo } from 'react';\nimport { CallAdapterProvider } from '../CallComposite/adapter/CallAdapterProvider';\nimport { CallAdapter } from '../CallComposite';\nimport { PeopleButton } from './PeopleButton';\nimport { concatStyleSets, IStyle, ITheme, mergeStyles, mergeStyleSets, Stack, useTheme } from '@fluentui/react';\nimport { controlBarContainerStyles } from '../CallComposite/styles/CallControls.styles';\nimport { callControlsContainerStyles } from '../CallComposite/styles/CallPage.styles';\nimport { useCallWithChatCompositeStrings } from './hooks/useCallWithChatCompositeStrings';\nimport { ChatAdapter } from '../ChatComposite';\nimport { ChatButtonWithUnreadMessagesBadge } from './ChatButtonWithUnreadMessagesBadge';\nimport { BaseCustomStyles, ControlBarButtonStyles } from '@internal/react-components';\nimport { ControlBar } from '@internal/react-components';\nimport { Microphone } from '../CallComposite/components/buttons/Microphone';\nimport { Camera } from '../CallComposite/components/buttons/Camera';\nimport { ScreenShare } from '../CallComposite/components/buttons/ScreenShare';\nimport { EndCall } from '../CallComposite/components/buttons/EndCall';\nimport { MoreButton } from '../common/MoreButton';\nimport { CallWithChatControlOptions } from './CallWithChatComposite';\nimport { ContainerRectProps } from '../common/ContainerRectProps';\n/* @conditional-compile-remove(control-bar-button-injection) */\nimport {\n CUSTOM_BUTTON_OPTIONS,\n generateCustomCallWithChatControlBarButton,\n onFetchCustomButtonPropsTrampoline\n} from './CustomButton';\n/*@conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\nimport { DesktopMoreButton } from './components/DesktopMoreButton';\nimport { isDisabled } from '../CallComposite/utils';\nimport { HiddenFocusStartPoint } from '../common/HiddenFocusStartPoint';\n\n/**\n * @private\n */\nexport interface CallWithChatControlBarProps {\n callAdapter: CallAdapter;\n chatButtonChecked: boolean;\n peopleButtonChecked: boolean;\n onChatButtonClicked: () => void;\n onPeopleButtonClicked: () => void;\n onMoreButtonClicked: () => void;\n mobileView: boolean;\n disableButtonsForLobbyPage: boolean;\n callControls?: boolean | CallWithChatControlOptions;\n chatAdapter: ChatAdapter;\n disableButtonsForHoldScreen?: boolean;\n /* @conditional-compile-remove(PSTN-calls) */\n onClickShowDialpad?: () => void;\n}\n\nconst inferCallWithChatControlOptions = (\n mobileView: boolean,\n callWithChatControls?: boolean | CallWithChatControlOptions\n): CallWithChatControlOptions | false => {\n if (callWithChatControls === false) {\n return false;\n }\n\n const options = callWithChatControls === true || callWithChatControls === undefined ? {} : callWithChatControls;\n if (mobileView) {\n // Set to compressed mode when composite is optimized for mobile\n options.displayType = 'compact';\n // Do not show screen share button when composite is optimized for mobile unless the developer\n // has explicitly opted in.\n if (options.screenShareButton !== true) {\n options.screenShareButton = false;\n }\n }\n return options;\n};\n\n/**\n * @private\n */\nexport const CallWithChatControlBar = (props: CallWithChatControlBarProps & ContainerRectProps): JSX.Element => {\n const theme = useTheme();\n const callWithChatStrings = useCallWithChatCompositeStrings();\n const options = inferCallWithChatControlOptions(props.mobileView, props.callControls);\n const chatButtonStrings = useMemo(\n () => ({\n label: callWithChatStrings.chatButtonLabel,\n tooltipOffContent: callWithChatStrings.chatButtonTooltipOpen,\n tooltipOnContent: callWithChatStrings.chatButtonTooltipClose\n }),\n [callWithChatStrings]\n );\n const peopleButtonStrings = useMemo(\n () => ({\n label: callWithChatStrings.peopleButtonLabel,\n tooltipOffContent: callWithChatStrings.peopleButtonTooltipOpen,\n tooltipOnContent: callWithChatStrings.peopleButtonTooltipClose\n }),\n [callWithChatStrings]\n );\n const moreButtonStrings = useMemo(\n () => ({\n label: callWithChatStrings.moreDrawerButtonLabel,\n tooltipContent: callWithChatStrings.moreDrawerButtonTooltip\n }),\n [callWithChatStrings]\n );\n\n const centerContainerStyles = useMemo(() => {\n const styles: BaseCustomStyles = !props.mobileView ? desktopControlBarStyles : {};\n return mergeStyleSets(styles, {\n root: {\n // Enforce a background color on control bar to ensure it matches the composite background color.\n background: theme.semanticColors.bodyBackground\n }\n });\n }, [props.mobileView, theme.semanticColors.bodyBackground]);\n const screenShareButtonStyles = useMemo(\n () => (!props.mobileView ? getDesktopScreenShareButtonStyles(theme) : undefined),\n [props.mobileView, theme]\n );\n const commonButtonStyles = useMemo(\n () => (!props.mobileView ? getDesktopCommonButtonStyles(theme) : undefined),\n [props.mobileView, theme]\n );\n const endCallButtonStyles = useMemo(\n () => (!props.mobileView ? getDesktopEndCallButtonStyles(theme) : undefined),\n [props.mobileView, theme]\n );\n /* @conditional-compile-remove(control-bar-button-injection) */\n const customButtons = useMemo(\n () =>\n generateCustomCallWithChatControlBarButton(\n onFetchCustomButtonPropsTrampoline(options !== false ? options : undefined),\n options !== false ? options?.displayType : undefined\n ),\n [options]\n );\n\n // when options is false then we want to hide the whole control bar.\n if (options === false) {\n return <></>;\n }\n\n const chatButton = (\n <ChatButtonWithUnreadMessagesBadge\n chatAdapter={props.chatAdapter}\n checked={props.chatButtonChecked}\n showLabel={options.displayType !== 'compact'}\n isChatPaneVisible={props.chatButtonChecked}\n onClick={props.onChatButtonClicked}\n disabled={props.disableButtonsForLobbyPage || isDisabled(options.chatButton)}\n strings={chatButtonStrings}\n styles={commonButtonStyles}\n newMessageLabel={callWithChatStrings.chatButtonNewMessageNotificationLabel}\n />\n );\n\n return (\n <Stack horizontal className={mergeStyles(callControlsContainerStyles, controlBarContainerStyles)}>\n <Stack.Item grow>\n <CallAdapterProvider adapter={props.callAdapter}>\n <Stack horizontalAlign=\"center\">\n {/*\n HiddenFocusStartPoint is a util component used when we can't ensure the initial element for first\n tab focus is at the top of dom tree. It moves the first-tab focus to the next interact-able element\n immediately after it in the dom tree.\n */}\n <HiddenFocusStartPoint />\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={centerContainerStyles}>\n {isEnabled(options.microphoneButton) && (\n <Microphone\n displayType={options.displayType}\n styles={commonButtonStyles}\n splitButtonsForDeviceSelection={!props.mobileView}\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n disabled={props.disableButtonsForHoldScreen || isDisabled(options.microphoneButton)}\n />\n )}\n {isEnabled(options.cameraButton) && (\n <Camera\n displayType={options.displayType}\n styles={commonButtonStyles}\n splitButtonsForDeviceSelection={!props.mobileView}\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n disabled={props.disableButtonsForHoldScreen || isDisabled(options.cameraButton)}\n />\n )}\n {props.mobileView && isEnabled(options?.chatButton) && chatButton}\n {isEnabled(options.screenShareButton) && (\n <ScreenShare\n option={options.screenShareButton}\n displayType={options.displayType}\n styles={screenShareButtonStyles}\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n disabled={props.disableButtonsForHoldScreen || isDisabled(options.screenShareButton)}\n />\n )}\n {\n /* @conditional-compile-remove(control-bar-button-injection) */\n customButtons['primary']?.props.children\n .slice(\n 0,\n props.mobileView\n ? CUSTOM_BUTTON_OPTIONS.MAX_PRIMARY_MOBILE_CUSTOM_BUTTONS\n : CUSTOM_BUTTON_OPTIONS.MAX_PRIMARY_DESKTOP_CUSTOM_BUTTONS\n )\n .map((element) => {\n return (\n <element.type\n {...element.props}\n key={element.props.strings.label}\n styles={commonButtonStyles}\n displayType={options.displayType}\n showLabel={options.displayType !== 'compact'}\n />\n );\n })\n }\n {props.mobileView && (\n <MoreButton\n data-ui-id=\"call-with-chat-composite-more-button\"\n strings={moreButtonStrings}\n onClick={props.onMoreButtonClicked}\n disabled={props.disableButtonsForLobbyPage}\n />\n )}\n {\n /*@conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */ isEnabled(\n options?.moreButton\n ) &&\n /*@conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */ isEnabled(\n options?.holdButton\n ) &&\n !props.mobileView && (\n <DesktopMoreButton\n disableButtonsForHoldScreen={props.disableButtonsForHoldScreen}\n styles={commonButtonStyles}\n onClickShowDialpad={props.onClickShowDialpad}\n />\n )\n }\n <EndCall displayType=\"compact\" styles={endCallButtonStyles} />\n </ControlBar>\n </Stack.Item>\n </Stack>\n </CallAdapterProvider>\n </Stack.Item>\n {!props.mobileView && (\n <Stack horizontal className={!props.mobileView ? mergeStyles(desktopButtonContainerStyle) : undefined}>\n {\n /* @conditional-compile-remove(control-bar-button-injection) */\n customButtons['secondary']?.props.children\n .slice(0, CUSTOM_BUTTON_OPTIONS.MAX_SECONDARY_DESKTOP_CUSTOM_BUTTONS)\n .map((element) => {\n return (\n <element.type\n {...element.props}\n key={element.props.key}\n styles={commonButtonStyles}\n displayType={options.displayType}\n showLabel={options.displayType !== 'compact'}\n />\n );\n })\n }\n {isEnabled(options?.peopleButton) && (\n <PeopleButton\n checked={props.peopleButtonChecked}\n showLabel={options.displayType !== 'compact'}\n onClick={props.onPeopleButtonClicked}\n data-ui-id=\"call-with-chat-composite-people-button\"\n disabled={props.disableButtonsForLobbyPage || isDisabled(options.peopleButton)}\n strings={peopleButtonStrings}\n styles={commonButtonStyles}\n />\n )}\n {isEnabled(options?.chatButton) && chatButton}\n </Stack>\n )}\n </Stack>\n );\n};\n\nconst desktopButtonContainerStyle: IStyle = {\n padding: '0.75rem',\n columnGap: '0.5rem'\n};\n\nconst desktopControlBarStyles: BaseCustomStyles = {\n root: desktopButtonContainerStyle\n};\n\nconst getDesktopCommonButtonStyles = (theme: ITheme): ControlBarButtonStyles => ({\n root: {\n border: `solid 1px ${theme.palette.neutralQuaternaryAlt}`,\n borderRadius: theme.effects.roundedCorner4,\n minHeight: '2.5rem',\n maxWidth: '12rem' // allot extra space than the regular ControlBarButton. This is to give extra room to have the icon beside the text.\n },\n flexContainer: {\n display: 'flex',\n flexFlow: 'row nowrap'\n },\n textContainer: {\n // Override the default so that label doesn't introduce a new block.\n display: 'inline',\n\n // Ensure width is set to permit child to show ellipsis when there is a label that is too long\n maxWidth: '100%'\n },\n label: {\n fontSize: theme.fonts.medium.fontSize,\n\n // Ensure there is enough space between the icon and text to allow for the unread messages badge in the chat button\n marginLeft: '0.625rem',\n\n // Ensure letters that go above and below the standard text line like 'g', 'y', 'j' are not clipped\n lineHeight: '1.5rem',\n\n // Do not allow very long button texts to ruin the control bar experience, instead ensure long text is truncated and shows ellipsis\n display: 'block',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n overflow: 'hidden'\n },\n splitButtonMenuButton: {\n border: `solid 1px ${theme.palette.neutralQuaternaryAlt}`,\n borderTopRightRadius: theme.effects.roundedCorner4,\n borderBottomRightRadius: theme.effects.roundedCorner4,\n borderTopLeftRadius: '0',\n borderBottomLeftRadius: '0'\n },\n splitButtonMenuButtonChecked: {\n // Default colors the menu half similarly for :hover and when button is checked.\n // To align with how the left-half is styled, override the checked style.\n background: 'none'\n }\n});\n\nconst getDesktopScreenShareButtonStyles = (theme: ITheme): ControlBarButtonStyles => {\n const overrideStyles = {\n border: 'none',\n background: theme.palette.themePrimary,\n color: theme.palette.white,\n '* > svg': { fill: theme.palette.white }\n };\n const overrides: ControlBarButtonStyles = {\n rootChecked: overrideStyles,\n rootCheckedHovered: overrideStyles\n };\n return concatStyleSets(getDesktopCommonButtonStyles(theme), overrides);\n};\n\nconst getDesktopEndCallButtonStyles = (theme: ITheme): ControlBarButtonStyles => {\n const overrides: ControlBarButtonStyles = {\n root: {\n // Suppress border around the dark-red button.\n border: 'none'\n }\n };\n return concatStyleSets(getDesktopCommonButtonStyles(theme), overrides);\n};\n\nconst isEnabled = (option: unknown): boolean => option !== false;\n\"../../../../react-components/src\""]}
|
@@ -0,0 +1,8 @@
|
|
1
|
+
/// <reference types="react" />
|
2
|
+
/**
|
3
|
+
* @private
|
4
|
+
* hidden button to set first tab keypress focus on a specific grouping.
|
5
|
+
* On mount, button is autofocused then immediately hidden
|
6
|
+
*/
|
7
|
+
export declare const HiddenFocusStartPoint: () => JSX.Element;
|
8
|
+
//# sourceMappingURL=HiddenFocusStartPoint.d.ts.map
|