@oscarpalmer/mora 0.2.0 → 0.4.0

package/dist/computed.cjs

@@ -0,0 +1,56 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const effect = require("./effect.cjs");
+const signal = require("./signal.cjs");
+exports.activeComputed = void 0;
+class Computed {
+  constructor(callback) {
+    __publicField(this, "state");
+    this.state = {
+      dirty: true,
+      computeds: /* @__PURE__ */ new Set(),
+      effect: void 0,
+      effects: /* @__PURE__ */ new Set(),
+      value: void 0
+    };
+    this.state.effect = effect.effect(() => {
+      if (this.state.dirty) {
+        const previousComputed = exports.activeComputed;
+        exports.activeComputed = this;
+        const value = callback();
+        exports.activeComputed = previousComputed;
+        if (!Object.is(this.state.value, value)) {
+          this.state.value = value;
+          for (const comp of this.state.computeds) {
+            comp.state.dirty = true;
+            signal.dirtyEffects.add(comp.state.effect);
+          }
+          for (const effect2 of this.state.effects) {
+            signal.dirtyEffects.add(effect2);
+          }
+        }
+        this.state.dirty = false;
+      }
+    });
+  }
+  get() {
+    if (exports.activeComputed != null && exports.activeComputed !== this) {
+      this.state.computeds.add(exports.activeComputed);
+    }
+    if (effect.activeEffect != null && effect.activeEffect !== this.state.effect) {
+      this.state.effects.add(effect.activeEffect);
+    }
+    if (this.state.dirty) {
+      effect.runEffect(this.state.effect);
+    }
+    return this.state.value;
+  }
+}
+function computed(callback) {
+  return new Computed(callback);
+}
+exports.Computed = Computed;
+exports.computed = computed;

package/dist/computed.js

@@ -0,0 +1,57 @@
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+import { effect, activeEffect, runEffect } from "./effect.js";
+import { dirtyEffects } from "./signal.js";
+let activeComputed;
+class Computed {
+  constructor(callback) {
+    __publicField(this, "state");
+    this.state = {
+      dirty: true,
+      computeds: /* @__PURE__ */ new Set(),
+      effect: void 0,
+      effects: /* @__PURE__ */ new Set(),
+      value: void 0
+    };
+    this.state.effect = effect(() => {
+      if (this.state.dirty) {
+        const previousComputed = activeComputed;
+        activeComputed = this;
+        const value = callback();
+        activeComputed = previousComputed;
+        if (!Object.is(this.state.value, value)) {
+          this.state.value = value;
+          for (const comp of this.state.computeds) {
+            comp.state.dirty = true;
+            dirtyEffects.add(comp.state.effect);
+          }
+          for (const effect2 of this.state.effects) {
+            dirtyEffects.add(effect2);
+          }
+        }
+        this.state.dirty = false;
+      }
+    });
+  }
+  get() {
+    if (activeComputed != null && activeComputed !== this) {
+      this.state.computeds.add(activeComputed);
+    }
+    if (activeEffect != null && activeEffect !== this.state.effect) {
+      this.state.effects.add(activeEffect);
+    }
+    if (this.state.dirty) {
+      runEffect(this.state.effect);
+    }
+    return this.state.value;
+  }
+}
+function computed(callback) {
+  return new Computed(callback);
+}
+export {
+  Computed,
+  activeComputed,
+  computed
+};

package/dist/effect.cjs

