react-tooltip 5.27.0 → 5.27.1

package/dist/react-tooltip.umd.js

@@ -49,11 +49,7 @@
         }
         const { insertAt } = ref;
         if (document.getElementById(id)) {
-            // this should never happen because of `injected[type]`
-            {
-                // eslint-disable-next-line no-console
-                console.warn(`[react-tooltip] Element with id '${id}' already exists. Call \`removeStyle()\` first`);
-            }
+            // this could happen in cases the tooltip is imported by multiple js modules
             return;
         }
         const head = document.head || document.getElementsByTagName('head')[0];
@@ -289,6 +285,14 @@
 
     const useIsomorphicLayoutEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;
 
+    const clearTimeoutRef = (ref) => {
+        if (ref.current) {
+            clearTimeout(ref.current);
+            // eslint-disable-next-line no-param-reassign
+            ref.current = null;
+        }
+    };
+
     const DEFAULT_TOOLTIP_ID = 'DEFAULT_TOOLTIP_ID';
     const DEFAULT_CONTEXT_DATA = {
         anchorRefs: new Set(),
@@ -543,9 +547,7 @@
             if (show === wasShowing.current) {
                 return;
             }
-            if (missedTransitionTimerRef.current) {
-                clearTimeout(missedTransitionTimerRef.current);
-            }
+            clearTimeoutRef(missedTransitionTimerRef);
             wasShowing.current = show;
             if (show) {
                 afterShow === null || afterShow === void 0 ? void 0 : afterShow();
@@ -574,9 +576,7 @@
                 : newComputedPosition);
         };
         const handleShowTooltipDelayed = (delay = delayShow) => {
-            if (tooltipShowDelayTimerRef.current) {
-                clearTimeout(tooltipShowDelayTimerRef.current);
-            }
+            clearTimeoutRef(tooltipShowDelayTimerRef);
             if (rendered) {
                 // if the tooltip is already rendered, ignore delay
                 handleShow(true);
@@ -587,9 +587,7 @@
             }, delay);
         };
         const handleHideTooltipDelayed = (delay = delayHide) => {
-            if (tooltipHideDelayTimerRef.current) {
-                clearTimeout(tooltipHideDelayTimerRef.current);
-            }
+            clearTimeoutRef(tooltipHideDelayTimerRef);
             tooltipHideDelayTimerRef.current = setTimeout(() => {
                 if (hoveringTooltip.current) {
                     return;
@@ -620,9 +618,7 @@
             }
             setActiveAnchor(target);
             setProviderActiveAnchor({ current: target });
-            if (tooltipHideDelayTimerRef.current) {
-                clearTimeout(tooltipHideDelayTimerRef.current);
-            }
+            clearTimeoutRef(tooltipHideDelayTimerRef);
         };
         const handleHideTooltip = () => {
             if (clickable) {
@@ -635,9 +631,7 @@
             else {
                 handleShow(false);
             }
-            if (tooltipShowDelayTimerRef.current) {
-                clearTimeout(tooltipShowDelayTimerRef.current);
-            }
+            clearTimeoutRef(tooltipShowDelayTimerRef);
         };
         const handleTooltipPosition = ({ x, y }) => {
             var _a;
@@ -698,9 +692,7 @@
                 return;
             }
             handleShow(false);
-            if (tooltipShowDelayTimerRef.current) {
-                clearTimeout(tooltipShowDelayTimerRef.current);
-            }
+            clearTimeoutRef(tooltipShowDelayTimerRef);
         };
         // debounce handler to prevent call twice when
         // mouse enter and focus events being triggered toggether
@@ -984,12 +976,8 @@
                                 setRendered(false);
                                 handleShow(false);
                                 setActiveAnchor(null);
-                                if (tooltipShowDelayTimerRef.current) {
-                                    clearTimeout(tooltipShowDelayTimerRef.current);
-                                }
-                                if (tooltipHideDelayTimerRef.current) {
-                                    clearTimeout(tooltipHideDelayTimerRef.current);
-                                }
+                                clearTimeoutRef(tooltipShowDelayTimerRef);
+                                clearTimeoutRef(tooltipHideDelayTimerRef);
                                 return true;
                             }
                             return false;
@@ -1068,12 +1056,8 @@
                 handleShow(true);
             }
             return () => {
-                if (tooltipShowDelayTimerRef.current) {
-                    clearTimeout(tooltipShowDelayTimerRef.current);
-                }
-                if (tooltipHideDelayTimerRef.current) {
-                    clearTimeout(tooltipHideDelayTimerRef.current);
-                }
+                clearTimeoutRef(tooltipShowDelayTimerRef);
+                clearTimeoutRef(tooltipHideDelayTimerRef);
             };
         }, []);
         React.useEffect(() => {
@@ -1096,7 +1080,11 @@
         }, [id, anchorSelect, imperativeOptions === null || imperativeOptions === void 0 ? void 0 : imperativeOptions.anchorSelect]);
         React.useEffect(() => {
             if (tooltipShowDelayTimerRef.current) {
-                clearTimeout(tooltipShowDelayTimerRef.current);
+                /**
+                 * if the delay changes while the tooltip is waiting to show,
+                 * reset the timer with the new delay
+                 */
+                clearTimeoutRef(tooltipShowDelayTimerRef);
                 handleShowTooltipDelayed(delayShow);
             }
         }, [delayShow]);
@@ -1137,9 +1125,7 @@
             isOpen: Boolean(rendered && !hidden && actualContent && canShow),
         }));
         return rendered && !hidden && actualContent ? (React__default["default"].createElement(WrapperElement, { id: id, role: role, className: classNames__default["default"]('react-tooltip', coreStyles['tooltip'], styles['tooltip'], styles[variant], className, `react-tooltip__place-${computedPosition.place}`, coreStyles[canShow ? 'show' : 'closing'], canShow ? 'react-tooltip__show' : 'react-tooltip__closing', positionStrategy === 'fixed' && coreStyles['fixed'], clickable && coreStyles['clickable']), onTransitionEnd: (event) => {
-                if (missedTransitionTimerRef.current) {
-                    clearTimeout(missedTransitionTimerRef.current);
-                }
+                clearTimeoutRef(missedTransitionTimerRef);
                 if (show || event.propertyName !== 'opacity') {
                     return;
                 }