@lvce-editor/server 0.0.28 → 0.0.31

package/static/f9b8874/packages/renderer-process/dist/rendererProcessMain.js

@@ -1,3979 +0,0 @@
-const MODULE_NOTIFICATION = 2;
-const MODULE_VIEWLET_SOURCE_CONTROL = 5;
-const MODULE_VIEW_SERVICE = 9;
-const MODULE_WINDOW = 14;
-const MODULE_DEVELOPER = 15;
-const MODULE_LAYOUT = 16;
-const MODULE_PANEL = 18;
-const MODULE_WORKBENCH = 20;
-const MODULE_VIEWLET = 21;
-const MODULE_VIEWLET_TERMINAL = 22;
-const MODULE_FIND_WIDGET = 23;
-const MODULE_KEYBINDINGS = 26;
-const MODULE_MENU = 31;
-const MODULE_SESSION_STORAGE = 34;
-const MODULE_LOCAL_STORAGE = 35;
-const MODULE_DIALOG = 36;
-const MODULE_EDITOR_HOVER = 37;
-const MODULE_CSS = 38;
-const MODULE_EDITOR_RENAME = 39;
-const MODULE_EDITOR_ERROR = 40;
-const MODULE_EDITOR_CONTROLLER = 41;
-const MODULE_SERVICE_WORKER = 42;
-const MODULE_IMAGE_PREVIEW = 43;
-const MODULE_LOCATION = 44;
-const MODULE_AUDIO = 45;
-const MODULE_META = 46;
-const MODULE_DOWNLOAD = 47;
-const MODULE_OPEN = 48;
-const MODULE_CLIPBOARD = 49;
-const MODULE_INIT_DATA = 50;
-const MODULE_TEST_FRAME_WORK = 51;
-
-const state$b = {
-  commands: Object.create(null),
-  pendingModules: Object.create(null),
-};
-
-const loadModule = (moduleId) => {
-  switch (moduleId) {
-    case MODULE_NOTIFICATION:
-      return import('./Notification.ipc.js')
-    case MODULE_VIEWLET_SOURCE_CONTROL:
-      return import('./ViewletExplorer.js')
-    case MODULE_WINDOW:
-      return Promise.resolve().then(function () { return M30; })
-    case MODULE_DEVELOPER:
-      return import('./Developer.ipc.js')
-    case MODULE_LAYOUT:
-      return Promise.resolve().then(function () { return M2; })
-    case MODULE_VIEWLET:
-      return Promise.resolve().then(function () { return M6; })
-    case MODULE_VIEWLET_TERMINAL:
-      return import('./ViewletTerminal.js')
-    case MODULE_FIND_WIDGET:
-      return import('./FindWidget.ipc.js')
-    case MODULE_KEYBINDINGS:
-      return Promise.resolve().then(function () { return M7; })
-    case MODULE_MENU:
-      return import('./Menu.ipc.js')
-    case MODULE_SESSION_STORAGE:
-      return import('./SessionStorage.ipc.js')
-    case MODULE_LOCAL_STORAGE:
-      return Promise.resolve().then(function () { return M15; })
-    case MODULE_DIALOG:
-      return import('./Dialog.ipc.js')
-    case MODULE_EDITOR_HOVER:
-      return import('./EditorHover.ipc.js')
-    case MODULE_CSS:
-      return Promise.resolve().then(function () { return M1; })
-    case MODULE_EDITOR_RENAME:
-      return import('./EditorRename.ipc.js')
-    case MODULE_EDITOR_ERROR:
-      return import('./EditorError.ipc.js')
-    case MODULE_SERVICE_WORKER:
-      return Promise.resolve().then(function () { return M22; })
-    case MODULE_IMAGE_PREVIEW:
-      return import('./ImagePreview.ipc.js')
-    case MODULE_LOCATION:
-      return Promise.resolve().then(function () { return M26; })
-    case MODULE_AUDIO:
-      return import('./Audio.ipc.js')
-    case MODULE_META:
-      return import('./Meta.ipc.js')
-    case MODULE_DOWNLOAD:
-      return import('./Download.ipc.js')
-    case MODULE_OPEN:
-      return import('./Open.ipc.js')
-    case MODULE_CLIPBOARD:
-      return import('./ClipBoard.ipc.js')
-    case MODULE_INIT_DATA:
-      return import('./InitData.ipc.js')
-    case MODULE_TEST_FRAME_WORK:
-      return import('./TestFrameWork.ipc.js')
-    default:
-      throw new Error('unknown module')
-  }
-};
-
-const getOrLoadModule = (moduleId) => {
-  if (!state$b.pendingModules[moduleId]) {
-    const importPromise = loadModule(moduleId);
-    state$b.pendingModules[moduleId] = importPromise.then((module) =>
-      module.__initialize__()
-    );
-  }
-  return state$b.pendingModules[moduleId]
-};
-
-const getModuleId = (commandId) => {
-  switch (commandId) {
-    case 'TestFrameWork.showOverlay':
-    case 'TestFrameWork.performAction':
-    case 'TestFrameWork.checkSingleElementCondition':
-    case 'TestFrameWork.checkMultiElementCondition':
-    case 'TestFrameWork.performKeyBoardAction':
-      return MODULE_TEST_FRAME_WORK
-    case 'ClipBoard.readText':
-    case 'ClipBoard.writeText':
-      return MODULE_CLIPBOARD
-    case 'Developer.showState':
-    case 'Developer.getMemoryUsage':
-      return MODULE_DEVELOPER
-    case 'Download.downloadFile':
-      return MODULE_DOWNLOAD
-    case 'Open.openUrl':
-      return MODULE_OPEN
-    case 'InitData.getInitData':
-      return MODULE_INIT_DATA
-    case 549:
-    case 550:
-    case 551:
-      return MODULE_VIEW_SERVICE
-    case 'KeyBindings.hydrate':
-      return MODULE_KEYBINDINGS
-    case 764:
-    case 765:
-    case 766:
-    case 767:
-    case 768:
-    case 769:
-    case 770:
-    case 771:
-    case 772:
-    case 773:
-    case 774:
-    case 775:
-    case 776:
-    case 777:
-      return MODULE_EDITOR_CONTROLLER
-    case 'Notification.create':
-    case 'Notification.dispose':
-    case 'Notification.createWithOptions':
-      return MODULE_NOTIFICATION
-    case 'Layout.update':
-    case 'Layout.hydrate':
-    case 'Layout.hide':
-    case 'Layout.getBounds':
-    case 'Layout.show':
-      return MODULE_LAYOUT
-    case 'Viewlet.refresh':
-    case 'Viewlet.invoke':
-    case 'Viewlet.send':
-    case 'Viewlet.focus':
-    case 'Viewlet.dispose':
-    case 'Viewlet.appendViewlet':
-    case 'Viewlet.load':
-    case 'Viewlet.handleError':
-    case 'Viewlet.sendMultiple':
-      return MODULE_VIEWLET
-    case 'Audio.play':
-      return MODULE_AUDIO
-    case 'ImagePreview.create':
-    case 'ImagePreview.dispose':
-    case 'ImagePreview.update':
-    case 'ImagePreview.showError':
-      return MODULE_IMAGE_PREVIEW
-    case 'EditorError.create':
-      return MODULE_EDITOR_ERROR
-
-    case 'FindWidget.create':
-    case 'FindWidget.dispose':
-    case 'FindWidget.setResults':
-      return MODULE_FIND_WIDGET
-    case 'EditorRename.create':
-    case 'EditorRename.finish':
-    case 'EditorRename.dispose':
-      return MODULE_EDITOR_RENAME
-    case 'Css.setInlineStyle':
-      return MODULE_CSS
-    case 'Location.getPathName':
-    case 'Location.setPathName':
-    case 'Location.hydrate':
-    case 'Location.getHref':
-      return MODULE_LOCATION
-    case 'EditorHover.create':
-      return MODULE_EDITOR_HOVER
-    case 6661:
-    case 6662:
-    case 6663:
-    case 6664:
-      return MODULE_PANEL
-    case 8181:
-      return MODULE_VIEWLET_SOURCE_CONTROL
-    case 33111:
-      return MODULE_WORKBENCH
-    case 'Dialog.prompt':
-    case 'Dialog.alert':
-    case 'Dialog.showErrorDialogWithOptions':
-    case 'Dialog.close':
-      return MODULE_DIALOG
-    case 'Menu.showControlled':
-    case 'Menu.hide':
-    case 'Menu.focusIndex':
-    case 'Menu.showSubMenu':
-    case 'Menu.hideSubMenu':
-    case 'Menu.showMenu':
-    case 'Menu.showContextMenu':
-    case 'Menu.show':
-      return MODULE_MENU
-    case 'Window.reload':
-    case 'Window.minimize':
-    case 'Window.maximize':
-    case 'Window.unmaximize':
-    case 'Window.close':
-    case 'Window.setTitle':
-    case 'Window.onVisibilityChange':
-      return MODULE_WINDOW
-    case 'SessionStorage.clear':
-    case 'SessionStorage.getItem':
-    case 'SessionStorage.setItem':
-      return MODULE_SESSION_STORAGE
-    case 'LocalStorage.clear':
-    case 'LocalStorage.getItem':
-    case 'LocalStorage.setItem':
-      return MODULE_LOCAL_STORAGE
-    case 9922:
-      return MODULE_VIEWLET_TERMINAL
-    case 'Meta.setThemeColor':
-      return MODULE_META
-    case 'ServiceWorker.register':
-    case 'ServiceWorker.uninstall':
-      return MODULE_SERVICE_WORKER
-    default:
-      throw new Error(`command ${commandId} not found`)
-  }
-};
-
-const loadCommand = async (command) => {
-  await getOrLoadModule(getModuleId(command));
-};
-
-const register$1 = (commandId, listener) => {
-  state$b.commands[commandId] = listener;
-};
-
-const hasThrown = new Set();
-
-const executeCommandAsync = async (command, ...args) => {
-  try {
-    await loadCommand(command);
-  } catch (error) {
-    // @ts-ignore
-    throw new Error(`Failed to load command ${command}`, {
-      cause: error,
-    })
-  }
-  if (!(command in state$b.commands)) {
-    if (hasThrown.has(command)) {
-      return
-    }
-    hasThrown.add(command);
-    throw new Error(`Command did not register "${command}"`)
-  }
-  return execute(command, ...args)
-};
-
-const execute = (command, ...args) => {
-  if (command in state$b.commands) {
-    return state$b.commands[command](...args)
-  }
-  return executeCommandAsync(command, ...args)
-};
-
-const setInlineStyle = (id, css) => {
-  const $ExistingStyle = document.getElementById(id);
-  if ($ExistingStyle) {
-    $ExistingStyle.textContent = css;
-  } else {
-    const $Style = document.createElement('style');
-    $Style.id = id;
-    $Style.textContent = css;
-    document.head.append($Style);
-  }
-};
-
-const __initialize__$7 = () => {
-  register$1('Css.setInlineStyle', setInlineStyle);
-};
-
-var M1 = {
-  __proto__: null,
-  __initialize__: __initialize__$7
-};
-
-const callbacks = Object.create(null);
-
-const resolve = (id, result) => {
-  if (!(id in callbacks)) {
-    console.warn(`callback ${id} may already be disposed`);
-    return
-  }
-  callbacks[id].resolve(result);
-};
-
-const reject = (id, error) => {
-  if (!(id in callbacks)) {
-    console.warn(`callback ${id} may already be disposed`);
-    return
-  }
-  callbacks[id].reject(error);
-};
-
-class JsonRpcError extends Error {
-  constructor(message) {
-    super(message);
-    this.name = 'JsonRpcError';
-  }
-}
-
-// TODO treeshake out this whole module in production
-
-const getType = (value) => {
-  switch (typeof value) {
-    case 'number':
-      return 'number'
-    case 'function':
-      return 'function'
-    case 'string':
-      return 'string'
-    case 'object':
-      if (value === null) {
-        return 'null'
-      }
-      if (Array.isArray(value)) {
-        return 'array'
-      }
-      return 'object'
-    case 'boolean':
-      return 'boolean'
-    default:
-      return 'unknown'
-  }
-};
-
-const object = (value) => {
-  const type = getType(value);
-  if (type !== 'object') {
-    throw new Error('expected value to be of type object')
-  }
-};
-
-const number = (value) => {
-  const type = getType(value);
-  if (type !== 'number') {
-    throw new Error('expected value to be of type number')
-  }
-};
-
-const array = (value) => {
-  const type = getType(value);
-  if (type !== 'array') {
-    throw new Error('expected value to be of type array')
-  }
-};
-
-const string = (value) => {
-  const type = getType(value);
-  if (type !== 'string') {
-    throw new Error('expected value to be of type string')
-  }
-};
-
-const boolean = (value) => {
-  const type = getType(value);
-  if (type !== 'boolean') {
-    throw new Error('expected value to be of type boolean')
-  }
-};
-
-const create$8 = async ({ url }) => {
-  string(url);
-  const port = await new Promise((resolve) => {
-    globalThis.acceptPort = resolve;
-    import(url);
-  });
-  delete globalThis.acceptPort;
-  return port
-};
-
-var IpcParentWithMessagePort = {
-  __proto__: null,
-  create: create$8
-};
-
-const getDisplayName = (name) => {
-  if (!name) {
-    return '<unknown> worker'
-  }
-  if (name.endsWith('Worker')) {
-    return name.toLowerCase()
-  }
-  return `${name} worker`
-};
-
-const tryToGetActualErrorMessage = async ({ url, name }) => {
-  const displayName = getDisplayName(name);
-  try {
-    await import(url);
-    return `Failed to start ${displayName}: Unknown Error`
-  } catch (error) {
-    if (
-      error &&
-      error instanceof Error &&
-      error.message.startsWith('Failed to fetch dynamically imported module')
-    ) {
-      try {
-        const response = await fetch(url);
-        switch (response.status) {
-          case 404:
-            return `Failed to start ${displayName}: Not found (404)`
-          default:
-            return `Failed to start ${displayName}: Unknown Network Error`
-        }
-      } catch {
-        return `Failed to start ${displayName}: Unknown Network Error`
-      }
-    }
-    return `Failed to start ${displayName}: ${error}`
-  }
-};
-
-const isFirefoxError = (message) => {
-  return [
-    'SyntaxError: import declarations may only appear at top level of a module',
-    'SyntaxError: export declarations may only appear at top level of a module',
-  ].includes(message)
-};
-
-const create$7 = async ({ url, name }) => {
-  try {
-    const worker = new Worker(url, {
-      type: 'module',
-      name,
-    });
-    await new Promise((resolve, reject) => {
-      const cleanup = () => {
-        worker.onmessage = null;
-        worker.onerror = null;
-      };
-      const handleFirstMessage = (event) => {
-        cleanup();
-        if (event.data === 'ready') {
-          resolve(undefined);
-        } else {
-          reject(new Error('unexpected first message from renderer worker'));
-        }
-      };
-      const handleFirstError = async (event) => {
-        cleanup();
-        if (isFirefoxError(event.message)) {
-          event.preventDefault();
-          reject(new Error('module workers are not supported in firefox'));
-        } else {
-          const actualErrorMessage = await tryToGetActualErrorMessage({
-            url,
-            name,
-          });
-          reject(new Error(actualErrorMessage));
-        }
-      };
-      worker.onmessage = handleFirstMessage;
-      worker.onerror = handleFirstError;
-    });
-    return worker
-  } catch (error) {
-    if (
-      error &&
-      error instanceof Error &&
-      error.message === 'module workers are not supported in firefox'
-    ) {
-      const IpcParentWithMessagePort$1 = await Promise.resolve().then(function () { return IpcParentWithMessagePort; });
-      return IpcParentWithMessagePort$1.create({ url })
-    }
-    throw error
-  }
-};
-
-const create$6 = async (url) => {
-  const referencePort = await new Promise((resolve) => {
-    globalThis.acceptReferencePort = resolve;
-    import(url);
-  });
-  delete globalThis.acceptReferencePort;
-  return referencePort
-};
-
-// TODO lazyload these files
-
-/* istanbul ignore file */
-
-const Methods = {
-  MessagePort: 1,
-  ModuleWorker: 2,
-  ReferencePort: 3,
-};
-
-/**
- * @type {number}
- */
-const METHOD_PREFERRED = Methods.ModuleWorker;
-
-const create$5 = async ({ method, ...options }) => {
-  switch (METHOD_PREFERRED) {
-    case Methods.ModuleWorker:
-      return create$7(options)
-    case Methods.MessagePort:
-      return create$8(options)
-    case Methods.ReferencePort:
-      return create$6(options)
-    default:
-      throw new Error('unknown method')
-  }
-};
-
-/* istanbul ignore file */
-
-// TODO this should always be completely tree shaken out during build
-
-/**
- * @returns {'electron'|'remote'|'web'}
- */
-const getPlatform = () => {
-  // @ts-ignore
-  {
-    // @ts-ignore
-    return 'remote'
-  }
-};
-
-const platform = getPlatform();
-
-// TODO treeshake this function out when targeting electron
-
-const state$a = {
-  cachedIsMobileOrTablet: undefined,
-  isMobileOrTablet() {
-    // @ts-ignore
-    const userAgentData = navigator.userAgentData;
-    if (userAgentData && userAgentData.mobile) {
-      return true
-    }
-    // copied from https://stackoverflow.com/questions/11381673/detecting-a-mobile-browser
-    let check = false
-    ;(function (a) {
-      if (
-        /(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino|android|ipad|playbook|silk/i.test(
-          a
-        ) ||
-        /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw-(n|u)|c55\/|capi|ccwa|cdm-|cell|chtm|cldc|cmd-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc-s|devi|dica|dmob|do(c|p)o|ds(12|-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(-|_)|g1 u|g560|gene|gf-5|g-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd-(m|p|t)|hei-|hi(pt|ta)|hp( i|ip)|hs-c|ht(c(-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i-(20|go|ma)|i230|iac( |-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|-[a-w])|libw|lynx|m1-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[23]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|-([1-8]|c))|phil|pire|pl(ay|uc)|pn-2|po(ck|rt|se)|prox|psio|pt-g|qa-a|qc(07|12|21|32|60|-[2-7]|i-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h-|oo|p-)|sdk\/|se(c(-|0|1)|47|mc|nd|ri)|sgh-|shar|sie(-|m)|sk-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h-|v-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl-|tdg-|tel(i|m)|tim-|t-mo|to(pl|sh)|ts(70|m-|m3|m5)|tx-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas-|your|zeto|zte-/i.test(
-          a.slice(0, 4)
-        )
-      ) {
-        check = true;
-      }
-      // @ts-ignore
-    })(navigator.userAgent || navigator.vendor || window.opera);
-    return check
-  },
-  getAssetDir() {
-    // @ts-ignore
-    {
-      // @ts-ignore
-      return '/f9b8874'
-    }
-  },
-  supportsHtml5Dialog() {
-    const $Dialog = document.createElement('dialog');
-    // @ts-ignore
-    return typeof $Dialog.showModal === 'function'
-  },
-  isElectron() {
-    return (
-      // @ts-ignore
-      window.myApi &&
-      // @ts-ignore
-      window.myApi.ipcConnect &&
-      // @ts-ignore
-      typeof window.myApi.ipcConnect === 'function'
-    )
-  },
-};
-
-const isMobileOrTablet = () => {
-  return state$a.isMobileOrTablet()
-};
-
-// TODO if necessary support more browser detection
-const getBrowser = () => {
-  if (platform === 'electron') {
-    return 'electron'
-  }
-  // @ts-ignore
-  const userAgentData = navigator.userAgentData;
-  if (userAgentData) {
-    for (const brand of userAgentData.brands) {
-      const actualBrand = brand.brand.toLowerCase();
-      switch (actualBrand) {
-        case 'firefox':
-          return 'firefox'
-        case 'chromium':
-          return 'chromium'
-      }
-    }
-  }
-  const userAgent = navigator.userAgent.toLowerCase();
-  if (userAgent.includes('firefox')) {
-    return 'firefox'
-  }
-  if (userAgent.includes('Electron')) {
-    return 'electron'
-  }
-  return 'chromium'
-};
-
-const getAssetDir = () => {
-  return state$a.getAssetDir()
-};
-
-const supportsHtml5Dialog = () => {
-  return state$a.supportsHtml5Dialog()
-};
-
-const isElectron = () => {
-  return state$a.isElectron()
-};
-
-const getRendererWorkerUrl = () => {
-  const assetDir = getAssetDir();
-  const urlRendererWorker = `${assetDir}/packages/renderer-worker/src/rendererWorkerMain.js`;
-  return urlRendererWorker
-};
-
-var M18 = {
-  __proto__: null,
-  platform: platform,
-  state: state$a,
-  isMobileOrTablet: isMobileOrTablet,
-  getBrowser: getBrowser,
-  getAssetDir: getAssetDir,
-  supportsHtml5Dialog: supportsHtml5Dialog,
-  isElectron: isElectron,
-  getRendererWorkerUrl: getRendererWorkerUrl
-};
-
-// const URL_RENDERER_WORKER =
-// '/packages/renderer-worker/distmin/rendererWorkerMain-0ead0bed.js'
-
-const state$9 = {
-  /**
-   * @type {any}
-   */
-  ipc: undefined,
-};
-
-const handleMessageFromRendererWorker = async (event) => {
-  const message = event.data;
-  if (message.id) {
-    if ('method' in message) {
-      try {
-        const result = await execute(message.method, ...message.params);
-        state$9.ipc.send({
-          jsonrpc: '2.0',
-          id: message.id,
-          result,
-        });
-        return
-      } catch (error) {
-        state$9.ipc.send({
-          jsonrpc: '2.0',
-          id: message.id,
-          error,
-        });
-      }
-      return
-    }
-    if ('result' in message) {
-      resolve(message.id, message.result);
-      return
-    }
-    if ('error' in message) {
-      reject(message.id, message.error);
-      return
-    }
-  }
-  throw new JsonRpcError('unexpected message from renderer process')
-};
-
-const getIpc = async () => {
-  const rendererWorker = await create$5({
-    method: Methods.ModuleWorker,
-    url: getRendererWorkerUrl(),
-    name: 'Renderer Worker',
-  });
-  return {
-    send(message) {
-      rendererWorker.postMessage(message);
-    },
-    sendAndTransfer(message, transferables) {
-      rendererWorker.postMessage(message, transferables);
-    },
-    get onmessage() {
-      return rendererWorker.onmessage
-    },
-    set onmessage(listener) {
-      rendererWorker.onmessage = listener;
-    },
-  }
-};
-
-const hydrate$2 = async (config) => {
-  const ipc = await getIpc();
-
-  // setup electron message port
-  if (isElectron()) {
-    await new Promise((resolve, reject) => {
-      const handleIpcMessage = (event) => {
-        if (event.data !== 'get-port') {
-          reject(new Error('unexpected message from renderer worker'));
-          return
-        }
-        const handleMessageFromWindow = (event) => {
-          const port = event.ports[0];
-          ipc.sendAndTransfer('port', [port]);
-          resolve();
-        };
-
-        // @ts-ignore
-        window.addEventListener('message', handleMessageFromWindow, {
-          once: true,
-        });
-        // @ts-ignore
-        window.myApi.ipcConnect();
-      };
-      ipc.onmessage = handleIpcMessage;
-    });
-  }
-  ipc.onmessage = handleMessageFromRendererWorker;
-  state$9.ipc = ipc;
-};
-
-const send$1 = (method, ...params) => {
-  state$9.ipc.send({
-    jsonrpc: '2.0',
-    method,
-    params,
-  });
-};
-
-const state$8 = {
-  $ActivityBar: undefined,
-  $StatusBar: undefined,
-  $TitleBar: undefined,
-  $Main: undefined,
-  $SideBar: undefined,
-  $Panel: undefined,
-  $Workbench: undefined,
-  $SashSideBar: undefined,
-  $SashPanel: undefined,
-};
-
-// TODO when nodes are not visible, they are still kept in memory as detached dom nodes
-// maybe it doesn't matter but maybe they should be garbage collected
-
-const update = (points) => {
-  const $ActivityBar = state$8.$ActivityBar;
-  const $Main = state$8.$Main;
-  const $TitleBar = state$8.$TitleBar;
-  const $SideBar = state$8.$SideBar;
-  const $StatusBar = state$8.$StatusBar;
-  const $Panel = state$8.$Panel;
-  const $SashSideBar = state$8.$SashSideBar;
-  const $SashPanel = state$8.$SashPanel;
-
-  if (points.activityBarVisible) {
-    $ActivityBar.style.top = `${points.activityBarTop}px`;
-    $ActivityBar.style.left = `${points.activityBarLeft}px`;
-    $ActivityBar.style.width = `${points.activityBarWidth}px`;
-    $ActivityBar.style.height = `${points.activityBarHeight}px`;
-    $ActivityBar.style.display = '';
-  } else {
-    $ActivityBar.style.display = 'none';
-  }
-  if (points.mainVisible) {
-    $Main.style.top = `${points.mainTop}px`;
-    $Main.style.left = `${points.mainLeft}px`;
-    $Main.style.width = `${points.mainWidth}px`;
-    $Main.style.height = `${points.mainHeight}px`;
-    $Main.style.display = '';
-  } else {
-    $Main.style.display = 'none';
-  }
-  if (points.panelVisible) {
-    $Panel.style.top = `${points.panelTop}px`;
-    $Panel.style.left = `${points.panelLeft}px`;
-    $Panel.style.width = `${points.panelWidth}px`;
-    $Panel.style.height = `${points.panelHeight}px`;
-    $Panel.style.display = '';
-
-    $SashPanel.style.top = `${points.panelTop}px`;
-    $SashPanel.style.left = `${points.panelLeft}px`;
-    $SashPanel.style.width = `${points.panelWidth}px`;
-  } else {
-    $Panel.style.display = 'none';
-  }
-  if (points.sideBarVisible) {
-    $SideBar.style.top = `${points.sideBarTop}px`;
-    $SideBar.style.left = `${points.sideBarLeft}px`;
-    $SideBar.style.width = `${points.sideBarWidth}px`;
-    $SideBar.style.height = `${points.sideBarHeight}px`;
-    $SideBar.style.display = '';
-
-    $SashSideBar.style.left = `${points.sideBarLeft}px`;
-    $SashSideBar.style.top = `${points.sideBarTop}px`;
-    $SashSideBar.style.height = `${points.sideBarHeight}px`;
-  } else {
-    $SideBar.style.display = 'none';
-  }
-  if (points.statusBarVisible) {
-    $StatusBar.style.top = `${points.statusBarTop}px`;
-    $StatusBar.style.left = `${points.statusBarLeft}px`;
-    $StatusBar.style.width = `${points.statusBarWidth}px`;
-    $StatusBar.style.height = `${points.statusBarHeight}px`;
-    $StatusBar.style.display = '';
-  } else {
-    $StatusBar.style.display = 'none';
-  }
-  if (points.titleBarVisible) {
-    $TitleBar.style.top = `${points.titleBarTop}px`;
-    $TitleBar.style.left = `${points.titleBarLeft}px`;
-    $TitleBar.style.width = `${points.titleBarWidth}px`;
-    $TitleBar.style.height = `${points.titleBarHeight}px`;
-    $TitleBar.style.display = '';
-  } else {
-    // TODO remove elements from dom instead of hiding them
-    $TitleBar.style.display = 'none';
-  }
-};
-
-// export const get$ActivityBar = () => {
-//   return state.$ActivityBar
-// }
-
-// export const get$SideBar = () => {
-//   return state.$SideBar
-// }
-
-// export const get$Panel = () => {
-//   return state.$Panel
-// }
-
-// export const get$TitleBar = () => {
-//   return state.$TitleBar
-// }
-
-// export const get$Main = () => {
-//   return state.$Main
-// }
-
-const getTitleBarHeight = () => {
-  if (
-    // @ts-ignore
-    navigator.windowControlsOverlay &&
-    // @ts-ignore
-    navigator.windowControlsOverlay.getTitlebarAreaRect
-  ) {
-    // @ts-ignore
-    const titleBarRect = navigator.windowControlsOverlay.getTitlebarAreaRect();
-    return titleBarRect.height
-  }
-  return 0
-};
-
-const getBounds = () => {
-  return {
-    windowWidth: window.innerWidth,
-    windowHeight: window.innerHeight,
-    titleBarHeight: getTitleBarHeight(),
-  }
-};
-
-const handleResize = (event) => {
-  send$1(
-    /* Layout.handleResize */ 'Layout.handleResize',
-    /* bounds */ getBounds()
-  );
-};
-
-const getSashId = ($Target) => {
-  console.log({ $Target });
-  if ($Target.id === 'SashPanel') {
-    return 'Panel'
-  }
-  if ($Target.id === 'SashSideBar') {
-    return 'SideBar'
-  }
-  return ''
-};
-
-const handleSashPointerMove = (event) => {
-  const x = event.clientX;
-  const y = event.clientY;
-  send$1(
-    /* Layout.handleSashPointerMove */ 'Layout.handleSashPointerMove',
-    /* x */ x,
-    /* y */ y
-  );
-};
-
-const handleSashPointerUp = () => {
-  document.body.style.removeProperty('cursor');
-  window.removeEventListener('pointermove', handleSashPointerMove);
-  window.removeEventListener('pointerup', handleSashPointerUp);
-  const $Style = document.getElementById('SashStyle');
-  // @ts-ignore
-  $Style.remove();
-};
-
-const handleSashPointerDown = (event) => {
-  // TODO maybe add a class to body instead?
-  const $Style = document.createElement('style');
-  $Style.id = 'SashStyle';
-  $Style.textContent = `* {
-  cursor: col-resize !important;
-  pointer-events: none;
-}
-
-.SashVertical {
-  pointer-events: all;
-}
-.
-`;
-  document.head.append($Style);
-  window.addEventListener('pointermove', handleSashPointerMove);
-  window.addEventListener('pointerup', handleSashPointerUp);
-  const $Target = event.target;
-  const id = getSashId($Target);
-  send$1(
-    /* Layout.handleSashPointerDown */ 'Layout.handleSashPointerDown',
-    /* id */ id
-  );
-};
-
-const show = (points) => {
-  const $ActivityBar = document.createElement('div');
-  $ActivityBar.id = 'ActivityBar';
-
-  const $StatusBar = document.createElement('div');
-  $StatusBar.id = 'StatusBar';
-
-  const $TitleBar = document.createElement('div');
-  $TitleBar.id = 'TitleBar';
-
-  const $Main = document.createElement('main');
-  $Main.id = 'Main';
-
-  const $SideBar = document.createElement('div');
-  $SideBar.id = 'SideBar';
-
-  const $Panel = document.createElement('div');
-  $Panel.id = 'Panel';
-
-  // TODO use aria role splitter once supported https://github.com/w3c/aria/issues/1348
-  const $SashSideBar = document.createElement('div');
-  $SashSideBar.className = 'SashVertical';
-  $SashSideBar.id = 'SashSideBar';
-
-  // TODO use aria role splitter once supported https://github.com/w3c/aria/issues/1348
-  const $SashPanel = document.createElement('div');
-  $SashPanel.className = 'SashHorizontal';
-  $SashPanel.id = 'SashPanel';
-
-  const $Workbench = document.createElement('div');
-  $Workbench.id = 'Workbench';
-  $Workbench.append(
-    $TitleBar,
-    $Main,
-    $SideBar,
-    $ActivityBar,
-    $Panel,
-    $StatusBar,
-    $SashSideBar,
-    $SashPanel
-  );
-  // TODO don't like the random side effects here
-  state$8.$ActivityBar = $ActivityBar;
-  state$8.$Main = $Main;
-  state$8.$Panel = $Panel;
-  state$8.$SideBar = $SideBar;
-  state$8.$StatusBar = $StatusBar;
-  state$8.$TitleBar = $TitleBar;
-  state$8.$Workbench = $Workbench;
-  state$8.$SashPanel = $SashPanel;
-  state$8.$SashSideBar = $SashSideBar;
-  update(points);
-  // document.body.setAttribute('role', 'application') // TODO this doesn't seem to work
-  $Workbench.setAttribute('role', 'application');
-  document.body.append($Workbench);
-  window.addEventListener('resize', handleResize, { passive: true });
-  $SashSideBar.addEventListener('pointerdown', handleSashPointerDown);
-  $SashPanel.addEventListener('pointerdown', handleSashPointerDown);
-};
-
-const hide$1 = () => {
-  state$8.$Workbench.remove();
-  window.removeEventListener('resize', handleResize);
-};
-
-const __initialize__$6 = () => {
-  register$1('Layout.update', update);
-  // Command.register(1101, Layout.hideSideBar)
-  // Command.register(1102, Layout.toggleSideBar)
-  // Command.register(1103, Layout.showPanel)
-  // Command.register(1104, Layout.hidePanel)
-  // Command.register(1105, Layout.togglePanel)
-  // Command.register(1106, Layout.showActivityBar)
-  // Command.register(1107, Layout.hideActivityBar)
-  // Command.register(1108, Layout.toggleActivityBar)
-  register$1('Layout.show', show);
-  register$1('Layout.hide', hide$1);
-  register$1('Layout.getBounds', getBounds);
-};
-
-var M2 = {
-  __proto__: null,
-  __initialize__: __initialize__$6
-};
-
-const state$7 = {
-  // contexts: Object.create(null),
-  contexts: {},
-};
-
-// TODO all context keys should be numeric
-// comparing numbers is faster and more efficient than comparing strings every time
-// e.g. map 'focus.editor' -> 1
-// e.g. map 'focus.explorer' -> 2
-// Context.get(1), Context.get(2)
-
-const get$1 = (key) => {
-  return state$7.contexts[key]
-};
-
-const set = (key, value) => {
-  state$7.contexts[key] = value;
-};
-
-const remove$1 = (key) => {
-  delete state$7.contexts[key];
-};
-
-// TODO not sure if its worth to have a separate module for this or keep it inside Context.js
-// export const setFocus = (item) => {
-//   if (Context.state.currentFocus) {
-//     Context.remove(Context.state.currentFocus)
-//   }
-//   Context.set(`focus.${item}`, true)
-// }
-
-const state$6 = {
-  $PreviousFocusElement: undefined,
-  currentFocus: '',
-};
-
-const setFocus = (key) => {
-  if (state$6.currentFocus) {
-    remove$1(state$6.currentFocus);
-  }
-  // TODO could make focus key numeric enum which would be more efficient
-  state$6.currentFocus = `focus.${key}`;
-  set(state$6.currentFocus, true);
-};
-
-const setAdditionalFocus = (key) => {
-  // TODO key should be numeric
-  set(`focus.${key}`, true);
-};
-
-const removeAdditionalFocus = (key) => {
-  remove$1(`focus.${key}`);
-};
-
-const focus$4 = ($Element, key) => {
-  if ($Element === document.activeElement) {
-    console.log('focus return');
-    return
-  }
-  console.log(state$6.$PreviousFocusElement);
-  state$6.$PreviousFocusElement = document.activeElement;
-  $Element.focus({ preventScroll: true });
-  setFocus(key);
-};
-
-const focusPrevious = () => {
-  if (state$6.$PreviousFocusElement) {
-    console.log(state$6.$PreviousFocusElement);
-    state$6.$PreviousFocusElement.focus();
-  }
-};
-
-var M5 = {
-  __proto__: null,
-  state: state$6,
-  setFocus: setFocus,
-  setAdditionalFocus: setAdditionalFocus,
-  removeAdditionalFocus: removeAdditionalFocus,
-  focus: focus$4,
-  focusPrevious: focusPrevious
-};
-
-const state$5 = {
-  viewletStates: Object.create(null),
-};
-
-const getTarget = (event) => {
-  const $Target = event.target;
-  const $WantedTarget = $Target.closest('.Viewlet');
-  return $WantedTarget
-};
-
-const getStateFromEvent = (event) => {
-  const $Target = getTarget(event);
-  if (!$Target) {
-    console.warn('invalid handler');
-    return undefined
-  }
-  const id = $Target.dataset.viewletId;
-  const viewletState = state$5.viewletStates[id];
-  return viewletState
-};
-
-// TODO test deleteState function
-const deleteState = (id) => {
-  delete state$5.viewletStates[id];
-};
-
-const create$Cursor = () => {
-  const $Cursor = document.createElement('div');
-  $Cursor.className = 'EditorCursor';
-  return $Cursor
-};
-
-const render$Cursor = ($Cursor, $Texts, cursor) => {
-  $Cursor.style.top = `${cursor.top}px`;
-  const range = document.createRange();
-  if (cursor.leftIndex === -1) {
-    console.warn('cursor left is negative');
-    $Cursor.style.left = '0px'; // TODO need to compute column width, this would only work for monospace fonts
-    return
-  }
-  const $Row = $Texts.children[cursor.topIndex];
-  if (!$Row) {
-    console.warn('no row', cursor, $Row);
-    return
-  }
-  const $Node = $Row.children[cursor.leftIndex];
-  if (!$Node) {
-    console.warn('no node', cursor, $Row);
-    return
-  }
-  if (cursor.leftIndex === 0 && cursor.remainingOffset === 0) {
-    $Cursor.style.left = '0px';
-  } else {
-    const $TextNode = $Node.firstChild;
-    range.setStart($TextNode, cursor.remainingOffset);
-    range.setEnd($TextNode, cursor.remainingOffset);
-    const rect = range.getBoundingClientRect();
-    const left = Math.round(rect.left);
-    $Cursor.style.left = `${left}px`;
-  }
-};
-
-const render$CursorsLess = ($Cursors, $Texts, cursors) => {
-  for (let i = 0; i < $Cursors.children.length; i++) {
-    render$Cursor($Cursors.children[i], cursors[i]);
-  }
-  const fragment = document.createDocumentFragment();
-  for (let i = $Cursors.children.length; i < cursors.length; i++) {
-    const $Cursor = create$Cursor();
-    render$Cursor($Cursor, $Texts, cursors[i]);
-    fragment.append($Cursor);
-  }
-  $Cursors.append(fragment);
-};
-
-const render$CursorsEqual = ($Cursors, $Texts, cursors) => {
-  for (let i = 0; i < cursors.length; i++) {
-    render$Cursor($Cursors.children[i], $Texts, cursors[i]);
-  }
-};
-
-const render$CursorsMore = ($Cursors, $Texts, cursors) => {
-  for (let i = 0; i < cursors.length; i++) {
-    render$Cursor($Cursors.children[i], $Texts, cursors[i]);
-  }
-  const diff = $Cursors.children.length - cursors.length;
-  for (let i = 0; i < diff; i++) {
-    $Cursors.lastChild.remove();
-  }
-};
-
-const render$Cursors = ($Cursors, $Texts, cursors) => {
-  if ($Cursors.children.length < cursors.length) {
-    render$CursorsLess($Cursors, $Texts, cursors);
-  } else if ($Cursors.children.length === cursors.length) {
-    render$CursorsEqual($Cursors, $Texts, cursors);
-  } else {
-    render$CursorsMore($Cursors, $Texts, cursors);
-  }
-};
-
-const renderCursorsNative = (state, cursors) => {
-  if (cursors.length > 1) {
-    console.warn('[editor] cannot render more than one native cursor');
-    return
-  }
-  if (cursors.length === 0) {
-    return
-  }
-  const cursor = cursors[0];
-  const $Rows = state.$LayerText;
-  const $StartRow = $Rows.children[cursor.rowIndex];
-  let startOffset = 0;
-  let $Anchor;
-  for (let i = 0; i < $StartRow.children.length; i++) {
-    if (startOffset >= cursor.columnIndex) {
-      console.log({ startOffset });
-      $Anchor = $StartRow.children[i - 1].firstChild;
-      startOffset -= $Anchor.textContent.length;
-      startOffset = cursor.columnIndex - startOffset;
-      break
-    }
-    startOffset += $StartRow.children[i].textContent.length;
-  }
-  if (!$Anchor) {
-    $Anchor = $StartRow.children[$StartRow.children.length - 1].firstChild;
-    startOffset -= $Anchor.textContent.length;
-    startOffset = cursor.columnIndex - startOffset;
-  }
-  const selection = document.getSelection();
-  if (
-    selection.anchorNode === $Anchor &&
-    selection.focusNode === $Anchor &&
-    selection.anchorOffset === startOffset &&
-    selection.focusOffset === startOffset
-  ) {
-    return
-  }
-  state.shouldIgnoreSelectionChange = true;
-  const documentRange = document.createRange();
-  documentRange.setStart($Anchor, startOffset);
-  documentRange.setEnd($Anchor, startOffset);
-  selection.removeAllRanges();
-  selection.addRange(documentRange);
-};
-
-const setCursors = (state, cursors) => {
-  if (isMobileOrTablet()) {
-    renderCursorsNative(state, cursors);
-    return
-  }
-  render$Cursors(state.$LayerCursor, state.$LayerText, cursors);
-};
-
-const create$Diagnostic = () => {
-  const $Diagnostic = document.createElement('div');
-  $Diagnostic.className = 'EditorDiagnostic';
-  return $Diagnostic
-};
-
-const render$Diagnostic = ($Diagnostic, diagnostic) => {
-  $Diagnostic.style.top = `${diagnostic.top}px`;
-  $Diagnostic.style.left = `${diagnostic.left}px`;
-  $Diagnostic.style.width = `${diagnostic.width}px`;
-  $Diagnostic.style.height = `${diagnostic.height}px`;
-};
-
-const render$DiagnosticsLess = ($Diagnostics, diagnostics) => {
-  for (let i = 0; i < $Diagnostics.children.length; i++) {
-    render$Diagnostic($Diagnostics.children[i], diagnostics[i]);
-  }
-  const fragment = document.createDocumentFragment();
-  for (let i = $Diagnostics.children.length; i < diagnostics.length; i++) {
-    const $Diagnostic = create$Diagnostic();
-    render$Diagnostic($Diagnostic, diagnostics[i]);
-    fragment.append($Diagnostic);
-  }
-  $Diagnostics.append(fragment);
-};
-
-const render$DiagnosticsEqual = ($Diagnostics, diagnostics) => {
-  for (let i = 0; i < diagnostics.length; i++) {
-    render$Diagnostic($Diagnostics.children[i], diagnostics[i]);
-  }
-};
-
-const render$DiagnosticsMore = ($Diagnostics, diagnostics) => {
-  for (let i = 0; i < diagnostics.length; i++) {
-    render$Diagnostic($Diagnostics.children[i], diagnostics[i]);
-  }
-  const diff = $Diagnostics.children.length - diagnostics.length;
-  for (let i = 0; i < diff; i++) {
-    $Diagnostics.lastChild.remove();
-  }
-};
-
-const render$Diagnostics = ($Diagnostics, diagnostics) => {
-  if ($Diagnostics.children.length < diagnostics.length) {
-    render$DiagnosticsLess($Diagnostics, diagnostics);
-  } else if ($Diagnostics.children.length === diagnostics.length) {
-    render$DiagnosticsEqual($Diagnostics, diagnostics);
-  } else {
-    render$DiagnosticsMore($Diagnostics, diagnostics);
-  }
-};
-
-const setDiagnostics$1 = (state, diagnostics) => {
-  render$Diagnostics(state.$LayerDiagnostics, diagnostics);
-};
-
-const setPosition = (state, scrollBarY, scrollBarHeight) => {
-  state.$ScrollBarThumb.style.top = `${scrollBarY}px`;
-  state.$ScrollBarThumb.style.height = `${scrollBarHeight}px`;
-};
-
-// TODO scrollbar decorations should be own layer maybe
-const create$ScrollBarDiagnostic = () => {
-  const $ScrollBarDiagnostic = document.createElement('div');
-  $ScrollBarDiagnostic.className = 'ScrollBarDiagnostic';
-  return $ScrollBarDiagnostic
-};
-
-const render$ScrollBarDiagnostic = (
-  $ScrollBarDiagnostic,
-  scrollBarDiagnostic
-) => {
-  $ScrollBarDiagnostic.style.top = `${scrollBarDiagnostic.top}px`;
-};
-
-const render$ScrollBarDiagnosticsLess = (
-  $ScrollBarDiagnostics,
-  scrollBarDiagnostics
-) => {
-  for (let i = 0; i < $ScrollBarDiagnostics.children.length; i++) {
-    render$ScrollBarDiagnostic(
-      $ScrollBarDiagnostics.children[i],
-      scrollBarDiagnostics[i]
-    );
-  }
-  const fragment = document.createDocumentFragment();
-  for (
-    let i = $ScrollBarDiagnostics.children.length;
-    i < scrollBarDiagnostics.length;
-    i++
-  ) {
-    const $ScrollBarDiagnostic = create$ScrollBarDiagnostic();
-    render$ScrollBarDiagnostic($ScrollBarDiagnostic, scrollBarDiagnostics[i]);
-    fragment.append($ScrollBarDiagnostic);
-  }
-  $ScrollBarDiagnostics.append(fragment);
-};
-
-const render$ScrollBarDiagnosticsEqual = (
-  $ScrollBarDiagnostics,
-  scrollBarDiagnostics
-) => {
-  for (let i = 0; i < scrollBarDiagnostics.length; i++) {
-    render$ScrollBarDiagnostic(
-      $ScrollBarDiagnostics.children[i],
-      scrollBarDiagnostics[i]
-    );
-  }
-};
-
-const render$ScrollBarDiagnosticsMore = (
-  $ScrollBarDiagnostics,
-  scrollBarDiagnostics
-) => {
-  for (let i = 0; i < scrollBarDiagnostics.length; i++) {
-    render$ScrollBarDiagnostic(
-      $ScrollBarDiagnostics.children[i],
-      scrollBarDiagnostics[i]
-    );
-  }
-  const diff =
-    $ScrollBarDiagnostics.children.length - scrollBarDiagnostics.length;
-  for (let i = 0; i < diff; i++) {
-    $ScrollBarDiagnostics.lastChild.remove();
-  }
-};
-
-const render$ScrollBarDiagnostics = (
-  $ScrollBarDiagnostics,
-  scrollBarDiagnostics
-) => {
-  if ($ScrollBarDiagnostics.children.length < scrollBarDiagnostics.length) {
-    render$ScrollBarDiagnosticsLess($ScrollBarDiagnostics, scrollBarDiagnostics);
-  } else if (
-    $ScrollBarDiagnostics.children.length === scrollBarDiagnostics.length
-  ) {
-    render$ScrollBarDiagnosticsEqual(
-      $ScrollBarDiagnostics,
-      scrollBarDiagnostics
-    );
-  } else {
-    render$ScrollBarDiagnosticsMore($ScrollBarDiagnostics, scrollBarDiagnostics);
-  }
-};
-
-const setDiagnostics = (editor, scrollBarDiagnostics) => {
-  render$ScrollBarDiagnostics(
-    editor.$ScrollBarDiagnostics,
-    scrollBarDiagnostics
-  );
-};
-
-const create$Selection = () => {
-  const $Selection = document.createElement('div');
-  $Selection.className = 'EditorSelection';
-  return $Selection
-};
-
-const render$Selection = ($Selection, selection) => {
-  // TODO have many decorations per row
-  // no absolute positioning
-  $Selection.style.top = `${selection.top}px`;
-  $Selection.style.left = `${selection.left}px`;
-  $Selection.style.width = `${selection.width}px`;
-  $Selection.style.height = `${selection.height}px`;
-};
-
-const render$SelectionsLess = ($Selections, selections) => {
-  for (let i = 0; i < $Selections.children.length; i++) {
-    render$Selection($Selections.children[i], selections[i]);
-  }
-  const fragment = document.createDocumentFragment();
-  for (let i = $Selections.children.length; i < selections.length; i++) {
-    const $Selection = create$Selection();
-    render$Selection($Selection, selections[i]);
-    fragment.append($Selection);
-  }
-  $Selections.append(fragment);
-};
-
-const render$SelectionsEqual = ($Selections, selections) => {
-  for (let i = 0; i < selections.length; i++) {
-    render$Selection($Selections.children[i], selections[i]);
-  }
-};
-
-const render$SelectionsMore = ($Selections, selections) => {
-  for (let i = 0; i < selections.length; i++) {
-    render$Selection($Selections.children[i], selections[i]);
-  }
-  const diff = $Selections.children.length - selections.length;
-  for (let i = 0; i < diff; i++) {
-    $Selections.lastChild.remove();
-  }
-};
-
-const render$Selections = ($Selections, selections) => {
-  if ($Selections.children.length < selections.length) {
-    render$SelectionsLess($Selections, selections);
-  } else if ($Selections.children.length === selections.length) {
-    render$SelectionsEqual($Selections, selections);
-  } else {
-    render$SelectionsMore($Selections, selections);
-  }
-};
-
-const renderSelectionsNative = (state, selections) => {
-  if (selections.length > 1) {
-    console.warn('[editor] cannot render more than one native selection');
-
-  }
-};
-
-const setSelections$1 = (state, selections) => {
-  if (isMobileOrTablet()) {
-    renderSelectionsNative(state, selections);
-    return
-  }
-  render$Selections(state.$LayerSelections, selections);
-};
-
-const create$Row = () => {
-  const $Row = document.createElement('div');
-  $Row.className = 'EditorRow';
-  return $Row
-};
-
-const create$Token = () => {
-  const $Token = document.createElement('span');
-  $Token.className = 'Token';
-  return $Token
-};
-
-// TODO maybe use createTextNode (codeMirror uses that)
-// This function seems to be a hot spot
-const render$Token = ($Token, text, className) => {
-  $Token.className = className;
-  if ($Token.firstChild) {
-    // recycle text node
-    $Token.firstChild.nodeValue = text;
-  } else {
-    $Token.textContent = text;
-  }
-};
-
-const render$LineLess = ($Line, lineInfo) => {
-  let i = 0;
-  while (i < $Line.children.length * 2) {
-    const text = lineInfo[i++];
-    const className = lineInfo[i++];
-    render$Token($Line.children[i / 2 - 1], text, className);
-  }
-  const fragment = document.createDocumentFragment();
-  while (i < lineInfo.length) {
-    const text = lineInfo[i++];
-    const className = lineInfo[i++];
-    const $Token = create$Token();
-    render$Token($Token, text, className);
-    fragment.append($Token);
-  }
-  $Line.append(fragment);
-};
-
-const render$LineEqual = ($Line, lineInfo) => {
-  let i = 0;
-  while (i < lineInfo.length) {
-    const text = lineInfo[i++];
-    const className = lineInfo[i++];
-    render$Token($Line.children[i / 2 - 1], text, className);
-  }
-};
-
-const render$LineMore = ($Line, lineInfo) => {
-  let i = 0;
-  while (i < lineInfo.length) {
-    const text = lineInfo[i++];
-    const className = lineInfo[i++];
-    render$Token($Line.children[i / 2 - 1], text, className);
-  }
-  const diff = $Line.children.length - lineInfo.length / 2;
-  for (let i = lineInfo.length; i < lineInfo.length + diff; i++) {
-    $Line.lastChild.remove();
-  }
-};
-
-const render$Line = ($Line, lineInfo) => {
-  if ($Line.children.length < lineInfo.length / 2) {
-    render$LineLess($Line, lineInfo);
-  } else if ($Line.children.length === lineInfo.length / 2) {
-    render$LineEqual($Line, lineInfo);
-  } else {
-    render$LineMore($Line, lineInfo);
-  }
-};
-
-const render$LinesLess = ($Lines, lineInfos) => {
-  for (let i = 0; i < $Lines.children.length; i++) {
-    render$Line($Lines.children[i], lineInfos[i]);
-  }
-  const fragment = document.createDocumentFragment();
-  for (let i = $Lines.children.length; i < lineInfos.length; i++) {
-    const $Line = create$Row();
-    render$Line($Line, lineInfos[i]);
-    fragment.append($Line);
-  }
-  $Lines.append(fragment);
-};
-
-const render$LinesEqual = ($Lines, lineInfos) => {
-  for (let i = 0; i < lineInfos.length; i++) {
-    render$Line($Lines.children[i], lineInfos[i]);
-  }
-};
-
-const render$LinesMore = ($Lines, lineInfos) => {
-  for (let i = 0; i < lineInfos.length; i++) {
-    render$Line($Lines.children[i], lineInfos[i]);
-  }
-  const diff = $Lines.children.length - lineInfos.length;
-  for (let i = lineInfos.length; i < lineInfos.length + diff; i++) {
-    $Lines.lastChild.remove();
-  }
-};
-
-const render$Lines = ($Lines, lineInfos) => {
-  object($Lines);
-  array(lineInfos);
-  if ($Lines.children.length < lineInfos.length) {
-    render$LinesLess($Lines, lineInfos);
-  } else if ($Lines.children.length === lineInfos.length) {
-    render$LinesEqual($Lines, lineInfos);
-  } else {
-    render$LinesMore($Lines, lineInfos);
-  }
-};
-
-const setLineInfos = (state, lineInfos) => {
-  render$Lines(state.$LayerText, lineInfos);
-};
-
-// TODO so many things in this file
-
-// TODO go back to edit mode after pressing escape so screenreaders can navigate https://stackoverflow.com/questions/53909477/how-to-handle-tabbing-for-accessibility-with-a-textarea-that-uses-the-tab-button
-
-// TODO tree shake out mobile support when targeting electron -> less code -> less event listeners -> less memory -> less cpu
-
-const handleContextMenu$2 = (event) => {
-  event.preventDefault();
-  const x = event.clientX;
-  const y = event.clientY;
-  send$1(
-    /* ContextMenu.show */ 'ContextMenu.show',
-    /* x */ x,
-    /* y */ y,
-    /* id */ 'editor'
-  );
-};
-
-const handleFocus = (event) => {
-  setFocus('EditorText');
-};
-
-const handleBlur$1 = (event) => {
-  // needed for save on blur
-  // also needed to close completions on blur
-  send$1(/* EditorBlur.editorBlur */ 'Editor.blur');
-};
-
-const handleBeforeInput = (event) => {
-  event.preventDefault();
-  switch (event.inputType) {
-    case 'insertText':
-      send$1(
-        /* Editor.type */ 'Editor.type',
-        /* text */ event.data
-      );
-      break
-  }
-  // if (!event.data) {
-  //   return
-  // }
-};
-
-// TODO composition should be better supported,
-// for example
-// - gedit draws a line below the composed text
-// - codemirror 6 also draws that line
-// - codemirror 5 also draws that line
-// - vscode does not draw a line, but displays characters during composition
-
-const handleCompositionStart = (event) => {
-  send$1(
-    /* Editor.compositionStart */ 'Editor.compositionStart',
-    /* text */ event.data
-  );
-};
-
-const handleCompositionUpdate = (event) => {
-  send$1(
-    /* Editor.compositionUpdate */ 'Editor.compositionUpdate',
-    /* text */ event.data
-  );
-};
-
-const handleCompositionEnd = (event) => {
-  send$1(
-    /* Editor.compositionEnd */ 'Editor.compositionEnd',
-    /* text */ event.data
-  );
-};
-
-const handleCut = (event) => {
-  event.preventDefault();
-  send$1(/* Editor.cut */ 'Editor.cut');
-};
-
-const handleSelectionMove = (event) => {
-  const x = event.clientX;
-  const y = event.clientY;
-  const totalOffset = getTotalOffset(event);
-  if (event.altKey) {
-    send$1(
-      /* Editor.moveRectangleSelectionPx */ 'Editor.moveRectangleSelectionPx',
-      /* x */ x,
-      /* y */ y,
-      /* offset */ totalOffset
-    );
-  } else {
-    send$1(
-      /* Editor.moveSelectionPx */ 'Editor.moveSelectionPx',
-      /* x */ x,
-      /* y */ y,
-      /* offset */ totalOffset
-    );
-  }
-};
-
-const handleSelectionDone = (event) => {
-  document.removeEventListener('mousemove', handleSelectionMove);
-  document.removeEventListener('mouseup', handleSelectionDone);
-};
-
-const getModifier$1 = (event) => {
-  if (event.ctrlKey) {
-    return 'ctrl'
-  }
-  if (event.altKey) {
-    return 'alt'
-  }
-  return ''
-};
-
-const handleSingleClick = (event, x, y, offset) => {
-  console.log('click', { x, y, offset });
-  const modifier = getModifier$1(event);
-  send$1(
-    /* Editor.handleSingleClick */ 'Editor.handleSingleClick',
-    /* modifier */ modifier,
-    /* x */ x,
-    /* y */ y,
-    /* offset */ offset
-  );
-  // const $InputBox = $Target.closest('.Editor').firstElementChild
-  // $InputBox.focus()
-  // TODO this logic should be in renderer worker
-  document.addEventListener('mousemove', handleSelectionMove, { passive: true });
-  document.addEventListener('mouseup', handleSelectionDone);
-};
-
-const handleDoubleClick = (event, x, y, offset) => {
-  send$1(
-    /* Editor.handleDoubleClick */ 'Editor.handleDoubleClick',
-    /* x */ x,
-    /* y */ y,
-    /* offset */ offset
-  );
-};
-
-const handleTripleClick = (event, x, y, offset) => {
-  send$1(
-    /* Editor.handleTripleClick */ 'Editor.handleTripleClick',
-    /* x */ x,
-    /* y */ y,
-    /* offset */ offset
-  );
-};
-
-const isRightClick = (event) => {
-  return event.button === 2
-};
-
-const getTextNodeOffset = (textNode) => {
-  let $Token = textNode.parentElement;
-  let offset = 0;
-  while ($Token.previousSibling) {
-    $Token = $Token.previousSibling;
-    offset += $Token.textContent.length;
-  }
-  return offset
-};
-
-const getTotalOffset = (event) => {
-  if (document.caretRangeFromPoint) {
-    // chrome uses deprecated version
-    const range = document.caretRangeFromPoint(event.clientX, event.clientY);
-    if (!range) {
-      return 0
-    }
-    const textNode = range.startContainer;
-    const textNodeOffset = getTextNodeOffset(textNode);
-    const offset = range.startOffset;
-    const totalOffset = textNodeOffset + offset;
-    return totalOffset
-    // @ts-ignore
-  } if (document.caretPositionFromPoint) {
-    // firefox uses new version
-    // @ts-ignore
-    const range = document.caretPositionFromPoint(event.clientX, event.clientY);
-    if (!range) {
-      return 0
-    }
-    const textNode = range.offsetNode;
-    const textNodeOffset = getTextNodeOffset(textNode);
-    const offset = range.offset;
-    const totalOffset = textNodeOffset + offset;
-    return totalOffset
-  }
-    throw new Error('caret position is not supported')
-
-};
-
-const handleMouseDown$1 = (event) => {
-  if (isRightClick(event)) {
-    return
-  }
-  event.preventDefault();
-  const totalOffset = getTotalOffset(event);
-  const x = event.clientX;
-  const y = event.clientY;
-  console.log('detail', event.detail);
-  switch (event.detail) {
-    case 1:
-      handleSingleClick(event, x, y, totalOffset);
-      break
-    case 2:
-      handleDoubleClick(event, x, y, totalOffset);
-      break
-    case 3:
-      handleTripleClick(event, x, y, totalOffset);
-      break
-  }
-};
-
-// TODO figure out whether it is possible to register hover provider without mousemove
-// mousemove handler is called very often and could slow down editor / drain battery
-
-// disabled for now because of constant cpu usage on mousemove
-// bad for performance
-const handleMouseMove$1 = (event) => {
-  const x = event.clientX;
-  const y = event.clientY;
-  if (event.altKey) {
-    const offset = getTotalOffset(event);
-    send$1(
-      /* Editor.handleMouseMoveWithAltKey */ 'Editor.handleMouseMoveWithAltKey',
-      /* x */ x,
-      /* y */ y,
-      /* offset */ offset
-    );
-  }
-  // console.log(event.altKey)
-  // RendererWorker.send(/* Editor.handleMouseMove */ 389, /* x */ x, /* y */ y)
-};
-
-const handleWheel = (event) => {
-  // event.preventDefault()
-  // const state = EditorHelper.getStateFromEvent(event)
-  // TODO send editor id
-  switch (event.deltaMode) {
-    case event.DOM_DELTA_LINE:
-      send$1(/* Editor.setDeltaY */ 384, /* value */ event.deltaY);
-      break
-    case event.DOM_DELTA_PIXEL:
-      send$1(/* Editor.setDeltaY */ 384, /* value */ event.deltaY);
-      break
-  }
-};
-
-const handlePaste = (event) => {
-  event.preventDefault();
-  const text = event.clipboardData.getData('text');
-  send$1(/* Editor.paste */ 'Editor.paste', /* text */ text);
-};
-
-const handleScrollBarThumbMouseMove = (event) => {
-  const y = event.clientY;
-  send$1(
-    /* Editor.handleScrollBarMouseMove */ 'Editor.handleScrollBarMove',
-    /* y */ y
-  );
-};
-
-const handleScrollBarThumbMouseUp = () => {
-  window.removeEventListener('mousemove', handleScrollBarThumbMouseMove);
-  window.removeEventListener('mouseup', handleScrollBarThumbMouseUp);
-};
-
-const handleScrollBarThumbMouseDown = (event) => {
-  window.addEventListener('mousemove', handleScrollBarThumbMouseMove);
-  window.addEventListener('mouseup', handleScrollBarThumbMouseUp);
-};
-
-const handleScrollBarMouseDown = (event) => {
-  const y = event.clientY;
-  send$1(
-    /* EditorHandleScrollBarClick.editorHandleScrollBarClick */ 'Editor.handleScrollBarClick',
-    /* y */ y
-  );
-};
-
-const toSimpleTouch = (touch) => {
-  return {
-    x: touch.clientX,
-    y: touch.clientY,
-  }
-};
-
-const toSimpleTouchEvent = (event) => {
-  const touches = Array.from(event.touches).map(toSimpleTouch);
-  const changedTouches = Array.from(event.changedTouches).map(toSimpleTouch);
-  return {
-    touches,
-    changedTouches,
-  }
-};
-
-// TODO add touch cancel handler
-
-// TODO use touch events for scrolling
-
-const handleTouchStart = (event) => {
-  const touchEvent = toSimpleTouchEvent(event);
-  send$1(
-    /* EditorHandleTouchStart.editorHandleTouchStart */ 'Editor.handleTouchStart',
-    /* touchEvent */ touchEvent
-  );
-};
-
-const handleTouchMove = (event) => {
-  const touchEvent = toSimpleTouchEvent(event);
-  send$1(
-    /* EditorHandleTouchMove.editorHandleTouchMove */ 'Editor.handleTouchMove',
-    /* touchEvent */ touchEvent
-  );
-};
-
-const handleTouchEnd = (event) => {
-  if (event.cancelable) {
-    event.preventDefault();
-  }
-  const touchEvent = toSimpleTouchEvent(event);
-  send$1(
-    /* EditorHandleTouchEnd.editorHandleTouchEnd */ 'Editor.handleTouchEnd',
-    /* touchEvent */ touchEvent
-  );
-};
-
-const getRangeFromSelection = (selection) => {
-  if (!selection.anchorNode) {
-    return undefined
-  }
-  const $StartToken = selection.anchorNode.parentNode;
-  const $EndToken = selection.focusNode.parentNode;
-  const $StartRow = $StartToken.parentNode;
-  const $EndRow = $EndToken.parentNode;
-  const $Rows = $StartRow.parentNode;
-  let startRowIndex = 0;
-  for (let i = 0; i < $Rows.children.length; i++) {
-    if ($Rows.children[i] === $StartRow) {
-      startRowIndex = i;
-      break
-    }
-  }
-  let startColumnIndex = 0;
-  for (let i = 0; i < $StartRow.children.length; i++) {
-    if ($StartRow.children[i] === $StartToken) {
-      break
-    }
-    startColumnIndex += $StartRow.children[i].textContent.length;
-  }
-  startColumnIndex += selection.anchorOffset;
-  let endRowIndex = 0;
-  for (let i = 0; i < $Rows.children.length; i++) {
-    if ($Rows.children[i] === $EndRow) {
-      endRowIndex = i;
-      break
-    }
-  }
-  let endColumnIndex = 0;
-  for (let i = 0; i < $EndRow.children.length; i++) {
-    if ($EndRow.children[i] === $EndToken) {
-      break
-    }
-    endColumnIndex += $EndRow.children[i].textContent.length;
-  }
-  endColumnIndex += selection.focusOffset;
-  return {
-    startRowIndex,
-    startColumnIndex,
-    endRowIndex,
-    endColumnIndex,
-  }
-};
-
-const handleContentEditableBeforeInput = (event) => {
-  const selection = document.getSelection();
-  const range = getRangeFromSelection(selection);
-  if (!range) {
-    console.error('[Editor] cannot handle input event without selection');
-    return
-  }
-  send$1(
-    /* EditorHandleBeforeInputFromContentEditable.editorHandleBeforeInputFromContentEditable */ 'Editor.handleBeforeInputFromContentEditable',
-    /* data */ event.data || '',
-    /* range */ range
-  );
-};
-
-const handleNativeSelectionChange = (event) => {
-  const state = getStateFromEvent(event);
-  if (state.shouldIgnoreSelectionChange) {
-    state.shouldIgnoreSelectionChange = false;
-    return
-  }
-  const selection = document.getSelection();
-  const range = getRangeFromSelection(selection);
-  if (!range) {
-    return
-  }
-  send$1(
-    /* EditorHandleNativeSelectionChange.editorHandleNativeSelectionChange */ 'Editor.handleNativeSelectionChange',
-    /* range */ range
-  );
-};
-
-// TODO all create functions should have no arguments
-// and be split into two parts
-// 1. create -> only create dom elements
-// 2. render -> fill elements with attributes and data
-// that way all dom nodes can be recycled
-const create$4 = () => {
-  const $EditorInput = document.createElement('textarea');
-  $EditorInput.className = 'EditorInput';
-  $EditorInput.ariaAutoComplete = 'list';
-  $EditorInput.ariaRoleDescription = 'editor';
-  $EditorInput.ariaMultiLine = 'true';
-  $EditorInput.setAttribute('autocomplete', 'off');
-  $EditorInput.setAttribute('autocapitalize', 'off');
-  $EditorInput.setAttribute('autocorrect', 'off');
-  $EditorInput.setAttribute('wrap', 'off');
-  $EditorInput.setAttribute('spellcheck', 'false');
-  $EditorInput.setAttribute('role', 'textbox');
-  $EditorInput.onpaste = handlePaste;
-  // TODO where to best put listeners (side effects)
-  $EditorInput.addEventListener('beforeinput', handleBeforeInput);
-  $EditorInput.addEventListener('compositionstart', handleCompositionStart);
-  $EditorInput.addEventListener('compositionupdate', handleCompositionUpdate);
-  $EditorInput.addEventListener('compositionend', handleCompositionEnd);
-  $EditorInput.onfocus = handleFocus;
-  $EditorInput.onblur = handleBlur$1;
-  $EditorInput.oncut = handleCut;
-
-  const $LayerCursor = document.createElement('div');
-  $LayerCursor.className = 'LayerCursor';
-
-  const $LayerText = document.createElement('div');
-  $LayerText.className = 'EditorRows';
-  if (isMobileOrTablet()) {
-    $LayerText.setAttribute('contenteditable', 'plaintext-only');
-    $LayerText.setAttribute('autocapitalize', 'off');
-    $LayerText.setAttribute('spellcheck', 'false');
-    $LayerText.setAttribute('autocorrect', 'off');
-    $LayerText.addEventListener('beforeinput', handleContentEditableBeforeInput);
-    // TODO remove listener once editor is disposed
-    // TODO why is there no selection change listener for the element?
-    document.addEventListener('selectionchange', handleNativeSelectionChange);
-  } else {
-    $LayerText.addEventListener('mousedown', handleMouseDown$1);
-  }
-
-  const $ScrollBarThumb = document.createElement('div');
-  $ScrollBarThumb.className = 'ScrollBarThumb';
-  $ScrollBarThumb.addEventListener('mousedown', handleScrollBarThumbMouseDown);
-
-  // TODO only create $ScrollBarDiagnostics lazily when there are actually diagnostics
-  const $ScrollBarDiagnostics = document.createElement('div');
-  $ScrollBarDiagnostics.className = 'EditorScrollBarDiagnostics';
-
-  const $ScrollBar = document.createElement('div');
-  $ScrollBar.className = 'ScrollBar';
-  if (!isMobileOrTablet()) {
-    $ScrollBar.onmousedown = handleScrollBarMouseDown;
-  }
-  $ScrollBar.append($ScrollBarThumb);
-
-  // $EditorRows.addEventListener('mousemove', handleMouseMove, { passive: true })
-
-  // TODO function should be hoisted (maybe -> one listener for all editors (definitely))
-  // only problem is $EditorInput closure
-
-  // TODO when mousedown on completions -> this shouldn't be called
-
-  const $LayerSelections = document.createElement('div');
-  $LayerSelections.className = 'Selections';
-
-  // TODO maybe use css grid to position layers on top of each other
-  // TODO maybe merge layerDiagnostics with LayerSelections
-  // TODO maybe this should be more generic, e.g. LayerDecorations
-  // where decoration = {top,left, width, height, type/className}
-  const $LayerDiagnostics = document.createElement('div');
-  $LayerDiagnostics.className = 'LayerDiagnostics';
-
-  const $EditorLayers = document.createElement('div');
-  $EditorLayers.className = 'EditorLayers';
-  $EditorLayers.append(
-    $LayerSelections,
-    $LayerText,
-    $LayerCursor,
-    $LayerDiagnostics
-  );
-
-  const $Editor = document.createElement('div');
-  $Editor.className = 'Viewlet Editor';
-  $Editor.dataset.viewletId = 'EditorText';
-  $Editor.setAttribute('role', 'code');
-  $Editor.append($EditorInput, $EditorLayers, $ScrollBarDiagnostics, $ScrollBar);
-  if (isMobileOrTablet()) {
-    $Editor.addEventListener('touchstart', handleTouchStart, { passive: true });
-    $Editor.addEventListener('touchmove', handleTouchMove, { passive: true });
-    $Editor.addEventListener('touchend', handleTouchEnd);
-  } else {
-    $Editor.addEventListener('contextmenu', handleContextMenu$2);
-    $Editor.addEventListener('wheel', handleWheel, { passive: true });
-  }
-  $Editor.addEventListener('mousemove', handleMouseMove$1, { passive: true });
-  return {
-    $LayerCursor,
-    $LayerSelections,
-    $LayerText,
-    $EditorLayers,
-    $Editor,
-    $EditorInput,
-    $ScrollBarThumb,
-    $LayerDiagnostics,
-    $ScrollBarDiagnostics,
-    shouldIgnoreSelectionChange: false,
-    $Viewlet: $Editor,
-  }
-};
-
-const setText = (state, textInfos) => {
-  setLineInfos(state, textInfos);
-};
-
-const setSettings = (state, fontSize, lineHeight, letterSpacing) => {
-  // TODO many properties on <html> element in chrome devtools looks ugly
-  // maybe put styles into a stylesheet instead of using inline styles?
-  const root = document.documentElement;
-  root.style.setProperty('--EditorFontSize', `${fontSize}px`);
-  root.style.setProperty('--EditorLineHeight', `${lineHeight}px`);
-  root.style.setProperty('--EditorLetterSpacing', letterSpacing);
-};
-
-const setScrollBar = (state, scrollBarY, scrollBarHeight) => {
-  setPosition(state, scrollBarY, scrollBarHeight);
-};
-
-const renderCursors = (state, cursorInfos) => {
-  setCursors(state, cursorInfos);
-};
-
-const renderSelections = (state, selectionInfos) => {
-  setSelections$1(state, selectionInfos);
-};
-
-const renderTextAndCursors = (state, textInfos, cursorInfos) => {
-  setLineInfos(state, textInfos);
-  setCursors(state, cursorInfos);
-};
-
-const setSelections = (state, cursorInfos, selectionInfos) => {
-  setCursors(state, cursorInfos);
-  setSelections$1(state, selectionInfos);
-};
-
-const renderTextAndCursorsAndSelections = (
-  state,
-  scrollBarY,
-  scrollBarHeight,
-  textInfos,
-  cursorInfos,
-  selectionInfos
-) => {
-  object(state);
-  number(scrollBarY);
-  number(scrollBarHeight);
-  array(textInfos);
-  array(cursorInfos);
-  array(selectionInfos);
-  setPosition(state, scrollBarY, scrollBarHeight);
-  setLineInfos(state, textInfos);
-  setCursors(state, cursorInfos);
-  setSelections$1(state, selectionInfos);
-};
-
-const mount = (state, $Parent) => {
-  $Parent.append(state.$Editor);
-};
-
-const dispose$3 = (state) => {};
-
-const focus$3 = (state) => {
-  const { $EditorInput } = state;
-  console.log('focus editor');
-  $EditorInput.focus();
-};
-
-const setLanguageId = async (state, languageId) => {
-  // state.languageId = languageId
-  // state.$Editor.dataset.languageId = languageId
-  // loadTokenizer(languageId)
-};
-
-const renderDiagnostics = (state, diagnostics, scrollBarDiagnostics) => {
-  setDiagnostics$1(state, diagnostics);
-  setDiagnostics(state, scrollBarDiagnostics);
-};
-
-var M4 = {
-  __proto__: null,
-  create: create$4,
-  setText: setText,
-  setSettings: setSettings,
-  setScrollBar: setScrollBar,
-  renderCursors: renderCursors,
-  renderSelections: renderSelections,
-  renderTextAndCursors: renderTextAndCursors,
-  setSelections: setSelections,
-  renderTextAndCursorsAndSelections: renderTextAndCursorsAndSelections,
-  mount: mount,
-  dispose: dispose$3,
-  focus: focus$3,
-  setLanguageId: setLanguageId,
-  renderDiagnostics: renderDiagnostics
-};
-
-const state$4 = {
-  instances: Object.create(null),
-  currentSideBarView: undefined,
-  currentPanelView: undefined,
-  modules: Object.create(null),
-};
-
-const get = (id) => {
-  switch (id) {
-    case 'Explorer':
-      return import('./ViewletExplorer.js')
-    case 'Run and Debug':
-      return import('./ViewletRunAndDebug.js')
-    case 'Search':
-      return import('./ViewletSearch.js')
-    case 'Source Control':
-      return import('./ViewletSourceControl.js')
-    case 'Terminal':
-      return import('./ViewletTerminal.js')
-    case 'Extensions':
-      return import('./ViewletExtensions.js')
-    case 'Debug Console':
-      return import('./ViewletDebugConsole.js')
-    case 'Output':
-      return import('./ViewletOutput.js')
-    case 'Problems':
-      return import('./ViewletProblems.js')
-    case 'Empty':
-      return import('./ViewletEmpty.js')
-    case 'EditorText':
-      return import('./ViewletEditorText.js')
-    case 'EditorPlainText':
-      return import('./ViewletEditorPlainText.js')
-    case 'EditorImage':
-      return import('./ViewletEditorImage.js')
-    case 'Clock':
-      return import('./ViewletClock.js')
-    case 'SideBar':
-      return import('./ViewletSideBar.js')
-    case 'Panel':
-      return import('./ViewletPanel.js')
-    case 'ActivityBar':
-      return Promise.resolve().then(function () { return M27; })
-    case 'ImagePreview':
-      return import('./ImagePreview.js')
-    case 'QuickPick':
-      return import('./ViewletQuickPick.js')
-    case 'StatusBar':
-      return Promise.resolve().then(function () { return M28; })
-    case 'TitleBar':
-      return Promise.resolve().then(function () { return M29; })
-    case 'Main':
-      return import('./ViewletMain.js')
-    case 'EditorCompletion':
-      return import('./ViewletEditorCompletion.js')
-    case 'References':
-      return import('./ViewletReferences.js')
-    case 'Implementations':
-      return import('./ViewletImplementations.js')
-    default:
-      throw new Error(`unknown viewlet ${id}`)
-  }
-};
-
-const load = async (id, ...args) => {
-  const module = await get(id);
-  state$4.modules[id] = module;
-  state$4.instances[id] = {
-    state: module.create(...args),
-    factory: module,
-  };
-};
-
-const invoke = (viewletId, method, ...args) => {
-  const instance = state$4.instances[viewletId];
-  if (!instance) {
-    console.warn(`viewlet instance ${viewletId} not found`);
-    return
-  }
-  if (typeof instance.factory[method] !== 'function') {
-    console.warn(`method ${method} in ${viewletId} not implemented`);
-    console.log(instance.factory);
-    return
-  }
-  return instance.factory[method](instance.state, ...args)
-};
-
-const focus$2 = (viewletId) => {
-  const instance = state$4.instances[viewletId];
-  if (instance && instance.factory && instance.factory.focus) {
-    instance.factory.focus(instance.state);
-  }
-};
-
-/**
- * @deprecated
- */
-const refresh = (viewletId, viewletContext) => {
-  console.log('REFRESH', viewletId);
-  const instance = state$4.instances[viewletId];
-  if (instance) {
-    instance.factory.refresh(instance.state, viewletContext);
-  } else {
-    // console.warn('no instance yet of ' + viewletId)
-    state$4.refreshContext[viewletId] = viewletContext;
-  }
-};
-
-const sendMultiple = (commands) => {
-  for (const command of commands) {
-    const [_, viewletId, method, ...args] = command;
-    invoke(viewletId, method, ...args);
-  }
-};
-
-/**
- * @deprecated
- */
-const dispose$2 = (id) => {
-  deleteState(id);
-  const instance = state$4.instances[id];
-  try {
-    instance.factory.dispose(instance.state);
-    if (instance.state.$Viewlet && instance.state.$Viewlet.isConnected) {
-      instance.state.$Viewlet.remove();
-    }
-  } catch (error) {
-    console.error(error);
-  }
-  delete state$4.instances[id];
-};
-
-const handleError$1 = (id, parentId, message) => {
-  console.log(`[viewlet-error] ${id}: ${message}`);
-  const instance = state$4.instances[id];
-  if (instance && instance.factory && instance.factory.handleError) {
-    instance.factory.handleError(instance.state, message);
-    return
-  }
-  // TODO error should bubble up to until highest possible component
-  const parentInstance = state$4.instances[parentId];
-  if (
-    parentInstance &&
-    parentInstance.factory &&
-    parentInstance.factory.handleError
-  ) {
-    parentInstance.factory.handleError(instance.state, message);
-    console.log('parent instance', parentInstance);
-    return
-  }
-  if (
-    instance &&
-    instance.state.$Viewlet &&
-    instance.state.$Viewlet.isConnected
-  ) {
-    instance.state.$Viewlet.textContent = `${message}`;
-  }
-};
-
-/**
- * @deprecated
- */
-const appendViewlet = (parentId, childId, focus) => {
-  if (parentId === 'Widget') {
-    // TODO
-    return
-  }
-  const parentInstanceState = state$4.instances[parentId]; // TODO must ensure that parent is already created
-  const parentModule = parentInstanceState.factory;
-  const childInstance = state$4.instances[childId];
-  if (!childInstance) {
-    throw new Error('child instance must be defined to be appended to parent')
-  }
-  parentModule.appendViewlet(
-    parentInstanceState.state,
-    childInstance.factory.name,
-    childInstance.state.$Viewlet
-  );
-  if (focus) {
-    childInstance.factory.focus(childInstance.state);
-  }
-};
-
-const __initialize__$5 = () => {
-  register$1('Viewlet.refresh', refresh);
-  register$1('Viewlet.invoke', invoke);
-  register$1('Viewlet.send', invoke);
-  register$1('Viewlet.focus', focus$2);
-  register$1('Viewlet.dispose', dispose$2);
-  register$1('Viewlet.appendViewlet', appendViewlet);
-  register$1('Viewlet.load', load);
-  register$1('Viewlet.handleError', handleError$1);
-  register$1('Viewlet.sendMultiple', sendMultiple);
-};
-
-var M6 = {
-  __proto__: null,
-  __initialize__: __initialize__$5
-};
-
-const state$3 = {
-  keyBindings: [],
-  modifier: '',
-  modifierTimeout: -1,
-};
-
-const getIdentifier = (event) => {
-  let identifier = '';
-  if (event.ctrlKey) {
-    identifier += 'ctrl+';
-  }
-  if (event.shiftKey) {
-    identifier += 'shift+';
-  }
-  if (event.altKey) {
-    identifier += 'alt+';
-  }
-  let key = event.key;
-  if (key === ' ') {
-    key = 'Space';
-  }
-  if (key.length === 1) {
-    key = key.toLowerCase();
-  }
-  identifier += key;
-  return identifier
-};
-
-// TODO store keybindings as json somewhere
-
-// TODO sort keybindings by `when` priority -> focus.editorCompletions: 10, focus.editor:9 etc.
-
-// TODO does it make sense to have all of these configurable?
-// could remove some context logic and have less user configuration when these are default
-// e.g. arrow down focuses next, arrow up always focuses previous item (like in aria spec)
-
-// TODO ui should only have keys -> commands get resolved inside renderer worker
-// TODO should toggle terminal, not only open
-
-const matchesContext = (keybinding) => {
-  if (!keybinding.when) {
-    return true
-  }
-  return get$1(keybinding.when)
-};
-
-const getMatchingKeyBinding = (identifier) => {
-  // TODO this could be more efficient in O(N) instead of O(2N)
-  const matchesIdentifier = (keyBinding) => {
-    return keyBinding.key === identifier
-  };
-  const matchingKeyBindings = state$3.keyBindings.filter(matchesIdentifier);
-  const matchingKeyBinding = matchingKeyBindings.find(matchesContext);
-  return matchingKeyBinding
-};
-
-const getModifier = (event) => {
-  switch (event.key) {
-    case 'Control':
-      return 'ctrl'
-    case 'Shift':
-      return 'shift'
-    case 'Alt':
-      return 'alt'
-  }
-  return ''
-};
-
-const clearModifier = () => {
-  if (!state$3.modifier) {
-    return
-  }
-  if (state$3.modifierTimeout !== -1) {
-    clearTimeout(state$3.modifierTimeout);
-    state$3.modifier = '';
-    state$3.modifierTimeout = -1;
-  }
-};
-
-const handleMatchingKeyBinding = (matchingKeyBinding) => {
-  // TODO execute command directly or -> executeCommand -> keybindings -> executeCommand
-  // better directly
-  // TODO always should be number
-  // when launching keybindings -> map string command to number
-  // TODO should args always be defined? (probably yes -> monomorphism & simpler code since all objects are the same)
-
-  // TODO matchingKeyBinding.command should always be number
-  send$1(
-    /* KeyBindings.handleKeyBinding */ 'KeyBindings.handleKeyBinding',
-    /* keyBinding */ matchingKeyBinding
-  );
-};
-
-const handleKeyDown$2 = (event) => {
-  const identifier = getIdentifier(event);
-  const matchingKeyBinding = getMatchingKeyBinding(identifier);
-  if (!matchingKeyBinding) {
-    return
-  }
-  event.preventDefault();
-  handleMatchingKeyBinding(matchingKeyBinding);
-};
-
-const handleKeyUp = (event) => {
-  const modifier = getModifier(event);
-  if (!modifier) {
-    clearModifier();
-    return
-  }
-  if (state$3.modifier === modifier) {
-    clearModifier();
-    const identifier = `${modifier} ${modifier}`;
-    const matchingKeyBinding = getMatchingKeyBinding(identifier);
-    if (matchingKeyBinding) {
-      handleMatchingKeyBinding(matchingKeyBinding);
-    }
-    return
-  }
-
-  state$3.modifier = modifier;
-  // @ts-ignore
-  state$3.modifierTimeout = setTimeout(clearModifier, 300);
-};
-
-const hydrate$1 = async (keyBindings) => {
-  // TODO is this the right place for browser context ?
-  // maybe in env file / env service
-  const browser = getBrowser();
-  set(`browser.${browser}`, true);
-  state$3.keyBindings = keyBindings;
-  window.addEventListener('keydown', handleKeyDown$2);
-  // TODO only need keyup listener if keybindings include double modifier key (e.g "shift shift")
-  window.addEventListener('keyup', handleKeyUp);
-};
-
-// TODO should be in renderer worker
-const lookupKeyBinding = (commandId) => {
-  switch (commandId) {
-    case 'scm.acceptInput':
-      return 'Ctrl+Enter'
-    default:
-      return ''
-  }
-};
-
-const __initialize__$4 = () => {
-  register$1('KeyBindings.hydrate', hydrate$1);
-  // Command.register(756, KeyBindings.setKeyBindings)
-};
-
-var M7 = {
-  __proto__: null,
-  __initialize__: __initialize__$4
-};
-
-// TODO global event bus is probably a bad idea
-// cons:
-// 1. it is not typesafe
-// 2. dependencies are unclear
-//
-// pros
-// 1. it decouples event emitter (e.g. Editor creation) from other module (Document syncing when editor was created)
-
-const state$2 = {
-  listenerMap: Object.create(null),
-};
-
-const emitEvent = (event, ...args) => {
-  const listeners = state$2.listenerMap[event] || [];
-  for (const listener of listeners) {
-    listener(...args);
-  }
-};
-
-const addListener = (event, fn) => {
-  state$2.listenerMap[event] ||= [];
-  if (state$2.listenerMap[event].includes(fn)) {
-    return
-  }
-  state$2.listenerMap[event].push(fn);
-};
-
-var M9 = {
-  __proto__: null,
-  state: state$2,
-  emitEvent: emitEvent,
-  addListener: addListener
-};
-
-const state$1 = {
-  isInDom: false,
-  $PreviousFocusElement: undefined,
-  widgetSet: new Set(),
-  $Widgets: undefined,
-};
-
-const create$Widgets = () => {
-  const $Widgets = document.createElement('div');
-  $Widgets.id = 'Widgets';
-  return $Widgets
-};
-
-const append = ($Element) => {
-  // TODO should not call append in the first place if it is already in dom
-  if (state$1.widgetSet.has($Element)) {
-    return
-  }
-  state$1.widgetSet.add($Element);
-  if (state$1.$Widgets) {
-    state$1.$Widgets.append($Element);
-  } else {
-    state$1.$Widgets = create$Widgets();
-    state$1.$Widgets.append($Element);
-    document.body.append(state$1.$Widgets);
-  }
-};
-
-const find = (id) => {
-  for (const $Widget of state$1.widgetSet) {
-    if ($Widget.dataset.id === id) {
-      return $Widget
-    }
-  }
-  return undefined
-};
-
-const remove = ($Element) => {
-  if (!$Element) {
-    // TODO $Element should always be defined
-    return
-  }
-  state$1.widgetSet.delete($Element);
-  $Element.remove();
-  // TODO state.$Widgets should always be defined at this point
-  if (state$1.widgetSet.size === 0 && state$1.$Widgets) {
-    state$1.$Widgets.remove();
-    state$1.$Widgets = undefined;
-  }
-};
-
-var M14 = {
-  __proto__: null,
-  state: state$1,
-  append: append,
-  find: find,
-  remove: remove
-};
-
-const getItem = (key) => {
-  return localStorage.getItem(key) || undefined
-};
-
-const setItem = (key, value) => {
-  localStorage.setItem(key, value);
-};
-
-const clear = () => {
-  localStorage.clear();
-};
-
-const __initialize__$3 = () => {
-  register$1('LocalStorage.clear', clear);
-  register$1('LocalStorage.getItem', getItem);
-  register$1('LocalStorage.setItem', setItem);
-};
-
-var M15 = {
-  __proto__: null,
-  __initialize__: __initialize__$3
-};
-
-const supportsServiceWorker = () => {
-  return 'serviceWorker' in navigator
-};
-
-const handleUpdateFound = () => {
-  // console.info('[service-worker] update found')
-};
-
-const handleControllerChange = () => {
-  // console.info('[service-worker] controller changed - reloading page')
-  location.reload();
-};
-
-const register = async (url) => {
-  if (!supportsServiceWorker()) {
-    return
-  }
-  const registration = await navigator.serviceWorker.register(url, {
-    scope: '/',
-    type: 'module',
-  });
-  registration.onupdatefound = handleUpdateFound;
-  navigator.serviceWorker.oncontrollerchange = handleControllerChange;
-};
-
-const uninstallRegistration = async (registration) => {
-  await registration.unregister();
-};
-
-const uninstall = async () => {
-  if (!supportsServiceWorker()) {
-    return
-  }
-  const registrations = await navigator.serviceWorker.getRegistrations();
-  await Promise.all(registrations.map(uninstallRegistration));
-};
-
-const __initialize__$2 = () => {
-  register$1('ServiceWorker.register', register);
-  register$1('ServiceWorker.uninstall', uninstall);
-};
-
-var M22 = {
-  __proto__: null,
-  __initialize__: __initialize__$2
-};
-
-const getPathName = () => {
-  return location.pathname
-};
-
-const getHref = () => {
-  return location.href
-};
-
-// TODO should do nothing if it is already at this path
-const setPathName = (pathName) => {
-  const currentPathName = getPathName();
-  if (currentPathName === pathName) {
-    return
-  }
-  history.pushState(null, null, pathName);
-};
-
-const handlePopState = (event) => {
-  send$1(/* Workspace.hydrate */ 'Workspace.hydrate');
-};
-
-const hydrate = () => {
-  addEventListener('popstate', handlePopState);
-};
-
-const __initialize__$1 = () => {
-  register$1('Location.getHref', getHref);
-  register$1('Location.getPathName', getPathName);
-  register$1('Location.hydrate', hydrate);
-  register$1('Location.setPathName', setPathName);
-};
-
-var M26 = {
-  __proto__: null,
-  __initialize__: __initialize__$1
-};
-
-// TODO this module should be called dom or dom utils
-
-// TODO this module makes for weird code splitting chunks,
-// maybe duplicate the code per file for better chunks
-
-const findIndex = ($Container, $Target) => {
-  while ($Target && $Target.parentNode !== $Container) {
-    $Target = $Target.parentNode;
-  }
-  if (!$Target) {
-    // console.log('no target to find', $Target, event.target)
-    return -1
-  }
-  for (let i = 0; i < $Container.children.length; i++) {
-    if ($Container.children[i] === $Target) {
-      return i
-    }
-  }
-  return -1
-};
-
-const getLabel = (item) => {
-  if (!item || !item.label) {
-    console.warn('menu item has missing label', item);
-    return 'n/a'
-  }
-  return item.label
-};
-
-const create$MenuItem = (item) => {
-  const $MenuItem = document.createElement('li');
-  switch (item.flags) {
-    case /* None */ 0:
-      $MenuItem.className = 'MenuItem';
-      $MenuItem.setAttribute('role', 'menuitem');
-      $MenuItem.textContent = getLabel(item);
-      $MenuItem.tabIndex = -1;
-      break
-    case /* Separator */ 1:
-      $MenuItem.className = 'MenuItemSeparator';
-      $MenuItem.setAttribute('role', 'separator');
-      break
-    case /* Checked */ 2:
-      $MenuItem.className = 'MenuItem';
-      $MenuItem.setAttribute('role', 'menuitemcheckbox');
-      $MenuItem.ariaChecked = 'true';
-      $MenuItem.textContent = getLabel(item);
-      $MenuItem.tabIndex = -1;
-      break
-    case /* UnChecked */ 3:
-      $MenuItem.className = 'MenuItem';
-      $MenuItem.setAttribute('role', 'menuitemcheckbox');
-      $MenuItem.ariaChecked = 'false';
-      $MenuItem.textContent = getLabel(item);
-      $MenuItem.tabIndex = -1;
-      break
-    case /* SubMenu */ 4:
-      $MenuItem.className = 'MenuItem';
-      $MenuItem.setAttribute('role', 'menuitem');
-      $MenuItem.textContent = getLabel(item);
-      $MenuItem.tabIndex = -1;
-      $MenuItem.ariaHasPopup = 'true';
-      $MenuItem.ariaExpanded = 'false';
-      break
-    case /* Disabled */ 5:
-      $MenuItem.className = 'MenuItem';
-      $MenuItem.setAttribute('role', 'menuitem');
-      $MenuItem.textContent = getLabel(item);
-      $MenuItem.tabIndex = -1;
-      $MenuItem.setAttribute('disabled', 'true');
-      break
-    default:
-      $MenuItem.className = 'MenuItem';
-      $MenuItem.setAttribute('role', 'menuitem');
-      $MenuItem.textContent = getLabel(item);
-      $MenuItem.tabIndex = -1;
-      console.warn('invalid menu item flags:', item);
-      break
-  }
-  return $MenuItem
-};
-
-const create$BackDrop = () => {
-  const $BackDrop = document.createElement('div');
-  $BackDrop.id = 'BackDrop';
-  return $BackDrop
-};
-
-// TODO when pressing tab -> focus next element in tab order and close menu
-
-// TODO menu and contextmenu should have own keybinding logic
-// seems not possible to do with just one keybinding listener
-
-// TODO similar to context menu, show sub menu entries
-// there can be multiple instances (parent -> child -> child) submenus
-
-// TODO using .style.top, .style.left causes chrome devtools to show many layout shift -> maybe use transform instead
-
-// TODO when cycling through items, recalculate style is much slower
-// than in vscode (1.49ms vs 0.33ms)
-// paint is also faster in vscode (0.32ms vs 0.14ms)
-
-// TODO focus on menu is not announced to screenreader
-
-// TODO recalculate style and paint is slow when cycling through items:
-// 0.59ms recalculate style
-// 36us update layer tree
-// 0.35ms paint
-// 0.20ms composite layer
-
-// const contextMenuWidth = 150
-// const contextMenuHeight = 150 + /* padding */ 8 * 4
-
-// TODO keyboard handling
-
-const state = {
-  handleKeyDown(event) {},
-  handleFocusOut(event) {},
-  $$Menus: [],
-  anchorX: 0,
-  anchorY: 0,
-  anchorTime: -1,
-  $BackDrop: undefined,
-};
-
-const getLevel = ($Menu) => {
-  return state.$$Menus.indexOf($Menu)
-};
-
-const handleMouseDown = (event) => {
-  const $Target = event.target;
-  const $Menu = $Target.closest('.Menu');
-  const index = findIndex($Menu, $Target);
-  if (index === -1) {
-    console.log('index is negative one');
-    return
-  }
-  event.preventDefault();
-  const level = getLevel($Menu);
-  send$1(
-    /* Menu.handleClick */ 'Menu.selectIndex',
-    /* level */ level,
-    /* index */ index
-  );
-};
-
-/**
- *
- * @param {MouseEvent} event
- */
-const handleMouseEnter$1 = (event) => {
-  const $Target = event.target;
-  // @ts-ignore
-  const $Menu = $Target.closest('.Menu');
-  const x = event.clientX;
-  const y = event.clientY;
-  const timeStamp = event.timeStamp;
-
-  const index = findIndex($Menu, $Target);
-  if (index === -1) {
-    return
-  }
-  const level = getLevel($Menu);
-  send$1(
-    /* Menu.handleMouseEnter */ 'Menu.handleMouseEnter',
-    /* level */ level,
-    /* index */ index,
-    /* x */ x,
-    /* y */ y,
-    /* timeStamp */ timeStamp
-  );
-};
-
-const handleMouseMove = (event) => {
-  // const x = event.clientX
-  // const y = event.clientY
-  // console.log('move', { x, y })
-};
-
-const handleMouseLeave = (event) => {
-  // const x = event.clientX
-  // const y = event.clientY
-  // console.log('leave', { x, y })
-};
-
-// const handleBlur = (event) => {}
-const handleKeyDown$1 = (event) => {
-  state.handleKeyDown(event);
-};
-
-const handleFocusOut$1 = (event) => {
-  state.handleFocusOut(event);
-};
-
-const create$Menu = () => {
-  // TODO set aria label on menu (e.g. File, Edit, Selection)
-  const $Menu = document.createElement('ul');
-  $Menu.className = 'Menu';
-  $Menu.setAttribute('role', 'menu');
-  $Menu.tabIndex = -1;
-  // $ContextMenu.onmousedown = contextMenuHandleMouseDown
-  // TODO mousedown vs click? (click is usually better but mousedown is faster, why wait 100ms?)
-  $Menu.addEventListener('mousedown', handleMouseDown);
-  $Menu.addEventListener('mouseenter', handleMouseEnter$1, {
-    capture: true,
-  });
-  $Menu.addEventListener('mouseleave', handleMouseLeave, {
-    capture: true,
-  });
-  $Menu.addEventListener('mousemove', handleMouseMove, {
-    passive: true,
-  });
-  $Menu.onkeydown = handleKeyDown$1;
-  $Menu.addEventListener('focusout', handleFocusOut$1);
-  $Menu.oncontextmenu = handleContextMenu$1;
-  // $ContextMenu.onfocus = handleFocus
-  // $ContextMenu.onblur = handleBlur
-  return $Menu
-};
-
-const focusIndex$1 = (level, oldFocusedIndex, newFocusedIndex) => {
-  const $Menu = state.$$Menus[level];
-  if (oldFocusedIndex !== -1) {
-    $Menu.children[oldFocusedIndex].classList.remove('Focused');
-  }
-  if (newFocusedIndex !== -1) {
-    $Menu.children[newFocusedIndex].classList.add('Focused');
-    $Menu.children[newFocusedIndex].focus();
-  }
-};
-
-// TODO replace function that recycles menu dom nodes
-
-const handleBackDropMouseDown = () => {
-  send$1(/* Menu.hide */ 'Menu.hide');
-};
-
-const handleContextMenu$1 = (event) => {
-  event.preventDefault();
-};
-
-const showMenu = (
-  x,
-  y,
-  width,
-  height,
-  items,
-  level,
-  parentIndex = -1,
-  mouseBlocking = false
-) => {
-  if (mouseBlocking) {
-    const $BackDrop = create$BackDrop();
-    $BackDrop.onmousedown = handleBackDropMouseDown;
-    $BackDrop.oncontextmenu = handleContextMenu$1;
-    state.$BackDrop = $BackDrop;
-    append($BackDrop);
-  }
-
-  const $Menu = create$Menu();
-  $Menu.append(...items.map(create$MenuItem));
-  $Menu.style.left = `${x}px`;
-  $Menu.style.top = `${y}px`;
-  $Menu.id = `Menu-${level}`;
-
-  if (parentIndex !== -1) {
-    const $ParentMenu = state.$$Menus[level - 1];
-    const $ParentMenuItem = $ParentMenu.children[parentIndex];
-    $ParentMenuItem.ariaExpanded = 'true';
-    $ParentMenuItem.setAttribute('aria-owns', $Menu.id);
-  }
-
-  state.$$Menus.push($Menu);
-  append($Menu);
-
-  if (level === 0) {
-    focus$4($Menu, 'menu');
-  }
-};
-
-const showContextMenu = (x, y, width, height, level, items) => {
-  for (const $Menu of state.$$Menus) {
-    remove($Menu);
-  }
-  state.$$Menus = [];
-  while (state.$$Menus.length > 0) {
-    state.$$Menus[0].remove();
-  }
-  const $Menu = create$Menu();
-  $Menu.append(...items.map(create$MenuItem));
-  $Menu.style.left = `${x}px`;
-  $Menu.style.top = `${y}px`;
-  $Menu.id = `Menu-${level}`;
-  append($Menu);
-  state.$$Menus.push($Menu);
-  // TODO create backdrop
-};
-
-const closeSubMenu = () => {
-  const $SubMenu = state.$$Menus.pop();
-  state.$$Menus.at(-1);
-  remove($SubMenu);
-};
-
-const hideSubMenu = (level) => {
-  const $$ChildMenus = state.$$Menus.slice(level);
-  for (const $ChildMenu of $$ChildMenus) {
-    remove($ChildMenu);
-  }
-};
-
-// export const showSubMenu = (level, items, parentIndex) => {
-//   const $$ChildMenus = state.$$Menus.slice(level)
-//   for (const $ChildMenu of $$ChildMenus) {
-//     Widget.remove($ChildMenu)
-//   }
-//   state.$$Menus = state.$$Menus.slice(0, level)
-//   const $ParentMenu = state.$$Menus[level - 1]
-//   const $ParentMenuItem = $ParentMenu.children[parentIndex]
-//   const rect = $ParentMenuItem.getBoundingClientRect()
-//   const x = rect.right
-//   const y = rect.top
-//   showMenu(x, y, items, level)
-//   // TODO remove aria-owns when sub-menu is closed
-//   $ParentMenuItem.setAttribute('aria-owns', 'Menu')
-// }
-
-// TODO implement focusIndex like this
-// const focusIndex2=(id, index)=>{
-//   const $Menu = state.menus[id]
-//   $Menu.children[index].focus()
-// }
-
-// TODO support nested menus / submenus
-const showControlled = ({
-  x,
-  y,
-  items,
-  handleKeyDown,
-  handleFocusOut,
-  $Parent,
-  level,
-  width,
-  height,
-}) => {
-  showMenu(x, y, width, height, items, level);
-  // TODO menu should not necessarily know about parent (titleBarMenuBar)
-  // it should be the other way around
-  state.$Parent = $Parent;
-  state.handleFocusOut = handleFocusOut;
-  state.handleKeyDown = handleKeyDown;
-  if ($Parent) {
-    // state.$Menu.ariaLabel=''
-    // state.$Menu.ariaLabelledBy  =$Parent.id
-    $Parent.setAttribute('aria-owns', 'Menu');
-  }
-  // Context.setFocus('menu') // TODO overlapping focus: titleBarMenuBar has focus (kinda) but also menu at the same time
-};
-
-// TODO have function to show submenu
-
-const hide = (restoreFocus = true) => {
-  for (const $Menu of state.$$Menus) {
-    remove($Menu);
-  }
-  state.$$Menus = [];
-  if (state.$BackDrop) {
-    remove(state.$BackDrop);
-    state.$BackDrop = undefined;
-  }
-  // TODO focus previous item
-  if (restoreFocus) {
-    focusPrevious();
-  }
-};
-
-const contains = ($Element) => {
-  for (const $Menu of state.$$Menus) {
-    if ($Menu.contains($Element)) {
-      return true
-    }
-  }
-  return false
-};
-
-var M13 = {
-  __proto__: null,
-  state: state,
-  focusIndex: focusIndex$1,
-  showMenu: showMenu,
-  showContextMenu: showContextMenu,
-  closeSubMenu: closeSubMenu,
-  hideSubMenu: hideSubMenu,
-  showControlled: showControlled,
-  hide: hide,
-  contains: contains
-};
-
-// TODO set aria-selected false when sidebar is collapsed
-
-const create$ActivityBarItemIcon = (icon) => {
-  const $ActivityBarItemIcon = document.createElement('div');
-  $ActivityBarItemIcon.className = 'ActivityBarItemIcon';
-  // @ts-ignore
-  $ActivityBarItemIcon.style.maskImage = `url(${icon})`;
-  $ActivityBarItemIcon.style.webkitMaskImage = `url(${icon})`;
-  return $ActivityBarItemIcon
-};
-
-// TODO assetDir might not work with non-builtin extension icons
-const create$ActivityBarItem = (item) => {
-  const assetDir = getAssetDir();
-  const $ActivityBarItemIcon = create$ActivityBarItemIcon(
-    `${assetDir}/${item.icon}`
-  );
-  const $ActivityBarItem = document.createElement('div');
-  $ActivityBarItem.className = 'ActivityBarItem';
-  $ActivityBarItem.ariaLabel = ''; // aria-label is determined by content  TODO is empty aria-label necessary or can it be left off?
-  $ActivityBarItem.title = item.id;
-  $ActivityBarItem.tabIndex = -1;
-  $ActivityBarItem.dataset.viewletId = item.id;
-  if (item.keyShortcuts) {
-    $ActivityBarItem.ariaKeyShortcuts = item.keyShortcuts;
-  }
-  switch (item.flags) {
-    case /* Tab */ 1:
-      $ActivityBarItem.setAttribute('role', 'tab');
-      $ActivityBarItem.ariaSelected = 'false';
-      break
-    case /* Button */ 2:
-      $ActivityBarItem.setAttribute('role', 'button');
-      $ActivityBarItem.ariaHasPopup = 'true';
-      break
-    default:
-      console.warn(`unknown activity bar item flags ${item.flags}`);
-      break
-  }
-  $ActivityBarItem.append($ActivityBarItemIcon);
-  return $ActivityBarItem
-};
-
-const get$ItemFromEvent = (event) => {
-  const $Target = event.target;
-  switch ($Target.className) {
-    case 'ActivityBarItemIcon':
-      return $Target.parentNode
-    case 'ActivityBarItem':
-      return $Target
-    default:
-      return undefined
-  }
-};
-
-const getNodeIndex$1 = ($Node) => {
-  let index = 0;
-  while (($Node = $Node.previousElementSibling)) {
-    index++;
-  }
-  return index
-};
-
-const handleMousedown = (event) => {
-  if (event.button !== 0) {
-    return
-  }
-  const $Item = get$ItemFromEvent(event);
-  if (!$Item) {
-    return
-  }
-  event.preventDefault();
-  event.stopPropagation();
-  const index = getNodeIndex$1($Item);
-  const x = event.clientX;
-  const y = event.clientY;
-  send$1(
-    /* ActivityBar.handleClick */ 'ActivityBar.handleClick',
-    /* index */ index,
-    /* x */ x,
-    /* y */ y
-  );
-};
-
-const handleContextMenu = (event) => {
-  event.preventDefault();
-  // TODO also move side bar position command
-  const x = event.clientX;
-  const y = event.clientY;
-  send$1(
-    /* activityBarHandleContextMenu */ 'ActivityBar.handleContextMenu',
-    /* x */ x,
-    /* y */ y
-  );
-};
-
-const handleBlur = () => {};
-
-const name = 'ActivityBar';
-
-const create$3 = () => {
-  const $ActivityBar = state$8.$ActivityBar;
-  $ActivityBar.setAttribute('role', 'toolbar'); // TODO use idl once supported by chrome
-  $ActivityBar.ariaLabel = 'Activity Bar';
-  $ActivityBar.ariaOrientation = 'vertical';
-  // $ActivityBar.append(...activityBarItems.map(create$ActivityBarItem))
-  $ActivityBar.onmousedown = handleMousedown;
-  $ActivityBar.oncontextmenu = handleContextMenu;
-  $ActivityBar.onblur = handleBlur;
-  $ActivityBar.addEventListener('focusin', handleFocusIn);
-  // $ActivityBar.children[focusedIndex].tabIndex = 0
-  return {
-    $ActivityBar,
-  }
-};
-
-const dispose$1 = (state) => {};
-
-const setItems$1 = (state, activityBarItems) => {
-  object(state);
-  array(activityBarItems);
-  const $ActivityBar = state.$ActivityBar;
-  while ($ActivityBar.firstChild) {
-    $ActivityBar.firstChild.remove();
-  }
-  $ActivityBar.append(...activityBarItems.map(create$ActivityBarItem));
-};
-
-const handleFocusIn = () => {
-  setFocus('activityBar');
-};
-
-const selectIndex = (state, oldIndex, newIndex) => {
-  if (oldIndex !== -1) {
-    const $OldItem = state.$ActivityBar.children[oldIndex];
-    $OldItem.ariaSelected = 'false';
-    if (newIndex !== -1) {
-      $OldItem.tabIndex = -1;
-    }
-  }
-  if (newIndex !== -1) {
-    const $NewItem = state.$ActivityBar.children[newIndex];
-    $NewItem.ariaSelected = 'true';
-    $NewItem.tabIndex = 0;
-  }
-};
-
-const focus$Item = ($Item) => {
-  focus$4($Item, 'activityBar');
-};
-
-const setFocusedIndex = (state, oldIndex, newIndex) => {
-  const { $ActivityBar } = state;
-  if (oldIndex !== -1) {
-    const $OldItem = $ActivityBar.children[oldIndex];
-    $OldItem.tabIndex = -1;
-    $OldItem.classList.remove('FocusOutline');
-  }
-  if (newIndex !== -1) {
-    const $NewItem = $ActivityBar.children[newIndex];
-    $NewItem.tabIndex = 0;
-    $NewItem.classList.add('FocusOutline');
-    focus$Item($NewItem);
-  }
-};
-
-const setBadgeCount = (state, index, count) => {
-  const { $ActivityBar } = state;
-  const $Item = $ActivityBar.children[index];
-  const $Badge = document.createElement('div');
-  $Badge.className = 'ActivityBarItemBadge';
-  $Badge.textContent = `${count}`;
-  // @ts-ignore
-  $Item.append($Badge);
-};
-
-var M27 = {
-  __proto__: null,
-  name: name,
-  create: create$3,
-  dispose: dispose$1,
-  setItems: setItems$1,
-  selectIndex: selectIndex,
-  setFocusedIndex: setFocusedIndex,
-  setBadgeCount: setBadgeCount
-};
-
-const getIconClassName = (icon) => {
-  switch (icon) {
-    case '$(sync-spin)':
-    case '$(sync~spin)':
-      return 'StatusBarIcon AnimationSpin'
-    case '$(sync)':
-      return 'StatusBarIcon'
-    case '$(source-control)':
-      return 'StatusBarIcon'
-    default:
-      console.warn(`unknown icon "${icon}"`);
-      return ''
-  }
-};
-
-const getMaskImageUrl = (icon) => {
-  switch (icon) {
-    case '$(sync-spin)':
-    case '$(sync~spin)':
-    case '$(sync)':
-      return 'url(/icons/icon-sync.svg)'
-    case '$(source-control)':
-      return 'url(/icons/icon-source-control.svg)'
-    default:
-      return ''
-  }
-};
-
-const create$StatusBarItem = (item) => {
-  const $StatusBarItem = document.createElement('li');
-  $StatusBarItem.className = 'StatusBarItem';
-  $StatusBarItem.setAttribute('role', 'button');
-  $StatusBarItem.dataset.name = item.name;
-  $StatusBarItem.tabIndex = -1;
-  $StatusBarItem.textContent = item.text;
-  $StatusBarItem.dataset.command = item.command;
-  if (item.tooltip) {
-    $StatusBarItem.title = item.tooltip;
-  }
-  if (item.icon) {
-    const $StatusBarItemIcon = document.createElement('span');
-    $StatusBarItemIcon.className = getIconClassName(item.icon);
-    // @ts-ignore
-    $StatusBarItemIcon.style.maskImage = getMaskImageUrl(item.icon);
-    $StatusBarItemIcon.style.webkitMaskImage = getMaskImageUrl(item.icon);
-    $StatusBarItem.prepend($StatusBarItemIcon);
-  }
-  return $StatusBarItem
-};
-
-const handleClick$1 = (event) => {
-  const $Target = event.target;
-  if ($Target.className !== 'StatusBarItem') {
-    return
-  }
-  const command = Number.parseInt($Target.dataset.command, 10);
-  send$1(command);
-};
-
-// TODO get items from renderer worker
-// const statusBarItemsLeft = [
-//   {
-//     name: 'RunTests',
-//     text: 'Run Tests',
-//     tooltip: '',
-//     command: 909021,
-//   },
-// ]
-
-// const statusBarItemsRight = []
-
-const create$2 = (statusBarItemsLeft, statusBarItemsRight) => {
-  const $StatusBarItemsLeft = document.createElement('ul');
-  $StatusBarItemsLeft.id = 'StatusBarItemsLeft';
-
-  const $StatusBarItemsRight = document.createElement('ul');
-  $StatusBarItemsRight.id = 'StatusBarItemsRight';
-
-  const $StatusBar = state$8.$StatusBar;
-  $StatusBar.onclick = handleClick$1;
-  $StatusBar.tabIndex = 0;
-  $StatusBar.setAttribute('role', 'status');
-  $StatusBar.ariaLive = 'off'; // see https://github.com/microsoft/vscode/issues/94677
-  $StatusBar.append($StatusBarItemsLeft, $StatusBarItemsRight);
-
-  return {
-    $StatusBar,
-    $StatusBarItemsLeft,
-    $StatusBarItemsRight,
-  }
-};
-
-const clearNode = (node) => {
-  while (node.firstChild) {
-    node.firstChild.remove();
-  }
-};
-
-const setItems = (state, statusBarItemsLeft, statusBarItemsRight) => {
-  const $StatusBarItemsLeft = state.$StatusBarItemsLeft;
-  const $StatusBarItemsRight = state.$StatusBarItemsRight;
-  clearNode($StatusBarItemsLeft);
-  clearNode($StatusBarItemsRight);
-  $StatusBarItemsLeft.append(...statusBarItemsLeft.map(create$StatusBarItem));
-  $StatusBarItemsRight.append(...statusBarItemsRight.map(create$StatusBarItem));
-};
-
-const focus$1 = (state) => {
-  object(state);
-  state.$StatusBar.focus();
-};
-
-var M28 = {
-  __proto__: null,
-  create: create$2,
-  setItems: setItems,
-  focus: focus$1
-};
-
-// TODO set proper tabIndex 0 to focused item https://www.w3.org/TR/wai-aria-practices/examples/menubar/menubar-1/menubar-1.html
-
-// TODO screenreader doesn't read top level label
-// when menu is open,
-// first item is selected,
-// right is clicked it just reads
-// "Expanded" instead of "Selection Expanded"
-
-// TODO sometimes screenreader reads too much (e.g. "File, expanded, opens menu, expanded")
-
-// TODO don't focus on separators
-
-// TODO don't focus on hover
-// only focus on hover when it has already focus or the menu has focus
-
-// TODO title bar menu bar is very inefficient:
-
-// before: 5 times recalculate style
-// 1.37ms Recalculate style
-// 83us Update Layer tree
-// 0.34ms paint
-// 0.79ms composite layer
-// 0.23ms Hit test
-// 1.42ms Recalculate style
-// 1.44ms Recalculate style
-// 2.08ms Recalculate style
-// 0.44ms Recalculate style
-// 0.52ms Layout
-// 0.16ms Update Layer Tree
-// 48us hit test
-// 16us Update Layer Tree
-// 0.36ms paint
-// 0.33ms composite layer
-
-// now: 2 recalculate styles
-// 0.43ms recalculate style
-// 0.53ms recalculate style
-// 0.19ms layout
-// 0.16ms update layer tree
-// 30us hit test
-// 17us update layer tree
-// 0.17ms paint
-// 0.19ms composite layers
-
-const create$TopLevelEntry = (item) => {
-  const $TitleBarTopLevelEntry = document.createElement('li');
-  $TitleBarTopLevelEntry.className = 'TitleBarTopLevelEntry';
-  $TitleBarTopLevelEntry.tabIndex = -1;
-  $TitleBarTopLevelEntry.ariaHasPopup = 'true';
-  $TitleBarTopLevelEntry.ariaExpanded = 'false';
-  $TitleBarTopLevelEntry.setAttribute('role', 'menuitem'); // TODO use idl once supported by chrome
-  if (item.keyboardShortCut) {
-    $TitleBarTopLevelEntry.ariaKeyShortcuts = item.keyboardShortCut;
-  }
-  $TitleBarTopLevelEntry.textContent = item.name;
-  $TitleBarTopLevelEntry.dataset.id = item.id;
-  $TitleBarTopLevelEntry.id = `MenuItem-${item.id}`;
-  return $TitleBarTopLevelEntry
-};
-
-const getMenuEntryBounds = (state, index) => {
-  const $MenuEntry = state.$TitleBarMenu.children[index];
-  const rect = $MenuEntry.getBoundingClientRect();
-  return {
-    left: rect.left,
-    bottom: rect.bottom,
-  }
-};
-
-const getNodeIndex = ($Node) => {
-  let index = 0;
-  while (($Node = $Node.previousElementSibling)) {
-    index++;
-  }
-  return index
-};
-
-const getIndex = ($Target) => {
-  switch ($Target.className) {
-    case 'TitleBarTopLevelEntry':
-      return getNodeIndex($Target)
-    default:
-      return -1
-  }
-};
-
-const handleClick = (event) => {
-  const $Target = event.target;
-  const index = getIndex($Target);
-  if (index === -1) {
-    return
-  }
-  // event.preventDefault()
-  send$1(
-    /* TitleBarMenu.toggleIndex */ 'TitleBarMenuBar.toggleIndex',
-    /* index */ index
-  );
-};
-
-const focusIndex = (state, unFocusIndex, index) => {
-  object(state);
-  number(unFocusIndex);
-  number(focusIndex);
-  console.log('FOCUS ONE');
-  console.log({ unFocusIndex, index });
-  const $TitleBarMenu = state.$TitleBarMenu;
-  if (unFocusIndex !== -1) {
-    $TitleBarMenu.children[unFocusIndex].ariaExpanded = 'false';
-    $TitleBarMenu.children[unFocusIndex].removeAttribute('aria-owns');
-  }
-  $TitleBarMenu.children[index].focus();
-};
-
-const handleMouseEnter = (event) => {
-  const $Target = event.target;
-  const index = getIndex($Target);
-  if (index === -1) {
-    return
-  }
-  const enterX = event.clientX;
-  const enterY = event.clientY;
-  send$1(
-    /* TitleBarMenu.focusIndex */ 'TitleBarMenuBar.focusIndex',
-    /* index */ index,
-    /* enterX */ enterX,
-    /* enterY */ enterY
-  );
-};
-
-// TODO the focus variable is confusing: false means keep focus in menubar, true means focus the menu
-const openMenu = (
-  state$1,
-  unFocusIndex,
-  index,
-  level,
-  menuItems,
-  menuFocusedIndex,
-  focus,
-  x,
-  y,
-  width,
-  height
-) => {
-  object(state$1);
-  number(unFocusIndex);
-  number(index);
-  number(level);
-  array(menuItems);
-  number(menuFocusedIndex);
-  boolean(focus);
-  number(x);
-  number(y);
-  number(width);
-  number(height);
-  // TODO this code is very unclean
-  state$1.$TitleBarMenu.addEventListener('mouseenter', handleMouseEnter, {
-    capture: true,
-  });
-  if (unFocusIndex !== -1) {
-    state$1.$TitleBarMenu.children[unFocusIndex].ariaExpanded = 'false';
-    state$1.$TitleBarMenu.children[unFocusIndex].removeAttribute('aria-owns');
-  }
-  state$1.$TitleBarMenu.children[index].ariaExpanded = 'true';
-  const $$Menus = state.$$Menus;
-  state.$$Menus = [];
-  showControlled({
-    x,
-    y,
-    width,
-    height,
-    items: menuItems,
-    handleKeyDown,
-    handleFocusOut,
-    $Parent: state$1.$TitleBarMenu.children[index],
-    level,
-  });
-  if (menuFocusedIndex !== -1) {
-    focusIndex$1(0, -1, menuFocusedIndex);
-  }
-  for (const $Menu of $$Menus) {
-    remove($Menu);
-  }
-};
-
-// TODO there need to be two variants of closeMenu: one just closes menu, another close menu and focuses top level entry
-const closeMenu = (state, unFocusIndex, index) => {
-  if (unFocusIndex !== -1) {
-    state.$TitleBarMenu.children[unFocusIndex].ariaExpanded = 'false';
-    state.$TitleBarMenu.children[unFocusIndex].removeAttribute('aria-owns');
-  }
-  if (index !== -1) {
-    state.$TitleBarMenu.children[index].focus();
-  }
-  hide(/* restoreFocus */ false);
-  state.$TitleBarMenu.removeEventListener('mouseenter', handleMouseEnter, {
-    capture: true,
-  });
-};
-
-// TODO should only have the one listener in KeyBindings.js
-const handleKeyDown = (event) => {
-  switch (event.key) {
-    case 'ArrowDown':
-      event.preventDefault();
-      event.stopPropagation();
-      send$1(
-        /* TitleBarMenu.handleKeyArrowDown */ 'TitleBarMenu.handleKeyArrowDown'
-      );
-      break
-    case 'ArrowUp':
-      event.preventDefault();
-      event.stopPropagation();
-      send$1(
-        /* TitleBarMenu.handleKeyArrowUp */ 'TitleBarMenu.handleKeyArrowUp'
-      );
-      break
-    case 'ArrowRight':
-      console.log('arrow right');
-      event.preventDefault();
-      event.stopPropagation();
-      send$1(
-        /* TitleBarMenu.handleKeyArrowRight */ 'TitleBarMenu.handleKeyArrowRight'
-      );
-      break
-    case 'ArrowLeft':
-      event.preventDefault();
-      event.stopPropagation();
-      send$1(
-        /* TitleBarMenu.handleKeyArrowLeft */ 'TitleBarMenu.handleKeyArrowLeft'
-      );
-      break
-    case 'Enter':
-      event.preventDefault();
-      event.stopPropagation();
-      send$1(
-        /* TitleBarMenu.handleKeyEnter */ 'TitleBarMenu.handleKeyEnter'
-      );
-      break
-    case ' ':
-      event.preventDefault();
-      event.stopPropagation();
-      send$1(
-        /* TitleBarMenu.handleKeySpace */ 'TitleBarMenu.handleKeySpace'
-      );
-      break
-    case 'Home':
-    case 'PageUp':
-      event.preventDefault();
-      event.stopPropagation();
-      send$1(
-        /* TitleBarMenu.handleKeyHome */ 'TitleBarMenu.handleKeyHome'
-      );
-      break
-    case 'End':
-    case 'PageDown':
-      event.preventDefault();
-      event.stopPropagation();
-      send$1(
-        /* TitleBarMenu.handleKeyEnd */ 'TitleBarMenu.handleKeyEnd'
-      );
-      break
-    case 'Escape':
-      event.preventDefault();
-      event.stopPropagation();
-      send$1(
-        /* TitleBarMenu.handleKeyEscape */ 'TitleBarMenu.handleKeyEscape'
-      );
-      break
-  }
-};
-
-const isInsideTitleBarMenu = ($Element) => {
-  return (
-    $Element.classList.contains('MenuItem') ||
-    $Element.classList.contains('Menu')
-  )
-};
-
-const handleFocusOut = (event) => {
-  const $ActiveElement = event.relatedTarget;
-  if ($ActiveElement && isInsideTitleBarMenu($ActiveElement)) {
-    console.log('RETURN');
-    return
-  }
-  send$1(
-    /* TitleBarMenu.closeMenu */ 'TitleBarMenuBar.closeMenu',
-    /* keepFocus */ false
-  );
-};
-
-const create$1 = () => {
-  const $TitleBarMenu = document.createElement('ul');
-  $TitleBarMenu.id = 'TitleBarMenu';
-  $TitleBarMenu.setAttribute('role', 'menubar');
-  $TitleBarMenu.onkeydown = handleKeyDown;
-  // TODO could have one mousedown listener on titlebar that delegates to titlebarMenu if necessary
-  $TitleBarMenu.onmousedown = handleClick;
-  $TitleBarMenu.addEventListener('focusout', handleFocusOut);
-  return $TitleBarMenu
-};
-
-const setEntries = (state, titleBarEntries) => {
-  const $TitleBarMenu = state.$TitleBarMenu;
-  $TitleBarMenu.append(...titleBarEntries.map(create$TopLevelEntry));
-};
-
-const create = () => {
-  const $TitleBarMenu = create$1();
-  // TODO set aria label for title bar menu
-  // TODO add tests for aria properties
-  const $TitleBar = state$8.$TitleBar;
-  $TitleBar.ariaLabel = 'Title Bar';
-  $TitleBar.setAttribute('role', 'contentinfo');
-  $TitleBar.append($TitleBarMenu);
-  return {
-    $TitleBar,
-    $TitleBarMenu,
-  }
-};
-
-const dispose = (state) => {};
-
-const focus = (state) => {
-  state.$TitleBarMenu.firstChild.focus();
-};
-
-const menuSetEntries = setEntries;
-
-const menuFocusIndex = focusIndex;
-
-const menuOpen = openMenu;
-
-const menuClose = closeMenu;
-
-const menuGetEntryBounds = getMenuEntryBounds;
-
-var M29 = {
-  __proto__: null,
-  create: create,
-  dispose: dispose,
-  focus: focus,
-  menuSetEntries: menuSetEntries,
-  menuFocusIndex: menuFocusIndex,
-  menuOpen: menuOpen,
-  menuClose: menuClose,
-  menuGetEntryBounds: menuGetEntryBounds
-};
-
-const reload = () => {
-  location.reload();
-};
-
-const minimize = () => {};
-
-const maximize = () => {};
-
-const unmaximize = () => {};
-
-const close = () => {
-  // window.close()
-};
-
-const setTitle = (title) => {
-  document.title = title;
-};
-
-// cannot use visibilty change event because worker cannot process events when page closes
-// https://stackoverflow.com/questions/20084348/what-happens-to-a-web-worker-if-i-close-the-page-that-created-this-web-worker/20105455#20105455
-const onVisibilityChange = () => {
-  // document.addEventListener('visibilitychange', handleVisibilityChange)
-  const handleBeforeUnload = async () => {
-    send$1(
-      /* SaveState.handleVisibilityChange */ 'SaveState.handleVisibilityChange',
-      /* visibilityState */ 'hidden'
-    );
-    // setTimeout(() => {
-    //   console.log('in timeout 1')
-    // }, 3)
-    // await new Promise((resolve, reject) => {
-    //   setTimeout(resolve, 100)
-    // })
-    // console.log('timeout done')
-  };
-  window.addEventListener('beforeunload', handleBeforeUnload);
-  // document.addEventListener('visibilitychange', handleVisibilityChange)
-
-  // const handlePageHide = () => {
-  //   console.log('page hide')
-  //   RendererWorker.send(
-  //     /* SaveState.handleVisibilityChange */ 'SaveState.handleVisibilityChange',
-  //     /* visibilityState */ 'hidden'
-  //   )
-  // }
-  // window.addEventListener('pagehide', handlePageHide)
-};
-
-const __initialize__ = () => {
-  register$1('Window.reload', reload);
-  register$1('Window.minimize', minimize);
-  register$1('Window.maximize', maximize);
-  register$1('Window.unmaximize', unmaximize);
-  register$1('Window.close', close);
-  register$1('Window.setTitle', setTitle);
-  register$1('Window.onVisibilityChange', onVisibilityChange);
-};
-
-var M30 = {
-  __proto__: null,
-  __initialize__: __initialize__
-};
-
-// files that should be in initial chunk
-
-// hack so that rollup doesn't tree-shake out these modules
-globalThis.M = [
-  M1,
-  M2,
-  M4,
-  M5,
-  M6,
-  M7,
-  M9,
-  M13,
-  M14,
-  M15,
-  M18,
-  M22,
-  M26,
-  M27,
-  M28,
-  M29,
-  M30,
-];
-
-const handleError = (error) => {
-  console.info(`[renderer-process] Unhandled Error: ${error}`);
-  alert(error);
-};
-
-const handleUnhandledRejection = (event) => {
-  console.info(`[renderer-process] Unhandled Rejection: ${event.reason}`);
-  alert(event.reason);
-};
-
-const main = async () => {
-  onerror = handleError;
-  onunhandledrejection = handleUnhandledRejection;
-
-  if (platform === 'web') {
-    // disable prompt to download app as pwa
-    // @ts-ignore
-    window.onbeforeinstallprompt = (event) => {
-      event.preventDefault();
-    };
-  }
-  // TODO this is discovered very late
-  await hydrate$2();
-  dispatchEvent(new CustomEvent('code/ready'));
-  // TODO avoid creating global variables
-  globalThis.__codeLoaded = true;
-};
-
-main();
-
-// 1. invoke shared process to read file
-// 2. display file
-// 3. optimize
-
-// DEBUG
-
-// globalThis.Panel = Panel
-// globalThis.Context = Context
-// globalThis.StatusBar = StatusBar
-// globalThis.ViewService = ViewService
-// globalThis.SideBar = SideBar
-// globalThis.FileSystem = FileSystem
-
-const send = send$1;
-
-export { setSelections as A, setScrollBar as B, state$1 as C, focus$3 as D, state$8 as E, mount as F, setAdditionalFocus as G, removeAdditionalFocus as H, send as I, append as a, string as b, array as c, setFocus as d, showControlled as e, findIndex as f, getStateFromEvent as g, hide as h, focusIndex$1 as i, hideSubMenu as j, showMenu as k, showContextMenu as l, remove as m, number as n, object as o, focusPrevious as p, supportsHtml5Dialog as q, register$1 as r, send$1 as s, focus$4 as t, getHref as u, getBounds as v, getItem as w, lookupKeyBinding as x, create$4 as y, setText as z };
-//# sourceMappingURL=rendererProcessMain.js.map