Structure Panel

Overview

The Structure Panel is a panel that shows every component in your Dynamic Component as a nested list. Components are organized by their parent-child relationships, making it easy to see which components are inside containers, sections, or other parent components.

Why use it?

When you're building complex layouts with multiple nested components, your canvas can get crowded and hard to navigate. The Structure Panel gives you a clear bird's-eye view of your entire structure. You can quickly find and select any component—even ones that are buried deep inside containers or hidden behind other elements.


How to Use It

Finding components: Click on any component name in the tree to select it on the canvas. This is especially useful when you can't easily click on a component directly because it's small, overlapping with others, or nested inside something else.

Understanding structure: The indentation in the tree shows you the nesting levels. Parent components appear on the left, and their children are indented underneath. This helps you understand how your layout is organized and where each component sits in the hierarchy.

Reorganizing your layout: Use the tree to identify where components are placed and decide if you need to move them.


When It's Most Helpful

  • You have multiple nested containers or sections

  • Your layout includes many components and it's hard to click the right one

  • You're trying to understand how someone else structured a component

  • You need to find a specific component quickly without hunting through the canvas

Last updated

Was this helpful?