@dvashim/store 1.1.3 → 1.2.0

package/README.md

@@ -0,0 +1,196 @@
+# @dvashim/store
+
+[![npm version](https://img.shields.io/npm/v/@dvashim/store.svg?logo=npm&style=flat-square&color2=07c&label=@dvashim/store)](https://www.npmjs.com/package/@dvashim/store) [![npm downloads](https://img.shields.io/npm/dm/@dvashim/store?logo=npm&style=flat-square&color=07c)](https://www.npmjs.com/package/@dvashim/store) [![Checked with Biome](https://img.shields.io/badge/Checked_with-Biome-60a5fa?style=flat-square&logo=biome&color=07c&logoColor=fff)](https://biomejs.dev)
+
+A minimal, lightweight React state management library built on `useSyncExternalStore`.
+
+## Install
+
+```bash
+npm install @dvashim/store
+# or
+pnpm add @dvashim/store
+```
+
+**Peer dependencies:** `react >= 18`
+
+## Quick Start
+
+```tsx
+import { createStore, useStore } from '@dvashim/store'
+
+const count$ = createStore(0)
+
+function Counter() {
+  const count = useStore(count$)
+
+  return (
+    <button onClick={() => count$.update((n) => n + 1)}>
+      Count: {count}
+    </button>
+  )
+}
+```
+
+## API
+
+### `createStore(initialState?)`
+
+Creates a new `Store` instance.
+
+```ts
+const count$ = createStore(0)
+const user$ = createStore({ name: 'Alice', age: 30 })
+
+// Without initial state — type defaults to T | undefined
+const data$ = createStore<string>()
+```
+
+### `Store`
+
+Reactive state container with subscription-based change notification.
+
+#### `store.get()`
+
+Returns the current state.
+
+```ts
+const count$ = createStore(10)
+count$.get() // 10
+```
+
+#### `store.set(state, options?)`
+
+Replaces the state. Skipped if the value is identical (`Object.is`), unless `{ force: true }` is passed.
+
+```ts
+count$.set(5)
+
+// Force notify subscribers even if the value hasn't changed
+count$.set(5, { force: true })
+```
+
+#### `store.update(updater, options?)`
+
+Derives the next state via an updater function. Re-entrant calls from within a subscriber are queued and flushed in FIFO order.
+
+```ts
+count$.update((n) => n + 1)
+
+// With objects — always return a new reference
+const todos$ = createStore([{ text: 'Buy milk', done: false }])
+todos$.update((todos) => [...todos, { text: 'Walk dog', done: false }])
+```
+
+#### `store.subscribe(fn)`
+
+Registers a callback invoked on each state change. Returns an unsubscribe function.
+
+```ts
+const unsubscribe = count$.subscribe(() => {
+  console.log('Count changed:', count$.get())
+})
+
+// Later...
+unsubscribe()
+```
+
+### `useStore(store, selector?)`
+
+React hook that subscribes a component to a store.
+
+```tsx
+function Counter() {
+  const count = useStore(count$)
+  return <p>{count}</p>
+}
+```
+
+#### With a selector
+
+Derive a value from the store state. The selector should return a referentially stable value (primitive or existing object reference) to avoid unnecessary re-renders.
+
+```tsx
+const user$ = createStore({ name: 'Alice', age: 30 })
+
+function UserName() {
+  const name = useStore(user$, (user) => user.name)
+  return <p>{name}</p>
+}
+```
+
+## Patterns
+
+### Shared stores across components
+
+Define stores outside of components and import them where needed.
+
+```ts
+// stores/auth.ts
+import { createStore } from '@dvashim/store'
+
+export const token$ = createStore<string | null>(null)
+
+export function login(token: string) {
+  token$.set(token)
+}
+
+export function logout() {
+  token$.set(null)
+}
+```
+
+```tsx
+// components/Profile.tsx
+import { useStore } from '@dvashim/store'
+import { token$, logout } from '../stores/auth'
+
+function Profile() {
+  const token = useStore(token$)
+
+  if (!token) return <p>Not logged in</p>
+
+  return <button onClick={logout}>Log out</button>
+}
+```
+
+### Combining multiple stores
+
+```tsx
+import { createStore, useStore } from '@dvashim/store'
+
+const firstName$ = createStore('Alice')
+const lastName$ = createStore('Smith')
+
+function FullName() {
+  const firstName = useStore(firstName$)
+  const lastName = useStore(lastName$)
+
+  return <p>{firstName} {lastName}</p>
+}
+```
+
+### Using the Store class directly
+
+```ts
+import { Store } from '@dvashim/store'
+
+class TimerService {
+  readonly seconds$ = new Store(0)
+  #interval: ReturnType<typeof setInterval> | undefined
+
+  start() {
+    this.#interval = setInterval(() => {
+      this.seconds$.update((s) => s + 1)
+    }, 1000)
+  }
+
+  stop() {
+    clearInterval(this.#interval)
+  }
+}
+```
+
+## License
+
+MIT

package/dist/Store.d.ts

@@ -3,14 +3,35 @@ type Updater<T> = (prevValue: T) => T;
 type UpdateOptions = {
     force?: boolean;
 };
+/**
+ * Reactive state container with subscription-based change notification.
+ * @typeParam T - The type of the stored state.
+ */
 export declare class Store<T> {
     #private;
     constructor(initialState: T);
-    get state(): T;
-    get(): T;
-    set(state: T, options?: UpdateOptions): boolean;
-    update(updater: Updater<T>, options?: UpdateOptions): boolean;
+    /**
+     * Registers a subscriber that is called whenever the state changes.
+     * @param fn - Callback invoked on each state change.
+     * @returns An unsubscribe function that removes the subscriber.
+     */
     subscribe(fn: Subscriber): () => void;
+    /** Returns the current state. */
+    get(): T;
+    /**
+     * Replaces the state and notifies subscribers.
+     * Skipped if the value is identical (`Object.is`), unless `force` is set.
+     * @param state - The new state value.
+     * @param options - Pass `{ force: true }` to notify even when unchanged.
+     */
+    set(state: T, options?: UpdateOptions): void;
+    /**
+     * Derives the next state via an updater function and notifies subscribers.
+     * Re-entrant calls from within a subscriber are queued and flushed in FIFO order.
+     * @param updater - Receives the current state and returns the next state.
+     * @param options - Pass `{ force: true }` to notify even when unchanged.
+     */
+    update(updater: Updater<T>, options?: UpdateOptions): void;
 }
 export {};
 //# sourceMappingURL=Store.d.ts.map

package/dist/Store.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Store.d.ts","sourceRoot":"","sources":["../src/Store.ts"],"names":[],"mappings":"AAAA,KAAK,UAAU,GAAG,MAAM,IAAI,CAAA;AAC5B,KAAK,OAAO,CAAC,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC,KAAK,CAAC,CAAA;AACrC,KAAK,aAAa,GAAG;IAAE,KAAK,CAAC,EAAE,OAAO,CAAA;CAAE,CAAA;AAExC,qBAAa,KAAK,CAAC,CAAC;;gBAIN,YAAY,EAAE,CAAC;IAI3B,IAAI,KAAK,MAER;IAED,GAAG,IAAI,CAAC;IAIR,GAAG,CAAC,KAAK,EAAE,CAAC,EAAE,OAAO,CAAC,EAAE,aAAa,GAAG,OAAO;IAI/C,MAAM,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,EAAE,OAAO,CAAC,EAAE,aAAa,GAAG,OAAO;IAI7D,SAAS,CAAC,EAAE,EAAE,UAAU,GAAG,MAAM,IAAI;CAqBtC"}
+{"version":3,"file":"Store.d.ts","sourceRoot":"","sources":["../src/Store.ts"],"names":[],"mappings":"AAAA,KAAK,UAAU,GAAG,MAAM,IAAI,CAAA;AAC5B,KAAK,OAAO,CAAC,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC,KAAK,CAAC,CAAA;AACrC,KAAK,aAAa,GAAG;IAAE,KAAK,CAAC,EAAE,OAAO,CAAA;CAAE,CAAA;AAMxC;;;GAGG;AACH,qBAAa,KAAK,CAAC,CAAC;;gBAMN,YAAY,EAAE,CAAC;IAI3B;;;;OAIG;IACH,SAAS,CAAC,EAAE,EAAE,UAAU,GAAG,MAAM,IAAI;IAKrC,iCAAiC;IACjC,GAAG,IAAI,CAAC;IAIR;;;;;OAKG;IACH,GAAG,CAAC,KAAK,EAAE,CAAC,EAAE,OAAO,CAAC,EAAE,aAAa;IAKrC;;;;;OAKG;IACH,MAAM,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,EAAE,OAAO,CAAC,EAAE,aAAa;CA0CpD"}

package/dist/Store.js

@@ -1,37 +1,82 @@
+/**
+ * Reactive state container with subscription-based change notification.
+ * @typeParam T - The type of the stored state.
+ */
 export class Store {
     #subscribers = new Set();
+    #queue = [];
+    #notifying = false;
     #state;
     constructor(initialState) {
         this.#state = initialState;
     }
-    get state() {
-        return this.#state;
+    /**
+     * Registers a subscriber that is called whenever the state changes.
+     * @param fn - Callback invoked on each state change.
+     * @returns An unsubscribe function that removes the subscriber.
+     */
+    subscribe(fn) {
+        this.#subscribers.add(fn);
+        return () => this.#subscribers.delete(fn);
     }
+    /** Returns the current state. */
     get() {
         return this.#state;
     }
+    /**
+     * Replaces the state and notifies subscribers.
+     * Skipped if the value is identical (`Object.is`), unless `force` is set.
+     * @param state - The new state value.
+     * @param options - Pass `{ force: true }` to notify even when unchanged.
+     */
     set(state, options) {
-        return this.#notify(state, options);
+        this.#queue.push({ updater: () => state, options });
+        return this.#flush();
     }
+    /**
+     * Derives the next state via an updater function and notifies subscribers.
+     * Re-entrant calls from within a subscriber are queued and flushed in FIFO order.
+     * @param updater - Receives the current state and returns the next state.
+     * @param options - Pass `{ force: true }` to notify even when unchanged.
+     */
     update(updater, options) {
-        return this.#notify(updater(this.#state), options);
+        this.#queue.push({ updater, options });
+        return this.#flush();
     }
-    subscribe(fn) {
-        this.#subscribers.add(fn);
-        return () => this.#subscribers.delete(fn);
+    #flush() {
+        if (this.#notifying) {
+            return;
+        }
+        this.#notifying = true;
+        try {
+            let q = this.#queue.shift();
+            while (q) {
+                const state = q.updater(this.#state);
+                this.#commit(state, q.options);
+                q = this.#queue.shift();
+            }
+        }
+        catch (error) {
+            this.#queue.length = 0;
+            throw error;
+        }
+        finally {
+            this.#notifying = false;
+        }
     }
-    /**
-     * @returns `true` if listeners were notified
-     */
-    #notify(nextState, options) {
+    #commit(nextState, options) {
         if (!options?.force && Object.is(nextState, this.#state)) {
-            return false;
+            return;
         }
         this.#state = nextState;
         for (const listener of [...this.#subscribers]) {
-            listener();
+            try {
+                listener();
+            }
+            catch (error) {
+                console.error('Error in subscriber', error);
+            }
         }
-        return true;
     }
 }
 //# sourceMappingURL=Store.js.map

package/dist/Store.js.map

@@ -1 +1 @@
-{"version":3,"file":"Store.js","sourceRoot":"","sources":["../src/Store.ts"],"names":[],"mappings":"AAIA,MAAM,OAAO,KAAK;IACP,YAAY,GAAG,IAAI,GAAG,EAAc,CAAA;IAC7C,MAAM,CAAG;IAET,YAAY,YAAe;QACzB,IAAI,CAAC,MAAM,GAAG,YAAY,CAAA;IAC5B,CAAC;IAED,IAAI,KAAK;QACP,OAAO,IAAI,CAAC,MAAM,CAAA;IACpB,CAAC;IAED,GAAG;QACD,OAAO,IAAI,CAAC,MAAM,CAAA;IACpB,CAAC;IAED,GAAG,CAAC,KAAQ,EAAE,OAAuB;QACnC,OAAO,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,OAAO,CAAC,CAAA;IACrC,CAAC;IAED,MAAM,CAAC,OAAmB,EAAE,OAAuB;QACjD,OAAO,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,OAAO,CAAC,CAAA;IACpD,CAAC;IAED,SAAS,CAAC,EAAc;QACtB,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,EAAE,CAAC,CAAA;QACzB,OAAO,GAAG,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,EAAE,CAAC,CAAA;IAC3C,CAAC;IAED;;OAEG;IACH,OAAO,CAAC,SAAY,EAAE,OAAuB;QAC3C,IAAI,CAAC,OAAO,EAAE,KAAK,IAAI,MAAM,CAAC,EAAE,CAAC,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC;YACzD,OAAO,KAAK,CAAA;QACd,CAAC;QAED,IAAI,CAAC,MAAM,GAAG,SAAS,CAAA;QAEvB,KAAK,MAAM,QAAQ,IAAI,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,EAAE,CAAC;YAC9C,QAAQ,EAAE,CAAA;QACZ,CAAC;QAED,OAAO,IAAI,CAAA;IACb,CAAC;CACF"}
+{"version":3,"file":"Store.js","sourceRoot":"","sources":["../src/Store.ts"],"names":[],"mappings":"AAQA;;;GAGG;AACH,MAAM,OAAO,KAAK;IACP,YAAY,GAAG,IAAI,GAAG,EAAc,CAAA;IACpC,MAAM,GAAmB,EAAE,CAAA;IACpC,UAAU,GAAG,KAAK,CAAA;IAClB,MAAM,CAAG;IAET,YAAY,YAAe;QACzB,IAAI,CAAC,MAAM,GAAG,YAAY,CAAA;IAC5B,CAAC;IAED;;;;OAIG;IACH,SAAS,CAAC,EAAc;QACtB,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,EAAE,CAAC,CAAA;QACzB,OAAO,GAAG,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,EAAE,CAAC,CAAA;IAC3C,CAAC;IAED,iCAAiC;IACjC,GAAG;QACD,OAAO,IAAI,CAAC,MAAM,CAAA;IACpB,CAAC;IAED;;;;;OAKG;IACH,GAAG,CAAC,KAAQ,EAAE,OAAuB;QACnC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,EAAE,OAAO,EAAE,CAAC,CAAA;QACnD,OAAO,IAAI,CAAC,MAAM,EAAE,CAAA;IACtB,CAAC;IAED;;;;;OAKG;IACH,MAAM,CAAC,OAAmB,EAAE,OAAuB;QACjD,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC,CAAA;QACtC,OAAO,IAAI,CAAC,MAAM,EAAE,CAAA;IACtB,CAAC;IAED,MAAM;QACJ,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;YACpB,OAAM;QACR,CAAC;QAED,IAAI,CAAC,UAAU,GAAG,IAAI,CAAA;QAEtB,IAAI,CAAC;YACH,IAAI,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,CAAA;YAC3B,OAAO,CAAC,EAAE,CAAC;gBACT,MAAM,KAAK,GAAG,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,CAAA;gBACpC,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC,CAAC,OAAO,CAAC,CAAA;gBAC9B,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,CAAA;YACzB,CAAC;QACH,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACf,IAAI,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,CAAA;YACtB,MAAM,KAAK,CAAA;QACb,CAAC;gBAAS,CAAC;YACT,IAAI,CAAC,UAAU,GAAG,KAAK,CAAA;QACzB,CAAC;IACH,CAAC;IAED,OAAO,CAAC,SAAY,EAAE,OAAuB;QAC3C,IAAI,CAAC,OAAO,EAAE,KAAK,IAAI,MAAM,CAAC,EAAE,CAAC,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC;YACzD,OAAM;QACR,CAAC;QAED,IAAI,CAAC,MAAM,GAAG,SAAS,CAAA;QAEvB,KAAK,MAAM,QAAQ,IAAI,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,EAAE,CAAC;YAC9C,IAAI,CAAC;gBACH,QAAQ,EAAE,CAAA;YACZ,CAAC;YAAC,OAAO,KAAK,EAAE,CAAC;gBACf,OAAO,CAAC,KAAK,CAAC,qBAAqB,EAAE,KAAK,CAAC,CAAA;YAC7C,CAAC;QACH,CAAC;IACH,CAAC;CACF"}

package/dist/createStore.d.ts

@@ -1,5 +1,5 @@
 import { Store } from './Store';
-declare function createStore<T>(state: T): Store<T>;
 declare function createStore<T = undefined>(): Store<T | undefined>;
+declare function createStore<T>(state: T): Store<T>;
 export { createStore };
 //# sourceMappingURL=createStore.d.ts.map

package/dist/createStore.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createStore.d.ts","sourceRoot":"","sources":["../src/createStore.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAE/B,iBAAS,WAAW,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,CAAA;AAC3C,iBAAS,WAAW,CAAC,CAAC,GAAG,SAAS,KAAK,KAAK,CAAC,CAAC,GAAG,SAAS,CAAC,CAAA;AAK3D,OAAO,EAAE,WAAW,EAAE,CAAA"}
+{"version":3,"file":"createStore.d.ts","sourceRoot":"","sources":["../src/createStore.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAE/B,iBAAS,WAAW,CAAC,CAAC,GAAG,SAAS,KAAK,KAAK,CAAC,CAAC,GAAG,SAAS,CAAC,CAAA;AAC3D,iBAAS,WAAW,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,CAAA;AAK3C,OAAO,EAAE,WAAW,EAAE,CAAA"}

package/dist/createStore.js.map

@@ -1 +1 @@
-{"version":3,"file":"createStore.js","sourceRoot":"","sources":["../src/createStore.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAI/B,SAAS,WAAW,CAAI,KAAqB;IAC3C,OAAO,IAAI,KAAK,CAAC,KAAK,CAAC,CAAA;AACzB,CAAC;AAED,OAAO,EAAE,WAAW,EAAE,CAAA"}
+{"version":3,"file":"createStore.js","sourceRoot":"","sources":["../src/createStore.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAI/B,SAAS,WAAW,CAAI,KAAS;IAC/B,OAAO,IAAI,KAAK,CAAC,KAAK,CAAC,CAAA;AACzB,CAAC;AAED,OAAO,EAAE,WAAW,EAAE,CAAA"}

package/dist/useStore.d.ts

@@ -1,6 +1,25 @@
 import type { Store } from './Store';
 type Selector<T, U> = (state: T) => U;
+/**
+ * Subscribes a React component to a {@link Store} and returns its current state.
+ *
+ * @param store - The store to subscribe to.
+ * @returns The current state of the store.
+ */
 declare function useStore<T>(store: Store<T>): T;
+/**
+ * Subscribes a React component to a {@link Store} and returns a derived value
+ * computed by the selector.
+ *
+ * The selector should return a referentially stable value (e.g. a primitive or
+ * an existing object reference) to avoid unnecessary re-renders, since snapshots
+ * are compared with `Object.is`.
+ *
+ * @param store - The store to subscribe to.
+ * @param selector - A function that derives a value from the store state.
+ * @returns The value returned by the selector.
+ */
 declare function useStore<T, U>(store: Store<T>, selector: Selector<T, U>): U;
 export { useStore };
+export type { Selector };
 //# sourceMappingURL=useStore.d.ts.map

package/dist/useStore.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useStore.d.ts","sourceRoot":"","sources":["../src/useStore.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAEpC,KAAK,QAAQ,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,KAAK,CAAC,CAAA;AAErC,iBAAS,QAAQ,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,CAAA;AACxC,iBAAS,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAA;AAkBrE,OAAO,EAAE,QAAQ,EAAE,CAAA"}
+{"version":3,"file":"useStore.d.ts","sourceRoot":"","sources":["../src/useStore.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAEpC,KAAK,QAAQ,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,KAAK,CAAC,CAAA;AAErC;;;;;GAKG;AACH,iBAAS,QAAQ,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,CAAA;AAExC;;;;;;;;;;;GAWG;AACH,iBAAS,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAA;AA0BrE,OAAO,EAAE,QAAQ,EAAE,CAAA;AACnB,YAAY,EAAE,QAAQ,EAAE,CAAA"}

package/dist/useStore.js

@@ -1,13 +1,13 @@
-import { useDebugValue, useMemo, useSyncExternalStore } from 'react';
+import { useDebugValue, useMemo, useRef, useSyncExternalStore } from 'react';
 function useStore(store, selector) {
-    const value = useSyncExternalStore(...useMemo(() => {
-        const getSnapshot = () => (selector ? selector(store.get()) : store.get());
-        return [
-            (onChange) => store.subscribe(onChange),
-            getSnapshot,
-            getSnapshot,
-        ];
-    }, [store, selector]));
+    const selectorRef = useRef(undefined);
+    selectorRef.current = selector;
+    const args = useMemo(() => {
+        const subscribe = store.subscribe.bind(store);
+        const getSnapshot = () => selectorRef.current ? selectorRef.current(store.get()) : store.get();
+        return { subscribe, getSnapshot };
+    }, [store]);
+    const value = useSyncExternalStore(args.subscribe, args.getSnapshot, args.getSnapshot);
     useDebugValue(value);
     return value;
 }

package/dist/useStore.js.map

@@ -1 +1 @@
-{"version":3,"file":"useStore.js","sourceRoot":"","sources":["../src/useStore.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,OAAO,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAA;AAOpE,SAAS,QAAQ,CAAW,KAAe,EAAE,QAAyB;IACpE,MAAM,KAAK,GAAG,oBAAoB,CAChC,GAAG,OAAO,CAAC,GAAG,EAAE;QACd,MAAM,WAAW,GAAG,GAAG,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC,CAAA;QAC1E,OAAO;YACL,CAAC,QAAoB,EAAE,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,QAAQ,CAAC;YACnD,WAAW;YACX,WAAW;SACsC,CAAA;IACrD,CAAC,EAAE,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC,CACtB,CAAA;IAED,aAAa,CAAC,KAAK,CAAC,CAAA;IAEpB,OAAO,KAAK,CAAA;AACd,CAAC;AAED,OAAO,EAAE,QAAQ,EAAE,CAAA"}
+{"version":3,"file":"useStore.js","sourceRoot":"","sources":["../src/useStore.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,OAAO,EAAE,MAAM,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAA;AA2B5E,SAAS,QAAQ,CAAW,KAAe,EAAE,QAAyB;IACpE,MAAM,WAAW,GAAG,MAAM,CAAkB,SAAS,CAAC,CAAA;IACtD,WAAW,CAAC,OAAO,GAAG,QAAQ,CAAA;IAE9B,MAAM,IAAI,GAAG,OAAO,CAAC,GAAG,EAAE;QACxB,MAAM,SAAS,GAAG,KAAK,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QAE7C,MAAM,WAAW,GAAG,GAAG,EAAE,CACvB,WAAW,CAAC,OAAO,CAAC,CAAC,CAAC,WAAW,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,EAAE,CAAA;QAEtE,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,CAAA;IACnC,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAA;IAEX,MAAM,KAAK,GAAG,oBAAoB,CAChC,IAAI,CAAC,SAAS,EACd,IAAI,CAAC,WAAW,EAChB,IAAI,CAAC,WAAW,CACjB,CAAA;IAED,aAAa,CAAC,KAAK,CAAC,CAAA;IAEpB,OAAO,KAAK,CAAA;AACd,CAAC;AAED,OAAO,EAAE,QAAQ,EAAE,CAAA"}

package/package.json

@@ -1,41 +1,54 @@
 {
   "description": "Yet another state management in React",
-  "keywords": [],
   "license": "MIT",
-  "main": "./dist/index.js",
-  "module": "./dist/index.js",
   "name": "@dvashim/store",
   "type": "module",
   "types": "./dist/index.d.ts",
-  "version": "1.1.3",
+  "version": "1.2.0",
   "author": {
     "email": "aleksei@dvashim.dev",
     "name": "Aleksei Reznichenko"
   },
-  "dependencies": {
-    "react": "^19.2.4",
-    "react-dom": "^19.2.4"
-  },
   "devDependencies": {
-    "@biomejs/biome": "^2.4.4",
-    "@changesets/changelog-github": "^0.5.2",
-    "@changesets/cli": "^2.29.8",
-    "@dvashim/biome-config": "^1.2.1",
+    "@biomejs/biome": "^2.4.6",
+    "@changesets/changelog-github": "^0.6.0",
+    "@changesets/cli": "^2.30.0",
+    "@dvashim/biome-config": "^1.3.1",
     "@dvashim/typescript-config": "^1.1.9",
+    "@testing-library/react": "^16.3.2",
+    "@types/node": "^25.3.5",
     "@types/react": "^19.2.14",
     "@types/react-dom": "^19.2.3",
+    "jsdom": "^28.1.0",
+    "react": "^19.2.4",
+    "react-dom": "^19.2.4",
     "rimraf": "^6.1.3",
-    "typescript": "^5.9.3"
+    "typescript": "^5.9.3",
+    "vitest": "^4.0.18"
   },
   "exports": {
     ".": {
+      "types": "./dist/index.d.ts",
       "import": "./dist/index.js",
-      "types": "./dist/index.d.ts"
+      "default": "./dist/index.js"
     }
   },
   "files": [
     "dist"
   ],
+  "keywords": [
+    "react",
+    "state-manager",
+    "useSyncExternalStore",
+    "store",
+    "minimal",
+    "lightweight",
+    "typescript"
+  ],
+  "peerDependencies": {
+    "react": "^18.0.0 || ^19.0.0",
+    "react-dom": "^18.0.0 || ^19.0.0"
+  },
   "publishConfig": {
     "access": "public",
     "provenance": true
@@ -45,12 +58,14 @@
     "url": "https://github.com/dvashim/store.git"
   },
   "scripts": {
-    "build": "tsc --build",
+    "build": "tsc --project tsconfig.dev.json",
     "changeset": "changeset",
-    "check": "pnpm clean && pnpm run \"/^check:.*/\"",
+    "check": "pnpm run \"/^check:.*/\"",
     "check:biome": "biome check",
     "check:ts": "tsc --noemit",
     "clean": "rm -rf dist *.tsbuildinfo",
+    "test": "vitest run",
+    "test:watch": "vitest",
     "watch": "pnpm build --watch"
   }
 }