tooltip not useful for disabled button

[Pyrolistical]

I want to let users hover over disabled buttons to see the tooltip to understand why it is disabled, but tooltips do not show for disabled buttons

[javivelasco]

Yes, this is happening because we disable pointer-events if the button is disabled. This way we avoid any interaction with the Button. A way to allow you to do what you want would be a wrapper. Otherwise, if we consider this as a mistake, we would need to decide if we call pointer events from the button if it's disabled or if otherwise we have to delegate that responsibility to the user.

Feedback on this is appreciated because the change may be considered a breaking change.

[javivelasco]

I've investigated a bit and actually setting pointer-events to none for disabled buttons doesn't sound like a bad pattern for me. Bootstrap it's doing the same thing and they've detailed in the documentation a workaround for that.

For me this is a better solution because otherwise we should control every event on disabled buttons. It should work nicely anyway with an extra div.

[pastaclub]

Here's a component that does the work-around: react-bootstrap-tooltip-button

Wrapping a button in a <div> breaks the bootstrap styling for ButtonGroup and ButtonToolbar because those css rules expect a button, not a div. This component fixes that as well.

[acthp]

Hitting this problem a lot. It's unclear what the workaround is for different components, e.g. for MenuItem I couldn't find a solution via div wrap, but setting pointer-events: all on the element works.