@chrrrs/signals 0.1.0

package/README.md

@@ -0,0 +1,25 @@
+# @chrrrs/signals
+
+Minimal React 19 signals for local state and derived values.
+
+## SSR note
+
+Signals created at module scope are shared across SSR requests.
+
+Avoid:
+
+```ts
+export const count = createSignal(0);
+```
+
+Use:
+
+```ts
+import { createSignal } from "@chrrrs/signals";
+
+export function createState() {
+  return {
+    count: createSignal(0),
+  };
+}
+```

package/dist/async.d.ts

@@ -0,0 +1,6 @@
+export type AsyncSignal<T> = {
+    get(): T | undefined;
+    load(): Promise<T>;
+};
+export declare function createAsyncSignal<T>(loadValue: () => Promise<T>): AsyncSignal<T>;
+//# sourceMappingURL=async.d.ts.map

package/dist/async.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"async.d.ts","sourceRoot":"","sources":["../src/async.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,WAAW,CAAC,CAAC,IAAI;IAC3B,GAAG,IAAI,CAAC,GAAG,SAAS,CAAC;IACrB,IAAI,IAAI,OAAO,CAAC,CAAC,CAAC,CAAC;CACpB,CAAC;AAEF,wBAAgB,iBAAiB,CAAC,CAAC,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC,CAAC,CAAC,GAAG,WAAW,CAAC,CAAC,CAAC,CAkChF"}

package/dist/async.js

@@ -0,0 +1,29 @@
+import { createSignal } from "./signal.js";
+export function createAsyncSignal(loadValue) {
+    const valueSignal = createSignal(undefined);
+    let pendingPromise = null;
+    let hasResolved = false;
+    return {
+        get() {
+            return valueSignal.get();
+        },
+        load() {
+            if (hasResolved) {
+                return Promise.resolve(valueSignal.get());
+            }
+            if (pendingPromise) {
+                return pendingPromise;
+            }
+            pendingPromise = loadValue().then((value) => {
+                valueSignal.set(value);
+                hasResolved = true;
+                pendingPromise = null;
+                return value;
+            }, (error) => {
+                pendingPromise = null;
+                throw error;
+            });
+            return pendingPromise;
+        },
+    };
+}

package/dist/computed.d.ts

@@ -0,0 +1,7 @@
+import { type Subscriber } from "./internal.js";
+export type Computed<T> = {
+    get(): T;
+    subscribe(fn: Subscriber): () => void;
+};
+export declare function computed<T>(computeValue: () => T): Computed<T>;
+//# sourceMappingURL=computed.d.ts.map

package/dist/computed.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"computed.d.ts","sourceRoot":"","sources":["../src/computed.ts"],"names":[],"mappings":"AAAA,OAAO,EAIL,KAAK,UAAU,EAEhB,MAAM,eAAe,CAAC;AAEvB,MAAM,MAAM,QAAQ,CAAC,CAAC,IAAI;IACxB,GAAG,IAAI,CAAC,CAAC;IACT,SAAS,CAAC,EAAE,EAAE,UAAU,GAAG,MAAM,IAAI,CAAC;CACvC,CAAC;AA4FF,wBAAgB,QAAQ,CAAC,CAAC,EAAE,YAAY,EAAE,MAAM,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAO9D"}

package/dist/computed.js

