Styled-system: Add support for text-transform

[releaf]

It looks like there are a handful of CSS properties available for text/fonts but text-transform is not one of them. It'd be nice to be able to use a component like this:

<Heading textTransform="uppercase">I should be all caps.</Heading>

[jxnblk]

You can create custom style props with the style utility https://github.com/jxnblk/styled-system/blob/master/docs/custom-props.md

[jannisg]

@jxnblk I mean, you're right of course but why arbitrarily support some CSS properties in the styled-system tooling and some are not supported?

Given that this library is a "system" I feel it should either be verbose/exhaustive (support all/most CSS properties in a predictable way) or be highly curated/design supporting only some "blessed" CSS props based on the system's philosophy.

Given that I can write: <p textAlign="center" fontSize="22px" lineHeight="1" /> etc it seems counter-intuitive not to have first party integration of <p textTransform="lowercase" /> too.

[jxnblk]

or be highly curated/design supporting only some "blessed" CSS props based on the system's philosophy

I'm leaning more towards this interpretation, but with the text-transform property there are finite valid values that don't really need "scales" like font-size, color, etc. It also isn't the type of property I tend to see changed on an instance-by-instance basis like text-align is. For the next major version, I'll likely split out the pre-built functions into a separate library and have one that includes all CSS properties