@eifi1/ui-kit 0.33.0 → 0.34.0

package/src/feedback/feedback-inbox.tsx

@@ -1,37 +1,32 @@
 import { useId, useRef, useState } from "react";
 import type { ReactNode } from "react";
-import {
-  Ban,
-  Bug,
-  CheckCircle2,
-  ClipboardCheck,
-  CloudUpload,
-  Eye,
-  HelpCircle,
-  Inbox,
-  Lightbulb,
-  MoreHorizontal,
-  OctagonAlert,
-  PauseCircle,
-  Wrench,
-} from "lucide-react";
-import type { LucideIcon } from "lucide-react";
 import { cn } from "../lib/cn";
-import { Button, Textarea } from "../components/ui";
-import type { ButtonSize, ButtonVariant } from "../components/ui";
+import { Button } from "../components/button";
+import { Textarea } from "../components/textarea";
+import type { ButtonSize, ButtonVariant } from "../components/button-look";
 import { Tooltip } from "../components/tooltip";
 import { useCommitReason, useWriteLock, type CommitScope } from "../components/write-lock";
 import { FeedbackAttachmentField, type FeedbackAttachmentErrorInfo } from "./feedback-attachment";
 import type { FeedbackAttachmentLabels } from "./feedback-dialog";
 import { useFeedbackCategoryLabels, useFeedbackStatusLabels } from "./feedback-labels";
+import {
+  FEEDBACK_CATEGORY_META,
+  FEEDBACK_STATUS_META,
+  type FeedbackCategory,
+  type FeedbackStatus,
+} from "./feedback-vocabulary";
+import { useKitLabels, type LabelOverride } from "../i18n/kit-labels";
+// The words module, not ./feedback-row-detail: that one imports this file.
+import { DEFAULT_FEEDBACK_DETAIL_LABELS } from "./feedback-row-detail-labels";
 
 /**
  * The feedback **inbox**, as the parts two apps were each writing separately.
  *
  * `feedback-dialog.tsx` next door is the other half — the form somebody files a
- * report with — and the split between them is the same one: this owns the
- * *vocabulary*, the *policy* about how a report moves, and the *look*; the app
- * owns the data, the API and every string.
+ * report with — and the split between them is the same one: the kit owns the
+ * *vocabulary*, the *policy* about how a report moves (both in
+ * feedback-vocabulary.ts since 0.34, re-exported below), and the *look* (here);
+ * the app owns the data, the API and every string.
  *
  * It exists because both apps had grown their own copy. Keksdose's is the one
  * this is lifted from, comments and all, because it is the one that had been
@@ -56,229 +51,20 @@ import { useFeedbackCategoryLabels, useFeedbackStatusLabels } from "./feedback-l
  * a `label` the caller passes still wins.
  */
 
