@lukekaalim/act-backstage 1.2.1 → 2.0.0

package/CHANGELOG.md

@@ -1,5 +1,28 @@
 # @lukekaalim/act-backstage
 
+## 2.0.0
+
+### Major Changes
+
+- Scheduling refactor
+
+### Patch Changes
+
+- Updated dependencies
+  - @lukekaalim/act-recon@2.0.0
+
+## 1.3.0
+
+### Minor Changes
+
+- Added support for keys/reordering elements without unmounting them
+
+### Patch Changes
+
+- Updated dependencies
+  - @lukekaalim/act-recon@1.2.0
+  - @lukekaalim/act@3.2.0
+
 ## 1.2.1
 
 ### Patch Changes

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "@lukekaalim/act-backstage",
-  "version": "1.2.1",
+  "version": "2.0.0",
   "main": "mod.ts",
   "dependencies": {
-    "@lukekaalim/act": "^3.1.0",
-    "@lukekaalim/act-recon": "^1.1.1"
+    "@lukekaalim/act": "^3.2.0",
+    "@lukekaalim/act-recon": "^2.0.0"
   }
 }

package/render.ts

@@ -1,52 +1,29 @@
-import { CommitTree, createReconciler } from "@lukekaalim/act-recon";
+import { CommitTree, createReconciler, Scheduler, WorkThread } from "@lukekaalim/act-recon";
 import { RenderSpace } from "./space";
 import * as act from '@lukekaalim/act';
 
-export type ScheduleRequestFunc<ID> = (callback: () => void) => ID;
-export type ScheduleCancelFunc<ID> = (id: ID) => void;
-
-export type Scheduler<ID> = {
-  duration: number,
-
-  request: ScheduleRequestFunc<ID>,
-  cancel: ScheduleCancelFunc<ID>,
-}
-
 export type RenderFunction<T> = (node: act.Node, root: T) => { stop: () => void }
 
-export const createRenderFunction = <S, T>(
-  scheduler: Scheduler<S>,
+export const createRenderFunction = <T>(
+  scheduler: Scheduler,
   createSpace: (tree: CommitTree, root: T) => RenderSpace
 ): RenderFunction<T> => {
+
   const render: RenderFunction<T> = (node: act.Node, root: T) => {
-    const reconciler = createReconciler(deltas => {
-      space.create(deltas).configure();
-    }, () => {
-      scheduler.cancel(id);
-      id = scheduler.request(work)
-    });
+    const onThreadComplete = (thread: WorkThread) => {
+      space.create(thread.deltas).configure();
+    };
 
-    const space = createSpace(reconciler.tree, root);
-    
-    const work = () => {
-      const start = performance.now();
-      const end = start + scheduler.duration;
-      const done = reconciler.threads.work(() => {
-        const now = performance.now();
-        return now >= end;
-      })
-      if (done) {
-        scheduler.cancel(id)
-      }
-    }
+    const reconciler = createReconciler(scheduler);
+    const threadCompleteSub = reconciler.on('on-thread-complete', onThreadComplete);
 
-    let id = scheduler.request(work);
+    const space = createSpace(reconciler.tree, root);
     
-    reconciler.threads.mount(node);
+    reconciler.mount(node);
 
     return {
       stop() {
-        scheduler.cancel(id);
+        threadCompleteSub.cancel();
       },
     }
   };

package/space.ts

@@ -41,6 +41,18 @@ export type NodeRef<T> = {
   node: T,
 }
 
+/**
+ * A "simple" render space is just a conventional
+ * render space where we keep track of each commit
+ * in a map - and take a "SimpleRenderSpaceArgs"
+ * args object that tells us how we make, link,
+ * sort, and update our nodes.
+ * 
+ * @param tree 
+ * @param args 
+ * @param nodeByCommit 
+ * @returns 
+ */
 export const createSimpleRenderSpace = <T, R extends string | Symbol>(
   tree: recon.CommitTree,
   args: SimpleRenderSpaceArgs<T, R>,
@@ -79,7 +91,7 @@ export const createSimpleRenderSpace = <T, R extends string | Symbol>(
       if (node)
         return { id, node }
     }
-    // this element has no parents - it is probably a "root" commit
+    // this element has no "node" parents - it is probably a "root" commit
     return null;
   }
   const findRootId = (ref: recon.CommitRef) => {
@@ -121,7 +133,6 @@ export const createSimpleRenderSpace = <T, R extends string | Symbol>(
             commitByNode.set(node, delta.ref.id)
           }
         }
-
       }
 
       return {
@@ -146,6 +157,13 @@ export const createSimpleRenderSpace = <T, R extends string | Symbol>(
               if (!node)
                 continue;
               args.update(node, delta.next.element, delta.prev.element);
+              if (delta.moved) {
+                const parent = findParent(delta.ref);
+                const parentNode = parent && parent.node;
+                if (parentNode) {
+                  needsReorder.add(parent.id)
+                }
+              }
             }
             for (const delta of deltas.created) {
               const node = nodeByCommit.get(delta.ref.id);