"hidden" props for button doesn't actually hide?

[cktang88]

I tried applying
<Button hidden={true}>hello</Button>
but it seems the button is still visible? I was under the assumption it would be hidden with that attribute set...

Using v0.3.1

[atanasster]

@cktang88 - I believe this is a bug and you can enter it as a new issue - <Button /> is forcing a display: 'inline-block', without checking for a hidden prop:

theme-ui/packages/components/src/Button.js

Line 13 in f45a5a8

display: 'inline-block',

In the meantime you can work around it using css or sx props:
<Button css={{ visibility: "hidden" }}>Click me</Button>