@adbl/cells 0.0.9 → 0.0.11

package/library/classes.js

@@ -166,7 +166,7 @@ export class Cell {
   #effects = [];
 
   /**
-   * @type {Array<[WeakRef<DerivedCell<any>>, () => any]>}
+   * @type {Array<WeakRef<DerivedCell<any>>>}
    */
   #derivedCells = [];
 
@@ -176,7 +176,7 @@ export class Cell {
    */
   get derivedCells() {
     // @ts-ignore
-    return this.#derivedCells.map((cell) => cell[0].deref()).filter(Boolean);
+    return this.#derivedCells.map((cell) => cell.deref()).filter(Boolean);
   }
 
   /**
@@ -210,7 +210,7 @@ export class Cell {
    */
   toString() {
     // @ts-ignore
-    return this.wvalue.toString();
+    return String(this.wvalue);
   }
 
   /**
@@ -222,14 +222,11 @@ export class Cell {
 
     if (currentlyComputedValue !== undefined) {
       const isAlreadySubscribed = this.#derivedCells.some(
-        (ref) => ref[0].deref() === currentlyComputedValue[0]
+        (ref) => ref.deref() === currentlyComputedValue
       );
       if (isAlreadySubscribed) return this.wvalue;
 
-      this.#derivedCells.push([
-        new WeakRef(currentlyComputedValue[0]),
-        currentlyComputedValue[1],
-      ]);
+      this.#derivedCells.push(new WeakRef(currentlyComputedValue));
     }
 
     return this.wvalue;
@@ -401,11 +398,11 @@ export class Cell {
           effect(this.wvalue);
         }
 
-        const deref = dependent[0].deref();
+        const deref = dependent.deref();
         if (deref === undefined) continue;
 
         const computedCell = deref;
-        const computedFn = dependent[1];
+        const computedFn = deref.computedFn;
 
         if (root.batchNestingLevel > 0) {
           root.batchedEffects.set(
@@ -422,9 +419,7 @@ export class Cell {
       }
     }
     // Periodically drop dead references.
-    this.#derivedCells = this.#derivedCells.filter(
-      (ref) => ref[0].deref() !== undefined
-    );
+    this.#derivedCells = this.#derivedCells.filter((ref) => ref.deref());
 
     // global effects
     for (const [options, effect] of root.globalPostEffects) {
@@ -555,12 +550,14 @@ export class Cell {
   static derived = (callback) => new DerivedCell(callback);
 
   /**
+   * @template X
    * Batches all the effects created to run only once.
-   * @param {() => void} callback - The function to be executed in a batched manner.
+   * @param {() => X} callback - The function to be executed in a batched manner.
+   * @returns {X} The return value of the callback.
    */
   static batch = (callback) => {
     root.batchNestingLevel++;
-    callback();
+    const value = callback();
     root.batchNestingLevel--;
     if (root.batchNestingLevel === 0) {
       for (const [effect, args] of root.batchedEffects) {
@@ -568,6 +565,7 @@ export class Cell {
       }
       root.batchedEffects = new Map();
     }
+    return value;
   };
 
   /**
@@ -650,19 +648,22 @@ export class Cell {
       pending.value = true;
       error.value = null;
       data.value = null;
-      try {
-        initialInput = input;
-        const result = await getter(/** @type {X} */ (input));
-        data.value = result;
-      } catch (e) {
-        if (e instanceof Error) {
-          error.value = e;
-        } else {
-          throw e;
+
+      await Cell.batch(async () => {
+        try {
+          initialInput = input;
+          const result = await getter(/** @type {X} */ (input));
+          data.value = result;
+        } catch (e) {
+          if (e instanceof Error) {
+            error.value = e;
+          } else {
+            throw e;
+          }
+        } finally {
+          pending.value = false;
         }
-      } finally {
-        pending.value = false;
-      }
+      });
     }
 
     /**
@@ -673,6 +674,7 @@ export class Cell {
       if (changeLoadingState) {
         pending.value = true;
       }
+
       try {
         const result = await getter(
           /** @type {X} */ (newInput ?? initialInput)
@@ -715,14 +717,18 @@ export class DerivedCell extends Cell {
     super();
     // Ensures that the cell is derived every time the computing function is called.
     const derivationWrapper = () => {
-      activeComputedValues.push([this, derivationWrapper]);
+      activeComputedValues.push(this);
       const value = computedFn();
       activeComputedValues.pop();
       return value;
     };
     this.setValue(derivationWrapper());
+    this.computedFn = computedFn;
   }
 
+  /** @type {() => T} */
+  computedFn;
+
   /**
    * @readonly
    */
@@ -822,6 +828,8 @@ export class SourceCell extends Cell {
     this.setValue(this.#proxy(value));
     if (typeof value === 'object' && value !== null) {
       this.#originalObject = value;
+    } else {
+      this.#originalObject = undefined;
     }
     this.update();
   }

package/library/root.js

@@ -39,6 +39,6 @@ export const root = {
 /**
  * A value representing the computed values that are currently being calculated.
  * It is an array so it can keep track of nested computed values.
- * @type {[DerivedCell, () => any][]}
+ * @type {DerivedCell[]}
  */
 export const activeComputedValues = [];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adbl/cells",
-  "version": "0.0.9",
+  "version": "0.0.11",
   "description": "A simple implementation of reactive updates for JavaScript",
   "main": "index.js",
   "private": false,

package/types/library/classes.d.ts

@@ -90,10 +90,12 @@ export class Cell<T extends unknown> {
      */
     static derived: <T_2>(callback: () => T_2) => DerivedCell<T_2>;
     /**
+     * @template X
      * Batches all the effects created to run only once.
-     * @param {() => void} callback - The function to be executed in a batched manner.
+     * @param {() => X} callback - The function to be executed in a batched manner.
+     * @returns {X} The return value of the callback.
      */
-    static batch: (callback: () => void) => void;
+    static batch: <X>(callback: () => X) => X;
     /**
      * Checks if the provided value is an instance of the Cell class.
      * @template [T=any]
@@ -140,7 +142,7 @@ export class Cell<T extends unknown> {
      *
      * run('input');
      */
-    static async<X, Y>(getter: (input: X) => Promise<Y>): AsyncRequestAtoms<X, Y>;
+    static async<X_1, Y>(getter: (input: X_1) => Promise<Y>): AsyncRequestAtoms<X_1, Y>;
     /**
      * @readonly
      * @returns {Array<DerivedCell<any>>}
@@ -224,6 +226,8 @@ export class DerivedCell<T extends unknown> extends Cell<T> {
      * @param {() => T} computedFn - A function that generates the value of the computed.
      */
     constructor(computedFn: () => T);
+    /** @type {() => T} */
+    computedFn: () => T;
     /**
      * @readonly
      */

package/types/library/root.d.ts

@@ -7,9 +7,9 @@ export namespace root {
 /**
  * A value representing the computed values that are currently being calculated.
  * It is an array so it can keep track of nested computed values.
- * @type {[DerivedCell, () => any][]}
+ * @type {DerivedCell[]}
  */
-export const activeComputedValues: [import("./classes.js").DerivedCell<any>, () => any][];
+export const activeComputedValues: import("./classes.js").DerivedCell<any>[];
 export type Watchable = import('./classes.js').Cell<any>;
 export type DerivedCell = import('./classes.js').DerivedCell<any>;
 export type GlobalEffectOptions = {