fix(ts): ts strict fixes

packages/core/src/components.d.ts

@@ -315,7 +315,7 @@ declare global {
   namespace JSXElements {
     export interface IonBackButtonAttributes extends HTMLAttributes {
       mode?: 'ios' | 'md';
-      text?: string;
+      text?: string|undefined;
     }
   }
 }
@@ -1033,7 +1033,6 @@ declare global {
     export interface IonGestureAttributes extends HTMLAttributes {
       attachTo?: ElementRef;
       autoBlockAll?: boolean;
-      block?: string;
       canStart?: GestureCallback;
       direction?: string;
       disabled?: boolean;
@@ -1712,7 +1711,6 @@ declare global {
     export interface IonMenuButtonAttributes extends HTMLAttributes {
       autoHide?: boolean;
       menu?: string;
-      mode?: 'ios' | 'md';
     }
   }
 }
@@ -2845,7 +2843,7 @@ declare global {
     export interface IonSelectOptionAttributes extends HTMLAttributes {
       disabled?: boolean;
       selected?: boolean;
-      value?: string;
+      value?: string|null;
     }
   }
 }
@@ -2917,7 +2915,7 @@ declare global {
       okText?: string;
       placeholder?: string;
       selectedText?: string;
-      value?: string | string[];
+      value?: string | string[] | null;
     }
   }
 }

packages/core/src/components/back-button/back-button.tsx

