How to view nested instances within dev mode playground?


I’m loving the new updates so far but I wondered if someone could shed some light on a small problem I’m having regarding not being able to see nested properties for components within the dev mode playground.

I have a base component which use component properties that is then used to create multiple variants using different colour and stroke styles. I then expose the properties from the base component on the variant which works perfectly for what we need.

The issue comes when inspecting one of the variants in the dev mode playground. The only options I have are the ones that are tied to the variant and doesn’t show the component properties from the original base component.

Is this intentional functionality or have I completely missed something?

Thanks in advance!


Was also asking myself that question. It would be kind of crucial for us, since we are using a lot of nested instances to keep our components simple. If the dev team could also view it in playground and do some changes to try out different combinations, this would be brilliant!

1 Like

For me it’s not just in the Component Playground, not seeing the nested components’ properties in the Inspect panel is kind of a deal breaker. I need to ask devs to turn off Dev Mode to see all properties in one view.

Hopefully this is simple a case of “didn’t get to it yet” and it will be added soon :slight_smile:

1 Like

+1 here.

Loving the playground mode for the Engineers, however not surfacing nested instances is removing a very large and fundamental part of the required understanding needed for how the Designers have built a pattern for example. Especially if some of the pieces have booleans where their visibility is set to False by default.

For the Engineers, that means they have no idea that those piece even exists, because it’s not an option for them to be able to toggle on in the playground view.

The expected behavior would be:

  • All nested instances are surfaced and visible in the playground mode (i.e you see all of the appropriate toggles associated with their boolean settings, text properties etc.
  • Booleans are then also able to be switched on (if they are set to hidden to begin with).

This is hopefully the next logical upgrade for dev mode!

1 Like

+1 from here as well. This is definitely needed to make the playground a useful part of the handoff.


This topic was automatically closed after 30 days. New replies are no longer allowed.