@plq/use-persisted-state 1.4.1 → 1.4.2

package/src/utils/change-notifier.ts

@@ -6,14 +6,7 @@ export interface ChangeNotifier {
   onChanged: StorageChangeEvent
 }
 
-/**
- * Holds the subscribers of a single change source. Each adapter — and, for the
- * extension backends, each storage area — owns one, so a change never reaches
- * listeners that subscribed elsewhere.
- *
- * Routing a backend's events to the right notifier stays with the adapter: the
- * extensions demultiplex one event by area name, the DOM one by storage object.
- */
+/** Holds the subscribers of a single change source, so a change never reaches listeners that subscribed elsewhere. */
 export function createChangeNotifier(): ChangeNotifier {
   const listeners = new Set<StorageChangeListener>()
 
@@ -23,8 +16,6 @@ export function createChangeNotifier(): ChangeNotifier {
         listener(changes)
       }
     },
-    // Lets an adapter release a shared resource once nobody is listening; the
-    // set behind onChanged stays the only count, so the two cannot drift.
     hasListeners() {
       return listeners.size > 0
     },

package/src/utils/create-web-storage.ts

@@ -6,21 +6,12 @@ function toKeyList(keys: string | string[]): string[] {
   return Array.isArray(keys) ? keys : [keys]
 }
 
