Trying to add clickable links to a tooltip

[zekedroid]

There was an issue a while back about adding anchor tags to the content in a Tooltip. It mostly works except that there is a css rule on the rendered tooltip which causes all pointer events to be omitted, thereby not allowing clicking of anything inside any tooltip.

The exact rule is

.__react_component_tooltip {
    pointer-events: none;
}

Is there a way to manually turn this off? What is its purpose exactly and could we do without it?

[wwayne]

You can check the demo page in Theme and delay

<a data-tip='hover on me will keep the tootlip'>(･ω´･ )́)</a>
<ReactTooltip class='extraClass' delayHide={1000} effect='solid'/>
.extraClass {
  font-size: 20px !important;
  pointer-events: auto !important;
  &:hover {
     visibility: visible !important;
     opacity: 1 !important;
  }
}

I have to admit that the solution is super ugly, I will try to add a new option to support this in the future.