@zeix/cause-effect 0.14.0 → 0.14.1

package/README.md

@@ -1,6 +1,6 @@
 # Cause & Effect
 
-Version 0.14.0
+Version 0.14.1
 
 **Cause & Effect** is a lightweight, reactive state management library for JavaScript applications. It uses fine-grained reactivity with signals to create predictable and efficient data flow in your app.
 
@@ -10,9 +10,9 @@ Version 0.14.0
 
 ### Core Concepts
 
-- **State signals**: Hold values that can be directly modified
-- **Computed signals**: Derive values from other signals (either `memo()` for sync or `task()` for async)
-- **Effects**: Run side effects when signals change
+- **State signals**: Hold values that can be directly modified: `state()`
+- **Computed signals**: Derive memoized values from other signals: `computed()`
+- **Effects**: Run side effects when signals change: `effect()`
 
 ## Key Features
 
@@ -26,20 +26,17 @@ Version 0.14.0
 ## Quick Start
 
 ```js
-import { state, memo, effect } from '@zeix/cause-effect'
+import { state, computed, effect } from '@zeix/cause-effect'
 
 // 1. Create state
 const user = state({ name: 'Alice', age: 30 })
 
 // 2. Create computed values
-const greeting = memo(() => `Hello ${user.get().name}!`)
+const greeting = computed(() => `Hello ${user.get().name}!`)
 
 // 3. React to changes
-effect({
-  signals: [user, greeting],
-  ok: ({ age }, greet) => {
-    console.log(`${greet} You are ${age} years old`)
-  }
+effect(() => {
+  console.log(`${greeting.get()} You are ${user.get().age} years old`)
 })
 
 // 4. Update state
@@ -76,61 +73,85 @@ document.querySelector('.increment').addEventListener('click', () => {
 // Click on button logs '25', '26', and so on
 ```
 
-### Computed Signals: memo() and task()
+### Computed Signals vs. Functions
 
-#### Synchronous Computations with memo()
+#### When to Use Computed Signals
 
-`memo()` creates a read-only computed signal for synchronous calculations. It automatically tracks dependencies and updates when they change.
+`computed()` creates a memoized read-only signal that automatically tracks dependencies and updates only when those dependencies change.
 
 ```js
-import { state, memo, effect } from '@zeix/cause-effect'
+import { state, computed, effect } from '@zeix/cause-effect'
 
 const count = state(42)
-const isOdd = memo(() => count.get() % 2)
-effect(() => console.log(isOdd.get())) // logs 'false'
+const isEven = computed(() => !(count.get() % 2))
+effect(() => console.log(isEven.get())) // logs 'true'
 count.set(24) // logs nothing because 24 is also an even number
 document.querySelector('button.increment').addEventListener('click', () => {
   count.update(v => ++v)
 })
-// Click on button logs 'true', 'false', and so on
+// Click on button logs 'false', 'true', and so on
+```
+
+#### When to Use Functions
+
+**Performance tip**: For simple derivations, plain functions often outperform computed signals:
+
+```js
+// More performant for simple calculations
+const isEven = () => !(count.get() % 2)
 ```
 
-#### Asynchronous Computations with task()
+**When to use which approach:**
 
-`task()` creates computed signals for asynchronous operations. It automatically manages promises, tracks dependencies, and handles cancellation through `AbortController`.
+- **Use functions when**: The calculation is simple, inexpensive, or called infrequently
+- **Use computed() when**:
+  - The calculation is expensive
+  - You need to share the result between multiple consumers
+  - You're working with asynchronous operations
+  - You need to track specific error states
 
