@headless-tree/core 0.0.10 → 0.0.12

package/src/core/build-proxified-instance.ts

@@ -0,0 +1,117 @@
+import { FeatureImplementation } from "../types/core";
+import { InstanceBuilder, InstanceTypeMap } from "../features/main/types";
+import { throwError } from "../utilities/errors";
+
+const noop = () => {};
+
+const findPrevInstanceMethod = (
+  features: FeatureImplementation[],
+  instanceType: keyof InstanceTypeMap,
+  methodKey: string,
+  featureSearchIndex: number,
+) => {
+  for (let i = featureSearchIndex; i >= 0; i--) {
+    const feature = features[i];
+    const itemInstanceMethod = (feature[instanceType] as any)?.[methodKey];
+    if (itemInstanceMethod) {
+      return i;
+    }
+  }
+  return null;
+};
+
+const invokeInstanceMethod = (
+  features: FeatureImplementation[],
+  instanceType: keyof InstanceTypeMap,
+  opts: any,
+  methodKey: string,
+  featureIndex: number,
+  args: any[],
+) => {
+  const prevIndex = findPrevInstanceMethod(
+    features,
+    instanceType,
+    methodKey,
+    featureIndex - 1,
+  );
+  const itemInstanceMethod = (features[featureIndex][instanceType] as any)?.[
+    methodKey
+  ]!;
+  return itemInstanceMethod(
+    {
+      ...opts,
+      prev:
+        prevIndex !== null
+          ? (...newArgs: any[]) =>
+              invokeInstanceMethod(
+                features,
+                instanceType,
+                opts,
+                methodKey,
+                prevIndex,
+                newArgs,
+              )
+          : null,
+    },
+    ...args,
+  );
+};
+
+export const buildProxiedInstance: InstanceBuilder = (
+  features,
+  instanceType,
+  buildOpts,
+) => {
+  // demo with prototypes: https://jsfiddle.net/bgenc58r/
+  const opts = {};
+  const item = new Proxy(
+    {},
+    {
+      has(target, key: string | symbol) {
+        if (typeof key === "symbol") {
+          return false;
+        }
+        if (key === "toJSON") {
+          return false;
+        }
+        const hasInstanceMethod = findPrevInstanceMethod(
+          features,
+          instanceType,
+          key,
+          features.length - 1,
+        );
+        return Boolean(hasInstanceMethod);
+      },
+      get(target, key: string | symbol) {
+        if (typeof key === "symbol") {
+          return undefined;
+        }
+        if (key === "toJSON") {
+          return {};
+        }
+        return (...args: any[]) => {
+          const featureIndex = findPrevInstanceMethod(
+            features,
+            instanceType,
+            key,
+            features.length - 1,
+          );
+
+          if (featureIndex === null) {
+            throw throwError(`feature missing for method ${key}`);
+          }
+          return invokeInstanceMethod(
+            features,
+            instanceType,
+            opts,
+            key,
+            featureIndex,
+            args,
+          );
+        };
+      },
+    },
+  );
+  Object.assign(opts, buildOpts(item));
+  return [item as any, noop];
+};

package/src/core/build-static-instance.ts

@@ -0,0 +1,27 @@
+/* eslint-disable no-continue,no-labels,no-extra-label */
+
+import { InstanceBuilder } from "../features/main/types";
+
+export const buildStaticInstance: InstanceBuilder = (
+  features,
+  instanceType,
+  buildOpts,
+) => {
+  const instance: any = {};
+  const finalize = () => {
+    const opts = buildOpts(instance);
+    featureLoop: for (let i = 0; i < features.length; i++) {
+      // Loop goes in forward order, each features overwrite previous ones and wraps those in a prev() fn
+      const definition = features[i][instanceType];
+      if (!definition) continue featureLoop;
+      methodLoop: for (const [key, method] of Object.entries(definition)) {
+        if (!method) continue methodLoop;
+        const prev = instance[key];
+        instance[key] = (...args: any[]) => {
+          return method({ ...opts, prev }, ...args);
+        };
+      }
+    }
+  };
+  return [instance as any, finalize];
+};

