@lotics/ui 27.14.0 → 27.15.1

package/AGENTS.md

@@ -90,9 +90,13 @@ CURRENT major only — upgrading an app across majors is `MIGRATION.md`.
   same gesture.
   → [composition.md](./docs/composition.md), [catalog.md](./docs/catalog.md).
 - **A verb about a VALUE goes on the value** — an `InlineButton` in the field's `actions`
-  (Copy, Open), never the row's `trailing`: a control at the page's right edge has to be paired
-  back to the field it belongs to, and one row's action makes EVERY row reserve the column.
-  → [composition.md](./docs/composition.md).
+  (Copy, Open) or a **`CopyButton`** in a register cell, never the row's `trailing`: a control at
+  the page's right edge has to be paired back to the field it belongs to, and one row's action
+  makes EVERY row reserve the column. → [composition.md](./docs/composition.md).
+- **A register row's text is SELECTABLE and a drag is not a press** — the row is a button wrapped
+  around DATA, so dragging across a name and copying it works, and the release that ended the
+  selection does not also open the record. Reach for `CopyButton` only where ONE value is copied
+  often enough to earn a control. → [composition.md](./docs/composition.md).
 - **Files land THREE ways on any surface that holds them** — the section's Add CTA
   (`pickFiles`), and a drag OR paste, both from ONE **`<FileDropTarget … paste>`** wrapping the
   region — a Files section, OR a WHOLE surface (a record's section stack, a register page), so a

package/MIGRATION.md

@@ -4,6 +4,26 @@ Breaking changes, newest first — normally per major, plus the rare minor that
 anyway (recorded under its exact version). The current contract lives in `AGENTS.md` + `docs/`;
 this file exists only to move an app from one release to the next.
 
+## 27.15.0 — a register row's text is selectable, and a drag no longer opens the record
+
+No API change, but two behaviors changed on **every** `PressableRow` / `TableRow` / `PressDoor`
+in every app:
+
+- The row surface no longer sets `userSelect: "none"`, so **text inside a row can be selected**.
+  Nothing moves at rest — only what a drag does. Furniture that must not smear (`Badge`,
+  `Avatar`, `Button`) already opted out for itself, which is why the blanket only ever cost the
+  text it had no business covering.
+- A press that ENDED a text selection **does not fire `onPress`**. Previously a drag-select
+  released into `navigate(...)` and discarded the selection, which is what made a register's own
+  data uncopyable. A caret and a whitespace-only range still press normally.
+
+**A browser test that opens a row by dragging across it must click instead** — a real drag now
+reads as a selection, not a press. Programmatic `fireEvent.click` / `press()` are unaffected
+(they leave no selection).
+
+`LoticsLocale` also gained a **`copyButton: { copy, copied }`** slice for the new `CopyButton`.
+The shipped `en` / `vi` packs carry it; a HAND-AUTHORED pack must add it or it will not typecheck.
+
 ## 27.13.3 — a stacked `Table` row's identity cell no longer renders its column label
 
 No API change, but the rendered output changed on NARROW containers only (below the

package/docs/catalog.md

@@ -41,7 +41,9 @@ fill + border + shadow, for a button sitting ON imagery — a tile's remove ✕,
 retry); needs `accessibilityLabel`/`tooltip`), `TextLink` (underlined text that's OPTIONALLY
 an action (`onPress`) or a link (`href` — a real web anchor) — or, with neither, plain
 underlined text you drop in your own pressable like a table cell; colour via `color`; the
-go-to for Clear / Select all / inline links), `Chip` (dismissible facet chip). A button is
+go-to for Clear / Select all / inline links), `Chip` (dismissible facet chip), `CopyButton`
+(put a value on the clipboard — rides the value it copies, confirms only a real write).
+A button is
 never a raw `Pressable`. For a link OUT (a URL / record / document) use `Link` — fixed
 underline+blue + `role="link"`, the destination signal (`onPress` only — the consumer wires
 the opener, e.g. the app SDK's `openExternal`); `TextLink` is the neutral,
@@ -492,6 +494,21 @@ source (`src/<module>.tsx`/`.ts`) is the API reference.
   heading row) where no text edge exists to betray, or give it the filled tier.
 - **`icon_button`** — `IconButton`: the icon-only circular action (see
   [Actions](#actions)).
+- **`copy_button`** — `CopyButton`: THE copy control — `value` onto the clipboard, glyph
+  flips to a check and the tooltip to the pack's "Copied" for ~2s. The confirmation follows
+  a REAL write: an unreachable clipboard throws and the button stays at rest rather than
+  claiming a copy nothing can paste. `label` names WHAT is copied ("Copy phone number") and
+  is the accessible name — give it on any row carrying more than one value. `size` `sm`
+  (default, beside body/sm text) / `md` (toolbar). **Render it unconditionally**: an empty
+  `value` disables it, because a control that appears once a value arrives shifts a
+  register's columns as its rows load. Nested in a `PressableRow`/`TableRow` it claims its
+  own press. It is a verb about a VALUE, so it rides the value — never a trailing column
+  ([composition.md § A VERB GOES WHERE ITS EFFECT LANDS](./composition.md)).
+- **`copy_text`** — `copyText(value)`: the bare clipboard write under `CopyButton`, for a
+  control that owns its own chrome (a menu item, a `MessageActions` bar taking an action
+  rather than a value). Throws when the clipboard is unreachable — never resolve a write
+  that did not happen, or the caller confirms a lie. Web-only (native has no
+  `navigator.clipboard`).
 - **`back_button`** — `BackButton`: the one go-back control — don't hand-roll it (an
   `arrow-left` `MenuButton` reads as another nav ITEM, not an exit). `onPress` +
   `accessibilityLabel` (defaults to `label`, else the locale's `nav.back` — "Back" /
@@ -530,7 +547,16 @@ source (`src/<module>.tsx`/`.ts`) is the API reference.
 - **`floating_action_bar`** — `FloatingActionBar`: the floating bulk-select action bar.
 - **`pressable_row`** — `PressableRow`: THE register row — full-width hover/open wash,
   `selected` (the open record) vs `marked` (ticked in bulk-select), forwards `ref` for
-  popover anchoring.
+  popover anchoring. **Its text is SELECTABLE**: a register row is a button wrapped around
+  data, so dragging across a name and copying it works, and a release that selected text
+  does not open the record (see `press_selection`). Furniture that must not smear over —
+  `Badge`, `Avatar`, `Button` — opts out for itself.
+  The guard behind it is internal (`press_selection`): only a real, non-empty selection
+  suppresses — a caret and a whitespace-only range (what a stray click can leave) both read
+  as "no selection", because a swallowed click would leave the row impossible to open.
+  `PressDoor` consults it only on a POINTER gesture, since it is the KEYBOARD target and a
+  selection survives a Tab. Off the web there is no selection to read, so a native press is
+  never suppressed.
 - **`press_door`** — `PressDoor`: THE keyboard door — an EMPTY absolutely-positioned
   `Pressable` sibling that carries the `role="button"` tab stop, the (REQUIRED)
   `accessibilityLabel`, and the focus ring for a pressable surface whose content holds its
@@ -1030,6 +1056,8 @@ source (`src/<module>.tsx`/`.ts`) is the API reference.
   empty — and a ladder of fields is a form with invisible borders. Reach for `InlineDatePicker`
   when a person is expected to ENTER the date, and this when the system already knows it.
   Empty renders a thin rule, not a placeholder; read-only (omit `onChange`) renders text alone.
+  `onChange` fires on CLOSE, not on each pick — one commit per visit, and a dismissed panel
+  still writes whatever was picked in it, which is what makes a single tap enough.
   Worked screen: `examples/tpl_record.tsx` § Progress.
 - **`check_circle`** — `CheckCircle`: the completion ring — `state="none" | "partial" | "done"`,
   springing to a filled check when done, distinct from the square checkbox; the

package/docs/composition.md

@@ -355,6 +355,21 @@ hover **OR focus-within**, keeping the action in the DOM + tab order and gating
 so it's still keyboard-reachable. Do that locally — there is deliberately no shared hover-reveal
 primitive (one existed and made the keyboard-inaccessible anti-pattern easy; it was removed).
 
+**A row is a button wrapped around DATA, so its text stays SELECTABLE and a drag is not a press.**
+The surface carries no blanket `userSelect: "none"` — that made a customer's own name and number
+undraggable, which is the one way anybody gets a value out of a table, and it bought nothing the
+furniture wasn't already buying for itself (`Badge`, `Avatar`, `Button` each opt out). Both press
+surfaces consult `pressSelectedText()` instead, so a release that ENDED a selection doesn't also
+open the record and throw that selection away. Only a real, non-empty selection suppresses: a
+swallowed ordinary click would leave the row impossible to open, which is a worse bug than the one
+this fixes.
+
+Selection covers every value at once, so reach for **`CopyButton`** only where one value is copied
+often enough to earn a control (a phone number a rep dials, a reference quoted into a message) —
+and put it ON that value inside its cell, never in the row's trailing column, which has nothing to
+name on a row carrying two of them. It is an action, so the rule above applies: render it
+unconditionally and let an empty `value` disable it, rather than revealing it on hover.
+
 ## Master-detail = list + workspace Drawer with sequencing
 
 Pressing a PRIMARY entity row opens the record workspace in a `Drawer` with `onPrev`/`onNext`/
@@ -592,7 +607,7 @@ gate's SCOPE, once** — never prose beside the button, never revealed only on p
 
   | the act changes… | it lives… |
   |---|---|
-  | a VALUE (copy it, open what it points at) | ON the value — `InlineButton` in the editor's `actions` |
+  | a VALUE (copy it, open what it points at) | ON the value — `InlineButton` in the editor's `actions`, or `CopyButton` in a register cell |
   | a ROW (remove it, move it) | ON the row — an `ActionMenu`, or the row's own controls |
   | the LIST (one more of them) | its section's HEADING row, right edge, `primary` — see [the add-placement law](#the-add-placement-law--a-sections-add-rides-its-heading-row-right-edge) |
   | the RECORD (issue, print, hand off) | its own action row at the section's END |

package/docs/templates.md

@@ -208,7 +208,11 @@ screens — register, per-row action, gated selection, and act-on-many in one. T
   value beneath as `size="xs" color="muted"`, `gap: 2` — and a category / type / attribute goes
   on THAT line, never a second chip beside the name (which reads as its peer, or louder when
   colored, inverting what the row is scanned by; → [composition grammar §`Badge` is for STATUS
-  only](./composition.md)). A per-row action `Button` (here Print) is the row's primary action in
+  only](./composition.md)). Every value in a row is SELECTABLE, so a reader copies any of them
+  without chrome; the supporting phone additionally carries a **`CopyButton`** as the worked
+  example of a verb riding its value — the one value copied often enough to earn a control, and
+  in its own cell rather than the trailing gutter, which two values in a cell give nothing to
+  name. A per-row action `Button` (here Print) is the row's primary action in
   the trailing column, `⋯` its overflow. A select-all band, footer totals + `Pagination`, and a
   `FloatingActionBar` carrying the bulk action while rows are ticked.
 - **A row press opens the PRODUCTION workspace `Drawer`** — which RENDERS

