Fix eslint errors

Author: aomarks

.eslintrc.yaml

@@ -15,7 +15,7 @@ parserOptions:
   sourceType: module
 rules:
   indent: off
-  max-len: [warn, 120]
+  max-len: off # clang-format fixes line lengths
   no-new: warn
   quotes: [error, single, {"avoidEscape": true}]
   no-var: error
@@ -33,6 +33,7 @@ rules:
   valid-jsdoc: off
 
   prefer-const: error
+  comma-dangle: off
 
   # Rules for our mocha unit tests. Note that even though we use mocha, we model our unit tests
   # after frameworks such as tape and ava, which encourage modern paradigms, seek to minimize

packages/checkbox/src/mwc-checkbox-base.ts

@@ -34,10 +34,9 @@ export class CheckboxBase extends FormElement {
   })
   disabled = false;
 
-  @property({type: String})
-  value = ''
+  @property({type: String}) value = '';
 
-      protected mdcFoundationClass = MDCCheckboxFoundation;
+  protected mdcFoundationClass = MDCCheckboxFoundation;
 
   protected mdcFoundation!: MDCCheckboxFoundation;
 

packages/fab/src/mwc-fab-base.ts

@@ -51,12 +51,10 @@ export class FabBase extends LitElement {
           aria-label="${this.label || this.icon}">
         ${showLabel && this.showIconAtEnd ? this.label : ''}
         ${
-        this.icon ?
-        html
-    `<span class="material-icons mdc-fab__icon">${this.icon}</span>`: ''}
-        ${
-        showLabel &&
-        !this.showIconAtEnd ? this.label : ''}
+        this.icon ? html`<span class="material-icons mdc-fab__icon">${
+                        this.icon}</span>` :
+                    ''}
+        ${showLabel && !this.showIconAtEnd ? this.label : ''}
       </button>`;
   }
 }

packages/linear-progress/src/mwc-linear-progress-base.ts

@@ -23,19 +23,18 @@ export class LinearProgressBase extends BaseElement {
 
   protected readonly mdcFoundationClass = MDCLinearProgressFoundation;
 
-  @query('.mdc-linear-progress')
-  protected mdcRoot!: HTMLElement
+  @query('.mdc-linear-progress') protected mdcRoot!: HTMLElement;
 
-      @query('.mdc-linear-progress__primary-bar') protected primaryBar
-      !: HTMLElement
+  @query('.mdc-linear-progress__primary-bar')
+  protected primaryBar!: HTMLElement;
 
-      @query('.mdc-linear-progress__buffer') protected bufferElement
-      !: HTMLElement
+  @query('.mdc-linear-progress__buffer') protected bufferElement!: HTMLElement;
 
-      @property({type: Boolean, reflect: true})
-      @observer(function(this: LinearProgressBase, value: boolean) {
-        this.mdcFoundation.setDeterminate(value);
-      }) determinate = false;
+  @property({type: Boolean, reflect: true})
+  @observer(function(this: LinearProgressBase, value: boolean) {
+    this.mdcFoundation.setDeterminate(value);
+  })
+  determinate = false;
 
   @property({type: Number})
   @observer(function(this: LinearProgressBase, value: number) {
@@ -84,16 +83,15 @@ export class LinearProgressBase extends BaseElement {
       ...addHasRemoveClass(this.mdcRoot),
       getPrimaryBar: () => this.primaryBar,
       getBuffer: () => this.bufferElement,
-      setStyle: (el: HTMLElement, property: string, value: string) =>
-          // TODO(aomarks) Consider moving this type to the
-          // MDCLinearProgressAdapter parameter type, but note that the
-          // "-webkit" prefixed CSS properties are not declared in
-          // CSSStyleDeclaration.
-          //
-          // Exclude read-only properties.
-      el.style
-          [property as
-           Exclude<keyof CSSStyleDeclaration, 'length'|'parentRule'>] = value,
+      setStyle: (el: HTMLElement, property: string, value: string) => {
+        // TODO(aomarks) Consider moving this type to the
+        // MDCLinearProgressAdapter parameter type, but note that the "-webkit"
+        // prefixed CSS properties are not declared in CSSStyleDeclaration.
+        //
+        // Exclude read-only properties.
+        el.style[property as Exclude<keyof CSSStyleDeclaration, 'length'|'parentRule'>] =
+            value;
+      },
     };
   }
 

packages/slider/src/mwc-slider-base.ts

@@ -97,22 +97,21 @@ export class SliderBase extends FormElement {
         <div class="mdc-slider__track"></div>
         ${
         discrete && markers ?
-        html
-    `<div class="mdc-slider__track-marker-container">
+            html`<div class="mdc-slider__track-marker-container">
           ${
-        repeat(
-            new Array(_numMarkers),
-            () => html`<div class="mdc-slider__track-marker"></div>`)}
-        </div>`: ''}
+                repeat(
+                    new Array(_numMarkers),
+                    () => html`<div class="mdc-slider__track-marker"></div>`)}
+        </div>` :
+            ''}
       </div>
       <div class="mdc-slider__thumb-container">
         <!-- TODO: use cache() directive -->
         ${
-        discrete ?
-        html`<div class="mdc-slider__pin">
+        discrete ? html`<div class="mdc-slider__pin">
           <span class="mdc-slider__pin-value-marker"></span>
         </div>` :
-        ''}
+                   ''}
         <svg class="mdc-slider__thumb" width="21" height="21">
           <circle cx="10.5" cy="10.5" r="7.875"></circle>
         </svg>

packages/tab/src/mwc-tab-base.ts

@@ -98,22 +98,16 @@ export class TabBase extends BaseElement {
         <span class="mdc-tab__content">
           <slot></slot>
           ${
-        this.icon ?
-        html
-    `<span class="mdc-tab__icon material-icons">${this.icon}</span>`: ''}
+        this.icon ? html`<span class="mdc-tab__icon material-icons">${
+                        this.icon}</span>` :
+                    ''}
           ${
         this.label ?
-        html
-    `<span class="mdc-tab__text-label">${this.label}</span>`: ''}
-          ${
-        this.isMinWidthIndicator ?
-        this.renderIndicator() :
-        ''}
+            html`<span class="mdc-tab__text-label">${this.label}</span>` :
+            ''}
+          ${this.isMinWidthIndicator ? this.renderIndicator() : ''}
         </span>
-        ${
-        this.isMinWidthIndicator ?
-        '' :
-        this.renderIndicator()}
+        ${this.isMinWidthIndicator ? '' : this.renderIndicator()}
         <span class="mdc-tab__ripple" .ripple="${ripple({
       interactionNode: this,
       unbounded: false