@eifi1/ui-kit 0.51.6 → 0.52.0

package/src/notifications/push-device-setting.tsx

@@ -11,7 +11,7 @@ import { DialogFrame } from "../components/dialog-frame";
 import { COMMIT_EXCEPT_BILLING } from "../components/write-lock";
 import { CARD_DESCRIPTION_CLASS } from "../settings/settings-card-classes";
 import { SettingsCardTitle } from "../settings/settings-heading";
-import { useMounted } from "../account/account-parts";
+import { useMounted } from "../hooks/use-mounted";
 import { describeFailure, FailureLine, useNotificationsLabels } from "./notification-parts";
 import type { NotificationsLabels } from "./notifications-labels";
 import { PushDeviceError } from "./use-push-device";

package/src/notifications/push-devices-setting.tsx

@@ -1,21 +1,23 @@
-import { useEffect, useRef, useState } from "react";
-import type { ComponentPropsWithRef, KeyboardEvent, ReactNode } from "react";
+import { useRef, useState } from "react";
+import type { ComponentPropsWithRef, ReactNode } from "react";
 import { MonitorSmartphone } from "lucide-react";
 
-import { useKitLabels, useKitLocale, type LabelOverride } from "../i18n/kit-labels";
+import { useKitLabels, type LabelOverride } from "../i18n/kit-labels";
 import { DEFAULT_COMMON_LABELS } from "../i18n/shared-labels";
 import { cn } from "../lib/cn";
-import { formatDate } from "../lib/format";
+import { useDayFormatter } from "../lib/day-format";
+import { toDate } from "../lib/format";
 import { Button } from "../components/button";
 import { Card } from "../components/card";
 import { Chip } from "../components/chip";
 import { Disclosure } from "../components/disclosure";
+import { InlineConfirm } from "../components/inline-confirm";
 import { Skeleton } from "../components/skeleton";
 import { Switch } from "../components/switch";
 import { COMMIT_EXCEPT_BILLING } from "../components/write-lock";
 import { CARD_DESCRIPTION_CLASS } from "../settings/settings-card-classes";
 import { SettingsCardTitle } from "../settings/settings-heading";
-import { settle, useMounted } from "../account/account-parts";
+import { settle, useMounted } from "../hooks/use-mounted";
 import { describeFailure, FailureLine, useNotificationsLabels, useWriteOverlay } from "./notification-parts";
 import type { NotificationsLabels } from "./notifications-labels";
 import type { NotificationTypeEntry, NotificationTypesValue, PushDeviceItem } from "./notification-types";
@@ -68,7 +70,8 @@ export interface PushDevicesSettingProps<Id extends string | number = string> ex
   /** `DELETE /notifications/devices/{id}`. Asked first; refresh `devices` once it
    *  resolves. */
   onRemove: (id: Id) => Promise<unknown> | void;
-  /** The dates' text. Default: the provider's locale, medium date. */
+  /** The dates' text. Default: the provider's `formatDate` (the app's date preference),
+   *  else a medium date in the provider's locale and `timeZone`. */
   formatDate?: (date: Date) => string;
   /** Overrides the provider's locale for the default format. */
   locale?: string;
