@tanzerfe/page-use 0.0.2

package/dist/src-C8EWDZVz.mjs

@@ -0,0 +1,2693 @@
+import { PageAgent } from "page-agent";
+import { LitElement, css, html, nothing } from "lit";
+import { keyed } from "lit/directives/keyed.js";
+
+//#region src/core/siteMap.ts
+/** 去掉 `#`、前导 `/` 与查询串，得到用于比较的路径 */
+function normalizePath(path) {
+	return path.replace(/^#/, "").replace(/^\/+/, "").split("?")[0].replace(/\/+$/, "");
+}
+/** 菜单 path → 页面 URL 中可见的形式：hash 模式 `#/a/b`，history 模式 `/a/b` */
+function toDisplayPath(path, mode) {
+	const normalized = `/${normalizePath(path)}`;
+	return mode === "hash" ? `#${normalized}` : normalized;
+}
+function visibleChildren(node) {
+	return (node.children || []).filter((child) => !child.hidden);
+}
+function renderNodes(nodes, depth, mode, lines) {
+	const indent = "  ".repeat(depth);
+	for (const node of nodes) {
+		if (node.hidden) continue;
+		const children = visibleChildren(node);
+		if (children.length) {
+			lines.push(`${indent}- 「${node.label}」（分组菜单，点击后展开下级）`);
+			renderNodes(children, depth + 1, mode, lines);
+		} else if (node.path !== void 0) lines.push(`${indent}- 「${node.label}」 → ${toDisplayPath(node.path, mode)}`);
+		else lines.push(`${indent}- 「${node.label}」`);
+	}
+}
+/** 生成菜单树文本；菜单为空时返回空串 */
+function buildSiteMapText(menus, mode = "hash") {
+	const lines = [];
+	renderNodes(menus || [], 0, mode, lines);
+	return lines.join("\n");
+}
+/** 由路径反查菜单节点（用于按页提示） */
+function findMenuByPath(path, menus) {
+	const target = normalizePath(path);
+	const walk = (list) => {
+		for (const node of list) {
+			if (node.path !== void 0 && normalizePath(node.path) === target) return node;
+			if (node.children?.length) {
+				const found = walk(node.children);
+				if (found) return found;
+			}
+		}
+	};
+	return walk(menus || []);
+}
+
+//#endregion
+//#region src/core/pageInstructions.ts
+/** 未提供 layoutHint 时的通用页面结构描述 */
+const DEFAULT_LAYOUT_HINT = ["- 页面通常由导航菜单与内容区组成；内容区顶部若有面包屑或标题，可用来确认当前位置。", "- 分组菜单点击后展开/收起下级；叶子菜单点击后进入页面。"].join("\n");
+/** 全局系统提示：站点结构 + 交互约定 + 安全边界 */
+function buildSystemInstruction(options) {
+	const urlLabel = options.routerMode === "hash" ? "URL hash" : "URL 路径";
+	const siteMap = buildSiteMapText(options.getMenus(), options.routerMode);
+	return [
+		`你正在「${options.appName}」这个 Web 系统内替用户操作页面。`,
+		"",
+		"## 页面结构",
+		options.layoutHint?.trim() || DEFAULT_LAYOUT_HINT,
+		"",
+		...siteMap ? [
+			`## 可导航的页面（菜单树，右侧为进入后的 ${urlLabel}）`,
+			siteMap,
+			""
+		] : [],
+		"## 操作约定",
+		"- 到达页面只能通过点击导航菜单、面包屑、页面内按钮/链接，禁止手动改 URL。",
+		`- 进入页面后对照 ${urlLabel} 与页面标题/面包屑确认已到达目标，再进行下一步。`,
+		"- 页面内的 Tab 通过点击 Tab 标签切换；详情/编辑通常是表格行内的按钮，点击后在抽屉或弹窗中打开。",
+		"- 下拉选择、日期选择若为自定义组件而非原生 select：先点击该输入框，再点击弹出层中的目标选项文字。",
+		"- 数据加载需要时间；点击后若内容未变化，先使用 wait 等待 1 到 2 秒再重新观察。",
+		"",
+		"## 安全边界",
+		"- 未经用户明确要求，不得执行删除、提交、审批、发布、批量修改等不可逆操作；不确定时用 ask_user 询问。",
+		"- 任务完成后调用 done，用一句话说明当前所在页面及已完成的动作；无法完成时说明卡在哪一步。"
+	].join("\n");
+}
+/**
+* 按页提示：page-agent 每步调用一次。
+* 路由名命中 routeHints 优先，其次按路径命中；返回 null 表示不追加。
+*/
+function buildPageInstruction(options) {
+	const path = options.getCurrentPath();
+	const parts = [];
+	const menu = findMenuByPath(path, options.getMenus());
+	if (menu) parts.push(`当前页面：「${menu.label}」（${toDisplayPath(path, options.routerMode)}）`);
+	let routeName;
+	try {
+		routeName = options.resolveRouteName?.(path);
+	} catch {
+		routeName = void 0;
+	}
+	const hint = routeName && options.routeHints[routeName] || options.routeHints[normalizePath(path)];
+	if (hint) parts.push(hint);
+	return parts.length ? parts.join("\n") : null;
+}
+
+//#endregion
+//#region src/core/createPageUseAgent.ts
+/**
+* page-agent 实例工厂（由 core/service 统一调度）。
+* - LLM：浏览器请求 OpenAI 兼容端点，参数来自宿主选项
+* - 站点知识：菜单树写入 system 提示，按页提示按当前路径动态注入
+* - 任务开始前按设置执行宿主的 beforeTask（如展开折叠的侧栏）
+*/
+/** DOM 文本超过该长度时截断，避免大表格页把上下文撑爆 */
+const PAGE_CONTENT_MAX_CHARS = 6e4;
+/** 每步间隔（秒）：留给路由切换与接口加载的时间 */
+const STEP_DELAY_SECONDS = .6;
+/** 生成会话 ID；一次 execute 视为一个会话，任务开始时刷新 */
+function newSessionId() {
+	return typeof crypto !== "undefined" && crypto.randomUUID?.() || `page-use-${Date.now()}`;
+}
+function createPageUseAgent({ options, enableMask, shouldRunBeforeTask, onTaskFinished }) {
+	const { llm } = options;
+	if (!llm.baseURL) throw new Error("[PageUse] 未配置 llm.baseURL");
+	let sessionId = newSessionId();
+	/**
+	* 注入会话头（OpenCode Go 缺少 x-opencode-session 会返回 400）。
+	* User-Agent 属浏览器禁止修改的头，需要时由代理补充。
+	*/
+	const customFetch = llm.sessionHeader ? (input, init) => {
+		const headers = new Headers(init?.headers);
+		headers.set(llm.sessionHeader, sessionId);
+		return fetch(input, {
+			...init,
+			headers
+		});
+	} : void 0;
+	const extraBody = llm.extraBody;
+	const hostBeforeTask = options.beforeTask;
+	return new PageAgent({
+		baseURL: llm.baseURL,
+		apiKey: llm.apiKey || void 0,
+		model: llm.model,
+		language: "zh-CN",
+		maxSteps: llm.maxSteps,
+		disableNamedToolChoice: llm.disableNamedToolChoice,
+		customFetch,
+		transformRequestBody: Object.keys(extraBody).length ? (body) => ({
+			...body,
+			...extraBody
+		}) : void 0,
+		stepDelay: STEP_DELAY_SECONDS,
+		promptForNextTask: false,
+		enableMask,
+		experimentalScriptExecutionTool: false,
+		instructions: {
+			system: buildSystemInstruction(options),
+			getPageInstructions: () => buildPageInstruction(options)
+		},
+		transformPageContent: (content) => {
+			if (content.length <= PAGE_CONTENT_MAX_CHARS) return content;
+			return `${content.slice(0, PAGE_CONTENT_MAX_CHARS)}\n...（页面内容过长已截断，可滚动后再观察）`;
+		},
+		...options.pageAgentOptions,
+		onBeforeTask: async (...args) => {
+			sessionId = newSessionId();
+			if (hostBeforeTask && shouldRunBeforeTask()) try {
+				await hostBeforeTask();
+			} catch (err) {
+				console.warn("[PageUse] beforeTask 执行异常", err);
+			}
+			await options.pageAgentOptions.onBeforeTask?.(...args);
+		},
+		onAfterTask: async (...args) => {
+			onTaskFinished?.(args[1]);
+			await options.pageAgentOptions.onAfterTask?.(...args);
+		}
+	});
+}
+
+//#endregion
+//#region src/core/options.ts
+/** 默认模型，仅为示例取值；接入其它端点时应通过 llm.model 显式指定支持 function calling 的模型 */
+const DEFAULT_MODEL = "deepseek-chat";
+/** 单次任务最大步数；每步一次 LLM 调用，防止死循环消耗 token */
+const DEFAULT_MAX_STEPS = 20;
+/** 默认会话头：OpenCode Go 要求每个会话带稳定的 x-opencode-session 用于路由与提示缓存 */
+const DEFAULT_SESSION_HEADER = "x-opencode-session";
+/** localStorage / sessionStorage 键前缀，可通过 storageKeyPrefix 覆盖 */
+const DEFAULT_STORAGE_KEY_PREFIX = "tz-page-use";
+/** 相对路径补齐为当前 origin 的绝对地址并去掉末尾 /；无法解析时返回空串 */
+function toAbsoluteUrl(input) {
+	const base = typeof window !== "undefined" ? window.location.origin : void 0;
+	try {
+		return new URL(input, base).toString().replace(/\/+$/, "");
+	} catch {
+		return "";
+	}
+}
+/** 按路由模式从 location 读取当前路径 */
+function readLocationPath(mode) {
+	if (typeof window === "undefined") return "/";
+	if (mode === "hash") return window.location.hash.replace(/^#/, "") || "/";
+	return `${window.location.pathname}${window.location.search}`;
+}
+function resolveSessionHeader(value) {
+	if (value === false) return "";
+	return (value ?? "").trim() || "x-opencode-session";
+}
+function normalizeOptions(options) {
+	const { llm } = options;
+	const rawBase = (llm.baseURL || "").trim();
+	const routerMode = options.routerMode ?? "hash";
+	return {
+		llm: {
+			baseURL: rawBase ? toAbsoluteUrl(rawBase) : "",
+			apiKey: (llm.apiKey || "").trim(),
+			model: (llm.model || "").trim() || "deepseek-chat",
+			maxSteps: llm.maxSteps && llm.maxSteps > 0 ? llm.maxSteps : 20,
+			disableNamedToolChoice: Boolean(llm.disableNamedToolChoice),
+			extraBody: llm.extraBody && typeof llm.extraBody === "object" ? llm.extraBody : {},
+			sessionHeader: resolveSessionHeader(llm.sessionHeader)
+		},
+		appName: options.appName,
+		getMenus: options.getMenus ?? (() => void 0),
+		routerMode,
+		getCurrentPath: options.getCurrentPath ?? (() => readLocationPath(routerMode)),
+		resolveRouteName: options.resolveRouteName,
+		routeHints: options.routeHints ?? {},
+		layoutHint: options.layoutHint,
+		beforeTask: options.beforeTask,
+		beforeTaskLabel: options.beforeTaskLabel || "任务开始前执行宿主预处理",
+		storageKeyPrefix: options.storageKeyPrefix || "tz-page-use",
+		pageAgentOptions: options.pageAgentOptions ?? {},
+		exposeGlobal: options.exposeGlobal !== false
+	};
+}
+/** URL 查询参数：?pageUseDebug=1 打开调试面板，?pageUseDebug=0 关闭；结果记入 sessionStorage */
+const LAUNCHER_QUERY_KEY = "pageUseDebug";
+/** 从 location 读取调试开关（hash 路由的查询参数在 # 之后，两处都查） */
+function readLauncherQuery() {
+	const fromSearch = new URLSearchParams(window.location.search).get(LAUNCHER_QUERY_KEY);
+	if (fromSearch !== null) return fromSearch;
+	const hashQuery = window.location.hash.split("?")[1];
+	return hashQuery ? new URLSearchParams(hashQuery).get(LAUNCHER_QUERY_KEY) : null;
+}
+/**
+* 调试面板是否显示。优先级：URL 参数（并记入本会话）> 会话记录 > fallback。
+* fallback 由宿主决定（例如「开发环境显示，生产环境隐藏」）。
+*/
+function readLauncherSwitch(fallback, storageKeyPrefix = DEFAULT_STORAGE_KEY_PREFIX) {
+	if (typeof window === "undefined") return fallback;
+	const sessionKey = `${storageKeyPrefix}-debug`;
+	try {
+		const query = readLauncherQuery();
+		if (query !== null) {
+			const enabled = query === "1" || query === "true";
+			window.sessionStorage.setItem(sessionKey, enabled ? "1" : "0");
+			return enabled;
+		}
+		const session = window.sessionStorage.getItem(sessionKey);
+		if (session !== null) return session === "1";
+	} catch {}
+	return fallback;
+}
+
+//#endregion
+//#region src/core/store.ts
+function createStore(initial) {
+	let state = initial;
+	const listeners = /* @__PURE__ */ new Set();
+	const notify = () => {
+		for (const listener of listeners) try {
+			listener(state);
+		} catch (err) {
+			console.warn("[PageUse] store 订阅回调异常", err);
+		}
+	};
+	return {
+		get: () => state,
+		set(patch) {
+			const partial = typeof patch === "function" ? patch(state) : patch;
+			if (Object.keys(partial).every((key) => Object.is(state[key], partial[key]))) return;
+			state = {
+				...state,
+				...partial
+			};
+			notify();
+		},
+		replace(next) {
+			if (Object.is(next, state)) return;
+			state = next;
+			notify();
+		},
+		subscribe(listener) {
+			listeners.add(listener);
+			return () => {
+				listeners.delete(listener);
+			};
+		}
+	};
+}
+
+//#endregion
+//#region src/core/history.ts
+/**
+* Page Use 指令历史（localStorage，最多 30 条，最新在前）。
+* 用于快速重放上次指令，以及查看任务结果。存储键为 `${storageKeyPrefix}-history`。
+*/
+const MAX_ENTRIES = 30;
+function storageKey$1(prefix) {
+	return `${prefix}-history`;
+}
+function load$1(prefix) {
+	try {
+		const raw = window.localStorage.getItem(storageKey$1(prefix));
+		const parsed = raw ? JSON.parse(raw) : [];
+		return Array.isArray(parsed) ? parsed : [];
+	} catch {
+		return [];
+	}
+}
+let prefix$1 = DEFAULT_STORAGE_KEY_PREFIX;
+/** 懒创建：避免模块加载即访问 window（SSR / 测试环境） */
+let store$2 = null;
+function ensureStore$1() {
+	if (!store$2) store$2 = createStore({ entries: load$1(prefix$1) });
+	return store$2;
+}
+function persist(entries) {
+	ensureStore$1().set({ entries });
+	try {
+		window.localStorage.setItem(storageKey$1(prefix$1), JSON.stringify(entries));
+	} catch {}
+}
+/** 切换存储键前缀（createPageUse 时调用）；前缀变化时重新读取 */
+function setHistoryStoragePrefix(next) {
+	if (next === prefix$1 && store$2) return;
+	prefix$1 = next;
+	ensureStore$1().replace({ entries: load$1(prefix$1) });
+}
+const pageUseHistory = {
+	store: {
+		get: () => ensureStore$1().get(),
+		subscribe: (listener) => ensureStore$1().subscribe(listener)
+	},
+	entries() {
+		return ensureStore$1().get().entries;
+	},
+	add(entry) {
+		persist([{
+			id: `${entry.at}-${Math.random().toString(36).slice(2, 8)}`,
+			...entry
+		}, ...ensureStore$1().get().entries].slice(0, MAX_ENTRIES));
+	},
+	remove(id) {
+		persist(ensureStore$1().get().entries.filter((item) => item.id !== id));
+	},
+	clear() {
+		persist([]);
+	}
+};
+
+//#endregion
+//#region src/core/maskTheme.ts
+/**
+* 运行期蒙层与模拟光标的定制主题（覆盖 page-agent SimulatorMask 的默认视觉）。
+*
+* page-agent 的 CSS Module 类名带哈希（如 `_cursor_1dgwb_2`），随版本变化，
+* 因此这里只依赖稳定的结构：
+* - 蒙层根节点 id：`page-agent-runtime_simulator-mask`
+* - 子节点顺序：ai-motion 光晕层在前（初始化失败时不存在），光标节点恒为最后一个子节点
+* - 光标子节点顺序：1 点击波纹 / 2 箭头填充 / 3 箭头描边
+* - 点击态类名包含 `clicking` 子串
+* 升级 page-agent 后若光标样式失效，先核对 SimulatorMask 的 #createCursor 结构。
+*/
+/** 蒙层根节点 id（@page-agent/page-controller 内部常量） */
+const SIMULATOR_MASK_ID = "page-agent-runtime_simulator-mask";
+/** 主题色：主色 #0879ff 同系的蓝 → 青 → 靛渐变 */
+const PAGE_USE_MASK_COLORS = {
+	primary: "#0879ff",
+	cyan: "#36cfc9",
+	indigo: "#597ef7",
+	/** 误触拦截时的警示色 */
+	warning: "#fa8c16"
+};
+const CURSOR_ARROW_MASK = `url("data:image/svg+xml,${encodeURIComponent(`<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><path d='M 15 42 L 15 36.99 Q 15 31.99 23.7 31.99 L 28.05 31.99 Q 32.41 31.99 32.41 21.99 L 32.41 17 Q 32.41 12 41.09 16.95 L 76.31 37.05 Q 85 42 76.31 46.95 L 41.09 67.05 Q 32.41 72 32.41 62.01 L 32.41 57.01 Q 32.41 52.01 23.7 52.01 L 19.35 52.01 Q 15 52.01 15 47.01 Z' fill='#000'/></svg>`)}")`;
+const MASK = `#${SIMULATOR_MASK_ID}`;
+/** 光标节点：蒙层的最后一个子节点 */
+const CURSOR = `${MASK} > :last-child`;
+const { primary, cyan, indigo } = PAGE_USE_MASK_COLORS;
+const PAGE_USE_MASK_THEME_CSS = `
+/* 隐藏 ai-motion 默认光晕（光标之外的子节点），光晕改由 <tz-page-use-glow> 渲染 */
+${MASK} > :not(:last-child) { display: none !important; }
+/* 蒙层本身保持透明，仅负责拦截点击；真实鼠标由 wait 转圈改为禁止符号，明确「此时不可操作」而非「页面卡死」 */
+${MASK} { cursor: not-allowed !important; }
+
+/* 光标整体外发光 */
+${CURSOR} {
+  filter: drop-shadow(0 0 6px ${primary}8c) drop-shadow(0 2px 3px rgba(0, 0, 0, 0.25));
+}
+/* 光标尖端（节点原点）的呼吸光圈 */
+${CURSOR}::before {
+  content: '';
+  position: absolute;
+  left: -16px;
+  top: -16px;
+  width: 32px;
+  height: 32px;
+  border-radius: 50%;
+  background: radial-gradient(circle, ${cyan}66 0%, ${primary}26 55%, transparent 72%);
+  animation: page-use-cursor-halo 1.6s ease-in-out infinite;
+  pointer-events: none;
+}
+/* 箭头描边：主题渐变 */
+${CURSOR} > :nth-child(3) {
+  background: linear-gradient(45deg, ${primary}, ${cyan}) !important;
+}
+/* 箭头填充：用同形遮罩替换原白色 SVG 背景，改为浅色渐变 */
+${CURSOR} > :nth-child(2) {
+  background: linear-gradient(135deg, #ffffff 30%, #e6f4ff) !important;
+  -webkit-mask: ${CURSOR_ARROW_MASK} center / 100% 100% no-repeat;
+  mask: ${CURSOR_ARROW_MASK} center / 100% 100% no-repeat;
+}
+/* 点击波纹：外环改主题色 */
+${CURSOR} > :nth-child(1)::after {
+  border-color: ${cyan} !important;
+  border-width: 3px !important;
+}
+/* 点击波纹：追加一层实心扩散，增强点击反馈 */
+${CURSOR} > :nth-child(1)::before {
+  content: '';
+  position: absolute;
+  inset: 25%;
+  border-radius: 50%;
+  background: radial-gradient(circle, ${indigo}80, transparent 70%);
+  opacity: 0;
+}
+${CURSOR}[class*='clicking'] > :nth-child(1)::before {
+  animation: page-use-cursor-press 420ms ease-out forwards;
+}
+
+@keyframes page-use-cursor-halo {
+  0%, 100% { transform: scale(0.85); opacity: 0.7; }
+  50% { transform: scale(1.25); opacity: 1; }
+}
+@keyframes page-use-cursor-press {
+  0% { transform: scale(0.4); opacity: 1; }
+  100% { transform: scale(2.4); opacity: 0; }
+}
+@media (prefers-reduced-motion: reduce) {
+  ${CURSOR}::before { animation: none; }
+}
+`;
+
+//#endregion
+//#region src/core/settings.ts
+/**
+* Page Use 本地设置（localStorage 持久化，单例）。
+* 含 page-agent 内置面板/元素编号高亮开关、蒙层与光晕、调试入口拖拽位置。
+* 存储键为 `${storageKeyPrefix}-settings`。
+*/
+/** page-agent 元素高亮容器 id（page-controller 内部常量，随版本可能变化） */
+const HIGHLIGHT_CONTAINER_ID = "playwright-highlight-container";
+const HIGHLIGHT_STYLE_ID = "page-use-hide-highlights";
+/** page-agent 内置面板根节点 id（@page-agent/ui 内部常量） */
+const BUILTIN_PANEL_ID = "page-agent-runtime_agent-panel";
+const BUILTIN_PANEL_STYLE_ID = "page-use-hide-builtin-panel";
+const MASK_THEME_STYLE_ID = "page-use-mask-theme";
+const DEFAULT_PAGE_USE_SETTINGS = {
+	showBuiltinPanel: false,
+	showHighlights: false,
+	showStepDetails: true,
+	enableBeforeTask: true,
+	enableMask: true,
+	customMaskEffect: true,
+	fabPos: null
+};
+function storageKey(prefix) {
+	return `${prefix}-settings`;
+}
+function load(prefix) {
+	try {
+		const raw = window.localStorage.getItem(storageKey(prefix));
+		if (!raw) return { ...DEFAULT_PAGE_USE_SETTINGS };
+		return {
+			...DEFAULT_PAGE_USE_SETTINGS,
+			...JSON.parse(raw)
+		};
+	} catch {
+		return { ...DEFAULT_PAGE_USE_SETTINGS };
+	}
+}
+function save(prefix, settings) {
+	try {
+		window.localStorage.setItem(storageKey(prefix), JSON.stringify(settings));
+	} catch {}
+}
+/** 按开关注入/移除一段覆盖样式（用于压制 page-agent 自带的 DOM，这些节点位于宿主 document 中） */
+function toggleOverrideStyle(styleId, css, show) {
+	const existing = document.getElementById(styleId);
+	if (show) {
+		existing?.remove();
+		return;
+	}
+	if (existing) return;
+	const style = document.createElement("style");
+	style.id = styleId;
+	style.textContent = css;
+	document.head.appendChild(style);
+}
+/**
+* 把设置同步到页面：
+* - 高亮：page-controller 的 doHighlightElements 内部写死为 true，只能用样式覆盖其高亮容器
+* - 内置面板：Panel 在 statuschange 到 running 时会自行 show()，因此用 !important 样式压制
+* - 蒙层主题：注入覆盖样式；关闭时移除，恢复 page-agent 默认光晕与光标
+*/
+function applyToDocument(settings, prev) {
+	if (typeof document === "undefined") return;
+	if (!prev || prev.showHighlights !== settings.showHighlights) toggleOverrideStyle(HIGHLIGHT_STYLE_ID, `#${HIGHLIGHT_CONTAINER_ID}{display:none !important;}`, settings.showHighlights);
+	if (!prev || prev.showBuiltinPanel !== settings.showBuiltinPanel) toggleOverrideStyle(BUILTIN_PANEL_STYLE_ID, `#${BUILTIN_PANEL_ID}{display:none !important;}`, settings.showBuiltinPanel);
+	if (!prev || prev.customMaskEffect !== settings.customMaskEffect) toggleOverrideStyle(MASK_THEME_STYLE_ID, PAGE_USE_MASK_THEME_CSS, !settings.customMaskEffect);
+}
+let prefix = DEFAULT_STORAGE_KEY_PREFIX;
+let store$1 = null;
+/** 懒创建：首次访问时读取存储并把设置应用到页面 */
+function ensureStore() {
+	if (store$1) return store$1;
+	const created = createStore(load(prefix));
+	let prev = null;
+	const sync = (next) => {
+		applyToDocument(next, prev);
+		prev = next;
+	};
+	sync(created.get());
+	created.subscribe((next) => {
+		save(prefix, next);
+		sync(next);
+	});
+	store$1 = created;
+	return created;
+}
+/** 切换存储键前缀（createPageUse 时调用）；前缀变化时重新读取 */
+function setSettingsStoragePrefix(next) {
+	if (next === prefix && store$1) return;
+	prefix = next;
+	if (store$1) store$1.replace(load(prefix));
+	else ensureStore();
+}
+const pageUseSettings = {
+	store: {
+		get: () => ensureStore().get(),
+		subscribe: (listener) => ensureStore().subscribe(listener)
+	},
+	get() {
+		return ensureStore().get();
+	},
+	update(patch) {
+		ensureStore().set(patch);
+	},
+	/** 把浮动入口（及随之定位的面板）恢复到默认角落位置 */
+	resetPositions() {
+		ensureStore().set({ fabPos: null });
+	}
+};
+
+//#endregion
+//#region src/core/stepLog.ts
+function summarizeActionInput(name, input) {
+	const record = input && typeof input === "object" ? input : {};
+	switch (name) {
+		case "click_element_by_index": return `点击元素 [${record.index}]`;
+		case "input_text": return `在 [${record.index}] 输入「${record.text}」`;
+		case "select_dropdown_option": return `选择 [${record.index}] 的「${record.text}」`;
+		case "scroll": return `${record.down === false ? "向上" : "向下"}滚动`;
+		case "scroll_horizontally": return `${record.right === false ? "向左" : "向右"}滚动`;
+		case "wait": return `等待 ${record.seconds ?? 1} 秒`;
+		case "done": return record.success === false ? "结束任务（未达成）" : "结束任务";
+		case "ask_user": return "向用户提问";
+		default: return name;
+	}
+}
+/** 工具返回文本约定：page-agent 内置工具成功以 ✅ 开头，失败以 ❌ 开头 */
+function isFailedOutput(output) {
+	return output.startsWith("❌") || /失败|error|failed/i.test(output);
+}
+function toStepLogs(history) {
+	const logs = [];
+	for (const event of history) if (event.type === "step") logs.push({
+		index: event.stepIndex + 1,
+		tool: event.action.name,
+		evaluation: event.reflection?.evaluation_previous_goal || "",
+		goal: event.reflection?.next_goal || "",
+		action: summarizeActionInput(event.action.name, event.action.input),
+		output: event.action.output,
+		failed: isFailedOutput(event.action.output || "")
+	});
+	else if (event.type === "error") logs.push({
+		index: logs.length + 1,
+		tool: "error",
+		evaluation: "",
+		goal: "",
+		action: "执行出错",
+		output: event.message,
+		failed: true
+	});
+	else if (event.type === "retry") logs.push({
+		index: logs.length + 1,
+		tool: "retry",
+		evaluation: "",
+		goal: "",
+		action: `重试 ${event.attempt}/${event.maxAttempts}`,
+		output: event.message || "",
+		failed: false
+	});
+	return logs;
+}
+function sumTokens(history) {
+	let total = 0;
+	for (const event of history) if (event.type === "step") total += event.usage?.totalTokens || 0;
+	return total;
+}
+function describeActivity(activity) {
+	switch (activity.type) {
+		case "thinking": return "正在分析页面…";
+		case "executing": return `正在${summarizeActionInput(activity.tool, activity.input)}`;
+		case "executed": return `已${summarizeActionInput(activity.tool, activity.input)}`;
+		case "retrying": return `模型响应异常，重试 ${activity.attempt}/${activity.maxAttempts}`;
+		case "error": return `错误：${activity.message}`;
+		default: return "";
+	}
+}
+
+//#endregion
+//#region src/core/service.ts
+/** 无人可答时回给模型的固定答复，引导其基于已有信息决策或以未达成结束 */
+const NO_ANSWER_REPLY = "用户当前无法补充信息，请根据页面已有信息自行判断；无法继续时调用 done 并说明原因。";
+const store = createStore({
+	status: "idle",
+	activityText: "",
+	currentTask: "",
+	currentTaskId: "",
+	currentSource: "",
+	steps: [],
+	lastResult: null,
+	errorMessage: "",
+	pendingQuestion: null,
+	totalTokens: 0,
+	startedAt: 0,
+	finishedAt: 0,
+	nowTick: 0,
+	maskEnabled: false,
+	ready: false
+});
+/** 只读状态容器：UI 层订阅后自行接入响应式 */
+const pageUseStore = {
+	get: store.get,
+	subscribe: store.subscribe
+};
+function isRunning(state = store.get()) {
+	return state.status === "running";
+}
+/** 任务耗时（秒）：运行中随 nowTick 每秒刷新，结束后固定 */
+function getElapsedSeconds(state = store.get()) {
+	if (!state.startedAt) return 0;
+	const end = state.finishedAt || state.nowTick || Date.now();
+	return Math.max(0, Math.round((end - state.startedAt) / 1e3));
+}
+let config = null;
+/** 是否曾经配置过：用于区分 NOT_CONFIGURED（从未初始化）与 NOT_READY（已销毁） */
+let everConfigured = false;
+let agent = null;
+/** 创建实例时的蒙层设置；与当前设置不一致时须重建 */
+let agentMaskFlag = null;
+/** 已挂载且可作答的调试面板数量；>0 时未指定 onAskUser 的提问交给面板 */
+let questionUiCount = 0;
+/** 当前任务的调用方选项（提问回调、进度回调） */
+let activeOptions = null;
+const listeners = /* @__PURE__ */ new Set();
+let tickTimer = null;
+function startTick() {
+	stopTick();
+	store.set({ nowTick: Date.now() });
+	tickTimer = setInterval(() => store.set({ nowTick: Date.now() }), 1e3);
+}
+function stopTick() {
+	if (tickTimer !== null) {
+		clearInterval(tickTimer);
+		tickTimer = null;
+	}
+}
+/** 同时投递给本任务调用方与全局订阅者；回调异常不影响任务执行 */
+function emit(event) {
+	try {
+		activeOptions?.onProgress?.(event);
+	} catch (err) {
+		console.warn("[PageUse] onProgress 回调异常", err);
+	}
+	for (const listener of listeners) try {
+		listener(event);
+	} catch (err) {
+		console.warn("[PageUse] 订阅回调异常", err);
+	}
+}
+function bindAgentEvents(target) {
+	target.addEventListener("statuschange", () => {
+		store.set({ status: target.status });
+	});
+	target.addEventListener("activity", (event) => {
+		const activity = event.detail;
+		if (!activity) return;
+		const text = describeActivity(activity);
+		store.set({ activityText: text });
+		if (text) emit({
+			type: "activity",
+			taskId: store.get().currentTaskId,
+			text
+		});
+	});
+	target.addEventListener("historychange", () => {
+		const history = target.history;
+		const next = toStepLogs(history);
+		const { steps, currentTaskId } = store.get();
+		for (const step of next.slice(steps.length)) emit({
+			type: "step",
+			taskId: currentTaskId,
+			step
+		});
+		store.set({
+			steps: next,
+			totalTokens: sumTokens(history)
+		});
+	});
+}
+/** 模型提问的分发：调用方回调 → 调试面板 → 固定答复 */
+function handleAskUser(question, signal) {
+	emit({
+		type: "question",
+		taskId: store.get().currentTaskId,
+		question
+	});
+	const callerHandler = activeOptions?.onAskUser;
+	if (callerHandler) return callerHandler(question);
+	if (questionUiCount <= 0) return Promise.resolve(NO_ANSWER_REPLY);
+	return new Promise((resolve, reject) => {
+		store.set({ pendingQuestion: {
+			question,
+			resolve: (answer) => {
+				store.set({ pendingQuestion: null });
+				resolve(answer);
+			}
+		} });
+		signal?.addEventListener("abort", () => {
+			store.set({ pendingQuestion: null });
+			reject(signal.reason);
+		}, { once: true });
+	});
+}
+/** 懒创建单例；蒙层设置变化时重建（enableMask 属构造期选项） */
+function ensureAgent(options) {
+	const settings = pageUseSettings.get();
+	if (agent && !agent.disposed && agentMaskFlag === settings.enableMask) return agent;
+	if (agent && !agent.disposed) agent.dispose();
+	const created = createPageUseAgent({
+		options,
+		enableMask: settings.enableMask,
+		shouldRunBeforeTask: () => pageUseSettings.get().enableBeforeTask
+	});
+	bindAgentEvents(created);
+	created.onAskUser = (question, askOptions) => handleAskUser(question, askOptions?.signal);
+	agent = created;
+	agentMaskFlag = settings.enableMask;
+	store.set({ maskEnabled: settings.enableMask });
+	return created;
+}
+function newTaskId() {
+	return typeof crypto !== "undefined" && crypto.randomUUID?.() || `task-${Date.now()}`;
+}
+/** 未能开始的任务：直接返回结果，不改动当前面板状态 */
+function rejectedResult(task, source, summary, errorCode, status = "error") {
+	return {
+		taskId: "",
+		task,
+		source,
+		status,
+		success: false,
+		summary,
+		errorCode,
+		steps: [],
+		tokens: 0,
+		durationMs: 0
+	};
+}
+function resolveFinalStatus(success) {
+	const final = agent?.status;
+	if (final === "stopped") return "stopped";
+	if (final === "error") return "error";
+	return success ? "completed" : "failed";
+}
+/**
+* 写入配置（createPageUse 调用）。重复配置时释放旧 agent，下次任务按新配置重建。
+* 返回解绑函数：清除配置并释放 agent。
+*/
+function configurePageUse(options) {
+	if (config) disposeAgent();
+	config = options;
+	everConfigured = true;
+	setSettingsStoragePrefix(options.storageKeyPrefix);
+	setHistoryStoragePrefix(options.storageKeyPrefix);
+	store.set({ ready: Boolean(options.llm.baseURL) });
+	return () => {
+		if (config !== options) return;
+		config = null;
+		disposeAgent();
+		store.set({ ready: false });
+	};
+}
+/** 已调用 createPageUse 且配置了端点 */
+function isPageUseConfigured() {
+	return Boolean(config?.llm.baseURL);
+}
+/** 当前生效的规范化配置；未配置时为 null */
+function getPageUseConfig() {
+	return config;
+}
+/** 调试面板挂载时登记为提问作答方；返回注销函数 */
+function registerQuestionUi() {
+	questionUiCount += 1;
+	return () => {
+		questionUiCount = Math.max(0, questionUiCount - 1);
+	};
+}
+/**
+* 下达一条页面操作指令，任务结束后 resolve 结果；不会 reject。
+* 未能开始（未配置 / 已销毁 / 忙 / 空指令）时返回 status='error' 且带 errorCode。
+*/
+async function runTask(task, options = {}) {
+	const normalized = task.trim();
+	const source = options.source || "unknown";
+	if (!normalized) return rejectedResult(normalized, source, "指令为空", "EMPTY_TASK");
+	if (!config) return everConfigured ? rejectedResult(normalized, source, "页面操作能力已销毁", "NOT_READY") : rejectedResult(normalized, source, "页面操作能力未初始化（未调用 createPageUse）", "NOT_CONFIGURED");
+	if (!config.llm.baseURL) return rejectedResult(normalized, source, "页面操作能力未配置模型端点", "NOT_CONFIGURED");
+	if (isRunning() || activeOptions) return rejectedResult(normalized, source, `已有任务执行中：${store.get().currentTask}`, "BUSY");
+	if (options.signal?.aborted) return rejectedResult(normalized, source, "任务已取消", void 0, "stopped");
+	const taskId = newTaskId();
+	const startedAt = Date.now();
+	activeOptions = options;
+	store.set({
+		errorMessage: "",
+		activityText: "",
+		steps: [],
+		lastResult: null,
+		pendingQuestion: null,
+		totalTokens: 0,
+		currentTask: normalized,
+		currentTaskId: taskId,
+		currentSource: source,
+		startedAt,
+		finishedAt: 0
+	});
+	startTick();
+	emit({
+		type: "started",
+		taskId,
+		task: normalized,
+		source
+	});
+	const onAbort = () => void stopTask();
+	options.signal?.addEventListener("abort", onAbort, { once: true });
+	let result;
+	try {
+		const execution = await ensureAgent(config).execute(normalized);
+		const final = resolveFinalStatus(execution.success);
+		const { steps, totalTokens } = store.get();
+		result = {
+			taskId,
+			task: normalized,
+			source,
+			status: final,
+			success: final === "completed",
+			summary: execution.data || "",
+			steps,
+			tokens: totalTokens,
+			durationMs: Date.now() - startedAt
+		};
+	} catch (err) {
+		const message = err instanceof Error ? err.message : String(err);
+		const { steps, totalTokens } = store.get();
+		store.set({
+			errorMessage: message,
+			status: "error"
+		});
+		result = {
+			taskId,
+			task: normalized,
+			source,
+			status: "error",
+			success: false,
+			summary: message,
+			errorCode: "AGENT_ERROR",
+			steps,
+			tokens: totalTokens,
+			durationMs: Date.now() - startedAt
+		};
+	} finally {
+		options.signal?.removeEventListener("abort", onAbort);
+		store.set({ finishedAt: Date.now() });
+		stopTick();
+	}
+	store.set({ lastResult: result });
+	pageUseHistory.add({
+		task: normalized,
+		source,
+		success: result.status === "stopped" ? null : result.success,
+		at: Date.now(),
+		steps: result.steps.length,
+		summary: result.summary
+	});
+	emit({
+		type: "finished",
+		taskId,
+		result
+	});
+	activeOptions = null;
+	return result;
+}
+/** 终止当前任务（无任务时忽略）；等待 agent 完全停下后 resolve */
+async function stopTask() {
+	await agent?.stop();
+}
+/** 订阅全部任务的进度事件；返回取消订阅函数 */
+function subscribePageUse(listener) {
+	listeners.add(listener);
+	return () => {
+		listeners.delete(listener);
+	};
+}
+function getPageUseSnapshot() {
+	const state = store.get();
+	return {
+		ready: state.ready,
+		running: isRunning(state),
+		taskId: state.currentTaskId,
+		task: state.currentTask,
+		source: state.currentSource,
+		activity: state.activityText,
+		steps: state.steps.length
+	};
+}
+/**
+* 清屏：清空面板展示的本次执行记录（指令、步骤、结果、计数），不影响历史指令与 agent 实例。
+* 执行中不允许清空，否则后续步骤回写会与已清空的状态错位。
+*/
+function clearPageUseLog() {
+	if (isRunning()) return;
+	store.set({
+		currentTask: "",
+		currentTaskId: "",
+		currentSource: "",
+		steps: [],
+		lastResult: null,
+		errorMessage: "",
+		activityText: "",
+		totalTokens: 0,
+		startedAt: 0,
+		finishedAt: 0,
+		status: "idle"
+	});
+}
+/** 释放 agent（清掉高亮与蒙层）；宿主销毁（如登出）时调用 */
+function disposeAgent() {
+	stopTick();
+	agent?.dispose();
+	agent = null;
+	agentMaskFlag = null;
+	activeOptions = null;
+	store.set({
+		maskEnabled: false,
+		status: "idle",
+		activityText: "",
+		pendingQuestion: null
+	});
+}
+
+//#endregion
+//#region src/capability/api.ts
+/**
+* Page Use 对外能力门面：其它智能体通过它下达页面操作指令。
+*
+* 用法：
+*   import { pageUseCapability } from '@tanzerfe/page-use'
+*   if (pageUseCapability.isReady()) {
+*     const result = await pageUseCapability.run('打开订单列表并筛选待发货', { source: 'my-agent' })
+*   }
+*/
+const pageUseCapability = {
+	version: 1,
+	isReady: () => getPageUseSnapshot().ready,
+	run: runTask,
+	stop: stopTask,
+	getSnapshot: getPageUseSnapshot,
+	subscribe: subscribePageUse
+};
+
+//#endregion
+//#region src/capability/tool.ts
+/** 工具名；对接方在 system 提示中引用时保持一致 */
+const PAGE_USE_TOOL_NAME = "operate_current_page";
+const PAGE_USE_TOOL = {
+	type: "function",
+	function: {
+		name: PAGE_USE_TOOL_NAME,
+		description: [
+			"在用户当前打开的系统页面中，通过模拟真实点击与输入完成操作，并返回操作结论。",
+			"可做：跨菜单跳转到任意页面、切换标签页、筛选与查询列表、打开详情抽屉或弹窗并读取内容、填写表单。",
+			"不适合：纯知识问答、需要后台数据统计但页面上没有对应入口的问题。",
+			"删除、提交、审批等不可撤销操作，须先向用户确认后再下达指令。",
+			"同一时刻只能执行一个任务；执行期间页面被锁定，通常耗时 10~60 秒。"
+		].join(""),
+		parameters: {
+			type: "object",
+			properties: { instruction: {
+				type: "string",
+				description: "可独立执行的完整中文指令，写明目标页面与具体操作，例如「打开订单管理下的订单列表，筛选状态为待发货并查询，告诉我第一条订单的收货地址」。"
+			} },
+			required: ["instruction"]
+		}
+	}
+};
+/** 解析工具入参：兼容对象与 JSON 字符串两种形式 */
+function readInstruction(args) {
+	let value = args;
+	if (typeof value === "string") try {
+		value = JSON.parse(value);
+	} catch {
+		return value;
+	}
+	if (value && typeof value === "object" && "instruction" in value) {
+		const instruction = value.instruction;
+		return typeof instruction === "string" ? instruction : "";
+	}
+	return "";
+}
+/** 把任务结果整理为给模型阅读的纯文本 */
+function formatPageUseResultForModel(result) {
+	const lines = [`页面操作${{
+		completed: "已完成",
+		failed: "未达成",
+		stopped: "已被终止",
+		error: "执行出错"
+	}[result.status]}。`];
+	if (result.errorCode) lines.push(`原因代码：${result.errorCode}`);
+	if (result.summary) lines.push(`结论：${result.summary}`);
+	if (result.steps.length) {
+		const recent = result.steps.slice(-8);
+		const omitted = result.steps.length - recent.length;
+		lines.push(`执行步骤（共 ${result.steps.length} 步${omitted ? `，仅列最后 ${recent.length} 步` : ""}）：`);
+		for (const step of recent) lines.push(`${step.index}. ${step.action}${step.failed ? "（失败）" : ""}`);
+	}
+	return lines.join("\n");
+}
+/**
+* 执行一次 operate_current_page 工具调用。
+* 返回 { result, content }：content 直接作为 tool 消息回给模型，result 供对接方自行展示。
+*/
+async function runPageUseTool(args, options = {}) {
+	const result = await pageUseCapability.run(readInstruction(args), options);
+	return {
+		result,
+		content: formatPageUseResultForModel(result)
+	};
+}
+/** 指令块类型名：模型在 shell / JSON 块中输出 {"type":"pageAction","instruction":"..."} */
+const PAGE_USE_COMMAND_TYPE = "pageAction";
+function isPageUseCommand(value) {
+	if (!value || typeof value !== "object") return false;
+	const record = value;
+	return record.type === "pageAction" && typeof record.instruction === "string" && record.instruction.trim().length > 0;
+}
+
+//#endregion
+//#region src/capability/bridge.ts
+/**
+* 全局桥接：把能力挂到 window.__TZ_PAGE_USE__，供不走模块导入的调用方使用
+* （控制台调试、E2E 脚本、同源的外部脚本）。createPageUse 时安装，destroy 时移除。
+*
+* 仅支持同一 window 内调用，未实现 postMessage 跨窗口协议（iframe / 微前端）；
+* 如需跨窗口接入，可在此基础上增加消息通道，能力接口保持不变。
+*/
+/** window 上的挂载名 */
+const PAGE_USE_GLOBAL_KEY = "__TZ_PAGE_USE__";
+/** 安装全局桥接；返回卸载函数 */
+function installPageUseGlobal() {
+	const api = {
+		...pageUseCapability,
+		tool: PAGE_USE_TOOL,
+		runTool: runPageUseTool
+	};
+	window[PAGE_USE_GLOBAL_KEY] = api;
+	return () => {
+		if (window["__TZ_PAGE_USE__"] === api) delete window[PAGE_USE_GLOBAL_KEY];
+	};
+}
+
+//#endregion
+//#region src/create.ts
+/**
+* 初始化入口：写入配置、安装全局桥接。UI 由 mountPageUseUI 单独挂载。
+*/
+/**
+* 初始化 Page Use。全局只有一份配置：重复调用会以新配置替换旧配置，
+* 旧 handle 的 destroy 随之失效（不会误清新配置）。
+*/
+function createPageUse(options) {
+	const normalized = normalizeOptions(options);
+	if (!normalized.llm.baseURL) console.warn("[PageUse] 未配置 llm.baseURL，run() 将返回 NOT_CONFIGURED");
+	const unbind = configurePageUse(normalized);
+	const uninstallGlobal = normalized.exposeGlobal ? installPageUseGlobal() : () => {};
+	let destroyed = false;
+	return {
+		capability: pageUseCapability,
+		destroy() {
+			if (destroyed) return;
+			destroyed = true;
+			uninstallGlobal();
+			unbind();
+		}
+	};
+}
+
+//#endregion
+//#region src/ui/glow.ts
+/**
+* <tz-page-use-glow>：运行期光晕层（旋转渐变边框 + 外发光呼吸 + 四周暗角 + 底部状态提示）。
+* 只做视觉，pointer-events: none，点击拦截仍由 page-agent 的 SimulatorMask 负责。
+* 用户点到蒙层（被拦截的误触）时切换为警示色并提示如何中断。
+*
+* 显示条件：执行中 + 当前 agent 实例带蒙层 + 开启定制效果。
+* enableMask 是构造期选项，设置改动要到下次任务重建实例才生效，故读 state.maskEnabled 而非设置值。
+*/
+const PAGE_USE_GLOW_TAG = "tz-page-use-glow";
+/** 误触警示持续时间（ms） */
+const BLOCKED_DURATION = 1600;
+/** 旋转渐变角度变量名；须在 document 级注册（shadow 样式表中的 @property 不生效） */
+const ANGLE_VAR = "--tz-page-use-glow-angle";
+let angleRegistered = false;
+function registerAngleProperty() {
+	if (angleRegistered) return;
+	angleRegistered = true;
+	try {
+		CSS.registerProperty({
+			name: ANGLE_VAR,
+			syntax: "<angle>",
+			inherits: true,
+			initialValue: "0deg"
+		});
+	} catch {}
+}
+var PageUseGlowElement = class extends LitElement {
+	static styles = css`
+    :host {
+      /* 主题色与 maskTheme.ts 的 PAGE_USE_MASK_COLORS 保持一致，可由宿主覆盖 */
+      --c-primary: var(--tz-page-use-primary, #0879ff);
+      --c-cyan: var(--tz-page-use-cyan, #36cfc9);
+      --c-indigo: var(--tz-page-use-indigo, #597ef7);
+      --c-warning: var(--tz-page-use-warning, #fa8c16);
+    }
+
+    /*
+     * 层级：高于 SimulatorMask（2147483641）以覆盖其上显示，
+     * 低于调试面板与入口（2147483643），不遮挡「终止」按钮。
+     */
+    .glow {
+      --c-a: var(--c-primary);
+      --c-b: var(--c-cyan);
+      --c-c: var(--c-indigo);
+      position: fixed;
+      inset: 0;
+      z-index: 2147483642;
+      pointer-events: none;
+      opacity: 0;
+      visibility: hidden;
+      transition: opacity 0.35s ease, visibility 0s linear 0.35s;
+      animation: glow-spin 6s linear infinite paused;
+    }
+    .glow.show {
+      opacity: 1;
+      visibility: visible;
+      transition: opacity 0.35s ease;
+      animation-play-state: running;
+    }
+
+    /* 误触：整体切换为警示色 */
+    .blocked {
+      --c-a: var(--c-warning);
+      --c-b: #ffc53d;
+      --c-c: #ff7a45;
+    }
+
+    /* 四周暗角 + 极淡主色罩，提示页面处于锁定态但不影响阅读 */
+    .vignette {
+      position: absolute;
+      inset: 0;
+      background:
+        radial-gradient(ellipse at center, transparent 55%, color-mix(in srgb, var(--c-a) 14%, transparent) 100%),
+        color-mix(in srgb, var(--c-a) 3%, transparent);
+      transition: background 0.3s;
+    }
+
+    /* 通用：用双层遮罩只保留边框区域（padding 即边框宽度） */
+    .ring,
+    .aura {
+      position: absolute;
+      inset: 0;
+      background: conic-gradient(
+        from var(--tz-page-use-glow-angle, 0deg),
+        var(--c-a),
+        var(--c-b),
+        var(--c-c),
+        var(--c-a)
+      );
+      -webkit-mask:
+        linear-gradient(#000 0 0) content-box,
+        linear-gradient(#000 0 0);
+      -webkit-mask-composite: xor;
+      mask-composite: exclude;
+    }
+    .ring {
+      padding: 3px;
+    }
+    /* 外发光：更宽的边框 + 模糊 + 呼吸 */
+    .aura {
+      padding: 14px;
+      filter: blur(14px);
+      opacity: 0.55;
+      animation: glow-breathe 2.4s ease-in-out infinite;
+    }
+    .blocked .aura {
+      opacity: 0.9;
+      animation: none;
+    }
+
+    /* 底部状态提示条 */
+    .hint {
+      position: absolute;
+      left: 50%;
+      bottom: 28px;
+      display: flex;
+      align-items: center;
+      gap: 8px;
+      max-width: min(640px, calc(100vw - 48px));
+      padding: 8px 16px;
+      border: 1px solid color-mix(in srgb, var(--c-a) 35%, transparent);
+      border-radius: 999px;
+      background: rgba(255, 255, 255, 0.92);
+      box-shadow: 0 6px 24px color-mix(in srgb, var(--c-a) 30%, transparent);
+      color: #1f2d3d;
+      font-size: 13px;
+      font-family: system-ui, -apple-system, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', sans-serif;
+      transform: translateX(-50%);
+      backdrop-filter: blur(6px);
+    }
+    .blocked .hint {
+      animation: glow-shake 0.4s ease-in-out;
+    }
+    .hint-dot {
+      flex: none;
+      width: 8px;
+      height: 8px;
+      border-radius: 50%;
+      background: var(--c-a);
+      animation: glow-ping 1.4s ease-out infinite;
+    }
+    .hint-text {
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+
+    @keyframes glow-spin {
+      to {
+        --tz-page-use-glow-angle: 360deg;
+      }
+    }
+    @keyframes glow-breathe {
+      0%,
+      100% {
+        opacity: 0.4;
+      }
+      50% {
+        opacity: 0.75;
+      }
+    }
+    @keyframes glow-ping {
+      0% {
+        box-shadow: 0 0 0 0 color-mix(in srgb, var(--c-a) 60%, transparent);
+      }
+      100% {
+        box-shadow: 0 0 0 8px transparent;
+      }
+    }
+    @keyframes glow-shake {
+      0%,
+      100% {
+        transform: translateX(-50%);
+      }
+      25% {
+        transform: translateX(calc(-50% - 6px));
+      }
+      75% {
+        transform: translateX(calc(-50% + 6px));
+      }
+    }
+    @media (prefers-reduced-motion: reduce) {
+      .glow,
+      .aura,
+      .hint-dot,
+      .blocked .hint {
+        animation: none;
+      }
+    }
+  `;
+	blocked = false;
+	/** 每次误触自增，作为提示条 key 重建节点以重播抖动动画 */
+	blockCount = 0;
+	blockedTimer = null;
+	active = false;
+	unsubscribers = [];
+	connectedCallback() {
+		super.connectedCallback();
+		registerAngleProperty();
+		const sync = () => this.syncActive();
+		this.unsubscribers = [pageUseStore.subscribe(sync), pageUseSettings.store.subscribe(sync)];
+		this.syncActive();
+	}
+	disconnectedCallback() {
+		super.disconnectedCallback();
+		this.unsubscribers.forEach((off) => off());
+		this.unsubscribers = [];
+		this.setListening(false);
+		this.resetBlocked();
+	}
+	syncActive() {
+		const state = pageUseStore.get();
+		const active = isRunning(state) && state.maskEnabled && pageUseSettings.get().customMaskEffect;
+		if (active !== this.active) {
+			this.active = active;
+			this.setListening(active);
+			if (!active) this.resetBlocked();
+		}
+		this.requestUpdate();
+	}
+	/**
+	* 捕获阶段监听：SimulatorMask 在自身节点上 stopPropagation，
+	* 冒泡阶段收不到，必须在 window 捕获阶段判断点击目标是否落在蒙层内。
+	*/
+	onPointerDownCapture = (event) => {
+		const target = event.target;
+		if (!(target instanceof Element) || !target.closest(`#${"page-agent-runtime_simulator-mask"}`)) return;
+		this.blocked = true;
+		this.blockCount += 1;
+		if (this.blockedTimer !== null) clearTimeout(this.blockedTimer);
+		this.blockedTimer = setTimeout(() => {
+			this.blocked = false;
+			this.blockedTimer = null;
+			this.requestUpdate();
+		}, BLOCKED_DURATION);
+		this.requestUpdate();
+	};
+	setListening(on) {
+		window.removeEventListener("pointerdown", this.onPointerDownCapture, true);
+		if (on) window.addEventListener("pointerdown", this.onPointerDownCapture, true);
+	}
+	resetBlocked() {
+		if (this.blockedTimer !== null) clearTimeout(this.blockedTimer);
+		this.blockedTimer = null;
+		this.blocked = false;
+	}
+	render() {
+		const activity = pageUseStore.get().activityText;
+		const hint = this.blocked ? "AI 正在操作，已拦截本次点击；如需中断请在面板点「终止」" : activity ? `AI 正在操作页面 · ${activity}` : "AI 正在操作页面，请勿点击";
+		return html`
+      <div
+        class="glow ${this.active ? "show" : ""} ${this.blocked ? "blocked" : ""}"
+        aria-hidden="true"
+      >
+        <div class="vignette"></div>
+        <div class="aura"></div>
+        <div class="ring"></div>
+        ${keyed(this.blockCount, html`<div class="hint">
+            <span class="hint-dot"></span>
+            <span class="hint-text">${hint}</span>
+          </div>`)}
+      </div>
+    `;
+	}
+};
+
+//#endregion
+//#region src/ui/drag.ts
+/** 判定为拖拽而非点击的最小位移（px） */
+const DRAG_THRESHOLD = 4;
+/** 元素与视口边缘保留的最小间距（px） */
+const VIEWPORT_MARGIN = 8;
+function clampToViewport(pos, el) {
+	const width = el?.offsetWidth ?? 0;
+	const height = el?.offsetHeight ?? 0;
+	const maxX = Math.max(8, window.innerWidth - width - 8);
+	const maxY = Math.max(8, window.innerHeight - height - 8);
+	return {
+		x: Math.min(Math.max(8, pos.x), maxX),
+		y: Math.min(Math.max(8, pos.y), maxY)
+	};
+}
+function createDrag(options) {
+	function onPointerDown(event) {
+		if (event.button !== 0) return;
+		const el = options.getEl();
+		if (!el) return;
+		if (options.skipInteractive !== false) {
+			if (event.composedPath()[0]?.closest?.("button, input, textarea, select, a, label, [data-no-drag]")) return;
+		}
+		const handle = event.currentTarget;
+		const rect = el.getBoundingClientRect();
+		const startX = event.clientX;
+		const startY = event.clientY;
+		let moved = false;
+		let dragging = true;
+		const onMove = (e) => {
+			if (!dragging) return;
+			const dx = e.clientX - startX;
+			const dy = e.clientY - startY;
+			if (!moved && Math.hypot(dx, dy) < DRAG_THRESHOLD) return;
+			moved = true;
+			options.setPos(clampToViewport({
+				x: rect.left + dx,
+				y: rect.top + dy
+			}, el));
+		};
+		const onUp = () => {
+			dragging = false;
+			handle.removeEventListener("pointermove", onMove);
+			handle.removeEventListener("pointerup", onUp);
+			handle.removeEventListener("pointercancel", onUp);
+			try {
+				handle.releasePointerCapture(event.pointerId);
+			} catch {}
+			if (!moved) options.onTap?.();
+		};
+		handle.setPointerCapture(event.pointerId);
+		handle.addEventListener("pointermove", onMove);
+		handle.addEventListener("pointerup", onUp);
+		handle.addEventListener("pointercancel", onUp);
+		event.preventDefault();
+	}
+	/** 视口尺寸变化后把已存位置夹回可见区域 */
+	function reclamp() {
+		const pos = options.getPos();
+		if (!pos) return;
+		options.setPos(clampToViewport(pos, options.getEl()));
+	}
+	return {
+		onPointerDown,
+		reclamp
+	};
+}
+
+//#endregion
+//#region src/ui/presets.ts
+/** 通用示例：不依赖具体站点，覆盖详情、标签、返回等典型操作 */
+const PAGE_USE_STATIC_PRESETS = [
+	{
+		label: "看第一条详情",
+		task: "在当前列表页打开第一条记录的详情"
+	},
+	{
+		label: "切到下一个标签",
+		task: "切换到当前页面的下一个标签页"
+	},
+	{
+		label: "总结当前页",
+		task: "概括当前页面展示的主要内容与可执行的操作"
+	}
+];
+/** 取前 N 个可见叶子菜单，生成「打开 XX」快捷指令 */
+function buildMenuPresets(menus, limit = 8) {
+	const out = [];
+	const walk = (list) => {
+		for (const node of list) {
+			if (out.length >= limit) return;
+			if (node.hidden) continue;
+			const children = (node.children || []).filter((child) => !child.hidden);
+			if (children.length) walk(children);
+			else out.push({
+				label: node.label,
+				task: `打开「${node.label}」页面`
+			});
+		}
+	};
+	walk(menus || []);
+	return out;
+}
+
+//#endregion
+//#region src/ui/styles.ts
+/**
+* 调试面板样式（Shadow DOM 内生效，与宿主样式双向隔离）。
+* 不依赖组件库，以原生元素 + 类名实现：btn / checkbox / alert / spin / timeline。
+* 主题色可由宿主通过 CSS 变量 --tz-page-use-primary 等覆盖。
+*/
+const launcherStyles = css`
+  :host {
+    --primary: var(--tz-page-use-primary, #0879ff);
+    --success: var(--tz-page-use-success, #1a9d4b);
+    --warning: var(--tz-page-use-warning-text, #f5a623);
+    --error: var(--tz-page-use-error, #d9363e);
+    --text: #1f2d3d;
+    --text-3: #8a94a6;
+    --border: #e6eaf0;
+    --bg-soft: #f5f7fa;
+    font-family: system-ui, -apple-system, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', sans-serif;
+    font-size: 13px;
+    line-height: 1.5;
+    color: var(--text);
+  }
+  *,
+  *::before,
+  *::after {
+    box-sizing: border-box;
+  }
+  [hidden] {
+    display: none !important;
+  }
+
+  /*
+   * 滚动条：细轨道、透明底、圆角滑块，悬停时加深。
+   * 标准属性（Chrome 121+ / Firefox）优先生效；旧版 WebKit 走 ::-webkit-scrollbar。
+   */
+  .fill,
+  .tray,
+  .textarea {
+    scrollbar-width: thin;
+    scrollbar-color: rgba(31, 45, 61, 0.18) transparent;
+  }
+  .fill:hover,
+  .tray:hover,
+  .textarea:hover {
+    scrollbar-color: rgba(31, 45, 61, 0.32) transparent;
+  }
+  .fill::-webkit-scrollbar,
+  .tray::-webkit-scrollbar,
+  .textarea::-webkit-scrollbar {
+    width: 6px;
+    height: 6px;
+  }
+  .fill::-webkit-scrollbar-track,
+  .tray::-webkit-scrollbar-track,
+  .textarea::-webkit-scrollbar-track {
+    background: transparent;
+  }
+  .fill::-webkit-scrollbar-thumb,
+  .tray::-webkit-scrollbar-thumb,
+  .textarea::-webkit-scrollbar-thumb {
+    border-radius: 3px;
+    background: rgba(31, 45, 61, 0.18);
+  }
+  .fill::-webkit-scrollbar-thumb:hover,
+  .tray::-webkit-scrollbar-thumb:hover,
+  .textarea::-webkit-scrollbar-thumb:hover {
+    background: rgba(31, 45, 61, 0.32);
+  }
+
+  /*
+   * 运行期蒙层 z-index 为 2147483641、内置面板为 2147483642；
+   * 入口与面板须高于两者，否则任务执行中无法点「终止」或回答模型提问。
+   */
+  .fab {
+    position: fixed;
+    z-index: 2147483643;
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    padding: 8px 14px;
+    border: none;
+    border-radius: 20px;
+    background: var(--primary);
+    color: #fff;
+    font: inherit;
+    font-weight: 600;
+    cursor: grab;
+    touch-action: none;
+    box-shadow: 0 4px 14px color-mix(in srgb, var(--primary) 35%, transparent);
+  }
+  .fab:active {
+    cursor: grabbing;
+  }
+  .fab.running {
+    background: var(--warning);
+    box-shadow: 0 4px 14px color-mix(in srgb, var(--warning) 40%, transparent);
+  }
+  .fab-dot {
+    width: 6px;
+    height: 6px;
+    border-radius: 50%;
+    background: #fff;
+  }
+  .fab.running .fab-dot {
+    animation: blink 1s infinite;
+  }
+
+  .panel {
+    position: fixed;
+    z-index: 2147483643;
+    /* width / height 由 panelStyle 按入口位置计算 */
+    display: flex;
+    flex-direction: column;
+    border-radius: 10px;
+    background: #fff;
+    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.18);
+    overflow: hidden;
+  }
+
+  .head {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    padding: 10px 12px;
+    background: var(--bg-soft);
+    border-bottom: 1px solid var(--border);
+    cursor: grab;
+    touch-action: none;
+    user-select: none;
+  }
+  .head:active {
+    cursor: grabbing;
+  }
+  .dot {
+    flex: none;
+    width: 8px;
+    height: 8px;
+    border-radius: 50%;
+    background: #b5bfcc;
+  }
+  .dot.running {
+    background: var(--primary);
+    animation: blink 1s infinite;
+  }
+  .dot.completed {
+    background: var(--success);
+  }
+  .dot.error {
+    background: var(--error);
+  }
+  .dot.stopped {
+    background: var(--warning);
+  }
+  /* 标题不被压缩，空间不足时由右侧状态文本省略 */
+  .title {
+    flex: 1 0 auto;
+    font-weight: 600;
+  }
+  .status {
+    min-width: 0;
+    overflow: hidden;
+    color: var(--text-3);
+    font-size: 12px;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  /* 占满头部与输入区之间的剩余高度（min-height:0 允许在 flex 列中收缩） */
+  .fill {
+    flex: 1;
+    min-height: 0;
+    overflow-y: auto;
+    overscroll-behavior: contain;
+  }
+  .settings-body,
+  .log-body {
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+    padding: 12px;
+  }
+
+  .muted {
+    color: var(--text-3);
+  }
+  .hint {
+    display: block;
+    color: var(--text-3);
+    font-size: 12px;
+  }
+  .meta {
+    color: var(--text-3);
+    font-size: 12px;
+    word-break: break-all;
+  }
+  .row {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 8px;
+  }
+
+  /* ---------- 按钮 ---------- */
+  .btn {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    gap: 4px;
+    height: 28px;
+    padding: 0 12px;
+    border: 1px solid #d0d7e2;
+    border-radius: 4px;
+    background: #fff;
+    color: var(--text);
+    font: inherit;
+    white-space: nowrap;
+    cursor: pointer;
+    transition: background 0.15s, border-color 0.15s, color 0.15s;
+  }
+  .btn:hover:not(:disabled) {
+    border-color: var(--primary);
+    color: var(--primary);
+  }
+  .btn:disabled {
+    cursor: not-allowed;
+    opacity: 0.5;
+  }
+  .btn.tiny {
+    height: 22px;
+    padding: 0 8px;
+    font-size: 12px;
+  }
+  .btn.round {
+    border-radius: 999px;
+  }
+  .btn.circle {
+    width: 28px;
+    padding: 0;
+    border-radius: 50%;
+  }
+  .btn.tiny.circle {
+    width: 22px;
+  }
+  .btn.primary {
+    border-color: var(--primary);
+    background: var(--primary);
+    color: #fff;
+  }
+  .btn.primary:hover:not(:disabled) {
+    color: #fff;
+    filter: brightness(1.08);
+  }
+  .btn.danger {
+    border-color: var(--error);
+    background: var(--error);
+    color: #fff;
+  }
+  .btn.danger:hover:not(:disabled) {
+    color: #fff;
+    filter: brightness(1.08);
+  }
+  /* 次要：浅色填充无边框 */
+  .btn.secondary {
+    border-color: transparent;
+    background: #eef1f5;
+  }
+  .btn.secondary.accent {
+    background: color-mix(in srgb, var(--primary) 12%, transparent);
+    color: var(--primary);
+  }
+  /* 幽灵：仅悬停时显示底色 */
+  .btn.ghost {
+    border-color: transparent;
+    background: transparent;
+  }
+  .btn.ghost:hover:not(:disabled) {
+    background: #eef1f5;
+    color: var(--text);
+  }
+  .btn.ghost.active {
+    color: var(--primary);
+  }
+
+  /* ---------- 复选框 ---------- */
+  .checkbox {
+    display: flex;
+    align-items: flex-start;
+    gap: 8px;
+    cursor: pointer;
+  }
+  .checkbox input {
+    flex: none;
+    margin: 3px 0 0;
+    accent-color: var(--primary);
+  }
+  .checkbox.disabled {
+    cursor: not-allowed;
+    opacity: 0.5;
+  }
+
+  /* ---------- 提示框 ---------- */
+  .alert {
+    padding: 8px 12px;
+    border: 1px solid;
+    border-radius: 6px;
+    word-break: break-word;
+  }
+  /* 正文保留模型返回的换行；pre-wrap 只放在正文上，模板缩进产生的空白不会被渲染 */
+  .alert-body {
+    white-space: pre-wrap;
+  }
+  .alert-title {
+    margin-bottom: 4px;
+    font-weight: 600;
+  }
+  .alert.success {
+    border-color: color-mix(in srgb, var(--success) 35%, transparent);
+    background: color-mix(in srgb, var(--success) 8%, #fff);
+  }
+  .alert.error {
+    border-color: color-mix(in srgb, var(--error) 35%, transparent);
+    background: color-mix(in srgb, var(--error) 8%, #fff);
+  }
+  .alert.warning {
+    border-color: color-mix(in srgb, var(--warning) 45%, transparent);
+    background: color-mix(in srgb, var(--warning) 10%, #fff);
+  }
+
+  /* ---------- 加载指示 ---------- */
+  .spin {
+    flex: none;
+    width: 14px;
+    height: 14px;
+    border: 2px solid color-mix(in srgb, var(--primary) 25%, transparent);
+    border-top-color: var(--primary);
+    border-radius: 50%;
+    animation: spin 0.8s linear infinite;
+  }
+  .activity {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    color: var(--primary);
+  }
+
+  /* ---------- 日志 ---------- */
+  .empty {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+  }
+  .chips {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 6px;
+  }
+  .chips-caption {
+    width: 100%;
+    color: var(--text-3);
+    font-size: 12px;
+  }
+  .task-source {
+    align-self: flex-end;
+    color: var(--text-3);
+    font-size: 12px;
+  }
+  /* 本次指令原文，右对齐以区分用户输入与执行日志 */
+  .task-bubble {
+    align-self: flex-end;
+    max-width: 88%;
+    padding: 6px 10px;
+    border-radius: 10px 10px 2px 10px;
+    background: var(--primary);
+    color: #fff;
+    white-space: pre-wrap;
+    word-break: break-word;
+  }
+
+  /* 时间线：左侧竖线 + 彩色节点 */
+  .timeline {
+    margin: 0;
+    padding: 0;
+    list-style: none;
+  }
+  .timeline li {
+    position: relative;
+    padding: 0 0 12px 20px;
+  }
+  .timeline li::before {
+    content: '';
+    position: absolute;
+    left: 4px;
+    top: 14px;
+    bottom: 0;
+    width: 1px;
+    background: var(--border);
+  }
+  .timeline li:last-child {
+    padding-bottom: 0;
+  }
+  .timeline li:last-child::before {
+    display: none;
+  }
+  .timeline-dot {
+    position: absolute;
+    left: 0;
+    top: 5px;
+    width: 9px;
+    height: 9px;
+    border: 2px solid var(--primary);
+    border-radius: 50%;
+    background: #fff;
+  }
+  .timeline-dot.success {
+    border-color: var(--success);
+  }
+  .timeline-dot.warning {
+    border-color: var(--warning);
+  }
+  .timeline-dot.error {
+    border-color: var(--error);
+  }
+  .step-action {
+    word-break: break-word;
+  }
+  .step-detail {
+    display: block;
+    color: var(--text-3);
+    font-size: 12px;
+    word-break: break-word;
+  }
+
+  /* ---------- 输入区：固定在面板底部，不随日志滚动 ---------- */
+  .composer {
+    position: relative;
+    flex: none;
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+    padding: 10px 12px 12px;
+    border-top: 1px solid var(--border);
+    background: #fafbfc;
+  }
+  /* 悬浮在输入区上沿（以 .composer 为定位参照） */
+  .jump-latest {
+    position: absolute;
+    right: 16px;
+    bottom: calc(100% + 8px);
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+  }
+  .input,
+  .textarea {
+    width: 100%;
+    padding: 4px 10px;
+    border: 1px solid #d0d7e2;
+    border-radius: 4px;
+    background: #fff;
+    color: var(--text);
+    font: inherit;
+    outline: none;
+    transition: border-color 0.15s, box-shadow 0.15s;
+  }
+  .input:focus,
+  .textarea:focus {
+    border-color: var(--primary);
+    box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary) 18%, transparent);
+  }
+  .textarea {
+    display: block;
+    /* 高度由脚本按内容在 2~6 行之间自适应 */
+    line-height: 20px;
+    resize: none;
+    overflow-y: auto;
+  }
+  .textarea:disabled {
+    background: var(--bg-soft);
+    cursor: not-allowed;
+  }
+  .input-group {
+    display: flex;
+    gap: 6px;
+    margin-top: 6px;
+  }
+  .input-group .input {
+    flex: 1;
+    min-width: 0;
+    height: 28px;
+  }
+
+  /* 托盘限高，内容多时在托盘内部滚动，不挤压输入框 */
+  .tray {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+    max-height: 180px;
+    padding: 8px;
+    overflow-y: auto;
+    border: 1px solid var(--border);
+    border-radius: 8px;
+    background: #fff;
+  }
+  .history-item {
+    display: flex;
+    align-items: center;
+    gap: 4px;
+  }
+  .history-task {
+    flex: 1;
+    min-width: 0;
+    justify-content: flex-start;
+    gap: 6px;
+  }
+  .history-text {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+  .ok {
+    color: var(--success);
+  }
+  .fail {
+    color: var(--error);
+  }
+
+  .toolbar {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+  }
+  /* 重跑 / 执行 / 终止 靠右 */
+  .push-right {
+    margin-left: auto;
+  }
+
+  @keyframes blink {
+    0%,
+    100% {
+      opacity: 1;
+    }
+    50% {
+      opacity: 0.25;
+    }
+  }
+  @keyframes spin {
+    to {
+      transform: rotate(360deg);
+    }
+  }
+`;
+
+//#endregion
+//#region src/ui/launcher.ts
+/**
+* <tz-page-use-launcher>：调试入口（可拖拽浮动按钮 + 指令面板）。
+* 与其它智能体共用 core/service 的单例状态：其它智能体下达的任务同样在此展示，可随时终止。
+* 默认隐藏 page-agent 自带面板与元素编号高亮，进度与提问改由本面板承接（设置里可开回）。
+*
+* 宿主元素须带 data-page-agent-ignore="true"（由 mountPageUseUI 设置）：
+* page-controller 在该属性上直接跳过整棵子树（含 shadow root），面板不会被模型当作页面元素。
+*/
+const PAGE_USE_LAUNCHER_TAG = "tz-page-use-launcher";
+/** 本面板下达任务时使用的来源标识 */
+const LAUNCHER_SOURCE = "launcher";
+const DEFAULT_SOURCE_LABELS = { unknown: "外部调用" };
+/** AgentStatus → 中文 */
+const STATUS_LABELS = {
+	idle: "就绪",
+	running: "执行中",
+	completed: "已完成",
+	error: "出错",
+	stopped: "已终止"
+};
+/** 入口默认位置：距视口右边/下边的距离（px） */
+const FAB_DEFAULT_RIGHT = 28;
+const FAB_DEFAULT_BOTTOM = 140;
+/** 面板宽度（px），与入口对齐及视口夹取计算共用 */
+const PANEL_WIDTH = 380;
+/** 面板期望高度（px），受视口 72vh 与锚点剩余空间约束 */
+const PANEL_HEIGHT = 560;
+/** 日志区距底部小于该值（px）视为贴底 */
+const STICK_THRESHOLD = 24;
+const TEXTAREA_MIN_ROWS = 2;
+/**
+* 步骤 → 时间线节点颜色：失败/报错为 error，完成为 success，
+* 向用户提问与重试为 warning，其余普通操作为 info（主色）。
+*/
+function stepType(step) {
+	if (step.failed || step.tool === "error") return "error";
+	if (step.tool === "done") return "success";
+	if (step.tool === "ask_user" || step.tool === "retry") return "warning";
+	return "info";
+}
+function toStyle(style) {
+	return Object.entries(style).map(([key, value]) => `${key}:${value}`).join(";");
+}
+var PageUseLauncherElement = class extends LitElement {
+	static styles = launcherStyles;
+	_config = {};
+	/** 面板配置；赋值后立即重新渲染 */
+	get config() {
+		return this._config;
+	}
+	set config(value) {
+		this._config = value || {};
+		this.requestUpdate();
+	}
+	open = false;
+	showSettings = false;
+	task = "";
+	answer = "";
+	tray = null;
+	/**
+	* 日志区跟随滚动：默认贴底跟随新内容；用户上翻后停止跟随，
+	* 回到底部附近（阈值内）或点击「最新」后恢复。
+	*/
+	stickToBottom = true;
+	/** 上次渲染时日志内容的摘要；仅内容变化时才贴底，避免每秒的耗时刷新把用户拉回底部 */
+	logSignature = "";
+	/** 下次渲染强制滚到底部（点击「最新」、任务开始） */
+	forceScroll = false;
+	/**
+	* 入口尺寸缓存：入口在面板展开时被隐藏，offsetWidth 为 0，
+	* 因此在可见时测量并保留最近一次结果；初值为「Page Use」文案下的近似尺寸。
+	*/
+	fabSize = {
+		width: 110,
+		height: 34
+	};
+	viewport = {
+		width: window.innerWidth,
+		height: window.innerHeight
+	};
+	/**
+	* 面板相对入口的对齐方式：入口在视口右半边则面板右边缘对齐入口右边缘，否则左对齐；
+	* 下半边则底边对齐（面板向上展开），否则顶边对齐。
+	* 仅在展开时计算一次并在展开期间保持，避免拖动面板越过中线时锚点切换导致跳动。
+	*/
+	panelAnchor = {
+		alignRight: true,
+		alignBottom: true
+	};
+	wasRunning = false;
+	cleanups = [];
+	get fabEl() {
+		return this.renderRoot.querySelector(".fab");
+	}
+	get panelEl() {
+		return this.renderRoot.querySelector(".panel");
+	}
+	get logEl() {
+		return this.renderRoot.querySelector(".log");
+	}
+	get textareaEl() {
+		return this.renderRoot.querySelector(".textarea");
+	}
+	fabDrag = createDrag({
+		getEl: () => this.fabEl,
+		getPos: () => pageUseSettings.get().fabPos,
+		setPos: (pos) => pageUseSettings.update({ fabPos: pos }),
+		onTap: () => {
+			this.measureFab();
+			this.resolvePanelAnchor();
+			this.open = true;
+			this.requestUpdate();
+		},
+		skipInteractive: false
+	});
+	/** 拖动面板时反推入口位置：面板锚定角即入口所在角，收起后入口停在面板原位置 */
+	panelDrag = createDrag({
+		getEl: () => this.panelEl,
+		getPos: () => null,
+		setPos: ({ x, y }) => {
+			const el = this.panelEl;
+			if (!el) return;
+			const { width: fabWidth, height: fabHeight } = this.fabSize;
+			const { alignRight, alignBottom } = this.panelAnchor;
+			pageUseSettings.update({ fabPos: {
+				x: alignRight ? x + el.offsetWidth - fabWidth : x,
+				y: alignBottom ? y + el.offsetHeight - fabHeight : y
+			} });
+		}
+	});
+	connectedCallback() {
+		super.connectedCallback();
+		this.wasRunning = isRunning();
+		this.cleanups = [
+			pageUseStore.subscribe((state) => this.onStateChange(state)),
+			pageUseSettings.store.subscribe(() => this.requestUpdate()),
+			pageUseHistory.store.subscribe(() => this.requestUpdate()),
+			registerQuestionUi()
+		];
+		window.addEventListener("resize", this.onResize);
+	}
+	disconnectedCallback() {
+		super.disconnectedCallback();
+		this.cleanups.forEach((off) => off());
+		this.cleanups = [];
+		window.removeEventListener("resize", this.onResize);
+	}
+	firstUpdated() {
+		this.measureFab();
+	}
+	updated(_changed) {
+		this.autosizeTextarea();
+		const state = pageUseStore.get();
+		const signature = [
+			state.currentTask,
+			state.steps.length,
+			state.activityText,
+			state.errorMessage,
+			state.lastResult?.taskId ?? "",
+			state.pendingQuestion?.question ?? ""
+		].join("
");
+		const contentChanged = signature !== this.logSignature;
+		this.logSignature = signature;
+		if (this.forceScroll || this.stickToBottom && contentChanged) {
+			this.forceScroll = false;
+			const log = this.logEl;
+			if (log) log.scrollTop = log.scrollHeight;
+		}
+	}
+	onStateChange(state) {
+		const running = isRunning(state);
+		if (running && !this.wasRunning) {
+			this.tray = null;
+			this.stickToBottom = true;
+			this.forceScroll = true;
+		}
+		this.wasRunning = running;
+		this.requestUpdate();
+	}
+	onResize = () => {
+		this.viewport = {
+			width: window.innerWidth,
+			height: window.innerHeight
+		};
+		if (!this.open) this.fabDrag.reclamp();
+		this.requestUpdate();
+	};
+	measureFab() {
+		const el = this.fabEl;
+		if (el?.offsetWidth) this.fabSize = {
+			width: el.offsetWidth,
+			height: el.offsetHeight
+		};
+	}
+	/** 入口在视口中的矩形；未拖动过时按默认 right/bottom 推算 */
+	fabRect(settings) {
+		const { width, height } = this.fabSize;
+		const left = settings.fabPos?.x ?? this.viewport.width - FAB_DEFAULT_RIGHT - width;
+		const top = settings.fabPos?.y ?? this.viewport.height - FAB_DEFAULT_BOTTOM - height;
+		return {
+			left,
+			top,
+			right: left + width,
+			bottom: top + height
+		};
+	}
+	resolvePanelAnchor() {
+		const rect = this.fabRect(pageUseSettings.get());
+		this.panelAnchor = {
+			alignRight: (rect.left + rect.right) / 2 > this.viewport.width / 2,
+			alignBottom: (rect.top + rect.bottom) / 2 > this.viewport.height / 2
+		};
+	}
+	/** 未拖动过时用默认角落定位，拖动后切换为 left/top */
+	fabStyle(settings) {
+		return toStyle(settings.fabPos ? {
+			left: `${settings.fabPos.x}px`,
+			top: `${settings.fabPos.y}px`
+		} : {
+			right: `${FAB_DEFAULT_RIGHT}px`,
+			bottom: `${FAB_DEFAULT_BOTTOM}px`
+		});
+	}
+	/** 面板位置完全由入口位置推导，展开时与入口重合于同一角 */
+	panelStyle(settings) {
+		const rect = this.fabRect(settings);
+		const { width: vw, height: vh } = this.viewport;
+		const { alignRight, alignBottom } = this.panelAnchor;
+		const maxOffsetX = Math.max(8, vw - PANEL_WIDTH - 8);
+		const clampX = (value) => Math.min(Math.max(8, value), maxOffsetX);
+		const style = { width: `${PANEL_WIDTH}px` };
+		if (alignRight) style.right = `${clampX(vw - rect.right)}px`;
+		else style.left = `${clampX(rect.left)}px`;
+		const offsetY = Math.max(8, alignBottom ? vh - rect.bottom : rect.top);
+		if (alignBottom) style.bottom = `${offsetY}px`;
+		else style.top = `${offsetY}px`;
+		style.height = `min(${PANEL_HEIGHT}px, 72vh, ${Math.max(240, vh - offsetY - 8)}px)`;
+		return toStyle(style);
+	}
+	async collapse() {
+		this.open = false;
+		this.requestUpdate();
+		await this.updateComplete;
+		this.measureFab();
+		this.fabDrag.reclamp();
+	}
+	async submit() {
+		const text = this.task.trim();
+		if (isRunning() || !text) return;
+		this.task = "";
+		this.requestUpdate();
+		await runTask(text, { source: LAUNCHER_SOURCE });
+	}
+	applyPreset(text) {
+		this.task = text;
+		this.submit();
+	}
+	lastTaskText(state) {
+		return state.currentTask || pageUseHistory.entries()[0]?.task || "";
+	}
+	/** 回车执行、Shift+回车换行；输入法组词中的回车不触发执行 */
+	onTaskKeydown(event) {
+		if (event.key !== "Enter" || event.shiftKey || event.isComposing) return;
+		event.preventDefault();
+		this.submit();
+	}
+	onTaskInput(event) {
+		this.task = event.target.value;
+		this.requestUpdate();
+	}
+	/** 按内容在 2~6 行之间调整输入框高度，超出后内部滚动 */
+	autosizeTextarea() {
+		const el = this.textareaEl;
+		if (!el) return;
+		const style = getComputedStyle(el);
+		const padding = (parseFloat(style.paddingTop) || 0) + (parseFloat(style.paddingBottom) || 0);
+		const border = (parseFloat(style.borderTopWidth) || 0) + (parseFloat(style.borderBottomWidth) || 0);
+		const min = 40 + padding + border;
+		const max = 120 + padding + border;
+		el.style.height = "auto";
+		el.style.height = `${Math.min(max, Math.max(min, el.scrollHeight + border))}px`;
+	}
+	submitAnswer() {
+		const text = this.answer.trim();
+		if (!text) return;
+		pageUseStore.get().pendingQuestion?.resolve(text);
+		this.answer = "";
+		this.requestUpdate();
+	}
+	onLogScroll(event) {
+		const el = event.target;
+		const stick = el.scrollHeight - el.scrollTop - el.clientHeight < STICK_THRESHOLD;
+		if (stick === this.stickToBottom) return;
+		this.stickToBottom = stick;
+		this.requestUpdate();
+	}
+	/**
+	* 滚轮上翻立即停止跟随：平滑滚动的首个 scroll 事件位移可能小于阈值，
+	* 若此时仍判定为贴底，内容刷新会把视图拉回底部，表现为上翻时抖动。
+	*/
+	onLogWheel(event) {
+		if (event.deltaY >= 0 || !this.stickToBottom) return;
+		this.stickToBottom = false;
+		this.requestUpdate();
+	}
+	scrollLogToBottom() {
+		this.stickToBottom = true;
+		this.forceScroll = true;
+		this.requestUpdate();
+	}
+	toggleTray(kind) {
+		this.tray = this.tray === kind ? null : kind;
+		this.requestUpdate();
+	}
+	onClearLog() {
+		clearPageUseLog();
+		this.tray = null;
+		this.stickToBottom = true;
+		this.requestUpdate();
+	}
+	sourceLabel(state) {
+		const source = state.currentSource;
+		if (!source || source === LAUNCHER_SOURCE) return "";
+		return {
+			...DEFAULT_SOURCE_LABELS,
+			...this._config.sourceLabels
+		}[source] || source;
+	}
+	presets() {
+		const limit = this._config.menuPresetLimit ?? 6;
+		const menus = getPageUseConfig()?.getMenus();
+		return [
+			...limit > 0 ? buildMenuPresets(menus, limit) : [],
+			...PAGE_USE_STATIC_PRESETS,
+			...this._config.presets || []
+		];
+	}
+	endpointLabel() {
+		const baseURL = getPageUseConfig()?.llm.baseURL;
+		if (!baseURL) return "未配置";
+		try {
+			return new URL(baseURL).host;
+		} catch {
+			return baseURL;
+		}
+	}
+	renderChips(presets, accent = false) {
+		return presets.map((preset) => html`<button
+        type="button"
+        class="btn tiny round secondary ${accent ? "accent" : ""}"
+        title=${preset.task}
+        @click=${() => this.applyPreset(preset.task)}
+      >
+        ${preset.label}
+      </button>`);
+	}
+	renderPresetGroups() {
+		const scenarios = this._config.scenarios || [];
+		return html`
+      <div class="chips">
+        <span class="chips-caption">常用</span>
+        ${this.renderChips(this.presets())}
+      </div>
+      ${scenarios.length ? html`<div class="chips">
+            <span class="chips-caption">复杂场景</span>
+            ${this.renderChips(scenarios, true)}
+          </div>` : nothing}
+    `;
+	}
+	renderCheckbox(key, label, hint, disabled = false) {
+		const settings = pageUseSettings.get();
+		return html`<label class="checkbox ${disabled ? "disabled" : ""}">
+      <input
+        type="checkbox"
+        .checked=${Boolean(settings[key])}
+        ?disabled=${disabled}
+        @change=${(e) => pageUseSettings.update({ [key]: e.target.checked })}
+      />
+      <span>${label}${hint ? html`<span class="hint">${hint}</span>` : nothing}</span>
+    </label>`;
+	}
+	renderSettings() {
+		const settings = pageUseSettings.get();
+		const config = getPageUseConfig();
+		return html`<div class="fill">
+      <div class="settings-body">
+        ${this.renderCheckbox("showBuiltinPanel", "显示 page-agent 自带面板", "关闭后由本面板展示进度")}
+        ${this.renderCheckbox("showHighlights", "显示元素编号高亮", "运行时页面上带数字的彩色框")}
+        ${this.renderCheckbox("enableMask", "运行时蒙层防误触", "下次任务开始生效")}
+        ${this.renderCheckbox("customMaskEffect", "定制光晕与光标配色", "关闭后恢复 page-agent 默认效果", !settings.enableMask)}
+        ${config?.beforeTask ? this.renderCheckbox("enableBeforeTask", config.beforeTaskLabel) : nothing}
+        ${this.renderCheckbox("showStepDetails", "步骤显示模型思考与返回")}
+        <div class="row">
+          <button type="button" class="btn" @click=${() => pageUseSettings.resetPositions()}>
+            复位窗口
+          </button>
+          <button type="button" class="btn" @click=${() => pageUseHistory.clear()}>清空历史</button>
+        </div>
+        <span class="meta">端点 ${this.endpointLabel()} · 模型 ${config?.llm.model ?? "-"}</span>
+      </div>
+    </div>`;
+	}
+	renderLog(state, isLogEmpty) {
+		const running = isRunning(state);
+		const showDetails = pageUseSettings.get().showStepDetails;
+		const sourceLabel = this.sourceLabel(state);
+		return html`<div class="fill log" @scroll=${this.onLogScroll} @wheel=${this.onLogWheel}>
+      <div class="log-body">
+        ${isLogEmpty ? html`<div class="empty">
+              <strong>用自然语言操作当前系统页面</strong>
+              <span class="hint">可直接输入指令，或从下方快捷指令开始</span>
+              ${this.renderPresetGroups()}
+            </div>` : html`
+              ${state.currentTask && sourceLabel ? html`<span class="task-source">来自${sourceLabel}</span>` : nothing}
+              ${state.currentTask ? html`<div class="task-bubble">${state.currentTask}</div>` : nothing}
+              ${state.steps.length ? html`<ol class="timeline">
+                    ${state.steps.map((step) => html`<li>
+                        <span class="timeline-dot ${stepType(step)}"></span>
+                        <span class="step-action">${step.action}</span>
+                        ${showDetails && step.goal ? html`<span class="step-detail">${step.goal}</span>` : nothing}
+                        ${showDetails && step.output ? html`<span class="step-detail">${step.output}</span>` : nothing}
+                      </li>`)}
+                  </ol>` : nothing}
+              ${running && state.activityText ? html`<div class="activity"><span class="spin"></span>${state.activityText}</div>` : nothing}
+              ${state.errorMessage ? html`<div class="alert error">
+                    <div class="alert-body">${state.errorMessage}</div>
+                  </div>` : state.lastResult && !running ? html`<div class="alert ${state.lastResult.success ? "success" : "error"}">
+                      <div class="alert-title">${state.lastResult.success ? "已完成" : "未完成"}</div>
+                      ${state.lastResult.summary ? html`<div class="alert-body">${state.lastResult.summary}</div>` : nothing}
+                    </div>` : nothing}
+            `}
+      </div>
+    </div>`;
+	}
+	renderTray() {
+		if (this.tray === "presets") return html`<div class="tray">${this.renderPresetGroups()}</div>`;
+		const entries = pageUseHistory.entries();
+		return html`<div class="tray">
+      ${entries.length ? nothing : html`<span class="hint">暂无历史指令</span>`}
+      ${entries.map((entry) => html`<div class="history-item">
+          <button
+            type="button"
+            class="btn ghost history-task"
+            title=${entry.summary || entry.task}
+            @click=${() => this.applyPreset(entry.task)}
+          >
+            <span class=${entry.success === false ? "fail" : "ok"}>
+              ${entry.success === false ? "✕" : "✓"}
+            </span>
+            <span class="history-text">${entry.task}</span>
+          </button>
+          <button
+            type="button"
+            class="btn ghost tiny circle"
+            title="删除"
+            @click=${() => pageUseHistory.remove(entry.id)}
+          >
+            ×
+          </button>
+        </div>`)}
+    </div>`;
+	}
+	renderComposer(state, isLogEmpty) {
+		const running = isRunning(state);
+		const lastTask = this.lastTaskText(state);
+		const historyCount = pageUseHistory.entries().length;
+		const question = state.pendingQuestion;
+		return html`<footer class="composer">
+      ${!this.stickToBottom && !isLogEmpty ? html`<button
+            type="button"
+            class="btn tiny round jump-latest"
+            @click=${() => this.scrollLogToBottom()}
+          >
+            ↓ 最新
+          </button>` : nothing}
+      ${question ? html`<div class="alert warning">
+            <div class="alert-title">${question.question}</div>
+            <div class="input-group">
+              <input
+                class="input"
+                placeholder="输入回答后回车"
+                .value=${this.answer}
+                @input=${(e) => {
+			this.answer = e.target.value;
+		}}
+                @keydown=${(e) => {
+			if (e.key === "Enter" && !e.isComposing) {
+				e.preventDefault();
+				this.submitAnswer();
+			}
+		}}
+              />
+              <button type="button" class="btn primary" @click=${() => this.submitAnswer()}>
+                回答
+              </button>
+            </div>
+          </div>` : nothing}
+      ${this.tray && !running ? this.renderTray() : nothing}
+      <textarea
+        class="textarea"
+        rows=${TEXTAREA_MIN_ROWS}
+        placeholder=${running ? "执行中，可点击「终止」中断" : "输入指令，回车执行，Shift+回车换行"}
+        ?disabled=${running}
+        .value=${this.task}
+        @input=${this.onTaskInput}
+        @keydown=${this.onTaskKeydown}
+      ></textarea>
+      <div class="toolbar">
+        <button
+          type="button"
+          class="btn tiny ${this.tray === "presets" ? "secondary accent" : "ghost"}"
+          ?disabled=${running}
+          @click=${() => this.toggleTray("presets")}
+        >
+          快捷指令
+        </button>
+        <button
+          type="button"
+          class="btn tiny ${this.tray === "history" ? "secondary accent" : "ghost"}"
+          ?disabled=${running}
+          @click=${() => this.toggleTray("history")}
+        >
+          历史${historyCount ? `（${historyCount}）` : ""}
+        </button>
+        <button
+          type="button"
+          class="btn tiny ghost"
+          ?disabled=${running || isLogEmpty}
+          title="清空上方执行记录（历史指令保留）"
+          @click=${this.onClearLog}
+        >
+          清屏
+        </button>
+        ${running ? html`<button type="button" class="btn danger push-right" @click=${() => void stopTask()}>
+              终止
+            </button>` : html`
+              <button
+                type="button"
+                class="btn push-right"
+                ?disabled=${!lastTask}
+                title=${lastTask ? `重跑：${lastTask}` : "暂无可重跑的指令"}
+                @click=${() => lastTask && this.applyPreset(lastTask)}
+              >
+                重跑
+              </button>
+              <button
+                type="button"
+                class="btn primary"
+                ?disabled=${!this.task.trim()}
+                @click=${() => void this.submit()}
+              >
+                执行
+              </button>
+            `}
+      </div>
+    </footer>`;
+	}
+	render() {
+		const state = pageUseStore.get();
+		const settings = pageUseSettings.get();
+		const running = isRunning(state);
+		const title = this._config.title || "Page Use";
+		const elapsed = getElapsedSeconds(state);
+		const isLogEmpty = !running && !state.currentTask && !state.steps.length && !state.errorMessage;
+		return html`
+      <button
+        type="button"
+        class="fab ${running ? "running" : ""}"
+        ?hidden=${this.open}
+        style=${this.fabStyle(settings)}
+        title=${running ? `执行中：${state.activityText || state.currentTask}` : `打开 ${title} 页面操作`}
+        @pointerdown=${this.fabDrag.onPointerDown}
+      >
+        <span class="fab-dot"></span>
+        <span>${running ? "执行中" : title}</span>
+      </button>
+
+      <section class="panel" ?hidden=${!this.open} style=${this.open ? this.panelStyle(settings) : ""}>
+        <header class="head" @pointerdown=${this.panelDrag.onPointerDown}>
+          <span class="dot ${state.status}"></span>
+          <span class="title">${title}</span>
+          <span class="status">
+            ${STATUS_LABELS[state.status] || state.status}${state.steps.length ? ` · ${state.steps.length} 步` : ""}${state.totalTokens ? ` · ${state.totalTokens} tok` : ""}${elapsed ? ` · ${elapsed}s` : ""}
+          </span>
+          <button
+            type="button"
+            class="btn ghost circle ${this.showSettings ? "active" : ""}"
+            title=${this.showSettings ? "返回" : "设置"}
+            @click=${() => {
+			this.showSettings = !this.showSettings;
+			this.requestUpdate();
+		}}
+          >
+            ⚙
+          </button>
+          <button type="button" class="btn ghost circle" title="收起" @click=${() => void this.collapse()}>
+            −
+          </button>
+        </header>
+        ${this.showSettings ? this.renderSettings() : html`${this.renderLog(state, isLogEmpty)}${this.renderComposer(state, isLogEmpty)}`}
+      </section>
+    `;
+	}
+};
+
+//#endregion
+//#region src/ui/mount.ts
+/**
+* UI 挂载：注册自定义元素，并把光晕层与调试面板挂到 document.body。
+* 框架无关，Vue / React / 原生页面均可直接调用。
+*/
+/** 注册 <tz-page-use-glow> 与 <tz-page-use-launcher>；重复调用安全（已注册则跳过） */
+function definePageUseElements() {
+	if (typeof customElements === "undefined") return;
+	if (!customElements.get("tz-page-use-glow")) customElements.define(PAGE_USE_GLOW_TAG, PageUseGlowElement);
+	if (!customElements.get("tz-page-use-launcher")) customElements.define(PAGE_USE_LAUNCHER_TAG, PageUseLauncherElement);
+}
+/**
+* 挂载 UI，返回卸载函数。
+* 外层容器带 data-page-agent-ignore="true"（值必须为字符串 "true"）：
+* page-controller 按 dataset 值精确判断后跳过整棵子树，面板与光晕不会被模型当作页面元素。
+*/
+function mountPageUseUI(options = {}) {
+	if (typeof document === "undefined") return () => {};
+	definePageUseElements();
+	const root = document.createElement("div");
+	root.setAttribute("data-page-agent-ignore", "true");
+	root.setAttribute("data-browser-use-ignore", "true");
+	root.setAttribute("data-page-use-root", "");
+	if (options.glow !== false) root.appendChild(document.createElement(PAGE_USE_GLOW_TAG));
+	if (options.launcher) {
+		const launcher = document.createElement(PAGE_USE_LAUNCHER_TAG);
+		launcher.config = typeof options.launcher === "object" ? options.launcher : {};
+		root.appendChild(launcher);
+	}
+	(options.container || document.body).appendChild(root);
+	return () => {
+		root.remove();
+	};
+}
+
+//#endregion
+export { DEFAULT_MODEL as A, pageUseStore as C, SIMULATOR_MASK_ID as D, PAGE_USE_MASK_COLORS as E, DEFAULT_STORAGE_KEY_PREFIX as M, normalizeOptions as N, pageUseHistory as O, readLauncherSwitch as P, isRunning as S, pageUseSettings as T, pageUseCapability as _, PAGE_USE_STATIC_PRESETS as a, getPageUseConfig as b, PageUseGlowElement as c, PAGE_USE_COMMAND_TYPE as d, PAGE_USE_TOOL as f, runPageUseTool as g, isPageUseCommand as h, PageUseLauncherElement as i, DEFAULT_SESSION_HEADER as j, DEFAULT_MAX_STEPS as k, createPageUse as l, formatPageUseResultForModel as m, mountPageUseUI as n, buildMenuPresets as o, PAGE_USE_TOOL_NAME as p, PAGE_USE_LAUNCHER_TAG as r, PAGE_USE_GLOW_TAG as s, definePageUseElements as t, PAGE_USE_GLOBAL_KEY as u, clearPageUseLog as v, DEFAULT_PAGE_USE_SETTINGS as w, isPageUseConfigured as x, getElapsedSeconds as y };