@nivaro/react 0.3.41 → 0.3.42

package/dist/shared/components/layout-editor/editors/cascade-filters.js

@@ -1,39 +1,42 @@
 import { jsxs as a, jsx as e } from "react/jsx-runtime";
-import { ChevronsUpDown as _, Check as y, Pencil as Ne, X as ke, Plus as ve } from "lucide-react";
-import { useState as r } from "react";
-import { cn as h } from "../../../lib/utils.js";
+import { ChevronsUpDown as _, Check as y, Pencil as ke, X as ve, Plus as _e } from "lucide-react";
+import { useState as c } from "react";
+import { describeCascadeFilter as ye } from "../../../lib/config-sentences.js";
+import { cn as u } from "../../../lib/utils.js";
+import { ConfigReadBack as we } from "../../ConfigReadBack.js";
 import { Button as ee } from "../../ui/button.js";
-import { Command as C, CommandInput as w, CommandList as M, CommandEmpty as S, CommandGroup as P, CommandItem as O } from "../../ui/command.js";
+import { Command as w, CommandInput as C, CommandList as S, CommandEmpty as M, CommandGroup as P, CommandItem as O } from "../../ui/command.js";
 import { Input as te } from "../../ui/input.js";
-import { Popover as E, PopoverTrigger as A, PopoverContent as F } from "../../ui/popover.js";
-import { Switch as x } from "../../ui/switch.js";
-import { useCollectionBody as _e } from "../collection-meta.js";
-import { tintCard as L } from "../panel-style.js";
-const j = "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";
-function Re({
-  rules: c,
-  m2oFields: f,
-  relatedCollection: b,
-  onChange: i
+import { Popover as E, PopoverTrigger as j, PopoverContent as F } from "../../ui/popover.js";
+import { Switch as b } from "../../ui/switch.js";
+import { useCollectionBody as Ce } from "../collection-meta.js";
+import { tintCard as B } from "../panel-style.js";
+const A = "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";
+function ze({
+  rules: d,
+  m2oFields: m,
+  relatedCollection: i,
+  fieldLabel: ae,
+  onChange: p
 }) {
   var Y, Z;
-  const [z, N] = r(!1), [I, k] = r(null), [o, B] = r(""), [m, R] = r(""), [ae, T] = r(!1), [le, $] = r(!1), [ne, D] = r(!1), [se, G] = r(!1), [g, H] = r(""), [p, U] = r(""), { data: u } = _e(b), v = ((Y = u == null ? void 0 : u.fields) == null ? void 0 : Y.map((t) => t.field)) ?? [], [W, X] = r(!0), [q, J] = r(!1), [K, Q] = r(!0);
-  function re() {
-    k(null), B(""), R(""), X(!0), J(!1), Q(!0), N(!0);
-  }
+  const [L, N] = c(!1), [I, k] = c(null), [h, T] = c(""), [f, R] = c(""), [ne, z] = c(!1), [le, $] = c(!1), [se, D] = c(!1), [re, G] = c(!1), [g, H] = c(""), [x, U] = c(""), { data: r } = Ce(i), v = ((Y = r == null ? void 0 : r.fields) == null ? void 0 : Y.map((t) => t.field)) ?? [], [W, X] = c(!0), [q, J] = c(!1), [K, Q] = c(!0);
   function ce() {
+    k(null), T(""), R(""), X(!0), J(!1), Q(!0), N(!0);
+  }
+  function de() {
     N(!1);
   }
   function V(t) {
-    return ((u == null ? void 0 : u.relations) ?? []).some((n) => n.one_field === t && !!n.junction_field);
+    return ((r == null ? void 0 : r.relations) ?? []).some((l) => l.one_field === t && !!l.junction_field);
   }
-  function de() {
-    if (!o.trim() || !m.trim()) return;
-    const t = m.trim();
-    i([
-      ...c,
+  function ie() {
+    if (!h.trim() || !f.trim()) return;
+    const t = f.trim();
+    p([
+      ...d,
       {
-        parent_field: o.trim(),
+        parent_field: h.trim(),
         filter_column: t,
         clear_on_parent_change: W,
         clear_on_unavailable: q,
@@ -42,18 +45,18 @@ function Re({
       }
     ]), N(!1);
   }
-  function ie(t) {
-    N(!1), H(c[t].parent_field), U(c[t].filter_column), k(t);
+  function oe(t) {
+    N(!1), H(d[t].parent_field), U(d[t].filter_column), k(t);
   }
-  function oe() {
+  function me() {
     k(null);
   }
-  function me() {
-    if (I === null || !g.trim() || !p.trim()) return;
-    const t = p.trim();
-    i(
-      c.map(
-        (s, n) => n === I ? {
+  function pe() {
+    if (I === null || !g.trim() || !x.trim()) return;
+    const t = x.trim();
+    p(
+      d.map(
+        (s, l) => l === I ? {
           ...s,
           parent_field: g.trim(),
           filter_column: t,
@@ -62,84 +65,84 @@ function Re({
       )
     ), k(null);
   }
-  function pe(t) {
-    i(c.filter((s, n) => n !== t));
+  function he(t) {
+    p(d.filter((s, l) => l !== t));
   }
-  function he(t, s) {
-    i(
-      c.map(
-        (n, d) => d === t ? {
-          ...n,
+  function fe(t, s) {
+    p(
+      d.map(
+        (l, o) => o === t ? {
+          ...l,
           clear_on_parent_change: s,
-          clear_on_unavailable: n.clear_on_unavailable ?? !1
-        } : n
+          clear_on_unavailable: l.clear_on_unavailable ?? !1
+        } : l
       )
     );
   }
   function xe(t, s) {
-    i(c.map((n, d) => d === t ? { ...n, clear_on_unavailable: s } : n));
-  }
-  function fe(t, s) {
-    i(c.map((n, d) => d === t ? { ...n, show_all_if_no_parent: s } : n));
+    p(d.map((l, o) => o === t ? { ...l, clear_on_unavailable: s } : l));
   }
   function ue(t, s) {
-    i(c.map((n, d) => d === t ? { ...n, upstream: s } : n));
+    p(d.map((l, o) => o === t ? { ...l, show_all_if_no_parent: s } : l));
+  }
+  function be(t, s) {
+    p(d.map((l, o) => o === t ? { ...l, upstream: s } : l));
   }
   return /* @__PURE__ */ a("div", { className: "space-y-2", children: [
-    c.length > 0 && /* @__PURE__ */ e("div", { className: "space-y-2", children: c.map((t, s) => {
-      const n = f.find((l) => l.field === t.parent_field), d = (n == null ? void 0 : n.label) ?? t.parent_field, be = (n == null ? void 0 : n.kind) === "M2M";
+    d.length > 0 && /* @__PURE__ */ e("div", { className: "space-y-2", children: d.map((t, s) => {
+      const l = m.find((n) => n.field === t.parent_field), o = (l == null ? void 0 : l.label) ?? t.parent_field, ge = (l == null ? void 0 : l.kind) === "M2M";
       return I === s ? /* @__PURE__ */ a(
         "div",
         {
-          className: h(L, "space-y-3 p-3 ring-nvr-cyan/40 dark:ring-nvr-cyan/30"),
+          className: u(B, "space-y-3 p-3 ring-nvr-cyan/40 dark:ring-nvr-cyan/30"),
           children: [
             /* @__PURE__ */ a("div", { children: [
               /* @__PURE__ */ e("p", { className: "mb-1.5 text-[12px] text-slate-500 dark:text-muted-foreground", children: "Parent field" }),
-              /* @__PURE__ */ a(E, { open: ne, onOpenChange: D, children: [
-                /* @__PURE__ */ e(A, { asChild: !0, children: /* @__PURE__ */ a(
+              /* @__PURE__ */ a(E, { open: se, onOpenChange: D, children: [
+                /* @__PURE__ */ e(j, { asChild: !0, children: /* @__PURE__ */ a(
                   "button",
                   {
                     type: "button",
                     className: "flex h-8 w-full items-center justify-between rounded-md border border-slate-200 bg-white px-2.5 text-[13px] text-slate-700 hover:bg-muted dark:border-border dark:bg-background dark:text-foreground",
                     children: [
                       (() => {
-                        const l = f.find((ge) => ge.field === g);
-                        return l ? /* @__PURE__ */ a("span", { className: "flex items-center gap-1.5", children: [
-                          l.label,
-                          l.kind === "M2M" && /* @__PURE__ */ e("span", { className: "rounded px-1 py-0.5 text-[11px] font-semibold bg-amber-100 text-amber-700 dark:bg-amber-400/15 dark:text-amber-300", children: "M2M" })
+                        const n = m.find((Ne) => Ne.field === g);
+                        return n ? /* @__PURE__ */ a("span", { className: "flex items-center gap-1.5", children: [
+                          n.label,
+                          n.kind === "M2M" && /* @__PURE__ */ e("span", { className: "rounded px-1 py-0.5 text-[11px] font-semibold bg-amber-100 text-amber-700 dark:bg-amber-400/15 dark:text-amber-300", children: "M2M" })
                         ] }) : /* @__PURE__ */ e("span", { className: "text-slate-400", children: "Parent field…" });
                       })(),
                       /* @__PURE__ */ e(_, { className: "h-3 w-3 text-slate-400" })
                     ]
                   }
                 ) }),
-                /* @__PURE__ */ e(F, { className: "w-56 p-0", align: "start", children: /* @__PURE__ */ a(C, { children: [
-                  /* @__PURE__ */ e(w, { placeholder: "Search fields…", className: "h-8 text-[12px]" }),
-                  /* @__PURE__ */ a(M, { children: [
-                    /* @__PURE__ */ e(S, { className: "py-3 text-center text-[12px] text-slate-400", children: "No relation fields" }),
-                    /* @__PURE__ */ e(P, { children: f.map((l) => /* @__PURE__ */ a(
+                /* @__PURE__ */ e(F, { className: "w-56 p-0", align: "start", children: /* @__PURE__ */ a(w, { children: [
+                  /* @__PURE__ */ e(C, { placeholder: "Search fields…", className: "h-8 text-[12px]" }),
+                  /* @__PURE__ */ a(S, { children: [
+                    /* @__PURE__ */ e(M, { className: "py-3 text-center text-[12px] text-slate-400", children: "No relation fields" }),
+                    /* @__PURE__ */ e(P, { children: m.map((n) => /* @__PURE__ */ a(
                       O,
                       {
-                        value: l.label,
+                        value: n.label,
                         onSelect: () => {
-                          H(l.field), D(!1);
+                          H(n.field), D(!1);
                         },
                         className: "text-[12px]",
                         children: [
                           /* @__PURE__ */ e(
                             y,
                             {
-                              className: h(
+                              className: u(
                                 "mr-1.5 h-3 w-3 shrink-0",
-                                g === l.field ? "opacity-100" : "opacity-0"
+                                g === n.field ? "opacity-100" : "opacity-0"
                               )
                             }
                           ),
-                          /* @__PURE__ */ e("span", { className: "flex-1", children: l.label }),
-                          l.kind === "M2M" && /* @__PURE__ */ e("span", { className: "ml-1.5 rounded px-1 py-0.5 text-[11px] font-semibold bg-amber-100 text-amber-700 dark:bg-amber-400/15 dark:text-amber-300", children: "M2M" })
+                          /* @__PURE__ */ e("span", { className: "flex-1", children: n.label }),
+                          n.kind === "M2M" && /* @__PURE__ */ e("span", { className: "ml-1.5 rounded px-1 py-0.5 text-[11px] font-semibold bg-amber-100 text-amber-700 dark:bg-amber-400/15 dark:text-amber-300", children: "M2M" })
                         ]
                       },
-                      l.field
+                      n.field
                     )) })
                   ] })
                 ] }) })
@@ -148,10 +151,10 @@ function Re({
             /* @__PURE__ */ a("div", { "data-setting": "field.cascade_filters.filter_column", children: [
               /* @__PURE__ */ a("p", { className: "mb-1.5 text-[12px] text-slate-500 dark:text-muted-foreground", children: [
                 "Filter column on",
-                b ? ` ${b}` : " related table"
+                i ? ` ${i}` : " related table"
               ] }),
-              v.length > 0 ? /* @__PURE__ */ a(E, { open: se, onOpenChange: G, children: [
-                /* @__PURE__ */ e(A, { asChild: !0, children: /* @__PURE__ */ a(
+              v.length > 0 ? /* @__PURE__ */ a(E, { open: re, onOpenChange: G, children: [
+                /* @__PURE__ */ e(j, { asChild: !0, children: /* @__PURE__ */ a(
                   "button",
                   {
                     type: "button",
@@ -160,54 +163,54 @@ function Re({
                       /* @__PURE__ */ e(
                         "span",
                         {
-                          className: p ? "font-mono text-slate-700" : "text-slate-400",
-                          children: p || "Select column…"
+                          className: x ? "font-mono text-slate-700" : "text-slate-400",
+                          children: x || "Select column…"
                         }
                       ),
                       /* @__PURE__ */ e(_, { className: "h-3 w-3 text-slate-400" })
                     ]
                   }
                 ) }),
-                /* @__PURE__ */ e(F, { className: "w-52 p-0", align: "start", children: /* @__PURE__ */ a(C, { children: [
+                /* @__PURE__ */ e(F, { className: "w-52 p-0", align: "start", children: /* @__PURE__ */ a(w, { children: [
                   /* @__PURE__ */ e(
-                    w,
+                    C,
                     {
                       placeholder: "Search columns…",
                       className: "h-8 text-[12px]"
                     }
                   ),
-                  /* @__PURE__ */ a(M, { children: [
-                    /* @__PURE__ */ e(S, { className: "py-3 text-center text-[12px] text-slate-400", children: "No columns" }),
-                    /* @__PURE__ */ e(P, { children: v.map((l) => /* @__PURE__ */ a(
+                  /* @__PURE__ */ a(S, { children: [
+                    /* @__PURE__ */ e(M, { className: "py-3 text-center text-[12px] text-slate-400", children: "No columns" }),
+                    /* @__PURE__ */ e(P, { children: v.map((n) => /* @__PURE__ */ a(
                       O,
                       {
-                        value: l,
+                        value: n,
                         onSelect: () => {
-                          U(l), G(!1);
+                          U(n), G(!1);
                         },
                         className: "font-mono text-[12px]",
                         children: [
                           /* @__PURE__ */ e(
                             y,
                             {
-                              className: h(
+                              className: u(
                                 "mr-1.5 h-3 w-3 shrink-0",
-                                p === l ? "opacity-100" : "opacity-0"
+                                x === n ? "opacity-100" : "opacity-0"
                               )
                             }
                           ),
-                          l
+                          n
                         ]
                       },
-                      l
+                      n
                     )) })
                   ] })
                 ] }) })
               ] }) : /* @__PURE__ */ e(
                 te,
                 {
-                  value: p,
-                  onChange: (l) => U(l.target.value),
+                  value: x,
+                  onChange: (n) => U(n.target.value),
                   placeholder: "e.g. division_id",
                   className: "h-8 font-mono text-[12px]"
                 }
@@ -219,7 +222,7 @@ function Re({
                 "button",
                 {
                   type: "button",
-                  onClick: oe,
+                  onClick: me,
                   className: "rounded px-2 py-1 text-[12px] text-slate-500 hover:bg-muted",
                   children: "Cancel"
                 }
@@ -228,8 +231,8 @@ function Re({
                 ee,
                 {
                   size: "sm",
-                  disabled: !g || !p.trim(),
-                  onClick: me,
+                  disabled: !g || !x.trim(),
+                  onClick: pe,
                   className: "h-7 px-3 py-1.5 text-[12px]",
                   children: "Save"
                 }
@@ -238,36 +241,36 @@ function Re({
           ]
         },
         s
-      ) : /* @__PURE__ */ a("div", { className: h(L, "space-y-2 p-3"), children: [
+      ) : /* @__PURE__ */ a("div", { className: u(B, "space-y-2 p-3"), children: [
         /* @__PURE__ */ a(
           "div",
           {
             className: "flex items-center gap-1.5",
             "data-setting": "field.cascade_filters.parent_field",
             children: [
-              /* @__PURE__ */ e("span", { className: "text-[12px] font-medium text-slate-700 dark:text-foreground", children: d }),
-              be && /* @__PURE__ */ e("span", { className: "rounded px-1 py-0.5 text-[11px] font-semibold bg-amber-100 text-amber-700 dark:bg-amber-900/30 dark:text-amber-400", children: "M2M" }),
+              /* @__PURE__ */ e("span", { className: "text-[12px] font-medium text-slate-700 dark:text-foreground", children: o }),
+              ge && /* @__PURE__ */ e("span", { className: "rounded px-1 py-0.5 text-[11px] font-semibold bg-amber-100 text-amber-700 dark:bg-amber-900/30 dark:text-amber-400", children: "M2M" }),
               /* @__PURE__ */ e("span", { className: "flex-1" }),
               /* @__PURE__ */ e(
                 "button",
                 {
                   type: "button",
-                  onClick: () => ie(s),
+                  onClick: () => oe(s),
                   "aria-label": "Edit filter",
                   "data-tip": "Edit filter",
                   className: "inline-flex h-6 w-6 items-center justify-center rounded text-slate-500 transition-colors hover:bg-slate-200/60 hover:text-slate-700 dark:hover:bg-muted dark:hover:text-foreground",
-                  children: /* @__PURE__ */ e(Ne, { className: "h-3 w-3" })
+                  children: /* @__PURE__ */ e(ke, { className: "h-3 w-3" })
                 }
               ),
               /* @__PURE__ */ e(
                 "button",
                 {
                   type: "button",
-                  onClick: () => pe(s),
+                  onClick: () => he(s),
                   "aria-label": "Remove filter",
                   "data-tip": "Remove filter",
                   className: "inline-flex h-6 w-6 items-center justify-center rounded text-slate-500 transition-colors hover:bg-slate-200/60 hover:text-red-600 dark:hover:bg-muted dark:hover:text-red-400",
-                  children: /* @__PURE__ */ e(ke, { className: "h-3.5 w-3.5" })
+                  children: /* @__PURE__ */ e(ve, { className: "h-3.5 w-3.5" })
                 }
               )
             ]
@@ -286,11 +289,11 @@ function Re({
               /* @__PURE__ */ e("span", { className: "text-[12px] text-slate-600 dark:text-muted-foreground", children: "Clear on parent change" }),
               /* @__PURE__ */ e("span", { className: "flex-1" }),
               /* @__PURE__ */ e(
-                x,
+                b,
                 {
                   checked: t.clear_on_parent_change,
-                  onCheckedChange: (l) => he(s, l),
-                  className: j
+                  onCheckedChange: (n) => fe(s, n),
+                  className: A
                 }
               )
             ]
@@ -305,11 +308,11 @@ function Re({
               /* @__PURE__ */ e("span", { className: "text-[12px] text-slate-600 dark:text-muted-foreground", children: "Clear if value unavailable" }),
               /* @__PURE__ */ e("span", { className: "flex-1" }),
               /* @__PURE__ */ e(
-                x,
+                b,
                 {
                   checked: t.clear_on_unavailable ?? !1,
-                  onCheckedChange: (l) => xe(s, l),
-                  className: j
+                  onCheckedChange: (n) => xe(s, n),
+                  className: A
                 }
               )
             ]
@@ -324,11 +327,11 @@ function Re({
               /* @__PURE__ */ e("span", { className: "text-[12px] text-slate-600 dark:text-muted-foreground", children: "Show all options if parent not set" }),
               /* @__PURE__ */ e("span", { className: "flex-1" }),
               /* @__PURE__ */ e(
-                x,
+                b,
                 {
                   checked: t.show_all_if_no_parent ?? !0,
-                  onCheckedChange: (l) => fe(s, l),
-                  className: j
+                  onCheckedChange: (n) => ue(s, n),
+                  className: A
                 }
               )
             ]
@@ -350,47 +353,69 @@ function Re({
               ),
               /* @__PURE__ */ e("span", { className: "flex-1" }),
               /* @__PURE__ */ e(
-                x,
+                b,
                 {
                   checked: t.upstream ?? !1,
-                  onCheckedChange: (l) => ue(s, l),
-                  className: j
+                  onCheckedChange: (n) => be(s, n),
+                  className: A
                 }
               )
             ]
           }
+        ),
+        /* @__PURE__ */ e(
+          we,
+          {
+            kind: "cascade-filter",
+            sentences: ye(
+              t,
+              { field: "__picker", relatedCollection: i },
+              {
+                fields: {
+                  __picker: ae ?? "This picker",
+                  ...Object.fromEntries(m.map((n) => [n.field, n.label]))
+                },
+                relatedFields: i ? {
+                  [i]: Object.fromEntries(
+                    ((r == null ? void 0 : r.fields) ?? []).filter((n) => n.label).map((n) => [n.field, n.label])
+                  )
+                } : void 0,
+                collections: i && (r != null && r.display_name) ? { [i]: String(r.display_name) } : void 0
+              }
+            )
+          }
         )
       ] }, s);
     }) }),
-    !z && /* @__PURE__ */ a(
+    !L && /* @__PURE__ */ a(
       "button",
       {
         type: "button",
-        onClick: re,
+        onClick: ce,
         className: "flex items-center gap-1 text-[12px] font-medium text-sky-700 hover:underline dark:text-nvr-cyan",
         children: [
-          /* @__PURE__ */ e(ve, { className: "h-3 w-3" }),
-          c.length > 0 ? "Add another filter" : "Add cascade filter"
+          /* @__PURE__ */ e(_e, { className: "h-3 w-3" }),
+          d.length > 0 ? "Add another filter" : "Add cascade filter"
         ]
       }
     ),
-    z && /* @__PURE__ */ a(
+    L && /* @__PURE__ */ a(
       "div",
       {
-        className: h(L, "space-y-3 p-3"),
+        className: u(B, "space-y-3 p-3"),
         style: { transition: "opacity 150ms ease-out" },
         children: [
           /* @__PURE__ */ a("div", { children: [
             /* @__PURE__ */ e("p", { className: "mb-1.5 text-[12px] text-slate-500 dark:text-muted-foreground", children: "Parent field" }),
             /* @__PURE__ */ a(E, { open: le, onOpenChange: $, children: [
-              /* @__PURE__ */ e(A, { asChild: !0, children: /* @__PURE__ */ a(
+              /* @__PURE__ */ e(j, { asChild: !0, children: /* @__PURE__ */ a(
                 "button",
                 {
                   type: "button",
                   className: "flex h-8 w-full items-center justify-between rounded-md border border-slate-200 bg-white px-2.5 text-[13px] text-slate-700 hover:bg-muted dark:border-border dark:bg-background dark:text-foreground",
                   children: [
                     (() => {
-                      const t = f.find((s) => s.field === o);
+                      const t = m.find((s) => s.field === h);
                       return t ? /* @__PURE__ */ a("span", { className: "flex items-center gap-1.5", children: [
                         t.label,
                         t.kind === "M2M" && /* @__PURE__ */ e("span", { className: "rounded px-1 py-0.5 text-[11px] font-semibold bg-amber-100 text-amber-700 dark:bg-amber-400/15 dark:text-amber-300", children: "M2M" })
@@ -400,25 +425,25 @@ function Re({
                   ]
                 }
               ) }),
-              /* @__PURE__ */ e(F, { className: "w-56 p-0", align: "start", children: /* @__PURE__ */ a(C, { children: [
-                /* @__PURE__ */ e(w, { placeholder: "Search fields…", className: "h-8 text-[12px]" }),
-                /* @__PURE__ */ a(M, { children: [
-                  /* @__PURE__ */ e(S, { className: "py-3 text-center text-[12px] text-slate-400", children: "No relation fields" }),
-                  /* @__PURE__ */ e(P, { children: f.map((t) => /* @__PURE__ */ a(
+              /* @__PURE__ */ e(F, { className: "w-56 p-0", align: "start", children: /* @__PURE__ */ a(w, { children: [
+                /* @__PURE__ */ e(C, { placeholder: "Search fields…", className: "h-8 text-[12px]" }),
+                /* @__PURE__ */ a(S, { children: [
+                  /* @__PURE__ */ e(M, { className: "py-3 text-center text-[12px] text-slate-400", children: "No relation fields" }),
+                  /* @__PURE__ */ e(P, { children: m.map((t) => /* @__PURE__ */ a(
                     O,
                     {
                       value: t.label,
                       onSelect: () => {
-                        B(t.field), $(!1);
+                        T(t.field), $(!1);
                       },
                       className: "text-[12px]",
                       children: [
                         /* @__PURE__ */ e(
                           y,
                           {
-                            className: h(
+                            className: u(
                               "mr-1.5 h-3 w-3 shrink-0",
-                              o === t.field ? "opacity-100" : "opacity-0"
+                              h === t.field ? "opacity-100" : "opacity-0"
                             )
                           }
                         ),
@@ -431,44 +456,44 @@ function Re({
                 ] })
               ] }) })
             ] }),
-            o && ((Z = f.find((t) => t.field === o)) == null ? void 0 : Z.kind) === "M2M" && /* @__PURE__ */ e("p", { className: "mt-1 text-[11px] text-amber-600 dark:text-amber-400", children: "M2M parent: the first staged selection's value is used as the filter." })
+            h && ((Z = m.find((t) => t.field === h)) == null ? void 0 : Z.kind) === "M2M" && /* @__PURE__ */ e("p", { className: "mt-1 text-[11px] text-amber-600 dark:text-amber-400", children: "M2M parent: the first staged selection's value is used as the filter." })
           ] }),
           /* @__PURE__ */ a("div", { "data-setting": "field.cascade_filters.filter_column", children: [
             /* @__PURE__ */ a("p", { className: "mb-1.5 text-[12px] text-slate-500 dark:text-muted-foreground", children: [
               "Filter column on",
-              b ? ` ${b}` : " related table"
+              i ? ` ${i}` : " related table"
             ] }),
-            v.length > 0 ? /* @__PURE__ */ a(E, { open: ae, onOpenChange: T, children: [
-              /* @__PURE__ */ e(A, { asChild: !0, children: /* @__PURE__ */ a(
+            v.length > 0 ? /* @__PURE__ */ a(E, { open: ne, onOpenChange: z, children: [
+              /* @__PURE__ */ e(j, { asChild: !0, children: /* @__PURE__ */ a(
                 "button",
                 {
                   type: "button",
                   className: "flex h-8 w-full items-center justify-between rounded-md border border-slate-200 bg-white px-2.5 text-[13px] hover:bg-muted dark:border-border dark:bg-background",
                   children: [
-                    /* @__PURE__ */ e("span", { className: m ? "font-mono text-slate-700" : "text-slate-400", children: m || "Select column…" }),
+                    /* @__PURE__ */ e("span", { className: f ? "font-mono text-slate-700" : "text-slate-400", children: f || "Select column…" }),
                     /* @__PURE__ */ e(_, { className: "h-3 w-3 text-slate-400" })
                   ]
                 }
               ) }),
-              /* @__PURE__ */ e(F, { className: "w-52 p-0", align: "start", children: /* @__PURE__ */ a(C, { children: [
-                /* @__PURE__ */ e(w, { placeholder: "Search columns…", className: "h-8 text-[12px]" }),
-                /* @__PURE__ */ a(M, { children: [
-                  /* @__PURE__ */ e(S, { className: "py-3 text-center text-[12px] text-slate-400", children: "No columns" }),
+              /* @__PURE__ */ e(F, { className: "w-52 p-0", align: "start", children: /* @__PURE__ */ a(w, { children: [
+                /* @__PURE__ */ e(C, { placeholder: "Search columns…", className: "h-8 text-[12px]" }),
+                /* @__PURE__ */ a(S, { children: [
+                  /* @__PURE__ */ e(M, { className: "py-3 text-center text-[12px] text-slate-400", children: "No columns" }),
                   /* @__PURE__ */ e(P, { children: v.map((t) => /* @__PURE__ */ a(
                     O,
                     {
                       value: t,
                       onSelect: () => {
-                        R(t), T(!1);
+                        R(t), z(!1);
                       },
                       className: "font-mono text-[12px]",
                       children: [
                         /* @__PURE__ */ e(
                           y,
                           {
-                            className: h(
+                            className: u(
                               "mr-1.5 h-3 w-3 shrink-0",
-                              m === t ? "opacity-100" : "opacity-0"
+                              f === t ? "opacity-100" : "opacity-0"
                             )
                           }
                         ),
@@ -482,7 +507,7 @@ function Re({
             ] }) : /* @__PURE__ */ e(
               te,
               {
-                value: m,
+                value: f,
                 onChange: (t) => R(t.target.value),
                 placeholder: "e.g. division_id",
                 className: "h-8 font-mono text-[12px]"
@@ -492,7 +517,7 @@ function Re({
           /* @__PURE__ */ a("div", { className: "space-y-1.5", children: [
             /* @__PURE__ */ a("div", { className: "flex items-center gap-2", children: [
               /* @__PURE__ */ e(
-                x,
+                b,
                 {
                   checked: W,
                   onCheckedChange: X,
@@ -503,7 +528,7 @@ function Re({
             ] }),
             /* @__PURE__ */ a("div", { className: "flex items-center gap-2", children: [
               /* @__PURE__ */ e(
-                x,
+                b,
                 {
                   checked: q,
                   onCheckedChange: J,
@@ -514,7 +539,7 @@ function Re({
             ] }),
             /* @__PURE__ */ a("div", { className: "flex items-center gap-2", children: [
               /* @__PURE__ */ e(
-                x,
+                b,
                 {
                   checked: K,
                   onCheckedChange: Q,
@@ -530,7 +555,7 @@ function Re({
               "button",
               {
                 type: "button",
-                onClick: ce,
+                onClick: de,
                 className: "rounded px-2 py-1 text-[12px] text-slate-500 hover:bg-muted",
                 children: "Cancel"
               }
@@ -539,8 +564,8 @@ function Re({
               ee,
               {
                 size: "sm",
-                disabled: !o || !m.trim(),
-                onClick: de,
+                disabled: !h || !f.trim(),
+                onClick: ie,
                 className: "h-7 px-3 py-1.5 text-[12px]",
                 children: "Save"
               }
@@ -552,5 +577,5 @@ function Re({
   ] });
 }
 export {
-  Re as CascadeFiltersEditor
+  ze as CascadeFiltersEditor
 };