Expose/hide nested instances -> at component property level

+1 this is really needed also for us, exposing all the properties for some complex component is not useful, but being able to select which one to expose would solve our isse!

image
Here is a Select input component I am working on. The label is a separated component with different states and content property for the text.

I want the parent component to show the “label content” whereas I don’t want user to be able to change the state of the label.

I think we can have a convention where the “_” or “.” in front of the property can make it “local” to the component and not propagate up to the parent components.

Thanks

5 Likes

Might need a little more context on how you have everything structured but you should be able to specify which nested component props show up on the parent component.

I want to show specific properties from an instance, with this I can only show ALL properties from an instance, or none.

4 Likes

+1 Yes please!!

+1 No need to explain why we need this. Great idea.

+1 for us too

We are looking for this https://forum.figma.com/t/hide-specific-properties-from-the-nested-instances-on-variant-property/42811
or
https://forum.figma.com/t/hide-component-properties/33661/7

2 Likes

+1… please 🫶🏼

+1 pleaaase :pray:

Come here for the same issue. At the moment this lack prevents us to use the feature at all in our design system. We don’t want consumers to override all the properties (introducing confusion and inconsistencies) of predefined components coming from the shared library.

PS: Don’t forget to vote the thread

1 Like

Would love the option to hide component props from consumers. For instance:

Component A

  • Nested component B
  • Nested component C

Component A is made up of two nested components, B and C. Components B and C have properties that are adjusted to provide variants of Component A. They’re really just for my use.

But if a designer “clicks in” to Component B, for instance, they can see its props, in the right sidebar (which I’ve used primarily to make those Component A variants). I don’t want them to touch the props for that nested Component B. I’d like to hide them.

I heard rumors that this might be an upcoming feature. Is this true? :thinking:

3 Likes

Would also be highly interested in this. Would make things much easier for the consumers of our enterprise Design System.

1 Like

I’m very interested by this feature !! For instances hide hover state of a button.

1 Like

Hi all,
Thank you for your feedback! I switched this topic to a “Feature request”, so you can vote and we can accurately gauge interest from the community!

6 Likes

This is very useful when using nested instances and I would love to have this feature as well.

2 Likes

Bumping! This would really elevate design systems

3 Likes

I am using an instance of a component inside another component variant. I have added the variants property through the nested component features (which is btw awesome and attached a screenshot).

Currently, it imports all the properties from the nested component inside the component. I wonder if there will be a way to hide some properties. For instance more granular check box with every property of the nested instance (Screenshot 2) or renaming the property name with an underscore to hide the property when nested just the same logic on how we hide components from the library. (Screenshot 3) the properties beginning with the underscore _Platform or _Size could be hidden.

Very small fix but it is very powerful to exclude overrides that are unnecessary for certain properties.

image

5 Likes

Yes please, this feature is required.

3 Likes

Yess please. Im working with Interactive components and this feature would be very useful for my design system. I have different size variants of a spinning loader with their own prop Small, Medium, Large. Ive added the loop animation steps for each variant however they require a prop else I get the conflicting error thing. I dont want to give it a prop so hiding component props would fix this.

3 Likes