Add option to replace mouse events with pointer events in useHover hook

[rtivital]

Disabled buttons do not support mouseleave event (facebook/react#18753). This leads to several issues that occur with current implementation:

• Tooltip isn't shown when disabled button is hovered
• Tooltip will not be hidden if button is disabled while being hovered

Sandbox that illustrates both issues – https://codesandbox.io/s/divine-snow-48v1gl?file=/src/App.tsx

To solve these issues, I propose to add an option to useHover hook to use pointer events instead of mouse events:

useHover({
  eventsType: 'pointer',
  // ... other options
});

[atomiks]

pointerleave doesn't fire on Safari (and those events have different hover semantics with touch input). Plus, it's still inaccessible via keyboard.

disabled prop should not be used at all if there is a tooltip attached to the button: https://floating-ui.com/docs/react-dom-interactions#disabled-elements

[zoubingwu]

disabled prop should not be used at all

@atomiks what if I want to have a tooltip to tell users why this button is disabled and how they should do. any recommandation?

[zoubingwu]

visually disabled still fires event when user click the button tho.

[zoubingwu]

I'm using a wrapper tag anyway, pm's needs must be satisfied 😊

[atomiks]

The link tells you what you should do. You early-return from event handlers (or conditionally set them), without using the disabled prop.