Trying to get styled-system working

[praneybehl]

Trying to get styled-system to work with solid-styled-system(goober) but it seem to be not working:
https://codesandbox.io/s/solid-goober-styled-system-emiq6?file=/index.js

Although, trying with emotion works:
https://codesandbox.io/s/solid-emotion-py2hy?file=/index.js

Any idea why?

[ryansolid]

Looks like Goober isn't serializing the object passed that way and just setting it to "object". I know it supports top-level object functions. I want to verify it with a different library with Goober like preact and they are in the process of winding up for 2.0.0 release. But I will look at opening up an issue on Goobers repo.

[ryansolid]

Ok confirmed this is functionality they do not have currently. While you can pass in object form top-level it currently isn't supported nested in templates. I've opened up an issue. cristianbote/goober#136

[cristianbote]

Hey there, pushed a new version 2.0.9 which now interpolates/compiles the objects inside the tagged templates as well. Hopefully this will get it going 👍 if not please let me know so I can address it.

[praneybehl]

Hi @cristianbote, thank you for the update.
@ryansolid can we please bump the goober version on the solid-styled-components package?

[ryansolid]

Sure no problem I can do that tonight.

[ryansolid]

So happy to close this one. v0.21.1. Enjoy.

Thanks @cristianbote.

[ayoubphy]

I still can't get styled-system to work, I cheked gobber#136 and I noticed something wierd in the workaround sandbox, the style properties are showing up as an attribute in the html element.

<div class="App"><div color="#fff" bg="tomato" class="go1565677261">Hello CodeSandbox</div><h2>Start editing to see some magic happen!</h2><div color="#fff" bg="tomato" class="go4094543492">Hello Workaround</div></div>