Add gulp-eslint

.eslintrc

@@ -22,6 +22,7 @@
       "SwitchCase": 1
     }],
     "key-spacing": 0,
+    "keyword-spacing": [2, {"after": true}],
     "new-cap": [2, {"capIsNew": false, "newIsCap": true}],
     "new-parens": 0,
     "no-bitwise": 0,
@@ -82,12 +83,10 @@
     "radix": 2,
     "semi": 0,
     "semi-spacing": [2, {"before": false, "after": true}],
-    "space-after-keywords": [2, "always"],
     "space-before-blocks": [2, "always"],
     "space-before-function-paren": [2, "never"],
     "space-in-parens": [2, "never"],
     "space-infix-ops": 2,
-    "space-return-throw-case": 2,
     "space-unary-ops": [2, {"words": true, "nonwords": false}],
     "strict": [0, "never"],
     "use-isnan": 2,

circle.yml

@@ -14,6 +14,7 @@ dependencies:
 test:
   override:
     - gulp ava
+    - gulp eslint
     - cd example && gulp:
         background: true
     - sleep 10

example/server.js

@@ -1,16 +1,16 @@
-var webpack = require('webpack');
-var WebpackDevServer = require('webpack-dev-server');
-var config = require('./webpack.config');
+const webpack = require('webpack');
+const WebpackDevServer = require('webpack-dev-server');
+const config = require('./webpack.config');
 
 new WebpackDevServer(webpack(config), {
   publicPath: config.output.publicPath,
   hot: true,
   historyApiFallback: true,
   noInfo: true
-}).listen(8001, 'localhost', function (err, result) {
+}).listen(8001, 'localhost', function(err, result) {
   if (err) {
-    return console.log(err);
+    return console.log(err); // eslint-disable-line
   }
 
-  console.log('Listening at http://localhost:8001/');
+  console.log('Listening at http://localhost:8001/'); // eslint-disable-line
 });

example/webpack.config.js

