@lvce-editor/editor-worker 3.18.0 → 3.19.0

package/dist/editorWorkerMain.js

@@ -258,9 +258,9 @@ const renderColorPickerDom = {
     return ['Viewlet.setDom2', dom];
   }
 };
-const render$a = [renderColorPickerDom, renderColor$1, renderOffsetX$1];
+const render$b = [renderColorPickerDom, renderColor$1, renderOffsetX$1];
 const renderColorPicker = async (oldState, newState) => {
-  return renderParts(render$a, oldState, newState);
+  return renderParts(render$b, oldState, newState);
 };
 
 // TODO use numeric enum
@@ -1213,7 +1213,7 @@ const set$6 = (id, fn) => {
 const get$6 = id => {
   return state$1$1.callbacks[id];
 };
-const remove$4 = id => {
+const remove$5 = id => {
   delete state$1$1.callbacks[id];
 };
 const state$9 = {
@@ -1259,7 +1259,7 @@ const resolve = (id, args) => {
     return;
   }
   fn(args);
-  remove$4(id);
+  remove$5(id);
 };
 const create$2$1 = (method, params) => {
   const {
@@ -1451,7 +1451,7 @@ const getErrorResponse = (message, error, preparePrettyError, logError) => {
   const errorProperty = getErrorProperty(error, prettyError);
   return create$1$1(message, errorProperty);
 };
-const create$a = (message, result) => {
+const create$b = (message, result) => {
   return {
     jsonrpc: Two,
     id: message.id,
@@ -1460,7 +1460,7 @@ const create$a = (message, result) => {
 };
 const getSuccessResponse = (message, result) => {
   const resultProperty = result ?? null;
-  return create$a(message, resultProperty);
+  return create$b(message, resultProperty);
 };
 const getResponse = async (message, ipc, execute, preparePrettyError, logError, requiresSocket) => {
   try {
@@ -1660,7 +1660,7 @@ const waitForFirstMessage$1 = async port => {
   return event;
 };
 
-const create$9 = async () => {
+const create$a = async () => {
   const {
     port1,
     port2
@@ -1705,7 +1705,7 @@ const wrap$3 = port => {
 
 const IpcParentWithExtensionHostWorker = {
   __proto__: null,
-  create: create$9,
+  create: create$a,
   wrap: wrap$3
 };
 
@@ -1713,7 +1713,7 @@ const sendMessagePortToSyntaxHighlightingWorker = async port => {
   await invokeAndTransfer('SendMessagePortToSyntaxHighlightingWorker.sendMessagePortToSyntaxHighlightingWorker', port, 'HandleMessagePort.handleMessagePort');
 };
 
-const create$8 = async () => {
+const create$9 = async () => {
   const {
     port1,
     port2
@@ -1758,7 +1758,7 @@ const wrap$1 = port => {
 
 const IpcParentWithSyntaxHighlightingWorker = {
   __proto__: null,
-  create: create$8,
+  create: create$9,
   wrap: wrap$1
 };
 
@@ -1766,7 +1766,7 @@ const sendMessagePortToRendererProcess = async port => {
   await invokeAndTransfer('SendMessagePortToRendererProcess.sendMessagePortToRendererProcess', port, 'HandleMessagePort.handleMessagePort');
 };
 
-const create$7 = async () => {
+const create$8 = async () => {
   const {
     port1,
     port2
@@ -1811,7 +1811,7 @@ const wrap = port => {
 
 const IpcParentWithRendererProcess = {
   __proto__: null,
-  create: create$7,
+  create: create$8,
   wrap
 };
 
@@ -1828,7 +1828,7 @@ const getModule$1 = method => {
   }
 };
 
-const create$6 = async ({
+const create$7 = async ({
   method,
   ...options
 }) => {
@@ -1846,7 +1846,7 @@ const create$6 = async ({
 const createRpc = method => {
   let _ipc;
   const listen = async () => {
-    const ipc = await create$6({
+    const ipc = await create$7({
       method
     });
     handleIpc(ipc);
@@ -2122,7 +2122,7 @@ const getAccurateColumnIndexAscii = (line, guess, averageCharWidth, eventX, font
 const supported = () => {
   return 'Segmenter' in Intl;
 };
-const create$5 = () => {
+const create$6 = () => {
   // @ts-ignore
   const segmenter = new Intl.Segmenter();
   return {
@@ -2160,7 +2160,7 @@ const create$5 = () => {
 
 // @ts-ignore
 const getAccurateColumnIndexUnicode = (line, guess, averageCharWidth, eventX, fontWeight, fontSize, fontFamily, letterSpacing) => {
-  const segmenter = create$5();
+  const segmenter = create$6();
   const segments = segmenter.getSegments(line);
   const isMonospaceFont = false;
   const charWidth = 0;
@@ -2394,6 +2394,7 @@ const Completion = 'completion';
 const CompletionDetail$1 = 'completionDetail';
 const ColorPicker$1 = 'colorPicker';
 const Find = 'find';
+const Hover = 'hover';
 
 const isCompletionWidget = widget => {
   return widget.id === Completion;
@@ -2441,7 +2442,11 @@ const addWidgetToEditor = async (widgetId, focusKey, editor, factory, newStateGe
     return editor;
   }
   const widget = factory();
+  // @ts-ignore
+  widget.newState.editorUid = editor.uid;
   const newState = await newStateGenerator(widget.newState);
+  // @ts-ignore
+  newState.editorUid = editor.uid;
   const latestWidget = {
     ...widget,
     newState
@@ -2460,12 +2465,12 @@ const addWidgetToEditor = async (widgetId, focusKey, editor, factory, newStateGe
   return newEditor;
 };
 
-const create$4 = () => {
+const create$5 = () => {
   return Math.random();
 };
 
-const create$3 = () => {
-  const completionUid = create$4();
+const create$4 = () => {
+  const completionUid = create$5();
   const widget = {
     id: ColorPicker$1,
     oldState: {
@@ -2506,12 +2511,13 @@ const FocusFindWidgetReplaceAllButton = 47;
 const FocusFindWidgetCloseButton = 48;
 const FocusFindWidgetNextMatchButton = 49;
 const FocusFindWidgetPreviousMatchButton = 50;
+const FocusEditorHover = 51;
 
-const newStateGenerator = state => {
+const newStateGenerator$1 = state => {
   return loadContent$3(state);
 };
 const openColorPicker = async editor => {
-  return addWidgetToEditor(ColorPicker$1, ColorPicker, editor, create$3, newStateGenerator);
+  return addWidgetToEditor(ColorPicker$1, ColorPicker, editor, create$4, newStateGenerator$1);
 };
 
 const state$6 = {
@@ -2808,7 +2814,7 @@ const characterLeft = (line, columnIndex) => {
   if (!supported()) {
     return 1;
   }
-  const segmenter = create$5();
+  const segmenter = create$6();
   const last = segmenter.at(line, columnIndex - 1);
   return columnIndex - last.index;
 };
@@ -2819,7 +2825,7 @@ const characterRight = (line, columnIndex) => {
   if (!supported()) {
     return 1;
   }
-  const segmenter = create$5();
+  const segmenter = create$6();
   const next = segmenter.at(line, columnIndex);
   return next.segment.length;
 };
@@ -3233,105 +3239,36 @@ const deleteWordLeft = editor => {
   return newEditor;
 };
 
-const deleteWordPartLeft = editor => {
-  const newEditor = editorDeleteHorizontalLeft(editor, wordPartLeft);
-  return newEditor;
-};
-
-const deleteWordPartRight = editor => {
-  return editorDeleteHorizontalRight(editor, wordPartRight);
-};
-
-const deleteWordRight = editor => {
-  return editorDeleteHorizontalRight(editor, wordRight);
-};
-
-const findAllReferences = async editor => {
-  await invoke$3('SideBar.show', 'References', /* focus */true);
-  return editor;
-};
-
-// TODO format should be executed in parallel with saving
-// -> fast save, no need to wait for formatting
-// -> fast formatting, no need to wait for save
-
-// TODO should format on save when closing/switching editor?
-
-// TODO format with cursor
-// TODO should be in editor folder
-
-const format$1 = async editor => {
-  const edits = await invoke$3('Format.format', editor);
-  return edits;
-};
-
-const warn = (...args) => {
-  console.warn(...args);
-};
-const error = (...args) => {
-  console.error(...args);
-};
-
-// @ts-ignore
-const getDocumentEdits = (editor, edits) => {
-  const documentEdits = [];
-  for (const edit of edits) {
-    const start = positionAt(editor, edit.startOffset);
-    const end = positionAt(editor, edit.endOffset);
-    const deleted = getSelectionText(editor, {
-      start,
-      end
-    });
-    const documentEdit = {
-      start,
-      end,
-      inserted: splitLines$2(edit.inserted),
-      deleted,
-      origin: Format
-    };
-    if (documentEdit.inserted.length === 0) {
-      documentEdit.inserted = [''];
-    }
-    documentEdits.push(documentEdit);
-  }
-  return documentEdits;
-};
-
-// @ts-ignore
-const applyDocumentEdits = (editor, edits) => {
-  if (!Array.isArray(edits)) {
-    warn('something is wrong with format on save', edits);
-    return editor;
-  }
-  if (edits.length === 0) {
-    return editor;
-  }
-  const documentEdits = getDocumentEdits(editor, edits);
-  return scheduleDocumentAndCursorsSelections(editor, documentEdits);
-};
-
-const expectedErrorMessage = 'Failed to execute formatting provider: FormattingError:';
-const isFormattingError = error => {
-  return error && error instanceof Error && error.message.startsWith(expectedErrorMessage);
-};
-
-// TODO also format with cursor
-const format = async editor => {
-  try {
-    const edits = await format$1(editor);
-    return applyDocumentEdits(editor, edits);
-  } catch (error) {
-    if (isFormattingError(error)) {
-      console.error('Formatting Error:',
-      // @ts-ignore
-      error.message.slice(expectedErrorMessage.length));
-      return editor;
+const create$3 = () => {
+  const uid = create$5();
+  const widget = {
+    id: Hover,
+    oldState: {
+      uid: uid,
+      x: 0,
+      y: 0,
+      width: 0,
+      height: 0,
+      content: '',
+      diagnostics: [],
+      documentation: '',
+      editorUid: 0,
+      lineInfos: []
+    },
+    newState: {
+      uid: uid,
+      x: 0,
+      y: 0,
+      width: 0,
+      height: 0,
+      content: '',
+      diagnostics: [],
+      documentation: '',
+      editorUid: 0,
+      lineInfos: []
     }
-    console.error(error);
-    const displayErrorMessage = `${error}`;
-    await editorShowMessage(editor, 0, 0, displayErrorMessage, true);
-    return editor;
-  }
+  };
+  return widget;
 };
 
 const RE_WORD_START$1 = /^[\w\-]+/;
@@ -3376,905 +3313,1391 @@ const getWordBefore = (editor, rowIndex, columnIndex) => {
   return getWordBefore$1(line, columnIndex);
 };
 
-// @ts-ignore
-const getDefinition = async (editor, offset) => {
-  const definition = await invoke$3('ExtensionHostDefinition.executeDefinitionProvider', editor, offset);
-  return definition;
+const OnCompletion = 'onCompletion';
+const OnHover = 'onHover';
+
+// TODO add tests for this
+const activateByEvent = async event => {
+  await invoke$3('ExtensionHostManagement.activateByEvent', event);
 };
 
-const emptyObject = {};
-const RE_PLACEHOLDER = /\{(PH\d+)\}/g;
-const i18nString = (key, placeholders = emptyObject) => {
-  if (placeholders === emptyObject) {
-    return key;
-  }
-  const replacer = (match, rest) => {
-    return placeholders[rest];
-  };
-  return key.replaceAll(RE_PLACEHOLDER, replacer);
+const execute = async ({
+  editor,
+  args,
+  event,
+  method,
+  noProviderFoundMessage,
+  noProviderFoundResult = undefined
+}) => {
+  const fullEvent = `${event}:${editor.languageId}`;
+  await activateByEvent(fullEvent);
+  const result = await invoke$2(method, editor.uid, ...args);
+  return result;
 };
 
-const UiStrings$1 = {
-  GoToDefinition: 'Go to Definition',
-  NoDefinitionFound: 'No definition found',
-  NoDefinitionFoundFor: "No definition found for '{PH1}'",
-  NoTypeDefinitionFound: 'No type definition found',
-  NoTypeDefinitionFoundFor: "No type definition found for '{PH1}'",
-  NoResults: 'No Results',
-  Replace: 'Replace'
+const executeHoverProvider = (editor, offset) => {
+  object(editor);
+  number$1(offset);
+  return execute({
+    event: OnHover,
+    editor,
+    method: HoverExecute,
+    args: [offset],
+    noProviderFoundMessage: 'No hover provider found'
+  });
 };
-const noDefinitionFound = () => {
-  return i18nString(UiStrings$1.NoDefinitionFound);
+
+const getHover = async (editor, offset) => {
+  object(editor);
+  number$1(offset);
+  // TODO invoke extension host worker directly
+  const hover = await executeHoverProvider(editor, offset);
+  return hover;
 };
-const noDefinitionFoundFor = word => {
-  return i18nString(UiStrings$1.NoDefinitionFoundFor, {
-    PH1: word
+
+let _ipc;
+const listen$6 = async () => {
+  const ipc = await create$7({
+    method: RendererProcess
   });
+  handleIpc(ipc);
+  _ipc = ipc;
 };
-const noTypeDefinitionFoundFor = word => {
-  return i18nString(UiStrings$1.NoTypeDefinitionFoundFor, {
-    PH1: word
-  });
+const invoke$1 = async (method, ...args) => {
+  return invoke$5(_ipc, method, ...args);
 };
-const noTypeDefinitionFound = () => {
-  return i18nString(UiStrings$1.NoTypeDefinitionFound);
+
+const measureTextBlockHeight = (text, fontFamily, fontSize, lineHeight, width) => {
+  return invoke$1('MeasureTextBlockHeight.measureTextBlockHeight', text, fontSize, fontFamily, lineHeight, width);
 };
-const noResults$1 = () => {
-  return i18nString(UiStrings$1.NoResults);
+
+const deepCopy = value => {
+  return structuredClone(value);
 };
 
-// @ts-ignore
-const goTo = async ({
-  editor,
-  getLocation,
-  getNoLocationFoundMessage,
-  getErrorMessage,
-  isNoProviderFoundError
-}) => {
-  const {
-    selections
-  } = editor;
-  const rowIndex = selections[0];
-  const columnIndex = selections[1];
-  try {
-    const definition = await getLocation(editor, rowIndex, columnIndex);
-    // TODO if editor is already disposed at this point, do nothing
-    if (!definition) {
-      // TODO show popup that no definition was found
-      // TODO if there was an error, show popup that go to definition resulted in an error
-      const info = getWordAt(editor, rowIndex, columnIndex);
-      const message = getNoLocationFoundMessage(info);
-      return editorShowMessage(editor, rowIndex, columnIndex, message, false);
-    }
-    if (typeof definition.uri !== 'string' || typeof definition.startOffset !== 'number' || typeof definition.endOffset !== 'number') {
-      // Logger.warn('invalid definition result', definition)
-      return editor;
-    }
-    const uri = definition.uri;
-    if (uri === editor.uri) {
-      // TODO set cursor to the definition position
-      const position = positionAt(editor, definition.startOffset);
-      const selectionEdits = new Uint32Array([position.rowIndex, position.columnIndex, position.rowIndex, position.columnIndex]);
-      return scheduleSelections(editor, selectionEdits);
-    }
-    // TODO if definition.file is not of type string, show a popup that definition.file must be of type string
-    // TODO open file and scroll to that position and set cursor to that position
+const getInitialLineState = initialLineState => {
+  return deepCopy(initialLineState);
+};
 
-    const context = {
-      startRowIndex: definition.startRowIndex,
-      startColumnIndex: definition.startColumnIndex,
-      endRowIndex: definition.endRowIndex,
-      endColumnIndex: definition.endColumnIndex
-    };
-    await invoke$3(/* Main.openUri */'Main.openUri', /* uri */uri, /* focus */true, context);
-    return editor;
-  } catch (error) {
-    // TODO if editor is already disposed at this point, do nothing
-    if (isNoProviderFoundError(error)) {
-      const displayErrorMessage = getErrorMessage(error);
-      await editorShowMessage(editor, rowIndex, columnIndex, displayErrorMessage, false);
-      return editor;
-    }
-    // @ts-ignore
-    // ErrorHandling.handleError(error, false)
-    const displayErrorMessage = getErrorMessage(error);
-    await editorShowMessage(editor, rowIndex, columnIndex, displayErrorMessage, true);
-    return editor;
+const getLineInfo$1 = (line, tokens, TokenMap) => {
+  const tokensLength = tokens.length;
+  let end = 0;
+  let start = 0;
+  const lineInfo = [];
+  for (let i = 0; i < tokensLength; i += 2) {
+    const tokenType = tokens[i];
+    const tokenLength = tokens[i + 1];
+    end += tokenLength;
+    const text = line.slice(start, end);
+    const className = `Token ${TokenMap[tokenType] || 'Unknown'}`;
+    const normalizedText = text;
+    lineInfo.push(normalizedText, className);
+    start = end;
   }
+  return lineInfo;
 };
 
-// TODO race condition, check that editor hasn't been closed in the meantime
-
-// TODO in case of error should show message "Definition Error: Cannot ready Property x of undefined"
-
-// TODO show some kind of message maybe ("No Definition found")
-
-// TODO possible to do this with events/state machine instead of promises -> enables canceling operations / concurrent calls
-
-// TODO there are still race conditions in this function:
-// - when open is called twice, previous dom nodes can either be reused or the previous dom nodes must be disposed
-
-// @ts-ignore
-const getLocation$1 = async (editor, rowIndex, columnIndex) => {
-  const offset = offsetAt(editor, rowIndex, columnIndex);
-  const definition = await getDefinition(editor, offset);
-  return definition;
+const state$5 = {
+  warned: []
 };
-
-// @ts-ignore
-const getNoLocationFoundMessage$1 = info => {
-  if (info.word) {
-    return noDefinitionFoundFor(info.word);
+const flattenTokensArray = tokens => {
+  const flattened = [];
+  for (const token of tokens) {
+    object(token);
+    flattened.push(token.type, token.length);
   }
-  return noDefinitionFound();
-};
-
-// @ts-ignore
-const getErrorMessage$3 = error => {
-  // if (
-  //   error &&
-  //   error.message &&
-  //   error.message.startsWith('Failed to execute definition provider: ')
-  // ) {
-  //   return error.message.replace('Failed to execute definition provider: ', '')
-  // }
-  return `${error}`;
+  return flattened;
 };
-
-// @ts-ignore
-const isNoProviderFoundError$1 = error => {
-  return error &&
-  // @ts-ignore
-  error.message &&
-  // @ts-ignore
-  error.message.startsWith('Failed to execute definition provider: No definition provider found');
+const warnDeprecatedArrayReturn = (languageId, fn) => {
+  if (state$5.warned.includes(fn)) {
+    return;
+  }
+  state$5.warned.push(fn);
+  console.warn(`tokenizers without hasArrayReturn=false are deprecated (language ${languageId})`);
 };
-const goToDefinition = editor => {
-  return goTo({
-    editor,
-    getLocation: getLocation$1,
-    getNoLocationFoundMessage: getNoLocationFoundMessage$1,
-    getErrorMessage: getErrorMessage$3,
-    isNoProviderFoundError: isNoProviderFoundError$1
-  });
+const safeTokenizeLine = (languageId, tokenizeLine, line, lineStateAtStart, hasArrayReturn) => {
+  try {
+    const lineState = tokenizeLine(line, lineStateAtStart);
+    if (!lineState || !lineState.tokens || !lineState.state) {
+      throw new Error('invalid tokenization result');
+    }
+    if (!hasArrayReturn) {
+      warnDeprecatedArrayReturn(languageId, tokenizeLine);
+      // workaround for old tokenizers
+      lineState.tokens = flattenTokensArray(lineState.tokens);
+    }
+    return lineState;
+  } catch (error) {
+    console.error(error);
+    return {
+      tokens: [/* type */0, /* length */line.length],
+      lineState: lineStateAtStart
+    };
+  }
 };
 
-const getNoLocationFoundMessage = info => {
-  if (info.word) {
-    return noTypeDefinitionFoundFor(info.word);
+const getLineInfos = (lines, tokenizer, languageId) => {
+  const lineInfos = [];
+  const {
+    tokenizeLine,
+    initialLineState,
+    hasArrayReturn,
+    TokenMap
+  } = tokenizer;
+  let currentLineState = getInitialLineState(initialLineState);
+  for (const line of lines) {
+    const result = safeTokenizeLine(languageId, tokenizeLine, line, currentLineState, hasArrayReturn);
+    const {
+      tokens
+    } = result;
+    const lineInfo = getLineInfo$1(line, tokens, TokenMap);
+    lineInfos.push(lineInfo);
+    currentLineState = result;
   }
-  return noTypeDefinitionFound();
+  return lineInfos;
 };
 
-const getTypeDefinition = async (editor, offset) => {
-  const definition = await invoke$3('ExtensionHostTypeDefinition.executeTypeDefinitionProvider', editor, offset);
-  return definition;
+/**
+ * @enum number
+ */
+const State = {
+  TopLevelContent: 1
 };
 
-const getLocation = async (editor, rowIndex, columnIndex) => {
-  const offset = offsetAt(editor, rowIndex, columnIndex);
-  const definition = await getTypeDefinition(editor, offset);
-  return definition;
+/**
+ * @enum number
+ */
+const TokenType = {
+  Text: 1
 };
-
-// @ts-ignore
-const getErrorMessage$2 = error => {
-  // if (
-  //   error &&
-  //   error.message &&
-  //   error.message.startsWith('Failed to execute type definition provider: ')
-  // ) {
-  //   return error.message.replace(
-  //     'Failed to execute type definition provider: ',
-  //     ''
-  //   )
-  // }
-  return `${error}`;
+const TokenMap = {
+  [TokenType.Text]: 'Text'
 };
-const isNoProviderFoundError = error => {
-  return error &&
-  // @ts-ignore
-  error.message &&
-  // @ts-ignore
-  error.message.startsWith('Failed to execute type definition provider: No type definition provider found');
+const initialLineState = {
+  state: State.TopLevelContent
 };
-const goToTypeDefinition = (editor, explicit = true) => {
-  return goTo({
-    editor,
-    getLocation,
-    getNoLocationFoundMessage: getNoLocationFoundMessage,
-    isNoProviderFoundError,
-    getErrorMessage: getErrorMessage$2
-  });
+const hasArrayReturn = true;
+const tokenizeLine = (line, lineState) => {
+  return {
+    tokens: [TokenType.Text, line.length],
+    state: lineState.state
+  };
 };
 
-const Editor = 3;
-
-const handleContextMenu = async (editor, button, x, y) => {
-  await invoke$3(/* ContextMenu.show */'ContextMenu.show', /* x */x, /* y */y, /* id */Editor);
-  return editor;
+const TokenizePlainText = {
+  __proto__: null,
+  State,
+  TokenMap,
+  TokenType,
+  hasArrayReturn,
+  initialLineState,
+  tokenizeLine
 };
 
-// @ts-ignore
-
-// match all words, including umlauts, see https://stackoverflow.com/questions/5436824/matching-accented-characters-with-javascript-regexes/#answer-11550799
-const RE_WORD_START = /^[a-z\u00C0-\u017F\d]+/i;
-const RE_WORD_END = /[a-z\u00C0-\u017F\d]+$/i;
-
-// @ts-ignore
-const getNewSelections$7 = (line, rowIndex, columnIndex) => {
-  const before = line.slice(0, columnIndex);
-  const after = line.slice(columnIndex);
-  const beforeMatch = before.match(RE_WORD_END);
-  const afterMatch = after.match(RE_WORD_START);
-  const columnStart = columnIndex - (beforeMatch ? beforeMatch[0].length : 0);
-  const columnEnd = columnIndex + (afterMatch ? afterMatch[0].length : 0);
-  const newSelections = new Uint32Array([rowIndex, columnStart, rowIndex, columnEnd]);
-  return newSelections;
+const state$4 = {
+  tokenizers: Object.create(null),
+  tokenizePaths: Object.create(null),
+  listeners: [],
+  pending: Object.create(null),
+  /**
+   * @type {number[]}
+   */
+  connectedEditors: []
 };
-
-// @ts-ignore
-const selectWord = (editor, rowIndex, columnIndex) => {
-  const line = getLine(editor, rowIndex);
-  const newSelections = getNewSelections$7(line, rowIndex, columnIndex);
-  return scheduleSelections(editor, newSelections);
+const has = languageId => {
+  return languageId in state$4.tokenizers;
 };
-
-const handleDoubleClick = (editor, modifier, x, y) => {
-  const position = at(editor, x, y);
-  return selectWord(editor, position.rowIndex, position.columnIndex);
+const set$4 = (languageId, tokenizer) => {
+  state$4.tokenizers[languageId] = tokenizer;
+};
+const get$4 = languageId => {
+  return state$4.tokenizers[languageId];
+};
+const isPending = languageId => {
+  return languageId in state$4.pending;
 };
 
-const WhenExpressionEditorText = 12;
-const handleFocus = editor => {
-  // TODO make change events functional,
-  // when rendering, send focus changes to renderer worker
-  invoke$3('Focus.setFocus', WhenExpressionEditorText);
-  return editor;
+let enabled$1 = false;
+const setEnabled$1 = value => {
+  enabled$1 = value;
+};
+const getEnabled$1 = () => {
+  return enabled$1;
 };
 
-const Single = 1;
-const Double = 2;
-const Triple = 3;
+const {
+  listen: listen$5,
+  invoke
+} = createRpc(SyntaxHighlightingWorker);
 
-const state$5 = {
-  position: {
-    rowIndex: 0,
-    columnIndex: 0
-  }
+const tokenMaps = Object.create(null);
+const set$3 = (languageId, tokenMap) => {
+  tokenMaps[languageId] = tokenMap;
 };
-const getPosition$1 = () => {
-  return state$5.position;
+const get$3 = languageId => {
+  return tokenMaps[languageId] || {};
 };
 
-// @ts-ignore
-const setPosition$1 = position => {
-  state$5.position = position;
+// TODO loadTokenizer should be invoked from renderer worker
+const loadTokenizer = async (languageId, tokenizePath) => {
+  if (!tokenizePath) {
+    return;
+  }
+  if (getEnabled$1()) {
+    const tokenMap = await invoke('Tokenizer.load', languageId, tokenizePath);
+    set$3(languageId, tokenMap);
+    return;
+  }
+  try {
+    // TODO check that tokenizer is valid
+    // 1. tokenizeLine should be of type function
+    // 2. getTokenClass should be of type function
+    const tokenizer = await import(tokenizePath);
+    if (typeof tokenizer.tokenizeLine !== 'function') {
+      console.warn(`tokenizer.tokenizeLine should be a function in "${tokenizePath}"`);
+      return;
+    }
+    if (!tokenizer.TokenMap || typeof tokenizer.TokenMap !== 'object' || Array.isArray(tokenizer.TokenMap)) {
+      console.warn(`tokenizer.TokenMap should be an object in "${tokenizePath}"`);
+      return;
+    }
+    set$3(languageId, tokenizer.TokenMap);
+    set$4(languageId, tokenizer);
+  } catch (error) {
+    // TODO better error handling
+    console.error(error);
+    return;
+  }
+};
+const getTokenizer = languageId => {
+  if (has(languageId)) {
+    return get$4(languageId);
+  }
+  if (isPending(languageId)) {
+    return TokenizePlainText;
+  }
+  return TokenizePlainText;
 };
 
-const Ctrl = 1;
-const Alt = 2;
+const tokenizeCodeBlock = async (codeBlock, languageId, tokenizerPath) => {
+  await loadTokenizer(languageId, tokenizerPath);
+  const tokenizer = getTokenizer(languageId);
+  const lines = splitLines$2(codeBlock);
+  const lineInfos = getLineInfos(lines, tokenizer, languageId);
+  return lineInfos;
+};
 
-// TODO first change cursor position, then run go to definition
-// cursor should appear at mousedown position immediately
-const handleSingleClickWithAlt = async (editor, position) => {
-  const {
+const getHoverPosition = (position, selections) => {
+  if (position) {
+    return position;
+  }
+  const rowIndex = selections[0];
+  const columnIndex = selections[1];
+  return {
     rowIndex,
     columnIndex
-  } = position;
-  const newEditor = {
-    ...editor,
-    selections: new Uint32Array([rowIndex, columnIndex, rowIndex, columnIndex])
   };
-  // TODO rectangular selection with alt click,
-  // but also go to definition with alt click
-  const newEditor2 = await goToDefinition(newEditor);
-  return newEditor2;
 };
-const handleSingleClickWithCtrl = async (editor, position) => {
-  const selections = editor.selections;
-  for (let i = 0; i < selections.length; i += 4) {
-    const [selectionStartRow, selectionStartColumn, selectionEndRow, selectionEndColumn] = getSelectionPairs(selections, i);
-    if (selectionStartRow === position.rowIndex && selectionStartColumn === position.columnIndex && selectionEndRow === position.rowIndex && selectionEndColumn === position.columnIndex) {
-      // selection exists -> remove
-      const newSelections = new Uint32Array(selections.length - 4);
-      newSelections.set(selections.subarray(0, i), 0);
-      newSelections.set(selections.subarray(i + 4), i);
-      return scheduleSelections(editor, newSelections);
+const getMatchingDiagnostics = (diagnostics, rowIndex, columnIndex) => {
+  const matching = [];
+  for (const diagnostic of diagnostics) {
+    if (diagnostic.rowIndex === rowIndex) {
+      matching.push(diagnostic);
     }
   }
-  // TODO selection does not exist -> add
-  // TODO insert in order
-  const newSelections = new Uint32Array(selections.length + 4);
-  newSelections.set(selections, 0);
-  const insertIndex = selections.length;
-  newSelections[insertIndex] = position.rowIndex;
-  newSelections[insertIndex + 1] = position.columnIndex;
-  newSelections[insertIndex + 2] = position.rowIndex;
-  newSelections[insertIndex + 3] = position.columnIndex;
-  return scheduleSelections(editor, newSelections);
+  return matching;
 };
-const handleSingleClickDefault = (editor, position) => {
-  setPosition$1(position);
+const fallbackDisplayStringLanguageId = 'typescript'; // TODO remove this
+
+const hoverDocumentationFontSize = 15;
+const hoverDocumentationFontFamily = 'Fira Code';
+const hoverDocumentationLineHeight = '1.33333';
+const hoverBorderLeft = 1;
+const hoverBorderRight = 1;
+const hoverPaddingLeft = 8;
+const hoverPaddingRight = 8;
+const hovverFullWidth = 400;
+const hoverDocumentationWidth = hovverFullWidth - hoverPaddingLeft - hoverPaddingRight - hoverBorderLeft - hoverBorderRight;
+const getHoverPositionXy = (editor, rowIndex, wordStart, documentationHeight) => {
+  const x$1 = x(editor, rowIndex, wordStart);
+  const y$1 = editor.height - y(editor, rowIndex) + editor.y + 40;
   return {
-    ...editor,
-    selections: new Uint32Array([position.rowIndex, position.columnIndex, position.rowIndex, position.columnIndex]),
-    focused: true
+    x: x$1,
+    y: y$1
   };
 };
-const getFn = modifier => {
-  switch (modifier) {
-    case Alt:
-      return handleSingleClickWithAlt;
-    case Ctrl:
-      return handleSingleClickWithCtrl;
-    default:
-      return handleSingleClickDefault;
+const getEditorHoverInfo = async (editorUid, position) => {
+  number$1(editorUid);
+  const instance = get$7(editorUid);
+  const editor = instance.newState;
+  const {
+    selections
+  } = editor;
+  const {
+    rowIndex,
+    columnIndex
+  } = getHoverPosition(position, selections);
+  const offset = offsetAt(editor, rowIndex, columnIndex);
+  const hover = await getHover(editor, offset);
+  if (!hover) {
+    return undefined;
   }
+  const {
+    displayString,
+    documentation,
+    displayStringLanguageId
+  } = hover;
+  const tokenizerPath = '';
+  const lineInfos = await tokenizeCodeBlock(displayString, displayStringLanguageId || fallbackDisplayStringLanguageId, tokenizerPath);
+  const wordPart = await getWordBefore(editor, rowIndex, columnIndex);
+  const wordStart = columnIndex - wordPart.length;
+  await measureTextBlockHeight(documentation, hoverDocumentationFontFamily, hoverDocumentationFontSize, hoverDocumentationLineHeight, hoverDocumentationWidth);
+  const {
+    x,
+    y
+  } = getHoverPositionXy(editor, rowIndex, wordStart);
+  const diagnostics = editor.diagnostics || [];
+  const matchingDiagnostics = getMatchingDiagnostics(diagnostics, rowIndex);
+  return {
+    lineInfos,
+    documentation,
+    x,
+    y,
+    matchingDiagnostics
+  };
 };
-const handleSingleClick = async (editor, modifier, x, y) => {
-  object(editor);
-  number$1(modifier);
-  number$1(x);
-  number$1(y);
-  const position = at(editor, x, y);
-  const fn = getFn(modifier);
-  const newEditor = await fn(editor, position);
-  // switch (newEditor.completionState) {
-  //   case EditorCompletionState.None:
-  //   case EditorCompletionState.Visible:
-  //   case EditorCompletionState.Loading:
-  //     return {
-  //       newState: newEditor,
-  //       commands: [],
-  //     }
-  //   default:
-  //     break
-  // }
-  return newEditor;
+
+const loadHoverContent = async state => {
+  // TODO
+  const position = undefined;
+  const hoverInfo = await getEditorHoverInfo(state.editorUid, position);
+  if (!hoverInfo) {
+    return state;
+  }
+  const {
+    lineInfos,
+    documentation,
+    x,
+    y,
+    matchingDiagnostics
+  } = hoverInfo;
+  return {
+    ...state,
+    lineInfos,
+    documentation,
+    x,
+    y,
+    diagnostics: matchingDiagnostics
+  };
 };
 
-// @ts-ignore
+const newStateGenerator = state => {
+  return loadHoverContent(state);
+};
+const showHover2 = async editor => {
+  return addWidgetToEditor(Hover, FocusEditorHover, editor, create$3, newStateGenerator);
+};
 
-// @ts-ignore
-const getNewSelections$6 = (line, rowIndex) => {
-  // TODO handle virtual space when columnIndex is greater than line length
-  return new Uint32Array([rowIndex, 0, rowIndex, line.length]);
+const deleteWordPartLeft = editor => {
+  const newEditor = editorDeleteHorizontalLeft(editor, wordPartLeft);
+  return newEditor;
 };
 
-// @ts-ignore
-const selectLine = editor => {
-  const selections = editor.selections;
-  const rowIndex = selections[editor.primarySelectionIndex];
-  const line = getLine(editor, rowIndex);
-  const newSelections = getNewSelections$6(line, rowIndex);
-  return scheduleSelections(editor, newSelections);
+const deleteWordPartRight = editor => {
+  return editorDeleteHorizontalRight(editor, wordPartRight);
 };
 
-// TODO rowIndex and columnIndex should already be set because of singleClick which occurred before triple click
-// @ts-ignore
-const handleTripleClick = (editor, modifier, x, y) => {
-  object(editor);
-  number$1(x);
-  number$1(y);
-  return {
-    newState: selectLine(editor),
-    commands: []
-  };
+const deleteWordRight = editor => {
+  return editorDeleteHorizontalRight(editor, wordRight);
 };
 
-const handleMouseDown = (state, modifier, x, y, detail) => {
-  switch (detail) {
-    case Single:
-      return handleSingleClick(state, modifier, x, y);
-    case Double:
-      return handleDoubleClick(state, modifier, x, y);
-    case Triple:
-      return handleTripleClick(state, modifier, x, y);
-    default:
-      return state;
-  }
+const findAllReferences = async editor => {
+  await invoke$3('SideBar.show', 'References', /* focus */true);
+  return editor;
 };
 
-const state$4 = {
-  timeout: -1,
-  x: 0,
-  y: 0,
-  editor: undefined
-};
-const get$4 = () => {
-  return state$4;
-};
-const set$4 = (editor, timeout, x, y) => {
-  state$4.editor = editor;
-  state$4.timeout = timeout;
-  state$4.x = x;
-  state$4.y = y;
-};
+// TODO format should be executed in parallel with saving
+// -> fast save, no need to wait for formatting
+// -> fast formatting, no need to wait for save
 
-const showHover$1 = async (editor, position) => {
-  // TODO race condition
-  // await Viewlet.closeWidget(ViewletModuleId.EditorHover)
-  // await Viewlet.openWidget(ViewletModuleId.EditorHover, position)
-};
+// TODO should format on save when closing/switching editor?
 
-// TODO several things can happen:
-// 1. highlight link when alt key is pressed
-// 2. show hover info
-// 3. selection moves
-// 4. highlight go to definition
-// 5. show color picker
-// 6. show error info
+// TODO format with cursor
+// TODO should be in editor folder
 
-const onHoverIdle = async () => {
-  const {
-    x,
-    y,
-    editor
-  } = get$4();
-  at(editor, x, y);
-  await showHover$1();
+const format$1 = async editor => {
+  const edits = await invoke$3('Format.format', editor);
+  return edits;
 };
-const hoverDelay = 300;
 
-// @ts-ignore
-const handleMouseMove = (editor, x, y) => {
-  if (!editor.hoverEnabled) {
-    return editor;
-  }
-  const oldState = get$4();
-  if (oldState.timeout !== -1) {
-    clearTimeout(oldState.timeout);
-  }
-  const timeout = setTimeout(onHoverIdle, hoverDelay);
-  set$4(editor, timeout, x, y);
-  return editor;
+const warn = (...args) => {
+  console.warn(...args);
+};
+const error = (...args) => {
+  console.error(...args);
 };
 
 // @ts-ignore
-const getTokenIndex = (tokens, offset) => {
-  let currentOffset = 0;
-  for (let i = 0; i < tokens.length; i++) {
-    const token = tokens[i];
-    currentOffset += token.length;
-    if (currentOffset >= offset) {
-      return i;
+const getDocumentEdits = (editor, edits) => {
+  const documentEdits = [];
+  for (const edit of edits) {
+    const start = positionAt(editor, edit.startOffset);
+    const end = positionAt(editor, edit.endOffset);
+    const deleted = getSelectionText(editor, {
+      start,
+      end
+    });
+    const documentEdit = {
+      start,
+      end,
+      inserted: splitLines$2(edit.inserted),
+      deleted,
+      origin: Format
+    };
+    if (documentEdit.inserted.length === 0) {
+      documentEdit.inserted = [''];
     }
+    documentEdits.push(documentEdit);
   }
-  return -1;
+  return documentEdits;
 };
 
 // @ts-ignore
-const handleMouseMoveWithAltKey = async (editor, x, y) => {
-  object(editor);
-  number$1(x);
-  number$1(y);
-  const position = at(editor, x, y);
-  const documentOffset = offsetAt(editor, position.rowIndex, position.columnIndex);
-  try {
-    const definition = await getDefinition(editor, documentOffset);
-    if (!definition) {
-      return editor;
-    }
-
-    // TODO make sure that editor is not disposed
-
-    const definitionStartPosition = positionAt(editor, definition.startOffset);
-    const definitionEndPosition = positionAt(editor, definition.endOffset);
-    // @ts-ignore
-    const definitionRelativeStartX = definitionStartPosition.columnIndex;
-    // @ts-ignore
-    const definitionRelativeEndX = definitionEndPosition.columnIndex;
-    // const definitionRelativeY = definitionStartPosition.rowIndex - editor.minLineY
-
-    const lineTokenMap = editor.lineCache[definitionStartPosition.rowIndex + 1];
-    if (!lineTokenMap) {
-      return editor;
-    }
-    const tokenIndex = getTokenIndex(lineTokenMap.tokens, definitionStartPosition.columnIndex);
-    if (tokenIndex === -1) {
-      return editor;
-    }
-    // .tokens
-    // await RendererProcess.invoke(
-    //   /* Viewlet.invoke */ 'Viewlet.send',
-    //   /* id */ ViewletModuleId.EditorText,
-    //   /* method */ 'highlightAsLink',
-    //   /* relativeY */ definitionRelativeY,
-    //   /* tokenIndex */ tokenIndex,
-    // )
+const applyDocumentEdits = (editor, edits) => {
+  if (!Array.isArray(edits)) {
+    warn('something is wrong with format on save', edits);
+    return editor;
+  }
+  if (edits.length === 0) {
     return editor;
-  } catch (error) {
-    // @ts-ignore
-    if (error && error.message.startsWith('Failed to execute definition provider: No definition provider found')) {
-      return editor;
-    }
-    throw error;
   }
+  const documentEdits = getDocumentEdits(editor, edits);
+  return scheduleDocumentAndCursorsSelections(editor, documentEdits);
 };
 
-// TODO adjust relative position
-// @ts-ignore
-const getSelectionFromNativeRange = (editor, range) => {
-  return new Uint32Array([range.startRowIndex, range.startColumnIndex, range.endRowIndex, range.endColumnIndex]);
+const expectedErrorMessage = 'Failed to execute formatting provider: FormattingError:';
+const isFormattingError = error => {
+  return error && error instanceof Error && error.message.startsWith(expectedErrorMessage);
 };
 
-// @ts-ignore
-const getChanges$4 = (editor, data, range) => {
-  const selection = getSelectionFromNativeRange(editor, range);
-  const selectionRange = {
-    start: {
-      rowIndex: selection[0],
-      columnIndex: selection[1]
-    },
-    end: {
-      rowIndex: selection[2],
-      columnIndex: selection[3]
+// TODO also format with cursor
+const format = async editor => {
+  try {
+    const edits = await format$1(editor);
+    return applyDocumentEdits(editor, edits);
+  } catch (error) {
+    if (isFormattingError(error)) {
+      console.error('Formatting Error:',
+      // @ts-ignore
+      error.message.slice(expectedErrorMessage.length));
+      return editor;
     }
-  };
-  const changes = [{
-    start: selectionRange.start,
-    end: selectionRange.end,
-    inserted: [data],
-    deleted: getSelectionText(editor, selectionRange),
-    origin: ContentEditableInput
-  }];
-  return changes;
-};
-const handleBeforeInputFromContentEditable = (editor, data, range) => {
-  const changes = getChanges$4(editor, data, range);
-  return scheduleDocumentAndCursorsSelections(editor, changes);
+    console.error(error);
+    const displayErrorMessage = `${error}`;
+    await editorShowMessage(editor, 0, 0, displayErrorMessage, true);
+    return editor;
+  }
 };
 
 // @ts-ignore
-
-// @ts-ignore
-const editorHandleNativeSelectionChange = (editor, range) => {
-  const selections = getSelectionFromNativeRange(editor, range);
-  return scheduleSelections(editor, selections);
+const getDefinition = async (editor, offset) => {
+  const definition = await invoke$3('ExtensionHostDefinition.executeDefinitionProvider', editor, offset);
+  return definition;
 };
 
-const state$3 = {
-  /**
-   * @type {any}
-   */
-  currentEditor: undefined,
-  hasListener: false,
-  position: {
-    rowIndex: 0,
-    columnIndex: 0
+const emptyObject = {};
+const RE_PLACEHOLDER = /\{(PH\d+)\}/g;
+const i18nString = (key, placeholders = emptyObject) => {
+  if (placeholders === emptyObject) {
+    return key;
   }
+  const replacer = (match, rest) => {
+    return placeholders[rest];
+  };
+  return key.replaceAll(RE_PLACEHOLDER, replacer);
 };
 
-// @ts-ignore
-const setEditor = editor => {
-  state$3.currentEditor = editor;
-  state$3.hasListener = true;
-};
-const clearEditor = () => {
-  state$3.currentEditor = undefined;
-  state$3.hasListener = false;
+const UiStrings$1 = {
+  GoToDefinition: 'Go to Definition',
+  NoDefinitionFound: 'No definition found',
+  NoDefinitionFoundFor: "No definition found for '{PH1}'",
+  NoTypeDefinitionFound: 'No type definition found',
+  NoTypeDefinitionFoundFor: "No type definition found for '{PH1}'",
+  NoResults: 'No Results',
+  Replace: 'Replace'
 };
-
-// @ts-ignore
-const setPosition = position => {
-  state$3.position = position;
+const noDefinitionFound = () => {
+  return i18nString(UiStrings$1.NoDefinitionFound);
 };
-const getEditor$1 = () => {
-  return state$3.currentEditor;
+const noDefinitionFoundFor = word => {
+  return i18nString(UiStrings$1.NoDefinitionFoundFor, {
+    PH1: word
+  });
 };
-const getPosition = () => {
-  return state$3.position;
+const noTypeDefinitionFoundFor = word => {
+  return i18nString(UiStrings$1.NoTypeDefinitionFoundFor, {
+    PH1: word
+  });
 };
-const hasListener = () => {
-  return state$3.hasListener;
+const noTypeDefinitionFound = () => {
+  return i18nString(UiStrings$1.NoTypeDefinitionFound);
 };
-
-// @ts-ignore
-const handlePointerCaptureLost = editor => {
-  clearEditor();
-  return editor;
+const noResults$1 = () => {
+  return i18nString(UiStrings$1.NoResults);
 };
 
 // @ts-ignore
-
-// @ts-ignore
-const getNewPercent$1 = (size, scrollBarSize, relativeX) => {
-  if (relativeX <= 0) {
-    return 0;
-  }
-  // if (relativeY <= editor.scrollBarHeight / 2) {
-  //   console.log('clicked at top')
-  //   // clicked at top
-  //   return 0
-  // }
-  if (relativeX <= size - scrollBarSize / 2) {
-    // clicked in middle
-    return relativeX / (size - scrollBarSize);
-  }
-  // clicked at bottom
-  return 1;
-};
-
-// @ts-ignore
-const handleScrollBarHorizontalMove = (state, eventX) => {
+const goTo = async ({
+  editor,
+  getLocation,
+  getNoLocationFoundMessage,
+  getErrorMessage,
+  isNoProviderFoundError
+}) => {
   const {
-    x,
-    width,
-    longestLineWidth,
-    handleOffsetX
-  } = state;
-  const spaceRight = 20; // TODO make this configurable
-  const normalizedEventX = clamp(eventX, x, x + width);
-  if (width > longestLineWidth) {
-    return {
-      ...state,
-      deltaX: 0,
-      scrollBarWidth: 0
+    selections
+  } = editor;
+  const rowIndex = selections[0];
+  const columnIndex = selections[1];
+  try {
+    const definition = await getLocation(editor, rowIndex, columnIndex);
+    // TODO if editor is already disposed at this point, do nothing
+    if (!definition) {
+      // TODO show popup that no definition was found
+      // TODO if there was an error, show popup that go to definition resulted in an error
+      const info = getWordAt(editor, rowIndex, columnIndex);
+      const message = getNoLocationFoundMessage(info);
+      return editorShowMessage(editor, rowIndex, columnIndex, message, false);
+    }
+    if (typeof definition.uri !== 'string' || typeof definition.startOffset !== 'number' || typeof definition.endOffset !== 'number') {
+      // Logger.warn('invalid definition result', definition)
+      return editor;
+    }
+    const uri = definition.uri;
+    if (uri === editor.uri) {
+      // TODO set cursor to the definition position
+      const position = positionAt(editor, definition.startOffset);
+      const selectionEdits = new Uint32Array([position.rowIndex, position.columnIndex, position.rowIndex, position.columnIndex]);
+      return scheduleSelections(editor, selectionEdits);
+    }
+    // TODO if definition.file is not of type string, show a popup that definition.file must be of type string
+    // TODO open file and scroll to that position and set cursor to that position
+
+    const context = {
+      startRowIndex: definition.startRowIndex,
+      startColumnIndex: definition.startColumnIndex,
+      endRowIndex: definition.endRowIndex,
+      endColumnIndex: definition.endColumnIndex
     };
+    await invoke$3(/* Main.openUri */'Main.openUri', /* uri */uri, /* focus */true, context);
+    return editor;
+  } catch (error) {
+    // TODO if editor is already disposed at this point, do nothing
+    if (isNoProviderFoundError(error)) {
+      const displayErrorMessage = getErrorMessage(error);
+      await editorShowMessage(editor, rowIndex, columnIndex, displayErrorMessage, false);
+      return editor;
+    }
+    // @ts-ignore
+    // ErrorHandling.handleError(error, false)
+    const displayErrorMessage = getErrorMessage(error);
+    await editorShowMessage(editor, rowIndex, columnIndex, displayErrorMessage, true);
+    return editor;
   }
-  const relativeX = normalizedEventX - x - handleOffsetX;
-  const scrollBarWidth = getScrollBarWidth(width, longestLineWidth);
-  const finalDeltaX = longestLineWidth - width + spaceRight;
-  const newPercent = getNewPercent$1(width, scrollBarWidth, relativeX);
-  const clampedPercent = clamp(newPercent, 0, 1);
-  const newDeltaX = clampedPercent * finalDeltaX;
-  return {
-    ...state,
-    deltaX: newDeltaX
-  };
 };
 
-// @ts-ignore
+// TODO race condition, check that editor hasn't been closed in the meantime
 
-// TODO duplicate code with vertical pointer down event listener
+// TODO in case of error should show message "Definition Error: Cannot ready Property x of undefined"
 
-// @ts-ignore
-const handleScrollBarHorizontalPointerDown = (state, eventX) => {
-  // @ts-ignore
-  const {
-    x,
-    deltaX,
-    width,
-    finalDeltaY,
-    height,
-    scrollBarHeight,
-    longestLineWidth
-  } = state;
-  const relativeX = eventX - x;
-  const scrollBarWidth = getScrollBarWidth(width, longestLineWidth);
-  const finalDeltaX = width - scrollBarWidth;
-  const currentScrollBarX = getScrollBarOffset(deltaX, finalDeltaX, width, scrollBarWidth);
-  const diff = relativeX - currentScrollBarX;
-  if (diff >= 0 && diff < scrollBarWidth) {
-    return {
-      ...state,
-      handleOffsetX: diff
-    };
-  }
-  const {
-    percent,
-    handleOffset
-  } = getNewDeltaPercent(width, scrollBarWidth, relativeX);
-  const newDeltaX = percent * finalDeltaX;
-  return {
-    ...state,
-    handleOffsetX: handleOffset,
-    deltaX: newDeltaX
-  };
-};
+// TODO show some kind of message maybe ("No Definition found")
 
-// @ts-ignore
+// TODO possible to do this with events/state machine instead of promises -> enables canceling operations / concurrent calls
+
+// TODO there are still race conditions in this function:
+// - when open is called twice, previous dom nodes can either be reused or the previous dom nodes must be disposed
 
 // @ts-ignore
-const getNewPercent = (state, relativeY) => {
-  const {
-    height,
-    scrollBarHeight
-  } = state;
-  // if (relativeY <= editor.scrollBarHeight / 2) {
-  //   console.log('clicked at top')
-  //   // clicked at top
-  //   return 0
-  // }
-  if (relativeY <= height - scrollBarHeight / 2) {
-    // clicked in middle
-    return relativeY / (height - scrollBarHeight);
-  }
-  // clicked at bottom
-  return 1;
+const getLocation$1 = async (editor, rowIndex, columnIndex) => {
+  const offset = offsetAt(editor, rowIndex, columnIndex);
+  const definition = await getDefinition(editor, offset);
+  return definition;
 };
 
 // @ts-ignore
-const handleScrollBarMove = (state, eventY) => {
-  const {
-    y,
-    finalDeltaY,
-    handleOffset
-  } = state;
-  const relativeY = eventY - y - handleOffset;
-  const newPercent = getNewPercent(state, relativeY);
-  const newDeltaY = newPercent * finalDeltaY;
-  return setDeltaYFixedValue$1(state, newDeltaY);
+const getNoLocationFoundMessage$1 = info => {
+  if (info.word) {
+    return noDefinitionFoundFor(info.word);
+  }
+  return noDefinitionFound();
 };
-const handleScrollBarVerticalPointerMove = handleScrollBarMove;
 
 // @ts-ignore
-
-// TODO scrollbar position can be in interval [0, editor.height - editor.scrollBarHeight]
-// when clicked at y <= editor.scrollbarHeight/2, position is set to zero
-// when clicked at y >= editor.height - editor.scrollBarHeight/2, position is set to (editor.height - scrollBarHeight/2)
-// when clicked at y > editor.height - editor.scrollBarHeight/2, position scrollbar at (y - scrollbarHeight/2)
-// additionally, when clicked on scrollbar, scrollbar position shouldn't move
+const getErrorMessage$3 = error => {
+  // if (
+  //   error &&
+  //   error.message &&
+  //   error.message.startsWith('Failed to execute definition provider: ')
+  // ) {
+  //   return error.message.replace('Failed to execute definition provider: ', '')
+  // }
+  return `${error}`;
+};
 
 // @ts-ignore
-const handleScrollBarPointerDown = (state, eventY) => {
-  const {
-    y,
-    deltaY,
-    finalDeltaY,
-    height,
-    scrollBarHeight
-  } = state;
-  const relativeY = eventY - y;
-  const currentScrollBarY = getScrollBarY(deltaY, finalDeltaY, height, scrollBarHeight);
-  const diff = relativeY - currentScrollBarY;
-  if (diff >= 0 && diff < scrollBarHeight) {
-    return {
-      ...state,
-      handleOffset: diff
-    };
-  }
-  const {
-    percent,
-    handleOffset
-  } = getNewDeltaPercent(height, scrollBarHeight, relativeY);
-  const newDeltaY = percent * finalDeltaY;
-  return {
-    ...setDeltaYFixedValue$1(state, newDeltaY),
-    handleOffset
-  };
+const isNoProviderFoundError$1 = error => {
+  return error &&
+  // @ts-ignore
+  error.message &&
+  // @ts-ignore
+  error.message.startsWith('Failed to execute definition provider: No definition provider found');
 };
-
-const state$2 = {
-  touchOffsetY: 0,
-  deltaY: 0
+const goToDefinition = editor => {
+  return goTo({
+    editor,
+    getLocation: getLocation$1,
+    getNoLocationFoundMessage: getNoLocationFoundMessage$1,
+    getErrorMessage: getErrorMessage$3,
+    isNoProviderFoundError: isNoProviderFoundError$1
+  });
 };
 
-// @ts-ignore
-const handleTouchStart = (editor, touchEvent) => {
-  if (touchEvent.touches.length === 0) {
-    return;
+const getNoLocationFoundMessage = info => {
+  if (info.word) {
+    return noTypeDefinitionFoundFor(info.word);
   }
-  const firstTouch = touchEvent.touches[0];
-  state$2.touchOffsetY = firstTouch.y;
-  state$2.deltaY = editor.deltaY;
-  // const position = EditorPosition.at(editor, firstTouch.x, firstTouch.y)
-  // EditorMoveSelection.state.position = position
-  // state.date = Date.now()
+  return noTypeDefinitionFound();
 };
 
-const LessThan = -1;
-const Equal = 0;
-const GreaterThan = 1;
+const getTypeDefinition = async (editor, offset) => {
+  const definition = await invoke$3('ExtensionHostTypeDefinition.executeTypeDefinitionProvider', editor, offset);
+  return definition;
+};
 
-// @ts-ignore
+const getLocation = async (editor, rowIndex, columnIndex) => {
+  const offset = offsetAt(editor, rowIndex, columnIndex);
+  const definition = await getTypeDefinition(editor, offset);
+  return definition;
+};
 
 // @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;
+const getErrorMessage$2 = error => {
+  // if (
+  //   error &&
+  //   error.message &&
+  //   error.message.startsWith('Failed to execute type definition provider: ')
+  // ) {
+  //   return error.message.replace(
+  //     'Failed to execute type definition provider: ',
+  //     ''
+  //   )
+  // }
+  return `${error}`;
+};
+const isNoProviderFoundError = error => {
+  return error &&
+  // @ts-ignore
+  error.message &&
+  // @ts-ignore
+  error.message.startsWith('Failed to execute type definition provider: No type definition provider found');
+};
+const goToTypeDefinition = (editor, explicit = true) => {
+  return goTo({
+    editor,
+    getLocation,
+    getNoLocationFoundMessage: getNoLocationFoundMessage,
+    isNoProviderFoundError,
+    getErrorMessage: getErrorMessage$2
+  });
 };
 
-// @ts-ignore
-const editorMoveSelectionBackwards = (anchor, position) => {
-  return new Uint32Array([anchor.rowIndex, anchor.columnIndex, position.rowIndex, position.columnIndex]);
+const Editor = 3;
+
+const handleContextMenu = async (editor, button, x, y) => {
+  await invoke$3(/* ContextMenu.show */'ContextMenu.show', /* x */x, /* y */y, /* id */Editor);
+  return editor;
 };
 
 // @ts-ignore
-const editorMoveSelectionEqual = (anchor, position) => {
-  return new Uint32Array([position.rowIndex, position.columnIndex, position.rowIndex, position.columnIndex]);
-};
+
+// match all words, including umlauts, see https://stackoverflow.com/questions/5436824/matching-accented-characters-with-javascript-regexes/#answer-11550799
+const RE_WORD_START = /^[a-z\u00C0-\u017F\d]+/i;
+const RE_WORD_END = /[a-z\u00C0-\u017F\d]+$/i;
 
 // @ts-ignore
-const editorMoveSelectionForwards = (anchor, position) => {
-  return new Uint32Array([anchor.rowIndex, anchor.columnIndex, position.rowIndex, position.columnIndex]);
+const getNewSelections$7 = (line, rowIndex, columnIndex) => {
+  const before = line.slice(0, columnIndex);
+  const after = line.slice(columnIndex);
+  const beforeMatch = before.match(RE_WORD_END);
+  const afterMatch = after.match(RE_WORD_START);
+  const columnStart = columnIndex - (beforeMatch ? beforeMatch[0].length : 0);
+  const columnEnd = columnIndex + (afterMatch ? afterMatch[0].length : 0);
+  const newSelections = new Uint32Array([rowIndex, columnStart, rowIndex, columnEnd]);
+  return newSelections;
 };
 
 // @ts-ignore
-const getNewSelections$5 = (anchor, position) => {
-  switch (compare(position, anchor)) {
-    case LessThan:
-      return editorMoveSelectionBackwards(anchor, position);
-    case Equal:
-      return editorMoveSelectionEqual(anchor, position);
-    case GreaterThan:
-      return editorMoveSelectionForwards(anchor, position);
-    default:
-      throw new Error('unexpected comparison result');
+const selectWord = (editor, rowIndex, columnIndex) => {
+  const line = getLine(editor, rowIndex);
+  const newSelections = getNewSelections$7(line, rowIndex, columnIndex);
+  return scheduleSelections(editor, newSelections);
+};
+
+const handleDoubleClick = (editor, modifier, x, y) => {
+  const position = at(editor, x, y);
+  return selectWord(editor, position.rowIndex, position.columnIndex);
+};
+
+const WhenExpressionEditorText = 12;
+const handleFocus = editor => {
+  // TODO make change events functional,
+  // when rendering, send focus changes to renderer worker
+  invoke$3('Focus.setFocus', WhenExpressionEditorText);
+  return editor;
+};
+
+const Single = 1;
+const Double = 2;
+const Triple = 3;
+
+const state$3 = {
+  position: {
+    rowIndex: 0,
+    columnIndex: 0
   }
 };
+const getPosition$1 = () => {
+  return state$3.position;
+};
 
 // @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 setPosition$1 = position => {
+  state$3.position = position;
 };
 
-const LONG_TOUCH_THRESHOLD = 150;
+const Ctrl = 1;
+const Alt = 2;
 
-// @ts-ignore
-const handleTouchEnd = (editor, touchEvent) => {
-  if (touchEvent.changedTouches.length === 0) {
-    return;
-  }
-  const firstTouch = touchEvent.changedTouches[0];
-  const position = at(editor, firstTouch.x, firstTouch.y);
-  // @ts-ignore
-  if (undefined.position.rowIndex === position.rowIndex && undefined.position.columnIndex === position.columnIndex) {
-    // @ts-ignore
-    if (Date.now() - state$2.date > LONG_TOUCH_THRESHOLD) {
-      selectWord(editor, position.rowIndex, position.columnIndex);
-    } else {
-      // @ts-ignore
-      cursorSet(editor, position);
+// TODO first change cursor position, then run go to definition
+// cursor should appear at mousedown position immediately
+const handleSingleClickWithAlt = async (editor, position) => {
+  const {
+    rowIndex,
+    columnIndex
+  } = position;
+  const newEditor = {
+    ...editor,
+    selections: new Uint32Array([rowIndex, columnIndex, rowIndex, columnIndex])
+  };
+  // TODO rectangular selection with alt click,
+  // but also go to definition with alt click
+  const newEditor2 = await goToDefinition(newEditor);
+  return newEditor2;
+};
+const handleSingleClickWithCtrl = async (editor, position) => {
+  const selections = editor.selections;
+  for (let i = 0; i < selections.length; i += 4) {
+    const [selectionStartRow, selectionStartColumn, selectionEndRow, selectionEndColumn] = getSelectionPairs(selections, i);
+    if (selectionStartRow === position.rowIndex && selectionStartColumn === position.columnIndex && selectionEndRow === position.rowIndex && selectionEndColumn === position.columnIndex) {
+      // selection exists -> remove
+      const newSelections = new Uint32Array(selections.length - 4);
+      newSelections.set(selections.subarray(0, i), 0);
+      newSelections.set(selections.subarray(i + 4), i);
+      return scheduleSelections(editor, newSelections);
     }
-  } else {
-    console.log('different position');
   }
+  // TODO selection does not exist -> add
+  // TODO insert in order
+  const newSelections = new Uint32Array(selections.length + 4);
+  newSelections.set(selections, 0);
+  const insertIndex = selections.length;
+  newSelections[insertIndex] = position.rowIndex;
+  newSelections[insertIndex + 1] = position.columnIndex;
+  newSelections[insertIndex + 2] = position.rowIndex;
+  newSelections[insertIndex + 3] = position.columnIndex;
+  return scheduleSelections(editor, newSelections);
+};
+const handleSingleClickDefault = (editor, position) => {
+  setPosition$1(position);
+  return {
+    ...editor,
+    selections: new Uint32Array([position.rowIndex, position.columnIndex, position.rowIndex, position.columnIndex]),
+    focused: true
+  };
+};
+const getFn = modifier => {
+  switch (modifier) {
+    case Alt:
+      return handleSingleClickWithAlt;
+    case Ctrl:
+      return handleSingleClickWithCtrl;
+    default:
+      return handleSingleClickDefault;
+  }
+};
+const handleSingleClick = async (editor, modifier, x, y) => {
+  object(editor);
+  number$1(modifier);
+  number$1(x);
+  number$1(y);
+  const position = at(editor, x, y);
+  const fn = getFn(modifier);
+  const newEditor = await fn(editor, position);
+  // switch (newEditor.completionState) {
+  //   case EditorCompletionState.None:
+  //   case EditorCompletionState.Visible:
+  //   case EditorCompletionState.Loading:
+  //     return {
+  //       newState: newEditor,
+  //       commands: [],
+  //     }
+  //   default:
+  //     break
+  // }
+  return newEditor;
 };
 
 // @ts-ignore
-const setDeltaY = (editor, deltaY) => {
-  return setDeltaY$1(editor, deltaY);
+
+// @ts-ignore
+const getNewSelections$6 = (line, rowIndex) => {
+  // TODO handle virtual space when columnIndex is greater than line length
+  return new Uint32Array([rowIndex, 0, rowIndex, line.length]);
 };
 
 // @ts-ignore
-const setDeltaYFixedValue = (editor, deltaY) => {
-  return setDeltaYFixedValue$1(editor, deltaY);
+const selectLine = editor => {
+  const selections = editor.selections;
+  const rowIndex = selections[editor.primarySelectionIndex];
+  const line = getLine(editor, rowIndex);
+  const newSelections = getNewSelections$6(line, rowIndex);
+  return scheduleSelections(editor, newSelections);
 };
 
+// TODO rowIndex and columnIndex should already be set because of singleClick which occurred before triple click
 // @ts-ignore
-const setDelta = (editor, deltaMode, eventDeltaX, eventDeltaY) => {
-  number$1(deltaMode);
-  number$1(eventDeltaX);
-  number$1(eventDeltaY);
-  // @ts-ignore
-  const {
-    deltaX,
-    deltaY
-  } = editor;
-  if (eventDeltaX === 0) {
-    return setDeltaY(editor, eventDeltaY);
-  }
-  const newDeltaX = clamp(deltaX + eventDeltaX, 0, Number.POSITIVE_INFINITY);
+const handleTripleClick = (editor, modifier, x, y) => {
+  object(editor);
+  number$1(x);
+  number$1(y);
   return {
-    ...setDeltaY(editor, eventDeltaY),
-    deltaX: newDeltaX
+    newState: selectLine(editor),
+    commands: []
   };
 };
 
-// @ts-ignore
-const handleTouchMove = (editor, touchEvent) => {
-  if (touchEvent.touches.length === 0) {
-    return;
+const handleMouseDown = (state, modifier, x, y, detail) => {
+  switch (detail) {
+    case Single:
+      return handleSingleClick(state, modifier, x, y);
+    case Double:
+      return handleDoubleClick(state, modifier, x, y);
+    case Triple:
+      return handleTripleClick(state, modifier, x, y);
+    default:
+      return state;
   }
-  const firstTouch = touchEvent.touches[0];
-  const offsetY = state$2.deltaY + (state$2.touchOffsetY - firstTouch.y);
-  setDeltaYFixedValue(editor, offsetY);
+};
+
+const state$2 = {
+  timeout: -1,
+  x: 0,
+  y: 0,
+  editor: undefined
+};
+const get$2 = () => {
+  return state$2;
+};
+const set$2 = (editor, timeout, x, y) => {
+  state$2.editor = editor;
+  state$2.timeout = timeout;
+  state$2.x = x;
+  state$2.y = y;
+};
+
+const showHover$1 = async (editor, position) => {
+  // TODO race condition
+  // await Viewlet.closeWidget(ViewletModuleId.EditorHover)
+  // await Viewlet.openWidget(ViewletModuleId.EditorHover, position)
+};
+
+// TODO several things can happen:
+// 1. highlight link when alt key is pressed
+// 2. show hover info
+// 3. selection moves
+// 4. highlight go to definition
+// 5. show color picker
+// 6. show error info
+
+const onHoverIdle = async () => {
+  const {
+    x,
+    y,
+    editor
+  } = get$2();
+  at(editor, x, y);
+  await showHover$1();
+};
+const hoverDelay = 300;
+
+// @ts-ignore
+const handleMouseMove = (editor, x, y) => {
+  if (!editor.hoverEnabled) {
+    return editor;
+  }
+  const oldState = get$2();
+  if (oldState.timeout !== -1) {
+    clearTimeout(oldState.timeout);
+  }
+  const timeout = setTimeout(onHoverIdle, hoverDelay);
+  set$2(editor, timeout, x, y);
+  return editor;
+};
+
+// @ts-ignore
+const getTokenIndex = (tokens, offset) => {
+  let currentOffset = 0;
+  for (let i = 0; i < tokens.length; i++) {
+    const token = tokens[i];
+    currentOffset += token.length;
+    if (currentOffset >= offset) {
+      return i;
+    }
+  }
+  return -1;
+};
+
+// @ts-ignore
+const handleMouseMoveWithAltKey = async (editor, x, y) => {
+  object(editor);
+  number$1(x);
+  number$1(y);
+  const position = at(editor, x, y);
+  const documentOffset = offsetAt(editor, position.rowIndex, position.columnIndex);
+  try {
+    const definition = await getDefinition(editor, documentOffset);
+    if (!definition) {
+      return editor;
+    }
+
+    // TODO make sure that editor is not disposed
+
+    const definitionStartPosition = positionAt(editor, definition.startOffset);
+    const definitionEndPosition = positionAt(editor, definition.endOffset);
+    // @ts-ignore
+    const definitionRelativeStartX = definitionStartPosition.columnIndex;
+    // @ts-ignore
+    const definitionRelativeEndX = definitionEndPosition.columnIndex;
+    // const definitionRelativeY = definitionStartPosition.rowIndex - editor.minLineY
+
+    const lineTokenMap = editor.lineCache[definitionStartPosition.rowIndex + 1];
+    if (!lineTokenMap) {
+      return editor;
+    }
+    const tokenIndex = getTokenIndex(lineTokenMap.tokens, definitionStartPosition.columnIndex);
+    if (tokenIndex === -1) {
+      return editor;
+    }
+    // .tokens
+    // await RendererProcess.invoke(
+    //   /* Viewlet.invoke */ 'Viewlet.send',
+    //   /* id */ ViewletModuleId.EditorText,
+    //   /* method */ 'highlightAsLink',
+    //   /* relativeY */ definitionRelativeY,
+    //   /* tokenIndex */ tokenIndex,
+    // )
+    return editor;
+  } catch (error) {
+    // @ts-ignore
+    if (error && error.message.startsWith('Failed to execute definition provider: No definition provider found')) {
+      return editor;
+    }
+    throw error;
+  }
+};
+
+// TODO adjust relative position
+// @ts-ignore
+const getSelectionFromNativeRange = (editor, range) => {
+  return new Uint32Array([range.startRowIndex, range.startColumnIndex, range.endRowIndex, range.endColumnIndex]);
+};
+
+// @ts-ignore
+const getChanges$4 = (editor, data, range) => {
+  const selection = getSelectionFromNativeRange(editor, range);
+  const selectionRange = {
+    start: {
+      rowIndex: selection[0],
+      columnIndex: selection[1]
+    },
+    end: {
+      rowIndex: selection[2],
+      columnIndex: selection[3]
+    }
+  };
+  const changes = [{
+    start: selectionRange.start,
+    end: selectionRange.end,
+    inserted: [data],
+    deleted: getSelectionText(editor, selectionRange),
+    origin: ContentEditableInput
+  }];
+  return changes;
+};
+const handleBeforeInputFromContentEditable = (editor, data, range) => {
+  const changes = getChanges$4(editor, data, range);
+  return scheduleDocumentAndCursorsSelections(editor, changes);
+};
+
+// @ts-ignore
+
+// @ts-ignore
+const editorHandleNativeSelectionChange = (editor, range) => {
+  const selections = getSelectionFromNativeRange(editor, range);
+  return scheduleSelections(editor, selections);
+};
+
+const state$1 = {
+  /**
+   * @type {any}
+   */
+  currentEditor: undefined,
+  hasListener: false,
+  position: {
+    rowIndex: 0,
+    columnIndex: 0
+  }
+};
+
+// @ts-ignore
+const setEditor = editor => {
+  state$1.currentEditor = editor;
+  state$1.hasListener = true;
+};
+const clearEditor = () => {
+  state$1.currentEditor = undefined;
+  state$1.hasListener = false;
+};
+
+// @ts-ignore
+const setPosition = position => {
+  state$1.position = position;
+};
+const getEditor$1 = () => {
+  return state$1.currentEditor;
+};
+const getPosition = () => {
+  return state$1.position;
+};
+const hasListener = () => {
+  return state$1.hasListener;
+};
+
+// @ts-ignore
+const handlePointerCaptureLost = editor => {
+  clearEditor();
+  return editor;
+};
+
+// @ts-ignore
+
+// @ts-ignore
+const getNewPercent$1 = (size, scrollBarSize, relativeX) => {
+  if (relativeX <= 0) {
+    return 0;
+  }
+  // if (relativeY <= editor.scrollBarHeight / 2) {
+  //   console.log('clicked at top')
+  //   // clicked at top
+  //   return 0
+  // }
+  if (relativeX <= size - scrollBarSize / 2) {
+    // clicked in middle
+    return relativeX / (size - scrollBarSize);
+  }
+  // clicked at bottom
+  return 1;
+};
+
+// @ts-ignore
+const handleScrollBarHorizontalMove = (state, eventX) => {
+  const {
+    x,
+    width,
+    longestLineWidth,
+    handleOffsetX
+  } = state;
+  const spaceRight = 20; // TODO make this configurable
+  const normalizedEventX = clamp(eventX, x, x + width);
+  if (width > longestLineWidth) {
+    return {
+      ...state,
+      deltaX: 0,
+      scrollBarWidth: 0
+    };
+  }
+  const relativeX = normalizedEventX - x - handleOffsetX;
+  const scrollBarWidth = getScrollBarWidth(width, longestLineWidth);
+  const finalDeltaX = longestLineWidth - width + spaceRight;
+  const newPercent = getNewPercent$1(width, scrollBarWidth, relativeX);
+  const clampedPercent = clamp(newPercent, 0, 1);
+  const newDeltaX = clampedPercent * finalDeltaX;
+  return {
+    ...state,
+    deltaX: newDeltaX
+  };
+};
+
+// @ts-ignore
+
+// TODO duplicate code with vertical pointer down event listener
+
+// @ts-ignore
+const handleScrollBarHorizontalPointerDown = (state, eventX) => {
+  // @ts-ignore
+  const {
+    x,
+    deltaX,
+    width,
+    finalDeltaY,
+    height,
+    scrollBarHeight,
+    longestLineWidth
+  } = state;
+  const relativeX = eventX - x;
+  const scrollBarWidth = getScrollBarWidth(width, longestLineWidth);
+  const finalDeltaX = width - scrollBarWidth;
+  const currentScrollBarX = getScrollBarOffset(deltaX, finalDeltaX, width, scrollBarWidth);
+  const diff = relativeX - currentScrollBarX;
+  if (diff >= 0 && diff < scrollBarWidth) {
+    return {
+      ...state,
+      handleOffsetX: diff
+    };
+  }
+  const {
+    percent,
+    handleOffset
+  } = getNewDeltaPercent(width, scrollBarWidth, relativeX);
+  const newDeltaX = percent * finalDeltaX;
+  return {
+    ...state,
+    handleOffsetX: handleOffset,
+    deltaX: newDeltaX
+  };
+};
+
+// @ts-ignore
+
+// @ts-ignore
+const getNewPercent = (state, relativeY) => {
+  const {
+    height,
+    scrollBarHeight
+  } = state;
+  // if (relativeY <= editor.scrollBarHeight / 2) {
+  //   console.log('clicked at top')
+  //   // clicked at top
+  //   return 0
+  // }
+  if (relativeY <= height - scrollBarHeight / 2) {
+    // clicked in middle
+    return relativeY / (height - scrollBarHeight);
+  }
+  // clicked at bottom
+  return 1;
+};
+
+// @ts-ignore
+const handleScrollBarMove = (state, eventY) => {
+  const {
+    y,
+    finalDeltaY,
+    handleOffset
+  } = state;
+  const relativeY = eventY - y - handleOffset;
+  const newPercent = getNewPercent(state, relativeY);
+  const newDeltaY = newPercent * finalDeltaY;
+  return setDeltaYFixedValue$1(state, newDeltaY);
+};
+const handleScrollBarVerticalPointerMove = handleScrollBarMove;
+
+// @ts-ignore
+
+// TODO scrollbar position can be in interval [0, editor.height - editor.scrollBarHeight]
+// when clicked at y <= editor.scrollbarHeight/2, position is set to zero
+// when clicked at y >= editor.height - editor.scrollBarHeight/2, position is set to (editor.height - scrollBarHeight/2)
+// when clicked at y > editor.height - editor.scrollBarHeight/2, position scrollbar at (y - scrollbarHeight/2)
+// additionally, when clicked on scrollbar, scrollbar position shouldn't move
+
+// @ts-ignore
+const handleScrollBarPointerDown = (state, eventY) => {
+  const {
+    y,
+    deltaY,
+    finalDeltaY,
+    height,
+    scrollBarHeight
+  } = state;
+  const relativeY = eventY - y;
+  const currentScrollBarY = getScrollBarY(deltaY, finalDeltaY, height, scrollBarHeight);
+  const diff = relativeY - currentScrollBarY;
+  if (diff >= 0 && diff < scrollBarHeight) {
+    return {
+      ...state,
+      handleOffset: diff
+    };
+  }
+  const {
+    percent,
+    handleOffset
+  } = getNewDeltaPercent(height, scrollBarHeight, relativeY);
+  const newDeltaY = percent * finalDeltaY;
+  return {
+    ...setDeltaYFixedValue$1(state, newDeltaY),
+    handleOffset
+  };
+};
+
+const state = {
+  touchOffsetY: 0,
+  deltaY: 0
+};
+
+// @ts-ignore
+const handleTouchStart = (editor, touchEvent) => {
+  if (touchEvent.touches.length === 0) {
+    return;
+  }
+  const firstTouch = touchEvent.touches[0];
+  state.touchOffsetY = firstTouch.y;
+  state.deltaY = editor.deltaY;
+  // const position = EditorPosition.at(editor, firstTouch.x, firstTouch.y)
+  // EditorMoveSelection.state.position = position
+  // state.date = Date.now()
+};
+
+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 LessThan:
+      return editorMoveSelectionBackwards(anchor, position);
+    case Equal:
+      return editorMoveSelectionEqual(anchor, position);
+    case GreaterThan:
+      return editorMoveSelectionForwards(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 LONG_TOUCH_THRESHOLD = 150;
+
+// @ts-ignore
+const handleTouchEnd = (editor, touchEvent) => {
+  if (touchEvent.changedTouches.length === 0) {
+    return;
+  }
+  const firstTouch = touchEvent.changedTouches[0];
+  const position = at(editor, firstTouch.x, firstTouch.y);
+  // @ts-ignore
+  if (undefined.position.rowIndex === position.rowIndex && undefined.position.columnIndex === position.columnIndex) {
+    // @ts-ignore
+    if (Date.now() - state.date > LONG_TOUCH_THRESHOLD) {
+      selectWord(editor, position.rowIndex, position.columnIndex);
+    } else {
+      // @ts-ignore
+      cursorSet(editor, position);
+    }
+  } else {
+    console.log('different position');
+  }
+};
+
+// @ts-ignore
+const setDeltaY = (editor, deltaY) => {
+  return setDeltaY$1(editor, deltaY);
+};
+
+// @ts-ignore
+const setDeltaYFixedValue = (editor, deltaY) => {
+  return setDeltaYFixedValue$1(editor, deltaY);
+};
+
+// @ts-ignore
+const setDelta = (editor, deltaMode, eventDeltaX, eventDeltaY) => {
+  number$1(deltaMode);
+  number$1(eventDeltaX);
+  number$1(eventDeltaY);
+  // @ts-ignore
+  const {
+    deltaX,
+    deltaY
+  } = editor;
+  if (eventDeltaX === 0) {
+    return setDeltaY(editor, eventDeltaY);
+  }
+  const newDeltaX = clamp(deltaX + eventDeltaX, 0, Number.POSITIVE_INFINITY);
+  return {
+    ...setDeltaY(editor, eventDeltaY),
+    deltaX: newDeltaX
+  };
+};
+
+// @ts-ignore
+const handleTouchMove = (editor, touchEvent) => {
+  if (touchEvent.touches.length === 0) {
+    return;
+  }
+  const firstTouch = touchEvent.touches[0];
+  const offsetY = state.deltaY + (state.touchOffsetY - firstTouch.y);
+  setDeltaYFixedValue(editor, offsetY);
 };
 
 // @ts-ignore
@@ -4565,7 +4988,7 @@ const moveSelectionPx = (editor, x, y) => {
 };
 
 const create$2 = () => {
-  const completionUid = create$4();
+  const completionUid = create$5();
   const completionWidget = {
     id: Completion,
     oldState: {
@@ -4598,28 +5021,6 @@ const create$2 = () => {
   return completionWidget;
 };
 
-const OnCompletion = 'onCompletion';
-const OnHover = 'onHover';
-
-// TODO add tests for this
-const activateByEvent = async event => {
-  await invoke$3('ExtensionHostManagement.activateByEvent', event);
-};
-
-const execute = async ({
-  editor,
-  args,
-  event,
-  method,
-  noProviderFoundMessage,
-  noProviderFoundResult = undefined
-}) => {
-  const fullEvent = `${event}:${editor.languageId}`;
-  await activateByEvent(fullEvent);
-  const result = await invoke$2(method, editor.uid, ...args);
-  return result;
-};
-
 const combineResults = results => {
   return results[0] ?? [];
 };
@@ -5081,7 +5482,7 @@ const Script = 2;
 const Unknown$1 = 0;
 
 const create$1 = () => {
-  const uid = create$4();
+  const uid = create$5();
   const widget = {
     id: Find,
     oldState: {
@@ -6110,187 +6511,65 @@ const selectPreviousOccurrence = editor => {
 
 // @ts-ignore
 
-// @ts-ignore
-const getSelectUpChanges = (lines, selections) => {
-  const newSelections = new Uint32Array(selections.length);
-  for (let i = 0; i < selections.length; i += 4) {
-    const [selectionStartRow, selectionStartColumn, selectionEndRow, selectionEndColumn] = getSelectionPairs(selections, i);
-    newSelections[i] = Math.max(selectionStartRow - 1, 0);
-    newSelections[i + 1] = selectionStartColumn;
-    newSelections[i + 2] = selectionEndRow;
-    newSelections[i + 3] = selectionEndColumn;
-  }
-  return newSelections;
-};
-
-// @ts-ignore
-const selectUp = editor => {
-  const {
-    lines,
-    selections
-  } = editor;
-  const newSelections = getSelectUpChanges(lines, selections);
-  return scheduleSelections(editor, newSelections);
-};
-
-// @ts-ignore
-const selectWordLeft = editor => {
-  return editorSelectHorizontalLeft(editor, wordLeft);
-};
-
-// @ts-ignore
-const selectWordRight = editor => {
-  return editorSelectHorizontalRight(editor, wordRight);
-};
-
-// import * as ExtensionHostSelection from '../ExtensionHost/ExtensionHostSelection.ts'
-
-const getNewSelections = async (editor, selections) => {
-  const newSelections = await invoke$3('ExtensionHostSelection.executeGrowSelection', editor, selections);
-  if (newSelections.length === 0) {
-    return selections;
-  }
-  return new Uint32Array(newSelections);
-};
-const selectionGrow = async editor => {
-  const {
-    selections
-  } = editor;
-  const newSelections = await getNewSelections(editor, selections);
-  return scheduleSelections(editor, newSelections);
-};
-
-const setDecorations = (editor, decorations, diagnostics) => {
-  if (editor.decorations.length === 0 && decorations.length === 0) {
-    return editor;
-  }
-  return {
-    ...editor,
-    decorations,
-    diagnostics
-  };
-};
-
-/**
- * @enum number
- */
-const State = {
-  TopLevelContent: 1
-};
-
-/**
- * @enum number
- */
-const TokenType = {
-  Text: 1
-};
-const TokenMap = {
-  [TokenType.Text]: 'Text'
-};
-const initialLineState = {
-  state: State.TopLevelContent
-};
-const hasArrayReturn = true;
-const tokenizeLine = (line, lineState) => {
-  return {
-    tokens: [TokenType.Text, line.length],
-    state: lineState.state
-  };
-};
-
-const TokenizePlainText = {
-  __proto__: null,
-  State,
-  TokenMap,
-  TokenType,
-  hasArrayReturn,
-  initialLineState,
-  tokenizeLine
-};
-
-const state$1 = {
-  tokenizers: Object.create(null),
-  tokenizePaths: Object.create(null),
-  listeners: [],
-  pending: Object.create(null),
-  /**
-   * @type {number[]}
-   */
-  connectedEditors: []
-};
-const has = languageId => {
-  return languageId in state$1.tokenizers;
-};
-const set$3 = (languageId, tokenizer) => {
-  state$1.tokenizers[languageId] = tokenizer;
-};
-const get$3 = languageId => {
-  return state$1.tokenizers[languageId];
+// @ts-ignore
+const getSelectUpChanges = (lines, selections) => {
+  const newSelections = new Uint32Array(selections.length);
+  for (let i = 0; i < selections.length; i += 4) {
+    const [selectionStartRow, selectionStartColumn, selectionEndRow, selectionEndColumn] = getSelectionPairs(selections, i);
+    newSelections[i] = Math.max(selectionStartRow - 1, 0);
+    newSelections[i + 1] = selectionStartColumn;
+    newSelections[i + 2] = selectionEndRow;
+    newSelections[i + 3] = selectionEndColumn;
+  }
+  return newSelections;
 };
-const isPending = languageId => {
-  return languageId in state$1.pending;
+
+// @ts-ignore
+const selectUp = editor => {
+  const {
+    lines,
+    selections
+  } = editor;
+  const newSelections = getSelectUpChanges(lines, selections);
+  return scheduleSelections(editor, newSelections);
 };
 
-let enabled$1 = false;
-const setEnabled$1 = value => {
-  enabled$1 = value;
+// @ts-ignore
+const selectWordLeft = editor => {
+  return editorSelectHorizontalLeft(editor, wordLeft);
 };
-const getEnabled$1 = () => {
-  return enabled$1;
+
+// @ts-ignore
+const selectWordRight = editor => {
+  return editorSelectHorizontalRight(editor, wordRight);
 };
 
-const {
-  listen: listen$6,
-  invoke: invoke$1
-} = createRpc(SyntaxHighlightingWorker);
+// import * as ExtensionHostSelection from '../ExtensionHost/ExtensionHostSelection.ts'
 
-const tokenMaps = Object.create(null);
-const set$2 = (languageId, tokenMap) => {
-  tokenMaps[languageId] = tokenMap;
+const getNewSelections = async (editor, selections) => {
+  const newSelections = await invoke$3('ExtensionHostSelection.executeGrowSelection', editor, selections);
+  if (newSelections.length === 0) {
+    return selections;
+  }
+  return new Uint32Array(newSelections);
 };
-const get$2 = languageId => {
-  return tokenMaps[languageId] || {};
+const selectionGrow = async editor => {
+  const {
+    selections
+  } = editor;
+  const newSelections = await getNewSelections(editor, selections);
+  return scheduleSelections(editor, newSelections);
 };
 
-// TODO loadTokenizer should be invoked from renderer worker
-const loadTokenizer = async (languageId, tokenizePath) => {
-  if (!tokenizePath) {
-    return;
-  }
-  if (getEnabled$1()) {
-    const tokenMap = await invoke$1('Tokenizer.load', languageId, tokenizePath);
-    set$2(languageId, tokenMap);
-    return;
-  }
-  try {
-    // TODO check that tokenizer is valid
-    // 1. tokenizeLine should be of type function
-    // 2. getTokenClass should be of type function
-    const tokenizer = await import(tokenizePath);
-    if (typeof tokenizer.tokenizeLine !== 'function') {
-      console.warn(`tokenizer.tokenizeLine should be a function in "${tokenizePath}"`);
-      return;
-    }
-    if (!tokenizer.TokenMap || typeof tokenizer.TokenMap !== 'object' || Array.isArray(tokenizer.TokenMap)) {
-      console.warn(`tokenizer.TokenMap should be an object in "${tokenizePath}"`);
-      return;
-    }
-    set$2(languageId, tokenizer.TokenMap);
-    set$3(languageId, tokenizer);
-  } catch (error) {
-    // TODO better error handling
-    console.error(error);
-    return;
-  }
-};
-const getTokenizer = languageId => {
-  if (has(languageId)) {
-    return get$3(languageId);
-  }
-  if (isPending(languageId)) {
-    return TokenizePlainText;
+const setDecorations = (editor, decorations, diagnostics) => {
+  if (editor.decorations.length === 0 && decorations.length === 0) {
+    return editor;
   }
-  return TokenizePlainText;
+  return {
+    ...editor,
+    decorations,
+    diagnostics
+  };
 };
 
 const tokenizers = Object.create(null);
@@ -7118,467 +7397,257 @@ const editorUnindent = editor => {
     return;
   }
   // @ts-ignore
-  documentEdits.push({
-    type: /* singleLineEdit */1,
-    rowIndex: editor.cursor.rowIndex,
-    inserted: '',
-    columnIndex: 2,
-    deleted: 2
-  });
-  // @ts-ignore
-  cursorEdits.push({
-    rowIndex: editor.cursor.rowIndex,
-    columnIndex: editor.cursor.columnIndex - 2
-  });
-  // @ts-ignore
-  undefined(editor, documentEdits, cursorEdits);
-};
-// const editor = {
-//   textDocument: {
-//     lines: ['  line 1'],
-//   },
-//   cursor: {
-//     rowIndex: 0,
-//     columnIndex: 8,
-//   },
-//   selections: [
-//     {
-//       start: {
-//         rowIndex: 0,
-//         columnIndex: 0,
-//       },
-//       end: {
-//         rowIndex: 0,
-//         columnIndex: 8,
-//       },
-//     },
-//   ],
-//   tokenizer: TokenizePlainText,
-// }
-// editorUnindent(editor)
-
-// editor.lines //?
-
-const isCompletionDetailWidget = widget => {
-  return widget.id === CompletionDetail$1;
-};
-const closeDetails = editor => {
-  const {
-    widgets
-  } = editor;
-  const index = widgets.findIndex(isCompletionDetailWidget);
-  if (index === -1) {
-    return editor;
-  }
-  const newWidgets = [...widgets.slice(0, index), ...widgets.slice(index + 1)];
-  return {
-    ...editor,
-    widgets: newWidgets
-  };
-};
-
-const getCompletionState = editor => {
-  return getWidgetState(editor, Completion);
-};
-
-const isCompletion$1 = widget => {
-  return widget.id === Completion;
-};
-const focusIndex = (editor, index) => {
-  const child = getCompletionState(editor);
-  if (index === -1) {
-    return editor;
-  }
-  const childIndex = editor.widgets.findIndex(isCompletion$1);
-  // TODO scroll up/down if necessary
-  const childWidget = editor.widgets[childIndex];
-  const newWidget = {
-    ...childWidget,
-    newState: {
-      ...child,
-      focusedIndex: index,
-      focused: true
-    }
-  };
-  const newWidgets = [...editor.widgets.slice(0, childIndex), newWidget, ...editor.widgets.slice(childIndex + 1)];
-  return {
-    ...editor,
-    widgets: newWidgets
-  };
-};
-
-const focusFirst = editor => {
-  const firstIndex = 0;
-  return focusIndex(editor, firstIndex);
-};
-
-const focusNext = editor => {
-  const child = getCompletionState(editor);
-  if (!child) {
-    return editor;
-  }
-  const nextIndex = child.focusedIndex + 1;
-  return focusIndex(editor, nextIndex);
-};
-
-const focusPrevious = editor => {
-  const child = getCompletionState(editor);
-  if (!child) {
-    return editor;
-  }
-  const previousIndex = child.focusedIndex - 1;
-  return focusIndex(editor, previousIndex);
-};
-
-const create = () => {
-  const completionUid = create$4();
-  const completionWidget = {
-    id: CompletionDetail$1,
-    oldState: {
-      content: '',
-      uid: completionUid,
-      x: 0,
-      y: 0,
-      width: 0,
-      height: 0
-    },
-    newState: {
-      content: '',
-      uid: completionUid,
-      x: 0,
-      y: 0,
-      width: 0,
-      height: 0
-    }
-  };
-  return completionWidget;
-};
-
-const getCompletionDetailBounds = (completionBounds, borderSize) => {
-  return {
-    x: completionBounds.x + completionBounds.width - borderSize,
-    y: completionBounds.y,
-    width: 100,
-    height: 100
-  };
-};
-
-const openDetails = editor => {
-  const child = getCompletionState(editor);
-  if (!child) {
-    return editor;
-  }
-  // TODO avoid closure
-  const newStateGenerator = state => {
-    const borderSize = 1;
-    const newestState = {
-      ...state,
-      content: 'abc',
-      ...getCompletionDetailBounds(child, borderSize)
-    };
-    return newestState;
-  };
-  return addWidgetToEditor(CompletionDetail$1, CompletionDetail, editor, create, newStateGenerator);
-};
-
-const getEdits = async (editor, completionItem) => {
-  const child = getCompletionState(editor);
+  documentEdits.push({
+    type: /* singleLineEdit */1,
+    rowIndex: editor.cursor.rowIndex,
+    inserted: '',
+    columnIndex: 2,
+    deleted: 2
+  });
   // @ts-ignore
-  const {
-    leadingWord,
-    uid
-  } = child;
-  const word = completionItem.label;
-  const resolvedItem = await resolveCompletion(editor, word, completionItem);
-  const inserted = resolvedItem ? resolvedItem.snippet : word;
-  // TODO type and dispose commands should be sent to renderer process at the same time
-  const {
-    selections
-  } = editor;
-  const [startRowIndex, startColumnIndex] = selections;
-  const leadingWordLength = leadingWord.length;
-  const replaceRange$1 = new Uint32Array([startRowIndex, startColumnIndex - leadingWordLength, startRowIndex, startColumnIndex]);
-  const changes = replaceRange(editor, replaceRange$1, [inserted], '');
-  return changes;
+  cursorEdits.push({
+    rowIndex: editor.cursor.rowIndex,
+    columnIndex: editor.cursor.columnIndex - 2
+  });
+  // @ts-ignore
+  undefined(editor, documentEdits, cursorEdits);
 };
-const isCompletion = widget => {
-  return widget.id === Completion;
+// const editor = {
+//   textDocument: {
+//     lines: ['  line 1'],
+//   },
+//   cursor: {
+//     rowIndex: 0,
+//     columnIndex: 8,
+//   },
+//   selections: [
+//     {
+//       start: {
+//         rowIndex: 0,
+//         columnIndex: 0,
+//       },
+//       end: {
+//         rowIndex: 0,
+//         columnIndex: 8,
+//       },
+//     },
+//   ],
+//   tokenizer: TokenizePlainText,
+// }
+// editorUnindent(editor)
+
+// editor.lines //?
+
+const isCompletionDetailWidget = widget => {
+  return widget.id === CompletionDetail$1;
 };
-const select = async (editor, completionItem) => {
-  const changes = await getEdits(editor, completionItem);
-  const index = editor.widgets.indexOf
-  // ViewletModuleId.EditorCompletion
-  ();
-  if (index !== -1) {
-    editor.widgets.splice(index, 1);
-    editor.completionState = None$1;
-    editor.completionUid = 0;
-  }
-  // TODO dispose completion widget
-  // TODO apply edit in editor worker instead of asking renderer worker
-  // await RendererWorker.invoke('Viewlet.dispose', state.uid)
+const closeDetails = editor => {
   const {
     widgets
   } = editor;
-  const completionWidgetIndex = editor.widgets.findIndex(isCompletion);
-  const newWidgets = [...widgets.slice(0, completionWidgetIndex), ...widgets.slice(completionWidgetIndex + 1)];
-  const intermediateEditor = await applyEdit(editor, changes);
+  const index = widgets.findIndex(isCompletionDetailWidget);
+  if (index === -1) {
+    return editor;
+  }
+  const newWidgets = [...widgets.slice(0, index), ...widgets.slice(index + 1)];
   return {
-    ...intermediateEditor,
+    ...editor,
     widgets: newWidgets
   };
 };
-const selectIndex = (editor, index) => {
-  const child = getCompletionState(editor);
-  if (!child) {
-    return editor;
-  }
-  const {
-    items
-  } = child;
-  if (index === -1) {
-    return editor;
-  }
-  if (index > items.length) {
-    throw new Error('index too large');
-  }
-  const actualIndex = index;
-  const completionItem = items[actualIndex];
-  return select(editor, completionItem);
+
+const getCompletionState = editor => {
+  return getWidgetState(editor, Completion);
 };
 
-const selectCurrent = editor => {
+const isCompletion$1 = widget => {
+  return widget.id === Completion;
+};
+const focusIndex = (editor, index) => {
   const child = getCompletionState(editor);
-  if (!child) {
+  if (index === -1) {
     return editor;
   }
-  const {
-    focusedIndex
-  } = child;
-  return selectIndex(editor, focusedIndex);
+  const childIndex = editor.widgets.findIndex(isCompletion$1);
+  // TODO scroll up/down if necessary
+  const childWidget = editor.widgets[childIndex];
+  const newWidget = {
+    ...childWidget,
+    newState: {
+      ...child,
+      focusedIndex: index,
+      focused: true
+    }
+  };
+  const newWidgets = [...editor.widgets.slice(0, childIndex), newWidget, ...editor.widgets.slice(childIndex + 1)];
+  return {
+    ...editor,
+    widgets: newWidgets
+  };
 };
 
-const getCompletionDetailState = editor => {
-  return getWidgetState(editor, CompletionDetail$1);
+const focusFirst = editor => {
+  const firstIndex = 0;
+  return focusIndex(editor, firstIndex);
 };
 
-const toggleDetails = editor => {
-  const child = getCompletionDetailState(editor);
+const focusNext = editor => {
+  const child = getCompletionState(editor);
   if (!child) {
-    return openDetails(editor);
-  }
-  return closeDetails(editor);
-};
-
-const executeHoverProvider = (editor, offset) => {
-  object(editor);
-  number$1(offset);
-  return execute({
-    event: OnHover,
-    editor,
-    method: HoverExecute,
-    args: [offset],
-    noProviderFoundMessage: 'No hover provider found'
-  });
-};
-
-const getHover = async (editor, offset) => {
-  object(editor);
-  number$1(offset);
-  // TODO invoke extension host worker directly
-  const hover = await executeHoverProvider(editor, offset);
-  return hover;
-};
-
-let _ipc;
-const listen$5 = async () => {
-  const ipc = await create$6({
-    method: RendererProcess
-  });
-  handleIpc(ipc);
-  _ipc = ipc;
-};
-const invoke = async (method, ...args) => {
-  return invoke$5(_ipc, method, ...args);
-};
-
-const measureTextBlockHeight = (text, fontFamily, fontSize, lineHeight, width) => {
-  return invoke('MeasureTextBlockHeight.measureTextBlockHeight', text, fontSize, fontFamily, lineHeight, width);
-};
-
-const deepCopy = value => {
-  return structuredClone(value);
-};
-
-const getInitialLineState = initialLineState => {
-  return deepCopy(initialLineState);
-};
-
-const getLineInfo$1 = (line, tokens, TokenMap) => {
-  const tokensLength = tokens.length;
-  let end = 0;
-  let start = 0;
-  const lineInfo = [];
-  for (let i = 0; i < tokensLength; i += 2) {
-    const tokenType = tokens[i];
-    const tokenLength = tokens[i + 1];
-    end += tokenLength;
-    const text = line.slice(start, end);
-    const className = `Token ${TokenMap[tokenType] || 'Unknown'}`;
-    const normalizedText = text;
-    lineInfo.push(normalizedText, className);
-    start = end;
-  }
-  return lineInfo;
-};
-
-const state = {
-  warned: []
-};
-const flattenTokensArray = tokens => {
-  const flattened = [];
-  for (const token of tokens) {
-    object(token);
-    flattened.push(token.type, token.length);
-  }
-  return flattened;
-};
-const warnDeprecatedArrayReturn = (languageId, fn) => {
-  if (state.warned.includes(fn)) {
-    return;
-  }
-  state.warned.push(fn);
-  console.warn(`tokenizers without hasArrayReturn=false are deprecated (language ${languageId})`);
-};
-const safeTokenizeLine = (languageId, tokenizeLine, line, lineStateAtStart, hasArrayReturn) => {
-  try {
-    const lineState = tokenizeLine(line, lineStateAtStart);
-    if (!lineState || !lineState.tokens || !lineState.state) {
-      throw new Error('invalid tokenization result');
-    }
-    if (!hasArrayReturn) {
-      warnDeprecatedArrayReturn(languageId, tokenizeLine);
-      // workaround for old tokenizers
-      lineState.tokens = flattenTokensArray(lineState.tokens);
-    }
-    return lineState;
-  } catch (error) {
-    console.error(error);
-    return {
-      tokens: [/* type */0, /* length */line.length],
-      lineState: lineStateAtStart
-    };
+    return editor;
   }
+  const nextIndex = child.focusedIndex + 1;
+  return focusIndex(editor, nextIndex);
 };
 
-const getLineInfos = (lines, tokenizer, languageId) => {
-  const lineInfos = [];
-  const {
-    tokenizeLine,
-    initialLineState,
-    hasArrayReturn,
-    TokenMap
-  } = tokenizer;
-  let currentLineState = getInitialLineState(initialLineState);
-  for (const line of lines) {
-    const result = safeTokenizeLine(languageId, tokenizeLine, line, currentLineState, hasArrayReturn);
-    const {
-      tokens
-    } = result;
-    const lineInfo = getLineInfo$1(line, tokens, TokenMap);
-    lineInfos.push(lineInfo);
-    currentLineState = result;
+const focusPrevious = editor => {
+  const child = getCompletionState(editor);
+  if (!child) {
+    return editor;
   }
-  return lineInfos;
+  const previousIndex = child.focusedIndex - 1;
+  return focusIndex(editor, previousIndex);
 };
 
-const tokenizeCodeBlock = async (codeBlock, languageId, tokenizerPath) => {
-  await loadTokenizer(languageId, tokenizerPath);
-  const tokenizer = getTokenizer(languageId);
-  const lines = splitLines$2(codeBlock);
-  const lineInfos = getLineInfos(lines, tokenizer, languageId);
-  return lineInfos;
+const create = () => {
+  const completionUid = create$5();
+  const completionWidget = {
+    id: CompletionDetail$1,
+    oldState: {
+      content: '',
+      uid: completionUid,
+      x: 0,
+      y: 0,
+      width: 0,
+      height: 0
+    },
+    newState: {
+      content: '',
+      uid: completionUid,
+      x: 0,
+      y: 0,
+      width: 0,
+      height: 0
+    }
+  };
+  return completionWidget;
 };
 
-const getHoverPosition = (position, selections) => {
-  if (position) {
-    return position;
-  }
-  const rowIndex = selections[0];
-  const columnIndex = selections[1];
+const getCompletionDetailBounds = (completionBounds, borderSize) => {
   return {
-    rowIndex,
-    columnIndex
+    x: completionBounds.x + completionBounds.width - borderSize,
+    y: completionBounds.y,
+    width: 100,
+    height: 100
   };
 };
-const getMatchingDiagnostics = (diagnostics, rowIndex, columnIndex) => {
-  const matching = [];
-  for (const diagnostic of diagnostics) {
-    if (diagnostic.rowIndex === rowIndex) {
-      matching.push(diagnostic);
-    }
-  }
-  return matching;
-};
-const fallbackDisplayStringLanguageId = 'typescript'; // TODO remove this
 
-const hoverDocumentationFontSize = 15;
-const hoverDocumentationFontFamily = 'Fira Code';
-const hoverDocumentationLineHeight = '1.33333';
-const hoverBorderLeft = 1;
-const hoverBorderRight = 1;
-const hoverPaddingLeft = 8;
-const hoverPaddingRight = 8;
-const hovverFullWidth = 400;
-const hoverDocumentationWidth = hovverFullWidth - hoverPaddingLeft - hoverPaddingRight - hoverBorderLeft - hoverBorderRight;
-const getHoverPositionXy = (editor, rowIndex, wordStart, documentationHeight) => {
-  const x$1 = x(editor, rowIndex, wordStart);
-  const y$1 = editor.height - y(editor, rowIndex) + editor.y + 40;
-  return {
-    x: x$1,
-    y: y$1
+const openDetails = editor => {
+  const child = getCompletionState(editor);
+  if (!child) {
+    return editor;
+  }
+  // TODO avoid closure
+  const newStateGenerator = state => {
+    const borderSize = 1;
+    const newestState = {
+      ...state,
+      content: 'abc',
+      ...getCompletionDetailBounds(child, borderSize)
+    };
+    return newestState;
   };
+  return addWidgetToEditor(CompletionDetail$1, CompletionDetail, editor, create, newStateGenerator);
 };
-const getEditorHoverInfo = async (editorUid, position) => {
-  number$1(editorUid);
-  const instance = get$7(editorUid);
-  const editor = instance.newState;
+
+const getEdits = async (editor, completionItem) => {
+  const child = getCompletionState(editor);
+  // @ts-ignore
+  const {
+    leadingWord,
+    uid
+  } = child;
+  const word = completionItem.label;
+  const resolvedItem = await resolveCompletion(editor, word, completionItem);
+  const inserted = resolvedItem ? resolvedItem.snippet : word;
+  // TODO type and dispose commands should be sent to renderer process at the same time
   const {
     selections
   } = editor;
-  const {
-    rowIndex,
-    columnIndex
-  } = getHoverPosition(position, selections);
-  const offset = offsetAt(editor, rowIndex, columnIndex);
-  const hover = await getHover(editor, offset);
-  if (!hover) {
-    return undefined;
+  const [startRowIndex, startColumnIndex] = selections;
+  const leadingWordLength = leadingWord.length;
+  const replaceRange$1 = new Uint32Array([startRowIndex, startColumnIndex - leadingWordLength, startRowIndex, startColumnIndex]);
+  const changes = replaceRange(editor, replaceRange$1, [inserted], '');
+  return changes;
+};
+const isCompletion = widget => {
+  return widget.id === Completion;
+};
+const select = async (editor, completionItem) => {
+  const changes = await getEdits(editor, completionItem);
+  const index = editor.widgets.indexOf
+  // ViewletModuleId.EditorCompletion
+  ();
+  if (index !== -1) {
+    editor.widgets.splice(index, 1);
+    editor.completionState = None$1;
+    editor.completionUid = 0;
   }
+  // TODO dispose completion widget
+  // TODO apply edit in editor worker instead of asking renderer worker
+  // await RendererWorker.invoke('Viewlet.dispose', state.uid)
   const {
-    displayString,
-    documentation,
-    displayStringLanguageId
-  } = hover;
-  const tokenizerPath = '';
-  const lineInfos = await tokenizeCodeBlock(displayString, displayStringLanguageId || fallbackDisplayStringLanguageId, tokenizerPath);
-  const wordPart = await getWordBefore(editor, rowIndex, columnIndex);
-  const wordStart = columnIndex - wordPart.length;
-  await measureTextBlockHeight(documentation, hoverDocumentationFontFamily, hoverDocumentationFontSize, hoverDocumentationLineHeight, hoverDocumentationWidth);
-  const {
-    x,
-    y
-  } = getHoverPositionXy(editor, rowIndex, wordStart);
-  const diagnostics = editor.diagnostics || [];
-  const matchingDiagnostics = getMatchingDiagnostics(diagnostics, rowIndex);
+    widgets
+  } = editor;
+  const completionWidgetIndex = editor.widgets.findIndex(isCompletion);
+  const newWidgets = [...widgets.slice(0, completionWidgetIndex), ...widgets.slice(completionWidgetIndex + 1)];
+  const intermediateEditor = await applyEdit(editor, changes);
   return {
-    lineInfos,
-    documentation,
-    x,
-    y,
-    matchingDiagnostics
+    ...intermediateEditor,
+    widgets: newWidgets
   };
 };
+const selectIndex = (editor, index) => {
+  const child = getCompletionState(editor);
+  if (!child) {
+    return editor;
+  }
+  const {
+    items
+  } = child;
+  if (index === -1) {
+    return editor;
+  }
+  if (index > items.length) {
+    throw new Error('index too large');
+  }
+  const actualIndex = index;
+  const completionItem = items[actualIndex];
+  return select(editor, completionItem);
+};
+
+const selectCurrent = editor => {
+  const child = getCompletionState(editor);
+  if (!child) {
+    return editor;
+  }
+  const {
+    focusedIndex
+  } = child;
+  return selectIndex(editor, focusedIndex);
+};
+
+const getCompletionDetailState = editor => {
+  return getWidgetState(editor, CompletionDetail$1);
+};
+
+const toggleDetails = editor => {
+  const child = getCompletionDetailState(editor);
+  if (!child) {
+    return openDetails(editor);
+  }
+  return closeDetails(editor);
+};
 
 const loadContent = async (editorUid, state, position) => {
   const hoverInfo = await getEditorHoverInfo(editorUid, position);
@@ -7709,7 +7778,7 @@ const getHoverVirtualDom = (lineInfos, documentation, diagnostics) => {
 
 const renderHoverDom = {
   isEqual(oldState, newState) {
-    return oldState.lineInfos === newState.lineInfos && oldState.documentation === newState.documentation && oldState.minLineY === newState.minLineY && oldState.maxLineY === newState.maxLineY && oldState.diagnostics === newState.diagnostics;
+    return oldState.lineInfos === newState.lineInfos && oldState.documentation === newState.documentation && oldState.diagnostics === newState.diagnostics;
   },
   apply(oldState, newState) {
     const dom = getHoverVirtualDom(newState.lineInfos, newState.documentation, newState.diagnostics);
@@ -7718,26 +7787,22 @@ const renderHoverDom = {
 };
 const renderBounds$4 = {
   isEqual(oldState, newState) {
-    return oldState.x === newState.x && oldState.y === newState.y && oldState.resizedWidth === newState.resizedWidth;
+    return oldState.x === newState.x && oldState.y === newState.y;
   },
   apply(oldState, newState) {
-    // @ts-ignore
     const {
       x,
       y,
-      width,
-      height,
-      resizedWidth,
-      uid
+      height
     } = newState;
-    console.log('apply');
-    return [SetBounds, x, y, resizedWidth, height];
+    const renderWidth = 200;
+    return [SetBounds, x, y, renderWidth, height];
   }
 };
-const render$9 = [renderHoverDom, renderBounds$4];
-const renderHover = async (oldState, newState) => {
+const render$a = [renderHoverDom, renderBounds$4];
+const renderHover = (oldState, newState) => {
   const commands = [];
-  for (const item of render$9) {
+  for (const item of render$a) {
     if (!item.isEqual(oldState, newState)) {
       commands.push(item.apply(oldState, newState));
     }
@@ -7841,10 +7906,10 @@ const getEnabled = () => {
 };
 
 const intialize = async (syntaxHighlightingEnabled, syncIncremental) => {
-  await listen$5();
+  await listen$6();
   if (syntaxHighlightingEnabled) {
     setEnabled$1(true);
-    await listen$6();
+    await listen$5();
   }
   if (syncIncremental) {
     setEnabled(true);
@@ -8132,10 +8197,10 @@ const getTokensViewport2 = (editor, startLineIndex, endLineIndex, syncIncrementa
         languageId,
         invalidStartIndex
       };
-      return invoke$1('GetTokensViewport.getTokensViewport', slimEditor, startLineIndex, endLineIndex, hasLinesToSend, id, linesToSend);
+      return invoke('GetTokensViewport.getTokensViewport', slimEditor, startLineIndex, endLineIndex, hasLinesToSend, id, linesToSend);
     }
     // TODO only send needed lines of text
-    return invoke$1('GetTokensViewport.getTokensViewport', editor, startLineIndex, endLineIndex, true, editor.id, editor.lines);
+    return invoke('GetTokensViewport.getTokensViewport', editor, startLineIndex, endLineIndex, true, editor.id, editor.lines);
   }
   return getTokensViewport(editor, startLineIndex, endLineIndex);
 };
@@ -8328,7 +8393,7 @@ const getLineInfosViewport = (editor, tokens, embeddedResults, minLineY, maxLine
     decorations,
     languageId
   } = editor;
-  const tokenMap = get$2(languageId);
+  const tokenMap = get$3(languageId);
   let offset = minLineOffset;
   const tabSize = 2;
   for (let i = minLineY; i < maxLineY; i++) {
@@ -8485,7 +8550,7 @@ const getIncrementalEdits = async (oldState, newState) => {
       const lines = newState.lines;
       const oldLine = oldState.lines[rowIndex];
       const newLine = lines[rowIndex];
-      const incrementalEdits = await invoke$1('TokenizeIncremental.tokenizeIncremental', newState.uid, newState.languageId, oldLine, newLine, rowIndex, newState.minLineY);
+      const incrementalEdits = await invoke('TokenizeIncremental.tokenizeIncremental', newState.uid, newState.languageId, oldLine, newLine, rowIndex, newState.minLineY);
       if (incrementalEdits && incrementalEdits.length === 1) {
         return incrementalEdits;
       }
@@ -8695,7 +8760,7 @@ const renderWidgets = {
   },
   multiple: true
 };
-const render$8 = [renderLines, renderSelections, renderScrollBarX, renderScrollBarY, renderFocus$1, renderDecorations, renderGutterInfo, renderWidgets];
+const render$9 = [renderLines, renderSelections, renderScrollBarX, renderScrollBarY, renderFocus$1, renderDecorations, renderGutterInfo, renderWidgets];
 const renderEditor = async id => {
   const instance = get$7(id);
   if (!instance) {
@@ -8707,7 +8772,7 @@ const renderEditor = async id => {
   } = instance;
   const commands = [];
   set$7(id, newState, newState);
-  for (const item of render$8) {
+  for (const item of render$9) {
     if (!item.isEqual(oldState, newState)) {
       const result = await item.apply(oldState, newState);
       // @ts-ignore
@@ -8919,6 +8984,7 @@ const commandMap = {
   'Editor.setLanguageId': setLanguageId,
   'Editor.setSelections': setSelections,
   'Editor.showHover': showHover,
+  'Editor.showHover2': showHover2,
   'Editor.showSourceActions': showSourceActions,
   'Editor.sortLinesAscending': sortLinesAscending,
   'Editor.tabCompletion': tabCompletion,
@@ -8945,6 +9011,7 @@ const commandMap = {
   'EditorCompletion.selectIndex': selectIndex,
   'EditorCompletion.toggleDetails': toggleDetails,
   'FindWidget.close': close$1,
+  'FindWidget.focusCloseButton': focusCloseButton,
   'FindWidget.focusFind': focusFind,
   'FindWidget.focusFirst': focusFirst$1,
   'FindWidget.focusIndex': focusIndex$1,
@@ -8966,7 +9033,6 @@ const commandMap = {
   'FindWidget.handleToggleReplaceFocus': handleToggleReplaceFocus,
   'FindWidget.loadContent': loadContent$1,
   'FindWidget.toggleReplace': toggleReplace,
-  'FindWidget.focusCloseButton': focusCloseButton,
   'Font.ensure': ensure,
   'Hover.getHoverInfo': getEditorHoverInfo,
   'Hover.handleSashPointerDown': handleSashPointerDown,
@@ -9226,10 +9292,10 @@ const renderScrollBar = {
     return [/* method */SetScrollBar, /* scrollBarY */scrollBarY, /* scrollBarHeight */scrollBarHeight];
   }
 };
-const render$7 = [renderItems, renderBounds$3, renderHeight, renderNegativeMargin, renderScrollBar];
+const render$8 = [renderItems, renderBounds$3, renderHeight, renderNegativeMargin, renderScrollBar];
 const renderCompletion = (oldState, newState) => {
   const commands = [];
-  for (const item of render$7) {
+  for (const item of render$8) {
     if (!item.isEqual(oldState, newState)) {
       commands.push(item.apply(oldState, newState));
     }
@@ -9242,7 +9308,7 @@ const removeWidget = widget => {
   return [['Viewlet.send', widget.newState.uid, 'dispose']];
 };
 
-const render$6 = widget => {
+const render$7 = widget => {
   const commands = renderCompletion(widget.oldState, widget.newState);
   const wrappedCommands = [];
   const uid = widget.newState.uid;
@@ -9251,8 +9317,8 @@ const render$6 = widget => {
   }
   return wrappedCommands;
 };
-const add$3 = widget => {
-  const commands = render$6(widget);
+const add$4 = widget => {
+  const commands = render$7(widget);
   const id = 'EditorCompletion';
   // TODO how to generate a unique integer id
   // that doesn't collide with ids created in renderer worker?
@@ -9262,7 +9328,7 @@ const add$3 = widget => {
   allCommands.push(...commands);
   return allCommands;
 };
-const remove$3 = removeWidget;
+const remove$4 = removeWidget;
 const handleEditorType = (editor, state) => {
   const {
     unfilteredItems,
@@ -9327,11 +9393,11 @@ const handleEditorDeleteLeft = (editor, state) => {
 
 const EditorCompletionWidget = {
   __proto__: null,
-  add: add$3,
+  add: add$4,
   handleEditorDeleteLeft,
   handleEditorType,
-  remove: remove$3,
-  render: render$6
+  remove: remove$4,
+  render: render$7
 };
 
 const MessagePort$1 = 1;
@@ -9882,10 +9948,10 @@ const renderBounds$2 = {
     return [/* method */SetBounds, /* x */x, /* y */y, /* width */width, /* height */height];
   }
 };
-const render$5 = [renderContent$1, renderBounds$2, renderColor, renderOffsetX];
+const render$6 = [renderContent$1, renderBounds$2, renderColor, renderOffsetX];
 const renderFull$1 = (oldState, newState) => {
   const commands = [];
-  for (const item of render$5) {
+  for (const item of render$6) {
     if (!item.isEqual(oldState, newState)) {
       commands.push(item.apply(oldState, newState));
     }
@@ -9893,7 +9959,7 @@ const renderFull$1 = (oldState, newState) => {
   return commands;
 };
 
-const render$4 = widget => {
+const render$5 = widget => {
   const commands = renderFull$1(widget.oldState, widget.newState);
   const wrappedCommands = [];
   const uid = widget.newState.uid;
@@ -9906,10 +9972,10 @@ const render$4 = widget => {
   }
   return wrappedCommands;
 };
-const add$2 = widget => {
-  return addWidget(widget, 'ColorPicker', render$4);
+const add$3 = widget => {
+  return addWidget(widget, 'ColorPicker', render$5);
 };
-const remove$2 = removeWidget;
+const remove$3 = removeWidget;
 const Commands$1 = {
   'ColorPicker.handleSliderPointerDown': handleSliderPointerDown,
   'ColorPicker.handleSliderPointerMove': handleSliderPointerMove
@@ -9918,9 +9984,9 @@ const Commands$1 = {
 const EditorColorPickerWidget = {
   __proto__: null,
   Commands: Commands$1,
-  add: add$2,
-  remove: remove$2,
-  render: render$4
+  add: add$3,
+  remove: remove$3,
+  render: render$5
 };
 
 const getCompletionDetailVirtualDom = content => {
@@ -9968,12 +10034,12 @@ const renderBounds$1 = {
     return [/* method */SetBounds, /* x */x, /* y */y, /* width */width, /* height */height];
   }
 };
-const render$3 = [renderContent, renderBounds$1];
+const render$4 = [renderContent, renderBounds$1];
 const renderFull = (oldState, newState) => {
-  return renderParts(render$3, oldState, newState);
+  return renderParts(render$4, oldState, newState);
 };
 
-const render$2 = widget => {
+const render$3 = widget => {
   const commands = renderFull(widget.oldState, widget.newState);
   const wrappedCommands = [];
   const uid = widget.newState.uid;
@@ -9986,16 +10052,16 @@ const render$2 = widget => {
   }
   return wrappedCommands;
 };
-const add$1 = widget => {
-  return addWidget(widget, 'EditorCompletionDetails', render$2);
+const add$2 = widget => {
+  return addWidget(widget, 'EditorCompletionDetails', render$3);
 };
-const remove$1 = removeWidget;
+const remove$2 = removeWidget;
 
 const EditorCompletionDetailWidget = {
   __proto__: null,
-  add: add$1,
-  remove: remove$1,
-  render: render$2
+  add: add$2,
+  remove: remove$2,
+  render: render$3
 };
 
 /**
@@ -10341,16 +10407,16 @@ const renderFocus = {
 //   },
 // }
 
-const render$1 = [renderDetails, renderBounds, renderValue, renderFocus];
+const render$2 = [renderDetails, renderBounds, renderValue, renderFocus];
 const apply = (oldState, newState) => {
   // TODO avoid side effect
   if (oldState.focus !== newState.focus) {
     setFocus(newState.focus);
   }
-  return renderParts(render$1, oldState, newState);
+  return renderParts(render$2, oldState, newState);
 };
 
-const render = widget => {
+const render$1 = widget => {
   const commands = apply(widget.oldState, widget.newState);
   const wrappedCommands = [];
   const uid = widget.newState.uid;
@@ -10363,10 +10429,10 @@ const render = widget => {
   }
   return wrappedCommands;
 };
-const add = widget => {
-  return addWidget(widget, 'FindWidget', render);
+const add$1 = widget => {
+  return addWidget(widget, 'FindWidget', render$1);
 };
-const remove = removeWidget;
+const remove$1 = removeWidget;
 const Commands = {
   'FindWidget.close': close$1,
   'FindWidget.focusNext': focusNext$1,
@@ -10381,6 +10447,31 @@ const Commands = {
 const EditorFindWidget = {
   __proto__: null,
   Commands,
+  add: add$1,
+  remove: remove$1,
+  render: render$1
+};
+
+const render = widget => {
+  const commands = renderHover(widget.oldState, widget.newState);
+  const wrappedCommands = [];
+  const uid = widget.newState.uid;
+  for (const command of commands) {
+    if (command[0] === 'Viewlet.setDom2') {
+      wrappedCommands.push([command[0], uid, ...command.slice(1)]);
+    } else {
+      wrappedCommands.push(['Viewlet.send', uid, ...command]);
+    }
+  }
+  return wrappedCommands;
+};
+const add = widget => {
+  return addWidget(widget, 'EditorHover', render);
+};
+const remove = removeWidget;
+
+const EditorHoverWidget = {
+  __proto__: null,
   add,
   remove,
   render
@@ -10391,6 +10482,7 @@ const registerWidgets = () => {
   set(Completion, EditorCompletionWidget);
   set(CompletionDetail$1, EditorCompletionDetailWidget);
   set(Find, EditorFindWidget);
+  set(Hover, EditorHoverWidget);
 };
 
 const main = async () => {