{"size": 1573, "ext": "js", "max_stars_repo_path": "extension/share/components/forms/textinput.js", "max_stars_repo_name": "lucas-mancini/sync-tab-groups", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "extension/share/components/forms/textinput.js", "max_issues_repo_name": "lucas-mancini/sync-tab-groups", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "extension/share/components/forms/textinput.js", "max_forks_repo_name": "lucas-mancini/sync-tab-groups", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 22.7971014493, "max_line_length": 67, "alphanum_fraction": 0.5104895105}
class TextInput extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      name: this.props.name
    };
  }

  componentWillReceiveProps(nextProps) {
    this.setState({
      name: nextProps.name
    });
  }

  render() {
    let help_section = [];
    if (this.props.help !== undefined) {
      help_section = React.createElement(
        "span",
        { className: "option-input-text-help" },
        this.props.help
      );
    }

    return React.createElement(
      "div",
      { className: "option-input-text" },
      React.createElement(
        "div",
        { style: {
            display: "flex",
            justifyContent: "space-between"
          } },
        React.createElement(
          "span",
          {
            className: "option-input-text-label",
            htmlFor: this.props.id },
          this.props.label
        ),
        React.createElement("input", {
          type: "text",
          value: this.state.name,
          id: this.props.id,
          onBlur: (event => {
            this.props.onChange(this.props.id, event.target.value);
            this.setState({
              name: event.target.value
            });
          }).bind(this),
          onChange: (event => {
            this.setState({
              name: event.target.value
            });
          }).bind(this)
        })
      ),
      help_section
    );
  }
};

TextInput.propTypes = {
  label: PropTypes.string,
  name: PropTypes.string,
  help: PropTypes.string,
  onChange: PropTypes.func,
  id: PropTypes.string
};