@headless-tree/core 0.0.1 → 0.0.2

package/lib/esm/features/drag-and-drop/utils.js

@@ -0,0 +1,55 @@
+import { DropTargetPosition } from "./types";
+export const getDragCode = ({ item, childIndex }) => `${item.getId()}__${childIndex !== null && childIndex !== void 0 ? childIndex : "none"}`;
+export const getDropOffset = (e, item) => {
+    var _a;
+    const bb = (_a = item.getElement()) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect();
+    return bb ? (e.pageY - bb.top) / bb.height : 0.5;
+};
+export const canDrop = (dataTransfer, target, tree) => {
+    var _a, _b, _c, _d;
+    const draggedItems = (_a = tree.getState().dnd) === null || _a === void 0 ? void 0 : _a.draggedItems;
+    const config = tree.getConfig();
+    if (draggedItems && !((_c = (_b = config.canDrop) === null || _b === void 0 ? void 0 : _b.call(config, draggedItems, target)) !== null && _c !== void 0 ? _c : true)) {
+        return false;
+    }
+    if (!draggedItems &&
+        dataTransfer &&
+        !((_d = config.canDropForeignDragObject) === null || _d === void 0 ? void 0 : _d.call(config, dataTransfer, target))) {
+        return false;
+    }
+    return true;
+};
+const getDropTargetPosition = (offset, topLinePercentage, bottomLinePercentage) => {
+    if (offset < topLinePercentage) {
+        return DropTargetPosition.Top;
+    }
+    if (offset > bottomLinePercentage) {
+        return DropTargetPosition.Bottom;
+    }
+    return DropTargetPosition.Item;
+};
+export const getDropTarget = (e, item, tree) => {
+    var _a, _b;
+    const config = tree.getConfig();
+    const offset = getDropOffset(e, item);
+    const dropOnItemTarget = { item, childIndex: null };
+    const pos = getDropTargetPosition(offset, (_a = config.topLinePercentage) !== null && _a !== void 0 ? _a : 0.3, (_b = config.bottomLinePercentage) !== null && _b !== void 0 ? _b : 0.7);
+    const inbetweenPos = getDropTargetPosition(offset, 0.5, 0.5);
+    if (!config.canDropInbetween) {
+        return dropOnItemTarget;
+    }
+    if (!canDrop(e.dataTransfer, dropOnItemTarget, tree)) {
+        return {
+            item: item.getParent(),
+            childIndex: item.getIndexInParent() +
+                (inbetweenPos === DropTargetPosition.Top ? 0 : 1),
+        };
+    }
+    if (pos === DropTargetPosition.Item) {
+        return dropOnItemTarget;
+    }
+    return {
+        item: item.getParent(),
+        childIndex: item.getIndexInParent() + (pos === DropTargetPosition.Top ? 0 : 1),
+    };
+};

package/lib/esm/features/expand-all/feature.d.ts

@@ -0,0 +1,6 @@
+import { FeatureImplementation } from "../../types/core";
+import { ExpandAllFeatureDef } from "./types";
+import { MainFeatureDef } from "../main/types";
+import { TreeFeatureDef } from "../tree/types";
+import { SyncDataLoaderFeatureDef } from "../sync-data-loader/types";
+export declare const expandAllFeature: FeatureImplementation<any, ExpandAllFeatureDef, MainFeatureDef | TreeFeatureDef<any> | SyncDataLoaderFeatureDef<any> | ExpandAllFeatureDef>;

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

