extra-react-store 0.2.0 → 0.2.2

package/lib/use-selector.js

@@ -1,19 +1,35 @@
-import { useState, useContext } from 'react';
-import { useIsomorphicLayoutEffect } from 'extra-react-hooks';
+import { useContext, useRef } from 'react';
+import { useIIFE, useForceUpdate } from 'extra-react-hooks';
 import { isReferenceEqual } from 'extra-utils';
 export function useSelector(context, selector, isEqual = isReferenceEqual) {
+    const forceUpdate = useForceUpdate();
     const store = useContext(context);
-    const [[value], setBox] = useState(() => [selector(store.getState())]);
-    useIsomorphicLayoutEffect(() => {
-        let oldValue = value;
+    const updateRequireRef = useRef(true);
+    useIIFE(() => {
+        return () => {
+            updateRequireRef.current = true;
+        };
+    }, [selector]);
+    const valueRef = useRef(undefined);
+    if (updateRequireRef.current) {
+        valueRef.current = selector(store.getState());
+        updateRequireRef.current = false;
+    }
+    useIIFE(() => {
         return store.subscribe(state => {
-            const newValue = selector(state);
-            if (!isEqual(oldValue, newValue)) {
-                oldValue = newValue;
-                setBox([newValue]);
+            try {
+                const newValue = selector(state);
+                if (!isEqual(valueRef.current, newValue)) {
+                    valueRef.current = newValue;
+                    forceUpdate();
+                }
+            }
+            catch {
+                updateRequireRef.current = true;
+                forceUpdate();
             }
         });
-    }, [store, selector, isEqual, value, setBox]);
-    return value;
+    }, [store, selector, isEqual, forceUpdate, valueRef, updateRequireRef]);
+    return valueRef.current;
 }
 //# sourceMappingURL=use-selector.js.map

package/lib/use-selector.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-selector.js","sourceRoot":"","sources":["../src/use-selector.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAC5C,OAAO,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAA;AAE7D,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAA;AAE9C,MAAM,UAAU,WAAW,CACzB,OAA4B,EAC5B,QAAiC,EACjC,UAA2C,gBAAgB;IAE3D,MAAM,KAAK,GAAG,UAAU,CAAC,OAAO,CAAC,CAAA;IACjC,MAAM,CAAC,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,CAAA;IAGtE,yBAAyB,CAAC,GAAG,EAAE;QAC7B,IAAI,QAAQ,GAAG,KAAK,CAAA;QAEpB,OAAO,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,EAAE;YAC7B,MAAM,QAAQ,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;YAEhC,IAAI,CAAC,OAAO,CAAC,QAAQ,EAAE,QAAQ,CAAC,EAAE,CAAC;gBACjC,QAAQ,GAAG,QAAQ,CAAA;gBACnB,MAAM,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAA;YACpB,CAAC;QACH,CAAC,CAAC,CAAA;IACJ,CAAC,EAAE,CAAC,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC,CAAA;IAE7C,OAAO,KAAK,CAAA;AACd,CAAC"}
+{"version":3,"file":"use-selector.js","sourceRoot":"","sources":["../src/use-selector.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAC1C,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAA;AAE9C,MAAM,UAAU,WAAW,CACzB,OAA4B,EAC5B,QAAiC,EACjC,UAA2C,gBAAgB;IAE3D,MAAM,WAAW,GAAG,cAAc,EAAE,CAAA;IACpC,MAAM,KAAK,GAAG,UAAU,CAAC,OAAO,CAAC,CAAA;IAEjC,MAAM,gBAAgB,GAAG,MAAM,CAAU,IAAI,CAAC,CAAA;IAC9C,OAAO,CAAC,GAAG,EAAE;QACX,OAAO,GAAG,EAAE;YACV,gBAAgB,CAAC,OAAO,GAAG,IAAI,CAAA;QACjC,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAA;IAEd,MAAM,QAAQ,GAAG,MAAM,CAAQ,SAAS,CAAC,CAAA;IACzC,IAAI,gBAAgB,CAAC,OAAO,EAAE,CAAC;QAC7B,QAAQ,CAAC,OAAO,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAA;QAC7C,gBAAgB,CAAC,OAAO,GAAG,KAAK,CAAA;IAClC,CAAC;IAED,OAAO,CAAC,GAAG,EAAE;QACX,OAAO,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,EAAE;YAC7B,IAAI,CAAC;gBACH,MAAM,QAAQ,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;gBAEhC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,OAAQ,EAAE,QAAQ,CAAC,EAAE,CAAC;oBAC1C,QAAQ,CAAC,OAAO,GAAG,QAAQ,CAAA;oBAC3B,WAAW,EAAE,CAAA;gBACf,CAAC;YACH,CAAC;YAAC,MAAM,CAAC;gBACP,gBAAgB,CAAC,OAAO,GAAG,IAAI,CAAA;gBAC/B,WAAW,EAAE,CAAA;YACf,CAAC;QACH,CAAC,CAAC,CAAA;IACJ,CAAC,EAAE,CAAC,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,gBAAgB,CAAC,CAAC,CAAA;IAEvE,OAAO,QAAQ,CAAC,OAAQ,CAAA;AAC1B,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "extra-react-store",
-  "version": "0.2.0",
+  "version": "0.2.2",
   "description": "",
   "keywords": [],
   "files": [
@@ -33,38 +33,38 @@
     }
   },
   "devDependencies": {
-    "@commitlint/cli": "^19.6.1",
-    "@commitlint/config-conventional": "^19.6.0",
-    "@eslint/js": "^9.18.0",
+    "@commitlint/cli": "^19.8.0",
+    "@commitlint/config-conventional": "^19.8.0",
+    "@eslint/js": "^9.24.0",
     "@testing-library/dom": "^10.4.0",
-    "@testing-library/react": "^16.1.0",
-    "@types/react": "^19.0.7",
+    "@testing-library/react": "^16.3.0",
+    "@types/react": "^19.1.0",
     "@vitejs/plugin-react": "^4.3.4",
-    "eslint": "^9.18.0",
-    "eslint-plugin-react": "^7.37.4",
-    "eslint-plugin-react-hooks": "^5.1.0",
+    "eslint": "^9.24.0",
+    "eslint-plugin-react": "^7.37.5",
+    "eslint-plugin-react-hooks": "^5.2.0",
     "husky": "4",
     "immer": "^10.1.1",
     "jsdom": "^26.0.0",
     "npm-run-all": "^4.1.5",
-    "react": "^19.0.0",
-    "react-dom": "^19.0.0",
+    "react": "^19.1.0",
+    "react-dom": "^19.1.0",
     "rimraf": "^6.0.1",
     "standard-version": "^9.3.2",
     "ts-patch": "^3.3.0",
     "tslib": "^2.8.1",
-    "typescript": "5.7.3",
-    "typescript-eslint": "^8.20.0",
-    "typescript-transform-paths": "^3.5.3",
-    "vite": "^6.0.7",
+    "typescript": "5.8.3",
+    "typescript-eslint": "^8.29.0",
+    "typescript-transform-paths": "^3.5.5",
+    "vite": "^6.2.5",
     "vite-tsconfig-paths": "^5.1.4",
-    "vitest": "^2.1.8"
+    "vitest": "^3.1.1"
   },
   "dependencies": {
     "@blackglory/prelude": "^0.4.0",
     "@blackglory/structures": "^0.14.10",
-    "extra-react-hooks": "^0.8.0",
-    "extra-utils": "^5.17.0"
+    "extra-react-hooks": "^0.8.6",
+    "extra-utils": "^5.19.0"
   },
   "peerDependencies": {
     "immer": "^10.0.2",

package/src/use-selector.ts

@@ -1,5 +1,5 @@
-import { useState, useContext } from 'react'
-import { useIsomorphicLayoutEffect } from 'extra-react-hooks'
+import { useContext, useRef } from 'react'
+import { useIIFE, useForceUpdate } from 'extra-react-hooks'
 import { StoreContext } from './types.js'
 import { isReferenceEqual } from 'extra-utils'
 
@@ -8,22 +8,37 @@ export function useSelector<State, Value>(
 , selector: (state: State) => Value
 , isEqual: (a: Value, b: Value) => boolean = isReferenceEqual
 ): Value {
+  const forceUpdate = useForceUpdate()
   const store = useContext(context)
-  const [[value], setBox] = useState(() => [selector(store.getState())])
 
-  // `useEffect` will be called too late, resulting in not subscribing in time.
-  useIsomorphicLayoutEffect(() => {
-    let oldValue = value
+  const updateRequireRef = useRef<boolean>(true)
+  useIIFE(() => {
+    return () => {
+      updateRequireRef.current = true
+    }
+  }, [selector])
 
+  const valueRef = useRef<Value>(undefined)
+  if (updateRequireRef.current) {
+    valueRef.current = selector(store.getState())
+    updateRequireRef.current = false
+  }
+
+  useIIFE(() => {
     return store.subscribe(state => {
-      const newValue = selector(state)
+      try {
+        const newValue = selector(state)
 
-      if (!isEqual(oldValue, newValue)) {
-        oldValue = newValue
-        setBox([newValue])
+        if (!isEqual(valueRef.current!, newValue)) {
+          valueRef.current = newValue
+          forceUpdate()
+        }
+      } catch {
+        updateRequireRef.current = true
+        forceUpdate()
       }
     })
-  }, [store, selector, isEqual, value, setBox])
+  }, [store, selector, isEqual, forceUpdate, valueRef, updateRequireRef])
 
-  return value
+  return valueRef.current!
 }