@@ -1,5 +1,5 @@
-var path = require('path');
-var webpack = require('webpack');
+const path = require('path');
+const webpack = require('webpack');
 
 module.exports = {
   devtool: 'eval',

example_components/MultiField.react.js

@@ -46,11 +46,11 @@ export default class MultiField extends Component {
   getInputValue(key) {
     const {delimiter, fields, value} = this.props;
 
-    if (value === undefined || value === null) return null;
+    if (value === undefined || value === null) return '';
 
     const parts = value.split(delimiter);
 
-    if (parts[key] === undefined) return null;
+    if (parts[key] === undefined) return '';
 
     return parts[key].substr(0, fields[key].length);
   }
@@ -99,7 +99,8 @@ export default class MultiField extends Component {
           this.refs[`field_${key - 1}`].focus();
         }
       }
-    } else if (value.length === maxLength) {
+    }
+    else if (value.length === maxLength) {
       // (unless we are in the last field)
       if (key !== this.props.fields.length - 1) {
         // jump to next box

example_components/PasswordField.react.js

@@ -113,7 +113,7 @@ export default class PasswordField extends Component {
 
   render() {
     const {showPassword} = this.state;
-    const {hidePasswordToggle, name, onChange, placeholder, value, tooltip, error} = this.props;
+    const {hidePasswordToggle, name, onChange, placeholder, value, error} = this.props;
 
     return (
       <div style={[styles.wrapper, styles.errorWrapper.base, error && styles.errorWrapper.hasError]}>
@@ -136,7 +136,6 @@ export default class PasswordField extends Component {
                 error && styles.errorWrapper.errorInput,
                 showPassword && styles.passwordShowed
               ]}
-              tooltip={tooltip}
               type={this.getType()}
               value={value}
             />

example_components/TextField.react.js

@@ -92,7 +92,7 @@ export default class TextField extends Component {
   }
 
   render() {
-    const {fullWidth, icon, inheritedStyle, name, onChange, placeholder, unit, value, type, tooltip, error, onBlur} = this.props;
+    const {fullWidth, icon, inheritedStyle, name, onChange, placeholder, unit, value, type, error, onBlur} = this.props;
     const prependAndUnit = (icon && unit);
     const prependOrUnit = (icon || unit);
 
@@ -118,7 +118,6 @@ export default class TextField extends Component {
               error && styles.errorWrapper.errorInput,
               inheritedStyle
             ]}
-            tooltip={tooltip}
             type={type}
             value={value}
           />

gulpfile.js

@@ -1,5 +1,6 @@
-const gulp = require('gulp')
 const ava = require('gulp-ava')
+const eslint = require('gulp-eslint');
+const gulp = require('gulp')
 const packageJson = require('./package.json')
 const path = require('path')
 
@@ -12,6 +13,13 @@ configureSvgIcon({
   svgDir: path.join(__dirname, 'src', 'icons')
 });
 
+gulp.task('eslint', () => {
+  return gulp.src(['**/*.js', '!node_modules/**'])
+    .pipe(eslint())
+    .pipe(eslint.format())
+    .pipe(eslint.failAfterError());
+});
+
 gulp.task('ava', () =>
   gulp
     .src(packageJson.ava.files)

package.json

@@ -51,9 +51,10 @@
     "babel-preset-react-hmre": ">=1",
     "babel-preset-stage-0": ">=5",
     "babel-register": "^6.6.5",
-    "eslint": "^1.7.1",
+    "eslint": "^2.0.0",
     "eslint-config-airbnb": "^0.1.0",
     "eslint-plugin-react": "^3.5.1",
+    "estraverse-fb": "^1.3.1",
     "expect": "^1.12.2",
     "gulp": "^3.9.1",
     "gulp-ava": "^0.12.1",
@@ -70,6 +71,7 @@
     "color": ">=0.10",
     "fuzzy": ">=0.1",
     "gulp": ">=3",
+    "gulp-eslint": "^3.0.1",
     "immutable": ">=3",
     "nunjucks": ">=2",
     "radium": ">=0.15",

src/app/SearchBox.react.js

@@ -72,7 +72,7 @@ export default class SearchBox extends Component {
             All components
         </div>
       </div>
-     );
+    );
   }
 
   clearText() {

src/app/atoms/Dropdown.react.js

@@ -31,14 +31,14 @@ export default class Dropdown extends Component {
     document.removeEventListener('click', this.handleDocumentClick)
   }
 
-   /* using fat arrow to bind to instance */
-   handleDocumentClick = (evt) => {
-     const area = ReactDOM.findDOMNode(this.refs.dropdown)
+  /* using fat arrow to bind to instance */
+  handleDocumentClick = (evt) => {
+    const area = ReactDOM.findDOMNode(this.refs.dropdown)
 
-     if (!area.contains(evt.target) && this.props.visible && this.props.handleIconClick) {
-       this.props.handleIconClick()
-     }
-   }
+    if (!area.contains(evt.target) && this.props.visible && this.props.handleIconClick) {
+      this.props.handleIconClick()
+    }
+  }
 
   render() {
     const {

src/app/atoms/Error.react.js

@@ -8,7 +8,7 @@ import React, {PropTypes as RPT} from 'react';
 export default class Error extends Component {
 
   static propTypes = {
-    error: RPT.oneOf([RPT.object, RPT.string])
+    error: RPT.any
   }
 
   state = {

src/app/atoms/Input.react.js

@@ -25,11 +25,10 @@ export default class Input extends Component {
   }
 
   render() {
-    const {inheritedStyles, key, kind, onChange, placeholder, type, value} = this.props;
+    const {inheritedStyles, kind, onChange, placeholder, type, value} = this.props;
 
     return (
       <input
-        key={key}
         onChange={onChange}
         placeholder={placeholder}
         style={[