@zeix/cause-effect 0.11.0 → 0.12.1

package/README.md

@@ -1,6 +1,6 @@
 # Cause & Effect
 
-Version 0.11.0
+Version 0.12.1
 
 **Cause & Effect** is a lightweight, reactive state management library for JavaScript applications. It uses the concept of signals to create a predictable and efficient data flow in your app.
 
@@ -14,7 +14,7 @@ Version 0.11.0
 - **Performance**: Efficient updates that only recompute what's necessary.
 - **Type Safety**: Full TypeScript support for robust applications.
 - **Flexibility**: Works well with any UI framework or vanilla JavaScript.
-- **Lightweight**: Around 1kB gzipped over the wire.
+- **Lightweight**: Dependency-free, only 1kB gzipped over the wire.
 
 ## Key Features
 
@@ -27,18 +27,18 @@ Version 0.11.0
 ## Quick Example
 
 ```js
-import { state, computed, effect } from '@zeix/cause-effect'
+import { state, effect } from '@zeix/cause-effect'
 
 // Create a state signal
 const count = state(0)
 
 // Create a computed signal
-const doubleCount = computed(() => count.get() * 2)
+const doubleCount = count.map(v => v * 2)
 
 // Create an effect
-effect(() => {
-    console.log(`Count: ${count.get()}, Double: ${doubleCount.get()}`)
-})
+effect((c, d) => {
+    console.log(`Count: ${c}, Double: ${d}`)
+}, count, doubleCount)
 
 // Update the state
 count.set(5) // Logs: "Count: 5, Double: 10"
@@ -66,8 +66,9 @@ import { state, effect } from '@zeix/cause-effect'
 const count = state(42)
 effect(() => console.log(count.get())) // logs '42'
 count.set(24) // logs '24'
-document.querySelector('button.increment')
-    .addEventListener('click', () => count.update(v => ++v))
+document.querySelector('.increment').addEventListener('click', () => {
+	count.update(v => ++v)
+})
 // Click on button logs '25', '26', and so on
 ```
 
@@ -82,8 +83,9 @@ const count = state(42)
 const isOdd = computed(() => count.get() % 2)
 effect(() => console.log(isOdd.get())) // logs 'false'
 count.set(24) // logs nothing because 24 is also an even number
-document.querySelector('button.increment')
-    .addEventListener('click', () => count.update(v => ++v))
+document.querySelector('button.increment').addEventListener('click', () => {
+	count.update(v => ++v)
+})
 // Click on button logs 'true', 'false', and so on
 ```
 
@@ -96,8 +98,9 @@ const count = state(42)
 const isOdd = count.map(v => v % 2)
 effect(() => console.log(isOdd.get())) // logs 'false'
 count.set(24) // logs nothing because 24 is also an even number
-document.querySelector('button.increment')
-    .addEventListener('click', () => count.set(v => ++v))
+document.querySelector('.increment').addEventListener('click', () => {
+	count.update(v => ++v)
+})
 // Click on button logs 'true', 'false', and so on
 ```
 
@@ -105,14 +108,14 @@ document.querySelector('button.increment')
 
 Async computed signals are as straight forward as their sync counterparts. Just create the computed signal with an async function.
 
-**Caution**: You can't use the `.map()` method to create an async computed signal. And async computed signals will return a Symbol `UNSET` until the Promise is resolved.
+**Caution**: Async computed signals will return a Symbol `UNSET` until the Promise is resolved.
 
 ```js
-import { state, computed, effect } from '@zeix/cause-effect'
+import { state, effect } from '@zeix/cause-effect'
 
 const entryId = state(42)
-const entryData = computed(async () => {
-    const response = await fetch(`/api/entry/${entryId.get()}`)
+const entryData = entryId.map(async id => {
+    const response = await fetch(`/api/entry/${id}`)
     if (!response.ok) return new Error(`Failed to fetch data: ${response.statusText}`)
     return response.json()
 })
@@ -154,23 +157,60 @@ effect({
 
 Instead of a single callback function, provide an object with `ok` (required), `err` and `nil` keys (both optional) and Cause & Effect will take care of anything that might go wrong with the listed signals in the rest parameters of `effect()`.
 
+If you want an effect based on a single signal, there's a shorthand too: The `.match()` method on either `State` or `Computed`. You can use it for easy debugging, for example:
+
+```js
+signal.match({
+	ok: v => console.log('Value:', v),
+	nil: () => console.warn('Not ready'),
+	err: e => console.error('Error:', e)
+})
+```
+
 ### Effects and Batching
 
 Effects run synchronously as soon as source signals update. If you need to set multiple signals you can batch them together to ensure dependents are executed only once.
 
 ```js
