stylex
stylex copied to clipboard
Use a better CSS value parser to normalize values
We currently use postcss-value-parser to parse the values used in stylex.create and normalize them. However, this is a basic parser and we're mostly limited in the normalisation we can perform to being able to strip extra white space, and sometimes drop units used with 0.
We can use a more sophisticated CSS value parser that understand CSS value types to be able to normalise many more kinds of values.
Here are a few examples:
rgb(0 0 0 / 50%)should be normalised torgba(0,0,0,0.5)#000000should be normalised to#000- We should either convert all named CSS colours to hashes or convert hash values to named values when possible.
@media (width >= 768px)should be normalised to@media (min-width: 768px)- etc.
nmn/css-value-parser is a fairly full featured parser that I worked on specifically for this purpose.
We could also consider using lightningcss if that is a good fit.