communication-react-19
Version:
React library for building modern communication user experiences utilizing Azure Communication Services (React 19 compatible fork)
25 lines • 1.13 kB
JavaScript
// Copyright (c) Microsoft Corporation.
// Licensed under the MIT License.
import { Icon, mergeStyles } from '@fluentui/react';
import React from 'react';
import { useTheme } from '../theming';
/**
* This is a helper component to define and unify icon colors
*
* @internal
*/
export const _HighContrastAwareIcon = (props) => {
const { iconName, disabled } = props;
const theme = useTheme();
// setting colors for the icons using color from theme, so in dark mode or other accessibility modes, they have pre-defined contrast colors
// the media query is for when in specific window accessibility mode, change the svg colors
return (React.createElement(Icon, { iconName: iconName, className: mergeStyles({
svg: {
fill: disabled ? theme.palette.neutralTertiary : theme.palette.neutralPrimaryAlt,
'@media (forced-colors: active) and (prefers-color-scheme: dark)': {
fill: disabled ? theme.palette.neutralPrimaryAlt : theme.palette.neutralTertiary
}
}
}) }));
};
//# sourceMappingURL=HighContrastAwareIcon.js.map