@headless-tree/core 0.0.1

package/lib/features/tree/feature.js

@@ -0,0 +1,216 @@
+"use strict";
+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());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.treeFeature = void 0;
+const utils_1 = require("../../utils");
+exports.treeFeature = {
+    key: "tree",
+    dependingFeatures: ["main"],
+    getInitialState: (initialState) => (Object.assign({ expandedItems: [], focusedItem: null }, initialState)),
+    getDefaultConfig: (defaultConfig, tree) => (Object.assign({ setExpandedItems: (0, utils_1.makeStateUpdater)("expandedItems", tree), setFocusedItem: (0, utils_1.makeStateUpdater)("focusedItem", tree) }, defaultConfig)),
+    createTreeInstance: (prev, instance) => (Object.assign(Object.assign({}, prev), { retrieveItemData: () => {
+            throw new Error("No data-loader registered");
+        }, retrieveChildrenIds: () => {
+            throw new Error("No data-loader registered");
+        }, isItemExpanded: (itemId) => instance.getState().expandedItems.includes(itemId), getItemsMeta: () => {
+            const { rootItemId } = instance.getConfig();
+            const { expandedItems } = instance.getState();
+            // console.log("!", instance.getConfig());
+            const flatItems = [];
+            const recursiveAdd = (itemId, parentId, level, setSize, posInSet) => {
+                var _a;
+                flatItems.push({
+                    itemId,
+                    level,
+                    index: flatItems.length,
+                    parentId,
+                    setSize,
+                    posInSet,
+                });
+                if (expandedItems.includes(itemId)) {
+                    const children = (_a = instance.retrieveChildrenIds(itemId)) !== null && _a !== void 0 ? _a : [];
+                    let i = 0;
+                    for (const childId of children) {
+                        recursiveAdd(childId, itemId, level + 1, children.length, i++);
+                    }
+                }
+            };
+            const children = instance.retrieveChildrenIds(rootItemId);
+            let i = 0;
+            for (const itemId of children) {
+                recursiveAdd(itemId, rootItemId, 0, children.length, i++);
+            }
+            return flatItems;
+        }, expandItem: (itemId) => {
+            var _a, _b, _c;
+            if (!instance.getItemInstance(itemId).isFolder()) {
+                return;
+            }
+            if ((_a = instance.getState().loadingItems) === null || _a === void 0 ? void 0 : _a.includes(itemId)) {
+                return;
+            }
+            (_c = (_b = instance
+                .getConfig()).setExpandedItems) === null || _c === void 0 ? void 0 : _c.call(_b, (expandedItems) => [...expandedItems, itemId]);
+            instance.rebuildTree();
+        }, collapseItem: (itemId) => {
+            var _a, _b;
+            if (!instance.getItemInstance(itemId).isFolder()) {
+                return;
+            }
+            (_b = (_a = instance
+                .getConfig()).setExpandedItems) === null || _b === void 0 ? void 0 : _b.call(_a, (expandedItems) => expandedItems.filter((id) => id !== itemId));
+            instance.rebuildTree();
+        }, 
+        // TODO memo
+        getFocusedItem: () => {
+            var _a, _b;
+            return ((_b = instance.getItemInstance((_a = instance.getState().focusedItem) !== null && _a !== void 0 ? _a : "")) !== null && _b !== void 0 ? _b : instance.getItems()[0]);
+        }, focusItem: (itemId) => {
+            var _a, _b;
+            (_b = (_a = instance.getConfig()).setFocusedItem) === null || _b === void 0 ? void 0 : _b.call(_a, itemId);
+        }, focusNextItem: () => {
+            const { index } = instance.getFocusedItem().getItemMeta();
+            const nextIndex = Math.min(index + 1, instance.getItems().length - 1);
+            instance.focusItem(instance.getItems()[nextIndex].getId());
+        }, focusPreviousItem: () => {
+            const { index } = instance.getFocusedItem().getItemMeta();
+            const nextIndex = Math.max(index - 1, 0);
+            instance.focusItem(instance.getItems()[nextIndex].getId());
+        }, updateDomFocus: (scrollIntoView) => {
+            // Required because if the state is managed outside in react, the state only updated during next render
+            setTimeout(() => __awaiter(void 0, void 0, void 0, function* () {
+                var _a, _b;
+                const focusedItem = instance.getFocusedItem();
+                (_b = (_a = instance.getConfig()).scrollToItem) === null || _b === void 0 ? void 0 : _b.call(_a, focusedItem);
+                yield (0, utils_1.poll)(() => focusedItem.getElement() !== null, 20);
+                const focusedElement = focusedItem.getElement();
+                if (!focusedElement)
+                    return;
+                focusedElement.focus();
+                // if (scrollIntoView) {
+                //   focusedElement.scrollIntoView();
+                // }
+            }));
+        }, getContainerProps: () => {
+            var _a;
+            return (Object.assign(Object.assign({}, (_a = prev.getContainerProps) === null || _a === void 0 ? void 0 : _a.call(prev)), { role: "tree", ariaLabel: "", ariaActivedescendant: "" }));
+        } })),
+    createItemInstance: (prev, item, tree) => (Object.assign(Object.assign({}, prev), { isLoading: () => {
+            throw new Error("No data-loader registered");
+        }, getId: () => item.getItemMeta().itemId, getProps: () => {
+            var _a;
+            const itemMeta = item.getItemMeta();
+            return Object.assign(Object.assign({}, (_a = prev.getProps) === null || _a === void 0 ? void 0 : _a.call(prev)), { role: "treeitem", "aria-setsize": itemMeta.setSize, "aria-posinset": itemMeta.posInSet, "aria-selected": false, "aria-label": item.getItemName(), "aria-level": itemMeta.level, tabIndex: item.isFocused() ? 0 : -1, onClick: (e) => {
+                    item.setFocused();
+                    item.primaryAction();
+                    if (e.ctrlKey || e.shiftKey || e.metaKey) {
+                        return;
+                    }
+                    if (!item.isFolder()) {
+                        return;
+                    }
+                    if (item.isExpanded()) {
+                        item.collapse();
+                    }
+                    else {
+                        item.expand();
+                    }
+                } });
+        }, expand: () => tree.expandItem(item.getItemMeta().itemId), collapse: () => tree.collapseItem(item.getItemMeta().itemId), getItemData: () => tree.retrieveItemData(item.getItemMeta().itemId), isExpanded: () => tree.getState().expandedItems.includes(item.getItemMeta().itemId), isFocused: () => tree.getState().focusedItem === item.getItemMeta().itemId ||
+            (tree.getState().focusedItem === null && item.getItemMeta().index === 0), isFolder: () => item.getItemMeta().level === -1 ||
+            tree.getConfig().isItemFolder(item), getItemName: () => {
+            const config = tree.getConfig();
+            return config.getItemName(item);
+        }, setFocused: () => tree.focusItem(item.getItemMeta().itemId), primaryAction: () => { var _a, _b; return (_b = (_a = tree.getConfig()).onPrimaryAction) === null || _b === void 0 ? void 0 : _b.call(_a, item); }, getParent: (0, utils_1.memo)((itemMeta) => {
+            for (let i = itemMeta.index - 1; i >= 0; i--) {
+                const potentialParent = tree.getItems()[i];
+                if (potentialParent.getItemMeta().level < itemMeta.level) {
+                    return potentialParent;
+                }
+            }
+            return tree.getItemInstance(tree.getConfig().rootItemId);
+        }, () => [item.getItemMeta()]), getIndexInParent: () => {
+            var _a, _b;
+            return item.getItemMeta().index -
+                ((_b = (_a = item.getParent()) === null || _a === void 0 ? void 0 : _a.getItemMeta().index) !== null && _b !== void 0 ? _b : 0) -
+                1;
+        }, getChildren: () => tree
+            .retrieveChildrenIds(item.getItemMeta().itemId)
+            .map((id) => tree.getItemInstance(id)), getTree: () => tree, getItemAbove: () => tree.getItems()[item.getItemMeta().index - 1], getItemBelow: () => tree.getItems()[item.getItemMeta().index + 1] })),
+    hotkeys: {
+        focusNextItem: {
+            hotkey: "ArrowDown",
+            canRepeat: true,
+            preventDefault: true,
+            isEnabled: (tree) => { var _a, _b; return !((_b = (_a = tree.isSearchOpen) === null || _a === void 0 ? void 0 : _a.call(tree)) !== null && _b !== void 0 ? _b : false) && !tree.getState().dnd; },
+            handler: (e, tree) => {
+                tree.focusNextItem();
+                tree.updateDomFocus();
+            },
+        },
+        focusPreviousItem: {
+            hotkey: "ArrowUp",
+            canRepeat: true,
+            preventDefault: true,
+            isEnabled: (tree) => { var _a, _b; return !((_b = (_a = tree.isSearchOpen) === null || _a === void 0 ? void 0 : _a.call(tree)) !== null && _b !== void 0 ? _b : false) && !tree.getState().dnd; },
+            handler: (e, tree) => {
+                tree.focusPreviousItem();
+                tree.updateDomFocus();
+            },
+        },
+        expandOrDown: {
+            hotkey: "ArrowRight",
+            canRepeat: true,
+            handler: (e, tree) => {
+                const item = tree.getFocusedItem();
+                if (item.isExpanded() || !item.isFolder()) {
+                    tree.focusNextItem();
+                    tree.updateDomFocus();
+                }
+                else {
+                    item.expand();
+                }
+            },
+        },
+        collapseOrUp: {
+            hotkey: "ArrowLeft",
+            canRepeat: true,
+            handler: (e, tree) => {
+                var _a;
+                const item = tree.getFocusedItem();
+                if ((!item.isExpanded() || !item.isFolder()) &&
+                    item.getItemMeta().level !== 0) {
+                    (_a = item.getParent()) === null || _a === void 0 ? void 0 : _a.setFocused();
+                    tree.updateDomFocus(true);
+                }
+                else {
+                    item.collapse();
+                }
+            },
+        },
+        focusFirstItem: {
+            hotkey: "Home",
+            handler: (e, tree) => {
+                console.log("home", tree.getItems()[0], tree.getItems());
+                tree.focusItem(tree.getItems()[0].getId());
+                tree.updateDomFocus();
+            },
+        },
+        focusLastItem: {
+            hotkey: "End",
+            handler: (e, tree) => {
+                console.log("end");
+                tree.focusItem(tree.getItems()[tree.getItems().length - 1].getId());
+                tree.updateDomFocus();
+            },
+        },
+    },
+};

