Style/lint components (#213)

* style: Lint Map Component

* style: Lint TimePicker component

* style: Lint Utilities folder

* style: Lint rest of src

.eslintrc

@@ -103,7 +103,7 @@
     "no-octal-escape": 2,
     "no-octal": 2,
     "no-param-reassign": 0,
-    "no-process-env": 2,
+    "no-process-env": 0,
     "no-proto": 2,
     "no-redeclare": 2,
     "no-return-assign": 2,
@@ -293,7 +293,7 @@
       "always"
     ],
     "space-before-function-paren": [
-      2,
+      0,
       "never"
     ],
     "space-in-parens": [

src/Accordion.js

@@ -6,6 +6,7 @@ import {omit} from 'lodash'
 // Converts string or array of strings to string-to-bool object mapping
 // "one" -> {one: true}
 // ["one", "two"] -> {one: true, two: true}
+/* eslint complexity: [2, 4] */
 function activeToObject(active) {
   let obj = {}
 
@@ -37,7 +38,7 @@ class AccordionItem extends Component {
     className: PropTypes.string,
     children: PropTypes.node,
   }
-
+  /* eslint complexity: [2, 5] */
   render() {
     const {
       children,

src/BrowserSupportWarning.js

@@ -10,7 +10,7 @@ export default class BrowserSupportWarning extends Component {
     className: PropTypes.string,
     children: PropTypes.node,
   }
-
+  /* eslint complexity: [2, 5] */
   checkIsSupported = () => {
     const {minVersions} = this.props
     const userAgent =

src/Button.js

@@ -29,7 +29,7 @@ export default class Button extends Component {
     className: PropTypes.string,
     children: PropTypes.node,
   }
-
+  /* eslint complexity: [2, 4] */
   render() {
     // Extract props that will not pass through.
     const {className, children, tag, icon, ...props} = this.props

src/Checkbox.js

@@ -94,7 +94,7 @@ class CheckboxFieldset extends Component {
 
     valueArray.forEach((val) => (valueLookup[val] = true))
     defaultValueArray.forEach((val) => (defaultValueLookup[val] = true))
-
+    /* eslint complexity: [2, 4] */
     const checkboxes = options.map((option) => {
       const props = {
         name,

src/Form.js

@@ -18,7 +18,7 @@ export default class Form extends Component {
     methodOverrideInputName: '_method',
     method: 'post',
   }
-
+  /* eslint complexity: [2, 4] */
   render() {
     const {
       className,

src/Loader.js

@@ -1,7 +1,8 @@
-import React, { Component } from 'react'
+import React, {Component} from 'react'
 import PropTypes from 'prop-types'
-import { omit, defaultTo, gt, has, reduce, without } from 'lodash'
+import {omit, gt, has, reduce, without} from 'lodash'
 
+/* eslint-disable no-unused-vars */
 const PROP_TYPES = {
   borderWidth: PropTypes.string,
   children: PropTypes.element,
@@ -12,7 +13,7 @@ const PROP_TYPES = {
   medium: PropTypes.bool,
   secondaryColor: PropTypes.string,
   size: PropTypes.string,
-  small: PropTypes.bool
+  small: PropTypes.bool,
 }
 
 /*

src/Map/InfoWindow.js

@@ -2,6 +2,7 @@ import {Component} from 'react'
 import PropTypes from 'prop-types'
 
 export default class InfoWindow extends Component {
+  /* eslint complexity: [2, 5] */
   componentDidUpdate(prevProps) {
     const {visible, marker, map} = this.props
 

src/Map/MapComponent.js

@@ -52,7 +52,10 @@ export default class MapComponent extends Component {
 
   initMap = async () => {
     // this is added for the examples pruposes
-    const apiKey = typeof this.props.apiKey === 'string' ? this.props.apiKey : process.env.GATSBY_apiKey
+    const apiKey =
+      typeof this.props.apiKey === 'string'
+        ? this.props.apiKey
+        : process.env.GATSBY_apiKey
 
     await loadJS(`https://maps.googleapis.com/maps/api/js?key=${apiKey}`)
     this.loadMap()
@@ -154,7 +157,7 @@ export default class MapComponent extends Component {
       })
     })
   }
-
+  /* eslint complexity: [2, 4] */
   render() {
     return (
       <div>

src/Map/MapComponent.test.js

@@ -1,9 +1,10 @@
+import React from 'react'
 import MapComponent from './MapComponent'
 import {MAP_API_KEY} from './Utilities/config'
 
 describe('MapComponent', () => {
   it('should render a map with the appropriate design', () => {
-    const wrapper = shallow(
+    shallow(
       <MapComponent
         apiKey={MAP_API_KEY}
         small

src/Pagination.js

@@ -59,7 +59,7 @@ export default class Pagination extends Component {
     href: () => '#',
     showFirstLast: true,
   }
-
+  /* eslint complexity: [2, 4] */
   getAttributes() {
     const {currentPage, totalPages, maxViewPages} = this.props
     const attributes = {beginArrows: false, endArrows: false}
@@ -90,7 +90,7 @@ export default class Pagination extends Component {
 
     return attributes
   }
-
+  /* eslint complexity: [2, 7] */
   getArrowClass(relevant, samePage) {
     const {hideArrows} = this.props
 

src/Radio.js

@@ -63,7 +63,7 @@ class RadioFieldset extends Component {
 
     const isControlled = !!value
     const hasDefault = !!defaultValue
-
+    /* eslint complexity: [2, 4] */
     const radios = options.map((option) => {
       const props = {
         name,

src/Sticky.js

@@ -1,6 +1,7 @@
-import React, {cloneElement, Component, Children} from 'react'
+import React, {Component} from 'react'
+import PropTypes from 'prop-types'
 import classNames from 'classnames'
-
+/* eslint complexity: [2, 4] */
 const StickyContent = ({
   children,
   className,
@@ -10,13 +11,14 @@ const StickyContent = ({
   setRef,
   ...props
 }) => {
+  /* eslint-disable no-nested-ternary */
   const stickyClass = isStuck
-                        ? stickToBottom
-                          ? 'rev-Sticky-content--stuck-bottom'
-                          : 'rev-Sticky-content--stuck-top'
-                        : isAnchored
-                          ? 'rev-Sticky-content--anchored'
-                          : ''
+    ? stickToBottom
+      ? 'rev-Sticky-content--stuck-bottom'
+      : 'rev-Sticky-content--stuck-top'
+    : isAnchored
+      ? 'rev-Sticky-content--anchored'
+      : ''
   const itemClassName = classNames(className, 'rev-Sticky-content', stickyClass)
 
   return (
@@ -26,7 +28,27 @@ const StickyContent = ({
   )
 }
 
+StickyContent.propTypes = {
+  children: PropTypes.node,
+  className: PropTypes.string,
+  isStuck: PropTypes.bool,
+  isAnchored: PropTypes.bool,
+  stickToBottom: PropTypes.bool,
+  setRef: PropTypes.func,
+}
+
 class Sticky extends Component {
+  static propTypes = {
+    className: PropTypes.string,
+    children: PropTypes.node,
+    contentClassName: PropTypes.string,
+    isStuck: PropTypes.bool,
+    isAnchored: PropTypes.bool,
+    stickToBottom: PropTypes.bool,
+    setRef: PropTypes.func,
+    setContentRef: PropTypes.func,
+  }
+
   render() {
     const {
       children,
@@ -59,23 +81,30 @@ class Sticky extends Component {
 }
 
 class StatefulSticky extends Component {
+  static propTypes = {
+    isOpen: PropTypes.bool,
+    onBackgroundClick: PropTypes.func,
+    className: PropTypes.string,
+    children: PropTypes.node,
+    stickToBottom: PropTypes.bool,
+    offset: PropTypes.bool,
+  }
+
   constructor(props) {
     super(props)
     this.state = {
       isStuck: false,
-      isAnchored: false
+      isAnchored: false,
     }
   }
 
-  setContainerRef(container) {
-    this.stickyContainer = container
-  }
-
-  setContentRef(content) {
-    this.stickyContent = content
+  componentDidMount() {
+    window.addEventListener('scroll', this.setContentState.bind(this))
   }
 
+  /* eslint complexity: [2, 8] */
   setContentState() {
+    /* eslint-disable no-unused-vars */
     const contentTop = this.stickyContent.getBoundingClientRect().top
     const contentBottom = this.stickyContent.getBoundingClientRect().bottom
 
@@ -86,63 +115,66 @@ class StatefulSticky extends Component {
 
     if (this.props.stickToBottom) {
       stickyStart = this.props.offset
-                  ? containerBottom - this.parsePxValue(this.props.offset)
-                                    - window.innerHeight
-                  : containerBottom - window.innerHeight
-      stickyStop = containerTop + this.stickyContent.offsetHeight - window.innerHeight
+        ? containerBottom -
+          this.parsePxValue(this.props.offset) -
+          window.innerHeight
+        : containerBottom - window.innerHeight
+      stickyStop =
+        containerTop + this.stickyContent.offsetHeight - window.innerHeight
       stickyFlag = stickyStart >= 0 && stickyStop <= 0
       anchorFlag = stickyStart <= 0
     } else {
       stickyStart = this.props.offset
-                              ? containerTop + this.parsePxValue(this.props.offset)
-                              : containerTop
+        ? containerTop + this.parsePxValue(this.props.offset)
+        : containerTop
       stickyStop = containerBottom - this.stickyContent.offsetHeight
-      stickyFlag = stickyStart <= 0  && stickyStop >= 0
+      stickyFlag = stickyStart <= 0 && stickyStop >= 0
       anchorFlag = stickyStop <= 0
     }
 
     if (stickyFlag) {
-      const sideBorders = this.parsePxValue(this.stickyContainer.style.borderRightWidth)
-                        + this.parsePxValue(this.stickyContainer.style.borderLeftWidth)
+      const sideBorders =
+        this.parsePxValue(this.stickyContainer.style.borderRightWidth) +
+        this.parsePxValue(this.stickyContainer.style.borderLeftWidth)
 
       // this is to force the fixed div holding the sticky content
       // to not break out of the sticky container since fixed
       // positioning breaks elements out of document flow
-      this.stickyContent.style.width = (this.stickyContainer.offsetWidth - sideBorders).toString() + 'px'
+      this.stickyContent.style.width = `${(
+        this.stickyContainer.offsetWidth - sideBorders
+      ).toString()}px`
 
       this.setState({
         isStuck: true,
-        isAnchored: false
+        isAnchored: false,
       })
     } else if (anchorFlag) {
       this.setState({
         isStuck: false,
-        isAnchored: true
+        isAnchored: true,
       })
     } else {
       this.setState({
         isStuck: false,
-        isAnchored: false
+        isAnchored: false,
       })
     }
   }
 
-  componentDidMount() {
-    window.addEventListener('scroll', this.setContentState.bind(this))
+  parsePxValue(value) {
+    return parseInt(value.replace('px', ''), 10)
   }
 
-  parsePxValue(value) {
-    return parseInt(value.replace('px', ''))
+  setContainerRef(container) {
+    this.stickyContainer = container
+  }
+
+  setContentRef(content) {
+    this.stickyContent = content
   }
 
   render() {
-    const {
-      children,
-      className,
-      offset,
-      stickToBottom,
-      ...props
-    } = this.props
+    const {children, className, offset, stickToBottom, ...props} = this.props
 
     return (
       <Sticky