feat: pass event to handler callback in useOutsideClick #1998
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
Preview is ready. |
|
Visual Tests Report is ready. |
lolmaus
changed the title
lolmaus
changed the title
NikitaCG
requested changes
Dec 24, 2024
| @@ -2,7 +2,7 @@ import React from 'react'; | |||
|
|
|||
| export interface UseOutsideClickProps<T> { | |||
| ref: React.RefObject<T>; | |||
| handler?: () => void; | |||
| handler?: (e: MouseEvent | TouchEvent) => void; | |||
There was a problem hiding this comment.
let's make e optional e?. It looks like breaking change right now.
There was a problem hiding this comment.
No, it won't be a breaking change. It's like onClick in Button where you can skip this argument if there is no need to use it
korvin89
approved these changes
Dec 24, 2024
NikitaCG
approved these changes
Dec 24, 2024
lolmaus
force-pushed
the
use-outside-click-pass-event-to-handler
branch
from
6f94a90 to
8e365cc
Compare
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
We're using
useOutsideClickto close a modal.The modal renders a menu popup with a tethering mechanism (Popper.js or similar). The popup is rendered not inline, but on the root level at the very end of the
<body>content. As a result, when a menu item is clicked, theuseOutsideClickcallback is triggered and the modal is closed.Conceptually, the menu popup is part of the modal, so selecting an item in the menu should not close the modal.
This can be easily resolved by checking that the click has been made on the actual page and not a popup which is not part of the page:
But unfortunately, the
useOutsideClickhook does not pass the event.This PR enables passing of the event.
PS Me on Staff: https://nda.ya.ru/t/BGTaa7T67AUVGa