diff --git a/src/renderer/src/components/CodeEditor/PlaceholderContentWidget.ts b/src/renderer/src/components/CodeEditor/PlaceholderContentWidget.ts index dc29d86..ce5e65a 100644 --- a/src/renderer/src/components/CodeEditor/PlaceholderContentWidget.ts +++ b/src/renderer/src/components/CodeEditor/PlaceholderContentWidget.ts @@ -1,7 +1,7 @@ import { monaco } from "./monaco" /** - * Represents an placeholder renderer for monaco editor + * Represents a placeholder renderer for monaco editor * Roughly based on https://github.com/microsoft/vscode/blob/main/src/vs/workbench/contrib/codeEditor/browser/untitledTextEditorHint/untitledTextEditorHint.ts */ export class PlaceholderContentWidget implements monaco.editor.IContentWidget { @@ -35,13 +35,38 @@ export class PlaceholderContentWidget implements monaco.editor.IContentWidget { if (!this.domNode) { this.domNode = document.createElement("div") this.domNode.style.width = "max-content" - this.domNode.style.pointerEvents = "none" - this.domNode.textContent = this.placeholder + this.domNode.style.pointerEvents = "none" // 整个容器禁用指针事件 this.domNode.style.fontStyle = "italic" - const a = document.createElement("a") - a.href = "https://baiud.com" - a.textContent = "百度" - this.domNode.appendChild(a) + this.domNode.style.opacity = "0.6" // 添加透明度,更像 placeholder + + // 创建文本节点 + const textNode = document.createTextNode(this.placeholder + " ") + this.domNode.appendChild(textNode) + + // 创建链接 + const link = document.createElement("a") + link.href = "https://baidu.com" + link.textContent = "AA" + link.style.pointerEvents = "auto" // 只对链接启用指针事件 + link.style.color = "#0066cc" // 设置链接颜色 + link.style.textDecoration = "underline" + link.style.cursor = "pointer" + link.target = "_blank" // 在新标签页打开 + link.rel = "noopener noreferrer" // 安全属性 + + // 阻止点击链接时编辑器获得焦点 + link.addEventListener("mousedown", e => { + e.preventDefault() + e.stopPropagation() + }) + + link.addEventListener("click", e => { + e.preventDefault() + e.stopPropagation() + // window.open(link.href, "_blank", "noopener,noreferrer") + }) + + this.domNode.appendChild(link) this.editor.applyFontInfo(this.domNode) }