[Feature]: Navigate up the DOM parent hierarchy with '\' during preview element selection / annotation

[nathnael-desta]

Summary

In Figma, when an element/node is selected, pressing \ moves the selection up one level in the parent chain hierarchy. Bringing this shortcut to T3 Code's browser preview annotation tool would make selecting parent components and layout wrappers vastly easier and faster.

The Problem

When using the T3 preview element inspector / annotation tool, clicking on UI elements frequently targets innermost leaf elements (such as <path>, <span>, or inline text elements) rather than the logical parent component (e.g. <button>, <Card>, <nav>, or <section>) that the user intended to annotate. It can be tricky or tedious to click the exact border or padding of a container to select the parent rather than its children.

Proposed Solution

Adopt Figma-style parent traversal in the preview annotation mode:

• When an element is selected or focused in annotation/inspect mode, pressing \ (and/or Shift + Enter) moves selection up to the immediate parent element (node.parentElement).
• The preview bounding-box highlight dynamically expands to outline the newly selected parent container.
• (Optional bonus): Display a subtle breadcrumb trail of ancestor elements (body > div#app > main > section.card) allowing one-click selection of any ancestor.

Benefits

• Speed & Ergonomics: Eliminates the frustration of trying to click tiny margins or empty padding to target container components.
• Muscle Memory: Intuitive and familiar for developers and designers accustomed to Figma or browser devtools DOM tree navigation.

[juliusmarminge]

Note

Grok responding on behalf of Julius.

This looks like a double post of #18626, which has the same proposal. Closing this one so the conversation stays in one place; please add any follow-ups there.