bamlab / react-tv-space-navigation

A React Native module to handle spatial navigation for a TV application in a 100% cross-platform way
https://bamlab.github.io/react-tv-space-navigation/
MIT License
178 stars 15 forks source link

There should be a way for a leaf node to tell if it's SpatialNavigationRoot element has focus #105

Closed jonp-iversoft closed 2 months ago

jonp-iversoft commented 3 months ago

Is your feature request related to a problem? Please describe. When using Multiple SpatialNavigationRoot elements, there are multiple isFocused leaf nodes making a leaf node display itself as focused difficult.

Describe the solution you'd like I understand that each SpatialNavigationRoot does actually have a focused item local to itself, but the naming is confusing. There should be a way for a leaf of a SpatialNavigationRoot to see if it's parent SpatialNavigationRoot has focus

Describe alternatives you've considered We currently have separate SpatialNavigationRoot items for the menu, the content, and flyouts. We currently are using a menuContext to see if the menu SpatialNavigationRoot has focus or not. There should be a way for a button to tell if it's parent SpatialNavigationRoot has focus without importing a context from the menu.

pierpo commented 3 months ago

Hey!

That's an interesting point. We have a similar need, so we implemented a little context ourselves. I was wondering if it should be included in the lib itself.

What would you expect as an API? 😁

jonp-iversoft commented 3 months ago

Since there are already isActive and isFocused props being passed from a focusable SpatialNavigationNode maybe a isRootFocused could be added along?

pierpo commented 3 months ago

Would isRootActive be as clear? The root is not really focused (in LRUD we talk about focused for leaf nodes only if I'm correct 😁)

jonp-iversoft commented 3 months ago

yeah that works!

pierpo commented 2 months ago

Hey @jonp-iversoft ! I just opened a PR to solve your issue. I'm leaving for holidays, and I didn't want to leave you hanging.

If you want to try it out without a new release: you can clone the repo, build the lib using cd packages/lib && yarn build, copy the dist result in yourproject/node_modules/react-tv-space-navigation, and use patch-package react-tv-space-navigation to generate a patch out of it 😁 (well that's how I do it)

I tried it out a little bit, it seems to work fine 🙌 I'll try it more when I'll come back and publish it then.

pierpo commented 2 months ago

Published in 3.6.0 😊

jonp-iversoft commented 2 months ago

You're the 🐐