27 lines
747 B
JavaScript
27 lines
747 B
JavaScript
'use strict'
|
|
|
|
import React from 'react'
|
|
|
|
import '../../styles/shared/underlineinput.scss'
|
|
|
|
const UnderlineInput = props => (
|
|
<div className={'underlined-input ' + (props.className ? props.className : '')}>
|
|
<input
|
|
type={props.type}
|
|
name={props.name}
|
|
value={props.value}
|
|
className={(props.value.length ? 'has-content' : '') + (props.pattern
|
|
? (props.value.length && !props.pattern.test(props.value) ? ' invalid' : '')
|
|
: '')}
|
|
autoComplete='nothing'
|
|
onChange={props.onChange}
|
|
onBlur={props.onBlur} />
|
|
<div className='reacts-to'>
|
|
<label className='placeholder'>{props.placeholder}</label>
|
|
<div className='underline' />
|
|
</div>
|
|
</div>
|
|
)
|
|
|
|
export default UnderlineInput
|