FIX linting

.eslintignore

@@ -2,3 +2,5 @@ dist
 build
 coverage
 node_modules
+**/example/**
+**/demo/**

.eslintrc.js

@@ -32,9 +32,10 @@ module.exports = {
       singleQuote: true,
     }],
     quotes: ['warn', 'single'],
+    'class-methods-use-this': ignore,
     'arrow-parens': ['warn', 'as-needed'],
     'space-before-function-paren': ignore,
-    'import/no-extraneous-dependencies': [error, { devDependencies: true }],
+    'import/no-extraneous-dependencies': [error, { devDependencies: true, peerDependencies: true }],
     'import/prefer-default-export': ignore,
     'react/jsx-uses-react': error,
     'react/jsx-uses-vars': error,

packages/addon-graphql/.storybook/config.js

@@ -1,2 +1,3 @@
 import * as storybook from '@kadira/storybook';
+
 storybook.configure(() => require('./stories'), module);

packages/addon-graphql/package.json

@@ -35,6 +35,7 @@
     "react": "*"
   },
   "dependencies": {
+    "global": "^4.3.1",
     "graphiql": "^0.7.8",
     "graphql": "^0.7.0"
   }

packages/addon-graphql/src/preview.js

@@ -1,15 +1,16 @@
+import { fetch } from 'global';
 import React from 'react';
 import GraphiQL from 'graphiql';
-import FullScreen from './components/FullScreen';
 import 'graphiql/graphiql.css';
+import FullScreen from './components/FullScreen';
 
 const FETCH_OPTIONS = {
   method: 'post',
   headers: { 'Content-Type': 'application/json' },
 };
 
 function getDefautlFetcher(url) {
-  return function(params) {
+  return params => {
     const body = JSON.stringify(params);
     const options = Object.assign({ body }, FETCH_OPTIONS);
     return fetch(url, options).then(res => res.json());
@@ -23,7 +24,7 @@ function reIndentQuery(query) {
 }
 
 export function setupGraphiQL(config) {
-  return function(_query, variables = '{}') {
+  return (_query, variables = '{}') => {
     const query = reIndentQuery(_query);
     const fetcher = config.fetcher || getDefautlFetcher(config.url);
     return () => (

packages/addon-info/package.json

@@ -34,6 +34,7 @@
   },
   "dependencies": {
     "babel-runtime": "^6.5.0",
+    "global": "^4.3.1",
     "markdown-to-react-components": "^0.2.1",
     "prop-types": "^15.5.7",
     "react-addons-create-fragment": "^15.5.3"

packages/addon-info/src/components/Node.js

@@ -8,13 +8,42 @@ const stylesheet = {
   },
 };
 
+function getData(element) {
+  const data = {
+    name: null,
+    text: null,
+    children: null,
+  };
+
+  if (typeof element === 'string') {
+    data.text = element;
+    return data;
+  }
+
+  if (typeof element === 'number') {
+    data.text = String.toString(element);
+    return data;
+  }
+
+  data.children = element.props.children;
+  const type = element.type;
+
+  if (typeof type === 'string') {
+    data.name = type;
+  } else {
+    data.name = type.displayName || type.name || 'Unknown';
+  }
+
+  return data;
+}
+
 export default class Node extends React.Component {
   render() {
     const { node, depth } = this.props;
     const { tagStyle, containerStyle } = stylesheet;
 
     const leftPad = {
-      paddingLeft: 3 + (depth + 1) * 15,
+      paddingLeft: 3 + ((depth + 1) * 15), // eslint-disable-line
       paddingRight: 3,
     };
 
@@ -63,32 +92,3 @@ export default class Node extends React.Component {
     );
   }
 }
-
-function getData(element) {
-  const data = {
-    name: null,
-    text: null,
-    children: null,
-  };
-
-  if (typeof element == 'string') {
-    data.text = element;
-    return data;
-  }
-
-  if (typeof element === 'number') {
-    data.text = String.toString(element);
-    return data;
-  }
-
-  data.children = element.props.children;
-  const type = element.type;
-
-  if (typeof type === 'string') {
-    data.name = type;
-  } else {
-    data.name = type.displayName || type.name || 'Unknown';
-  }
-
-  return data;
-}

packages/addon-info/src/components/PropTable.js

@@ -3,9 +3,9 @@ import React from 'react';
 import PropVal from './PropVal';
 
 const PropTypesMap = new Map();
-for (const typeName in PropTypes) {
-  if (!PropTypes.hasOwnProperty(typeName)) {
-    continue;
+for (const typeName in PropTypes) { // eslint-disable-line
+  if (!PropTypes.hasOwnProperty(typeName)) { // eslint-disable-line
+    continue; // eslint-disable-line
   }
   const type = PropTypes[typeName];
   PropTypesMap.set(type, typeName);
@@ -31,9 +31,9 @@ export default class PropTable extends React.Component {
     const props = {};
 
     if (type.propTypes) {
-      for (const property in type.propTypes) {
-        if (!type.propTypes.hasOwnProperty(property)) {
-          continue;
+      for (const property in type.propTypes) { // eslint-disable-line
+        if (!type.propTypes.hasOwnProperty(property)) { // eslint-disable-line
+          continue; // eslint-disable-line
         }
         const typeInfo = type.propTypes[property];
         const propType = PropTypesMap.get(typeInfo) || 'other';
@@ -43,13 +43,13 @@ export default class PropTable extends React.Component {
     }
 
     if (type.defaultProps) {
-      for (const property in type.defaultProps) {
-        if (!type.defaultProps.hasOwnProperty(property)) {
-          continue;
+      for (const property in type.defaultProps) { // eslint-disable-line
+        if (!type.defaultProps.hasOwnProperty(property)) { // eslint-disable-line
+          continue; // eslint-disable-line
         }
         const value = type.defaultProps[property];
         if (value === undefined) {
-          continue;
+          continue; // eslint-disable-line
         }
         if (!props[property]) {
           props[property] = { property };

packages/addon-info/src/components/PropVal.js

@@ -82,7 +82,7 @@ function previewProp(val) {
     content = <span style={valueStyles.number}>{val}</span>;
   } else if (typeof val === 'string') {
     if (val.length > 50) {
-      val = `${val.slice(0, 50)}…`;
+      val = `${val.slice(0, 50)}…`; // eslint-disable-line
     }
     content = <span style={valueStyles.string}>"{val}"</span>;
     braceWrap = false;

packages/addon-info/src/components/Props.js

@@ -15,13 +15,13 @@ export default class Props extends React.Component {
       return <span />;
     }
 
-    const { propStyle, propValueStyle, propNameStyle } = stylesheet;
+    const { propValueStyle, propNameStyle } = stylesheet;
 
     const names = Object.keys(props).filter(
       name =>
         name[0] !== '_' &&
         name !== 'children' &&
-        (!defaultProps || props[name] != defaultProps[name]),
+        (!defaultProps || props[name] !== defaultProps[name]),
     );
 
     const breakIntoNewLines = names.length > 3;

packages/addon-info/src/components/Story.js

@@ -1,3 +1,5 @@
+/* eslint no-underscore-dangle: 0 */
+
 import PropTypes from 'prop-types';
 import React from 'react';
 import MTRC from 'markdown-to-react-components';
