Ok; ignore that specific example -- if you needed to share a piece of state among many components in different places in your component tree, how would you do it?

I have 3 tiers of components.

Root - Page/Screen - UI Elements

The Root takes care of authorization and navigation logic, to switch between pages.

A Page has all the logic needed for one page it holds all the state and passes it down via props.

A UI Element displays the state it got via props and sends up its events via handler function (it also gets them via props)

In 90% if cases this was enough.

Sometimes, I needed to pass some state from the Page up to the Root and from there down to another Page after navigation, but that was it.

Got it. If you don't have any data that's shared between pages, I can see how this works.