@lvce-editor/explorer-view 2.62.0 → 3.0.0

package/dist/explorerViewWorkerMain.js

@@ -2085,6 +2085,11 @@ const RenderValue = 8;
 const RenderSelection = 9;
 const RenderDragData = 10;
 
+const diffType$4 = RenderDragData;
+const isEqual$5 = (oldState, newState) => {
+  return oldState.isPointerDown || !newState.isPointerDown;
+};
+
 const diffType$3 = RenderFocus;
 const isEqual$4 = (oldState, newState) => {
   return oldState.focused === newState.focused && oldState.focus === newState.focus;
@@ -2108,8 +2113,8 @@ const isEqual$1 = (oldState, newState) => {
   return oldState.focus === Input$1 && newState.focus === Input$1 && oldState.editingValue === newState.editingValue;
 };
 
-const modules = [isEqual$3, isEqual$4, isEqual$4, isEqual$1, isEqual$2];
-const numbers = [diffType$2, diffType$3, RenderFocusContext, diffType, diffType$1];
+const modules = [isEqual$3, isEqual$4, isEqual$4, isEqual$1, isEqual$2, isEqual$5];
+const numbers = [diffType$2, diffType$3, RenderFocusContext, diffType, diffType$1, diffType$4];
 
 const diff = (oldState, newState) => {
   const diffResult = [];
@@ -2930,9 +2935,19 @@ const handleArrowRight = async state => {
 const handleBlur = async state => {
   // TODO when blur event occurs because of context menu, focused index should stay the same
   // but focus outline should be removed
+  const {
+    items
+  } = state;
+  const newItems = items.map(item => {
+    return {
+      ...item,
+      selected: false
+    };
+  });
   return {
     ...state,
-    focused: false
+    focused: false,
+    items: newItems
   };
 };
 
@@ -3648,8 +3663,7 @@ const handleDropIntoFile = (state, dirent, index, fileHandles, files, paths) =>
   if (parentIndex === -1) {
     return handleDropRoot(state, fileHandles, files, paths);
   }
-  // @ts-ignore
-  return handleDropIndex(parentIndex);
+  return handleDropIndex(state, fileHandles, files, paths, parentIndex);
 };
 const handleDropIndex = async (state, fileHandles, files, paths, index) => {
   const {
@@ -4076,7 +4090,10 @@ const handlePointerDown = (state, button, x, y) => {
       focus: List
     };
   }
-  return state;
+  return {
+    ...state,
+    focusedIndex: index
+  };
 };
 
 const handleUpload = async (state, dirents) => {
@@ -4610,12 +4627,41 @@ const renameDirent = state => {
   };
 };
 
-const renderDragData = (oldState, newState) => {
-  // TODO send selected urls
+const getDragLabel = urls => {
+  if (urls.length === 1) {
+    return urls[0];
+  }
+  return `${urls.length}`;
+};
+
+const toUri = path => {
+  if (path.startsWith('file://')) {
+    return path;
+  }
+  return 'file://' + path;
+};
+const getDragData = urls => {
+  const data = urls.map(toUri).join('\n');
   const dragData = [{
+    type: 'text/uri-list',
+    data
+  }, {
     type: 'text/plain',
-    data: 'https://example.com'
+    data
   }];
+  // @ts-ignore
+  dragData.label = getDragLabel(urls);
+  return dragData;
+};
+
+const renderDragData = (oldState, newState) => {
+  const {
+    items,
+    focusedIndex
+  } = newState;
+  const selected = items.filter((item, index) => item.selected || index === focusedIndex);
+  const urls = selected.map(item => item.path);
+  const dragData = getDragData(urls);
   return ['Viewlet.setDragData', newState.uid, dragData];
 };
 
@@ -4905,6 +4951,7 @@ const getListItemsVirtualDom = (visibleItems, focusedIndex, focused, dropTargets
     onContextMenu: HandleContextMenu,
     onDragLeave: HandleDragLeave,
     onDragOver: HandleDragOver,
+    onDragStart: HandleDragStart,
     onDrop: HandleDrop,
     onFocus: HandleListFocus,
     onPointerDown: HandlePointerDown,
@@ -5010,16 +5057,15 @@ const getExpandedType = type => {
   }
 };
 
-const focused = mergeClassNames(TreeItem, TreeItemActive);
-const selected = mergeClassNames(TreeItem, TreeItemActive);
-const getTreeItemClassName = (isSelected, isFocused) => {
-  if (isFocused) {
-    return focused;
+const getTreeItemClassName = (isSelected, isFocused, isDropping) => {
+  let className = TreeItem;
+  if (isSelected || isFocused) {
+    className = mergeClassNames(className, TreeItemActive);
   }
-  if (isSelected) {
-    return selected;
+  if (isDropping) {
+    className = mergeClassNames(className, 'DropTarget');
   }
-  return TreeItem;
+  return className;
 };
 
 const defaultIndent$1 = 1;
@@ -5061,7 +5107,8 @@ const getVisibleExplorerItems = (items, minLineY, maxLineY, focusedIndex, editin
     const id = isFocused ? 'TreeItemActive' : undefined;
     const isSelected = item.selected;
     const isCut = cutItems.includes(item.path);
-    const className = getTreeItemClassName(isSelected, isFocused); // TODO compute classname in dom function
+    const isDropping = dropTargets.includes(i);
+    const className = getTreeItemClassName(isSelected, isFocused, isDropping); // TODO compute classname in dom function
     const expanded = getExpandedType(item.type);
     const ariaExpanded = ariaExpandedValues[expanded];
     const isEditing = i === editingIndex;
@@ -5092,25 +5139,25 @@ const getVisibleExplorerItems = (items, minLineY, maxLineY, focusedIndex, editin
 
 const renderItems = (oldState, newState) => {
   const {
-    items,
-    minLineY,
-    maxLineY,
-    focusedIndex,
+    cutItems,
+    deltaY,
+    dropTargets,
+    editingErrorMessage,
+    editingIcon,
     editingIndex,
     editingType,
     editingValue,
-    editingErrorMessage,
+    focused,
+    focusedIndex,
+    height,
     icons,
-    useChevrons,
-    dropTargets,
-    editingIcon,
     itemHeight,
-    width,
+    items,
+    maxLineY,
+    minLineY,
     root,
-    deltaY,
-    focused,
-    height,
-    cutItems
+    useChevrons,
+    width
   } = newState;
   const visibleDirents = getVisibleExplorerItems(items, minLineY, maxLineY, focusedIndex, editingIndex, editingType, editingValue, editingErrorMessage, icons, useChevrons, dropTargets, editingIcon, cutItems);
   const isWide = width > 450;
@@ -5300,8 +5347,8 @@ const renderEventListeners = () => {
     preventDefault: true
   }, {
     name: HandlePointerDown,
-    params: ['handlePointerDown', 'event.button', 'event.clientX', 'event.clientY'],
-    preventDefault: true
+    params: ['handlePointerDown', 'event.button', 'event.clientX', 'event.clientY']
+    // preventDefault: true,
   }, {
     name: HandleEditingInput,
     params: ['updateEditingValue', 'event.target.value']
@@ -5328,9 +5375,7 @@ const renderEventListeners = () => {
     name: HandleDragStart,
     params: ['handleDragStart'],
     // @ts-ignore
-    dragInfo: {
-      'text/uri': 'abc'
-    }
+    dragEffect: 'copyMove'
   }];
 };
 

package/package.json

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