// 3 设置新的光标位置
manacoEditor.setPosition(position.lineNumber, position.column + insertText.length)
// 4 聚焦
manacoEditor.focus()
如果单纯只是 使用setPosition()，是无法回显闪动的光标的，因为拖拽的时候 编辑器已经失去了焦点，所以还要加一步 focus()，保证编辑器重新聚焦。
function shadowCaretRangeFromPoint(shadowRoot, x, y) {
const range = document.createRange();
// Get the element under the point
let el = shadowRoot.elementFromPoint(x, y);
Monaco
Editor
是一款基于浏览器的代码
编辑器
，提供了丰富的API和功能。要在
Monaco
Editor
中
插入
图标，可以按照以下步骤进行操作：
1. 导入所需的图标库：
Monaco
Editor
默认情况下不包含图标库，因此需要首先导入所需的图标库。可以使用第三方的字体图标库，如Font Awesome或者Material Icons。将图标库的CSS文件引入到页面中。
2. 创建一个自定义的
编辑器
主题：要在
Monaco
Editor
中
插入
图标，首先需要创建一个自定义的
编辑器
主题。可以参考
Monaco
Editor
的官方文档，了解如何创建和使用自定义主题。
3. 在
编辑器
中
插入
图标：通过使用
Monaco
Editor
提供的Decorations API，在
编辑器
的指定位置
插入
图标。可以使用装饰器(decorators)来设置
编辑器
中的任何位置，并添加自定义样式和图标。
以下是一个简单的示例代码，用于在
Monaco
Editor
中
插入
一个"保存"的图标：
```javascript
// 导入图标库的CSS文件
import 'font-awesome/css/font-awesome.min.css';
// 创建一个自定义的
编辑器
主题
monaco
.
editor
.defineTheme('custom-theme', {
base: 'vs',
inherit: true,
rules: [
{ token: 'save-icon', foreground: 'blue', fontStyle: 'bold' }
colors: {}
// 在
编辑器
中
插入
图标
const decorations =
editor
.deltaDecorations([], [
range: new
monaco
.Range(1, 1, 1, 1),
options: {
isWholeLine: true,
glyphMarginClassName: 'save-icon'
// 将主题应用到
编辑器
monaco
.
editor
.setTheme('custom-theme');
通过以上步骤，我们就可以在
Monaco
Editor
中成功
插入
图标了。请注意，在实际使用中，可以根据需要调整图标位置、样式和主题。
