@GreenSock is right. The main concern when dealing with any type of shadow dom library/framework is what's called DOM reconciliation (something @OSUblake has more knowledge than I am). Here's what React's official docs say about reconciliation:
But back on the specific question, yeah the issue is that GSAP doesn't have the slightest idea of what could make the resulting DOM to change and as Jack mentioned is a bad idea performance-wise, so GSAP takes care of it's own end and so does React (and Vue and other shadow dom libraries as well). They work in what's called a reactive way. Something changes that makes necessary a DOM update. The good news is that all those tools offer what's normally called lifecycle methods/hooks (do not confuse with the new hooks API introduced by React) which help you do stuff, before or after the DOM is going to change as a result of a state property being mutated. That's why in every piece of documentation is highly discouraged to reach and manipulate the DOM directly, hence the usage of references (refs).
The only thing you have to be careful about is that if an animation is running a somehow your DOM could change and remove the tween target, be sure to kill those animations in order to prevent an error being thrown. Here is where the lifecycle methods are handy because you can use them to create the animations once the DOM has been updated and you can be sure that the elements you want to animate are present and you wont get an error or unwanted behaviour, and that you will be able to act before those elements are removed.
Finally, I've check some things about React hooks but I haven't mix them with GSAP for two reasons. First, I haven't had enough time. Two, keep in mind that hooks are on the roadmap of version 17 of React, they are still a proposal and the React team is gathering information, bugs and opinions from the community as well as doing their own tests, so thechance that the API could have some major differences from what it is now is not small, so I try to stay away from using them in any type of production code. Also I don't like to invest a lot of time in things that are not even in beta or at least release candidate (RC version), because of changes in the future. But as you mention the effect hook is an easier way of triggering something because a state change. Hooks are very nice and a great addition to React and most devs I've shared some thoughts on them, are very in to hooks (they are hooked ), so they are here to stay most likely, but changes in their API will be inevitable moving toward a stable release. I'll see if I can whip something using hooks, but you caught me in a couple of bad days, so perhaps tomorrow night or Friday I could get into that. In the mean time feel free to continue the discussion here or if you want you can PM me.