[Grid] Deprecation package says justifyContent=flex-start is invalid

• The issue is present in the latest (deprecation) release.
• I have searched the issues of this repository and believe that this is not a duplicate.

Current Behavior 😯

When setting justifyContent to flex-start, an error displays in the console stating the following:

Warning: Failed prop type: Invalid prop justifyContent of value flex-start supplied to ForwardRef(Grid), expected one of [“center”,“flex-end”,“space-between”,“space-around”,“space-evenly”].

I see no indication that it should be disallowed, not to mention this value is within the migrated code.

Expected Behavior 🤔

Well…no error, to put it simply.

Steps to Reproduce 🕹

https://codesandbox.io/s/material-ui-deprecations-grid-issue-f9epl?file=/src/Demo.js

Your Environment 🌎

`npx @material-ui/envinfo`

System: OS: macOS 11.2 Binaries: Node: 15.6.0 - ~/.nvm/versions/node/v15.6.0/bin/node Yarn: 1.22.10 - /usr/local/bin/yarn npm: 7.4.0 - ~/.nvm/versions/node/v15.6.0/bin/npm Browsers: Chrome: 88.0.4324.96 <= Using Edge: Not Found Firefox: 85.0 Safari: 14.0.3 npmPackages: @material-ui/core: 4.11.3 => 4.11.3-deprecations.1 @material-ui/styles: 4.11.3-deprecations.1 @material-ui/system: 4.11.3-deprecations.1 @material-ui/types: 5.1.0 @material-ui/utils: 4.11.2 @types/react: 17.0.0 react: 17.0.1 => 17.0.1 react-dom: 17.0.1 => 17.0.1

[kaylathomas]

Hi there - I’m not sure if this is the same issue, but I think it is: I’m also getting an error when I attempt to use justifyContent on an MUI Grid container at all… I don’t have this issue when I use JSX alone with MUI, but my current position requires I use Typescript. I’m getting the following error:

No overload matches this call.
  Overload 1 of 2, '(props: { component: ElementType<any>; } & Partial<Record<Breakpoint, boolean | GridSize>> & { alignContent?: GridContentAlignment | undefined; ... 7 more ...; zeroMinWidth?: boolean | undefined; } & CommonProps<...> & Pick<...>): Element', gave the following error.
    Property 'component' is missing in type '{ children: Element[]; container: true; direction: "row"; justifyContent: string; alignItems: 
"center"; }' but required in type '{ component: ElementType<any>; }'.
  Overload 2 of 2, '(props: DefaultComponentProps<GridTypeMap<{}, "div">>): Element', gave the following error.
    Type '{ children: Element[]; container: true; direction: "row"; justifyContent: string; alignItems: "center"; }' is not assignable to type 'IntrinsicAttributes & Partial<Record<Breakpoint, boolean | GridSize>> & { alignContent?: GridContentAlignment | undefined; ... 7 more 
...; zeroMinWidth?: boolean | undefined; } & CommonProps<...> & Pick<...>'.
      Property 'justifyContent' does not exist on type 'IntrinsicAttributes & Partial<Record<Breakpoint, boolean | GridSize>> & { alignContent?: GridContentAlignment | undefined; ... 7 more ...; zeroMinWidth?: boolean | undefined; } & CommonProps<...> & Pick<...>'.

Things are fine when I use, say, style={{justifyContent: 'center'}} or something to that effect instead, but using the justifyContent prop itself isn’t working.

[oliviertassinari]

Bug fixed in #24788.