I’m having trouble selecting the parent/top-level symbol instance when it’s inside a Stack.
Example: I have a symbol instance (e.g. “Input field”) inside a Stack.
A normal click selects the Stack (expected).
If I double-click to select the symbol, Sketch often ends up selecting a nested layer / nested symbol inside the instance.
I can use Ctrl-click to target “loose” elements, but in this case it selects only the specific inner layer I clicked, not the whole symbol instance.
Then I have to press Esc multiple times to “climb back up” until I reach the correct level (the top-level instance), and it’s hard to know when I’m already at the right level.
Is there any shortcut / command to directly select the whole symbol instance (top level), without stepping through nested levels one by one?
Could you share your layer setup? I just tried this:
Frame
-- Stack
---- Button (Component with Text)
---- Button (Component with Text)
And when hovering the Button I want to select (and not any nested layer) I can quickly double-click and the Mac app selects the Symbol (and not any nested element/layer).
I don’t have any special options, and at the beginning of the video I’m not using any modifier keys to select specific layers/elements within the nested Components. Later in the video I’m using ⌘ Command to select a nested Text element within the Component.
I’m wondering if your setup has something specific to it that might make this interaction not behave like this
In this case it’s not about nested layers, but about symbols.
Each of the red dots is a different symbol, and all of them together build the main component (the input field). However, when I Ctrl-click trying to select the whole input field component (which lives inside a Stack), Sketch ends up selecting one of the inner symbols instead, for example the amount text or the “MAX” button, instead of selecting the entire input field.
Double click does work as expected, but only one level at a time. In a complex setup with multiple nested Stacks, this means I need to double click many times until I reach the actual parent component (one double click per Stack level), which becomes quite tedious.
A possible improvement or solution could be adding a modifier key (or a selection mode) that lets you select parent elements while ignoring Stack levels, so you can jump directly to the component instead of stepping through each Stack.
Double-click (while selected): Selects any Stack or top level element.
Double-Click + subsequent single clicks: They act as a Double click in which you can keep drilling down the hierarchy without having to double-click every single time.
A couple shortcuts you can use, when you’re deep deep into the Symbol/Layer list hierarchy:
⎋ Esc Selects the parent frame/Component for the current selection. So if you have a text layer selected within an Instance, it will select that Instance.
⇧ Shift + ⎋ Esc This selects the root-level Symbol. This would select the Input field (if it is a Component).
⌃ Control + ⎋ Esc This will clear the selection completely.
I’ll share my attempt to recreate your setup and have you take a look at it. Have you tried the Double-click (once) + single click interaction to go deep into the hierarchy?
Btw, with my responses I’m not trying to discredit or disregard your request for a modifier to do this action, I’m very much for it. I just want to get all the context possible so we can share this with the team with a great use-case and having tried/shared all things before.