@nivaro/react 0.3.40 → 0.3.42

package/dist/shared/components/ConfigHistory.js

@@ -0,0 +1,153 @@
+import { jsxs as i, Fragment as H, jsx as t } from "react/jsx-runtime";
+import { useInfiniteQuery as S } from "@tanstack/react-query";
+import { History as C } from "lucide-react";
+import { useState as B } from "react";
+import { useNivaroClient as T, useNavigation as _ } from "../context.js";
+import { get as j } from "../lib/commands.js";
+import { cn as m, formatRelative as q, formatDateTime as E } from "../lib/utils.js";
+import { AgentBadge as F } from "./AgentBadge.js";
+import { Button as N } from "./ui/button.js";
+import { Sheet as D, SheetContent as L, SheetHeader as U, SheetTitle as A, SheetDescription as O } from "./ui/sheet.js";
+const R = {
+  create: "created this",
+  update: "changed this",
+  delete: "deleted this",
+  revert: "reverted a change",
+  restore: "restored this"
+};
+function z(a) {
+  return [a.first_name, a.last_name].filter(Boolean).join(" ").trim() || a.user_email || (a.user ? "Someone" : "The system");
+}
+function G(a) {
+  var l;
+  const n = R[a.action] ?? a.action.replace(/[-_]/g, " "), s = (l = a.comment) != null && l.trim() ? a.comment.trim() : null;
+  return { who: z(a), what: n, detail: s };
+}
+const I = 20;
+function K({
+  collection: a,
+  item: n,
+  className: s,
+  pageSize: l = I
+}) {
+  var p, x, g;
+  const h = T(), d = _(), u = n == null ? "" : String(n), o = S({
+    queryKey: ["nvr-config-history", a, u, l],
+    enabled: !!u,
+    initialPageParam: 0,
+    queryFn: ({ pageParam: e }) => h.request(
+      j("/activity", { collection: a, item: u, limit: l, offset: e })
+    ).then((r) => r),
+    getNextPageParam: (e, r) => {
+      var y;
+      const c = r.reduce((w, P) => {
+        var v;
+        return w + (((v = P.data) == null ? void 0 : v.length) ?? 0);
+      }, 0);
+      return c < (e.total ?? 0) && (((y = e.data) == null ? void 0 : y.length) ?? 0) > 0 ? c : void 0;
+    },
+    staleTime: 15e3
+  }), f = ((p = o.data) == null ? void 0 : p.pages.flatMap((e) => e.data ?? [])) ?? [], b = ((g = (x = o.data) == null ? void 0 : x.pages[0]) == null ? void 0 : g.total) ?? 0, k = (e) => {
+    const r = `/activity/${e}`;
+    return d.consoleUrl ? d.consoleUrl(r) : r;
+  };
+  return u ? o.isLoading ? /* @__PURE__ */ t("div", { className: m("space-y-2", s), "aria-busy": "true", "data-config-history-loading": !0, children: [0, 1, 2].map((e) => /* @__PURE__ */ t("div", { className: "h-10 animate-pulse rounded-md bg-slate-100 dark:bg-muted" }, e)) }) : o.isError ? /* @__PURE__ */ t("p", { className: m("text-[12px] text-red-600 dark:text-red-400", s), children: "History could not be loaded." }) : f.length === 0 ? /* @__PURE__ */ t("p", { className: m("text-[12px] text-slate-500 dark:text-slate-400", s), children: "No changes recorded yet." }) : /* @__PURE__ */ i("div", { className: m("flex flex-col gap-2", s), "data-config-history": !0, children: [
+    /* @__PURE__ */ t("ol", { className: "divide-y divide-slate-100 rounded-md border border-slate-200 bg-white dark:divide-border/60 dark:border-border dark:bg-card", children: f.map((e) => {
+      const r = G(e), c = k(e.id);
+      return /* @__PURE__ */ i("li", { className: "px-3 py-2", "data-config-history-entry": e.id, children: [
+        /* @__PURE__ */ i("div", { className: "flex items-baseline gap-2 text-[12.5px]", children: [
+          /* @__PURE__ */ i("span", { className: "min-w-0 truncate text-slate-800 dark:text-slate-100", children: [
+            /* @__PURE__ */ t("span", { className: "font-medium", children: r.who }),
+            " ",
+            r.what
+          ] }),
+          /* @__PURE__ */ t(F, { label: e.via_agent }),
+          /* @__PURE__ */ t(
+            "time",
+            {
+              className: "ml-auto shrink-0 text-[11px] text-slate-500 dark:text-slate-400",
+              dateTime: e.timestamp,
+              "data-tip": E(e.timestamp),
+              children: q(e.timestamp)
+            }
+          )
+        ] }),
+        (r.detail || c) && /* @__PURE__ */ i("div", { className: "mt-0.5 flex items-start gap-2 text-[11.5px] text-slate-500 dark:text-slate-400", children: [
+          r.detail && /* @__PURE__ */ t("p", { className: "min-w-0 flex-1 break-words", children: r.detail }),
+          c && /* @__PURE__ */ t(
+            "button",
+            {
+              type: "button",
+              className: "ml-auto shrink-0 text-nvr-navy hover:underline dark:text-nvr-cyan",
+              onClick: () => d.navigate(c),
+              children: "Details"
+            }
+          )
+        ] })
+      ] }, e.id);
+    }) }),
+    /* @__PURE__ */ i("div", { className: "flex items-center justify-between text-[11.5px] text-slate-500 dark:text-slate-400", children: [
+      /* @__PURE__ */ i("span", { children: [
+        f.length,
+        " of ",
+        b
+      ] }),
+      o.hasNextPage && /* @__PURE__ */ t(
+        N,
+        {
+          variant: "outline",
+          size: "sm",
+          className: "h-7 text-[12px]",
+          disabled: o.isFetchingNextPage,
+          onClick: () => void o.fetchNextPage(),
+          children: o.isFetchingNextPage ? "Loading…" : "Show older"
+        }
+      )
+    ] })
+  ] }) : /* @__PURE__ */ t("p", { className: m("text-[12px] text-slate-500 dark:text-slate-400", s), children: "History starts once this is saved." });
+}
+function te({
+  collection: a,
+  item: n,
+  title: s = "History",
+  className: l
+}) {
+  const [h, d] = B(!1);
+  return n == null || n === "" || n === "new" ? null : /* @__PURE__ */ i(H, { children: [
+    /* @__PURE__ */ i(
+      N,
+      {
+        type: "button",
+        variant: "outline",
+        size: "sm",
+        className: m("h-8 gap-1.5 text-[12px]", l),
+        onClick: () => d(!0),
+        "data-config-history-button": !0,
+        children: [
+          /* @__PURE__ */ t(C, { className: "h-3.5 w-3.5" }),
+          "History"
+        ]
+      }
+    ),
+    /* @__PURE__ */ t(D, { open: h, onOpenChange: d, children: /* @__PURE__ */ i(
+      L,
+      {
+        side: "right",
+        className: "flex w-full flex-col gap-3 overflow-y-auto sm:max-w-md",
+        children: [
+          /* @__PURE__ */ i(U, { children: [
+            /* @__PURE__ */ t(A, { children: s }),
+            /* @__PURE__ */ t(O, { children: "Every change recorded for this, newest first." })
+          ] }),
+          h && /* @__PURE__ */ t(K, { collection: a, item: n })
+        ]
+      }
+    ) })
+  ] });
+}
+export {
+  K as ConfigHistory,
+  te as ConfigHistoryButton,
+  G as configHistoryLine,
+  z as entryPerson
+};

