Closed darlk closed 1 year ago
Taking a quick look at this, I think this can be fixed by implementing the handleClose prop of useHover hook provided by the @floating-ui/react-dom-interactions package.
lines 87-92 in Floating.tsx
const { getFloatingProps, getReferenceProps } = useInteractions([
useClick(context, { enabled: trigger === 'click' }),
useFocus(context),
useHover(context, { enabled: trigger === 'hover' }),
useRole(context, { role: 'tooltip' }),
]);
would become:
const { getFloatingProps, getReferenceProps } = useInteractions([
useClick(context, { enabled: trigger === 'click' }),
useFocus(context),
useHover(context, {
enabled: trigger === 'hover' ,
handleClose: safePolygon(),
}),
useRole(context, { role: 'tooltip' }),
]);
The useHover docs are here.
FYI: The Tooltip component also uses Floating.tsx (maybe other/future components), so the hover tooltip would also remain open on mouseover. Not sure that's desirable though.
Hi, I'd like to try to fix this, is this up for grabs?
@VedanthB go ahead
Hey @rluders, I've fixed this and raised a PR, please review. 😄
Describe the bug set dropdown component in hover trigger mod mouse enter is ok, but mouse leave, the menu is close too...
To Reproduce https://flowbite-react.com/storybook/?path=/docs/components-dropdown--inline set trigger mod in hover
Expected behavior mouse can point to menu any time an select something
Screenshots
System information:
Project information:
Additional context