@xihan-ui/web-components 1.0.0 → 2.0.0

package/dist/services.js

@@ -0,0 +1,701 @@
+import { m as withXhConfig, n as createLitRuntime, s as wcNormalize } from "./machine-controller-C1ffftux.js";
+import { t as defineElement } from "./registry-DR6I2_zF.js";
+import { n as version } from "./element-BKQR3ce3.js";
+import { a as XhDialogElement, i as XhLoadingBarElement, n as XhNotificationElement, r as XhNotificationItemElement, s as XhButtonElement, t as XhToastElement } from "./toast-BTlM12YF.js";
+import { NOTIFICATION_PLACEMENT, NOTIFICATION_PLACEMENTS, TOAST_GAP, TOAST_MAX, TOAST_PLACEMENT, connectNotification, createDialogServiceController, createFeedbackServiceController, createLoadingBarServiceController, createToastStackController, dialogServiceBadgeTone, notificationMachine, resolveFeedbackServiceTitle, resolveToastServiceItem, toastAnatomy, visibleNotifications } from "@xihan-ui/headless";
+import { DATA_INERT_EXEMPT, DIAGNOSTIC_CODES, createService, ensurePortalRoot, reportDiagnostic } from "@xihan-ui/core";
+//#region src/services/glyph.ts
+const SVG_NS = "http://www.w3.org/2000/svg";
+/** 旋转的加载弧线；转动动画由外层容器（如按钮的 indicator 部件）提供。 */
+function spinArc(size = "1em") {
+	const svg = document.createElementNS(SVG_NS, "svg");
+	svg.setAttribute("viewBox", "0 0 16 16");
+	svg.setAttribute("width", size);
+	svg.setAttribute("height", size);
+	svg.setAttribute("aria-hidden", "true");
+	svg.style.display = "block";
+	const circle = document.createElementNS(SVG_NS, "circle");
+	circle.setAttribute("cx", "8");
+	circle.setAttribute("cy", "8");
+	circle.setAttribute("r", "6.5");
+	circle.setAttribute("fill", "none");
+	circle.setAttribute("stroke", "currentColor");
+	circle.setAttribute("stroke-width", "2");
+	circle.setAttribute("stroke-linecap", "round");
+	circle.setAttribute("stroke-dasharray", "30");
+	circle.setAttribute("stroke-dashoffset", "22");
+	svg.appendChild(circle);
+	return svg;
+}
+//#endregion
+//#region src/services/host.ts
+/**
+* 命令式服务的宿主容器。未提供 target 时在浮层落点下新建一个，dispose 时连同容器一起移除。
+*/
+function createServiceHolder(target) {
+	if (target) return {
+		holder: target,
+		release: () => {}
+	};
+	const holder = document.createElement("div");
+	ensurePortalRoot(document).appendChild(holder);
+	return {
+		holder,
+		release: () => holder.remove()
+	};
+}
+/**
+* 供没有元素的状态机使用的最小反应宿主。
+*
+* 轻提示的堆叠在库中没有对应的自定义元素（堆叠位置是整个服务的口径，
+* 不是逐页各挂一份），因此队列状态机没有可依附的元素。状态机只要求宿主在状态变化时
+* 被唤醒一次，这里就只兑现这一件事：把重绘排进微任务，同一拍内的多次写入合并为一次。
+*/
+function createServiceReactiveHost(render) {
+	let scheduled = false;
+	let settle = null;
+	let pending = null;
+	const flush = () => {
+		scheduled = false;
+		const done = settle;
+		settle = null;
+		pending = null;
+		render();
+		done?.();
+	};
+	return {
+		addController: () => {},
+		removeController: () => {},
+		requestUpdate: () => {
+			if (scheduled) return;
+			scheduled = true;
+			queueMicrotask(flush);
+		},
+		get updateComplete() {
+			if (!scheduled) return Promise.resolve(true);
+			pending ??= new Promise((resolve) => {
+				settle = () => resolve(!scheduled);
+			});
+			return pending;
+		}
+	};
+}
+/**
+* 服务无法建立时发一条诊断并返回 false，由调用方整体惰化。
+*
+* 这几个服务是从路由守卫、请求拦截器等位置懒建的：这些位置抛异常，
+* 后果不是提示未弹出而是整次导航失败、整站白屏。一条轻提示不应有这种权力。
+*/
+function reportServiceFailure(service, error) {
+	reportDiagnostic({
+		code: DIAGNOSTIC_CODES.warn,
+		level: "warn",
+		message: `[xh] ${service} 的宿主没建起来，这个服务本次退化成空操作。`,
+		detail: {
+			service,
+			error
+		}
+	});
+	return false;
+}
+/** 建一个带角色标记的节点：作者在声明式用法里手写的那一份，服务自己生成。 */
+function partNode(tag, part) {
+	const el = document.createElement(tag);
+	el.dataset.xhPart = part;
+	return el;
+}
+//#endregion
+//#region src/services/register.ts
+/**
+* 服务用到的那几个元素在服务建起来时注册。
+*
+* 服务自己生成节点，作者不写标签，因此不能要求他先 import `/define`；
+* 注册表是幂等的，已经注册过的原样跳过。
+*/
+function defineFeedbackElements() {
+	defineElement("xh-toast", XhToastElement, version);
+	defineElement("xh-notification", XhNotificationElement, version);
+	defineElement("xh-notification-item", XhNotificationItemElement, version);
+	defineElement("xh-dialog", XhDialogElement, version);
+	defineElement("xh-button", XhButtonElement, version);
+	defineElement("xh-loading-bar", XhLoadingBarElement, version);
+}
+//#endregion
+//#region src/services/dialog-service.ts
+function createDialogService(options = {}) {
+	if (typeof document === "undefined") throw new Error("createDialogService 需要 document；SSR 里请等到客户端再创建");
+	const defaults = {
+		okText: options.okText ?? "OK",
+		cancelText: options.cancelText ?? "Cancel"
+	};
+	const holder = options.target ?? document.createElement("div");
+	const release = () => {
+		if (!options.target) holder.remove();
+	};
+	let hostFailure = null;
+	try {
+		defineFeedbackElements();
+		if (!options.target) ensurePortalRoot(document).appendChild(holder);
+		if (holder.nodeType !== 1 || holder.ownerDocument !== document || !holder.isConnected) throw new Error("DialogService target 必须是当前文档中已连接的元素");
+	} catch (cause) {
+		hostFailure = { cause };
+	}
+	const dialog = document.createElement("xh-dialog");
+	dialog.setAttribute("role", "alertdialog");
+	dialog.modal = true;
+	const backdrop = partNode("div", "backdrop");
+	const positioner = partNode("div", "positioner");
+	const content = partNode("div", "content");
+	const header = partNode("div", "header");
+	const indicator = partNode("div", "indicator");
+	const title = partNode("div", "title");
+	const body = partNode("div", "body");
+	const description = partNode("div", "description");
+	const errorMessage = document.createElement("p");
+	errorMessage.setAttribute("role", "alert");
+	errorMessage.style.color = "var(--xh-fg-danger)";
+	errorMessage.hidden = true;
+	const footer = partNode("div", "footer");
+	const cancel = document.createElement("xh-button");
+	const cancelRoot = partNode("button", "root");
+	const cancelLabel = partNode("span", "label");
+	const ok = document.createElement("xh-button");
+	const okRoot = partNode("button", "root");
+	const okIndicator = partNode("span", "indicator");
+	const okLabel = partNode("span", "label");
+	header.append(indicator, title);
+	body.append(description, errorMessage);
+	cancelRoot.append(cancelLabel);
+	cancel.append(cancelRoot);
+	cancel.variant = "ghost";
+	okRoot.append(okIndicator, okLabel);
+	ok.append(okRoot);
+	ok.variant = "solid";
+	footer.append(cancel, ok);
+	content.append(header, body, footer);
+	positioner.append(content);
+	dialog.append(backdrop, positioner);
+	const controller = createDialogServiceController({ onStateChange: () => paint() });
+	if (!hostFailure) try {
+		holder.appendChild(dialog);
+	} catch (cause) {
+		hostFailure = { cause };
+		release();
+	}
+	function paintContent() {
+		const serviceState = controller.state;
+		const spec = serviceState.current?.spec;
+		if (!spec) return;
+		title.textContent = spec.title;
+		indicator.hidden = spec.badge == null;
+		if (spec.badge) indicator.setAttribute("data-tone", dialogServiceBadgeTone(spec.badge));
+		else indicator.removeAttribute("data-tone");
+		if (typeof spec.content === "function") {
+			description.replaceChildren();
+			spec.content(description);
+		} else description.textContent = spec.content ?? "";
+		cancel.hidden = !spec.showCancel;
+		cancel.disabled = serviceState.busy;
+		cancelLabel.textContent = spec.cancelText;
+		ok.tone = spec.tone;
+		ok.loading = serviceState.busy;
+		okIndicator.replaceChildren(...serviceState.busy ? [spinArc()] : []);
+		okLabel.textContent = serviceState.busy ? `${spec.okText}…` : spec.okText;
+		errorMessage.hidden = serviceState.actionError === null;
+		errorMessage.textContent = serviceState.actionError ? options.actionErrorText ?? "Action failed. Please try again." : "";
+		dialog.closeOnEscape = !serviceState.busy;
+	}
+	function failHost(cause) {
+		controller.fail(cause);
+	}
+	let exitRequest = null;
+	let exitListener = null;
+	function syncExitListener() {
+		const request = controller.state.exiting;
+		if (request === exitRequest) return;
+		if (exitListener) dialog.removeEventListener("exit-complete", exitListener);
+		exitRequest = request;
+		exitListener = request ? () => void controller.finishExit(request) : null;
+		if (exitListener) dialog.addEventListener("exit-complete", exitListener, { once: true });
+	}
+	function paint() {
+		try {
+			paintContent();
+			syncExitListener();
+			dialog.open = controller.state.open;
+		} catch (cause) {
+			failHost(cause);
+		}
+	}
+	if (hostFailure) controller.fail(hostFailure.cause);
+	const onOpenChange = (event) => {
+		if (event.detail?.open) return;
+		controller.close(false);
+	};
+	dialog.addEventListener("open-change", onOpenChange);
+	const onCancel = () => {
+		if (!controller.state.busy) controller.close(false);
+	};
+	const onOk = () => {
+		controller.confirmCurrent();
+	};
+	cancelRoot.addEventListener("click", onCancel);
+	okRoot.addEventListener("click", onOk);
+	const alert = (badge, tone) => async (opts) => {
+		await controller.request({
+			title: opts.title,
+			content: opts.content,
+			tone,
+			okText: opts.okText ?? defaults.okText,
+			cancelText: defaults.cancelText,
+			showCancel: false,
+			badge,
+			onOk: opts.onOk,
+			onActionError: opts.onActionError
+		});
+	};
+	return {
+		get actionError() {
+			return controller.state.actionError;
+		},
+		confirm: (opts) => controller.request({
+			title: opts.title,
+			content: opts.content,
+			tone: opts.tone ?? "brand",
+			okText: opts.okText ?? defaults.okText,
+			cancelText: opts.cancelText ?? defaults.cancelText,
+			showCancel: true,
+			badge: opts.badge,
+			onOk: opts.onOk,
+			onActionError: opts.onActionError
+		}),
+		info: alert("info", "info"),
+		success: alert("success", "success"),
+		warning: alert("warning", "warning"),
+		error: alert("error", "danger"),
+		dispose: () => {
+			controller.dispose();
+			dialog.removeEventListener("open-change", onOpenChange);
+			if (exitListener) dialog.removeEventListener("exit-complete", exitListener);
+			cancelRoot.removeEventListener("click", onCancel);
+			okRoot.removeEventListener("click", onOk);
+			dialog.remove();
+			release();
+		}
+	};
+}
+//#endregion
+//#region src/services/loading-bar-service.ts
+function createLoadingBarService(options = {}) {
+	if (typeof document === "undefined") throw new Error("createLoadingBarService 需要 document；SSR 里请等到客户端再创建");
+	defineFeedbackElements();
+	const { target, tone = "brand", errorTone = "danger", translations, ...barProps } = options;
+	const { holder, release } = createServiceHolder(target);
+	const bar = document.createElement("xh-loading-bar");
+	const root = partNode("div", "root");
+	const track = partNode("div", "track");
+	const range = partNode("div", "range");
+	track.appendChild(range);
+	root.appendChild(track);
+	bar.appendChild(root);
+	bar.height = barProps.height;
+	bar.trickle = barProps.trickle;
+	bar.trickleSpeed = barProps.trickleSpeed;
+	bar.minimum = barProps.minimum;
+	bar.fadeDuration = barProps.fadeDuration;
+	bar.translations = translations;
+	let mounted = true;
+	try {
+		holder.appendChild(bar);
+	} catch (error) {
+		mounted = reportServiceFailure("loading-bar", error);
+		release();
+	}
+	const apply = (state) => {
+		bar.tone = state.tone;
+		bar.value = state.value;
+		bar.loading = state.pending > 0;
+	};
+	const controller = createLoadingBarServiceController({
+		tone,
+		errorTone,
+		onStateChange: apply
+	});
+	if (!mounted) controller.dispose();
+	return {
+		start: controller.start,
+		finish: controller.finish,
+		error: controller.error,
+		finishAll: controller.finishAll,
+		set: controller.set,
+		dispose: () => {
+			controller.dispose();
+			bar.remove();
+			release();
+		}
+	};
+}
+//#endregion
+//#region src/services/notification-service.ts
+function createNotificationService(options = {}) {
+	if (typeof document === "undefined") throw new Error("createNotificationService 需要 document；SSR 里请等到客户端再创建");
+	defineFeedbackElements();
+	const { target, translations, ...queueProps } = options;
+	const { holder, release } = createServiceHolder(target);
+	const queue = document.createElement("xh-notification");
+	const root = partNode("div", "root");
+	queue.appendChild(root);
+	const groups = /* @__PURE__ */ new Map();
+	const nodes = /* @__PURE__ */ new Map();
+	const shapes = /* @__PURE__ */ new Map();
+	let mounted = true;
+	const controller = createFeedbackServiceController({
+		name: "notification",
+		dismissOnUnmounted: false,
+		onStateChange: () => render()
+	});
+	queue.placement = queueProps.placement;
+	queue.max = queueProps.max;
+	queue.dedupe = queueProps.dedupe;
+	queue.gap = queueProps.gap;
+	queue.duration = queueProps.duration;
+	queue.removeDelay = queueProps.removeDelay;
+	queue.pauseOnPageIdle = queueProps.pauseOnPageIdle;
+	queue.translations = translations;
+	ensureGroup(queueProps.placement ?? NOTIFICATION_PLACEMENT).hidden = true;
+	try {
+		holder.appendChild(queue);
+	} catch (error) {
+		mounted = reportServiceFailure("notification", error);
+		release();
+	}
+	if (mounted) controller.attach({
+		create: (opts) => queue.create(opts),
+		update: (id, opts) => queue.updateItem(id, opts),
+		dismiss: (id) => queue.dismiss(id),
+		dismissAll: () => queue.dismissAll()
+	});
+	/**
+	* 堆叠区。每个位置一个，按九宫格固定顺序插入 root：
+	* 不按出现次序，否则同一批通知更换先后就会让整块界面重排。
+	*/
+	function ensureGroup(placement) {
+		const existing = groups.get(placement);
+		if (existing) return existing;
+		const group = partNode("div", "group");
+		group.setAttribute("placement", placement);
+		groups.set(placement, group);
+		const order = NOTIFICATION_PLACEMENTS.indexOf(placement);
+		const after = NOTIFICATION_PLACEMENTS.slice(order + 1).map((name) => groups.get(name)).find((node) => node != null);
+		root.insertBefore(group, after ?? null);
+		return group;
+	}
+	function ensureNode(item) {
+		let node = nodes.get(item.id);
+		if (!node) {
+			node = document.createElement("xh-notification-item");
+			nodes.set(item.id, node);
+		}
+		const shape = `${item.closable ? "c" : ""}${item.actionLabel ? "a" : ""}`;
+		if (shapes.get(item.id) !== shape) {
+			shapes.set(item.id, shape);
+			const card = partNode("div", "item");
+			card.appendChild(partNode("div", "item-indicator"));
+			card.appendChild(partNode("div", "item-title"));
+			card.appendChild(partNode("div", "item-description"));
+			if (item.actionLabel) card.appendChild(partNode("button", "item-action-trigger"));
+			if (item.closable) card.appendChild(partNode("button", "item-close-trigger"));
+			node.replaceChildren(card);
+		}
+		const action = node.querySelector("[data-xh-part=\"item-action-trigger\"]");
+		if (action && action.textContent !== (item.actionLabel ?? "")) action.textContent = item.actionLabel ?? "";
+		node.itemId = item.id;
+		node.titleText = resolveFeedbackServiceTitle(item);
+		node.description = item.description;
+		node.tone = item.tone;
+		node.loading = item.loading;
+		node.duration = item.duration;
+		node.removeDelay = item.removeDelay;
+		node.closable = item.closable;
+		node.pauseOnPageIdle = item.pauseOnPageIdle;
+		node.paused = controller.state.paused;
+		node.translations = translations;
+		return node;
+	}
+	function render() {
+		if (!mounted) return;
+		const items = queue.visibleNotifications;
+		controller.syncItems(items.map((item) => item.id));
+		const living = new Set(items.map((item) => item.id));
+		for (const [id, node] of nodes) {
+			if (living.has(id)) continue;
+			node.remove();
+			nodes.delete(id);
+			shapes.delete(id);
+		}
+		for (const placement of queue.placements) ensureGroup(placement);
+		for (const [placement, group] of groups) {
+			const list = queue.getItemsByPlacement(placement);
+			group.hidden = list.length === 0;
+			let previous = null;
+			for (const item of list) {
+				const node = ensureNode(item);
+				const anchor = previous ? previous.nextElementSibling : group.firstElementChild;
+				if (anchor !== node) group.insertBefore(node, anchor);
+				previous = node;
+			}
+		}
+	}
+	/** 队列一变化就重绘。元素自己发出该事件，服务不必再监视状态机。 */
+	const onItems = () => render();
+	/** 走完退场的那条从队列里删掉；元素自己也收这条，这里只清回调表。 */
+	const onStatus = (event) => {
+		const detail = event.detail;
+		if (detail?.status === "unmounted") controller.unmounted(detail.id);
+	};
+	const onPress = (event) => {
+		const el = event.target;
+		if (el?.tagName.toLowerCase() !== "xh-notification-item") return;
+		const id = el.itemId;
+		if (id) controller.invokeAction(id);
+	};
+	queue.addEventListener("items-change", onItems);
+	queue.addEventListener("status-change", onStatus);
+	queue.addEventListener("action", onPress);
+	/** 入队一条；回调另存一张表，队列记录里只留文案。 */
+	const create = (opts = {}) => {
+		const { onAction, ...record } = opts;
+		const id = controller.create(record, onAction);
+		render();
+		return id;
+	};
+	const sugar = (tone) => (title, opts = {}) => create({
+		...opts,
+		tone,
+		title
+	});
+	return {
+		create,
+		update: (id, opts) => {
+			controller.update(id, opts);
+			render();
+		},
+		dismiss: (id) => {
+			controller.dismiss(id);
+			render();
+		},
+		dismissAll: () => {
+			controller.dismissAll();
+			render();
+		},
+		info: sugar("info"),
+		success: sugar("success"),
+		warning: sugar("warning"),
+		danger: sugar("danger"),
+		pauseAll: controller.pauseAll,
+		resumeAll: controller.resumeAll,
+		dispose: () => {
+			mounted = false;
+			queue.removeEventListener("items-change", onItems);
+			queue.removeEventListener("status-change", onStatus);
+			queue.removeEventListener("action", onPress);
+			controller.dispose();
+			nodes.clear();
+			shapes.clear();
+			groups.clear();
+			queue.remove();
+			release();
+		}
+	};
+}
+//#endregion
+//#region src/services/toast-service.ts
+const parts = toastAnatomy.build();
+function createToastService(options = {}) {
+	if (typeof document === "undefined") throw new Error("createToastService 需要 document；SSR 里请等到客户端再创建");
+	defineFeedbackElements();
+	const { target, placement = TOAST_PLACEMENT, gap = TOAST_GAP, max = TOAST_MAX, dedupe, toastTranslations, ...defaults } = options;
+	const serviceDefaults = {
+		...defaults,
+		pauseOnPageIdle: defaults.pauseOnPageIdle ?? true
+	};
+	const { holder, release } = createServiceHolder(target);
+	const group = document.createElement("div");
+	for (const [name, value] of Object.entries(parts.group.attrs)) group.setAttribute(name, String(value));
+	group.setAttribute("data-placement", placement);
+	group.setAttribute(DATA_INERT_EXEMPT, "");
+	holder.appendChild(group);
+	const nodes = /* @__PURE__ */ new Map();
+	const shapes = /* @__PURE__ */ new Map();
+	const controller = createFeedbackServiceController({
+		name: "toast",
+		idPrefix: "toast",
+		onStateChange: () => render()
+	});
+	const stack = createToastStackController({
+		group,
+		gap,
+		placement,
+		onInteractionChange: (active) => active ? controller.pauseAll() : controller.resumeAll()
+	});
+	const machineProps = () => withXhConfig("notification", {
+		placement,
+		max,
+		dedupe,
+		duration: serviceDefaults.duration,
+		removeDelay: serviceDefaults.removeDelay,
+		pauseOnPageIdle: serviceDefaults.pauseOnPageIdle
+	}, holder);
+	const runtime = createLitRuntime(createServiceReactiveHost(() => render()));
+	let service = null;
+	try {
+		service = createService(notificationMachine, {
+			props: machineProps,
+			runtime
+		});
+		runtime.mount();
+	} catch (error) {
+		reportServiceFailure("toast", error);
+		service = null;
+		release();
+	}
+	const api = () => service ? connectNotification(service, wcNormalize) : null;
+	if (service) controller.attach({
+		create: (opts) => api().create(opts),
+		update: (id, opts) => api().update(id, opts),
+		dismiss: (id) => api().dismiss(id),
+		dismissAll: () => api().dismissAll()
+	});
+	function ensureNode(item) {
+		const resolved = resolveToastServiceItem(item, serviceDefaults);
+		let node = nodes.get(item.id);
+		if (!node) {
+			node = document.createElement("xh-toast");
+			nodes.set(item.id, node);
+		}
+		const shape = `${resolved.closable ? "c" : ""}${resolved.actionLabel ? "a" : ""}${resolved.description ? "d" : ""}`;
+		if (shapes.get(item.id) !== shape) {
+			shapes.set(item.id, shape);
+			const root = partNode("div", "root");
+			root.appendChild(partNode("span", "indicator"));
+			const content = partNode("div", "content");
+			content.appendChild(partNode("div", "title"));
+			if (resolved.description) content.appendChild(partNode("div", "description"));
+			root.appendChild(content);
+			if (resolved.actionLabel) root.appendChild(partNode("button", "action-trigger"));
+			if (resolved.closable) root.appendChild(partNode("button", "close-trigger"));
+			node.replaceChildren(root);
+		}
+		const action = node.querySelector("[data-xh-part=\"action-trigger\"]");
+		if (action && action.textContent !== (resolved.actionLabel ?? "")) action.textContent = resolved.actionLabel ?? "";
+		node.toastId = resolved.id;
+		node.titleText = resolved.title;
+		node.descriptionText = resolved.description;
+		node.tone = resolved.tone;
+		node.loading = resolved.loading;
+		node.duration = resolved.duration;
+		node.removeDelay = resolved.removeDelay;
+		node.closable = resolved.closable;
+		node.pauseOnPageIdle = resolved.pauseOnPageIdle;
+		node.paused = controller.state.paused;
+		node.translations = toastTranslations;
+		return node;
+	}
+	/** 队列里没有的节点撤掉，剩下的按记录刷一遍属性并排到该在的位置。 */
+	function render() {
+		if (!service) return;
+		const items = visibleNotifications(service.context.get("items"), max, placement);
+		controller.syncItems(items.map((item) => item.id));
+		const living = new Set(items.map((item) => item.id));
+		for (const [id, node] of nodes) {
+			if (living.has(id)) continue;
+			node.remove();
+			nodes.delete(id);
+			shapes.delete(id);
+		}
+		group.setAttribute("data-count", String(items.length));
+		group.toggleAttribute("hidden", items.length === 0);
+		let previous = null;
+		for (const item of items) {
+			const node = ensureNode(item);
+			const anchor = previous ? previous.nextElementSibling : group.firstElementChild;
+			if (anchor !== node) group.insertBefore(node, anchor);
+			previous = node;
+		}
+	}
+	/** 走完退场的那条从队列里删掉。 */
+	const onStatus = (event) => {
+		if (event.target?.tagName.toLowerCase() !== "xh-toast") return;
+		const detail = event.detail;
+		if (detail?.status === "unmounted") controller.unmounted(detail.id);
+	};
+	/** 行内动作按 id 现查那张回调表。 */
+	const onPress = (event) => {
+		if (event.target?.tagName.toLowerCase() !== "xh-toast") return;
+		const detail = event.detail;
+		if (detail?.id) controller.invokeAction(detail.id);
+	};
+	group.addEventListener("status-change", onStatus);
+	group.addEventListener("action", onPress);
+	/** 入队一条；回调另存一张表，队列记录里只留文案。 */
+	const create = (opts = {}) => {
+		const { onAction, ...record } = opts;
+		return controller.create(record, onAction);
+	};
+	const sugar = (tone) => (message, opts = {}) => create({
+		...opts,
+		tone,
+		title: message
+	});
+	return {
+		create,
+		update: controller.update,
+		dismiss: controller.dismiss,
+		dismissAll: controller.dismissAll,
+		info: sugar("info"),
+		success: sugar("success"),
+		warning: sugar("warning"),
+		danger: sugar("danger"),
+		loading: (message, opts = {}) => create({
+			...opts,
+			loading: true,
+			title: message
+		}),
+		promise: (input, opts) => {
+			const { loading, success, error, ...rest } = opts;
+			const running = typeof input === "function" ? input() : input;
+			const { onAction, ...record } = rest;
+			return controller.trackPromise(running, {
+				...record,
+				loading: true,
+				title: loading
+			}, (value) => ({
+				loading: false,
+				tone: "success",
+				title: typeof success === "function" ? success(value) : success
+			}), (reason) => ({
+				loading: false,
+				tone: "danger",
+				title: typeof error === "function" ? error(reason) : error
+			}), onAction);
+		},
+		pauseAll: controller.pauseAll,
+		resumeAll: controller.resumeAll,
+		dispose: () => {
+			stack.dispose();
+			group.removeEventListener("status-change", onStatus);
+			group.removeEventListener("action", onPress);
+			controller.dispose();
+			runtime.unmount();
+			service = null;
+			nodes.clear();
+			shapes.clear();
+			group.remove();
+			release();
+		}
+	};
+}
+//#endregion
+export { createDialogService, createLoadingBarService, createNotificationService, createToastService };
+
+//# sourceMappingURL=services.js.map