misc bugfixes to existing fields

src/client/components/forms/field-types/Email/index.js

@@ -9,7 +9,7 @@ import './index.scss';
 const defaultError = 'Please enter a valid email.';
 const defaultValidate = value => /\S+@\S+\.\S+/.test(value);
 
-const Input = (props) => {
+const Email = (props) => {
   const {
     name,
     required,
@@ -27,6 +27,7 @@ const Input = (props) => {
     value,
     showError,
     processing,
+    onFieldChange
   } = useFieldType({
     name,
     required,
@@ -44,7 +45,7 @@ const Input = (props) => {
       <Label htmlFor={name} label={label} required={required} />
       <input
         value={value || ''}
-        onChange={onChange}
+        onChange={onFieldChange}
         disabled={processing ? 'disabled' : undefined}
         placeholder={placeholder}
         type="email"
@@ -54,7 +55,7 @@ const Input = (props) => {
   );
 }
 
-Input.defaultProps = {
+Email.defaultProps = {
   required: false,
   processing: false,
   defaultValue: null,
@@ -64,7 +65,7 @@ Input.defaultProps = {
   style: {},
 }
 
-Input.propTypes = {
+Email.propTypes = {
   name: PropTypes.string.isRequired,
   required: PropTypes.bool,
   defaultValue: PropTypes.string,
@@ -76,4 +77,4 @@ Input.propTypes = {
   label: PropTypes.string.isRequired,
 }
 
-export default Input;
+export default Email;

src/client/components/forms/field-types/Input/index.js

@@ -26,7 +26,7 @@ const Input = (props) => {
   const {
     value,
     showError,
-    onChange,
+    onFieldChange,
     formProcessing,
   } = useFieldType({
     name,
@@ -51,7 +51,7 @@ const Input = (props) => {
       <Label htmlFor={name} label={label} required={required} />
       <input
         value={value || ''}
-        onChange={onChange}
+        onChange={onFieldChange}
         disabled={formProcessing ? 'disabled' : undefined}
         placeholder={placeholder}
         type="text"

src/client/components/forms/field-types/Password/index.js

@@ -9,7 +9,7 @@ import './index.scss';
 const defaultError = 'Please enter a password.';
 const defaultValidate = value => value.length > 3;
 
-const Input = (props) => {
+const Password = (props) => {
   const {
     name,
     required,
@@ -27,6 +27,7 @@ const Input = (props) => {
     value,
     showError,
     processing,
+    onFieldChange,
   } = useFieldType({
     name,
     required,
@@ -44,7 +45,7 @@ const Input = (props) => {
       <Label htmlFor={name} label={label} required={required} />
       <input
         value={value || ''}
-        onChange={onChange}
+        onChange={onFieldChange}
         disabled={processing ? 'disabled' : undefined}
         placeholder={placeholder}
         type="password"
@@ -54,7 +55,7 @@ const Input = (props) => {
   );
 }
 
-Input.defaultProps = {
+Password.defaultProps = {
   required: false,
   processing: false,
   defaultValue: null,
@@ -64,7 +65,7 @@ Input.defaultProps = {
   style: {},
 }
 
-Input.propTypes = {
+Password.propTypes = {
   name: PropTypes.string.isRequired,
   required: PropTypes.bool,
   defaultValue: PropTypes.string,
@@ -76,4 +77,4 @@ Input.propTypes = {
   label: PropTypes.string.isRequired,
 }
 
-export default Input;
+export default Password;

src/client/components/forms/field-types/Select/index.js

@@ -28,7 +28,7 @@ const Select = (props) => {
     value,
     showError,
     formProcessing,
-    onChange,
+    onFieldChange,
   } = useFieldType({
     name,
     required,
@@ -55,7 +55,7 @@ const Select = (props) => {
       <Label htmlFor={name} label={label} required={required} />
       <ReactSelect
         value={options.find(option => option.value === value)}
-        onChange={selected => onChange(selected.value)}
+        onChange={selected => onFieldChange(selected.value)}
         disabled={formProcessing ? 'disabled' : undefined}
         id={name}
         name={name}

src/client/components/forms/field-types/Textarea/index.js

@@ -26,7 +26,7 @@ const Textarea = (props) => {
   const {
     value,
     showError,
-    onChange,
+    onFieldChange,
     formProcessing,
   } = useFieldType({
     name,
@@ -51,7 +51,7 @@ const Textarea = (props) => {
       <Label htmlFor={name} label={label} required={required} />
       <textarea
         value={value || ''}
-        onChange={onChange}
+        onChange={onFieldChange}
         disabled={formProcessing ? 'disabled' : undefined}
         placeholder={placeholder}
         id={name}
@@ -62,8 +62,8 @@ const Textarea = (props) => {
 }
 
 Textarea.defaultProps = {
-  label: null,
   required: false,
+  label: null,
   processing: false,
   defaultValue: null,
   validate: defaultValidate,

src/client/components/forms/useFieldType/index.js

@@ -54,7 +54,7 @@ const useFieldType = (options) => {
     value: valueToRender,
     formSubmitted: submitted,
     formProcessing: processing,
-    onChange: (e) => {
+    onFieldChange: (e) => {
       if (e.target) {
         sendField(e.target.value);
       } else {