@oscarpalmer/mora 0.3.0 → 0.5.0

package/package.json

@@ -6,18 +6,18 @@
 	"description": "Signals and stuff…",
 	"devDependencies": {
 		"@biomejs/biome": "^1.9",
-		"@oscarpalmer/atoms": "^0.82",
+		"@oscarpalmer/atoms": "^0.99",
 		"@rollup/plugin-node-resolve": "^16",
 		"@rollup/plugin-typescript": "^12.1",
-		"@types/node": "^22.13",
-		"@vitest/coverage-istanbul": "^3",
+		"@types/node": "^22.15",
+		"@vitest/coverage-istanbul": "^3.1",
 		"dts-bundle-generator": "^9.5",
 		"glob": "^11",
-		"happy-dom": "^17",
+		"jsdom": "^26.1",
 		"tslib": "^2.8",
-		"typescript": "^5.7",
-		"vite": "^6",
-		"vitest": "^3"
+		"typescript": "^5.8",
+		"vite": "^6.3",
+		"vitest": "^3.1"
 	},
 	"exports": {
 		".": {
@@ -31,16 +31,8 @@
 			}
 		}
 	},
-	"files": [
-		"dist",
-		"src",
-		"types"
-	],
-	"keywords": [
-		"signal",
-		"signals",
-		"reactive"
-	],
+	"files": ["dist", "src", "types"],
+	"keywords": ["signal", "signals", "reactive"],
 	"license": "MIT",
 	"main": "./dist/index.cjs",
 	"module": "./dist/index.js",
@@ -55,10 +47,10 @@
 		"clean": "rm -rf ./dist && rm -rf ./types && rm -f ./tsconfig.tsbuildinfo",
 		"rollup": "npx rollup -c",
 		"test": "npx vitest --coverage",
-		"types": "npx tsc && npx dts-bundle-generator --config ./dts.config.cts",
+		"types": "npx tsc && npx dts-bundle-generator --config ./dts.config.cts --silent",
 		"watch": "npx vite build --watch"
 	},
 	"type": "module",
 	"types": "./types/index.d.ts",
-	"version": "0.3.0"
+	"version": "0.5.0"
 }

package/src/batch.ts

@@ -0,0 +1,35 @@
+import {dirtyEffects, runEffect} from './effect';
+
+export function flushEffects(): void {
+	while (dirtyEffects.size > 0) {
+		const effects = [...dirtyEffects];
+
+		dirtyEffects.clear();
+
+		for (const effect of effects) {
+			runEffect(effect);
+		}
+	}
+}
+
+/**
+ * Start batching effects _(use `stopBatch` to flush and run batched effects)_
+ */
+export function startBatch(): void {
+	batchDepth += 1;
+}
+
+/**
+ * Stop batching effects and flush _(run)_ them
+ */
+export function stopBatch(): void {
+	if (batchDepth > 0) {
+		batchDepth -= 1;
+	}
+
+	if (batchDepth === 0) {
+		flushEffects();
+	}
+}
+
+export let batchDepth = 0;

package/src/computed.ts

@@ -1,36 +1,85 @@
-import {Effect, activeEffect, runEffect} from './effect';
+import {
+	type Effect,
+	activeEffect,
+	dirtyEffects,
+	effect,
+	runEffect,
+} from './effect';
 
