Strict mode applies to all the props configuration
loicplaire opened this issue · comments
The potential issue
When turning strict mode on, the flexbox prop configuration stops working.
Should the strict mode only apply to the theme keys?
How to test
Turn on the strict mode in this unit test, it will return undefined for both the alignItems and flex properties.
Hmm, yes that would make sense. So if strict is enabled, and a property has an associated theme scale, only those values are valid. Otherwise properties that don't normally have a theme scale, like flex and display, all of their values will work. Sound right?
@roginfarrer Thanks for your answer! Yes, that's definitely how I thought it would work when I enabled it. If you could guide me on where/how this is currently handled I could probably find time to raise a PR.
Sounds good. I think we need to update the default transform function here:
https://github.com/system-props/system-props/blob/main/src/core/createStyleFunction.ts#L10-L12
The object parameter is the theme scale, so I think we just need to check whether that value is defined.
That's a good idea! On that subject, would it be possible to validate strict mode with TypeScript?
I mean, if I don't have a red color in my theme and I'm passing color="red", TS should raise an error.
🎉 This issue has been resolved in version 0.22.0 🎉
The release is available on:
npm package (@latest dist-tag)- GitHub release
Your semantic-release bot 📦🚀