react-spatial-navigation icon indicating copy to clipboard operation
react-spatial-navigation copied to clipboard

Overlapped elements are not focusable

Open JakubKubista opened this issue 5 years ago • 1 comments

Is your feature request related to a problem? Please describe. Consider for example 3 elements (rectangles next to each other in the row). The first overlaps a bit the second and the third is not overlapped by the second. If you press right from the first one, then you will appears on the third one instead of the second one.

Describe the solution you'd like Consider rectangle element. This element should includes some collision checker / condition, which checks if element is overlapping some element or is overlapped by the second element. Now we have possibilities how to detect where is the second element. Some examples:

  1. Find which side (bottom, top, right, left) is the closest one to the overlapping node.
  2. Find the closest node to the center of the first element where they overlapping.
  3. Split the first element to the 4 or 9 smaller parts with the same size. Check which size is mostly overlapped by the second element.

Describe alternatives you've considered If we don't won't to go with some overlapping solution we need to use some manual focusing techniques and that's not optimal.

JakubKubista avatar Dec 16 '19 09:12 JakubKubista

Linking with #83 and #97

asgvard avatar Jul 06 '21 12:07 asgvard