package/src/core/core.spec.ts

@@ -0,0 +1,210 @@
+import { describe, expect, it, vi } from "vitest";
+import { TestTree } from "../test-utils/test-tree";
+
+declare module "../types/core" {
+  export interface TreeInstance<T> {
+    customHandler: (param1: number, param2: number) => void;
+  }
+  export interface ItemInstance<T> {
+    customHandler: (param1: number, param2: number) => void;
+  }
+}
+
+const handler1 = vi.fn(({ prev }, ...params) => prev?.(...params));
+const handler2 = vi.fn(({ prev }, ...params) => prev?.(...params));
+
+const factory = TestTree.default({});
+
+describe("core-feature/prop-memoization", () => {
+  factory.forSuits((tree) => {
+    describe("calls prev in correct order", () => {
+      it("tree instance with overwrite marks, order 1", async () => {
+        const testTree = await tree
+          .withFeatures(
+            {
+              key: "feature2",
+              overwrites: ["feature1"],
+              treeInstance: {
+                customHandler: handler1,
+              },
+            },
+            {
+              key: "feature1",
+              treeInstance: {
+                customHandler: () => 123,
+              },
+            },
+            {
+              key: "feature3",
+              overwrites: ["feature2"],
+              treeInstance: {
+                customHandler: handler2,
+              },
+            },
+          )
+          .createTestCaseTree();
+
+        expect(testTree.instance.customHandler(1, 2)).toBe(123);
+        expect(handler2).toHaveBeenCalledBefore(handler1);
+        expect(handler1).toBeCalledWith(expect.anything(), 1, 2);
+        expect(handler2).toBeCalledWith(expect.anything(), 1, 2);
+      });
+
+      it("tree instance with overwrite marks, order 2", async () => {
+        const testTree = await tree
+          .withFeatures(
+            {
+              key: "feature3",
+              overwrites: ["feature2"],
+              treeInstance: {
+                customHandler: handler2,
+              },
+            },
+            {
+              key: "feature2",
+              overwrites: ["feature1"],
+              treeInstance: {
+                customHandler: handler1,
+              },
+            },
+            {
+              key: "feature1",
+              treeInstance: {
+                customHandler: () => 123,
+              },
+            },
+          )
+          .createTestCaseTree();
+
+        expect(testTree.instance.customHandler(1, 2)).toBe(123);
+        expect(handler2).toHaveBeenCalledBefore(handler1);
+        expect(handler1).toBeCalledWith(expect.anything(), 1, 2);
+        expect(handler2).toBeCalledWith(expect.anything(), 1, 2);
+      });
+
+      it("tree instance with implicit order", async () => {
+        const testTree = await tree
+          .withFeatures(
+            {
+              key: "feature1",
+              treeInstance: {
+                customHandler: () => 123,
+              },
+            },
+            {
+              key: "feature2",
+              treeInstance: {
+                customHandler: handler1,
+              },
+            },
+            {
+              key: "feature3",
+              treeInstance: {
+                customHandler: handler2,
+              },
+            },
+          )
+          .createTestCaseTree();
+
+        expect(testTree.instance.customHandler(1, 2)).toBe(123);
+        expect(handler2).toHaveBeenCalledBefore(handler1);
+        expect(handler1).toBeCalledWith(expect.anything(), 1, 2);
+        expect(handler2).toBeCalledWith(expect.anything(), 1, 2);
+      });
+
+      it("item instance with overwrite marks, order 1", async () => {
+        const testTree = await tree
+          .withFeatures(
+            {
+              key: "feature2",
+              overwrites: ["feature1"],
+              itemInstance: {
+                customHandler: handler1,
+              },
+            },
+            {
+              key: "feature1",
+              itemInstance: {
+                customHandler: () => 123,
+              },
+            },
+            {
+              key: "feature3",
+              overwrites: ["feature2"],
+              itemInstance: {
+                customHandler: handler2,
+              },
+            },
+          )
+          .createTestCaseTree();
+
+        expect(testTree.item("x111").customHandler(1, 2)).toBe(123);
+        expect(handler2).toHaveBeenCalledBefore(handler1);
+        expect(handler1).toBeCalledWith(expect.anything(), 1, 2);
+        expect(handler2).toBeCalledWith(expect.anything(), 1, 2);
+      });
+
+      it("item instance with overwrite marks, order 2", async () => {
+        const testTree = await tree
+          .withFeatures(
+            {
+              key: "feature3",
+              overwrites: ["feature2"],
+              itemInstance: {
+                customHandler: handler2,
+              },
+            },
+            {
+              key: "feature2",
+              overwrites: ["feature1"],
+              itemInstance: {
+                customHandler: handler1,
+              },
+            },
+            {
+              key: "feature1",
+              itemInstance: {
+                customHandler: () => 123,
+              },
+            },
+          )
+          .createTestCaseTree();
+
+        expect(testTree.item("x111").customHandler(1, 2)).toBe(123);
+        expect(handler2).toHaveBeenCalledBefore(handler1);
+        expect(handler1).toBeCalledWith(expect.anything(), 1, 2);
+        expect(handler2).toBeCalledWith(expect.anything(), 1, 2);
+      });
+
+      it("item instance with implicit order", async () => {
+        const testTree = await tree
+          .withFeatures(
+            {
+              key: "feature1",
+              itemInstance: {
+                customHandler: () => 123,
+              },
+            },
+            {
+              key: "feature2",
+              itemInstance: {
+                customHandler: handler1,
+              },
+            },
+            {
+              key: "feature3",
+              itemInstance: {
+                customHandler: handler2,
+              },
+            },
+          )
+          .createTestCaseTree();
+
+        expect(testTree.item("x111").customHandler(1, 2)).toBe(123);
+        expect(handler2).toHaveBeenCalledBefore(handler1);
+        expect(handler1).toBeCalledWith(expect.anything(), 1, 2);
+        expect(handler2).toBeCalledWith(expect.anything(), 1, 2);
+      });
+    });
+  });
+});

