@nivaro/react 0.3.34 → 0.3.35

package/dist/shared/components/item-edit/FieldAffordances.js

@@ -1,31 +1,33 @@
-import { jsx as s, jsxs as y, Fragment as z } from "react/jsx-runtime";
-import { Copy as Y, History as Q, Eye as Z, Sigma as ee, ExternalLink as te, UserRound as ne, UserRoundX as re, Lock as oe, X } from "lucide-react";
-import { useContext as ae, createContext as se, useState as M, useCallback as F, useRef as j, useEffect as _, useLayoutEffect as le } from "react";
-import { createPortal as ie } from "react-dom";
-import { toast as h } from "sonner";
-import { htmlToText as ce } from "../../lib/sanitize-html.js";
-import { cn as q, formatRelative as I } from "../../lib/utils.js";
-import { PERSONAL_DEFAULT_GHOST_BUTTON as de } from "./PersonalDefaultPill.js";
-import { usePersonalDefaultsApi as ue } from "./usePersonalDefaults.js";
-const me = se(null), Ce = () => ae(me), V = (t) => {
-  if (t == null || t === "") return "empty";
-  if (typeof t == "boolean") return t ? "Yes" : "No";
-  if (typeof t == "object")
+import { jsx as s, jsxs as h, Fragment as fe } from "react/jsx-runtime";
+import { Copy as Q, History as me, Eye as be, Sigma as pe, ExternalLink as xe, UserRound as ye, UserRoundPen as he, UserRoundX as ge, Lock as ke, X as ne } from "lucide-react";
+import { useContext as we, createContext as ve, useState as C, useCallback as N, useRef as M, useEffect as B, useLayoutEffect as Ne } from "react";
+import { createPortal as Ce } from "react-dom";
+import { toast as v } from "sonner";
+import { htmlToText as Se } from "../../lib/sanitize-html.js";
+import { cn as re, formatRelative as Z } from "../../lib/utils.js";
+import { useOverflowTip as Ee } from "../TipLayer.js";
+import { clearPersonalDefault as Te, usePersonalDefaultCss as Ue, refusalText as ee } from "./PersonalDefaultControl.js";
+import { PERSONAL_DEFAULT_GHOST_BUTTON as Le } from "./PersonalDefaultPill.js";
+import { usePersonalDefaultsApi as Fe } from "./usePersonalDefaults.js";
+const Me = ve(null), Ve = () => we(Me), te = (n) => {
+  if (n == null || n === "") return "empty";
+  if (typeof n == "boolean") return n ? "Yes" : "No";
+  if (typeof n == "object")
     try {
-      const a = JSON.stringify(t);
-      return a.length > 80 ? `${a.slice(0, 80)}…` : a;
+      const l = JSON.stringify(n);
+      return l.length > 80 ? `${l.slice(0, 80)}…` : l;
     } catch {
-      return String(t);
+      return String(n);
     }
-  const n = String(t), e = /[<&]/.test(n) ? ce(n).trim() : n;
-  return e.length > 80 ? `${e.slice(0, 80)}…` : e;
+  const t = String(n), o = /[<&]/.test(t) ? Se(t).trim() : t;
+  return o.length > 80 ? `${o.slice(0, 80)}…` : o;
 };
-function Se({
-  change: t,
-  onDismiss: n,
-  onTakeTheirs: e
+function Xe({
+  change: n,
+  onDismiss: t,
+  onTakeTheirs: o
 }) {
-  return t.conflict && e ? /* @__PURE__ */ y(
+  return n.conflict && o ? /* @__PURE__ */ h(
     "div",
     {
       "data-remote-change-ghost": !0,
@@ -33,23 +35,23 @@ function Se({
       className: "nvr-expand-in flex flex-wrap items-center gap-1.5 rounded-md border border-amber-300 bg-amber-50 px-2 py-1 text-[11.5px] text-amber-900 dark:border-amber-500/40 dark:bg-amber-500/10 dark:text-amber-100",
       children: [
         /* @__PURE__ */ s("span", { className: "h-1.5 w-1.5 shrink-0 animate-pulse rounded-full bg-amber-500" }),
-        /* @__PURE__ */ y("span", { className: "min-w-0 flex-1", children: [
-          t.by ?? "Someone",
+        /* @__PURE__ */ h("span", { className: "min-w-0 flex-1", children: [
+          n.by ?? "Someone",
           " changed this to",
           " ",
-          /* @__PURE__ */ s("span", { className: "font-medium", children: V(t.theirs) }),
+          /* @__PURE__ */ s("span", { className: "font-medium", children: te(n.theirs) }),
           " while you were editing",
-          /* @__PURE__ */ y("span", { className: "text-amber-700/80 dark:text-amber-200/70", children: [
+          /* @__PURE__ */ h("span", { className: "text-amber-700/80 dark:text-amber-200/70", children: [
             " ",
             "· ",
-            I(t.at)
+            Z(n.at)
           ] })
         ] }),
         /* @__PURE__ */ s(
           "button",
           {
             type: "button",
-            onClick: e,
+            onClick: o,
             "data-remote-take-theirs": !0,
             className: "shrink-0 rounded border border-amber-400 bg-white px-1.5 py-0.5 text-[10.5px] font-medium text-amber-900 hover:bg-amber-100 dark:bg-transparent dark:text-amber-100 dark:hover:bg-amber-500/20",
             children: "Take theirs"
@@ -59,7 +61,7 @@ function Se({
           "button",
           {
             type: "button",
-            onClick: n,
+            onClick: t,
             "data-remote-keep-mine": !0,
             className: "shrink-0 rounded px-1.5 py-0.5 text-[10.5px] font-medium text-amber-800 hover:bg-amber-100 dark:text-amber-200 dark:hover:bg-amber-500/20",
             children: "Keep mine"
@@ -67,353 +69,395 @@ function Se({
         )
       ]
     }
-  ) : /* @__PURE__ */ y(
+  ) : /* @__PURE__ */ h(
     "div",
     {
       "data-remote-change-ghost": !0,
       className: "nvr-expand-in flex items-start gap-1.5 rounded-md border border-sky-200 bg-sky-50 px-2 py-1 text-[11.5px] text-sky-900 dark:border-sky-500/30 dark:bg-sky-500/10 dark:text-sky-200",
       children: [
         /* @__PURE__ */ s("span", { className: "mt-0.5 h-1.5 w-1.5 shrink-0 animate-pulse rounded-full bg-sky-500" }),
-        /* @__PURE__ */ y("span", { className: "min-w-0 flex-1", children: [
+        /* @__PURE__ */ h("span", { className: "min-w-0 flex-1", children: [
           "was",
           " ",
-          /* @__PURE__ */ s("span", { className: "font-medium line-through decoration-sky-400/70", children: V(t.was) }),
-          /* @__PURE__ */ y("span", { className: "text-sky-700/80 dark:text-sky-300/80", children: [
+          /* @__PURE__ */ s("span", { className: "font-medium line-through decoration-sky-400/70", children: te(n.was) }),
+          /* @__PURE__ */ h("span", { className: "text-sky-700/80 dark:text-sky-300/80", children: [
             " ",
             "· ",
-            t.by ?? "someone",
+            n.by ?? "someone",
             ", ",
-            I(t.at)
+            Z(n.at)
           ] })
         ] }),
         /* @__PURE__ */ s(
           "button",
           {
             type: "button",
-            onClick: n,
+            onClick: t,
             "aria-label": "Dismiss",
             className: "shrink-0 rounded p-0.5 text-sky-500 hover:bg-sky-100 hover:text-sky-800 dark:hover:bg-sky-500/20",
-            children: /* @__PURE__ */ s(X, { className: "h-3 w-3" })
+            children: /* @__PURE__ */ s(ne, { className: "h-3 w-3" })
           }
         )
       ]
     }
   );
 }
-function Ee({ reason: t, onHover: n }) {
+function Ye({ reason: n, onHover: t }) {
   return /* @__PURE__ */ s(
     "span",
     {
-      onPointerEnter: n,
+      onPointerEnter: t,
       className: "inline-flex cursor-help items-center gap-1 text-amber-500 dark:text-amber-400",
-      "data-tip": t,
+      "data-tip": n,
       "data-lock-reason": !0,
-      "aria-label": t,
+      "aria-label": n,
       role: "img",
-      children: /* @__PURE__ */ s(oe, { className: "h-3 w-3" })
+      children: /* @__PURE__ */ s(ke, { className: "h-3 w-3" })
     }
   );
 }
-function P(t, n) {
-  var a, c, d;
-  const e = t;
-  return ((c = (a = e == null ? void 0 : e.response) == null ? void 0 : a.data) == null ? void 0 : c.error) ?? ((d = e == null ? void 0 : e.data) == null ? void 0 : d.error) ?? (e == null ? void 0 : e.error) ?? (e == null ? void 0 : e.message) ?? n;
-}
-function fe(t, n) {
-  if (!t || !(n != null && n.contains(t))) return null;
-  const e = t.closest(
+function Re(n, t) {
+  if (!n || !(t != null && t.contains(n))) return null;
+  const o = n.closest(
     "input, textarea, select"
   );
-  if (e && n.contains(e) && !(e instanceof HTMLInputElement && e.type === "checkbox"))
-    return e.value;
-  const a = t.closest("td, th");
-  return a && n.contains(a) ? a.innerText.replace(/\s+/g, " ").trim() : null;
+  if (o && t.contains(o) && !(o instanceof HTMLInputElement && o.type === "checkbox"))
+    return o.value;
+  const l = n.closest("td, th");
+  return l && t.contains(l) ? l.innerText.replace(/\s+/g, " ").trim() : null;
 }
-function Te({
-  wrapperRef: t,
-  field: n,
-  value: e,
-  relations: a,
-  collection: c,
-  itemId: d,
-  openRelated: g,
-  editable: D = !1
+function qe({
+  wrapperRef: n,
+  field: t,
+  value: o,
+  relations: l,
+  collection: m,
+  itemId: x,
+  openRelated: w,
+  editable: R = !1
 }) {
-  var B, H;
-  const [p, S] = M(null), l = ue(), [k, E] = M(!1), [f, O] = M(null), [U, A] = M(!1), v = F((r, u) => S({ x: r, y: u }), []), w = j(null), T = F(() => {
-    S(null), E(!1), O(null), A(!1);
-    const r = w.current;
-    w.current = null, r && window.setTimeout(() => {
-      r.isConnected && (!document.activeElement || document.activeElement === document.body) && r.focus();
+  var J, z;
+  const [g, T] = C(null), r = Fe(), [k, S] = C(!1), [y, O] = C(null), [U, A] = C(null), [$, j] = C(!1), b = N((e, c) => T({ x: e, y: c }), []), [D, a] = C(null), f = M(null), L = M(null), i = N(() => {
+    T(null), a(null), S(!1), O(null), A(null), j(!1);
+    const e = f.current, c = L.current;
+    f.current = null, L.current = null, (e || c) && window.setTimeout(() => {
+      var u;
+      document.activeElement && document.activeElement !== document.body || (e != null && e.isConnected ? e.focus() : (u = c == null ? void 0 : c()) == null || u.focus());
     }, 0);
-  }, []), o = p !== null, b = F(
-    (r) => {
-      if (o) {
-        T();
+  }, []), p = g !== null, d = N(
+    (e) => {
+      if (p) {
+        i();
         return;
       }
-      const u = r.getBoundingClientRect();
-      N.current = null, w.current = r, v(u.left, u.bottom + 4);
+      const c = e.getBoundingClientRect();
+      _.current = null, f.current = e, a("menu"), b(c.left, c.bottom + 4);
     },
-    [o, T, v]
-  ), N = j(null), m = F(
-    (r) => {
-      var K;
-      const u = r.target;
-      (K = window.getSelection()) != null && K.toString() && u.closest("input, textarea, [contenteditable]") || (r.preventDefault(), N.current = u, v(r.clientX, r.clientY));
+    [p, i, b]
+  ), E = N(() => {
+    r && (O(null), S("save"), r.describeSave(t.field).then(
+      (e) => O(e),
+      () => O([])
+    ));
+  }, [r, t.field]), P = N(() => {
+    r && (A(null), S("update"), r.describeUpdate(t.field).then(
+      (e) => A(e),
+      () => A({ value: "", context: [] })
+    ));
+  }, [r, t.field]), H = N(
+    (e, c, u = "make") => {
+      if (p && D === u) {
+        i();
+        return;
+      }
+      const F = e.getBoundingClientRect();
+      _.current = null, f.current = e, L.current = c ?? null, a(u), u === "update" ? P() : E(), b(F.right - ae, F.bottom + 4);
     },
-    [v]
-  ), x = F(
-    (r) => {
-      var u;
-      if (r.key === "ContextMenu" || r.shiftKey && r.key === "F10") {
-        r.preventDefault();
-        const L = (u = t.current) == null ? void 0 : u.getBoundingClientRect();
-        N.current = document.activeElement, v(L ? L.left + 16 : 16, L ? L.top + 28 : 16);
+    [p, D, i, b, E, P]
+  ), _ = M(null), oe = N(
+    (e) => {
+      var F;
+      const c = e.target;
+      (F = window.getSelection()) != null && F.toString() && c.closest("input, textarea, [contenteditable]") || (e.preventDefault(), _.current = c, a("menu"), b(e.clientX, e.clientY));
+    },
+    [b]
+  ), le = N(
+    (e) => {
+      var c;
+      if (e.key === "ContextMenu" || e.shiftKey && e.key === "F10") {
+        e.preventDefault();
+        const u = (c = n.current) == null ? void 0 : c.getBoundingClientRect();
+        _.current = document.activeElement, a("menu"), b(u ? u.left + 16 : 16, u ? u.top + 28 : 16);
       }
     },
-    [v, t]
-  ), i = a.find(
-    (r) => r.many_collection === c && r.many_field === n.field && r.one_collection
-  ), C = d && d !== "new", R = (r) => {
-    var L;
-    const u = (L = t.current) == null ? void 0 : L.querySelector(r);
-    return u ? (u.click(), !0) : !1;
-  }, $ = [
+    [b, n]
+  ), I = l.find(
+    (e) => e.many_collection === m && e.many_field === t.field && e.one_collection
+  ), K = x && x !== "new", W = (e) => {
+    var u;
+    const c = (u = n.current) == null ? void 0 : u.querySelector(e);
+    return c ? (c.click(), !0) : !1;
+  }, V = !!(r != null && r.allowed(t.field)), X = V && R && !!(r != null && r.hasValue(t.field)), G = V ? (r == null ? void 0 : r.defaultFor(t.field)) ?? null : null, se = X && !G, ie = X && !!G && !(r != null && r.isDefault(t.field)), Y = [
     {
       key: "copy",
       label: "Copy value",
-      icon: /* @__PURE__ */ s(Y, { className: "h-3.5 w-3.5" }),
+      icon: /* @__PURE__ */ s(Q, { className: "h-3.5 w-3.5" }),
       run: () => {
-        const u = fe(N.current, t.current) ?? (e == null ? "" : typeof e == "object" ? JSON.stringify(e) : String(e));
-        if (!u) {
-          h.info("Nothing to copy");
+        const c = Re(_.current, n.current) ?? (o == null ? "" : typeof o == "object" ? JSON.stringify(o) : String(o));
+        if (!c) {
+          v.info("Nothing to copy");
           return;
         }
-        navigator.clipboard.writeText(u).then(
-          () => h.success("Value copied"),
-          () => h.error("Could not copy")
+        navigator.clipboard.writeText(c).then(
+          () => v.success("Value copied"),
+          () => v.error("Could not copy")
         );
       }
     },
     {
       key: "copy-key",
       label: "Copy field key",
-      icon: /* @__PURE__ */ s(Y, { className: "h-3.5 w-3.5" }),
-      hint: n.field,
+      icon: /* @__PURE__ */ s(Q, { className: "h-3.5 w-3.5" }),
+      hint: t.field,
       run: () => {
-        navigator.clipboard.writeText(n.field).then(
-          () => h.success(`Copied “${n.field}”`),
-          () => h.error("Could not copy")
+        navigator.clipboard.writeText(t.field).then(
+          () => v.success(`Copied “${t.field}”`),
+          () => v.error("Could not copy")
         );
       }
     },
     {
       key: "history",
       label: "Value history",
-      icon: /* @__PURE__ */ s(Q, { className: "h-3.5 w-3.5" }),
-      disabled: !C,
+      icon: /* @__PURE__ */ s(me, { className: "h-3.5 w-3.5" }),
+      disabled: !K,
       run: () => {
-        R("[data-field-history]") || h.info("No history for this field yet");
+        W("[data-field-history]") || v.info("No history for this field yet");
       }
     },
     {
       key: "watch",
       label: "Watch this field",
-      icon: /* @__PURE__ */ s(Z, { className: "h-3.5 w-3.5" }),
-      disabled: !C,
+      icon: /* @__PURE__ */ s(be, { className: "h-3.5 w-3.5" }),
+      disabled: !K,
       run: () => {
-        R("[data-field-watch]") || h.info("Field watching is off — an admin can enable it in Settings → Content");
+        W("[data-field-watch]") || v.info("Field watching is off — an admin can enable it in Settings → Content");
       }
     },
     {
       key: "explain",
       label: "Explain value",
-      icon: /* @__PURE__ */ s(ee, { className: "h-3.5 w-3.5" }),
-      disabled: !C || !((B = t.current) != null && B.querySelector("[data-field-lineage]")),
+      icon: /* @__PURE__ */ s(pe, { className: "h-3.5 w-3.5" }),
+      disabled: !K || !((J = n.current) != null && J.querySelector("[data-field-lineage]")),
       run: () => {
-        R("[data-field-lineage]");
+        W("[data-field-lineage]");
       }
     },
-    ...i && g ? [
+    ...I && w ? [
       {
         key: "open",
-        label: `Open related ${(H = i.one_collection) == null ? void 0 : H.replace(/_/g, " ")}`,
-        icon: /* @__PURE__ */ s(te, { className: "h-3.5 w-3.5" }),
-        disabled: e == null || e === "",
+        label: `Open related ${(z = I.one_collection) == null ? void 0 : z.replace(/_/g, " ")}`,
+        icon: /* @__PURE__ */ s(xe, { className: "h-3.5 w-3.5" }),
+        disabled: o == null || o === "",
         run: () => {
-          const r = typeof e == "object" && e && "id" in e ? String(e.id) : String(e);
-          g(String(i.one_collection), r);
+          const e = typeof o == "object" && o && "id" in o ? String(o.id) : String(o);
+          w(String(I.one_collection), e);
         }
       }
     ] : [],
-    ...l != null && l.allowed(n.field) && D && l.hasValue(n.field) ? [
+    // Same states as the visible control: no default here → Save; a default holding another
+    // value → Update (that default, in place); the value IS the default → only Clear.
+    ...se ? [
       {
         key: "save-default",
         label: "Save as my default",
-        icon: /* @__PURE__ */ s(ne, { className: "h-3.5 w-3.5" }),
+        icon: /* @__PURE__ */ s(ye, { className: "h-3.5 w-3.5" }),
         stay: !0,
-        run: () => {
-          O(null), E(!0), l.describeSave(n.field).then(
-            (r) => O(r),
-            () => O([])
-          );
-        }
+        run: E
       }
     ] : [],
-    ...l != null && l.allowed(n.field) && l.defaultFor(n.field) ? [
+    ...ie ? [
+      {
+        key: "update-default",
+        label: "Update my default",
+        icon: /* @__PURE__ */ s(he, { className: "h-3.5 w-3.5" }),
+        stay: !0,
+        run: P
+      }
+    ] : [],
+    ...G && r ? [
       {
         key: "clear-default",
         label: "Clear my default",
-        icon: /* @__PURE__ */ s(re, { className: "h-3.5 w-3.5" }),
+        icon: /* @__PURE__ */ s(ge, { className: "h-3.5 w-3.5" }),
         // Runs at once (a menu pick is deliberate); the toast's Undo saves it back.
         run: () => {
-          l.clear(n.field).then(
-            (r) => h.success(
-              "Your default was cleared",
-              r ? {
-                action: {
-                  label: "Undo",
-                  onClick: () => {
-                    l.restore(r).then(
-                      () => h.success("Your default is back"),
-                      (u) => h.error(P(u, "Could not put your default back"))
-                    );
-                  }
-                }
-              } : void 0
-            ),
-            (r) => h.error(P(r, "Could not clear your default"))
-          );
+          Te(r, t.field);
         }
       }
     ] : []
-  ], G = k && l ? {
-    text: f != null && f.length ? `Save ${f.join(" · ")} as your ${f.length > 1 ? "defaults" : "default"}?` : "Save as your default?",
-    ready: f !== null && !U,
-    saving: U,
-    onCancel: T,
+  ], q = (e, c) => {
+    const u = e.value ? ` to ${e.value}` : "", F = e.context.length ? ` for ${e.context.join(" · ")}` : "";
+    return c ? `Updated your default${F}${u}` : `Update your default${F}${u}?`;
+  }, ce = k === "update" && r ? {
+    label: "Update my default",
+    action: "Update",
+    text: U ? q(U, !1) : "Update your default?",
+    ready: U !== null && !$,
+    saving: $,
+    onCancel: i,
     onSave: () => {
-      A(!0), l.save(n.field).then(
+      j(!0), r.update(t.field).then(
         () => {
-          h.success(
-            f != null && f.length ? `Saved ${f.join(" · ")} as your default${f.length > 1 ? "s" : ""}` : "Your default was saved"
-          ), T();
+          v.success(U ? q(U, !0) : "Updated your default"), i();
         },
-        (r) => {
-          h.error(P(r, "Could not save your default")), T();
+        (e) => {
+          v.error(ee(e, "Could not update your default")), i();
         }
       );
     }
-  } : null, J = p ? /* @__PURE__ */ s(
-    be,
+  } : k && r ? {
+    label: "Save as my default",
+    action: "Save",
+    text: y != null && y.length ? `Save ${y.join(" · ")} as your ${y.length > 1 ? "defaults" : "default"}?` : "Save as your default?",
+    ready: y !== null && !$,
+    saving: $,
+    onCancel: i,
+    onSave: () => {
+      j(!0), r.save(t.field).then(
+        () => {
+          v.success(
+            y != null && y.length ? `Saved ${y.join(" · ")} as your default${y.length > 1 ? "s" : ""}` : "Your default was saved"
+          ), i();
+        },
+        (e) => {
+          v.error(ee(e, "Could not save your default")), i();
+        }
+      );
+    }
+  } : null, de = g ? /* @__PURE__ */ s(
+    Oe,
     {
-      at: p,
-      items: $,
-      onClose: T,
-      confirm: G,
-      anchor: t.current
+      at: g,
+      items: Y,
+      onClose: i,
+      confirm: ce,
+      anchor: n.current
     }
-  ) : null, W = $.some((r) => r.key === "save-default" || r.key === "clear-default");
-  return { onContextMenu: m, onKeyDown: x, menu: J, openFrom: b, isOpen: o, hasFieldItems: W };
+  ) : null, ue = Y.some(
+    (e) => e.key === "save-default" || e.key === "update-default" || e.key === "clear-default"
+  );
+  return {
+    onContextMenu: oe,
+    onKeyDown: le,
+    menu: de,
+    openFrom: d,
+    isOpen: p,
+    hasFieldItems: ue,
+    confirmSaveFrom: H,
+    openedBy: D
+  };
 }
-function be({
-  at: t,
-  items: n,
-  onClose: e,
-  confirm: a,
-  anchor: c
+const ae = 240, $e = "[data-field-menu-trigger], [data-personal-default-make], [data-personal-default-update]";
+function Oe({
+  at: n,
+  items: t,
+  onClose: o,
+  confirm: l,
+  anchor: m
 }) {
-  const d = j(null), [g, D] = M(0), p = n.filter((o) => !o.disabled);
-  _(() => {
-    var N;
-    const o = (m) => {
-      var i, C;
-      const x = m.target;
-      (i = d.current) != null && i.contains(x) || (C = x == null ? void 0 : x.closest) != null && C.call(x, "[data-field-menu-trigger]") && (c != null && c.contains(x)) || e();
-    }, b = (m) => {
-      var x;
-      if (m.key === "Escape")
-        m.preventDefault(), e();
-      else if (a) {
-        if (m.key === "Tab") {
-          m.preventDefault();
-          const i = [l.current, S.current].filter(
-            ($) => !!$ && !$.disabled
+  Ue();
+  const x = M(null), [w, R] = C(0), g = t.filter((a) => !a.disabled);
+  B(() => {
+    var L;
+    const a = (i) => {
+      var d, E;
+      const p = i.target;
+      (d = x.current) != null && d.contains(p) || (E = p == null ? void 0 : p.closest) != null && E.call(p, $e) && (m != null && m.contains(p)) || o();
+    }, f = (i) => {
+      var p;
+      if (i.key === "Escape")
+        i.preventDefault(), o();
+      else if (l) {
+        if (i.key === "Tab") {
+          i.preventDefault();
+          const d = [r.current, T.current].filter(
+            (H) => !!H && !H.disabled
           );
-          if (i.length === 0) return;
-          const C = i.indexOf(document.activeElement), R = m.shiftKey ? C - 1 : C + 1;
-          (x = i[(R % i.length + i.length) % i.length]) == null || x.focus();
+          if (d.length === 0) return;
+          const E = d.indexOf(document.activeElement), P = i.shiftKey ? E - 1 : E + 1;
+          (p = d[(P % d.length + d.length) % d.length]) == null || p.focus();
         }
         return;
-      } else if (m.key === "ArrowDown")
-        m.preventDefault(), D((i) => (i + 1) % Math.max(1, p.length));
-      else if (m.key === "ArrowUp")
-        m.preventDefault(), D((i) => (i - 1 + Math.max(1, p.length)) % Math.max(1, p.length));
-      else if (m.key === "Enter" || m.key === " ") {
-        m.preventDefault();
-        const i = p[g];
-        i && (i.run(), i.stay || e());
+      } else if (i.key === "ArrowDown")
+        i.preventDefault(), R((d) => (d + 1) % Math.max(1, g.length));
+      else if (i.key === "ArrowUp")
+        i.preventDefault(), R((d) => (d - 1 + Math.max(1, g.length)) % Math.max(1, g.length));
+      else if (i.key === "Enter" || i.key === " ") {
+        i.preventDefault();
+        const d = g[w];
+        d && (d.run(), d.stay || o());
       }
     };
-    return window.addEventListener("mousedown", o, !0), window.addEventListener("keydown", b, !0), (N = d.current) == null || N.focus(), () => {
-      window.removeEventListener("mousedown", o, !0), window.removeEventListener("keydown", b, !0);
+    return window.addEventListener("mousedown", a, !0), window.addEventListener("keydown", f, !0), (L = x.current) == null || L.focus(), () => {
+      window.removeEventListener("mousedown", a, !0), window.removeEventListener("keydown", f, !0);
     };
-  }, [e, p, g, a, c]);
-  const S = j(null), l = j(null), k = !!a, E = !!(a != null && a.ready);
-  _(() => {
-    var o;
-    k && ((o = l.current) == null || o.focus());
-  }, [k]), _(() => {
-    var b;
-    if (!E) return;
-    const o = document.activeElement;
-    (o === l.current || o === d.current || o === document.body) && ((b = S.current) == null || b.focus());
-  }, [E]);
-  const f = 240, [O, U] = M(() => a ? 96 : n.length * 30 + 12);
-  le(() => {
-    var b;
-    const o = (b = d.current) == null ? void 0 : b.offsetHeight;
-    o && o !== O && U(o);
+  }, [o, g, w, l, m]);
+  const T = M(null), r = M(null), k = !!l, S = !!(l != null && l.ready);
+  B(() => {
+    var a;
+    k && ((a = r.current) == null || a.focus());
+  }, [k]), B(() => {
+    var f;
+    if (!S) return;
+    const a = document.activeElement;
+    (a === r.current || a === x.current || a === document.body) && ((f = T.current) == null || f.focus());
+  }, [S]);
+  const y = Math.min(ae, window.innerWidth - 16), O = Ee(l == null ? void 0 : l.text), [U, A] = C(() => l ? 96 : t.length * 30 + 12);
+  Ne(() => {
+    var f;
+    const a = (f = x.current) == null ? void 0 : f.offsetHeight;
+    a && a !== U && A(a);
   });
-  const A = Math.max(8, Math.min(t.x, window.innerWidth - f - 8)), v = Math.max(8, Math.min(t.y, window.innerHeight - O - 8)), w = (c == null ? void 0 : c.closest('[role="dialog"]')) ?? document.body, T = w === document.body ? { position: "fixed", left: A, top: v } : (() => {
-    const o = w.getBoundingClientRect();
+  const $ = Math.max(8, Math.min(n.x, window.innerWidth - y - 8)), j = Math.max(8, Math.min(n.y, window.innerHeight - U - 8)), b = (m == null ? void 0 : m.closest('[role="dialog"]')) ?? document.body, D = b === document.body ? { position: "fixed", left: $, top: j } : (() => {
+    const a = b.getBoundingClientRect();
     return {
       position: "absolute",
-      left: A - o.left + w.scrollLeft - w.clientLeft,
-      top: v - o.top + w.scrollTop - w.clientTop
+      left: $ - a.left + b.scrollLeft - b.clientLeft,
+      top: j - a.top + b.scrollTop - b.clientTop
     };
   })();
-  return ie(
-    /* @__PURE__ */ y(
+  return Ce(
+    /* @__PURE__ */ h(
       "div",
       {
-        ref: d,
-        ...a ? { role: "dialog", "aria-modal": !1, "aria-label": "Save as my default" } : { role: "menu", "aria-label": "Field options" },
+        ref: x,
+        ...l ? { role: "dialog", "aria-modal": !1, "aria-label": l.label } : { role: "menu", "aria-label": "Field options" },
         tabIndex: -1,
         "data-field-context-menu": !0,
-        style: { ...T, width: f, zIndex: 110 },
+        style: { ...D, width: y, maxWidth: "calc(100vw - 16px)", zIndex: 110 },
         className: "rounded-lg border border-slate-200 bg-white p-1 shadow-xl outline-none dark:border-border dark:bg-card",
         children: [
-          a ? /* @__PURE__ */ y("div", { "data-personal-default-confirm": !0, className: "space-y-2 px-2 py-1.5", children: [
+          l ? /* @__PURE__ */ h("div", { "data-personal-default-confirm": !0, className: "space-y-2 px-2 py-1.5", children: [
             /* @__PURE__ */ s(
               "p",
               {
+                ref: O,
                 "aria-live": "polite",
-                className: "text-[12.5px] leading-snug text-slate-700 dark:text-slate-200",
-                children: a.text
+                className: "line-clamp-4 text-[12.5px] leading-snug text-slate-700 [overflow-wrap:anywhere] dark:text-slate-200",
+                children: l.text
               }
             ),
-            /* @__PURE__ */ y("div", { className: "flex justify-end gap-1.5", children: [
-              /* @__PURE__ */ y(
+            /* @__PURE__ */ h("div", { className: "flex justify-end gap-1.5", children: [
+              /* @__PURE__ */ h(
                 "button",
                 {
-                  ref: l,
+                  ref: r,
                   type: "button",
-                  onClick: a.onCancel,
-                  className: de,
+                  onClick: l.onCancel,
+                  className: Le,
                   children: [
-                    /* @__PURE__ */ s(X, { className: "h-3 w-3", "aria-hidden": !0 }),
+                    /* @__PURE__ */ s(ne, { className: "h-3 w-3", "aria-hidden": !0 }),
                     " Cancel"
                   ]
                 }
@@ -421,102 +465,102 @@ function be({
               /* @__PURE__ */ s(
                 "button",
                 {
-                  ref: S,
+                  ref: T,
                   type: "button",
-                  disabled: !a.ready,
-                  onClick: a.onSave,
+                  disabled: !l.ready,
+                  onClick: l.onSave,
                   className: "h-7 rounded-md bg-nvr-cyan px-2.5 text-[11.5px] font-semibold text-white hover:bg-nvr-cyan/90 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-nvr-cyan/40 focus-visible:ring-offset-1 disabled:cursor-not-allowed disabled:opacity-50",
-                  children: a.saving ? "Saving…" : "Save"
+                  children: l.saving ? "Saving…" : l.action
                 }
               )
             ] })
           ] }) : null,
-          a ? null : n.map((o) => {
-            const b = p.indexOf(o), N = b === g && !o.disabled;
-            return /* @__PURE__ */ y(
+          l ? null : t.map((a) => {
+            const f = g.indexOf(a), L = f === w && !a.disabled;
+            return /* @__PURE__ */ h(
               "button",
               {
                 type: "button",
                 role: "menuitem",
-                disabled: o.disabled,
-                onMouseEnter: () => b >= 0 && D(b),
+                disabled: a.disabled,
+                onMouseEnter: () => f >= 0 && R(f),
                 onClick: () => {
-                  o.run(), o.stay || e();
+                  a.run(), a.stay || o();
                 },
-                className: q(
+                className: re(
                   "flex h-[30px] w-full items-center gap-2 rounded-sm px-2 text-left text-[12.5px] font-medium text-slate-700 dark:text-slate-200",
-                  N && "bg-accent text-accent-foreground",
-                  o.disabled && "cursor-not-allowed opacity-40"
+                  L && "bg-accent text-accent-foreground",
+                  a.disabled && "cursor-not-allowed opacity-40"
                 ),
                 children: [
-                  /* @__PURE__ */ s("span", { className: "shrink-0 text-slate-500", children: o.icon }),
-                  /* @__PURE__ */ s("span", { className: "min-w-0 flex-1 truncate", children: o.label }),
-                  o.hint && /* @__PURE__ */ s("span", { className: "max-w-[90px] truncate font-mono text-[10.5px] text-slate-400", children: o.hint })
+                  /* @__PURE__ */ s("span", { className: "shrink-0 text-slate-500", children: a.icon }),
+                  /* @__PURE__ */ s("span", { className: "min-w-0 flex-1 truncate", children: a.label }),
+                  a.hint && /* @__PURE__ */ s("span", { className: "max-w-[90px] truncate font-mono text-[10.5px] text-slate-400", children: a.hint })
                 ]
               },
-              o.key
+              a.key
             );
           })
         ]
       }
     ),
-    w
+    b
   );
 }
-function Le(t) {
-  const [n, e] = M(null), [a, c] = M(!1), d = j(!1), g = j(null);
-  _(() => {
-    const l = t.current;
-    if (!l) return;
-    const k = () => e(l.getAttribute("data-remote-editor"));
+function Je(n) {
+  const [t, o] = C(null), [l, m] = C(!1), x = M(!1), w = M(null);
+  B(() => {
+    const r = n.current;
+    if (!r) return;
+    const k = () => o(r.getAttribute("data-remote-editor"));
     k();
-    const E = new MutationObserver(k);
-    return E.observe(l, { attributes: !0, attributeFilter: ["data-remote-editor"] }), () => E.disconnect();
-  }, [t]), _(() => {
-    n || (c(!1), d.current = !1);
-  }, [n]);
-  const D = F(
-    (l) => {
-      if (!n || d.current) return;
-      const k = l.target;
-      k.matches('input, textarea, select, [contenteditable="true"], [role="combobox"]') && (g.current = k, setTimeout(() => {
-        d.current || k.blur();
-      }, 0), c(!0));
+    const S = new MutationObserver(k);
+    return S.observe(r, { attributes: !0, attributeFilter: ["data-remote-editor"] }), () => S.disconnect();
+  }, [n]), B(() => {
+    t || (m(!1), x.current = !1);
+  }, [t]);
+  const R = N(
+    (r) => {
+      if (!t || x.current) return;
+      const k = r.target;
+      k.matches('input, textarea, select, [contenteditable="true"], [role="combobox"]') && (w.current = k, setTimeout(() => {
+        x.current || k.blur();
+      }, 0), m(!0));
     },
-    [n]
-  ), p = F(() => {
-    d.current = !0, c(!1);
-    const l = g.current;
-    g.current = null, l && setTimeout(() => l.focus(), 0);
-  }, []), S = F(() => {
-    c(!1), g.current = null;
+    [t]
+  ), g = N(() => {
+    x.current = !0, m(!1);
+    const r = w.current;
+    w.current = null, r && setTimeout(() => r.focus(), 0);
+  }, []), T = N(() => {
+    m(!1), w.current = null;
   }, []);
-  return { editor: n, confirming: a, onFocusCapture: D, confirm: p, cancel: S };
+  return { editor: t, confirming: l, onFocusCapture: R, confirm: g, cancel: T };
 }
-function Fe({
-  editor: t,
-  confirming: n,
-  onConfirm: e,
-  onCancel: a
+function ze({
+  editor: n,
+  confirming: t,
+  onConfirm: o,
+  onCancel: l
 }) {
-  const c = t.split(/\s+/).map((d) => d[0]).filter(Boolean).slice(0, 2).join("").toUpperCase();
-  return /* @__PURE__ */ y(
+  const m = n.split(/\s+/).map((x) => x[0]).filter(Boolean).slice(0, 2).join("").toUpperCase();
+  return /* @__PURE__ */ h(
     "div",
     {
       "data-presence-soft-lock": !0,
-      className: q(
+      className: re(
         "flex flex-wrap items-center gap-2 rounded-md px-2 py-1 text-[11.5px]",
-        n ? "border border-amber-300 bg-amber-50 text-amber-900 dark:border-amber-500/40 dark:bg-amber-500/10 dark:text-amber-100" : "text-amber-700 dark:text-amber-300"
+        t ? "border border-amber-300 bg-amber-50 text-amber-900 dark:border-amber-500/40 dark:bg-amber-500/10 dark:text-amber-100" : "text-amber-700 dark:text-amber-300"
       ),
       children: [
-        /* @__PURE__ */ s("span", { className: "inline-flex h-4 w-4 shrink-0 items-center justify-center rounded-full bg-amber-200 text-[9px] font-semibold text-amber-900 dark:bg-amber-500/40 dark:text-amber-50", children: c || "?" }),
-        /* @__PURE__ */ s("span", { className: "min-w-0 flex-1", children: n ? `${t} is typing here — edit anyway?` : `${t} is editing this field` }),
-        n && /* @__PURE__ */ y(z, { children: [
+        /* @__PURE__ */ s("span", { className: "inline-flex h-4 w-4 shrink-0 items-center justify-center rounded-full bg-amber-200 text-[9px] font-semibold text-amber-900 dark:bg-amber-500/40 dark:text-amber-50", children: m || "?" }),
+        /* @__PURE__ */ s("span", { className: "min-w-0 flex-1", children: t ? `${n} is typing here — edit anyway?` : `${n} is editing this field` }),
+        t && /* @__PURE__ */ h(fe, { children: [
           /* @__PURE__ */ s(
             "button",
             {
               type: "button",
-              onClick: e,
+              onClick: o,
               className: "rounded-md bg-amber-600 px-2 py-0.5 text-[11px] font-semibold text-white hover:bg-amber-700",
               children: "Edit anyway"
             }
@@ -525,7 +569,7 @@ function Fe({
             "button",
             {
               type: "button",
-              onClick: a,
+              onClick: l,
               className: "rounded-md border border-amber-300 px-2 py-0.5 text-[11px] font-medium hover:bg-amber-100 dark:border-amber-500/40 dark:hover:bg-amber-500/15",
               children: "Leave it"
             }
@@ -536,12 +580,12 @@ function Fe({
   );
 }
 export {
-  me as FieldAffordancesContext,
-  Ee as LockReasonBadge,
-  Fe as PresenceSoftLockStrip,
-  Se as RemoteChangeGhost,
-  V as ghostText,
-  Ce as useFieldAffordances,
-  Te as useFieldContextMenu,
-  Le as usePresenceSoftLock
+  Me as FieldAffordancesContext,
+  Ye as LockReasonBadge,
+  ze as PresenceSoftLockStrip,
+  Xe as RemoteChangeGhost,
+  te as ghostText,
+  Ve as useFieldAffordances,
+  qe as useFieldContextMenu,
+  Je as usePresenceSoftLock
 };