@lvce-editor/explorer-view 2.62.0 → 2.63.0

package/dist/explorerViewWorkerMain.js

@@ -2930,9 +2930,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 +3658,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 +4085,10 @@ const handlePointerDown = (state, button, x, y) => {
       focus: List
     };
   }
-  return state;
+  return {
+    ...state,
+    focusedIndex: index
+  };
 };
 
 const handleUpload = async (state, dirents) => {
@@ -4610,12 +4622,35 @@ const renameDirent = state => {
   };
 };
 
-const renderDragData = (oldState, newState) => {
+const getDragLabel = urls => {
+  if (urls.length === 1) {
+    return urls[0];
+  }
+  return `${urls.length}`;
+};
+const getDragData = urls => {
+  const data = urls.join('\n');
   // TODO send selected urls
   const dragData = [{
     type: 'text/plain',
-    data: 'https://example.com'
+    data
+  }, {
+    type: 'text/uri-list',
+    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];
 };
 
@@ -5010,16 +5045,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 +5095,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 +5127,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 +5335,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 +5363,11 @@ const renderEventListeners = () => {
     name: HandleDragStart,
     params: ['handleDragStart'],
     // @ts-ignore
-    dragInfo: {
-      'text/uri': 'abc'
-    }
+    dragInfo: [{
+      type: 'text/plain',
+      data: 'https://example.com'
+    }],
+    dragEffect: 'copyMove'
   }];
 };
 

package/package.json

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