diff --git a/packages/core/src/client/index.ts b/packages/core/src/client/index.ts index 8321107..40a12a0 100644 --- a/packages/core/src/client/index.ts +++ b/packages/core/src/client/index.ts @@ -2,7 +2,6 @@ import { LitElement, TemplateResult, css, html } from 'lit'; import { property, query, state } from 'lit/decorators.js'; import { styleMap } from 'lit/directives/style-map.js'; import { PathName, DefaultPort } from '../shared'; -import { formatOpenPath } from 'launch-ide'; const styleId = '__code-inspector-unique-id'; const AstroFile = 'data-astro-source-file'; @@ -154,6 +153,12 @@ export class CodeInspectorComponent extends LitElement { sendType: 'xhr' | 'img' = 'xhr'; @state() activeNode: ActiveNode = {}; + @state() + actionMode: 'ide' | 'copy' = 'ide'; // 模式:ide-在IDE中打开,copy-复制路径 + @state() + showModeToast = false; // 显示模式切换提示 + @state() + modeToastTimer: number | null = null; // 模式切换提示定时器 @query('#inspector-switch') inspectorSwitchRef!: HTMLDivElement; @@ -530,30 +535,53 @@ export class CodeInspectorComponent extends LitElement { return targetUrl; }; + // 切换模式 + toggleMode = () => { + this.actionMode = this.actionMode === 'ide' ? 'copy' : 'ide'; + this.showModeToastNotification(); + }; + + // 显示模式切换提示 + showModeToastNotification = () => { + // 清除之前的定时器 + if (this.modeToastTimer !== null) { + window.clearTimeout(this.modeToastTimer); + } + + this.showModeToast = true; + + // 2秒后自动隐藏 + this.modeToastTimer = window.setTimeout(() => { + this.showModeToast = false; + this.modeToastTimer = null; + }, 2000); + }; + // 触发功能的处理 trackCode = () => { - if (this.locate) { - // 请求本地服务端,打开vscode - if (this.sendType === 'xhr') { - this.sendXHR(); - } else { - this.sendImg(); + // 根据当前模式执行对应操作 + if (this.actionMode === 'ide') { + // IDE模式:打开编辑器 + if (this.locate) { + // 请求本地服务端,打开vscode + if (this.sendType === 'xhr') { + this.sendXHR(); + } else { + this.sendImg(); + } } + if (this.target) { + window.open(this.buildTargetUrl(), '_blank'); + } + } else if (this.actionMode === 'copy') { + // 复制模式:复制路径 + // 直接复制文件路径,格式:/path/to/file.tsx:line:column + const pathToCopy = `${this.element.path}:${this.element.line}:${this.element.column}`; + this.copyToClipboard(pathToCopy); } - if (this.copy) { - const path = formatOpenPath( - this.element.path, - String(this.element.line), - String(this.element.column), - this.copy - ); - this.copyToClipboard(path[0]); - } - if (this.target) { - window.open(this.buildTargetUrl(), '_blank'); - } + window.dispatchEvent(new CustomEvent('code-inspector:trackCode', { - detail: this.element, + detail: { ...this.element, mode: this.actionMode }, })); }; @@ -743,6 +771,23 @@ export class CodeInspectorComponent extends LitElement { } }; + // 监听键盘按下,处理模式切换 + handleKeyDown = (e: KeyboardEvent) => { + // Shift+Alt+C 切换模式 + // 检查 key, code, 和 keyCode 以确保在不同系统上都能工作 + const isC = + e.key === 'c' || + e.key === 'C' || + e.code === 'KeyC' || + e.keyCode === 67; + + if (e.shiftKey && e.altKey && isC && !e.ctrlKey && !e.metaKey) { + e.preventDefault(); + e.stopPropagation(); + this.toggleMode(); + } + }; + // 监听键盘抬起,清除遮罩层 handleKeyUp = (e: KeyboardEvent) => { if (!this.isTracking(e) && !this.open) { @@ -882,6 +927,7 @@ export class CodeInspectorComponent extends LitElement { window.addEventListener('touchmove', this.handleDrag, true); window.addEventListener('click', this.handleMouseClick, true); window.addEventListener('pointerdown', this.handlePointerDown, true); + window.addEventListener('keydown', this.handleKeyDown, true); window.addEventListener('keyup', this.handleKeyUp, true); window.addEventListener('mouseleave', this.removeCover, true); window.addEventListener('mouseup', this.handleMouseUp, true); @@ -896,6 +942,7 @@ export class CodeInspectorComponent extends LitElement { window.removeEventListener('touchmove', this.handleDrag, true); window.removeEventListener('click', this.handleMouseClick, true); window.removeEventListener('pointerdown', this.handlePointerDown, true); + window.removeEventListener('keydown', this.handleKeyDown, true); window.removeEventListener('keyup', this.handleKeyUp, true); window.removeEventListener('mouseleave', this.removeCover, true); window.removeEventListener('mouseup', this.handleMouseUp, true); @@ -995,12 +1042,20 @@ export class CodeInspectorComponent extends LitElement {