page-agent 0.0.7 → 0.0.9

package/dist/lib/page-agent.js

@@ -1,38 +1,26 @@
-(function() {
-  "use strict";
-  try {
-    if (typeof document != "undefined") {
-      var elementStyle = document.createElement("style");
-      elementStyle.appendChild(document.createTextNode("._wrapper_1j0ct_1 {\n	position: fixed;\n	bottom: 100px;\n	left: 50%;\n	transform: translateX(-50%) translateY(20px);\n	opacity: 0;\n	z-index: 2147483642; /* 比 SimulatorMask 高一层 */\n	box-sizing: border-box;\n\n	overflow: visible;\n\n	* {\n		box-sizing: border-box;\n	}\n\n	--width: 360px;\n	--height: 40px;\n	--border-radius: 12px;\n\n	--side-space: 12px; /* 控制栏两侧的间距 */\n	--history-width: calc(var(--width) - var(--side-space) * 2);\n\n	--color-1: rgb(57, 182, 255);\n	--color-2: rgb(189, 69, 251);\n	--color-3: rgb(255, 87, 51);\n	--color-4: rgb(255, 214, 0);\n\n	width: var(--width);\n	height: var(--height);\n\n	transition: all 0.3s ease-in-out;\n\n	/* 响应式设计 */\n	@media (max-width: 480px) {\n		width: calc(100vw - 40px);\n		--width: calc(100vw - 40px);\n	}\n\n	._background_1j0ct_39 {\n		position: absolute;\n		inset: -2px -8px;\n		border-radius: calc(var(--border-radius) + 4px);\n		filter: blur(16px);\n		overflow: hidden;\n		/* mix-blend-mode: lighten; */\n		/* display: none; */\n\n		&::before {\n			content: '';\n			z-index: -1;\n			pointer-events: none;\n			position: absolute;\n			width: 100%;\n			height: 100%;\n			/* left: -100%; */\n			left: 0;\n			top: 0;\n\n			background-image: linear-gradient(\n				to bottom left,\n				var(--color-1),\n				var(--color-2),\n				var(--color-1)\n			);\n			animation: _mask-running_1j0ct_1 2s linear infinite;\n		}\n		&::after {\n			content: '';\n			z-index: -1;\n			pointer-events: none;\n			position: absolute;\n			width: 100%;\n			height: 100%;\n			left: 0;\n			top: 0;\n\n			background-image: linear-gradient(\n				to bottom left,\n				var(--color-2),\n				var(--color-1),\n				var(--color-2)\n			);\n			animation: _mask-running_1j0ct_1 2s linear infinite;\n			animation-delay: 1s;\n		}\n	}\n}\n\n@keyframes _mask-running_1j0ct_1 {\n	from {\n		transform: translateX(-100%);\n	}\n	to {\n		transform: translateX(100%);\n	}\n}\n\n/* 控制栏 */\n._header_1j0ct_99 {\n	display: flex;\n	align-items: center;\n	justify-content: space-between;\n	padding: 8px 12px;\n	user-select: none;\n\n	position: absolute;\n	inset: 0;\n\n	cursor: pointer;\n	flex-shrink: 0; /* 防止 header 被压缩 */\n\n	background: rgba(0, 0, 0, 0.5);\n	backdrop-filter: blur(10px);\n	border-radius: var(--border-radius);\n	background-clip: padding-box;\n\n	box-shadow:\n		0 0 0px 2px rgba(255, 255, 255, 0.4),\n		0 0 5px 1px rgba(255, 255, 255, 0.3);\n\n	._statusSection_1j0ct_121 {\n		display: flex;\n		align-items: center;\n		gap: 8px;\n		flex: 1;\n		min-height: 24px; /* 确保垂直居中 */\n\n		._indicator_1j0ct_128 {\n			width: 6px;\n			height: 6px;\n			border-radius: 50%;\n			background: rgba(255, 255, 255, 0.5);\n			flex-shrink: 0;\n			animation: none; /* 默认无动画 */\n\n			/* 运行状态 - 有动画 */\n			&._thinking_1j0ct_137 {\n				background: rgb(57, 182, 255);\n				animation: _pulse_1j0ct_1 0.8s ease-in-out infinite;\n			}\n\n			&._tool_executing_1j0ct_142 {\n				background: rgb(189, 69, 251);\n				animation: _pulse_1j0ct_1 0.6s ease-in-out infinite;\n			}\n\n			&._retry_1j0ct_147 {\n				background: rgb(255, 214, 0);\n				animation: _retryPulse_1j0ct_1 1s ease-in-out infinite;\n			}\n\n			/* 静止状态 - 无动画 */\n			&._completed_1j0ct_153,\n			&._input_1j0ct_154,\n			&._output_1j0ct_155 {\n				background: rgb(34, 197, 94);\n				animation: none;\n			}\n\n			&._error_1j0ct_160 {\n				background: rgb(239, 68, 68);\n				animation: none;\n			}\n		}\n\n		._statusText_1j0ct_166 {\n			color: white;\n			font-size: 12px;\n			line-height: 1;\n			font-weight: 500;\n			transition: all 0.3s ease-in-out;\n			position: relative;\n			overflow: hidden;\n			display: flex;\n			align-items: center;\n			min-height: 24px; /* 确保垂直居中 */\n\n			&._fadeOut_1j0ct_178 {\n				animation: _statusTextFadeOut_1j0ct_1 0.3s ease forwards;\n			}\n\n			&._fadeIn_1j0ct_182 {\n				animation: _statusTextFadeIn_1j0ct_1 0.3s ease forwards;\n			}\n		}\n	}\n\n	._controls_1j0ct_188 {\n		display: flex;\n		align-items: center;\n		gap: 4px;\n\n		._controlButton_1j0ct_193 {\n			width: 24px;\n			height: 24px;\n			border: none;\n			border-radius: 4px;\n			background: rgba(255, 255, 255, 0.1);\n			color: white;\n			cursor: pointer;\n			display: flex;\n			align-items: center;\n			justify-content: center;\n			font-size: 12px;\n			line-height: 1;\n\n			&:hover {\n				background: rgba(255, 255, 255, 0.2);\n			}\n		}\n\n		._pauseButton_1j0ct_212 {\n			font-weight: 600;\n			&._paused_1j0ct_214 {\n				background: rgba(34, 197, 94, 0.2); /* 绿色背景表示可以继续 */\n				color: rgb(34, 197, 94);\n\n				&:hover {\n					background: rgba(34, 197, 94, 0.3);\n				}\n			}\n		}\n\n		._stopButton_1j0ct_224 {\n			background: rgba(239, 68, 68, 0.2);\n			color: rgb(255, 41, 41);\n			font-weight: 600;\n\n			&:hover {\n				background: rgba(239, 68, 68, 0.3);\n			}\n		}\n	}\n}\n\n@keyframes _statusTextFadeIn_1j0ct_1 {\n	0% {\n		opacity: 0;\n		transform: translateY(5px);\n	}\n	100% {\n		opacity: 1;\n		transform: translateY(0);\n	}\n}\n\n@keyframes _statusTextFadeOut_1j0ct_1 {\n	0% {\n		opacity: 1;\n		transform: translateY(0);\n	}\n	100% {\n		opacity: 0;\n		transform: translateY(-5px);\n	}\n}\n\n._historySectionWrapper_1j0ct_258 {\n	position: absolute;\n	width: var(--history-width);\n	bottom: var(--height);\n	left: var(--side-space);\n	z-index: -2;\n\n	padding-top: 0px;\n	visibility: collapse;\n	overflow: hidden;\n\n	transition: all 0.2s;\n\n	background: rgba(2, 0, 20, 0.5);\n	/* background: rgba(186, 186, 186, 0.2); */\n	backdrop-filter: blur(10px);\n\n	text-shadow: 0 0 1px rgba(0, 0, 0, 0.2);\n\n	border-top-left-radius: calc(var(--border-radius) + 4px);\n	border-top-right-radius: calc(var(--border-radius) + 4px);\n\n	/* border: 2px solid rgba(255, 255, 255, 0.8); */\n	border: 2px solid rgba(255, 255, 255, 0.4);\n	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.6);\n\n	/* @media (prefers-color-scheme: dark) {\n		box-shadow:\n			0 8px 32px 0 rgba(0, 0, 0, 0.85),\n			0 2px 12px 0 rgba(57, 182, 255, 0.1);\n	} */\n\n	._expanded_1j0ct_290 & {\n		padding-top: 8px;\n		visibility: visible;\n	}\n\n	._historySection_1j0ct_258 {\n		position: relative;\n		overflow-y: auto;\n		overscroll-behavior: contain;\n		scrollbar-width: none;\n		max-height: 0;\n		padding-inline: 8px;\n\n		transition: max-height 0.2s;\n\n		._expanded_1j0ct_290 & {\n			max-height: 400px;\n		}\n\n		._historyItem_1j0ct_309 {\n			/* backdrop-filter: blur(10px); */\n			padding: 8px 10px;\n			margin-bottom: 6px;\n			background: linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.03));\n			border-radius: 8px;\n			border-left: 2px solid rgba(57, 182, 255, 0.5);\n			font-size: 12px;\n			color: white;\n			/* color: black; */\n			line-height: 1.3;\n			position: relative;\n			overflow: hidden;\n\n			/* 微妙的内阴影 */\n			box-shadow:\n				inset 0 1px 0 rgba(255, 255, 255, 0.1),\n				0 1px 3px rgba(0, 0, 0, 0.1);\n\n			&::before {\n				content: '';\n				position: absolute;\n				top: 0;\n				left: 0;\n				right: 0;\n				height: 1px;\n				background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);\n			}\n\n			&:hover {\n				background: linear-gradient(135deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.06));\n				/* transform: translateY(-1px); */\n				box-shadow:\n					inset 0 1px 0 rgba(255, 255, 255, 0.15),\n					0 2px 4px rgba(0, 0, 0, 0.15);\n			}\n\n			&:last-child {\n				margin-bottom: 10px;\n			}\n\n			&._completed_1j0ct_153,\n			&._input_1j0ct_154,\n			&._output_1j0ct_155 {\n				border-left-color: rgb(34, 197, 94);\n				background: linear-gradient(135deg, rgba(34, 197, 94, 0.1), rgba(34, 197, 94, 0.05));\n			}\n\n			&._error_1j0ct_160 {\n				border-left-color: rgb(239, 68, 68);\n				background: linear-gradient(135deg, rgba(239, 68, 68, 0.1), rgba(239, 68, 68, 0.05));\n			}\n\n			&._retry_1j0ct_147 {\n				border-left-color: rgb(255, 214, 0);\n				background: linear-gradient(135deg, rgba(255, 214, 0, 0.1), rgba(255, 214, 0, 0.05));\n			}\n\n			/* 突出显示 done 成功结果 */\n			&._doneSuccess_1j0ct_368 {\n				background: linear-gradient(\n					135deg,\n					rgba(34, 197, 94, 0.25),\n					rgba(34, 197, 94, 0.15),\n					rgba(34, 197, 94, 0.08)\n				);\n				border: none;\n				border-left: 4px solid rgb(34, 197, 94);\n				box-shadow:\n					0 4px 12px rgba(34, 197, 94, 0.3),\n					inset 0 1px 0 rgba(255, 255, 255, 0.2),\n					0 0 20px rgba(34, 197, 94, 0.1);\n				font-weight: 600;\n				color: rgb(220, 252, 231);\n				padding: 10px 12px;\n				margin-bottom: 8px;\n				border-radius: 8px;\n				position: relative;\n				overflow: hidden;\n\n				&::before {\n					background: linear-gradient(90deg, transparent, rgba(34, 197, 94, 0.4), transparent);\n				}\n\n				&::after {\n					content: '';\n					position: absolute;\n					top: 0;\n					left: -100%;\n					width: 100%;\n					height: 100%;\n					background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);\n					animation: _shimmer_1j0ct_1 2s ease-in-out infinite;\n				}\n\n				._historyContent_1j0ct_404 {\n					._statusIcon_1j0ct_405 {\n						font-size: 16px;\n						animation: _celebrate_1j0ct_1 0.8s ease-in-out;\n						filter: drop-shadow(0 2px 4px rgba(34, 197, 94, 0.5));\n					}\n				}\n			}\n\n			/* 突出显示 done 失败结果 */\n			&._doneError_1j0ct_414 {\n				background: linear-gradient(\n					135deg,\n					rgba(239, 68, 68, 0.25),\n					rgba(239, 68, 68, 0.15),\n					rgba(239, 68, 68, 0.08)\n				);\n				border: none;\n				border-left: 4px solid rgb(239, 68, 68);\n				box-shadow:\n					0 4px 12px rgba(239, 68, 68, 0.3),\n					inset 0 1px 0 rgba(255, 255, 255, 0.2),\n					0 0 20px rgba(239, 68, 68, 0.1);\n				font-weight: 600;\n				color: rgb(254, 226, 226);\n				padding: 10px 12px;\n				margin-bottom: 8px;\n				border-radius: 8px;\n				position: relative;\n				overflow: hidden;\n\n				&::before {\n					background: linear-gradient(90deg, transparent, rgba(239, 68, 68, 0.4), transparent);\n				}\n\n				._historyContent_1j0ct_404 {\n					._statusIcon_1j0ct_405 {\n						font-size: 16px;\n						filter: drop-shadow(0 2px 4px rgba(239, 68, 68, 0.5));\n					}\n				}\n			}\n\n			._historyContent_1j0ct_404 {\n				display: flex;\n				align-items: center;\n				gap: 8px;\n\n				word-break: break-all;\n				white-space: pre-wrap;\n\n				/* overflow-x: auto; */\n\n				._statusIcon_1j0ct_405 {\n					font-size: 12px;\n					flex-shrink: 0;\n					line-height: 1;\n					transition: all 0.3s ease;\n				}\n			}\n\n			._historyMeta_1j0ct_465 {\n				font-size: 10px;\n				color: rgba(255, 255, 255, 0.6);\n				/* color: rgb(61, 61, 61); */\n				margin-top: 8px;\n				line-height: 1;\n			}\n		}\n	}\n}\n\n/* 动画关键帧 - 更快的闪烁 */\n@keyframes _pulse_1j0ct_1 {\n	0%,\n	100% {\n		opacity: 1;\n		transform: scale(1);\n	}\n	50% {\n		opacity: 0.4;\n		transform: scale(1.3);\n	}\n}\n\n/* 重试动画 - 旋转脉冲 */\n@keyframes _retryPulse_1j0ct_1 {\n	0%,\n	100% {\n		opacity: 1;\n		transform: scale(1) rotate(0deg);\n	}\n	25% {\n		opacity: 0.6;\n		transform: scale(1.2) rotate(90deg);\n	}\n	50% {\n		opacity: 0.8;\n		transform: scale(1.1) rotate(180deg);\n	}\n	75% {\n		opacity: 0.6;\n		transform: scale(1.2) rotate(270deg);\n	}\n}\n\n/* 庆祝动画 */\n@keyframes _celebrate_1j0ct_1 {\n	0%,\n	100% {\n		transform: scale(1);\n	}\n	25% {\n		transform: scale(1.2) rotate(-5deg);\n	}\n	75% {\n		transform: scale(1.2) rotate(5deg);\n	}\n}\n\n/* done 卡片的光泽效果 */\n@keyframes _shimmer_1j0ct_1 {\n	0% {\n		left: -100%;\n	}\n	100% {\n		left: 100%;\n	}\n}\n\n/* 输入区域样式 */\n._inputSectionWrapper_1j0ct_535 {\n	position: absolute;\n	width: var(--history-width);\n	top: var(--height);\n	left: var(--side-space);\n	z-index: -1;\n\n	visibility: visible;\n	overflow: hidden;\n\n	height: 48px;\n\n	transition: all 0.2s;\n\n	background: rgba(186, 186, 186, 0.2);\n	backdrop-filter: blur(10px);\n\n	border-bottom-left-radius: calc(var(--border-radius) + 4px);\n	border-bottom-right-radius: calc(var(--border-radius) + 4px);\n\n	border: 2px solid rgba(255, 255, 255, 0.3);\n	box-shadow: 0 1px 16px rgba(0, 0, 0, 0.4);\n\n	&._hidden_1j0ct_558 {\n		visibility: collapse;\n		height: 0;\n	}\n\n	._inputSection_1j0ct_535 {\n		display: flex;\n		align-items: center;\n		gap: 4px;\n		padding: 8px 8px;\n\n		._taskInput_1j0ct_569 {\n			flex: 1;\n			background: rgba(255, 255, 255, 0.4);\n			border: 1px solid rgba(255, 255, 255, 0.3);\n			border-radius: 10px;\n			padding-inline: 10px;\n			color: rgb(20, 20, 20);\n			font-size: 12px;\n			height: 28px;\n			line-height: 1;\n			outline: none;\n			transition: all 0.2s ease;\n\n			/* text-shadow: 0 0 2px rgba(255, 255, 255, 0.8); */\n\n			/* border-color: rgba(57, 182, 255, 0.3); */\n\n			&::placeholder {\n				color: rgb(53, 53, 53);\n			}\n\n			&:focus {\n				background: rgba(255, 255, 255, 0.8);\n				border-color: rgba(57, 182, 255, 0.6);\n				box-shadow: 0 0 0 2px rgba(57, 182, 255, 0.2);\n			}\n		}\n	}\n}\n._wrapper_1oy2s_1 {\n	position: fixed;\n	inset: 0;\n	z-index: 2147483641; /* 确保在所有元素之上，除了 panel */\n	/* pointer-events: none; */\n	cursor: not-allowed;\n	overflow: hidden;\n\n	display: none;\n}\n/* AI 光标样式 */\n._cursor_1vrf3_2 {\n	position: absolute;\n	width: var(--cursor-size, 75px);\n	height: var(--cursor-size, 75px);\n	pointer-events: none;\n	z-index: 10000;\n	transform: translate(-30%, -30%);\n\n	animation: _cursor-enter_1vrf3_1 300ms ease-out forwards;\n}\n\n._cursorBorder_1vrf3_13 {\n	position: absolute;\n	inset: 0;\n	background: linear-gradient(45deg, rgb(57, 182, 255), rgb(189, 69, 251));\n	mask-image: url(https://img.alicdn.com/imgextra/i1/O1CN01YHLVYR1LvqWIyo5kH_!!6000000001362-2-tps-202-202.png);\n	mask-size: 100% 100%;\n	mask-repeat: no-repeat;\n	animation: _cursor-breathe_1vrf3_1 2s ease-in-out infinite;\n}\n\n._cursorFilling_1vrf3_23 {\n	position: absolute;\n	inset: 0;\n	background: url(https://img.alicdn.com/imgextra/i3/O1CN01JZOqOS1Tu1sIKbPLW_!!6000000002441-2-tps-202-202.png);\n	background-size: 100% 100%;\n	background-repeat: no-repeat;\n}\n\n._cursorRipple_1vrf3_31 {\n	position: absolute;\n	inset: 0;\n	pointer-events: none;\n}\n\n._cursor_1vrf3_2._clicking_1vrf3_37 ._cursorRipple_1vrf3_31::after {\n	content: '';\n	position: absolute;\n	width: 100%;\n	height: 100%;\n	left: -30%;\n	top: -30%;\n	border: 4px solid rgba(57, 182, 255, 1);\n	border-radius: 50%;\n	animation: _cursor-ripple_1vrf3_1 300ms ease-out forwards;\n}\n\n/* 光标动画关键帧 */\n@keyframes _cursor-breathe_1vrf3_1 {\n	0%,\n	100% {\n		transform: scale(1);\n		opacity: 0.9;\n	}\n	50% {\n		transform: scale(1.05);\n		opacity: 1;\n	}\n}\n\n@keyframes _cursor-rotate_1vrf3_1 {\n	0% {\n		transform: rotate(0deg);\n	}\n	100% {\n		transform: rotate(360deg);\n	}\n}\n\n@keyframes _cursor-enter_1vrf3_1 {\n	0% {\n		transform: translate(-30%, -30%) scale(0.5);\n		opacity: 0;\n	}\n	100% {\n		transform: translate(-30%, -30%) scale(1);\n		opacity: 1;\n	}\n}\n\n@keyframes _cursor-ripple_1vrf3_1 {\n	0% {\n		transform: scale(0);\n		opacity: 1;\n	}\n	100% {\n		transform: scale(2);\n		opacity: 0;\n	}\n}"));
-      document.head.appendChild(elementStyle);
-    }
-  } catch (e) {
-    console.error("vite-plugin-css-injected-by-js", e);
-  }
-})();
 var __defProp2 = Object.defineProperty;
