@nivaro/react 0.3.35 → 0.3.37

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

@@ -1,18 +1,19 @@
-import { jsxs as s, jsx as o, Fragment as L } from "react/jsx-runtime";
-import { X as R } from "lucide-react";
+import { jsxs as a, jsx as o, Fragment as R } from "react/jsx-runtime";
+import { X as L } from "lucide-react";
 import { useMemo as S } from "react";
 import { UNGROUPED_KEY as D } from "../../../lib/layout-ops.js";
-import { TipLayer as H } from "../../TipLayer.js";
-import { ArrangeButton as I } from "../ArrangeButton.js";
+import { TipLayer as E } from "../../TipLayer.js";
+import { ArrangeButton as H } from "../ArrangeButton.js";
 import { targetKey as N } from "../design-context.js";
-import { PlacementPresets as j } from "../entry/PlacementPresets.js";
-import { inPageOrder as z, selectedPlacements as B, fieldZones as E, isFieldRow as F, plural as g, widthOf as G, targetOfKey as O, keyOf as K, widthOps as U, GRID_WIDTHS as W, WIDTH_LABELS as $, flagOn as q, flagOps as A, moveToZoneOps as Z } from "../field-zones.js";
+import { PlacementPresets as I } from "../entry/PlacementPresets.js";
+import { inPageOrder as j, selectedPlacements as z, fieldZones as A, isFieldRow as B, plural as g, widthOf as F, targetOfKey as O, keyOf as G, widthOps as K, GRID_WIDTHS as U, WIDTH_LABELS as $, flagOn as W, flagOps as q, moveToZoneOps as Z } from "../field-zones.js";
 import { PanelHeader as V, PanelBody as X } from "../panel-frame.js";
 import { effectText as Y } from "../panel-style.js";
 import { slotName as J } from "../slot-names.js";
