@nivaro/react 0.3.33 → 0.3.34

package/dist/shared/components/profile/MyDefaultsCard.js

@@ -0,0 +1,667 @@
+import { jsxs as p, jsx as n, Fragment as ge } from "react/jsx-runtime";
+import { useQueryClient as xe, useQuery as U, useMutation as ae, useQueries as Q } from "@tanstack/react-query";
+import { Plus as be, BookmarkCheck as ve, Pencil as ye, UserRoundX as ke, ChevronsUpDown as Ne, Check as ne, X as Ce } from "lucide-react";
+import { useState as w, useMemo as S, useRef as V, useEffect as le } from "react";
+import { toast as B } from "sonner";
+import { useNivaroClient as X, useItemEditAuth as Se, ParentDraftContext as we } from "../../context.js";
+import { get as T, del as qe, put as Pe } from "../../lib/commands.js";
+import { isEmptyValue as M, cascadeParents as Te } from "../../lib/personal-defaults.js";
+import { userErrorMessage as Ee } from "../../lib/safe-error.js";
+import { titleCase as _, cn as R, formatDate as Fe } from "../../lib/utils.js";
+import { FieldRenderer as $e } from "../item-edit/FieldRenderer.js";
+import { getCascadeFilters as re, buildCascadeFilter as Me } from "../item-edit/helpers.js";
+import { M2MStagingContext as _e } from "../item-edit/M2MStagingContext.js";
+import { PERSONAL_DEFAULT_GHOST_BUTTON as De } from "../item-edit/PersonalDefaultPill.js";
+import { pickedCollection as Ae } from "../item-edit/personal-default-checks.js";
+import { personalDefaultsKey as Ke } from "../item-edit/usePersonalDefaults.js";
+import { Command as Le, CommandInput as Ue, CommandList as Re, CommandEmpty as je, CommandGroup as Ie, CommandItem as Oe } from "../ui/command.js";
+import { Popover as Qe, PopoverTrigger as Ve, PopoverContent as Be } from "../ui/popover.js";
+import { Skeleton as D } from "../ui/skeleton.js";
+import { describeValue as J, loadDefaultLabels as Xe, labelKey as ze } from "./my-defaults-labels.js";
+import { SectionCard as Ge, EmptyLine as He, Pill as Ye, ConfirmButton as Je } from "./primitives.js";
+const W = { fields: [], relations: [], label: "", ready: !1 };
+function We(a) {
+  const e = X(), t = Q({
+    queries: a.map((s) => ({
+      queryKey: ["field-config", s, null],
+      queryFn: () => e.request(T(`/field-config/${s}`)).then((d) => d.data ?? []),
+      staleTime: 6e4
+    }))
+  }), o = Q({
+    queries: a.map((s) => ({
+      queryKey: ["relations", s],
+      queryFn: () => e.request(T(`/data-model/relations/for/${s}`)).then((d) => d.data ?? []),
+      staleTime: 6e4
+    }))
+  }), u = Q({
+    queries: a.map((s) => ({
+      queryKey: ["col-meta", s],
+      queryFn: () => e.request(T(`/collections/${s}`)).then((d) => d.data ?? null),
+      staleTime: 6e4
+    }))
+  }), i = /* @__PURE__ */ new Map();
+  return a.forEach((s, d) => {
+    var x, c, b, y, f, v;
+    const m = (c = (x = u[d]) == null ? void 0 : x.data) == null ? void 0 : c.display_name;
+    i.set(s, {
+      fields: ((b = t[d]) == null ? void 0 : b.data) ?? [],
+      relations: ((y = o[d]) == null ? void 0 : y.data) ?? [],
+      label: m != null && m.trim() ? m : _(s),
+      ready: !((f = t[d]) != null && f.isPending) && !((v = o[d]) != null && v.isPending)
+    });
+  }), i;
+}
+function P(a, e) {
+  var o;
+  const t = a.fields.find((u) => u.field === e);
+  return (o = t == null ? void 0 : t.label) != null && o.trim() ? t.label : _(e);
+}
+function Ze(a, e) {
+  const t = Object.keys(e.context ?? {}).filter((s) => !M(e.context[s])), o = new Map(a.fields.map((s) => [s.field, s])), i = Te(
+    e.field,
+    (s) => {
+      var d;
+      return re(((d = o.get(s)) == null ? void 0 : d.dependency_config) ?? null);
+    }
+  ).reverse().filter((s) => t.includes(s));
+  return [...i, ...t.filter((s) => !i.includes(s))];
+}
+function Z(a, e) {
+  if (a.kind === "text") return { text: a.text, state: "ok" };
+  if (a.kind === "unknown") return { text: "Saved value", state: "ok" };
+  if (e.loading) return { text: "", state: "loading" };
+  if (e.failed) return { text: "Could not load this value", state: "failed" };
+  const t = [];
+  let o = 0;
+  for (const u of a.ids) {
+    const i = ze(a.target, u);
+    e.map.has(i) ? t.push(e.map.get(i) ?? "Untitled record") : o++;
+  }
+  return t.length === 0 ? { text: "No longer available", state: "gone" } : (o && t.push(`${o} no longer available`), { text: t.join(", "), state: "ok" });
+}
+function se(a) {
+  var o, u;
+  const e = a, t = ((u = (o = e == null ? void 0 : e.response) == null ? void 0 : o.data) == null ? void 0 : u.error) ?? (e == null ? void 0 : e.error);
+  return typeof t == "string" && t.trim() ? t : Ee(a, "Could not save");
+}
+function wt({ userId: a, name: e }) {
+  const t = X(), o = xe(), u = Se(), i = !!a && String(a).toUpperCase() !== String(u.userId).toUpperCase(), s = !i || u.isAdmin, d = i ? `/field-defaults/users/${encodeURIComponent(String(a))}` : "/field-defaults/mine", m = i ? String(a) : "me", x = ["field-defaults-card", m], {
+    data: c,
+    isPending: b,
+    isError: y,
+    refetch: f,
+    isRefetching: v
+  } = U({
+    queryKey: x,
+    queryFn: () => t.request(T(d, { on_layout: 1 })).then((l) => l.data ?? []),
+    enabled: s,
+    staleTime: 3e4
+  }), { data: h } = U({
+    queryKey: ["field-defaults-allowed", m],
+    queryFn: () => t.request(T(`${d}/allowed`)).then((l) => l.data ?? []),
+    enabled: s && i,
+    staleTime: 6e4
+  }), { data: g, isPending: q } = U({
+    queryKey: ["field-defaults-allowed-any", m],
+    queryFn: () => t.request(T(`${d}/allowed`, { any: 1 })).then((l) => {
+      var r;
+      return ((r = l.data) == null ? void 0 : r.any) === !0;
+    }),
+    enabled: s && !i,
+    staleTime: 6e4
+  }), [k, F] = w(!1), [C, z] = w(""), G = S(() => {
+    const l = new Set((c ?? []).map((r) => r.collection));
+    return C && l.add(C), [...l];
+  }, [c, C]), E = We(G), A = G.every((l) => {
+    var r;
+    return (r = E.get(l)) == null ? void 0 : r.ready;
+  }), j = S(() => {
+    const l = /* @__PURE__ */ new Map();
+    if (!A) return l;
+    for (const r of c ?? []) {
+      const N = E.get(r.collection) ?? W, L = ($) => N.fields.find((he) => he.field === $);
+      l.set(String(r.id), {
+        value: J(L(r.field), N.relations, r.collection, r.value),
+        context: Ze(N, r).map(($) => [
+          $,
+          J(L($), N.relations, r.collection, r.context[$])
+        ])
+      });
+    }
+    return l;
+  }, [c, E, A]), K = S(() => {
+    const l = /* @__PURE__ */ new Map();
+    for (const r of j.values())
+      for (const N of [r.value, ...r.context.map(([, L]) => L)])
+        N.kind === "records" && l.set(N.target, [.../* @__PURE__ */ new Set([...l.get(N.target) ?? [], ...N.ids])].sort());
+    return l;
+  }, [j]), ce = [...K].map(([l, r]) => `${l}:${r.join(",")}`).sort().join("|"), {
+    data: ue,
+    isPending: fe,
+    isError: H
+  } = U({
+    queryKey: ["field-defaults-card-labels", ce],
+    queryFn: () => Xe(
+      t,
+      K,
+      (l) => o.fetchQuery({
+        queryKey: ["col-meta", l],
+        queryFn: () => t.request(
+          T(`/collections/${l}`)
+        ).then((r) => r.data ?? null),
+        staleTime: 6e4
+      }).then((r) => (r == null ? void 0 : r.display_template) ?? null)
+    ),
+    enabled: A && K.size > 0,
+    staleTime: 6e4
+  }), me = {
+    map: ue ?? /* @__PURE__ */ new Map(),
+    loading: K.size > 0 && !H && (!A || fe),
+    failed: H
+  }, I = (l) => {
+    o.invalidateQueries({ queryKey: x }), !i && l && o.invalidateQueries({ queryKey: Ke(l) });
+  }, O = ae({
+    mutationFn: (l) => t.request(qe(`${d}/${l.id}`)),
+    onSuccess: (l, r) => {
+      I(r.collection), B.success("Default cleared");
+    },
+    onError: (l) => B.error(se(l))
+  });
+  if (!s || !i && (b || q && !y || !y && (c ?? []).length === 0 && g !== !0))
+    return null;
+  const pe = [...new Set((c ?? []).map((l) => l.collection))].map((l) => {
+    var r;
+    return { collection: l, label: ((r = E.get(l)) == null ? void 0 : r.label) || _(l) };
+  }).sort((l, r) => l.label.localeCompare(r.label)), Y = (e == null ? void 0 : e.trim()) || "This person";
+  return /* @__PURE__ */ p(
+    Ge,
+    {
+      icon: /* @__PURE__ */ n(ve, { className: "h-4 w-4" }),
+      title: i ? "Personal defaults" : "My defaults",
+      hint: i ? "Starting values their new records are filled in with" : "Starting values your new records are filled in with",
+      testId: "my-defaults",
+      actions: i && !k && ((h == null ? void 0 : h.length) ?? 0) > 0 ? /* @__PURE__ */ p(
+        "button",
+        {
+          type: "button",
+          "data-default-add": !0,
+          onClick: () => F(!0),
+          className: "inline-flex h-7 items-center gap-1 rounded-md px-2 text-[11.5px] font-medium text-slate-600 transition-colors hover:bg-muted hover:text-slate-900 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-nvr-cyan/40 dark:text-slate-300 dark:hover:text-white",
+          children: [
+            /* @__PURE__ */ n(be, { className: "h-3.5 w-3.5" }),
+            " Add default"
+          ]
+        }
+      ) : null,
+      children: [
+        b ? /* @__PURE__ */ n("div", { className: "space-y-3", "aria-busy": "true", children: [0, 1, 2].map((l) => /* @__PURE__ */ p("div", { className: "flex items-center gap-3", children: [
+          /* @__PURE__ */ n(D, { className: "h-3.5 w-24" }),
+          /* @__PURE__ */ n(D, { className: "h-3.5 w-40" })
+        ] }, l)) }) : y ? /* @__PURE__ */ p("div", { className: "flex flex-wrap items-center gap-2", children: [
+          /* @__PURE__ */ n(He, { children: "Could not load the saved defaults." }),
+          /* @__PURE__ */ n(
+            "button",
+            {
+              type: "button",
+              "data-default-retry": !0,
+              disabled: v,
+              onClick: () => void f(),
+              className: "inline-flex h-7 items-center rounded-md border border-slate-200 px-2.5 text-[11.5px] font-medium text-slate-700 transition-colors hover:bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-nvr-cyan/40 disabled:opacity-50 dark:border-border dark:text-slate-200",
+              children: v ? "Trying…" : "Retry"
+            }
+          )
+        ] }) : (c ?? []).length === 0 ? /* @__PURE__ */ p("p", { "data-default-empty": !0, className: "text-[12px] text-slate-500 dark:text-slate-400", children: [
+          i ? `${Y} hasn’t saved any defaults yet.` : "No defaults yet.",
+          " On a record form, open a field’s ⋯ menu and choose",
+          " ",
+          /* @__PURE__ */ n("span", { className: "font-medium text-slate-700 dark:text-slate-200", children: "Save as my default" }),
+          i ? ((h == null ? void 0 : h.length) ?? 0) > 0 ? " — or add one here." : "." : " — new records then start with that value."
+        ] }) : /* @__PURE__ */ n("div", { className: "space-y-4", children: pe.map((l) => /* @__PURE__ */ p("section", { "data-default-group": l.collection, children: [
+          /* @__PURE__ */ n("h4", { className: "mb-1 text-[12px] font-semibold text-slate-700 dark:text-slate-200", children: l.label }),
+          /* @__PURE__ */ n("ul", { className: "divide-y divide-slate-100 dark:divide-border/60", children: (c ?? []).filter((r) => r.collection === l.collection).map((r) => {
+            var N;
+            return /* @__PURE__ */ n(
+              tt,
+              {
+                row: r,
+                meta: E.get(r.collection) ?? W,
+                parts: j.get(String(r.id)),
+                labels: me,
+                base: d,
+                onSaved: () => I(r.collection),
+                onClear: () => O.mutate(r),
+                clearing: O.isPending && ((N = O.variables) == null ? void 0 : N.id) === r.id
+              },
+              r.id
+            );
+          }) })
+        ] }, l.collection)) }),
+        i && (h == null ? void 0 : h.length) === 0 && /* @__PURE__ */ p("p", { className: "mt-3 text-[11.5px] text-slate-500 dark:text-slate-400", children: [
+          "No form gives ",
+          e != null && e.trim() ? Y : "this person",
+          " a personal default yet. Turn on Personal default for a field in the layout editor."
+        ] }),
+        i && k && /* @__PURE__ */ n(
+          nt,
+          {
+            allowed: h ?? [],
+            metas: E,
+            collection: C,
+            onCollection: z,
+            base: d,
+            onDone: () => {
+              F(!1), z("");
+            },
+            onSaved: (l) => I(l)
+          }
+        )
+      ]
+    }
+  );
+}
+const et = 'input:not([type=hidden]), textarea, [role=combobox], button, [tabindex]:not([tabindex="-1"])', ee = "No form you can be given offers a personal default for this field now, so it is not used. Clear it, or ask an admin to turn it back on.";
+function tt({
+  row: a,
+  meta: e,
+  parts: t,
+  labels: o,
+  base: u,
+  onSaved: i,
+  onClear: s,
+  clearing: d
+}) {
+  const [m, x] = w(!1), c = V(null), b = V(!1);
+  le(() => {
+    var k;
+    m || !b.current || (b.current = !1, (k = c.current) == null || k.focus());
+  }, [m]);
+  const y = () => {
+    b.current = !0, x(!1);
+  }, f = a.on_layout === !1, v = e.fields.find((k) => k.field === a.field), h = t ? Z(t.value, o) : { text: "", state: "loading" }, g = ((t == null ? void 0 : t.context) ?? []).map(([k, F]) => {
+    if (F.kind === "unknown") return P(e, k);
+    const C = Z(F, o);
+    return C.state === "loading" ? null : C.state === "gone" || C.state === "failed" ? `${P(e, k)} (unavailable)` : C.text;
+  }), q = ((t == null ? void 0 : t.context) ?? []).length > 0 && g.some((k) => k === null);
+  return /* @__PURE__ */ p("li", { "data-default-row": a.id, className: "group flex items-start gap-3 py-2", children: [
+    /* @__PURE__ */ p("div", { className: "min-w-0 flex-1 gap-3 sm:grid sm:grid-cols-[minmax(0,9rem)_minmax(0,1fr)]", children: [
+      /* @__PURE__ */ n(
+        "p",
+        {
+          "data-default-field": !0,
+          className: "truncate pt-px text-[12px] text-slate-500 dark:text-slate-400",
+          children: P(e, a.field)
+        }
+      ),
+      /* @__PURE__ */ p("div", { className: "min-w-0", children: [
+        m && v ? /* @__PURE__ */ n(
+          at,
+          {
+            row: a,
+            field: v,
+            relations: e.relations,
+            base: u,
+            onCancel: y,
+            onSaved: () => {
+              y(), i();
+            }
+          }
+        ) : h.state === "loading" ? /* @__PURE__ */ n(D, { className: "mt-0.5 h-3.5 w-32" }) : /* @__PURE__ */ n(
+          "p",
+          {
+            "data-default-value": !0,
+            "data-tip": h.state === "gone" ? "The saved record was removed, or is no longer visible to you" : void 0,
+            className: R(
+              "truncate text-[12.5px]",
+              h.state === "gone" || h.state === "failed" ? "italic text-slate-500 dark:text-slate-400" : f ? "text-slate-500 dark:text-slate-400" : "font-medium text-slate-800 dark:text-slate-100"
+            ),
+            children: h.text
+          }
+        ),
+        /* @__PURE__ */ p("p", { className: "mt-0.5 flex flex-wrap items-center gap-x-1.5 gap-y-1 text-[11.5px] text-slate-500 dark:text-slate-400", children: [
+          q ? /* @__PURE__ */ n(D, { className: "h-3 w-28" }) : g.length > 0 ? /* @__PURE__ */ p("span", { "data-default-context": !0, children: [
+            "for ",
+            g.join(" · ")
+          ] }) : null,
+          (q || g.length > 0) && /* @__PURE__ */ n("span", { "aria-hidden": !0, children: "·" }),
+          /* @__PURE__ */ p("span", { children: [
+            "Saved ",
+            Fe(a.updated_at),
+            a.updated_by ? " by an admin" : ""
+          ] }),
+          f && /* @__PURE__ */ p("span", { "data-tip": ee, children: [
+            /* @__PURE__ */ n(Ye, { tone: "amber", testId: "stale", children: /* @__PURE__ */ n("span", { "data-default-stale": !0, children: "No longer on any form" }) }),
+            /* @__PURE__ */ p("span", { className: "sr-only", children: [
+              ". ",
+              ee
+            ] })
+          ] })
+        ] })
+      ] })
+    ] }),
+    !m && /* @__PURE__ */ p(
+      "div",
+      {
+        className: R(
+          "flex shrink-0 items-center gap-0.5 transition-opacity duration-150",
+          // Reserve the slot; show on hover / keyboard focus, always on touch and when stale.
+          // …and while Clear is armed (the pointer may have left before the second press).
+          !f && "opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 [@media(hover:none)]:opacity-100 [&:has([data-armed])]:opacity-100"
+        ),
+        children: [
+          !f && v && /* @__PURE__ */ n(
+            "button",
+            {
+              ref: c,
+              type: "button",
+              "data-default-change": !0,
+              "aria-label": `Change the default for ${P(e, a.field)}`,
+              "data-tip": "Change",
+              onClick: () => x(!0),
+              className: "rounded p-1.5 text-slate-500 transition-colors hover:bg-muted hover:text-slate-800 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-nvr-cyan/40 dark:text-slate-400 dark:hover:text-slate-100",
+              children: /* @__PURE__ */ n(ye, { className: "h-3.5 w-3.5" })
+            }
+          ),
+          /* @__PURE__ */ n(
+            Je,
+            {
+              onConfirm: s,
+              disabled: d,
+              title: `Clear the default for ${P(e, a.field)}`,
+              confirmTitle: `Clear the default for ${P(e, a.field)}?`,
+              confirmLabel: /* @__PURE__ */ n("span", { "data-default-clear": !0, className: "px-1 text-[11.5px] font-semibold", children: "Clear?" }),
+              className: "inline-flex h-7 items-center rounded px-1.5 text-slate-500 transition-colors hover:bg-muted hover:text-red-700 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-nvr-cyan/40 disabled:opacity-50 dark:text-slate-400 dark:hover:text-red-400",
+              armedClassName: "bg-red-50 text-red-700 hover:bg-red-100 dark:bg-red-500/10 dark:text-red-400 dark:hover:bg-red-500/15",
+              children: /* @__PURE__ */ n("span", { "data-default-clear": !0, className: "inline-flex items-center", children: /* @__PURE__ */ n(ke, { className: "h-3.5 w-3.5" }) })
+            }
+          )
+        ]
+      }
+    )
+  ] });
+}
+function ie({
+  collection: a,
+  field: e,
+  relations: t,
+  context: o,
+  value: u,
+  onChange: i
+}) {
+  var f;
+  const s = S(() => ({ ...e, readonly: !1, hidden: !1 }), [e]), d = ((f = Ae(t, a, e.field)) == null ? void 0 : f.kind) === "m2m", m = S(
+    () => Array.isArray(u) ? u : M(u) ? [] : [u],
+    [u]
+  ), x = S(
+    () => d ? {
+      getStagedLinks: () => m,
+      getStagedUnlinks: () => /* @__PURE__ */ new Set(),
+      stageLink: (v, h) => i(m.some((g) => String(g) === String(h)) ? m : [...m, h]),
+      unstageLink: (v, h) => i(m.filter((g) => String(g) !== String(h))),
+      stageUnlink: () => {
+      },
+      unstageUnlink: () => {
+      }
+    } : null,
+    [d, m, i]
+  ), c = S(
+    () => Me({
+      rules: re(e.dependency_config),
+      parentValue: (v) => M(o[v]) ? null : o[v]
+    }).filter,
+    [e.dependency_config, o]
+  ), b = S(() => ({ collection: a, draft: { ...o } }), [a, o]), y = /* @__PURE__ */ n(
+    $e,
+    {
+      field: s,
+      value: d ? void 0 : u,
+      onChange: i,
+      relations: t,
+      collection: a,
+      itemId: "new",
+      cascadeFilter: c
+    }
+  );
+  return /* @__PURE__ */ n(we.Provider, { value: b, children: x ? /* @__PURE__ */ n(_e.Provider, { value: x, children: y }) : y });
+}
+function oe({
+  canSave: a,
+  pending: e,
+  onSave: t,
+  onCancel: o
+}) {
+  return /* @__PURE__ */ p("span", { className: "flex items-center gap-1.5", children: [
+    /* @__PURE__ */ p("button", { type: "button", onClick: o, className: De, children: [
+      /* @__PURE__ */ n(Ce, { className: "h-3 w-3" }),
+      " Cancel"
+    ] }),
+    /* @__PURE__ */ n(
+      "button",
+      {
+        type: "button",
+        "data-default-save": !0,
+        disabled: !a || e,
+        onClick: t,
+        className: "inline-flex h-7 items-center gap-1 rounded-md bg-nvr-cyan px-2.5 text-[11.5px] font-semibold text-white transition-opacity focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-nvr-cyan/40 focus-visible:ring-offset-1 disabled:opacity-50",
+        children: e ? "Saving…" : /* @__PURE__ */ p(ge, { children: [
+          /* @__PURE__ */ n(ne, { className: "h-3 w-3" }),
+          " Save"
+        ] })
+      }
+    )
+  ] });
+}
+function de(a, e) {
+  const t = X(), [o, u] = w(null);
+  return { save: ae({
+    mutationFn: (s) => t.request(Pe(a, s)),
+    onSuccess: () => {
+      u(null), B.success("Default saved"), e();
+    },
+    onError: (s) => u(se(s))
+  }), error: o };
+}
+function at({
+  row: a,
+  field: e,
+  relations: t,
+  base: o,
+  onCancel: u,
+  onSaved: i
+}) {
+  const [s, d] = w(a.value), { save: m, error: x } = de(o, i), c = V(null);
+  return le(() => {
+    const b = () => {
+      var v, h;
+      const f = (h = (v = c.current) == null ? void 0 : v.querySelector("[data-default-control]")) == null ? void 0 : h.querySelector(et);
+      return f == null || f.focus(), !!f;
+    };
+    if (b()) return;
+    const y = window.setTimeout(b, 50);
+    return () => window.clearTimeout(y);
+  }, []), /* @__PURE__ */ p(
+    "fieldset",
+    {
+      ref: c,
+      className: "m-0 min-w-0 space-y-1.5 border-0 p-0",
+      "data-default-editor": !0,
+      onKeyDown: (b) => {
+        var y;
+        b.key !== "Escape" || b.defaultPrevented || (y = c.current) != null && y.contains(b.target) && (b.stopPropagation(), u());
+      },
+      children: [
+        /* @__PURE__ */ p("legend", { className: "sr-only", children: [
+          "Change the default for ",
+          e.label || e.field
+        ] }),
+        /* @__PURE__ */ n("div", { "data-default-control": !0, children: /* @__PURE__ */ n(
+          ie,
+          {
+            collection: a.collection,
+            field: e,
+            relations: t,
+            context: a.context ?? {},
+            value: s,
+            onChange: d
+          }
+        ) }),
+        x && /* @__PURE__ */ n("p", { role: "alert", className: "text-[11.5px] text-red-600 dark:text-red-400", children: x }),
+        /* @__PURE__ */ n(
+          oe,
+          {
+            canSave: !M(s),
+            pending: m.isPending,
+            onCancel: u,
+            onSave: () => m.mutate({
+              collection: a.collection,
+              field: a.field,
+              value: s,
+              context: a.context ?? {}
+            })
+          }
+        )
+      ]
+    }
+  );
+}
+function te({
+  value: a,
+  options: e,
+  placeholder: t,
+  label: o,
+  onChange: u,
+  testId: i,
+  disabled: s
+}) {
+  const [d, m] = w(!1), x = e.find((c) => c.value === a);
+  return /* @__PURE__ */ p(Qe, { open: d, onOpenChange: m, children: [
+    /* @__PURE__ */ n(Ve, { asChild: !0, children: /* @__PURE__ */ p(
+      "button",
+      {
+        type: "button",
+        role: "combobox",
+        "aria-expanded": d,
+        "aria-label": o,
+        "data-default-pick": i,
+        disabled: s,
+        className: "flex h-8 w-full items-center justify-between gap-2 rounded-md border border-slate-200 bg-white px-2.5 text-left text-[12.5px] text-slate-700 transition-colors hover:border-slate-300 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-nvr-cyan/40 disabled:cursor-not-allowed disabled:bg-slate-50 disabled:hover:border-slate-200 dark:border-border dark:bg-background dark:text-slate-200 dark:hover:border-slate-600 dark:disabled:bg-muted/40 dark:disabled:hover:border-border",
+        children: [
+          /* @__PURE__ */ n("span", { className: R("truncate", !x && "text-slate-500 dark:text-slate-400"), children: (x == null ? void 0 : x.label) ?? t }),
+          /* @__PURE__ */ n(Ne, { className: "h-3.5 w-3.5 shrink-0 text-slate-400" })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ n(Be, { className: "w-[260px] p-0", align: "start", children: /* @__PURE__ */ p(Le, { children: [
+      /* @__PURE__ */ n(Ue, { placeholder: "Search…", className: "h-8 text-[12px]" }),
+      /* @__PURE__ */ p(Re, { children: [
+        /* @__PURE__ */ n(je, { className: "py-3 text-center text-[12px] text-slate-500 dark:text-slate-400", children: "No matches" }),
+        /* @__PURE__ */ n(Ie, { children: e.map((c) => /* @__PURE__ */ p(
+          Oe,
+          {
+            value: `${c.label} ${c.value}`,
+            onSelect: () => {
+              u(c.value), m(!1);
+            },
+            className: "text-[12px]",
+            children: [
+              /* @__PURE__ */ n(
+                ne,
+                {
+                  className: R("mr-2 h-3 w-3", c.value === a ? "opacity-100" : "opacity-0")
+                }
+              ),
+              c.label
+            ]
+          },
+          c.value
+        )) })
+      ] })
+    ] }) })
+  ] });
+}
+function nt({
+  allowed: a,
+  metas: e,
+  collection: t,
+  onCollection: o,
+  base: u,
+  onDone: i,
+  onSaved: s
+}) {
+  const [d, m] = w(""), [x, c] = w(null), { save: b, error: y } = de(u, () => {
+    s(t), i();
+  }), f = t ? e.get(t) : void 0, v = a.find((g) => g.collection === t), h = f == null ? void 0 : f.fields.find((g) => g.field === d);
+  return /* @__PURE__ */ p(
+    "div",
+    {
+      "data-default-add-form": !0,
+      className: "mt-3 space-y-2 border-t border-slate-100 pt-3 dark:border-border/60",
+      children: [
+        /* @__PURE__ */ p("div", { className: "grid gap-2 sm:grid-cols-2", children: [
+          /* @__PURE__ */ n(
+            te,
+            {
+              testId: "collection",
+              label: "Collection",
+              placeholder: "Choose a collection",
+              value: t,
+              options: a.map((g) => {
+                var q;
+                return {
+                  value: g.collection,
+                  label: g.label ?? ((q = e.get(g.collection)) == null ? void 0 : q.label) ?? _(g.collection)
+                };
+              }),
+              onChange: (g) => {
+                o(g), m(""), c(null);
+              }
+            }
+          ),
+          /* @__PURE__ */ n(
+            te,
+            {
+              testId: "field",
+              label: "Field",
+              disabled: !t,
+              placeholder: t ? "Choose a field" : "Choose a collection first",
+              value: d,
+              options: ((v == null ? void 0 : v.fields) ?? []).map((g) => ({
+                value: g,
+                label: f ? P(f, g) : _(g)
+              })),
+              onChange: (g) => {
+                m(g), c(null);
+              }
+            }
+          )
+        ] }),
+        h && (f != null && f.ready) ? /* @__PURE__ */ n(
+          ie,
+          {
+            collection: t,
+            field: h,
+            relations: f.relations,
+            context: {},
+            value: x,
+            onChange: c
+          }
+        ) : d && !(f != null && f.ready) ? /* @__PURE__ */ n(D, { className: "h-8 w-full" }) : null,
+        y && /* @__PURE__ */ n("p", { role: "alert", className: "text-[11.5px] text-red-600 dark:text-red-400", children: y }),
+        /* @__PURE__ */ p("div", { className: "flex items-center justify-between gap-2", children: [
+          /* @__PURE__ */ n("p", { className: "text-[11px] text-slate-500 dark:text-slate-400", children: "Checked as them: they must be able to set the field and pick the value." }),
+          /* @__PURE__ */ n(
+            oe,
+            {
+              canSave: !!h && !M(x),
+              pending: b.isPending,
+              onCancel: i,
+              onSave: () => b.mutate({ collection: t, field: d, value: x, context: {} })
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+export {
+  wt as MyDefaultsCard
+};