@eifi1/ui-kit 0.39.0 → 0.40.0

package/src/feedback/feedback-row-detail.tsx

@@ -237,7 +237,8 @@ export function feedbackPageUrl(context: FeedbackContext | null | undefined): st
  * keyed by URL, a React key clash keksdose had).
  */
 export function feedbackAttachmentUrls(
-  row: Pick<FeedbackRecord, "screenshot_url" | "attachment_urls" | "body">,
+  row: Pick<FeedbackRecord, "screenshot_url" | "attachment_urls" | "body"> &
+    Partial<Pick<FeedbackRecord, "replies">>,
 ): string[] {
   const urls = [
     ...(row.screenshot_url ? [row.screenshot_url] : []),
@@ -245,6 +246,11 @@ export function feedbackAttachmentUrls(
     // that predates it (keksdose dev #578).
     ...(row.attachment_urls ?? []),
     ...splitBodyAttachments(row.body).urls,
+    // 0.40 (§10.3): a rework entry's one file, in entry order — where the rework
+    // pictures of the body were before.
+    ...(row.replies ?? []).flatMap((reply) =>
+      reply.kind === "rework" && reply.attachment_url ? [reply.attachment_url] : [],
+    ),
   ];
   return [...new Set(urls)];
 }
@@ -330,8 +336,9 @@ export interface FeedbackRowAccess {
   /** The admin on the inbox (`canEdit`): since 0.38 the reply composer (the outcome
    *  itself is frozen, §9.7). */
   canEditOutcome: boolean;
-  /** "Rework": the admin or the author, on an answered row
-   *  ({@link FEEDBACK_REWORKABLE_STATUSES}) — §3.4, anyone else gets the server's 403. */
+  /** "Rework": the author, on an answered row ({@link FEEDBACK_REWORKABLE_STATUSES}).
+   *  Since 0.40 (§10.2 decision 6) the author's only — an admin sends a report back with
+   *  a reply whose status is `REWORK`; the server answers anyone else 403. */
   canRework: boolean;
   /** The status pills: the admin on the inbox; everyone else sees them read-only. */
   canChangeStatus: boolean;
@@ -356,7 +363,7 @@ export function feedbackRowAccess(
     isAuthor,
     canEditDescription: isAuthor && FEEDBACK_AUTHOR_EDITABLE_STATUSES.includes(row.status),
     canEditOutcome: canEdit,
-    canRework: (canEdit || isAuthor) && FEEDBACK_REWORKABLE_STATUSES.includes(row.status),
+    canRework: isAuthor && FEEDBACK_REWORKABLE_STATUSES.includes(row.status),
     canChangeStatus: canEdit,
   };
 }
@@ -396,11 +403,22 @@ export type FeedbackUpload = (file: File) => Promise<string>;
 
 /* ── Send for rework (§4.4.5) ─────────────────────────────────────────────── */
 
+/** 0.40 (§10.3): `POST /feedback/{id}/rework` — the trimmed note and the uploaded file's
+ *  URL. Return the promise: the section closes when it resolves and keeps the note when
+ *  it rejects (the toast is the app's: the server's `detail`, else
+ *  `feedbackToast.updateFailed`). */
+export type FeedbackReworkSend = (note: string, attachmentUrl?: string) => void | Promise<unknown>;
+
 export interface FeedbackReworkSectionProps {
   /** The row being sent back: its id, and the body the round is appended to. */
   row: Pick<FeedbackRecord, "id" | "body">;
-  /** The PATCH — see {@link FeedbackDetailUpdate}. Called with `{ id, body }` only. */
-  onUpdate: FeedbackDetailUpdate;
+  /** 0.40: the rework as an entry of its own — see {@link FeedbackReworkSend}. With it,
+   *  `onUpdate` is not called. */
+  onRework?: FeedbackReworkSend;
+  /** The PATCH — see {@link FeedbackDetailUpdate}. Called with `{ id, body }` only, and
+   *  only without `onRework`: the legacy append (§3.4), which server-kit 0.13 still
+   *  turns into an entry for one release. Optional since 0.40; pass one of the two. */
+  onUpdate?: FeedbackDetailUpdate;
   /** The PATCH is in flight (`update.isPending`). The upload adds its own. */
   pending?: boolean;
   /** The upload. Left out, the note goes without a file field. */
@@ -422,7 +440,7 @@ export interface FeedbackReworkSectionProps {
 }
 
 /**
- * The rework editor (§4.4.5): the submitter — or the admin — sends an answered report
+ * The rework editor (§4.4.5): the submitter sends an answered report
  * back with a note and at most one file, and the server reopens it (§3.4, keksdose
  * `submitRework`, `feedback-page.tsx:350`).
  *
@@ -432,6 +450,9 @@ export interface FeedbackReworkSectionProps {
  *   uploaded FIRST and awaited: a body naming a file that never arrived would be a
  *   rework whose evidence is missing, and the upload is the half that fails on its
  *   own. If it fails nothing is sent and the toast says so; the note stays in the box.
+ * - **0.40: an entry of its own** (§10.3) — with `onRework`, the note and the file's URL
+ *   go to `POST /feedback/{id}/rework` and the body is not touched. Without it, the
+ *   legacy append below, which server-kit 0.13 still converts (one minor).
  * - **The body alone goes in the PATCH** — {@link appendRework}'s strict extension of
  *   the current body, which is how the server recognises the append and reopens the
  *   row. Never a `status` (kastlan's client sent `OPEN`; an author may not write one,
@@ -443,6 +464,7 @@ export interface FeedbackReworkSectionProps {
  */
 export function FeedbackReworkSection({
   row,
+  onRework,
   onUpdate,
   pending = false,
   onUpload,
@@ -456,6 +478,7 @@ export function FeedbackReworkSection({
   const labels = useFeedbackDetailLabels(labelsProp);
   const toasts = useFeedbackToastLabels();
   const [uploading, setUploading] = useState(false);
+  const [sending, setSending] = useState(false);
   // The body as it is NOW, not as it was when Send was pressed: the list can refresh
   // while the file uploads, and an append to a stale body is no longer a strict
   // extension of the stored one — the server would read it as an edit, and refuse it.
@@ -490,6 +513,21 @@ export function FeedbackReworkSection({
         setUploading(false);
       }
     }
+    if (onRework) {
+      // 0.40 (§10.3): the entry, not the body — the server checks the URL (a 422 outside
+      // the app's attachment prefix).
+      setSending(true);
+      try {
+        await onRework(note, url ?? undefined);
+      } catch {
+        return; // The app's toast; the note stays in the box.
+      } finally {
+        setSending(false);
+      }
+      onSent?.();
+      return;
+    }
+    if (!onUpdate) return;
     let body: string | null;
     try {
       body = appendRework(latestBody.current, note, url);
@@ -511,7 +549,7 @@ export function FeedbackReworkSection({
         initial=""
         required
         commit={commit}
-        pending={pending || uploading}
+        pending={pending || uploading || sending}
         onSave={(value, file) => void send(value, file)}
         onCancel={onCancel}
         saveLabel={labels.reworkSend}
@@ -593,6 +631,15 @@ export interface FeedbackRowDetailProps {
   onReply?: (body: string, status?: FeedbackStatus) => void | Promise<unknown>;
   /** 0.38: the reply is in flight. */
   replying?: boolean;
+  /**
+   * 0.40 (§10.3): `POST /feedback/{id}/rework` — the author's rework as an entry of its
+   * own (see {@link FeedbackReworkSend}). The **Rework** button shows only to the author
+   * on an answered row, and only where the reply composer is not shown (§10.2 decision 6:
+   * an admin answering a report sends it back with a reply whose status is `REWORK`).
+   * Left out, the rework goes through `onUpdate` as the legacy body append — for one
+   * minor, while the server converts it.
+   */
+  onRework?: FeedbackReworkSend;
   /** 0.38: the report's comments — the app's `FeedbackCommentThread` — in a section of
    *  their own under the replies. A thread here draws the comments alone (0.38.1): the
    *  Replies section above has the replies, so whatever `replies` the thread is handed
@@ -647,6 +694,7 @@ export function FeedbackRowDetail({
   showSubject = true,
   onReply,
   replying = false,
+  onRework,
   comments,
   onPublicChange,
   labels: labelsProp,
@@ -687,7 +735,11 @@ export function FeedbackRowDetail({
   // 0.38, whose frozen outcome is shown as it is, read-only.
   const replies = row.replies;
   const commentLabels = useKitLabels("feedbackComments", DEFAULT_FEEDBACK_COMMENTS_LABELS);
-  const showRework = access.canRework && reworking;
+  // 0.40 (§10.2 decision 6): whoever has the reply composer answers with it — REWORK is
+  // one of its statuses — so the Rework button is for an author without it.
+  const composerShown = Boolean(replies && access.canEditOutcome && onReply);
+  const canRework = access.canRework && !composerShown;
+  const showRework = canRework && reworking;
 
   return (
     <FeedbackDetail className={className}>
@@ -791,7 +843,7 @@ export function FeedbackRowDetail({
           ) : (
             <FeedbackProse>{row.outcome || undefined}</FeedbackProse>
           )}
-          {replies && access.canEditOutcome && onReply && (
+          {composerShown && replies && onReply && (
             <FeedbackReplyComposer
               key={row.id}
               status={row.status}
@@ -801,9 +853,9 @@ export function FeedbackRowDetail({
               commit={commit}
             />
           )}
-          {((access.canRework && !reworking) || pageHref) && (
+          {((canRework && !reworking) || pageHref) && (
             <div className="flex flex-wrap gap-2">
-              {access.canRework && !reworking && (
+              {canRework && !reworking && (
                 <Button
                   type="button"
                   variant="secondary"
@@ -836,6 +888,7 @@ export function FeedbackRowDetail({
       {showRework && (
         <FeedbackReworkSection
           row={row}
+          onRework={onRework}
           onUpdate={onUpdate}
           pending={pending}
           onUpload={onUpload}

package/src/feedback/feedback-table-labels.ts

@@ -5,7 +5,7 @@
 import type { FeedbackPageLabels } from "./feedback-table";
 
 export const DEFAULT_FEEDBACK_PAGE_LABELS: FeedbackPageLabels = {
-  title: "Feedback",
+  title: "Feedback inbox",
   myTitle: "My feedback",
   columnId: "#",
   columnDate: "Date",

package/src/feedback/feedback-table.tsx

@@ -28,7 +28,7 @@ import {
   type FeedbackCategoryLabels,
   type FeedbackStatusLabels,
 } from "./feedback-labels";
-import { FEEDBACK_AWAITING_STATUSES, reworkCount, type FeedbackContext, type FeedbackRecord } from "./feedback-record";
+import { FEEDBACK_AWAITING_STATUSES, feedbackReworkCount, type FeedbackContext, type FeedbackRecord } from "./feedback-record";
 import type { FeedbackStatusChange } from "./feedback-status-undo";
 import { feedbackPageHref, feedbackPagePath } from "./feedback-row-detail";
 import type { CommitScope } from "../components/write-lock";
@@ -70,7 +70,8 @@ import { DEFAULT_FEEDBACK_PUBLIC_LABELS } from "./feedback-public-labels";
  * `de-CH.json`, ss never ß).
  */
 export interface FeedbackPageLabels {
-  /** The admin inbox's page title, `/feedback`. de-CH: "Feedback" */
+  /** The admin inbox's page title, `/feedback` — the menu's "Feedback inbox" (0.40,
+   *  §10.2 decision 11; "Feedback" before). de-CH: "Feedback-Eingang" */
   title: string;
   /** The user's own list, `/my-feedback`. de-CH: "Mein Feedback" */
   myTitle: string;
@@ -268,7 +269,9 @@ function instant(value: string | null | undefined): number | null {
 /* ── The subject: title + environment chip + rework chip ───────────────────── */
 
 export interface FeedbackSubjectProps {
-  row: Pick<FeedbackRecord, "title" | "body" | "context">;
+  /** `replies` (0.40): the chip counts the rework entries, else the body's blocks —
+   *  {@link feedbackReworkCount}. */
+  row: Pick<FeedbackRecord, "title" | "body" | "context"> & Partial<Pick<FeedbackRecord, "replies">>;
   /**
    * `false` (default): one line — the title truncates and the chips stay whole, as a
    * table cell wants. `true`: the title wraps and the chips flow after its last word, as
@@ -292,7 +295,7 @@ export interface FeedbackSubjectProps {
 export function FeedbackSubject({ row, wrap = false, labels: labelsProp, className }: FeedbackSubjectProps) {
   const labels = useFeedbackPageLabels(labelsProp);
   const env = feedbackEnvironment(row.context);
-  const rounds = reworkCount(row.body ?? "");
+  const rounds = feedbackReworkCount(row);
   const chipClass = wrap ? "ms-1.5 align-middle" : "shrink-0";
   const chips = (
     <>

package/src/feedback/feedback-thread.tsx

@@ -852,7 +852,9 @@ export function ChatComposer({
           }
         }}
       />
-      <div className="flex flex-wrap items-end justify-between gap-2">
+      {/* The `data-chat-composer-*` marks are for a host that lines its slot up with the
+          send button — FeedbackReplyComposer's status Select (#417). */}
+      <div data-chat-composer-actions="" className="flex flex-wrap items-end justify-between gap-2">
         {config || slot != null ? (
           <div className="flex min-w-0 flex-wrap items-end gap-2">
             {config && (
@@ -878,11 +880,13 @@ export function ChatComposer({
         <div className="ms-auto flex items-center gap-2">
           <span
             id={hintId}
+            data-chat-composer-hint=""
             className={size === "sm" ? "sr-only" : "text-xs text-placeholder"}
           >
             {sendOn === "enter" ? labels.sendHintEnter : labels.sendHint(modifier)}
           </span>
           <Button
+            data-chat-composer-send=""
             onClick={send}
             disabled={!canSend}
             commit={commit}

package/src/feedback/feedback-vocabulary.ts

@@ -11,12 +11,13 @@ import {
   MoreHorizontal,
   OctagonAlert,
   PauseCircle,
+  RotateCcw,
   Wrench,
 } from "lucide-react";
 import type { LucideIcon } from "lucide-react";
 
 /**
- * The feedback **vocabulary**: the eight statuses and five categories, the glyph and tone
+ * The feedback **vocabulary**: the nine statuses and five categories, the glyph and tone
  * of each, their orders, and the policy for how a report moves from status to status.
  *
  * Data and plain functions, no components. Until 0.34 this lived at the top of
@@ -27,16 +28,18 @@ import type { LucideIcon } from "lucide-react";
  * feedback-inbox.tsx re-exports every name here, so nothing an app imports has moved.
  */
 
-/** The eight states a report can be in.
+/** The nine states a report can be in.
  *
  *  Shared value for value across the apps on purpose: it is what lets one habit,
  *  and one agent prompt, work on any repo. Five are a chain and three sit off
  *  it — see {@link visibleFeedbackStatuses} for what that buys. `READY` joined in 0.31
  *  (feedback contract §8.2): OPEN is "filed, not yet triaged", READY "released for
- *  implementation", and nobody works an OPEN row. */
+ *  implementation", and nobody works an OPEN row. `REWORK` joined in 0.40 (§10.2
+ *  decisions 2, 4): "sent back, released for work again" — a READY that came back. */
 export type FeedbackStatus =
   | "OPEN"
   | "READY"
+  | "REWORK"
   | "IN_PROGRESS"
   | "IN_EVALUATION"
   | "NEEDS_LIVE_TEST"
@@ -76,6 +79,16 @@ export const FEEDBACK_STATUS_META: Record<
     activeBg: "bg-brand-soft",
     activeText: "text-brand",
   },
+  // Sent back by its author or an admin and released for work again (0.40, feedback
+  // contract §10.2 decision 4): the Rework button's `RotateCcw`, in the danger tint so the
+  // queue shows reworks apart from new reports. Not IN_PROGRESS's warning tint — that is
+  // where a REWORK row moves next — and WONT_DO, the only other red, sits at the far end
+  // with `Ban`.
+  REWORK: {
+    icon: RotateCcw,
+    activeBg: "bg-danger-soft",
+    activeText: "text-danger",
+  },
   IN_PROGRESS: {
     icon: Wrench,
     activeBg: "bg-warning-soft",
@@ -142,8 +155,11 @@ const OFF_CHAIN: FeedbackStatus[] = ["NEEDS_LIVE_TEST", "POSTPONED", "WONT_DO"];
 const FORWARD_CHAIN: FeedbackStatus[] = ["OPEN", "READY", "IN_PROGRESS", "IN_EVALUATION", "DONE"];
 
 /** The next status along the chain, or null at the end (or off it, as `WONT_DO`
- *  is). What a swipe-to-advance gesture commits. */
+ *  is). What a swipe-to-advance gesture commits. `REWORK` (0.40) is not in the chain —
+ *  "advance" from READY still goes to IN_PROGRESS — but it leads there too: a reworked
+ *  row is READY's twin. */
 export function nextFeedbackStatus(current: FeedbackStatus): FeedbackStatus | null {
+  if (current === "REWORK") return "IN_PROGRESS";
   const at = FORWARD_CHAIN.indexOf(current);
   return at !== -1 && at < FORWARD_CHAIN.length - 1 ? FORWARD_CHAIN[at + 1] : null;
 }
@@ -152,7 +168,7 @@ export function nextFeedbackStatus(current: FeedbackStatus): FeedbackStatus | nu
  * The steps that make sense from where a row currently stands.
  *
  * For the compact control in a table cell: it is a glanceable triage affordance,
- * and a row of eight icons in a cell is noise. One step forward, one step back
+ * and a row of nine icons in a cell is noise. One step forward, one step back
  * (so an item can be sent back for rework), and any of the three off-chain
  * verdicts — which is what makes those usable as verdicts at all.
  *
@@ -165,7 +181,12 @@ export function nextFeedbackStatus(current: FeedbackStatus): FeedbackStatus | nu
 export function visibleFeedbackStatuses(current: FeedbackStatus): FeedbackStatus[] {
   const set = new Set<FeedbackStatus>([current]);
   const at = FORWARD_CHAIN.indexOf(current);
-  if (at !== -1) {
+  if (current === "REWORK") {
+    // READY's twin (0.40, §10.2 decision 4): the step that picks the work up, and the
+    // verdicts a released row can still get.
+    set.add("IN_PROGRESS");
+    for (const off of OFF_CHAIN) set.add(off);
+  } else if (at !== -1) {
     if (at < FORWARD_CHAIN.length - 1) set.add(FORWARD_CHAIN[at + 1]);
     if (at > 0) set.add(FORWARD_CHAIN[at - 1]);
     for (const off of OFF_CHAIN) set.add(off);

package/src/hooks/use-long-press.ts

@@ -0,0 +1,126 @@
+import { useCallback, useEffect, useRef, type PointerEvent as ReactPointerEvent } from "react";
+
+// The press-and-hold that puts DataTable's phone cards into selection mode (0.40,
+// keksdose live #421). Taken over from keksdose's register list
+// (frontend/src/shared/hooks/use-long-press.ts, its feedback #153) so the kit's cards
+// and kk's register answer the same gesture the same way: 500 ms, an 8 px dead zone,
+// cancelled by a scroll, the trailing click swallowed.
+
+const LONG_PRESS_MS = 500;
+/** The same 8 px dead zone `useRowSwipe` locks its axis at: the press is dead by the
+ *  time the swipe hook takes pointer capture on its (ancestor) layer. */
+const SLOP_PX = 8;
+
+const movedBeyondSlop = (from: { x: number; y: number }, x: number, y: number) =>
+  Math.hypot(x - from.x, y - from.y) > SLOP_PX;
+
+export interface LongPressResult {
+  handlers: {
+    onPointerDown: (e: ReactPointerEvent) => void;
+    onPointerMove: (e: ReactPointerEvent) => void;
+    onContextMenu: (e: { preventDefault: () => void }) => void;
+  };
+  /** True exactly once after a long press fired: call it from an `onClickCapture` to
+   *  swallow the click the browser still sends when the finger lifts. */
+  consumeClick: () => boolean;
+}
+
+/**
+ * A press-and-hold on a touch row that may ALSO be swipeable.
+ *
+ *  - The cancel listeners live on `window`: `useRowSwipe` captures the pointer on an
+ *    ancestor once a drag resolves to the x axis, after which the pressed element's
+ *    own pointer handlers stop firing, and a timer cancelled only there would fire
+ *    mid-swipe.
+ *  - A scroll cancels too (`touch-action: pan-y` hands vertical panning to the
+ *    browser, which sends `pointercancel`; the capture-phase `scroll` is the backstop).
+ *  - `contextmenu` is suppressed while enabled — Android fires it at ~500 ms. Pair it
+ *    with `select-none [-webkit-touch-callout:none]` on the element: iOS's callout
+ *    only yields to that CSS.
+ */
+export function useLongPress(
+  onLongPress: () => void,
+  { enabled = true, delay = LONG_PRESS_MS }: { enabled?: boolean; delay?: number } = {},
+): LongPressResult {
+  const timer = useRef<number | null>(null);
+  const start = useRef({ x: 0, y: 0 });
+  const fired = useRef(false);
+  const teardown = useRef<(() => void) | null>(null);
+  const cbRef = useRef(onLongPress);
+  useEffect(() => {
+    cbRef.current = onLongPress;
+  });
+
+  const cancel = useCallback(() => {
+    if (timer.current !== null) {
+      window.clearTimeout(timer.current);
+      timer.current = null;
+    }
+    teardown.current?.();
+    teardown.current = null;
+  }, []);
+
+  const onPointerDown = useCallback(
+    (e: ReactPointerEvent) => {
+      // Cleared above every early return: a press whose trailing click never arrives
+      // (the finger lifted over another row) would otherwise leave the latch armed,
+      // and it would eat the next real tap once the card has switched modes.
+      fired.current = false;
+      if (!enabled) return;
+      if (e.pointerType === "mouse" && e.button !== 0) return;
+      cancel();
+      start.current = { x: e.clientX, y: e.clientY };
+
+      const onEnd = () => cancel();
+      const onMove = (ev: PointerEvent) => {
+        if (movedBeyondSlop(start.current, ev.clientX, ev.clientY)) cancel();
+      };
+      window.addEventListener("pointerup", onEnd);
+      window.addEventListener("pointercancel", onEnd);
+      window.addEventListener("pointermove", onMove);
+      window.addEventListener("scroll", onEnd, { capture: true, passive: true });
+      teardown.current = () => {
+        window.removeEventListener("pointerup", onEnd);
+        window.removeEventListener("pointercancel", onEnd);
+        window.removeEventListener("pointermove", onMove);
+        window.removeEventListener("scroll", onEnd, { capture: true });
+      };
+
+      timer.current = window.setTimeout(() => {
+        cancel();
+        fired.current = true;
+        // The swipe stages' haptic vocabulary; absent on iOS Safari.
+        navigator.vibrate?.(20);
+        cbRef.current();
+      }, delay);
+    },
+    [cancel, delay, enabled],
+  );
+
+  // Also on the element: it still cancels if an ancestor stops the native event
+  // before it reaches `window`.
+  const onPointerMove = useCallback(
+    (e: ReactPointerEvent) => {
+      if (timer.current === null) return;
+      if (movedBeyondSlop(start.current, e.clientX, e.clientY)) cancel();
+    },
+    [cancel],
+  );
+
+  const onContextMenu = useCallback(
+    (e: { preventDefault: () => void }) => {
+      if (enabled) e.preventDefault();
+    },
+    [enabled],
+  );
+
+  const consumeClick = useCallback(() => {
+    if (!fired.current) return false;
+    fired.current = false;
+    return true;
+  }, []);
+
+  useEffect(() => cancel, [cancel]);
+
+  return { handlers: { onPointerDown, onPointerMove, onContextMenu }, consumeClick };
+}

package/src/hooks/use-overlay-history.ts

@@ -48,6 +48,16 @@ import { useEffect, useRef } from "react";
  * {@link noteAddress}: an address the overlay LIVED THROUGH (a filter the table wrote
  * while its sheet was up) is still unwound, because the user has acted since.
  *
+ * ## Not undoing the owner's replaces either
+ *
+ * An address the overlay lived through is unwound as an ENTRY, never as an address
+ * (keksdose live #412). A report that writes each tick of its payee sheet into the query
+ * with `setSearchParams(…, { replace: true })` rewrites the overlay's own entry, and the
+ * page entry beneath still carries the address from before the sheet opened — so the
+ * traversal that took our entry away also took every tick with it. See {@link carryOnto}:
+ * whichever way the entry goes (the unwind after a press, or a Back press), the address it
+ * last showed is carried onto the entry it lands on, and the router is told.
+ *
  * ## The traversal is deferred
  *
  * And it is *scheduled* rather than issued, because `history.go()` lands a task
@@ -99,6 +109,10 @@ interface PushedEntry {
   key: string | undefined;
   /** {@link routeOf} the address the marker was placed at. */
   route: string;
+  /** The entry's address as last OBSERVED, after the user's last gesture had run its
+   *  handlers — what a Back press must carry down (see {@link carryOnto}). `href` is
+   *  the snapshot BEFORE the gesture, which the owner's-close check needs instead. */
+  seen: string;
 }
 const pushed: PushedEntry[] = [];
 
@@ -197,10 +211,41 @@ function runUnwind(): void {
     if (taggedSentinel() === null) buryUnder(job.entries);
     return;
   }
+  const bottom = job.entries[0];
+  carry = { href: job.href, idx: bottom.idx, key: bottom.key };
   pendingProgrammatic += 1;
   window.history.go(-job.entries.length);
 }
 
+/** The address an unwind in flight must carry onto the entry it lands on. */
+let carry: { href: string; idx: number | undefined; key: string | undefined } | null = null;
+
+/**
+ * Put `href` — the address the overlay's entry last showed — onto the entry a traversal
+ * has just landed on, and tell the router (keksdose live #412).
+ *
+ * Only the query and the hash can differ: an address naming another page is a
+ * navigation, never carried. And only onto the page entry the overlay was opened over,
+ * which our push copied the router's `{idx, key}` from — a traversal that came to rest
+ * anywhere else is not ours to rewrite.
+ *
+ * The router heard the traversal land on the OLD address in this same event, so a
+ * `replaceState` alone would leave it showing the old query under the new one. A
+ * synthetic `popstate` makes it read the address again; both reads happen in one event
+ * dispatch, so React commits only the second. Ours absorbs it as programmatic.
+ */
+function carryOnto(href: string, mark: { idx: number | undefined; key: string | undefined }): void {
+  const here = currentHref();
+  if (here === href || routeOf(here) !== routeOf(href)) return;
+  const now = routerMark();
+  if (mark.idx !== undefined && now.idx !== undefined && mark.idx !== now.idx) return;
+  if (mark.key !== undefined && now.key !== undefined && mark.key !== now.key) return;
+  const state: unknown = window.history.state;
+  window.history.replaceState(state, "", href);
+  pendingProgrammatic += 1;
+  window.dispatchEvent(new PopStateEvent("popstate", { state }));
+}
+
 function currentHref(): string {
   return typeof window === "undefined" ? "" : window.location.href;
 }
@@ -416,7 +461,25 @@ function noteAddress(): void {
   if (!top || top.dead || !stack.some((e) => e.id === top.id)) return;
   const tag = taggedSentinel();
   // Read without `currentSentinel`'s repair: an observation must not write history.
-  if (tag === top.id || (tag === null && standing === top.id && isStillOn(top))) top.href = currentHref();
+  if (tag === top.id || (tag === null && standing === top.id && isStillOn(top))) {
+    top.href = currentHref();
+    top.seen = top.href;
+  }
+}
+
+/** After the user's gesture has run its handlers: the address its entry now shows —
+ *  what a Back press must carry down (keksdose live #412). Again a little later, for a
+ *  handler that writes the address a task after the event. */
+function noteSeen(): void {
+  const top = pushed[pushed.length - 1];
+  if (!top || top.dead || !stack.some((e) => e.id === top.id)) return;
+  const tag = taggedSentinel();
+  if (tag === top.id || (tag === null && standing === top.id && isStillOn(top))) top.seen = currentHref();
+}
+
+function noteSeenNowAndLater(): void {
+  noteSeen();
+  setTimeout(noteSeen, 0);
 }
 
 function handlePop() {
@@ -428,6 +491,9 @@ function handlePop() {
   lastSeen = routerMark();
   if (pendingProgrammatic > 0) {
     pendingProgrammatic -= 1;
+    const job = carry;
+    carry = null;
+    if (job) carryOnto(job.href, job);
     return;
   }
   closeOnPop();
@@ -451,7 +517,10 @@ function closeOnPop() {
   // The browser consumed this entry, so the overlay's own cleanup has nothing left
   // to unwind and nothing to record as owed.
   consumed.add(top.id);
+  const record = pushed.find((p) => p.id === top.id);
   forgetPushed(top.id);
+  // What the page wrote into the address while we were up stays (#412).
+  if (record && !record.dead) carryOnto(record.seen, record);
   top.close();
 }
 
@@ -460,6 +529,7 @@ function ensureListening() {
   window.addEventListener("popstate", handlePop);
   window.addEventListener("pointerdown", noteAddress, true);
   window.addEventListener("keydown", noteAddress, true);
+  for (const type of ["click", "keyup", "change", "input"]) window.addEventListener(type, noteSeenNowAndLater);
   listening = true;
 }
 
@@ -501,7 +571,7 @@ export function useOverlayHistory(open: boolean, onClose: () => void): void {
       // The abandoned ones beneath come back owed; ours takes the top slot.
       for (const owed of inherited.slice(0, -1)) pushed.push({ ...owed, dead: true });
       const was = inherited[inherited.length - 1];
-      pushed.push({ id, href: currentHref(), dead: false, idx: was.idx, key: was.key, route: was.route });
+      pushed.push({ id, href: currentHref(), seen: currentHref(), dead: false, idx: was.idx, key: was.key, route: was.route });
       standing = id;
     } else {
       // A push DESTROYS every entry ahead of the one we are on, so anything we
@@ -516,7 +586,8 @@ export function useOverlayHistory(open: boolean, onClose: () => void): void {
       // the URL is unchanged, so the router treats popping this as a no-op re-render.
       window.history.pushState(marked, "");
       const page = routerMark();
-      pushed.push({ id, href: currentHref(), dead: false, idx: page.idx, key: page.key, route: routeOf(currentHref()) });
+      const at = currentHref();
+      pushed.push({ id, href: at, seen: at, dead: false, idx: page.idx, key: page.key, route: routeOf(at) });
       standing = id;
     }
     return () => {