{"size": 938, "ext": "js", "max_stars_repo_path": "src/components/TextInput/index.js", "max_stars_repo_name": "oluwatobiloba2000/varden-web", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/components/TextInput/index.js", "max_issues_repo_name": "oluwatobiloba2000/varden-web", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/components/TextInput/index.js", "max_forks_repo_name": "oluwatobiloba2000/varden-web", "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": 29.3125, "max_line_length": 112, "alphanum_fraction": 0.6481876333}
import React, { PureComponent } from "react";

import {InputWrapper } from "./input.styles";

/**
 * @param {String} placeholder: the placeholder for the input
 * @param {String} type: The input type, any of ['select', 'text', 'date', 'number', 'tel']
 * @param {String} height: The height of the input
 * @param {String} name: The name value for the input. Not needed input of type select
 * @param {Function} onChange: the callback function to collect the value from the input field while users types
 */

class Input extends PureComponent {
  render() {
    const { placeholder, type, height, name, value, onChange, className, required} = this.props;
    return (
      <InputWrapper
        placeholder={placeholder}
        type={type}
        name={name}
        value={value}
        onChange={onChange}
        required={required}
        height={height}
        className={className}
      />
    );
  }
}


export default Input;