@@ -1,4 +1,4 @@
-import { Component, Element, Prop, State } from '@stencil/core';
+import { Component, Element, Prop } from '@stencil/core';
 import { Config } from '../../index';
 
 @Component({
@@ -13,7 +13,7 @@ import { Config } from '../../index';
 })
 export class BackButton {
 
-  @State() custom: boolean;
+  private custom = true;
 
   /**
    * The mode determines which platform styles to use.
@@ -26,7 +26,7 @@ export class BackButton {
    * The text property is used to provide custom text for the back button while using the
    * default look-and-feel
    */
-  @Prop() text: string = null;
+  @Prop() text: string|undefined;
 
   @Prop({ context: 'config' }) config: Config;
 

packages/core/src/components/back-button/readme.md

@@ -66,7 +66,7 @@ For more information, see [Platform Styles](/docs/theming/platform-specific-styl
 
 #### text
 
-string
+
 
 The text property is used to provide custom text for the back button while using the
 default look-and-feel
@@ -85,7 +85,7 @@ For more information, see [Platform Styles](/docs/theming/platform-specific-styl
 
 #### text
 
-string
+
 
 The text property is used to provide custom text for the back button while using the
 default look-and-feel

packages/core/src/components/content/content.tsx

@@ -8,10 +8,10 @@ import { getPageElement } from '../../utils/helpers';
 })
 export class Content {
 
-  private cTop = 0;
-  private cBottom = 0;
+  private cTop = -1;
+  private cBottom = -1;
   private dirty = false;
-  private scrollEl: HTMLIonScrollElement|null;
+  private scrollEl: HTMLIonScrollElement;
 
   mode: string;
   color: string;
@@ -44,12 +44,11 @@ export class Content {
   }
 
   componentDidLoad() {
-    this.scrollEl = this.el.querySelector('ion-scroll');
     this.resize();
   }
 
   componentDidUnload() {
-    this.scrollEl = null;
+    this.scrollEl = undefined as any;
   }
 
   /**
@@ -94,7 +93,7 @@ export class Content {
         this.dom.write(this.writeDimensions.bind(this));
       });
     } else {
-      this.cTop = this.cBottom = null;
+      this.cTop = this.cBottom = -1;
       this.dom.write(() => this.scrollEl && this.scrollEl.removeAttribute('style'));
     }
   }
@@ -132,6 +131,7 @@ export class Content {
 
     return [
       <ion-scroll
+        ref={el => this.scrollEl = el as any}
         mode={this.mode}
         scrollEvents={this.scrollEvents}
         forceOverscroll={this.forceOverscroll}>

packages/core/src/components/fab/fab.tsx

@@ -24,8 +24,10 @@ export class Fab {
 
   render() {
     const fab = this.el.querySelector('ion-fab-button');
-    fab.toggleActive = this.toggleActive;
-    fab.activated = this.activated;
+    if (fab) {
+      fab.toggleActive = this.toggleActive;
+      fab.activated = this.activated;
+    }
 
     const lists = this.el.querySelectorAll('ion-fab-list');
     for (let i = 0, length = lists.length; i < length; i += 1) {

packages/core/src/components/gesture-controller/gesture-controller-utils.ts

@@ -1,7 +1,7 @@
-import { GestureController } from './gesture-controller';
+import { GestureController } from '../..';
 
 export class GestureDelegate {
-  private ctrl: GestureController|null;
+  private ctrl: GestureController|undefined;
 
   constructor(
     ctrl: any,
@@ -54,14 +54,14 @@ export class GestureDelegate {
 
   destroy() {
     this.release();
-    this.ctrl = null;
+    this.ctrl = undefined;
   }
 }
 
 
 export class BlockerDelegate {
 
-  private ctrl: any|null;
+  private ctrl: GestureController|undefined;
 
   constructor(
     private id: number,
@@ -103,7 +103,7 @@ export class BlockerDelegate {
 
   destroy() {
     this.unblock();
-    this.ctrl = null;
+    this.ctrl = undefined;
   }
 }
 

packages/core/src/components/gesture/gesture.tsx

@@ -1,6 +1,6 @@
 import { Component, Event, EventEmitter, EventListenerEnable, Listen, Prop, Watch } from '@stencil/core';
 import { ElementRef, assert, now, updateDetail } from '../../utils/helpers';
-import { BlockerConfig, BlockerDelegate, DomController, GestureDelegate } from '../../index';
+import { BlockerDelegate, DomController, GestureDelegate } from '../../index';
 import { BLOCK_ALL } from '../gesture-controller/gesture-controller-utils';
 import { PanRecognizer } from './recognizers';
 
@@ -10,7 +10,7 @@ import { PanRecognizer } from './recognizers';
 })
 export class Gesture {
 
-  private detail: GestureDetail = {};
+  private detail: GestureDetail;
   private positions: number[] = [];
   private gesture: GestureDelegate;
   private lastTouch = 0;
@@ -20,7 +20,7 @@ export class Gesture {
   private hasStartedPan = false;
   private hasFiredStart = true;
   private isMoveQueued = false;
-  private blocker: BlockerDelegate;
+  private blocker: BlockerDelegate|undefined;
 
   @Prop({ connect: 'ion-gesture-controller' }) gestureCtrl: HTMLIonGestureControllerElement;
   @Prop({ context: 'dom' }) dom: DomController;
@@ -29,7 +29,6 @@ export class Gesture {
   @Prop() disabled = false;
   @Prop() attachTo: ElementRef = 'child';
   @Prop() autoBlockAll = false;
-  @Prop() block: string = null;
   @Prop() disableScroll = false;
   @Prop() direction = 'x';
   @Prop() gestureName = '';
@@ -72,6 +71,24 @@ export class Gesture {
    */
   @Event() ionPress: EventEmitter;
 
+  constructor() {
+    this.detail = {
+      type: 'pan',
+      startX: 0,
+      startY: 0,
+      startTimeStamp: 0,
+      currentX: 0,
+      currentY: 0,
+      velocityX: 0,
+      velocityY: 0,
+      deltaX: 0,
+      deltaY: 0,
+      timeStamp: 0,
+      event: undefined as any,
+      data: undefined,
+    };
+  }
+
   componentWillLoad() {
     return this.gestureCtrl.create({
       name: this.gestureName,
@@ -94,7 +111,9 @@ export class Gesture {
     this.disabledChanged(this.disabled);
 
     if (this.autoBlockAll) {
-      this.setBlocker(BLOCK_ALL).then(b => b.block());
+      this.gestureCtrl.componentOnReady()
+        .then(ctrl => ctrl.createBlocker(BLOCK_ALL))
+        .then(blocker => this.blocker = blocker);
     }
   }
 
@@ -109,23 +128,6 @@ export class Gesture {
     }
   }
 
-  @Watch('block')
-  protected blockChanged(block: string) {
-    this.setBlocker({ disable: block.split(',')});
-  }
-
-  private setBlocker(config: BlockerConfig) {
-    if (this.blocker) {
-      this.blocker.destroy();
-    }
-    if (config) {
-      return this.gestureCtrl.componentOnReady()
-        .then(ctrl => ctrl.createBlocker(config))
-        .then(blocker => this.blocker = blocker);
-    }
-    return Promise.resolve(null);
-  }
-
   // DOWN *************************
 
   @Listen('touchstart', { passive: true, enabled: false })
@@ -296,7 +298,7 @@ export class Gesture {
   }
 
   private tryToCapturePan(): boolean {
-    if (this.gesture && !this.gesture.capture()) {
+    if (!this.gesture.capture()) {
       return false;
     }
     this.hasCapturedPan = true;
@@ -449,10 +451,9 @@ export class Gesture {
   componentDidUnload() {
     if (this.blocker) {
       this.blocker.destroy();
-      this.blocker = null;
+      this.blocker = undefined;
     }
-    this.gesture && this.gesture.destroy();
-    this.gesture = this.pan = this.detail = this.detail.event = null;
+    this.gesture.destroy();
   }
 
 }
@@ -462,18 +463,18 @@ const MOUSE_WAIT = 2500;
 
 
 export interface GestureDetail {
-  type?: string;
-  event?: UIEvent;
-  startX?: number;
-  startY?: number;
-  startTimeStamp?: number;
-  currentX?: number;
-  currentY?: number;
-  velocityX?: number;
-  velocityY?: number;
-  deltaX?: number;
-  deltaY?: number;
-  timeStamp?: number;
+  type: string;
+  startX: number;
+  startY: number;
+  startTimeStamp: number;
+  currentX: number;
+  currentY: number;
+  velocityX: number;
+  velocityY: number;
+  deltaX: number;
+  deltaY: number;
+  timeStamp: number;
+  event: UIEvent;
   data?: any;
 }
 

packages/core/src/components/gesture/readme.md

@@ -17,11 +17,6 @@
 boolean
 
 
-#### block
-
-string
-
-
 #### canStart
 
 
@@ -114,11 +109,6 @@ string
 boolean
 
 
-#### block
-
-string
-
-
 #### can-start
 
 

packages/core/src/components/item-sliding/item-sliding.tsx

@@ -34,16 +34,16 @@ export const enum SlidingState {
   }
 })
 export class ItemSliding {
-  private item: HTMLIonItemElement;
-  private list: HTMLIonListElement;
+  private item: HTMLIonItemElement|null;
+  private list: HTMLIonListElement|null;
   private openAmount = 0;
   private initialOpenAmount = 0;
   private optsWidthRightSide = 0;
   private optsWidthLeftSide = 0;
   private sides: ItemSide;
   private tmr: number;
-  private leftOptions: ItemOptions;
-  private rightOptions: ItemOptions;
+  private leftOptions: ItemOptions|null;
+  private rightOptions: ItemOptions|null;
   private optsDirty = true;
 
   @Element() private el: HTMLElement;
@@ -106,7 +106,7 @@ export class ItemSliding {
    */
   @Method()
   closeOpened(): boolean {
-    return this.list && this.list.closeSlidingItems();
+    return !!(this.list && this.list.closeSlidingItems());
   }
 
   private updateOptions() {

packages/core/src/components/list/list.tsx

@@ -14,15 +14,15 @@ import { ItemSliding } from '../item-sliding/item-sliding';
   }
 })
 export class List {
-  private openedItem: ItemSliding;
+  private openedItem: ItemSliding|null;
 
   @Method()
   getOpenedItem() {
     return this.openedItem;
   }
 
   @Method()
-  setOpenedItem(itemSliding: ItemSliding) {
+  setOpenedItem(itemSliding: ItemSliding|null) {
     this.openedItem = itemSliding;
   }