@headless-tree/core 0.0.0-20250611223358 → 0.0.0-20250611231952

package/CHANGELOG.md

@@ -1,6 +1,6 @@
 # @headless-tree/core
 
-## 0.0.0-20250611223358
+## 0.0.0-20250611231952
 
 ### Minor Changes
 
@@ -17,6 +17,8 @@
 - 727c982: export makeStateUpdater from core package
 - c041a3f: expose `isOrderedDragTarget` as utility method to differentiate between ordered and unordered drag targets (#108)
 - 2887b0c: Added a `item.getKey()` utility method to use for generating React keys. For now, this just returns the item id, so no migration is needed from using `item.getId()` as React keys.
+- 4e79bc7: Fixed a bug where `feature.overwrites` is not always respected when features are sorted during tree initialization
+- 0669580: Fixed a bug where items that call `item.getProps` while being renamed, can be dragged while being renamed (#110)
 
 ## 1.1.0
 

package/lib/cjs/core/create-tree.js

@@ -14,6 +14,18 @@ const verifyFeatures = (features) => {
         }
     }
 };
+// Check all possible pairs and sort the array
+const exhaustiveSort = (arr, compareFn) => {
+    const n = arr.length;
+    for (let i = 0; i < n; i++) {
+        for (let j = i + 1; j < n; j++) {
+            if (compareFn(arr[j], arr[i]) < 0) {
+                [arr[i], arr[j]] = [arr[j], arr[i]];
+            }
+        }
+    }
+    return arr;
+};
 const compareFeatures = (originalOrder) => (feature1, feature2) => {
     var _a, _b;
     if (feature2.key && ((_a = feature1.overwrites) === null || _a === void 0 ? void 0 : _a.includes(feature2.key))) {
@@ -24,7 +36,7 @@ const compareFeatures = (originalOrder) => (feature1, feature2) => {
     }
     return originalOrder.indexOf(feature1) - originalOrder.indexOf(feature2);
 };
-const sortFeatures = (features = []) => features.sort(compareFeatures(features));
+const sortFeatures = (features = []) => exhaustiveSort(features, compareFeatures(features));
 const createTree = (initialConfig) => {
     var _a, _b, _c, _d;
     const buildInstance = (_a = initialConfig.instanceBuilder) !== null && _a !== void 0 ? _a : build_static_instance_1.buildStaticInstance;

package/lib/cjs/features/renaming/feature.js

@@ -4,6 +4,7 @@ exports.renamingFeature = void 0;
 const utils_1 = require("../../utils");
 exports.renamingFeature = {
     key: "renaming",
+    overwrites: ["drag-and-drop"],
     getDefaultConfig: (defaultConfig, tree) => (Object.assign({ setRenamingItem: (0, utils_1.makeStateUpdater)("renamingItem", tree), setRenamingValue: (0, utils_1.makeStateUpdater)("renamingValue", tree), canRename: () => true }, defaultConfig)),
     stateHandlerNames: {
         renamingItem: "setRenamingItem",
@@ -50,6 +51,13 @@ exports.renamingFeature = {
         }),
         canRename: ({ tree, item }) => { var _a, _b, _c; return (_c = (_b = (_a = tree.getConfig()).canRename) === null || _b === void 0 ? void 0 : _b.call(_a, item)) !== null && _c !== void 0 ? _c : true; },
         isRenaming: ({ tree, item }) => item.getId() === tree.getState().renamingItem,
+        getProps: ({ prev, item }) => {
+            var _a;
+            const isRenaming = item.isRenaming();
+            const prevProps = (_a = prev === null || prev === void 0 ? void 0 : prev()) !== null && _a !== void 0 ? _a : {};
+            return isRenaming
+                ? Object.assign(Object.assign({}, prevProps), { draggable: false, onDragStart: () => { } }) : prevProps;
+        },
     },
     hotkeys: {
         renameItem: {

package/lib/esm/core/create-tree.js

@@ -11,6 +11,18 @@ const verifyFeatures = (features) => {
         }
     }
 };
+// Check all possible pairs and sort the array
+const exhaustiveSort = (arr, compareFn) => {
+    const n = arr.length;
+    for (let i = 0; i < n; i++) {
+        for (let j = i + 1; j < n; j++) {
+            if (compareFn(arr[j], arr[i]) < 0) {
+                [arr[i], arr[j]] = [arr[j], arr[i]];
+            }
+        }
+    }
+    return arr;
+};
 const compareFeatures = (originalOrder) => (feature1, feature2) => {
     var _a, _b;
     if (feature2.key && ((_a = feature1.overwrites) === null || _a === void 0 ? void 0 : _a.includes(feature2.key))) {
@@ -21,7 +33,7 @@ const compareFeatures = (originalOrder) => (feature1, feature2) => {
     }
     return originalOrder.indexOf(feature1) - originalOrder.indexOf(feature2);
 };
-const sortFeatures = (features = []) => features.sort(compareFeatures(features));
+const sortFeatures = (features = []) => exhaustiveSort(features, compareFeatures(features));
 export const createTree = (initialConfig) => {
     var _a, _b, _c, _d;
     const buildInstance = (_a = initialConfig.instanceBuilder) !== null && _a !== void 0 ? _a : buildStaticInstance;

package/lib/esm/features/renaming/feature.js

@@ -1,6 +1,7 @@
 import { makeStateUpdater } from "../../utils";
 export const renamingFeature = {
     key: "renaming",
+    overwrites: ["drag-and-drop"],
     getDefaultConfig: (defaultConfig, tree) => (Object.assign({ setRenamingItem: makeStateUpdater("renamingItem", tree), setRenamingValue: makeStateUpdater("renamingValue", tree), canRename: () => true }, defaultConfig)),
     stateHandlerNames: {
         renamingItem: "setRenamingItem",
@@ -47,6 +48,13 @@ export const renamingFeature = {
         }),
         canRename: ({ tree, item }) => { var _a, _b, _c; return (_c = (_b = (_a = tree.getConfig()).canRename) === null || _b === void 0 ? void 0 : _b.call(_a, item)) !== null && _c !== void 0 ? _c : true; },
         isRenaming: ({ tree, item }) => item.getId() === tree.getState().renamingItem,
+        getProps: ({ prev, item }) => {
+            var _a;
+            const isRenaming = item.isRenaming();
+            const prevProps = (_a = prev === null || prev === void 0 ? void 0 : prev()) !== null && _a !== void 0 ? _a : {};
+            return isRenaming
+                ? Object.assign(Object.assign({}, prevProps), { draggable: false, onDragStart: () => { } }) : prevProps;
+        },
     },
     hotkeys: {
         renameItem: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@headless-tree/core",
-  "version": "0.0.0-20250611223358",
+  "version": "0.0.0-20250611231952",
   "main": "lib/cjs/index.js",
   "module": "lib/esm/index.js",
   "types": "lib/esm/index.d.ts",

package/src/core/create-tree.ts

@@ -24,6 +24,24 @@ const verifyFeatures = (features: FeatureImplementation[] | undefined) => {
   }
 };
 
+// Check all possible pairs and sort the array
+const exhaustiveSort = <T>(
+  arr: T[],
+  compareFn: (param1: T, param2: T) => number,
+) => {
+  const n = arr.length;
+
+  for (let i = 0; i < n; i++) {
+    for (let j = i + 1; j < n; j++) {
+      if (compareFn(arr[j], arr[i]) < 0) {
+        [arr[i], arr[j]] = [arr[j], arr[i]];
+      }
+    }
+  }
+
+  return arr;
+};
+
 const compareFeatures =
   (originalOrder: FeatureImplementation[]) =>
   (feature1: FeatureImplementation, feature2: FeatureImplementation) => {
@@ -33,11 +51,12 @@ const compareFeatures =
     if (feature1.key && feature2.overwrites?.includes(feature1.key)) {
       return -1;
     }
+
     return originalOrder.indexOf(feature1) - originalOrder.indexOf(feature2);
   };
 
 const sortFeatures = (features: FeatureImplementation[] = []) =>
-  features.sort(compareFeatures(features));
+  exhaustiveSort(features, compareFeatures(features));
 
 export const createTree = <T>(
   initialConfig: TreeConfig<T>,

package/src/features/renaming/feature.ts

@@ -9,6 +9,7 @@ type InputEvent = {
 
 export const renamingFeature: FeatureImplementation = {
   key: "renaming",
+  overwrites: ["drag-and-drop"],
 
   getDefaultConfig: (defaultConfig, tree) => ({
     setRenamingItem: makeStateUpdater("renamingItem", tree),
@@ -72,6 +73,18 @@ export const renamingFeature: FeatureImplementation = {
 
     isRenaming: ({ tree, item }) =>
       item.getId() === tree.getState().renamingItem,
+
+    getProps: ({ prev, item }) => {
+      const isRenaming = item.isRenaming();
+      const prevProps = prev?.() ?? {};
+      return isRenaming
+        ? {
+            ...prevProps,
+            draggable: false,
+            onDragStart: () => {},
+          }
+        : prevProps;
+    },
   },
 
   hotkeys: {

package/src/features/renaming/renaming.spec.ts

@@ -93,6 +93,37 @@ describe("core-feature/renaming", () => {
       expect(setRenamingItem).toHaveBeenCalledWith(null);
     });
 
+    describe("dragging", async () => {
+      const suiteTree = await tree
+        .withFeatures({
+          key: "drag-and-drop",
+          itemInstance: {
+            getProps: ({ prev }: any) => ({
+              ...prev?.(),
+              draggable: true,
+              onDragStart: "initialOnDragStart",
+            }),
+          },
+        })
+        .createTestCaseTree();
+      suiteTree.resetBeforeEach();
+
+      it("sets draggable to undefined for items being renamed", () => {
+        const item = suiteTree.item("x1");
+        item.startRenaming();
+        const props = item.getProps();
+        expect(props.draggable).toBe(false);
+        expect(props.onDragStart).toStrictEqual(expect.any(Function));
+      });
+
+      it("retains draggable for items not being renamed", () => {
+        const item = suiteTree.item("x1");
+        const props = item.getProps();
+        expect(props.draggable).toBe(true);
+        expect(props.onDragStart).toBe("initialOnDragStart");
+      });
+    });
+
     describe("hotkeys", () => {
       it("starts renaming", () => {
         const setRenamingItem = tree.mockedHandler("setRenamingItem");