@lvce-editor/server 0.0.26 → 0.0.27

package/static/{0895dce → eb65b4e}/packages/renderer-worker/dist/rendererWorkerMain.js

@@ -255,6 +255,7 @@ const getModuleId = (commandId) => {
     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
@@ -804,16 +805,16 @@ const state$A = {
   ipc: undefined,
 };
 
-const handleMessageFromRendererProcess = (event) => {
+const handleMessageFromRendererProcess = async (event) => {
   const message = event.data;
-  switch (message[0]) {
-    case 67330:
-    case 67331:
-      resolve(message[1], message[2]);
-      break
-    default:
-      execute$1(...message);
-      break
+  if (message.id) {
+    if ('result' in message) {
+      resolve(message.id, message.result);
+    } else {
+      reject(message.id, message.error);
+    }
+  } else {
+    await execute$1(...message);
   }
 };
 
@@ -877,23 +878,15 @@ const listen$1 = () => {
   state$A.ipc = ipc;
 };
 
-/**
- * @deprecated use invoke instead
- * @param {*} message
- */
-const send$3 = (message) => {
-  state$A.ipc.send(message);
-};
-
 const invoke$3 = async (method, ...params) => {
   const responseMessage = await new Promise((resolve, reject) => {
     const callbackId = register$1(resolve, reject);
-    state$A.ipc.send([
-      /* RendererWorker.invoke */ 909090,
-      /* callbackId */ callbackId,
-      /* method */ method,
-      /* params */ ...params,
-    ]);
+    state$A.ipc.send({
+      jsonrpc: '2.0',
+      method,
+      params,
+      id: callbackId,
+    });
   });
   if (responseMessage instanceof Error) {
     throw responseMessage
@@ -1072,7 +1065,7 @@ const state$y = {
     // @ts-ignore
     {
       // @ts-ignore
-      return '/0895dce'
+      return '/eb65b4e'
     }
   },
   isMobileOrTablet() {
@@ -2085,7 +2078,6 @@ const ensureExtensionHostIsStarted = async () => {
 };
 
 const activateByEvent = async (event) => {
-  console.log('activate by event', event);
   if (!hasLoaded()) {
     await waitForLoad();
   }
@@ -2095,7 +2087,6 @@ const activateByEvent = async (event) => {
   // TODO should not query extensions multiple times
   const extensions = await getExtensions$1();
 
-  console.log({ extensions });
   // TODO if many (more than two?) extensions cannot be loaded,
   // it shouldn't should that many error messages
   for (const extension of extensions) {
@@ -3251,10 +3242,10 @@ const wrapViewletCommand = (id, fn) => {
         return
       }
       const commands = activeInstance.factory.render(oldState, newState);
-      send$3([
+      invoke$3(
         /* Viewlet.sendMultiple */ 'Viewlet.sendMultiple',
-        /* commands */ commands,
-      ]);
+        /* commands */ commands
+      );
       state$m.instances[id].state = newState;
     } else {
       return fn(activeInstance.state, ...args)
@@ -3285,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$3([
-      /* Viewlet.sendMultiple */ 'Viewlet.sendMultiple',
-      /* commands */ commands,
-    ]);
     instance.state = newState;
+    await invoke$3(
+      /* Viewlet.sendMultiple */ 'Viewlet.sendMultiple',
+      /* commands */ commands
+    );
   }
 };
 
@@ -3462,9 +3453,10 @@ const load = async (viewlet, focus = false) => {
 
     if (module.hasFunctionalRender) {
       const commands = module.render(viewletState, newState);
-      for (const command of commands) {
-        send$3(command);
-      }
+      invoke$3(
+        /* Viewlet.sendMultiple */ 'Viewlet.sendMultiple',
+        /* commands */ commands
+      );
     }
 
     if (module.contentLoadedEffects) {
@@ -4707,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
@@ -4736,7 +4728,7 @@ const render$d = (oldState, newState) => {
   return changes
 };
 
-const hasFunctionalRender$c = true;
+const hasFunctionalRender$d = true;
 
 var ViewletActivityBar = {
   __proto__: null,
@@ -4762,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
@@ -4953,14 +4945,14 @@ const contentLoaded$m = async (state) => {
   );
   const tabLabel = pathBaseName(editor.uri);
   const tabTitle = getTabTitle(editor.uri);
-  send$3([
+  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);
 };
@@ -5058,11 +5050,11 @@ const closeActiveEditor = (state) => {
 };
 
 const closeAllEditors = (state) => {
-  send$3([
+  invoke$3(
     /* Viewlet.send */ 'Viewlet.send',
     /* id */ 'Main',
-    /* method */ 'dispose',
-  ]);
+    /* method */ 'dispose'
+  );
   state.editors = [];
   state.focusedIndex = -1;
   state.selectedIndex = -1;
@@ -5158,13 +5150,13 @@ const focusIndex$8 = (state, index) => {
   );
 
   // TODO race condition
-  send$3([
+  invoke$3(
     /* Viewlet.send */ 'Viewlet.send',
     /* id */ 'Main',
     /* method */ 'focusAnotherTab',
     /* unFocusIndex */ oldActiveIndex,
-    /* focusIndex */ state.activeIndex,
-  ]);
+    /* focusIndex */ state.activeIndex
+  );
   return load(viewlet)
 };
 
@@ -5500,7 +5492,7 @@ const showSubMenuAtEnter = async (level, index, enterX, enterY) => {
   });
   const width = getMenuWidth();
   const height = getMenuHeight(subMenuItems);
-  send$3([
+  invoke$3(
     /* Menu.showMenu */ 'Menu.showMenu',
     /* x */ subMenu.x,
     /* y */ subMenu.y,
@@ -5508,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) => {
@@ -6023,7 +6015,7 @@ const dispose$l = () => {
   }
 };
 
-const handleBlur$1 = async () => {
+const handleBlur$2 = async () => {
   switch (state$h.state) {
     case STATE_DEFAULT:
     case STATE_CREATING:
@@ -6094,13 +6086,13 @@ const handleInput$2 = async (value) => {
   const filterValue = state$h.provider.getFilterValue(value);
   const visiblePicks = getVisiblePicks(newPicks, filterValue);
 
-  send$3([
+  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;
@@ -6296,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);
 };
 
@@ -6382,13 +6374,13 @@ const tabsHandleClick = async (state, index) => {
   const oldSelectedIndex = state.selectedIndex;
 
   state.selectedIndex = index;
-  send$3([
+  invoke$3(
     /* Viewlet.send */ 'Viewlet.send',
     /* id */ 'Panel',
     /* method */ 'selectTab',
     /* oldSelectedIndex */ oldSelectedIndex,
-    /* newSelectedIndex */ index,
-  ]);
+    /* newSelectedIndex */ index
+  );
 };
 
 var ViewletPanel = {
@@ -6434,10 +6426,10 @@ const create$n = ({ getText }) => {
     // textContent: '',
     getText,
   };
-  send$3([
+  invoke$3(
     /* FindWidget.create */ 4100,
-    /* id */ state$f.activeWidget.id,
-  ]);
+    /* id */ state$f.activeWidget.id
+  );
 };
 
 const update = async (widget) => {
@@ -6448,11 +6440,11 @@ const update = async (widget) => {
       results.push(i);
     }
   }
-  send$3([
+  invoke$3(
     /* findWidgetSetResults */ 4103,
     /* id */ widget.id,
-    /* results */ results,
-  ]);
+    /* results */ results
+  );
 };
 
 const setValue$1 = async (value) => {
@@ -6468,10 +6460,10 @@ const dispose$j = () => {
   if (!state$f.activeWidget) {
     return
   }
-  send$3([
+  invoke$3(
     /* FindWidget.dispose */ 4102,
-    /* id */ state$f.activeWidget.id,
-  ]);
+    /* id */ state$f.activeWidget.id
+  );
   state$f.activeWidget = undefined;
 };
 
@@ -8228,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 ||
@@ -8345,7 +8337,7 @@ const y = (editor, position) => {
   return y
 };
 
-const handleBlur = () => {
+const handleBlur$1 = () => {
   close$3();
 };
 
@@ -8409,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$3([
+  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) => {
@@ -8537,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');
@@ -11688,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 }) => {
@@ -11721,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();
   });
 };
 
@@ -11744,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$3(
-    /* 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) => {
@@ -11789,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
@@ -11815,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;
@@ -11836,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) => {
@@ -12016,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;
@@ -12066,11 +12063,12 @@ const newDirent = async (state) => {
     /* 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) => {
@@ -12082,14 +12080,15 @@ const cancelDirent = async (state) => {
     /* 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
@@ -12111,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);
@@ -12136,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,
@@ -12155,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) {
@@ -12178,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) => {
@@ -12203,21 +12206,31 @@ 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) => {
@@ -12230,100 +12243,95 @@ const handleClickDirectoryExpanding = async (state, dirent, index) => {
     /* 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];
-  console.log('click', index);
   // 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$3(
-    /* viewSend */ 'Viewlet.send',
-    /* id */ 'Explorer',
-    /* method */ 'setFocusedIndex',
-    /* oldIndex */ oldFocusedIndex,
-    /* newIndex */ state.focusedIndex
-  );
+const handleClickCurrent = (state) => {
+  return handleClick$5(state, state.focusedIndex)
 };
 
-const focusNext$4 = async (state) => {
+const focusIndex$5 = (state, index) => {
+  return {
+    ...state,
+    focusedIndex: index,
+  }
+};
+
+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 = () => {};
@@ -12333,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)
   }
 };
 
@@ -12437,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;
@@ -12453,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) => {
@@ -12464,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
@@ -12551,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) => {
@@ -12589,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 = {
@@ -12606,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,
@@ -12621,6 +12680,7 @@ var ViewletExplorer = {
   acceptNewFolder: acceptNewFolder,
   newFolder: newFolder,
   handleClick: handleClick$5,
+  focusNone: focusNone,
   handleClickCurrent: handleClickCurrent,
   focusIndex: focusIndex$5,
   focusNext: focusNext$4,
@@ -12639,7 +12699,10 @@ var ViewletExplorer = {
   handlePaste: handlePaste,
   resize: resize$9,
   expandAll: expandAll,
-  collapseAll: collapseAll
+  collapseAll: collapseAll,
+  handleBlur: handleBlur,
+  hasFunctionalRender: hasFunctionalRender$c,
+  render: render$c
 };
 
 // prettier-ignore
@@ -12656,10 +12719,12 @@ const __initialize__$G = () => {
   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));
+  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));
@@ -14255,7 +14320,7 @@ const openMenuAtIndex = async (index, shouldBeFocused) => {
     x,
     y,
   });
-  send$3([
+  invoke$3(
     /* Viewlet.send */ 'Viewlet.send',
     /* id */ 'TitleBar',
     /* method */ 'menuOpen',
@@ -14268,8 +14333,8 @@ const openMenuAtIndex = async (index, shouldBeFocused) => {
     /* x */ x,
     /* y */ y,
     /* width */ width,
-    /* height */ height,
-  ]);
+    /* height */ height
+  );
   state$6.isMenuOpen = true;
 };
 
@@ -14618,7 +14683,7 @@ var Navigation_ipc = {
   __initialize__: __initialize__$t
 };
 
-const CACHE_NAME = 'lvce-runtime-0895dce';
+const CACHE_NAME = 'lvce-runtime-eb65b4e';
 
 const shouldIgnoreError = (error) => {
   // Firefox throws dom exception in private mode
@@ -17367,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 = {
@@ -17942,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(
-    /* Explorer.getFocusedDirent */ 'Explorer.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
   }