@createstore/createstore 1.1.0 → 1.1.2

package/README.md

@@ -8,6 +8,16 @@ npm install @createstore/createstore
 
 Requires React 19 or newer. Works in the browser, in Node, and with Next.js Server Components.
 
+Not related to Redux's `createStore` function: this is a separate library, installed as `@createstore/createstore`.
+
+## When to use it
+
+- **Use it** when several components share state and you want the `useState` shape without a provider or reducers,
+  and when you also need server data, saved state, undo, tab sync or offline support behind the same API.
+- **It is fastest** when many components read different keys, because only readers of a changed key re-render.
+- **Look elsewhere** if you need to support React 18 or older, or if every component re-renders on every change
+  (Zustand is faster there; see `bench/`).
+
 ## Quick start
 
 ```tsx

package/dist/cjs/createStore.cjs

@@ -1070,6 +1070,8 @@ function build(initialState, options, sharedDefinition) {
     }
   };
   let hydrated = !persistStorage;
+  let warnedUnsavable = false;
+  const earlyWrites = /* @__PURE__ */ new Set();
   let resolveHydrated;
   const whenHydrated = new Promise((r) => resolveHydrated = r);
   let storageIsAsync = false;
@@ -1096,7 +1098,26 @@ function build(initialState, options, sharedDefinition) {
     saveTimer = void 0;
     if (!persistStorage || !hydrated) return;
     const data = Object.fromEntries(persistedKeys.map((k) => [k, state[k]]));
-    const text = JSON.stringify(storageIsAsync ? { $version: persistVersion, $saved: Date.now(), state: data } : { $version: persistVersion, state: data });
+    let text;
+    try {
+      text = JSON.stringify(storageIsAsync ? { $version: persistVersion, $saved: Date.now(), state: data } : { $version: persistVersion, state: data });
+    } catch (error) {
+      if (!warnedUnsavable) {
+        warnedUnsavable = true;
+        const bad = persistedKeys.find((k) => {
+          try {
+            JSON.stringify(state[k]);
+            return false;
+          } catch {
+            return true;
+          }
+        });
+        console.warn(
+          `[${name}] couldn't save${bad ? ` "${bad}"` : ""}: ${error.message}. Saved state is JSON, so keep persisted keys to strings, numbers, booleans, null, arrays and plain objects, or leave this key out of saving with persist: { exclude: [...] }. Nothing is saved until it is fixed.`
+        );
+      }
+      return;
+    }
     lastSavedText = text;
     quietly(() => {
       const written = persistStorage.setItem(persistKey, text);
@@ -1201,9 +1222,12 @@ function build(initialState, options, sharedDefinition) {
           }
           if (rescued != null && isSavedState(rescued) && savedAt(rescued) > savedAt(stored)) text = rescued;
           const values = trusted(pick(readSaved(text)), "storage");
+          for (const k of earlyWrites) delete values[k];
+          const keptEarly = earlyWrites.size > 0;
+          earlyWrites.clear();
           hydrated = true;
           if (!destroyed) apply(values, "storage", "loaded from storage", false);
-          if (!destroyed && text === rescued && rescued != null) saveNow();
+          if (!destroyed && (keptEarly || text === rescued && rescued != null)) saveNow();
           finishHydration();
         },
         (error) => {
@@ -1401,6 +1425,7 @@ function build(initialState, options, sharedDefinition) {
       (k) => isStateKey(k) && !Object.is(state[k], values[k])
     );
     if (keys.length === 0) return;
+    if (!hydrated && source === "local") for (const k of keys) earlyWrites.add(k);
     const prev = {};
     for (const k of keys) {
       prev[k] = state[k];
@@ -2137,11 +2162,15 @@ function build(initialState, options, sharedDefinition) {
     }
     const k = cacheKey(q, params);
     const prev = cache2.get(k)?.data;
+    outdateRequest(k);
     setEntry(k, {
       data: typeof updater === "function" ? updater(prev) : updater,
       status: "success"
     });
   }
+  function outdateRequest(k) {
+    if (inflight.has(k)) versions.set(k, (versions.get(k) ?? 0) + 1);
+  }
   function abort(q) {
     if (isQuery(q)) inlineAborts.get(q)?.abort();
     for (const [k, c] of [...namedAborts])
@@ -2675,6 +2704,7 @@ function build(initialState, options, sharedDefinition) {
       setter = (value, serverCall) => {
         const prev = cache2.get(k)?.data;
         const next = typeof value === "function" ? value(prev) : value;
+        outdateRequest(k);
         setEntry(k, { data: next, status: "success" });
         if (!serverCall) return Promise.resolve();
         const done = Promise.resolve().then(serverCall).then(