How to render components from json with inter-component messaging?

I have a JSON structure that I render. I need to create messaging functionality between them.

e.g: once a user clicks MyButton (btn1), the value of MyInput (in1) must be present inside MyLabel (lbl1)

here is the codesandbox that rendered the json without data passing: https://codesandbox.io/s/loving-brahmagupta-sdn24m?file=/src/components/MyTabs.tsx

Here is the codesandbox that includes the data passing, but for some reason it re-renders infinitely: https://codesandbox.io/s/fragrant-tdd-b9xbdw?file=/src/components/MyInput.tsx

why does it happen??

thanks