openclaw-openagent 1.0.13 → 1.0.14

package/src/plugin-ui/modules/agent-book/panel/inject-ui.js

@@ -1,665 +0,0 @@
-
-// ── 注入逻辑（v3 — OC handleKeyDown/handleInput 钩子驱动）──
-//
-// 事件处理策略：
-//   keydown / input → 由 OC 注入钩子（mention-hooks UIExtension）调用 window.__clMention
-//   selectionchange → document 级事件委托（不绑 textarea，不怕 Lit 重建）
-//   beforeinput → document 级事件委托（同上）
-//   compositionstart/end → document 级事件委托（同上）
-//
-// tryInject() 只做 DOM 注入（@ 按钮 + CSS class），不绑定任何事件。
-
-// ── textarea 选择器（多版本兼容）──
-// v3 "Message..." / v4 "发消息..." / v5.x 结构化选择器
-const _CL_TEXTAREA_SELECTOR = [
-  'textarea[placeholder*="发消息"]',
-  'textarea[placeholder*="Message"]',
-  'textarea[placeholder*="Enter to send"]',
-  '.agent-chat__composer-combobox textarea',
-  '.chat-composer textarea',
-  '.chat-input textarea',
-  '[class*="composer"] textarea:not([placeholder*="Search"])',
-  '[class*="chat-input"] textarea',
-  '[data-component="chat-input"] textarea',
-].join(', ');
-
-function _getTextarea() {
-  return document.querySelector(_CL_TEXTAREA_SELECTOR);
-}
-
-function _setTextareaValue(textarea, value) {
-  const setter = Object.getOwnPropertyDescriptor(HTMLTextAreaElement.prototype, 'value')?.set;
-  if (setter) setter.call(textarea, value);
-  else textarea.value = value;
-  textarea.dispatchEvent(new Event('input', { bubbles: true }));
-}
-
-function _escapeRemoteAgentMarkerValue(value) {
-  return String(value || '')
-    .replace(/\s+/g, ' ')
-    .trim()
-    .replace(/"/g, "'");
-}
-
-function _buildRemoteAgentMarker(mention, userText) {
-  const hasChinese = /[\u4e00-\u9fff]/.test(userText || '');
-  const instruction = hasChinese
-    ? '请调用 openagent_call_remote_agent 工具将此请求转发给远端 Agent 处理'
-    : 'Please invoke the openagent_call_remote_agent tool to forward this request to the remote agent';
-  const attrs = [
-    `agent_id="${_escapeRemoteAgentMarkerValue(mention.agent_id)}"`,
-    `agent_name="${_escapeRemoteAgentMarkerValue(mention.name)}"`,
-  ];
-  if (mention.agent_bio) {
-    attrs.push(`agent_bio="${_escapeRemoteAgentMarkerValue(mention.agent_bio)}"`);
-  }
-  attrs.push(`instruction="${_escapeRemoteAgentMarkerValue(instruction)}"`);
-  return `{openagent_call_remote_agent:${attrs.join(',')}}`;
-}
-
-function _composeRemoteAgentMessage(textarea, mention) {
-  const currentVal = textarea.value || '';
-  const marker = _buildRemoteAgentMarker(mention, currentVal);
-  const escapedName = mention.name.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
-  const atPattern = new RegExp('@' + escapedName + '\\s*');
-  return {
-    currentVal,
-    marker,
-    message: currentVal.replace(atPattern, marker + ' ')
-  };
-}
-
-function _isLikelyNativeSendButton(target, textarea) {
-  const button = target && target.closest ? target.closest('button, [role="button"]') : null;
-  if (!button || !textarea) return false;
-  if (button.classList && button.classList.contains('openagent-at-btn')) return false;
-
-  const inputContainer = textarea.closest('.agent-chat__composer-combobox')
-                      || textarea.closest('.chat-input')
-                      || textarea.closest('[class*="chat-composer"]')
-                      || textarea.closest('[class*="chat"]')
-                      || textarea.parentElement;
-  if (!inputContainer || !inputContainer.contains(button)) return false;
-
-  const label = [
-    button.getAttribute('aria-label'),
-    button.getAttribute('title'),
-    button.textContent
-  ].filter(Boolean).join(' ').toLowerCase();
-  if (/send|发送/.test(label)) return true;
-
-  const buttons = Array.from(inputContainer.querySelectorAll('button, [role="button"]'))
-    .filter(function(btn) {
-      if (btn.classList && btn.classList.contains('openagent-at-btn')) return false;
-      if (btn.disabled || btn.getAttribute('aria-disabled') === 'true') return false;
-      return btn.offsetParent !== null;
-    });
-  return buttons.length > 0 && buttons[buttons.length - 1] === button;
-}
-
-function _sendPendingMention(textarea) {
-  if (!textarea || !CL.pendingMention) return false;
-  if (CL.remoteSendInFlight) return true;
-
-  const mention = CL.pendingMention;
-  const payload = _composeRemoteAgentMessage(textarea, mention);
-  CL.remoteSendInFlight = true;
-
-  console.log('[cl-diag][send-marker]', {
-    agentId: mention.agent_id,
-    agentName: mention.name,
-    userTextPreview: payload.currentVal.slice(0, 200),
-    markerPreview: payload.marker.slice(0, 240),
-    sendValuePreview: payload.message.slice(0, 260),
-  });
-
-  // 不把内部 marker 写入 textarea。可见输入框按原生发送行为立即清空；
-  // 真正发给 OpenClaw 的带 marker 文本只作为 handleSendChat 参数传入。
-  _setTextareaValue(textarea, '');
-
-  (async () => {
-    try {
-      CL.lastMentionAgentId = mention.agent_id;
-      CL.pendingMention = null;
-      await CL.sendRemoteAgentMessage(payload.message);
-      console.log('[openagent] remote call sent');
-    } catch (err) {
-      CL.pendingMention = mention;
-      _setTextareaValue(textarea, payload.currentVal);
-      console.error('[openagent] remote call send failed', err);
-      window.alert?.('OpenAgent remote call 未发送：请检查 gateway 连接后重试。');
-    } finally {
-      CL.remoteSendInFlight = false;
-    }
-  })();
-
-  return true;
-}
-
-function _installSendClickInterceptor() {
-  if (window.__openagentSendClickInterceptorInstalled) return;
-  window.__openagentSendClickInterceptorInstalled = true;
-  document.addEventListener('click', function(e) {
-    if (!CL.pendingMention || CL.remoteSendInFlight) return;
-    const textarea = _getTextarea();
-    if (!_isLikelyNativeSendButton(e.target, textarea)) return;
-
-    e.preventDefault();
-    e.stopPropagation();
-    if (typeof e.stopImmediatePropagation === 'function') e.stopImmediatePropagation();
-    _sendPendingMention(textarea);
-  }, true);
-}
-
-function _installSendKeydownInterceptor() {
-  if (window.__openagentSendKeydownInterceptorInstalled) return;
-  window.__openagentSendKeydownInterceptorInstalled = true;
-  document.addEventListener('keydown', function(e) {
-    if (!CL.pendingMention || CL.remoteSendInFlight) return;
-    if (e.key !== 'Enter' || e.shiftKey || e.isComposing) return;
-
-    const textarea = _getTextarea();
-    if (!textarea || e.target !== textarea) return;
-
-    e.preventDefault();
-    e.stopPropagation();
-    if (typeof e.stopImmediatePropagation === 'function') e.stopImmediatePropagation();
-    _sendPendingMention(textarea);
-  }, true);
-}
-
-/**
- * 多策略定位 textarea 所在输入区域的工具栏行。
- * v4.x: 工具栏在 textarea.parentElement.children 中
- * v5.x: 工具栏可能嵌套在祖父容器或包含 toolbar class
- * 返回 null 表示未找到则回退到 textarea 父级插入
- */
-function _findToolbarRow(textarea) {
-  var parent = textarea.parentElement;
-
-  // 策略 1（v4.x）: textarea 兄弟元素含 SVG 图标
-  if (parent) {
-    for (var i = 0; i < parent.children.length; i++) {
-      if (parent.children[i] !== textarea && parent.children[i].querySelector('svg')) return parent.children[i];
-    }
-  }
-
-  // 策略 2（v4.x）: 祖父级兄弟元素含 SVG 图标
-  if (parent) {
-    var grandparent = parent.parentElement;
-    if (grandparent) {
-      for (var j = 0; j < grandparent.children.length; j++) {
-        if (grandparent.children[j] !== parent && grandparent.children[j].querySelector('svg')) return grandparent.children[j];
-      }
-    }
-  }
-
-  // 策略 3（v5.x）: 搜索包含 toolbar class 的元素
-  var chatContainer = textarea.closest('[class*="chat"]');
-  if (chatContainer) {
-    var toolbarEl = chatContainer.querySelector('[class*="toolbar"]');
-    if (toolbarEl) return toolbarEl;
-  }
-
-  // 策略 4（v5.x fallback）: 搜索 voice/mic 按钮定位其容器
-  var voiceBtn = document.querySelector(
-    'button[aria-label*="voice"], button[aria-label*="语音"], ' +
-    'button[aria-label*="mic"], button[aria-label*="麦克风"]'
-  );
-  if (voiceBtn) return voiceBtn.parentElement;
-
-  return null;
-}
-
-function tryInject() {
-  const textarea = _getTextarea();
-
-  if (!textarea) return false;
-  _installSendClickInterceptor();
-  _installSendKeydownInterceptor();
-  if (document.querySelector('.openagent-at-btn')) return true; // 已注入
-
-  // ── 定位插入点：麦克风图标所在的 toolbar 行（多策略）──
-  var toolbarRow = _findToolbarRow(textarea);
-
-  // ── 创建 Agent Book 按钮 ──
-  const atBtn = document.createElement('button');
-  atBtn.className = 'openagent-at-btn';
-  atBtn.innerHTML = '<span class="at-sym">@</span> Agent Book';
-  atBtn.addEventListener('click', () => {
-    // 在 textarea 中插入 @ 字符，让状态机自然检测 → openPanel
-    const ta = _getTextarea();
-    if (!ta) return;
-    ta.focus();
-    const val = ta.value;
-    const pos = ta.selectionStart;
-    // 如果光标前已经是 @，不重复插入
-    if (pos > 0 && val[pos - 1] === '@') {
-      // 按钮主动触发 → 清除 dismissed 状态，确保弹窗能打开
-      if (typeof resetMention === 'function') resetMention();
-      _handleStateChange(ta);
-      return;
-    }
-    // 插入 @ 字符（前面加空格分隔，除非行首/空白后）
-    const needSpace = pos > 0 && !/[\s\n]/.test(val[pos - 1]);
-    const insert = needSpace ? ' @' : '@';
-    const newVal = val.slice(0, pos) + insert + val.slice(pos);
-    const setter = Object.getOwnPropertyDescriptor(
-      HTMLTextAreaElement.prototype, 'value'
-    )?.set;
-    if (setter) setter.call(ta, newVal);
-    else ta.value = newVal;
-    ta.selectionStart = ta.selectionEnd = pos + insert.length;
-    ta.dispatchEvent(new Event('input', { bubbles: true }));
-    // input 事件 → OC handleInput → __clMention.onInput → 状态机打开面板
-  });
-
-  if (toolbarRow) {
-    const toolbarLeft = toolbarRow.querySelector('[class*="toolbar-left"]') || toolbarRow;
-    const iconButtons = toolbarLeft.querySelectorAll('button, [role="button"]');
-    // 优先按 aria-label 匹配 voice/mic 按钮，回退到位置假设
-    let micBtn = null;
-    for (var i = 0; i < iconButtons.length; i++) {
-      var label = (iconButtons[i].getAttribute('aria-label') || '').toLowerCase();
-      if (/voice|mic|语音|麦克风/.test(label)) { micBtn = iconButtons[i]; break; }
-    }
-    if (!micBtn && iconButtons.length >= 2) {
-      micBtn = iconButtons[1]; // fallback: v4.x 中 mic 一般是第 2 个按钮
-    } else if (!micBtn && iconButtons.length === 1) {
-      micBtn = iconButtons[0];
-    }
-
-    if (micBtn) {
-      micBtn.after(atBtn);
-    } else {
-      toolbarLeft.appendChild(atBtn);
-    }
-  } else {
-    // 无工具栏时回退到 textarea 的父级插入
-    var fallbackParent = textarea.parentElement;
-    if (fallbackParent) fallbackParent.appendChild(atBtn);
-  }
-
-  // ── 给输入区域加 position: relative 包裹层 ──
-  var inputParent = textarea.parentElement;
-  const inputContainer = textarea.closest('.agent-chat__composer-combobox')
-                      || textarea.closest('.chat-input')
-                      || textarea.closest('[class*="chat-composer"]')
-                      || textarea.closest('[class*="chat"]')
-                      || (inputParent ? inputParent.parentElement : null)
-                      || inputParent;
-  if (inputContainer) {
-    inputContainer.classList.add('openagent-input-wrapper');
-    inputWrapperRef = inputContainer;
-  }
-
-  console.log('[openagent] ✅ Agent Book UI injected (v3 hook-driven)');
-
-  // ── 提示栏（Figma 141:3293）：页面加载即显示 ──
-  _injectHintBar(inputContainer || textarea.parentElement, toolbarRow);
-
-  return true;
-}
-
-/** 注入提示栏到输入区域上方 */
-function _injectHintBar(anchorEl, toolbarEl) {
-  if (!anchorEl || document.querySelector('.openagent-hint-bar')) return;
-
-  const hintBar = document.createElement('div');
-  hintBar.className = 'openagent-hint-bar';
-  hintBar.innerHTML = '' +
-    '<div class="openagent-hint-bar__content">' +
-      '<div class="openagent-hint-bar__icon">' +
-        '<svg xmlns="http://www.w3.org/2000/svg" width="27" height="27" viewBox="0 0 27 27" fill="none">' +
-          '<rect width="27" height="27" rx="6" fill="url(#paint0_linear_141_3277)" fill-opacity="0.1"/>' +
-          '<path d="M13.5 6.75098C16.8137 6.75098 19.5 9.43727 19.5 12.751C19.5 14.3288 18.8894 15.7629 17.8936 16.834L20.7803 19.7207C21.0732 20.0136 21.0732 20.4884 20.7803 20.7812C20.4874 21.0741 20.0126 21.0741 19.7197 20.7812L16.7383 17.7998C15.8038 18.4004 14.6933 18.751 13.5 18.751C10.1863 18.751 7.5 16.0647 7.5 12.751C7.5 9.43727 10.1863 6.75098 13.5 6.75098ZM13.5 8.25098C11.0147 8.25098 9 10.2657 9 12.751C9 15.2363 11.0147 17.251 13.5 17.251C15.9853 17.251 18 15.2363 18 12.751C18 10.2657 15.9853 8.25098 13.5 8.25098Z" fill="url(#paint1_linear_141_3277)"/>' +
-          '<defs>' +
-            '<linearGradient id="paint0_linear_141_3277" x1="0" y1="13.5" x2="27" y2="13.5" gradientUnits="userSpaceOnUse">' +
-              '<stop stop-color="#8274FF"/>' +
-              '<stop offset="1" stop-color="#3890FF"/>' +
-            '</linearGradient>' +
-            '<linearGradient id="paint1_linear_141_3277" x1="7.5" y1="13.8759" x2="20.9999" y2="13.8759" gradientUnits="userSpaceOnUse">' +
-              '<stop stop-color="#8274FF"/>' +
-              '<stop offset="1" stop-color="#3890FF"/>' +
-            '</linearGradient>' +
-          '</defs>' +
-        '</svg>' +
-      '</div>' +
-      '<span class="openagent-hint-bar__text">输入你的需求，调配远端Agent为你解决</span>' +
-    '</div>' +
-    '<button class="openagent-hint-bar__close">' +
-      '<svg xmlns="http://www.w3.org/2000/svg" width="21" height="21" viewBox="0 0 21 21" fill="none">' +
-        '<path d="M5.625 5.625L15.375 15.375" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>' +
-        '<path d="M15.375 5.625L5.625 15.375" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>' +
-      '</svg>' +
-    '</button>';
-
-  hintBar.querySelector('.openagent-hint-bar__close').addEventListener('click', () => {
-    hintBar.style.display = 'none';
-  });
-
-  // ── V2 版本兼容：≥ 2026.6.9 使用 absolute 定位，bottom 动态跟随输入区高度 ──
-  var isV2 = typeof _clIsHostVersionGte === 'function' && _clIsHostVersionGte('2026.6.9');
-  if (isV2) {
-    hintBar.style.position = 'absolute';
-  }
-
-  // 插入到 wrapper 外面、上方
-  anchorEl.parentElement.insertBefore(hintBar, anchorEl);
-
-  function _findHintBarToolbar() {
-    if (toolbarEl) return toolbarEl;
-    var parentEl = anchorEl.parentElement;
-    if (parentEl) {
-      for (var i = 0; i < parentEl.children.length; i++) {
-        var child = parentEl.children[i];
-        if (child !== anchorEl && child.className && String(child.className).indexOf('agent-chat__toolbar') !== -1) {
-          return child;
-        }
-      }
-    }
-    return anchorEl.closest && anchorEl.closest('.agent-chat__input')
-      ? anchorEl.closest('.agent-chat__input').querySelector('.agent-chat__toolbar')
-      : null;
-  }
-
-  function _readElementHeight(el) {
-    if (!el) return 0;
-    var rect = el.getBoundingClientRect ? el.getBoundingClientRect() : null;
-    if (rect && rect.height > 0) return rect.height;
-    return typeof el.offsetHeight === 'number' ? el.offsetHeight : 0;
-  }
-
-  // 跟随 composer wrapper 的实际尺寸。侧栏拖拽/布局重排不一定触发 window resize。
-  function _syncHintBarLayout() {
-    var rect = anchorEl.getBoundingClientRect();
-    if (rect.width > 0) {
-      hintBar.style.width = rect.width + 'px';
-      var rootStyle = document.documentElement && document.documentElement.style;
-      if (rootStyle) {
-        rootStyle.setProperty('--openagent-input-wrapper-right-offset', Math.max(0, window.innerWidth - rect.right) + 'px');
-        rootStyle.setProperty('--openagent-input-wrapper-right-edge', Math.max(0, rect.right) + 'px');
-        rootStyle.setProperty('--openagent-input-wrapper-width', rect.width + 'px');
-      }
-      _syncSidebarRightEdge(rect);
-    }
-    if (isV2) {
-      var toolbar = _findHintBarToolbar();
-      var bottom = _readElementHeight(anchorEl) + _readElementHeight(toolbar) + 6;
-      hintBar.style.bottom = bottom + 'px';
-    }
-  }
-
-  function _syncSidebarRightEdge(inputRect) {
-    var sidebars = document.querySelectorAll('.chat-sidebar');
-    for (var i = 0; i < sidebars.length; i++) {
-      var sidebar = sidebars[i];
-      var sidebarRect = sidebar.getBoundingClientRect();
-      if (!sidebarRect || sidebarRect.width <= 0) continue;
-      var left = Math.max(0, sidebarRect.left);
-      var targetRight = Math.min(window.innerWidth, Math.max(0, inputRect.right));
-      var targetWidth = Math.floor(targetRight - left);
-      if (targetWidth <= 0) continue;
-      sidebar.style.setProperty('--openagent-sidebar-target-width', targetWidth + 'px');
-      sidebar.style.setProperty('width', targetWidth + 'px', 'important');
-      sidebar.style.setProperty('max-width', targetWidth + 'px', 'important');
-      sidebar.style.setProperty('flex-basis', targetWidth + 'px', 'important');
-      sidebar.style.setProperty('margin-right', '0px', 'important');
-    }
-  }
-
-  function _scheduleHintBarLayoutSync() {
-    window.requestAnimationFrame
-      ? window.requestAnimationFrame(_syncHintBarLayout)
-      : setTimeout(_syncHintBarLayout, 0);
-  }
-
-  _syncHintBarLayout();
-  _scheduleHintBarLayoutSync();
-  window.addEventListener('resize', _scheduleHintBarLayoutSync);
-  if (typeof ResizeObserver === 'function') {
-    var hintBarResizeObserver = new ResizeObserver(_scheduleHintBarLayoutSync);
-    hintBarResizeObserver.observe(anchorEl);
-    var toolbarForResize = _findHintBarToolbar();
-    if (toolbarForResize) hintBarResizeObserver.observe(toolbarForResize);
-  }
-  if (typeof MutationObserver === 'function' && document.body) {
-    var sidebarLayoutObserver = new MutationObserver(_scheduleHintBarLayoutSync);
-    sidebarLayoutObserver.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['class'] });
-  }
-}
-
-// ════════════════════════════════════════════════════════════════
-// ── window.__clMention — OC 注入钩子的桥接对象 ──
-// ════════════════════════════════════════════════════════════════
-//
-// OC 的 handleKeyDown 中注入了：
-//   if (window.__clMention?.onKeyDown(e)) return;
-//
-// OC 的 handleInput 中注入了：
-//   window.__clMention?.onInput?.(target);
-//
-// 所有业务逻辑在此处理，注入端只做调用转发。
-
-window.__clMention = {
-
-  /**
-   * OC handleKeyDown 钩子。
-   * 返回 true → OC 跳过后续处理（包括 Enter 发送）。
-   * 返回 false → OC 继续正常处理。
-   */
-  onKeyDown(e) {
-    const textarea = e.target;
-
-    // ── 1. 面板打开时：键盘导航 ──
-    if (isActive()) {
-      switch (e.key) {
-        case 'ArrowDown':
-          e.preventDefault();
-          moveSelectionDown();
-          return true;
-
-        case 'ArrowUp':
-          e.preventDefault();
-          moveSelectionUp();
-          return true;
-
-        case 'Enter':
-          if (e.shiftKey) return false; // Shift+Enter = 换行，交给 OC
-          e.preventDefault();
-          selectHighlightedAgent(textarea);
-          return true; // 阻止 OC 发送
-
-        case 'Escape':
-          e.preventDefault();
-          setDismissed();
-          closePanel();
-          return true;
-      }
-      // 其他键（字符输入）：不拦截，让 OC 继续 → handleInput → onInput
-      return false;
-    }
-
-    // ── 2. Backspace 原子删除 @mention ──
-    // 对标 TIM mention.ts:321-356
-    // 整体删除 @AgentName（含 @ 符号），不保留 @，不重新弹出面板
-    if (e.key === 'Backspace' && CL.pendingMention) {
-      const val = textarea.value;
-      const pos = textarea.selectionStart;
-      const name = CL.pendingMention.name;
-      const mention = '@' + name;
-
-      const searchStart = Math.max(0, pos - mention.length - 1);
-      const nearText = val.substring(searchStart, pos);
-      const idx = nearText.lastIndexOf(mention);
-
-      if (idx !== -1) {
-        const mentionStart = searchStart + idx;
-        let mentionEnd = mentionStart + mention.length;
-        if (val[mentionEnd] === ' ') mentionEnd++; // 包含尾部空格
-
-        if (pos > mentionStart && pos <= mentionEnd) {
-          e.preventDefault();
-          // 整体删除 @AgentName（含 @ 符号）
-          const newVal = val.slice(0, mentionStart) + val.slice(mentionEnd);
-
-          const setter = Object.getOwnPropertyDescriptor(
-            HTMLTextAreaElement.prototype, 'value'
-          )?.set;
-          if (setter) setter.call(textarea, newVal);
-          else textarea.value = newVal;
-
-          // 光标放在删除位置
-          textarea.selectionStart = textarea.selectionEnd = mentionStart;
-          textarea.dispatchEvent(new Event('input', { bubbles: true }));
-          CL.pendingMention = null;
-          // @ 已被删除，状态机不会检测到 @ → 面板不会弹出
-          return true;
-        }
-      }
-    }
-
-    // ── 3. Enter 发送时：标记替换（面板关闭 + 有 pendingMention）──
-    // 这里接管原生发送，只是为了把可见 @mention 替换成 OpenAgent 内部 marker。
-    if (e.key === 'Enter' && !e.shiftKey && CL.pendingMention) {
-      e.preventDefault();
-      _sendPendingMention(textarea);
-
-      // 返回 true：OC 注入钩子会停止原生 Enter 发送，避免重复发送。
-      return true;
-    }
-
-    return false;
-  },
-
-  /**
-   * OC handleInput 钩子。
-   * 在 OC 的 props.onDraftChange(target.value) 之后调用。
-   */
-  onInput(textarea) {
-    _handleStateChange(textarea);
-  },
-
-  // ── 暴露给外部查询的辅助方法 ──
-  active() { return isActive(); },
-};
-
-// ════════════════════════════════════════════════════════════════
-// ── 事件委托（document 级，不怕 Lit 重建）──
-// ════════════════════════════════════════════════════════════════
-
-// ── 输入法组合状态跟踪 ──
-// 对标 suggestion.ts:508 "editor.view.composing"
-// 输入法组合中的 @ 不应触发面板（§1.1 ⑥）
-document.addEventListener('compositionstart', (e) => {
-  if (e.target?.matches?.(_CL_TEXTAREA_SELECTOR)) {
-    setComposing(true);
-  }
-});
-document.addEventListener('compositionend', (e) => {
-  if (e.target?.matches?.(_CL_TEXTAREA_SELECTOR)) {
-    setComposing(false);
-    // 输入法确认后可能产生 @，OC 的 handleInput 会触发 onInput
-    // 但 compositionend 在 input 之前触发，需要主动评估一次
-    _handleStateChange(e.target);
-  }
-});
-
-// ── 光标变化检测 ──
-// 对标 suggestion.ts:473 "选区变化也产生 transaction"
-// 实现 §1.3 ⑤ "点击输入框内其他位置 → 面板关闭"
-let _guardSelection = false;
-let _lastCursorPos = -1; // 追踪上次光标位置，用于判断进入 mention 的方向
-document.addEventListener('selectionchange', () => {
-  const textarea = _getTextarea();
-  if (!textarea || document.activeElement !== textarea) return;
-  if (_guardSelection) return;
-
-  // mention 光标保护（§1.6 原子标签）
-  // 对标 TIM：左键从右侧进入 → 跳到 @ 之前；右键从左侧进入 → 跳到末尾
-  const mentionRange = _findMentionRange(textarea.value);
-  if (mentionRange) {
-    const pos = textarea.selectionStart;
-    if (pos > mentionRange.start && pos < mentionRange.end &&
-        textarea.selectionStart === textarea.selectionEnd) {
-      _guardSelection = true;
-      if (_lastCursorPos >= 0 && _lastCursorPos >= mentionRange.end) {
-        // 箭头左键从右侧进入 → 跳到 @ 之前
-        textarea.selectionStart = textarea.selectionEnd = mentionRange.start;
-      } else if (_lastCursorPos >= 0 && _lastCursorPos <= mentionRange.start) {
-        // 箭头右键从左侧进入 → 跳到末尾
-        textarea.selectionStart = textarea.selectionEnd = mentionRange.end;
-      } else {
-        // 鼠标点击跳入 或 _lastCursorPos 未知(-1) → 跳到最近边界
-        const distToStart = pos - mentionRange.start;
-        const distToEnd = mentionRange.end - pos;
-        textarea.selectionStart = textarea.selectionEnd =
-          distToStart <= distToEnd ? mentionRange.start : mentionRange.end;
-      }
-      _lastCursorPos = textarea.selectionStart;
-      _guardSelection = false;
-      return;
-    }
-  }
-
-  _lastCursorPos = textarea.selectionStart;
-  // 状态机评估（光标移走 → 可能关闭面板）
-  _handleStateChange(textarea);
-});
-
-// ── mention 原子保护：阻止在 @mention 内部输入字符（§1.6）──
-// 事件委托：OC 不监听 beforeinput，不会冲突
-document.addEventListener('beforeinput', (e) => {
-  if (!e.target?.matches?.(_CL_TEXTAREA_SELECTOR)) return;
-  const textarea = e.target;
-  const mentionRange = _findMentionRange(textarea.value);
-  if (!mentionRange) return;
-  const selStart = textarea.selectionStart;
-  const selEnd = textarea.selectionEnd;
-  // 编辑范围与 mention 重叠 → 阻止
-  if (selStart > mentionRange.start && selStart < mentionRange.end) {
-    e.preventDefault();
-  } else if (selEnd > mentionRange.start && selEnd < mentionRange.end) {
-    e.preventDefault();
-  }
-});
-
-// ── 辅助函数 ──
-
-/**
- * 统一的状态变化处理：调用状态机 → 根据结果操作面板。
- */
-function _handleStateChange(textarea) {
-  const val = textarea.value;
-  const result = evaluateState(val, textarea.selectionStart, textarea.selectionEnd);
-
-  switch (result.action) {
-    case 'open':
-      openPanel(textarea);
-      break;
-    case 'update':
-      updatePanelSearch(textarea);
-      break;
-    case 'close':
-      closePanel();
-      break;
-    // 'none': 不做任何操作
-  }
-}
-
-/**
- * 找到 textarea.value 中当前 mention 的范围。
- * 用于原子保护（beforeinput / selectionchange）。
- *
- * @returns {{ start: number, end: number }|null}
- */
-function _findMentionRange(value) {
-  if (!CL.pendingMention) return null;
-  const name = CL.pendingMention.name;
-  const mention = '@' + name;
-  const idx = value.lastIndexOf(mention);
-  if (idx === -1) return null;
-  let end = idx + mention.length;
-  if (value[end] === ' ') end++; // 包含尾部空格
-  return { start: idx, end };
-}