@jboltai/tokui 0.1.7 → 0.1.8

package/dist/tokui.mjs

@@ -23,6 +23,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			"common.download": "下载",
 			"common.view": "查看",
 			"common.send": "发送",
+			"common.stop": "停止生成",
 			"common.loading": "加载中",
 			"common.renderFailed": "渲染失败",
 			"time.today": "今天",
@@ -55,6 +56,8 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			"actions.like": "赞",
 			"actions.dislike": "踩",
 			"actions.delete": "删除",
+			"actions.approve": "批准",
+			"actions.deny": "拒绝",
 			"file.unnamed": "未知文件",
 			"countdown.ended": "已结束",
 			"duration.day": "天",
@@ -130,6 +133,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			"common.download": "Download",
 			"common.view": "View",
 			"common.send": "Send",
+			"common.stop": "Stop generating",
 			"common.loading": "Loading",
 			"common.renderFailed": "Render failed",
 			"time.today": "Today",
@@ -162,6 +166,8 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			"actions.like": "Like",
 			"actions.dislike": "Dislike",
 			"actions.delete": "Delete",
+			"actions.approve": "Approve",
+			"actions.deny": "Deny",
 			"file.unnamed": "Unnamed file",
 			"countdown.ended": "Ended",
 			"duration.day": "d",
@@ -505,7 +511,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 		}
 		return -1;
 	}
-	var i = new Set(/* @__PURE__ */ "form.table.thead.tbody.card.ft.row.col.list.select.radio.checkbox.code.imgs.md.textarea.tabs.tab.accordion.collapse.dialog.btngroup.picker.timeline.steps.drawer.ol.ul.i.item.think.think-chain.think-step.bubble.toolbar.badge-box.dropdown.transfer.callout.cascader.tree.tn.desc.carousel.popover.input-tag.watermark.menu.print-area.chat-input.msg-actions.tool-call.diff.quick-reply.plan.file-tree.ft-folder.terminal.sandbox.test-result.quote.toggle-group.conversations.welcome.welcome-feature.suggestions.attachments.artifact.artifact-code.artifact-preview.scroll-area.sidebar.sidebar-content.sidebar-footer.command.command-group.hover-card.hover-trigger.hover-content.resizable.canvas.canvas-content.chart.p".split("."));
+	var i = new Set(/* @__PURE__ */ "form.table.thead.tbody.card.ft.row.col.list.select.radio.checkbox.code.imgs.md.textarea.tabs.tab.accordion.collapse.dialog.btngroup.picker.timeline.steps.drawer.ol.ul.i.item.think.think-chain.think-step.bubble.toolbar.badge-box.dropdown.transfer.callout.cascader.tree.tn.desc.carousel.popover.input-tag.watermark.menu.print-area.chat-input.msg-actions.tool-call.diff.quick-reply.plan.file-tree.ft-folder.terminal.sandbox.test-result.quote.toggle-group.conversations.welcome.welcome-feature.suggestions.attachments.artifact.artifact-code.artifact-preview.scroll-area.sidebar.sidebar-content.sidebar-footer.command.command-group.hover-card.hover-trigger.hover-content.resizable.canvas.canvas-content.chart.ins.p".split("."));
 	function a(e) {
 		if (!e || e.type !== "chart") return !1;
 		var t = e.attrs || {};
@@ -541,7 +547,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 		"mark",
 		"sub",
 		"sup"
-	]), d = new Set(/* @__PURE__ */ "stripe.dis.ro.req.chk.multi.disabled.readonly.required.checked.multiple.striped.auto.plain.round.closable.bordered.open.pill.dot.leaf.inline.rounded.container.copy.regenerate.like.dislike.visible.delete.controls.open.active.collapsible.toggle.search.thumb.reset.print.show-total.live".split(".")), f = null;
+	]), d = new Set(/* @__PURE__ */ "stripe.dis.ro.req.chk.multi.disabled.readonly.required.checked.multiple.striped.auto.plain.round.closable.bordered.open.pill.dot.leaf.inline.rounded.container.copy.regenerate.like.dislike.visible.delete.controls.open.active.collapsible.toggle.search.thumb.reset.print.show-total.live.approval.streaming".split(".")), f = null;
 	function p(e) {
 		f = e;
 	}
@@ -1003,7 +1009,28 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			}
 		}), n != null && (r.textContent = n), r;
 	}
