Make show() and showModal() return a promise that resolves with "confirmed" or "dismissed"
This commit is contained in:
parent
54f9f3cb5d
commit
52d2fc7d33
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@tp/tp-dialog",
|
"name": "@tp/tp-dialog",
|
||||||
"version": "1.3.0",
|
"version": "1.4.0",
|
||||||
"description": "",
|
"description": "",
|
||||||
"main": "tp-dialog.js",
|
"main": "tp-dialog.js",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
|
50
tp-dialog.js
50
tp-dialog.js
@ -84,22 +84,35 @@ class TpDialog extends EventHelpers(LitElement) {
|
|||||||
constructor() {
|
constructor() {
|
||||||
super();
|
super();
|
||||||
this._handleEscKey = this._handleEscKey.bind(this);
|
this._handleEscKey = this._handleEscKey.bind(this);
|
||||||
|
this._currentPromise = null;
|
||||||
|
this._resolvePromise = null;
|
||||||
}
|
}
|
||||||
|
|
||||||
connectedCallback() {
|
connectedCallback() {
|
||||||
super.connectedCallback();
|
super.connectedCallback();
|
||||||
this.listen(this, 'click', '_onDialogClick');
|
this.listen(this, 'click', '_onDialogClick');
|
||||||
this.listen(this, 'dialog-close', 'close');
|
this.listen(this, 'dialog-close', 'close');
|
||||||
|
this.listen(this, 'confirmed', '_handleConfirmed');
|
||||||
|
this.listen(this, 'dismissed', '_handleDismissed');
|
||||||
}
|
}
|
||||||
|
|
||||||
disconnectedCallback() {
|
disconnectedCallback() {
|
||||||
super.disconnectedCallback();
|
super.disconnectedCallback();
|
||||||
this.unlisten(this, 'click', '_onDialogClick');
|
this.unlisten(this, 'click', '_onDialogClick');
|
||||||
this.unlisten(this, 'dialog-close', 'close');
|
this.unlisten(this, 'dialog-close', 'close');
|
||||||
|
this.unlisten(this, 'confirmed', '_handleConfirmed');
|
||||||
|
this.unlisten(this, 'dismissed', '_handleDismissed');
|
||||||
|
|
||||||
if (this.closeOnEsc) {
|
if (this.closeOnEsc) {
|
||||||
document.removeEventListener('keydown', this._handleEscKey);
|
document.removeEventListener('keydown', this._handleEscKey);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Clean up promise if dialog is removed while open
|
||||||
|
if (this._currentPromise && this._resolvePromise) {
|
||||||
|
this._resolvePromise('dismissed');
|
||||||
|
this._currentPromise = null;
|
||||||
|
this._resolvePromise = null;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
show() {
|
show() {
|
||||||
@ -109,6 +122,13 @@ class TpDialog extends EventHelpers(LitElement) {
|
|||||||
if (this.closeOnEsc) {
|
if (this.closeOnEsc) {
|
||||||
document.addEventListener('keydown', this._handleEscKey, { once: true });
|
document.addEventListener('keydown', this._handleEscKey, { once: true });
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Create and return a new promise
|
||||||
|
this._currentPromise = new Promise((resolve) => {
|
||||||
|
this._resolvePromise = resolve;
|
||||||
|
});
|
||||||
|
|
||||||
|
return this._currentPromise;
|
||||||
}
|
}
|
||||||
|
|
||||||
showModal() {
|
showModal() {
|
||||||
@ -122,6 +142,13 @@ class TpDialog extends EventHelpers(LitElement) {
|
|||||||
if (this.closeOnOutsideClick) {
|
if (this.closeOnOutsideClick) {
|
||||||
this.addEventListener('click', this._handleOutsideClick, { once: true });
|
this.addEventListener('click', this._handleOutsideClick, { once: true });
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Create and return a new promise
|
||||||
|
this._currentPromise = new Promise((resolve) => {
|
||||||
|
this._resolvePromise = resolve;
|
||||||
|
});
|
||||||
|
|
||||||
|
return this._currentPromise;
|
||||||
}
|
}
|
||||||
|
|
||||||
close(e) {
|
close(e) {
|
||||||
@ -133,6 +160,29 @@ class TpDialog extends EventHelpers(LitElement) {
|
|||||||
this.dialog.close();
|
this.dialog.close();
|
||||||
this.dispatchEvent(new CustomEvent('closed', { detail: null, bubbles: true, composed: true }));
|
this.dispatchEvent(new CustomEvent('closed', { detail: null, bubbles: true, composed: true }));
|
||||||
this.open = false;
|
this.open = false;
|
||||||
|
|
||||||
|
// If closed without explicit confirm/dismiss (like ESC key), treat as dismissed
|
||||||
|
if (this._currentPromise && this._resolvePromise) {
|
||||||
|
this._resolvePromise('dismissed');
|
||||||
|
this._currentPromise = null;
|
||||||
|
this._resolvePromise = null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
_handleConfirmed(event) {
|
||||||
|
if (this._currentPromise && this._resolvePromise) {
|
||||||
|
this._resolvePromise('confirmed');
|
||||||
|
this._currentPromise = null;
|
||||||
|
this._resolvePromise = null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
_handleDismissed(event) {
|
||||||
|
if (this._currentPromise && this._resolvePromise) {
|
||||||
|
this._resolvePromise('dismissed');
|
||||||
|
this._currentPromise = null;
|
||||||
|
this._resolvePromise = null;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
_onDialogClick(event) {
|
_onDialogClick(event) {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user