@headless-tree/core 0.0.0-20250511185653 → 0.0.0-20250511194715

package/CHANGELOG.md

@@ -1,10 +1,11 @@
 # @headless-tree/core
 
-## 0.0.0-20250511185653
+## 0.0.0-20250511194715
 
 ### Minor Changes
 
 - 64d8e2a: add getChildrenWithData method to data loader to support fetching all children of an item at once
+- 35260e3: fixed hotkey issues where releasing modifier keys (like shift) before normal keys can cause issues with subsequent keydown events
 
 ### Patch Changes
 

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

@@ -100,15 +100,6 @@ const createTree = (initialConfig) => {
                 const externalStateSetter = config[stateHandlerNames[stateName]];
                 externalStateSetter === null || externalStateSetter === void 0 ? void 0 : externalStateSetter(state[stateName]);
             },
-            buildItemInstance: ({}, itemId) => {
-                const [instance, finalizeInstance] = buildInstance(features, "itemInstance", (instance) => ({
-                    item: instance,
-                    tree: treeInstance,
-                    itemId,
-                }));
-                finalizeInstance();
-                return instance;
-            },
             // TODO rebuildSubTree: (itemId: string) => void;
             rebuildTree: () => {
                 var _a;

package/lib/cjs/features/async-data-loader/feature.js

@@ -20,44 +20,41 @@ const getDataRef = (tree) => {
     return dataRef;
 };
 const loadItemData = (tree, itemId) => __awaiter(void 0, void 0, void 0, function* () {
-    var _a, _b, _c;
+    var _a;
     const config = tree.getConfig();
     const dataRef = getDataRef(tree);
     const item = yield config.dataLoader.getItem(itemId);
     dataRef.current.itemData[itemId] = item;
     (_a = config.onLoadedItem) === null || _a === void 0 ? void 0 : _a.call(config, itemId, item);
     tree.applySubStateUpdate("loadingItemData", (loadingItemData) => loadingItemData.filter((id) => id !== itemId));
-    (_b = dataRef.current.awaitingItemDataLoading) === null || _b === void 0 ? void 0 : _b[itemId].forEach((cb) => cb());
-    (_c = dataRef.current.awaitingItemDataLoading) === null || _c === void 0 ? true : delete _c[itemId];
+    return item;
 });
 const loadChildrenIds = (tree, itemId) => __awaiter(void 0, void 0, void 0, function* () {
-    var _a, _b, _c, _d, _e;
+    var _a, _b;
     const config = tree.getConfig();
     const dataRef = getDataRef(tree);
+    let childrenIds;
     if ("getChildrenWithData" in config.dataLoader) {
         const children = yield config.dataLoader.getChildrenWithData(itemId);
-        const childrenIds = children.map((c) => c.id);
+        childrenIds = children.map((c) => c.id);
         dataRef.current.childrenIds[itemId] = childrenIds;
         children.forEach(({ id, data }) => {
-            var _a, _b, _c;
+            var _a;
             dataRef.current.itemData[id] = data;
             (_a = config.onLoadedItem) === null || _a === void 0 ? void 0 : _a.call(config, id, data);
-            (_b = dataRef.current.awaitingItemDataLoading) === null || _b === void 0 ? void 0 : _b[id].forEach((cb) => cb());
-            (_c = dataRef.current.awaitingItemDataLoading) === null || _c === void 0 ? true : delete _c[id];
         });
         (_a = config.onLoadedChildren) === null || _a === void 0 ? void 0 : _a.call(config, itemId, childrenIds);
         tree.rebuildTree();
         tree.applySubStateUpdate("loadingItemData", (loadingItemData) => loadingItemData.filter((id) => !childrenIds.includes(id)));
     }
     else {
-        const childrenIds = yield config.dataLoader.getChildren(itemId);
+        childrenIds = yield config.dataLoader.getChildren(itemId);
         dataRef.current.childrenIds[itemId] = childrenIds;
         (_b = config.onLoadedChildren) === null || _b === void 0 ? void 0 : _b.call(config, itemId, childrenIds);
         tree.rebuildTree();
     }
     tree.applySubStateUpdate("loadingItemChildrens", (loadingItemChildrens) => loadingItemChildrens.filter((id) => id !== itemId));
-    (_d = (_c = dataRef.current.awaitingItemChildrensLoading) === null || _c === void 0 ? void 0 : _c[itemId]) === null || _d === void 0 ? void 0 : _d.forEach((cb) => cb());
-    (_e = dataRef.current.awaitingItemChildrensLoading) === null || _e === void 0 ? true : delete _e[itemId];
+    return childrenIds;
 });
 exports.asyncDataLoaderFeature = {
     key: "async-data-loader",
@@ -68,42 +65,24 @@ exports.asyncDataLoaderFeature = {
         loadingItemChildrens: "setLoadingItemChildrens",
     },
     treeInstance: {
-        waitForItemDataLoaded: (_a, itemId_1) => __awaiter(void 0, [_a, itemId_1], void 0, function* ({ tree }, itemId) {
-            tree.retrieveItemData(itemId);
-            if (!tree.getState().loadingItemData.includes(itemId)) {
-                return;
-            }
-            yield new Promise((resolve) => {
-                var _a, _b;
-                var _c, _d;
-                const dataRef = tree.getDataRef();
-                (_a = (_c = dataRef.current).awaitingItemDataLoading) !== null && _a !== void 0 ? _a : (_c.awaitingItemDataLoading = {});
-                (_b = (_d = dataRef.current.awaitingItemDataLoading)[itemId]) !== null && _b !== void 0 ? _b : (_d[itemId] = []);
-                dataRef.current.awaitingItemDataLoading[itemId].push(resolve);
-            });
+        waitForItemDataLoaded: ({ tree }, itemId) => tree.loadItemData(itemId),
+        waitForItemChildrenLoaded: ({ tree }, itemId) => tree.loadChildrenIds(itemId),
+        loadItemData: (_a, itemId_1) => __awaiter(void 0, [_a, itemId_1], void 0, function* ({ tree }, itemId) {
+            var _b;
+            return ((_b = getDataRef(tree).current.itemData[itemId]) !== null && _b !== void 0 ? _b : (yield loadItemData(tree, itemId)));
         }),
-        waitForItemChildrenLoaded: (_a, itemId_1) => __awaiter(void 0, [_a, itemId_1], void 0, function* ({ tree }, itemId) {
-            tree.retrieveChildrenIds(itemId);
-            if (!tree.getState().loadingItemChildrens.includes(itemId)) {
-                return;
-            }
-            yield new Promise((resolve) => {
-                var _a, _b;
-                var _c, _d;
-                const dataRef = tree.getDataRef();
-                (_a = (_c = dataRef.current).awaitingItemChildrensLoading) !== null && _a !== void 0 ? _a : (_c.awaitingItemChildrensLoading = {});
-                (_b = (_d = dataRef.current.awaitingItemChildrensLoading)[itemId]) !== null && _b !== void 0 ? _b : (_d[itemId] = []);
-                dataRef.current.awaitingItemChildrensLoading[itemId].push(resolve);
-            });
+        loadChildrenIds: (_a, itemId_1) => __awaiter(void 0, [_a, itemId_1], void 0, function* ({ tree }, itemId) {
+            var _b;
+            return ((_b = getDataRef(tree).current.childrenIds[itemId]) !== null && _b !== void 0 ? _b : (yield loadChildrenIds(tree, itemId)));
         }),
-        retrieveItemData: ({ tree }, itemId, skipFetch = false) => {
+        retrieveItemData: ({ tree }, itemId) => {
             var _a, _b;
             const config = tree.getConfig();
             const dataRef = getDataRef(tree);
             if (dataRef.current.itemData[itemId]) {
                 return dataRef.current.itemData[itemId];
             }
-            if (!tree.getState().loadingItemData.includes(itemId) && !skipFetch) {
+            if (!tree.getState().loadingItemData.includes(itemId)) {
                 tree.applySubStateUpdate("loadingItemData", (loadingItemData) => [
                     ...loadingItemData,
                     itemId,
@@ -112,12 +91,12 @@ exports.asyncDataLoaderFeature = {
             }
             return (_b = (_a = config.createLoadingItemData) === null || _a === void 0 ? void 0 : _a.call(config)) !== null && _b !== void 0 ? _b : null;
         },
-        retrieveChildrenIds: ({ tree }, itemId, skipFetch = false) => {
+        retrieveChildrenIds: ({ tree }, itemId) => {
             const dataRef = getDataRef(tree);
             if (dataRef.current.childrenIds[itemId]) {
                 return dataRef.current.childrenIds[itemId];
             }
-            if (tree.getState().loadingItemChildrens.includes(itemId) || skipFetch) {
+            if (tree.getState().loadingItemChildrens.includes(itemId)) {
                 return [];
             }
             tree.applySubStateUpdate("loadingItemChildrens", (loadingItemChildrens) => [...loadingItemChildrens, itemId]);

package/lib/cjs/features/async-data-loader/types.d.ts

@@ -1,11 +1,8 @@
 import { SetStateFn } from "../../types/core";
 import { SyncDataLoaderFeatureDef } from "../sync-data-loader/types";
-type AwaitingLoaderCallbacks = Record<string, (() => void)[]>;
 export interface AsyncDataLoaderDataRef<T = any> {
     itemData: Record<string, T>;
     childrenIds: Record<string, string[]>;
-    awaitingItemDataLoading: AwaitingLoaderCallbacks;
-    awaitingItemChildrensLoading: AwaitingLoaderCallbacks;
 }
 /**
  * @category Async Data Loader/General
@@ -27,8 +24,12 @@ export type AsyncDataLoaderFeatureDef<T> = {
         onLoadedChildren?: (itemId: string, childrenIds: string[]) => void;
     };
     treeInstance: SyncDataLoaderFeatureDef<T>["treeInstance"] & {
+        /** @deprecated use loadItemData instead */
         waitForItemDataLoaded: (itemId: string) => Promise<void>;
+        /** @deprecated use loadChildrenIds instead */
         waitForItemChildrenLoaded: (itemId: string) => Promise<void>;
+        loadItemData: (itemId: string) => Promise<T>;
+        loadChildrenIds: (itemId: string) => Promise<string[]>;
     };
     itemInstance: SyncDataLoaderFeatureDef<T>["itemInstance"] & {
         /** Invalidate fetched data for item, and triggers a refetch and subsequent rerender if the item is visible
@@ -44,4 +45,3 @@ export type AsyncDataLoaderFeatureDef<T> = {
     };
     hotkeys: SyncDataLoaderFeatureDef<T>["hotkeys"];
 };
-export {};

package/lib/cjs/features/expand-all/feature.js

@@ -51,7 +51,7 @@ exports.expandAllFeature = {
             handler: (_, tree) => __awaiter(void 0, void 0, void 0, function* () {
                 const cancelToken = { current: false };
                 const cancelHandler = (e) => {
-                    if (e.key === "Escape") {
+                    if (e.code === "Escape") {
                         cancelToken.current = true;
                     }
                 };
@@ -61,7 +61,7 @@ exports.expandAllFeature = {
             }),
         },
         collapseSelected: {
-            hotkey: "Control+Shift+-",
+            hotkey: "Control+Shift+Minus",
             handler: (_, tree) => {
                 tree.getSelectedItems().forEach((item) => item.collapseAll());
             },

package/lib/cjs/features/hotkeys-core/feature.js

@@ -2,16 +2,31 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.hotkeysCoreFeature = void 0;
 const specialKeys = {
-    Letter: /^[a-z]$/,
-    LetterOrNumber: /^[a-z0-9]$/,
-    Plus: /^\+$/,
-    Space: /^ $/,
+    // TODO:breaking deprecate auto-lowercase
+    letter: /^Key[A-Z]$/,
+    letterornumber: /^(Key[A-Z]|Digit[0-9])$/,
+    plus: /^(NumpadAdd|Plus)$/,
+    minus: /^(NumpadSubtract|Minus)$/,
+    control: /^(ControlLeft|ControlRight)$/,
+    shift: /^(ShiftLeft|ShiftRight)$/,
 };
 const testHotkeyMatch = (pressedKeys, tree, hotkey) => {
-    const supposedKeys = hotkey.hotkey.toLowerCase().split("+");
-    const doKeysMatch = supposedKeys.every((key) => key in specialKeys
-        ? [...pressedKeys].some((pressedKey) => specialKeys[key].test(pressedKey))
-        : pressedKeys.has(key));
+    const supposedKeys = hotkey.hotkey.toLowerCase().split("+"); // TODO:breaking deprecate auto-lowercase
+    const doKeysMatch = supposedKeys.every((key) => {
+        if (key in specialKeys) {
+            return [...pressedKeys].some((pressedKey) => specialKeys[key].test(pressedKey));
+        }
+        const pressedKeysLowerCase = [...pressedKeys] // TODO:breaking deprecate auto-lowercase
+            .map((k) => k.toLowerCase());
+        if (pressedKeysLowerCase.includes(key.toLowerCase())) {
+            return true;
+        }
+        if (pressedKeysLowerCase.includes(`key${key.toLowerCase()}`)) {
+            // TODO:breaking deprecate e.key character matching
+            return true;
+        }
+        return false;
+    });
     const isEnabled = !hotkey.isEnabled || hotkey.isEnabled(tree);
     const equalCounts = pressedKeys.size === supposedKeys.length;
     return doKeysMatch && isEnabled && equalCounts;
@@ -31,15 +46,14 @@ exports.hotkeysCoreFeature = {
             if (e.target instanceof HTMLInputElement && ignoreHotkeysOnInputs) {
                 return;
             }
-            const key = e.key.toLowerCase();
             (_a = (_b = data.current).pressedKeys) !== null && _a !== void 0 ? _a : (_b.pressedKeys = new Set());
-            const newMatch = !data.current.pressedKeys.has(key);
-            data.current.pressedKeys.add(key);
+            const newMatch = !data.current.pressedKeys.has(e.code);
+            data.current.pressedKeys.add(e.code);
             const hotkeyName = findHotkeyMatch(data.current.pressedKeys, tree, tree.getHotkeyPresets(), hotkeys);
             if (e.target instanceof HTMLInputElement) {
                 // JS respects composite keydowns while input elements are focused, and
                 // doesnt send the associated keyup events with the same key name
-                data.current.pressedKeys.delete(key);
+                data.current.pressedKeys.delete(e.code);
             }
             if (!hotkeyName)
                 return;
@@ -60,7 +74,7 @@ exports.hotkeysCoreFeature = {
             var _a;
             var _b;
             (_a = (_b = data.current).pressedKeys) !== null && _a !== void 0 ? _a : (_b.pressedKeys = new Set());
-            data.current.pressedKeys.delete(e.key.toLowerCase());
+            data.current.pressedKeys.delete(e.code);
         };
         const reset = () => {
             data.current.pressedKeys = new Set();

package/lib/cjs/features/keyboard-drag-and-drop/feature.js

@@ -144,7 +144,7 @@ exports.keyboardDragAndDropFeature = {
     },
     hotkeys: {
         startDrag: {
-            hotkey: "Control+Shift+D",
+            hotkey: "Control+Shift+KeyD",
             preventDefault: true,
             isEnabled: (tree) => !tree.getState().dnd,
             handler: (_, tree) => {

package/lib/cjs/features/main/types.d.ts

@@ -17,8 +17,6 @@ export type MainFeatureDef<T = any> = {
     treeInstance: {
         /** @internal */
         applySubStateUpdate: <K extends keyof TreeState<any>>(stateName: K, updater: Updater<TreeState<T>[K]>) => void;
-        /** @internal */
-        buildItemInstance: (itemId: string) => ItemInstance<T>;
         setState: SetStateFn<TreeState<T>>;
         getState: () => TreeState<T>;
         setConfig: SetStateFn<TreeConfig<T>>;

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

@@ -122,7 +122,7 @@ exports.selectionFeature = {
             },
         },
         selectAll: {
-            hotkey: "Control+a",
+            hotkey: "Control+KeyA",
             preventDefault: true,
             handler: (e, tree) => {
                 tree.setSelectedItems(tree.getItems().map((item) => item.getId()));

package/lib/cjs/features/sync-data-loader/feature.js

@@ -40,6 +40,8 @@ exports.syncDataLoaderFeature = {
             }
             return unpromise(dataLoader.getChildrenWithData(itemId)).map((c) => c.data);
         },
+        loadItemData: ({ tree }, itemId) => tree.retrieveItemData(itemId),
+        loadChildrenIds: ({ tree }, itemId) => tree.retrieveChildrenIds(itemId),
     },
     itemInstance: {
         isLoading: () => false,

package/lib/cjs/index.d.ts

@@ -5,7 +5,6 @@ export { MainFeatureDef, InstanceBuilder } from "./features/main/types";
 export * from "./features/drag-and-drop/types";
 export * from "./features/keyboard-drag-and-drop/types";
 export * from "./features/selection/types";
-export * from "./features/checkboxes/types";
 export * from "./features/async-data-loader/types";
 export * from "./features/sync-data-loader/types";
 export * from "./features/hotkeys-core/types";
@@ -14,7 +13,6 @@ export * from "./features/renaming/types";
 export * from "./features/expand-all/types";
 export * from "./features/prop-memoization/types";
 export * from "./features/selection/feature";
-export * from "./features/checkboxes/feature";
 export * from "./features/hotkeys-core/feature";
 export * from "./features/async-data-loader/feature";
 export * from "./features/sync-data-loader/feature";

package/lib/cjs/index.js

@@ -20,7 +20,6 @@ __exportStar(require("./features/tree/types"), exports);
 __exportStar(require("./features/drag-and-drop/types"), exports);
 __exportStar(require("./features/keyboard-drag-and-drop/types"), exports);
 __exportStar(require("./features/selection/types"), exports);
-__exportStar(require("./features/checkboxes/types"), exports);
 __exportStar(require("./features/async-data-loader/types"), exports);
 __exportStar(require("./features/sync-data-loader/types"), exports);
 __exportStar(require("./features/hotkeys-core/types"), exports);
@@ -29,7 +28,6 @@ __exportStar(require("./features/renaming/types"), exports);
 __exportStar(require("./features/expand-all/types"), exports);
 __exportStar(require("./features/prop-memoization/types"), exports);
 __exportStar(require("./features/selection/feature"), exports);
-__exportStar(require("./features/checkboxes/feature"), exports);
 __exportStar(require("./features/hotkeys-core/feature"), exports);
 __exportStar(require("./features/async-data-loader/feature"), exports);
 __exportStar(require("./features/sync-data-loader/feature"), exports);

package/lib/cjs/types/core.d.ts

@@ -10,7 +10,6 @@ import { RenamingFeatureDef } from "../features/renaming/types";
 import { ExpandAllFeatureDef } from "../features/expand-all/types";
 import { PropMemoizationFeatureDef } from "../features/prop-memoization/types";
 import { KeyboardDragAndDropFeatureDef } from "../features/keyboard-drag-and-drop/types";
-import { CheckboxesFeatureDef } from "../features/checkboxes/types";
 export type Updater<T> = T | ((old: T) => T);
 export type SetStateFn<T> = (updaterOrValue: Updater<T>) => void;
 export type FeatureDef = {
@@ -35,7 +34,7 @@ type MergedFeatures<F extends FeatureDef> = {
     itemInstance: UnionToIntersection<F["itemInstance"]>;
     hotkeys: F["hotkeys"];
 };
-export type RegisteredFeatures<T> = MainFeatureDef<T> | TreeFeatureDef<T> | SelectionFeatureDef<T> | CheckboxesFeatureDef<T> | DragAndDropFeatureDef<T> | KeyboardDragAndDropFeatureDef<T> | HotkeysCoreFeatureDef<T> | SyncDataLoaderFeatureDef<T> | AsyncDataLoaderFeatureDef<T> | SearchFeatureDef<T> | RenamingFeatureDef<T> | ExpandAllFeatureDef | PropMemoizationFeatureDef;
+export type RegisteredFeatures<T> = MainFeatureDef<T> | TreeFeatureDef<T> | SelectionFeatureDef<T> | DragAndDropFeatureDef<T> | KeyboardDragAndDropFeatureDef<T> | HotkeysCoreFeatureDef<T> | SyncDataLoaderFeatureDef<T> | AsyncDataLoaderFeatureDef<T> | SearchFeatureDef<T> | RenamingFeatureDef<T> | ExpandAllFeatureDef | PropMemoizationFeatureDef;
 type TreeStateType<T> = MergedFeatures<RegisteredFeatures<T>>["state"];
 export interface TreeState<T> extends TreeStateType<T> {
 }

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

@@ -97,15 +97,6 @@ export const createTree = (initialConfig) => {
                 const externalStateSetter = config[stateHandlerNames[stateName]];
                 externalStateSetter === null || externalStateSetter === void 0 ? void 0 : externalStateSetter(state[stateName]);
             },
-            buildItemInstance: ({}, itemId) => {
-                const [instance, finalizeInstance] = buildInstance(features, "itemInstance", (instance) => ({
-                    item: instance,
-                    tree: treeInstance,
-                    itemId,
-                }));
-                finalizeInstance();
-                return instance;
-            },
             // TODO rebuildSubTree: (itemId: string) => void;
             rebuildTree: () => {
                 var _a;

package/lib/esm/features/async-data-loader/feature.js

@@ -17,44 +17,41 @@ const getDataRef = (tree) => {
     return dataRef;
 };
 const loadItemData = (tree, itemId) => __awaiter(void 0, void 0, void 0, function* () {
-    var _a, _b, _c;
+    var _a;
     const config = tree.getConfig();
     const dataRef = getDataRef(tree);
     const item = yield config.dataLoader.getItem(itemId);
     dataRef.current.itemData[itemId] = item;
     (_a = config.onLoadedItem) === null || _a === void 0 ? void 0 : _a.call(config, itemId, item);
     tree.applySubStateUpdate("loadingItemData", (loadingItemData) => loadingItemData.filter((id) => id !== itemId));
-    (_b = dataRef.current.awaitingItemDataLoading) === null || _b === void 0 ? void 0 : _b[itemId].forEach((cb) => cb());
-    (_c = dataRef.current.awaitingItemDataLoading) === null || _c === void 0 ? true : delete _c[itemId];
+    return item;
 });
 const loadChildrenIds = (tree, itemId) => __awaiter(void 0, void 0, void 0, function* () {
-    var _a, _b, _c, _d, _e;
+    var _a, _b;
     const config = tree.getConfig();
     const dataRef = getDataRef(tree);
+    let childrenIds;
     if ("getChildrenWithData" in config.dataLoader) {
         const children = yield config.dataLoader.getChildrenWithData(itemId);
-        const childrenIds = children.map((c) => c.id);
+        childrenIds = children.map((c) => c.id);
         dataRef.current.childrenIds[itemId] = childrenIds;
         children.forEach(({ id, data }) => {
-            var _a, _b, _c;
+            var _a;
             dataRef.current.itemData[id] = data;
             (_a = config.onLoadedItem) === null || _a === void 0 ? void 0 : _a.call(config, id, data);
-            (_b = dataRef.current.awaitingItemDataLoading) === null || _b === void 0 ? void 0 : _b[id].forEach((cb) => cb());
-            (_c = dataRef.current.awaitingItemDataLoading) === null || _c === void 0 ? true : delete _c[id];
         });
         (_a = config.onLoadedChildren) === null || _a === void 0 ? void 0 : _a.call(config, itemId, childrenIds);
         tree.rebuildTree();
         tree.applySubStateUpdate("loadingItemData", (loadingItemData) => loadingItemData.filter((id) => !childrenIds.includes(id)));
     }
     else {
-        const childrenIds = yield config.dataLoader.getChildren(itemId);
+        childrenIds = yield config.dataLoader.getChildren(itemId);
         dataRef.current.childrenIds[itemId] = childrenIds;
         (_b = config.onLoadedChildren) === null || _b === void 0 ? void 0 : _b.call(config, itemId, childrenIds);
         tree.rebuildTree();
     }
     tree.applySubStateUpdate("loadingItemChildrens", (loadingItemChildrens) => loadingItemChildrens.filter((id) => id !== itemId));
-    (_d = (_c = dataRef.current.awaitingItemChildrensLoading) === null || _c === void 0 ? void 0 : _c[itemId]) === null || _d === void 0 ? void 0 : _d.forEach((cb) => cb());
-    (_e = dataRef.current.awaitingItemChildrensLoading) === null || _e === void 0 ? true : delete _e[itemId];
+    return childrenIds;
 });
 export const asyncDataLoaderFeature = {
     key: "async-data-loader",
@@ -65,42 +62,24 @@ export const asyncDataLoaderFeature = {
         loadingItemChildrens: "setLoadingItemChildrens",
     },
     treeInstance: {
-        waitForItemDataLoaded: (_a, itemId_1) => __awaiter(void 0, [_a, itemId_1], void 0, function* ({ tree }, itemId) {
-            tree.retrieveItemData(itemId);
-            if (!tree.getState().loadingItemData.includes(itemId)) {
-                return;
-            }
-            yield new Promise((resolve) => {
-                var _a, _b;
-                var _c, _d;
-                const dataRef = tree.getDataRef();
-                (_a = (_c = dataRef.current).awaitingItemDataLoading) !== null && _a !== void 0 ? _a : (_c.awaitingItemDataLoading = {});
-                (_b = (_d = dataRef.current.awaitingItemDataLoading)[itemId]) !== null && _b !== void 0 ? _b : (_d[itemId] = []);
-                dataRef.current.awaitingItemDataLoading[itemId].push(resolve);
-            });
+        waitForItemDataLoaded: ({ tree }, itemId) => tree.loadItemData(itemId),
+        waitForItemChildrenLoaded: ({ tree }, itemId) => tree.loadChildrenIds(itemId),
+        loadItemData: (_a, itemId_1) => __awaiter(void 0, [_a, itemId_1], void 0, function* ({ tree }, itemId) {
+            var _b;
+            return ((_b = getDataRef(tree).current.itemData[itemId]) !== null && _b !== void 0 ? _b : (yield loadItemData(tree, itemId)));
         }),
-        waitForItemChildrenLoaded: (_a, itemId_1) => __awaiter(void 0, [_a, itemId_1], void 0, function* ({ tree }, itemId) {
-            tree.retrieveChildrenIds(itemId);
-            if (!tree.getState().loadingItemChildrens.includes(itemId)) {
-                return;
-            }
-            yield new Promise((resolve) => {
-                var _a, _b;
-                var _c, _d;
-                const dataRef = tree.getDataRef();
-                (_a = (_c = dataRef.current).awaitingItemChildrensLoading) !== null && _a !== void 0 ? _a : (_c.awaitingItemChildrensLoading = {});
-                (_b = (_d = dataRef.current.awaitingItemChildrensLoading)[itemId]) !== null && _b !== void 0 ? _b : (_d[itemId] = []);
-                dataRef.current.awaitingItemChildrensLoading[itemId].push(resolve);
-            });
+        loadChildrenIds: (_a, itemId_1) => __awaiter(void 0, [_a, itemId_1], void 0, function* ({ tree }, itemId) {
+            var _b;
+            return ((_b = getDataRef(tree).current.childrenIds[itemId]) !== null && _b !== void 0 ? _b : (yield loadChildrenIds(tree, itemId)));
         }),
-        retrieveItemData: ({ tree }, itemId, skipFetch = false) => {
+        retrieveItemData: ({ tree }, itemId) => {
             var _a, _b;
             const config = tree.getConfig();
             const dataRef = getDataRef(tree);
             if (dataRef.current.itemData[itemId]) {
                 return dataRef.current.itemData[itemId];
             }
-            if (!tree.getState().loadingItemData.includes(itemId) && !skipFetch) {
+            if (!tree.getState().loadingItemData.includes(itemId)) {
                 tree.applySubStateUpdate("loadingItemData", (loadingItemData) => [
                     ...loadingItemData,
                     itemId,
@@ -109,12 +88,12 @@ export const asyncDataLoaderFeature = {
             }
             return (_b = (_a = config.createLoadingItemData) === null || _a === void 0 ? void 0 : _a.call(config)) !== null && _b !== void 0 ? _b : null;
         },
-        retrieveChildrenIds: ({ tree }, itemId, skipFetch = false) => {
+        retrieveChildrenIds: ({ tree }, itemId) => {
             const dataRef = getDataRef(tree);
             if (dataRef.current.childrenIds[itemId]) {
                 return dataRef.current.childrenIds[itemId];
             }
-            if (tree.getState().loadingItemChildrens.includes(itemId) || skipFetch) {
+            if (tree.getState().loadingItemChildrens.includes(itemId)) {
                 return [];
             }
             tree.applySubStateUpdate("loadingItemChildrens", (loadingItemChildrens) => [...loadingItemChildrens, itemId]);

package/lib/esm/features/async-data-loader/types.d.ts

@@ -1,11 +1,8 @@
 import { SetStateFn } from "../../types/core";
 import { SyncDataLoaderFeatureDef } from "../sync-data-loader/types";
-type AwaitingLoaderCallbacks = Record<string, (() => void)[]>;
 export interface AsyncDataLoaderDataRef<T = any> {
     itemData: Record<string, T>;
     childrenIds: Record<string, string[]>;
-    awaitingItemDataLoading: AwaitingLoaderCallbacks;
-    awaitingItemChildrensLoading: AwaitingLoaderCallbacks;
 }
 /**
  * @category Async Data Loader/General
@@ -27,8 +24,12 @@ export type AsyncDataLoaderFeatureDef<T> = {
         onLoadedChildren?: (itemId: string, childrenIds: string[]) => void;
     };
     treeInstance: SyncDataLoaderFeatureDef<T>["treeInstance"] & {
+        /** @deprecated use loadItemData instead */
         waitForItemDataLoaded: (itemId: string) => Promise<void>;
+        /** @deprecated use loadChildrenIds instead */
         waitForItemChildrenLoaded: (itemId: string) => Promise<void>;
+        loadItemData: (itemId: string) => Promise<T>;
+        loadChildrenIds: (itemId: string) => Promise<string[]>;
     };
     itemInstance: SyncDataLoaderFeatureDef<T>["itemInstance"] & {
         /** Invalidate fetched data for item, and triggers a refetch and subsequent rerender if the item is visible
@@ -44,4 +45,3 @@ export type AsyncDataLoaderFeatureDef<T> = {
     };
     hotkeys: SyncDataLoaderFeatureDef<T>["hotkeys"];
 };
-export {};

package/lib/esm/features/expand-all/feature.js

@@ -48,7 +48,7 @@ export const expandAllFeature = {
             handler: (_, tree) => __awaiter(void 0, void 0, void 0, function* () {
                 const cancelToken = { current: false };
                 const cancelHandler = (e) => {
-                    if (e.key === "Escape") {
+                    if (e.code === "Escape") {
                         cancelToken.current = true;
                     }
                 };
@@ -58,7 +58,7 @@ export const expandAllFeature = {
             }),
         },
         collapseSelected: {
-            hotkey: "Control+Shift+-",
+            hotkey: "Control+Shift+Minus",
             handler: (_, tree) => {
                 tree.getSelectedItems().forEach((item) => item.collapseAll());
             },

package/lib/esm/features/hotkeys-core/feature.js

@@ -1,14 +1,29 @@
 const specialKeys = {
-    Letter: /^[a-z]$/,
-    LetterOrNumber: /^[a-z0-9]$/,
-    Plus: /^\+$/,
-    Space: /^ $/,
+    // TODO:breaking deprecate auto-lowercase
+    letter: /^Key[A-Z]$/,
+    letterornumber: /^(Key[A-Z]|Digit[0-9])$/,
+    plus: /^(NumpadAdd|Plus)$/,
+    minus: /^(NumpadSubtract|Minus)$/,
+    control: /^(ControlLeft|ControlRight)$/,
+    shift: /^(ShiftLeft|ShiftRight)$/,
 };
 const testHotkeyMatch = (pressedKeys, tree, hotkey) => {
-    const supposedKeys = hotkey.hotkey.toLowerCase().split("+");
-    const doKeysMatch = supposedKeys.every((key) => key in specialKeys
-        ? [...pressedKeys].some((pressedKey) => specialKeys[key].test(pressedKey))
-        : pressedKeys.has(key));
+    const supposedKeys = hotkey.hotkey.toLowerCase().split("+"); // TODO:breaking deprecate auto-lowercase
+    const doKeysMatch = supposedKeys.every((key) => {
+        if (key in specialKeys) {
+            return [...pressedKeys].some((pressedKey) => specialKeys[key].test(pressedKey));
+        }
+        const pressedKeysLowerCase = [...pressedKeys] // TODO:breaking deprecate auto-lowercase
+            .map((k) => k.toLowerCase());
+        if (pressedKeysLowerCase.includes(key.toLowerCase())) {
+            return true;
+        }
+        if (pressedKeysLowerCase.includes(`key${key.toLowerCase()}`)) {
+            // TODO:breaking deprecate e.key character matching
+            return true;
+        }
+        return false;
+    });
     const isEnabled = !hotkey.isEnabled || hotkey.isEnabled(tree);
     const equalCounts = pressedKeys.size === supposedKeys.length;
     return doKeysMatch && isEnabled && equalCounts;
@@ -28,15 +43,14 @@ export const hotkeysCoreFeature = {
             if (e.target instanceof HTMLInputElement && ignoreHotkeysOnInputs) {
                 return;
             }
-            const key = e.key.toLowerCase();
             (_a = (_b = data.current).pressedKeys) !== null && _a !== void 0 ? _a : (_b.pressedKeys = new Set());
-            const newMatch = !data.current.pressedKeys.has(key);
-            data.current.pressedKeys.add(key);
+            const newMatch = !data.current.pressedKeys.has(e.code);
+            data.current.pressedKeys.add(e.code);
             const hotkeyName = findHotkeyMatch(data.current.pressedKeys, tree, tree.getHotkeyPresets(), hotkeys);
             if (e.target instanceof HTMLInputElement) {
                 // JS respects composite keydowns while input elements are focused, and
                 // doesnt send the associated keyup events with the same key name
-                data.current.pressedKeys.delete(key);
+                data.current.pressedKeys.delete(e.code);
             }
             if (!hotkeyName)
                 return;
@@ -57,7 +71,7 @@ export const hotkeysCoreFeature = {
             var _a;
             var _b;
             (_a = (_b = data.current).pressedKeys) !== null && _a !== void 0 ? _a : (_b.pressedKeys = new Set());
-            data.current.pressedKeys.delete(e.key.toLowerCase());
+            data.current.pressedKeys.delete(e.code);
         };
         const reset = () => {
             data.current.pressedKeys = new Set();

package/lib/esm/features/keyboard-drag-and-drop/feature.js

@@ -141,7 +141,7 @@ export const keyboardDragAndDropFeature = {
     },
     hotkeys: {
         startDrag: {
-            hotkey: "Control+Shift+D",
+            hotkey: "Control+Shift+KeyD",
             preventDefault: true,
             isEnabled: (tree) => !tree.getState().dnd,
             handler: (_, tree) => {

package/lib/esm/features/main/types.d.ts

@@ -17,8 +17,6 @@ export type MainFeatureDef<T = any> = {
     treeInstance: {
         /** @internal */
         applySubStateUpdate: <K extends keyof TreeState<any>>(stateName: K, updater: Updater<TreeState<T>[K]>) => void;
-        /** @internal */
-        buildItemInstance: (itemId: string) => ItemInstance<T>;
         setState: SetStateFn<TreeState<T>>;
         getState: () => TreeState<T>;
         setConfig: SetStateFn<TreeConfig<T>>;