@lvce-editor/editor-worker 19.1.0 → 19.3.0

package/dist/editorWorkerMain.js

@@ -1538,12 +1538,12 @@ const launchColorPickerWorker = async () => {
   return launchWorker(name, url);
 };
 
-const state$f = {};
+const state$d = {};
 const getOrCreate$3 = () => {
-  if (!state$f.workerPromise) {
-    state$f.workerPromise = launchColorPickerWorker();
+  if (!state$d.workerPromise) {
+    state$d.workerPromise = launchColorPickerWorker();
   }
-  return state$f.workerPromise;
+  return state$d.workerPromise;
 };
 const invoke$9 = async (method, ...params) => {
   const worker = await getOrCreate$3();
@@ -1626,6 +1626,7 @@ const createEditor2 = (id, uri, x, y, width, height, platform, assetDir) => {
     fontWeight: 0,
     handleOffset: 0,
     handleOffsetX: 0,
+    hasListener: false,
     height,
     highlightedLine: -1,
     id,
@@ -1637,6 +1638,7 @@ const createEditor2 = (id, uri, x, y, width, height, platform, assetDir) => {
     isAutoClosingTagsEnabled: false,
     isMonospaceFont: false,
     isQuickSuggestionsEnabled: false,
+    isSelecting: false,
     itemHeight: 20,
     languageId: '',
     letterSpacing: 0,
@@ -1657,6 +1659,14 @@ const createEditor2 = (id, uri, x, y, width, height, platform, assetDir) => {
     savedSelections: [],
     scrollBarHeight: 0,
     scrollBarWidth: 0,
+    selectionAnchorPosition: {
+      columnIndex: 0,
+      rowIndex: 0
+    },
+    selectionAutoMovePosition: {
+      columnIndex: 0,
+      rowIndex: 0
+    },
     selectionInfos: [],
     selections: new Uint32Array(),
     tabSize: 0,
@@ -1847,7 +1857,7 @@ const getInitialLineState = initialLineState => {
   return deepCopy(initialLineState);
 };
 
-const state$e = {
+const state$c = {
   warned: []
 };
 const flattenTokensArray = tokens => {
@@ -1859,10 +1869,10 @@ const flattenTokensArray = tokens => {
   return flattened;
 };
 const warnDeprecatedArrayReturn = (languageId, fn) => {
-  if (state$e.warned.includes(fn)) {
+  if (state$c.warned.includes(fn)) {
     return;
   }
-  state$e.warned.push(fn);
+  state$c.warned.push(fn);
   console.warn(`tokenizers without hasArrayReturn=false are deprecated (language ${languageId})`);
 };
 const safeTokenizeLine = (languageId, tokenizeLine, line, lineStateAtStart, hasArrayReturn) => {
@@ -1923,14 +1933,14 @@ const TokenizePlainText = {
   tokenizeLine
 };
 
-const state$d = {
+const state$b = {
   enabled: false
 };
 const setEnabled$1 = value => {
-  state$d.enabled = value;
+  state$b.enabled = value;
 };
 const getEnabled$1 = () => {
-  return state$d.enabled;
+  return state$b.enabled;
 };
 
 const {
@@ -1938,25 +1948,25 @@ const {
   set: set$6
 } = SyntaxHighlightingWorker;
 
-const state$c = {
+const state$a = {
   pending: Object.create(null),
   tokenizePaths: Object.create(null),
   tokenizers: Object.create(null)
 };
 const has = languageId => {
-  return Object.hasOwn(state$c.tokenizers, languageId);
+  return Object.hasOwn(state$a.tokenizers, languageId);
 };
 const set$5 = (languageId, tokenizer) => {
-  state$c.tokenizers[languageId] = tokenizer;
+  state$a.tokenizers[languageId] = tokenizer;
 };
 const get$5 = languageId => {
-  return state$c.tokenizers[languageId];
+  return state$a.tokenizers[languageId];
 };
 const setTokenizePath = (languageId, tokenizePath) => {
-  state$c.tokenizePaths[languageId] = tokenizePath;
+  state$a.tokenizePaths[languageId] = tokenizePath;
 };
 const getTokenizePath$1 = languageId => {
-  return state$c.tokenizePaths[languageId] || '';
+  return state$a.tokenizePaths[languageId] || '';
 };
 const setTokenizePaths = languages => {
   for (const language of languages) {
@@ -1966,7 +1976,7 @@ const setTokenizePaths = languages => {
   }
 };
 const isPending = languageId => {
-  return Object.hasOwn(state$c.pending, languageId);
+  return Object.hasOwn(state$a.pending, languageId);
 };
 
 const tokenMaps = Object.create(null);
@@ -2809,14 +2819,14 @@ const getNewDeltaPercent = (height, scrollBarHeight, relativeY) => {
   };
 };
 
-const state$b = {
+const state$9 = {
   enabled: false
 };
 const setEnabled = value => {
-  state$b.enabled = value;
+  state$9.enabled = value;
 };
 const getEnabled = () => {
-  return state$b.enabled;
+  return state$9.enabled;
 };
 
 // TODO this should be in a separate scrolling module
@@ -2996,7 +3006,7 @@ const getUrlAtOffset = (editor, offset) => {
 
 const EditorChange = 1;
 
-const state$a = Object.create(null);
+const state$8 = Object.create(null);
 
 /**
  * Register a listener for a specific event type
@@ -3006,13 +3016,13 @@ const state$a = Object.create(null);
 const registerListener$1 = (listenerType, rpcId) => {
   number(listenerType);
   number(rpcId);
-  if (!Object.hasOwn(state$a, listenerType)) {
-    state$a[listenerType] = [];
+  if (!Object.hasOwn(state$8, listenerType)) {
+    state$8[listenerType] = [];
   }
 
   // Avoid duplicate registrations
-  if (!state$a[listenerType].includes(rpcId)) {
-    state$a[listenerType].push(rpcId);
+  if (!state$8[listenerType].includes(rpcId)) {
+    state$8[listenerType].push(rpcId);
   }
 };
 
@@ -3024,10 +3034,10 @@ const registerListener$1 = (listenerType, rpcId) => {
 const unregisterListener$1 = (listenerType, rpcId) => {
   number(listenerType);
   number(rpcId);
-  if (Object.hasOwn(state$a, listenerType)) {
-    const index = state$a[listenerType].indexOf(rpcId);
+  if (Object.hasOwn(state$8, listenerType)) {
+    const index = state$8[listenerType].indexOf(rpcId);
     if (index !== -1) {
-      state$a[listenerType].splice(index, 1);
+      state$8[listenerType].splice(index, 1);
     }
   }
 };
@@ -3039,7 +3049,7 @@ const unregisterListener$1 = (listenerType, rpcId) => {
  */
 const getListeners = listenerType => {
   number(listenerType);
-  return state$a[listenerType] || [];
+  return state$8[listenerType] || [];
 };
 
 /**
@@ -3693,9 +3703,11 @@ const emptyEditor = {
   differences: [],
   embeds: [],
   focused: false,
+  hasListener: false,
   height: 0,
   highlightedLine: -1,
   incrementalEdits: emptyIncrementalEdits,
+  isSelecting: false,
   languageId: '',
   // TODO use numeric language id?
   lineCache: [],
@@ -3705,6 +3717,14 @@ const emptyEditor = {
   minLineY: 0,
   redoStack: [],
   scrollBarHeight: 0,
+  selectionAnchorPosition: {
+    columnIndex: 0,
+    rowIndex: 0
+  },
+  selectionAutoMovePosition: {
+    columnIndex: 0,
+    rowIndex: 0
+  },
   selectionInfos: [],
   selections: new Uint32Array(),
   textInfos: [],
@@ -4027,6 +4047,7 @@ const createEditor = async ({
     fontWeight,
     handleOffset: 0,
     handleOffsetX: 0,
+    hasListener: false,
     height,
     id,
     incrementalEdits: emptyIncrementalEdits,
@@ -4036,6 +4057,7 @@ const createEditor = async ({
     isAutoClosingTagsEnabled,
     isMonospaceFont,
     isQuickSuggestionsEnabled,
+    isSelecting: false,
     itemHeight: 20,
     languageId: computedlanguageId,
     letterSpacing,
@@ -4056,6 +4078,14 @@ const createEditor = async ({
     savedSelections,
     scrollBarHeight: 0,
     scrollBarWidth: 0,
+    selectionAnchorPosition: {
+      columnIndex: 0,
+      rowIndex: 0
+    },
+    selectionAutoMovePosition: {
+      columnIndex: 0,
+      rowIndex: 0
+    },
     selectionInfos: [],
     selections: new Uint32Array(),
     tabSize,
@@ -4122,7 +4152,7 @@ const createEditor = async ({
 };
 
 const isEqual$2 = (oldState, newState) => {
-  return oldState.rowHeight === newState.rowHeight && oldState.deltaY === newState.deltaY && oldState.finalDeltaY === newState.finalDeltaY && oldState.height === newState.height && oldState.scrollBarHeight === newState.scrollBarHeight;
+  return oldState.rowHeight === newState.rowHeight && oldState.deltaY === newState.deltaY && oldState.finalDeltaY === newState.finalDeltaY && oldState.height === newState.height && oldState.deltaX === newState.deltaX && oldState.longestLineWidth === newState.longestLineWidth && oldState.minimumSliderSize === newState.minimumSliderSize && oldState.width === newState.width && oldState.scrollBarHeight === newState.scrollBarHeight;
 };
 
 const isEqual$1 = (oldState, newState) => {
@@ -4133,7 +4163,7 @@ const isEqual$1 = (oldState, newState) => {
 };
 
 const isEqual = (oldState, newState) => {
-  return oldState.cursorInfos === newState.cursorInfos && oldState.diagnostics === newState.diagnostics && oldState.highlightedLine === newState.highlightedLine && oldState.lineNumbers === newState.lineNumbers && oldState.textInfos === newState.textInfos && oldState.differences === newState.differences && oldState.initial === newState.initial && oldState.deltaY === newState.deltaY && oldState.scrollBarHeight === newState.scrollBarHeight && oldState.scrollBarWidth === newState.scrollBarWidth && oldState.selectionInfos === newState.selectionInfos;
+  return oldState.cursorInfos === newState.cursorInfos && oldState.diagnostics === newState.diagnostics && oldState.highlightedLine === newState.highlightedLine && oldState.lineNumbers === newState.lineNumbers && oldState.textInfos === newState.textInfos && oldState.differences === newState.differences && oldState.initial === newState.initial && oldState.selectionInfos === newState.selectionInfos;
 };
 
 const RenderFocus = 6;
@@ -4521,7 +4551,7 @@ const y = (editor, rowIndex) => {
   return offsetY;
 };
 
-const state$9 = {
+const state$7 = {
   timeout: -1
 };
 
@@ -4552,7 +4582,7 @@ const editorShowMessage = async (editor, rowIndex, columnIndex, message, isError
 
     // TODO use wrapper timing module instead of this
     // @ts-ignore
-    state$9.timeout = setTimeout(handleTimeout, 3000);
+    state$7.timeout = setTimeout(handleTimeout, 3000);
   }
   return editor;
 };
@@ -4572,8 +4602,8 @@ const showErrorMessage = async (editor, rowIndex, columnIndex, message) => {
 
 // @ts-ignore
 const editorHideMessage = async editor => {
-  clearTimeout(state$9.timeout);
-  state$9.timeout = -1;
+  clearTimeout(state$7.timeout);
+  state$7.timeout = -1;
   // await RendererProcess.invoke(/* Viewlet.send */ 'Viewlet.send', /* id */ editor.uid, /* method */ 'hideOverlayMessage')
   return editor;
 };
@@ -4689,12 +4719,12 @@ const launchRenameWorker = async () => {
   return rpc;
 };
 
-const state$8 = {};
+const state$6 = {};
 const getOrCreate$2 = () => {
-  if (!state$8.workerPromise) {
-    state$8.workerPromise = launchRenameWorker();
+  if (!state$6.workerPromise) {
+    state$6.workerPromise = launchRenameWorker();
   }
-  return state$8.workerPromise;
+  return state$6.workerPromise;
 };
 const invoke$5 = async (method, ...params) => {
   const worker = await getOrCreate$2();
@@ -4814,12 +4844,12 @@ const openColorPicker = async editor => {
   return addWidgetToEditor(ColorPicker$1, ColorPicker, editor, create$6, newStateGenerator$6);
 };
 
-const state$7 = {
+const state$5 = {
   compositionText: '',
   isComposing: false
 };
 const compositionStart = (editor, event) => {
-  state$7.isComposing = true;
+  state$5.isComposing = true;
   return editor;
 };
 const getCompositionChanges = (selections, data) => {
@@ -4829,9 +4859,9 @@ const getCompositionChanges = (selections, data) => {
     const selectionStartColumn = selections[i + 1];
     const selectionEndRow = selections[i + 2];
     const selectionEndColumn = selections[i + 3];
-    const startColumnIndex = selectionStartColumn - state$7.compositionText.length;
+    const startColumnIndex = selectionStartColumn - state$5.compositionText.length;
     changes.push({
-      deleted: [state$7.compositionText],
+      deleted: [state$5.compositionText],
       end: {
         columnIndex: selectionEndColumn,
         rowIndex: selectionEndRow
@@ -4851,7 +4881,7 @@ const compositionUpdate = (editor, data) => {
     selections
   } = editor;
   const changes = getCompositionChanges(selections, data);
-  state$7.compositionText = data;
+  state$5.compositionText = data;
   return scheduleDocumentAndCursorsSelections(editor, changes);
 };
 const compositionEnd = (editor, data) => {
@@ -4859,8 +4889,8 @@ const compositionEnd = (editor, data) => {
     selections
   } = editor;
   const changes = getCompositionChanges(selections, data);
-  state$7.isComposing = false;
-  state$7.compositionText = '';
+  state$5.isComposing = false;
+  state$5.compositionText = '';
   return scheduleDocumentAndCursorsSelections(editor, changes);
 };
 
@@ -5960,21 +5990,6 @@ const closeWidgetsMaybe = widgets => {
   return widgets.filter(isPersistentWidget);
 };
 
-const state$6 = {
-  position: {
-    columnIndex: 0,
-    rowIndex: 0
-  }
-};
-const getPosition$1 = () => {
-  return state$6.position;
-};
-
-// @ts-ignore
-const setPosition$1 = position => {
-  state$6.position = position;
-};
-
 const openExternal = async (url, platform) => {
   await openUrl(url, platform);
 };
@@ -6038,12 +6053,11 @@ const Ctrl = 1;
 const Alt = 2;
 
 const handleSingleClickDefault = (editor, position) => {
-  // TODO avoid global variables, add them to editor state
-  setPosition$1(position);
   const widgets = closeWidgetsMaybe(editor.widgets);
   return {
     ...editor,
     focused: true,
+    selectionAnchorPosition: position,
     selections: new Uint32Array([position.rowIndex, position.columnIndex, position.rowIndex, position.columnIndex]),
     widgets
   };
@@ -6132,6 +6146,16 @@ const Single = 1;
 const Double = 2;
 const Triple = 3;
 
+const getModifier = (altKey, ctrlKey) => {
+  if (altKey) {
+    return Alt;
+  }
+  if (ctrlKey) {
+    return Ctrl;
+  }
+  return 0;
+};
+
 const handleSingleClick = async (editor, modifier, x, y) => {
   object(editor);
   number(modifier);
@@ -6169,43 +6193,42 @@ const handleTripleClick = (editor, modifier, x, y) => {
   return selectLine(editor);
 };
 
-const getModifier = (altKey, ctrlKey) => {
-  if (altKey) {
-    return Alt;
-  }
-  if (ctrlKey) {
-    return Ctrl;
-  }
-  return 0;
-};
-const handleMouseDown = (state, button, altKey, ctrlKey, x, y, detail) => {
+const handleMouseDown = async (state, button, altKey, ctrlKey, x, y, detail) => {
   const modifier = getModifier(altKey, ctrlKey);
+  let newState;
   switch (detail) {
     case Double:
-      return handleDoubleClick(state, modifier, x, y);
+      newState = await handleDoubleClick(state, modifier, x, y);
+      break;
     case Single:
-      return handleSingleClick(state, modifier, x, y);
+      newState = await handleSingleClick(state, modifier, x, y);
+      break;
     case Triple:
-      return handleTripleClick(state, modifier, x, y);
+      newState = handleTripleClick(state, modifier, x, y);
+      break;
     default:
       return state;
   }
+  return {
+    ...newState,
+    isSelecting: true
+  };
 };
 
-const state$5 = {
+const state$4 = {
   editor: undefined,
   timeout: -1,
   x: 0,
   y: 0
 };
 const get$1 = () => {
-  return state$5;
+  return state$4;
 };
 const set$1 = (editor, timeout, x, y) => {
-  state$5.editor = editor;
-  state$5.timeout = timeout;
-  state$5.x = x;
-  state$5.y = y;
+  state$4.editor = editor;
+  state$4.timeout = timeout;
+  state$4.x = x;
+  state$4.y = y;
 };
 
 const showHover$1 = async (editor, position) => {
@@ -6346,59 +6369,21 @@ const editorHandleNativeSelectionChange = (editor, range) => {
   return scheduleSelections(editor, selections);
 };
 
-const state$4 = {
-  /**
-   * @type {any}
-   */
-  currentEditor: undefined,
-  hasListener: false,
-  isSelecting: false,
-  position: {
-    columnIndex: 0,
-    rowIndex: 0
-  }
-};
-
-// @ts-ignore
-const setEditor = editor => {
-  state$4.currentEditor = editor;
-  state$4.hasListener = true;
-};
-const clearEditor = () => {
-  state$4.currentEditor = undefined;
-  state$4.hasListener = false;
-  state$4.isSelecting = false;
-};
-const startSelecting = () => {
-  state$4.isSelecting = true;
-};
-const isSelecting = () => {
-  return state$4.isSelecting;
-};
-
-// @ts-ignore
-const setPosition = position => {
-  state$4.position = position;
-};
-const getEditor$1 = () => {
-  return state$4.currentEditor;
-};
-const getPosition = () => {
-  return state$4.position;
-};
-const hasListener = () => {
-  return state$4.hasListener;
-};
-
 // @ts-ignore
 const handlePointerCaptureLost = editor => {
-  clearEditor();
-  return editor;
+  return {
+    ...editor,
+    hasListener: false,
+    isSelecting: false,
+    selectionAutoMovePosition: {
+      columnIndex: 0,
+      rowIndex: 0
+    }
+  };
 };
 
-const handlePointerDown$1 = (state, button, altKey, ctrlKey, x, y, detail) => {
-  startSelecting();
-  return handleMouseDown(state, button, altKey, ctrlKey, x, y, detail);
+const handlePointerDown$1 = async (state, button, altKey, ctrlKey, x, y, detail) => {
+  return state;
 };
 
 const moveRectangleSelection = (editor, position) => {
@@ -6437,6 +6422,43 @@ const requestAnimationFrame = fn => {
   globalThis.requestAnimationFrame(fn);
 };
 
+const shouldUpdateSelectionData = (oldState, newState) => {
+  return oldState.selections !== newState.selections || oldState.focused !== newState.focused || oldState.minLineY !== newState.minLineY || oldState.maxLineY !== newState.maxLineY || oldState.differences !== newState.differences || oldState.charWidth !== newState.charWidth || oldState.cursorWidth !== newState.cursorWidth || oldState.fontFamily !== newState.fontFamily || oldState.fontSize !== newState.fontSize || oldState.fontWeight !== newState.fontWeight || oldState.isMonospaceFont !== newState.isMonospaceFont || oldState.letterSpacing !== newState.letterSpacing || oldState.lines !== newState.lines || oldState.rowHeight !== newState.rowHeight || oldState.tabSize !== newState.tabSize || oldState.width !== newState.width;
+};
+const shouldUpdateVisibleTextData = (oldState, newState) => {
+  if (oldState.textInfos !== newState.textInfos || oldState.differences !== newState.differences) {
+    return false;
+  }
+  return oldState.lines !== newState.lines || oldState.tokenizerId !== newState.tokenizerId || oldState.minLineY !== newState.minLineY || oldState.maxLineY !== newState.maxLineY || oldState.decorations !== newState.decorations || oldState.embeds !== newState.embeds || oldState.deltaX !== newState.deltaX || oldState.width !== newState.width || oldState.highlightedLine !== newState.highlightedLine || oldState.debugEnabled !== newState.debugEnabled;
+};
+const updateDerivedState = async (oldState, newState) => {
+  let finalState = newState;
+  if (shouldUpdateVisibleTextData(oldState, newState)) {
+    const syncIncremental = getEnabled();
+    const {
+      differences,
+      textInfos
+    } = await getVisible$1(newState, syncIncremental);
+    finalState = {
+      ...newState,
+      differences,
+      textInfos
+    };
+  }
+  if (!shouldUpdateSelectionData(oldState, newState)) {
+    return finalState;
+  }
+  const {
+    cursorInfos,
+    selectionInfos
+  } = await getVisible(finalState);
+  return {
+    ...finalState,
+    cursorInfos,
+    selectionInfos
+  };
+};
+
 const LessThan = -1;
 const Equal = 0;
 const GreaterThan = 1;
@@ -6491,7 +6513,7 @@ const getNewSelections$5 = (anchor, position) => {
 
 // @ts-ignore
 const editorMoveSelection = (editor, position) => {
-  const anchor = getPosition$1();
+  const anchor = editor.selectionAnchorPosition;
   const newSelections = getNewSelections$5(anchor, position);
   // TODO if selection equals previous selection -> do nothing
   return scheduleSelections(editor, newSelections);
@@ -6509,7 +6531,7 @@ const getNewEditor$1 = (editor, position) => {
     const newMinLineY = position.rowIndex;
     const newMaxLineY = position.rowIndex + diff;
     const newDeltaY = position.rowIndex * rowHeight;
-    const anchor = getPosition$1();
+    const anchor = editor.selectionAnchorPosition;
     const newSelections = new Uint32Array([position.rowIndex - 1, position.columnIndex, anchor.rowIndex, anchor.columnIndex]);
     return {
       ...editor,
@@ -6524,7 +6546,7 @@ const getNewEditor$1 = (editor, position) => {
     const newMinLineY = position.rowIndex - diff;
     const newMaxLineY = position.rowIndex;
     const newDeltaY = newMinLineY * rowHeight;
-    const anchor = getPosition$1();
+    const anchor = editor.selectionAnchorPosition;
     const newSelections = new Uint32Array([anchor.rowIndex, anchor.columnIndex, position.rowIndex + 1, position.columnIndex]);
     return {
       ...editor,
@@ -6536,12 +6558,13 @@ const getNewEditor$1 = (editor, position) => {
   }
   return editor;
 };
-const continueScrollingAndMovingSelection = async () => {
-  const editor = getEditor$1();
-  if (!editor) {
+const continueScrollingAndMovingSelection = async editorUid => {
+  const editorState = get$7(editorUid);
+  const editor = editorState?.newState;
+  if (!editor || !editor.hasListener || !editor.isSelecting) {
     return;
   }
-  const position = getPosition();
+  const position = editor.selectionAutoMovePosition;
   if (position.rowIndex === 0) {
     return;
   }
@@ -6549,19 +6572,18 @@ const continueScrollingAndMovingSelection = async () => {
   if (editor === newEditor) {
     return;
   }
-  // await Viewlet.setState(ViewletModuleId.EditorText, newEditor)
-  setEditor(newEditor);
   // @ts-ignore
   const delta = position.rowIndex < editor.minLineY ? -1 : 1;
-  setPosition({
-    columnIndex: position.columnIndex,
-    rowIndex: position.rowIndex + delta
-  });
-  requestAnimationFrame(continueScrollingAndMovingSelection);
-  // TODO get editor state
-  // if editor is disposed, return and remove animation frame
-  // on cursor up, remove animation frame
-  //
+  const nextEditor = {
+    ...newEditor,
+    selectionAutoMovePosition: {
+      columnIndex: position.columnIndex,
+      rowIndex: position.rowIndex + delta
+    }
+  };
+  const newEditorWithDerivedState = await updateDerivedState(editor, nextEditor);
+  set$8(editor.uid, editor, newEditorWithDerivedState);
+  requestAnimationFrame(() => continueScrollingAndMovingSelection(editorUid));
 };
 
 // @ts-ignore
@@ -6570,16 +6592,20 @@ const moveSelectionPx = async (editor, x, y) => {
   number(x);
   number(y);
   const position = await at(editor, x, y);
-  if (!hasListener() && (position.rowIndex < editor.minLineY || position.rowIndex > editor.maxLineY)) {
-    requestAnimationFrame(continueScrollingAndMovingSelection);
-    setEditor(editor);
-    setPosition(position);
+  const newEditor = editorMoveSelection(editor, position);
+  if (!editor.hasListener && (position.rowIndex < editor.minLineY || position.rowIndex > editor.maxLineY)) {
+    requestAnimationFrame(() => continueScrollingAndMovingSelection(editor.uid));
+    return {
+      ...newEditor,
+      hasListener: true,
+      selectionAutoMovePosition: position
+    };
   }
-  return editorMoveSelection(editor, position);
+  return newEditor;
 };
 
 const handlePointerMove = async (editor, x, y, altKey) => {
-  if (!isSelecting()) {
+  if (!editor.isSelecting) {
     return editor;
   }
   if (altKey) {
@@ -6589,8 +6615,15 @@ const handlePointerMove = async (editor, x, y, altKey) => {
 };
 
 const handlePointerUp = editor => {
-  clearEditor();
-  return editor;
+  return {
+    ...editor,
+    hasListener: false,
+    isSelecting: false,
+    selectionAutoMovePosition: {
+      columnIndex: 0,
+      rowIndex: 0
+    }
+  };
 };
 
 // @ts-ignore
@@ -9991,43 +10024,6 @@ const unsetAdditionalFocus = async focusKey => {
   await invoke$b('Focus.removeAdditionalFocus', focusKey);
 };
 
-const shouldUpdateSelectionData = (oldState, newState) => {
-  return oldState.selections !== newState.selections || oldState.focused !== newState.focused || oldState.minLineY !== newState.minLineY || oldState.maxLineY !== newState.maxLineY || oldState.differences !== newState.differences || oldState.charWidth !== newState.charWidth || oldState.cursorWidth !== newState.cursorWidth || oldState.fontFamily !== newState.fontFamily || oldState.fontSize !== newState.fontSize || oldState.fontWeight !== newState.fontWeight || oldState.isMonospaceFont !== newState.isMonospaceFont || oldState.letterSpacing !== newState.letterSpacing || oldState.lines !== newState.lines || oldState.rowHeight !== newState.rowHeight || oldState.tabSize !== newState.tabSize || oldState.width !== newState.width;
-};
-const shouldUpdateVisibleTextData = (oldState, newState) => {
-  if (oldState.textInfos !== newState.textInfos || oldState.differences !== newState.differences) {
-    return false;
-  }
-  return oldState.lines !== newState.lines || oldState.tokenizerId !== newState.tokenizerId || oldState.minLineY !== newState.minLineY || oldState.maxLineY !== newState.maxLineY || oldState.decorations !== newState.decorations || oldState.embeds !== newState.embeds || oldState.deltaX !== newState.deltaX || oldState.width !== newState.width || oldState.highlightedLine !== newState.highlightedLine || oldState.debugEnabled !== newState.debugEnabled;
-};
-const updateDerivedState = async (oldState, newState) => {
-  let finalState = newState;
-  if (shouldUpdateVisibleTextData(oldState, newState)) {
-    const syncIncremental = getEnabled();
-    const {
-      differences,
-      textInfos
-    } = await getVisible$1(newState, syncIncremental);
-    finalState = {
-      ...newState,
-      differences,
-      textInfos
-    };
-  }
-  if (!shouldUpdateSelectionData(oldState, newState)) {
-    return finalState;
-  }
-  const {
-    cursorInfos,
-    selectionInfos
-  } = await getVisible(finalState);
-  return {
-    ...finalState,
-    cursorInfos,
-    selectionInfos
-  };
-};
-
 const FocusEditor = 12;
 const FocusEditorCompletions = 9;
 const FocusEditorRename = 11;
@@ -11111,11 +11107,13 @@ const registerListener = (listenerType, rpcId) => {
   registerListener$1(listenerType, rpcId);
 };
 
-const getCss = (rowHeight, scrollBarHeight, scrollBarTop) => {
+const getCss = (rowHeight, scrollBarHeight, scrollBarTop, scrollBarWidth, scrollBarLeft) => {
   return `.Editor {
   --EditorRowHeight: ${rowHeight}px;
   --ScrollBarHeight: ${scrollBarHeight}px;
   --ScrollBarTop: ${scrollBarTop}px;
+  --ScrollBarWidth: ${scrollBarWidth}px;
+  --ScrollBarLeft: ${scrollBarLeft}px;
 }
 .Editor .EditorRow {
   height: var(--EditorRowHeight);
@@ -11125,25 +11123,42 @@ const getCss = (rowHeight, scrollBarHeight, scrollBarTop) => {
   height: var(--ScrollBarHeight);
   translate: 0px var(--ScrollBarTop);
 }
+.Editor .ScrollBarThumbHorizontal {
+  width: var(--ScrollBarWidth);
+  translate: var(--ScrollBarLeft) 0px;
+}
 `;
 };
 
-const renderCss = (oldState, newState) => {
+const getScrollBarLeft = (deltaX, longestLineWidth, width) => {
+  const scrollBarLeft = deltaX / longestLineWidth * width;
+  if (!Number.isFinite(scrollBarLeft)) {
+    return 0;
+  }
+  return scrollBarLeft;
+};
+const renderCss$1 = (oldState, newState) => {
   const {
+    deltaX,
     deltaY,
     finalDeltaY,
     height,
+    longestLineWidth,
+    minimumSliderSize,
     rowHeight,
     scrollBarHeight,
-    uid
+    uid,
+    width
   } = newState;
   const scrollBarTop = getScrollBarY(deltaY, finalDeltaY, height, scrollBarHeight);
-  const css = getCss(rowHeight, scrollBarHeight, scrollBarTop);
+  const scrollBarWidth = getScrollBarSize(width, longestLineWidth, minimumSliderSize);
+  const scrollBarLeft = getScrollBarLeft(deltaX, longestLineWidth, width);
+  const css = getCss(rowHeight, scrollBarHeight, scrollBarTop, scrollBarWidth, scrollBarLeft);
   return [SetCss$1, uid, css];
 };
 
 const renderFocus$2 = (oldState, newState) => {
-  const selector = '.EditorInput';
+  const selector = '.EditorInput textarea';
   return [FocusSelector, newState.uid, selector];
 };
 
@@ -11414,6 +11429,10 @@ const diffTree = (oldNodes, newNodes) => {
 
 const getEditorInputVirtualDom = () => {
   return [{
+    childCount: 1,
+    className: 'EditorInput',
+    type: Div
+  }, {
     ariaAutoComplete: 'list',
     ariaMultiLine: 'true',
     ariaRoleDescription: 'editor',
@@ -11421,7 +11440,6 @@ const getEditorInputVirtualDom = () => {
     autocomplete: 'off',
     autocorrect: 'off',
     childCount: 0,
-    className: 'EditorInput',
     name: 'editor',
     onBeforeInput: HandleBeforeInput,
     onBlur: HandleBlur,
@@ -11595,8 +11613,7 @@ const getEditorScrollBarDiagnosticsVirtualDom = scrollBarDiagnostics => {
   }, ...getDiagnosticsVirtualDom([...scrollBarDiagnostics])];
 };
 
-const getScrollBarVirtualDom = (deltaY, finalDeltaY, height, scrollBarHeight) => {
-  const scrollBarY = getScrollBarY(deltaY, finalDeltaY, height, scrollBarHeight);
+const getScrollBarVirtualDom = () => {
   return [{
     childCount: 1,
     className: 'ScrollBar ScrollBarVertical',
@@ -11606,8 +11623,6 @@ const getScrollBarVirtualDom = (deltaY, finalDeltaY, height, scrollBarHeight) =>
   }, {
     childCount: 0,
     className: 'ScrollBarThumb ScrollBarThumbVertical',
-    style: `height:${scrollBarHeight}px;`,
-    translate: `0 ${scrollBarY}px`,
     type: Div
   }, {
     childCount: 1,
@@ -11623,15 +11638,11 @@ const getScrollBarVirtualDom = (deltaY, finalDeltaY, height, scrollBarHeight) =>
 
 const getEditorContentVirtualDom = ({
   cursorInfos = [],
-  deltaY = 0,
   diagnostics = [],
   differences,
-  finalDeltaY = 0,
-  height = 0,
   highlightedLine = -1,
   lineNumbers = true,
   scrollBarDiagnostics = [],
-  scrollBarHeight = 0,
   selectionInfos = [],
   textInfos
 }) => {
@@ -11640,7 +11651,7 @@ const getEditorContentVirtualDom = ({
     className: 'EditorContent',
     onMouseMove: HandleMouseMove,
     type: Div
-  }, ...getEditorInputVirtualDom(), ...getEditorLayersVirtualDom(selectionInfos, textInfos, differences, lineNumbers, highlightedLine, cursorInfos, diagnostics), ...getEditorScrollBarDiagnosticsVirtualDom(scrollBarDiagnostics), ...getScrollBarVirtualDom(deltaY, finalDeltaY, height, scrollBarHeight)];
+  }, ...getEditorInputVirtualDom(), ...getEditorLayersVirtualDom(selectionInfos, textInfos, differences, lineNumbers, highlightedLine, cursorInfos, diagnostics), ...getEditorScrollBarDiagnosticsVirtualDom(scrollBarDiagnostics), ...getScrollBarVirtualDom()];
 };
 
 const getGutterInfoVirtualDom = gutterInfo => {
@@ -11666,36 +11677,29 @@ const getEditorGutterVirtualDom = gutterInfos => {
 
 const getEditorVirtualDom = ({
   cursorInfos = [],
-  deltaY = 0,
   diagnostics = [],
   differences,
-  finalDeltaY = 0,
   gutterInfos = [],
-  height = 0,
   highlightedLine = -1,
   lineNumbers = true,
   scrollBarDiagnostics = [],
-  scrollBarHeight = 0,
   selectionInfos = [],
   textInfos
 }) => {
+  const gutterDom = lineNumbers ? getEditorGutterVirtualDom(gutterInfos) : [];
   return [{
-    childCount: 2,
+    childCount: lineNumbers ? 2 : 1,
     className: 'Viewlet Editor',
     onContextMenu: HandleContextMenu,
     role: 'code',
     type: Div
-  }, ...getEditorGutterVirtualDom(gutterInfos), ...getEditorContentVirtualDom({
+  }, ...gutterDom, ...getEditorContentVirtualDom({
     cursorInfos,
-    deltaY,
     diagnostics,
     differences,
-    finalDeltaY,
-    height,
     highlightedLine,
     lineNumbers,
     scrollBarDiagnostics,
-    scrollBarHeight,
     selectionInfos,
     textInfos
   })];
@@ -11743,7 +11747,7 @@ const renderIncremental = (oldState, newState) => {
 const getRenderer = diffType => {
   switch (diffType) {
     case RenderCss:
-      return renderCss;
+      return renderCss$1;
     case RenderFocus:
       return renderFocus$2;
     case RenderFocusContext:
@@ -11834,22 +11838,9 @@ const renderSelections = {
   },
   isEqual: (oldState, newState) => oldState.cursorInfos === newState.cursorInfos && oldState.selectionInfos === newState.selectionInfos
 };
-const renderScrollBarY = {
-  apply(oldState, newState) {
-    const scrollBarY = getScrollBarY(newState.deltaY, newState.finalDeltaY, newState.height, newState.scrollBarHeight);
-    const translate = `0 ${scrollBarY}px`;
-    const heightPx = `${newState.scrollBarHeight}px`;
-    return [/* method */'setScrollBar', translate, heightPx];
-  },
-  isEqual: (oldState, newState) => oldState.deltaY === newState.deltaY && oldState.scrollBarHeight === newState.scrollBarHeight
-};
-const renderScrollBarX = {
-  apply(oldState, newState) {
-    const scrollBarWidth = getScrollBarSize(newState.width, newState.longestLineWidth, newState.minimumSliderSize);
-    const scrollBarX = newState.deltaX / newState.longestLineWidth * newState.width;
-    return [/* method */'setScrollBarHorizontal', /* scrollBarX */scrollBarX, /* scrollBarWidth */scrollBarWidth, /* deltaX */newState.deltaX];
-  },
-  isEqual: (oldState, newState) => oldState.longestLineWidth === newState.longestLineWidth && oldState.deltaX === newState.deltaX
+const renderCss = {
+  apply: renderCss$1,
+  isEqual: isEqual$2
 };
 const renderFocus$1 = {
   apply: (oldState, newState) => [/* method */'setFocused', newState.focused],
@@ -11882,16 +11873,17 @@ const renderGutterInfo = {
       maxLineY,
       minLineY
     } = newState;
+    if (!lineNumbers) {
+      return [];
+    }
     const gutterInfos = [];
-    if (lineNumbers) {
-      for (let i = minLineY; i < maxLineY; i++) {
-        gutterInfos.push(i + 1);
-      }
+    for (let i = minLineY; i < maxLineY; i++) {
+      gutterInfos.push(i + 1);
     }
     const dom = getEditorGutterVirtualDom$1(gutterInfos);
     return ['renderGutter', dom];
   },
-  isEqual: (oldState, newState) => oldState.minLineY === newState.minLineY && oldState.maxLineY === newState.maxLineY
+  isEqual: (oldState, newState) => oldState.lineNumbers === newState.lineNumbers && oldState.minLineY === newState.minLineY && oldState.maxLineY === newState.maxLineY
 };
 const renderWidgets = {
   apply(oldState, newState) {
@@ -11948,7 +11940,7 @@ const renderWidgets = {
   isEqual: (oldState, newState) => oldState.widgets === newState.widgets,
   multiple: true
 };
-const render$6 = [renderLines, renderSelections, renderScrollBarX, renderScrollBarY, renderFocus$1, renderDecorations, renderGutterInfo, renderWidgets, renderFocusContext, renderAdditionalFocusContext];
+const render$6 = [renderLines, renderSelections, renderCss, renderFocus$1, renderDecorations, renderGutterInfo, renderWidgets, renderFocusContext, renderAdditionalFocusContext];
 const renderEditor = async id => {
   const instance = get$7(id);
   if (!instance) {