-/** The eight 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. */
-export type FeedbackStatus =
-  | "OPEN"
-  | "READY"
-  | "IN_PROGRESS"
-  | "IN_EVALUATION"
-  | "NEEDS_LIVE_TEST"
-  | "POSTPONED"
-  | "DONE"
-  | "WONT_DO";
-
-/** What a report is about. `CRASH` is filed by an error boundary and never
- *  chosen, which is exactly why it is loud below and absent from every picker. */
-export type FeedbackCategory = "CRASH" | "BUG" | "IDEA" | "QUESTION" | "OTHER";
-
-/**
- * A glyph and a tone per status.
- *
- * Colour alone is not a label — two of these sit a hue apart, and a consumer who
- * moves `--brand` can park it beside any of the others — so every status carries
- * its own shape as well. Declaration order is chain order, and
- * {@link FEEDBACK_STATUS_ORDER} is derived from it rather than restated, because
- * a restated list cannot be checked for exhaustiveness: an eighth status would
- * break the build here and leave a literal eight long (as READY did in 0.31).
- */
-export const FEEDBACK_STATUS_META: Record<
-  FeedbackStatus,
-  { icon: LucideIcon; activeBg: string; activeText: string }
-> = {
-  OPEN: {
-    icon: Inbox,
-    activeBg: "bg-[var(--bg-active)]",
-    activeText: "text-[var(--text-primary)]",
-  },
-  // Triaged and released for implementation (feedback contract §8.2, keksdose live
-  // #396): OPEN is "filed, nobody has looked yet", READY is "go". The brand tint at full
-  // strength, so it reads as the go-ahead beside OPEN's neutral fill and
-  // NEEDS_LIVE_TEST's muted brand.
-  READY: {
-    icon: ClipboardCheck,
-    activeBg: "bg-[var(--brand-bg)]",
-    activeText: "text-[var(--brand)]",
-  },
-  IN_PROGRESS: {
-    icon: Wrench,
-    activeBg: "bg-[var(--warning-bg)]",
-    activeText: "text-[var(--warning)]",
-  },
-  // Where solved work is parked, waiting on the person who reported it. Its own
-  // colour, because "somebody has to check this" is a state you want to find by
-  // scanning rather than by reading.
-  IN_EVALUATION: {
-    icon: Eye,
-    activeBg: "bg-[var(--info-bg)]",
-    activeText: "text-[var(--info)]",
-  },
-  // Resolved but only checkable on a deployed build — the SOFT brand tint, so it
-  // reads as "waiting on something" rather than as a done or a refusal, and it
-  // follows whatever the consumer's brand is instead of pinning an indigo island
-  // beside it.
-  NEEDS_LIVE_TEST: {
-    icon: CloudUpload,
-    activeBg: "bg-[var(--brand-bg)]",
-    activeText: "text-[var(--brand-muted)]",
-  },
-  // Parked on purpose. Muted, not `--danger`: it is not a refusal.
-  POSTPONED: {
-    icon: PauseCircle,
-    activeBg: "bg-[var(--bg-active)]",
-    activeText: "text-[var(--text-secondary)]",
-  },
-  // The one status with nowhere to move to: the vocabulary has a brand, an info, a
-  // warning and a danger, and nothing that means "succeeded". Deliberately NOT
-  // borrowed from a family that means something else — `--status-synced` is a
-  // FIELD's trip to the database rather than an outcome, and tokens.css says so in
-  // as many words. Green beside WONT_DO's red is the classic CVD-unsafe pair, which
-  // is why both carry a glyph and neither leans on colour alone.
-  DONE: {
-    icon: CheckCircle2,
-    activeBg: "bg-[var(--success-bg)]",
-    activeText: "text-[var(--success)]",
-  },
-  WONT_DO: {
-    icon: Ban,
-    activeBg: "bg-[var(--danger-bg)]",
-    activeText: "text-[var(--danger)]",
-  },
-};
-
-/** Chain order, then the three off it. The order a picker offers, and the rank a
- *  status column sorts by — so a list sorted by status reads as a queue rather
- *  than as an alphabet. */
-export const FEEDBACK_STATUS_ORDER = Object.keys(FEEDBACK_STATUS_META) as FeedbackStatus[];
-
-/** States that sit OFF the linear chain: reachable from anywhere, leading
- *  nowhere by themselves. `WONT_DO` has always worked this way; `POSTPONED`
- *  ("not now") and `NEEDS_LIVE_TEST` ("resolved, but only provable on a deployed
- *  build") are the same shape — a row can be parked or handed to the next deploy
- *  from any point, and comes back to the chain when somebody picks a real state
- *  for it.
- *
- *  Kept out of the forward chain deliberately: putting them in it would mean an
- *  "advance" gesture could park an item, and every row would have to pass
- *  through them to reach `DONE`. */
-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. */
-export function nextFeedbackStatus(current: FeedbackStatus): FeedbackStatus | null {
-  const at = FORWARD_CHAIN.indexOf(current);
-  return at !== -1 && at < FORWARD_CHAIN.length - 1 ? FORWARD_CHAIN[at + 1] : null;
-}
-
-/**
- * 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
- * (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.
- *
- * The two parking states are not dead ends: each offers the step that resumes
- * work and the ones that close it, but deliberately **not each other** —
- * "postponed" and "waiting on a deploy" are different answers to different
- * questions, and a row moving between them directly is a re-triage, which starts
- * by picking the work back up.
- */
-export function visibleFeedbackStatuses(current: FeedbackStatus): FeedbackStatus[] {
-  const set = new Set<FeedbackStatus>([current]);
-  const at = FORWARD_CHAIN.indexOf(current);
-  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);
-  } else if (current !== "WONT_DO") {
-    set.add("IN_PROGRESS");
-    set.add("DONE");
-    set.add("WONT_DO");
-  }
-  // WONT_DO falls through with nothing added: it stays terminal, reopened by a
-  // note from its author rather than by a status pill.
-  return FEEDBACK_STATUS_ORDER.filter((status) => set.has(status));
-}
-
-/**
- * Every status, in chain order — what an EXPANDED row offers.
- *
- * {@link visibleFeedbackStatuses} narrows the choice to the steps that make
- * sense from where a row is, which is right for a table cell. Once the row is
- * open in front of you, that same narrowing turns every non-adjacent move into a
- * walk: OPEN to DONE meant three round trips, and WONT_DO could not be left at
- * all except through a rework note.
- *
- * Takes a `current` it does not use, so the two policies read as one pair at the
- * call sites and a future rule ("terminal rows still cannot jump to X") has a
- * place to live.
- */
-export function selectableFeedbackStatuses(_current: FeedbackStatus): FeedbackStatus[] {
-  return [...FEEDBACK_STATUS_ORDER];
-}
-
-/**
- * Per-category badge treatment, the counterpart to the status meta above.
- *
- * A category cell that is one grey pill holding the raw enum makes a CRASH —
- * filed automatically, by somebody staring at a broken page right now — read
- * exactly like a QUESTION, and sit unnoticed in the queue. `--danger` plus its own
- * glyph is what makes that impossible; the hand-filed categories stay
- * deliberately quiet so that the loud one means something.
- *
- * Declaration order is triage order, CRASH first.
- */
-export const FEEDBACK_CATEGORY_META: Record<
-  FeedbackCategory,
-  { icon: LucideIcon; badgeBg: string; badgeText: string }
-> = {
-  CRASH: {
-    icon: OctagonAlert,
-    badgeBg: "bg-[var(--danger-bg)]",
-    badgeText: "text-[var(--danger)]",
-  },
-  BUG: {
-    icon: Bug,
-    badgeBg: "bg-[var(--warning-bg)]",
-    badgeText: "text-[var(--warning)]",
-  },
-  IDEA: {
-    icon: Lightbulb,
-    badgeBg: "bg-[var(--bg-surface-2)]",
-    badgeText: "text-[var(--text-secondary)]",
-  },
-  QUESTION: {
-    icon: HelpCircle,
-    badgeBg: "bg-[var(--bg-surface-2)]",
-    badgeText: "text-[var(--text-secondary)]",
-  },
-  OTHER: {
-    icon: MoreHorizontal,
-    badgeBg: "bg-[var(--bg-surface-2)]",
-    badgeText: "text-[var(--text-secondary)]",
-  },
-};
-
-/** Triage order, CRASH first — also a category column's sort key and the option
- *  order in its filter. Sorting by the raw enum is alphabetical, which parks
- *  CRASH between BUG and IDEA. */
-export const FEEDBACK_CATEGORY_ORDER = Object.keys(FEEDBACK_CATEGORY_META) as FeedbackCategory[];
-
-/** A category's rank for a column sort. Anything this build has never heard of —
- *  an older client against a newer API — sorts LAST rather than to `indexOf`'s
- *  −1, which would rank it above CRASH. */
-export function feedbackCategoryRank(category: FeedbackCategory): number {
-  const at = FEEDBACK_CATEGORY_ORDER.indexOf(category);
-  return at === -1 ? FEEDBACK_CATEGORY_ORDER.length : at;
-}
+// The vocabulary — statuses, categories, their glyphs and orders, the transitions — is
+// feedback-vocabulary.ts since 0.34 (MOD-1): data the top bar's feedback menu imports
+// without this file's components. Re-exported, so every name is still found here.
+export {
+  FEEDBACK_CATEGORY_META,
+  FEEDBACK_CATEGORY_ORDER,
+  FEEDBACK_STATUS_META,
+  FEEDBACK_STATUS_ORDER,
+  feedbackCategoryRank,
+  nextFeedbackStatus,
+  selectableFeedbackStatuses,
+  visibleFeedbackStatuses,
+} from "./feedback-vocabulary";
+export type { FeedbackCategory, FeedbackStatus } from "./feedback-vocabulary";
 
 /**
  * The category as a badge.
@@ -455,7 +241,7 @@ export function FeedbackStatusTransitions({
                     "flex size-7 items-center justify-center rounded",
                     active
                       ? cn(meta.activeBg, meta.activeText)
-                      : "text-[var(--text-placeholder)] hover:text-[var(--text-secondary)]",
+                      : "text-placeholder hover:text-secondary",
                   )
                 : cn(
                     "inline-flex items-center gap-1.5 rounded-md border px-2 py-1 text-xs font-medium",
@@ -463,7 +249,7 @@ export function FeedbackStatusTransitions({
                       ? cn(meta.activeBg, meta.activeText, "border-transparent")
                       : // The translucent ink on hover (0.33, B′), as Button's secondary:
                         // the well is the page in light, and these pills sit on either.
-                        "border-[var(--border)] bg-transparent text-[var(--text-primary)] hover:bg-[color-mix(in_srgb,var(--text-primary)_7%,transparent)]",
+                        "border-subtle bg-transparent text-primary hover:bg-[color-mix(in_srgb,var(--text-primary)_7%,transparent)]",
                   ),
               // Both stay unclickable, but only the read-only case is DIMMED: the
               // current status is the one thing in the row that has to be legible
@@ -550,6 +336,7 @@ export function FeedbackNoteEditor({
   saveLabel,
   cancelLabel,
   placeholder,
+  label,
   rows = 3,
   attachment,
   resetKey,
@@ -566,6 +353,11 @@ export function FeedbackNoteEditor({
    *  a hint that disappears the moment somebody starts typing is a hint that is
    *  gone exactly when it is being followed. */
   placeholder?: ReactNode;
