Merge pull request #3530 from AnnMarieW/v4-update-tooltip

Make targetable tooltips interactive in v4

Author: KoolADE85

components/dash-core-components/src/components/Tooltip.tsx

@@ -31,6 +31,7 @@ const Tooltip = ({
         height: `${position?.y1 - position?.y0}px`,
         display: `${show_tooltip ? 'inline-block' : 'none'}`,
         pointerEvents: `${targetable ? 'auto' : 'none'}`,
+        '--Dash-Tooltip-PointerEvents': targetable ? 'auto' : 'none',
         '--Dash-Tooltip-Border-Color': border_color,
         '--Dash-Tooltip-Background-Color': background_color,
         '--Dash-Tooltip-ZIndex': zindex,

components/dash-core-components/src/components/css/tooltip.css

@@ -32,7 +32,7 @@
     background: var(--Dash-Tooltip-Background-Color);
     white-space: nowrap;
     z-index: var(--Dash-Tooltip-ZIndex);
-    pointer-events: none;
+    pointer-events: var(--Dash-Tooltip-PointerEvents);
     box-shadow: 0px 10px 38px -10px var(--Dash-Shading-Strong),
         0px 10px 20px -15px var(--Dash-Shading-Weak);
 }