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.
We'd mentioned this in #2275 & #832 as part of simplifying our API, as it can lead to confusing CSS ordering & overrides: if I have the same property in a style prop & sx, which wins out? It's especially unclear from a component that's wrapping a Theme UI component. This is a big, breaking change, so it should definitely not be in our MDX release, in case folks don't want to upgrade immediately. Providing a codemod would be great too; I haven't worked on that yet.
Release notes
<Box bg="primary" mt={3}
), in favor of only supporting styling through thesx
prop.Field
component now accepts a secondcontainerSx
prop, intended to replace whitespace style props (e.g. to convert<Field my={3} sx={{ … }}
to<Field containerSx={{ my: 3 }} sx={{ … }}
).Checkbox
,Select
, andSwitch
have this new prop as well.