@blackcube/aurelia-kit 1.0.0-rc1 → 1.0.0-rc2

package/README.md

@@ -12,7 +12,7 @@ widgets, styled with Tailwind classes written in the PHP markup. The HTTP layer
 npm install @blackcube/aurelia-kit @blackcube/aurelia-api
 ```
 
-Peer dependencies: `aurelia` `^2.0.0-rc.2`, `@blackcube/aurelia-api` `^1.0.0`.
+Peer dependencies: `aurelia` `^2.0.0-rc.2`, `@blackcube/aurelia-api` `^1.0.0-rc1`.
 
 The package is ESM only (`dist/index.es.js`, built by Vite in library mode); the application bundler resolves it.
 
@@ -101,6 +101,7 @@ sends. Its template holds no markup of its own:
     <au-slot name="loader" if.bind="loading"><progress></progress></au-slot>
     <template else>
         <au-compose if.bind="contentView" template.bind="contentView"></au-compose>
+        <au-slot else></au-slot>
     </template>
 </dialog>
 ```
@@ -140,12 +141,17 @@ Behavior:
 - `content` is the whole HTML of the dialog (frame, header, body, footer), rendered by the server; it becomes the
   view of the `au-compose`, so the `bleet-*` attributes it holds work. A response without `content` keeps the
   current view.
+- `Open` (or `Toggle` when closed) with a `content` and no `url`: that HTML is shown as the server's would be, without
+  request (the same view, its `bleet-*` attributes, its forms posted by the element) — a page that already holds the
+  HTML (a confirmation, a `<template>` of the page).
 - A `<form>` submitted inside the dialog is posted by the element (multipart, method from `_method` or the form,
   POST by default, with the clicked submit button `name` / `value`); its `IDialogResponse` is applied the same way.
 - A `<form>` marked `data-dialog="native"` is not intercepted: the browser submits it (download, plain post).
 - A click on an element inside `[data-dialog="close"]`, the Escape key, or a click on the overlay closes the dialog
   with the hide transition; closing empties the view. A `cancel` coming from an `<input type="file">` (file chooser
   dismissed) does not close it. An `Open` received while the dialog is closing cancels the closing.