@@ -0,0 +1,36 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { poll } from "../../utils";
+export const expandAllFeature = {
+    key: "expand-all",
+    dependingFeatures: ["main", "tree"],
+    createTreeInstance: (prev, tree) => (Object.assign(Object.assign({}, prev), { expandAll: (cancelToken) => __awaiter(void 0, void 0, void 0, function* () {
+            yield Promise.all(tree.getItems().map((item) => item.expandAll(cancelToken)));
+        }), collapseAll: () => __awaiter(void 0, void 0, void 0, function* () {
+            var _a, _b;
+            (_b = (_a = tree.getConfig()).setExpandedItems) === null || _b === void 0 ? void 0 : _b.call(_a, []);
+        }) })),
+    createItemInstance: (prev, item, tree) => (Object.assign(Object.assign({}, prev), { expandAll: (cancelToken) => __awaiter(void 0, void 0, void 0, function* () {
+            if (cancelToken === null || cancelToken === void 0 ? void 0 : cancelToken.current) {
+                return;
+            }
+            item.expand();
+            yield poll(() => !tree.getState().loadingItems.includes(item.getId()));
+            yield Promise.all(item.getChildren().map((child) => __awaiter(void 0, void 0, void 0, function* () {
+                yield poll(() => !tree.getState().loadingItems.includes(child.getId()));
+                yield (child === null || child === void 0 ? void 0 : child.expandAll(cancelToken));
+            })));
+        }), collapseAll: () => __awaiter(void 0, void 0, void 0, function* () {
+            yield Promise.all(item.getChildren().map((child) => __awaiter(void 0, void 0, void 0, function* () {
+                yield (child === null || child === void 0 ? void 0 : child.collapseAll());
+            })));
+            item.collapse();
+        }) })),
+};

package/lib/esm/features/expand-all/types.d.ts

@@ -0,0 +1,17 @@
+export type ExpandAllFeatureDef = {
+    state: {};
+    config: {};
+    treeInstance: {
+        expandAll: (cancelToken?: {
+            current: boolean;
+        }) => Promise<void>;
+        collapseAll: () => Promise<void>;
+    };
+    itemInstance: {
+        expandAll: (cancelToken?: {
+            current: boolean;
+        }) => Promise<void>;
+        collapseAll: () => Promise<void>;
+    };
+    hotkeys: never;
+};

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

@@ -0,0 +1 @@
+export {};

package/lib/esm/features/hotkeys-core/feature.d.ts

@@ -0,0 +1,4 @@
+import { FeatureImplementation } from "../../types/core";
+import { HotkeysCoreFeatureDef } from "./types";
+import { MainFeatureDef } from "../main/types";
+export declare const hotkeysCoreFeature: FeatureImplementation<any, HotkeysCoreFeatureDef<any>, MainFeatureDef | HotkeysCoreFeatureDef<any>>;

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

