Upgrade to `styled-components` v4

[joshwcomeau]

styled-components v4 was just announced, and it looks really good:

• 25% faster on mount
• really good new APIs like the new global styles, and as
• ref support
• faster styled()
• a bunch more

It's still in beta, but I think we should try upgrading. It seems like it'd be a huge improvement.

Some things that will need to be updated:

• We use injectGlobal in a few places, needs to switch to the new global API
• use ref instead of innerRef in a few places
• use styled() instead of .extend
• For the Heading component, we can use the new as prop, instead of withComponent

This would be a great first issue for new contributors :) would give you a tour of the React codebase, without being too hairy.

[rfbotto]

Hey @joshwcomeau this seems like a good issue for me to get around the main react codebase of guppy and also experiment with the v4 of styled-components :D. If possible i would like to try and tackle this one :)

[superhawk610]

All yours, @rfbotto!

[joshwcomeau]

Sounds good @rfbotto!

[joshwcomeau]

Hi @rfbotto,

Just a quick check-in to see how this is going. No rush at all :) just making sure you're still interested / aren't stuck on something

[rfbotto]

Hey @joshwcomeau!

Yes, i'm still very interested! :) Was planning to start after requesting the issue but ended up not having a lot of opportunities these last few weeks. Will start to tackle in the next few days, if that's okay :) And sorry for the delay on the issue situation, next time will keep you posted through Gitter, so you know if something is up.

[joshwcomeau]

Hi @rfbotto,

Perfect! Yeah, this isn't urgent :) no problem at all on the delay.

I think if you don't finish it in the next couple weeks it'd be worth just giving us a status update, here or on Gitter, but zero pressure for anything else :D