I have a row of divs that are mapped to my state and clicking on one sets that list to just the one you clicked on. This is working but I want to be able to animate it so that it nicely goes from 8+ orange boxes down to just the one you clicked. Here is the component for reference, any ideas or direction on animating a state change?

once the inProp prop is true, the Transition component will activate and begin fading in to view courtesy of the transitionStyles variable (where opacity is defined) that correspond to the various “enter” or “exit” stages I outlined earlier.

It’s worth noting this is a platform-agnostic base component — if you’re looking for CSS transitions (like I was for my use case), you’ll probably want the echatspin CSSTransition component instead.