@lvce-editor/explorer-view 2.22.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', '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', 'handleLanguagesChanged', 'handleMouseEnter', 'handleMouseLeave', 'handlePaste', 'handlePointerDown', 'handleUpload', 'handleWheel', 'handleWorkspaceChange', 'hotReload', 'newFile', 'newFolder', 'openContainingFolder', 'refresh', 'setSelectedIndices', 'removeDirent', 'rename', 'renameDirent', 'renderEventListeners', 'revealItem', 'revealItem', 'scrollDown', 'scrollUp', 'selectAll', 'selectDown', 'selectUp', '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;
@@ -2079,7 +2091,7 @@ const getKeyBindings = () => {
     when: FocusExplorer
   }, {
     key: F2,
-    command: 'Explorer.rename',
+    command: 'Explorer.renameDirent',
     when: FocusExplorer
   }, {
     key: Escape,
@@ -3187,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
@@ -3540,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
   };
 };
 
@@ -3756,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(' ');
@@ -3822,6 +3914,7 @@ const getInputDom = hasEditingError => {
     className: getClassName$2(hasEditingError),
     id: 'ExplorerInput',
     onInput: HandleEditingInput,
+    onBlur: HandleInputBlur,
     childCount: 0,
     name: ExplorerInput
   }];
@@ -4193,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']
@@ -4592,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),
@@ -4604,21 +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.selectAll': wrapCommand(selectAll),
   '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),
@@ -4640,10 +4732,13 @@ 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),
-  'Explorer.setSelectedIndices': wrapCommand(setSelectedIndices),
   // not wrapped
   'Explorer.create2': create2,
   'Explorer.diff2': diff2,

package/package.json

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