mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Chart/Tooltip: refactored style declaration (#30824)
* Chart/Tooltip: added theme variables and refactored style declaration * added some changes * removed useStyle hook since we're not using themes variables * Added useStyle back since it memoizes the style generation
This commit is contained in:
parent
ef589bd4ff
commit
1f66b5c7a9
@ -4,6 +4,7 @@ import { Portal } from '../Portal/Portal';
|
||||
import { Dimensions, TimeZone } from '@grafana/data';
|
||||
import { FlotPosition } from '../Graph/types';
|
||||
import { TooltipContainer } from './TooltipContainer';
|
||||
import { useStyles } from '../../themes';
|
||||
|
||||
export type TooltipMode = 'single' | 'multi' | 'none';
|
||||
|
||||
@ -46,18 +47,10 @@ export interface TooltipProps {
|
||||
}
|
||||
|
||||
export const Tooltip: React.FC<TooltipProps> = ({ content, position, offset }) => {
|
||||
const styles = useStyles(getStyles);
|
||||
if (position) {
|
||||
return (
|
||||
<Portal
|
||||
className={css`
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
pointer-events: none;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
`}
|
||||
>
|
||||
<Portal className={styles.portal}>
|
||||
<TooltipContainer position={position} offset={offset || { x: 0, y: 0 }}>
|
||||
{content}
|
||||
</TooltipContainer>
|
||||
@ -68,3 +61,16 @@ export const Tooltip: React.FC<TooltipProps> = ({ content, position, offset }) =
|
||||
};
|
||||
|
||||
Tooltip.displayName = 'ChartTooltip';
|
||||
|
||||
const getStyles = () => {
|
||||
return {
|
||||
portal: css`
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
pointer-events: none;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
`,
|
||||
};
|
||||
};
|
||||
|
Loading…
Reference in New Issue
Block a user