@@ -0,0 +1,69 @@
+const specialKeys = {
+    Letter: /^[a-z]$/,
+    LetterOrNumber: /^[a-z0-9]$/,
+};
+const testHotkeyMatch = (pressedKeys, tree, hotkey) => {
+    const supposedKeys = hotkey.hotkey.split("+");
+    const doKeysMatch = supposedKeys.every((key) => key in specialKeys
+        ? [...pressedKeys].some((pressedKey) => specialKeys[key].test(pressedKey))
+        : pressedKeys.has(key));
+    const isEnabled = !hotkey.isEnabled || hotkey.isEnabled(tree);
+    const equalCounts = pressedKeys.size === supposedKeys.length;
+    return doKeysMatch && isEnabled && equalCounts;
+};
+const findHotkeyMatch = (pressedKeys, tree, config1, config2) => {
+    var _a;
+    return (_a = Object.entries(Object.assign(Object.assign({}, config1), config2)).find(([, hotkey]) => testHotkeyMatch(pressedKeys, tree, hotkey))) === null || _a === void 0 ? void 0 : _a[0];
+};
+export const hotkeysCoreFeature = {
+    key: "hotkeys-core",
+    dependingFeatures: ["main", "tree"],
+    onTreeMount: (tree, element) => {
+        const data = tree.getDataRef();
+        const keydown = (e) => {
+            var _a, _b;
+            var _c;
+            (_a = (_c = data.current).pressedKeys) !== null && _a !== void 0 ? _a : (_c.pressedKeys = new Set());
+            const newMatch = !data.current.pressedKeys.has(e.key);
+            data.current.pressedKeys.add(e.key);
+            const hotkeyName = findHotkeyMatch(data.current.pressedKeys, tree, tree.getHotkeyPresets(), tree.getConfig().hotkeys);
+            if (!hotkeyName)
+                return;
+            const hotkeyConfig = Object.assign(Object.assign({}, tree.getHotkeyPresets()[hotkeyName]), (_b = tree.getConfig().hotkeys) === null || _b === void 0 ? void 0 : _b[hotkeyName]);
+            if (!hotkeyConfig)
+                return;
+            if (!hotkeyConfig.allowWhenInputFocused &&
+                e.target instanceof HTMLInputElement)
+                return;
+            if (!hotkeyConfig.canRepeat && !newMatch)
+                return;
+            if (hotkeyConfig.preventDefault)
+                e.preventDefault();
+            hotkeyConfig.handler(e, tree);
+        };
+        const keyup = (e) => {
+            var _a;
+            var _b;
+            (_a = (_b = data.current).pressedKeys) !== null && _a !== void 0 ? _a : (_b.pressedKeys = new Set());
+            data.current.pressedKeys.delete(e.key);
+        };
+        // keyup is registered on document, because some hotkeys shift
+        // the focus away from the tree (i.e. search)
+        // and then we wouldn't get the keyup event anymore
+        element.addEventListener("keydown", keydown);
+        document.addEventListener("keyup", keyup);
+        data.current.keydownHandler = keydown;
+        data.current.keyupHandler = keyup;
+    },
+    onTreeUnmount: (tree, element) => {
+        const data = tree.getDataRef();
+        if (data.current.keyupHandler) {
+            document.removeEventListener("keyup", data.current.keyupHandler);
+            delete data.current.keyupHandler;
+        }
+        if (data.current.keydownHandler) {
+            element.removeEventListener("keydown", data.current.keydownHandler);
+            delete data.current.keydownHandler;
+        }
+    },
+};

package/lib/esm/features/hotkeys-core/types.d.ts

@@ -0,0 +1,25 @@
+import { CustomHotkeysConfig, ItemInstance, TreeInstance } from "../../types/core";
+export interface HotkeyConfig<T> {
+    hotkey: string;
+    canRepeat?: boolean;
+    allowWhenInputFocused?: boolean;
+    isEnabled?: (tree: TreeInstance<T>) => boolean;
+    preventDefault?: boolean;
+    handler: (e: KeyboardEvent, tree: TreeInstance<T>) => void;
+}
+export type HotkeysCoreDataRef = {
+    keydownHandler?: (e: KeyboardEvent) => void;
+    keyupHandler?: (e: KeyboardEvent) => void;
+    pressedKeys: Set<string>;
+};
+export type HotkeysCoreFeatureDef<T> = {
+    state: {};
+    config: {
+        hotkeys?: CustomHotkeysConfig<T>;
+        onTreeHotkey?: (name: string, element: HTMLElement) => void;
+        onItemHotkey?: (name: string, item: ItemInstance<T>, element: HTMLElement) => void;
+    };
+    treeInstance: {};
+    itemInstance: {};
+    hotkeys: never;
+};

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

@@ -0,0 +1 @@
+export {};

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

