FieldInput.js

import React, { Component, PropTypes } from 'react';
import stringToClassName from '../helpers/stringToClassName';

export default class FieldInput extends Component {
	static propTypes = {
		input: PropTypes.shape({
			name: PropTypes.string,
			value: PropTypes.string,
			onChange: PropTypes.func
		}),
		type: PropTypes.string,
		label: PropTypes.string,
		required: PropTypes.bool,
		description: PropTypes.string,
		meta: PropTypes.shape({
			touched: PropTypes.bool,
			error: PropTypes.string
		})
	};
	render() {
		const {input, label, type, description, required, meta: {touched, error}} = this.props;
		return (
			<div className="md-text-field with-floating-label">
				<input { ...input} className={touched && error ? 'has-error' : ''} id={stringToClassName(input.name)} type={type} required={required} />
				<label htmlFor={stringToClassName(input.name)}>{label} {this.props.required ? <span>*</span> : ''}</label>
				{touched && error && <small className="error">{error}</small>}
				{ description ? <p>{description}</p> : ''}
			</div>
		);
	}
}