package/dist/shared/components/ConfigReadBack.js

@@ -0,0 +1,65 @@
+import { jsx as r, jsxs as a } from "react/jsx-runtime";
+import { Info as o } from "lucide-react";
+import { createContext as s, useContext as i } from "react";
+import { cn as d } from "../lib/utils.js";
+import { Popover as c, PopoverTrigger as m, PopoverContent as u } from "./ui/popover.js";
+function v({
+  sentences: e,
+  className: t,
+  kind: n
+}) {
+  const l = (Array.isArray(e) ? e : e ? [e] : []).filter(Boolean);
+  return l.length ? /* @__PURE__ */ r(
+    "p",
+    {
+      "data-config-readback": n ?? "",
+      className: d("text-[12px] leading-snug text-slate-500 dark:text-slate-400", t),
+      children: l.join(" ")
+    }
+  ) : null;
+}
+function p({ source: e }) {
+  return /* @__PURE__ */ a("div", { "data-field-source-body": "", className: "space-y-1.5 text-[12px] leading-snug", children: [
+    /* @__PURE__ */ r("p", { className: "font-medium text-slate-900 dark:text-foreground", children: e.sentence }),
+    e.notes.map((t) => /* @__PURE__ */ r("p", { className: "text-slate-500 dark:text-slate-400", children: t }, t)),
+    e.inputs.length > 0 && /* @__PURE__ */ a("p", { className: "text-slate-500 dark:text-slate-400", children: [
+      "Reads:",
+      " ",
+      /* @__PURE__ */ r("span", { className: "text-slate-700 dark:text-slate-300", children: e.inputs.join(", ") })
+    ] })
+  ] });
+}
+function y({ source: e, label: t }) {
+  return /* @__PURE__ */ a(c, { children: [
+    /* @__PURE__ */ r(m, { asChild: !0, children: /* @__PURE__ */ r(
+      "button",
+      {
+        type: "button",
+        "data-field-source": "",
+        "aria-label": `Where ${t} comes from`,
+        "data-tip": "Where this value comes from",
+        className: "inline-flex h-4 w-4 items-center justify-center rounded text-slate-400 hover:bg-muted hover:text-slate-600 dark:hover:text-slate-200",
+        children: /* @__PURE__ */ r(o, { className: "h-3.5 w-3.5" })
+      }
+    ) }),
+    /* @__PURE__ */ a(u, { align: "start", className: "w-[300px] p-3", children: [
+      /* @__PURE__ */ a("p", { className: "mb-1.5 text-[11px] font-medium uppercase tracking-wide text-slate-400", children: [
+        "Where ",
+        t,
+        " comes from"
+      ] }),
+      /* @__PURE__ */ r(p, { source: e })
+    ] })
+  ] });
+}
+const x = s(null), b = (e) => {
+  var t;
+  return ((t = i(x)) == null ? void 0 : t[e]) ?? null;
+};
+export {
+  v as ConfigReadBack,
+  p as FieldSourceBody,
+  y as FieldSourceInfo,
+  x as FieldSourcesContext,
+  b as useFieldSource
+};