stunk 0.9.0 → 1.0.1

package/README.md

@@ -1,9 +1,9 @@
 # Stunk
 
-- **Pronunciation**: _Stunk_ (A playful blend of "state" and "chunk")
-
 A lightweight, reactive state management library for TypeScript/JavaScript applications. Stunk combines atomic state management with powerful features like middleware, time travel, and async state handling.
 
+- **Pronunciation**: _Stunk_ (A playful blend of "state" and "chunk")
+
 **Stunk** is like dividing your jar into many smaller containers, each holding a single piece of state. These smaller containers are called **chunks**. Each **chunk** can be updated and accessed easily, and any part of your app can subscribe to changes in a chunk so it gets updated automatically.
 
 ## Features
@@ -12,7 +12,7 @@ A lightweight, reactive state management library for TypeScript/JavaScript appli
 - 🔄 **Reactive**: Automatic updates when state changes
 - 📦 **Batch Updates**: Group multiple state updates together
 - 🎯 **Atomic State Management**: Break down state into manageable chunks
-- 🎭 **State Selection**: Select and derive specific parts of state
+- 🎭 **State Selection**: Select and derive specific parts of the state
 - 🔄 **Async Support**: Handle async state with built-in loading and error states
 - 🔌 **Middleware Support**: Extend functionality with custom middleware
 - ⏱️ **Time Travel**: Undo/redo state changes
@@ -24,6 +24,8 @@ A lightweight, reactive state management library for TypeScript/JavaScript appli
 npm install stunk
 # or
 yarn add stunk
