New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
chore(deps): update dependency styled-components to v3.2.1 - autoclosed #548
Conversation
Deploy preview for mcslite failed. Built with commit f303fb1 https://app.netlify.com/sites/mcslite/deploys/5aa21b6aa6188f3a0b6f7138 |
Deploy preview for mcs-lite-ui ready! Built with commit f303fb1 |
Deploy preview for mcs-lite-introduction ready! Built with commit f303fb1 https://deploy-preview-548--mcs-lite-introduction.netlify.com |
Generated by 🚫 dangerJS |
Codecov Report
@@ Coverage Diff @@
## master #548 +/- ##
==========================================
+ Coverage 84.4% 84.59% +0.19%
==========================================
Files 319 317 -2
Lines 2648 2642 -6
Branches 169 167 -2
==========================================
Hits 2235 2235
+ Misses 352 348 -4
+ Partials 61 59 -2
Continue to review full report at Codecov.
|
d122d43
to
c0c577d
Compare
3966d94
to
65bed6f
Compare
0a9a4d6
to
290aa07
Compare
eb8e027
to
b18dc57
Compare
b18dc57
to
1b1155b
Compare
cc26ec9
to
cd692c3
Compare
cd692c3
to
f303fb1
Compare
This Pull Request updates dependency styled-components from
v3.1.4
tov3.2.1
Release Notes
v3.1.5
A quick bugfix release:
v3.1.6
Bugfix for the last style tag sometimes being emitted multiple times during streaming (see #1479)
Bugfix for speedy mode rehydration and added handling for out-of-order style injection (see #1482)
NOTE: When calling
consolidateStreamedStyles()
after streaming, make sure it is called as early in the bundle as possible.styled-components injects new CSS upon construction of new components not prerender, so consolidation must happen before any new CSS is injected on the page.
v3.2.0
This is a small minor release that introduces a couple of minor changes, but also a complete rewrite of our StyleSheet implementation. Not only is it smaller, but it also lowers the barrier to entry for new contributors (like yourself, dear reader, hopefully!) to read and understand it, and eventually contribute great new features!
Deprecations
Stream reconciliation function
consolidateStreamedStyles
If you’ve recently migrated to streamed server-side-rendered styles, then you will be familiar with our
consolidateStreamedStyles
function, which was an “extended rehydration” that moved all streamed styled-components style tags when called.Due to our refactor of our StyleSheet behaviour (see below), our new rehydration implementation now takes care of this for you automatically.
This function will now output a deprecation warning when it’s being used and effectively does nothing at all. (Take a look at its source for more information)
Refactors
Rewrite and refactor
StyleSheet
andServerStyleSheet
We now handle the style rules around a “style tag” based approach, which also means that our
BrowserStyleSheet
is a thing of the past. Depending on the environment, we will now switch between server, browser, and insertRule style tags, which all abstract their internal behaviour.The concept of “local” vs “global” styles has been removed, in anticipation of some upcoming, future APIs, and our rehydration has been rewritten as well. You will see only a single style tag after rehydration, and now splits between style tags when injecting global styles as well. This is not a breaking change, but produces the same behaviour and specificity as it did before. (Change)
You will also notice a couple of improved and more detailed error messages—if you ever run into them that is—which will help you to understand some things that might go wrong more easily. (Change)
Style tags will now also be injected consecutively in the DOM. This means that styled-components won’t append them to the target, but will append them to its last style tag, if a first one was already injected. This should help you to predict the order of injection, when dealing with external CSS. (Change)
Misc.
Added
StyleSheetManager target prop
You can now pass an element to a
StyleSheetManager
and all the components in its context below in the tree will add their styles to new tags in the specified target.While this is not guaranteed to work with SSR yet, it can help you to easily add runtime-styles to a different part of the DOM. For example the shadow DOM.
Multiple instance of styled-components warning
Starting from this version, style-components will log a warning when multiple instances of it are being bundled and run on the same page. Due to our rehydration this can lead to errors, where one instance of styled-components will interfere with the other. This is why we have decided to add a small warning notifying you of this, since we don’t see the practice of adding multiple styled-components instances to a single page as a best practice.
Please note that this warning won’t show up, when older version of styled-components are present, as they don’t contain the code necessary to be detected.
StyleSheet.remove
API (Internal)This is an internal API that allows us to remove rules and components from our StyleSheets, which will come in handy for some new APIs for global styles quite soon.
Misc.
controlsList
to validAttr list (see #1537)foreignObject
svg element (see #1544)Fixes
Enable semicolon autocompletion in styles
We accidentally disabled semicolon autocompletion in stylis, which accidentally introduced an unnoticed breaking change in a past version a while back.
Semicolon autocompletion is now enabled and back again. Thanks to [@Blasz] for reporting this mistake!
Nested media queries in
insertRule
aka production modeOur version of stylis-rule-sheet was updated which fixes nested media queries which can now be used as is expected in production. (see #1529 and #1528)
Misc.
type="text/css"
-attribute from style tag to remove warnings from w3c validator (see #1551)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!
(In no particular order)
v3.2.1
Fixes
Incorrect SSR React Element output
We accidentally removed
dangerouslySetInnerHtml
in our SSR output with just some children string. This would cause some characters to be encoded.We have corrected this mistake and more unit tests are now in place to prevent this from happening again. Thanks to [@misund] for reporting this mistake!
Support out-of-order injection for
@import
at-rules@import
rules must appear at the top of style sheets (i.e tags).In older versions we used to shard our style tags into local and global ones. Because any CSS that is being passed to us is also reordered, so that
@import
rules appear at the top, often this would mean that a loneinjectGlobal
would get away with@import
rules.This wasn't sufficient as using
@import
in a component (obviously unsupported and not recommended) or in another consecutiveinjectGlobal
would cause this logic to break, since@import
wouldn't appear at the top of the stylesheet anymore.This oversight was made worse by the fact that we stopped sharding local and global style tags. This would mean that
@import
could now show up fairly late in a stylesheet, instead of at its top.In this version we introduce a patch that creates an additional style tag at the top of all other ones that we create, when necessary, which is going to accept all
@import
rules separately. So when you useinjectGlobal
and pass it an@import
rule, it will now be stripped out of the rest of your CSS, and put into a completely isolated style tag.Commits
v3.2.0
aaee314
v3.2.0-1980bfc1
Fix ServerTag#removeRules not emptying marker correctlyb9e8a1f
Merge pull request #1514 from styled-components/feature/delete-rule-methods2475d6b
Add failing test for nested media queriesd2552a9
Upgrade stylis and stylis-rule-sheet48978ff
Fix styles.test fixtures after stylis upgradea2bd0a8
Add CHANGELOG entry481b311
Merge pull request #1529 from styled-components/fix/nested-media3622a82
Enable stylis' no-semicolon mode61b7764
Add CHANGELOG entry0fb244f
Merge pull request #1532 from styled-components/fix/no-semicolon-mode591817c
feat(validAttr): add controlsList to validAttr list9a91bde
Merge pull request #1537 from marhalpert/controlsList-validAttr6af22b2
feat(svg): add missing foreignObject element6377d7b
Merge pull request #1544 from jdrouet/masterc5378d5
removed type="text/css" logic from StyleTagsb32994e
updated Snapshots 📸8634cab
adjusted CHANGELOG.mdf9801b0
upgrade jest-styled-components3fb3e79
Merge pull request #1552 from MicheleBertoli/jest-styled-components2756541
reset changelog.md8306cea
readded entry to CHANGELOG.md72882ab
successful run of project in windowsef22242
lock files added247a5fe
Merge pull request #1551 from mdugue/fix-w3-validation-warning-type-style38c6e9a
removed npm lock files and changed npm to yarn727d5c8
added yarn-error.log to gitignore20614d6
deleted yarn-error.log file9cf0fe6
Merge pull request #1553 from Kirty-Goyal/windows9fce3bf
Expose secretInternals in all environments & bundles825257d
Merge pull request #1569 from styled-components/chore/expose-secrets191489b
Update CHANGELOG.md (v3.2.0)v3.2.1
eb85ea1
Merge pull request #1577 from styled-components/hotfix/shard-for-importThis PR has been generated by Renovate Bot.