Merge pull request #3516 from oliviertassinari/eslint-no-multiple-emp…

…ty-lines

[eslint] Enforce operator-linebreak and no-multiple-empty-lines

.eslintrc

@@ -36,6 +36,7 @@ rules:
   no-unused-vars: 2
   no-shadow: 0 # Wishlist, one day
   no-spaced-func: 2
+  no-multiple-empty-lines: 2
   no-multi-spaces: 2
   no-undef: 2
   no-empty-pattern: 2
@@ -51,6 +52,7 @@ rules:
   no-var: 2
   object-curly-spacing: [2, never]
   one-var: [2, never]
+  operator-linebreak: [2, "after"]
   padded-blocks: [2, never]
   prefer-arrow-callback: 0 # Wishlist, one day
   prefer-const: 2

docs/src/app/components/master.jsx

@@ -189,8 +189,7 @@ const Master = React.createClass({
                 onChangeMuiTheme: this.handleChangeMuiTheme,
               })}
             </div>
-          </div>
-          :
+          </div> :
           children
         }
         <AppLeftNav

docs/src/app/components/pages/components/Stepper/Page.jsx

@@ -23,9 +23,9 @@ import horizontalStepCode from '!raw!material-ui/lib/Stepper/HorizontalStep';
 
 const descriptions = {
   verticalLinearStepper: 'As for the vertical linear stepper, it requires steps be completed in specific order',
-  verticalLinearStepperWithOptionalStep: 'Set the `optional` property to `true` for optional steps.'
-   + 'Pass a custom label view through `stepLabel` property to show'
-   + ' the difference between optional step and normal step.',
+  verticalLinearStepperWithOptionalStep: 'Set the `optional` property to `true` for optional steps.' +
+    'Pass a custom label view through `stepLabel` property to show' +
+    ' the difference between optional step and normal step.',
   verticalNonLinearStepper: 'As for the vertical non linear stepper, steps can be completed in any order.',
   horizontalLinearStepper: 'As for the horizontal linear stepper, it is the same with vertical linear stepper.',
 };

src/Stepper/HorizontalStep.jsx

@@ -1,9 +1,6 @@
 import React from 'react';
-
 import TouchRipple from '../ripples/touch-ripple';
-
 import Avatar from '../avatar';