-var __typeError = (msg) => {
+var __typeError2 = (msg) => {
   throw TypeError(msg);
 };
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __defNormalProp2 = (obj, key, value) => key in obj ? __defProp2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __name2 = (target, value) => __defProp2(target, "name", { value, configurable: true });
-var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
-var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
-var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
-var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
-var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
-var __PageController, _bus, _wrapper, _indicator, _statusText, _historySection, _expandButton, _pauseButton, _stopButton, _inputSection, _taskInput, _bus2, _state, _isExpanded, _pageAgent, _userAnswerResolver, _isWaitingForUserAnswer, _headerUpdateTimer, _pendingHeaderText, _isAnimating, _Panel_instances, update_fn, show_fn, hide_fn, reset_fn, togglePause_fn, updatePauseButton_fn, stopAgent_fn, submitTask_fn, handleUserAnswer_fn, showInputArea_fn, hideInputArea_fn, shouldShowInputArea_fn, createWrapper_fn, setupEventListeners_fn, toggle_fn, expand_fn, collapse_fn, startHeaderUpdateLoop_fn, stopHeaderUpdateLoop_fn, checkAndUpdateHeader_fn, animateTextChange_fn, updateStatusIndicator_fn, updateHistory_fn, scrollToBottom_fn, createHistoryItem_fn, _cursor, _currentCursorX, _currentCursorY, _targetCursorX, _targetCursorY, _SimulatorMask_instances, createCursor_fn, moveCursorToTarget_fn, _llm, _totalWaitTime, _abortController, _PageAgent_instances, packMacroTool_fn, getSystemPrompt_fn, assembleUserPrompt_fn, onDone_fn, getBrowserState_fn;
+var __publicField2 = (obj, key, value) => __defNormalProp2(obj, typeof key !== "symbol" ? key + "" : key, value);
+var __accessCheck2 = (obj, member, msg) => member.has(obj) || __typeError2("Cannot " + msg);
+var __privateGet2 = (obj, member, getter) => (__accessCheck2(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
+var __privateAdd2 = (obj, member, value) => member.has(obj) ? __typeError2("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+var __privateSet2 = (obj, member, value, setter) => (__accessCheck2(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
+var __privateMethod2 = (obj, member, method) => (__accessCheck2(obj, member, "access private method"), method);
+var __PageController, _b, _c, _d, _e, _llm, _totalWaitTime, _abortController, _llmRetryListener, _llmErrorListener, _beforeUnloadListener, _PageAgent_instances, packMacroTool_fn, getSystemPrompt_fn, assembleUserPrompt_fn, onDone_fn, getBrowserState_fn;
+import { Motion } from "ai-motion";
 import chalk from "chalk";
 import zod, { z } from "zod";
-import { Motion } from "ai-motion";
-var __defProp = Object.defineProperty;
-var __name = /* @__PURE__ */ __name2((target, value) => __defProp(target, "name", { value, configurable: true }), "__name");
+var __defProp$1 = Object.defineProperty;
+var __name$1 = /* @__PURE__ */ __name2((target, value) => __defProp$1(target, "name", { value, configurable: true }), "__name$1");
 async function waitFor$1(seconds) {
   await new Promise((resolve) => setTimeout(resolve, seconds * 1e3));
 }
 __name2(waitFor$1, "waitFor$1");
-__name(waitFor$1, "waitFor");
+__name$1(waitFor$1, "waitFor");
 async function movePointerToElement(element) {
   const rect = element.getBoundingClientRect();
   const x = rect.left + rect.width / 2;
@@ -41,7 +29,7 @@ async function movePointerToElement(element) {
   await waitFor$1(0.3);
 }
 __name2(movePointerToElement, "movePointerToElement");
-__name(movePointerToElement, "movePointerToElement");
+__name$1(movePointerToElement, "movePointerToElement");
 function getElementByIndex(selectorMap, index) {
   const interactiveNode = selectorMap.get(index);
   if (!interactiveNode) {
@@ -57,7 +45,7 @@ function getElementByIndex(selectorMap, index) {
   return element;
 }
 __name2(getElementByIndex, "getElementByIndex");
-__name(getElementByIndex, "getElementByIndex");
+__name$1(getElementByIndex, "getElementByIndex");
 let lastClickedElement = null;
 function blurLastClickedElement() {
   if (lastClickedElement) {
@@ -69,7 +57,7 @@ function blurLastClickedElement() {
   }
 }
 __name2(blurLastClickedElement, "blurLastClickedElement");
-__name(blurLastClickedElement, "blurLastClickedElement");
+__name$1(blurLastClickedElement, "blurLastClickedElement");
 async function clickElement(element) {
   blurLastClickedElement();
   lastClickedElement = element;
@@ -86,7 +74,7 @@ async function clickElement(element) {
   await waitFor$1(0.1);
 }
 __name2(clickElement, "clickElement");
-__name(clickElement, "clickElement");
+__name$1(clickElement, "clickElement");
 const nativeInputValueSetter = Object.getOwnPropertyDescriptor(
   window.HTMLInputElement.prototype,
   "value"
@@ -111,7 +99,7 @@ async function inputTextElement(element, text) {
   blurLastClickedElement();
 }
 __name2(inputTextElement, "inputTextElement");
-__name(inputTextElement, "inputTextElement");
+__name$1(inputTextElement, "inputTextElement");
 async function selectOptionElement(selectElement, optionText) {
   if (!(selectElement instanceof HTMLSelectElement)) {
     throw new Error("Element is not a select element");
@@ -126,7 +114,7 @@ async function selectOptionElement(selectElement, optionText) {
   await waitFor$1(0.1);
 }
 __name2(selectOptionElement, "selectOptionElement");
-__name(selectOptionElement, "selectOptionElement");
+__name$1(selectOptionElement, "selectOptionElement");
 async function scrollIntoViewIfNeeded(element) {
   const el = element;
   if (el.scrollIntoViewIfNeeded) {
@@ -136,7 +124,7 @@ async function scrollIntoViewIfNeeded(element) {
   }
 }
 __name2(scrollIntoViewIfNeeded, "scrollIntoViewIfNeeded");
-__name(scrollIntoViewIfNeeded, "scrollIntoViewIfNeeded");
+__name$1(scrollIntoViewIfNeeded, "scrollIntoViewIfNeeded");
 async function scrollVertically(down, scroll_amount, element) {
   if (element) {
     const targetElement = element;
@@ -214,8 +202,8 @@ async function scrollVertically(down, scroll_amount, element) {
     }
   }
   const dy = scroll_amount;
-  const bigEnough = /* @__PURE__ */ __name((el2) => el2.clientHeight >= window.innerHeight * 0.5, "bigEnough");
-  const canScroll = /* @__PURE__ */ __name((el2) => el2 && /(auto|scroll|overlay)/.test(getComputedStyle(el2).overflowY) && el2.scrollHeight > el2.clientHeight && bigEnough(el2), "canScroll");
+  const bigEnough = /* @__PURE__ */ __name$1((el2) => el2.clientHeight >= window.innerHeight * 0.5, "bigEnough");
+  const canScroll = /* @__PURE__ */ __name$1((el2) => el2 && /(auto|scroll|overlay)/.test(getComputedStyle(el2).overflowY) && el2.scrollHeight > el2.clientHeight && bigEnough(el2), "canScroll");
   let el = document.activeElement;
   while (el && !canScroll(el) && el !== document.body) el = el.parentElement;
   el = canScroll(el) ? el : Array.from(document.querySelectorAll("*")).find(canScroll) || document.scrollingElement || document.documentElement;
@@ -229,7 +217,7 @@ async function scrollVertically(down, scroll_amount, element) {
   }
 }
 __name2(scrollVertically, "scrollVertically");
-__name(scrollVertically, "scrollVertically");
+__name$1(scrollVertically, "scrollVertically");
 async function scrollHorizontally(right, scroll_amount, element) {
   if (element) {
     const targetElement = element;
@@ -307,8 +295,8 @@ async function scrollHorizontally(right, scroll_amount, element) {
     }
   }
   const dx = right ? scroll_amount : -scroll_amount;
-  const bigEnough = /* @__PURE__ */ __name((el2) => el2.clientWidth >= window.innerWidth * 0.5, "bigEnough");
-  const canScroll = /* @__PURE__ */ __name((el2) => el2 && /(auto|scroll|overlay)/.test(getComputedStyle(el2).overflowX) && el2.scrollWidth > el2.clientWidth && bigEnough(el2), "canScroll");
+  const bigEnough = /* @__PURE__ */ __name$1((el2) => el2.clientWidth >= window.innerWidth * 0.5, "bigEnough");
+  const canScroll = /* @__PURE__ */ __name$1((el2) => el2 && /(auto|scroll|overlay)/.test(getComputedStyle(el2).overflowX) && el2.scrollWidth > el2.clientWidth && bigEnough(el2), "canScroll");
   let el = document.activeElement;
   while (el && !canScroll(el) && el !== document.body) el = el.parentElement;
   el = canScroll(el) ? el : Array.from(document.querySelectorAll("*")).find(canScroll) || document.scrollingElement || document.documentElement;
@@ -322,9 +310,9 @@ async function scrollHorizontally(right, scroll_amount, element) {
   }
 }
 __name2(scrollHorizontally, "scrollHorizontally");
-__name(scrollHorizontally, "scrollHorizontally");
+__name$1(scrollHorizontally, "scrollHorizontally");
 const VIEWPORT_EXPANSION = -1;
-const domTree = /* @__PURE__ */ __name((args = {
+const domTree = /* @__PURE__ */ __name$1((args = {
   doHighlightElements: true,
   focusHighlightIndex: -1,
   viewportExpansion: 0,
@@ -348,12 +336,12 @@ const domTree = /* @__PURE__ */ __name((args = {
     extraData.set(element, { ...extraData.get(element), ...data });
   }
   __name2(addExtraData, "addExtraData");
-  __name(addExtraData, "addExtraData");
+  __name$1(addExtraData, "addExtraData");
   const DOM_CACHE = {
     boundingRects: /* @__PURE__ */ new WeakMap(),
     clientRects: /* @__PURE__ */ new WeakMap(),
     computedStyles: /* @__PURE__ */ new WeakMap(),
-    clearCache: /* @__PURE__ */ __name(() => {
+    clearCache: /* @__PURE__ */ __name$1(() => {
       DOM_CACHE.boundingRects = /* @__PURE__ */ new WeakMap();
       DOM_CACHE.clientRects = /* @__PURE__ */ new WeakMap();
       DOM_CACHE.computedStyles = /* @__PURE__ */ new WeakMap();
@@ -371,7 +359,7 @@ const domTree = /* @__PURE__ */ __name((args = {
     return rect;
   }
   __name2(getCachedBoundingRect, "getCachedBoundingRect");
-  __name(getCachedBoundingRect, "getCachedBoundingRect");
+  __name$1(getCachedBoundingRect, "getCachedBoundingRect");
   function getCachedComputedStyle(element) {
     if (!element) return null;
     if (DOM_CACHE.computedStyles.has(element)) {
@@ -384,7 +372,7 @@ const domTree = /* @__PURE__ */ __name((args = {
     return style;
   }
   __name2(getCachedComputedStyle, "getCachedComputedStyle");
-  __name(getCachedComputedStyle, "getCachedComputedStyle");
+  __name$1(getCachedComputedStyle, "getCachedComputedStyle");
   function getCachedClientRects(element) {
     if (!element) return null;
     if (DOM_CACHE.clientRects.has(element)) {
@@ -397,7 +385,7 @@ const domTree = /* @__PURE__ */ __name((args = {
     return rects;
   }
   __name2(getCachedClientRects, "getCachedClientRects");
-  __name(getCachedClientRects, "getCachedClientRects");
+  __name$1(getCachedClientRects, "getCachedClientRects");
   const DOM_HASH_MAP = {};
   const ID = { current: 0 };
   const HIGHLIGHT_CONTAINER_ID = "playwright-highlight-container";
@@ -493,7 +481,7 @@ const domTree = /* @__PURE__ */ __name((args = {
       label.style.top = `${labelTop}px`;
       label.style.left = `${labelLeft}px`;
       fragment.appendChild(label);
-      const updatePositions = /* @__PURE__ */ __name(() => {
+      const updatePositions = /* @__PURE__ */ __name$1(() => {
         const newRects = element.getClientRects();
         let newIframeOffset = { x: 0, y: 0 };
         if (parentIframe) {
@@ -540,7 +528,7 @@ const domTree = /* @__PURE__ */ __name((args = {
           label.style.display = "none";
         }
       }, "updatePositions");
-      const throttleFunction = /* @__PURE__ */ __name((func, delay) => {
+      const throttleFunction = /* @__PURE__ */ __name$1((func, delay) => {
         let lastCall = 0;
         return (...args2) => {
           const now = performance.now();
@@ -552,7 +540,7 @@ const domTree = /* @__PURE__ */ __name((args = {
       const throttledUpdatePositions = throttleFunction(updatePositions, 16);
       window.addEventListener("scroll", throttledUpdatePositions, true);
       window.addEventListener("resize", throttledUpdatePositions);
-      cleanupFn = /* @__PURE__ */ __name(() => {
+      cleanupFn = /* @__PURE__ */ __name$1(() => {
         window.removeEventListener("scroll", throttledUpdatePositions, true);
         window.removeEventListener("resize", throttledUpdatePositions);
         overlays.forEach((overlay) => overlay.element.remove());
@@ -569,7 +557,7 @@ const domTree = /* @__PURE__ */ __name((args = {
     }
   }
   __name2(highlightElement, "highlightElement");
-  __name(highlightElement, "highlightElement");
+  __name$1(highlightElement, "highlightElement");
   function isScrollableElement(element) {
     if (!element || element.nodeType !== Node.ELEMENT_NODE) {
       return null;
@@ -616,7 +604,7 @@ const domTree = /* @__PURE__ */ __name((args = {
     return scrollData;
   }
   __name2(isScrollableElement, "isScrollableElement");
-  __name(isScrollableElement, "isScrollableElement");
+  __name$1(isScrollableElement, "isScrollableElement");
   function isTextNodeVisible(textNode) {
     try {
       if (viewportExpansion === -1) {
@@ -669,7 +657,7 @@ const domTree = /* @__PURE__ */ __name((args = {
     }
   }
   __name2(isTextNodeVisible, "isTextNodeVisible");
-  __name(isTextNodeVisible, "isTextNodeVisible");
+  __name$1(isTextNodeVisible, "isTextNodeVisible");
   function isElementAccepted(element) {
     if (!element || !element.tagName) return false;
     const alwaysAccept = /* @__PURE__ */ new Set([
@@ -696,13 +684,13 @@ const domTree = /* @__PURE__ */ __name((args = {
     return !leafElementDenyList.has(tagName);
   }
   __name2(isElementAccepted, "isElementAccepted");
-  __name(isElementAccepted, "isElementAccepted");
+  __name$1(isElementAccepted, "isElementAccepted");
   function isElementVisible(element) {
     const style = getCachedComputedStyle(element);
     return element.offsetWidth > 0 && element.offsetHeight > 0 && style?.visibility !== "hidden" && style?.display !== "none";
   }
   __name2(isElementVisible, "isElementVisible");
-  __name(isElementVisible, "isElementVisible");
+  __name$1(isElementVisible, "isElementVisible");
   function isInteractiveElement(element) {
     if (!element || element.nodeType !== Node.ELEMENT_NODE) {
       return false;
@@ -799,7 +787,7 @@ const domTree = /* @__PURE__ */ __name((args = {
       return false;
     }
     __name2(doesElementHaveInteractivePointer, "doesElementHaveInteractivePointer");
-    __name(doesElementHaveInteractivePointer, "doesElementHaveInteractivePointer");
+    __name$1(doesElementHaveInteractivePointer, "doesElementHaveInteractivePointer");
     let isInteractiveCursor = doesElementHaveInteractivePointer(element);
     if (isInteractiveCursor) {
       return true;
@@ -960,7 +948,7 @@ const domTree = /* @__PURE__ */ __name((args = {
     return false;
   }
   __name2(isInteractiveElement, "isInteractiveElement");
-  __name(isInteractiveElement, "isInteractiveElement");
+  __name$1(isInteractiveElement, "isInteractiveElement");
   function isTopElement(element) {
     if (viewportExpansion === -1) {
       return true;
@@ -1032,7 +1020,7 @@ const domTree = /* @__PURE__ */ __name((args = {
     });
   }
   __name2(isTopElement, "isTopElement");
-  __name(isTopElement, "isTopElement");
+  __name$1(isTopElement, "isTopElement");
   function isInExpandedViewport(element, viewportExpansion2) {
     if (viewportExpansion2 === -1) {
       return true;
@@ -1054,7 +1042,7 @@ const domTree = /* @__PURE__ */ __name((args = {
     return false;
   }
   __name2(isInExpandedViewport, "isInExpandedViewport");
-  __name(isInExpandedViewport, "isInExpandedViewport");
+  __name$1(isInExpandedViewport, "isInExpandedViewport");
   function isInteractiveCandidate(element) {
     if (!element || element.nodeType !== Node.ELEMENT_NODE) return false;
     const tagName = element.tagName.toLowerCase();
@@ -1073,7 +1061,7 @@ const domTree = /* @__PURE__ */ __name((args = {
     return hasQuickInteractiveAttr;
   }
   __name2(isInteractiveCandidate, "isInteractiveCandidate");
-  __name(isInteractiveCandidate, "isInteractiveCandidate");
+  __name$1(isInteractiveCandidate, "isInteractiveCandidate");
   const DISTINCT_INTERACTIVE_TAGS = /* @__PURE__ */ new Set([
     "a",
     "button",
@@ -1119,7 +1107,7 @@ const domTree = /* @__PURE__ */ __name((args = {
     return (isInteractiveElement(element) || hasInteractiveAttributes || hasInteractiveClass) && hasVisibleChildren && isInKnownContainer && !isParentBody;
   }
   __name2(isHeuristicallyInteractive, "isHeuristicallyInteractive");
-  __name(isHeuristicallyInteractive, "isHeuristicallyInteractive");
+  __name$1(isHeuristicallyInteractive, "isHeuristicallyInteractive");
   function isElementDistinctInteraction(element) {
     if (!element || element.nodeType !== Node.ELEMENT_NODE) {
       return false;
@@ -1190,7 +1178,7 @@ const domTree = /* @__PURE__ */ __name((args = {
     return false;
   }
   __name2(isElementDistinctInteraction, "isElementDistinctInteraction");
-  __name(isElementDistinctInteraction, "isElementDistinctInteraction");
+  __name$1(isElementDistinctInteraction, "isElementDistinctInteraction");
   function handleHighlighting(nodeData, node, parentIframe, isParentHighlighted) {
     if (!nodeData.isInteractive) return false;
     let shouldHighlight = false;
@@ -1222,7 +1210,7 @@ const domTree = /* @__PURE__ */ __name((args = {
     return false;
   }
   __name2(handleHighlighting, "handleHighlighting");
-  __name(handleHighlighting, "handleHighlighting");
+  __name$1(handleHighlighting, "handleHighlighting");
   function buildDomTree(node, parentIframe = null, isParentHighlighted = false) {
     if (!node || node.id === HIGHLIGHT_CONTAINER_ID || node.nodeType !== Node.ELEMENT_NODE && node.nodeType !== Node.TEXT_NODE) {
       return null;
@@ -1360,7 +1348,7 @@ const domTree = /* @__PURE__ */ __name((args = {
     return id;
   }
   __name2(buildDomTree, "buildDomTree");
-  __name(buildDomTree, "buildDomTree");
+  __name$1(buildDomTree, "buildDomTree");
   const rootId = buildDomTree(document.body);
   DOM_CACHE.clearCache();
   return { rootId, map: DOM_HASH_MAP };
@@ -1407,7 +1395,7 @@ function getFlatTree(config) {
   return elements;
 }
 __name2(getFlatTree, "getFlatTree");
-__name(getFlatTree, "getFlatTree");
+__name$1(getFlatTree, "getFlatTree");
 function flatTreeToString(flatTree, include_attributes) {
   const DEFAULT_INCLUDE_ATTRIBUTES = [
     "title",
@@ -1434,13 +1422,13 @@ function flatTreeToString(flatTree, include_attributes) {
     "aria-owns"
   ];
   const includeAttrs = [...include_attributes || [], ...DEFAULT_INCLUDE_ATTRIBUTES];
-  const capTextLength = /* @__PURE__ */ __name((text, maxLength) => {
+  const capTextLength = /* @__PURE__ */ __name$1((text, maxLength) => {
     if (text.length > maxLength) {
       return text.substring(0, maxLength) + "...";
     }
     return text;
   }, "capTextLength");
-  const buildTreeNode = /* @__PURE__ */ __name((nodeId) => {
+  const buildTreeNode = /* @__PURE__ */ __name$1((nodeId) => {
     const node = flatTree.map[nodeId];
     if (!node) return null;
     if (node.type === "TEXT_NODE") {
@@ -1479,7 +1467,7 @@ function flatTreeToString(flatTree, include_attributes) {
       };
     }
   }, "buildTreeNode");
-  const setParentReferences = /* @__PURE__ */ __name((node, parent = null) => {
+  const setParentReferences = /* @__PURE__ */ __name$1((node, parent = null) => {
     node.parent = parent;
     for (const child of node.children) {
       setParentReferences(child, node);
@@ -1488,7 +1476,7 @@ function flatTreeToString(flatTree, include_attributes) {
   const rootNode = buildTreeNode(flatTree.rootId);
   if (!rootNode) return "";
   setParentReferences(rootNode);
-  const hasParentWithHighlightIndex = /* @__PURE__ */ __name((node) => {
+  const hasParentWithHighlightIndex = /* @__PURE__ */ __name$1((node) => {
     let current = node.parent;
     while (current) {
       if (current.type === "element" && current.highlightIndex !== void 0) {
@@ -1498,7 +1486,7 @@ function flatTreeToString(flatTree, include_attributes) {
     }
     return false;
   }, "hasParentWithHighlightIndex");
-  const processNode = /* @__PURE__ */ __name((node, depth, result22) => {
+  const processNode = /* @__PURE__ */ __name$1((node, depth, result22) => {
     let nextDepth = depth;
     const depthStr = "	".repeat(depth);
     if (node.type === "element") {
@@ -1592,10 +1580,10 @@ function flatTreeToString(flatTree, include_attributes) {
   return result2.join("\n");
 }
 __name2(flatTreeToString, "flatTreeToString");
-__name(flatTreeToString, "flatTreeToString");
-const getAllTextTillNextClickableElement = /* @__PURE__ */ __name((node, maxDepth = -1) => {
+__name$1(flatTreeToString, "flatTreeToString");
+const getAllTextTillNextClickableElement = /* @__PURE__ */ __name$1((node, maxDepth = -1) => {
   const textParts = [];
-  const collectText = /* @__PURE__ */ __name((currentNode, currentDepth) => {
+  const collectText = /* @__PURE__ */ __name$1((currentNode, currentDepth) => {
     if (maxDepth !== -1 && currentDepth > maxDepth) {
       return;
     }
@@ -1625,7 +1613,7 @@ function getSelectorMap(flatTree) {
   return selectorMap;
 }
 __name2(getSelectorMap, "getSelectorMap");
-__name(getSelectorMap, "getSelectorMap");
+__name$1(getSelectorMap, "getSelectorMap");
 function getElementTextMap(simplifiedHTML) {
   const lines = simplifiedHTML.split("\n").map((line) => line.trim()).filter((line) => line.length > 0);
   const elementTextMap = /* @__PURE__ */ new Map();
@@ -1640,7 +1628,7 @@ function getElementTextMap(simplifiedHTML) {
   return elementTextMap;
 }
 __name2(getElementTextMap, "getElementTextMap");
-__name(getElementTextMap, "getElementTextMap");
+__name$1(getElementTextMap, "getElementTextMap");
 function cleanUpHighlights() {
   const cleanupFunctions = window._highlightCleanupFunctions || [];
   for (const cleanup of cleanupFunctions) {
@@ -1651,7 +1639,7 @@ function cleanUpHighlights() {
   window._highlightCleanupFunctions = [];
 }
 __name2(cleanUpHighlights, "cleanUpHighlights");
-__name(cleanUpHighlights, "cleanUpHighlights");
+__name$1(cleanUpHighlights, "cleanUpHighlights");
 window.addEventListener("popstate", () => {
   cleanUpHighlights();
 });
@@ -1708,7 +1696,7 @@ function getPageInfo() {
   };
 }
 __name2(getPageInfo, "getPageInfo");
-__name(getPageInfo, "getPageInfo");
+__name$1(getPageInfo, "getPageInfo");
 function patchReact(pageController) {
   const reactRootElements = document.querySelectorAll(
     '[data-reactroot], [data-reactid], [data-react-checksum], #root, #app, [id^="root-"], [id^="app-"], #adex-wrapper, #adex-root'
@@ -1718,7 +1706,7 @@ function patchReact(pageController) {
   }
 }
 __name2(patchReact, "patchReact");
-__name(patchReact, "patchReact");
+__name$1(patchReact, "patchReact");
 const _PageController = (__PageController = class extends EventTarget {
   config;
   /** Corresponds to eval_page in browser-use */
@@ -1956,15 +1944,92 @@ const _PageController = (__PageController = class extends EventTarget {
     this.simplifiedHTML = "<EMPTY>";
   }
 }, __name2(__PageController, "_PageController"), __PageController);
-__name(_PageController, "PageController");
+__name$1(_PageController, "PageController");
 let PageController = _PageController;
-const DEFAULT_MODEL_NAME = "PAGE-AGENT-FREE-TESTING-RANDOM";
-const DEFAULT_API_KEY = "PAGE-AGENT-FREE-TESTING-RANDOM";
-const DEFAULT_BASE_URL = "https://hwcxiuzfylggtcktqgij.supabase.co/functions/v1/llm-testing-proxy";
-const LLM_MAX_RETRIES = 2;
-const MAX_STEPS = 20;
-const DEFAULT_TEMPERATURE = 0.7;
-const DEFAULT_MAX_TOKENS = 4096;
+(function() {
+  try {
+    if (typeof document != "undefined") {
+      var elementStyle = document.createElement("style");
+      elementStyle.appendChild(document.createTextNode("._wrapper_1j0ct_1 {\n	position: fixed;\n	bottom: 100px;\n	left: 50%;\n	transform: translateX(-50%) translateY(20px);\n	opacity: 0;\n	z-index: 2147483642; /* 比 SimulatorMask 高一层 */\n	box-sizing: border-box;\n\n	overflow: visible;\n\n	* {\n		box-sizing: border-box;\n	}\n\n	--width: 360px;\n	--height: 40px;\n	--border-radius: 12px;\n\n	--side-space: 12px; /* 控制栏两侧的间距 */\n	--history-width: calc(var(--width) - var(--side-space) * 2);\n\n	--color-1: rgb(57, 182, 255);\n	--color-2: rgb(189, 69, 251);\n	--color-3: rgb(255, 87, 51);\n	--color-4: rgb(255, 214, 0);\n\n	width: var(--width);\n	height: var(--height);\n\n	transition: all 0.3s ease-in-out;\n\n	/* 响应式设计 */\n	@media (max-width: 480px) {\n		width: calc(100vw - 40px);\n		--width: calc(100vw - 40px);\n	}\n\n	._background_1j0ct_39 {\n		position: absolute;\n		inset: -2px -8px;\n		border-radius: calc(var(--border-radius) + 4px);\n		filter: blur(16px);\n		overflow: hidden;\n		/* mix-blend-mode: lighten; */\n		/* display: none; */\n\n		&::before {\n			content: '';\n			z-index: -1;\n			pointer-events: none;\n			position: absolute;\n			width: 100%;\n			height: 100%;\n			/* left: -100%; */\n			left: 0;\n			top: 0;\n\n			background-image: linear-gradient(\n				to bottom left,\n				var(--color-1),\n				var(--color-2),\n				var(--color-1)\n			);\n			animation: _mask-running_1j0ct_1 2s linear infinite;\n		}\n		&::after {\n			content: '';\n			z-index: -1;\n			pointer-events: none;\n			position: absolute;\n			width: 100%;\n			height: 100%;\n			left: 0;\n			top: 0;\n\n			background-image: linear-gradient(\n				to bottom left,\n				var(--color-2),\n				var(--color-1),\n				var(--color-2)\n			);\n			animation: _mask-running_1j0ct_1 2s linear infinite;\n			animation-delay: 1s;\n		}\n	}\n}\n\n@keyframes _mask-running_1j0ct_1 {\n	from {\n		transform: translateX(-100%);\n	}\n	to {\n		transform: translateX(100%);\n	}\n}\n\n/* 控制栏 */\n._header_1j0ct_99 {\n	display: flex;\n	align-items: center;\n	justify-content: space-between;\n	padding: 8px 12px;\n	user-select: none;\n\n	position: absolute;\n	inset: 0;\n\n	cursor: pointer;\n	flex-shrink: 0; /* 防止 header 被压缩 */\n\n	background: rgba(0, 0, 0, 0.5);\n	backdrop-filter: blur(10px);\n	border-radius: var(--border-radius);\n	background-clip: padding-box;\n\n	box-shadow:\n		0 0 0px 2px rgba(255, 255, 255, 0.4),\n		0 0 5px 1px rgba(255, 255, 255, 0.3);\n\n	._statusSection_1j0ct_121 {\n		display: flex;\n		align-items: center;\n		gap: 8px;\n		flex: 1;\n		min-height: 24px; /* 确保垂直居中 */\n\n		._indicator_1j0ct_128 {\n			width: 6px;\n			height: 6px;\n			border-radius: 50%;\n			background: rgba(255, 255, 255, 0.5);\n			flex-shrink: 0;\n			animation: none; /* 默认无动画 */\n\n			/* 运行状态 - 有动画 */\n			&._thinking_1j0ct_137 {\n				background: rgb(57, 182, 255);\n				animation: _pulse_1j0ct_1 0.8s ease-in-out infinite;\n			}\n\n			&._tool_executing_1j0ct_142 {\n				background: rgb(189, 69, 251);\n				animation: _pulse_1j0ct_1 0.6s ease-in-out infinite;\n			}\n\n			&._retry_1j0ct_147 {\n				background: rgb(255, 214, 0);\n				animation: _retryPulse_1j0ct_1 1s ease-in-out infinite;\n			}\n\n			/* 静止状态 - 无动画 */\n			&._completed_1j0ct_153,\n			&._input_1j0ct_154,\n			&._output_1j0ct_155 {\n				background: rgb(34, 197, 94);\n				animation: none;\n			}\n\n			&._error_1j0ct_160 {\n				background: rgb(239, 68, 68);\n				animation: none;\n			}\n		}\n\n		._statusText_1j0ct_166 {\n			color: white;\n			font-size: 12px;\n			line-height: 1;\n			font-weight: 500;\n			transition: all 0.3s ease-in-out;\n			position: relative;\n			overflow: hidden;\n			display: flex;\n			align-items: center;\n			min-height: 24px; /* 确保垂直居中 */\n\n			&._fadeOut_1j0ct_178 {\n				animation: _statusTextFadeOut_1j0ct_1 0.3s ease forwards;\n			}\n\n			&._fadeIn_1j0ct_182 {\n				animation: _statusTextFadeIn_1j0ct_1 0.3s ease forwards;\n			}\n		}\n	}\n\n	._controls_1j0ct_188 {\n		display: flex;\n		align-items: center;\n		gap: 4px;\n\n		._controlButton_1j0ct_193 {\n			width: 24px;\n			height: 24px;\n			border: none;\n			border-radius: 4px;\n			background: rgba(255, 255, 255, 0.1);\n			color: white;\n			cursor: pointer;\n			display: flex;\n			align-items: center;\n			justify-content: center;\n			font-size: 12px;\n			line-height: 1;\n\n			&:hover {\n				background: rgba(255, 255, 255, 0.2);\n			}\n		}\n\n		._pauseButton_1j0ct_212 {\n			font-weight: 600;\n			&._paused_1j0ct_214 {\n				background: rgba(34, 197, 94, 0.2); /* 绿色背景表示可以继续 */\n				color: rgb(34, 197, 94);\n\n				&:hover {\n					background: rgba(34, 197, 94, 0.3);\n				}\n			}\n		}\n\n		._stopButton_1j0ct_224 {\n			background: rgba(239, 68, 68, 0.2);\n			color: rgb(255, 41, 41);\n			font-weight: 600;\n\n			&:hover {\n				background: rgba(239, 68, 68, 0.3);\n			}\n		}\n	}\n}\n\n@keyframes _statusTextFadeIn_1j0ct_1 {\n	0% {\n		opacity: 0;\n		transform: translateY(5px);\n	}\n	100% {\n		opacity: 1;\n		transform: translateY(0);\n	}\n}\n\n@keyframes _statusTextFadeOut_1j0ct_1 {\n	0% {\n		opacity: 1;\n		transform: translateY(0);\n	}\n	100% {\n		opacity: 0;\n		transform: translateY(-5px);\n	}\n}\n\n._historySectionWrapper_1j0ct_258 {\n	position: absolute;\n	width: var(--history-width);\n	bottom: var(--height);\n	left: var(--side-space);\n	z-index: -2;\n\n	padding-top: 0px;\n	visibility: collapse;\n	overflow: hidden;\n\n	transition: all 0.2s;\n\n	background: rgba(2, 0, 20, 0.5);\n	/* background: rgba(186, 186, 186, 0.2); */\n	backdrop-filter: blur(10px);\n\n	text-shadow: 0 0 1px rgba(0, 0, 0, 0.2);\n\n	border-top-left-radius: calc(var(--border-radius) + 4px);\n	border-top-right-radius: calc(var(--border-radius) + 4px);\n\n	/* border: 2px solid rgba(255, 255, 255, 0.8); */\n	border: 2px solid rgba(255, 255, 255, 0.4);\n	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.6);\n\n	/* @media (prefers-color-scheme: dark) {\n		box-shadow:\n			0 8px 32px 0 rgba(0, 0, 0, 0.85),\n			0 2px 12px 0 rgba(57, 182, 255, 0.1);\n	} */\n\n	._expanded_1j0ct_290 & {\n		padding-top: 8px;\n		visibility: visible;\n	}\n\n	._historySection_1j0ct_258 {\n		position: relative;\n		overflow-y: auto;\n		overscroll-behavior: contain;\n		scrollbar-width: none;\n		max-height: 0;\n		padding-inline: 8px;\n\n		transition: max-height 0.2s;\n\n		._expanded_1j0ct_290 & {\n			max-height: 400px;\n		}\n\n		._historyItem_1j0ct_309 {\n			/* backdrop-filter: blur(10px); */\n			padding: 8px 10px;\n			margin-bottom: 6px;\n			background: linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.03));\n			border-radius: 8px;\n			border-left: 2px solid rgba(57, 182, 255, 0.5);\n			font-size: 12px;\n			color: white;\n			/* color: black; */\n			line-height: 1.3;\n			position: relative;\n			overflow: hidden;\n\n			/* 微妙的内阴影 */\n			box-shadow:\n				inset 0 1px 0 rgba(255, 255, 255, 0.1),\n				0 1px 3px rgba(0, 0, 0, 0.1);\n\n			&::before {\n				content: '';\n				position: absolute;\n				top: 0;\n				left: 0;\n				right: 0;\n				height: 1px;\n				background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);\n			}\n\n			&:hover {\n				background: linear-gradient(135deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.06));\n				/* transform: translateY(-1px); */\n				box-shadow:\n					inset 0 1px 0 rgba(255, 255, 255, 0.15),\n					0 2px 4px rgba(0, 0, 0, 0.15);\n			}\n\n			&:last-child {\n				margin-bottom: 10px;\n			}\n\n			&._completed_1j0ct_153,\n			&._input_1j0ct_154,\n			&._output_1j0ct_155 {\n				border-left-color: rgb(34, 197, 94);\n				background: linear-gradient(135deg, rgba(34, 197, 94, 0.1), rgba(34, 197, 94, 0.05));\n			}\n\n			&._error_1j0ct_160 {\n				border-left-color: rgb(239, 68, 68);\n				background: linear-gradient(135deg, rgba(239, 68, 68, 0.1), rgba(239, 68, 68, 0.05));\n			}\n\n			&._retry_1j0ct_147 {\n				border-left-color: rgb(255, 214, 0);\n				background: linear-gradient(135deg, rgba(255, 214, 0, 0.1), rgba(255, 214, 0, 0.05));\n			}\n\n			/* 突出显示 done 成功结果 */\n			&._doneSuccess_1j0ct_368 {\n				background: linear-gradient(\n					135deg,\n					rgba(34, 197, 94, 0.25),\n					rgba(34, 197, 94, 0.15),\n					rgba(34, 197, 94, 0.08)\n				);\n				border: none;\n				border-left: 4px solid rgb(34, 197, 94);\n				box-shadow:\n					0 4px 12px rgba(34, 197, 94, 0.3),\n					inset 0 1px 0 rgba(255, 255, 255, 0.2),\n					0 0 20px rgba(34, 197, 94, 0.1);\n				font-weight: 600;\n				color: rgb(220, 252, 231);\n				padding: 10px 12px;\n				margin-bottom: 8px;\n				border-radius: 8px;\n				position: relative;\n				overflow: hidden;\n\n				&::before {\n					background: linear-gradient(90deg, transparent, rgba(34, 197, 94, 0.4), transparent);\n				}\n\n				&::after {\n					content: '';\n					position: absolute;\n					top: 0;\n					left: -100%;\n					width: 100%;\n					height: 100%;\n					background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);\n					animation: _shimmer_1j0ct_1 2s ease-in-out infinite;\n				}\n\n				._historyContent_1j0ct_404 {\n					._statusIcon_1j0ct_405 {\n						font-size: 16px;\n						animation: _celebrate_1j0ct_1 0.8s ease-in-out;\n						filter: drop-shadow(0 2px 4px rgba(34, 197, 94, 0.5));\n					}\n				}\n			}\n\n			/* 突出显示 done 失败结果 */\n			&._doneError_1j0ct_414 {\n				background: linear-gradient(\n					135deg,\n					rgba(239, 68, 68, 0.25),\n					rgba(239, 68, 68, 0.15),\n					rgba(239, 68, 68, 0.08)\n				);\n				border: none;\n				border-left: 4px solid rgb(239, 68, 68);\n				box-shadow:\n					0 4px 12px rgba(239, 68, 68, 0.3),\n					inset 0 1px 0 rgba(255, 255, 255, 0.2),\n					0 0 20px rgba(239, 68, 68, 0.1);\n				font-weight: 600;\n				color: rgb(254, 226, 226);\n				padding: 10px 12px;\n				margin-bottom: 8px;\n				border-radius: 8px;\n				position: relative;\n				overflow: hidden;\n\n				&::before {\n					background: linear-gradient(90deg, transparent, rgba(239, 68, 68, 0.4), transparent);\n				}\n\n				._historyContent_1j0ct_404 {\n					._statusIcon_1j0ct_405 {\n						font-size: 16px;\n						filter: drop-shadow(0 2px 4px rgba(239, 68, 68, 0.5));\n					}\n				}\n			}\n\n			._historyContent_1j0ct_404 {\n				display: flex;\n				align-items: center;\n				gap: 8px;\n\n				word-break: break-all;\n				white-space: pre-wrap;\n\n				/* overflow-x: auto; */\n\n				._statusIcon_1j0ct_405 {\n					font-size: 12px;\n					flex-shrink: 0;\n					line-height: 1;\n					transition: all 0.3s ease;\n				}\n			}\n\n			._historyMeta_1j0ct_465 {\n				font-size: 10px;\n				color: rgba(255, 255, 255, 0.6);\n				/* color: rgb(61, 61, 61); */\n				margin-top: 8px;\n				line-height: 1;\n			}\n		}\n	}\n}\n\n/* 动画关键帧 - 更快的闪烁 */\n@keyframes _pulse_1j0ct_1 {\n	0%,\n	100% {\n		opacity: 1;\n		transform: scale(1);\n	}\n	50% {\n		opacity: 0.4;\n		transform: scale(1.3);\n	}\n}\n\n/* 重试动画 - 旋转脉冲 */\n@keyframes _retryPulse_1j0ct_1 {\n	0%,\n	100% {\n		opacity: 1;\n		transform: scale(1) rotate(0deg);\n	}\n	25% {\n		opacity: 0.6;\n		transform: scale(1.2) rotate(90deg);\n	}\n	50% {\n		opacity: 0.8;\n		transform: scale(1.1) rotate(180deg);\n	}\n	75% {\n		opacity: 0.6;\n		transform: scale(1.2) rotate(270deg);\n	}\n}\n\n/* 庆祝动画 */\n@keyframes _celebrate_1j0ct_1 {\n	0%,\n	100% {\n		transform: scale(1);\n	}\n	25% {\n		transform: scale(1.2) rotate(-5deg);\n	}\n	75% {\n		transform: scale(1.2) rotate(5deg);\n	}\n}\n\n/* done 卡片的光泽效果 */\n@keyframes _shimmer_1j0ct_1 {\n	0% {\n		left: -100%;\n	}\n	100% {\n		left: 100%;\n	}\n}\n\n/* 输入区域样式 */\n._inputSectionWrapper_1j0ct_535 {\n	position: absolute;\n	width: var(--history-width);\n	top: var(--height);\n	left: var(--side-space);\n	z-index: -1;\n\n	visibility: visible;\n	overflow: hidden;\n\n	height: 48px;\n\n	transition: all 0.2s;\n\n	background: rgba(186, 186, 186, 0.2);\n	backdrop-filter: blur(10px);\n\n	border-bottom-left-radius: calc(var(--border-radius) + 4px);\n	border-bottom-right-radius: calc(var(--border-radius) + 4px);\n\n	border: 2px solid rgba(255, 255, 255, 0.3);\n	box-shadow: 0 1px 16px rgba(0, 0, 0, 0.4);\n\n	&._hidden_1j0ct_558 {\n		visibility: collapse;\n		height: 0;\n	}\n\n	._inputSection_1j0ct_535 {\n		display: flex;\n		align-items: center;\n		gap: 4px;\n		padding: 8px 8px;\n\n		._taskInput_1j0ct_569 {\n			flex: 1;\n			background: rgba(255, 255, 255, 0.4);\n			border: 1px solid rgba(255, 255, 255, 0.3);\n			border-radius: 10px;\n			padding-inline: 10px;\n			color: rgb(20, 20, 20);\n			font-size: 12px;\n			height: 28px;\n			line-height: 1;\n			outline: none;\n			transition: all 0.2s ease;\n\n			/* text-shadow: 0 0 2px rgba(255, 255, 255, 0.8); */\n\n			/* border-color: rgba(57, 182, 255, 0.3); */\n\n			&::placeholder {\n				color: rgb(53, 53, 53);\n			}\n\n			&:focus {\n				background: rgba(255, 255, 255, 0.8);\n				border-color: rgba(57, 182, 255, 0.6);\n				box-shadow: 0 0 0 2px rgba(57, 182, 255, 0.2);\n			}\n		}\n	}\n}\n._wrapper_1oy2s_1 {\n	position: fixed;\n	inset: 0;\n	z-index: 2147483641; /* 确保在所有元素之上，除了 panel */\n	/* pointer-events: none; */\n	cursor: not-allowed;\n	overflow: hidden;\n\n	display: none;\n}\n/* AI 光标样式 */\n._cursor_1vrf3_2 {\n	position: absolute;\n	width: var(--cursor-size, 75px);\n	height: var(--cursor-size, 75px);\n	pointer-events: none;\n	z-index: 10000;\n	transform: translate(-30%, -30%);\n\n	animation: _cursor-enter_1vrf3_1 300ms ease-out forwards;\n}\n\n._cursorBorder_1vrf3_13 {\n	position: absolute;\n	inset: 0;\n	background: linear-gradient(45deg, rgb(57, 182, 255), rgb(189, 69, 251));\n	mask-image: url(https://img.alicdn.com/imgextra/i1/O1CN01YHLVYR1LvqWIyo5kH_!!6000000001362-2-tps-202-202.png);\n	mask-size: 100% 100%;\n	mask-repeat: no-repeat;\n	animation: _cursor-breathe_1vrf3_1 2s ease-in-out infinite;\n}\n\n._cursorFilling_1vrf3_23 {\n	position: absolute;\n	inset: 0;\n	background: url(https://img.alicdn.com/imgextra/i3/O1CN01JZOqOS1Tu1sIKbPLW_!!6000000002441-2-tps-202-202.png);\n	background-size: 100% 100%;\n	background-repeat: no-repeat;\n}\n\n._cursorRipple_1vrf3_31 {\n	position: absolute;\n	inset: 0;\n	pointer-events: none;\n}\n\n._cursor_1vrf3_2._clicking_1vrf3_37 ._cursorRipple_1vrf3_31::after {\n	content: '';\n	position: absolute;\n	width: 100%;\n	height: 100%;\n	left: -30%;\n	top: -30%;\n	border: 4px solid rgba(57, 182, 255, 1);\n	border-radius: 50%;\n	animation: _cursor-ripple_1vrf3_1 300ms ease-out forwards;\n}\n\n/* 光标动画关键帧 */\n@keyframes _cursor-breathe_1vrf3_1 {\n	0%,\n	100% {\n		transform: scale(1);\n		opacity: 0.9;\n	}\n	50% {\n		transform: scale(1.05);\n		opacity: 1;\n	}\n}\n\n@keyframes _cursor-rotate_1vrf3_1 {\n	0% {\n		transform: rotate(0deg);\n	}\n	100% {\n		transform: rotate(360deg);\n	}\n}\n\n@keyframes _cursor-enter_1vrf3_1 {\n	0% {\n		transform: translate(-30%, -30%) scale(0.5);\n		opacity: 0;\n	}\n	100% {\n		transform: translate(-30%, -30%) scale(1);\n		opacity: 1;\n	}\n}\n\n@keyframes _cursor-ripple_1vrf3_1 {\n	0% {\n		transform: scale(0);\n		opacity: 1;\n	}\n	100% {\n		transform: scale(2);\n		opacity: 0;\n	}\n}"));
+      document.head.appendChild(elementStyle);
+    }
+  } catch (e) {
+    console.error("vite-plugin-css-injected-by-js", e);
+  }
+})();
+var __defProp = Object.defineProperty;
+var __typeError = /* @__PURE__ */ __name2((msg) => {
+  throw TypeError(msg);
+}, "__typeError");
+var __defNormalProp = /* @__PURE__ */ __name2((obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value, "__defNormalProp");
+var __name = /* @__PURE__ */ __name2((target, value) => __defProp(target, "name", { value, configurable: true }), "__name");
+var __publicField = /* @__PURE__ */ __name2((obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value), "__publicField");
+var __accessCheck = /* @__PURE__ */ __name2((obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg), "__accessCheck");
+var __privateGet = /* @__PURE__ */ __name2((obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj)), "__privateGet");
+var __privateAdd = /* @__PURE__ */ __name2((obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value), "__privateAdd");
+var __privateSet = /* @__PURE__ */ __name2((obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), member.set(obj, value), value), "__privateSet");
+var __privateMethod = /* @__PURE__ */ __name2((obj, member, method) => (__accessCheck(obj, member, "access private method"), method), "__privateMethod");
+var _wrapper, _indicator, _statusText, _historySection, _expandButton, _pauseButton, _stopButton, _inputSection, _taskInput, _state, _isExpanded, _config, _i18n, _userAnswerResolver, _isWaitingForUserAnswer, _headerUpdateTimer, _pendingHeaderText, _isAnimating, _Panel_instances, toStepData_fn, getToolExecutingText_fn, getToolCompletedText_fn, updateInternal_fn, togglePause_fn, updatePauseButton_fn, stopAgent_fn, submitTask_fn, handleUserAnswer_fn, showInputArea_fn, hideInputArea_fn, shouldShowInputArea_fn, createWrapper_fn, setupEventListeners_fn, toggle_fn, expand_fn, collapse_fn, startHeaderUpdateLoop_fn, stopHeaderUpdateLoop_fn, checkAndUpdateHeader_fn, animateTextChange_fn, updateStatusIndicator_fn, updateHistory_fn, scrollToBottom_fn, createHistoryItem_fn, _cursor, _currentCursorX, _currentCursorY, _targetCursorX, _targetCursorY, _SimulatorMask_instances, createCursor_fn, moveCursorToTarget_fn;
+const _UIState = (_b = class {
+  steps = [];
+  currentStep = null;
+  status = "idle";
+  stepCounter = 0;
+  addStep(stepData) {
+    const step = {
+      id: this.generateId(),
+      stepNumber: ++this.stepCounter,
+      timestamp: /* @__PURE__ */ new Date(),
+      ...stepData
+    };
+    this.steps.push(step);
+    this.currentStep = step;
+    this.updateStatus(step.type);
+    return step;
+  }
+  updateCurrentStep(updates) {
+    if (!this.currentStep) return null;
+    Object.assign(this.currentStep, updates);
+    return this.currentStep;
+  }
+  getCurrentStep() {
+    return this.currentStep;
+  }
+  getAllSteps() {
+    return [...this.steps];
+  }
+  getStatus() {
+    return this.status;
+  }
+  reset() {
+    this.steps = [];
+    this.currentStep = null;
+    this.status = "idle";
+    this.stepCounter = 0;
+  }
+  updateStatus(stepType) {
+    switch (stepType) {
+      case "thinking":
+      case "tool_executing":
+      case "output":
+      case "input":
+      case "retry":
+        this.status = "running";
+        break;
+      case "completed":
+        this.status = "completed";
+        break;
+      case "error":
+        this.status = "error";
+        break;
+    }
+  }
+  generateId() {
+    return `step_${Date.now()}_${Math.random().toString(36).substring(2, 11)}`;
+  }
+}, __name2(_b, "_UIState"), _b);
+__name(_UIState, "UIState");
+let UIState = _UIState;
 const enUS = {
   ui: {
     panel: {
@@ -2065,7 +2130,7 @@ const locales = {
   "en-US": enUS,
   "zh-CN": zhCN
 };
-const _I18n = class _I18n {
+const _I18n = (_c = class {
   language;
   translations;
   constructor(language = "en-US") {
@@ -2095,996 +2160,383 @@ const _I18n = class _I18n {
   getLanguage() {
     return this.language;
   }
-};
-__name2(_I18n, "I18n");
+}, __name2(_c, "_I18n"), _c);
+__name(_I18n, "I18n");
 let I18n = _I18n;
-function parseLLMConfig(config) {
-  return {
-    baseURL: config.baseURL ?? DEFAULT_BASE_URL,
-    apiKey: config.apiKey ?? DEFAULT_API_KEY,
-    model: config.model ?? DEFAULT_MODEL_NAME,
-    temperature: config.temperature ?? DEFAULT_TEMPERATURE,
-    maxTokens: config.maxTokens ?? DEFAULT_MAX_TOKENS,
-    maxRetries: config.maxRetries ?? LLM_MAX_RETRIES
-  };
+function truncate(text, maxLength) {
+  if (text.length > maxLength) {
+    return text.substring(0, maxLength) + "...";
+  }
+  return text;
 }
-__name2(parseLLMConfig, "parseLLMConfig");
-const _EventBus = class _EventBus extends EventTarget {
+__name2(truncate, "truncate");
+__name(truncate, "truncate");
+const wrapper$1 = "_wrapper_1j0ct_1";
+const background = "_background_1j0ct_39";
+const header = "_header_1j0ct_99";
+const pulse = "_pulse_1j0ct_1";
+const retryPulse = "_retryPulse_1j0ct_1";
+const statusTextFadeOut = "_statusTextFadeOut_1j0ct_1";
+const statusTextFadeIn = "_statusTextFadeIn_1j0ct_1";
+const statusSection = "_statusSection_1j0ct_121";
+const indicator = "_indicator_1j0ct_128";
+const thinking = "_thinking_1j0ct_137";
+const tool_executing = "_tool_executing_1j0ct_142";
+const retry = "_retry_1j0ct_147";
+const completed = "_completed_1j0ct_153";
+const input = "_input_1j0ct_154";
+const output = "_output_1j0ct_155";
+const error = "_error_1j0ct_160";
+const statusText = "_statusText_1j0ct_166";
+const fadeOut = "_fadeOut_1j0ct_178";
+const fadeIn = "_fadeIn_1j0ct_182";
+const controls = "_controls_1j0ct_188";
+const controlButton = "_controlButton_1j0ct_193";
+const pauseButton = "_pauseButton_1j0ct_212";
+const paused = "_paused_1j0ct_214";
+const stopButton = "_stopButton_1j0ct_224";
+const historySectionWrapper = "_historySectionWrapper_1j0ct_258";
+const shimmer = "_shimmer_1j0ct_1";
+const celebrate = "_celebrate_1j0ct_1";
+const expanded = "_expanded_1j0ct_290";
+const historySection = "_historySection_1j0ct_258";
+const historyItem = "_historyItem_1j0ct_309";
+const doneSuccess = "_doneSuccess_1j0ct_368";
+const historyContent = "_historyContent_1j0ct_404";
+const statusIcon = "_statusIcon_1j0ct_405";
+const doneError = "_doneError_1j0ct_414";
+const historyMeta = "_historyMeta_1j0ct_465";
+const inputSectionWrapper = "_inputSectionWrapper_1j0ct_535";
+const hidden = "_hidden_1j0ct_558";
+const inputSection = "_inputSection_1j0ct_535";
+const taskInput = "_taskInput_1j0ct_569";
+const styles$1 = {
+  wrapper: wrapper$1,
+  "mask-running": "_mask-running_1j0ct_1",
+  background,
+  header,
+  pulse,
+  retryPulse,
+  statusTextFadeOut,
+  statusTextFadeIn,
+  statusSection,
+  indicator,
+  thinking,
+  tool_executing,
+  retry,
+  completed,
+  input,
+  output,
+  error,
+  statusText,
+  fadeOut,
+  fadeIn,
+  controls,
+  controlButton,
+  pauseButton,
+  paused,
+  stopButton,
+  historySectionWrapper,
+  shimmer,
+  celebrate,
+  expanded,
+  historySection,
+  historyItem,
+  doneSuccess,
+  historyContent,
+  statusIcon,
+  doneError,
+  historyMeta,
+  inputSectionWrapper,
+  hidden,
+  inputSection,
+  taskInput
+};
+const _Panel = (_d = class {
+  constructor(config) {
+    __privateAdd(this, _Panel_instances);
+    __privateAdd(this, _wrapper);
+    __privateAdd(this, _indicator);
+    __privateAdd(this, _statusText);
+    __privateAdd(this, _historySection);
+    __privateAdd(this, _expandButton);
+    __privateAdd(this, _pauseButton);
+    __privateAdd(this, _stopButton);
+    __privateAdd(this, _inputSection);
+    __privateAdd(this, _taskInput);
+    __privateAdd(this, _state, new UIState());
+    __privateAdd(this, _isExpanded, false);
+    __privateAdd(this, _config);
+    __privateAdd(this, _i18n);
+    __privateAdd(this, _userAnswerResolver, null);
+    __privateAdd(this, _isWaitingForUserAnswer, false);
+    __privateAdd(this, _headerUpdateTimer, null);
+    __privateAdd(this, _pendingHeaderText, null);
+    __privateAdd(this, _isAnimating, false);
+    __privateSet(this, _config, config);
+    __privateSet(this, _i18n, new I18n(config.language ?? "en-US"));
+    __privateSet(this, _wrapper, __privateMethod(this, _Panel_instances, createWrapper_fn).call(this));
+    __privateSet(this, _indicator, __privateGet(this, _wrapper).querySelector(`.${styles$1.indicator}`));
+    __privateSet(this, _statusText, __privateGet(this, _wrapper).querySelector(`.${styles$1.statusText}`));
+    __privateSet(this, _historySection, __privateGet(this, _wrapper).querySelector(`.${styles$1.historySection}`));
+    __privateSet(this, _expandButton, __privateGet(this, _wrapper).querySelector(`.${styles$1.expandButton}`));
+    __privateSet(this, _pauseButton, __privateGet(this, _wrapper).querySelector(`.${styles$1.pauseButton}`));
+    __privateSet(this, _stopButton, __privateGet(this, _wrapper).querySelector(`.${styles$1.stopButton}`));
+    __privateSet(this, _inputSection, __privateGet(this, _wrapper).querySelector(`.${styles$1.inputSectionWrapper}`));
+    __privateSet(this, _taskInput, __privateGet(this, _wrapper).querySelector(`.${styles$1.taskInput}`));
+    __privateMethod(this, _Panel_instances, setupEventListeners_fn).call(this);
+    __privateMethod(this, _Panel_instances, startHeaderUpdateLoop_fn).call(this);
+    __privateMethod(this, _Panel_instances, showInputArea_fn).call(this);
+  }
+  get wrapper() {
+    return __privateGet(this, _wrapper);
+  }
   /**
-   * Listen to built-in events
+   * Ask for user input
    */
-  on(event, handler) {
-    const wrappedHandler = /* @__PURE__ */ __name2((e) => {
-      const customEvent = e;
-      const params = customEvent.detail?.[0];
-      return handler(params);
-    }, "wrappedHandler");
-    this.addEventListener(event, wrappedHandler);
+  async askUser(question) {
+    return new Promise((resolve) => {
+      __privateSet(this, _isWaitingForUserAnswer, true);
+      __privateSet(this, _userAnswerResolver, resolve);
+      __privateMethod(this, _Panel_instances, updateInternal_fn).call(this, {
+        type: "output",
+        displayText: __privateGet(this, _i18n).t("ui.panel.question", { question })
+      });
+      if (!__privateGet(this, _isExpanded)) {
+        __privateMethod(this, _Panel_instances, expand_fn).call(this);
+      }
+      __privateMethod(this, _Panel_instances, showInputArea_fn).call(this, __privateGet(this, _i18n).t("ui.panel.userAnswerPrompt"));
+    });
+  }
+  // ========== Public control methods ==========
+  show() {
+    this.wrapper.style.display = "block";
+    void this.wrapper.offsetHeight;
+    this.wrapper.style.opacity = "1";
+    this.wrapper.style.transform = "translateX(-50%) translateY(0)";
+  }
+  hide() {
+    this.wrapper.style.opacity = "0";
+    this.wrapper.style.transform = "translateX(-50%) translateY(20px)";
+    this.wrapper.style.display = "none";
+  }
+  reset() {
+    __privateGet(this, _state).reset();
+    __privateGet(this, _statusText).textContent = __privateGet(this, _i18n).t("ui.panel.ready");
+    __privateMethod(this, _Panel_instances, updateStatusIndicator_fn).call(this, "thinking");
+    __privateMethod(this, _Panel_instances, updateHistory_fn).call(this);
+    __privateMethod(this, _Panel_instances, collapse_fn).call(this);
+    if (__privateGet(this, _config).getPaused()) {
+      __privateGet(this, _config).onPauseToggle();
+    }
+    __privateMethod(this, _Panel_instances, updatePauseButton_fn).call(this);
+    __privateSet(this, _isWaitingForUserAnswer, false);
+    __privateSet(this, _userAnswerResolver, null);
+    __privateMethod(this, _Panel_instances, showInputArea_fn).call(this);
+  }
+  expand() {
+    __privateMethod(this, _Panel_instances, expand_fn).call(this);
+  }
+  collapse() {
+    __privateMethod(this, _Panel_instances, collapse_fn).call(this);
   }
   /**
-   * Listen to built-in events (one-time)
+   * Update panel with semantic data - i18n handled internally
    */
-  once(event, handler) {
-    const wrappedHandler = /* @__PURE__ */ __name2((e) => {
-      const customEvent = e;
-      const params = customEvent.detail?.[0];
-      return handler(params);
-    }, "wrappedHandler");
-    this.addEventListener(event, wrappedHandler, { once: true });
+  update(data) {
+    const stepData = __privateMethod(this, _Panel_instances, toStepData_fn).call(this, data);
+    __privateMethod(this, _Panel_instances, updateInternal_fn).call(this, stepData);
   }
   /**
-   * Emit built-in events
+   * Dispose panel
    */
-  emit(event, ...args) {
-    const customEvent = new CustomEvent(event, { detail: args });
-    this.dispatchEvent(customEvent);
-    return;
-  }
-};
-__name2(_EventBus, "EventBus");
-let EventBus = _EventBus;
-const buses = /* @__PURE__ */ new Map();
-function getEventBus(channel) {
-  if (buses.has(channel)) {
-    return buses.get(channel);
-  }
-  const bus = new EventBus();
-  buses.set(channel, bus);
-  return bus;
-}
-__name2(getEventBus, "getEventBus");
-const InvokeErrorType = {
-  // Retryable
-  NETWORK_ERROR: "network_error",
-  // Network error, retry
-  RATE_LIMIT: "rate_limit",
-  // Rate limit, retry
-  SERVER_ERROR: "server_error",
-  // 5xx, retry
-  NO_TOOL_CALL: "no_tool_call",
-  // Model did not call tool
-  INVALID_TOOL_ARGS: "invalid_tool_args",
-  // Tool args don't match schema
-  TOOL_EXECUTION_ERROR: "tool_execution_error",
-  // Tool execution error
-  UNKNOWN: "unknown",
-  // Non-retryable
-  AUTH_ERROR: "auth_error",
-  // Authentication failed
-  CONTEXT_LENGTH: "context_length",
-  // Prompt too long
-  CONTENT_FILTER: "content_filter"
-  // Content filtered
-};
-const _InvokeError = class _InvokeError extends Error {
-  type;
-  retryable;
-  statusCode;
-  rawError;
-  constructor(type, message, rawError) {
-    super(message);
-    this.name = "InvokeError";
-    this.type = type;
-    this.retryable = this.isRetryable(type);
-    this.rawError = rawError;
-  }
-  isRetryable(type) {
-    const retryableTypes = [
-      InvokeErrorType.NETWORK_ERROR,
-      InvokeErrorType.RATE_LIMIT,
-      InvokeErrorType.SERVER_ERROR,
-      InvokeErrorType.NO_TOOL_CALL,
-      InvokeErrorType.INVALID_TOOL_ARGS,
-      InvokeErrorType.TOOL_EXECUTION_ERROR,
-      InvokeErrorType.UNKNOWN
-    ];
-    return retryableTypes.includes(type);
+  dispose() {
+    __privateSet(this, _isWaitingForUserAnswer, false);
+    __privateMethod(this, _Panel_instances, stopHeaderUpdateLoop_fn).call(this);
+    this.wrapper.remove();
   }
-};
-__name2(_InvokeError, "InvokeError");
-let InvokeError = _InvokeError;
-function zodToOpenAITool(name, tool2) {
-  return {
-    type: "function",
-    function: {
-      name,
-      description: tool2.description,
-      parameters: z.toJSONSchema(tool2.inputSchema, { target: "openapi-3.0" })
+}, __name2(_d, "_Panel"), _d);
+_wrapper = /* @__PURE__ */ new WeakMap();
+_indicator = /* @__PURE__ */ new WeakMap();
+_statusText = /* @__PURE__ */ new WeakMap();
+_historySection = /* @__PURE__ */ new WeakMap();
+_expandButton = /* @__PURE__ */ new WeakMap();
+_pauseButton = /* @__PURE__ */ new WeakMap();
+_stopButton = /* @__PURE__ */ new WeakMap();
+_inputSection = /* @__PURE__ */ new WeakMap();
+_taskInput = /* @__PURE__ */ new WeakMap();
+_state = /* @__PURE__ */ new WeakMap();
+_isExpanded = /* @__PURE__ */ new WeakMap();
+_config = /* @__PURE__ */ new WeakMap();
+_i18n = /* @__PURE__ */ new WeakMap();
+_userAnswerResolver = /* @__PURE__ */ new WeakMap();
+_isWaitingForUserAnswer = /* @__PURE__ */ new WeakMap();
+_headerUpdateTimer = /* @__PURE__ */ new WeakMap();
+_pendingHeaderText = /* @__PURE__ */ new WeakMap();
+_isAnimating = /* @__PURE__ */ new WeakMap();
+_Panel_instances = /* @__PURE__ */ new WeakSet();
+toStepData_fn = /* @__PURE__ */ __name(function(data) {
+  switch (data.type) {
+    case "thinking":
+      return { type: "thinking", displayText: data.text ?? __privateGet(this, _i18n).t("ui.panel.thinking") };
+    case "input":
+      return { type: "input", displayText: data.task };
+    case "question":
+      return {
+        type: "output",
+        displayText: __privateGet(this, _i18n).t("ui.panel.question", { question: data.question })
+      };
+    case "userAnswer":
+      return {
+        type: "input",
+        displayText: __privateGet(this, _i18n).t("ui.panel.userAnswer", { input: data.input })
+      };
+    case "retry":
+      return { type: "retry", displayText: `retry-ing (${data.current} / ${data.max})` };
+    case "error":
+      return { type: "error", displayText: data.message };
+    case "output":
+      return { type: "output", displayText: data.text };
+    case "completed":
+      return { type: "completed", displayText: __privateGet(this, _i18n).t("ui.panel.taskCompleted") };
+    case "toolExecuting":
+      return {
+        type: "tool_executing",
+        toolName: data.toolName,
+        toolArgs: data.args,
+        displayText: __privateMethod(this, _Panel_instances, getToolExecutingText_fn).call(this, data.toolName, data.args)
+      };
+    case "toolCompleted": {
+      const displayText = __privateMethod(this, _Panel_instances, getToolCompletedText_fn).call(this, data.toolName, data.args);
+      if (!displayText) return { type: "tool_executing", displayText: "" };
+      return {
+        type: "tool_executing",
+        toolName: data.toolName,
+        toolArgs: data.args,
+        toolResult: data.result,
+        displayText,
+        duration: data.duration
+      };
     }
-  };
-}
-__name2(zodToOpenAITool, "zodToOpenAITool");
-function lenientParseMacroToolCall(responseData, inputSchema) {
-  const choice = responseData.choices?.[0];
-  if (!choice) {
-    throw new InvokeError(InvokeErrorType.UNKNOWN, "No choices in response", responseData);
   }
-  switch (choice.finish_reason) {
-    case "tool_calls":
-    case "function_call":
-    // gemini
-    case "stop":
-      break;
-    case "length":
-      throw new InvokeError(
-        InvokeErrorType.CONTEXT_LENGTH,
-        "Response truncated: max tokens reached"
-      );
-    case "content_filter":
-      throw new InvokeError(InvokeErrorType.CONTENT_FILTER, "Content filtered by safety system");
+}, "#toStepData");
+getToolExecutingText_fn = /* @__PURE__ */ __name(function(toolName, args) {
+  switch (toolName) {
+    case "click_element_by_index":
+      return __privateGet(this, _i18n).t("ui.tools.clicking", { index: args.index });
+    case "input_text":
+      return __privateGet(this, _i18n).t("ui.tools.inputting", { index: args.index });
+    case "select_dropdown_option":
+      return __privateGet(this, _i18n).t("ui.tools.selecting", { text: args.text });
+    case "scroll":
+      return __privateGet(this, _i18n).t("ui.tools.scrolling");
+    case "wait":
+      return __privateGet(this, _i18n).t("ui.tools.waiting", { seconds: args.seconds });
+    case "done":
+      return __privateGet(this, _i18n).t("ui.tools.done");
     default:
-      throw new InvokeError(
-        InvokeErrorType.UNKNOWN,
-        `Unexpected finish_reason: ${choice.finish_reason}`
-      );
+      return __privateGet(this, _i18n).t("ui.tools.executing", { toolName });
   }
-  const actionSchema = inputSchema.shape.action;
-  if (!actionSchema) {
-    throw new Error('inputSchema must have an "action" field');
+}, "#getToolExecutingText");
+getToolCompletedText_fn = /* @__PURE__ */ __name(function(toolName, args) {
+  switch (toolName) {
+    case "click_element_by_index":
+      return __privateGet(this, _i18n).t("ui.tools.clicked", { index: args.index });
+    case "input_text":
+      return __privateGet(this, _i18n).t("ui.tools.inputted", { text: args.text });
+    case "select_dropdown_option":
+      return __privateGet(this, _i18n).t("ui.tools.selected", { text: args.text });
+    case "scroll":
+      return __privateGet(this, _i18n).t("ui.tools.scrolled");
+    case "wait":
+      return __privateGet(this, _i18n).t("ui.tools.waited");
+    case "done":
+      return null;
+    default:
+      return null;
   }
-  let arg = null;
-  const toolCall = choice.message?.tool_calls?.[0]?.function;
-  arg = toolCall?.arguments ?? null;
-  if (arg && toolCall.name !== "AgentOutput") {
-    console.log(chalk.yellow("lenientParseMacroToolCall: #1 fixing incorrect tool call"));
-    let tmpArg;
-    try {
-      tmpArg = JSON.parse(arg);
-    } catch (error2) {
-      throw new InvokeError(
-        InvokeErrorType.INVALID_TOOL_ARGS,
-        "Failed to parse tool arguments as JSON",
-        error2
-      );
+}, "#getToolCompletedText");
+updateInternal_fn = /* @__PURE__ */ __name(function(stepData) {
+  if (!stepData.displayText) return;
+  const step = __privateGet(this, _state).addStep(stepData);
+  const headerText = truncate(step.displayText, 20);
+  __privateSet(this, _pendingHeaderText, headerText);
+  __privateMethod(this, _Panel_instances, updateStatusIndicator_fn).call(this, step.type);
+  __privateMethod(this, _Panel_instances, updateHistory_fn).call(this);
+  if (step.type === "completed" || step.type === "error") {
+    if (!__privateGet(this, _isExpanded)) {
+      __privateMethod(this, _Panel_instances, expand_fn).call(this);
     }
-    arg = JSON.stringify({ action: { [toolCall.name]: tmpArg } });
-  }
-  if (!arg) {
-    arg = choice.message?.content.trim() || null;
-  }
-  if (!arg) {
-    throw new InvokeError(
-      InvokeErrorType.NO_TOOL_CALL,
-      "No tool call or content found in response",
-      responseData
-    );
-  }
-  let parsedArgs;
-  try {
-    parsedArgs = JSON.parse(arg);
-  } catch (error2) {
-    throw new InvokeError(
-      InvokeErrorType.INVALID_TOOL_ARGS,
-      "Failed to parse tool arguments as JSON",
-      error2
-    );
   }
-  if (parsedArgs.action || parsedArgs.evaluation_previous_goal || parsedArgs.next_goal) {
-    if (!parsedArgs.action) {
-      console.log(chalk.yellow("lenientParseMacroToolCall: #2 fixing incorrect tool call"));
-      parsedArgs.action = {
-        wait: { seconds: 1 }
-      };
-    }
-  } else if (parsedArgs.type && parsedArgs.function) {
-    if (parsedArgs.function.name !== "AgentOutput")
-      throw new InvokeError(
-        InvokeErrorType.INVALID_TOOL_ARGS,
-        `Expected function name "AgentOutput", got "${parsedArgs.function.name}"`,
-        null
-      );
-    console.log(chalk.yellow("lenientParseMacroToolCall: #3 fixing incorrect tool call"));
-    parsedArgs = parsedArgs.function.arguments;
-  } else if (parsedArgs.name && parsedArgs.arguments) {
-    if (parsedArgs.name !== "AgentOutput")
-      throw new InvokeError(
-        InvokeErrorType.INVALID_TOOL_ARGS,
-        `Expected function name "AgentOutput", got "${parsedArgs.name}"`,
-        null
-      );
-    console.log(chalk.yellow("lenientParseMacroToolCall: #4 fixing incorrect tool call"));
-    parsedArgs = parsedArgs.arguments;
+  if (__privateMethod(this, _Panel_instances, shouldShowInputArea_fn).call(this)) {
+    __privateMethod(this, _Panel_instances, showInputArea_fn).call(this);
   } else {
-    console.log(chalk.yellow("lenientParseMacroToolCall: #5 fixing incorrect tool call"));
-    parsedArgs = { action: parsedArgs };
+    __privateMethod(this, _Panel_instances, hideInputArea_fn).call(this);
   }
-  if (typeof parsedArgs === "string") {
-    console.log(chalk.yellow("lenientParseMacroToolCall: #6 fixing incorrect tool call"));
-    try {
-      parsedArgs = JSON.parse(parsedArgs);
-    } catch (error2) {
-      throw new InvokeError(
-        InvokeErrorType.INVALID_TOOL_ARGS,
-        "Failed to parse nested tool arguments as JSON",
-        error2
-      );
-    }
+}, "#updateInternal");
+togglePause_fn = /* @__PURE__ */ __name(function() {
+  const paused2 = __privateGet(this, _config).onPauseToggle();
+  __privateMethod(this, _Panel_instances, updatePauseButton_fn).call(this);
+  if (paused2) {
+    __privateGet(this, _statusText).textContent = __privateGet(this, _i18n).t("ui.panel.paused");
+    __privateMethod(this, _Panel_instances, updateStatusIndicator_fn).call(this, "thinking");
+  } else {
+    __privateGet(this, _statusText).textContent = __privateGet(this, _i18n).t("ui.panel.continueExecution");
+    __privateMethod(this, _Panel_instances, updateStatusIndicator_fn).call(this, "tool_executing");
   }
-  const validation = inputSchema.safeParse(parsedArgs);
-  if (validation.success) {
-    return validation.data;
+}, "#togglePause");
+updatePauseButton_fn = /* @__PURE__ */ __name(function() {
+  const paused2 = __privateGet(this, _config).getPaused();
+  if (paused2) {
+    __privateGet(this, _pauseButton).textContent = "▶";
+    __privateGet(this, _pauseButton).title = __privateGet(this, _i18n).t("ui.panel.continue");
+    __privateGet(this, _pauseButton).classList.add(styles$1.paused);
   } else {
-    const action = parsedArgs.action ?? {};
-    const actionName = Object.keys(action)[0] || "unknown";
-    const actionArgs = JSON.stringify(action[actionName] || "unknown");
-    throw new InvokeError(
-      InvokeErrorType.INVALID_TOOL_ARGS,
-      `Tool arguments validation failed: action "${actionName}" with args ${actionArgs}`,
-      validation.error
-    );
+    __privateGet(this, _pauseButton).textContent = "⏸︎";
+    __privateGet(this, _pauseButton).title = __privateGet(this, _i18n).t("ui.panel.pause");
+    __privateGet(this, _pauseButton).classList.remove(styles$1.paused);
   }
-}
-__name2(lenientParseMacroToolCall, "lenientParseMacroToolCall");
-function modelPatch(body) {
-  const model = body.model || "";
-  if (model.toLowerCase().startsWith("claude")) {
-    body.tool_choice = { type: "tool", name: "AgentOutput" };
-    body.thinking = { type: "disabled" };
+}, "#updatePauseButton");
+stopAgent_fn = /* @__PURE__ */ __name(function() {
+  __privateMethod(this, _Panel_instances, updateInternal_fn).call(this, {
+    type: "error",
+    displayText: __privateGet(this, _i18n).t("ui.panel.taskTerminated")
+  });
+  __privateGet(this, _config).onStop();
+}, "#stopAgent");
+submitTask_fn = /* @__PURE__ */ __name(function() {
+  const input2 = __privateGet(this, _taskInput).value.trim();
+  if (!input2) return;
+  __privateMethod(this, _Panel_instances, hideInputArea_fn).call(this);
+  if (__privateGet(this, _isWaitingForUserAnswer)) {
+    __privateMethod(this, _Panel_instances, handleUserAnswer_fn).call(this, input2);
+  } else {
+    __privateGet(this, _config).onExecuteTask(input2);
   }
-  if (model.toLowerCase().includes("grok")) {
-    console.log("Applying Grok patch: removing tool_choice");
-    delete body.tool_choice;
-    console.log("Applying Grok patch: disable reasoning and thinking");
-    body.thinking = { type: "disabled", effort: "minimal" };
-    body.reasoning = { enabled: false, effort: "low" };
-  }
-  return body;
-}
-__name2(modelPatch, "modelPatch");
-const _OpenAIClient = class _OpenAIClient {
-  config;
-  constructor(config) {
-    this.config = config;
-  }
-  async invoke(messages, tools2, abortSignal) {
-    const openaiTools = Object.entries(tools2).map(([name, tool22]) => zodToOpenAITool(name, tool22));
-    let response;
-    try {
-      response = await fetch(`${this.config.baseURL}/chat/completions`, {
-        method: "POST",
-        headers: {
-          "Content-Type": "application/json",
-          Authorization: `Bearer ${this.config.apiKey}`
-        },
-        body: JSON.stringify(
-          modelPatch({
-            model: this.config.model,
-            temperature: this.config.temperature,
-            max_tokens: this.config.maxTokens,
-            messages,
-            tools: openaiTools,
-            // tool_choice: 'required',
-            tool_choice: { type: "function", function: { name: "AgentOutput" } },
-            // model specific params
-            // reasoning_effort: 'minimal',
-            // verbosity: 'low',
-            parallel_tool_calls: false
-          })
-        ),
-        signal: abortSignal
-      });
-    } catch (error2) {
-      throw new InvokeError(InvokeErrorType.NETWORK_ERROR, "Network request failed", error2);
-    }
-    if (!response.ok) {
-      const errorData = await response.json().catch();
-      const errorMessage = errorData.error?.message || response.statusText;
-      if (response.status === 401 || response.status === 403) {
-        throw new InvokeError(
-          InvokeErrorType.AUTH_ERROR,
-          `Authentication failed: ${errorMessage}`,
-          errorData
-        );
-      }
-      if (response.status === 429) {
-        throw new InvokeError(
-          InvokeErrorType.RATE_LIMIT,
-          `Rate limit exceeded: ${errorMessage}`,
-          errorData
-        );
-      }
-      if (response.status >= 500) {
-        throw new InvokeError(
-          InvokeErrorType.SERVER_ERROR,
-          `Server error: ${errorMessage}`,
-          errorData
-        );
-      }
-      throw new InvokeError(
-        InvokeErrorType.UNKNOWN,
-        `HTTP ${response.status}: ${errorMessage}`,
-        errorData
-      );
-    }
-    const data = await response.json();
-    const tool2 = tools2.AgentOutput;
-    const macroToolInput = lenientParseMacroToolCall(data, tool2.inputSchema);
-    let toolResult;
-    try {
-      toolResult = await tool2.execute(macroToolInput);
-    } catch (e) {
-      throw new InvokeError(
-        InvokeErrorType.TOOL_EXECUTION_ERROR,
-        `Tool execution failed: ${e.message}`,
-        e
-      );
-    }
-    return {
-      toolCall: {
-        // id: toolCall.id,
-        name: "AgentOutput",
-        args: macroToolInput
-      },
-      toolResult,
-      usage: {
-        promptTokens: data.usage?.prompt_tokens ?? 0,
-        completionTokens: data.usage?.completion_tokens ?? 0,
-        totalTokens: data.usage?.total_tokens ?? 0,
-        cachedTokens: data.usage?.prompt_tokens_details?.cached_tokens,
-        reasoningTokens: data.usage?.completion_tokens_details?.reasoning_tokens
-      },
-      rawResponse: data
-    };
-  }
-};
-__name2(_OpenAIClient, "OpenAIClient");
-let OpenAIClient = _OpenAIClient;
-const _LLM = class _LLM {
-  constructor(config, id) {
-    __publicField(this, "config");
-    __publicField(this, "id");
-    __publicField(this, "client");
-    __privateAdd(this, _bus);
-    this.config = parseLLMConfig(config);
-    this.id = id;
-    __privateSet(this, _bus, getEventBus(id));
-    this.client = new OpenAIClient({
-      model: this.config.model,
-      apiKey: this.config.apiKey,
-      baseURL: this.config.baseURL,
-      temperature: this.config.temperature,
-      maxTokens: this.config.maxTokens
-    });
-  }
-  /**
-   * - call llm api *once*
-   * - invoke tool call *once*
-   * - return the result of the tool
-   */
-  async invoke(messages, tools2, abortSignal) {
-    return await withRetry(
-      async () => {
-        const result2 = await this.client.invoke(messages, tools2, abortSignal);
-        return result2;
-      },
-      // retry settings
-      {
-        maxRetries: this.config.maxRetries,
-        onRetry: /* @__PURE__ */ __name2((retries) => {
-          __privateGet(this, _bus).emit("panel:update", {
-            type: "retry",
-            displayText: `retry-ing (${retries} / ${this.config.maxRetries})`
-          });
-        }, "onRetry"),
-        onError: /* @__PURE__ */ __name2((error2, withRetry2) => {
-          __privateGet(this, _bus).emit("panel:update", {
-            type: "error",
-            displayText: `step failed: ${error2.message}`
-          });
-        }, "onError")
-      }
-    );
-  }
-};
-_bus = new WeakMap();
-__name2(_LLM, "LLM");
-let LLM = _LLM;
-async function withRetry(fn, settings) {
-  let retries = 0;
-  let lastError = null;
-  while (retries <= settings.maxRetries) {
-    if (retries > 0) {
-      settings.onRetry(retries);
-      await new Promise((resolve) => setTimeout(resolve, 100));
-    }
-    try {
-      return await fn();
-    } catch (error2) {
-      console.error(error2);
-      settings.onError(error2, retries < settings.maxRetries);
-      if (error2?.name === "AbortError") throw error2;
-      if (error2 instanceof InvokeError && !error2.retryable) throw error2;
-      lastError = error2;
-      retries++;
-      await new Promise((resolve) => setTimeout(resolve, 100));
-    }
-  }
-  throw lastError;
-}
-__name2(withRetry, "withRetry");
-const SYSTEM_PROMPT = 'You are an AI agent designed to operate in an iterative loop to automate browser tasks. Your ultimate goal is accomplishing the task provided in <user_request>.\n\n<intro>\nYou excel at following tasks:\n1. Navigating complex websites and extracting precise information\n2. Automating form submissions and interactive web actions\n3. Gathering and saving information \n4. Operate effectively in an agent loop\n5. Efficiently performing diverse web tasks\n</intro>\n\n<language_settings>\n- Default working language: **中文**\n- Use the language that user is using. Return in user\'s language.\n</language_settings>\n\n<input>\nAt every step, your input will consist of: \n1. <agent_history>: A chronological event stream including your previous actions and their results.\n2. <agent_state>: Current <user_request> and <step_info>.\n3. <browser_state>: Current URL, interactive elements indexed for actions, and visible page content.\n</input>\n\n<agent_history>\nAgent history will be given as a list of step information as follows:\n\n<step_{step_number}>:\nEvaluation of Previous Step: Assessment of last action\nMemory: Your memory of this step\nNext Goal: Your goal for this step\nAction Results: Your actions and their results\n</step_{step_number}>\n\nand system messages wrapped in <sys> tag.\n</agent_history>\n\n<user_request>\nUSER REQUEST: This is your ultimate objective and always remains visible.\n- This has the highest priority. Make the user happy.\n- If the user request is very specific - then carefully follow each step and dont skip or hallucinate steps.\n- If the task is open ended you can plan yourself how to get it done.\n</user_request>\n\n<browser_state>\n1. Browser State will be given as:\n\nCurrent URL: URL of the page you are currently viewing.\nInteractive Elements: All interactive elements will be provided in format as [index]<type>text</type> where\n- index: Numeric identifier for interaction\n- type: HTML element type (button, input, etc.)\n- text: Element description\n\nExamples:\n[33]<div>User form</div>\n\\t*[35]<button aria-label=\'Submit form\'>Submit</button>\n\nNote that:\n- Only elements with numeric indexes in [] are interactive\n- (stacked) indentation (with \\t) is important and means that the element is a (html) child of the element above (with a lower index)\n- Elements tagged with `*[` are the new clickable elements that appeared on the website since the last step - if url has not changed.\n- Pure text elements without [] are not interactive.\n</browser_state>\n\n<browser_rules>\nStrictly follow these rules while using the browser and navigating the web:\n- Only interact with elements that have a numeric [index] assigned.\n- Only use indexes that are explicitly provided.\n- If the page changes after, for example, an input text action, analyze if you need to interact with new elements, e.g. selecting the right option from the list.\n- By default, only elements in the visible viewport are listed. Use scrolling actions if you suspect relevant content is offscreen which you need to interact with. Scroll ONLY if there are more pixels below or above the page.\n- You can scroll by a specific number of pages using the num_pages parameter (e.g., 0.5 for half page, 2.0 for two pages).\n- All the elements that are scrollable are marked with `data-scrollable` attribute. Including the scrollable distance in every directions. You can scroll *the element* in case some area are overflowed.\n- If a captcha appears, tell user you can not solve captcha. finished the task and ask user to solve it.\n- If expected elements are missing, try scrolling, or navigating back.\n- If the page is not fully loaded, use the `wait` action.\n- Do not repeat one action for more than 3 times unless some conditions changed.\n- If you fill an input field and your action sequence is interrupted, most often something changed e.g. suggestions popped up under the field.\n- If the <user_request> includes specific page information such as product type, rating, price, location, etc., try to apply filters to be more efficient.\n- The <user_request> is the ultimate goal. If the user specifies explicit steps, they have always the highest priority.\n- If you input_text into a field, you might need to press enter, click the search button, or select from dropdown for completion.\n- Don\'t login into a page if you don\'t have to. Don\'t login if you don\'t have the credentials. \n- There are 2 types of tasks always first think which type of request you are dealing with:\n1. Very specific step by step instructions:\n- Follow them as very precise and don\'t skip steps. Try to complete everything as requested.\n2. Open ended tasks. Plan yourself, be creative in achieving them.\n- If you get stuck e.g. with logins or captcha in open-ended tasks you can re-evaluate the task and try alternative ways, e.g. sometimes accidentally login pops up, even though there some part of the page is accessible or you get some information via web search.\n</browser_rules>\n\n<capability>\n- You can only handle single page app. Do not jump out of current page.\n- Do not click on link if it will open in a new page (etc. <a target="_blank">)\n- It is ok to fail the task.\n	- User can be wrong. If the request of user is not achievable, inappropriate or you do not have enough information or tools to achieve it. Tell user to make a better request.\n	- Webpage can be broken. All webpages or apps have bugs. Some bug will make it hard for your job. It\'s encouraged to tell user the problem of current page. Your feedbacks (including failing) are valuable for user.\n	- Trying to hard can be harmful. Repeating some action back and forth or pushing for a complex procedure with little knowledge can cause unwanted result and harmful side-effects. User would rather you to complete the task with a fail.\n- If you are not clear about the request or steps. `ask_user` to clarify it.\n- If you do not have knowledge for the current webpage or task. You must require user to give specific instructions and detailed steps.\n</capability>\n\n<task_completion_rules>\nYou must call the `done` action in one of three cases:\n- When you have fully completed the USER REQUEST.\n- When you reach the final allowed step (`max_steps`), even if the task is incomplete.\n- When you feel stuck or unable to solve user request. Or user request is not clear or contains inappropriate content.\n- If it is ABSOLUTELY IMPOSSIBLE to continue.\n\nThe `done` action is your opportunity to terminate and share your findings with the user.\n- Set `success` to `true` only if the full USER REQUEST has been completed with no missing components.\n- If any part of the request is missing, incomplete, or uncertain, set `success` to `false`.\n- You can use the `text` field of the `done` action to communicate your findings and to provide a coherent reply to the user and fulfill the USER REQUEST.\n- You are ONLY ALLOWED to call `done` as a single action. Don\'t call it together with other actions.\n- If the user asks for specified format, such as "return JSON with following structure", "return a list of format...", MAKE sure to use the right format in your answer.\n- If the user asks for a structured output, your `done` action\'s schema may be modified. Take this schema into account when solving the task!\n</task_completion_rules>\n\n<reasoning_rules>\nExhibit the following reasoning patterns to successfully achieve the <user_request>:\n\n- Reason about <agent_history> to track progress and context toward <user_request>.\n- Analyze the most recent "Next Goal" and "Action Result" in <agent_history> and clearly state what you previously tried to achieve.\n- Analyze all relevant items in <agent_history> and <browser_state> to understand your state.\n- Explicitly judge success/failure/uncertainty of the last action. Never assume an action succeeded just because it appears to be executed in your last step in <agent_history>. If the expected change is missing, mark the last action as failed (or uncertain) and plan a recovery.\n- Analyze whether you are stuck, e.g. when you repeat the same actions multiple times without any progress. Then consider alternative approaches e.g. scrolling for more context or ask user for help.\n- `ask_user` for help if you have any difficulty. Users want to be kept in the loop.\n- If you see information relevant to <user_request>, plan saving the information to memory.\n- Always reason about the <user_request>. Make sure to carefully analyze the specific steps and information required. E.g. specific filters, specific form fields, specific information to search. Make sure to always compare the current trajectory with the user request and think carefully if thats how the user requested it.\n</reasoning_rules>\n\n<examples>\nHere are examples of good output patterns. Use them as reference but never copy them directly.\n\n<evaluation_examples>\n- Positive Examples:\n"evaluation_previous_goal": "Successfully navigated to the product page and found the target information. Verdict: Success"\n"evaluation_previous_goal": "Clicked the login button and user authentication form appeared. Verdict: Success"\n</evaluation_examples>\n\n<memory_examples>\n"memory": "Found many pending reports that need to be analyzed in the main page. Successfully processed the first 2 reports on quarterly sales data and moving on to inventory analysis and customer feedback reports."\n</memory_examples>\n\n<next_goal_examples>\n"next_goal": "Click on the \'Add to Cart\' button to proceed with the purchase flow."\n"next_goal": "Extract details from the first item on the page."\n</next_goal_examples>\n</examples>\n\n<output>\nYou must ALWAYS respond with a valid JSON in this exact format:\n\n{\n  "evaluation_previous_goal": "Concise one-sentence analysis of your last action. Clearly state success, failure, or uncertain.",\n  "memory": "1-3 concise sentences of specific memory of this step and overall progress. You should put here everything that will help you track progress in future steps. Like counting pages visited, items found, etc.",\n  "next_goal": "State the next immediate goal and action to achieve it, in one clear sentence."\n  "action":{"one_action_name": {// action-specific parameter}}\n}\n</output>\n';
-async function waitUntil(check, timeout = 60 * 601e3) {
-  if (check()) return true;
-  return new Promise((resolve, reject) => {
-    const start = Date.now();
-    const interval = setInterval(() => {
-      if (check()) {
-        clearInterval(interval);
-        resolve(true);
-      } else if (Date.now() - start > timeout) {
-        clearInterval(interval);
-        reject(new Error("Timeout waiting for condition to become true"));
-      }
-    }, 100);
-  });
-}
-__name2(waitUntil, "waitUntil");
-async function waitFor(seconds) {
-  await new Promise((resolve) => setTimeout(resolve, seconds * 1e3));
-}
-__name2(waitFor, "waitFor");
-function truncate(text, maxLength) {
-  if (text.length > maxLength) {
-    return text.substring(0, maxLength) + "...";
-  }
-  return text;
-}
-__name2(truncate, "truncate");
-function trimLines(text) {
-  return text.split("\n").map((line) => line.trim()).join("\n");
-}
-__name2(trimLines, "trimLines");
-function randomID(existingIDs) {
-  let id = Math.random().toString(36).substring(2, 11);
-  if (!existingIDs) {
-    return id;
-  }
-  const MAX_TRY = 1e3;
-  let tryCount = 0;
-  while (existingIDs.includes(id)) {
-    id = Math.random().toString(36).substring(2, 11);
-    tryCount++;
-    if (tryCount > MAX_TRY) {
-      throw new Error("randomID: too many try");
-    }
-  }
-  return id;
-}
-__name2(randomID, "randomID");
-if (!window.__PAGE_AGENT_IDS__) {
-  window.__PAGE_AGENT_IDS__ = [];
-}
-const ids = window.__PAGE_AGENT_IDS__;
-function uid() {
-  const id = randomID(ids);
-  ids.push(id);
-  return id;
-}
-__name2(uid, "uid");
-function tool(options) {
-  return options;
-}
-__name2(tool, "tool");
-const tools = /* @__PURE__ */ new Map();
-tools.set(
-  "done",
-  tool({
-    description: "Complete task - provide a summary of results for the user. Set success=True if task completed successfully, false otherwise. Text should be your response to the user summarizing results.",
-    inputSchema: zod.object({
-      text: zod.string(),
-      success: zod.boolean().default(true)
-    }),
-    execute: /* @__PURE__ */ __name2(async function(input2) {
-      return Promise.resolve("Task completed");
-    }, "execute")
-  })
-);
-tools.set(
-  "wait",
-  tool({
-    description: "Wait for x seconds. default 1s (max 10 seconds, min 1 second). This can be used to wait until the page or data is fully loaded.",
-    inputSchema: zod.object({
-      seconds: zod.number().min(1).max(10).default(1)
-    }),
-    execute: /* @__PURE__ */ __name2(async function(input2) {
-      const lastTimeUpdate = await this.pageController.getLastUpdateTime();
-      const actualWaitTime = Math.max(0, input2.seconds - (Date.now() - lastTimeUpdate) / 1e3);
-      console.log(`actualWaitTime: ${actualWaitTime} seconds`);
-      await waitFor(actualWaitTime);
-      return `✅ Waited for ${input2.seconds} seconds.`;
-    }, "execute")
-  })
-);
-tools.set(
-  "ask_user",
-  tool({
-    description: "Ask the user a question and wait for their answer. Use this if you need more information or clarification.",
-    inputSchema: zod.object({
-      question: zod.string()
-    }),
-    execute: /* @__PURE__ */ __name2(async function(input2) {
-      const answer = await this.panel.askUser(input2.question);
-      return `✅ Received user answer: ${answer}`;
-    }, "execute")
-  })
-);
-tools.set(
-  "click_element_by_index",
-  tool({
-    description: "Click element by index",
-    inputSchema: zod.object({
-      index: zod.int().min(0)
-    }),
-    execute: /* @__PURE__ */ __name2(async function(input2) {
-      const result2 = await this.pageController.clickElement(input2.index);
-      return result2.message;
-    }, "execute")
-  })
-);
-tools.set(
-  "input_text",
-  tool({
-    description: "Click and input text into a input interactive element",
-    inputSchema: zod.object({
-      index: zod.int().min(0),
-      text: zod.string()
-    }),
-    execute: /* @__PURE__ */ __name2(async function(input2) {
-      const result2 = await this.pageController.inputText(input2.index, input2.text);
-      return result2.message;
-    }, "execute")
-  })
-);
-tools.set(
-  "select_dropdown_option",
-  tool({
-    description: "Select dropdown option for interactive element index by the text of the option you want to select",
-    inputSchema: zod.object({
-      index: zod.int().min(0),
-      text: zod.string()
-    }),
-    execute: /* @__PURE__ */ __name2(async function(input2) {
-      const result2 = await this.pageController.selectOption(input2.index, input2.text);
-      return result2.message;
-    }, "execute")
-  })
-);
-tools.set(
-  "scroll",
-  tool({
-    description: "Scroll the page by specified number of pages (set down=True to scroll down, down=False to scroll up, num_pages=number of pages to scroll like 0.5 for half page, 1.0 for one page, etc.). Optional index parameter to scroll within a specific element or its scroll container (works well for dropdowns and custom UI components). Optional pixels parameter to scroll by a specific number of pixels instead of pages.",
-    inputSchema: zod.object({
-      down: zod.boolean().default(true),
-      num_pages: zod.number().min(0).max(10).optional().default(0.1),
-      pixels: zod.number().int().min(0).optional(),
-      index: zod.number().int().min(0).optional()
-    }),
-    execute: /* @__PURE__ */ __name2(async function(input2) {
-      const result2 = await this.pageController.scroll({
-        ...input2,
-        numPages: input2.num_pages
-      });
-      return result2.message;
-    }, "execute")
-  })
-);
-tools.set(
-  "scroll_horizontally",
-  tool({
-    description: "Scroll the page or element horizontally (set right=True to scroll right, right=False to scroll left, pixels=number of pixels to scroll). Optional index parameter to scroll within a specific element or its scroll container (works well for wide tables).",
-    inputSchema: zod.object({
-      right: zod.boolean().default(true),
-      pixels: zod.number().int().min(0),
-      index: zod.number().int().min(0).optional()
-    }),
-    execute: /* @__PURE__ */ __name2(async function(input2) {
-      const result2 = await this.pageController.scrollHorizontally(input2);
-      return result2.message;
-    }, "execute")
-  })
-);
-tools.set(
-  "execute_javascript",
-  tool({
-    description: "Execute JavaScript code on the current page. Supports async/await syntax. Use with caution!",
-    inputSchema: zod.object({
-      script: zod.string()
-    }),
-    execute: /* @__PURE__ */ __name2(async function(input2) {
-      const result2 = await this.pageController.executeJavascript(input2.script);
-      return result2.message;
-    }, "execute")
-  })
-);
-const _UIState = class _UIState {
-  steps = [];
-  currentStep = null;
-  status = "idle";
-  stepCounter = 0;
-  addStep(stepData) {
-    const step = {
-      id: this.generateId(),
-      stepNumber: ++this.stepCounter,
-      timestamp: /* @__PURE__ */ new Date(),
-      ...stepData
-    };
-    this.steps.push(step);
-    this.currentStep = step;
-    this.updateStatus(step.type);
-    return step;
-  }
-  updateCurrentStep(updates) {
-    if (!this.currentStep) return null;
-    Object.assign(this.currentStep, updates);
-    return this.currentStep;
-  }
-  getCurrentStep() {
-    return this.currentStep;
-  }
-  getAllSteps() {
-    return [...this.steps];
-  }
-  getStatus() {
-    return this.status;
-  }
-  reset() {
-    this.steps = [];
-    this.currentStep = null;
-    this.status = "idle";
-    this.stepCounter = 0;
-  }
-  updateStatus(stepType) {
-    switch (stepType) {
-      case "thinking":
-      case "tool_executing":
-      case "output":
-      case "input":
-      case "retry":
-        this.status = "running";
-        break;
-      case "completed":
-        this.status = "completed";
-        break;
-      case "error":
-        this.status = "error";
-        break;
-    }
-  }
-  generateId() {
-    return `step_${Date.now()}_${Math.random().toString(36).substring(2, 11)}`;
-  }
-};
-__name2(_UIState, "UIState");
-let UIState = _UIState;
-const wrapper$1 = "_wrapper_1j0ct_1";
-const background = "_background_1j0ct_39";
-const header = "_header_1j0ct_99";
-const pulse = "_pulse_1j0ct_1";
-const retryPulse = "_retryPulse_1j0ct_1";
-const statusTextFadeOut = "_statusTextFadeOut_1j0ct_1";
-const statusTextFadeIn = "_statusTextFadeIn_1j0ct_1";
-const statusSection = "_statusSection_1j0ct_121";
-const indicator = "_indicator_1j0ct_128";
-const thinking = "_thinking_1j0ct_137";
-const tool_executing = "_tool_executing_1j0ct_142";
-const retry = "_retry_1j0ct_147";
-const completed = "_completed_1j0ct_153";
-const input = "_input_1j0ct_154";
-const output = "_output_1j0ct_155";
-const error = "_error_1j0ct_160";
-const statusText = "_statusText_1j0ct_166";
-const fadeOut = "_fadeOut_1j0ct_178";
-const fadeIn = "_fadeIn_1j0ct_182";
-const controls = "_controls_1j0ct_188";
-const controlButton = "_controlButton_1j0ct_193";
-const pauseButton = "_pauseButton_1j0ct_212";
-const paused = "_paused_1j0ct_214";
-const stopButton = "_stopButton_1j0ct_224";
-const historySectionWrapper = "_historySectionWrapper_1j0ct_258";
-const shimmer = "_shimmer_1j0ct_1";
-const celebrate = "_celebrate_1j0ct_1";
-const expanded = "_expanded_1j0ct_290";
-const historySection = "_historySection_1j0ct_258";
-const historyItem = "_historyItem_1j0ct_309";
-const doneSuccess = "_doneSuccess_1j0ct_368";
-const historyContent = "_historyContent_1j0ct_404";
-const statusIcon = "_statusIcon_1j0ct_405";
-const doneError = "_doneError_1j0ct_414";
-const historyMeta = "_historyMeta_1j0ct_465";
-const inputSectionWrapper = "_inputSectionWrapper_1j0ct_535";
-const hidden = "_hidden_1j0ct_558";
-const inputSection = "_inputSection_1j0ct_535";
-const taskInput = "_taskInput_1j0ct_569";
-const styles$1 = {
-  wrapper: wrapper$1,
-  "mask-running": "_mask-running_1j0ct_1",
-  background,
-  header,
-  pulse,
-  retryPulse,
-  statusTextFadeOut,
-  statusTextFadeIn,
-  statusSection,
-  indicator,
-  thinking,
-  tool_executing,
-  retry,
-  completed,
-  input,
-  output,
-  error,
-  statusText,
-  fadeOut,
-  fadeIn,
-  controls,
-  controlButton,
-  pauseButton,
-  paused,
-  stopButton,
-  historySectionWrapper,
-  shimmer,
-  celebrate,
-  expanded,
-  historySection,
-  historyItem,
-  doneSuccess,
-  historyContent,
-  statusIcon,
-  doneError,
-  historyMeta,
-  inputSectionWrapper,
-  hidden,
-  inputSection,
-  taskInput
-};
-const _Panel = class _Panel {
-  constructor(pageAgent) {
-    __privateAdd(this, _Panel_instances);
-    __privateAdd(this, _wrapper);
-    __privateAdd(this, _indicator);
-    __privateAdd(this, _statusText);
-    __privateAdd(this, _historySection);
-    __privateAdd(this, _expandButton);
-    __privateAdd(this, _pauseButton);
-    __privateAdd(this, _stopButton);
-    __privateAdd(this, _inputSection);
-    __privateAdd(this, _taskInput);
-    __privateAdd(this, _bus2);
-    __privateAdd(this, _state, new UIState());
-    __privateAdd(this, _isExpanded, false);
-    __privateAdd(this, _pageAgent);
-    __privateAdd(this, _userAnswerResolver, null);
-    __privateAdd(this, _isWaitingForUserAnswer, false);
-    __privateAdd(this, _headerUpdateTimer, null);
-    __privateAdd(this, _pendingHeaderText, null);
-    __privateAdd(this, _isAnimating, false);
-    __privateSet(this, _pageAgent, pageAgent);
-    __privateSet(this, _bus2, pageAgent.bus);
-    __privateSet(this, _wrapper, __privateMethod(this, _Panel_instances, createWrapper_fn).call(this));
-    __privateSet(this, _indicator, __privateGet(this, _wrapper).querySelector(`.${styles$1.indicator}`));
-    __privateSet(this, _statusText, __privateGet(this, _wrapper).querySelector(`.${styles$1.statusText}`));
-    __privateSet(this, _historySection, __privateGet(this, _wrapper).querySelector(`.${styles$1.historySection}`));
-    __privateSet(this, _expandButton, __privateGet(this, _wrapper).querySelector(`.${styles$1.expandButton}`));
-    __privateSet(this, _pauseButton, __privateGet(this, _wrapper).querySelector(`.${styles$1.pauseButton}`));
-    __privateSet(this, _stopButton, __privateGet(this, _wrapper).querySelector(`.${styles$1.stopButton}`));
-    __privateSet(this, _inputSection, __privateGet(this, _wrapper).querySelector(`.${styles$1.inputSectionWrapper}`));
-    __privateSet(this, _taskInput, __privateGet(this, _wrapper).querySelector(`.${styles$1.taskInput}`));
-    __privateMethod(this, _Panel_instances, setupEventListeners_fn).call(this);
-    __privateMethod(this, _Panel_instances, startHeaderUpdateLoop_fn).call(this);
-    __privateMethod(this, _Panel_instances, showInputArea_fn).call(this);
-    __privateGet(this, _bus2).on("panel:show", () => __privateMethod(this, _Panel_instances, show_fn).call(this));
-    __privateGet(this, _bus2).on("panel:hide", () => __privateMethod(this, _Panel_instances, hide_fn).call(this));
-    __privateGet(this, _bus2).on("panel:reset", () => __privateMethod(this, _Panel_instances, reset_fn).call(this));
-    __privateGet(this, _bus2).on("panel:update", (stepData) => __privateMethod(this, _Panel_instances, update_fn).call(this, stepData));
-    __privateGet(this, _bus2).on("panel:expand", () => __privateMethod(this, _Panel_instances, expand_fn).call(this));
-    __privateGet(this, _bus2).on("panel:collapse", () => __privateMethod(this, _Panel_instances, collapse_fn).call(this));
-  }
-  get wrapper() {
-    return __privateGet(this, _wrapper);
-  }
-  /**
-   * Ask for user input
-   */
-  async askUser(question) {
-    return new Promise((resolve) => {
-      __privateSet(this, _isWaitingForUserAnswer, true);
-      __privateSet(this, _userAnswerResolver, resolve);
-      __privateMethod(this, _Panel_instances, update_fn).call(this, {
-        type: "output",
-        displayText: __privateGet(this, _pageAgent).i18n.t("ui.panel.question", { question })
-      });
-      if (!__privateGet(this, _isExpanded)) {
-        __privateMethod(this, _Panel_instances, expand_fn).call(this);
-      }
-      __privateMethod(this, _Panel_instances, showInputArea_fn).call(this, __privateGet(this, _pageAgent).i18n.t("ui.panel.userAnswerPrompt"));
-    });
-  }
-  /**
-   * Dispose panel
-   */
-  dispose() {
-    __privateSet(this, _isWaitingForUserAnswer, false);
-    __privateMethod(this, _Panel_instances, stopHeaderUpdateLoop_fn).call(this);
-    this.wrapper.remove();
-  }
-};
-_wrapper = new WeakMap();
-_indicator = new WeakMap();
-_statusText = new WeakMap();
-_historySection = new WeakMap();
-_expandButton = new WeakMap();
-_pauseButton = new WeakMap();
-_stopButton = new WeakMap();
-_inputSection = new WeakMap();
-_taskInput = new WeakMap();
-_bus2 = new WeakMap();
-_state = new WeakMap();
-_isExpanded = new WeakMap();
-_pageAgent = new WeakMap();
-_userAnswerResolver = new WeakMap();
-_isWaitingForUserAnswer = new WeakMap();
-_headerUpdateTimer = new WeakMap();
-_pendingHeaderText = new WeakMap();
-_isAnimating = new WeakMap();
-_Panel_instances = new WeakSet();
-/**
- * Update status
- */
-update_fn = /* @__PURE__ */ __name2(function(stepData) {
-  const step = __privateGet(this, _state).addStep(stepData);
-  const headerText = truncate(step.displayText, 20);
-  __privateSet(this, _pendingHeaderText, headerText);
-  __privateMethod(this, _Panel_instances, updateStatusIndicator_fn).call(this, step.type);
-  __privateMethod(this, _Panel_instances, updateHistory_fn).call(this);
-  if (step.type === "completed" || step.type === "error") {
-    if (!__privateGet(this, _isExpanded)) {
-      __privateMethod(this, _Panel_instances, expand_fn).call(this);
-    }
-  }
-  if (__privateMethod(this, _Panel_instances, shouldShowInputArea_fn).call(this)) {
-    __privateMethod(this, _Panel_instances, showInputArea_fn).call(this);
-  } else {
-    __privateMethod(this, _Panel_instances, hideInputArea_fn).call(this);
-  }
-}, "#update");
-/**
- * Show panel
- */
-show_fn = /* @__PURE__ */ __name2(function() {
-  this.wrapper.style.display = "block";
-  void this.wrapper.offsetHeight;
-  this.wrapper.style.opacity = "1";
-  this.wrapper.style.transform = "translateX(-50%) translateY(0)";
-}, "#show");
-/**
- * Hide panel
- */
-hide_fn = /* @__PURE__ */ __name2(function() {
-  this.wrapper.style.opacity = "0";
-  this.wrapper.style.transform = "translateX(-50%) translateY(20px)";
-  this.wrapper.style.display = "none";
-}, "#hide");
-/**
- * Reset state
- */
-reset_fn = /* @__PURE__ */ __name2(function() {
-  __privateGet(this, _state).reset();
-  __privateGet(this, _statusText).textContent = __privateGet(this, _pageAgent).i18n.t("ui.panel.ready");
-  __privateMethod(this, _Panel_instances, updateStatusIndicator_fn).call(this, "thinking");
-  __privateMethod(this, _Panel_instances, updateHistory_fn).call(this);
-  __privateMethod(this, _Panel_instances, collapse_fn).call(this);
-  __privateGet(this, _pageAgent).paused = false;
-  __privateMethod(this, _Panel_instances, updatePauseButton_fn).call(this);
-  __privateSet(this, _isWaitingForUserAnswer, false);
-  __privateSet(this, _userAnswerResolver, null);
-  __privateMethod(this, _Panel_instances, showInputArea_fn).call(this);
-}, "#reset");
-/**
- * Toggle pause state
- */
-togglePause_fn = /* @__PURE__ */ __name2(function() {
-  __privateGet(this, _pageAgent).paused = !__privateGet(this, _pageAgent).paused;
-  __privateMethod(this, _Panel_instances, updatePauseButton_fn).call(this);
-  if (__privateGet(this, _pageAgent).paused) {
-    __privateGet(this, _statusText).textContent = __privateGet(this, _pageAgent).i18n.t("ui.panel.paused");
-    __privateMethod(this, _Panel_instances, updateStatusIndicator_fn).call(this, "thinking");
-  } else {
-    __privateGet(this, _statusText).textContent = __privateGet(this, _pageAgent).i18n.t("ui.panel.continueExecution");
-    __privateMethod(this, _Panel_instances, updateStatusIndicator_fn).call(this, "tool_executing");
-  }
-}, "#togglePause");
-/**
- * Update pause button state
- */
-updatePauseButton_fn = /* @__PURE__ */ __name2(function() {
-  if (__privateGet(this, _pageAgent).paused) {
-    __privateGet(this, _pauseButton).textContent = "▶";
-    __privateGet(this, _pauseButton).title = __privateGet(this, _pageAgent).i18n.t("ui.panel.continue");
-    __privateGet(this, _pauseButton).classList.add(styles$1.paused);
-  } else {
-    __privateGet(this, _pauseButton).textContent = "⏸︎";
-    __privateGet(this, _pauseButton).title = __privateGet(this, _pageAgent).i18n.t("ui.panel.pause");
-    __privateGet(this, _pauseButton).classList.remove(styles$1.paused);
-  }
-}, "#updatePauseButton");
-/**
- * Stop Agent
- */
-stopAgent_fn = /* @__PURE__ */ __name2(function() {
-  __privateMethod(this, _Panel_instances, update_fn).call(this, {
-    type: "error",
-    displayText: __privateGet(this, _pageAgent).i18n.t("ui.panel.taskTerminated")
-  });
-  __privateGet(this, _pageAgent).dispose();
-}, "#stopAgent");
-/**
- * Submit task
- */
-submitTask_fn = /* @__PURE__ */ __name2(function() {
-  const input2 = __privateGet(this, _taskInput).value.trim();
-  if (!input2) return;
-  __privateMethod(this, _Panel_instances, hideInputArea_fn).call(this);
-  if (__privateGet(this, _isWaitingForUserAnswer)) {
-    __privateMethod(this, _Panel_instances, handleUserAnswer_fn).call(this, input2);
-  } else {
-    __privateGet(this, _pageAgent).execute(input2);
-  }
-}, "#submitTask");
-/**
- * Handle user answer
- */
-handleUserAnswer_fn = /* @__PURE__ */ __name2(function(input2) {
-  __privateMethod(this, _Panel_instances, update_fn).call(this, {
-    type: "input",
-    displayText: __privateGet(this, _pageAgent).i18n.t("ui.panel.userAnswer", { input: input2 })
-  });
-  __privateSet(this, _isWaitingForUserAnswer, false);
-  if (__privateGet(this, _userAnswerResolver)) {
-    __privateGet(this, _userAnswerResolver).call(this, input2);
-    __privateSet(this, _userAnswerResolver, null);
+}, "#submitTask");
+handleUserAnswer_fn = /* @__PURE__ */ __name(function(input2) {
+  __privateMethod(this, _Panel_instances, updateInternal_fn).call(this, {
+    type: "input",
+    displayText: __privateGet(this, _i18n).t("ui.panel.userAnswer", { input: input2 })
+  });
+  __privateSet(this, _isWaitingForUserAnswer, false);
+  if (__privateGet(this, _userAnswerResolver)) {
+    __privateGet(this, _userAnswerResolver).call(this, input2);
+    __privateSet(this, _userAnswerResolver, null);
   }
 }, "#handleUserAnswer");
-/**
- * Show input area
- */
-showInputArea_fn = /* @__PURE__ */ __name2(function(placeholder) {
+showInputArea_fn = /* @__PURE__ */ __name(function(placeholder) {
   __privateGet(this, _taskInput).value = "";
-  __privateGet(this, _taskInput).placeholder = placeholder || __privateGet(this, _pageAgent).i18n.t("ui.panel.taskInput");
+  __privateGet(this, _taskInput).placeholder = placeholder || __privateGet(this, _i18n).t("ui.panel.taskInput");
   __privateGet(this, _inputSection).classList.remove(styles$1.hidden);
   setTimeout(() => {
     __privateGet(this, _taskInput).focus();
   }, 100);
 }, "#showInputArea");
-/**
- * Hide input area
- */
-hideInputArea_fn = /* @__PURE__ */ __name2(function() {
+hideInputArea_fn = /* @__PURE__ */ __name(function() {
   __privateGet(this, _inputSection).classList.add(styles$1.hidden);
 }, "#hideInputArea");
-/**
- * Check if input area should be shown
- */
-shouldShowInputArea_fn = /* @__PURE__ */ __name2(function() {
+shouldShowInputArea_fn = /* @__PURE__ */ __name(function() {
   if (__privateGet(this, _isWaitingForUserAnswer)) return true;
   const steps = __privateGet(this, _state).getAllSteps();
   if (steps.length === 0) {
@@ -3093,7 +2545,7 @@ shouldShowInputArea_fn = /* @__PURE__ */ __name2(function() {
   const lastStep = steps[steps.length - 1];
   return lastStep.type === "completed" || lastStep.type === "error";
 }, "#shouldShowInputArea");
-createWrapper_fn = /* @__PURE__ */ __name2(function() {
+createWrapper_fn = /* @__PURE__ */ __name(function() {
   const wrapper2 = document.createElement("div");
   wrapper2.id = "page-agent-runtime_agent-panel";
   wrapper2.className = `${styles$1.wrapper} ${styles$1.collapsed}`;
@@ -3107,23 +2559,23 @@ createWrapper_fn = /* @__PURE__ */ __name2(function() {
     stepNumber: 0,
     timestamp: /* @__PURE__ */ new Date(),
     type: "thinking",
-    displayText: __privateGet(this, _pageAgent).i18n.t("ui.panel.waitingPlaceholder")
+    displayText: __privateGet(this, _i18n).t("ui.panel.waitingPlaceholder")
   })}
 				</div>
 			</div>
 			<div class="${styles$1.header}">
 				<div class="${styles$1.statusSection}">
 					<div class="${styles$1.indicator} ${styles$1.thinking}"></div>
-					<div class="${styles$1.statusText}">${__privateGet(this, _pageAgent).i18n.t("ui.panel.ready")}</div>
+					<div class="${styles$1.statusText}">${__privateGet(this, _i18n).t("ui.panel.ready")}</div>
 				</div>
 				<div class="${styles$1.controls}">
-					<button class="${styles$1.controlButton} ${styles$1.expandButton}" title="${__privateGet(this, _pageAgent).i18n.t("ui.panel.expand")}">
+					<button class="${styles$1.controlButton} ${styles$1.expandButton}" title="${__privateGet(this, _i18n).t("ui.panel.expand")}">
 						▼
 					</button>
-					<button class="${styles$1.controlButton} ${styles$1.pauseButton}" title="${__privateGet(this, _pageAgent).i18n.t("ui.panel.pause")}">
+					<button class="${styles$1.controlButton} ${styles$1.pauseButton}" title="${__privateGet(this, _i18n).t("ui.panel.pause")}">
 						⏸︎
 					</button>
-					<button class="${styles$1.controlButton} ${styles$1.stopButton}" title="${__privateGet(this, _pageAgent).i18n.t("ui.panel.stop")}">
+					<button class="${styles$1.controlButton} ${styles$1.stopButton}" title="${__privateGet(this, _i18n).t("ui.panel.stop")}">
 						X
 					</button>
 				</div>
@@ -3141,7 +2593,7 @@ createWrapper_fn = /* @__PURE__ */ __name2(function() {
   document.body.appendChild(wrapper2);
   return wrapper2;
 }, "#createWrapper");
-setupEventListeners_fn = /* @__PURE__ */ __name2(function() {
+setupEventListeners_fn = /* @__PURE__ */ __name(function() {
   const header2 = this.wrapper.querySelector(`.${styles$1.header}`);
   header2.addEventListener("click", (e) => {
     if (e.target.closest(`.${styles$1.controlButton}`)) {
@@ -3172,46 +2624,37 @@ setupEventListeners_fn = /* @__PURE__ */ __name2(function() {
     e.stopPropagation();
   });
 }, "#setupEventListeners");
-toggle_fn = /* @__PURE__ */ __name2(function() {
+toggle_fn = /* @__PURE__ */ __name(function() {
   if (__privateGet(this, _isExpanded)) {
     __privateMethod(this, _Panel_instances, collapse_fn).call(this);
   } else {
     __privateMethod(this, _Panel_instances, expand_fn).call(this);
   }
 }, "#toggle");
-expand_fn = /* @__PURE__ */ __name2(function() {
+expand_fn = /* @__PURE__ */ __name(function() {
   __privateSet(this, _isExpanded, true);
   this.wrapper.classList.remove(styles$1.collapsed);
   this.wrapper.classList.add(styles$1.expanded);
   __privateGet(this, _expandButton).textContent = "▲";
 }, "#expand");
-collapse_fn = /* @__PURE__ */ __name2(function() {
+collapse_fn = /* @__PURE__ */ __name(function() {
   __privateSet(this, _isExpanded, false);
   this.wrapper.classList.remove(styles$1.expanded);
   this.wrapper.classList.add(styles$1.collapsed);
   __privateGet(this, _expandButton).textContent = "▼";
 }, "#collapse");
-/**
- * Start periodic header update loop
- */
-startHeaderUpdateLoop_fn = /* @__PURE__ */ __name2(function() {
+startHeaderUpdateLoop_fn = /* @__PURE__ */ __name(function() {
   __privateSet(this, _headerUpdateTimer, setInterval(() => {
     __privateMethod(this, _Panel_instances, checkAndUpdateHeader_fn).call(this);
   }, 450));
 }, "#startHeaderUpdateLoop");
-/**
- * Stop periodic header update loop
- */
-stopHeaderUpdateLoop_fn = /* @__PURE__ */ __name2(function() {
+stopHeaderUpdateLoop_fn = /* @__PURE__ */ __name(function() {
   if (__privateGet(this, _headerUpdateTimer)) {
     clearInterval(__privateGet(this, _headerUpdateTimer));
     __privateSet(this, _headerUpdateTimer, null);
   }
 }, "#stopHeaderUpdateLoop");
-/**
- * Check if header needs update and trigger animation if not currently animating
- */
-checkAndUpdateHeader_fn = /* @__PURE__ */ __name2(function() {
+checkAndUpdateHeader_fn = /* @__PURE__ */ __name(function() {
   if (!__privateGet(this, _pendingHeaderText) || __privateGet(this, _isAnimating)) {
     return;
   }
@@ -3223,10 +2666,7 @@ checkAndUpdateHeader_fn = /* @__PURE__ */ __name2(function() {
   __privateSet(this, _pendingHeaderText, null);
   __privateMethod(this, _Panel_instances, animateTextChange_fn).call(this, textToShow);
 }, "#checkAndUpdateHeader");
-/**
- * Animate text change with fade out/in effect
- */
-animateTextChange_fn = /* @__PURE__ */ __name2(function(newText) {
+animateTextChange_fn = /* @__PURE__ */ __name(function(newText) {
   __privateSet(this, _isAnimating, true);
   __privateGet(this, _statusText).classList.add(styles$1.fadeOut);
   setTimeout(() => {
@@ -3239,21 +2679,21 @@ animateTextChange_fn = /* @__PURE__ */ __name2(function(newText) {
     }, 300);
   }, 150);
 }, "#animateTextChange");
-updateStatusIndicator_fn = /* @__PURE__ */ __name2(function(type) {
+updateStatusIndicator_fn = /* @__PURE__ */ __name(function(type) {
   __privateGet(this, _indicator).className = styles$1.indicator;
   __privateGet(this, _indicator).classList.add(styles$1[type]);
 }, "#updateStatusIndicator");
-updateHistory_fn = /* @__PURE__ */ __name2(function() {
+updateHistory_fn = /* @__PURE__ */ __name(function() {
   const steps = __privateGet(this, _state).getAllSteps();
   __privateGet(this, _historySection).innerHTML = steps.map((step) => __privateMethod(this, _Panel_instances, createHistoryItem_fn).call(this, step)).join("");
   __privateMethod(this, _Panel_instances, scrollToBottom_fn).call(this);
 }, "#updateHistory");
-scrollToBottom_fn = /* @__PURE__ */ __name2(function() {
+scrollToBottom_fn = /* @__PURE__ */ __name(function() {
   setTimeout(() => {
     __privateGet(this, _historySection).scrollTop = __privateGet(this, _historySection).scrollHeight;
   }, 0);
 }, "#scrollToBottom");
-createHistoryItem_fn = /* @__PURE__ */ __name2(function(step) {
+createHistoryItem_fn = /* @__PURE__ */ __name(function(step) {
   const time = step.timestamp.toLocaleTimeString("zh-CN", {
     hour12: false,
     hour: "2-digit",
@@ -3264,8 +2704,8 @@ createHistoryItem_fn = /* @__PURE__ */ __name2(function(step) {
   let statusIcon2 = "";
   if (step.type === "completed") {
     if (step.toolName === "done") {
-      const failureKeyword = __privateGet(this, _pageAgent).i18n.t("ui.tools.resultFailure");
-      const errorKeyword = __privateGet(this, _pageAgent).i18n.t("ui.tools.resultError");
+      const failureKeyword = __privateGet(this, _i18n).t("ui.tools.resultFailure");
+      const errorKeyword = __privateGet(this, _i18n).t("ui.tools.resultError");
       const isSuccess = !step.toolResult || !step.toolResult.includes(failureKeyword) && !step.toolResult.includes(errorKeyword);
       typeClass = isSuccess ? styles$1.doneSuccess : styles$1.doneError;
       statusIcon2 = isSuccess ? "🎉" : "❌";
@@ -3291,7 +2731,7 @@ createHistoryItem_fn = /* @__PURE__ */ __name2(function(step) {
     statusIcon2 = "🧠";
   }
   const durationText = step.duration ? ` · ${step.duration}ms` : "";
-  const stepLabel = __privateGet(this, _pageAgent).i18n.t("ui.panel.step", {
+  const stepLabel = __privateGet(this, _i18n).t("ui.panel.step", {
     number: step.stepNumber.toString(),
     time,
     duration: durationText || ""
@@ -3309,46 +2749,8 @@ createHistoryItem_fn = /* @__PURE__ */ __name2(function(step) {
 			</div>
 		`;
 }, "#createHistoryItem");
-__name2(_Panel, "Panel");
+__name(_Panel, "Panel");
 let Panel = _Panel;
-function getToolExecutingText(toolName, args, i18n) {
-  switch (toolName) {
-    case "click_element_by_index":
-      return i18n.t("ui.tools.clicking", { index: args.index });
-    case "input_text":
-      return i18n.t("ui.tools.inputting", { index: args.index });
-    case "select_dropdown_option":
-      return i18n.t("ui.tools.selecting", { text: args.text });
-    case "scroll":
-      return i18n.t("ui.tools.scrolling");
-    case "wait":
-      return i18n.t("ui.tools.waiting", { seconds: args.seconds });
-    case "done":
-      return i18n.t("ui.tools.done");
-    default:
-      return i18n.t("ui.tools.executing", { toolName });
-  }
-}
-__name2(getToolExecutingText, "getToolExecutingText");
-function getToolCompletedText(toolName, args, i18n) {
-  switch (toolName) {
-    case "click_element_by_index":
-      return i18n.t("ui.tools.clicked", { index: args.index });
-    case "input_text":
-      return i18n.t("ui.tools.inputted", { text: args.text });
-    case "select_dropdown_option":
-      return i18n.t("ui.tools.selected", { text: args.text });
-    case "scroll":
-      return i18n.t("ui.tools.scrolled");
-    case "wait":
-      return i18n.t("ui.tools.waited");
-    case "done":
-      return null;
-    default:
-      return null;
-  }
-}
-__name2(getToolCompletedText, "getToolCompletedText");
 function hasDarkModeClass() {
   const DFEAULT_DARK_MODE_CLASSES = ["dark", "dark-mode", "theme-dark", "night", "night-mode"];
   const htmlElement = document.documentElement;
@@ -3365,6 +2767,7 @@ function hasDarkModeClass() {
   return false;
 }
 __name2(hasDarkModeClass, "hasDarkModeClass");
+__name(hasDarkModeClass, "hasDarkModeClass");
 function parseRgbColor(colorString) {
   const rgbMatch = /rgba?\((\d+),\s*(\d+),\s*(\d+)/.exec(colorString);
   if (!rgbMatch) {
@@ -3377,6 +2780,7 @@ function parseRgbColor(colorString) {
   };
 }
 __name2(parseRgbColor, "parseRgbColor");
+__name(parseRgbColor, "parseRgbColor");
 function isColorDark(colorString, threshold = 128) {
   if (!colorString || colorString === "transparent" || colorString.startsWith("rgba(0, 0, 0, 0)")) {
     return false;
@@ -3389,6 +2793,7 @@ function isColorDark(colorString, threshold = 128) {
   return luminance < threshold;
 }
 __name2(isColorDark, "isColorDark");
+__name(isColorDark, "isColorDark");
 function isBackgroundDark() {
   const htmlStyle = window.getComputedStyle(document.documentElement);
   const bodyStyle = window.getComputedStyle(document.body);
@@ -3402,6 +2807,7 @@ function isBackgroundDark() {
   return false;
 }
 __name2(isBackgroundDark, "isBackgroundDark");
+__name(isBackgroundDark, "isBackgroundDark");
 function isPageDark() {
   if (hasDarkModeClass()) {
     return true;
@@ -3412,6 +2818,7 @@ function isPageDark() {
   return false;
 }
 __name2(isPageDark, "isPageDark");
+__name(isPageDark, "isPageDark");
 const wrapper = "_wrapper_1oy2s_1";
 const styles = {
   wrapper
@@ -3428,7 +2835,7 @@ const cursorStyles = {
   cursorRipple,
   clicking
 };
-const _SimulatorMask = class _SimulatorMask {
+const _SimulatorMask = (_e = class {
   constructor() {
     __privateAdd(this, _SimulatorMask_instances);
     __publicField(this, "wrapper", document.createElement("div"));
@@ -3488,83 +2895,649 @@ const _SimulatorMask = class _SimulatorMask {
       this.triggerClickAnimation();
     });
   }
-  setCursorPosition(x, y) {
-    __privateSet(this, _targetCursorX, x);
-    __privateSet(this, _targetCursorY, y);
+  setCursorPosition(x, y) {
+    __privateSet(this, _targetCursorX, x);
+    __privateSet(this, _targetCursorY, y);
+  }
+  triggerClickAnimation() {
+    __privateGet(this, _cursor).classList.remove(cursorStyles.clicking);
+    void __privateGet(this, _cursor).offsetHeight;
+    __privateGet(this, _cursor).classList.add(cursorStyles.clicking);
+  }
+  show() {
+    this.motion.start();
+    this.motion.fadeIn();
+    this.wrapper.style.display = "block";
+    __privateSet(this, _currentCursorX, window.innerWidth / 2);
+    __privateSet(this, _currentCursorY, window.innerHeight / 2);
+    __privateSet(this, _targetCursorX, __privateGet(this, _currentCursorX));
+    __privateSet(this, _targetCursorY, __privateGet(this, _currentCursorY));
+    __privateGet(this, _cursor).style.left = `${__privateGet(this, _currentCursorX)}px`;
+    __privateGet(this, _cursor).style.top = `${__privateGet(this, _currentCursorY)}px`;
+  }
+  hide() {
+    this.motion.fadeOut();
+    this.motion.pause();
+    __privateGet(this, _cursor).classList.remove(cursorStyles.clicking);
+    setTimeout(() => {
+      this.wrapper.style.display = "none";
+    }, 800);
+  }
+  dispose() {
+    this.motion.dispose();
+    this.wrapper.remove();
+  }
+}, __name2(_e, "_SimulatorMask"), _e);
+_cursor = /* @__PURE__ */ new WeakMap();
+_currentCursorX = /* @__PURE__ */ new WeakMap();
+_currentCursorY = /* @__PURE__ */ new WeakMap();
+_targetCursorX = /* @__PURE__ */ new WeakMap();
+_targetCursorY = /* @__PURE__ */ new WeakMap();
+_SimulatorMask_instances = /* @__PURE__ */ new WeakSet();
+createCursor_fn = /* @__PURE__ */ __name(function() {
+  __privateGet(this, _cursor).className = cursorStyles.cursor;
+  const rippleContainer = document.createElement("div");
+  rippleContainer.className = cursorStyles.cursorRipple;
+  __privateGet(this, _cursor).appendChild(rippleContainer);
+  const fillingLayer = document.createElement("div");
+  fillingLayer.className = cursorStyles.cursorFilling;
+  __privateGet(this, _cursor).appendChild(fillingLayer);
+  const borderLayer = document.createElement("div");
+  borderLayer.className = cursorStyles.cursorBorder;
+  __privateGet(this, _cursor).appendChild(borderLayer);
+  this.wrapper.appendChild(__privateGet(this, _cursor));
+}, "#createCursor");
+moveCursorToTarget_fn = /* @__PURE__ */ __name(function() {
+  const newX = __privateGet(this, _currentCursorX) + (__privateGet(this, _targetCursorX) - __privateGet(this, _currentCursorX)) * 0.2;
+  const newY = __privateGet(this, _currentCursorY) + (__privateGet(this, _targetCursorY) - __privateGet(this, _currentCursorY)) * 0.2;
+  const xDistance = Math.abs(newX - __privateGet(this, _targetCursorX));
+  if (xDistance > 0) {
+    if (xDistance < 2) {
+      __privateSet(this, _currentCursorX, __privateGet(this, _targetCursorX));
+    } else {
+      __privateSet(this, _currentCursorX, newX);
+    }
+    __privateGet(this, _cursor).style.left = `${__privateGet(this, _currentCursorX)}px`;
+  }
+  const yDistance = Math.abs(newY - __privateGet(this, _targetCursorY));
+  if (yDistance > 0) {
+    if (yDistance < 2) {
+      __privateSet(this, _currentCursorY, __privateGet(this, _targetCursorY));
+    } else {
+      __privateSet(this, _currentCursorY, newY);
+    }
+    __privateGet(this, _cursor).style.top = `${__privateGet(this, _currentCursorY)}px`;
+  }
+  requestAnimationFrame(() => __privateMethod(this, _SimulatorMask_instances, moveCursorToTarget_fn).call(this));
+}, "#moveCursorToTarget");
+__name(_SimulatorMask, "SimulatorMask");
+let SimulatorMask = _SimulatorMask;
+const DEFAULT_MODEL_NAME = "PAGE-AGENT-FREE-TESTING-RANDOM";
+const DEFAULT_API_KEY = "PAGE-AGENT-FREE-TESTING-RANDOM";
+const DEFAULT_BASE_URL = "https://hwcxiuzfylggtcktqgij.supabase.co/functions/v1/llm-testing-proxy";
+const LLM_MAX_RETRIES = 2;
+const MAX_STEPS = 20;
+const DEFAULT_TEMPERATURE = 0.7;
+const DEFAULT_MAX_TOKENS = 4096;
+function parseLLMConfig(config) {
+  return {
+    baseURL: config.baseURL ?? DEFAULT_BASE_URL,
+    apiKey: config.apiKey ?? DEFAULT_API_KEY,
+    model: config.model ?? DEFAULT_MODEL_NAME,
+    temperature: config.temperature ?? DEFAULT_TEMPERATURE,
+    maxTokens: config.maxTokens ?? DEFAULT_MAX_TOKENS,
+    maxRetries: config.maxRetries ?? LLM_MAX_RETRIES
+  };
+}
+__name2(parseLLMConfig, "parseLLMConfig");
+const InvokeErrorType = {
+  // Retryable
+  NETWORK_ERROR: "network_error",
+  // Network error, retry
+  RATE_LIMIT: "rate_limit",
+  // Rate limit, retry
+  SERVER_ERROR: "server_error",
+  // 5xx, retry
+  NO_TOOL_CALL: "no_tool_call",
+  // Model did not call tool
+  INVALID_TOOL_ARGS: "invalid_tool_args",
+  // Tool args don't match schema
+  TOOL_EXECUTION_ERROR: "tool_execution_error",
+  // Tool execution error
+  UNKNOWN: "unknown",
+  // Non-retryable
+  AUTH_ERROR: "auth_error",
+  // Authentication failed
+  CONTEXT_LENGTH: "context_length",
+  // Prompt too long
+  CONTENT_FILTER: "content_filter"
+  // Content filtered
+};
+const _InvokeError = class _InvokeError extends Error {
+  type;
+  retryable;
+  statusCode;
+  rawError;
+  constructor(type, message, rawError) {
+    super(message);
+    this.name = "InvokeError";
+    this.type = type;
+    this.retryable = this.isRetryable(type);
+    this.rawError = rawError;
+  }
+  isRetryable(type) {
+    const retryableTypes = [
+      InvokeErrorType.NETWORK_ERROR,
+      InvokeErrorType.RATE_LIMIT,
+      InvokeErrorType.SERVER_ERROR,
+      InvokeErrorType.NO_TOOL_CALL,
+      InvokeErrorType.INVALID_TOOL_ARGS,
+      InvokeErrorType.TOOL_EXECUTION_ERROR,
+      InvokeErrorType.UNKNOWN
+    ];
+    return retryableTypes.includes(type);
+  }
+};
+__name2(_InvokeError, "InvokeError");
+let InvokeError = _InvokeError;
+function zodToOpenAITool(name, tool2) {
+  return {
+    type: "function",
+    function: {
+      name,
+      description: tool2.description,
+      parameters: z.toJSONSchema(tool2.inputSchema, { target: "openapi-3.0" })
+    }
+  };
+}
+__name2(zodToOpenAITool, "zodToOpenAITool");
+function lenientParseMacroToolCall(responseData, inputSchema) {
+  const choice = responseData.choices?.[0];
+  if (!choice) {
+    throw new InvokeError(InvokeErrorType.UNKNOWN, "No choices in response", responseData);
+  }
+  switch (choice.finish_reason) {
+    case "tool_calls":
+    case "function_call":
+    // gemini
+    case "stop":
+      break;
+    case "length":
+      throw new InvokeError(
+        InvokeErrorType.CONTEXT_LENGTH,
+        "Response truncated: max tokens reached"
+      );
+    case "content_filter":
+      throw new InvokeError(InvokeErrorType.CONTENT_FILTER, "Content filtered by safety system");
+    default:
+      throw new InvokeError(
+        InvokeErrorType.UNKNOWN,
+        `Unexpected finish_reason: ${choice.finish_reason}`
+      );
+  }
+  const actionSchema = inputSchema.shape.action;
+  if (!actionSchema) {
+    throw new Error('inputSchema must have an "action" field');
+  }
+  let arg = null;
+  const toolCall = choice.message?.tool_calls?.[0]?.function;
+  arg = toolCall?.arguments ?? null;
+  if (arg && toolCall.name !== "AgentOutput") {
+    console.log(chalk.yellow("lenientParseMacroToolCall: #1 fixing incorrect tool call"));
+    let tmpArg;
+    try {
+      tmpArg = JSON.parse(arg);
+    } catch (error2) {
+      throw new InvokeError(
+        InvokeErrorType.INVALID_TOOL_ARGS,
+        "Failed to parse tool arguments as JSON",
+        error2
+      );
+    }
+    arg = JSON.stringify({ action: { [toolCall.name]: tmpArg } });
+  }
+  if (!arg) {
+    arg = choice.message?.content.trim() || null;
   }
-  triggerClickAnimation() {
-    __privateGet(this, _cursor).classList.remove(cursorStyles.clicking);
-    void __privateGet(this, _cursor).offsetHeight;
-    __privateGet(this, _cursor).classList.add(cursorStyles.clicking);
+  if (!arg) {
+    throw new InvokeError(
+      InvokeErrorType.NO_TOOL_CALL,
+      "No tool call or content found in response",
+      responseData
+    );
   }
-  show() {
-    this.motion.start();
-    this.motion.fadeIn();
-    this.wrapper.style.display = "block";
-    __privateSet(this, _currentCursorX, window.innerWidth / 2);
-    __privateSet(this, _currentCursorY, window.innerHeight / 2);
-    __privateSet(this, _targetCursorX, __privateGet(this, _currentCursorX));
-    __privateSet(this, _targetCursorY, __privateGet(this, _currentCursorY));
-    __privateGet(this, _cursor).style.left = `${__privateGet(this, _currentCursorX)}px`;
-    __privateGet(this, _cursor).style.top = `${__privateGet(this, _currentCursorY)}px`;
+  let parsedArgs;
+  try {
+    parsedArgs = JSON.parse(arg);
+  } catch (error2) {
+    throw new InvokeError(
+      InvokeErrorType.INVALID_TOOL_ARGS,
+      "Failed to parse tool arguments as JSON",
+      error2
+    );
   }
-  hide() {
-    this.motion.fadeOut();
-    this.motion.pause();
-    __privateGet(this, _cursor).classList.remove(cursorStyles.clicking);
-    setTimeout(() => {
-      this.wrapper.style.display = "none";
-    }, 800);
+  if (parsedArgs.action || parsedArgs.evaluation_previous_goal || parsedArgs.next_goal) {
+    if (!parsedArgs.action) {
+      console.log(chalk.yellow("lenientParseMacroToolCall: #2 fixing incorrect tool call"));
+      parsedArgs.action = {
+        wait: { seconds: 1 }
+      };
+    }
+  } else if (parsedArgs.type && parsedArgs.function) {
+    if (parsedArgs.function.name !== "AgentOutput")
+      throw new InvokeError(
+        InvokeErrorType.INVALID_TOOL_ARGS,
+        `Expected function name "AgentOutput", got "${parsedArgs.function.name}"`,
+        null
+      );
+    console.log(chalk.yellow("lenientParseMacroToolCall: #3 fixing incorrect tool call"));
+    parsedArgs = parsedArgs.function.arguments;
+  } else if (parsedArgs.name && parsedArgs.arguments) {
+    if (parsedArgs.name !== "AgentOutput")
+      throw new InvokeError(
+        InvokeErrorType.INVALID_TOOL_ARGS,
+        `Expected function name "AgentOutput", got "${parsedArgs.name}"`,
+        null
+      );
+    console.log(chalk.yellow("lenientParseMacroToolCall: #4 fixing incorrect tool call"));
+    parsedArgs = parsedArgs.arguments;
+  } else {
+    console.log(chalk.yellow("lenientParseMacroToolCall: #5 fixing incorrect tool call"));
+    parsedArgs = { action: parsedArgs };
   }
-  dispose() {
-    this.motion.dispose();
-    this.wrapper.remove();
+  if (typeof parsedArgs === "string") {
+    console.log(chalk.yellow("lenientParseMacroToolCall: #6 fixing incorrect tool call"));
+    try {
+      parsedArgs = JSON.parse(parsedArgs);
+    } catch (error2) {
+      throw new InvokeError(
+        InvokeErrorType.INVALID_TOOL_ARGS,
+        "Failed to parse nested tool arguments as JSON",
+        error2
+      );
+    }
+  }
+  const validation = inputSchema.safeParse(parsedArgs);
+  if (validation.success) {
+    return validation.data;
+  } else {
+    const action = parsedArgs.action ?? {};
+    const actionName = Object.keys(action)[0] || "unknown";
+    const actionArgs = JSON.stringify(action[actionName] || "unknown");
+    throw new InvokeError(
+      InvokeErrorType.INVALID_TOOL_ARGS,
+      `Tool arguments validation failed: action "${actionName}" with args ${actionArgs}`,
+      validation.error
+    );
+  }
+}
+__name2(lenientParseMacroToolCall, "lenientParseMacroToolCall");
+function modelPatch(body) {
+  const model = body.model || "";
+  if (model.toLowerCase().startsWith("claude")) {
+    body.tool_choice = { type: "tool", name: "AgentOutput" };
+    body.thinking = { type: "disabled" };
+  }
+  if (model.toLowerCase().includes("grok")) {
+    console.log("Applying Grok patch: removing tool_choice");
+    delete body.tool_choice;
+    console.log("Applying Grok patch: disable reasoning and thinking");
+    body.thinking = { type: "disabled", effort: "minimal" };
+    body.reasoning = { enabled: false, effort: "low" };
+  }
+  return body;
+}
+__name2(modelPatch, "modelPatch");
+const _OpenAIClient = class _OpenAIClient {
+  config;
+  constructor(config) {
+    this.config = config;
+  }
+  async invoke(messages, tools2, abortSignal) {
+    const openaiTools = Object.entries(tools2).map(([name, tool22]) => zodToOpenAITool(name, tool22));
+    let response;
+    try {
+      response = await fetch(`${this.config.baseURL}/chat/completions`, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          Authorization: `Bearer ${this.config.apiKey}`
+        },
+        body: JSON.stringify(
+          modelPatch({
+            model: this.config.model,
+            temperature: this.config.temperature,
+            max_tokens: this.config.maxTokens,
+            messages,
+            tools: openaiTools,
+            // tool_choice: 'required',
+            tool_choice: { type: "function", function: { name: "AgentOutput" } },
+            // model specific params
+            // reasoning_effort: 'minimal',
+            // verbosity: 'low',
+            parallel_tool_calls: false
+          })
+        ),
+        signal: abortSignal
+      });
+    } catch (error2) {
+      throw new InvokeError(InvokeErrorType.NETWORK_ERROR, "Network request failed", error2);
+    }
+    if (!response.ok) {
+      const errorData = await response.json().catch();
+      const errorMessage = errorData.error?.message || response.statusText;
+      if (response.status === 401 || response.status === 403) {
+        throw new InvokeError(
+          InvokeErrorType.AUTH_ERROR,
+          `Authentication failed: ${errorMessage}`,
+          errorData
+        );
+      }
+      if (response.status === 429) {
+        throw new InvokeError(
+          InvokeErrorType.RATE_LIMIT,
+          `Rate limit exceeded: ${errorMessage}`,
+          errorData
+        );
+      }
+      if (response.status >= 500) {
+        throw new InvokeError(
+          InvokeErrorType.SERVER_ERROR,
+          `Server error: ${errorMessage}`,
+          errorData
+        );
+      }
+      throw new InvokeError(
+        InvokeErrorType.UNKNOWN,
+        `HTTP ${response.status}: ${errorMessage}`,
+        errorData
+      );
+    }
+    const data = await response.json();
+    const tool2 = tools2.AgentOutput;
+    const macroToolInput = lenientParseMacroToolCall(data, tool2.inputSchema);
+    let toolResult;
+    try {
+      toolResult = await tool2.execute(macroToolInput);
+    } catch (e) {
+      throw new InvokeError(
+        InvokeErrorType.TOOL_EXECUTION_ERROR,
+        `Tool execution failed: ${e.message}`,
+        e
+      );
+    }
+    return {
+      toolCall: {
+        // id: toolCall.id,
+        name: "AgentOutput",
+        args: macroToolInput
+      },
+      toolResult,
+      usage: {
+        promptTokens: data.usage?.prompt_tokens ?? 0,
+        completionTokens: data.usage?.completion_tokens ?? 0,
+        totalTokens: data.usage?.total_tokens ?? 0,
+        cachedTokens: data.usage?.prompt_tokens_details?.cached_tokens,
+        reasoningTokens: data.usage?.completion_tokens_details?.reasoning_tokens
+      },
+      rawResponse: data
+    };
   }
 };
-_cursor = new WeakMap();
-_currentCursorX = new WeakMap();
-_currentCursorY = new WeakMap();
-_targetCursorX = new WeakMap();
-_targetCursorY = new WeakMap();
-_SimulatorMask_instances = new WeakSet();
-createCursor_fn = /* @__PURE__ */ __name2(function() {
-  __privateGet(this, _cursor).className = cursorStyles.cursor;
-  const rippleContainer = document.createElement("div");
-  rippleContainer.className = cursorStyles.cursorRipple;
-  __privateGet(this, _cursor).appendChild(rippleContainer);
-  const fillingLayer = document.createElement("div");
-  fillingLayer.className = cursorStyles.cursorFilling;
-  __privateGet(this, _cursor).appendChild(fillingLayer);
-  const borderLayer = document.createElement("div");
-  borderLayer.className = cursorStyles.cursorBorder;
-  __privateGet(this, _cursor).appendChild(borderLayer);
-  this.wrapper.appendChild(__privateGet(this, _cursor));
-}, "#createCursor");
-moveCursorToTarget_fn = /* @__PURE__ */ __name2(function() {
-  const newX = __privateGet(this, _currentCursorX) + (__privateGet(this, _targetCursorX) - __privateGet(this, _currentCursorX)) * 0.2;
-  const newY = __privateGet(this, _currentCursorY) + (__privateGet(this, _targetCursorY) - __privateGet(this, _currentCursorY)) * 0.2;
-  const xDistance = Math.abs(newX - __privateGet(this, _targetCursorX));
-  if (xDistance > 0) {
-    if (xDistance < 2) {
-      __privateSet(this, _currentCursorX, __privateGet(this, _targetCursorX));
-    } else {
-      __privateSet(this, _currentCursorX, newX);
+__name2(_OpenAIClient, "OpenAIClient");
+let OpenAIClient = _OpenAIClient;
+const _LLM = class _LLM extends EventTarget {
+  config;
+  client;
+  constructor(config) {
+    super();
+    this.config = parseLLMConfig(config);
+    this.client = new OpenAIClient({
+      model: this.config.model,
+      apiKey: this.config.apiKey,
+      baseURL: this.config.baseURL,
+      temperature: this.config.temperature,
+      maxTokens: this.config.maxTokens
+    });
+  }
+  /**
+   * - call llm api *once*
+   * - invoke tool call *once*
+   * - return the result of the tool
+   */
+  async invoke(messages, tools2, abortSignal) {
+    return await withRetry(
+      async () => {
+        const result2 = await this.client.invoke(messages, tools2, abortSignal);
+        return result2;
+      },
+      // retry settings
+      {
+        maxRetries: this.config.maxRetries,
+        onRetry: /* @__PURE__ */ __name2((current) => {
+          this.dispatchEvent(
+            new CustomEvent("retry", { detail: { current, max: this.config.maxRetries } })
+          );
+        }, "onRetry"),
+        onError: /* @__PURE__ */ __name2((error2) => {
+          this.dispatchEvent(new CustomEvent("error", { detail: { error: error2 } }));
+        }, "onError")
+      }
+    );
+  }
+};
+__name2(_LLM, "LLM");
+let LLM = _LLM;
+async function withRetry(fn, settings) {
+  let retries = 0;
+  let lastError = null;
+  while (retries <= settings.maxRetries) {
+    if (retries > 0) {
+      settings.onRetry(retries);
+      await new Promise((resolve) => setTimeout(resolve, 100));
+    }
+    try {
+      return await fn();
+    } catch (error2) {
+      console.error(error2);
+      settings.onError(error2);
+      if (error2?.name === "AbortError") throw error2;
+      if (error2 instanceof InvokeError && !error2.retryable) throw error2;
+      lastError = error2;
+      retries++;
+      await new Promise((resolve) => setTimeout(resolve, 100));
     }
-    __privateGet(this, _cursor).style.left = `${__privateGet(this, _currentCursorX)}px`;
   }
-  const yDistance = Math.abs(newY - __privateGet(this, _targetCursorY));
-  if (yDistance > 0) {
-    if (yDistance < 2) {
-      __privateSet(this, _currentCursorY, __privateGet(this, _targetCursorY));
-    } else {
-      __privateSet(this, _currentCursorY, newY);
+  throw lastError;
+}
+__name2(withRetry, "withRetry");
+const SYSTEM_PROMPT = 'You are an AI agent designed to operate in an iterative loop to automate browser tasks. Your ultimate goal is accomplishing the task provided in <user_request>.\n\n<intro>\nYou excel at following tasks:\n1. Navigating complex websites and extracting precise information\n2. Automating form submissions and interactive web actions\n3. Gathering and saving information \n4. Operate effectively in an agent loop\n5. Efficiently performing diverse web tasks\n</intro>\n\n<language_settings>\n- Default working language: **中文**\n- Use the language that user is using. Return in user\'s language.\n</language_settings>\n\n<input>\nAt every step, your input will consist of: \n1. <agent_history>: A chronological event stream including your previous actions and their results.\n2. <agent_state>: Current <user_request> and <step_info>.\n3. <browser_state>: Current URL, interactive elements indexed for actions, and visible page content.\n</input>\n\n<agent_history>\nAgent history will be given as a list of step information as follows:\n\n<step_{step_number}>:\nEvaluation of Previous Step: Assessment of last action\nMemory: Your memory of this step\nNext Goal: Your goal for this step\nAction Results: Your actions and their results\n</step_{step_number}>\n\nand system messages wrapped in <sys> tag.\n</agent_history>\n\n<user_request>\nUSER REQUEST: This is your ultimate objective and always remains visible.\n- This has the highest priority. Make the user happy.\n- If the user request is very specific - then carefully follow each step and dont skip or hallucinate steps.\n- If the task is open ended you can plan yourself how to get it done.\n</user_request>\n\n<browser_state>\n1. Browser State will be given as:\n\nCurrent URL: URL of the page you are currently viewing.\nInteractive Elements: All interactive elements will be provided in format as [index]<type>text</type> where\n- index: Numeric identifier for interaction\n- type: HTML element type (button, input, etc.)\n- text: Element description\n\nExamples:\n[33]<div>User form</div>\n\\t*[35]<button aria-label=\'Submit form\'>Submit</button>\n\nNote that:\n- Only elements with numeric indexes in [] are interactive\n- (stacked) indentation (with \\t) is important and means that the element is a (html) child of the element above (with a lower index)\n- Elements tagged with `*[` are the new clickable elements that appeared on the website since the last step - if url has not changed.\n- Pure text elements without [] are not interactive.\n</browser_state>\n\n<browser_rules>\nStrictly follow these rules while using the browser and navigating the web:\n- Only interact with elements that have a numeric [index] assigned.\n- Only use indexes that are explicitly provided.\n- If the page changes after, for example, an input text action, analyze if you need to interact with new elements, e.g. selecting the right option from the list.\n- By default, only elements in the visible viewport are listed. Use scrolling actions if you suspect relevant content is offscreen which you need to interact with. Scroll ONLY if there are more pixels below or above the page.\n- You can scroll by a specific number of pages using the num_pages parameter (e.g., 0.5 for half page, 2.0 for two pages).\n- All the elements that are scrollable are marked with `data-scrollable` attribute. Including the scrollable distance in every directions. You can scroll *the element* in case some area are overflowed.\n- If a captcha appears, tell user you can not solve captcha. finished the task and ask user to solve it.\n- If expected elements are missing, try scrolling, or navigating back.\n- If the page is not fully loaded, use the `wait` action.\n- Do not repeat one action for more than 3 times unless some conditions changed.\n- If you fill an input field and your action sequence is interrupted, most often something changed e.g. suggestions popped up under the field.\n- If the <user_request> includes specific page information such as product type, rating, price, location, etc., try to apply filters to be more efficient.\n- The <user_request> is the ultimate goal. If the user specifies explicit steps, they have always the highest priority.\n- If you input_text into a field, you might need to press enter, click the search button, or select from dropdown for completion.\n- Don\'t login into a page if you don\'t have to. Don\'t login if you don\'t have the credentials. \n- There are 2 types of tasks always first think which type of request you are dealing with:\n1. Very specific step by step instructions:\n- Follow them as very precise and don\'t skip steps. Try to complete everything as requested.\n2. Open ended tasks. Plan yourself, be creative in achieving them.\n- If you get stuck e.g. with logins or captcha in open-ended tasks you can re-evaluate the task and try alternative ways, e.g. sometimes accidentally login pops up, even though there some part of the page is accessible or you get some information via web search.\n</browser_rules>\n\n<capability>\n- You can only handle single page app. Do not jump out of current page.\n- Do not click on link if it will open in a new page (etc. <a target="_blank">)\n- It is ok to fail the task.\n	- User can be wrong. If the request of user is not achievable, inappropriate or you do not have enough information or tools to achieve it. Tell user to make a better request.\n	- Webpage can be broken. All webpages or apps have bugs. Some bug will make it hard for your job. It\'s encouraged to tell user the problem of current page. Your feedbacks (including failing) are valuable for user.\n	- Trying to hard can be harmful. Repeating some action back and forth or pushing for a complex procedure with little knowledge can cause unwanted result and harmful side-effects. User would rather you to complete the task with a fail.\n- If you are not clear about the request or steps. `ask_user` to clarify it.\n- If you do not have knowledge for the current webpage or task. You must require user to give specific instructions and detailed steps.\n</capability>\n\n<task_completion_rules>\nYou must call the `done` action in one of three cases:\n- When you have fully completed the USER REQUEST.\n- When you reach the final allowed step (`max_steps`), even if the task is incomplete.\n- When you feel stuck or unable to solve user request. Or user request is not clear or contains inappropriate content.\n- If it is ABSOLUTELY IMPOSSIBLE to continue.\n\nThe `done` action is your opportunity to terminate and share your findings with the user.\n- Set `success` to `true` only if the full USER REQUEST has been completed with no missing components.\n- If any part of the request is missing, incomplete, or uncertain, set `success` to `false`.\n- You can use the `text` field of the `done` action to communicate your findings and to provide a coherent reply to the user and fulfill the USER REQUEST.\n- You are ONLY ALLOWED to call `done` as a single action. Don\'t call it together with other actions.\n- If the user asks for specified format, such as "return JSON with following structure", "return a list of format...", MAKE sure to use the right format in your answer.\n- If the user asks for a structured output, your `done` action\'s schema may be modified. Take this schema into account when solving the task!\n</task_completion_rules>\n\n<reasoning_rules>\nExhibit the following reasoning patterns to successfully achieve the <user_request>:\n\n- Reason about <agent_history> to track progress and context toward <user_request>.\n- Analyze the most recent "Next Goal" and "Action Result" in <agent_history> and clearly state what you previously tried to achieve.\n- Analyze all relevant items in <agent_history> and <browser_state> to understand your state.\n- Explicitly judge success/failure/uncertainty of the last action. Never assume an action succeeded just because it appears to be executed in your last step in <agent_history>. If the expected change is missing, mark the last action as failed (or uncertain) and plan a recovery.\n- Analyze whether you are stuck, e.g. when you repeat the same actions multiple times without any progress. Then consider alternative approaches e.g. scrolling for more context or ask user for help.\n- `ask_user` for help if you have any difficulty. Users want to be kept in the loop.\n- If you see information relevant to <user_request>, plan saving the information to memory.\n- Always reason about the <user_request>. Make sure to carefully analyze the specific steps and information required. E.g. specific filters, specific form fields, specific information to search. Make sure to always compare the current trajectory with the user request and think carefully if thats how the user requested it.\n</reasoning_rules>\n\n<examples>\nHere are examples of good output patterns. Use them as reference but never copy them directly.\n\n<evaluation_examples>\n- Positive Examples:\n"evaluation_previous_goal": "Successfully navigated to the product page and found the target information. Verdict: Success"\n"evaluation_previous_goal": "Clicked the login button and user authentication form appeared. Verdict: Success"\n</evaluation_examples>\n\n<memory_examples>\n"memory": "Found many pending reports that need to be analyzed in the main page. Successfully processed the first 2 reports on quarterly sales data and moving on to inventory analysis and customer feedback reports."\n</memory_examples>\n\n<next_goal_examples>\n"next_goal": "Click on the \'Add to Cart\' button to proceed with the purchase flow."\n"next_goal": "Extract details from the first item on the page."\n</next_goal_examples>\n</examples>\n\n<output>\nYou must ALWAYS respond with a valid JSON in this exact format:\n\n{\n  "evaluation_previous_goal": "Concise one-sentence analysis of your last action. Clearly state success, failure, or uncertain.",\n  "memory": "1-3 concise sentences of specific memory of this step and overall progress. You should put here everything that will help you track progress in future steps. Like counting pages visited, items found, etc.",\n  "next_goal": "State the next immediate goal and action to achieve it, in one clear sentence."\n  "action":{"one_action_name": {// action-specific parameter}}\n}\n</output>\n';
+async function waitUntil(check, timeout = 60 * 601e3) {
+  if (check()) return true;
+  return new Promise((resolve, reject) => {
+    const start = Date.now();
+    const interval = setInterval(() => {
+      if (check()) {
+        clearInterval(interval);
+        resolve(true);
+      } else if (Date.now() - start > timeout) {
+        clearInterval(interval);
+        reject(new Error("Timeout waiting for condition to become true"));
+      }
+    }, 100);
+  });
+}
+__name2(waitUntil, "waitUntil");
+async function waitFor(seconds) {
+  await new Promise((resolve) => setTimeout(resolve, seconds * 1e3));
+}
+__name2(waitFor, "waitFor");
+function trimLines(text) {
+  return text.split("\n").map((line) => line.trim()).join("\n");
+}
+__name2(trimLines, "trimLines");
+function randomID(existingIDs) {
+  let id = Math.random().toString(36).substring(2, 11);
+  if (!existingIDs) {
+    return id;
+  }
+  const MAX_TRY = 1e3;
+  let tryCount = 0;
+  while (existingIDs.includes(id)) {
+    id = Math.random().toString(36).substring(2, 11);
+    tryCount++;
+    if (tryCount > MAX_TRY) {
+      throw new Error("randomID: too many try");
     }
-    __privateGet(this, _cursor).style.top = `${__privateGet(this, _currentCursorY)}px`;
   }
-  requestAnimationFrame(() => __privateMethod(this, _SimulatorMask_instances, moveCursorToTarget_fn).call(this));
-}, "#moveCursorToTarget");
-__name2(_SimulatorMask, "SimulatorMask");
-let SimulatorMask = _SimulatorMask;
+  return id;
+}
+__name2(randomID, "randomID");
+if (!window.__PAGE_AGENT_IDS__) {
+  window.__PAGE_AGENT_IDS__ = [];
+}
+const ids = window.__PAGE_AGENT_IDS__;
+function uid() {
+  const id = randomID(ids);
+  ids.push(id);
+  return id;
+}
+__name2(uid, "uid");
+function tool(options) {
+  return options;
+}
+__name2(tool, "tool");
+const tools = /* @__PURE__ */ new Map();
+tools.set(
+  "done",
+  tool({
+    description: "Complete task - provide a summary of results for the user. Set success=True if task completed successfully, false otherwise. Text should be your response to the user summarizing results.",
+    inputSchema: zod.object({
+      text: zod.string(),
+      success: zod.boolean().default(true)
+    }),
+    execute: /* @__PURE__ */ __name2(async function(input2) {
+      return Promise.resolve("Task completed");
+    }, "execute")
+  })
+);
+tools.set(
+  "wait",
+  tool({
+    description: "Wait for x seconds. default 1s (max 10 seconds, min 1 second). This can be used to wait until the page or data is fully loaded.",
+    inputSchema: zod.object({
+      seconds: zod.number().min(1).max(10).default(1)
+    }),
+    execute: /* @__PURE__ */ __name2(async function(input2) {
+      const lastTimeUpdate = await this.pageController.getLastUpdateTime();
+      const actualWaitTime = Math.max(0, input2.seconds - (Date.now() - lastTimeUpdate) / 1e3);
+      console.log(`actualWaitTime: ${actualWaitTime} seconds`);
+      await waitFor(actualWaitTime);
+      return `✅ Waited for ${input2.seconds} seconds.`;
+    }, "execute")
+  })
+);
+tools.set(
+  "ask_user",
+  tool({
+    description: "Ask the user a question and wait for their answer. Use this if you need more information or clarification.",
+    inputSchema: zod.object({
+      question: zod.string()
+    }),
+    execute: /* @__PURE__ */ __name2(async function(input2) {
+      const answer = await this.panel.askUser(input2.question);
+      return `✅ Received user answer: ${answer}`;
+    }, "execute")
+  })
+);
+tools.set(
+  "click_element_by_index",
+  tool({
+    description: "Click element by index",
+    inputSchema: zod.object({
+      index: zod.int().min(0)
+    }),
+    execute: /* @__PURE__ */ __name2(async function(input2) {
+      const result2 = await this.pageController.clickElement(input2.index);
+      return result2.message;
+    }, "execute")
+  })
+);
+tools.set(
+  "input_text",
+  tool({
+    description: "Click and input text into a input interactive element",
+    inputSchema: zod.object({
+      index: zod.int().min(0),
+      text: zod.string()
+    }),
+    execute: /* @__PURE__ */ __name2(async function(input2) {
+      const result2 = await this.pageController.inputText(input2.index, input2.text);
+      return result2.message;
+    }, "execute")
+  })
+);
+tools.set(
+  "select_dropdown_option",
+  tool({
+    description: "Select dropdown option for interactive element index by the text of the option you want to select",
+    inputSchema: zod.object({
+      index: zod.int().min(0),
+      text: zod.string()
+    }),
+    execute: /* @__PURE__ */ __name2(async function(input2) {
+      const result2 = await this.pageController.selectOption(input2.index, input2.text);
+      return result2.message;
+    }, "execute")
+  })
+);
+tools.set(
+  "scroll",
+  tool({
+    description: "Scroll the page by specified number of pages (set down=True to scroll down, down=False to scroll up, num_pages=number of pages to scroll like 0.5 for half page, 1.0 for one page, etc.). Optional index parameter to scroll within a specific element or its scroll container (works well for dropdowns and custom UI components). Optional pixels parameter to scroll by a specific number of pixels instead of pages.",
+    inputSchema: zod.object({
+      down: zod.boolean().default(true),
+      num_pages: zod.number().min(0).max(10).optional().default(0.1),
+      pixels: zod.number().int().min(0).optional(),
+      index: zod.number().int().min(0).optional()
+    }),
+    execute: /* @__PURE__ */ __name2(async function(input2) {
+      const result2 = await this.pageController.scroll({
+        ...input2,
+        numPages: input2.num_pages
+      });
+      return result2.message;
+    }, "execute")
+  })
+);
+tools.set(
+  "scroll_horizontally",
+  tool({
+    description: "Scroll the page or element horizontally (set right=True to scroll right, right=False to scroll left, pixels=number of pixels to scroll). Optional index parameter to scroll within a specific element or its scroll container (works well for wide tables).",
+    inputSchema: zod.object({
+      right: zod.boolean().default(true),
+      pixels: zod.number().int().min(0),
+      index: zod.number().int().min(0).optional()
+    }),
+    execute: /* @__PURE__ */ __name2(async function(input2) {
+      const result2 = await this.pageController.scrollHorizontally(input2);
+      return result2.message;
+    }, "execute")
+  })
+);
+tools.set(
+  "execute_javascript",
+  tool({
+    description: "Execute JavaScript code on the current page. Supports async/await syntax. Use with caution!",
+    inputSchema: zod.object({
+      script: zod.string()
+    }),
+    execute: /* @__PURE__ */ __name2(async function(input2) {
+      const result2 = await this.pageController.executeJavascript(input2.script);
+      return result2.message;
+    }, "execute")
+  })
+);
 function assert(condition, message, silent) {
   if (!condition) {
     const errorMessage = message ?? "Assertion failed";
@@ -3576,32 +3549,51 @@ __name2(assert, "assert");
 const _PageAgent = class _PageAgent extends EventTarget {
   constructor(config = {}) {
     super();
-    __privateAdd(this, _PageAgent_instances);
-    __publicField(this, "config");
-    __publicField(this, "id", uid());
-    __publicField(this, "bus", getEventBus(this.id));
-    __publicField(this, "i18n");
-    __publicField(this, "panel");
-    __publicField(this, "tools");
-    __publicField(this, "paused", false);
-    __publicField(this, "disposed", false);
-    __publicField(this, "task", "");
-    __publicField(this, "taskId", "");
-    __privateAdd(this, _llm);
-    __privateAdd(this, _totalWaitTime, 0);
-    __privateAdd(this, _abortController, new AbortController());
+    __privateAdd2(this, _PageAgent_instances);
+    __publicField2(this, "config");
+    __publicField2(this, "id", uid());
+    __publicField2(this, "panel");
+    __publicField2(this, "tools");
+    __publicField2(this, "paused", false);
+    __publicField2(this, "disposed", false);
+    __publicField2(this, "task", "");
+    __publicField2(this, "taskId", "");
+    __privateAdd2(this, _llm);
+    __privateAdd2(this, _totalWaitTime, 0);
+    __privateAdd2(this, _abortController, new AbortController());
+    __privateAdd2(this, _llmRetryListener, null);
+    __privateAdd2(this, _llmErrorListener, null);
+    __privateAdd2(this, _beforeUnloadListener, null);
     /** PageController for DOM operations */
-    __publicField(this, "pageController");
+    __publicField2(this, "pageController");
     /** Fullscreen mask */
-    __publicField(this, "mask", new SimulatorMask());
+    __publicField2(this, "mask", new SimulatorMask());
     /** History records */
-    __publicField(this, "history", []);
+    __publicField2(this, "history", []);
     this.config = config;
-    __privateSet(this, _llm, new LLM(this.config, this.id));
-    this.i18n = new I18n(this.config.language);
-    this.panel = new Panel(this);
+    __privateSet2(this, _llm, new LLM(this.config));
+    this.panel = new Panel({
+      language: this.config.language,
+      onExecuteTask: /* @__PURE__ */ __name2((task) => this.execute(task), "onExecuteTask"),
+      onStop: /* @__PURE__ */ __name2(() => this.dispose(), "onStop"),
+      onPauseToggle: /* @__PURE__ */ __name2(() => {
+        this.paused = !this.paused;
+        return this.paused;
+      }, "onPauseToggle"),
+      getPaused: /* @__PURE__ */ __name2(() => this.paused, "getPaused")
+    });
     this.tools = new Map(tools);
     this.pageController = new PageController(this.config);
+    __privateSet2(this, _llmRetryListener, (e) => {
+      const { current, max } = e.detail;
+      this.panel.update({ type: "retry", current, max });
+    });
+    __privateSet2(this, _llmErrorListener, (e) => {
+      const { error: error2 } = e.detail;
+      this.panel.update({ type: "error", message: `step failed: ${error2.message}` });
+    });
+    __privateGet2(this, _llm).addEventListener("retry", __privateGet2(this, _llmRetryListener));
+    __privateGet2(this, _llm).addEventListener("error", __privateGet2(this, _llmErrorListener));
     if (this.config.customTools) {
       for (const [name, tool2] of Object.entries(this.config.customTools)) {
         if (tool2 === null) {
@@ -3614,9 +3606,10 @@ const _PageAgent = class _PageAgent extends EventTarget {
     if (!this.config.experimentalScriptExecutionTool) {
       this.tools.delete("execute_javascript");
     }
-    window.addEventListener("beforeunload", (e) => {
+    __privateSet2(this, _beforeUnloadListener, (e) => {
       if (!this.disposed) this.dispose("PAGE_UNLOADING");
     });
+    window.addEventListener("beforeunload", __privateGet2(this, _beforeUnloadListener));
   }
   /**
    * @todo maybe return something?
@@ -3631,15 +3624,12 @@ const _PageAgent = class _PageAgent extends EventTarget {
     const onAfterTask = this.config.onAfterTask || (() => void 0);
     await onBeforeTask.call(this);
     this.mask.show();
-    this.bus.emit("panel:show");
-    this.bus.emit("panel:reset");
-    this.bus.emit("panel:update", {
-      type: "input",
-      displayText: this.task
-    });
-    if (__privateGet(this, _abortController)) {
-      __privateGet(this, _abortController).abort();
-      __privateSet(this, _abortController, new AbortController());
+    this.panel.show();
+    this.panel.reset();
+    this.panel.update({ type: "input", task: this.task });
+    if (__privateGet2(this, _abortController)) {
+      __privateGet2(this, _abortController).abort();
+      __privateSet2(this, _abortController, new AbortController());
     }
     this.history = [];
     try {
@@ -3647,26 +3637,23 @@ const _PageAgent = class _PageAgent extends EventTarget {
       while (true) {
         await onBeforeStep.call(this, step);
         console.group(`step: ${step}`);
-        if (__privateGet(this, _abortController).signal.aborted) throw new Error("AbortError");
+        if (__privateGet2(this, _abortController).signal.aborted) throw new Error("AbortError");
         await waitUntil(() => !this.paused);
         console.log(chalk.blue("Thinking..."));
-        this.bus.emit("panel:update", {
-          type: "thinking",
-          displayText: this.i18n.t("ui.panel.thinking")
-        });
-        const result2 = await __privateGet(this, _llm).invoke(
+        this.panel.update({ type: "thinking" });
+        const result2 = await __privateGet2(this, _llm).invoke(
           [
             {
               role: "system",
-              content: __privateMethod(this, _PageAgent_instances, getSystemPrompt_fn).call(this)
+              content: __privateMethod2(this, _PageAgent_instances, getSystemPrompt_fn).call(this)
             },
             {
               role: "user",
-              content: await __privateMethod(this, _PageAgent_instances, assembleUserPrompt_fn).call(this)
+              content: await __privateMethod2(this, _PageAgent_instances, assembleUserPrompt_fn).call(this)
             }
           ],
-          { AgentOutput: __privateMethod(this, _PageAgent_instances, packMacroTool_fn).call(this) },
-          __privateGet(this, _abortController).signal
+          { AgentOutput: __privateMethod2(this, _PageAgent_instances, packMacroTool_fn).call(this) },
+          __privateGet2(this, _abortController).signal
         );
         const macroResult = result2.toolResult;
         const input2 = macroResult.input;
@@ -3692,7 +3679,7 @@ const _PageAgent = class _PageAgent extends EventTarget {
         await onAfterStep.call(this, step, this.history);
         step++;
         if (step > MAX_STEPS) {
-          __privateMethod(this, _PageAgent_instances, onDone_fn).call(this, "Step count exceeded maximum limit", false);
+          __privateMethod2(this, _PageAgent_instances, onDone_fn).call(this, "Step count exceeded maximum limit", false);
           const result22 = {
             success: false,
             data: "Step count exceeded maximum limit",
@@ -3705,7 +3692,7 @@ const _PageAgent = class _PageAgent extends EventTarget {
           const success = action.input?.success ?? false;
           const text = action.input?.text || "no text provided";
           console.log(chalk.green.bold("Task completed"), success, text);
-          __privateMethod(this, _PageAgent_instances, onDone_fn).call(this, text, success);
+          __privateMethod2(this, _PageAgent_instances, onDone_fn).call(this, text, success);
           const result22 = {
             success,
             data: text,
@@ -3717,7 +3704,7 @@ const _PageAgent = class _PageAgent extends EventTarget {
       }
     } catch (error2) {
       console.error("Task failed", error2);
-      __privateMethod(this, _PageAgent_instances, onDone_fn).call(this, String(error2), false);
+      __privateMethod2(this, _PageAgent_instances, onDone_fn).call(this, String(error2), false);
       const result2 = {
         success: false,
         data: String(error2),
@@ -3734,13 +3721,28 @@ const _PageAgent = class _PageAgent extends EventTarget {
     this.panel.dispose();
     this.mask.dispose();
     this.history = [];
-    __privateGet(this, _abortController).abort(reason ?? "PageAgent disposed");
+    __privateGet2(this, _abortController).abort(reason ?? "PageAgent disposed");
+    if (__privateGet2(this, _llmRetryListener)) {
+      __privateGet2(this, _llm).removeEventListener("retry", __privateGet2(this, _llmRetryListener));
+      __privateSet2(this, _llmRetryListener, null);
+    }
+    if (__privateGet2(this, _llmErrorListener)) {
+      __privateGet2(this, _llm).removeEventListener("error", __privateGet2(this, _llmErrorListener));
+      __privateSet2(this, _llmErrorListener, null);
+    }
+    if (__privateGet2(this, _beforeUnloadListener)) {
+      window.removeEventListener("beforeunload", __privateGet2(this, _beforeUnloadListener));
+      __privateSet2(this, _beforeUnloadListener, null);
+    }
     this.config.onDispose?.call(this, reason);
   }
 };
 _llm = new WeakMap();
 _totalWaitTime = new WeakMap();
 _abortController = new WeakMap();
+_llmRetryListener = new WeakMap();
+_llmErrorListener = new WeakMap();
+_beforeUnloadListener = new WeakMap();
 _PageAgent_instances = new WeakSet();
 /**
  * Merge all tools into a single MacroTool with the following input:
@@ -3771,7 +3773,7 @@ packMacroTool_fn = /* @__PURE__ */ __name2(function() {
   return {
     inputSchema: macroToolSchema,
     execute: /* @__PURE__ */ __name2(async (input2) => {
-      if (__privateGet(this, _abortController).signal.aborted) throw new Error("AbortError");
+      if (__privateGet2(this, _abortController).signal.aborted) throw new Error("AbortError");
       await waitUntil(() => !this.paused);
       console.log(chalk.blue.bold("MacroTool execute"), input2);
       const action = input2.action;
@@ -3782,43 +3784,32 @@ packMacroTool_fn = /* @__PURE__ */ __name2(function() {
 						🎯: ${input2.next_goal}
 					`);
       console.log(brain);
-      this.bus.emit("panel:update", {
-        type: "thinking",
-        displayText: brain
-      });
+      this.panel.update({ type: "thinking", text: brain });
       const tool2 = tools2.get(toolName);
       assert(tool2, `Tool ${toolName} not found. (@note should have been caught before this!!!)`);
       console.log(chalk.blue.bold(`Executing tool: ${toolName}`), toolInput);
-      this.bus.emit("panel:update", {
-        type: "tool_executing",
-        toolName,
-        toolArgs: toolInput,
-        displayText: getToolExecutingText(toolName, toolInput, this.i18n)
-      });
+      this.panel.update({ type: "toolExecuting", toolName, args: toolInput });
       const startTime = Date.now();
       let result2 = await tool2.execute.bind(this)(toolInput);
       const duration = Date.now() - startTime;
       console.log(chalk.green.bold(`Tool (${toolName}) executed for ${duration}ms`), result2);
       if (toolName === "wait") {
-        __privateSet(this, _totalWaitTime, __privateGet(this, _totalWaitTime) + Math.round(toolInput.seconds + duration / 1e3));
+        __privateSet2(this, _totalWaitTime, __privateGet2(this, _totalWaitTime) + Math.round(toolInput.seconds + duration / 1e3));
         result2 += `
-<sys> You have waited ${__privateGet(this, _totalWaitTime)} seconds accumulatively.`;
-        if (__privateGet(this, _totalWaitTime) >= 3)
+<sys> You have waited ${__privateGet2(this, _totalWaitTime)} seconds accumulatively.`;
+        if (__privateGet2(this, _totalWaitTime) >= 3)
           result2 += "\nDo NOT wait any longer unless you have a good reason.\n";
         result2 += "</sys>";
       } else {
-        __privateSet(this, _totalWaitTime, 0);
+        __privateSet2(this, _totalWaitTime, 0);
       }
-      const displayResult = getToolCompletedText(toolName, toolInput, this.i18n);
-      if (displayResult)
-        this.bus.emit("panel:update", {
-          type: "tool_executing",
-          toolName,
-          toolArgs: toolInput,
-          toolResult: result2,
-          displayText: displayResult,
-          duration
-        });
+      this.panel.update({
+        type: "toolCompleted",
+        toolName,
+        args: toolInput,
+        result: result2,
+        duration
+      });
       await new Promise((resolve) => setTimeout(resolve, 100));
       return {
         input: input2,
@@ -3862,21 +3853,19 @@ assembleUserPrompt_fn = /* @__PURE__ */ __name2(async function() {
 			</step_info>
 			</agent_state>
 		`;
-  prompt += await __privateMethod(this, _PageAgent_instances, getBrowserState_fn).call(this);
+  prompt += await __privateMethod2(this, _PageAgent_instances, getBrowserState_fn).call(this);
   return trimLines(prompt);
 }, "#assembleUserPrompt");
 onDone_fn = /* @__PURE__ */ __name2(function(text, success = true) {
   this.pageController.cleanUpHighlights();
-  this.bus.emit("panel:update", {
-    type: success ? "output" : "error",
-    displayText: text
-  });
-  this.bus.emit("panel:update", {
-    type: "completed",
-    displayText: this.i18n.t("ui.panel.taskCompleted")
-  });
+  if (success) {
+    this.panel.update({ type: "output", text });
+  } else {
+    this.panel.update({ type: "error", message: text });
+  }
+  this.panel.update({ type: "completed" });
   this.mask.hide();
-  __privateGet(this, _abortController).abort();
+  __privateGet2(this, _abortController).abort();
 }, "#onDone");
 getBrowserState_fn = /* @__PURE__ */ __name2(async function() {
   const pageUrl = await this.pageController.getCurrentUrl();