Question: target selector persistence

[balazsbajorics]

If I add a nested selector (ie css={'&:hover': {...) and select another object, the inspector will keep working targeting that nested selector. Since the target selector is now at the bottom of the inspector, possibly below the window cutoff, it might lead to some serious confusion.

Question: do we like this behavior?

Proposed behavior: remember the target per selection, if selected something new, reset selection to Style. Alternative proposed behavior: remember the nested selector per selection, if I select something new, jump back to the "root" selector (ie from css/&:hover jump back to css)

[balazsbajorics]

this is a question mainly for @maltenuhn

[maltenuhn]

Good call. This also ties into the questions we've been getting about "do you support Tailwind" and "do you support Emotion / StyledComponents etc". Right now we're basically hiding our support for these.

Since they're probably mutually exclusive in most practical cases, and we support all of them already, I think a better design to bring this to the "top level" will help us here. The target selector persistence UX comes into this, and it's probably a small project to make this work well enough that it survives real usage.

I'll update the ticket accordingly, and explore / resurrect a couple of directions here.

[Rheeseyb]

The target selector has now been moved to the top of the Inspector, which does help somewhat here, but it's still way too easy to accidentally make a change to the wrong target when selecting a different element because of this. I'd highly suggest that we first remove that persistence (i.e. so that changing selection always reverts to targeting the style), and then we can experiment with different UX here.