@eifi1/ui-kit 0.44.0 → 0.46.0

package/src/admin/admin-action-log.tsx

@@ -72,7 +72,11 @@ export type AdminActionKind =
   | "group_rename"
   | "group_delete"
   | "membership_add"
-  | "membership_role";
+  | "membership_role"
+  // 0.45 (admin §9.1.3): a group switched off or on again — kastlan's company PATCH
+  // (`is_active`). server-kit 0.15's `AdminAction.GROUP_DEACTIVATE` / `GROUP_REACTIVATE`.
+  | "group_deactivate"
+  | "group_reactivate";
 
 /** Every {@link AdminActionKind}, in the contract's order. */
 export const ADMIN_ACTION_KINDS: readonly AdminActionKind[] = [
@@ -98,6 +102,8 @@ export const ADMIN_ACTION_KINDS: readonly AdminActionKind[] = [
   "group_delete",
   "membership_add",
   "membership_role",
+  "group_deactivate",
+  "group_reactivate",
 ];
 
 /** The app's word for its groups (§11.5): Kurvenschmiede's teams, kastlan's companies,
@@ -105,11 +111,14 @@ export const ADMIN_ACTION_KINDS: readonly AdminActionKind[] = [
  *  actions are said in. */
 export type AdminGroupNoun = "group" | "team" | "company" | "budget";
 
-/** The kinds said in the noun's words: the five of 0.34, and `membership_remove`. */
+/** The kinds said in the noun's words: the five of 0.34, `membership_remove`, and 0.45's
+ *  `group_deactivate` / `group_reactivate`. */
 type AdminGroupActionKind =
   | "group_create"
   | "group_rename"
   | "group_delete"
+  | "group_deactivate"
+  | "group_reactivate"
   | "membership_add"
   | "membership_role"
   | "membership_remove";
@@ -118,6 +127,8 @@ const GROUP_ACTION_KINDS: ReadonlySet<string> = new Set<AdminGroupActionKind>([
   "group_create",
   "group_rename",
   "group_delete",
+  "group_deactivate",
+  "group_reactivate",
   "membership_add",
   "membership_role",
   "membership_remove",
@@ -184,6 +195,13 @@ export interface AdminActionLogEntry {
   group?: AdminGroupTarget | null;
   /** The `detail` in the app's words — "Member → Admin", "12 items to Ben Example". */
   detail?: ReactNode;
+  /**
+   * 0.45 (admin §9.4, Marcel 2026-10-19): a `group_rename` row's `detail.{from, to}` —
+   * kastlan's company rename logs both names. With both, the row reads "Company renamed
+   * from A to B" (`renamedFromTo`) in place of the target. A rename that logs `{}` (KS's
+   * team rename: never a name) leaves it out and reads "Team renamed" and the group.
+   */
+  renamed?: { from?: string | null; to?: string | null } | null;
 }
 
 /** The `adminActionLog` namespace. */
@@ -206,6 +224,8 @@ export interface AdminActionLogLabels {
   showAll: string;
   /** A target name as a filter button — "Show only the actions on Ada Example". */
   filterBy: (target: string) => string;
+  /** 0.45: after "Company renamed" when the row carries both names — "from A to B". */
+  renamedFromTo: (from: string, to: string) => string;
   /** What each action is called, past tense, keyed by the vocabulary. An app adds its
    *  own here (`labels={{ actions: { plan: "Plan changed" } }}`). A word given here
    *  outranks the noun's in `groupActions` — so no catalogue holds the group kinds
@@ -223,6 +243,11 @@ interface AdminGroupActionLabels {
   group_rename: string;
   /** "Team deleted". */
   group_delete: string;
+  /** "Company deactivated" (0.45, admin §9.1.3): the group switched off — its people
+   *  locked out — not a person's `deactivate`. */
+  group_deactivate: string;
+  /** "Company reactivated" (0.45). */
+  group_reactivate: string;
   /** "Added to the team" — said of the person, so it agrees with the account where a
    *  language agrees (es "Añadida", fr "Ajouté"). */
   membership_add: string;
@@ -384,12 +409,22 @@ export function AdminActionLog({
           aria-busy={loading || undefined}
           className={cn("divide-y divide-subtle", loading && "opacity-60")}
         >
-          {entries.map((entry) => (
+          {entries.map((entry) => {
+            const from = (entry.renamed?.from ?? "").trim();
+            const to = (entry.renamed?.to ?? "").trim();
+            const renamed = entry.action === "group_rename" && from !== "" && to !== "";
+            return (
             <li key={entry.id} data-action={entry.action} className="space-y-0.5 py-2 first:pt-0 last:pb-0">
               <div className="flex flex-wrap items-baseline justify-between gap-x-3 gap-y-0.5">
                 <div className="flex min-w-0 flex-wrap items-baseline gap-x-2 gap-y-0.5 text-sm">
                   <span className="font-medium text-primary">{actionText(entry.action)}</span>
-                  {entry.target !== undefined && <span className="min-w-0 break-words">{targetNode(entry)}</span>}
+                  {renamed ? (
+                    <span data-private data-renamed className="min-w-0 break-words text-primary">
+                      {labels.renamedFromTo(from, to)}
+                    </span>
+                  ) : (
+                    entry.target !== undefined && <span className="min-w-0 break-words">{targetNode(entry)}</span>
+                  )}
                   {entry.group && (
                     <span data-group className="min-w-0 break-words text-xs text-muted">
                       {groupText(entry.group)}
@@ -410,7 +445,8 @@ export function AdminActionLog({
                 )}
               </div>
             </li>
-          ))}
+            );
+          })}
         </ol>
       )}
       {paging && paging.total > 0 && (

package/src/admin/admin-area-labels.ts

@@ -24,6 +24,15 @@ export interface AdminTileLabels {
   users: string;
   /** `users_new_7d`, the line under the users tile. */
   usersNew: (count: number) => string;
+  /** 0.46 (Kurvenschmiede 1, admin §9.5): server-kit's `awaiting_verdict` as an `extra`
+   *  tile — answered reports that wait on a verdict (IN_EVALUATION, NEEDS_LIVE_TEST). */
+  awaitingVerdict: string;
+  /** Its line under the count. */
+  awaitingVerdictHint: string;
+  /** 0.46: server-kit's `released_for_work` — the reports released for the work queue. */
+  releasedForWork: string;
+  /** Its line under the count. */
+  releasedForWorkHint: string;
 }
 
 export interface AdminAreaLabels {
@@ -32,6 +41,12 @@ export interface AdminAreaLabels {
   /** The row's waiting count, for a reader ("Administration, 3 waiting"); the eye sees
    *  the number in the badge. */
   waiting: (count: number) => string;
+  /**
+   * 0.45 (admin §9.3.4): a button's whole name with its count — "Platform, 2 waiting" —
+   * for an `IconButton` whose `badge` is an `AdminWaitingBadge`: the badge is decorative
+   * there, so the name carries the count. `label` is the button's own name.
+   */
+  waitingLabel: (label: string, count: number) => string;
   /** The 403 page's heading (§2.2 decision 8). */
   forbiddenTitle: string;
   /**
@@ -59,6 +74,7 @@ export interface AdminAreaLabels {
 export const DEFAULT_ADMIN_AREA_LABELS: AdminAreaLabels = {
   title: "Administration",
   waiting: (count) => `${count} waiting`,
+  waitingLabel: (label, count) => `${label}, ${count} waiting`,
   forbiddenTitle: "Only for administrators",
   forbiddenBody: (appName) => `This is where administrators run ${appName}. Your account cannot open this page.`,
   forbiddenHome: "Go to the start page",
@@ -76,6 +92,10 @@ export const DEFAULT_ADMIN_AREA_LABELS: AdminAreaLabels = {
     invitationsPending: "Pending invitations",
     users: "Users",
     usersNew: (count) => `${count} new in 7 days`,
+    awaitingVerdict: "Awaiting a verdict",
+    awaitingVerdictHint: "Answered, and waiting for you or the reporter to confirm the fix",
+    releasedForWork: "Released for work",
+    releasedForWorkHint: "Ready, rework requested or in progress",
   },
   overviewError: "The overview couldn’t be loaded.",
   retry: "Try again",

package/src/admin/admin-overview.tsx

@@ -86,8 +86,18 @@ export function AttentionTile({ count, href, ...tile }: AttentionTileProps) {
   return <StatTile data-slot="attention-tile" {...tile} value={count ?? null} href={href} />;
 }
 
+/**
+ * 0.46 (Kurvenschmiede 1, admin §9.5): the `extra` keys server-kit's
+ * `feedback_attention` fills, whose tiles have the kit's words
+ * (`adminArea.tiles.awaitingVerdict`, `releasedForWork`, with a line each).
+ */
+export type AdminFeedbackTileKey = "awaiting_verdict" | "released_for_work";
+
 /** One of the app's own tiles (§2.4 decision 13: keksdose's "Support waiting"). */
-export interface AdminExtraTile {
+export type AdminExtraTile = AdminOwnTile | AdminFeedbackTile;
+
+/** A tile of the app's own: it brings its words. */
+export interface AdminOwnTile {
   /** Unique among the tiles; usually the `extra` key it shows. */
   key: string;
   label: ReactNode;
@@ -100,6 +110,14 @@ export interface AdminExtraTile {
   description?: ReactNode;
 }
 
+/** 0.46: a tile of server-kit's feedback counts — `label` and `description` default to
+ *  the kit's words; an app's own still win. The kit's `description` fills in only when
+ *  `label` is left out too: an app that names the tile gets no hint line it did not ask for. */
+export interface AdminFeedbackTile extends Omit<AdminOwnTile, "key" | "label"> {
+  key: AdminFeedbackTileKey;
+  label?: ReactNode;
+}
+
 export interface AdminOverviewProps {
   /** The server's answer; `undefined` while it loads (the grid shows its skeletons). */
   attention: AdminAttention | null | undefined;
@@ -186,9 +204,26 @@ export function AdminOverview({
         attention && typeof attention.users_new_7d === "number" ? labels.tiles.usersNew(attention.users_new_7d) : undefined,
     },
   ];
+  const feedbackWords: Record<AdminFeedbackTileKey, { label: string; description: string }> = {
+    awaiting_verdict: { label: labels.tiles.awaitingVerdict, description: labels.tiles.awaitingVerdictHint },
+    released_for_work: { label: labels.tiles.releasedForWork, description: labels.tiles.releasedForWorkHint },
+  };
   const tiles = [
     ...shared.map((t) => ({ ...t, count: attention ? attention[t.key] : undefined, href: href[t.key] })),
-    ...extraTiles,
+    ...extraTiles.map((t) => {
+      const words = Object.prototype.hasOwnProperty.call(feedbackWords, t.key)
+        ? feedbackWords[t.key as AdminFeedbackTileKey]
+        : undefined;
+      // The kit's hint comes with the kit's label only: an app that names the tile
+      // itself gets no line it did not ask for (keksdose S5, round 0.46).
+      return words
+        ? {
+            ...t,
+            label: t.label ?? words.label,
+            description: t.description ?? (t.label === undefined ? words.description : undefined),
+          }
+        : t;
+    }),
   ].filter((t) => loading || (t.count !== null && t.count !== undefined));
   if (!loading && tiles.length === 0) return error ? errorBox(true) : null;
   const grid = (

package/src/admin/mail-test-card-labels.ts

@@ -0,0 +1,19 @@
+// The English words of ./mail-test-card, in a module with no component code: the English
+// catalogue (src/i18n/defaults.ts) imports them without the component, so `en` loads as one
+// chunk like the other languages (0.34, KS U8). ./mail-test-card re-exports them.
+
+import { englishRateLimited } from "../auth/auth-errors";
+import type { MailTestCardLabels } from "./mail-test-card";
+
+/** docs/admin-harmonization.md §9.2.4, word for word. */
+export const DEFAULT_MAIL_TEST_CARD_LABELS: MailTestCardLabels = {
+  title: "Test mail",
+  description: "Sends one mail to your own address, through the transport this installation sends all its mail with.",
+  transport: (backend) => `Transport: ${backend}`,
+  action: "Send a test mail to me",
+  sent: (address) => `Sent to ${address}. Check the inbox.`,
+  console: "The console transport only logs mail; nothing was sent.",
+  failed: "Could not send. The server log has the provider’s answer.",
+  rateLimited: englishRateLimited,
+  keywords: "test mail email e-mail transport smtp resend console send deliver",
+};

package/src/admin/mail-test-card.tsx

@@ -0,0 +1,190 @@
+import { useState } from "react";
+import type { ReactNode } from "react";
+import { Send } from "lucide-react";
+
+import { useKitLabels, type LabelOverride } from "../i18n/kit-labels";
+import { isRateLimited, retryAfterSeconds } from "../auth/auth-errors";
+import { AlertBanner } from "../components/alert-banner";
+import { Button } from "../components/button";
+import { Chip } from "../components/chip";
+import { SettingsSection, type SettingsSectionProps } from "../settings/settings-section";
+import { DEFAULT_MAIL_TEST_CARD_LABELS } from "./mail-test-card-labels";
+
+/* ── Labels ──────────────────────────────────────────────────────────────── */
+
+/** Every string {@link MailTestCard} renders — the `mailTestCard` namespace of
+ *  `<UiKitProvider labels>`, overridable per instance through `labels`
+ *  (docs/admin-harmonization.md §9.2.4). */
+export interface MailTestCardLabels {
+  /** The card's title, and the app's catalogue entry's. */
+  title: string;
+  /** The sentence under it. */
+  description: string;
+  /** The transport's chip: "Transport: resend". `backend` is the server's `mail_backend`. */
+  transport: (backend: string) => string;
+  /** The button. */
+  action: string;
+  /** The answer said "sent" through a real transport. `address` is masked ("a…@example.com"). */
+  sent: (address: string) => string;
+  /** `mail_backend` is `console`: said whatever `sent` is — a console answers `true`. */
+  console: string;
+  /** Not sent, or the request failed. The provider's error stays in the server log. */
+  failed: string;
+  /** HTTP 429 — the app's limiter (server-kit's `MAIL_TEST_LIMIT`, 3 per 10 minutes);
+   *  `seconds` from `Retry-After` when the response has one. */
+  rateLimited: (seconds?: number) => string;
+  /** For the app's catalogue entry (`keywords`); the card never reads it. */
+  keywords: string;
+}
+
+// Defined in ./mail-test-card-labels, which holds no component code.
+export { DEFAULT_MAIL_TEST_CARD_LABELS };
+
+/* ── The card ────────────────────────────────────────────────────────────── */
+
+/** The answer of `POST /admin/mail/test` — server-kit 0.15's `MailTestResult`. */
+export interface MailTestAnswer {
+  sent: boolean;
+  /** The transport that took it: `console`, `resend`, `smtp`, … */
+  mail_backend: string;
+}
+
+/** The card's default DOM id: its catalogue entry's `anchor`, the `?focus=` target. */
+export const MAIL_TEST_ANCHOR = "admin-mail-test";
+
+export interface MailTestCardProps
+  extends Omit<SettingsSectionProps, "anchor" | "title" | "description" | "children"> {
+  /** The installation's transport, as the admin page has it (`mail_backend`): the chip
+   *  before a send. After one, the answer's. Optional (0.46): without it the chip shows
+   *  from the first answer on, and an app needs no query only for the chip. */
+  mailBackend?: string;
+  /** The app's `POST /admin/mail/test` (kastlan `/platform/mail/test`), no body: it
+   *  awaits the app's own send and answers `{sent, mail_backend}`. A rejection is read
+   *  for a 429 (the limiter); anything else is "could not send". */
+  send: () => Promise<MailTestAnswer>;
+  /** The signed-in admin's own address — where the mail goes. Shown masked. */
+  address: string;
+  /** Default {@link MAIL_TEST_ANCHOR}; the app's catalogue entry names the same. */
+  anchor?: string;
+  /** The app's sentence after the kit's description. */
+  description?: ReactNode;
+  labels?: LabelOverride<MailTestCardLabels>;
+}
+
+/**
+ * An address with its local part masked to its first character: "ada@example.com" →
+ * "a…@example.com". The domain stays, so the admin sees which mailbox to open.
+ */
+export function maskMailAddress(address: string): string {
+  const text = address.trim();
+  const at = text.lastIndexOf("@");
+  if (at <= 0) return text === "" ? "" : `${Array.from(text)[0]}…`;
+  return `${Array.from(text.slice(0, at))[0]}…${text.slice(at)}`;
+}
+
+type Outcome =
+  | { kind: "sent"; backend: string }
+  | { kind: "console"; backend: string }
+  | { kind: "failed"; backend?: string }
+  | { kind: "limited"; seconds?: number };
+
+/**
+ * "Send a test mail to me" (docs/admin-harmonization.md §9.2): a `SettingsSection` with a
+ * sentence, the transport as a chip, the button and the result line. One mail goes to the
+ * signed-in admin's own address, never another, through the app's own send.
+ *
+ * **The result line reads `mail_backend` first**: with `console` it says "nothing was sent"
+ * whatever `sent` is, since every console path answers `true` (§9.2 Today). Otherwise
+ * `sent` says "Sent to a…@example.com. Check the inbox." or "Could not send." — the
+ * provider's error stays in the server log (§9.2.7). A 429 says the limiter's line. The
+ * button is busy while the request runs; the line is a live region.
+ *
+ * Not a commit: the test writes nothing, so it is not under the write lock (a demo never
+ * reaches the admin area, and the server refuses it anyway). The app adds the catalogue
+ * entry `{ id, anchor: MAIL_TEST_ANCHOR, title, keywords }` from these labels.
+ */
+export function MailTestCard({
+  mailBackend,
+  send,
+  address,
+  anchor = MAIL_TEST_ANCHOR,
+  description,
+  labels: labelsProp,
+  ...rest
+}: MailTestCardProps) {
+  const labels = useKitLabels("mailTestCard", DEFAULT_MAIL_TEST_CARD_LABELS, labelsProp);
+  const [busy, setBusy] = useState(false);
+  const [outcome, setOutcome] = useState<Outcome | null>(null);
+  // The last transport an answer named: a later send with no answer (429, network) keeps it.
+  const [answered, setAnswered] = useState<string | undefined>(undefined);
+
+  const run = async () => {
+    if (busy) return;
+    setBusy(true);
+    setOutcome(null);
+    try {
+      const answer = await send();
+      const backend = answer.mail_backend;
+      if (backend) setAnswered(backend);
+      if (backend === "console") setOutcome({ kind: "console", backend });
+      else setOutcome(answer.sent ? { kind: "sent", backend } : { kind: "failed", backend });
+    } catch (error) {
+      setOutcome(isRateLimited(error) ? { kind: "limited", seconds: retryAfterSeconds(error) } : { kind: "failed" });
+    } finally {
+      setBusy(false);
+    }
+  };
+
+  const backend = answered ?? mailBackend;
+
+  return (
+    <SettingsSection
+      {...rest}
+      anchor={anchor}
+      title={labels.title}
+      description={
+        description != null ? (
+          <>
+            {labels.description} {description}
+          </>
+        ) : (
+          labels.description
+        )
+      }
+    >
+      <div className="space-y-2">
+        <div className="flex flex-wrap items-center gap-2">
+          <Button variant="secondary" pending={busy} onClick={() => void run()}>
+            <Send className="size-4" aria-hidden />
+            {labels.action}
+          </Button>
+          {backend && (
+            <Chip size="sm" data-slot="mail-backend">
+              {labels.transport(backend)}
+            </Chip>
+          )}
+        </div>
+        {outcome?.kind === "sent" && (
+          <AlertBanner variant="inline" block tone="success">
+            <span data-private>{labels.sent(maskMailAddress(address))}</span>
+          </AlertBanner>
+        )}
+        {outcome?.kind === "console" && (
+          <AlertBanner variant="inline" block tone="info">
+            {labels.console}
+          </AlertBanner>
+        )}
+        {outcome?.kind === "failed" && (
+          <AlertBanner variant="inline" block tone="danger">
+            {labels.failed}
+          </AlertBanner>
+        )}
+        {outcome?.kind === "limited" && (
+          <AlertBanner variant="inline" block tone="warning">
+            {labels.rateLimited(outcome.seconds)}
+          </AlertBanner>
+        )}
+      </div>
+    </SettingsSection>
+  );
+}

package/src/components/appearance-labels.ts

@@ -28,6 +28,16 @@ export interface AppearanceLabels {
    * toast or the line under the setting (0.32.1, keksdose's 0.32 report).
    */
   saveFailed: string;
+  /** The date-format setting's name (0.46, `DateFormatSetting`). */
+  dateFormat: string;
+  /** One line under it: the format is its own choice, apart from the language. */
+  dateFormatHelp: string;
+  /** Its first option, followed by that language's sample: "Follow language — 01 Aug 2026". */
+  dateFormatAuto: string;
+  /** `AccountMenuTextSize`'s A− button (0.46, keksdose live #426): one step smaller. */
+  textSmaller: string;
+  /** Its A+ button: one step larger. */
+  textLarger: string;
 }
 
 export const DEFAULT_APPEARANCE_LABELS: AppearanceLabels = {
@@ -38,6 +48,12 @@ export const DEFAULT_APPEARANCE_LABELS: AppearanceLabels = {
   contrastHelp: "More contrast darkens quiet text and lines, and thickens focus frames. System follows this device.",
   contrastModes: { system: "System", standard: "Standard", more: "More" },
   saveFailed: "Couldn't save this to your account. It still applies on this device.",
+  dateFormat: "Date format",
+  dateFormatHelp:
+    "How dates are written throughout the app. Independent of the interface language, so you can read the app in English and still see German dates.",
+  dateFormatAuto: "Follow language",
+  textSmaller: "Smaller text",
+  textLarger: "Larger text",
 };
 
 /** The `appearance` namespace, resolved — English, then the provider, then `labels`. For

package/src/components/data-table-column-settings.tsx

@@ -4,7 +4,7 @@ import { X } from "lucide-react";
 import { cn } from "../lib/cn";
 import { Tooltip } from "./tooltip";
 import type { DataTableLabels } from "./data-table-labels";
-import { ROW_ACTIONS_KEY } from "./data-table-row-actions";
+import { isTableOwnColumn } from "./data-table-row-actions";
 import { columnLabel } from "./data-table-shared";
 import type { DataTableColumn } from "./data-table";
 
@@ -101,7 +101,7 @@ export function ColumnSettingsPanel<T>({
           </button>
           <div className="flex flex-col gap-0.5">
             {columns.map((col) => {
-              if (col.key === ROW_ACTIONS_KEY) return null;
+              if (isTableOwnColumn(col.key)) return null;
               const checked = !hiddenCols.has(col.key);
               const headerLabel = columnLabel(col);
               return (

package/src/components/data-table-head.tsx

@@ -8,7 +8,7 @@ import { FilterPopover } from "./data-table-filter-popover";
 import { Popover } from "./popover";
 import { Tooltip } from "./tooltip";
 import type { DataTableLabels } from "./data-table-labels";
-import { ROW_ACTIONS_KEY } from "./data-table-row-actions";
+import { isTableOwnColumn } from "./data-table-row-actions";
 import { columnLabel, logicalAlign, splitCellProps } from "./data-table-shared";
 import type { DataTableColumn, DataTableProps, FilterState } from "./data-table";
 
@@ -223,7 +223,7 @@ export function DataTableHead<T>({
                   </Popover>
                 )}
               </div>
-              {resizable && col.key !== ROW_ACTIONS_KEY && (
+              {resizable && !isTableOwnColumn(col.key) && (
               /* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions -- a
                  pointer-only drag handle for a visual preference (column width); it is
                  deliberately not a tab stop, and no content or action depends on it. */

package/src/components/data-table-mobile.tsx

@@ -1,5 +1,5 @@
 import { Fragment, useEffect, useId, useMemo, useRef, useState } from "react";
-import type { ReactNode } from "react";
+import type { MouseEvent as ReactMouseEvent, PointerEvent as ReactPointerEvent, ReactNode } from "react";
 import { ArrowDownWideNarrow, ArrowUpNarrowWide, ChevronDown, ChevronRight, Filter } from "lucide-react";
 import { FOCUS_RING } from "./focus-ring";
 import { IconButton } from "./icon-button";
@@ -15,7 +15,7 @@ import { DialogFrame } from "./dialog-frame";
 import { Checkbox } from "./checkbox";
 import { useLongPress } from "../hooks/use-long-press";
 import type { DataTableLabels } from "./data-table-labels";
-import { RowLink, cleanAttrs, columnLabel, fromOutside } from "./data-table-shared";
+import { RowLink, cleanAttrs, columnLabel, fromOutside, fromOwnControl } from "./data-table-shared";
 import type {
   DataTableCellProps,
   DataTableColumn,
@@ -383,7 +383,25 @@ export function MobileRow<T>({
   // Attached whenever the table selects, the hook's `enabled` deciding whether a press
   // arms: its pointerdown also clears a stale swallow latch, which must happen in the
   // mode too, or a long press whose click never came would eat the first toggle.
-  const press = select ? longPress.handlers : undefined;
+  //
+  // A press that starts on a control in a cell (or in a portal one opened) is that
+  // control's, not a way into the mode (keksdose live #428): it only clears the latch.
+  const press = select
+    ? {
+        ...longPress.handlers,
+        onPointerDown: (e: ReactPointerEvent<HTMLElement>) => {
+          if (fromOutside(e.target, e.currentTarget) || fromOwnControl(e.target, e.currentTarget)) {
+            longPress.consumeClick();
+            return;
+          }
+          longPress.handlers.onPointerDown(e);
+        },
+        onContextMenu: (e: ReactMouseEvent<HTMLElement>) => {
+          if (fromOutside(e.target, e.currentTarget) || fromOwnControl(e.target, e.currentTarget)) return;
+          longPress.handlers.onContextMenu(e);
+        },
+      }
+    : undefined;
   const body = selecting ? (
     // In the mode a card is a toggle — kk's register row: `role="button"` with
     // `aria-pressed`, the box beside it only a picture of that state (the card is the
@@ -399,6 +417,8 @@ export function MobileRow<T>({
       {...press}
       onClick={(e) => {
         if (!select!.selectable || fromOutside(e.target, e.currentTarget)) return;
+        // A tap on a control in a cell is that control's (keksdose live #428).
+        if (fromOwnControl(e.target, e.currentTarget)) return;
         select!.onToggle(!select!.selected);
       }}
       onKeyDown={(e) => {
@@ -455,6 +475,9 @@ export function MobileRow<T>({
           interactive
             ? (e) => {
                 if (fromOutside(e.target, e.currentTarget)) return;
+                // A tap on a control in a cell (a select, a button) is that
+                // control's, as on the desktop `<tr>` (keksdose live #428).
+                if (fromOwnControl(e.target, e.currentTarget)) return;
                 onRowClick!(row);
               }
             : undefined