@noya-app/noya-file-explorer 0.0.14 → 0.0.16

package/dist/index.js

@@ -44,10 +44,10 @@ var require_access = __commonJS({
         const accessed = _getPath(node, indexPath, options);
         return accessed[accessed.length - 1];
       }
-      let path4 = indexPath.slice();
-      while (path4.length > 0) {
-        let index = path4.shift();
-        const children = options.getChildren(node, path4);
+      let path5 = indexPath.slice();
+      while (path5.length > 0) {
+        let index = path5.shift();
+        const children = options.getChildren(node, path5);
         const child = children[index];
         if (!child) {
           return void 0;
@@ -60,12 +60,12 @@ var require_access = __commonJS({
       return _getPath(node, indexPath, options).slice(0, -1);
     }
     function _getPath(node, indexPath, options) {
-      let path4 = indexPath.slice();
+      let path5 = indexPath.slice();
       let result = [node];
-      while (path4.length > 0) {
-        let index = path4.shift();
+      while (path5.length > 0) {
+        let index = path5.shift();
         const context = options.includeTraversalContext ? makeTraversalContext(result) : void 0;
-        const children = options.getChildren(node, path4, context);
+        const children = options.getChildren(node, path5, context);
         const child = children[index];
         if (!child) {
           return result;
@@ -80,20 +80,20 @@ var require_access = __commonJS({
         const accessed = accessPath(node, indexPath, options);
         return accessed[accessed.length - 1];
       }
-      let path4 = indexPath.slice();
-      while (path4.length > 0) {
-        let index = path4.shift();
-        node = options.getChildren(node, path4)[index];
+      let path5 = indexPath.slice();
+      while (path5.length > 0) {
+        let index = path5.shift();
+        node = options.getChildren(node, path5)[index];
       }
       return node;
     }
     function accessPath(node, indexPath, options) {
-      let path4 = indexPath.slice();
+      let path5 = indexPath.slice();
       let result = [node];
-      while (path4.length > 0) {
-        let index = path4.shift();
+      while (path5.length > 0) {
+        let index = path5.shift();
         const context = options.includeTraversalContext ? makeTraversalContext(result) : void 0;
-        node = options.getChildren(node, path4, context)[index];
+        node = options.getChildren(node, path5, context)[index];
         result.push(node);
       }
       return result;
@@ -607,40 +607,40 @@ var require_transformPath = __commonJS({
     Object.defineProperty(exports2, "__esModule", { value: true });
     exports2.transformPath = transformPath;
     var sort_1 = require_sort();
-    function commonAncestor(path4, otherPath) {
-      const length = Math.min(path4.length, otherPath.length);
+    function commonAncestor(path5, otherPath) {
+      const length = Math.min(path5.length, otherPath.length);
       for (let i = 0; i < length; i++) {
-        if (path4[i] !== otherPath[i]) {
-          return path4.slice(0, i);
+        if (path5[i] !== otherPath[i]) {
+          return path5.slice(0, i);
         }
       }
-      return path4.slice(0, length);
+      return path5.slice(0, length);
     }
-    function transformPath(path4, operation, otherPath, count = 1) {
-      if (otherPath.length > path4.length || (0, sort_1.comparePathsByComponent)(otherPath, path4) > 0) {
-        return path4;
+    function transformPath(path5, operation, otherPath, count = 1) {
+      if (otherPath.length > path5.length || (0, sort_1.comparePathsByComponent)(otherPath, path5) > 0) {
+        return path5;
       }
       if (otherPath.length === 0 && operation === "remove") {
         return void 0;
       }
-      const common = commonAncestor(path4, otherPath);
-      const adjustmentIndex = common.length === path4.length || common.length === otherPath.length ? common.length - 1 : common.length;
-      const pathValue = path4[adjustmentIndex];
+      const common = commonAncestor(path5, otherPath);
+      const adjustmentIndex = common.length === path5.length || common.length === otherPath.length ? common.length - 1 : common.length;
+      const pathValue = path5[adjustmentIndex];
       const otherPathValue = otherPath[adjustmentIndex];
       if (operation === "insert" && otherPathValue <= pathValue) {
-        const newPath = [...path4];
+        const newPath = [...path5];
         newPath[adjustmentIndex] += count;
         return newPath;
       } else if (operation === "remove") {
         if (otherPathValue === pathValue) {
           return void 0;
         } else if (otherPathValue < pathValue) {
-          const newPath = [...path4];
+          const newPath = [...path5];
           newPath[adjustmentIndex] -= count;
           return newPath;
         }
       }
-      return path4;
+      return path5;
     }
   }
 });
@@ -806,15 +806,15 @@ var require_operation = __commonJS({
       switch (operation.type) {
         case "insert": {
           const otherPath = parentPath.concat(operation.index);
-          return transformedPaths.map((path4) => path4 ? (0, transformPath_1.transformPath)(path4, "insert", otherPath, operation.nodes.length) : void 0);
+          return transformedPaths.map((path5) => path5 ? (0, transformPath_1.transformPath)(path5, "insert", otherPath, operation.nodes.length) : void 0);
         }
         case "remove": {
           const otherPaths = [...operation.indexes].reverse().map((index) => parentPath.concat(index));
-          return transformedPaths.map((path4) => {
+          return transformedPaths.map((path5) => {
             for (const otherPath of otherPaths) {
-              path4 = path4 ? (0, transformPath_1.transformPath)(path4, "remove", otherPath) : void 0;
+              path5 = path5 ? (0, transformPath_1.transformPath)(path5, "remove", otherPath) : void 0;
             }
-            return path4;
+            return path5;
           });
         }
         case "removeThenInsert": {
@@ -951,22 +951,22 @@ var require_splice = __commonJS({
       return _spliceWithPathTracking(node, options);
     }
     function _spliceWithPathTracking(node, options) {
-      const { path: path4, deleteCount = 0, nodes, track } = options;
-      if (path4.length === 0) {
+      const { path: path5, deleteCount = 0, nodes, track } = options;
+      if (path5.length === 0) {
         throw new Error(`Can't splice at the root`);
       }
-      const pathsToRemove = getPathsToRemove(path4, deleteCount);
-      const operations = (0, operation_1.getInsertionOperations)(path4, nodes, (0, operation_1.getRemovalOperations)(pathsToRemove));
+      const pathsToRemove = getPathsToRemove(path5, deleteCount);
+      const operations = (0, operation_1.getInsertionOperations)(path5, nodes, (0, operation_1.getRemovalOperations)(pathsToRemove));
       const transformedPaths = track ? (0, operation_1.transformPathsByOperations)(track, operations) : [];
       return {
         node: (0, operation_1.applyOperations)(node, operations, options),
         paths: transformedPaths
       };
     }
-    function getPathsToRemove(path4, deleteCount) {
+    function getPathsToRemove(path5, deleteCount) {
       let pathsToRemove = [];
-      let parentPath = path4.slice(0, -1);
-      let index = path4[path4.length - 1];
+      let parentPath = path5.slice(0, -1);
+      let index = path5[path5.length - 1];
       for (let i = 0; i < deleteCount; i++) {
         pathsToRemove.push(parentPath.concat(index + i));
       }
@@ -1111,6 +1111,7 @@ var src_exports = {};
 __export(src_exports, {
   MediaCollection: () => MediaCollection,
   PLACEHOLDER_ITEM_NAME: () => PLACEHOLDER_ITEM_NAME,
+  acceptsMediaItemDrop: () => acceptsMediaItemDrop,
   basenameValidator: () => basenameValidator,
   createMediaAsset: () => createMediaAsset,
   createMediaFile: () => createMediaFile,
@@ -1224,7 +1225,7 @@ var createMediaItemTree = (mediaMap) => {
 };
 
 // src/MediaCollection.tsx
-var import_imfs3 = require("imfs");
+var import_imfs4 = require("imfs");
 var import_react2 = __toESM(require("react"));
 
 // src/utils/files.ts
@@ -1247,6 +1248,9 @@ var getVisibleItems = ({
       }
       return;
     }
+    if (item.kind === "noyaFile" && fileKindFilter === "all") {
+      filteredItems.push(item);
+    }
     if (item.kind === "file" && fileKindFilter === "all") {
       filteredItems.push(item);
     }
@@ -1283,7 +1287,7 @@ var movePathsIntoTarget = ({
   tree
 }) => {
   const ancestors = (0, import_tree_visit2.ancestorPaths)(
-    sourceItemPaths.map((path4) => path4.split("/"))
+    sourceItemPaths.map((path5) => path5.split("/"))
   );
   const mediaClone = { ...media };
   for (const ancestor of ancestors) {
@@ -1330,7 +1334,7 @@ var moveUpAFolder = ({
   );
   const grandparentFolderPath = tree.idToPathMap.get(grandparentFolder.id);
   if (!grandparentFolderPath) return;
-  const sourceItemPaths = selectedIds.map((id) => tree.idToPathMap.get(id)).filter((path4) => Boolean(path4));
+  const sourceItemPaths = selectedIds.map((id) => tree.idToPathMap.get(id)).filter((path5) => Boolean(path5));
   return movePathsIntoTarget({
     media,
     targetItemPath: grandparentFolderPath,
@@ -1396,7 +1400,7 @@ var moveMediaInsideFolder = ({
 }) => {
   const targetItemPath = tree.idToPathMap.get(targetItemId);
   if (!targetItemPath) return media;
-  const sourceItemPaths = sourceItemIds.map((id) => tree.idToPathMap.get(id)).filter((path4) => Boolean(path4));
+  const sourceItemPaths = sourceItemIds.map((id) => tree.idToPathMap.get(id)).filter((path5) => Boolean(path5));
   return movePathsIntoTarget({
     media,
     sourceItemPaths,
@@ -1437,6 +1441,115 @@ var renameMediaItemAndDescendantPaths = ({
   return mediaClone;
 };
 
+// src/utils/handleFileDrop.ts
+var import_imfs3 = require("imfs");
+function isDirectoryEntry(entry) {
+  return entry.isDirectory;
+}
+function isFileEntry(entry) {
+  return entry.isFile;
+}
+async function handleDataTransfer({
+  dataTransfer,
+  rootItemPath,
+  media,
+  uploadAsset
+}) {
+  try {
+    const dataTransferItems = Array.from(dataTransfer.items ?? []);
+    const supportsEntries = dataTransferItems.some(
+      (item) => typeof item?.webkitGetAsEntry === "function"
+    );
+    const collectFromEntry = async (entry, basePath) => {
+      if (!entry) return [];
+      if (isFileEntry(entry)) {
+        const file = await new Promise(
+          (resolve) => entry.file((f) => resolve(f))
+        );
+        return [
+          {
+            file,
+            relativePath: import_imfs3.path.join(basePath, file.name)
+          }
+        ];
+      }
+      if (isDirectoryEntry(entry)) {
+        const reader = entry.createReader();
+        const readAll = async () => {
+          const all = [];
+          while (true) {
+            const entries = await new Promise(
+              (resolve) => reader.readEntries((ents) => resolve(ents))
+            );
+            if (!entries.length) break;
+            all.push(...entries);
+          }
+          return all;
+        };
+        const children = await readAll();
+        const results = await Promise.all(
+          children.map(
+            (child) => collectFromEntry(child, import_imfs3.path.join(basePath, entry.name))
+          )
+        );
+        return results.flat();
+      }
+      return [];
+    };
+    let dropped = [];
+    if (supportsEntries) {
+      const topLevelEntries = dataTransferItems.flatMap((item) => {
+        const entry = item.webkitGetAsEntry?.();
+        if (!entry) return [];
+        return [entry];
+      });
+      const nested = await Promise.all(
+        topLevelEntries.map((entry) => collectFromEntry(entry, ""))
+      );
+      dropped = nested.flat();
+    } else {
+      const files = Array.from(dataTransfer.files);
+      if (files.length === 0) return;
+      dropped = files.map((file) => ({
+        file,
+        // Best effort: try webkitRelativePath; fall back to name
+        relativePath: file.webkitRelativePath && file.webkitRelativePath.length > 0 ? file.webkitRelativePath : file.name
+      }));
+    }
+    if (dropped.length === 0) return;
+    const folderRelativePaths = /* @__PURE__ */ new Set();
+    for (const { relativePath } of dropped) {
+      const dir = import_imfs3.path.dirname(relativePath);
+      if (dir && dir !== ".") {
+        const parts = dir.split("/").filter(Boolean);
+        let acc = "";
+        for (const part of parts) {
+          acc = acc ? import_imfs3.path.join(acc, part) : part;
+          folderRelativePaths.add(acc);
+        }
+      }
+    }
+    const folderEntries = Array.from(folderRelativePaths).map((rel) => import_imfs3.path.join(rootItemPath, rel)).filter((full) => !media[full]).map((full) => [full, createMediaFolder()]);
+    const uploadResults = await Promise.all(
+      dropped.map(
+        async ({ file, relativePath }) => {
+          const asset = await uploadAsset(file);
+          return [
+            import_imfs3.path.join(rootItemPath, relativePath),
+            createMediaAsset({ assetId: asset.id })
+          ];
+        }
+      )
+    );
+    return {
+      ...media,
+      ...Object.fromEntries([...folderEntries, ...uploadResults])
+    };
+  } catch (error) {
+    console.error("Failed to upload dropped files:", error);
+  }
+}
+
 // src/MediaCollection.tsx
 var extensionToContentType = {
   svg: "image/svg+xml",
@@ -1444,7 +1557,7 @@ var extensionToContentType = {
   jpeg: "image/jpeg"
 };
 function encodeFileContentForThumbnail(pathProp, item) {
-  const extension = import_imfs3.path.extname(pathProp).slice(1);
+  const extension = import_imfs4.path.extname(pathProp).slice(1);
   const contentType = extensionToContentType[extension];
   if (contentType) {
     if (item.encoding === "base64") {
@@ -1471,7 +1584,8 @@ var MediaThumbnailInternal = (0, import_react_utils.memoGeneric)(
     item,
     selected,
     size,
-    path: pathProp
+    path: pathProp,
+    renderThumbnailIcon
   }) => {
     const asset = (0, import_noya_multiplayer_react.useAsset)(item.kind === "asset" ? item.assetId : void 0);
     const isRoot = item.id === rootMediaItem.id;
@@ -1489,7 +1603,7 @@ var MediaThumbnailInternal = (0, import_react_utils.memoGeneric)(
         url = encoded.url;
       }
     }
-    const fileName = pathProp ? import_imfs3.path.basename(pathProp) : void 0;
+    const fileName = pathProp ? import_imfs4.path.basename(pathProp) : void 0;
     return /* @__PURE__ */ import_react2.default.createElement(
       import_noya_designsystem.MediaThumbnail,
       {
@@ -1498,7 +1612,8 @@ var MediaThumbnailInternal = (0, import_react_utils.memoGeneric)(
         url,
         selected,
         size,
-        fileName
+        fileName,
+        renderThumbnailIcon
       }
     );
   }
@@ -1529,7 +1644,10 @@ var MediaCollection = (0, import_react.memo)(
     scrollable = false,
     sortable = false,
     renderEmptyState,
-    sharedDragProps
+    sharedDragProps,
+    onClickItem,
+    renderThumbnailIcon,
+    onDidDeleteItems
   }, ref) {
     const setMedia = (0, import_react.useCallback)(
       (...args) => {
@@ -1611,14 +1729,14 @@ var MediaCollection = (0, import_react.memo)(
       const itemPath = tree.idToPathMap.get(item.id);
       const firstSelectedPath = tree.idToPathMap.get(selectedIds[0]);
       if (!itemPath || !firstSelectedPath) return false;
-      return itemPath.startsWith(import_imfs3.path.dirname(firstSelectedPath));
+      return itemPath.startsWith(import_imfs4.path.dirname(firstSelectedPath));
     });
     (0, import_react.useEffect)(() => {
       if (initialExpanded) {
         setExpandedMap(initialExpanded);
       }
     }, [initialExpanded]);
-    const handleExpanded = (0, import_react.useCallback)(
+    const getExpanded = (0, import_react.useCallback)(
       (item) => {
         if (!expandable) return void 0;
         if (item.kind !== "folder") return void 0;
@@ -1629,6 +1747,14 @@ var MediaCollection = (0, import_react.memo)(
     );
     const handleDelete = (0, import_react.useCallback)(
       (selectedIds2) => {
+        const deletedItems = Object.entries(media).flatMap(
+          ([path5, item]) => {
+            if (selectedIds2.includes(item.id)) {
+              return [[path5, item]];
+            }
+            return [];
+          }
+        );
         const newMedia = deleteMediaItems({
           selectedIds: selectedIds2,
           media,
@@ -1636,8 +1762,9 @@ var MediaCollection = (0, import_react.memo)(
         });
         setSelectedIds([rootMediaItem.id]);
         setMedia({ name: "Delete items", timestamp: Date.now() }, newMedia);
+        onDidDeleteItems?.(deletedItems);
       },
-      [media, setMedia, setSelectedIds, tree]
+      [media, setMedia, setSelectedIds, tree, onDidDeleteItems]
     );
     const onRename = (0, import_react.useCallback)(
       (selectedItem, newName) => {
@@ -1675,7 +1802,7 @@ var MediaCollection = (0, import_react.memo)(
         const currentFolderPath = tree.idToPathMap.get(currentFolderId);
         if (!currentFolderPath) return;
         setTempItem([
-          import_imfs3.path.join(currentFolderPath, PLACEHOLDER_ITEM_NAME),
+          import_imfs4.path.join(currentFolderPath, PLACEHOLDER_ITEM_NAME),
           newFolder
         ]);
         setTimeout(() => {
@@ -1695,7 +1822,7 @@ var MediaCollection = (0, import_react.memo)(
         );
         if (!currentFolderPath) return;
         setTempItem([
-          import_imfs3.path.join(currentFolderPath, PLACEHOLDER_ITEM_NAME),
+          import_imfs4.path.join(currentFolderPath, PLACEHOLDER_ITEM_NAME),
           newFile
         ]);
         setTimeout(() => {
@@ -1716,6 +1843,7 @@ var MediaCollection = (0, import_react.memo)(
       },
       [media, tree, setMedia]
     );
+    const [isUploading, setIsUploading] = (0, import_react.useState)(false);
     const handleUpload = (0, import_react.useCallback)(
       async (selectedId) => {
         try {
@@ -1725,12 +1853,13 @@ var MediaCollection = (0, import_react.memo)(
           if (!parentPath) return;
           const uploadPromises = files.map(async (file) => {
             const asset = await assetManager.create(file);
-            const assetPath = import_imfs3.path.join(parentPath, import_imfs3.path.basename(file.name));
+            const assetPath = import_imfs4.path.join(parentPath, import_imfs4.path.basename(file.name));
             return {
               assetPath,
               asset: createMediaAsset({ assetId: asset.id })
             };
           });
+          setIsUploading(true);
           const newMediaMap = await Promise.all(uploadPromises);
           setMedia(
             { name: "Add media items", timestamp: Date.now() },
@@ -1743,6 +1872,8 @@ var MediaCollection = (0, import_react.memo)(
           );
         } catch (error) {
           console.error("Failed to upload files:", error);
+        } finally {
+          setIsUploading(false);
         }
       },
       [tree.idToPathMap, setMedia, media, assetManager]
@@ -1802,9 +1933,6 @@ var MediaCollection = (0, import_react.memo)(
     );
     const handleMoveMediaInsideFolder = (0, import_react.useCallback)(
       (sourceItem, targetItem) => {
-        const sourceItemPath = tree.idToPathMap.get(sourceItem.id);
-        const targetItemPath = tree.idToPathMap.get(targetItem.id);
-        if (!sourceItemPath || !targetItemPath) return;
         const newMedia = moveMediaInsideFolder({
           sourceItemIds: [sourceItem.id],
           targetItemId: targetItem.id,
@@ -1842,12 +1970,12 @@ var MediaCollection = (0, import_react.memo)(
         ],
         [
           onlySingleFolderSelected && {
-            title: "Add media",
+            title: "Upload Files",
             value: "upload",
             icon: /* @__PURE__ */ import_react2.default.createElement(import_noya_icons.UploadIcon, null)
           },
           onlySingleFolderSelected && {
-            title: "Add a Folder",
+            title: "Add Folder",
             value: "addFolder",
             icon: /* @__PURE__ */ import_react2.default.createElement(import_noya_icons.FolderIcon, null)
           },
@@ -1971,7 +2099,8 @@ var MediaCollection = (0, import_react.memo)(
       moveUpAFolder: handleMoveUpAFolder,
       replace: handleReplace,
       preview: handlePreview,
-      moveMediaInsideFolder: handleMoveMediaInsideFolder
+      moveMediaInsideFolder: handleMoveMediaInsideFolder,
+      getItemAtIndex: (index) => visibleItems[index]
     }));
     return /* @__PURE__ */ import_react2.default.createElement(import_react2.default.Fragment, null, /* @__PURE__ */ import_react2.default.createElement(
       import_noya_designsystem.FileExplorerLayout,
@@ -1981,7 +2110,8 @@ var MediaCollection = (0, import_react.memo)(
           import_noya_designsystem.FileExplorerUploadButton,
           {
             showUploadButton,
-            onUpload: () => handleUpload(rootMediaItem.id)
+            onUpload: () => handleUpload(rootMediaItem.id),
+            isUploading
           },
           right
         ),
@@ -2012,10 +2142,11 @@ var MediaCollection = (0, import_react.memo)(
                 return "Enter folder name";
               case "asset":
               case "file":
+              case "noyaFile":
                 return "Enter file name";
             }
           },
-          getExpanded: handleExpanded,
+          getExpanded,
           setExpanded: handleSetExpanded,
           getRenamable: (item) => {
             if (item.id === rootMediaItem.id) return false;
@@ -2025,6 +2156,7 @@ var MediaCollection = (0, import_react.memo)(
           menuItems: assetContextMenuItems,
           onSelectMenuItem: handleMenuAction,
           onSelectionChange: setSelectedIds,
+          onClickItem,
           onDoubleClickItem,
           onRename,
           renamable,
@@ -2033,7 +2165,8 @@ var MediaCollection = (0, import_react.memo)(
             MediaThumbnailInternal,
             {
               ...props,
-              path: tree.idToPathMap.get(props.item.id)
+              path: tree.idToPathMap.get(props.item.id),
+              renderThumbnailIcon
             }
           ),
           renderAction,
@@ -2041,7 +2174,7 @@ var MediaCollection = (0, import_react.memo)(
             if (file.kind !== "asset") return null;
             const asset = assets.find((a) => a.id === file.assetId);
             if (!asset) return null;
-            return /* @__PURE__ */ import_react2.default.createElement(import_noya_designsystem.FileExplorerDetail, { selected, size }, (asset.size / 1024).toFixed(1), "KB");
+            return /* @__PURE__ */ import_react2.default.createElement(import_noya_designsystem.FileExplorerDetail, { selected, size }, (0, import_noya_designsystem.formatByteSize)(asset.size));
           },
           renderEmptyState: () => renderEmptyState?.() ?? /* @__PURE__ */ import_react2.default.createElement(import_noya_designsystem.FileExplorerEmptyState, null),
           itemRoleDescription: "clickable file item",
@@ -2062,26 +2195,28 @@ var MediaCollection = (0, import_react.memo)(
             if (sourceListId !== targetListId) {
               return false;
             }
-            const sourceItem = visibleItems[sourceIndex];
-            const targetItem = visibleItems[targetIndex];
-            if (position !== "inside" || targetItem.kind === "asset") {
+            if (sourceListId !== sortableId || targetListId !== sortableId) {
               return false;
             }
-            const sourcePath = tree.findPath(
-              rootMediaItem,
-              (item) => item.id === sourceItem.id
-            );
-            const targetPath = tree.findPath(
-              rootMediaItem,
-              (item) => item.id === targetItem.id
-            );
-            if (!sourcePath || !targetPath) return false;
-            if ((0, import_noya_utils2.isDeepEqual)(sourcePath, targetPath.slice(0, sourcePath.length))) {
-              return false;
-            }
-            return true;
+            const sourceItem = visibleItems[sourceIndex];
+            const targetItem = visibleItems[targetIndex];
+            return acceptsMediaItemDrop({
+              position,
+              sourceItem,
+              targetItem,
+              tree
+            });
           },
-          onMoveItem: ({ sourceIndex, targetIndex, position }) => {
+          onMoveItem: ({
+            sourceListId,
+            sourceIndex,
+            targetListId,
+            targetIndex,
+            position
+          }) => {
+            if (sourceListId !== sortableId || targetListId !== sortableId) {
+              return;
+            }
             const sourceItem = visibleItems[sourceIndex];
             const targetItem = visibleItems[targetIndex];
             if (position === "inside") {
@@ -2090,46 +2225,49 @@ var MediaCollection = (0, import_react.memo)(
           },
           onFilesDrop: async (event) => {
             event.preventDefault();
-            const files = Array.from(event.dataTransfer.files);
-            if (files.length === 0) return;
-            try {
-              const uploadPromises = files.map(async (file) => {
-                const asset = await assetManager.create(file);
-                return {
-                  asset: createMediaAsset({
-                    assetId: asset.id
-                  }),
-                  name: file.name
-                };
-              });
-              const newMediaItems = await Promise.all(uploadPromises);
-              const rootItemPath = tree.idToPathMap.get(rootItemId);
-              if (!rootItemPath) return;
-              setMedia(
-                { name: "Add media files", timestamp: Date.now() },
-                {
-                  ...media,
-                  ...Object.fromEntries(
-                    newMediaItems.map((item) => [
-                      import_imfs3.path.join(rootItemPath, item.name),
-                      item.asset
-                    ])
-                  )
-                }
-              );
-            } catch (error) {
-              console.error("Failed to upload dropped files:", error);
-            }
+            const rootItemPath = tree.idToPathMap.get(rootItemId);
+            if (!rootItemPath) return;
+            const newMedia = await handleDataTransfer({
+              dataTransfer: event.dataTransfer,
+              rootItemPath,
+              media,
+              uploadAsset: (file) => assetManager.create(file)
+            });
+            if (!newMedia) return;
+            setMedia(
+              { name: "Add media files", timestamp: Date.now() },
+              newMedia
+            );
           }
         }
       )
     ));
   })
 );
+function acceptsMediaItemDrop(parameters) {
+  const { position, sourceItem, targetItem, tree } = parameters;
+  if (position !== "inside" || targetItem.kind === "asset") {
+    return false;
+  }
+  const sourcePath = tree.findPath(
+    rootMediaItem,
+    (item) => item.id === sourceItem.id
+  );
+  const targetPath = tree.findPath(
+    rootMediaItem,
+    (item) => item.id === targetItem.id
+  );
+  if (!sourcePath || !targetPath) return false;
+  if ((0, import_noya_utils2.isDeepEqual)(sourcePath, targetPath.slice(0, sourcePath.length))) {
+    return false;
+  }
+  return true;
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   MediaCollection,
   PLACEHOLDER_ITEM_NAME,
+  acceptsMediaItemDrop,
   basenameValidator,
   createMediaAsset,
   createMediaFile,