<p dir="auto">Steps to reproduce:</p>
<ol dir="auto">
<li>Go to <a href="http://material-ui.com/#/components/text-fields" rel="nofollow">http://material-ui.com/#/components/text-fields</a></li>
<li>Click on the text field sample (first row, second column), specifically on the floating label</li>
</ol>
<p dir="auto">Actual: Clicking on the floating label the first time does not focus the field<br>
Expected: Clicking on the floating label for the first time should focus the field input</p>
<p dir="auto">The css class names definitions are duplicated for some components  - in my case it is duplicated (I guess from my debugging) for <code class="notranslate">MuiIconButton</code> and <code class="notranslate">MuiModal</code> - check current behavior</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">The class names should not be duplicated across components.</p>
<h2 dir="auto">Current Behavior</h2>

<p dir="auto">My button styles:<br>
<a target="_blank" rel="noopener noreferrer nofollow" href="https://user-images.githubusercontent.com/11510581/30492845-37fd9560-9a42-11e7-8251-f04b1efb2ee3.png"><img src="https://user-images.githubusercontent.com/11510581/30492845-37fd9560-9a42-11e7-8251-f04b1efb2ee3.png" alt="classnames_conflict" style="max-width: 100%;"></a><br>
The class is duplicated.<br>
Styles definition:<br>
<a target="_blank" rel="noopener noreferrer nofollow" href="https://user-images.githubusercontent.com/11510581/30492862-461c21d4-9a42-11e7-8774-5baf1fd74e83.png"><img src="https://user-images.githubusercontent.com/11510581/30492862-461c21d4-9a42-11e7-8774-5baf1fd74e83.png" alt="classnames_conflit_2" style="max-width: 100%;"></a></p>
<p dir="auto">It is working in development mode:<br>
My buttons styles:<br>
<a target="_blank" rel="noopener noreferrer nofollow" href="https://user-images.githubusercontent.com/11510581/30492876-528b3d7e-9a42-11e7-8ac9-fca2627dbeb7.png"><img src="https://user-images.githubusercontent.com/11510581/30492876-528b3d7e-9a42-11e7-8ac9-fca2627dbeb7.png" alt="development_class" style="max-width: 100%;"></a></p>
<p dir="auto">and found the definitions:<br>
<a target="_blank" rel="noopener noreferrer nofollow" href="https://user-images.githubusercontent.com/11510581/30492889-5dc28472-9a42-11e7-99cb-916781efde94.png"><img src="https://user-images.githubusercontent.com/11510581/30492889-5dc28472-9a42-11e7-99cb-916781efde94.png" alt="mui-icon-button-dev" style="max-width: 100%;"></a></p>
<p dir="auto">and from modal:<br>
<a target="_blank" rel="noopener noreferrer nofollow" href="https://user-images.githubusercontent.com/11510581/30492896-63b9ba12-9a42-11e7-8937-3c24535ac8a1.png"><img src="https://user-images.githubusercontent.com/11510581/30492896-63b9ba12-9a42-11e7-8937-3c24535ac8a1.png" alt="mui-modal-dev" style="max-width: 100%;"></a></p>
<h2 dir="auto">Steps to Reproduce (for bugs)</h2>

<p dir="auto">I can try to prepare the environment to reproduce the problem but right now I just wanted to report it here.</p>
<h2 dir="auto">Context</h2>
  
<p dir="auto">I'm trying to release my application with the production environment.</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.10</td>
</tr>
<tr>
<td>React</td>
<td>15.6.1</td>
</tr>
<tr>
<td>browser</td>
<td>any</td>
</tr>
<tr>
<td>webpack</td>
<td>^3.3.0</td>
</tr>
</tbody>
</table>
<p dir="auto">I need some hints where may be the problem. I'm not using <code class="notranslate">withStyles</code> solution anywhere - I use styled components for styles overriding.</p>