-import { useCollectionMeta as Q } from "./field-context.js";
-import { Setting as M, Segmented as ee, Toggle as te, Choice as oe } from "./kit.js";
-import { describeField as ne } from "./model.js";
+import { EvenRowAction as Q } from "./EvenRowAction.js";
+import { useCollectionMeta as ee } from "./field-context.js";
+import { Setting as M, Segmented as te, Toggle as oe, Choice as ne } from "./kit.js";
+import { describeField as re } from "./model.js";
 const le = [
   {
     k: "required",
@@ -36,32 +37,32 @@ const le = [
     effect: "Leaves them off this form; their values are kept."
   }
 ];
-function ve({
+function ye({
   bundle: r,
-  selection: f,
-  apply: d,
+  selection: i,
+  apply: m,
   collection: _,
   onSelection: h
 }) {
-  const { data: a } = Q(_), n = S(
-    () => z(r, B(r, f)),
-    [r, f]
-  ), k = S(() => E(r), [r]), b = (e) => e.startsWith("__") ? J(e) : ne(
+  const { data: s } = ee(_), n = S(
+    () => j(r, z(r, i)),
+    [r, i]
+  ), k = S(() => A(r), [r]), b = (e) => e.startsWith("__") ? J(e) : re(
     e,
-    (a == null ? void 0 : a.fields) ?? [],
-    (a == null ? void 0 : a.relations) ?? [],
+    (s == null ? void 0 : s.fields) ?? [],
+    (s == null ? void 0 : s.relations) ?? [],
     n.find((t) => t.field === e) ?? null
-  ).label, u = n.filter(F), m = f.length - n.length, p = g(n.length, "item"), x = new Set(n.map(G)), C = x.size === 1 ? String([...x][0]) : "", v = new Set(n.map((e) => e.group_key)), w = v.size === 1 ? P([...v][0] ?? null) : "", y = (e, t) => {
-    e.length && d(e, { label: t });
+  ).label, u = n.filter(B), d = i.length - n.length, p = g(n.length, "item"), x = new Set(n.map(F)), C = x.size === 1 ? String([...x][0]) : "", v = new Set(n.map((e) => e.group_key)), w = v.size === 1 ? P([...v][0] ?? null) : "", y = (e, t) => {
+    e.length && m(e, { label: t });
   };
-  return /* @__PURE__ */ s(
+  return /* @__PURE__ */ a(
     "div",
     {
       "data-inspector": "",
       "data-bulk-inspector": "",
       className: "flex h-full min-h-0 min-w-0 flex-col text-[12px]",
       children: [
-        /* @__PURE__ */ o(H, {}),
+        /* @__PURE__ */ o(E, {}),
         /* @__PURE__ */ o(
           V,
           {
@@ -70,8 +71,8 @@ function ve({
             sub: "Shift- or ⌘-click to add or take out"
           }
         ),
-        /* @__PURE__ */ s(X, { children: [
-          /* @__PURE__ */ o("ul", { className: "flex flex-wrap gap-1.5", "aria-label": "Selected", children: n.map((e) => /* @__PURE__ */ s(
+        /* @__PURE__ */ a(X, { children: [
+          /* @__PURE__ */ o("ul", { className: "flex flex-wrap gap-1.5", "aria-label": "Selected", children: n.map((e) => /* @__PURE__ */ a(
             "li",
             {
               className: "inline-flex max-w-full items-center gap-1 rounded-full bg-nvr-cyan/10 py-0.5 pl-2.5 pr-1 text-[12px] font-medium text-slate-800 dark:text-foreground",
@@ -83,53 +84,56 @@ function ve({
                     type: "button",
                     "aria-label": `Take ${b(e.field)} out of the selection`,
                     onClick: () => {
-                      const t = N(O(K(e)));
-                      h(f.filter((l) => N(l) !== t));
+                      const t = N(O(G(e)));
+                      h(i.filter((l) => N(l) !== t));
                     },
                     className: "inline-flex h-4 w-4 items-center justify-center rounded-full text-slate-500 hover:bg-nvr-cyan/20 hover:text-slate-800 dark:text-muted-foreground dark:hover:text-foreground",
-                    children: /* @__PURE__ */ o(R, { className: "h-3 w-3" })
+                    children: /* @__PURE__ */ o(L, { className: "h-3 w-3" })
                   }
                 )
               ]
             },
             `${e.field}:${e.group_key ?? ""}`
           )) }),
-          /* @__PURE__ */ s("div", { className: "flex flex-wrap items-center gap-2", children: [
-            /* @__PURE__ */ o(I, { targets: f }),
-            u.length > 0 && /* @__PURE__ */ o(j, { bundle: r, rows: u, apply: d })
+          /* @__PURE__ */ a("div", { className: "flex flex-wrap items-center gap-2", children: [
+            /* @__PURE__ */ o(H, { targets: i }),
+            u.length > 0 && /* @__PURE__ */ o(I, { bundle: r, rows: u, apply: m })
           ] }),
-          m > 0 && /* @__PURE__ */ s("p", { className: Y, children: [
-            g(m, "item"),
+          d > 0 && /* @__PURE__ */ a("p", { className: Y, children: [
+            g(d, "item"),
             " from the parent form ",
-            m === 1 ? "is" : "are",
+            d === 1 ? "is" : "are",
             " left out: override ",
-            m === 1 ? "it" : "them",
+            d === 1 ? "it" : "them",
             " on this form first."
           ] }),
-          n.length > 0 && /* @__PURE__ */ s(L, { children: [
-            /* @__PURE__ */ o(M, { k: "bulk.col_span", label: "Width", effect: "Share of the row each one takes.", children: /* @__PURE__ */ o(
-              ee,
-              {
-                value: C,
-                options: W.map((e) => ({ value: String(e), label: $[e] })),
-                onChange: (e) => y(
-                  U(n, Number(e)),
-                  `Set the width of ${p} to ${$[Number(e)]}`
-                )
-              }
-            ) }),
+          n.length > 0 && /* @__PURE__ */ a(R, { children: [
+            /* @__PURE__ */ a(M, { k: "bulk.col_span", label: "Width", effect: "Share of the row each one takes.", children: [
+              /* @__PURE__ */ o(
+                te,
+                {
+                  value: C,
+                  options: U.map((e) => ({ value: String(e), label: $[e] })),
+                  onChange: (e) => y(
+                    K(n, Number(e)),
+                    `Set the width of ${p} to ${$[Number(e)]}`
+                  )
+                }
+              ),
+              /* @__PURE__ */ o(Q, { bundle: r, targets: i, apply: m })
+            ] }),
             le.map((e) => {
               const t = e.k === "hidden" ? n : u;
               if (t.length === 0) return null;
-              const l = t.filter((i) => q(i, e.k)).length, c = g(t.length, e.k === "hidden" ? "item" : "field");
+              const l = t.filter((f) => W(f, e.k)).length, c = g(t.length, e.k === "hidden" ? "item" : "field");
               return /* @__PURE__ */ o(
-                te,
+                oe,
                 {
                   k: `bulk.${e.k}`,
                   label: e.label,
                   effect: l > 0 && l < t.length ? `${l} of ${t.length} now. ${e.effect}` : e.effect,
                   checked: l === t.length,
-                  onChange: (i) => y(A(t, e.k, i), (i ? e.on : e.off).replace("{n}", c))
+                  onChange: (f) => y(q(t, e.k, f), (f ? e.on : e.off).replace("{n}", c))
                 },
                 e.k
               );
@@ -141,7 +145,7 @@ function ve({
                 label: "Section",
                 effect: "Moves them to the end of that section, in the order they are on the form.",
                 children: /* @__PURE__ */ o(
-                  oe,
+                  ne,
                   {
                     ariaLabel: "Move to section",
                     value: w,
@@ -151,8 +155,8 @@ function ve({
                     ],
                     onChange: (e) => {
                       if (!e) return;
-                      const t = e === T ? null : e, l = k.find((i) => i.key === t), c = Z(r, n, t);
-                      c.ops.length && (d(c.ops, { label: `Move ${p} to ${(l == null ? void 0 : l.label) ?? "another section"}` }), h(c.moved.map(O)));
+                      const t = e === T ? null : e, l = k.find((f) => f.key === t), c = Z(r, n, t);
+                      c.ops.length && (m(c.ops, { label: `Move ${p} to ${(l == null ? void 0 : l.label) ?? "another section"}` }), h(c.moved.map(O)));
                     }
                   }
                 )
@@ -175,5 +179,5 @@ function ve({
 }
 const T = D, P = (r) => r ?? T;
 export {
-  ve as BulkInspector
+  ye as BulkInspector
 };

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

@@ -0,0 +1,31 @@
+import { jsxs as h, jsx as c } from "react/jsx-runtime";
+import { AlignHorizontalSpaceAround as p } from "lucide-react";
+import { useMemo as i } from "react";
+import { evenRowPlan as w, rowsToEven as f } from "../even-row.js";
+import { WIDTH_LABELS as u } from "../field-zones.js";
+function k({
+  bundle: t,
+  targets: o,
+  apply: l
+}) {
+  const e = i(() => w(t, o), [t, o]), s = i(() => e.ok ? f(t, o) : [], [e, t, o]);
+  if (!e.ok) return null;
+  const r = s.filter((a) => a.members.length > 1), n = r.length === 1 ? r[0] : null, m = n ? `Even out this row (${n.members.length} at ${u[n.width] ?? n.width})` : `Even out their ${r.length} rows`;
+  return /* @__PURE__ */ h(
+    "button",
+    {
+      type: "button",
+      "data-even-row": "",
+      "data-tip": "Every field in the row gets the same width, filling the row",
+      onClick: () => l(e.ops, { label: e.label }),
+      className: "inline-flex items-center gap-1.5 text-[12px] font-medium text-sky-700 hover:underline dark:text-nvr-cyan",
+      children: [
+        /* @__PURE__ */ c(p, { className: "h-3.5 w-3.5" }),
+        m
+      ]
+    }
+  );
+}
+export {
+  k as EvenRowAction
+};