@@ -0,0 +1,36 @@
+import { FeatureImplementation, HotkeysConfig, ItemInstance, SetStateFn, TreeConfig, TreeState } from "../../types/core";
+import { ItemMeta } from "../tree/types";
+export type MainFeatureDef<T = any> = {
+    state: {};
+    config: {
+        features?: FeatureImplementation<any>[];
+        state?: Partial<TreeState<T>>;
+        setState?: SetStateFn<TreeState<T>>;
+    };
+    treeInstance: {
+        setState: SetStateFn<TreeState<T>>;
+        getState: () => TreeState<T>;
+        setConfig: SetStateFn<TreeConfig<T>>;
+        getConfig: () => TreeConfig<T>;
+        getItemInstance: (itemId: string) => ItemInstance<T>;
+        getItems: () => ItemInstance<T>[];
+        registerElement: (element: HTMLElement | null) => void;
+        getElement: () => HTMLElement | undefined | null;
+        /** @internal */
+        getDataRef: <D>() => {
+            current: D;
+        };
+        getHotkeyPresets: () => HotkeysConfig<T>;
+        rebuildTree: () => void;
+    };
+    itemInstance: {
+        registerElement: (element: HTMLElement | null) => void;
+        getItemMeta: () => ItemMeta;
+        getElement: () => HTMLElement | undefined | null;
+        /** @internal */
+        getDataRef: <D>() => {
+            current: D;
+        };
+    };
+    hotkeys: never;
+};

package/lib/esm/features/main/types.js

@@ -0,0 +1 @@
+export {};

package/lib/esm/features/renaming/feature.d.ts

@@ -0,0 +1,5 @@
+import { FeatureImplementation } from "../../types/core";
+import { RenamingFeatureDef } from "./types";
+import { MainFeatureDef } from "../main/types";
+import { TreeFeatureDef } from "../tree/types";
+export declare const renamingFeature: FeatureImplementation<any, RenamingFeatureDef<any>, MainFeatureDef | TreeFeatureDef<any> | RenamingFeatureDef<any>>;

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

@@ -0,0 +1,62 @@
+import { makeStateUpdater } from "../../utils";
+export const renamingFeature = {
+    key: "renaming",
+    dependingFeatures: ["main", "tree"],
+    getDefaultConfig: (defaultConfig, tree) => (Object.assign({ setRenamingItem: makeStateUpdater("renamingItem", tree), setRenamingValue: makeStateUpdater("renamingValue", tree), canRename: () => true }, defaultConfig)),
+    createTreeInstance: (prev, instance) => (Object.assign(Object.assign({}, prev), { startRenamingItem: (itemId) => {
+            var _a, _b;
+            const config = instance.getConfig();
+            const item = instance.getItemInstance(itemId);
+            if (!item.canRename()) {
+                return;
+            }
+            (_a = config.setRenamingItem) === null || _a === void 0 ? void 0 : _a.call(config, itemId);
+            (_b = config.setRenamingValue) === null || _b === void 0 ? void 0 : _b.call(config, item.getItemName());
+        }, getRenamingItem: () => {
+            const itemId = instance.getState().renamingItem;
+            return itemId ? instance.getItemInstance(itemId) : null;
+        }, getRenamingValue: () => instance.getState().renamingValue || "", abortRenaming: () => {
+            var _a, _b;
+            (_b = (_a = instance.getConfig()).setRenamingItem) === null || _b === void 0 ? void 0 : _b.call(_a, null);
+        }, completeRenaming: () => {
+            var _a, _b, _c;
+            const config = instance.getConfig();
+            const item = instance.getRenamingItem();
+            if (item) {
+                (_a = config.onRename) === null || _a === void 0 ? void 0 : _a.call(config, item, instance.getState().renamingValue || "");
+            }
+            (_c = (_b = instance.getConfig()).setRenamingItem) === null || _c === void 0 ? void 0 : _c.call(_b, null);
+        }, isRenamingItem: () => !!instance.getState().renamingItem })),
+    createItemInstance: (prev, instance, tree) => (Object.assign(Object.assign({}, prev), { getRenameInputProps: () => ({
+            onBlur: () => tree.abortRenaming(),
+            value: tree.getRenamingValue(),
+            onChange: (e) => {
+                var _a, _b;
+                (_b = (_a = tree.getConfig()).setRenamingValue) === null || _b === void 0 ? void 0 : _b.call(_a, e.target.value);
+            },
+        }), canRename: () => { var _a, _b, _c; return (_c = (_b = (_a = tree.getConfig()).canRename) === null || _b === void 0 ? void 0 : _b.call(_a, instance)) !== null && _c !== void 0 ? _c : true; }, isRenaming: () => instance.getId() === tree.getState().renamingItem })),
+    hotkeys: {
+        renameItem: {
+            hotkey: "F2",
+            handler: (e, tree) => {
+                tree.startRenamingItem(tree.getFocusedItem().getId());
+            },
+        },
+        abortRenaming: {
+            hotkey: "Escape",
+            allowWhenInputFocused: true,
+            isEnabled: (tree) => tree.isRenamingItem(),
+            handler: (e, tree) => {
+                tree.abortRenaming();
+            },
+        },
+        completeRenaming: {
+            hotkey: "Enter",
+            allowWhenInputFocused: true,
+            isEnabled: (tree) => tree.isRenamingItem(),
+            handler: (e, tree) => {
+                tree.completeRenaming();
+            },
+        },
+    },
+};

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

