@nivaro/react 0.3.36 → 0.3.37

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

@@ -1,8 +1,8 @@
 import { jsx as e, jsxs as x, Fragment as vt } from "react/jsx-runtime";
-import { useQuery as ce, useQueryClient as St } from "@tanstack/react-query";
-import * as kt from "lucide-react";
+import { useQuery as ce, useQueryClient as kt } from "@tanstack/react-query";
+import * as St from "lucide-react";
 import { ChevronDown as Dt, Loader2 as $t, User as Ft, Mail as jt } from "lucide-react";
-import it, { useState as Y, useRef as ke, useEffect as ne, memo as Ot } from "react";
+import it, { useState as Y, useRef as Se, useEffect as ne, memo as Ot } from "react";
 import { fieldDrilldownConfig as qt, useDrilldown as Bt, useOptionalNivaroClient as de, useNavigation as Lt } from "../../context.js";
 import { get as st, post as Ut } from "../../lib/commands.js";
 import { planFieldGrid as Mt, isEmptyValue as Tt, isFolded as Gt, readGroupStructure as It } from "../../lib/form-structure.js";
@@ -15,7 +15,7 @@ import { GridGuides as ve } from "../layout-editor/grid-guides.js";
 import { UserAvatar as zt } from "../UserAvatar.js";
 import { DropdownMenu as Ht, DropdownMenuTrigger as Kt, DropdownMenuContent as Et, DropdownMenuItem as Ae } from "../ui/dropdown-menu.js";
 import { WidgetSlot as Ye } from "../WidgetSlot.js";
-import { FieldRow as Se } from "./FieldRow.js";
+import { FieldRow as ke } from "./FieldRow.js";
 import { useFormHelpVideos as Wt, FormHelpVideoButton as At } from "./FormHelpVideoButton.js";
 import { FoldArea as Yt, RowGroupCell as Qt, rowMemberField as Zt } from "./form-structure-ui.js";
 import { applyDisplayTemplate as Xt, useContainerWidth as en, resolveColSpan as Qe } from "./helpers.js";
@@ -45,7 +45,7 @@ function ln({
     staleTime: 6e4
   });
   if (!m) return null;