-
 import {getMuiTheme} from '../styles';
 
 const HorizontalStep = React.createClass({
@@ -111,11 +108,11 @@ const HorizontalStep = React.createClass({
 
     const customAvatarBackgroundColor = this.context.updateAvatarBackgroundColor(this);
     const avatarBackgroundColor = customAvatarBackgroundColor ||
-    ((isActive || isCompleted)
-      ? theme.activeAvatarColor
-      : isStepHeaderHovered
-      ? theme.hoveredAvatarColor
-      : theme.inactiveAvatarColor);
+    ((isActive || isCompleted) ?
+      theme.activeAvatarColor :
+      isStepHeaderHovered ?
+      theme.hoveredAvatarColor :
+      theme.inactiveAvatarColor);
 
     const stepHeaderWrapper = Object.assign({
       width: headerWidth,

src/Stepper/Stepper.jsx

@@ -1,5 +1,4 @@
 import React, {PropTypes} from 'react';
-
 import {getMuiTheme} from '../styles';
 import Paper from '../paper';
 
@@ -119,8 +118,8 @@ const Stepper = React.createClass({
     const containerWrapperNode = this.refs.containerWrapper;
     const controlButtonsGroupNode = this.refs.controlButtonsGroup;
 
-    if (containerWrapperNode.style.height === '0px'
-      && nextProps.activeStepIndex > -1) {
+    if (containerWrapperNode.style.height === '0px' &&
+      nextProps.activeStepIndex > -1) {
       containerWrapperNode.style.height = `${(childrenWrapperNode.offsetHeight +
         controlButtonsGroupNode.offsetHeight + 40)}px`;
       childrenWrapperNode.style.transition = 'none';

src/Stepper/VerticalStep.jsx

@@ -201,11 +201,11 @@ const Step = React.createClass({
     const customAvatarBackgroundColor = this.context.updateAvatarBackgroundColor(this);
 
     const avatarBackgroundColor = customAvatarBackgroundColor ||
-     ((isActive || isCompleted)
-      ? theme.activeAvatarColor
-      : isStepHeaderHovered
-      ? theme.hoveredAvatarColor
-      : theme.inactiveAvatarColor);
+     ((isActive || isCompleted) ?
+      theme.activeAvatarColor :
+      isStepHeaderHovered ?
+      theme.hoveredAvatarColor :
+      theme.inactiveAvatarColor);
 
     const stepHeaderWrapper = Object.assign({
       cursor: 'pointer',

src/TextField/TextFieldLabel.jsx

@@ -69,9 +69,9 @@ const TextFieldLabel = (props) => {
       transition: Transitions.easeOut(),
       zIndex: 1, // Needed to display label above Chrome's autocomplete field background
       cursor: disabled ? 'default' : 'text',
-      transform: shrink
-        ? 'perspective(1px) scale(0.75) translate3d(0, -28px, 0)'
-        : 'scale(1) translate3d(0, 0, 0)',
+      transform: shrink ?
+        'perspective(1px) scale(0.75) translate3d(0, -28px, 0)' :
+        'scale(1) translate3d(0, 0, 0)',
       transformOrigin: 'left top',
       pointerEvents: shrink ? 'none' : 'auto',
       userSelect: 'none',

src/checkbox.jsx

@@ -169,9 +169,9 @@ const Checkbox = React.createClass({
   componentWillReceiveProps(nextProps, nextContext) {
     this.setState({
       muiTheme: nextContext.muiTheme || this.state.muiTheme,
-      switched: this.props.checked !== nextProps.checked
-        ? nextProps.checked
-        : this.state.switched,
+      switched: this.props.checked !== nextProps.checked ?
+        nextProps.checked :
+        this.state.switched,
     });
   },
 

src/dialog.jsx

@@ -119,9 +119,9 @@ function getStyles(props, state) {
       left: open ? 0 : -10000,
       width: '100%',
       height: '100%',
-      transition: open
-        ? Transitions.easeOut('0ms', 'left', '0ms')
-        : Transitions.easeOut('0ms', 'left', '450ms'),
+      transition: open ?
+        Transitions.easeOut('0ms', 'left', '0ms') :
+        Transitions.easeOut('0ms', 'left', '450ms'),
     },
     content: {
       boxSizing: 'border-box',
@@ -335,9 +335,9 @@ const DialogInline = React.createClass({
       </div>
     );
 
-    const titleElement = typeof title === 'string'
-        ? <h3 className={titleClassName} style={prepareStyles(styles.title)}>{title}</h3>
-        : title;
+    const titleElement = typeof title === 'string' ?
+      <h3 className={titleClassName} style={prepareStyles(styles.title)}>{title}</h3> :
+      title;
 
     return (
       <div className={className} style={prepareStyles(styles.root)}>

src/flat-button.jsx

@@ -279,8 +279,7 @@ const FlatButton = React.createClass({
         labelElement,
         iconCloned,
         children,
-      }
-      :
+      } :
       {
         children,
         iconCloned,

src/popover/popover.jsx

@@ -301,11 +301,10 @@ const Popover = React.createClass({
   },
 
   autoCloseWhenOffScreen(anchorPosition) {
-    if (anchorPosition.top < 0
-        || anchorPosition.top > window.innerHeight
-        || anchorPosition.left < 0
-        || anchorPosition.left > window.innerWith
-        ) {
+    if (anchorPosition.top < 0 ||
+      anchorPosition.top > window.innerHeight ||
+      anchorPosition.left < 0 ||
+      anchorPosition.left > window.innerWith) {
       this.requestClose('offScreen');
     }
   },

src/radio-button.jsx

@@ -205,13 +205,17 @@ const RadioButton = React.createClass({
       disabled && styles.fillWhenDisabled
     );
 
-    const uncheckedElement = React.isValidElement(uncheckedIcon)
-      ? React.cloneElement(uncheckedIcon, {style: Object.assign(uncheckedStyles, uncheckedIcon.props.style)})
-      : <RadioButtonOff style={uncheckedStyles} />;
-
-    const checkedElement = React.isValidElement(checkedIcon)
-      ? React.cloneElement(checkedIcon, {style: Object.assign(checkedStyles, checkedIcon.props.style)})
-      : <RadioButtonOn style={checkedStyles} />;
+    const uncheckedElement = React.isValidElement(uncheckedIcon) ?
+      React.cloneElement(uncheckedIcon, {
+        style: Object.assign(uncheckedStyles, uncheckedIcon.props.style),
+      }) :
+      <RadioButtonOff style={uncheckedStyles} />;
+
+    const checkedElement = React.isValidElement(checkedIcon) ?
+      React.cloneElement(checkedIcon, {
+        style: Object.assign(checkedStyles, checkedIcon.props.style),
+      }) :
+      <RadioButtonOn style={checkedStyles} />;
 
     const mergedIconStyle = Object.assign(styles.icon, iconStyle);
     const mergedLabelStyle = Object.assign(styles.label, labelStyle);

src/raised-button.jsx

@@ -390,8 +390,7 @@ const RaisedButton = React.createClass({
         labelElement,
         iconCloned,
         children,
-      }
-      :
+      } :
       {
         children,
         iconCloned,

src/render-to-layer.jsx

@@ -75,8 +75,8 @@ const RenderToLayer = React.createClass({
     }
 
     const el = this._layer;
-    if (event.target !== el && (event.target === window)
-        || (document.documentElement.contains(event.target) && !Dom.isDescendant(el, event.target))) {
+    if (event.target !== el && event.target === window ||
+      (document.documentElement.contains(event.target) && !Dom.isDescendant(el, event.target))) {
       this.props.componentClickAway(event);
     }
   },

src/slider.jsx

@@ -146,8 +146,8 @@ const getStyles = (props, state) => {
   });
   styles.remaining = Object.assign({}, styles.filledAndRemaining, {
     right: 0,
-    backgroundColor: (state.hovered || state.focused)
-      && !props.disabled ? slider.trackColorSelected : slider.trackColor,
+    backgroundColor: (state.hovered || state.focused) &&
+      !props.disabled ? slider.trackColorSelected : slider.trackColor,
     marginLeft: fillGutter,
     width: `calc(${((1 - state.percent) * 100)}%${calcDisabledSpacing})`,
   });
@@ -588,8 +588,8 @@ const Slider = React.createClass({
       styles.handle,
       styles.handleWhenPercentZero,
       this.state.active && styles.handleWhenActive,
-      (this.state.hovered || this.state.focused) && !disabled
-        && styles.handleWhenPercentZeroAndFocused,
+      (this.state.hovered || this.state.focused) && !disabled &&
+        styles.handleWhenPercentZeroAndFocused,
       disabled && styles.handleWhenPercentZeroAndDisabled
     ) : Object.assign(
       {},

src/table/table-body.jsx

@@ -152,9 +152,8 @@ const TableBody = React.createClass({
     };
 
     if (this.props.allRowsSelected && !nextProps.allRowsSelected) {
-      newState.selectedRows = this.state.selectedRows.length > 0
-        ? [this.state.selectedRows[this.state.selectedRows.length - 1]]
-        : [];
+      newState.selectedRows = this.state.selectedRows.length > 0 ?
+        [this.state.selectedRows[this.state.selectedRows.length - 1]] : [];
     } else {
       newState.selectedRows = this._calculatePreselectedRows(nextProps);
     }