feat(overlays): adds onDidDismiss and onWillDismiss

core/src/components/action-sheet/action-sheet.tsx

@@ -1,8 +1,8 @@
 import { Component, Element, Event, EventEmitter, Listen, Method, Prop } from '@stencil/core';
-import { Animation, AnimationBuilder, Config, CssClassMap, OverlayDismissEvent } from '../../index';
+import { Animation, AnimationBuilder, Config, CssClassMap } from '../../index';
 
 import { createThemedClasses, getClassMap } from '../../utils/theme';
-import { BACKDROP, OverlayInterface, dismiss, present } from '../../utils/overlays';
+import { BACKDROP, OverlayEventDetail, OverlayInterface, dismiss, eventMethod, present } from '../../utils/overlays';
 
 import iosEnterAnimation from './animations/ios.enter';
 import iosLeaveAnimation from './animations/ios.leave';
@@ -102,12 +102,12 @@ export class ActionSheet implements OverlayInterface {
   /**
    * Emitted before the alert has dismissed.
    */
-  @Event({eventName: 'ionActionSheetWillDismiss'}) willDismiss: EventEmitter;
+  @Event({eventName: 'ionActionSheetWillDismiss'}) willDismiss: EventEmitter<OverlayEventDetail>;
 
   /**
    * Emitted after the alert has dismissed.
    */
-  @Event({eventName: 'ionActionSheetDidDismiss'}) didDismiss: EventEmitter;
+  @Event({eventName: 'ionActionSheetDidDismiss'}) didDismiss: EventEmitter<OverlayEventDetail>;
 
 
   componentDidLoad() {
@@ -139,6 +139,16 @@ export class ActionSheet implements OverlayInterface {
     return dismiss(this, data, role, 'actionSheetLeave', iosLeaveAnimation, mdLeaveAnimation, undefined);
   }
 
+  @Method()
+  onDidDismiss(callback: (data?: any, role?: string) => void): Promise<OverlayEventDetail> {
+    return eventMethod(this.el, 'ionActionSheetDidDismiss', callback);
+  }
+
+  @Method()
+  onWillDismiss(callback: (data?: any, role?: string) => void): Promise<OverlayEventDetail> {
+    return eventMethod(this.el, 'ionActionSheetWillDismiss', callback);
+  }
+
   protected buttonClick(button: ActionSheetButton) {
     let shouldDismiss = true;
     if (button.handler) {
@@ -255,6 +265,3 @@ export interface ActionSheetButton {
   handler?: () => boolean | void;
 }
 
-export interface ActionSheetDismissEvent extends OverlayDismissEvent {
-  // keep this just for the sake of static types and potential future extensions
-}

core/src/components/action-sheet/readme.md

@@ -239,6 +239,12 @@ Emitted before the alert has presented.
 Dismiss the action sheet overlay after it has been presented.
 
 
+#### onDidDismiss()
+
+
+#### onWillDismiss()
+
+
 #### present()
 
 Present the action sheet overlay after it has been created.

core/src/components/alert-controller/alert-controller.tsx

@@ -1,5 +1,5 @@
 import { Component, Listen, Method } from '@stencil/core';
-import { AlertEvent, AlertOptions, OverlayController } from '../../index';
+import { AlertOptions, OverlayController } from '../../index';
 import { createOverlay, dismissOverlay, getTopOverlay, removeLastOverlay } from '../../utils/overlays';
 
 @Component({
@@ -10,13 +10,13 @@ export class AlertController implements OverlayController {
   private alerts = new Map<number, HTMLIonAlertElement>();
 
   @Listen('body:ionAlertWillPresent')
-  protected alertWillPresent(ev: AlertEvent) {
+  protected alertWillPresent(ev: any) {
     this.alerts.set(ev.target.overlayId, ev.target);
   }
 
   @Listen('body:ionAlertWillDismiss')
   @Listen('body:ionAlertDidUnload')
-  protected alertWillDismiss(ev: AlertEvent) {
+  protected alertWillDismiss(ev: any) {
     this.alerts.delete(ev.target.overlayId);
   }
 

core/src/components/alert/alert.tsx

@@ -1,7 +1,7 @@
 import { Component, Element, Event, EventEmitter, Listen, Method, Prop } from '@stencil/core';
-import { Animation, AnimationBuilder, Config, CssClassMap, OverlayDismissEvent, OverlayDismissEventDetail } from '../../index';
+import { Animation, AnimationBuilder, Config, CssClassMap } from '../../index';
 import { createThemedClasses, getClassMap } from '../../utils/theme';
-import { BACKDROP, OverlayInterface, autoFocus, dismiss, present } from '../../utils/overlays';
+import { BACKDROP, OverlayEventDetail, OverlayInterface, autoFocus, dismiss, eventMethod, present } from '../../utils/overlays';
 
 import iosEnterAnimation from './animations/ios.enter';
 import iosLeaveAnimation from './animations/ios.leave';
@@ -95,32 +95,32 @@ export class Alert implements OverlayInterface {
   /**
    * Emitted after the alert has presented.
    */
-  @Event() ionAlertDidLoad: EventEmitter<AlertEventDetail>;
+  @Event() ionAlertDidLoad: EventEmitter<void>;
 
   /**
    * Emitted before the alert has presented.
    */
-  @Event() ionAlertDidUnload: EventEmitter<AlertEventDetail>;
+  @Event() ionAlertDidUnload: EventEmitter<void>;
 
   /**
    * Emitted after the alert has presented.
    */
-  @Event({eventName: 'ionAlertDidPresent'}) didPresent: EventEmitter<AlertEventDetail>;
+  @Event({eventName: 'ionAlertDidPresent'}) didPresent: EventEmitter<void>;
 
   /**
    * Emitted before the alert has presented.
    */
-  @Event({eventName: 'ionAlertWillPresent'}) willPresent: EventEmitter<AlertEventDetail>;
+  @Event({eventName: 'ionAlertWillPresent'}) willPresent: EventEmitter<void>;
 
   /**
    * Emitted before the alert has dismissed.
    */
-  @Event({eventName: 'ionAlertWillDismiss'}) willDismiss: EventEmitter<AlertDismissEventDetail>;
+  @Event({eventName: 'ionAlertWillDismiss'}) willDismiss: EventEmitter<OverlayEventDetail>;
 
   /**
    * Emitted after the alert has dismissed.
    */
-  @Event({eventName: 'ionAlertDidDismiss'}) didDismiss: EventEmitter<AlertDismissEventDetail>;
+  @Event({eventName: 'ionAlertDidDismiss'}) didDismiss: EventEmitter<OverlayEventDetail>;
 
 
   componentDidLoad() {
@@ -154,6 +154,16 @@ export class Alert implements OverlayInterface {
     return dismiss(this, data, role, 'alertLeave', iosLeaveAnimation, mdLeaveAnimation, undefined);
   }
 
+  @Method()
+  onDidDismiss(callback: (data?: any, role?: string) => void): Promise<OverlayEventDetail> {
+    return eventMethod(this.el, 'ionAlerDidDismiss', callback);
+  }
+
+  @Method()
+  onWillDismiss(callback: (data?: any, role?: string) => void): Promise<OverlayEventDetail> {
+    return eventMethod(this.el, 'ionAlertWillDismiss', callback);
+  }
+
   private rbClick(inputIndex: number) {
     this.inputs = this.inputs.map((input, index) => {
       input.checked = (inputIndex === index);
@@ -181,6 +191,7 @@ export class Alert implements OverlayInterface {
     }
   }
 
+
   private buttonClick(button: any) {
     let shouldDismiss = true;
 
@@ -441,19 +452,3 @@ export interface AlertButton {
   cssClass?: string;
   handler?: (value: any) => boolean|void;
 }
-
-export interface AlertEvent extends CustomEvent {
-  target: HTMLIonAlertElement;
-  detail: AlertEventDetail;
-}
-
-export interface AlertEventDetail {
-}
-
-export interface AlertDismissEventDetail extends OverlayDismissEventDetail {
-  // keep this just for the sake of static types and potential future extensions
-}
-
-export interface AlertDismissEvent extends OverlayDismissEvent {
-  // keep this just for the sake of static types and potential future extensions
-}

core/src/components/alert/readme.md

@@ -247,6 +247,12 @@ Emitted before the alert has presented.
 Dismiss the alert overlay after it has been presented.
 
 
+#### onDidDismiss()
+
+
+#### onWillDismiss()
+
+
 #### present()
 
 Present the alert overlay after it has been created.

core/src/components/loading/loading.tsx

@@ -1,7 +1,7 @@
 import { Component, Element, Event, EventEmitter, Listen, Method, Prop } from '@stencil/core';
-import { Animation, AnimationBuilder, Config, OverlayDismissEventDetail } from '../../index';
+import { Animation, AnimationBuilder, Config } from '../../index';
 import { createThemedClasses, getClassMap } from '../../utils/theme';
-import { BACKDROP, OverlayInterface, dismiss, present } from '../../utils/overlays';
+import { BACKDROP, OverlayEventDetail, OverlayInterface, dismiss, eventMethod, present } from '../../utils/overlays';
 
 import iosEnterAnimation from './animations/ios.enter';
 import iosLeaveAnimation from './animations/ios.leave';
@@ -115,12 +115,12 @@ export class Loading implements OverlayInterface {
   /**
    * Emitted before the loading has dismissed.
    */
-  @Event({eventName: 'ionLoadingWillDismiss'}) willDismiss: EventEmitter<OverlayDismissEventDetail>;
+  @Event({eventName: 'ionLoadingWillDismiss'}) willDismiss: EventEmitter<OverlayEventDetail>;
 
   /**
    * Emitted after the loading has dismissed.
    */
-  @Event({eventName: 'ionLoadingDidDismiss'}) didDismiss: EventEmitter<OverlayDismissEventDetail>;
+  @Event({eventName: 'ionLoadingDidDismiss'}) didDismiss: EventEmitter<OverlayEventDetail>;
 
   componentWillLoad() {
     if (!this.spinner) {
@@ -163,6 +163,16 @@ export class Loading implements OverlayInterface {
     return dismiss(this, data, role, 'loadingLeave', iosLeaveAnimation, mdLeaveAnimation, undefined);
   }
 
+  @Method()
+  onDidDismiss(callback: (data?: any, role?: string) => void): Promise<OverlayEventDetail> {
+    return eventMethod(this.el, 'ionLoadingDidDismiss', callback);
+  }
+
+  @Method()
+  onWillDismiss(callback: (data?: any, role?: string) => void): Promise<OverlayEventDetail> {
+    return eventMethod(this.el, 'ionLoadingWillDismiss', callback);
+  }
+
   hostData() {
     const themedClasses = this.translucent ? createThemedClasses(this.mode, this.color, 'loading-translucent') : {};
 

core/src/components/loading/readme.md

@@ -242,6 +242,12 @@ Emitted before the loading has presented.
 Dismiss the loading overlay after it has been presented.
 
 
+#### onDidDismiss()
+
+
+#### onWillDismiss()
+
+
 #### present()
 
 Present the loading overlay after it has been created.

core/src/components/modal-controller/modal-controller.tsx

@@ -1,5 +1,5 @@
 import { Component, Listen, Method } from '@stencil/core';
-import { ModalEvent, ModalOptions, OverlayController } from '../../index';
+import { ModalOptions, OverlayController } from '../../index';
 import { createOverlay, dismissOverlay, getTopOverlay, removeLastOverlay } from '../../utils/overlays';
 
 
@@ -11,12 +11,13 @@ export class ModalController implements OverlayController {
   private modals = new Map<number, HTMLIonModalElement>();
 
   @Listen('body:ionModalWillPresent')
-  protected modalWillPresent(ev: ModalEvent) {
+  protected modalWillPresent(ev: any) {
     this.modals.set(ev.target.overlayId, ev.target);
   }
 
-  @Listen('body:ionModalWillDismiss, body:ionModalDidUnload')
-  protected modalWillDismiss(ev: ModalEvent) {
+  @Listen('body:ionModalWillDismiss')
+  @Listen('body:ionModalDidUnload')
+  protected modalWillDismiss(ev: any) {
     this.modals.delete(ev.target.overlayId);
   }
 

core/src/components/modal/modal.tsx

@@ -1,8 +1,8 @@
 import { Component, Element, Event, EventEmitter, Listen, Method, Prop } from '@stencil/core';
-import { Animation, AnimationBuilder, Config, FrameworkDelegate, OverlayDismissEvent, OverlayDismissEventDetail } from '../../index';
+import { Animation, AnimationBuilder, Config, FrameworkDelegate } from '../../index';
 
 import { createThemedClasses, getClassMap } from '../../utils/theme';
-import { BACKDROP, OverlayInterface, attachComponent, dismiss, present } from '../../utils/overlays';
+import { BACKDROP, OverlayEventDetail, OverlayInterface, attachComponent, dismiss, eventMethod, present } from '../../utils/overlays';
 
 import iosEnterAnimation from './animations/ios.enter';
 import iosLeaveAnimation from './animations/ios.leave';
@@ -93,32 +93,32 @@ export class Modal implements OverlayInterface {
   /**
    * Emitted after the modal has loaded.
    */
-  @Event() ionModalDidLoad: EventEmitter<ModalEventDetail>;
+  @Event() ionModalDidLoad: EventEmitter<void>;
 
   /**
    * Emitted after the modal has unloaded.
    */
-  @Event() ionModalDidUnload: EventEmitter<ModalEventDetail>;
+  @Event() ionModalDidUnload: EventEmitter<void>;
 
   /**
    * Emitted after the modal has presented.
    */
-  @Event({eventName: 'ionModalDidPresent'}) didPresent: EventEmitter<ModalEventDetail>;
+  @Event({eventName: 'ionModalDidPresent'}) didPresent: EventEmitter<void>;
 
   /**
    * Emitted before the modal has presented.
    */
-  @Event({eventName: 'ionModalWillPresent'}) willPresent: EventEmitter<ModalEventDetail>;
+  @Event({eventName: 'ionModalWillPresent'}) willPresent: EventEmitter<void>;
 
   /**
    * Emitted before the modal has dismissed.
    */
-  @Event({eventName: 'ionModalWillDismiss'}) willDismiss: EventEmitter<ModalDismissEventDetail>;
+  @Event({eventName: 'ionModalWillDismiss'}) willDismiss: EventEmitter<OverlayEventDetail>;
 
   /**
    * Emitted after the modal has dismissed.
    */
-  @Event({eventName: 'ionModalDidDismiss'}) didDismiss: EventEmitter<ModalDismissEventDetail>;
+  @Event({eventName: 'ionModalDidDismiss'}) didDismiss: EventEmitter<OverlayEventDetail>;
 
   componentDidLoad() {
     this.ionModalDidLoad.emit();
@@ -188,6 +188,16 @@ export class Modal implements OverlayInterface {
     return dismiss(this, data, role, 'modalLeave', iosLeaveAnimation, mdLeaveAnimation, undefined);
   }
 
+  @Method()
+  onDidDismiss(callback: (data?: any, role?: string) => void): Promise<OverlayEventDetail> {
+    return eventMethod(this.el, 'ionModalDidDismiss', callback);
+  }
+
+  @Method()
+  onWillDismiss(callback: (data?: any, role?: string) => void): Promise<OverlayEventDetail> {
+    return eventMethod(this.el, 'ionModalWillDismiss', callback);
+  }
+
   hostData() {
     return {
       style: {
@@ -223,21 +233,3 @@ export interface ModalOptions {
   cssClass?: string;
   delegate?: FrameworkDelegate;
 }
-
-export interface ModalEvent extends CustomEvent {
-  target: HTMLIonModalElement;
-  detail: ModalEventDetail;
-}
-
-export interface ModalEventDetail {
-
-}
-
-export interface ModalDismissEventDetail extends OverlayDismissEventDetail {
-  // keep this just for the sake of static types and potential future extensions
-}
-
-export interface ModalDismissEvent extends OverlayDismissEvent {
-  // keep this just for the sake of static types and potential future extensions
-}
-

core/src/components/modal/readme.md

@@ -259,6 +259,12 @@ Emitted before the modal has presented.
 Dismiss the modal overlay after it has been presented.
 
 
+#### onDidDismiss()
+
+
+#### onWillDismiss()
+
+
 #### present()
 
 Present the modal overlay after it has been created.

core/src/components/picker-controller/picker-controller.tsx

@@ -1,5 +1,5 @@
 import { Component, Listen, Method } from '@stencil/core';
-import { OverlayController, PickerEvent, PickerOptions } from '../../index';
+import { OverlayController, PickerOptions } from '../../index';
 import { createOverlay, dismissOverlay, getTopOverlay, removeLastOverlay } from '../../utils/overlays';
 
 
@@ -11,12 +11,13 @@ export class PickerController implements OverlayController {
   private pickers = new Map<number, HTMLIonPickerElement>();
 
   @Listen('body:ionPickerWillPresent')
-  protected pickerWillPresent(ev: PickerEvent) {
+  protected pickerWillPresent(ev: any) {
     this.pickers.set(ev.target.overlayId, ev.target);
   }
 
-  @Listen('body:ionPickerWillDismiss, body:ionPickerDidUnload')
-  protected pickerWillDismiss(ev: PickerEvent) {
+  @Listen('body:ionPickerWillDismiss')
+  @Listen('body:ionPickerDidUnload')
+  protected pickerWillDismiss(ev: any) {
     this.pickers.delete(ev.target.overlayId);
   }