diff --git a/src/components/InputField/InputField.js b/src/components/InputField/InputField.js
index cb8b9da7..58ec3895 100644
--- a/src/components/InputField/InputField.js
+++ b/src/components/InputField/InputField.js
@@ -19,10 +19,11 @@ class InputField extends Component {
       type,
       label,
       placeholder,
+      autoFocus,
       input,
       meta,
     } = this.props;
-    const inputProps = { ...input, type, placeholder };
+    const inputProps = { ...input, type, placeholder, autoFocus };
     const { pristine, valid, invalid, touched, error } = meta;
 
     // Error message and input error styles are only shown if the
@@ -60,6 +61,7 @@ InputField.defaultProps = {
   clearOnUnmount: false,
   label: null,
   placeholder: null,
+  autoFocus: false,
 };
 
 const { string, shape, bool, func } = PropTypes;
@@ -78,6 +80,7 @@ InputField.propTypes = {
   type: string.isRequired,
   label: string,
   placeholder: string,
+  autoFocus: bool,
 
   // Objects created by redux-form
   input: shape({
diff --git a/src/containers/EditListingDescriptionForm/EditListingDescriptionForm.js b/src/containers/EditListingDescriptionForm/EditListingDescriptionForm.js
index be297643..ba15ffb5 100644
--- a/src/containers/EditListingDescriptionForm/EditListingDescriptionForm.js
+++ b/src/containers/EditListingDescriptionForm/EditListingDescriptionForm.js
@@ -5,7 +5,7 @@ import { intlShape, injectIntl } from 'react-intl';
 import classNames from 'classnames';
 import { enhancedField } from '../../util/forms';
 import { maxLength, required } from '../../util/validators';
-import { Button } from '../../components';
+import { Button, InputField } from '../../components';
 
 import css from './EditListingDescriptionForm.css';
 
@@ -18,7 +18,6 @@ export class EditListingDescriptionFormComponent extends Component {
     // We must create the enhanced components outside the render function
     // to avoid losing focus.
     // See: https://github.com/erikras/redux-form/releases/tag/v6.0.0-alpha.14
-    this.EnhancedInput = enhancedField('input');
     this.EnhancedTextArea = enhancedField('textarea', { rootClassName: css.description });
   }
 
@@ -64,7 +63,7 @@ export class EditListingDescriptionFormComponent extends Component {
           name="title"
           label={titleMessage}
           placeholder={titlePlaceholderMessage}
-          component={this.EnhancedInput}
+          component={InputField}
           type="text"
           validate={[required(titleRequiredMessage), maxLength60Message]}
         />
diff --git a/src/containers/EditListingDescriptionForm/__snapshots__/EditListingDescriptionForm.test.js.snap b/src/containers/EditListingDescriptionForm/__snapshots__/EditListingDescriptionForm.test.js.snap
index 9b10ad4b..23d9be4e 100644
--- a/src/containers/EditListingDescriptionForm/__snapshots__/EditListingDescriptionForm.test.js.snap
+++ b/src/containers/EditListingDescriptionForm/__snapshots__/EditListingDescriptionForm.test.js.snap
@@ -5,7 +5,7 @@ exports[`EditListingDescriptionForm matches snapshot 1`] = `
   <div
     className="">
     <label
-      className=""
+      className={undefined}
       htmlFor="title">
       Name of your sauna
     </label>
diff --git a/src/containers/EditListingLocationForm/EditListingLocationForm.js b/src/containers/EditListingLocationForm/EditListingLocationForm.js
index 85d3b6b8..d4babfe4 100644
--- a/src/containers/EditListingLocationForm/EditListingLocationForm.js
+++ b/src/containers/EditListingLocationForm/EditListingLocationForm.js
@@ -7,7 +7,7 @@ import classNames from 'classnames';
 import * as propTypes from '../../util/propTypes';
 import { enhancedField } from '../../util/forms';
 import { autocompleteSearchRequired, autocompletePlaceSelected } from '../../util/validators';
-import { LocationAutocompleteInput, Button } from '../../components';
+import { LocationAutocompleteInput, Button, InputField } from '../../components';
 
 import css from './EditListingLocationForm.css';
 
@@ -19,7 +19,6 @@ export class EditListingLocationFormComponent extends Component {
     // to avoid losing focus.
     // See: https://github.com/erikras/redux-form/releases/tag/v6.0.0-alpha.14
     this.EnhancedLocationAutocompleteInput = enhancedField(LocationAutocompleteInput);
-    this.EnhancedInput = enhancedField('input', { rootClassName: css.building });
   }
 
   render() {
@@ -63,10 +62,11 @@ export class EditListingLocationFormComponent extends Component {
         />
 
         <Field
+          className={css.building}
           name="building"
           label={buildingMessage}
           placeholder={buildingPlaceholderMessage}
-          component={this.EnhancedInput}
+          component={InputField}
           type="text"
         />
 
diff --git a/src/containers/LoginForm/LoginForm.js b/src/containers/LoginForm/LoginForm.js
index 2e1d8a6f..7ee2fc9b 100644
--- a/src/containers/LoginForm/LoginForm.js
+++ b/src/containers/LoginForm/LoginForm.js
@@ -1,65 +1,58 @@
-import React, { Component, PropTypes } from 'react';
+import React, { PropTypes } from 'react';
 import { compose } from 'redux';
 import { FormattedMessage, injectIntl, intlShape } from 'react-intl';
 import { Field, reduxForm, propTypes as formPropTypes } from 'redux-form';
-import { Button } from '../../components';
+import { InputField, Button } from '../../components';
 import * as validators from '../../util/validators';
-import { enhancedField } from '../../util/forms';
 
 import css from './LoginForm.css';
 
-class LoginFormComponent extends Component {
-  constructor(props) {
-    super(props);
-    this.EnhancedInput = enhancedField('input');
-  }
-  render() {
-    const { handleSubmit, pristine, submitting, inProgress, intl } = this.props;
+const LoginFormComponent = props => {
+  const { handleSubmit, pristine, submitting, inProgress, intl } = props;
 
-    // email
-    const emailLabel = intl.formatMessage({
-      id: 'LoginForm.emailLabel',
-    });
-    const emailRequiredMessage = intl.formatMessage({
-      id: 'LoginForm.emailRequired',
-    });
-    const emailRequired = validators.required(emailRequiredMessage);
+  // email
+  const emailLabel = intl.formatMessage({
+    id: 'LoginForm.emailLabel',
+  });
+  const emailRequiredMessage = intl.formatMessage({
+    id: 'LoginForm.emailRequired',
+  });
+  const emailRequired = validators.required(emailRequiredMessage);
 
-    // password
-    const passwordLabel = intl.formatMessage({
-      id: 'LoginForm.passwordLabel',
-    });
-    const passwordRequiredMessage = intl.formatMessage({
-      id: 'LoginForm.passwordRequired',
-    });
-    const passwordRequired = validators.required(passwordRequiredMessage);
+  // password
+  const passwordLabel = intl.formatMessage({
+    id: 'LoginForm.passwordLabel',
+  });
+  const passwordRequiredMessage = intl.formatMessage({
+    id: 'LoginForm.passwordRequired',
+  });
+  const passwordRequired = validators.required(passwordRequiredMessage);
 
-    const submitDisabled = pristine || submitting || inProgress;
-    return (
-      <form className={css.form} onSubmit={handleSubmit}>
-        <div>
-          <Field
-            name="email"
-            type="email"
-            label={emailLabel}
-            component={this.EnhancedInput}
-            validate={emailRequired}
-          />
-          <Field
-            name="password"
-            type="password"
-            label={passwordLabel}
-            component={this.EnhancedInput}
-            validate={passwordRequired}
-          />
-        </div>
-        <Button className={css.button} type="submit" disabled={submitDisabled}>
-          <FormattedMessage id="LoginForm.logIn" />
-        </Button>
-      </form>
-    );
-  }
-}
+  const submitDisabled = pristine || submitting || inProgress;
+  return (
+    <form className={css.form} onSubmit={handleSubmit}>
+      <div>
+        <Field
+          name="email"
+          type="email"
+          label={emailLabel}
+          component={InputField}
+          validate={emailRequired}
+        />
+        <Field
+          name="password"
+          type="password"
+          label={passwordLabel}
+          component={InputField}
+          validate={passwordRequired}
+        />
+      </div>
+      <Button className={css.button} type="submit" disabled={submitDisabled}>
+        <FormattedMessage id="LoginForm.logIn" />
+      </Button>
+    </form>
+  );
+};
 
 LoginFormComponent.defaultProps = { inProgress: false };
 
diff --git a/src/containers/LoginForm/__snapshots__/LoginForm.test.js.snap b/src/containers/LoginForm/__snapshots__/LoginForm.test.js.snap
index a5b7ab68..25e7d8b5 100644
--- a/src/containers/LoginForm/__snapshots__/LoginForm.test.js.snap
+++ b/src/containers/LoginForm/__snapshots__/LoginForm.test.js.snap
@@ -6,11 +6,12 @@ exports[`LoginForm matches snapshot 1`] = `
     <div
       className="">
       <label
-        className=""
+        className={undefined}
         htmlFor="email">
         Email
       </label>
       <input
+        autoFocus={false}
         className=""
         name="email"
         onBlur={[Function]}
@@ -18,18 +19,19 @@ exports[`LoginForm matches snapshot 1`] = `
         onDragStart={[Function]}
         onDrop={[Function]}
         onFocus={[Function]}
-        placeholder=""
+        placeholder={null}
         type="email"
         value="" />
     </div>
     <div
       className="">
       <label
-        className=""
+        className={undefined}
         htmlFor="password">
         Password
       </label>
       <input
+        autoFocus={false}
         className=""
         name="password"
         onBlur={[Function]}
@@ -37,7 +39,7 @@ exports[`LoginForm matches snapshot 1`] = `
         onDragStart={[Function]}
         onDrop={[Function]}
         onFocus={[Function]}
-        placeholder=""
+        placeholder={null}
         type="password"
         value="" />
     </div>
diff --git a/src/containers/PayoutDetailsForm/PayoutDetailsForm.js b/src/containers/PayoutDetailsForm/PayoutDetailsForm.js
index 52d20d70..466e2dc0 100644
--- a/src/containers/PayoutDetailsForm/PayoutDetailsForm.js
+++ b/src/containers/PayoutDetailsForm/PayoutDetailsForm.js
@@ -5,7 +5,13 @@ import { FormattedMessage, injectIntl, intlShape } from 'react-intl';
 import { Field, reduxForm, formValueSelector, propTypes as formPropTypes } from 'redux-form';
 import classNames from 'classnames';
 import config from '../../config';
-import { Button, StripeBankAccountToken, Select, BirthdayInput } from '../../components';
+import {
+  Button,
+  StripeBankAccountToken,
+  Select,
+  BirthdayInput,
+  InputField,
+} from '../../components';
 import * as validators from '../../util/validators';
 import { enhancedField } from '../../util/forms';
 
@@ -40,7 +46,6 @@ CountriesSelect.propTypes = {
 class PayoutDetailsFormComponent extends Component {
   constructor(props) {
     super(props);
-    this.EnhancedInput = enhancedField('input');
     this.EnhancedCountriesDropdown = enhancedField(CountriesSelect);
     this.EnhancedBirthdayInput = enhancedField(BirthdayInput);
   }
@@ -120,7 +125,7 @@ class PayoutDetailsFormComponent extends Component {
             type="text"
             label={streetAddressLabel}
             placeholder={streetAddressPlaceholder}
-            component={this.EnhancedInput}
+            component={InputField}
             validate={streetAddressRequired}
             clearOnUnmount
           />
@@ -129,7 +134,7 @@ class PayoutDetailsFormComponent extends Component {
             type="text"
             label={postalCodeLabel}
             placeholder={postalCodePlaceholder}
-            component={this.EnhancedInput}
+            component={InputField}
             validate={postalCodeRequired}
             clearOnUnmount
           />
@@ -138,7 +143,7 @@ class PayoutDetailsFormComponent extends Component {
             type="text"
             label={cityLabel}
             placeholder={cityPlaceholder}
-            component={this.EnhancedInput}
+            component={InputField}
             validate={cityRequired}
             clearOnUnmount
           />
@@ -184,14 +189,14 @@ class PayoutDetailsFormComponent extends Component {
           name="firstName"
           type="text"
           label={firstNameLabel}
-          component={this.EnhancedInput}
+          component={InputField}
           validate={firstNameRequired}
         />
         <Field
           name="lastName"
           type="text"
           label={lastNameLabel}
-          component={this.EnhancedInput}
+          component={InputField}
           validate={lastNameRequired}
         />
         <Field
diff --git a/src/containers/SignupForm/SignupForm.js b/src/containers/SignupForm/SignupForm.js
index 0e5d8133..a3b67794 100644
--- a/src/containers/SignupForm/SignupForm.js
+++ b/src/containers/SignupForm/SignupForm.js
@@ -1,107 +1,96 @@
-import React, { Component, PropTypes } from 'react';
+import React, { PropTypes } from 'react';
 import { compose } from 'redux';
 import { FormattedMessage, injectIntl, intlShape } from 'react-intl';
 import { Field, reduxForm, propTypes as formPropTypes } from 'redux-form';
-import { Button } from '../../components';
+import { InputField, Button } from '../../components';
 import * as validators from '../../util/validators';
-import { enhancedField } from '../../util/forms';
 
 import css from './SignupForm.css';
 
-class SignupFormComponent extends Component {
-  constructor(props) {
-    super(props);
-    this.EnhancedInput = enhancedField('input');
-    this.EnhancedFirstNameInput = enhancedField('input', {
-      rootClassName: css.firstNameRoot,
-    });
-    this.EnhancedLastNameInput = enhancedField('input', {
-      rootClassName: css.lastNameRoot,
-    });
-  }
-  render() {
-    const { handleSubmit, pristine, submitting, inProgress, intl } = this.props;
+const SignupFormComponent = props => {
+  const { handleSubmit, pristine, submitting, inProgress, intl } = props;
 
-    // email
-    const emailLabel = intl.formatMessage({
-      id: 'SignupForm.emailLabel',
-    });
-    const emailRequiredMessage = intl.formatMessage({
-      id: 'SignupForm.emailRequired',
-    });
-    const emailRequired = validators.required(emailRequiredMessage);
+  // email
+  const emailLabel = intl.formatMessage({
+    id: 'SignupForm.emailLabel',
+  });
+  const emailRequiredMessage = intl.formatMessage({
+    id: 'SignupForm.emailRequired',
+  });
+  const emailRequired = validators.required(emailRequiredMessage);
 
-    // password
-    const passwordLabel = intl.formatMessage({
-      id: 'SignupForm.passwordLabel',
-    });
-    const passwordRequiredMessage = intl.formatMessage({
-      id: 'SignupForm.passwordRequired',
-    });
-    const passwordRequired = validators.required(passwordRequiredMessage);
+  // password
+  const passwordLabel = intl.formatMessage({
+    id: 'SignupForm.passwordLabel',
+  });
+  const passwordRequiredMessage = intl.formatMessage({
+    id: 'SignupForm.passwordRequired',
+  });
+  const passwordRequired = validators.required(passwordRequiredMessage);
 
-    // firstName
-    const firstNameLabel = intl.formatMessage({
-      id: 'SignupForm.firstNameLabel',
-    });
-    const firstNameRequiredMessage = intl.formatMessage({
-      id: 'SignupForm.firstNameRequired',
-    });
-    const firstNameRequired = validators.required(firstNameRequiredMessage);
+  // firstName
+  const firstNameLabel = intl.formatMessage({
+    id: 'SignupForm.firstNameLabel',
+  });
+  const firstNameRequiredMessage = intl.formatMessage({
+    id: 'SignupForm.firstNameRequired',
+  });
+  const firstNameRequired = validators.required(firstNameRequiredMessage);
 
-    // lastName
-    const lastNameLabel = intl.formatMessage({
-      id: 'SignupForm.lastNameLabel',
-    });
-    const lastNameRequiredMessage = intl.formatMessage({
-      id: 'SignupForm.lastNameRequired',
-    });
-    const lastNameRequired = validators.required(lastNameRequiredMessage);
+  // lastName
+  const lastNameLabel = intl.formatMessage({
+    id: 'SignupForm.lastNameLabel',
+  });
+  const lastNameRequiredMessage = intl.formatMessage({
+    id: 'SignupForm.lastNameRequired',
+  });
+  const lastNameRequired = validators.required(lastNameRequiredMessage);
 
-    const submitDisabled = pristine || submitting || inProgress;
-    return (
-      <form className={css.root} onSubmit={handleSubmit}>
-        <div>
+  const submitDisabled = pristine || submitting || inProgress;
+  return (
+    <form className={css.root} onSubmit={handleSubmit}>
+      <div>
+        <Field
+          name="email"
+          type="email"
+          label={emailLabel}
+          validate={emailRequired}
+          component={InputField}
+        />
+        <div className={css.name}>
           <Field
-            name="email"
-            type="email"
-            label={emailLabel}
-            validate={emailRequired}
-            component={this.EnhancedInput}
+            className={css.firstNameRoot}
+            name="firstName"
+            type="text"
+            label={firstNameLabel}
+            validate={firstNameRequired}
+            component={InputField}
           />
-          <div className={css.name}>
-            <Field
-              name="firstName"
-              type="text"
-              label={firstNameLabel}
-              validate={firstNameRequired}
-              component={this.EnhancedFirstNameInput}
-            />
-            <Field
-              name="lastName"
-              type="text"
-              label={lastNameLabel}
-              validate={lastNameRequired}
-              component={this.EnhancedLastNameInput}
-            />
-          </div>
           <Field
-            name="password"
-            type="password"
-            label={passwordLabel}
-            validate={passwordRequired}
-            component={this.EnhancedInput}
+            className={css.lastNameRoot}
+            name="lastName"
+            type="text"
+            label={lastNameLabel}
+            validate={lastNameRequired}
+            component={InputField}
           />
         </div>
-        <div>
-          <Button className={css.button} type="submit" disabled={submitDisabled}>
-            <FormattedMessage id="SignupForm.signUp" />
-          </Button>
-        </div>
-      </form>
-    );
-  }
-}
+        <Field
+          name="password"
+          type="password"
+          label={passwordLabel}
+          validate={passwordRequired}
+          component={InputField}
+        />
+      </div>
+      <div>
+        <Button className={css.button} type="submit" disabled={submitDisabled}>
+          <FormattedMessage id="SignupForm.signUp" />
+        </Button>
+      </div>
+    </form>
+  );
+};
 
 SignupFormComponent.defaultProps = { inProgress: false };
 
diff --git a/src/containers/SignupForm/__snapshots__/SignupForm.test.js.snap b/src/containers/SignupForm/__snapshots__/SignupForm.test.js.snap
index 42f9f9be..aa2bfcea 100644
--- a/src/containers/SignupForm/__snapshots__/SignupForm.test.js.snap
+++ b/src/containers/SignupForm/__snapshots__/SignupForm.test.js.snap
@@ -6,11 +6,12 @@ exports[`SignupForm matches snapshot 1`] = `
     <div
       className="">
       <label
-        className=""
+        className={undefined}
         htmlFor="email">
         Email
       </label>
       <input
+        autoFocus={false}
         className=""
         name="email"
         onBlur={[Function]}
@@ -18,7 +19,7 @@ exports[`SignupForm matches snapshot 1`] = `
         onDragStart={[Function]}
         onDrop={[Function]}
         onFocus={[Function]}
-        placeholder=""
+        placeholder={null}
         type="email"
         value="" />
     </div>
@@ -27,11 +28,12 @@ exports[`SignupForm matches snapshot 1`] = `
       <div
         className="">
         <label
-          className=""
+          className={undefined}
           htmlFor="firstName">
           First name
         </label>
         <input
+          autoFocus={false}
           className=""
           name="firstName"
           onBlur={[Function]}
@@ -39,18 +41,19 @@ exports[`SignupForm matches snapshot 1`] = `
           onDragStart={[Function]}
           onDrop={[Function]}
           onFocus={[Function]}
-          placeholder=""
+          placeholder={null}
           type="text"
           value="" />
       </div>
       <div
         className="">
         <label
-          className=""
+          className={undefined}
           htmlFor="lastName">
           Last name
         </label>
         <input
+          autoFocus={false}
           className=""
           name="lastName"
           onBlur={[Function]}
@@ -58,7 +61,7 @@ exports[`SignupForm matches snapshot 1`] = `
           onDragStart={[Function]}
           onDrop={[Function]}
           onFocus={[Function]}
-          placeholder=""
+          placeholder={null}
           type="text"
           value="" />
       </div>
@@ -66,11 +69,12 @@ exports[`SignupForm matches snapshot 1`] = `
     <div
       className="">
       <label
-        className=""
+        className={undefined}
         htmlFor="password">
         Password
       </label>
       <input
+        autoFocus={false}
         className=""
         name="password"
         onBlur={[Function]}
@@ -78,7 +82,7 @@ exports[`SignupForm matches snapshot 1`] = `
         onDragStart={[Function]}
         onDrop={[Function]}
         onFocus={[Function]}
-        placeholder=""
+        placeholder={null}
         type="password"
         value="" />
     </div>