Skip to main content

Limit override options of nested components

  • December 9, 2021
  • 4 replies
  • 2339 views

matt23

We’re building an atomic design system. One thing that has come up multiple times that would be really nice to have is the ability to control the variants/overrides of nested components.

For example, we have a button component that uses variants and variant properties to control button size (sm, md, lg), button state, whether it has an icon or not, etc. To keep the system atomic we then nest that button component in other components, for example, a header component. But we want to limit the header component to only accept sm buttons and not md or lg while keeping other variant attribute overrides intact like state.

Could there be a similar locking mechanism like how locking a nested component will block any overrides at all, could we somehow lock specific attributes? for example lock the variant attribute for size.

This topic has been closed for replies.

tank666
  • December 9, 2021

A post was merged into an existing topic: Nested variant component override controls


Antoine
  • New Participant
  • December 15, 2021

Hi,

This has been requested already (for the component part).
I guess having something similar to Sketch would be a start.


Gleb
  • Power Member
  • December 15, 2021

A post was merged into an existing topic: Locking variants/overrides


Gleb
  • Power Member
  • December 15, 2021

I hope this time moving the topic wasn’t a mistake… @matt23 let me know what you think.

I also think this topic title is better, I wonder if we can improve the other topic title somehow?


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings