@lvce-editor/explorer-view 3.19.0 → 3.21.0

package/dist/explorerViewWorkerMain.js

@@ -1173,6 +1173,7 @@ const RendererWorker$1 = 1;
 const FocusElementByName = 'Viewlet.focusElementByName';
 const FocusSelector = 'Viewlet.focusSelector';
 const SetCss = 'Viewlet.setCss';
+const SetDom2 = 'Viewlet.setDom2';
 const SetFocusContext = 'Viewlet.setFocusContext';
 
 const FocusExplorer = 13;
@@ -1372,7 +1373,7 @@ const getWebViewSecret = async key => {
 const setWebViewPort = async (uid, port, origin, portType) => {
   return invokeAndTransfer('WebView.setPort', uid, port, origin, portType);
 };
-const setFocus$1 = key => {
+const setFocus = key => {
   return invoke$2('Focus.setFocus', key);
 };
 const getFileIcon = async options => {
@@ -1632,7 +1633,7 @@ const RendererWorker = {
   setAdditionalFocus,
   setColorTheme,
   setExtensionsSearchValue,
-  setFocus: setFocus$1,
+  setFocus,
   setWebViewPort,
   setWorkspacePath,
   showContextMenu: showContextMenu$1,
@@ -1798,94 +1799,6 @@ const Rename$1 = 3;
 const List = 1;
 const Input$1 = 2;
 
-// TODO optimize this function to return the minimum number
-// of visible items needed, e.g. when not scrolled 5 items with
-// 20px fill 100px but when scrolled 6 items are needed
-const getNumberOfVisibleItems = (listHeight, itemHeight) => {
-  return Math.ceil(listHeight / itemHeight) + 1;
-};
-
-const getExplorerMaxLineY = (minLineY, height, itemHeight, direntsLength) => {
-  const maxLineY = minLineY + Math.min(getNumberOfVisibleItems(height, itemHeight), direntsLength);
-  return maxLineY;
-};
-
-const getIconsCached = (dirents, fileIconCache) => {
-  return dirents.map(dirent => fileIconCache[dirent]);
-};
-
-const getMissingIconRequests = (dirents, fileIconCache) => {
-  const missingRequests = [];
-  for (const dirent of dirents) {
-    if (!(dirent.path in fileIconCache)) {
-      missingRequests.push({
-        type: dirent.type,
-        name: dirent.name,
-        path: dirent.path
-      });
-    }
-  }
-  return missingRequests;
-};
-
-const getPath = item => {
-  return item.path;
-};
-
-const getPaths = items => {
-  return items.map(getPath);
-};
-
-const getSimpleIconRequestType = direntType => {
-  if (direntType === Directory || direntType === DirectoryExpanded || direntType === EditingDirectoryExpanded || direntType === EditingFolder) {
-    return 2;
-  }
-  return 1;
-};
-
-const toSimpleIconRequest = request => {
-  return {
-    name: request.name,
-    type: getSimpleIconRequestType(request.type)
-  };
-};
-
-const requestFileIcons = async requests => {
-  if (requests.length === 0) {
-    return [];
-  }
-  const simpleRequests = requests.map(toSimpleIconRequest);
-  const icons = await invoke$1('IconTheme.getIcons', simpleRequests);
-  return icons;
-};
-
-const updateIconCache = (iconCache, missingRequests, newIcons) => {
-  if (missingRequests.length === 0) {
-    return iconCache;
-  }
-  const newFileIconCache = {
-    ...iconCache
-  };
-  for (let i = 0; i < missingRequests.length; i++) {
-    const request = missingRequests[i];
-    const icon = newIcons[i];
-    newFileIconCache[request.path] = icon;
-  }
-  return newFileIconCache;
-};
-
-const getFileIcons = async (dirents, fileIconCache) => {
-  const missingRequests = getMissingIconRequests(dirents, fileIconCache);
-  const newIcons = await requestFileIcons(missingRequests);
-  const newFileIconCache = updateIconCache(fileIconCache, missingRequests, newIcons);
-  const paths = getPaths(dirents);
-  const icons = getIconsCached(paths, newFileIconCache);
-  return {
-    icons,
-    newFileIconCache
-  };
-};
-
 const getFileOperationsNestedPath = (path, root, pathSeparator) => {
   const parts = path.slice(root.length).split(pathSeparator);
   const operations = [];
@@ -2297,10 +2210,6 @@ const validateFileName2 = name => {
 const acceptCreate = async (state, newDirentType) => {
   const {
     editingValue,
-    minLineY,
-    height,
-    itemHeight,
-    fileIconCache,
     pathSeparator,
     root,
     focusedIndex,
@@ -2332,22 +2241,13 @@ const acceptCreate = async (state, newDirentType) => {
   const newItems = treeToArray(merged, root);
   const dirents = newItems;
   const newFocusedIndex = getIndex(newItems, absolutePath);
-  const maxLineY = getExplorerMaxLineY(minLineY, height, itemHeight, dirents.length);
-  const visible = dirents.slice(minLineY, maxLineY);
-  const {
-    icons,
-    newFileIconCache
-  } = await getFileIcons(visible, fileIconCache);
   return {
     ...state,
     items: dirents,
     editingIndex: -1,
     focusedIndex: newFocusedIndex,
     editingType: None$5,
-    maxLineY,
-    focus: List,
-    icons,
-    fileIconCache: newFileIconCache
+    focus: List
   };
 };
 
@@ -2402,11 +2302,7 @@ const acceptRename = async state => {
     editingIndex,
     editingValue,
     items,
-    root,
-    minLineY,
-    height,
-    itemHeight,
-    fileIconCache
+    root
   } = state;
   const editingErrorMessage = validateFileName2(editingValue);
   if (editingErrorMessage) {
@@ -2433,12 +2329,6 @@ const acceptRename = async state => {
   const newTree = updateTree2(tree, update);
   const newDirents = treeToArray(newTree, root);
   const newFocusedIndex = getIndex(newDirents, newUri);
-  const maxLineY = getExplorerMaxLineY(minLineY, height, itemHeight, newDirents.length);
-  const visible = newDirents.slice(minLineY, maxLineY);
-  const {
-    icons,
-    newFileIconCache
-  } = await getFileIcons(visible, fileIconCache);
   return {
     ...state,
     editingIndex: -1,
@@ -2449,8 +2339,6 @@ const acceptRename = async state => {
     focused: true,
     focus: List,
     items: newDirents,
-    icons,
-    fileIconCache: newFileIconCache,
     editingSelectionEnd: 0,
     editingSelectionStart: 0
   };
@@ -2479,14 +2367,9 @@ const isNormalItem = item => {
 const cancelEditCreate = async (state, keepFocus) => {
   const {
     editingIndex,
-    items,
-    fileIconCache
+    items
   } = state;
   const filteredItems = items.filter(isNormalItem);
-  const {
-    icons,
-    newFileIconCache
-  } = await getFileIcons(filteredItems, fileIconCache);
   return {
     ...state,
     items: filteredItems,
@@ -2496,9 +2379,7 @@ const cancelEditCreate = async (state, keepFocus) => {
     editingValue: '',
     editingErrorMessage: '',
     editingType: None$5,
-    focus: List,
-    icons,
-    fileIconCache: newFileIconCache
+    focus: List
   };
 };
 
@@ -2573,25 +2454,12 @@ const toCollapsedDirent = dirent => {
 
 const collapseAll = async state => {
   const {
-    minLineY,
-    height,
-    itemHeight,
-    fileIconCache,
     items
   } = state;
   const newDirents = items.filter(isTopLevel).map(toCollapsedDirent);
-  const dirents = newDirents;
-  const maxLineY = getExplorerMaxLineY(minLineY, height, itemHeight, dirents.length);
-  const visible = dirents.slice(minLineY, maxLineY);
-  const {
-    icons,
-    newFileIconCache
-  } = await getFileIcons(visible, fileIconCache);
   return {
     ...state,
-    items: newDirents,
-    icons,
-    fileIconCache: newFileIconCache
+    items: newDirents
   };
 };
 
@@ -2641,6 +2509,94 @@ const copyRelativePath = async state => {
   return state;
 };
 
+// TODO optimize this function to return the minimum number
+// of visible items needed, e.g. when not scrolled 5 items with
+// 20px fill 100px but when scrolled 6 items are needed
+const getNumberOfVisibleItems = (listHeight, itemHeight) => {
+  return Math.ceil(listHeight / itemHeight) + 1;
+};
+
+const getExplorerMaxLineY = (minLineY, height, itemHeight, direntsLength) => {
+  const maxLineY = minLineY + Math.min(getNumberOfVisibleItems(height, itemHeight), direntsLength);
+  return maxLineY;
+};
+
+const getIconsCached = (dirents, fileIconCache) => {
+  return dirents.map(dirent => fileIconCache[dirent]);
+};
+
+const getMissingIconRequests = (dirents, fileIconCache) => {
+  const missingRequests = [];
+  for (const dirent of dirents) {
+    if (!(dirent.path in fileIconCache)) {
+      missingRequests.push({
+        type: dirent.type,
+        name: dirent.name,
+        path: dirent.path
+      });
+    }
+  }
+  return missingRequests;
+};
+
+const getPath = item => {
+  return item.path;
+};
+
+const getPaths = items => {
+  return items.map(getPath);
+};
+
+const getSimpleIconRequestType = direntType => {
+  if (direntType === Directory || direntType === DirectoryExpanded || direntType === EditingDirectoryExpanded || direntType === EditingFolder) {
+    return 2;
+  }
+  return 1;
+};
+
+const toSimpleIconRequest = request => {
+  return {
+    name: request.name,
+    type: getSimpleIconRequestType(request.type)
+  };
+};
+
+const requestFileIcons = async requests => {
+  if (requests.length === 0) {
+    return [];
+  }
+  const simpleRequests = requests.map(toSimpleIconRequest);
+  const icons = await invoke$1('IconTheme.getIcons', simpleRequests);
+  return icons;
+};
+
+const updateIconCache = (iconCache, missingRequests, newIcons) => {
+  if (missingRequests.length === 0) {
+    return iconCache;
+  }
+  const newFileIconCache = {
+    ...iconCache
+  };
+  for (let i = 0; i < missingRequests.length; i++) {
+    const request = missingRequests[i];
+    const icon = newIcons[i];
+    newFileIconCache[request.path] = icon;
+  }
+  return newFileIconCache;
+};
+
+const getFileIcons = async (dirents, fileIconCache) => {
+  const missingRequests = getMissingIconRequests(dirents, fileIconCache);
+  const newIcons = await requestFileIcons(missingRequests);
+  const newFileIconCache = updateIconCache(fileIconCache, missingRequests, newIcons);
+  const paths = getPaths(dirents);
+  const icons = getIconsCached(paths, newFileIconCache);
+  return {
+    icons,
+    newFileIconCache
+  };
+};
+
 const None$4 = 0;
 const Right = 1;
 const Down = 2;
@@ -2821,11 +2777,57 @@ const getVisibleExplorerItems = (items, minLineY, maxLineY, focusedIndex, editin
 const {
   get,
   set,
-  wrapCommand,
   registerCommands,
   getCommandIds,
   wrapGetter
 } = create$2();
+const wrapListItemCommand = fn => {
+  const wrappedCommand = async (id, ...args) => {
+    const {
+      newState
+    } = get(id);
+    const updatedState = await fn(newState, ...args);
+    const {
+      items,
+      minLineY,
+      focusedIndex,
+      editingIndex,
+      editingType,
+      editingValue,
+      editingErrorMessage,
+      useChevrons,
+      dropTargets,
+      editingIcon,
+      cutItems,
+      sourceControlIgnoredUris,
+      height,
+      itemHeight,
+      fileIconCache
+    } = updatedState;
+    const intermediate = get(id);
+    set(id, intermediate.oldState, updatedState);
+    const maxLineY = getExplorerMaxLineY(minLineY, height, itemHeight, items.length);
+    if (items === intermediate.newState.items && minLineY === intermediate.newState.minLineY && editingIcon === intermediate.newState.editingIcon && cutItems === intermediate.newState.cutItems && editingErrorMessage === intermediate.newState.editingErrorMessage) {
+      return;
+    }
+    const visible = items.slice(minLineY, maxLineY);
+    const {
+      icons,
+      newFileIconCache
+    } = await getFileIcons(visible, fileIconCache);
+    const visibleExplorerItems = getVisibleExplorerItems(items, minLineY, maxLineY, focusedIndex, editingIndex, editingType, editingValue, editingErrorMessage, icons, useChevrons, dropTargets, editingIcon, cutItems, sourceControlIgnoredUris);
+    const finalState = {
+      ...updatedState,
+      visibleExplorerItems,
+      fileIconCache: newFileIconCache,
+      icons,
+      maxLineY
+    };
+    const intermediate2 = get(id);
+    set(id, intermediate2.oldState, finalState);
+  };
+  return wrappedCommand;
+};
 
 const ListItem = 22;
 
@@ -3006,10 +3008,7 @@ const expandAll = async state => {
   const {
     items,
     focusedIndex,
-    pathSeparator,
-    minLineY,
-    height,
-    itemHeight
+    pathSeparator
   } = state;
   if (focusedIndex === -1) {
     return state;
@@ -3040,18 +3039,9 @@ const expandAll = async state => {
       // await expand(state, dirent.index)
     }
   }
-  const maxLineY = getExplorerMaxLineY(minLineY, height, itemHeight, newDirents.length);
-  const visible = newDirents.slice(minLineY, maxLineY);
-  const {
-    icons,
-    newFileIconCache
-  } = await getFileIcons(visible, state.fileIconCache);
   return {
     ...state,
-    items: newDirents,
-    icons,
-    fileIconCache: newFileIconCache,
-    maxLineY
+    items: newDirents
   };
 };
 
@@ -3099,10 +3089,7 @@ const expandRecursively = async state => {
     items,
     focusedIndex,
     pathSeparator,
-    root,
-    height,
-    itemHeight,
-    minLineY
+    root
   } = state;
   const dirent = focusedIndex < 0 ? {
     type: Directory,
@@ -3121,33 +3108,15 @@ const expandRecursively = async state => {
   if (focusedIndex >= 0) {
     const endIndex = getParentEndIndex(items, focusedIndex);
     const newDirents = [...items.slice(0, startIndex), ...childDirents, ...items.slice(endIndex)];
-    const maxLineY = getExplorerMaxLineY(minLineY, height, itemHeight, newDirents.length);
-    const visible = newDirents.slice(minLineY, maxLineY);
-    const {
-      icons,
-      newFileIconCache
-    } = await getFileIcons(visible, state.fileIconCache);
     return {
       ...state,
-      items: newDirents,
-      maxLineY,
-      icons,
-      fileIconCache: newFileIconCache
+      items: newDirents
     };
   }
   const newDirents = childDirents.slice(1);
-  const maxLineY = getExplorerMaxLineY(minLineY, height, itemHeight, newDirents.length);
-  const visible = newDirents.slice(minLineY, maxLineY);
-  const {
-    icons,
-    newFileIconCache
-  } = await getFileIcons(visible, state.fileIconCache);
   return {
     ...state,
-    items: newDirents,
-    maxLineY,
-    icons,
-    fileIconCache: newFileIconCache
+    items: newDirents
   };
 };
 
@@ -3551,17 +3520,6 @@ const handleClickDirectoryExpanded = async (state, dirent, index, keepFocus) =>
     minLineY,
     maxLineY,
     itemHeight,
-    fileIconCache,
-    cutItems,
-    sourceControlIgnoredUris,
-    dropTargets,
-    editingErrorMessage,
-    editingIcon,
-    editingIndex,
-    editingType,
-    editingValue,
-    focusedIndex,
-    useChevrons,
     items
   } = state;
   // @ts-ignore
@@ -3579,39 +3537,21 @@ const handleClickDirectoryExpanded = async (state, dirent, index, keepFocus) =>
     const newMaxLineY = Math.min(maxLineY, newTotal);
     const newMinLineY = newMaxLineY - visibleItems;
     const deltaY = newMinLineY * itemHeight;
-    const parts = newDirents.slice(newMinLineY, newMaxLineY);
-    const {
-      icons,
-      newFileIconCache
-    } = await getFileIcons(parts, fileIconCache);
-    const visibleExplorerItems = getVisibleExplorerItems(newDirents, minLineY, maxLineY, focusedIndex, editingIndex, editingType, editingValue, editingErrorMessage, icons, useChevrons, dropTargets, editingIcon, cutItems, sourceControlIgnoredUris);
     return {
       ...state,
       deltaY,
-      fileIconCache: newFileIconCache,
       focused: keepFocus,
       focusedIndex: index,
-      icons,
       items: newDirents,
       maxLineY: newMaxLineY,
-      minLineY: newMinLineY,
-      visibleExplorerItems
+      minLineY: newMinLineY
     };
   }
-  const parts = newDirents.slice(minLineY, maxLineY);
-  const {
-    icons,
-    newFileIconCache
-  } = await getFileIcons(parts, fileIconCache);
-  const visibleExplorerItems = getVisibleExplorerItems(newDirents, minLineY, maxLineY, focusedIndex, editingIndex, editingType, editingValue, editingErrorMessage, icons, useChevrons, dropTargets, editingIcon, cutItems, sourceControlIgnoredUris);
   return {
     ...state,
-    fileIconCache: newFileIconCache,
     focused: keepFocus,
     focusedIndex: index,
-    icons,
-    items: newDirents,
-    visibleExplorerItems
+    items: newDirents
   };
 };
 
@@ -3652,23 +3592,7 @@ const handleArrowRightDirectoryExpanded = (state, dirent) => {
   return state;
 };
 
-const setFocus = key => {
-  return invoke$1('Focus.setFocus', key);
-};
-
 const handleClickDirectory = async (state, dirent, index, keepFocus) => {
-  const {
-    cutItems,
-    sourceControlIgnoredUris,
-    dropTargets,
-    editingErrorMessage,
-    editingIcon,
-    editingIndex,
-    editingType,
-    editingValue,
-    focusedIndex,
-    useChevrons
-  } = state;
   // @ts-ignore
   dirent.type = DirectoryExpanding;
   // TODO handle error
@@ -3689,31 +3613,14 @@ const handleClickDirectory = async (state, dirent, index, keepFocus) => {
   dirent.type = DirectoryExpanded;
   // @ts-ignore
   dirent.icon = '';
-  const {
-    height,
-    itemHeight,
-    minLineY
-  } = state2;
   // TODO when focused index has changed while expanding, don't update it
-  const maxLineY = getExplorerMaxLineY(minLineY, height, itemHeight, newDirents.length);
-  const parts = newDirents.slice(minLineY, maxLineY);
-  const {
-    icons,
-    newFileIconCache
-  } = await getFileIcons(parts, state.fileIconCache);
-  const visibleExplorerItems = getVisibleExplorerItems(newDirents, minLineY, maxLineY, focusedIndex, editingIndex, editingType, editingValue, editingErrorMessage, icons, useChevrons, dropTargets, editingIcon, cutItems, sourceControlIgnoredUris);
 
-  // TODO use functional focus rendering
-  await setFocus(FocusExplorer);
   return {
     ...state,
-    fileIconCache: newFileIconCache,
     focused: keepFocus,
     focusedIndex: newIndex,
-    icons,
     items: newDirents,
-    maxLineY,
-    visibleExplorerItems
+    focus: List
   };
 };
 
@@ -4266,21 +4173,8 @@ const sortPathDirentsMap = map => {
 const refresh = async state => {
   const {
     root,
-    minLineY,
-    height,
-    itemHeight,
-    fileIconCache,
-    cutItems,
-    sourceControlIgnoredUris,
-    dropTargets,
-    editingErrorMessage,
-    editingIcon,
-    editingIndex,
-    editingType,
-    editingValue,
     focusedIndex,
-    items,
-    useChevrons
+    items
   } = state;
   const expandedDirents = getExpandedDirents(items);
   const expandedPaths = getPaths(expandedDirents);
@@ -4288,25 +4182,14 @@ const refresh = async state => {
   const pathToDirents = await getPathDirentsMap(allPaths);
   const sortedPathDirents = sortPathDirentsMap(pathToDirents);
   const newItems = getProtoMap(root, sortedPathDirents, expandedPaths);
-  const maxLineY = getExplorerMaxLineY(minLineY, height, itemHeight, newItems.length);
-  const visible = newItems.slice(minLineY, maxLineY);
-  const {
-    icons,
-    newFileIconCache
-  } = await getFileIcons(visible, fileIconCache);
   let newFocusedIndex = focusedIndex;
   if (focusedIndex >= newItems.length) {
     newFocusedIndex = newItems.length - 1;
   }
-  const visibleExplorerItems = getVisibleExplorerItems(items, minLineY, maxLineY, focusedIndex, editingIndex, editingType, editingValue, editingErrorMessage, icons, useChevrons, dropTargets, editingIcon, cutItems, sourceControlIgnoredUris);
   return {
     ...state,
-    fileIconCache: newFileIconCache,
     focusedIndex: newFocusedIndex,
-    icons,
-    items: newItems,
-    maxLineY,
-    visibleExplorerItems
+    items: newItems
   };
 };
 
@@ -4604,8 +4487,10 @@ const handleEscape = async state => {
 };
 
 const handleFocus = async state => {
-  await setFocus(FocusExplorer);
-  return state;
+  return {
+    ...state,
+    focus: List
+  };
 };
 
 const updateIcons = async state => {
@@ -4954,9 +4839,8 @@ const handlePaste = async state => {
   // Use the pasteShouldMove flag to determine whether to cut or copy
   if (state.pasteShouldMove) {
     return handlePasteCut(state, nativeFiles);
-  } else {
-    return handlePasteCopy(state, nativeFiles);
   }
+  return handlePasteCopy(state, nativeFiles);
 };
 
 const handlePointerDown = (state, button, x, y) => {
@@ -4994,17 +4878,7 @@ const handleUpload = async (state, dirents) => {
 const setDeltaY = async (state, deltaY) => {
   const {
     itemHeight,
-    useChevrons,
     height,
-    cutItems,
-    sourceControlIgnoredUris,
-    dropTargets,
-    editingErrorMessage,
-    editingIcon,
-    editingIndex,
-    editingType,
-    editingValue,
-    focusedIndex,
     items
   } = state;
   if (deltaY < 0) {
@@ -5017,20 +4891,11 @@ const setDeltaY = async (state, deltaY) => {
   }
   const minLineY = Math.round(deltaY / itemHeight);
   const maxLineY = minLineY + Math.round(height / itemHeight);
-  const visible = items.slice(minLineY, maxLineY);
-  const {
-    icons,
-    newFileIconCache
-  } = await getFileIcons(visible, state.fileIconCache);
-  const visibleExplorerItems = getVisibleExplorerItems(items, minLineY, maxLineY, focusedIndex, editingIndex, editingType, editingValue, editingErrorMessage, icons, useChevrons, dropTargets, editingIcon, cutItems, sourceControlIgnoredUris);
   return {
     ...state,
     deltaY,
-    fileIconCache: newFileIconCache,
-    icons,
     maxLineY,
-    minLineY,
-    visibleExplorerItems
+    minLineY
   };
 };
 
@@ -5176,18 +5041,6 @@ const getSavedRoot = (savedState, workspacePath) => {
   return workspacePath;
 };
 const loadContent = async (state, savedState) => {
-  const {
-    fileIconCache,
-    cutItems,
-    sourceControlIgnoredUris,
-    dropTargets,
-    editingErrorMessage,
-    editingIcon,
-    editingIndex,
-    editingType,
-    editingValue,
-    focusedIndex
-  } = state;
   const {
     useChevrons,
     confirmDelete
@@ -5198,10 +5051,6 @@ const loadContent = async (state, savedState) => {
   const pathSeparator = await getPathSeparator(root); // TODO only load path separator once
   const excluded = getExcluded();
   const restoredDirents = await restoreExpandedState(savedState, root, pathSeparator, excluded);
-  const {
-    itemHeight,
-    height
-  } = state;
   let minLineY = 0;
   if (savedState && typeof savedState.minLineY === 'number') {
     minLineY = savedState.minLineY;
@@ -5210,28 +5059,17 @@ const loadContent = async (state, savedState) => {
   if (savedState && typeof savedState.deltaY === 'number') {
     deltaY = savedState.deltaY;
   }
-  const maxLineY = getExplorerMaxLineY(minLineY, height, itemHeight, restoredDirents.length);
-  const visible = restoredDirents.slice(minLineY, maxLineY);
-  const {
-    icons,
-    newFileIconCache
-  } = await getFileIcons(visible, fileIconCache);
-  const visibleExplorerItems = getVisibleExplorerItems(restoredDirents, minLineY, maxLineY, focusedIndex, editingIndex, editingType, editingValue, editingErrorMessage, icons, useChevrons, dropTargets, editingIcon, cutItems, sourceControlIgnoredUris);
   return {
     ...state,
     confirmDelete,
     deltaY,
     excluded,
-    fileIconCache: newFileIconCache,
-    icons,
     items: restoredDirents,
     maxIndent: 10,
-    maxLineY,
     minLineY,
     pathSeparator,
     root,
-    useChevrons,
-    visibleExplorerItems
+    useChevrons
   };
 };
 
@@ -5270,8 +5108,6 @@ const initialize = async () => {
   await initializeFileSystemWorker();
 };
 
-const ExplorerEditBox = FocusExplorerEditBox;
-
 const getNewChildDirentsForNewDirent = async (items, depth, parentPath, direntType) => {
   // Get existing children or query them if they don't exist
   let existingChildren = items.filter(item => item.depth === depth && item.path.startsWith(parentPath));
@@ -5364,48 +5200,24 @@ const getFittingIndex = (dirents, startIndex) => {
   return -1;
 };
 const newDirent = async (state, editingType) => {
-  // TODO make focus functional instead of side effect
-  await setFocus(ExplorerEditBox);
   // TODO do it like vscode, select position between folders and files
   const {
-    minLineY,
-    height,
-    itemHeight,
     root,
-    fileIconCache,
-    cutItems,
-    sourceControlIgnoredUris,
-    dropTargets,
-    editingErrorMessage,
-    editingIcon,
-    editingValue,
     focusedIndex,
-    items,
-    useChevrons
+    items
   } = state;
   const index = getFittingIndex(items, focusedIndex);
   const direntType = getNewDirentType(editingType);
   const newDirents = await getNewDirentsForNewDirent(items, index, direntType, root);
-  const maxLineY = getExplorerMaxLineY(minLineY, height, itemHeight, newDirents.length);
-  const visible = newDirents.slice(minLineY, maxLineY);
-  const {
-    icons,
-    newFileIconCache
-  } = await getFileIcons(visible, fileIconCache);
   const editingIndex = newDirents.findIndex(item => item.type === EditingFile || item.type === EditingFolder);
-  const visibleExplorerItems = getVisibleExplorerItems(items, minLineY, maxLineY, focusedIndex, editingIndex, editingType, editingValue, editingErrorMessage, icons, useChevrons, dropTargets, editingIcon, cutItems, sourceControlIgnoredUris);
   return {
     ...state,
     editingIndex,
     editingType,
     editingValue: '',
-    fileIconCache: newFileIconCache,
     focus: Input$1,
     focusedIndex: editingIndex,
-    icons,
-    items: newDirents,
-    maxLineY,
-    visibleExplorerItems
+    items: newDirents
   };
 };
 
@@ -5524,7 +5336,7 @@ const getRenameSelectionRange = name => {
 const User = 1;
 const Script = 2;
 
-const renameDirent = state => {
+const renameDirent = async state => {
   const {
     focusedIndex,
     items,
@@ -5932,28 +5744,19 @@ const getExplorerVirtualDom = (visibleItems, focusedIndex, root, isWide, focused
 
 const renderItems = (oldState, newState) => {
   const {
-    cutItems,
-    sourceControlIgnoredUris,
     deltaY,
     dropTargets,
     editingErrorMessage,
-    editingIcon,
-    editingIndex,
-    editingType,
-    editingValue,
     focused,
     focusedIndex,
     height,
-    icons,
     itemHeight,
     items,
-    maxLineY,
     minLineY,
     root,
-    useChevrons,
     width
   } = newState;
-  const visibleDirents = getVisibleExplorerItems(items, minLineY, maxLineY, focusedIndex, editingIndex, editingType, editingValue, editingErrorMessage, icons, useChevrons, dropTargets, editingIcon, cutItems, sourceControlIgnoredUris);
+  const visibleDirents = newState.visibleExplorerItems;
   const isWide = width > 450;
   const contentHeight = items.length * itemHeight;
   const depth = items[focusedIndex]?.depth || 0;
@@ -5967,7 +5770,7 @@ const renderItems = (oldState, newState) => {
     left
   } = getErrorMessagePosition(itemHeight, focusedIndex, minLineY, depth, indent, fileIconWidth, padding + defaultPaddingLeft + chevronSpace);
   const dom = getExplorerVirtualDom(visibleDirents, focusedIndex, root, isWide, focused, dropTargets, height, contentHeight, deltaY, editingErrorMessage, top, left);
-  return ['Viewlet.setDom2', dom];
+  return [SetDom2, dom];
 };
 
 const renderValue = (oldState, newState) => {
@@ -6447,71 +6250,71 @@ const updateEditingValue = async (state, value, inputSource = User) => {
 };
 
 const commandMap = {
-  'Explorer.acceptEdit': wrapCommand(acceptEdit),
-  'Explorer.cancelEdit': wrapCommand(cancelEdit),
-  'Explorer.cancelTypeAhead': wrapCommand(cancelTypeAhead),
-  'Explorer.collapseAll': wrapCommand(collapseAll),
-  'Explorer.copyPath': wrapCommand(copyPath),
-  'Explorer.copyRelativePath': wrapCommand(copyRelativePath),
-  'Explorer.expandAll': wrapCommand(expandAll),
-  'Explorer.expandRecursively': wrapCommand(expandRecursively),
-  'Explorer.focus': wrapCommand(focus),
-  'Explorer.focusFirst': wrapCommand(focusFirst),
-  'Explorer.focusIndex': wrapCommand(focusIndex),
-  'Explorer.focusLast': wrapCommand(focusLast),
-  'Explorer.handleDragStart': wrapCommand(handleDragStart),
-  'Explorer.handleDragOverIndex': wrapCommand(handleDragOverIndex),
-  'Explorer.focusNext': wrapCommand(focusNext),
-  'Explorer.focusNone': wrapCommand(focusNone),
-  'Explorer.focusPrevious': wrapCommand(focusPrevious),
+  'Explorer.acceptEdit': wrapListItemCommand(acceptEdit),
+  'Explorer.cancelEdit': wrapListItemCommand(cancelEdit),
+  'Explorer.cancelTypeAhead': wrapListItemCommand(cancelTypeAhead),
+  'Explorer.collapseAll': wrapListItemCommand(collapseAll),
+  'Explorer.copyPath': wrapListItemCommand(copyPath),
+  'Explorer.copyRelativePath': wrapListItemCommand(copyRelativePath),
+  'Explorer.expandAll': wrapListItemCommand(expandAll),
+  'Explorer.expandRecursively': wrapListItemCommand(expandRecursively),
+  'Explorer.focus': wrapListItemCommand(focus),
+  'Explorer.focusFirst': wrapListItemCommand(focusFirst),
+  'Explorer.focusIndex': wrapListItemCommand(focusIndex),
+  'Explorer.focusLast': wrapListItemCommand(focusLast),
+  'Explorer.handleDragStart': wrapListItemCommand(handleDragStart),
+  'Explorer.handleDragOverIndex': wrapListItemCommand(handleDragOverIndex),
+  'Explorer.focusNext': wrapListItemCommand(focusNext),
+  'Explorer.focusNone': wrapListItemCommand(focusNone),
+  'Explorer.focusPrevious': wrapListItemCommand(focusPrevious),
   'Explorer.getCommandIds': getCommandIds,
   'Explorer.getMenuEntries2': getMenuEntries2,
   'Explorer.getMouseActions': getMouseActions,
-  'Explorer.handleArrowLeft': wrapCommand(handleArrowLeft),
-  'Explorer.handleArrowRight': wrapCommand(handleArrowRight),
-  'Explorer.handleEscape': wrapCommand(handleEscape),
-  'Explorer.handleBlur': wrapCommand(handleBlur),
-  'Explorer.handleClick': wrapCommand(handleClick),
-  'Explorer.handleClickAt': wrapCommand(handleClickAt),
-  'Explorer.handleClickCurrent': wrapCommand(handleClickCurrent),
-  'Explorer.handleClickCurrentButKeepFocus': wrapCommand(handleClickCurrentButKeepFocus),
-  'Explorer.handleClickOpenFolder': wrapCommand(handleClickOpenFolder),
-  'Explorer.handleContextMenu': wrapCommand(handleContextMenu),
-  'Explorer.handleContextMenuKeyboard': wrapCommand(handleContextMenuKeyboard),
-  'Explorer.handleCopy': wrapCommand(handleCopy),
-  'Explorer.handleCut': wrapCommand(handleCut),
-  'Explorer.handleDragLeave': wrapCommand(handleDragLeave),
-  'Explorer.handleDragOver': wrapCommand(handleDragOver),
-  'Explorer.handleDrop': wrapCommand(handleDrop),
-  'Explorer.handleFocus': wrapCommand(handleFocus),
-  'Explorer.handleIconThemeChange': wrapCommand(handleIconThemeChange),
-  'Explorer.handleInputBlur': wrapCommand(handleInputBlur),
-  'Explorer.handleInputClick': wrapCommand(handleInputClick),
-  'Explorer.handleInputKeyDown': wrapCommand(handleInputKeyDown),
-  'Explorer.handleKeyDown': wrapCommand(handleKeyDown),
-  'Explorer.handlePaste': wrapCommand(handlePaste),
-  'Explorer.handlePointerDown': wrapCommand(handlePointerDown),
-  'Explorer.handleUpload': wrapCommand(handleUpload),
-  'Explorer.handleWheel': wrapCommand(handleWheel),
-  'Explorer.handleWorkspaceChange': wrapCommand(handleWorkspaceChange),
-  'Explorer.loadContent': wrapCommand(loadContent),
-  'Explorer.newFile': wrapCommand(newFile),
-  'Explorer.newFolder': wrapCommand(newFolder),
-  'Explorer.openContainingFolder': wrapCommand(openContainingFolder),
-  'Explorer.refresh': wrapCommand(refresh),
-  'Explorer.removeDirent': wrapCommand(removeDirent),
-  'Explorer.renameDirent': wrapCommand(renameDirent),
+  'Explorer.handleArrowLeft': wrapListItemCommand(handleArrowLeft),
+  'Explorer.handleArrowRight': wrapListItemCommand(handleArrowRight),
+  'Explorer.handleEscape': wrapListItemCommand(handleEscape),
+  'Explorer.handleBlur': wrapListItemCommand(handleBlur),
+  'Explorer.handleClick': wrapListItemCommand(handleClick),
+  'Explorer.handleClickAt': wrapListItemCommand(handleClickAt),
+  'Explorer.handleClickCurrent': wrapListItemCommand(handleClickCurrent),
+  'Explorer.handleClickCurrentButKeepFocus': wrapListItemCommand(handleClickCurrentButKeepFocus),
+  'Explorer.handleClickOpenFolder': wrapListItemCommand(handleClickOpenFolder),
+  'Explorer.handleContextMenu': wrapListItemCommand(handleContextMenu),
+  'Explorer.handleContextMenuKeyboard': wrapListItemCommand(handleContextMenuKeyboard),
+  'Explorer.handleCopy': wrapListItemCommand(handleCopy),
+  'Explorer.handleCut': wrapListItemCommand(handleCut),
+  'Explorer.handleDragLeave': wrapListItemCommand(handleDragLeave),
+  'Explorer.handleDragOver': wrapListItemCommand(handleDragOver),
+  'Explorer.handleDrop': wrapListItemCommand(handleDrop),
+  'Explorer.handleFocus': wrapListItemCommand(handleFocus),
+  'Explorer.handleIconThemeChange': wrapListItemCommand(handleIconThemeChange),
+  'Explorer.handleInputBlur': wrapListItemCommand(handleInputBlur),
+  'Explorer.handleInputClick': wrapListItemCommand(handleInputClick),
+  'Explorer.handleInputKeyDown': wrapListItemCommand(handleInputKeyDown),
+  'Explorer.handleKeyDown': wrapListItemCommand(handleKeyDown),
+  'Explorer.handlePaste': wrapListItemCommand(handlePaste),
+  'Explorer.handlePointerDown': wrapListItemCommand(handlePointerDown),
+  'Explorer.handleUpload': wrapListItemCommand(handleUpload),
+  'Explorer.handleWheel': wrapListItemCommand(handleWheel),
+  'Explorer.handleWorkspaceChange': wrapListItemCommand(handleWorkspaceChange),
+  'Explorer.loadContent': wrapListItemCommand(loadContent),
+  'Explorer.newFile': wrapListItemCommand(newFile),
+  'Explorer.newFolder': wrapListItemCommand(newFolder),
+  'Explorer.openContainingFolder': wrapListItemCommand(openContainingFolder),
+  'Explorer.refresh': wrapListItemCommand(refresh),
+  'Explorer.removeDirent': wrapListItemCommand(removeDirent),
+  'Explorer.renameDirent': wrapListItemCommand(renameDirent),
   'Explorer.restoreState': restoreState,
-  'Explorer.revealItem': wrapCommand(revealItem),
-  'Explorer.selectAll': wrapCommand(selectAll),
-  'Explorer.selectDown': wrapCommand(selectDown),
-  'Explorer.selectIndices': wrapCommand(setSelectedIndices),
-  'Explorer.selectUp': wrapCommand(selectUp),
-  'Explorer.setDeltaY': wrapCommand(setDeltaY),
-  'Explorer.setSelectedIndices': wrapCommand(setSelectedIndices),
-  'Explorer.toggleIndividualSelection': wrapCommand(toggleIndividualSelection),
-  'Explorer.updateEditingValue': wrapCommand(updateEditingValue),
-  'Explorer.updateIcons': wrapCommand(updateIcons),
+  'Explorer.revealItem': wrapListItemCommand(revealItem),
+  'Explorer.selectAll': wrapListItemCommand(selectAll),
+  'Explorer.selectDown': wrapListItemCommand(selectDown),
+  'Explorer.selectIndices': wrapListItemCommand(setSelectedIndices),
+  'Explorer.selectUp': wrapListItemCommand(selectUp),
+  'Explorer.setDeltaY': wrapListItemCommand(setDeltaY),
+  'Explorer.setSelectedIndices': wrapListItemCommand(setSelectedIndices),
+  'Explorer.toggleIndividualSelection': wrapListItemCommand(toggleIndividualSelection),
+  'Explorer.updateEditingValue': wrapListItemCommand(updateEditingValue),
+  'Explorer.updateIcons': wrapListItemCommand(updateIcons),
   // not wrapped
   'Explorer.create2': create2,
   'Explorer.diff2': diff2,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/explorer-view",
-  "version": "3.19.0",
+  "version": "3.21.0",
   "description": "Explorer Worker",
   "repository": {
     "type": "git",