24 lines
724 B
TypeScript
24 lines
724 B
TypeScript
import { makeStyles, tokens } from "@fluentui/react-components";
|
|
|
|
const useStyles = makeStyles({
|
|
tooltip: {
|
|
backgroundColor: tokens.colorNeutralBackground1,
|
|
border: `1px solid ${tokens.colorNeutralStroke2}`,
|
|
borderRadius: tokens.borderRadiusSmall,
|
|
padding: `${tokens.spacingVerticalXS} ${tokens.spacingHorizontalS}`,
|
|
color: tokens.colorNeutralForeground1,
|
|
fontSize: tokens.fontSizeBase200,
|
|
},
|
|
});
|
|
|
|
interface ChartTooltipProps {
|
|
active: boolean;
|
|
children: React.ReactNode;
|
|
}
|
|
|
|
export function ChartTooltip({ active, children }: ChartTooltipProps): React.JSX.Element | null {
|
|
const styles = useStyles();
|
|
if (!active) return null;
|
|
return <div className={styles.tooltip}>{children}</div>;
|
|
}
|