text: import React, { Component } from 'react';
  
  export class FormInput extends Component {
      render() {
          const { className, title, type, placeholder, input } = this.props;
          return (
              <div className={`${className} form-input`}>
                  <label className='form-input__label'>{title}</label>
                  <input className='form-input__input' type={type} placeholder={placeholder} {...input} />
              </div>
          )
      }
  }
  
  export class FormButton extends Component {
      render() {
          const { className, title, type, onClick, input, short } = this.props;
          return (
              <div className={`${className} form-button`}>
                  <button className={`form-button__button ${short ? 'form-button__gray-button' : ''}`}
                      type={type}
                      {...input}
                      onClick={onClick}
                  >
                      {title}
                  </button>
              </div>
          )
      }
  }
  
  
  export class LongGrayButton extends Component {
      render() {
          const { className, labelTitle, title, type, onClick, input } = this.props;
          return (
              <div className={`${className} form-button-long-gray`}>
                  <label className='form-button-long-gray__label'>{labelTitle}</label>
                  <button className={`form-button-long-gray__button`}
                      type={type}
                      {...input}
                      onClick={onClick}
                  >
                      {title}
                  </button>
              </div>
          )
      }
  }