package/lib/features/tree/types.d.ts

@@ -0,0 +1,57 @@
+import { ItemInstance, SetStateFn, TreeInstance } from "../../types/core";
+export type ItemMeta = {
+    itemId: string;
+    parentId: string;
+    level: number;
+    index: number;
+    setSize: number;
+    posInSet: number;
+};
+export type TreeFeatureDef<T> = {
+    state: {
+        expandedItems: string[];
+        focusedItem: string | null;
+    };
+    config: {
+        isItemFolder: (item: ItemInstance<T>) => boolean;
+        getItemName: (item: ItemInstance<T>) => string;
+        onPrimaryAction?: (item: ItemInstance<T>) => void;
+        scrollToItem?: (item: ItemInstance<T>) => void;
+        setExpandedItems?: SetStateFn<string[]>;
+        setFocusedItem?: SetStateFn<string | null>;
+    };
+    treeInstance: {
+        /** @internal */
+        getItemsMeta: () => ItemMeta[];
+        expandItem: (itemId: string) => void;
+        collapseItem: (itemId: string) => void;
+        isItemExpanded: (itemId: string) => boolean;
+        focusItem: (itemId: string) => void;
+        getFocusedItem: () => ItemInstance<any>;
+        focusNextItem: () => void;
+        focusPreviousItem: () => void;
+        scrollToItem: (item: ItemInstance<any>) => void;
+        updateDomFocus: (scrollIntoView?: boolean) => void;
+        getContainerProps: () => Record<string, any>;
+    };
+    itemInstance: {
+        getId: () => string;
+        getProps: () => Record<string, any>;
+        getItemName: () => string;
+        getItemData: () => T;
+        expand: () => void;
+        collapse: () => void;
+        isExpanded: () => boolean;
+        isFocused: () => boolean;
+        isFolder: () => boolean;
+        setFocused: () => void;
+        getParent: () => ItemInstance<T>;
+        getChildren: () => ItemInstance<T>[];
+        getIndexInParent: () => number;
+        primaryAction: () => void;
+        getTree: () => TreeInstance<T>;
+        getItemAbove: () => ItemInstance<T> | null;
+        getItemBelow: () => ItemInstance<T> | null;
+    };
+    hotkeys: "focusNextItem" | "focusPreviousItem" | "expandOrDown" | "collapseOrUp" | "focusFirstItem" | "focusLastItem";
+};