@@ -293,8 +295,6 @@ export default class Story extends React.Component {
         {propTables}
       </div>
     );
-
-    return;
   }
 
   render() {

packages/addon-info/src/components/markdown/code.js

@@ -1,3 +1,4 @@
+import { Prism } from 'global';
 import React from 'react';
 
 export class Code extends React.Component {

packages/addon-info/src/index.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import _Story from './components/Story';
 import { H1, H2, H3, H4, H5, H6, Code, P, UL, A, LI } from './components/markdown';
+
 export const Story = _Story;
 
 const defaultOptions = {
@@ -28,9 +29,9 @@ export default {
   addWithInfo(storyName, info, storyFn, _options) {
     if (typeof storyFn !== 'function') {
       if (typeof info === 'function') {
-        _options = storyFn;
-        storyFn = info;
-        info = '';
+        _options = storyFn; // eslint-disable-line
+        storyFn = info; // eslint-disable-line
+        info = ''; // eslint-disable-line
       } else {
         throw new Error('No story defining function has been specified');
       }

packages/addon-knobs/package.json

@@ -15,6 +15,7 @@
   },
   "devDependencies": {
     "@kadira/storybook": "*",
+    "@kadira/storybook-addons": "*",
     "@types/node": "^7.0.12",
     "@types/react": "^15.0.21",
     "babel-cli": "^6.24.1",
@@ -26,6 +27,7 @@
     "babel-preset-es2015": "^6.24.1",
     "babel-preset-react": "^6.24.1",
     "babel-preset-stage-2": "^6.24.1",
+    "enzyme": "^2.8.2",
     "git-url-parse": "^6.2.2",
     "raw-loader": "^0.5.1",
     "react": "^15.5.4",
@@ -35,13 +37,14 @@
     "typescript-definition-tester": "^0.0.5"
   },
   "peerDependencies": {
-    "@kadira/storybook-addons": "*",
     "react": "*",
     "react-dom": "*"
   },
   "dependencies": {
+    "@kadira/storybook-addons": "*",
     "babel-runtime": "^6.23.0",
     "deep-equal": "^1.0.1",
+    "global": "^4.3.1",
     "insert-css": "^1.0.0",
     "moment": "^2.18.1",
     "prop-types": "^15.5.8",

packages/addon-knobs/src/KnobManager.js

@@ -1,7 +1,9 @@
+/* eslint no-underscore-dangle: 0 */
+
 import React from 'react';
+import deepEqual from 'deep-equal';
 import WrapStory from './components/WrapStory';
 import KnobStore from './KnobStore';
-import deepEqual from 'deep-equal';
 
 // This is used by _mayCallChannel to determine how long to wait to before triggering a panel update
 const PANEL_UPDATE_INTERVAL = 400;
@@ -41,7 +43,7 @@ export default class KnobManager {
     let knobStore = this.knobStoreMap[key];
 
     if (!knobStore) {
-      knobStore = this.knobStoreMap[key] = new KnobStore();
+      knobStore = this.knobStoreMap[key] = new KnobStore(); // eslint-disable-line
     }
 
     this.knobStore = knobStore;

packages/addon-knobs/src/components/PropField.js

@@ -1,3 +1,5 @@
+/* eslint no-underscore-dangle: 0 */
+
 import PropTypes from 'prop-types';
 import React from 'react';
 import TypeMap from './types';

packages/addon-knobs/src/components/PropForm.js

@@ -1,3 +1,5 @@
+/* eslint no-underscore-dangle: 0 */
+
 import PropTypes from 'prop-types';
 import React from 'react';
 

packages/addon-knobs/src/components/WrapStory.js

@@ -1,3 +1,5 @@
+/* eslint no-underscore-dangle: 0 */
+
 import PropTypes from 'prop-types';
 import React from 'react';
 

packages/addon-knobs/src/components/types/Array.js

@@ -36,12 +36,7 @@ ArrayType.propTypes = {
   onChange: PropTypes.func,
 };
 
-ArrayType.serialize = function(value) {
-  return value;
-};
-
-ArrayType.deserialize = function(value) {
-  return value;
-};
+ArrayType.serialize = value => value;
+ArrayType.deserialize = value => value;
 
 export default ArrayType;

packages/addon-knobs/src/components/types/Boolean.js

@@ -34,13 +34,7 @@ BooleanType.propTypes = {
   onChange: PropTypes.func,
 };
 
-BooleanType.serialize = function(value) {
-  return String(value);
-};
-
-BooleanType.deserialize = function(value) {
-  if (!value) return false;
-  return value.trim() === 'true';
-};
+BooleanType.serialize = value => String(value);
+BooleanType.deserialize = value => (typeof value === 'string' ? value.match('true') : false);
 
 export default BooleanType;

packages/addon-knobs/src/components/types/Color.js

@@ -1,3 +1,4 @@
+import { document } from 'global';
 import PropTypes from 'prop-types';
 import React from 'react';
 import { SketchPicker } from 'react-color';
@@ -90,12 +91,7 @@ ColorType.propTypes = {
   onChange: PropTypes.func,
 };
 
-ColorType.serialize = function(value) {
-  return value;
-};
-
-ColorType.deserialize = function(value) {
-  return value;
-};
+ColorType.serialize = value => value;
+ColorType.deserialize = value => value;
 
 export default ColorType;

packages/addon-knobs/src/components/types/Date/index.js

@@ -42,12 +42,7 @@ DateType.propTypes = {
   onChange: PropTypes.func,
 };
 
-DateType.serialize = function(value) {
-  return String(value);
-};
-
-DateType.deserialize = function(value) {
-  return parseFloat(value);
-};
+DateType.serialize = value => String(value);
+DateType.deserialize = value => parseFloat(value);
 
 export default DateType;