@ereo/state 0.1.6

package/README.md

@@ -0,0 +1,90 @@
+# @ereo/state
+
+Signals and reactivity system for the EreoJS framework. Provides fine-grained reactive state management with a simple API.
+
+## Installation
+
+```bash
+bun add @ereo/state
+```
+
+## Quick Start
+
+```typescript
+import { signal, computed, createStore } from '@ereo/state';
+
+// Create a signal
+const count = signal(0);
+
+// Read value
+console.log(count.get()); // 0
+
+// Update value
+count.set(1);
+count.update(n => n + 1);
+
+// Subscribe to changes
+const unsubscribe = count.subscribe(value => {
+  console.log('Count changed:', value);
+});
+
+// Create computed signals
+const doubled = computed(() => count.get() * 2, [count]);
+```
+
+## Using Stores
+
+```typescript
+import { createStore } from '@ereo/state';
+
+interface AppState {
+  user: string | null;
+  theme: 'light' | 'dark';
+  count: number;
+}
+
+const store = createStore<AppState>({
+  user: null,
+  theme: 'light',
+  count: 0,
+});
+
+// Get signal for a specific key
+const userSignal = store.get('user');
+
+// Set value
+store.set('theme', 'dark');
+
+// Get snapshot of all values
+const snapshot = store.getSnapshot();
+```
+
+## Key Features
+
+- **Signals**: Fine-grained reactive primitives with automatic change detection
+- **Computed Values**: Derived state that updates automatically when dependencies change
+- **Stores**: Centralized state management with key-value access
+- **Subscriptions**: React to state changes with subscribe/unsubscribe pattern
+- **Batch Updates**: Group multiple updates to minimize re-renders
+- **Map Transform**: Transform signals with the `map()` method
+- **TypeScript Support**: Full type inference and safety
+
+## API Reference
+
+- `signal<T>(value)` - Create a reactive signal
+- `atom<T>(value)` - Alias for signal
+- `computed<T>(fn, deps)` - Create a computed signal
+- `batch(fn)` - Batch multiple updates
+- `createStore<T>(state)` - Create a reactive store
+
+## Documentation
+
+For full documentation, visit the [EreoJS Documentation](https://ereojs.dev/docs/state).
+
+## Part of EreoJS
+
+This package is part of the [EreoJS](https://github.com/ereojs/ereo) monorepo - a modern full-stack JavaScript framework.
+
+## License
+
+MIT

package/dist/index.d.ts

@@ -0,0 +1,6 @@
+/**
+ * @ereo/state - Main exports
+ */
+export { Signal, Store, signal, atom, computed, batch, createStore, } from './signals';
+export { useSignal, useStoreKey, useStore, } from './react';
+//# 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;;GAEG;AAEH,OAAO,EACL,MAAM,EACN,KAAK,EACL,MAAM,EACN,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,WAAW,GACZ,MAAM,WAAW,CAAC;AAEnB,OAAO,EACL,SAAS,EACT,WAAW,EACX,QAAQ,GACT,MAAM,SAAS,CAAC"}

package/dist/index.js

@@ -0,0 +1,115 @@
+// @bun
+// src/signals.ts
+class Signal {
+  _value;
+  _subscribers = new Set;
+  _derivedFrom = [];
+  constructor(initialValue) {
+    this._value = initialValue;
+  }
+  get() {
+    return this._value;
+  }
+  set(value) {
+    if (this._value !== value) {
+      this._value = value;
+      this._notify();
+    }
+  }
+  update(updater) {
+    this.set(updater(this._value));
+  }
+  subscribe(subscriber) {
+    this._subscribers.add(subscriber);
+    return () => this._subscribers.delete(subscriber);
+  }
+  map(fn) {
+    const computed = new Signal(fn(this._value));
+    this.subscribe((v) => computed.set(fn(v)));
+    return computed;
+  }
+  _notify() {
+    for (const subscriber of this._subscribers) {
+      subscriber(this._value);
+    }
+  }
+}
+function signal(initialValue) {
+  return new Signal(initialValue);
+}
+function computed(fn, deps) {
+  const computed2 = new Signal(fn());
+  const update = () => {
+    computed2.set(fn());
+  };
+  for (const dep of deps) {
+    dep.subscribe(update);
+  }
+  return computed2;
+}
+function atom(initialValue) {
+  return signal(initialValue);
+}
+function batch(fn) {
+  return fn();
+}
+
+class Store {
+  _state = new Map;
+  constructor(initialState) {
+    for (const [key, value] of Object.entries(initialState)) {
+      this._state.set(key, signal(value));
+    }
+  }
+  get(key) {
+    return this._state.get(key);
+  }
+  set(key, value) {
+    const s = this._state.get(key);
+    if (s) {
+      s.set(value);
+    } else {
+      this._state.set(key, signal(value));
+    }
+  }
+  getSnapshot() {
+    const snapshot = {};
+    for (const [key, sig] of this._state) {
+      snapshot[key] = sig.get();
+    }
+    return snapshot;
+  }
+}
+function createStore(initialState) {
+  return new Store(initialState);
+}
+// src/react.ts
+import { useSyncExternalStore, useCallback } from "react";
+function useSignal(signal2) {
+  return useSyncExternalStore(useCallback((callback) => signal2.subscribe(callback), [signal2]), () => signal2.get(), () => signal2.get());
+}
+function useStoreKey(store, key) {
+  const signal2 = store.get(key);
+  return useSignal(signal2);
+}
+function useStore(store) {
+  return useSyncExternalStore(useCallback((callback) => {
+    const unsubscribers = [];
+    for (const [key, sig] of store._state.entries()) {
+      unsubscribers.push(sig.subscribe(callback));
+    }
+    return () => unsubscribers.forEach((unsub) => unsub());
+  }, [store]), () => store.getSnapshot(), () => store.getSnapshot());
+}
+export {
+  useStoreKey,
+  useStore,
+  useSignal,
+  signal,
+  createStore,
+  computed,
+  batch,
+  atom,
+  Store,
+  Signal
+};

package/dist/react.d.ts

@@ -0,0 +1,52 @@
+/**
+ * @ereo/state - React Integration
+ *
+ * useSyncExternalStore wrappers for signals to ensure React Compiler compatibility.
+ */
+import type { Signal, Store } from './signals';
+/**
+ * Hook to use a signal value with React's useSyncExternalStore.
+ * This makes signals compatible with React Compiler.
+ *
+ * @example
+ * ```tsx
+ * const count = signal(0);
+ *
+ * function Counter() {
+ *   const value = useSignal(count);
+ *   return <button>{value}</button>;
+ * }
+ * ```
+ */
+export declare function useSignal<T>(signal: Signal<T>): T;
+/**
+ * Hook to use a single key from a store with React's useSyncExternalStore.
+ * Only re-renders when the specific key changes.
+ *
+ * @example
+ * ```tsx
+ * const store = createStore({ count: 0, name: 'test' });
+ *
+ * function Counter() {
+ *   const count = useStoreKey(store, 'count');
+ *   return <button>{count}</button>;
+ * }
+ * ```
+ */
+export declare function useStoreKey<T extends Record<string, unknown>, K extends keyof T>(store: Store<T>, key: K): T[K];
+/**
+ * Hook to use the entire store snapshot with React's useSyncExternalStore.
+ * Re-renders when any key in the store changes.
+ *
+ * @example
+ * ```tsx
+ * const store = createStore({ count: 0, name: 'test' });
+ *
+ * function App() {
+ *   const state = useStore(store);
+ *   return <div>{state.count} - {state.name}</div>;
+ * }
+ * ```
+ */
+export declare function useStore<T extends Record<string, unknown>>(store: Store<T>): T;
+//# sourceMappingURL=react.d.ts.map

package/dist/react.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"react.d.ts","sourceRoot":"","sources":["../src/react.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAGH,OAAO,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,WAAW,CAAC;AAE/C;;;;;;;;;;;;;GAaG;AACH,wBAAgB,SAAS,CAAC,CAAC,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,CAMjD;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,WAAW,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,CAAC,SAAS,MAAM,CAAC,EAC9E,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,EACf,GAAG,EAAE,CAAC,GACL,CAAC,CAAC,CAAC,CAAC,CAGN;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,QAAQ,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,CAY9E"}

package/dist/signals.d.ts

@@ -0,0 +1,48 @@
+/**
+ * @ereo/state - Signals and reactivity system
+ *
+ * Fine-grained reactivity for state management.
+ */
+/** Subscriber function */
+type Subscriber<T> = (value: T) => void;
+/** Signal with reactive value */
+export declare class Signal<T> {
+    private _value;
+    private _subscribers;
+    private _derivedFrom;
+    constructor(initialValue: T);
+    /** Get current value (subscribes in reactive context) */
+    get(): T;
+    /** Set new value (notifies subscribers) */
+    set(value: T): void;
+    /** Update value with function */
+    update(updater: (value: T) => T): void;
+    /** Subscribe to changes */
+    subscribe(subscriber: Subscriber<T>): () => void;
+    /** Create computed signal from this signal */
+    map<U>(fn: (value: T) => U): Signal<U>;
+    private _notify;
+}
+/** Create a new signal */
+export declare function signal<T>(initialValue: T): Signal<T>;
+/** Create a computed signal */
+export declare function computed<T>(fn: () => T, deps: Signal<unknown>[]): Signal<T>;
+/** Atom (alias for signal) */
+export declare function atom<T>(initialValue: T): Signal<T>;
+/** Batch multiple updates */
+export declare function batch<T>(fn: () => T): T;
+/** Store for global state */
+export declare class Store<T extends Record<string, unknown>> {
+    private _state;
+    constructor(initialState: T);
+    /** Get signal for key */
+    get<K extends keyof T>(key: K): Signal<T[K]>;
+    /** Set value for key */
+    set<K extends keyof T>(key: K, value: T[K]): void;
+    /** Get current snapshot of all values */
+    getSnapshot(): T;
+}
+/** Create a store */
+export declare function createStore<T extends Record<string, unknown>>(initialState: T): Store<T>;
+export {};
+//# sourceMappingURL=signals.d.ts.map

package/dist/signals.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"signals.d.ts","sourceRoot":"","sources":["../src/signals.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,0BAA0B;AAC1B,KAAK,UAAU,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;AAExC,iCAAiC;AACjC,qBAAa,MAAM,CAAC,CAAC;IACnB,OAAO,CAAC,MAAM,CAAI;IAClB,OAAO,CAAC,YAAY,CAAiC;IACrD,OAAO,CAAC,YAAY,CAAyB;gBAEjC,YAAY,EAAE,CAAC;IAI3B,yDAAyD;IACzD,GAAG,IAAI,CAAC;IAIR,2CAA2C;IAC3C,GAAG,CAAC,KAAK,EAAE,CAAC,GAAG,IAAI;IAOnB,iCAAiC;IACjC,MAAM,CAAC,OAAO,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,CAAC,GAAG,IAAI;IAItC,2BAA2B;IAC3B,SAAS,CAAC,UAAU,EAAE,UAAU,CAAC,CAAC,CAAC,GAAG,MAAM,IAAI;IAKhD,8CAA8C;IAC9C,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,CAAC,GAAG,MAAM,CAAC,CAAC,CAAC;IAMtC,OAAO,CAAC,OAAO;CAKhB;AAED,0BAA0B;AAC1B,wBAAgB,MAAM,CAAC,CAAC,EAAE,YAAY,EAAE,CAAC,GAAG,MAAM,CAAC,CAAC,CAAC,CAEpD;AAED,+BAA+B;AAC/B,wBAAgB,QAAQ,CAAC,CAAC,EAAE,EAAE,EAAE,MAAM,CAAC,EAAE,IAAI,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE,GAAG,MAAM,CAAC,CAAC,CAAC,CAY3E;AAED,8BAA8B;AAC9B,wBAAgB,IAAI,CAAC,CAAC,EAAE,YAAY,EAAE,CAAC,GAAG,MAAM,CAAC,CAAC,CAAC,CAElD;AAED,6BAA6B;AAC7B,wBAAgB,KAAK,CAAC,CAAC,EAAE,EAAE,EAAE,MAAM,CAAC,GAAG,CAAC,CAGvC;AAED,6BAA6B;AAC7B,qBAAa,KAAK,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IAElD,OAAO,CAAC,MAAM,CAAuC;gBAEzC,YAAY,EAAE,CAAC;IAM3B,yBAAyB;IACzB,GAAG,CAAC,CAAC,SAAS,MAAM,CAAC,EAAE,GAAG,EAAE,CAAC,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAI5C,wBAAwB;IACxB,GAAG,CAAC,CAAC,SAAS,MAAM,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI;IASjD,yCAAyC;IACzC,WAAW,IAAI,CAAC;CAOjB;AAED,qBAAqB;AACrB,wBAAgB,WAAW,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,YAAY,EAAE,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,CAExF"}

package/package.json

@@ -0,0 +1,46 @@
+{
+  "name": "@ereo/state",
+  "version": "0.1.6",
+  "license": "MIT",
+  "author": "Ereo Team",
+  "homepage": "https://ereo.dev",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/ereojs/ereo.git",
+    "directory": "packages/state"
+  },
+  "bugs": {
+    "url": "https://github.com/ereojs/ereo/issues"
+  },
+  "description": "Signals and reactivity system for EreoJS framework",
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "bun build ./src/index.ts --outdir ./dist --target bun --external @ereo/core --external react && bun run build:types",
+    "build:types": "tsc --emitDeclarationOnly --outDir dist",
+    "dev": "bun build ./src/index.ts --outdir ./dist --target bun --watch",
+    "test": "bun test",
+    "typecheck": "tsc --noEmit"
+  },
+  "dependencies": {
+    "@ereo/core": "workspace:*"
+  },
+  "peerDependencies": {
+    "react": "^18.0.0"
+  },
+  "devDependencies": {
+    "@types/bun": "^1.1.0",
+    "@types/react": "^18.2.0",
+    "typescript": "^5.4.0"
+  }
+}