<h3 dir="auto">Problem description</h3>
<p dir="auto"><a target="_blank" rel="noopener noreferrer nofollow" href="https://cloud.githubusercontent.com/assets/4742672/26117547/8d34bd40-3a2c-11e7-8374-4aea5b6d8f0d.png"><img src="https://cloud.githubusercontent.com/assets/4742672/26117547/8d34bd40-3a2c-11e7-8374-4aea5b6d8f0d.png" alt="screen shot 2017-05-16 at 11 39 07" style="max-width: 100%;"></a></p>
<h3 dir="auto">Link to minimal working code that reproduces the issue</h3>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="&lt;TextField
  label=&quot;From Time&quot;
  type=&quot;time&quot;
  value={this.state.time}
  name=&quot;time&quot;
  onChange={this.handleChange}
  /&gt;"><pre class="notranslate"><code class="notranslate">&lt;TextField
  label="From Time"
  type="time"
  value={this.state.time}
  name="time"
  onChange={this.handleChange}
  /&gt;
</code></pre></div>

<h3 dir="auto">Versions</h3>
<ul dir="auto">
<li>Material-UI: 1.0.0-alpha.13</li>
<li>React: 15.5.4</li>
<li>Browser: Google Chrome / Version 58.0.3029.110 (64-bit)</li>
</ul>
<p dir="auto"><code class="notranslate">TextField</code> with a <code class="notranslate">label</code> set to something and <code class="notranslate">type</code> set to date but with no initial value displays the label and <code class="notranslate">mm/dd/yyyy</code> on top of each other in the <code class="notranslate">TextField</code>.  Once you enter the field, the label moves up as superscript and the mm/dd/yyyy remains and is readable.</p>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> I have searched the <a href="https://github.com/callemall/material-ui/issues">issues</a> of this repository and believe that this is not a duplicate.</li>
</ul>
<h2 dir="auto">Expected Behavior</h2>
<p dir="auto">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.</p>
<h2 dir="auto">Current Behavior</h2>
<p dir="auto">Currently the label and date format overwrite each other if there is no value for the TextField.</p>
<h2 dir="auto">Steps to Reproduce (for bugs)</h2>
<p dir="auto">Example on codesandbox.io:<br>
<a href="https://codesandbox.io/s/6ljy4wq04k" rel="nofollow">https://codesandbox.io/s/6ljy4wq04k</a></p>
<h2 dir="auto">Your Environment</h2>
<table role="table">
<thead>
<tr>
<th>Tech</th>
<th>Version</th>
</tr>
</thead>
<tbody>
<tr>
<td>Material-UI</td>
<td>1.0.0-beta.9</td>
</tr>
<tr>
<td>React</td>
<td>15.6.1</td>
</tr>
<tr>
<td>browser</td>
<td>Chrome 60.03</td>
</tr>
</tbody>
</table>