mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-11-08 23:58:13 +08:00
docs(overlays): clarify how to remove an overlay (#28989)
In https://github.com/ionic-team/ionic-framework/issues/28981 there was some confusion surrounding how to remove an overlay from the DOM if it was never presented. The `dismiss` method will remove the overlay from the DOM, but only if the overlay is visible. Otherwise, it's a no-op. This PR updates the `dismiss` method docs for each overlay component to note that developers can use the browser's remove method to remove the element from the DOM.
This commit is contained in:
14
core/src/components.d.ts
vendored
14
core/src/components.d.ts
vendored
@ -160,7 +160,7 @@ export namespace Components {
|
|||||||
/**
|
/**
|
||||||
* Dismiss the action sheet overlay after it has been presented.
|
* Dismiss the action sheet overlay after it has been presented.
|
||||||
* @param data Any data to emit in the dismiss events.
|
* @param data Any data to emit in the dismiss events.
|
||||||
* @param role The role of the element that is dismissing the action sheet. This can be useful in a button handler for determining which button was clicked to dismiss the action sheet. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
|
* @param role The role of the element that is dismissing the action sheet. This can be useful in a button handler for determining which button was clicked to dismiss the action sheet. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`. This is a no-op if the overlay has not been presented yet. If you want to remove an overlay from the DOM that was never presented, use the [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
|
||||||
*/
|
*/
|
||||||
"dismiss": (data?: any, role?: string) => Promise<boolean>;
|
"dismiss": (data?: any, role?: string) => Promise<boolean>;
|
||||||
/**
|
/**
|
||||||
@ -239,7 +239,7 @@ export namespace Components {
|
|||||||
/**
|
/**
|
||||||
* Dismiss the alert overlay after it has been presented.
|
* Dismiss the alert overlay after it has been presented.
|
||||||
* @param data Any data to emit in the dismiss events.
|
* @param data Any data to emit in the dismiss events.
|
||||||
* @param role The role of the element that is dismissing the alert. This can be useful in a button handler for determining which button was clicked to dismiss the alert. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
|
* @param role The role of the element that is dismissing the alert. This can be useful in a button handler for determining which button was clicked to dismiss the alert. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`. This is a no-op if the overlay has not been presented yet. If you want to remove an overlay from the DOM that was never presented, use the [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
|
||||||
*/
|
*/
|
||||||
"dismiss": (data?: any, role?: string) => Promise<boolean>;
|
"dismiss": (data?: any, role?: string) => Promise<boolean>;
|
||||||
/**
|
/**
|
||||||
@ -1527,7 +1527,7 @@ export namespace Components {
|
|||||||
/**
|
/**
|
||||||
* Dismiss the loading overlay after it has been presented.
|
* Dismiss the loading overlay after it has been presented.
|
||||||
* @param data Any data to emit in the dismiss events.
|
* @param data Any data to emit in the dismiss events.
|
||||||
* @param role The role of the element that is dismissing the loading. This can be useful in a button handler for determining which button was clicked to dismiss the loading. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
|
* @param role The role of the element that is dismissing the loading. This can be useful in a button handler for determining which button was clicked to dismiss the loading. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`. This is a no-op if the overlay has not been presented yet. If you want to remove an overlay from the DOM that was never presented, use the [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
|
||||||
*/
|
*/
|
||||||
"dismiss": (data?: any, role?: string) => Promise<boolean>;
|
"dismiss": (data?: any, role?: string) => Promise<boolean>;
|
||||||
/**
|
/**
|
||||||
@ -1720,7 +1720,7 @@ export namespace Components {
|
|||||||
/**
|
/**
|
||||||
* Dismiss the modal overlay after it has been presented.
|
* Dismiss the modal overlay after it has been presented.
|
||||||
* @param data Any data to emit in the dismiss events.
|
* @param data Any data to emit in the dismiss events.
|
||||||
* @param role The role of the element that is dismissing the modal. For example, 'cancel' or 'backdrop'.
|
* @param role The role of the element that is dismissing the modal. For example, 'cancel' or 'backdrop'. This is a no-op if the overlay has not been presented yet. If you want to remove an overlay from the DOM that was never presented, use the [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
|
||||||
*/
|
*/
|
||||||
"dismiss": (data?: any, role?: string) => Promise<boolean>;
|
"dismiss": (data?: any, role?: string) => Promise<boolean>;
|
||||||
/**
|
/**
|
||||||
@ -1973,7 +1973,7 @@ export namespace Components {
|
|||||||
/**
|
/**
|
||||||
* Dismiss the picker overlay after it has been presented.
|
* Dismiss the picker overlay after it has been presented.
|
||||||
* @param data Any data to emit in the dismiss events.
|
* @param data Any data to emit in the dismiss events.
|
||||||
* @param role The role of the element that is dismissing the picker. This can be useful in a button handler for determining which button was clicked to dismiss the picker. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
|
* @param role The role of the element that is dismissing the picker. This can be useful in a button handler for determining which button was clicked to dismiss the picker. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`. This is a no-op if the overlay has not been presented yet. If you want to remove an overlay from the DOM that was never presented, use the [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
|
||||||
*/
|
*/
|
||||||
"dismiss": (data?: any, role?: string) => Promise<boolean>;
|
"dismiss": (data?: any, role?: string) => Promise<boolean>;
|
||||||
/**
|
/**
|
||||||
@ -2110,7 +2110,7 @@ export namespace Components {
|
|||||||
* Dismiss the popover overlay after it has been presented.
|
* Dismiss the popover overlay after it has been presented.
|
||||||
* @param data Any data to emit in the dismiss events.
|
* @param data Any data to emit in the dismiss events.
|
||||||
* @param role The role of the element that is dismissing the popover. For example, 'cancel' or 'backdrop'.
|
* @param role The role of the element that is dismissing the popover. For example, 'cancel' or 'backdrop'.
|
||||||
* @param dismissParentPopover If `true`, dismissing this popover will also dismiss a parent popover if this popover is nested. Defaults to `true`.
|
* @param dismissParentPopover If `true`, dismissing this popover will also dismiss a parent popover if this popover is nested. Defaults to `true`. This is a no-op if the overlay has not been presented yet. If you want to remove an overlay from the DOM that was never presented, use the [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
|
||||||
*/
|
*/
|
||||||
"dismiss": (data?: any, role?: string, dismissParentPopover?: boolean) => Promise<boolean>;
|
"dismiss": (data?: any, role?: string, dismissParentPopover?: boolean) => Promise<boolean>;
|
||||||
/**
|
/**
|
||||||
@ -3111,7 +3111,7 @@ export namespace Components {
|
|||||||
/**
|
/**
|
||||||
* Dismiss the toast overlay after it has been presented.
|
* Dismiss the toast overlay after it has been presented.
|
||||||
* @param data Any data to emit in the dismiss events.
|
* @param data Any data to emit in the dismiss events.
|
||||||
* @param role The role of the element that is dismissing the toast. This can be useful in a button handler for determining which button was clicked to dismiss the toast. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
|
* @param role The role of the element that is dismissing the toast. This can be useful in a button handler for determining which button was clicked to dismiss the toast. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`. This is a no-op if the overlay has not been presented yet. If you want to remove an overlay from the DOM that was never presented, use the [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
|
||||||
*/
|
*/
|
||||||
"dismiss": (data?: any, role?: string) => Promise<boolean>;
|
"dismiss": (data?: any, role?: string) => Promise<boolean>;
|
||||||
/**
|
/**
|
||||||
|
|||||||
@ -216,6 +216,10 @@ export class ActionSheet implements ComponentInterface, OverlayInterface {
|
|||||||
* This can be useful in a button handler for determining which button was
|
* This can be useful in a button handler for determining which button was
|
||||||
* clicked to dismiss the action sheet.
|
* clicked to dismiss the action sheet.
|
||||||
* Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
|
* Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
|
||||||
|
*
|
||||||
|
* This is a no-op if the overlay has not been presented yet. If you want
|
||||||
|
* to remove an overlay from the DOM that was never presented, use the
|
||||||
|
* [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
|
||||||
*/
|
*/
|
||||||
@Method()
|
@Method()
|
||||||
async dismiss(data?: any, role?: string): Promise<boolean> {
|
async dismiss(data?: any, role?: string): Promise<boolean> {
|
||||||
|
|||||||
@ -411,6 +411,10 @@ export class Alert implements ComponentInterface, OverlayInterface {
|
|||||||
* This can be useful in a button handler for determining which button was
|
* This can be useful in a button handler for determining which button was
|
||||||
* clicked to dismiss the alert.
|
* clicked to dismiss the alert.
|
||||||
* Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
|
* Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
|
||||||
|
*
|
||||||
|
* This is a no-op if the overlay has not been presented yet. If you want
|
||||||
|
* to remove an overlay from the DOM that was never presented, use the
|
||||||
|
* [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
|
||||||
*/
|
*/
|
||||||
@Method()
|
@Method()
|
||||||
async dismiss(data?: any, role?: string): Promise<boolean> {
|
async dismiss(data?: any, role?: string): Promise<boolean> {
|
||||||
|
|||||||
@ -268,6 +268,10 @@ export class Loading implements ComponentInterface, OverlayInterface {
|
|||||||
* This can be useful in a button handler for determining which button was
|
* This can be useful in a button handler for determining which button was
|
||||||
* clicked to dismiss the loading.
|
* clicked to dismiss the loading.
|
||||||
* Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
|
* Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
|
||||||
|
*
|
||||||
|
* This is a no-op if the overlay has not been presented yet. If you want
|
||||||
|
* to remove an overlay from the DOM that was never presented, use the
|
||||||
|
* [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
|
||||||
*/
|
*/
|
||||||
@Method()
|
@Method()
|
||||||
async dismiss(data?: any, role?: string): Promise<boolean> {
|
async dismiss(data?: any, role?: string): Promise<boolean> {
|
||||||
|
|||||||
@ -662,6 +662,10 @@ export class Modal implements ComponentInterface, OverlayInterface {
|
|||||||
*
|
*
|
||||||
* @param data Any data to emit in the dismiss events.
|
* @param data Any data to emit in the dismiss events.
|
||||||
* @param role The role of the element that is dismissing the modal. For example, 'cancel' or 'backdrop'.
|
* @param role The role of the element that is dismissing the modal. For example, 'cancel' or 'backdrop'.
|
||||||
|
*
|
||||||
|
* This is a no-op if the overlay has not been presented yet. If you want
|
||||||
|
* to remove an overlay from the DOM that was never presented, use the
|
||||||
|
* [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
|
||||||
*/
|
*/
|
||||||
@Method()
|
@Method()
|
||||||
async dismiss(data?: any, role?: string): Promise<boolean> {
|
async dismiss(data?: any, role?: string): Promise<boolean> {
|
||||||
|
|||||||
@ -248,6 +248,10 @@ export class Picker implements ComponentInterface, OverlayInterface {
|
|||||||
* This can be useful in a button handler for determining which button was
|
* This can be useful in a button handler for determining which button was
|
||||||
* clicked to dismiss the picker.
|
* clicked to dismiss the picker.
|
||||||
* Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
|
* Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
|
||||||
|
*
|
||||||
|
* This is a no-op if the overlay has not been presented yet. If you want
|
||||||
|
* to remove an overlay from the DOM that was never presented, use the
|
||||||
|
* [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
|
||||||
*/
|
*/
|
||||||
@Method()
|
@Method()
|
||||||
async dismiss(data?: any, role?: string): Promise<boolean> {
|
async dismiss(data?: any, role?: string): Promise<boolean> {
|
||||||
|
|||||||
@ -525,6 +525,10 @@ export class Popover implements ComponentInterface, PopoverInterface {
|
|||||||
* @param role The role of the element that is dismissing the popover. For example, 'cancel' or 'backdrop'.
|
* @param role The role of the element that is dismissing the popover. For example, 'cancel' or 'backdrop'.
|
||||||
* @param dismissParentPopover If `true`, dismissing this popover will also dismiss
|
* @param dismissParentPopover If `true`, dismissing this popover will also dismiss
|
||||||
* a parent popover if this popover is nested. Defaults to `true`.
|
* a parent popover if this popover is nested. Defaults to `true`.
|
||||||
|
*
|
||||||
|
* This is a no-op if the overlay has not been presented yet. If you want
|
||||||
|
* to remove an overlay from the DOM that was never presented, use the
|
||||||
|
* [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
|
||||||
*/
|
*/
|
||||||
@Method()
|
@Method()
|
||||||
async dismiss(data?: any, role?: string, dismissParentPopover = true): Promise<boolean> {
|
async dismiss(data?: any, role?: string, dismissParentPopover = true): Promise<boolean> {
|
||||||
|
|||||||
@ -401,6 +401,10 @@ export class Toast implements ComponentInterface, OverlayInterface {
|
|||||||
* This can be useful in a button handler for determining which button was
|
* This can be useful in a button handler for determining which button was
|
||||||
* clicked to dismiss the toast.
|
* clicked to dismiss the toast.
|
||||||
* Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
|
* Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
|
||||||
|
*
|
||||||
|
* This is a no-op if the overlay has not been presented yet. If you want
|
||||||
|
* to remove an overlay from the DOM that was never presented, use the
|
||||||
|
* [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
|
||||||
*/
|
*/
|
||||||
@Method()
|
@Method()
|
||||||
async dismiss(data?: any, role?: string): Promise<boolean> {
|
async dismiss(data?: any, role?: string): Promise<boolean> {
|
||||||
|
|||||||
Reference in New Issue
Block a user