communication-react-19
Version:
React library for building modern communication user experiences utilizing Azure Communication Services (React 19 compatible fork)
35 lines • 1.51 kB
JavaScript
// Copyright (c) Microsoft Corporation.
// Licensed under the MIT License.
import { AnimationStyles, mergeStyles, Stack, Text, useTheme } from '@fluentui/react';
import React from 'react';
/**
* Container that holds the content of the drawer
*
* @private
*/
export const DrawerContentContainer = (props) => {
var _a;
const theme = useTheme();
const backgroundColor = theme.palette.white;
const borderRadius = theme.effects.roundedCorner4;
const rootStyles = mergeStyles(containerStyles(backgroundColor, borderRadius), (_a = props.styles) === null || _a === void 0 ? void 0 : _a.root);
return (React.createElement(Stack, { className: rootStyles },
props.heading && (React.createElement(Stack, { className: mergeStyles(headingContainerStyles) },
React.createElement(Text, { className: mergeStyles(headingStyles(theme)) }, props.heading))),
props.children));
};
const containerStyles = (backgroundColor, borderRadius) => (Object.assign({ background: backgroundColor, borderTopRightRadius: borderRadius, borderTopLeftRadius: borderRadius }, AnimationStyles.slideUpIn10));
const headingContainerStyles = {
textAlign: 'center',
width: '100%',
padding: '0.5rem'
};
const headingStyles = (theme) => ({
color: theme.palette.neutralSecondary,
fontSize: theme.fonts.smallPlus.fontSize,
lineHeight: '1rem',
whiteSpace: 'nowrap',
overflow: 'hidden',
textOverflow: 'ellipsis'
});
//# sourceMappingURL=DrawerContentContainer.js.map