package/src/core/create-tree.ts

@@ -5,32 +5,12 @@ import {
   TreeConfig,
   TreeInstance,
   TreeState,
+  Updater,
 } from "../types/core";
-import { MainFeatureDef } from "../features/main/types";
 import { treeFeature } from "../features/tree/feature";
 import { ItemMeta } from "../features/tree/types";
-
-const buildItemInstance = (
-  features: FeatureImplementation[],
-  tree: TreeInstance<any>,
-  itemId: string,
-) => {
-  const itemInstance = {} as ItemInstance<any>;
-  for (const feature of features) {
-    Object.assign(
-      // TODO dont run createItemInstance, but assign prototype objects instead?
-      // https://jsfiddle.net/bgenc58r/
-      itemInstance,
-      feature.createItemInstance?.(
-        { ...itemInstance },
-        itemInstance,
-        tree,
-        itemId,
-      ) ?? {},
-    );
-  }
-  return itemInstance;
-};
+import { buildStaticInstance } from "./build-static-instance";
+import { throwError } from "../utilities/errors";
 
 const verifyFeatures = (features: FeatureImplementation[] | undefined) => {
   const loadedFeatures = features?.map((feature) => feature.key);
@@ -39,46 +19,55 @@ const verifyFeatures = (features: FeatureImplementation[] | undefined) => {
       (dep) => !loadedFeatures?.includes(dep),
     );
     if (missingDependency) {
-      throw new Error(`${feature.key} needs ${missingDependency}`);
+      throw throwError(`${feature.key} needs ${missingDependency}`);
     }
   }
 };
 
