[system] Box props types any

[jonlepage]

Hi guys , do i have a bug somewhere in my config or you dont provide a flexbox types for intellisence?
I cant get suggestions from flex api when i use your Box components.

Any way to get flexbox types suggestions from your Box api ?
i try npm install @types/react-flex -D -S but not work !

[oliviertassinari]

@djmisterjon Thanks for raising the issue, I can reproduce it on https://codesandbox.io/s/material-demo-cilh8?file=/demo.tsx.

[eps1lon]

What type should it have in your opinion and why?

[oliviertassinari]

Would it make sense to have?

import * as CSS from 'csstype';

CSS.Properties['justifyContent'];

However, we would also need to account for the breakpoint API.

[jonlepage]

sorry guys, I can't really help you on this level, I don't have a lot of frontend experience and especially CSS.
It why i ask you if is normal about cant get suggestions for some props in your API.
The only thing i can tell you, is how i work with your API.
I work on multi screen with a SDK framework for desktop and use the developer tool to work with live CSS suggestions, than when i get the result i need, i copy paste properties in my CSS files (.less) . (no dynamic)

I dont like have to managing CSS inside .JS and .JSX , i think it the way that's your API suggest to work.
For dynamic CSS, am using style={{}} and props.
But for box, i always need opend SDK to be sure to no made mistake on flexbox properties.
It slow down little bit the workflow.

It's not very serious urgent, but just if you think you have a simple solution, i will take.
Thank you so much for your great work, I love react with MUI and ANTD ! It make so easy to work with the frontend world.

[jonlepage]

For sure i can maybe , use only direct styles !? its seem have types suggestions!

but we have to use important! sometime when it is require, and also it remove the fun of props workflow.

ps: boilerplate using in my workflow is share there .
https://github.com/djmisterjon/nw-Parcel-hmr-boilerplate

[jonlepage]

ok so i success for my own modules

by adding import * as CSS from 'csstype'; and some jsdoc
@param {CSS.Property.FlexDirection} [props.flexDirection] - descriptions

So it would be a good idea to include it natively in your library for <Box>

[oliviertassinari]

Duplicate of #15451