@@ -0,0 +1,27 @@
+import { ItemInstance, SetStateFn } from "../../types/core";
+export type RenamingFeatureDef<T> = {
+    state: {
+        renamingItem?: string | null;
+        renamingValue?: string;
+    };
+    config: {
+        setRenamingItem?: SetStateFn<string | null>;
+        setRenamingValue?: SetStateFn<string | undefined>;
+        canRename?: (item: ItemInstance<T>) => boolean;
+        onRename?: (item: ItemInstance<T>, value: string) => void;
+    };
+    treeInstance: {
+        startRenamingItem: (itemId: string) => void;
+        getRenamingItem: () => ItemInstance<T> | null;
+        getRenamingValue: () => string;
+        abortRenaming: () => void;
+        completeRenaming: () => void;
+        isRenamingItem: () => boolean;
+    };
+    itemInstance: {
+        getRenameInputProps: () => any;
+        canRename: () => boolean;
+        isRenaming: () => boolean;
+    };
+    hotkeys: "renameItem" | "abortRenaming" | "completeRenaming";
+};

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

@@ -0,0 +1 @@
+export {};

package/lib/esm/features/search/feature.d.ts

@@ -0,0 +1,5 @@
+import { FeatureImplementation } from "../../types/core";
+import { SearchFeatureDef } from "./types";
+import { MainFeatureDef } from "../main/types";
+import { TreeFeatureDef } from "../tree/types";
+export declare const searchFeature: FeatureImplementation<any, SearchFeatureDef<any>, MainFeatureDef | TreeFeatureDef<any> | SearchFeatureDef<any>>;

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

@@ -0,0 +1,87 @@
+import { makeStateUpdater, memo } from "../../utils";
+export const searchFeature = {
+    key: "search",
+    dependingFeatures: ["main", "tree"],
+    getInitialState: (initialState) => (Object.assign({ search: null }, initialState)),
+    getDefaultConfig: (defaultConfig, tree) => (Object.assign({ setSearch: makeStateUpdater("search", tree), isSearchMatchingItem: (search, item) => search.length > 0 &&
+            item.getItemName().toLowerCase().includes(search.toLowerCase()) }, defaultConfig)),
+    createTreeInstance: (prev, instance) => (Object.assign(Object.assign({}, prev), { setSearch: (search) => {
+            var _a, _b, _c;
+            (_b = (_a = instance.getConfig()).setSearch) === null || _b === void 0 ? void 0 : _b.call(_a, search);
+            (_c = instance
+                .getItems()
+                .find((item) => {
+                var _a, _b;
+                return (_b = (_a = instance
+                    .getConfig()).isSearchMatchingItem) === null || _b === void 0 ? void 0 : _b.call(_a, instance.getSearchValue(), item);
+            })) === null || _c === void 0 ? void 0 : _c.setFocused();
+        }, openSearch: (initialValue = "") => {
+            instance.setSearch(initialValue);
+            setTimeout(() => {
+                var _a;
+                (_a = instance
+                    .getDataRef()
+                    .current.searchInput) === null || _a === void 0 ? void 0 : _a.focus();
+            });
+        }, closeSearch: () => {
+            instance.setSearch(null);
+            instance.updateDomFocus();
+        }, isSearchOpen: () => instance.getState().search !== null, getSearchValue: () => instance.getState().search || "", registerSearchInputElement: (element) => {
+            const dataRef = instance.getDataRef();
+            dataRef.current.searchInput = element;
+            if (element && dataRef.current.keydownHandler) {
+                element.addEventListener("keydown", dataRef.current.keydownHandler);
+            }
+        }, getSearchInputElement: () => { var _a; return (_a = instance.getDataRef().current.searchInput) !== null && _a !== void 0 ? _a : null; }, getSearchInputElementProps: () => ({
+            value: instance.getSearchValue(),
+            onChange: (e) => instance.setSearch(e.target.value),
+            onBlur: () => instance.closeSearch(),
+        }), getSearchMatchingItems: memo((search, items) => items.filter((item) => { var _a, _b; return (_b = (_a = instance.getConfig()).isSearchMatchingItem) === null || _b === void 0 ? void 0 : _b.call(_a, search, item); }), () => [instance.getSearchValue(), instance.getItems()]) })),
+    createItemInstance: (prev, item, tree) => (Object.assign(Object.assign({}, prev), { isMatchingSearch: () => tree.getSearchMatchingItems().some((i) => i.getId() === item.getId()) })),
+    hotkeys: {
+        openSearch: {
+            hotkey: "LetterOrNumber",
+            preventDefault: true,
+            isEnabled: (tree) => !tree.isSearchOpen(),
+            handler: (e, tree) => {
+                e.stopPropagation();
+                tree.openSearch(e.key);
+            },
+        },
+        closeSearch: {
+            // TODO allow multiple, i.e. Enter
+            hotkey: "Escape",
+            allowWhenInputFocused: true,
+            isEnabled: (tree) => tree.isSearchOpen(),
+            handler: (e, tree) => {
+                tree.closeSearch();
+            },
+        },
+        nextSearchItem: {
+            hotkey: "ArrowDown",
+            allowWhenInputFocused: true,
+            isEnabled: (tree) => tree.isSearchOpen(),
+            handler: (e, tree) => {
+                // TODO scroll into view
+                const focusItem = tree
+                    .getSearchMatchingItems()
+                    .find((item) => item.getItemMeta().index >
+                    tree.getFocusedItem().getItemMeta().index);
+                focusItem === null || focusItem === void 0 ? void 0 : focusItem.setFocused();
+            },
+        },
+        previousSearchItem: {
+            hotkey: "ArrowUp",
+            allowWhenInputFocused: true,
+            isEnabled: (tree) => tree.isSearchOpen(),
+            handler: (e, tree) => {
+                // TODO scroll into view
+                const focusItem = [...tree.getSearchMatchingItems()]
+                    .reverse()
+                    .find((item) => item.getItemMeta().index <
+                    tree.getFocusedItem().getItemMeta().index);
+                focusItem === null || focusItem === void 0 ? void 0 : focusItem.setFocused();
+            },
+        },
+    },
+};

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

@@ -0,0 +1,33 @@
+import { ItemInstance, SetStateFn } from "../../types/core";
+import { HotkeysCoreDataRef } from "../hotkeys-core/types";
+export type SearchFeatureDataRef<T = any> = HotkeysCoreDataRef & {
+    matchingItems: ItemInstance<T>[];
+    searchInput: HTMLInputElement | null;
+};
+export type SearchFeatureDef<T> = {
+    state: {
+        search: string | null;
+    };
+    config: {
+        setSearch?: SetStateFn<string | null>;
+        onOpenSearch?: () => void;
+        onCloseSearch?: () => void;
+        onSearchMatchesItems?: (search: string, items: ItemInstance<T>[]) => void;
+        isSearchMatchingItem?: (search: string, item: ItemInstance<T>) => boolean;
+    };
+    treeInstance: {
+        setSearch: (search: string | null) => void;
+        openSearch: (initialValue?: string) => void;
+        closeSearch: () => void;
+        isSearchOpen: () => boolean;
+        getSearchValue: () => string;
+        registerSearchInputElement: (element: HTMLInputElement | null) => void;
+        getSearchInputElement: () => HTMLInputElement | null;
+        getSearchInputElementProps: () => any;
+        getSearchMatchingItems: () => ItemInstance<T>[];
+    };
+    itemInstance: {
+        isMatchingSearch: () => boolean;
+    };
+    hotkeys: "openSearch" | "closeSearch" | "nextSearchItem" | "previousSearchItem";
+};

package/lib/esm/features/search/types.js

@@ -0,0 +1 @@
+export {};

package/lib/esm/features/selection/feature.d.ts

@@ -0,0 +1,5 @@
+import { FeatureImplementation } from "../../types/core";
+import { SelectionFeatureDef } from "./types";
+import { MainFeatureDef } from "../main/types";
+import { TreeFeatureDef } from "../tree/types";
+export declare const selectionFeature: FeatureImplementation<any, SelectionFeatureDef<any>, MainFeatureDef | TreeFeatureDef<any> | SelectionFeatureDef<any>>;

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

@@ -0,0 +1,109 @@
+import { makeStateUpdater } from "../../utils";
+export const selectionFeature = {
+    key: "selection",
+    dependingFeatures: ["main", "tree"],
+    getInitialState: (initialState) => (Object.assign({ selectedItems: [] }, initialState)),
+    getDefaultConfig: (defaultConfig, tree) => (Object.assign({ setSelectedItems: makeStateUpdater("selectedItems", tree) }, defaultConfig)),
+    createTreeInstance: (prev, instance) => (Object.assign(Object.assign({}, prev), { setSelectedItems: (selectedItems) => {
+            var _a, _b;
+            (_b = (_a = instance.getConfig()).setSelectedItems) === null || _b === void 0 ? void 0 : _b.call(_a, selectedItems);
+        }, 
+        // TODO memo
+        getSelectedItems: () => {
+            return instance.getState().selectedItems.map(instance.getItemInstance);
+        } })),
+    createItemInstance: (prev, item, tree) => (Object.assign(Object.assign({}, prev), { select: () => {
+            const { selectedItems } = tree.getState();
+            tree.setSelectedItems(selectedItems.includes(item.getItemMeta().itemId)
+                ? selectedItems
+                : [...selectedItems, item.getItemMeta().itemId]);
+        }, deselect: () => {
+            const { selectedItems } = tree.getState();
+            tree.setSelectedItems(selectedItems.filter((id) => id !== item.getItemMeta().itemId));
+        }, isSelected: () => {
+            const { selectedItems } = tree.getState();
+            return selectedItems.includes(item.getItemMeta().itemId);
+        }, selectUpTo: (ctrl) => {
+            const indexA = item.getItemMeta().index;
+            // TODO dont use focused item as anchor, but last primary-clicked item
+            const indexB = tree.getFocusedItem().getItemMeta().index;
+            const [a, b] = indexA < indexB ? [indexA, indexB] : [indexB, indexA];
+            const newSelectedItems = tree
+                .getItems()
+                .slice(a, b + 1)
+                .map((item) => item.getItemMeta().itemId);
+            if (!ctrl) {
+                tree.setSelectedItems(newSelectedItems);
+                return;
+            }
+            const { selectedItems } = tree.getState();
+            const uniqueSelectedItems = [
+                ...new Set([...selectedItems, ...newSelectedItems]),
+            ];
+            tree.setSelectedItems(uniqueSelectedItems);
+        }, toggleSelect: () => {
+            if (item.isSelected()) {
+                item.deselect();
+            }
+            else {
+                item.select();
+            }
+        }, getProps: () => (Object.assign(Object.assign({}, prev.getProps()), { onClick: (e) => {
+                var _a, _b;
+                if (e.shiftKey) {
+                    item.selectUpTo(e.ctrlKey || e.metaKey);
+                }
+                else if (e.ctrlKey || e.metaKey) {
+                    item.toggleSelect();
+                }
+                else {
+                    tree.setSelectedItems([item.getItemMeta().itemId]);
+                }
+                (_b = (_a = prev.getProps()).onClick) === null || _b === void 0 ? void 0 : _b.call(_a, e);
+            } })) })),
+    hotkeys: {
+        // setSelectedItem: {
+        //   hotkey: "space",
+        //   handler: (e, tree) => {
+        //     tree.setSelectedItems([tree.getFocusedItem().getId()]);
+        //   },
+        // },
+        toggleSelectItem: {
+            hotkey: "ctrl+space",
+            handler: (e, tree) => {
+                tree.getFocusedItem().toggleSelect();
+            },
+        },
+        selectUpwards: {
+            hotkey: "shift+ArrowUp",
+            handler: () => {
+                // TODO
+            },
+        },
+        selectDownwards: {
+            hotkey: "shift+ArrowDown",
+            handler: () => {
+                // TODO
+            },
+        },
+        selectUpwardsCtrl: {
+            hotkey: "shift+ctrl+ArrowUp",
+            handler: () => {
+                // TODO
+            },
+        },
+        selectDownwardsCtrl: {
+            hotkey: "shift+ctrl+ArrowUp",
+            handler: () => {
+                // TODO
+            },
+        },
+        selectAll: {
+            hotkey: "Control+a",
+            preventDefault: true,
+            handler: (e, tree) => {
+                tree.setSelectedItems(tree.getItems().map((item) => item.getId()));
+            },
+        },
+    },
+};

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

