e2m/dispatch
4
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Code split the client, update dependencies

Browse source
This commit is contained in:
Ken-Håvard Lieng 2018-11-04 07:22:46 +01:00
parent 84c3d5cc88
commit d930365eeb
37 changed files with 2036 additions and 1181 deletions
Download patch file Download diff file Expand all files Collapse all files

79
client/src/js/components/ui/TextInput.js
View file

@ -1,6 +1,8 @@
import React, { PureComponent } from 'react';
import { Field } from 'formik';
import { FastField } from 'formik';
import classnames from 'classnames';
import capitalize from 'lodash/capitalize';
import Error from 'components/ui/formik/Error';
export default class TextInput extends PureComponent {
constructor(props) {
@ -36,44 +38,49 @@ export default class TextInput extends PureComponent {
};
render() {
const { name, placeholder, ...props } = this.props;
const { name, label = capitalize(name), noError, ...props } = this.props;
return (
<Field
<FastField
name={name}
render={({ field, form }) => (
<div className="textinput">
<input
className={field.value && 'value'}
type="text"
name={name}
autoCapitalize="off"
autoCorrect="off"
autoComplete="off"
spellCheck="false"
ref={this.input}
onFocus={this.handleFocus}
{...field}
{...props}
/>
<span
className={classnames('textinput-1', {
value: field.value,
error: form.touched[name] && form.errors[name]
})}
>
{placeholder}
</span>
<span
className={classnames('textinput-2', {
value: field.value,
error: form.touched[name] && form.errors[name]
})}
>
{placeholder}
</span>
</div>
)}
render={({ field, form }) => {
return (
<>
<div className="textinput">
<input
className={field.value && 'value'}
type="text"
name={name}
autoCapitalize="off"
autoCorrect="off"
autoComplete="off"
spellCheck="false"
ref={this.input}
onFocus={this.handleFocus}
{...field}
{...props}
/>
<span
className={classnames('textinput-1', {
value: field.value,
error: form.touched[name] && form.errors[name]
})}
>
{label}
</span>
<span
className={classnames('textinput-2', {
value: field.value,
error: form.touched[name] && form.errors[name]
})}
>
{label}
</span>
</div>
{!noError && <Error name={name} />}
</>
);
}}
/>
);
}