styled: multiple arguments not working(?)

[nksfrank]

I seem to have an issue with passing in multiple arguments to styled. From what I can tell by the types, it should be possible to do the following

const Component = styled('div')(
  {
    display: 'inline-flex',
    width: '100%',
    height: '100%',
    border: '1px solid #222'
  },
  (props) => props.hidden && ({ display: 'none' }),
  (props) => props.rounded && ({borderRadius: '.3em' })
  ({
    background: '#f2f2f2'
  })
)

but that doesn't actually call or apply the arguments past the first one. However, reading goober's manual they accept an array (https://github.com/cristianbote/goober#arrays) for using multiple arguments. passing in an array to styled works and all the styles are computed and applied as expected, but the types doesn't seem to like that.

minimal reproducible example https://codesandbox.io/s/friendly-payne-ehyjo

[ryansolid]

I see. Yeah I'd welcome any PRs to help with types. I was lifting Goober's types but the maintainer like myself is not the best at TS and sort of leaves it to the community. So they've been erratic and I eventually had to split off of theirs. But it sounds like we're missing stuff or have mismatched types at a minimum.

[nksfrank]

I can put up a PR for this. I'm just wondering if 1) we want it to work the way Goober expects it. Wrapping the arguments with an array. or 2) do we want it to work like the types, where there arguments are variadic. mimicking the @emotion & styled-components package.

First is just a quick types fix. Second one would be a change to how we pass arguments in to goober's css, I'm assuming

[100terres]

@ryansolid @nksfrank I've opened a PR to try to fix the type issue https://github.com/solidjs/solid-styled-components/pull/38