+  /** The box's accessible name (0.34). Without it the `placeholder` line names the
+   *  box, and without that the `feedbackDetail` namespace's `note` ("Note") does —
+   *  a box with neither was read out as just "edit text" (the showcase's axe check).
+   *  Given with a `placeholder`, this names the box and the line describes it. */
+  label?: string;
   rows?: number;
   /** Offer a picture with the note (Steering Design feedback #128). Omitted,
    *  the editor is exactly the text box it always was — which is what the
@@ -609,6 +401,7 @@ export function FeedbackNoteEditor({
   // (Steering Design feedback #140).
   const root = useRef<HTMLDivElement>(null);
   const hintId = useId();
+  const detailText = useKitLabels("feedbackDetail", DEFAULT_FEEDBACK_DETAIL_LABELS);
   // The lock as the save button sees it, with its scope (§12.36): `commit &&
   // lock.locked` read a `{ except }` scope as `true`.
   const lock = useWriteLock(commit ?? false);
@@ -634,7 +427,7 @@ export function FeedbackNoteEditor({
       {/* The line names the box (0.27.0): it is the only text that says what to write
           in it, and an unnamed textarea is read out as just "edit text". */}
       {placeholder && (
-        <p id={hintId} className="text-xs text-[var(--text-muted)]">
+        <p id={hintId} className="text-xs text-muted">
           {placeholder}
         </p>
       )}
