Update styled-components in / from 2.4.0 to 3.0.1

[dependencies]

Dependencies.io has updated styled-components (a npm dependency in /) from "2.4.0" to "3.0.1".

3.0.1

This major release prepares some great features that are yet to come, so be ready for some new and exciting features soon! But for now please read on for what’s in the current (majorly awesome) release. 🔥

Breaking Changes

Shipping only flat bundles

Thanks to Andarist we're now shipping flat bundles for each of our entries only. This means that the entire lib/ folder won’t be inside our npm package.
While this might break a couple of third party libraries, it stands to reason that our internals should not have been exposed in this way before.

This new way of bundling not only makes it easier for us to perform some refactors quite soon, it also makes it easier for us to optimise our releases even more. Please check your codebases and libraries for usages of our internals and make sure not to rely on them. Open an issue please if you need help to migrate to v3.

There are bundles for Web, React Native, and React Primitives. The former two come with both ES Modules and CommonJS bundles. The Web bundle also comes with a minified bundle. We’re also now shipping source maps for each of these bundles.

Added styled.SafeAreaView and removed styled.Navigator for React Native

We’ve added the missing SafeAreaView shortcut to the native bundle, and removed the deprecated Navigator. Finally! The typings for TypeScript have been updated as well to reflect this breaking change. (see #1339)

Added

isStyledComponent utility

Because we’re now shipping flat bundles we also wanted to provide a frequently requested utility function that determines whether a given component is a StyledComponent. This utility returns a boolean telling you just that. (see #1418)

It should make it easier to determine whether to pass on innerRef or ref for instance in some cases, and should allow you to avoid accessing some of our internals or to check whether a component has styledComponentId set.

More information on this utility can be found on our website’s API reference section.

Improved React Native Importing

From time to time, it’s easy to forget to import styled-components/native instead on React Native. So now it’s possible to import just styled-components on React Native as well and Metro Bundler will automatically switch to the native bundle. This release also deprecates the old styled-components/native import, so make sure to migrate.

We also now log a warning when the web-version of styled-components is accidentally imported in React Native, so you can be sure that the right bundle is always being used. (see #1391 and #1394)

Deprecations

• As stated above, importing from styled-components/native is deprecated. Please switch to just styled-components.

Fixes

• innerRef could be undefined when using withTheme, which can lead to unexpected behaviour when spreading props or passing it on. (see #1414)
• Nested themes were not being republished correctly when the outer theme changes (see #1382)

Chores

• Add ESLint precommit hook, thanks to lukebelliveau (see #1393)
• Remove trailing commas on function arguments (not compatible with ES5 JS engines)
• Upgrade test suites to run against react v16 (see #1426)
• Ship source maps for all bundles to make debugging easier (see #1425)

Thanks

Thanks to the numerous contributors and maintainers who have worked towards this release. We're sorry if some names are missing, so thanks additionally goes out to everyone who’s worked hard to get v3 out!

• Andarist
• lukebelliveau
• BenLorantfy
• tazsingh
• gribnoysup
• probablyup — Our new core contributor

(In no particular order)

3.1.0

See the release blogpost for more details!

Added

Streaming server-side rendering support

React 16 introduced ReactDOMServer.renderToNodeStream, thanks to probablyup styled-components now has full streaming server-side rendering support so you can take advantage of the faster Time-To-First-Byte! 🎉

See the documentation on the website for more information.

Much faster CSS injection in production

Thanks to schwers we now use insertRule in production, which makes for much faster CSS injection. In benchmarks this change makes styled-components mount ~10x faster and re-render ~20x faster! 🎉

Note: Your app will probably not mount 10x faster, but we've seen Time-To-First-Interactive drop by a couple hundred milliseconds in production apps with this change!

3.1.5

A quick bugfix release:

1. Apply a workaround to re-enable "speedy" mode for IE/Edge (see #1468)
2. Fix a memory leak in the server-side streaming logic (see #1475)

3.1.2

No content found. Please open an issue at https://github.com/dependencies-io/support if you think this content could have been found.

3.1.3

No content found. Please open an issue at https://github.com/dependencies-io/support if you think this content could have been found.

3.1.1

Hotfix ReactNative support, which was broken in v3.1.0.

3.0.2

No content found. Please open an issue at https://github.com/dependencies-io/support if you think this content could have been found.

3.1.4

Hotfix: disable speedy mode for microsoft browsers to mitigate an issue with our usage of the insertRule() API. We are investigating to get it enabled again in the near future.