-const compareFeatures = (
-  feature1: FeatureImplementation,
-  feature2: FeatureImplementation,
-) => {
-  if (feature2.key && feature1.overwrites?.includes(feature2.key)) {
-    return 1;
-  }
-  return -1;
-};
+const compareFeatures =
+  (originalOrder: FeatureImplementation[]) =>
+  (feature1: FeatureImplementation, feature2: FeatureImplementation) => {
+    if (feature2.key && feature1.overwrites?.includes(feature2.key)) {
+      return 1;
+    }
+    if (feature1.key && feature2.overwrites?.includes(feature1.key)) {
+      return -1;
+    }
+    return originalOrder.indexOf(feature1) - originalOrder.indexOf(feature2);
+  };
 
 const sortFeatures = (features: FeatureImplementation[] = []) =>
-  features.sort(compareFeatures);
+  features.sort(compareFeatures(features));
 
 export const createTree = <T>(
   initialConfig: TreeConfig<T>,
 ): TreeInstance<T> => {
-  const treeInstance: TreeInstance<T> = {} as any;
-
+  const buildInstance = initialConfig.instanceBuilder ?? buildStaticInstance;
   const additionalFeatures = [
     treeFeature,
     ...sortFeatures(initialConfig.features),
   ];
   verifyFeatures(additionalFeatures);
+  const features = [...additionalFeatures];
+
+  const [treeInstance, finalizeTree] = buildInstance(
+    features,
+    "treeInstance",
+    (tree) => ({ tree }),
+  );
 
   let state = additionalFeatures.reduce(
     (acc, feature) => feature.getInitialState?.(acc, treeInstance) ?? acc,
     initialConfig.initialState ?? initialConfig.state ?? {},
   ) as TreeState<T>;
   let config = additionalFeatures.reduce(
-    (acc, feature) => feature.getDefaultConfig?.(acc, treeInstance) ?? acc,
+    (acc, feature) =>
+      (feature.getDefaultConfig?.(acc, treeInstance) as TreeConfig<T>) ?? acc,
     initialConfig,
   ) as TreeConfig<T>;
   const stateHandlerNames = additionalFeatures.reduce(
     (acc, feature) => ({ ...acc, ...feature.stateHandlerNames }),
-    {} as Record<string, string>,
+    {} as Record<string, keyof TreeConfig<T>>,
   );
 
   let treeElement: HTMLElement | undefined | null;
@@ -92,16 +81,17 @@ export const createTree = <T>(
 
   const hotkeyPresets = {} as HotkeysConfig<T>;
 
-  const rebuildItemMeta = (main: FeatureImplementation) => {
+  const rebuildItemMeta = () => {
     // TODO can we find a way to only run this for the changed substructure?
     itemInstances = [];
     itemMetaMap = {};
 
-    const rootInstance = buildItemInstance(
-      [main, ...additionalFeatures],
-      treeInstance,
-      config.rootItemId,
+    const [rootInstance, finalizeRootInstance] = buildInstance(
+      features,
+      "itemInstance",
+      (item) => ({ item, tree: treeInstance, itemId: config.rootItemId }),
     );
+    finalizeRootInstance();
     itemInstancesMap[config.rootItemId] = rootInstance;
     itemMetaMap[config.rootItemId] = {
       itemId: config.rootItemId,
@@ -115,11 +105,16 @@ export const createTree = <T>(
     for (const item of treeInstance.getItemsMeta()) {
       itemMetaMap[item.itemId] = item;
       if (!itemInstancesMap[item.itemId]) {
-        const instance = buildItemInstance(
-          [main, ...additionalFeatures],
-          treeInstance,
-          item.itemId,
+        const [instance, finalizeInstance] = buildInstance(
+          features,
+          "itemInstance",
+          (instance) => ({
+            item: instance,
+            tree: treeInstance,
+            itemId: item.itemId,
+          }),
         );
+        finalizeInstance();
         itemInstancesMap[item.itemId] = instance;
         itemInstances.push(instance);
       } else {
@@ -134,40 +129,43 @@ export const createTree = <T>(
     }
   };
 
-  const mainFeature: FeatureImplementation<
-    T,
-    MainFeatureDef<T>,
-    MainFeatureDef<T>
-  > = {
+  const mainFeature: FeatureImplementation<T> = {
     key: "main",
-    createTreeInstance: (prev) => ({
-      ...prev,
+    treeInstance: {
       getState: () => state,
-      setState: (updater) => {
+      setState: ({}, updater) => {
         // Not necessary, since I think the subupdate below keeps the state fresh anyways?
         // state = typeof updater === "function" ? updater(state) : updater;
-        config.setState?.(state);
+        config.setState?.(state); // TODO this cant be right... This doesnt allow external state updates
       },
-      applySubStateUpdate: (stateName, updater) => {
+      applySubStateUpdate: <K extends keyof TreeState<any>>(
+        {},
+        stateName: K,
+        updater: Updater<TreeState<T>[K]>,
+      ) => {
         state[stateName] =
           typeof updater === "function" ? updater(state[stateName]) : updater;
-        config[stateHandlerNames[stateName]]!(state[stateName]);
+        const externalStateSetter = config[
+          stateHandlerNames[stateName]
+        ] as Function;
+        externalStateSetter?.(state[stateName]);
       },
+      // TODO rebuildSubTree: (itemId: string) => void;
       rebuildTree: () => {
-        rebuildItemMeta(mainFeature);
+        rebuildItemMeta();
         config.setState?.(state);
       },
       getConfig: () => config,
-      setConfig: (updater) => {
+      setConfig: (_, updater) => {
         config = typeof updater === "function" ? updater(config) : updater;
 
         if (config.state) {
           state = { ...state, ...config.state };
         }
       },
-      getItemInstance: (itemId) => itemInstancesMap[itemId],
+      getItemInstance: ({}, itemId) => itemInstancesMap[itemId],
       getItems: () => itemInstances,
-      registerElement: (element) => {
+      registerElement: ({}, element) => {
         if (treeElement === element) {
           return;
         }
@@ -186,10 +184,10 @@ export const createTree = <T>(
       getElement: () => treeElement,
       getDataRef: () => treeDataRef,
       getHotkeyPresets: () => hotkeyPresets,
-    }),
-    createItemInstance: (prev, instance, _, itemId) => ({
-      ...prev,
-      registerElement: (element) => {
+    },
+    itemInstance: {
+      // TODO just change to a getRef method that memoizes, maybe as part of getProps
+      registerElement: ({ itemId, item }, element) => {
         if (itemElementsMap[itemId] === element) {
           return;
         }
@@ -197,33 +195,30 @@ export const createTree = <T>(
         const oldElement = itemElementsMap[itemId];
         if (oldElement && !element) {
           eachFeature((feature) =>
-            feature.onItemUnmount?.(instance, oldElement!, treeInstance),
+            feature.onItemUnmount?.(item, oldElement!, treeInstance),
           );
         } else if (!oldElement && element) {
           eachFeature((feature) =>
-            feature.onItemMount?.(instance, element!, treeInstance),
+            feature.onItemMount?.(item, element!, treeInstance),
           );
         }
         itemElementsMap[itemId] = element;
       },
-      getElement: () => itemElementsMap[itemId],
+      getElement: ({ itemId }) => itemElementsMap[itemId],
       // eslint-disable-next-line no-return-assign
-      getDataRef: () => (itemDataRefs[itemId] ??= { current: {} }),
-      getItemMeta: () => itemMetaMap[itemId],
-    }),
+      getDataRef: ({ itemId }) => (itemDataRefs[itemId] ??= { current: {} }),
+      getItemMeta: ({ itemId }) => itemMetaMap[itemId],
+    },
   };
 
-  const features = [mainFeature, ...additionalFeatures];
+  features.unshift(mainFeature);
 
   for (const feature of features) {
-    Object.assign(
-      treeInstance,
-      feature.createTreeInstance?.({ ...treeInstance }, treeInstance) ?? {},
-    );
     Object.assign(hotkeyPresets, feature.hotkeys ?? {});
   }
 
-  rebuildItemMeta(mainFeature);
+  finalizeTree();
+  rebuildItemMeta();
 
   return treeInstance;
 };