communication-react-19
Version:
React library for building modern communication user experiences utilizing Azure Communication Services (React 19 compatible fork)
34 lines • 1.89 kB
JavaScript
// Copyright (c) Microsoft Corporation.
// Licensed under the MIT License.
import React, { useMemo } from 'react';
import { CallCompositeIcon } from '../icons';
import { ControlBarButton } from "../../../../../react-components/src";
import { concatStyleSets, useTheme } from '@fluentui/react';
import { useLocale } from '../../localization';
const icon = () => React.createElement(CallCompositeIcon, { iconName: 'DtmfDialpadButton' });
/**
* Button for showing and hiding the dtmf dialer in the Call composite.
* To be used only if the more button control is disabled. This button will replace
* it in the control bar unless it is also disabled.
* @private
*/
export const DtmfDialpadButton = (props) => {
const { strings, onRenderOnIcon, onRenderOffIcon, onClick, displayType } = props;
const theme = useTheme();
const locale = useLocale();
const dialpadButtonStrings = {
label: locale.strings.call.dtmfDialerButtonLabel,
tooltipOnContent: locale.strings.call.dtmfDialerButtonTooltipOn,
tooltipOffContent: locale.strings.call.dtmfDialerButtonTooltipOff
};
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]);
return (React.createElement(ControlBarButton, Object.assign({}, props, { strings: strings ? strings : dialpadButtonStrings, showLabel: displayType !== 'compact', labelKey: 'dtmfDialpadButtonLabelKey', onRenderOnIcon: onRenderOnIcon !== null && onRenderOnIcon !== void 0 ? onRenderOnIcon : icon, onRenderOffIcon: onRenderOffIcon !== null && onRenderOffIcon !== void 0 ? onRenderOffIcon : icon, onClick: onClick, styles: styles })));
};
//# sourceMappingURL=DtmfDialerButton.js.map