@moni-labs/moni-ui 0.4.16 → 0.4.17

package/dist/browser/moni-ui.min.js

@@ -1943,7 +1943,27 @@ var Je = class extends W {
 		this.modal && e.target === this._dialog && this._animateAndClose();
 	}
 	updated(e) {
-		super.updated(e), e.has("expandedHeight") && this.style.setProperty("--moni-bottom-sheet-expanded-height", this.expandedHeight), e.has("maxWidth") && this.style.setProperty("--moni-bottom-sheet-max-width", this.maxWidth || "100%"), e.has("open") && (this.open ? (this._isClosing = !1, this._isDragging = !1, this._lastDeltaY = 0, this._dialog && (this._dialog.classList.remove("dragging", "expanded"), this._dialog.style.transform = "", this._dialog.style.height = ""), e.get("open") !== void 0 && qe(this, "moni-open"), this.positioning === "body" && this.parentNode !== document.body && (this._originalParent = this.parentNode, this._originalSibling = this.nextSibling, document.body.appendChild(this)), e.get("open") !== void 0 && setTimeout(() => qe(this, "moni-opened"), 300)) : (this._isClosing = !1, this._isDragging = !1, this._lastDeltaY = 0, this._dialog && (this._dialog.classList.remove("expanded", "dragging"), this._dialog.style.transform = "", this._dialog.style.height = ""), this.positioning === "body" && this._originalParent && this.parentNode === document.body && (this._originalParent.insertBefore(this, this._originalSibling), this._originalParent = null, this._originalSibling = null)));
+		if (super.updated(e), e.has("expandedHeight") && this.style.setProperty("--moni-bottom-sheet-expanded-height", this.expandedHeight), e.has("maxWidth") && this.style.setProperty("--moni-bottom-sheet-max-width", this.maxWidth || "100%"), e.has("open") && (this.open ? (this._isClosing = !1, this._isDragging = !1, this._lastDeltaY = 0, this._dialog && (this._dialog.classList.remove("dragging", "expanded"), this._dialog.style.transform = "", this._dialog.style.height = ""), e.get("open") !== void 0 && qe(this, "moni-open"), this.positioning === "body" && this.parentNode !== document.body && (this._originalParent = this.parentNode, this._originalSibling = this.nextSibling, document.body.appendChild(this)), e.get("open") !== void 0 && setTimeout(() => qe(this, "moni-opened"), 300)) : (this._isClosing = !1, this._isDragging = !1, this._lastDeltaY = 0, this._dialog && (this._dialog.classList.remove("expanded", "dragging"), this._dialog.style.transform = "", this._dialog.style.height = ""), this.positioning === "body" && this._originalParent && this.parentNode === document.body && (this._originalParent.insertBefore(this, this._originalSibling), this._originalParent = null, this._originalSibling = null)), this._dialog)) {
+			let e = this._dialog;
+			if (this.open) {
+				if (this.modal && typeof e.showModal == "function") {
+					let t = !1;
+					try {
+						t = this._dialog.matches(":modal");
+					} catch {
+						t = !1;
+					}
+					if (!t) try {
+						e.showModal();
+					} catch {}
+				} else if (!this.modal && typeof e.show == "function") try {
+					e.show();
+				} catch {}
+				else (this.modal && typeof e.showModal != "function" || !this.modal && typeof e.show != "function") && (this._dialog.open = !0);
+			} else if (typeof e.close == "function") try {
+				e.close();
+			} catch {}
+		}
 	}
 	disconnectedCallback() {
 		super.disconnectedCallback(), this.parentNode === document.body && this.positioning === "body" && this._originalParent && this._originalParent.insertBefore(this, this._originalSibling);
@@ -1987,6 +2007,10 @@ var Je = class extends W {
 				transform: translateY(0);
 			}
 
+			dialog::backdrop {
+				background-color: rgb(0 0 0 / 0.5);
+			}
+
 			dialog.fixed {
 				position: fixed;
 				inset: auto 0 0 0;