@@ -0,0 +1,21 @@
+import { ItemInstance, SetStateFn } from "../../types/core";
+export type SelectionFeatureDef<T> = {
+    state: {
+        selectedItems: string[];
+    };
+    config: {
+        setSelectedItems?: SetStateFn<string[]>;
+    };
+    treeInstance: {
+        setSelectedItems: (selectedItems: string[]) => void;
+        getSelectedItems: () => ItemInstance<T>[];
+    };
+    itemInstance: {
+        select: () => void;
+        deselect: () => void;
+        toggleSelect: () => void;
+        isSelected: () => boolean;
+        selectUpTo: (ctrl: boolean) => void;
+    };
+    hotkeys: "toggleSelectItem" | "selectUpwards" | "selectDownwards" | "selectUpwardsCtrl" | "selectDownwardsCtrl" | "selectAll";
+};

package/lib/esm/features/selection/types.js

@@ -0,0 +1 @@
+export {};

package/lib/esm/features/sync-data-loader/feature.d.ts

@@ -0,0 +1,4 @@
+import { FeatureImplementation } from "../../types/core";
+import { SyncDataLoaderFeatureDef } from "./types";
+import { MainFeatureDef } from "../main/types";
+export declare const syncDataLoaderFeature: FeatureImplementation<any, SyncDataLoaderFeatureDef<any>, MainFeatureDef | SyncDataLoaderFeatureDef<any>>;

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

@@ -0,0 +1,6 @@
+export const syncDataLoaderFeature = {
+    key: "sync-data-loader",
+    dependingFeatures: ["main"],
+    createTreeInstance: (prev, instance) => (Object.assign(Object.assign({}, prev), { retrieveItemData: (itemId) => instance.getConfig().dataLoader.getItem(itemId), retrieveChildrenIds: (itemId) => instance.getConfig().dataLoader.getChildren(itemId) })),
+    createItemInstance: (prev) => (Object.assign(Object.assign({}, prev), { isLoading: () => false })),
+};