MyCrypto/common/containers/Tabs/RestoreKeystore/components/KeystoreInput.tsx

37 lines
807 B
TypeScript

import React from 'react';
import classnames from 'classnames';
interface Props {
isValid: boolean;
isVisible: boolean;
name: string;
value: string;
placeholder: string;
handleInput(e: React.FormEvent<HTMLInputElement>): void;
handleToggle(): void;
}
const KeystoreInput: React.SFC<Props> = ({
isValid,
isVisible,
handleInput,
name,
value,
placeholder,
handleToggle
}) => (
<div className="input-group">
<input
className={classnames('form-control', isValid ? 'is-valid' : 'is-invalid')}
type={isVisible ? 'text' : 'password'}
name={name}
placeholder={placeholder}
value={value}
onChange={handleInput}
/>
<span onClick={handleToggle} role="button" className="input-group-addon eye" />
</div>
);
export default KeystoreInput;