communication-react-19
Version:
React library for building modern communication user experiences utilizing Azure Communication Services (React 19 compatible fork)
33 lines • 1.73 kB
JavaScript
// Copyright (c) Microsoft Corporation.
// Licensed under the MIT License.
import { memoizeFunction, Stack } from '@fluentui/react';
import React from 'react';
import { useTheme } from '../../theming/FluentThemeProvider';
/** @private */
export const PictureInPictureInPicturePrimaryTile = (props) => {
const boxShadow = useTheme().effects.elevation8;
return (React.createElement(PictureInPictureInPictureTile, { styles: primaryTileStyles(props.orientation, boxShadow) }, props.children));
};
/** @private */
export const PictureInPictureInPictureSecondaryTile = (props) => (React.createElement(PictureInPictureInPictureTile, { styles: secondaryTileStyles(props.orientation) }, props.children));
const PictureInPictureInPictureTile = (props) => (React.createElement(Stack, { styles: props.styles }, props.children));
const primaryTileStyles = memoizeFunction((orientation, themeElevation) => ({
root: {
borderRadius: '0.25rem',
height: orientation === 'landscape' ? '5.5rem' : '8rem',
width: orientation === 'landscape' ? '8rem' : '5.5rem',
boxShadow: themeElevation,
// PiPiP tiles were not designed to host scrollable content. If removed check no scrollbar is showing in e2e tests
overflow: 'hidden'
}
}));
const secondaryTileStyles = memoizeFunction((orientation) => ({
root: {
borderRadius: '0.25rem',
height: orientation === 'landscape' ? '1.625rem' : '2rem',
width: orientation === 'landscape' ? '2rem' : '1.625rem',
// PiPiP tiles were not designed to host scrollable content. If removed check no scrollbar is showing in e2e tests
overflow: 'hidden'
}
}));
//# sourceMappingURL=PictureInPictureInPictureTile.js.map