<ListItem disabled tooltip="hello">

<ListItem disabled tooltip="hello">...

The tooltip doesn’t show if the item is disabled. And that is the only time I want to show the tooltip – to explain why it is disabled!

<ListItem disabled={disabled} tooltip={disabled ? "Why disabled" : null} >...

This does not show the tooltip when disabled, but does show it when it is not (that is disabled=false). I thought the null would tell it to not show. Neither null, '', nor undefined works to remove it.

Pushed fix for changing tooltip value and to destroy it when its value became null or enable it when it becomes not null. But for disabled thing, it still won’t work, as disabled class adds pointer-events: none to element, so it can’t receive any touch, mouse events and we can’t show tooltip.

You can just add custom my-disabled class add same rule for inner element class, e.g.:

.my-disabled > * {
  pointer-events: none;
  opacity: 0.55;
}