package/lib/features/tree/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/lib/index.d.ts

@@ -0,0 +1,21 @@
+export * from "./types/core";
+export * from "./core/create-tree";
+export * from "./features/tree/types";
+export * from "./features/main/types";
+export * from "./features/drag-and-drop/types";
+export * from "./features/selection/types";
+export * from "./features/async-data-loader/types";
+export * from "./features/sync-data-loader/types";
+export * from "./features/hotkeys-core/types";
+export * from "./features/search/types";
+export * from "./features/renaming/types";
+export * from "./features/expand-all/types";
+export * from "./features/selection/feature";
+export * from "./features/hotkeys-core/feature";
+export * from "./features/async-data-loader/feature";
+export * from "./features/sync-data-loader/feature";
+export * from "./features/drag-and-drop/feature";
+export * from "./features/search/feature";
+export * from "./features/renaming/feature";
+export * from "./features/expand-all/feature";
+export * from "./data-adapters/nested-data-adapter";

package/lib/index.js

@@ -0,0 +1,37 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = 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 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./types/core"), exports);
+__exportStar(require("./core/create-tree"), exports);
+__exportStar(require("./features/tree/types"), exports);
+__exportStar(require("./features/main/types"), exports);
+__exportStar(require("./features/drag-and-drop/types"), exports);
+__exportStar(require("./features/selection/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);
+__exportStar(require("./features/search/types"), exports);
+__exportStar(require("./features/renaming/types"), exports);
+__exportStar(require("./features/expand-all/types"), exports);
+__exportStar(require("./features/selection/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);
+__exportStar(require("./features/drag-and-drop/feature"), exports);
+__exportStar(require("./features/search/feature"), exports);
+__exportStar(require("./features/renaming/feature"), exports);
+__exportStar(require("./features/expand-all/feature"), exports);
+__exportStar(require("./data-adapters/nested-data-adapter"), exports);

package/lib/mddocs-entry.d.ts

@@ -0,0 +1,21 @@
+import { MainFeatureDef } from "./features/main/types";
+import { DragAndDropFeatureDef } from "./features/drag-and-drop/types";
+export * from ".";
+/** @interface */
+export type MainFeatureConfig = MainFeatureDef["config"];
+/** @interface */
+export type MainFeatureState = MainFeatureDef["state"];
+/** @interface */
+export type MainFeatureTreeInstance = MainFeatureDef["treeInstance"];
+/** @interface */
+export type MainFeatureItemInstance = MainFeatureDef["itemInstance"];
+export type MainFeatureHotkeys = MainFeatureDef["hotkeys"];
+/** @interface */
+export type DragAndDropFeatureConfig<T> = DragAndDropFeatureDef<T>["config"];
+/** @interface */
+export type DragAndDropFeatureState<T> = DragAndDropFeatureDef<T>["state"];
+/** @interface */
+export type DragAndDropFeatureTreeInstance<T> = DragAndDropFeatureDef<T>["treeInstance"];
+/** @interface */
+export type DragAndDropFeatureItemInstance<T> = DragAndDropFeatureDef<T>["itemInstance"];
+export type DragAndDropFeatureHotkeys<T> = DragAndDropFeatureDef<T>["hotkeys"];

package/lib/mddocs-entry.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = 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 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("."), exports);

package/lib/types/core.d.ts

@@ -0,0 +1,68 @@
+import { DragAndDropFeatureDef } from "../features/drag-and-drop/types";
+import { MainFeatureDef } from "../features/main/types";
+import { SelectionFeatureDef } from "../features/selection/types";
+import { TreeFeatureDef } from "../features/tree/types";
+import { HotkeyConfig, HotkeysCoreFeatureDef } from "../features/hotkeys-core/types";
+import { SyncDataLoaderFeatureDef } from "../features/sync-data-loader/types";
+import { AsyncDataLoaderFeatureDef } from "../features/async-data-loader/types";
+import { SearchFeatureDef } from "../features/search/types";
+import { RenamingFeatureDef } from "../features/renaming/types";
+import { ExpandAllFeatureDef } from "../features/expand-all/types";
+export type Updater<T> = T | ((old: T) => T);
+export type SetStateFn<T> = (updaterOrValue: Updater<T>) => void;
+export type FeatureDef = {
+    state: object;
+    config: object;
+    treeInstance: object;
+    itemInstance: object;
+    hotkeys: string;
+};
+export type EmptyFeatureDef = {
+    state: {};
+    config: {};
+    treeInstance: {};
+    itemInstance: {};
+    hotkeys: never;
+};
+type UnionToIntersection<T> = (T extends any ? (x: T) => any : never) extends (x: infer R) => any ? R : never;
+export type DefaultFeatures<T> = MainFeatureDef | TreeFeatureDef<T>;
+export type FeatureDefs<T> = MainFeatureDef | TreeFeatureDef<T> | SelectionFeatureDef<T> | DragAndDropFeatureDef<T> | HotkeysCoreFeatureDef<T> | SyncDataLoaderFeatureDef<T> | AsyncDataLoaderFeatureDef<T> | SearchFeatureDef<T> | RenamingFeatureDef<T> | ExpandAllFeatureDef;
+type MergedFeatures<F extends FeatureDef> = {
+    state: UnionToIntersection<F["state"]>;
+    config: UnionToIntersection<F["config"]>;
+    treeInstance: UnionToIntersection<F["treeInstance"]>;
+    itemInstance: UnionToIntersection<F["itemInstance"]>;
+    hotkeys: F["hotkeys"];
+};
+type TreeStateType<T> = MainFeatureDef["state"] & TreeFeatureDef<T>["state"] & SelectionFeatureDef<T>["state"] & DragAndDropFeatureDef<T>["state"] & HotkeysCoreFeatureDef<T>["state"] & SyncDataLoaderFeatureDef<T>["state"] & AsyncDataLoaderFeatureDef<T>["state"] & SearchFeatureDef<T>["state"] & RenamingFeatureDef<T>["state"] & ExpandAllFeatureDef["state"];
+export interface TreeState<T> extends TreeStateType<T> {
+}
+type TreeConfigType<T> = MainFeatureDef["config"] & TreeFeatureDef<T>["config"] & SelectionFeatureDef<T>["config"] & DragAndDropFeatureDef<T>["config"] & HotkeysCoreFeatureDef<T>["config"] & SyncDataLoaderFeatureDef<T>["config"] & AsyncDataLoaderFeatureDef<T>["config"] & SearchFeatureDef<T>["config"] & RenamingFeatureDef<T>["config"] & ExpandAllFeatureDef["config"];
+export interface TreeConfig<T> extends TreeConfigType<T> {
+}
+type TreeInstanceType<T> = MainFeatureDef["treeInstance"] & TreeFeatureDef<T>["treeInstance"] & SelectionFeatureDef<T>["treeInstance"] & DragAndDropFeatureDef<T>["treeInstance"] & HotkeysCoreFeatureDef<T>["treeInstance"] & SyncDataLoaderFeatureDef<T>["treeInstance"] & AsyncDataLoaderFeatureDef<T>["treeInstance"] & SearchFeatureDef<T>["treeInstance"] & RenamingFeatureDef<T>["treeInstance"] & ExpandAllFeatureDef["treeInstance"];
+export interface TreeInstance<T> extends TreeInstanceType<T> {
+}
+type ItemInstanceType<T> = MainFeatureDef["itemInstance"] & TreeFeatureDef<T>["itemInstance"] & SelectionFeatureDef<T>["itemInstance"] & DragAndDropFeatureDef<T>["itemInstance"] & HotkeysCoreFeatureDef<T>["itemInstance"] & SyncDataLoaderFeatureDef<T>["itemInstance"] & AsyncDataLoaderFeatureDef<T>["itemInstance"] & SearchFeatureDef<T>["itemInstance"] & RenamingFeatureDef<T>["itemInstance"] & ExpandAllFeatureDef["itemInstance"];
+export interface ItemInstance<T> extends ItemInstanceType<T> {
+}
+export type HotkeyName<F extends FeatureDef = FeatureDefs<any>> = MergedFeatures<F>["hotkeys"];
+export type HotkeysConfig<T, F extends FeatureDef = FeatureDefs<T>> = Record<HotkeyName<F>, HotkeyConfig<T>>;
+export type CustomHotkeysConfig<T, F extends FeatureDef = FeatureDefs<T>> = Partial<Record<HotkeyName<F> | `custom${string}`, Partial<HotkeyConfig<T>>>>;
+export type FeatureImplementation<T = any, D extends FeatureDef = any, F extends FeatureDef = EmptyFeatureDef> = {
+    key?: string;
+    dependingFeatures?: string[];
+    getInitialState?: (initialState: Partial<MergedFeatures<F>["state"]>, tree: MergedFeatures<F>["treeInstance"]) => Partial<D["state"] & MergedFeatures<F>["state"]>;
+    getDefaultConfig?: (defaultConfig: Partial<MergedFeatures<F>["config"]>, tree: MergedFeatures<F>["treeInstance"]) => Partial<D["config"] & MergedFeatures<F>["config"]>;
+    createTreeInstance?: (prev: MergedFeatures<F>["treeInstance"], instance: MergedFeatures<F>["treeInstance"]) => D["treeInstance"] & MergedFeatures<F>["treeInstance"];
+    createItemInstance?: (prev: MergedFeatures<F>["itemInstance"], item: MergedFeatures<F>["itemInstance"], tree: MergedFeatures<F>["treeInstance"], itemId: string) => D["itemInstance"] & MergedFeatures<F>["itemInstance"];
+    onTreeMount?: (instance: MergedFeatures<F>["treeInstance"], treeElement: HTMLElement) => void;
+    onTreeUnmount?: (instance: MergedFeatures<F>["treeInstance"], treeElement: HTMLElement) => void;
+    onItemMount?: (instance: MergedFeatures<F>["itemInstance"], itemElement: HTMLElement, tree: MergedFeatures<F>["treeInstance"]) => void;
+    onItemUnmount?: (instance: MergedFeatures<F>["itemInstance"], itemElement: HTMLElement, tree: MergedFeatures<F>["treeInstance"]) => void;
+    setState?: (instance: MergedFeatures<F>["treeInstance"]) => void;
+    onConfigChange?: (instance: MergedFeatures<F>["treeInstance"]) => void;
+    onStateOrConfigChange?: (instance: MergedFeatures<F>["treeInstance"]) => void;
+    hotkeys?: HotkeysConfig<T, D>;
+};
+export {};

package/lib/types/core.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/lib/types/deep-merge.d.ts

@@ -0,0 +1,13 @@
+type TAllKeys<T> = T extends any ? keyof T : never;
+type TIndexValue<T, K extends PropertyKey, D = never> = T extends any ? K extends keyof T ? T[K] : D : never;
+type TPartialKeys<T, K extends keyof T> = Omit<T, K> & Partial<Pick<T, K>> extends infer O ? {
+    [P in keyof O]: O[P];
+} : never;
+type TFunction = (...a: any[]) => any;
+type TPrimitives = string | number | boolean | bigint | symbol | Date | TFunction;
+export type TMerged<T> = [T] extends [Array<any>] ? {
+    [K in keyof T]: TMerged<T[K]>;
+} : [T] extends [TPrimitives] ? T : [T] extends [object] ? TPartialKeys<{
+    [K in TAllKeys<T>]: TMerged<TIndexValue<T, K>>;
+}, never> : T;
+export {};

package/lib/types/deep-merge.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/lib/utils.d.ts

@@ -0,0 +1,9 @@
+import { ItemInstance, TreeState, Updater } from "./types/core";
+import { DropTarget } from "./features/drag-and-drop/types";
+export type NoInfer<T> = [T][T extends any ? 0 : never];
+export declare const memo: <D extends readonly any[], R>(fn: (...args_0: D) => R, deps: () => [...D]) => () => R;
+export declare function functionalUpdate<T>(updater: Updater<T>, input: T): T;
+export declare function makeStateUpdater<K extends keyof TreeState<any>>(key: K, instance: unknown): (updater: Updater<TreeState<any>[K]>) => void;
+export declare const scrollIntoView: (element: Element | undefined | null) => void;
+export declare const performItemsMove: <T>(items: ItemInstance<T>[], target: DropTarget<T>, onChangeChildren: (item: ItemInstance<T>, newChildren: ItemInstance<T>[]) => void) => void;
+export declare const poll: (fn: () => boolean, interval?: number, timeout?: number) => Promise<void>;

package/lib/utils.js

@@ -0,0 +1,105 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.poll = exports.performItemsMove = exports.scrollIntoView = exports.makeStateUpdater = exports.functionalUpdate = exports.memo = void 0;
+const memo = (fn, deps) => {
+    let value;
+    let oldDeps = null;
+    return () => {
+        const newDeps = deps();
+        if (!value) {
+            value = fn(...newDeps);
+            oldDeps = newDeps;
+            return value;
+        }
+        const match = oldDeps &&
+            oldDeps.length === newDeps.length &&
+            !oldDeps.some((dep, i) => dep !== newDeps[i]);
+        if (match) {
+            return value;
+        }
+        value = fn(...newDeps);
+        oldDeps = newDeps;
+        return value;
+    };
+};
+exports.memo = memo;
+function functionalUpdate(updater, input) {
+    return typeof updater === "function"
+        ? updater(input)
+        : updater;
+}
+exports.functionalUpdate = functionalUpdate;
+function makeStateUpdater(key, instance) {
+    return (updater) => {
+        instance.setState((old) => {
+            return Object.assign(Object.assign({}, old), { [key]: functionalUpdate(updater, old[key]) });
+        });
+    };
+}
+exports.makeStateUpdater = makeStateUpdater;
+const scrollIntoView = (element) => {
+    if (!element) {
+        return;
+    }
+    if (element.scrollIntoViewIfNeeded) {
+        element.scrollIntoViewIfNeeded();
+    }
+    else {
+        const boundingBox = element.getBoundingClientRect();
+        const isElementInViewport = boundingBox.top >= 0 &&
+            boundingBox.left >= 0 &&
+            boundingBox.bottom <=
+                (window.innerHeight || document.documentElement.clientHeight) &&
+            boundingBox.right <=
+                (window.innerWidth || document.documentElement.clientWidth);
+        if (!isElementInViewport) {
+            element.scrollIntoView();
+        }
+    }
+};
+exports.scrollIntoView = scrollIntoView;
+const performItemsMove = (items, target, onChangeChildren) => {
+    var _a;
+    const numberOfDragItemsBeforeTarget = !target.childIndex
+        ? 0
+        : target.item
+            .getChildren()
+            .slice(0, target.childIndex)
+            .filter((child) => items.some((item) => item.getId() === child.getId()))
+            .length;
+    // TODO bulk sibling changes together
+    for (const item of items) {
+        const siblings = (_a = item.getParent()) === null || _a === void 0 ? void 0 : _a.getChildren();
+        if (siblings) {
+            onChangeChildren(item.getParent(), siblings.filter((sibling) => sibling.getId() !== item.getId()));
+        }
+    }
+    if (target.childIndex === null) {
+        onChangeChildren(target.item, [...target.item.getChildren(), ...items]);
+        items[0].getTree().rebuildTree();
+        return;
+    }
+    const oldChildren = target.item.getChildren();
+    const newChildren = [
+        ...oldChildren.slice(0, target.childIndex - numberOfDragItemsBeforeTarget),
+        ...items,
+        ...oldChildren.slice(target.childIndex - numberOfDragItemsBeforeTarget),
+    ];
+    onChangeChildren(target.item, newChildren);
+    items[0].getTree().rebuildTree();
+};
+exports.performItemsMove = performItemsMove;
+const poll = (fn, interval = 100, timeout = 1000) => new Promise((resolve) => {
+    let clear;
+    const i = setInterval(() => {
+        if (fn()) {
+            resolve();
+            clearInterval(i);
+            clearTimeout(clear);
+        }
+    }, interval);
+    clear = setTimeout(() => {
+        clearInterval(i);
+    }, timeout);
+});
+exports.poll = poll;

package/package.json

@@ -0,0 +1,15 @@
+{
+  "name": "@headless-tree/core",
+  "version": "0.0.1",
+  "main": "lib/index.js",
+  "types": "lib/index.d.ts",
+  "scripts": {
+    "build": "tsc",
+    "start": "tsc -w"
+  },
+  "author": "Lukas Bach <npm@lukasbach.com>",
+  "license": "MIT",
+  "devDependencies": {
+    "typescript": "^5.0.4"
+  }
+}