diff --git a/core/api.txt b/core/api.txt index 41e47152ca..81b280ec04 100644 --- a/core/api.txt +++ b/core/api.txt @@ -21,9 +21,7 @@ ion-action-sheet,method,onDidDismiss,onDidDismiss() => Promise Promise> ion-action-sheet,method,present,present() => Promise ion-action-sheet,event,ionActionSheetDidDismiss,OverlayEventDetail,true -ion-action-sheet,event,ionActionSheetDidLoad,void,true ion-action-sheet,event,ionActionSheetDidPresent,void,true -ion-action-sheet,event,ionActionSheetDidUnload,void,true ion-action-sheet,event,ionActionSheetWillDismiss,OverlayEventDetail,true ion-action-sheet,event,ionActionSheetWillPresent,void,true ion-action-sheet,css-prop,--background @@ -61,9 +59,7 @@ ion-alert,method,onDidDismiss,onDidDismiss() => Promise> ion-alert,method,onWillDismiss,onWillDismiss() => Promise> ion-alert,method,present,present() => Promise ion-alert,event,ionAlertDidDismiss,OverlayEventDetail,true -ion-alert,event,ionAlertDidLoad,void,true ion-alert,event,ionAlertDidPresent,void,true -ion-alert,event,ionAlertDidUnload,void,true ion-alert,event,ionAlertWillDismiss,OverlayEventDetail,true ion-alert,event,ionAlertWillPresent,void,true ion-alert,css-prop,--background @@ -553,9 +549,7 @@ ion-loading,method,onDidDismiss,onDidDismiss() => Promise Promise> ion-loading,method,present,present() => Promise ion-loading,event,ionLoadingDidDismiss,OverlayEventDetail,true -ion-loading,event,ionLoadingDidLoad,void,true ion-loading,event,ionLoadingDidPresent,void,true -ion-loading,event,ionLoadingDidUnload,void,true ion-loading,event,ionLoadingWillDismiss,OverlayEventDetail,true ion-loading,event,ionLoadingWillPresent,void,true ion-loading,css-prop,--background @@ -639,9 +633,7 @@ ion-modal,method,onDidDismiss,onDidDismiss() => Promise> ion-modal,method,onWillDismiss,onWillDismiss() => Promise> ion-modal,method,present,present() => Promise ion-modal,event,ionModalDidDismiss,OverlayEventDetail,true -ion-modal,event,ionModalDidLoad,void,true ion-modal,event,ionModalDidPresent,void,true -ion-modal,event,ionModalDidUnload,void,true ion-modal,event,ionModalWillDismiss,OverlayEventDetail,true ion-modal,event,ionModalWillPresent,void,true ion-modal,css-prop,--background @@ -719,9 +711,7 @@ ion-picker,method,onDidDismiss,onDidDismiss() => Promise ion-picker,method,onWillDismiss,onWillDismiss() => Promise> ion-picker,method,present,present() => Promise ion-picker,event,ionPickerDidDismiss,OverlayEventDetail,true -ion-picker,event,ionPickerDidLoad,void,true ion-picker,event,ionPickerDidPresent,void,true -ion-picker,event,ionPickerDidUnload,void,true ion-picker,event,ionPickerWillDismiss,OverlayEventDetail,true ion-picker,event,ionPickerWillPresent,void,true ion-picker,css-prop,--background @@ -760,9 +750,7 @@ ion-popover,method,onDidDismiss,onDidDismiss() => Promise Promise> ion-popover,method,present,present() => Promise ion-popover,event,ionPopoverDidDismiss,OverlayEventDetail,true -ion-popover,event,ionPopoverDidLoad,void,true ion-popover,event,ionPopoverDidPresent,void,true -ion-popover,event,ionPopoverDidUnload,void,true ion-popover,event,ionPopoverWillDismiss,OverlayEventDetail,true ion-popover,event,ionPopoverWillPresent,void,true ion-popover,css-prop,--background @@ -1162,9 +1150,7 @@ ion-toast,method,onDidDismiss,onDidDismiss() => Promise> ion-toast,method,onWillDismiss,onWillDismiss() => Promise> ion-toast,method,present,present() => Promise ion-toast,event,ionToastDidDismiss,OverlayEventDetail,true -ion-toast,event,ionToastDidLoad,void,true ion-toast,event,ionToastDidPresent,void,true -ion-toast,event,ionToastDidUnload,void,true ion-toast,event,ionToastWillDismiss,OverlayEventDetail,true ion-toast,event,ionToastWillPresent,void,true ion-toast,css-prop,--background diff --git a/core/src/components.d.ts b/core/src/components.d.ts index 8e4a83a2f5..075f3a68ba 100644 --- a/core/src/components.d.ts +++ b/core/src/components.d.ts @@ -202,18 +202,10 @@ export namespace Components { */ 'onIonActionSheetDidDismiss'?: (event: CustomEvent) => void; /** - * Emitted after the alert has loaded. - */ - 'onIonActionSheetDidLoad'?: (event: CustomEvent) => void; - /** * Emitted after the alert has presented. */ 'onIonActionSheetDidPresent'?: (event: CustomEvent) => void; /** - * Emitted after the alert has unloaded. - */ - 'onIonActionSheetDidUnload'?: (event: CustomEvent) => void; - /** * Emitted before the alert has dismissed. */ 'onIonActionSheetWillDismiss'?: (event: CustomEvent) => void; @@ -371,16 +363,8 @@ export namespace Components { /** * Emitted after the alert has presented. */ - 'onIonAlertDidLoad'?: (event: CustomEvent) => void; - /** - * Emitted after the alert has presented. - */ 'onIonAlertDidPresent'?: (event: CustomEvent) => void; /** - * Emitted before the alert has presented. - */ - 'onIonAlertDidUnload'?: (event: CustomEvent) => void; - /** * Emitted before the alert has dismissed. */ 'onIonAlertWillDismiss'?: (event: CustomEvent) => void; @@ -2298,18 +2282,10 @@ export namespace Components { */ 'onIonLoadingDidDismiss'?: (event: CustomEvent) => void; /** - * Emitted after the loading has loaded. - */ - 'onIonLoadingDidLoad'?: (event: CustomEvent) => void; - /** * Emitted after the loading has presented. */ 'onIonLoadingDidPresent'?: (event: CustomEvent) => void; /** - * Emitted after the loading has unloaded. - */ - 'onIonLoadingDidUnload'?: (event: CustomEvent) => void; - /** * Emitted before the loading has dismissed. */ 'onIonLoadingWillDismiss'?: (event: CustomEvent) => void; @@ -2667,18 +2643,10 @@ export namespace Components { */ 'onIonModalDidDismiss'?: (event: CustomEvent) => void; /** - * Emitted after the modal has loaded. - */ - 'onIonModalDidLoad'?: (event: CustomEvent) => void; - /** * Emitted after the modal has presented. */ 'onIonModalDidPresent'?: (event: CustomEvent) => void; /** - * Emitted after the modal has unloaded. - */ - 'onIonModalDidUnload'?: (event: CustomEvent) => void; - /** * Emitted before the modal has dismissed. */ 'onIonModalWillDismiss'?: (event: CustomEvent) => void; @@ -3008,18 +2976,10 @@ export namespace Components { */ 'onIonPickerDidDismiss'?: (event: CustomEvent) => void; /** - * Emitted after the picker has loaded. - */ - 'onIonPickerDidLoad'?: (event: CustomEvent) => void; - /** * Emitted after the picker has presented. */ 'onIonPickerDidPresent'?: (event: CustomEvent) => void; /** - * Emitted after the picker has unloaded. - */ - 'onIonPickerDidUnload'?: (event: CustomEvent) => void; - /** * Emitted before the picker has dismissed. */ 'onIonPickerWillDismiss'?: (event: CustomEvent) => void; @@ -3165,18 +3125,10 @@ export namespace Components { */ 'onIonPopoverDidDismiss'?: (event: CustomEvent) => void; /** - * Emitted after the popover has loaded. - */ - 'onIonPopoverDidLoad'?: (event: CustomEvent) => void; - /** * Emitted after the popover has presented. */ 'onIonPopoverDidPresent'?: (event: CustomEvent) => void; /** - * Emitted after the popover has unloaded. - */ - 'onIonPopoverDidUnload'?: (event: CustomEvent) => void; - /** * Emitted before the popover has dismissed. */ 'onIonPopoverWillDismiss'?: (event: CustomEvent) => void; @@ -4946,18 +4898,10 @@ export namespace Components { */ 'onIonToastDidDismiss'?: (event: CustomEvent) => void; /** - * Emitted after the toast has loaded. - */ - 'onIonToastDidLoad'?: (event: CustomEvent) => void; - /** * Emitted after the toast has presented. */ 'onIonToastDidPresent'?: (event: CustomEvent) => void; /** - * Emitted after the toast has unloaded. - */ - 'onIonToastDidUnload'?: (event: CustomEvent) => void; - /** * Emitted before the toast has dismissed. */ 'onIonToastWillDismiss'?: (event: CustomEvent) => void; diff --git a/core/src/components/action-sheet/action-sheet.scss b/core/src/components/action-sheet/action-sheet.scss index 61b384af9f..003f957405 100644 --- a/core/src/components/action-sheet/action-sheet.scss +++ b/core/src/components/action-sheet/action-sheet.scss @@ -39,6 +39,10 @@ z-index: $z-index-overlay; } +:host(.overlay-hidden) { + display: none; +} + .action-sheet-wrapper { @include position(null, 0, 0, 0); @include margin(auto); diff --git a/core/src/components/action-sheet/action-sheet.tsx b/core/src/components/action-sheet/action-sheet.tsx index 1aa9f71f42..668dcfa443 100644 --- a/core/src/components/action-sheet/action-sheet.tsx +++ b/core/src/components/action-sheet/action-sheet.tsx @@ -84,16 +84,6 @@ export class ActionSheet implements ComponentInterface, OverlayInterface { */ @Prop() animated = true; - /** - * Emitted after the alert has loaded. - */ - @Event() ionActionSheetDidLoad!: EventEmitter; - - /** - * Emitted after the alert has unloaded. - */ - @Event() ionActionSheetDidUnload!: EventEmitter; - /** * Emitted after the alert has presented. */ @@ -114,14 +104,6 @@ export class ActionSheet implements ComponentInterface, OverlayInterface { */ @Event({ eventName: 'ionActionSheetDidDismiss' }) didDismiss!: EventEmitter; - componentDidLoad() { - this.ionActionSheetDidLoad.emit(); - } - - componentDidUnload() { - this.ionActionSheetDidUnload.emit(); - } - @Listen('ionBackdropTap') protected onBackdropTap() { this.dismiss(undefined, BACKDROP); diff --git a/core/src/components/action-sheet/readme.md b/core/src/components/action-sheet/readme.md index 765a2a87c7..e5e5f9aa0e 100644 --- a/core/src/components/action-sheet/readme.md +++ b/core/src/components/action-sheet/readme.md @@ -146,9 +146,7 @@ async function presentActionSheet() { | Event | Description | Type | | --------------------------- | --------------------------------------- | --------------------------------- | | `ionActionSheetDidDismiss` | Emitted after the alert has dismissed. | `CustomEvent` | -| `ionActionSheetDidLoad` | Emitted after the alert has loaded. | `CustomEvent` | | `ionActionSheetDidPresent` | Emitted after the alert has presented. | `CustomEvent` | -| `ionActionSheetDidUnload` | Emitted after the alert has unloaded. | `CustomEvent` | | `ionActionSheetWillDismiss` | Emitted before the alert has dismissed. | `CustomEvent` | | `ionActionSheetWillPresent` | Emitted before the alert has presented. | `CustomEvent` | diff --git a/core/src/components/alert/alert.scss b/core/src/components/alert/alert.scss index e4cd5f5007..3844317d78 100644 --- a/core/src/components/alert/alert.scss +++ b/core/src/components/alert/alert.scss @@ -38,6 +38,10 @@ z-index: $z-index-overlay; } +:host(.overlay-hidden) { + display: none; +} + :host(.alert-top) { @include padding(50px, null, null, null); diff --git a/core/src/components/alert/alert.tsx b/core/src/components/alert/alert.tsx index c9db76019e..0f13c677fd 100644 --- a/core/src/components/alert/alert.tsx +++ b/core/src/components/alert/alert.tsx @@ -100,16 +100,6 @@ export class Alert implements ComponentInterface, OverlayInterface { */ @Prop() animated = true; - /** - * Emitted after the alert has presented. - */ - @Event() ionAlertDidLoad!: EventEmitter; - - /** - * Emitted before the alert has presented. - */ - @Event() ionAlertDidUnload!: EventEmitter; - /** * Emitted after the alert has presented. */ @@ -171,14 +161,6 @@ export class Alert implements ComponentInterface, OverlayInterface { this.buttonsChanged(); } - componentDidLoad() { - this.ionAlertDidLoad.emit(); - } - - componentDidUnload() { - this.ionAlertDidUnload.emit(); - } - @Listen('ionBackdropTap') protected onBackdropTap() { this.dismiss(undefined, BACKDROP); diff --git a/core/src/components/alert/readme.md b/core/src/components/alert/readme.md index 5925064faa..83da1c6b48 100644 --- a/core/src/components/alert/readme.md +++ b/core/src/components/alert/readme.md @@ -551,9 +551,7 @@ async function presentAlertCheckbox() { | Event | Description | Type | | --------------------- | --------------------------------------- | --------------------------------- | | `ionAlertDidDismiss` | Emitted after the alert has dismissed. | `CustomEvent` | -| `ionAlertDidLoad` | Emitted after the alert has presented. | `CustomEvent` | | `ionAlertDidPresent` | Emitted after the alert has presented. | `CustomEvent` | -| `ionAlertDidUnload` | Emitted before the alert has presented. | `CustomEvent` | | `ionAlertWillDismiss` | Emitted before the alert has dismissed. | `CustomEvent` | | `ionAlertWillPresent` | Emitted before the alert has presented. | `CustomEvent` | diff --git a/core/src/components/loading/loading.scss b/core/src/components/loading/loading.scss index b6556c51ed..3e51fbdb3c 100644 --- a/core/src/components/loading/loading.scss +++ b/core/src/components/loading/loading.scss @@ -39,6 +39,10 @@ z-index: $z-index-overlay; } +:host(.overlay-hidden) { + display: none; +} + .loading-wrapper { display: flex; diff --git a/core/src/components/loading/loading.tsx b/core/src/components/loading/loading.tsx index be2208eb49..6d59427338 100644 --- a/core/src/components/loading/loading.tsx +++ b/core/src/components/loading/loading.tsx @@ -91,16 +91,6 @@ export class Loading implements ComponentInterface, OverlayInterface { */ @Prop() animated = true; - /** - * Emitted after the loading has unloaded. - */ - @Event() ionLoadingDidUnload!: EventEmitter; - - /** - * Emitted after the loading has loaded. - */ - @Event() ionLoadingDidLoad!: EventEmitter; - /** * Emitted after the loading has presented. */ @@ -127,14 +117,6 @@ export class Loading implements ComponentInterface, OverlayInterface { } } - componentDidLoad() { - this.ionLoadingDidLoad.emit(); - } - - componentDidUnload() { - this.ionLoadingDidUnload.emit(); - } - @Listen('ionBackdropTap') protected onBackdropTap() { this.dismiss(undefined, BACKDROP); diff --git a/core/src/components/loading/readme.md b/core/src/components/loading/readme.md index ebbc568640..2ac9eb8b6b 100644 --- a/core/src/components/loading/readme.md +++ b/core/src/components/loading/readme.md @@ -108,9 +108,7 @@ async function presentLoadingWithOptions() { | Event | Description | Type | | ----------------------- | ----------------------------------------- | --------------------------------- | | `ionLoadingDidDismiss` | Emitted after the loading has dismissed. | `CustomEvent` | -| `ionLoadingDidLoad` | Emitted after the loading has loaded. | `CustomEvent` | | `ionLoadingDidPresent` | Emitted after the loading has presented. | `CustomEvent` | -| `ionLoadingDidUnload` | Emitted after the loading has unloaded. | `CustomEvent` | | `ionLoadingWillDismiss` | Emitted before the loading has dismissed. | `CustomEvent` | | `ionLoadingWillPresent` | Emitted before the loading has presented. | `CustomEvent` | diff --git a/core/src/components/menu-button/menu-button.scss b/core/src/components/menu-button/menu-button.scss index 11bb8dc993..4eefed92f8 100644 --- a/core/src/components/menu-button/menu-button.scss +++ b/core/src/components/menu-button/menu-button.scss @@ -10,8 +10,6 @@ color: var(--color); - pointer-events: all; - text-align: center; text-decoration: none; text-overflow: ellipsis; diff --git a/core/src/components/modal/modal.scss b/core/src/components/modal/modal.scss index 5baba473d1..d48094f485 100644 --- a/core/src/components/modal/modal.scss +++ b/core/src/components/modal/modal.scss @@ -46,6 +46,10 @@ contain: strict; } +:host(.overlay-hidden) { + display: none; +} + .modal-wrapper { @include border-radius(var(--border-radius)); diff --git a/core/src/components/modal/modal.tsx b/core/src/components/modal/modal.tsx index f6d24d9014..9bfb2ee8ce 100644 --- a/core/src/components/modal/modal.tsx +++ b/core/src/components/modal/modal.tsx @@ -23,8 +23,8 @@ export class Modal implements ComponentInterface, OverlayInterface { private usersElement?: HTMLElement; - animation: Animation | undefined; presented = false; + animation: Animation | undefined; @Element() el!: HTMLElement; @@ -87,16 +87,6 @@ export class Modal implements ComponentInterface, OverlayInterface { */ @Prop() animated = true; - /** - * Emitted after the modal has loaded. - */ - @Event() ionModalDidLoad!: EventEmitter; - - /** - * Emitted after the modal has unloaded. - */ - @Event() ionModalDidUnload!: EventEmitter; - /** * Emitted after the modal has presented. */ @@ -117,14 +107,6 @@ export class Modal implements ComponentInterface, OverlayInterface { */ @Event({ eventName: 'ionModalDidDismiss' }) didDismiss!: EventEmitter; - componentDidLoad() { - this.ionModalDidLoad.emit(); - } - - componentDidUnload() { - this.ionModalDidUnload.emit(); - } - @Listen('ionDismiss') protected onDismiss(ev: UIEvent) { ev.stopPropagation(); diff --git a/core/src/components/modal/readme.md b/core/src/components/modal/readme.md index a89c96ed95..df43b57e8d 100644 --- a/core/src/components/modal/readme.md +++ b/core/src/components/modal/readme.md @@ -162,9 +162,7 @@ async function presentModal() { | Event | Description | Type | | --------------------- | --------------------------------------- | --------------------------------- | | `ionModalDidDismiss` | Emitted after the modal has dismissed. | `CustomEvent` | -| `ionModalDidLoad` | Emitted after the modal has loaded. | `CustomEvent` | | `ionModalDidPresent` | Emitted after the modal has presented. | `CustomEvent` | -| `ionModalDidUnload` | Emitted after the modal has unloaded. | `CustomEvent` | | `ionModalWillDismiss` | Emitted before the modal has dismissed. | `CustomEvent` | | `ionModalWillPresent` | Emitted before the modal has presented. | `CustomEvent` | diff --git a/core/src/components/picker/picker.scss b/core/src/components/picker/picker.scss index 1e3c10f845..52873843fb 100644 --- a/core/src/components/picker/picker.scss +++ b/core/src/components/picker/picker.scss @@ -45,6 +45,10 @@ z-index: $z-index-overlay; } +:host(.overlay-hidden) { + display: none; +} + .picker-wrapper { @include border-radius(var(--border-radius)); @include position(null, 0, 0, 0); diff --git a/core/src/components/picker/picker.tsx b/core/src/components/picker/picker.tsx index c68f55d8d0..1c18deee40 100644 --- a/core/src/components/picker/picker.tsx +++ b/core/src/components/picker/picker.tsx @@ -1,4 +1,4 @@ -import { Component, ComponentInterface, Element, Event, EventEmitter, Listen, Method, Prop } from '@stencil/core'; +import { Component, ComponentInterface, Element, Event, EventEmitter, Listen, Method, Prop, State } from '@stencil/core'; import { Animation, AnimationBuilder, Config, CssClassMap, Mode, OverlayEventDetail, OverlayInterface, PickerButton, PickerColumn } from '../../interface'; import { dismiss, eventMethod, present } from '../../utils/overlays'; @@ -18,13 +18,14 @@ import { iosLeaveAnimation } from './animations/ios.leave'; export class Picker implements ComponentInterface, OverlayInterface { private durationTimeout: any; - presented = false; animation?: Animation; @Element() el!: HTMLElement; @Prop({ context: 'config' }) config!: Config; + @State() presented = false; + /** @internal */ @Prop() overlayIndex!: number; @@ -84,11 +85,6 @@ export class Picker implements ComponentInterface, OverlayInterface { */ @Prop() animated = true; - /** - * Emitted after the picker has loaded. - */ - @Event() ionPickerDidLoad!: EventEmitter; - /** * Emitted after the picker has presented. */ @@ -109,19 +105,6 @@ export class Picker implements ComponentInterface, OverlayInterface { */ @Event({ eventName: 'ionPickerDidDismiss' }) didDismiss!: EventEmitter; - /** - * Emitted after the picker has unloaded. - */ - @Event() ionPickerDidUnload!: EventEmitter; - - componentDidLoad() { - this.ionPickerDidLoad.emit(); - } - - componentDidUnload() { - this.ionPickerDidUnload.emit(); - } - @Listen('ionBackdropTap') protected onBackdropTap() { const cancelBtn = this.buttons.find(b => b.role === 'cancel'); @@ -253,7 +236,7 @@ export class Picker implements ComponentInterface, OverlayInterface {
- {this.columns.map(c => + {this.presented && this.columns.map(c => )}
diff --git a/core/src/components/picker/readme.md b/core/src/components/picker/readme.md index 60029c57ae..b3a1ef9e12 100644 --- a/core/src/components/picker/readme.md +++ b/core/src/components/picker/readme.md @@ -29,9 +29,7 @@ A Picker is a dialog that displays a row of buttons and columns underneath. It a | Event | Description | Type | | ---------------------- | ---------------------------------------- | --------------------------------- | | `ionPickerDidDismiss` | Emitted after the picker has dismissed. | `CustomEvent` | -| `ionPickerDidLoad` | Emitted after the picker has loaded. | `CustomEvent` | | `ionPickerDidPresent` | Emitted after the picker has presented. | `CustomEvent` | -| `ionPickerDidUnload` | Emitted after the picker has unloaded. | `CustomEvent` | | `ionPickerWillDismiss` | Emitted before the picker has dismissed. | `CustomEvent` | | `ionPickerWillPresent` | Emitted before the picker has presented. | `CustomEvent` | diff --git a/core/src/components/popover/popover.scss b/core/src/components/popover/popover.scss index 8249f06348..59ca5c7674 100644 --- a/core/src/components/popover/popover.scss +++ b/core/src/components/popover/popover.scss @@ -35,6 +35,10 @@ z-index: $z-index-overlay; } +:host(.overlay-hidden) { + display: none; +} + .popover-wrapper { opacity: 0; z-index: $z-index-overlay-wrapper; diff --git a/core/src/components/popover/popover.tsx b/core/src/components/popover/popover.tsx index ec81ff9cda..7115e34e8d 100644 --- a/core/src/components/popover/popover.tsx +++ b/core/src/components/popover/popover.tsx @@ -97,16 +97,6 @@ export class Popover implements ComponentInterface, OverlayInterface { */ @Prop() animated = true; - /** - * Emitted after the popover has loaded. - */ - @Event() ionPopoverDidLoad!: EventEmitter; - - /** - * Emitted after the popover has unloaded. - */ - @Event() ionPopoverDidUnload!: EventEmitter; - /** * Emitted after the popover has presented. */ @@ -127,14 +117,6 @@ export class Popover implements ComponentInterface, OverlayInterface { */ @Event({ eventName: 'ionPopoverDidDismiss' }) didDismiss!: EventEmitter; - componentDidLoad() { - this.ionPopoverDidLoad.emit(); - } - - componentDidUnload() { - this.ionPopoverDidUnload.emit(); - } - @Listen('ionDismiss') protected onDismiss(ev: UIEvent) { ev.stopPropagation(); @@ -215,7 +197,6 @@ export class Popover implements ComponentInterface, OverlayInterface { } hostData() { - return { style: { zIndex: 20000 + this.overlayIndex, diff --git a/core/src/components/popover/readme.md b/core/src/components/popover/readme.md index 1ed2017325..5f5becc3a1 100644 --- a/core/src/components/popover/readme.md +++ b/core/src/components/popover/readme.md @@ -84,9 +84,7 @@ async function presentPopover(ev) { | Event | Description | Type | | ----------------------- | ----------------------------------------- | --------------------------------- | | `ionPopoverDidDismiss` | Emitted after the popover has dismissed. | `CustomEvent` | -| `ionPopoverDidLoad` | Emitted after the popover has loaded. | `CustomEvent` | | `ionPopoverDidPresent` | Emitted after the popover has presented. | `CustomEvent` | -| `ionPopoverDidUnload` | Emitted after the popover has unloaded. | `CustomEvent` | | `ionPopoverWillDismiss` | Emitted before the popover has dismissed. | `CustomEvent` | | `ionPopoverWillPresent` | Emitted before the popover has presented. | `CustomEvent` | diff --git a/core/src/components/toast/readme.md b/core/src/components/toast/readme.md index 408f1dc784..0e41ee2cb1 100644 --- a/core/src/components/toast/readme.md +++ b/core/src/components/toast/readme.md @@ -111,9 +111,7 @@ async function presentToastWithOptions() { | Event | Description | Type | | --------------------- | --------------------------------------- | --------------------------------- | | `ionToastDidDismiss` | Emitted after the toast has dismissed. | `CustomEvent` | -| `ionToastDidLoad` | Emitted after the toast has loaded. | `CustomEvent` | | `ionToastDidPresent` | Emitted after the toast has presented. | `CustomEvent` | -| `ionToastDidUnload` | Emitted after the toast has unloaded. | `CustomEvent` | | `ionToastWillDismiss` | Emitted before the toast has dismissed. | `CustomEvent` | | `ionToastWillPresent` | Emitted before the toast has presented. | `CustomEvent` | diff --git a/core/src/components/toast/toast.scss b/core/src/components/toast/toast.scss index 1b97e05696..025be08a92 100644 --- a/core/src/components/toast/toast.scss +++ b/core/src/components/toast/toast.scss @@ -52,6 +52,10 @@ pointer-events: none; } +:host(.overlay-hidden) { + display: none; +} + :host(.ion-color) { --button-color: inherit; diff --git a/core/src/components/toast/toast.tsx b/core/src/components/toast/toast.tsx index 1e8f35266c..445b522db4 100644 --- a/core/src/components/toast/toast.tsx +++ b/core/src/components/toast/toast.tsx @@ -103,11 +103,6 @@ export class Toast implements ComponentInterface, OverlayInterface { */ @Prop() animated = true; - /** - * Emitted after the toast has loaded. - */ - @Event() ionToastDidLoad!: EventEmitter; - /** * Emitted after the toast has presented. */ @@ -128,19 +123,6 @@ export class Toast implements ComponentInterface, OverlayInterface { */ @Event({ eventName: 'ionToastDidDismiss' }) didDismiss!: EventEmitter; - /** - * Emitted after the toast has unloaded. - */ - @Event() ionToastDidUnload!: EventEmitter; - - componentDidLoad() { - this.ionToastDidLoad.emit(); - } - - componentDidUnload() { - this.ionToastDidUnload.emit(); - } - /** * Present the toast overlay after it has been created. */ diff --git a/core/src/utils/overlays.ts b/core/src/utils/overlays.ts index 82c10a91fd..22a7da6022 100644 --- a/core/src/utils/overlays.ts +++ b/core/src/utils/overlays.ts @@ -9,7 +9,7 @@ export function createOverlay(element: T, opts: // convert the passed in overlay options into props // that get passed down into the new overlay Object.assign(element, opts); - element.classList.add('ion-page-invisible'); + element.classList.add('overlay-hidden'); const overlayIndex = lastId++; element.overlayIndex = overlayIndex; if (!element.hasAttribute('id')) { @@ -142,7 +142,7 @@ async function overlayAnimation( } else { // Make overlay visible in case it's hidden - baseEl.classList.remove('ion-page-invisible'); + baseEl.classList.remove('overlay-hidden'); const aniRoot = baseEl.shadowRoot || overlay.el; const animation = overlay.animation = await import('./animation').then(mod => mod.create(animationBuilder, aniRoot, opts));