Add isTooltipPresent

src/component/Tooltip.tsx

@@ -44,6 +44,7 @@ function ContextUpdater(props: TooltipProps<any, any>) {
   const [, setContext] = useContext(ChartContext);
   useEffect(() => {
     const newContext: ChartContextType = {
+      isTooltipPresent: true,
       content: props.content,
       cursor: props.cursor,
       isAnimationActive: props.isAnimationActive,
@@ -63,6 +64,9 @@ function ContextUpdater(props: TooltipProps<any, any>) {
       position: props.position,
     };
     setContext(newContext);
+    return function cleanup() {
+      setContext({ isTooltipPresent: false });
+    };
   }, [props, setContext]);
 
   return <></>;

src/context/chartContext.tsx

@@ -12,6 +12,7 @@ export type AllowInDimension = {
 };
 
 export type ChartContextType = {
+  isTooltipPresent: boolean;
   allowEscapeViewBox: AllowInDimension;
   animationDuration: AnimationDuration;
   animationEasing: AnimationTiming;
@@ -32,6 +33,7 @@ function defaultUniqBy(entry: Payload<any, any>) {
 }
 
 const defaultValue: ChartContextType = {
+  isTooltipPresent: false,
   content: DefaultTooltipContent,
   cursor: true,
   isAnimationActive: !Global.isSsr,
@@ -54,7 +56,7 @@ const defaultValue: ChartContextType = {
 };
 
 export const ChartContext = createContext<
-  [context: ChartContextType, setContext: (newContext: ChartContextType) => void]
+  [context: ChartContextType, setContext: (newContext: Partial<ChartContextType>) => void]
 >([defaultValue, () => undefined]);
 
 export function ChartContextContainer(props: { children: ReactNode }) {

src/renderer/TooltipRenderer.tsx

@@ -11,7 +11,8 @@ import React, {
   useState,
 } from 'react';
 import { translateStyle } from 'react-smooth';
-import _ from 'lodash';
+import isNil from 'lodash/isNil';
+import isFunction from 'lodash/isFunction';
 import { ChartContext } from '../context/chartContext';
 import {
   CartesianViewBox,
@@ -122,7 +123,7 @@ function useUniqPayload(payload: Array<Payload<any, any>>) {
   const [context] = useContext(ChartContext);
   const { payloadUniqBy, filterNull } = context;
   const finalPayload = getUniqPayload(
-    filterNull && payload && payload.length ? payload.filter(entry => !_.isNil(entry.value)) : payload,
+    filterNull && payload && payload.length ? payload.filter(entry => !isNil(entry.value)) : payload,
     payloadUniqBy,
     defaultUniqBy,
   );
@@ -138,7 +139,7 @@ function renderContent<TValue extends ValueType, TName extends NameType>(
   if (React.isValidElement(content)) {
     return React.cloneElement(content, props);
   }
-  if (_.isFunction(content)) {
+  if (isFunction(content)) {
     return React.createElement(content as any, props);
   }
 
@@ -284,7 +285,12 @@ function BoundingBoxSizeWrapper({
 }
 
 export function TooltipRenderer(props: Props) {
+  const [context] = useContext(ChartContext);
   const { finalPayload, hasPayload } = useUniqPayload(props.activePayload);
+  const { isTooltipPresent } = context;
+  if (!isTooltipPresent) {
+    return null;
+  }
   return (
     <>
       <CursorRenderer {...props} />