Creating an "group index provider" context
For context
I am developing a group component which places its children in a flex manner.
I want any child of the group (as well as nested ones) be able to access its previous and next sibling sizes in the group, but that seems impossible to do without wrapping each direct child of the group with a context provider.
Also the whole system must be reactive. That is, the children list may get changed or reordered, and the contexts must change accordingly and propagate the updates into the nested children as well.
Explanation
Each child can be any JSX or HTML element, but nested in that child may be a context consumer, which wants to access the index of the direct child of the group widget. So basically there is a context access which may be nested deeply in any of the group's children.
What I tried
The solution I tried was to wrap each child with its own context provider, and pass the index of that child to the provider. But it didn't work because mapping over children requires using the
childrenI tried using
runWithOwner
