fix(Popover): popover content now closes on ESC key press #4557
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
|
Storybook staging is available at https://kiwicom-orbit-sarka-popover-esc-close.surge.sh |
|
Size Change: +11 B (0%) Total Size: 459 kB
ℹ️ View Unchanged
|
sarkaaa
force-pushed
the
sarka/popover-esc-close
branch
from
7e5c738 to
fcb64e7
Compare
Deploying orbit with
|
| Latest commit: |
002b225
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://cd44c49e.orbit.pages.dev |
| Branch Preview URL: | https://sarka-popover-esc-close.orbit.pages.dev |
![callstackai[bot]](https://avatars.githubusercontent.com/in/1040204?s=60&v=4){kind=small}
Comment on lines
69
to
72
| } else { | ||
| setShown(false); | ||
| } |
There was a problem hiding this comment.
🐛 Possible Bug
The new else block in handleOut will close the popover when clicking inside it, which breaks the expected behavior. The popover should only close when clicking outside (!ref.current.contains(ev.target)) or when explicitly triggered. The current implementation will make the popover close when interacting with any content inside it, including buttons or form elements.
Suggested change
| } else { | |
| setShown(false); | |
| } | |
| } else if (typeof opened === "undefined" && onClose) { | |
| onClose(); | |
| } |
sarkaaa
force-pushed
the
sarka/popover-esc-close
branch
2 times, most recently
from
867771b to
a565143
Compare
sarkaaa
force-pushed
the
sarka/popover-esc-close
branch
from
a565143 to
002b225
Compare
sarkaaa
changed the title
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.
closes https://kiwicom.atlassian.net/browse/FEPLT-2185
This Pull Request meets the following criteria:
For new components:
d.tsfiles and are exported inindex.d.ts✨
Description by Callstackai
This PR adds functionality to close the Popover component when the ESC key is pressed, along with visual regression tests for this feature.
Diagrams of code changes
sequenceDiagram participant User participant Popover participant Dialog participant KeyboardEvent User->>Popover: Opens Popover Popover->>Dialog: Shows dialog content Note over Dialog: Dialog becomes visible User->>KeyboardEvent: Presses ESC key KeyboardEvent->>Popover: Triggers close action Popover->>Popover: setShown(false) Popover->>Dialog: Hides dialog content Note over Dialog: Dialog becomes hiddenFiles Changed