-  const S = (f) => {
+  const k = (f) => {
     let b = m;
     for (const y of f.split(".")) {
       if (b == null || typeof b != "object") return;
@@ -55,28 +55,28 @@ function ln({
   };
   if (a != null) {
     const f = (F) => {
-      const k = S(F.field);
-      if (k == null || k === "") return null;
+      const S = k(F.field);
+      if (S == null || S === "") return null;
       const D = F.format ?? "text";
       if (D === "date" || D === "datetime")
         try {
-          return De(k);
+          return De(S);
         } catch {
-          return String(k);
+          return String(S);
         }
-      return D === "boolean" ? k ? "Yes" : "No" : String(k);
+      return D === "boolean" ? S ? "Yes" : "No" : String(S);
     }, b = [];
     let y = [];
     for (const F of i)
       F.line_break && y.length > 0 ? (b.push(y), y = [F]) : y.push(F);
     y.length > 0 && b.push(y);
     const q = b.map(
-      (F) => F.map((k) => {
-        const D = f(k);
-        return D ? { label: k.label ?? null, display: D } : null;
+      (F) => F.map((S) => {
+        const D = f(S);
+        return D ? { label: S.label ?? null, display: D } : null;
       }).filter(Boolean)
     ).filter((F) => F.length > 0);
-    return q.length === 0 ? null : /* @__PURE__ */ e("div", { className: "mt-1", children: q.map((F, k) => (
+    return q.length === 0 ? null : /* @__PURE__ */ e("div", { className: "mt-1", children: q.map((F, S) => (
       // biome-ignore lint/suspicious/noArrayIndexKey: stable line order
       /* @__PURE__ */ e("p", { className: "text-[12px] text-slate-500 dark:text-slate-400", children: F.map((D, M) => (
         // biome-ignore lint/suspicious/noArrayIndexKey: stable token order
@@ -89,11 +89,11 @@ function ln({
           D.label ? " " : "",
           D.display
         ] }, M)
-      )) }, k)
+      )) }, S)
     )) });
   }
   const c = i.map((f) => {
-    const b = S(f.field);
+    const b = k(f.field);
     if (b == null || b === "") return null;
     const y = f.format ?? "text";
     let q;
@@ -116,7 +116,7 @@ function ln({
 }
 function an(n) {
   if (!n) return null;
-  const t = n.replace(/(^|-)([a-z])/g, (a, l, o) => o.toUpperCase()), i = kt[t];
+  const t = n.replace(/(^|-)([a-z])/g, (a, l, o) => o.toUpperCase()), i = St[t];
   return i || null;
 }
 function et(n) {
@@ -295,7 +295,7 @@ function on({
   filenameTemplate: l,
   label: o
 }) {
-  const r = de(), s = St(), [p, m] = Y(!1), S = async () => {
+  const r = de(), s = kt(), [p, m] = Y(!1), k = async () => {
     if (!(!r || p || !a)) {
       m(!0);
       try {
@@ -317,7 +317,7 @@ function on({
     "button",
     {
       type: "button",
-      onClick: S,
+      onClick: k,
       disabled: p || c,
       title: c ? "Configure PDF field in Data Model → Layouts" : void 0,
       className: "inline-flex items-center gap-1.5 rounded-md border border-nvr-cyan/40 bg-nvr-cyan/10 px-3 py-1.5 text-[12px] font-medium text-nvr-navy hover:bg-nvr-cyan/20 disabled:cursor-not-allowed disabled:opacity-40 dark:text-nvr-cyan",
@@ -357,14 +357,14 @@ function re({
     ).then((y) => y.data).catch(() => ({})),
     enabled: !!a && !!o,
     staleTime: 3e5
-  }), s = (((b = r == null ? void 0 : r.display_template) == null ? void 0 : b.match(/\{\{\s*[^}]+?\s*\}\}/g)) ?? []).map((y) => y.replace(/[{}\s]/g, "")).filter((y) => y.includes(".")), p = s.length ? ["id", ...s].join(",") : null, { data: m, isLoading: S } = ce({
+  }), s = (((b = r == null ? void 0 : r.display_template) == null ? void 0 : b.match(/\{\{\s*[^}]+?\s*\}\}/g)) ?? []).map((y) => y.replace(/[{}\s]/g, "")).filter((y) => y.includes(".")), p = s.length ? ["id", ...s].join(",") : null, { data: m, isLoading: k } = ce({
     queryKey: ["rel-display", n, o, p],
     queryFn: () => l(n, o, p),
     enabled: !!a && !!o && r !== void 0,
     staleTime: 6e4
   });
   if (!o) return /* @__PURE__ */ e("span", { children: "—" });
-  if (S || a && r === void 0)
+  if (k || a && r === void 0)
     return /* @__PURE__ */ e("span", { className: "animate-pulse h-3 w-20 rounded bg-slate-200 dark:bg-[hsl(var(--nvr-skeleton))] inline-block" });
   const c = i ?? "text-[13px] text-slate-700";
   if (!m) return /* @__PURE__ */ e("span", { className: c, children: o });
@@ -407,7 +407,7 @@ function rt({
   );
 }
 function cn(n) {
-  const [t, i] = Y(!1), a = ke(!0), l = ke(JSON.stringify(n ?? null));
+  const [t, i] = Y(!1), a = Se(!0), l = Se(JSON.stringify(n ?? null));
   return ne(() => {
     const o = JSON.stringify(n ?? null);
     if (a.current) {
@@ -447,15 +447,15 @@ function Tn({
       String(y)
     )) });
   }
-  const S = i.find(
+  const k = i.find(
     (c) => c.many_collection === a && c.many_field === n.field && !c.junction_field
   );
-  if (S != null && S.one_collection) {
+  if (k != null && k.one_collection) {
     const c = Array.isArray(t) ? t : t != null && t !== "" ? [t] : [];
-    return c.length === 0 ? /* @__PURE__ */ e("span", { className: "text-slate-300 dark:text-slate-600", children: "—" }) : S.one_collection === "nivaro_users" ? /* @__PURE__ */ e("span", { className: "inline-flex flex-wrap gap-x-1 gap-y-0.5", children: c.map((f) => /* @__PURE__ */ e(nt, { userId: String(f) }, String(f))) }) : /* @__PURE__ */ e("span", { className: "inline-flex flex-wrap gap-x-1.5", children: c.map((f) => /* @__PURE__ */ e(
+    return c.length === 0 ? /* @__PURE__ */ e("span", { className: "text-slate-300 dark:text-slate-600", children: "—" }) : k.one_collection === "nivaro_users" ? /* @__PURE__ */ e("span", { className: "inline-flex flex-wrap gap-x-1 gap-y-0.5", children: c.map((f) => /* @__PURE__ */ e(nt, { userId: String(f) }, String(f))) }) : /* @__PURE__ */ e("span", { className: "inline-flex flex-wrap gap-x-1.5", children: c.map((f) => /* @__PURE__ */ e(
       rt,
       {
-        relCollection: S.one_collection,
+        relCollection: k.one_collection,
         id: f,
         drillConfig: p
       },
@@ -504,7 +504,7 @@ function dn({
   ownersItemId: s,
   ownersAssignment: p,
   m2mCounts: m,
-  o2mCounts: S,
+  o2mCounts: k,
   o2mAggValues: c,
   summaryAggConfigs: f,
   o2mLoading: b,
@@ -513,16 +513,16 @@ function dn({
   const q = n.map((N) => typeof N == "string" ? N : N.field), F = y ? q.filter((N) => {
     if (N === "__owners__" || b != null && b.has(N) || c && N in c) return !0;
     if (m && N in m) return (m[N] ?? 0) > 0;
-    if (S && N in S) return (S[N] ?? 0) > 0;
+    if (k && N in k) return (k[N] ?? 0) > 0;
     const T = i[N];
     return T != null && T !== "" && !(Array.isArray(T) && T.length === 0);
   }) : q;
   if (F.length === 0) return null;
-  const k = "text-[9px] font-semibold uppercase tracking-wider text-slate-400 dark:text-slate-500 shrink-0", D = "text-[12px] font-semibold text-slate-700 dark:text-slate-300", M = "text-[12px] text-slate-300 dark:text-slate-600", R = "flex items-baseline gap-1.5", ue = (N) => {
+  const S = "text-[9px] font-semibold uppercase tracking-wider text-slate-400 dark:text-slate-500 shrink-0", D = "text-[12px] font-semibold text-slate-700 dark:text-slate-300", M = "text-[12px] text-slate-300 dark:text-slate-600", R = "flex items-baseline gap-1.5", ue = (N) => {
     if (N === "__owners__") {
       const d = (p == null ? void 0 : p.label_override) || "Owners";
       return /* @__PURE__ */ x("div", { className: "flex items-center gap-1.5", children: [
-        /* @__PURE__ */ e("span", { className: k, children: d }),
+        /* @__PURE__ */ e("span", { className: S, children: d }),
         /* @__PURE__ */ e(
           sn,
           {
@@ -535,7 +535,7 @@ function dn({
     const T = n.find((d) => (typeof d == "string" ? d : d.field) === N), me = T && typeof T != "string" ? T.label : void 0, H = t.find((d) => d.field === N), P = me || (H == null ? void 0 : H.label) || N.replace(/_/g, " ").replace(/\b\w/g, (d) => d.toUpperCase());
     if (b != null && b.has(N))
       return /* @__PURE__ */ x("div", { className: "flex items-center gap-1.5", children: [
-        /* @__PURE__ */ e("span", { className: k, children: P }),
+        /* @__PURE__ */ e("span", { className: S, children: P }),
         /* @__PURE__ */ e($t, { className: "h-3 w-3 animate-spin text-slate-300" })
       ] });
     if (c && N in c) {
@@ -572,14 +572,14 @@ function dn({
           U = O.toLocaleString(void 0, { maximumFractionDigits: 2 });
       }
       return /* @__PURE__ */ x("div", { className: R, children: [
-        /* @__PURE__ */ e("span", { className: k, children: L }),
+        /* @__PURE__ */ e("span", { className: S, children: L }),
         /* @__PURE__ */ e("span", { className: D, children: U })
       ] });
     }
     if (m && N in m) {
       const d = m[N];
       return /* @__PURE__ */ x("div", { className: R, children: [
-        /* @__PURE__ */ e("span", { className: k, children: P }),
+        /* @__PURE__ */ e("span", { className: S, children: P }),
         /* @__PURE__ */ x("span", { className: D, children: [
           d,
           " item",
@@ -587,10 +587,10 @@ function dn({
         ] })
       ] });
     }
-    if (S && N in S) {
-      const d = S[N];
+    if (k && N in k) {
+      const d = k[N];
       return /* @__PURE__ */ x("div", { className: R, children: [
-        /* @__PURE__ */ e("span", { className: k, children: P }),
+        /* @__PURE__ */ e("span", { className: S, children: P }),
         /* @__PURE__ */ x("span", { className: D, children: [
           d,
           " row",
@@ -604,14 +604,14 @@ function dn({
     if (G != null && G.one_collection) {
       const d = Array.isArray(j) ? j : j != null && j !== "" ? [j] : [];
       return /* @__PURE__ */ x("div", { className: R, children: [
-        /* @__PURE__ */ e("span", { className: k, children: P }),
+        /* @__PURE__ */ e("span", { className: S, children: P }),
         d.length === 0 ? /* @__PURE__ */ e("span", { className: M, children: "—" }) : G.one_collection === "nivaro_users" ? /* @__PURE__ */ e("span", { className: "inline-flex flex-wrap gap-x-1.5 gap-y-0.5", children: d.map((L) => /* @__PURE__ */ e(tt, { userId: String(L) }, String(L))) }) : /* @__PURE__ */ e("span", { className: "inline-flex flex-wrap gap-x-1.5", children: d.map((L) => /* @__PURE__ */ e(re, { relCollection: G.one_collection, id: L }, String(L))) })
       ] });
     }
     if (Array.isArray(j)) {
       const d = a.find((O) => O.many_field === N && O.junction_field), L = d == null ? void 0 : d.one_collection;
       return /* @__PURE__ */ x("div", { className: R, children: [
-        /* @__PURE__ */ e("span", { className: k, children: P }),
+        /* @__PURE__ */ e("span", { className: S, children: P }),
         j.length === 0 ? /* @__PURE__ */ e("span", { className: M, children: "—" }) : L ? /* @__PURE__ */ e("span", { className: "inline-flex flex-wrap gap-x-1.5 gap-y-0.5", children: j.map(
           (O) => L === "nivaro_users" ? /* @__PURE__ */ e(tt, { userId: String(O) }, String(O)) : /* @__PURE__ */ e(re, { relCollection: L, id: O }, String(O))
         ) }) : /* @__PURE__ */ x("span", { className: D, children: [
@@ -622,11 +622,18 @@ function dn({
       ] });
     }
     return /* @__PURE__ */ x("div", { className: R, children: [
-      /* @__PURE__ */ e("span", { className: k, children: P }),
+      /* @__PURE__ */ e("span", { className: S, children: P }),
       j == null || j === "" ? /* @__PURE__ */ e("span", { className: M, children: "—" }) : /* @__PURE__ */ e("span", { className: D, children: $e(j, H) })
     ] });
   };
-  return /* @__PURE__ */ e("div", { className: "flex flex-wrap items-baseline gap-x-5 gap-y-1.5 border-t border-slate-100 dark:border-border/60 bg-slate-50/50 dark:bg-white/[0.015] px-5 py-2.5", children: F.map((N) => /* @__PURE__ */ e(it.Fragment, { children: ue(N) }, N)) });
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      "data-summary-strip": "",
+      className: "flex flex-wrap items-baseline gap-x-5 gap-y-1.5 border-t border-slate-100 dark:border-border/60 bg-slate-50/50 dark:bg-white/[0.015] px-5 py-2.5",
+      children: F.map((N) => /* @__PURE__ */ e(it.Fragment, { children: ue(N) }, N))
+    }
+  );
 }
 const Gn = Ot(function({
   group: t,
@@ -638,14 +645,14 @@ const Gn = Ot(function({
   itemId: s,
   errors: p,
   visibleFields: m,
-  lockedFields: S,
+  lockedFields: k,
   layoutAiEnabled: c,
   displayOnly: f,
   renderField: b,
   onCountChange: y,
   isNew: q,
   fieldValues: F,
-  isOpen: k,
+  isOpen: S,
   onToggle: D,
   summaryFields: M,
   m2mCounts: R,
@@ -680,7 +687,7 @@ const Gn = Ot(function({
   }, [X == null ? void 0 : X.seq]), ne(() => {
     ee && Rt(ee.target) === t.key && be(!1);
   }, [ee == null ? void 0 : ee.seq]);
-  const Ue = D !== void 0, z = Le ?? (Ue ? !k : dt);
+  const Ue = D !== void 0, z = Le ?? (Ue ? !S : dt);
   ne(() => {
     ie && !z && (se == null || se(t.key));
   }, [ie, z, se, t.key]);
@@ -695,7 +702,7 @@ const Gn = Ot(function({
   if (t.hide_when_empty && F && !$ && (ae = F.every(
     (_) => _ == null || _ === "" || Array.isArray(_) && _.length === 0
   ) && !bt && te.every((_) => !qe[_.field])), ae && te.length === 0) return null;
-  const ye = ke(null), Ne = en(ye), Ge = an(t.icon), gt = Oe ? i : i.filter((h) => !h.hidden), Ie = (Pe = he == null ? void 0 : he.sections) == null ? void 0 : Pe[t.key], xt = Array.isArray(Ie) && Ie.length > 0, yt = (h) => xt ? /* @__PURE__ */ x("div", { className: "relative", children: [
+  const ye = Se(null), Ne = en(ye), Ge = an(t.icon), gt = Oe ? i : i.filter((h) => !h.hidden), Ie = (Pe = he == null ? void 0 : he.sections) == null ? void 0 : Pe[t.key], xt = Array.isArray(Ie) && Ie.length > 0, yt = (h) => xt ? /* @__PURE__ */ x("div", { className: "relative", children: [
     h,
     /* @__PURE__ */ e("span", { className: "absolute right-[52px] top-1/2 flex -translate-y-1/2", children: /* @__PURE__ */ e(
       At,
@@ -795,347 +802,357 @@ const Gn = Ot(function({
           },
           h.field
         )) }),
-        !z && /* @__PURE__ */ x("div", { className: "nvr-expand-in border-t border-slate-100 px-5 py-4", children: [
-          !f && /* @__PURE__ */ e(tn, { group: t, className: "mb-3" }),
-          (() => {
-            const h = Mt(gt, {
-              rows: f ? [] : It(t.swap_config).rows,
-              folded: (u) => !f && Gt(u._overrides),
-              keep: (u) => !!u.required,
-              filled: (u) => !Tt(a[u.field]) || !!p[u.field]
-            }), _ = h.units.map(
-              (u) => u.kind === "row" ? {
-                _k: `row:${u.row.key}`,
-                sort: u.members[0].sort ?? 0,
-                _t: "row",
-                row: u.row,
-                members: u.members
-              } : { _k: u.field.field, sort: u.field.sort ?? 0, _t: "field", f: u.field }
-            );
-            G && _.push({
-              _k: "__owners__",
-              sort: G.sort,
-              _t: "owners",
-              slot: G
-            }), d && _.push({
-              _k: "__pdf__",
-              sort: d.sort,
-              _t: "pdf",
-              slot: d
-            });
-            for (const u of A ?? [])
-              _.push({ _k: u.field, sort: u.sort, _t: "widget", slot: u });
-            return _.sort((u, B) => u.sort - B.sort), $ && _.length === 0 && h.folded.length === 0 ? /* @__PURE__ */ e(Vt, {}) : f ? /* @__PURE__ */ x(
-              "div",
-              {
-                ref: ye,
-                className: E($ && "relative", "grid grid-cols-12 gap-x-6 gap-y-3"),
-                children: [
-                  /* @__PURE__ */ e(ve, { gapClass: "gap-x-6" }),
-                  _.map((u) => {
-                    if (u._t === "owners") {
-                      const v = u.slot.col_span ?? 12;
-                      return K(
-                        le("__owners__"),
-                        /* @__PURE__ */ e(
-                          "div",
-                          {
-                            className: "min-w-0",
-                            style: { gridColumn: `span ${v}` },
-                            children: /* @__PURE__ */ e(
-                              Ze,
+        !z && /* @__PURE__ */ x(
+          "div",
+          {
+            "data-section-body": "",
+            className: "nvr-expand-in border-t border-slate-100 px-5 py-4 dark:border-border/60",
+            children: [
+              !f && /* @__PURE__ */ e(tn, { group: t, className: "mb-3" }),
+              (() => {
+                const h = Mt(gt, {
+                  rows: f ? [] : It(t.swap_config).rows,
+                  folded: (u) => !f && Gt(u._overrides),
+                  keep: (u) => !!u.required,
+                  filled: (u) => !Tt(a[u.field]) || !!p[u.field]
+                }), _ = h.units.map(
+                  (u) => u.kind === "row" ? {
+                    _k: `row:${u.row.key}`,
+                    sort: u.members[0].sort ?? 0,
+                    _t: "row",
+                    row: u.row,
+                    members: u.members
+                  } : { _k: u.field.field, sort: u.field.sort ?? 0, _t: "field", f: u.field }
+                );
+                G && _.push({
+                  _k: "__owners__",
+                  sort: G.sort,
+                  _t: "owners",
+                  slot: G
+                }), d && _.push({
+                  _k: "__pdf__",
+                  sort: d.sort,
+                  _t: "pdf",
+                  slot: d
+                });
+                for (const u of A ?? [])
+                  _.push({ _k: u.field, sort: u.sort, _t: "widget", slot: u });
+                return _.sort((u, B) => u.sort - B.sort), $ && _.length === 0 && h.folded.length === 0 ? /* @__PURE__ */ e(Vt, {}) : f ? /* @__PURE__ */ x(
+                  "div",
+                  {
+                    ref: ye,
+                    "data-section-grid": "",
+                    className: E($ && "relative", "grid grid-cols-12 gap-x-6 gap-y-3"),
+                    children: [
+                      /* @__PURE__ */ e(ve, { gapClass: "gap-x-6" }),
+                      _.map((u) => {
+                        if (u._t === "owners") {
+                          const v = u.slot.col_span ?? 12;
+                          return K(
+                            le("__owners__"),
+                            /* @__PURE__ */ e(
+                              "div",
                               {
+                                className: "min-w-0",
+                                style: { gridColumn: `span ${v}` },
+                                children: /* @__PURE__ */ e(
+                                  Ze,
+                                  {
+                                    collection: r,
+                                    itemId: s,
+                                    label: u.slot.label_override || "Owners"
+                                  }
+                                )
+                              },
+                              "__owners__"
+                            )
+                          );
+                        }
+                        if (u._t === "pdf" || u._t === "widget" || u._t === "row") return null;
+                        const B = u.f, g = o.find(
+                          (v) => v.many_collection === r && v.many_field === B.field && !v.junction_field
+                        );
+                        return K(
+                          { kind: "field", field: B.field, group_key: t.key },
+                          /* @__PURE__ */ x(
+                            "div",
+                            {
+                              className: "min-w-0",
+                              style: { gridColumn: `span ${Qe(B.options, Ne)}` },
+                              children: [
+                                /* @__PURE__ */ e("dt", { className: "text-[11px] font-medium text-slate-400 truncate", children: B.label || ot(B.field) }),
+                                /* @__PURE__ */ e("dd", { className: "mt-0.5 break-words", children: (g == null ? void 0 : g.one_collection) === "nivaro_users" ? (() => {
+                                  const v = a[B.field], C = Array.isArray(v) ? v : v != null && v !== "" ? [v] : [];
+                                  return C.length === 0 ? /* @__PURE__ */ e("span", { className: "text-[13px] text-slate-400", children: "—" }) : /* @__PURE__ */ e("div", { className: "flex flex-wrap gap-1.5", children: C.map((I) => /* @__PURE__ */ e(ct, { userId: String(I) }, String(I))) });
+                                })() : g != null && g.one_collection ? /* @__PURE__ */ e(re, { relCollection: g.one_collection, id: a[B.field] }) : /* @__PURE__ */ e("span", { className: "text-[13px] text-slate-700", children: $e(a[B.field], B) }) })
+                              ]
+                            },
+                            B.field
+                          )
+                        );
+                      })
+                    ]
+                  }
+                ) : (() => {
+                  const u = (g) => {
+                    var Ke, Ee;
+                    if (g._t === "row")
+                      return /* @__PURE__ */ e(
+                        Qt,
+                        {
+                          row: g.row,
+                          members: g.members,
+                          containerWidth: Ne,
+                          errors: p,
+                          renderMember: (w) => K(
+                            { kind: "field", field: w.field, group_key: t.key },
+                            /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(
+                              ke,
+                              {
+                                field: Zt(w),
+                                draft: a,
+                                onChange: l,
+                                relations: o,
                                 collection: r,
                                 itemId: s,
-                                label: u.slot.label_override || "Owners"
+                                error: p[w.field],
+                                visible: m.has(w.field) || !m.size,
+                                forceVisible: _e(w) || void 0,
+                                locked: k.has(w.field),
+                                layoutAiEnabled: c,
+                                renderField: b,
+                                onCountChange: y
                               }
+                            ) }, w.field)
+                          )
+                        },
+                        g._k
+                      );
+                    if (g._t === "owners") {
+                      const w = g.slot.col_span ?? 12;
+                      return K(
+                        le("__owners__"),
+                        /* @__PURE__ */ e("div", { style: { gridColumn: `span ${w}` }, children: /* @__PURE__ */ e(
+                          Ze,
+                          {
+                            collection: r,
+                            itemId: s,
+                            label: g.slot.label_override || "Owners"
+                          }
+                        ) }, "__owners__")
+                      );
+                    }
+                    if (g._t === "pdf") {
+                      if (!U) return null;
+                      const w = g.slot.col_span ?? 12, J = ((Ke = g.slot.label_override) == null ? void 0 : Ke.trim()) || "Generate PDF";
+                      return K(
+                        le("__pdf__"),
+                        /* @__PURE__ */ e("div", { style: { gridColumn: `span ${w}` }, children: /* @__PURE__ */ e(
+                          on,
+                          {
+                            collection: r,
+                            itemId: s,
+                            layoutId: U,
+                            attachField: L ?? null,
+                            filenameTemplate: O,
+                            label: J
+                          }
+                        ) }, "__pdf__")
+                      );
+                    }
+                    if (g._t === "widget") {
+                      if (!g.slot.widget_id) return null;
+                      const w = g.slot.col_span ?? 12, J = Xe(g.slot.input_bindings);
+                      return K(
+                        le(g.slot.field),
+                        /* @__PURE__ */ e("div", { style: { gridColumn: `span ${w}` }, children: /* @__PURE__ */ e(
+                          Ye,
+                          {
+                            widgetId: g.slot.widget_id,
+                            inputBindings: J,
+                            itemDraft: a,
+                            label: g.slot.label_override ?? void 0,
+                            defaultExpanded: g.slot.default_expanded ?? !0,
+                            frameless: !0,
+                            apiBase: Q,
+                            onContentChange: (We) => Be(
+                              (we) => we[g.slot.field] === We ? we : { ...we, [g.slot.field]: We }
                             )
-                          },
-                          "__owners__"
-                        )
+                          }
+                        ) }, g.slot.field)
                       );
                     }
-                    if (u._t === "pdf" || u._t === "widget" || u._t === "row") return null;
-                    const B = u.f, g = o.find(
-                      (v) => v.many_collection === r && v.many_field === B.field && !v.junction_field
+                    const v = g.f, C = pe == null ? void 0 : pe[v.field], I = C == null ? void 0 : C.entries, Nt = (C == null ? void 0 : C.separator) ?? null, oe = a[v.field], Ve = oe != null && oe !== "", Ce = I != null && I.length && Ve ? ((Ee = o.find(
+                      (w) => w.many_collection === r && w.many_field === v.field && !w.junction_field
+                    )) == null ? void 0 : Ee.one_collection) ?? null : null, Je = (V == null ? void 0 : V.enabled) && v.field === V.primary_field, Re = (() => {
+                      const w = a[(V == null ? void 0 : V.primary_field) ?? ""];
+                      return w != null && w !== "";
+                    })(), ze = (Z ?? []).some((w) => {
+                      const J = a[w.field];
+                      return J != null && J !== "";
+                    }), _t = Je && je ? /* @__PURE__ */ x("span", { className: "inline-flex items-center gap-1.5", children: [
+                      /* @__PURE__ */ e(
+                        "button",
+                        {
+                          type: "button",
+                          onClick: je,
+                          className: "inline-flex items-center rounded px-1.5 py-0.5 text-[10px] font-medium text-nvr-cyan hover:bg-nvr-cyan/10 transition-colors",
+                          children: Fe ? V.back_label ?? "Back" : V.toggle_label ?? "Enter manually"
+                        }
+                      ),
+                      /* @__PURE__ */ x(
+                        "span",
+                        {
+                          className: [
+                            "inline-flex items-center gap-0.5 rounded px-1 py-0.5 text-[9px] font-medium",
+                            Re ? "bg-emerald-50 text-emerald-600 dark:bg-emerald-900/30 dark:text-emerald-400" : "bg-slate-100 text-slate-400 dark:bg-slate-800 dark:text-slate-500"
+                          ].join(" "),
+                          title: "Original field",
+                          children: [
+                            /* @__PURE__ */ e(
+                              "span",
+                              {
+                                className: [
+                                  "h-1.5 w-1.5 rounded-full",
+                                  Re ? "bg-emerald-500" : "bg-slate-300 dark:bg-slate-600"
+                                ].join(" ")
+                              }
+                            ),
+                            "Original"
+                          ]
+                        }
+                      ),
+                      /* @__PURE__ */ x(
+                        "span",
+                        {
+                          className: [
+                            "inline-flex items-center gap-0.5 rounded px-1 py-0.5 text-[9px] font-medium",
+                            ze ? "bg-emerald-50 text-emerald-600 dark:bg-emerald-900/30 dark:text-emerald-400" : "bg-slate-100 text-slate-400 dark:bg-slate-800 dark:text-slate-500"
+                          ].join(" "),
+                          title: "Manual fields",
+                          children: [
+                            /* @__PURE__ */ e(
+                              "span",
+                              {
+                                className: [
+                                  "h-1.5 w-1.5 rounded-full",
+                                  ze ? "bg-emerald-500" : "bg-slate-300 dark:bg-slate-600"
+                                ].join(" ")
+                              }
+                            ),
+                            "Manual"
+                          ]
+                        }
+                      )
+                    ] }) : void 0, wt = Je && Fe && (Z != null && Z.length) ? /* @__PURE__ */ e("div", { className: "mt-2 rounded-lg border border-slate-200 bg-slate-50 dark:border-border dark:bg-slate-900/40 p-3", children: /* @__PURE__ */ e("div", { className: "grid grid-cols-2 gap-3", children: Z.map((w) => {
+                      const J = (fe == null ? void 0 : fe[w.field]) ?? 2;
+                      return /* @__PURE__ */ e("div", { style: { gridColumn: `span ${J}` }, children: /* @__PURE__ */ e(
+                        ke,
+                        {
+                          field: w,
+                          draft: a,
+                          onChange: l,
+                          relations: o,
+                          collection: r,
+                          itemId: s,
+                          error: p[w.field],
+                          visible: !0,
+                          forceVisible: !0,
+                          locked: k.has(w.field),
+                          layoutAiEnabled: c,
+                          renderField: b,
+                          onCountChange: y
+                        }
+                      ) }, w.field);
+                    }) }) }) : void 0, He = /* @__PURE__ */ e(
+                      ke,
+                      {
+                        field: v,
+                        draft: a,
+                        onChange: l,
+                        relations: o,
+                        collection: r,
+                        itemId: s,
+                        error: p[v.field],
+                        visible: m.has(v.field) || !m.size,
+                        forceVisible: _e(v) || void 0,
+                        locked: k.has(v.field),
+                        layoutAiEnabled: c,
+                        renderField: b,
+                        onCountChange: y,
+                        swapButton: _t,
+                        swapContent: wt
+                      }
                     );
                     return K(
-                      { kind: "field", field: B.field, group_key: t.key },
+                      { kind: "field", field: v.field, group_key: t.key },
                       /* @__PURE__ */ x(
                         "div",
                         {
-                          className: "min-w-0",
-                          style: { gridColumn: `span ${Qe(B.options, Ne)}` },
+                          style: { gridColumn: `span ${Qe(v.options, Ne)}` },
                           children: [
-                            /* @__PURE__ */ e("dt", { className: "text-[11px] font-medium text-slate-400 truncate", children: B.label || ot(B.field) }),
-                            /* @__PURE__ */ e("dd", { className: "mt-0.5 break-words", children: (g == null ? void 0 : g.one_collection) === "nivaro_users" ? (() => {
-                              const v = a[B.field], C = Array.isArray(v) ? v : v != null && v !== "" ? [v] : [];
-                              return C.length === 0 ? /* @__PURE__ */ e("span", { className: "text-[13px] text-slate-400", children: "—" }) : /* @__PURE__ */ e("div", { className: "flex flex-wrap gap-1.5", children: C.map((I) => /* @__PURE__ */ e(ct, { userId: String(I) }, String(I))) });
-                            })() : g != null && g.one_collection ? /* @__PURE__ */ e(re, { relCollection: g.one_collection, id: a[B.field] }) : /* @__PURE__ */ e("span", { className: "text-[13px] text-slate-700", children: $e(a[B.field], B) }) })
+                            _e(v) ? /* @__PURE__ */ e("div", { "data-design-hidden": "", className: "opacity-40", children: He }) : He,
+                            (I == null ? void 0 : I.length) && Ve && Ce && /* @__PURE__ */ e(
+                              ln,
+                              {
+                                relCollection: Ce,
+                                relId: oe,
+                                entries: I,
+                                separator: Nt
+                              }
+                            )
                           ]
                         },
-                        B.field
+                        v.field
                       )
                     );
-                  })
-                ]
-              }
-            ) : (() => {
-              const u = (g) => {
-                var Ke, Ee;
-                if (g._t === "row")
-                  return /* @__PURE__ */ e(
-                    Qt,
-                    {
-                      row: g.row,
-                      members: g.members,
-                      containerWidth: Ne,
-                      errors: p,
-                      renderMember: (w) => K(
-                        { kind: "field", field: w.field, group_key: t.key },
-                        /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(
-                          Se,
-                          {
-                            field: Zt(w),
-                            draft: a,
-                            onChange: l,
-                            relations: o,
-                            collection: r,
-                            itemId: s,
-                            error: p[w.field],
-                            visible: m.has(w.field) || !m.size,
-                            forceVisible: _e(w) || void 0,
-                            locked: S.has(w.field),
-                            layoutAiEnabled: c,
-                            renderField: b,
-                            onCountChange: y
-                          }
-                        ) }, w.field)
-                      )
-                    },
-                    g._k
-                  );
-                if (g._t === "owners") {
-                  const w = g.slot.col_span ?? 12;
-                  return K(
-                    le("__owners__"),
-                    /* @__PURE__ */ e("div", { style: { gridColumn: `span ${w}` }, children: /* @__PURE__ */ e(
-                      Ze,
-                      {
-                        collection: r,
-                        itemId: s,
-                        label: g.slot.label_override || "Owners"
-                      }
-                    ) }, "__owners__")
-                  );
-                }
-                if (g._t === "pdf") {
-                  if (!U) return null;
-                  const w = g.slot.col_span ?? 12, J = ((Ke = g.slot.label_override) == null ? void 0 : Ke.trim()) || "Generate PDF";
-                  return K(
-                    le("__pdf__"),
-                    /* @__PURE__ */ e("div", { style: { gridColumn: `span ${w}` }, children: /* @__PURE__ */ e(
-                      on,
-                      {
-                        collection: r,
-                        itemId: s,
-                        layoutId: U,
-                        attachField: L ?? null,
-                        filenameTemplate: O,
-                        label: J
-                      }
-                    ) }, "__pdf__")
-                  );
-                }
-                if (g._t === "widget") {
-                  if (!g.slot.widget_id) return null;
-                  const w = g.slot.col_span ?? 12, J = Xe(g.slot.input_bindings);
-                  return K(
-                    le(g.slot.field),
-                    /* @__PURE__ */ e("div", { style: { gridColumn: `span ${w}` }, children: /* @__PURE__ */ e(
-                      Ye,
-                      {
-                        widgetId: g.slot.widget_id,
-                        inputBindings: J,
-                        itemDraft: a,
-                        label: g.slot.label_override ?? void 0,
-                        defaultExpanded: g.slot.default_expanded ?? !0,
-                        frameless: !0,
-                        apiBase: Q,
-                        onContentChange: (We) => Be(
-                          (we) => we[g.slot.field] === We ? we : { ...we, [g.slot.field]: We }
-                        )
-                      }
-                    ) }, g.slot.field)
-                  );
-                }
-                const v = g.f, C = pe == null ? void 0 : pe[v.field], I = C == null ? void 0 : C.entries, Nt = (C == null ? void 0 : C.separator) ?? null, oe = a[v.field], Ve = oe != null && oe !== "", Ce = I != null && I.length && Ve ? ((Ee = o.find(
-                  (w) => w.many_collection === r && w.many_field === v.field && !w.junction_field
-                )) == null ? void 0 : Ee.one_collection) ?? null : null, Je = (V == null ? void 0 : V.enabled) && v.field === V.primary_field, Re = (() => {
-                  const w = a[(V == null ? void 0 : V.primary_field) ?? ""];
-                  return w != null && w !== "";
-                })(), ze = (Z ?? []).some((w) => {
-                  const J = a[w.field];
-                  return J != null && J !== "";
-                }), _t = Je && je ? /* @__PURE__ */ x("span", { className: "inline-flex items-center gap-1.5", children: [
-                  /* @__PURE__ */ e(
-                    "button",
-                    {
-                      type: "button",
-                      onClick: je,
-                      className: "inline-flex items-center rounded px-1.5 py-0.5 text-[10px] font-medium text-nvr-cyan hover:bg-nvr-cyan/10 transition-colors",
-                      children: Fe ? V.back_label ?? "Back" : V.toggle_label ?? "Enter manually"
-                    }
-                  ),
-                  /* @__PURE__ */ x(
-                    "span",
-                    {
-                      className: [
-                        "inline-flex items-center gap-0.5 rounded px-1 py-0.5 text-[9px] font-medium",
-                        Re ? "bg-emerald-50 text-emerald-600 dark:bg-emerald-900/30 dark:text-emerald-400" : "bg-slate-100 text-slate-400 dark:bg-slate-800 dark:text-slate-500"
-                      ].join(" "),
-                      title: "Original field",
-                      children: [
-                        /* @__PURE__ */ e(
-                          "span",
-                          {
-                            className: [
-                              "h-1.5 w-1.5 rounded-full",
-                              Re ? "bg-emerald-500" : "bg-slate-300 dark:bg-slate-600"
-                            ].join(" ")
-                          }
-                        ),
-                        "Original"
-                      ]
-                    }
-                  ),
-                  /* @__PURE__ */ x(
-                    "span",
-                    {
-                      className: [
-                        "inline-flex items-center gap-0.5 rounded px-1 py-0.5 text-[9px] font-medium",
-                        ze ? "bg-emerald-50 text-emerald-600 dark:bg-emerald-900/30 dark:text-emerald-400" : "bg-slate-100 text-slate-400 dark:bg-slate-800 dark:text-slate-500"
-                      ].join(" "),
-                      title: "Manual fields",
-                      children: [
-                        /* @__PURE__ */ e(
-                          "span",
-                          {
-                            className: [
-                              "h-1.5 w-1.5 rounded-full",
-                              ze ? "bg-emerald-500" : "bg-slate-300 dark:bg-slate-600"
-                            ].join(" ")
-                          }
-                        ),
-                        "Manual"
-                      ]
-                    }
-                  )
-                ] }) : void 0, wt = Je && Fe && (Z != null && Z.length) ? /* @__PURE__ */ e("div", { className: "mt-2 rounded-lg border border-slate-200 bg-slate-50 dark:border-border dark:bg-slate-900/40 p-3", children: /* @__PURE__ */ e("div", { className: "grid grid-cols-2 gap-3", children: Z.map((w) => {
-                  const J = (fe == null ? void 0 : fe[w.field]) ?? 2;
-                  return /* @__PURE__ */ e("div", { style: { gridColumn: `span ${J}` }, children: /* @__PURE__ */ e(
-                    Se,
-                    {
-                      field: w,
-                      draft: a,
-                      onChange: l,
-                      relations: o,
-                      collection: r,
-                      itemId: s,
-                      error: p[w.field],
-                      visible: !0,
-                      forceVisible: !0,
-                      locked: S.has(w.field),
-                      layoutAiEnabled: c,
-                      renderField: b,
-                      onCountChange: y
-                    }
-                  ) }, w.field);
-                }) }) }) : void 0, He = /* @__PURE__ */ e(
-                  Se,
-                  {
-                    field: v,
-                    draft: a,
-                    onChange: l,
-                    relations: o,
-                    collection: r,
-                    itemId: s,
-                    error: p[v.field],
-                    visible: m.has(v.field) || !m.size,
-                    forceVisible: _e(v) || void 0,
-                    locked: S.has(v.field),
-                    layoutAiEnabled: c,
-                    renderField: b,
-                    onCountChange: y,
-                    swapButton: _t,
-                    swapContent: wt
-                  }
-                );
-                return K(
-                  { kind: "field", field: v.field, group_key: t.key },
-                  /* @__PURE__ */ x(
-                    "div",
-                    {
-                      style: { gridColumn: `span ${Qe(v.options, Ne)}` },
-                      children: [
-                        _e(v) ? /* @__PURE__ */ e("div", { "data-design-hidden": "", className: "opacity-40", children: He }) : He,
-                        (I == null ? void 0 : I.length) && Ve && Ce && /* @__PURE__ */ e(
-                          ln,
-                          {
-                            relCollection: Ce,
-                            relId: oe,
-                            entries: I,
-                            separator: Nt
-                          }
-                        )
-                      ]
-                    },
-                    v.field
-                  )
-                );
-              }, B = h.folded.map((g) => ({
-                _k: g.field,
-                sort: g.sort ?? 0,
-                _t: "field",
-                f: g
-              }));
-              return /* @__PURE__ */ x(vt, { children: [
-                /* @__PURE__ */ x(
-                  "div",
-                  {
-                    ref: ye,
-                    className: E($ && "relative", "grid grid-cols-12 gap-4 items-start"),
-                    children: [
-                      /* @__PURE__ */ e(ve, {}),
-                      _.map(u)
-                    ]
-                  }
-                ),
-                /* @__PURE__ */ e(
-                  Yt,
-                  {
-                    count: B.length,
-                    open: mt,
-                    forcedOpen: h.forcedOpen,
-                    design: !!$,
-                    onToggle: () => pt((g) => !g),
-                    children: /* @__PURE__ */ x(
+                  }, B = h.folded.map((g) => ({
+                    _k: g.field,
+                    sort: g.sort ?? 0,
+                    _t: "field",
+                    f: g
+                  }));
+                  return /* @__PURE__ */ x(vt, { children: [
+                    /* @__PURE__ */ x(
                       "div",
                       {
+                        ref: ye,
+                        "data-section-grid": "",
                         className: E($ && "relative", "grid grid-cols-12 gap-4 items-start"),
                         children: [
                           /* @__PURE__ */ e(ve, {}),
-                          B.map(u)
+                          _.map(u)
                         ]
                       }
+                    ),
+                    /* @__PURE__ */ e(
+                      Yt,
+                      {
+                        count: B.length,
+                        open: mt,
+                        forcedOpen: h.forcedOpen,
+                        design: !!$,
+                        onToggle: () => pt((g) => !g),
+                        children: /* @__PURE__ */ x(
+                          "div",
+                          {
+                            "data-section-grid": "",
+                            className: E($ && "relative", "grid grid-cols-12 gap-4 items-start"),
+                            children: [
+                              /* @__PURE__ */ e(ve, {}),
+                              B.map(u)
+                            ]
+                          }
+                        )
+                      }
                     )
-                  }
-                )
-              ] });
-            })();
-          })(),
-          H && /* @__PURE__ */ e("div", { className: "mt-4", children: H })
-        ] })
+                  ] });
+                })();
+              })(),
+              H && /* @__PURE__ */ e("div", { className: "mt-4", children: H })
+            ]
+          }
+        )
       ]
     }
   );