@lvce-editor/explorer-view 2.23.0 → 2.24.0

package/dist/explorerViewWorkerMain.js

@@ -985,6 +985,8 @@ const getPath = dirent => {
   return dirent.path;
 };
 
+const DELTA_EDITING = 100;
+
 const BlockDevice = 1;
 const CharacterDevice = 2;
 const Directory = 3;
@@ -996,8 +998,8 @@ const Symlink = 9;
 const SymLinkFile = 10;
 const SymLinkFolder = 11;
 const Unknown = 12;
-const EditingFile = 13;
-const EditingFolder = 14;
+const EditingFile = File + DELTA_EDITING;
+const EditingFolder = Directory + DELTA_EDITING;
 
 const RendererWorker = 1;
 
@@ -1015,12 +1017,20 @@ const invoke = (method, ...params) => {
   return rpc.invoke(method, ...params);
 };
 
+const getFileIcon = async name => {
+  return invoke('IconTheme.getFileIcon', {
+    name
+  });
+};
+
+const getFolderIcon = async name => {
+  return invoke('IconTheme.getFolderIcon', {
+    name
+  });
+};
+
 const requestFileIcons = async requests => {
-  const promises = requests.map(request => request.type === File ? invoke('IconTheme.getFileIcon', {
-    name: request.name
-  }) : invoke('IconTheme.getFolderIcon', {
-    name: request.name
-  }));
+  const promises = requests.map(request => request.type === File ? getFileIcon(request.name) : getFolderIcon(request.name));
   return Promise.all(promises);
 };
 
@@ -1408,12 +1418,41 @@ const acceptEdit = async state => {
   }
 };
 
