I have a problem with a component that displays it's children prop. This is the minimal reproduction of the problem:
The OuterComponent appending a text to the InnerComponent's children, and when it displays, the appended text shows for a moment, then disappear.
I've tried some possible solutions, create a state from children, put it inside a ref (these are in the code commented), create and render a new children with React.cloneElement(children, ...) or with {...children}, all ot these do the same as the current code.
By the way, if you delete the text prop added to the InnerComponent, it works as expected.
The reason of this "appending" is this is a generated chart, and I did it based on this: https://observablehq.com/plot/getting-started#plot-in-react
I've run out of ideas, anyone can help?