diff --git a/src/components/FieldDateInput/FieldDateInput.js b/src/components/FieldDateInput/FieldDateInput.js
index 84f7988d..ba8f472a 100644
--- a/src/components/FieldDateInput/FieldDateInput.js
+++ b/src/components/FieldDateInput/FieldDateInput.js
@@ -47,7 +47,7 @@ class FieldDateInputComponent extends Component {
[css.pickerError]: hasError,
});
- const { onBlur, onFocus, ...restOfInput } = input;
+ const { onBlur, onFocus, type, ...restOfInput } = input;
const inputProps = {
onBlur: input.onBlur,
onFocus: input.onFocus,
diff --git a/src/components/FieldDateRangeController/FieldDateRangeController.js b/src/components/FieldDateRangeController/FieldDateRangeController.js
index e0652517..7c57e464 100644
--- a/src/components/FieldDateRangeController/FieldDateRangeController.js
+++ b/src/components/FieldDateRangeController/FieldDateRangeController.js
@@ -5,7 +5,8 @@ import DateRangeController from './DateRangeController';
const component = props => {
const { input, controllerRef, ...rest } = props;
- return ;
+ const { type, ...restOfInput } = input;
+ return ;
};
const FieldDateRangeController = props => {
diff --git a/src/components/FieldDateRangeInput/FieldDateRangeInput.js b/src/components/FieldDateRangeInput/FieldDateRangeInput.js
index 93a705d8..4ed4b4b7 100644
--- a/src/components/FieldDateRangeInput/FieldDateRangeInput.js
+++ b/src/components/FieldDateRangeInput/FieldDateRangeInput.js
@@ -117,7 +117,7 @@ class FieldDateRangeInputComponent extends Component {
) : null;
// eslint-disable-next-line no-unused-vars
- const { onBlur, onFocus, ...restOfInput } = input;
+ const { onBlur, onFocus, type, ...restOfInput } = input;
const inputProps = {
unitType,
onBlur: this.handleBlur,
diff --git a/src/components/FieldTextInput/FieldTextInput.js b/src/components/FieldTextInput/FieldTextInput.js
index 368f5615..1ab6f745 100644
--- a/src/components/FieldTextInput/FieldTextInput.js
+++ b/src/components/FieldTextInput/FieldTextInput.js
@@ -18,7 +18,6 @@ class FieldTextInputComponent extends Component {
customErrorText,
id,
label,
- type,
input,
meta,
onUnmount,
@@ -33,7 +32,7 @@ class FieldTextInputComponent extends Component {
}
const { valid, invalid, touched, error } = meta;
- const isTextarea = type === 'textarea';
+ const isTextarea = input.type === 'textarea';
const errorText = customErrorText || error;
@@ -43,6 +42,8 @@ class FieldTextInputComponent extends Component {
const fieldMeta = { touched: hasError, error: errorText };
+ // Textarea doesn't need type.
+ const { type, ...inputWithoutType } = input;
// Uncontrolled input uses defaultValue instead of value.
const { value: defaultValue, ...inputWithoutValue } = input;
// Use inputRef if it is passed as prop.
@@ -57,7 +58,15 @@ class FieldTextInputComponent extends Component {
});
const maxLength = CONTENT_MAX_LENGTH;
const inputProps = isTextarea
- ? { className: inputClasses, id, rows: 1, maxLength, ...refMaybe, ...input, ...rest }
+ ? {
+ className: inputClasses,
+ id,
+ rows: 1,
+ maxLength,
+ ...refMaybe,
+ ...inputWithoutType,
+ ...rest,
+ }
: isUncontrolled
? {
className: inputClasses,
@@ -109,9 +118,6 @@ FieldTextInputComponent.propTypes = {
id: string,
label: string,
- // Either 'textarea' or something that is passed to the input element
- type: string.isRequired,
-
// Uncontrolled input uses defaultValue prop, but doesn't pass value from form to the field.
// https://reactjs.org/docs/uncontrolled-components.html#default-values
isUncontrolled: bool,
@@ -121,6 +127,8 @@ FieldTextInputComponent.propTypes = {
// Generated by final-form's Field component
input: shape({
onChange: func.isRequired,
+ // Either 'textarea' or something that is passed to the input element
+ type: string.isRequired,
}).isRequired,
meta: object.isRequired,
};
diff --git a/src/forms/EditListingPhotosForm/EditListingPhotosForm.js b/src/forms/EditListingPhotosForm/EditListingPhotosForm.js
index 2cb7389e..b5f77c06 100644
--- a/src/forms/EditListingPhotosForm/EditListingPhotosForm.js
+++ b/src/forms/EditListingPhotosForm/EditListingPhotosForm.js
@@ -159,8 +159,8 @@ export class EditListingPhotosFormComponent extends Component {
disabled={imageUploadRequested}
>
{fieldprops => {
- const { accept, input, label, type, disabled } = fieldprops;
- const { name } = input;
+ const { accept, input, label, disabled } = fieldprops;
+ const { name, type } = input;
const onChange = e => {
const file = e.target.files[0];
form.change(`addImage`, file);
@@ -185,10 +185,10 @@ export class EditListingPhotosFormComponent extends Component {
{
- const { input, type, meta } = props;
+ const { input, meta } = props;
return (
-
+
);
diff --git a/src/forms/ProfileSettingsForm/ProfileSettingsForm.js b/src/forms/ProfileSettingsForm/ProfileSettingsForm.js
index 6224b96b..69d690dd 100644
--- a/src/forms/ProfileSettingsForm/ProfileSettingsForm.js
+++ b/src/forms/ProfileSettingsForm/ProfileSettingsForm.js
@@ -198,16 +198,8 @@ class ProfileSettingsFormComponent extends Component {
disabled={uploadInProgress}
>
{fieldProps => {
- const {
- accept,
- id,
- input,
- label,
- type,
- disabled,
- uploadImageError,
- } = fieldProps;
- const { name } = input;
+ const { accept, id, input, label, disabled, uploadImageError } = fieldProps;
+ const { name, type } = input;
const onChange = e => {
const file = e.target.files[0];
form.change(`profileImage`, file);