-import { state, computed, effect, batch } from '@zeix/cause-effect'
-
-const a = state(3)
-const b = state(4)
-const sum = computed(() => a.get() + b.get())
-effect(() => console.log(sum.get())) // logs '7'
-document.querySelector('button.double-all')
-    .addEventListener('click', () =>
-        batch(() => {
-            a.update(v => v * 2)
-            b.update(v => v * 2)
-        }
-    ))
-// Click on button logs '14' only once (instead of first '10' and then '14' without batch)
-```
+import { state, computed, batch } from '@zeix/cause-effect'
+
+// State: define an array of State<number>
+const signals = [state(2), state(3), state(5)]
+
+// Computed: derive a calculation ...
+const sum = computed(
+	(...values) => values.reduce((total, v) => total + v, 0),
+	...signals
+).map(v => { // ... perform validation and handle errors
+	if (!Number.isFinite(v)) throw new Error('Invalid value')
+	return v
+})
+
+// Effect: switch cases for the result
+sum.match({
+	ok: v => console.log('Sum:', v),
+	err: error => console.error('Error:', error)
+})
+
+// Batch: apply changes to all signals in a single transaction
+document.querySelector('.double-all').addEventListener('click', () => {
+	batch(() => {
+		signals.forEach(signal => signal.update(v => v * 2))
+	})
+})
+// Click on button logs '20' only once
+// (instead of first '12', then '15' and then '20' without batch)
+
+// Provoke an error - but no worries: it will be handled fine
+signals[0].set(NaN)
+```
+
+This example showcases several powerful features of Cause & Effect:
+
+1. **Composability and Declarative Computations**: Easily compose multiple signals into a single computed value, declaring how values should be calculated based on other signals.
+2. **Automatic Dependency Tracking and Efficient Updates**: The library tracks dependencies between signals and computed values, ensuring efficient propagation of changes.
+3. **Robust Error Handling**: Built-in error handling at computation level and reactive error management allow for graceful handling of unexpected situations.
+4. **Performance Optimization through Batching**: Group multiple state changes to ensure dependent computations and effects run only once after all changes are applied.
+5. **Flexibility and Integration**: Seamlessly integrates with DOM manipulation and event listeners, fitting into any JavaScript application or framework.
+
+These principles enable developers to create complex, reactive applications with clear data flow, efficient updates, and robust error handling, while promoting code reuse and modularity.

package/index.d.ts

@@ -1,9 +1,10 @@
 /**
  * @name Cause & Effect
- * @version 0.11.0
+ * @version 0.12.1
  * @author Esther Brunner
  */
-export { State, state, isState } from './lib/state';
+export { type Signal, type MaybeSignal, type InferMaybeSignalType, type ComputedCallbacks, type EffectCallbacks, UNSET, isSignal, toSignal } from './lib/signal';
+export { type State, state, isState } from './lib/state';
 export { type Computed, computed, isComputed } from './lib/computed';
-export { type Signal, type MaybeSignal, UNSET, isSignal, toSignal, batch } from './lib/signal';
 export { effect } from './lib/effect';
+export { type EnqueueDedupe, batch, watch, enqueue } from './lib/scheduler';

package/index.js

