feat: add FocusManager for keyboard navigation

[ReverseGem7]

focus-manager.mp4

[kommander]

What about having a tabIndex on Renderables to control what should be "tabable" and what not? Would then also work with custom Renderables.

[ReverseGem7]

Right now, a Renderable is considered tabbable if it has focusable: true and visible: true. If a custom Renderable has children (also Renderables) with these flags, they should be traversed by the focus manager too.

If we wanted to change this and allow Tab navigation inside a Renderable, we could add something like a toggleTabIndex function on the RenderContext to override the current behavior. We could also consider adding a separate tabbable property to Renderables instead of using focusable.

What’s your opinion?

[kommander]

I am a bit concerned about tree traversal for finding tabables, as that might also traverse long lists with potentially thousands of nodes and block the process. I would make that a built-in collector, on the RenderContext add methods to collect the focusable when it is added to the tree and remove it from the list when removed from the tree. Then it's just fast iteration on a small list, compared to tree traversal.

[ReverseGem7]

something like creating a secondary tree?

[kommander]

Just a list of Renderables, sorted by tabIndex. Doesn't matter where in the tree they are then, can still check if visible or not and take the next/prev available visible renderable to focus.

[simonklee]

Closing as out of date. Please re-open/ping me if you want to continue working on this.