@lvce-editor/explorer-view 2.21.0 → 2.23.0

package/dist/explorerViewWorkerMain.js

@@ -996,6 +996,8 @@ const Symlink = 9;
 const SymLinkFile = 10;
 const SymLinkFolder = 11;
 const Unknown = 12;
+const EditingFile = 13;
+const EditingFolder = 14;
 
 const RendererWorker = 1;
 
@@ -1156,7 +1158,7 @@ const getNewDirentsAccept = async (state, newDirentType, createFn) => {
   newDirent.posInSet = posInSet;
   // @ts-ignore
   items.splice(insertIndex + 1, 0, newDirent);
-  const newDirents = [...items];
+  const newDirents = [...items].filter(item => item.type !== EditingFile && item.type !== EditingFolder);
   return {
     dirents: newDirents,
     newFocusedIndex: insertIndex + 1
@@ -1977,6 +1979,16 @@ const focusNext = state => {
   return focusIndex(state, focusedIndex + 1);
 };
 
+const focusNone = state => {
+  const {
+    focusedIndex
+  } = state;
+  if (focusedIndex === -1) {
+    return state;
+  }
+  return focusIndex(state, -1);
+};
+
 const focusPrevious = state => {
   const {
     focusedIndex,
@@ -1995,7 +2007,7 @@ const focusPrevious = state => {
   }
 };
 
-const commandIds = ['acceptEdit', 'cancelEdit', 'collapseAll', 'copyPath', 'copyRelativePath', 'dispose', 'expandAll', 'expandRecursively', 'selectUp', 'selectDown', 'getMouseActions', 'focus', 'focusFirst', 'focusIndex', 'focusLast', 'focusNext', 'focusNone', 'focusPrevious', 'getFocusedDirent', 'getMenuEntries2', 'handleArrowLeft', 'handleArrowLeft', 'handleArrowRight', 'handleArrowRight', 'handleBlur', 'handleClick', 'handleClickAt', 'handleClickCurrent', 'handleClickCurrentButKeepFocus', 'handleClickOpenFolder', 'handleContextMenu', 'handleContextMenuKeyboard', 'handleCopy', 'handleDragLeave', 'handleDragOver', 'handleDrop', 'handleFocus', 'handleIconThemeChange', 'handleLanguagesChanged', 'handleMouseEnter', 'handleMouseLeave', 'handlePaste', 'handlePointerDown', 'handleUpload', 'handleWheel', 'handleWorkspaceChange', 'hotReload', 'newFile', 'newFolder', 'openContainingFolder', 'refresh', 'refresh', 'removeDirent', 'rename', 'renameDirent', 'renderEventListeners', 'revealItem', 'revealItem', 'scrollDown', 'scrollUp', 'setDeltaY', 'updateEditingValue', 'updateIcons'];
+const commandIds = ['acceptEdit', 'cancelEdit', 'collapseAll', 'copyPath', 'copyRelativePath', 'dispose', 'expandAll', 'expandRecursively', 'focus', 'focusFirst', 'focusIndex', 'focusLast', 'focusNext', 'focusNone', 'focusPrevious', 'getFocusedDirent', 'getMenuEntries2', 'getMouseActions', 'handleArrowLeft', 'handleArrowLeft', 'handleArrowRight', 'handleArrowRight', 'handleBlur', 'handleClick', 'handleClickAt', 'handleClickCurrent', 'handleClickCurrentButKeepFocus', 'handleClickOpenFolder', 'handleContextMenu', 'handleContextMenuKeyboard', 'handleCopy', 'handleDragLeave', 'handleDragOver', 'handleDrop', 'handleFocus', 'handleIconThemeChange', 'handleInputBlur', 'handleLanguagesChanged', 'handleMouseEnter', 'handleMouseLeave', 'handlePaste', 'handlePointerDown', 'handleUpload', 'handleWheel', 'handleWorkspaceChange', 'hotReload', 'newFile', 'newFolder', 'openContainingFolder', 'refresh', 'removeDirent', 'rename', 'renameDirent', 'renderEventListeners', 'revealItem', 'revealItem', 'scrollDown', 'scrollUp', 'selectAll', 'selectDown', 'selectUp', 'setDeltaY', 'setSelectedIndices', 'updateEditingValue', 'updateIcons'];
 
 const getCommandIds = () => {
   return commandIds;
@@ -2011,6 +2023,7 @@ const UpArrow = 14;
 const RightArrow = 15;
 const DownArrow = 16;
 const Delete = 18;
+const KeyA = 29;
 const KeyC = 31;
 const KeyV = 50;
 const F2 = 58;
@@ -2078,7 +2091,7 @@ const getKeyBindings = () => {
     when: FocusExplorer
   }, {
     key: F2,
-    command: 'Explorer.rename',
+    command: 'Explorer.renameDirent',
     when: FocusExplorer
   }, {
     key: Escape,
@@ -2104,6 +2117,10 @@ const getKeyBindings = () => {
     key: Enter,
     command: 'Explorer.handleClickCurrent',
     when: FocusExplorer
+  }, {
+    key: CtrlCmd | KeyA,
+    command: 'Explorer.selectAll',
+    when: FocusExplorer
   }];
 };
 
@@ -2854,6 +2871,7 @@ const applyOperation = operation => {
   }
   return writeFile(operation.path, operation.text);
 };
+
 const applyFileOperations = async operations => {
   // TODO run operations in parallel if possible
   for (const operation of operations) {
@@ -3181,6 +3199,10 @@ const handleIconThemeChange = state => {
   return updateIcons(state);
 };
 
+const handleInputBlur = state => {
+  return cancelEdit(state);
+};
+
 // TODO add lots of tests for this
 const updateRoot = async state1 => {
   // @ts-ignore
@@ -3534,28 +3556,103 @@ const handleWorkspaceChange = async state => {
 
 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));
+  if (existingChildren.length === 0) {
+    const childDirents = await readDirWithFileTypes(parentPath);
+    existingChildren = childDirents.map((dirent, index) => ({
+      name: dirent.name,
+      type: dirent.type,
+      path: `${parentPath}/${dirent.name}`,
+      depth,
+      selected: false,
+      posInSet: index + 1,
+      setSize: childDirents.length,
+      icon: ''
+    }));
+  }
+  const updatedChildren = existingChildren.map((child, index) => ({
+    ...child,
+    posInSet: index + 1,
+    setSize: existingChildren.length + 2
+  }));
+  const newDirent = {
+    name: '',
+    type: direntType,
+    path: '',
+    depth,
+    selected: false,
+    posInSet: updatedChildren.length + 1,
+    setSize: existingChildren.length + 2,
+    icon: ''
+  };
+  const allChildDirents = [...updatedChildren, newDirent];
+  return allChildDirents;
+};
+
+const getNewDirentsForNewDirent = async (items, focusedIndex, type) => {
+  const focusedItem = items[focusedIndex];
+  if (!focusedItem) {
+    return items;
+  }
+  const parentPath = focusedItem.path;
+  const depth = focusedItem.depth + 1;
+  const updatedChildren = await getNewChildDirentsForNewDirent(items, depth, parentPath, type);
+
+  // Create new array with updated items
+  const parentIndex = focusedIndex;
+  const itemsBeforeParent = items.slice(0, parentIndex);
+  const itemsAfterChildren = items.slice(parentIndex + updatedChildren.length);
+  const updatedParent = {
+    ...items[parentIndex],
+    setSize: (items[parentIndex]?.setSize || 0) + 1
+  };
+  return [...itemsBeforeParent, updatedParent, ...updatedChildren, ...itemsAfterChildren];
+};
+
+const getNewDirentType = editingType => {
+  switch (editingType) {
+    case CreateFile:
+      return EditingFile;
+    case CreateFolder:
+      return EditingFolder;
+    default:
+      return File;
+  }
+};
+
 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 {
     focusedIndex,
-    items
+    items,
+    minLineY,
+    height,
+    itemHeight,
+    fileIconCache
   } = state;
-  if (focusedIndex >= 0) {
-    const dirent = items[focusedIndex];
-    if (dirent.type === Directory) {
-      // TODO handle error
-      // @ts-ignore
-      await handleClickDirectory(state, dirent);
-    }
-  }
+  const direntType = getNewDirentType(editingType);
+  const newDirents = await getNewDirentsForNewDirent(items, focusedIndex, direntType);
+  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);
   return {
     ...state,
-    editingIndex: focusedIndex,
+    items: newDirents,
+    editingIndex,
     editingType,
     editingValue: '',
-    focus: Input$1
+    focus: Input$1,
+    icons,
+    fileIconCache: newFileIconCache,
+    maxLineY
   };
 };
 
@@ -3750,14 +3847,15 @@ const WelcomeMessage = 'WelcomeMessage';
 const HandleClick = 'handleClick';
 const HandleClickOpenFolder = 'handleClickOpenFolder';
 const HandleContextMenu = 'handleContextMenu';
+const HandleDragLeave = 'handleDragLeave';
+const HandleDragOver = 'handleDragOver';
+const HandleDrop = 'handleDrop';
 const HandleEditingInput = 'handleEditingInput';
+const HandleInputBlur = 'handleInputBlur';
 const HandleListBlur = 'handleListBlur';
 const HandleListFocus = 'handleListFocus';
 const HandlePointerDown = 'handlePointerDown';
 const HandleWheel = 'handleWheel';
-const HandleDragOver = 'handleDragOver';
-const HandleDrop = 'handleDrop';
-const HandleDragLeave = 'handleDragLeave';
 
 const mergeClassNames = (...classNames) => {
   return classNames.filter(Boolean).join(' ');
@@ -3816,6 +3914,7 @@ const getInputDom = hasEditingError => {
     className: getClassName$2(hasEditingError),
     id: 'ExplorerInput',
     onInput: HandleEditingInput,
+    onBlur: HandleInputBlur,
     childCount: 0,
     name: ExplorerInput
   }];
@@ -4187,8 +4286,8 @@ const renderActions = uid => {
 
 const renderEventListeners = () => {
   return [{
-    name: HandleListBlur,
-    params: ['handleBlur']
+    name: HandleInputBlur,
+    params: ['handleInputBlur']
   }, {
     name: HandleListFocus,
     params: ['handleFocus', 'event.isTrusted', 'event.target.className']
@@ -4466,13 +4565,36 @@ const saveState = uid => {
   };
 };
 
+const selectAll = state => {
+  const {
+    items
+  } = state;
+  const newItems = items.map(item => ({
+    ...item,
+    selected: true
+  }));
+  return {
+    ...state,
+    items: newItems
+  };
+};
+
+const getLastSelectedIndex = items => {
+  let lastSelectedIndex = -1;
+  for (let index = 0; index < items.length; index++) {
+    if (items[index].selected) {
+      lastSelectedIndex = index;
+    }
+  }
+  return lastSelectedIndex;
+};
 const selectDown = state => {
   const {
     items,
     focusedIndex
   } = state;
-  const firstSelectedIndex = items.findIndex(item => item.selected);
-  const targetIndex = firstSelectedIndex === -1 ? focusedIndex : firstSelectedIndex;
+  const lastSelectedIndex = getLastSelectedIndex(items);
+  const targetIndex = lastSelectedIndex === -1 ? focusedIndex : lastSelectedIndex;
   if (targetIndex >= items.length - 1) {
     return state;
   }
@@ -4480,6 +4602,21 @@ const selectDown = state => {
     ...item,
     selected: i === targetIndex + 1 ? true : item.selected
   }));
+  return {
+    ...state,
+    items: newItems,
+    focusedIndex: targetIndex + 1
+  };
+};
+
+const setSelectedIndices = (state, indices) => {
+  const {
+    items
+  } = state;
+  const newItems = items.map((item, i) => ({
+    ...item,
+    selected: indices.includes(i)
+  }));
   return {
     ...state,
     items: newItems
@@ -4548,10 +4685,10 @@ const wrapCommand = fn => {
 };
 
 const commandMap = {
-  'Explorer.getMenuEntries2': getMenuEntries2,
   'Explorer.acceptEdit': wrapCommand(acceptEdit),
   'Explorer.cancelEdit': wrapCommand(cancelEdit),
   'Explorer.collapseAll': wrapCommand(collapseAll),
+  'Explorer.handleInputBlur': wrapCommand(handleInputBlur),
   'Explorer.copyPath': wrapCommand(copyPath),
   'Explorer.copyRelativePath': wrapCommand(copyRelativePath),
   'Explorer.expandAll': wrapCommand(expandAll),
@@ -4560,20 +4697,20 @@ const commandMap = {
   'Explorer.focusIndex': wrapCommand(focusIndex),
   'Explorer.focusLast': wrapCommand(focusLast),
   'Explorer.focusNext': wrapCommand(focusNext),
+  'Explorer.focusNone': wrapCommand(focusNone),
   'Explorer.focusPrevious': wrapCommand(focusPrevious),
   'Explorer.getCommandIds': getCommandIds,
+  'Explorer.getMenuEntries2': getMenuEntries2,
+  'Explorer.getMouseActions': getMouseActions,
   'Explorer.handleArrowLeft': wrapCommand(handleArrowLeft),
   'Explorer.handleArrowRight': wrapCommand(handleArrowRight),
   'Explorer.handleBlur': wrapCommand(handleBlur),
-  'Explorer.selectUp': wrapCommand(selectUp),
-  'Explorer.selectDown': wrapCommand(selectDown),
   '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.getMouseActions': getMouseActions,
   'Explorer.handleContextMenuKeyboard': wrapCommand(handleContextMenuKeyboard),
   'Explorer.handleCopy': wrapCommand(handleCopy),
   'Explorer.handleDragLeave': wrapCommand(handleDragLeave),
@@ -4595,7 +4732,11 @@ const commandMap = {
   'Explorer.renameDirent': wrapCommand(renameDirent),
   'Explorer.restoreState': restoreState,
   'Explorer.revealItem': wrapCommand(revealItem),
+  'Explorer.selectAll': wrapCommand(selectAll),
+  'Explorer.selectDown': wrapCommand(selectDown),
+  'Explorer.selectUp': wrapCommand(selectUp),
   'Explorer.setDeltaY': wrapCommand(setDeltaY),
+  'Explorer.setSelectedIndices': wrapCommand(setSelectedIndices),
   'Explorer.updateEditingValue': wrapCommand(updateEditingValue),
   'Explorer.updateIcons': wrapCommand(updateIcons),
   // not wrapped

package/package.json

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