frenic / csstype

Strict TypeScript and Flow types for style based on MDN data
MIT License
1.73k stars 72 forks source link

MarginProperty does not accept Array<number[]> #133

Closed amiiit closed 3 years ago

amiiit commented 3 years ago

Hello,

In our project we are using MaterialUI, which is depending on this library. When we come to define styles with a rule similar to the following:

// x,y of type number
margin: [[x, y]],

This is failing with:

TS2322: Type '[number, number]' is not assignable to type 'string'.

as it does not fit the type declaration of:

type MarginProperty<TLength> = Globals | TLength | "auto" | string;

Are we using this correctly, or is there a recommended way to use casting to make TS agree to this value? This is a valid usage according to the JSS documentation:

https://cssinjs.org/jss-syntax/?v=v10.6.0#space-separated-values

I understand also that this library isn't about JSS but about CSS type, but since the types here are being directly used I decided to start by asking here.

Thank you

ashl1 commented 3 years ago

This is not only for Margin, but for Padding as well. I think any property doesn't accept comma separated values in JSS syntax :(

frenic commented 3 years ago

CSSType should be as close to the correct CSS-specification as possible. margin and padding are handled differently in different CSS-in-JS libraries and this issue should be addressed there, not here.