+# or
+pnpm install stunk
 ```
 
 ## Basic Usage

package/dist/core/computed.js

@@ -0,0 +1,63 @@
+import { isChunk } from "../utils";
+import { chunk } from "./core";
+export function computed(computeFn) {
+    // Track the currently executing computed function
+    let currentComputation = null;
+    // Set to track dependencies
+    const dependencies = new Set();
+    const trackingProxy = new Proxy({}, {
+        get(_, prop) {
+            if (currentComputation && prop === 'value') {
+                const chunkValue = this[prop];
+                if (isChunk(chunkValue)) {
+                    dependencies.add(chunkValue);
+                    return chunkValue.get();
+                }
+            }
+            return this[prop];
+        },
+    });
+    // Initial computation
+    let cachedValue;
+    let isDirty = true;
+    const computeValue = () => {
+        if (!isDirty)
+            return cachedValue;
+        // Reset dependencies
+        dependencies.clear();
+        // Set the current computation context
+        currentComputation = computeFn;
+        try {
+            // Compute with tracking
+            cachedValue = computeFn.call(trackingProxy);
+            isDirty = false;
+        }
+        finally {
+            // Clear the current computation context
+            currentComputation = null;
+        }
+        return cachedValue;
+    };
+    // Create the computed chunk
+    const computedChunk = chunk(computeValue());
+    // Subscribe to all detected dependencies
+    dependencies.forEach(dep => {
+        dep.subscribe(() => {
+            isDirty = true;
+            computedChunk.set(computeValue());
+        });
+    });
+    return {
+        ...computedChunk,
+        get: () => {
+            if (isDirty) {
+                return computeValue();
+            }
+            return cachedValue;
+        },
+        // Prevent direct setting
+        set: () => {
+            throw new Error('Cannot directly set a computed value');
+        }
+    };
+}

package/dist/core/core.js

@@ -1,3 +1,4 @@
+import { processMiddleware } from "../utils";
 let batchDepth = 0;
 const batchQueue = new Set();
 export function batch(callback) {
@@ -43,7 +44,6 @@ export function chunk(initialValue, middleware = []) {
     let value = initialValue;
     const subscribers = new Set();
     let isDirty = false;
-    const get = () => value;
     const notifySubscribers = () => {
         if (batchDepth > 0) {
             if (!isDirty) {
@@ -60,30 +60,22 @@ export function chunk(initialValue, middleware = []) {
             subscribers.forEach((subscriber) => subscriber(value));
         }
     };
+    const get = () => value;
     const set = (newValue) => {
-        if (newValue === null || newValue === undefined) {
-            throw new Error("Value cannot be null or undefined.");
+        const processedValue = processMiddleware(newValue, middleware);
+        if (processedValue !== value) {
+            value = processedValue;
+            notifySubscribers();
         }
-        let currentValue = newValue;
-        let index = 0;
-        while (index < middleware.length) {
-            const currentMiddleware = middleware[index];
-            let nextCalled = false;
-            let nextValue = null;
-            currentMiddleware(currentValue, (val) => {
-                nextCalled = true;
-                nextValue = val;
-            });
-            if (!nextCalled)
-                break;
-            if (nextValue === null || nextValue === undefined) {
-                throw new Error("Value cannot be null or undefined.");
-            }
-            currentValue = nextValue;
-            index++;
+    };
+    const update = (updater) => {
+        if (typeof updater !== 'function') {
+            throw new Error("Updater must be a function");
         }
-        if (currentValue !== value) {
-            value = currentValue;
+        const newValue = updater(value);
+        const processedValue = processMiddleware(newValue);
+        if (processedValue !== value) {
+            value = processedValue;
             notifySubscribers();
         }
     };
@@ -96,9 +88,7 @@ export function chunk(initialValue, middleware = []) {
         }
         subscribers.add(callback);
         callback(value);
-        return () => {
-            subscribers.delete(callback);
-        };
+        return () => subscribers.delete(callback);
     };
     const reset = () => {
         value = initialValue;
@@ -124,5 +114,5 @@ export function chunk(initialValue, middleware = []) {
         });
         return derivedChunk;
     };
-    return { get, set, subscribe, derive, reset, destroy };
+    return { get, set, update, subscribe, derive, reset, destroy };
 }

package/dist/index.js

@@ -1,2 +1,4 @@
-export { chunk } from './core/core';
+export { chunk, batch, select } from './core/core';
+export { asyncChunk } from './core/asyncChunk';
+export { computed } from './core/computed';
 export * from "./middleware";

package/dist/utils.js

@@ -2,6 +2,16 @@ import { chunk } from "./core/core";
 export function isValidChunkValue(value) {
     return value !== null && value !== undefined;
 }
+export function isChunk(value) {
+    return value &&
+        typeof value.get === 'function' &&
+        typeof value.set === 'function' &&
+        typeof value.update === 'function' &&
+        typeof value.subscribe === 'function' &&
+        typeof value.derive === 'function' &&
+        typeof value.reset === 'function' &&
+        typeof value.destroy === 'function';
+}
 export function combineAsyncChunks(chunks) {
     // Create initial state with proper typing
     const initialData = Object.keys(chunks).reduce((acc, key) => {
@@ -31,3 +41,27 @@ export function combineAsyncChunks(chunks) {
     });
     return combined;
 }
+export function processMiddleware(initialValue, middleware = []) {
+    if (initialValue === null || initialValue === undefined) {
+        throw new Error("Value cannot be null or undefined.");
+    }
+    let currentValue = initialValue;
+    let index = 0;
+    while (index < middleware.length) {
+        const currentMiddleware = middleware[index];
+        let nextCalled = false;
+        let nextValue = null;
+        currentMiddleware(currentValue, (val) => {
+            nextCalled = true;
+            nextValue = val;
+        });
+        if (!nextCalled)
+            break;
+        if (nextValue === null || nextValue === undefined) {
+            throw new Error("Value cannot be null or undefined.");
+        }
+        currentValue = nextValue;
+        index++;
+    }
+    return currentValue;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "stunk",
-  "version": "0.9.0",
+  "version": "1.0.1",
   "description": "Stunk - A framework-agnostic state management library implementing the Atomic State technique, utilizing chunk-based units for efficient state management.",
   "main": "dist/index.js",
   "types": "dist/types/index.d.ts",

package/src/core/computed.ts

@@ -0,0 +1,75 @@
+import { isChunk } from "../utils";
+import { chunk, Chunk } from "./core";
+
+export function computed<T>(computeFn: () => T): Chunk<T> {
+  // Track the currently executing computed function
+  let currentComputation: (() => T) | null = null;
+
+  // Set to track dependencies
+  const dependencies = new Set<Chunk<any>>();
+
+  const trackingProxy = new Proxy({}, {
+    get(_, prop) {
+      if (currentComputation && prop === 'value') {
+        const chunkValue = (this as any)[prop];
+        if (isChunk(chunkValue)) {
+          dependencies.add(chunkValue);
+          return chunkValue.get();
+        }
+      }
+      return (this as any)[prop];
+    },
+  });
+
+  // Initial computation
+  let cachedValue: T;
+  let isDirty = true;
+
+  const computeValue = () => {
+    if (!isDirty) return cachedValue
+
+    // Reset dependencies
+    dependencies.clear();
+
+    // Set the current computation context
+    currentComputation = computeFn;
+
+
+    try {
+      // Compute with tracking
+      cachedValue = computeFn.call(trackingProxy);
+      isDirty = false;
+    } finally {
+      // Clear the current computation context
+      currentComputation = null;
+    }
+    return cachedValue;
+
+  }
+
+  // Create the computed chunk
+  const computedChunk = chunk(computeValue());
+
+  // Subscribe to all detected dependencies
+  dependencies.forEach(dep => {
+    dep.subscribe(() => {
+      isDirty = true;
+      computedChunk.set(computeValue());
+    });
+  });
+
+  return {
+    ...computedChunk,
+    get: () => {
+      if (isDirty) {
+        return computeValue();
+      }
+      return cachedValue;
+    },
+    // Prevent direct setting
+    set: () => {
+      throw new Error('Cannot directly set a computed value');
+    }
+  };
+
+}

package/src/core/core.ts

@@ -1,3 +1,5 @@
+import { processMiddleware } from "../utils";
+
 export type Subscriber<T> = (newValue: T) => void;
 export type Middleware<T> = (value: T, next: (newValue: T) => void) => void;
 
@@ -6,6 +8,8 @@ export interface Chunk<T> {
   get: () => T;
   /** Set a new value for the chunk. */
   set: (value: T) => void;
+  /** Update existing value efficiently */
+  update: (updater: (currentValue: T) => T) => void;
   /** Subscribe to changes in the chunk. Returns an unsubscribe function. */
   subscribe: (callback: Subscriber<T>) => () => void;
   /** Create a derived chunk based on this chunk's value. */
@@ -33,7 +37,6 @@ export function batch(callback: () => void) {
   }
 }
 
-
 export function select<T, S>(sourceChunk: Chunk<T>, selector: (value: T) => S): Chunk<S> {
   const initialValue = selector(sourceChunk.get());
   const selectedChunk = chunk(initialValue);
@@ -69,8 +72,6 @@ export function chunk<T>(initialValue: T, middleware: Middleware<T>[] = []): Chu
   const subscribers = new Set<Subscriber<T>>();
   let isDirty = false;
 
-  const get = () => value;
-
   const notifySubscribers = () => {
     if (batchDepth > 0) {
       if (!isDirty) {
@@ -87,36 +88,27 @@ export function chunk<T>(initialValue: T, middleware: Middleware<T>[] = []): Chu
     }
   }
 
-  const set = (newValue: T) => {
-    if (newValue === null || newValue === undefined) {
-      throw new Error("Value cannot be null or undefined.");
-    }
-
-    let currentValue = newValue;
-    let index = 0;
-
-    while (index < middleware.length) {
-      const currentMiddleware = middleware[index];
-      let nextCalled = false;
-      let nextValue: T | null = null;
-
-      currentMiddleware(currentValue, (val) => {
-        nextCalled = true;
-        nextValue = val;
-      });
+  const get = () => value;
 
-      if (!nextCalled) break;
+  const set = (newValue: T) => {
+    const processedValue = processMiddleware(newValue, middleware);
 
-      if (nextValue === null || nextValue === undefined) {
-        throw new Error("Value cannot be null or undefined.");
-      }
+    if (processedValue !== value) {
+      value = processedValue as T & {};
+      notifySubscribers();
+    }
+  };
 
-      currentValue = nextValue;
-      index++;
+  const update = (updater: (currentValue: T) => T) => {
+    if (typeof updater !== 'function') {
+      throw new Error("Updater must be a function");
     }
 
-    if (currentValue !== value) {
-      value = currentValue;
+    const newValue = updater(value);
+    const processedValue = processMiddleware(newValue);
+
+    if (processedValue !== value) {
+      value = processedValue as T & {};
       notifySubscribers();
     }
   };
@@ -131,9 +123,7 @@ export function chunk<T>(initialValue: T, middleware: Middleware<T>[] = []): Chu
     subscribers.add(callback);
     callback(value);
 
-    return () => {
-      subscribers.delete(callback);
-    };
+    return () => subscribers.delete(callback);
   };
 
   const reset = () => {
@@ -166,5 +156,5 @@ export function chunk<T>(initialValue: T, middleware: Middleware<T>[] = []): Chu
     return derivedChunk;
   };
 
-  return { get, set, subscribe, derive, reset, destroy };
+  return { get, set, update, subscribe, derive, reset, destroy };
 }

package/src/index.ts

@@ -1,4 +1,6 @@
-export { chunk } from './core/core';
-export type { Chunk } from './core/core';
+export { chunk, batch, select } from './core/core';
+export { asyncChunk } from './core/asyncChunk'
+export { computed } from './core/computed'
+export type { Chunk, Middleware } from './core/core';
 
 export * from "./middleware";

package/src/utils.ts

@@ -1,4 +1,4 @@
-import { chunk, Chunk } from "./core/core";
+import { chunk, Chunk, Middleware } from "./core/core";
 
 import { AsyncChunk } from "./core/asyncChunk";
 import { CombinedData, CombinedState, InferAsyncData } from "./core/types";
@@ -7,6 +7,17 @@ export function isValidChunkValue(value: any): boolean {
   return value !== null && value !== undefined;
 }
 
+export function isChunk<T>(value: any): value is Chunk<T> {
+  return value &&
+    typeof value.get === 'function' &&
+    typeof value.set === 'function' &&
+    typeof value.update === 'function' &&
+    typeof value.subscribe === 'function' &&
+    typeof value.derive === 'function' &&
+    typeof value.reset === 'function' &&
+    typeof value.destroy === 'function';
+}
+
 export function combineAsyncChunks<T extends Record<string, AsyncChunk<any>>>(
   chunks: T
 ): Chunk<{
@@ -47,3 +58,34 @@ export function combineAsyncChunks<T extends Record<string, AsyncChunk<any>>>(
 
   return combined;
 }
+
+export function processMiddleware<T>(initialValue: T, middleware: Middleware<T>[] = []): T {
+  if (initialValue === null || initialValue === undefined) {
+    throw new Error("Value cannot be null or undefined.");
+  }
+
+  let currentValue = initialValue;
+  let index = 0;
+
+  while (index < middleware.length) {
+    const currentMiddleware = middleware[index];
+    let nextCalled = false;
+    let nextValue: T | null = null;
+
+    currentMiddleware(currentValue, (val) => {
+      nextCalled = true;
+      nextValue = val;
+    });
+
+    if (!nextCalled) break;
+
+    if (nextValue === null || nextValue === undefined) {
+      throw new Error("Value cannot be null or undefined.");
+    }
+
+    currentValue = nextValue;
+    index++;
+  }
+
+  return currentValue;
+}

package/tests/update.test.ts

@@ -0,0 +1,70 @@
+import { chunk } from '../src/core/core';
+
+describe('chunk update', () => {
+  it('should update value using updater function', () => {
+    const store = chunk(5);
+    store.update(value => value + 1);
+    expect(store.get()).toBe(6);
+  });
+
+  it('should throw error if updater is not a function', () => {
+    const store = chunk(5);
+    // @ts-expect-error Testing invalid input
+    expect(() => store.update('not a function')).toThrow('Updater must be a function');
+  });
+
+  it('should throw error if updater returns null or undefined', () => {
+    const store = chunk(5);
+    // @ts-expect-error Testing invalid input
+    expect(() => store.update(() => null)).toThrow('Value cannot be null or undefined.');
+    // @ts-expect-error Testing invalid input
+    expect(() => store.update(() => undefined)).toThrow('Value cannot be null or undefined.');
+  });
+
+  it('should notify subscribers only if value changes', () => {
+    const store = chunk(5);
+    const subscriber = jest.fn();
+    store.subscribe(subscriber);
+
+    // Reset the mock to ignore initial subscription call
+    subscriber.mockReset();
+
+    // Update to same value
+    store.update(value => value);
+    expect(subscriber).not.toHaveBeenCalled();
+
+    // Update to new value
+    store.update(value => value + 1);
+    expect(subscriber).toHaveBeenCalledWith(6);
+    expect(subscriber).toHaveBeenCalledTimes(1);
+  });
+
+  it('should handle complex update logic', () => {
+    const store = chunk(5);
+    store.update(value => {
+      if (value > 3) {
+        return value * 2;
+      }
+      return value + 1;
+    });
+    expect(store.get()).toBe(10);
+  });
+
+  it('should maintain type safety', () => {
+    interface User {
+      name: string;
+      age: number;
+    }
+
+    const store = chunk<User>({ name: 'John', age: 30 });
+
+    store.update(user => ({
+      ...user,
+      age: user.age + 1
+    }));
+
+    const user = store.get();
+    expect(user.age).toBe(31);
+    expect(user.name).toBe('John');
+  });
+});