What is the "React way" to handle dynamic node insertion at specific locations in the tree, the equivalent of insertAdjacentHtml?

Some context:

• Using a single root is required so components can share context, otherwise I'd assume you can use ReactDOM.render() and specify individual targets for each component placement.
• Components must be dynamically placed and rendered anywhere in the component tree. There are qualifying "dropzones" but these are configurable and must be able to exist anywhere on any component.
• A catalog of component functions is available globally.
• There must be a way to inject/drop/render a component adjacent to another component (i.e. must be the 3rd of 5 children to a parent, cannot render at the end or beginning).

Is this even possible in React?

https://stackoverflow.com/questions/66610036/what-is-the-react-way-to-handle-dynamic-node-insertion-at-specific-locations-i March 13, 2021 at 12:06PM