Safe triangle / delay before closing submenu
Nobody has claimed this yet.
Assessment
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Newbie friendliness
- 45/100
- Issue type
- Feature
- Clarity
- Mostly clear
- Activity status
- Stale
- Tech stack
- react, typescript
- Domain
- frontend
Research direction
Start with the built-in example and reproduce the diagonal movement from “Submenu” to “Submenu Item 4”; read the linked background article on context-menu safe triangles. The work is done when moving toward the submenu no longer focuses the element below and closes it prematurely, while the submenu still closes appropriately when the pointer leaves it.
Written by the indexing model from the issue text.
Description
Do you want to request a feature or report a bug?
A feature
What is the current behavior?
When a submenu is opened it's at times hard to reach it since we need to go sideways with the cursor to avoid focusing the element below, which closes it.
This is easily demonstrated with the example code that ships with the project. Try going from "Submenu" to "Submenu Item 4" by doing a diagonal mouse movement.
See some background information here: https://height.app/blog/guide-to-build-context-menus
If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem. Your bug will get fixed much faster if we can run your code and it doesn't have dependencies other than React. Paste the link to your CodeSandbox (https://codesandbox.io/s/new) example below:
Use built in example in project.
What is the expected behavior?
The submenu have a delay before closing
Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?
Not applicable.
- Dominant language
- TypeScript
- Stars
- 1.2k
- Forks
- 133
- PR merge metrics
- No merged PRs in 30d
Getting set up
- No Dockerfile or Docker Compose file
- Has a pull request template
- Read the contributing guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from fkhadra/react-contexify
-
Difficulty 2/5 1-3 hours Newbie friendliness 45/100
fkhadra/react-contexify#275 ·
-
Difficulty 3/5 1-2 days Newbie friendliness 38/100
fkhadra/react-contexify#269 ·
-
Difficulty 4/5 3-5 days Newbie friendliness 35/100
fkhadra/react-contexify#268 · 1 reaction ·
-
Difficulty 4/5 3-5 days Newbie friendliness 25/100
fkhadra/react-contexify#265 · 2 comments ·
-
Difficulty 3/5 1-2 days Newbie friendliness 38/100
fkhadra/react-contexify#264 · 1 comment ·
All issues in fkhadra/react-contexify
Similar issues
-
Difficulty 2/5 1-3 hours Newbie friendliness 62/100
one-zero-eight/apply-bot#39 ·
-
Difficulty 2/5 1-3 hours Newbie friendliness 72/100
bigbluebutton/bbb-ui-components-react#108 ·
Maintainers usually reply within 2 days
-
Difficulty 2/5 1-3 hours Newbie friendliness 82/100
Maintainers usually reply within 1 day
-
Difficulty 2/5 1-3 hours Newbie friendliness 70/100
Maintainers usually reply within 1 day
-
high priority
Difficulty 2/5 1-3 hours Newbie friendliness 62/100
CI-CMG/deep-sea-corals-exb#84 · 1 comment ·