Overflow components

Ask the community
1

I need help in building components like in this example from Carbon Design System UI Kit:

image
image2880×1628 228 KB

Meaning that part of the component is clickable and its dropdown is “unselected”. I know I can “trim” a component by changing its size while holding command button but it is not that, as you can see in the screen that this square button has “hug” properties.

2

Hi there,

Thanks for the post. Just to clarify, would you like to have two states of the button? If that’s the case, I think you can utilize Variants in Components.

Variants allow you to group and organize similar components into a single container. You can learn more:

Regarding Hug contents, when you set Hug, the frame will keep the smallest possible dimensions to surround the objects within it, while respecting the padding value:

I’m not 100% sure what you’d like to achieve, so please feel free to let me know, if I may be misunderstanding the points!

Thanks,
Toku