title: React material-ui Datepicker and timepicker dont show
body: <p>I've been starting to use material-ui was looking into using DatePicker and TimePicker. I don't know if it's a bug or that i did something wrong, but after searching everywhere i'm not able to make those 2 components works. They simply don't show, nothing happens when i click on them and when i tab itdoesn't focus them.</p>
  
  <p>I also called the<code>injectTapEventPlugin();</code> at the beginning of my app.js</p>
  
  <pre><code> &lt;DatePicker
          hintText="Test"
          value={this.state.startDate}
          onChange={this.handleChange}
       /&gt;
  
  
  
   &lt;TimePicker
            ref="picker12hr"
            format="ampm"
            hintText="test"
            onChange={this.handleTimeChange}
          /&gt;
  </code></pre>
  
  <p>this is the code :</p>
  
  <pre><code>var React = require('react');
  var ReactDom = require('react-dom');
  var ReactBootstrap = require('react-bootstrap');
  import TimePicker from 'material-ui/TimePicker';
  
  var TimeValidateField = React.createClass({
      getInitialState: function() {
          return {
              errorText:'',
              floatingLabelStyle: { color : this.props.labelColor },
              underlineStyle: { borderColor : this.props.borderColor },
              hintStyle:{ color : 'transparent' }
          }
      },
      saveValues: function(e) {
          if (e.target.value === '' || e.target.value === 'null') {
              var red = '#F44336'
              var floatingLabelStyle = { color : red};
              var underlineStyle = { borderColor : red};
              this.setState({errorText: 'Ce champ est requis', floatingLabelStyle:floatingLabelStyle, hintStyle:floatingLabelStyle, underlineStyle:underlineStyle});
          } else {
              var floatingLabelStyle = { color : this.props.labelColor };
              var underlineStyle = { borderColor : this.props.borderColor };
              var hintStyle = { color : 'transparent' };
              this.setState({errorText: '', floatingLabelStyle:floatingLabelStyle, hintStyle:floatingLabelStyle, underlineStyle:underlineStyle});
              this.props.saveValues(e.target.id, e.target.value);
          }
  
      },
      render: function() {
          const styles = {
              underlineStyle: {
  
              },
              hintStyle: {
                  color: 'transparent'
              },
              floatingLabelStyle: {
  
              }
          };
          var error = this.state.error === true
              ? &lt;div className="validation-error"&gt;{this.state.errorLabel}&lt;/div&gt;
              : &lt;div&gt;&lt;/div&gt;;
  
          return (
              &lt;div className={this.props.className}&gt;
              &lt;TimePicker onChange={this.saveValues} id={this.props.label} floatingLabelStyle={this.state.floatingLabelStyle} underlineFocusStyle={this.state.underlineStyle} className={'col-md-12'} ref={'picker24hr'} hintStyle={this.state.hintStyle} hintText={this.props.label} errorText={this.state.errorText} floatingLabelText={this.props.label}&gt;&lt;/TimePicker&gt;
              &lt;/div&gt;
          )
      }
  });
  
  module.exports = TimeValidateField;
  </code></pre>
  
  <p>and this is the one for the DatePicker</p>
  
  <pre><code>var React = require('react');
  var ReactDom = require('react-dom');
  var ReactBootstrap = require('react-bootstrap');
  var moment = require('moment');
  import DatePicker from 'material-ui/DatePicker';
  
  var DateValidateField = React.createClass({
      getInitialState: function() {
          return {
              errorText:'',
              floatingLabelStyle: { color : this.props.labelColor },
              underlineStyle: { borderColor : this.props.borderColor },
              hintStyle:{ color : 'transparent' },
              startDate : null,
          }
      },
      saveValues: function(e) {
          if (e.target.value === '' || e.target.value === 'null') {
              var red = '#F44336'
              var floatingLabelStyle = { color : red};
              var underlineStyle = { borderColor : red};
              this.setState({errorText: 'Ce champ est requis', floatingLabelStyle:floatingLabelStyle, hintStyle:floatingLabelStyle, underlineStyle:underlineStyle});
          } else {
              var floatingLabelStyle = { color : this.props.labelColor };
              var underlineStyle = { borderColor : this.props.borderColor };
              var hintStyle = { color : 'transparent' };
              this.setState({errorText: '', floatingLabelStyle:floatingLabelStyle, hintStyle:floatingLabelStyle, underlineStyle:underlineStyle});
              this.props.saveValues(e.target.id, e.target.value);
          }
  
      },
      render: function() {
          const styles = {
              underlineStyle: {
  
              },
              hintStyle: {
                  color: 'transparent'
              },
              floatingLabelStyle: {
  
              }
          };
          var error = this.state.error === true
              ? &lt;div className="validation-error"&gt;{this.state.errorLabel}&lt;/div&gt;
              : &lt;div&gt;&lt;/div&gt;;
  
          return (
              &lt;div className={this.props.className}&gt;
              &lt;DatePicker value={this.state.startDate} onChange={this.saveValues} id={this.props.label} floatingLabelStyle={this.state.floatingLabelStyle} underlineFocusStyle={this.state.underlineStyle} style={{
                  'width': '100%'
              }} className={'col-md-12'} hintStyle={this.state.hintStyle} hintText={this.props.label} errorText={this.state.errorText} floatingLabelText={this.props.label}&gt;&lt;/DatePicker&gt;
              &lt;/div&gt;
          )
      }
  });
  
  module.exports = DateValidateField;
  </code></pre>