@nivaro/react 0.3.35 → 0.3.36

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

@@ -1,29 +1,29 @@
-import { jsx as t, jsxs as s } from "react/jsx-runtime";
-import { UserRoundPlus as D, UserRoundPen as S, UserRoundX as C, Check as U, UserRound as w, Undo2 as E } from "lucide-react";
-import { useState as Y, Fragment as F, useInsertionEffect as P } from "react";
+import { jsx as r, jsxs as o } from "react/jsx-runtime";
+import { UserRound as v, UserRoundPlus as S, UserRoundPen as C, UserRoundX as U, Check as Y, Undo2 as E } from "lucide-react";
+import { useState as F, Fragment as P, useInsertionEffect as I } from "react";
 import { toast as c } from "sonner";
-import { usePersonalDefaultsApi as I } from "./usePersonalDefaults.js";
+import { usePersonalDefaultsApi as D } from "./usePersonalDefaults.js";
 function T(e) {
   return e.applied && e.hasDefault ? "applied" : e.editable ? e.loaded ? e.failed && !e.hasDefault ? e.hasValue ? "offer" : null : e.hasDefault ? e.hasValue ? e.isDefault ? "saved" : "update" : "saved-empty" : e.hasValue ? "offer" : "reserve" : "reserve" : null;
 }
