I have a react component that represents a document with text and some footnotes. The text should be rendered like this:
This the first footnote[1], this is the second[2].
Here is another [3].
As I'm rendering my component, I want to count up every time I see a footnote so that it's incremented. The tree can be many levels deep so you can't assume that all the footnotes are direct children of the main component.
This should also be dynamic, so that adding references updates the count.
I can't think of a very 'Reacty' way of doing this. Context (as frowned upon as it is) does not seem like the right thing, and otherwise, you have no information about neighboring components.