import React , { useState , ChangeEvent } from 'react' ; import styles from './styles.less' ; interface Props { value ? : string ; name : string ; onChange : Function ; type : string ; onEnter ? : Function ; } const Component = ( { value , name , onChange , type = 'text' , onEnter } ) => { const [ _ , setFoucus ] = useState ( ! ! value ) ; const onInsert = ( e ) => { onChange ( e . target . value ) ; } ; const onKeyDown = ( e ) => { onChange ( e ?. target ?. value ) ; if ( e ?. keyCode === 13 ) { onEnter ( ) ; } } ; return ( < div className = { styles . inputItem } > { } { } < input onFocus = { ( ) => setFoucus ( true ) } onBlur = { ( ) => setFoucus ( ! ! value ) } value = { value } onKeyDown = { ( e ) => onKeyDown ( e ) } onChange = { ( e ) => onInsert ( e ) } type = { type } placeholder = { name } / > { } < /div>); } ; export default Component ;