communication-react-19
Version:
React library for building modern communication user experiences utilizing Azure Communication Services (React 19 compatible fork)
79 lines • 1.73 kB
JavaScript
// Copyright (c) Microsoft Corporation.
// Licensed under the MIT License.
import { mergeStyles } from '@fluentui/react';
const menuIconClass = 'ms-acs-participant-item-menu-icon';
/**
* @private
*/
export const participantItemContainerStyle = (options, theme) => {
return {
paddingTop: '0.25rem',
paddingBottom: '0.25rem',
display: 'flex',
maxWidth: '100%',
minWidth: '8rem',
cursor: !options.clickable ? 'default' : 'pointer',
alignItems: 'center',
':focus-visible': {
[` .${menuIconClass}`]: {
display: 'flex'
},
outline: `0.1rem solid ${theme.palette.themePrimary}`
}
};
};
/**
* @private
*/
export const displayNoneStyle = {
display: 'none'
};
/**
* @private
*/
export const menuButtonContainerStyle = {
width: 'auto'
};
/**
* @private
*/
export const participantStateMaxWidth = '5rem';
/**
* @private
*/
export const participantStateStringStyles = {
maxWidth: participantStateMaxWidth,
overflow: 'hidden',
textOverflow: 'ellipsis',
whiteSpace: 'nowrap',
lineHeight: 'normal',
marginLeft: '0.5rem',
marginRight: 0
};
/**
* @private
*/
export const iconContainerStyle = {
display: 'flex',
alignItems: 'center',
height: '100%',
paddingTop: '0.2rem'
};
/**
* @private
*/
export const iconStyles = mergeStyles([
menuIconClass,
{
display: 'flex',
lineHeight: 0, // ensure the icon center is on the center line and not slightly above it
alignItems: 'center'
}
]);
/**
* @private
*/
export const meContainerStyle = {
paddingRight: '0.5rem'
};
//# sourceMappingURL=ParticipantItem.styles.js.map