Update eslint config and fix lint errors

.eslintrc.js

@@ -0,0 +1,41 @@
+module.exports = {
+	parserOptions: {
+		ecmaVersion: 6,
+		sourceType: 'module',
+		ecmaFeatures: {
+			experimentalObjectRestSpread: true,
+			jsx: true,
+		},
+	},
+	env: {
+		browser: true,
+		es6: true,
+		node: true,
+	},
+	plugins: ['react'],
+	rules: {
+		'curly': [2, 'multi-line'],
+		'jsx-quotes': 1,
+		'no-shadow': 0,
+		'no-trailing-spaces': 0,
+		'no-underscore-dangle': 0,
+		'no-unused-expressions': 0,
+		'object-curly-spacing': [1, 'always'],
+		'quotes': [2, 'single', 'avoid-escape'],
+		'react/jsx-boolean-value': 1,
+		'react/jsx-no-undef': 1,
+		'react/jsx-uses-react': 1,
+		'react/jsx-uses-vars': 1,
+		'react/jsx-wrap-multilines': 1,
+		'react/no-did-mount-set-state': 1,
+		'react/no-did-update-set-state': 1,
+		'react/no-unknown-property': 1,
+		'react/prop-types': 1,
+		'react/react-in-jsx-scope': 1,
+		'react/self-closing-comp': 1,
+		'react/sort-comp': 1,
+		'react/sort-prop-types': 1,
+		'semi': 2,
+		'strict': 0,
+	},
+};

package.json

@@ -19,7 +19,6 @@
   "devDependencies": {
     "babel-cli": "^6.26.0",
     "babel-core": "^6.26.0",
-    "babel-eslint": "^7.2.3",
     "babel-loader": "^7.1.1",
     "babel-plugin-external-helpers": "^6.22.0",
     "babel-plugin-istanbul": "^4.1.4",
@@ -33,6 +32,7 @@
     "cross-env": "^5.0.5",
     "css-loader": "^0.28.7",
     "eslint": "^4.6.1",
+    "eslint-plugin-react": "^7.3.0",
     "extract-text-webpack-plugin": "^3.0.0",
     "html-loader": "^0.5.1",
     "html-webpack-plugin": "^2.30.1",

src/Async.js

@@ -8,27 +8,27 @@ const propTypes = {
 	children: PropTypes.func.isRequired,       // Child function responsible for creating the inner Select component; (props: Object): PropTypes.element
 	ignoreAccents: PropTypes.bool,             // strip diacritics when filtering; defaults to true
 	ignoreCase: PropTypes.bool,                // perform case-insensitive filtering; defaults to true
+	loadOptions: PropTypes.func.isRequired,    // callback to load options asynchronously; (inputValue: string, callback: Function): ?Promise
 	loadingPlaceholder: PropTypes.oneOfType([  // replaces the placeholder while options are loading
 		PropTypes.string,
 		PropTypes.node
 	]),
-	loadOptions: PropTypes.func.isRequired,    // callback to load options asynchronously; (inputValue: string, callback: Function): ?Promise
 	multi: PropTypes.bool,                     // multi-value input
-	options: PropTypes.array.isRequired,             // array of options
-	placeholder: PropTypes.oneOfType([         // field placeholder, displayed when there's no value (shared with Select)
+	noResultsText: PropTypes.oneOfType([       // field noResultsText, displayed when no options come back from the server
 		PropTypes.string,
 		PropTypes.node
 	]),
-	noResultsText: PropTypes.oneOfType([       // field noResultsText, displayed when no options come back from the server
+	onChange: PropTypes.func,                  // onChange handler: function (newValue) {}
+	onInputChange: PropTypes.func,             // optional for keeping track of what is being typed
+	options: PropTypes.array.isRequired,       // array of options
+	placeholder: PropTypes.oneOfType([         // field placeholder, displayed when there's no value (shared with Select)
 		PropTypes.string,
 		PropTypes.node
 	]),
-	onChange: PropTypes.func,                  // onChange handler: function (newValue) {}
 	searchPromptText: PropTypes.oneOfType([    // label to prompt for search input
 		PropTypes.string,
 		PropTypes.node
 	]),
-	onInputChange: PropTypes.func,             // optional for keeping track of what is being typed
 	value: PropTypes.any,                      // initial field value
 };
 

src/Select.js

@@ -1046,10 +1046,10 @@ class Select extends React.Component {
 };
 
 Select.propTypes = {
-    addLabelText: PropTypes.string,       // placeholder displayed when you want to add a label on a multi-value input
     'aria-describedby': PropTypes.string, // HTML ID(s) of element(s) that should be used to describe this input (for assistive tech)
     'aria-label': PropTypes.string,       // Aria label (for assistive tech)
     'aria-labelledby': PropTypes.string,  // HTML ID of an element that should be used as the label (for assistive tech)
+		addLabelText: PropTypes.string,       // placeholder displayed when you want to add a label on a multi-value input
     arrowRenderer: PropTypes.func,        // Create drop-down caret element
     autoBlur: PropTypes.bool,             // automatically blur the component when an option is selected
     autofocus: PropTypes.bool,            // autofocus the component on mount

src/utils/defaultArrowRenderer.js

@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 
 export default function arrowRenderer ({ onMouseDown }) {
 	return (
@@ -8,3 +9,7 @@ export default function arrowRenderer ({ onMouseDown }) {
 		/>
 	);
 };
+
+arrowRenderer.propTypes = {
+	onMouseDown: PropTypes.func,
+};