@@ -642,7 +435,11 @@ export function FeedbackNoteEditor({
         rows={rows}
         value={draft}
         onChange={(event) => setDraft(event.target.value)}
-        aria-labelledby={placeholder ? hintId : undefined}
+        // Never nameless (round 0.34): the caller's `label`, else the line, else the
+        // `feedbackDetail` namespace's `note`. With both, the line describes the box.
+        aria-label={label ?? (placeholder ? undefined : detailText.note)}
+        aria-labelledby={placeholder && label === undefined ? hintId : undefined}
+        aria-describedby={placeholder && label !== undefined ? hintId : undefined}
         aria-required={required || undefined}
       />
       {attachment && (
@@ -688,7 +485,7 @@ export interface FeedbackNoteAttachment {
   /** Over the field's own `feedbackAttachment` namespace. Optional since 0.27.0 — the
    *  field has read the provider's words since 0.7.0, so an app with a catalogue has
    *  nothing to restate. */
-  labels?: Partial<FeedbackAttachmentLabels>;
+  labels?: LabelOverride<FeedbackAttachmentLabels>;
   accept?: string[];
   maxBytes?: number;
   /** `info` (0.23.0) names the refused file and the limit. */
@@ -732,7 +529,7 @@ export function FeedbackDetailSection({
   return (
     <div>
       <div className="mb-1 flex items-center justify-between gap-2">
-        <div className="text-xs font-medium uppercase tracking-wide text-[var(--text-muted)]">
+        <div className="text-xs font-medium uppercase tracking-wide text-muted">
           {title}
         </div>
         {action}
@@ -754,8 +551,8 @@ export function FeedbackDetail({ children, className }: { children: ReactNode; c
  *  paragraphs, and a note appended to it later is separated by blank lines that
  *  carry the entire "this arrived after the answer" reading. */
 export function FeedbackProse({ children, empty }: { children?: string; empty?: ReactNode }) {
-  if (!children) return <p className="text-[var(--text-placeholder)]">{empty ?? "—"}</p>;
+  if (!children) return <p className="text-placeholder">{empty ?? "—"}</p>;
   return (
-    <p className="whitespace-pre-wrap text-[var(--text-secondary)]">{children}</p>
+    <p className="whitespace-pre-wrap text-secondary">{children}</p>
   );
 }

package/src/feedback/feedback-labels.ts

@@ -1,5 +1,5 @@
-import { useKitLabels } from "../i18n/kit-labels";
-import type { FeedbackCategory, FeedbackStatus } from "./feedback-inbox";
+import { useKitLabels, type LabelOverride } from "../i18n/kit-labels";
+import type { FeedbackCategory, FeedbackStatus } from "./feedback-vocabulary";
 
 /**
  * The words of a report's status and category, and the toasts a feedback page shows —
@@ -113,16 +113,16 @@ export const DEFAULT_FEEDBACK_TOAST_LABELS: FeedbackToastLabels = {
 /** `feedbackStatus` resolved: English, then `<UiKitProvider labels>`, then `labels`. For
  *  the places that need a status's name outside the kit's own parts — a filter's options,
  *  `feedbackSwipePlan`'s panels, an app's overview tile. */
-export function useFeedbackStatusLabels(labels?: Partial<FeedbackStatusLabels>): FeedbackStatusLabels {
+export function useFeedbackStatusLabels(labels?: LabelOverride<FeedbackStatusLabels>): FeedbackStatusLabels {
   return useKitLabels("feedbackStatus", DEFAULT_FEEDBACK_STATUS_LABELS, labels);
 }
 
 /** `feedbackCategory` resolved: English, then the provider, then `labels`. */
-export function useFeedbackCategoryLabels(labels?: Partial<FeedbackCategoryLabels>): FeedbackCategoryLabels {
+export function useFeedbackCategoryLabels(labels?: LabelOverride<FeedbackCategoryLabels>): FeedbackCategoryLabels {
   return useKitLabels("feedbackCategory", DEFAULT_FEEDBACK_CATEGORY_LABELS, labels);
 }
 
 /** `feedbackToast` resolved: English, then the provider, then `labels`. */
-export function useFeedbackToastLabels(labels?: Partial<FeedbackToastLabels>): FeedbackToastLabels {
+export function useFeedbackToastLabels(labels?: LabelOverride<FeedbackToastLabels>): FeedbackToastLabels {
   return useKitLabels("feedbackToast", DEFAULT_FEEDBACK_TOAST_LABELS, labels);
 }

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

@@ -0,0 +1,11 @@
+// The English words of ./feedback-menu, 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). ./feedback-menu re-exports them.
+
+import type { FeedbackMenuLabels } from "./feedback-menu";
+
+export const DEFAULT_FEEDBACK_MENU_LABELS: FeedbackMenuLabels = {
+  trigger: "Send feedback",
+  myFeedback: "My feedback",
+  viewFeedback: "View feedback",
+};

package/src/feedback/feedback-menu.tsx

@@ -1,10 +1,14 @@
 import { Inbox, MessageSquare } from "lucide-react";
 import type { UserAvatarBadge } from "../components/user-avatar";
-import { useKitLabels } from "../i18n/kit-labels";
+import { useKitLabels, type LabelOverride } from "../i18n/kit-labels";
 import { TopBarActionMenu, type TopBarMenuEntry } from "../shell/topbar-action-menu";
-import { FEEDBACK_CATEGORY_META, type FeedbackCategory } from "./feedback-inbox";
+import type { HoverMenuProps } from "../components/hover-menu";
+// The vocabulary module, not the inbox: this menu is in every app's top bar, the inbox
+// is a page (MOD-1).
+import { FEEDBACK_CATEGORY_META, type FeedbackCategory } from "./feedback-vocabulary";
 import { useFeedbackCategoryLabels } from "./feedback-labels";
 import { FEEDBACK_PICKABLE_CATEGORIES } from "./feedback-record";
+import { DEFAULT_FEEDBACK_MENU_LABELS } from "./feedback-menu-labels";
 
 /**
  * `feedbackMenu` — the top-bar feedback menu's own words (0.27.0). The four category rows
@@ -23,11 +27,8 @@ export interface FeedbackMenuLabels {
   viewFeedback: string;
 }
 
-export const DEFAULT_FEEDBACK_MENU_LABELS: FeedbackMenuLabels = {
-  trigger: "Send feedback",
-  myFeedback: "My feedback",
-  viewFeedback: "View feedback",
-};
+// Defined in ./feedback-menu-labels, which holds no component code (0.34, KS U8).
+export { DEFAULT_FEEDBACK_MENU_LABELS };
 
 export interface FeedbackMenuProps {
   /** A category row was chosen — open the submit dialog on it (`useFeedbackSubmit`'s
@@ -54,9 +55,10 @@ export interface FeedbackMenuProps {
    *  `label` joins the trigger's name ("Send feedback 2 unread"). The words are the app's. */
   iconBadge?: UserAvatarBadge | null;
   /** Prop > `<UiKitProvider labels={{ feedbackMenu }}>` > English. */
-  labels?: Partial<FeedbackMenuLabels>;
-  /** Which edge of the trigger the panel lines up with. Default `end`. */
-  align?: "start" | "end" | "left" | "right";
+  labels?: LabelOverride<FeedbackMenuLabels>;
+  /** Which edge of the trigger the panel lines up with (see `HoverMenu`, whose type this
+   *  is: `left`/`right` are deprecated 0.34). Default `end`. */
+  align?: HoverMenuProps["align"];
 }
 
 /**
@@ -124,7 +126,7 @@ export function FeedbackMenu({
     <TopBarActionMenu
       icon={<MessageSquare className="size-5" />}
       iconBadge={iconBadge}
-      ariaLabel={labels.trigger}
+      aria-label={labels.trigger}
       entries={entries}
       align={align}
     />

package/src/feedback/feedback-record.ts

@@ -1,6 +1,5 @@
-import { DEFAULT_ATTACHMENT_ACCEPT } from "./feedback-attachment";
-import { FEEDBACK_CATEGORY_ORDER } from "./feedback-inbox";
-import type { FeedbackCategory, FeedbackStatus } from "./feedback-inbox";
+import { FEEDBACK_CATEGORY_ORDER } from "./feedback-vocabulary";
+import type { FeedbackCategory, FeedbackStatus } from "./feedback-vocabulary";
 
 /**
  * One feedback report as the three apps send it, and the facts the kit reads off it.
@@ -115,13 +114,28 @@ export interface FeedbackRecord {
 
 /* ── Constants (§3.4, §3.5, §4.3) ─────────────────────────────────────────── */
 
+// The attachment field's three defaults live here, not in feedback-attachment.tsx
+// (which re-exports them), since 0.34 (MOD-1, refactor audit 2026-10). This module is in
+// every app's top bar (the menu's categories), and FEEDBACK_ATTACHMENT_ACCEPT below is
+// built on DEFAULT_ATTACHMENT_ACCEPT: imported from the field's module, it tied the top
+// bar to the field, the lazily loaded dialog's heaviest part, for three values.
+
+/** The image types `FeedbackAttachmentField` takes when `accept` is not given. */
+export const DEFAULT_ATTACHMENT_ACCEPT = ["image/png", "image/jpeg", "image/webp", "image/gif"];
+/** 10 MB, the contract's size limit for one file (§3.5). */
+export const DEFAULT_MAX_ATTACHMENT_BYTES = 10 * 1024 * 1024;
+/** How many files `<FeedbackAttachmentField multiple>` takes when `max` is not given
+ *  (0.15.5). Five photos of one problem is already a lot to look through; a report
+ *  that needs more is a conversation, which the thread is for. */
+export const DEFAULT_MAX_ATTACHMENTS = 5;
+
 /**
  * What a report may carry (§3.5, keksdose `upload_guards.py:197` and its
  * `attachment-options.ts`): the kit's four image types plus a PDF and a plain-text log
  * (keksdose feedback #87). SVG and HTML stay out — both are script-carrying documents in
  * an image's clothing. For `FeedbackAttachmentField` / `FeedbackDialog`'s `accept`, with
- * `DEFAULT_MAX_ATTACHMENTS` (5) and `DEFAULT_MAX_ATTACHMENT_BYTES` (10 MB) from
- * feedback-attachment.tsx, which already are the contract's limits.
+ * `DEFAULT_MAX_ATTACHMENTS` (5) and `DEFAULT_MAX_ATTACHMENT_BYTES` (10 MB) above, which
+ * already are the contract's limits.
  *
  * A plain array (not frozen) because `accept` takes `string[]`, as
  * `DEFAULT_ATTACHMENT_ACCEPT` does — copy it before changing it.
@@ -145,8 +159,8 @@ export const FEEDBACK_PICKABLE_CATEGORIES: readonly FeedbackCategory[] = Object.
 /**
  * The statuses a report can be sent back for **rework** from (§3.4): everything the team
  * has answered — `IN_EVALUATION`, `NEEDS_LIVE_TEST`, `POSTPONED`, `DONE`, `WONT_DO`. On
- * these the server reopens the row when the body grows by a rework block; on `OPEN` /
- * `IN_PROGRESS` there is nothing to send back yet.
+ * these the server reopens the row when the body grows by a rework block; on `OPEN`,
+ * `READY` and `IN_PROGRESS` there is nothing to send back yet.
  */
 export const FEEDBACK_REWORKABLE_STATUSES: readonly FeedbackStatus[] = Object.freeze([
   "IN_EVALUATION",

package/src/feedback/feedback-row-detail-labels.ts

@@ -0,0 +1,33 @@
+// The English words of ./feedback-row-detail, 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). ./feedback-row-detail
+// re-exports them.
+
+import type { FeedbackDetailLabels } from "./feedback-row-detail";
+
+export const DEFAULT_FEEDBACK_DETAIL_LABELS: FeedbackDetailLabels = {
+  subject: "Subject",
+  body: "Description",
+  edit: "Edit",
+  editDescription: "Edit description",
+  save: "Save",
+  cancel: "Cancel",
+  url: "URL",
+  copyUrl: "Copy URL",
+  attachment: "Attachment",
+  download: (name) => `Download ${name}`,
+  downloadFailed: "The attachment could not be downloaded.",
+  outcome: "Outcome",
+  resolvedAt: (date) => `Resolved: ${date}`,
+  outcomeAdd: "Add outcome",
+  outcomeUpdate: "Update",
+  outcomePlaceholder: "What was done, decided, or why this won't be addressed.",
+  rework: "Rework",
+  openPage: "Open page",
+  reworkTitle: "Send for rework",
+  reworkSend: "Send rework",
+  reworkPlaceholder: "What still needs refinement? Any new constraints or change of direction.",
+  reworkUploadFailed: "The file could not be uploaded. The rework was not sent.",
+  status: "Status",
+  note: "Note",
+};