Allow Component State change while working inside component
(1) While editing a component, you can't change the state of the component unless you click on the parent layer first.
The State menu in the inspector panel disappears when you select anything other than the root layer. This makes it so you cannot change the state unless you have the root layer selected.
Instead, the State menu should be available while any layer inside the component is selected.
Let's say I'm making a button and changing the size of the shape layer. I want to match the Default state and Hover state, so with the shape layer selected I don't have the Component State menu available. I need to click on the root node of the component to get the State menu, then I can change the state, then I need to drill back down to the shape layer again.
It would be great if the State menu was ALWAYS available when working inside a component. For example while my button shape layer is selected, the State menu should STILL be available in the inspector panel so I can switch states without having to click out to the root layer first.
(2) It's a lot of clicks that gets very tedious. It's stupidly inefficient, especially since the layers panel and the State panel are on opposite sides of the screen.
+1 This is a simple QOL upgrade that would really help, especially since the component state and layer folders are on opposite sides of the screen.
Edu Couchez commented
Absolutely agree!! One of such bad usability design that make us lose hours of work and focus. To be constantly open the folder after every little click on the states is a waste of time, and a source of stress and frustration.
Mike L commented
**SEE ATTACHED VIDEO**
When browsing through the states of a component, the component closes and you can no longer see the folders and layers of the component.
When working out the states of a complex interaction, or revising the layers of an existing component, it would be really helpful if the folder structure of the component remained exposed while browsing through the component's states.
Forgot to mention one thing. It could get really complex when components are nested and you have to deal with a couple of combinations of states. Some navigation features would be really nice to have there.
I agree that there should be an easy way to tell the current state/component, and an easy and efficient way to switch between states. And whatever the solution should work for both design and prototype mode.
Michael Laugesen commented
when one has lots of States in component, then it's really frustrating, that the Component Group in Layer Panel just keeps closing, when I change the State. Would be really a great help if it is open all the time, unless I close it on my own...
Plus it would be also a great Help, if I select some element inside of a component group (like in the video at the end -> close icon) and in properties panel I would have the following info -> name of Master Component and in what State I am working now. Coz at some point I got really dizzy with my topbar and states it can have... I can imagine, I am not alone... :)