Material-ui: [TextField] type="date" writes mm/dd/yyyy on top of label

[kobenauf]

TextField with a label set to something and type set to date but with no initial value displays the label and mm/dd/yyyy on top of each other in the TextField. Once you enter the field, the label moves up as superscript and the mm/dd/yyyy remains and is readable.

• [x] I have searched the issues of this repository and believe that this is not a duplicate.

Expected Behavior

When the date picker has no value, if it is going to display the expected date format in the field, it should treat that as a value and move the label up to superscript. Alternatively, don't display the date format unless the user enters the field and there is no value.

Current Behavior

Currently the label and date format overwrite each other if there is no value for the TextField.

Steps to Reproduce (for bugs)

Example on codesandbox.io:
https://codesandbox.io/s/6ljy4wq04k

Your Environment

| Tech | Version |
|--------------|---------|
| Material-UI | 1.0.0-beta.9 |
| React | 15.6.1 |
| browser | Chrome 60.03 |

[oliviertassinari]

You are using the native date input type. I haven't found any simple way to know if there is already a placeholder displayed.

[kobenauf]

Thanks for the pointing me to that demo page. I added this the the TextField element and it had the desired outcome:

<TextField InputLabelProps={{ shrink: true }} />