@ai-matrx/associations 0.7.2 → 0.7.4

package/CHANGELOG.md

@@ -1,5 +1,26 @@
 # Changelog — @ai-matrx/associations
 
+## 0.7.4 — 2026-09-02 (bounded universal-picker results)
+
+- The universal picker now keeps type filters in one horizontally scrollable
+  rail instead of wrapping the full token cloud through the results viewport.
+- Search results retain a labelled, minimum-height vertical region inside
+  bounded desktop and mobile hosts, so a visible candidate remains reachable
+  and its attach button can enter the normal attach/detach lifecycle.
+- A failing-then-passing constrained-layout regression searches and activates
+  `Canary Usage Confirmation` at 1440×900 and 390×844, then proves the control
+  flips from Attach to Detach. Full package suite: 193 tests.
+
+## 0.7.3 — 2026-09-01 (favorites surface in universal recents)
+
+- Empty-query universal pickers now include a newly favorited entity even when
+  no detail route has stamped `last_viewed_at` yet. Previously the canonical
+  favorite write succeeded but the picker silently filtered the row out.
+- Favorites sort ahead of ordinary recents, with view recency preserving the
+  order inside each group.
+- A failing-then-passing hook regression covers a favorite with no viewed
+  timestamp alongside an ordinary recent item. Full package suite: 191 tests.
+
 ## 0.7.2 — 2026-09-01 (verified republish of universal-search repair)
 
 - Republishes the 0.7.1 reference-pickable universal-search repair under a

package/dist/react/index.cjs

