Allow to set a style-src CSP without unsafe-inline #8338
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Closes #8043, #7600
📝 Description
This PR allows to set a style-src CSP without unsafe-inline
⛳️ Current behavior (updates)
Chakra currently uses both the style attribute on HTML elements and an injected style element. Both require unsafe-inline style-src.
🚀 New behavior
flex={1}
instead ofstyle={{ flex: 1 }}
.__css
instead ofstyle
where an style object is used.nonce
to the ColorModeProvider where the style element is injected.💣 Is this a breaking change:
No
📝 Additional Information
I was unable to test the behaviour locally, because I had issues linking to the local directory from my package.json. I haven't tested all changes myself, so please take a good look.
Also, there are some places where a style attribute is set on
motion.div
. I was not sure how to handle this, so I haven't fixed those issues.