Add field type airDateRange

src/common/components/forms/DemoForm.js

@@ -135,6 +135,14 @@ class DemoForm extends Component {
           displayFormat="YYYY/MM/DD"
           showClearDate
         />
+        <Field
+          label="Airbnb Date Range"
+          name="someAirDateRange"
+          component={FormField}
+          type="airDateRange"
+          displayFormat="YYYY/MM/DD"
+          showClearDates
+        />
         <Field
           label="Select"
           name="someSelect"

src/common/components/utils/AirDateRange.js

@@ -0,0 +1,51 @@
+import React, { Component, PropTypes } from 'react';
+import { DateRangePicker } from 'react-dates';
+
+let defaultValue = {
+  startDate: null,
+  endDate: null,
+};
+
+class AirDateRange extends Component {
+  constructor() {
+    super();
+    this.state = {
+      focusedInput: null,
+    };
+    this.onDatesChange = this._onDatesChange.bind(this);
+    this.onFocusChange = this._onFocusChange.bind(this);
+  }
+
+  _onDatesChange({ startDate, endDate }) {
+    this.props.input.onChange({ startDate, endDate });
+  }
+
+  _onFocusChange(focusedInput) {
+    this.setState({ focusedInput });
+  }
+
+  render() {
+    let {
+      input,
+      ...rest
+    } = this.props;
+    let { focusedInput } = this.state;
+
+    return (
+      <DateRangePicker
+        {...rest}
+        onDatesChange={this.onDatesChange}
+        onFocusChange={this.onFocusChange}
+        focusedInput={focusedInput}
+        startDate={input.value.startDate || defaultValue.startDate}
+        endDate={input.value.endDate || defaultValue.endDate}
+      />
+    );
+  }
+}
+
+AirDateRange.propTypes = {
+  input: PropTypes.object.isRequired,
+};
+
+export default AirDateRange;

src/common/components/utils/BsForm.js

@@ -7,6 +7,7 @@ import HelpBlock from 'react-bootstrap/lib/HelpBlock';
 import Recaptcha from 'react-google-recaptcha';
 import RangeSlider from './RangeSlider.js';
 import AirSingleDate from './AirSingleDate.js';
+import AirDateRange from './AirDateRange.js';
 import configs from '../../../../configs/project/client';
 
 class BsForm extends Component {
@@ -170,6 +171,13 @@ let BsFormField = ({
         input={input}
       />
     );
+  } else if (type === 'airDateRange') {
+    formControl = (
+      <AirDateRange
+        {...rest}
+        input={input}
+      />
+    );
   } else if (type === 'plaintext') {
     formControl = (
       <p>