@lvce-editor/explorer-view 1.17.0 → 1.18.0

package/dist/explorerViewWorkerMain.js

@@ -1813,6 +1813,7 @@ const ButtonWide = 'ButtonWide';
 const Chevron = 'Chevron';
 const Explorer$1 = 'Explorer';
 const FileIcon = 'FileIcon';
+const FocusOutline = 'FocusOutline';
 const IconButton = 'IconButton';
 const InputBox = 'InputBox';
 const Label = 'Label';
@@ -1957,13 +1958,14 @@ const getExplorerWelcomeVirtualDom = isWide => {
   }, text(openFolder$1())];
 };
 
-const getExplorerVirtualDom = (visibleItems, focusedIndex, root, isWide) => {
+const getExplorerVirtualDom = (visibleItems, focusedIndex, root, isWide, focused) => {
   if (!root) {
     return getExplorerWelcomeVirtualDom(isWide);
   }
+  const extraClass = focused && focusedIndex === -1 ? FocusOutline : '';
   const dom = [{
     type: Div,
-    className: mergeClassNames(Viewlet, Explorer$1),
+    className: mergeClassNames(Viewlet, Explorer$1, extraClass),
     tabIndex: 0,
     role: Tree,
     ariaLabel: filesExplorer(),
@@ -2304,6 +2306,7 @@ const handleBlur = state => {
 };
 
 const handleClickDirectory = async (state, dirent, index, keepFocus) => {
+  // @ts-ignore
   dirent.type = DirectoryExpanding;
   // TODO handle error
   const dirents = await getChildDirents(state.pathSeparator, dirent);
@@ -2319,7 +2322,9 @@ const handleClickDirectory = async (state, dirent, index, keepFocus) => {
   }
   const newDirents = [...state2.items];
   newDirents.splice(newIndex + 1, 0, ...dirents);
+  // @ts-ignore
   dirent.type = DirectoryExpanded;
+  // @ts-ignore
   dirent.icon = getIcon();
   const {
     height,
@@ -2348,9 +2353,12 @@ const handleClickDirectoryExpanded$1 = async (state, dirent, index, keepFocus) =
   const {
     minLineY,
     maxLineY,
-    itemHeight
+    itemHeight,
+    fileIconCache
   } = state;
+  // @ts-ignore
   dirent.type = Directory;
+  // @ts-ignore
   dirent.icon = getIcon();
   const endIndex = getParentEndIndex(state.items, index);
   const removeCount = endIndex - index - 1;
@@ -2367,7 +2375,7 @@ const handleClickDirectoryExpanded$1 = async (state, dirent, index, keepFocus) =
     const {
       icons,
       newFileIconCache
-    } = await getFileIcons(parts, state.fileIconCache);
+    } = await getFileIcons(parts, fileIconCache);
     return {
       ...state,
       items: newDirents,
@@ -2384,7 +2392,7 @@ const handleClickDirectoryExpanded$1 = async (state, dirent, index, keepFocus) =
   const {
     icons,
     newFileIconCache
-  } = await getFileIcons(parts, state.fileIconCache);
+  } = await getFileIcons(parts, fileIconCache);
   return {
     ...state,
     items: newDirents,
@@ -2396,7 +2404,9 @@ const handleClickDirectoryExpanded$1 = async (state, dirent, index, keepFocus) =
 };
 
 const handleClickDirectoryExpanding = async (state, dirent, index, keepFocus) => {
+  // @ts-ignore
   dirent.type = Directory;
+  // @ts-ignore
   dirent.icon = getIcon();
   return {
     ...state,
@@ -2405,8 +2415,12 @@ const handleClickDirectoryExpanding = async (state, dirent, index, keepFocus) =>
   };
 };
 
+const openUri = async (uri, focus) => {
+  await invoke(/* Main.openAbsolutePath */'Main.openUri', /* absolutePath */uri, /* focus */focus);
+};
+
 const handleClickFile$1 = async (state, dirent, index, keepFocus = false) => {
-  await invoke(/* Main.openAbsolutePath */'Main.openUri', /* absolutePath */dirent.path, /* focus */!keepFocus);
+  await openUri(dirent.path, !keepFocus);
   return {
     ...state,
     focusedIndex: index,
@@ -2984,6 +2998,15 @@ const handleDrop = async (state, x, y, files) => {
   }
 };
 
+const setFocus = key => {
+  return invoke('Focus.setFocus', key);
+};
+
+const handleFocus = async state => {
+  await setFocus(FocusExplorer);
+  return state;
+};
+
 const updateIcon = dirent => {
   return {
     ...dirent,
@@ -3322,10 +3345,6 @@ const handleWorkspaceChange = async state => {
   return newState;
 };
 
-const setFocus = key => {
-  return invoke('Focus.setFocus', key);
-};
-
 const ExplorerEditBox = FocusExplorerEditBox;
 
 const newDirent = async (state, editingType) => {
@@ -3463,21 +3482,22 @@ const renameDirent = state => {
 
 const renderItems = {
   isEqual(oldState, newState) {
-    return JSON.stringify(oldState.items) === JSON.stringify(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.width === newState.width;
+    return JSON.stringify(oldState.items) === JSON.stringify(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.width === newState.width && oldState.focused === newState.focused;
   },
   apply(oldState, newState) {
     const visibleDirents = getVisibleExplorerItems(newState.items, newState.minLineY, newState.maxLineY, newState.focusedIndex, newState.editingIndex, newState.editingType, newState.editingValue, newState.icons, newState.useChevrons);
     const isWide = newState.width > 450;
-    const dom = getExplorerVirtualDom(visibleDirents, newState.focusedIndex, newState.root, isWide);
+    const dom = getExplorerVirtualDom(visibleDirents, newState.focusedIndex, newState.root, isWide, newState.focused);
     return ['Viewlet.setDom2', dom];
   }
 };
 
-// const renderFocusedIndex = {
-//   isEqual(oldState:any, newState:any) {
+// TODO add virtual dom diffing so that focus is not lost when updating dom
+// const renderFocus = {
+//   isEqual(oldState: any, newState: any) {
 //     return oldState.focusedIndex === newState.focusedIndex && oldState.focused === newState.focused && oldState.minLineY === newState.minLineY
 //   },
-//   apply(oldState:any, newState:any) {
+//   apply(oldState: any, newState: any) {
 //     const oldFocusedIndex = oldState.focusedIndex - oldState.minLineY
 //     const newFocusedIndex = newState.focusedIndex - newState.minLineY
 //     return [/* method */ 'setFocusedIndex', /* oldindex */ oldFocusedIndex, /* newIndex */ newFocusedIndex, /* focused */ newState.focused]
@@ -3860,6 +3880,10 @@ const setDeltaY = (state, deltaY) => {
   };
 };
 
+const terminate = () => {
+  globalThis.close();
+};
+
 const updateEditingValue = (state, value) => {
   const editingIcon = getFileIcon({
     name: value
@@ -3900,6 +3924,7 @@ const commandMap = {
   'Explorer.handleCopy': handleCopy,
   'Explorer.handleDragOver': handleDragOver,
   'Explorer.handleDrop': handleDrop,
+  'Explorer.handleFocus': handleFocus,
   'Explorer.handleIconThemeChange': handleIconThemeChange,
   'Explorer.handlePaste': handlePaste,
   'Explorer.handlePointerDown': handlePointerDown,
@@ -3918,6 +3943,7 @@ const commandMap = {
   'Explorer.revealItem': revealItem,
   'Explorer.saveState': saveState,
   'Explorer.setDeltaY': setDeltaY,
+  'Explorer.terminate': terminate,
   'Explorer.updateEditingValue': updateEditingValue,
   'Explorer.updateIcons': updateIcons
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/explorer-view",
-  "version": "1.17.0",
+  "version": "1.18.0",
   "description": "Explorer Worker",
   "main": "dist/explorerViewWorkerMain.js",
   "type": "module",