@@ -8,17 +8,12 @@ class Effect {
   constructor(callback) {
     __publicField(this, "state");
     this.state = {
-      callback,
-      signals: /* @__PURE__ */ new Set()
+      callback
     };
     runEffect(this);
   }
 }
 function runEffect(effect2) {
-  for (const signal of effect2.state.signals) {
-    signal.state.effects.delete(effect2);
-  }
-  effect2.state.signals.clear();
   const previousEffect = exports.activeEffect;
   exports.activeEffect = effect2;
   try {

package/dist/effect.js

@@ -6,17 +6,12 @@ class Effect {
   constructor(callback) {
     __publicField(this, "state");
     this.state = {
-      callback,
-      signals: /* @__PURE__ */ new Set()
+      callback
     };
     runEffect(this);
   }
 }
 function runEffect(effect2) {
-  for (const signal of effect2.state.signals) {
-    signal.state.effects.delete(effect2);
-  }
-  effect2.state.signals.clear();
   const previousEffect = activeEffect;
   activeEffect = effect2;
   try {

package/dist/index.cjs

@@ -1,6 +1,8 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const computed = require("./computed.cjs");
 const effect = require("./effect.cjs");
 const signal = require("./signal.cjs");
+exports.computed = computed.computed;
 exports.effect = effect.effect;
 exports.signal = signal.signal;

package/dist/index.js

@@ -1,6 +1,8 @@
+import { computed } from "./computed.js";
 import { effect } from "./effect.js";
 import { signal } from "./signal.js";
 export {
+  computed,
   effect,
   signal
 };

package/dist/mora.iife.js

@@ -7,16 +7,11 @@ var Mora = (function (exports) {
         constructor(callback) {
             this.state = {
                 callback,
-                signals: new Set(),
             };
             runEffect(this);
         }
     }
     function runEffect(effect) {
-        for (const signal of effect.state.signals) {
-            signal.state.effects.delete(effect);
-        }
-        effect.state.signals.clear();
         const previousEffect = activeEffect;
         activeEffect = effect;
         try {
@@ -31,19 +26,21 @@ var Mora = (function (exports) {
     }
 
     const dirtyEffects = new Set();
-    let batchDepth = 0;
     class Signal {
         state;
         constructor(value) {
             this.state = {
                 value,
+                computeds: new Set(),
                 effects: new Set(),
             };
         }
         get() {
+            if (activeComputed != null) {
+                this.state.computeds.add(activeComputed);
+            }
             if (activeEffect != null) {
                 this.state.effects.add(activeEffect);
-                activeEffect.state.signals.add(this);
             }
             return this.state.value;
         }
@@ -52,29 +49,18 @@ var Mora = (function (exports) {
                 return;
             }
             this.state.value = value;
-            const isOutermostBatch = batchDepth === 0;
-            batchDepth += 1;
-            try {
-                for (const effect of this.state.effects) {
-                    dirtyEffects.add(effect);
-                }
-                if (isOutermostBatch) {
-                    queueMicrotask(() => {
-                        try {
-                            for (const effect of dirtyEffects) {
-                                runEffect(effect);
-                            }
-                        }
-                        finally {
-                            dirtyEffects.clear();
-                            batchDepth = 0;
-                        }
-                    });
-                }
+            for (const computed of this.state.computeds) {
+                computed.state.dirty = true;
+                dirtyEffects.add(computed.state.effect);
+            }
+            for (const effect of this.state.effects) {
+                dirtyEffects.add(effect);
             }
-            finally {
-                if (isOutermostBatch) {
-                    batchDepth -= 1;
+            while (dirtyEffects.size > 0) {
+                const effects = [...dirtyEffects];
+                dirtyEffects.clear();
+                for (const effect of effects) {
+                    runEffect(effect);
                 }
             }
         }
@@ -86,6 +72,55 @@ var Mora = (function (exports) {
         return new Signal(value);
     }
 
+    let activeComputed;
+    class Computed {
+        state;
+        constructor(callback) {
+            this.state = {
+                dirty: true,
+                computeds: new Set(),
+                effect: undefined,
+                effects: new Set(),
+                value: undefined,
+            };
+            this.state.effect = effect(() => {
+                if (this.state.dirty) {
+                    const previousComputed = activeComputed;
+                    activeComputed = this;
+                    const value = callback();
+                    activeComputed = previousComputed;
+                    if (!Object.is(this.state.value, value)) {
+                        this.state.value = value;
+                        for (const comp of this.state.computeds) {
+                            comp.state.dirty = true;
+                            dirtyEffects.add(comp.state.effect);
+                        }
+                        for (const effect of this.state.effects) {
+                            dirtyEffects.add(effect);
+                        }
+                    }
+                    this.state.dirty = false;
+                }
+            });
+        }
+        get() {
+            if (activeComputed != null && activeComputed !== this) {
+                this.state.computeds.add(activeComputed);
+            }
+            if (activeEffect != null && activeEffect !== this.state.effect) {
+                this.state.effects.add(activeEffect);
+            }
+            if (this.state.dirty) {
+                runEffect(this.state.effect);
+            }
+            return this.state.value;
+        }
+    }
+    function computed(callback) {
+        return new Computed(callback);
+    }
+
+    exports.computed = computed;
     exports.effect = effect;
     exports.signal = signal;
 

package/dist/signal.cjs

@@ -3,21 +3,24 @@ var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const computed = require("./computed.cjs");
 const effect = require("./effect.cjs");
 const dirtyEffects = /* @__PURE__ */ new Set();
-let batchDepth = 0;
 class Signal {
   constructor(value) {
     __publicField(this, "state");
     this.state = {
       value,
+      computeds: /* @__PURE__ */ new Set(),
       effects: /* @__PURE__ */ new Set()
     };
   }
   get() {
+    if (computed.activeComputed != null) {
+      this.state.computeds.add(computed.activeComputed);
+    }
     if (effect.activeEffect != null) {
       this.state.effects.add(effect.activeEffect);
-      effect.activeEffect.state.signals.add(this);
     }
     return this.state.value;
   }
@@ -26,27 +29,18 @@ class Signal {
       return;
     }
     this.state.value = value;
-    const isOutermostBatch = batchDepth === 0;
-    batchDepth += 1;
-    try {
-      for (const effect2 of this.state.effects) {
-        dirtyEffects.add(effect2);
-      }
-      if (isOutermostBatch) {
-        queueMicrotask(() => {
-          try {
-            for (const effect$1 of dirtyEffects) {
-              effect.runEffect(effect$1);
-            }
-          } finally {
-            dirtyEffects.clear();
-            batchDepth = 0;
-          }
-        });
-      }
-    } finally {
-      if (isOutermostBatch) {
-        batchDepth -= 1;
+    for (const computed2 of this.state.computeds) {
+      computed2.state.dirty = true;
+      dirtyEffects.add(computed2.state.effect);
+    }
+    for (const effect2 of this.state.effects) {
+      dirtyEffects.add(effect2);
+    }
+    while (dirtyEffects.size > 0) {
+      const effects = [...dirtyEffects];
+      dirtyEffects.clear();
+      for (const effect$1 of effects) {
+        effect.runEffect(effect$1);
       }
     }
   }
@@ -58,4 +52,5 @@ function signal(value) {
   return new Signal(value);
 }
 exports.Signal = Signal;
+exports.dirtyEffects = dirtyEffects;
 exports.signal = signal;

package/dist/signal.js

@@ -1,21 +1,24 @@
 var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+import { activeComputed } from "./computed.js";
 import { activeEffect, runEffect } from "./effect.js";
 const dirtyEffects = /* @__PURE__ */ new Set();
-let batchDepth = 0;
 class Signal {
   constructor(value) {
     __publicField(this, "state");
     this.state = {
       value,
+      computeds: /* @__PURE__ */ new Set(),
       effects: /* @__PURE__ */ new Set()
     };
   }
   get() {
+    if (activeComputed != null) {
+      this.state.computeds.add(activeComputed);
+    }
     if (activeEffect != null) {
       this.state.effects.add(activeEffect);
-      activeEffect.state.signals.add(this);
     }
     return this.state.value;
   }
@@ -24,27 +27,18 @@ class Signal {
       return;
     }
     this.state.value = value;
-    const isOutermostBatch = batchDepth === 0;
-    batchDepth += 1;
-    try {
-      for (const effect of this.state.effects) {
-        dirtyEffects.add(effect);
-      }
-      if (isOutermostBatch) {
-        queueMicrotask(() => {
-          try {
-            for (const effect of dirtyEffects) {
-              runEffect(effect);
-            }
-          } finally {
-            dirtyEffects.clear();
-            batchDepth = 0;
-          }
-        });
-      }
-    } finally {
-      if (isOutermostBatch) {
-        batchDepth -= 1;
+    for (const computed of this.state.computeds) {
+      computed.state.dirty = true;
+      dirtyEffects.add(computed.state.effect);
+    }
+    for (const effect of this.state.effects) {
+      dirtyEffects.add(effect);
+    }
+    while (dirtyEffects.size > 0) {
+      const effects = [...dirtyEffects];
+      dirtyEffects.clear();
+      for (const effect of effects) {
+        runEffect(effect);
       }
     }
   }
@@ -57,5 +51,6 @@ function signal(value) {
 }
 export {
   Signal,
+  dirtyEffects,
   signal
 };

package/package.json

@@ -60,5 +60,5 @@
 	},
 	"type": "module",
 	"types": "./types/index.d.ts",
-	"version": "0.2.0"
+	"version": "0.4.0"
 }

package/src/computed.ts

@@ -0,0 +1,74 @@
+import {type Effect, activeEffect, effect, runEffect} from './effect';
+import {dirtyEffects} from './signal';
+
+type ComputedState<Value> = {
+	dirty: boolean;
+	computeds: Set<Computed<unknown>>;
+	effect: Effect;
+	effects: Set<Effect>;
+	value: Value;
+};
+
+export let activeComputed: Computed<unknown> | undefined;
+
+export class Computed<Value> {
+	readonly state: ComputedState<Value>;
+
+	constructor(callback: () => Value) {
+		this.state = {
+			dirty: true,
+			computeds: new Set(),
+			effect: undefined as never,
+			effects: new Set(),
+			value: undefined as never,
+		};
+
+		this.state.effect = effect(() => {
+			if (this.state.dirty) {
+				const previousComputed = activeComputed;
+
+				activeComputed = this;
+
+				const value = callback();
+
+				activeComputed = previousComputed;
+
+				if (!Object.is(this.state.value, value)) {
+					this.state.value = value;
+
+					for (const comp of this.state.computeds) {
+						comp.state.dirty = true;
+
+						dirtyEffects.add(comp.state.effect);
+					}
+
+					for (const effect of this.state.effects) {
+						dirtyEffects.add(effect);
+					}
+				}
+
+				this.state.dirty = false;
+			}
+		});
+	}
+
+	get(): Value {
+		if (activeComputed != null && activeComputed !== this) {
+			this.state.computeds.add(activeComputed);
+		}
+
+		if (activeEffect != null && activeEffect !== this.state.effect) {
+			this.state.effects.add(activeEffect);
+		}
+
+		if (this.state.dirty) {
+			runEffect(this.state.effect);
+		}
+
+		return this.state.value;
+	}
+}
+
+export function computed<Value>(callback: () => Value): Computed<Value> {
+	return new Computed(callback);
+}

package/src/effect.ts

@@ -1,9 +1,7 @@
 import type {GenericCallback} from '@oscarpalmer/atoms/models';
-import type {Signal} from './signal';
 
 type EffectState = {
 	callback: GenericCallback;
-	signals: Set<Signal<never>>;
 };
 
 export let activeEffect: Effect | undefined;
@@ -14,7 +12,6 @@ export class Effect {
 	constructor(callback: GenericCallback) {
 		this.state = {
 			callback,
-			signals: new Set(),
 		};
 
 		runEffect(this);
@@ -22,12 +19,6 @@ export class Effect {
 }
 
 export function runEffect(effect: Effect): void {
-	for (const signal of effect.state.signals) {
-		signal.state.effects.delete(effect);
-	}
-
-	effect.state.signals.clear();
-
 	const previousEffect = activeEffect;
 
 	activeEffect = effect;
@@ -42,4 +33,3 @@ export function runEffect(effect: Effect): void {
 export function effect(callback: GenericCallback): Effect {
 	return new Effect(callback);
 }
-

package/src/index.ts

@@ -1,2 +1,3 @@
+export {computed, type Computed} from './computed';
 export {effect, type Effect} from './effect';
 export {signal, type Signal} from './signal';

package/src/signal.ts

@@ -1,13 +1,13 @@
+import {type Computed, activeComputed} from './computed';
 import {type Effect, activeEffect, runEffect} from './effect';
 
 type SignalState<Value> = {
+	computeds: Set<Computed<unknown>>;
 	effects: Set<Effect>;
 	value: Value;
 };
 
-const dirtyEffects = new Set<Effect>();
-
-let batchDepth = 0;
+export const dirtyEffects = new Set<Effect>();
 
 export class Signal<Value> {
 	readonly state: SignalState<Value>;
@@ -15,14 +15,18 @@ export class Signal<Value> {
 	constructor(value: Value) {
 		this.state = {
 			value,
+			computeds: new Set(),
 			effects: new Set(),
 		};
 	}
 
 	get(): Value {
+		if (activeComputed != null) {
+			this.state.computeds.add(activeComputed);
+		}
+
 		if (activeEffect != null) {
 			this.state.effects.add(activeEffect);
-			activeEffect.state.signals.add(this as never);
 		}
 
 		return this.state.value;
@@ -35,31 +39,23 @@ export class Signal<Value> {
 
 		this.state.value = value;
 
-		const isOutermostBatch = batchDepth === 0;
+		for (const computed of this.state.computeds) {
+			computed.state.dirty = true;
 
-		batchDepth += 1;
+			dirtyEffects.add(computed.state.effect);
+		}
 
-		try {
-			for (const effect of this.state.effects) {
-				dirtyEffects.add(effect);
-			}
+		for (const effect of this.state.effects) {
+			dirtyEffects.add(effect);
+		}
 
-			if (isOutermostBatch) {
-				queueMicrotask(() => {
-					try {
-						for (const effect of dirtyEffects) {
-							runEffect(effect);
-						}
-					} finally {
-						dirtyEffects.clear();
-
-						batchDepth = 0;
-					}
-				});
-			}
-		} finally {
-			if (isOutermostBatch) {
-				batchDepth -= 1;
+		while (dirtyEffects.size > 0) {
+			const effects = [...dirtyEffects];
+
+			dirtyEffects.clear();
+
+			for (const effect of effects) {
+				runEffect(effect);
 			}
 		}
 	}

package/types/computed.d.cts

@@ -0,0 +1,26 @@
+// Generated by dts-bundle-generator v9.5.1
+
+export type GenericCallback = (...args: any[]) => any;
+export type EffectState = {
+	callback: GenericCallback;
+};
+declare class Effect {
+	readonly state: EffectState;
+	constructor(callback: GenericCallback);
+}
+export type ComputedState<Value> = {
+	dirty: boolean;
+	computeds: Set<Computed<unknown>>;
+	effect: Effect;
+	effects: Set<Effect>;
+	value: Value;
+};
+export declare let activeComputed: Computed<unknown> | undefined;
+export declare class Computed<Value> {
+	readonly state: ComputedState<Value>;
+	constructor(callback: () => Value);
+	get(): Value;
+}
+export declare function computed<Value>(callback: () => Value): Computed<Value>;
+
+export {};

package/types/computed.d.ts

@@ -0,0 +1,16 @@
+import { type Effect } from './effect';
+type ComputedState<Value> = {
+    dirty: boolean;
+    computeds: Set<Computed<unknown>>;
+    effect: Effect;
+    effects: Set<Effect>;
+    value: Value;
+};
+export declare let activeComputed: Computed<unknown> | undefined;
+export declare class Computed<Value> {
+    readonly state: ComputedState<Value>;
+    constructor(callback: () => Value);
+    get(): Value;
+}
+export declare function computed<Value>(callback: () => Value): Computed<Value>;
+export {};

package/types/effect.d.cts

@@ -3,7 +3,6 @@
 export type GenericCallback = (...args: any[]) => any;
 export type EffectState = {
 	callback: GenericCallback;
-	signals: Set<Signal<never>>;
 };
 export declare let activeEffect: Effect | undefined;
 export declare class Effect {
@@ -12,16 +11,5 @@ export declare class Effect {
 }
 export declare function runEffect(effect: Effect): void;
 export declare function effect(callback: GenericCallback): Effect;
-export type SignalState<Value> = {
-	effects: Set<Effect>;
-	value: Value;
-};
-declare class Signal<Value> {
-	readonly state: SignalState<Value>;
-	constructor(value: Value);
-	get(): Value;
-	set(value: Value): void;
-	update(callback: (value: Value) => Value): void;
-}
 
 export {};

package/types/effect.d.ts

@@ -1,8 +1,6 @@
 import type { GenericCallback } from '@oscarpalmer/atoms/models';
-import type { Signal } from './signal';
 type EffectState = {
     callback: GenericCallback;
-    signals: Set<Signal<never>>;
 };
 export declare let activeEffect: Effect | undefined;
 export declare class Effect {

package/types/index.d.cts

@@ -3,14 +3,27 @@
 export type GenericCallback = (...args: any[]) => any;
 export type EffectState = {
 	callback: GenericCallback;
-	signals: Set<Signal<never>>;
 };
 export declare class Effect {
 	readonly state: EffectState;
 	constructor(callback: GenericCallback);
 }
 export declare function effect(callback: GenericCallback): Effect;
+export type ComputedState<Value> = {
+	dirty: boolean;
+	computeds: Set<Computed<unknown>>;
+	effect: Effect;
+	effects: Set<Effect>;
+	value: Value;
+};
+export declare class Computed<Value> {
+	readonly state: ComputedState<Value>;
+	constructor(callback: () => Value);
+	get(): Value;
+}
+export declare function computed<Value>(callback: () => Value): Computed<Value>;
 export type SignalState<Value> = {
+	computeds: Set<Computed<unknown>>;
 	effects: Set<Effect>;
 	value: Value;
 };

package/types/index.d.ts

@@ -1,2 +1,3 @@
+export { computed, type Computed } from './computed';
 export { effect, type Effect } from './effect';
 export { signal, type Signal } from './signal';

package/types/signal.d.cts

@@ -3,16 +3,29 @@
 export type GenericCallback = (...args: any[]) => any;
 export type EffectState = {
 	callback: GenericCallback;
-	signals: Set<Signal<never>>;
 };
 declare class Effect {
 	readonly state: EffectState;
 	constructor(callback: GenericCallback);
 }
+export type ComputedState<Value> = {
+	dirty: boolean;
+	computeds: Set<Computed<unknown>>;
+	effect: Effect;
+	effects: Set<Effect>;
+	value: Value;
+};
+declare class Computed<Value> {
+	readonly state: ComputedState<Value>;
+	constructor(callback: () => Value);
+	get(): Value;
+}
 export type SignalState<Value> = {
+	computeds: Set<Computed<unknown>>;
 	effects: Set<Effect>;
 	value: Value;
 };
+export declare const dirtyEffects: Set<Effect>;
 export declare class Signal<Value> {
 	readonly state: SignalState<Value>;
 	constructor(value: Value);

package/types/signal.d.ts

@@ -1,8 +1,11 @@
+import { type Computed } from './computed';
 import { type Effect } from './effect';
 type SignalState<Value> = {
+    computeds: Set<Computed<unknown>>;
     effects: Set<Effect>;
     value: Value;
 };
+export declare const dirtyEffects: Set<Effect>;
 export declare class Signal<Value> {
     readonly state: SignalState<Value>;
     constructor(value: Value);