-/**
- * Adapts a Web Storage area to the library's `Storage` contract.
- *
- * Pass `undefined` where the global is missing, as it is on a server: the
- * adapter then reads back nothing and **silently discards every write**, so a
- * consumer keeps its initial value instead of the import throwing. Listeners
- * are still accepted and reported, they simply never fire.
- */
+/** Adapts a Web Storage area. With `undefined`, as on a server, it reads back nothing and discards every write. */
 export default (storage: globalThis.Storage | undefined): Storage => {
-  // Per-instance notifier: the localStorage and sessionStorage adapters must not
-  // share listeners, or a write to one area notifies subscribers of the other.
+  // Per instance: the localStorage and sessionStorage adapters must not share listeners.
   const notifier = createChangeNotifier()
 
-  // Only a missing global is inert. Anything else a caller passes has to fail
-  // on first use instead of swallowing their writes.
+  // Only a missing global is inert; anything else a caller passes has to fail on first use.
   if (storage === undefined) {
     return {
       get: () => ({}),
@@ -32,9 +23,7 @@ export default (storage: globalThis.Storage | undefined): Storage => {
 
   const route: StorageEventRoute = { storage, fire: notifier.fire }
 
-  // The DOM subscription is shared and reference counted: an adapter joins it
-  // with its first listener and lets go with its last, so factory calls nobody
-  // listens to leave nothing attached to the global object.
+  // The DOM subscription is shared and reference counted, so adapters nobody listens to attach nothing.
   const onChanged: StorageChangeEvent = {
     addListener(listener) {
       notifier.onChanged.addListener(listener)
@@ -58,8 +47,7 @@ export default (storage: globalThis.Storage | undefined): Storage => {
       for (const key of toKeyList(keys)) {
         const item = storage.getItem(key)
 
-        // `null` is the only answer that means absence: an empty string is a
-        // value the caller stored, and reporting it as a missing key loses it.
+        // `null` is the only answer meaning absence; an empty string is a value the caller stored.
         if (item !== null) result[key] = item
       }
 

package/src/utils/extension-storage.ts

@@ -5,18 +5,12 @@ const TRACKED_AREAS = ['local', 'sync', 'managed'] as const
 
 export type Area = (typeof TRACKED_AREAS)[number]
 
-// Both browsers also report `session` changes, an area this library does not
-// expose. Dispatching one would read an undefined notifier and throw.
+// Both browsers also report `session`, an area this library does not expose; dispatching one would throw.
 function isTrackedArea(area: string): area is Area {
   return (TRACKED_AREAS as readonly string[]).includes(area)
 }
 
-/**
- * Extension storage holds arbitrary JSON, while this library only ever writes
- * serialized strings. Anything else under a key belongs to other code and is
- * reported as absent — which is what effectively happened before, once such a
- * value reached `JSON.parse` and the hook fell back to its initial value.
- */
+/** Extension storage holds arbitrary JSON; this library writes only strings, so anything else reads as absent. */
 export function toStoredValue(value: unknown): string | null | undefined {
   if (value === undefined) return
 
@@ -53,12 +47,7 @@ export interface ListenerRegistry {
   createOnChanged(area: Area): StorageChangeEvent
 }
 
-/**
- * Demultiplexes an extension's single `onChanged` event, which names the area
- * that changed, to one notifier per area. Each adapter owns its own registry,
- * so a change in one browser's storage never reaches listeners registered on
- * another's.
- */
+/** Demultiplexes an extension's single `onChanged` event to one notifier per area, one registry per adapter. */
 export function createListenerRegistry(): ListenerRegistry {
   const notifiers: { [area in Area]: ChangeNotifier } = {
     local: createChangeNotifier(),

package/src/utils/get-new-item.ts

@@ -1,17 +1,6 @@
 import { isObject } from '@plq/is'
 
-/**
- * Merges `newValue` under `key` into the serialized entry a factory shares between all of its
- * hooks, and returns the entry to store.
- *
- * Reports and throws when the entry cannot be merged into, rather than answering with one built
- * from nothing. What this returns is written over the whole entry, so an unreadable entry is the
- * one case with nothing safe to return: every other hook's key would be replaced with nothing,
- * and the bytes a repair still needs would go with them.
- *
- * @throws {SyntaxError} when the entry is not valid JSON.
- * @throws {TypeError} when the entry is valid JSON but not an object of keys.
- */
+/** Merges `newValue` under `key` into the shared entry, throwing rather than rebuilding one it cannot read. */
 export default function getNewItem<T>(key: string, persistedItem: string, newValue: T): string {
   let persist: unknown
 
@@ -24,10 +13,7 @@ export default function getNewItem<T>(key: string, persistedItem: string, newVal
   }
 
   if (!isObject(persist)) {
-    // A shared backend can leave any JSON under the key, and neither a primitive nor an array
-    // survives being merged into: `JSON.stringify` unwraps the first back to itself and keeps the
-    // second an array, so the value being set disappears with the property added to it. A stored
-    // `null` did not even get that far - it threw out of `Object.assign` and into the caller.
+    // Neither a primitive nor an array survives being merged into: the value being set would disappear.
     const err = new TypeError('the stored entry is not an object of keys')
 
     console.error("use-persisted-state: Can't write value to storage", err)

package/src/utils/get-persisted-value.ts

@@ -1,21 +1,13 @@
 import { isFunction, isObject } from '@plq/is'
 
-/**
- * Resolves the value a hook starts from: the persisted entry for `key` when the stored payload
- * carries one, the initial value otherwise.
- *
- * Presence is decided by the key rather than by the value, so a persisted `null` comes back as
- * the value the user set instead of being mistaken for an absence and replaced.
- */
+/** Resolves a hook's starting value by key presence, so a persisted `null` is not mistaken for an absence. */
 export default function getPersistedValue<T>(key: string, initialValue: T | (() => T), persist?: string): T {
   let initialPersist: unknown
 
   try {
     initialPersist = persist ? JSON.parse(persist) : {}
   } catch (err) {
-    // A shared backend can hold a foreign or truncated entry, so a parse failure is expected here
-    // and must not stop the component mounting. It is reported rather than swallowed because the
-    // fallback discards whatever was persisted, and because the change path logs the same failure.
+    // A shared backend can hold a foreign or truncated entry, so a parse failure must not stop the mount.
     console.error("use-persisted-state: Can't parse value from storage", err)
 
     initialPersist = {}
@@ -23,9 +15,7 @@ export default function getPersistedValue<T>(key: string, initialValue: T | (()
 
   let initialOrPersistedValue = isFunction(initialValue) ? initialValue() : initialValue
 
-  // `JSON.parse` yields any JSON value, so a foreign entry can be a primitive,
-  // and `in` throws on one. This runs in the `useState` initializer, where a
-  // throw stops the component mounting instead of falling back.
+  // `in` throws on a primitive, and this runs in the `useState` initializer, where a throw stops the mount.
   if (isObject(initialPersist) && key in initialPersist) {
     initialOrPersistedValue = initialPersist[key] as T
   }

package/src/utils/is-async-storage.ts

@@ -1,25 +1,16 @@
 import { isAsyncFunction, isFunction, isPromise } from '@plq/is'
 import type { AsyncStorage } from '../@types/storage'
 
-// An unvalidated candidate: its members are unknown until each one is checked.
 type StorageCandidate = {
   get?: unknown
   set?: unknown
   remove?: unknown
 }
 
-// `AsyncStorage` is three methods, so every member has to be callable: a promise standing in for
-// one satisfies nothing the hook then does with it. `@plq/is` classifies async functions as their
-// own type, so `isFunction` rejects them and both checks are needed to admit a callable member.
+// `@plq/is` classifies async functions as their own type, so `isFunction` alone rejects them.
 const isCallableMember = (member: unknown): boolean => isFunction(member) || isAsyncFunction(member)
 
-/**
- * Narrows a storage to {@link AsyncStorage}, deciding which hook the entry point builds.
- *
- * Inspection never writes: `set` and `remove` are only checked for shape, never invoked, so
- * `get` alone decides. A candidate pairing an async `get` with a sync `set` satisfies neither
- * storage interface, which is why proving the other two members is not worth a write.
- */
+/** Narrows a storage to {@link AsyncStorage}. Inspecting never writes: `set` and `remove` are never called. */
 export default function isAsyncStorage(storage: unknown): storage is AsyncStorage {
   const candidate = storage as StorageCandidate | null | undefined
 
@@ -42,23 +33,14 @@ export default function isAsyncStorage(storage: unknown): storage is AsyncStorag
     return false
   }
 
-  // `AsyncStorage` admits a plain function returning a promise, and nothing short of a call tells
-  // that apart from a sync get. Any adapter written that way can only be recognised here, and a
-  // third-party one is free to be written that way, so this line stays necessary however the
-  // shipped adapters happen to declare themselves. A read is the one probe that leaves the
-  // inspected storage as it found it.
+  // A plain function returning a promise is a valid `AsyncStorage`, and only a call tells it from a sync get.
   let probe: unknown
 
   try {
-    // Called as a method of the storage it belongs to: an adapter written as an
-    // object of methods reads its own state through `this`, and probing the
-    // extracted function would throw on a storage that is perfectly valid.
+    // Called as a method: an adapter reading its own state through `this` would throw on a torn-off function.
     probe = get.call(candidate, '')
   } catch {
-    // Not swallowed, deferred: consumers build the factory at module scope, where
-    // a throw takes the import down instead of reaching a component. A storage
-    // whose read fails is not provably async, and the sync path raises the same
-    // failure at the first read, where it can be handled.
+    // Deferred, not swallowed: factories are built at module scope, where a throw takes the import down.
     return false
   }
 
@@ -66,9 +48,7 @@ export default function isAsyncStorage(storage: unknown): storage is AsyncStorag
     return false
   }
 
-  // Only the probe's shape answers the question, so its outcome is discarded by construction.
-  // The rejection still has to be claimed: unclaimed, it terminates the process on Node 15+,
-  // letting a storage that merely fails a read take the consuming application down with it.
+  // An unclaimed rejection terminates the process on Node 15+, so the discarded probe still has to be claimed.
   probe.then(undefined, () => undefined)
 
   return true

package/src/utils/storage-event-router.ts

@@ -21,30 +21,19 @@ function routeStorageEvent(event: StorageEvent): void {
   }
 
   for (const route of routes) {
-    // A browser always names the area it changed, so real cross-tab events
-    // reach only the adapter of that area. An event a consumer synthesized —
-    // the sole way to test cross-tab sync under jsdom, and a common way to
-    // notify the writing tab in production — often cannot name one: the
-    // StorageEvent constructor rejects a mocked storage there. Those still go
-    // everywhere, exactly as they did before areas were told apart.
+    // An event a consumer synthesized often cannot name an area, so those still reach every route.
     if (event.storageArea == null || event.storageArea === route.storage) {
       route.fire(changes)
     }
   }
 }
 
-// A runtime can provide storage without the DOM event API, and can provide half
-// of that API: subscribing where nothing can unsubscribe strands a listener and
-// makes releasing it throw, so both halves are required before taking one.
+// A runtime can provide half the DOM event API, and subscribing where nothing can unsubscribe strands a listener.
 function canSubscribe(): boolean {
   return typeof globalThis.addEventListener === 'function' && typeof globalThis.removeEventListener === 'function'
 }
 
-/**
- * Starts routing DOM storage events to `route`. Every adapter shares one
- * subscription on the global object, so creating adapters nobody listens to
- * costs nothing.
- */
+/** Starts routing DOM storage events to `route`. Every adapter shares one subscription on the global object. */
 export function addRoute(route: StorageEventRoute): void {
   routes.add(route)
 

package/src/utils/use-storage-handler.ts

@@ -3,17 +3,7 @@ import { useEffect, useRef } from 'react'
 import type { AsyncStorage, Storage, StorageChange } from '../@types/storage'
 import { isFunction, isObject } from '@plq/is'
 
-/**
- * One key read out of a serialized entry. `null` is a value a caller can store,
- * so a stored `null` has to stay distinguishable from no value at all —
- * collapsing the two is what dropped a persisted `null` on its way from a change
- * event into state.
- *
- * A key that is not in the entry and an entry that will not parse are both
- * `unavailable`. They differ in why, not in what a caller does next, and the
- * difference that matters is reported where it happens: only a parse failure is
- * a defect worth a diagnostic, an entry holding other keys is routine.
- */
+// A stored `null` is a value, so absence needs a status of its own rather than a `null` value.
 type StoredValue<T> = { status: 'stored'; value: T } | { status: 'unavailable' }
 
 function readStoredValue<T>(key: string, entry: string): StoredValue<T> {
@@ -27,15 +17,12 @@ function readStoredValue<T>(key: string, entry: string): StoredValue<T> {
     return { status: 'unavailable' }
   }
 
-  // A foreign entry can be any JSON value, and `in` throws on a primitive. This
-  // runs inside the adapter's notify loop, where a throw also cuts off every
-  // listener queued behind this one.
+  // `in` throws on a primitive, and a throw here cuts off every listener queued behind this one.
   if (!isObject(parsed) || !(key in parsed)) return { status: 'unavailable' }
 
   return { status: 'stored', value: parsed[key] as T }
 }
 
-// Restores the initial value when the whole entry is removed from the storage.
 function applyRemoval<T>(
   change: StorageChange,
   itemKey: string,
@@ -46,36 +33,20 @@ function applyRemoval<T>(
 
   const oldValue = readStoredValue<T>(itemKey, change.oldValue)
   const declaredInitialValue = latestInitialValue.current
-  // Compared against the resolved value: a factory is never equal to what it
-  // produces, so comparing the declaration re-applies the initial value on every
-  // removal.
+  // Resolved before comparing: a factory is never equal to what it produces.
   const initialValue = isFunction(declaredInitialValue) ? declaredInitialValue() : declaredInitialValue
 
-  // An entry with no readable value for the key cannot be shown to have held the
-  // initial value, so the fallback is applied rather than skipped. The entry is
-  // gone either way, and stale state left in place is worse than a redundant
-  // restore.
+  // Restore redundantly rather than leave stale state when the entry's old value cannot be read.
   if (oldValue.status === 'stored' && oldValue.value === initialValue) return
 
   applyValue(initialValue)
 }
 
-// A backend that reports nothing back leaves every record unmatched, so the list
-// needs a ceiling or it grows by one string per write for as long as the hook is
-// mounted. A bound, not a tuning: a backend that does report drains the list on
-// every echo, and one that reports late is what the list exists for.
+// A list, not one slot: a write may still be awaiting its echo when the next one starts.
+// Capped, because a backend that never reports back leaves every record unmatched.
 const MAX_PENDING_OWN_WRITES = 8
 
-/**
- * Remembers an entry the hook is about to write, so the change the backend
- * reports for it can be told apart from someone else's write.
- *
- * Recorded before the write, because a backend may report it before the call
- * settles. One slot was not enough: a backend free to report after its write
- * settles - chrome and browser storage both are - lets the next write overwrite
- * the record of a write still waiting to be reported, and that unsuppressed echo
- * then puts the earlier value back over the later one.
- */
+/** Records an entry before it is written, because a backend may report the change before the write settles. */
 export function recordOwnWrite(pendingOwnWrites: React.RefObject<string[]>, item: string): void {
   const pending = pendingOwnWrites.current
 
@@ -84,39 +55,18 @@ export function recordOwnWrite(pendingOwnWrites: React.RefObject<string[]>, item
   pending.push(item)
 }
 
-/**
- * Reports whether this change is a write the hook itself made, forgetting the
- * record when it is. A backend reports a write to every listener, the one that
- * made it included, and applying that echo is the storage-to-state re-sync this
- * hook was rebuilt without, arriving by another road: it decodes the entry again
- * and hands the caller an equal value with a new identity, plus a render for a
- * value it already holds.
- *
- * The price, accepted knowingly: for a value JSON cannot carry, the writer keeps
- * what it set - NaN - while every other component on the key decodes the null
- * that reached storage, so the two disagree until one of them remounts. Applying
- * the echo would settle that disagreement and bring back both the second
- * storage-to-state path and the render per write, so it is not the repair it
- * looks like.
- *
- * Forgetting on the first match keeps a later identical entry a change. Another
- * hook writing the same bytes is suppressed along with it, and nothing is lost:
- * it would have replaced a value with an equal one.
- */
+// Applying a hook's own echo would re-decode the entry and re-render for a value it already holds.
 function consumeOwnWriteEcho(entry: string, pendingOwnWrites: React.RefObject<string[]>): boolean {
   const matched = pendingOwnWrites.current.indexOf(entry)
 
   if (matched === -1) return false
 
-  // Everything recorded before the reported entry goes with it: a backend applies
-  // writes in the order it took them and reports them in that order too, so a
-  // record still unmatched by now has no echo left to wait for.
+  // A backend reports writes in the order it took them, so a record still unmatched has no echo left.
   pendingOwnWrites.current.splice(0, matched + 1)
 
   return true
 }
 
-// Builds the change handler. Not a hook, despite living next to one.
 function createStorageHandler<T>(
   itemKey: string,
   storageKey: string,
@@ -128,9 +78,7 @@ function createStorageHandler<T>(
     for (const [key, change] of Object.entries(changes)) {
       if (key !== storageKey) continue
 
-      // Ahead of the echo check, which needs an entry to match and a removal has
-      // none. A removal is never one of this hook's own writes anyway: only the
-      // entries it stores are recorded.
+      // Ahead of the echo check, which needs an entry to match and a removal has none.
       if (change.newValue === null || change.newValue === undefined) {
         applyRemoval<T>(change, itemKey, applyValue, latestInitialValue)
         continue
@@ -153,12 +101,7 @@ export default function useStorageHandler<T>(
   initialValue: T | (() => T),
   pendingOwnWrites: React.RefObject<string[]>,
 ): void {
-  // A removal restores the initial value the hook holds now, the same one the
-  // key-change path reads, so a caller whose default travels with its data gets
-  // that record's default back rather than the mounted one. Tracked through a ref
-  // rather than a dependency because an inline object or factory has a new
-  // identity every render, which would tear the subscription down and rebuild it;
-  // written during render, as the key the hook is rendering for is.
+  // A ref, not a dependency: an inline initial value changes identity every render and would churn it.
   const latestInitialValue = useRef(initialValue)
 
   latestInitialValue.current = initialValue