react-final-form-utils
Decorators, validators and string helpers for classic email, password, loading fields in a react final form
Basic Usage
For a typical TextField input:
/* eslint react/jsx-one-expression-per-line: 0 */ const validateRequiredField = const TextField = autoComplete className disabled id label name placeholder readOnly renderInner renderValue required type validate const requiredValidate = required && typeof required === 'function' ? required : required && validateRequiredField || undefined return <Field name=name validate= parse= render= <div className= id=id > <label htmlFor=name className=> label && <span> <span>label</span> required && !readOnly && <span className="field-asterisk">*</span> </span> </label> <div className="field-control"> <div className="field-value flex-columns items-center"> <div className="field-inner flex-columns items-center"> <input ...input autoComplete=autoComplete ? 'on' : 'off' className=`field-input field-` disabled=disabled || readOnly placeholder=readOnly ? '' : placeholder readOnly=readOnly required=!!required // cast to boolean type=type /> </div> </div> <FieldError meta=meta /> </div> </div> /> TextFielddefaultProps = autoComplete: false className: '' disabled: false id: null label: '' placeholder: 'Please enter a value' readOnly: false null null required: false type: 'text' validate: null TextFieldpropTypes = autoComplete: PropTypesbool className: PropTypesstring disabled: PropTypesbool id: PropTypesstring label: PropTypesstring name: PropTypesstringisRequired placeholder: PropTypesstring readOnly: PropTypesbool renderInner: PropTypesfunc renderValue: PropTypesfunc required: PropTypes type: PropTypesstring validate: PropTypesfunc