@lvce-editor/server 0.0.24 → 0.0.27

package/static/{63e03f3 → eb65b4e}/packages/renderer-worker/dist/rendererWorkerMain.js

@@ -223,37 +223,39 @@ const getModuleId = (commandId) => {
     case 'Main.closeTabsRight':
     case 'Main.closeTabsLeft':
       return MODULE_MAIN
-    case 'ViewletExplorer.focusNext':
-    case 'ViewletExplorer.focusPrevious':
-    case 'ViewletExplorer.scrollUp':
-    case 'ViewletExplorer.scrollDown':
-    case 'ViewletExplorer.handleClickCurrent':
-    case 'ViewletExplorer.newFile':
-    case 'ViewletExplorer.openContainingFolder':
-    case 'ViewletExplorer.copyPath':
-    case 'ViewletExplorer.copyRelativePath':
-    case 'ViewletExplorer.removeDirent':
-    case 'ViewletExplorer.newFolder':
-    case 'ViewletExplorer.getFocusedDirent':
-    case 'ViewletExplorer.handleArrowRight':
-    case 'ViewletExplorer.handleArrowLeft':
-    case 'ViewletExplorer.focusFirst':
-    case 'ViewletExplorer.focusLast':
-    case 'ViewletExplorer.renameDirent':
-    case 'ViewletExplorer.handleMouseEnter':
-    case 'ViewletExplorer.handleMouseLeave':
-    case 'ViewletExplorer.handleClick':
-    case 'ViewletExplorer.handleContextMenu':
-    case 'ViewletExplorer.handleWheel':
-    case 'ViewletExplorer.setDeltaY':
-    case 'ViewletExplorer.handlePaste':
-    case 'ViewletExplorer.handleCopy':
-    case 'ViewletExplorer.cancelRename':
-    case 'ViewletExplorer.acceptRename':
-    case 'ViewletExplorer.cancelNewFile':
-    case 'ViewletExplorer.acceptNewFile':
-    case 'ViewletExplorer.expandAll':
-    case 'ViewletExplorer.collapseAll':
+    case 'Explorer.acceptNewFile':
+    case 'Explorer.acceptRename':
+    case 'Explorer.cancelNewFile':
+    case 'Explorer.cancelRename':
+    case 'Explorer.collapseAll':
+    case 'Explorer.copyPath':
+    case 'Explorer.copyRelativePath':
+    case 'Explorer.expandAll':
+    case 'Explorer.focusFirst':
+    case 'Explorer.focusIndex':
+    case 'Explorer.focusLast':
+    case 'Explorer.focusNext':
+    case 'Explorer.focusPrevious':
+    case 'Explorer.getFocusedDirent':
+    case 'Explorer.handleArrowLeft':
+    case 'Explorer.handleArrowRight':
+    case 'Explorer.handleClick':
+    case 'Explorer.handleClickCurrent':
+    case 'Explorer.handleContextMenu':
+    case 'Explorer.handleCopy':
+    case 'Explorer.handleMouseEnter':
+    case 'Explorer.handleMouseLeave':
+    case 'Explorer.handlePaste':
+    case 'Explorer.handleWheel':
+    case 'Explorer.newFile':
+    case 'Explorer.newFolder':
+    case 'Explorer.openContainingFolder':
+    case 'Explorer.removeDirent':
+    case 'Explorer.renameDirent':
+    case 'Explorer.scrollDown':
+    case 'Explorer.scrollUp':
+    case 'Explorer.setDeltaY':
+    case 'Explorer.handleBlur':
       return MODULE_VIEWLET_EXPLORER
     case 'ColorThemeFromJson.createColorThemeFromJson':
       return MODULE_COLOR_THEME_FROM_JSON
@@ -793,6 +795,120 @@ const reject = (id, error) => {
   state$B.callbacks[id].reject(error);
 };
 
+/* istanbul ignore file */
+
+const state$A = {
+  pendingMessages: [],
+  /**
+   * @type {any}
+   */
+  ipc: undefined,
+};
+
+const handleMessageFromRendererProcess = async (event) => {
+  const message = event.data;
+  if (message.id) {
+    if ('result' in message) {
+      resolve(message.id, message.result);
+    } else {
+      reject(message.id, message.error);
+    }
+  } else {
+    await execute$1(...message);
+  }
+};
+
+const listenModuleWorker = () => {
+  onmessage = handleMessageFromRendererProcess;
+  return {
+    send(message) {
+      postMessage(message);
+    },
+    sendAndTransfer(message, transferables) {
+      postMessage(message, transferables);
+    },
+  }
+};
+
+const listenMessagePort = () => {
+  const messageChannel = new MessageChannel();
+  messageChannel.port1.onmessage = handleMessageFromRendererProcess;
+  globalThis.acceptPort(messageChannel.port2);
+  return {
+    send(message) {
+      messageChannel.port1.postMessage(message);
+    },
+    sendAndTransfer(message, transferables) {
+      messageChannel.port1.postMessage(message, transferables);
+    },
+  }
+};
+
+const listenReferencePort = () => {
+  const referencePort = {
+    onmessage(message, transferables) {},
+    postMessage: state$A.handleMessage,
+  };
+  // TODO get rid of extra data wrapper
+  globalThis.acceptReferencePort(referencePort);
+  return {
+    send(message) {
+      referencePort.onmessage({ data: message });
+    },
+    sendAndTransfer({ data: message }, transferables) {
+      referencePort.onmessage(message, transferables);
+    },
+  }
+};
+
+const getIpc = () => {
+  // TODO tree-shake out if/else in prod
+  if (globalThis.acceptPort) {
+    return listenMessagePort()
+  } else if (globalThis.acceptReferencePort) {
+    return listenReferencePort()
+  } else {
+    return listenModuleWorker()
+  }
+};
+
+const listen$1 = () => {
+  console.assert(state$A.pendingMessages.length === 0);
+  const ipc = getIpc();
+  state$A.ipc = ipc;
+};
+
+const invoke$3 = async (method, ...params) => {
+  const responseMessage = await new Promise((resolve, reject) => {
+    const callbackId = register$1(resolve, reject);
+    state$A.ipc.send({
+      jsonrpc: '2.0',
+      method,
+      params,
+      id: callbackId,
+    });
+  });
+  if (responseMessage instanceof Error) {
+    throw responseMessage
+  }
+  return responseMessage
+};
+
+const setInlineStyle = async (id, css) => {
+  await invoke$3(
+    /* Css.setInlineStyle */ 'Css.setInlineStyle',
+    /* id */ id,
+    /* css */ css
+  );
+};
+
+const setThemeColor = async (themeColor) => {
+  await invoke$3(
+    /* Meta.setThemeColor */ 'Meta.setThemeColor',
+    /* color */ themeColor
+  );
+};
+
 const create$u = (url, baton) => {
   const webSocket = new WebSocket(url);
   const state = {
@@ -822,7 +938,7 @@ const create$u = (url, baton) => {
   return state
 };
 
-const send$3 = (transport, method, ...params) => {
+const send$2 = (transport, method, ...params) => {
   transport.send({
     jsonrpc: '2.0',
     method,
@@ -830,7 +946,7 @@ const send$3 = (transport, method, ...params) => {
   });
 };
 
-const invoke$3 = (transport, method, ...params) => {
+const invoke$2 = (transport, method, ...params) => {
   return new Promise((resolve, reject) => {
     // TODO use one map instead of two
     const callbackId = register$1(resolve, reject);
@@ -880,16 +996,16 @@ const preparePrettyError = (rawError) => {
 };
 
 // TODO state is actually not needed here, only for testing because jest doesn't support mocking esm
-const state$A = {
+const state$z = {
   pendingMessages: [],
   send(message) {
-    state$A.pendingMessages.push(message);
+    state$z.pendingMessages.push(message);
   },
   async receive(message) {
     if (message.method) {
       const result = await execute$1(message.method, ...message.params);
       if (message.id) {
-        state$A.send({
+        state$z.send({
           jsonrpc: '2.0',
           id: message.id,
           result,
@@ -905,22 +1021,22 @@ const state$A = {
   retryCount: 0,
 };
 
-const listen$1 = () => {
-  console.assert(state$A.pendingMessages.length === 0);
+const listen = () => {
+  console.assert(state$z.pendingMessages.length === 0);
   {
     // TODO replace this during build
     const wsProtocol = location.protocol === 'https:' ? 'wss:' : 'ws:';
     const wsUrl = `${wsProtocol}//${location.host}`;
-    create$u(wsUrl, state$A);
+    create$u(wsUrl, state$z);
   }
 };
 
-const send$2 = (method, ...params) => {
-  send$3(state$A, method, ...params);
+const send$1 = (method, ...params) => {
+  send$2(state$z, method, ...params);
 };
 
-const invoke$2 = async (method, ...params) => {
-  const responseMessage = await invoke$3(state$A, method, ...params);
+const invoke$1 = async (method, ...params) => {
+  const responseMessage = await invoke$2(state$z, method, ...params);
   if (responseMessage.error) {
     const prettyError = preparePrettyError(responseMessage.error);
     throw prettyError
@@ -936,7 +1052,7 @@ const invoke$2 = async (method, ...params) => {
 
 // TODO treeshake this function out when targeting electron
 
-const state$z = {
+const state$y = {
   cachedIsMobileOrTablet: undefined,
   getPlatform() {
     // @ts-ignore
@@ -949,7 +1065,7 @@ const state$z = {
     // @ts-ignore
     {
       // @ts-ignore
-      return '/63e03f3'
+      return '/eb65b4e'
     }
   },
   isMobileOrTablet() {
@@ -979,40 +1095,40 @@ const state$z = {
     return check
   },
   getExtensionsPath() {
-    return invoke$2(
+    return invoke$1(
       /* Platform.getExtensionsPath */ 'Platform.getExtensionsPath'
     )
   },
   getBuiltinExtensionsPath() {
-    return invoke$2(
+    return invoke$1(
       /* Platform.getBuiltinExtensionsPath */ 'Platform.getBuiltinExtensionsPath'
     )
   },
   getDisabledExtensionsPath() {
-    return invoke$2(
+    return invoke$1(
       /* Platform.getDisabledExtensionsPath */ 'Platform.getDisabledExtensionsPath'
     )
   },
   getCachedExtensionsPath() {
-    return invoke$2(
+    return invoke$1(
       /* Platform.getCachedExtensionsPath */ 'Platform.getCachedExtensionsPath'
     )
   },
   getMarketPlaceUrl() {
     // TODO this should be configurable via settings
     // TODO in web this should be static
-    return invoke$2(
+    return invoke$1(
       /* Platform.getMarketPlaceUrl */ 'Platform.getMarketplaceUrl'
     )
   },
   getLogsDir() {
-    return invoke$2(/* Platform.getLogsDir */ 'Platform.getLogsDir')
+    return invoke$1(/* Platform.getLogsDir */ 'Platform.getLogsDir')
   },
   getUserSettingsPath() {
     if (this.getPlatform() === 'web') {
       return 'settings'
     }
-    return invoke$2(
+    return invoke$1(
       /* Platform.getUserSettingsPath */ 'Platform.getUserSettingsPath'
     )
   },
@@ -1020,74 +1136,74 @@ const state$z = {
     if (this.getPlatform() === 'web') {
       return 'recently-opened'
     }
-    return invoke$2(
+    return invoke$1(
       /* Platform.getRecentlyOpenedPath */ 'Platform.getRecentlyOpenedPath'
     )
   },
   getConfigPath() {
-    return invoke$2(
+    return invoke$1(
       /* Platform.getConfigDir */ 'Platform.getConfigDir'
     )
   },
   getCachePath() {
-    return invoke$2(
+    return invoke$1(
       /* Platform.getCacheDir */ 'Platform.getCacheDir'
     )
   },
 };
 
 const isMobileOrTablet = () => {
-  if (state$z.cachedIsMobileOrTablet === undefined) {
-    state$z.cachedIsMobileOrTablet = state$z.isMobileOrTablet();
+  if (state$y.cachedIsMobileOrTablet === undefined) {
+    state$y.cachedIsMobileOrTablet = state$y.isMobileOrTablet();
   }
-  return state$z.cachedIsMobileOrTablet
+  return state$y.cachedIsMobileOrTablet
 };
 
 const getExtensionsPath = () => {
-  return state$z.getExtensionsPath()
+  return state$y.getExtensionsPath()
 };
 
 const getCachedExtensionsPath = () => {
-  return state$z.getCachedExtensionsPath()
+  return state$y.getCachedExtensionsPath()
 };
 
 const getMarketPlaceUrl = () => {
-  return state$z.getMarketPlaceUrl()
+  return state$y.getMarketPlaceUrl()
 };
 
 const getLogsDir = () => {
-  return state$z.getLogsDir()
+  return state$y.getLogsDir()
 };
 
 const getUserSettingsPath = () => {
-  return state$z.getUserSettingsPath()
+  return state$y.getUserSettingsPath()
 };
 
 /**
  * @returns {'electron'|'remote'|'web'|'test'}
  */
 const getPlatform = () => {
-  return state$z.getPlatform()
+  return state$y.getPlatform()
 };
 
 const getAssetDir = () => {
-  return state$z.getAssetDir()
+  return state$y.getAssetDir()
 };
 
 const getRecentlyOpenedPath = () => {
-  return state$z.getRecentlyOpenedPath()
+  return state$y.getRecentlyOpenedPath()
 };
 
 const getConfigPath = () => {
-  return state$z.getConfigPath()
+  return state$y.getConfigPath()
 };
 
 const getCachePath = () => {
-  return state$z.getCachePath()
+  return state$y.getCachePath()
 };
 
 const copy$2 = (protocol, source, target) => {
-  return invoke$2(
+  return invoke$1(
     /* FileSystem.copy */ 'Filesystem.copy',
     /* source */ source,
     /* target */ target
@@ -1095,21 +1211,21 @@ const copy$2 = (protocol, source, target) => {
 };
 
 const readFile$7 = (protocol, path) => {
-  return invoke$2(
+  return invoke$1(
     /* FileSystem.readFile */ 'FileSystem.readFile',
     /* path */ path
   )
 };
 
 const remove$5 = (protocol, path) => {
-  return invoke$2(
+  return invoke$1(
     /* FileSystem.remove */ 'FileSystem.remove',
     /* path */ path
   )
 };
 
 const rename$6 = (protocol, oldUri, newUri) => {
-  return invoke$2(
+  return invoke$1(
     /* FileSystem.rename */ 'FileSystem.rename',
     /* oldPath */ oldUri,
     /* newPath */ newUri
@@ -1117,14 +1233,14 @@ const rename$6 = (protocol, oldUri, newUri) => {
 };
 
 const mkdir$5 = (protocol, path) => {
-  return invoke$2(
+  return invoke$1(
     /* FileSystem.mkdir */ 'FileSystem.mkdir',
     /* path */ path
   )
 };
 
 const writeFile$5 = async (protocol, path, content) => {
-  await invoke$2(
+  await invoke$1(
     /* FileSystem.writeFile */ 'FileSystem.writeFile',
     /* path */ path,
     /* content */ content
@@ -1134,7 +1250,7 @@ const writeFile$5 = async (protocol, path, content) => {
 const ensureFile$1 = async () => {};
 
 const readDirWithFileTypes$6 = (protocol, path) => {
-  return invoke$2(
+  return invoke$1(
     /* FileSystem.readDirWithFileTypes */ 'FileSystem.readDirWithFileTypes',
     /* path */ path
   )
@@ -1148,7 +1264,7 @@ const getPathSeparator$7 = (protocol) => {
   if (getPlatform() === 'web') {
     return '/'
   }
-  return invoke$2(
+  return invoke$1(
     /* FileSystem.getPathSeparator */ 'FileSystem.getPathSeparator'
   )
 };
@@ -1175,27 +1291,27 @@ var FileSystemDisk = {
 // pros
 // 1. it decouples event emitter (e.g. Editor creation) from other module (Document syncing when editor was created)
 
-const state$y = {
+const state$x = {
   listenerMap: Object.create(null),
 };
 
 const emitEvent = async (event, ...args) => {
-  const listeners = state$y.listenerMap[event] || [];
+  const listeners = state$x.listenerMap[event] || [];
   for (const listener of listeners) {
     await listener(...args);
   }
 };
 
 const addListener = (event, fn) => {
-  state$y.listenerMap[event] ||= [];
-  if (state$y.listenerMap[event].includes(fn)) {
+  state$x.listenerMap[event] ||= [];
+  if (state$x.listenerMap[event].includes(fn)) {
     return
   }
-  state$y.listenerMap[event].push(fn);
+  state$x.listenerMap[event].push(fn);
 };
 
 const removeListener$1 = (event, fn) => {
-  const listeners = state$y.listenerMap[event];
+  const listeners = state$x.listenerMap[event];
   if (!listeners) {
     console.info(
       `[info] listener for event ${event} is not registered and cannot be unregistered`
@@ -1205,142 +1321,35 @@ const removeListener$1 = (event, fn) => {
   const index = listeners.indexOf(fn);
   listeners.splice(index, 1);
   if (listeners.length === 0) {
-    delete state$y.listenerMap[event];
-  }
-};
-
-/* istanbul ignore file */
-
-const state$x = {
-  pendingMessages: [],
-  /**
-   * @type {any}
-   */
-  ipc: undefined,
-};
-
-const handleMessageFromRendererProcess = (event) => {
-  const message = event.data;
-  switch (message[0]) {
-    case 67330:
-    case 67331:
-      resolve(message[1], message[2]);
-      break
-    default:
-      execute$1(...message);
-      break
-  }
-};
-
-const listenModuleWorker = () => {
-  onmessage = handleMessageFromRendererProcess;
-  return {
-    send(message) {
-      postMessage(message);
-    },
-    sendAndTransfer(message, transferables) {
-      postMessage(message, transferables);
-    },
-  }
-};
-
-const listenMessagePort = () => {
-  const messageChannel = new MessageChannel();
-  messageChannel.port1.onmessage = handleMessageFromRendererProcess;
-  globalThis.acceptPort(messageChannel.port2);
-  return {
-    send(message) {
-      messageChannel.port1.postMessage(message);
-    },
-    sendAndTransfer(message, transferables) {
-      messageChannel.port1.postMessage(message, transferables);
-    },
-  }
-};
-
-const listenReferencePort = () => {
-  const referencePort = {
-    onmessage(message, transferables) {},
-    postMessage: state$x.handleMessage,
-  };
-  // TODO get rid of extra data wrapper
-  globalThis.acceptReferencePort(referencePort);
-  return {
-    send(message) {
-      referencePort.onmessage({ data: message });
-    },
-    sendAndTransfer({ data: message }, transferables) {
-      referencePort.onmessage(message, transferables);
-    },
-  }
-};
-
-const getIpc = () => {
-  // TODO tree-shake out if/else in prod
-  if (globalThis.acceptPort) {
-    return listenMessagePort()
-  } else if (globalThis.acceptReferencePort) {
-    return listenReferencePort()
-  } else {
-    return listenModuleWorker()
-  }
-};
-
-const listen = () => {
-  console.assert(state$x.pendingMessages.length === 0);
-  const ipc = getIpc();
-  state$x.ipc = ipc;
-};
-
-/**
- * @deprecated use invoke instead
- * @param {*} message
- */
-const send$1 = (message) => {
-  state$x.ipc.send(message);
-};
-
-const invoke$1 = async (method, ...params) => {
-  const responseMessage = await new Promise((resolve, reject) => {
-    const callbackId = register$1(resolve, reject);
-    state$x.ipc.send([
-      /* RendererWorker.invoke */ 909090,
-      /* callbackId */ callbackId,
-      /* method */ method,
-      /* params */ ...params,
-    ]);
-  });
-  if (responseMessage instanceof Error) {
-    throw responseMessage
+    delete state$x.listenerMap[event];
   }
-  return responseMessage
 };
 
 const getPathName$1 = () => {
-  return invoke$1(
+  return invoke$3(
     /* Location.getPathName */ 'Location.getPathName'
   )
 };
 
 const setPathName = (pathName) => {
-  return invoke$1(
+  return invoke$3(
     /* Location.setPathName */ 'Location.setPathName',
     /* pathName */ pathName
   )
 };
 
 const hydrate$c = () => {
-  return invoke$1(/* Location.hydrate */ 'Location.hydrate')
+  return invoke$3(/* Location.hydrate */ 'Location.hydrate')
 };
 
 const reload = async () => {
   if (getPlatform() === 'web' || getPlatform() === 'remote') {
-    await invoke$1(/* windowReload */ 8080);
+    await invoke$3(/* windowReload */ 8080);
     return
   }
   if (getPlatform() === 'electron') {
     // TODO should use invoke here
-    await invoke$2(
+    await invoke$1(
       /* Electron.windowReload */ 'Electron.windowReload'
     );
   }
@@ -1350,7 +1359,7 @@ const minimize = async () => {
   if (getPlatform() === 'web') {
     return
   }
-  await invoke$2(
+  await invoke$1(
     /* Electron.windowMinimize */ 'Electron.windowMinimize'
   );
 };
@@ -1359,7 +1368,7 @@ const maximize = async () => {
   if (getPlatform() === 'web') {
     return
   }
-  await invoke$2(
+  await invoke$1(
     /* Electron.windowMaximize */ 'Electron.windowMaximize'
   );
 };
@@ -1368,7 +1377,7 @@ const unmaximize = async () => {
   if (getPlatform() === 'web') {
     return
   }
-  await invoke$2(
+  await invoke$1(
     /* Electron.windowUnmaximize */ 'Electron.windowUnMaximize'
   );
 };
@@ -1377,15 +1386,15 @@ const close$4 = async () => {
   if (getPlatform() === 'web') {
     return
   }
-  await invoke$2(/* Electron.windowClose */ 'Electron.windowClose');
+  await invoke$1(/* Electron.windowClose */ 'Electron.windowClose');
 };
 
 const exit = async () => {
-  await invoke$2(/* Electron.exit */ 'Electron.exit');
+  await invoke$1(/* Electron.exit */ 'Electron.exit');
 };
 
 const setTitle = async (title) => {
-  await invoke$1(
+  await invoke$3(
     /* Window.setTitle */ 'Window.setTitle',
     /* title */ title
   );
@@ -1395,7 +1404,7 @@ const openNew = async () => {
   if (getPlatform() === 'web' || getPlatform() === 'remote') {
     return
   }
-  await invoke$2(
+  await invoke$1(
     /* Electron.windowOpenNew */ 'Electron.windowOpenNew'
   );
 };
@@ -1425,7 +1434,7 @@ const setUri = async (uri) => {
 };
 
 const getResolvedRootFromSharedProcess = async () => {
-  const resolvedRoot = await invoke$2(
+  const resolvedRoot = await invoke$1(
     /* Workspace.resolveRoot */ 'Workspace.resolveRoot'
   );
   return resolvedRoot
@@ -1884,14 +1893,14 @@ const startExtensionHost = async () => {
       throw new Error('extension host is already starting')
   }
   state$u.status = STATUS_LOADING;
-  await invoke$2(/* ExtensionHost.start */ 'ExtensionHost.start');
+  await invoke$1(/* ExtensionHost.start */ 'ExtensionHost.start');
   state$u.status = STATUS_RUNNING;
   for (const readyCallback of state$u.readyCallbacks) {
     readyCallback();
   }
   state$u.readyCallbacks = [];
   // TODO handle error
-  await invoke$2(
+  await invoke$1(
     /* ExtensionHost.setWorkspaceRoot */ 'ExtensionHost.setWorkspaceRoot',
     /* root */ getWorkspacePath()
   );
@@ -1899,7 +1908,7 @@ const startExtensionHost = async () => {
 
 const invoke = (...args) => {
   // console.log({ args })
-  return invoke$2(...args)
+  return invoke$1(...args)
 };
 
 var ExtensionHostCore = {
@@ -1917,7 +1926,7 @@ const getExtensions$1 = async () => {
   if (getPlatform() === 'web') {
     return []
   }
-  const extensions = await invoke$2(
+  const extensions = await invoke$1(
     /* ExtensionManagement.getExtensions */ 'ExtensionManagement.getExtensions'
   );
   return extensions
@@ -1925,7 +1934,7 @@ const getExtensions$1 = async () => {
 
 const getLanguagesFromExtensionHost = async () => {
   // TODO handle error
-  const languages = await invoke$2(
+  const languages = await invoke$1(
     /* ExtensionHost.getLanguages */ 'ExtensionHost.getLanguages'
   );
   return languages
@@ -1950,7 +1959,7 @@ const getLanguageConfiguration$1 = async (languageId) => {
     console.warn('get language configuration not yet supported on web');
     return
   }
-  const languageConfiguration = await invoke$2(
+  const languageConfiguration = await invoke$1(
     /* ExtensionHost.getLanguageConfiguration */ 'ExtensionHost.getLanguageConfiguration',
     /* languageId */ languageId
   );
@@ -2041,7 +2050,7 @@ const activateExtension = async (extension) => {
   }
   if (!state$s.extensionPromiseCache[extension.id]) {
     const activatableExtension = toActivatableExtension(extension);
-    state$s.extensionPromiseCache[extension.id] = invoke$2(
+    state$s.extensionPromiseCache[extension.id] = invoke$1(
       /* ExtensionHost.enableExtension */ 'ExtensionHost.enableExtension',
       /* activatableExtension */ activatableExtension
     );
@@ -2077,6 +2086,7 @@ const activateByEvent = async (event) => {
   // TODO this seems too inefficient -> leave extensions in shared process and just send activation event to shared process
   // TODO should not query extensions multiple times
   const extensions = await getExtensions$1();
+
   // TODO if many (more than two?) extensions cannot be loaded,
   // it shouldn't should that many error messages
   for (const extension of extensions) {
@@ -2085,7 +2095,7 @@ const activateByEvent = async (event) => {
       const codeFrame = extension.reason.jse_cause.codeFrame;
       const stack = extension.reason.originalStack;
       await execute$1(
-        /* Dialog.showMessage */ 1494,
+        /* Dialog.showMessage */ 'Dialog.showMessage',
         /* error */ { message, codeFrame, stack }
       );
     }
@@ -2705,7 +2715,7 @@ const getPreferencesJson = async () => {
     const url = `${assetDir}/config/defaultSettings.json`;
     return execute$1(/* Ajax.getJson */ 'Ajax.getJson', /* url */ url)
   }
-  return invoke$2(/* Preferences.getAll */ 'Preferences.getAll')
+  return invoke$1(/* Preferences.getAll */ 'Preferences.getAll')
 };
 
 const getPreferences = async () => {
@@ -2741,7 +2751,7 @@ const hydrate$9 = async () => {
 ${styles.join('\n')}
 }`;
   // TODO make Css.setInlineStyle a separate module in renderer-worker
-  await invoke$1(
+  await invoke$3(
     /* Css.setInlineStyle */ 'Css.setInlineStyle',
     /* id */ 'Settings',
     /* css */ css
@@ -2788,7 +2798,7 @@ const getColorThemeJsonFromSharedProcess = async (colorThemeId) => {
   //     const absolutePath = `${extension.path}/${colorTheme.path}`
   //   }
   // }
-  return invoke$2(
+  return invoke$1(
     /* ExtensionHost.getColorThemeJson */ 'ExtensionHost.getColorThemeJson',
     /* colorThemeId */ colorThemeId
   )
@@ -2832,17 +2842,10 @@ const applyColorTheme = async (colorThemeId) => {
   try {
     const colorThemeJson = await getColorThemeJson(colorThemeId);
     const colorThemeCss = await getColorThemeCss(colorThemeId, colorThemeJson);
-    await invoke$1(
-      /* Css.setInlineStyle */ 'Css.setInlineStyle',
-      /* id */ 'ContributedColorTheme',
-      /* css */ colorThemeCss
-    );
+    await setInlineStyle('ContributedColorTheme', colorThemeCss);
     if (getPlatform() === 'web') {
       const themeColor = getMetaThemeColor(colorThemeJson) || '';
-      await invoke$1(
-        /* Meta.setThemeColor */ 11122,
-        /* color */ themeColor
-      );
+      await setThemeColor(themeColor);
     }
   } catch (error) {
     throw new Error(`Failed to apply color theme "${colorThemeId}": ${error}`)
@@ -2889,7 +2892,7 @@ const getIconThemeJson = async (iconThemeId) => {
       json,
     }
   }
-  return invoke$2(
+  return invoke$1(
     /* ExtensionHost.getIconThemeJson */ 'ExtensionHost.getIconThemeJson',
     /* iconThemeId */ iconThemeId
   )
@@ -3010,7 +3013,7 @@ const hydrate$7 = async () => {
     state$o.extensionPath = iconTheme.extensionPath;
 
     const iconThemeCss = getIconThemeCss2(iconTheme);
-    await invoke$1(
+    await invoke$3(
       /* Css.setInlineStyle */ 'Css.setInlineStyle',
       /* id */ 'ContributedIconTheme',
       /* css */ iconThemeCss
@@ -3086,20 +3089,20 @@ const state$n = {
     await execute$1(
       /* Notification.create */ 'Notification.create',
       /* type */ 'error',
-      /* text */ enhancedErrorMessage
+      /* text */ enhancedErrorMessage.message
     );
   },
   async showErrorDialog(error) {
     const enhancedErrorMessage = enhanceErrorMessage(error);
     await execute$1(
-      /* Dialog.showErrorMessage */ 1494,
+      /* Dialog.showMessage */ 'Dialog.showMessage',
       /* message */ enhancedErrorMessage
     );
   },
   seenWarnings: [],
 };
 
-const handleError$1 = async (error) => {
+const handleError$2 = async (error) => {
   await state$n.handleError(error);
 };
 
@@ -3125,12 +3128,12 @@ const getKeyBindings$1 = async () => {
 const hydrate$6 = async () => {
   try {
     const keyBindings = await getKeyBindings$1();
-    await invoke$1(
+    await invoke$3(
       /* KeyBindings.hydrate */ 'KeyBindings.hydrate',
       /* keyBindings */ keyBindings
     );
   } catch (error) {
-    handleError$1(
+    handleError$2(
       // @ts-ignore
       new Error('Failed to load KeyBindings', {
         cause: error,
@@ -3196,7 +3199,7 @@ const dispose$p = async (id) => {
       throw new Error(`${id} is missing a factory function`)
     }
     instance.factory.dispose(instance.state);
-    await invoke$1(
+    await invoke$3(
       /* Viewlet.dispose */ 'Viewlet.dispose',
       /* id */ id
     );
@@ -3239,10 +3242,10 @@ const wrapViewletCommand = (id, fn) => {
         return
       }
       const commands = activeInstance.factory.render(oldState, newState);
-      send$1([
+      invoke$3(
         /* Viewlet.sendMultiple */ 'Viewlet.sendMultiple',
-        /* commands */ commands,
-      ]);
+        /* commands */ commands
+      );
       state$m.instances[id].state = newState;
     } else {
       return fn(activeInstance.state, ...args)
@@ -3273,16 +3276,16 @@ const getState = (id) => {
   return instance.state
 };
 
-const setState = (id, newState) => {
+const setState = async (id, newState) => {
   const instance = state$m.instances[id];
   if (instance && instance.factory && instance.factory.hasFunctionalRender) {
     const oldState = instance.state;
     const commands = instance.factory.render(oldState, newState);
-    send$1([
-      /* Viewlet.sendMultiple */ 'Viewlet.sendMultiple',
-      /* commands */ commands,
-    ]);
     instance.state = newState;
+    await invoke$3(
+      /* Viewlet.sendMultiple */ 'Viewlet.sendMultiple',
+      /* commands */ commands
+    );
   }
 };
 
@@ -3434,7 +3437,7 @@ const load = async (viewlet, focus = false) => {
 
     state$m.instances[viewlet.id] = { state: newState, factory: module };
 
-    await invoke$1(
+    await invoke$3(
       /* Viewlet.load */ 'Viewlet.load',
       /* id */ viewlet.id
     );
@@ -3450,9 +3453,10 @@ const load = async (viewlet, focus = false) => {
 
     if (module.hasFunctionalRender) {
       const commands = module.render(viewletState, newState);
-      for (const command of commands) {
-        send$1(command);
-      }
+      invoke$3(
+        /* Viewlet.sendMultiple */ 'Viewlet.sendMultiple',
+        /* commands */ commands
+      );
     }
 
     if (module.contentLoadedEffects) {
@@ -3464,7 +3468,7 @@ const load = async (viewlet, focus = false) => {
     }
     state = VIEWLET_STATE_CONTENT_RENDERED;
     if (viewlet.parentId) {
-      await invoke$1(
+      await invoke$3(
         /* Viewlet.append */ 'Viewlet.appendViewlet',
         /* parentId */ viewlet.parentId,
         /* id */ viewlet.id,
@@ -3482,20 +3486,20 @@ const load = async (viewlet, focus = false) => {
     console.error(error);
     try {
       if (state < VIEWLET_STATE_RENDERER_PROCESS_VIEWLET_LOADED) {
-        await invoke$1(
+        await invoke$3(
           /* Viewlet.load */ 'Viewlet.load',
           /* id */ viewlet.id
         );
       }
       if (state < VIEWLET_STATE_APPENDED && viewlet.parentId) {
-        await invoke$1(
+        await invoke$3(
           /* Viewlet.append */ 'Viewlet.appendViewlet',
           /* parentId */ viewlet.parentId,
           /* id */ viewlet.id
         );
       }
-      await invoke$1(
-        /* viewlet.handleError */ 3031,
+      await invoke$3(
+        /* viewlet.handleError */ 'Viewlet.handleError',
         /* id */ viewlet.id,
         /* parentId */ viewlet.parentId,
         /* message */ error.message
@@ -3647,7 +3651,7 @@ const getPoints = (layout, bounds) => {
 const updateLayout = async (layout) => {
   const points = getPoints(layout, state$l);
   Object.assign(state$l, points);
-  invoke$1(
+  invoke$3(
     /* Layout.update */ 'Layout.update',
     /* points */ points
   );
@@ -3800,7 +3804,7 @@ const showTitleBar = async () => {
 };
 
 const getBounds = async () => {
-  return invoke$1(/* Layout.getBounds */ 'Layout.getBounds')
+  return invoke$3(/* Layout.getBounds */ 'Layout.getBounds')
 };
 
 const getInitialLayout = async () => {
@@ -3820,7 +3824,7 @@ const hydrate$5 = async () => {
   const initialLayout = await getInitialLayout();
   const points = getPoints(initialLayout, windowBounds);
   Object.assign(state$l, points);
-  await invoke$1(
+  await invoke$3(
     /* Layout.show */ 'Layout.show',
     /* points */ points
   );
@@ -3877,7 +3881,7 @@ const handleSashPointerMove = async (x, y) => {
 const handleResize = async (bounds) => {
   const points = getPoints(state$l, bounds);
   Object.assign(state$l, points);
-  await invoke$1(
+  await invoke$3(
     /* Layout.update */ 'Layout.update',
     /* points */ points
   );
@@ -3892,7 +3896,7 @@ const handleResize = async (bounds) => {
   }
   // TODO send the whole batch at once
   for (const command of commands) {
-    invoke$1(...command);
+    invoke$3(...command);
   }
 };
 
@@ -3991,7 +3995,7 @@ const hydrate$3 = async () => {
     return
   }
   try {
-    await invoke$1(
+    await invoke$3(
       /* ServiceWorker.register */ 43725,
       /* url */ SERVICE_WORKER_URL
     );
@@ -4007,7 +4011,7 @@ const uninstall$1 = async () => {
     return
   }
   try {
-    await invoke$1(/* ServiceWorker.uninstall */ 42726);
+    await invoke$3(/* ServiceWorker.uninstall */ 42726);
   } catch (error) {
     console.info(`service worker could not be unregistered: ${error}`);
   }
@@ -4087,13 +4091,29 @@ const hydrate$2 = async () => {
   );
 };
 
+const handleUnhandledRejection = async (event) => {
+  console.info(`[renderer-process] Unhandled Rejection: ${event.reason}`);
+  try {
+    await handleError$2(event.reason);
+  } catch {}
+};
+
+const handleError$1 = async (event) => {
+  console.info(`[renderer-process] Unhandled Error: ${event}`);
+  try {
+    await handleError$2(event.reason);
+  } catch {}
+};
+
 // TODO lazyload parts one by one (Main, SideBar, ActivityBar, TitleBar, StatusBar)
 const startup = async (config) => {
+  onunhandledrejection = handleUnhandledRejection;
+  onerror = handleError$1;
   mark$1(PHASE_ZERO);
 
   mark('willStartupWorkbench');
-  listen();
   listen$1();
+  listen();
 
   mark$1(PHASE_ONE);
 
@@ -4269,7 +4289,7 @@ const state$j = {
 
 const create$s = async (type, text) => {
   state$j.notifications.push({ type, text });
-  await invoke$1(
+  await invoke$3(
     /* Notification.create */ 'Notification.create',
     /* type */ type,
     /* text */ text
@@ -4279,7 +4299,7 @@ const create$s = async (type, text) => {
 const showWithOptions = async (type, text, options) => {
   state$j.notifications.push({ type, text, options });
   console.log({ type, text, options });
-  await invoke$1(
+  await invoke$3(
     /* Notification.createWithOptions */ 993,
     /* type */ type,
     /* text */ text,
@@ -4298,7 +4318,7 @@ const handleClick$7 = (index) => {
 };
 
 const dispose$o = async (id) => {
-  await invoke$1(
+  await invoke$3(
     /* Notification.dispose */ 'Notification.dispose',
     /* id */ id
   );
@@ -4506,7 +4526,7 @@ const handleClick$6 = async (state, index, x, y) => {
     default:
       if (isSideBarVisible()) {
         await execute$1(
-          /* SideBar.showOrHideViewlet */ 'ViewletSideBar.showOrHideViewlet',
+          /* SideBar.showOrHideViewlet */ 'SideBar.showOrHideViewlet',
           /* id */ viewletId
         );
       } else {
@@ -4522,7 +4542,7 @@ const handleSideBarViewletChange = async (state, id, ...args) => {
   const index = findIndex(state.activityBarItems, id);
   const oldIndex = state.selectedIndex;
   state.selectedIndex = index;
-  await invoke$1(
+  await invoke$3(
     /* Viewlet.invoke */ 'Viewlet.send',
     /* id */ 'ActivityBar',
     /* method */ 'selectIndex',
@@ -4534,7 +4554,7 @@ const handleSideBarViewletChange = async (state, id, ...args) => {
 const handleSideBarHidden = async (state) => {
   const oldIndex = state.focusedIndex;
   state.focusedIndex = -1;
-  await invoke$1(
+  await invoke$3(
     /* Viewlet.invoke */ 'Viewlet.send',
     /* id */ 'ActivityBar',
     /* method */ 'selectIndex',
@@ -4553,7 +4573,7 @@ const updateSourceControlCount = async (state, count) => {
   if (index === -1) {
     return
   }
-  await invoke$1(
+  await invoke$3(
     /* Viewlet.invoke */ 'Viewlet.send',
     /* id */ 'ActivityBar',
     /* method */ 'setBadgeCount',
@@ -4577,7 +4597,7 @@ const toggleActivityBarItem = async (state, item) => {
     (activityBarItem) => activityBarItem.id === item.label
   );
   activityBarItem.enabled = !activityBarItem.enabled;
-  await invoke$1(
+  await invoke$3(
     /* Viewlet.invoke */ 'Viewlet.send',
     /* id */ 'ActivityBar',
     /* method */ 'setItems',
@@ -4679,7 +4699,7 @@ const resize$b = (state, dimensions) => {
   }
 };
 
-const render$d = (oldState, newState) => {
+const render$e = (oldState, newState) => {
   const changes = [];
   if (oldState === newState) {
     return changes
@@ -4708,7 +4728,7 @@ const render$d = (oldState, newState) => {
   return changes
 };
 
-const hasFunctionalRender$c = true;
+const hasFunctionalRender$d = true;
 
 var ViewletActivityBar = {
   __proto__: null,
@@ -4734,8 +4754,8 @@ var ViewletActivityBar = {
   focusLast: focusLast$8,
   selectCurrent: selectCurrent$2,
   resize: resize$b,
-  render: render$d,
-  hasFunctionalRender: hasFunctionalRender$c
+  render: render$e,
+  hasFunctionalRender: hasFunctionalRender$d
 };
 
 // prettier-ignore
@@ -4925,14 +4945,14 @@ const contentLoaded$m = async (state) => {
   );
   const tabLabel = pathBaseName(editor.uri);
   const tabTitle = getTabTitle(editor.uri);
-  send$1([
+  invoke$3(
     /* Viewlet.send */ 'Viewlet.send',
     /* id */ 'Main',
     /* method */ 'openViewlet',
     /* id */ id,
     /* tabLabel */ tabLabel,
-    /* tabTitle */ tabTitle,
-  ]);
+    /* tabTitle */ tabTitle
+  );
   // TODO race condition: Viewlet may have been resized before it has loaded
   await load(instance);
 };
@@ -4976,7 +4996,7 @@ const openUri$1 = async (state, uri) => {
   state.activeIndex = state.editors.length - 1;
   const tabLabel = pathBaseName(uri);
   const tabTitle = getTabTitle(uri);
-  await invoke$1(
+  await invoke$3(
     /* Viewlet.send */ 'Viewlet.send',
     /* id */ 'Main',
     /* method */ 'openViewlet',
@@ -5020,7 +5040,7 @@ const saveWithoutFormatting = async () => {
 
 const handleDrop = async () => {
   console.log(['main drop']);
-  const clipBoardText = await invoke$2(
+  const clipBoardText = await invoke$1(
     /* ClipBoard.read */ 'ClipBoard.read'
   );
   console.log({ clipBoardText });
@@ -5030,11 +5050,11 @@ const closeActiveEditor = (state) => {
 };
 
 const closeAllEditors = (state) => {
-  send$1([
+  invoke$3(
     /* Viewlet.send */ 'Viewlet.send',
     /* id */ 'Main',
-    /* method */ 'dispose',
-  ]);
+    /* method */ 'dispose'
+  );
   state.editors = [];
   state.focusedIndex = -1;
   state.selectedIndex = -1;
@@ -5068,14 +5088,14 @@ const closeEditor = async (state, index) => {
     //   height: instance.state.height,
     //   columnWidth: COLUMN_WIDTH,
     // })
-    await invoke$1(
+    await invoke$3(
       /* Main.closeOneTab */ 2164,
       /* closeIndex */ oldActiveIndex,
       /* focusIndex */ newActiveIndex
     );
     return
   }
-  await invoke$1(
+  await invoke$3(
     /* Viewlet.send */ 'Viewlet.send',
     /* id */ 'Main',
     /* method */ 'closeOneTabOnly',
@@ -5130,13 +5150,13 @@ const focusIndex$8 = (state, index) => {
   );
 
   // TODO race condition
-  send$1([
+  invoke$3(
     /* Viewlet.send */ 'Viewlet.send',
     /* id */ 'Main',
     /* method */ 'focusAnotherTab',
     /* unFocusIndex */ oldActiveIndex,
-    /* focusIndex */ state.activeIndex,
-  ]);
+    /* focusIndex */ state.activeIndex
+  );
   return load(viewlet)
 };
 
@@ -5168,7 +5188,7 @@ const handleTabClick = (state, index) => {
 const closeOthers = async (state) => {
   if (state.focusedIndex === state.activeIndex) {
     // view is kept the same, only tabs are closed
-    await invoke$1(
+    await invoke$3(
       /* Viewlet.send */ 'Viewlet.send',
       /* id */ 'Main',
       /* method */ 'closeOthers',
@@ -5177,7 +5197,7 @@ const closeOthers = async (state) => {
     );
   } else {
     // view needs to be switched to focused index
-    await invoke$1(
+    await invoke$3(
       /* Viewlet.send */ 'Viewlet.send',
       /* id */ 'Main',
       /* method */ 'closeOthers',
@@ -5193,7 +5213,7 @@ const closeOthers = async (state) => {
 const closeTabsRight = async (state) => {
   if (state.focusedIndex >= state.activeIndex) {
     // view is kept the same, only tabs are closed
-    await invoke$1(
+    await invoke$3(
       /* Viewlet.send */ 'Viewlet.send',
       /* id */ 'Main',
       /* method */ 'closeTabsRight',
@@ -5201,7 +5221,7 @@ const closeTabsRight = async (state) => {
     );
   } else {
     // view needs to be switched to focused index
-    await invoke$1(
+    await invoke$3(
       /* Viewlet.send */ 'Viewlet.send',
       /* id */ 'Main',
       /* method */ 'closeTabsRight',
@@ -5215,7 +5235,7 @@ const closeTabsRight = async (state) => {
 const closeTabsLeft = async (state) => {
   if (state.focusedIndex <= state.activeIndex) {
     // view is kept the same, only tabs are closed
-    await invoke$1(
+    await invoke$3(
       /* Viewlet.send */ 'Viewlet.send',
       /* id */ 'Main',
       /* method */ 'closeTabsLeft',
@@ -5223,7 +5243,7 @@ const closeTabsLeft = async (state) => {
     );
   } else {
     // view needs to be switched to focused index
-    await invoke$1(
+    await invoke$3(
       /* Viewlet.send */ 'Viewlet.send',
       /* id */ 'Main',
       /* method */ 'closeTabsLeft',
@@ -5441,7 +5461,7 @@ const show$4 = async (x, y, id, mouseBlocking = false) => {
     x: bounds.x,
     y: bounds.y,
   });
-  await invoke$1(
+  await invoke$3(
     /* Menu.show */ 'Menu.showMenu',
     /* x */ bounds.x,
     /* y */ bounds.y,
@@ -5472,7 +5492,7 @@ const showSubMenuAtEnter = async (level, index, enterX, enterY) => {
   });
   const width = getMenuWidth();
   const height = getMenuHeight(subMenuItems);
-  send$1([
+  invoke$3(
     /* Menu.showMenu */ 'Menu.showMenu',
     /* x */ subMenu.x,
     /* y */ subMenu.y,
@@ -5480,8 +5500,8 @@ const showSubMenuAtEnter = async (level, index, enterX, enterY) => {
     /* height */ height,
     /* items */ subMenu.items,
     /* level */ subMenu.level,
-    /* parentIndex */ index,
-  ]);
+    /* parentIndex */ index
+  );
 };
 
 const showSubMenu = async (level, index) => {
@@ -5520,7 +5540,7 @@ const hide$1 = async () => {
     return
   }
   state$i.menus = [];
-  await invoke$1(/* Menu.hide */ 'Menu.hide');
+  await invoke$3(/* Menu.hide */ 'Menu.hide');
 };
 
 // TODO difference between focusing with mouse or keyboard
@@ -5530,7 +5550,7 @@ const hide$1 = async () => {
 const hideSubMenus = async (level) => {
   if (level < state$i.menus.length) {
     state$i.menus = state$i.menus.slice(0, level + 1);
-    await invoke$1(
+    await invoke$3(
       /* Menu.hideSubMenu */ 'Menu.hideSubMenu',
       /* level */ level + 1
     );
@@ -5587,7 +5607,7 @@ const focusIndex$7 = async (menu, index) => {
   }
   const oldFocusedIndex = menu.focusedIndex;
   menu.focusedIndex = index;
-  await invoke$1(
+  await invoke$3(
     /* Menu.focusIndex */ 'Menu.focusIndex',
     /* level */ menu.level,
     /* oldFocusedIndex */ oldFocusedIndex,
@@ -5909,7 +5929,7 @@ const show$2 = async (value, provider) => {
     const visiblePicks = getVisiblePicks(newPicks, filterValue);
     const placeholder = provider.getPlaceholder();
     const label = provider.getLabel();
-    invoke$1(
+    invoke$3(
       /* Viewlet.send */ 'Viewlet.send',
       /* id */ 'QuickPick',
       /* method */ 'updateValueAndPicksAndPlaceholder',
@@ -5934,7 +5954,7 @@ const show$2 = async (value, provider) => {
   state$h.state = STATE_CREATING;
   const version = ++state$h.versionId;
   // TODO also pass initial value here
-  await invoke$1(
+  await invoke$3(
     /* Viewlet.load */ 'Viewlet.load',
     /* id */ 'QuickPick'
   );
@@ -5945,7 +5965,7 @@ const show$2 = async (value, provider) => {
   }
   if (newPicks.length === 0) {
     const noResults = await provider.getNoResults();
-    invoke$1(
+    invoke$3(
       /* Viewlet.send */ 'Viewlet.send',
       /* id */ 'QuickPick',
       /* method */ 'showNoResults',
@@ -5958,7 +5978,7 @@ const show$2 = async (value, provider) => {
   const visiblePicks = getVisiblePicks(newPicks, filterValue);
   const placeholder = provider.getPlaceholder();
   const label = provider.getLabel();
-  invoke$1(
+  invoke$3(
     /* Viewlet.send */ 'Viewlet.send',
     /* id */ 'QuickPick',
     /* method */ 'updateValueAndPicksAndPlaceholder',
@@ -5987,7 +6007,7 @@ const dispose$l = () => {
       break
     case STATE_FINISHED:
       state$h.state = STATE_DEFAULT;
-      invoke$1(
+      invoke$3(
         /* Viewlet.dispose */ 'Viewlet.dispose',
         /* id */ 'QuickPick'
       );
@@ -5995,7 +6015,7 @@ const dispose$l = () => {
   }
 };
 
-const handleBlur$1 = async () => {
+const handleBlur$2 = async () => {
   switch (state$h.state) {
     case STATE_DEFAULT:
     case STATE_CREATING:
@@ -6066,13 +6086,13 @@ const handleInput$2 = async (value) => {
   const filterValue = state$h.provider.getFilterValue(value);
   const visiblePicks = getVisiblePicks(newPicks, filterValue);
 
-  send$1([
+  invoke$3(
     /* Viewlet.send */ 'Viewlet.send',
     /* id */ 'QuickPick',
     /* method */ 'updatePicks',
     /* picks */ visiblePicks,
-    /* unFocusIndex */ state$h.focusedIndex,
-  ]);
+    /* unFocusIndex */ state$h.focusedIndex
+  );
   state$h.picks = newPicks;
   state$h.visiblePicks = visiblePicks;
   state$h.focusedIndex = 0;
@@ -6108,7 +6128,7 @@ const focusIndex$6 = async (index) => {
     const displayPicks = toDisplayPicks(slicedPicks);
     const relativeFocusIndex = index - state$h.minLineY;
     const relativeUnFocusIndex = state$h.focusedIndex - state$h.minLineY;
-    invoke$1(
+    invoke$3(
       /* Viewlet.send */ 'Viewlet.send',
       /* id */ 'QuickPick',
       /* method */ 'updateValueAndPicks', // TODO don't need to update value, just picks and focus
@@ -6143,7 +6163,7 @@ const focusIndex$6 = async (index) => {
       relativeFocusIndex,
       relativeUnFocusIndex,
     });
-    invoke$1(
+    invoke$3(
       /* Viewlet.send */ 'Viewlet.send',
       /* id */ 'QuickPick',
       /* method */ 'updateValueAndPicks', // TODO don't need to update value, just picks and focus
@@ -6153,7 +6173,7 @@ const focusIndex$6 = async (index) => {
       /* unFocusIndex */ relativeUnFocusIndex
     );
   } else {
-    invoke$1(
+    invoke$3(
       /* Viewlet.send */ 'Viewlet.send',
       /* id */ 'QuickPick',
       /* method */ 'focusIndex',
@@ -6268,7 +6288,7 @@ const __initialize__$O = () => {
   register$2('QuickPick.openGoToLine', openGoToLine);
   register$2('QuickPick.openColorTheme', openColorTheme);
   register$2('QuickPick.fileOpenRecent', fileOpenRecent);
-  register$2('QuickPick.handleBlur', handleBlur$1);
+  register$2('QuickPick.handleBlur', handleBlur$2);
   register$2('QuickPick.showExtensionsQuickPick', showExtensionsQuickPick);
 };
 
@@ -6300,7 +6320,7 @@ const loadContent$l = async (state) => {
 };
 
 const contentLoaded$l = async (state) => {
-  await invoke$1(
+  await invoke$3(
     /* Viewlet.send */ 'Viewlet.send',
     /* id */ 'Panel',
     /* method */ 'setTabs',
@@ -6354,13 +6374,13 @@ const tabsHandleClick = async (state, index) => {
   const oldSelectedIndex = state.selectedIndex;
 
   state.selectedIndex = index;
-  send$1([
+  invoke$3(
     /* Viewlet.send */ 'Viewlet.send',
     /* id */ 'Panel',
     /* method */ 'selectTab',
     /* oldSelectedIndex */ oldSelectedIndex,
-    /* newSelectedIndex */ index,
-  ]);
+    /* newSelectedIndex */ index
+  );
 };
 
 var ViewletPanel = {
@@ -6406,10 +6426,10 @@ const create$n = ({ getText }) => {
     // textContent: '',
     getText,
   };
-  send$1([
+  invoke$3(
     /* FindWidget.create */ 4100,
-    /* id */ state$f.activeWidget.id,
-  ]);
+    /* id */ state$f.activeWidget.id
+  );
 };
 
 const update = async (widget) => {
@@ -6420,11 +6440,11 @@ const update = async (widget) => {
       results.push(i);
     }
   }
-  send$1([
+  invoke$3(
     /* findWidgetSetResults */ 4103,
     /* id */ widget.id,
-    /* results */ results,
-  ]);
+    /* results */ results
+  );
 };
 
 const setValue$1 = async (value) => {
@@ -6440,10 +6460,10 @@ const dispose$j = () => {
   if (!state$f.activeWidget) {
     return
   }
-  send$1([
+  invoke$3(
     /* FindWidget.dispose */ 4102,
-    /* id */ state$f.activeWidget.id,
-  ]);
+    /* id */ state$f.activeWidget.id
+  );
   state$f.activeWidget = undefined;
 };
 
@@ -6700,7 +6720,7 @@ const getNodeTiming = () => {
   if (getPlatform() === 'web') {
     return undefined
   }
-  return invoke$2(/* command */ 'Developer.getNodeStartupTime')
+  return invoke$1(/* command */ 'Developer.getNodeStartupTime')
 };
 
 const getFirstTimeOrigin = ({ measureEntries, electronEntries }) => {
@@ -6786,7 +6806,7 @@ const getElectronEntries = async () => {
   if (getPlatform() === 'web' || getPlatform() === 'remote') {
     return undefined
   }
-  const result = await invoke$2(
+  const result = await invoke$1(
     /* Electron.getPerformanceEntries */ 'Electron.getPerformanceEntries'
   );
   return result
@@ -6905,20 +6925,20 @@ const getRendererWorkerMemoryUsage = async () => {
 };
 
 const getSharedProcessMemoryUsage = () => {
-  return invoke$2(
+  return invoke$1(
     /* Developer.sharedProcessMemoryUsage */ 'Developer.sharedProcessMemoryUsage'
   )
 };
 
 const getRendererProcessMemoryUsage = async () => {
-  const memoryUsage = await invoke$1(
+  const memoryUsage = await invoke$3(
     /* Developer.getMemoryUsage */ 284
   );
   return memoryUsage
 };
 
 const getExtensionHostMemoryUsage = async () => {
-  return invoke$2(
+  return invoke$1(
     /* ExtensionHost.getMemoryUsage */ 'ExtensionHost.getMemoryUsage'
   )
 };
@@ -6934,8 +6954,8 @@ const getMemoryUsageContent = async () => {
     extensionHostMemoryUsage
   );
   const rendererWorkerMemoryUsage = await getRendererWorkerMemoryUsage();
-  const totalSent = state$A.totalSent;
-  const totalReceived = state$A.totalReceived;
+  const totalSent = state$z.totalSent;
+  const totalReceived = state$z.totalReceived;
   const formattedRendererWorkerMemoryUsage = formatRendererWorkerData({
     memory: rendererWorkerMemoryUsage.memory,
     userAgentSpecificMemory: rendererWorkerMemoryUsage.userAgentSpecificMemory,
@@ -6991,19 +7011,19 @@ const showMemoryUsage = async () => {
 
 // TODO not sure if this function is useful
 const allocateMemoryInSharedProcess = async () => {
-  await invoke$2(
+  await invoke$1(
     /* Developer.allocateMemoryInSharedProcess */ 'Developer.allocateMemoryInSharedProcess'
   );
 };
 
 const crashSharedProcess = async () => {
-  await invoke$2(
+  await invoke$1(
     /* Developer.crashSharedProcess */ 'Developer.crashSharedProcess'
   );
 };
 
 const crashMainProcess = async () => {
-  await invoke$2(
+  await invoke$1(
     /* Electron.crashMainProcess */ 'Electron.crashMainProcess'
   );
 };
@@ -7021,7 +7041,7 @@ const openLogsFolder = async () => {
 };
 
 const toggleDeveloperTools = async () => {
-  await invoke$2(
+  await invoke$1(
     /* Electron.toggleDevtools */ 'Electron.toggleDevtools'
   );
 };
@@ -7032,13 +7052,13 @@ const showIconThemeCss = async () => {
 };
 
 const createSharedProcessHeapSnapshot = async () => {
-  await invoke$2(
+  await invoke$1(
     /* Developer.createSharedProcessHeapSnapshot */ 'Developer.createSharedProcessHeapSnapshot'
   );
 };
 
 const createSharedProcessProfile = async () => {
-  await invoke$2(
+  await invoke$1(
     /* Developer.createProfile */ 'Developer.createProfile'
   );
 };
@@ -7079,7 +7099,7 @@ const openCacheFolder = async () => {
 };
 
 const openDataFolder = async () => {
-  const dataFolder = await invoke$2(
+  const dataFolder = await invoke$1(
     /* Platform.getDataDir */ 'Platform.getDataDir'
   );
   await execute$1(
@@ -7089,7 +7109,7 @@ const openDataFolder = async () => {
 };
 
 const openProcessExplorer = async () => {
-  await invoke$2(
+  await invoke$1(
     /* Electron.openProcessExplorer */ 'Electron.openProcessExplorer'
   );
 };
@@ -7845,7 +7865,6 @@ const getDecorationClassName = (type) => {
 };
 
 const getLineInfo = (line, tokens, decorations, TokenMap, lineOffset) => {
-  console.log({ decorations });
   let start = 0;
   let end = 0;
   const lineInfo = [];
@@ -8201,7 +8220,7 @@ const setText$1 = (editor, text) => {
   }
 };
 
-const render$c = (oldState, newState) => {
+const render$d = (oldState, newState) => {
   const changes = [];
   if (
     oldState.lines !== newState.lines ||
@@ -8318,7 +8337,7 @@ const y = (editor, position) => {
   return y
 };
 
-const handleBlur = () => {
+const handleBlur$1 = () => {
   close$3();
 };
 
@@ -8382,15 +8401,15 @@ const handleSelectionChange$1 = (editor, selectionChanges) => {
   console.log({ leadingWord });
   const x$1 = x(editor, editor.cursor);
   const y$1 = y(editor, editor.cursor);
-  send$1([
+  invoke$3(
     /* Viewlet.send */ 'Viewlet.send',
     /* id */ 'EditorCompletion',
     /* method */ 'show',
     /* x */ x$1,
     /* y */ y$1,
     /* completionItems */ filteredCompletionItems,
-    /* reason */ 1,
-  ]);
+    /* reason */ 1
+  );
 };
 
 const handleCursorChange = (anyEditor, cursorChange) => {
@@ -8510,7 +8529,7 @@ const openFromType = async (editor, text) => {
 };
 
 const close$3 = async (editor) => {
-  removeListener(handleBlur);
+  removeListener(handleBlur$1);
   removeListener$1('editor.selectionChange', handleSelectionChange$1);
   removeListener$1('editor.cursorChange', handleCursorChange);
   await dispose$p('EditorCompletion');
@@ -9239,7 +9258,7 @@ const editorFormat = async (editor) => {
   // console.log(textDocument)
   // TODO only transfer incremental edits from shared process
   // TODO also format with cursor
-  const newContent = await invoke$2(
+  const newContent = await invoke$1(
     /* ExtensionHost.format */ 'ExtensionHost.format',
     /* textDocumentId */ editor.textDocument.id
   );
@@ -9280,7 +9299,7 @@ const editorShowMessage = async (editor, position, message) => {
   const x$1 = x(editor, position);
   const y$1 = y(editor, position);
   const displayErrorMessage = message;
-  await invoke$1(
+  await invoke$3(
     /* Viewlet.send */ 'Viewlet.send',
     /* id */ 'EditorText',
     /* method */ 'showOverlayMessage',
@@ -9302,7 +9321,7 @@ const editorShowMessage = async (editor, position, message) => {
 const editorHideMessage = async (editor) => {
   clearTimeout(state$b.timeout);
   state$b.timeout = -1;
-  await invoke$1(
+  await invoke$3(
     /* Viewlet.send */ 'Viewlet.send',
     /* id */ 'EditorText',
     /* method */ 'hideOverlayMessage'
@@ -9658,7 +9677,7 @@ const editorHandleMouseMoveWithAltKey = async (editor, x, y, offset) => {
     console.log({ token: tokenIndex });
     // .tokens
     // console.log({ editor })
-    await invoke$1(
+    await invoke$3(
       /* Viewlet.invoke */ 'Viewlet.send',
       /* id */ 'EditorText',
       /* method */ 'highlightAsLink',
@@ -10437,7 +10456,7 @@ const editorSave = async (editor) => {
     const betterError = new Error(`Failed to save file "${uri}"`, {
       cause: error,
     });
-    await handleError$1(betterError);
+    await handleError$2(betterError);
     return
   }
   await emitEvent('editor.save', editor);
@@ -11509,7 +11528,7 @@ var KeyBindings_ipc = {
 };
 
 const openNativeFolder = async (absolutePath) => {
-  await invoke$2(
+  await invoke$1(
     /* Native.openFolder */ 'Native.openFolder',
     /* path */ absolutePath
   );
@@ -11661,16 +11680,18 @@ const loadContent$k = async (state) => {
 };
 
 const updateIcons = (state) => {
+  // TODO avoid mutating state
   for (const dirent of state.dirents) {
     dirent.icon = getIcon$1(dirent);
   }
+  const newDirents = [...state.dirents];
+  return { ...state, dirents: newDirents }
 };
 
 const contentLoaded$k = async (state) => {
   // console.trace({ state })
   // TODO execute command directly
   // TODO this should a promise and be awaited
-  await scheduleDirents(state);
 };
 
 const getTopLevelDirents = ({ root, pathSeparator }) => {
@@ -11694,22 +11715,25 @@ const contentLoadedEffects$3 = (state) => {
   // TODO create should not have side effects
   // TODO dispose listener when explorer is disposed
   // TODO hoist function
-  addListener('languages.changed', async () => {
-    updateIcons(state);
-    await scheduleDirents(state);
-  });
+  const handleLanguagesChanged = () => {
+    const state = getState('Explorer');
+    console.log({ state });
+    const newState = updateIcons(state);
+    setState('Explorer', newState);
+  };
+  addListener('languages.changed', handleLanguagesChanged);
 
   // TODO hoist function
   addListener('workspace.change', async () => {
     state.root = state$w.workspacePath;
     const newState = await loadContent$k(state);
     state$m.instances['Explorer'].state = newState;
-    await contentLoaded$k(newState);
+    await contentLoaded$k();
     // TODO
   });
 
   addListener('iconTheme.change', async () => {
-    await contentLoaded$k(state);
+    await contentLoaded$k();
   });
 };
 
@@ -11717,40 +11741,27 @@ const getVisible$1 = (state) => {
   return state.dirents.slice(state.minLineY, state.maxLineY)
 };
 
-const scheduleDirents = async (state) => {
-  const visibleDirents = getVisible$1(state);
-  await invoke$1(
-    /* Viewlet.send */ 'Viewlet.send',
-    /* id */ 'Explorer',
-    /* method */ 'updateDirents',
-    /* visibleDirents */ visibleDirents
-  );
-};
-
-const updateViewport = (state) => {
-  const minLineY = Math.round(state.deltaY / ITEM_HEIGHT$1);
-  const maxLineY = minLineY + Math.round(state.height / ITEM_HEIGHT$1);
-  // TODO this should be functional (return new state)
-  state.minLineY = minLineY;
-  state.maxLineY = maxLineY;
-};
-
-const setDeltaY$1 = async (state, deltaY) => {
+const setDeltaY$1 = (state, deltaY) => {
   if (deltaY < 0) {
     deltaY = 0;
   } else if (deltaY > state.dirents.length * ITEM_HEIGHT$1 - state.height) {
     deltaY = Math.max(state.dirents.length * ITEM_HEIGHT$1 - state.height, 0);
   }
   if (state.deltaY === deltaY) {
-    return
+    return state
+  }
+  const minLineY = Math.round(deltaY / ITEM_HEIGHT$1);
+  const maxLineY = minLineY + Math.round(state.height / ITEM_HEIGHT$1);
+  return {
+    ...state,
+    deltaY,
+    minLineY,
+    maxLineY,
   }
-  state.deltaY = deltaY;
-  updateViewport(state);
-  await scheduleDirents(state);
 };
 
-const handleWheel$1 = async (state, deltaY) => {
-  await setDeltaY$1(state, state.deltaY + deltaY);
+const handleWheel$1 = (state, deltaY) => {
+  return setDeltaY$1(state, state.deltaY + deltaY)
 };
 
 const handleContextMenu$1 = async (state, x, y, index) => {
@@ -11762,19 +11773,20 @@ const handleContextMenu$1 = async (state, x, y, index) => {
     /* y */ y,
     /* id */ 'explorer'
   );
+  return state
 };
 
-const getFocusedDirent = (state) => {
+const getFocusedDirent$1 = (state) => {
   const dirent = state.dirents[state.focusedIndex];
   return dirent
 };
 
 // TODO support multiselection and removing multiple dirents
 const removeDirent = async (state) => {
-  if (state.focusedIndex === -1) {
-    return
+  if (state.focusedIndex < 0) {
+    return state
   }
-  const dirent = getFocusedDirent(state);
+  const dirent = getFocusedDirent$1(state);
   const absolutePath = dirent.path;
   try {
     // TODO handle error
@@ -11788,19 +11800,30 @@ const removeDirent = async (state) => {
     return
   }
   console.log('remove dirent');
+  // TODO avoid state mutation
   const newVersion = ++state.version;
   // TODO race condition
   // const newState = await loadContent(state)
   if (state.version !== newVersion || state.disposed) {
-    return
+    return state
   }
   // TODO is it possible to make this more functional instead of mutating state?
   // maybe every function returns a new state?
   const index = state.dirents.indexOf(dirent);
-  state.dirents.splice(index, 1);
+  let deleteEnd = index + 1;
+
+  for (; deleteEnd < state.dirents.length; deleteEnd++) {
+    console.log({ dirent: state.dirents[deleteEnd] });
+    if (state.dirents[deleteEnd].depth <= dirent.depth) {
+      break
+    }
+  }
+  const deleteCount = deleteEnd - index;
+  const newDirents = [...state.dirents];
+  newDirents.splice(index, deleteCount);
   let indexToFocus = -1;
 
-  if (state.dirents.length === 0) {
+  if (newDirents.length === 0) {
     indexToFocus = -1;
   } else if (index < state.focusedIndex) {
     indexToFocus = state.focusedIndex - 1;
@@ -11809,10 +11832,11 @@ const removeDirent = async (state) => {
   } else {
     indexToFocus = Math.max(state.focusedIndex - 1, 0);
   }
-
-  // TODO removing of file and setting focus should happen at the same time
-  await scheduleDirents(state);
-  await focusIndex$5(state, indexToFocus);
+  return {
+    ...state,
+    dirents: newDirents,
+    focusedIndex: indexToFocus,
+  }
 };
 
 const renameDirent = async (state) => {
@@ -11820,7 +11844,7 @@ const renameDirent = async (state) => {
   state.editingIndex = index;
   const dirent = state.dirents[index];
   const name = dirent.name;
-  await invoke$1(
+  await invoke$3(
     /* Viewlet.invoke */ 'Viewlet.send',
     /* id */ 'Explorer',
     /* method */ 'showRenameInputBox',
@@ -11833,7 +11857,7 @@ const cancelRename = async (state) => {
   const index = state.editingIndex;
   const dirent = state.dirents[index];
   state.editingIndex = -1;
-  await invoke$1(
+  await invoke$3(
     /* Viewlet.invoke */ 'Viewlet.send',
     /* id */ 'Explorer',
     /* method */ 'hideRenameBox',
@@ -11963,7 +11987,7 @@ const acceptRename = async (state) => {
   const index = state.editingIndex;
   state.editingIndex = -1;
   const renamedDirent = state.dirents[index];
-  const newDirentName = await invoke$1(
+  const newDirentName = await invoke$3(
     /* Viewlet.invoke */ 'Viewlet.send',
     /* id */ 'Explorer',
     /* method */ 'hideRenameBox',
@@ -11989,21 +12013,21 @@ const acceptRename = async (state) => {
   );
   //  TODO move focused index
   state.dirents = newDirents;
-  await contentLoaded$k(state);
+  await contentLoaded$k();
   await focusIndex$5(state, focusedIndex);
 
   // await updateDirents(state)
 };
 
 const copyRelativePath = async (state) => {
-  const dirent = getFocusedDirent(state);
+  const dirent = getFocusedDirent$1(state);
   const relativePath = dirent.path.slice(1);
   // TODO handle error
   await execute$1(/* ClipBoard.writeText */ 241, /* text */ relativePath);
 };
 
 const copyPath = async (state) => {
-  const dirent = getFocusedDirent(state);
+  const dirent = getFocusedDirent$1(state);
   // TODO windows paths
   // TODO handle error
   const path = dirent.path;
@@ -12014,7 +12038,7 @@ const openContainingFolder = async (state) => {
   // TODO handle error
   // TODO should return folder to open
   // TODO use command.execute instead
-  await invoke$2(
+  await invoke$1(
     /* Native.openFolder */ 'Native.openFolder',
     /* path */ state.root
   );
@@ -12033,36 +12057,38 @@ const newDirent = async (state) => {
     }
   }
   state.editingIndex = index;
-  await invoke$1(
+  await invoke$3(
     /* Viewlet.invoke */ 'Viewlet.send',
     /* id */ 'Explorer',
     /* method */ 'showCreateFileInputBox',
     /* index */ index
   );
+  return state
 };
 
 // TODO much shared logic with newFolder
 const newFile = async (state) => {
-  await newDirent(state);
+  return newDirent(state)
 };
 
 const cancelDirent = async (state) => {
   const index = state.editingIndex;
   state.editingIndex = -1;
-  await invoke$1(
+  await invoke$3(
     /* Viewlet.invoke */ 'Viewlet.send',
     /* id */ 'Explorer',
     /* method */ 'hideCreateFileInputBox',
     /* index */ index
   );
+  return state
 };
 
 const cancelNewFile = async (state) => {
-  await cancelDirent();
+  return cancelDirent()
 };
 
 const getParentFolder = (dirents, index, root) => {
-  if (index === -1) {
+  if (index < 0) {
     return root
   }
   return dirents[index].path
@@ -12072,7 +12098,7 @@ const acceptDirent = async (state, type) => {
   const editingIndex = state.editingIndex;
   const focusedIndex = state.focusedIndex;
   state.editingIndex = -1;
-  const newFileName = await invoke$1(
+  const newFileName = await invoke$3(
     /* Viewlet.invoke */ 'Viewlet.send',
     /* id */ 'Explorer',
     /* method */ 'hideCreateFileInputBox',
@@ -12084,7 +12110,7 @@ const acceptDirent = async (state, type) => {
     await showErrorDialog(
       new Error('file name must not be empty')
     );
-    return
+    return state
   }
   // console.log({ index: editingIndex, dirent: state.dirents[editingIndex] })
   const parentFolder = getParentFolder(state.dirents, focusedIndex, state.root);
@@ -12109,10 +12135,13 @@ const acceptDirent = async (state, type) => {
   }
   console.log({ focusedIndex });
   console.log(state.dirents);
-  const parentDirent = state.dirents[focusedIndex] || {
-    depth: 0,
-    path: state.root,
-  };
+  const parentDirent =
+    focusedIndex >= 0
+      ? state.dirents[focusedIndex]
+      : {
+          depth: 0,
+          path: state.root,
+        };
   const depth = parentDirent.depth + 1;
   const newDirent = {
     path: absolutePath,
@@ -12128,7 +12157,7 @@ const acceptDirent = async (state, type) => {
   let deltaPosInSet = 0;
   let posInSet = 1;
   let setSize = 1;
-  let i = state.focusedIndex + 1;
+  let i = Math.max(state.focusedIndex, -1) + 1;
   for (; i < state.dirents.length; i++) {
     const dirent = state.dirents[i];
     if (dirent.depth !== depth) {
@@ -12151,24 +12180,25 @@ const acceptDirent = async (state, type) => {
   newDirent.posInSet = posInSet;
   state.dirents.splice(insertIndex + 1, 0, newDirent);
 
-  console.log(state.dirents);
-  // TODO insert dirent here
-  // await updateDirents(state)
-  await contentLoaded$k(state);
+  const newDirents = [...state.dirents];
+  return {
+    ...state,
+    dirents: newDirents,
+  }
 };
 
 // TODO much duplicate logic with acceptNewFolder
-const acceptNewFile = async (state) => {
-  await acceptDirent(state, 'file');
+const acceptNewFile = (state) => {
+  return acceptDirent(state, 'file')
 };
 
-const acceptNewFolder = async (state) => {
-  await acceptDirent(state, 'directory');
+const acceptNewFolder = (state) => {
+  return acceptDirent(state, 'directory')
 };
 
 // TODO much copy paste with newFIle command
 const newFolder = async (state) => {
-  await newDirent(state);
+  return newDirent(state)
 };
 
 const handleClickFile = async (state, dirent, index) => {
@@ -12176,126 +12206,132 @@ const handleClickFile = async (state, dirent, index) => {
     /* Main.openAbsolutePath */ 'Main.openUri',
     /* absolutePath */ dirent.path
   );
+  return {
+    ...state,
+    focusedIndex: index,
+  }
 };
 
 const handleClickDirectory = async (state, dirent, index) => {
   dirent.type = 'directory-expanding';
   // TODO handle error
   const dirents = await getChildDirents(state, dirent);
+  // TODO use Viewlet.getState here and check if it exists
   const newIndex = state.dirents.indexOf(dirent);
   if (newIndex === -1) {
-    return
+    return state
   }
   // console.log(state.dirents[index] === dirent)
-  state.dirents.splice(newIndex + 1, 0, ...dirents);
+  const newDirents = [...state.dirents];
+  newDirents.splice(newIndex + 1, 0, ...dirents);
   dirent.type = 'directory-expanded';
   dirent.icon = getIcon$1(dirent);
-  await scheduleDirents(state);
+  return {
+    ...state,
+    dirents: newDirents,
+    focusedIndex: newIndex,
+  }
 };
 
 const handleClickDirectoryExpanding = async (state, dirent, index) => {
   dirent.type = 'directory';
   dirent.icon = getIcon$1(dirent);
-  await invoke$1(
+  await invoke$3(
     /* viewSend */ 'Viewlet.send',
     /* id */ 'Explorer',
     /* method */ 'collapse',
     /* index */ index,
     /* removeCount */ 0
   );
+  return state
 };
 
-const handleClickDirectoryExpanded = async (state, dirent, index) => {
+const handleClickDirectoryExpanded = (state, dirent, index) => {
   dirent.type = 'directory';
   dirent.icon = getIcon$1(dirent);
   const endIndex = getParentEndIndex(state.dirents, index);
   const removeCount = endIndex - index - 1;
   // TODO race conditions and side effects are everywhere
-  state.dirents.splice(index + 1, removeCount);
-  await scheduleDirents(state);
+  const newDirents = [...state.dirents];
+  newDirents.splice(index + 1, removeCount);
+  return {
+    ...state,
+    dirents: newDirents,
+  }
 };
 
 const handleClick$5 = async (state, index) => {
   if (index === -1) {
-    await focusIndex$5(state, -1);
-    return
+    return focusIndex$5(state, -1)
   }
   const actualIndex = index + state.minLineY;
-  state.focusedIndex = actualIndex;
   const dirent = state.dirents[actualIndex];
   // TODO dirent type should be numeric
   switch (dirent.type) {
     case 'file':
-      await handleClickFile(state, dirent);
-      break
+      return handleClickFile(state, dirent, actualIndex)
     // TODO decide on one name
     case 'folder':
     case 'directory':
-      await handleClickDirectory(state, dirent);
-      break
+      return handleClickDirectory(state, dirent)
     case 'directory-expanding':
-      await handleClickDirectoryExpanding(state, dirent, actualIndex);
-      break
+      return handleClickDirectoryExpanding(state, dirent, actualIndex)
     case 'directory-expanded':
-      await handleClickDirectoryExpanded(state, dirent, actualIndex);
-      break
+      return handleClickDirectoryExpanded(state, dirent, actualIndex)
   }
 };
 
-const handleClickCurrent = async (state) => {
-  await handleClick$5(state, state.focusedIndex);
+const focusNone = (state) => {
+  return focusIndex$5(state, -1)
 };
 
-const focusIndex$5 = async (state, index) => {
-  const oldFocusedIndex = state.focusedIndex;
-  state.focusedIndex = index;
-  await invoke$1(
-    /* viewSend */ 'Viewlet.send',
-    /* id */ 'Explorer',
-    /* method */ 'setFocusedIndex',
-    /* oldIndex */ oldFocusedIndex,
-    /* newIndex */ state.focusedIndex
-  );
+const handleClickCurrent = (state) => {
+  return handleClick$5(state, state.focusedIndex)
+};
+
+const focusIndex$5 = (state, index) => {
+  return {
+    ...state,
+    focusedIndex: index,
+  }
 };
 
-const focusNext$4 = async (state) => {
+const focusNext$4 = (state) => {
   if (state.focusedIndex === state.dirents.length - 1) {
-    return
+    return state
   }
-  await focusIndex$5(state, state.focusedIndex + 1);
+  return focusIndex$5(state, state.focusedIndex + 1)
 };
 
-const focusPrevious$4 = async (state) => {
+const focusPrevious$4 = (state) => {
   switch (state.focusedIndex) {
     case -1:
       if (state.dirents.length === 0) {
-        break
+        return state
       }
-      await focusIndex$5(state, state.dirents.length - 1);
-      break
+      return focusIndex$5(state, state.dirents.length - 1)
     case 0:
-      break
+      return state
     default:
-      await focusIndex$5(state, state.focusedIndex - 1);
-      break
+      return focusIndex$5(state, state.focusedIndex - 1)
   }
 };
 
-const focusFirst$4 = async (state) => {
+const focusFirst$4 = (state) => {
   if (state.dirents.length === 0 || state.focusedIndex === 0) {
-    return
+    return state
   }
-  await focusIndex$5(state, 0);
+  return focusIndex$5(state, 0)
 };
 
-const focusLast$4 = async (state) => {
+const focusLast$4 = (state) => {
   if (
     state.dirents.length === 0 ||
     state.focusedIndex === state.dirents.length - 1
   ) {
-    return
+    return state
   }
-  await focusIndex$5(state, state.dirents.length - 1);
+  return focusIndex$5(state, state.dirents.length - 1)
 };
 
 const scrollUp = () => {};
@@ -12305,51 +12341,50 @@ const scrollDown = () => {};
 
 const handleArrowRight = async (state) => {
   if (state.focusedIndex === -1) {
-    return
+    return state
   }
   const dirent = state.dirents[state.focusedIndex];
   switch (dirent.type) {
     case 'file':
-      break
+      return state
     case 'directory':
-      await handleClickDirectory(state, dirent);
-      break
+      return handleClickDirectory(state, dirent)
     case 'directory-expanded':
       if (state.focusedIndex === state.dirents.length - 1) {
-        break
+        return state
       }
       const nextDirent = state.dirents[state.focusedIndex + 1];
       if (nextDirent.depth === dirent.depth + 1) {
-        await focusIndex$5(state, state.focusedIndex + 1);
+        return focusIndex$5(state, state.focusedIndex + 1)
       }
       break
+    default:
+      return state
   }
 };
 
-const focusParentFolder = async (state) => {
+const focusParentFolder = (state) => {
   const parentStartIndex = getParentStartIndex(
     state.dirents,
     state.focusedIndex
   );
   if (parentStartIndex === -1) {
-    return
+    return state
   }
-  await focusIndex$5(state, parentStartIndex);
+  return focusIndex$5(state, parentStartIndex)
 };
 
-const handleArrowLeft = async (state) => {
+const handleArrowLeft = (state) => {
   if (state.focusedIndex === -1) {
-    return
+    return state
   }
   const dirent = state.dirents[state.focusedIndex];
   switch (dirent.type) {
     case 'directory':
     case 'file':
-      await focusParentFolder(state);
-      break
+      return focusParentFolder(state)
     case 'directory-expanded':
-      await handleClickDirectoryExpanded(state, dirent, state.focusedIndex);
-      break
+      return handleClickDirectoryExpanded(state, dirent, state.focusedIndex)
   }
 };
 
@@ -12409,7 +12444,7 @@ const handleMouseEnter = async (state, index) => {
   const dirent = state.dirents[index];
   if (!isImage(dirent)) {
     // TODO preload content maybe when it is a long hover
-    return
+    return state
   }
   const uri = `${state.root}${dirent.path}`;
   const top = state.top + index * ITEM_HEIGHT$1;
@@ -12425,8 +12460,9 @@ const handleMouseEnter = async (state, index) => {
 // TODO what happens when mouse leave and anther mouse enter event occur?
 // should update preview instead of closing and reopening
 
-const handleMouseLeave = async () => {
+const handleMouseLeave = async (state) => {
   // await Command.execute(/* ImagePreview.hide */ 9082)
+  return state
 };
 
 const getBaseName = (path, pathSeparator) => {
@@ -12436,7 +12472,7 @@ const getBaseName = (path, pathSeparator) => {
 const handleCopy = async (state) => {
   // TODO handle multiple files
   // TODO if not file is selected, what happens?
-  const dirent = getFocusedDirent(state);
+  const dirent = getFocusedDirent$1(state);
   if (!dirent) {
     console.info('[ViewletExplorer/handleCopy] no dirent selected');
     return
@@ -12523,28 +12559,35 @@ const expandAll = async (state) => {
   console.log('EXPAND ALL');
   const { dirents, focusedIndex } = state;
   if (focusedIndex === -1) {
-    return
+    return state
   }
   const dirent = dirents[focusedIndex];
   const depth = dirent.depth;
-  for (const dirent of dirents) {
+  const newDirents = [...dirents];
+  // TODO fetch child dirents in parallel
+  for (const dirent of newDirents) {
     if (dirent.depth === depth && dirent.type === 'directory') {
       // TODO expand
+      // TODO avoid mutating state here
       dirent.type = 'directory-expanding';
       // TODO handle error
+      // TODO race condition
       const childDirents = await getChildDirents(state, dirent);
-      const newIndex = dirents.indexOf(dirent);
+      const newIndex = newDirents.indexOf(dirent);
       if (newIndex === -1) {
         continue
       }
       // console.log(state.dirents[index] === dirent)
-      dirents.splice(newIndex + 1, 0, ...childDirents);
+      newDirents.splice(newIndex + 1, 0, ...childDirents);
+      // TODO avoid mutating state here
       dirent.type = 'directory-expanded';
       // await expand(state, dirent.index)
     }
   }
-  console.log({ dirents: [...dirents] });
-  await scheduleDirents(state);
+  return {
+    ...state,
+    dirents: newDirents,
+  }
 };
 
 const isTopLevel = (dirent) => {
@@ -12561,10 +12604,54 @@ const toCollapsedDirent = (dirent) => {
   return dirent
 };
 
-const collapseAll = async (state) => {
+const collapseAll = (state) => {
   const newDirents = state.dirents.filter(isTopLevel).map(toCollapsedDirent);
-  state.dirents = newDirents;
-  await scheduleDirents(state);
+  return {
+    ...state,
+    dirents: newDirents,
+  }
+};
+
+const handleBlur = (state) => {
+  return focusIndex$5(state, -2)
+};
+
+const hasFunctionalRender$c = true;
+
+const render$c = (oldState, newState) => {
+  const changes = [];
+  if (
+    oldState.dirents !== newState.dirents ||
+    oldState.minLineY !== newState.minLineY ||
+    oldState.maxLineY !== newState.maxLineY
+  ) {
+    const visibleDirents = getVisible$1(newState);
+    changes.push([
+      /* Viewlet.send */ 'Viewlet.send',
+      /* id */ 'Explorer',
+      /* method */ 'updateDirents',
+      /* visibleDirents */ visibleDirents,
+    ]);
+    // TODO rendering dirents should not override focus
+    // when that issue is fixed, this can be removed
+    changes.push([
+      /* Viewlet.send */ 'Viewlet.send',
+      /* id */ 'Explorer',
+      /* method */ 'setFocusedIndex',
+      /* oldindex */ oldState.focusedIndex,
+      /* newIndex */ newState.focusedIndex,
+    ]);
+  }
+  if (oldState.focusedIndex !== newState.focusedIndex) {
+    changes.push([
+      /* Viewlet.send */ 'Viewlet.send',
+      /* id */ 'Explorer',
+      /* method */ 'setFocusedIndex',
+      /* oldindex */ oldState.focusedIndex,
+      /* newIndex */ newState.focusedIndex,
+    ]);
+  }
+  return changes
 };
 
 var ViewletExplorer = {
@@ -12578,7 +12665,7 @@ var ViewletExplorer = {
   setDeltaY: setDeltaY$1,
   handleWheel: handleWheel$1,
   handleContextMenu: handleContextMenu$1,
-  getFocusedDirent: getFocusedDirent,
+  getFocusedDirent: getFocusedDirent$1,
   removeDirent: removeDirent,
   renameDirent: renameDirent,
   cancelRename: cancelRename,
@@ -12593,6 +12680,7 @@ var ViewletExplorer = {
   acceptNewFolder: acceptNewFolder,
   newFolder: newFolder,
   handleClick: handleClick$5,
+  focusNone: focusNone,
   handleClickCurrent: handleClickCurrent,
   focusIndex: focusIndex$5,
   focusNext: focusNext$4,
@@ -12611,134 +12699,48 @@ var ViewletExplorer = {
   handlePaste: handlePaste,
   resize: resize$9,
   expandAll: expandAll,
-  collapseAll: collapseAll
+  collapseAll: collapseAll,
+  handleBlur: handleBlur,
+  hasFunctionalRender: hasFunctionalRender$c,
+  render: render$c
 };
 
+// prettier-ignore
 const __initialize__$G = () => {
-  register$2(
-    'ViewletExplorer.focusNext',
-    wrapViewletCommand('Explorer', focusNext$4)
-  );
-  register$2(
-    'ViewletExplorer.focusPrevious',
-    wrapViewletCommand('Explorer', focusPrevious$4)
-  );
-  register$2(
-    'ViewletExplorer.scrollUp',
-    wrapViewletCommand('Explorer', scrollUp)
-  );
-  register$2(
-    'ViewletExplorer.scrollDown',
-    wrapViewletCommand('Explorer', scrollDown)
-  );
-  register$2(
-    'ViewletExplorer.handleClickCurrent',
-    wrapViewletCommand('Explorer', handleClickCurrent)
-  );
-  register$2(
-    'ViewletExplorer.newFile',
-    wrapViewletCommand('Explorer', newFile)
-  );
-  register$2(
-    'ViewletExplorer.openContainingFolder',
-    wrapViewletCommand('Explorer', openContainingFolder)
-  );
-  register$2(
-    'ViewletExplorer.copyPath',
-    wrapViewletCommand('Explorer', copyPath)
-  );
-  register$2(
-    'ViewletExplorer.copyRelativePath',
-    wrapViewletCommand('Explorer', copyRelativePath)
-  );
-  register$2(
-    'ViewletExplorer.removeDirent',
-    wrapViewletCommand('Explorer', removeDirent)
-  );
-  register$2(
-    'ViewletExplorer.newFolder',
-    wrapViewletCommand('Explorer', newFolder)
-  );
-  register$2(
-    'ViewletExplorer.getFocusedDirent',
-    wrapViewletCommand('Explorer', getFocusedDirent)
-  );
-  register$2(
-    'ViewletExplorer.handleArrowRight',
-    wrapViewletCommand('Explorer', handleArrowRight)
-  );
-  register$2(
-    'ViewletExplorer.handleArrowLeft',
-    wrapViewletCommand('Explorer', handleArrowLeft)
-  );
-  register$2(
-    'ViewletExplorer.focusFirst',
-    wrapViewletCommand('Explorer', focusFirst$4)
-  );
-  register$2(
-    'ViewletExplorer.focusLast',
-    wrapViewletCommand('Explorer', focusLast$4)
-  );
-  register$2(
-    'ViewletExplorer.renameDirent',
-    wrapViewletCommand('Explorer', renameDirent)
-  );
-  register$2(
-    'ViewletExplorer.handleMouseEnter',
-    wrapViewletCommand('Explorer', handleMouseEnter)
-  );
-  register$2(
-    'ViewletExplorer.handleMouseLeave',
-    wrapViewletCommand('Explorer', handleMouseLeave)
-  );
-  register$2(
-    'ViewletExplorer.handleClick',
-    wrapViewletCommand('Explorer', handleClick$5)
-  );
-  register$2(
-    'ViewletExplorer.handleContextMenu',
-    wrapViewletCommand('Explorer', handleContextMenu$1)
-  );
-  register$2(
-    'ViewletExplorer.handleWheel',
-    wrapViewletCommand('Explorer', handleWheel$1)
-  );
-  register$2(
-    'ViewletExplorer.setDeltaY',
-    wrapViewletCommand('Explorer', setDeltaY$1)
-  );
-  register$2(
-    'ViewletExplorer.handlePaste',
-    wrapViewletCommand('Explorer', handlePaste)
-  );
-  register$2(
-    'ViewletExplorer.handleCopy',
-    wrapViewletCommand('Explorer', handleCopy)
-  );
-  register$2(
-    'ViewletExplorer.cancelRename',
-    wrapViewletCommand('Explorer', cancelRename)
-  );
-  register$2(
-    'ViewletExplorer.acceptRename',
-    wrapViewletCommand('Explorer', acceptRename)
-  );
-  register$2(
-    'ViewletExplorer.cancelNewFile',
-    wrapViewletCommand('Explorer', cancelNewFile)
-  );
-  register$2(
-    'ViewletExplorer.acceptNewFile',
-    wrapViewletCommand('Explorer', acceptNewFile)
-  );
-  register$2(
-    'ViewletExplorer.expandAll',
-    wrapViewletCommand('Explorer', expandAll)
-  );
-  register$2(
-    'ViewletExplorer.collapseAll',
-    wrapViewletCommand('Explorer', collapseAll)
-  );
+  register$2('Explorer.acceptNewFile',        wrapViewletCommand('Explorer', acceptNewFile));
+  register$2('Explorer.acceptRename',         wrapViewletCommand('Explorer', acceptRename));
+  register$2('Explorer.cancelNewFile',        wrapViewletCommand('Explorer', cancelNewFile));
+  register$2('Explorer.cancelRename',         wrapViewletCommand('Explorer', cancelRename));
+  register$2('Explorer.collapseAll',          wrapViewletCommand('Explorer', collapseAll));
+  register$2('Explorer.copyPath',             wrapViewletCommand('Explorer', copyPath));
+  register$2('Explorer.copyRelativePath',     wrapViewletCommand('Explorer', copyRelativePath));
+  register$2('Explorer.expandAll',            wrapViewletCommand('Explorer', expandAll));
+  register$2('Explorer.focusFirst',           wrapViewletCommand('Explorer', focusFirst$4));
+  register$2('Explorer.focusIndex',           wrapViewletCommand('Explorer', focusIndex$5));
+  register$2('Explorer.focusLast',            wrapViewletCommand('Explorer', focusLast$4));
+  register$2('Explorer.focusNext',            wrapViewletCommand('Explorer', focusNext$4));
+  register$2('Explorer.focusNone',            wrapViewletCommand('Explorer', focusNone));
+  register$2('Explorer.focusPrevious',        wrapViewletCommand('Explorer', focusPrevious$4));
+  register$2('Explorer.getFocusedDirent',     wrapViewletCommand('Explorer', getFocusedDirent$1));
+  register$2('Explorer.handleArrowLeft',      wrapViewletCommand('Explorer', handleArrowLeft));
+  register$2('Explorer.handleArrowRight',     wrapViewletCommand('Explorer', handleArrowRight));
+  register$2('Explorer.handleBlur',           wrapViewletCommand('Explorer', handleBlur));
+  register$2('Explorer.handleClick',          wrapViewletCommand('Explorer', handleClick$5));
+  register$2('Explorer.handleClickCurrent',   wrapViewletCommand('Explorer', handleClickCurrent));
+  register$2('Explorer.handleContextMenu',    wrapViewletCommand('Explorer', handleContextMenu$1));
+  register$2('Explorer.handleCopy',           wrapViewletCommand('Explorer', handleCopy));
+  register$2('Explorer.handleMouseEnter',     wrapViewletCommand('Explorer', handleMouseEnter));
+  register$2('Explorer.handleMouseLeave',     wrapViewletCommand('Explorer', handleMouseLeave));
+  register$2('Explorer.handlePaste',          wrapViewletCommand('Explorer', handlePaste));
+  register$2('Explorer.handleWheel',          wrapViewletCommand('Explorer', handleWheel$1));
+  register$2('Explorer.newFile',              wrapViewletCommand('Explorer', newFile));
+  register$2('Explorer.newFolder',            wrapViewletCommand('Explorer', newFolder));
+  register$2('Explorer.openContainingFolder', wrapViewletCommand('Explorer', openContainingFolder));
+  register$2('Explorer.removeDirent',         wrapViewletCommand('Explorer', removeDirent));
+  register$2('Explorer.renameDirent',         wrapViewletCommand('Explorer', renameDirent));
+  register$2('Explorer.scrollDown',           wrapViewletCommand('Explorer', scrollDown));
+  register$2('Explorer.scrollUp',             wrapViewletCommand('Explorer', scrollUp));
+  register$2('Explorer.setDeltaY',            wrapViewletCommand('Explorer', setDeltaY$1));
 };
 
 var ViewletExplorer_ipc = {
@@ -12791,7 +12793,7 @@ const contentLoaded$j = (state) => {
 
 const contentLoadedEffects$2 = async (state) => {
   // TODO this should be invoke
-  send$2(
+  send$1(
     /* createTerminal */ 'Terminal.create',
     /* id */ state.id,
     /* cwd */ state$w.workspacePath
@@ -12801,14 +12803,14 @@ const contentLoadedEffects$2 = async (state) => {
 const handleData$1 = async (state, data) => {
   // Terminal.handleData(state, data)
   const parsedData = new Uint8Array(data.data);
-  await invoke$1(
+  await invoke$3(
     /* ViewletTerminal.write */ 'Terminal.write',
     /* data */ parsedData
   );
 };
 
 const write = async (state, input) => {
-  await invoke$2(
+  await invoke$1(
     /* Terminal.write */ 'Terminal.write',
     /* id */ state.id,
     /* input */ input
@@ -12827,7 +12829,7 @@ const resize$8 = async (state, width, height) => {
   // const columns = Math.round(width / columnWidth)
   const columns = 7;
   const rows = Math.round(height / rowHeight);
-  await invoke$2(
+  await invoke$1(
     /* Terminal.resize */ 'Terminal.resize',
     /* id */ state.id,
     /* columns */ columns,
@@ -12838,7 +12840,7 @@ const resize$8 = async (state, width, height) => {
 };
 
 const clear$2 = async (state) => {
-  await invoke$1(
+  await invoke$3(
     /* ViewletTerminal.write */ 'Terminal.write',
     /* data */ new TextEncoder().encode('TODO clear terminal')
   );
@@ -12887,35 +12889,35 @@ var ColorPicker_ipc = {
 };
 
 const install = (id) => {
-  return invoke$2(
+  return invoke$1(
     /* ExtensionManagement.install */ 'ExtensionManagement.install',
     /* id */ id
   )
 };
 
 const uninstall = (id) => {
-  return invoke$2(
+  return invoke$1(
     /* ExtensionManagement.uninstall */ 'ExtensionManagement.uninstall',
     /* id */ id
   )
 };
 
 const disable = async (id) => {
-  return invoke$2(
+  return invoke$1(
     /* ExtensionManagement.disable */ 'ExtensionManagement.disable',
     /* id */ id
   )
 };
 
 const enable = async (id) => {
-  return invoke$2(
+  return invoke$1(
     /* ExtensionManagement.enable */ 'ExtensionManagement.enable',
     /* id */ id
   )
 };
 
 const getAllExtensions = async () => {
-  return invoke$2(
+  return invoke$1(
     /* ExtensionManagement.getAllExtensions */ 'ExtensionManagement.getAllExtensions'
   )
 };
@@ -13242,10 +13244,10 @@ const handleInput$1 = async (state, value) => {
     // TODO handle out of order responses (a bit complicated)
     // for now just assume everything comes back in order
   } catch (error) {
-    handleError$1(error);
+    handleError$2(error);
     // console.error(error)
     // TODO show error in viewlet
-    await invoke$1(
+    await invoke$3(
       /* viewletSend */ 'Viewlet.send',
       /* id */ 'Extensions',
       /* method */ 'setError',
@@ -13353,7 +13355,7 @@ const focusLast$3 = (state) => {
 
 // TODO show error / warning  when installment fails / times out
 const handleInstall = async (state, id) => {
-  await invoke$1(
+  await invoke$3(
     /* viewletSend */ 'Viewlet.send',
     /* id */ 'Extensions',
     /* method */ 'setExtensionState',
@@ -13364,7 +13366,7 @@ const handleInstall = async (state, id) => {
     await install(/* id */ id);
   } catch (error) {
     // TODO have multi send command
-    await invoke$1(
+    await invoke$3(
       /* viewletSend */ 'Viewlet.send',
       /* id */ 'Extensions',
       /* method */ 'setExtensionState',
@@ -13372,10 +13374,10 @@ const handleInstall = async (state, id) => {
       /* state */ 'uninstalled'
     );
     // TODO use command.execute
-    handleError$1(error);
+    handleError$2(error);
     return
   }
-  await invoke$1(
+  await invoke$3(
     /* viewletSend */ 'Viewlet.send',
     /* id */ 'Extensions',
     /* method */ 'setExtensionState',
@@ -13386,7 +13388,7 @@ const handleInstall = async (state, id) => {
 
 // TODO lazyload this
 const handleUninstall = async (state, id) => {
-  await invoke$1(
+  await invoke$3(
     /* viewletSend */ 'Viewlet.send',
     /* id */ 'Extensions',
     /* method */ 'setExtensionState',
@@ -13396,17 +13398,17 @@ const handleUninstall = async (state, id) => {
   try {
     await uninstall(id);
   } catch (error) {
-    await invoke$1(
+    await invoke$3(
       /* viewletSend */ 'Viewlet.send',
       /* id */ 'Extensions',
       /* method */ 'setExtensionState',
       /* id */ id,
       /* state */ 'installed'
     );
-    handleError$1(error);
+    handleError$2(error);
     return
   }
-  await invoke$1(
+  await invoke$3(
     /* viewletSend */ 'Viewlet.send',
     /* id */ 'Extensions',
     /* method */ 'setExtensionState',
@@ -13420,17 +13422,17 @@ const handleEnable = async (state, id) => {
   try {
     await enable(id);
   } catch (error) {
-    await invoke$1(
+    await invoke$3(
       /* viewletSend */ 'Viewlet.send',
       /* id */ 'Extensions',
       /* method */ 'setExtensionState',
       /* id */ id,
       /* state */ 'disabled'
     );
-    handleError$1(error);
+    handleError$2(error);
     return
   }
-  await invoke$1(
+  await invoke$3(
     /* viewletSend */ 'Viewlet.send',
     /* id */ 'Extensions',
     /* method */ 'setExtensionState',
@@ -13445,10 +13447,10 @@ const handleDisable = async (state, id) => {
     await disable(id);
   } catch (error) {
     console.error(error);
-    handleError$1(error);
+    handleError$2(error);
     return
   }
-  await invoke$1(
+  await invoke$3(
     /* viewletSend */ 'Viewlet.send',
     /* id */ 'Extensions',
     /* method */ 'setExtensionState',
@@ -13470,7 +13472,7 @@ const handleContextMenu = async (state, x, y, extensionId) => {
 const openSuggest = async (state) => {
   const filteredSuggestions = SUGGESTIONS;
   state.suggestionState = /* Open */ 1;
-  await invoke$1(
+  await invoke$3(
     /* viewletSend */ 'Viewlet.send',
     /* id */ 'Extensions',
     /* method */ 'openSuggest',
@@ -13480,7 +13482,7 @@ const openSuggest = async (state) => {
 
 const closeSuggest = async (state) => {
   state.suggestionState = /* Closed */ 0;
-  await invoke$1(
+  await invoke$3(
     /* viewletSend */ 'Viewlet.send',
     /* id */ 'Extensions',
     /* method */ 'closeSuggest'
@@ -13774,7 +13776,7 @@ const writeText = async (path) => {
 };
 
 const writeNativeFiles = (type, files) => {
-  return invoke$2(
+  return invoke$1(
     /* command */ 'ClipBoard.writeFiles',
     /* type */ type,
     /* files */ files
@@ -13782,7 +13784,7 @@ const writeNativeFiles = (type, files) => {
 };
 
 const readNativeFiles = () => {
-  return invoke$2(/* command */ 'ClipBoard.readFiles')
+  return invoke$1(/* command */ 'ClipBoard.readFiles')
 };
 
 const __initialize__$B = () => {
@@ -14297,7 +14299,7 @@ const openMenuAtIndex = async (index, shouldBeFocused) => {
   const id = state$6.titleBarEntries[index].id;
   const items = await getMenuEntries$h(id);
   state$i.menus = [];
-  const bounds = await invoke$1(
+  const bounds = await invoke$3(
     /* Viewlet.send */ 'Viewlet.send',
     /* id */ 'TitleBar',
     /* method */ 'menuGetEntryBounds',
@@ -14318,7 +14320,7 @@ const openMenuAtIndex = async (index, shouldBeFocused) => {
     x,
     y,
   });
-  send$1([
+  invoke$3(
     /* Viewlet.send */ 'Viewlet.send',
     /* id */ 'TitleBar',
     /* method */ 'menuOpen',
@@ -14331,8 +14333,8 @@ const openMenuAtIndex = async (index, shouldBeFocused) => {
     /* x */ x,
     /* y */ y,
     /* width */ width,
-    /* height */ height,
-  ]);
+    /* height */ height
+  );
   state$6.isMenuOpen = true;
 };
 
@@ -14353,7 +14355,7 @@ const closeMenu = async (keepFocus) => {
   const focusIndex = keepFocus ? state$6.focusedIndex : -1;
   // TODO use Viewlet.dispose instead
   state$6.isMenuOpen = false;
-  await invoke$1(
+  await invoke$3(
     /* Viewlet.send */ 'Viewlet.send',
     /* id */ 'TitleBar',
     /* method */ 'menuClose',
@@ -14366,7 +14368,7 @@ const focusIndex$3 = async (index) => {
   if (state$6.isMenuOpen) {
     await openMenuAtIndex(index, /* focus */ false);
   } else {
-    await invoke$1(
+    await invoke$3(
       /* TitleBarMenuBar.focusIndex */ 1371,
       /* unFocusIndex */ state$6.focusedIndex,
       /* index */ index
@@ -14530,7 +14532,7 @@ var TitleBarMenuBar_ipc = {
 };
 
 const __initialize__$u = () => {
-  register$2('ErrorHandling.handleError', handleError$1);
+  register$2('ErrorHandling.handleError', handleError$2);
 };
 
 var ErrorHandling_ipc = {
@@ -14552,27 +14554,27 @@ const state$5 = {
 };
 
 const focusActivityBar = async () => {
-  await invoke$1(/* ActivityBar.focus */ 717115);
+  await invoke$3(/* ActivityBar.focus */ 717115);
 };
 
 const focusStatusBar = async () => {
-  await invoke$1(/* StatusBar.focus */ 8882);
+  await invoke$3(/* StatusBar.focus */ 8882);
 };
 
 const focusPanel = async () => {
-  await invoke$1(/* Panel.focus */ 6664);
+  await invoke$3(/* Panel.focus */ 6664);
 };
 
 const focusSideBar = async () => {
-  await invoke$1(/* SideBar.focus */ 5554);
+  await invoke$3(/* SideBar.focus */ 5554);
 };
 
 const focusTitleBar = async () => {
-  await invoke$1(/* TitleBar.focus */ 1331);
+  await invoke$3(/* TitleBar.focus */ 1331);
 };
 
 const focusMain = async () => {
-  await invoke$1(/* Main.focus */ 2145);
+  await invoke$3(/* Main.focus */ 2145);
 };
 
 const focusPart = (part) => {
@@ -14681,7 +14683,7 @@ var Navigation_ipc = {
   __initialize__: __initialize__$t
 };
 
-const CACHE_NAME = 'lvce-runtime-63e03f3';
+const CACHE_NAME = 'lvce-runtime-eb65b4e';
 
 const shouldIgnoreError = (error) => {
   // Firefox throws dom exception in private mode
@@ -14802,11 +14804,11 @@ var CacheStorage_ipc = {
 };
 
 const clear$1 = async () => {
-  await invoke$1(/* LocalStorage.clear */ 8986);
+  await invoke$3(/* LocalStorage.clear */ 8986);
 };
 
 const getText = async (key) => {
-  const item = await invoke$1(
+  const item = await invoke$3(
     /* LocalStorage.getItem */ 'LocalStorage.getItem',
     /* key */ key
   );
@@ -14826,7 +14828,7 @@ const getJson$1 = async (key) => {
 };
 
 const setText = async (key, value) => {
-  await invoke$1(
+  await invoke$3(
     /* LocalStorage.setItem */ 'LocalStorage.setItem',
     /* key */ key,
     /* value */ value
@@ -14854,13 +14856,13 @@ var LocalStorage_ipc = {
 };
 
 const clear = async () => {
-  await invoke$1(
+  await invoke$3(
     /* SessionStorage.clear */ 'SessionStorage.clear'
   );
 };
 
 const getJson = async (key) => {
-  const item = await invoke$1(
+  const item = await invoke$3(
     /* SessionStorage.getItem */ 'SessionStorage.getItem',
     /* key */ key
   );
@@ -14906,7 +14908,7 @@ const openFolder = async () => {
     return
   }
   if (getPlatform() === 'remote') {
-    const path = await invoke$1(
+    const path = await invoke$3(
       /* Dialog.prompt */ 7833,
       /* message */ 'Choose path:'
     );
@@ -14916,7 +14918,7 @@ const openFolder = async () => {
     );
     return
   }
-  const folders = await invoke$2(
+  const folders = await invoke$1(
     /* Electron.showOpenDialog */ 'Electron.showOpenDialog'
   );
   if (!folders || folders.length === 0) {
@@ -14934,7 +14936,7 @@ const showAbout = async () => {
     console.warn('show about - not implemented');
     return
   }
-  await invoke$2(/* Electron.about */ 'Electron.about');
+  await invoke$1(/* Electron.about */ 'Electron.about');
 };
 
 const showMessage = async (message, options) => {
@@ -14948,14 +14950,13 @@ const showMessage = async (message, options) => {
   if (!options) {
     options = ['Show Command Output', 'Cancel', 'Open Git Log'];
   }
-  console.log({ message });
   state$4.dialog = {
     message,
     options,
   };
 
   if (getPlatform() === 'electron') {
-    const index = await invoke$2(
+    const index = await invoke$1(
       /* Electron.showMessageBox */ 'Electron.showMessageBox',
       /* message */ message.message,
       /* buttons */ options
@@ -14969,8 +14970,8 @@ const showMessage = async (message, options) => {
     // console.log({ result: index })
     // state.dialog = undefined
   } else {
-    await invoke$1(
-      /* Dialog.showErrorDialogWithOptions */ 7835,
+    await invoke$3(
+      /* Dialog.showErrorDialogWithOptions */ 'Dialog.showErrorDialogWithOptions',
       /* message */ message,
       /* options */ options
     );
@@ -14984,7 +14985,7 @@ const close$1 = async () => {
     return
   }
   state$4.dialog = undefined;
-  await invoke$1(/* Dialog.close */ 7836);
+  await invoke$3(/* Dialog.close */ 7836);
 };
 
 const handleClick$3 = async (index) => {
@@ -15173,7 +15174,7 @@ var FileSystem_ipc = {
 const findInWorkspace = async (searchTerm) => {
   // TODO ask shared process
   const root = state$w.workspacePath;
-  const result = await invoke$2(
+  const result = await invoke$1(
     /* Search.search */ 'Search.search',
     /* folder */ root,
     /* searchTerm */ searchTerm
@@ -15273,7 +15274,7 @@ const open = async (editor) => {
     const y$1 = y(editor, editor.cursor);
     // const prepareRenameResult = await prepareRename(editor)
     // console.log({ prepareRenameResult })
-    await invoke$1(
+    await invoke$3(
       /* EditorRename.openWidget */ 4512,
       /* x */ x$1,
       /* y */ y$1
@@ -15322,7 +15323,7 @@ const applyWorkspaceEdits = async (editor, workspaceEdits) => {
 };
 
 const finish = async (editor) => {
-  const newName = await invoke$1(/* EditorRename.finish */ 4513);
+  const newName = await invoke$3(/* EditorRename.finish */ 4513);
   console.log('do actual rename', { value: newName });
   // TODO support canceling rename (e.g. when user presses escape)
   const workspaceEdits = await rename(editor);
@@ -15333,7 +15334,7 @@ const finish = async (editor) => {
 };
 
 const abort = async () => {
-  await invoke$1(/* EditorRename.closeWidget */ 4514);
+  await invoke$3(/* EditorRename.closeWidget */ 4514);
 };
 
 const __initialize__$h = () => {
@@ -15350,7 +15351,7 @@ var EditorRename_ipc = {
 const show$1 = async (editor, message, position) => {
   const x$1 = x(editor, position);
   const y$1 = y(editor, position);
-  await invoke$1(
+  await invoke$3(
     /* EditorError.show */ 'EditorError.show',
     /* message */ message,
     /* x */ x$1,
@@ -15579,7 +15580,7 @@ const show = async (uri, top, left) => {
     if (version !== state$3.versionId) {
       return
     }
-    await invoke$1(
+    await invoke$3(
       /* Viewlet.hydrate */ 3028,
       /* id */ 'ImagePreview',
       /* imageUrl */ blobUrl,
@@ -15588,7 +15589,7 @@ const show = async (uri, top, left) => {
     );
   } catch (error) {
     console.error(error);
-    await invoke$1(
+    await invoke$3(
       /* Viewlet.hydrate */ 3028,
       /* id */ 'ImagePreview',
       /* message */ 'Image could not be loaded',
@@ -15600,7 +15601,7 @@ const show = async (uri, top, left) => {
 
 const hide = async () => {
   ++state$3.versionId;
-  await invoke$1(
+  await invoke$3(
     /* Viewlet.dispose */ 'Viewlet.dispose',
     /* id */ 'ImagePreview'
   );
@@ -15794,7 +15795,7 @@ var Open_ipc = {
 
 const playBell = async () => {
   const src = '/sounds/bell.oga';
-  await invoke$1(/* Audio.play */ 3211, /* src */ src);
+  await invoke$3(/* Audio.play */ 3211, /* src */ src);
 };
 
 const __initialize__$7 = () => {
@@ -16225,7 +16226,7 @@ const setValue = (state, value) => {
   state.value = value;
   // TODO use Id module
   state.searchId = Math.random();
-  send$2(
+  send$1(
     /* Search.search */ 907771,
     /* id */ state.id,
     /* searchId */ state.searchId
@@ -16236,7 +16237,7 @@ const handleResult = async (state, result) => {
   if (result.version !== state.version) {
     return
   }
-  await invoke$1(
+  await invoke$3(
     /* viewletInvoke */ 'Viewlet.send',
     /* id */ state.id,
     /* method */ 'handleSearchResult',
@@ -16248,7 +16249,7 @@ const dispose$d = async (state) => {
   // TODO cancel pending search
   if (state.state === 'searching') {
     // TODO this should be invoke
-    await invoke$2(
+    await invoke$1(
       /* Search.cancel */ 'Search.cancel',
       /* searchId */ state.searchId
     );
@@ -17112,7 +17113,7 @@ const loadContent$8 = async (state) => {
   ];
   const selectedIndex = 0;
   // TODO duplicate send here
-  await invoke$2(
+  await invoke$1(
     /* OutputChannel.open */ 'OutputChannel.open',
     /* id */ 0,
     /* path */ options[selectedIndex].file
@@ -17125,7 +17126,7 @@ const loadContent$8 = async (state) => {
 };
 
 const contentLoaded$8 = async (state) => {
-  await invoke$1(
+  await invoke$3(
     /* Viewlet.invoke */ 'Viewlet.send',
     /* id */ 'Output',
     /* method */ 'setOptions',
@@ -17137,14 +17138,14 @@ const contentLoaded$8 = async (state) => {
 const setOutputChannel = async (state, option) => {
   state.selectedOption = option;
   // TODO race condition
-  await invoke$1(
+  await invoke$3(
     /* viewletSend */ 'Viewlet.send',
     /* id */ 'Output',
     /* method */ 'clear'
   );
   // TODO race condition
   // TODO should use invoke
-  await invoke$2(
+  await invoke$1(
     /* OutputChannel.open */ 'OutputChannel.open',
     /* id */ 'Output',
     /* path */ state.selectedOption
@@ -17153,7 +17154,7 @@ const setOutputChannel = async (state, option) => {
 
 const handleData = async (state, data) => {
   console.log({ handleData: data });
-  await invoke$1(
+  await invoke$3(
     /* Viewlet.invoke */ 'Viewlet.send',
     /* id */ 'Output',
     /* method */ 'append',
@@ -17164,7 +17165,7 @@ const handleData = async (state, data) => {
 const dispose$7 = async (state) => {
   state.disposed = true;
   // TODO close output channel in shared process
-  await invoke$2(
+  await invoke$1(
     /* OutputChannel.close */ 'OutputChannel.close',
     /* id */ 'Output'
   );
@@ -17431,7 +17432,7 @@ const resize$1 = (state, dimensions) => {
 const hasFunctionalRender$4 = true;
 
 const render$4 = (oldState, newState) => {
-  return render$c(oldState, newState)
+  return render$d(oldState, newState)
 };
 
 var ViewletEditorText = {
@@ -17561,7 +17562,7 @@ const create$3 = (id, uri, left, top, width, height) => {
 
 const loadContent$3 = (state) => {
   const update = async () => {
-    await invoke$1(
+    await invoke$3(
       /* Viewlet.invoke */ 'Viewlet.send',
       /* id */ state.id,
       /* method */ 'setTime',
@@ -17611,7 +17612,7 @@ const loadContent$2 = async (state) => {
 };
 
 const contentLoaded$2 = async (state) => {
-  await invoke$1(
+  await invoke$3(
     /* Viewlet.send */ 'Viewlet.send',
     /* id */ 'TitleBar',
     /* method */ 'menuSetEntries',
@@ -17919,19 +17920,20 @@ const ALL_ENTRIES = [
     id: 'newFile',
     label: 'New File',
     flags: /* None */ 0,
-    command: /* ViewletExplorer.newFile  */ 147,
+    command: /* Explorer.newFile  */ 'Explorer.newFile',
   },
   {
     id: 'newFolder',
     label: 'New Folder',
     flags: /* None */ 0,
-    command: /* ViewletExplorer.newFolder */ 152,
+    command: /* Explorer.newFolder */ 'Explorer.newFolder',
   },
   {
     id: 'openContainingFolder',
     label: 'Open Containing Folder',
     flags: /* None */ 0,
-    command: /*  ViewletExplorer.openContainingFolder */ 148,
+    command:
+      /*  Explorer.openContainingFolder */ 'Explorer.openContainingFolder',
   },
   {
     id: 'openInIntegratedTerminal',
@@ -17955,13 +17957,13 @@ const ALL_ENTRIES = [
     id: 'copy',
     label: 'Copy',
     flags: /* None */ 0,
-    command: /* ViewletExplorer.handleCopy */ 166,
+    command: /* Explorer.handleCopy */ 'Explorer.handleCopy',
   },
   {
     id: 'paste',
     label: 'Paste',
     flags: /* None */ 0,
-    command: /* ViewletExplorer.handlePaste */ 165,
+    command: /* Explorer.handlePaste */ 'Explorer.handlePaste',
   },
   {
     id: '',
@@ -17991,13 +17993,13 @@ const ALL_ENTRIES = [
     id: 'rename',
     label: 'Rename',
     flags: /* None */ 0,
-    command: /* ViewletExplorer.renameDirent */ 158,
+    command: /* Explorer.renameDirent */ 'Explorer.renameDirent',
   },
   {
     id: 'delete',
     label: 'Delete',
     flags: /* None */ 0,
-    command: /* ViewletExplorer.removeDirent */ 151,
+    command: /* Explorer.removeDirent */ 'Explorer.removeDirent',
   },
 ];
 
@@ -18005,12 +18007,19 @@ const isFileEntry = (entry) => {
   return entry.id !== 'newFile' && entry.id !== 'newFolder'
 };
 
-const getMenuEntries$d = async () => {
-  // TODO need a way to access state of other components synchronously
-  // TODO explorer might already be disposed (race condition)
-  const focusedDirent = await execute$1(
-    /* ViewletExplorer.getFocusedDirent */ 'ViewletExplorer.getFocusedDirent'
-  );
+// TODO there are two possible ways of getting the focused dirent of explorer
+// 1. directly access state of explorer (bad because it directly accesses state of another component)
+// 2. expose getFocusedDirent method in explorer (bad because explorer code should not know about for menuEntriesExplorer, which needs that method)
+const getFocusedDirent = () => {
+  const explorerState = getState('Explorer');
+  if (!explorerState || explorerState.focusedIndex < 0) {
+    return undefined
+  }
+  return explorerState.dirents[explorerState.focusedIndex]
+};
+
+const getMenuEntries$d = () => {
+  const focusedDirent = getFocusedDirent();
   if (!focusedDirent) {
     return ALL_ENTRIES
   }
@@ -18545,7 +18554,7 @@ const getColorThemeNames = async () => {
     const url = `${assetDir}/config/themes.json`;
     return execute$1(/* Ajax.getJson */ 'Ajax.getJson', /* url */ url)
   }
-  return invoke$2(
+  return invoke$1(
     /* ExtensionHost.getColorThemeNames */ 'ExtensionHost.getColorThemeNames'
   )
 };
@@ -19011,7 +19020,7 @@ const searchFile = async (path, value) => {
   if (getPlatform() === 'web') {
     return []
   }
-  const files = await invoke$2(
+  const files = await invoke$1(
     /* SearchFile.searchFile */ 'SearchFile.searchFile',
     /* path */ path,
     /* searchTerm */ value