communication-react-19
Version:
React library for building modern communication user experiences utilizing Azure Communication Services (React 19 compatible fork)
38 lines • 2.23 kB
JavaScript
// Copyright (c) Microsoft Corporation.
// Licensed under the MIT License.
import React, { useCallback, useMemo } from 'react';
import { ControlBarButton, useTheme } from "../../../../../react-components/src";
import { concatStyleSets } from '@fluentui/react';
import { CallCompositeIcon } from '../icons';
const icon = () => React.createElement(CallCompositeIcon, { iconName: 'ControlBarPeopleButton' });
/**
* @private
*/
export const PeopleButton = (props) => {
const { strings, onRenderOnIcon, onRenderOffIcon, onClick, peoplePaneDismissButtonRef, chatButtonPresent } = props;
const theme = useTheme();
const styles = useMemo(() => {
var _a;
return concatStyleSets({
rootChecked: {
background: theme.palette.neutralLight
}
}, (_a = props.styles) !== null && _a !== void 0 ? _a : {});
}, [props.styles, theme.palette.neutralLight]);
const handleTab = useCallback((event) => {
if (event.key === 'Tab' && !event.shiftKey && (peoplePaneDismissButtonRef === null || peoplePaneDismissButtonRef === void 0 ? void 0 : peoplePaneDismissButtonRef.current) && !chatButtonPresent) {
peoplePaneDismissButtonRef.current.focus();
event.preventDefault();
}
}, [peoplePaneDismissButtonRef, chatButtonPresent]);
const handleClick = useCallback((event) => {
var _a;
onClick === null || onClick === void 0 ? void 0 : onClick(event);
if (chatButtonPresent) {
(_a = peoplePaneDismissButtonRef === null || peoplePaneDismissButtonRef === void 0 ? void 0 : peoplePaneDismissButtonRef.current) === null || _a === void 0 ? void 0 : _a.focus();
event.preventDefault();
}
}, [chatButtonPresent, onClick, peoplePaneDismissButtonRef]);
return (React.createElement(ControlBarButton, Object.assign({}, props, { strings: strings, labelKey: 'peopleButtonLabelKey', onRenderOnIcon: onRenderOnIcon !== null && onRenderOnIcon !== void 0 ? onRenderOnIcon : icon, onRenderOffIcon: onRenderOffIcon !== null && onRenderOffIcon !== void 0 ? onRenderOffIcon : icon, onClick: handleClick, onKeyDown: handleTab, styles: styles })));
};
//# sourceMappingURL=PeopleButton.js.map