-**Note**: Task signals return `UNSET` while pending, which you can handle with the `nil` case in effects.
+#### Asynchronous Computations with Automatic Cancellation
+
+`computed()` seamlessly handles asynchronous operations with built-in cancellation support. When used with an async function, it:
+
+1. Provides an `abort` signal parameter you can pass to fetch or other cancelable APIs
+2. Automatically cancels pending operations when dependencies change
+3. Returns `UNSET` while the Promise is pending
+4. Properly handles errors from failed requests
 
 ```js
-import { state, task, effect } from '@zeix/cause-effect'
+import { state, computed, effect } from '@zeix/cause-effect'
 
-const entryId = state(42)
-const entryData = task(async abort => {
-  const response = await fetch(`/api/entry/${entryId.get()}`, { signal: abort })
+const id = state(42)
+const data = computed(async abort => {
+  // The abort signal is automatically managed by the computed signal
+  const response = await fetch(`/api/entries/${id.get()}`, { signal: abort })
   if (!response.ok) throw new Error(`Failed to fetch data: ${response.statusText}`)
   return response.json()
 })
 
-// Display data when available
+// Handle all possible states
 effect({
-  signals: [entryData],
-  ok: data => console.log('Data loaded:', data),
+  signals: [data],
+  ok: json => console.log('Data loaded:', json),
   nil: () => console.log('Loading...'),
   err: error => console.error('Error:', error)
 })
 
-// Move to next entry, automatically triggers a new fetch
+// When id changes, the previous request is automatically canceled
 document.querySelector('button.next').addEventListener('click', () => {
-  entryId.update(v => ++v)
+  id.update(v => ++v)
 })
 ```
 
+**Note**: Always use `computed()` (not plain functions) for async operations to benefit from automatic cancellation, memoization, and state management.
+
 ## Effects and Error Handling
 
 Cause & Effect provides a robust way to handle side effects and errors through the `effect()` function, with three distinct paths:
 
 1. **Ok**: When values are available
-2. **Nil**: For loading/unset states (primarily with async tasks)
+2. **Nil**: For loading/unset states (with async tasks)
 3. **Err**: When errors occur during computation
 
 This allows for declarative handling of all possible states:
@@ -138,13 +159,13 @@ This allows for declarative handling of all possible states:
 ```js
 effect({
   signals: [data],
-  ok: (value) => /* update UI */,
-  nil: () => /* show loading */,
-  err: (error) => /* show error */
+  ok: (value) => /* update UI when data is available */,
+  nil: () => /* show loading state while pending */,
+  err: (error) => /* show error message when computation fails */
 })
 ```
 
-Instead of using a single callback function, you can provide an object with an `ok` handler (required), plus optional `err` and `nil` handlers. Cause & Effect will automatically route to the appropriate handler based on the state of the signals.
+Instead of using a single callback function, you can provide an object with an `ok` handler (required), plus optional `err` and `nil` handlers. Cause & Effect will automatically route to the appropriate handler based on the state of the signals. If not provided, Cause & Effect will assume `console.error` for `err` and a no-op for `nil`.
 
 ## DOM Updates
 
@@ -237,13 +258,13 @@ Using Symbols for deduplication provides:
 Use `batch()` to group multiple signal updates, ensuring effects run only once after all changes are applied:
 
 ```js
-import { state, memo, effect, batch } from '@zeix/cause-effect'
+import { state, computed, effect, batch } from '@zeix/cause-effect'
 
 // State: define an array of State<number>
 const signals = [state(2), state(3), state(5)]
 
 // Compute the sum of all signals
-const sum = memo(() => {
+const sum = computed(() => {
   const v = signals.reduce((total, signal) => total + signal.get(), 0)
   // Validate the result
   if (!Number.isFinite(v)) throw new Error('Invalid value')
@@ -260,7 +281,9 @@ effect({
 // 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))
+    signals.forEach(signal => {
+      signal.update(v => v * 2)
+    })
   })
 })
 // Click on button logs '20' only once
@@ -274,6 +297,7 @@ The Cause & Effect library is designed around these principles:
 
 - **Minimal API**: Core primitives with a small but powerful interface
 - **Automatic Dependency Tracking**: Fine-grained reactivity with minimal boilerplate
+- **Performance-Focused**: Choose the right tool (functions vs computed) for optimal speed
 - **Tree-Shakable**: Import only what you need for optimal bundle size
 - **Flexible Integration**: Works with any JavaScript application or framework
 
@@ -282,49 +306,21 @@ The Cause & Effect library is designed around these principles:
 Effects return a cleanup function. When executed, it will unsubscribe from signals and run cleanup functions returned by effect callbacks, for example to remove event listeners.
 
 ```js
-import { state, memo, effect } from '@zeix/cause-effect'
+import { state, computed, effect } from '@zeix/cause-effect'
 
 const user = state({ name: 'Alice', age: 30 })