+- Escape while a menu of the dialog is open (`[aria-expanded="true"]`: `bleet-dropdown`, `bleet-profile`) closes
+  that menu, not the dialog.
 - Statuses `Opening`, `Opened`, `Closing`, `Closed` (with the `id`) on `Channels.ModalStatus`.
 
 ```typescript
@@ -163,6 +169,28 @@ interface IDialogResponse {
 
 PHP side, `AureliaCommunication::dialogContent($content, $color)` builds the `content` / `color` part of it.
 
+**In a SPA**, the content is the application's: its frame and its view go in the default slot of `<bleet-dialog>`,
+written once in the shell, and the dialog is opened without `url`:
+
+```html
+<bleet-dialog id="drawer"
+              data-dialog-class="… translate-x-full"
+              data-dialog-show="translate-x-0"
+              data-dialog-hide="translate-x-full">
+    <header …>${$host.title} <button type="button" data-dialog="close">…</button></header>
+    <au-viewport name="drawer"></au-viewport>
+</bleet-dialog>
+```
+
+```typescript
+resolve(IEventAggregator).publish(Channels.Modal, <IModal>{ action: ModalAction.Open, id: 'drawer', title: 'Edit user', color: UiColor.Primary });
+```
+
+- `Open` (or `Toggle` when closed) with neither `url` nor `content` opens the dialog on its default slot; its `title`
+  and `color` are kept on the element for the frame (`$host.title`, `$host.color`) until it is closed.
+- A form of the default slot is not posted by the element: it belongs to the page that projects it.
+- `ModalStatus.Closed` with the `id` tells the page the dialog is closed (its route can be left).
+
 ## Ajaxify
 
 ### `<bleet-ajaxify>`
@@ -538,6 +566,17 @@ Behavior:
   is selected, the `count` template text beyond.
 - The panel does not open while the native select is disabled.
 
+### `bleet-focus`
+
+An element that takes the focus as it appears — a field or a message shown later (a condition of the page, a fragment
+loaded by ajaxify):
+
+```html
+<input bleet-focus …>
+```
+
+When attached, the element is focused on the next frame; the browser brings it into view.
+
 ## Upload channel
 
 `Channels.Upload` carries `IUpload` (`{ action: UploadAction.Reset, id?: string }`) for the upload bridges

package/dist/index.es.js

@@ -3627,26 +3627,178 @@ var Hr = l("bleet-overlay"), Ur, Wr;
 	}
 });
 //#endregion
+//#region src/attributes/focus.ts
+function Gr(e, t) {
+	if (typeof e != "object" || !e) return e;
+	var n = e[Symbol.toPrimitive];
+	if (n !== void 0) {
+		var r = n.call(e, t || "default");
+		if (typeof r != "object") return r;
+		throw TypeError("@@toPrimitive must return a primitive value.");
+	}
+	return (t === "string" ? String : Number)(e);
+}
+function Kr(e) {
+	var t = Gr(e, "string");
+	return typeof t == "symbol" ? t : String(t);
+}
+function qr(e) {
+	if (Object(e) !== e) throw TypeError("right-hand side of 'in' should be an object, got " + (e === null ? "null" : typeof e));
+	return e;
+}
+function Jr(e, t, n) {
+	typeof t == "symbol" && (t = t.description, t = t ? "[" + t + "]" : "");
+	try {
+		Object.defineProperty(e, "name", {
+			configurable: !0,
+			value: n ? n + " " + t : t
+		});
+	} catch {}
+	return e;
+}
+function Yr(e, t, n, r, i, a) {
+	var o = Symbol.metadata || Symbol.for("Symbol.metadata"), s = Object.defineProperty, c = Object.create, l, u = [c(null), c(null)], d = t.length, f;
+	function p(t, n, r) {
+		return function(i, a) {
+			n && (a = i, i = e);
+			for (var o = 0; o < t.length; o++) a = t[o].apply(i, r ? [a] : []);
+			return r ? a : i;
+		};
+	}
+	function m(e, t, n, r) {
+		if (typeof e != "function" && (r || e !== void 0)) throw TypeError(t + " must " + (n || "be") + " a function" + (r ? "" : " or undefined"));
+		return e;
+	}
+	function h(e, t, n, r, i, a, o, c, d, h, g) {
+		function _(e) {
+			if (!g(e)) throw TypeError("Attempted to access private element on non-instance");
+		}
+		var v = [].concat(t[0]), y = t[3], b = !o, x = i === 1, S = i === 3, C = i === 4, w = i === 2;
+		function T(t, n, r) {
+			return function(i, a) {
+				return n && (a = i, i = e), r && r(i), desc[t].call(i, a);
+			};
+		}
+		var E = {}, D = [], O = S ? "get" : C || x ? "set" : "value";
+		if (!b && (d ? (h || x ? E = {
+			get: Jr(function() {
+				return y(this);
+			}, r, "get"),
+			set: function(e) {
+				t[4](this, e);
+			}
+		} : E[O] = y, h || Jr(E[O], r, w ? "" : O)) : h || (E = Object.getOwnPropertyDescriptor(e, r)), !h && !d)) {
+			if (f = u[+c][r], f && (f ^ i) !== 7) throw Error("Decorating two elements with the same name (" + E[O].name + ") is not supported yet");
+			u[+c][r] = i < 3 ? 1 : i;
+		}
+		for (var k = e, A = v.length - 1; A >= 0; A -= n ? 2 : 1) {
+			var j = m(v[A], "A decorator", "be", !0), M = n ? v[A - 1] : void 0, N = {}, P = {
+				kind: [
+					"field",
+					"accessor",
+					"method",
+					"getter",
+					"setter",
+					"class"
+				][i],
+				name: r,
+				metadata: l,
+				addInitializer: (function(e, t) {
+					if (e.v) throw TypeError("attempted to call addInitializer after decoration was finished");
+					m(t, "An initializer", "be", !0), a.push(t);
+				}).bind(null, N)
+			};
+			if (b) f = j.call(M, k, P), N.v = 1, m(f, "class decorators", "return") && (k = f);
+			else if (P.static = c, P.private = d, f = P.access = { has: d ? g.bind() : function(e) {
+				return r in e;
+			} }, C || (f.get = d ? w ? function(e) {
+				return _(e), E.value;
+			} : T("get", 0, _) : function(e) {
+				return e[r];
+			}), !w && !S && (f.set = d ? T("set", 0, _) : function(e, t) {
+				e[r] = t;
+			}), k = j.call(M, x ? {
+				get: E.get,
+				set: E.set
+			} : E[O], P), N.v = 1, x) {
+				if (typeof k == "object" && k) (f = m(k.get, "accessor.get")) && (E.get = f), (f = m(k.set, "accessor.set")) && (E.set = f), (f = m(k.init, "accessor.init")) && D.unshift(f);
+				else if (k !== void 0) throw TypeError("accessor decorators must return an object with get, set, or init properties or undefined");
+			} else m(k, (h ? "field" : "method") + " decorators", "return") && (h ? D.unshift(k) : E[O] = k);
+		}
+		return i < 2 && o.push(p(D, c, 1), p(a, c, 0)), !h && !b && (d ? x ? o.splice(-1, 0, T("get", c), T("set", c)) : o.push(w ? E[O] : m.call.bind(E[O])) : s(e, r, E)), k;
+	}
+	function g() {
+		var t = [], r, a, o = function(e) {
+			e && t.push(p(e));
+		}, s = function(o, s) {
+			for (var c = 0; c < n.length; c++) {
+				var l = n[c], u = l[1], d = u & 7;
+				if ((u & 8) == o && !d == s) {
+					var f = l[2], p = !!l[3], m = u & 16;
+					h(o ? e : e.prototype, l, m, p ? "#" + f : Kr(f), d, d < 2 ? [] : o ? a ||= [] : r ||= [], t, !!o, p, s, o && p ? function(t) {
+						return qr(t) === e;
+					} : i);
+				}
+			}
+		};
+		return s(8, 0), s(0, 0), s(8, 1), s(0, 1), o(r), o(a), t;
+	}
+	function _(e) {
+		return s(e, o, {
+			configurable: !0,
+			enumerable: !0,
+			value: l
+		});
+	}
+	return a !== void 0 && (l = a[o]), l = c(l ?? null), f = g(), d || _(e), {
+		e: f,
+		get c() {
+			var n = [];
+			return d && [_(e = h(e, [t], r, e.name, 5, n)), p(n, 1)];
+		}
+	};
+}
+var Xr = l("bleet-focus"), Zr, Qr;
+(class {
+	logger;
+	element;
+	p;
+	static {
+		({c: [Qr, Zr]} = Yr(this, [Xr], []));
+	}
+	constructor(e = f(a).scopeTo("bleet-focus"), t = f(o), n = f(s)) {
+		this.logger = e, this.element = t, this.p = n, this.logger.trace("constructor");
+	}
+	attached() {
+		this.logger.trace("attached"), this.p.requestAnimationFrame(() => {
+			this.element.focus();
+		});
+	}
+	static {
+		Zr();
+	}
+});
+//#endregion
 //#region src/components/bleet-ajaxify.$au.ts
-var Gr = /* @__PURE__ */ h({
-	bindables: () => Yr,
-	default: () => qr,
-	dependencies: () => Jr,
-	name: () => Kr,
-	register: () => Zr,
-	template: () => qr
-}), Kr = "bleet-ajaxify", qr = "<template>\n    <au-slot if.bind=\"!ajaxedView\"></au-slot>\n    <au-compose if.bind=\"ajaxedView\" template.bind=\"ajaxedView\"></au-compose>\n</template>\n", Jr = [], Yr = {}, Xr;
-function Zr(e) {
-	Xr ||= p.define({
-		name: Kr,
-		template: qr,
-		dependencies: Jr,
-		bindables: Yr
-	}), e.register(Xr);
+var $r = /* @__PURE__ */ h({
+	bindables: () => ri,
+	default: () => ti,
+	dependencies: () => ni,
+	name: () => ei,
+	register: () => ai,
+	template: () => ti
+}), ei = "bleet-ajaxify", ti = "<template>\n    <au-slot if.bind=\"!ajaxedView\"></au-slot>\n    <au-compose if.bind=\"ajaxedView\" template.bind=\"ajaxedView\"></au-compose>\n</template>\n", ni = [], ri = {}, ii;
+function ai(e) {
+	ii ||= p.define({
+		name: ei,
+		template: ti,
+		dependencies: ni,
+		bindables: ri
+	}), e.register(ii);
 }
 //#endregion
 //#region src/components/bleet-ajaxify.ts
-function Qr(e, t) {
+function oi(e, t) {
 	if (typeof e != "object" || !e) return e;
 	var n = e[Symbol.toPrimitive];
 	if (n !== void 0) {
@@ -3656,15 +3808,15 @@ function Qr(e, t) {
 	}
 	return (t === "string" ? String : Number)(e);
 }
-function $r(e) {
-	var t = Qr(e, "string");
+function si(e) {
+	var t = oi(e, "string");
 	return typeof t == "symbol" ? t : String(t);
 }
-function ei(e) {
+function ci(e) {
 	if (Object(e) !== e) throw TypeError("right-hand side of 'in' should be an object, got " + (e === null ? "null" : typeof e));
 	return e;
 }
-function ti(e, t, n) {
+function li(e, t, n) {
 	typeof t == "symbol" && (t = t.description, t = t ? "[" + t + "]" : "");
 	try {
 		Object.defineProperty(e, "name", {
@@ -3674,7 +3826,7 @@ function ti(e, t, n) {
 	} catch {}
 	return e;
 }
-function ni(e, t, n, r, i, a) {
+function ui(e, t, n, r, i, a) {
 	var o = Symbol.metadata || Symbol.for("Symbol.metadata"), s = Object.defineProperty, c = Object.create, l, u = [c(null), c(null)], d = t.length, f;
 	function p(t, n, r) {
 		return function(i, a) {
@@ -3699,13 +3851,13 @@ function ni(e, t, n, r, i, a) {
 		}
 		var E = {}, D = [], O = S ? "get" : C || x ? "set" : "value";
 		if (!b && (d ? (h || x ? E = {
-			get: ti(function() {
+			get: li(function() {
 				return y(this);
 			}, r, "get"),
 			set: function(e) {
 				t[4](this, e);
 			}
-		} : E[O] = y, h || ti(E[O], r, w ? "" : O)) : h || (E = Object.getOwnPropertyDescriptor(e, r)), !h && !d)) {
+		} : E[O] = y, h || li(E[O], r, w ? "" : O)) : h || (E = Object.getOwnPropertyDescriptor(e, r)), !h && !d)) {
 			if (f = u[+c][r], f && (f ^ i) !== 7) throw Error("Decorating two elements with the same name (" + E[O].name + ") is not supported yet");
 			u[+c][r] = i < 3 ? 1 : i;
 		}
@@ -3753,8 +3905,8 @@ function ni(e, t, n, r, i, a) {
 				var l = n[c], u = l[1], d = u & 7;
 				if ((u & 8) == o && !d == s) {
 					var f = l[2], p = !!l[3], m = u & 16;
-					h(o ? e : e.prototype, l, m, p ? "#" + f : $r(f), d, d < 2 ? [] : o ? a ||= [] : r ||= [], t, !!o, p, s, o && p ? function(t) {
-						return ei(t) === e;
+					h(o ? e : e.prototype, l, m, p ? "#" + f : si(f), d, d < 2 ? [] : o ? a ||= [] : r ||= [], t, !!o, p, s, o && p ? function(t) {
+						return ci(t) === e;
 					} : i);
 				}
 			}
@@ -3776,22 +3928,22 @@ function ni(e, t, n, r, i, a) {
 		}
 	};
 }
-var ri = u({
-	...Gr,
+var di = u({
+	...$r,
 	name: "bleet-ajaxify"
-}), ii, ai = c(), oi = c(), si, ci, li, ui, di;
+}), fi, pi = c(), mi = c(), hi, gi, _i, vi, yi;
 (class {
 	ea;
 	logger;
 	apiService;
 	element;
 	static {
-		({e: [si, ci, li, ui], c: [di, ii]} = ni(this, [ri], [[
-			ai,
+		({e: [hi, gi, _i, vi], c: [yi, fi]} = ui(this, [di], [[
+			pi,
 			0,
 			"id"
 		], [
-			oi,
+			mi,
 			0,
 			"url"
 		]]));
@@ -3799,9 +3951,9 @@ var ri = u({
 	constructor(e = f(i), t = f(a).scopeTo("<bleet-ajaxify>"), r = f(n), s = f(o)) {
 		this.ea = e, this.logger = t, this.apiService = r, this.element = s, this.logger.trace("constructor");
 	}
-	id = si(this, "");
-	url = (ci(this), li(this));
-	ajaxedView = (ui(this), null);
+	id = hi(this, "");
+	url = (gi(this), _i(this));
+	ajaxedView = (vi(this), null);
 	disposable;
 	attaching() {
 		this.logger.trace("attaching"), this.disposable = this.ea.subscribe(w.Ajaxify, this.onEvent);
@@ -3851,30 +4003,30 @@ var ri = u({
 		});
 	}
 	static {
-		ii();
+		fi();
 	}
 });
 //#endregion
 //#region src/components/bleet-dialog.$au.ts
-var fi = /* @__PURE__ */ h({
-	bindables: () => gi,
-	default: () => mi,
-	dependencies: () => hi,
-	name: () => pi,
-	register: () => vi,
-	template: () => mi
-}), pi = "bleet-dialog", mi = "<template>\n    <dialog ref=\"dialogElement\" class.bind=\"dialogClass\">\n        <au-slot name=\"loader\" if.bind=\"loading\"><progress></progress></au-slot>\n        <template else>\n            <au-compose if.bind=\"contentView\" template.bind=\"contentView\"></au-compose>\n        </template>\n    </dialog>\n</template>\n", hi = [], gi = {}, _i;
-function vi(e) {
-	_i ||= p.define({
-		name: pi,
-		template: mi,
-		dependencies: hi,
-		bindables: gi
-	}), e.register(_i);
+var bi = /* @__PURE__ */ h({
+	bindables: () => wi,
+	default: () => Si,
+	dependencies: () => Ci,
+	name: () => xi,
+	register: () => Ei,
+	template: () => Si
+}), xi = "bleet-dialog", Si = "<template>\n    <dialog ref=\"dialogElement\" class.bind=\"dialogClass\">\n        <au-slot name=\"loader\" if.bind=\"loading\"><progress></progress></au-slot>\n        <template else>\n            <au-compose if.bind=\"contentView\" template.bind=\"contentView\"></au-compose>\n            <au-slot else></au-slot>\n        </template>\n    </dialog>\n</template>\n", Ci = [], wi = {}, Ti;
+function Ei(e) {
+	Ti ||= p.define({
+		name: xi,
+		template: Si,
+		dependencies: Ci,
+		bindables: wi
+	}), e.register(Ti);
 }
 //#endregion
 //#region src/components/bleet-dialog.ts
-function yi(e, t) {
+function Di(e, t) {
 	if (typeof e != "object" || !e) return e;
 	var n = e[Symbol.toPrimitive];
 	if (n !== void 0) {
@@ -3884,15 +4036,15 @@ function yi(e, t) {
 	}
 	return (t === "string" ? String : Number)(e);
 }
-function bi(e) {
-	var t = yi(e, "string");
+function Oi(e) {
+	var t = Di(e, "string");
 	return typeof t == "symbol" ? t : String(t);
 }
-function xi(e) {
+function ki(e) {
 	if (Object(e) !== e) throw TypeError("right-hand side of 'in' should be an object, got " + (e === null ? "null" : typeof e));
 	return e;
 }
-function Si(e, t, n) {
+function Ai(e, t, n) {
 	typeof t == "symbol" && (t = t.description, t = t ? "[" + t + "]" : "");
 	try {
 		Object.defineProperty(e, "name", {
@@ -3902,7 +4054,7 @@ function Si(e, t, n) {
 	} catch {}
 	return e;
 }
-function Ci(e, t, n, r, i, a) {
+function ji(e, t, n, r, i, a) {
 	var o = Symbol.metadata || Symbol.for("Symbol.metadata"), s = Object.defineProperty, c = Object.create, l, u = [c(null), c(null)], d = t.length, f;
 	function p(t, n, r) {
 		return function(i, a) {
@@ -3927,13 +4079,13 @@ function Ci(e, t, n, r, i, a) {
 		}
 		var E = {}, D = [], O = S ? "get" : C || x ? "set" : "value";
 		if (!b && (d ? (h || x ? E = {
-			get: Si(function() {
+			get: Ai(function() {
 				return y(this);
 			}, r, "get"),
 			set: function(e) {
 				t[4](this, e);
 			}
-		} : E[O] = y, h || Si(E[O], r, w ? "" : O)) : h || (E = Object.getOwnPropertyDescriptor(e, r)), !h && !d)) {
+		} : E[O] = y, h || Ai(E[O], r, w ? "" : O)) : h || (E = Object.getOwnPropertyDescriptor(e, r)), !h && !d)) {
 			if (f = u[+c][r], f && (f ^ i) !== 7) throw Error("Decorating two elements with the same name (" + E[O].name + ") is not supported yet");
 			u[+c][r] = i < 3 ? 1 : i;
 		}
@@ -3981,8 +4133,8 @@ function Ci(e, t, n, r, i, a) {
 				var l = n[c], u = l[1], d = u & 7;
 				if ((u & 8) == o && !d == s) {
 					var f = l[2], p = !!l[3], m = u & 16;
-					h(o ? e : e.prototype, l, m, p ? "#" + f : bi(f), d, d < 2 ? [] : o ? a ||= [] : r ||= [], t, !!o, p, s, o && p ? function(t) {
-						return xi(t) === e;
+					h(o ? e : e.prototype, l, m, p ? "#" + f : Oi(f), d, d < 2 ? [] : o ? a ||= [] : r ||= [], t, !!o, p, s, o && p ? function(t) {
+						return ki(t) === e;
 					} : i);
 				}
 			}
@@ -4004,10 +4156,10 @@ function Ci(e, t, n, r, i, a) {
 		}
 	};
 }
-var wi = u({
-	...fi,
+var Mi = u({
+	...bi,
 	name: "bleet-dialog"
-}), Ti, Ei = c({ attribute: "data-dialog-class" }), Di, Oi, ki, Ai, ji, Mi, Ni, Pi, Fi;
+}), Ni, Pi = c({ attribute: "data-dialog-class" }), Fi, Ii, Li, Ri, zi, Bi, Vi, Hi, Ui;
 (class {
 	logger;
 	element;
@@ -4016,14 +4168,14 @@ var wi = u({
 	transitionService;
 	apiService;
 	static {
-		({e: [Di, Oi, ki, Ai, ji, Mi, Ni, Pi], c: [Fi, Ti]} = Ci(this, [wi], [
+		({e: [Fi, Ii, Li, Ri, zi, Bi, Vi, Hi], c: [Ui, Ni]} = ji(this, [Mi], [
 			[
 				c,
 				0,
 				"id"
 			],
 			[
-				Ei,
+				Pi,
 				0,
 				"dialogClass"
 			],
@@ -4042,11 +4194,13 @@ var wi = u({
 	constructor(e = f(a).scopeTo("<bleet-dialog>"), t = f(o), r = f(i), c = f(s), l = f(v), u = f(n)) {
 		this.logger = e, this.element = t, this.ea = r, this.p = c, this.transitionService = l, this.apiService = u;
 	}
-	id = Di(this, "");
-	dialogClass = (Oi(this), ki(this, ""));
-	loadError = (Ai(this), ji(this, ""));
-	submitError = (Mi(this), Ni(this, ""));
-	dialogElement = (Pi(this), void 0);
+	id = Fi(this, "");
+	dialogClass = (Ii(this), Li(this, ""));
+	loadError = (Ri(this), zi(this, ""));
+	submitError = (Bi(this), Vi(this, ""));
+	title = (Hi(this), "");
+	color = "";
+	dialogElement;
 	disposable;
 	loading = !1;
 	closing = !1;
@@ -4066,18 +4220,21 @@ var wi = u({
 	onModalEvent = (e) => {
 		if (this.id && this.id !== "" && e.id === this.id) {
 			let t = this.dialogElement.open === !0 && this.closing === !1;
-			e.action === A.Open && t === !1 ? e.url && this.loadFromUrl(e.url) : e.action === A.Close && t === !0 ? this.close() : e.action === A.Toggle && (t === !0 ? this.close() : e.url && this.loadFromUrl(e.url));
+			e.action === A.Open && t === !1 ? this.show(e) : e.action === A.Close && t === !0 ? this.close() : e.action === A.Toggle && (t === !0 ? this.close() : this.show(e));
 		}
 	};
 	onCancelEvent = (e) => {
-		e.target === this.dialogElement && (e.preventDefault(), this.close());
+		if (e.target === this.dialogElement) {
+			let t = this.dialogElement.querySelector("[aria-expanded=\"true\"]");
+			e.preventDefault(), t === null ? this.close() : t.click();
+		}
 	};
 	onDialogClick = (e) => {
 		e.target.closest("[data-dialog=\"close\"]") && (e.preventDefault(), this.close());
 	};
 	onFormSubmit = (e) => {
 		let t = e.target.closest("form");
-		if (t && t.getAttribute("data-dialog") !== "native") {
+		if (t && this.contentView !== null && t.getAttribute("data-dialog") !== "native") {
 			e.preventDefault();
 			let n = new FormData(t);
 			e.submitter instanceof HTMLButtonElement && e.submitter.name && n.append(e.submitter.name, e.submitter.value || "");
@@ -4089,6 +4246,9 @@ var wi = u({
 			});
 		}
 	};
+	show(e) {
+		this.title = e.title ?? "", this.color = e.color ?? "", e.url ? this.loadFromUrl(e.url) : (this.contentView = e.content ?? null, this.open());
+	}
 	loadFromUrl(e) {
 		this.loading = !0, this.open(), this.apiService.url(e).get().then((e) => {
 			this.applyResponse(e.body);
@@ -4139,19 +4299,19 @@ var wi = u({
 				id: this.id
 			}), this.ea.publish(w.Overlay, { action: E.Close }), S(e, "dialog", "hide", this.element));
 		}, (e) => {
-			this.closing === !0 && (this.closing = !1, e.close(), this.unbindDialogEvents(), this.contentView = null, this.loading = !1, this.ea.publish(w.ModalStatus, {
+			this.closing === !0 && (this.closing = !1, e.close(), this.unbindDialogEvents(), this.contentView = null, this.loading = !1, this.title = "", this.color = "", this.ea.publish(w.ModalStatus, {
 				status: j.Closed,
 				id: this.id
 			}));
 		});
 	}
 	static {
-		Ti();
+		Ni();
 	}
 });
 //#endregion
 //#region src/index.ts
-var Ii = [
+var Wi = [
 	Y,
 	V,
 	W,
@@ -4169,21 +4329,22 @@ var Ii = [
 	dr,
 	Ir,
 	Wr,
-	di,
-	Fi
+	Qr,
+	yi,
+	Ui
 ];
-function Li(e) {
+function Gi(e) {
 	return {
 		register(n) {
-			return (e ? t.customize(e) : t).register(n), n.register(...Ii);
+			return (e ? t.customize(e) : t).register(n), n.register(...Wi);
 		},
 		customize(e) {
-			return Li(e);
+			return Gi(e);
 		}
 	};
 }
-var Ri = Li();
+var Ki = Gi();
 //#endregion
-export { M as AjaxifyAction, N as AjaxifyTriggerMode, te as BadgeAction, di as BleetAjaxify, Q as BleetAjaxifyTriggerCustomAttribute, Y as BleetAlertCustomAttribute, U as BleetBadgeCustomAttribute, V as BleetBurgerCustomAttribute, Ri as BleetConfiguration, Fi as BleetDialog, W as BleetDropdownCustomAttribute, H as BleetMenuCustomAttribute, X as BleetModalTriggerCustomAttribute, Wr as BleetOverlayCustomAttribute, Z as BleetPagerCustomAttribute, G as BleetPasswordCustomAttribute, $ as BleetPopoverCustomAttribute, rr as BleetPopoverTriggerCustomAttribute, q as BleetProfileCustomAttribute, K as BleetTabsCustomAttribute, Ir as BleetToastCustomAttribute, dr as BleetToasterCustomAttribute, J as BleetToasterTriggerCustomAttribute, w as Channels, B as DialogAction, g as IStorageService, v as ITransitionService, b as ITrapFocusService, F as MenuAction, I as MenuStatus, A as ModalAction, j as ModalStatus, E as OverlayAction, D as OverlayStatus, L as PopoverAction, ne as PopoverStatus, O as ProfileAction, k as ProfileStatus, P as ToasterAction, ee as ToasterStatus, R as UiColor, re as UiIcon, z as UiToastIcon, T as UploadAction, S as setState };
+export { M as AjaxifyAction, N as AjaxifyTriggerMode, te as BadgeAction, yi as BleetAjaxify, Q as BleetAjaxifyTriggerCustomAttribute, Y as BleetAlertCustomAttribute, U as BleetBadgeCustomAttribute, V as BleetBurgerCustomAttribute, Ki as BleetConfiguration, Ui as BleetDialog, W as BleetDropdownCustomAttribute, Qr as BleetFocusCustomAttribute, H as BleetMenuCustomAttribute, X as BleetModalTriggerCustomAttribute, Wr as BleetOverlayCustomAttribute, Z as BleetPagerCustomAttribute, G as BleetPasswordCustomAttribute, $ as BleetPopoverCustomAttribute, rr as BleetPopoverTriggerCustomAttribute, q as BleetProfileCustomAttribute, K as BleetTabsCustomAttribute, Ir as BleetToastCustomAttribute, dr as BleetToasterCustomAttribute, J as BleetToasterTriggerCustomAttribute, w as Channels, B as DialogAction, g as IStorageService, v as ITransitionService, b as ITrapFocusService, F as MenuAction, I as MenuStatus, A as ModalAction, j as ModalStatus, E as OverlayAction, D as OverlayStatus, L as PopoverAction, ne as PopoverStatus, O as ProfileAction, k as ProfileStatus, P as ToasterAction, ee as ToasterStatus, R as UiColor, re as UiIcon, z as UiToastIcon, T as UploadAction, S as setState };
 
 //# sourceMappingURL=index.es.js.map