seek-oss / braid-design-system

Themeable design system for the SEEK Group

Home Page:https://seek-oss.github.io/braid-design-system

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Hidden component disrupts spacing of Stack when hidden

possibilities opened this issue · comments

This is not intended as a bug report, just a continuing my line of questions while I try to educate myself on the library and theories behind it. Thanks in advance for your patience!

A hidden component creates some space in a stack unexpectedly. Is this a scenario you want to support or it doesn't really come up in the real world?

https://seek-oss.github.io/braid-design-system/playroom/#?code=N4Igxg9gJgpiBcIA8BlALgQzAawAQGcAHLGAXgB0QBzAVzTRgCdKA+cgO11yQAUAbEgAsIfWI1yCYASyqC0pYABYADAF9cAejadu-ISLETps+UrWbtXJAAkpUWJwBGMPhADuFEAA8+rAGYQEEgatvYw7Ja6AmAwwqJMRjJyCirqWhzB6FjY2iAANCBokgC2MPgIANog+DAw2ACC7ABeIAC6BW52ReXwFQDMAEzKrapAA

I realize now you probably just don't use it in that combination.

I actually was wondering the same thing, often for form reasons I need hidden text fields. But when wrapped in a Stack they still create white space. I think it's still a valid question, I had actually bugged Mark couple a weeks ago to put the thought into his brain. Making an issue like this would have been a better idea, however.

As someone "blessed to be building a lot of forms" I think I landed here for the same reason (: Maybe you can use a Box instead of Hidden for this use case? E.g. along the lines of <Box display={isHidden ? 'none' : 'block'}><Box>

Hah, same, nevermind!