Added Prettier. Updated Flow. Fixed some FlowTypes. Cleaned up unnecessary dependencies.

Author: bvaughn

.flowconfig

@@ -8,3 +8,6 @@ node_modules/.*
 [options]
 
 [lints]
+
+[version]
+^0.57.3

.prettierrc

@@ -0,0 +1,8 @@
+{
+  "bracketSpacing": false,
+  "jsxBracketSameLine": true,
+  "parser": "flow",
+  "printWidth": 80,
+  "singleQuote": true,
+  "trailingComma": "all"
+}

package.json

@@ -17,12 +17,15 @@
     "clean:umd": "rimraf dist/umd",
     "flow": "flow check src",
     "lint": "eslint 'src/**/*.js'",
+    "prettier": "prettier --config .prettierrc --write \"src/**/*.js\"",
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "author": "Brian Vaughn <brian.david.vaughn@gmail.com>",
   "license": "MIT",
   "devDependencies": {
     "babel-cli": "^6.24.1",
+    "babel-core": "^6.25.0",
+    "babel-loader": "^7.1.1",
     "babel-plugin-flow-react-proptypes": "^3.4.2",
     "babel-plugin-transform-react-remove-prop-types": "^0.4.6",
     "babel-plugin-transform-runtime": "^6.23.0",
@@ -31,16 +34,13 @@
     "babel-preset-es2015-rollup": "^3.0.0",
     "babel-preset-react": "^6.24.1",
     "babel-preset-stage-1": "^6.24.1",
+    "babel-runtime": "^6.23.0",
     "cross-env": "^5.0.1",
     "eslint": "^4.2.0",
-    "flow-cli": "^0.0.0-pre",
-    "rimraf": "^2.6.1"
-  },
-  "dependencies": {
-    "babel-core": "^6.25.0",
-    "babel-loader": "^7.1.1",
-    "babel-runtime": "^6.23.0",
+    "flow-bin": "^0.57.3",
+    "prettier": "^1.7.4",
     "prop-types": "^15.5.10",
+    "rimraf": "^2.6.1",
     "webpack": "^3.3.0"
   },
   "peerDependencies": {

src/ErrorBoundary.js

@@ -1,11 +1,13 @@
 /** @flow */
 
-import React, { Component } from 'react';
+import React, {Component} from 'react';
 import ErrorBoundaryFallbackComponent from './ErrorBoundaryFallbackComponent';
 
+import type {ComponentType} from 'react';
+
 type Props = {
   children?: any,
-  FallbackComponent: any,
+  FallbackComponent: ComponentType<any>,
   onError?: (error: Error, componentStack: string) => void,
 };
 
@@ -19,25 +21,16 @@ type State = {
 };
 
 class ErrorBoundary extends Component<Props, State> {
-  props: Props;
-  state: State;
-
-  setState: Function
-
   static defaultProps = {
     FallbackComponent: ErrorBoundaryFallbackComponent,
   };
 
-  constructor(props: Props, context: any) {
-    super(props, context);
-
-    this.state = {
-      error: null,
-      info: null,
-    };
-  }
+  state = {
+    error: null,
+    info: null,
+  };
 
-  componentDidCatch(error: Error, info: ErrorInfo):void {
+  componentDidCatch(error: Error, info: ErrorInfo): void {
     const {onError} = this.props;
 
     if (typeof onError === 'function') {
@@ -55,24 +48,25 @@ class ErrorBoundary extends Component<Props, State> {
 
     if (error !== null) {
       return (
-        <FallbackComponent componentStack={info ? info.componentStack : ''} error={error} />
+        <FallbackComponent
+          componentStack={info ? info.componentStack : ''}
+          error={error}
+        />
       );
     }
 
     return children;
   }
 }
 
-
-export const withErrorBoundary: Function = (
-    Component: Class<React.Component<*>>,
-    FallbackComponent: Class<React.Component<*>>,
-    onError: Function
+export const withErrorBoundary = (
+  Component: ComponentType<any>,
+  FallbackComponent: ComponentType<any>,
+  onError: Function,
 ): Function => props => (
-        <ErrorBoundary FallbackComponent={FallbackComponent} onError={onError}>
-            <Component {...props} />
-        </ErrorBoundary>
-    );
-
+  <ErrorBoundary FallbackComponent={FallbackComponent} onError={onError}>
+    <Component {...props} />
+  </ErrorBoundary>
+);
 
 export default ErrorBoundary;

src/ErrorBoundaryFallbackComponent.js

@@ -11,16 +11,18 @@ const toTitle = (error: Error, componentStack: string): string => {
   return `${error.toString()}\n\nThis is located at:${componentStack}`;
 };
 
-const ErrorBoundaryFallbackComponent = ({ componentStack, error }: Props) => (
+const ErrorBoundaryFallbackComponent = ({componentStack, error}: Props) => (
   <div style={style} title={toTitle(error, componentStack)}>
     <svg style={svgStyle} viewBox="0 0 24 24" preserveAspectRatio="xMidYMid">
-      <path d={`M20,12A8,8 0 0,0 12,4A8,8 0 0,0 4,12A8,8 0 0,0 12,20A8,8 0 0,0 20,
+      <path
+        d={`M20,12A8,8 0 0,0 12,4A8,8 0 0,0 4,12A8,8 0 0,0 12,20A8,8 0 0,0 20,
         12M22,12A10,10 0 0,1 12,22A10,10 0 0,1 2,12A10,10 0 0,1 12,2A10,10 0 0,1 22,
         12M15.5,8C16.3,8 17,8.7 17,9.5C17,10.3 16.3,11 15.5,11C14.7,11 14,10.3 14,
         9.5C14,8.7 14.7,8 15.5,8M10,9.5C10,10.3 9.3,11 8.5,11C7.7,11 7,10.3 7,9.5C7,
         8.7 7.7,8 8.5,8C9.3,8 10,8.7 10,9.5M12,14C13.75,14 15.29,14.72 16.19,
         15.81L14.77,17.23C14.32,16.5 13.25,16 12,16C10.75,16 9.68,16.5 9.23,
-        17.23L7.81,15.81C8.71,14.72 10.25,14 12,14Z`} />
+        17.23L7.81,15.81C8.71,14.72 10.25,14 12,14Z`}
+      />
     </svg>
   </div>
 );
@@ -45,4 +47,4 @@ const svgStyle = {
   flex: '1 1 auto',
 };
 
-export default ErrorBoundaryFallbackComponent;
+export default ErrorBoundaryFallbackComponent;

src/index.js

@@ -1,7 +1,7 @@
 /** @flow */
 
 import ErrorBoundaryFallbackComponent from './ErrorBoundaryFallbackComponent';
-import ErrorBoundary, { withErrorBoundary } from './ErrorBoundary';
+import ErrorBoundary, {withErrorBoundary} from './ErrorBoundary';
 
 export default ErrorBoundary;
 export {ErrorBoundary, withErrorBoundary, ErrorBoundaryFallbackComponent};