{"size": 1505, "ext": "js", "max_stars_repo_path": "client/js/app/components/common/input.js", "max_stars_repo_name": "danvn/PowerStats", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "client/js/app/components/common/input.js", "max_issues_repo_name": "danvn/PowerStats", "max_issues_repo_issues_event_min_datetime": "2020-02-15T00:16:14.000Z", "max_issues_repo_issues_event_max_datetime": "2020-07-18T20:55:57.000Z", "max_forks_repo_path": "client/js/app/components/common/input.js", "max_forks_repo_name": "danvn/PowerStats", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": 2, "max_forks_count": null, "avg_line_length": 25.9482758621, "max_line_length": 113, "alphanum_fraction": 0.5833887043}
var React = require('react');
var _ = require('lodash');

var InputComponent = React.createClass({

  _onChange: function(event) {
    this.setState({ value: event.target.value });
    this.props.onChange(event);
  },

  getDefaultProps: function() {
    return {
      classes: 'form-group',
      inputClasses: '',
      type: 'text',
      placeholder: '',
      readonly: false,
      onChange: function(){}
    };
  },

  getInitialState: function() {
    return {
      value: this.props.value || ''
    };
  },

  componentWillReceiveProps: function(nextProps) {
    this.setState({ value: nextProps.value });
  },

  render: function() {
    var required = this.props.required ? <small>(required)</small> : null;
    var label = this.props.label ? <label htmlFor={this.props.name}>{this.props.label} {required}</label> : null;
    var inputClasses = "form-control";
    if (this.props.inputClasses) inputClasses = inputClasses + " " + this.props.inputClasses;

    return (
      <div className={this.props.classes}>
        {label}
        <input ref="input"
               type={this.props.type}
               name={this.props.name}
               className={inputClasses}
               placeholder={this.props.placeholder}
               onChange={this._onChange}
               onBlur={this.props.onBlur}
               value={this.state.value}
               readOnly={this.props.readonly}
               autoComplete="off" />
      </div>
    );
  }

});

module.exports = InputComponent;
