@nivaro/react 0.3.40 → 0.3.42

package/dist/shared/components/RecentRecordsRail.js

@@ -1,32 +1,50 @@
 import { jsxs as l, jsx as t } from "react/jsx-runtime";
-import { useQuery as d } from "@tanstack/react-query";
-import { Clock as m } from "lucide-react";
-import { useNivaroClient as p, useItemNavigation as x } from "../context.js";
+import { useQuery as m } from "@tanstack/react-query";
+import { Clock as p } from "lucide-react";
+import { useNivaroClient as h, useItemNavigation as x } from "../context.js";
 import { get as u } from "../lib/commands.js";
-import { titleCase as h, formatRelative as f, cn as b } from "../lib/utils.js";
-function R({
+import { usePrefetchIntent as f } from "../lib/prefetch.js";
+import { titleCase as b, formatRelative as w, cn as k } from "../lib/utils.js";
+import { ListSkeleton as v } from "./Skeletons.js";
+function q({
   limit: a = 8,
-  title: o = "Recently viewed",
+  title: s = "Recently viewed",
   className: r
 }) {
-  const c = p(), i = x(), { data: s = [], isLoading: n } = d({
+  const i = h(), n = x(), c = f(), { data: o = [], isLoading: d } = m({
     queryKey: ["recent-records", a],
-    queryFn: () => c.request(u("/record-views/recent", { limit: a })).then((e) => e.data ?? []).catch(() => []),
+    queryFn: () => i.request(u("/record-views/recent", { limit: a })).then((e) => e.data ?? []).catch(() => []),
     staleTime: 3e4
   });
-  return /* @__PURE__ */ l("div", { className: b("flex flex-col", r), "data-recent-records": !0, children: [
-    /* @__PURE__ */ t("div", { className: "mb-3 flex items-center justify-between", children: /* @__PURE__ */ t("h2", { className: "text-[11px] font-medium text-slate-500", children: o }) }),
-    /* @__PURE__ */ t("div", { className: "overflow-hidden rounded-xl border border-slate-200 bg-white dark:border-border dark:bg-card", children: n ? /* @__PURE__ */ t("p", { className: "px-4 py-3 text-[12px] text-slate-400", children: "Loading…" }) : s.length === 0 ? /* @__PURE__ */ t("p", { className: "px-4 py-3 text-[12px] text-slate-400", children: "Records you open will show up here." }) : /* @__PURE__ */ t("ul", { className: "divide-y divide-slate-100 dark:divide-border/60", children: s.map((e) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ l(
+  return /* @__PURE__ */ l("div", { className: k("flex flex-col", r), "data-recent-records": !0, children: [
+    /* @__PURE__ */ t("div", { className: "mb-3 flex items-center justify-between", children: /* @__PURE__ */ t("h2", { className: "text-[11px] font-medium text-slate-500", children: s }) }),
+    /* @__PURE__ */ t("div", { className: "overflow-hidden rounded-xl border border-slate-200 bg-white dark:border-border dark:bg-card", children: d ? (
+      // #3229 — rows at the real row height (label + collection line, state pill, time).
+      /* @__PURE__ */ t(
+        v,
+        {
+          header: !1,
+          rows: Math.min(a, 5),
+          rowClassName: "h-[49px] px-4",
+          columns: [
+            { key: "label", grow: 6 },
+            { key: "state", width: 64, shape: "badge" },
+            { key: "when", width: 40, shape: "short" }
+          ]
+        }
+      )
+    ) : o.length === 0 ? /* @__PURE__ */ t("p", { className: "px-4 py-3 text-[12px] text-slate-400", children: "Records you open will show up here." }) : /* @__PURE__ */ t("ul", { className: "divide-y divide-slate-100 dark:divide-border/60", children: o.map((e) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ l(
       "button",
       {
         type: "button",
-        onClick: () => i.open({ collection: e.collection, itemId: e.item_id }),
+        onClick: () => n.open({ collection: e.collection, itemId: e.item_id }),
+        ...c.record(e.collection, e.item_id),
         className: "flex w-full items-center gap-3 px-4 py-2 text-left transition-colors hover:bg-slate-50 dark:hover:bg-muted",
         "data-recent-record": `${e.collection}:${e.item_id}`,
         children: [
           /* @__PURE__ */ l("span", { className: "min-w-0 flex-1", children: [
             /* @__PURE__ */ t("span", { className: "block truncate text-[12.5px] font-medium text-slate-800 dark:text-slate-100", children: e.label }),
-            /* @__PURE__ */ t("span", { className: "block truncate text-[10.5px] text-slate-400", children: h(e.collection) })
+            /* @__PURE__ */ t("span", { className: "block truncate text-[10.5px] text-slate-400", children: b(e.collection) })
           ] }),
           e.state && /* @__PURE__ */ t(
             "span",
@@ -40,8 +58,8 @@ function R({
             }
           ),
           /* @__PURE__ */ l("span", { className: "inline-flex shrink-0 items-center gap-1 text-[10.5px] tabular-nums text-slate-400", children: [
-            /* @__PURE__ */ t(m, { className: "h-3 w-3" }),
-            f(e.last_viewed_at)
+            /* @__PURE__ */ t(p, { className: "h-3 w-3" }),
+            w(e.last_viewed_at)
           ] })
         ]
       }
@@ -49,5 +67,5 @@ function R({
   ] });
 }
 export {
-  R as RecentRecordsRail
+  q as RecentRecordsRail
 };