fix(angular): prevent duplicate event emissions (#24200)

* fix(angular-output-targets): prevent duplicate event emissions

* feat(angular-output-target): update package to ^0.2.1

angular/src/directives/overlays/modal.ts

@@ -12,7 +12,41 @@ import {
 } from '@angular/core';
 import { ProxyCmp, proxyOutputs } from '../angular-component-lib/utils';
 import { Components } from '@ionic/core';
-export declare interface IonModal extends Components.IonModal {}
+
+export declare interface IonModal extends Components.IonModal {
+  /**
+   * Emitted after the modal has presented.
+   **/
+  ionModalDidPresent: EventEmitter<CustomEvent>;
+  /**
+   * Emitted before the modal has presented.
+   */
+  ionModalWillPresent: EventEmitter<CustomEvent>;
+  /**
+   * Emitted before the modal has dismissed.
+   */
+  ionModalWillDismiss: EventEmitter<CustomEvent>;
+  /**
+   * Emitted after the modal has dismissed.
+   */
+  ionModalDidDismiss: EventEmitter<CustomEvent>;
+  /**
+   * Emitted after the modal has presented. Shorthand for ionModalWillDismiss.
+   */
+  didPresent: EventEmitter<CustomEvent>;
+  /**
+   * Emitted before the modal has presented. Shorthand for ionModalWillPresent.
+   */
+  willPresent: EventEmitter<CustomEvent>;
+  /**
+   * Emitted before the modal has dismissed. Shorthand for ionModalWillDismiss.
+   */
+  willDismiss: EventEmitter<CustomEvent>;
+  /**
+   * Emitted after the modal has dismissed. Shorthand for ionModalDidDismiss.
+   */
+  didDismiss: EventEmitter<CustomEvent>;
+}
 @ProxyCmp({
   inputs: [
     'animated',
@@ -64,17 +98,10 @@ export declare interface IonModal extends Components.IonModal {}
 export class IonModal {
   @ContentChild(TemplateRef, { static: false }) template: TemplateRef<any>;
 
-  ionModalDidPresent!: EventEmitter<CustomEvent>;
-  ionModalWillPresent!: EventEmitter<CustomEvent>;
-  ionModalWillDismiss!: EventEmitter<CustomEvent>;
-  ionModalDidDismiss!: EventEmitter<CustomEvent>;
-  didPresent!: EventEmitter<CustomEvent>;
-  willPresent!: EventEmitter<CustomEvent>;
-  willDismiss!: EventEmitter<CustomEvent>;
-  didDismiss!: EventEmitter<CustomEvent>;
   isCmpOpen: boolean = false;
 
   protected el: HTMLElement;
+
   constructor(c: ChangeDetectorRef, r: ElementRef, protected z: NgZone) {
     c.detach();
     this.el = r.nativeElement;

angular/src/directives/overlays/popover.ts

@@ -12,7 +12,40 @@ import {
 } from '@angular/core';
 import { ProxyCmp, proxyOutputs } from '../angular-component-lib/utils';
 import { Components } from '@ionic/core';
-export declare interface IonPopover extends Components.IonPopover {}
+export declare interface IonPopover extends Components.IonPopover {
+  /**
+   * Emitted after the popover has presented.
+   */
+  ionPopoverDidPresent: EventEmitter<CustomEvent>;
+  /**
+   * Emitted before the popover has presented.
+   */
+  ionPopoverWillPresent: EventEmitter<CustomEvent>;
+  /**
+   * Emitted after the popover has dismissed.
+   */
+  ionPopoverWillDismiss: EventEmitter<CustomEvent>;
+  /**
+   * Emitted after the popover has dismissed.
+   */
+  ionPopoverDidDismiss: EventEmitter<CustomEvent>;
+  /**
+   * Emitted after the popover has presented. Shorthand for ionPopoverWillDismiss.
+   */
+  didPresent: EventEmitter<CustomEvent>;
+  /**
+   * Emitted before the popover has presented. Shorthand for ionPopoverWillPresent.
+   */
+  willPresent: EventEmitter<CustomEvent>;
+  /**
+   * Emitted after the popover has presented. Shorthand for ionPopoverWillDismiss.
+   */
+  willDismiss: EventEmitter<CustomEvent>;
+  /**
+   * Emitted after the popover has dismissed. Shorthand for ionPopoverDidDismiss.
+   */
+  didDismiss: EventEmitter<CustomEvent>;
+}
 @ProxyCmp({
   inputs: [
     'alignment',
@@ -64,17 +97,10 @@ export declare interface IonPopover extends Components.IonPopover {}
 export class IonPopover {
   @ContentChild(TemplateRef, { static: false }) template: TemplateRef<any>;
 
-  ionPopoverDidPresent!: EventEmitter<CustomEvent>;
-  ionPopoverWillPresent!: EventEmitter<CustomEvent>;
-  ionPopoverWillDismiss!: EventEmitter<CustomEvent>;
-  ionPopoverDidDismiss!: EventEmitter<CustomEvent>;
-  didPresent!: EventEmitter<CustomEvent>;
-  willPresent!: EventEmitter<CustomEvent>;
-  willDismiss!: EventEmitter<CustomEvent>;
-  didDismiss!: EventEmitter<CustomEvent>;
   isCmpOpen: boolean = false;
 
   protected el: HTMLElement;
+
   constructor(c: ChangeDetectorRef, r: ElementRef, protected z: NgZone) {
     c.detach();
     this.el = r.nativeElement;
@@ -87,7 +113,6 @@ export class IonPopover {
       this.isCmpOpen = false;
       c.detectChanges();
     });
-
     proxyOutputs(this, this.el, [
       'ionPopoverDidPresent',
       'ionPopoverWillPresent',

core/package-lock.json

@@ -18,7 +18,7 @@
         "@jest/core": "^26.6.3",
         "@rollup/plugin-node-resolve": "^8.4.0",
         "@rollup/plugin-virtual": "^2.0.3",
-        "@stencil/angular-output-target": "^0.2.0",
+        "@stencil/angular-output-target": "^0.2.1",
         "@stencil/react-output-target": "^0.1.0",
         "@stencil/sass": "1.3.2",
         "@stencil/vue-output-target": "^0.5.1",
@@ -1358,9 +1358,9 @@
       }
     },
     "node_modules/@stencil/angular-output-target": {
-      "version": "0.2.0",
+      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/@stencil/angular-output-target/-/angular-output-target-0.2.0.tgz",
+      "resolved": "https://registry.npmjs.org/@stencil/angular-output-target/-/angular-output-target-0.2.1.tgz",
-      "integrity": "sha512-Ptr5vigf8v+EnF9Y9LXTKimcVPfB9arC5FnSuKt5ZdNQ8IATWGLx4fhoD2/LThhkPwG9QtjDj9A4GPidu0Fomg==",
+      "integrity": "sha512-OoLabH/PtvrYDX6VZWzcyBCXyCozWr6I+YELyz3ThuinIQx9HcbPrNjzobedluoyLxRMDc7AbQPjDi5fObNcqg==",
       "dev": true
     },
     "node_modules/@stencil/core": {
@@ -15037,9 +15037,9 @@
       }
     },
     "@stencil/angular-output-target": {
-      "version": "0.2.0",
+      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/@stencil/angular-output-target/-/angular-output-target-0.2.0.tgz",
+      "resolved": "https://registry.npmjs.org/@stencil/angular-output-target/-/angular-output-target-0.2.1.tgz",
-      "integrity": "sha512-Ptr5vigf8v+EnF9Y9LXTKimcVPfB9arC5FnSuKt5ZdNQ8IATWGLx4fhoD2/LThhkPwG9QtjDj9A4GPidu0Fomg==",
+      "integrity": "sha512-OoLabH/PtvrYDX6VZWzcyBCXyCozWr6I+YELyz3ThuinIQx9HcbPrNjzobedluoyLxRMDc7AbQPjDi5fObNcqg==",
       "dev": true
     },
     "@stencil/core": {
@@ -15051,7 +15051,8 @@
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/@stencil/react-output-target/-/react-output-target-0.1.0.tgz",
       "integrity": "sha512-NWeN2S43dwWDIousfojzGXIMkJJhfcdS1JxpwgE7IOqy4tZ+nqlDLPhM6tXvZ3eq4rJm8bkF+3/WbPJNR9xR7Q==",
-      "dev": true
+      "dev": true,
+      "requires": {}
     },
     "@stencil/sass": {
       "version": "1.3.2",
@@ -15063,7 +15064,8 @@
       "version": "0.5.1",
       "resolved": "https://registry.npmjs.org/@stencil/vue-output-target/-/vue-output-target-0.5.1.tgz",
       "integrity": "sha512-E9HeuUf4DjHO8VFd+faR6T+/JwLtU/2kIA000YTTv0ARPUXuxr/3+U3YMBRPCVFPC5n2jsFxU3E9rTmVH1MGyg==",
-      "dev": true
+      "dev": true,
+      "requires": {}
     },
     "@stylelint/postcss-css-in-js": {
       "version": "0.37.2",

core/package.json

@@ -40,7 +40,7 @@
     "@jest/core": "^26.6.3",
     "@rollup/plugin-node-resolve": "^8.4.0",
     "@rollup/plugin-virtual": "^2.0.3",
-    "@stencil/angular-output-target": "^0.2.0",
+    "@stencil/angular-output-target": "^0.2.1",
     "@stencil/react-output-target": "^0.1.0",
     "@stencil/sass": "1.3.2",
     "@stencil/vue-output-target": "^0.5.1",