segmentio / evergreen

🌲 Evergreen React UI Framework by Segment
https://evergreen.segment.com
MIT License
12.39k stars 832 forks source link

Popover Themeing / Styling (+ Support for tailwind?) #1299

Open a-y-u-s-h opened 3 years ago

a-y-u-s-h commented 3 years ago

By default Popover component doesn't allow user to theme the card that it contains or pass any style props, It does however provide this statelessProps prop that allows us to override styles. It would make much more sense to just have ...props spread out in every component's forwarded ref and maybe have custom prop support for main nodes that components contain so that we can use className . Like I may want to style FilePicker's button and the name field with Tailwind, so the component if it had accepted buttonProps, inputProps - it would have made things much more easier.

<Popover
  statelessProps={{
    backgroundColor: "transparent",
    boxShadow: "none"
  }}

Produces something like this -

screenshot_20210812_063217

Without it, we get

screenshot_20210812_063252