-	var c = {
+	function c(e) {
+		var t = {};
+		return !e || typeof e != "string" || e.split(",").forEach(function(e) {
+			var n = e.indexOf(":");
+			if (!(n <= 0)) {
+				var r = e.slice(0, n).trim(), i = e.slice(n + 1).trim();
+				/^[\w-]+$/.test(r) && /^[\w-]+$/.test(i) && (t[r] = i);
+			}
+		}), t;
+	}
+	function d(e, t) {
+		var n = null, r = function() {
+			var r = arguments;
+			n && clearTimeout(n), n = setTimeout(function() {
+				n = null, e.apply(null, r);
+			}, t);
+		};
+		return r.cancel = function() {
+			n &&= (clearTimeout(n), null);
+		}, r;
+	}
+	var f = {
 		img: new Set([
 			"avatar",
 			"rounded",
@@ -1165,9 +1192,38 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 		cascader: new Set(["error", "success"]),
 		upload: new Set(["sm", "lg"]),
 		tree: new Set(["sm", "lg"])
-	}, d = class {
+	}, p = class {
 		constructor(e) {
-			this.registry = {}, this.eventBus = e, this.slotStack = [], this._boundElements = [], this._onError = null;
+			this.registry = {}, this.eventBus = e, this.slotStack = [], this._boundElements = [], this._onError = null, this._onComponentEvent = null;
+		}
+		createReporter(e, t, n) {
+			var r = this, i = c(t && t.on), a = t && t.id != null && t.id !== "" ? String(t.id) : null;
+			return function(t, o) {
+				var s = i[t];
+				if (s && r.eventBus) {
+					var c = r.eventBus.getHandler(s);
+					if (c) try {
+						c(o ?? null, null, n || null);
+					} catch (e) {
+						console.warn("TokUI: on:" + t + " handler error", e);
+					}
+					else r._warnMissingHandler(s);
+				}
+				if (r._onComponentEvent) try {
+					r._onComponentEvent({
+						type: e,
+						id: a,
+						event: t,
+						detail: o ?? null
+					});
+				} catch {}
+			};
+		}
+		_warnMissingHandler(e) {
+			this._warnedHandlers = this._warnedHandlers || {}, !this._warnedHandlers[e] && (this._warnedHandlers[e] = !0, console.warn("TokUI: 事件处理器未注册 \"" + e + "\"（需先 TokUI.registerHandler(\"" + e + "\", fn)），事件已丢弃"));
+		}
+		debounce(e, t) {
+			return d(e, t);
 		}
 		register(e, t) {
 			this.registry[e] = t;
@@ -1208,7 +1264,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 		_applyVariants(e, t) {
 			var n = t.attrs && t.attrs.v;
 			if (!(!n || !e || e.nodeType !== 1)) {
-				var r = c[t.type];
+				var r = f[t.type];
 				if (r) {
 					var i = e._variantTarget || e;
 					n.split(",").map(function(e) {
@@ -1411,7 +1467,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 							}
 							if (i && n.getAttribute("type") === "submit" && !t._reportValidity(i)) return;
 							o(i ? t._collectFormData(i) : null, e, n);
-						}
+						} else t._warnMissingHandler(i);
 					};
 					n.addEventListener("click", c), t._boundElements.push({
 						element: n,
@@ -1431,7 +1487,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 					var r = function(r) {
 						if (r.preventDefault(), !t._reportValidity(e)) return;
 						let i = t.eventBus.getHandler(n);
-						i && i(t._collectFormData(e), r, e);
+						i ? i(t._collectFormData(e), r, e) : t._warnMissingHandler(n);
 					};
 					e.addEventListener("submit", r), t._boundElements.push({
 						element: e,
@@ -1451,7 +1507,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 						if (i) {
 							let n = e.closest("form");
 							i(n ? t._collectFormData(n) : null, r, e);
-						}
+						} else t._warnMissingHandler(n);
 					};
 					e.addEventListener("click", i), t._boundElements.push({
 						element: e,
@@ -1561,14 +1617,16 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			}
 		}
 	};
-	typeof window < "u" && (window.TokUI = window.TokUI || {}, window.TokUI._internal = window.TokUI._internal || {}, window.TokUI._internal.el = s, window.TokUI._internal.VARIANTS = c, window.TokUI._internal.TokUIRenderer = d, window.TokUI._internal.resolveButtonAction = n, window.TokUI._internal.resolveTargetForm = r, window.TokUI._internal.resolvePrintScope = i, window.TokUI._internal.broadcastTokuiReset = a), t !== void 0 && t.exports && (t.exports = {
+	typeof window < "u" && (window.TokUI = window.TokUI || {}, window.TokUI._internal = window.TokUI._internal || {}, window.TokUI._internal.el = s, window.TokUI._internal.VARIANTS = f, window.TokUI._internal.TokUIRenderer = p, window.TokUI._internal.resolveButtonAction = n, window.TokUI._internal.resolveTargetForm = r, window.TokUI._internal.resolvePrintScope = i, window.TokUI._internal.broadcastTokuiReset = a, window.TokUI._internal.parseOnSpec = c, window.TokUI._internal.debounce = d), t !== void 0 && t.exports && (t.exports = {
 		el: s,
-		TokUIRenderer: d,
-		VARIANTS: c,
+		TokUIRenderer: p,
+		VARIANTS: f,
 		resolveButtonAction: n,
 		resolveTargetForm: r,
 		resolvePrintScope: i,
-		broadcastTokuiReset: a
+		broadcastTokuiReset: a,
+		parseOnSpec: c,
+		debounce: d
 	});
 })), g = /* @__PURE__ */ o(((e, t) => {
 	var n = typeof l == "function" ? u().t : window.TokUI && window.TokUI._internal && window.TokUI._internal.t || function(e) {
@@ -2031,7 +2089,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 		}
 		function y(i, o, s) {
 			var c = t.srcLeft(i), l = r / (t.srcRight(o) - c), u = n - l * c;
-			a.setAttribute("transform", "matrix(" + l + " 0 0 1 " + u + " 0)"), _.s = i, _.e = o, _.sx = l, _.tx = u, E(p), s && (t.renderLabels(p, i, o), ne(p, e)), t.onZoom && t.onZoom(i, o, l, u);
+			a.setAttribute("transform", "matrix(" + l + " 0 0 1 " + u + " 0)"), _.s = i, _.e = o, _.sx = l, _.tx = u, E(p), s && (t.renderLabels(p, i, o), te(p, e)), t.onZoom && t.onZoom(i, o, l, u);
 		}
 		var x = s("g", { class: "tokui-chart-zoom" });
 		d.appendChild(x);
@@ -2106,17 +2164,17 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 		}
 		G(H, U);
 		var K = typeof window < "u" && typeof window.requestAnimationFrame == "function", q = !1, J = null;
-		function te(e, t) {
+		function ee(e, t) {
 			J = [e, t], !q && (q = !0, K ? window.requestAnimationFrame(function() {
 				q = !1, J && y(J[0], J[1], !1);
 			}) : (q = !1, y(e, t, !1)));
 		}
-		function Y(e) {
+		function X(e) {
 			G(H, U);
-			var t = ee(i, H, U);
-			e ? te(t.s, t.e) : (J = null, y(t.s, t.e, !0));
+			var t = Y(i, H, U);
+			e ? ee(t.s, t.e) : (J = null, y(t.s, t.e, !0));
 		}
-		function re(t, i) {
+		function ne(t, i) {
 			t.style.touchAction = "none", t.style.userSelect = "none", t.style.webkitUserDrag = "none";
 			function a(a, o) {
 				var s = !0, c = a;
@@ -2129,7 +2187,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 							var a = U - H, o = (e - c) / r;
 							H = b(H + o, 0, 1 - a), U = H + a;
 						}
-						c = e, Y(!0);
+						c = e, X(!0);
 					}
 				}
 				function u(t) {
@@ -2140,7 +2198,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 					try {
 						t.releasePointerCapture(o);
 					} catch {}
-					Y(!1);
+					X(!1);
 				}
 				t.addEventListener("pointermove", u), t.addEventListener("pointerup", d);
 			}
@@ -2152,7 +2210,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				a(D(e, n.clientX), n.pointerId);
 			});
 		}
-		return re(z, "l"), re(B, "r"), re(L, "pan"), y(0, i - 1, !0), e._tokuiZoomRelayout = V, {
+		return ne(z, "l"), ne(B, "r"), ne(L, "pan"), y(0, i - 1, !0), e._tokuiZoomRelayout = V, {
 			showTip: v,
 			winState: _,
 			sharedTip: g,
@@ -2291,7 +2349,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 		var i = parseInt(r, 10);
 		return isNaN(i) ? t > q : t > i;
 	}
-	function ee(e, t, n) {
+	function Y(e, t, n) {
 		if (e <= 1) return {
 			s: 0,
 			e: Math.max(0, e - 1)
@@ -2307,10 +2365,10 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			e: i
 		};
 	}
-	function te(e, t, n, r) {
+	function ee(e, t, n, r) {
 		return n ? e - t + G : e - 8 - (r ? 12 : 0);
 	}
-	function Y(e, t, n, r, i, a, o) {
+	function X(e, t, n, r, i, a, o) {
 		var c = (i || 40) * .9, l = typeof a == "boolean", u = o && o > 1 ? o : 1, d = t.length - 1;
 		t.forEach(function(t, i) {
 			if (!(t == null || t === "") && !(u > 1 && !(i === 0 || i === d || i % u === 0))) {
@@ -2325,11 +2383,11 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			}
 		});
 	}
-	function ne(e, t) {
+	function te(e, t) {
 		var n = t && t._tokuiBumpedFs;
 		if (n > 0) for (var r = e.querySelectorAll("text"), i = 0; i < r.length; i++) r[i].setAttribute("font-size", n);
 	}
-	function re(e, t, n, r, i) {
+	function ne(e, t, n, r, i) {
 		var a = s("text", {
 			x: n,
 			y: r,
@@ -2339,7 +2397,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 		});
 		i && a.setAttribute("transform", "rotate(-90 " + n + " " + r + ")"), a.textContent = t, e.appendChild(a);
 	}
-	function ie(e, t, n, r) {
+	function re(e, t, n, r) {
 		var i = typeof window < "u" && typeof window.requestAnimationFrame == "function", a = i && window.matchMedia && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
 		if (!(n > 0) || !i || a) {
 			r(t);
@@ -2353,23 +2411,23 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 		}
 		window.requestAnimationFrame(s);
 	}
-	function ae(e) {
+	function ie(e) {
 		return e = String(e).replace("#", ""), e.length === 3 && (e = e[0] + e[0] + e[1] + e[1] + e[2] + e[2]), /^[0-9a-fA-F]{6}$/.test(e) ? [
 			parseInt(e.slice(0, 2), 16),
 			parseInt(e.slice(2, 4), 16),
 			parseInt(e.slice(4, 6), 16)
 		] : null;
 	}
-	function oe(e, t, n) {
-		var r = ae(e), i = ae(t);
+	function ae(e, t, n) {
+		var r = ie(e), i = ie(t);
 		if (!r || !i) return e;
 		var a = Math.round(r[0] + (i[0] - r[0]) * n), o = Math.round(r[1] + (i[1] - r[1]) * n), s = Math.round(r[2] + (i[2] - r[2]) * n);
 		return "rgb(" + a + "," + o + "," + s + ")";
 	}
-	function X(e, t) {
+	function oe(e, t) {
 		if (t = b(t, 0, 1), e.length === 1) return e[0];
 		var n = t * (e.length - 1), r = Math.min(e.length - 2, Math.floor(n));
-		return oe(e[r], e[r + 1], n - r);
+		return ae(e[r], e[r + 1], n - r);
 	}
 	function se(e, t, r, i) {
 		var a = i.orient === "h" || i.orientation === "h", c = i.stack !== void 0 || i.stacked !== void 0, l = f(i.d);
@@ -2405,12 +2463,12 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 		}
 		var R = [], z = [];
 		if (a) {
-			var B = 70, V = i.xl ? 30 : 22, H = 14, W = i.yl ? 30 : 16, G = d - B - W, q = p - H - V, ie = q / u, ae = Math.max(3, c ? ie * .6 : ie * .6 / l.length);
+			var B = 70, V = i.xl ? 30 : 22, H = 14, W = i.yl ? 30 : 16, G = d - B - W, q = p - H - V, re = q / u, ie = Math.max(3, c ? re * .6 : re * .6 / l.length);
 			function e(e) {
 				return B + G * (e - y) / N;
 			}
-			for (var oe = 0; oe <= 4; oe++) {
-				var X = y + N * oe / 4, se = e(X);
+			for (var ae = 0; ae <= 4; ae++) {
+				var oe = y + N * ae / 4, se = e(oe);
 				P.appendChild(s("line", {
 					x1: se,
 					y1: H,
@@ -2424,24 +2482,24 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 					"text-anchor": "middle",
 					fill: "var(--tokui-chart-text, #999)",
 					"font-size": "9"
-				})).textContent = Math.round(X);
+				})).textContent = Math.round(oe);
 			}
 			l.forEach(function(a, o) {
 				a.forEach(function(a, u) {
 					if (a != null) {
-						var d = L(o, u, a), f = e(d[0]), p = Math.max(0, e(d[1]) - f), m = H + u * ie + ie * .2 + (c ? 0 : o * ae), h = s("g", { class: "tokui-chart-tip-group" });
+						var d = L(o, u, a), f = e(d[0]), p = Math.max(0, e(d[1]) - f), m = H + u * re + re * .2 + (c ? 0 : o * ie), h = s("g", { class: "tokui-chart-tip-group" });
 						if (h.appendChild(s("rect", {
 							x: f,
 							y: m,
 							width: p,
-							height: ae - 1,
+							height: ie - 1,
 							fill: r[o % r.length],
 							rx: 2,
 							class: "tokui-chart-bar"
 						})), I.add(h, (t[u] || "") + ": " + a + (l.length > 1 ? " (" + n("chart.seriesDefault", { n: o + 1 }) + ")" : ""), f + p / 2, m), P.appendChild(h), i.vals !== void 0) {
 							var g = s("text", {
 								x: f + p + 3,
-								y: m + ae / 2 + 2,
+								y: m + ie / 2 + 2,
 								"text-anchor": "start",
 								fill: "var(--tokui-chart-text, #666)",
 								"font-size": "8"
@@ -2452,7 +2510,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				});
 			}), t.slice(0, u).forEach(function(e, t) {
 				if (!(e == null || e === "")) {
-					var n = H + t * ie + ie / 2;
+					var n = H + t * re + re / 2;
 					P.appendChild(s("text", {
 						x: B - 6,
 						y: n + 3,
@@ -2461,7 +2519,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 						"font-size": "9"
 					})).textContent = e;
 				}
-			}), i.xl && re(P, i.xl, B + G / 2, H + q + 22, !1), i.yl && re(P, i.yl, 12, H + q / 2, !0);
+			}), i.xl && ne(P, i.xl, B + G / 2, H + q + 22, !1), i.yl && ne(P, i.yl, 12, H + q / 2, !0);
 		} else {
 			var Z = i._padL ? +i._padL : i.yl ? 46 : 40, ce = 12, le = 18, Q = d - Z - ce, ue = Q / u, de = K(t.slice(0, u), ue, i.xl ? 38 : 28, Q, i.interval, !!i.xl), fe = de.padB, pe = p - le - fe;
 			function e(e) {
@@ -2545,7 +2603,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 					var m = u / f, g = Z - m * (Z + a * Ee);
 					if (xe.setAttribute("transform", "matrix(" + m + " 0 0 1 " + g + " 0)"), Oe.s = a, Oe.e = o, Oe.sx = m, Oe.tx = g, E(Se), d) {
 						for (var _ = Q / f, v = [], y = 0; y < f; y++) v.push(Z + y * _ + _ / 2);
-						Y(Se, t.slice(a, o + 1), v, te(p, fe, de.rotate, !!i.xl), _, de.rotate, de.interval), ne(Se, P);
+						X(Se, t.slice(a, o + 1), v, ee(p, fe, de.rotate, !!i.xl), _, de.rotate, de.interval), te(Se, P);
 					}
 					return;
 				}
@@ -2581,7 +2639,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 					}
 				});
 				for (var w = [], D = 0; D < f; D++) w.push(Z + D * b + b / 2);
-				Y(ve, t.slice(a, o + 1), w, te(p, fe, de.rotate, !!i.xl), b, de.rotate, de.interval), ne(ve, P), d && h && T(ve, P);
+				X(ve, t.slice(a, o + 1), w, ee(p, fe, de.rotate, !!i.xl), b, de.rotate, de.interval), te(ve, P), d && h && T(ve, P);
 			}
 			if (a(0, u - 1, !0), ye) {
 				function n(e, t, n) {
@@ -2601,7 +2659,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 					});
 				});
 			}
-			i.xl && re(P, i.xl, Z + Q / 2, p - 3, !1), i.yl && re(P, i.yl, 12, le + pe / 2, !0), h && (function() {
+			i.xl && ne(P, i.xl, Z + Q / 2, p - 3, !1), i.yl && ne(P, i.yl, 12, le + pe / 2, !0), h && (function() {
 				var e = s("g", { class: "tokui-chart-zoom" });
 				P.appendChild(e);
 				var t = p + 6, n = 16, r = n - 2;
@@ -2674,7 +2732,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				}
 				function O(e) {
 					S(_, v);
-					var t = ee(u, _, v);
+					var t = Y(u, _, v);
 					e ? E(t.s, t.e) : (T = null, a(t.s, t.e, !0));
 				}
 				function k(e, t) {
@@ -2768,7 +2826,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				"font-size": "9"
 			})).textContent = Math.round(G * 10) / 10;
 		}
-		function ee(e) {
+		function Y(e) {
 			if (e.length < 2) return e.length ? "M" + e[0].x + "," + e[0].y : "";
 			if (e.length === 2) return "M" + e[0].x + "," + e[0].y + " L" + e[1].x + "," + e[1].y;
 			for (var t = "M" + e[0].x + "," + e[0].y, n = 0; n < e.length - 1; n++) {
@@ -2777,11 +2835,11 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			}
 			return t;
 		}
-		var ne = h ? s("g", { class: "tokui-chart-plot" }) : null;
-		ne && B.appendChild(ne);
-		var ie = h ? s("g", { class: "tokui-chart-plot-dots" }) : null;
-		ie && B.appendChild(ie);
-		var ae = ne || B, oe = [];
+		var te = h ? s("g", { class: "tokui-chart-plot" }) : null;
+		te && B.appendChild(te);
+		var re = h ? s("g", { class: "tokui-chart-plot-dots" }) : null;
+		re && B.appendChild(re);
+		var ie = te || B, ae = [];
 		if (v.forEach(function(e, t) {
 			for (var n = [], o = 0; o < e.length; o++) {
 				var u = e[o];
@@ -2802,7 +2860,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 						p += " L" + e.x + "," + e.y;
 					});
 					for (var m = d.length - 1; m >= 0; m--) p += " L" + d[m].x + "," + d[m].y;
-					p += " Z", ae.appendChild(s("path", {
+					p += " Z", ie.appendChild(s("path", {
 						d: p,
 						fill: r[t % r.length],
 						opacity: "0.4"
@@ -2811,20 +2869,20 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 					var g = U(Math.max(0, E)), _ = "M" + n[0].x + "," + g;
 					n.forEach(function(e) {
 						_ += " L" + e.x + "," + e.y;
-					}), _ += " L" + n[n.length - 1].x + "," + g + " Z", ae.appendChild(s("path", {
+					}), _ += " L" + n[n.length - 1].x + "," + g + " Z", ie.appendChild(s("path", {
 						d: _,
 						fill: r[t % r.length],
 						opacity: "0.15"
 					}));
 				}
-				c ? ae.appendChild(s("path", {
-					d: ee(n),
+				c ? ie.appendChild(s("path", {
+					d: Y(n),
 					fill: "none",
 					stroke: r[t % r.length],
 					"stroke-width": 2,
 					"stroke-linejoin": "round",
 					"stroke-linecap": "round"
-				})) : ae.appendChild(s("polyline", {
+				})) : ie.appendChild(s("polyline", {
 					points: n.map(function(e) {
 						return e.x + "," + e.y;
 					}).join(" "),
@@ -2835,7 +2893,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				}));
 				var y = l[t];
 				n.forEach(function(n) {
-					var a = h ? ie : B, o = s("circle", {
+					var a = h ? re : B, o = s("circle", {
 						cx: n.x,
 						cy: n.y,
 						r: 3,
@@ -2844,12 +2902,12 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 						"stroke-width": 2,
 						class: "tokui-chart-dot"
 					});
-					a.appendChild(o), h && oe.push({
+					a.appendChild(o), h && ae.push({
 						circle: o,
 						idx: n.idx,
 						x: n.x,
 						si: t
-					}), i.vals !== void 0 && (ae.appendChild(s("text", {
+					}), i.vals !== void 0 && (ie.appendChild(s("text", {
 						x: n.x,
 						y: n.y - 6,
 						"text-anchor": "middle",
@@ -2859,8 +2917,8 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				});
 			}
 		}), h) {
-			var X = A(B, {
-				plotG: ne,
+			var oe = A(B, {
+				plotG: te,
 				tipLayer: V.layer,
 				padL: P,
 				cw: F,
@@ -2886,16 +2944,16 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				range: D,
 				renderLabels: function(e, n, r) {
 					for (var a = r - n, o = [], s = n; s <= r; s++) o.push(a > 0 ? P + (s - n) * F / a : P + F / 2);
-					Y(e, t.slice(n, r + 1), o, te(p, R, L.rotate, !!i.xl), I, L.rotate, L.interval);
+					X(e, t.slice(n, r + 1), o, ee(p, R, L.rotate, !!i.xl), I, L.rotate, L.interval);
 				},
 				onZoom: function(e, t, n, r) {
-					for (var i = 0; i < oe.length; i++) {
-						var a = oe[i];
+					for (var i = 0; i < ae.length; i++) {
+						var a = ae[i];
 						a.circle.setAttribute("cx", n * a.x + r);
 					}
 				}
 			});
-			X.clipG.appendChild(ie), k({
+			oe.clipG.appendChild(re), k({
 				svg: B,
 				padL: P,
 				padT: N,
@@ -2919,19 +2977,19 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				tipLayer: V.layer,
 				bfs: 9,
 				toViewX: function(e) {
-					return X.winState.sx * H(e) + X.winState.tx;
+					return oe.winState.sx * H(e) + oe.winState.tx;
 				},
 				toIdx: function(e) {
-					var t = (e - X.winState.tx) / X.winState.sx;
+					var t = (e - oe.winState.tx) / oe.winState.sx;
 					return Math.round((t - P) * (u - 1) / F);
 				},
 				inWindow: function(e) {
-					return e >= X.winState.s && e <= X.winState.e;
+					return e >= oe.winState.s && e <= oe.winState.e;
 				}
 			});
 		} else {
 			for (var se = [], Z = 0; Z < u; Z++) se.push(H(Z));
-			Y(B, t.slice(0, u), se, te(p, R, L.rotate, !!i.xl), I, L.rotate, L.interval), k({
+			X(B, t.slice(0, u), se, ee(p, R, L.rotate, !!i.xl), I, L.rotate, L.interval), k({
 				svg: B,
 				padL: P,
 				padT: N,
@@ -2963,7 +3021,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				}
 			});
 		}
-		return i.xl && re(B, i.xl, P + F / 2, p - 3, !1), i.yl && re(B, i.yl, 12, N + z / 2, !0), m && j(B, l.map(function(e, t) {
+		return i.xl && ne(B, i.xl, P + F / 2, p - 3, !1), i.yl && ne(B, i.yl, 12, N + z / 2, !0), m && j(B, l.map(function(e, t) {
 			return {
 				color: r[t % r.length],
 				text: n("chart.seriesDefault", { n: t + 1 })
@@ -3268,37 +3326,37 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			K[Math.round(e * 100) / 100] = !0;
 		});
 		for (var q = 0; q <= G; q++) {
-			var J = f + q / G * (p - f), ee = q === 0 || q === G, te = L(J, x - V / 2 - 1), Y = L(J, x + V / 2 + 2);
+			var J = f + q / G * (p - f), Y = q === 0 || q === G, ee = L(J, x - V / 2 - 1), X = L(J, x + V / 2 + 2);
 			H.appendChild(s("line", {
-				x1: te[0],
-				y1: te[1],
-				x2: Y[0],
-				y2: Y[1],
+				x1: ee[0],
+				y1: ee[1],
+				x2: X[0],
+				y2: X[1],
 				stroke: "var(--tokui-chart-text, #bbb)",
-				"stroke-width": ee ? 1.2 : .6,
-				opacity: ee ? .8 : .35
+				"stroke-width": Y ? 1.2 : .6,
+				opacity: Y ? .8 : .35
 			}));
-			var ne = S + q / G * E, re = Math.round(ne * 100) / 100;
-			if (ee || K[re]) {
-				var ae = L(J, x + V / 2 + 12), oe = s("text", {
-					x: ae[0],
-					y: ae[1],
+			var te = S + q / G * E, ne = Math.round(te * 100) / 100;
+			if (Y || K[ne]) {
+				var ie = L(J, x + V / 2 + 12), ae = s("text", {
+					x: ie[0],
+					y: ie[1],
 					"text-anchor": "middle",
 					"dominant-baseline": "central",
 					fill: "var(--tokui-chart-text, #999)",
 					"font-size": "8"
 				});
-				oe.textContent = k > 0 ? ne.toFixed(k) : Math.round(ne), H.appendChild(oe);
+				ae.textContent = k > 0 ? te.toFixed(k) : Math.round(te), H.appendChild(ae);
 			}
 		}
-		var X = s("g", { class: "tokui-chart-tip-group" }), se = s("path", {
+		var oe = s("g", { class: "tokui-chart-tip-group" }), se = s("path", {
 			fill: "none",
 			stroke: I,
 			"stroke-width": V,
 			"stroke-linecap": "round",
 			class: "tokui-chart-gauge-arc"
 		});
-		X.appendChild(se), U.add(X, (i.l || n("gauge.currentValue")) + ": " + B(D) + O + "  (" + Math.round(b((D - S) / E, 0, 1) * 100) + "%)", c, v - x), H.appendChild(X);
+		oe.appendChild(se), U.add(oe, (i.l || n("gauge.currentValue")) + ": " + B(D) + O + "  (" + Math.round(b((D - S) / E, 0, 1) * 100) + "%)", c, v - x), H.appendChild(oe);
 		var Z = s("line", {
 			stroke: I,
 			"stroke-width": 2.5,
@@ -3370,7 +3428,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			var n = L(t, x - V / 2 - 3);
 			Z.setAttribute("x1", c), Z.setAttribute("y1", v), Z.setAttribute("x2", n[0]), Z.setAttribute("y2", n[1]), le.textContent = B(e) + O;
 		}
-		return w(H), ie(S, D, parseInt(i.anim, 10) || 0, pe), H;
+		return w(H), re(S, D, parseInt(i.anim, 10) || 0, pe), H;
 	}
 	function fe(e, t, r, i) {
 		var a = parseInt(i.w) || 240, c = parseInt(i.h) || 240, l = a / 2, u = c / 2, d = f(i.d);
@@ -3959,7 +4017,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			var t = b((e - c) / l, 0, 1);
 			_.setAttribute("x", 2), _.setAttribute("width", Math.max(0, (i - 4) * t)), y.textContent = (v ? v + " " : "") + Math.round(t * 100) + d;
 		}
-		return ie(c, u, parseInt(r.anim, 10) || 0, x), p;
+		return re(c, u, parseInt(r.anim, 10) || 0, x), p;
 	}
 	function Fe(e) {
 		return e ? String(e).split(";").map(function(e) {
@@ -4084,7 +4142,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			class: "tokui-chart__svg",
 			preserveAspectRatio: "xMidYMid meet"
 		}), P = C(a, o), F = 0; F < f; F++) for (var I = 0; I < u; I++) {
-			var L = i[F] ? i[F][I] : void 0, R = L !== void 0 && !isNaN(L), z = R && D ? (L - O) / k : 0, B = R ? X(A, z) : j, V = p + I * S, H = m + F * T, W = s("g", { class: "tokui-chart-tip-group" });
+			var L = i[F] ? i[F][I] : void 0, R = L !== void 0 && !isNaN(L), z = R && D ? (L - O) / k : 0, B = R ? oe(A, z) : j, V = p + I * S, H = m + F * T, W = s("g", { class: "tokui-chart-tip-group" });
 			W.appendChild(s("rect", {
 				x: V + 1,
 				y: H + 1,
@@ -4221,7 +4279,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			}));
 		});
 		for (var I = [], L = 0; L < e.length; L++) I.push(p + L * _ + _ / 2);
-		return Y(A, t.slice(0, e.length), I, te(o, E, T.rotate), _, T.rotate, T.interval), A.appendChild(j.layer), w(A), A;
+		return X(A, t.slice(0, e.length), I, ee(o, E, T.rotate), _, T.rotate, T.interval), A.appendChild(j.layer), w(A), A;
 	}
 	function We(e) {
 		return e ? String(e).split(";").map(function(e) {
@@ -4357,7 +4415,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				range: f,
 				renderLabels: function(e, n, r) {
 					for (var i = g / (r - n + 1), a = [], o = n; o <= r; o++) a.push(p + (o - n) * i + i / 2);
-					Y(e, t.slice(n, r + 1), a, te(c, O, D.rotate), i, D.rotate, D.interval);
+					X(e, t.slice(n, r + 1), a, ee(c, O, D.rotate), i, D.rotate, D.interval);
 				}
 			});
 			z.forEach(function(e) {
@@ -4369,7 +4427,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			});
 		} else {
 			for (var H = [], U = 0; U < a.length; U++) H.push(p + U * T + T / 2);
-			Y(j, t.slice(0, a.length), H, te(c, O, D.rotate), T, D.rotate, D.interval);
+			X(j, t.slice(0, a.length), H, ee(c, O, D.rotate), T, D.rotate, D.interval);
 		}
 		return j.appendChild(N.layer), _ || w(j), j;
 	}
@@ -4624,7 +4682,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				range: f,
 				renderLabels: function(e, n, r) {
 					for (var i = _ / (r - n + 1), a = [], s = n; s <= r; s++) a.push(p + (s - n) * i + i / 2);
-					Y(e, t.slice(n, r + 1), a, te(o, D, E.rotate), i, E.rotate, E.interval);
+					X(e, t.slice(n, r + 1), a, ee(o, D, E.rotate), i, E.rotate, E.interval);
 				}
 			});
 			V.forEach(function(e) {
@@ -4636,7 +4694,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			});
 		} else {
 			for (var G = [], q = 0; q < i.length; q++) G.push(p + q * S + S / 2);
-			Y(P, t.slice(0, i.length), G, te(o, D, E.rotate), S, E.rotate, E.interval);
+			X(P, t.slice(0, i.length), G, ee(o, D, E.rotate), S, E.rotate, E.interval);
 		}
 		return P.appendChild(F.layer), b || w(P), P;
 	}
@@ -5113,7 +5171,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			}), a(s), s);
 		});
 	}
-	typeof window < "u" && (window.TokUI = window.TokUI || {}, window.TokUI._internal = window.TokUI._internal || {}, window.TokUI._internal.registerChartComponents = Ze, window.TokUI._internal.registerChartRenderer = $, window.TokUI._internal.bumpFsUnits = R, window.TokUI._internal.applyTipScale = z, window.TokUI._internal.axisXLayout = K, window.TokUI._internal.zoomBounds = ee, window.TokUI._internal.zoomEnabled = J, window.TokUI._internal.solvePieFs = B, window.TokUI._internal.pieSizing = ce, window.TokUI._internal.MIN_CHART_PX = P, window.TokUI._internal.MAX_CHART_PX = I), t !== void 0 && t.exports && (t.exports = {
+	typeof window < "u" && (window.TokUI = window.TokUI || {}, window.TokUI._internal = window.TokUI._internal || {}, window.TokUI._internal.registerChartComponents = Ze, window.TokUI._internal.registerChartRenderer = $, window.TokUI._internal.bumpFsUnits = R, window.TokUI._internal.applyTipScale = z, window.TokUI._internal.axisXLayout = K, window.TokUI._internal.zoomBounds = Y, window.TokUI._internal.zoomEnabled = J, window.TokUI._internal.solvePieFs = B, window.TokUI._internal.pieSizing = ce, window.TokUI._internal.MIN_CHART_PX = P, window.TokUI._internal.MAX_CHART_PX = I), t !== void 0 && t.exports && (t.exports = {
 		registerChartComponents: Ze,
 		registerChartRenderer: $,
 		bumpFsUnits: R,
@@ -5123,9 +5181,9 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 		MAX_CHART_PX: I,
 		applyTipScale: z,
 		axisXLayout: K,
-		zoomBounds: ee,
+		zoomBounds: Y,
 		zoomEnabled: J,
-		bumpZoomTextFs: ne
+		bumpZoomTextFs: te
 	});
 })), v = /* @__PURE__ */ o(((e, t) => {
 	var n = {
@@ -7556,7 +7614,9 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			"h6"
 		].forEach((n) => {
 			e.register(n, (e) => {
-				let i = t(n, { class: `tokui-${n}` }, e.content || e.attrs && e.attrs.tx), a = r(e.attrs.bg), o = r(e.attrs.fc), s = e.attrs.v || "";
+				let i = t(n, { class: `tokui-${n}` }, e.content || e.attrs && e.attrs.tx);
+				e.attrs && e.attrs.id && (i.id = e.attrs.id);
+				let a = r(e.attrs.bg), o = r(e.attrs.fc), s = e.attrs.v || "";
 				return a && (s.includes("underline") ? i.style.setProperty("--tokui-title-bg", a) : i.style.background = a), o && (i.style.color = o), i;
 			});
 		}), e.register("p", (e, n) => {
@@ -7732,14 +7792,116 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				}
 				e.status !== void 0 && (d.classList.remove("tokui-progress--success", "tokui-progress--error"), e.status === "success" ? d.classList.add("tokui-progress--success") : e.status === "error" && d.classList.add("tokui-progress--error"));
 			}, d;
-		}), e.register("upd", (t) => {
-			var n = t.attrs || {}, r = n.id;
-			if (r && typeof document < "u") {
-				var i = null, a = e._mountRoot;
-				for (a && typeof a.querySelector == "function" && (i = a.querySelector("[id=\"" + String(r).replace(/"/g, "\\\"") + "\"]")), i ||= document.getElementById(r); i && typeof i._update != "function";) i = i.parentElement;
-				i && typeof i._update == "function" && i._update(n);
+		});
+		function u(t) {
+			var n = null, r = e._mountRoot;
+			return r && typeof r.querySelector == "function" && (n = r.querySelector("[id=\"" + String(t).replace(/"/g, "\\\"") + "\"]")), n ||= document.getElementById(t), n;
+		}
+		function m(t) {
+			for (var n = t, r = e._mountRoot || null; n && !n._tokuiType && n.parentElement && n.parentElement !== r;) n = n.parentElement;
+			return n || t;
+		}
+		function _(t, n, r) {
+			if (e._onComponentEvent) try {
+				e._onComponentEvent({
+					type: t,
+					id: n,
+					event: "applied",
+					detail: r
+				});
+			} catch {}
+		}
+		e.register("upd", (e) => {
+			var t = e.attrs || {}, n = t.id;
+			if (n && typeof document < "u") {
+				var r = String(n).split(",").map(function(e) {
+					return e.trim();
+				}).filter(Boolean), i = 0;
+				r.forEach(function(e) {
+					for (var n = u(e); n && typeof n._update != "function";) n = n.parentElement;
+					n && typeof n._update == "function" && (n._update(t), i++);
+				}), _("upd", String(n), {
+					applied: i > 0,
+					targets: r.length,
+					hits: i
+				});
 			}
 			return document.createTextNode("");
+		}), e.register("del", (t) => {
+			var n = (t.attrs || {}).id;
+			if (n && typeof document < "u") {
+				var r = !1, i = u(n);
+				if (i) {
+					var a = m(i);
+					(e.slotStack || []).some(function(e) {
+						return e.el === a || typeof a.contains == "function" && a.contains(e.el);
+					}) ? console.warn("TokUI: del 目标 \"" + n + "\" 正在流式输出中（未闭合），已跳过；请在容器闭合后再发 del") : a.parentNode && (a.parentNode.removeChild(a), r = !0);
+				}
+				_("del", String(n), { removed: r });
+			}
+			return document.createTextNode("");
+		}), e.register("ins", (n, r) => {
+			var i = n.attrs || {}, a = t("div", { class: "tokui-ins-staging" });
+			n.children && n.children.length && r(n.children).forEach(function(e) {
+				e && e.nodeType && a.appendChild(e);
+			});
+			var o = !1;
+			function s(e) {
+				var t = e.parentNode;
+				if (!t || !t.childNodes) return null;
+				var n = Array.prototype.indexOf.call(t.childNodes, e);
+				return n >= 0 && n < t.childNodes.length - 1 ? t.childNodes[n + 1] : null;
+			}
+			var c = {
+				tabs: 1,
+				tab: 1,
+				chart: 1,
+				table: 1,
+				thead: 1,
+				tbody: 1,
+				tr: 1,
+				select: 1,
+				radio: 1,
+				checkbox: 1,
+				picker: 1,
+				transfer: 1,
+				cascader: 1,
+				steps: 1,
+				menu: 1,
+				tree: 1,
+				form: 1
+			};
+			function l() {
+				if (!(o || typeof document > "u")) {
+					o = !0;
+					var t = i.after || i.before || i.into, n = 0;
+					if (t) {
+						var r = u(t);
+						if (r) {
+							var l = m(r), d, f;
+							if (i.into) {
+								var p = l._tokuiType || "";
+								c[p] ? console.warn("TokUI: ins into 不支持结构性容器 \"" + p + "\"（子节点有专用挂载协议），已跳过") : (d = l._slot || l, f = null);
+							} else i.before ? (d = l.parentNode, f = l) : (d = l.parentNode, f = s(l));
+							if (d) {
+								for (var h = []; a.childNodes.length > 0;) h.push(d.insertBefore(a.childNodes[0], f));
+								h.forEach(function(t) {
+									t && t.nodeType === 1 && e.bindEvents(t);
+								}), n = h.length;
+							}
+						}
+					}
+					_("ins", String(t || ""), { moved: n });
+				}
+			}
+			var d = t("span", {
+				class: "tokui-ins-anchor",
+				"data-tokui-tag": "ins",
+				hidden: !0
+			});
+			return d._tokuiType = "ins", d._slot = a, d._streamCloseHook = function() {
+				l(), d.parentNode && d.parentNode.removeChild(d);
+			}, n.children && n.children.length && l(), d;
 		}), e.register("md", (e) => {
 			let n = t("div", { class: "tokui-md" }), r = "";
 			return r = e.children && e.children.length > 0 ? e.children.map((e) => e.content || "").join("") : e.content || "", r && (n.innerHTML = p(r), f(n)), n._streamCloseHook = function() {
@@ -7748,10 +7910,10 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				e && (n.innerHTML = p(e), f(n));
 			}, n._tokuiType = "md", n;
 		});
-		function u(e) {
+		function v(e) {
 			return String(e).replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
 		}
-		function m(e) {
+		function y(e) {
 			return e.split("\n").map(function(e) {
 				return "<span class=\"code-line\">" + (e || " ") + "</span>";
 			}).join("");
@@ -7761,18 +7923,18 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			var c = "";
 			c = e.children && e.children.length > 0 ? e.children.map((e) => e.content || "").join("") : e.content || "";
 			function l() {
-				o !== "text" && i[o] ? s.innerHTML = m(a(c, o)) : s.innerHTML = m(u(c));
+				o !== "text" && i[o] ? s.innerHTML = y(a(c, o)) : s.innerHTML = y(v(c));
 			}
 			l(), r.appendChild(s), r._slot = s, r._tokuiType = "code";
-			var d = t("button", {
+			var u = t("button", {
 				class: "tokui-code__copy",
 				type: "button"
 			});
-			return d.textContent = n("common.copy"), d.addEventListener("click", function() {
-				c && navigator.clipboard && navigator.clipboard.writeText(c), d.textContent = n("common.copied"), d.classList.add("tokui-code__copy--done"), setTimeout(function() {
-					d.textContent = n("common.copy"), d.classList.remove("tokui-code__copy--done");
+			return u.textContent = n("common.copy"), u.addEventListener("click", function() {
+				c && navigator.clipboard && navigator.clipboard.writeText(c), u.textContent = n("common.copied"), u.classList.add("tokui-code__copy--done"), setTimeout(function() {
+					u.textContent = n("common.copy"), u.classList.remove("tokui-code__copy--done");
 				}, 2e3);
-			}), r.appendChild(d), r._streamAppendHook = function(e) {
+			}), r.appendChild(u), r._streamAppendHook = function(e) {
 				e && e.type === "_text" && e.content && (c += e.content, l());
 			}, r._streamCloseHook = l, r;
 		}), e.register("callout", (e, n) => {
@@ -8163,7 +8325,8 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			}
 			var h = t("div", { class: "tokui-pagination__pages" });
 			p.appendChild(h);
-			function g(e) {
+			var g = e.createReporter("pagination", i, p);
+			function _(e) {
 				h.innerHTML = "";
 				var n = t("button", {
 					class: "tokui-pagination__btn tokui-pagination__prev" + (e <= 1 ? " tokui-pagination__btn--disabled" : ""),
@@ -8189,13 +8352,16 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				});
 				r.textContent = "›", h.appendChild(r);
 			}
-			return g(d), p.addEventListener("click", function(t) {
+			return _(d), p.addEventListener("click", function(t) {
 				var n = t.target.closest("[data-page]");
 				if (!(!n || n.disabled)) {
 					var r = parseInt(n.getAttribute("data-page"), 10);
-					if (!(isNaN(r) || r < 1 || r > a) && (d = r, g(d), o)) {
-						var i = e.eventBus && e.eventBus.getHandler(o);
-						i && i({ page: r }, t, n);
+					if (!(isNaN(r) || r < 1 || r > a)) {
+						if (d = r, _(d), o) {
+							var i = e.eventBus && e.eventBus.getHandler(o);
+							i && i({ page: r }, t, n);
+						}
+						g("change", { value: r });
 					}
 				}
 			}), p;
@@ -8484,36 +8650,37 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			return e.children && e.children.length > 0 && n(e.children).forEach(function(e) {
 				e && e.nodeType && r.appendChild(e);
 			}), e.content && r.appendChild(document.createTextNode(e.content)), r._tokuiType = "hover-content", r._slot = r, r;
-		}), e.register("input-tag", (e, r) => {
-			var i = e.attrs || {}, a = i.ph || n("inputTag.placeholder"), o = i.n || "tags", s = i.id || "", c = parseInt(i.max) || 0, l = (i.tags || "").split(",").map(function(e) {
+		}), e.register("input-tag", (r, i) => {
+			var a = r.attrs || {}, o = a.ph || n("inputTag.placeholder"), s = a.n || "tags", c = a.id || "", l = parseInt(a.max) || 0, u = (a.tags || "").split(",").map(function(e) {
 				return e.trim();
-			}).filter(Boolean), u = t("div", {
+			}).filter(Boolean), d = t("div", {
 				class: "tokui-input-tag",
 				role: "group"
 			});
-			s && (u.id = s);
-			var d = t("div", { class: "tokui-field" });
-			i.l && d.appendChild(t("label", { class: "tokui-label" }, i.l));
-			var f = t("div", { class: "tokui-input-tag__box" }), p = t("div", {
+			c && (d.id = c);
+			var f = t("div", { class: "tokui-field" });
+			a.l && f.appendChild(t("label", { class: "tokui-label" }, a.l));
+			var p = t("div", { class: "tokui-input-tag__box" }), m = t("div", {
 				class: "tokui-input-tag__list",
 				role: "list"
 			});
-			l.forEach(function(e) {
-				p.appendChild(g(e));
-			}), f.appendChild(p);
-			var m = t("input", {
+			u.forEach(function(e) {
+				m.appendChild(v(e));
+			}), p.appendChild(m);
+			var h = t("input", {
 				class: "tokui-input-tag__input",
 				type: "text",
-				placeholder: a
+				placeholder: o
 			});
-			f.appendChild(m);
-			var h = t("input", {
+			p.appendChild(h);
+			var g = t("input", {
 				type: "hidden",
-				name: o,
-				value: l.join(",")
+				name: s,
+				value: u.join(",")
 			});
-			f.appendChild(h), d.appendChild(f), u.appendChild(d);
-			function g(e) {
+			p.appendChild(g), f.appendChild(p), d.appendChild(f);
+			var _ = e.createReporter("input-tag", a, d);
+			function v(e) {
 				var n = t("span", {
 					class: "tokui-input-tag__tag",
 					role: "listitem"
@@ -8521,39 +8688,42 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				n.textContent = e;
 				var r = t("span", { class: "tokui-input-tag__close" });
 				return r.textContent = "×", r.addEventListener("click", function() {
-					n.remove(), _();
+					n.remove(), b();
 				}), n.appendChild(r), n;
 			}
-			function _() {
-				h.value = Array.from(p.querySelectorAll(".tokui-input-tag__tag")).map(function(e) {
-					return e.firstChild.textContent;
-				}).join(",");
+			function y(e) {
+				var t = e.firstChild || e.childNodes && e.childNodes[0];
+				return t && t.textContent || "";
+			}
+			function b() {
+				g.value = Array.from(m.querySelectorAll(".tokui-input-tag__tag")).map(y).join(","), _("change", {
+					value: g.value,
+					name: s
+				});
 			}
-			return m.addEventListener("keydown", function(e) {
+			return h.addEventListener("keydown", function(e) {
 				if (e.key === "Enter") {
 					e.preventDefault();
-					var t = m.value.trim();
+					var t = h.value.trim();
 					if (!t) return;
-					var n = Array.from(p.querySelectorAll(".tokui-input-tag__tag")).map(function(e) {
-						return e.firstChild.textContent;
-					});
+					var n = Array.from(m.querySelectorAll(".tokui-input-tag__tag")).map(y);
 					if (n.indexOf(t) !== -1) {
-						m.value = "";
+						h.value = "";
 						return;
 					}
-					if (c > 0 && n.length >= c) {
-						m.value = "";
+					if (l > 0 && n.length >= l) {
+						h.value = "";
 						return;
 					}
-					p.appendChild(g(t)), m.value = "", _();
+					m.appendChild(v(t)), h.value = "", b();
 				}
-				if (e.key === "Backspace" && !m.value) {
-					var r = p.querySelectorAll(".tokui-input-tag__tag");
-					r.length > 0 && (r[r.length - 1].remove(), _());
+				if (e.key === "Backspace" && !h.value) {
+					var r = m.querySelectorAll(".tokui-input-tag__tag");
+					r.length > 0 && (r[r.length - 1].remove(), b());
 				}
-			}), u._update = function(e) {
-				e.dis === !0 || e.dis === "true" ? (m.disabled = !0, u.classList.add("tokui-input-tag--disabled")) : (e.dis === !1 || e.dis === "false") && (m.disabled = !1, u.classList.remove("tokui-input-tag--disabled"));
-			}, u._tokuiType = "input-tag", u;
+			}), d._update = function(e) {
+				e.dis === !0 || e.dis === "true" ? (h.disabled = !0, d.classList.add("tokui-input-tag--disabled")) : (e.dis === !1 || e.dis === "false") && (h.disabled = !1, d.classList.remove("tokui-input-tag--disabled"));
+			}, d._tokuiType = "input-tag", d;
 		}), e.register("countdown", (e) => {
 			var r = e.attrs || {}, i = parseInt(r.target) || 0, a = parseInt(r.dur) || 0, o = r.l || "", s = r.s || "", c = r.tx || n("countdown.ended"), l = r.id || "", u = r.fmt || "dhms", d = r.clk || "";
 			!i && a > 0 && (i = Date.now() + a * 1e3);
@@ -8823,7 +8993,20 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				var A = t("div", { class: "tokui-calendar__day tokui-calendar__day--other" }), j = t("span", { class: "tokui-calendar__day__num" });
 				j.textContent = F, A.appendChild(j), w.appendChild(A);
 			}
-			return S.appendChild(w), S._tokuiType = "calendar", S;
+			return S.appendChild(w), r.id && (S.id = r.id), S._update = function(e) {
+				var t = e.v === void 0 ? e.sel : e.v;
+				if (t !== void 0) {
+					var n = {};
+					String(t).split(",").forEach(function(e) {
+						var t = parseInt(e.trim(), 10);
+						t > 0 && (n[t] = !0);
+					});
+					for (var r = w.querySelectorAll(".tokui-calendar__day"), i = 0; i < r.length; i++) {
+						var a = r[i];
+						a.classList.contains("tokui-calendar__day--other") || (n[parseInt(a.textContent, 10)] ? a.classList.add("tokui-calendar__day--selected") : a.classList.remove("tokui-calendar__day--selected"));
+					}
+				}
+			}, S._tokuiType = "calendar", S;
 		}), e.register("notification", (e) => {
 			var r = e.attrs || {}, i = r.id || "", a = r.t || "info", o = r.tt || "", s = r.tx || "", c = r.duration === void 0 ? 4500 : parseInt(r.duration);
 			isNaN(c) && (c = 4500);
@@ -8922,66 +9105,79 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				type: "button",
 				"aria-label": n("common.send")
 			});
-			if (h.innerHTML = "<svg viewBox=\"0 0 20 20\" width=\"18\" height=\"18\" fill=\"currentColor\"><path d=\"M10 3a1 1 0 0 1 .7.3l5 5a1 1 0 0 1-1.4 1.4L11 6.4V16a1 1 0 1 1-2 0V6.4l-3.3 3.3a1 1 0 0 1-1.4-1.4l5-5A1 1 0 0 1 10 3z\"/></svg>", c && (h.setAttribute("disabled", ""), h.classList.add("tokui-chat-input__send--disabled")), m.appendChild(h), f.appendChild(m), l > 0) {
-				var g = t("span", { class: "tokui-chat-input__counter" });
-				g.textContent = "0/" + l, f.appendChild(g), p.addEventListener("input", function() {
+			h.innerHTML = "<svg viewBox=\"0 0 20 20\" width=\"18\" height=\"18\" fill=\"currentColor\"><path d=\"M10 3a1 1 0 0 1 .7.3l5 5a1 1 0 0 1-1.4 1.4L11 6.4V16a1 1 0 1 1-2 0V6.4l-3.3 3.3a1 1 0 0 1-1.4-1.4l5-5A1 1 0 0 1 10 3z\"/></svg>", c && (h.setAttribute("disabled", ""), h.classList.add("tokui-chat-input__send--disabled")), m.appendChild(h);
+			var g = e.createReporter("chat-input", a, f), _ = t("button", {
+				class: "tokui-chat-input__stop",
+				type: "button",
+				"aria-label": n("common.stop")
+			});
+			if (_.innerHTML = "<svg viewBox=\"0 0 20 20\" width=\"18\" height=\"18\" fill=\"currentColor\"><rect x=\"5\" y=\"5\" width=\"10\" height=\"10\" rx=\"1.5\"/></svg>", _.addEventListener("click", function() {
+				if (g("stop", {}), f.classList.remove("tokui-chat-input--streaming"), !String(a.on || "").split(",").some(function(e) {
+					return e.trim().indexOf("stop:") === 0;
+				})) {
+					var t = e._tokuiInstance || typeof window < "u" && window.TokUI && window.TokUI._instance;
+					t && typeof t.disconnect == "function" && t.disconnect();
+				}
+			}), m.appendChild(_), a.streaming !== void 0 && f.classList.add("tokui-chat-input--streaming"), f.appendChild(m), l > 0) {
+				var v = t("span", { class: "tokui-chat-input__counter" });
+				v.textContent = "0/" + l, f.appendChild(v), p.addEventListener("input", function() {
 					var e = (p.value || "").length;
-					g.textContent = e + "/" + l, e > l ? g.classList.add("tokui-chat-input__counter--over") : g.classList.remove("tokui-chat-input__counter--over");
+					v.textContent = e + "/" + l, e > l ? v.classList.add("tokui-chat-input__counter--over") : v.classList.remove("tokui-chat-input__counter--over");
 				});
 			}
 			u && p.addEventListener("input", function() {
 				p.style.height = "auto", p.style.height = p.scrollHeight + "px";
 			});
-			function _() {
+			function y() {
 				if (!c) {
 					var t = p.value || "";
 					if (t.trim()) {
 						if (s && (f.setAttribute("data-tokui-clk-value", t), e.eventBus)) {
 							var n = e.eventBus.getHandler(s);
-							n && n({ value: t }, null, f);
+							n ? n({ value: t }, null, f) : e._warnMissingHandler(s);
 						}
-						p.value = "", l > 0 && (g.textContent = "0/" + l, g.classList.remove("tokui-chat-input__counter--over")), u && (p.style.height = "auto");
+						g("send", { value: t }), p.value = "", l > 0 && (v.textContent = "0/" + l, v.classList.remove("tokui-chat-input__counter--over")), u && (p.style.height = "auto");
 					}
 				}
 			}
 			return p.addEventListener("keydown", function(e) {
-				e.key === "Enter" && !e.shiftKey && (e.preventDefault(), _());
+				e.key === "Enter" && !e.shiftKey && (e.preventDefault(), y());
 			}), h.addEventListener("click", function() {
-				_();
+				y();
 			}), f._update = function(e) {
-				e.dis !== void 0 && (c = !!e.dis, c ? (p.setAttribute("disabled", ""), p.classList.add("tokui-chat-input__textarea--disabled"), h.setAttribute("disabled", ""), h.classList.add("tokui-chat-input__send--disabled")) : (p.removeAttribute("disabled"), p.classList.remove("tokui-chat-input__textarea--disabled"), h.removeAttribute("disabled"), h.classList.remove("tokui-chat-input__send--disabled")));
+				e.dis !== void 0 && (c = !!e.dis, c ? (p.setAttribute("disabled", ""), p.classList.add("tokui-chat-input__textarea--disabled"), h.setAttribute("disabled", ""), h.classList.add("tokui-chat-input__send--disabled")) : (p.removeAttribute("disabled"), p.classList.remove("tokui-chat-input__textarea--disabled"), h.removeAttribute("disabled"), h.classList.remove("tokui-chat-input__send--disabled"))), e.streaming !== void 0 && (e.streaming !== "false" && e.streaming !== !1 ? f.classList.add("tokui-chat-input--streaming") : f.classList.remove("tokui-chat-input--streaming"));
 			}, f._slot = p, f._tokuiType = "chat-input", f;
-		}), e.register("msg-actions", (e, r) => {
-			var i = e.attrs || {}, a = i.clk || "", o = "tokui-msg-actions";
-			i.visible && (o += " tokui-msg-actions--visible");
-			var s = t("div", { class: o }), c = {
+		}), e.register("msg-actions", (r, i) => {
+			var a = r.attrs || {}, o = a.clk || "", s = "tokui-msg-actions";
+			a.visible && (s += " tokui-msg-actions--visible");
+			var c = t("div", { class: s }), l = {
 				copy: "<svg viewBox=\"0 0 24 24\" width=\"15\" height=\"15\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"8\" y=\"8\" width=\"13\" height=\"13\" rx=\"2\"/><path d=\"M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2\"/></svg>",
 				regenerate: "<svg viewBox=\"0 0 24 24\" width=\"15\" height=\"15\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8\"/><path d=\"M21 3v5h-5\"/><path d=\"M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16\"/><path d=\"M3 21v-5h5\"/></svg>",
 				like: "<svg viewBox=\"0 0 24 24\" width=\"15\" height=\"15\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M7 10v12\"/><path d=\"M15 5.88 14 10h5.83a2 2 0 0 1 1.92 2.56l-2.33 8A2 2 0 0 1 17.5 22H4a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2.76a2 2 0 0 0 1.79-1.11L12 2a3.13 3.13 0 0 1 3 3.88Z\"/></svg>",
 				dislike: "<svg viewBox=\"0 0 24 24\" width=\"15\" height=\"15\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M17 14V2\"/><path d=\"M9 18.12 10 14H4.17a2 2 0 0 1-1.92-2.56l2.33-8A2 2 0 0 1 6.5 2H20a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-2.76a2 2 0 0 0-1.79 1.11L12 22a3.13 3.13 0 0 1-3-3.88Z\"/></svg>",
 				delete: "<svg viewBox=\"0 0 24 24\" width=\"15\" height=\"15\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"3 6 5 6 21 6\"/><path d=\"M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2\"/></svg>"
-			}, l = [];
-			return i.copy !== void 0 && l.push({
+			}, u = [];
+			a.copy !== void 0 && u.push({
 				act: "copy",
-				icon: c.copy,
+				icon: l.copy,
 				label: n("actions.copy")
-			}), i.regenerate !== void 0 && l.push({
+			}), a.regenerate !== void 0 && u.push({
 				act: "regenerate",
-				icon: c.regenerate,
+				icon: l.regenerate,
 				label: n("actions.regenerate")
-			}), i.like !== void 0 && (l.push({
+			}), a.like !== void 0 && (u.push({
 				act: "like",
-				icon: c.like,
+				icon: l.like,
 				label: n("actions.like")
-			}), l.push({
+			}), u.push({
 				act: "dislike",
-				icon: c.dislike,
+				icon: l.dislike,
 				label: n("actions.dislike")
-			})), i.delete !== void 0 && l.push({
+			})), a.delete !== void 0 && u.push({
 				act: "delete",
-				icon: c.delete,
+				icon: l.delete,
 				label: n("actions.delete")
-			}), l.forEach(function(e) {
+			}), u.forEach(function(e) {
 				var n = t("button", {
 					class: "tokui-msg-actions__btn",
 					type: "button",
@@ -8989,56 +9185,84 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 					"aria-label": e.label,
 					title: e.label
 				}), r = t("span", { class: "tokui-msg-actions__icon" });
-				r.innerHTML = e.icon, n.appendChild(r), s.appendChild(n);
-			}), e.children && e.children.length > 0 && r(e.children).forEach(function(e) {
-				e && e.nodeType && s.appendChild(e);
-			}), a && (s.setAttribute("data-tokui-clk", a), s.addEventListener("click", function(e) {
+				r.innerHTML = e.icon, n.appendChild(r), c.appendChild(n);
+			}), r.children && r.children.length > 0 && i(r.children).forEach(function(e) {
+				e && e.nodeType && c.appendChild(e);
+			});
+			var d = e.createReporter("msg-actions", a, c);
+			return o && c.setAttribute("data-tokui-clk", o), c.addEventListener("click", function(e) {
 				var t = e.target.closest && e.target.closest(".tokui-msg-actions__btn");
 				if (t) {
 					var n = t.getAttribute("data-act");
-					n && s.setAttribute("data-tokui-clk-act", n);
+					n && (c.setAttribute("data-tokui-clk-act", n), d("action", { act: n }));
 				}
-			})), s._slot = s, s._tokuiType = "msg-actions", s;
-		}), e.register("tool-call", (e, r) => {
-			var i = e.attrs || {}, a = i.name || "tool", o = i.status || "pending", s = i.duration || "", c = { class: "tokui-tool-call tokui-tool-call--" + o };
-			i.id && (c.id = i.id);
-			var l = t("div", c), u = t("div", { class: "tokui-tool-call__header" }), d = t("span", { class: "tokui-tool-call__status-dot tokui-tool-call__status-dot--" + o });
-			u.appendChild(d);
-			var f = t("span", { class: "tokui-tool-call__name" });
-			f.textContent = a, u.appendChild(f);
-			var p = t("span", { class: "tokui-tool-call__status" }), m = {
+			}), c._slot = c, c._tokuiType = "msg-actions", c;
+		}), e.register("tool-call", (r, i) => {
+			var a = r.attrs || {}, o = a.name || "tool", s = a.status || "pending", c = a.duration || "", l = { class: "tokui-tool-call tokui-tool-call--" + s };
+			a.id && (l.id = a.id);
+			var u = t("div", l), d = t("div", { class: "tokui-tool-call__header" }), f = t("span", { class: "tokui-tool-call__status-dot tokui-tool-call__status-dot--" + s });
+			d.appendChild(f);
+			var p = t("span", { class: "tokui-tool-call__name" });
+			p.textContent = o, d.appendChild(p);
+			var m = t("span", { class: "tokui-tool-call__status" }), h = {
 				pending: n("status.pending"),
 				running: n("status.running"),
 				done: n("status.done"),
 				error: n("status.error"),
 				denied: n("status.denied")
 			};
-			if (p.textContent = m[o] || o, u.appendChild(p), s) {
-				var h = t("span", { class: "tokui-tool-call__duration" });
-				h.textContent = s, u.appendChild(h);
+			if (m.textContent = h[s] || s, d.appendChild(m), c) {
+				var g = t("span", { class: "tokui-tool-call__duration" });
+				g.textContent = c, d.appendChild(g);
 			}
-			l.appendChild(u);
-			var g = t("div", { class: "tokui-tool-call__body" });
-			if (e.content) {
-				var _ = t("div", { class: "tokui-tool-call__params" });
-				_.textContent = e.content, g.appendChild(_);
+			u.appendChild(d);
+			var _ = t("div", { class: "tokui-tool-call__body" });
+			if (r.content) {
+				var v = t("div", { class: "tokui-tool-call__params" });
+				v.textContent = r.content, _.appendChild(v);
+			}
+			if (i(r.children || []).forEach(function(e) {
+				e && e.nodeType && _.appendChild(e);
+			}), u.appendChild(_), a.approval !== void 0 && s === "pending") {
+				var y = e.createReporter("tool-call", a, u), b = a.clk || "", x = t("div", { class: "tokui-tool-call__approval" }), S = t("button", {
+					class: "tokui-tool-call__approve",
+					type: "button"
+				}, n("actions.approve")), C = t("button", {
+					class: "tokui-tool-call__deny",
+					type: "button"
+				}, n("actions.deny")), w = function(t) {
+					S.setAttribute("disabled", ""), C.setAttribute("disabled", ""), (t ? S : C).classList.add("tokui-tool-call__approval--chosen"), x.classList.add("tokui-tool-call__approval--decided");
+					var n = {
+						approved: t,
+						id: a.id || null,
+						name: o
+					};
+					if (b && e.eventBus) {
+						var r = e.eventBus.getHandler(b);
+						r && r(n, null, u);
+					}
+					y("approval", n);
+				};
+				S.addEventListener("click", function() {
+					w(!0);
+				}), C.addEventListener("click", function() {
+					w(!1);
+				}), x.appendChild(S), x.appendChild(C), u.appendChild(x);
 			}
-			return r(e.children || []).forEach(function(e) {
-				e && e.nodeType && g.appendChild(e);
-			}), l.appendChild(g), l._slot = g, l._tokuiType = "tool-call", l._update = function(e) {
-				if (e.status && (l.className = "tokui-tool-call tokui-tool-call--" + e.status, d.className = "tokui-tool-call__status-dot tokui-tool-call__status-dot--" + e.status, p.textContent = m[e.status] || e.status), e.duration) {
-					var n = l.querySelector(".tokui-tool-call__duration");
-					n || (n = t("span", { class: "tokui-tool-call__duration" }), u.appendChild(n)), n.textContent = e.duration;
+			return u._slot = _, u._tokuiType = "tool-call", u._update = function(e) {
+				if (e.status && (u.className = "tokui-tool-call tokui-tool-call--" + e.status, f.className = "tokui-tool-call__status-dot tokui-tool-call__status-dot--" + e.status, m.textContent = h[e.status] || e.status), e.duration) {
+					var n = u.querySelector(".tokui-tool-call__duration");
+					n || (n = t("span", { class: "tokui-tool-call__duration" }), d.appendChild(n)), n.textContent = e.duration;
 				}
 				if (e.result) {
 					var r = t("div", { class: "tokui-tool-call__result" });
-					r.textContent = e.result, g.appendChild(r);
+					r.textContent = e.result, _.appendChild(r);
 				}
 				if (e.error) {
 					var i = t("div", { class: "tokui-tool-call__error" });
-					i.textContent = e.error, g.appendChild(i);
+					i.textContent = e.error, _.appendChild(i);
 				}
-			}, l;
+			}, u;
 		}), e.register("typing", (e) => {
 			for (var n = e.attrs || {}, r = t("div", { class: "tokui-typing" }), i = t("span", { class: "tokui-typing__dots" }), a = 0; a < 3; a++) {
 				var o = t("span", { class: "tokui-typing__dot" });
@@ -9049,17 +9273,26 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				s.textContent = n.text, r.appendChild(s);
 			}
 			return r;
-		}), e.register("quick-reply", (e, n) => {
-			var r = e.attrs || {}, i = t("div", { class: "tokui-quick-reply" }), a = t("div", { class: "tokui-quick-reply__items" });
-			return r.items && r.items.split(",").forEach(function(e) {
-				var n = t("button", {
+		}), e.register("quick-reply", (n, r) => {
+			var i = n.attrs || {}, a = i.clk || "", o = t("div", { class: "tokui-quick-reply" }), s = t("div", { class: "tokui-quick-reply__items" }), c = e.createReporter("quick-reply", i, o);
+			function l(t) {
+				if (a && e.eventBus) {
+					var n = e.eventBus.getHandler(a);
+					n ? n({ value: t }, null, o) : e._warnMissingHandler(a);
+				}
+				c("select", { value: t });
+			}
+			return i.items && i.items.split(",").forEach(function(e) {
+				var n = e.trim(), r = t("button", {
 					class: "tokui-quick-reply__item",
 					type: "button"
 				});
-				n.textContent = e.trim(), a.appendChild(n);
-			}), e.children && e.children.length && n(e.children).forEach(function(e) {
-				e && e.nodeType && a.appendChild(e);
-			}), i.appendChild(a), i._slot = a, i._tokuiType = "quick-reply", i;
+				r.textContent = n, r.addEventListener("click", function() {
+					l(n);
+				}), s.appendChild(r);
+			}), n.children && n.children.length && r(n.children).forEach(function(e) {
+				e && e.nodeType && s.appendChild(e);
+			}), o.appendChild(s), o._slot = s, o._tokuiType = "quick-reply", o;
 		}), e.register("suggestions", (e, n) => {
 			var r = e.attrs || {}, i = Math.min(4, Math.max(1, parseInt(r.cols) || 2)), a = t("div", { class: "tokui-suggestions" });
 			r.clk && a.setAttribute("data-tokui-clk", r.clk), r.id && (a.id = r.id);
@@ -9067,28 +9300,32 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			return o.style.gridTemplateColumns = "repeat(" + i + ", 1fr)", e.children && e.children.length && n(e.children).forEach(function(e) {
 				e && e.nodeType && o.appendChild(e);
 			}), a.appendChild(o), a._slot = o, a._tokuiType = "suggestions", a;
-		}), e.register("suggestion", (e) => {
-			var n = e.attrs || {}, r = n.tt || "", i = n.tx || "", a = n.icon || "", o = t("div", {
+		}), e.register("suggestion", (n) => {
+			var r = n.attrs || {}, i = r.tt || "", a = r.tx || "", o = r.icon || "", s = t("div", {
 				class: "tokui-suggestion",
 				role: "button",
 				tabindex: "0"
 			});
-			if (n.clk && o.setAttribute("data-tokui-clk", n.clk), n.dis !== void 0 && (o.classList.add("tokui-suggestion--disabled"), o.setAttribute("aria-disabled", "true")), a) {
-				var s = t("span", { class: "tokui-suggestion__icon" });
-				s.textContent = a, o.appendChild(s);
-			}
-			var c = t("div", { class: "tokui-suggestion__body" });
-			if (r) {
-				var l = t("div", { class: "tokui-suggestion__title" });
-				l.textContent = r, c.appendChild(l);
+			r.clk && s.setAttribute("data-tokui-clk", r.clk);
+			var c = e.createReporter("suggestion", r, s);
+			if (s.addEventListener("click", function() {
+				c("select", { value: i || a });
+			}), r.dis !== void 0 && (s.classList.add("tokui-suggestion--disabled"), s.setAttribute("aria-disabled", "true")), o) {
+				var l = t("span", { class: "tokui-suggestion__icon" });
+				l.textContent = o, s.appendChild(l);
 			}
+			var u = t("div", { class: "tokui-suggestion__body" });
 			if (i) {
-				var u = t("div", { class: "tokui-suggestion__desc" });
-				u.textContent = i, c.appendChild(u);
+				var d = t("div", { class: "tokui-suggestion__title" });
+				d.textContent = i, u.appendChild(d);
 			}
-			return o.appendChild(c), o.addEventListener("keydown", function(e) {
-				(e.key === "Enter" || e.key === " ") && (e.preventDefault(), o.click());
-			}), o;
+			if (a) {
+				var f = t("div", { class: "tokui-suggestion__desc" });
+				f.textContent = a, u.appendChild(f);
+			}
+			return s.appendChild(u), s.addEventListener("keydown", function(e) {
+				(e.key === "Enter" || e.key === " ") && (e.preventDefault(), s.click());
+			}), s;
 		}), e.register("source", (e) => {
 			var n = e.attrs || {}, r = n.n || "1", i = n.tt || "", a = n.sn || "", o = n.u || n.url || "", s = t("div", { class: "tokui-source" }), c = t("span", { class: "tokui-source__num" });
 			c.textContent = r, s.appendChild(c);
@@ -9107,7 +9344,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			}
 			return s.appendChild(l), s;
 		});
-		function _(e, n) {
+		function b(e, n) {
 			e.innerHTML = "";
 			var r = n.split("\n"), i = 0, a = 0;
 			r.forEach(function(n) {
@@ -9134,7 +9371,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				return e.content || "";
 			}).join("") : e.content || "";
 			function u() {
-				_(c, l);
+				b(c, l);
 			}
 			return u(), i.appendChild(c), i._slot = c, i._tokuiType = "diff", i._streamAppendHook = function(e) {
 				e && e.type === "_text" && e.content && (l += e.content, u());
@@ -9459,7 +9696,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				e && e.nodeType && c.appendChild(e);
 			}), i.appendChild(c), i._slot = c, i._tokuiType = "test-result", i;
 		});
-		function v(e) {
+		function x(e) {
 			var n = e.attrs || {}, r = n.status || "pass", i = t("div", {
 				class: "tokui-test-case tokui-test-case--" + r,
 				"data-tokui-tag": e.type
@@ -9480,36 +9717,36 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			}
 			return i;
 		}
-		e.register("test-case", (e) => v(e)), e.register("case", (e) => v(e)), e.register("conversations", (e, r) => {
-			var i = e.attrs || {}, a = i.clk || "", o = i.act || "", s = t("div", {
+		e.register("test-case", (e) => x(e)), e.register("case", (e) => x(e)), e.register("conversations", (r, i) => {
+			var a = r.attrs || {}, o = a.clk || "", s = a.act || "", c = t("div", {
 				class: "tokui-conversations",
 				role: "list"
-			}), c = (e.children || []).filter(function(e) {
+			}), l = e.createReporter("conversations", a, c), u = (r.children || []).filter(function(e) {
 				return e.type === "conv";
-			}), l = null;
-			if (c.length === 0) return l = t("div", { class: "tokui-conversations__empty" }), l.textContent = n("chat.emptySessions"), s.appendChild(l), s._slot = s, s._tokuiType = "conversations", s._convHandlerName = a, s._convActiveAct = o, s._streamCloseHook = function() {
-				s.querySelector(".tokui-conv") && l && l.parentNode && l.parentNode.removeChild(l);
-			}, s;
-			var u = b(c);
-			return u.forEach(function(e) {
-				if (u.length > 1) {
+			}), d = null;
+			if (u.length === 0) return d = t("div", { class: "tokui-conversations__empty" }), d.textContent = n("chat.emptySessions"), c.appendChild(d), c._slot = c, c._tokuiType = "conversations", c._convHandlerName = o, c._convActiveAct = s, c._streamCloseHook = function() {
+				c.querySelector(".tokui-conv") && d && d.parentNode && d.parentNode.removeChild(d);
+			}, c;
+			var f = C(u);
+			return f.forEach(function(e) {
+				if (f.length > 1) {
 					var n = t("div", { class: "tokui-conversations__group-header" });
-					n.textContent = e.label, s.appendChild(n);
+					n.textContent = e.label, c.appendChild(n);
 				}
 				e.items.forEach(function(e) {
-					var t = x(e, a, o, s);
-					s.appendChild(t);
+					var t = w(e, o, s, c, l);
+					c.appendChild(t);
 				});
-			}), s._slot = s, s._tokuiType = "conversations", s;
-		}), e.register("conv", (e) => x(e, "", "", null));
-		function y(e) {
+			}), c._slot = c, c._tokuiType = "conversations", c;
+		}), e.register("conv", (e) => w(e, "", "", null, null));
+		function S(e) {
 			return /^\d{1,2}:\d{2}$/.test(e);
 		}
-		function b(e) {
+		function C(e) {
 			var t = [], r = [], i = [];
 			e.forEach(function(e) {
 				var n = e.attrs && e.attrs.time || "";
-				y(n) ? t.push(e) : n === "昨天" ? r.push(e) : i.push(e);
+				S(n) ? t.push(e) : n === "昨天" ? r.push(e) : i.push(e);
 			});
 			var a = [];
 			return t.length && a.push({
@@ -9526,42 +9763,45 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				items: e
 			}];
 		}
-		function x(e, r, i, a) {
-			var o = e.attrs || {}, s = o.tt || "", c = o.time || "", l = o.active === !0 || o.active === "true";
-			!l && i && o.act && o.act === i && (l = !0);
-			var u = ["tokui-conv"];
-			l && u.push("tokui-conv--active");
-			var d = t("div", {
-				class: u.join(" "),
+		function w(e, r, i, a, o) {
+			var s = e.attrs || {}, c = s.tt || "", l = s.time || "", u = s.id || c, d = s.active === !0 || s.active === "true";
+			!d && i && s.act && s.act === i && (d = !0);
+			var f = ["tokui-conv"];
+			d && f.push("tokui-conv--active");
+			var p = t("div", {
+				class: f.join(" "),
 				role: "listitem",
 				tabindex: "0",
 				"data-tokui-tag": "conv"
-			}), f = t("div", { class: "tokui-conv__title" });
-			if (f.textContent = s, d.appendChild(f), c) {
-				var p = t("span", { class: "tokui-conv__time" });
-				p.textContent = c, d.appendChild(p);
+			}), m = t("div", { class: "tokui-conv__title" });
+			if (m.textContent = c, p.appendChild(m), l) {
+				var h = t("span", { class: "tokui-conv__time" });
+				h.textContent = l, p.appendChild(h);
 			}
-			var m = t("div", { class: "tokui-conv__actions" }), h = t("button", {
+			var g = t("div", { class: "tokui-conv__actions" }), _ = t("button", {
 				class: "tokui-conv__delete",
 				type: "button",
 				"aria-label": n("common.delete")
 			});
-			return h.textContent = "×", m.appendChild(h), d.appendChild(m), d.addEventListener("click", function(e) {
-				if (!(e.target.closest && e.target.closest(".tokui-conv__delete")) && ((a ? a.querySelectorAll(".tokui-conv") : [d]).forEach(function(e) {
-					e.classList.remove("tokui-conv--active");
-				}), d.classList.add("tokui-conv--active"), r)) {
-					var t = typeof window < "u" && window.TokUI && window.TokUI._internal ? window.TokUI._internal.eventBus : null;
-					t && typeof t.emit == "function" && t.emit(r, {
-						tt: s,
-						time: c,
-						act: o.act || ""
-					});
+			return _.textContent = "×", g.appendChild(_), p.appendChild(g), p.addEventListener("click", function(e) {
+				if (!(e.target.closest && e.target.closest(".tokui-conv__delete"))) {
+					if ((a ? a.querySelectorAll(".tokui-conv") : [p]).forEach(function(e) {
+						e.classList.remove("tokui-conv--active");
+					}), p.classList.add("tokui-conv--active"), r) {
+						var t = typeof window < "u" && window.TokUI && window.TokUI._internal ? window.TokUI._internal.eventBus : null;
+						t && typeof t.emit == "function" && t.emit(r, {
+							tt: c,
+							time: l,
+							act: s.act || ""
+						});
+					}
+					o && o("change", { value: u });
 				}
-			}), d.addEventListener("keydown", function(e) {
-				e.key === "Enter" && d.click();
-			}), h.addEventListener("click", function(e) {
-				e.stopPropagation(), d.parentNode && d.parentNode.removeChild(d);
-			}), r && d.setAttribute("data-tokui-clk", r), d;
+			}), p.addEventListener("keydown", function(e) {
+				e.key === "Enter" && p.click();
+			}), _.addEventListener("click", function(e) {
+				e.stopPropagation(), p.parentNode && p.parentNode.removeChild(p), o && o("delete", { value: u });
+			}), r && p.setAttribute("data-tokui-clk", r), p;
 		}
 		e.register("welcome", (e, n) => {
 			var r = e.attrs || {}, i = r.tt || "", a = r.st || "", o = r.bd ? String(r.bd).split(",") : [], s = r.hd || "", c = r.ft || "", l = t("div", { class: "tokui-welcome" });
@@ -9600,7 +9840,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			}
 			return l._slot = h, l._tokuiType = "welcome", l;
 		});
-		function S(e) {
+		function T(e) {
 			var n = e.attrs || {}, r = n.tt || "", i = n.tx || "", a = n.i || "code", o = n.clk || "", s = {
 				code: "<svg viewBox=\"0 0 24 24\" width=\"24\" height=\"24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"16 18 22 12 16 6\"/><polyline points=\"8 6 2 12 8 18\"/></svg>",
 				chart: "<svg viewBox=\"0 0 24 24\" width=\"24\" height=\"24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"18\" y1=\"20\" x2=\"18\" y2=\"10\"/><line x1=\"12\" y1=\"20\" x2=\"12\" y2=\"4\"/><line x1=\"6\" y1=\"20\" x2=\"6\" y2=\"14\"/></svg>",
@@ -9632,7 +9872,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			}
 			return l.appendChild(d), l._tokuiType = "welcome-feature", l;
 		}
-		e.register("welcome-feature", (e) => S(e)), e.register("feature", (e) => S(e)), e.register("attachments", (e, n) => {
+		e.register("welcome-feature", (e) => T(e)), e.register("feature", (e) => T(e)), e.register("attachments", (e, n) => {
 			var r = (e.attrs || {}).clk || "", i = t("div", { class: "tokui-attachments" });
 			return r && i.setAttribute("data-tokui-clk", r), n(e.children || []).forEach(function(e) {
 				e && e.nodeType && i.appendChild(e);
@@ -9695,109 +9935,114 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				}
 				f.parentNode && f.parentNode.removeChild(f);
 			}), v.appendChild(b), f.appendChild(v), f._tokuiType = "attach", f;
-		}), e.register("artifact", (e, n) => {
-			var r = e.attrs || {}, o = r.tt || "Artifact", s = r.lang || "text";
-			r.pos, r.w;
-			var c = t("div", { class: "tokui-artifact" }), l = t("div", { class: "tokui-artifact__header" }), d = t("span", { class: "tokui-artifact__title" });
-			d.textContent = o, l.appendChild(d);
+		}), e.register("artifact", (n, r) => {
+			var o = n.attrs || {}, s = o.tt || "Artifact", c = o.lang || "text";
+			o.pos, o.w;
+			var l = t("div", { class: "tokui-artifact" }), u = t("div", { class: "tokui-artifact__header" }), d = t("span", { class: "tokui-artifact__title" });
+			d.textContent = s, u.appendChild(d);
 			var f = t("div", { class: "tokui-artifact__tabs" }), p = t("button", {
 				class: "tokui-artifact__tab tokui-artifact__tab--code tokui-artifact__tab--active",
 				type: "button"
 			});
 			p.textContent = "Code", f.appendChild(p);
-			var h = t("button", {
+			var m = t("button", {
 				class: "tokui-artifact__tab tokui-artifact__tab--preview",
 				type: "button"
 			});
-			h.textContent = "Preview", f.appendChild(h), l.appendChild(f);
-			var g = t("button", {
+			m.textContent = "Preview", f.appendChild(m), u.appendChild(f);
+			var h = t("button", {
 				class: "tokui-artifact__close",
 				type: "button",
 				"aria-label": "Close"
 			});
-			g.innerHTML = "&times;", l.appendChild(g), c.appendChild(l);
-			var _ = t("div", { class: "tokui-artifact__code" }), v = "", y = (e.children || []).filter(function(e) {
+			h.innerHTML = "&times;", u.appendChild(h), l.appendChild(u);
+			var g = t("div", { class: "tokui-artifact__code" }), _ = "", b = (n.children || []).filter(function(e) {
 				return e.type === "artifact-code";
 			});
-			y.length > 0 && (v = (y[0].children || []).map(function(e) {
+			b.length > 0 && (_ = (b[0].children || []).map(function(e) {
 				return e.content || "";
 			}).join(""));
-			var b = t("pre", { class: "tokui-code" }), x = t("code", { class: "language-" + s });
-			s !== "text" && i[s] ? x.innerHTML = m(a(v, s)) : x.innerHTML = m(u(v)), b.appendChild(x), _.appendChild(b);
-			var S = t("button", {
+			var x = t("pre", { class: "tokui-code" }), S = t("code", { class: "language-" + c });
+			c !== "text" && i[c] ? S.innerHTML = y(a(_, c)) : S.innerHTML = y(v(_)), x.appendChild(S), g.appendChild(x);
+			var C = t("button", {
 				class: "tokui-artifact__code-copy",
 				type: "button"
 			});
-			S.textContent = "Copy", S.addEventListener("click", function() {
-				var e = x.textContent || "";
-				typeof navigator < "u" && navigator.clipboard && navigator.clipboard.writeText(e), S.textContent = "Copied", S.classList.add("tokui-artifact__code-copy--done"), setTimeout(function() {
-					S.textContent = "Copy", S.classList.remove("tokui-artifact__code-copy--done");
+			C.textContent = "Copy", C.addEventListener("click", function() {
+				var e = S.textContent || "";
+				typeof navigator < "u" && navigator.clipboard && navigator.clipboard.writeText(e), C.textContent = "Copied", C.classList.add("tokui-artifact__code-copy--done"), setTimeout(function() {
+					C.textContent = "Copy", C.classList.remove("tokui-artifact__code-copy--done");
 				}, 2e3);
-			}), _.appendChild(S), c.appendChild(_);
-			var C = t("div", { class: "tokui-artifact__preview" });
-			C.style.display = "none";
-			var w = t("iframe", {
+			}), g.appendChild(C), l.appendChild(g);
+			var w = t("div", { class: "tokui-artifact__preview" });
+			w.style.display = "none";
+			var T = t("iframe", {
 				class: "tokui-artifact__iframe",
 				sandbox: "allow-scripts",
 				frameborder: "0"
-			}), T = "";
-			T = s === "html" ? v : "<pre style=\"margin:0;padding:16px;font-family:monospace;font-size:13px;white-space:pre-wrap;word-break:break-word;\">" + v.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;") + "</pre>", w.setAttribute("srcdoc", T), C.appendChild(w), c.appendChild(C);
-			var E = t("div", { class: "tokui-artifact__resize" });
-			c.appendChild(E), p.addEventListener("click", function() {
-				_.style.display = "", C.style.display = "none", p.classList.add("tokui-artifact__tab--active"), h.classList.remove("tokui-artifact__tab--active");
-			}), h.addEventListener("click", function() {
-				_.style.display = "none", C.style.display = "", h.classList.add("tokui-artifact__tab--active"), p.classList.remove("tokui-artifact__tab--active");
-			}), g.addEventListener("click", function() {
-				var e = new CustomEvent("tokui-artifact-close", {
-					bubbles: !0,
-					detail: { artifact: c }
-				});
-				c.dispatchEvent(e), c.style.display = "none";
+			}), E = "";
+			E = c === "html" ? _ : "<pre style=\"margin:0;padding:16px;font-family:monospace;font-size:13px;white-space:pre-wrap;word-break:break-word;\">" + _.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;") + "</pre>", T.setAttribute("srcdoc", E), w.appendChild(T), l.appendChild(w);
+			var D = t("div", { class: "tokui-artifact__resize" });
+			l.appendChild(D), p.addEventListener("click", function() {
+				g.style.display = "", w.style.display = "none", p.classList.add("tokui-artifact__tab--active"), m.classList.remove("tokui-artifact__tab--active");
+			}), m.addEventListener("click", function() {
+				g.style.display = "none", w.style.display = "", m.classList.add("tokui-artifact__tab--active"), p.classList.remove("tokui-artifact__tab--active");
+			});
+			var O = e.createReporter("artifact", o, l);
+			h.addEventListener("click", function() {
+				if (O("close", {}), typeof CustomEvent == "function" && typeof l.dispatchEvent == "function") {
+					var e = new CustomEvent("tokui-artifact-close", {
+						bubbles: !0,
+						detail: { artifact: l }
+					});
+					l.dispatchEvent(e);
+				}
+				l.style.display = "none";
 			});
-			var D = !1;
-			E.addEventListener("mousedown", function(e) {
-				D = !0, e.preventDefault(), document.addEventListener("mousemove", O), document.addEventListener("mouseup", k);
+			var k = !1;
+			D.addEventListener("mousedown", function(e) {
+				k = !0, e.preventDefault(), document.addEventListener("mousemove", A), document.addEventListener("mouseup", j);
 			});
-			function O(e) {
-				if (D) {
-					var t = c.getBoundingClientRect();
+			function A(e) {
+				if (k) {
+					var t = l.getBoundingClientRect();
 					if (t) {
 						var n = t.bottom - e.clientY;
-						n = Math.max(120, n), c.style.height = n + "px";
+						n = Math.max(120, n), l.style.height = n + "px";
 					}
 				}
 			}
-			function k() {
-				D = !1, document.removeEventListener("mousemove", O), document.removeEventListener("mouseup", k);
+			function j() {
+				k = !1, document.removeEventListener("mousemove", A), document.removeEventListener("mouseup", j);
 			}
-			return c._slot = x, c._tokuiType = "artifact", c._artifactCode = v, setTimeout(function() {
-				c.querySelectorAll(".tokui-artifact-preview-standalone").forEach(function(e) {
+			return l._slot = S, l._tokuiType = "artifact", l._artifactCode = _, setTimeout(function() {
+				l.querySelectorAll(".tokui-artifact-preview-standalone").forEach(function(e) {
 					e.parentNode && e.parentNode.removeChild(e);
 				});
-			}, 0), c._streamCloseHook = function() {
-				var t = (e.children || []).find(function(e) {
+			}, 0), l._streamCloseHook = function() {
+				var e = (n.children || []).find(function(e) {
 					return e.type === "artifact-code";
-				}), n;
-				if (t) n = (t.children || []).map(function(e) {
+				}), t;
+				if (e) t = (e.children || []).map(function(e) {
 					return e.content || "";
 				}).join("");
 				else {
-					n = "";
-					for (var r = c.querySelectorAll("pre"), o = 0; o < r.length; o++) if (r[o]._tokuiType === "artifact-code") {
-						var l = r[o].querySelector("code");
-						if (l) {
-							n = l.textContent || "";
+					t = "";
+					for (var r = l.querySelectorAll("pre"), o = 0; o < r.length; o++) if (r[o]._tokuiType === "artifact-code") {
+						var s = r[o].querySelector("code");
+						if (s) {
+							t = s.textContent || "";
 							break;
 						}
 					}
-					n ||= c._artifactCode || "";
+					t ||= l._artifactCode || "";
 				}
-				s !== "text" && i[s] ? x.innerHTML = m(a(n, s)) : x.innerHTML = m(u(n)), c._artifactCode = n;
-				var d = "";
-				d = s === "html" ? n : "<pre style=\"margin:0;padding:16px;font-family:monospace;font-size:13px;white-space:pre-wrap;word-break:break-word;\">" + n.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;") + "</pre>", w.setAttribute("srcdoc", d);
-				var f = c.querySelector(".tokui-artifact-preview-standalone");
-				f && f.parentNode && f.parentNode.removeChild(f);
-			}, c;
+				c !== "text" && i[c] ? S.innerHTML = y(a(t, c)) : S.innerHTML = y(v(t)), l._artifactCode = t;
+				var u = "";
+				u = c === "html" ? t : "<pre style=\"margin:0;padding:16px;font-family:monospace;font-size:13px;white-space:pre-wrap;word-break:break-word;\">" + t.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;") + "</pre>", T.setAttribute("srcdoc", u);
+				var d = l.querySelector(".tokui-artifact-preview-standalone");
+				d && d.parentNode && d.parentNode.removeChild(d);
+			}, l;
 		}), e.register("artifact-code", (e, n) => {
 			var r = "";
 			r = e.children && e.children.length > 0 ? e.children.map(function(e) {
@@ -9955,7 +10200,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				g(), y(d.value || "");
 			}, o;
 		});
-		function C(e) {
+		function E(e) {
 			var n = e.attrs || {}, r = n.tx || "", i = n.v || r, a = t("div", {
 				class: "tokui-command__item",
 				role: "option",
@@ -9999,7 +10244,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				}), a.classList.add("tokui-command__item--selected"), a.setAttribute("aria-selected", "true"));
 			}), a;
 		}
-		typeof window < "u" && window.TokUI && window.TokUI._internal && (window.TokUI._internal.buildCommandItem = C), e.register("command-group", (e, n) => {
+		typeof window < "u" && window.TokUI && window.TokUI._internal && (window.TokUI._internal.buildCommandItem = E), e.register("command-group", (e, n) => {
 			var r = (e.attrs || {}).tt || "", i = t("div", {
 				class: "tokui-command__group",
 				role: "group"
@@ -10012,7 +10257,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			return n(e.children || []).forEach(function(e) {
 				e && e.nodeType && i.appendChild(e);
 			}), i._slot = i, i._tokuiType = "command-group", i;
-		}), e.register("command-item", (e) => C(e)), e.register("canvas", (e, n) => {
+		}), e.register("command-item", (e) => E(e)), e.register("canvas", (e, n) => {
 			var r = e.attrs || {}, i = r.tt || "Canvas", a = r.pos || "right", o = parseInt(r.w) || 400, s = r.open !== void 0, c = r.closable === void 0 || r.closable === !0, l = ["tokui-canvas", "tokui-canvas--" + a];
 			s && l.push("tokui-canvas--open");
 			var u = t("div", { class: l.join(" ") });
@@ -10716,211 +10961,278 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			}), a._slot = a, a._tokuiType = "form", a;
 		});
 		var _ = "<svg viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"11\" cy=\"11\" r=\"8\"/><line x1=\"21\" y1=\"21\" x2=\"16.65\" y2=\"16.65\"/></svg>";
-		e.register("input", (e) => {
-			var n = e.attrs.v ? e.attrs.v.split(",").map(function(e) {
+		e.register("input", (n) => {
+			var r = n.attrs.v ? n.attrs.v.split(",").map(function(e) {
 				return e.trim();
-			}) : [], r = n.indexOf("inline") !== -1, o = e.attrs.search !== void 0, s = e.attrs.search === "right", c = t("div", { class: r ? "tokui-field tokui-field--inline" : "tokui-field" });
-			if (e.attrs.l) {
-				var l = { class: "tokui-label" };
-				e.attrs.id && (l.for = e.attrs.id), e.attrs.req !== void 0 && (l.class += " tokui-label--req"), c.appendChild(t("label", l, e.attrs.l));
+			}) : [], o = r.indexOf("inline") !== -1, s = n.attrs.search !== void 0, c = n.attrs.search === "right", l = t("div", { class: o ? "tokui-field tokui-field--inline" : "tokui-field" });
+			if (n.attrs.l) {
+				var u = { class: "tokui-label" };
+				n.attrs.id && (u.for = n.attrs.id), n.attrs.req !== void 0 && (u.class += " tokui-label--req"), l.appendChild(t("label", u, n.attrs.l));
 			}
-			var u = {
+			var d = {
 				class: "tokui-input",
-				type: e.attrs.t || "text"
+				type: n.attrs.t || "text"
 			};
-			e.attrs.id && (u.id = e.attrs.id), e.attrs.n ? u.name = e.attrs.n : e.attrs.id && (u.name = e.attrs.id), e.attrs.ph && (u.placeholder = e.attrs.ph), e.attrs.ml && (u.maxlength = e.attrs.ml), e.attrs.min !== void 0 && (u.min = e.attrs.min), e.attrs.max !== void 0 && (u.max = e.attrs.max), e.attrs.step !== void 0 && (u.step = e.attrs.step), e.attrs.req !== void 0 && (u.required = "required"), e.attrs.dis !== void 0 && (u.disabled = "disabled"), e.attrs.ro !== void 0 && (u.readonly = "readonly"), e.attrs.req !== void 0 && (u["aria-required"] = "true"), n.indexOf("error") !== -1 && (u["aria-invalid"] = "true"), e.attrs.pat && (u.pattern = e.attrs.pat), e.attrs.val !== void 0 && (u.value = e.attrs.val);
-			var d = t("input", u);
-			e.attrs.err && typeof d.addEventListener == "function" && (d.addEventListener("invalid", function() {
-				typeof d.setCustomValidity == "function" && d.validity && !d.validity.customError && d.setCustomValidity(e.attrs.err);
-			}), d.addEventListener("input", function() {
-				typeof d.setCustomValidity == "function" && d.setCustomValidity("");
-			})), e.attrs.w && (d.style.width = e.attrs.w);
-			var f = null;
-			if (o) {
-				f = t("div", { class: "tokui-search-input" }), s && f.classList.add("tokui-search-input--right");
-				var p = t("span", { class: "tokui-search-input__icon" });
-				p.innerHTML = _, f.appendChild(p), f.appendChild(d);
-			}
-			var h = f || d;
-			if (m(e)) {
-				var v = g(e, h);
-				n.indexOf("pill") !== -1 && v.classList.add("tokui-input-group--pill"), c.appendChild(v);
-			} else c.appendChild(h);
-			var y = null;
-			return (e.attrs.hint || e.attrs.live !== void 0) && (y = t("div", { class: "tokui-field__hint" }, e.attrs.hint || ""), n.indexOf("error") === -1 ? n.indexOf("success") !== -1 && y.classList.add("tokui-field__hint--success") : y.classList.add("tokui-field__hint--error"), c.appendChild(y)), e.attrs.live !== void 0 && a(d, y, e.attrs, "tokui-input"), c._update = function(e) {
-				e.v !== void 0 && (d.value = e.v), e.dis === !0 || e.dis === "true" ? d.disabled = !0 : (e.dis === !1 || e.dis === "false") && (d.disabled = !1), e.ph !== void 0 && (d.placeholder = e.ph), e.ro === !0 || e.ro === "true" ? d.readOnly = !0 : (e.ro === !1 || e.ro === "false") && (d.readOnly = !1), e.hint !== void 0 && y && (y.textContent = e.hint), e.status !== void 0 && i(d, y, e.status, "tokui-input");
-			}, c._variantTarget = d, c;
-		}), e.register("pwd", (e) => {
-			var n = e.attrs.v ? e.attrs.v.split(",").map(function(e) {
+			n.attrs.id && (d.id = n.attrs.id), n.attrs.n ? d.name = n.attrs.n : n.attrs.id && (d.name = n.attrs.id), n.attrs.ph && (d.placeholder = n.attrs.ph), n.attrs.ml && (d.maxlength = n.attrs.ml), n.attrs.min !== void 0 && (d.min = n.attrs.min), n.attrs.max !== void 0 && (d.max = n.attrs.max), n.attrs.step !== void 0 && (d.step = n.attrs.step), n.attrs.req !== void 0 && (d.required = "required"), n.attrs.dis !== void 0 && (d.disabled = "disabled"), n.attrs.ro !== void 0 && (d.readonly = "readonly"), n.attrs.req !== void 0 && (d["aria-required"] = "true"), r.indexOf("error") !== -1 && (d["aria-invalid"] = "true"), n.attrs.pat && (d.pattern = n.attrs.pat), n.attrs.val !== void 0 && (d.value = n.attrs.val);
+			var f = t("input", d);
+			n.attrs.err && typeof f.addEventListener == "function" && (f.addEventListener("invalid", function() {
+				typeof f.setCustomValidity == "function" && f.validity && !f.validity.customError && f.setCustomValidity(n.attrs.err);
+			}), f.addEventListener("input", function() {
+				typeof f.setCustomValidity == "function" && f.setCustomValidity("");
+			})), n.attrs.w && (f.style.width = n.attrs.w);
+			var p = null;
+			if (s) {
+				p = t("div", { class: "tokui-search-input" }), c && p.classList.add("tokui-search-input--right");
+				var h = t("span", { class: "tokui-search-input__icon" });
+				h.innerHTML = _, p.appendChild(h), p.appendChild(f);
+			}
+			var v = p || f;
+			if (m(n)) {
+				var y = g(n, v);
+				r.indexOf("pill") !== -1 && y.classList.add("tokui-input-group--pill"), l.appendChild(y);
+			} else l.appendChild(v);
+			var b = null;
+			(n.attrs.hint || n.attrs.live !== void 0) && (b = t("div", { class: "tokui-field__hint" }, n.attrs.hint || ""), r.indexOf("error") === -1 ? r.indexOf("success") !== -1 && b.classList.add("tokui-field__hint--success") : b.classList.add("tokui-field__hint--error"), l.appendChild(b)), n.attrs.live !== void 0 && a(f, b, n.attrs, "tokui-input"), l._update = function(e) {
+				e.v !== void 0 && (f.value = e.v), e.dis === !0 || e.dis === "true" ? f.disabled = !0 : (e.dis === !1 || e.dis === "false") && (f.disabled = !1), e.ph !== void 0 && (f.placeholder = e.ph), e.ro === !0 || e.ro === "true" ? f.readOnly = !0 : (e.ro === !1 || e.ro === "false") && (f.readOnly = !1), e.hint !== void 0 && b && (b.textContent = e.hint), e.status !== void 0 && i(f, b, e.status, "tokui-input");
+			};
+			var x = e.createReporter("input", n.attrs, l), S = e.debounce(function() {
+				x("change", {
+					value: f.value,
+					name: n.attrs.n || void 0
+				});
+			}, parseInt(n.attrs.db) || 300);
+			return f.addEventListener("input", S), l._variantTarget = f, l;
+		}), e.register("pwd", (n) => {
+			var r = n.attrs.v ? n.attrs.v.split(",").map(function(e) {
 				return e.trim();
-			}) : [], r = t("div", { class: n.indexOf("inline") === -1 ? "tokui-field" : "tokui-field tokui-field--inline" });
-			if (e.attrs.l) {
-				var o = { class: "tokui-label" };
-				e.attrs.id && (o.for = e.attrs.id), e.attrs.req !== void 0 && (o.class += " tokui-label--req"), r.appendChild(t("label", o, e.attrs.l));
+			}) : [], o = t("div", { class: r.indexOf("inline") === -1 ? "tokui-field" : "tokui-field tokui-field--inline" });
+			if (n.attrs.l) {
+				var s = { class: "tokui-label" };
+				n.attrs.id && (s.for = n.attrs.id), n.attrs.req !== void 0 && (s.class += " tokui-label--req"), o.appendChild(t("label", s, n.attrs.l));
 			}
-			var s = {
+			var c = {
 				class: "tokui-input",
 				type: "password"
 			};
-			e.attrs.id && (s.id = e.attrs.id), e.attrs.n ? s.name = e.attrs.n : e.attrs.id && (s.name = e.attrs.id), e.attrs.ph && (s.placeholder = e.attrs.ph), e.attrs.ml && (s.maxlength = e.attrs.ml), e.attrs.min !== void 0 && (s.min = e.attrs.min), e.attrs.max !== void 0 && (s.max = e.attrs.max), e.attrs.req !== void 0 && (s.required = "required"), e.attrs.dis !== void 0 && (s.disabled = "disabled"), e.attrs.ro !== void 0 && (s.readonly = "readonly"), e.attrs.req !== void 0 && (s["aria-required"] = "true"), n.indexOf("error") !== -1 && (s["aria-invalid"] = "true"), e.attrs.val !== void 0 && (s.value = e.attrs.val);
-			var c = t("input", s);
-			e.attrs.w && (c.style.width = e.attrs.w);
-			var l = null;
-			if (e.attrs.toggle !== void 0 && !e.attrs.dis) {
-				l = t("button", {
+			n.attrs.id && (c.id = n.attrs.id), n.attrs.n ? c.name = n.attrs.n : n.attrs.id && (c.name = n.attrs.id), n.attrs.ph && (c.placeholder = n.attrs.ph), n.attrs.ml && (c.maxlength = n.attrs.ml), n.attrs.min !== void 0 && (c.min = n.attrs.min), n.attrs.max !== void 0 && (c.max = n.attrs.max), n.attrs.req !== void 0 && (c.required = "required"), n.attrs.dis !== void 0 && (c.disabled = "disabled"), n.attrs.ro !== void 0 && (c.readonly = "readonly"), n.attrs.req !== void 0 && (c["aria-required"] = "true"), r.indexOf("error") !== -1 && (c["aria-invalid"] = "true"), n.attrs.val !== void 0 && (c.value = n.attrs.val);
+			var l = t("input", c);
+			n.attrs.w && (l.style.width = n.attrs.w);
+			var u = null;
+			if (n.attrs.toggle !== void 0 && !n.attrs.dis) {
+				u = t("button", {
 					class: "tokui-pwd-toggle",
 					type: "button",
 					tabindex: "-1"
-				}), l.setAttribute("aria-label", "Toggle password visibility");
-				var u = "<svg viewBox=\"0 0 24 24\" width=\"18\" height=\"18\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z\"/><circle cx=\"12\" cy=\"12\" r=\"3\"/></svg>", d = "<svg viewBox=\"0 0 24 24\" width=\"18\" height=\"18\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94\"/><path d=\"M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19\"/><line x1=\"1\" y1=\"1\" x2=\"23\" y2=\"23\"/><path d=\"M14.12 14.12a3 3 0 1 1-4.24-4.24\"/></svg>";
-				l.innerHTML = d, l.addEventListener("click", function() {
-					var e = c.type === "password";
-					c.type = e ? "text" : "password", l.innerHTML = e ? u : d, l.classList.toggle("tokui-pwd-toggle--active", e);
+				}), u.setAttribute("aria-label", "Toggle password visibility");
+				var d = "<svg viewBox=\"0 0 24 24\" width=\"18\" height=\"18\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z\"/><circle cx=\"12\" cy=\"12\" r=\"3\"/></svg>", f = "<svg viewBox=\"0 0 24 24\" width=\"18\" height=\"18\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94\"/><path d=\"M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19\"/><line x1=\"1\" y1=\"1\" x2=\"23\" y2=\"23\"/><path d=\"M14.12 14.12a3 3 0 1 1-4.24-4.24\"/></svg>";
+				u.innerHTML = f, u.addEventListener("click", function() {
+					var e = l.type === "password";
+					l.type = e ? "text" : "password", u.innerHTML = e ? d : f, u.classList.toggle("tokui-pwd-toggle--active", e);
 				});
 			}
-			if (m(e) || l) {
-				var f = g(e, c);
-				if (l) {
-					var p = c.nextSibling;
-					p ? f.insertBefore(l, p) : f.appendChild(l);
-				}
-				r.appendChild(f);
-			} else r.appendChild(c);
-			var h = null;
-			return (e.attrs.hint || e.attrs.live !== void 0) && (h = t("div", { class: "tokui-field__hint" }, e.attrs.hint || ""), n.indexOf("error") === -1 ? n.indexOf("success") !== -1 && h.classList.add("tokui-field__hint--success") : h.classList.add("tokui-field__hint--error"), r.appendChild(h)), e.attrs.live !== void 0 && a(c, h, e.attrs, "tokui-input"), r._update = function(e) {
-				e.v !== void 0 && (c.value = e.v), e.dis === !0 || e.dis === "true" ? c.disabled = !0 : (e.dis === !1 || e.dis === "false") && (c.disabled = !1), e.ph !== void 0 && (c.placeholder = e.ph), e.ro === !0 || e.ro === "true" ? c.readOnly = !0 : (e.ro === !1 || e.ro === "false") && (c.readOnly = !1), e.hint !== void 0 && h && (h.textContent = e.hint), e.status !== void 0 && i(c, h, e.status, "tokui-input");
-			}, r._variantTarget = c, r;
-		}), e.register("textarea", (e, n) => {
-			let r = t("div", { class: "tokui-field" });
-			if (e.attrs.l) {
-				let n = { class: "tokui-label" };
-				e.attrs.id && (n.for = e.attrs.id), e.attrs.req !== void 0 && (n.class += " tokui-label--req"), r.appendChild(t("label", n, e.attrs.l));
-			}
-			let i = e.attrs.maxlen ? parseInt(e.attrs.maxlen, 10) : 0, a = e.attrs.auto !== void 0, o = parseInt(e.attrs.rows, 10) || 4, s = e.attrs.maxrows ? parseInt(e.attrs.maxrows, 10) : 0, c = i > 0 || a ? t("div", { class: "tokui-textarea-box" }) : null;
-			c && r.appendChild(c);
-			let l = {
+			if (m(n) || u) {
+				var p = g(n, l);
+				if (u) {
+					var h = l.nextSibling;
+					h ? p.insertBefore(u, h) : p.appendChild(u);
+				}
+				o.appendChild(p);
+			} else o.appendChild(l);
+			var _ = null;
+			(n.attrs.hint || n.attrs.live !== void 0) && (_ = t("div", { class: "tokui-field__hint" }, n.attrs.hint || ""), r.indexOf("error") === -1 ? r.indexOf("success") !== -1 && _.classList.add("tokui-field__hint--success") : _.classList.add("tokui-field__hint--error"), o.appendChild(_)), n.attrs.live !== void 0 && a(l, _, n.attrs, "tokui-input"), o._update = function(e) {
+				e.v !== void 0 && (l.value = e.v), e.dis === !0 || e.dis === "true" ? l.disabled = !0 : (e.dis === !1 || e.dis === "false") && (l.disabled = !1), e.ph !== void 0 && (l.placeholder = e.ph), e.ro === !0 || e.ro === "true" ? l.readOnly = !0 : (e.ro === !1 || e.ro === "false") && (l.readOnly = !1), e.hint !== void 0 && _ && (_.textContent = e.hint), e.status !== void 0 && i(l, _, e.status, "tokui-input");
+			};
+			var v = e.createReporter("pwd", n.attrs, o), y = e.debounce(function() {
+				v("change", {
+					value: l.value,
+					name: n.attrs.n || void 0
+				});
+			}, parseInt(n.attrs.db) || 300);
+			return l.addEventListener("input", y), o._variantTarget = l, o;
+		}), e.register("textarea", (n, r) => {
+			let i = t("div", { class: "tokui-field" });
+			if (n.attrs.l) {
+				let e = { class: "tokui-label" };
+				n.attrs.id && (e.for = n.attrs.id), n.attrs.req !== void 0 && (e.class += " tokui-label--req"), i.appendChild(t("label", e, n.attrs.l));
+			}
+			let a = n.attrs.maxlen ? parseInt(n.attrs.maxlen, 10) : 0, o = n.attrs.auto !== void 0, s = parseInt(n.attrs.rows, 10) || 4, c = n.attrs.maxrows ? parseInt(n.attrs.maxrows, 10) : 0, l = a > 0 || o ? t("div", { class: "tokui-textarea-box" }) : null;
+			l && i.appendChild(l);
+			let u = {
 				class: "tokui-input",
-				rows: String(o)
+				rows: String(s)
 			};
-			e.attrs.id && (l.id = e.attrs.id), e.attrs.n ? l.name = e.attrs.n : e.attrs.id && (l.name = e.attrs.id), e.attrs.ph && (l.placeholder = e.attrs.ph), e.attrs.req !== void 0 && (l.required = "required"), e.attrs.dis !== void 0 && (l.disabled = "disabled"), e.attrs.ro !== void 0 && (l.readonly = "readonly"), e.attrs.req !== void 0 && (l["aria-required"] = "true"), /(^|,)\s*error\s*(,|$)/.test(e.attrs.v || "") && (l["aria-invalid"] = "true"), i > 0 && (l.maxlength = String(i));
-			let u = t("textarea", l), d = e.children && e.children.length > 0 ? e.children.map((e) => e.content || "").join("") : e.content || e.attrs.tx || "";
-			if (u.textContent = d, a) {
-				u.classList.add("tokui-textarea--auto");
-				var f = 0, p = 0;
+			n.attrs.id && (u.id = n.attrs.id), n.attrs.n ? u.name = n.attrs.n : n.attrs.id && (u.name = n.attrs.id), n.attrs.ph && (u.placeholder = n.attrs.ph), n.attrs.req !== void 0 && (u.required = "required"), n.attrs.dis !== void 0 && (u.disabled = "disabled"), n.attrs.ro !== void 0 && (u.readonly = "readonly"), n.attrs.req !== void 0 && (u["aria-required"] = "true"), /(^|,)\s*error\s*(,|$)/.test(n.attrs.v || "") && (u["aria-invalid"] = "true"), a > 0 && (u.maxlength = String(a));
+			let d = t("textarea", u), f = n.children && n.children.length > 0 ? n.children.map((e) => e.content || "").join("") : n.content || n.attrs.tx || "";
+			if (d.textContent = f, o) {
+				d.classList.add("tokui-textarea--auto");
+				var p = 0, m = 0;
 				function e() {
-					if (!f) {
-						var e = u.getAttribute("rows");
-						u.setAttribute("rows", "1");
-						var t = u.scrollHeight;
-						f = t * o, p = s > 0 ? t * s : 0, u.setAttribute("rows", e), u.style.height = "auto";
-						var n = u.scrollHeight;
-						f = Math.max(f, n), u.style.height = f + "px";
+					if (!p) {
+						var e = d.getAttribute("rows");
+						d.setAttribute("rows", "1");
+						var t = d.scrollHeight;
+						p = t * s, m = c > 0 ? t * c : 0, d.setAttribute("rows", e), d.style.height = "auto";
+						var n = d.scrollHeight;
+						p = Math.max(p, n), d.style.height = p + "px";
 					}
-					u.style.height = "auto";
-					var r = u.scrollHeight;
-					r = Math.max(r, f), p > 0 && (r = Math.min(r, p)), u.style.height = r + "px", u.style.overflow = p > 0 && u.scrollHeight > p ? "auto" : "hidden";
+					d.style.height = "auto";
+					var r = d.scrollHeight;
+					r = Math.max(r, p), m > 0 && (r = Math.min(r, m)), d.style.height = r + "px", d.style.overflow = m > 0 && d.scrollHeight > m ? "auto" : "hidden";
 				}
-				u.addEventListener && u.addEventListener("input", e), setTimeout(e, 0);
+				d.addEventListener && d.addEventListener("input", e), setTimeout(e, 0);
 			}
-			if (c) {
-				if (c.appendChild(u), i > 0) {
+			if (l) {
+				if (l.appendChild(d), a > 0) {
 					let e = t("span", { class: "tokui-textarea-counter" });
-					e.textContent = d.length + "/" + i, d.length > i && e.classList.add("tokui-textarea-counter--over"), c.appendChild(e), u.addEventListener("input", function() {
-						var t = u.value.length;
-						e.textContent = t + "/" + i, t > i ? e.classList.add("tokui-textarea-counter--over") : e.classList.remove("tokui-textarea-counter--over");
+					e.textContent = f.length + "/" + a, f.length > a && e.classList.add("tokui-textarea-counter--over"), l.appendChild(e), d.addEventListener("input", function() {
+						var t = d.value.length;
+						e.textContent = t + "/" + a, t > a ? e.classList.add("tokui-textarea-counter--over") : e.classList.remove("tokui-textarea-counter--over");
 					});
 				}
-			} else r.appendChild(u);
-			return r._update = function(e) {
-				e.v !== void 0 && (u.value = e.v), e.dis === !0 || e.dis === "true" ? u.disabled = !0 : (e.dis === !1 || e.dis === "false") && (u.disabled = !1), e.ro === !0 || e.ro === "true" ? u.readOnly = !0 : (e.ro === !1 || e.ro === "false") && (u.readOnly = !1);
-			}, r._variantTarget = u, r._slot = u, r._tokuiType = "textarea", r;
-		}), e.register("picker", (e, n) => {
-			let r = e.attrs.multi !== void 0, i = e.attrs.dis !== void 0, a = e.attrs.n || e.attrs.id || "picker", o = e.attrs.ph || "", s = t("div", { class: (e.attrs.v ? e.attrs.v.split(",").map((e) => e.trim()) : []).indexOf("inline") === -1 ? "tokui-field" : "tokui-field tokui-field--inline" });
-			if (e.attrs.l) {
-				let n = { class: "tokui-label" };
-				e.attrs.id && (n.for = e.attrs.id), s.appendChild(t("label", n, e.attrs.l));
-			}
-			let c = ["tokui-picker"];
-			r && c.push("tokui-picker--multi"), i && c.push("tokui-picker--disabled");
-			let l = t("div", {
-				class: c.join(" "),
-				"data-tokui-picker": e.attrs.id || "",
+			} else i.appendChild(d);
+			i._update = function(e) {
+				e.v !== void 0 && (d.value = e.v), e.dis === !0 || e.dis === "true" ? d.disabled = !0 : (e.dis === !1 || e.dis === "false") && (d.disabled = !1), e.ro === !0 || e.ro === "true" ? d.readOnly = !0 : (e.ro === !1 || e.ro === "false") && (d.readOnly = !1);
+			};
+			var h = e.createReporter("textarea", n.attrs, i), g = e.debounce(function() {
+				h("change", {
+					value: d.value,
+					name: n.attrs.n || void 0
+				});
+			}, parseInt(n.attrs.db) || 300);
+			return d.addEventListener("input", g), i._variantTarget = d, i._slot = d, i._tokuiType = "textarea", i;
+		}), e.register("picker", (n, r) => {
+			let i = n.attrs.multi !== void 0, a = n.attrs.dis !== void 0, o = n.attrs.n || n.attrs.id || "picker", s = n.attrs.ph || "", c = t("div", { class: (n.attrs.v ? n.attrs.v.split(",").map((e) => e.trim()) : []).indexOf("inline") === -1 ? "tokui-field" : "tokui-field tokui-field--inline" });
+			if (n.attrs.l) {
+				let e = { class: "tokui-label" };
+				n.attrs.id && (e.for = n.attrs.id), c.appendChild(t("label", e, n.attrs.l));
+			}
+			let l = ["tokui-picker"];
+			i && l.push("tokui-picker--multi"), a && l.push("tokui-picker--disabled");
+			let u = t("div", {
+				class: l.join(" "),
+				"data-tokui-picker": n.attrs.id || "",
 				role: "listbox",
 				"aria-expanded": "false"
 			});
-			var u = "", f = "";
-			r || e.children.forEach((e) => {
-				e.attrs && e.attrs.chk !== void 0 && (u = e.attrs.v || "", f = e.attrs && e.attrs.tx || u);
+			var f = "", p = "";
+			i || n.children.forEach((e) => {
+				e.attrs && e.attrs.chk !== void 0 && (f = e.attrs.v || "", p = e.attrs && e.attrs.tx || f);
 			});
-			let p = t("div", { class: "tokui-picker-control" });
-			r && e.children.forEach((e) => {
-				e.attrs && e.attrs.chk !== void 0 && p.appendChild(b(e, l, a));
+			let m = t("div", { class: "tokui-picker-control" });
+			i && n.children.forEach((e) => {
+				e.attrs && e.attrs.chk !== void 0 && m.appendChild(b(e, u, o));
 			});
-			let m = {
+			let h = {
 				class: "tokui-picker-search",
 				type: "text",
 				autocomplete: "off"
 			};
-			o && !f && (m.placeholder = o), i && (m.disabled = "disabled"), f && (m.value = f), p.appendChild(t("input", m)), p.appendChild(t("span", { class: "tokui-picker-arrow" })), l.appendChild(p);
-			let h = t("ul", { class: "tokui-picker-dropdown" });
-			e.children.forEach((e) => {
-				h.appendChild(y(e));
-			});
-			var g = t("li", { class: "tokui-picker-empty" }, d("picker.noMatch"));
-			return g.style.display = "none", h.appendChild(g), l.appendChild(h), r ? e.children.forEach((e) => {
-				e.attrs && e.attrs.chk !== void 0 && l.appendChild(t("input", {
+			s && !p && (h.placeholder = s), a && (h.disabled = "disabled"), p && (h.value = p), m.appendChild(t("input", h)), m.appendChild(t("span", { class: "tokui-picker-arrow" })), u.appendChild(m);
+			let g = t("ul", { class: "tokui-picker-dropdown" });
+			n.children.forEach((e) => {
+				g.appendChild(y(e));
+			});
+			var _ = t("li", { class: "tokui-picker-empty" }, d("picker.noMatch"));
+			_.style.display = "none", g.appendChild(_), u.appendChild(g), i ? n.children.forEach((e) => {
+				e.attrs && e.attrs.chk !== void 0 && u.appendChild(t("input", {
 					type: "hidden",
-					name: a,
+					name: o,
 					value: e.attrs.v || ""
 				}));
-			}) : l.appendChild(t("input", {
+			}) : u.appendChild(t("input", {
 				type: "hidden",
-				name: a,
-				value: u
-			})), s.appendChild(l), s._variantTarget = l, s._slot = h, s._tokuiType = "picker", s._streamCloseHook = function() {
-				var e = h.querySelectorAll(".tokui-picker-option--selected");
-				if (!r && e.length > 0) {
-					var n = e[0], o = l.querySelector(".tokui-picker-search"), s = l.querySelector("input[type=hidden]");
-					o && !o.value && (o.value = n.getAttribute("data-text")), s && !s.value && (s.value = n.getAttribute("data-value"));
-				}
-				r && e.length > 0 && e.forEach(function(e) {
+				name: o,
+				value: f
+			})), c.appendChild(u), c._variantTarget = u, c._slot = g, c._tokuiType = "picker";
+			var v = e.createReporter("picker", n.attrs, c);
+			function S(e) {
+				v("change", {
+					value: e,
+					name: n.attrs.n || void 0
+				});
+			}
+			return c._streamCloseHook = function() {
+				var e = g.querySelectorAll(".tokui-picker-option--selected");
+				if (!i && e.length > 0) {
+					var n = e[0], r = u.querySelector(".tokui-picker-search"), s = u.querySelector("input[type=hidden]");
+					r && !r.value && (r.value = n.getAttribute("data-text")), s && !s.value && (s.value = n.getAttribute("data-value"));
+				}
+				i && e.length > 0 && e.forEach(function(e) {
 					var n = e.getAttribute("data-text"), r = e.getAttribute("data-value"), i = t("span", {
 						class: "tokui-picker-tag",
 						"data-value": r
-					}, n + " "), o = t("span", { class: "tokui-picker-tag-close" }, "×");
-					i.appendChild(o), p.insertBefore(i, p.querySelector(".tokui-picker-search")), l.appendChild(t("input", {
+					}, n + " "), a = t("span", { class: "tokui-picker-tag-close" }, "×");
+					i.appendChild(a), m.insertBefore(i, m.querySelector(".tokui-picker-search")), u.appendChild(t("input", {
 						type: "hidden",
-						name: a,
+						name: o,
 						value: r
 					}));
-				}), !i && typeof document < "u" && x(l, {
-					multi: r,
-					name: a
+				}), !a && typeof document < "u" && x(u, {
+					multi: i,
+					name: o,
+					onChange: S
 				});
-			}, s.setAttribute("data-tokui-resettable", ""), s._tokuiReset = function() {
-				var e = l.querySelector(".tokui-picker-search"), n = l.querySelector("input[type=hidden]"), i = h.querySelectorAll(".tokui-picker-option");
-				r ? (p.querySelectorAll(".tokui-picker-tag").forEach(function(e) {
-					p.removeChild(e);
-				}), l.querySelectorAll("input[type=hidden][name=\"" + a + "\"]").forEach(function(e) {
-					l.removeChild(e);
-				}), i.forEach(function(n) {
+			}, c.setAttribute("data-tokui-resettable", ""), c._tokuiReset = function() {
+				var e = u.querySelector(".tokui-picker-search"), n = u.querySelector("input[type=hidden]"), r = g.querySelectorAll(".tokui-picker-option");
+				i ? (m.querySelectorAll(".tokui-picker-tag").forEach(function(e) {
+					m.removeChild(e);
+				}), u.querySelectorAll("input[type=hidden][name=\"" + o + "\"]").forEach(function(e) {
+					u.removeChild(e);
+				}), r.forEach(function(n) {
 					var r = n.getAttribute("data-selected-initial") === "1";
 					if (n.classList.toggle("tokui-picker-option--selected", r), r) {
-						var i = n.getAttribute("data-text"), o = n.getAttribute("data-value"), s = t("span", {
+						var i = n.getAttribute("data-text"), a = n.getAttribute("data-value"), s = t("span", {
 							class: "tokui-picker-tag",
-							"data-value": o
+							"data-value": a
 						}, i + " ");
-						s.appendChild(t("span", { class: "tokui-picker-tag-close" }, "×")), p.insertBefore(s, e), l.appendChild(t("input", {
+						s.appendChild(t("span", { class: "tokui-picker-tag-close" }, "×")), m.insertBefore(s, e), u.appendChild(t("input", {
 							type: "hidden",
-							name: a,
-							value: o
+							name: o,
+							value: a
 						}));
 					}
-				})) : (e && (e.value = f), n && (n.value = u), i.forEach(function(e) {
-					var t = !!u && e.getAttribute("data-value") === u;
+				})) : (e && (e.value = p), n && (n.value = f), r.forEach(function(e) {
+					var t = !!f && e.getAttribute("data-value") === f;
 					e.classList.toggle("tokui-picker-option--selected", t);
 				}));
-			}, s;
+			}, c._update = function(e) {
+				if (e.v !== void 0) {
+					var n = String(e.v).split(",").map(function(e) {
+						return e.trim();
+					}).filter(Boolean), r = g.querySelectorAll(".tokui-picker-option"), a = u.querySelector(".tokui-picker-search");
+					if (i) m.querySelectorAll(".tokui-picker-tag").forEach(function(e) {
+						m.removeChild(e);
+					}), u.querySelectorAll("input[type=hidden][name=\"" + o + "\"]").forEach(function(e) {
+						u.removeChild(e);
+					}), r.forEach(function(e) {
+						e.classList.remove("tokui-picker-option--selected");
+					}), n.forEach(function(e) {
+						var n = g.querySelector(".tokui-picker-option[data-value=\"" + e + "\"]");
+						if (n) {
+							n.classList.add("tokui-picker-option--selected");
+							var r = n.getAttribute("data-text"), i = t("span", {
+								class: "tokui-picker-tag",
+								"data-value": e
+							}, r + " ");
+							i.appendChild(t("span", { class: "tokui-picker-tag-close" }, "×")), m.insertBefore(i, a), u.appendChild(t("input", {
+								type: "hidden",
+								name: o,
+								value: e
+							}));
+						}
+					});
+					else {
+						var s = n[0] || "";
+						r.forEach(function(e) {
+							s && e.getAttribute("data-value") === s ? e.classList.add("tokui-picker-option--selected") : e.classList.remove("tokui-picker-option--selected");
+						});
+						var c = s ? g.querySelector(".tokui-picker-option[data-value=\"" + s + "\"]") : null;
+						a && (a.value = c ? c.getAttribute("data-text") : "");
+						var l = u.querySelector("input[type=hidden]");
+						l && (l.value = s);
+					}
+				}
+			}, c;
 		});
 		function y(e) {
 			let n = e.attrs && e.attrs.v || "", r = e.attrs && e.attrs.tx || n || e.content || "", i = e.attrs && e.attrs.chk !== void 0, a = t("li", {
@@ -10941,148 +11253,195 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			return a.appendChild(o), a;
 		}
 		function x(e, n) {
-			var r = n.multi, i = n.name, a = e.querySelector(".tokui-picker-control"), o = e.querySelector(".tokui-picker-search"), s = e.querySelector(".tokui-picker-dropdown"), c = e.querySelector(".tokui-picker-empty"), l = !1, u = -1;
-			function d() {
-				return Array.from(s.querySelectorAll(".tokui-picker-option")).filter(function(e) {
-					return e.style.display !== "none";
-				});
-			}
+			var r = n.multi, i = n.name, a = typeof n.onChange == "function" ? n.onChange : null, o = e.querySelector(".tokui-picker-control"), s = e.querySelector(".tokui-picker-search"), c = e.querySelector(".tokui-picker-dropdown"), l = e.querySelector(".tokui-picker-empty"), u = !1, d = -1;
 			function f() {
-				if (!l) {
-					l = !0, e.classList.add("tokui-picker--open");
-					var t = a.getBoundingClientRect();
-					s.style.left = t.left + "px", s.style.top = t.bottom + 4 + "px", s.style.width = t.width + "px", o.focus(), u = -1;
+				if (a) if (r) {
+					var t = [];
+					e.querySelectorAll("input[type=hidden]").forEach(function(e) {
+						t.push(e.value);
+					}), a(t);
+				} else {
+					var n = e.querySelector("input[type=hidden]");
+					a(n ? n.value : "");
 				}
 			}
 			function p() {
-				l && (l = !1, e.classList.remove("tokui-picker--open"), r && (o.value = ""), _(""), h());
+				return Array.from(c.querySelectorAll(".tokui-picker-option")).filter(function(e) {
+					return e.style.display !== "none";
+				});
 			}
 			function m() {
-				l ? p() : f();
+				if (!u) {
+					u = !0, e.classList.add("tokui-picker--open");
+					var t = o.getBoundingClientRect();
+					c.style.left = t.left + "px", c.style.top = t.bottom + 4 + "px", c.style.width = t.width + "px", s.focus(), d = -1;
+				}
 			}
 			function h() {
-				d().forEach(function(e) {
+				u && (u = !1, e.classList.remove("tokui-picker--open"), r && (s.value = ""), y(""), _());
+			}
+			function g() {
+				u ? h() : m();
+			}
+			function _() {
+				p().forEach(function(e) {
 					e.classList.remove("tokui-picker-option--active");
-				}), u = -1;
+				}), d = -1;
 			}
-			function g(e) {
-				var t = d();
-				h(), !(e < 0 || e >= t.length) && (u = e, t[e].classList.add("tokui-picker-option--active"), t[e].scrollIntoView({ block: "nearest" }));
+			function v(e) {
+				var t = p();
+				_(), !(e < 0 || e >= t.length) && (d = e, t[e].classList.add("tokui-picker-option--active"), t[e].scrollIntoView({ block: "nearest" }));
 			}
-			function _(e) {
-				var t = e.toLowerCase(), n = s.querySelectorAll(".tokui-picker-option"), r = 0;
+			function y(e) {
+				var t = e.toLowerCase(), n = c.querySelectorAll(".tokui-picker-option"), r = 0;
 				n.forEach(function(e) {
 					var n = !t || e.getAttribute("data-text").toLowerCase().indexOf(t) !== -1;
 					e.style.display = n ? "" : "none", n && r++;
-				}), c.style.display = r === 0 ? "" : "none", h();
+				}), l.style.display = r === 0 ? "" : "none", _();
 			}
-			function v(e) {
+			function b(e) {
 				var t = e.getAttribute("data-value"), n = e.getAttribute("data-text");
-				r ? b(e, t, n) : y(e, t, n);
+				r ? S(e, t, n) : x(e, t, n);
 			}
-			function y(t, n, r) {
-				s.querySelectorAll(".tokui-picker-option--selected").forEach(function(e) {
+			function x(t, n, r) {
+				c.querySelectorAll(".tokui-picker-option--selected").forEach(function(e) {
 					e.classList.remove("tokui-picker-option--selected");
-				}), t.classList.add("tokui-picker-option--selected"), o.value = r;
+				}), t.classList.add("tokui-picker-option--selected"), s.value = r;
 				var i = e.querySelector("input[type=hidden]");
-				i && (i.value = n), p();
+				i && (i.value = n), h(), f();
 			}
-			function b(e, t, n) {
-				e.classList.toggle("tokui-picker-option--selected") ? (x(t, n), C(t)) : (S(t), w(t)), o.value = "", o.focus();
+			function S(e, t, n) {
+				e.classList.toggle("tokui-picker-option--selected") ? (C(t, n), T(t)) : (w(t), E(t)), s.value = "", s.focus(), f();
 			}
-			function x(e, n) {
+			function C(e, n) {
 				var r = t("span", {
 					class: "tokui-picker-tag",
 					"data-value": e
 				}, n + " "), i = t("span", { class: "tokui-picker-tag-close" }, "×");
 				i.addEventListener("click", function(t) {
 					t.stopPropagation();
-					var n = s.querySelector(".tokui-picker-option[data-value=\"" + e + "\"]");
-					n && n.classList.remove("tokui-picker-option--selected"), S(e), w(e);
-				}), r.appendChild(i), a.insertBefore(r, o);
+					var n = c.querySelector(".tokui-picker-option[data-value=\"" + e + "\"]");
+					n && n.classList.remove("tokui-picker-option--selected"), w(e), E(e), f();
+				}), r.appendChild(i), o.insertBefore(r, s);
 			}
-			function S(e) {
-				var t = a.querySelector(".tokui-picker-tag[data-value=\"" + e + "\"]");
-				t && a.removeChild(t);
+			function w(e) {
+				var t = o.querySelector(".tokui-picker-tag[data-value=\"" + e + "\"]");
+				t && o.removeChild(t);
 			}
-			function C(n) {
+			function T(n) {
 				e.appendChild(t("input", {
 					type: "hidden",
 					name: i,
 					value: n
 				}));
 			}
-			function w(t) {
+			function E(t) {
 				e.querySelectorAll("input[type=hidden][name=\"" + i + "\"]").forEach(function(n) {
 					n.value === t && e.removeChild(n);
 				});
 			}
-			a.addEventListener("click", function(e) {
-				e.target.classList.contains("tokui-picker-tag-close") || m();
-			}), o.addEventListener("input", function() {
-				l || f(), _(o.value);
-			}), o.addEventListener("keydown", function(e) {
-				var t = d();
-				if (e.key === "ArrowDown") e.preventDefault(), l || f(), g(u < t.length - 1 ? u + 1 : 0);
-				else if (e.key === "ArrowUp") e.preventDefault(), l || f(), g(u > 0 ? u - 1 : t.length - 1);
-				else if (e.key === "Enter") e.preventDefault(), u >= 0 && u < t.length && v(t[u]);
-				else if (e.key === "Escape") p();
-				else if (e.key === "Backspace" && r && o.value === "") {
-					var n = a.querySelectorAll(".tokui-picker-tag");
+			o.addEventListener("click", function(e) {
+				e.target.classList.contains("tokui-picker-tag-close") || g();
+			}), s.addEventListener("input", function() {
+				u || m(), y(s.value);
+			}), s.addEventListener("keydown", function(e) {
+				var t = p();
+				if (e.key === "ArrowDown") e.preventDefault(), u || m(), v(d < t.length - 1 ? d + 1 : 0);
+				else if (e.key === "ArrowUp") e.preventDefault(), u || m(), v(d > 0 ? d - 1 : t.length - 1);
+				else if (e.key === "Enter") e.preventDefault(), d >= 0 && d < t.length && b(t[d]);
+				else if (e.key === "Escape") h();
+				else if (e.key === "Backspace" && r && s.value === "") {
+					var n = o.querySelectorAll(".tokui-picker-tag");
 					if (n.length > 0) {
-						var i = n[n.length - 1].getAttribute("data-value"), c = s.querySelector(".tokui-picker-option[data-value=\"" + i + "\"]");
-						c && c.classList.remove("tokui-picker-option--selected"), S(i), w(i);
+						var i = n[n.length - 1].getAttribute("data-value"), a = c.querySelector(".tokui-picker-option[data-value=\"" + i + "\"]");
+						a && a.classList.remove("tokui-picker-option--selected"), w(i), E(i), f();
 					}
 				}
-			}), s.addEventListener("click", function(e) {
+			}), c.addEventListener("click", function(e) {
 				var t = e.target.closest(".tokui-picker-option");
-				t && v(t);
+				t && b(t);
 			}), document.addEventListener("click", function(t) {
-				e.contains(t.target) || p();
-			}), a.querySelectorAll(".tokui-picker-tag-close").forEach(function(e) {
+				e.contains(t.target) || h();
+			}), o.querySelectorAll(".tokui-picker-tag-close").forEach(function(e) {
 				e.addEventListener("click", function(t) {
 					t.stopPropagation();
-					var n = e.parentElement.getAttribute("data-value"), r = s.querySelector(".tokui-picker-option[data-value=\"" + n + "\"]");
-					r && r.classList.remove("tokui-picker-option--selected"), S(n), w(n);
+					var n = e.parentElement.getAttribute("data-value"), r = c.querySelector(".tokui-picker-option[data-value=\"" + n + "\"]");
+					r && r.classList.remove("tokui-picker-option--selected"), w(n), E(n), f();
 				});
 			});
 		}
-		e.register("select", (e, n) => {
-			e = o(e);
-			let r = e.attrs.multi !== void 0, i = e.attrs.v ? e.attrs.v.split(",").map((e) => e.trim()) : [], a = t("div", { class: i.indexOf("inline") === -1 ? "tokui-field" : "tokui-field tokui-field--inline" });
-			if (e.attrs.l) {
-				let n = { class: "tokui-label" };
-				e.attrs.id && !r && (n.for = e.attrs.id), e.attrs.req !== void 0 && (n.class += " tokui-label--req"), a.appendChild(t("label", n, e.attrs.l));
-			}
-			let s = { class: "tokui-select" };
-			r && (s.multiple = !0), e.attrs.id && (s.id = e.attrs.id), e.attrs.n ? s.name = e.attrs.n : e.attrs.id && (s.name = e.attrs.id), e.attrs.req !== void 0 && (s["aria-required"] = "true"), i.indexOf("error") !== -1 && (s["aria-invalid"] = "true");
-			let c = t("select", s);
-			if (e.attrs.ph) {
-				let n = t("option", {
+		e.register("select", (n, r) => {
+			n = o(n);
+			let i = n.attrs.multi !== void 0, a = n.attrs.v ? n.attrs.v.split(",").map((e) => e.trim()) : [], s = t("div", { class: a.indexOf("inline") === -1 ? "tokui-field" : "tokui-field tokui-field--inline" });
+			if (n.attrs.l) {
+				let e = { class: "tokui-label" };
+				n.attrs.id && !i && (e.for = n.attrs.id), n.attrs.req !== void 0 && (e.class += " tokui-label--req"), s.appendChild(t("label", e, n.attrs.l));
+			}
+			let c = { class: "tokui-select" };
+			i && (c.multiple = !0), n.attrs.id && (c.id = n.attrs.id), n.attrs.n ? c.name = n.attrs.n : n.attrs.id && (c.name = n.attrs.id), n.attrs.req !== void 0 && (c["aria-required"] = "true"), a.indexOf("error") !== -1 && (c["aria-invalid"] = "true");
+			let l = t("select", c);
+			if (n.attrs.ph) {
+				let e = t("option", {
 					value: "",
 					disabled: "",
 					selected: ""
-				}, e.attrs.ph);
-				c.appendChild(n);
+				}, n.attrs.ph);
+				l.appendChild(e);
 			}
-			return n(e.children).forEach((e) => {
-				e && e.nodeType && c.appendChild(e);
-			}), a.appendChild(c), a._update = function(e) {
-				e.v !== void 0 && (c.value = e.v), e.dis === !0 || e.dis === "true" ? c.disabled = !0 : (e.dis === !1 || e.dis === "false") && (c.disabled = !1);
-			}, a._variantTarget = c, a._slot = c, a._tokuiType = "select", a;
-		}), e.register("radio", (e, n) => {
-			e = o(e);
-			let r = e.attrs.v ? e.attrs.v.split(",").map((e) => e.trim()) : [], i = t("div", { class: r.indexOf("inline") === -1 ? "tokui-field" : "tokui-field tokui-field--inline" });
-			e.attrs.l && i.appendChild(t("div", { class: "tokui-label" }, e.attrs.l));
-			let a = t("div", {
-				class: "tokui-radio-group" + (r.indexOf("vertical") === -1 ? "" : " tokui-radio-group--vertical"),
+			r(n.children).forEach((e) => {
+				e && e.nodeType && l.appendChild(e);
+			}), s.appendChild(l);
+			var u = e.createReporter("select", n.attrs, s);
+			return l.addEventListener("change", function() {
+				var e;
+				i ? (e = [], Array.prototype.forEach.call(l.children, function(t) {
+					!t || t.tagName !== "OPTION" || t.selected && e.push(t.value == null ? String(t.getAttribute("value") || "") : String(t.value));
+				})) : e = l.value, u("change", {
+					value: e,
+					name: n.attrs.n || void 0
+				});
+			}), s._update = function(e) {
+				if (e.v !== void 0) if (l.hasAttribute("multiple")) {
+					var t = String(e.v).split(",").map(function(e) {
+						return e.trim();
+					}).filter(Boolean);
+					Array.prototype.forEach.call(l.children, function(e) {
+						if (!(!e || e.tagName !== "OPTION")) {
+							var n = e.value == null ? String(e.getAttribute("value") || "") : String(e.value);
+							t.indexOf(n) === -1 ? e.removeAttribute("selected") : e.setAttribute("selected", "");
+						}
+					});
+				} else l.value = e.v;
+				e.dis === !0 || e.dis === "true" ? l.disabled = !0 : (e.dis === !1 || e.dis === "false") && (l.disabled = !1);
+			}, s._variantTarget = l, s._slot = l, s._tokuiType = "select", s;
+		}), e.register("radio", (n, r) => {
+			n = o(n);
+			let i = n.attrs.v ? n.attrs.v.split(",").map((e) => e.trim()) : [], a = t("div", { class: i.indexOf("inline") === -1 ? "tokui-field" : "tokui-field tokui-field--inline" });
+			n.attrs.l && a.appendChild(t("div", { class: "tokui-label" }, n.attrs.l));
+			let s = t("div", {
+				class: "tokui-radio-group" + (i.indexOf("vertical") === -1 ? "" : " tokui-radio-group--vertical"),
 				role: "radiogroup"
 			});
-			e.attrs.id && (a.id = e.attrs.id);
-			let s = e.attrs.n || e.attrs.id || "radio";
-			return a._radioName = s, e.children.forEach((e) => {
-				a.appendChild(C(e, s));
-			}), i.appendChild(a), i._slot = a, i._tokuiType = "radio", i;
+			n.attrs.id && (s.id = n.attrs.id);
+			let c = n.attrs.n || n.attrs.id || "radio";
+			s._radioName = c, n.children.forEach((e) => {
+				s.appendChild(C(e, c));
+			}), a.appendChild(s), a._slot = s, a._tokuiType = "radio";
+			var l = e.createReporter("radio", n.attrs, a);
+			return s.addEventListener("change", function(e) {
+				var t = e.target;
+				t && t.type === "radio" && t.checked && l("change", {
+					value: t.value,
+					name: n.attrs.n || void 0
+				});
+			}), a._update = function(e) {
+				if (e.v !== void 0) {
+					var t = String(e.v);
+					s.querySelectorAll("input[type=radio]").forEach(function(e) {
+						e.checked = String(e.value) === t;
+					});
+				}
+			}, a;
 		});
 		function C(e, n) {
 			let r = t("label", { class: "tokui-radio-item" });
@@ -11112,39 +11471,67 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			if (r === "radio") return C(e, "");
 			if (r === "checkbox") return w(e, "");
 			if (r === "picker") return y(e);
-			let i = e.attrs ? e.attrs.v : "", a = e.attrs && e.attrs.tx || i || e.content || "";
-			return t("option", { value: i }, a);
-		}), e.register("checkbox", (e, n) => {
-			if (e = o(e), !(e.children && e.children.length > 0 || e.attrs.multi !== void 0)) {
-				let n = (e.attrs.v ? e.attrs.v.split(",").map((e) => e.trim()) : []).indexOf("inline") !== -1;
-				var r = t("label", {
-					class: "tokui-checkbox" + (n ? " tokui-checkbox--inline" : ""),
+			let i = e.attrs ? e.attrs.v : "", a = e.attrs && e.attrs.tx || i || e.content || "", o = { value: i };
+			return e.attrs && e.attrs.chk !== void 0 && (o.selected = ""), t("option", o, a);
+		}), e.register("checkbox", (n, r) => {
+			if (n = o(n), !(n.children && n.children.length > 0 || n.attrs.multi !== void 0)) {
+				let r = (n.attrs.v ? n.attrs.v.split(",").map((e) => e.trim()) : []).indexOf("inline") !== -1;
+				var i = t("label", {
+					class: "tokui-checkbox" + (r ? " tokui-checkbox--inline" : ""),
 					role: "checkbox",
-					"aria-checked": String(e.attrs.chk !== void 0)
+					"aria-checked": String(n.attrs.chk !== void 0)
 				});
-				let a = {
+				let o = {
 					type: "checkbox",
 					class: "tokui-checkbox-input"
 				};
-				e.attrs.id && (a.id = e.attrs.id), e.attrs.n ? a.name = e.attrs.n : e.attrs.id && (a.name = e.attrs.id), e.attrs.chk !== void 0 && (a.checked = "checked");
-				let o = t("input", a);
-				if (r.appendChild(o), r.appendChild(t("span", { class: "tokui-checkbox-text" }, e.attrs.l || "")), o.addEventListener("change", function() {
-					r.setAttribute("aria-checked", String(o.checked));
-				}), !n) {
-					var i = t("div", { class: "tokui-field" });
-					return i.appendChild(r), i;
+				n.attrs.id && (o.id = n.attrs.id), n.attrs.n ? o.name = n.attrs.n : n.attrs.id && (o.name = n.attrs.id), n.attrs.chk !== void 0 && (o.checked = "checked");
+				let l = t("input", o);
+				i.appendChild(l), i.appendChild(t("span", { class: "tokui-checkbox-text" }, n.attrs.l || ""));
+				var a = e.createReporter("checkbox", n.attrs, i);
+				l.addEventListener("change", function() {
+					i.setAttribute("aria-checked", String(l.checked)), a("change", {
+						value: l.checked,
+						name: n.attrs.n || void 0
+					});
+				});
+				var s = function(e) {
+					e.chk === !0 || e.chk === "true" ? l.checked = !0 : (e.chk === !1 || e.chk === "false") && (l.checked = !1), i.setAttribute("aria-checked", String(l.checked));
+				};
+				if (!r) {
+					var c = t("div", { class: "tokui-field" });
+					return c.appendChild(i), c._update = s, c;
 				}
-				return r;
+				return i._update = s, i;
 			}
-			let a = e.attrs.v ? e.attrs.v.split(",").map((e) => e.trim()) : [], s = t("div", { class: a.indexOf("inline") === -1 ? "tokui-field" : "tokui-field tokui-field--inline" });
-			e.attrs.l && s.appendChild(t("div", { class: "tokui-label" }, e.attrs.l));
-			let c = e.attrs.n || e.attrs.id || "checkbox", l = t("div", {
-				class: "tokui-checkbox-group" + (a.indexOf("vertical") === -1 ? "" : " tokui-checkbox-group--vertical"),
+			let l = n.attrs.v ? n.attrs.v.split(",").map((e) => e.trim()) : [], u = t("div", { class: l.indexOf("inline") === -1 ? "tokui-field" : "tokui-field tokui-field--inline" });
+			n.attrs.l && u.appendChild(t("div", { class: "tokui-label" }, n.attrs.l));
+			let d = n.attrs.n || n.attrs.id || "checkbox", f = t("div", {
+				class: "tokui-checkbox-group" + (l.indexOf("vertical") === -1 ? "" : " tokui-checkbox-group--vertical"),
 				role: "group"
 			});
-			return l._checkboxName = c, e.attrs.id && (l.id = e.attrs.id), e.children && e.children.length && e.children.forEach(function(e) {
-				l.appendChild(w(e, c));
-			}), s.appendChild(l), s._slot = l, s._tokuiType = "checkbox", s;
+			f._checkboxName = d, n.attrs.id && (f.id = n.attrs.id), n.children && n.children.length && n.children.forEach(function(e) {
+				f.appendChild(w(e, d));
+			}), u.appendChild(f), u._slot = f, u._tokuiType = "checkbox";
+			var a = e.createReporter("checkbox", n.attrs, u);
+			return f.addEventListener("change", function() {
+				var e = [];
+				f.querySelectorAll("input[type=checkbox]").forEach(function(t) {
+					t.checked && e.push(t.value);
+				}), a("change", {
+					value: e,
+					name: n.attrs.n || void 0
+				});
+			}), u._update = function(e) {
+				if (e.v !== void 0) {
+					var t = String(e.v).split(",").map(function(e) {
+						return e.trim();
+					}).filter(Boolean);
+					f.querySelectorAll("input[type=checkbox]").forEach(function(e) {
+						e.checked = t.indexOf(String(e.value)) !== -1;
+					});
+				}
+			}, u;
 		}), e.register("switch", (n) => {
 			var r = t("label", { class: "tokui-switch" }), i = {
 				type: "checkbox",
@@ -11157,21 +11544,24 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				"aria-checked": String(!!i.checked)
 			});
 			r.appendChild(a), n.attrs.l && r.appendChild(t("span", { class: "tokui-switch__label" }, n.attrs.l));
-			var o = r.querySelector(".tokui-switch-input");
+			var o = r.querySelector(".tokui-switch-input"), s = e.createReporter("switch", n.attrs, r);
 			if (o.addEventListener("change", function() {
-				a.setAttribute("aria-checked", String(o.checked));
+				a.setAttribute("aria-checked", String(o.checked)), s("change", {
+					value: o.checked,
+					name: n.attrs.n || void 0
+				});
 			}), n.attrs.clk && e.eventBus) {
-				var s = e.eventBus.getHandler(n.attrs.clk);
-				s && o.addEventListener("change", function(e) {
-					s(null, e, r);
+				var c = e.eventBus.getHandler(n.attrs.clk);
+				c && o.addEventListener("change", function(e) {
+					c(null, e, r);
 				});
 			}
 			r._update = function(e) {
 				e.chk === !0 || e.chk === "true" ? (o.checked = !0, a.setAttribute("aria-checked", "true")) : (e.chk === !1 || e.chk === "false") && (o.checked = !1, a.setAttribute("aria-checked", "false")), e.dis === !0 || e.dis === "true" ? o.disabled = !0 : (e.dis === !1 || e.dis === "false") && (o.disabled = !1);
 			}, n.attrs.id && (r.id = n.attrs.id);
-			var c = n.attrs.chk !== void 0;
+			var l = n.attrs.chk !== void 0;
 			return r.setAttribute("data-tokui-resettable", ""), r._tokuiReset = function() {
-				o.checked = c, a.setAttribute("aria-checked", String(c));
+				o.checked = l, a.setAttribute("aria-checked", String(l));
 			}, r;
 		}), e.register("slider", (n) => {
 			var r = parseFloat(n.attrs.min) || 0, i = parseFloat(n.attrs.max) || 100, a = parseFloat(n.attrs.step) || 1, o = parseFloat(n.attrs.v) || 0;
@@ -11194,7 +11584,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			var m = (o - r) / (i - r) * 100;
 			if (u.style.width = m + "%", d.style.left = m + "%", n.attrs.dis !== void 0) c.classList.add("tokui-slider--disabled");
 			else {
-				var h = function(e) {
+				var h = e.createReporter("slider", n.attrs, s), g = function(e) {
 					e.preventDefault();
 					var t = l.getBoundingClientRect(), n = ((e.touches ? e.touches[0].clientX : e.clientX) - t.left) / t.width;
 					n = Math.max(0, Math.min(1, n));
@@ -11204,18 +11594,22 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 					c = Math.round(c * m) / m, o = c;
 					var h = (o - r) / (i - r) * 100;
 					u.style.width = h + "%", d.style.left = h + "%", f.textContent = String(o), p.value = o, d.setAttribute("aria-valuenow", String(o));
-				}, g = function() {
-					if (document.removeEventListener("mousemove", h), document.removeEventListener("mouseup", g), document.removeEventListener("touchmove", h), document.removeEventListener("touchend", g), d.classList.remove("tokui-slider__thumb--dragging"), n.attrs.clk) {
+				}, _ = function() {
+					if (document.removeEventListener("mousemove", g), document.removeEventListener("mouseup", _), document.removeEventListener("touchmove", g), document.removeEventListener("touchend", _), d.classList.remove("tokui-slider__thumb--dragging"), n.attrs.clk) {
 						var t = e.eventBus ? e.eventBus.getHandler(n.attrs.clk) : null;
 						t && t({
 							value: o,
 							id: n.attrs.id
 						});
 					}
-				}, _ = function(e) {
-					e.preventDefault(), h(e), document.addEventListener("mousemove", h), document.addEventListener("mouseup", g), document.addEventListener("touchmove", h), document.addEventListener("touchend", g), d.classList.add("tokui-slider__thumb--dragging");
+					h("change", {
+						value: o,
+						name: n.attrs.n || void 0
+					});
+				}, v = function(e) {
+					e.preventDefault(), g(e), document.addEventListener("mousemove", g), document.addEventListener("mouseup", _), document.addEventListener("touchmove", g), document.addEventListener("touchend", _), d.classList.add("tokui-slider__thumb--dragging");
 				};
-				c.addEventListener("mousedown", _), c.addEventListener("touchstart", _, { passive: !1 });
+				c.addEventListener("mousedown", v), c.addEventListener("touchstart", v, { passive: !1 });
 			}
 			s._update = function(e) {
 				if (e.v !== void 0) {
@@ -11226,9 +11620,9 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				}
 				e.dis === !0 || e.dis === "true" ? c.classList.add("tokui-slider--disabled") : (e.dis === !1 || e.dis === "false") && c.classList.remove("tokui-slider--disabled");
 			};
-			var v = o;
+			var y = o;
 			return s.setAttribute("data-tokui-resettable", ""), s._tokuiReset = function() {
-				o = v;
+				o = y;
 				var e = (o - r) / (i - r) * 100;
 				u.style.width = e + "%", d.style.left = e + "%", f.textContent = String(o), p.value = o, d.setAttribute("aria-valuenow", String(o));
 			}, c._variantTarget = c, s.appendChild(c), s;
@@ -11255,7 +11649,9 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				p.textContent = f < i ? a : o, f < i && p.classList.add("tokui-rate__star--active"), u.push(p), c.appendChild(p);
 			}
 			var m = t("span", { class: "tokui-rate__text" });
-			i > 0 && (m.textContent = i + "/" + r), c.appendChild(m), c.appendChild(l), n.attrs.ro === void 0 ? n.attrs.dis === void 0 ? (c.addEventListener("mouseover", function(e) {
+			i > 0 && (m.textContent = i + "/" + r), c.appendChild(m), c.appendChild(l);
+			var h = e.createReporter("rate", n.attrs, s);
+			n.attrs.ro === void 0 ? n.attrs.dis === void 0 ? (c.addEventListener("mouseover", function(e) {
 				var t = e.target;
 				if (t.classList.contains("tokui-rate__star")) for (var n = parseInt(t.getAttribute("data-index")), r = 0; r < u.length; r++) u[r].textContent = r < n ? a : o, u[r].classList.toggle("tokui-rate__star--hover", r < n);
 			}), c.addEventListener("mouseout", function() {
@@ -11274,6 +11670,10 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 							id: n.attrs.id
 						});
 					}
+					h("change", {
+						value: i,
+						name: n.attrs.n || void 0
+					});
 				}
 			}), c.addEventListener("keydown", function(e) {
 				if (e.key === "ArrowRight" || e.key === "ArrowUp") e.preventDefault(), i = Math.min(i + 1, r);
@@ -11281,6 +11681,10 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				else return;
 				l.value = i, m.textContent = i > 0 ? i + "/" + r : "";
 				for (var t = 0; t < u.length; t++) u[t].textContent = t < i ? a : o, u[t].classList.toggle("tokui-rate__star--active", t < i), u[t].setAttribute("aria-checked", String(t < i));
+				h("change", {
+					value: i,
+					name: n.attrs.n || void 0
+				});
 			})) : c.classList.add("tokui-rate--disabled") : c.classList.add("tokui-rate--readonly"), s._update = function(e) {
 				if (e.v !== void 0) {
 					i = parseInt(e.v) || 0, i > r && (i = r), i < 0 && (i = 0), l.value = i, m.textContent = i > 0 ? i + "/" + r : "";
@@ -11288,9 +11692,9 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				}
 				e.dis === !0 || e.dis === "true" ? c.classList.add("tokui-rate--disabled") : (e.dis === !1 || e.dis === "false") && c.classList.remove("tokui-rate--disabled");
 			};
-			var h = i;
+			var g = i;
 			return s.setAttribute("data-tokui-resettable", ""), s._tokuiReset = function() {
-				i = h, l.value = i, m.textContent = i > 0 ? i + "/" + r : "";
+				i = g, l.value = i, m.textContent = i > 0 ? i + "/" + r : "";
 				for (var e = 0; e < u.length; e++) u[e].textContent = e < i ? a : o, u[e].classList.toggle("tokui-rate__star--active", e < i), u[e].setAttribute("aria-checked", String(e < i));
 			}, c._variantTarget = c, s.appendChild(c), s;
 		}), e.register("transfer", (n, r) => {
@@ -11313,7 +11717,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 					var e = i.checked;
 					n._items.forEach(function(t) {
 						t._cb.checked = e;
-					}), v(n);
+					}), y(n);
 				}), n;
 			}
 			function s(e, n, r) {
@@ -11329,7 +11733,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				});
 				return i.appendChild(a), i.appendChild(t("span", {}, n)), i._cb = a, a.addEventListener("change", function() {
 					var e = i.closest(".tokui-transfer__panel");
-					e && v(e);
+					e && y(e);
 				}), i;
 			}
 			var c = n.attrs.tt || "Source", l = n.attrs.tt2 || "Target", u = o(c), d = o(l);
@@ -11352,22 +11756,23 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			p.appendChild(m), p.appendChild(h);
 			var g = t("input", { type: "hidden" });
 			n.attrs.id && (g.id = n.attrs.id), n.attrs.n ? g.name = n.attrs.n : n.attrs.id && (g.name = n.attrs.id);
-			function _() {
+			var _ = e.createReporter("transfer", n.attrs, i);
+			function v() {
 				g.value = d._items.map(function(e) {
 					return e._cb.value;
 				}).join(",");
 			}
-			function v(e) {
+			function y(e) {
 				var t = e._items.filter(function(e) {
 					return e._cb.checked;
 				}).length;
 				e._count.textContent = t + "/" + e._items.length, e._checkAll.checked = t > 0 && t === e._items.length;
 			}
-			function y(t, r) {
+			function b(t, r) {
 				var i = [];
 				if (t._items = t._items.filter(function(e) {
 					return e._cb.checked ? (e._cb.checked = !1, r._body.appendChild(e), r._items.push(e), i.push(e), !1) : !0;
-				}), v(t), v(r), _(), n.attrs.clk && i.length > 0) {
+				}), y(t), y(r), v(), n.attrs.clk && i.length > 0) {
 					var a = e.eventBus ? e.eventBus.getHandler(n.attrs.clk) : null;
 					a && a({
 						values: d._items.map(function(e) {
@@ -11376,86 +11781,99 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 						id: n.attrs.id
 					});
 				}
+				i.length > 0 && _("change", {
+					value: d._items.map(function(e) {
+						return e._cb.value;
+					}),
+					name: n.attrs.n || void 0
+				});
 			}
-			function b(e) {
+			function x(e) {
 				(e || []).forEach(function(e) {
-					e.type === "opt" && x(e);
-				}), v(u), v(d), _();
+					e.type === "opt" && S(e);
+				}), y(u), y(d), v();
 			}
-			function x(e) {
+			function S(e) {
 				var t = e.attrs && e.attrs.v || "", n = e.attrs && e.attrs.tx || t, r = e.attrs && e.attrs.chk !== void 0, a = s(t, n, i._transferOptIdx++);
-				return a.setAttribute("data-tokui-init-side", r ? "right" : "left"), r ? (d._body.appendChild(a), d._items.push(a)) : (u._body.appendChild(a), u._items.push(a)), v(u), v(d), _(), a;
+				return a.setAttribute("data-tokui-init-side", r ? "right" : "left"), r ? (d._body.appendChild(a), d._items.push(a)) : (u._body.appendChild(a), u._items.push(a)), y(u), y(d), v(), a;
 			}
 			m.addEventListener("click", function() {
-				y(u, d);
+				b(u, d);
 			}), h.addEventListener("click", function() {
-				y(d, u);
+				b(d, u);
 			}), i._transferOptIdx = 0;
-			var S = t("div", {});
-			return S.style.display = "none", a.appendChild(u), a.appendChild(p), a.appendChild(d), a.appendChild(g), a.appendChild(S), n.attrs.dis !== void 0 && a.classList.add("tokui-transfer--disabled"), i._tokuiTransferAppend = function(e) {
-				return x(e);
-			}, n.children && n.children.length && b(n.children), i._streamCloseHook = function() {
-				S.innerHTML = "";
-			}, i._slot = S, i._tokuiType = "transfer", a._variantTarget = a, i.setAttribute("data-tokui-resettable", ""), i._tokuiReset = function() {
+			var C = t("div", {});
+			return C.style.display = "none", a.appendChild(u), a.appendChild(p), a.appendChild(d), a.appendChild(g), a.appendChild(C), n.attrs.dis !== void 0 && a.classList.add("tokui-transfer--disabled"), i._tokuiTransferAppend = function(e) {
+				return S(e);
+			}, n.children && n.children.length && x(n.children), i._streamCloseHook = function() {
+				C.innerHTML = "";
+			}, i._slot = C, i._tokuiType = "transfer", a._variantTarget = a, i.setAttribute("data-tokui-resettable", ""), i._tokuiReset = function() {
 				u._items.concat(d._items).forEach(function(e) {
 					var t = (e.getAttribute("data-tokui-init-side") || "left") === "right" ? d : u, n = d._items.indexOf(e) === -1 ? u : d;
 					n !== t && (n._items.splice(n._items.indexOf(e), 1), t._body.appendChild(e), t._items.push(e)), e._cb && (e._cb.checked = !1);
-				}), v(u), v(d), _();
+				}), y(u), y(d), v();
 			}, i.appendChild(a), i;
-		}), e.register("numinput", (e) => {
-			var n = parseFloat(e.attrs.min), r = parseFloat(e.attrs.max), i = parseFloat(e.attrs.step) || 1, a = parseFloat(e.attrs.v) || 0;
-			isNaN(n) || (a = Math.max(n, a)), isNaN(r) || (a = Math.min(r, a));
-			var o = e.attrs.dis !== void 0, s = t("div", { class: "tokui-field" });
-			e.attrs.l && s.appendChild(t("label", { class: "tokui-label" }, e.attrs.l));
-			var c = t("div", { class: "tokui-numinput" + (o ? " tokui-numinput--disabled" : "") }), l = t("button", {
+		}), e.register("numinput", (n) => {
+			var r = parseFloat(n.attrs.min), i = parseFloat(n.attrs.max), a = parseFloat(n.attrs.step) || 1, o = parseFloat(n.attrs.v) || 0;
+			isNaN(r) || (o = Math.max(r, o)), isNaN(i) || (o = Math.min(i, o));
+			var s = n.attrs.dis !== void 0, c = t("div", { class: "tokui-field" });
+			n.attrs.l && c.appendChild(t("label", { class: "tokui-label" }, n.attrs.l));
+			var l = t("div", { class: "tokui-numinput" + (s ? " tokui-numinput--disabled" : "") }), u = t("button", {
 				class: "tokui-numinput__btn tokui-numinput__btn--minus",
 				type: "button"
 			});
-			l.textContent = "−", c.appendChild(l);
-			var u = {
+			u.textContent = "−", l.appendChild(u);
+			var d = {
 				class: "tokui-numinput__input",
 				type: "text",
-				value: String(a)
+				value: String(o)
 			};
-			e.attrs.id && (u.id = e.attrs.id), o && (u.disabled = "disabled");
-			var d = t("input", u);
-			c.appendChild(d);
-			var f = t("button", {
+			n.attrs.id && (d.id = n.attrs.id), s && (d.disabled = "disabled");
+			var f = t("input", d);
+			l.appendChild(f);
+			var p = t("button", {
 				class: "tokui-numinput__btn tokui-numinput__btn--plus",
 				type: "button"
 			});
-			f.textContent = "+", c.appendChild(f);
-			var p = { type: "hidden" };
-			e.attrs.n ? p.name = e.attrs.n : e.attrs.id && (p.name = e.attrs.id), p.value = String(a);
-			var m = t("input", p);
-			if (c.appendChild(m), !o) {
+			p.textContent = "+", l.appendChild(p);
+			var m = { type: "hidden" };
+			n.attrs.n ? m.name = n.attrs.n : n.attrs.id && (m.name = n.attrs.id), m.value = String(o);
+			var h = t("input", m);
+			l.appendChild(h);
+			var g = e.createReporter("numinput", n.attrs, c), _ = e.debounce(function() {
+				g("change", {
+					value: o,
+					name: n.attrs.n || void 0
+				});
+			}, parseInt(n.attrs.db) || 300);
+			if (!s) {
 				function e(e) {
-					return isNaN(n) || (e = Math.max(n, e)), isNaN(r) || (e = Math.min(r, e)), e;
+					return isNaN(r) || (e = Math.max(r, e)), isNaN(i) || (e = Math.min(i, e)), e;
 				}
 				function t(t) {
-					var n = i < 1 ? 10 ** Math.ceil(-Math.log10(i)) : 1;
-					t = Math.round(t * n) / n, t = e(t), a = t, d.value = String(a), m.value = a;
-				}
-				l.addEventListener("click", function() {
-					t(a - i);
-				}), f.addEventListener("click", function() {
-					t(a + i);
-				}), d.addEventListener("change", function() {
-					var e = parseFloat(d.value);
+					var n = a < 1 ? 10 ** Math.ceil(-Math.log10(a)) : 1;
+					t = Math.round(t * n) / n, t = e(t), o = t, f.value = String(o), h.value = o, _();
+				}
+				u.addEventListener("click", function() {
+					t(o - a);
+				}), p.addEventListener("click", function() {
+					t(o + a);
+				}), f.addEventListener("change", function() {
+					var e = parseFloat(f.value);
 					isNaN(e) && (e = 0), t(e);
 				});
 			}
-			s._update = function(e) {
+			c._update = function(e) {
 				if (e.v !== void 0) {
 					var t = parseFloat(e.v) || 0;
-					isNaN(n) || (t = Math.max(n, t)), isNaN(r) || (t = Math.min(r, t)), a = t, d.value = String(a), m.value = a;
+					isNaN(r) || (t = Math.max(r, t)), isNaN(i) || (t = Math.min(i, t)), o = t, f.value = String(o), h.value = o;
 				}
-				e.dis === !0 || e.dis === "true" ? (d.disabled = !0, c.classList.add("tokui-numinput--disabled")) : (e.dis === !1 || e.dis === "false") && (d.disabled = !1, c.classList.remove("tokui-numinput--disabled"));
+				e.dis === !0 || e.dis === "true" ? (f.disabled = !0, l.classList.add("tokui-numinput--disabled")) : (e.dis === !1 || e.dis === "false") && (f.disabled = !1, l.classList.remove("tokui-numinput--disabled"));
 			};
-			var h = a;
-			return s.setAttribute("data-tokui-resettable", ""), s._tokuiReset = function() {
-				a = h, d.value = String(a), d.setAttribute("value", String(a)), m.value = a;
-			}, s.appendChild(c), s._variantTarget = c, s;
+			var v = o;
+			return c.setAttribute("data-tokui-resettable", ""), c._tokuiReset = function() {
+				o = v, f.value = String(o), f.setAttribute("value", String(o)), h.value = o;
+			}, c.appendChild(l), c._variantTarget = l, c;
 		});
 		var T = new Set([
 			"primary",
@@ -11521,30 +11939,30 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			return n(e.children).forEach((e) => {
 				e && e.nodeType && i.appendChild(e);
 			}), i._slot = i, i._tokuiType = "btngroup", i;
-		}), e.register("cascader", (e, n) => {
-			var r = e.attrs.dis !== void 0, i = e.attrs.ph || d("select.placeholder"), a = t("div", { class: "tokui-field" });
-			e.attrs.l && a.appendChild(t("label", { class: "tokui-label" }, e.attrs.l)), e.attrs.id && (a.id = e.attrs.id);
-			var o = t("div", {
-				class: "tokui-cascader" + (r ? " tokui-cascader--disabled" : ""),
+		}), e.register("cascader", (n, r) => {
+			var i = n.attrs.dis !== void 0, a = n.attrs.ph || d("select.placeholder"), o = t("div", { class: "tokui-field" });
+			n.attrs.l && o.appendChild(t("label", { class: "tokui-label" }, n.attrs.l)), n.attrs.id && (o.id = n.attrs.id);
+			var s = t("div", {
+				class: "tokui-cascader" + (i ? " tokui-cascader--disabled" : ""),
 				role: "combobox",
 				"aria-expanded": "false"
-			}), s = t("div", { class: "tokui-cascader-control" }), c = t("input", {
+			}), c = t("div", { class: "tokui-cascader-control" }), l = t("input", {
 				class: "tokui-cascader-input",
 				type: "text",
 				readonly: "readonly",
-				placeholder: i
-			}), l = t("span", { class: "tokui-cascader-arrow" });
-			s.appendChild(c), s.appendChild(l), o.appendChild(s);
-			var u = t("div", {
+				placeholder: a
+			}), u = t("span", { class: "tokui-cascader-arrow" });
+			c.appendChild(l), c.appendChild(u), s.appendChild(c);
+			var f = t("div", {
 				class: "tokui-cascader-menus",
 				role: "listbox"
 			});
-			o.appendChild(u);
-			var f = t("input", { type: "hidden" });
-			e.attrs.n ? f.name = e.attrs.n : e.attrs.id && (f.name = e.attrs.id), o.appendChild(f);
-			var p = t("div", {});
-			p.style.display = "none", o.appendChild(p), a.appendChild(o);
-			function m(e) {
+			s.appendChild(f);
+			var p = t("input", { type: "hidden" });
+			n.attrs.n ? p.name = n.attrs.n : n.attrs.id && (p.name = n.attrs.id), s.appendChild(p);
+			var m = t("div", {});
+			m.style.display = "none", s.appendChild(m), o.appendChild(s);
+			function h(e) {
 				var t = {}, n = [];
 				return (e || []).forEach(function(e) {
 					if (e.type === "opt") {
@@ -11561,7 +11979,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 					r.p && t[r.p] ? t[r.p].children.push(r) : n.push(r);
 				}), n;
 			}
-			function h(e) {
+			function g(e) {
 				var n = t("div", { class: "tokui-cascader-menu" });
 				return e.forEach(function(e) {
 					var r = t("div", {
@@ -11572,12 +11990,12 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 					r.textContent = e.tx, n.appendChild(r);
 				}), n;
 			}
-			function g(e, t) {
+			function _(e, t) {
 				e.querySelectorAll(".tokui-cascader-option").forEach(function(e) {
 					e.classList.toggle("tokui-cascader-option--active", e.getAttribute("data-value") === t);
 				});
 			}
-			function _(e, t) {
+			function v(e, t) {
 				function n(e, r) {
 					for (var i = 0; i < e.length; i++) {
 						var a = r.concat([{
@@ -11593,79 +12011,84 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				}
 				return n(e, []);
 			}
-			function v(e, t) {
-				u.innerHTML = "";
+			function y(e, t) {
+				f.innerHTML = "";
 				for (var n = e, r = 0; r < t.length; r++) {
-					var i = h(n);
-					g(i, t[r]), u.appendChild(i);
+					var i = g(n);
+					_(i, t[r]), f.appendChild(i);
 					for (var a = !1, o = 0; o < n.length; o++) if (n[o].v === t[r]) {
 						n = n[o].children, a = !0;
 						break;
 					}
 					if (!a) break;
 				}
-				n && n.length && u.appendChild(h(n));
+				n && n.length && f.appendChild(g(n));
 			}
-			var y = o._cascaderState = o._cascaderState || {
+			var b = s._cascaderState = s._cascaderState || {
 				isOpen: !1,
 				activeValues: [],
 				tree: null
 			};
-			function b(e) {
-				if (!r) {
-					y.isOpen = !0, y.tree = e, o.classList.add("tokui-cascader--open"), o.setAttribute("aria-expanded", "true");
-					var t = s.getBoundingClientRect();
-					u.style.left = t.left + "px", u.style.top = t.bottom + 4 + "px", u.style.minWidth = t.width + "px", v(e, y.activeValues);
+			function x(e) {
+				if (!i) {
+					b.isOpen = !0, b.tree = e, s.classList.add("tokui-cascader--open"), s.setAttribute("aria-expanded", "true");
+					var t = c.getBoundingClientRect();
+					f.style.left = t.left + "px", f.style.top = t.bottom + 4 + "px", f.style.minWidth = t.width + "px", y(e, b.activeValues);
 				}
 			}
-			function x() {
-				y.isOpen = !1, y.activeValues = [], o.classList.remove("tokui-cascader--open"), o.setAttribute("aria-expanded", "false");
+			function S() {
+				b.isOpen = !1, b.activeValues = [], s.classList.remove("tokui-cascader--open"), s.setAttribute("aria-expanded", "false");
 			}
-			o._cascaderBindDone || (o._cascaderBindDone = !0, s.addEventListener("click", function(e) {
-				e.stopPropagation(), y.isOpen ? x() : y.tree && b(y.tree);
-			}), u.addEventListener("click", function(t) {
-				t.stopPropagation();
-				var n = t.target.closest(".tokui-cascader-option");
-				if (n) {
-					var r = n.getAttribute("data-value");
-					if (n.getAttribute("data-text"), y.tree) {
-						var i = _(y.tree, r);
+			var C = e.createReporter("cascader", n.attrs, o);
+			s._cascaderBindDone || (s._cascaderBindDone = !0, c.addEventListener("click", function(e) {
+				e.stopPropagation(), b.isOpen ? S() : b.tree && x(b.tree);
+			}), f.addEventListener("click", function(e) {
+				e.stopPropagation();
+				var t = e.target.closest(".tokui-cascader-option");
+				if (t) {
+					var r = t.getAttribute("data-value");
+					if (t.getAttribute("data-text"), b.tree) {
+						var i = v(b.tree, r);
 						if (i) {
-							var a = i[i.length - 1].node, o = n.parentElement;
-							if (g(o, r), a.children.length > 0) y.activeValues = i.map(function(e) {
+							var a = i[i.length - 1].node, o = t.parentElement;
+							if (_(o, r), a.children.length > 0) b.activeValues = i.map(function(e) {
 								return e.v;
-							}), v(y.tree, y.activeValues);
+							}), y(b.tree, b.activeValues);
 							else {
 								var s = i.map(function(e) {
 									return e.tx;
-								}).join(" / "), l = i.map(function(e) {
+								}).join(" / "), c = i.map(function(e) {
 									return e.v;
 								}).join("/");
-								if (c.value = s, f.value = l, x(), e.attrs.clk) {
-									var u = typeof window < "u" && window.TokUI && window.TokUI._internal && window.TokUI._internal.TokUIEventBus ? window.TokUI._internal.TokUIEventBus.getHandler(e.attrs.clk) : null;
+								if (l.value = s, p.value = c, S(), n.attrs.clk) {
+									var u = typeof window < "u" && window.TokUI && window.TokUI._internal && window.TokUI._internal.TokUIEventBus ? window.TokUI._internal.TokUIEventBus.getHandler(n.attrs.clk) : null;
 									u && u({
-										id: e.attrs.id,
-										value: l,
+										id: n.attrs.id,
+										value: c,
 										text: s,
 										path: i
 									});
 								}
+								C("change", {
+									value: c,
+									name: n.attrs.n || void 0
+								});
 							}
 						}
 					}
 				}
 			}), typeof document < "u" && document.addEventListener("click", function() {
-				y.isOpen && x();
+				b.isOpen && S();
 			}));
-			var S = {
+			var w = {
 				hidden: "",
 				text: ""
 			};
-			function C(t) {
-				if (y.tree = t, e.attrs.v) {
-					for (var n = String(e.attrs.v).split("/"), r = !0, i = [], a = t, o = 0; o < n.length; o++) {
-						for (var s = !1, l = 0; l < a.length; l++) if (a[l].v === n[o]) {
-							i.push(a[l].tx), a = a[l].children, s = !0;
+			function T(e) {
+				if (b.tree = e, n.attrs.v) {
+					for (var t = String(n.attrs.v).split("/"), r = !0, i = [], a = e, o = 0; o < t.length; o++) {
+						for (var s = !1, c = 0; c < a.length; c++) if (a[c].v === t[o]) {
+							i.push(a[c].tx), a = a[c].children, s = !0;
 							break;
 						}
 						if (!s) {
@@ -11673,15 +12096,15 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 							break;
 						}
 					}
-					r && i.length === n.length && (c.value = i.join(" / "), f.value = e.attrs.v);
+					r && i.length === t.length && (l.value = i.join(" / "), p.value = n.attrs.v);
 				}
-				S.hidden = f.value, S.text = c.value;
+				w.hidden = p.value, w.text = l.value;
 			}
-			return e.children && e.children.length && C(m(e.children)), a._streamCloseHook = function() {
-				p.innerHTML = "", C(m(e.children));
-			}, a._slot = p, a._tokuiType = "cascader", a._variantTarget = o, a.setAttribute("data-tokui-resettable", ""), a._tokuiReset = function() {
-				f.value = S.hidden, c.value = S.text, y.isOpen && x();
-			}, a;
+			return n.children && n.children.length && T(h(n.children)), o._streamCloseHook = function() {
+				m.innerHTML = "", T(h(n.children));
+			}, o._slot = m, o._tokuiType = "cascader", o._variantTarget = s, o.setAttribute("data-tokui-resettable", ""), o._tokuiReset = function() {
+				p.value = w.hidden, l.value = w.text, b.isOpen && S();
+			}, o;
 		}), e.register("upload", (n) => {
 			var r = n.attrs.dis !== void 0, i = n.attrs.multi !== void 0, a = parseInt(n.attrs.max) || 0, o = n.attrs.ph || d("upload.hint"), s = n.attrs.accept || "", c = t("div", { class: "tokui-field" });
 			n.attrs.l && c.appendChild(t("label", { class: "tokui-label" }, n.attrs.l)), n.attrs.id && (c.id = n.attrs.id);
@@ -11713,8 +12136,16 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			function y(e) {
 				return e < 1024 ? e + " B" : e < 1048576 ? (e / 1024).toFixed(1) + " KB" : (e / 1048576).toFixed(1) + " MB";
 			}
-			var b = [];
-			function x() {
+			var b = [], x = e.createReporter("upload", n.attrs, c);
+			function S() {
+				x("change", {
+					value: b.map(function(e) {
+						return e.name;
+					}),
+					name: n.attrs.n || void 0
+				});
+			}
+			function C() {
 				_.innerHTML = "", b.forEach(function(e, n) {
 					var r = t("div", { class: "tokui-upload-file" }), i = t("span", { class: "tokui-upload-file-icon" });
 					i.textContent = "📄", r.appendChild(i);
@@ -11728,39 +12159,42 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 					return e.name;
 				}).join(",");
 			}
-			function S(t) {
+			function w(t) {
 				for (var r = 0; r < t.length && !(a && b.length >= a); r++) b.push({
 					name: t[r].name,
 					size: t[r].size,
 					type: t[r].type
 				});
-				if (x(), n.attrs.clk) {
+				if (C(), n.attrs.clk) {
 					var i = e.eventBus ? e.eventBus.getHandler(n.attrs.clk) : null;
 					i && i({
 						id: n.attrs.id,
 						files: b
 					});
 				}
+				S();
 			}
 			return r || (u.addEventListener("click", function(e) {
 				(e.target === m || u.contains(e.target)) && g.click();
 			}), m.addEventListener("click", function(e) {
 				e.stopPropagation(), g.click();
 			}), g.addEventListener("change", function() {
-				g.files && g.files.length && (S(g.files), g.value = "");
+				g.files && g.files.length && (w(g.files), g.value = "");
 			}), u.addEventListener("dragover", function(e) {
 				e.preventDefault(), l.classList.add("tokui-upload--dragover");
 			}), u.addEventListener("dragleave", function(e) {
 				e.preventDefault(), l.classList.remove("tokui-upload--dragover");
 			}), u.addEventListener("drop", function(e) {
-				e.preventDefault(), l.classList.remove("tokui-upload--dragover"), e.dataTransfer && e.dataTransfer.files.length && S(e.dataTransfer.files);
+				e.preventDefault(), l.classList.remove("tokui-upload--dragover"), e.dataTransfer && e.dataTransfer.files.length && w(e.dataTransfer.files);
 			}), _.addEventListener("click", function(e) {
 				var t = e.target.closest(".tokui-upload-file-remove");
 				if (t) {
 					var n = parseInt(t.getAttribute("data-idx"));
-					!isNaN(n) && n >= 0 && n < b.length && (b.splice(n, 1), x());
+					!isNaN(n) && n >= 0 && n < b.length && (b.splice(n, 1), C(), S());
 				}
-			})), c.appendChild(l), c._variantTarget = l, c;
+			})), c.appendChild(l), c._variantTarget = l, c._update = function(e) {
+				e.act === "clear" && (b.length = 0, g.value = "", C());
+			}, c;
 		});
 		function E(e) {
 			if (!e) return null;
@@ -11939,31 +12373,32 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			s && (y = E(s), y && (_ = y.getFullYear(), v = y.getMonth())), _ || (_ = g.getFullYear(), v = g.getMonth());
 			var b = t("input", { type: "hidden" });
 			r.n ? b.name = r.n : r.id && (b.name = r.id), b.value = s, u.appendChild(b);
-			function x(e, t) {
+			var x = e.createReporter("datepicker", r, c);
+			function S(e, t) {
 				h.innerHTML = "";
 				var n = V(e, t, y, g, h);
 				n.prevBtn.addEventListener("click", function(e) {
-					e.stopPropagation(), v--, v < 0 && (v = 11, _--), x(_, v);
+					e.stopPropagation(), v--, v < 0 && (v = 11, _--), S(_, v);
 				}), n.nextBtn.addEventListener("click", function(e) {
-					e.stopPropagation(), v++, v > 11 && (v = 0, _++), x(_, v);
+					e.stopPropagation(), v++, v > 11 && (v = 0, _++), S(_, v);
 				});
 			}
-			x(_, v), h.style.display = "none", u.appendChild(h);
-			var S = !1;
-			function C() {
-				if (!(i || S)) {
-					L(w), S = !0, h.style.display = "", u.classList.add("tokui-datepicker--open");
+			S(_, v), h.style.display = "none", u.appendChild(h);
+			var C = !1;
+			function w() {
+				if (!(i || C)) {
+					L(T), C = !0, h.style.display = "", u.classList.add("tokui-datepicker--open");
 					var e = d.getBoundingClientRect();
 					h.style.left = e.left + "px", h.style.top = e.bottom + 4 + "px", h.style.width = "auto";
 					var t = B();
 					e.left + h.offsetWidth > t - 8 && (h.style.left = Math.max(8, t - h.offsetWidth - 8) + "px");
 				}
 			}
-			function w() {
-				S && (S = !1, h.style.display = "none", u.classList.remove("tokui-datepicker--open"), R(w));
+			function T() {
+				C && (C = !1, h.style.display = "none", u.classList.remove("tokui-datepicker--open"), R(T));
 			}
 			return i || (d.addEventListener("click", function(e) {
-				e.stopPropagation(), S ? w() : C();
+				e.stopPropagation(), C ? T() : w();
 			}), h.addEventListener("click", function(t) {
 				t.stopPropagation();
 				var n = t.target.closest(".tokui-datepicker-day");
@@ -11971,7 +12406,7 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 					var i = parseInt(n.getAttribute("data-day"));
 					y = new Date(_, v, i);
 					var o = O(y, a);
-					if (p.value = o, b.value = o, w(), x(_, v), r.clk) {
+					if (p.value = o, b.value = o, T(), S(_, v), r.clk) {
 						var s = e.eventBus ? e.eventBus.getHandler(r.clk) : null;
 						s && s({
 							value: o,
@@ -11979,9 +12414,13 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 							id: r.id
 						});
 					}
+					x("change", {
+						value: o,
+						name: r.n || void 0
+					});
 				}
 			}), typeof document < "u" && document.addEventListener("click", function(e) {
-				u.contains(e.target) || w();
+				u.contains(e.target) || T();
 			})), c.appendChild(u), c._variantTarget = u, c;
 		}), e.register("timepicker", (n) => {
 			var r = n.attrs || {}, i = r.dis !== void 0, a = r.fmt || "HH:mm", o = r.ph || a, s = r.v || "", c = t("div", { class: "tokui-field" });
@@ -12014,26 +12453,28 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			}, d("common.ok"));
 			E.appendChild(D), b.appendChild(E);
 			var O = t("input", { type: "hidden" });
-			r.n ? O.name = r.n : r.id && (O.name = r.id), O.value = s, u.appendChild(O), b.style.display = "none", u.appendChild(b);
-			var A = !1;
-			function j() {
-				if (!(i || A)) {
-					L(M), A = !0, b.style.display = "", u.classList.add("tokui-timepicker--open");
+			r.n ? O.name = r.n : r.id && (O.name = r.id), O.value = s, u.appendChild(O);
+			var A = e.createReporter("timepicker", r, c);
+			b.style.display = "none", u.appendChild(b);
+			var j = !1;
+			function M() {
+				if (!(i || j)) {
+					L(I), j = !0, b.style.display = "", u.classList.add("tokui-timepicker--open");
 					var e = f.getBoundingClientRect();
 					b.style.left = e.left + "px", b.style.top = e.bottom + 4 + "px", b.style.width = "auto";
 					var t = B();
 					e.left + b.offsetWidth > t - 8 && (b.style.left = Math.max(8, t - b.offsetWidth - 8) + "px"), F(C, g), F(w, _), x && T && F(T, v);
 				}
 			}
-			function M() {
-				A && (A = !1, b.style.display = "none", u.classList.remove("tokui-timepicker--open"), R(M));
+			function I() {
+				j && (j = !1, b.style.display = "none", u.classList.remove("tokui-timepicker--open"), R(I));
 			}
 			return i || (f.addEventListener("click", function(e) {
-				e.stopPropagation(), A ? M() : j();
+				e.stopPropagation(), j ? I() : M();
 			}), D.addEventListener("click", function(t) {
 				t.stopPropagation(), g = P(C), _ = P(w), x && T && (v = P(T));
 				var n = k(g, _, v, a);
-				if (m.value = n, O.value = n, M(), r.clk) {
+				if (m.value = n, O.value = n, I(), r.clk) {
 					var i = e.eventBus ? e.eventBus.getHandler(r.clk) : null;
 					i && i({
 						value: n,
@@ -12043,8 +12484,12 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 						id: r.id
 					});
 				}
+				A("change", {
+					value: n,
+					name: r.n || void 0
+				});
 			}), typeof document < "u" && document.addEventListener("click", function(e) {
-				u.contains(e.target) || M();
+				u.contains(e.target) || I();
 			})), c.appendChild(u), c._variantTarget = u, c;
 		}), e.register("datetimepicker", (n) => {
 			var r = n.attrs || {}, i = r.dis !== void 0, a = r.fmt || "YYYY-MM-DD HH:mm", o = r.ph || a, s = r.v || "", c = t("div", { class: "tokui-field" });
@@ -12066,52 +12511,52 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			s && (y = D(s) || E(s), y && (_ = y.getFullYear(), v = y.getMonth(), b = y.getHours(), x = y.getMinutes(), S = y.getSeconds())), _ || (_ = g.getFullYear(), v = g.getMonth());
 			var C = t("input", { type: "hidden" });
 			r.n ? C.name = r.n : r.id && (C.name = r.id), C.value = s, u.appendChild(C);
-			var w = t("div", { class: "tokui-datetimepicker-dropdown" }), T = t("div", { class: "tokui-datetimepicker-date" }), k = a.indexOf("ss") !== -1 || a.indexOf("s") !== -1, A = t("div", { class: "tokui-datetimepicker-time" }), j = t("div", { class: "tokui-timepicker-columns" }), M = N(d("duration.hour"), 24, b), I = N(d("duration.minute"), 60, x);
-			j.appendChild(M), j.appendChild(I);
-			var z = null;
-			k && (z = N(d("duration.second"), 60, S), j.appendChild(z)), A.appendChild(j);
-			function H(e, t) {
-				T.innerHTML = "";
-				var n = V(e, t, y, g, T);
+			var w = e.createReporter("datetimepicker", r, c), T = t("div", { class: "tokui-datetimepicker-dropdown" }), k = t("div", { class: "tokui-datetimepicker-date" }), A = a.indexOf("ss") !== -1 || a.indexOf("s") !== -1, j = t("div", { class: "tokui-datetimepicker-time" }), M = t("div", { class: "tokui-timepicker-columns" }), I = N(d("duration.hour"), 24, b), z = N(d("duration.minute"), 60, x);
+			M.appendChild(I), M.appendChild(z);
+			var H = null;
+			A && (H = N(d("duration.second"), 60, S), M.appendChild(H)), j.appendChild(M);
+			function U(e, t) {
+				k.innerHTML = "";
+				var n = V(e, t, y, g, k);
 				n.prevBtn.addEventListener("click", function(e) {
-					e.stopPropagation(), v--, v < 0 && (v = 11, _--), H(_, v);
+					e.stopPropagation(), v--, v < 0 && (v = 11, _--), U(_, v);
 				}), n.nextBtn.addEventListener("click", function(e) {
-					e.stopPropagation(), v++, v > 11 && (v = 0, _++), H(_, v);
+					e.stopPropagation(), v++, v > 11 && (v = 0, _++), U(_, v);
 				});
 			}
-			var U = t("div", { class: "tokui-datetimepicker-footer" }), W = t("button", {
+			var W = t("div", { class: "tokui-datetimepicker-footer" }), G = t("button", {
 				class: "tokui-timepicker-confirm",
 				type: "button"
 			}, d("common.ok"));
-			U.appendChild(W);
-			var G = t("div", { class: "tokui-datetimepicker-body" });
-			G.appendChild(T), G.appendChild(A), w.appendChild(G), w.appendChild(U), H(_, v), w.style.display = "none", u.appendChild(w);
-			var K = !1;
-			function q() {
-				if (!(i || K)) {
-					L(J), K = !0, w.style.display = "", u.classList.add("tokui-datetimepicker--open");
+			W.appendChild(G);
+			var K = t("div", { class: "tokui-datetimepicker-body" });
+			K.appendChild(k), K.appendChild(j), T.appendChild(K), T.appendChild(W), U(_, v), T.style.display = "none", u.appendChild(T);
+			var q = !1;
+			function J() {
+				if (!(i || q)) {
+					L(Y), q = !0, T.style.display = "", u.classList.add("tokui-datetimepicker--open");
 					var e = f.getBoundingClientRect();
-					w.style.left = e.left + "px", w.style.top = e.bottom + 4 + "px", w.style.width = "auto";
-					var t = w.offsetWidth, n = B();
-					e.left + t > n - 8 && (w.style.left = Math.max(8, n - t - 8) + "px"), F(M, b), F(I, x), k && z && F(z, S);
+					T.style.left = e.left + "px", T.style.top = e.bottom + 4 + "px", T.style.width = "auto";
+					var t = T.offsetWidth, n = B();
+					e.left + t > n - 8 && (T.style.left = Math.max(8, n - t - 8) + "px"), F(I, b), F(z, x), A && H && F(H, S);
 				}
 			}
-			function J() {
-				K && (K = !1, w.style.display = "none", u.classList.remove("tokui-datetimepicker--open"), R(J));
+			function Y() {
+				q && (q = !1, T.style.display = "none", u.classList.remove("tokui-datetimepicker--open"), R(Y));
 			}
 			return i || (f.addEventListener("click", function(e) {
-				e.stopPropagation(), K ? J() : q();
-			}), T.addEventListener("click", function(e) {
+				e.stopPropagation(), q ? Y() : J();
+			}), k.addEventListener("click", function(e) {
 				e.stopPropagation();
 				var t = e.target.closest(".tokui-datepicker-day");
 				if (!(!t || t.classList.contains("tokui-datepicker-day--other"))) {
 					var n = parseInt(t.getAttribute("data-day"));
-					y = new Date(_, v, n), H(_, v);
+					y = new Date(_, v, n), U(_, v);
 				}
-			}), W.addEventListener("click", function(t) {
-				t.stopPropagation(), y ||= new Date(_, v, g.getDate()), b = P(M), x = P(I), k && z && (S = P(z)), y.setHours(b, x, S);
+			}), G.addEventListener("click", function(t) {
+				t.stopPropagation(), y ||= new Date(_, v, g.getDate()), b = P(I), x = P(z), A && H && (S = P(H)), y.setHours(b, x, S);
 				var n = O(y, a);
-				if (m.value = n, C.value = n, J(), r.clk) {
+				if (m.value = n, C.value = n, Y(), r.clk) {
 					var i = e.eventBus ? e.eventBus.getHandler(r.clk) : null;
 					i && i({
 						value: n,
@@ -12119,8 +12564,12 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 						id: r.id
 					});
 				}
+				w("change", {
+					value: n,
+					name: r.n || void 0
+				});
 			}), typeof document < "u" && document.addEventListener("click", function(e) {
-				u.contains(e.target) || J();
+				u.contains(e.target) || Y();
 			})), c.appendChild(u), c._variantTarget = u, c;
 		});
 	}
@@ -12253,33 +12702,46 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				}), i._slot = i;
 			}
 			return i.nodeType === 1 && (i._tokuiType = "item"), i;
-		}), e.register("tabs", (e, n) => {
-			let r = t("div", {
+		}), e.register("tabs", (n, r) => {
+			let i = t("div", {
 				class: "tokui-tabs",
 				role: "tablist"
-			}), i = "tokui-tab-" + Math.random().toString(36).slice(2, 8);
-			return r._tabId = i, r._tabCount = 0, (e.children || []).forEach((e, t) => {
-				e.type === "tab" && (o(r, e, n, i, t), r._tabCount = t + 1);
-			}), r._slot = r, r._tokuiType = "tabs", r.addEventListener("keydown", function(e) {
+			});
+			n.attrs.id && (i.id = n.attrs.id);
+			let a = "tokui-tab-" + Math.random().toString(36).slice(2, 8);
+			i._tabId = a, i._tabCount = 0;
+			var s = e.createReporter("tabs", n.attrs, i);
+			return (n.children || []).forEach((e, t) => {
+				e.type === "tab" && (o(i, e, r, a, t), i._tabCount = t + 1);
+			}), i._slot = i, i._tokuiType = "tabs", i.addEventListener("keydown", function(e) {
 				if (!(e.key !== "ArrowRight" && e.key !== "ArrowLeft")) {
-					var t = Array.from(r.querySelectorAll(".tokui-tabs-label")), n = t.indexOf(e.target);
+					var t = Array.from(i.querySelectorAll(".tokui-tabs-label")), n = t.indexOf(e.target);
 					if (n !== -1) {
 						e.preventDefault();
-						var i = e.key === "ArrowRight" ? (n + 1) % t.length : (n - 1 + t.length) % t.length, a = r.querySelector("#" + t[i].getAttribute("for"));
-						a && (a.checked = !0, t[i].focus());
+						var r = e.key === "ArrowRight" ? (n + 1) % t.length : (n - 1 + t.length) % t.length, a = i.querySelector("#" + t[r].getAttribute("for"));
+						a && (a.checked = !0, t[r].focus());
 					}
 				}
-			}), r._update = function(e) {
+			}), i.addEventListener("change", function(e) {
+				var t = e.target;
+				if (!(!t || !t.classList || !t.classList.contains("tokui-tabs-input"))) {
+					var n = parseInt(t.getAttribute("data-index"), 10), r = i.querySelector(".tokui-tabs-label[data-index=\"" + n + "\"]");
+					s("change", {
+						index: n,
+						title: r ? r.textContent : ""
+					});
+				}
+			}), i._update = function(e) {
 				if (e.v !== void 0) {
-					var t = r.querySelector("input[data-index=\"" + e.v + "\"]");
+					var t = i.querySelector("input[data-index=\"" + e.v + "\"]");
 					t && (t.checked = !0);
 				}
-			}, r._streamCloseHook = function() {
-				if (r._tokuiStreamActive) {
-					var e = r.querySelector("input[data-index=\"0\"]");
+			}, i._streamCloseHook = function() {
+				if (i._tokuiStreamActive) {
+					var e = i.querySelector("input[data-index=\"0\"]");
 					e && (e.checked = !0);
 				}
-			}, r;
+			}, i;
 		});
 		function o(e, n, r, i, a) {
 			var o = {
@@ -12350,86 +12812,96 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 					}
 				}
 			}, a;
-		}), e.register("dialog", (e, r) => {
-			var i = { class: "tokui-dialog" };
-			e.attrs.id && (i.id = e.attrs.id);
-			var a = t("dialog", i);
-			if (e.attrs.tt) {
-				var o = t("div", { class: "tokui-dialog-header" }), s = t("span", {}, e.attrs.tt);
-				o.appendChild(s);
-				var c = t("button", {
+		}), e.register("dialog", (r, i) => {
+			var a = { class: "tokui-dialog" };
+			r.attrs.id && (a.id = r.attrs.id);
+			var o = t("dialog", a), s = e.createReporter("dialog", r.attrs, o);
+			if (o.addEventListener("close", function() {
+				if (o._tokuiSilentClose) {
+					o._tokuiSilentClose = !1;
+					return;
+				}
+				s("close", {});
+			}), r.attrs.tt) {
+				var c = t("div", { class: "tokui-dialog-header" }), l = t("span", {}, r.attrs.tt);
+				c.appendChild(l);
+				var u = t("button", {
 					class: "tokui-dialog-close",
 					"aria-label": n("common.close")
 				}, "✕");
-				c.addEventListener("click", function() {
-					a.close();
-				}), o.appendChild(c), a.appendChild(o);
+				u.addEventListener("click", function() {
+					o.close();
+				}), c.appendChild(u), o.appendChild(c);
 			}
-			var l = [], u = [];
-			(e.children || []).forEach((e) => {
-				e.type === "ft" ? u.push(e) : l.push(e);
+			var d = [], f = [];
+			(r.children || []).forEach((e) => {
+				e.type === "ft" ? f.push(e) : d.push(e);
 			});
-			var d = t("div", { class: "tokui-dialog-body" });
-			return r(l).forEach((e) => {
-				e && e.nodeType && d.appendChild(e);
-			}), a.appendChild(d), r(u).forEach((e) => {
-				e && e.nodeType && a.appendChild(e);
-			}), e.attrs.clk && a.setAttribute("data-tokui-clk", e.attrs.clk), a.addEventListener("click", function(e) {
-				e.target === a && a.close();
-			}), a._slot = d, a._tokuiType = "dialog", a.addEventListener("keydown", function(e) {
+			var p = t("div", { class: "tokui-dialog-body" });
+			return i(d).forEach((e) => {
+				e && e.nodeType && p.appendChild(e);
+			}), o.appendChild(p), i(f).forEach((e) => {
+				e && e.nodeType && o.appendChild(e);
+			}), r.attrs.clk && o.setAttribute("data-tokui-clk", r.attrs.clk), o.addEventListener("click", function(e) {
+				e.target === o && o.close();
+			}), o._slot = p, o._tokuiType = "dialog", o.addEventListener("keydown", function(e) {
 				if (e.key === "Tab") {
-					var t = a.querySelectorAll("button, [tabindex], input, select, textarea");
+					var t = o.querySelectorAll("button, [tabindex], input, select, textarea");
 					if (t.length !== 0) {
 						var n = t[0], r = t[t.length - 1];
 						e.shiftKey && document.activeElement === n ? (e.preventDefault(), r.focus()) : !e.shiftKey && document.activeElement === r && (e.preventDefault(), n.focus());
 					}
 				}
-			}), a._update = function(e) {
-				if (e.act === "open" ? a.showModal() : e.act === "close" && a.close(), e.tt !== void 0) {
-					var t = a.querySelector(".tokui-dialog-header span");
+			}), o._update = function(e) {
+				if (e.act === "open" ? o.showModal() : e.act === "close" && (o._tokuiSilentClose = !0, o.close()), e.tt !== void 0) {
+					var t = o.querySelector(".tokui-dialog-header span");
 					t && (t.textContent = e.tt);
 				}
-			}, a;
-		}), e.register("drawer", (e, r) => {
-			var i = e.attrs.pos || "right", a = t("div", {
-				class: "tokui-drawer tokui-drawer--" + i,
+			}, o;
+		}), e.register("drawer", (r, i) => {
+			var a = r.attrs.pos || "right", o = t("div", {
+				class: "tokui-drawer tokui-drawer--" + a,
 				role: "dialog",
 				"aria-modal": "true"
 			});
-			e.attrs.id && (a.id = e.attrs.id), e.attrs.clk && a.setAttribute("data-tokui-clk", e.attrs.clk);
-			var o = t("div", { class: "tokui-drawer__overlay" });
-			o.addEventListener("click", function() {
-				a.classList.remove("tokui-drawer--open");
-			}), a.appendChild(o);
-			var s = t("div", { class: "tokui-drawer__panel" }), c = e.attrs.w || "360px", l = e.attrs.h || "300px";
-			if (i === "left" || i === "right" ? (s.style.width = c, s.style.height = "100%") : (s.style.height = l, s.style.width = "100%"), e.attrs.tt) {
-				var u = t("div", { class: "tokui-drawer__header" });
-				u.appendChild(t("span", {}, e.attrs.tt));
-				var d = t("button", {
+			r.attrs.id && (o.id = r.attrs.id), r.attrs.clk && o.setAttribute("data-tokui-clk", r.attrs.clk);
+			var s = e.createReporter("drawer", r.attrs, o);
+			function c(e) {
+				e || s("close", {}), o.classList.remove("tokui-drawer--open");
+			}
+			var l = t("div", { class: "tokui-drawer__overlay" });
+			l.addEventListener("click", function() {
+				c();
+			}), o.appendChild(l);
+			var u = t("div", { class: "tokui-drawer__panel" }), d = r.attrs.w || "360px", f = r.attrs.h || "300px";
+			if (a === "left" || a === "right" ? (u.style.width = d, u.style.height = "100%") : (u.style.height = f, u.style.width = "100%"), r.attrs.tt) {
+				var p = t("div", { class: "tokui-drawer__header" });
+				p.appendChild(t("span", {}, r.attrs.tt));
+				var m = t("button", {
 					class: "tokui-drawer__close",
 					"aria-label": n("common.close")
 				}, "✕");
-				d.addEventListener("click", function() {
-					a.classList.remove("tokui-drawer--open");
-				}), u.appendChild(d), s.appendChild(u);
-			}
-			var f = [], p = [];
-			(e.children || []).forEach(function(e) {
-				e.type === "ft" ? p.push(e) : f.push(e);
-			});
-			var m = t("div", { class: "tokui-drawer__body" });
-			return r(f).forEach(function(e) {
-				e && e.nodeType && m.appendChild(e);
-			}), s.appendChild(m), r(p).forEach(function(e) {
-				e && e.nodeType && s.appendChild(e);
-			}), a.appendChild(s), a._slot = m, a._tokuiType = "drawer", a.addEventListener("keydown", function(e) {
-				e.key === "Escape" && (a.classList.remove("tokui-drawer--open"), e.stopPropagation());
-			}), a._update = function(e) {
-				if (e.act === "open" ? a.classList.add("tokui-drawer--open") : e.act === "close" && a.classList.remove("tokui-drawer--open"), e.tt !== void 0) {
-					var t = a.querySelector(".tokui-drawer__header span");
+				m.addEventListener("click", function() {
+					c();
+				}), p.appendChild(m), u.appendChild(p);
+			}
+			var h = [], g = [];
+			(r.children || []).forEach(function(e) {
+				e.type === "ft" ? g.push(e) : h.push(e);
+			});
+			var _ = t("div", { class: "tokui-drawer__body" });
+			return i(h).forEach(function(e) {
+				e && e.nodeType && _.appendChild(e);
+			}), u.appendChild(_), i(g).forEach(function(e) {
+				e && e.nodeType && u.appendChild(e);
+			}), o.appendChild(u), o._slot = _, o._tokuiType = "drawer", o.addEventListener("keydown", function(e) {
+				e.key === "Escape" && (c(), e.stopPropagation());
+			}), o._update = function(e) {
+				if (e.act === "open" ? o.classList.add("tokui-drawer--open") : e.act === "close" && c(!0), e.tt !== void 0) {
+					var t = o.querySelector(".tokui-drawer__header span");
 					t && (t.textContent = e.tt);
 				}
-			}, a;
+			}, o;
 		}), e.register("imgs", (e, r) => {
 			let i = t("div", {
 				class: "tokui-imgs",
@@ -12502,46 +12974,56 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				e.textContent = n.tm, s.appendChild(e);
 			}
 			return a.appendChild(s), a;
-		}), e.register("steps", (e, n) => {
-			let r = e.attrs || {}, i = parseInt(r.v) || 1, a = r.s || "", o = r.vd || "", s = ["tokui-steps"];
-			(a === "sm" || a === "small") && s.push("tokui-steps--sm"), (o === "vertical" || o === "v") && s.push("tokui-steps--vertical");
-			let c = { class: s.join(" ") };
-			r.id && (c.id = r.id);
-			let l = t("div", c);
-			(e.children || []).filter((e) => e.type === "step").forEach(function(e, n) {
-				let r = n + 1, a = e.attrs || {}, o = ["tokui-step"];
-				a.status === "error" || a.status === "danger" ? (o.push("tokui-step--error"), r <= i && o.push("tokui-step--current")) : r < i ? o.push("tokui-step--done") : r === i ? o.push("tokui-step--active") : o.push("tokui-step--pending");
+		}), e.register("steps", (n, r) => {
+			let i = n.attrs || {}, a = parseInt(i.v) || 1, o = i.s || "", s = i.vd || "", c = ["tokui-steps"];
+			(o === "sm" || o === "small") && c.push("tokui-steps--sm"), (s === "vertical" || s === "v") && c.push("tokui-steps--vertical");
+			let l = { class: c.join(" ") };
+			i.id && (l.id = i.id);
+			let u = t("div", l), d = e.createReporter("steps", i, u);
+			i.on && u.classList.add("tokui-steps--clickable"), u.addEventListener("click", function(e) {
+				let t = e.target && e.target.closest ? e.target.closest(".tokui-step") : null;
+				if (!t) return;
+				let n = u.querySelectorAll(".tokui-step"), r = Array.prototype.indexOf.call(n, t);
+				if (r === -1) return;
+				let i = t.querySelector(".tokui-step__title");
+				d("change", {
+					index: r,
+					title: i ? i.textContent : ""
+				});
+			}), (n.children || []).filter((e) => e.type === "step").forEach(function(e, n) {
+				let r = n + 1, i = e.attrs || {}, o = ["tokui-step"];
+				i.status === "error" || i.status === "danger" ? (o.push("tokui-step--error"), r <= a && o.push("tokui-step--current")) : r < a ? o.push("tokui-step--done") : r === a ? o.push("tokui-step--active") : o.push("tokui-step--pending");
 				let s = t("div", {
 					class: o.join(" "),
 					"data-tokui-tag": "step"
 				}), c = t("div", { class: "tokui-step__circle" });
-				a.status === "error" || a.status === "danger" ? c.textContent = "✕" : r < i ? c.textContent = "✓" : c.textContent = String(r), s.appendChild(c);
-				let u = t("div", { class: "tokui-step__body" });
-				if (a.tt) {
+				i.status === "error" || i.status === "danger" ? c.textContent = "✕" : r < a ? c.textContent = "✓" : c.textContent = String(r), s.appendChild(c);
+				let l = t("div", { class: "tokui-step__body" });
+				if (i.tt) {
 					let e = t("div", { class: "tokui-step__title" });
-					e.textContent = a.tt, u.appendChild(e);
+					e.textContent = i.tt, l.appendChild(e);
 				}
 				if (e.content) {
 					let n = t("div", { class: "tokui-step__desc" });
-					n.textContent = e.content, u.appendChild(n);
+					n.textContent = e.content, l.appendChild(n);
 				}
-				s.appendChild(u), l.appendChild(s);
-			}), l._slot = l, l._tokuiType = "steps", l._currentStep = i;
-			function u(e) {
-				let t = l.querySelectorAll(":scope > .tokui-step"), n = e >= t.length;
-				n ? l.classList.add("tokui-steps--complete") : l.classList.remove("tokui-steps--complete"), t.forEach(function(t, r) {
+				s.appendChild(l), u.appendChild(s);
+			}), u._slot = u, u._tokuiType = "steps", u._currentStep = a;
+			function f(e) {
+				let t = u.querySelectorAll(":scope > .tokui-step"), n = e >= t.length;
+				n ? u.classList.add("tokui-steps--complete") : u.classList.remove("tokui-steps--complete"), t.forEach(function(t, r) {
 					let i = r + 1, a = t.querySelector(".tokui-step__circle"), o = t.getAttribute("data-step-status") === "error";
 					t.className = "tokui-step", o ? (t.classList.add("tokui-step--error"), i <= e && t.classList.add("tokui-step--current"), a && (a.textContent = "✕")) : n || i < e ? (t.classList.add("tokui-step--done"), a && (a.textContent = "✓")) : i === e ? (t.classList.add("tokui-step--active"), a && (a.textContent = String(i))) : (t.classList.add("tokui-step--pending"), a && (a.textContent = String(i)));
 				});
 			}
-			return l._streamCloseHook = function() {
-				u(l._currentStep);
-			}, l._update = function(e) {
+			return u._streamCloseHook = function() {
+				f(u._currentStep);
+			}, u._update = function(e) {
 				if (e.v !== void 0) {
 					var t = parseInt(e.v) || 1;
-					l._currentStep = t, u(t);
+					u._currentStep = t, f(t);
 				}
-			}, l;
+			}, u;
 		}), e.register("step", (e) => {
 			let n = e.attrs || {}, r = t("div", { class: "tokui-step tokui-step--pending" });
 			(n.status === "error" || n.status === "danger") && r.setAttribute("data-step-status", "error");
@@ -12623,14 +13105,14 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			}
 			return i;
 		}
-		e.register("carousel", (e, r) => {
-			var i = e.attrs || {}, a = i.thumb !== void 0, o = { class: "tokui-carousel" + (a ? " tokui-carousel--thumb" : "") };
-			i.id && (o.id = i.id), o["data-carousel"] = i.id || "carousel-" + Math.random().toString(36).slice(2, 8);
-			var s = t("div", o), c = t("div", { class: "tokui-carousel__viewport" }), l = t("div", { class: "tokui-carousel__track" });
-			function d(e) {
+		e.register("carousel", (r, i) => {
+			var a = r.attrs || {}, o = a.thumb !== void 0, s = { class: "tokui-carousel" + (o ? " tokui-carousel--thumb" : "") };
+			a.id && (s.id = a.id), s["data-carousel"] = a.id || "carousel-" + Math.random().toString(36).slice(2, 8);
+			var c = t("div", s), l = e.createReporter("carousel", a, c), d = t("div", { class: "tokui-carousel__viewport" }), f = t("div", { class: "tokui-carousel__track" });
+			function p(e) {
 				return e = String(e).trim(), /^\d+(\.\d+)?$/.test(e) ? e + "px" : e;
 			}
-			function f(e) {
+			function m(e) {
 				var t = String(e).split(":");
 				if (t.length === 2) {
 					var n = parseFloat(t[0]), r = parseFloat(t[1]);
@@ -12639,45 +13121,45 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				var i = parseFloat(e);
 				return i > 0 ? i : 0;
 			}
-			if (i.w && (s.style.width = d(i.w)), i.h) c.style.height = d(i.h), s.classList.add("tokui-carousel--sized");
-			else if (i.ratio) {
-				var p = f(i.ratio);
-				p && (c.style.aspectRatio = String(p), s.classList.add("tokui-carousel--sized"));
+			if (a.w && (c.style.width = p(a.w)), a.h) d.style.height = p(a.h), c.classList.add("tokui-carousel--sized");
+			else if (a.ratio) {
+				var h = m(a.ratio);
+				h && (d.style.aspectRatio = String(h), c.classList.add("tokui-carousel--sized"));
 			}
-			var m = (e.children || []).filter(function(e) {
+			var g = (r.children || []).filter(function(e) {
 				return e.type === "carousel-item" || e.type === "item" || e.type === "img";
 			});
-			m.forEach(function(e) {
-				if (e.type === "carousel-item" || e.type === "item") l.appendChild(u(e, r));
+			g.forEach(function(e) {
+				if (e.type === "carousel-item" || e.type === "item") f.appendChild(u(e, i));
 				else if (e.type === "img") {
 					var n = t("div", { class: "tokui-carousel__slide" });
-					r([e]).forEach(function(e) {
+					i([e]).forEach(function(e) {
 						e && e.nodeType && n.appendChild(e);
-					}), l.appendChild(n);
+					}), f.appendChild(n);
 				}
-			}), c.appendChild(l);
-			var h = t("button", {
+			}), d.appendChild(f);
+			var _ = t("button", {
 				class: "tokui-carousel__arrow tokui-carousel__arrow--prev",
 				"aria-label": n("layout.carouselPrev"),
 				"data-dir": "prev"
 			});
-			h.innerHTML = "<svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><polyline points=\"15 18 9 12 15 6\"/></svg>", c.appendChild(h);
-			var g = t("button", {
+			_.innerHTML = "<svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><polyline points=\"15 18 9 12 15 6\"/></svg>", d.appendChild(_);
+			var v = t("button", {
 				class: "tokui-carousel__arrow tokui-carousel__arrow--next",
 				"aria-label": n("layout.carouselNext"),
 				"data-dir": "next"
 			});
-			g.innerHTML = "<svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><polyline points=\"9 6 15 12 9 18\"/></svg>", c.appendChild(g), s.appendChild(c);
-			var _ = null, v = null, y = !1;
-			function b() {
-				return Array.prototype.filter.call(l.children, function(e) {
+			v.innerHTML = "<svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><polyline points=\"9 6 15 12 9 18\"/></svg>", d.appendChild(v), c.appendChild(d);
+			var y = null, b = null, x = !1;
+			function S() {
+				return Array.prototype.filter.call(f.children, function(e) {
 					return e && e.nodeType === 1 && /\btokui-carousel__slide\b/.test(e.className || "");
 				});
 			}
-			function x() {
-				if (!y) {
-					var e = b();
-					e.length && (y = !0, a ? (v = t("div", { class: "tokui-carousel__thumbs" }), e.forEach(function(e, r) {
+			function C() {
+				if (!x) {
+					var e = S();
+					e.length && (x = !0, o ? (b = t("div", { class: "tokui-carousel__thumbs" }), e.forEach(function(e, r) {
 						var i = e.querySelector("img"), a = i ? i.getAttribute("src") : "", o = e.querySelector(".tokui-carousel__slide-title"), s = o ? (o.textContent || "").trim() : "", c = t("button", {
 							class: "tokui-carousel__thumb" + (r === 0 ? " tokui-carousel__thumb--active" : ""),
 							"aria-label": n("layout.carouselIndex", { n: r + 1 }),
@@ -12690,21 +13172,21 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 							});
 							l.style.width = "100%", l.style.height = "100%", l.style.objectFit = "cover", c.appendChild(l);
 						} else c.textContent = String(r + 1);
-						v.appendChild(c);
-					}), s.appendChild(v)) : (_ = t("div", { class: "tokui-carousel__dots" }), e.forEach(function(e, r) {
+						b.appendChild(c);
+					}), c.appendChild(b)) : (y = t("div", { class: "tokui-carousel__dots" }), e.forEach(function(e, r) {
 						var i = t("button", {
 							class: "tokui-carousel__dot" + (r === 0 ? " tokui-carousel__dot--active" : ""),
 							"aria-label": n("layout.carouselIndex", { n: r + 1 }),
 							"data-index": String(r)
 						});
-						_.appendChild(i);
-					}), c.appendChild(_)));
+						y.appendChild(i);
+					}), d.appendChild(y)));
 				}
 			}
-			s._slot = l, s._tokuiType = "carousel";
-			function S() {
-				x();
-				var e = 0, t = b(), n = _ ? _.querySelectorAll(".tokui-carousel__dot") : [], r = v ? v.querySelectorAll(".tokui-carousel__thumb") : [], a = null;
+			c._slot = f, c._tokuiType = "carousel";
+			function w() {
+				C();
+				var e = 0, t = S(), n = y ? y.querySelectorAll(".tokui-carousel__dot") : [], r = b ? b.querySelectorAll(".tokui-carousel__thumb") : [], i = null;
 				function o() {
 					n.forEach && n.forEach(function(t, n) {
 						n === e ? t.classList.add("tokui-carousel__dot--active") : t.classList.remove("tokui-carousel__dot--active");
@@ -12716,69 +13198,69 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 						})) : t.classList.remove("tokui-carousel__thumb--active");
 					});
 				}
-				function c(n) {
-					n < 0 && (n = t.length - 1), n >= t.length && (n = 0), e = n, l.style.transform = "translateX(-" + e * 100 + "%)", o();
+				function s(n, r) {
+					n < 0 && (n = t.length - 1), n >= t.length && (n = 0), e = n, f.style.transform = "translateX(-" + e * 100 + "%)", o(), r && l("change", { index: e });
 				}
-				h.addEventListener("click", function() {
-					c(e - 1), d();
-				}), g.addEventListener("click", function() {
-					c(e + 1), d();
-				}), _ && _.addEventListener("click", function(e) {
+				_.addEventListener("click", function() {
+					s(e - 1, !0), d();
+				}), v.addEventListener("click", function() {
+					s(e + 1, !0), d();
+				}), y && y.addEventListener("click", function(e) {
 					var t = e.target.closest(".tokui-carousel__dot");
-					t && (c(parseInt(t.getAttribute("data-index"))), d());
-				}), v && v.addEventListener("click", function(e) {
+					t && (s(parseInt(t.getAttribute("data-index")), !0), d());
+				}), b && b.addEventListener("click", function(e) {
 					var t = e.target.closest(".tokui-carousel__thumb");
-					t && (c(parseInt(t.getAttribute("data-index"))), d());
+					t && (s(parseInt(t.getAttribute("data-index")), !0), d());
 				});
 				function u() {
-					var t = parseInt(i.auto);
-					t && t > 0 && (a = setInterval(function() {
-						c(e + 1);
+					var t = parseInt(a.auto);
+					t && t > 0 && (i = setInterval(function() {
+						s(e + 1);
 					}, t));
 				}
 				function d() {
-					a && clearInterval(a), u();
+					i && clearInterval(i), u();
 				}
-				u(), s.setAttribute("tabindex", "0"), s.addEventListener("keydown", function(t) {
-					t.key === "ArrowLeft" ? (c(e - 1), d()) : t.key === "ArrowRight" && (c(e + 1), d());
+				u(), c.setAttribute("tabindex", "0"), c.addEventListener("keydown", function(t) {
+					t.key === "ArrowLeft" ? (s(e - 1, !0), d()) : t.key === "ArrowRight" && (s(e + 1, !0), d());
 				});
-				var f = 0, p = 0, m = !1;
-				l.addEventListener("mousedown", function(e) {
-					m = !0, f = e.clientX, p = 0, l.style.transition = "none", d();
-				}), l.addEventListener("touchstart", function(e) {
-					m = !0, f = e.touches[0].clientX, p = 0, l.style.transition = "none", d();
+				var p = 0, m = 0, h = !1;
+				f.addEventListener("mousedown", function(e) {
+					h = !0, p = e.clientX, m = 0, f.style.transition = "none", d();
+				}), f.addEventListener("touchstart", function(e) {
+					h = !0, p = e.touches[0].clientX, m = 0, f.style.transition = "none", d();
 				}, { passive: !0 });
-				function y(t) {
-					if (m) {
-						p = t - f;
-						var n = -(e * s.offsetWidth) + p;
-						l.style.transform = "translateX(" + n + "px)";
+				function g(t) {
+					if (h) {
+						m = t - p;
+						var n = -(e * c.offsetWidth) + m;
+						f.style.transform = "translateX(" + n + "px)";
 					}
 				}
 				typeof document < "u" && document.addEventListener && (document.addEventListener("mousemove", function(e) {
-					y(e.clientX);
+					g(e.clientX);
 				}), document.addEventListener("touchmove", function(e) {
-					y(e.touches[0].clientX);
+					g(e.touches[0].clientX);
 				}, { passive: !0 }));
-				function S() {
-					if (m) {
-						m = !1, l.style.transition = "";
-						var t = s.offsetWidth * .2;
-						p < -t ? c(e + 1) : c(p > t ? e - 1 : e);
+				function x() {
+					if (h) {
+						h = !1, f.style.transition = "";
+						var t = c.offsetWidth * .2;
+						m < -t ? s(e + 1, !0) : m > t ? s(e - 1, !0) : s(e);
 					}
 				}
-				typeof document < "u" && document.addEventListener && (document.addEventListener("mouseup", S), document.addEventListener("touchend", S));
+				typeof document < "u" && document.addEventListener && (document.addEventListener("mouseup", x), document.addEventListener("touchend", x));
 			}
-			return m.length > 0 && S(), s._streamCloseHook = function() {
-				S();
-			}, s;
+			return g.length > 0 && w(), c._streamCloseHook = function() {
+				w();
+			}, c;
 		}), e.register("carousel-item", (e, t) => u(e, t)), e.register("tn", (e, n) => {
 			var r = e.attrs.leaf !== void 0, i = e.attrs.open !== void 0, a = e.attrs.dis !== void 0, o = t("div", {
 				class: "tokui-tree-node" + (r ? " tokui-tree-node--leaf" : "") + (i ? " tokui-tree-node--open" : "") + (a ? " tokui-tree-node--disabled" : ""),
 				role: "treeitem",
 				"aria-expanded": r ? void 0 : String(i)
 			});
-			o.setAttribute("data-value", e.attrs.v || ""), o.setAttribute("data-text", e.attrs.tx || e.attrs.v || "");
+			o.setAttribute("data-value", e.attrs.v || ""), o.setAttribute("data-text", e.attrs.tx || e.attrs.v || ""), e.attrs.id && o.setAttribute("data-id", e.attrs.id);
 			var s = t("div", {
 				class: "tokui-tree-node-header",
 				tabindex: "0"
@@ -12792,19 +13274,19 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 			return r || (d = t("div", { class: "tokui-tree-node-children" }), i || (d.style.display = "none"), e.children && e.children.length && n(e.children).forEach(function(e) {
 				e && e.nodeType && d.appendChild(e);
 			}), o.appendChild(d), o._slot = d), o._tokuiType = "tn", o;
-		}), e.register("tree", (e, n) => {
-			var r = e.attrs.chk !== void 0, i = e.attrs.dis !== void 0, a = t("div", { class: "tokui-field" });
-			e.attrs.l && a.appendChild(t("label", { class: "tokui-label" }, e.attrs.l)), e.attrs.id && (a.id = e.attrs.id);
-			var o = t("div", {
-				class: "tokui-tree" + (r ? " tokui-tree--checkable" : "") + (i ? " tokui-tree--disabled" : ""),
+		}), e.register("tree", (n, r) => {
+			var i = n.attrs.chk !== void 0, a = n.attrs.dis !== void 0, o = t("div", { class: "tokui-field" });
+			n.attrs.l && o.appendChild(t("label", { class: "tokui-label" }, n.attrs.l)), n.attrs.id && (o.id = n.attrs.id);
+			var s = t("div", {
+				class: "tokui-tree" + (i ? " tokui-tree--checkable" : "") + (a ? " tokui-tree--disabled" : ""),
 				role: "tree"
 			});
-			e.children && e.children.length && n(e.children).forEach(function(e) {
-				e && e.nodeType && o.appendChild(e);
-			}), a.appendChild(o);
-			var s = !1;
-			function c() {
-				i || s || (s = !0, o.addEventListener("click", function(e) {
+			n.children && n.children.length && r(n.children).forEach(function(e) {
+				e && e.nodeType && s.appendChild(e);
+			}), o.appendChild(s);
+			var c = e.createReporter("tree", n.attrs, o), l = !1;
+			function u() {
+				a || l || (l = !0, s.addEventListener("click", function(e) {
 					var t = e.target.closest(".tokui-tree-arrow");
 					if (t) {
 						e.stopPropagation();
@@ -12814,39 +13296,52 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 							r && (n.classList.contains("tokui-tree-node--open") ? (n.classList.remove("tokui-tree-node--open"), r.style.display = "none") : (n.classList.add("tokui-tree-node--open"), r.style.display = ""));
 						}
 					}
-				}), o.addEventListener("click", function(t) {
-					var n = t.target.closest(".tokui-tree-text");
-					if (n) {
-						t.stopPropagation();
-						var r = n.closest(".tokui-tree-node");
-						if (r && (o.querySelectorAll(".tokui-tree-node--selected").forEach(function(e) {
-							e.classList.remove("tokui-tree-node--selected");
-						}), r.classList.add("tokui-tree-node--selected"), e.attrs.clk)) {
-							var i = typeof window < "u" && window.TokUI && window.TokUI._internal && window.TokUI._internal.TokUIEventBus ? window.TokUI._internal.TokUIEventBus.getHandler(e.attrs.clk) : null;
-							i && i({
-								id: e.attrs.id,
+				}), s.addEventListener("click", function(e) {
+					var t = e.target.closest(".tokui-tree-text");
+					if (t) {
+						e.stopPropagation();
+						var r = t.closest(".tokui-tree-node");
+						if (r) {
+							if (s.querySelectorAll(".tokui-tree-node--selected").forEach(function(e) {
+								e.classList.remove("tokui-tree-node--selected");
+							}), r.classList.add("tokui-tree-node--selected"), n.attrs.clk) {
+								var i = typeof window < "u" && window.TokUI && window.TokUI._internal && window.TokUI._internal.TokUIEventBus ? window.TokUI._internal.TokUIEventBus.getHandler(n.attrs.clk) : null;
+								i && i({
+									id: n.attrs.id,
+									value: r.getAttribute("data-value"),
+									text: r.getAttribute("data-text")
+								});
+							}
+							c("change", {
 								value: r.getAttribute("data-value"),
-								text: r.getAttribute("data-text")
+								id: r.getAttribute("data-id") || void 0
 							});
 						}
 					}
-				}), r && (o.querySelectorAll(".tokui-tree-node-header").forEach(function(e) {
+				}), i && (s.querySelectorAll(".tokui-tree-node-header").forEach(function(e) {
 					var n = t("input", {
 						type: "checkbox",
 						class: "tokui-tree-checkbox"
 					}), r = e.closest(".tokui-tree-node");
 					r && r.classList.contains("tokui-tree-node--disabled") && (n.disabled = !0), e.insertBefore(n, e.firstChild);
-				}), o.addEventListener("change", function(e) {
+				}), s.addEventListener("change", function(e) {
 					if (e.target.classList.contains("tokui-tree-checkbox")) {
 						var t = e.target.closest(".tokui-tree-node");
 						if (t) {
 							var n = e.target.checked;
 							t.querySelectorAll(".tokui-tree-checkbox").forEach(function(t) {
 								t !== e.target && (t.checked = n, t.indeterminate = !1);
-							}), l(o);
+							}), d(s);
+							var r = [];
+							Array.prototype.forEach.call(s.querySelectorAll(".tokui-tree-checkbox"), function(e) {
+								if (e.checked) {
+									var t = e.closest(".tokui-tree-node");
+									t && r.push(t.getAttribute("data-value"));
+								}
+							}), c("check", { value: r });
 						}
 					}
-				})), o.addEventListener("keydown", function(e) {
+				})), s.addEventListener("keydown", function(e) {
 					var t = e.target.closest(".tokui-tree-node-header");
 					if (t) {
 						var n = t.closest(".tokui-tree-node");
@@ -12857,14 +13352,14 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 								r && !n.classList.contains("tokui-tree-node--leaf") && r.click();
 							} else if (e.key === "ArrowDown" || e.key === "ArrowUp") {
 								e.preventDefault();
-								var i = Array.from(o.querySelectorAll(":scope .tokui-tree-node-header")), a = i.indexOf(t);
+								var i = Array.from(s.querySelectorAll(":scope .tokui-tree-node-header")), a = i.indexOf(t);
 								e.key === "ArrowDown" && a < i.length - 1 ? i[a + 1].focus() : e.key === "ArrowUp" && a > 0 && i[a - 1].focus();
 							}
 						}
 					}
 				}));
 			}
-			function l(e) {
+			function d(e) {
 				e.querySelectorAll(".tokui-tree-node").forEach(function(e) {
 					var t = e.querySelector(":scope > .tokui-tree-node-children");
 					if (t) {
@@ -12881,34 +13376,52 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 					}
 				});
 			}
-			return e.children && e.children.length && c(), a._streamCloseHook = function() {
-				c();
-			}, a._slot = o, a._tokuiType = "tree", a._variantTarget = o, a;
-		}), e.register("menu", (e, n) => {
-			var r = e.attrs || {}, i = r.v || "vertical", a = ["tokui-menu"];
-			i === "horizontal" || i === "h" ? a.push("tokui-menu--horizontal") : i === "inline" && a.push("tokui-menu--inline");
-			var o = {
-				class: a.join(" "),
+			return n.children && n.children.length && u(), o._streamCloseHook = function() {
+				u();
+			}, o._slot = s, o._tokuiType = "tree", o._variantTarget = s, o;
+		}), e.register("menu", (n, r) => {
+			var i = n.attrs || {}, a = i.v || "vertical", o = ["tokui-menu"];
+			a === "horizontal" || a === "h" ? o.push("tokui-menu--horizontal") : a === "inline" && o.push("tokui-menu--inline");
+			var s = {
+				class: o.join(" "),
 				role: "menu"
 			};
-			r.id && (o.id = r.id);
-			var s = t("div", o);
-			r.bg && s.style.setProperty("--tokui-menu-bg", r.bg), r.fc && s.style.setProperty("--tokui-menu-fc", r.fc);
-			var c = r.act || "";
-			return (e.children || []).filter(function(e) {
+			i.id && (s.id = i.id);
+			var c = t("div", s);
+			i.bg && c.style.setProperty("--tokui-menu-bg", i.bg), i.fc && c.style.setProperty("--tokui-menu-fc", i.fc);
+			var l = i.act || "";
+			return (n.children || []).filter(function(e) {
 				return e.type === "menu-item";
 			}).forEach(function(e) {
-				var t = d(e, c);
-				s.appendChild(t);
-			}), s._slot = s, s._tokuiType = "menu", s._activeClk = c, s.addEventListener("keydown", function(e) {
+				var t = p(e, l);
+				c.appendChild(t);
+			}), c._slot = c, c._tokuiType = "menu", c._activeClk = l, c._report = e.createReporter("menu", i, c), c._update = function(e) {
+				if (!(e.act !== "activate" || e.v === void 0)) {
+					for (var t = c.querySelectorAll(".tokui-menu__item"), n = 0; n < t.length; n++) if (d(t[n]) === String(e.v)) {
+						f(t[n], !0);
+						break;
+					}
+				}
+			}, c.addEventListener("keydown", function(e) {
 				var t = e.target.closest(".tokui-menu__item");
 				if (t) {
-					var n = Array.from(s.querySelectorAll(".tokui-menu__item:not(.tokui-menu__item--disabled)")), r = n.indexOf(t);
+					var n = Array.from(c.querySelectorAll(".tokui-menu__item:not(.tokui-menu__item--disabled)")), r = n.indexOf(t);
 					e.key === "ArrowDown" && r < n.length - 1 ? (e.preventDefault(), n[r + 1].focus()) : e.key === "ArrowUp" && r > 0 ? (e.preventDefault(), n[r - 1].focus()) : (e.key === "Enter" || e.key === " ") && (e.preventDefault(), t.click());
 				}
-			}), s;
+			}), c;
 		});
-		function d(e, n) {
+		function d(e) {
+			if (e._menuValue !== void 0) return e._menuValue;
+			var t = e.querySelector(".tokui-menu__text");
+			return t ? t.textContent : e.textContent;
+		}
+		function f(e, t) {
+			var n = e.closest(".tokui-menu");
+			n && n.querySelectorAll(".tokui-menu__item--active").forEach(function(e) {
+				e.classList.remove("tokui-menu__item--active");
+			}), e.classList.add("tokui-menu__item--active"), !t && n && n._report && n._report("change", { value: d(e) });
+		}
+		function p(e, n) {
 			var r = e.attrs || {}, i = ["tokui-menu__item"];
 			r.dis !== void 0 && i.push("tokui-menu__item--disabled"), n && r.clk === n && i.push("tokui-menu__item--active");
 			var a = t("div", {
@@ -12921,11 +13434,8 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				a.appendChild(o);
 			}
 			var s = t("span", { class: "tokui-menu__text" }, r.tx || e.content || "");
-			return a.appendChild(s), r.clk && r.dis === void 0 && (a.setAttribute("data-tokui-clk", r.clk), a.addEventListener("click", function() {
-				var e = a.closest(".tokui-menu");
-				e && e.querySelectorAll(".tokui-menu__item--active").forEach(function(e) {
-					e.classList.remove("tokui-menu__item--active");
-				}), a.classList.add("tokui-menu__item--active");
+			return a.appendChild(s), a._menuValue = r.id || r.v || r.tx || e.content || "", r.dis === void 0 && (r.clk && a.setAttribute("data-tokui-clk", r.clk), a.addEventListener("click", function() {
+				f(a);
 			})), a;
 		}
 		e.register("menu-item", (e) => {
@@ -12936,11 +13446,8 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 				role: "menuitem",
 				tabindex: "0"
 			});
-			return n.i && i.appendChild(t("span", { class: "tokui-menu__icon" }, n.i)), i.appendChild(t("span", { class: "tokui-menu__text" }, n.tx || e.content || "")), n.clk && n.dis === void 0 && (i.setAttribute("data-tokui-clk", n.clk), i.addEventListener("click", function() {
-				var e = i.closest(".tokui-menu");
-				e && e.querySelectorAll(".tokui-menu__item--active").forEach(function(e) {
-					e.classList.remove("tokui-menu__item--active");
-				}), i.classList.add("tokui-menu__item--active");
+			return n.i && i.appendChild(t("span", { class: "tokui-menu__icon" }, n.i)), i.appendChild(t("span", { class: "tokui-menu__text" }, n.tx || e.content || "")), i._menuValue = n.id || n.v || n.tx || e.content || "", n.dis === void 0 && (n.clk && i.setAttribute("data-tokui-clk", n.clk), i.addEventListener("click", function() {
+				f(i);
 			})), i;
 		}), e.register("resizable", (e, n) => {
 			var r = e.attrs || {}, i = r.dir || "h", a = parseInt(r.min) || 100, o = parseInt(r.max) || 800, s = parseInt(r.default) || 300, c = i !== "v", l = ["tokui-resizable"];
@@ -13089,7 +13596,11 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 					locale: null,
 					streaming: !0,
 					onEvent: null
-				}, e), this.renderer = new n(i), s(this.renderer), this.parser = null, this.container = null, this.streamingContainer = null, this._lastDsl = null, this._lastTarget = null, this.options.locale && o && o.setLocale(this.options.locale), this.options.container && typeof document < "u" && (this.container = typeof this.options.container == "string" ? document.querySelector(this.options.container) : this.options.container, a.init(this.container), this.options.theme && a.setTheme(this.options.theme)), typeof window < "u" && (window.TokUI._instance = this, window.TokUI._internal.el = r, window.TokUI.registerHandler = i.registerHandler.bind(i), window.TokUI.setTheme = a.setTheme.bind(a), o && (window.TokUI.setLocale = o.setLocale.bind(o), window.TokUI.getLocale = o.getLocale.bind(o), window.TokUI.registerLocale = o.registerLocale.bind(o)), window.TokUI.showNotification || (window.TokUI.showNotification = function() {}));
+				}, e), this.renderer = new n(i), s(this.renderer), this.renderer._tokuiInstance = this;
+				var t = this;
+				this.renderer._onComponentEvent = function(e) {
+					t.options.eventFilter && !t.options.eventFilter(e) || t.options.onEvent && t.options.onEvent("component", e);
+				}, this.parser = null, this.container = null, this.streamingContainer = null, this._lastDsl = null, this._lastTarget = null, this.options.locale && o && o.setLocale(this.options.locale), this.options.container && typeof document < "u" && (this.container = typeof this.options.container == "string" ? document.querySelector(this.options.container) : this.options.container, a.init(this.container), this.options.theme && a.setTheme(this.options.theme)), typeof window < "u" && (window.TokUI._instance = this, window.TokUI._internal.el = r, window.TokUI.registerHandler = i.registerHandler.bind(i), window.TokUI.setTheme = a.setTheme.bind(a), o && (window.TokUI.setLocale = o.setLocale.bind(o), window.TokUI.getLocale = o.getLocale.bind(o), window.TokUI.registerLocale = o.registerLocale.bind(o)), window.TokUI.showNotification || (window.TokUI.showNotification = function() {}));
 			}
 			render(t, n) {
 				let r = n || this.container;