@lvce-editor/editor-worker 18.11.0 → 18.13.0

package/dist/editorWorkerMain.js

@@ -1229,7 +1229,6 @@ const SetFocusContext$1 = 'Viewlet.setFocusContext';
 const SetPatches = 'Viewlet.setPatches';
 
 const FocusEditorText$1 = 12;
-const FocusExplorer = 13;
 
 const {
   invoke: invoke$f,
@@ -1572,7 +1571,6 @@ const editorStates = create$9();
 const {
   getCommandIds,
   registerCommands,
-  wrapCommand,
   wrapGetter
 } = editorStates;
 const get$6 = id => {
@@ -1607,6 +1605,7 @@ const createEditor2 = (id, uri, x, y, width, height, platform, assetDir) => {
     completionState: '',
     completionTriggerCharacters: [],
     completionUid: 0,
+    cursorInfos: [],
     cursorWidth: 2,
     debugEnabled: false,
     decorations: [],
@@ -1655,6 +1654,7 @@ const createEditor2 = (id, uri, x, y, width, height, platform, assetDir) => {
     savedSelections: [],
     scrollBarHeight: 0,
     scrollBarWidth: 0,
+    selectionInfos: [],
     selections: new Uint32Array(),
     tabSize: 0,
     textInfos: [],
@@ -3666,6 +3666,7 @@ const setText$1 = (editor, text) => {
 };
 
 const emptyEditor = {
+  cursorInfos: [],
   debugEnabled: false,
   decorations: [],
   deltaX: 0,
@@ -3685,6 +3686,7 @@ const emptyEditor = {
   maxLineY: 0,
   minLineY: 0,
   scrollBarHeight: 0,
+  selectionInfos: [],
   selections: new Uint32Array(),
   textInfos: [],
   tokenizerId: 0,
@@ -3973,6 +3975,7 @@ const createEditor = async ({
     completionState: '',
     completionTriggerCharacters,
     completionUid: 0,
+    cursorInfos: [],
     cursorWidth: 2,
     decorations: [],
     deltaX: 0,
@@ -4016,6 +4019,7 @@ const createEditor = async ({
     savedSelections,
     scrollBarHeight: 0,
     scrollBarWidth: 0,
+    selectionInfos: [],
     selections: new Uint32Array(),
     tabSize,
     textInfos: [],
@@ -4089,7 +4093,7 @@ const isEqual$1 = (oldState, newState) => {
 };
 
 const isEqual = (oldState, newState) => {
-  return oldState.lines === newState.lines && oldState.textInfos === newState.textInfos && oldState.differences === newState.differences && oldState.initial === newState.initial;
+  return oldState.lines === newState.lines && oldState.textInfos === newState.textInfos && oldState.differences === newState.differences && oldState.initial === newState.initial && oldState.selections === newState.selections;
 };
 
 const RenderFocus = 6;
@@ -6337,6 +6341,210 @@ const handlePointerCaptureLost = editor => {
   return editor;
 };
 
+const handlePointerDown$1 = (state, button, altKey, ctrlKey, x, y, detail) => {
+  const modifier = 0;
+  const clickDetail = Single; // TODO
+  // console.log({ detail })
+  switch (clickDetail) {
+    case Double:
+      return handleDoubleClick(state, modifier, x, y);
+    case Single:
+      return handleSingleClick(state, modifier, x, y);
+    case Triple:
+      return handleTripleClick(state, modifier, x, y);
+    default:
+      return state;
+  }
+};
+
+const moveRectangleSelection = (editor, position) => {
+  // @ts-ignore
+  // const anchor = EditorMoveSelection.state.position
+  // const startRowIndex = anchor.rowIndex
+  // const startColumnIndex = anchor.columnIndex
+  // const endRowIndex = position.rowIndex
+  // const endColumnIndex = position.columnIndex
+  // const selectionEdits: any[] = []
+  // for (let i = startRowIndex; i <= endRowIndex; i++) {
+  //   selectionEdits.push({
+  //     start: {
+  //       rowIndex: i,
+  //       columnIndex: startColumnIndex,
+  //     },
+  //     end: {
+  //       rowIndex: i,
+  //       columnIndex: endColumnIndex,
+  //     },
+  //   })
+  // }
+  // // @ts-ignore
+  // const cursorEdits = [selectionEdits.at(-1).end]
+  // // @ts-ignore
+  // Editor.scheduleCursorsAndSelections(editor, cursorEdits, selectionEdits)
+  return editor;
+};
+
+// @ts-ignore
+const moveRectangleSelectionPx = async (editor, x, y) => {
+  await at(editor, x, y);
+};
+
+const requestAnimationFrame = fn => {
+  globalThis.requestAnimationFrame(fn);
+};
+
+const LessThan = -1;
+const Equal = 0;
+const GreaterThan = 1;
+
+// @ts-ignore
+
+// @ts-ignore
+const compare = (positionA, positionB) => {
+  if (positionA.rowIndex > positionB.rowIndex) {
+    return GreaterThan;
+  }
+  if (positionA.rowIndex === positionB.rowIndex) {
+    if (positionA.columnIndex > positionB.columnIndex) {
+      return GreaterThan;
+    }
+    if (positionA.columnIndex < positionB.columnIndex) {
+      return LessThan;
+    }
+    return Equal;
+  }
+  return LessThan;
+};
+
+// @ts-ignore
+const editorMoveSelectionBackwards = (anchor, position) => {
+  return new Uint32Array([anchor.rowIndex, anchor.columnIndex, position.rowIndex, position.columnIndex]);
+};
+
+// @ts-ignore
+const editorMoveSelectionEqual = (anchor, position) => {
+  return new Uint32Array([position.rowIndex, position.columnIndex, position.rowIndex, position.columnIndex]);
+};
+
+// @ts-ignore
+const editorMoveSelectionForwards = (anchor, position) => {
+  return new Uint32Array([anchor.rowIndex, anchor.columnIndex, position.rowIndex, position.columnIndex]);
+};
+
+// @ts-ignore
+const getNewSelections$5 = (anchor, position) => {
+  switch (compare(position, anchor)) {
+    case Equal:
+      return editorMoveSelectionEqual(anchor, position);
+    case GreaterThan:
+      return editorMoveSelectionForwards(anchor, position);
+    case LessThan:
+      return editorMoveSelectionBackwards(anchor, position);
+    default:
+      throw new Error('unexpected comparison result');
+  }
+};
+
+// @ts-ignore
+const editorMoveSelection = (editor, position) => {
+  const anchor = getPosition$1();
+  const newSelections = getNewSelections$5(anchor, position);
+  // TODO if selection equals previous selection -> do nothing
+  return scheduleSelections(editor, newSelections);
+};
+
+// @ts-ignore
+const getNewEditor$1 = (editor, position) => {
+  const {
+    maxLineY,
+    minLineY,
+    rowHeight
+  } = editor;
+  const diff = maxLineY - minLineY;
+  if (position.rowIndex < minLineY) {
+    const newMinLineY = position.rowIndex;
+    const newMaxLineY = position.rowIndex + diff;
+    const newDeltaY = position.rowIndex * rowHeight;
+    const anchor = getPosition$1();
+    const newSelections = new Uint32Array([position.rowIndex - 1, position.columnIndex, anchor.rowIndex, anchor.columnIndex]);
+    return {
+      ...editor,
+      deltaY: newDeltaY,
+      maxLineY: newMaxLineY,
+      minLineY: newMinLineY,
+      selections: newSelections
+    };
+  }
+  if (position.rowIndex > maxLineY) {
+    const diff = maxLineY - minLineY;
+    const newMinLineY = position.rowIndex - diff;
+    const newMaxLineY = position.rowIndex;
+    const newDeltaY = newMinLineY * rowHeight;
+    const anchor = getPosition$1();
+    const newSelections = new Uint32Array([anchor.rowIndex, anchor.columnIndex, position.rowIndex + 1, position.columnIndex]);
+    return {
+      ...editor,
+      deltaY: newDeltaY,
+      maxLineY: newMaxLineY,
+      minLineY: newMinLineY,
+      selections: newSelections
+    };
+  }
+  return editor;
+};
+const continueScrollingAndMovingSelection = async () => {
+  const editor = getEditor$1();
+  if (!editor) {
+    return;
+  }
+  const position = getPosition();
+  if (position.rowIndex === 0) {
+    return;
+  }
+  const newEditor = getNewEditor$1(editor, position);
+  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
+  //
+};
+
+// @ts-ignore
+const moveSelectionPx = async (editor, x, y) => {
+  object(editor);
+  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);
+  }
+  return editorMoveSelection(editor, position);
+};
+
+const handlePointerMove = (editor, x, y, altKey) => {
+  if (altKey) {
+    return moveRectangleSelectionPx(editor, x, y);
+  }
+  return moveSelectionPx(editor, x, y);
+};
+
+const handlePointerUp = editor => {
+  return editor;
+};
+
 // @ts-ignore
 
 // @ts-ignore
@@ -6738,183 +6946,6 @@ const insertLineBreak = async editor => {
   return scheduleDocumentAndCursorsSelections(editor, changes, selectionChanges);
 };
 
-const moveRectangleSelection = (editor, position) => {
-  // @ts-ignore
-  // const anchor = EditorMoveSelection.state.position
-  // const startRowIndex = anchor.rowIndex
-  // const startColumnIndex = anchor.columnIndex
-  // const endRowIndex = position.rowIndex
-  // const endColumnIndex = position.columnIndex
-  // const selectionEdits: any[] = []
-  // for (let i = startRowIndex; i <= endRowIndex; i++) {
-  //   selectionEdits.push({
-  //     start: {
-  //       rowIndex: i,
-  //       columnIndex: startColumnIndex,
-  //     },
-  //     end: {
-  //       rowIndex: i,
-  //       columnIndex: endColumnIndex,
-  //     },
-  //   })
-  // }
-  // // @ts-ignore
-  // const cursorEdits = [selectionEdits.at(-1).end]
-  // // @ts-ignore
-  // Editor.scheduleCursorsAndSelections(editor, cursorEdits, selectionEdits)
-  return editor;
-};
-
-// @ts-ignore
-const moveRectangleSelectionPx = async (editor, x, y) => {
-  await at(editor, x, y);
-};
-
-const LessThan = -1;
-const Equal = 0;
-const GreaterThan = 1;
-
-// @ts-ignore
-
-// @ts-ignore
-const compare = (positionA, positionB) => {
-  if (positionA.rowIndex > positionB.rowIndex) {
-    return GreaterThan;
-  }
-  if (positionA.rowIndex === positionB.rowIndex) {
-    if (positionA.columnIndex > positionB.columnIndex) {
-      return GreaterThan;
-    }
-    if (positionA.columnIndex < positionB.columnIndex) {
-      return LessThan;
-    }
-    return Equal;
-  }
-  return LessThan;
-};
-
-// @ts-ignore
-const editorMoveSelectionBackwards = (anchor, position) => {
-  return new Uint32Array([anchor.rowIndex, anchor.columnIndex, position.rowIndex, position.columnIndex]);
-};
-
-// @ts-ignore
-const editorMoveSelectionEqual = (anchor, position) => {
-  return new Uint32Array([position.rowIndex, position.columnIndex, position.rowIndex, position.columnIndex]);
-};
-
-// @ts-ignore
-const editorMoveSelectionForwards = (anchor, position) => {
-  return new Uint32Array([anchor.rowIndex, anchor.columnIndex, position.rowIndex, position.columnIndex]);
-};
-
-// @ts-ignore
-const getNewSelections$5 = (anchor, position) => {
-  switch (compare(position, anchor)) {
-    case Equal:
-      return editorMoveSelectionEqual(anchor, position);
-    case GreaterThan:
-      return editorMoveSelectionForwards(anchor, position);
-    case LessThan:
-      return editorMoveSelectionBackwards(anchor, position);
-    default:
-      throw new Error('unexpected comparison result');
-  }
-};
-
-// @ts-ignore
-const editorMoveSelection = (editor, position) => {
-  const anchor = getPosition$1();
-  const newSelections = getNewSelections$5(anchor, position);
-  // TODO if selection equals previous selection -> do nothing
-  return scheduleSelections(editor, newSelections);
-};
-
-const requestAnimationFrame = fn => {
-  globalThis.requestAnimationFrame(fn);
-};
-
-// @ts-ignore
-const getNewEditor$1 = (editor, position) => {
-  const {
-    maxLineY,
-    minLineY,
-    rowHeight
-  } = editor;
-  const diff = maxLineY - minLineY;
-  if (position.rowIndex < minLineY) {
-    const newMinLineY = position.rowIndex;
-    const newMaxLineY = position.rowIndex + diff;
-    const newDeltaY = position.rowIndex * rowHeight;
-    const anchor = getPosition$1();
-    const newSelections = new Uint32Array([position.rowIndex - 1, position.columnIndex, anchor.rowIndex, anchor.columnIndex]);
-    return {
-      ...editor,
-      deltaY: newDeltaY,
-      maxLineY: newMaxLineY,
-      minLineY: newMinLineY,
-      selections: newSelections
-    };
-  }
-  if (position.rowIndex > maxLineY) {
-    const diff = maxLineY - minLineY;
-    const newMinLineY = position.rowIndex - diff;
-    const newMaxLineY = position.rowIndex;
-    const newDeltaY = newMinLineY * rowHeight;
-    const anchor = getPosition$1();
-    const newSelections = new Uint32Array([anchor.rowIndex, anchor.columnIndex, position.rowIndex + 1, position.columnIndex]);
-    return {
-      ...editor,
-      deltaY: newDeltaY,
-      maxLineY: newMaxLineY,
-      minLineY: newMinLineY,
-      selections: newSelections
-    };
-  }
-  return editor;
-};
-const continueScrollingAndMovingSelection = async () => {
-  const editor = getEditor$1();
-  if (!editor) {
-    return;
-  }
-  const position = getPosition();
-  if (position.rowIndex === 0) {
-    return;
-  }
-  const newEditor = getNewEditor$1(editor, position);
-  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
-  //
-};
-
-// @ts-ignore
-const moveSelectionPx = async (editor, x, y) => {
-  object(editor);
-  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);
-  }
-  return editorMoveSelection(editor, position);
-};
-
 const Script = 2;
 const Unknown$1 = 0;
 
@@ -9520,23 +9551,34 @@ const InputBox = 'InputBox';
 const MaskIcon = 'MaskIcon';
 const Viewlet = 'Viewlet';
 
-const HandleBeforeInput = 'handleBeforeInput';
-const HandleBlur = 'handleBlur';
-const HandleClose = 'handleClose';
-const HandleCompositionEnd = 'handleCompositionEnd';
-const HandleCompositionStart = 'handleCompositionStart';
-const HandleCompositionUpdate = 'handleCompositionUpdate';
-const HandleContextMenu = 'handleContextMenu';
-const HandleCut = 'handleCut';
-const HandleFocus = 'handleFocus';
-const HandleMouseMove = 'handleMouseMove';
-const HandleSashPointerDown = 'handleSashPointerDown';
-const HandleWheel = 'handleWheel';
+const HandleBeforeInput = 1;
+const HandleBlur = 2;
+const HandleClose = 9;
+const HandleCompositionEnd = 10;
+const HandleCompositionStart = 11;
+const HandleCompositionUpdate = 12;
+const HandleContextMenu = 13;
+const HandleCut = 14;
+const HandleFocus = 15;
+const HandleMouseMove = 19;
+const HandlePaste = 20;
+const HandlePointerDown = 21;
+const HandlePointerMove = 22;
+const HandlePointerUp = 23;
+const HandleSashPointerDown = 26;
+const HandleScrollBarHorizontalPointerDown = 27;
+const HandleScrollBarHorizontalPointerMove = 28;
+const HandleScrollBarHorizontalPointerUp = 29;
+const HandleScrollBarVerticalPointerDown = 30;
+const HandleScrollBarVerticalPointerMove = 31;
+const HandleScrollBarVerticalPointerUp = 32;
+const HandleWheel = 33;
 
 const Div = 4;
 const Input = 6;
 const Span = 8;
 const Text = 12;
+const TextArea = 62;
 
 const text = data => {
   return {
@@ -9855,6 +9897,24 @@ const unsetAdditionalFocus = async focusKey => {
   await invoke$c('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 updateDerivedState = async (oldState, newState) => {
+  if (!shouldUpdateSelectionData(oldState, newState)) {
+    return newState;
+  }
+  const {
+    cursorInfos,
+    selectionInfos
+  } = await getVisible(newState);
+  return {
+    ...newState,
+    cursorInfos,
+    selectionInfos
+  };
+};
+
 const FocusEditor = 12;
 const FocusEditorCompletions = 9;
 const FocusEditorRename = 11;
@@ -9916,13 +9976,14 @@ const getSelections2 = editorUid => {
   } = editor;
   return selections;
 };
-const setSelections2 = (editorUid, selections) => {
+const setSelections2 = async (editorUid, selections) => {
   const editor = getEditor(editorUid);
   const newEditor = {
     ...editor,
     selections
   };
-  set$7(editorUid, editor, newEditor);
+  const newEditorWithDerivedState = await updateDerivedState(editor, newEditor);
+  set$7(editorUid, editor, newEditorWithDerivedState);
 };
 const closeWidget2 = async (editorUid, widgetId, widgetName, unsetAdditionalFocus$1) => {
   const editor = getEditor(editorUid);
@@ -9941,7 +10002,8 @@ const closeWidget2 = async (editorUid, widgetId, widgetName, unsetAdditionalFocu
     focused: true,
     widgets: newWidgets
   };
-  set$7(editorUid, editor, newEditor);
+  const newEditorWithDerivedState = await updateDerivedState(editor, newEditor);
+  set$7(editorUid, editor, newEditorWithDerivedState);
   await setFocus(FocusEditorText);
   if (unsetAdditionalFocus$1) {
     await unsetAdditionalFocus(unsetAdditionalFocus$1);
@@ -9953,7 +10015,8 @@ const closeFind2 = async editorUid => {
 const applyEdits2 = async (editorUid, edits) => {
   const editor = getEditor(editorUid);
   const newEditor = await applyEdit(editor, edits);
-  set$7(editorUid, editor, newEditor);
+  const newEditorWithDerivedState = await updateDerivedState(editor, newEditor);
+  set$7(editorUid, editor, newEditorWithDerivedState);
 };
 const getSourceActions = async editorUid => {
   const actions = await getEditorSourceActions(editorUid);
@@ -11026,7 +11089,7 @@ const renderFocus$2 = (oldState, newState) => {
 };
 
 const renderFocusContext$1 = (oldState, newState) => {
-  return [SetFocusContext$1, newState.uid, FocusExplorer];
+  return [SetFocusContext$1, newState.uid, FocusEditorText$1];
 };
 
 const SetText = 1;
@@ -11412,6 +11475,29 @@ const getEditorRowsVirtualDom = (textInfos, differences, lineNumbers = true, hig
   return dom;
 };
 
+const getScrollBarVirtualDom = () => {
+  return [{
+    childCount: 1,
+    className: 'ScrollBar ScrollBarVertical',
+    onContextMenu: HandleContextMenu,
+    onPointerDown: HandleScrollBarVerticalPointerDown,
+    type: Div
+  }, {
+    childCount: 0,
+    className: 'ScrollBarThumb ScrollBarThumbVertical',
+    type: Div
+  }, {
+    childCount: 1,
+    className: 'ScrollBar ScrollBarHorizontal',
+    onPointerDown: HandleScrollBarHorizontalPointerDown,
+    type: Div
+  }, {
+    childCount: 0,
+    className: 'ScrollBarThumb ScrollBarThumbHorizontal',
+    type: Div
+  }];
+};
+
 const getSelectionsVirtualDom = selections => {
   const dom = [];
   for (let i = 0; i < selections.length; i += 4) {
@@ -11452,9 +11538,12 @@ const getEditorVirtualDom = ({
   const diagnosticsDom = getDiagnosticsVirtualDom(diagnosticsArray);
   const gutterDom = getEditorGutterVirtualDom(gutterInfosArray);
   const scrollBarDiagnosticsDom = getDiagnosticsVirtualDom(scrollBarDiagnosticsArray);
+  const scrollBarDom = getScrollBarVirtualDom();
   return [{
     childCount: 2,
     className: 'Viewlet Editor',
+    onContextMenu: HandleContextMenu,
+    onWheel: HandleWheel,
     role: 'code',
     type: Div
   }, {
@@ -11462,9 +11551,32 @@ const getEditorVirtualDom = ({
     className: 'Gutter',
     type: Div
   }, ...gutterDom, {
-    childCount: 4,
+    childCount: 5,
     className: 'EditorContent',
+    onMouseMove: HandleMouseMove,
     type: Div
+  }, {
+    ariaAutoComplete: 'list',
+    ariaMultiLine: 'true',
+    ariaRoleDescription: 'editor',
+    autocapitalize: 'off',
+    autocomplete: 'off',
+    autocorrect: 'off',
+    childCount: 0,
+    className: 'EditorInput',
+    name: 'editor',
+    onBeforeInput: HandleBeforeInput,
+    onBlur: HandleBlur,
+    onCompositionEnd: HandleCompositionEnd,
+    onCompositionStart: HandleCompositionStart,
+    onCompositionUpdate: HandleCompositionUpdate,
+    onCut: HandleCut,
+    onFocus: HandleFocus,
+    onPaste: HandlePaste,
+    role: 'textbox',
+    spellcheck: false,
+    type: TextArea,
+    wrap: 'off'
   }, {
     childCount: 4,
     className: 'EditorLayers',
@@ -11476,6 +11588,8 @@ const getEditorVirtualDom = ({
   }, ...selectionsDom, {
     childCount: textInfos.length,
     className: 'EditorRows',
+    // onMouseDown: DomEventListenerFunctions.HandleMouseDown,
+    onPointerDown: HandlePointerDown,
     type: Div
   }, ...rowsDom, {
     childCount: cursorsDom.length,
@@ -11489,27 +11603,15 @@ const getEditorVirtualDom = ({
     childCount: scrollBarDiagnosticsDom.length,
     className: 'EditorScrollBarDiagnostics',
     type: Div
-  }, ...scrollBarDiagnosticsDom, {
-    childCount: 1,
-    className: 'ScrollBar ScrollBarVertical',
-    type: Div
-  }, {
-    childCount: 0,
-    className: 'ScrollBarThumb ScrollBarThumbVertical',
-    type: Div
-  }, {
-    childCount: 1,
-    className: 'ScrollBar ScrollBarHorizontal',
-    type: Div
-  }, {
-    childCount: 0,
-    className: 'ScrollBarThumb ScrollBarThumbHorizontal',
-    type: Div
-  }];
+  }, ...scrollBarDiagnosticsDom, ...scrollBarDom];
 };
 
 const getDom = state => {
-  if (state.initial && state.textInfos.length === 0) {
+  const {
+    initial,
+    textInfos
+  } = state;
+  if (initial && textInfos.length === 0) {
     return [];
   }
   return getEditorVirtualDom(state);
@@ -11606,17 +11708,17 @@ const renderLines = {
   }
 };
 const renderSelections = {
-  apply: async (oldState, newState) => {
+  apply: (oldState, newState) => {
     const {
-      cursorInfos,
-      selectionInfos
-    } = await getVisible(newState);
+      cursorInfos = [],
+      selectionInfos = []
+    } = newState;
     const cursorsDom = getCursorsVirtualDom(cursorInfos);
     const selectionsDom = getSelectionsVirtualDom(selectionInfos);
     return [/* method */'setSelections', cursorsDom, selectionsDom];
   },
   isEqual(oldState, newState) {
-    return oldState.selections === newState.selections && oldState.focused === newState.focused && oldState.minLineY === newState.minLineY && oldState.deltaX === newState.deltaX;
+    return oldState.cursorInfos === newState.cursorInfos && oldState.selectionInfos === newState.selectionInfos;
   }
 };
 const renderScrollBarY = {
@@ -11785,13 +11887,14 @@ const renderEventListeners = () => {
     params: ['handleFocus']
   }, {
     name: HandleMouseMove,
-    params: ['handleInput', ClientX, ClientY, AltKey]
+    params: ['handleMouseMove', ClientX, ClientY, AltKey]
   }, {
     name: HandleBlur,
     params: ['handleBlur']
   }, {
     name: HandleBeforeInput,
-    params: ['handleBeforeInput', 'event.inputType', 'event.data']
+    params: ['handleBeforeInput', 'event.inputType', 'event.data'],
+    preventDefault: true
   }, {
     name: HandleCompositionStart,
     params: ['compositionStart', 'event.data']
@@ -11800,11 +11903,25 @@ const renderEventListeners = () => {
     params: ['compositionUpdate', 'event.data']
   }, {
     name: HandleCompositionEnd,
-    params: ['compositionUpdate', 'event.data']
+    params: ['compositionEnd', 'event.data']
   }, {
     name: HandleCut,
     params: ['cut'],
     preventDefault: true
+  }, {
+    name: HandlePaste,
+    params: ['paste', 'event.clipboardData ? event.clipboardData.getData("text/plain") : ""'],
+    preventDefault: true
+  }, {
+    name: HandlePointerDown,
+    params: ['handlePointerDown', 'event.button', 'event.altKey', 'event.ctrlKey', ClientX, ClientY],
+    trackPointerEvents: [HandlePointerMove, HandlePointerUp]
+  }, {
+    name: HandlePointerMove,
+    params: ['handlePointerMove', ClientX, ClientY, AltKey]
+  }, {
+    name: HandlePointerUp,
+    params: ['handlePointerUp']
   }, {
     name: HandleWheel,
     params: ['setDelta', DeltaMode, DeltaY],
@@ -11813,6 +11930,26 @@ const renderEventListeners = () => {
     name: HandleContextMenu,
     params: ['handleContextMenu', Button, ClientX, ClientY],
     preventDefault: true
+  }, {
+    name: HandleScrollBarVerticalPointerDown,
+    params: ['handleScrollBarVerticalPointerDown', ClientY],
+    trackPointerEvents: [HandleScrollBarVerticalPointerMove, HandleScrollBarVerticalPointerUp]
+  }, {
+    name: HandleScrollBarVerticalPointerMove,
+    params: ['handleScrollBarVerticalPointerMove', ClientY]
+  }, {
+    name: HandleScrollBarVerticalPointerUp,
+    params: ['handlePointerUp']
+  }, {
+    name: HandleScrollBarHorizontalPointerDown,
+    params: ['handleScrollBarHorizontalPointerDown', ClientX],
+    trackPointerEvents: [HandleScrollBarHorizontalPointerMove, HandleScrollBarHorizontalPointerUp]
+  }, {
+    name: HandleScrollBarHorizontalPointerMove,
+    params: ['handleScrollBarHorizontalMove', ClientX]
+  }, {
+    name: HandleScrollBarHorizontalPointerUp,
+    params: ['handlePointerUp']
   }];
 };
 
@@ -11874,6 +12011,25 @@ const updateDebugInfo = async debugId => {
   await invoke$c('Editor.rerender', key);
 };
 
+// TODO wrap commands globally, not per editor
+// TODO only store editor state in editor worker, not in renderer worker also
+
+const wrapCommand = fn => async (editorUid, ...args) => {
+  const oldInstance = get$6(editorUid);
+  const state = oldInstance.newState;
+  const newEditor = await fn(state, ...args);
+  if (state === newEditor) {
+    return newEditor;
+  }
+  const newEditorWithDerivedState = await updateDerivedState(state, newEditor);
+  // TODO if editor did not change, no need to update furthur
+
+  // TODO combine neweditor with latest editor?
+
+  set$7(editorUid, state, newEditorWithDerivedState);
+  return newEditorWithDerivedState;
+};
+
 const wrapCommandOld = wrapCommand;
 const commandMap = {
   'ActivateByEvent.activateByEvent': activateByEvent,
@@ -11960,7 +12116,7 @@ const commandMap = {
   'Editor.handleBeforeInput': wrapCommandOld(handleBeforeInput),
   'Editor.handleBeforeInputFromContentEditable': wrapCommandOld(handleBeforeInputFromContentEditable),
   'Editor.handleBlur': wrapCommandOld(handleBlur$1),
-  'Editor.handleClickAtPosition': handleClickAtPosition,
+  'Editor.handleClickAtPosition': wrapCommandOld(handleClickAtPosition),
   'Editor.handleContextMenu': wrapCommandOld(handleContextMenu),
   'Editor.handleDoubleClick': wrapCommandOld(handleDoubleClick),
   'Editor.handleFocus': wrapCommandOld(handleFocus$1),
@@ -11969,6 +12125,9 @@ const commandMap = {
   'Editor.handleMouseMoveWithAltKey': wrapCommandOld(handleMouseMoveWithAltKey),
   'Editor.handleNativeSelectionChange': editorHandleNativeSelectionChange,
   'Editor.handlePointerCaptureLost': wrapCommandOld(handlePointerCaptureLost),
+  'Editor.handlePointerDown': wrapCommandOld(handlePointerDown$1),
+  'Editor.handlePointerMove': wrapCommandOld(handlePointerMove),
+  'Editor.handlePointerUp': wrapCommandOld(handlePointerUp),
   'Editor.handleScrollBarClick': handleScrollBarPointerDown,
   'Editor.handleScrollBarHorizontalMove': wrapCommandOld(handleScrollBarHorizontalMove),
   'Editor.handleScrollBarHorizontalPointerDown': wrapCommandOld(handleScrollBarHorizontalPointerDown),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/editor-worker",
-  "version": "18.11.0",
+  "version": "18.13.0",
   "repository": {
     "type": "git",
     "url": "git@github.com:lvce-editor/editor-worker.git"