proof of concept for a module-scoped navigator instance

[bluefirepatrick]

In useEpubNavigator the EpubNavigator object is stored in local scope which means that each component using the hook would see a new instance of this object and could not 'share navigation' with one Navigator:
const nav = useRef<EpubNavigator | null>(null);

There are many ways to potentially lift the scope of this value so that every component could use the same navigator (including using redux, etc.) but it seems like simply lifting the navigator object from local to module scope is exactly what we need. This is done by declaring the var for the EpubNavigator object outside of the hook definition. When a hook is imported into a file, its top-level variables are shared across all files importing the module and JavaScript ensures that the module is loaded only once, thereby creating a singleton pattern for the navigator object. EpubNavigatorLoad is still allowed to create new instances of the object which would not cause a component re-render.

This pull request shows an example of this idea, using the existing TOC Listbox to show a shared Navigator by importing goLink from EpubNavigator to jump to toc locations, to spark discussions.

[JayPanoz]

As discussed during yesterday’s call, this sounds good to anyone involved in the project.

I think I will merge this immediately following the merge of the Sheets branch (#51) + the toc tree Component (#37) so that the ToC can actually be usable as well., and it’s no concern for the Navigator’s custom hook that is bound to evolve dramatically with the implementation of the Preferences API in the ts-toolkit.

Thanks a lot for taking the time to open this PR. 🙏