import React, { Component, FunctionComponent } from "react";
import PropTypes from "prop-types";

export interface TextInputProps {
  classes?: string;
  id?: string;
  placeholder?: string;
  type?: string;
}

class EfeFormControl extends Component<any, any> {
  /* Props
   * ------------------------------------------------
   *   @prop { string }   classes          - Optional. String value added to the classes.
   *   @prop { string }   id               - Optional. Id of  form control.
   *   @prop { string }   placeholder      - Optional. Placeholder of the text form control.
   *   @prop { string }   type             - Optional. Type of the form control.
   */

  /* PropTypes
   * ---------------------------------------------- */
  static propTypes = {
    classes: PropTypes.string,
    id: PropTypes.string.isRequired,
    placeholder: PropTypes.string,
    type: PropTypes.string
  };

  /* Life Cycle Functions
   * ------------------------------------------------ */
  render() {
    const { classes, id, placeholder, type } = this.props;
    return (
      <input
        type={type}
        className={`form-control ${classes}`}
        id={id}
        placeholder={placeholder}
      />
    );
  }
}

export default EfeFormControl;
