@noya-app/noya-file-explorer 0.0.2 → 0.0.4

package/dist/index.js

@@ -35,7 +35,46 @@ var require_access = __commonJS({
   "../../node_modules/tree-visit/lib/access.js"(exports2) {
     "use strict";
     Object.defineProperty(exports2, "__esModule", { value: true });
-    exports2.accessPath = exports2.access = void 0;
+    exports2.get = get;
+    exports2.ancestors = ancestors;
+    exports2.access = access;
+    exports2.accessPath = accessPath;
+    function get(node, indexPath, options) {
+      if (options.includeTraversalContext) {
+        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);
+        const child = children[index];
+        if (!child) {
+          return void 0;
+        }
+        node = child;
+      }
+      return node;
+    }
+    function ancestors(node, indexPath, options) {
+      return _getPath(node, indexPath, options).slice(0, -1);
+    }
+    function _getPath(node, indexPath, options) {
+      let path4 = indexPath.slice();
+      let result = [node];
+      while (path4.length > 0) {
+        let index = path4.shift();
+        const context = options.includeTraversalContext ? makeTraversalContext(result) : void 0;
+        const children = options.getChildren(node, path4, context);
+        const child = children[index];
+        if (!child) {
+          return result;
+        }
+        node = child;
+        result.push(node);
+      }
+      return result;
+    }
     function access(node, indexPath, options) {
       if (options.includeTraversalContext) {
         const accessed = accessPath(node, indexPath, options);
@@ -48,23 +87,24 @@ var require_access = __commonJS({
       }
       return node;
     }
-    exports2.access = access;
     function accessPath(node, indexPath, options) {
       let path4 = indexPath.slice();
       let result = [node];
       while (path4.length > 0) {
         let index = path4.shift();
-        const context = options.includeTraversalContext ? {
-          getRoot: () => result[0],
-          getParent: () => result[result.length - 2],
-          getAncestors: () => result.slice(0, -1)
-        } : void 0;
+        const context = options.includeTraversalContext ? makeTraversalContext(result) : void 0;
         node = options.getChildren(node, path4, context)[index];
         result.push(node);
       }
       return result;
     }
-    exports2.accessPath = accessPath;
+    function makeTraversalContext(array) {
+      return {
+        getRoot: () => array[0],
+        getParent: () => array[array.length - 2],
+        getAncestors: () => array.slice(0, -1)
+      };
+    }
   }
 });
 
@@ -73,7 +113,8 @@ var require_sort = __commonJS({
   "../../node_modules/tree-visit/lib/sort.js"(exports2) {
     "use strict";
     Object.defineProperty(exports2, "__esModule", { value: true });
-    exports2.sortPaths = exports2.comparePathsByComponent = void 0;
+    exports2.comparePathsByComponent = comparePathsByComponent;
+    exports2.sortPaths = sortPaths;
     function comparePathsByComponent(a, b) {
       for (let i = 0; i < Math.min(a.length, b.length); i++) {
         if (a[i] < b[i])
@@ -83,11 +124,9 @@ var require_sort = __commonJS({
       }
       return a.length - b.length;
     }
-    exports2.comparePathsByComponent = comparePathsByComponent;
     function sortPaths(indexPaths) {
       return [...indexPaths].sort(comparePathsByComponent);
     }
-    exports2.sortPaths = sortPaths;
   }
 });
 
@@ -96,7 +135,7 @@ var require_ancestors = __commonJS({
   "../../node_modules/tree-visit/lib/ancestors.js"(exports2) {
     "use strict";
     Object.defineProperty(exports2, "__esModule", { value: true });
-    exports2.ancestorPaths = void 0;
+    exports2.ancestorPaths = ancestorPaths2;
     var sort_1 = require_sort();
     function ancestorPaths2(paths, options) {
       var _a;
@@ -114,7 +153,6 @@ var require_ancestors = __commonJS({
       }
       return Array.from(result.values());
     }
-    exports2.ancestorPaths = ancestorPaths2;
   }
 });
 
@@ -123,7 +161,7 @@ var require_boxDiagram = __commonJS({
   "../../node_modules/tree-visit/lib/diagram/boxDiagram.js"(exports2) {
     "use strict";
     Object.defineProperty(exports2, "__esModule", { value: true });
-    exports2.boxDiagram = void 0;
+    exports2.boxDiagram = boxDiagram;
     var BoxDrawing;
     (function(BoxDrawing2) {
       BoxDrawing2["TopLeft"] = "\u250C";
@@ -238,7 +276,6 @@ var require_boxDiagram = __commonJS({
     function boxDiagram(node, options) {
       return nodeDiagram(node, [], options).contents.join("\n");
     }
-    exports2.boxDiagram = boxDiagram;
     function centerIndex(width) {
       return Math.floor(width / 2);
     }
@@ -267,7 +304,9 @@ var require_directoryDiagram = __commonJS({
   "../../node_modules/tree-visit/lib/diagram/directoryDiagram.js"(exports2) {
     "use strict";
     Object.defineProperty(exports2, "__esModule", { value: true });
-    exports2.prefixBlock = exports2.isMultiline = exports2.directoryDiagram = void 0;
+    exports2.directoryDiagram = directoryDiagram;
+    exports2.isMultiline = isMultiline;
+    exports2.prefixBlock = prefixBlock;
     var LinePrefix;
     (function(LinePrefix2) {
       LinePrefix2["Child"] = "\u251C\u2500\u2500 ";
@@ -314,17 +353,14 @@ var require_directoryDiagram = __commonJS({
       const strings = lines.map((line) => prefixBlock(line.label, line.prefix, line.multilinePrefix));
       return strings.join("\n");
     }
-    exports2.directoryDiagram = directoryDiagram;
     function isMultiline(line) {
       return line.includes("\n");
     }
-    exports2.isMultiline = isMultiline;
     function prefixBlock(block, prefix, multilinePrefix) {
       if (!isMultiline(block))
         return prefix + block;
       return block.split("\n").map((line, index) => (index === 0 ? prefix : multilinePrefix) + line).join("\n");
     }
-    exports2.prefixBlock = prefixBlock;
   }
 });
 
@@ -333,7 +369,7 @@ var require_diagram = __commonJS({
   "../../node_modules/tree-visit/lib/diagram.js"(exports2) {
     "use strict";
     Object.defineProperty(exports2, "__esModule", { value: true });
-    exports2.diagram = void 0;
+    exports2.diagram = diagram;
     var boxDiagram_1 = require_boxDiagram();
     var directoryDiagram_1 = require_directoryDiagram();
     function diagram(node, options) {
@@ -342,7 +378,6 @@ var require_diagram = __commonJS({
       }
       return (0, directoryDiagram_1.directoryDiagram)(node, options);
     }
-    exports2.diagram = diagram;
   }
 });
 
@@ -351,11 +386,16 @@ var require_visit = __commonJS({
   "../../node_modules/tree-visit/lib/visit.js"(exports2) {
     "use strict";
     Object.defineProperty(exports2, "__esModule", { value: true });
-    exports2.visit = exports2.STOP = exports2.SKIP = void 0;
+    exports2.STOP = exports2.SKIP = void 0;
+    exports2.visit = visit;
     exports2.SKIP = "skip";
     exports2.STOP = "stop";
     function visit(node, options) {
-      const { onEnter, onLeave, getChildren, onDetectCycle, getIdentifier } = options;
+      const { onEnter, onLeave, getChildren: originalGetChildren, onDetectCycle, getIdentifier, direction = "forward" } = options;
+      const getChildren = (node2, indexPath2, context2) => {
+        const children = originalGetChildren(node2, indexPath2, context2);
+        return direction === "forward" ? children : children.slice().reverse();
+      };
       let indexPath = [];
       let stack = [{ node }];
       const visited = onDetectCycle ? /* @__PURE__ */ new Set() : void 0;
@@ -400,7 +440,7 @@ var require_visit = __commonJS({
         if (wrapper.state !== -1) {
           if (wrapper.state < children.length) {
             let currentIndex = wrapper.state;
-            indexPath.push(currentIndex);
+            indexPath.push(direction === "forward" ? currentIndex : children.length - currentIndex - 1);
             stack.push({ node: children[currentIndex] });
             wrapper.state = currentIndex + 1;
             continue;
@@ -417,7 +457,23 @@ var require_visit = __commonJS({
         stack.pop();
       }
     }
-    exports2.visit = visit;
+  }
+});
+
+// ../../node_modules/tree-visit/lib/entries.js
+var require_entries = __commonJS({
+  "../../node_modules/tree-visit/lib/entries.js"(exports2) {
+    "use strict";
+    Object.defineProperty(exports2, "__esModule", { value: true });
+    exports2.entries = entries;
+    var visit_1 = require_visit();
+    function entries(node, options) {
+      let result = [];
+      (0, visit_1.visit)(node, Object.assign(Object.assign({}, options), { onEnter: (item, indexPath) => {
+        result.push([indexPath, item]);
+      } }));
+      return result;
+    }
   }
 });
 
@@ -426,7 +482,10 @@ var require_find = __commonJS({
   "../../node_modules/tree-visit/lib/find.js"(exports2) {
     "use strict";
     Object.defineProperty(exports2, "__esModule", { value: true });
-    exports2.findAllIndexPaths = exports2.findIndexPath = exports2.findAll = exports2.find = void 0;
+    exports2.find = find;
+    exports2.findAll = findAll;
+    exports2.findPath = findPath;
+    exports2.findAllPaths = findAllPaths;
     var visit_1 = require_visit();
     function find(node, options) {
       let found;
@@ -438,7 +497,6 @@ var require_find = __commonJS({
       } }));
       return found;
     }
-    exports2.find = find;
     function findAll(node, options) {
       let found = [];
       (0, visit_1.visit)(node, {
@@ -451,8 +509,7 @@ var require_find = __commonJS({
       });
       return found;
     }
-    exports2.findAll = findAll;
-    function findIndexPath(node, options) {
+    function findPath(node, options) {
       let found;
       (0, visit_1.visit)(node, {
         onEnter: (child, indexPath) => {
@@ -465,8 +522,7 @@ var require_find = __commonJS({
       });
       return found;
     }
-    exports2.findIndexPath = findIndexPath;
-    function findAllIndexPaths(node, options) {
+    function findAllPaths(node, options) {
       let found = [];
       (0, visit_1.visit)(node, {
         onEnter: (child, indexPath) => {
@@ -478,7 +534,6 @@ var require_find = __commonJS({
       });
       return found;
     }
-    exports2.findAllIndexPaths = findAllIndexPaths;
   }
 });
 
@@ -487,7 +542,7 @@ var require_reduce = __commonJS({
   "../../node_modules/tree-visit/lib/reduce.js"(exports2) {
     "use strict";
     Object.defineProperty(exports2, "__esModule", { value: true });
-    exports2.reduce = void 0;
+    exports2.reduce = reduce;
     var visit_1 = require_visit();
     function reduce(node, options) {
       let result = options.initialResult;
@@ -496,7 +551,6 @@ var require_reduce = __commonJS({
       } }));
       return result;
     }
-    exports2.reduce = reduce;
   }
 });
 
@@ -505,7 +559,7 @@ var require_flat = __commonJS({
   "../../node_modules/tree-visit/lib/flat.js"(exports2) {
     "use strict";
     Object.defineProperty(exports2, "__esModule", { value: true });
-    exports2.flat = void 0;
+    exports2.flat = flat;
     var reduce_1 = require_reduce();
     function flat(node, options) {
       return (0, reduce_1.reduce)(node, Object.assign(Object.assign({}, options), { initialResult: [], nextResult: (result, child) => {
@@ -513,24 +567,6 @@ var require_flat = __commonJS({
         return result;
       } }));
     }
-    exports2.flat = flat;
-  }
-});
-
-// ../../node_modules/tree-visit/lib/flatMap.js
-var require_flatMap = __commonJS({
-  "../../node_modules/tree-visit/lib/flatMap.js"(exports2) {
-    "use strict";
-    Object.defineProperty(exports2, "__esModule", { value: true });
-    exports2.flatMap = void 0;
-    var reduce_1 = require_reduce();
-    function flatMap(node, options) {
-      return (0, reduce_1.reduce)(node, Object.assign(Object.assign({}, options), { initialResult: [], nextResult: (result, child, indexPath) => {
-        result.push(...options.transform(child, indexPath));
-        return result;
-      } }));
-    }
-    exports2.flatMap = flatMap;
   }
 });
 
@@ -539,9 +575,15 @@ var require_map = __commonJS({
   "../../node_modules/tree-visit/lib/map.js"(exports2) {
     "use strict";
     Object.defineProperty(exports2, "__esModule", { value: true });
-    exports2.map = void 0;
+    exports2.map = map;
+    exports2.flatMap = flatMap;
     var visit_1 = require_visit();
     function map(node, options) {
+      return flatMap(node, Object.assign(Object.assign({}, options), { transform: (node2, transformedChildren, indexPath) => [
+        options.transform(node2, transformedChildren, indexPath)
+      ] }));
+    }
+    function flatMap(node, options) {
       const childrenMap = {};
       (0, visit_1.visit)(node, Object.assign(Object.assign({}, options), { onLeave: (child, indexPath) => {
         var _a, _b;
@@ -550,12 +592,56 @@ var require_map = __commonJS({
         const transformed = options.transform(child, (_a = childrenMap[key]) !== null && _a !== void 0 ? _a : [], indexPath);
         const parentKey = keyIndexPath.slice(0, -1).join();
         const parentChildren = (_b = childrenMap[parentKey]) !== null && _b !== void 0 ? _b : [];
-        parentChildren.push(transformed);
+        parentChildren.push(...transformed);
         childrenMap[parentKey] = parentChildren;
       } }));
       return childrenMap[""][0];
     }
-    exports2.map = map;
+  }
+});
+
+// ../../node_modules/tree-visit/lib/transformPath.js
+var require_transformPath = __commonJS({
+  "../../node_modules/tree-visit/lib/transformPath.js"(exports2) {
+    "use strict";
+    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);
+      for (let i = 0; i < length; i++) {
+        if (path4[i] !== otherPath[i]) {
+          return path4.slice(0, i);
+        }
+      }
+      return path4.slice(0, length);
+    }
+    function transformPath(path4, operation, otherPath, count = 1) {
+      if (otherPath.length > path4.length || (0, sort_1.comparePathsByComponent)(otherPath, path4) > 0) {
+        return path4;
+      }
+      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 otherPathValue = otherPath[adjustmentIndex];
+      if (operation === "insert" && otherPathValue <= pathValue) {
+        const newPath = [...path4];
+        newPath[adjustmentIndex] += count;
+        return newPath;
+      } else if (operation === "remove") {
+        if (otherPathValue === pathValue) {
+          return void 0;
+        } else if (otherPathValue < pathValue) {
+          const newPath = [...path4];
+          newPath[adjustmentIndex] -= count;
+          return newPath;
+        }
+      }
+      return path4;
+    }
   }
 });
 
@@ -564,9 +650,18 @@ var require_operation = __commonJS({
   "../../node_modules/tree-visit/lib/operation.js"(exports2) {
     "use strict";
     Object.defineProperty(exports2, "__esModule", { value: true });
-    exports2.splice = exports2.applyOperations = exports2.getReplaceOperations = exports2.getRemovalOperations = exports2.getInsertionOperations = exports2.replaceOperation = exports2.removeOperation = exports2.insertOperation = void 0;
+    exports2.insertOperation = insertOperation;
+    exports2.removeOperation = removeOperation;
+    exports2.replaceOperation = replaceOperation;
+    exports2.getInsertionOperations = getInsertionOperations;
+    exports2.getRemovalOperations = getRemovalOperations;
+    exports2.getReplaceOperations = getReplaceOperations;
+    exports2.applyOperations = applyOperations;
+    exports2.arraySplice = arraySplice;
+    exports2.transformPathsByOperations = transformPathsByOperations;
     var ancestors_1 = require_ancestors();
     var map_1 = require_map();
+    var transformPath_1 = require_transformPath();
     function insertOperation(index, nodes) {
       return {
         type: "insert",
@@ -574,20 +669,17 @@ var require_operation = __commonJS({
         nodes
       };
     }
-    exports2.insertOperation = insertOperation;
     function removeOperation(indexes) {
       return {
         type: "remove",
         indexes
       };
     }
-    exports2.removeOperation = removeOperation;
     function replaceOperation() {
       return {
         type: "replace"
       };
     }
-    exports2.replaceOperation = replaceOperation;
     function splitIndexPath(indexPath) {
       return [indexPath.slice(0, -1), indexPath[indexPath.length - 1]];
     }
@@ -617,7 +709,6 @@ var require_operation = __commonJS({
       }
       return operations;
     }
-    exports2.getInsertionOperations = getInsertionOperations;
     function getRemovalOperations(indexPaths) {
       var _a, _b;
       const _ancestorIndexPaths = (0, ancestors_1.ancestorPaths)(indexPaths);
@@ -641,7 +732,6 @@ var require_operation = __commonJS({
       }
       return operations;
     }
-    exports2.getRemovalOperations = getRemovalOperations;
     function getReplaceOperations(indexPath, node) {
       const operations = /* @__PURE__ */ new Map();
       const [parentIndexPath, index] = splitIndexPath(indexPath);
@@ -657,7 +747,9 @@ var require_operation = __commonJS({
       });
       return operations;
     }
-    exports2.getReplaceOperations = getReplaceOperations;
+    function adjustInsertIndex(index, removeIndexes) {
+      return removeIndexes.reduce((index2, removedIndex) => removedIndex < index2 ? index2 - 1 : index2, index);
+    }
     function applyOperations(node, operations, options) {
       return (0, map_1.map)(node, Object.assign(Object.assign({}, options), {
         // Avoid calling `getChildren` for every node in the tree.
@@ -683,10 +775,10 @@ var require_operation = __commonJS({
               return options.create(node2, children.filter((_, index) => !operation.indexes.includes(index)), indexPath);
             case "removeThenInsert":
               const updatedChildren = children.filter((_, index) => !operation.removeIndexes.includes(index));
-              const adjustedIndex = operation.removeIndexes.reduce((index, removedIndex) => removedIndex < index ? index - 1 : index, operation.insertIndex);
-              return options.create(node2, splice(updatedChildren, adjustedIndex, 0, ...operation.insertNodes), indexPath);
+              const adjustedIndex = adjustInsertIndex(operation.insertIndex, operation.removeIndexes);
+              return options.create(node2, arraySplice(updatedChildren, adjustedIndex, 0, ...operation.insertNodes), indexPath);
             case "insert":
-              return options.create(node2, splice(children, operation.index, 0, ...operation.nodes), indexPath);
+              return options.create(node2, arraySplice(children, operation.index, 0, ...operation.nodes), indexPath);
             case "replace":
               return options.create(node2, children, indexPath);
             default:
@@ -695,15 +787,53 @@ var require_operation = __commonJS({
         }
       }));
     }
-    exports2.applyOperations = applyOperations;
-    function splice(array, start, deleteCount, ...items) {
+    function arraySplice(array, start, deleteCount, ...items) {
       return [
         ...array.slice(0, start),
         ...items,
         ...array.slice(start + deleteCount)
       ];
     }
-    exports2.splice = splice;
+    function transformPathsByOperations(paths, operations) {
+      let transformedPaths = paths;
+      for (const [parentKey, operation] of operations.entries()) {
+        const parentPath = parentKey ? parentKey.split(",").map(Number) : [];
+        transformedPaths = transformByOperation(transformedPaths, parentPath, operation);
+      }
+      return transformedPaths;
+    }
+    function transformByOperation(transformedPaths, parentPath, operation) {
+      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);
+        }
+        case "remove": {
+          const otherPaths = [...operation.indexes].reverse().map((index) => parentPath.concat(index));
+          return transformedPaths.map((path4) => {
+            for (const otherPath of otherPaths) {
+              path4 = path4 ? (0, transformPath_1.transformPath)(path4, "remove", otherPath) : void 0;
+            }
+            return path4;
+          });
+        }
+        case "removeThenInsert": {
+          const result = transformByOperation(transformedPaths, parentPath, {
+            type: "remove",
+            indexes: operation.removeIndexes
+          });
+          const insertIndex = adjustInsertIndex(operation.insertIndex, operation.removeIndexes);
+          return transformByOperation(result, parentPath, {
+            type: "insert",
+            index: insertIndex,
+            nodes: operation.insertNodes
+          });
+        }
+        case "replace": {
+          return transformedPaths;
+        }
+      }
+    }
   }
 });
 
@@ -712,17 +842,27 @@ var require_insert = __commonJS({
   "../../node_modules/tree-visit/lib/insert.js"(exports2) {
     "use strict";
     Object.defineProperty(exports2, "__esModule", { value: true });
-    exports2.insert = void 0;
+    exports2.insert = insert;
+    exports2.insertWithPathTracking = insertWithPathTracking;
     var operation_1 = require_operation();
     function insert(node, options) {
-      const { nodes, at } = options;
+      return _insertWithPathTracking(node, options).node;
+    }
+    function insertWithPathTracking(node, options) {
+      return _insertWithPathTracking(node, options);
+    }
+    function _insertWithPathTracking(node, options) {
+      const { nodes, path: at, track } = options;
       if (at.length === 0) {
         throw new Error(`Can't insert nodes at the root`);
       }
       const state = (0, operation_1.getInsertionOperations)(at, nodes);
-      return (0, operation_1.applyOperations)(node, state, options);
+      const transformedPaths = track ? (0, operation_1.transformPathsByOperations)(track, state) : [];
+      return {
+        node: (0, operation_1.applyOperations)(node, state, options),
+        paths: transformedPaths
+      };
     }
-    exports2.insert = insert;
   }
 });
 
@@ -731,14 +871,14 @@ var require_move = __commonJS({
   "../../node_modules/tree-visit/lib/move.js"(exports2) {
     "use strict";
     Object.defineProperty(exports2, "__esModule", { value: true });
-    exports2.move = void 0;
+    exports2.move = move;
     var access_1 = require_access();
     var ancestors_1 = require_ancestors();
     var operation_1 = require_operation();
     function move(node, options) {
-      if (options.indexPaths.length === 0)
+      if (options.paths.length === 0)
         return node;
-      for (const indexPath of options.indexPaths) {
+      for (const indexPath of options.paths) {
         if (indexPath.length === 0) {
           throw new Error(`Can't move the root node`);
         }
@@ -746,12 +886,11 @@ var require_move = __commonJS({
       if (options.to.length === 0) {
         throw new Error(`Can't move nodes to the root`);
       }
-      const _ancestorIndexPaths = (0, ancestors_1.ancestorPaths)(options.indexPaths);
+      const _ancestorIndexPaths = (0, ancestors_1.ancestorPaths)(options.paths);
       const nodesToInsert = _ancestorIndexPaths.map((indexPath) => (0, access_1.access)(node, indexPath, options));
       const operations = (0, operation_1.getInsertionOperations)(options.to, nodesToInsert, (0, operation_1.getRemovalOperations)(_ancestorIndexPaths));
       return (0, operation_1.applyOperations)(node, operations, options);
     }
-    exports2.move = move;
   }
 });
 
@@ -760,20 +899,24 @@ var require_remove = __commonJS({
   "../../node_modules/tree-visit/lib/remove.js"(exports2) {
     "use strict";
     Object.defineProperty(exports2, "__esModule", { value: true });
-    exports2.remove = void 0;
+    exports2.remove = remove;
+    exports2.removeWithPathTracking = removeWithPathTracking;
     var operation_1 = require_operation();
     function remove(node, options) {
-      if (options.indexPaths.length === 0)
-        return node;
-      for (const indexPath of options.indexPaths) {
-        if (indexPath.length === 0) {
-          throw new Error(`Can't remove the root node`);
-        }
-      }
-      const operations = (0, operation_1.getRemovalOperations)(options.indexPaths);
-      return (0, operation_1.applyOperations)(node, operations, options);
+      return _removeWithPathTracking(node, options).node;
+    }
+    function removeWithPathTracking(node, options) {
+      return _removeWithPathTracking(node, options);
+    }
+    function _removeWithPathTracking(node, options) {
+      const { paths, track } = options;
+      const operations = (0, operation_1.getRemovalOperations)(paths);
+      const transformedPaths = track ? (0, operation_1.transformPathsByOperations)(track, operations) : [];
+      return {
+        node: (0, operation_1.applyOperations)(node, operations, options),
+        paths: transformedPaths
+      };
     }
-    exports2.remove = remove;
   }
 });
 
@@ -782,15 +925,53 @@ var require_replace = __commonJS({
   "../../node_modules/tree-visit/lib/replace.js"(exports2) {
     "use strict";
     Object.defineProperty(exports2, "__esModule", { value: true });
-    exports2.replace = void 0;
+    exports2.replace = replace;
     var operation_1 = require_operation();
     function replace(node, options) {
-      if (options.at.length === 0)
+      if (options.path.length === 0)
         return options.node;
-      const operations = (0, operation_1.getReplaceOperations)(options.at, options.node);
+      const operations = (0, operation_1.getReplaceOperations)(options.path, options.node);
       return (0, operation_1.applyOperations)(node, operations, options);
     }
-    exports2.replace = replace;
+  }
+});
+
+// ../../node_modules/tree-visit/lib/splice.js
+var require_splice = __commonJS({
+  "../../node_modules/tree-visit/lib/splice.js"(exports2) {
+    "use strict";
+    Object.defineProperty(exports2, "__esModule", { value: true });
+    exports2.splice = splice;
+    exports2.spliceWithPathTracking = spliceWithPathTracking;
+    var operation_1 = require_operation();
+    function splice(node, options) {
+      return _spliceWithPathTracking(node, options).node;
+    }
+    function spliceWithPathTracking(node, options) {
+      return _spliceWithPathTracking(node, options);
+    }
+    function _spliceWithPathTracking(node, options) {
+      const { path: path4, deleteCount = 0, nodes, track } = options;
+      if (path4.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 transformedPaths = track ? (0, operation_1.transformPathsByOperations)(track, operations) : [];
+      return {
+        node: (0, operation_1.applyOperations)(node, operations, options),
+        paths: transformedPaths
+      };
+    }
+    function getPathsToRemove(path4, deleteCount) {
+      let pathsToRemove = [];
+      let parentPath = path4.slice(0, -1);
+      let index = path4[path4.length - 1];
+      for (let i = 0; i < deleteCount; i++) {
+        pathsToRemove.push(parentPath.concat(index + i));
+      }
+      return pathsToRemove;
+    }
   }
 });
 
@@ -799,18 +980,19 @@ var require_defineTree = __commonJS({
   "../../node_modules/tree-visit/lib/defineTree.js"(exports2) {
     "use strict";
     Object.defineProperty(exports2, "__esModule", { value: true });
-    exports2.defineTree = void 0;
+    exports2.defineTree = defineTree2;
     var access_1 = require_access();
     var diagram_1 = require_diagram();
+    var entries_1 = require_entries();
     var find_1 = require_find();
     var flat_1 = require_flat();
-    var flatMap_1 = require_flatMap();
     var insert_1 = require_insert();
     var map_1 = require_map();
     var move_1 = require_move();
     var reduce_1 = require_reduce();
     var remove_1 = require_remove();
     var replace_1 = require_replace();
+    var splice_1 = require_splice();
     var visit_1 = require_visit();
     var Tree = class _Tree {
       constructor(getChildrenOrBaseOptions, appliedOptions) {
@@ -822,19 +1004,26 @@ var require_defineTree = __commonJS({
         this.withOptions = (newOptions) => new _Tree(this.baseOptions, Object.assign(Object.assign({}, this.appliedOptions), newOptions));
         this.access = (node, indexPath) => (0, access_1.access)(node, indexPath, this.mergeOptions({}));
         this.accessPath = (node, indexPath) => (0, access_1.accessPath)(node, indexPath, this.mergeOptions({}));
+        this.get = (node, indexPath) => (0, access_1.get)(node, indexPath, this.mergeOptions({}));
+        this.ancestors = (node, indexPath) => (0, access_1.ancestors)(node, indexPath, this.mergeOptions({}));
         this.diagram = (node, options) => typeof options === "function" ? (0, diagram_1.diagram)(node, this.mergeOptions({ getLabel: options })) : (0, diagram_1.diagram)(node, this.mergeOptions(options));
         this.find = (node, predicateOrOptions) => typeof predicateOrOptions === "function" ? (0, find_1.find)(node, this.mergeOptions({ predicate: predicateOrOptions })) : (0, find_1.find)(node, this.mergeOptions(Object.assign({}, predicateOrOptions)));
         this.findAll = (node, predicateOrOptions) => typeof predicateOrOptions === "function" ? (0, find_1.findAll)(node, this.mergeOptions({ predicate: predicateOrOptions })) : (0, find_1.findAll)(node, this.mergeOptions(Object.assign({}, predicateOrOptions)));
-        this.findIndexPath = (node, predicateOrOptions) => typeof predicateOrOptions === "function" ? (0, find_1.findIndexPath)(node, this.mergeOptions({ predicate: predicateOrOptions })) : (0, find_1.findIndexPath)(node, this.mergeOptions(Object.assign({}, predicateOrOptions)));
-        this.findAllIndexPaths = (node, predicateOrOptions) => typeof predicateOrOptions === "function" ? (0, find_1.findAllIndexPaths)(node, this.mergeOptions({ predicate: predicateOrOptions })) : (0, find_1.findAllIndexPaths)(node, this.mergeOptions(Object.assign({}, predicateOrOptions)));
+        this.findPath = (node, predicateOrOptions) => typeof predicateOrOptions === "function" ? (0, find_1.findPath)(node, this.mergeOptions({ predicate: predicateOrOptions })) : (0, find_1.findPath)(node, this.mergeOptions(Object.assign({}, predicateOrOptions)));
+        this.findAllPaths = (node, predicateOrOptions) => typeof predicateOrOptions === "function" ? (0, find_1.findAllPaths)(node, this.mergeOptions({ predicate: predicateOrOptions })) : (0, find_1.findAllPaths)(node, this.mergeOptions(Object.assign({}, predicateOrOptions)));
+        this.entries = (node) => (0, entries_1.entries)(node, this.mergeOptions({}));
         this.flat = (node) => (0, flat_1.flat)(node, this.mergeOptions({}));
-        this.flatMap = (node, transform) => (0, flatMap_1.flatMap)(node, this.mergeOptions({ transform }));
         this.reduce = (node, nextResult, initialResult) => (0, reduce_1.reduce)(node, this.mergeOptions({ nextResult, initialResult }));
         this.map = (node, transform) => (0, map_1.map)(node, this.mergeOptions({ transform }));
+        this.flatMap = (node, transform) => (0, map_1.flatMap)(node, this.mergeOptions({ transform }));
         this.visit = (node, onEnterOrOptions) => typeof onEnterOrOptions === "function" ? (0, visit_1.visit)(node, this.mergeOptions({ onEnter: onEnterOrOptions })) : (0, visit_1.visit)(node, this.mergeOptions(Object.assign({}, onEnterOrOptions)));
         this.insert = (node, options) => (0, insert_1.insert)(node, this.mergeOptions(options));
+        this.insertWithPathTracking = (node, options) => (0, insert_1.insertWithPathTracking)(node, this.mergeOptions(options));
         this.remove = (node, options) => (0, remove_1.remove)(node, this.mergeOptions(options));
+        this.removeWithPathTracking = (node, options) => (0, remove_1.removeWithPathTracking)(node, this.mergeOptions(options));
         this.move = (node, options) => (0, move_1.move)(node, this.mergeOptions(options));
+        this.splice = (node, options) => (0, splice_1.splice)(node, this.mergeOptions(options));
+        this.spliceWithPathTracking = (node, options) => (0, splice_1.spliceWithPathTracking)(node, this.mergeOptions(options));
         this.replace = (node, options) => (0, replace_1.replace)(node, this.mergeOptions(options));
         this.baseOptions = typeof getChildrenOrBaseOptions === "function" ? { getChildren: getChildrenOrBaseOptions } : getChildrenOrBaseOptions;
         this._getChildren = this.baseOptions.getChildren;
@@ -843,7 +1032,6 @@ var require_defineTree = __commonJS({
     function defineTree2(getChildren) {
       return new Tree(getChildren, {});
     }
-    exports2.defineTree = defineTree2;
   }
 });
 
@@ -880,9 +1068,13 @@ var require_lib = __commonJS({
     "use strict";
     var __createBinding = exports2 && exports2.__createBinding || (Object.create ? function(o, m, k, k2) {
       if (k2 === void 0) k2 = k;
-      Object.defineProperty(o, k2, { enumerable: true, get: function() {
-        return m[k];
-      } });
+      var desc = Object.getOwnPropertyDescriptor(m, k);
+      if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+        desc = { enumerable: true, get: function() {
+          return m[k];
+        } };
+      }
+      Object.defineProperty(o, k2, desc);
     } : function(o, m, k, k2) {
       if (k2 === void 0) k2 = k;
       o[k2] = m[k];
@@ -895,9 +1087,9 @@ var require_lib = __commonJS({
     __exportStar(require_ancestors(), exports2);
     __exportStar(require_defineTree(), exports2);
     __exportStar(require_diagram(), exports2);
+    __exportStar(require_entries(), exports2);
     __exportStar(require_find(), exports2);
     __exportStar(require_flat(), exports2);
-    __exportStar(require_flatMap(), exports2);
     __exportStar(require_indexPath(), exports2);
     __exportStar(require_insert(), exports2);
     __exportStar(require_map(), exports2);
@@ -907,6 +1099,8 @@ var require_lib = __commonJS({
     __exportStar(require_remove(), exports2);
     __exportStar(require_replace(), exports2);
     __exportStar(require_sort(), exports2);
+    __exportStar(require_splice(), exports2);
+    __exportStar(require_transformPath(), exports2);
     __exportStar(require_visit(), exports2);
     __exportStar(require_withOptions(), exports2);
   }
@@ -930,6 +1124,7 @@ __export(src_exports, {
   moveMediaInsideFolder: () => moveMediaInsideFolder,
   movePathsIntoTarget: () => movePathsIntoTarget,
   moveUpAFolder: () => moveUpAFolder,
+  renameMediaItemAndDescendantPaths: () => renameMediaItemAndDescendantPaths,
   rootMediaItem: () => rootMediaItem,
   rootMediaItemName: () => rootMediaItemName,
   rootMediaItemPath: () => rootMediaItemPath,
@@ -1124,7 +1319,7 @@ var moveUpAFolder = ({
   media,
   selectedIds
 }) => {
-  const indexPath = tree.findIndexPath(
+  const indexPath = tree.findPath(
     rootMediaItem,
     (item) => item.id === selectedIds[0]
   );
@@ -1211,27 +1406,99 @@ var moveMediaInsideFolder = ({
 };
 var getParentDirectories = (mediaMap, folderId) => {
   const tree = createMediaItemTree(mediaMap);
-  const indexPath = tree.findIndexPath(
+  const indexPath = tree.findPath(
     rootMediaItem,
     (item) => item.id === folderId
   );
   if (!indexPath) return [rootMediaItem];
   return tree.accessPath(rootMediaItem, indexPath);
 };
+var renameMediaItemAndDescendantPaths = ({
+  newName,
+  selectedItemPath,
+  media,
+  tree
+}) => {
+  const mediaClone = { ...media };
+  const selectedItem = mediaClone[selectedItemPath];
+  if (!selectedItem) return mediaClone;
+  const parentPath = import_imfs2.path.dirname(selectedItemPath);
+  const newItemPath = import_imfs2.path.join(parentPath, newName);
+  const descendants = tree.flat(selectedItem).map((item) => tree.idToPathMap.get(item.id));
+  for (const descendantPath of descendants) {
+    if (!descendantPath) continue;
+    const newDescendantPath = descendantPath.replace(
+      selectedItemPath,
+      newItemPath
+    );
+    mediaClone[newDescendantPath] = mediaClone[descendantPath];
+    delete mediaClone[descendantPath];
+  }
+  return mediaClone;
+};
 
 // src/MediaCollection.tsx
+var extensionToContentType = {
+  svg: "image/svg+xml",
+  png: "image/png",
+  jpeg: "image/jpeg"
+};
+function encodeFileContentForThumbnail(pathProp, item) {
+  const extension = import_imfs3.path.extname(pathProp).slice(1);
+  const contentType = extensionToContentType[extension];
+  if (contentType) {
+    if (item.encoding === "base64") {
+      return {
+        contentType,
+        url: `data:${contentType};base64,${item.content}`
+      };
+    } else {
+      try {
+        return {
+          contentType,
+          url: `data:${contentType},${encodeURIComponent(item.content)}`
+        };
+      } catch (error) {
+        console.warn("Failed to encode content:", error);
+        return { contentType };
+      }
+    }
+  }
+  return void 0;
+}
 var MediaThumbnailInternal = (0, import_react_utils.memoGeneric)(
-  ({ item, selected }) => {
+  ({
+    item,
+    selected,
+    size,
+    path: pathProp
+  }) => {
     const asset = (0, import_noya_multiplayer_react.useAsset)(item.kind === "asset" ? item.assetId : void 0);
     const isRoot = item.id === rootMediaItem.id;
     const isFolder = item.kind === "folder";
+    const isFile = item.kind === "file";
+    let contentType;
+    let url;
+    if (asset) {
+      contentType = asset.contentType;
+      url = asset.url;
+    } else if (isFile && pathProp) {
+      const encoded = encodeFileContentForThumbnail(pathProp, item);
+      if (encoded) {
+        contentType = encoded.contentType;
+        url = encoded.url;
+      }
+    }
+    const fileName = pathProp ? import_imfs3.path.basename(pathProp) : void 0;
     return /* @__PURE__ */ import_react2.default.createElement(
       import_noya_designsystem.MediaThumbnail,
       {
-        contentType: asset?.contentType,
+        contentType,
         iconName: isRoot ? "HomeIcon" : isFolder ? "FolderIcon" : void 0,
-        url: asset?.url,
-        selected
+        url,
+        selected,
+        size,
+        fileName
       }
     );
   }
@@ -1241,7 +1508,8 @@ var MediaCollection = (0, import_react.memo)(
     onSelectionChange,
     selectedIds: selectedIdsProp,
     media,
-    setMedia,
+    setMedia: setMediaProp,
+    readOnly = false,
     viewType = "list",
     fileKindFilter = "all",
     showRootItem = false,
@@ -1261,17 +1529,34 @@ var MediaCollection = (0, import_react.memo)(
     sortable = false,
     renderEmptyState
   }, ref) {
+    const setMedia = (0, import_react.useCallback)(
+      (...args) => {
+        setMediaProp?.(...args);
+      },
+      [setMediaProp]
+    );
     const tree = (0, import_react.useMemo)(() => createMediaItemTree(media), [media]);
     const [tempItem, setTempItem] = (0, import_react.useState)(
       void 0
     );
-    const treeWithTempItem = (0, import_react.useMemo)(
-      () => createMediaItemTree({
+    const mediaWithTempItem = (0, import_react.useMemo)(
+      () => ({
         ...media,
         ...tempItem ? { [tempItem[0]]: tempItem[1] } : {}
       }),
       [media, tempItem]
     );
+    const treeWithTempItem = (0, import_react.useMemo)(
+      () => createMediaItemTree(mediaWithTempItem),
+      [mediaWithTempItem]
+    );
+    const temp = (0, import_react.useMemo)(
+      () => ({
+        media: mediaWithTempItem,
+        tree: treeWithTempItem
+      }),
+      [mediaWithTempItem, treeWithTempItem]
+    );
     const [selectedIds, setSelectedIds] = (0, import_react_utils.useControlledOrUncontrolled)(
       {
         defaultValue: [],
@@ -1326,12 +1611,6 @@ var MediaCollection = (0, import_react.memo)(
       if (!itemPath || !firstSelectedPath) return false;
       return itemPath.startsWith(import_imfs3.path.dirname(firstSelectedPath));
     });
-    const gridSize = (0, import_react.useMemo)(() => {
-      if (viewType === "grid") {
-        return size;
-      }
-      return "medium";
-    }, [viewType, size]);
     (0, import_react.useEffect)(() => {
       if (initialExpanded) {
         setExpandedMap(initialExpanded);
@@ -1365,31 +1644,28 @@ var MediaCollection = (0, import_react.memo)(
           selectedItem.id
         );
         if (!selectedItemPath) return;
-        const mediaWithTempItem = {
-          ...media,
-          ...tempItem ? { [tempItem[0]]: tempItem[1] } : {}
-        };
         const renameIsValid = validateMediaItemRename({
           basename: newName,
           selectedItemPath,
-          media: mediaWithTempItem
+          media: temp.media
         });
         if (!renameIsValid) {
           setTempItem(void 0);
           return;
         }
-        const mediaClone = { ...media };
-        delete mediaClone[selectedItemPath];
+        const mediaWithRenamedDescendantPaths = renameMediaItemAndDescendantPaths({
+          newName,
+          selectedItemPath,
+          media: temp.media,
+          tree: temp.tree
+        });
         setMedia(
           { name: "Rename media item", timestamp: Date.now() },
-          {
-            ...mediaClone,
-            [import_imfs3.path.join(import_imfs3.path.dirname(selectedItemPath), newName)]: selectedItem
-          }
+          mediaWithRenamedDescendantPaths
         );
         setTempItem(void 0);
       },
-      [media, renamable, setMedia, tempItem, treeWithTempItem.idToPathMap]
+      [renamable, setMedia, temp.media, temp.tree, treeWithTempItem.idToPathMap]
     );
     const handleAddFolder = (0, import_react.useCallback)(
       (currentFolderId) => {
@@ -1669,8 +1945,10 @@ var MediaCollection = (0, import_react.memo)(
           onSelect: (action) => handleMenuAction(action, selectedMediaItems),
           selected,
           onOpenChange,
+          variant: viewType === "grid" ? "normal" : "bare",
           style: {
-            backgroundColor: selected ? import_noya_designsystem.cssVars.colors.primaryPastel : "transparent"
+            backgroundColor: selected ? import_noya_designsystem.cssVars.colors.selectedListItemBackground : "transparent",
+            color: selected ? import_noya_designsystem.cssVars.colors.selectedListItemText : void 0
           }
         }
       );
@@ -1678,7 +1956,8 @@ var MediaCollection = (0, import_react.memo)(
       assetContextMenuItems,
       handleMenuAction,
       renderActionProp,
-      selectedMediaItems
+      selectedMediaItems,
+      viewType
     ]);
     (0, import_react.useImperativeHandle)(ref, () => ({
       upload: (selectedId) => handleUpload(selectedId),
@@ -1696,7 +1975,7 @@ var MediaCollection = (0, import_react.memo)(
       import_noya_designsystem.FileExplorerLayout,
       {
         title: title ?? rootMediaItemName,
-        right: /* @__PURE__ */ import_react2.default.createElement(
+        right: !readOnly && /* @__PURE__ */ import_react2.default.createElement(
           import_noya_designsystem.FileExplorerUploadButton,
           {
             showUploadButton,
@@ -1713,7 +1992,7 @@ var MediaCollection = (0, import_react.memo)(
           scrollable,
           items: visibleItems,
           viewType,
-          size: gridSize,
+          size,
           getId: (file) => file.id,
           getName: (file) => {
             if (file.id === tempItem?.[1].id) {
@@ -1746,13 +2025,19 @@ var MediaCollection = (0, import_react.memo)(
           onRename,
           renamable,
           selectedIds,
-          renderThumbnail: (props) => /* @__PURE__ */ import_react2.default.createElement(MediaThumbnailInternal, { ...props }),
+          renderThumbnail: (props) => /* @__PURE__ */ import_react2.default.createElement(
+            MediaThumbnailInternal,
+            {
+              ...props,
+              path: tree.idToPathMap.get(props.item.id)
+            }
+          ),
           renderAction,
           renderDetail: (file, selected) => {
             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 }, (asset.size / 1024).toFixed(1), "KB");
+            return /* @__PURE__ */ import_react2.default.createElement(import_noya_designsystem.FileExplorerDetail, { selected, size }, (asset.size / 1024).toFixed(1), "KB");
           },
           renderEmptyState: () => renderEmptyState?.() ?? /* @__PURE__ */ import_react2.default.createElement(import_noya_designsystem.FileExplorerEmptyState, null),
           itemRoleDescription: "clickable file item",
@@ -1769,11 +2054,11 @@ var MediaCollection = (0, import_react.memo)(
             if (position !== "inside" || targetItem.kind === "asset") {
               return false;
             }
-            const sourcePath = tree.findIndexPath(
+            const sourcePath = tree.findPath(
               rootMediaItem,
               (item) => item.id === sourceItem.id
             );
-            const targetPath = tree.findIndexPath(
+            const targetPath = tree.findPath(
               rootMediaItem,
               (item) => item.id === targetItem.id
             );
@@ -1845,6 +2130,7 @@ var MediaCollection = (0, import_react.memo)(
   moveMediaInsideFolder,
   movePathsIntoTarget,
   moveUpAFolder,
+  renameMediaItemAndDescendantPaths,
   rootMediaItem,
   rootMediaItemName,
   rootMediaItemPath,