dev-react-microstore 1.1.3 → 3.0.0

package/dist/index.d.mts

@@ -1,5 +1,10 @@
 type StoreListener = () => void;
-declare function createStoreState<T extends object>(initialState: T): {
+type StoreOptions<T extends object> = {
+    asyncUpdate?: boolean;
+    debounceDelay?: number;
+    perKeyDebounce?: Partial<Record<keyof T, boolean>>;
+};
+declare function createStoreState<T extends object>(initialState: T, options?: StoreOptions<T>): {
     get: () => T;
     set: (next: Partial<T>) => void;
     subscribe: (keys: (keyof T)[], listener: StoreListener) => (() => void);

package/dist/index.d.ts

@@ -1,5 +1,10 @@
 type StoreListener = () => void;
-declare function createStoreState<T extends object>(initialState: T): {
+type StoreOptions<T extends object> = {
+    asyncUpdate?: boolean;
+    debounceDelay?: number;
+    perKeyDebounce?: Partial<Record<keyof T, boolean>>;
+};
+declare function createStoreState<T extends object>(initialState: T, options?: StoreOptions<T>): {
     get: () => T;
     set: (next: Partial<T>) => void;
     subscribe: (keys: (keyof T)[], listener: StoreListener) => (() => void);

package/dist/index.js

@@ -1 +1 @@
-"use strict";var m=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var j=Object.getOwnPropertyNames;var P=Object.prototype.hasOwnProperty;var g=(n,e)=>{for(var t in e)m(n,t,{get:e[t],enumerable:!0})},v=(n,e,t,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let c of j(e))!P.call(n,c)&&c!==t&&m(n,c,{get:()=>e[c],enumerable:!(i=h(e,c))||i.enumerable});return n};var I=n=>v(m({},"__esModule",{value:!0}),n);var F={};g(F,{createStoreState:()=>R,useStoreSelector:()=>C});module.exports=I(F);var y=require("react");function R(n){let e=n,t=new Map;return{get:()=>e,set:o=>{var s;let r=[];for(let u in o){let d=u;Object.is(e[d],o[d])||r.push(d)}if(r.length!==0){for(let u in o)e[u]=o[u];for(let u of r)(s=t.get(u))==null||s.forEach(d=>d())}},subscribe:(o,r)=>{for(let s of o)t.has(s)||t.set(s,new Set),t.get(s).add(r);return()=>{var s;for(let u of o)(s=t.get(u))==null||s.delete(r)}},select:o=>{let r={},s=e;for(let u of o)r[u]=s[u];return r}}}function V(n,e){return n.length===e.length&&n.every((t,i)=>t===e[i])}function z(n,e,t){let i={};for(let{key:c,compare:p}of t){let f=e[c],o=n[c],r=f===void 0?!0:p?p(f,o):!Object.is(f,o);i[c]=r?o:f}return i}function C(n,e){let t=(0,y.useRef)({}),i=(0,y.useRef)(null),c=(0,y.useRef)(null),p=(0,y.useRef)(null),f=(0,y.useRef)(!0),o=(0,y.useRef)({});if(!i.current||!V(i.current,e)){let a=[],T=[];for(let S of e)if(typeof S=="string"){let l=S;a.push({key:l}),T.push(l)}else for(let[l,b]of Object.entries(S)){let k=l;a.push({key:k,compare:b}),T.push(k)}c.current=a,p.current=T,i.current=e}let r=c.current,s=p.current,u=()=>{let a=n.get(),T=f.current;if(!(T||r.some(({key:l,compare:b})=>{var K;let k=o.current[l],x=a[l];return k===void 0?!0:(K=b==null?void 0:b(k,x))!=null?K:!Object.is(k,x)})))return t.current;T&&(f.current=!1);for(let{key:l}of r)o.current[l]=a[l];return t.current=z(a,t.current,r),t.current},d=(()=>{let a=n.get();return s.reduce((T,S)=>(T[S]=a[S],T),{})})();return(0,y.useSyncExternalStore)(a=>n.subscribe(s,a),u,()=>d)}0&&(module.exports={createStoreState,useStoreSelector});
+"use strict";var g=Object.defineProperty;var P=Object.getOwnPropertyDescriptor;var v=Object.getOwnPropertyNames;var j=Object.prototype.hasOwnProperty;var R=(a,r)=>{for(var c in r)g(a,c,{get:r[c],enumerable:!0})},I=(a,r,c,l)=>{if(r&&typeof r=="object"||typeof r=="function")for(let y of v(r))!j.call(a,y)&&y!==c&&g(a,y,{get:()=>r[y],enumerable:!(l=P(r,y))||l.enumerable});return a};var C=a=>I(g({},"__esModule",{value:!0}),a);var D={};R(D,{createStoreState:()=>F,useStoreSelector:()=>z});module.exports=C(D);var f=require("react");function V(a,r){let c;return function(...l){c!==void 0&&clearTimeout(c),c=setTimeout(()=>a.apply(this,l),r)}}function F(a,r={}){let c=a,{asyncUpdate:l=!0,debounceDelay:y=0,perKeyDebounce:k={}}=r,T=new Map,p=new Map;return{get:()=>c,set:d=>{var o,i;if(!d)return;let t=[];for(let n in d){let e=n,u=c[e],s=d[e];u!==s&&(Object.is(u,s)||(c[e]=s,t.push(e)))}if(t.length!==0)if(l)for(let n of t)k[n]!==!1?(p.has(n)||p.set(n,V(()=>{var u;(u=T.get(n))==null||u.forEach(s=>s())},y)),p.get(n)()):(o=T.get(n))==null||o.forEach(u=>u());else for(let n of t)(i=T.get(n))==null||i.forEach(e=>e())},subscribe:(d,t)=>{for(let o of d)T.has(o)||T.set(o,new Set),T.get(o).add(t);return()=>{var o;for(let i of d)(o=T.get(i))==null||o.delete(t)}},select:d=>{let t={},o=c;for(let i of d)t[i]=o[i];return t}}}function E(a,r){return a.length===r.length&&a.every((c,l)=>c===r[l])}function z(a,r){let c=(0,f.useRef)({}),l=(0,f.useRef)(null),y=(0,f.useRef)(null),k=(0,f.useRef)(null),T=(0,f.useRef)(!0),p=(0,f.useRef)({}),b=(0,f.useRef)(null);if(!l.current||!E(l.current,r)){let t=[],o=[];for(let i of r)if(typeof i=="string"){let n=i;t.push({key:n}),o.push(n)}else{let n=i;for(let e in n){let u=n[e],s=e;t.push({key:s,compare:u}),o.push(s)}}y.current=t,k.current=o,l.current=r}let h=y.current,m=k.current,K=()=>{let t=a.get();if(T.current){T.current=!1;let e={};for(let{key:u}of h){let s=t[u];p.current[u]=s,e[u]=s}return c.current=e,e}if(!(()=>{var e;for(let{key:u,compare:s}of h){let S=p.current[u],x=t[u];if(S===void 0||((e=s==null?void 0:s(S,x))!=null?e:!Object.is(S,x)))return!0}return!1})())return c.current;let n={};for(let{key:e,compare:u}of h){let s=p.current[e],S=t[e];s===void 0||(u?!u(s,S):!Object.is(s,S))?(p.current[e]=S,n[e]=S):n[e]=s}return c.current=n,n},d=(0,f.useMemo)(()=>{let t=a.get(),o={};for(let i of m)o[i]=t[i];return o},[m]);if(!b.current||k.current!==m){let t=m;b.current=o=>a.subscribe(t,o)}return(0,f.useSyncExternalStore)(b.current,K,()=>d)}0&&(module.exports={createStoreState,useStoreSelector});

package/dist/index.mjs

@@ -1 +1 @@
-import{useRef as k,useSyncExternalStore as K}from"react";function v(u){let r=u,n=new Map;return{get:()=>r,set:e=>{var o;let t=[];for(let s in e){let f=s;Object.is(r[f],e[f])||t.push(f)}if(t.length!==0){for(let s in e)r[s]=e[s];for(let s of t)(o=n.get(s))==null||o.forEach(f=>f())}},subscribe:(e,t)=>{for(let o of e)n.has(o)||n.set(o,new Set),n.get(o).add(t);return()=>{var o;for(let s of e)(o=n.get(s))==null||o.delete(t)}},select:e=>{let t={},o=r;for(let s of e)t[s]=o[s];return t}}}function h(u,r){return u.length===r.length&&u.every((n,a)=>n===r[a])}function j(u,r,n){let a={};for(let{key:y,compare:S}of n){let T=r[y],e=u[y],t=T===void 0?!0:S?S(T,e):!Object.is(T,e);a[y]=t?e:T}return a}function I(u,r){let n=k({}),a=k(null),y=k(null),S=k(null),T=k(!0),e=k({});if(!a.current||!h(a.current,r)){let c=[],l=[];for(let d of r)if(typeof d=="string"){let i=d;c.push({key:i}),l.push(i)}else for(let[i,b]of Object.entries(d)){let p=i;c.push({key:p,compare:b}),l.push(p)}y.current=c,S.current=l,a.current=r}let t=y.current,o=S.current,s=()=>{let c=u.get(),l=T.current;if(!(l||t.some(({key:i,compare:b})=>{var x;let p=e.current[i],m=c[i];return p===void 0?!0:(x=b==null?void 0:b(p,m))!=null?x:!Object.is(p,m)})))return n.current;l&&(T.current=!1);for(let{key:i}of t)e.current[i]=c[i];return n.current=j(c,n.current,t),n.current},f=(()=>{let c=u.get();return o.reduce((l,d)=>(l[d]=c[d],l),{})})();return K(c=>u.subscribe(o,c),s,()=>f)}export{v as createStoreState,I as useStoreSelector};
+import{useMemo as K,useRef as p,useSyncExternalStore as P}from"react";function v(a,i){let u;return function(...y){u!==void 0&&clearTimeout(u),u=setTimeout(()=>a.apply(this,y),i)}}function C(a,i={}){let u=a,{asyncUpdate:y=!0,debounceDelay:m=0,perKeyDebounce:S={}}=i,l=new Map,T=new Map;return{get:()=>u,set:f=>{var o,c;if(!f)return;let t=[];for(let n in f){let e=n,s=u[e],r=f[e];s!==r&&(Object.is(s,r)||(u[e]=r,t.push(e)))}if(t.length!==0)if(y)for(let n of t)S[n]!==!1?(T.has(n)||T.set(n,v(()=>{var s;(s=l.get(n))==null||s.forEach(r=>r())},m)),T.get(n)()):(o=l.get(n))==null||o.forEach(s=>s());else for(let n of t)(c=l.get(n))==null||c.forEach(e=>e())},subscribe:(f,t)=>{for(let o of f)l.has(o)||l.set(o,new Set),l.get(o).add(t);return()=>{var o;for(let c of f)(o=l.get(c))==null||o.delete(t)}},select:f=>{let t={},o=u;for(let c of f)t[c]=o[c];return t}}}function j(a,i){return a.length===i.length&&a.every((u,y)=>u===i[y])}function V(a,i){let u=p({}),y=p(null),m=p(null),S=p(null),l=p(!0),T=p({}),b=p(null);if(!y.current||!j(y.current,i)){let t=[],o=[];for(let c of i)if(typeof c=="string"){let n=c;t.push({key:n}),o.push(n)}else{let n=c;for(let e in n){let s=n[e],r=e;t.push({key:r,compare:s}),o.push(r)}}m.current=t,S.current=o,y.current=i}let h=m.current,k=S.current,g=()=>{let t=a.get();if(l.current){l.current=!1;let e={};for(let{key:s}of h){let r=t[s];T.current[s]=r,e[s]=r}return u.current=e,e}if(!(()=>{var e;for(let{key:s,compare:r}of h){let d=T.current[s],x=t[s];if(d===void 0||((e=r==null?void 0:r(d,x))!=null?e:!Object.is(d,x)))return!0}return!1})())return u.current;let n={};for(let{key:e,compare:s}of h){let r=T.current[e],d=t[e];r===void 0||(s?!s(r,d):!Object.is(r,d))?(T.current[e]=d,n[e]=d):n[e]=r}return u.current=n,n},f=K(()=>{let t=a.get(),o={};for(let c of k)o[c]=t[c];return o},[k]);if(!b.current||S.current!==k){let t=k;b.current=o=>a.subscribe(t,o)}return P(b.current,g,()=>f)}export{C as createStoreState,V as useStoreSelector};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dev-react-microstore",
-  "version": "1.1.3",
+  "version": "3.0.0",
   "description": "A minimal global state manager for React with fine-grained subscriptions.",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/src/index.ts

@@ -1,36 +1,79 @@
-import { useRef, useSyncExternalStore } from 'react';
+import { useMemo, useRef, useSyncExternalStore } from 'react'
+
 type StoreListener = () => void;
 
+function debounce<T extends (...args: any[]) => void>(fn: T, delay: number): T {
+  let timeoutId: ReturnType<typeof setTimeout> | undefined;
+  return function (this: ThisParameterType<T>, ...args: Parameters<T>) {
+    if (timeoutId !== undefined) {
+      clearTimeout(timeoutId);
+    }
+    timeoutId = setTimeout(() => fn.apply(this, args), delay);
+  } as T;
+}
 
+type StoreOptions<T extends object> = {
+  asyncUpdate?: boolean;
+  debounceDelay?: number;
+  perKeyDebounce?: Partial<Record<keyof T, boolean>>;
+};
 
-export function createStoreState<T extends object>(initialState: T) {
+export function createStoreState<T extends object>(
+  initialState: T, 
+  options: StoreOptions<T> = {}
+) {
   let state = initialState;
-  
+  const { 
+    asyncUpdate = true, 
+    debounceDelay = 0, 
+    perKeyDebounce = {} as Partial<Record<keyof T, boolean>>
+  } = options;
   const keyListeners = new Map<keyof T, Set<StoreListener>>();
+  const debouncedNotifiers = new Map<keyof T, () => void>();
 
   const get = () => state;
 
   const set = (next: Partial<T>) => {
-    const updatedKeys: (keyof T)[] = [];
+    if (!next) return;
 
+    const updatedKeys: (keyof T)[] = [];
     for (const key in next) {
       const typedKey = key as keyof T;
-      if (!Object.is(state[typedKey], next[typedKey])) {
+      const currentValue = state[typedKey];
+      const nextValue = next[typedKey];
+
+      if (currentValue === nextValue) continue;
+
+      if (!Object.is(currentValue, nextValue)) {
+        state[typedKey] = nextValue!;
         updatedKeys.push(typedKey);
       }
     }
 
     if (updatedKeys.length === 0) return;
 
-    for (const key in next) {
-      state[key as keyof T] = next[key as keyof T]!;
-    }
-
-    for (const key of updatedKeys) {
-      keyListeners.get(key)?.forEach(listener => listener());
+    if (asyncUpdate) {
+      for (const key of updatedKeys) {
+        const shouldDebounce = perKeyDebounce[key] !== false;
+        
+        if (shouldDebounce) {
+          if (!debouncedNotifiers.has(key)) {
+            debouncedNotifiers.set(key, debounce(() => {
+              keyListeners.get(key)?.forEach(listener => listener());
+            }, debounceDelay));
+          }
+          debouncedNotifiers.get(key)!();
+        } else {
+          keyListeners.get(key)?.forEach(listener => listener());
+        }
+      }
+    } else {
+      for (const key of updatedKeys) {
+        keyListeners.get(key)?.forEach(listener => listener());
+      }
     }
   };
-  
+
   const subscribe = (keys: (keyof T)[], listener: StoreListener): (() => void) => {
     for (const key of keys) {
       if (!keyListeners.has(key)) {
@@ -68,10 +111,10 @@ type SelectorInput<T extends object> = ReadonlyArray<KeySelector<T> | CustomSele
 
 type ExtractSelectorKeys<T extends object, S extends SelectorInput<T>> = {
   [K in S[number] extends infer Item
-    ? Item extends keyof T
-      ? Item
-      : keyof Item
-    : never]: T[K];
+  ? Item extends keyof T
+  ? Item
+  : keyof Item
+  : never]: T[K];
 };
 
 type Picked<T extends object, S extends SelectorInput<T>> = ExtractSelectorKeys<T, S>;
@@ -88,21 +131,6 @@ function shallowEqualSelector<T extends object>(
   return a.length === b.length && a.every((item, i) => item === b[i]);
 }
 
-function pickKeys<T extends object>(
-  base: T,
-  prev: Partial<T>,
-  selectors: NormalizedSelector<T>[]
-): Partial<T> {
-  const out: Partial<T> = {};
-  for (const { key, compare } of selectors) {
-    const prevVal = prev[key];
-    const nextVal = base[key];
-    const changed = prevVal === undefined ? true : (compare ? compare(prevVal, nextVal) : !Object.is(prevVal, nextVal));
-    out[key] = changed ? nextVal : prevVal;
-  }
-  return out;
-}
-
 export function useStoreSelector<T extends object, S extends SelectorInput<T>>(
   store: StoreType<T>,
   selector: S
@@ -113,25 +141,28 @@ export function useStoreSelector<T extends object, S extends SelectorInput<T>>(
   const keysRef = useRef<(keyof T)[] | null>(null);
   const isFirstRunRef = useRef(true);
   const lastValues = useRef<Partial<T>>({});
+  const subscribeRef = useRef<((onStoreChange: () => void) => () => void) | null>(null);
 
   if (!prevSelector.current || !shallowEqualSelector(prevSelector.current, selector)) {
     const normalized: NormalizedSelector<T>[] = [];
     const keys: (keyof T)[] = [];
-    
+
     for (const item of selector) {
       if (typeof item === 'string') {
         const key = item as keyof T;
         normalized.push({ key });
         keys.push(key);
       } else {
-        for (const [key, compare] of Object.entries(item)) {
+        const customSelector = item as CustomSelector<T>;
+        for (const key in customSelector) {
+          const compare = customSelector[key as keyof typeof customSelector];
           const typedKey = key as keyof T;
           normalized.push({ key: typedKey, compare: compare as CompareFn<T[keyof T]> });
           keys.push(typedKey);
         }
       }
     }
-    
+
     normalizedRef.current = normalized;
     keysRef.current = keys;
     prevSelector.current = selector;
@@ -144,38 +175,68 @@ export function useStoreSelector<T extends object, S extends SelectorInput<T>>(
     const current = store.get();
     const isFirstRun = isFirstRunRef.current;
 
-    const changed = isFirstRun || normalized.some(({ key, compare }) => {
-      const prevVal = lastValues.current[key];
-      const nextVal = current[key];
-      return prevVal === undefined ? true : (compare?.(prevVal, nextVal) ?? !Object.is(prevVal, nextVal));
-    });
-
-    if (!changed) {
-      return lastSelected.current as Picked<T, S>;
-    }
-    
     if (isFirstRun) {
       isFirstRunRef.current = false;
+      const result = {} as Partial<T>;
+      for (const { key } of normalized) {
+        const value = current[key];
+        lastValues.current[key] = value;
+        result[key] = value;
+      }
+      lastSelected.current = result;
+      return result as Picked<T, S>;
     }
 
-    for (const { key } of normalized) {
-      lastValues.current[key] = current[key];
+    const hasChanges = () => {
+      for (const { key, compare } of normalized) {
+        const prevVal = lastValues.current[key];
+        const nextVal = current[key];
+        if (prevVal === undefined ? true : (compare?.(prevVal, nextVal) ?? !Object.is(prevVal, nextVal))) {
+          return true;
+        }
+      }
+      return false;
+    };
+
+    if (!hasChanges()) {
+      return lastSelected.current as Picked<T, S>;
     }
 
-    lastSelected.current = pickKeys(current, lastSelected.current, normalized);
-    return lastSelected.current as Picked<T, S>;
+    const result = {} as Partial<T>;
+    for (const { key, compare } of normalized) {
+      const prevVal = lastValues.current[key];
+      const nextVal = current[key];
+
+      const isFirstTime = prevVal === undefined;
+      const changed = isFirstTime || (compare ? !compare(prevVal, nextVal) : !Object.is(prevVal, nextVal));
+
+      if (changed) {
+        lastValues.current[key] = nextVal;
+        result[key] = nextVal;
+      } else {
+        result[key] = prevVal;
+      }
+    }
+
+    lastSelected.current = result;
+    return result as Picked<T, S>;
   };
 
-  const staticSnapshot = (() => {
+  const staticSnapshot = useMemo(() => {
     const current = store.get();
-    return keys.reduce((acc, key) => {
-      acc[key] = current[key];
-      return acc;
-    }, {} as Partial<T>) as Picked<T, S>;
-  })();
+    const result = {} as Partial<T>;
+    for (const key of keys) {
+      result[key] = current[key];
+    }
+    return result as Picked<T, S>;
+  }, [keys]);
 
-  const subscribe = (onStoreChange: () => void) =>
-    store.subscribe(keys, onStoreChange);
 
-  return useSyncExternalStore(subscribe, getSnapshot, () => staticSnapshot);
+  if (!subscribeRef.current || keysRef.current !== keys) {
+    const currentKeys = keys;
+    subscribeRef.current = (onStoreChange: () => void) =>
+      store.subscribe(currentKeys, onStoreChange);
+  }
+
+  return useSyncExternalStore(subscribeRef.current, getSnapshot, () => staticSnapshot);
 }