@nivaro/react 0.3.35 → 0.3.37

package/dist/shared/components/layout-editor/inspector/kit.js

@@ -1,43 +1,45 @@
 import { jsxs as d, jsx as t, Fragment as J } from "react/jsx-runtime";
 import { useQuery as R } from "@tanstack/react-query";
-import { Globe2 as j, ChevronRight as _, ChevronDown as $, Check as G, X as U } from "lucide-react";
-import { useContext as h, createContext as P, useState as g, useRef as I, useEffect as E } from "react";
-import { useNivaroClient as K } from "../../../context.js";
-import { get as M } from "../../../lib/commands.js";
-import { cn as m } from "../../../lib/utils.js";
-import { Command as V, CommandInput as Q, CommandList as W, CommandEmpty as X, CommandGroup as Y, CommandItem as z } from "../../ui/command.js";
-import { Popover as H, PopoverTrigger as Z, PopoverContent as ee } from "../../ui/popover.js";
-import { SimpleSelect as te } from "../../ui/SimpleSelect.js";
-import { Switch as ne } from "../../ui/switch.js";
-import { useFocusBuffer as x } from "../focus-buffer.js";
-import { labelText as ae, effectText as q, segOption as re, segTrack as le, inputBase as v, groupTitle as L } from "../panel-style.js";
-const N = P(null);
-function se() {
-  const e = h(N);
+import { Globe2 as $, Star as U, ChevronRight as _, ChevronDown as G, Check as K, X as M } from "lucide-react";
+import { useContext as b, useEffect as P, createContext as E, useState as v, useCallback as V, useMemo as Z, useRef as F } from "react";
+import { createPortal as Q } from "react-dom";
+import { useNivaroClient as W } from "../../../context.js";
+import { get as X } from "../../../lib/commands.js";
+import { cn as p } from "../../../lib/utils.js";
+import { Command as Y, CommandInput as H, CommandList as z, CommandEmpty as ee, CommandGroup as te, CommandItem as ne } from "../../ui/command.js";
+import { Popover as re, PopoverTrigger as ae, PopoverContent as se } from "../../ui/popover.js";
+import { SimpleSelect as oe } from "../../ui/SimpleSelect.js";
+import { Switch as le } from "../../ui/switch.js";
+import { useFocusBuffer as k } from "../focus-buffer.js";
+import { usePinnedSettings as ie, togglePinnedSetting as ce } from "../nav/view-prefs.js";
+import { labelText as de, effectText as q, segOption as ue, segTrack as me, inputBase as C, groupTitle as T } from "../panel-style.js";
+const w = E(null);
+function pe() {
+  const e = b(w);
   if (!e) throw new Error("Inspector parts render inside <Inspector>");
   return e;
 }
-const C = P(null);
-function Oe(e, o) {
+const I = E(null);
+function qe(e, o) {
   var n;
-  const i = h(C), l = (n = i == null ? void 0 : i.pending) == null ? void 0 : n.values;
-  return l && e in l ? l[e] : o;
+  const l = b(I), r = (n = l == null ? void 0 : l.pending) == null ? void 0 : n.values;
+  return r && e in r ? r[e] : o;
 }
-function oe() {
-  const e = h(C), o = K(), i = e == null ? void 0 : e.pending, { data: l, isLoading: n } = R({
+function fe() {
+  const e = b(I), o = W(), l = e == null ? void 0 : e.pending, { data: r, isLoading: n } = R({
     queryKey: ["layout-editor", "field-impact", e == null ? void 0 : e.collection, e == null ? void 0 : e.field],
     queryFn: () => o.request(
-      M(`/data-model/${e == null ? void 0 : e.collection}/fields/${encodeURIComponent((e == null ? void 0 : e.field) ?? "")}/impact`)
-    ).then((s) => s.data ?? []),
-    enabled: !!i && !!e,
+      X(`/data-model/${e == null ? void 0 : e.collection}/fields/${encodeURIComponent((e == null ? void 0 : e.field) ?? "")}/impact`)
+    ).then((i) => i.data ?? []),
+    enabled: !!l && !!e,
     staleTime: 6e4
   });
-  if (!e || !i) return null;
+  if (!e || !l) return null;
   const a = [
-    ...new Set((l ?? []).filter((s) => s.source === "layout").map((s) => s.label))
+    ...new Set((r ?? []).filter((i) => i.source === "layout").map((i) => i.label))
   ], c = [
-    ...new Set((l ?? []).filter((s) => s.source !== "layout").map((s) => s.label))
-  ], r = a.slice(0, 8);
+    ...new Set((r ?? []).filter((i) => i.source !== "layout").map((i) => i.label))
+  ], s = a.slice(0, 8);
   return /* @__PURE__ */ d(
     "div",
     {
@@ -50,18 +52,18 @@ function oe() {
           e.fieldLabel,
           " on every form that shows it, not just this one."
         ] }),
-        i.labels.length > 1 && /* @__PURE__ */ t("ul", { "data-global-changes": "", className: "list-disc space-y-0.5 pl-4 text-[11px]", children: i.labels.map((s) => /* @__PURE__ */ t("li", { children: s }, s)) }),
+        l.labels.length > 1 && /* @__PURE__ */ t("ul", { "data-global-changes": "", className: "list-disc space-y-0.5 pl-4 text-[11px]", children: l.labels.map((i) => /* @__PURE__ */ t("li", { children: i }, i)) }),
         n ? /* @__PURE__ */ d("p", { className: "text-[11px] opacity-80", children: [
           "Finding where ",
           e.fieldLabel,
           " is used…"
         ] }) : /* @__PURE__ */ d("div", { className: "space-y-1 text-[11px]", children: [
-          r.length > 0 && /* @__PURE__ */ d("p", { children: [
+          s.length > 0 && /* @__PURE__ */ d("p", { children: [
             "Forms of ",
             e.collectionLabel,
             ": ",
-            r.join(", "),
-            a.length > r.length && ` and ${a.length - r.length} more`
+            s.join(", "),
+            a.length > s.length && ` and ${a.length - s.length} more`
           ] }),
           /* @__PURE__ */ d("p", { children: [
             "Also the ",
@@ -103,7 +105,7 @@ function oe() {
     }
   );
 }
-function ie({ scope: e }) {
+function he({ scope: e }) {
   return e === "field" ? /* @__PURE__ */ d(
     "span",
     {
@@ -111,89 +113,143 @@ function ie({ scope: e }) {
       "data-tip": "Saved on the field itself: every form that shows this field changes",
       className: "inline-flex shrink-0 items-center gap-1 text-[11px] font-medium text-amber-700 dark:text-amber-300",
       children: [
-        /* @__PURE__ */ t(j, { className: "h-3 w-3" }),
+        /* @__PURE__ */ t($, { className: "h-3 w-3" }),
         "Every form"
       ]
     }
   ) : /* @__PURE__ */ t("span", { "data-scope": "form", className: "sr-only", children: "This form only" });
 }
-function Te({ field: e }) {
+function Ae({ field: e }) {
   return /* @__PURE__ */ t("p", { "data-scope-legend": "", className: q, children: e ? /* @__PURE__ */ d(J, { children: [
     "Changes here apply to this form only, except settings marked",
     " ",
     /* @__PURE__ */ d("span", { className: "inline-flex items-center gap-1 whitespace-nowrap font-medium text-amber-700 dark:text-amber-300", children: [
-      /* @__PURE__ */ t(j, { className: "h-3 w-3" }),
+      /* @__PURE__ */ t($, { className: "h-3 w-3" }),
       "Every form"
     ] }),
     "."
   ] }) : "Changes here apply to this form only." });
 }
-const ce = "Enforced on the default form only";
-function de({ className: e }) {
-  return se().defaultForm ? null : /* @__PURE__ */ t(
+const be = "Enforced on the default form only";
+function ge({ className: e }) {
+  return pe().defaultForm ? null : /* @__PURE__ */ t(
     "p",
     {
       "data-setting": "inspector.enforcement_note",
       "data-enforcement": "",
-      className: m("text-[12px] leading-snug text-amber-700 dark:text-amber-300", e),
+      className: p("text-[12px] leading-snug text-amber-700 dark:text-amber-300", e),
       "data-tip": "The server applies this from the active grouped layout. On this form it only works in the browser.",
-      children: ce
+      children: be
     }
   );
 }
-function ue({
+function xe({
   k: e,
   label: o,
-  effect: i,
-  scope: l = "form",
+  effect: l,
+  scope: r = "form",
   enforced: n,
   inline: a,
   confirmAt: c,
-  children: r,
-  className: s
+  children: s,
+  className: i
 }) {
-  var p;
-  const u = h(C);
-  return /* @__PURE__ */ d("div", { "data-setting": e, "data-setting-row": "", className: m("space-y-1.5", s), children: [
-    /* @__PURE__ */ d("div", { className: "flex min-h-5 items-center justify-between gap-3", children: [
-      /* @__PURE__ */ d("span", { className: "flex min-w-0 flex-wrap items-center gap-x-2 gap-y-0.5", children: [
-        /* @__PURE__ */ t("span", { className: ae, children: o }),
-        /* @__PURE__ */ t(ie, { scope: l })
-      ] }),
-      a && /* @__PURE__ */ t("span", { className: "flex shrink-0 items-center", children: r })
-    ] }),
-    !a && r,
-    /* @__PURE__ */ t("p", { "data-effect": "", className: q, children: i }),
-    n && /* @__PURE__ */ t(de, {}),
-    l === "field" && ((p = u == null ? void 0 : u.pending) == null ? void 0 : p.key) === (c ?? e) && /* @__PURE__ */ t(oe, {})
+  var y;
+  const u = b(I), m = b(A), g = ie(), N = m ? g.indexOf(e) : -1, h = N >= 0, x = m == null ? void 0 : m.register;
+  P(() => h && x ? x() : void 0, [h, x]);
+  const f = /* @__PURE__ */ d(
+    "div",
+    {
+      "data-setting": e,
+      "data-setting-row": "",
+      "data-setting-pinned": h ? "" : void 0,
+      style: h ? { order: N } : void 0,
+      className: p("group/setting relative space-y-1.5", i),
+      children: [
+        /* @__PURE__ */ d("div", { className: "flex min-h-5 items-center justify-between gap-3", children: [
+          /* @__PURE__ */ d("span", { className: "flex min-w-0 flex-wrap items-center gap-x-2 gap-y-0.5", children: [
+            /* @__PURE__ */ t("span", { className: de, children: o }),
+            /* @__PURE__ */ t(he, { scope: r })
+          ] }),
+          a && /* @__PURE__ */ t("span", { className: "flex shrink-0 items-center", children: s })
+        ] }),
+        !a && s,
+        /* @__PURE__ */ t("p", { "data-effect": "", className: q, children: l }),
+        n && /* @__PURE__ */ t(ge, {}),
+        r === "field" && ((y = u == null ? void 0 : u.pending) == null ? void 0 : y.key) === (c ?? e) && /* @__PURE__ */ t(fe, {}),
+        m && /* @__PURE__ */ t(ve, { k: e, label: o, pinned: h })
+      ]
+    }
+  );
+  return h && (m != null && m.el) ? Q(f, m.el) : f;
+}
+const A = E(null);
+function ve({ k: e, label: o, pinned: l }) {
+  const r = typeof o == "string" ? o : "this setting";
+  return /* @__PURE__ */ t(
+    "button",
+    {
+      type: "button",
+      "data-setting-pin": e,
+      "aria-pressed": l,
+      "aria-label": l ? `Unpin ${r}` : `Pin ${r} to the top of this tab`,
+      "data-tip": l ? "Unpin" : "Pin to the top of this tab",
+      onClick: () => ce(e),
+      className: p(
+        "absolute -left-[15px] top-0 inline-flex h-5 w-3.5 items-center justify-center rounded-sm text-slate-400 transition-colors hover:text-amber-500 focus-visible:visible focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-nvr-cyan/50 dark:text-muted-foreground dark:hover:text-amber-300",
+        l ? "visible text-amber-500 dark:text-amber-300" : "invisible group-hover/setting:visible"
+      ),
+      children: /* @__PURE__ */ t(U, { className: p("h-3 w-3", l && "fill-current") })
+    }
+  );
+}
+function Be({ children: e }) {
+  const [o, l] = v(null), [r, n] = v(0), a = V(() => (n((s) => s + 1), () => n((s) => s - 1)), []), c = Z(() => ({ el: o, register: a }), [o, a]);
+  return /* @__PURE__ */ d(A.Provider, { value: c, children: [
+    /* @__PURE__ */ d(
+      "div",
+      {
+        "data-pinned-settings": r,
+        hidden: r === 0,
+        className: "space-y-3 border-b border-slate-100 pb-5 dark:border-border/60",
+        children: [
+          /* @__PURE__ */ d("h3", { className: p(T, "flex items-center gap-1.5"), children: [
+            /* @__PURE__ */ t(U, { className: "h-3 w-3 fill-current text-amber-500 dark:text-amber-300" }),
+            "Pinned"
+          ] }),
+          /* @__PURE__ */ t("div", { ref: l, className: "flex flex-col gap-5" })
+        ]
+      }
+    ),
+    e
   ] });
 }
-function Ie({
+function De({
   k: e,
   label: o,
-  effect: i,
-  scope: l,
+  effect: l,
+  scope: r,
   enforced: n,
   checked: a,
   onChange: c,
-  disabled: r,
-  confirmAt: s
+  disabled: s,
+  confirmAt: i
 }) {
   return /* @__PURE__ */ t(
-    ue,
+    xe,
     {
       k: e,
       label: o,
-      effect: i,
-      scope: l,
+      effect: l,
+      scope: r,
       enforced: n,
-      confirmAt: s,
+      confirmAt: i,
       inline: !0,
       children: /* @__PURE__ */ t(
-        ne,
+        le,
         {
           checked: a,
-          disabled: r,
+          disabled: s,
           onCheckedChange: c,
           "aria-label": typeof o == "string" ? o : void 0,
           className: "h-[18px] w-8 border-0 data-[state=checked]:bg-nvr-cyan data-[state=unchecked]:bg-slate-300 dark:data-[state=unchecked]:bg-slate-600 [&>span]:mx-0.5 [&>span]:h-3.5 [&>span]:w-3.5 [&>span]:bg-white [&>span]:shadow-sm [&>span]:data-[state=checked]:translate-x-3.5"
@@ -202,186 +258,186 @@ function Ie({
     }
   );
 }
-const A = v;
-function me({
+const B = C;
+function Ne({
   value: e,
   onChange: o,
-  placeholder: i,
-  mono: l,
+  placeholder: l,
+  mono: r,
   disabled: n,
   type: a = "text",
   ariaLabel: c
 }) {
-  const r = h(N), s = x(e, () => r == null ? void 0 : r.flush());
+  const s = b(w), i = k(e, () => s == null ? void 0 : s.flush());
   return /* @__PURE__ */ t(
     "input",
     {
       type: a,
-      value: s.value,
+      value: i.value,
       disabled: n,
       "aria-label": c,
-      placeholder: i,
+      placeholder: l,
       onChange: (u) => {
-        s.set(u.target.value), o(u.target.value);
+        i.set(u.target.value), o(u.target.value);
       },
       onKeyDown: (u) => {
-        u.key === "Enter" && (r == null || r.flush());
+        u.key === "Enter" && (s == null || s.flush());
       },
-      ...s.props,
-      className: m(A, l && "font-mono")
+      ...i.props,
+      className: p(B, r && "font-mono")
     }
   );
 }
-function Ee({
+function Je({
   value: e,
   onChange: o,
-  ariaLabel: i,
-  rows: l = 4,
+  ariaLabel: l,
+  rows: r = 4,
   mono: n
 }) {
-  const a = h(N), c = x(e, () => a == null ? void 0 : a.flush());
+  const a = b(w), c = k(e, () => a == null ? void 0 : a.flush());
   return /* @__PURE__ */ t(
     "textarea",
     {
-      "aria-label": i,
-      rows: l,
+      "aria-label": l,
+      rows: r,
       value: c.value,
-      onChange: (r) => {
-        c.set(r.target.value), o(r.target.value);
+      onChange: (s) => {
+        c.set(s.target.value), o(s.target.value);
       },
       ...c.props,
-      className: m(v, "h-auto py-1.5 leading-snug", n && "font-mono text-[12px]")
+      className: p(C, "h-auto py-1.5 leading-snug", n && "font-mono text-[12px]")
     }
   );
 }
-function Le({
+function Re({
   value: e,
   children: o,
-  className: i
+  className: l
 }) {
-  const l = h(N), n = x(e, () => l == null ? void 0 : l.flush());
+  const r = b(w), n = k(e, () => r == null ? void 0 : r.flush());
   return /* @__PURE__ */ t(
     "div",
     {
-      className: i,
+      className: l,
       ...n.props,
       onKeyDownCapture: (a) => {
-        a.key === "Enter" && a.target.tagName === "INPUT" && (l == null || l.flush());
+        a.key === "Enter" && a.target.tagName === "INPUT" && (r == null || r.flush());
       },
       children: o(n.value, (a) => (n.set(a), a))
     }
   );
 }
-function Fe({
+function _e({
   value: e,
   onCommit: o,
-  placeholder: i,
-  mono: l,
+  placeholder: l,
+  mono: r,
   ariaLabel: n
 }) {
-  const a = x(e);
+  const a = k(e);
   return /* @__PURE__ */ t(
     "input",
     {
       value: a.value,
       "aria-label": n,
-      placeholder: i,
+      placeholder: l,
       onChange: (c) => {
         a.set(c.target.value), o(c.target.value);
       },
       ...a.props,
-      className: m(A, l && "font-mono")
+      className: p(B, r && "font-mono")
     }
   );
 }
-function je({
+function Ge({
   value: e,
   options: o,
-  onChange: i,
-  disabled: l
+  onChange: l,
+  disabled: r
 }) {
-  return /* @__PURE__ */ t("div", { className: le(o.length), children: o.map((n) => /* @__PURE__ */ t(
+  return /* @__PURE__ */ t("div", { className: me(o.length), children: o.map((n) => /* @__PURE__ */ t(
     "button",
     {
       type: "button",
       "aria-pressed": n.value === e,
-      disabled: l,
+      disabled: r,
       "data-tip": n.tip,
-      onClick: () => i(n.value),
-      className: re(n.value === e),
+      onClick: () => l(n.value),
+      className: ue(n.value === e),
       children: n.label
     },
     n.value
   )) });
 }
-function F({
+function j({
   value: e,
   options: o,
-  onChange: i,
-  ariaLabel: l,
+  onChange: l,
+  ariaLabel: r,
   disabled: n,
   unknownLabel: a = (c) => c
 }) {
-  const c = e && !o.some((r) => r.value === e) ? [...o, { value: e, label: a(e) }] : o;
+  const c = e && !o.some((s) => s.value === e) ? [...o, { value: e, label: a(e) }] : o;
   return /* @__PURE__ */ t(
-    te,
+    oe,
     {
       value: e,
-      onChange: i,
+      onChange: l,
       options: c,
-      ariaLabel: l,
+      ariaLabel: r,
       disabled: n,
-      className: m(v, "focus:ring-0 focus:ring-offset-0")
+      className: p(C, "focus:ring-0 focus:ring-offset-0")
     }
   );
 }
-function Pe({
+function Ke({
   value: e,
   onCommit: o,
-  placeholder: i,
-  rows: l = 4,
+  placeholder: l,
+  rows: r = 4,
   validate: n,
   ariaLabel: a
 }) {
-  const c = e == null ? "" : JSON.stringify(e, null, 2), [r, s] = g(c), [u, p] = g(null), b = I(!1);
-  E(() => {
-    b.current || (s(c), p(null));
+  const c = e == null ? "" : JSON.stringify(e, null, 2), [s, i] = v(c), [u, m] = v(null), g = F(!1);
+  P(() => {
+    g.current || (i(c), m(null));
   }, [c]);
-  const w = (f) => {
-    const O = f.trim();
-    if (!O) return e != null ? { send: void 0 } : { error: null };
+  const N = (f) => {
+    const y = f.trim();
+    if (!y) return e != null ? { send: void 0 } : { error: null };
     try {
-      const y = JSON.parse(O), T = (n == null ? void 0 : n(y)) ?? null;
-      return T ? { error: T } : JSON.stringify(y) !== JSON.stringify(e) ? { send: y } : { error: null };
+      const S = JSON.parse(y), L = (n == null ? void 0 : n(S)) ?? null;
+      return L ? { error: L } : JSON.stringify(S) !== JSON.stringify(e) ? { send: S } : { error: null };
     } catch {
       return { error: "Not valid JSON — nothing saved" };
     }
-  }, D = () => {
-    const f = w(r);
-    "send" in f ? (p(null), o(f.send)) : p(f.error);
-  }, S = I(() => {
+  }, h = () => {
+    const f = N(s);
+    "send" in f ? (m(null), o(f.send)) : m(f.error);
+  }, x = F(() => {
   });
-  return S.current = () => {
-    if (!b.current) return;
-    const f = w(r);
+  return x.current = () => {
+    if (!g.current) return;
+    const f = N(s);
     "send" in f && o(f.send);
-  }, E(() => () => S.current(), []), /* @__PURE__ */ d("div", { className: "space-y-1", children: [
+  }, P(() => () => x.current(), []), /* @__PURE__ */ d("div", { className: "space-y-1", children: [
     /* @__PURE__ */ t(
       "textarea",
       {
-        value: r,
-        rows: l,
+        value: s,
+        rows: r,
         "aria-label": a,
         spellCheck: !1,
-        placeholder: i,
-        onChange: (f) => s(f.target.value),
+        placeholder: l,
+        onChange: (f) => i(f.target.value),
         onFocus: () => {
-          b.current = !0;
+          g.current = !0;
         },
         onBlur: () => {
-          b.current = !1, D();
+          g.current = !1, h();
         },
-        className: m(
+        className: p(
           "w-full rounded-md border bg-white px-2.5 py-1.5 font-mono text-[12px] leading-snug text-foreground placeholder:text-slate-400 focus:outline-none dark:bg-background",
           u ? "border-red-400 dark:border-red-500" : "border-slate-200 focus:border-nvr-cyan dark:border-border"
         )
@@ -390,39 +446,39 @@ function Pe({
     u && /* @__PURE__ */ t("p", { className: "text-[12px] text-red-600 dark:text-red-400", children: u })
   ] });
 }
-function qe({
+function Me({
   title: e,
   children: o,
-  className: i,
-  collapsible: l,
+  className: l,
+  collapsible: r,
   defaultOpen: n = !1
 }) {
-  const [a, c] = g(!l || n);
+  const [a, c] = v(!r || n);
   return /* @__PURE__ */ d(
     "section",
     {
-      className: m(
+      className: p(
         "space-y-4 border-t border-slate-100 pt-5 dark:border-border/60",
-        l && !a && "space-y-0",
-        i
+        r && !a && "space-y-0",
+        l
       ),
       children: [
-        l ? /* @__PURE__ */ d(
+        r ? /* @__PURE__ */ d(
           "button",
           {
             type: "button",
             "aria-expanded": a,
             "data-section-toggle": "",
-            onClick: () => c((r) => !r),
-            className: m(
-              L,
+            onClick: () => c((s) => !s),
+            className: p(
+              T,
               "-mx-1 flex w-[calc(100%+0.5rem)] items-center gap-1.5 rounded px-1 text-left hover:bg-slate-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-nvr-cyan/50 dark:hover:bg-muted/60"
             ),
             children: [
               /* @__PURE__ */ t(
                 _,
                 {
-                  className: m(
+                  className: p(
                     "h-3.5 w-3.5 shrink-0 text-slate-400 transition-transform duration-150",
                     a && "rotate-90"
                   )
@@ -431,111 +487,111 @@ function qe({
               e
             ]
           }
-        ) : /* @__PURE__ */ t("h3", { className: L, children: e }),
+        ) : /* @__PURE__ */ t("h3", { className: T, children: e }),
         /* @__PURE__ */ t("div", { hidden: !a, className: "space-y-5", children: o })
       ]
     }
   );
 }
-function Ae({
+function Ve({
   value: e,
   options: o,
-  onChange: i,
-  placeholder: l = "None selected",
+  onChange: l,
+  placeholder: r = "None selected",
   ariaLabel: n
 }) {
-  const [a, c] = g(!1), r = (s) => {
+  const [a, c] = v(!1), s = (i) => {
     var u;
-    return ((u = o.find((p) => p.value === s)) == null ? void 0 : u.label) ?? s;
+    return ((u = o.find((m) => m.value === i)) == null ? void 0 : u.label) ?? i;
   };
-  return /* @__PURE__ */ d(H, { open: a, onOpenChange: c, children: [
-    /* @__PURE__ */ t(Z, { asChild: !0, children: /* @__PURE__ */ d(
+  return /* @__PURE__ */ d(re, { open: a, onOpenChange: c, children: [
+    /* @__PURE__ */ t(ae, { asChild: !0, children: /* @__PURE__ */ d(
       "button",
       {
         type: "button",
         "aria-label": n,
-        className: m(
-          v,
+        className: p(
+          C,
           "flex items-center justify-between text-left hover:border-slate-300"
         ),
         children: [
-          /* @__PURE__ */ t("span", { className: m("truncate", !e.length && "text-slate-400"), children: e.length ? e.map(r).join(", ") : l }),
-          /* @__PURE__ */ t($, { className: "ml-1 h-3.5 w-3.5 shrink-0 text-slate-400" })
+          /* @__PURE__ */ t("span", { className: p("truncate", !e.length && "text-slate-400"), children: e.length ? e.map(s).join(", ") : r }),
+          /* @__PURE__ */ t(G, { className: "ml-1 h-3.5 w-3.5 shrink-0 text-slate-400" })
         ]
       }
     ) }),
-    /* @__PURE__ */ t(ee, { className: "w-64 p-0", align: "start", children: /* @__PURE__ */ d(V, { children: [
-      /* @__PURE__ */ t(Q, { placeholder: "Search fields…", className: "h-8 text-[12px]" }),
-      /* @__PURE__ */ d(W, { className: "max-h-[240px]", children: [
-        /* @__PURE__ */ t(X, { className: "py-3 text-center text-[12px] text-muted-foreground", children: "No fields" }),
-        /* @__PURE__ */ t(Y, { children: o.map((s) => {
-          const u = e.includes(s.value);
+    /* @__PURE__ */ t(se, { className: "w-64 p-0", align: "start", children: /* @__PURE__ */ d(Y, { children: [
+      /* @__PURE__ */ t(H, { placeholder: "Search fields…", className: "h-8 text-[12px]" }),
+      /* @__PURE__ */ d(z, { className: "max-h-[240px]", children: [
+        /* @__PURE__ */ t(ee, { className: "py-3 text-center text-[12px] text-muted-foreground", children: "No fields" }),
+        /* @__PURE__ */ t(te, { children: o.map((i) => {
+          const u = e.includes(i.value);
           return /* @__PURE__ */ d(
-            z,
+            ne,
             {
-              value: `${s.label} ${s.value}`,
-              onSelect: () => i(u ? e.filter((p) => p !== s.value) : [...e, s.value]),
+              value: `${i.label} ${i.value}`,
+              onSelect: () => l(u ? e.filter((m) => m !== i.value) : [...e, i.value]),
               className: "flex items-center gap-2 text-[12px]",
               children: [
                 /* @__PURE__ */ t(
-                  G,
+                  K,
                   {
-                    className: m("h-3 w-3 shrink-0", u ? "opacity-100" : "opacity-0")
+                    className: p("h-3 w-3 shrink-0", u ? "opacity-100" : "opacity-0")
                   }
                 ),
-                /* @__PURE__ */ t("span", { className: "flex-1 truncate", children: s.label }),
-                /* @__PURE__ */ t("span", { className: "shrink-0 font-mono text-[11px] text-slate-400", children: s.hint ?? s.value })
+                /* @__PURE__ */ t("span", { className: "flex-1 truncate", children: i.label }),
+                /* @__PURE__ */ t("span", { className: "shrink-0 font-mono text-[11px] text-slate-400", children: i.hint ?? i.value })
               ]
             },
-            s.value
+            i.value
           );
         }) })
       ] })
     ] }) })
   ] });
 }
-const k = [
+const O = [
   { value: "eq", label: "is" },
   { value: "neq", label: "is not" },
   { value: "nnull", label: "is set" }
 ];
-function Be({
+function Ze({
   value: e,
   fields: o,
-  onChange: i
+  onChange: l
 }) {
-  const l = (n, a) => i(e.map((c, r) => r === n ? { ...c, ...a } : c));
+  const r = (n, a) => l(e.map((c, s) => s === n ? { ...c, ...a } : c));
   return /* @__PURE__ */ d("div", { className: "space-y-1.5", children: [
     e.map((n, a) => {
-      const c = k.some((r) => r.value === n.op) ? k : [...k, { value: n.op, label: n.op }];
+      const c = O.some((s) => s.value === n.op) ? O : [...O, { value: n.op, label: n.op }];
       return (
         // biome-ignore lint/suspicious/noArrayIndexKey: conditions are positional
         /* @__PURE__ */ d("div", { className: "flex items-center gap-1", "data-condition-row": "", children: [
           /* @__PURE__ */ t("div", { className: "min-w-0 flex-[3]", children: /* @__PURE__ */ t(
-            F,
+            j,
             {
               value: n.field,
               ariaLabel: "Field",
               options: [{ value: "", label: "Field…" }, ...o],
-              onChange: (r) => l(a, { field: r })
+              onChange: (s) => r(a, { field: s })
             }
           ) }),
           /* @__PURE__ */ t("div", { className: "min-w-0 flex-[2]", children: /* @__PURE__ */ t(
-            F,
+            j,
             {
               value: n.op,
               ariaLabel: "Condition",
               options: c,
-              onChange: (r) => l(a, r === "nnull" ? { op: r, value: void 0 } : { op: r })
+              onChange: (s) => r(a, s === "nnull" ? { op: s, value: void 0 } : { op: s })
             }
           ) }),
           n.op !== "nnull" && n.op !== "null" && /* @__PURE__ */ t("div", { className: "min-w-0 flex-[2]", children: /* @__PURE__ */ t(
-            me,
+            Ne,
             {
               value: n.value == null ? "" : String(n.value),
               ariaLabel: "Value",
               placeholder: "value",
-              onChange: (r) => l(a, { value: r })
+              onChange: (s) => r(a, { value: s })
             }
           ) }),
           /* @__PURE__ */ t(
@@ -544,9 +600,9 @@ function Be({
               type: "button",
               "aria-label": "Remove condition",
               "data-tip": "Remove condition",
-              onClick: () => i(e.filter((r, s) => s !== a)),
+              onClick: () => l(e.filter((s, i) => i !== a)),
               className: "inline-flex h-7 w-7 shrink-0 items-center justify-center rounded text-slate-500 transition-colors hover:bg-slate-100 hover:text-red-600 dark:hover:bg-muted dark:hover:text-red-400",
-              children: /* @__PURE__ */ t(U, { className: "h-3.5 w-3.5" })
+              children: /* @__PURE__ */ t(M, { className: "h-3.5 w-3.5" })
             }
           )
         ] }, a)
@@ -556,41 +612,42 @@ function Be({
       "button",
       {
         type: "button",
-        onClick: () => i([...e, { field: "", op: "eq", value: "" }]),
-        className: B,
+        onClick: () => l([...e, { field: "", op: "eq", value: "" }]),
+        className: D,
         children: "+ Add condition"
       }
     )
   ] });
 }
-const B = "text-[12px] font-medium text-sky-700 hover:underline dark:text-nvr-cyan";
-function De({ onClick: e, children: o }) {
-  return /* @__PURE__ */ t("button", { type: "button", onClick: e, className: B, children: o });
+const D = "text-[12px] font-medium text-sky-700 hover:underline dark:text-nvr-cyan";
+function Qe({ onClick: e, children: o }) {
+  return /* @__PURE__ */ t("button", { type: "button", onClick: e, className: D, children: o });
 }
 export {
-  De as AddButton,
-  Le as Buffered,
-  k as CONDITION_OPS,
-  F as Choice,
-  Be as ConditionBuilder,
-  ce as DEFAULT_FORM_ONLY,
-  Fe as DraftInput,
-  de as EnforcementNote,
-  Ae as FieldMultiPicker,
-  oe as GlobalConfirm,
-  C as GlobalWriterContext,
-  N as InspectorEnvContext,
-  Pe as JsonInput,
-  Te as ScopeLegend,
-  ie as ScopeTag,
-  qe as Section,
-  je as Segmented,
-  ue as Setting,
-  Ee as TextArea,
-  me as TextInput,
-  Ie as Toggle,
-  B as addLinkCls,
-  A as inputCls,
-  Oe as useGlobalValue,
-  se as useInspectorEnv
+  Qe as AddButton,
+  Re as Buffered,
+  O as CONDITION_OPS,
+  j as Choice,
+  Ze as ConditionBuilder,
+  be as DEFAULT_FORM_ONLY,
+  _e as DraftInput,
+  ge as EnforcementNote,
+  Ve as FieldMultiPicker,
+  fe as GlobalConfirm,
+  I as GlobalWriterContext,
+  w as InspectorEnvContext,
+  Ke as JsonInput,
+  Be as PinZone,
+  Ae as ScopeLegend,
+  he as ScopeTag,
+  Me as Section,
+  Ge as Segmented,
+  xe as Setting,
+  Je as TextArea,
+  Ne as TextInput,
+  De as Toggle,
+  D as addLinkCls,
+  B as inputCls,
+  qe as useGlobalValue,
+  pe as useInspectorEnv
 };