+const getNewDirentsForCancelRename = (items, editingIndex) => {
+  const item = items[editingIndex];
+  const newItems = [...items];
+  newItems[editingIndex] = {
+    ...item,
+    type: item.type - DELTA_EDITING
+  };
+  return newItems;
+};
+
+const isNormalItem = item => {
+  return item.type !== EditingFile && item.type !== EditingFolder;
+};
 const cancelEdit = state => {
   const {
-    editingIndex
+    editingIndex,
+    editingType
   } = state;
+  if (editingType === Rename$1) {
+    const newItems = getNewDirentsForCancelRename(state.items, editingIndex);
+    return {
+      ...state,
+      items: newItems,
+      focusedIndex: editingIndex,
+      focused: true,
+      editingIndex: -1,
+      editingValue: '',
+      editingType: None$5,
+      focus: List
+    };
+  }
+  const filteredItems = state.items.filter(isNormalItem);
   return {
     ...state,
+    items: filteredItems,
     focusedIndex: editingIndex,
     focused: true,
     editingIndex: -1,
@@ -3580,7 +3619,7 @@ const getNewChildDirentsForNewDirent = async (items, depth, parentPath, direntTy
   const newDirent = {
     name: '',
     type: direntType,
-    path: '',
+    path: parentPath,
     depth,
     selected: false,
     posInSet: updatedChildren.length + 1,
@@ -3591,7 +3630,20 @@ const getNewChildDirentsForNewDirent = async (items, depth, parentPath, direntTy
   return allChildDirents;
 };
 
-const getNewDirentsForNewDirent = async (items, focusedIndex, type) => {
+const getNewDirentsForNewDirent = async (items, focusedIndex, type, root) => {
+  if (items.length === 0 || focusedIndex === -1) {
+    const newDirent = {
+      name: '',
+      type,
+      path: root,
+      depth: 0,
+      selected: false,
+      posInSet: 1,
+      setSize: 1,
+      icon: ''
+    };
+    return [...items, newDirent];
+  }
   const focusedItem = items[focusedIndex];
   if (!focusedItem) {
     return items;
@@ -3632,10 +3684,11 @@ const newDirent = async (state, editingType) => {
     minLineY,
     height,
     itemHeight,
-    fileIconCache
+    fileIconCache,
+    root
   } = state;
   const direntType = getNewDirentType(editingType);
-  const newDirents = await getNewDirentsForNewDirent(items, focusedIndex, direntType);
+  const newDirents = await getNewDirentsForNewDirent(items, focusedIndex, direntType, root);
   const maxLineY = getExplorerMaxLineY(minLineY, height, itemHeight, newDirents.length);
   const visible = newDirents.slice(minLineY, maxLineY);
   const {
@@ -3649,6 +3702,7 @@ const newDirent = async (state, editingType) => {
     editingIndex,
     editingType,
     editingValue: '',
+    focusedIndex: editingIndex,
     focus: Input$1,
     icons,
     fileIconCache: newFileIconCache,
@@ -3756,6 +3810,17 @@ const removeDirent = async state => {
   };
 };
 
+const getNewDirentsForRename = (items, focusedIndex) => {
+  const item = items[focusedIndex];
+  const newItems = [...items];
+  const editingType = item.type === File ? EditingFile : EditingFolder;
+  newItems[focusedIndex] = {
+    ...item,
+    type: editingType
+  };
+  return newItems;
+};
+
 const User = 1;
 const Script = 2;
 
@@ -3764,9 +3829,14 @@ const renameDirent = state => {
     focusedIndex,
     items
   } = state;
+  if (items.length === 0) {
+    return state;
+  }
   const item = items[focusedIndex];
+  const newItems = getNewDirentsForRename(items, focusedIndex);
   return {
     ...state,
+    items: newItems,
     editingIndex: focusedIndex,
     editingType: Rename$1,
     editingValue: item.name,
@@ -4095,13 +4165,12 @@ const getClassName = (isSelected, isFocused) => {
   }
   return TreeItem;
 };
-const getVisibleExplorerItems = (items, minLineY, maxLineY, focusedIndex, editingIndex, editingType, editingValue, editingErrorMessage, icons, useChevrons, dropTargets) => {
+const getVisibleExplorerItems = (items, minLineY, maxLineY, focusedIndex, editingIndex, editingType, editingValue, editingErrorMessage, icons, useChevrons, dropTargets, editingIcon) => {
   const visible = [];
   const indentFn = useChevrons ? getTreeItemIndentWithChevron : getTreeItemIndent;
   let iconIndex = 0;
   for (let i = minLineY; i < Math.min(maxLineY, items.length); i++) {
     const item = items[i];
-    const icon = icons[iconIndex++];
     const chevron = getChevronType(item.type, useChevrons);
     const indent = indentFn(item.depth, chevron);
     const isFocused = i === focusedIndex;
@@ -4110,12 +4179,17 @@ const getVisibleExplorerItems = (items, minLineY, maxLineY, focusedIndex, editin
     const className = getClassName(isSelected, isFocused);
     const expanded = getExpandedType(item.type);
     const ariaExpanded = ariaExpandedValues[expanded];
-
-    // @ts-ignore
+    const isEditing = i === editingIndex;
+    let icon = icons[iconIndex++];
+    if (isEditing) {
+      icon = editingIcon;
+    }
     visible.push({
       ...item,
-      isEditing: i === editingIndex,
-      hasEditingError: i === editingIndex && Boolean(editingErrorMessage),
+      posInSet: item.posInSet ?? i + 1,
+      setSize: item.setSize ?? items.length,
+      isEditing: isEditing,
+      hasEditingError: isEditing && Boolean(editingErrorMessage),
       icon,
       indent,
       ariaExpanded,
@@ -4124,29 +4198,11 @@ const getVisibleExplorerItems = (items, minLineY, maxLineY, focusedIndex, editin
       className
     });
   }
-  if (editingType !== None$5 && editingIndex === -1) {
-    visible.push({
-      depth: 3,
-      posInSet: 1,
-      setSize: 1,
-      icon: '',
-      name: 'new',
-      path: '/test/new',
-      isEditing: true,
-      hasEditingError: Boolean(editingErrorMessage),
-      indent: '',
-      ariaExpanded: undefined,
-      chevron: 0,
-      id: undefined,
-      className: TreeItem,
-      selected: false
-    });
-  }
   return visible;
 };
 
 const renderItems = (oldState, newState) => {
-  const visibleDirents = getVisibleExplorerItems(newState.items, newState.minLineY, newState.maxLineY, newState.focusedIndex, newState.editingIndex, newState.editingType, newState.editingValue, newState.editingErrorMessage, newState.icons, newState.useChevrons);
+  const visibleDirents = getVisibleExplorerItems(newState.items, newState.minLineY, newState.maxLineY, newState.focusedIndex, newState.editingIndex, newState.editingType, newState.editingValue, newState.editingErrorMessage, newState.icons, newState.useChevrons, newState.dropTargets, newState.editingIcon);
   const isWide = newState.width > 450;
   const dom = getExplorerVirtualDom(visibleDirents, newState.focusedIndex, newState.root, isWide, newState.focused, newState.dropTargets);
   return ['Viewlet.setDom2', dom];
@@ -4648,18 +4704,25 @@ const terminate = () => {
 };
 
 const getEditingIcon = async (editingType, value) => {
-  if (editingType === File) {
+  if (editingType === CreateFile) {
+    return invoke('IconTheme.getFileIcon', {
+      name: value
+    });
+  }
+  // TODO need renamefile and renamefolder type
+  if (editingType === Rename$1) {
     return invoke('IconTheme.getFileIcon', {
       name: value
     });
   }
-  if (editingType === Directory) {
+  if (editingType === CreateFolder) {
     return invoke('IconTheme.getFolderIcon', {
       name: value
     });
   }
   return '';
 };
+
 const updateEditingValue = async (state, value, inputSource = User) => {
   const editingIcon = await getEditingIcon(state.editingType, value);
   return {

package/package.json

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