@@ -0,0 +1,80 @@
+import { registerDependency, withDependencyCollector, } from "./internal.js";
+class ComputedSignal {
+    computeValue;
+    subscribers = new Set();
+    dependencies = new Map();
+    cachedValue;
+    hasCachedValue = false;
+    isDirty = true;
+    isComputing = false;
+    constructor(computeValue) {
+        this.computeValue = computeValue;
+    }
+    get() {
+        registerDependency(this);
+        if (this.isDirty) {
+            this.recompute();
+        }
+        return this.cachedValue;
+    }
+    subscribe(fn) {
+        this.subscribers.add(fn);
+        return () => {
+            this.subscribers.delete(fn);
+        };
+    }
+    addDependency(dependency) {
+        if (dependency === this) {
+            return;
+        }
+        if (this.dependencies.has(dependency)) {
+            return;
+        }
+        const unsubscribe = dependency.subscribe(() => {
+            this.markDirty();
+        });
+        this.dependencies.set(dependency, unsubscribe);
+    }
+    markDirty() {
+        if (this.isDirty) {
+            return;
+        }
+        this.isDirty = true;
+        for (const subscriber of [...this.subscribers]) {
+            subscriber();
+        }
+    }
+    recompute() {
+        if (this.isComputing) {
+            throw new Error("Circular computed dependency detected");
+        }
+        this.cleanupDependencies();
+        this.isComputing = true;
+        try {
+            const nextValue = withDependencyCollector(this, this.computeValue);
+            this.cachedValue = nextValue;
+            this.hasCachedValue = true;
+            this.isDirty = false;
+        }
+        catch (error) {
+            this.cleanupDependencies();
+            throw error;
+        }
+        finally {
+            this.isComputing = false;
+        }
+    }
+    cleanupDependencies() {
+        for (const unsubscribe of this.dependencies.values()) {
+            unsubscribe();
+        }
+        this.dependencies.clear();
+    }
+}
+export function computed(computeValue) {
+    const computation = new ComputedSignal(computeValue);
+    return {
+        get: () => computation.get(),
+        subscribe: (fn) => computation.subscribe(fn),
+    };
+}

package/dist/index.d.ts

@@ -0,0 +1,5 @@
+export * from "./signal.js";
+export * from "./computed.js";
+export * from "./async.js";
+export * from "./useSignal.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,gBAAgB,CAAC"}

package/dist/index.js

@@ -0,0 +1,8 @@
+export * from "./signal.js";
+export * from "./computed.js";
+export * from "./async.js";
+export * from "./useSignal.js";
+// TODO: proxy-based store
+// TODO: devtools integration
+// TODO: SSR helpers
+// TODO: advanced batching

package/dist/internal.d.ts

@@ -0,0 +1,10 @@
+export type Subscriber = () => void;
+export interface Subscribable {
+    subscribe(fn: Subscriber): () => void;
+}
+export interface DependencyCollector {
+    addDependency(dependency: Subscribable): void;
+}
+export declare function withDependencyCollector<T>(collector: DependencyCollector, fn: () => T): T;
+export declare function registerDependency(dependency: Subscribable): void;
+//# sourceMappingURL=internal.d.ts.map

package/dist/internal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../src/internal.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,UAAU,GAAG,MAAM,IAAI,CAAC;AAEpC,MAAM,WAAW,YAAY;IAC3B,SAAS,CAAC,EAAE,EAAE,UAAU,GAAG,MAAM,IAAI,CAAC;CACvC;AAED,MAAM,WAAW,mBAAmB;IAClC,aAAa,CAAC,UAAU,EAAE,YAAY,GAAG,IAAI,CAAC;CAC/C;AAID,wBAAgB,uBAAuB,CAAC,CAAC,EAAE,SAAS,EAAE,mBAAmB,EAAE,EAAE,EAAE,MAAM,CAAC,GAAG,CAAC,CASzF;AAED,wBAAgB,kBAAkB,CAAC,UAAU,EAAE,YAAY,GAAG,IAAI,CAEjE"}

package/dist/internal.js

@@ -0,0 +1,14 @@
+let activeCollector = null;
+export function withDependencyCollector(collector, fn) {
+    const previousCollector = activeCollector;
+    activeCollector = collector;
+    try {
+        return fn();
+    }
+    finally {
+        activeCollector = previousCollector;
+    }
+}
+export function registerDependency(dependency) {
+    activeCollector?.addDependency(dependency);
+}

package/dist/signal.d.ts

@@ -0,0 +1,8 @@
+import { type Subscriber } from "./internal.js";
+export type Signal<T> = {
+    get(): T;
+    set(value: T): void;
+    subscribe(fn: Subscriber): () => void;
+};
+export declare function createSignal<T>(initialValue: T): Signal<T>;
+//# sourceMappingURL=signal.d.ts.map

package/dist/signal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"signal.d.ts","sourceRoot":"","sources":["../src/signal.ts"],"names":[],"mappings":"AAAA,OAAO,EAAsB,KAAK,UAAU,EAAE,MAAM,eAAe,CAAC;AAEpE,MAAM,MAAM,MAAM,CAAC,CAAC,IAAI;IACtB,GAAG,IAAI,CAAC,CAAC;IACT,GAAG,CAAC,KAAK,EAAE,CAAC,GAAG,IAAI,CAAC;IACpB,SAAS,CAAC,EAAE,EAAE,UAAU,GAAG,MAAM,IAAI,CAAC;CACvC,CAAC;AAEF,wBAAgB,YAAY,CAAC,CAAC,EAAE,YAAY,EAAE,CAAC,GAAG,MAAM,CAAC,CAAC,CAAC,CA6B1D"}

