Situation:
I create a component to represent a live video chat head in a group chat app. I will use a static image for the prototype. The chat head will have several states, including hover, selected, muted, etc. I need to create 30 of these. After I built the component with all the states, I created a repeating grid of them so that I can drag my 30 photos into the components.

Problem 1:
The drag fails to propagate the photos to the other 29 instances in the grid... it only puts one photo into the drag targeted instance

Why this is important:
Because the expectation has been set that this is how repeat grids are supposed to work... there are several daily challenge videos showing how great this is. The fact that I'm putting it into a component vs a basic shape shouldn't matter.

Problem 2:
For the lucky instance that did receive the photo, it only got put it into the circle shape of the current state. The circle shape was named the same across all the states. It should have propagated to all the states in which it existed. Alternatively, I should have the ability to flag certain objects to simply be fixed across all states... maybe they have to be placed in the default state to be eligible for this ability to be flagged as constant across states.

Why this is important:
Because since the above repeat grid drag didn't work, I'm faced with having to drag a photo into each of 6 states for each of 30 components... that's 180 RSI inducing drag gestures. With this problem addressed, it's only 30.