@lvce-editor/explorer-view 2.17.0 → 2.19.0

package/dist/explorerViewWorkerMain.js

@@ -1107,13 +1107,16 @@ const getNewDirentsAccept = async (state, newDirentType, createFn) => {
   const depth = parentDirent.depth + 1;
   const newDirent = {
     path: absolutePath,
+    // @ts-ignore
     posInSet: -1,
     setSize: 1,
     depth,
     name: newFileName,
     type: newDirentType,
-    icon: ''
+    icon: '',
+    selected: false
   };
+  // @ts-ignore
   newDirent.icon = '';
   let insertIndex = state.focusedIndex;
   let deltaPosInSet = 0;
@@ -1147,7 +1150,9 @@ const getNewDirentsAccept = async (state, newDirentType, createFn) => {
     // @ts-ignore
     dirent.posInSet += deltaPosInSet;
   }
+  // @ts-ignore
   newDirent.setSize = setSize;
+  // @ts-ignore
   newDirent.posInSet = posInSet;
   // @ts-ignore
   items.splice(insertIndex + 1, 0, newDirent);
@@ -1573,6 +1578,7 @@ const create = (id, uri, x, y, width, height, args, parentUid, platform = 0) =>
 
 const RenderItems = 4;
 const RenderFocus = 6;
+const RenderFocusContext = 7;
 
 const diffType$1 = RenderFocus;
 const isEqual$2 = (oldState, newState) => {
@@ -1584,8 +1590,8 @@ const isEqual$1 = (oldState, newState) => {
   return oldState.items === newState.items && oldState.minLineY === newState.minLineY && oldState.maxLineY === newState.maxLineY && oldState.focusedIndex === newState.focusedIndex && oldState.editingIndex === newState.editingIndex && oldState.editingType === newState.editingType && oldState.editingValue === newState.editingValue && oldState.editingErrorMessage === newState.editingErrorMessage && oldState.width === newState.width && oldState.focused === newState.focused && oldState.dropTargets === newState.dropTargets;
 };
 
-const modules = [isEqual$1, isEqual$2];
-const numbers = [diffType, diffType$1];
+const modules = [isEqual$1, isEqual$2, isEqual$2];
+const numbers = [diffType, diffType$1, RenderFocusContext];
 
 const diff = (oldState, newState) => {
   const diffResult = [];
@@ -1872,12 +1878,18 @@ const expandRecursively = async state => {
 const focusIndex = (state, index) => {
   const {
     minLineY,
-    maxLineY
+    maxLineY,
+    items
   } = state;
+  const newItems = items.map((item, i) => ({
+    ...item,
+    selected: i === index ? true : false
+  }));
   if (index < minLineY) {
     if (index < 0) {
       return {
         ...state,
+        items: newItems,
         focusedIndex: index,
         focused: true
       };
@@ -1885,6 +1897,7 @@ const focusIndex = (state, index) => {
     const diff = maxLineY - minLineY;
     return {
       ...state,
+      items: newItems,
       focusedIndex: index,
       focused: true,
       minLineY: index,
@@ -1895,6 +1908,7 @@ const focusIndex = (state, index) => {
     const diff = maxLineY - minLineY;
     return {
       ...state,
+      items: newItems,
       focusedIndex: index,
       focused: true,
       minLineY: index + 1 - diff,
@@ -1903,6 +1917,7 @@ const focusIndex = (state, index) => {
   }
   return {
     ...state,
+    items: newItems,
     focusedIndex: index,
     focused: true
   };
@@ -1971,7 +1986,7 @@ const focusPrevious = state => {
   }
 };
 
-const commandIds = ['getMenuEntries2', 'acceptEdit', 'cancelEdit', 'collapseAll', 'copyPath', 'copyRelativePath', 'expandAll', 'expandRecursively', 'focus', 'focusFirst', 'focusIndex', 'focusLast', 'focusNext', 'focusNone', 'focusPrevious', 'getFocusedDirent', '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', 'selectUp', 'selectDown', '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 getCommandIds = () => {
   return commandIds;
@@ -1993,6 +2008,7 @@ const F2 = 58;
 const Star = 131;
 
 const CtrlCmd = 1 << 11 >>> 0;
+const Shift = 1 << 10 >>> 0;
 const Alt = 1 << 9 >>> 0;
 
 const FocusExplorer = 13;
@@ -2000,6 +2016,14 @@ const FocusExplorerEditBox = 14;
 
 const getKeyBindings = () => {
   return [{
+    key: Shift | UpArrow,
+    command: 'Explorer.selectUp',
+    when: FocusExplorer
+  }, {
+    key: Shift | DownArrow,
+    command: 'Explorer.selectDown',
+    when: FocusExplorer
+  }, {
     key: RightArrow,
     command: 'Explorer.handleArrowRight',
     when: FocusExplorer
@@ -2538,7 +2562,7 @@ const getIndexFromPosition = (state, eventX, eventY) => {
 const Keyboard = -1;
 const LeftClick = 0;
 
-const handleClickAt = (state, button, x, y) => {
+const handleClickAt = (state, button, ctrlKey, shiftKey, x, y) => {
   if (button !== LeftClick) {
     return state;
   }
@@ -3569,12 +3593,12 @@ const renameDirent = state => {
     items
   } = state;
   const item = items[focusedIndex];
-  // Focus.setFocus(FocusKey.ExplorerEditBox)
   return {
     ...state,
     editingIndex: focusedIndex,
     editingType: Rename$1,
-    editingValue: item.name
+    editingValue: item.name,
+    focus: Input$1
   };
 };
 
@@ -3582,7 +3606,7 @@ const ExplorerInput = 'ExplorerInput';
 
 const User = 1;
 
-const renderFocus = (oldState, newState) => {
+const renderFocus$1 = (oldState, newState) => {
   if (newState.inputSource === User) {
     return [];
   }
@@ -3598,6 +3622,16 @@ const renderFocus = (oldState, newState) => {
   return [];
 };
 
+const renderFocus = (oldState, newState) => {
+  if (newState.focus === Input$1) {
+    return ['Viewlet.setFocusContext', FocusExplorerEditBox];
+  }
+  if (newState.focus === List) {
+    return ['Viewlet.setFocusContext', FocusExplorer];
+  }
+  return [];
+};
+
 const None$2 = 'none';
 const ToolBar = 'toolbar';
 const Tree = 'tree';
@@ -3696,7 +3730,7 @@ const getFileIconVirtualDom = icon => {
   };
 };
 
-const getClassName$1 = hasEditingError => {
+const getClassName$2 = hasEditingError => {
   if (hasEditingError) {
     return mergeClassNames(InputBox, InputValidationError);
   }
@@ -3705,7 +3739,7 @@ const getClassName$1 = hasEditingError => {
 const getInputDom = hasEditingError => {
   return [{
     type: Input,
-    className: getClassName$1(hasEditingError),
+    className: getClassName$2(hasEditingError),
     id: 'ExplorerInput',
     onInput: HandleEditingInput,
     childCount: 0,
@@ -3789,7 +3823,7 @@ const getActiveDescendant = focusedIndex => {
   }
   return undefined;
 };
-const getClassName = (focused, focusedIndex, dropTarget) => {
+const getClassName$1 = (focused, focusedIndex, dropTarget) => {
   const extraClass1 = focused && focusedIndex === -1 ? FocusOutline : Empty;
   const extraClass2 = dropTarget === dropTargetFull ? ExplorerDropTarget : Empty;
   const className = mergeClassNames(ListItems, extraClass1, extraClass2);
@@ -3807,7 +3841,7 @@ const getExplorerVirtualDom = (visibleItems, focusedIndex, root, isWide, focused
   }
   const dom = [parentNode, {
     type: Div,
-    className: getClassName(focused, focusedIndex, dropTargets),
+    className: getClassName$1(focused, focusedIndex, dropTargets),
     tabIndex: 0,
     role: Tree,
     ariaLabel: filesExplorer(),
@@ -3879,6 +3913,15 @@ const getTreeItemIndentWithChevron = (depth, chevron) => {
 };
 
 const ariaExpandedValues = [undefined, 'true', 'false'];
+const getClassName = (isSelected, isFocused) => {
+  if (isFocused) {
+    return mergeClassNames(TreeItem, TreeItemActive);
+  }
+  if (isSelected) {
+    return mergeClassNames(TreeItem, TreeItemActive);
+  }
+  return TreeItem;
+};
 const getVisibleExplorerItems = (items, minLineY, maxLineY, focusedIndex, editingIndex, editingType, editingValue, editingErrorMessage, icons, useChevrons, dropTargets) => {
   const visible = [];
   const indentFn = useChevrons ? getTreeItemIndentWithChevron : getTreeItemIndent;
@@ -3890,7 +3933,8 @@ const getVisibleExplorerItems = (items, minLineY, maxLineY, focusedIndex, editin
     const indent = indentFn(item.depth, chevron);
     const isFocused = i === focusedIndex;
     const id = isFocused ? 'TreeItemActive' : undefined;
-    const className = isFocused ? mergeClassNames(TreeItem, TreeItemActive) : TreeItem;
+    const isSelected = item.selected;
+    const className = getClassName(isSelected, isFocused);
     const expanded = getExpandedType(item.type);
     const ariaExpanded = ariaExpandedValues[expanded];
 
@@ -3921,7 +3965,8 @@ const getVisibleExplorerItems = (items, minLineY, maxLineY, focusedIndex, editin
       ariaExpanded: undefined,
       chevron: 0,
       id: undefined,
-      className: TreeItem
+      className: TreeItem,
+      selected: false
     });
   }
   return visible;
@@ -3939,6 +3984,8 @@ const getRenderer = diffType => {
     case RenderItems:
       return renderItems;
     case RenderFocus:
+      return renderFocus$1;
+    case RenderFocusContext:
       return renderFocus;
     default:
       throw new Error('unknown renderer');
@@ -4064,7 +4111,7 @@ const renderEventListeners = () => {
     params: ['handleBlur']
   }, {
     name: HandleClick,
-    params: ['handleClickAt', 'event.button', 'event.clientX', 'event.clientY'],
+    params: ['handleClickAt', 'event.button', 'event.ctrlKey', 'event.shiftKey', 'event.clientX', 'event.clientY'],
     preventDefault: true
   }, {
     name: HandleClickOpenFolder,
@@ -4333,12 +4380,65 @@ const saveState = uid => {
   };
 };
 
+const selectDown = state => {
+  const {
+    items,
+    focusedIndex
+  } = state;
+  const firstSelectedIndex = items.findIndex(item => item.selected);
+  const targetIndex = firstSelectedIndex === -1 ? focusedIndex : firstSelectedIndex;
+  if (targetIndex >= items.length - 1) {
+    return state;
+  }
+  const newItems = items.map((item, i) => ({
+    ...item,
+    selected: i === targetIndex + 1 ? true : item.selected
+  }));
+  return {
+    ...state,
+    items: newItems
+  };
+};
+
+const selectUp = state => {
+  const {
+    items,
+    focusedIndex
+  } = state;
+  const firstSelectedIndex = items.findIndex(item => item.selected);
+  const targetIndex = firstSelectedIndex === -1 ? focusedIndex : firstSelectedIndex;
+  if (targetIndex <= 0) {
+    return state;
+  }
+  const newItems = items.map((item, i) => ({
+    ...item,
+    selected: i === targetIndex - 1 ? true : item.selected
+  }));
+  return {
+    ...state,
+    items: newItems
+  };
+};
+
 const terminate = () => {
   globalThis.close();
 };
 
-const updateEditingValue = (state, value, inputSource = User) => {
-  const editingIcon = '';
+const getEditingIcon = async (editingType, value) => {
+  if (editingType === File) {
+    return invoke('IconTheme.getFileIcon', {
+      name: value
+    });
+  }
+  if (editingType === Directory) {
+    return invoke('IconTheme.getFolderIcon', {
+      name: value
+    });
+  }
+  return '';
+};
+const updateEditingValue = async (state, value, inputSource = User) => {
+  const editingIcon = await getEditingIcon(state.editingType, value);
   return {
     ...state,
     editingValue: value,
@@ -4379,6 +4479,8 @@ const commandMap = {
   '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),

package/package.json

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