package/dist/signal.js

@@ -0,0 +1,27 @@
+import { registerDependency } from "./internal.js";
+export function createSignal(initialValue) {
+    let value = initialValue;
+    const subscribers = new Set();
+    const signal = {
+        get() {
+            registerDependency(signal);
+            return value;
+        },
+        set(nextValue) {
+            if (Object.is(value, nextValue)) {
+                return;
+            }
+            value = nextValue;
+            for (const subscriber of [...subscribers]) {
+                subscriber();
+            }
+        },
+        subscribe(fn) {
+            subscribers.add(fn);
+            return () => {
+                subscribers.delete(fn);
+            };
+        },
+    };
+    return signal;
+}

package/dist/useSignal.d.ts

@@ -0,0 +1,6 @@
+import type { Signal } from "./signal.js";
+type ReadableSignal<T> = Pick<Signal<T>, "get" | "subscribe">;
+export declare function useSignal<T>(signal: ReadableSignal<T>): T;
+export declare function useSignalSelector<T, U>(signal: ReadableSignal<T>, selector: (value: T) => U): U;
+export {};
+//# sourceMappingURL=useSignal.d.ts.map

package/dist/useSignal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSignal.d.ts","sourceRoot":"","sources":["../src/useSignal.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAE1C,KAAK,cAAc,CAAC,CAAC,IAAI,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK,GAAG,WAAW,CAAC,CAAC;AAM9D,wBAAgB,SAAS,CAAC,CAAC,EAAE,MAAM,EAAE,cAAc,CAAC,CAAC,CAAC,GAAG,CAAC,CAEzD;AAED,wBAAgB,iBAAiB,CAAC,CAAC,EAAE,CAAC,EACpC,MAAM,EAAE,cAAc,CAAC,CAAC,CAAC,EACzB,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,CAAC,GACxB,CAAC,CAiBH"}

package/dist/useSignal.js

@@ -0,0 +1,18 @@
+import { useRef, useSyncExternalStore } from "react";
+export function useSignal(signal) {
+    return useSyncExternalStore(signal.subscribe, signal.get, signal.get);
+}
+export function useSignalSelector(signal, selector) {
+    const snapshotRef = useRef(null);
+    const getSnapshot = () => {
+        const selectedValue = selector(signal.get());
+        const currentSnapshot = snapshotRef.current;
+        if (currentSnapshot !== null && Object.is(currentSnapshot.value, selectedValue)) {
+            return currentSnapshot;
+        }
+        const nextSnapshot = { value: selectedValue };
+        snapshotRef.current = nextSnapshot;
+        return nextSnapshot;
+    };
+    return useSyncExternalStore(signal.subscribe, getSnapshot, getSnapshot).value;
+}

package/package.json

@@ -0,0 +1,58 @@
+{
+  "name": "@chrrrs/signals",
+  "version": "0.1.0",
+  "description": "Minimal React 19 signals for local state and derived values.",
+  "keywords": [
+    "react",
+    "signals",
+    "state",
+    "typescript",
+    "suspense"
+  ],
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/chrrrs/signals.git",
+    "directory": "packages/signals"
+  },
+  "homepage": "https://github.com/chrrrs/signals/tree/main/packages/signals",
+  "bugs": {
+    "url": "https://github.com/chrrrs/signals/issues"
+  },
+  "type": "module",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "clean": "rm -rf dist tsconfig.tsbuildinfo",
+    "build": "npm run clean && tsc -b",
+    "check-types": "tsc --noEmit",
+    "test": "vitest",
+    "prepublishOnly": "npm run build"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "peerDependencies": {
+    "react": "^19.0.0"
+  },
+  "devDependencies": {
+    "@repo/typescript-config": "workspace:*",
+    "@types/node": "^22.15.3",
+    "@types/react": "19.2.2",
+    "@types/react-dom": "19.2.2",
+    "jsdom": "^26.1.0",
+    "react": "^19.2.0",
+    "react-dom": "^19.2.0",
+    "typescript": "5.9.2",
+    "vitest": "^3.2.4"
+  }
+}