-function K(e, n, a) {
-  return e != null && e.allowed(n) ? T({
+function K(e, t, a) {
+  return e != null && e.allowed(t) ? T({
     editable: a,
     loaded: e.loaded,
-    hasValue: e.hasValue(n),
-    hasDefault: e.defaultFor(n) !== null,
-    isDefault: e.isDefault(n),
-    applied: e.applied(n),
+    hasValue: e.hasValue(t),
+    hasDefault: e.defaultFor(t) !== null,
+    isDefault: e.isDefault(t),
+    applied: e.applied(t),
     failed: e.failed
   }) : null;
 }
-function g(e, n) {
-  var d, i, p;
+function g(e, t) {
+  var d, l, f;
   const a = e;
-  return ((i = (d = a == null ? void 0 : a.response) == null ? void 0 : d.data) == null ? void 0 : i.error) ?? ((p = a == null ? void 0 : a.data) == null ? void 0 : p.error) ?? (a == null ? void 0 : a.error) ?? (a == null ? void 0 : a.message) ?? n;
+  return ((l = (d = a == null ? void 0 : a.response) == null ? void 0 : d.data) == null ? void 0 : l.error) ?? ((f = a == null ? void 0 : a.data) == null ? void 0 : f.error) ?? (a == null ? void 0 : a.error) ?? (a == null ? void 0 : a.message) ?? t;
 }
-function R(e, n) {
-  return e.clear(n).then(
+function R(e, t) {
+  return e.clear(t).then(
     (a) => (c.success(
       "Your default was cleared",
       a ? {
@@ -65,7 +65,7 @@ button[data-field-menu-trigger]{opacity:1}
 }
 `, N = "nvr-personal-default-css";
 function L() {
-  P(() => {
+  I(() => {
     if (typeof document > "u" || document.getElementById(N)) return;
     const e = document.createElement("style");
     e.id = N, e.textContent = A, document.head.appendChild(e);
@@ -73,7 +73,7 @@ function L() {
 }
 const y = 'relative inline-flex h-5 shrink-0 items-center gap-1 whitespace-nowrap rounded px-1 text-[10.5px] font-medium text-slate-500 transition-colors duration-150 before:absolute before:inset-x-0 before:-inset-y-0.5 before:content-[""] hover:bg-muted hover:text-slate-800 active:bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-sky-600 disabled:cursor-not-allowed disabled:opacity-50 aria-expanded:bg-muted aria-expanded:text-slate-800 dark:text-muted-foreground dark:hover:text-foreground dark:focus-visible:ring-sky-300 dark:aria-expanded:text-foreground', V = "inline-flex h-5 shrink-0 items-center gap-1 whitespace-nowrap px-1 text-[10.5px] font-medium text-slate-500 dark:text-muted-foreground", $ = "inline-flex h-5 shrink-0 items-center gap-1 whitespace-nowrap rounded bg-sky-50 px-1.5 text-[10.5px] font-medium text-sky-800 dark:bg-sky-900/30 dark:text-sky-200";
 function j() {
-  return /* @__PURE__ */ t(
+  return /* @__PURE__ */ r(
     "span",
     {
       "aria-hidden": !0,
@@ -82,127 +82,144 @@ function j() {
     }
   );
 }
-function X({
+function W({
   field: e,
-  label: n,
+  label: t,
   state: a,
   confirmOpen: d,
-  onConfirm: i,
-  onUndo: p,
+  onConfirm: l,
+  onUndo: f,
   onCleared: h
 }) {
   L();
-  const l = I(), [v, b] = Y(!1), o = n || e, x = a !== "saved-empty", m = /* @__PURE__ */ s(
+  const s = D(), [x, k] = F(!1), i = t || e, b = a !== "saved-empty", m = /* @__PURE__ */ o(
     "button",
     {
       type: "button",
       "data-personal-default-clear": e,
-      "aria-label": x ? `Clear your saved default for ${o} (the field keeps its value)` : `Clear your saved default for ${o}`,
-      "data-tip": x ? "Forget your saved default — this field keeps its value" : "Forget your saved default",
+      "aria-label": b ? `Clear your saved default for ${i} (the field keeps its value)` : `Clear your saved default for ${i}`,
+      "data-tip": b ? "Forget your saved default — this field keeps its value" : "Forget your saved default",
       "data-pd-action": !0,
       tabIndex: -1,
-      disabled: v || !l,
-      "aria-busy": v || void 0,
+      disabled: x || !s,
+      "aria-busy": x || void 0,
       onClick: () => {
-        l && (b(!0), R(l, e).then((r) => {
-          b(!1), r && (h == null || h());
+        s && (k(!0), R(s, e).then((n) => {
+          k(!1), n && (h == null || h());
         }));
       },
       className: y,
       children: [
-        /* @__PURE__ */ t(C, { "data-pd-icon": !0, className: "h-3 w-3", "aria-hidden": !0 }),
-        /* @__PURE__ */ t("span", { "data-pd-label": !0, children: "Clear default" })
+        /* @__PURE__ */ r(U, { "data-pd-icon": !0, className: "h-3 w-3", "aria-hidden": !0 }),
+        /* @__PURE__ */ r("span", { "data-pd-label": !0, children: "Clear default" })
       ]
     },
     "clear"
-  ), k = (r) => /* @__PURE__ */ s(
+  ), w = (n) => /* @__PURE__ */ o(
     "button",
     {
       type: "button",
-      ...r === "make" ? { "data-personal-default-make": e } : { "data-personal-default-update": e },
-      "aria-label": r === "make" ? `Make this your default for ${o}` : `Update your saved default for ${o} to this value`,
+      ...n === "make" ? { "data-personal-default-make": e } : { "data-personal-default-update": e },
+      "aria-label": n === "make" ? `Make this your default for ${i}` : `Update your saved default for ${i} to this value`,
       "aria-haspopup": "dialog",
-      "aria-expanded": d === r,
-      "data-tip": r === "make" ? "Start your new records with this value" : "Start your new records with this value instead",
+      "aria-expanded": d === n,
+      "data-tip": n === "make" ? "Start your new records with this value" : "Start your new records with this value instead",
       "data-pd-action": !0,
       tabIndex: -1,
-      onClick: (f) => i(f.currentTarget, r),
+      onClick: (p) => l(p.currentTarget, n),
       className: y,
       children: [
-        r === "make" ? /* @__PURE__ */ t(D, { className: "h-3 w-3", "aria-hidden": !0 }) : /* @__PURE__ */ t(S, { className: "h-3 w-3", "aria-hidden": !0 }),
-        /* @__PURE__ */ t("span", { "data-pd-primary": !0, children: r === "make" ? "Make default" : "Update default" })
+        n === "make" ? /* @__PURE__ */ r(S, { className: "h-3 w-3", "aria-hidden": !0 }) : /* @__PURE__ */ r(C, { className: "h-3 w-3", "aria-hidden": !0 }),
+        /* @__PURE__ */ r("span", { "data-pd-primary": !0, children: n === "make" ? "Make default" : "Update default" })
       ]
     },
-    r
+    n
   );
   let u = [];
-  return a === "offer" ? u = [k("make")] : a === "update" ? u = [k("update"), m] : a === "saved" || a === "saved-empty" ? u = [
-    /* @__PURE__ */ s(
+  return a === "offer" ? u = [w("make")] : a === "update" ? u = [w("update"), m] : a === "saved" || a === "saved-empty" ? u = [
+    /* @__PURE__ */ o(
       "span",
       {
         "data-personal-default-saved": e,
         "data-tip": a === "saved" ? "Your new records start with this value" : "You have a saved default for this field — new records start with it",
         className: V,
         children: [
-          a === "saved" ? /* @__PURE__ */ t(U, { className: "h-3 w-3 text-sky-700 dark:text-sky-300", "aria-hidden": !0 }) : /* @__PURE__ */ t(w, { className: "h-3 w-3", "aria-hidden": !0 }),
-          /* @__PURE__ */ t("span", { className: "sr-only", children: "Your default" }),
-          /* @__PURE__ */ t("span", { "data-pd-label": !0, "aria-hidden": !0, children: "Your default" })
+          a === "saved" ? /* @__PURE__ */ r(Y, { className: "h-3 w-3 text-sky-700 dark:text-sky-300", "aria-hidden": !0 }) : /* @__PURE__ */ r(v, { className: "h-3 w-3", "aria-hidden": !0 }),
+          /* @__PURE__ */ r("span", { className: "sr-only", children: "Your default" }),
+          /* @__PURE__ */ r("span", { "data-pd-label": !0, "aria-hidden": !0, children: "Your default" })
         ]
       },
       "status"
     ),
     m
   ] : a === "applied" && (u = [
-    /* @__PURE__ */ s(
+    /* @__PURE__ */ o(
       "span",
       {
         "data-personal-default": e,
         "data-tip": "Filled in from your saved default",
         className: $,
         children: [
-          /* @__PURE__ */ t(w, { className: "h-3 w-3", "aria-hidden": !0 }),
-          /* @__PURE__ */ t("span", { className: "sr-only", children: "Your default" }),
-          /* @__PURE__ */ t("span", { "data-pd-label": !0, "aria-hidden": !0, children: "Your default" })
+          /* @__PURE__ */ r(v, { className: "h-3 w-3", "aria-hidden": !0 }),
+          /* @__PURE__ */ r("span", { className: "sr-only", children: "Your default" }),
+          /* @__PURE__ */ r("span", { "data-pd-label": !0, "aria-hidden": !0, children: "Your default" })
         ]
       },
       "status"
     ),
-    /* @__PURE__ */ s(
+    /* @__PURE__ */ o(
       "button",
       {
         type: "button",
         "data-personal-default-undo": e,
-        "aria-label": `Undo: empty ${o} (your saved default stays)`,
+        "aria-label": `Undo: empty ${i} (your saved default stays)`,
         "data-tip": "Empty this field — your saved default stays",
         "data-pd-action": !0,
-        onClick: p,
+        onClick: f,
         className: y,
         children: [
-          /* @__PURE__ */ t(E, { className: "h-3 w-3", "aria-hidden": !0 }),
-          /* @__PURE__ */ t("span", { "data-pd-label": !0, children: "Undo" })
+          /* @__PURE__ */ r(E, { className: "h-3 w-3", "aria-hidden": !0 }),
+          /* @__PURE__ */ r("span", { "data-pd-label": !0, children: "Undo" })
         ]
       },
       "undo"
     ),
     m
-  ]), /* @__PURE__ */ t(
+  ]), /* @__PURE__ */ r(
     "span",
     {
       "data-personal-default-slot": e,
       "data-state": a,
-      "data-pd-new": l != null && l.isNew ? "" : void 0,
+      "data-pd-new": s != null && s.isNew ? "" : void 0,
       "aria-hidden": a === "reserve" ? !0 : void 0,
       className: "inline-flex shrink-0 items-center justify-end",
-      children: u.map((r, f) => /* @__PURE__ */ s(F, { children: [
-        f > 0 && /* @__PURE__ */ t(j, {}),
-        r
-      ] }, String(r.key ?? f)))
+      children: u.map((n, p) => /* @__PURE__ */ o(P, { children: [
+        p > 0 && /* @__PURE__ */ r(j, {}),
+        n
+      ] }, String(n.key ?? p)))
+    }
+  );
+}
+function X({ field: e }) {
+  const t = D();
+  if (!(t != null && t.allowed(e))) return null;
+  const a = t.loaded && t.isDefault(e), d = t.loaded && t.defaultFor(e) !== null, l = a ? "Your default: new records you start get this value." : d ? "You have your own default for this field, different from this value." : "You can save your own default for this field (Edit mode).";
+  return /* @__PURE__ */ r(
+    "span",
+    {
+      "data-personal-default-mark": a ? "mine" : d ? "saved" : "allowed",
+      "data-tip": l,
+      role: "img",
+      "aria-label": l,
+      className: a ? "ml-1.5 inline-flex align-middle text-cyan-700 dark:text-nvr-cyan" : "ml-1.5 inline-flex align-middle text-slate-500 dark:text-slate-400",
+      children: /* @__PURE__ */ r(v, { "aria-hidden": !0, className: "h-3 w-3", strokeWidth: 2.25 })
     }
   );
 }
 export {
   A as PERSONAL_DEFAULT_CSS,
-  X as PersonalDefaultSlot,
+  X as PersonalDefaultMark,
+  W as PersonalDefaultSlot,
   R as clearPersonalDefault,
   K as personalDefaultSlotFor,
   T as personalDefaultSlotState,

package/dist/shared/components/layout-editor/DesignNode.js

@@ -1,19 +1,19 @@
-import { jsx as i, Fragment as S, jsxs as m } from "react/jsx-runtime";
-import { EyeOff as xe, Lock as ye, Pin as Ne } from "lucide-react";
-import { isValidElement as re, Fragment as _e, cloneElement as De } from "react";
-import { cn as f, formatRelative as we } from "../../lib/utils.js";
-import { useLayoutDesign as oe, targetKey as Ce, isSelectedIn as $e } from "./design-context.js";
-import { useDesignDndNode as Te, NO_DND as Re, useDesignDropBody as ze } from "./dnd/node.js";
-import { ResizeHandle as je } from "./grid-guides.js";
-import { NoteMarker as Fe } from "./NoteMarker.js";
-import { FillChip as Me } from "./usage/FillChip.js";
+import { jsx as o, Fragment as S, jsxs as m } from "react/jsx-runtime";
+import { EyeOff as xe, Lock as ye, Pin as Ne, UserRound as _e } from "lucide-react";
+import { isValidElement as re, Fragment as De, cloneElement as we } from "react";
+import { cn as f, formatRelative as Ce } from "../../lib/utils.js";
+import { useLayoutDesign as oe, targetKey as $e, isSelectedIn as Te } from "./design-context.js";
+import { useDesignDndNode as Re, NO_DND as ze, useDesignDropBody as je } from "./dnd/node.js";
+import { ResizeHandle as Fe } from "./grid-guides.js";
+import { NoteMarker as Me } from "./NoteMarker.js";
+import { FillChip as Ae } from "./usage/FillChip.js";
 const te = (e, a) => {
   typeof e == "function" ? e(a) : e && typeof e == "object" && (e.current = a);
 };
 function ne(...e) {
   const a = {};
-  for (const o of e)
-    for (const [r, d] of Object.entries(o)) {
+  for (const i of e)
+    for (const [r, d] of Object.entries(i)) {
       const c = a[r];
       d !== void 0 && (c === void 0 ? a[r] = d : r === "className" ? a[r] = `${c} ${d}` : r === "style" ? a[r] = { ...c, ...d } : r === "ref" ? a[r] = (n) => {
         te(c, n), te(d, n);
@@ -23,43 +23,43 @@ function ne(...e) {
     }
   return a;
 }
-const Ae = {
+const Ie = {
   violet: "bg-violet-50 text-violet-800 ring-violet-200 dark:bg-violet-500/15 dark:text-violet-200 dark:ring-violet-500/30",
   emerald: "bg-emerald-50 text-emerald-800 ring-emerald-200 dark:bg-emerald-500/15 dark:text-emerald-200 dark:ring-emerald-500/30",
   amber: "bg-amber-50 text-amber-800 ring-amber-200 dark:bg-amber-500/15 dark:text-amber-200 dark:ring-amber-500/30",
   slate: "bg-slate-100 text-slate-700 ring-slate-200 dark:bg-slate-800 dark:text-slate-200 dark:ring-slate-700"
-}, Ie = "inline-block max-w-[260px] truncate rounded px-1 text-left text-[11px] ring-1", Oe = [
+}, Oe = "inline-block max-w-[260px] truncate rounded px-1 text-left text-[11px] ring-1", Ee = [
   "data-[rule-dependent]:outline-dashed data-[rule-dependent]:outline-2 data-[rule-dependent]:outline-amber-400 dark:data-[rule-dependent]:outline-amber-400/80",
   "data-[rule-drives]:after:pointer-events-none data-[rule-drives]:after:absolute data-[rule-drives]:after:-bottom-2 data-[rule-drives]:after:right-1 data-[rule-drives]:after:z-10 data-[rule-drives]:after:rounded data-[rule-drives]:after:bg-amber-50 data-[rule-drives]:after:px-1 data-[rule-drives]:after:text-[11px] data-[rule-drives]:after:text-amber-800 data-[rule-drives]:after:ring-1 data-[rule-drives]:after:ring-amber-200 data-[rule-drives]:after:content-[attr(data-rule-drives)] dark:data-[rule-drives]:after:bg-[#413727] dark:data-[rule-drives]:after:text-amber-200 dark:data-[rule-drives]:after:ring-amber-500/30"
 ].join(" "), ie = {
   before: { top: -5, left: 0, right: 0, height: 3 },
   after: { bottom: -5, left: 0, right: 0, height: 3 }
 };
-function Ee({
+function Ke({
   target: e,
   children: a,
-  inline: o,
+  inline: i,
   asChild: r,
   pass: d,
   ...c
 }) {
   var G, H, U, V, Z, X, q, J, Q, Y;
-  const n = oe(), g = (n == null ? void 0 : n.inheritedFrom(e)) ?? null, se = c["data-design-copy"] !== void 0, le = c["data-header-folded"] !== void 0, l = ((G = n == null ? void 0 : n.diffMark) == null ? void 0 : G.call(n, e)) ?? null, _ = (l == null ? void 0 : l.kind) === "removed", v = !n || !!g || se || _, D = Te((n == null ? void 0 : n.dnd) ?? Re, e, { disabled: v, noDrop: le });
-  if (!n) return /* @__PURE__ */ i(S, { children: a });
-  const ce = Ce(e), w = $e(n, e), s = ((H = n.roleMark) == null ? void 0 : H.call(n, e)) ?? null, R = ((U = n.marks) == null ? void 0 : U.call(n, e)) ?? [], b = ((V = n.overlay) == null ? void 0 : V.call(n, e)) ?? null, L = ((Z = n.unsaved) == null ? void 0 : Z.call(n, e)) ?? !1, k = ((X = n.peers) == null ? void 0 : X.call(n, e)) ?? [], ue = R.some((t) => t.highlight), B = ((q = n.note) == null ? void 0 : q.call(n, e)) ?? null, z = B ? /* @__PURE__ */ i(Fe, { note: B }) : null, j = v ? {} : D.props, pe = D.dragging, C = v ? null : D.slot, p = r && re(a) ? a : null, ge = (p == null ? void 0 : p.props.className) ?? "", me = /(^|\s)(absolute|fixed|sticky|relative)(\s|$)/.test(ge), he = f(
+  const n = oe(), g = (n == null ? void 0 : n.inheritedFrom(e)) ?? null, se = c["data-design-copy"] !== void 0, le = c["data-header-folded"] !== void 0, l = ((G = n == null ? void 0 : n.diffMark) == null ? void 0 : G.call(n, e)) ?? null, _ = (l == null ? void 0 : l.kind) === "removed", v = !n || !!g || se || _, D = Re((n == null ? void 0 : n.dnd) ?? ze, e, { disabled: v, noDrop: le });
+  if (!n) return /* @__PURE__ */ o(S, { children: a });
+  const ce = $e(e), w = Te(n, e), s = ((H = n.roleMark) == null ? void 0 : H.call(n, e)) ?? null, R = ((U = n.marks) == null ? void 0 : U.call(n, e)) ?? [], b = ((V = n.overlay) == null ? void 0 : V.call(n, e)) ?? null, L = ((Z = n.unsaved) == null ? void 0 : Z.call(n, e)) ?? !1, k = ((X = n.peers) == null ? void 0 : X.call(n, e)) ?? [], ue = R.some((t) => t.highlight), B = ((q = n.note) == null ? void 0 : q.call(n, e)) ?? null, z = B ? /* @__PURE__ */ o(Me, { note: B }) : null, j = v ? {} : D.props, pe = D.dragging, C = v ? null : D.slot, p = r && re(a) ? a : null, ge = (p == null ? void 0 : p.props.className) ?? "", me = /(^|\s)(absolute|fixed|sticky|relative)(\s|$)/.test(ge), he = f(
     !me && "relative",
     "cursor-pointer rounded-md outline-offset-2",
-    !p && (o ? "inline-block" : "block"),
+    !p && (i ? "inline-block" : "block"),
     w ? "outline outline-2 outline-nvr-cyan" : k.length > 0 ? `outline outline-2 ${k[0].outline}` : ue ? "outline-dashed outline-2 outline-violet-400 dark:outline-violet-400/70" : "hover:outline hover:outline-1 hover:outline-slate-300 dark:hover:outline-slate-600",
     b == null ? void 0 : b.className,
     "focus-visible:outline focus-visible:outline-2 focus-visible:outline-nvr-cyan",
-    Oe,
+    Ee,
     // The section's "Changed by" shows while the pointer is over it.
     "[&:hover>[data-design-last-change]]:visible",
     pe && "opacity-40",
     // Hidden for the previewed role: faint, its tags not.
     (s == null ? void 0 : s.kind) === "hidden" && "[&>:not([data-design-badges])]:opacity-40",
-    l && Ge[l.kind],
+    l && He[l.kind],
     _ && "cursor-default [&>:not([data-design-badges])]:opacity-40"
   ), fe = (t) => {
     const u = t.target;
@@ -88,7 +88,7 @@ function Ee({
     className: he,
     onClickCapture: fe,
     onKeyDown: be
-  }, ke = (s == null ? void 0 : s.kind) === "hidden" ? xe : ye, M = e.kind === "field" || e.kind === "header" ? ((Q = n.fillRate) == null ? void 0 : Q.call(n, e.field)) ?? null : null, y = e.kind === "group" && !x ? ((Y = n.lastChange) == null ? void 0 : Y.call(n, e)) ?? null : null, P = y && [y.by ? `by ${y.by}` : null, y.at ? we(y.at) : null].filter(Boolean).join(" · ") || null, A = P && !l ? /* @__PURE__ */ m(
+  }, ke = (s == null ? void 0 : s.kind) === "hidden" ? xe : ye, M = e.kind === "field" || e.kind === "header" ? ((Q = n.fillRate) == null ? void 0 : Q.call(n, e.field)) ?? null : null, y = e.kind === "group" && !x ? ((Y = n.lastChange) == null ? void 0 : Y.call(n, e)) ?? null : null, P = y && [y.by ? `by ${y.by}` : null, y.at ? Ce(y.at) : null].filter(Boolean).join(" · ") || null, A = P && !l ? /* @__PURE__ */ m(
     "span",
     {
       "data-design-last-change": "",
@@ -102,7 +102,7 @@ function Ee({
       ]
     }
   ) : null, h = [];
-  l && h.push({ rank: 0, text: We(l), node: /* @__PURE__ */ i(ae, { diff: l }) }), s && h.push({
+  l && h.push({ rank: 0, text: Ge(l), node: /* @__PURE__ */ o(ae, { diff: l }) }), s && h.push({
     rank: 1,
     text: `${s.kind === "hidden" ? "Hidden" : "Read-only"} for ${s.role}`,
     node: /* @__PURE__ */ m(
@@ -111,7 +111,7 @@ function Ee({
         "data-design-role-tag": s.kind,
         className: "inline-flex items-center gap-0.5 rounded bg-amber-50 px-1 text-[11px] text-amber-800 ring-1 ring-amber-200 dark:bg-amber-500/15 dark:text-amber-200 dark:ring-amber-500/30",
         children: [
-          /* @__PURE__ */ i(ke, { "aria-hidden": !0, className: "h-3 w-3" }),
+          /* @__PURE__ */ o(ke, { "aria-hidden": !0, className: "h-3 w-3" }),
           s.kind === "hidden" ? "Hidden" : "Read-only",
           " for ",
           s.role
@@ -121,22 +121,23 @@ function Ee({
   }), b && h.push({
     rank: 1,
     text: "Who sees it",
-    node: /* @__PURE__ */ i("span", { "data-design-pass": "", className: "pointer-events-auto", children: b.chip })
+    node: /* @__PURE__ */ o("span", { "data-design-pass": "", className: "pointer-events-auto", children: b.chip })
   }), R.forEach((t, u) => {
     const N = f(
-      Ie,
+      Oe,
       t.icon && "inline-flex items-center gap-0.5",
       t.onClick || t.tip ? "pointer-events-auto" : null,
       t.onClick && "hover:brightness-95",
-      Ae[t.tone]
+      Ie[t.tone]
     ), ee = /* @__PURE__ */ m(S, { children: [
-      t.icon === "pin" && /* @__PURE__ */ i(Ne, { "aria-hidden": !0, className: "h-3 w-3" }),
+      t.icon === "pin" && /* @__PURE__ */ o(Ne, { "aria-hidden": !0, className: "h-3 w-3" }),
+      t.icon === "person" && /* @__PURE__ */ o(_e, { "aria-hidden": !0, className: "h-3 w-3" }),
       t.text
     ] });
     h.push({
-      rank: Le(t),
+      rank: Be(t),
       text: t.text,
-      node: t.onClick ? /* @__PURE__ */ i(
+      node: t.onClick ? /* @__PURE__ */ o(
         "button",
         {
           type: "button",
@@ -148,7 +149,7 @@ function Ee({
           children: ee
         },
         `${u}:${t.text}`
-      ) : /* @__PURE__ */ i(
+      ) : /* @__PURE__ */ o(
         "span",
         {
           "data-design-mark": "",
@@ -167,9 +168,9 @@ function Ee({
       g
     ] })
   });
-  const { shown: ve, rest: $ } = Be(h), W = R.length > 0 || b != null || k.length > 0, T = x && !l ? [...h.map((t) => t.text), ...k.map((t) => t.name)] : [];
+  const { shown: ve, rest: $ } = Pe(h), W = R.length > 0 || b != null || k.length > 0, T = x && !l ? [...h.map((t) => t.text), ...k.map((t) => t.name)] : [];
   T.length > 0 && (F["data-tip"] = g && !s && !W ? `From ${g}` : T.join(" · "));
-  const I = x && l ? /* @__PURE__ */ i("span", { "data-design-badges": "", className: "pointer-events-none absolute -top-2 right-0 z-10", children: /* @__PURE__ */ i(ae, { diff: l }) }) : T.length > 0 ? /* @__PURE__ */ i(
+  const I = x && l ? /* @__PURE__ */ o("span", { "data-design-badges": "", className: "pointer-events-none absolute -top-2 right-0 z-10", children: /* @__PURE__ */ o(ae, { diff: l }) }) : T.length > 0 ? /* @__PURE__ */ o(
     "span",
     {
       "data-design-badges": "",
@@ -177,7 +178,7 @@ function Ee({
         "pointer-events-none absolute left-1/2 top-1 z-10 h-1.5 w-1.5 -translate-x-1/2 rounded-full",
         g && !s && !W ? "bg-slate-500 dark:bg-slate-400" : "bg-violet-500 dark:bg-violet-400"
       ),
-      children: /* @__PURE__ */ i("span", { className: "sr-only", children: T.join(" · ") })
+      children: /* @__PURE__ */ o("span", { className: "sr-only", children: T.join(" · ") })
     }
   ) : h.length > 0 || k.length > 0 || M != null ? /* @__PURE__ */ m(
     "span",
@@ -185,10 +186,10 @@ function Ee({
       "data-design-badges": "",
       className: "pointer-events-none absolute -top-2 right-1 z-10 flex items-center gap-1",
       children: [
-        M != null && /* @__PURE__ */ i(Me, { pct: M }),
+        M != null && /* @__PURE__ */ o(Ae, { pct: M }),
         ve.map((t, u) => (
           // biome-ignore lint/suspicious/noArrayIndexKey: ranked tags of one node, rebuilt each render
-          /* @__PURE__ */ i(_e, { children: t.node }, u)
+          /* @__PURE__ */ o(De, { children: t.node }, u)
         )),
         $.length > 0 && /* @__PURE__ */ m(
           "span",
@@ -202,7 +203,7 @@ function Ee({
             ]
           }
         ),
-        k.map((t) => /* @__PURE__ */ i(
+        k.map((t) => /* @__PURE__ */ o(
           "span",
           {
             "data-design-peer": t.id,
@@ -211,13 +212,13 @@ function Ee({
               "pointer-events-auto inline-flex h-4 w-4 items-center justify-center rounded-full text-[9px] font-semibold ring-1",
               t.chip
             ),
-            children: Pe(t.name)
+            children: We(t.name)
           },
           t.id
         ))
       ]
     }
-  ) : null, O = L ? /* @__PURE__ */ i(
+  ) : null, O = L ? /* @__PURE__ */ o(
     "span",
     {
       "data-unsaved-dot": "",
@@ -226,9 +227,9 @@ function Ee({
         // A step clips its corners away: the dot sits inside, before the arrow.
         x ? "right-4 top-1" : "-left-1 -top-1"
       ),
-      children: /* @__PURE__ */ i("span", { className: "sr-only", children: "unsaved change" })
+      children: /* @__PURE__ */ o("span", { className: "sr-only", children: "unsaved change" })
     }
-  ) : null, E = C ? /* @__PURE__ */ i(
+  ) : null, E = C ? /* @__PURE__ */ o(
     "span",
     {
       "aria-hidden": !0,
@@ -236,13 +237,13 @@ function Ee({
       className: "pointer-events-none absolute z-30 rounded-full bg-nvr-cyan shadow-[0_0_0_2px_#fff] dark:shadow-[0_0_0_2px_#0f172a]",
       style: D.indicator ?? ie[C]
     }
-  ) : null, K = w && !v && n.resizeWidth && (e.kind === "field" || e.kind === "slot") && e.group_key !== null ? /* @__PURE__ */ i(je, { onCommit: (t) => {
+  ) : null, K = w && !v && n.resizeWidth && (e.kind === "field" || e.kind === "slot") && e.group_key !== null ? /* @__PURE__ */ o(Fe, { onCommit: (t) => {
     var u;
     return (u = n.resizeWidth) == null ? void 0 : u.call(n, e, t);
   } }) : null;
   if (p) {
     const { children: t, ...u } = p.props;
-    return De(
+    return we(
       p,
       // The child's own classes, style, ref and handlers are kept and merged.
       ne(u, c, j, F),
@@ -257,7 +258,7 @@ function Ee({
       ] }) : t
     );
   }
-  return /* @__PURE__ */ m(o ? "span" : "div", { ...ne(c, j, F), children: [
+  return /* @__PURE__ */ m(i ? "span" : "div", { ...ne(c, j, F), children: [
     O,
     I,
     A,
@@ -267,32 +268,32 @@ function Ee({
     a
   ] });
 }
-function Ke(e, a, o, r = {}) {
-  if (!e || o == null || o === !1) return o;
-  const d = re(o) ? o.key ?? void 0 : void 0;
-  return /* @__PURE__ */ i(Ee, { target: a, ...r, children: o }, d);
+function Se(e, a, i, r = {}) {
+  if (!e || i == null || i === !1) return i;
+  const d = re(i) ? i.key ?? void 0 : void 0;
+  return /* @__PURE__ */ o(Ke, { target: a, ...r, children: i }, d);
 }
-function tt() {
+function nt() {
   const e = oe();
-  return (a, o, r) => Ke(e, a, o, r);
+  return (a, i, r) => Se(e, a, i, r);
 }
-function nt({ groupKey: e }) {
-  const { ref: a, slot: o, indicator: r } = ze(e);
-  return /* @__PURE__ */ i(
+function at({ groupKey: e }) {
+  const { ref: a, slot: i, indicator: r } = je(e);
+  return /* @__PURE__ */ o(
     "span",
     {
       ref: a,
       "aria-hidden": !0,
-      hidden: !o,
+      hidden: !i,
       "data-design-drop-body": e,
-      "data-design-drop-indicator": o ?? void 0,
+      "data-design-drop-indicator": i ?? void 0,
       className: "pointer-events-none absolute z-30 rounded-full bg-nvr-cyan shadow-[0_0_0_2px_#fff] dark:shadow-[0_0_0_2px_#0f172a]",
-      style: o ? r ?? ie[o] : void 0
+      style: i ? r ?? ie[i] : void 0
     }
   );
 }
-function at() {
-  return /* @__PURE__ */ i(
+function rt() {
+  return /* @__PURE__ */ o(
     "div",
     {
       "data-design-drop-zone": "",
@@ -301,25 +302,25 @@ function at() {
     }
   );
 }
-const Se = 2;
-function Le(e) {
-  return e.kind === "preview" ? 1 : e.kind === "ai" ? 4 : e.kind === "loop" || e.highlight ? 2 : 3;
+const Le = 2;
+function Be(e) {
+  return e.kind === "preview" ? 1 : e.kind === "ai" ? 4 : e.kind === "loop" || e.kind === "personal" || e.highlight ? 2 : 3;
 }
-function Be(e, a = Se) {
-  const o = e.map((r, d) => ({ c: r, i: d })).sort((r, d) => r.c.rank - d.c.rank || r.i - d.i).map((r) => r.c);
-  return { shown: o.slice(0, a), rest: o.slice(a) };
+function Pe(e, a = Le) {
+  const i = e.map((r, d) => ({ c: r, i: d })).sort((r, d) => r.c.rank - d.c.rank || r.i - d.i).map((r) => r.c);
+  return { shown: i.slice(0, a), rest: i.slice(a) };
 }
-function Pe(e) {
-  return e.trim().split(/\s+/).filter(Boolean).slice(0, 2).map((o) => {
+function We(e) {
+  return e.trim().split(/\s+/).filter(Boolean).slice(0, 2).map((i) => {
     var r;
-    return ((r = o[0]) == null ? void 0 : r.toUpperCase()) ?? "";
+    return ((r = i[0]) == null ? void 0 : r.toUpperCase()) ?? "";
   }).join("") || "?";
 }
-function We(e) {
+function Ge(e) {
   const a = de[e.kind].text;
   return e.kind === "moved" && e.detail ? `Moved ${e.detail}` : e.kind === "changed" && e.detail ? `${a}: ${e.detail}` : a;
 }
-const Ge = {
+const He = {
   added: "ring-2 ring-emerald-500/70 dark:ring-emerald-400/60",
   moved: "ring-2 ring-amber-500/70 dark:ring-amber-400/60",
   changed: "ring-1 ring-violet-500/60 dark:ring-violet-400/50",
@@ -351,18 +352,18 @@ function ae({ diff: e }) {
       className: f("inline-flex items-center rounded px-1 text-[11px] ring-1", a.cls),
       children: [
         e.kind === "moved" && e.detail ? `Moved ${e.detail}` : a.text,
-        e.kind === "changed" && e.detail && /* @__PURE__ */ i("span", { className: "ml-1 max-w-[160px] truncate opacity-80", children: e.detail })
+        e.kind === "changed" && e.detail && /* @__PURE__ */ o("span", { className: "ml-1 max-w-[160px] truncate opacity-80", children: e.detail })
       ]
     }
   );
 }
 export {
-  nt as DesignDropBody,
-  at as DesignDropZone,
-  Ee as DesignNode,
-  Se as MAX_NODE_TAGS,
-  Ke as designWrap,
-  Le as markRank,
-  Be as rankChips,
-  tt as useDesignWrap
+  at as DesignDropBody,
+  rt as DesignDropZone,
+  Ke as DesignNode,
+  Le as MAX_NODE_TAGS,
+  Se as designWrap,
+  Be as markRank,
+  Pe as rankChips,
+  nt as useDesignWrap
 };