-const greeting = memo(() => `Hello ${user.get().name}!`)
-const cleanup = effect({
-  signals: [user, greeting],
-  ok: ({ age }, greet) => {
-    console.log(`${greet} You are ${age} years old`)
-    return () => console.log('Cleanup') // Cleanup function
-  }
+const greeting = () => `Hello ${user.get().name}!`
+const cleanup = effect(() => {
+	console.log(`${greeting()} You are ${user.get().age} years old`)
+	return () => console.log('Cleanup') // Cleanup function
 })
 
 // When you no longer need the effect, execute the cleanup function
-cleanup() // Logs: 'Cleanup' and unsubscribes from signals `user` and `greeting`
+cleanup() // Logs: 'Cleanup' and unsubscribes from signal `user`
 
 user.set({ name: 'Bob', age: 28 }) // Won't trigger the effect anymore
 ```
 
-### Automatic Abort Control
-
-For asynchronous operations, `task()` automatically manages cancellation when dependencies change, providing an `abort` signal parameter:
-
-```js
-import { state, task, effect } from '@zeix/cause-effect'
-
-const id = state(42)
-const url = memo(v => `https://example.com/api/entries/${id.get()}`)
-const data = task(async abort => {
-  const response = await fetch(url.get(), { signal: abort })
-  if (!response.ok) throw new Error(`Failed to fetch data: ${response.statusText}`)
-  return response.json()
-})
-effect({
-  signals: [data],
-  ok: v => console.log('Value:', v),
-  nil: () => console.warn('Not ready'),
-  err: e => console.error('Error:', e)
-})
-
-// User switches to another entry
-id.set(24) // Cancels the previous fetch request and starts a new one
-```
-
 ## Contributing & License
 
 Feel free to contribute, report issues, or suggest improvements.

package/index.d.ts

@@ -1,13 +1,11 @@
 /**
  * @name Cause & Effect
- * @version 0.14.0
+ * @version 0.14.1
  * @author Esther Brunner
  */
-export { CircularDependencyError } from './src/util';
-export { type Signal, type MaybeSignal, UNSET, isSignal, isComputedCallback, toSignal, } from './src/signal';
-export { type State, state, isState } from './src/state';
-export { type Computed, type ComputedCallback, computed, isComputed, } from './src/computed';
-export { type MemoCallback, memo } from './src/memo';
-export { type TaskCallback, task } from './src/task';
+export { isFunction, CircularDependencyError } from './src/util';
+export { type Signal, type MaybeSignal, type SignalValues, UNSET, isSignal, isComputedCallback, toSignal, } from './src/signal';
+export { type State, TYPE_STATE, state, isState } from './src/state';
+export { type Computed, type ComputedCallback, TYPE_COMPUTED, computed, isComputed, } from './src/computed';
 export { type EffectMatcher, effect } from './src/effect';
-export { batch, watch, enqueue } from './src/scheduler';
+export { type Watcher, type Cleanup, type Updater, watch, subscribe, notify, flush, batch, observe, enqueue, } from './src/scheduler';

package/index.js

@@ -1 +1 @@
-var O=($)=>typeof $==="function",p=($)=>O($)&&$.constructor.name==="AsyncFunction",N=($,B)=>Object.prototype.toString.call($)===`[object ${B}]`,c=($)=>$ instanceof Error,q=($)=>$ instanceof DOMException&&$.name==="AbortError",d=($)=>$ instanceof Promise,M=($)=>c($)?$:Error(String($));class x extends Error{constructor($){super(`Circular dependency in ${$} detected`);return this}}var V,k=new Set,U=0,b=new Map,_,h=()=>{_=void 0;let $=Array.from(b.values());b.clear();for(let B of $)B()},n=()=>{if(_)cancelAnimationFrame(_);_=requestAnimationFrame(h)};queueMicrotask(h);var Y=($)=>{if(V&&!$.has(V)){let B=V;$.add(B),V.cleanups.add(()=>{$.delete(B)})}},A=($)=>{for(let B of $)if(U)k.add(B);else B()},C=()=>{while(k.size){let $=Array.from(k);k.clear();for(let B of $)B()}},l=($)=>{U++;try{$()}finally{C(),U--}},R=($,B)=>{let z=V;V=B;try{$()}finally{V=z}},u=($,B)=>new Promise((z,F)=>{b.set(B||Symbol(),()=>{try{z($())}catch(L){F(L)}}),n()});var v="State",S=($)=>{let B=new Set,z=$,F={[Symbol.toStringTag]:v,get:()=>{return Y(B),z},set:(L)=>{if(Object.is(z,L))return;if(z=L,A(B),K===z)B.clear()},update:(L)=>{F.set(L(z))}};return F},T=($)=>N($,v);var w=($)=>{let B=new Set,z=K,F,L=!0,X=!1,H=()=>{if(L=!0,B.size)A(B);else H.cleanups.forEach((W)=>W()),H.cleanups.clear()};H.cleanups=new Set;let Q=()=>R(()=>{if(X)throw new x("memo");X=!0;try{let W=$();if(W==null||K===W)z=K,F=void 0;else z=W,L=!1,F=void 0}catch(W){z=K,F=W instanceof Error?W:new Error(String(W))}finally{X=!1}},H);return{[Symbol.toStringTag]:y,get:()=>{if(Y(B),C(),L)Q();if(F)throw F;return z}}};var g=($)=>{let B=new Set,z=K,F,L=!0,X=!1,H=!1,Q,j=(J)=>{if(!Object.is(J,z))z=J,L=!1,F=void 0,X=!0},W=()=>{X=K!==z,z=K,F=void 0},D=(J)=>{let I=M(J);X=!(F&&I.name===F.name&&I.message===F.message),z=K,F=I},G=(J)=>{if(H=!1,Q=void 0,j(J),X)A(B)},Z=(J)=>{if(H=!1,Q=void 0,D(J),X)A(B)},i=()=>{H=!1,Q=void 0,m()},P=()=>{if(L=!0,Q?.abort("Aborted because source signal changed"),B.size)A(B);else P.cleanups.forEach((J)=>J()),P.cleanups.clear()};P.cleanups=new Set;let m=()=>R(()=>{if(H)throw new x("task");X=!1,Q=new AbortController,Q.signal.addEventListener("abort",i,{once:!0});let J;H=!0;try{J=$(Q.signal)}catch(I){if(q(I))W();else D(I);H=!1;return}if(d(J))J.then(G,Z);else if(J==null||K===J)W();else j(J);H=!1},P);return{[Symbol.toStringTag]:y,get:()=>{if(Y(B),C(),L)m();if(F)throw F;return z}}};var y="Computed",E=($)=>p($)?g($):w($),f=($)=>N($,y);var K=Symbol(),o=($)=>T($)||f($),s=($)=>O($)&&$.length<2,t=($)=>o($)?$:s($)?E($):S($);function r($){let{signals:B,ok:z,err:F=console.error,nil:L=()=>{}}=O($)?{signals:[],ok:$}:$,X=!1,H=()=>R(()=>{if(X)throw new x("effect");X=!0;let Q=void 0;try{let j=[],W=!1,D=B.map((G)=>{try{let Z=G.get();if(Z===K)W=!0;return Z}catch(Z){if(q(Z))throw Z;return j.push(M(Z)),K}});try{Q=W?L():j.length?F(...j):z(...D)}catch(G){if(q(G))throw G;let Z=M(G);Q=F(Z)}}catch(j){F(M(j))}if(O(Q))H.cleanups.add(Q);X=!1},H);return H.cleanups=new Set,H(),()=>{H.cleanups.forEach((Q)=>Q()),H.cleanups.clear()}}export{R as watch,t as toSignal,g as task,S as state,w as memo,T as isState,o as isSignal,s as isComputedCallback,f as isComputed,u as enqueue,r as effect,E as computed,l as batch,K as UNSET,x as CircularDependencyError};
+var j=($)=>typeof $==="function",M=($,B)=>Object.prototype.toString.call($)===`[object ${B}]`,Y=($)=>$ instanceof Error?$:Error(String($));class F extends Error{constructor($){super(`Circular dependency in ${$} detected`);return this}}var y,N=new Set,U=0,k=new Map,D,f=()=>{D=void 0;let $=Array.from(k.values());k.clear();for(let B of $)B()},d=()=>{if(D)cancelAnimationFrame(D);D=requestAnimationFrame(f)};queueMicrotask(f);var I=($)=>{let B=new Set,W=$;return W.off=(z)=>{B.add(z)},W.cleanup=()=>{for(let z of B)z();B.clear()},W},O=($)=>{if(y&&!$.has(y)){let B=y;$.add(B),y.off(()=>{$.delete(B)})}},R=($)=>{for(let B of $)if(U)N.add(B);else B()},P=()=>{while(N.size){let $=Array.from(N);N.clear();for(let B of $)B()}},h=($)=>{U++;try{$()}finally{P(),U--}},q=($,B)=>{let W=y;y=B;try{$()}finally{y=W}},v=($,B)=>new Promise((W,z)=>{k.set(B||Symbol(),()=>{try{W($())}catch(G){z(G)}}),d()});var _="State",S=($)=>{let B=new Set,W=$,z={[Symbol.toStringTag]:_,get:()=>{return O(B),W},set:(G)=>{if(Object.is(W,G))return;if(W=G,R(B),J===W)B.clear()},update:(G)=>{z.set(G(W))}};return z},T=($)=>M($,_);var b="Computed",E=($)=>{let B=new Set,W=J,z,G,X=!0,K=!1,L=!1,x=(H)=>{if(!Object.is(H,W))W=H,K=!0;z=void 0,X=!1},C=()=>{K=J!==W,W=J,z=void 0},Z=(H)=>{let Q=Y(H);K=!z||Q.name!==z.name||Q.message!==z.message,W=J,z=Q},A=(H)=>(Q)=>{if(L=!1,G=void 0,H(Q),K)R(B)},V=I(()=>{if(X=!0,G?.abort("Aborted because source signal changed"),B.size)R(B);else V.cleanup()}),w=()=>q(()=>{if(L)throw new F("computed");if(K=!1,j($)&&$.constructor.name==="AsyncFunction"){if(G)return W;G=new AbortController,G.signal.addEventListener("abort",()=>{L=!1,G=void 0,w()},{once:!0})}let H;L=!0;try{H=G?$(G.signal):$()}catch(Q){if(Q instanceof DOMException&&Q.name==="AbortError")C();else Z(Q);L=!1;return}if(H instanceof Promise)H.then(A(x),A(Z));else if(H==null||J===H)C();else x(H);L=!1},V);return{[Symbol.toStringTag]:b,get:()=>{if(O(B),P(),X)w();if(z)throw z;return W}}},g=($)=>M($,b),m=($)=>j($)&&$.length<2;var J=Symbol(),p=($)=>T($)||g($),o=($)=>p($)?$:m($)?E($):S($);function s($){let{signals:B,ok:W,err:z=console.error,nil:G=()=>{}}=j($)?{signals:[],ok:$}:$,X=!1,K=I(()=>q(()=>{if(X)throw new F("effect");X=!0;let L=[],x=!1,C=B.map((A)=>{try{let V=A.get();if(V===J)x=!0;return V}catch(V){return L.push(Y(V)),J}}),Z=void 0;try{Z=x?G():L.length?z(...L):W(...C)}catch(A){Z=z(Y(A))}finally{if(j(Z))K.off(Z)}X=!1},K));return K(),()=>K.cleanup()}export{I as watch,o as toSignal,O as subscribe,S as state,q as observe,R as notify,T as isState,p as isSignal,j as isFunction,m as isComputedCallback,g as isComputed,P as flush,v as enqueue,s as effect,E as computed,h as batch,J as UNSET,_ as TYPE_STATE,b as TYPE_COMPUTED,F as CircularDependencyError};

package/index.ts

@@ -1,25 +1,36 @@
 /**
  * @name Cause & Effect
- * @version 0.14.0
+ * @version 0.14.1
  * @author Esther Brunner
  */
-export { CircularDependencyError } from './src/util'
+export { isFunction, CircularDependencyError } from './src/util'
 export {
 	type Signal,
 	type MaybeSignal,
+	type SignalValues,
 	UNSET,
 	isSignal,
 	isComputedCallback,
 	toSignal,
 } from './src/signal'
-export { type State, state, isState } from './src/state'
+export { type State, TYPE_STATE, state, isState } from './src/state'
 export {
 	type Computed,
 	type ComputedCallback,
+	TYPE_COMPUTED,
 	computed,
 	isComputed,
 } from './src/computed'
-export { type MemoCallback, memo } from './src/memo'
-export { type TaskCallback, task } from './src/task'
 export { type EffectMatcher, effect } from './src/effect'
-export { batch, watch, enqueue } from './src/scheduler'
+export {
+	type Watcher,
+	type Cleanup,
+	type Updater,
+	watch,
+	subscribe,
+	notify,
+	flush,
+	batch,
+	observe,
+	enqueue,
+} from './src/scheduler'

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@zeix/cause-effect",
-	"version": "0.14.0",
+	"version": "0.14.1",
 	"author": "Esther Brunner",
 	"main": "index.js",
 	"module": "index.ts",

package/src/computed.d.ts

@@ -1,20 +1,14 @@
-import { type MemoCallback } from './memo';
-import { type TaskCallback } from './task';
 type Computed<T extends {}> = {
     [Symbol.toStringTag]: 'Computed';
     get(): T;
 };
 type ComputedCallback<T extends {} & {
     then?: void;
-}> = TaskCallback<T> | MemoCallback<T>;
+}> = ((abort: AbortSignal) => Promise<T>) | (() => T);
 declare const TYPE_COMPUTED = "Computed";
 /**
  * Create a derived signal from existing signals
  *
- * This function delegates to either memo() for synchronous computations
- * or task() for asynchronous computations, providing better performance
- * for each case.
- *
  * @since 0.9.0
  * @param {ComputedCallback<T>} fn - computation callback function
  * @returns {Computed<T>} - Computed signal
@@ -28,4 +22,12 @@ declare const computed: <T extends {}>(fn: ComputedCallback<T>) => Computed<T>;
  * @returns {boolean} - true if value is a computed state, false otherwise
  */
 declare const isComputed: <T extends {}>(value: unknown) => value is Computed<T>;
-export { type Computed, type ComputedCallback, TYPE_COMPUTED, computed, isComputed, };
+/**
+ * Check if the provided value is a callback that may be used as input for toSignal() to derive a computed state
+ *
+ * @since 0.12.0
+ * @param {unknown} value - value to check
+ * @returns {boolean} - true if value is a callback or callbacks object, false otherwise
+ */
+declare const isComputedCallback: <T extends {}>(value: unknown) => value is ComputedCallback<T>;
+export { type Computed, type ComputedCallback, TYPE_COMPUTED, computed, isComputed, isComputedCallback, };

package/src/computed.ts

@@ -1,6 +1,18 @@
-import { isAsyncFunction, isObjectOfType } from './util'
-import { type MemoCallback, memo } from './memo'
-import { type TaskCallback, task } from './task'
+import {
+	CircularDependencyError,
+	isFunction,
+	isObjectOfType,
+	toError,
+} from './util'
+import {
+	type Watcher,
+	watch,
+	subscribe,
+	notify,
+	flush,
+	observe,
+} from './scheduler'
+import { UNSET } from './signal'
 
 /* === Types === */
 
@@ -9,8 +21,8 @@ type Computed<T extends {}> = {
 	get(): T
 }
 type ComputedCallback<T extends {} & { then?: void }> =
-	| TaskCallback<T>
-	| MemoCallback<T>
+	| ((abort: AbortSignal) => Promise<T>)
+	| (() => T)
 
 /* === Constants === */
 
@@ -21,16 +33,116 @@ const TYPE_COMPUTED = 'Computed'
 /**
  * Create a derived signal from existing signals
  *
- * This function delegates to either memo() for synchronous computations
- * or task() for asynchronous computations, providing better performance
- * for each case.
- *
  * @since 0.9.0
  * @param {ComputedCallback<T>} fn - computation callback function
  * @returns {Computed<T>} - Computed signal
  */
-const computed = <T extends {}>(fn: ComputedCallback<T>): Computed<T> =>
-	isAsyncFunction<T>(fn) ? task<T>(fn) : memo<T>(fn as MemoCallback<T>)
+const computed = <T extends {}>(fn: ComputedCallback<T>): Computed<T> => {
+	const watchers: Set<Watcher> = new Set()
+
+	// Internal state
+	let value: T = UNSET
+	let error: Error | undefined
+	let controller: AbortController | undefined
+	let dirty = true
+	let changed = false
+	let computing = false
+
+	// Functions to update internal state
+	const ok = (v: T) => {
+		if (!Object.is(v, value)) {
+			value = v
+			changed = true
+		}
+		error = undefined
+		dirty = false
+	}
+	const nil = () => {
+		changed = UNSET !== value
+		value = UNSET
+		error = undefined
+	}
+	const err = (e: unknown) => {
+		const newError = toError(e)
+		changed =
+			!error ||
+			newError.name !== error.name ||
+			newError.message !== error.message
+		value = UNSET
+		error = newError
+	}
+	const settle =
+		<T>(settleFn: (arg: T) => void) =>
+		(arg: T) => {
+			computing = false
+			controller = undefined
+			settleFn(arg)
+			if (changed) notify(watchers)
+		}
+
+	// Own watcher: called when notified from sources (push)
+	const mark = watch(() => {
+		dirty = true
+		controller?.abort('Aborted because source signal changed')
+		if (watchers.size) notify(watchers)
+		else mark.cleanup()
+	})
+
+	// Called when requested by dependencies (pull)
+	const compute = () =>
+		observe(() => {
+			if (computing) throw new CircularDependencyError('computed')
+			changed = false
+			if (isFunction(fn) && fn.constructor.name === 'AsyncFunction') {
+				if (controller) return value // return current value until promise resolves
+				controller = new AbortController()
+				controller.signal.addEventListener(
+					'abort',
+					() => {
+						computing = false
+						controller = undefined
+						compute() // retry
+					},
+					{
+						once: true,
+					},
+				)
+			}
+			let result: T | Promise<T>
+			computing = true
+			try {
+				result = controller ? fn(controller.signal) : (fn as () => T)()
+			} catch (e) {
+				if (e instanceof DOMException && e.name === 'AbortError') nil()
+				else err(e)
+				computing = false
+				return
+			}
+			if (result instanceof Promise) result.then(settle(ok), settle(err))
+			else if (null == result || UNSET === result) nil()
+			else ok(result)
+			computing = false
+		}, mark)
+
+	const c: Computed<T> = {
+		[Symbol.toStringTag]: TYPE_COMPUTED,
+
+		/**
+		 * Get the current value of the computed
+		 *
+		 * @since 0.9.0
+		 * @returns {T} - current value of the computed
+		 */
+		get: (): T => {
+			subscribe(watchers)
+			flush()
+			if (dirty) compute()
+			if (error) throw error
+			return value
+		},
+	}
+	return c
+}
 
 /**
  * Check if a value is a computed state
@@ -43,6 +155,17 @@ const isComputed = /*#__PURE__*/ <T extends {}>(
 	value: unknown,
 ): value is Computed<T> => isObjectOfType(value, TYPE_COMPUTED)
 
+/**
+ * Check if the provided value is a callback that may be used as input for toSignal() to derive a computed state
+ *
+ * @since 0.12.0
+ * @param {unknown} value - value to check
+ * @returns {boolean} - true if value is a callback or callbacks object, false otherwise
+ */
+const isComputedCallback = /*#__PURE__*/ <T extends {}>(
+	value: unknown,
+): value is ComputedCallback<T> => isFunction(value) && value.length < 2
+
 /* === Exports === */
 
 export {
@@ -51,4 +174,5 @@ export {
 	TYPE_COMPUTED,
 	computed,
 	isComputed,
+	isComputedCallback,
 }

package/src/effect.d.ts

@@ -1,10 +1,8 @@
-import { type Signal } from './signal';
+import { type Signal, type SignalValues } from './signal';
 import { type Cleanup } from './scheduler';
 type EffectMatcher<S extends Signal<{}>[]> = {
     signals: S;
-    ok: (...values: {
-        [K in keyof S]: S[K] extends Signal<infer T> ? T : never;
-    }) => void | Cleanup;
+    ok: (...values: SignalValues<S>) => void | Cleanup;
     err?: (...errors: Error[]) => void | Cleanup;
     nil?: () => void | Cleanup;
 };