@lvce-editor/explorer-view 1.11.0 → 1.13.0

package/dist/explorerViewWorkerMain.js

@@ -107,27 +107,6 @@ const string = value => {
   }
 };
 
-const walkValue = (value, transferrables, isTransferrable) => {
-  if (!value) {
-    return;
-  }
-  if (isTransferrable(value)) {
-    transferrables.push(value);
-    return;
-  }
-  if (Array.isArray(value)) {
-    for (const item of value) {
-      walkValue(item, transferrables, isTransferrable);
-    }
-    return;
-  }
-  if (typeof value === 'object') {
-    for (const property of Object.values(value)) {
-      walkValue(property, transferrables, isTransferrable);
-    }
-    return;
-  }
-};
 const isMessagePort = value => {
   return value && value instanceof MessagePort;
 };
@@ -152,6 +131,27 @@ const isTransferrable = value => {
   }
   return false;
 };
+const walkValue = (value, transferrables, isTransferrable) => {
+  if (!value) {
+    return;
+  }
+  if (isTransferrable(value)) {
+    transferrables.push(value);
+    return;
+  }
+  if (Array.isArray(value)) {
+    for (const item of value) {
+      walkValue(item, transferrables, isTransferrable);
+    }
+    return;
+  }
+  if (typeof value === 'object') {
+    for (const property of Object.values(value)) {
+      walkValue(property, transferrables, isTransferrable);
+    }
+    return;
+  }
+};
 const getTransferrables = value => {
   const transferrables = [];
   walkValue(value, transferrables, isTransferrable);
@@ -184,30 +184,35 @@ const NewLine$1 = '\n';
 const joinLines$1 = lines => {
   return lines.join(NewLine$1);
 };
-const splitLines$1 = lines => {
-  return lines.split(NewLine$1);
-};
-const isModuleNotFoundMessage = line => {
-  return line.includes('[ERR_MODULE_NOT_FOUND]');
+const RE_AT = /^\s+at/;
+const RE_AT_PROMISE_INDEX = /^\s*at async Promise.all \(index \d+\)$/;
+const isNormalStackLine = line => {
+  return RE_AT.test(line) && !RE_AT_PROMISE_INDEX.test(line);
 };
-const getModuleNotFoundError = stderr => {
-  const lines = splitLines$1(stderr);
-  const messageIndex = lines.findIndex(isModuleNotFoundMessage);
-  const message = lines[messageIndex];
+const getDetails = lines => {
+  const index = lines.findIndex(isNormalStackLine);
+  if (index === -1) {
+    return {
+      actualMessage: joinLines$1(lines),
+      rest: []
+    };
+  }
+  let lastIndex = index - 1;
+  while (++lastIndex < lines.length) {
+    if (!isNormalStackLine(lines[lastIndex])) {
+      break;
+    }
+  }
   return {
-    message,
-    code: ERR_MODULE_NOT_FOUND
+    actualMessage: lines[index - 1],
+    rest: lines.slice(index, lastIndex)
   };
 };
-const RE_NATIVE_MODULE_ERROR = /^innerError Error: Cannot find module '.*.node'/;
-const RE_NATIVE_MODULE_ERROR_2 = /was compiled against a different Node.js version/;
+const splitLines$1 = lines => {
+  return lines.split(NewLine$1);
+};
 const RE_MESSAGE_CODE_BLOCK_START = /^Error: The module '.*'$/;
 const RE_MESSAGE_CODE_BLOCK_END = /^\s* at/;
-const RE_AT = /^\s+at/;
-const RE_AT_PROMISE_INDEX = /^\s*at async Promise.all \(index \d+\)$/;
-const isUnhelpfulNativeModuleError = stderr => {
-  return RE_NATIVE_MODULE_ERROR.test(stderr) && RE_NATIVE_MODULE_ERROR_2.test(stderr);
-};
 const isMessageCodeBlockStartIndex = line => {
   return RE_MESSAGE_CODE_BLOCK_START.test(line);
 };
@@ -222,51 +227,46 @@ const getMessageCodeBlock = stderr => {
   const relevantMessage = relevantLines.join(' ').slice('Error: '.length);
   return relevantMessage;
 };
-const getNativeModuleErrorMessage = stderr => {
-  const message = getMessageCodeBlock(stderr);
+const isModuleNotFoundMessage = line => {
+  return line.includes('[ERR_MODULE_NOT_FOUND]');
+};
+const getModuleNotFoundError = stderr => {
+  const lines = splitLines$1(stderr);
+  const messageIndex = lines.findIndex(isModuleNotFoundMessage);
+  const message = lines[messageIndex];
   return {
-    message: `Incompatible native node module: ${message}`,
-    code: E_INCOMPATIBLE_NATIVE_MODULE
+    message,
+    code: ERR_MODULE_NOT_FOUND
   };
 };
-const isModulesSyntaxError = stderr => {
+const isModuleNotFoundError = stderr => {
   if (!stderr) {
     return false;
   }
-  return stderr.includes('SyntaxError: Cannot use import statement outside a module');
-};
-const getModuleSyntaxError = () => {
-  return {
-    message: `ES Modules are not supported in electron`,
-    code: E_MODULES_NOT_SUPPORTED_IN_ELECTRON
-  };
+  return stderr.includes('ERR_MODULE_NOT_FOUND');
 };
-const isModuleNotFoundError = stderr => {
+const isModulesSyntaxError = stderr => {
   if (!stderr) {
     return false;
   }
-  return stderr.includes('ERR_MODULE_NOT_FOUND');
+  return stderr.includes('SyntaxError: Cannot use import statement outside a module');
 };
-const isNormalStackLine = line => {
-  return RE_AT.test(line) && !RE_AT_PROMISE_INDEX.test(line);
+const RE_NATIVE_MODULE_ERROR = /^innerError Error: Cannot find module '.*.node'/;
+const RE_NATIVE_MODULE_ERROR_2 = /was compiled against a different Node.js version/;
+const isUnhelpfulNativeModuleError = stderr => {
+  return RE_NATIVE_MODULE_ERROR.test(stderr) && RE_NATIVE_MODULE_ERROR_2.test(stderr);
 };
-const getDetails = lines => {
-  const index = lines.findIndex(isNormalStackLine);
-  if (index === -1) {
-    return {
-      actualMessage: joinLines$1(lines),
-      rest: []
-    };
-  }
-  let lastIndex = index - 1;
-  while (++lastIndex < lines.length) {
-    if (!isNormalStackLine(lines[lastIndex])) {
-      break;
-    }
-  }
+const getNativeModuleErrorMessage = stderr => {
+  const message = getMessageCodeBlock(stderr);
   return {
-    actualMessage: lines[index - 1],
-    rest: lines.slice(index, lastIndex)
+    message: `Incompatible native node module: ${message}`,
+    code: E_INCOMPATIBLE_NATIVE_MODULE
+  };
+};
+const getModuleSyntaxError = () => {
+  return {
+    message: `ES Modules are not supported in electron`,
+    code: E_MODULES_NOT_SUPPORTED_IN_ELECTRON
   };
 };
 const getHelpfulChildProcessError = (stdout, stderr) => {
@@ -285,7 +285,7 @@ const getHelpfulChildProcessError = (stdout, stderr) => {
     rest
   } = getDetails(lines);
   return {
-    message: `${actualMessage}`,
+    message: actualMessage,
     code: '',
     stack: rest
   };
@@ -327,7 +327,7 @@ const listen$7 = () => {
   }
   return globalThis;
 };
-const signal$7 = global => {
+const signal$8 = global => {
   global.postMessage(readyMessage);
 };
 class IpcChildWithModuleWorker extends Ipc {
@@ -353,7 +353,7 @@ class IpcChildWithModuleWorker extends Ipc {
     this._rawIpc.addEventListener('message', callback);
   }
 }
-const wrap$e = global => {
+const wrap$f = global => {
   return new IpcChildWithModuleWorker(global);
 };
 const withResolvers = () => {
@@ -362,6 +362,7 @@ const withResolvers = () => {
     _resolve = resolve;
   });
   return {
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
     resolve: _resolve,
     promise
   };
@@ -380,8 +381,8 @@ const waitForFirstMessage = async port => {
 };
 const listen$6 = async () => {
   const parentIpcRaw = listen$7();
-  signal$7(parentIpcRaw);
-  const parentIpc = wrap$e(parentIpcRaw);
+  signal$8(parentIpcRaw);
+  const parentIpc = wrap$f(parentIpcRaw);
   const firstMessage = await waitForFirstMessage(parentIpc);
   if (firstMessage.method !== 'initialize') {
     throw new IpcError('unexpected first message');
@@ -400,9 +401,6 @@ const listen$6 = async () => {
   return globalThis;
 };
 class IpcChildWithModuleWorkerAndMessagePort extends Ipc {
-  constructor(port) {
-    super(port);
-  }
   getData(event) {
     return getData$2(event);
   }
@@ -426,13 +424,13 @@ class IpcChildWithModuleWorkerAndMessagePort extends Ipc {
     this._rawIpc.start();
   }
 }
-const wrap$d = port => {
+const wrap$e = port => {
   return new IpcChildWithModuleWorkerAndMessagePort(port);
 };
 const IpcChildWithModuleWorkerAndMessagePort$1 = {
   __proto__: null,
   listen: listen$6,
-  wrap: wrap$d
+  wrap: wrap$e
 };
 
 const Two = '2.0';
@@ -444,10 +442,10 @@ const create$4 = (method, params) => {
   };
 };
 const callbacks = Object.create(null);
-const set = (id, fn) => {
+const set$1 = (id, fn) => {
   callbacks[id] = fn;
 };
-const get = id => {
+const get$1 = id => {
   return callbacks[id];
 };
 const remove$1 = id => {
@@ -457,31 +455,18 @@ let id = 0;
 const create$3 = () => {
   return ++id;
 };
-const warn = (...args) => {
-  console.warn(...args);
-};
 const registerPromise = () => {
   const id = create$3();
   const {
     resolve,
     promise
   } = Promise.withResolvers();
-  set(id, resolve);
+  set$1(id, resolve);
   return {
     id,
     promise
   };
 };
-const resolve = (id, response) => {
-  const fn = get(id);
-  if (!fn) {
-    console.log(response);
-    warn(`callback ${id} may already be disposed`);
-    return;
-  }
-  fn(response);
-  remove$1(id);
-};
 const create$2 = (method, params) => {
   const {
     id,
@@ -629,6 +614,19 @@ const unwrapJsonRpcResult = responseMessage => {
   }
   throw new JsonRpcError('unexpected response message');
 };
+const warn = (...args) => {
+  console.warn(...args);
+};
+const resolve = (id, response) => {
+  const fn = get$1(id);
+  if (!fn) {
+    console.log(response);
+    warn(`callback ${id} may already be disposed`);
+    return;
+  }
+  fn(response);
+  remove$1(id);
+};
 const E_COMMAND_NOT_FOUND = 'E_COMMAND_NOT_FOUND';
 const getErrorType = prettyError => {
   if (prettyError && prettyError.type) {
@@ -798,6 +796,8 @@ const execute = (command, ...args) => {
 
 const createRpc = ipc => {
   const rpc = {
+    // @ts-ignore
+    ipc,
     /**
      * @deprecated
      */
@@ -824,7 +824,8 @@ const logError = () => {
 };
 const handleMessage = event => {
   const actualRequiresSocket = event?.target?.requiresSocket || requiresSocket;
-  return handleJsonRpcMessage(event.target, event.data, execute, resolve, preparePrettyError, logError, actualRequiresSocket);
+  const actualExecute = event?.target?.execute || execute;
+  return handleJsonRpcMessage(event.target, event.data, actualExecute, resolve, preparePrettyError, logError, actualRequiresSocket);
 };
 const handleIpc = ipc => {
   if ('addEventListener' in ipc) {
@@ -958,7 +959,7 @@ const computeExplorerRenamedDirent = (dirents, index, newName) => {
     if (dirent.depth < depth) {
       break;
     }
-    if (insertIndex === -1 && compareDirent(dirent, newDirent === -1)) {
+    if (insertIndex === -1 && compareDirent(dirent, newDirent) === -1) {
       for (; endIndex < dirents.length; endIndex++) {
       }
       insertIndex = endIndex;
@@ -1009,17 +1010,20 @@ const CreateFile = 1;
 const CreateFolder = 2;
 const Rename$1 = 3;
 
-const state = {
-  rpc: undefined
+const RendererWorker = 1;
+
+const rpcs = Object.create(null);
+const set = (id, rpc) => {
+  rpcs[id] = rpc;
+};
+const get = id => {
+  return rpcs[id];
 };
+
 const invoke = (method, ...params) => {
-  const rpc = state.rpc;
-  // @ts-ignore
+  const rpc = get(RendererWorker);
   return rpc.invoke(method, ...params);
 };
-const setRpc = rpc => {
-  state.rpc = rpc;
-};
 
 const remove = async dirent => {
   return invoke('FileSystem.remove', dirent);
@@ -1128,15 +1132,21 @@ const acceptCreate = async (state, newDirentType, createFn) => {
       deltaPosInSet = 1 - 1;
       break;
     } else {
+      // @ts-ignore
       posInSet = dirent.posInSet + 1;
+      // @ts-ignore
       setSize = dirent.setSize + 1;
+      // @ts-ignore
       insertIndex = i;
     }
+    // @ts-ignore
     dirent.setSize++;
+    // @ts-ignore
     dirent.posInSet += deltaPosInSet;
   }
   newDirent.setSize = setSize;
   newDirent.posInSet = posInSet;
+  // @ts-ignore
   items.splice(insertIndex + 1, 0, newDirent);
   const newDirents = [...items];
   const newMaxlineY = Math.max(state.maxLineY, newDirents.length);
@@ -1173,6 +1183,7 @@ const acceptRename = async state => {
     focusedIndex
   } = computeExplorerRenamedDirent(items, editingIndex, editingValue);
   //  TODO move focused index
+  // @ts-ignore
   state.items = newDirents;
   return {
     ...state,
@@ -1184,7 +1195,7 @@ const acceptRename = async state => {
     focused: true
   };
 };
-const acceptEdit = state => {
+const acceptEdit = async state => {
   const {
     editingType
   } = state;
@@ -1218,11 +1229,6 @@ const isTopLevel$1 = dirent => {
   return dirent.depth === 1;
 };
 
-const IsTopLevel = {
-  __proto__: null,
-  isTopLevel: isTopLevel$1
-};
-
 const toCollapsedDirent = dirent => {
   if (dirent.type === DirectoryExpanded) {
     return {
@@ -1237,7 +1243,7 @@ const collapseAll$1 = state => {
   const {
     items
   } = state;
-  const newDirents = items.filter(IsTopLevel).map(toCollapsedDirent);
+  const newDirents = items.filter(isTopLevel$1).map(toCollapsedDirent);
   return {
     ...state,
     items: newDirents
@@ -1422,6 +1428,7 @@ const expandAll = async state => {
     if (dirent.depth === depth && dirent.type === Directory) {
       // TODO expand
       // TODO avoid mutating state here
+      // @ts-ignore
       dirent.type = DirectoryExpanding;
       // TODO handle error
       // TODO race condition
@@ -1432,6 +1439,7 @@ const expandAll = async state => {
       }
       newDirents.splice(newIndex + 1, 0, ...childDirents);
       // TODO avoid mutating state here
+      // @ts-ignore
       dirent.type = DirectoryExpanded;
       // await expand(state, dirent.index)
     }
@@ -1503,6 +1511,7 @@ const expandRecursively = async state => {
   // TODO race condition: what if folder is being collapse while it is recursively expanding?
   // TODO race condition: what if folder is being deleted while it is recursively expanding?
   // TODO race condition: what if a new file/folder is created while the folder is recursively expanding?
+  // @ts-ignore
   const childDirents = await getChildDirentsRecursively(dirent);
   const startIndex = focusedIndex;
   if (focusedIndex >= 0) {
@@ -1621,11 +1630,6 @@ const focusPrevious = state => {
 
 const Button$2 = 1;
 
-const CollapseAll = 'CollapseAll';
-const NewFile$1 = 'NewFile';
-const NewFolder$1 = 'NewFolder';
-const Refresh = 'Refresh';
-
 const emptyObject = {};
 const RE_PLACEHOLDER = /\{(PH\d+)\}/g;
 const i18nString = (key, placeholders = emptyObject) => {
@@ -1638,8 +1642,8 @@ const i18nString = (key, placeholders = emptyObject) => {
   return key.replaceAll(RE_PLACEHOLDER, replacer);
 };
 
-const NewFile = 'New File...';
-const NewFolder = 'New Folder...';
+const NewFile$1 = 'New File...';
+const NewFolder$1 = 'New Folder...';
 const OpenContainingFolder = 'Open Containing Folder';
 const OpenInIntegratedTerminal = 'Open in integrated Terminal';
 const Cut$1 = 'Cut';
@@ -1656,10 +1660,10 @@ const YouHaveNotYetOpenedAFolder = 'You have not yet opened a folder';
 const OpenFolder = 'Open folder';
 
 const newFile$1 = () => {
-  return i18nString(NewFile);
+  return i18nString(NewFile$1);
 };
 const newFolder$1 = () => {
-  return i18nString(NewFolder);
+  return i18nString(NewFolder$1);
 };
 const openContainingFolder$1 = () => {
   return i18nString(OpenContainingFolder);
@@ -1704,6 +1708,11 @@ const openFolder$1 = () => {
   return i18nString(OpenFolder);
 };
 
+const CollapseAll = 'CollapseAll';
+const NewFile = 'NewFile';
+const NewFolder = 'NewFolder';
+const Refresh = 'Refresh';
+
 const getActions = root => {
   if (!root) {
     return [];
@@ -1711,12 +1720,12 @@ const getActions = root => {
   return [{
     type: Button$2,
     id: newFile$1(),
-    icon: NewFile$1,
+    icon: NewFile,
     command: 'newFile'
   }, {
     type: Button$2,
     id: newFolder$1(),
-    icon: NewFolder$1,
+    icon: NewFolder,
     command: 'newFolder'
   }, {
     type: Button$2,
@@ -1739,6 +1748,7 @@ const TreeItem$1 = 'treeitem';
 const Actions = 'Actions';
 const Button$1 = 'Button';
 const ButtonPrimary = 'ButtonPrimary';
+const Chevron = 'Chevron';
 const Explorer$1 = 'Explorer';
 const FileIcon = 'FileIcon';
 const IconButton = 'IconButton';
@@ -1775,11 +1785,6 @@ const getFileIconVirtualDom = icon => {
   };
 };
 
-const defaultIndent = 1;
-const getTreeItemIndent = depth => {
-  return `${depth * defaultIndent}rem`;
-};
-
 const ExplorerInput = 'ExploreerInput';
 
 const text = data => {
@@ -1799,8 +1804,11 @@ const getItemVirtualDomFile = item => {
     path,
     depth,
     isFocused,
-    isEditing
+    isEditing,
+    indent
   } = item;
+
+  // TODO avoid mutation
   const dom = [];
   dom.push({
     type: Div,
@@ -1812,7 +1820,7 @@ const getItemVirtualDomFile = item => {
     ariaSetSize: setSize,
     ariaLevel: depth,
     childCount: 2,
-    paddingLeft: getTreeItemIndent(depth),
+    paddingLeft: indent,
     ariaLabel: name,
     ariaDescription: ''
   }, getFileIconVirtualDom(icon));
@@ -1840,6 +1848,22 @@ const getItemVirtualDomFile = item => {
   }
   return dom;
 };
+
+const getChevronDownVirtualDom = () => {
+  return {
+    type: Div,
+    className: `${Chevron} MaskIconChevronDown`,
+    childCount: 0
+  };
+};
+const getChevronRightVirtualDom = () => {
+  return {
+    type: Div,
+    className: `${Chevron} MaskIconChevronRight`,
+    childCount: 0
+  };
+};
+
 const getItemVirtualDomFolder = item => {
   const {
     posInSet,
@@ -1849,19 +1873,25 @@ const getItemVirtualDomFolder = item => {
     path,
     depth,
     type,
-    isFocused
+    isFocused,
+    useChevrons,
+    indent
   } = item;
   let ariaExpanded = '';
+  let chevron;
   switch (type) {
     // TODO decide on directory vs folder
     case Directory:
       ariaExpanded = 'false';
+      chevron = getChevronRightVirtualDom();
       break;
     case DirectoryExpanding:
       ariaExpanded = 'true'; // TODO tree should be aria-busy then
+      chevron = getChevronRightVirtualDom();
       break;
     case DirectoryExpanded:
       ariaExpanded = 'true';
+      chevron = getChevronDownVirtualDom();
       break;
   }
   const dom = [];
@@ -1875,11 +1905,17 @@ const getItemVirtualDomFolder = item => {
     ariaSetSize: setSize,
     ariaLevel: depth,
     childCount: 2,
-    paddingLeft: getTreeItemIndent(depth),
+    paddingLeft: indent,
     ariaLabel: name,
     ariaExpanded,
     ariaDescription: ''
   });
+  if (useChevrons) {
+    // @ts-ignore
+    dom[0].childCount++;
+    // @ts-ignore
+    dom.push(chevron);
+  }
   dom.push(getFileIconVirtualDom(icon), {
     type: Div,
     className: Label,
@@ -1891,6 +1927,7 @@ const getItemVirtualDomFolder = item => {
   }
   return dom;
 };
+
 const getExplorerItemVirtualDom = item => {
   const {
     type
@@ -1935,6 +1972,7 @@ const getExplorerVirtualDom = (visibleItems, focusedIndex, root, isWide) => {
   if (!root) {
     return getExplorerWelcomeVirtualDom(isWide);
   }
+  // TODO
   const dom = [];
   dom.push({
     type: Div,
@@ -2167,24 +2205,35 @@ const getMenuEntries = state => {
   }
 };
 
-const getVisibleExplorerItems = (items, minLineY, maxLineY, focusedIndex, editingIndex, editingType, editingValue, icons) => {
+const defaultIndent = 1;
+const getTreeItemIndent = depth => {
+  // TODO logic should be in getVisibleItems
+  return `${depth * defaultIndent}rem`;
+};
+
+const getVisibleExplorerItems = (items, minLineY, maxLineY, focusedIndex, editingIndex, editingType, editingValue, icons, useChevrons) => {
   const visible = [];
   let iconIndex = 0;
   for (let i = minLineY; i < Math.min(maxLineY, items.length); i++) {
     const item = items[i];
     const icon = icons[iconIndex++];
+    const indent = getTreeItemIndent(item.depth);
     if (i === editingIndex) {
       visible.push({
         ...item,
         isFocused: i === focusedIndex,
         isEditing: true,
-        icon
+        icon,
+        useChevrons,
+        indent
       });
     } else {
       visible.push({
         ...item,
         isFocused: i === focusedIndex,
-        icon
+        icon,
+        useChevrons,
+        indent
       });
     }
   }
@@ -2198,7 +2247,9 @@ const getVisibleExplorerItems = (items, minLineY, maxLineY, focusedIndex, editin
       name: 'new',
       path: '/test/new',
       type: 2,
-      isEditing: true
+      isEditing: true,
+      useChevrons,
+      indent: ''
     });
   }
   return visible;
@@ -2315,7 +2366,7 @@ const handleClickDirectoryExpanded$1 = async (state, dirent, index, keepFocus) =
   };
 };
 
-const handleClickDirectoryExpanding = (state, dirent, index, keepFocus) => {
+const handleClickDirectoryExpanding = async (state, dirent, index, keepFocus) => {
   dirent.type = Directory;
   dirent.icon = getIcon();
   return {
@@ -2500,7 +2551,7 @@ const handleClickDirectoryExpanded = (state, dirent, index, keepFocus) => {
     focused: keepFocus
   };
 };
-const handleClick = (state, index, keepFocus = false) => {
+const handleClick = async (state, index, keepFocus = false) => {
   const {
     items,
     minLineY
@@ -2552,6 +2603,7 @@ const handleArrowRightDirectoryExpanded = (state, dirent) => {
   if (nextDirent.depth === dirent.depth + 1) {
     return focusIndex(state, focusedIndex + 1);
   }
+  return state;
 };
 const handleArrowRight = async state => {
   const {
@@ -2669,7 +2721,7 @@ const handleCopy = async state => {
   const dirent = getFocusedDirent$1(state);
   if (!dirent) {
     console.info('[ViewletExplorer/handleCopy] no dirent selected');
-    return;
+    return state;
   }
   const absolutePath = dirent.path;
   // TODO handle copy error gracefully
@@ -2737,23 +2789,13 @@ const handleDragOver = (state, x, y) => {
   };
 };
 
-const getFilePathElectron = async file => {
-  return invoke('GetFilePathElectron.getFilePathElectron', file);
+const uploadFileSystemHandles = async (root, pathSeparator, fileSystemHandles) => {
+  // TODO send to renderer worker
 };
 
 const mergeDirents$2 = (oldDirents, newDirents) => {
   return newDirents;
 };
-
-// TODO copy files in parallel
-const copyFilesElectron = async (root, pathSeparator, files) => {
-  for (const file of files) {
-    const from = await getFilePathElectron(file);
-    // const from = file.path
-    const to = join(pathSeparator, root, file.name);
-    await copy$1(from, to);
-  }
-};
 const getMergedDirents$2 = async (root, pathSeparator, dirents) => {
   const childDirents = await getChildDirents(pathSeparator, {
     path: root,
@@ -2768,7 +2810,10 @@ const handleDrop$2 = async (state, files) => {
     pathSeparator,
     items
   } = state;
-  await copyFilesElectron(root, pathSeparator, files);
+  const handled = await uploadFileSystemHandles();
+  if (handled) {
+    return state;
+  }
   const mergedDirents = await getMergedDirents$2(root, pathSeparator, items);
   return {
     ...state,
@@ -2777,13 +2822,23 @@ const handleDrop$2 = async (state, files) => {
   };
 };
 
-const uploadFileSystemHandles = async (root, pathSeparator, fileSystemHandles) => {
-  // TODO send to renderer worker
+const getFilePathElectron = async file => {
+  return invoke('GetFilePathElectron.getFilePathElectron', file);
 };
 
 const mergeDirents$1 = (oldDirents, newDirents) => {
   return newDirents;
 };
+
+// TODO copy files in parallel
+const copyFilesElectron = async (root, pathSeparator, files) => {
+  for (const file of files) {
+    const from = await getFilePathElectron(file);
+    // const from = file.path
+    const to = join(pathSeparator, root, file.name);
+    await copy$1(from, to);
+  }
+};
 const getMergedDirents$1 = async (root, pathSeparator, dirents) => {
   const childDirents = await getChildDirents(pathSeparator, {
     path: root,
@@ -2798,10 +2853,7 @@ const handleDrop$1 = async (state, files) => {
     pathSeparator,
     items
   } = state;
-  const handled = await uploadFileSystemHandles();
-  if (handled) {
-    return state;
-  }
+  await copyFilesElectron(root, pathSeparator, files);
   const mergedDirents = await getMergedDirents$1(root, pathSeparator, items);
   return {
     ...state,
@@ -2812,11 +2864,12 @@ const handleDrop$1 = async (state, files) => {
 
 const getModule = isElectron => {
   if (isElectron) {
-    return handleDrop$2;
+    return handleDrop$1;
   }
-  return handleDrop$1;
+  return handleDrop$2;
 };
 const handleDropRoot = async (state, files) => {
+  // @ts-ignore
   const fn = await getModule(state.isElectron);
   return fn(state, files);
 };
@@ -2869,7 +2922,7 @@ const handleDropIntoFile = (state, dirent, index, files) => {
   // @ts-ignore
   return handleDropIndex(parentIndex);
 };
-const handleDropIndex = (state, index, files) => {
+const handleDropIndex = async (state, index, files) => {
   const {
     items
   } = state;
@@ -2968,6 +3021,7 @@ const handlePasteCopy = async (state, nativeFiles) => {
   // TODO handle pasting files into hardlink
   // TODO what if folder is big and it takes a long time
   for (const source of nativeFiles.files) {
+    // @ts-ignore
     const target = join(state.pathSeperator, state.root, getBaseName(state.pathSeparator, source));
     await copy$1(source, target);
   }
@@ -2983,7 +3037,7 @@ const handlePasteCut = async (state, nativeFiles) => {
   return state;
 };
 
-const handlePasteNone = (state, nativeFiles) => {
+const handlePasteNone = async (state, nativeFiles) => {
   console.info('[ViewletExplorer/handlePaste] no paths detected');
   return state;
 };
@@ -3189,6 +3243,7 @@ const getSavedRoot$1 = (savedState, workspacePath) => {
   return workspacePath;
 };
 const loadContent = async (state, savedState) => {
+  const useChevrons = true;
   const workspacePath = await getWorkspacePath();
   const root = getSavedRoot$1(savedState, workspacePath);
   // TODO path separator could be restored from saved state
@@ -3218,7 +3273,8 @@ const loadContent = async (state, savedState) => {
     deltaY,
     maxLineY,
     pathSeparator,
-    excluded
+    excluded,
+    useChevrons
   };
 };
 
@@ -3232,12 +3288,12 @@ const handleWorkspaceChange = async state => {
   return newState;
 };
 
-const ExplorerEditBox = FocusExplorerEditBox;
-
 const setFocus = key => {
   return invoke('Focus.setFocus', key);
 };
 
+const ExplorerEditBox = FocusExplorerEditBox;
+
 const newDirent = async (state, editingType) => {
   // TODO make focus functional instead of side effect
   await setFocus(ExplorerEditBox);
@@ -3309,12 +3365,14 @@ const removeDirent = async state => {
     // on web should probably show notification (dialog)
     // ErrorHandling.handleError(error)
     // await ErrorHandling.showErrorDialog(error)
-    return;
+    return state;
   }
   // TODO avoid state mutation
+  // @ts-ignore
   const newVersion = ++state.version;
   // TODO race condition
   // const newState = await loadContent(state:any)
+  // @ts-ignore
   if (state.version !== newVersion || state.disposed) {
     return state;
   }
@@ -3348,6 +3406,7 @@ const removeDirent = async state => {
   return {
     ...state,
     items: newDirents,
+    // @ts-ignore
     icons,
     focusedIndex: indexToFocus
   };
@@ -3373,7 +3432,11 @@ const renderItems = {
     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;
   },
   apply(oldState, newState) {
-    const visibleDirents = getVisibleExplorerItems(newState.items, newState.minLineY, newState.maxLineY, newState.focusedIndex, newState.editingIndex, newState.editingType, newState.editingValue, newState.icons);
+    const visibleDirents = getVisibleExplorerItems(newState.items, newState.minLineY, newState.maxLineY, newState.focusedIndex, newState.editingIndex, newState.editingType, newState.editingValue,
+    // @ts-ignore
+    newState.icons,
+    // @ts-ignore
+    newState.useChevrons);
     const isWide = newState.width > 450;
     const dom = getExplorerVirtualDom(visibleDirents, newState.focusedIndex, newState.root, isWide);
     return ['Viewlet.setDom2', dom];
@@ -3440,7 +3503,7 @@ const getActionButtonVirtualDom = action => {
     title: id,
     'data-command': command,
     childCount: 1
-  }, getIconVirtualDom(icon)];
+  }, getIconVirtualDom(icon || '')];
 };
 
 const getActionVirtualDom = action => {
@@ -3833,7 +3896,7 @@ const listen = async () => {
   const rpc = await WebWorkerRpcClient.create({
     commandMap: commandMap
   });
-  setRpc(rpc);
+  set(RendererWorker, rpc);
 };
 
 const main = async () => {

package/package.json

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