40 lines
867 B
TypeScript
40 lines
867 B
TypeScript
import React from 'react';
|
|
import classnames from 'classnames';
|
|
|
|
interface Props {
|
|
isValid: boolean;
|
|
isVisible: boolean;
|
|
name: string;
|
|
value: string;
|
|
placeholder: string;
|
|
disabled?: boolean;
|
|
handleInput(e: React.FormEvent<HTMLInputElement>): void;
|
|
handleToggle(): void;
|
|
}
|
|
|
|
const KeystoreInput: React.SFC<Props> = ({
|
|
isValid,
|
|
isVisible,
|
|
handleInput,
|
|
name,
|
|
value,
|
|
placeholder,
|
|
disabled,
|
|
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}
|
|
disabled={disabled}
|
|
/>
|
|
<span onClick={handleToggle} role="button" className="input-group-addon eye" />
|
|
</div>
|
|
);
|
|
|
|
export default KeystoreInput;
|