@coolkiller007/my-page-agent 0.1.6 → 0.1.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +91 -65
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
(function() { try { if (typeof document != "undefined") { var elementStyle = document.createElement("style"); elementStyle.appendChild(document.createTextNode("._wrapper_ur79v_1 {\n position: fixed;\n inset: 0;\n z-index: 2147483641; /* 确保在所有元素之上,除了 Agent UI */\n cursor: wait;\n overflow: hidden;\n\n display: none;\n}\n\n._wrapper_ur79v_1._visible_ur79v_11 {\n display: block;\n}\n/* AI 光标样式 */\n._cursor_1dgwb_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}\n\n._cursorBorder_1dgwb_10 {\n position: absolute;\n width: 100%;\n height: 100%;\n background: linear-gradient(45deg, rgb(57, 182, 255), rgb(189, 69, 251));\n mask-image: url(\"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20100%20100'%20fill='none'%3e%3cg%3e%3cpath%20d='M%2015%2042%20L%2015%2036.99%20Q%2015%2031.99%2023.7%2031.99%20L%2028.05%2031.99%20Q%2032.41%2031.99%2032.41%2021.99%20L%2032.41%2017%20Q%2032.41%2012%2041.09%2016.95%20L%2076.31%2037.05%20Q%2085%2042%2076.31%2046.95%20L%2041.09%2067.05%20Q%2032.41%2072%2032.41%2062.01%20L%2032.41%2057.01%20Q%2032.41%2052.01%2023.7%2052.01%20L%2019.35%2052.01%20Q%2015%2052.01%2015%2047.01%20Z'%20fill='none'%20stroke='%23000000'%20stroke-width='6'%20stroke-miterlimit='10'%20style='stroke:%20light-dark(rgb(0,%200,%200),%20rgb(255,%20255,%20255));'/%3e%3c/g%3e%3c/svg%3e\");\n mask-size: 100% 100%;\n mask-repeat: no-repeat;\n\n transform-origin: center;\n transform: rotate(-135deg) scale(1.2);\n margin-left: -10px;\n margin-top: -18px;\n}\n\n._cursorFilling_1dgwb_25 {\n position: absolute;\n width: 100%;\n height: 100%;\n background: url(\"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20100%20100'%3e%3cdefs%3e%3c/defs%3e%3cg%20xmlns='http://www.w3.org/2000/svg'%20style='filter:%20drop-shadow(light-dark(rgba(0,%200,%200,%200.4),%20rgba(237,%20237,%20237,%200.4))%203px%204px%204px);'%3e%3cpath%20d='M%2015%2042%20L%2015%2036.99%20Q%2015%2031.99%2023.7%2031.99%20L%2028.05%2031.99%20Q%2032.41%2031.99%2032.41%2021.99%20L%2032.41%2017%20Q%2032.41%2012%2041.09%2016.95%20L%2076.31%2037.05%20Q%2085%2042%2076.31%2046.95%20L%2041.09%2067.05%20Q%2032.41%2072%2032.41%2062.01%20L%2032.41%2057.01%20Q%2032.41%2052.01%2023.7%2052.01%20L%2019.35%2052.01%20Q%2015%2052.01%2015%2047.01%20Z'%20fill='%23ffffff'%20stroke='none'%20style='fill:%20%23ffffff;'/%3e%3c/g%3e%3c/svg%3e\");\n background-size: 100% 100%;\n background-repeat: no-repeat;\n\n transform-origin: center;\n transform: rotate(-135deg) scale(1.2);\n margin-left: -10px;\n margin-top: -18px;\n}\n\n._cursorRipple_1dgwb_39 {\n position: absolute;\n width: 100%;\n height: 100%;\n pointer-events: none;\n margin-left: -50%;\n margin-top: -50%;\n\n &::after {\n content: '';\n opacity: 0;\n position: absolute;\n inset: 0;\n border: 4px solid rgba(57, 182, 255, 1);\n border-radius: 50%;\n }\n}\n\n._cursor_1dgwb_2._clicking_1dgwb_57 ._cursorRipple_1dgwb_39::after {\n animation: _cursor-ripple_1dgwb_1 300ms ease-out forwards;\n}\n\n@keyframes _cursor-ripple_1dgwb_1 {\n 0% {\n transform: scale(0);\n opacity: 1;\n }\n 100% {\n transform: scale(2);\n opacity: 0;\n }\n}\n._wrapper_1ecxa_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 /* 宽度取窗口 40%,用 clamp 防止超窄/超宽窗口下过小或过大 */\n --width: clamp(280px, 40vw, 640px);\n --height: 40px; /* 状态条高度 */\n --input-height: 80px; /* 输入区高度 */\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 /* 状态条 + 输入区整合为一体,高度取二者之和,让外发光/边框包住整个面板 */\n height: calc(var(--height) + var(--input-height));\n\n /* 输入区隐藏时(任务执行中)收缩回仅状态条高度,避免面板下方留出空白发光区 */\n &:has(._inputSectionWrapper_1ecxa_35._hidden_1ecxa_35) {\n height: var(--height);\n }\n\n /* 面板统一外边框 + 发光效果,替代原来 header/input 各自的独立边框 */\n border: 2px solid rgba(255, 255, 255, 0.4);\n border-radius: var(--border-radius);\n box-shadow:\n 0 0 5px 1px rgba(255, 255, 255, 0.3),\n 0 4px 20px rgba(0, 0, 0, 0.5);\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_1ecxa_54 {\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_1ecxa_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_1ecxa_1 2s linear infinite;\n animation-delay: 1s;\n }\n }\n}\n\n@keyframes _mask-running_1ecxa_1 {\n from {\n transform: translateX(-100%);\n }\n to {\n transform: translateX(100%);\n }\n}\n\n/* 控制栏 */\n._header_1ecxa_114 {\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 top: 0;\n left: 0;\n right: 0;\n height: var(--height);\n\n cursor: pointer;\n flex-shrink: 0; /* 防止 header 被压缩 */\n\n background: rgba(0, 0, 0, 0.5);\n backdrop-filter: blur(10px);\n /* 只圆上方两角,下方与输入区拼接为一体 */\n border-radius: var(--border-radius) var(--border-radius) 0 0;\n background-clip: padding-box;\n\n /* 与输入区之间的细分隔线,替代原来独立的整圈发光边框 */\n border-bottom: 1px solid rgba(255, 255, 255, 0.15);\n\n ._statusSection_1ecxa_139 {\n display: flex;\n align-items: center;\n gap: 8px;\n flex: 1;\n min-height: 24px; /* 确保垂直居中 */\n\n ._indicator_1ecxa_146 {\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_1ecxa_155 {\n background: rgb(57, 182, 255);\n animation: _pulse_1ecxa_1 0.8s ease-in-out infinite;\n }\n\n &._tool_executing_1ecxa_160 {\n background: rgb(189, 69, 251);\n animation: _pulse_1ecxa_1 0.6s ease-in-out infinite;\n }\n\n &._retry_1ecxa_165 {\n background: rgb(255, 214, 0);\n animation: _retryPulse_1ecxa_1 1s ease-in-out infinite;\n }\n\n /* 静止状态 - 无动画 */\n &._completed_1ecxa_171,\n &._input_1ecxa_35,\n &._output_1ecxa_173 {\n background: rgb(34, 197, 94);\n animation: none;\n }\n\n &._error_1ecxa_178 {\n background: rgb(239, 68, 68);\n animation: none;\n }\n }\n\n ._statusText_1ecxa_184 {\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_1ecxa_196 {\n animation: _statusTextFadeOut_1ecxa_1 0.3s ease forwards;\n }\n\n &._fadeIn_1ecxa_200 {\n animation: _statusTextFadeIn_1ecxa_1 0.3s ease forwards;\n }\n }\n }\n\n ._controls_1ecxa_206 {\n display: flex;\n align-items: center;\n gap: 4px;\n\n ._controlButton_1ecxa_211 {\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 ._stopButton_1ecxa_230 {\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_1ecxa_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_1ecxa_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_1ecxa_264 {\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_1ecxa_296 & {\n padding-top: 8px;\n visibility: visible;\n }\n\n ._historySection_1ecxa_264 {\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_1ecxa_296 & {\n max-height: min(500px, calc(100vh - 200px - var(--height)));\n }\n\n ._historyItem_1ecxa_315 {\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_1ecxa_171,\n &._input_1ecxa_35,\n &._output_1ecxa_173 {\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_1ecxa_178 {\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_1ecxa_165 {\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 &._observation_1ecxa_373 {\n border-left-color: rgb(147, 51, 234);\n background: linear-gradient(135deg, rgba(147, 51, 234, 0.1), rgba(147, 51, 234, 0.05));\n }\n\n &._question_1ecxa_378 {\n border-left-color: rgb(255, 159, 67);\n background: linear-gradient(135deg, rgba(255, 159, 67, 0.15), rgba(255, 159, 67, 0.08));\n }\n\n /* 突出显示 done 成功结果 */\n &._doneSuccess_1ecxa_384 {\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_1ecxa_1 2s ease-in-out infinite;\n }\n\n ._historyContent_1ecxa_420 {\n ._statusIcon_1ecxa_421 {\n font-size: 16px;\n animation: _celebrate_1ecxa_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_1ecxa_430 {\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_1ecxa_420 {\n ._statusIcon_1ecxa_421 {\n font-size: 16px;\n filter: drop-shadow(0 2px 4px rgba(239, 68, 68, 0.5));\n }\n }\n }\n\n ._historyContent_1ecxa_420 {\n display: flex;\n align-items: flex-start;\n gap: 8px;\n\n word-break: break-all;\n white-space: pre-wrap;\n\n /* overflow-x: auto; */\n\n ._statusIcon_1ecxa_421 {\n font-size: 12px;\n flex-shrink: 0;\n line-height: 1;\n transition: all 0.3s ease;\n }\n\n ._reflectionLines_1ecxa_480 {\n display: flex;\n flex-direction: column;\n gap: 4px;\n }\n }\n\n ._historyMeta_1ecxa_487 {\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_1ecxa_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_1ecxa_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_1ecxa_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_1ecxa_1 {\n 0% {\n left: -100%;\n }\n 100% {\n left: 100%;\n }\n}\n\n/* 输入区域样式 */\n._inputSectionWrapper_1ecxa_35 {\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: var(--input-height);\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 &._hidden_1ecxa_35 {\n visibility: collapse;\n height: 0;\n }\n\n ._inputSection_1ecxa_35 {\n display: flex;\n align-items: center;\n gap: 8px;\n height: 100%;\n padding: 12px;\n\n ._taskInput_1ecxa_589 {\n flex: 1;\n height: 100%;\n background: rgba(255, 255, 255, 0.4);\n border: 1px solid rgba(255, 255, 255, 0.3);\n border-radius: 12px;\n padding-inline: 14px;\n color: rgb(20, 20, 20);\n font-size: 14px;\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/*$vite$:1*/")); document.head.appendChild(elementStyle); } } catch (e) { console.error("vite-plugin-css-injected-by-js", e); }})();
|
|
1
|
+
(function() { try { if (typeof document != "undefined") { var elementStyle = document.createElement("style"); elementStyle.appendChild(document.createTextNode("._wrapper_ur79v_1 {\n position: fixed;\n inset: 0;\n z-index: 2147483641; /* 确保在所有元素之上,除了 Agent UI */\n cursor: wait;\n overflow: hidden;\n\n display: none;\n}\n\n._wrapper_ur79v_1._visible_ur79v_11 {\n display: block;\n}\n/* AI 光标样式 */\n._cursor_1dgwb_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}\n\n._cursorBorder_1dgwb_10 {\n position: absolute;\n width: 100%;\n height: 100%;\n background: linear-gradient(45deg, rgb(57, 182, 255), rgb(189, 69, 251));\n mask-image: url(\"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20100%20100'%20fill='none'%3e%3cg%3e%3cpath%20d='M%2015%2042%20L%2015%2036.99%20Q%2015%2031.99%2023.7%2031.99%20L%2028.05%2031.99%20Q%2032.41%2031.99%2032.41%2021.99%20L%2032.41%2017%20Q%2032.41%2012%2041.09%2016.95%20L%2076.31%2037.05%20Q%2085%2042%2076.31%2046.95%20L%2041.09%2067.05%20Q%2032.41%2072%2032.41%2062.01%20L%2032.41%2057.01%20Q%2032.41%2052.01%2023.7%2052.01%20L%2019.35%2052.01%20Q%2015%2052.01%2015%2047.01%20Z'%20fill='none'%20stroke='%23000000'%20stroke-width='6'%20stroke-miterlimit='10'%20style='stroke:%20light-dark(rgb(0,%200,%200),%20rgb(255,%20255,%20255));'/%3e%3c/g%3e%3c/svg%3e\");\n mask-size: 100% 100%;\n mask-repeat: no-repeat;\n\n transform-origin: center;\n transform: rotate(-135deg) scale(1.2);\n margin-left: -10px;\n margin-top: -18px;\n}\n\n._cursorFilling_1dgwb_25 {\n position: absolute;\n width: 100%;\n height: 100%;\n background: url(\"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20100%20100'%3e%3cdefs%3e%3c/defs%3e%3cg%20xmlns='http://www.w3.org/2000/svg'%20style='filter:%20drop-shadow(light-dark(rgba(0,%200,%200,%200.4),%20rgba(237,%20237,%20237,%200.4))%203px%204px%204px);'%3e%3cpath%20d='M%2015%2042%20L%2015%2036.99%20Q%2015%2031.99%2023.7%2031.99%20L%2028.05%2031.99%20Q%2032.41%2031.99%2032.41%2021.99%20L%2032.41%2017%20Q%2032.41%2012%2041.09%2016.95%20L%2076.31%2037.05%20Q%2085%2042%2076.31%2046.95%20L%2041.09%2067.05%20Q%2032.41%2072%2032.41%2062.01%20L%2032.41%2057.01%20Q%2032.41%2052.01%2023.7%2052.01%20L%2019.35%2052.01%20Q%2015%2052.01%2015%2047.01%20Z'%20fill='%23ffffff'%20stroke='none'%20style='fill:%20%23ffffff;'/%3e%3c/g%3e%3c/svg%3e\");\n background-size: 100% 100%;\n background-repeat: no-repeat;\n\n transform-origin: center;\n transform: rotate(-135deg) scale(1.2);\n margin-left: -10px;\n margin-top: -18px;\n}\n\n._cursorRipple_1dgwb_39 {\n position: absolute;\n width: 100%;\n height: 100%;\n pointer-events: none;\n margin-left: -50%;\n margin-top: -50%;\n\n &::after {\n content: '';\n opacity: 0;\n position: absolute;\n inset: 0;\n border: 4px solid rgba(57, 182, 255, 1);\n border-radius: 50%;\n }\n}\n\n._cursor_1dgwb_2._clicking_1dgwb_57 ._cursorRipple_1dgwb_39::after {\n animation: _cursor-ripple_1dgwb_1 300ms ease-out forwards;\n}\n\n@keyframes _cursor-ripple_1dgwb_1 {\n 0% {\n transform: scale(0);\n opacity: 1;\n }\n 100% {\n transform: scale(2);\n opacity: 0;\n }\n}\n._wrapper_1yola_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 /* 普通流布局:历史弹窗、面板依次纵向排列,靠子元素自身尺寸撑开,\n * 不再用 position:absolute + 手算偏移量拼位置(这套算法之前连续出过两次 bug:\n * 弹窗被状态条盖住、状态条运行态时下方角没跟着圆)。 */\n display: flex;\n flex-direction: column;\n align-items: center;\n\n * {\n box-sizing: border-box;\n }\n\n /* 宽度取窗口 40%,用 clamp 防止超窄/超宽窗口下过小或过大 */\n --width: clamp(280px, 40vw, 640px);\n --height: 40px; /* 状态条高度 */\n --input-height: 80px; /* 输入区高度 */\n --border-radius: 16px;\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\n transition:\n opacity 0.3s ease-in-out,\n transform 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\n@keyframes _mask-running_1yola_1 {\n from {\n transform: translateX(-100%);\n }\n to {\n transform: translateX(100%);\n }\n}\n\n/* 状态条 + 输入区的面板容器;.background 光效挂在这一层,.panelInner 负责裁出圆角 */\n._panel_1yola_57 {\n position: relative;\n width: 100%;\n}\n\n._background_1yola_57 {\n position: absolute;\n inset: -2px;\n border-radius: calc(var(--border-radius) + 4px);\n filter: blur(4px);\n overflow: hidden;\n pointer-events: none;\n\n &::before {\n content: '';\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-1),\n var(--color-2),\n var(--color-1)\n );\n animation: _mask-running_1yola_1 2s linear infinite;\n }\n &::after {\n content: '';\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_1yola_1 2s linear infinite;\n animation-delay: 1s;\n }\n}\n\n/* 面板可视区域:靠 overflow:hidden + border-radius 统一裁角,\n * header 单独存在(运行中输入区隐藏)或 header+输入区一起存在时,四角都自动是圆的,\n * 不用再像以前那样给 header 写一条\"输入区隐藏时补圆角\"的特判规则。 */\n._panelInner_1yola_57 {\n position: relative;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n border-radius: var(--border-radius);\n border: 2px solid rgba(255, 255, 255, 0.4);\n box-shadow:\n 0 0 5px 1px rgba(255, 255, 255, 0.3),\n 0 4px 20px rgba(0, 0, 0, 0.5);\n}\n\n/* 控制栏 */\n._header_1yola_124 {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 8px 12px;\n user-select: none;\n\n height: var(--height);\n flex-shrink: 0; /* 防止 header 被压缩 */\n\n cursor: pointer;\n\n background: rgba(0, 0, 0, 0.5);\n backdrop-filter: blur(10px);\n background-clip: padding-box;\n\n ._statusSection_1yola_140 {\n display: flex;\n align-items: center;\n gap: 8px;\n flex: 1;\n min-height: 24px; /* 确保垂直居中 */\n\n ._indicator_1yola_147 {\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_1yola_156 {\n background: rgb(57, 182, 255);\n animation: _pulse_1yola_1 0.8s ease-in-out infinite;\n }\n\n &._tool_executing_1yola_161 {\n background: rgb(189, 69, 251);\n animation: _pulse_1yola_1 0.6s ease-in-out infinite;\n }\n\n &._retry_1yola_166 {\n background: rgb(255, 214, 0);\n animation: _retryPulse_1yola_1 1s ease-in-out infinite;\n }\n\n /* 静止状态 - 无动画 */\n &._completed_1yola_172,\n &._input_1yola_173,\n &._output_1yola_174 {\n background: rgb(34, 197, 94);\n animation: none;\n }\n\n &._error_1yola_179 {\n background: rgb(239, 68, 68);\n animation: none;\n }\n }\n\n ._statusText_1yola_185 {\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_1yola_197 {\n animation: _statusTextFadeOut_1yola_1 0.3s ease forwards;\n }\n\n &._fadeIn_1yola_201 {\n animation: _statusTextFadeIn_1yola_1 0.3s ease forwards;\n }\n }\n }\n\n ._controls_1yola_207 {\n display: flex;\n align-items: center;\n gap: 4px;\n\n ._controlButton_1yola_212 {\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 ._stopButton_1yola_231 {\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_1yola_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_1yola_1 {\n 0% {\n opacity: 1;\n transform: translateY(0);\n }\n 100% {\n opacity: 0;\n transform: translateY(-5px);\n }\n}\n\n/* 历史记录弹窗:普通流里排在面板前面(视觉上在上方),默认收起为 0 高度,\n * 展开时靠 JS 量出的真实内容高度做 max-height 动画(不用固定封顶值),\n * 撑开多高、要不要出现,跟面板本身完全无关,不用再算\"面板一共多高、弹窗该挂在哪个 bottom 偏移\"。 */\n._historySectionWrapper_1yola_268 {\n width: 100%;\n overflow: hidden;\n max-height: 0;\n margin-bottom: 0;\n\n background: rgba(2, 0, 20, 0.5);\n backdrop-filter: blur(10px);\n\n text-shadow: 0 0 1px rgba(0, 0, 0, 0.2);\n\n border-radius: calc(var(--border-radius) + 4px);\n border: 0 solid rgba(255, 255, 255, 0);\n box-shadow: 0 4px 16px rgba(0, 0, 0, 0);\n\n transition:\n max-height 0.2s,\n margin-bottom 0.2s,\n border-width 0.2s,\n border-color 0.2s,\n box-shadow 0.2s;\n\n ._wrapper_1yola_1._expanded_1yola_290 & {\n margin-bottom: 8px;\n border-width: 2px;\n border-color: rgba(255, 255, 255, 0.4);\n box-shadow: 0 4px 16px rgba(0, 0, 0, 0.6);\n }\n\n ._historySection_1yola_268 {\n max-height: min(\n 500px,\n calc(100vh - 200px - var(--height))\n ); /* 列表本身的滚动上限,跟展开/收起动画解耦 */\n overflow-y: auto;\n overscroll-behavior: contain;\n scrollbar-width: none;\n padding: 8px 8px 2px;\n\n ._historyItem_1yola_307 {\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 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_1yola_172,\n &._input_1yola_173,\n &._output_1yola_174 {\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_1yola_179 {\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_1yola_166 {\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 &._observation_1yola_365 {\n border-left-color: rgb(147, 51, 234);\n background: linear-gradient(135deg, rgba(147, 51, 234, 0.1), rgba(147, 51, 234, 0.05));\n }\n\n &._question_1yola_370 {\n border-left-color: rgb(255, 159, 67);\n background: linear-gradient(135deg, rgba(255, 159, 67, 0.15), rgba(255, 159, 67, 0.08));\n }\n\n /* 突出显示 done 成功结果 */\n &._doneSuccess_1yola_376 {\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_1yola_1 2s ease-in-out infinite;\n }\n\n ._historyContent_1yola_412 {\n ._statusIcon_1yola_413 {\n font-size: 16px;\n animation: _celebrate_1yola_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_1yola_422 {\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_1yola_412 {\n ._statusIcon_1yola_413 {\n font-size: 16px;\n filter: drop-shadow(0 2px 4px rgba(239, 68, 68, 0.5));\n }\n }\n }\n\n ._historyContent_1yola_412 {\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_1yola_413 {\n font-size: 12px;\n flex-shrink: 0;\n line-height: 1;\n transition: all 0.3s ease;\n }\n\n ._reflectionLines_1yola_472 {\n display: flex;\n flex-direction: column;\n gap: 4px;\n }\n }\n\n ._historyMeta_1yola_479 {\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_1yola_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_1yola_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_1yola_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_1yola_1 {\n 0% {\n left: -100%;\n }\n 100% {\n left: 100%;\n }\n}\n\n/* 输入区域样式 */\n._inputSectionWrapper_1yola_549 {\n width: 100%;\n margin: 0 auto;\n\n overflow: hidden;\n height: var(--input-height);\n\n transition: height 0.2s;\n\n /* 与 header 保持同色调,让面板看起来是一体的深色玻璃卡片 */\n background: rgba(0, 0, 0, 0.4);\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 &._hidden_1yola_565 {\n height: 0;\n }\n\n ._inputSection_1yola_549 {\n display: flex;\n align-items: center;\n gap: 8px;\n height: 100%;\n padding: 8px; /* 与上方状态条 padding 保持一致 */\n\n ._taskInput_1yola_576 {\n flex: 1;\n height: 100%;\n background: rgba(255, 255, 255, 0.08);\n border: 1px solid rgba(255, 255, 255, 0.15);\n border-radius: 12px;\n padding: 8px 14px;\n color: rgb(240, 240, 245);\n font-family: inherit;\n font-size: 14px;\n line-height: 1.4;\n outline: none;\n resize: none;\n overflow-y: auto;\n transition: all 0.2s ease;\n\n &::placeholder {\n color: rgba(255, 255, 255, 0.45);\n }\n\n &:focus {\n background: rgba(255, 255, 255, 0.14);\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/*$vite$:1*/")); document.head.appendChild(elementStyle); } } catch (e) { console.error("vite-plugin-css-injected-by-js", e); }})();
|
|
2
2
|
import { Motion } from "ai-motion";
|
|
3
3
|
import * as z from "zod/v4";
|
|
4
4
|
//#region \0rolldown/runtime.js
|
|
@@ -2547,47 +2547,49 @@ function escapeHtml(text) {
|
|
|
2547
2547
|
return text.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">").replace(/"/g, """).replace(/'/g, "'");
|
|
2548
2548
|
}
|
|
2549
2549
|
var UI_module_default = {
|
|
2550
|
-
wrapper: "
|
|
2551
|
-
|
|
2552
|
-
|
|
2553
|
-
|
|
2554
|
-
|
|
2555
|
-
header: "
|
|
2556
|
-
pulse: "
|
|
2557
|
-
retryPulse: "
|
|
2558
|
-
statusTextFadeOut: "
|
|
2559
|
-
statusTextFadeIn: "
|
|
2560
|
-
statusSection: "
|
|
2561
|
-
indicator: "
|
|
2562
|
-
thinking: "
|
|
2563
|
-
tool_executing: "
|
|
2564
|
-
retry: "
|
|
2565
|
-
completed: "
|
|
2566
|
-
input: "
|
|
2567
|
-
output: "
|
|
2568
|
-
error: "
|
|
2569
|
-
statusText: "
|
|
2570
|
-
fadeOut: "
|
|
2571
|
-
fadeIn: "
|
|
2572
|
-
controls: "
|
|
2573
|
-
controlButton: "
|
|
2574
|
-
stopButton: "
|
|
2575
|
-
historySectionWrapper: "
|
|
2576
|
-
shimmer: "
|
|
2577
|
-
celebrate: "
|
|
2578
|
-
expanded: "
|
|
2579
|
-
historySection: "
|
|
2580
|
-
historyItem: "
|
|
2581
|
-
observation: "
|
|
2582
|
-
question: "
|
|
2583
|
-
doneSuccess: "
|
|
2584
|
-
historyContent: "
|
|
2585
|
-
statusIcon: "
|
|
2586
|
-
doneError: "
|
|
2587
|
-
reflectionLines: "
|
|
2588
|
-
historyMeta: "
|
|
2589
|
-
|
|
2590
|
-
|
|
2550
|
+
wrapper: "_wrapper_1yola_1",
|
|
2551
|
+
panel: "_panel_1yola_57",
|
|
2552
|
+
background: "_background_1yola_57",
|
|
2553
|
+
"mask-running": "_mask-running_1yola_1",
|
|
2554
|
+
panelInner: "_panelInner_1yola_57",
|
|
2555
|
+
header: "_header_1yola_124",
|
|
2556
|
+
pulse: "_pulse_1yola_1",
|
|
2557
|
+
retryPulse: "_retryPulse_1yola_1",
|
|
2558
|
+
statusTextFadeOut: "_statusTextFadeOut_1yola_1",
|
|
2559
|
+
statusTextFadeIn: "_statusTextFadeIn_1yola_1",
|
|
2560
|
+
statusSection: "_statusSection_1yola_140",
|
|
2561
|
+
indicator: "_indicator_1yola_147",
|
|
2562
|
+
thinking: "_thinking_1yola_156",
|
|
2563
|
+
tool_executing: "_tool_executing_1yola_161",
|
|
2564
|
+
retry: "_retry_1yola_166",
|
|
2565
|
+
completed: "_completed_1yola_172",
|
|
2566
|
+
input: "_input_1yola_173",
|
|
2567
|
+
output: "_output_1yola_174",
|
|
2568
|
+
error: "_error_1yola_179",
|
|
2569
|
+
statusText: "_statusText_1yola_185",
|
|
2570
|
+
fadeOut: "_fadeOut_1yola_197",
|
|
2571
|
+
fadeIn: "_fadeIn_1yola_201",
|
|
2572
|
+
controls: "_controls_1yola_207",
|
|
2573
|
+
controlButton: "_controlButton_1yola_212",
|
|
2574
|
+
stopButton: "_stopButton_1yola_231",
|
|
2575
|
+
historySectionWrapper: "_historySectionWrapper_1yola_268",
|
|
2576
|
+
shimmer: "_shimmer_1yola_1",
|
|
2577
|
+
celebrate: "_celebrate_1yola_1",
|
|
2578
|
+
expanded: "_expanded_1yola_290",
|
|
2579
|
+
historySection: "_historySection_1yola_268",
|
|
2580
|
+
historyItem: "_historyItem_1yola_307",
|
|
2581
|
+
observation: "_observation_1yola_365",
|
|
2582
|
+
question: "_question_1yola_370",
|
|
2583
|
+
doneSuccess: "_doneSuccess_1yola_376",
|
|
2584
|
+
historyContent: "_historyContent_1yola_412",
|
|
2585
|
+
statusIcon: "_statusIcon_1yola_413",
|
|
2586
|
+
doneError: "_doneError_1yola_422",
|
|
2587
|
+
reflectionLines: "_reflectionLines_1yola_472",
|
|
2588
|
+
historyMeta: "_historyMeta_1yola_479",
|
|
2589
|
+
inputSectionWrapper: "_inputSectionWrapper_1yola_549",
|
|
2590
|
+
hidden: "_hidden_1yola_565",
|
|
2591
|
+
inputSection: "_inputSection_1yola_549",
|
|
2592
|
+
taskInput: "_taskInput_1yola_576"
|
|
2591
2593
|
};
|
|
2592
2594
|
//#endregion
|
|
2593
2595
|
//#region src/ui/cards.ts
|
|
@@ -2632,6 +2634,7 @@ var UI = class {
|
|
|
2632
2634
|
#wrapper;
|
|
2633
2635
|
#indicator;
|
|
2634
2636
|
#statusText;
|
|
2637
|
+
#historySectionWrapper;
|
|
2635
2638
|
#historySection;
|
|
2636
2639
|
#expandButton;
|
|
2637
2640
|
#actionButton;
|
|
@@ -2672,6 +2675,7 @@ var UI = class {
|
|
|
2672
2675
|
this.#wrapper = this.#createWrapper();
|
|
2673
2676
|
this.#indicator = this.#wrapper.querySelector(`.${UI_module_default.indicator}`);
|
|
2674
2677
|
this.#statusText = this.#wrapper.querySelector(`.${UI_module_default.statusText}`);
|
|
2678
|
+
this.#historySectionWrapper = this.#wrapper.querySelector(`.${UI_module_default.historySectionWrapper}`);
|
|
2675
2679
|
this.#historySection = this.#wrapper.querySelector(`.${UI_module_default.historySection}`);
|
|
2676
2680
|
this.#expandButton = this.#wrapper.querySelector(`.${UI_module_default.expandButton}`);
|
|
2677
2681
|
this.#actionButton = this.#wrapper.querySelector(`.${UI_module_default.stopButton}`);
|
|
@@ -2760,6 +2764,7 @@ var UI = class {
|
|
|
2760
2764
|
cardElement.setAttribute("data-temp-card", "true");
|
|
2761
2765
|
this.#historySection.appendChild(cardElement);
|
|
2762
2766
|
this.#scrollToBottom();
|
|
2767
|
+
this.#syncHistoryHeight();
|
|
2763
2768
|
this.#showInputArea(this.#i18n.t("ui.userAnswerPrompt"));
|
|
2764
2769
|
if (signal) {
|
|
2765
2770
|
this.#userAnswerSignal = signal;
|
|
@@ -2792,6 +2797,7 @@ var UI = class {
|
|
|
2792
2797
|
Array.from(this.#historySection.children).forEach((child) => {
|
|
2793
2798
|
if (child.getAttribute("data-temp-card") === "true") child.remove();
|
|
2794
2799
|
});
|
|
2800
|
+
this.#syncHistoryHeight();
|
|
2795
2801
|
}
|
|
2796
2802
|
show() {
|
|
2797
2803
|
this.wrapper.style.display = "block";
|
|
@@ -2914,7 +2920,6 @@ var UI = class {
|
|
|
2914
2920
|
wrapper.setAttribute("data-browser-use-ignore", "true");
|
|
2915
2921
|
wrapper.setAttribute("data-page-agent-ignore", "true");
|
|
2916
2922
|
wrapper.innerHTML = `
|
|
2917
|
-
<div class="${UI_module_default.background}"></div>
|
|
2918
2923
|
<div class="${UI_module_default.historySectionWrapper}">
|
|
2919
2924
|
<div class="${UI_module_default.historySection}">
|
|
2920
2925
|
<div class="${UI_module_default.historyItem}">
|
|
@@ -2925,27 +2930,32 @@ var UI = class {
|
|
|
2925
2930
|
</div>
|
|
2926
2931
|
</div>
|
|
2927
2932
|
</div>
|
|
2928
|
-
<div class="${UI_module_default.
|
|
2929
|
-
<div class="${UI_module_default.
|
|
2930
|
-
|
|
2931
|
-
<div class="${UI_module_default.
|
|
2932
|
-
|
|
2933
|
-
|
|
2934
|
-
|
|
2935
|
-
|
|
2936
|
-
|
|
2937
|
-
|
|
2938
|
-
|
|
2939
|
-
|
|
2940
|
-
|
|
2941
|
-
|
|
2942
|
-
|
|
2943
|
-
|
|
2944
|
-
|
|
2945
|
-
|
|
2946
|
-
class="${UI_module_default.
|
|
2947
|
-
|
|
2948
|
-
|
|
2933
|
+
<div class="${UI_module_default.panel}">
|
|
2934
|
+
<div class="${UI_module_default.background}"></div>
|
|
2935
|
+
<div class="${UI_module_default.panelInner}">
|
|
2936
|
+
<div class="${UI_module_default.header}">
|
|
2937
|
+
<div class="${UI_module_default.statusSection}">
|
|
2938
|
+
<div class="${UI_module_default.indicator} ${UI_module_default.thinking}"></div>
|
|
2939
|
+
<div class="${UI_module_default.statusText}">${this.#i18n.t("ui.ready")}</div>
|
|
2940
|
+
</div>
|
|
2941
|
+
<div class="${UI_module_default.controls}">
|
|
2942
|
+
<button class="${UI_module_default.controlButton} ${UI_module_default.expandButton}" title="${this.#i18n.t("ui.expand")}">
|
|
2943
|
+
▼
|
|
2944
|
+
</button>
|
|
2945
|
+
<button class="${UI_module_default.controlButton} ${UI_module_default.stopButton}" title="${this.#i18n.t("ui.close")}">
|
|
2946
|
+
X
|
|
2947
|
+
</button>
|
|
2948
|
+
</div>
|
|
2949
|
+
</div>
|
|
2950
|
+
<div class="${UI_module_default.inputSectionWrapper} ${UI_module_default.hidden}">
|
|
2951
|
+
<div class="${UI_module_default.inputSection}">
|
|
2952
|
+
<textarea
|
|
2953
|
+
class="${UI_module_default.taskInput}"
|
|
2954
|
+
maxlength="${taskInputMaxLength}"
|
|
2955
|
+
rows="1"
|
|
2956
|
+
></textarea>
|
|
2957
|
+
</div>
|
|
2958
|
+
</div>
|
|
2949
2959
|
</div>
|
|
2950
2960
|
</div>
|
|
2951
2961
|
`;
|
|
@@ -2967,7 +2977,7 @@ var UI = class {
|
|
|
2967
2977
|
});
|
|
2968
2978
|
this.#taskInput.addEventListener("keydown", (e) => {
|
|
2969
2979
|
if (e.isComposing) return;
|
|
2970
|
-
if (e.key === "Enter") {
|
|
2980
|
+
if (e.key === "Enter" && !e.shiftKey) {
|
|
2971
2981
|
e.preventDefault();
|
|
2972
2982
|
this.#submitTask();
|
|
2973
2983
|
}
|
|
@@ -2980,15 +2990,30 @@ var UI = class {
|
|
|
2980
2990
|
if (this.#isExpanded) this.#collapse();
|
|
2981
2991
|
else this.#expand();
|
|
2982
2992
|
}
|
|
2993
|
+
/**
|
|
2994
|
+
* Expand the history popup.
|
|
2995
|
+
*
|
|
2996
|
+
* `max-height` is measured in JS (not animated to a fixed CSS cap) so the
|
|
2997
|
+
* transition distance always matches the real content height — otherwise
|
|
2998
|
+
* expand/collapse feel like different speeds (expand reaches its real
|
|
2999
|
+
* height early and idles, collapse animates the full cap every time).
|
|
3000
|
+
*/
|
|
2983
3001
|
#expand() {
|
|
2984
3002
|
this.#isExpanded = true;
|
|
2985
3003
|
this.wrapper.classList.add(UI_module_default.expanded);
|
|
2986
3004
|
this.#expandButton.textContent = "▲";
|
|
3005
|
+
this.#syncHistoryHeight();
|
|
2987
3006
|
}
|
|
2988
3007
|
#collapse() {
|
|
2989
3008
|
this.#isExpanded = false;
|
|
2990
3009
|
this.wrapper.classList.remove(UI_module_default.expanded);
|
|
2991
3010
|
this.#expandButton.textContent = "▼";
|
|
3011
|
+
this.#historySectionWrapper.style.maxHeight = "0px";
|
|
3012
|
+
}
|
|
3013
|
+
/** Sync the history popup's max-height to its current (already capped) content height */
|
|
3014
|
+
#syncHistoryHeight() {
|
|
3015
|
+
if (!this.#isExpanded) return;
|
|
3016
|
+
this.#historySectionWrapper.style.maxHeight = `${this.#historySectionWrapper.scrollHeight}px`;
|
|
2992
3017
|
}
|
|
2993
3018
|
/**
|
|
2994
3019
|
* Start periodic header update loop
|
|
@@ -3070,6 +3095,7 @@ var UI = class {
|
|
|
3070
3095
|
for (const event of history) items.push(...this.#createHistoryCards(event));
|
|
3071
3096
|
this.#historySection.innerHTML = items.join("");
|
|
3072
3097
|
this.#scrollToBottom();
|
|
3098
|
+
this.#syncHistoryHeight();
|
|
3073
3099
|
}
|
|
3074
3100
|
#createTaskCard(task) {
|
|
3075
3101
|
return createCard({
|