-export class Computed<Value> extends Effect {
-	dirty = true;
-	effects = new Set<Effect>();
-	value!: Value;
+type ComputedState<Value> = {
+	computeds: Set<Computed<unknown>>;
+	dirty: boolean;
+	effect: Effect;
+	effects: Set<Effect>;
+	value: Value;
+};
 
-	constructor(callback: () => Value) {
-		super();
+export let activeComputed: Computed<unknown> | undefined;
 
-		this.callback = () => {
-			if (this.dirty) {
-				this.value = callback();
-				this.dirty = false;
-			}
+export class Computed<Value> {
+	readonly state: ComputedState<Value>;
+
+	constructor(callback: () => Value) {
+		this.state = {
+			computeds: new Set(),
+			dirty: true,
+			effect: undefined as never,
+			effects: new Set(),
+			value: undefined as never,
 		};
 
-		runEffect(this);
+		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 the value
+	 */
 	get(): Value {
-		if (activeEffect != null && activeEffect !== this) {
-			this.effects.add(activeEffect);
+		if (activeComputed != null && activeComputed !== this) {
+			this.state.computeds.add(activeComputed);
+		}
+
+		if (activeEffect != null && activeEffect !== this.state.effect) {
+			this.state.effects.add(activeEffect);
 		}
 
-		if (this.dirty) {
-			runEffect(this);
+		if (this.state.dirty) {
+			runEffect(this.state.effect);
 		}
 
-		return this.value;
+		return this.state.value;
 	}
 }
 
+/**
+ * Create a computed value
+ */
 export function computed<Value>(callback: () => Value): Computed<Value> {
 	return new Computed(callback);
 }

package/src/effect.ts

@@ -1,38 +1,40 @@
 import type {GenericCallback} from '@oscarpalmer/atoms/models';
-import type {Signal} from './signal';
 
-export let activeEffect: Effect | undefined;
+type EffectState = {
+	callback: GenericCallback;
+};
 
 export class Effect {
-		callback!: GenericCallback;
-		signals = new Set<Signal<unknown>>();
-	}
+	readonly state: EffectState;
 
-export function runEffect(effect: Effect): void {
-	for (const signal of effect.signals) {
-		signal.state.observers.delete(effect);
-	}
+	constructor(callback: GenericCallback) {
+		this.state = {
+			callback,
+		};
 
-	effect.signals.clear();
+		runEffect(this);
+	}
+}
 
+export function runEffect(effect: Effect): void {
 	const previousEffect = activeEffect;
 
 	activeEffect = effect;
 
 	try {
-		effect.callback();
+		effect.state.callback();
 	} finally {
 		activeEffect = previousEffect;
 	}
 }
 
+/**
+ * Create an effect
+ */
 export function effect(callback: GenericCallback): Effect {
-	const instance = new Effect();
-
-	instance.callback = callback;
-
-	runEffect(instance);
-
-	return instance;
+	return new Effect(callback);
 }
 
+export let activeEffect: Effect | undefined;
+
+export const dirtyEffects = new Set<Effect>();

package/src/index.ts

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

package/src/signal.ts

@@ -1,34 +1,42 @@
-import {Computed} from './computed';
-import {type Effect, activeEffect, runEffect} from './effect';
+import {batchDepth, flushEffects} from './batch';
+import {type Computed, activeComputed} from './computed';
+import {type Effect, activeEffect, dirtyEffects} from './effect';
 
 type SignalState<Value> = {
-	observers: Set<Computed<never> | Effect>;
+	computeds: Set<Computed<unknown>>;
+	effects: Set<Effect>;
 	value: Value;
 };
 
-const dirtyEffects = new Set<Effect>();
-
-let batchDepth = 0;
-
 export class Signal<Value> {
 	readonly state: SignalState<Value>;
 
 	constructor(value: Value) {
 		this.state = {
 			value,
-			observers: new Set(),
+			computeds: new Set(),
+			effects: new Set(),
 		};
 	}
 
+	/**
+	 * Get the value
+	 */
 	get(): Value {
+		if (activeComputed != null) {
+			this.state.computeds.add(activeComputed);
+		}
+
 		if (activeEffect != null) {
-			this.state.observers.add(activeEffect);
-			activeEffect.signals.add(this as never);
+			this.state.effects.add(activeEffect);
 		}
 
 		return this.state.value;
 	}
 
+	/**
+	 * Set the value
+	 */
 	set(value: Value): void {
 		if (Object.is(this.state.value, value)) {
 			return;
@@ -36,45 +44,24 @@ export class Signal<Value> {
 
 		this.state.value = value;
 
-		const isOutermostBatch = batchDepth === 0;
-
-		batchDepth += 1;
+		for (const computed of this.state.computeds) {
+			computed.state.dirty = true;
 
-		try {
-			for (const observer of this.state.observers) {
-				if (observer instanceof Computed) {
-					observer.dirty = true;
-
-					dirtyEffects.add(observer);
-
-					for (const effect of observer.effects) {
-						dirtyEffects.add(effect);
-					}
-				} else {
-					dirtyEffects.add(observer);
-				}
-			}
+			dirtyEffects.add(computed.state.effect);
+		}
 
-			if (isOutermostBatch) {
-				queueMicrotask(() => {
-					try {
-						for (const effect of dirtyEffects) {
-							runEffect(effect);
-						}
-					} finally {
-						dirtyEffects.clear();
+		for (const effect of this.state.effects) {
+			dirtyEffects.add(effect);
+		}
 
-						batchDepth = 0;
-					}
-				});
-			}
-		} finally {
-			if (isOutermostBatch) {
-				batchDepth -= 1;
-			}
+		if (batchDepth === 0) {
+			flushEffects();
 		}
 	}
 
+	/**
+	 * Update the value
+	 */
 	update(callback: (value: Value) => Value): void {
 		this.set(callback(this.state.value));
 	}

package/types/batch.d.cts

@@ -0,0 +1,14 @@
+// Generated by dts-bundle-generator v9.5.1
+
+export declare function flushEffects(): void;
+/**
+ * Start batching effects _(use `stopBatch` to flush and run batched effects)_
+ */
+export declare function startBatch(): void;
+/**
+ * Stop batching effects and flush _(run)_ them
+ */
+export declare function stopBatch(): void;
+export declare let batchDepth: number;
+
+export {};

package/types/batch.d.ts

@@ -0,0 +1,10 @@
+export declare function flushEffects(): void;
+/**
+ * Start batching effects _(use `stopBatch` to flush and run batched effects)_
+ */
+export declare function startBatch(): void;
+/**
+ * Stop batching effects and flush _(run)_ them
+ */
+export declare function stopBatch(): void;
+export declare let batchDepth: number;

package/types/computed.d.cts

@@ -1,28 +1,32 @@
 // Generated by dts-bundle-generator v9.5.1
 
 export type GenericCallback = (...args: any[]) => any;
-declare class Effect {
+export type EffectState = {
 	callback: GenericCallback;
-	signals: Set<Signal<unknown>>;
+};
+declare class Effect {
+	readonly state: EffectState;
+	constructor(callback: GenericCallback);
 }
-export declare class Computed<Value> extends Effect {
+export type ComputedState<Value> = {
+	computeds: Set<Computed<unknown>>;
 	dirty: boolean;
+	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 the value
+	 */
 	get(): Value;
 }
+/**
+ * Create a computed value
+ */
 export declare function computed<Value>(callback: () => Value): Computed<Value>;
-export type SignalState<Value> = {
-	observers: Set<Computed<never> | 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/computed.d.ts

@@ -1,9 +1,22 @@
-import { Effect } from './effect';
-export declare class Computed<Value> extends Effect {
+import { type Effect } from './effect';
+type ComputedState<Value> = {
+    computeds: Set<Computed<unknown>>;
     dirty: boolean;
+    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 the value
+     */
     get(): Value;
 }
+/**
+ * Create a computed value
+ */
 export declare function computed<Value>(callback: () => Value): Computed<Value>;
+export {};

package/types/effect.d.cts

@@ -1,30 +1,19 @@
 // Generated by dts-bundle-generator v9.5.1
 
 export type GenericCallback = (...args: any[]) => any;
-export declare let activeEffect: Effect | undefined;
-export declare class Effect {
+export type EffectState = {
 	callback: GenericCallback;
-	signals: Set<Signal<unknown>>;
+};
+export declare class Effect {
+	readonly state: EffectState;
+	constructor(callback: GenericCallback);
 }
 export declare function runEffect(effect: Effect): void;
+/**
+ * Create an effect
+ */
 export declare function effect(callback: GenericCallback): Effect;
-declare class Computed<Value> extends Effect {
-	dirty: boolean;
-	effects: Set<Effect>;
-	value: Value;
-	constructor(callback: () => Value);
-	get(): Value;
-}
-export type SignalState<Value> = {
-	observers: Set<Computed<never> | 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 declare let activeEffect: Effect | undefined;
+export declare const dirtyEffects: Set<Effect>;
 
 export {};

package/types/effect.d.ts

@@ -1,9 +1,16 @@
 import type { GenericCallback } from '@oscarpalmer/atoms/models';
-import type { Signal } from './signal';
-export declare let activeEffect: Effect | undefined;
-export declare class Effect {
+type EffectState = {
     callback: GenericCallback;
-    signals: Set<Signal<unknown>>;
+};
+export declare class Effect {
+    readonly state: EffectState;
+    constructor(callback: GenericCallback);
 }
 export declare function runEffect(effect: Effect): void;
+/**
+ * Create an effect
+ */
 export declare function effect(callback: GenericCallback): Effect;
+export declare let activeEffect: Effect | undefined;
+export declare const dirtyEffects: Set<Effect>;
+export {};

package/types/index.d.cts

@@ -1,30 +1,65 @@
 // Generated by dts-bundle-generator v9.5.1
 
 export type GenericCallback = (...args: any[]) => any;
-export declare class Effect {
+export type EffectState = {
 	callback: GenericCallback;
-	signals: Set<Signal<unknown>>;
+};
+export declare class Effect {
+	readonly state: EffectState;
+	constructor(callback: GenericCallback);
 }
+/**
+ * Create an effect
+ */
 export declare function effect(callback: GenericCallback): Effect;
-export declare class Computed<Value> extends Effect {
+export type ComputedState<Value> = {
+	computeds: Set<Computed<unknown>>;
 	dirty: boolean;
+	effect: Effect;
 	effects: Set<Effect>;
 	value: Value;
+};
+export declare class Computed<Value> {
+	readonly state: ComputedState<Value>;
 	constructor(callback: () => Value);
+	/**
+	 * Get the value
+	 */
 	get(): Value;
 }
+/**
+ * Create a computed value
+ */
 export declare function computed<Value>(callback: () => Value): Computed<Value>;
 export type SignalState<Value> = {
-	observers: Set<Computed<never> | Effect>;
+	computeds: Set<Computed<unknown>>;
+	effects: Set<Effect>;
 	value: Value;
 };
 export declare class Signal<Value> {
 	readonly state: SignalState<Value>;
 	constructor(value: Value);
+	/**
+	 * Get the value
+	 */
 	get(): Value;
+	/**
+	 * Set the value
+	 */
 	set(value: Value): void;
+	/**
+	 * Update the value
+	 */
 	update(callback: (value: Value) => Value): void;
 }
 export declare function signal<Value>(value: Value): Signal<Value>;
+/**
+ * Start batching effects _(use `stopBatch` to flush and run batched effects)_
+ */
+export declare function startBatch(): void;
+/**
+ * Stop batching effects and flush _(run)_ them
+ */
+export declare function stopBatch(): void;
 
 export {};

package/types/index.d.ts

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

package/types/signal.d.cts

@@ -1,26 +1,47 @@
 // Generated by dts-bundle-generator v9.5.1
 
 export type GenericCallback = (...args: any[]) => any;
-declare class Effect {
+export type EffectState = {
 	callback: GenericCallback;
-	signals: Set<Signal<unknown>>;
+};
+declare class Effect {
+	readonly state: EffectState;
+	constructor(callback: GenericCallback);
 }
-declare class Computed<Value> extends Effect {
+export type ComputedState<Value> = {
+	computeds: Set<Computed<unknown>>;
 	dirty: boolean;
+	effect: Effect;
 	effects: Set<Effect>;
 	value: Value;
+};
+declare class Computed<Value> {
+	readonly state: ComputedState<Value>;
 	constructor(callback: () => Value);
+	/**
+	 * Get the value
+	 */
 	get(): Value;
 }
 export type SignalState<Value> = {
-	observers: Set<Computed<never> | Effect>;
+	computeds: Set<Computed<unknown>>;
+	effects: Set<Effect>;
 	value: Value;
 };
 export declare class Signal<Value> {
 	readonly state: SignalState<Value>;
 	constructor(value: Value);
+	/**
+	 * Get the value
+	 */
 	get(): Value;
+	/**
+	 * Set the value
+	 */
 	set(value: Value): void;
+	/**
+	 * Update the value
+	 */
 	update(callback: (value: Value) => Value): void;
 }
 export declare function signal<Value>(value: Value): Signal<Value>;