Simple functional Input component
import React from 'react'
export default function Input(props) {
props = {
className: 'form-input-text',
label: null,
type: 'text',
onChange: (e) => console.log('Change:', e.target.id, e.target.name, e.target.value);
id: null,
...props
};
if (!props.id) {
throw new Error('ID is requried property - please set uniq id for input');
}
return (
<div className={props.className}>
{(props.label) ? <label htmlFor={props.id}>{props.label}</label> : null}
<input
type={props.type}
name={props.name}
id={props.id}
value={props.value}
onChange={props.onChange}
/>
</div>
);
}