@@ -1472,8 +1472,11 @@ async function loadRecents(store, tokens) {
   if (!res.ok) return [];
   const tokenSet = new Set(tokens);
   const rows = res.data.items.filter(
-    (i) => tokenSet.has(i.entityType) && isEntityTypeToken(i.entityType) && i.lastViewedAt
-  ).sort((a, b) => (b.lastViewedAt ?? "").localeCompare(a.lastViewedAt ?? "")).slice(0, RECENTS_LIMIT);
+    (i) => tokenSet.has(i.entityType) && isEntityTypeToken(i.entityType) && (i.isFavorite || i.lastViewedAt)
+  ).sort((a, b) => {
+    if (a.isFavorite !== b.isFavorite) return a.isFavorite ? -1 : 1;
+    return (b.lastViewedAt ?? "").localeCompare(a.lastViewedAt ?? "");
+  }).slice(0, RECENTS_LIMIT);
   if (rows.length === 0) return [];
   const byToken = /* @__PURE__ */ new Map();
   for (const r of rows) {
@@ -2535,27 +2538,35 @@ function UniversalAssociationPicker(props) {
       ),
       loading && browseToken === null && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SpinnerIcon, { className: "absolute right-2.5 top-1/2 h-4 w-4 -translate-y-1/2 animate-spin text-muted-foreground" })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "flex flex-wrap gap-1", children: tokens.map((t) => {
-      const info = store.registry.getEntityInfo(t);
-      const ChipIcon = info.Icon ?? DefaultEntityIcon;
-      const active = browseToken === t;
-      return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
-        "button",
-        {
-          type: "button",
-          onClick: () => setBrowseToken(active ? null : t),
-          className: (0, import_design_system4.cn)(
-            "inline-flex items-center gap-1 rounded-md border px-1.5 py-0.5 text-[11px] transition-colors",
-            active ? "border-primary/50 bg-primary/10 text-foreground" : "border-border text-muted-foreground hover:text-foreground hover:bg-accent"
-          ),
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ChipIcon, { className: "h-3 w-3" }),
-            info.labelPlural
-          ]
-        },
-        t
-      );
-    }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+      "div",
+      {
+        role: "group",
+        "aria-label": "Entity type filters",
+        className: "flex shrink-0 flex-nowrap gap-1 overflow-x-auto pb-1",
+        children: tokens.map((t) => {
+          const info = store.registry.getEntityInfo(t);
+          const ChipIcon = info.Icon ?? DefaultEntityIcon;
+          const active = browseToken === t;
+          return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+            "button",
+            {
+              type: "button",
+              onClick: () => setBrowseToken(active ? null : t),
+              className: (0, import_design_system4.cn)(
+                "inline-flex shrink-0 items-center gap-1 rounded-md border px-1.5 py-0.5 text-[11px] transition-colors",
+                active ? "border-primary/50 bg-primary/10 text-foreground" : "border-border text-muted-foreground hover:text-foreground hover:bg-accent"
+              ),
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ChipIcon, { className: "h-3 w-3" }),
+                info.labelPlural
+              ]
+            },
+            t
+          );
+        })
+      }
+    ),
     browseToken && BrowseOverride ? (
       // The token's canonical host picker (e.g. the stored-files browser)
       // owns per-token browsing when registered — never a plain list twin.
@@ -2588,71 +2599,79 @@ function UniversalAssociationPicker(props) {
         onAttach: (id, title) => onAttach(browseToken, id, title),
         onDetach: (id) => onDetach(browseToken, id)
       }
-    ) }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "-mx-1 min-h-0 flex-1 overflow-y-auto px-1", children: results.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { className: "py-6 text-center text-[12px] text-muted-foreground", children: loading ? "Searching\u2026" : query.trim() ? "No matches \u2014 narrow with a type chip to browse." : "No recent items. Type to search, or pick a type to browse." }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "space-y-2", children: [
-      isRecents && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { className: "px-1 text-[10px] font-medium uppercase tracking-wider text-muted-foreground/60", children: "Recent" }),
-      [...groups.entries()].map(([token, items]) => {
-        const info = store.registry.getEntityInfo(token);
-        const GroupIcon = info.Icon ?? DefaultEntityIcon;
-        return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "space-y-0.5", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("p", { className: "flex items-center gap-1 px-1 text-[10px] font-medium uppercase tracking-wider text-muted-foreground/70", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(GroupIcon, { className: "h-3 w-3" }),
-            info.labelPlural
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("ul", { className: "space-y-0.5", children: items.map((c) => {
-            const key = attachedKey(c.token, c.id);
-            const attached = attachedKeys.has(key);
-            const busy = busyKey === key;
-            return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
-              "li",
-              {
-                className: (0, import_design_system4.cn)(
-                  "group/entity-ref group flex items-center gap-1 rounded-md pr-1.5 transition-colors",
-                  "hover:bg-accent",
-                  attached && "bg-accent/40"
-                ),
-                children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
-                    "button",
-                    {
-                      type: "button",
-                      disabled: busy,
-                      onClick: () => toggle(c),
-                      title: attached ? `Detach "${c.title}"` : `Attach "${c.title}"`,
-                      className: (0, import_design_system4.cn)(
-                        "flex min-w-0 flex-1 items-center gap-2 rounded-md px-2.5 py-1.5 text-left text-sm",
-                        "disabled:opacity-50"
+    ) }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+      "div",
+      {
+        role: "region",
+        "aria-label": "Association search results",
+        className: "-mx-1 min-h-24 flex-1 overflow-y-auto overscroll-contain px-1",
+        children: results.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { className: "py-6 text-center text-[12px] text-muted-foreground", children: loading ? "Searching\u2026" : query.trim() ? "No matches \u2014 narrow with a type chip to browse." : "No recent items. Type to search, or pick a type to browse." }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "space-y-2", children: [
+          isRecents && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { className: "px-1 text-[10px] font-medium uppercase tracking-wider text-muted-foreground/60", children: "Recent" }),
+          [...groups.entries()].map(([token, items]) => {
+            const info = store.registry.getEntityInfo(token);
+            const GroupIcon = info.Icon ?? DefaultEntityIcon;
+            return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "space-y-0.5", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("p", { className: "flex items-center gap-1 px-1 text-[10px] font-medium uppercase tracking-wider text-muted-foreground/70", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(GroupIcon, { className: "h-3 w-3" }),
+                info.labelPlural
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("ul", { className: "space-y-0.5", children: items.map((c) => {
+                const key = attachedKey(c.token, c.id);
+                const attached = attachedKeys.has(key);
+                const busy = busyKey === key;
+                return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+                  "li",
+                  {
+                    className: (0, import_design_system4.cn)(
+                      "group/entity-ref group flex items-center gap-1 rounded-md pr-1.5 transition-colors",
+                      "hover:bg-accent",
+                      attached && "bg-accent/40"
+                    ),
+                    children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+                        "button",
+                        {
+                          type: "button",
+                          disabled: busy,
+                          onClick: () => toggle(c),
+                          title: attached ? `Detach "${c.title}"` : `Attach "${c.title}"`,
+                          className: (0, import_design_system4.cn)(
+                            "flex min-w-0 flex-1 items-center gap-2 rounded-md px-2.5 py-1.5 text-left text-sm",
+                            "disabled:opacity-50"
+                          ),
+                          children: [
+                            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "min-w-0 flex-1 truncate text-foreground", children: c.title }),
+                            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+                              "span",
+                              {
+                                className: (0, import_design_system4.cn)(
+                                  "flex h-5 w-5 shrink-0 items-center justify-center rounded-full",
+                                  attached ? "bg-primary text-primary-foreground" : "border border-border text-muted-foreground group-hover:border-primary/60"
+                                ),
+                                children: busy ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SpinnerIcon, { className: "h-3 w-3 animate-spin" }) : attached ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(CheckIcon, { className: "h-3 w-3" }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(PlusIcon, { className: "h-3 w-3" })
+                              }
+                            )
+                          ]
+                        }
                       ),
-                      children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "min-w-0 flex-1 truncate text-foreground", children: c.title }),
-                        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-                          "span",
-                          {
-                            className: (0, import_design_system4.cn)(
-                              "flex h-5 w-5 shrink-0 items-center justify-center rounded-full",
-                              attached ? "bg-primary text-primary-foreground" : "border border-border text-muted-foreground group-hover:border-primary/60"
-                            ),
-                            children: busy ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SpinnerIcon, { className: "h-3 w-3 animate-spin" }) : attached ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(CheckIcon, { className: "h-3 w-3" }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(PlusIcon, { className: "h-3 w-3" })
-                          }
-                        )
-                      ]
-                    }
-                  ),
-                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-                    DoorControlsSlot,
-                    {
-                      token: c.token,
-                      id: c.id,
-                      name: c.title
-                    }
-                  )
-                ]
-              },
-              key
-            );
-          }) })
-        ] }, token);
-      })
-    ] }) })
+                      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+                        DoorControlsSlot,
+                        {
+                          token: c.token,
+                          id: c.id,
+                          name: c.title
+                        }
+                      )
+                    ]
+                  },
+                  key
+                );
+              }) })
+            ] }, token);
+          })
+        ] })
+      }
+    )
   ] });
 }