@@ -140,16 +143,17 @@ export function PushDevicesSetting<Id extends string | number = string>({
   const labels = useNotificationsLabels(labelsProp);
   const mutedOverlay = useWriteOverlay<string[]>(devices);
   const common = useKitLabels("common", DEFAULT_COMMON_LABELS);
-  const locale = useKitLocale(localeProp);
+  // The prop, else the provider's `formatDate` (the app's date preference), else the kit's
+  // in the provider's locale and `timeZone` (refactor audit 2026-10-30, DUP-2).
+  const day = useDayFormatter(formatDateProp, localeProp);
   const [asking, setAsking] = useState<Id | null>(null);
   const [busyId, setBusyId] = useState<Id | null>(null);
   const [failure, setFailure] = useState<ReactNode>(null);
   const mounted = useMounted();
 
   const dateText = (iso: string): string => {
-    const date = new Date(iso);
-    if (Number.isNaN(date.getTime())) return iso;
-    return formatDateProp ? formatDateProp(date) : formatDate(date, "medium", { locale });
+    const date = toDate(iso);
+    return date ? day(date) : iso;
   };
 
   const remove = (device: PushDeviceItem<Id>) => {
@@ -305,53 +309,27 @@ function DeviceRow<Id extends string | number>({
   /** "Types on this device", under the row (0.46). */
   types: ReactNode;
 }) {
-  const cancelRef = useRef<HTMLButtonElement>(null);
+  // Back to Remove when the confirm leaves, so focus does not fall to <body>.
   const removeRef = useRef<HTMLButtonElement>(null);
-  // Which way the confirm closed: back to Remove, so focus does not fall to <body>.
-  const [returning, setReturning] = useState(false);
-  useEffect(() => {
-    if (asking) cancelRef.current?.focus();
-    else if (returning) removeRef.current?.focus();
-  }, [asking, returning]);
-
-  const leave = () => {
-    setReturning(true);
-    onCancel();
-  };
-  const escapeLeaves = (event: KeyboardEvent<HTMLButtonElement>) => {
-    if (event.key === "Escape") {
-      event.preventDefault();
-      event.stopPropagation();
-      leave();
-    }
-  };
 
   const row = { "data-push-device-id": String(device.id), "data-current": current || undefined };
 
   if (asking) {
     return (
-      <li {...row} className="space-y-2 py-2">
-        <p role="alert" className="text-sm">
-          {labels.removePrompt}
-        </p>
-        <div className="flex flex-wrap gap-2">
-          <Button
-            type="button"
-            size="sm"
-            variant="danger"
-            commit={COMMIT_EXCEPT_BILLING}
-            pending={busy}
-            aria-label={labels.removeItem(name)}
-            onClick={onConfirm}
-            onKeyDown={escapeLeaves}
-          >
-            {labels.remove}
-          </Button>
-          <Button ref={cancelRef} type="button" size="sm" variant="ghost" onClick={leave} onKeyDown={escapeLeaves}>
-            {cancelLabel}
-          </Button>
-        </div>
-      </li>
+      <InlineConfirm
+        as="li"
+        {...row}
+        className="py-2"
+        prompt={labels.removePrompt}
+        confirmLabel={labels.remove}
+        confirmName={labels.removeItem(name)}
+        cancelLabel={cancelLabel}
+        onConfirm={onConfirm}
+        onLeave={onCancel}
+        busy={busy}
+        commit={COMMIT_EXCEPT_BILLING}
+        returnFocusRef={removeRef}
+      />
     );
   }
 
@@ -385,10 +363,7 @@ function DeviceRow<Id extends string | number>({
           commit={COMMIT_EXCEPT_BILLING}
           disabled={blocked}
           aria-label={labels.removeItem(name)}
-          onClick={() => {
-            setReturning(false);
-            onAsk();
-          }}
+          onClick={onAsk}
         >
           {labels.remove}
         </Button>

package/src/notifications/quiet-hours-setting.tsx

@@ -1,5 +1,5 @@
-import { useId, useState } from "react";
-import type { ComponentPropsWithRef, ReactNode } from "react";
+import { useEffect, useId, useRef, useState } from "react";
+import type { ComponentPropsWithRef, KeyboardEvent, ReactNode } from "react";
 
 import type { LabelOverride } from "../i18n/kit-labels";
 import { cn } from "../lib/cn";
@@ -8,7 +8,7 @@ import { TimeInput } from "../components/time-input";
 import { COMMIT_EXCEPT_BILLING } from "../components/write-lock";
 import { CARD_DESCRIPTION_CLASS } from "../settings/settings-card-classes";
 import { SettingsCardTitle } from "../settings/settings-heading";
-import { settle, useMounted } from "../account/account-parts";
+import { settle, useMounted } from "../hooks/use-mounted";
 import { describeFailure, FailureLine, useNotificationsLabels, useWriteOverlay } from "./notification-parts";
 import type { NotificationRegionLabels, NotificationsLabels } from "./notifications-labels";
 import type { NotificationSettingsPatch } from "./notification-types";
@@ -49,7 +49,9 @@ export interface QuietHoursSettingProps extends Omit<ComponentPropsWithRef<"div"
   held?: boolean;
   /**
    * Save one change — `PATCH /notifications/settings`: a time, or `null` when cleared.
-   * Never a zone. The field shows the new value while the call runs and goes back if it
+   * Never a zone. Called when a time is ENTERED — the field left, or Enter, or the card
+   * unmounted with a time still typed — never per keystroke, and one call per field at a
+   * time (0.52). The field shows the new value while the call runs and goes back if it
    * rejects.
    */
   onChange: (patch: NotificationSettingsPatch) => Promise<unknown> | void;
@@ -77,8 +79,13 @@ type QuietField = "quiet_hours_start" | "quiet_hours_end";
  * only** — the zone of the device last used, else `Europe/Zurich`. The card names it
  * read-only and never sends one; there is no picker and no "Use it".
  *
- * - **Two times**, each saved as it is entered; a cleared time sends `null`. While only
- *   one is set the card says so: the window fails open until both are.
+ * - **Two times**, each saved when it is entered — on leaving the field or on Enter, or
+ *   when the card goes while it is still typed — and a cleared time sends `null`. While
+ *   only one is set the card says so: the window fails open until both are.
+ * - **One request per field at a time** (0.52): a time entered while that field's save
+ *   runs waits for it, and only the latest waiting one is sent. Each input event used to
+ *   PATCH — typing "30" over 22:00's minutes sent 22:03 and 22:30, and whichever answer
+ *   landed last stayed on the server (refactor audit 2026-10-30, FLW-4).
  * - **The zone** shows while a time is set: `zone`, else `fallbackZone`.
  *
  * Under a write lock the fields are `commit` controls exempt from billing.
@@ -103,32 +110,83 @@ export function QuietHoursSetting({
   const mounted = useMounted();
   const id = useId();
 
-  const shown = (field: QuietField, server: string | null) =>
-    overlay.has(field) ? (overlay.get(field) ?? null) : server;
-  const startShown = shown("quiet_hours_start", start);
-  const endShown = shown("quiet_hours_end", end);
+  // What is typed and not yet entered, per field: the field shows it, nothing is sent.
+  const [drafts, setDrafts] = useState<Partial<Record<QuietField, string>>>({});
+  // Per field: whether a save runs, and the latest time entered while it did (own key =
+  // one is waiting). Refs: a save's answer reads them after renders it did not see.
+  const running = useRef<Partial<Record<QuietField, boolean>>>({});
+  const waiting = useRef<Partial<Record<QuietField, string | null>>>({});
+
+  const server = (field: QuietField) => (field === "quiet_hours_start" ? start : end);
+  const saved = (field: QuietField) => (overlay.has(field) ? (overlay.get(field) ?? null) : server(field));
+  const shown = (field: QuietField) => drafts[field] ?? saved(field) ?? "";
+  const startShown = shown("quiet_hours_start");
+  const endShown = shown("quiet_hours_end");
   const accountZone = zone ?? fallbackZone;
 
-  const save = (patch: NotificationSettingsPatch) => {
-    const fields = Object.keys(patch) as QuietField[];
-    setFailure(null);
-    for (const field of fields) overlay.set(field, patch[field] ?? null);
-    settle(() => onChange(patch)).then(
-      () => {
-        if (mounted.current) for (const field of fields) overlay.settle(field, true);
-      },
-      (error: unknown) => {
-        if (!mounted.current) return;
-        for (const field of fields) overlay.settle(field, false);
-        setFailure(describeFailure(describeError?.(error), labels.failed));
-      },
+  const send = (field: QuietField, value: string | null) => {
+    running.current[field] = true;
+    if (mounted.current) setFailure(null);
+    settle(() => onChange({ [field]: value })).then(
+      () => done(field, true),
+      (error: unknown) => done(field, false, error),
     );
   };
 
-  const saveTime = (field: "quiet_hours_start" | "quiet_hours_end", value: string) => {
-    const next = value || null;
-    if (next === shown(field, field === "quiet_hours_start" ? start : end)) return;
-    save({ [field]: next });
+  /** A save answered: the waiting time goes next — even after an unmount, it is what the
+   *  person entered last — and supersedes this answer, a failure included. */
+  const done = (field: QuietField, ok: boolean, error?: unknown) => {
+    running.current[field] = false;
+    if (Object.prototype.hasOwnProperty.call(waiting.current, field)) {
+      const next = waiting.current[field] ?? null;
+      delete waiting.current[field];
+      send(field, next);
+      return;
+    }
+    if (!mounted.current) return;
+    overlay.settle(field, ok);
+    if (!ok) setFailure(describeFailure(describeError?.(error), labels.failed));
+  };
+
+  /** `draft` entered: the time it names, or `undefined` when that is what the field
+   *  already holds and nothing is to be sent. Queued behind the field's running save. */
+  const save = (field: QuietField, draft: string): string | null | undefined => {
+    const next = draft || null;
+    if (next === saved(field)) return undefined;
+    if (running.current[field]) waiting.current[field] = next;
+    else send(field, next);
+    return next;
+  };
+
+  /** The typed time, entered: saved unless it is what the field already holds. */
+  const enter = (field: QuietField) => {
+    const draft = drafts[field];
+    if (draft === undefined) return;
+    setDrafts((current) => {
+      const rest = { ...current };
+      delete rest[field];
+      return rest;
+    });
+    const next = save(field, draft);
+    if (next !== undefined) overlay.set(field, next);
+  };
+
+  // Leaving the card is leaving the field. A focused input removed with its card fires no
+  // blur — Escape on the settings sheet, a shortcut that navigates — and the time it showed
+  // as typed was dropped (0.52 code review, quiet-hours-setting.tsx; save-on-blur is FLW-4's
+  // decision). So whatever is still typed is entered as the card goes. A ref to this
+  // render's drafts and saved values, assigned in an effect, never during render.
+  const leave = useRef<() => void>(() => {});
+  useEffect(() => {
+    leave.current = () => {
+      for (const [field, draft] of Object.entries(drafts) as [QuietField, string][]) save(field, draft);
+    };
+  });
+  useEffect(() => () => leave.current(), []);
+
+  const type = (field: QuietField, value: string) => setDrafts((current) => ({ ...current, [field]: value }));
+  const enterOnEnter = (field: QuietField, event: KeyboardEvent<HTMLInputElement>) => {
+    if (event.key === "Enter") enter(field);
   };
 
   const anySet = Boolean(startShown || endShown);
@@ -144,19 +202,23 @@ export function QuietHoursSetting({
         <TimeInput
           id={`${id}-start`}
           label={labels.quietFrom}
-          value={startShown ?? ""}
+          value={startShown}
+          onValueChange={(value) => type("quiet_hours_start", value)}
+          onBlur={() => enter("quiet_hours_start")}
+          onKeyDown={(event) => enterOnEnter("quiet_hours_start", event)}
           disabled={disabled}
           commit={COMMIT_EXCEPT_BILLING}
-          onValueChange={(value) => saveTime("quiet_hours_start", value)}
           className="w-36"
         />
         <TimeInput
           id={`${id}-end`}
           label={labels.quietUntil}
-          value={endShown ?? ""}
+          value={endShown}
+          onValueChange={(value) => type("quiet_hours_end", value)}
+          onBlur={() => enter("quiet_hours_end")}
+          onKeyDown={(event) => enterOnEnter("quiet_hours_end", event)}
           disabled={disabled}
           commit={COMMIT_EXCEPT_BILLING}
-          onValueChange={(value) => saveTime("quiet_hours_end", value)}
           className="w-36"
         />
       </div>

package/src/notifications/unsubscribe-panel.tsx

@@ -4,12 +4,13 @@ import { CheckCircle2, Link2Off } from "lucide-react";
 
 import type { LabelOverride } from "../i18n/kit-labels";
 import { cn } from "../lib/cn";
-import { errorBodyWithCode, httpStatusOf } from "../auth/auth-errors";
+import { errorBodyWithCode } from "../auth/auth-errors";
+import { httpStatusOf } from "../lib/http-status";
 import { INTRO_CLASS, OUTCOME_CLASS, STATUS_HEADING_CLASS, useFocusWhen } from "../auth/status-parts";
 import type { AuthHeadingLevel } from "../auth/status-parts";
 import { Button } from "../components/button";
 import { EmptyState } from "../components/empty-state";
-import { useMounted } from "../account/account-parts";
+import { useMounted } from "../hooks/use-mounted";
 import { FailureLine, useNotificationsLabels } from "./notification-parts";
 import type { NotificationsLabels } from "./notifications-labels";
 
@@ -154,11 +155,7 @@ export function UnsubscribePanel({
           tone="success"
           icon={<CheckCircle2 />}
           title={shown === "stopped-these" ? labels.stoppedThese : labels.stoppedAll(appName)}
-          hint={
-            <>
-              {labels.accountMail} {labels.turnBackOn}
-            </>
-          }
+          hint={labels.stoppedHint(labels.accountMail, labels.turnBackOn)}
           action={settingsLink}
           className={OUTCOME_CLASS}
         />

package/src/notifications/use-push-device.ts

@@ -1,7 +1,7 @@
 import { useCallback, useEffect, useRef, useState } from "react";
 
 import { useMediaQuery } from "../hooks/use-media-query";
-import { httpStatusOf } from "../auth/auth-errors";
+import { httpStatusOf } from "../lib/http-status";
 import { PUSH_SUBSCRIPTION_CHANGED, keyBytes, pushSubscriptionInput as inputOf } from "./push-worker";
 import type { PushSubscriptionInput } from "./push-worker";
 
@@ -85,7 +85,8 @@ export interface PushDevice {
    *  the permission was not granted or push is off on the server; rejects with a
    *  {@link PushDeviceError} or the app's request's error. */
   enable: () => Promise<boolean>;
-  /** Tell the server first, then the browser, so a dropped device stops at once. */
+  /** Tell the server first, then the browser, so a dropped device stops at once. At a
+   *  sign-out, with no card mounted: {@link releaseThisDevicePush}. */
   disable: () => Promise<void>;
   sendTest: () => Promise<{ sent: number }>;
 }
@@ -152,6 +153,78 @@ async function activeRegistration(): Promise<ServiceWorkerRegistration> {
 
 const defaultEndpointTaken = (error: unknown) => httpStatusOf(error) === 409;
 
+/**
+ * Drop this browser's subscription when the person turns push off: the server first, so a
+ * dropped device stops receiving even if the browser's unsubscribe fails, then the
+ * browser, cut at 15 s. Whether there was one. A refused server keeps the browser's
+ * subscription: the card says the turn-off failed, still reads on, and the person tries
+ * again. {@link usePushDevice}'s `disable`; a sign-out has its own
+ * ({@link releaseThisDevicePush}).
+ */
+async function releaseSubscription(unregister: (endpoint: string) => Promise<unknown>): Promise<boolean> {
+  const registration = await activeRegistration();
+  const subscription = await registration.pushManager.getSubscription();
+  if (!subscription) return false;
+  await unregister(subscription.endpoint);
+  await within(subscription.unsubscribe(), PUSH_TIMEOUT_MS, "push_timeout");
+  return true;
+}
+
+/**
+ * Release this browser's push at an EXPLICIT sign-out (0.52, docs/notifications-
+ * harmonization.md §10.6; refactor audit 2026-10-30, FLW-2) — without the settings card
+ * mounted, which `usePushDevice().disable` needs.
+ *
+ * A sign-out left the subscription registered to the account, so the device went on
+ * showing that account's notifications, title and body (keksdose: invoices, bookings,
+ * shares), to whoever used it next — while the same sign-out wiped the mirror, the outbox
+ * and the query cache "for the next person on this device".
+ *
+ * Call it with the app's `unregister` (`POST /notifications/devices/unregister
+ * {endpoint}`) BEFORE the session is cleared, while the token is still valid:
+ *
+ *     async function logOut() {
+ *       await releaseThisDevicePush(api.unregisterDevice).catch(() => undefined);
+ *       clear();
+ *     }
+ *
+ * The server first, then the browser — and the browser EVEN WHEN THE SERVER REFUSED (0.52
+ * code review, this file): `disable`'s order left a sign-out on a flaky network, or one
+ * that met a 5xx, with the device still subscribed. Unsubscribed, the push service answers
+ * the server's next send with 410 and the server prunes the row. The browser's unsubscribe
+ * is cut at 15 s (`PushDeviceError("push_timeout")`). Then it tells every mounted
+ * {@link usePushDevice} ({@link PUSH_SUBSCRIPTION_CHANGED}).
+ *
+ * Resolves whether this browser held a subscription; `false` at once where push is
+ * unsupported or was never set up — no service worker registration, or none ever active
+ * (0.52 code review: most devices, which used to reject with `no_service_worker`, after
+ * 10 s for a worker stuck installing). It asks the registration, not `ready`: a
+ * subscription belongs to the registration, and a sign-out waits for no worker. Rejects
+ * as the app's request did — once the browser has let go — or with `push_timeout`. Best
+ * effort at a sign-out: catch it, a sign-out must not stop on push.
+ *
+ * Only an explicit sign-out (Marcel's decision 2 of the 2026-10-30 audit): a session that
+ * merely expired keeps its device, and whoever signs back in turns push on again.
+ */
+export async function releaseThisDevicePush(unregister: (endpoint: string) => Promise<unknown>): Promise<boolean> {
+  if (!pushSupported()) return false;
+  try {
+    const registration = await navigator.serviceWorker.getRegistration();
+    // A worker never active holds no subscription: `subscribe` needs an active one.
+    if (!registration?.active) return false;
+    const subscription = await registration.pushManager.getSubscription();
+    if (!subscription) return false;
+    try {
+      await unregister(subscription.endpoint);
+    } finally {
+      await within(subscription.unsubscribe(), PUSH_TIMEOUT_MS, "push_timeout");
+    }
+    return true;
+  } finally {
+    notifyPushSubscriptionChanged();
+  }
+}
+
 /**
  * This browser's push for the signed-in account. Hand it one function per endpoint
  * (§3.8); {@link PushDeviceSetting} draws it, and an app's own card may use it too.
@@ -344,14 +417,7 @@ export function usePushDevice(options: UsePushDeviceOptions): PushDevice {
     if (!supported) return;
     setBusy(true);
     try {
-      const registration = await activeRegistration();
-      const subscription = await registration.pushManager.getSubscription();
-      if (subscription) {
-        // The server first: a dropped device stops receiving even if the browser's
-        // unsubscribe below fails.
-        await latest.current.unregister(subscription.endpoint);
-        await within(subscription.unsubscribe(), PUSH_TIMEOUT_MS, "push_timeout");
-      }
+      await releaseSubscription((endpoint) => latest.current.unregister(endpoint));
       if (mounted.current) {
         setSubscribed(false);
         setForeignSubscription(false);

package/src/offline/query-persistence.ts

@@ -2,6 +2,7 @@ import { createAsyncStoragePersister } from "@tanstack/query-async-storage-persi
 import type { QueryClient } from "@tanstack/react-query";
 import type { PersistedClient, PersistQueryClientOptions } from "@tanstack/react-query-persist-client";
 import { del, get, keys, set } from "idb-keyval";
+import { listenOn, postOnce } from "../lib/broadcast";
 
 /**
  * The persisted TanStack Query cache, keksdose's policy as a kit helper
@@ -101,7 +102,9 @@ export interface QueryPersistence {
   /** Everything `<PersistQueryClientProvider persistOptions>` needs. */
   persistOptions: Omit<PersistQueryClientOptions, "queryClient">;
   /** Sign-out: stops writing under this key, empties the in-memory cache and deletes this
-   *  key's persisted copy. Best-effort; never throws. */
+   *  key's persisted copy. In every tab (0.52): the persistences of this key in the other tabs
+   *  stop writing too, and delete the key once more after any save of theirs under way.
+   *  Best-effort; never throws. */
   clear: (queryClient: QueryClient) => Promise<void>;
   /** The company switch (or any change of key without a sign-out): stops writing under this
    *  key — a save already scheduled is dropped too — and empties the in-memory cache, so
@@ -223,6 +226,31 @@ export function createQueryPersistence({
   // throttled save of the emptied cache) is dropped. A restore re-arms it.
   let retired = false;
 
+  // 0.52 (refactor audit 2026-10-30, FLW-1): `retired` lived in this tab alone, so a sign-out
+  // in one tab deleted the key and another tab's persister wrote its in-memory cache straight
+  // back under it. While armed, a persistence listens on a channel named after its key; a
+  // `clear` there retires it, and it deletes the key once more — IndexedDB runs a save of its
+  // own already under way first. A `leave` posts nothing: another tab may still be on that
+  // company. Without BroadcastChannel, as before 0.52.
+  const across = `eifi1-query-cache:${key}`;
+  let unlisten: (() => void) | null = null;
+
+  const retire = () => {
+    retired = true;
+    unlisten?.();
+    unlisten = null;
+  };
+
+  const listen = () => {
+    unlisten ??= listenOn(across, (data) => {
+      if (data !== "clear") return;
+      retire();
+      Promise.resolve()
+        .then(() => storage.removeItem(key))
+        .catch(() => undefined);
+    });
+  };
+
   const keyAllowed = (queryKey: readonly unknown[]) =>
     !denied.has(String(queryKey[0])) && (shouldPersistKey ? shouldPersistKey(queryKey) : true);
 
@@ -313,6 +341,7 @@ export function createQueryPersistence({
       // Only the provider's restore reads: mounting this persistence again re-arms it.
       getItem: async (k) => {
         retired = false;
+        listen();
         return (await storage.getItem(k)) ?? null;
       },
       setItem: async (k, v) => {
@@ -329,7 +358,7 @@ export function createQueryPersistence({
   });
 
   const leave = async (queryClient: QueryClient) => {
-    retired = true;
+    retire();
     try {
       queryClient.clear();
     } catch {
@@ -338,7 +367,10 @@ export function createQueryPersistence({
   };
 
   const clear = async (queryClient: QueryClient) => {
-    retired = true;
+    // Retired first, so this tab's own channel is closed and does not hear its `clear`.
+    retire();
+    // Before this tab's delete: the other tabs stop writing as early as they can.
+    postOnce(across, "clear");
     try {
       queryClient.clear();
       await persister.removeClient();

package/src/rhf/fields.tsx

@@ -791,7 +791,11 @@ function DateControl({
   );
 }
 
-/** The kit's {@link DatePicker}, holding an ISO `"YYYY-MM-DD"` string. */
+/**
+ * The kit's {@link DatePicker}, holding an ISO `"YYYY-MM-DD"` string. `commit` and
+ * `disabledReason` are the picker's own (0.52, refactor audit 2026-10-30, API-3): a date
+ * that saves itself stays focusable under a lock and says why.
+ */
 export function RhfDateField<
   TFieldValues extends FieldValues = FieldValues,
   TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
@@ -893,9 +897,11 @@ export type RhfDateRangePickerProps<
  *    pick, which would mark (and, with `mode: "onTouched"`, validate) an end the user
  *    is still choosing.
  *
- * In `commit="immediate"` mode (the picker's default) the first calendar click is
- * reported on its own, so the form holds `(from, emptyValue)` until the second; with
- * `commit="apply"` nothing reaches the form until Apply.
+ * Without `apply` (the picker's default) the first calendar click is reported on its
+ * own, so the form holds `(from, emptyValue)` until the second; with `apply` nothing
+ * reaches the form until Apply. `apply` was `commit="apply"` until 0.52 (deprecated, gone
+ * in 0.53): `commit` is now the write lock's, as on every other binding — with
+ * `disabledReason`, the picker's own (refactor audit 2026-10-30, API-3).
  *
  * The common props (`label`, `hint`, `required`, `disabled`, `excludeWhenDisabled`,
  * `control`, `className`) apply to the pair; `rules` are per field.
@@ -1460,6 +1466,7 @@ function MonthControl({
  * lookup until 0.34, API-3), so focus-on-error lands there; the form's error paints the
  * trigger and is the shell's message; the hint is the shell's description; neither is
  * handed to the picker, so its box never changes. Picking marks the field touched.
+ * `commit` and `disabledReason` are the picker's own (0.52, API-3).
  *
  * ```tsx
  * <RhfMonthPicker name="fiscalYear" label="Fiscal year" mode="year" valueAsNumber

package/src/search/command-palette.tsx

@@ -10,6 +10,8 @@ import { useFocusTrap } from "../hooks/use-focus-trap";
 import { useBodyScrollLock } from "../hooks/use-body-scroll-lock";
 import { takeEscape, useDismissLayer } from "../hooks/use-dismiss";
 import { isImeEnter } from "../lib/ime";
+// A provider's answer is a promise: the only case with anything to wait for.
+import { isThenable } from "../lib/thenable";
 import { useKitLabels, type LabelOverride } from "../i18n/kit-labels";
 import { DEFAULT_COMMAND_PALETTE_LABELS } from "./command-palette-labels";
 
@@ -106,10 +108,6 @@ export { DEFAULT_COMMAND_PALETTE_LABELS };
  */
 export type CommandPaletteDensity = "compact" | "comfortable";
 
-/** A provider's answer is a promise — the only case with anything to wait for. */
-const isThenable = (value: unknown): value is PromiseLike<unknown> =>
-  typeof (value as PromiseLike<unknown> | null)?.then === "function";
-
 /** The defaults minus `dialog`, so a resolved `dialog` means someone SUPPLIED one —
  *  see the dialog's `aria-label` for why that distinction matters. */
 const { dialog: DEFAULT_DIALOG_NAME, ...DEFAULTS_WITHOUT_DIALOG } = DEFAULT_COMMAND_PALETTE_LABELS;