package/examples/tpl_item_list.tsx

@@ -17,6 +17,7 @@ import { FloatingActionBar } from "@lotics/ui/floating_action_bar";
 import { FormField } from "@lotics/ui/form_field";
 import { Icon, type IconName } from "@lotics/ui/icon";
 import { IconButton } from "@lotics/ui/icon_button";
+import { CopyButton } from "@lotics/ui/copy_button";
 import { ListItem } from "@lotics/ui/list_item";
 import { TplRecord } from "./tpl_record";
 import { Screen, ScreenRouter, useScreenRouter } from "@lotics/ui/screen_router";
@@ -204,9 +205,18 @@ function HoSoRow({ hs, daThu, selected, marked, selectable, onToggle, onPress }:
         <Text size="sm" weight="semibold" tabular>{hs.ma}</Text>
       </TableCell>
       <TableCell>
-        <View style={{ gap: 2 }}>
+        <View style={{ gap: 2, alignItems: "flex-start" }}>
           <Text size="sm" weight="medium" numberOfLines={1}>{hs.khach}</Text>
-          <Text size="xs" color="muted" tabular numberOfLines={1}>{hs.dienThoai}</Text>
+          {/* Every value on this row is selectable — that is what a register owes
+              its reader, and it costs no chrome. The phone gets a CONTROL on top
+              because it is the one value copied often enough to earn one (a desk
+              pastes it into a message, a rep dials it). The verb rides the value
+              inside its own cell: the trailing gutter belongs to the ⋯, and with
+              two values in this cell it would have nothing to name. */}
+          <View style={{ flexDirection: "row", alignItems: "center", gap: 2 }}>
+            <Text size="xs" color="muted" tabular numberOfLines={1}>{hs.dienThoai}</Text>
+            <CopyButton value={hs.dienThoai} label="Copy phone number" />
+          </View>
         </View>
       </TableCell>
       <TableCell>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lotics/ui",
-  "version": "27.14.0",
+  "version": "27.15.1",
   "type": "module",
   "exports": {
     "./vite": {
@@ -93,6 +93,11 @@
     "./agent_progress": "./src/agent_progress.tsx",
     "./approval_prompt": "./src/approval_prompt.tsx",
     "./message_actions": "./src/message_actions.tsx",
+    "./copy_button": "./src/copy_button.tsx",
+    "./copy_text": {
+      "react-native": "./src/copy_text.ts",
+      "default": "./src/copy_text.web.ts"
+    },
     "./follow_scroll": "./src/follow_scroll.tsx",
     "./markdown": {
       "react-native": "./src/markdown.tsx",

package/src/copy_button.tsx

@@ -0,0 +1,66 @@
+import { useCallback } from "react";
+import { IconButton } from "./icon_button";
+import { useLoticsLocale } from "./locale";
+import { copyText } from "./copy_text";
+import { useCopyFeedback } from "./use_copy_feedback";
+
+export interface CopyButtonProps {
+  /** The text placed on the clipboard. Empty disables the button (see below). */
+  value: string;
+  /** Names WHAT is copied — "Copy phone number", "Sao chép số điện thoại". This
+   *  is the accessible name, so give it whenever the glyph alone leaves the
+   *  target ambiguous, which is any row carrying more than one value. Defaults to
+   *  the pack's bare verb. */
+  label?: string;
+  /** `sm` (the default, 24px) sits beside body/sm text — a value in a register
+   *  cell or a detail row. `md` (28px) for a toolbar. */
+  size?: "sm" | "md";
+  disabled?: boolean;
+  testID?: string;
+}
+
+/**
+ * THE copy control — a verb about a VALUE, so it rides the value it copies
+ * rather than a trailing column (see `docs/composition.md` § A VERB GOES WHERE
+ * ITS EFFECT LANDS: a reserved column is paid by every row for the benefit of
+ * one, and a row carrying two values gives that column nothing to name).
+ *
+ * It owns the whole gesture: the clipboard write, and the confirmation — the
+ * glyph flips to a check and the tooltip to the pack's "Copied" for ~2s. The
+ * confirmation follows a REAL write; an unreachable clipboard throws and the
+ * button stays at rest rather than claiming a copy the user cannot paste.
+ *
+ * **Render it unconditionally and let it disable itself.** An empty `value`
+ * disables the button, which is the same rule an `Inline*` editor's `actions`
+ * slot follows: a control that appears once a value is non-empty changes the
+ * cell's width as the value arrives, and a register whose columns shift as rows
+ * load is worse than a dimmed glyph.
+ *
+ * Nested inside a `PressableRow`/`TableRow` it claims its own press — the row
+ * does not also open.
+ */
+export function CopyButton(props: CopyButtonProps) {
+  const { value, label, size = "sm", disabled, testID } = props;
+  const labels = useLoticsLocale().copyButton;
+  const { copied, run } = useCopyFeedback();
+
+  const handlePress = useCallback(() => {
+    void run(() => copyText(value));
+  }, [run, value]);
+
+  const name = label ?? labels.copy;
+  return (
+    <IconButton
+      testID={testID}
+      size={size}
+      icon={copied ? "check" : "copy"}
+      // The announced name stays PUT while the tooltip flips: a name that changes
+      // under a screen-reader user mid-press reads as a different control, and the
+      // check glyph is the confirmation for everyone who can see it.
+      accessibilityLabel={name}
+      tooltip={copied ? labels.copied : name}
+      disabled={disabled || value === ""}
+      onPress={handlePress}
+    />
+  );
+}

package/src/copy_text.ts

@@ -0,0 +1,16 @@
+/**
+ * Native stand-in for the web clipboard write.
+ *
+ * React Native has no `navigator.clipboard` — the OS clipboard is a separate
+ * module (`@react-native-clipboard/clipboard`) the kit does not depend on. It
+ * throws for the same reason the web variant throws on an unreachable clipboard:
+ * a caller confirms the write in the UI, so failing silently would confirm a copy
+ * that never happened. The file exists so a shared screen can import `copyText`
+ * unconditionally without `navigator` ever reaching Metro.
+ *
+ * Web targets resolve `copy_text.web.ts` instead (Metro's `.web` extension
+ * resolution; the package's `react-native` export condition).
+ */
+export async function copyText(_value: string): Promise<void> {
+  throw new Error("copyText is web-only: React Native has no navigator.clipboard.");
+}

package/src/copy_text.web.ts

@@ -0,0 +1,17 @@
+/**
+ * Web variant: place `value` on the system clipboard.
+ *
+ * Isolated into its own module so the native bundle (which resolves
+ * `copy_text.ts`) never references `navigator`.
+ *
+ * It THROWS when the clipboard is unreachable — a non-secure origin, a browser
+ * without the async clipboard, a denied permission — rather than resolving. Every
+ * caller confirms the write in the UI, and a confirmation for a copy that never
+ * happened sends the user off to paste nothing.
+ */
+export async function copyText(value: string): Promise<void> {
+  if (typeof navigator === "undefined" || !navigator.clipboard) {
+    throw new Error("Clipboard is not available in this environment.");
+  }
+  await navigator.clipboard.writeText(value);
+}

package/src/date_stamp.tsx

@@ -1,4 +1,4 @@
-import { useState } from "react";
+import { useRef, useState } from "react";
 import { Pressable, View } from "react-native";
 import { Text } from "./text";
 import { Icon } from "./icon";
@@ -50,6 +50,10 @@ export function DateStamp(props: DateStampProps) {
   const [hovered, setHovered] = useState(false);
   const [open, setOpen] = useState(false);
   const [draft, setDraft] = useState<string | null>(value);
+  // The panel emits its pick and asks to close in the SAME event, so a commit
+  // that read `draft` off render state would still see the value the pick just
+  // replaced. This is what the close path reads instead.
+  const picked = useRef<string | null>(value);
 
   const shown = value ? formatDate(value, { locale: tag }) : "";
 
@@ -57,21 +61,34 @@ export function DateStamp(props: DateStampProps) {
   // so a caller can drop this into a column without a conditional.
   if (!onChange) return shown ? <Text size="xs" color="muted">{shown}</Text> : null;
 
+  // Commit on CLOSE, matching `InlineDatePicker`: a single pick and the panel's
+  // Today button both auto-close, so committing on CHANGE instead would fire
+  // twice and a dismissed panel would still write.
+  //
+  // It has to be THIS function rather than `onOpenChange`, and every close has to
+  // route through it: a day press closes the panel via `onRequestClose`, which
+  // never reaches `onOpenChange`, so a commit living there is skipped by the one
+  // path this component exists for — picking a date. The popover shuts, the
+  // correction is discarded, and nothing says so. A stamp that silently drops the
+  // correction is worse than a read-only one.
+  const commit = () => {
+    setOpen(false);
+    if (picked.current !== value) onChange(picked.current ?? "");
+  };
+  const reopen = () => {
+    picked.current = value;
+    setDraft(value);
+    setOpen(true);
+  };
+
   return (
     <Popover
       open={open}
-      onOpenChange={(next) => {
-        setOpen(next);
-        // Commit on CLOSE, matching `InlineDatePicker`: a single pick and the
-        // panel's Today button both auto-close through here, so committing on
-        // change instead would fire twice and a dismissed panel would still write.
-        if (!next && draft !== value) onChange(draft ?? "");
-        if (next) setDraft(value);
-      }}
+      onOpenChange={(next) => { if (next) reopen(); else commit(); }}
     >
       <PopoverTrigger>
         <Pressable
-          onPress={() => setOpen(true)}
+          onPress={reopen}
           onHoverIn={() => setHovered(true)}
           onHoverOut={() => setHovered(false)}
           accessibilityRole="button"
@@ -114,7 +131,13 @@ export function DateStamp(props: DateStampProps) {
         </Pressable>
       </PopoverTrigger>
       <PopoverContent>
-        <DatePickerPanel value={draft} onValueChange={setDraft} format="date" locale={tag} onRequestClose={() => setOpen(false)} />
+        <DatePickerPanel
+          value={draft}
+          onValueChange={(iso) => { picked.current = iso; setDraft(iso); }}
+          format="date"
+          locale={tag}
+          onRequestClose={commit}
+        />
       </PopoverContent>
     </Popover>
   );

package/src/locale.tsx

@@ -209,6 +209,10 @@ export interface LoticsLocale {
   /** `MessageActions`: the copy tooltip + its flipped "copied" confirmation, the
    *  regenerate and edit tooltips, and the branch pager's prev/next names. */
   messageActions: { copy: string; copied: string; regenerate: string; edit: string; previousVersion: string; nextVersion: string };
+  /** `CopyButton`: the bare verb and its flipped confirmation. WHAT is being
+   *  copied stays a per-instance `label` ("Copy phone number") — that names a
+   *  value only the call site knows, the same split `referenceField.open` draws. */
+  copyButton: { copy: string; copied: string };
 }
 
 /** The platform default — English. Every component's hardcoded default lives
@@ -370,6 +374,7 @@ export const en: LoticsLocale = {
   },
   approvalPrompt: { message: "The assistant wants to perform an action that needs your approval.", approve: "Approve", deny: "Deny" },
   messageActions: { copy: "Copy", copied: "Copied", regenerate: "Regenerate", edit: "Edit", previousVersion: "Previous version", nextVersion: "Next version" },
+  copyButton: { copy: "Copy", copied: "Copied" },
 };
 
 /** Vietnamese. Maintained once here so every app (and the frontend) shares one
@@ -528,6 +533,7 @@ export const vi: LoticsLocale = {
   },
   approvalPrompt: { message: "Trợ lý muốn thực hiện thao tác cần bạn duyệt.", approve: "Cho phép", deny: "Từ chối" },
   messageActions: { copy: "Sao chép", copied: "Đã sao chép", regenerate: "Tạo lại", edit: "Chỉnh sửa", previousVersion: "Phiên bản trước", nextVersion: "Phiên bản sau" },
+  copyButton: { copy: "Sao chép", copied: "Đã sao chép" },
 };
 
 const LoticsLocaleContext = createContext<LoticsLocale>(en);

package/src/message_actions.tsx

@@ -1,8 +1,9 @@
-import { useCallback, useEffect, useRef, useState } from "react";
+import { useCallback } from "react";
 import { StyleSheet, View } from "react-native";
 import { Text } from "./text";
 import { IconButton } from "./icon_button";
 import { useLoticsLocale } from "./locale";
+import { useCopyFeedback } from "./use_copy_feedback";
 
 /** The branch/version pager slot — the previous/next controls over a message's
  *  sibling versions. Rendered only when `total > 1`. */
@@ -41,24 +42,14 @@ export interface MessageActionsProps {
 export function MessageActions(props: MessageActionsProps) {
   const { onCopy, onRegenerate, onEdit, branch } = props;
   const labels = useLoticsLocale().messageActions;
-  const [copied, setCopied] = useState(false);
-  const timer = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);
+  // The flip + its unmount-safe timer are `CopyButton`'s too — see `useCopyFeedback`.
+  // The bar keeps its own control because it takes an ACTION, not a value: the
+  // message text it would copy is assembled from parts the bar cannot see.
+  const { copied, run } = useCopyFeedback();
 
-  // The copied flag flips back after a beat; the timer is cleared on unmount so
-  // a bar that disappears (last message loses its actions) never sets state on
-  // an unmounted tree.
-  useEffect(() => {
-    return () => {
-      if (timer.current) clearTimeout(timer.current);
-    };
-  }, []);
-
-  const handleCopy = useCallback(async () => {
-    await onCopy?.();
-    setCopied(true);
-    if (timer.current) clearTimeout(timer.current);
-    timer.current = setTimeout(() => setCopied(false), 2000);
-  }, [onCopy]);
+  const handleCopy = useCallback(() => {
+    void run(() => onCopy?.());
+  }, [run, onCopy]);
 
   return (
     <View style={styles.bar}>

package/src/press_door.tsx

@@ -1,6 +1,8 @@
+import { useCallback, useRef } from "react";
 import { Pressable, StyleSheet } from "react-native";
 import { FOCUS_RING } from "./control_surface";
 import { useFocusRing } from "./use_focus_ring";
+import { pressSelectedText } from "./press_selection";
 
 export interface PressDoorProps {
   /** Opens the thing the surface stands for — the same handler the surface presses. */
@@ -53,6 +55,27 @@ export interface PressDoorProps {
  */
 export function PressDoor({ onPress, accessibilityLabel, expanded, radius = 10 }: PressDoorProps) {
   const { focusVisible, focusProps } = useFocusRing();
+
+  // The door spans the row beneath its cells, so a drag BETWEEN cells — from the
+  // blank left of a name to the blank right of it — selects that name with both
+  // ends of the gesture on the door. Same guard as `PressableRow`: it selected
+  // text, so it was not a press.
+  //
+  // Scoped to POINTER gestures, which `PressableRow` doesn't need (it is
+  // `tabIndex={-1}`, so the mouse is the only thing that presses it) and the door
+  // does: the door IS the keyboard target, and a selection left anywhere on the
+  // page survives a Tab. Without this, selecting a name and then keyboard-opening
+  // any row would silently do nothing.
+  const fromPointer = useRef(false);
+  const mouseProps = { onMouseDown: () => (fromPointer.current = true) } as object;
+
+  const handlePress = useCallback(() => {
+    const pointer = fromPointer.current;
+    fromPointer.current = false;
+    if (pointer && pressSelectedText()) return;
+    onPress();
+  }, [onPress]);
+
   return (
     <Pressable
       accessibilityRole="button"
@@ -61,7 +84,8 @@ export function PressDoor({ onPress, accessibilityLabel, expanded, radius = 10 }
       // the latter silently. Set only when the door TOGGLES something: on a door
       // that navigates it would promise a disclosure the press does not perform.
       aria-expanded={expanded}
-      onPress={onPress}
+      onPress={handlePress}
+      {...mouseProps}
       {...focusProps}
       style={[styles.door, { borderRadius: radius }, focusVisible && { boxShadow: FOCUS_RING }]}
     />

package/src/press_selection.ts

@@ -0,0 +1,47 @@
+/**
+ * Whether a press must be swallowed because the same gesture SELECTED text.
+ *
+ * A register row is a button wrapped around DATA. Dragging across a customer's
+ * name ends in a click on the row, so without this guard the release navigates
+ * to the record and discards the selection — the row's own press is what makes
+ * its content uncopyable. Both of a row's press surfaces consult this:
+ * `PressableRow` (the mouse) and `PressDoor` (the blank space beneath the cells).
+ *
+ * Deliberately narrow. A plain click that got swallowed would leave the row
+ * impossible to open, which is far worse than losing a selection, so only a
+ * real, non-empty selection suppresses — and only a POINTER gesture consults it
+ * on the door, which is the KEYBOARD target: a selection left anywhere on the
+ * page survives a Tab, so a door that checked it on Enter would refuse to open
+ * any row until the user cleared a selection they may not even see.
+ */
+
+/** The shape read off `window.getSelection()`. Structural, so this module stays
+ *  DOM-free at the type level and is testable without a document. */
+export interface TextSelection {
+  isCollapsed: boolean;
+  toString(): string;
+}
+
+/**
+ * True when `selection` holds text the user meant to keep. A COLLAPSED selection
+ * is a caret, not a selection. Whitespace-only is what an ordinary click can
+ * leave behind when its anchor and focus land in different inline boxes — a row
+ * that refused to open after a stray click would be a worse bug than the one
+ * this fixes, so that reads as "nothing selected" too.
+ */
+export function isTextSelected(selection: TextSelection | null | undefined): boolean {
+  if (!selection || selection.isCollapsed) return false;
+  return selection.toString().trim() !== "";
+}
+
+/** The live selection, or null off the web — React Native has no `getSelection`,
+ *  so a native press is never suppressed. */
+export function activeTextSelection(): TextSelection | null {
+  if (typeof window === "undefined" || typeof window.getSelection !== "function") return null;
+  return window.getSelection();
+}
+
+/** The guard itself: did the gesture that just ended select text? */
+export function pressSelectedText(): boolean {
+  return isTextSelected(activeTextSelection());
+}

package/src/pressable_row.tsx

@@ -1,6 +1,7 @@
-import { ReactNode, Ref, useState } from "react";
+import { ReactNode, Ref, useCallback, useState } from "react";
 import { Pressable, StyleProp, StyleSheet, View, ViewStyle } from "react-native";
 import { colors } from "./colors";
+import { pressSelectedText } from "./press_selection";
 
 export interface PressableRowProps {
   onPress: () => void;
@@ -56,6 +57,14 @@ export function PressableRow(props: PressableRowProps) {
   const { onPress, selected = false, marked = false, variant = "register", children, style, ref } = props;
   const [hovered, setHovered] = useState(false);
 
+  // A drag that selected text ends in a click on this row. Opening the record
+  // here would navigate away and take the selection with it, which is what made
+  // a register's own data uncopyable — see `press_selection`.
+  const handlePress = useCallback(() => {
+    if (pressSelectedText()) return;
+    onPress();
+  }, [onPress]);
+
   // RN's types don't declare mouse handlers; react-native-web forwards them
   // to the DOM element (same boundary cast PressableHighlight uses).
   const mouseProps = {
@@ -66,7 +75,7 @@ export function PressableRow(props: PressableRowProps) {
   return (
     <Pressable
       ref={ref}
-      onPress={onPress}
+      onPress={handlePress}
       // Non-focusable surface: tabIndex, NOT focusable — RN-Web's Pressable
       // ignores `focusable` and writes its own tabIndex (the keyboard target is
       // the nested "Open …" button, not this row).
@@ -91,7 +100,13 @@ const styles = StyleSheet.create({
     flexDirection: "row",
     alignItems: "center",
     gap: 12,
-    ...({ cursor: "pointer", userSelect: "none", transitionDuration: "0.1s", transitionProperty: "background-color" } as ViewStyle),
+    // No `userSelect: "none"` here. A register row is a button wrapped around
+    // DATA, and a blanket none on the surface made the customer's own name and
+    // number unselectable — the one way anybody gets a value out of a table. The
+    // furniture that must not be dragged over already opts out for itself
+    // (`Badge`, `Avatar`, `Button` each set none), so the blanket only ever cost
+    // the text it had no business covering.
+    ...({ cursor: "pointer", transitionDuration: "0.1s", transitionProperty: "background-color" } as ViewStyle),
   },
   // THE register row — FULL-WIDTH rounded highlight. The hover/selected wash
   // spans the entire row (so the pressable area === the row, never narrower than

package/src/use_copy_feedback.ts

@@ -0,0 +1,38 @@
+import { useCallback, useEffect, useRef, useState } from "react";
+
+/**
+ * The copied-feedback flip every copy control shares: after a write RESOLVES the
+ * control reports copied for a beat, then returns to rest.
+ *
+ * Two rules live here rather than in each control. The flip follows a REAL
+ * write — `run` awaits, and a rejected write propagates without ever setting the
+ * flag, so a control never confirms a copy that did not happen. And the timer is
+ * cleared on unmount, so a control that disappears mid-beat (a row scrolled out
+ * of a register, a message bar that loses its actions) never sets state on an
+ * unmounted tree.
+ */
+export function useCopyFeedback(resetMs = 2000): {
+  copied: boolean;
+  run: (write: () => void | Promise<void>) => Promise<void>;
+} {
+  const [copied, setCopied] = useState(false);
+  const timer = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);
+
+  useEffect(() => {
+    return () => {
+      if (timer.current) clearTimeout(timer.current);
+    };
+  }, []);
+
+  const run = useCallback(
+    async (write: () => void | Promise<void>) => {
+      await write();
+      setCopied(true);
+      if (timer.current) clearTimeout(timer.current);
+      timer.current = setTimeout(() => setCopied(false), resetMs);
+    },
+    [resetMs],
+  );
+
+  return { copied, run };
+}