@@ -1 +1 @@
-var N=(x)=>typeof x==="function";var U=(x)=>N(x)&&x.length<2,O=(x)=>(y)=>y instanceof x,o=O(Error),g=O(Promise),$=(x)=>o(x)?x:new Error(String(x));var w="Computed",f=1000,V=(x)=>{let y=[],j=B,z=null,G=!0,q=!1,H=!1,X=0,J=()=>{if(G=!0,!q)C(y)},Z=()=>I(()=>{if(!G||H)return;let T=(L)=>{if(!Object.is(L,j))j=L,G=!1,z=null,q=!1;else q=!0},E=(L)=>{let Y=$(L);q=Object.is(Y,z),z=Y};H=!0;try{let L=x(j);g(L)?L.then((Y)=>{T(Y),C(y)}).catch(E):T(L)}catch(L){E(L)}finally{H=!1}},J),K={[Symbol.toStringTag]:w,get:()=>{if(X++>=f)throw new Error(`Circular dependency detected: exceeded ${f} iterations`);if(A(y),Z(),z)throw z;return j},map:(T)=>V(()=>T(K.get()))};return K},R=(x)=>!!x&&typeof x==="object"&&x[Symbol.toStringTag]===w;var W,M=0,P=new Set,S=new Set,p=()=>{while(P.size||S.size)P.forEach((x)=>x()),P.clear(),S.forEach((x)=>x()),S.clear()},B=Symbol(),_=(x)=>Q(x)||R(x),d=(x)=>_(x)?x:U(x)?V(x):D(x),A=(x)=>{if(W&&!x.includes(W))x.push(W)},C=(x)=>{x.forEach((y)=>M?P.add(y):y())},I=(x,y)=>{let j=W;W=y,x(),W=j},m=(x)=>{if(M++,x(),M--,!M)p()};class F{x;watchers=[];constructor(x){this.value=x}get(){return A(this.watchers),this.value}set(x){if(Object.is(this.value,x))return;if(this.value=x,C(this.watchers),B===x)this.watchers=[]}update(x){this.set(x(this.value))}map(x){return V(()=>x(this.get()))}}var D=(x)=>new F(x),Q=(x)=>x instanceof F;function b(x,...y){let j=N(x)?{ok:x}:x,{ok:z,nil:G,err:q}=j,H=()=>I(()=>{let X=[],J=[],Z=!1;for(let K of y)try{let T=K.get();if(T===B)Z=!0;X.push(T)}catch(T){J.push($(T))}try{if(!Z&&!J.length)z(...X);else if(J.length&&q)q(...J);else if(Z&&G)G()}catch(K){q?.($(K))}},H);H()}export{d as toSignal,D as state,Q as isState,_ as isSignal,R as isComputed,b as effect,V as computed,m as batch,B as UNSET,F as State};
+var V=(x)=>typeof x==="function";var R=(x,B)=>Object.prototype.toString.call(x)===`[object ${B}]`,m=(x)=>(B)=>B instanceof x,j=m(Error),g=m(Promise),y=(x)=>j(x)?x:new Error(String(x));var F,D=new Set,w=0,N=new Map,M,p=()=>{M=void 0;for(let x of N.values()){for(let B of x.values())B();x.clear()}},d=()=>{if(M)cancelAnimationFrame(M);M=requestAnimationFrame(p)};queueMicrotask(p);var T=(x)=>{if(F&&!x.includes(F))x.push(F)},C=(x)=>{for(let B of x)w?D.add(B):B()},U=()=>{while(D.size){let x=Array.from(D);D.clear();for(let B of x)B()}},n=(x)=>{w++,x(),U(),w--},O=(x,B)=>{let z=F;F=B,x(),F=z},v=(x,B)=>new Promise((z,$)=>{let L=()=>{try{z(x())}catch(H){$(H)}};if(B){let[H,J]=B;if(!N.has(H))N.set(H,new Map);N.get(H).set(J,L)}d()});function Y(x,...B){let z=()=>O(()=>{let $=_(B,x);if(j($))console.error("Unhandled error in effect:",$)},z);z()}var o="Computed",i=(x,B)=>{if(!B)return!1;return x.name===B.name&&x.message===B.message},I=(x,...B)=>{let z=[],$=Q,L,H=!0,J=!1,X=!1,K=(G)=>{if(!Object.is(G,$))$=G,H=!1,L=void 0,J=!1},W=()=>{J=Q===$,$=Q,L=void 0},Z=(G)=>{let P=y(G);J=i(P,L),$=Q,L=P},A=()=>{if(H=!0,!J)C(z)},h=()=>O(()=>{if(X)throw new Error("Circular dependency detected");J=!0,X=!0;let G=_(B,x);if(g(G))W(),G.then((P)=>{K(P),C(z)}).catch(Z);else if(G==null||Q===G)W();else if(j(G))Z(G);else K(G);X=!1},A),q={[Symbol.toStringTag]:o,get:()=>{if(T(z),U(),H)h();if(L)throw L;return $},map:(G)=>I(G,q),match:(G)=>{return Y(G,q),q}};return q},S=(x)=>R(x,o);var b="State",E=(x)=>{let B=[],z=x,$={[Symbol.toStringTag]:b,get:()=>{return T(B),z},set:(L)=>{if(Object.is(z,L))return;if(z=L,C(B),Q===z)B.length=0},update:(L)=>{$.set(L(z))},map:(L)=>I(L,$),match:(L)=>{return Y(L,$),$}};return $},k=(x)=>R(x,b);var Q=Symbol(),c=(x)=>V(x)&&!x.length||typeof x==="object"&&x!==null&&("ok"in x)&&V(x.ok),f=(x)=>k(x)||S(x),t=(x)=>f(x)?x:c(x)?I(x):E(x),_=(x,B)=>{let{ok:z,nil:$,err:L}=V(B)?{ok:B}:B,H=[],J=[],X=!1;for(let W=0;W<x.length;W++){let Z=x[W];try{let A=f(Z)?Z.get():V(Z)?Z():Z;if(A===Q)X=!0;H[W]=A}catch(A){J.push(y(A))}}let K=void 0;try{if(X&&$)K=$();else if(J.length)K=L?L(...J):J[0];else if(!X)K=z(...H)}catch(W){if(K=y(W),L)K=L(K)}return K};export{O as watch,t as toSignal,E as state,k as isState,f as isSignal,S as isComputed,v as enqueue,Y as effect,I as computed,n as batch,Q as UNSET};

package/index.ts

@@ -1,12 +1,15 @@
 /**
  * @name Cause & Effect
- * @version 0.11.0
+ * @version 0.12.1
  * @author Esther Brunner
  */
-export { State, state, isState } from './lib/state'
-export { type Computed, computed, isComputed } from './lib/computed'
 export {
-	type Signal, type MaybeSignal,
-	UNSET, isSignal, toSignal, batch
+	type Signal, type MaybeSignal, type InferMaybeSignalType,
+	type ComputedCallbacks, type EffectCallbacks,
+	UNSET, isSignal, toSignal
 } from './lib/signal'
-export { effect } from './lib/effect'
+
+export { type State, state, isState } from './lib/state'
+export { type Computed, computed, isComputed } from './lib/computed'
+export { effect } from './lib/effect'
+export { type EnqueueDedupe, batch, watch, enqueue } from './lib/scheduler'

package/lib/computed.d.ts

@@ -1,16 +1,19 @@
-export type Computed<T> = {
-    [Symbol.toStringTag]: "Computed";
+import { type MaybeSignal, type EffectCallbacks, type ComputedCallbacks } from './signal';
+export type Computed<T extends {}> = {
+    [Symbol.toStringTag]: 'Computed';
     get: () => T;
-    map: <U extends {}>(fn: (value: T) => U) => Computed<U>;
+    map: <U extends {}>(cb: ComputedCallbacks<U, [Computed<T>]>) => Computed<U>;
+    match: (cb: EffectCallbacks<[Computed<T>]>) => void;
 };
 /**
- * Create a derived state from existing states
+ * Create a derived signal from existing signals
  *
  * @since 0.9.0
- * @param {() => T} fn - compute function to derive state
- * @returns {Computed<T>} result of derived state
+ * @param {() => T} cb - compute callback or object of ok, nil, err callbacks to derive state
+ * @param {U} maybeSignals - signals of functions using signals this values depends on
+ * @returns {Computed<T>} - Computed signal
  */
-export declare const computed: <T extends {}>(fn: (v?: T) => T | Promise<T>) => Computed<T>;
+export declare const computed: <T extends {}, U extends MaybeSignal<{}>[]>(cb: ComputedCallbacks<T, U>, ...maybeSignals: U) => Computed<T>;
 /**
  * Check if a value is a computed state
  *
@@ -18,4 +21,4 @@ export declare const computed: <T extends {}>(fn: (v?: T) => T | Promise<T>) =>
  * @param {unknown} value - value to check
  * @returns {boolean} - true if value is a computed state, false otherwise
  */
-export declare const isComputed: <T>(value: unknown) => value is Computed<T>;
+export declare const isComputed: <T extends {}>(value: unknown) => value is Computed<T>;

package/lib/computed.ts

@@ -1,92 +1,138 @@
-import { type Watcher, subscribe, notify, watch, UNSET } from "./signal"
-import { isPromise, toError } from "./util"
+import {
+	type MaybeSignal, type EffectCallbacks, type ComputedCallbacks,
+	resolve, UNSET
+} from './signal'
+import { isError, isObjectOfType, isPromise, toError } from './util'
+import { type Watcher, flush, notify, subscribe, watch } from './scheduler'
+import { effect } from './effect'
 
 /* === Types === */
 
-export type Computed<T> = {
-    [Symbol.toStringTag]: "Computed"
+export type Computed<T extends {}> = {
+    [Symbol.toStringTag]: 'Computed'
     get: () => T
-    map: <U extends {}>(fn: (value: T) => U) => Computed<U>
+    map: <U extends {}>(cb: ComputedCallbacks<U, [Computed<T>]>) => Computed<U>
+	match: (cb: EffectCallbacks<[Computed<T>]>) => void
 }
 
 /* === Constants === */
 
 const TYPE_COMPUTED = 'Computed'
-const MAX_ITERATIONS = 1000;
 
-/* === Namespace Computed === */
+/* === Private Functions === */
+
+const isEquivalentError = /*#__PURE__*/ (
+	error1: Error,
+	error2: Error | undefined
+): boolean => {
+    if (!error2) return false
+    return error1.name === error2.name && error1.message === error2.message
+}
+
+/* === Computed Factory === */
 
 /**
- * Create a derived state from existing states
+ * Create a derived signal from existing signals
  * 
  * @since 0.9.0
- * @param {() => T} fn - compute function to derive state
- * @returns {Computed<T>} result of derived state
+ * @param {() => T} cb - compute callback or object of ok, nil, err callbacks to derive state
+ * @param {U} maybeSignals - signals of functions using signals this values depends on
+ * @returns {Computed<T>} - Computed signal
  */
-export const computed =  /*#__PURE__*/ <T extends {}>(
-	fn: (v?: T) => T | Promise<T>,
+export const computed = <T extends {}, U extends MaybeSignal<{}>[]>(
+	cb: ComputedCallbacks<T, U>,
+	...maybeSignals: U
 ): Computed<T> => {
 	const watchers: Watcher[] = []
 	let value: T = UNSET
-	let error: Error | null = null
+	let error: Error | undefined
 	let dirty = true
 	let unchanged = false
 	let computing = false
-	let iterations = 0
 
-	const mark: Watcher = () => {
+	// Functions to update internal state
+	const ok = (v: T) => {
+		if (!Object.is(v, value)) {
+			value = v
+			dirty = false
+			error = undefined
+			unchanged = false
+		}
+	}
+	const nil = () => {
+		unchanged = (UNSET === value)
+		value = UNSET
+		error = undefined
+	}
+	const err = (e: unknown) => {
+		const newError = toError(e)
+		unchanged = isEquivalentError(newError, error)
+		value = UNSET
+		error = newError
+	}
+
+	// Called when notified from sources (push)
+	const mark = () => {
 		dirty = true
 		if (!unchanged) notify(watchers)
 	}
 
+	// Called when requested by dependencies (pull)
 	const compute = () => watch(() => {
-		if (!dirty || computing) return
-
-		const ok = (v: T) => {
-			if (!Object.is(v, value)) {
-				value = v
-				dirty = false
-				error = null
-				unchanged = false
-			} else {
-				unchanged = true
-			}
-		}
-		const err = (e: unknown) => {
-			const newError = toError(e)
-			unchanged = Object.is(newError, error)
-			error = newError
-		}
-		
+		if (computing) throw new Error('Circular dependency detected')
+		unchanged = true
 		computing = true
-		try {
-			const res = fn(value)
-			isPromise(res)
-				? res.then(v => {
-					ok(v)
-					notify(watchers)
-				}).catch(err)
-				: ok(res)
-		} catch (e) {
-			err(e)
-		} finally {
-			computing = false
-		}
+		const result = resolve(maybeSignals, cb)
+		if (isPromise(result)) {
+			nil() // sync
+			result.then(v => {
+				ok(v) // async
+                notify(watchers)
+			}).catch(err)
+		} else if (null == result || UNSET === result) nil()
+		else if (isError(result)) err(result)
+		else ok(result)
+		computing = false
 	}, mark)
 
 	const c: Computed<T> = {
 		[Symbol.toStringTag]: TYPE_COMPUTED,
-		get: () => {
-			if (iterations++ >= MAX_ITERATIONS) {
-                throw new Error(`Circular dependency detected: exceeded ${MAX_ITERATIONS} iterations`)
-            }
+
+		/**
+		 * Get the current value of the computed
+		 * 
+		 * @since 0.9.0
+		 * @returns {T} - current value of the computed
+		 */
+		get: (): T => {
 			subscribe(watchers)
-			compute()
+			flush()
+			if (dirty) compute()
 			if (error) throw error
 			return value
 		},
-		map: <U extends {}>(fn: (value: T) => U): Computed<U> =>
-			computed(() => fn(c.get())),
+
+		/**
+		 * Create a computed signal from the current computed signal
+		 * 
+		 * @since 0.9.0
+		 * @param {ComputedCallbacks<U, [Computed<T>]>} cb - compute callback or object of ok, nil, err callbacks to map this value to new computed
+		 * @returns {Computed<U>} - computed signal
+		 */
+		map: <U extends {}>(cb: ComputedCallbacks<U, [Computed<T>]>): Computed<U> =>
+			computed(cb, c),
+
+		/**
+		 * Case matching for the computed signal with effect callbacks
+		 * 
+		 * @since 0.12.0
+		 * @param {EffectCallbacks[Computed<T>]} cb - effect callback or object of ok, nil, err callbacks to be executed when the computed changes
+		 * @returns {Computed<T>} - self, for chaining effect callbacks
+		 */
+		match: (cb: EffectCallbacks<[Computed<T>]>): Computed<T> => {
+			effect(cb, c)
+			return c
+		}
 	}
 	return c
 }
@@ -100,6 +146,5 @@ export const computed =  /*#__PURE__*/ <T extends {}>(
  * @param {unknown} value - value to check
  * @returns {boolean} - true if value is a computed state, false otherwise
  */
-export const isComputed = /*#__PURE__*/ <T>(value: unknown): value is Computed<T> =>
-	!!value && typeof value === 'object'
-		&& (value as { [key in typeof Symbol.toStringTag]: string })[Symbol.toStringTag] === TYPE_COMPUTED
+export const isComputed = /*#__PURE__*/ <T extends {}>(value: unknown): value is Computed<T> =>
+	isObjectOfType(value, TYPE_COMPUTED)

package/lib/effect.d.ts

@@ -1,15 +1,9 @@
-import { type Signal } from "./signal";
-export type EffectOkCallback<T extends {}[]> = (...values: T) => void;
-export type EffectCallbacks<T extends {}[]> = {
-    ok: EffectOkCallback<T>;
-    nil?: () => void;
-    err?: (...errors: Error[]) => void;
-};
+import { type EffectCallbacks, type MaybeSignal } from './signal';
 /**
  * Define what happens when a reactive state changes
  *
  * @since 0.1.0
- * @param {() => void} fn - callback function to be executed when a state changes
+ * @param {() => void} cb - effect callback or object of ok, nil, err callbacks to be executed when a state changes
+ * @param {U} maybeSignals - signals of functions using signals that should trigger the effect
  */
-export declare function effect<T extends {}>(ok: EffectOkCallback<T[]>, ...signals: Signal<T>[]): void;
-export declare function effect<T extends {}>(callbacks: EffectCallbacks<T[]>, ...signals: Signal<T>[]): void;
+export declare function effect<U extends MaybeSignal<{}>[]>(cb: EffectCallbacks<U>, ...maybeSignals: U): void;

package/lib/effect.ts

@@ -1,16 +1,7 @@
 
-import { type Signal, UNSET, type Watcher, watch } from "./signal"
-import { isFunction, toError } from "./util"
-
-/* === Types === */
-
-export type EffectOkCallback<T extends {}[]> = (...values: T) => void
-
-export type EffectCallbacks<T extends {}[]> = {
-	ok: EffectOkCallback<T>
-	nil?: () => void
-	err?: (...errors: Error[]) => void
-}
+import { type EffectCallbacks, type MaybeSignal, resolve } from './signal'
+import { isError } from './util'
+import { watch } from './scheduler'
 
 /* === Exported Function === */
 
@@ -18,48 +9,17 @@ export type EffectCallbacks<T extends {}[]> = {
  * Define what happens when a reactive state changes
  * 
  * @since 0.1.0
- * @param {() => void} fn - callback function to be executed when a state changes
+ * @param {() => void} cb - effect callback or object of ok, nil, err callbacks to be executed when a state changes
+ * @param {U} maybeSignals - signals of functions using signals that should trigger the effect
  */
-
-export function effect<T extends {}>(
-    ok: EffectOkCallback<T[]>,
-    ...signals: Signal<T>[]
-): void
-export function effect<T extends {}>(
-    callbacks: EffectCallbacks<T[]>,
-    ...signals: Signal<T>[]
-): void
-export function effect<T extends {}>(
-	callbacksOrFn: EffectCallbacks<T[]> | EffectOkCallback<T[]>,
-	...signals: Signal<T>[]
+export function effect<U extends MaybeSignal<{}>[]>(
+	cb: EffectCallbacks<U>,
+	...maybeSignals: U
 ): void {
-	const callbacks = isFunction(callbacksOrFn)
-        ? { ok: callbacksOrFn }
-        : callbacksOrFn as EffectCallbacks<T[]>
-
-    const { ok, nil, err } = callbacks
-
-	const run: Watcher = () => watch(() => {
-		const values: T[] = []
-		const errors: Error[] = []
-		let hasUnset = false
-
-		for (const signal of signals) {
-			try {
-				const value = signal.get()
-				if (value === UNSET) hasUnset = true
-				values.push(value)
-			} catch (error) {
-				errors.push(toError(error))
-			}
-		}
-		try {
-			if (!hasUnset && !errors.length) ok(...values)
-			else if (errors.length && err) err(...errors)
-		    else if (hasUnset && nil) nil()
-		} catch (error) {
-            err?.(toError(error))
-		}
+	const run = () => watch(() => {
+		const result = resolve(maybeSignals, cb)
+		if (isError(result))
+			console.error('Unhandled error in effect:', result)
     }, run)
 	run()
 }

package/lib/scheduler.d.ts

@@ -0,0 +1,40 @@
+export type EnqueueDedupe = [Element, string];
+export type Watcher = () => void;
+export type Updater = <T>() => T;
+/**
+ * Add active watcher to the array of watchers
+ *
+ * @param {Watcher[]} watchers - watchers of the signal
+ */
+export declare const subscribe: (watchers: Watcher[]) => void;
+/**
+ * Add watchers to the pending set of change notifications
+ *
+ * @param {Watcher[]} watchers - watchers of the signal
+ */
+export declare const notify: (watchers: Watcher[]) => void;
+/**
+ * Flush all pending changes to notify watchers
+ */
+export declare const flush: () => void;
+/**
+ * Batch multiple changes in a single signal graph and DOM update cycle
+ *
+ * @param {() => void} fn - function with multiple signal writes to be batched
+ */
+export declare const batch: (fn: () => void) => void;
+/**
+ * Run a function in a reactive context
+ *
+ * @param {() => void} run - function to run the computation or effect
+ * @param {Watcher} mark - function to be called when the state changes
+ */
+export declare const watch: (run: () => void, mark: Watcher) => void;
+/**
+ * Enqueue a function to be executed on the next animation frame
+ *
+ * @param callback
+ * @param dedupe
+ * @returns
+ */
+export declare const enqueue: <T>(update: Updater, dedupe?: EnqueueDedupe) => Promise<T>;